/* ═══════════════════════════════════════════════════════════════════════
   CIRCLE THRICE · CANON STYLESHEET  —  SINGLE SOURCE OF TRUTH
   These are LOCKED components. Do not fork or reimplement per page.
   Import with: <link rel="stylesheet" href="ct-canon.css">
   Change only on explicit "update the canon" instruction (+ changelog).
   2026-07-06 · rev2: header Magic/aus-bar → Auspice/scale chips (per R4-12
   "Hours Rail — docked"); rail 68px + 58px brand + hairline; wide tabs
   (46px row, 170px min) — structure source R4-04 "Ruled columns + Centered
   · Wide tabs".
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --desk-w:1200px; --desk-h:720px; /* canonical screen — ALL screen designs render at 1200px wide (mock height 720) */
  --paper:#f6f9fc; --white:#fff; --ink:#2b3240; --blue:#3f6d96; --l-blue:#7c9bbd;
  --muted:#586073; --rule:#cbd5e1; --vpale:#dde4ec; --icon:#8a98ad;
  /* auspice scale — canonical (see CLAUDE.md) */
  --vg:#014e67; --g:#4d99b2; --n:#b9c3cb; --b:#c86eac; --vb:#90286f;
  --aus-vg:#014e67; --aus-g:#4d99b2; --aus-n:#b9c3cb; --aus-b:#c86eac; --aus-vb:#90286f;
  /* planet ink */
  --moon:#5a6882; --sun:#b8820a; --mer:#d4782a; --ven:#45aa82; --mar:#a84848; --jup:#8878cc; --sat:#6e6e88;
  --disp:'Montserrat Alternates',system-ui,sans-serif;
  --sc:'Montserrat Alternates',system-ui,sans-serif;
  --body:'Open Sans',system-ui,sans-serif;
  --serif:'Spectral',Georgia,serif;
}

/* glyphs — ALWAYS Physis (see CLAUDE.md) */
@font-face{font-family:'Physis';src:url('fonts/Physis.ttf') format('truetype'),url('fonts/Physis.otf') format('opentype');font-display:swap;}
.pg{font-family:'Physis','Segoe UI Symbol',serif;font-variant-emoji:text;line-height:1;}

/* ── app shell ─────────────────────────────────────────────────────── */
.screen{position:absolute;background:var(--white);border:1px solid var(--vpale);border-radius:8px;box-shadow:0 20px 60px rgba(30,40,60,.13);overflow:hidden;display:flex;}
.scr-main{flex:1;min-width:0;display:flex;flex-direction:column;}

/* ── LOCKED · nav rail ─────────────────────────────────────────────── */
.rail{width:68px;background:var(--paper);border-right:1px solid var(--vpale);display:flex;flex-direction:column;flex-shrink:0;}
.rail-brand{display:flex;align-items:center;justify-content:center;height:58px;border-bottom:1px solid var(--vpale);font-family:var(--disp);font-size:11px;font-weight:600;letter-spacing:-.01em;color:var(--ink);}
.rail-brand .t{color:var(--blue);}
.ni{display:flex;flex-direction:column;align-items:center;gap:4px;padding:13px 4px 11px;border-left:2px solid transparent;background:none;cursor:pointer;}
.ni.on{background:rgba(63,109,150,.07);border-left-color:var(--blue);}
.ni svg{width:16px;height:16px;}
.ni-lbl{font-family:var(--sc);font-size:7px;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--icon);}
.ni.on .ni-lbl{color:var(--blue);}
.rail-sp{flex:1;}
.rail-sep{height:1px;background:var(--vpale);margin:0 10px;}
.ni.acct{padding:11px 4px 10px;}

/* ── LOCKED · header strip ─────────────────────────────────────────── */
.strip{display:flex;align-items:stretch;background:var(--white);border-bottom:1px solid var(--vpale);height:58px;cursor:pointer;transition:box-shadow .12s;}
.strip:hover{box-shadow:inset 0 0 0 200vmax rgba(63,109,150,.03);}
.fields{display:flex;align-items:stretch;flex:1;min-width:0;}
.f{display:flex;flex-direction:column;gap:3px;justify-content:center;padding:0 18px;border-right:1px solid var(--vpale);min-width:0;}
.f-lbl{font-family:var(--sc);font-size:8px;font-weight:500;text-transform:uppercase;letter-spacing:.16em;color:var(--icon);white-space:nowrap;}
.f-val{font-family:var(--sc);font-size:12px;font-weight:500;color:var(--ink);white-space:nowrap;display:flex;align-items:center;gap:6px;line-height:1.25;}
.f-val .pg{font-size:14px;}
.f-val.theme{font-family:var(--body);font-style:italic;font-weight:400;color:var(--muted);white-space:normal;}
.hdr{flex:1;display:flex;align-items:center;min-width:0;}
.aus-hit{cursor:help;}
/* ── LOCKED · auspice "why this rating" hover card (any .aus-hit) ──── */
.aus-tip{position:fixed;z-index:500;width:254px;background:var(--white);border:1px solid var(--vpale);border-radius:8px;box-shadow:0 14px 40px rgba(30,35,48,.22);opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity .12s,transform .12s;}
.aus-tip.show{opacity:1;transform:translateY(0);pointer-events:auto;}
.aus-tip-hd{display:flex;align-items:center;gap:10px;padding:12px 14px 11px;border-bottom:1px solid var(--vpale);}
.aus-badge{width:27px;height:27px;flex-shrink:0;background:var(--b);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--sc);font-size:14px;font-weight:700;}
.aus-lbl{font-family:var(--disp);font-size:14px;font-weight:600;color:var(--ink);letter-spacing:-.01em;}
.aus-tone{font-family:var(--sc);font-size:8.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--b);margin-top:2px;}
.aus-tip-note{font-family:var(--sc);font-size:8px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--icon);padding:10px 14px 0;}
.aus-tip-body{padding:8px 14px 13px;display:flex;flex-direction:column;gap:8px;}
.aus-reason{display:flex;align-items:flex-start;gap:8px;font-size:11.5px;line-height:1.4;color:var(--muted);}
.aus-reason .rw{flex-shrink:0;width:15px;height:15px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:var(--sc);font-size:10px;font-weight:700;margin-top:1px;}
.aus-reason.neg .rw{background:rgba(200,110,172,.16);color:var(--b);}
.aus-reason.pos .rw{background:rgba(77,153,178,.18);color:#3d7e93;}
.aus-reason .pg{flex-shrink:0;font-size:13px;line-height:1.25;}
.aus-reason .rt{flex:1;}
.magic-val{white-space:normal;line-height:1.22;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.theme-txt{font-family:var(--body);font-style:italic;font-weight:400;color:var(--muted);}
.aus-bar{display:flex;gap:1.5px;}
.aus-bar i{width:8px;height:10px;border-radius:1px;opacity:.28;}
.aus-bar i.hot{opacity:1;box-shadow:0 0 0 1px rgba(1,78,103,.25);}
.more-grp{display:flex;align-items:center;gap:7px;flex-shrink:0;margin:0 14px;}
.more-eyebrow{font-family:var(--sc);font-size:8px;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:var(--icon);}
.more{width:26px;height:26px;border-radius:50%;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--blue);}
.more-grp:hover .more-eyebrow{color:var(--blue);}
.today-cta{margin:0 12px;flex-shrink:0;width:28px;height:28px;border:1px solid var(--vpale);background:var(--white);border-radius:50%;color:var(--blue);display:flex;align-items:center;justify-content:center;cursor:pointer;}
.today-cta:hover{border-color:var(--blue);background:rgba(63,109,150,.06);}

/* ── LOCKED · timespan selector (identical across every view) ──────── */
.tsrow{background:var(--white);border-bottom:1px solid var(--vpale);}
.rowA{display:flex;flex-direction:column;align-items:center;gap:5px;padding:11px 20px;}
.rowA .top{display:flex;align-items:center;gap:10px;}
.rlbl{font-family:var(--sc);font-size:8.5px;font-weight:500;text-transform:uppercase;letter-spacing:.18em;color:var(--icon);}
.kind{font-family:var(--sc);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);}
.count{font-family:var(--sc);font-size:8.5px;font-weight:500;letter-spacing:.06em;color:var(--icon);border:.75px solid var(--vpale);border-radius:20px;padding:2px 9px;white-space:nowrap;}
.tsnav{display:flex;align-items:center;gap:12px;}
.range{font-family:var(--disp);font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;}
.navb{font-family:var(--sc);font-size:10px;font-weight:500;color:var(--muted);background:none;border:none;cursor:pointer;padding:6px 10px;border-radius:20px;}
.navb:hover{color:var(--blue);background:rgba(63,109,150,.06);}
.ts-static{display:inline-flex;align-items:center;gap:10px;}
.icon-btn{width:24px;height:24px;border-radius:50%;border:none;background:none;cursor:pointer;color:var(--blue);display:inline-flex;align-items:center;justify-content:center;}
.icon-btn:hover{background:rgba(63,109,150,.08);}

/* ── LOCKED · view tabs ────────────────────────────────────────────── */
.chrome-tabs{display:flex;justify-content:center;background:var(--paper);border-bottom:1px solid var(--vpale);height:46px;}
.ct{position:relative;display:flex;align-items:center;justify-content:center;min-width:170px;padding:0 30px;font-family:var(--sc);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);cursor:pointer;}
.ct.on{color:var(--ink);font-weight:600;}
.ct.on::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:2px;background:var(--blue);border-radius:2px;}

/* ── LOCKED · auspice scale chips (symbol inside a box) ─────────────── */
.scale{display:inline-flex;gap:2.5px;align-items:center;}
.scale i{width:15px;height:15px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--sc);font-size:7.5px;font-weight:700;font-style:normal;letter-spacing:-.4px;}
.mk-vg{background:rgba(1,78,103,.14);color:var(--vg);}
.mk-g{background:rgba(77,153,178,.18);color:#3d7e93;}
.mk-n{background:rgba(185,195,203,.32);color:#78828f;}
.mk-b{background:rgba(200,110,172,.16);color:var(--b);}
.mk-vb{background:rgba(144,40,111,.14);color:var(--vb);}
.scale i.on{color:#fff;box-shadow:0 1px 3px rgba(30,35,48,.2);}
.mk-vb.on{background:var(--vb);}.mk-b.on{background:var(--b);}.mk-n.on{background:var(--n);color:var(--ink);}.mk-g.on{background:var(--g);}.mk-vg.on{background:var(--vg);}

/* ── LOCKED · calendar band (low/high points only; neutral plain) ──── */
.cband{user-select:none;margin-top:2px;}
.cband-ruler{display:flex;margin-left:52px;border-bottom:1px solid var(--vpale);}
.cband-rn{flex:1;text-align:center;font-family:var(--sc);font-size:6.5px;color:var(--icon);padding:2px 0;}
.cband-row{display:flex;height:26px;border-bottom:1px solid var(--vpale);}
.cband-mn{width:52px;flex-shrink:0;display:flex;align-items:center;padding:0 6px 0 2px;font-family:var(--sc);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);}
.cband-cell{flex:1;border-right:1px solid rgba(203,213,225,.3);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;}
.cband-cell .d{font-family:var(--sc);font-size:8px;font-weight:500;line-height:1;color:var(--icon);}
.cband-cell .s{font-family:var(--sc);font-size:7.5px;font-weight:700;line-height:1;}
.cband-legend{display:flex;gap:11px;align-items:center;padding:10px 2px 2px;}
.cband-legend .li{display:flex;gap:4px;align-items:center;}
.cband-legend .sw{width:10px;height:10px;border-radius:2px;}
.cband-legend .sy{font-family:var(--sc);font-size:9px;font-weight:600;letter-spacing:.04em;}
.cband-note{font-family:var(--sc);font-size:7.5px;color:#b3bdca;letter-spacing:.06em;margin-left:auto;}

/* ── LOCKED · day card (week planner cell) ─────────────────────────── */
.dc{border:1px solid var(--vpale);border-left:2.5px solid var(--rule);border-radius:6px;padding:14px 16px;background:var(--white);display:flex;flex-direction:column;}
.dc.flag{border-left-color:var(--b);background:rgba(200,110,172,.035);}
.dc-top{display:flex;align-items:center;gap:8px;margin-bottom:9px;}
.dc-dow{font-family:var(--sc);font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);}
.dc-date{font-family:var(--disp);font-size:19px;font-weight:600;color:var(--ink);line-height:1;}
.dc-ruler{display:inline-flex;align-items:center;gap:5px;font-family:var(--sc);font-size:10px;font-weight:600;letter-spacing:.06em;color:var(--blue);}
.dc-ruler .pg{font-size:14px;}
.dc-ld{font-family:var(--sc);font-size:8.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--icon);margin-left:auto;border:.75px solid var(--vpale);border-radius:20px;padding:2px 8px;white-space:nowrap;}
.dc-flag{width:19px;height:19px;border-radius:3px;display:flex;align-items:center;justify-content:center;font-family:var(--sc);font-size:9px;font-weight:700;color:#fff;flex-shrink:0;}
.dc-theme{font-family:var(--disp);font-size:15px;font-weight:600;color:var(--ink);line-height:1.2;margin-bottom:6px;}
.dc-theme.dark{color:var(--vb);}
.dc-desc{font-family:var(--serif);font-size:13.5px;line-height:1.5;color:var(--muted);flex:1;}
.dc-mat{margin-top:11px;padding-top:10px;border-top:1px solid var(--vpale);}
.dc-mat-lbl{font-family:var(--sc);font-size:7.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--icon);margin-bottom:5px;}
.dc-tags{display:flex;flex-wrap:wrap;gap:5px;}
.dc-tag{font-family:var(--sc);font-size:9.5px;font-weight:500;letter-spacing:.01em;color:var(--muted);border:1px solid var(--vpale);border-radius:4px;padding:3px 7px;}
.dc-tag.star{color:var(--blue);border-color:rgba(63,109,150,.28);}