*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }

:root {
  --blue:#38bdf8; --blue2:#7dd3fc; --bglow:rgba(56,189,248,0.35);
  --panel:rgba(6,16,36,0.88); --border:rgba(56,189,248,0.14);
  --text:#ddeeff; --dim:rgba(200,220,255,0.75);
  --green:#4ade80; --gglow:rgba(74,222,128,0.38);
  --yellow:#facc15; --orange:#fb923c; --red:#ef4444;
  --cat-cred:#ef4444; --cat-cred-bg:rgba(239,68,68,0.22); --cat-cred-border:rgba(239,68,68,0.6);
  --cat-pii:#fb923c;  --cat-pii-bg:rgba(251,146,60,0.22);  --cat-pii-border:rgba(251,146,60,0.6);
  --cat-int:#facc15;  --cat-int-bg:rgba(250,204,21,0.18);   --cat-int-border:rgba(250,204,21,0.55);
  /* Mission identity colour */
  --m1:#38bdf8; --m1-border:rgba(56,189,248,0.45);
}

html, body { width:100%; height:100%; background:#020610; font-family:'DM Sans',sans-serif; color:var(--text); overflow-y:auto; overflow-x:hidden; }

/* ══ SCREENS ══ */
.screen { display:none; }
.screen.active { display:block; min-height:100vh; }

/* ══ SHARED BG ══ */
.bg { position:fixed; inset:0; z-index:0; background:#020c1a; overflow:hidden; pointer-events:none; }
.bg::before { content:''; position:absolute; inset:0; background: radial-gradient(ellipse 55% 50% at 15% 20%, rgba(56,189,248,0.09) 0%, transparent 60%), radial-gradient(ellipse 45% 55% at 85% 80%, rgba(56,189,248,0.07) 0%, transparent 60%); }

/* ══ HEX GRID ATMOSPHERE — all full-screen surfaces ══ */
/* Variable used by overlay backgrounds below */
.bg::after,
.splash::after,
.briefing-overlay::before,
.obj-overlay::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zM28 100L0 84V50l28-16 28 16v34L28 100z' fill='none' stroke='%2338bdf8' stroke-opacity='0.045' stroke-width='1'/%3E%3C/svg%3E");
  background-size: 56px 100px;
  background-attachment: fixed;
  pointer-events: none;
  z-index: 0;
}
/* Scrollable overlays: hex grid baked into element background so it covers
   the full scroll height, not just the initial viewport */

/* ══ ANIMATIONS ══ */
@keyframes fadeUp  { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
@keyframes slideIn { from{opacity:0;transform:translateX(14px)} to{opacity:1;transform:translateX(0)} }
@keyframes pulse   { 0%,100%{opacity:1} 50%{opacity:.4} }
@keyframes scanAnim { 0%{top:-4px;opacity:0} 8%{opacity:1} 88%{opacity:1} 100%{top:100%;opacity:0} }
@keyframes diagPulse { 0%,100%{background:var(--panel)} 40%{background:rgba(74,222,128,0.09)} }
@keyframes wrongGlow { 0%{box-shadow:0 0 0 0 rgba(239,68,68,0)} 35%{box-shadow:0 0 18px 2px rgba(239,68,68,.45)} 100%{box-shadow:0 0 0 0 rgba(239,68,68,0)} }
@keyframes popIn  { from{opacity:0;transform:scale(0.82) translateY(4px)} to{opacity:1;transform:scale(1) translateY(0)} }
@keyframes verdictIn { from{opacity:0;transform:scale(0.94) translateY(18px)} to{opacity:1;transform:scale(1) translateY(0)} }
@keyframes dotPop { 0%{transform:scale(1)} 50%{transform:scale(1.6)} 100%{transform:scale(1)} }
@keyframes statusDot { 0%,100%{box-shadow:0 0 0 3px rgba(74,222,128,0.2)} 50%{box-shadow:0 0 0 6px rgba(74,222,128,0.08)} }
@keyframes shieldPop  { 0%{transform:scale(0.4) rotate(-8deg);opacity:0} 70%{transform:scale(1.08) rotate(2deg);opacity:1} 100%{transform:scale(1) rotate(0deg);opacity:1} }
@keyframes ringPulse  { 0%{transform:scale(.7);opacity:.9} 100%{transform:scale(2.2);opacity:0} }
@keyframes hexGlow    { 0%,100%{filter:drop-shadow(0 0 10px rgba(74,222,128,.5)) drop-shadow(0 0 24px rgba(56,189,248,.18));} 50%{filter:drop-shadow(0 0 24px rgba(74,222,128,.95)) drop-shadow(0 0 48px rgba(56,189,248,.35));} }
@keyframes checkDraw  { 0%{stroke-dashoffset:60} 100%{stroke-dashoffset:0} }
@keyframes particleUp { 0%{transform:translateY(0) scale(1);opacity:1} 100%{transform:translateY(-70px) scale(0);opacity:0} }
@keyframes scanReveal { 0%{opacity:0;transform:translateY(6px)} 100%{opacity:1;transform:translateY(0)} }
@keyframes securedPulse { 0%, 100% { opacity:1; } 50% { opacity:.55; } }
@keyframes failScan { 0%{top:0;opacity:1} 100%{top:100%;opacity:0} }
@keyframes intPopAnim { 0%{opacity:0;transform:translateX(-50%) translateY(10px) scale(.7);} 15%{opacity:1;transform:translateX(-50%) translateY(0px) scale(1.3);} 60%{opacity:1;transform:translateX(-50%) translateY(-18px) scale(1.05);} 100%{opacity:0;transform:translateX(-50%) translateY(-32px) scale(.9);} }
@keyframes ctaPulse { 0%,100% { box-shadow:0 0 8px rgba(74,222,128,.3); border-color:rgba(74,222,128,.5); } 50% { box-shadow:0 0 18px rgba(74,222,128,.65); border-color:rgba(74,222,128,.9); } }
@keyframes securedGlow { 0%,100%{filter:drop-shadow(0 0 8px rgba(74,222,128,.4));} 50%{filter:drop-shadow(0 0 22px rgba(74,222,128,.85));} }
@keyframes intGain { 0%{transform:scale(1)} 30%{transform:scale(1.12)} 100%{transform:scale(1)} }
@keyframes intPenalty { 0%{transform:scale(1)} 30%{transform:scale(1.08)} 100%{transform:scale(1)} }
@keyframes timerWarn { 0%,100%{box-shadow:0 0 0 rgba(239,68,68,0)} 50%{box-shadow:0 0 18px rgba(239,68,68,.35)} }
@keyframes cardGlow { 0%,100%{box-shadow:0 0 0 rgba(56,189,248,0)} 50%{box-shadow:0 0 30px rgba(56,189,248,.15)} }
@keyframes chipGlow { 0%,100%{box-shadow:none;border-color:rgba(56,189,248,.4);background:rgba(56,189,248,.07)} 50%{box-shadow:0 0 0 5px rgba(56,189,248,.18),0 0 22px rgba(56,189,248,.32);border-color:rgba(56,189,248,.85);background:rgba(56,189,248,.15)} }
@keyframes chipArrowBounce { 0%,60%,100%{transform:translateY(0)} 30%{transform:translateY(4px)} }
@keyframes missionUnlock { 0%{transform:scale(1.05);opacity:.6} 100%{transform:scale(1);opacity:1} }
@keyframes statusReveal {
  0%   { opacity:0;   transform:translateY(6px) scale(.88); }
  18%  { opacity:1;   transform:translateY(0)   scale(1.09); }
  34%  { opacity:1;   transform:scale(1); }
  52%  { opacity:.58; }
  68%  { opacity:1; }
  84%  { opacity:.72; }
  100% { opacity:1;   transform:translateY(0) scale(1); }
}
@keyframes teachReveal {
  0%   { opacity:0; transform:translateY(4px); }
  22%  { opacity:1; transform:translateY(0); }
  55%  { opacity:.65; }
  78%  { opacity:1; }
  100% { opacity:1; transform:translateY(0); }
}

/* ════════════════════════════════════════════
   SPLASH SCREEN
════════════════════════════════════════════ */
.splash {
  position:fixed; inset:0; z-index:600;
  background:radial-gradient(ellipse 80% 60% at 50% 30%, #071a38 0%, #020810 65%);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  transition:opacity .7s ease; overflow:hidden; padding:20px;
}
.splash.hidden { opacity:0; pointer-events:none; }
/* ambient glow orbs */
.splash::before {
  content:''; position:absolute;
  width:700px; height:700px; border-radius:50%;
  background:radial-gradient(circle, rgba(56,189,248,.055) 0%, transparent 68%);
  top:50%; left:50%; transform:translate(-50%,-58%); pointer-events:none;
}
/* second accent orb */
.splash-hero {
  width:64px; height:64px; margin-bottom:16px; opacity:.9;
  filter:drop-shadow(0 0 28px rgba(56,189,248,.55)) drop-shadow(0 0 8px rgba(56,189,248,.3));
  animation:hexGlow 3s ease-in-out infinite;
}
.splash-eyebrow {
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.22em;
  color:rgba(56,189,248,.7); text-transform:uppercase; margin-bottom:14px;
  display:flex; align-items:center; gap:14px; width:520px; max-width:92vw;
}
.splash-eyebrow::before, .splash-eyebrow::after { content:''; flex:1; height:1px; background:rgba(56,189,248,.14); }
.splash-title {
  font-family:'Orbitron',monospace; font-size:clamp(36px,7vw,58px); font-weight:900;
  letter-spacing:.04em; color:#ffffff; text-align:center; line-height:1.05;
  margin-bottom:8px;
  text-shadow: 0 0 100px rgba(56,189,248,.25), 0 0 40px rgba(56,189,248,.12), 0 2px 6px rgba(0,0,0,.95);
}
.splash-subtitle {
  font-family:'DM Sans',sans-serif; font-size:14px; font-weight:300;
  color:rgba(200,220,255,.72); letter-spacing:.05em; text-align:center;
  margin-bottom:24px;
}
/* ── Name input ── */
.splash-name-wrap {
  display:flex; flex-direction:column; align-items:center; gap:6px;
  width:320px; max-width:88vw; margin-bottom:28px;
}
.splash-name-label {
  font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:rgba(56,189,248,.75);
}
.splash-name-input {
  width:100%; padding:11px 14px; font-family:'DM Sans',sans-serif; font-size:16px;
  color:#fff; background:rgba(56,189,248,.04); border:1px solid rgba(56,189,248,.2);
  border-radius:6px; outline:none; text-align:center; letter-spacing:.02em;
  transition:border-color .2s, box-shadow .2s;
}
.splash-name-input::placeholder { color:rgba(200,220,255,.55); }
.splash-name-input:focus { border-color:rgba(56,189,248,.5); box-shadow:0 0 16px rgba(56,189,248,.12); }
.splash-name-input.error { border-color:rgba(239,68,68,.6); box-shadow:0 0 12px rgba(239,68,68,.15); }
.splash-name-hint {
  font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.1em;
  color:rgba(200,220,255,.6); transition:color .2s;
}
.splash-name-hint.error { color:rgba(239,68,68,.9); }
/* ── Mission preview rows ── */
.splash-missions {
  display:flex; flex-direction:column; gap:0;
  width:500px; max-width:92vw; margin-bottom:32px;
  border:1px solid rgba(56,189,248,.1); border-radius:10px; overflow:hidden;
  background:rgba(6,14,32,1); backdrop-filter:blur(12px);
}
.splash-mission {
  display:flex; align-items:center; gap:14px; padding:13px 18px;
  border-bottom:1px solid rgba(56,189,248,.07);
  animation:fadeUp .5s ease both;
}
.splash-mission:last-child { border-bottom:none; }
.splash-mission:nth-child(2) { animation-delay:.08s; }
.splash-mission:nth-child(3) { animation-delay:.16s; }
.splash-mission-num {
  font-family:'Orbitron',monospace; font-size:10px; font-weight:900;
  letter-spacing:.1em; color:#ffffff;
  flex-shrink:0; width:22px;
}
.splash-mission-text {
  font-family:'DM Sans',sans-serif; font-size:12.5px; font-weight:400;
  color:rgba(200,225,255,.82); line-height:1.4; letter-spacing:.01em;
}
/* ── Loading ── */
.splash-load-wrap { display:flex; flex-direction:column; align-items:center; gap:8px; margin-bottom:20px; width:300px; max-width:88vw; }
.splash-load-track { width:100%; height:2px; background:rgba(56,189,248,.07); border-radius:2px; overflow:hidden; }
.splash-load-fill { height:100%; width:0%; background:linear-gradient(90deg,rgba(56,189,248,.5),var(--blue2)); border-radius:2px; transition:width .05s linear; box-shadow:0 0 10px rgba(56,189,248,.5); }
.splash-load-msg { font-family:'JetBrains Mono',monospace; font-size:9px; color:rgba(56,189,248,.7); letter-spacing:.14em; }
/* ── CTA ── */
.splash-btn {
  font-family:'Orbitron',monospace; font-size:10px; font-weight:700;
  letter-spacing:.3em; text-transform:uppercase;
  padding:16px 56px; border-radius:6px; cursor:pointer;
  background:rgba(56,189,248,.07); border:1px solid rgba(56,189,248,.4);
  color:rgba(56,189,248,.85); transition:all .3s; position:relative; overflow:hidden;
}
.splash-btn::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg, rgba(56,189,248,.12) 0%, transparent 60%); opacity:0; transition:opacity .3s; }
.splash-btn:not(:disabled):hover { border-color:var(--blue); color:#fff; background:rgba(56,189,248,.12); box-shadow:0 0 36px rgba(56,189,248,.22), 0 0 12px rgba(56,189,248,.1); }
.splash-btn:not(:disabled):hover::before { opacity:1; }
.splash-btn:disabled { opacity:.2; cursor:not-allowed; }

/* ════════════════════════════════════════════
   BOOT
════════════════════════════════════════════ */
.boot { position:fixed; inset:0; z-index:400; background:#040a14; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; transition:opacity .8s ease; }
.boot.hidden { opacity:0; pointer-events:none; }
.boot-title { font-family:'Orbitron',monospace; font-size:13px; font-weight:900; letter-spacing:.22em; color:var(--text); }
.boot-msg { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); letter-spacing:.04em; }
.boot-track { width:200px; height:2px; background:rgba(56,189,248,.1); border-radius:1px; overflow:hidden; }
.boot-fill { height:100%; background:var(--blue); width:0%; transition:width .15s linear; border-radius:1px; }

/* ════════════════════════════════════════════
   SHARED CARD
════════════════════════════════════════════ */
.card { background:var(--panel); border:1px solid var(--border); border-radius:10px; backdrop-filter:blur(16px); box-shadow:0 0 0 1px rgba(56,189,248,.03), inset 0 1px 0 rgba(56,189,248,.07), 0 14px 36px rgba(0,0,0,.45); }

/* ════════════════════════════════════════════
   MISSION SELECT SCREEN
════════════════════════════════════════════ */
.mission-screen {
  position:relative; z-index:1;
  min-height:100vh;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  padding:40px 20px 60px;
}
.mission-header { text-align:center; margin-bottom:48px; animation:fadeUp .6s ease both; }
.mission-eyebrow { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.22em; color:rgba(56,189,248,.75); text-transform:uppercase; margin-bottom:14px; display:flex; align-items:center; justify-content:center; gap:12px; }
.mission-eyebrow::before, .mission-eyebrow::after { content:''; width:60px; height:1px; background:rgba(56,189,248,.2); }
.mission-title { font-family:'Orbitron',monospace; font-size:38px; font-weight:900; color:#fff; letter-spacing:.04em; line-height:1.1; margin-bottom:10px; text-shadow:0 0 60px rgba(56,189,248,.15); }
.mission-subtitle { font-family:'DM Sans',sans-serif; font-size:14px; font-weight:300; color:rgba(200,220,255,.72); letter-spacing:.04em; max-width:640px; text-align:center; }

.mission-cards { display:flex; gap:24px; flex-wrap:wrap; justify-content:center; max-width:960px; }

.mission-card {
  width:280px; border-radius:12px; overflow:hidden; position:relative;
  background:rgba(6,16,36,0.7); border:1px solid rgba(56,189,248,.12);
  backdrop-filter:blur(20px);
  box-shadow:0 8px 32px rgba(0,0,0,.4), inset 0 1px 0 rgba(56,189,248,.08);
  animation:fadeUp .6s ease both;
  display:flex; flex-direction:column;
}
.mission-card:nth-child(2) { animation-delay:.1s; }
.mission-card:nth-child(3) { animation-delay:.2s; }

.mission-card.locked { cursor: default; border-color: rgba(255,255,255,.05) !important; box-shadow: 0 4px 16px rgba(0,0,0,.3) !important; }
.mission-card.locked:hover { transform: none !important; border-color: rgba(255,255,255,.05) !important; box-shadow: 0 4px 16px rgba(0,0,0,.3) !important; }
.mission-card.locked .mc-body { opacity: 0.42; }
.mission-card.locked .mc-icon { filter: grayscale(1) brightness(.5); }
.mission-card.locked .mc-accent { opacity: 0.2; }

.mc-accent { height:3px; background:linear-gradient(90deg,transparent,rgba(56,189,248,.8),transparent); }

.mc-badge { font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.12em; text-transform:uppercase; padding:4px 12px; border-radius:20px; background:rgba(56,189,248,.12); color:rgba(56,189,248,.95); border:1px solid rgba(56,189,248,.4); text-shadow:0 0 10px rgba(56,189,248,.4); }
.mc-top-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.mc-domain { font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:rgba(200,220,255,.72); margin-bottom:6px; }

.mc-body { padding:24px 22px 22px; flex:1; display:flex; flex-direction:column; }
.mc-num { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.2em; color:rgba(200,220,255,.72); margin-bottom:10px; }
.mc-stars { font-size:13px; color:rgba(250,204,21,.75); letter-spacing:1px; text-shadow:0 0 8px rgba(250,204,21,.4); margin-bottom:0; }
.mc-icon { width:44px; height:44px; margin-bottom:0; }
.mc-desc { flex:1; }
.mc-title { font-family:'Orbitron',monospace; font-size:15px; font-weight:700; color:#fff; letter-spacing:.04em; margin-bottom:8px; }
.mc-desc { font-family:'DM Sans',sans-serif; font-size:12px; font-weight:300; color:rgba(200,220,255,.78); line-height:1.6; margin-bottom:16px; }
.mc-footer { display:flex; align-items:center; justify-content:space-between; padding-top:14px; border-top:1px solid rgba(56,189,248,.08); }

.mc-status { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.1em; display:flex; align-items:center; gap:6px; }
.mc-status.unlocked-s { color:var(--green); }
.mc-status.locked-s   { color:rgba(200,220,255,.72); }
.mc-dot-s { width:6px; height:6px; border-radius:50%; }
.mc-dot-s.green { background:var(--green); box-shadow:0 0 6px rgba(74,222,128,.6); animation:statusDot 2.4s ease infinite; }
.mc-dot-s.grey  { background:rgba(200,220,255,.2); }

.mp-level-label { font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:.12em; color:rgba(56,189,248,.55); text-align:center; margin-top:12px; text-transform:uppercase; transition:color .4s; }
.mp-level-label.complete { color:var(--green); text-shadow:0 0 12px rgba(74,222,128,.4); }
.mc-launch-btn {
  margin:0 22px 22px;
  width:calc(100% - 44px);
  padding:11px;
  font-family:'Orbitron',monospace; font-size:10px; font-weight:700; letter-spacing:.16em;
  background:rgba(56,189,248,.06); border:1px solid rgba(56,189,248,.3); color:var(--blue2);
  border-radius:6px; cursor:pointer; transition:all .2s; text-align:center;
}
.mc-launch-btn:hover { background:rgba(56,189,248,.14); border-color:rgba(56,189,248,.6); box-shadow:0 0 16px rgba(56,189,248,.15); }
.mc-launch-btn.locked-btn {
  opacity: 1 !important;
  cursor: default !important;
  pointer-events: none !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  color: rgba(255,255,255,.2) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 9px;
  letter-spacing: .1em !important;
  font-size: 9px !important;
}
.mc-launch-btn.locked-btn svg { flex-shrink: 0; }
.mc-launch-btn.replay-btn { border-color:rgba(74,222,128,.4); color:rgba(74,222,128,.9); }
.mc-launch-btn.replay-btn:hover { background:rgba(74,222,128,.08); border-color:rgba(74,222,128,.6); }
.mc-launch-btn.next-up { animation:nextPulse 2.4s ease-in-out infinite; }
@keyframes nextPulse {
  0%,100% { border-color:rgba(56,189,248,.4); box-shadow:0 0 0 rgba(56,189,248,0); }
  50%     { border-color:rgba(56,189,248,.8); box-shadow:0 0 18px rgba(56,189,248,.2); }
}

.mission-progress { margin-top:40px; animation:fadeUp .6s ease .3s both; display:flex; flex-direction:column; align-items:center; gap:0; }
.mp-label { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.16em; color:rgba(200,220,255,.72); text-transform:uppercase; text-align:center; margin-bottom:10px; }
/* legacy dots — hidden, replaced by mastery meter */
.mp-dots { display:none; }
.mp-dot { width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); transition:all .3s; }
.mp-dot.done { background:var(--green); border-color:rgba(74,222,128,.4); box-shadow:0 0 8px rgba(74,222,128,.4); }
.mp-dot.active { background:rgba(56,189,248,.5); border-color:rgba(56,189,248,.7); box-shadow:0 0 8px rgba(56,189,248,.4); animation:pulse 1.5s ease infinite; }

/* Mastery meter */
.mastery-wrap { display:flex; flex-direction:column; align-items:center; gap:8px; }
.mastery-label { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.18em; color:rgba(200,220,255,.75); text-transform:uppercase; }
.mastery-bar { display:flex; gap:8px; align-items:center; }
.mastery-seg { width:64px; height:10px; border-radius:5px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); transition:all .5s ease; }
.mastery-seg.filled { background:var(--green); border-color:rgba(74,222,128,.4); box-shadow:0 0 8px rgba(74,222,128,.45); }
.mastery-seg.filled.s1 { background:rgba(74,222,128,.7); }
.mastery-seg.filled.s2 { background:rgba(74,222,128,.85); }
.mastery-seg.filled.s3 { background:var(--green); box-shadow:0 0 12px rgba(74,222,128,.6); }
.mastery-seg.active { background:rgba(56,189,248,.25); border-color:rgba(56,189,248,.5); box-shadow:0 0 6px rgba(56,189,248,.3); animation:segPulse 2s ease-in-out infinite; }
@keyframes segPulse { 0%,100%{opacity:.6} 50%{opacity:1} }
.mastery-count { font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:.1em; color:rgba(56,189,248,.55); margin-left:6px; transition:color .4s; }
.mastery-count.complete { color:var(--green); text-shadow:0 0 10px rgba(74,222,128,.5); }
.clearance-label { font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.18em; color:rgba(200,220,255,.75); text-transform:uppercase; margin-top:8px; transition:color .4s, text-shadow .4s; }
.clearance-label.active-rank { color:rgba(56,189,248,.95); font-weight:600; text-shadow:0 0 14px rgba(56,189,248,.45); }
.clearance-label.guardian { color:var(--green); font-weight:700; font-size:12px; text-shadow:0 0 16px rgba(74,222,128,.55); animation:securedPulse 2.4s ease-in-out infinite; }

/* Title unlock banner */
.title-unlock {
  display:none; margin-top:14px; padding:18px 28px;
  background:rgba(3,12,26,0.97);
  border:1px solid rgba(74,222,128,.25); border-radius:8px;
  text-align:center; animation:popIn .5s ease both;
}
.title-unlock.show { display:block; }
.title-unlock-eyebrow { font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.2em; color:rgba(74,222,128,.45); text-transform:uppercase; margin-bottom:6px; }
.title-unlock-name { font-family:'Orbitron',monospace; font-size:16px; font-weight:900; letter-spacing:.12em; color:var(--green); text-shadow:0 0 20px rgba(74,222,128,.45); }
.title-unlock-sub { font-family:'DM Sans',sans-serif; font-size:10px; color:rgba(200,220,255,.75); margin-top:6px; line-height:1.5; }
.cert-view-btn {
  display:inline-block; margin-top:14px; padding:9px 28px;
  font-family:'Orbitron',monospace; font-size:9px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  background:rgba(74,222,128,.08); border:1px solid rgba(74,222,128,.35);
  color:var(--green); border-radius:6px; cursor:pointer;
  transition:background .2s, border-color .2s, box-shadow .2s;
}
.contact-footer {
  margin-top:48px; padding-top:24px;
  border-top:1px solid rgba(56,189,248,.08);
  text-align:center; animation:fadeUp .6s ease .5s both;
}
.contact-footer p {
  font-family:'DM Sans',sans-serif; font-size:13px;
  color:rgba(200,220,255,.45); line-height:1.6; margin:0;
}
.contact-footer a {
  font-family:'JetBrains Mono',monospace; font-size:12px;
  color:rgba(56,189,248,.7); text-decoration:none;
  letter-spacing:.04em; transition:color .2s, text-shadow .2s;
}
.contact-footer a:hover {
  color:rgba(56,189,248,1); text-shadow:0 0 12px rgba(56,189,248,.3);
}
.cert-view-btn:hover {
  background:rgba(74,222,128,.18); border-color:rgba(74,222,128,.65);
  box-shadow:0 0 16px rgba(74,222,128,.2);
}

.mp-level-label { display:none; } /* superseded by mastery meter */

/* ════════════════════════════════════════════
   SHARED GAME CHROME (banner, shell, sidebar)
════════════════════════════════════════════ */
.page-wrap { display:flex; flex-direction:column; min-height:100%; }
.sticky-header { position:sticky; top:0; z-index:10; padding-top:0; }
.int-banner { position:relative; margin:0 164px 0 18px; display:grid; grid-template-columns: auto 1fr; align-items:stretch; min-height:70px; animation:fadeUp .5s ease both; overflow:hidden; }
.int-banner > * + * { border-left:1px solid rgba(56,189,248,.12); }
.ib-brand { display:flex; align-items:center; gap:12px; padding:0 26px 0 20px; flex-shrink:0; }
.h-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; background:var(--green); animation:statusDot 2.4s ease infinite; }
.h-title { font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--text); }
.ib-center { display:flex; align-items:center; gap:36px; padding:0 28px 0 32px; }
.ib-lbl { font-size:8px; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); margin-bottom:5px; }
.ib-num-wrap { display:flex; align-items:center; gap:8px; }
.ib-num-col { display:flex; flex-direction:column; flex-shrink:0; }
.ib-int-pop { position:absolute; top:0; left:50%; font-family:'Orbitron',monospace; font-size:16px; font-weight:900; letter-spacing:.04em; opacity:0; pointer-events:none; white-space:nowrap; z-index:20; }
.ib-int-pop.pop { animation:intPopAnim 1.2s ease forwards; }
.ib-int-pop.gain    { color:var(--green); text-shadow:0 0 16px rgba(74,222,128,1); }
.ib-int-pop.penalty { color:var(--red);   text-shadow:0 0 16px rgba(239,68,68,1); }
.ib-num { font-family:'Orbitron',monospace; font-size:40px; font-weight:900; letter-spacing:-.03em; line-height:1; transition:color .35s, text-shadow .35s; color:var(--green); text-shadow:0 0 28px rgba(74,222,128,.5); }
.ib-num.orange { color:var(--orange); text-shadow:0 0 22px rgba(251,146,60,.4); }
.ib-num.red    { color:var(--red);    text-shadow:0 0 22px rgba(239,68,68,.55); animation:pulse .6s ease infinite; }
.ib-unit { font-family:'Orbitron',monospace; font-size:18px; color:var(--dim); }
.ib-bar-wrap { flex:1; display:flex; flex-direction:column; justify-content:center; gap:3px; }
.ib-bar-top { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:2px; margin-top:10px; }
/* Compact number — hidden on desktop, shown on mobile in .ib-bar-top */
.ib-num-compact-wrap { display:none; align-items:baseline; gap:1px; }
.ib-num-compact { font-family:'Orbitron',monospace; font-size:20px; font-weight:900; letter-spacing:-.02em; color:var(--green); text-shadow:0 0 16px rgba(74,222,128,.45); transition:color .35s, text-shadow .35s; line-height:1; }
.ib-num-compact.orange { color:var(--orange); text-shadow:0 0 14px rgba(251,146,60,.4); }
.ib-num-compact.red    { color:var(--red);    text-shadow:0 0 14px rgba(239,68,68,.5); animation:pulse .6s ease infinite; }
.ib-unit-compact { font-family:'Orbitron',monospace; font-size:12px; color:var(--dim); }
.ib-bar-track { height:10px; background:rgba(255,255,255,.05); border-radius:5px; overflow:hidden; border:1px solid rgba(255,255,255,.07); margin-top:-6px; }
.ib-bar-fill { height:100%; width:100%; border-radius:5px; transition:width .6s ease, background-color .6s ease; background:var(--green); box-shadow:0 0 12px rgba(74,222,128,.4); }
.ib-bar-fill.orange { background:var(--orange); box-shadow:0 0 12px rgba(251,146,60,.35); }
.ib-bar-fill.red    { background:var(--red);    box-shadow:0 0 12px rgba(239,68,68,.4); }
.ib-bar-sub { display:flex; align-items:center; gap:12px; margin-top:6px; }
.ib-severity { display:none; }
.ib-seg { border-radius:2px 2px 0 0; background:rgba(255,255,255,.08); transition:background .4s ease, box-shadow .4s ease; width:5px; }
.ib-seg:nth-child(1)  { height:4px; }  .ib-seg:nth-child(2)  { height:5px; }
.ib-seg:nth-child(3)  { height:7px; }  .ib-seg:nth-child(4)  { height:8px; }
.ib-seg:nth-child(5)  { height:10px; } .ib-seg:nth-child(6)  { height:11px; }
.ib-seg:nth-child(7)  { height:13px; } .ib-seg:nth-child(8)  { height:14px; }
.ib-seg:nth-child(9)  { height:16px; } .ib-seg:nth-child(10) { height:18px; }
.ib-seg.s1  { background:rgba(74,222,128,.9);  box-shadow:0 0 5px rgba(74,222,128,.5); }
.ib-seg.s2  { background:rgba(74,222,128,.9);  box-shadow:0 0 5px rgba(74,222,128,.5); }
.ib-seg.s3  { background:rgba(134,239,172,.9); box-shadow:0 0 5px rgba(134,239,172,.4); }
.ib-seg.s4  { background:rgba(163,230,53,.9);  box-shadow:0 0 5px rgba(163,230,53,.4); }
.ib-seg.s5  { background:rgba(202,211,41,.9);  box-shadow:0 0 5px rgba(202,211,41,.4); }
.ib-seg.s6  { background:rgba(250,204,21,.9);  box-shadow:0 0 5px rgba(250,204,21,.4); }
.ib-seg.s7  { background:rgba(251,176,60,.9);  box-shadow:0 0 5px rgba(251,176,60,.4); }
.ib-seg.s8  { background:rgba(251,146,60,.9);  box-shadow:0 0 5px rgba(251,146,60,.4); }
.ib-seg.s9  { background:rgba(248,100,50,.9);  box-shadow:0 0 5px rgba(248,100,50,.4); }
.ib-seg.s10 { background:rgba(239,68,68,1);    box-shadow:0 0 8px rgba(239,68,68,.65); animation:pulse .5s ease infinite; }
.ib-drain-label { font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); white-space:nowrap; transition:color .4s; }
.ib-drain-label.draining { color:rgba(239,68,68,.75); }
.ib-drain-label.secured { color:rgba(74,222,128,1); text-shadow:0 0 10px rgba(74,222,128,.6); animation:securedPulse 2s ease-in-out infinite; }
.ib-drain-label.flash-up   { animation:none; color:rgba(239,68,68,.95) !important; }
.ib-drain-label.flash-down { animation:none; color:rgba(74,222,128,.95) !important; }
.ib-submit-cta { font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--green); background:rgba(74,222,128,.1); border:1px solid rgba(74,222,128,.5); border-radius:4px; padding:14px 14px; cursor:pointer; width:100%; margin-top:14px; text-align:center; justify-content:center; font-size:12px; animation:ctaPulse 1.2s ease infinite; transition:background .2s, box-shadow .2s; }
.ib-submit-cta:hover { background:rgba(74,222,128,.2); box-shadow:0 0 18px rgba(74,222,128,.35); }
.ib-delta { font-family:'Orbitron',monospace; font-size:13px; font-weight:700; letter-spacing:.05em; opacity:0; transform:translateY(4px); white-space:nowrap; }
.ib-delta.visible  { animation:statusReveal 1.9s ease forwards; }
.ib-delta.gain    { color:var(--green); text-shadow:0 0 10px rgba(74,222,128,.6); }
.ib-delta.penalty { color:var(--red);   text-shadow:0 0 10px rgba(239,68,68,.6); }

.shell { position:relative; z-index:1; display:grid; grid-template-columns:1fr 272px; grid-template-rows:1fr; flex:1; padding:10px 18px 14px; gap:10px; box-sizing:border-box; min-height:560px; }
.console-col { grid-column:1; grid-row:1; }
.shell > .card.diag { grid-column:2; grid-row:1; }

.console { padding:0; display:flex; flex-direction:column; gap:12px; overflow:hidden; position:relative; animation:fadeUp .5s ease .1s both; background:none !important; border:none !important; box-shadow:none !important; backdrop-filter:none !important; }
.scanline { position:absolute; left:0; right:0; height:2px; top:-4px; background:linear-gradient(90deg,transparent,rgba(56,189,248,.7),rgba(56,189,248,1),rgba(56,189,248,.7),transparent); pointer-events:none; z-index:20; opacity:0; }
.scanline.run { animation:scanAnim 1.8s ease forwards; }
.payload { flex:1; overflow-y:auto; min-height:0; font-family:'JetBrains Mono',monospace; font-size:11.5px; line-height:1.9; color:var(--text); letter-spacing:.01em; padding-bottom:16px; }
.payload::-webkit-scrollbar { width:4px; }
.payload::-webkit-scrollbar-thumb { background:rgba(56,189,248,.22); border-radius:2px; }

.sb-timer { background:rgba(239,68,68,.04); border:1px solid rgba(239,68,68,.14); border-radius:8px; padding:11px 14px; flex-shrink:0; display:flex; align-items:center; justify-content:space-between; }
.sb-timer-lbl { font-size:8px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
.sb-timer-val { font-family:'Orbitron',monospace; font-size:32px; font-weight:900; color:#fff; line-height:1; transition:color .3s; letter-spacing:-.02em; }
.sb-timer-val.warn     { color:var(--orange); text-shadow:0 0 10px rgba(251,146,60,.4); }
.sb-timer-val.critical { color:var(--red);    text-shadow:0 0 12px rgba(239,68,68,.5); animation:pulse .5s ease infinite; }

.btn { font-family:'DM Sans',sans-serif; font-size:11px; font-weight:500; padding:9px 16px; border-radius:6px; cursor:pointer; transition:all .2s; letter-spacing:.03em; width:100%; text-align:center; }

.diag { grid-column:2/3; padding:16px 15px; display:flex; flex-direction:column; gap:10px; animation:slideIn .5s ease .05s both; position:sticky; top:10px; height:calc(100vh - 110px); max-height:700px; overflow:hidden; box-sizing:border-box; }
.diag-cats { display:flex; flex-direction:column; gap:10px; flex-shrink:0; }
.diag-actions { margin-top:auto; display:flex; flex-direction:column; gap:8px; flex-shrink:0; padding-top:12px; border-top:1px solid rgba(56,189,248,.08); }
.diag-title { font-family:'Orbitron',monospace; font-size:8px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--dim); padding-bottom:11px; border-bottom:1px solid rgba(56,189,248,.1); flex-shrink:0; }
.diag-cat { background:rgba(56,189,248,.02); border:1px solid rgba(56,189,248,.08); border-radius:8px; padding:11px 12px; transition:all .35s ease; flex-shrink:0; }
.diag-cat.exposed          { border-color:rgba(239,68,68,.2);  background:rgba(239,68,68,.04); }
.diag-cat.exposed-pii      { border-color:rgba(251,146,60,.2); background:rgba(251,146,60,.04); }
.diag-cat.exposed-int      { border-color:rgba(250,204,21,.18); background:rgba(250,204,21,.03); }
.diag-cat.secured { border-color:rgba(74,222,128,.22); background:rgba(74,222,128,.04); }
.diag-cat.pulse   { animation:diagPulse .7s ease; }
.dc-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.dc-name { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); letter-spacing:.06em; }
.dc-pill { font-size:8px; padding:2px 8px; border-radius:10px; font-weight:500; letter-spacing:.07em; transition:all .3s; }
.dc-pill.exposed      { background:rgba(239,68,68,.14);  color:var(--red);    border:1px solid rgba(239,68,68,.28); }
.dc-pill.exposed-pii  { background:rgba(251,146,60,.14); color:var(--orange); border:1px solid rgba(251,146,60,.28); }
.dc-pill.exposed-int  { background:rgba(250,204,21,.14); color:var(--yellow); border:1px solid rgba(250,204,21,.28); }
.dc-pill.secured { background:rgba(74,222,128,.12); color:var(--green); border:1px solid rgba(74,222,128,.28); }
.dc-segments { display:flex; gap:3px; margin-bottom:6px; height:5px; }
.dc-seg { flex:1; height:100%; border-radius:2px; background:rgba(255,255,255,.1); box-shadow:none; transition:background .35s, box-shadow .35s; position:relative; overflow:hidden; }
.dc-seg::after { content:''; position:absolute; inset:0; border-radius:2px; background:var(--green); box-shadow:0 0 5px rgba(74,222,128,.4); transform:translateX(-100%); transition:none; }
.dc-seg.secured::after { transform:translateX(0); transition:transform .4s cubic-bezier(.4,0,.2,1); }
.diag-cat.secured .dc-seg::after { transform:translateX(0); transition:transform .4s cubic-bezier(.4,0,.2,1); }
.diag-cat.secured .dc-seg:nth-child(2)::after { transition-delay:.06s; }
.diag-cat.secured .dc-seg:nth-child(3)::after { transition-delay:.12s; }
.dc-progress-track { display:none; }
.dc-progress-fill  { display:none; }
.diag-secured { flex:1; margin-top:0; padding:16px 0 16px 0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; animation:fadeUp .5s ease both; }
.diag-secured-icon { width:56px; height:56px; filter:drop-shadow(0 0 12px rgba(74,222,128,.5)); animation:securedGlow 2s ease-in-out infinite; }
.diag-secured-label { font-family:'Orbitron',monospace; font-size:9px; font-weight:700; letter-spacing:.18em; color:var(--green); text-transform:uppercase; }
.diag-secured-sub { font-family:'JetBrains Mono',monospace; font-size:8px; color:rgba(74,222,128,.5); letter-spacing:.06em; margin-bottom:4px; }

/* ════════════════════════════════════════════
   TOKEN STYLES
════════════════════════════════════════════ */
.tok { display:inline; cursor:default; border-radius:3px; padding:1px 3px; transition:background .15s, color .15s; }
.tok.clickable { cursor:pointer; background:rgba(56,189,248,.08); border-radius:3px; padding:2px 5px; border-bottom:1px solid rgba(56,189,248,.3); }
.tok.clickable:hover { background:rgba(56,189,248,.18); }
.tok.clickable.noise { background:rgba(56,189,248,.08); border-bottom-color:rgba(56,189,248,.3); color:rgba(56,189,248,.85); }
.tok.clickable.noise:hover { background:rgba(56,189,248,.18); }
.tok.hint-scan { background:rgba(56,189,248,.2) !important; border-bottom-color:rgba(56,189,248,.6) !important; box-shadow:0 0 8px rgba(56,189,248,.3); }
.tok.ghost { background:rgba(74,222,128,.15) !important; transition:background .1s; }
.tok.redacted { cursor:default !important; display:inline !important; border-radius:3px; padding:2px 5px !important; font-weight:600; border-bottom:none !important; text-decoration:none; }
.tok.redacted .redact-badge { font-family:'Orbitron',monospace; font-size:8.5px; font-weight:700; letter-spacing:.1em; color:#fff !important; }
.tok.cat-credential { background:#dc2626 !important; color:#fff !important; border:1px solid #dc2626 !important; }
.tok.cat-pii        { background:#ea580c !important; color:#fff !important; border:1px solid #ea580c !important; }
.tok.cat-internal   { background:#ca8a04 !important; color:#fff !important; border:1px solid #ca8a04 !important; }
.tok.cat-safe       { background:#64748b !important; color:#fff !important; border:1px solid #64748b !important; }
/* Hallucination section token styles */
.tok.safe-decoy { cursor:pointer; border-radius:3px; padding:1px 3px; transition:background .12s; text-decoration:underline; text-decoration-color:var(--blue); text-decoration-thickness:1px; text-underline-offset:2px; }
.tok.safe-decoy:hover { background:rgba(56,189,248,.12); }
.tok.hallucination  { cursor:pointer; border-radius:3px; padding:1px 3px; transition:background .12s; text-decoration:underline; text-decoration-color:var(--blue); text-decoration-thickness:1px; text-underline-offset:2px; }
.tok.hallucination:hover { background:rgba(251,146,60,.15); }
.tok.flagged-correct          { background:rgba(239,68,68,.2);   color:var(--red);    border:1px solid rgba(239,68,68,.4);   cursor:default; border-bottom:none; padding:2px 7px; border-radius:4px; }
.tok.flagged-correct-figure   { background:rgba(239,68,68,.2);  color:var(--red); border:1px solid rgba(239,68,68,.4);  cursor:default; border-bottom:none; padding:2px 7px; border-radius:4px; }
.tok.flagged-correct-law      { background:rgba(250,204,21,.18); color:var(--yellow); border:1px solid rgba(250,204,21,.4);  cursor:default; border-bottom:none; padding:2px 7px; border-radius:4px; }
.tok.flagged-wrong            { background:rgba(148,163,184,.12); color:rgba(148,163,184,.8); border:1px solid rgba(148,163,184,.3); cursor:default; border-bottom:none; padding:2px 7px; border-radius:4px; }
.tok.flagged-missed           { background:rgba(239,68,68,.1); color:rgba(239,68,68,.6); border:1px solid rgba(239,68,68,.25); cursor:default; border-bottom:none; padding:2px 7px; border-radius:4px; text-decoration:line-through; text-decoration-color:rgba(239,68,68,.4); }
/* Injection section */
.tok.injection { background:rgba(250,204,21,.08); text-decoration:underline; text-decoration-color:var(--blue); text-decoration-thickness:1px; text-underline-offset:2px; cursor:pointer; }
.tok.injection:hover { background:rgba(250,204,21,.18); }
.tok.injection-flagged { background:rgba(239,68,68,.2); color:var(--red); border:1px solid rgba(239,68,68,.4); cursor:default; border-bottom:none; padding:2px 7px; border-radius:4px; }

/* ════════════════════════════════════════════
   CAT POPUP
════════════════════════════════════════════ */
.cat-popup {
  position:fixed; z-index:500;
  background:rgba(4,12,28,0.97);
  border:1px solid rgba(56,189,248,.28);
  border-radius:12px;
  padding:16px 16px 14px;
  box-shadow:0 16px 48px rgba(0,0,0,.75), 0 0 0 1px rgba(56,189,248,.07), 0 0 28px rgba(56,189,248,.06);
  min-width:480px;
  display:none;
  animation:popIn .18s cubic-bezier(.34,1.56,.64,1);
}
.cat-popup.show { display:block; }
.cat-popup-lbl {
  font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(56,189,248,.8);
  margin-bottom:12px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(56,189,248,.1);
}
.cat-btns { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.cat-btn {
  font-family:'Orbitron',monospace; font-size:9px; font-weight:700; letter-spacing:.12em;
  padding:13px 8px;
  border-radius:7px;
  cursor:pointer; transition:all .18s; border:1px solid transparent;
  line-height:1.2;
}
.cat-btn-cred { background:var(--cat-cred-bg); color:var(--cat-cred); border-color:var(--cat-cred-border); }
.cat-btn-cred:hover { background:rgba(239,68,68,.32); border-color:var(--red); box-shadow:0 0 18px rgba(239,68,68,.32), inset 0 1px 0 rgba(255,255,255,.06); }
.cat-btn-pii  { background:var(--cat-pii-bg); color:var(--cat-pii); border-color:var(--cat-pii-border); }
.cat-btn-pii:hover  { background:rgba(251,146,60,.32); border-color:var(--orange); box-shadow:0 0 18px rgba(251,146,60,.3), inset 0 1px 0 rgba(255,255,255,.06); }
.cat-btn-int  { background:var(--cat-int-bg); color:var(--cat-int); border-color:var(--cat-int-border); }
.cat-btn-int:hover  { background:rgba(250,204,21,.28); border-color:var(--yellow); box-shadow:0 0 16px rgba(250,204,21,.26), inset 0 1px 0 rgba(255,255,255,.06); }
.cat-btn-safe { background:rgba(148,163,184,.1); color:rgba(200,215,235,.8); border-color:rgba(148,163,184,.38); }
.cat-btn-safe:hover { background:rgba(148,163,184,.22); border-color:rgba(148,163,184,.72); box-shadow:0 0 12px rgba(148,163,184,.15), inset 0 1px 0 rgba(255,255,255,.06); }
.cat-popup-close { position:absolute; top:9px; right:11px; font-size:11px; color:var(--dim); cursor:pointer; line-height:1; background:none; border:none; }
.cat-popup-close:hover { color:var(--text); }

/* ════════════════════════════════════════════
   BRIEFING OVERLAY
════════════════════════════════════════════ */
.briefing-overlay { position:fixed; inset:0; z-index:300; background:#040a14; display:flex; align-items:center; justify-content:center; transition:opacity .5s ease; overflow:hidden; }
.briefing-overlay.hidden { opacity:0; pointer-events:none; }
.briefing-card { width:540px; max-width:calc(100vw - 32px); background:rgba(8,20,45,0.55); border:1px solid rgba(255,255,255,.18); border-radius:14px; overflow:hidden; backdrop-filter:blur(32px); box-shadow:0 40px 80px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.07); animation:verdictIn .5s cubic-bezier(.34,1.56,.64,1) both; position:relative; z-index:1; }
.briefing-top-bar { height:3px; display:block; background:linear-gradient(90deg, transparent, rgba(56,189,248,.8) 30%, rgba(56,189,248,.5) 70%, transparent); }
.briefing-top-bar.m1 { background:linear-gradient(90deg, transparent, rgba(56,189,248,.9) 30%, rgba(56,189,248,.6) 70%, transparent); }
.briefing-top-bar.m2 { background:linear-gradient(90deg, transparent, rgba(56,189,248,.9) 30%, rgba(56,189,248,.6) 70%, transparent); }
.briefing-top-bar.m3 { background:linear-gradient(90deg, transparent, rgba(56,189,248,.9) 30%, rgba(56,189,248,.6) 70%, transparent); }
.briefing-graphic { position:relative; height:120px; display:flex; align-items:center; justify-content:center; border-bottom:1px solid rgba(255,255,255,.08); overflow:hidden; }
.briefing-graphic .b-ring { position:absolute; width:110px; height:110px; border-radius:50%; border:1px solid rgba(56,189,248,.25); animation:ringPulse 2s ease-out infinite; }
.briefing-graphic .b-ring2 { animation-delay:.7s; }
.briefing-graphic svg.b-shield { width:58px; height:58px; filter:drop-shadow(0 0 16px rgba(56,189,248,.4)); position:relative; z-index:2; animation:shieldPop .6s cubic-bezier(.34,1.56,.64,1) .1s both; }
.briefing-graphic .b-lbl { position:absolute; bottom:12px; left:0; right:0; text-align:center; font-family:'Orbitron',monospace; font-size:9px; font-weight:700; letter-spacing:.22em; color:rgba(255,255,255,.75); text-transform:uppercase; animation:scanReveal .5s ease .4s both; }
.briefing-body { padding:24px 28px 24px; }
.briefing-stat-strip { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:18px; }
.bss-item { background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.1); border-radius:8px; padding:11px 13px; }
.bss-lbl { font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:rgba(200,220,255,.72); margin-bottom:5px; }
.bss-val { font-family:'Orbitron',monospace; font-size:13px; font-weight:700; color:#fff; letter-spacing:.02em; }
.briefing-divider { height:1px; background:rgba(255,255,255,.08); margin:0 0 16px; }
.briefing-text { font-family:'DM Sans',sans-serif; font-size:12px; color:rgba(200,220,255,.82); line-height:1.8; font-weight:300; margin-bottom:16px; }
.briefing-text strong { color:#ffffff; font-weight:600; }
.briefing-text .hl { color:var(--blue2); font-weight:600; }
.briefing-legend { display:flex; flex-direction:column; gap:0; margin-bottom:16px; }
.b-leg { display:flex; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.07); font-size:10.5px; }
.b-leg:last-child { border-bottom:none; }
.b-leg-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.b-leg-name { font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; letter-spacing:.04em; flex-shrink:0; min-width:120px; }
.b-leg-desc { font-family:'JetBrains Mono',monospace; color:var(--dim); font-size:9px; letter-spacing:.01em; }
.briefing-mechanics { display:flex; flex-direction:column; gap:8px; margin-bottom:20px; padding-top:14px; border-top:1px solid rgba(255,255,255,.06); }
.b-mech { font-family:'DM Sans',sans-serif; font-size:11px; color:rgba(200,220,255,.7); line-height:1.55; padding:10px 14px; background:rgba(56,189,248,.04); border:1px solid rgba(56,189,248,.12); border-radius:8px; border-left:3px solid rgba(56,189,248,.4); }
.briefing-start-btn { width:100%; padding:13px; font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; background:transparent; border:1px solid rgba(255,255,255,.2); border-radius:8px; color:rgba(255,255,255,.85); cursor:pointer; transition:all .2s; }
.briefing-start-btn:hover { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.4); }

/* ════════════════════════════════════════════
   VERDICT
════════════════════════════════════════════ */
.verdict-overlay { position:fixed; inset:0; z-index:200; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zM28 100L0 84V50l28-16 28 16v34L28 100z' fill='none' stroke='%2338bdf8' stroke-opacity='0.045' stroke-width='1'/%3E%3C/svg%3E") 0 0/56px 100px fixed,#040a14; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .45s ease; overflow-y:auto; padding:24px 16px 40px; }
.verdict-overlay.show { opacity:1; pointer-events:all; }
.verdict-card { background:rgba(8,20,45,0.55); border:1px solid rgba(255,255,255,.18); border-radius:14px; width:480px; max-width:100%; backdrop-filter:blur(32px); box-shadow:0 40px 80px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.07); overflow:hidden; animation:verdictIn .5s cubic-bezier(.34,1.56,.64,1) both; position:relative; z-index:1; flex-shrink:0; }
.v-bar { height:3px; }
.v-bar.pass    { background:linear-gradient(90deg,transparent,var(--green),transparent); }
.v-bar.fail    { background:linear-gradient(90deg,transparent,var(--red),transparent); }
.v-bar.partial { background:linear-gradient(90deg,transparent,var(--orange),transparent); }
.v-success-graphic { position:relative; height:160px; overflow:hidden; background:linear-gradient(180deg, rgba(74,222,128,.06) 0%, rgba(6,16,36,0) 100%); display:flex; align-items:center; justify-content:center; border-bottom:1px solid rgba(74,222,128,.12); }
.v-success-graphic .ring { position:absolute; width:120px; height:120px; border-radius:50%; border:2px solid rgba(74,222,128,.5); animation:ringPulse 1.8s ease-out infinite; }
.v-success-graphic .ring.frozen { animation:none; opacity:0; }
.v-success-graphic .ring2 { animation-delay:.6s; }
.v-success-graphic .ring3 { animation-delay:1.2s; }
.v-success-graphic .shield-wrap { position:relative; z-index:2; animation:shieldPop .7s cubic-bezier(.34,1.56,.64,1) .1s both; }
.v-success-graphic svg.shield { width:80px; height:80px; filter:drop-shadow(0 0 18px rgba(74,222,128,.5)); }
.v-success-graphic .particle { position:absolute; width:5px; height:5px; border-radius:50%; background:var(--green); opacity:0; }
.v-success-graphic.animate .particle { animation:particleUp .9s ease-out forwards; }
.v-success-graphic.animate .particle:nth-child(5) { left:38%; bottom:30%; animation-delay:.1s; }
.v-success-graphic.animate .particle:nth-child(6) { left:55%; bottom:25%; animation-delay:.25s; width:4px; height:4px; background:var(--blue2); }
.v-success-graphic.animate .particle:nth-child(7) { left:65%; bottom:40%; animation-delay:.15s; width:3px; height:3px; }
.v-success-graphic.animate .particle:nth-child(8) { left:28%; bottom:35%; animation-delay:.3s; width:4px; height:4px; background:rgba(250,204,21,.8); }
.v-success-graphic.animate .particle:nth-child(9) { left:72%; bottom:30%; animation-delay:.05s; width:3px; height:3px; }
.v-success-graphic.animate .particle:nth-child(10){ left:48%; bottom:20%; animation-delay:.2s; width:6px; height:6px; background:rgba(56,189,248,.9); }
.v-success-graphic .success-lbl { position:absolute; bottom:12px; left:0; right:0; text-align:center; font-family:'Orbitron',monospace; font-size:9px; font-weight:700; letter-spacing:.22em; color:rgba(74,222,128,.7); text-transform:uppercase; animation:scanReveal .5s ease .6s both; }
.v-fail-graphic { position:relative; height:140px; overflow:hidden; background:linear-gradient(180deg, rgba(239,68,68,.07) 0%, transparent 100%); display:flex; align-items:center; justify-content:center; border-bottom:1px solid rgba(255,255,255,.08); }
.v-fail-shield-wrap { position:relative; z-index:2; animation:shieldPop .5s cubic-bezier(.34,1.56,.64,1) .1s both; }
.v-fail-shield-wrap svg { width:80px; height:80px; filter:drop-shadow(0 0 16px rgba(239,68,68,.45)); }
.v-fail-scan-line { position:absolute; left:0; right:0; height:1px; background:rgba(239,68,68,.4); animation:failScan 1.2s ease-out .3s both; }
.v-fail-lbl { position:absolute; bottom:12px; left:0; right:0; text-align:center; font-family:'Orbitron',monospace; font-size:9px; font-weight:700; letter-spacing:.22em; color:rgba(239,68,68,.7); text-transform:uppercase; animation:scanReveal .5s ease .5s both; }
.v-body { padding:26px 28px 24px; }
.v-eyebrow { font-family:'Orbitron',monospace; font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:rgba(56,189,248,.8); margin-bottom:4px; }
.v-step-prog { display:flex; gap:6px; align-items:center; margin-bottom:14px; }
.vsp-dot { width:26px; height:4px; border-radius:4px; background:rgba(255,255,255,.12); transition:background .3s, box-shadow .3s; }
.vsp-dot.active { background:rgba(255,255,255,.95); box-shadow:0 0 8px rgba(255,255,255,.35); }
.vsp-dot.done { background:rgba(56,189,248,.65); }
.v-verdict-msg { font-family:'DM Sans',sans-serif; font-size:13px; font-weight:300; color:rgba(200,220,255,.75); line-height:1.8; margin-bottom:16px; }
.v-divider { height:1px; background:rgba(56,189,248,.1); margin:16px 0; }
.v-ml { font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:rgba(200,220,255,.72); margin-bottom:5px; }
.v-mv { font-family:'Orbitron',monospace; font-size:18px; font-weight:700; color:#fff; }
.v-mv.green { color:var(--green); } .v-mv.orange { color:var(--orange); } .v-mv.red { color:var(--red); }
.v-single-metric { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; margin-bottom:16px; background:rgba(56,189,248,.05); border:1px solid rgba(56,189,248,.14); border-radius:10px; }

/* ── Verdict star rating ── */
.v-stars { display:flex; gap:4px; font-size:20px; }
.v-star {
  display:inline-block; opacity:0; transform:scale(0.3);
  animation:starReveal .4s cubic-bezier(.34,1.56,.64,1) forwards;
}
.v-star.filled { color:rgba(250,204,21,.85); text-shadow:0 0 10px rgba(250,204,21,.5), 0 0 20px rgba(250,204,21,.2); }
.v-star.empty  { color:rgba(250,204,21,.2); text-shadow:none; }
.v-star.filled.star-glow { animation:starReveal .4s cubic-bezier(.34,1.56,.64,1) forwards, starPulse .6s ease .4s; }
.v-star:nth-child(1) { animation-delay:0.15s; }
.v-star:nth-child(2) { animation-delay:0.35s; }
.v-star:nth-child(3) { animation-delay:0.55s; }
.v-star.filled.star-glow:nth-child(1) { animation-delay:0.15s, 0.55s; }
.v-star.filled.star-glow:nth-child(2) { animation-delay:0.35s, 0.75s; }
.v-star.filled.star-glow:nth-child(3) { animation-delay:0.55s, 0.95s; }
@keyframes starReveal {
  0%   { opacity:0; transform:scale(0.3); }
  60%  { opacity:1; transform:scale(1.15); }
  100% { opacity:1; transform:scale(1); }
}
@keyframes starPulse {
  0%   { text-shadow:0 0 10px rgba(250,204,21,.5), 0 0 20px rgba(250,204,21,.2); }
  50%  { text-shadow:0 0 18px rgba(250,204,21,.8), 0 0 36px rgba(250,204,21,.4); }
  100% { text-shadow:0 0 10px rgba(250,204,21,.5), 0 0 20px rgba(250,204,21,.2); }
}
/* Fail state: no stars, show text */
.v-stars.fail-text { font-family:'Orbitron',monospace; font-size:12px; font-weight:700; color:var(--red); letter-spacing:.06em; }
.v-rows { margin-bottom:16px; }
.v-rows-lbl { font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:rgba(200,220,255,.72); margin-bottom:10px; }
.v-row { display:flex; justify-content:space-between; align-items:center; padding:9px 0; border-bottom:1px solid rgba(255,255,255,.05); font-size:12px; }
.v-row:last-child { border-bottom:none; }
.v-rk { color:var(--dim); font-family:'JetBrains Mono',monospace; font-size:11px; }
.v-rk-sub { font-family:'DM Sans',sans-serif; font-size:9px; font-weight:400; letter-spacing:.04em; color:rgba(200,220,255,.72); text-transform:none; margin-left:4px; }
.v-rv { font-weight:600; color:var(--text); font-size:12px; }
.v-rv.green { color:var(--green); } .v-rv.red { color:var(--red); } .v-rv.orange { color:var(--orange); } .v-rv.yellow { color:var(--yellow); }
.v-reset { width:100%; padding:13px; background:transparent; border:1px solid rgba(255,255,255,.18); border-radius:10px; color:rgba(255,255,255,.7); font-family:'DM Sans',sans-serif; font-size:12px; font-weight:500; letter-spacing:.04em; cursor:pointer; transition:all .2s; margin-top:8px; }
.v-reset:hover { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.35); color:rgba(255,255,255,.9); }
.v-retry-btn { width:100%; padding:14px; background:rgba(56,189,248,.08); border:1px solid rgba(56,189,248,.35); border-radius:10px; color:var(--blue2); font-family:'Orbitron',monospace; font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; transition:all .2s; margin-top:10px; }
.v-retry-btn:hover { background:rgba(56,189,248,.16); border-color:rgba(56,189,248,.6); box-shadow:0 0 16px rgba(56,189,248,.15); }
.v-menu-btn { width:100%; padding:14px; background:rgba(56,189,248,.08); border:1px solid rgba(56,189,248,.35); border-radius:10px; color:var(--blue2); font-family:'Orbitron',monospace; font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; transition:all .2s; margin-top:10px; }
.v-menu-btn:hover { background:rgba(56,189,248,.16); border-color:rgba(56,189,248,.6); box-shadow:0 0 16px rgba(56,189,248,.15); }
.v-next-btn { width:100%; padding:14px; margin-top:18px; font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; background:rgba(56,189,248,.14); border:1px solid rgba(56,189,248,.45); border-radius:10px; color:#fff; cursor:pointer; transition:all .2s; }
.v-next-btn:hover { background:rgba(56,189,248,.22); border-color:rgba(56,189,248,.7); box-shadow:0 0 24px rgba(56,189,248,.2); }
.v-scroll-hint { display:none; text-align:center; padding:10px 0 8px; color:rgba(56,189,248,.4); font-size:18px; animation:pulse 2s ease infinite; }

/* ════════════════════════════════════════════
   AI ASSISTANT UI (Section 1 payload)
════════════════════════════════════════════ */
.gpt-window { background:#ffffff; border-radius:12px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,.12); display:flex; flex-direction:column; border:1px solid #e5e5e5; }
.gpt-sidebar { background:#f7f7f8; width:100%; padding:8px 10px; display:flex; align-items:center; gap:8px; border-bottom:1px solid #e5e5e5; flex-shrink:0; }
.gpt-sidebar-icon { width:20px; height:20px; display:flex; align-items:center; justify-content:center; color:#999; font-size:12px; pointer-events:none; }
.gpt-sidebar-new { width:20px; height:20px; display:flex; align-items:center; justify-content:center; color:#999; font-size:14px; pointer-events:none; margin-left:auto; }
.gpt-sidebar-history { font-family:'DM Sans',sans-serif; font-size:10px; color:#666; padding:2px 8px; border-radius:6px; background:#ececec; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1; min-width:0; }
.gpt-titlebar { background:#ffffff; border-bottom:1px solid #e5e5e5; padding:8px 14px; display:flex; align-items:center; gap:8px; flex-shrink:0; }
.gpt-logo { width:22px; height:22px; flex-shrink:0; border-radius:50%; background:linear-gradient(135deg,#6366f1,#8b5cf6); display:flex; align-items:center; justify-content:center; font-size:11px; color:#fff; font-weight:700; }
.gpt-title-text { font-family:'DM Sans',sans-serif; font-size:13px; font-weight:600; color:#111; flex:1; }
.gpt-model-pill { font-family:'DM Sans',sans-serif; font-size:9px; font-weight:500; padding:3px 10px; border-radius:20px; background:#f0f0f0; color:#666; border:1px solid #ddd; pointer-events:none; }
.gpt-share-btn { font-family:'DM Sans',sans-serif; font-size:10px; color:#999; pointer-events:none; padding:4px; }
.gpt-warning-bar { background:#eff6ff; border-bottom:2px solid #93c5fd; padding:10px 14px; display:flex; align-items:center; gap:6px; flex-shrink:0; font-family:'DM Sans',sans-serif; font-size:11px; font-weight:400; color:#1e40af; }
.gpt-warning-bar strong { font-weight:700; }
.gpt-chat-area { background:#ffffff; padding:16px 16px 10px; flex:1; display:flex; flex-direction:column; gap:14px; }
.gpt-user-msg { display:flex; justify-content:flex-end; }
.gpt-user-bubble { background:#f0f0f0; border-radius:18px 18px 4px 18px; padding:11px 15px; max-width:92%; font-family:'DM Sans',sans-serif; font-size:12px; line-height:1.75; color:#1a1a1a; }
.gpt-user-meta { font-family:'DM Sans',sans-serif; font-size:9px; color:#888; text-align:right; margin-bottom:5px; display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.gpt-user-avatar { width:16px; height:16px; border-radius:50%; flex-shrink:0; background:linear-gradient(135deg,#6366f1,#8b5cf6); display:inline-flex; align-items:center; justify-content:center; font-size:7px; font-weight:700; color:#fff; }
.gpt-user-bubble .tok.clickable { color:#1a1a1a; background:rgba(99,102,241,.10); border-bottom-color:rgba(99,102,241,.35); }
.gpt-user-bubble .tok.clickable:hover { background:rgba(99,102,241,.20); border-radius:3px; }
.gpt-user-bubble .tok.clickable.noise { background:rgba(99,102,241,.10); border-bottom-color:rgba(99,102,241,.35); color:#1a1a1a; }
.gpt-user-bubble .tok.clickable.noise:hover { background:rgba(99,102,241,.20); }
.gpt-attach-row { margin-top:12px; }
.gpt-attach-chip { display:inline-flex; align-items:center; gap:6px; padding:7px 14px; background:rgba(56,189,248,.07); border:1px solid rgba(56,189,248,.4); border-radius:8px; cursor:pointer; transition:background .15s, border-color .15s, box-shadow .15s; font-size:11px; animation:chipGlow 2s ease-in-out infinite; }
.gpt-attach-chip:hover { background:rgba(56,189,248,.18); border-color:rgba(56,189,248,.85); box-shadow:0 0 0 4px rgba(56,189,248,.18),0 0 18px rgba(56,189,248,.28); animation:none; }
.gpt-attach-chip.opened { animation:none; border-color:#bbb; background:#f5f5f5; box-shadow:none; }
.gpt-attach-chip.nudge { animation:chipGlow 2s ease-in-out infinite; }
.chip-callout { display:flex; align-items:center; gap:5px; font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(56,189,248,.8); margin-bottom:5px; }
.chip-callout-arrow { animation:chipArrowBounce 1.2s ease-in-out infinite; display:inline-block; font-size:11px; }
.chip-callout.hidden { display:none; }
.chip-icon { font-size:14px; }
.chip-name { font-family:'DM Sans',sans-serif; font-size:11px; font-weight:600; color:#1a1a1a; }
.chip-arrow { font-size:9px; color:#999; }
.word-doc-overlay { display:none; margin-top:10px; background:#fafafa; border:1px solid #d0d0d0; border-radius:8px; overflow:hidden; box-shadow:0 4px 16px rgba(0,0,0,.25); }
.word-doc-overlay.open { display:block; }
.word-doc-titlebar { background:#1e3a8a; padding:6px 12px; display:flex; align-items:center; gap:8px; }
.word-doc-titlebar-text { font-family:'DM Sans',sans-serif; font-size:10px; color:#fff; flex:1; }
.word-doc-ribbon { background:#f3f4f6; border-bottom:1px solid #d1d5db; padding:4px 12px; display:flex; gap:12px; }
.word-doc-ribbon span { font-family:'DM Sans',sans-serif; font-size:9px; color:#374151; pointer-events:none; padding:2px 4px; }
.word-doc-body { padding:16px; font-family:'DM Sans',sans-serif; font-size:11px; line-height:1.75; color:#222; }
.word-doc-body .tok.clickable { background:rgba(99,102,241,.10); color:#222; border-bottom-color:rgba(99,102,241,.35); }
.word-doc-body .tok.clickable:hover { background:rgba(99,102,241,.22); }
.word-doc-body .tok.clickable.noise { background:rgba(99,102,241,.10); border-bottom-color:rgba(99,102,241,.35); color:#222; }
.word-doc-body .tok.clickable.noise:hover { background:rgba(99,102,241,.22); }
.word-doc-title { font-size:16px; font-weight:700; margin-bottom:4px; color:#111; }
.word-doc-subtitle { font-size:9px; color:#888; margin-bottom:12px; letter-spacing:.04em; }
.word-doc-section { font-weight:600; color:#1e3a8a; margin-bottom:6px; }
.gpt-input-bar { background:#ffffff; border-top:1px solid #e5e5e5; padding:10px 12px; }
.gpt-input-field { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; background:#f0f0f0; border-radius:22px; border:1px solid #ddd; }
.gpt-input-field-icons { display:flex; gap:8px; }
.gpt-input-icon { width:26px; height:26px; background:#aaa; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; color:#fff; pointer-events:none; }

/* ════════════════════════════════════════════
   AI RESPONSE UI (Section 2 - Hallucination)
════════════════════════════════════════════ */
.ai-response-window { background:#0d1117; border-radius:12px; border:1px solid rgba(56,189,248,.2); overflow:hidden; box-shadow:0 8px 32px rgba(0,0,0,.5); }
.ai-response-header { background:rgba(6,16,36,.8); border-bottom:1px solid rgba(56,189,248,.15); padding:10px 16px; display:flex; align-items:center; gap:10px; }
.ai-logo { width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#6366f1,#8b5cf6); display:flex; align-items:center; justify-content:center; font-size:14px; color:#fff; flex-shrink:0; }
.ai-response-title { font-family:'DM Sans',sans-serif; font-size:12px; font-weight:600; color:var(--text); flex:1; }
.ai-model-badge { font-family:'JetBrains Mono',monospace; font-size:8px; padding:3px 8px; border-radius:20px; background:rgba(99,102,241,.15); color:rgba(147,149,251,1); border:1px solid rgba(99,102,241,.3); }
.ai-warning-strip { background:rgba(56,189,248,.04); border-bottom:1px solid rgba(56,189,248,.15); padding:7px 16px; font-family:'DM Sans',sans-serif; font-size:10px; color:rgba(56,189,248,.65); display:flex; align-items:center; gap:6px; }
.ai-scenario-frame {
  background: linear-gradient(135deg, rgba(6,16,36,.95) 0%, rgba(10,24,50,.95) 100%);
  border: 1px solid rgba(56,189,248,.35);
  border-left: 4px solid rgba(56,189,248,.9);
  border-radius: 12px;
  padding: 16px 20px 16px 18px;
  margin: 14px 0 16px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 400;
  color: rgba(200,225,255,.92);
  line-height: 1.7;
  box-shadow: 0 4px 24px rgba(0,0,0,.4), 0 0 20px rgba(56,189,248,.06), inset 0 1px 0 rgba(56,189,248,.1);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
  animation: scenarioEntry .5s ease both;
}
@keyframes scenarioEntry { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
.ai-scenario-frame .scenario-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(56,189,248,.1); border: 1px solid rgba(56,189,248,.35);
  flex-shrink: 0; animation: scenarioIconPulse 2.5s ease-in-out infinite;
}
.ai-scenario-frame .scenario-icon svg { width: 14px; height: 14px; }
@keyframes scenarioIconPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(56,189,248,.15); } 50% { box-shadow: 0 0 0 6px rgba(56,189,248,.08); } }
.ai-scenario-frame .scenario-header {
  display: flex; align-items: center; gap: 10px;
  font-size: 10px; font-family: 'Orbitron', monospace; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: rgba(56,189,248,.85); margin-bottom: 6px;
}
.ai-scenario-frame .scenario-action {
  font-size: 14px; font-weight: 500; color: rgba(230,240,255,.95); line-height: 1.6;
}
.ai-scenario-frame .scenario-action strong { color: #7dd3fc; font-weight: 600; }
.ai-scenario-frame strong { color: rgba(56,189,248,.95); font-weight: 600; }
.ai-response-body { padding:18px; color:var(--text); font-family:'DM Sans',sans-serif; font-size:12.5px; line-height:1.85; }
.ai-response-body h4 { font-family:'Orbitron',monospace; font-size:11px; letter-spacing:.06em; color:var(--blue2); margin:14px 0 8px; }
.ai-response-body .cite { font-family:'JetBrains Mono',monospace; font-size:10px; color:rgba(200,220,255,.75); display:block; margin:6px 0; padding-left:12px; border-left:2px solid rgba(56,189,248,.2); }
.ai-response-body .num-stat { font-family:'Orbitron',monospace; font-size:13px; color:var(--yellow); }
.s2-section-nav { display:flex; align-items:center; justify-content:space-between; padding:12px 0 4px; border-top:1px solid rgba(56,189,248,.1); margin-top:14px; }
.s2-section-counter { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:rgba(56,189,248,.7); }
.s2-next-btn { font-family:'Orbitron',monospace; font-size:9px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; padding:10px 18px; background:rgba(56,189,248,.07); border:1px solid rgba(56,189,248,.35); border-radius:6px; color:var(--blue2); cursor:pointer; transition:all .18s; }
.s2-next-btn:hover { background:rgba(56,189,248,.14); border-color:rgba(56,189,248,.65); box-shadow:0 0 12px rgba(56,189,248,.15); }
@keyframes s2FadeIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.ai-flag-instruction { background:rgba(56,189,248,.04); border:1px solid rgba(56,189,248,.15); border-radius:8px; padding:10px 14px; margin-bottom:12px; font-family:'JetBrains Mono',monospace; font-size:9px; color:rgba(56,189,248,.8); letter-spacing:.04em; display:flex; align-items:center; gap:8px; }

/* ════════════════════════════════════════════
   EMAIL UI (Section 3 - Prompt Injection)
════════════════════════════════════════════ */
.email-client { background:#0d1117; border-radius:12px; border:1px solid rgba(56,189,248,.15); overflow:hidden; box-shadow:0 8px 32px rgba(0,0,0,.5); }
.email-toolbar { background:rgba(6,16,36,.9); border-bottom:1px solid rgba(56,189,248,.1); padding:8px 16px; display:flex; align-items:center; gap:12px; }
.email-toolbar-title { font-family:'Orbitron',monospace; font-size:9px; letter-spacing:.14em; color:rgba(56,189,248,.8); flex:1; }
.email-sender-row { padding:12px 16px; border-bottom:1px solid rgba(56,189,248,.08); display:flex; align-items:center; gap:12px; }
.email-avatar { width:36px; height:36px; border-radius:50%; background:linear-gradient(135deg,#3b82f6,#1d4ed8); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; color:#fff; flex-shrink:0; }
.email-sender-info { flex:1; }
.email-from { font-family:'DM Sans',sans-serif; font-size:12px; font-weight:600; color:var(--text); }
.email-meta { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); margin-top:2px; }
.email-subject { padding:10px 16px; border-bottom:1px solid rgba(56,189,248,.08); font-family:'DM Sans',sans-serif; font-size:13px; font-weight:600; color:var(--text); }
.email-body { padding:16px; font-family:'DM Sans',sans-serif; font-size:12px; line-height:1.85; color:rgba(200,220,255,.85); }
.email-body p { margin-bottom:10px; }
.email-body .email-sig { margin-top:16px; font-size:11px; color:rgba(200,220,255,.72); border-top:1px solid rgba(56,189,248,.08); padding-top:10px; }
.injection-warning {
  background: rgba(6,16,36,.92);
  border: 1px solid rgba(56,189,248,.25);
  border-left: 3px solid rgba(56,189,248,.7);
  border-radius: 10px;
  padding: 14px 18px;
  margin: 14px 0 16px;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: rgba(200,225,255,.9);
  line-height: 1.65;
  box-shadow: 0 4px 20px rgba(0,0,0,.35), inset 0 1px 0 rgba(56,189,248,.08);
}

/* Timer row in sidebar (Section 3) */
.s3-timer-display { font-family:'Orbitron',monospace; font-size:28px; font-weight:900; color:var(--red); text-align:center; letter-spacing:-.02em; }
.s3-timer-display.warn { color:var(--orange); }
.s3-timer-display.ok   { color:var(--green); }

/* ════════════════════════════════════════════
   BACK TO MENU BTN
════════════════════════════════════════════ */
.back-btn { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.12em; color:rgba(200,220,255,.72); background:none; border:none; cursor:pointer; padding:4px 8px; transition:color .2s; text-transform:uppercase; }
.back-btn:hover { color:var(--blue2); }

/* ════════════════════════════════════════════
   SECTION 2 SIDEBAR ITEMS
════════════════════════════════════════════ */
.hal-flag-counter { background:rgba(56,189,248,.04); border:1px solid rgba(56,189,248,.12); border-radius:8px; padding:10px 12px; flex-shrink:0; }
.hal-fc-lbl { font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:rgba(56,189,248,.8); margin-bottom:6px; }
.hal-fc-row { display:flex; align-items:baseline; gap:6px; }
.hal-fc-num { font-family:'Orbitron',monospace; font-size:28px; font-weight:900; color:var(--blue2); }
.hal-fc-total { font-family:'Orbitron',monospace; font-size:14px; color:var(--dim); }
.hal-fc-label { font-family:'JetBrains Mono',monospace; font-size:8px; color:var(--dim); letter-spacing:.06em; margin-top:4px; }
/* Submit button: neutral/blue always, green when all found */
.hal-submit-btn { width:100%; padding:13px; font-family:'Orbitron',monospace; font-size:10px; font-weight:700; letter-spacing:.16em; background:rgba(56,189,248,.06); border:1px solid rgba(56,189,248,.22); color:rgba(56,189,248,.55); border-radius:6px; cursor:pointer; transition:all .3s; }
.hal-submit-btn:hover { background:rgba(56,189,248,.12); border-color:rgba(56,189,248,.45); color:rgba(56,189,248,.85); }
.hal-submit-btn.ready { background:rgba(74,222,128,.1); border-color:rgba(74,222,128,.5); color:var(--green); animation:ctaPulse 1.2s ease infinite; }
.hal-submit-btn.ready:hover { background:rgba(74,222,128,.2); box-shadow:0 0 18px rgba(74,222,128,.3); }

/* Hallucination diag cats */
.diag-cat.hal-cat { border-color:rgba(56,189,248,.15); background:rgba(56,189,248,.03); }
.diag-cat.hal-cat.secured { border-color:rgba(74,222,128,.22); background:rgba(74,222,128,.04); }
.diag-cat.hal-cat.wrong   { border-color:rgba(239,68,68,.2); background:rgba(239,68,68,.04); }

/* ════════════════════════════════════════════
   REAL-WORLD ANCHOR (verdict screen addition)
════════════════════════════════════════════ */
.v-anchor { margin:16px 0 0; background:rgba(56,189,248,.05); border:1px solid rgba(56,189,248,.16); border-radius:10px; padding:14px 16px; }
.v-anchor-lbl { font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.16em; text-transform:uppercase; color:rgba(56,189,248,.8); margin-bottom:8px; }
.v-anchor-text { font-family:'DM Sans',sans-serif; font-size:12px; line-height:1.7; color:rgba(200,220,255,.82); font-weight:300; }
.v-precision-bonus { display:inline-block; font-family:'Orbitron',monospace; font-size:8px; letter-spacing:.14em; background:rgba(74,222,128,.1); border:1px solid rgba(74,222,128,.3); color:var(--green); padding:3px 9px; border-radius:10px; margin-top:6px; }
.v-bonus-wrap { margin:10px 0 2px; }


/* ════════════════════════════════════════════
   M2: NOTES DRAWER & INLINE TOGGLE
════════════════════════════════════════════ */
/* Toggle buttons — Meeting Notes / AI Report */
.s2-view-toggle {
  display:flex; gap:8px; margin-top:12px;
}
/* Mobile-only sticky bar for M2 report/notes toggle */
.s2-mobile-bar {
  display:none; /* hidden on desktop */
}
@media(max-width:768px){
  .s2-mobile-bar {
    display:flex; gap:8px;
    background:rgba(6,16,36,.97);
    padding:8px 12px;
    border-bottom:1px solid rgba(56,189,248,.15);
  }
  /* Hide inline toggles on mobile — the sticky bar replaces them */
  .s2-view-toggle { display:none !important; }
}
.s2-view-btn {
  flex:1; padding:10px 14px;
  font-family:'Orbitron',monospace; font-size:10px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  background:rgba(56,189,248,.06); border:1px solid rgba(56,189,248,.2);
  color:rgba(56,189,248,.5); cursor:pointer; transition:all .2s;
  border-radius:8px; text-align:center;
}
.s2-view-btn:hover { background:rgba(56,189,248,.12); border-color:rgba(56,189,248,.4); color:rgba(56,189,248,.8); }
.s2-view-btn.active {
  background:rgba(30,80,120,.85); border-color:rgba(56,189,248,.6);
  color:#fff; box-shadow:0 0 12px rgba(56,189,248,.2);
}
.s2-view-btn.pulsing { animation:notesPulse 2.2s ease-in-out infinite; }
@keyframes notesPulse {
  0%,100% { background:rgba(56,189,248,.06); border-color:rgba(56,189,248,.2); color:rgba(56,189,248,.5); }
  50%     { background:rgba(40,120,180,.25); border-color:rgba(56,189,248,.55); color:rgba(56,189,248,.9); box-shadow:0 0 16px rgba(56,189,248,.3); }
}
/* Notes view inside console — full-height like payload */
.s2-notes-view {
  padding:0;
  font-family:'DM Sans',sans-serif; font-size:12.5px; line-height:1.85; color:rgba(200,220,255,.75);
}
/* Document-feel wrapper for meeting notes */
.s2-notes-view .ai-response-window {
  background:#f8f9fa; border:1px solid #d0d7de; border-radius:8px;
  box-shadow:0 1px 4px rgba(0,0,0,.08), 0 8px 24px rgba(0,0,0,.06);
}
.s2-notes-view .ai-response-body {
  background:#ffffff; color:#1f2328; font-family:Georgia,'Times New Roman',serif;
  font-size:13px; line-height:2; padding:24px 28px; border-radius:0 0 8px 8px;
}
.s2-notes-view .ai-response-body h4 {
  font-family:'DM Sans',sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.04em; color:#57606a; margin:18px 0 8px;
  text-transform:uppercase; border-bottom:1px solid #d8dee4; padding-bottom:6px;
}
.s2-notes-view .ai-response-body strong { color:#1f2328; font-weight:700; }
.s2-notes-view .ai-response-body .cite {
  font-family:'JetBrains Mono',monospace; font-size:10px; color:#656d76;
  border-left:2px solid #d0d7de; padding-left:12px;
}
.s2-notes-view .ai-response-body .num-stat {
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:700; color:#1a7f37;
}
.s2-notes-docbar {
  background:#f0f3f6; border-bottom:1px solid #d0d7de; padding:8px 16px;
  font-family:'DM Sans',sans-serif; font-size:11px; font-weight:600;
  color:#57606a; display:flex; align-items:center; gap:6px;
  border-radius:8px 8px 0 0;
}
.s2-notes-docicon { font-size:14px; }
.s2-notes-title {
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:700;
  color:#1f2328; margin-bottom:12px;
  padding-bottom:8px; border-bottom:1px solid #d8dee4;
}
.s2-notes-list {
  list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px;
}
.s2-notes-list li {
  padding:8px 12px; border-left:3px solid #d0d7de;
  background:#f6f8fa; border-radius:0 4px 4px 0;
  font-family:Georgia,'Times New Roman',serif; font-size:13px; line-height:1.8; color:#1f2328;
}
.s2-notes-list li strong { color:#1f2328; font-weight:700; }

/* ════════════════════════════════════════════
   MICRO-FEEDBACK TEACH LINE
════════════════════════════════════════════ */
.teach-flash { font-family:'DM Sans',sans-serif; font-size:10.5px; font-weight:400; color:rgba(200,220,255,.82); line-height:1.5; opacity:0; transform:translateY(3px); }
.teach-flash.visible { animation:teachReveal 2.2s ease forwards; }

/* ════════════════════════════════════════════
   M2 ACCURATE TOKEN (neutral visual at start)
════════════════════════════════════════════ */
.tok.accurate-claim { cursor:pointer; border-radius:3px; padding:1px 3px; transition:background .12s; text-decoration:underline; text-decoration-color:var(--blue); text-decoration-thickness:1px; text-underline-offset:2px; }
.tok.accurate-claim:hover { background:rgba(200,220,255,.08); }

/* ════════════════════════════════════════════
   M3 TIMEOUT REVEAL MESSAGE
════════════════════════════════════════════ */
.s3-timeout-msg { background:rgba(239,68,68,.06); border:1px solid rgba(239,68,68,.2); border-radius:8px; padding:10px 14px; margin-bottom:10px; font-family:'DM Sans',sans-serif; font-size:11px; line-height:1.6; color:rgba(200,220,255,.82); display:none; }
.s3-timeout-msg.show { display:block; }
.s3-timeout-msg strong { color:var(--red); }

/* ════════════════════════════════════════════
   COMPLETION / CERTIFICATE SCREEN
════════════════════════════════════════════ */
.cert-overlay {
  position:fixed; inset:0; z-index:3000;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zM28 100L0 84V50l28-16 28 16v34L28 100z' fill='none' stroke='%2338bdf8' stroke-opacity='0.045' stroke-width='1'/%3E%3C/svg%3E") 0 0/56px 100px fixed,rgba(2,6,16,0.96);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .4s ease;
  overflow-y:auto; padding:24px 16px 40px;
  backdrop-filter:blur(6px);
}
.cert-overlay.show { opacity:1; pointer-events:all; }
/* ═══════════════════════════════════════════
   CERTIFICATE — solid dark tactical design
══════════════════════════════════════════════ */
.cert-card {
  width:560px; max-width:100%;
  background:#030c1a;
  border:1px solid rgba(56,189,248,.18);
  border-radius:12px; overflow:hidden;
  box-shadow:0 40px 80px rgba(0,0,0,.75), 0 0 0 1px rgba(56,189,248,.06), 0 0 48px rgba(56,189,248,.04);
  animation:verdictIn .55s cubic-bezier(.34,1.56,.64,1) both;
  position:relative; flex-shrink:0;
}
.cert-top-bar {
  height:3px;
  background:linear-gradient(90deg,transparent,rgba(56,189,248,.8) 30%,rgba(74,222,128,.9) 70%,transparent);
}

/* ── header / graphic section ── */
.cert-graphic {
  position:relative; height:180px; overflow:hidden;
  background:linear-gradient(180deg,rgba(74,222,128,.06) 0%,rgba(56,189,248,.03) 60%,transparent 100%);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  border-bottom:1px solid rgba(56,189,248,.1);
}
/* scan line sweeping across graphic */
.cert-graphic::before {
  content:''; position:absolute; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(74,222,128,.35),transparent);
  animation:scanLine 3.5s ease-in-out infinite; top:50%;
}
@keyframes scanLine { 0%,100%{top:10%;opacity:0} 20%{opacity:.7} 80%{opacity:.7} 90%{top:90%;opacity:0} }
.cert-ring { position:absolute; border-radius:50%; border:1px solid rgba(74,222,128,.28); animation:ringPulse 2.4s ease-out infinite; }
.cert-ring.r1 { width:150px; height:150px; }
.cert-ring.r2 { width:104px; height:104px; animation-delay:.8s; }
.cert-ring.r3 { width:200px; height:200px; animation-delay:1.6s; border-color:rgba(56,189,248,.14); }
.cert-star {
  position:relative; z-index:2;
  font-family:'Orbitron',monospace; font-size:52px; line-height:1;
  color:var(--green);
  filter:drop-shadow(0 0 12px rgba(74,222,128,.6)) drop-shadow(0 0 28px rgba(74,222,128,.25));
  animation:shieldPop .7s cubic-bezier(.34,1.56,.64,1) .1s both, hexGlow 2.8s ease 1s infinite;
}
.cert-badge {
  position:relative; z-index:2;
  font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700;
  letter-spacing:.24em; color:rgba(74,222,128,.6); text-transform:uppercase;
  animation:scanReveal .5s ease .5s both;
}

/* ── body ── */
.cert-body { padding:24px 28px 6px; }
.cert-eyebrow {
  font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(56,189,248,.75); margin-bottom:10px;
}
.cert-eyebrow::before { content:'// '; color:rgba(56,189,248,.25); }
.cert-title {
  display:flex; flex-direction:column; gap:6px;
  line-height:1.15; margin-bottom:10px;
}
.cert-name {
  font-family:'Orbitron',monospace; font-size:24px; font-weight:900;
  letter-spacing:.06em; color:#fff;
  text-shadow:0 0 20px rgba(255,255,255,.15);
}
.cert-designation {
  font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--green);
  text-shadow:0 0 16px rgba(74,222,128,.3);
}
.cert-subtitle {
  font-family:'DM Sans',sans-serif; font-size:12px; color:rgba(200,220,255,.78);
  line-height:1.7; margin-bottom:22px; font-weight:300;
}

/* ── integrity scores ── */
.cert-scores-header {
  font-family:'JetBrains Mono',monospace; font-size:8px; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(56,189,248,.7);
  margin-bottom:10px; padding-bottom:8px;
  border-bottom:1px solid rgba(56,189,248,.08);
}
.cert-scores { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:22px; }
.cert-score-item {
  background:rgba(56,189,248,.03); border:1px solid rgba(56,189,248,.12);
  border-radius:8px; padding:14px 10px; text-align:center;
  transition:border-color .2s;
}
.cert-score-item:hover { border-color:rgba(56,189,248,.25); }
.cert-score-lbl {
  font-family:'JetBrains Mono',monospace; font-size:7.5px; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(200,220,255,.72); margin-bottom:8px; line-height:1.5;
}
.cert-score-val { font-family:'Orbitron',monospace; font-size:22px; font-weight:700; color:var(--green); }
.cert-score-val.orange { color:var(--orange); }
.cert-score-val.red    { color:var(--red); }

/* ── date & actions ── */
.cert-date {
  font-family:'JetBrains Mono',monospace; font-size:8.5px; color:rgba(200,220,255,.72);
  letter-spacing:.1em; margin-bottom:20px; padding:10px 12px;
  background:rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.05);
  border-radius:6px; display:flex; align-items:center; gap:8px;
}
.cert-date::before { content:'○'; color:rgba(56,189,248,.35); font-size:9px; }
.cert-actions { display:flex; gap:10px; padding:0 28px 24px; }
.cert-print-btn {
  flex:1; padding:13px; font-family:'Orbitron',monospace; font-size:10px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  background:rgba(74,222,128,.08); border:1px solid rgba(74,222,128,.4); color:var(--green);
  border-radius:8px; cursor:pointer; transition:all .2s; text-align:center;
  animation:ctaPulse 1.8s ease infinite;
}
.cert-print-btn:hover { background:rgba(74,222,128,.16); border-color:rgba(74,222,128,.7); box-shadow:0 0 20px rgba(74,222,128,.2); }
.cert-menu-btn {
  flex:1; padding:13px; font-family:'Orbitron',monospace; font-size:10px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  background:rgba(56,189,248,.04); border:1px solid rgba(56,189,248,.22); color:rgba(56,189,248,.8);
  border-radius:8px; cursor:pointer; transition:all .2s; text-align:center;
}
.cert-menu-btn:hover { background:rgba(56,189,248,.1); border-color:rgba(56,189,248,.5); }

/* Print / PDF — preserve dark theme */
@media print {
  * { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }
  body > *:not(#certOverlay) { display:none !important; }
  #certOverlay {
    position:static !important; opacity:1 !important; padding:20px !important;
    background:#020810 !important; display:flex !important;
    align-items:flex-start !important; justify-content:center !important;
  }
  .cert-card { box-shadow:none !important; max-width:680px; width:100%; }
  .cert-actions { display:none !important; }
  #gameCtrlBar { display:none !important; }
}

/* ════════════════════════════════════════════
   LEARNING OBJECTIVES INTERSTITIAL
════════════════════════════════════════════ */
/* ── Cinematic Objectives Overlay ── */
.obj-overlay {
  position:fixed; inset:0; z-index:350;
  background:#030810;
  display:flex; align-items:center; justify-content:center; flex-direction:column;
  opacity:0; pointer-events:none;
  transition:opacity .5s ease;
  overflow:hidden;
}
.obj-overlay.show { opacity:1; pointer-events:all; }

/* Animated grid background */
.obj-grid-bg {
  position:absolute; inset:0; overflow:hidden; pointer-events:none;
  background:
    linear-gradient(rgba(56,189,248,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(56,189,248,.03) 1px, transparent 1px);
  background-size:60px 60px;
  mask-image:radial-gradient(ellipse 70% 60% at 50% 45%, black 0%, transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 45%, black 0%, transparent 100%);
  animation:gridDrift 20s linear infinite;
}
@keyframes gridDrift { 0%{transform:translate(0,0)} 100%{transform:translate(60px,60px)} }

/* Scan line sweep */
.obj-scan-line {
  position:absolute; left:0; right:0; height:2px; top:-2px;
  background:linear-gradient(90deg, transparent 0%, rgba(56,189,248,.5) 30%, rgba(56,189,248,.8) 50%, rgba(56,189,248,.5) 70%, transparent 100%);
  box-shadow:0 0 30px 8px rgba(56,189,248,.15);
  pointer-events:none; opacity:0;
}
.obj-scan-line.active { animation:objScanSweep 2s ease-in-out forwards; }
@keyframes objScanSweep { 0%{top:-2px;opacity:0} 5%{opacity:1} 95%{opacity:1} 100%{top:100%;opacity:0} }

/* Terminal log at top */
.obj-terminal {
  position:absolute; top:20px; left:20px; right:20px;
  font-family:'JetBrains Mono',monospace; font-size:10px; color:rgba(56,189,248,.35);
  letter-spacing:.04em; line-height:1.8; max-height:80px; overflow:hidden;
  pointer-events:none; opacity:0; transition:opacity .4s;
}
.obj-terminal.show { opacity:1; }
.obj-terminal div { opacity:0; animation:termLine .3s ease forwards; }
@keyframes termLine { from{opacity:0;transform:translateX(-8px)} to{opacity:1;transform:none} }

/* Central content wrapper */
.obj-center {
  display:flex; flex-direction:column; align-items:center; gap:0;
  z-index:2; width:600px; max-width:calc(100vw - 40px);
}

/* Priority badge */
.obj-priority {
  font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700;
  letter-spacing:.25em; text-transform:uppercase;
  color:#f87171; background:rgba(248,113,113,.08); border:1px solid rgba(248,113,113,.25);
  padding:6px 18px; border-radius:3px; margin-bottom:20px;
  opacity:0; transform:translateY(8px);
}
.obj-priority.show { animation:objFadeUp .5s ease forwards; }

/* Main heading — decrypt target */
.obj-heading {
  font-family:'Orbitron',monospace; font-size:28px; font-weight:900;
  color:#fff; text-align:center; letter-spacing:.06em; line-height:1.25;
  margin-bottom:10px; min-height:72px;
  text-shadow:0 0 60px rgba(56,189,248,.25);
  opacity:0;
}
.obj-heading.show { opacity:1; }

/* Subtitle */
.obj-sub {
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:300;
  color:rgba(200,220,255,.72); text-align:center; letter-spacing:.04em;
  margin-bottom:36px; opacity:0; transform:translateY(6px);
}
.obj-sub.show { animation:objFadeUp .5s ease forwards; }

/* Intro screen */
.intro-eyebrow {
  font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700;
  letter-spacing:.25em; text-transform:uppercase; color:rgba(56,189,248,.5);
  margin-bottom:16px;
}
.intro-heading {
  font-family:'Orbitron',monospace; font-size:24px; font-weight:800;
  color:#fff; text-align:center; letter-spacing:.04em; line-height:1.3;
  margin-bottom:12px; text-shadow:0 0 40px rgba(56,189,248,.2);
}
.intro-body {
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:400;
  color:rgba(200,220,255,.78); text-align:center; line-height:1.8;
  max-width:480px; margin-bottom:28px;
}
/* ── Objectives section ── */
.intro-objectives {
  width:100%; display:flex; flex-direction:column; align-items:center; gap:0;
  margin-bottom:36px; position:relative;
}
.intro-obj-title {
  font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700;
  color:rgba(56,189,248,.5); letter-spacing:.25em; text-transform:uppercase;
  margin-bottom:24px; text-align:center;
  opacity:0; transform:translateY(8px);
}
.intro-obj-title.reveal {
  animation:objTitleIn .6s cubic-bezier(.23,1,.32,1) forwards;
}
@keyframes objTitleIn {
  0% { opacity:0; transform:translateY(8px); }
  100% { opacity:1; transform:translateY(0); }
}
/* Decorative line under title */
.intro-obj-title::after {
  content:''; display:block; width:0; height:1px; margin:10px auto 0;
  background:linear-gradient(90deg, transparent, rgba(56,189,248,.4), transparent);
}
.intro-obj-title.reveal::after {
  animation:objLineExpand .8s .3s cubic-bezier(.23,1,.32,1) forwards;
}
@keyframes objLineExpand { to { width:120px; } }

.intro-obj-item {
  font-family:'DM Sans',sans-serif; font-size:13.5px; font-weight:400;
  color:rgba(255,255,255,.88); line-height:1.5; padding:16px 24px;
  display:flex; align-items:center; justify-content:center; gap:16px;
  width:100%; text-align:center;
  background:rgba(6,16,36,.5); border:1px solid rgba(56,189,248,.08);
  border-radius:10px; margin-bottom:10px; position:relative; overflow:hidden;
  opacity:0; transform:translateY(16px) scale(.97);
  transition:border-color .4s, background .4s, box-shadow .4s, transform .4s;
}
.intro-obj-item.reveal {
  animation:objItemIn .6s cubic-bezier(.23,1,.32,1) forwards;
}
.intro-obj-item:nth-child(2).reveal { animation-delay:0s; }
.intro-obj-item:nth-child(3).reveal { animation-delay:.12s; }
.intro-obj-item:nth-child(4).reveal { animation-delay:.24s; }
@keyframes objItemIn {
  0% { opacity:0; transform:translateY(16px) scale(.97); }
  100% { opacity:1; transform:translateY(0) scale(1); }
}
/* Shimmer sweep on reveal */
.intro-obj-item::after {
  content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background:linear-gradient(90deg, transparent 0%, rgba(56,189,248,.06) 40%, rgba(56,189,248,.1) 50%, rgba(56,189,248,.06) 60%, transparent 100%);
  pointer-events:none;
}
.intro-obj-item.reveal::after {
  animation:objShimmer .9s .3s ease forwards;
}
.intro-obj-item:nth-child(3).reveal::after { animation-delay:.42s; }
.intro-obj-item:nth-child(4).reveal::after { animation-delay:.54s; }
@keyframes objShimmer { to { left:100%; } }

.intro-obj-item:hover {}
.intro-obj-check {
  font-family:'Orbitron',monospace; font-size:10px; font-weight:800;
  color:rgba(56,189,248,.6); flex-shrink:0; width:30px; height:30px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(56,189,248,.2); border-radius:8px;
  background:rgba(56,189,248,.04); letter-spacing:.05em;
  transition:border-color .3s, box-shadow .3s;
}
.intro-obj-item:hover .intro-obj-check {}
.intro-obj-icon {
  font-size:16px; flex-shrink:0; width:22px; text-align:center;
  opacity:.7; transition:opacity .3s;
}
.intro-obj-item:hover .intro-obj-icon {}
.intro-meta {
  font-family:'JetBrains Mono',monospace; font-size:10px;
  color:rgba(200,220,255,.72); letter-spacing:.1em; margin-bottom:24px;
}

/* Threat cards */
.obj-threats {
  display:flex; flex-direction:column; gap:10px; width:100%; margin-bottom:36px;
}
.obj-threat {
  display:flex; align-items:center; gap:14px;
  background:rgba(56,189,248,.03); border:1px solid rgba(56,189,248,.1);
  border-radius:10px; padding:14px 18px;
  opacity:0; transform:translateX(-20px);
  transition:border-color .2s, background .2s;
}
.obj-threat.show { animation:objSlideIn .45s cubic-bezier(.4,0,.2,1) forwards; }
.obj-threat:hover {}
.obj-threat-icon {
  width:38px; height:38px; border-radius:8px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:18px;
  background:rgba(56,189,248,.06); border:1px solid rgba(56,189,248,.15);
}
.obj-threat-body { flex:1; min-width:0; }
.obj-threat-num {
  font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(56,189,248,.5);
  margin-bottom:2px;
}
.obj-threat-label {
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:500;
  color:rgba(255,255,255,.9); line-height:1.4;
}
.obj-threat-sev {
  font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700;
  letter-spacing:.15em; text-transform:uppercase; flex-shrink:0;
  padding:4px 10px; border-radius:3px;
}
.obj-threat-sev.high { color:#f87171; background:rgba(248,113,113,.1); border:1px solid rgba(248,113,113,.2); }
.obj-threat-sev.crit { color:#fb923c; background:rgba(251,146,60,.1); border:1px solid rgba(251,146,60,.2); }

/* CTA button */
.obj-cta-wrap { opacity:0; transform:translateY(10px); width:100%; display:flex; justify-content:center; }
.obj-cta-wrap.show { animation:objFadeUp .5s ease forwards; }
.obj-cta {
  font-family:'Orbitron',monospace; font-size:10px; font-weight:700;
  letter-spacing:.3em; text-transform:uppercase;
  padding:16px 56px; border-radius:6px; cursor:pointer;
  background:rgba(56,189,248,.07); border:1px solid rgba(56,189,248,.4);
  color:rgba(56,189,248,.85); transition:all .3s; position:relative; overflow:hidden;
}
.obj-cta::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(56,189,248,.12) 0%, transparent 60%);
  opacity:0; transition:opacity .3s;
}
.obj-cta:hover { border-color:var(--blue); color:#fff; background:rgba(56,189,248,.12); box-shadow:0 0 36px rgba(56,189,248,.22), 0 0 12px rgba(56,189,248,.1); }
.obj-cta:hover::before { opacity:1; }
.obj-cta.glow { animation:ctaPulse 1.4s ease infinite; }

@keyframes objFadeUp { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
@keyframes objSlideIn { from{opacity:0;transform:translateX(-20px)} to{opacity:1;transform:translateX(0)} }

/* ════════════════════════════════════════════
   PAUSE OVERLAY
════════════════════════════════════════════ */
#pauseOverlay {
  position:fixed; inset:0; z-index:8000;
  background:rgba(2,6,16,0.92);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
  backdrop-filter:blur(10px);
}
#pauseOverlay.show { opacity:1; pointer-events:all; }
.pause-title { font-family:'Orbitron',monospace; font-size:22px; font-weight:900; letter-spacing:.1em; color:#fff; }
.pause-sub   { font-family:'DM Sans',sans-serif; font-size:13px; color:rgba(200,220,255,.78); letter-spacing:.04em; }
.pause-resume-btn {
  margin-top:8px; padding:14px 52px;
  font-family:'Orbitron',monospace; font-size:11px; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  background:rgba(56,189,248,.08); border:1px solid rgba(56,189,248,.4); color:var(--blue2);
  border-radius:8px; cursor:pointer; transition:all .2s; animation:ctaPulse 1.4s ease infinite;
}
.pause-resume-btn:hover { background:rgba(56,189,248,.18); border-color:var(--blue); }
.pause-quit-btn {
  padding:10px 36px;
  font-family:'DM Sans',sans-serif; font-size:12px; font-weight:500; letter-spacing:.06em;
  background:transparent; border:1px solid rgba(200,220,255,.12); color:rgba(200,220,255,.35);
  border-radius:8px; cursor:pointer; transition:all .2s;
}
.pause-quit-btn:hover { background:rgba(239,68,68,.07); border-color:rgba(239,68,68,.35); color:rgba(239,68,68,.7); }
.pause-quit-warn { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.1em; color:rgba(200,220,255,.6); text-transform:uppercase; margin-top:4px; }

/* Briefing back button */
.briefing-back-btn {
  position:absolute; top:14px; left:16px; z-index:2;
  font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.12em; text-transform:uppercase;
  background:transparent; border:none; color:rgba(200,220,255,.72); cursor:pointer;
  padding:4px 8px; transition:color .2s; display:flex; align-items:center; gap:5px;
}
.briefing-back-btn:hover { color:rgba(200,220,255,.7); }

/* ════════════════════════════════════════════
   GAME CONTROLS (pause + mute — single pill, top-right)
════════════════════════════════════════════ */
#gameCtrlBar {
  position:fixed; top:0; right:16px; z-index:9000;
  display:flex; align-items:center;
  height:70px; /* aligns with int-banner min-height */
  pointer-events:none;
}
/* Single unified pill container */
#ctrlPill {
  pointer-events:all;
  display:flex; align-items:stretch;
  height:44px;
  background:rgba(4,10,26,0.92);
  border:1px solid rgba(255,255,255,.11);
  border-radius:10px;
  box-shadow:0 2px 16px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.04);
  overflow:hidden;
}
#abortBtn, #pauseBtn, #muteBtn {
  pointer-events:all;
  display:none; align-items:center; justify-content:center;
  width:44px;
  background:transparent; border:none;
  color:rgba(255,255,255,.5);
  cursor:pointer; transition:color .18s, background .18s;
  padding:0; flex-shrink:0;
}
#abortBtn { display:none; }
#abortBtn.visible { display:flex; }
#pauseBtn { display:none; }
#pauseBtn.visible { display:flex; }
#muteBtn { display:flex; }
/* Thin dividers between ctrl buttons */
#abortBtn.visible + #pauseBtn,
#abortBtn.visible + #pauseBtn.visible + #muteBtn,
#abortBtn.visible + #muteBtn {
  border-left:1px solid rgba(255,255,255,.08);
}
#pauseBtn.visible + #muteBtn {
  border-left:1px solid rgba(255,255,255,.08);
}
#abortBtn:hover, #pauseBtn:hover, #muteBtn:hover {
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.9);
}
#abortBtn:active, #pauseBtn:active, #muteBtn:active { color:rgba(255,255,255,1); }
.ctrl-icon { width:16px; height:16px; flex-shrink:0; }
/* Hide labels — icon-only */
.ctrl-lbl { display:none; }
#muteBtn.muted { color:rgba(255,255,255,.22); }
#muteBtn.muted:hover { color:rgba(255,255,255,.7); background:rgba(255,255,255,.06); }
/* Abort confirmation overlay */
#abortOverlay {
  position:fixed; inset:0; z-index:8500;
  background:rgba(2,6,16,0.92);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
  backdrop-filter:blur(10px);
}
#abortOverlay.show { opacity:1; pointer-events:all; }
.abort-title { font-family:'Orbitron',monospace; font-size:18px; font-weight:900; letter-spacing:.1em; color:#fff; }
.abort-sub { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.08em; color:rgba(200,220,255,.55); text-transform:uppercase; text-align:center; line-height:1.6; max-width:320px; }
.abort-actions { display:flex; gap:12px; margin-top:6px; }
.abort-confirm-btn {
  padding:12px 36px;
  font-family:'Orbitron',monospace; font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  background:rgba(239,68,68,.08); border:1px solid rgba(239,68,68,.35); color:rgba(239,68,68,.8);
  border-radius:8px; cursor:pointer; transition:all .2s;
}
.abort-confirm-btn:hover { background:rgba(239,68,68,.15); border-color:rgba(239,68,68,.6); color:rgba(239,68,68,1); }
.abort-cancel-btn {
  padding:12px 36px;
  font-family:'Orbitron',monospace; font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  background:rgba(56,189,248,.08); border:1px solid rgba(56,189,248,.4); color:var(--blue2);
  border-radius:8px; cursor:pointer; transition:all .2s;
}
.abort-cancel-btn:hover { background:rgba(56,189,248,.18); border-color:var(--blue); }

/* ════════════════════════════════════════════
   RESPONSIVE  (inline overrides — see also css/responsive.css)
════════════════════════════════════════════ */

/* Desktop: hide the mobile panel toggle */
.diag-toggle { display:none; }

/* Mobile timer display inside toggle (M3 only) */
.diag-toggle-row { display:flex; align-items:center; gap:10px; }
.diag-toggle-timer {
  font-family:'Orbitron',monospace; font-size:14px; font-weight:900;
  letter-spacing:-.02em; color:rgba(56,189,248,.8); line-height:1;
}
.diag-toggle-timer.warn     { color:var(--orange); }
.diag-toggle-timer.critical { color:var(--red); animation:pulse .5s ease infinite; }

@media (max-width: 768px) {
  .sticky-header { background:transparent; }
  /* Banner: stack, clear ctrl buttons on the right */
  .int-banner { grid-template-columns:1fr; margin:0 12px; overflow:visible; }
  #gameCtrlBar { height:auto; top:13px; }
  #ctrlPill { height:38px; }
  #abortBtn, #pauseBtn, #muteBtn { width:38px; }
  .ib-brand { padding:10px 148px 8px 16px; border-right:none; border-bottom:1px solid rgba(56,189,248,.1); overflow:visible; }
  .h-title { white-space:normal; line-height:1.3; }
  .ib-center { padding:10px 16px; gap:14px; }
  .ib-num { font-size:32px; }
  /* Mobile: hide large number column, show compact number inline with bar */
  .ib-num-col { display:none !important; }
  .ib-num-compact-wrap { display:flex !important; }
  .ib-bar-top { margin-top:4px; }
  /* Shell: single column, no diag panel */
  .shell { grid-template-columns:1fr; grid-template-rows:1fr; padding:8px 12px 12px 12px; min-height:unset; gap:8px; }
  /* Diag panel: hidden on mobile — replaced by mini-diag in sticky header */
  .diag { display:none !important; }
  /* Show mini diag row in banner on mobile */
  .ib-mini-diag { display:flex !important; }
  /* Cat popup: compact sticky footer, single row of classification buttons */
  .cat-popup { position:fixed !important; bottom:0 !important; left:0 !important; right:0 !important; top:auto !important; min-width:unset; width:100%; border-radius:16px 16px 0 0; padding:10px 12px 20px; z-index:502 !important; transform:none !important; }
  .cat-popup-lbl { display:none; }
  .cat-popup-close { display:none; }
  .cat-btns { display:flex !important; flex-direction:row; flex-wrap:nowrap; gap:6px; }
  .cat-btn { padding:14px 6px !important; font-size:9px !important; min-height:unset !important; flex:1; letter-spacing:.08em !important; }
  /* Mission cards */
  .mission-cards { gap:16px; }
  .mission-card { width:calc(100vw - 48px); max-width:340px; }
  .mission-title { font-size:28px; }
  /* Hide duplicate lower stars inside expanded card body — collapse row already shows stars */
  .mc-body .mc-stars { display:none !important; }
}

/* M3: same collapsed height as others — timer shown in toggle handle */

@media (max-width: 480px) {
  .int-banner { margin:8px 8px 0; }
  .ib-brand { padding:8px 148px 7px 12px; }
  .h-title { font-size:9px; letter-spacing:.12em; }
  .shell { display:flex; flex-direction:column; padding:6px 8px 8px 8px; gap:8px; }
  .ib-num { font-size:26px; }
  .splash-title { font-size:32px; }
  .splash-subtitle { padding:0 20px; }
  .mission-screen { padding:56px 16px 40px; justify-content:flex-start; }
  .mission-header { margin-bottom:24px; }
  .mission-title { font-size:22px; }
  .mission-subtitle { font-size:12px; }
  .mission-card { width:calc(100vw - 32px); max-width:unset; }
}

/* ══ MOBILE SUBMIT BUTTON — replaces diag-embedded submit on mobile ══ */
.mobile-submit-wrap {
  display: none; /* controlled by JS */
  position: fixed;
  bottom: 0; left: 0; right: 0;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  background: rgba(4,10,20,.95);
  border-top: 1px solid rgba(74,222,128,.2);
  z-index: 40;
  backdrop-filter: blur(12px);
}
@media (min-width: 769px) {
  .mobile-submit-wrap { display: none !important; }
}
.mobile-submit-btn { width: 100%; }

/* ══ MINI DIAGNOSTIC ROW — compact category status in banner ══ */
.ib-mini-diag {
  display: none; /* hidden on desktop/tablet — shown at ≤768px */
  flex-direction: row;
  align-items: stretch;
  gap: 6px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,.07);
}
.ib-mini-cat {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 5px;
  padding: 5px 7px;
}
.ib-mini-lbl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 7px; letter-spacing: .06em; text-transform: uppercase;
  color: var(--dim); white-space: nowrap; flex-shrink: 0;
  transition: color .3s;
}
.ib-mini-lbl.red    { color: rgba(239,68,68,.85); }
.ib-mini-lbl.orange { color: rgba(251,146,60,.85); }
.ib-mini-lbl.yellow { color: rgba(250,204,21,.85); }
.ib-mini-lbl.green  { color: rgba(74,222,128,.85); }
.ib-mini-lbl.secured { color: rgba(74,222,128,.9) !important; }
.ib-mini-track {
  flex: 1;
  height: 4px; background: rgba(255,255,255,.08);
  border-radius: 2px; overflow: hidden;
}
.ib-mini-fill {
  height: 100%; width: 0%; border-radius: 2px;
  transition: width .5s ease, background-color .4s ease;
}

/* ══ COLLAPSIBLE MISSION CARDS ══ */
.mc-collapse-row {
  display: flex; /* always shown on mobile; desktop overrides to none */
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  cursor: pointer;
  transition: background .2s;
}
.mc-collapse-row:hover { background: rgba(56,189,248,.04); }
.mc-collapse-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .14em; color: var(--dim);
  text-transform: uppercase; flex-shrink: 0;
}
.mc-collapse-title {
  font-family: 'Orbitron', monospace;
  font-size: 12px; font-weight: 700; color: #fff;
  letter-spacing: .03em; flex: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mc-collapse-stars {
  font-size: 12px; color: rgba(250,204,21,.75);
  letter-spacing: 1px; text-shadow: 0 0 6px rgba(250,204,21,.35);
  flex-shrink: 0;
}
.mc-collapse-chevron {
  font-size: 14px; color: rgba(56,189,248,.5);
  transition: transform .3s ease, color .2s;
  flex-shrink: 0; margin-left: 4px;
}
.mc-collapse-row:hover .mc-collapse-chevron { color: rgba(56,189,248,.85); }
.mission-card.collapsed .mc-collapse-row { display: flex; }
.mission-card.collapsed .mc-body { display: none; }
.mission-card.collapsed .mc-launch-btn { display: none; }
.mission-card.collapsed { cursor: pointer; }
.mission-card.expanded .mc-collapse-chevron { transform: rotate(180deg); }
.mission-card.locked .mc-collapse-chevron { visibility: hidden; }

/* ══ DEV TOGGLE ══ */

/* ══ DESKTOP: ALWAYS SHOW FULL CARDS — ignore collapse ══ */
@media (min-width: 769px) {
  .mission-card .mc-collapse-row { display: none !important; }
  .mission-card.collapsed .mc-body { display: flex !important; }
  .mission-card.collapsed .mc-launch-btn { display: flex !important; }
  .mission-card.collapsed { cursor: default; }
  .mc-body { padding: 18px 20px 18px; }
  .mc-icon { width: 38px; height: 38px; }
}

/* ══ MOBILE COLLAPSE STATUS BADGE ══ */
.mc-collapse-badge {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: .08em; text-transform: uppercase;
  flex-shrink: 0; transition: color .2s;
}
.mc-collapse-badge.done { color: rgba(74,222,128,.85); }
.mc-collapse-badge.locked-icon { color: rgba(255,255,255,.22); font-size: 12px; }
.mc-collapse-badge.unlocked { color: rgba(56,189,248,.45); }
@media (max-width: 768px) { .mc-collapse-badge.done { display: none; } }

/* ══ VERDICT COMPACT STATUS HEADER (Steps 2 & 3) ══ */
.v-compact-header {
  display: flex; align-items: center; gap: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(74,222,128,.2);
  margin-bottom: 14px;
  font-family: 'Orbitron', monospace;
  font-size: 9px; letter-spacing: .2em;
  color: rgba(74,222,128,.75); text-transform: uppercase;
}
.v-compact-header.fail {
  color: rgba(239,68,68,.7);
  border-bottom-color: rgba(239,68,68,.18);
}
.v-compact-header-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(74,222,128,.9); flex-shrink: 0;
  box-shadow: 0 0 6px rgba(74,222,128,.5);
}
.v-compact-header.fail .v-compact-header-dot {
  background: rgba(239,68,68,.9);
  box-shadow: 0 0 6px rgba(239,68,68,.5);
}

/* Next-up card: visually prominent */
.mission-card.next-mission {
  border-color: rgba(56,189,248,.35);
  box-shadow: 0 8px 32px rgba(0,0,0,.4), 0 0 24px rgba(56,189,248,.1), inset 0 1px 0 rgba(56,189,248,.12);
  animation: fadeUp .6s ease both, cardGlow 3s ease-in-out infinite;
}

/* ════════════════════════════════════════════
   WCAG 2.1 AA — Focus Indicators
════════════════════════════════════════════ */
:focus-visible {
  outline:2px solid var(--blue);
  outline-offset:2px;
}
/* Tokens in light bubbles */
.gpt-user-bubble :focus-visible,
.word-doc-body :focus-visible {
  outline-color:#1d4ed8;
}
/* Category buttons — use their own accent */
.cat-btn-cred:focus-visible { outline-color:var(--red); }
.cat-btn-pii:focus-visible  { outline-color:var(--orange); }
.cat-btn-int:focus-visible  { outline-color:var(--yellow); }
.cat-btn-safe:focus-visible { outline-color:rgba(148,163,184,.85); }
/* Remove default outline for mouse users */
:focus:not(:focus-visible) { outline:none; }

/* ════════════════════════════════════════════
   WCAG 2.1 AA — Reduced Motion
════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* ════════════════════════════════════════════
   WCAG 2.1 AA — Non-text Contrast (3:1)
════════════════════════════════════════════ */
.splash-load-track { background:rgba(56,189,248,.18); }
.boot-track { background:rgba(56,189,248,.22); }
.ib-bar-track { background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.18); }
.mastery-seg { background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.22); }
.dc-seg { background:rgba(255,255,255,.2); }
.ib-mini-track { background:rgba(255,255,255,.18); }
.vsp-dot { background:rgba(255,255,255,.22); }

/* ════════════════════════════════════════════
   WCAG 2.1 AA — Skip Navigation
════════════════════════════════════════════ */
.skip-link {
  position:absolute; top:-100%; left:16px; z-index:99999;
  background:var(--blue); color:#020610; font-family:'Orbitron',monospace;
  font-size:11px; font-weight:700; letter-spacing:.1em;
  padding:12px 24px; border-radius:0 0 8px 8px;
  text-decoration:none; transition:top .2s;
}
.skip-link:focus { top:0; }

/* ════════════════════════════════════════════
   WCAG 2.1 AA — Minimum Touch Target (44px)
════════════════════════════════════════════ */
@media (max-width: 768px) {
  .cat-btn { min-height:44px !important; }
  .cat-popup-close { display:none !important; }
  .back-btn { min-height:44px; min-width:44px; }
  .briefing-back-btn { min-height:44px; min-width:44px; }

  /* ── Verdict / debrief — tighten for mobile ── */
  .verdict-overlay { padding:12px 10px 24px; }
  .v-success-graphic { height:120px; }
  .v-success-graphic svg.shield { width:60px; height:60px; }
  .v-success-graphic .ring { width:90px; height:90px; }
  .v-fail-graphic { height:100px; }
  .v-fail-shield-wrap svg { width:60px; height:60px; }
  .v-body { padding:18px 18px 16px; }
  .v-single-metric { padding:10px 14px; margin-bottom:12px; }
  .v-verdict-msg { font-size:12px; line-height:1.65; margin-bottom:12px; }
  .v-rows { margin-bottom:12px; }
  .v-rows-lbl { margin-bottom:7px; }
  .v-row { padding:7px 0; }
  .v-divider { margin:12px 0; }
  .v-next-btn { padding:12px; margin-top:12px; }
  .v-retry-btn, .v-menu-btn, .v-reset { padding:11px; margin-top:8px; }
  .v-step-prog { margin-bottom:10px; }
  .v-compact-header { padding-bottom:10px; margin-bottom:10px; }
  .v-anchor { padding:10px 14px; margin-top:12px; }
  .v-anchor-text { font-size:11px; line-height:1.6; }
  .v-bonus-wrap { margin:6px 0 2px; }
}

/* ════════════════════════════════════════════
   INSIGHT LIGHTBOX
════════════════════════════════════════════ */
#insightOverlay {
  position:fixed; inset:0; z-index:2000;
  background:rgba(2,6,16,0.85);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .25s ease;
  backdrop-filter:blur(5px);
}
#insightOverlay.show { opacity:1; pointer-events:all; }

.insight-card {
  width:460px; max-width:calc(100vw - 32px);
  background:rgba(6,14,32,0.97);
  border:1px solid rgba(56,189,248,.2);
  border-radius:16px; overflow:hidden;
  box-shadow:0 40px 80px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,255,255,.05);
  animation:insightIn .3s cubic-bezier(.34,1.4,.64,1) both;
}

/* ERROR MODE — wrong answer */
.insight-card.error-mode {
  border-color:rgba(239,68,68,.35);
  box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 30px rgba(239,68,68,.12);
  animation:insightIn .22s cubic-bezier(.34,1.4,.64,1) both, insightGlowRed .75s ease .18s;
}
@keyframes insightGlowRed {
  0%   { box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 12px rgba(239,68,68,.08); }
  45%  { box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 52px rgba(239,68,68,.32); }
  100% { box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 12px rgba(239,68,68,.08); }
}

/* CORRECT MODE — right answer */
.insight-card.correct-mode {
  border-color:rgba(74,222,128,.35);
  box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 30px rgba(74,222,128,.12);
  animation:insightIn .3s cubic-bezier(.34,1.4,.64,1) both, insightGlowGreen .75s ease .25s;
}
@keyframes insightGlowGreen {
  0%   { box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 12px rgba(74,222,128,.08); }
  45%  { box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 52px rgba(74,222,128,.32); }
  100% { box-shadow:0 40px 80px rgba(0,0,0,.65), 0 0 12px rgba(74,222,128,.08); }
}
@keyframes insightIn {
  from { transform:scale(.9) translateY(14px); opacity:0; }
  to   { transform:scale(1) translateY(0); opacity:1; }
}

/* ── TOP BAR — colour-coded accent ── */
.insight-top-bar {
  height:3px;
  background:linear-gradient(90deg,transparent,rgba(56,189,248,.6),transparent);
}
.insight-card.error-mode .insight-top-bar {
  background:linear-gradient(90deg,transparent,rgba(239,68,68,.65),transparent);
}
.insight-card.correct-mode .insight-top-bar {
  background:linear-gradient(90deg,transparent,rgba(74,222,128,.65),transparent);
}

/* ── BODY ── */
.insight-body { padding:20px 24px 18px; }

/* ── STATUS HEADING — same size for both states ── */
.insight-verdict {
  display:flex; align-items:center; gap:10px;
  font-family:'Orbitron',monospace; font-size:16px; font-weight:900;
  letter-spacing:.06em; text-transform:uppercase;
  margin-bottom:16px; line-height:1.1;
}
.insight-verdict-icon {
  width:28px; height:28px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:900; flex-shrink:0;
}
.insight-card.error-mode .insight-verdict { color:rgba(239,68,68,.9); }
.insight-card.error-mode .insight-verdict-icon { background:rgba(239,68,68,.15); border:1px solid rgba(239,68,68,.35); color:#ef4444; }
.insight-card.correct-mode .insight-verdict { color:rgba(74,222,128,.9); }
.insight-card.correct-mode .insight-verdict-icon { background:rgba(74,222,128,.15); border:1px solid rgba(74,222,128,.35); color:#4ade80; }

/* ── FLAGGED ELEMENT box ── */
.insight-element-box {
  display:none;
  padding:10px 14px; border-radius:7px;
  background:rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.08);
  margin-bottom:16px;
}
.insight-element-box.show { display:block; }
.insight-element-label {
  font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:rgba(200,220,255,.35);
  margin-bottom:6px;
}
.insight-element-text {
  font-family:'JetBrains Mono',monospace; font-size:12px;
  color:rgba(220,235,255,.9); font-weight:500; line-height:1.55;
}

/* ── CATEGORY COMPARISON ROW ── */
.insight-comparison {
  display:none; align-items:center; gap:10px;
  margin-bottom:16px; flex-wrap:wrap;
}
.insight-comparison.show { display:flex; }
.insight-comparison.single { justify-content:flex-start; }

.insight-badge {
  display:inline-flex; align-items:center; gap:5px;
  font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  padding:6px 14px; border-radius:8px;
  white-space:nowrap;
}
.insight-badge-credential { background:rgba(239,68,68,.12); color:var(--red); border:1px solid rgba(239,68,68,.4); }
.insight-badge-pii        { background:rgba(251,146,60,.12); color:var(--orange); border:1px solid rgba(251,146,60,.4); }
.insight-badge-internal   { background:rgba(250,204,21,.1);  color:var(--yellow); border:1px solid rgba(250,204,21,.4); }
.insight-badge-ok         { background:rgba(74,222,128,.1);  color:#86efac; border:1px solid rgba(74,222,128,.3); }
.insight-badge-warn       { background:rgba(239,68,68,.08); color:#fca5a5; border:1px solid rgba(239,68,68,.25); }
.insight-badge-neutral    { background:rgba(148,163,184,.12); color:rgba(148,163,184,.8); border:1px solid rgba(148,163,184,.3); }

.insight-badge-strikethrough { text-decoration:line-through; opacity:.55; }
.insight-comparison-arrow {
  font-size:14px; color:rgba(200,220,255,.3); flex-shrink:0;
}
.insight-comparison-label {
  font-family:'JetBrains Mono',monospace; font-size:7px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:rgba(200,220,255,.35);
  display:block; margin-bottom:3px;
}

/* ── EXPLANATION MESSAGE ── */
.insight-msg {
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:400;
  color:rgba(220,235,255,.85); line-height:1.75;
}

/* ── DIVIDER ── */
.insight-divider { height:1px; background:rgba(255,255,255,.06); margin:0 0 14px; }

/* ── FOOTER ── */
.insight-footer { padding:0 24px 22px; }
.insight-btn {
  width:100%; padding:12px;
  font-family:'Orbitron',monospace; font-size:10px; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase;
  background:rgba(56,189,248,.08); border:1px solid rgba(56,189,248,.28);
  color:rgba(56,189,248,.9); border-radius:8px; cursor:pointer; transition:all .18s;
}
.insight-btn:hover { background:rgba(56,189,248,.15); border-color:rgba(56,189,248,.5); box-shadow:0 0 14px rgba(56,189,248,.18); }
.insight-btn:focus { outline:none; box-shadow:0 0 0 2px rgba(56,189,248,.35); }
.insight-card.error-mode .insight-btn {
  background:rgba(239,68,68,.06); border-color:rgba(239,68,68,.25); color:rgba(255,180,180,.8);
}
.insight-card.error-mode .insight-btn:hover {
  background:rgba(239,68,68,.12); border-color:rgba(239,68,68,.45); box-shadow:0 0 12px rgba(239,68,68,.1);
}
.insight-card.correct-mode .insight-btn {
  background:rgba(74,222,128,.08); border-color:rgba(74,222,128,.35); color:rgba(134,239,172,.9);
}
.insight-card.correct-mode .insight-btn:hover {
  background:rgba(74,222,128,.16); border-color:rgba(74,222,128,.6); box-shadow:0 0 14px rgba(74,222,128,.18);
}

/* ════════════════════════════════════════════
   SUCCESS TOAST
════════════════════════════════════════════ */
#successToast {
  position:fixed; bottom:28px; left:50%; transform:translateX(-50%) translateY(16px);
  z-index:1800; pointer-events:none; opacity:0;
  transition:opacity .2s ease, transform .2s ease;
  max-width:400px; width:calc(100vw - 40px);
}
#successToast.show { opacity:1; transform:translateX(-50%) translateY(0); pointer-events:all; }
.toast-inner {
  background:rgba(4,18,38,0.97); border:1px solid rgba(74,222,128,.35);
  border-left:3px solid var(--green);
  border-radius:8px; padding:11px 12px 11px 15px;
  box-shadow:0 6px 28px rgba(0,0,0,.55), 0 0 18px rgba(74,222,128,.07);
  display:flex; align-items:flex-start; gap:11px;
}
.toast-tick { color:var(--green); font-size:13px; flex-shrink:0; margin-top:2px; }
.toast-body { flex:1; min-width:0; }
.toast-label {
  font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700;
  letter-spacing:.15em; text-transform:uppercase; color:rgba(74,222,128,.65);
  margin-bottom:3px;
}
.toast-text {
  font-family:'DM Sans',sans-serif; font-size:11.5px; color:rgba(200,225,255,.75);
  line-height:1.5;
}
.toast-close {
  flex-shrink:0; background:none; border:1px solid rgba(255,255,255,.12); cursor:pointer;
  color:rgba(255,255,255,.5); font-size:12px; line-height:1;
  padding:3px 6px; border-radius:4px; transition:color .15s, border-color .15s;
  margin-top:-1px;
}
.toast-close:hover { color:rgba(255,255,255,.85); border-color:rgba(255,255,255,.3); }