:root {
  color-scheme: dark;
  --bg: #050810;
  --bg-soft: #0a1020;
  --panel: rgba(12, 18, 34, .78);
  --panel-strong: rgba(17, 25, 45, .94);
  --panel-soft: rgba(19, 31, 54, .58);
  --line: rgba(126, 150, 207, .2);
  --line-bright: rgba(133, 196, 255, .48);
  --text: #eff5ff;
  --muted: #8998b5;
  --cyan: #7be5ff;
  --violet: #b59aff;
  --success: #8ff5bd;
  --warning: #ffd27a;
  --danger: #ff879e;
  --radius: 18px;
  --shadow: 0 24px 70px rgba(0, 0, 0, .34);
}
* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; color: var(--text); font: 14px/1.55 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: radial-gradient(circle at 50% -10%, rgba(95, 117, 255, .22), transparent 32rem), radial-gradient(circle at 5% 55%, rgba(21, 174, 207, .1), transparent 28rem), radial-gradient(circle at 94% 80%, rgba(139, 78, 243, .1), transparent 25rem), linear-gradient(145deg, #070b16 0%, #03050b 55%, #090b18 100%); }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; opacity: .25; background-image: linear-gradient(rgba(141, 169, 231, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(141, 169, 231, .055) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom, black, transparent 78%); }
body::after { content: ""; position: fixed; inset: 0; pointer-events: none; background: linear-gradient(115deg, transparent 0 45%, rgba(123, 229, 255, .025) 50%, transparent 55%); mix-blend-mode: screen; }
button, input, select, textarea { font: inherit; border-radius: 12px; min-height: 44px; color: var(--text); background: rgba(4, 8, 18, .72); border: 1px solid var(--line); padding: 11px 13px; }
input::placeholder, textarea::placeholder { color: #64718b; }
input:focus, select:focus, textarea:focus, button:focus-visible { outline: 2px solid rgba(123, 229, 255, .65); outline-offset: 2px; }
button { color: var(--cyan); cursor: pointer; letter-spacing: .09em; text-transform: uppercase; background: linear-gradient(135deg, rgba(79, 143, 255, .15), rgba(125, 82, 255, .12)); transition: background .2s, border-color .2s, transform .2s, box-shadow .2s; }
button:hover { background: linear-gradient(135deg, rgba(79, 180, 255, .28), rgba(157, 103, 255, .22)); border-color: var(--line-bright); box-shadow: 0 8px 28px rgba(57, 146, 255, .14); transform: translateY(-1px); }
button:disabled { cursor: not-allowed; opacity: .45; transform: none; }
textarea { min-height: 94px; }
form { display: grid; gap: 10px; }
small { color: var(--muted); }
.shell { width: min(1480px, 100%); margin: auto; padding: clamp(18px, 3.6vw, 52px); position: relative; }
header { position: relative; display: flex; align-items: flex-end; gap: 18px; min-height: 112px; padding: 4px 0 24px; border-bottom: 1px solid var(--line); }
.eyebrow { color: var(--cyan); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; }
header .eyebrow { position: absolute; top: 0; left: 0; opacity: .72; }
h1 { margin: 26px 0 0; font-size: clamp(42px, 7vw, 82px); font-weight: 200; letter-spacing: .14em; line-height: .95; text-shadow: 0 0 42px rgba(123, 229, 255, .22); }
h2 { margin: 0 0 10px; color: var(--cyan); font-size: 13px; font-weight: 650; letter-spacing: .17em; text-transform: uppercase; }
h3 { color: var(--cyan); font-size: 12px; letter-spacing: .15em; }
header > span { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 3px; color: var(--success); font-size: 10px; letter-spacing: .18em; }
header > span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 15px currentColor; }
.ambient { position: absolute; right: 96px; bottom: 27px; color: var(--muted); font-size: 11px; letter-spacing: .1em; }
#logout { position: absolute; right: 0; bottom: 18px; min-height: 34px; padding: 7px 11px; color: var(--muted); font-size: 10px; }
.dashboard-commandbar { position: sticky; top: 14px; z-index: 10; display: flex; align-items: center; gap: 14px; margin: 22px 0 18px; padding: 8px; background: rgba(8, 12, 24, .78); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 18px 45px rgba(0, 0, 0, .22); backdrop-filter: blur(18px); }
.dashboard-commandbar::before { content: "COMMAND DECK"; padding: 0 8px; color: var(--violet); font-size: 9px; letter-spacing: .18em; white-space: nowrap; }
.command-tabs { display: flex; flex: 1; gap: 4px; min-width: 0; overflow-x: auto; }
.command-tab { min-height: 36px; padding: 8px 12px; color: var(--muted); background: transparent; border: 1px solid transparent; font-size: 10px; white-space: nowrap; }
.command-tab:hover, .command-tab.is-active { color: var(--text); background: linear-gradient(135deg, rgba(86, 161, 255, .2), rgba(172, 108, 255, .18)); border-color: rgba(123, 229, 255, .28); box-shadow: none; transform: none; }
.command-pulse { display: inline-flex; align-items: center; gap: 7px; padding: 0 11px; color: var(--success); font-size: 10px; letter-spacing: .08em; white-space: nowrap; }
.command-pulse::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; animation: beacon 2.2s ease-in-out infinite; }
.mission-strip { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px; margin: 0 0 18px; padding: clamp(18px, 3vw, 28px); background: linear-gradient(135deg, rgba(20, 39, 70, .82), rgba(18, 14, 42, .75)); border: 1px solid rgba(129, 159, 235, .25); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.mission-strip::after { content: ""; width: 180px; height: 180px; position: absolute; right: 18%; border-radius: 50%; background: radial-gradient(circle, rgba(123, 229, 255, .14), transparent 68%); filter: blur(4px); pointer-events: none; }
.mission-kicker { margin: 0 0 5px; color: var(--violet); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; }
.mission-strip h2 { margin: 0; color: var(--text); font-size: clamp(18px, 2.5vw, 28px); letter-spacing: -.01em; text-transform: none; }
.mission-strip p { margin: 6px 0 0; color: var(--muted); }
.mission-metrics { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(74px, 1fr)); gap: 8px; }
.mission-metric { min-width: 82px; padding: 11px; background: rgba(3, 8, 18, .38); border: 1px solid rgba(139, 172, 235, .18); border-radius: 12px; }
.mission-metric span, .mission-metric strong { display: block; }
.mission-metric span { color: var(--muted); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.mission-metric strong { margin-top: 5px; color: var(--cyan); font-size: 17px; font-weight: 500; }
.panel, .grid article { background: linear-gradient(145deg, var(--panel), rgba(7, 10, 20, .84)); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 16px 50px rgba(0, 0, 0, .18); }
.panel { padding: clamp(16px, 2.4vw, 26px); }
.browser-panel, .assistant-modules { margin-top: 14px; }
.panel[data-ui-view] { animation: panel-in .4s ease both; }
.panel[data-ui-view][hidden], .two-col[data-ui-view][hidden], .grid[data-ui-view][hidden], .core[data-ui-view][hidden] { display: none !important; }
.panel[data-ui-hidden="true"], .two-col[data-ui-hidden="true"], .grid[data-ui-hidden="true"], .core[data-ui-hidden="true"] { display: none !important; }
.browser-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.browser-heading p { margin: 0; color: var(--muted); max-width: 75ch; }
.browser-heading button { min-height: 36px; padding: 7px 11px; font-size: 10px; }
.browser-form { grid-template-columns: minmax(0, 1fr) 190px auto; margin-top: 14px; }
.browser-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 22px; }
.browser-list { display: grid; gap: 8px; margin-top: 10px; }
.setup-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.setup-links a { display: inline-flex; align-items: center; min-height: 34px; padding: 7px 10px; color: var(--cyan); background: rgba(8, 23, 42, .72); border: 1px solid var(--line); border-radius: 9px; font-size: 9px; letter-spacing: .11em; text-decoration: none; }
.setup-links a:hover, .setup-links a:focus-visible { border-color: var(--cyan); box-shadow: 0 0 18px rgba(60, 211, 255, .14); }
.browser-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 13px; color: #d7e7ff; background: rgba(4, 10, 21, .58); border: 1px solid rgba(126, 150, 207, .14); border-radius: 11px; }
.browser-row span { font-size: 12px; overflow-wrap: anywhere; }
.browser-row button { min-height: 32px; padding: 6px 10px; font-size: 10px; }
.notice { min-height: 24px; margin-top: 12px; color: var(--success); }
.login { width: min(470px, 100%); margin: 78px auto; padding: 30px; }
.login::before { content: "LOCAL SECURITY GATE"; display: block; margin-bottom: 20px; color: var(--violet); font-size: 10px; letter-spacing: .2em; }
.login p, .core p, .grid span { color: var(--muted); }
.login details { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); }
.login summary { color: var(--cyan); cursor: pointer; letter-spacing: .12em; font-size: 10px; }
.initialization { max-width: 680px; margin: 70px auto; text-align: center; }
.initialization h2 { font-size: 28px; margin: 12px 0; }
.initialization p { color: var(--muted); }
.initialization-lines { display: grid; gap: 8px; margin: 28px 0; padding: 16px; text-align: left; background: rgba(3, 8, 18, .64); border: 1px solid var(--line); border-radius: 14px; }
.initialization-lines span { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 12px; letter-spacing: .08em; }
.initialization-lines b { color: var(--success); font-weight: 500; }
.core { position: relative; display: grid; align-content: center; justify-items: center; min-height: min(650px, 72vh); padding: clamp(46px, 8vw, 92px) 0 clamp(30px, 5vw, 58px); text-align: center; overflow: hidden; border: 1px solid rgba(126, 150, 207, .18); border-radius: var(--radius); background: radial-gradient(circle at 50% 48%, rgba(43, 45, 103, .28), transparent 40%), linear-gradient(145deg, rgba(12, 20, 42, .72), rgba(5, 8, 18, .72)); }
.core::before { content: "CORE / REALTIME"; position: absolute; top: 20px; left: 24px; color: rgba(123, 229, 255, .55); font-size: 10px; letter-spacing: .2em; }
.core::after { content: "J.A.R.V.I.S. // CORTEX ONLINE"; position: absolute; right: 24px; bottom: 15px; color: rgba(181, 154, 255, .55); font-size: 9px; letter-spacing: .18em; }
.orb { position: relative; display: grid; place-items: center; isolation: isolate; width: min(66vw, 540px); aspect-ratio: 1; margin: auto; border-radius: 50%; background: radial-gradient(circle at 50% 50%, rgba(9, 30, 54, .98) 0 18%, rgba(46, 20, 78, .78) 37%, rgba(7, 38, 58, .35) 60%, transparent 73%), conic-gradient(from 0deg, rgba(112, 251, 255, .05), rgba(192, 77, 255, .38) 13%, rgba(52, 226, 255, .08) 29%, rgba(241, 73, 188, .35) 47%, rgba(31, 217, 255, .08) 67%, rgba(182, 82, 255, .34) 84%, rgba(112, 251, 255, .05)); border: 1px solid rgba(150, 228, 255, .62); box-shadow: 0 0 35px rgba(104, 224, 255, .64), 0 0 110px rgba(183, 62, 255, .34), inset 0 0 90px rgba(74, 205, 255, .3); animation: cortex-drift 26s linear infinite; }
.orb::before, .orb::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.orb::before { inset: -2%; border: 1px solid rgba(149, 250, 255, .7); transform: rotate(21deg) scaleY(.33); box-shadow: 0 0 30px rgba(93, 239, 255, .65), 0 0 90px rgba(166, 67, 255, .38); animation: cortex-ring 8s ease-in-out infinite alternate; }
.orb::after { inset: 7%; border: 1px dashed rgba(245, 157, 255, .7); transform: rotate(-34deg) scaleY(.63); box-shadow: 0 0 35px rgba(219, 82, 255, .55); animation: cortex-ring 11s linear infinite reverse; }
.orb-inner { position: relative; z-index: 4; display: grid; place-items: center; width: 34%; aspect-ratio: 1; border: 1px solid rgba(238, 178, 255, .94); border-radius: 50%; color: var(--cyan); background: radial-gradient(circle at 50% 42%, rgba(37, 53, 86, .9), rgba(20, 7, 42, .97) 68%); box-shadow: 0 0 34px rgba(229, 95, 255, .65), inset 0 0 34px rgba(106, 207, 255, .3); text-shadow: 0 0 10px rgba(123, 229, 255, .75); font-size: 12px; letter-spacing: .18em; appearance: none; cursor: pointer; }
.state-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 22px; }
.state-buttons button { font-size: 10px; }
#voice-status { display: block; min-height: 21px; margin-top: 12px; color: var(--cyan); letter-spacing: .08em; }
.voice-session-feedback { width: min(100%, 620px); margin: 14px auto 0; padding: 12px 14px; border: 1px solid rgba(117, 229, 255, .2); border-radius: 12px; background: rgba(7, 13, 30, .62); text-align: left; box-shadow: inset 0 0 22px rgba(64, 124, 255, .08); }
.voice-session-line { display: flex; justify-content: space-between; gap: 12px; color: var(--cyan); font-size: 10px; letter-spacing: .13em; }
.voice-session-line span:last-child { color: rgba(226, 239, 255, .62); }
.voice-session-feedback p { overflow: hidden; margin: 8px 0 0; color: rgba(226, 239, 255, .84); font-size: 12px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.voice-session-feedback p:last-child { color: #fff1d0; }
body[data-voice-state="listening"] .voice-session-feedback { border-color: rgba(117, 255, 226, .52); box-shadow: 0 0 22px rgba(50, 218, 205, .12); }
body[data-voice-state="speaking"] .voice-session-feedback { border-color: rgba(255, 185, 102, .5); }
.cortex-canvas { position: absolute; inset: 0; z-index: 2; display: block; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen; opacity: .94; filter: drop-shadow(0 0 11px rgba(177, 112, 255, .75)); }
.grid, .two-col { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.two-col { grid-template-columns: 1fr 1fr; margin-top: 14px; }
.grid article { min-height: 128px; padding: 20px; }
.grid strong { display: block; margin: 12px 0 6px; color: var(--cyan); font-size: 17px; font-weight: 500; }
.grid small, .grid span { display: block; font-size: 10px; letter-spacing: .12em; }
.onboarding-step { display: grid; grid-template-columns: 28px minmax(0, 1fr) 20px; align-items: center; gap: 10px; width: 100%; min-height: 58px; padding: 10px 12px; text-align: left; text-transform: none; letter-spacing: 0; background: rgba(4, 10, 21, .58); }
.onboarding-step:hover { transform: none; }
.onboarding-step-status { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font-weight: 700; }
.onboarding-step-copy { display: grid; gap: 2px; min-width: 0; }
.onboarding-step-copy strong { font-size: 11px; letter-spacing: .12em; }
.onboarding-step-copy small { overflow-wrap: anywhere; }
.onboarding-step-arrow { color: var(--cyan); font-size: 22px; text-align: center; }
.onboarding-complete { border-color: rgba(143, 245, 189, .5); }
.onboarding-complete .onboarding-step-status { color: #04150d; background: var(--success); box-shadow: 0 0 14px rgba(143, 245, 189, .35); }
.onboarding-open { border-color: rgba(255, 135, 158, .45); }
.onboarding-open .onboarding-step-status { color: #21080b; background: var(--danger); box-shadow: 0 0 14px rgba(255, 135, 158, .28); }
.onboarding-step:disabled { cursor: default; opacity: .8; }
.dynamic-card { min-height: 125px; margin-top: 16px; padding: 17px; background: linear-gradient(135deg, rgba(29, 58, 100, .8), rgba(13, 11, 30, .92)); border: 1px solid var(--line-bright); border-radius: 14px; box-shadow: 0 0 28px rgba(34, 205, 215, .18); }
.dynamic-card-head { display: flex; justify-content: space-between; color: var(--cyan); font-size: 10px; letter-spacing: .14em; }
.dynamic-card-body { margin-top: 14px; color: #d7e7ff; }
.weather-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 13px; }
.weather-metrics span { padding: 10px; color: var(--cyan); background: rgba(2, 15, 21, .62); border: 1px solid rgba(73, 202, 215, .24); font-size: 12px; }
.dynamic-skeleton, .result-skeleton { display: grid; gap: 9px; padding-top: 8px; }
.dynamic-skeleton span, .result-skeleton span { display: block; height: 11px; background: linear-gradient(90deg, #25375b, #675c9d, #25375b); background-size: 200% 100%; animation: skeleton-shimmer 1.4s linear infinite; }
.dynamic-skeleton span:nth-child(2) { width: 72%; } .dynamic-skeleton span:nth-child(3) { width: 48%; }
.settings-overlay { position: fixed; inset: 0; z-index: 30; overflow: auto; background: rgba(2, 4, 10, .94); backdrop-filter: blur(18px); }
#settings-overlay[hidden], #settings-auth[hidden], #hud-result-window[hidden] { display: none !important; }
.settings-shell { display: grid; grid-template-columns: 250px minmax(0, 1fr); width: min(1400px, 100%); min-height: 100%; margin: auto; }
.settings-sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; padding: clamp(20px, 4vw, 44px) 18px; background: rgba(8, 12, 24, .96); border-right: 1px solid var(--line); }
.settings-search { display: grid; gap: 5px; margin: 4px 0 6px; color: var(--muted); font-size: 9px; letter-spacing: .14em; }
.settings-search input { min-height: 38px; padding: 8px 10px; font-size: 12px; letter-spacing: 0; }
.settings-sidebar h2 { margin-top: 18px; }
.settings-hint { color: var(--muted); font-size: 12px; }
.settings-nav-group { margin-top: 16px; padding: 11px 10px; color: rgba(123, 229, 255, .58); border-bottom: 1px solid rgba(126, 150, 207, .14); font-size: 9px; letter-spacing: .18em; cursor: pointer; user-select: none; }
.settings-nav-group::after { content: "⌄"; float: right; color: var(--cyan); font-size: 14px; }
.settings-nav-group[aria-expanded="false"]::after { content: "›"; }
.settings-nav-group.is-collapsed + #settings-nav-group-items { display: none; }
#settings-nav button { display: block; width: 100%; min-height: 34px; padding: 8px 10px; border: 0; color: var(--muted); text-align: left; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
#settings-nav button:hover { color: var(--cyan); background: rgba(86, 161, 255, .12); box-shadow: none; transform: none; }
.settings-close { margin-top: auto; color: var(--danger); border-color: rgba(255, 135, 158, .35); }
.settings-main { min-width: 0; padding: clamp(18px, 4vw, 45px); }
.settings-topbar { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 24px; }
.settings-topbar h1 { margin-top: 8px; font-size: clamp(30px, 5vw, 58px); }
.settings-topbar > button { min-width: 44px; padding: 4px; font-size: 26px; line-height: 1; }
.settings-main .panel, .settings-main .grid, .settings-main .two-col { margin-top: 14px; }
.settings-auth { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; padding: 18px; background: rgba(0, 5, 8, .78); backdrop-filter: blur(12px); }
.settings-auth-card { position: relative; width: min(430px, 100%); padding: 28px; background: linear-gradient(145deg, #172546, #080b19); border: 1px solid var(--line-bright); border-radius: var(--radius); box-shadow: 0 0 70px rgba(42, 212, 224, .22); }
.settings-auth-card p { color: var(--muted); }
.settings-auth-cancel { position: absolute; top: 12px; right: 12px; min-height: 34px; border: 0; padding: 2px 9px; font-size: 24px; }
.hud-result-window { position: fixed; right: calc(clamp(12px, 4vw, 54px) + var(--window-offset, 0px)); bottom: calc(clamp(16px, 4vw, 44px) + var(--window-offset, 0px)); z-index: 20; width: min(520px, calc(100vw - 24px)); min-width: 280px; min-height: 180px; max-width: calc(100vw - 24px); max-height: calc(100vh - 32px); padding: 0; overflow: hidden; resize: both; background: linear-gradient(145deg, rgba(10, 34, 57, .97), rgba(4, 8, 18, .98)); border: 1px solid rgba(93, 226, 255, .62); border-radius: 12px; box-shadow: 0 0 0 1px rgba(61, 204, 255, .08), 0 0 45px rgba(37, 218, 229, .22), 0 18px 55px rgba(0, 0, 0, .48); backdrop-filter: blur(20px); animation: hud-window-in .42s cubic-bezier(.2, .8, .2, 1); transition: border-color .2s ease, box-shadow .2s ease, opacity .18s ease, transform .18s ease; }
.hud-result-window::before { content: "CORTEX DATA LINK"; position: absolute; inset: 0 auto auto 0; width: 82px; height: 2px; color: transparent; background: linear-gradient(90deg, var(--cyan), transparent); box-shadow: 0 0 12px var(--cyan); pointer-events: none; }
.hud-result-window.is-active { border-color: var(--cyan); box-shadow: 0 0 0 1px rgba(61, 204, 255, .15), 0 0 54px rgba(37, 218, 229, .3), 0 22px 65px rgba(0, 0, 0, .58); }
.hud-result-window.is-expanded { inset: 5vh 5vw !important; width: auto; height: auto; max-width: none; max-height: none; resize: none; }
.hud-result-window.is-minimized { width: min(360px, calc(100vw - 24px)); min-height: 0; height: auto !important; resize: none; }
.hud-result-window.is-minimized .hud-result-body, .hud-result-window.is-minimized .hud-result-voicehint { display: none; }
.hud-result-window.is-closing { opacity: 0; transform: scale(.9) translateY(18px); pointer-events: none; }
.hud-result-window.is-dragging { user-select: none; box-shadow: 0 0 65px rgba(37, 218, 229, .38), 0 28px 75px rgba(0, 0, 0, .66); }
.hud-result-head { display: flex; justify-content: space-between; align-items: center; min-height: 54px; padding: 11px 12px 10px 16px; color: var(--cyan); border-bottom: 1px solid rgba(93, 226, 255, .18); background: linear-gradient(90deg, rgba(33, 133, 171, .14), transparent); font-size: 10px; letter-spacing: .16em; cursor: grab; }
.hud-result-head > div:first-child { display: grid; gap: 5px; }
.hud-result-head small { color: rgba(151, 250, 255, .48); font-size: 8px; letter-spacing: .22em; }
.hud-result-head button { min-height: 30px; padding: 1px 9px; border: 0; font-size: 22px; }
.hud-result-actions { display: flex; gap: 4px; }
.hud-result-actions button { min-width: 32px; }
.hud-result-body { min-height: 104px; max-height: calc(100vh - 170px); padding: 18px; overflow: auto; }
.hud-result-voicehint { padding: 8px 16px; color: rgba(143, 215, 237, .44); border-top: 1px solid rgba(93, 226, 255, .12); font: 8px ui-monospace, SFMono-Regular, monospace; letter-spacing: .11em; }
.mail-result { display: grid; gap: 12px; margin-top: 20px; }
.mail-result-meta { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 11px; }
.mail-result h3 { margin: 0; color: var(--text); font-size: 20px; font-weight: 400; }
.mail-result p { margin: 0; color: #d7e7ff; font-size: 13px; line-height: 1.55; white-space: normal; }
.mail-result-list { display: grid; gap: 8px; margin-top: 20px; }
.mail-result-row { display: grid; gap: 4px; padding: 11px; background: rgba(2, 14, 20, .7); border: 1px solid rgba(73, 202, 215, .22); }
.mail-result-row strong { color: var(--text); font-size: 13px; font-weight: 500; }
.mail-result-row span { color: var(--muted); font-size: 11px; }
.mail-draft-result { display: grid; gap: 14px; }
.result-statusline { display: flex; justify-content: space-between; gap: 12px; color: rgba(151, 250, 255, .62); font: 9px ui-monospace, SFMono-Regular, monospace; letter-spacing: .13em; }
.result-statusline b { color: #ffd58a; font-weight: 500; }
.mail-draft-result dl { display: grid; gap: 8px; margin: 0; }
.mail-draft-result dl div { display: grid; grid-template-columns: 70px 1fr; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid rgba(73, 202, 215, .15); }
.mail-draft-result dt { color: var(--muted); font-size: 9px; letter-spacing: .14em; }
.mail-draft-result dd { margin: 0; color: var(--text); font-size: 12px; }
.mail-draft-body { min-height: 90px; padding: 14px; color: #d7e7ff; background: rgba(2, 14, 20, .72); border-left: 2px solid var(--cyan); font-size: 13px; line-height: 1.58; }
.mail-draft-result footer { color: #ffc978; font-size: 9px; letter-spacing: .08em; }
.result-list { display: grid; gap: 8px; }
.result-list article { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; padding: 11px; background: rgba(2, 14, 20, .7); border: 1px solid rgba(73, 202, 215, .2); }
.result-list article span { grid-row: 1 / 3; align-self: start; color: var(--cyan); font: 8px ui-monospace, SFMono-Regular, monospace; letter-spacing: .1em; }
.result-list article strong { color: var(--text); font-size: 12px; font-weight: 500; }
.result-list article small { color: var(--muted); font-size: 10px; }
.result-empty { display: grid; place-items: center; min-height: 120px; text-align: center; }
.result-empty strong { color: var(--cyan); font-size: 12px; letter-spacing: .14em; }
.result-empty p { color: var(--muted); font-size: 11px; }
.result-hero { display: flex; justify-content: space-between; gap: 12px; margin: 22px 0 14px; color: var(--muted); }
.result-hero strong { color: var(--text); font-size: 25px; font-weight: 300; }
.result-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.result-grid span { display: grid; gap: 2px; padding: 11px; color: var(--muted); background: rgba(2, 14, 20, .7); border: 1px solid rgba(73, 202, 215, .22); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.result-grid b { color: var(--cyan); font-size: 18px; font-weight: 400; letter-spacing: 0; }
.result-forecast { margin: 0 0 13px; color: var(--muted); font-size: 12px; letter-spacing: .08em; }
.result-forecast strong { color: #d7f7f8; font-size: 14px; }
.jarvis-image-result { margin: 0; display: grid; gap: 9px; }
.jarvis-image-result img { display: block; width: 100%; max-height: 52vh; object-fit: contain; border: 1px solid rgba(116, 245, 255, .45); box-shadow: 0 0 28px rgba(47, 222, 233, .25); background: #020d13; }
.jarvis-image-result figcaption { color: var(--muted); font-size: 11px; line-height: 1.45; }
body[data-voice-state="listening"] .orb { filter: saturate(1.4); box-shadow: 0 0 48px rgba(123, 229, 255, .72), 0 0 135px rgba(34, 205, 215, .4); }
body[data-voice-state="thinking"] .orb { filter: hue-rotate(34deg) saturate(1.25); animation: cortex-think 2.8s linear infinite; }
body[data-voice-state="speaking"] .orb { filter: brightness(1.25); animation: cortex-speak .7s ease-in-out infinite alternate; }
body[data-voice-state="error"] .orb { filter: hue-rotate(125deg) saturate(1.8); }
body.haptic-pulse .orb { filter: brightness(1.24) drop-shadow(0 0 18px rgba(123, 229, 255, .7)); }
body.haptic-pulse .orb-inner { transform: scale(1.035); }

.orb-hud { position: absolute; inset: 0; z-index: 3; pointer-events: none; color: rgba(255, 183, 103, .82); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: clamp(7px, .78vw, 10px); letter-spacing: .12em; text-shadow: 0 0 8px rgba(255, 88, 32, .8); }
.orb-hud-title, .orb-hud-link, .orb-hud-left, .orb-hud-right { position: absolute; display: block; white-space: nowrap; }
.orb-hud-title { top: 11%; left: 50%; transform: translateX(-50%); color: rgba(255, 218, 159, .86); font-size: .9em; letter-spacing: .18em; }
.orb-hud-link { bottom: 11%; left: 50%; transform: translateX(-50%); color: rgba(255, 140, 75, .78); font-size: .82em; }
.orb-hud-left { top: 45%; left: 9%; line-height: 1.8; color: rgba(255, 144, 83, .72); }
.orb-hud-right { top: 45%; right: 9%; text-align: right; line-height: 1.8; color: rgba(255, 144, 83, .72); }
.orb-hud-ticks, .orb-hud-ticks::before, .orb-hud-ticks::after { position: absolute; display: block; border-radius: 50%; pointer-events: none; }
.orb-hud-ticks { inset: 5%; border: 1px solid rgba(255, 174, 96, .5); opacity: .9; animation: tactical-spin 18s linear infinite; }
.orb-hud-ticks::before { content: ""; inset: 7%; background: repeating-conic-gradient(from 0deg, rgba(255, 211, 143, .86) 0deg 1deg, transparent 1deg 8deg); -webkit-mask: radial-gradient(circle, transparent 0 77%, #000 78% 82%, transparent 83%); mask: radial-gradient(circle, transparent 0 77%, #000 78% 82%, transparent 83%); }
.orb-hud-ticks::after { content: ""; inset: 17%; border: 1px dashed rgba(255, 111, 55, .66); transform: rotate(-23deg) scaleY(.66); animation: tactical-counter-spin 11s linear infinite; }
body[data-voice-state="thinking"] .orb-hud-ticks { animation-duration: 6s; }
body[data-voice-state="speaking"] .orb-hud-ticks { animation-duration: 3s; }
@keyframes tactical-spin { to { transform: rotate(360deg); } }
@keyframes tactical-counter-spin { to { transform: rotate(-383deg) scaleY(.66); } }
@keyframes cortex-drift { to { transform: rotate(360deg); } }
@keyframes cortex-ring { to { transform: rotate(325deg) scaleY(.78); } }
@keyframes cortex-think { to { transform: rotate(360deg) scale(1.03); } }
@keyframes cortex-speak { to { transform: scale(1.055); } }
@keyframes skeleton-shimmer { to { background-position: -200% 0; } }
@keyframes hud-window-in { from { opacity: 0; transform: translate3d(30px, 18px, 0) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes panel-in { from { opacity: .2; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes beacon { 0%, 100% { opacity: .5; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.15); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } }
@media (max-width: 850px) { .dashboard-commandbar::before { display: none; } .command-pulse { display: none; } .mission-strip { grid-template-columns: 1fr; } .mission-metrics { max-width: 360px; } }
@media (max-width: 700px) { .shell { padding: 18px 13px 40px; } header { display: block; min-height: 132px; } h1 { font-size: 45px; letter-spacing: .1em; } header > span { margin-top: 13px; } .ambient { position: static; margin-top: 8px; } #logout { right: 0; bottom: 18px; } .dashboard-commandbar { top: 8px; margin-top: 14px; } .command-tabs { gap: 2px; } .command-tab { padding: 8px 9px; } .core { min-height: 540px; } .core::before { top: 14px; left: 15px; } .core::after { right: 15px; font-size: 8px; } .orb { width: min(90vw, 440px); } .grid, .two-col, .browser-columns { grid-template-columns: 1fr; } .browser-form { grid-template-columns: 1fr; } .browser-heading { align-items: stretch; flex-direction: column; } .browser-heading button { width: 100%; } .state-buttons button { flex: 1 1 30%; } .weather-metrics { grid-template-columns: repeat(2, 1fr); } .initialization-lines span { display: grid; gap: 3px; } .settings-shell { grid-template-columns: 1fr; } .settings-sidebar { position: sticky; border-right: 0; border-bottom: 1px solid var(--line); padding: 18px 14px; height: auto; max-height: 46vh; } .settings-sidebar .settings-close { margin-top: 14px; } .settings-main { padding: 18px 13px 40px; } .settings-nav-group { margin-top: 10px; } .hud-result-window { right: 12px; bottom: 12px; } .hud-result-window.is-expanded { inset: 3vh 3vw auto; height: 84vh; } }

/* Simplified settings surface: one calm mobile-first control center, with the
   existing specialist panels kept available behind an explicit advanced gate. */
.settings-simplified .settings-shell { grid-template-columns: 220px minmax(0, 960px); justify-content: center; }
.settings-simplified .settings-sidebar { background: linear-gradient(180deg, rgba(10, 18, 38, .98), rgba(5, 8, 18, .98)); }
.settings-simplified .settings-main { width: 100%; max-width: 960px; padding: clamp(18px, 4vw, 42px); }
.settings-simplified .settings-topbar { margin-bottom: 12px; }
.settings-simplified .settings-topbar h1 { font-size: clamp(34px, 5vw, 54px); }
.settings-quickstart { display: grid; gap: 18px; margin: 0 0 22px; padding: clamp(18px, 3vw, 30px); background: linear-gradient(145deg, rgba(25, 49, 82, .92), rgba(8, 13, 29, .96)); border: 1px solid rgba(129, 232, 255, .36); border-radius: 20px; box-shadow: 0 20px 70px rgba(4, 12, 34, .42); }
.settings-quickstart h2 { margin: 0; font-size: clamp(21px, 3vw, 31px); letter-spacing: .04em; }
.settings-quickstart p { margin: 0; color: var(--muted); line-height: 1.5; }
.settings-provider-card { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; padding: 14px; border: 1px solid rgba(95, 241, 207, .3); border-radius: 14px; background: rgba(3, 20, 28, .62); }
.settings-provider-card strong { color: #8effd1; letter-spacing: .1em; font-size: 12px; }
.settings-provider-card span { display: block; margin-top: 3px; color: var(--muted); font-size: 12px; }
.settings-provider-dot { width: 11px; height: 11px; border-radius: 50%; background: #72f7c2; box-shadow: 0 0 18px #72f7c2; }
.settings-quick-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.settings-quick-field { display: grid; align-content: start; gap: 6px; color: var(--muted); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.settings-quick-field label { display: flex; align-items: center; gap: 6px; }
.settings-quick-field input, .settings-quick-field select { width: 100%; min-height: 44px; }
.browser-form textarea { min-height: 92px; resize: vertical; grid-column: 1 / -1; }
#memory-candidate-items .browser-row span, #memory-source-items .browser-row span { overflow-wrap: anywhere; }
.settings-input-row { display: flex; gap: 7px; }
.settings-input-row > * { flex: 1 1 auto; min-width: 0; }
.settings-info { display: inline-grid; place-items: center; width: 18px; height: 18px; min-height: 18px; padding: 0; border: 1px solid rgba(129, 232, 255, .5); border-radius: 50%; color: var(--cyan); background: rgba(11, 30, 55, .7); font-size: 11px; letter-spacing: 0; text-transform: none; }
.settings-info[aria-expanded="true"] { color: #06111d; background: var(--cyan); }
.settings-info-popover { padding: 9px 10px; border-left: 2px solid var(--cyan); border-radius: 0 8px 8px 0; background: rgba(8, 23, 45, .82); color: #c6d4f2; font-size: 11px; line-height: 1.45; letter-spacing: 0; text-transform: none; }
.settings-quick-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.settings-quick-actions button { min-height: 44px; }
.settings-integration-quick { display: grid; gap: 10px; padding: 14px; border: 1px solid rgba(123, 229, 255, .28); border-radius: 14px; background: rgba(7, 20, 40, .58); }
.settings-integration-quick small { color: var(--muted); line-height: 1.45; }
.settings-advanced-toggle { color: var(--muted); border-color: rgba(145, 164, 207, .35); background: rgba(3, 8, 19, .42); }
.settings-advanced-toggle[aria-expanded="true"] { color: var(--cyan); border-color: rgba(123, 229, 255, .55); }
.settings-simplified .settings-secondary-panel { scroll-margin-top: 18px; }
.settings-simplified .settings-secondary-panel[hidden] { display: none !important; }
.settings-simplified .settings-nav-advanced { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(126, 150, 207, .16); color: rgba(123, 229, 255, .7); font-size: 9px; letter-spacing: .18em; }
@media (max-width: 700px) {
  body.settings-open { overflow: hidden; }
  .settings-simplified .settings-shell { display: block; min-height: 100dvh; }
  .settings-simplified .settings-sidebar { position: sticky; top: 0; z-index: 3; display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; max-height: none; padding: 13px; border-right: 0; border-bottom: 1px solid rgba(126, 150, 207, .2); }
  .settings-simplified .settings-sidebar .eyebrow, .settings-simplified .settings-sidebar h2, .settings-simplified .settings-sidebar .settings-hint { display: none; }
  .settings-simplified .settings-sidebar nav { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .settings-simplified .settings-sidebar nav button { min-height: 40px; padding: 9px 10px; border: 1px solid rgba(126, 150, 207, .18); border-radius: 10px; background: rgba(20, 31, 58, .58); font-size: 9px; }
  .settings-simplified .settings-sidebar .settings-close { margin: 0; min-height: 40px; padding: 7px 12px; }
  .settings-simplified .settings-main { padding: 14px 12px 32px; }
  .settings-simplified .settings-topbar { align-items: center; }
  .settings-simplified .settings-topbar h1 { margin-top: 2px; font-size: 34px; }
  .settings-quickstart { gap: 15px; padding: 17px 14px; border-radius: 16px; }
  .settings-quick-grid { grid-template-columns: 1fr; }
  .settings-quick-actions { position: sticky; bottom: 8px; z-index: 2; padding: 8px; margin: 0 -8px -8px; background: rgba(8, 13, 29, .9); backdrop-filter: blur(10px); border-radius: 12px; }
  .settings-quick-actions button { flex: 1 1 100%; }
}

/* Tactical HUD pass: a warm, cinematic instrument layer inspired by the reference image. */
.core {
  background:
    linear-gradient(rgba(255, 94, 43, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 94, 43, .045) 1px, transparent 1px),
    radial-gradient(circle at 50% 48%, rgba(126, 23, 9, .28), transparent 42%),
    linear-gradient(145deg, rgba(36, 14, 20, .88), rgba(10, 6, 12, .9));
  background-size: 44px 44px, 44px 44px, auto, auto;
}
.core::before { color: rgba(255, 177, 102, .72); }
.core::after { color: rgba(255, 92, 55, .68); }
.orb {
  background:
    radial-gradient(circle at 50% 50%, rgba(52, 10, 9, .98) 0 17%, rgba(104, 17, 9, .82) 33%, rgba(26, 8, 15, .72) 58%, transparent 73%),
    conic-gradient(from 0deg, rgba(255, 88, 42, .04), rgba(255, 169, 77, .5) 11%, rgba(255, 52, 28, .08) 28%, rgba(255, 113, 41, .44) 48%, rgba(255, 226, 142, .12) 67%, rgba(220, 36, 21, .5) 84%, rgba(255, 88, 42, .04));
  border-color: rgba(255, 160, 99, .72);
  box-shadow: 0 0 30px rgba(255, 76, 35, .68), 0 0 110px rgba(173, 28, 12, .4), inset 0 0 90px rgba(255, 118, 46, .28);
}
.orb::before { border-color: rgba(255, 199, 125, .7); box-shadow: 0 0 30px rgba(255, 97, 43, .7), 0 0 90px rgba(255, 36, 18, .35); }
.orb::after { border-color: rgba(255, 150, 97, .72); box-shadow: 0 0 35px rgba(255, 67, 28, .6); }
.orb-inner {
  width: 28%;
  color: #ffd99a;
  background: radial-gradient(circle at 50% 42%, rgba(151, 38, 19, .92), rgba(34, 5, 10, .98) 68%);
  border-color: rgba(255, 209, 142, .98);
  box-shadow: 0 0 34px rgba(255, 100, 42, .72), inset 0 0 34px rgba(255, 196, 95, .3);
  text-shadow: 0 0 10px rgba(255, 179, 80, .85);
}
.cortex-settings-hit { position: absolute; inset: 30%; z-index: 30; display: block; border: 0; border-radius: 50%; padding: 0; background: transparent; cursor: pointer; appearance: none; }
.cortex-canvas { opacity: .34; }
.iron-canvas { position: absolute; inset: 0; z-index: 3; display: block; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen; filter: drop-shadow(0 0 8px rgba(255, 79, 32, .75)); }
body[data-voice-state="listening"] .orb { filter: saturate(1.45) brightness(1.08); box-shadow: 0 0 48px rgba(255, 183, 92, .78), 0 0 135px rgba(255, 86, 30, .48); }
body[data-voice-state="thinking"] .orb { filter: saturate(1.6); animation: cortex-think 2.8s linear infinite; }
body[data-voice-state="speaking"] .orb { filter: brightness(1.28); animation: cortex-speak .7s ease-in-out infinite alternate; }
body[data-voice-state="error"] .orb { filter: saturate(1.8) hue-rotate(-18deg); }
body.haptic-pulse .orb { filter: brightness(1.28) saturate(1.5) drop-shadow(0 0 18px rgba(255, 119, 50, .82)); }

/* Eye-core layer: a visible scanner/iris system behind the still-clickable status button. */
.orb-eye, .orb-eye-iris, .orb-eye-pupil, .orb-eye-glint, .orb-eye-sweep, .orb-eye-arc, .orb-eye-scan-beam, .orb-eye-scanline, .orb-eye-pulse, .orb-fog, .orb-fog i { position: absolute; display: block; pointer-events: none; }
.orb-eye { inset: 17% 10%; z-index: 2; overflow: hidden; border: 1px solid rgba(255, 191, 115, .72); border-radius: 50%; transform: rotate(-8deg) scaleY(.62); background: radial-gradient(ellipse at 50% 50%, rgba(255, 128, 40, .42), rgba(93, 12, 7, .74) 28%, rgba(24, 4, 9, .94) 66%, rgba(7, 2, 7, .98)); box-shadow: 0 0 25px rgba(255, 83, 28, .82), inset 0 0 42px rgba(255, 154, 68, .48); animation: eye-breathe 3.2s ease-in-out infinite; will-change: transform, filter; }
.orb-eye::before, .orb-eye::after { content: ""; position: absolute; inset: 8%; border-radius: 50%; pointer-events: none; }
.orb-eye::before { border: 1px solid rgba(255, 221, 159, .52); box-shadow: 0 0 15px rgba(255, 122, 43, .55); }
.orb-eye::after { inset: 0; background: repeating-linear-gradient(0deg, transparent 0 13px, rgba(255, 176, 98, .07) 14px, transparent 15px); mix-blend-mode: screen; }
.orb-eye-iris { inset: 15% 22%; overflow: hidden; border: 2px solid rgba(255, 211, 142, .92); border-radius: 50%; background: conic-gradient(from 8deg, rgba(255, 237, 181, .95) 0deg 12deg, rgba(255, 74, 27, .12) 12deg 35deg, rgba(120, 9, 8, .74) 35deg 68deg, rgba(255, 156, 61, .88) 68deg 79deg, rgba(255, 52, 22, .12) 79deg 143deg, rgba(255, 222, 154, .72) 143deg 154deg, rgba(87, 5, 9, .68) 154deg 230deg, rgba(255, 102, 34, .74) 230deg 246deg, rgba(255, 49, 22, .12) 246deg 360deg), repeating-conic-gradient(rgba(255, 205, 124, .55) 0deg 2deg, transparent 2deg 9deg); box-shadow: 0 0 30px rgba(255, 99, 33, .96), inset 0 0 26px rgba(255, 211, 122, .64); animation: eye-iris-spin 3.6s linear infinite; will-change: transform; }
.orb-eye-iris::before, .orb-eye-iris::after { content: ""; position: absolute; inset: 10%; border-radius: 50%; pointer-events: none; }
.orb-eye-iris::before { background: repeating-conic-gradient(rgba(255, 226, 162, .7) 0deg 1deg, transparent 1deg 12deg); -webkit-mask: radial-gradient(circle, transparent 0 61%, #000 62% 69%, transparent 70%); mask: radial-gradient(circle, transparent 0 61%, #000 62% 69%, transparent 70%); }
.orb-eye-iris::after { inset: 23%; border: 1px dashed rgba(255, 119, 52, .88); box-shadow: 0 0 13px rgba(255, 69, 24, .8); }
.orb-eye-pupil { inset: 32% 39%; z-index: 2; border: 1px solid rgba(255, 239, 196, .98); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff9dc 0 5%, #ffb04f 6% 18%, #27050a 36%, #050107 72%); box-shadow: 0 0 19px rgba(255, 218, 150, 1), 0 0 46px rgba(255, 76, 28, .92); animation: eye-pupil-scan 2.5s ease-in-out infinite; will-change: transform; }
.orb-eye-glint { inset: 34% 42%; z-index: 3; border-radius: 50%; background: radial-gradient(circle at 34% 31%, rgba(255,255,235,.95) 0 4%, transparent 5% 100%); opacity: .9; }
.orb-eye-sweep { inset: 4%; z-index: 5; border-radius: 50%; background: conic-gradient(from 0deg, transparent 0deg 286deg, rgba(255, 242, 190, .05) 286deg 309deg, rgba(255, 168, 70, .95) 316deg 324deg, rgba(255, 59, 22, .05) 334deg 360deg); -webkit-mask: radial-gradient(circle, transparent 0 67%, #000 68% 100%); mask: radial-gradient(circle, transparent 0 67%, #000 68% 100%); filter: drop-shadow(0 0 10px rgba(255, 85, 25, .95)); animation: eye-sweep 1.8s linear infinite; will-change: transform; }
.orb-eye-arc { inset: 7% 16%; z-index: 5; border: 3px solid transparent; border-top-color: rgba(255, 224, 163, .9); border-right-color: rgba(255, 81, 26, .7); border-radius: 50%; filter: drop-shadow(0 0 9px rgba(255, 75, 25, .92)); will-change: transform; }
.orb-eye-arc-a { animation: eye-arc-spin 2.2s linear infinite; }
.orb-eye-arc-b { inset: 12% 22%; border-width: 2px; border-top-color: rgba(255, 84, 29, .82); border-left-color: rgba(255, 227, 165, .74); animation: eye-arc-spin-reverse 1.4s linear infinite; }
.orb-eye-scan-beam { left: -20%; right: -20%; top: 43%; z-index: 7; height: 18%; background: linear-gradient(180deg, transparent, rgba(255, 62, 23, .08) 24%, rgba(255, 224, 160, .58) 50%, rgba(255, 72, 24, .12) 76%, transparent); filter: blur(1px) drop-shadow(0 0 14px rgba(255, 78, 24, .88)); transform: translateY(-145%) rotate(-8deg); animation: eye-beam 2.1s cubic-bezier(.45, 0, .2, 1) infinite; mix-blend-mode: screen; }
.orb-eye-scanline { left: 2%; right: 2%; top: 49%; z-index: 6; height: 4px; background: linear-gradient(90deg, transparent, rgba(255, 232, 183, .18) 10%, rgba(255, 224, 161, 1) 50%, rgba(255, 89, 31, .42) 90%, transparent); box-shadow: 0 0 16px rgba(255, 122, 41, 1), 0 0 38px rgba(255, 48, 20, .78); transform: translateY(-58px); animation: eye-scan 1.55s ease-in-out infinite; }
.orb-eye-pulse { inset: 20%; z-index: 1; border: 2px solid rgba(255, 182, 91, .78); border-radius: 50%; box-shadow: 0 0 28px rgba(255, 76, 26, .66), inset 0 0 18px rgba(255, 213, 132, .3); animation: eye-pulse 1.2s ease-in-out infinite; }
.orb-fog { inset: -16%; z-index: 4; overflow: visible; mix-blend-mode: screen; filter: blur(.4px); }
.orb-fog i { left: var(--x); top: var(--y); width: var(--size); height: var(--size); border-radius: 50%; background: radial-gradient(circle, rgba(255, 224, 171, .96) 0 12%, rgba(255, 100, 36, .72) 24%, rgba(255, 43, 20, .08) 72%, transparent 100%); box-shadow: 0 0 9px rgba(255, 110, 39, .82), 0 0 20px rgba(255, 61, 24, .35); opacity: .18; animation: fog-drift var(--duration) ease-in-out var(--delay) infinite alternate; }
body[data-voice-state="listening"] .orb-eye { filter: brightness(1.18) saturate(1.25); }
body[data-voice-state="thinking"] .orb-eye-iris { animation-duration: 1.9s; }
body[data-voice-state="thinking"] .orb-eye-scanline { animation-duration: .75s; }
body[data-voice-state="thinking"] .orb-eye-scan-beam { animation-duration: 1.05s; }
body[data-voice-state="speaking"] .orb-eye-pupil { animation-duration: 1.2s; }
body[data-voice-state="speaking"] .orb-eye-pulse { animation-duration: .8s; }
body[data-voice-state="speaking"] .orb-fog i { animation-duration: 1.8s; opacity: .34; }
body[data-voice-state="error"] .orb-eye { filter: saturate(1.8) hue-rotate(-18deg); }
@keyframes eye-breathe { 0%, 100% { transform: rotate(-8deg) scaleY(.62) scale(1); } 50% { transform: rotate(-8deg) scaleY(.66) scale(1.025); } }
@keyframes eye-iris-spin { to { transform: rotate(360deg); } }
@keyframes eye-pupil-scan { 0%, 100% { transform: translate(0, 0) scale(1); } 18% { transform: translate(-18%, 10%) scale(1.18); } 44% { transform: translate(15%, -12%) scale(.86); } 70% { transform: translate(9%, 16%) scale(1.12); } }
@keyframes eye-sweep { to { transform: rotate(360deg); } }
@keyframes eye-arc-spin { to { transform: rotate(360deg); } }
@keyframes eye-arc-spin-reverse { to { transform: rotate(-360deg); } }
@keyframes eye-beam { 0% { transform: translateY(-145%) rotate(-8deg); opacity: 0; } 18% { opacity: .9; } 52% { opacity: 1; } 100% { transform: translateY(145%) rotate(-8deg); opacity: 0; } }
@keyframes eye-scan { 0%, 100% { transform: translateY(-58px); opacity: .18; } 50% { transform: translateY(58px); opacity: 1; } }
@keyframes eye-pulse { 0%, 100% { transform: scale(.78); opacity: .22; } 50% { transform: scale(1.22); opacity: 1; } }
@keyframes fog-drift { 0% { transform: translate3d(0, 0, 0) scale(.72); opacity: .08; } 48% { opacity: .45; } 100% { transform: translate3d(var(--drift), -18px, 0) scale(1.3); opacity: .04; } }

/* Cortex state palette: calm cyan while waiting, hot amber/red only during work. */
.orb { transition: background .35s ease, border-color .35s ease, box-shadow .35s ease, filter .35s ease; }
body:not([data-voice-state]) .orb,
body[data-voice-state="idle"] .orb,
body[data-voice-state="wake"] .orb,
body[data-voice-state="ready"] .orb {
  background: radial-gradient(circle at 50% 50%, rgba(5, 37, 58, .98) 0 18%, rgba(8, 61, 79, .86) 38%, rgba(3, 25, 43, .52) 62%, transparent 74%), conic-gradient(from 0deg, rgba(86, 244, 255, .08), rgba(36, 178, 210, .36) 18%, rgba(71, 246, 255, .08) 38%, rgba(40, 121, 190, .3) 58%, rgba(86, 244, 255, .08) 82%);
  border-color: rgba(125, 247, 255, .78);
  box-shadow: 0 0 34px rgba(57, 225, 239, .68), 0 0 92px rgba(24, 152, 195, .28), inset 0 0 88px rgba(62, 222, 241, .34);
  animation: cortex-drift 26s linear infinite;
}
body:not([data-voice-state]) .orb::before,
body[data-voice-state="idle"] .orb::before,
body[data-voice-state="wake"] .orb::before,
body[data-voice-state="ready"] .orb::before { border-color: rgba(143, 250, 255, .78); box-shadow: 0 0 28px rgba(71, 238, 255, .68), 0 0 78px rgba(28, 160, 205, .32); }
body:not([data-voice-state]) .orb::after,
body[data-voice-state="idle"] .orb::after,
body[data-voice-state="wake"] .orb::after,
body[data-voice-state="ready"] .orb::after { border-color: rgba(113, 233, 246, .72); box-shadow: 0 0 30px rgba(46, 205, 229, .5); }
body:not([data-voice-state]) .orb-inner,
body[data-voice-state="idle"] .orb-inner,
body[data-voice-state="wake"] .orb-inner,
body[data-voice-state="ready"] .orb-inner { border-color: rgba(145, 250, 255, .94); color: #b8fcff; background: radial-gradient(circle at 50% 42%, rgba(17, 83, 105, .92), rgba(3, 24, 43, .98) 68%); box-shadow: 0 0 32px rgba(46, 222, 239, .66), inset 0 0 32px rgba(104, 235, 255, .34); text-shadow: 0 0 10px rgba(107, 244, 255, .9); }
body:not([data-voice-state]) .orb-hud,
body[data-voice-state="idle"] .orb-hud,
body[data-voice-state="wake"] .orb-hud,
body[data-voice-state="ready"] .orb-hud,
body:not([data-voice-state]) .orb-eye,
body[data-voice-state="idle"] .orb-eye,
body[data-voice-state="wake"] .orb-eye,
body[data-voice-state="ready"] .orb-eye { filter: hue-rotate(132deg) saturate(.82) brightness(1.08); }
body:not([data-voice-state]) .orb-hud-link,
body[data-voice-state="idle"] .orb-hud-link,
body[data-voice-state="wake"] .orb-hud-link,
body[data-voice-state="ready"] .orb-hud-link { color: rgba(133, 246, 255, .88); text-shadow: 0 0 8px rgba(44, 224, 241, .86); }

body[data-voice-state="listening"] .orb,
body[data-voice-state="speaking"] .orb,
body[data-voice-state="searching"] .orb { background: radial-gradient(circle at 50% 50%, rgba(82, 30, 7, .98) 0 18%, rgba(111, 39, 10, .84) 38%, rgba(43, 11, 8, .58) 62%, transparent 74%), conic-gradient(from 0deg, rgba(255, 180, 78, .1), rgba(255, 82, 27, .5) 20%, rgba(255, 194, 99, .1) 42%, rgba(211, 35, 20, .45) 68%, rgba(255, 180, 78, .1)); border-color: rgba(255, 190, 102, .86); box-shadow: 0 0 42px rgba(255, 105, 35, .8), 0 0 118px rgba(220, 44, 15, .36), inset 0 0 92px rgba(255, 132, 40, .42); animation: cortex-active-pulse 1.8s ease-in-out infinite, cortex-drift 12s linear infinite; }
body[data-voice-state="thinking"] .orb,
body[data-voice-state="executing"] .orb { background: radial-gradient(circle at 50% 50%, rgba(91, 15, 6, .99) 0 18%, rgba(132, 25, 8, .88) 38%, rgba(48, 5, 7, .62) 62%, transparent 74%), conic-gradient(from 0deg, rgba(255, 137, 45, .12), rgba(255, 51, 19, .68) 18%, rgba(255, 167, 67, .12) 44%, rgba(176, 12, 10, .58) 72%, rgba(255, 137, 45, .12)); border-color: rgba(255, 117, 55, .96); box-shadow: 0 0 52px rgba(255, 65, 23, .92), 0 0 145px rgba(183, 13, 9, .48), inset 0 0 98px rgba(255, 75, 24, .48); animation: cortex-urgent-pulse .92s ease-in-out infinite, cortex-drift 8s linear infinite; }
body[data-voice-state="error"] .orb { border-color: rgba(255, 76, 76, .98); box-shadow: 0 0 58px rgba(255, 37, 37, .96), 0 0 150px rgba(160, 0, 0, .56), inset 0 0 100px rgba(255, 31, 31, .5); animation: cortex-alert-pulse .6s ease-in-out infinite; }
body:not([data-voice-state]) .cortex-canvas,
body[data-voice-state="idle"] .cortex-canvas,
body[data-voice-state="wake"] .cortex-canvas,
body[data-voice-state="ready"] .cortex-canvas { filter: drop-shadow(0 0 13px rgba(61, 229, 242, .8)); }
body[data-voice-state="listening"] .cortex-canvas,
body[data-voice-state="speaking"] .cortex-canvas,
body[data-voice-state="searching"] .cortex-canvas { filter: drop-shadow(0 0 15px rgba(255, 107, 35, .9)); }
body[data-voice-state="thinking"] .cortex-canvas,
body[data-voice-state="executing"] .cortex-canvas,
body[data-voice-state="error"] .cortex-canvas { filter: drop-shadow(0 0 17px rgba(255, 45, 23, 1)); }
body[data-voice-state="listening"] .orb-hud,
body[data-voice-state="speaking"] .orb-hud,
body[data-voice-state="searching"] .orb-hud,
body[data-voice-state="thinking"] .orb-hud,
body[data-voice-state="executing"] .orb-hud,
body[data-voice-state="error"] .orb-hud,
body[data-voice-state="listening"] .orb-eye,
body[data-voice-state="speaking"] .orb-eye,
body[data-voice-state="searching"] .orb-eye,
body[data-voice-state="thinking"] .orb-eye,
body[data-voice-state="executing"] .orb-eye,
body[data-voice-state="error"] .orb-eye { filter: none; }
body[data-voice-state="listening"] .orb-hud-link,
body[data-voice-state="speaking"] .orb-hud-link,
body[data-voice-state="searching"] .orb-hud-link { color: rgba(255, 196, 111, .96); text-shadow: 0 0 10px rgba(255, 86, 25, .92); }
body[data-voice-state="thinking"] .orb-hud-link,
body[data-voice-state="executing"] .orb-hud-link,
body[data-voice-state="error"] .orb-hud-link { color: rgba(255, 105, 69, 1); text-shadow: 0 0 12px rgba(255, 35, 18, 1); animation: urgency-blink .8s ease-in-out infinite; }
body[data-voice-state="speaking"] .orb-inner,
body[data-voice-state="listening"] .orb-inner,
body[data-voice-state="searching"] .orb-inner { color: #ffe0a3; border-color: rgba(255, 201, 125, .98); }
body[data-voice-state="thinking"] .orb-inner,
body[data-voice-state="executing"] .orb-inner,
body[data-voice-state="error"] .orb-inner { color: #ffd0b8; border-color: rgba(255, 104, 62, 1); }
@keyframes cortex-active-pulse { 0%, 100% { transform: scale(1); filter: saturate(1.05) brightness(.96); } 50% { transform: scale(1.018); filter: saturate(1.45) brightness(1.16); } }
@keyframes cortex-urgent-pulse { 0%, 100% { transform: scale(.995); filter: saturate(1.35) brightness(.96); } 50% { transform: scale(1.035); filter: saturate(1.9) brightness(1.28); } }
@keyframes cortex-alert-pulse { 0%, 100% { transform: scale(1); filter: saturate(1.8) brightness(.9); } 50% { transform: scale(1.045); filter: saturate(2.6) brightness(1.32); } }
@keyframes urgency-blink { 0%, 100% { opacity: .62; } 50% { opacity: 1; } }

/* The Cortex keeps its own deliberate motion even when the device requests
   reduced motion; the rest of the interface still honours that preference. */
html[data-cortex-motion="on"] .orb-inner { overflow: visible; animation: cortex-core-pulse 2.4s ease-in-out infinite; will-change: filter, box-shadow; }
html[data-cortex-motion="on"] .orb-inner::before,
html[data-cortex-motion="on"] .orb-inner::after { content: ""; position: absolute; border: 1px solid currentColor; border-radius: 50%; pointer-events: none; opacity: .82; }
html[data-cortex-motion="on"] .orb-inner::before { inset: -18%; border-right-color: transparent; border-bottom-color: transparent; animation: cortex-core-spin 2.2s linear infinite; }
html[data-cortex-motion="on"] .orb-inner::after { inset: -7%; border-left-color: transparent; opacity: .46; animation: cortex-core-spin-reverse 1.45s linear infinite; }
html[data-cortex-motion="on"] body[data-voice-state="listening"] .orb-inner,
html[data-cortex-motion="on"] body[data-voice-state="speaking"] .orb-inner { animation-duration: 1.15s; }
html[data-cortex-motion="on"] body[data-voice-state="thinking"] .orb-inner,
html[data-cortex-motion="on"] body[data-voice-state="searching"] .orb-inner,
html[data-cortex-motion="on"] body[data-voice-state="executing"] .orb-inner,
html[data-cortex-motion="on"] body[data-voice-state="error"] .orb-inner { animation-duration: .62s; }
@keyframes cortex-core-pulse { 0%, 100% { filter: brightness(.9) saturate(.95); box-shadow: 0 0 22px currentColor, inset 0 0 18px currentColor; } 50% { filter: brightness(1.38) saturate(1.45); box-shadow: 0 0 52px currentColor, inset 0 0 34px currentColor; } }
@keyframes cortex-core-spin { to { transform: rotate(360deg); } }
@keyframes cortex-core-spin-reverse { to { transform: rotate(-360deg); } }
@media (prefers-reduced-motion: reduce) {
  html[data-cortex-motion="on"] .orb,
  html[data-cortex-motion="on"] .orb::before,
  html[data-cortex-motion="on"] .orb::after,
  html[data-cortex-motion="on"] .orb-inner,
  html[data-cortex-motion="on"] .orb-inner::before,
  html[data-cortex-motion="on"] .orb-inner::after,
  html[data-cortex-motion="on"] .orb-hud-ticks,
  html[data-cortex-motion="on"] .orb-hud-ticks::after,
  html[data-cortex-motion="on"] .orb-eye,
  html[data-cortex-motion="on"] .orb-eye-iris,
  html[data-cortex-motion="on"] .orb-eye-pupil,
  html[data-cortex-motion="on"] .orb-eye-sweep,
  html[data-cortex-motion="on"] .orb-eye-arc-a,
  html[data-cortex-motion="on"] .orb-eye-arc-b,
  html[data-cortex-motion="on"] .orb-eye-scan-beam,
  html[data-cortex-motion="on"] .orb-eye-scanline,
  html[data-cortex-motion="on"] .orb-eye-pulse,
  html[data-cortex-motion="on"] .orb-fog i { animation-iteration-count: infinite !important; }
  html[data-cortex-motion="on"] .orb { animation-duration: 26s !important; }
  html[data-cortex-motion="on"] .orb::before { animation-duration: 8s !important; }
  html[data-cortex-motion="on"] .orb::after { animation-duration: 11s !important; }
  html[data-cortex-motion="on"] .orb-inner { animation-duration: 2.4s !important; }
  html[data-cortex-motion="on"] .orb-inner::before { animation-duration: 2.2s !important; }
  html[data-cortex-motion="on"] .orb-inner::after { animation-duration: 1.45s !important; }
  html[data-cortex-motion="on"] .orb-hud-ticks { animation-duration: 18s !important; }
  html[data-cortex-motion="on"] .orb-hud-ticks::after { animation-duration: 11s !important; }
  html[data-cortex-motion="on"] .orb-eye { animation-duration: 3.2s !important; }
  html[data-cortex-motion="on"] .orb-eye-iris { animation-duration: 3.6s !important; }
  html[data-cortex-motion="on"] .orb-eye-pupil { animation-duration: 2.5s !important; }
  html[data-cortex-motion="on"] .orb-eye-sweep { animation-duration: 1.8s !important; }
  html[data-cortex-motion="on"] .orb-eye-arc-a { animation-duration: 2.2s !important; }
  html[data-cortex-motion="on"] .orb-eye-arc-b { animation-duration: 1.4s !important; }
  html[data-cortex-motion="on"] .orb-eye-scan-beam { animation-duration: 2.1s !important; }
  html[data-cortex-motion="on"] .orb-eye-scanline { animation-duration: 1.55s !important; }
  html[data-cortex-motion="on"] .orb-eye-pulse { animation-duration: 1.2s !important; }
  html[data-cortex-motion="on"] .orb-fog i { animation-duration: var(--duration) !important; }
}

/* Command Deck HUD ------------------------------------------------------ */
.command-deck {
  --hud-accent: #58eaff;
  --hud-accent-soft: rgba(88, 234, 255, .18);
  --hud-alert: #ff6a4d;
  position: relative;
  display: block;
  min-height: min(900px, calc(100vh - 170px));
  padding: clamp(18px, 2.4vw, 34px);
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(81, 224, 255, .34);
  border-radius: 20px;
  background: radial-gradient(circle at 50% 45%, rgba(15, 70, 98, .28), transparent 34%), linear-gradient(145deg, rgba(2, 13, 28, .98), rgba(4, 10, 24, .95) 52%, rgba(11, 7, 27, .98));
  box-shadow: 0 0 70px rgba(22, 186, 229, .12), inset 0 0 90px rgba(26, 107, 146, .08);
}
.command-deck::before { content: ""; position: absolute; inset: 0; z-index: -2; opacity: .42; background-image: linear-gradient(rgba(69, 204, 255, .09) 1px, transparent 1px), linear-gradient(90deg, rgba(69, 204, 255, .09) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(circle at 50% 48%, #000 0 52%, transparent 86%); }
.command-deck::after { content: "CORE // SECURE CHANNEL // 04A"; position: absolute; right: 28px; bottom: 12px; color: rgba(124, 218, 255, .38); font: 9px ui-monospace, SFMono-Regular, monospace; letter-spacing: .24em; pointer-events: none; }
.hud-backdrop { position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; filter: blur(1px); }
.hud-backdrop-a { width: 58vw; height: 58vw; left: 21%; top: 12%; background: radial-gradient(circle, rgba(31, 193, 231, .13), transparent 64%); animation: hud-backdrop-breathe 6s ease-in-out infinite; }
.hud-backdrop-b { width: 42vw; height: 42vw; left: 29%; top: 24%; border: 1px solid rgba(116, 142, 255, .12); box-shadow: 0 0 120px rgba(118, 67, 255, .12); animation: hud-backdrop-rotate 34s linear infinite reverse; }
.hud-scanline { position: absolute; z-index: 3; left: 0; right: 0; top: -14%; height: 1px; background: linear-gradient(90deg, transparent, rgba(119, 248, 255, .78), transparent); box-shadow: 0 0 18px rgba(80, 225, 255, .76); opacity: .46; pointer-events: none; animation: hud-scanline 7s ease-in-out infinite; }
.hud-topbar { position: relative; z-index: 4; display: grid; grid-template-columns: minmax(200px, .9fr) minmax(300px, 1.4fr) minmax(130px, .55fr); align-items: center; gap: 20px; min-height: 78px; padding: 4px 0 20px; border-bottom: 1px solid rgba(80, 218, 255, .24); }
.hud-brand { display: grid; gap: 3px; }
.hud-brand strong { color: #e9fbff; font-size: clamp(24px, 3.2vw, 42px); font-weight: 400; letter-spacing: .28em; text-shadow: 0 0 22px rgba(93, 235, 255, .42); }
.hud-brand small, .hud-eyebrow, .hud-clock small { color: rgba(119, 213, 255, .6); font: 9px ui-monospace, SFMono-Regular, monospace; letter-spacing: .22em; }
.hud-eyebrow { color: var(--hud-accent); font-size: 8px; }
.hud-state-track { display: flex; align-items: center; justify-content: center; gap: clamp(6px, 1.3vw, 18px); color: rgba(145, 212, 239, .62); font: 9px ui-monospace, SFMono-Regular, monospace; letter-spacing: .12em; }
.hud-state-track i { display: block; width: clamp(18px, 3vw, 58px); height: 1px; background: linear-gradient(90deg, rgba(69, 206, 255, .26), rgba(69, 206, 255, .76)); }
.hud-step { display: grid; justify-items: center; gap: 4px; min-width: 55px; white-space: nowrap; transition: color .3s ease, text-shadow .3s ease; }
.hud-step b { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid currentColor; border-radius: 50%; font-size: 8px; font-weight: 500; }
.hud-step.is-active { color: var(--hud-accent); text-shadow: 0 0 12px currentColor; }
.hud-step.is-active b { background: var(--hud-accent-soft); box-shadow: 0 0 16px var(--hud-accent-soft); }
.hud-clock { display: grid; justify-items: end; gap: 4px; color: var(--hud-accent); font: 18px ui-monospace, SFMono-Regular, monospace; letter-spacing: .12em; }
.hud-clock small { font-size: 8px; }
.hud-stage { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(212px, .76fr) minmax(360px, 1.65fr) minmax(212px, .76fr); align-items: center; gap: clamp(15px, 2.3vw, 34px); min-height: 650px; padding: 28px 0 18px; }
.cortex-stack { display: grid; min-width: 0; width: 100%; align-items: center; }
.system-activity-window { position: relative; z-index: 12; width: min(94%, 620px); margin: 0 auto -9%; overflow: hidden; border: 1px solid rgba(88, 234, 255, .48); background: linear-gradient(135deg, rgba(3, 21, 38, .96), rgba(7, 13, 31, .94)); box-shadow: 0 0 28px rgba(49, 211, 249, .18), inset 0 0 28px rgba(49, 211, 249, .05); backdrop-filter: blur(15px); transition: border-color .25s ease, box-shadow .25s ease; }
.system-activity-window::before, .system-activity-window::after { content: ""; position: absolute; width: 22px; height: 2px; background: var(--hud-accent); box-shadow: 0 0 12px var(--hud-accent); }
.system-activity-window::before { left: 0; top: 0; } .system-activity-window::after { right: 0; bottom: 0; }
.system-activity-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 14px 9px; border-bottom: 1px solid rgba(90, 218, 255, .18); }
.system-activity-head > div:first-child { display: grid; gap: 4px; min-width: 0; }
.system-activity-head span, .system-activity-current small, .system-activity-stats small { color: rgba(124, 213, 244, .58); font: 7px ui-monospace, SFMono-Regular, monospace; letter-spacing: .18em; }
.system-activity-head strong { overflow: hidden; color: #e7fbff; font: 11px ui-monospace, SFMono-Regular, monospace; letter-spacing: .14em; text-overflow: ellipsis; white-space: nowrap; }
.system-activity-signal { display: flex; align-items: center; gap: 7px; color: #80efff; font: 8px ui-monospace, SFMono-Regular, monospace; letter-spacing: .15em; }
.system-activity-signal i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; animation: system-activity-pulse 1.2s ease-in-out infinite; }
.system-activity-body { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 14px; }
.system-activity-current { display: flex; align-items: center; gap: 11px; min-width: 0; }
.system-activity-current > span { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border: 1px solid var(--hud-accent); border-radius: 50%; color: var(--hud-accent); box-shadow: 0 0 14px var(--hud-accent-soft); font: 18px ui-monospace, monospace; }
.system-activity-current > div { min-width: 0; } .system-activity-current strong { display: block; overflow: hidden; margin-top: 3px; color: var(--hud-accent); font: 10px ui-monospace, SFMono-Regular, monospace; letter-spacing: .08em; text-overflow: ellipsis; white-space: nowrap; }
.system-activity-current p { overflow: hidden; margin: 3px 0 0; color: rgba(180, 222, 238, .62); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.system-activity-stats { display: flex; gap: 13px; }
.system-activity-stats span { display: grid; gap: 3px; text-align: right; } .system-activity-stats b { color: #dff9ff; font: 9px ui-monospace, SFMono-Regular, monospace; font-weight: 500; }
.system-activity-log { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; max-height: 43px; overflow: hidden; list-style: none; border-top: 1px solid rgba(90, 218, 255, .12); background: rgba(69, 198, 232, .08); }
.system-activity-log li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 7px; min-width: 0; padding: 5px 8px; background: rgba(2, 15, 29, .9); }
.system-activity-log time, .system-activity-log span, .system-activity-log b { overflow: hidden; color: rgba(141, 210, 235, .54); font: 7px ui-monospace, SFMono-Regular, monospace; text-overflow: ellipsis; white-space: nowrap; }
.system-activity-log b { color: var(--hud-accent); font-weight: 500; } .system-activity-log li[data-level="error"] b { color: #ff8b76; }
.system-activity-window[data-level="working"] { border-color: rgba(168, 145, 255, .62); box-shadow: 0 0 34px rgba(133, 92, 255, .24), inset 0 0 32px rgba(125, 82, 255, .08); }
.system-activity-window[data-level="working"] .system-activity-current > span { animation: system-activity-spin 1.3s linear infinite; }
.system-activity-window[data-level="error"] { border-color: rgba(255, 94, 70, .75); box-shadow: 0 0 38px rgba(255, 60, 35, .3), inset 0 0 34px rgba(255, 45, 25, .1); }
.system-activity-window[data-level="error"] .system-activity-signal, .system-activity-window[data-level="error"] .system-activity-current strong, .system-activity-window[data-level="error"] .system-activity-current > span { color: #ff806b; }
@keyframes system-activity-pulse { 50% { opacity: .35; transform: scale(.7); } }
@keyframes system-activity-spin { to { transform: rotate(360deg); } }
.hud-panel { position: relative; min-width: 0; align-self: center; border: 1px solid color-mix(in srgb, var(--hud-accent) 62%, transparent); background: linear-gradient(145deg, rgba(6, 26, 46, .86), rgba(3, 12, 28, .74)); box-shadow: 0 0 26px var(--hud-accent-soft), inset 0 0 38px rgba(38, 121, 170, .08); backdrop-filter: blur(12px); transition: border-color .35s ease, box-shadow .35s ease, opacity .25s ease; }
.hud-panel::before, .hud-panel::after { content: ""; position: absolute; width: 12px; height: 12px; border-color: var(--hud-accent); border-style: solid; pointer-events: none; }
.hud-panel::before { left: -1px; top: -1px; border-width: 2px 0 0 2px; }
.hud-panel::after { right: -1px; bottom: -1px; border-width: 0 2px 2px 0; }
.hud-panel-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 15px 16px 12px; border-bottom: 1px solid rgba(101, 218, 255, .2); cursor: grab; user-select: none; }
.hud-panel-header:active { cursor: grabbing; }
.hud-panel-index, .hud-panel-subhead { color: rgba(111, 206, 243, .56); font: 8px ui-monospace, SFMono-Regular, monospace; letter-spacing: .18em; }
.hud-panel h3 { margin: 7px 0 0; color: var(--hud-accent); font-size: 15px; font-weight: 500; letter-spacing: .16em; text-shadow: 0 0 12px var(--hud-accent-soft); }
.hud-panel-actions { display: flex; gap: 3px; }
.hud-panel-actions button { min-width: 23px; min-height: 23px; padding: 0; border: 1px solid rgba(108, 213, 255, .22); color: rgba(179, 235, 255, .78); background: rgba(8, 35, 59, .58); font-size: 15px; }
.hud-panel-actions button:hover { color: #fff; border-color: var(--hud-accent); transform: none; }
.hud-panel-body { padding: 15px 16px 17px; }
.hud-status-orb, .hud-mode-card { display: flex; align-items: center; gap: 13px; min-height: 66px; }
.hud-status-orb > span, .hud-mode-ring { flex: 0 0 50px; width: 50px; height: 50px; border: 1px solid var(--hud-accent); border-radius: 50%; box-shadow: 0 0 18px var(--hud-accent-soft), inset 0 0 14px var(--hud-accent-soft); background: radial-gradient(circle, var(--hud-accent) 0 8%, transparent 10% 32%, rgba(52, 205, 244, .16) 34% 38%, transparent 40% 56%, var(--hud-accent) 57% 59%, transparent 61%); animation: hud-ring-pulse 2.8s ease-in-out infinite; }
.hud-status-orb strong, .hud-mode-card strong { display: block; color: #e8faff; font-size: 12px; letter-spacing: .12em; }
.hud-mode-card small { display: block; margin-top: 7px; color: rgba(182, 219, 237, .62); font-size: 10px; line-height: 1.35; }
.hud-metric-list { display: grid; gap: 10px; margin-top: 18px; }
.hud-metric-list div { display: flex; justify-content: space-between; gap: 8px; color: rgba(140, 200, 226, .7); font: 9px ui-monospace, SFMono-Regular, monospace; letter-spacing: .1em; }
.hud-metric-list b { color: var(--hud-accent); font-weight: 500; }
.hud-panel-divider { height: 1px; margin: 18px 0 14px; background: linear-gradient(90deg, var(--hud-accent), transparent); opacity: .38; }
.hud-panel-subhead { display: flex; justify-content: space-between; gap: 8px; }
.hud-panel-subhead em { color: var(--hud-accent); font-style: normal; font-size: 8px; }
.hud-event-list { display: grid; gap: 8px; margin: 11px 0 0; padding: 0; list-style: none; }
.hud-event-list li { display: grid; gap: 3px; padding: 8px 9px; border-left: 2px solid var(--hud-accent); background: rgba(20, 69, 91, .18); }
.hud-event-list li[data-severity="critical"] { border-left-color: var(--hud-alert); background: rgba(125, 30, 25, .24); }
.hud-event-list time { color: rgba(119, 207, 240, .58); font: 8px ui-monospace, SFMono-Regular, monospace; }
.hud-event-list strong { overflow: hidden; color: #d9f4ff; font-size: 9px; letter-spacing: .08em; text-overflow: ellipsis; white-space: nowrap; }
.hud-event-list small { overflow: hidden; color: rgba(162, 207, 227, .62); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.hud-context-tags { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 18px; }
.hud-context-tags button { min-height: 30px; padding: 5px 6px; border: 1px solid rgba(79, 205, 255, .28); color: rgba(154, 221, 245, .76); background: rgba(15, 59, 92, .3); font: 9px ui-monospace, SFMono-Regular, monospace; letter-spacing: .12em; }
.hud-context-tags button:hover, .hud-context-tags button.is-active { border-color: var(--hud-accent); color: #fff; background: var(--hud-accent-soft); box-shadow: 0 0 16px var(--hud-accent-soft); transform: none; }
.hud-transcript { min-height: 72px; margin-top: 10px; padding: 10px; border: 1px solid rgba(112, 210, 255, .18); background: rgba(1, 14, 28, .58); }
.hud-transcript p { overflow: hidden; margin: 0 0 7px; color: rgba(210, 239, 249, .82); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.hud-transcript p:last-child { margin-bottom: 0; color: #fff0c9; }
.hud-waveform { display: flex; align-items: center; justify-content: center; gap: 3px; height: 34px; margin-top: 12px; opacity: .78; }
.hud-waveform i { display: block; width: 3px; height: 10px; border-radius: 3px; background: var(--hud-accent); box-shadow: 0 0 8px var(--hud-accent); animation: hud-wave 1.2s ease-in-out infinite; animation-delay: calc(var(--wave-index, 0) * -80ms); }
.hud-waveform i:nth-child(2) { --wave-index: 1; } .hud-waveform i:nth-child(3) { --wave-index: 2; } .hud-waveform i:nth-child(4) { --wave-index: 3; } .hud-waveform i:nth-child(5) { --wave-index: 4; } .hud-waveform i:nth-child(6) { --wave-index: 5; } .hud-waveform i:nth-child(7) { --wave-index: 6; } .hud-waveform i:nth-child(8) { --wave-index: 7; } .hud-waveform i:nth-child(9) { --wave-index: 8; } .hud-waveform i:nth-child(10) { --wave-index: 9; } .hud-waveform i:nth-child(11) { --wave-index: 10; } .hud-waveform i:nth-child(12) { --wave-index: 11; } .hud-waveform i:nth-child(13) { --wave-index: 12; } .hud-waveform i:nth-child(14) { --wave-index: 13; } .hud-waveform i:nth-child(15) { --wave-index: 14; } .hud-waveform i:nth-child(16) { --wave-index: 15; }
.iris-stage { position: relative; display: grid; place-items: center; min-width: 0; width: 100%; aspect-ratio: 1; max-width: 700px; margin: auto; }
.iris-grid { position: absolute; inset: 4%; border: 1px solid rgba(61, 211, 255, .16); border-radius: 50%; background: repeating-conic-gradient(from 0deg, rgba(73, 222, 255, .22) 0 1deg, transparent 1deg 12deg); mask-image: radial-gradient(circle, transparent 0 64%, #000 65% 66%, transparent 67%); animation: hud-grid-rotate 28s linear infinite; }
.iris-stage::before, .iris-stage::after { content: ""; position: absolute; z-index: 1; inset: 8%; border: 1px solid rgba(69, 213, 255, .22); border-radius: 50%; box-shadow: 0 0 28px var(--hud-accent-soft), inset 0 0 36px rgba(51, 163, 229, .08); pointer-events: none; }
.iris-stage::after { inset: 21%; border-style: dashed; border-color: rgba(138, 157, 255, .34); animation: hud-focus-ring 14s linear infinite reverse; }
.iris-axis { position: absolute; z-index: 4; background: linear-gradient(90deg, transparent, var(--hud-accent), transparent); opacity: .55; pointer-events: none; }
.iris-axis-h { width: 100%; height: 1px; } .iris-axis-v { width: 1px; height: 100%; background: linear-gradient(180deg, transparent, var(--hud-accent), transparent); }
.iris-bracket { position: absolute; z-index: 5; width: 11%; height: 11%; border-color: var(--hud-accent); border-style: solid; opacity: .76; pointer-events: none; }
.iris-bracket-a { left: 8%; top: 8%; border-width: 2px 0 0 2px; } .iris-bracket-b { right: 8%; bottom: 8%; border-width: 0 2px 2px 0; }
.iris-stage .orb { z-index: 2; width: 88%; max-width: 650px; margin: 0; background: radial-gradient(circle at 50% 50%, rgba(1, 18, 33, .98) 0 17%, rgba(6, 59, 82, .84) 34%, rgba(6, 17, 38, .5) 64%, transparent 74%), conic-gradient(from 0deg, rgba(75, 235, 255, .06), rgba(49, 204, 247, .5) 14%, rgba(83, 121, 255, .16) 31%, rgba(123, 82, 255, .46) 48%, rgba(56, 229, 255, .1) 68%, rgba(91, 222, 255, .48) 84%, rgba(75, 235, 255, .06)); border: 1px solid rgba(99, 229, 255, .68); box-shadow: 0 0 38px rgba(35, 203, 241, .42), 0 0 130px rgba(78, 106, 255, .18), inset 0 0 90px rgba(24, 175, 229, .26); }
.iris-readout { position: absolute; z-index: 6; display: grid; gap: 3px; color: rgba(137, 221, 250, .58); font: 8px ui-monospace, SFMono-Regular, monospace; letter-spacing: .16em; pointer-events: none; }
.iris-readout b { color: var(--hud-accent); font-size: 10px; font-weight: 500; } .iris-readout-left { left: 3%; bottom: 20%; } .iris-readout-right { right: 3%; bottom: 20%; text-align: right; }
.iris-caption { position: absolute; z-index: 7; bottom: 3%; display: grid; justify-items: center; gap: 5px; color: var(--hud-accent); text-align: center; text-shadow: 0 0 12px var(--hud-accent-soft); }
.iris-caption strong { font: 13px ui-monospace, SFMono-Regular, monospace; letter-spacing: .32em; } .iris-caption span { color: rgba(164, 224, 242, .62); font: 8px ui-monospace, SFMono-Regular, monospace; letter-spacing: .18em; }
.hud-bottom-rail { position: relative; z-index: 4; display: grid; grid-template-columns: minmax(150px, .7fr) minmax(340px, 1.9fr) minmax(150px, .8fr); align-items: center; gap: 16px; min-height: 84px; padding: 14px 0 0; border-top: 1px solid rgba(79, 211, 255, .26); }
.hud-rail-label { display: grid; gap: 5px; color: var(--hud-accent); font: 9px ui-monospace, SFMono-Regular, monospace; letter-spacing: .13em; }
.hud-rail-label b { overflow: hidden; color: rgba(168, 210, 229, .58); font-size: 8px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.hud-command-controls { min-width: 0; text-align: center; } .hud-command-controls .state-buttons { display: flex; justify-content: center; gap: 6px; margin: 0; } .hud-command-controls .state-buttons button { min-height: 27px; padding: 5px 8px; border-color: rgba(84, 209, 255, .28); background: rgba(5, 35, 58, .52); font-size: 8px; letter-spacing: .08em; } .hud-command-controls .state-buttons button:not(#voice-stop) { display: none; } .hud-command-controls.voice-auto-armed .state-buttons { display: flex; }
.hud-command-controls #voice-status { min-height: 15px; margin: 8px 0 0; color: var(--hud-accent); font: 8px ui-monospace, SFMono-Regular, monospace; letter-spacing: .12em; }
.hud-bottom-rail .voice-session-feedback { width: auto; min-width: 0; margin: 0; padding: 8px 10px; border-color: rgba(78, 209, 255, .2); background: rgba(2, 20, 36, .48); }
.hud-bottom-rail .voice-session-feedback p { display: none; } .hud-bottom-rail .voice-session-line { font-size: 8px; }
.hud-panel.is-minimized .hud-panel-body { display: none; } .hud-panel.is-minimized .hud-panel-header { border-bottom: 0; }
.hud-panel.is-maximized { position: fixed; z-index: 80; inset: 8vh 10vw; max-height: 84vh; overflow: auto; transform: none !important; box-shadow: 0 0 60px rgba(0, 0, 0, .72), 0 0 40px var(--hud-accent-soft); }
body[data-hud-state="listening"] .command-deck { --hud-accent: #72f4ff; --hud-accent-soft: rgba(80, 233, 255, .28); }
body[data-hud-state="idle"] .iris-stage .orb,
body[data-hud-state="wake"] .iris-stage .orb,
body[data-hud-state="ready"] .iris-stage .orb { animation: hud-core-breathe 4s ease-in-out infinite; }
body[data-hud-state="listening"] .iris-stage .orb { box-shadow: 0 0 52px rgba(74, 233, 255, .7), 0 0 150px rgba(25, 170, 233, .28), inset 0 0 100px rgba(75, 225, 255, .36); animation: hud-core-breathe 1.35s ease-in-out infinite; }
body[data-hud-state="processing"] .command-deck { --hud-accent: #a991ff; --hud-accent-soft: rgba(148, 103, 255, .24); }
body[data-hud-state="processing"] .iris-stage .orb { box-shadow: 0 0 58px rgba(111, 97, 255, .72), 0 0 170px rgba(130, 53, 255, .3), inset 0 0 105px rgba(124, 82, 255, .4); animation: hud-core-breathe 1s ease-in-out infinite; }
body[data-hud-state="critical"] .command-deck { --hud-accent: #ff7659; --hud-accent-soft: rgba(255, 89, 58, .26); }
body[data-hud-state="critical"] .iris-stage .orb { border-color: rgba(255, 106, 77, .88); box-shadow: 0 0 65px rgba(255, 70, 42, .76), 0 0 170px rgba(174, 25, 13, .32), inset 0 0 120px rgba(255, 64, 37, .4); animation: hud-core-alert .58s ease-in-out infinite; }
body[data-hud-state="idle"] .iris-stage .orb-eye,
body[data-hud-state="wake"] .iris-stage .orb-eye,
body[data-hud-state="ready"] .iris-stage .orb-eye,
body[data-hud-state="listening"] .iris-stage .orb-eye { filter: hue-rotate(152deg) saturate(1.08) brightness(1.1); }
body[data-hud-state="processing"] .iris-stage .orb-eye { filter: hue-rotate(188deg) saturate(.92) brightness(1.12); }
body[data-hud-state="critical"] .iris-stage .orb-eye { filter: none; }
body[data-hud-state="idle"] .iris-stage .orb,
body[data-hud-state="wake"] .iris-stage .orb,
body[data-hud-state="ready"] .iris-stage .orb,
body[data-hud-state="listening"] .iris-stage .orb,
body[data-hud-state="processing"] .iris-stage .orb,
body[data-hud-state="critical"] .iris-stage .orb { filter: none; }
body[data-hud-state="idle"] .iris-stage .orb-hud,
body[data-hud-state="wake"] .iris-stage .orb-hud,
body[data-hud-state="ready"] .iris-stage .orb-hud,
body[data-hud-state="listening"] .iris-stage .orb-hud,
body[data-hud-state="processing"] .iris-stage .orb-hud,
body[data-hud-state="critical"] .iris-stage .orb-hud { color: var(--hud-accent); text-shadow: 0 0 10px var(--hud-accent-soft); filter: none; }
body[data-hud-state="idle"] .iris-stage .orb-hud-title,
body[data-hud-state="idle"] .iris-stage .orb-hud-link,
body[data-hud-state="idle"] .iris-stage .orb-hud-left,
body[data-hud-state="idle"] .iris-stage .orb-hud-right,
body[data-hud-state="wake"] .iris-stage .orb-hud-title,
body[data-hud-state="wake"] .iris-stage .orb-hud-link,
body[data-hud-state="wake"] .iris-stage .orb-hud-left,
body[data-hud-state="wake"] .iris-stage .orb-hud-right,
body[data-hud-state="ready"] .iris-stage .orb-hud-title,
body[data-hud-state="ready"] .iris-stage .orb-hud-link,
body[data-hud-state="ready"] .iris-stage .orb-hud-left,
body[data-hud-state="ready"] .iris-stage .orb-hud-right,
body[data-hud-state="listening"] .iris-stage .orb-hud-title,
body[data-hud-state="listening"] .iris-stage .orb-hud-link,
body[data-hud-state="listening"] .iris-stage .orb-hud-left,
body[data-hud-state="listening"] .iris-stage .orb-hud-right,
body[data-hud-state="processing"] .iris-stage .orb-hud-title,
body[data-hud-state="processing"] .iris-stage .orb-hud-link,
body[data-hud-state="processing"] .iris-stage .orb-hud-left,
body[data-hud-state="processing"] .iris-stage .orb-hud-right,
body[data-hud-state="critical"] .iris-stage .orb-hud-title,
body[data-hud-state="critical"] .iris-stage .orb-hud-link,
body[data-hud-state="critical"] .iris-stage .orb-hud-left,
body[data-hud-state="critical"] .iris-stage .orb-hud-right { color: var(--hud-accent); text-shadow: 0 0 10px var(--hud-accent-soft); }
body[data-hud-state="listening"] .hud-waveform i, body[data-hud-state="processing"] .hud-waveform i, body[data-hud-state="critical"] .hud-waveform i { animation-duration: .52s; }
body[data-hud-state="idle"] .hud-waveform i, body[data-hud-state="ready"] .hud-waveform i { animation-play-state: paused; opacity: .28; }
@keyframes hud-scanline { 0%, 100% { transform: translateY(0); opacity: .12; } 50% { transform: translateY(760px); opacity: .76; } }
@keyframes hud-backdrop-breathe { 0%, 100% { transform: scale(.96); opacity: .62; } 50% { transform: scale(1.04); opacity: 1; } }
@keyframes hud-backdrop-rotate { to { transform: rotate(360deg); } }
@keyframes hud-grid-rotate { to { transform: rotate(360deg); } }
@keyframes hud-focus-ring { to { transform: rotate(-360deg); } }
@keyframes hud-ring-pulse { 0%, 100% { transform: scale(.96); opacity: .72; } 50% { transform: scale(1.04); opacity: 1; } }
@keyframes hud-wave { 0%, 100% { height: 8px; opacity: .45; } 50% { height: 28px; opacity: 1; } }
@keyframes hud-core-breathe { 0%, 100% { filter: brightness(.9) saturate(1); } 50% { filter: brightness(1.25) saturate(1.45); } }
@keyframes hud-core-alert { 0%, 100% { filter: brightness(.86) saturate(1.5); transform: scale(.985); } 50% { filter: brightness(1.42) saturate(2); transform: scale(1.035); } }
@media (max-width: 1120px) { .hud-stage { grid-template-columns: minmax(190px, .7fr) minmax(320px, 1.4fr) minmax(190px, .7fr); gap: 14px; } .hud-brand strong { letter-spacing: .2em; } .hud-state-track { gap: 5px; font-size: 8px; } .hud-state-track i { width: 18px; } .hud-panel-body { padding: 13px 12px; } }
@media (max-width: 820px) { .command-deck { min-height: auto; padding: 14px; } .hud-topbar { grid-template-columns: 1fr; gap: 12px; text-align: center; } .hud-brand, .hud-clock { justify-items: center; } .hud-state-track { order: 3; } .hud-stage { grid-template-columns: 1fr; grid-template-areas: "iris" "left" "right"; min-height: 0; padding-top: 16px; } .cortex-stack { grid-area: iris; } .iris-stage { width: min(100%, 600px); } .system-activity-window { width: 100%; margin-bottom: -4%; } .system-activity-body { grid-template-columns: 1fr; } .system-activity-stats { justify-content: space-between; } .system-activity-stats span { text-align: left; } .hud-panel-left { grid-area: left; } .hud-panel-right { grid-area: right; } .hud-bottom-rail { grid-template-columns: 1fr; gap: 10px; text-align: center; } .hud-rail-label { justify-items: center; } .hud-bottom-rail .voice-session-feedback { width: 100%; } .hud-command-controls .state-buttons { flex-wrap: wrap; } .hud-command-controls .state-buttons button { flex: 1 1 28%; } }
@media (max-width: 480px) { .hud-brand strong { font-size: 27px; } .hud-state-track { gap: 2px; font-size: 7px; letter-spacing: .04em; } .hud-state-track i { width: 8px; } .hud-step { min-width: 44px; } .hud-panel h3 { font-size: 13px; } .system-activity-log { grid-template-columns: 1fr; max-height: 62px; } .system-activity-stats { gap: 8px; } .iris-readout { font-size: 7px; } .iris-caption strong { font-size: 11px; } .hud-panel.is-maximized { inset: 2vh 3vw; } }

/* Iris focus rack: the Cortex keeps the eye in a soft optical search, then
   settles into a sharp lock before gently searching again. */
.iris-scale-ring { position: absolute; inset: 2.5%; z-index: 3; display: block; border: 1px solid rgba(94, 226, 255, .5); border-radius: 50%; pointer-events: none; transform: scaleY(.78); background: repeating-conic-gradient(from -1deg, rgba(118, 239, 255, .9) 0deg 1deg, transparent 1deg 5deg, rgba(128, 163, 255, .5) 5deg 5.8deg, transparent 5.8deg 12deg); -webkit-mask: radial-gradient(ellipse, transparent 0 72%, #000 72.5% 79%, transparent 79.5%); mask: radial-gradient(ellipse, transparent 0 72%, #000 72.5% 79%, transparent 79.5%); box-shadow: 0 0 22px rgba(45, 214, 255, .4); animation: iris-scale-turn 22s linear infinite; will-change: transform; }
.iris-scale-ring::before, .iris-scale-ring::after { content: ""; position: absolute; inset: 8%; border: 1px solid rgba(149, 132, 255, .6); border-radius: 50%; -webkit-mask: radial-gradient(ellipse, transparent 0 75%, #000 75.5% 80%, transparent 80.5%); mask: radial-gradient(ellipse, transparent 0 75%, #000 75.5% 80%, transparent 80.5%); }
.iris-scale-ring::after { inset: 17%; border-color: rgba(84, 238, 255, .72); border-style: dashed; animation: iris-scale-counter-turn 13s linear infinite; }
.iris-focus-reticle { position: absolute; inset: 20%; z-index: 5; pointer-events: none; opacity: .9; animation: iris-reticle-lock 10.8s cubic-bezier(.42, 0, .22, 1) infinite; will-change: transform, opacity; }
.iris-focus-reticle i { position: absolute; width: 18%; height: 18%; border-color: rgba(115, 237, 255, .9); border-style: solid; filter: drop-shadow(0 0 7px rgba(60, 224, 255, .8)); }
.iris-focus-reticle i:nth-child(1) { top: 0; left: 0; border-width: 2px 0 0 2px; }
.iris-focus-reticle i:nth-child(2) { top: 0; right: 0; border-width: 2px 2px 0 0; }
.iris-focus-reticle i:nth-child(3) { bottom: 0; left: 0; border-width: 0 0 2px 2px; }
.iris-focus-reticle i:nth-child(4) { right: 0; bottom: 0; border-width: 0 2px 2px 0; }
.iris-focus-reticle b { position: absolute; top: 50%; left: 50%; width: 7px; height: 7px; border: 1px solid rgba(182, 153, 255, .95); border-radius: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 12px rgba(119, 122, 255, .9); }
.iris-focus-shell { --focus-hue: 148deg; position: absolute; inset: 7%; z-index: 2; display: block; pointer-events: none; transform-origin: 50% 50%; animation: iris-focus-rack 10.8s cubic-bezier(.42, 0, .22, 1) infinite; will-change: transform, filter, opacity; }
.iris-focus-ring { position: absolute; display: block; pointer-events: none; border-radius: 50%; transform-origin: 50% 50%; mix-blend-mode: screen; will-change: transform, opacity; }
.iris-focus-ring-a { inset: 0; border: 1px solid rgba(129, 238, 255, .82); transform: rotate(-7deg) scaleY(.62); box-shadow: 0 0 18px rgba(63, 219, 255, .52); animation: iris-ring-drift-a 8.6s ease-in-out infinite; }
.iris-focus-ring-b { inset: 7%; border: 1px dashed rgba(177, 153, 255, .76); transform: rotate(12deg) scaleY(.66); box-shadow: 0 0 16px rgba(137, 107, 255, .42); animation: iris-ring-drift-b 6.8s ease-in-out infinite reverse; }
.iris-focus-ring-c { inset: 16%; border: 1px dotted rgba(103, 237, 255, .8); transform: rotate(-18deg) scaleY(.72); box-shadow: inset 0 0 12px rgba(81, 223, 255, .3); animation: iris-ring-drift-c 5.4s ease-in-out infinite; }
.iris-focus-shell .orb-eye { inset: 10% 4%; }
body[data-hud-state="idle"] .iris-focus-shell,
body[data-hud-state="wake"] .iris-focus-shell,
body[data-hud-state="ready"] .iris-focus-shell { --focus-hue: 148deg; animation-duration: 11.4s; }
body[data-hud-state="listening"] .iris-focus-shell { --focus-hue: 156deg; animation-duration: 6.4s; }
body[data-hud-state="processing"] .iris-focus-shell { --focus-hue: 190deg; animation-duration: 7.4s; }
body[data-hud-state="critical"] .iris-focus-shell { --focus-hue: 0deg; animation-duration: 3.8s; }
@keyframes iris-focus-rack {
  0%, 100% { transform: translate3d(-2.2%, .65%, 0) rotate(-2.4deg) scale(.958); filter: blur(5px) hue-rotate(var(--focus-hue)) saturate(.78) brightness(.82); opacity: .68; }
  13% { transform: translate3d(-.85%, .25%, 0) rotate(-1deg) scale(.982); filter: blur(2.2px) hue-rotate(var(--focus-hue)) saturate(.9) brightness(.96); opacity: .86; }
  27%, 66% { transform: translate3d(.05%, 0, 0) rotate(.15deg) scale(1); filter: blur(0) hue-rotate(var(--focus-hue)) saturate(1.08) brightness(1.08); opacity: 1; }
  74% { transform: translate3d(.85%, -.25%, 0) rotate(1.1deg) scale(.988); filter: blur(1.35px) hue-rotate(var(--focus-hue)) saturate(.9) brightness(.98); opacity: .9; }
  87% { transform: translate3d(.25%, 0, 0) rotate(.35deg) scale(.997); filter: blur(.25px) hue-rotate(var(--focus-hue)) saturate(1.04) brightness(1.05); opacity: .98; }
}
@keyframes iris-ring-drift-a { 0%, 100% { transform: rotate(-7deg) scaleY(.62) translateX(-1%); } 50% { transform: rotate(8deg) scaleY(.66) translateX(1.5%); } }
@keyframes iris-ring-drift-b { 0%, 100% { transform: rotate(12deg) scaleY(.66) translateX(1%); } 50% { transform: rotate(-10deg) scaleY(.61) translateX(-1.2%); } }
@keyframes iris-ring-drift-c { 0%, 100% { transform: rotate(-18deg) scaleY(.72); } 50% { transform: rotate(17deg) scaleY(.68); } }
@keyframes iris-scale-turn { to { transform: scaleY(.78) rotate(360deg); } }
@keyframes iris-scale-counter-turn { to { transform: rotate(-360deg); } }
@keyframes iris-reticle-lock { 0%, 100% { transform: translate3d(-1.8%, .5%, 0) scale(.88); opacity: .42; } 22%, 68% { transform: translate3d(0, 0, 0) scale(1); opacity: .96; } 76% { transform: translate3d(1.2%, -.3%, 0) scale(.93); opacity: .62; } 88% { transform: translate3d(.2%, 0, 0) scale(.99); opacity: .9; } }

/* Voice-first surface: the live Cortex keeps one deliberate control. The
   protected settings surface remains reachable by tapping the Cortex itself. */
.dashboard-commandbar, .mission-strip { display: none !important; }
.command-deck .hud-panel-actions, .command-deck .cortex-access { display: none !important; }
.command-deck .cortex-access { display: inline-flex !important; position: absolute; right: 18px; top: 18px; z-index: 4; min-height: 34px; padding: 8px 12px; border: 1px solid rgba(129, 232, 255, .45); border-radius: 9px; color: var(--cyan); background: rgba(5, 18, 38, .78); font-size: 10px; letter-spacing: .12em; }
.command-deck .hud-bottom-rail { grid-template-columns: 1fr; justify-items: center; min-height: 62px; padding-top: 10px; }
.command-deck .hud-rail-label, .command-deck .voice-session-feedback { display: none; }
.command-deck .hud-command-controls { display: grid; justify-items: center; gap: 6px; }
.command-deck .hud-command-controls .state-buttons { margin: 0; }
.command-deck .hud-command-controls .state-buttons #voice-stop { min-height: 42px; padding: 10px 18px; border-color: rgba(117, 237, 255, .62); background: rgba(5, 43, 66, .76); box-shadow: 0 0 20px rgba(42, 219, 238, .18); font-size: 10px; }
.command-deck .hud-command-controls #voice-status { margin: 0; min-height: 13px; font-size: 8px; }

/* The authenticated mobile Command Deck is a single-screen control surface.
   Settings remain independently scrollable inside their fixed overlay. */
@media (max-width: 820px), (max-width: 950px) and (max-height: 600px) {
  body.dashboard-active { height: 100vh; height: 100dvh; overflow: hidden; overscroll-behavior: none; }
  body.dashboard-active .shell { width: 100%; height: 100vh; height: 100dvh; padding: max(6px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left)); overflow: hidden; }
  body.dashboard-active .shell > header { display: none; }
  body.dashboard-active #dashboard { height: 100%; min-height: 0; }
  body.dashboard-active .command-deck { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: 100%; height: 100%; min-height: 0; padding: 10px; border-radius: 14px; }
  body.dashboard-active .command-deck::after { display: none; }
  body.dashboard-active .command-deck .cortex-access { top: 8px; right: 8px; min-height: 36px; padding: 7px 9px; font-size: 8px; }
  body.dashboard-active .hud-topbar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; min-height: 0; padding: 0 0 7px; text-align: left; }
  body.dashboard-active .hud-brand { justify-items: start; min-width: 0; padding-right: 112px; }
  body.dashboard-active .hud-brand strong { overflow: hidden; max-width: 100%; font-size: clamp(19px, 7vw, 27px); letter-spacing: .16em; text-overflow: ellipsis; white-space: nowrap; }
  body.dashboard-active .hud-brand small, body.dashboard-active .hud-eyebrow, body.dashboard-active .hud-clock { display: none; }
  body.dashboard-active .hud-state-track { order: initial; justify-content: space-between; gap: 2px; width: 100%; font-size: 6px; letter-spacing: .03em; }
  body.dashboard-active .hud-state-track i { flex: 1 1 12px; width: auto; max-width: 26px; }
  body.dashboard-active .hud-step { min-width: 40px; gap: 2px; }
  body.dashboard-active .hud-step b { width: 16px; height: 16px; font-size: 6px; }
  body.dashboard-active .hud-stage { display: grid; grid-template: "iris" minmax(0, 1fr) / minmax(0, 1fr); place-items: center; min-height: 0; height: 100%; padding: 0; overflow: hidden; }
  body.dashboard-active .hud-panel { display: none; }
  body.dashboard-active .iris-stage { grid-area: iris; width: min(94vw, calc(100dvh - 154px)); max-width: 100%; max-height: 100%; margin: 0; aspect-ratio: 1; }
  body.dashboard-active .iris-readout { bottom: 18%; font-size: 6px; }
  body.dashboard-active .iris-readout b { font-size: 8px; }
  body.dashboard-active .iris-caption { bottom: 2%; gap: 2px; }
  body.dashboard-active .iris-caption strong { font-size: 10px; letter-spacing: .22em; }
  body.dashboard-active .iris-caption span { max-width: 78vw; overflow: hidden; font-size: 6px; letter-spacing: .1em; text-overflow: ellipsis; white-space: nowrap; }
  body.dashboard-active .hud-bottom-rail { display: grid; grid-template-columns: 1fr; gap: 4px; min-height: 58px; padding: 6px 0 0; text-align: center; }
  body.dashboard-active .command-deck .hud-command-controls { gap: 3px; width: 100%; }
  body.dashboard-active .command-deck .hud-command-controls .state-buttons { width: 100%; flex-wrap: nowrap; }
  body.dashboard-active .command-deck .hud-command-controls .state-buttons #voice-stop { flex: 0 1 min(280px, 82vw); min-height: 44px; padding: 8px 14px; font-size: 9px; }
  body.dashboard-active .command-deck .hud-command-controls #voice-status { max-width: 92vw; overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
}