:root{
  --bg:#04060B; --surface:rgba(255,255,255,.035); --line:rgba(255,255,255,.08);
  --text:#E8ECF5; --muted:#8A93A8; --cyan:#7FE7FF; --gold:#E3C27E; --warn:#FFB86B; --crit:#FF6B6B;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Alexandria,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body{min-height:100dvh;overflow-x:hidden}
.grid-bg{position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(127,231,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(127,231,255,.035) 1px,transparent 1px);background-size:28px 28px}
.screen{position:relative;max-width:520px;margin:0 auto;padding:max(24px,env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px;min-height:100dvh}
[hidden]{display:none!important}
#login{align-items:center;text-align:center}#login form{width:100%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.muted{color:var(--muted);font-weight:300}.sm{font-size:13px}.xs{font-size:11px}
.stack{display:flex;flex-direction:column;gap:12px}.stack.tight{gap:4px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.center{text-align:center}
.brand{font-size:30px;font-weight:800;letter-spacing:1px;margin:0}.brand.sm{font-size:24px}
h1{font-size:20px;margin:0;font-weight:800}h2{font-size:18px;margin:0;font-weight:600}h3{margin:0;font-size:15px}
.mono{font-family:'JetBrains Mono',monospace}.big{font-size:22px;font-weight:600}.warn{color:var(--warn)}.gold{color:var(--gold)}
.err{color:var(--crit);min-height:1em;margin:0}
a{color:var(--cyan)}

.top{display:flex;justify-content:space-between;align-items:center}
.live-pill{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(127,231,255,.25);border-radius:999px;background:rgba(127,231,255,.06);font-size:12px;color:#BFEFFF}
.dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:blink 1.6s ease-in-out infinite}
.live-pill.bad{border-color:rgba(255,107,107,.4);background:rgba(255,107,107,.08);color:#FFB3B3}.live-pill.bad .dot{background:var(--crit);box-shadow:0 0 10px var(--crit)}

.orb-wrap{position:relative;height:260px;display:flex;align-items:center;justify-content:center}
.orb-wrap.small{height:200px;margin-top:40px}
.orb-wrap .pulse{position:absolute;width:150px;height:150px;border-radius:50%;border:1px solid rgba(127,231,255,.5);animation:pulse 3.2s ease-out infinite}
.orb-wrap .pulse.p2{border-color:rgba(201,161,90,.45);animation-delay:1.6s}
.orb-wrap svg{position:absolute}.ring1{animation:spin 14s linear infinite}.ring2{animation:spin 22s linear infinite reverse}
.core{width:128px;height:128px;border-radius:50%;position:relative;overflow:hidden;background:radial-gradient(circle at 38% 32%,#DDFBFF 0%,#6FD8F2 18%,#1C5D8C 48%,#0A1A33 74%,#04060B 100%);box-shadow:0 0 60px rgba(111,216,242,.45),0 0 140px rgba(28,93,140,.5),inset 0 0 30px rgba(255,255,255,.15);animation:breath 4.5s ease-in-out infinite}
.scan{position:absolute;left:0;right:0;height:2px;top:50%;background:rgba(221,251,255,.8);box-shadow:0 0 12px #DDFBFF;animation:scan 3.8s ease-in-out infinite}
.orb-wrap.alarm .core{background:radial-gradient(circle at 38% 32%,#FFE3E3 0%,#FF8A8A 20%,#8C1C2C 52%,#330A10 76%,#04060B 100%);box-shadow:0 0 60px rgba(255,107,107,.45),0 0 140px rgba(140,28,44,.5)}
.orb-wrap.alarm .pulse{border-color:rgba(255,107,107,.6)}

.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.tile{padding:14px 12px;border-radius:16px;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.top-alert{display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:18px;text-decoration:none;color:var(--text);border:1px solid rgba(255,107,107,.35);background:linear-gradient(90deg,rgba(255,107,107,.12),rgba(255,107,107,.03))}
.top-alert.important{border-color:rgba(255,184,107,.35);background:linear-gradient(90deg,rgba(255,184,107,.1),rgba(255,184,107,.02))}
.top-alert small{font-size:11px;color:#FF9B9B;font-weight:600}.top-alert.important small{color:#FFD1A1}
.top-alert strong{font-size:14px;font-weight:600;line-height:1.6}
.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:auto}
.tab{display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--text);text-decoration:none;font-size:13px}
.tab b{font-family:'JetBrains Mono',monospace;color:var(--crit)}

.bar{display:flex;align-items:center;justify-content:space-between}
.icon-btn{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer}
.filters{display:flex;gap:8px}
.chip{flex:1;min-height:44px;border-radius:12px;font-family:inherit;font-size:13px;cursor:pointer;border:1px solid var(--line);background:var(--surface);color:#AEB6C8}
.chip.active.c-critical{border-color:rgba(255,107,107,.45);background:rgba(255,107,107,.12);color:#FFB3B3}
.chip.active.c-important{border-color:rgba(255,184,107,.35);background:rgba(255,184,107,.08);color:#FFD1A1}
.chip.active.c-normal{border-color:rgba(127,231,255,.3);background:rgba(127,231,255,.06);color:#BFEFFF}
.list{display:flex;flex-direction:column;gap:12px}
.alert{border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);background:var(--surface);animation:in .5s ease-out both}
.alert.critical{background:#12090C;border-color:rgba(255,107,107,.4);animation:in .5s ease-out both,glow 2.4s ease-in-out infinite}
.alert.important{background:rgba(255,184,107,.05);border-color:rgba(255,184,107,.22)}
.alert.acked{opacity:.65}.alert.resolved{opacity:.45}
.alert .meta{font-size:11px;font-weight:600;color:#8A93A8}.alert.critical .meta{color:#FF9B9B}.alert.important .meta{color:#FFD1A1}
.alert .t{font-size:15px;font-weight:600;line-height:1.6}
.alert .d{font-size:12px;color:#AEB6C8;line-height:1.7}
.empty{text-align:center;color:var(--muted);padding:40px 0}

.btn{min-height:48px;padding:0 18px;border-radius:14px;font-family:inherit;font-size:14px;cursor:pointer;border:1px solid var(--line);background:var(--surface);color:var(--text)}
.btn.primary{background:var(--text);color:var(--bg);border:0;font-weight:600}
.btn.ghost{background:transparent}
.btn.sm{min-height:40px;font-size:13px}
input,select{min-height:48px;padding:0 16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);font-family:inherit;font-size:15px}
input[type=number]{width:76px;min-height:40px;padding:0 10px;text-align:center}
label{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:#C9D0DE}
.card{padding:18px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}

.report{display:flex;flex-direction:column;gap:14px}
.report h2{font-size:17px}.report section{padding:16px;border-radius:18px;background:var(--surface);border:1px solid var(--line);animation:in .5s ease-out both}
.report ul{margin:8px 0 0;padding-inline-start:18px;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.8}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes breath{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes pulse{0%{transform:scale(.6);opacity:.7}100%{transform:scale(1.9);opacity:0}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes scan{0%{transform:translateY(-60px);opacity:0}20%{opacity:.6}100%{transform:translateY(60px);opacity:0}}
@keyframes in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes glow{0%,100%{box-shadow:0 0 0 rgba(255,107,107,0)}50%{box-shadow:0 0 26px rgba(255,107,107,.3)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important}}
@media print{.grid-bg,.bar,.row,#home,#alerts,#settings{display:none!important}body{background:#fff;color:#000}.report section{border-color:#ccc;background:#fff}}

.talk-row{display:flex;gap:12px;align-items:center}
.talk-btn{width:64px;height:64px;flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#DDFBFF,#3BB3D6 55%,#12476E);box-shadow:0 0 30px rgba(111,216,242,.5)}
.ask{flex:1;display:flex;align-items:center;min-height:56px;padding:0 18px;border-radius:28px;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--muted);text-decoration:none;font-size:13px}
.msgs{flex:1;display:flex;flex-direction:column;gap:10px;overflow-y:auto;padding-bottom:90px}
.msg{max-width:86%;padding:12px 14px;border-radius:18px;font-size:14px;line-height:1.8;white-space:pre-wrap;animation:in .35s ease-out both}
.msg.user{align-self:flex-start;background:#E8ECF5;color:#04060B;border-bottom-right-radius:6px}
.msg.assistant{align-self:flex-end;background:var(--surface);border:1px solid rgba(127,231,255,.18);border-bottom-left-radius:6px}
.msg.thinking{color:var(--cyan)}.msg.thinking::after{content:'…';animation:blink 1s infinite}
.msg .via{display:block;font-size:10px;color:var(--muted);margin-top:4px}
.composer{position:fixed;bottom:0;left:0;right:0;max-width:520px;margin:0 auto;display:flex;gap:10px;align-items:flex-end;padding:12px 18px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg) 30%)}
.composer textarea{flex:1;min-height:52px;max-height:140px;padding:14px 16px;border-radius:26px;border:1px solid var(--line);background:#0B0F18;color:var(--text);font-family:inherit;font-size:15px;resize:none}
.send{width:52px;height:52px;flex-shrink:0;border-radius:50%;border:0;background:var(--cyan);cursor:pointer;display:flex;align-items:center;justify-content:center}
.voice{align-items:center;text-align:center;background:radial-gradient(ellipse at 50% 38%,#0B2236 0%,transparent 60%)}
.kicker{font-size:12px;letter-spacing:3px;color:var(--cyan);margin-top:30px}
.orb-wrap.big{height:300px;width:100%}
.orb-wrap.big .core{width:140px;height:140px}
.orb-wrap .pulse.p3{animation-delay:.8s}
.orb-wrap.listening .core{animation:breath 1.2s ease-in-out infinite}
.orb-wrap.thinking .ring1{animation-duration:2.5s}
.orb-wrap.speaking .core{animation:breath .8s ease-in-out infinite}
.bars{display:flex;gap:5px;height:44px;align-items:center;opacity:.25;transition:opacity .3s}
.bars.on{opacity:1}
.bars i{width:4px;height:40px;border-radius:2px;background:var(--cyan);transform:scaleY(.25)}
.bars i.g{background:var(--gold)}
.bars.on i{animation:wave 1.1s ease-in-out infinite}
.bars.on i:nth-child(2){animation-delay:.15s}.bars.on i:nth-child(3){animation-delay:.3s}.bars.on i:nth-child(4){animation-delay:.45s}.bars.on i:nth-child(5){animation-delay:.6s}.bars.on i:nth-child(6){animation-delay:.75s}.bars.on i:nth-child(7){animation-delay:.9s}
.v-status{font-size:16px;font-weight:600;margin:0}
.v-said{max-width:340px;font-size:15px;line-height:1.8;color:#C9D0DE;min-height:3em;margin:0}
.v-actions{display:flex;gap:26px;align-items:center;margin-top:auto;padding-bottom:20px}
.round{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:var(--text);cursor:pointer}
.round.go{width:76px;height:76px;border:0;background:radial-gradient(circle at 35% 30%,#DDFBFF,#3BB3D6 55%,#12476E);box-shadow:0 0 30px rgba(111,216,242,.5)}
.round.end{width:76px;height:76px;border:0;background:#E5484D;box-shadow:0 0 30px rgba(229,72,77,.5)}
.round.ghost.on{background:rgba(255,184,107,.15);border-color:rgba(255,184,107,.4)}
.mem{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.mem li{display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:13px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
.mem button{min-height:36px;border-radius:10px;border:1px solid var(--line);background:transparent;color:var(--muted);font-family:inherit;cursor:pointer}
@keyframes wave{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}