/* ACIP control room — styles ported from the ControlRoomSky design board (navy wall, light-blue
   accents, electric gauge), plus the controls the live app needs: forms, dialogs, toasts. */
@font-face{font-family:"DIN Next";src:url(/assets/din-next-300.otf) format("opentype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"DIN Next";src:url(/assets/din-next-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"DIN Next";src:url(/assets/din-next-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  --page:#0A1424; --ink:#ECF1F9; --ink2:#C2C8CF; --ink3:#AAAFB7; --ink4:#8E939A;
  --acc:#9ED1F3; --acc-deep:#67B2E2; --acc-light:#C8E8FE; --acc-grad:linear-gradient(135deg,#C8E8FE,#9ED1F3 55%,#67B2E2);
  --steel:#9CB9DA; --sky:#B3CAE3; --red:#E87460; --amber:#FDAC67; --green:#7FBF9A;
  --line:rgba(154,184,217,.16); --line2:rgba(154,184,217,.25);
}
html,body{margin:0;height:100%;overflow:hidden;background:var(--page)}
#stage{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}
#board{flex:none;width:1536px;height:1024px;transform-origin:50% 50%}

a{color:#B3CAE3}a:hover{color:#D9DFE6}
.pg{position:relative;width:1536px;height:1024px;overflow:hidden;background:#0A1424;color:#ECF1F9;font-family:"DIN Next","Barlow",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.pg *{box-sizing:border-box}
.pg button{font-family:inherit;font-size:inherit;color:inherit;margin:0}
.pg input,.pg textarea,.pg select{font-family:inherit}
.pg img{display:block}
.pg p,.pg h1,.pg h2,.pg h3{margin:0}
.pg :focus-visible{outline:2px solid #9ED1F3;outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mono{font-family:"Geist Mono","JetBrains Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.cap{font-family:"Geist Mono","JetBrains Mono",ui-monospace,monospace;font-size:11px;line-height:14px;letter-spacing:.12em;text-transform:uppercase;color:#A0A5AC}
.small{font-size:13px;line-height:17px;color:#AAAFB7}
.sky{color:#B3CAE3}
.gold{color:#9ED1F3}
.muted{color:#8E939A}
.grain{position:absolute;left:0;top:0;width:1536px;height:1024px;z-index:40;pointer-events:none;background:url(/assets/grain.png) 0 0/256px 256px repeat;mix-blend-mode:overlay;opacity:.1}
.wing{position:absolute;top:200px;width:420px;height:760px;z-index:3;border-radius:36px}.wing>*{transition:opacity .3s}.wing.under>*{opacity:0;pointer-events:none}
.ask{position:absolute;left:768px;top:934px;transform:translateX(-50%);z-index:7;height:52px;width:138px;padding:0 6px 0 16px;border-radius:26px;border:1px solid rgba(170,195,226,.2);background:#142037;color:#ECF1F9;display:flex;align-items:center;gap:10px;overflow:hidden;white-space:nowrap;cursor:pointer;box-shadow:0 16px 32px -18px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06);transition:width .5s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s}
.ask:hover,.ask:focus-visible,.ask.on{width:420px;border-color:rgba(158,209,243,.45);box-shadow:0 18px 36px -18px rgba(0,0,0,.75),0 0 0 4px rgba(158,209,243,.06),inset 0 1px 0 rgba(255,255,255,.08)}
.askIc{width:22px;height:22px;flex:none;fill:#9ED1F3}
.askLbl{flex:1 1 auto;text-align:left;font-size:15px;color:#C2C8CF}
.askHint{opacity:0;transition:opacity .25s}
.ask:hover .askHint,.ask:focus-visible .askHint,.ask.on .askHint{opacity:.55;transition-delay:.15s}
.askMore{display:flex;gap:6px;flex:none;opacity:0;transform:translateX(10px);transition:opacity .2s,transform .35s cubic-bezier(.2,.8,.2,1)}
.ask:hover .askMore,.ask:focus-visible .askMore,.ask.on .askMore{opacity:1;transform:none;transition-delay:.15s}
.askMore .round{width:40px;height:40px}
.bigIco{position:absolute;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#9ED1F3;background:radial-gradient(circle at 34% 28%,rgba(158,209,243,.28),rgba(158,209,243,.05) 72%);box-shadow:inset 0 0 0 1px rgba(158,209,243,.28),0 0 26px rgba(158,209,243,.12)}
.bigIco svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.platIco{position:absolute;right:16px;top:16px;width:50px;height:50px;fill:#FFFFFF;opacity:.92;filter:drop-shadow(0 6px 14px rgba(0,0,0,.35))}
.pIco{position:absolute;left:10px;top:10px;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(16,28,46,.6);box-shadow:inset 0 0 0 1px var(--edge)}
.pIco svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tile{position:absolute;padding:0;margin:0;border:1px solid rgba(170,195,226,.16);border-radius:20px;background:rgba(17,28,47,.64);backdrop-filter:blur(8px) saturate(120%);-webkit-backdrop-filter:blur(8px) saturate(120%);color:inherit;text-align:left;cursor:pointer;transition:background-color .25s,border-color .25s,box-shadow .25s}
.tile:hover{background:rgba(28,44,70,.74);border-color:rgba(156,185,218,.45);box-shadow:0 0 24px rgba(156,185,218,.18)}
.bar{position:absolute;bottom:0;width:30px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,rgba(64,84,112,.5),rgba(30,44,66,.4));box-shadow:inset 0 2px 0 rgba(160,185,215,.45)}
.barHi{background:repeating-linear-gradient(135deg,rgba(156,185,218,.8) 0 2px,rgba(156,185,218,.16) 2px 7px);box-shadow:inset 0 3px 0 #BFD2E7,0 0 22px rgba(156,185,218,.45)}
.tip{position:absolute;background:#152235;border:1px solid rgba(154,184,217,.3);border-radius:12px;padding:8px 12px;box-shadow:0 14px 30px -12px rgba(0,0,0,.7);white-space:nowrap}
.sq{position:absolute;border:0;padding:16px 18px;border-radius:20px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow:hidden;text-align:left;cursor:pointer;color:#FFFFFF;box-shadow:0 18px 36px -20px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.22),inset 0 0 0 1px rgba(255,255,255,.08);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.sq:hover{transform:translateY(-3px)}
.plate{position:absolute;border-radius:40px;background:linear-gradient(180deg,rgba(17,28,47,.62) 0%,rgba(17,28,47,.62) 44%,var(--tint) 100%);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--edge);box-shadow:inset 0 -18px 28px -16px var(--glow),0 16px 30px -20px var(--glow);overflow:hidden}
.ticks{position:absolute;left:26px;right:26px;top:50%;height:10px;margin-top:-5px;background:repeating-linear-gradient(90deg,var(--edge) 0 2px,transparent 2px 7px)}
.track{position:absolute;display:flex;gap:4px;padding:4px;border-radius:26px;background:#0D1729;border:1px solid rgba(170,195,226,.16);box-shadow:0 10px 24px -14px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.05)}
.tab{height:40px;padding:0 14px;border:0;border-radius:20px;background:transparent;color:#C2C8CF;font-size:15px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;transition:background-color .25s,color .25s,box-shadow .25s}
.tab:hover{background:rgba(156,185,218,.12);color:#FFFFFF}
.tab.on{background:linear-gradient(135deg,#C8E8FE,#9ED1F3 55%,#67B2E2);color:#0B1729;box-shadow:0 10px 22px -10px rgba(158,209,243,.8),inset 0 1px 0 rgba(255,255,255,.5)}
.tabDot{width:7px;height:7px;border-radius:50%;background:#E87460;box-shadow:0 0 0 3px rgba(232,116,96,.22)}
.tabCount{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#E87460;color:#fff;font-size:11px;line-height:18px;font-weight:500;text-align:center}
.tab.on .tabCount{background:#0B1729;color:#9ED1F3}
.round{width:44px;height:44px;border-radius:22px;border:0;padding:0;background:rgba(255,255,255,.07);color:#ECF1F9;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none;transition:background-color .2s}
.round:hover{background:rgba(156,185,218,.18)}
.round.sm{width:34px;height:34px;border-radius:17px}
.go{background:linear-gradient(135deg,#C8E8FE,#9ED1F3 55%,#67B2E2);color:#0B1729;box-shadow:0 10px 22px -10px rgba(158,209,243,.8)}
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic.sm{width:16px;height:16px}
.arcPulse{stroke-dasharray:26 900;animation:arc 7s linear infinite}
.panel{position:absolute;top:240px;width:420px;height:680px;z-index:9;border-radius:36px;background:linear-gradient(165deg,#182740,#0F1A2D);border:1px solid rgba(170,195,226,.22);box-shadow:0 40px 90px -30px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.08);animation-duration:.6s;animation-timing-function:cubic-bezier(.2,0,0,1);animation-fill-mode:both}
.panel.L{left:24px;transform-origin:100% 50%;animation-name:swingL}
.panel.R{left:1092px;transform-origin:0% 50%;animation-name:swingR}
.panel.L.out{animation-name:swingLOut;animation-duration:.32s;animation-timing-function:cubic-bezier(.4,0,.9,.6)}
.panel.R.out{animation-name:swingROut;animation-duration:.32s;animation-timing-function:cubic-bezier(.4,0,.9,.6)}
.panelIn{position:absolute;left:0;top:0;width:420px;height:680px;animation:fade .25s .18s both}
.out .panelIn{animation:fadeOut .1s both}
.ph{position:absolute;left:24px;top:28px;right:76px;font-size:24px;line-height:28px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phSub{position:absolute;left:24px;top:58px;right:76px;font-size:12px;color:#8E939A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.px{position:absolute;right:20px;top:20px}
.pback{position:absolute;right:72px;top:20px}
.pbody{position:absolute;left:0;right:0;top:84px;bottom:0;overflow-y:auto;overflow-x:hidden;padding:0 18px 28px}
.pbody.withFoot{bottom:88px}
.pfoot{position:absolute;left:0;right:0;bottom:0;height:88px;padding:0 24px;display:flex;align-items:center;gap:10px;border-top:1px solid rgba(154,184,217,.1)}
.row{display:flex;align-items:center;gap:12px;width:100%;height:72px;padding:0 12px;border:1px solid transparent;border-radius:18px;background:transparent;text-align:left;cursor:pointer;transition:background-color .2s,border-color .2s;color:inherit}
.row:hover{background:rgba(156,185,218,.07)}
.row.on{background:rgba(158,209,243,.1);border-color:rgba(158,209,243,.45)}
.kid{position:relative;width:188px;height:78px;border-radius:26px;background:rgba(255,255,255,.04);border:1px solid rgba(154,184,217,.2);overflow:hidden;padding:14px 12px 0 60px;text-align:left;cursor:pointer;color:inherit;transition:border-color .2s,background-color .2s;flex:none}
.kid:hover{border-color:rgba(158,209,243,.5);background:rgba(158,209,243,.06)}
.kid.on{border-color:rgba(158,209,243,.7);background:rgba(158,209,243,.1)}
.kid.ghost{border-style:dashed;background:transparent}
.kidBadge{position:absolute;left:12px;top:16px;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#0B1729;font-size:13px;font-weight:500}
.kidBadge svg{width:20px;height:20px;fill:#0B1729}
.folder{position:relative;width:186px;height:156px;border:0;padding:0;background:transparent;cursor:pointer;text-align:left;flex:none}
.fBack{position:absolute;left:0;top:16px;width:186px;height:140px;border-radius:22px;background:linear-gradient(160deg,#BEE3FD,#9ED1F3 45%,#2488BE);box-shadow:0 20px 34px -18px rgba(158,209,243,.6),inset 0 1px 0 rgba(255,255,255,.5)}
.fTab{position:absolute;left:0;top:0;width:82px;height:36px;border-radius:16px 16px 0 0;background:linear-gradient(160deg,#C8E8FE,#9ED1F3)}
.fMedia{position:absolute;width:98px;height:66px;border-radius:12px;overflow:hidden;box-shadow:0 8px 16px -8px rgba(0,0,0,.6);transition:transform .4s cubic-bezier(.2,.8,.2,1);background:#1B2B46}
.fMedia img{width:98px;height:66px;object-fit:cover}
.fFront{position:absolute;left:0;top:62px;width:186px;height:94px;border-radius:22px;background:linear-gradient(170deg,rgba(40,54,74,.72),rgba(12,24,42,.86));backdrop-filter:blur(10px) saturate(140%);-webkit-backdrop-filter:blur(10px) saturate(140%);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.22),inset 0 -20px 30px -20px rgba(158,209,243,.45);padding:12px 14px 0}
.folder:hover .fm0{transform:translate(-8px,-22px) rotate(-9deg)}
.folder:hover .fm1{transform:translate(8px,-26px) rotate(8deg)}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:12px;font-size:12px;font-weight:500;white-space:nowrap}
.crit{background:rgba(232,116,96,.16);color:#F1A497;border:1px solid rgba(232,116,96,.4)}
.high{background:rgba(253,172,103,.14);color:#FEC699;border:1px solid rgba(253,172,103,.4)}
.medium{background:rgba(158,209,243,.12);color:#C8E8FE;border:1px solid rgba(158,209,243,.35)}
.low{background:rgba(154,184,217,.1);color:#C2C8CF;border:1px solid rgba(154,184,217,.28)}
.okc{background:rgba(127,191,154,.14);color:#A9DDBF;border:1px solid rgba(127,191,154,.4)}
.cta{height:48px;padding:0 22px;border:0;border-radius:24px;background:linear-gradient(135deg,#C8E8FE,#9ED1F3 55%,#67B2E2);color:#0B1729;font-size:15px;font-weight:500;cursor:pointer;box-shadow:0 14px 26px -12px rgba(158,209,243,.7);display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}
.cta:disabled{opacity:.5;cursor:default}
.sugg{height:42px;padding:0 16px;border-radius:21px;border:1px solid rgba(154,184,217,.3);background:rgba(255,255,255,.04);color:#ECF1F9;font-size:14px;cursor:pointer;transition:background-color .2s;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.sugg:hover{background:rgba(156,185,218,.12)}
a.sugg,a.cta{text-decoration:none}
.sugg:disabled{opacity:.5;cursor:default}
.sugg.danger{border-color:rgba(232,116,96,.45);color:#F1A497}
.sugg.danger:hover{background:rgba(232,116,96,.12)}
.sugg.sm{height:34px;padding:0 12px;font-size:13px;border-radius:17px}
.pg .cta,.pg .go{color:#0B1729}
.egPulse{stroke-dasharray:26 900;stroke-dashoffset:26;opacity:.85;animation:egRun 3.4s cubic-bezier(.45,0,.2,1) infinite}
@keyframes egRun{0%{stroke-dashoffset:26;opacity:0}12%{opacity:.85}85%{opacity:.85}100%{stroke-dashoffset:var(--egEnd);opacity:0}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes fadeOut{from{opacity:1}to{opacity:0}}
@keyframes swingL{from{transform:perspective(1500px) rotateY(18deg) translateZ(-60px);opacity:.3}to{transform:perspective(1500px) rotateY(0deg) translateZ(0);opacity:1}}
@keyframes swingR{from{transform:perspective(1500px) rotateY(-18deg) translateZ(-60px);opacity:.3}to{transform:perspective(1500px) rotateY(0deg) translateZ(0);opacity:1}}
@keyframes swingLOut{from{transform:perspective(1500px) rotateY(0deg) translateZ(0);opacity:1}to{transform:perspective(1500px) rotateY(18deg) translateZ(-60px);opacity:0}}
@keyframes swingROut{from{transform:perspective(1500px) rotateY(0deg) translateZ(0);opacity:1}to{transform:perspective(1500px) rotateY(-18deg) translateZ(-60px);opacity:0}}
@keyframes ring{0%{transform:scale(.4);opacity:.9}100%{transform:scale(1.5);opacity:0}}
@keyframes arc{from{stroke-dashoffset:926}to{stroke-dashoffset:0}}
@keyframes live{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes spin{to{transform:rotate(360deg)}}
.still *,.still *::before,.still *::after{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){.pg *,.pg *::before,.pg *::after{animation:none!important;transition:none!important}}

/* ---------- live app additions ---------- */
.scroll{scrollbar-width:thin;scrollbar-color:rgba(154,184,217,.3) transparent}
.scroll::-webkit-scrollbar{width:8px}.scroll::-webkit-scrollbar-thumb{background:rgba(154,184,217,.25);border-radius:4px}
.hdrNew{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px 0 14px;border-radius:22px;border:0;cursor:pointer;background:linear-gradient(135deg,#C8E8FE,#9ED1F3 55%,#67B2E2);color:#0B1729!important;font-size:15px;font-weight:500;box-shadow:0 12px 26px -12px rgba(158,209,243,.8),inset 0 1px 0 rgba(255,255,255,.5);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.hdrNew:hover{transform:translateY(-1px)}
.hdrNew .ic{stroke-width:2.2}
.liveDot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#7FBF9A;box-shadow:0 0 0 3px rgba(127,191,154,.2)}
.liveDot.off{background:#E87460;box-shadow:0 0 0 3px rgba(232,116,96,.2)}
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;color:#8E939A;font-size:13px;line-height:18px}
.empty b{color:#C2C8CF;font-weight:500;font-size:14px}
.ghostPlate{position:absolute;border-radius:40px;border:1px dashed rgba(154,184,217,.22);color:#8E939A;font-size:13px;display:flex;align-items:center;padding:0 22px;gap:10px}

/* forms */
.form{display:flex;flex-direction:column;gap:14px}
.fld{display:flex;flex-direction:column;gap:6px;position:relative}
.fld>label,.lbl{font-family:"Geist Mono","JetBrains Mono",ui-monospace,monospace;font-size:11px;line-height:14px;letter-spacing:.12em;text-transform:uppercase;color:#A0A5AC}
.fld .req{color:#9ED1F3;margin-left:3px}
.inp{width:100%;height:44px;padding:0 14px;border-radius:14px;border:1px solid rgba(154,184,217,.25);background:rgba(255,255,255,.045);color:#ECF1F9;font-size:15px;outline:0;transition:border-color .2s,box-shadow .2s,background-color .2s}
.inp::placeholder{color:#6F7782}
.inp:focus{border-color:rgba(158,209,243,.7);box-shadow:0 0 0 4px rgba(158,209,243,.1);background:rgba(255,255,255,.06)}
.inp.bad{border-color:rgba(232,116,96,.7)}
textarea.inp{height:auto;min-height:88px;padding:11px 14px;line-height:21px;resize:vertical}
select.inp{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%239ED1F3' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
select.inp option{background:#13213A;color:#ECF1F9}
input[type=date].inp,input[type=datetime-local].inp,input[type=time].inp{color-scheme:dark}
.ferr{font-size:12px;line-height:16px;color:#F1A497}
.fhint{font-size:12px;line-height:16px;color:#8E939A}
.formErr{padding:10px 14px;border-radius:14px;background:rgba(232,116,96,.12);border:1px solid rgba(232,116,96,.4);color:#F5C2B9;font-size:13px;line-height:18px}
.formOk{padding:10px 14px;border-radius:14px;background:rgba(127,191,154,.12);border:1px solid rgba(127,191,154,.4);color:#BFE6CF;font-size:13px;line-height:18px}
.segs{display:flex;gap:4px;padding:4px;border-radius:18px;background:#0D1729;border:1px solid rgba(170,195,226,.16)}
.segs button{flex:1 1 0;height:36px;border:0;border-radius:14px;background:transparent;color:#C2C8CF;font-size:13px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background-color .2s,color .2s}
.segs button:hover{background:rgba(156,185,218,.12);color:#fff}
.segs button.on{background:var(--acc-grad);color:#0B1729}
.segs button.on.crit{background:linear-gradient(135deg,#F5B7AC,#E87460);color:#2B0E08;border:0}
.segs button.on.high{background:linear-gradient(135deg,#FFD5B4,#FDAC67);color:#2E1604;border:0}
.segs button .dot{width:7px;height:7px;border-radius:50%}
.combo{position:relative}
.comboList{position:absolute;left:0;right:0;top:48px;z-index:20;max-height:220px;overflow-y:auto;border-radius:16px;background:#13213A;border:1px solid rgba(154,184,217,.3);box-shadow:0 24px 40px -18px rgba(0,0,0,.8);padding:6px}
.comboList button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;height:38px;padding:0 10px;border:0;border-radius:10px;background:transparent;color:#ECF1F9;font-size:14px;text-align:left;cursor:pointer}
.comboList button:hover,.comboList button.on{background:rgba(158,209,243,.12)}
.comboList .sub{color:#8E939A;font-size:12px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.check{display:flex;align-items:center;gap:10px;font-size:14px;color:#C2C8CF;cursor:pointer}
.check input{width:18px;height:18px;accent-color:#9ED1F3}

/* cards and lists inside panels */
.card{border-radius:22px;background:rgba(255,255,255,.035);border:1px solid rgba(154,184,217,.16);padding:16px 18px}
.card+.card{margin-top:10px}
.kv{display:grid;grid-template-columns:118px 1fr;gap:8px 12px;font-size:14px;line-height:19px}
.kv dt{color:#8E939A;font-size:12px;line-height:19px}
.kv dd{margin:0;color:#ECF1F9;overflow-wrap:anywhere}
.sect{margin:20px 6px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.list{display:flex;flex-direction:column;gap:6px}
.item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(154,184,217,.12);color:inherit;text-align:left;width:100%}
button.item{cursor:pointer;transition:background-color .2s,border-color .2s}
button.item:hover{background:rgba(156,185,218,.07);border-color:rgba(156,185,218,.3)}
.item .grow{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:3px}
.item .t{font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .s{font-size:12px;color:#8E939A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#C8E8FE,#67B2E2);color:#0B1729;font-size:13px;font-weight:500;flex:none}
.av.sm{width:30px;height:30px;font-size:11px}
.av.off{background:rgba(154,184,217,.2);color:#C2C8CF}
.byline{font-size:12px;color:#8E939A;line-height:17px}
.byline b{color:#C2C8CF;font-weight:500}
.tl{position:relative;padding-left:18px}
.tl:before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:rgba(154,184,217,.18)}
.tl .ev{position:relative;padding:6px 0 10px;font-size:13px;line-height:18px;color:#C2C8CF}
.tl .ev:before{content:"";position:absolute;left:-17px;top:11px;width:9px;height:9px;border-radius:50%;background:#0F1A2D;border:2px solid #9ED1F3}
.tl .ev .when{display:block;font-size:11px;color:#8E939A}
.spin{width:18px;height:18px;border-radius:50%;border:2px solid rgba(158,209,243,.25);border-top-color:#9ED1F3;animation:spin .8s linear infinite;display:inline-block;flex:none}

/* overlay dialogs, menus and toasts (inside the scaled board) */
.dlgWrap{position:absolute;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;background:rgba(4,9,18,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:fade .2s both}
.dlg{width:460px;max-height:760px;overflow:auto;border-radius:28px;background:linear-gradient(165deg,#1A2A45,#101B2E);border:1px solid rgba(170,195,226,.25);box-shadow:0 40px 90px -30px rgba(0,0,0,.9);padding:26px 26px 22px}
.dlg h3{font-size:20px;line-height:26px;font-weight:500;margin-bottom:8px}
.dlg p{font-size:14px;line-height:21px;color:#C2C8CF;margin:0 0 14px}
.dlgBtns{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.menu{position:absolute;z-index:50;min-width:260px;border-radius:22px;background:#13213A;border:1px solid rgba(154,184,217,.3);box-shadow:0 30px 60px -24px rgba(0,0,0,.85);padding:8px;animation:fade .15s both}
.menu .mi{display:flex;align-items:center;gap:12px;width:100%;height:44px;padding:0 12px;border:0;border-radius:14px;background:transparent;color:#ECF1F9;font-size:14px;text-align:left;cursor:pointer}
.menu .mi:hover{background:rgba(158,209,243,.1)}
.menu .mi.danger{color:#F1A497}
.menu .mhead{padding:10px 12px 12px;border-bottom:1px solid rgba(154,184,217,.12);margin-bottom:6px}
.toasts{position:absolute;left:50%;top:84px;transform:translateX(-50%);z-index:70;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:center;gap:10px;max-width:640px;padding:12px 18px;border-radius:18px;background:#13213A;border:1px solid rgba(158,209,243,.35);box-shadow:0 20px 40px -20px rgba(0,0,0,.8);font-size:14px;color:#ECF1F9;animation:fade .2s both}
.toast.err{border-color:rgba(232,116,96,.5)}

/* sign-in */
.gate{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:20;width:420px;border-radius:32px;background:linear-gradient(165deg,rgba(26,42,69,.92),rgba(16,27,46,.94));border:1px solid rgba(170,195,226,.25);box-shadow:0 50px 100px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08);padding:32px 32px 28px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.gate h1{font-size:26px;line-height:32px;font-weight:500;margin-bottom:6px}
.gate .lead{font-size:14px;line-height:20px;color:#AAAFB7;margin-bottom:22px}

/* Arabic and English mixed freely: each paragraph takes the direction of its own text. */
.pg p,.pg li,.pg .bidi,.pg textarea.inp,.pg .tl .ev{unicode-bidi:plaintext;text-align:start}

/* Gaith presenting: the tile he talks about, his voice controls */
.gfocus{border-color:rgba(200,232,254,.85)!important;box-shadow:0 0 0 2px rgba(158,209,243,.55),0 0 34px rgba(158,209,243,.45),inset 0 0 24px rgba(158,209,243,.12)!important;animation:gfocus 1.6s ease-in-out infinite}
@keyframes gfocus{50%{box-shadow:0 0 0 2px rgba(158,209,243,.35),0 0 18px rgba(158,209,243,.25),inset 0 0 14px rgba(158,209,243,.08)}}
.pg.still .gfocus{animation:none}
.gaithCtl{position:absolute;left:1000px;top:940px;z-index:7;display:flex;align-items:center;gap:8px}
.gaithCtl .round{width:40px;height:40px;border:1px solid rgba(154,184,217,.3);background:#142037}
.gaithTap{height:40px;padding:0 16px 0 12px;border-radius:20px;border:1px solid rgba(158,209,243,.45);background:#142037;color:#ECF1F9;display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap}
@media (prefers-reduced-motion: reduce){.gfocus{animation:none}}

/* Profile: a monogram in place of a photo, stat tiles and case rows. */
.pfHero{display:flex;flex-direction:column;align-items:center;padding:24px 18px 20px;background:radial-gradient(120% 90% at 50% 0%,rgba(158,209,243,.14),rgba(255,255,255,.03) 62%)}
.pfMono{position:relative;width:104px;height:104px;border-radius:50%;padding:4px;background:conic-gradient(from 210deg,#4E9FE6,#8CCBFA,#E4F4FF,#8CCBFA,#4E9FE6);box-shadow:0 0 34px rgba(140,203,250,.35)}
.pfMonoIn{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 35% 28%,#22385A,#0F1A2D 72%);color:#E4F4FF;font-size:36px;font-weight:500;letter-spacing:.02em;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.pfMonoIn.off{color:#8E939A}
.pfOnline{position:absolute;right:6px;bottom:6px;width:18px;height:18px;border-radius:50%;background:#7FBF9A;box-shadow:0 0 0 4px #15233A,0 0 12px rgba(127,191,154,.7)}
.pfGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.pfStat{display:flex;flex-direction:column;gap:3px;min-width:0;padding:12px 12px 11px;border-radius:16px;background:rgba(255,255,255,.035);border:1px solid rgba(154,184,217,.14);text-align:left;color:inherit;font:inherit}
.pfStat .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pfStat.link{cursor:pointer;transition:background-color .2s,border-color .2s}
.pfStat.link:hover{background:rgba(158,209,243,.09);border-color:rgba(158,209,243,.35)}
.pfKey{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:5px;vertical-align:0}
.pfRow{display:flex;align-items:center;gap:12px;width:100%;padding:9px 8px;border:0;border-radius:14px;background:transparent;color:inherit;font:inherit;cursor:pointer;transition:background-color .2s}
.pfRow:hover{background:rgba(158,209,243,.08)}

/* forensic report (panels/report.js): viewer and checks left of Gaith, verdict right */
.rpStage{position:relative;display:flex;align-items:center;justify-content:center;background:#0B1424;border-radius:18px;overflow:hidden}
.rpChip{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:14px;background:rgba(11,20,36,.66);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:12px;font-weight:500;color:#ECF1F9;pointer-events:none}
.rpFull{position:absolute;right:12px;top:12px;width:30px;height:30px;border-radius:15px;display:inline-flex;align-items:center;justify-content:center;background:rgba(11,20,36,.66);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#ECF1F9}
.rpStrip{display:flex;gap:6px;margin-top:10px}
.rpTab{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;padding:6px 3px 7px;border-radius:16px;border:1px solid rgba(154,184,217,.16);background:rgba(255,255,255,.03);color:#C2C8CF;font-size:11px;cursor:pointer;transition:border-color .2s,background-color .2s,box-shadow .2s}
.rpTab:hover{border-color:rgba(158,209,243,.45);color:#ECF1F9}
.rpTab.on{border-color:rgba(158,209,243,.8);background:rgba(158,209,243,.1);color:#ECF1F9;box-shadow:0 0 0 3px rgba(158,209,243,.12),0 0 18px rgba(158,209,243,.18)}
.rpTab img,.rpTab .rpThumb{display:block;width:52px;height:52px;border-radius:12px;object-fit:cover;background:#1B2B46}
.rpLegend{margin:8px 6px 0;font-size:12px;line-height:17px;color:#AAAFB7;min-height:17px}
.rpRamp{display:inline-block;width:90px;height:6px;border-radius:3px}
.rpRamp.ela{background:linear-gradient(90deg,#3B1638,#E0457B,#FFB020)}
.rpSw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.rpGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.rpCheck{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid rgba(154,184,217,.14)}
.rpCheck.na{border-style:dashed;background:transparent}
.rpIco{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:11px}
.rpIco.ai{background:rgba(232,116,96,.16);color:#F1A497}
.rpIco.camera{background:rgba(158,209,243,.16);color:#9ED1F3}
.rpIco.info{background:rgba(158,209,243,.10);color:#C8E8FE}
.rpIco.neutral{background:rgba(154,184,217,.10);color:#9CB9DA}
.rpIco.amber{background:rgba(253,172,103,.14);color:#FEC699}
.rpIco.na{background:rgba(154,184,217,.05);color:#8E939A}
.rpVal{flex:none;font-size:11px;line-height:16px;padding:1px 7px;border-radius:8px;background:rgba(154,184,217,.1);color:#C2C8CF}
.rpVal.ai{background:rgba(232,116,96,.16);color:#F1A497}
.rpVal.camera{background:rgba(158,209,243,.16);color:#9ED1F3}
.rpVal.info{background:rgba(158,209,243,.10);color:#C8E8FE}
.rpVal.na{background:transparent;color:#8E939A}
.rpLink{align-self:flex-start;display:inline-flex;align-items:center;gap:2px;padding:0;border:0;background:none;color:#9ED1F3;font-size:12px;font-weight:500;cursor:pointer}
.rpLink:hover{color:#C8E8FE}
.rpRow{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:18px;border:1px solid rgba(154,184,217,.12);background:rgba(255,255,255,.03);color:inherit;text-align:left;cursor:pointer;transition:background-color .2s,border-color .2s}
.rpRow:hover{background:rgba(156,185,218,.07);border-color:rgba(156,185,218,.3)}
.rpVerdict{padding:4px 0 6px}
.rpFace{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:20px;background:rgba(255,255,255,.035);border:1px solid rgba(154,184,217,.14)}