.companion-life{margin:16px 0;padding:14px 16px;border:1px solid rgba(115,104,98,.18);border-radius:20px;background:rgba(250,248,245,.55);color:inherit}
.companion-life>summary{font-size:14px;font-weight:600;cursor:pointer;padding:2px 0;list-style-position:inside}
.companion-life-body{padding-top:10px}.companion-life .setting-switch{padding:10px 0!important;background:none!important;border-radius:0!important}
.companion-life .setting-switch strong{font-size:14px}.companion-life .setting-switch small{font-size:11px;line-height:1.6}
.companion-life-threshold{display:flex!important;align-items:center;justify-content:space-between;gap:12px;font-size:13px;margin:8px 0}
.companion-life-threshold input{width:80px!important;min-width:0!important;padding:7px 9px!important;font:inherit!important;border:1px solid rgba(115,104,98,.25)!important;border-radius:10px!important;background:rgba(255,255,255,.5)!important;color:inherit}
.companion-life-phase,.companion-life-status{font-size:11px!important;line-height:1.7!important;color:inherit;opacity:.65;margin:12px 0}
.companion-life-bars{display:grid;gap:12px;margin:16px 0}.companion-life-row{display:grid;grid-template-columns:42px minmax(40px,1fr) 62px;gap:10px;align-items:center;font-size:12px}
.companion-life-track{position:relative;height:5px;border-radius:8px;background:rgba(115,104,98,.12);overflow:visible}
.companion-life-fill{display:block;height:100%;border-radius:inherit;background:#86736e}
.companion-life-base{position:absolute;top:-3px;height:11px;width:1px;background:currentColor;opacity:.7}
.companion-life-value{text-align:right;font-size:10px;opacity:.7}.companion-life-metrics{font-size:12px;padding:10px 0}
.companion-life-metrics summary{cursor:pointer;opacity:.8}.companion-life-metrics ol{padding:4px 0;margin:4px 0;list-style:none;max-height:260px;overflow:auto}
.companion-life-metrics li{display:flex;justify-content:space-between;gap:8px;padding:10px 0;border-bottom:1px solid rgba(115,104,98,.12);flex-wrap:wrap}
.companion-life-metrics li small{font-size:10px;opacity:.6}.companion-life-note{display:block;font-size:10px;opacity:.55;line-height:1.8;margin-top:10px}
.companion-life-open{display:block;margin:4px 0 0;padding:8px 14px;border:1px solid rgba(115,104,98,.25);border-radius:999px;background:rgba(255,255,255,.45);color:inherit;font:inherit;font-size:12px;cursor:pointer}
.cl-page{--cl-paper:#f4f4f2;--cl-ink:#161616;--cl-muted:#8b8b88;--cl-faint:#c9c9c5;--cl-line:#dddddb;--cl-mark:#1c1c1c;--cl-soft:rgba(22,22,22,.07);--cl-ghost:rgba(22,22,22,.05);--cl-recall:#1c1c1c;--cl-fantasy:#1c1c1c;--cl-mix:#1c1c1c;
 --cl-serif:'Songti TC','Songti SC','STSong','Noto Serif CJK SC','Source Han Serif SC',Georgia,serif;
 position:fixed;inset:0;z-index:2400;overflow-y:auto;-webkit-overflow-scrolling:touch;color:var(--cl-ink);font-family:var(--cl-serif);
 background:radial-gradient(90% 70% at 50% 45%,#fdfdfc 0%,var(--cl-paper) 62%,#e9e9e6 100%) fixed var(--cl-paper);animation:cl-in .5s ease both}
html[data-theme=dark] .cl-page{--cl-paper:#141414;--cl-ink:#ecebe8;--cl-muted:#8f8e8a;--cl-faint:#4a4a48;--cl-line:#2c2c2b;--cl-mark:#ecebe8;--cl-soft:rgba(236,235,232,.08);--cl-ghost:rgba(236,235,232,.045);--cl-recall:#ecebe8;--cl-fantasy:#ecebe8;--cl-mix:#ecebe8;
 background:radial-gradient(90% 70% at 50% 45%,#1e1e1e 0%,var(--cl-paper) 70%) fixed var(--cl-paper)}
@keyframes cl-in{from{opacity:0;filter:blur(6px)}to{opacity:1;filter:none}}
.cl-ghost{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.cl-ghost span{position:absolute;font:400 clamp(200px,58vw,340px)/1 var(--cl-serif);color:var(--cl-ghost);text-shadow:0 0 6px var(--cl-ghost);user-select:none}
.cl-ghost-a{left:-.28em;top:4vh}.cl-ghost-b{right:-.3em;bottom:-.12em}
.cl-top,.cl-body{position:relative;z-index:1}
.cl-top{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:72px 1fr 72px;align-items:center;padding:calc(env(safe-area-inset-top,0px) + 10px) 16px 10px;background:linear-gradient(var(--cl-paper) 70%,transparent)}
.cl-back{justify-self:start;border:0;background:none;color:var(--cl-ink);font:inherit;font-size:15px;padding:8px 4px;cursor:pointer}
.cl-title{text-align:center}.cl-title h2{margin:0;font:400 20px/1.2 var(--cl-serif)!important;color:var(--cl-ink)!important;letter-spacing:.14em}
.cl-title small{display:block;font:italic 10px/1.6 Georgia,serif;color:var(--cl-muted);letter-spacing:.18em}
.cl-ink{display:inline-block;transition:opacity .3s}
.cl-ink-0{font-weight:700}.cl-ink-1{font-weight:300;opacity:.72;transform:translateY(.18em)}
.cl-ink-2{font-weight:400;opacity:.45;filter:blur(.6px);transform:translateY(-.08em)}.cl-ink-3{font-weight:600;opacity:.85;transform:translateY(.1em)}
.cl-body{max-width:520px;margin:0 auto;padding:4px 20px calc(env(safe-area-inset-bottom,0px) + 40px);display:grid;gap:8px}
.cl-hero{display:grid;grid-template-columns:1fr minmax(150px,200px);align-items:center;gap:6px;padding:18px 0 26px}
.cl-hero-words small{font-size:11px;color:var(--cl-muted);letter-spacing:.14em}
.cl-hero-words strong{display:block;margin:10px 0 14px;font:400 64px/1 var(--cl-serif);letter-spacing:-.02em}
.cl-hero-words strong .cl-ink-1{font-size:.82em;transform:translate(-.06em,.42em)}
.cl-hero-words p{margin:0;font-size:11px;line-height:1.8;color:var(--cl-muted);letter-spacing:.06em}
.cl-dial{width:100%;height:auto;overflow:visible}.cl-dial-arc{fill:none;stroke:var(--cl-faint);stroke-width:2;stroke-linecap:round}
.cl-dial-arc.is-current{stroke:var(--cl-mark);stroke-width:3.5}.cl-dial-tick{stroke:var(--cl-muted);stroke-width:1;opacity:.45}
.cl-dial-label{font:11px var(--cl-serif);fill:var(--cl-muted);letter-spacing:.1em}.cl-dial-label.is-current{fill:var(--cl-ink);font-weight:700}
.cl-dial-hour{font:10px Georgia,serif;fill:var(--cl-muted)}.cl-dial-hand{stroke:var(--cl-mark);stroke-width:1.5;stroke-linecap:round}
.cl-dial-now{fill:var(--cl-mark);stroke:var(--cl-paper);stroke-width:2}.cl-dial-pin{fill:var(--cl-mark)}
.cl-card{padding:22px 0 18px;border-top:1px solid var(--cl-line)}
.cl-card-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-bottom:12px}
.cl-card-head h3{margin:0;font:400 22px/1.3 var(--cl-serif);color:var(--cl-ink);letter-spacing:.02em}
.cl-card-head small{font-size:10px;color:var(--cl-muted);text-align:right;letter-spacing:.06em;padding-bottom:4px}
.cl-radar{display:block;width:100%;max-width:320px;height:auto;margin:0 auto;overflow:visible}
.cl-radar-grid{fill:none;stroke:var(--cl-line);stroke-width:1}.cl-radar-axis{stroke:var(--cl-line);stroke-width:1}
.cl-radar-label{font:12px var(--cl-serif);fill:var(--cl-ink)}.cl-radar-value{font:10px Georgia,serif;fill:var(--cl-muted)}
.cl-radar-base{fill:none;stroke:var(--cl-muted);stroke-width:1;stroke-dasharray:3 4}
.cl-radar-now{fill:var(--cl-soft);stroke:var(--cl-mark);stroke-width:1.5;stroke-linejoin:round}
.cl-radar-dot{fill:var(--cl-mark);stroke:var(--cl-paper);stroke-width:2}
.cl-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin-top:10px;font-size:11px;color:var(--cl-muted);letter-spacing:.06em}
.cl-legend span{display:inline-flex;align-items:center;gap:6px}.cl-legend span::before{content:'';display:inline-block;width:16px;height:0;border-top:1.5px solid var(--cl-mark)}
.cl-legend .cl-key-base::before{border-top:1px dashed var(--cl-muted)}
.cl-legend .cl-key-mode::before{width:9px;height:9px;border:0;border-radius:50%;box-sizing:border-box;background:var(--cl-mode-fill);border:1.5px solid var(--cl-mark)}
.is-recall{--cl-mode-fill:var(--cl-mark);--cl-mode-bar:var(--cl-mark)}
.is-fantasy{--cl-mode-fill:transparent;--cl-mode-bar:var(--cl-muted)}
.is-mix{--cl-mode-fill:linear-gradient(90deg,var(--cl-mark) 50%,transparent 50%);--cl-mode-bar:var(--cl-faint)}
.is-longing{--cl-mode-fill:radial-gradient(circle,var(--cl-mark) 35%,transparent 40%);--cl-mode-bar:var(--cl-ink)}
.is-tend{--cl-mode-fill:linear-gradient(0deg,var(--cl-mark) 50%,transparent 50%);--cl-mode-bar:repeating-linear-gradient(90deg,var(--cl-mark) 0 4px,var(--cl-faint) 4px 6px)}
.is-explore{--cl-mode-fill:repeating-linear-gradient(135deg,var(--cl-mark) 0 2px,transparent 2px 5px);--cl-mode-bar:repeating-linear-gradient(135deg,var(--cl-mark) 0 2px,var(--cl-faint) 2px 5px)}
.cl-page .is-socialize{--cl-mode-fill:linear-gradient(90deg,var(--cl-mark) 50%,transparent 50%);--cl-mode-bar:repeating-linear-gradient(90deg,var(--cl-muted) 0 3px,var(--cl-faint) 3px 6px)}
.cl-page .is-rest{--cl-mode-fill:var(--cl-faint);--cl-mode-bar:var(--cl-faint)}
.cl-page .is-unwind{--cl-mode-fill:linear-gradient(135deg,var(--cl-mark) 50%,transparent 50%);--cl-mode-bar:linear-gradient(90deg,var(--cl-muted),var(--cl-faint))}
.is-other{--cl-mode-fill:var(--cl-faint);--cl-mode-bar:var(--cl-line)}
.cl-rhythm-row{display:grid;grid-template-columns:44px minmax(60px,1fr) 78px;align-items:center;gap:10px;padding:6px 0;font-size:13px}
.cl-rhythm-name{color:var(--cl-ink);letter-spacing:.04em}.cl-rhythm-value{text-align:right;font:11px Georgia,var(--cl-serif);color:var(--cl-muted);font-variant-numeric:tabular-nums}
.cl-rhythm-row.is-scrub .cl-rhythm-value{color:var(--cl-ink)}
.cl-spark{display:block;width:100%;height:34px;overflow:visible;touch-action:none;cursor:crosshair}
.cl-spark-base{stroke:var(--cl-faint);stroke-width:1;stroke-dasharray:2 3;vector-effect:non-scaling-stroke}
.cl-spark-line{fill:none;stroke:var(--cl-mark);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.cl-spark-cursor{stroke:var(--cl-muted);stroke-width:1;opacity:.4;vector-effect:non-scaling-stroke}
.cl-spark-now{fill:var(--cl-mark);stroke:var(--cl-paper);stroke-width:2;vector-effect:non-scaling-stroke}
.cl-rhythm-axis{display:flex;justify-content:space-between;margin:6px 88px 0 54px;font:10px Georgia,serif;color:var(--cl-muted)}
.cl-gauge{margin:12px 0 4px}.cl-gauge-track{position:relative;height:2px;background:var(--cl-line)}
.cl-gauge-fill{display:block;height:100%;background:var(--cl-mark);transition:width .5s ease}
.cl-gauge-mark{position:absolute;top:-8px;width:1px;height:18px;background:var(--cl-ink)}
.cl-gauge-scale{display:flex;justify-content:space-between;margin-top:12px;font-size:11px;color:var(--cl-muted);letter-spacing:.06em}
.cl-reason{display:flex;align-items:center;gap:10px;margin:14px 0 0;font-size:14px;letter-spacing:.06em}
.cl-dot{width:7px;height:7px;border-radius:50%;border:1px solid var(--cl-muted);flex:none}.cl-dot.is-eligible,.cl-dot.is-running{background:var(--cl-mark);border-color:var(--cl-mark);box-shadow:0 0 0 4px var(--cl-soft)}
.cl-mix{display:flex;gap:2px;height:3px;margin:10px 0 2px}.cl-mix-part{background:var(--cl-mode-bar)}
.cl-timeline{list-style:none;margin:16px 0 0;padding:0}
.cl-timeline li{position:relative;display:grid;grid-template-columns:18px 1fr;column-gap:8px;padding:9px 0}
.cl-timeline li::before{content:'';position:absolute;left:4px;top:0;bottom:0;width:1px;background:var(--cl-line)}
.cl-timeline li:first-child::before{top:14px}.cl-timeline li:last-child::before{bottom:calc(100% - 14px)}
.cl-timeline-dot{position:relative;z-index:1;grid-row:span 2;box-sizing:border-box;width:9px;height:9px;margin-top:5px;border-radius:50%;border:1.5px solid var(--cl-mark);background:var(--cl-mode-fill);box-shadow:0 0 0 3px var(--cl-paper)}
.cl-timeline strong{font-weight:400;font-size:14px;letter-spacing:.06em}.cl-timeline small{font-size:10px;color:var(--cl-muted);margin-top:3px;font-family:-apple-system,BlinkMacSystemFont,sans-serif}
.cl-empty,.cl-foot{margin:6px 0;font-size:11px;line-height:1.9;color:var(--cl-muted);letter-spacing:.06em}.cl-foot{text-align:center;padding:16px 12px 0;border-top:1px solid var(--cl-line)}
@media (max-width:360px){.cl-hero{grid-template-columns:1fr}.cl-hero .cl-dial{max-width:200px;margin:0 auto}}
.cl-loading{padding:40vh 0 0;text-align:center}
/* Paged layout: one subject per sheet, swiped sideways with native snap. */
.cl-page{display:flex;flex-direction:column;overflow:hidden}
.cl-top{position:relative;flex:none}
.cl-body{flex:1;min-height:0;width:100%;max-width:none;margin:0;padding:0;display:flex;gap:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none}
.cl-body::-webkit-scrollbar{display:none}
.cl-sheet{flex:0 0 100%;box-sizing:border-box;display:flex;flex-direction:column;overflow-y:auto;scroll-snap-align:start;scroll-snap-stop:always;padding:8px 22px 24px}
.cl-sheet-inner{margin:auto 0;width:100%;max-width:520px;align-self:center}
.cl-sheet .cl-card{border-top:0;padding-top:4px}
.cl-sheet .cl-card-head{margin-bottom:18px}
.cl-sheet .cl-hero{grid-template-columns:1fr;justify-items:center;text-align:center;gap:18px;padding:0}
.cl-sheet .cl-hero-words strong{font-size:88px;margin:14px 0 18px}
.cl-sheet .cl-hero .cl-dial{max-width:280px}
.cl-sheet .cl-radar{max-width:340px}
.cl-sheet .cl-loading{padding:0}
.cl-tabs{position:relative;z-index:1;flex:none;display:flex;justify-content:center;gap:24px;padding:12px 16px calc(env(safe-area-inset-bottom,0px) + 16px)}
.cl-tab{border:0;background:none;padding:6px 1px;color:var(--cl-muted);font:400 13px/1.4 var(--cl-serif);letter-spacing:.14em;border-bottom:1px solid transparent;cursor:pointer}
.cl-tab.is-current{color:var(--cl-ink);border-bottom-color:var(--cl-ink)}
.cl-timeline-text{grid-column:2;margin:8px 0 2px;font:400 14px/1.9 var(--cl-serif);color:var(--cl-ink);letter-spacing:.02em;white-space:pre-wrap;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cl-timeline li.has-text{cursor:pointer}
.cl-timeline li.has-text:not(.is-open) .cl-timeline-text{color:var(--cl-muted)}
.cl-timeline li.is-open .cl-timeline-text{display:block;-webkit-line-clamp:unset;overflow:visible}

