/* ============================================================
   AEGIS // AltaySec Tycoon — Tehdit Operasyon Komuta Merkezi
   Fosfor-teal askeri SOC HUD · bağımlılıksız
   ============================================================ */
:root{
  --bg:#0d1322; --bg1:#101728; --bg2:#141d31;
  --panel:rgba(24,33,52,.72); --panel-solid:#161f33; --raised:#1b2740;
  --line:rgba(120,210,200,.13); --line2:rgba(120,210,200,.26);
  --ink:#eaf1f8; --muted:#9fb0c8; --dim:#74859e;
  --cyan:#27e0c4; --cyan-b:#6df3df; --cyan-d:#0f7a72;
  --amber:#ffb454; --red:#ff5d6c; --green:#46e3a0; --violet:#b69bff; --blue:#5cb0ff;
  --coral:#ff7a6b; --gold:#ffcb5c;
  --f-disp:"Chakra Petch",system-ui,"IBM Plex Mono",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --f-body:"Hanken Grotesk",system-ui,-apple-system,sans-serif;
  --glow-cyan:0 0 0 1px rgba(39,224,196,.28),0 0 22px rgba(39,224,196,.2);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  background:
    radial-gradient(1100px 620px at 82% -12%, rgba(39,224,196,.10), transparent 60%),
    radial-gradient(950px 600px at -6% 6%, rgba(255,203,92,.07), transparent 55%),
    radial-gradient(900px 560px at -10% 112%, rgba(255,122,107,.08), transparent 55%),
    radial-gradient(760px 520px at 55% 65%, rgba(92,176,255,.05), transparent 70%),
    var(--bg);
  color:var(--ink); font-family:var(--f-body); font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
/* atmosfer katmanları */
.fx{position:fixed;inset:0;pointer-events:none;z-index:0}
.fx.grid{opacity:.5;
  background-image:linear-gradient(rgba(90,200,190,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(90,200,190,.06) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 85%);mask-image:radial-gradient(circle at 50% 30%,#000,transparent 85%)}
.fx.scan{opacity:.5;background:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 2px,rgba(0,0,0,.18) 3px,rgba(0,0,0,0) 4px);mix-blend-mode:overlay}
.fx.grain{opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.fx.vig{box-shadow:inset 0 0 240px 60px rgba(0,0,0,.6)}

.app{position:relative;z-index:1;max-width:1220px;margin:0 auto;padding:16px 22px 70px}
.ic{width:1em;height:1em;display:inline-block;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* köşe-parantez çerçeve (taktik HUD imzası) */
.frame{position:relative}
.frame::before,.frame::after{content:"";position:absolute;width:13px;height:13px;border:1.5px solid var(--cyan);opacity:.55;pointer-events:none}
.frame::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.frame::after{bottom:-1px;right:-1px;border-left:0;border-top:0}

/* ============================ HUD ============================ */
.hud{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:12px 4px 16px}
.hud-brand{display:flex;align-items:center;gap:13px}
.hud-brand .mark{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;color:#04211d;font-family:var(--f-disp);font-weight:700;font-size:19px;
  background:linear-gradient(150deg,var(--cyan-b),var(--cyan-d));box-shadow:var(--glow-cyan)}
.hud-brand h1{margin:0;font-family:var(--f-disp);font-size:18px;font-weight:700;letter-spacing:1.5px}
.hud-brand h1 b{color:var(--cyan)}
.hud-brand .stat{display:flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:1.5px;color:var(--green);text-transform:uppercase}
.hud-brand .stat i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:blink 2.4s infinite}
.hud-tel{display:flex;gap:9px;margin-left:auto;flex-wrap:wrap;align-items:stretch}
.tel{position:relative;display:flex;flex-direction:column;gap:1px;padding:7px 14px;border-radius:9px;background:var(--panel);border:1px solid var(--line);min-width:84px;backdrop-filter:blur(8px)}
.tel .k{font-family:var(--f-mono);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim)}
.tel .v{font-family:var(--f-disp);font-size:17px;font-weight:600;letter-spacing:.5px}
.tel.cash .v{color:var(--green)} .tel.rep .v{color:var(--amber)} .tel.phase .v{color:var(--cyan);font-size:14px}
.tel.clock{border-color:var(--line2)} .tel.clock .v{color:var(--cyan-b);font-size:18px}
.tel.clock.live{box-shadow:var(--glow-cyan)}
.iconbtn{background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:9px;width:42px;cursor:pointer;font-size:16px;transition:.15s;display:grid;place-items:center}
.iconbtn:hover{border-color:var(--red);color:var(--red)}

/* ====================== TIMELINE BAND ====================== */
.band{margin-bottom:18px;border-radius:14px;border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),rgba(8,13,19,.6));backdrop-filter:blur(10px);padding:16px 20px;animation:rise .5s both}
.band.idle{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.band .eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--cyan)}
.band .ttl{font-family:var(--f-disp);font-size:22px;font-weight:600;margin-top:3px;letter-spacing:.5px}
.band .sub{font-family:var(--f-mono);font-size:12px;color:var(--muted);margin-top:3px}
.cta{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-disp);font-size:16px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  padding:15px 28px;border:none;border-radius:11px;cursor:pointer;color:#04211d;
  background:linear-gradient(120deg,var(--cyan-b),var(--cyan));box-shadow:var(--glow-cyan);transition:.18s;position:relative;overflow:hidden}
.cta:hover{transform:translateY(-2px);filter:brightness(1.07)}
.cta .ic{font-size:20px;stroke-width:2}
.cta::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.5),transparent);transform:translateX(-120%);animation:sweep 3.2s infinite}
.cta.sm{font-size:12px;padding:10px 16px}
.cta.ghost{background:transparent;border:1px solid var(--line2);color:var(--cyan);box-shadow:none}
.cta.ghost::after{display:none}
.cta.ghost:hover{background:rgba(34,224,200,.08)}

.tl-active{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px}
.tl-clock{text-align:center;min-width:96px}
.tl-clock .big{font-family:var(--f-disp);font-size:34px;font-weight:700;color:var(--cyan-b);line-height:1;letter-spacing:1px}
.tl-clock .left{font-family:var(--f-mono);font-size:11px;color:var(--muted);letter-spacing:1px;margin-top:4px}
.tl-track{position:relative;height:46px}
.tl-track .rail{position:absolute;top:18px;left:0;right:0;height:9px;border-radius:5px;background:#0a141a;border:1px solid var(--line);overflow:hidden}
.tl-track .fill{position:absolute;inset:0;width:0;background:linear-gradient(90deg,var(--cyan-d),var(--cyan));box-shadow:0 0 14px rgba(34,224,200,.5);transition:width .6s cubic-bezier(.4,0,.2,1)}
.tl-track .tick{position:absolute;top:11px;width:1px;height:23px;background:var(--line2)}
.tl-track .tlab{position:absolute;top:34px;transform:translateX(-50%);font-family:var(--f-mono);font-size:9px;color:var(--dim)}
.tl-track .marker{position:absolute;top:8px;width:3px;height:29px;border-radius:2px;background:var(--cyan-b);box-shadow:0 0 12px var(--cyan-b);transition:left .6s cubic-bezier(.4,0,.2,1)}
.tl-track .marker::after{content:"";position:absolute;top:-5px;left:50%;transform:translateX(-50%);width:9px;height:9px;border-radius:50%;background:var(--cyan-b);box-shadow:0 0 10px var(--cyan-b);animation:pulse 1.6s infinite}
.tl-end{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.dots{display:flex;gap:5px} .dots i{width:9px;height:9px;border-radius:2px;background:#16232b}
.dots i.success{background:var(--green);box-shadow:0 0 6px var(--green)} .dots i.partial{background:var(--amber)} .dots i.fail{background:var(--red)}

/* ====================== LAYOUT ====================== */
.layout{display:grid;grid-template-columns:340px 1fr;gap:18px;align-items:start}
@media(max-width:900px){.layout{grid-template-columns:1fr}}
.panel{position:relative;background:linear-gradient(180deg,var(--panel),rgba(7,11,16,.55));border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(10px);overflow:hidden;animation:rise .5s both}
.panel-h{display:flex;align-items:center;justify-content:space-between;padding:13px 17px;border-bottom:1px solid var(--line);
  font-family:var(--f-mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.panel-h .c{color:var(--cyan);font-family:var(--f-disp);letter-spacing:1px}
.panel-b{padding:14px}

/* analyst */
.analyst{position:relative;display:grid;grid-template-columns:1fr 94px;gap:10px;background:var(--raised);border:1px solid var(--line);border-radius:11px;padding:13px;margin-bottom:11px;transition:.18s}
.analyst.locked{opacity:.66}
.analyst:hover{border-color:var(--line2)}
.an-head{display:flex;align-items:center;gap:10px}
.avatar{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;font-family:var(--f-disp);font-weight:700;font-size:14px;color:var(--cyan);background:#091319;border:1.5px solid var(--cyan-d);box-shadow:inset 0 0 12px rgba(34,224,200,.14)}
.an-name{font-family:var(--f-disp);font-weight:600;font-size:14.5px;letter-spacing:.3px}
.an-role{font-family:var(--f-mono);font-size:10.5px;color:var(--muted)}
.an-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
.schip{font-family:var(--f-mono);font-size:10px;color:var(--cyan);background:rgba(34,224,200,.08);border:1px solid var(--cyan-d);padding:2px 7px;border-radius:5px}
.morale{display:flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:10px;color:var(--muted);margin-top:9px}
.morale .bar{flex:1;height:5px;border-radius:3px;background:#0a141a;border:1px solid var(--line);overflow:hidden}
.morale .bar i{display:block;height:100%;background:linear-gradient(90deg,#a8631f,var(--amber))}
.an-side{display:flex;flex-direction:column;align-items:center;gap:6px;justify-content:space-between}
.radar{width:88px;height:88px;display:block}
.rdr-ring{fill:none;stroke:rgba(90,200,190,.16);stroke-width:.8}
.rdr-axis{stroke:rgba(90,200,190,.12);stroke-width:.7}
.rdr-data{fill:rgba(34,224,200,.20);stroke:var(--cyan);stroke-width:1.4;filter:drop-shadow(0 0 5px rgba(34,224,200,.55))}
.rdr-lab{fill:var(--dim);font-family:var(--f-mono);font-size:7px;text-anchor:middle}
.an-price{font-family:var(--f-mono);font-size:11px;color:var(--amber)}

.btn{font-family:var(--f-mono);border:none;border-radius:8px;padding:7px 12px;font-size:11.5px;font-weight:600;cursor:pointer;transition:.15s;letter-spacing:.5px}
.btn.cyan{background:var(--cyan);color:#04211d} .btn.cyan:hover{filter:brightness(1.1)}
.btn.line{background:transparent;border:1px solid var(--line2);color:var(--muted)} .btn.line:hover{border-color:var(--cyan);color:var(--cyan)}
.btn:disabled{opacity:.38;cursor:not-allowed}
.an-actions{grid-column:1/-1;display:flex;gap:8px;align-items:center;margin-top:11px;flex-wrap:wrap}
.an-actions .salary{font-family:var(--f-mono);font-size:10px;color:var(--dim)}

/* ====================== JOB INBOX ====================== */
.inbox-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.inbox-head h2{font-family:var(--f-disp);font-size:17px;font-weight:600;letter-spacing:1px;margin:0}
.inbox-head .meta{font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.jobs{display:grid;grid-template-columns:1fr 1fr;gap:13px}
@media(max-width:580px){.jobs{grid-template-columns:1fr}}
.tcard{position:relative;background:linear-gradient(165deg,var(--raised),rgba(8,13,19,.7));border:1px solid var(--line);border-radius:13px;padding:15px;cursor:pointer;transition:.18s;overflow:hidden;animation:rise .45s both}
.tcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px}
.tcard.defans::before{background:linear-gradient(180deg,var(--blue),transparent)} .tcard.ofansif::before{background:linear-gradient(180deg,var(--red),transparent)}
.tcard:hover{transform:translateY(-3px);border-color:var(--line2);box-shadow:0 14px 36px rgba(0,0,0,.45)}
.tcard.defans:hover{box-shadow:0 14px 36px rgba(0,0,0,.45),0 0 0 1px rgba(72,168,255,.3)}
.tcard.ofansif:hover{box-shadow:0 14px 36px rgba(0,0,0,.45),0 0 0 1px rgba(255,77,94,.3)}
.tcard.disabled{opacity:.42;cursor:not-allowed;filter:grayscale(.4)}
.tcard.disabled:hover{transform:none;box-shadow:none}
.tc-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:1px;text-transform:uppercase;padding:3px 8px;border-radius:6px}
.tag.defans{background:rgba(72,168,255,.13);color:var(--blue)} .tag.ofansif{background:rgba(255,77,94,.13);color:var(--red)}
.tag .ic{font-size:12px}
.acil{display:inline-flex;align-items:center;gap:4px;font-family:var(--f-mono);font-size:9.5px;font-weight:700;letter-spacing:1px;color:var(--amber);background:rgba(255,177,61,.13);border:1px solid rgba(255,177,61,.4);padding:3px 8px;border-radius:6px;animation:glowpulse 1.5s infinite}
.tcard h3{margin:11px 0 5px;font-family:var(--f-disp);font-size:15.5px;font-weight:600;line-height:1.25;letter-spacing:.2px}
.tc-sec{font-family:var(--f-mono);font-size:10.5px;color:var(--muted)}
.tc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:13px;font-family:var(--f-mono);font-size:12px}
.tc-foot .left{display:flex;align-items:center;gap:11px}
.diff{display:inline-flex;gap:3px} .diff i{width:6px;height:6px;border-radius:2px;background:#1c2c34} .diff i.on{background:var(--amber)}
.timecost{display:inline-flex;align-items:center;gap:4px;color:var(--cyan)} .timecost .ic{font-size:13px}
.tc-foot .pay{color:var(--green)} .tc-foot .rp{color:var(--amber)}
.tcard .reason{font-family:var(--f-mono);font-size:10px;color:var(--red);margin-top:8px}
.empty{padding:34px 20px;text-align:center;color:var(--dim);font-family:var(--f-mono);font-size:13px;line-height:1.8}

/* idle brief card */
.brief{padding:20px 22px;border-radius:14px;border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),rgba(7,11,16,.5));backdrop-filter:blur(10px);animation:rise .5s both}
.brief .eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--cyan)}
.brief h2{font-family:var(--f-disp);font-size:24px;font-weight:600;margin:6px 0 8px;letter-spacing:.5px}
.brief p{color:#bdccd4;margin:0 0 16px;max-width:62ch}
.brief-stats{display:flex;gap:11px;flex-wrap:wrap}
.bstat{flex:1;min-width:120px;background:var(--raised);border:1px solid var(--line);border-radius:11px;padding:12px 14px}
.bstat .k{font-family:var(--f-mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim)}
.bstat .v{font-family:var(--f-disp);font-size:21px;font-weight:600;margin-top:3px}
.bstat.up .v{color:var(--green)} .bstat.down .v{color:var(--red)}
.recap{margin-top:16px;display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12px;color:var(--muted);padding:11px 14px;background:rgba(34,224,200,.04);border:1px solid var(--line);border-radius:10px}

/* ====================== OVERLAY / SHEETS ====================== */
#overlay{position:fixed;inset:0;z-index:60;display:none;align-items:flex-start;justify-content:center;background:rgba(3,6,9,.78);backdrop-filter:blur(5px);overflow-y:auto;padding:38px 16px}
#overlay.on{display:flex}
.sheet{width:100%;max-width:740px;background:linear-gradient(180deg,#0a1219,#070c11);border:1px solid var(--line2);border-radius:18px;box-shadow:0 36px 90px rgba(0,0,0,.7);overflow:hidden;animation:rise .26s ease}
.sh-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:18px 22px;border-bottom:1px solid var(--line)}
.sh-top h2{margin:0;font-family:var(--f-disp);font-size:20px;font-weight:600;letter-spacing:.5px}
.sh-body{padding:20px 22px}
.x{background:transparent;border:1px solid var(--line2);color:var(--muted);border-radius:9px;width:32px;height:32px;cursor:pointer;flex:none;display:grid;place-items:center}
.x:hover{color:var(--red);border-color:var(--red)}
.metarow{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}
.pill{font-family:var(--f-mono);font-size:11px;padding:3px 9px;border-radius:6px;background:#0b1620;border:1px solid var(--line);color:var(--muted)}
.brieftext{color:#c4d2da;margin:16px 0;line-height:1.7}
.label{font-family:var(--f-mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin:18px 0 10px}

.pick{display:flex;flex-direction:column;gap:9px}
.pickrow{display:flex;align-items:center;gap:12px;padding:11px 13px;border:1px solid var(--line);border-radius:11px;background:var(--raised);cursor:pointer;transition:.15s}
.pickrow:hover{border-color:var(--line2)} .pickrow.sel{border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan)}
.pickrow .fit{margin-left:auto;font-family:var(--f-mono);font-size:11px;padding:3px 9px;border-radius:6px}
.fit.good{background:rgba(55,224,138,.13);color:var(--green)} .fit.mid{background:rgba(255,177,61,.13);color:var(--amber)} .fit.low{background:rgba(255,77,94,.13);color:var(--red)}
.bigbtn{width:100%;margin-top:20px;padding:15px;border-radius:12px;border:none;font-family:var(--f-disp);font-size:15px;font-weight:600;letter-spacing:1px;text-transform:uppercase;cursor:pointer;background:linear-gradient(120deg,var(--cyan-b),var(--cyan));color:#04211d;transition:.15s}
.bigbtn:hover{filter:brightness(1.08)} .bigbtn:disabled{opacity:.4;cursor:not-allowed;filter:none}
.bigbtn.amber{background:linear-gradient(120deg,#ffce7a,var(--amber));color:#2a1a04} .bigbtn.red{background:linear-gradient(120deg,#ff8a95,var(--red));color:#2a0408}
.hint{font-family:var(--f-mono);font-size:11.5px;color:var(--dim);margin-top:11px;line-height:1.65}
.hint b{color:var(--muted)}

/* stage */
.stagebar{display:flex;gap:6px;margin-bottom:16px}
.stagebar i{flex:1;height:5px;border-radius:3px;background:#15222a}
.stagebar i.done{background:var(--green);box-shadow:0 0 8px rgba(55,224,138,.5)} .stagebar i.part{background:var(--amber)} .stagebar i.fail{background:var(--red)} .stagebar i.cur{background:var(--cyan);animation:pulse 1.4s infinite}
.situation{background:#070f15;border:1px solid var(--line);border-radius:12px;padding:15px 16px;font-size:14.5px;line-height:1.7;color:#cdd9e1}
.stagename{font-family:var(--f-mono);color:var(--cyan);font-size:11.5px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px}
.choices{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.choice{text-align:left;padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:var(--raised);cursor:pointer;transition:.15s;display:flex;align-items:center;gap:12px;color:var(--ink);font-size:14px;line-height:1.45;font-family:var(--f-body)}
.choice:hover{border-color:var(--cyan);background:#0d1922;transform:translateX(3px)}
.choice .sk{font-family:var(--f-mono);font-size:10px;color:var(--cyan);background:rgba(34,224,200,.08);border:1px solid var(--cyan-d);padding:3px 8px;border-radius:6px;flex:none}
.outcome{margin-top:16px;border-radius:12px;padding:15px 16px;font-size:14px;line-height:1.65;animation:rise .22s}
.outcome.ok{background:rgba(55,224,138,.08);border:1px solid rgba(55,224,138,.32)}
.outcome.part{background:rgba(255,177,61,.08);border:1px solid rgba(255,177,61,.32)}
.outcome.no{background:rgba(255,77,94,.08);border:1px solid rgba(255,77,94,.32)}
.outcome .verdict{font-family:var(--f-mono);font-weight:600;font-size:12px;letter-spacing:1.5px;text-transform:uppercase}
.outcome.ok .verdict{color:var(--green)} .outcome.part .verdict{color:var(--amber)} .outcome.no .verdict{color:var(--red)}

/* learn card */
.learn{background:linear-gradient(180deg,#0b1a16,#081311);border:1px solid var(--cyan-d);border-radius:14px;padding:17px 19px;margin-top:6px}
.learn .lh{font-family:var(--f-mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--cyan);margin-bottom:10px;display:flex;gap:8px;align-items:center}
.learn h4{margin:0 0 6px;font-family:var(--f-disp);font-size:15px;font-weight:600}
.learn p{margin:9px 0;font-size:13.5px;line-height:1.7;color:#bdccd4}
.tech{display:flex;gap:8px;flex-wrap:wrap;margin:13px 0}
.tech .t{font-family:var(--f-mono);font-size:11.5px;padding:5px 11px;border-radius:8px;background:#0b1620;border:1px solid var(--line2)}
.tech .t b{color:var(--cyan)} .tech .t.cve b{color:var(--red)}
.refs{display:flex;flex-direction:column;gap:5px;margin-top:8px}
.refs a{color:var(--blue);font-size:12.5px;font-family:var(--f-mono);text-decoration:none} .refs a:hover{text-decoration:underline}

/* result + day summary */
.result-grade{text-align:center;padding:6px 0 2px}
.result-grade .g{font-family:var(--f-disp);font-size:52px;font-weight:700;line-height:1}
.ledger{display:flex;flex-direction:column;gap:8px;margin:18px 0;background:#070f15;border:1px solid var(--line);border-radius:12px;padding:15px 17px;font-family:var(--f-mono);font-size:13.5px}
.ledger .lr{display:flex;justify-content:space-between} .ledger .lr.tot{border-top:1px solid var(--line);padding-top:9px;margin-top:2px;font-weight:600}
.pos{color:var(--green)} .neg{color:var(--red)}

.sum-hero{text-align:center;padding:8px 0 4px}
.sum-hero .day{font-family:var(--f-mono);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--cyan)}
.sum-hero .net{font-family:var(--f-disp);font-size:46px;font-weight:700;line-height:1.1;margin-top:4px}
.sum-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}
@media(max-width:560px){.sum-tiles{grid-template-columns:repeat(2,1fr)}}
.stile{background:var(--raised);border:1px solid var(--line);border-radius:11px;padding:12px;text-align:center}
.stile .k{font-family:var(--f-mono);font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--dim)}
.stile .v{font-family:var(--f-disp);font-size:21px;font-weight:600;margin-top:3px}
.chart-wrap{background:#070f15;border:1px solid var(--line);border-radius:12px;padding:15px 16px;margin:14px 0}
.chart-wrap .ct{font-family:var(--f-mono);font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.bars{display:flex;align-items:flex-end;gap:10px;height:96px}
.barcol{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.barcol .bar{width:100%;max-width:48px;border-radius:6px 6px 0 0;min-height:4px;transition:height .5s}
.barcol.success .bar{background:linear-gradient(180deg,var(--green),var(--cyan-d))} .barcol.partial .bar{background:linear-gradient(180deg,var(--amber),#7a4f12)} .barcol.fail .bar{background:linear-gradient(180deg,var(--red),#5a141b)}
.barcol .lab{font-family:var(--f-mono);font-size:9px;color:var(--muted);text-align:center;line-height:1.2;max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.barcol .val{font-family:var(--f-mono);font-size:10px;color:var(--ink)}
.spark{width:100%;height:60px;display:block}
.event-line{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12.5px;color:var(--ink);padding:12px 14px;border-radius:10px;background:rgba(169,139,255,.08);border:1px solid rgba(169,139,255,.3);margin:14px 0}
.event-line .ic{color:var(--violet);font-size:16px;flex:none}
.warn-line{font-family:var(--f-mono);font-size:12px;color:var(--red);background:rgba(255,77,94,.08);border:1px solid rgba(255,77,94,.3);border-radius:10px;padding:10px 14px;margin:12px 0}

/* toast */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:90;background:#081512;border:1px solid var(--green);color:var(--green);padding:12px 20px;border-radius:11px;font-family:var(--f-mono);font-size:13px;opacity:0;transition:.25s;pointer-events:none;box-shadow:0 8px 30px rgba(0,0,0,.5)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(-4px)} .toast.err{background:#150a0c;border-color:var(--red);color:var(--red)}

footer{margin-top:36px;text-align:center;color:var(--dim);font-family:var(--f-mono);font-size:11px;line-height:1.9;letter-spacing:.5px}

/* keyframes */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}
@keyframes glowpulse{0%,100%{box-shadow:0 0 0 0 rgba(255,177,61,.3)}50%{box-shadow:0 0 10px 1px rgba(255,177,61,.45)}}
@keyframes sweep{0%{transform:translateX(-120%)}55%,100%{transform:translateX(220%)}}
.reveal>*{animation:rise .5s both}
.reveal>*:nth-child(2){animation-delay:.06s}.reveal>*:nth-child(3){animation-delay:.12s}.reveal>*:nth-child(4){animation-delay:.18s}.reveal>*:nth-child(5){animation-delay:.24s}.reveal>*:nth-child(6){animation-delay:.3s}

/* ============================================================
   v0.3 EKLERİ — erişilebilirlik, mobil, dopamin, hedef, kariyer
   ============================================================ */
:focus-visible{outline:2px solid var(--cyan-b);outline-offset:2px;border-radius:8px}
[role="button"]{cursor:pointer}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .cta::after{display:none}
}

/* objektif / hedef satırı */
.objbar{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.obj{display:flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:11.5px;color:var(--muted);background:rgba(34,224,200,.05);border:1px solid var(--line);border-radius:9px;padding:8px 12px}
.obj .ic{color:var(--cyan);flex:none}
.obj.done{color:var(--green);border-color:rgba(55,224,138,.35)} .obj.done .ic{color:var(--green)}
.obj b{color:var(--ink)}

/* kombo rozeti */
.combo{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-disp);font-weight:700;font-size:13px;letter-spacing:1px;color:#04211d;background:linear-gradient(120deg,var(--amber),#ff7a3d);padding:4px 11px;border-radius:8px;box-shadow:0 0 14px rgba(255,177,61,.5);animation:pop .3s}
@keyframes pop{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:scale(1)}}

/* kritik başarı flash */
.critbanner{margin-top:14px;text-align:center;font-family:var(--f-disp);font-weight:700;letter-spacing:2px;color:var(--amber);font-size:15px;animation:critflash 1.2s}
@keyframes critflash{0%{opacity:0;transform:scale(.8);filter:brightness(2)}30%{opacity:1;transform:scale(1.06)}100%{opacity:1;transform:scale(1)}}
.flash-win{animation:flashwin .9s}
@keyframes flashwin{0%{box-shadow:inset 0 0 0 0 rgba(55,224,138,0)}30%{box-shadow:inset 0 0 120px 10px rgba(55,224,138,.25)}100%{box-shadow:inset 0 0 0 0 rgba(55,224,138,0)}}

/* karar dökümü (öğrenme) */
.recap-list{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.recap-row{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;background:#070f15;border:1px solid var(--line);border-radius:10px;padding:11px 13px;font-size:13px}
.recap-row .mk{font-family:var(--f-mono);font-weight:700;text-align:center}
.recap-row.success .mk{color:var(--green)} .recap-row.partial .mk{color:var(--amber)} .recap-row.fail .mk{color:var(--red)}
.recap-row .sn{font-family:var(--f-mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.recap-row .ch{color:var(--ink);margin-top:3px}
.recap-row .bo{color:var(--green);margin-top:4px;font-size:12px}
.mistake{background:rgba(255,77,94,.08);border:1px solid rgba(255,77,94,.32);border-radius:10px;padding:11px 14px;margin:12px 0;font-size:13px;color:#ffd7db}
.mistake b{color:var(--red)}
.surprise{background:rgba(169,139,255,.1);border:1px solid rgba(169,139,255,.4);border-radius:10px;padding:10px 13px;margin:10px 0;font-family:var(--f-mono);font-size:12.5px;color:var(--violet)}

/* kariyer / başarım ekranı */
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
@media(max-width:560px){.stat-grid{grid-template-columns:repeat(2,1fr)}}
.ach-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:8px}
@media(max-width:520px){.ach-grid{grid-template-columns:1fr}}
.ach{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--raised)}
.ach.lock{opacity:.5} .ach .ic{font-size:20px;color:var(--amber);flex:none} .ach.lock .ic{color:var(--dim)}
.ach .an-name{font-size:13px} .ach .an-role{font-size:10.5px}
.tech-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tech-grid .t{font-family:var(--f-mono);font-size:11px;padding:3px 8px;border-radius:6px;background:#0b1620;border:1px solid var(--line2);color:var(--cyan)}

/* boot / overlay sürücü */
.endscreen{text-align:center;padding:10px 0}
.endscreen .big{font-family:var(--f-disp);font-size:40px;font-weight:700;letter-spacing:1px;line-height:1.1}
.endscreen .big.win{color:var(--green)} .endscreen .big.lose{color:var(--red)}
.endscreen p{color:#bdccd4;max-width:52ch;margin:12px auto}

/* mobil */
@media(max-width:640px){
  .app{padding:12px 14px 60px}
  .hud{flex-direction:column;align-items:stretch;gap:12px}
  .hud-tel{margin-left:0;justify-content:space-between}
  .tel{min-width:0;flex:1;padding:7px 9px} .tel .v{font-size:15px}
  .tel.phase{display:none}
  .band.idle{flex-direction:column;align-items:stretch} .band.idle .cta{width:100%;justify-content:center}
  .tl-active{grid-template-columns:1fr;gap:14px;text-align:center}
  .tl-end{align-items:stretch} .tl-end .cta{width:100%;justify-content:center}
  .tl-track .tlab:nth-child(4n){display:none}
}
@media(max-width:480px){ .jobs,.sum-tiles{grid-template-columns:1fr} .tl-track .tlab{display:none} }

/* ============================================================
   CANLI OFİS (kod-çizimli, varlıksız) + KONFETİ
   ============================================================ */
.office{position:relative;margin-bottom:18px;border:1px solid var(--line);border-radius:14px;overflow:hidden;animation:rise .5s both;
  background:linear-gradient(180deg,#0a141b 0%,#0a141b 52%,#0c1a22 52%,#070f17 100%);backdrop-filter:blur(8px)}
.office-tag{position:absolute;top:9px;left:16px;z-index:4;font-family:var(--f-mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim)}
.backwall{position:absolute;top:0;left:0;right:0;height:52%;pointer-events:none;z-index:1}
.rack{position:absolute;top:14px;right:18px;width:32px;height:44px;border:1px solid var(--line2);border-radius:4px;background:#06101a;display:flex;flex-direction:column;justify-content:space-around;padding:5px}
.rack i{height:3px;border-radius:1px;background:var(--green);animation:led 1.6s infinite}
.rack i:nth-child(2){animation-delay:.3s;background:var(--cyan)} .rack i:nth-child(3){animation-delay:.6s;background:var(--amber)} .rack i:nth-child(4){animation-delay:.9s;background:var(--blue)}
.wallscreen{position:absolute;top:13px;left:50%;transform:translateX(-50%);width:190px;max-width:38%;height:28px;border:1px solid var(--cyan-d);border-radius:4px;background:#04120f;overflow:hidden;box-shadow:0 0 14px rgba(34,224,200,.14)}
.wallscreen .feed{position:absolute;top:7px;white-space:nowrap;font-family:var(--f-mono);font-size:10px;color:var(--cyan);animation:feedscroll 16s linear infinite}
.coffee{position:absolute;bottom:14px;right:18px;width:13px;height:18px;border:1px solid var(--line2);border-radius:2px 2px 3px 3px;background:#0c1822;z-index:2}
.coffee::after{content:"";position:absolute;top:-4px;left:2px;right:2px;height:4px;border-radius:2px;background:var(--amber);opacity:.65}
.office-inner{position:relative;z-index:2;display:flex;align-items:flex-end;min-height:130px;padding:18px 18px 16px;overflow-x:auto}
.desks{display:flex;align-items:flex-end;gap:18px;padding-left:2px}
.station{position:relative;width:74px;height:88px;flex:none}
.station .desk{position:absolute;bottom:0;left:3px;right:3px;height:8px;border-radius:2px;background:linear-gradient(180deg,#17262f,#0b141b);border:1px solid var(--line2)}
.station .monitor{position:absolute;bottom:8px;left:14px;width:46px;height:30px;border-radius:4px;background:#05110d;border:1.5px solid var(--ac);box-shadow:0 0 10px var(--ac);overflow:hidden}
.station .monitor::before{content:"";position:absolute;inset:2px;border-radius:2px;background:linear-gradient(180deg,var(--ac),transparent);opacity:.45;animation:flick 2.6s infinite}
.station .monitor::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.35) 3px 4px)}
.station .worker{position:absolute;bottom:30px;left:50%;width:34px;display:flex;flex-direction:column;align-items:center;animation:bob 3.2s ease-in-out infinite;z-index:1}
.station .worker .head{width:15px;height:15px;border-radius:50%;background:var(--ac);box-shadow:0 0 6px var(--ac)}
.station .worker .torso{width:30px;height:18px;border-radius:11px 11px 3px 3px;background:linear-gradient(180deg,#2a4654,#15242d);margin-top:-1px}
.station .hands{position:absolute;bottom:13px;left:50%;transform:translateX(-50%);width:42px;display:flex;justify-content:space-between;z-index:2}
.station .hands i{width:7px;height:6px;border-radius:3px;background:var(--ac);opacity:.85}
.station .hands i.l{animation:typeL .42s infinite} .station .hands i.r{animation:typeR .42s infinite}
.station .nameplate{position:absolute;bottom:-13px;left:0;right:0;text-align:center;font-family:var(--f-mono);font-size:9px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.station .bubble{position:absolute;top:-8px;right:4px;font-size:15px;z-index:3;animation:bubblepulse 1.1s infinite}
.station.busy .monitor{border-color:var(--red);box-shadow:0 0 16px var(--red)} .station.busy .monitor::before{background:linear-gradient(180deg,var(--red),transparent);animation-duration:.7s} .station.busy .hands i{animation-duration:.2s}
.station.tired .worker{filter:grayscale(.55) brightness(.8);animation-duration:5.5s} .station.tired .hands i{animation-duration:1.3s;opacity:.45}
.station.ghost{opacity:.4} .station.ghost .ghosttxt{position:absolute;bottom:14px;left:0;right:6px;text-align:center;font-family:var(--f-mono);font-size:9px;color:var(--dim);border:1px dashed var(--line2);border-radius:6px;padding:7px 0;margin-left:6px}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-2.5px)}}
@keyframes typeL{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes typeR{0%,100%{transform:translateY(-2px)}50%{transform:translateY(0)}}
@keyframes flick{0%,100%{opacity:.45}45%{opacity:.28}70%{opacity:.6}}
@keyframes feedscroll{from{transform:translateX(0)}to{transform:translateX(-55%)}}
@keyframes led{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes bubblepulse{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.13)}}

.cft{position:fixed;top:-24px;width:9px;height:14px;z-index:120;pointer-events:none;border-radius:2px;will-change:transform}
@keyframes cfall{to{transform:translateY(108vh) rotate(760deg)}}
@media(prefers-reduced-motion:reduce){.station .worker,.station .hands i,.station .monitor::before,.rack i,.wallscreen .feed{animation:none!important}}

/* dükkân / kayıt / roamer (ofis v2) */
.shopic{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;background:#0a1620;border:1px solid var(--line2);color:var(--cyan);font-size:18px;flex:none}
.shopic .ic{font-size:18px}
.saveio{width:100%;min-height:64px;background:#070f15;border:1px solid var(--line);border-radius:10px;color:var(--ink);font-family:var(--f-mono);font-size:11px;padding:10px;resize:vertical;margin-top:4px;box-sizing:border-box}
.roamer{position:absolute;bottom:13px;left:0;width:18px;z-index:3;display:flex;flex-direction:column;align-items:center;animation:roam 15s linear infinite}
.roamer.r2{animation-duration:19s;animation-delay:-6s}
.roamer .rhead{width:11px;height:11px;border-radius:50%;background:var(--amber);box-shadow:0 0 6px var(--amber)}
.roamer .rbody{width:16px;height:13px;border-radius:7px 7px 2px 2px;background:linear-gradient(180deg,#cda85f,#7a5e23);margin-top:-1px}
.roamer.r2 .rhead{background:var(--blue);box-shadow:0 0 6px var(--blue)} .roamer.r2 .rbody{background:linear-gradient(180deg,#5a86b8,#243a52)}
.roamer .legs{display:flex;gap:3px;margin-top:1px}
.roamer .legs i{width:5px;height:7px;border-radius:0 0 2px 2px;background:#1a2a33}
.roamer .legs i:first-child{animation:stepA .42s infinite} .roamer .legs i:last-child{animation:stepB .42s infinite}
@keyframes roam{0%{transform:translateX(24px) scaleX(1)}47%{transform:translateX(220px) scaleX(1)}50%{transform:translateX(220px) scaleX(-1)}97%{transform:translateX(24px) scaleX(-1)}100%{transform:translateX(24px) scaleX(1)}}
@keyframes stepA{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes stepB{0%,100%{transform:translateY(-2px)}50%{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.roamer{animation:none!important;transform:translateX(40px)} .roamer .legs i{animation:none!important}}

/* ============================================================
   v0.5 — "Komuta Şafağı" tema cilası: HUD renk, layout dengesi, juice
   ============================================================ */
/* HUD telemetri renk şeritleri (tek-teal yerine çok-renkli komuta paneli) */
.tel::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;border-radius:9px 9px 0 0;background:var(--cyan);opacity:.85}
.tel.cash::before{background:var(--green)} .tel.rep::before{background:var(--gold)} .tel.phase::before{background:var(--violet)} .tel.clock::before{background:var(--cyan-b)}
.tel.rep .v{color:var(--gold)}

/* layout dengesi: esnek kolon + sticky sol panel + iç-scroll */
.layout{grid-template-columns:minmax(300px,360px) minmax(0,1fr)}
@media(min-width:1025px){
  .layout>aside{position:sticky;top:16px;align-self:start}
  .layout>aside .panel{max-height:calc(100vh - 40px);display:flex;flex-direction:column}
  .layout>aside .panel-h{flex:none}
  #team-list{overflow-y:auto;flex:1;scrollbar-width:thin}
}
@media(max-width:1024px){ .layout{grid-template-columns:1fr} }

/* ofisi merkeze al & büyüt (sahnenin kahramanı) */
.office-inner{min-height:150px;justify-content:center}
.desks{justify-content:center}

/* CTA nefes + tıklama geri bildirimi */
.cta{animation:breathe 3.6s ease-in-out infinite}
.cta:active{transform:translateY(0) scale(.98)}
@keyframes breathe{0%,100%{box-shadow:var(--glow-cyan)}50%{box-shadow:0 0 0 1px rgba(39,224,196,.45),0 0 32px rgba(39,224,196,.34)}}

/* kart hover tilt + (stagger zaten .reveal'da var) */
.jobs{perspective:1000px}
.tcard{transition:transform .18s, box-shadow .18s, border-color .18s}
.tcard:hover{transform:translateY(-4px) rotateX(2.5deg)}

/* toast yay-ile (overshoot) */
.toast{transition:opacity .25s, transform .4s cubic-bezier(.34,1.56,.64,1)}

/* kombo alev pulse */
.combo{background:linear-gradient(120deg,var(--gold),var(--coral));box-shadow:0 0 16px rgba(255,122,107,.5);animation:pop .3s, flame 1.5s ease-in-out infinite}
@keyframes flame{0%,100%{box-shadow:0 0 14px rgba(255,203,92,.45)}50%{box-shadow:0 0 24px rgba(255,122,107,.62)}}

/* +₺ uçan ödül */
.floater{position:fixed;z-index:130;font-family:var(--f-disp);font-weight:700;font-size:18px;color:var(--gold);text-shadow:0 0 12px rgba(255,203,92,.6);pointer-events:none;animation:floatup 1.15s ease-out forwards}
@keyframes floatup{0%{opacity:0;transform:translateY(10px) scale(.8)}18%{opacity:1}100%{opacity:0;transform:translateY(-62px) scale(1.12)}}

/* ofis sonuç reaksiyonu (Faz 2'de tetiklenecek, hazır) */
.station.cheer .worker{animation:cheer .7s} @keyframes cheer{0%,100%{transform:translateX(-50%) translateY(0)}30%{transform:translateX(-50%) translateY(-9px)}60%{transform:translateX(-50%) translateY(-3px)}}
.station.cheer .monitor{border-color:var(--green);box-shadow:0 0 18px var(--green)}
.station.shake .monitor{animation:cshake .35s} @keyframes cshake{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}

@media(prefers-reduced-motion:reduce){.cta,.combo,.floater,.tcard{animation:none!important} .tcard:hover{transform:none}}

/* ============================================================
   v0.6 — Tehdit Dünyası UI (lig · CTI/APT · canlı acil)
   ============================================================ */
.leaderboard{display:flex;flex-direction:column;gap:7px}
.lrow{display:flex;align-items:center;gap:12px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--raised)}
.lrow.you{border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan);background:rgba(39,224,196,.06)}
.lr-rank{font-family:var(--f-disp);font-weight:700;font-size:16px;color:var(--gold);min-width:36px}
.lr-name{flex:1;font-family:var(--f-disp);font-size:14px}
.lr-name .lr-p{font-family:var(--f-mono);font-size:10px;color:var(--muted);font-weight:400}
.lrow.you .lr-name{color:var(--cyan)}
.lr-rep{font-family:var(--f-mono);color:var(--gold);font-weight:600}

.threat-card{background:linear-gradient(180deg,#1b1320,#120d18);border:1px solid var(--line2);border-radius:13px;padding:16px 18px}
.th-name{font-family:var(--f-disp);font-size:18px;font-weight:600;color:var(--red);display:flex;align-items:center;gap:8px}
.th-tech{font-family:var(--f-mono);font-size:11px;color:var(--muted);background:#0b0f17;border:1px solid var(--line);border-radius:7px;padding:7px 10px;margin:10px 0}
.th-meter{display:grid;grid-template-columns:88px 1fr 46px;align-items:center;gap:10px;margin:9px 0;font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.th-meter .bar{height:9px;border-radius:5px;background:#0a121b;border:1px solid var(--line);overflow:hidden}
.th-meter .bar i{display:block;height:100%}
.th-meter b{font-family:var(--f-mono);text-align:right;color:var(--cyan)}

.badge-personal,.badge-ihale,.badge-apt,.cd{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.4px;padding:3px 7px;border-radius:6px;display:inline-flex;align-items:center;gap:4px;margin-left:5px}
.badge-personal .ic,.badge-ihale .ic,.badge-apt .ic{font-size:11px}
.badge-personal{background:rgba(255,93,108,.16);color:var(--red);border:1px solid rgba(255,93,108,.5);font-weight:700;animation:glowpulse 1.2s infinite}
.badge-ihale{background:rgba(255,203,92,.14);color:var(--gold);border:1px solid rgba(255,203,92,.4)}
.badge-apt{background:rgba(182,155,255,.14);color:var(--violet);border:1px solid rgba(182,155,255,.4)}
.cd{background:rgba(255,180,84,.16);color:var(--amber);border:1px solid rgba(255,180,84,.5);font-weight:700;min-width:34px;justify-content:center}
.cd.cd-low{background:rgba(255,93,108,.2);color:var(--red);border-color:var(--red);animation:glowpulse .6s infinite}
.tcard:has(.badge-personal){border-color:var(--red);box-shadow:0 0 0 1px rgba(255,93,108,.4),0 0 22px rgba(255,93,108,.18)}
.tcard:has(.cd){border-left-color:var(--amber)}