/* Crimson Interface 0.6 — static visual structure first, opt-in motion second. */
:root{--crimson-edge:#59303d;--crimson-faint:#22141d;--crimson-silver:#ded4dc;--crimson-mono:ui-monospace,SFMono-Regular,Consolas,monospace}
body{background-color:#0b0c10;background-image:linear-gradient(#ff536b03 1px,transparent 1px),linear-gradient(90deg,#ff536b03 1px,transparent 1px);background-size:48px 48px}
.topbar{background:linear-gradient(110deg,#1b141c,#12141a 55%);border-bottom:1px solid var(--crimson-edge)}
.brandmark>b{position:relative;display:grid;place-items:center;width:43px;height:43px;font-size:29px!important;font-style:normal!important;line-height:1}
.brandmark>b::before{content:"";position:absolute;inset:0;border:1px solid #a74359;border-radius:50%;border-right-color:transparent;border-bottom-color:#4d2a37;transform:rotate(-30deg);pointer-events:none}
.brandmark small,.eyebrow,.edition,.tag,#buildFooter{font-family:var(--crimson-mono);letter-spacing:.1em}
.header-right{gap:10px}#motionToggle{font-size:21px;color:var(--accent)}#motionToggle[aria-pressed=false]{color:var(--muted)}
.sidebar{background:linear-gradient(180deg,#101015,#0c0d12);border-right:1px solid #34222f;position:relative}
.sidebar::before{content:"";position:absolute;top:30px;bottom:35px;left:0;width:2px;background:linear-gradient(transparent,#b6415c55,transparent);pointer-events:none}
.sidebar nav a,.bottom-nav a{position:relative;transition:background-color 180ms,color 180ms}
.sidebar nav a[aria-current=page]{background:linear-gradient(90deg,#56233288,#231622);box-shadow:inset 3px 0 var(--accent);border-radius:5px}
.sidebar nav a[aria-current=page]::after{content:"";width:5px;height:5px;position:absolute;right:13px;top:50%;background:var(--accent);transform:rotate(45deg)}
.sidebar-note{border-top-color:#56303f}.sidebar-note b{color:var(--crimson-silver)}
.page-heading h1{letter-spacing:-.025em}.page-heading .eyebrow::before{content:"";display:inline-block;width:18px;height:2px;margin:0 9px 3px 0;background:var(--accent)}
.surface{position:relative;border-color:#3b303d;border-radius:10px;background:linear-gradient(125deg,#1c1b23,#16171e 65%)}
.surface::before,.surface::after{content:"";position:absolute;width:13px;height:13px;pointer-events:none;border-color:#a74a61;opacity:.6}
.surface::before{top:6px;left:6px;border-top:1px solid;border-left:1px solid;color:#a74a61}
.surface::after{bottom:6px;right:6px;border-bottom:1px solid;border-right:1px solid;color:#a74a61}
.daily-header{display:grid!important;grid-template-columns:116px minmax(0,1fr) minmax(400px,.9fr);gap:24px;align-items:center;padding:26px!important;border-top:1px solid var(--accent);background:radial-gradient(ellipse at 3% 45%,#a5284a24,transparent 48%),linear-gradient(120deg,#241922,#15171e);isolation:isolate;overflow:hidden}
.daily-header::after{inset:0;width:auto;height:auto;border:0;z-index:-1;opacity:.25;background-image:linear-gradient(#b4567020 1px,transparent 1px),linear-gradient(90deg,#b4567020 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent 65%)}
.daily-copy{min-width:0}.daily-copy h2{font-size:25px}.daily-copy>p{line-height:1.75}.hero-meta{gap:5px 12px;flex-wrap:wrap}.week-strip{min-width:0;width:100%}.week-day{background:#101118;border-radius:6px!important}.week-day.selected{background:linear-gradient(145deg,#4b2030,#221722);border-color:#f16481!important;box-shadow:inset 0 2px #ff8095}
.crimson-core{position:relative;width:116px;height:116px;color:#ff6b87;flex-shrink:0}.crimson-core svg{width:100%;height:100%;display:block}.crimson-core>span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font:500 38px/1 var(--crimson-mono);color:#fbe8ee;text-shadow:0 0 24px #ff536b44}.crimson-core small{font:8px/1.5 var(--crimson-mono);color:#e494a9;letter-spacing:.12em;margin-top:7px}
.core-track{stroke:#633047;stroke-width:.6}.core-ticks{stroke:#b1516c;stroke-width:3}.core-arc{stroke:#ff708d;stroke-width:1.8}.core-inner{stroke:#d2688255;stroke-width:1}.core-brackets{stroke:#cc5772;stroke-width:.8}.core-rotor{transform-origin:70px 70px}
html[data-motion=tech] .core-rotor{animation:crimson-orbit 38s linear infinite;animation-play-state:paused}
html[data-motion=tech][data-page-visible=true] .crimson-core[data-in-view=true] .core-rotor{animation-play-state:running}
@keyframes crimson-orbit{to{transform:rotate(360deg)}}
.metric{border-top:1px solid #754252;padding-top:23px;transition:border-color 160ms}.metric-top{color:#d0c2cd}.metric-value{font-variant-numeric:tabular-nums;font-feature-settings:'tnum';letter-spacing:-.03em}.metric-instrument{display:flex;align-items:center;gap:10px;min-height:43px;margin:2px 0 13px;color:#c4b1c0;font-size:11px;line-height:1.55}.instrument-dial{width:38px;height:38px;flex-shrink:0}.dial-track{stroke:#593546;stroke-width:2}.dial-value{stroke:#f57292;stroke-width:2.7}.dial-ticks{stroke:#a7657d;stroke-width:1}.dial-center{fill:#ff8da6}.instrument-unknown .dial-value{stroke:none}.instrument-unknown .dial-center{fill:#695563}.metric-bottom{border-top-color:#44303e}
[data-balance-card]{border-top:1px solid #fa5979;background:linear-gradient(100deg,#281924,#171820 55%)}
.balance-equation{font-variant-numeric:tabular-nums}.balance-result{background:linear-gradient(135deg,#4d1f31aa,#261a27);border:1px solid #71364d;border-radius:7px}
.detail-card,.mini-trends,.plan-card,.trend-card,.settings-card{border-top-color:#704052}.panel-head h2{color:#f2e9ef}.panel-head .ico{color:#ff7994}.activity-symbol{border:1px solid #7d354e;border-radius:7px;background:#351b2a}.card-context,.body-source{border-color:#4e3544}.plan-card{border-style:dashed}.tag{border-radius:4px!important}.chart,.target-chart{border-radius:5px}.chart-table summary{border-color:#5b3b4c}
.button,.icon-button,.avatar,.week-day,.motion-options button{transition:background-color 160ms,border-color 160ms,transform 120ms}.button:active,.icon-button:active,.week-day:active{transform:translateY(1px)}
.button.primary{background:linear-gradient(120deg,#ff6a82,#f44869);color:#180e13;border-color:#ff7b92}.button.primary:disabled{opacity:.55}.button.quiet{background:#17141c}.bottom-nav{border-top:1px solid #6b344b!important;background:#11131bee!important}.bottom-nav a[aria-current=page]{box-shadow:inset 0 2px #ff6789}
.auth-shell:not(.guardian-boot){background:radial-gradient(ellipse at 50% 35%,#48203244,transparent 65%)}.auth-card{position:relative;background:linear-gradient(145deg,#231a24,#13161e);border:1px solid #643044;border-top:2px solid #ff6685;border-radius:12px}.auth-card::after{content:"";position:absolute;right:14px;bottom:14px;width:22px;height:22px;border-right:1px solid #a64964;border-bottom:1px solid #a64964;pointer-events:none}
dialog{background:linear-gradient(140deg,#231923,#14171d);border-color:#8b455e}.dialog-head{border-color:#543342}.dialog-head h2{max-width:calc(100% - 46px)}
.motion-card{grid-column:1/-1}.motion-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.motion-options button{padding:17px;text-align:left;background:#13151d;color:var(--text);border:1px solid #614052;border-radius:7px;min-height:78px}.motion-options b{display:block;font:600 15px var(--crimson-mono);margin-bottom:7px}.motion-options small{display:block;font-size:12px;color:var(--muted)}.motion-options [aria-pressed=true]{border-color:#ff7b9a;background:#412032;box-shadow:inset 3px 0 #ff7b9a}
#refresh:disabled{animation:crimson-refresh 1.3s linear infinite}html[data-motion=off] #refresh:disabled{animation:none}
@keyframes crimson-refresh{to{transform:rotate(360deg)}}
@media(hover:hover){.metric:hover{border-color:#99526a}.button:hover,.icon-button:hover{border-color:#b36b83}.motion-options button:hover{border-color:#d6819c}}
@media(max-width:1400px){.daily-header{grid-template-columns:100px minmax(0,1fr);gap:20px}.daily-header .week-strip{grid-column:1/-1;max-width:100%}.crimson-core{width:100px;height:100px}}
@media(max-width:850px){.topbar{padding-inline:18px}.brandmark>b{width:37px;height:37px;font-size:25px!important}.daily-header{grid-template-columns:72px minmax(0,1fr);padding:22px!important;gap:16px}.crimson-core{width:72px;height:72px}.crimson-core>span{font-size:27px}.crimson-core small{font-size:6px;margin-top:5px}.daily-copy h2{font-size:23px}}
@media(max-width:580px){.topbar{padding-inline:14px}.header-right{gap:6px}.header-right .icon-button{min-width:36px;min-height:40px}.brandmark{gap:9px}.brandmark small{letter-spacing:.03em}.daily-header{grid-template-columns:54px minmax(0,1fr);padding:18px 14px!important;gap:13px}.crimson-core{width:54px;height:54px}.crimson-core>span{font-size:23px}.crimson-core small{display:none}.daily-copy h2{font-size:20px}.daily-copy .edition{font-size:8px}.daily-copy>p{font-size:11px}.hero-meta{display:block}.day-context{font-size:10px}.metric-instrument{font-size:10px;gap:6px;min-height:43px;margin-bottom:9px}.instrument-dial{width:28px;height:28px}.metric{padding-top:19px}.motion-options{gap:7px}.motion-options button{padding:13px 10px}.motion-options b{font-size:12px}.motion-options small{font-size:10px}.settings-card.motion-card{padding-inline:15px}.surface::before,.surface::after{width:9px;height:9px;opacity:.5}.page-heading h1{font-size:26px}.metric-value{letter-spacing:-.04em}}
html[data-motion=off] *,html[data-motion=off] *::before,html[data-motion=off] *::after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){html:not([data-motion-explicit="true"]) .core-rotor,html:not([data-motion-explicit="true"]) #refresh:disabled{animation:none!important}html:not([data-motion-explicit="true"]) .button:active,html:not([data-motion-explicit="true"]) .icon-button:active,html:not([data-motion-explicit="true"]) .week-day:active{transform:none}}
@media(forced-colors:active){body,.topbar,.surface,.daily-header,.auth-card,dialog,.motion-options button{background:Canvas;color:CanvasText;border-color:CanvasText}.surface::before,.surface::after,.crimson-core,.metric-instrument svg,.brandmark>b::before{display:none}.sidebar nav a[aria-current=page],.bottom-nav a[aria-current=page],.motion-options [aria-pressed=true]{outline:2px solid Highlight}.metric-instrument{color:CanvasText}}
/* Finite launch sequence: 1.02s assembly/settle + 0.18s exit inside a 1.2s budget. */
#boot.guardian-boot{position:fixed;inset:0;z-index:90;overflow-y:auto;opacity:1}
#boot.intro-active .guardian-visual{animation:crimson-assemble 1020ms cubic-bezier(.18,.7,.22,1) both}
#boot.intro-active .guardian-identity h1{animation:crimson-identity 360ms 420ms ease-out both}
#boot.intro-active .guardian-brackets{animation:crimson-calibrate 780ms ease-out both}
#boot.intro-exit{opacity:0;transition:opacity 180ms ease-out;pointer-events:none}
@keyframes crimson-assemble{0%{opacity:.15;transform:scale(.92) rotate(-8deg)}40%{opacity:.8}76%{transform:scale(1.015) rotate(.7deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes crimson-identity{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@keyframes crimson-calibrate{from{opacity:.2;transform:translateY(3px)}to{opacity:1;transform:none}}
html[data-motion=minimal] #boot .guardian-halo,html[data-motion=off] #boot .guardian-halo{display:none}
html[data-motion=minimal] #boot .guardian-orbit{animation:none}
@media(prefers-reduced-motion:reduce){html:not([data-motion-explicit="true"]) #boot.intro-active .guardian-visual,html:not([data-motion-explicit="true"]) #boot.intro-active .guardian-identity h1,html:not([data-motion-explicit="true"]) #boot.intro-active .guardian-brackets{animation:none!important;transform:none!important}html:not([data-motion-explicit="true"]) #boot.intro-exit{transition:none}}
/* Match the actual navigation class and retain 44px touch targets. */
.bottom-nav{display:none}
@media(max-width:850px){.bottom-nav{position:fixed;inset:auto 0 0;z-index:30;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:7px 12px max(9px,env(safe-area-inset-bottom));backdrop-filter:blur(12px)}.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:46px;border-radius:5px;color:var(--muted)}.bottom-nav a[aria-current=page]{color:var(--accent);background:var(--accent-soft)}}
@media(max-width:580px){.header-right .icon-button{min-width:44px;min-height:44px}}
@media(max-width:380px){.brandmark small{display:none}.brandmark>span{font-size:12px}.header-right{gap:3px}.topbar{padding-inline:10px}}