/* ═══════════════════════════════════════════════════════════════
   ORION Command — page-specific CSS · Phase 2
   Extracted verbatim from the page's former inline <style> block.
   Rule order preserved exactly — do not resort or regroup.
   Load order contract: /assets/orion.css loads FIRST, then this
   file, so these page styles override the shared foundation.
   ═══════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════
   ORION — Galaxy Tab A9+ Tablet Layout Edition
   cinematic homelab control center
   Single-file • vanilla • landscape kiosk (Galaxy Tab A9+ 5G)
   Design canvas: 1280 × 800, scaled to fit any landscape.
══════════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ORION design tokens (incl. severity palette) moved to
   /assets/orion.css — shared foundation, Phase 1. */

html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);
  font-family:'Rajdhani',sans-serif;color:var(--text);
  -webkit-font-smoothing:antialiased;user-select:none;-webkit-tap-highlight-color:transparent}

/* ── Fit-to-viewport stage ─────────────────────────────── */
#viewport{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(ellipse 120% 100% at 50% 50%,#06101e 0%,#03060c 70%,#000 100%);overflow:hidden}
#stage{width:1280px;height:800px;position:relative;transform-origin:center center;flex:0 0 auto}

/* ── Atmosphere layers (.fx / .fx-glow / .fx-grid / .fx-scan / .fx-vig +
     breathe/scan keyframes) moved to /assets/orion.css — Phase 1 ── */

/* ── Root grid ─────────────────────────────────────────── */
#root{position:absolute;inset:0;z-index:2;display:grid;
  grid-template-rows:64px 332px 58px 144px 150px;
  gap:8px;padding:10px;
  animation:drift 120s ease-in-out infinite}      /* AMOLED micro-drift */
@keyframes drift{
  0%{transform:translate(0,0)}   20%{transform:translate(.6px,.4px)}
  40%{transform:translate(0,.8px)} 60%{transform:translate(-.6px,.3px)}
  80%{transform:translate(.3px,-.5px)} 100%{transform:translate(0,0)}}

/* ── Glass panel base (.panel + pseudos) moved to /assets/orion.css — Phase 1 ── */

/* Corner ticks (.frame-corner / .c-*) moved to /assets/orion.css — Phase 1 */

/* .eyebrow label primitive moved to /assets/orion.css — Phase 1 */

/* ══════════ HEADER ══════════ */
#hdr{grid-row:1;display:flex;align-items:center;gap:15px;padding:0 20px;border-color:var(--line-2)}
.logo{width:48px;height:48px;flex-shrink:0;position:relative}
.logo svg{width:100%;height:100%;display:block}
.logo .lr{transform-origin:50% 50%}
.logo .lr-a{animation:spin 26s linear infinite}
.logo .lr-b{animation:spin 14s linear infinite reverse}

.brand{line-height:1}
.brand h1{font-family:'Orbitron',sans-serif;font-size:33px;font-weight:900;letter-spacing:.16em;
  background:linear-gradient(92deg,#7ff6ff,var(--cyan) 45%,var(--aqua) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 14px rgba(34,233,255,.35))}
.brand p{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:500;
  letter-spacing:.34em;color:var(--dim);margin-top:3px}

.divider{width:1px;height:40px;flex-shrink:0;margin:0 4px;
  background:linear-gradient(transparent,var(--line-2),transparent)}

.sysbadge{display:flex;flex-direction:column;gap:4px;padding:7px 14px;border-radius:10px;
  border:1px solid rgba(39,255,212,.28);background:rgba(8,28,30,.5)}
.sysbadge .row{display:flex;align-items:center;gap:8px;
  font-family:'Orbitron',sans-serif;font-size:12px;font-weight:700;letter-spacing:.13em;color:var(--aqua)}
.sysbadge small{font-family:'Rajdhani',sans-serif;font-size:10px;letter-spacing:.18em;color:rgba(39,255,212,.5)}

.dot{width:9px;height:9px;border-radius:50%;background:var(--aqua);flex-shrink:0;
  box-shadow:0 0 8px var(--aqua),0 0 16px rgba(39,255,212,.5);animation:pip 2.6s ease-in-out infinite}
@keyframes pip{0%,100%{box-shadow:0 0 5px var(--aqua),0 0 10px rgba(39,255,212,.35);opacity:.85}
  50%{box-shadow:0 0 11px var(--aqua),0 0 22px rgba(39,255,212,.6);opacity:1}}

/* ecosystem status pips */
.eco{display:flex;align-items:center;gap:16px;margin-left:8px}
.eco .pip{display:flex;align-items:center;gap:6px}
.eco .pip i{width:8px;height:8px;border-radius:50%;display:block;background:var(--cyan);
  box-shadow:0 0 7px var(--cyan);animation:pip 3s ease-in-out infinite}
.eco .pip.m i{background:var(--magenta);box-shadow:0 0 7px var(--magenta)}
.eco .pip.p i{background:var(--purple);box-shadow:0 0 7px var(--purple)}
.eco .pip span{font-family:'Orbitron',sans-serif;font-size:9px;font-weight:600;letter-spacing:.1em;color:var(--dim)}

.spacer{flex:1}

.clock{text-align:right;line-height:1;flex-shrink:0}
.clock .t{font-family:'Orbitron',sans-serif;font-size:30px;font-weight:700;color:var(--cyan);
  text-shadow:0 0 18px rgba(34,233,255,.45)}
.clock .t small{font-size:15px;color:var(--dim);font-weight:500}
.clock .d{font-family:'Rajdhani',sans-serif;font-size:11px;letter-spacing:.16em;color:var(--dim);margin-top:4px}

.wx{display:flex;flex-direction:column;align-items:flex-end;padding-left:16px;
  margin-left:6px;border-left:1px solid var(--line);flex-shrink:0;line-height:1.1}
.wx .temp{font-family:'Orbitron',sans-serif;font-size:22px;font-weight:700;color:var(--aqua)}
.wx .sub{font-family:'Rajdhani',sans-serif;font-size:11px;letter-spacing:.12em;color:var(--dim)}

/* ══════════ MAIN ROW ══════════ */
#main{grid-row:2;display:grid;grid-template-columns:290px 1fr 290px;gap:8px}

/* ── Gauges (2×2 true circular HUD dials) ── */
#gauges{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px}
.gauge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:6px}
.gauge .dial{position:relative;width:96px;height:96px}
.gauge .dial svg{width:100%;height:100%;display:block}
.gauge .read{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.gauge .read b{font-family:'Orbitron',sans-serif;font-size:16px;font-weight:700;color:#eaffff;
  text-shadow:0 0 10px rgba(34,233,255,.5)}
.gauge .read b u{font-size:8px;text-decoration:none;color:var(--dim);font-weight:500}
.gauge .lab{font-family:'Orbitron',sans-serif;font-size:9.5px;font-weight:600;letter-spacing:.2em;color:var(--dim)}
.arc-bg{fill:none;stroke:rgba(40,210,255,.1);stroke-width:4;stroke-linecap:round}
.arc-fg{fill:none;stroke-width:4;stroke-linecap:round;
  transition:stroke-dashoffset 1.4s cubic-bezier(.22,1,.36,1);filter:drop-shadow(0 0 4px currentColor)}
.tick{stroke:rgba(40,210,255,.3);stroke-width:1.2}

/* ── AI CORE ── */
#core{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.core-amb{position:absolute;width:360px;height:360px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(124,58,237,.16),rgba(34,233,255,.06) 42%,transparent 70%);
  animation:pulse 7s ease-in-out infinite}
.core-svg{position:relative;width:286px;height:286px;z-index:2}
.core-svg svg{width:100%;height:100%;overflow:visible}
.spin-cw{transform-origin:124px 124px;animation:spin 46s linear infinite}
.spin-ccw{transform-origin:124px 124px;animation:spin 34s linear infinite reverse}
.spin-cw-s{transform-origin:124px 124px;animation:spin 22s linear infinite}
.spin-ccw-s{transform-origin:124px 124px;animation:spin 28s linear infinite reverse}
.spin-cw-vslow{transform-origin:124px 124px;animation:spin 80s linear infinite}
.core-hub{position:absolute;z-index:5;width:150px;height:150px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  background:radial-gradient(circle at 38% 32%,rgba(34,233,255,.15),rgba(124,58,237,.1) 48%,rgba(3,8,18,.98) 100%);
  border:1px solid rgba(34,233,255,.34);
  box-shadow:0 0 42px rgba(34,233,255,.15),0 0 86px rgba(124,58,237,.11),inset 0 0 28px rgba(34,233,255,.07);
  animation:pulse 7s ease-in-out infinite}
.core-hub::before{content:'';position:absolute;inset:7px;border-radius:50%;
  border:1px solid rgba(34,233,255,.16);box-shadow:inset 0 0 10px rgba(34,233,255,.06)}
@keyframes pulse{0%,100%{box-shadow:0 0 34px rgba(34,233,255,.11),0 0 64px rgba(124,58,237,.07),inset 0 0 24px rgba(34,233,255,.05);opacity:.94}
  50%{box-shadow:0 0 56px rgba(34,233,255,.21),0 0 108px rgba(124,58,237,.14),inset 0 0 38px rgba(34,233,255,.1);opacity:1}}
/* ORION is the hero label of the hub (AI CORE / ONLINE / health removed —
   that status lives in the header, System Health and the chips). */
.core-hub .cn{font-family:'Orbitron',sans-serif;font-size:24px;font-weight:800;letter-spacing:.18em;color:var(--cyan);
  text-shadow:0 0 18px var(--cyan);margin:10px 0 3px;
  transition:text-shadow .5s ease,color .5s ease}
/* Voice aperture — ORION's speaking "mouth". Bars are built once in JS
   (buildVoiceAperture); only each bar's height/y is updated per animation
   frame. Colour + glow change per voice state via the scoped rules below. */
.voice-aperture{width:104px;height:42px;color:rgba(34,233,255,.5);opacity:.9;
  filter:drop-shadow(0 0 3px rgba(34,233,255,.3));
  transition:color .5s ease,filter .5s ease,opacity .5s ease}
.voice-aperture svg{width:100%;height:100%;display:block;overflow:visible}
.voice-aperture rect{fill:currentColor}

/* floating chips beside core */
.core-chips{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:9px;z-index:4}
.core-chips.l{left:10px}.core-chips.r{right:10px;text-align:right}
.cchip{width:92px;padding:8px 10px;border-radius:9px;background:rgba(3,12,26,.74);
  border:1px solid var(--line);backdrop-filter:blur(6px)}
.cchip .k{font-family:'Orbitron',sans-serif;font-size:8px;font-weight:600;letter-spacing:.14em;color:var(--dim)}
.cchip .v{font-family:'Orbitron',sans-serif;font-size:19px;font-weight:700;color:var(--cyan);line-height:1.15}
.cchip .v.m{color:var(--magenta)}.cchip .v.p{color:var(--purple)}
.cchip .s{font-size:9px;letter-spacing:.06em;color:rgba(39,255,212,.6)}

/* ── Quick Actions (2×4 grid) ── */
#qa{display:flex;flex-direction:column;gap:7px}
#qa .qa-head{display:flex;align-items:center;justify-content:space-between;padding:0 3px;flex-shrink:0}
#qa .qa-head .eyebrow{letter-spacing:.22em}
#qa .qa-head i{font-family:'Orbitron',sans-serif;font-size:8px;color:var(--aqua);letter-spacing:.1em;font-style:normal}
.qa-grid{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:7px}
.qa-btn{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;
  padding:0 13px;border-radius:10px;cursor:pointer;position:relative;overflow:hidden;
  background:linear-gradient(150deg,rgba(8,26,46,.66),rgba(6,18,34,.5));
  border:1px solid var(--line);transition:border-color .2s,box-shadow .2s,transform .12s,background .2s}
.qa-btn svg{width:21px;height:21px;display:block;margin-bottom:2px}
.qa-btn .qt{font-family:'Orbitron',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.05em;color:var(--cyan)}
.qa-btn .qs{font-family:'Rajdhani',sans-serif;font-size:9.5px;letter-spacing:.04em;color:var(--dim);line-height:1.1}
.qa-btn::before{content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(40,210,255,.12),transparent);transition:left .55s ease}
.qa-btn:hover{border-color:var(--line-2);background:linear-gradient(150deg,rgba(12,40,70,.7),rgba(8,24,46,.55));
  box-shadow:0 0 16px rgba(34,233,255,.12),inset 0 0 12px rgba(34,233,255,.05)}
.qa-btn:hover::before{left:140%}
.qa-btn:active{transform:scale(.96)}

/* ══════════ ALEXA FEATURE STRIP ══════════ */
#alexa{grid-row:3;display:flex;align-items:center;gap:18px;padding:0 22px;cursor:pointer;
  border-color:rgba(124,58,237,.26)}
#alexa::after{content:'';position:absolute;top:0;left:6%;right:6%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(124,58,237,.5),transparent)}
.alexa-logo{width:40px;height:40px;flex-shrink:0}
.alexa-logo svg{width:100%;height:100%;animation:spin 18s linear infinite}
.alexa-copy{display:flex;align-items:baseline;gap:11px;flex-shrink:0}
.alexa-copy h2{font-family:'Orbitron',sans-serif;font-size:18px;font-weight:700;letter-spacing:.1em;
  background:linear-gradient(92deg,var(--cyan),#9bd9ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.beta{font-family:'Orbitron',sans-serif;font-size:9px;font-weight:700;letter-spacing:.12em;color:#f0d7ff;
  padding:3px 9px;border-radius:10px;background:rgba(124,58,237,.32);border:1px solid rgba(168,85,247,.5)}
.alexa-copy .tag{font-family:'Rajdhani',sans-serif;font-size:12.5px;letter-spacing:.06em;color:var(--text);opacity:.78}
.alexa-quote{font-family:'Rajdhani',sans-serif;font-size:12.5px;font-style:italic;letter-spacing:.04em;
  color:var(--magenta);flex-shrink:0;opacity:.92}
.alexa-wave{flex:1;height:40px;min-width:80px}
.alexa-wave svg{width:100%;height:100%}
.chev{flex-shrink:0;color:var(--dim);font-size:22px;transition:transform .2s,color .2s}
#alexa:hover .chev{transform:translateX(3px);color:var(--cyan)}

/* ══════════ MODULE STRIP ══════════ */
#modules{grid-row:4;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mod{padding:12px 15px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.mod .m-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mod .m-title{font-family:'Orbitron',sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--cyan)}
.mod .m-led{width:8px;height:8px;border-radius:50%;background:var(--aqua);box-shadow:0 0 7px var(--aqua);
  animation:pip 2.8s ease-in-out infinite;flex-shrink:0}
.mod .m-led.m{background:var(--magenta);box-shadow:0 0 7px var(--magenta)}
.mod .m-body{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;flex:1;margin-top:6px}
.mod .m-stat{line-height:1.05}
.mod .m-stat .big{font-family:'Orbitron',sans-serif;font-size:30px;font-weight:700;color:#eaffff;
  text-shadow:0 0 12px rgba(34,233,255,.4)}
.mod .m-stat .big.m{color:var(--magenta);text-shadow:0 0 12px rgba(227,75,255,.4)}
.mod .m-stat .k{font-family:'Orbitron',sans-serif;font-size:9px;font-weight:600;letter-spacing:.16em;color:var(--dim)}
.mod .m-stat .on{font-family:'Orbitron',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.12em;color:var(--aqua)}
.mod .m-art{flex-shrink:0;align-self:center}
.mod .m-art svg{display:block}
.mod-bg{position:absolute;inset:0;opacity:.5;pointer-events:none;z-index:0}
.mod-bg svg{width:100%;height:100%}

/* environment readouts — symmetrical 3-col × 2-row telemetry grid */
.mod .m-body.env{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr 1fr;
  gap:6px 8px;align-items:stretch;margin-top:6px}
.env .env-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  border:1px solid var(--line);border-radius:9px;background:rgba(34,233,255,.035);padding:4px 3px;min-width:0}
.env .env-k{font-family:'Orbitron',sans-serif;font-size:9px;font-weight:600;letter-spacing:.16em;color:var(--dim)}
.env .env-v{font-family:'Orbitron',sans-serif;font-size:19px;font-weight:700;color:#eaffff;line-height:1;
  text-shadow:0 0 12px rgba(34,233,255,.4)}

/* ══════════ BOTTOM ROW ══════════ */
#bottom{grid-row:5;display:grid;grid-template-columns:1fr 330px;gap:8px}

/* activity */
.act{padding:11px 18px}
.act .a-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}
.act .a-list{display:grid;grid-template-columns:1fr 1fr;gap:4px 34px}
.a-item{display:flex;align-items:center;gap:8px;font-family:'Rajdhani',sans-serif;font-size:13px;
  font-weight:500;color:rgba(190,224,242,.82);line-height:1.7}
.a-item i{width:7px;height:7px;border-radius:50%;flex-shrink:0;display:block}
.a-item .at{margin-left:auto;font-size:11px;color:var(--dim);flex-shrink:0;font-family:'Orbitron',sans-serif;letter-spacing:.04em}

/* ── ATTENTION PANEL (repurposed bottom-left; operator-facing) ─────────── */
.act.attn{padding:9px 16px;display:flex;flex-direction:column;overflow:hidden}
.act.attn .a-head{margin-bottom:6px}
.attn-nav{display:flex;align-items:center;gap:8px}
.attn-count{font-family:'Orbitron',sans-serif;font-size:9px;letter-spacing:.1em;color:var(--dim-2)}
.attn-arrow{width:22px;height:20px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:6px;background:var(--glass);color:var(--dim);
  font-size:13px;line-height:1;cursor:pointer;transition:border-color .15s,color .15s,opacity .15s}
.attn-arrow:hover{border-color:var(--line-2);color:var(--cyan)}
.attn-arrow:disabled{opacity:.28;cursor:default}
.attn-nav.hidden{display:none}
.attn-list{flex:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-height:0;align-items:stretch}
.attn-card{display:block;text-align:left;width:100%;min-width:0;height:100%;overflow:hidden;border:1px solid var(--line);border-left-width:3px;
  border-radius:9px;background:var(--glass);padding:7px 11px;cursor:pointer;
  transition:border-color .15s,box-shadow .15s,transform .1s;font-family:'Rajdhani',sans-serif}
.attn-card:hover{border-color:var(--line-2);box-shadow:0 0 14px rgba(34,233,255,.1)}
.attn-card:active{transform:scale(.995)}
.attn-card .ac-title{font-family:'Orbitron',sans-serif;font-size:10px;font-weight:600;letter-spacing:.05em;
  color:var(--text);line-height:1.3;margin-bottom:3px}
.attn-card .ac-row{font-size:12.5px;line-height:1.35;color:rgba(190,224,242,.86)}
.attn-card .ac-row b{font-family:'Orbitron',sans-serif;font-size:8.5px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--dim-2);margin-right:5px}
.attn-card.sev-critical{border-left-color:var(--pink)}
.attn-card.sev-critical .ac-title{color:#ffd7e6}
.attn-card.sev-warning{border-left-color:var(--purple)}
.attn-card.sev-cannot_verify{border-left-color:var(--magenta)}
.attn-card.sev-not_configured{border-left-color:rgba(34,233,255,.5)}
.attn-card.sev-partial{border-left-color:var(--aqua)}
.attn-empty{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;
  color:var(--dim);font-family:'Rajdhani',sans-serif;font-size:13.5px;letter-spacing:.02em}

/* ── Quick-action readiness label ──────────────────────────────────────── */
.qa-ready{font-family:'Orbitron',sans-serif;font-size:8px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;margin-top:2px;line-height:1}
.qa-ready.is-ready{color:var(--aqua)}
.qa-ready.is-setup{color:var(--purple)}

/* ── Clickable ecosystem pips (same-tab deep links) ────────────────────── */
.eco .pip[role=link]{cursor:pointer;border-radius:6px;padding:2px 4px;margin:-2px -4px;
  transition:background .15s}
.eco .pip[role=link]:hover{background:rgba(34,233,255,.08)}
.eco .pip[role=link]:hover span{color:var(--cyan)}

/* health */
.health{display:flex;align-items:center;gap:16px;padding:0 18px}
.health .h-ring{position:relative;width:68px;height:68px;flex-shrink:0}
.health .h-ring svg{width:100%;height:100%}
.health .h-info .h-title{font-family:'Orbitron',sans-serif;font-size:10px;font-weight:600;letter-spacing:.16em;color:var(--dim)}
.health .h-info .h-pct{font-family:'Orbitron',sans-serif;font-size:38px;font-weight:700;color:#eaffff;line-height:1;
  text-shadow:0 0 18px rgba(34,233,255,.5)}
.health .h-info .h-pct sup{font-size:18px;color:var(--cyan)}
.health .h-info .h-lab{font-family:'Orbitron',sans-serif;font-size:11px;font-weight:600;letter-spacing:.18em;color:var(--aqua);margin-top:2px}

/* ══════════ TOAST ══════════ */
#toast{position:absolute;top:80px;left:50%;transform:translate(-50%,-8px);z-index:200;
  display:flex;align-items:center;gap:9px;padding:9px 20px;border-radius:24px;
  font-family:'Orbitron',sans-serif;font-size:11px;font-weight:600;letter-spacing:.08em;
  background:rgba(8,22,40,.92);border:1px solid var(--line-2);color:var(--cyan);
  backdrop-filter:blur(10px);box-shadow:0 8px 28px rgba(0,0,0,.5),0 0 18px rgba(34,233,255,.15);
  opacity:0;pointer-events:none;transition:opacity .35s,transform .35s}
#toast.show{opacity:1;transform:translate(-50%,0)}
#toast.warn{border-color:rgba(227,75,255,.5);color:var(--magenta);box-shadow:0 8px 28px rgba(0,0,0,.5),0 0 18px rgba(227,75,255,.18)}
#toast i{width:9px;height:9px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}

@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
/* ORION_ALERT_PATCH */
.health .h-info #alertLab{margin-top:4px;color:var(--teal);opacity:.95}
.health .h-info #alertLab.warn{color:#ff3df2;text-shadow:0 0 12px rgba(255,61,242,.65)}

/* ORION_HEALTH_CARD_ALERT_LINK — whole System Health card opens Alerts */
.health.panel{cursor:pointer;transition:border-color .18s,box-shadow .18s}
.health.panel:hover{border-color:rgba(34,233,255,.38);box-shadow:0 0 18px rgba(34,233,255,.12),inset 0 0 14px rgba(34,233,255,.04)}

/* ORION_MODULE_CARD_LINKS — selected module cards open their native tools */
.mod.mod-click{cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .12s}
.mod.mod-click:hover{border-color:rgba(34,233,255,.38);box-shadow:0 0 18px rgba(34,233,255,.12),inset 0 0 14px rgba(34,233,255,.04)}
.mod.mod-click:active{transform:scale(.99)}
.mod.mod-click .m-title::after{content:"  OPEN";font-size:7px;letter-spacing:.18em;color:rgba(34,233,255,.55)}

/* ORION_ACTIVITY_PANEL_ACTIONS_LINK - Recent Activity opens the Actions log */
.act.panel[onclick]{cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .12s}
.act.panel[onclick]:hover{border-color:rgba(34,233,255,.38);box-shadow:0 0 18px rgba(34,233,255,.12),inset 0 0 14px rgba(34,233,255,.04)}
.act.panel[onclick]:active{transform:scale(.99)}


/* ORION_MODULE_READABILITY_PATCH — enlarge Command module card text only */
#modules .mod:nth-child(-n+3) {
  padding: 14px 17px;
}

#modules .mod:nth-child(-n+3) .m-title {
  font-size: 13.5px;
  letter-spacing: .105em;
}

#modules .mod:nth-child(-n+3) .m-body {
  margin-top: 8px;
  align-items: center;
}

#modules .mod:nth-child(-n+3) .m-stat .big {
  font-size: 38px;
  line-height: 1;
}

#modules .mod:nth-child(-n+3) .m-stat .big span[style] {
  font-size: 16px !important;
}

#modules .mod:nth-child(-n+3) .m-stat .k {
  font-size: 11.5px;
  letter-spacing: .14em;
}

#modules .mod:nth-child(-n+3) .m-stat .on {
  font-size: 12.5px;
  letter-spacing: .11em;
  margin-top: 3px;
}

#modules .mod.mod-click .m-title::after {
  font-size: 8.5px;
}


/* ORION_ENVIRONMENT_READABILITY_PATCH — enlarge Command Environment card text */
#modules .mod:nth-child(4) {
  padding: 14px 17px;
}

#modules .mod:nth-child(4) .m-title {
  font-size: 13.5px;
  letter-spacing: .105em;
}

#modules .mod:nth-child(4) .m-body.env {
  margin-top: 8px;
  align-items: stretch;
  gap: 7px 9px;
}

#modules .mod:nth-child(4) .env .env-k {
  font-size: 10px;
  letter-spacing: .15em;
}

#modules .mod:nth-child(4) .env .env-v {
  font-size: 22px;
}

/* ════════════ ORION_BRAIN_PANEL — evidence & reasoning overlay (ADDITIVE) ════════════
   A compact, dismissible Brain dock. Lives inside #stage so it scales with the
   kiosk fit() transform. This is a pure overlay: deleting this CSS block, the
   #brainDock markup, and renderBrain() restores ORION Classic byte-for-byte.
   It introduces NO grid/layout changes and reuses the existing design tokens. */
#brainDock{position:absolute;top:0;right:0;height:100%;z-index:150;display:flex;align-items:center;
  pointer-events:none;font-family:'Rajdhani',sans-serif}
#brainTab{pointer-events:auto;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:9px;
  padding:13px 7px;margin-right:7px;border-radius:12px;background:var(--glass-2);border:1px solid var(--line-2);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 6px 22px rgba(0,0,0,.45);
  transition:border-color .2s,box-shadow .2s,opacity .25s}
#brainTab:hover{border-color:rgba(34,233,255,.45);box-shadow:0 6px 22px rgba(0,0,0,.5),0 0 16px rgba(34,233,255,.16)}
#brainTab .bt-glyph{font-size:13px;color:var(--cyan);line-height:1}
#brainTab .bt-label{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);
  font-family:'Orbitron',sans-serif;font-size:9px;font-weight:700;letter-spacing:.28em;color:var(--dim)}
#brainTab .bt-dot{width:10px;height:10px;border-radius:50%;background:var(--aqua);color:var(--aqua);box-shadow:0 0 9px currentColor}
#brainTab.sev-warning .bt-dot{animation:btpulse 1.8s ease-in-out infinite}
#brainTab.sev-critical .bt-dot{animation:btpulse 1.1s ease-in-out infinite}
@keyframes btpulse{0%,100%{box-shadow:0 0 6px currentColor}50%{box-shadow:0 0 16px currentColor,0 0 24px currentColor}}

#brainPanel{pointer-events:auto;position:absolute;top:8px;right:8px;bottom:8px;width:330px;display:none;
  flex-direction:column;border-radius:var(--r);overflow:hidden;background:var(--glass-2);border:1px solid var(--line-2);
  backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 26px rgba(34,233,255,.08)}
#brainDock.open #brainPanel{display:flex}
#brainDock.open #brainTab{opacity:0;pointer-events:none}
.bp-head{display:flex;align-items:flex-start;gap:10px;padding:13px 14px 11px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(34,233,255,.05),transparent)}
.bp-head .bp-icon{font-size:15px;color:var(--cyan);margin-top:1px}
.bp-head .bp-h1{font-family:'Orbitron',sans-serif;font-size:11px;font-weight:700;letter-spacing:.22em;color:var(--text)}
.bp-head .bp-sub{font-size:11px;letter-spacing:.02em;color:var(--dim);margin-top:3px;line-height:1.32}
.bp-close{margin-left:auto;cursor:pointer;width:30px;height:30px;flex-shrink:0;border-radius:8px;display:flex;
  align-items:center;justify-content:center;color:var(--dim);border:1px solid var(--line);font-size:14px;transition:.18s}
.bp-close:hover{color:var(--cyan);border-color:var(--line-2);background:rgba(34,233,255,.06)}
.bp-overall{padding:11px 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line-soft)}
.bp-overall .ov-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0;box-shadow:0 0 9px currentColor}
.bp-overall .ov-title{font-family:'Orbitron',sans-serif;font-size:12px;font-weight:700;letter-spacing:.09em}
.bp-overall .ov-conf{margin-left:auto;font-family:'Orbitron',sans-serif;font-size:9.5px;letter-spacing:.08em;color:var(--dim)}
.bp-list{flex:1;overflow-y:auto;padding:8px 8px 16px;display:flex;flex-direction:column;gap:7px;
  overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.bp-list::-webkit-scrollbar{width:5px}.bp-list::-webkit-scrollbar-thumb{background:rgba(34,233,255,.2);border-radius:3px}
/* keep an expanded card fully visible when it is the last item in the list */
.bi-card{scroll-margin-bottom:16px}
.bi-card{border:1px solid var(--line);border-radius:10px;background:var(--glass);overflow:hidden;transition:border-color .18s}
.bi-card.s-critical{border-color:rgba(255,94,160,.4)}.bi-card.s-warning{border-color:rgba(168,85,247,.34)}
.bi-card .bi-head{display:flex;align-items:center;gap:8px;padding:9px 11px;cursor:pointer}
.bi-head .bi-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;box-shadow:0 0 7px currentColor}
.bi-head .bi-title{font-family:'Orbitron',sans-serif;font-size:9.5px;font-weight:600;letter-spacing:.05em;color:var(--text);flex:1;line-height:1.3}
.bi-head .bi-conf{font-family:'Orbitron',sans-serif;font-size:9px;letter-spacing:.04em;color:var(--dim);flex-shrink:0}
.bi-head .bi-caret{font-size:8px;color:var(--dim-2);transition:transform .2s;flex-shrink:0}
.bi-card.open .bi-caret{transform:rotate(90deg)}
.bi-summary{padding:0 11px 9px;font-size:11.5px;line-height:1.4;color:var(--dim)}
.bi-body{display:none;padding:0 11px 11px}
.bi-card.open .bi-body{display:block}
.bi-body .bi-sec{font-family:'Orbitron',sans-serif;font-size:8px;font-weight:600;letter-spacing:.2em;color:var(--dim-2);text-transform:uppercase;margin:9px 0 5px;padding-top:8px;border-top:1px solid var(--line-soft)}
.bi-ev{display:flex;align-items:flex-start;gap:7px;font-size:11.5px;line-height:1.35;color:var(--text);margin-bottom:3px}
.bi-ev .ev-m{font-family:'Orbitron',sans-serif;font-weight:700;flex-shrink:0;width:11px;text-align:center}
.bi-ev.e-pass .ev-m{color:var(--aqua)}.bi-ev.e-fail .ev-m{color:var(--pink)}.bi-ev.e-unknown .ev-m{color:var(--dim)}
.bi-ev .ev-detail{color:var(--dim-2);font-size:10.5px}
.bi-cause{font-size:11.5px;line-height:1.4;color:var(--dim)}
.bi-action{margin-top:8px;display:flex;align-items:flex-start;gap:7px;font-size:11.5px;line-height:1.4;color:var(--aqua)}
.bi-action .ba-arrow{flex-shrink:0;font-weight:700}
.bp-empty{padding:22px 16px;text-align:center;color:var(--dim);font-size:12px;line-height:1.55}
.sev-dot-ok{background:var(--aqua);color:var(--aqua)}.sev-dot-info{background:var(--cyan);color:var(--cyan)}
.sev-dot-warning{background:var(--purple);color:var(--purple)}.sev-dot-critical{background:var(--pink);color:var(--pink)}


/* ORION_ENV_CARD_POLISH — reduce secondary value weight without changing data wiring */
#modules .mod.mod-env .env .env-v {
  font-size: 21px;
}

#modules .mod.mod-env .env .env-v.env-power {
  font-size: 19px;
}

#modules .mod.mod-env .env .env-v.env-cost {
  font-size: 18px;
  letter-spacing: .02em;
}

#modules .mod.mod-env .env .env-k {
  font-size: 9.5px;
}

#modules .mod.mod-env .env .env-cell {
  padding: 3px 3px;
}

/* ============================================================
   ORION VOICE — voice-activity UI (scoped, additive)
   Card responsibility: readable transcript/status of what ORION
   is doing/saying. Problems/diagnostics live in Alerts + System
   Health, never here. This block only styles presentation.
   ============================================================ */
/* Transcript line — the flexible, readable center of the strip */
#voiceLine{font-family:'Rajdhani',sans-serif;font-size:13.5px;font-weight:500;
  letter-spacing:.03em;color:var(--text);opacity:.94;font-style:normal;
  flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  line-height:1.2}
#voiceLine::after{content:'';display:inline-block;width:0}
#voiceLine.tw-typing::after{content:'\258C';margin-left:1px;color:var(--aqua);
  opacity:.85;animation:vCaret .9s step-end infinite}
@keyframes vCaret{0%,100%{opacity:.85}50%{opacity:0}}

/* State chip — repurposed from the old BETA badge */
.voice-chip{transition:background .25s,border-color .25s,color .25s,box-shadow .25s;white-space:nowrap}
.voice-chip.vc-idle{color:#cfe9ff;background:rgba(40,210,255,.14);border-color:rgba(40,210,255,.36)}
.voice-chip.vc-checking{color:#e6fbff;background:rgba(34,233,255,.22);border-color:rgba(34,233,255,.6);
  box-shadow:0 0 11px rgba(34,233,255,.32)}
.voice-chip.vc-speaking{color:#04241f;background:var(--aqua);border-color:var(--aqua);
  box-shadow:0 0 13px rgba(39,255,212,.5)}
.voice-chip.vc-alert{color:#fff;background:rgba(227,75,255,.34);border-color:var(--magenta);
  box-shadow:0 0 13px rgba(227,75,255,.42)}
.voice-chip.vc-offline{color:var(--dim);background:rgba(150,196,224,.1);border-color:var(--dim-2);box-shadow:none}

/* Keep the transcript primary: pin the ambient waveform to a slim accent */
#alexa .alexa-wave{flex:0 0 96px;min-width:0}

/* AI CORE hub — react to voice state (glow + wave colour).
   idle keeps the original 7s "pulse"; active states get their own
   breathing so the box-shadow visibly changes. */
.core-hub.vs-checking{border-color:rgba(34,233,255,.62);animation:vsCheck 1.5s ease-in-out infinite}
.core-hub.vs-speaking{border-color:rgba(39,255,212,.6);animation:vsSpeak 1.7s ease-in-out infinite}
.core-hub.vs-warning{border-color:rgba(227,75,255,.62);animation:vsWarn 1.9s ease-in-out infinite}
.core-hub.vs-error{border-color:rgba(255,94,160,.72);animation:vsErr 1s ease-in-out infinite}
@keyframes vsCheck{0%,100%{box-shadow:0 0 40px rgba(34,233,255,.16),inset 0 0 26px rgba(34,233,255,.08)}
  50%{box-shadow:0 0 60px rgba(34,233,255,.3),inset 0 0 34px rgba(34,233,255,.14)}}
@keyframes vsSpeak{0%,100%{box-shadow:0 0 44px rgba(39,255,212,.18),inset 0 0 28px rgba(39,255,212,.09)}
  50%{box-shadow:0 0 72px rgba(39,255,212,.34),inset 0 0 40px rgba(39,255,212,.18)}}
@keyframes vsWarn{0%,100%{box-shadow:0 0 42px rgba(227,75,255,.18),inset 0 0 26px rgba(227,75,255,.1)}
  50%{box-shadow:0 0 64px rgba(227,75,255,.34),inset 0 0 34px rgba(227,75,255,.16)}}
@keyframes vsErr{0%,100%{box-shadow:0 0 46px rgba(255,94,160,.22),inset 0 0 28px rgba(255,94,160,.12)}
  50%{box-shadow:0 0 78px rgba(255,94,160,.42),inset 0 0 40px rgba(255,94,160,.2)}}

/* Whole AI CORE reacts to voice state. applyCore() puts the vs-* class on BOTH
   #core and .core-hub, so the ambient glow, orbit SVG, ORION label and the
   voice aperture all respond — not just the little hub. CSS transitions here
   carry the state-level colour/glow so the change eases instead of snapping;
   the fast per-frame bar motion is handled in JS. */
.core-amb{transition:filter .6s ease}
.core-svg{transition:filter .6s ease}
#core.vs-checking .core-amb{filter:brightness(1.18) saturate(1.05)}
#core.vs-speaking .core-amb{filter:brightness(1.4) saturate(1.15)}
#core.vs-warning  .core-amb{filter:brightness(1.2) saturate(1.1)}
#core.vs-error    .core-amb{filter:brightness(1.28) saturate(1.15)}
#core.vs-checking .core-svg{filter:drop-shadow(0 0 5px rgba(34,233,255,.2))}
#core.vs-speaking .core-svg{filter:drop-shadow(0 0 7px rgba(39,255,212,.28))}
#core.vs-speaking .core-hub .cn{font-family:'Orbitron',sans-serif;font-size:24px;font-weight:800;letter-spacing:.18em;color:var(--cyan);
  text-shadow:0 0 18px var(--cyan);margin:10px 0 3px;
  transition:text-shadow .5s ease,color .5s ease}
#core.vs-checking .core-hub .cn{font-family:'Orbitron',sans-serif;font-size:24px;font-weight:800;letter-spacing:.18em;color:var(--cyan);
  text-shadow:0 0 18px var(--cyan);margin:10px 0 3px;
  transition:text-shadow .5s ease,color .5s ease}
#core.vs-warning  .core-hub .cn{font-family:'Orbitron',sans-serif;font-size:24px;font-weight:800;letter-spacing:.18em;color:var(--cyan);
  text-shadow:0 0 18px var(--cyan);margin:10px 0 3px;
  transition:text-shadow .5s ease,color .5s ease}
#core.vs-error    .core-hub .cn{font-family:'Orbitron',sans-serif;font-size:24px;font-weight:800;letter-spacing:.18em;color:var(--cyan);
  text-shadow:0 0 18px var(--cyan);margin:10px 0 3px;
  transition:text-shadow .5s ease,color .5s ease}
#core.vs-checking .voice-aperture{color:var(--cyan);opacity:1;filter:drop-shadow(0 0 5px rgba(34,233,255,.5))}
#core.vs-speaking .voice-aperture{color:var(--aqua);opacity:1;filter:drop-shadow(0 0 8px rgba(39,255,212,.7))}
#core.vs-warning  .voice-aperture{color:var(--magenta);opacity:1;filter:drop-shadow(0 0 6px rgba(227,75,255,.55))}
#core.vs-error    .voice-aperture{color:var(--pink);opacity:1;filter:drop-shadow(0 0 7px rgba(255,94,160,.65))}


/* ORION_ENV_BURN_IN_PATCH - subtle value-only drift for mostly-static telemetry.
   Moves only the Environment displayed numbers by about 1px over a slow cycle.
   CSS-only. No data wiring changes. ASCII-only comment to avoid encoding issues. */
#modules .mod.mod-env .env .env-v {
  display:inline-block;
  animation:envValueDrift 210s ease-in-out infinite;
  will-change:transform,opacity;
}

#modules .mod.mod-env .env .env-cell:nth-child(2) .env-v { animation-delay:-35s; }
#modules .mod.mod-env .env .env-cell:nth-child(3) .env-v { animation-delay:-70s; }
#modules .mod.mod-env .env .env-cell:nth-child(4) .env-v { animation-delay:-105s; }
#modules .mod.mod-env .env .env-cell:nth-child(5) .env-v { animation-delay:-140s; }
#modules .mod.mod-env .env .env-cell:nth-child(6) .env-v { animation-delay:-175s; }

@keyframes envValueDrift {
  0%,100% { transform:translate3d(0,0,0); opacity:.96; }
  20%     { transform:translate3d(1.1px,-.7px,0); opacity:.99; }
  40%     { transform:translate3d(-.8px,.9px,0); opacity:.94; }
  60%     { transform:translate3d(.7px,1px,0); opacity:.98; }
  80%     { transform:translate3d(-1px,-.6px,0); opacity:.95; }
}

/* ORION_BRAIN_SCROLL_FIX - expanded insight cards should not be squeezed.
   The list scrolls; cards keep their natural height. */
#brainPanel {
  min-height:0;
}

#brainPanel .bp-list {
  flex:1 1 auto;
  min-height:0;
  overflow-y:scroll;
  overflow-x:hidden;
  touch-action:pan-y;
  overscroll-behavior:contain;
  padding-bottom:34px;
}

#brainPanel .bi-card {
  flex:0 0 auto;
  height:auto;
  scroll-margin:10px 0 18px;
}

#brainPanel .bi-body {
  overflow:visible;
}
