:root{--bg-void:#05070d;--bg-glass:rgba(14,21,38,.62);--bg-elevated:rgba(255,255,255,.035);--border-subtle:rgba(255,255,255,.075);--border-bright:rgba(56,189,248,.35);--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-cyan:#00f2fe;--accent-blue:#38bdf8;--accent-violet:#8b5cf6;--grad-accent:linear-gradient(135deg,#00f2fe 0%,#38bdf8 45%,#8b5cf6 100%);--status-ok:#10b981;--status-ok-bg:rgba(16,185,129,.12);--status-bd:#f59e0b;--status-bd-bg:rgba(245,158,11,.12);--status-bad:#f43f5e;--status-bad-bg:rgba(244,63,94,.14);--font-display:'Space Grotesk',system-ui,sans-serif;--font-sans:'Inter',system-ui,sans-serif;--font-mono:'JetBrains Mono',monospace;--radius-xl:24px;--radius-lg:18px;--radius-md:12px;--radius-pill:9999px;--ease-spring:cubic-bezier(.22,1,.36,1);--shadow-glass:0 20px 50px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.1)}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg-void);color:var(--text-primary);font:15px/1.55 var(--font-sans);-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100dvh}
button{font-family:inherit}
.ambient-canvas{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aurora{position:absolute;border-radius:50%;filter:blur(130px);opacity:.22}
.aurora-cyan{width:55vw;height:55vw;max-width:720px;max-height:720px;top:-18%;left:-10%;background:radial-gradient(circle,var(--accent-cyan),transparent 70%)}
.aurora-violet{width:50vw;height:50vw;max-width:680px;max-height:680px;bottom:-15%;right:-12%;background:radial-gradient(circle,var(--accent-violet),transparent 70%)}
.cyber-grid{position:absolute;inset:0;background-image:linear-gradient(to right,rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.02) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse at 50% 30%,#000 35%,transparent 85%);-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 35%,transparent 85%)}
.app-layout{position:relative;z-index:1;display:grid;grid-template-columns:260px 1fr;min-height:100dvh;max-width:1560px;margin:0 auto}
.nav-dock{position:sticky;top:24px;height:calc(100dvh - 48px);margin:24px 0 24px 24px;padding:24px 16px;background:var(--bg-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-glass);display:flex;flex-direction:column;justify-content:space-between;z-index:30}
.brand-lockup{display:flex;align-items:center;gap:12px;padding:4px 12px 24px;border-bottom:1px solid var(--border-subtle)}
.brand-orb{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,rgba(0,242,254,.2),rgba(139,92,246,.25));border:1px solid rgba(0,242,254,.4);display:grid;place-items:center;box-shadow:0 0 20px rgba(0,242,254,.25)}
.orb-core{width:12px;height:12px;border-radius:50%;background:var(--grad-accent);box-shadow:0 0 10px var(--accent-cyan)}
.brand-title{display:block;font:700 16px var(--font-display);letter-spacing:.14em}
.brand-sub{display:block;font:10px var(--font-mono);color:var(--accent-blue);letter-spacing:.08em}
.nav-list{display:flex;flex-direction:column;gap:8px;margin-top:24px;flex:1}
.nav-btn{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:10px 14px;border-radius:var(--radius-md);border:1px solid transparent;background:transparent;color:var(--text-secondary);font-size:14px;font-weight:500;cursor:pointer;transition:all .3s var(--ease-spring);text-align:left}
.nav-btn svg{width:18px;height:18px;flex-shrink:0;opacity:.75}
.nav-btn:hover{color:var(--text-primary);background:var(--bg-elevated)}
.nav-btn.on{color:var(--text-primary);background:linear-gradient(90deg,rgba(0,242,254,.14),rgba(139,92,246,.08));border-color:rgba(0,242,254,.3);box-shadow:0 8px 24px rgba(0,242,254,.12)}
.nav-btn.on svg{opacity:1;color:var(--accent-cyan)}
.dock-footer{padding-top:16px;border-top:1px solid var(--border-subtle)}
.security-pill{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--radius-md);background:rgba(16,185,129,.06);border:1px solid rgba(16,185,129,.2);font:10px var(--font-mono);color:#6ee7b7;letter-spacing:.06em}
.pulse-dot{width:7px;height:7px;border-radius:50%;background:var(--status-ok);box-shadow:0 0 8px var(--status-ok);display:inline-block}
.viewport{padding:28px 36px 90px;min-width:0}
.top-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:32px}
.eyebrow{font:11px var(--font-mono);text-transform:uppercase;letter-spacing:.14em;color:var(--accent-blue);margin-bottom:4px}
.view-title{font:700 clamp(22px,2.5vw,30px) var(--font-display);letter-spacing:-.02em}
.profile-switcher{position:relative;flex-shrink:0}
.profile-pill{display:flex;align-items:center;gap:12px;min-height:48px;padding:6px 14px 6px 8px;border-radius:var(--radius-pill);background:var(--bg-glass);backdrop-filter:blur(16px);border:1px solid var(--border-subtle);color:var(--text-primary);cursor:pointer;transition:all .25s var(--ease-spring)}
.profile-pill:hover{border-color:var(--border-bright);box-shadow:0 0 24px rgba(56,189,248,.15)}
.avatar-ring{width:34px;height:34px;border-radius:50%;background:var(--grad-accent);color:#030712;font:700 13px var(--font-display);display:grid;place-items:center}
.profile-meta{display:flex;flex-direction:column;text-align:left;line-height:1.2}
.profile-name{font-weight:600;font-size:13.5px}.profile-tag{font:11px var(--font-mono);color:var(--text-secondary)}
.chevron-icon{color:var(--text-secondary);transition:transform .25s var(--ease-spring)}
.profile-pill[aria-expanded=true] .chevron-icon{transform:rotate(180deg)}
.profile-dropdown{position:absolute;right:0;top:calc(100% + 10px);min-width:240px;padding:8px;background:rgba(10,15,29,.97);backdrop-filter:blur(24px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-glass);z-index:60}
.profile-dropdown[hidden]{display:none}
.profile-option{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:var(--radius-md);background:transparent;color:var(--text-primary);font-size:14px;cursor:pointer}
.profile-option:hover,.profile-option.active{background:rgba(56,189,248,.12)}
.glass-card{background:var(--bg-glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);padding:26px;box-shadow:var(--shadow-glass);transition:transform .35s var(--ease-spring),border-color .35s,box-shadow .35s;animation:fadeUp .55s var(--ease-spring) both}
.glass-card:hover{border-color:rgba(255,255,255,.15)}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.dash-hero-grid{display:grid;grid-template-columns:1.05fr 1.25fr;gap:24px;margin-bottom:32px}
.score-hero-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.score-ring-wrap{position:relative;width:210px;height:210px;margin:12px 0 18px}
.score-ring-svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring-track{fill:none;stroke:rgba(255,255,255,.06);stroke-width:10}
.ring-progress{fill:none;stroke-width:10;stroke-linecap:round;stroke-dasharray:534;stroke-dashoffset:534;transition:stroke-dashoffset 1.3s var(--ease-spring);filter:drop-shadow(0 0 12px var(--ring-glow,#10b981))}
.score-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.score-num{font:700 54px/1 var(--font-mono);letter-spacing:-.04em}
.score-denom{font:12px var(--font-mono);color:var(--text-secondary);margin-top:6px;letter-spacing:.1em}
.summary-drawer-toggle{margin-top:14px;background:var(--bg-elevated);border:1px solid var(--border-subtle);color:var(--text-secondary);padding:10px 16px;border-radius:var(--radius-pill);font-size:12.5px;cursor:pointer}
.summary-drawer-toggle:hover{color:var(--text-primary);border-color:var(--border-bright)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:32px 0 16px}
.section-title{font:600 18px var(--font-display)}
.section-link{background:none;border:0;color:var(--accent-blue);font:12px var(--font-mono);cursor:pointer}
.priority-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.priority-card{cursor:pointer;border-left:3px solid var(--card-accent,var(--status-bad))}
.priority-card:hover{transform:translateY(-4px)}
.big-readout{font:700 32px var(--font-mono);margin:10px 0 6px;letter-spacing:-.03em}
.unit-label{font-size:13px;font-weight:400;color:var(--text-secondary)}
.bento-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.bento-card{cursor:pointer;padding:20px}.bento-card:hover{transform:translateY(-3px);border-color:var(--border-bright)}
.bento-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.bento-ratio{font:700 22px var(--font-mono)}
.mini-bar{height:6px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden;margin-top:12px}
.mini-bar>i{display:block;height:100%;width:0;border-radius:99px;transition:width 1s var(--ease-spring)}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--radius-pill);font:600 11px var(--font-mono);letter-spacing:.03em;white-space:nowrap}
.b-ok{background:var(--status-ok-bg);color:#34d399;border:1px solid rgba(16,185,129,.3)}
.b-bd{background:var(--status-bd-bg);color:#fbbf24;border:1px solid rgba(245,158,11,.3)}
.b-bad{background:var(--status-bad-bg);color:#fb7185;border:1px solid rgba(244,63,94,.35)}
.b-ev{background:rgba(56,189,248,.12);color:#7dd3fc;border:1px solid rgba(56,189,248,.3)}
.explorer-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px}
.search-box{position:relative;flex:1;min-width:240px;max-width:380px}
.search-input,.field{width:100%;min-height:44px;padding:10px 16px;border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-subtle);color:var(--text-primary);font:14px var(--font-sans);outline:0}
.search-input{padding-left:40px;border-radius:var(--radius-pill)}
.search-input:focus,.field:focus{border-color:var(--accent-cyan)}
select.field{appearance:none;background-image:none}
textarea.field{min-height:90px;resize:vertical}
.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-secondary);pointer-events:none}
.toggle-pill{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 16px;border-radius:var(--radius-pill);background:var(--bg-glass);border:1px solid var(--border-subtle);color:var(--text-secondary);font-size:13px;font-weight:500;cursor:pointer}
.toggle-pill.active{color:var(--text-primary);border-color:var(--status-bad);background:rgba(244,63,94,.12)}
.chip-scroller{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:24px;scrollbar-width:none}
.chip-scroller::-webkit-scrollbar{display:none}
.chip{flex-shrink:0;min-height:40px;padding:8px 16px;border-radius:var(--radius-pill);border:1px solid var(--border-subtle);background:var(--bg-glass);color:var(--text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:all .25s var(--ease-spring)}
.chip:hover{color:var(--text-primary)}
.chip.on{background:var(--grad-accent);color:#020617;font-weight:600;border-color:transparent;box-shadow:0 6px 20px rgba(0,242,254,.25)}
.marker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:18px}
.marker-card{display:flex;flex-direction:column;justify-content:space-between;gap:16px;cursor:pointer}
.marker-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.marker-title{font:600 16px var(--font-display)}
.marker-cat{font:11px var(--font-mono);color:var(--text-secondary);margin-top:2px}
.range-chips{display:flex;flex-wrap:wrap;gap:8px}
.range-chip{font:11px var(--font-mono);padding:4px 10px;border-radius:8px;background:rgba(255,255,255,.04);border:1px solid var(--border-subtle);color:var(--text-secondary)}
.range-chip strong{color:var(--text-primary)}
.spec{position:relative;height:8px;border-radius:99px;background:rgba(255,255,255,.05);display:flex;margin:12px 0 6px}
.spec>span{height:100%;width:0;transition:width .9s var(--ease-spring)}
.spec>span:first-child{border-radius:99px 0 0 99px}.spec>span:nth-child(5){border-radius:0 99px 99px 0}
.z0{background:rgba(244,63,94,.45)}.z1{background:rgba(245,158,11,.45)}.z2{background:rgba(16,185,129,.55)}
.pin{position:absolute;top:50%;left:0;width:14px;height:14px;border-radius:50%;background:var(--g,#10b981);border:2px solid #fff;transform:translate(-50%,-50%);box-shadow:0 0 14px var(--g,#10b981);transition:left 1s var(--ease-spring);z-index:2}
.marker-expand{display:flex;align-items:center;justify-content:space-between;padding-top:12px;margin-top:12px;border-top:1px solid var(--border-subtle);font-size:12px;color:var(--text-secondary)}
.marker-details{display:none;padding-top:12px;font-size:13px;color:var(--text-secondary)}
.marker-card.expanded .marker-details{display:block}
.expand-arrow{transition:transform .3s}.marker-card.expanded .expand-arrow{transform:rotate(180deg)}
.timeline-track{position:relative;padding-left:36px;max-width:880px}
.timeline-track::before{content:'';position:absolute;left:11px;top:12px;bottom:12px;width:2px;background:linear-gradient(180deg,var(--accent-cyan),var(--accent-violet),transparent)}
.tl-node{position:relative;margin-bottom:24px}
.tl-dot{position:absolute;left:-31px;top:26px;width:14px;height:14px;border-radius:50%;background:var(--accent-cyan);border:3px solid var(--bg-void);box-shadow:0 0 16px var(--accent-cyan)}
.tl-node.ill .tl-dot{background:var(--status-bad);box-shadow:0 0 16px var(--status-bad)}
.tl-body{display:none;margin-top:12px;color:var(--text-secondary);font-size:14px}.tl-node.open .tl-body{display:block}
.fab-add{position:fixed;right:36px;bottom:36px;height:56px;padding:0 24px;border-radius:var(--radius-pill);border:0;background:var(--grad-accent);color:#020617;font:700 14px var(--font-display);display:inline-flex;align-items:center;gap:10px;cursor:pointer;box-shadow:0 12px 32px rgba(0,242,254,.35);z-index:25}
.btn-primary{min-height:48px;padding:0 24px;border:0;border-radius:var(--radius-pill);background:var(--grad-accent);color:#020617;font:700 14px var(--font-display);cursor:pointer}
.chart-stage{height:320px;position:relative}
.gauge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.gauge-card{text-align:center;padding:20px}
.gauge-svg{width:140px;height:82px;overflow:visible}
.gauge-track{fill:none;stroke:rgba(255,255,255,.08);stroke-width:10;stroke-linecap:round}
.gauge-arc{fill:none;stroke-width:10;stroke-linecap:round;stroke-dasharray:157.1;stroke-dashoffset:157.1;transition:stroke-dashoffset 1.2s var(--ease-spring)}
.rx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:24px}
.plate-list{display:flex;flex-direction:column;gap:10px;margin:18px 0}
.plate-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:var(--radius-md);background:var(--bg-elevated);border:1px solid var(--border-subtle)}
.plate-food{font-weight:500}.plate-metrics{display:flex;gap:10px;font:12px var(--font-mono);color:var(--text-secondary);text-align:right}
.plate-metrics b{color:var(--text-primary)}
.supp-drawer{margin-top:16px;padding:14px 16px;border-radius:var(--radius-md);background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.3);color:#fcd34d;font-size:13.5px}
.drawer-backdrop{position:fixed;inset:0;z-index:100;background:rgba(2,6,15,.65);backdrop-filter:blur(6px);display:flex;justify-content:flex-end}
.drawer-backdrop[hidden]{display:none}
.slide-drawer{width:min(480px,100%);height:100%;overflow-y:auto;background:rgba(10,15,29,.98);border-left:1px solid var(--border-subtle);padding:24px;animation:slideIn .4s var(--ease-spring)}
@keyframes slideIn{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
.drawer-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:20px}
.drawer-header h2{font:700 22px var(--font-display)}
.icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--border-subtle);background:var(--bg-elevated);color:var(--text-primary);cursor:pointer;flex-shrink:0}
.form-grid{display:grid;gap:12px}.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-grid label{font:11px var(--font-mono);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em}
.sk-card{border-radius:var(--radius-xl);height:180px;margin-bottom:20px;background:linear-gradient(90deg,rgba(255,255,255,.03),rgba(255,255,255,.08),rgba(255,255,255,.03));background-size:200% 100%;animation:sh 1.4s infinite}
@keyframes sh{to{background-position:-200% 0}}
@media(max-width:900px){
.app-layout{grid-template-columns:1fr}
.nav-dock{position:fixed;top:auto;bottom:10px;left:10px;right:10px;height:auto;margin:0;padding:6px;flex-direction:row;border-radius:20px}
.brand-lockup,.dock-footer{display:none}
.nav-list{flex-direction:row;margin:0;gap:2px}
.nav-btn{flex-direction:column;justify-content:center;gap:3px;min-height:52px;padding:6px 2px;font-size:10.5px;text-align:center}
.viewport{padding:18px 14px 110px}
.dash-hero-grid{grid-template-columns:1fr}
.profile-meta{display:none}.profile-pill{padding:6px 10px 6px 6px}
.marker-grid,.rx-grid{grid-template-columns:1fr}
.fab-add{right:16px;bottom:96px;height:50px;padding:0 18px}
.glass-card{padding:20px}.rx-grid .glass-card{padding:18px}
}
/* overflow fix */
.glass-card,.plate-item,.viewport,.rx-grid>*,.marker-grid>*{min-width:0}
.plate-food{flex:1;min-width:0;overflow-wrap:anywhere}
.plate-metrics{flex-shrink:0;white-space:nowrap}
.supp-drawer,.glass-card p{overflow-wrap:anywhere}
@media(max-width:900px){
.app-layout{grid-template-columns:minmax(0,1fr)}
.marker-grid,.rx-grid,.priority-strip,.bento-grid{grid-template-columns:minmax(0,1fr)}
.plate-item{flex-wrap:wrap}
.plate-food{flex-basis:100%}
.plate-metrics{width:100%;justify-content:space-between;gap:8px}
.timeline-track{max-width:100%}
}
/* v3 fixes: wrapping badges, ring glow artifact */
.badge{white-space:normal;max-width:100%;text-align:left;line-height:1.35;border-radius:14px;overflow-wrap:anywhere}
.ring-progress{filter:none!important}
.score-ring-wrap::before{content:"";position:absolute;inset:14px;border-radius:50%;background:radial-gradient(circle,transparent 58%,var(--ring-bg,rgba(16,185,129,.16)) 72%,transparent 74%);filter:blur(10px);pointer-events:none}
.score-ring-svg{overflow:visible}
.score-denom{font-size:10px;letter-spacing:.06em;white-space:nowrap}
.score-hero-card .eyebrow{font-size:10px;letter-spacing:.1em}
/* timeline v2 */
.tl-card{padding:20px 22px}
.tl-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.tl-date{font:600 15px var(--font-display);color:var(--text-primary);margin-right:10px}
.tl-time{font:12px var(--font-mono);color:var(--text-muted)}
.tl-age{font:600 11px var(--font-mono);color:var(--text-secondary);padding:3px 10px;border-radius:99px;border:1px solid var(--border-subtle);background:var(--bg-elevated);white-space:nowrap}
.tl-title{font:600 19px/1.25 var(--font-display);margin-bottom:12px}
.tl-chips{display:flex;flex-wrap:wrap;gap:8px}
.tl-body{border-top:1px solid var(--border-subtle);margin-top:14px;padding-top:12px}
.tl-meta{font:12px/1.7 var(--font-mono);color:var(--accent-blue)}
.tl-node.ill .tl-meta{color:#fb7185}
/* trend v2 */
.trend-card{padding:22px}
.trend-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.trend-val{font:700 38px/1.1 var(--font-mono);letter-spacing:-.03em;margin-top:6px}
.trend-key{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 6px}
.kdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.trend-card .chart-stage{height:300px;margin-top:8px}
