/* ═══════════════════════════════════════════════════
   QueWi+ IRAN WAR ROOM — IRON CURTAIN COMMAND UI
   Premium Military Intelligence • Warm Authority
   ═══════════════════════════════════════════════════ */

/* ══════ ROOT DESIGN SYSTEM ══════ */
:root{
  /* Dark Foundation — deep ocean navy (matches satellite map) */
  --bg:#101824;--bg2:#152030;--bg3:#1a283a;--bg4:#223448;--bg5:#2d4058;
  /* Warm Ivory Text */
  --txt:#e8e4dc;--txt2:#a8a49a;--txt3:#7a776e;
  /* Command Gold — primary accent (military brass) */
  --cyan:#c8a45a;--cyan2:#a88a42;
  --gold:#c8a45a;--gold2:#dbb96e;
  /* Signal Colors */
  --red:#c43c3c;--orange:#c87832;--green:#6a9a4a;--amber:#d4922a;
  /* Model Identities */
  --claude:#c89b6a;--gpt:#6b9fd4;--gemini:#5ebcb2;--quewi:#9070b0;
  /* Force Colors — premium copper vs teal-steel */
  --force-red:#c85040;--force-red2:#e06858;--force-blue:#4878b0;--force-blue2:#6098d0;
  /* Glass & Borders — warm gold tint on navy */
  --glass:rgba(16,22,32,.82);--glass2:rgba(12,16,24,.88);--glass3:rgba(22,32,45,.72);
  --border:rgba(200,164,90,.07);--border2:rgba(200,164,90,.14);--border3:rgba(200,164,90,.24);
  /* Warm Glows */
  --glow-cyan:0 0 20px rgba(200,164,90,.06),0 0 40px rgba(200,164,90,.02);
  --glow-red:0 0 20px rgba(196,60,60,.08);
  --glow-gold:0 0 20px rgba(200,164,90,.08);
  --glow-quewi:0 0 20px rgba(144,112,176,.08),0 0 40px rgba(144,112,176,.03);
  /* Typography */
  --fd:'Orbitron',sans-serif;
  --fb:'Rajdhani','Noto Sans SC','PingFang SC',system-ui,sans-serif;
  --fh:'Noto Serif SC','Songti SC','LXGW WenKai SC',serif;
  --fc:'Noto Sans SC','PingFang SC','Helvetica Neue',sans-serif;
  --fm:'JetBrains Mono',monospace;
  --f-impact:'Noto Sans SC','Noto Serif SC','PingFang SC',sans-serif;
  --f-stamp:'Zhi Mang Xing','Ma Shan Zheng','ZCOOL QingKe HuangYou',cursive;
  --f-headline:'Noto Serif SC','Songti SC',serif;
  /* Sizing */
  --fs-base:16px;--fs-sm:14px;--fs-xs:12px;--fs-lg:18px;--fs-xl:22px;--fs-xxl:28px;
}

/* ══════ RESET & BASE ══════ */
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:var(--fs-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth;text-rendering:optimizeLegibility}
body{
  background:var(--bg);color:var(--txt);font-family:var(--fb);line-height:1.8;overflow-x:hidden;
  font-feature-settings:'palt','kern';
  background-image:
    radial-gradient(ellipse at 15% 50%, rgba(200,164,90,.06) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 20%, rgba(61,143,160,.05) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 90%, rgba(208,128,80,.04) 0%, transparent 40%),
    radial-gradient(ellipse at 50% 50%, rgba(38,51,68,.65) 0%, transparent 70%),
    radial-gradient(ellipse at 50% 30%, rgba(22,32,50,.8) 0%, transparent 80%);
  background-attachment:fixed;
}
/* Ultra-subtle noise texture */
body::after{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.85" numOctaves="4" stitchTiles="stitch"/></filter><rect width="256" height="256" filter="url(%23n)" opacity=".018"/></svg>');
  background-size:256px 256px;
}
a{color:var(--gold);text-decoration:none;transition:color .3s}
a:hover{color:var(--gold2)}
.hidden{display:none!important}

/* ══════ ANIMATIONS ══════ */
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideIn{from{opacity:0;transform:translateX(-15px)}to{opacity:1;transform:translateX(0)}}
@keyframes glowPulse{0%,100%{box-shadow:0 0 6px rgba(200,164,90,.15)}50%{box-shadow:0 0 20px rgba(200,164,90,.3)}}
@keyframes scanMove{0%{background-position:0 0}100%{background-position:100% 100%}}
@keyframes recBlink{0%,100%{opacity:1}50%{opacity:0}}
@keyframes shakeHeavy{0%{transform:translate(0)}10%{transform:translate(-14px,10px) rotate(-1.5deg)}20%{transform:translate(12px,-8px) rotate(2deg)}30%{transform:translate(-10px,6px) rotate(-1deg)}40%{transform:translate(8px,-10px) rotate(1deg)}50%{transform:translate(-6px,4px)}60%{transform:translate(4px,-3px)}70%{transform:translate(-2px,3px)}80%{transform:translate(2px,-2px)}90%{transform:translate(-1px,1px)}100%{transform:translate(0)}}
@keyframes grainShift{0%{transform:translate(0)}10%{transform:translate(-5%,-5%)}20%{transform:translate(-10%,5%)}30%{transform:translate(5%,-10%)}40%{transform:translate(-5%,15%)}50%{transform:translate(-10%,5%)}60%{transform:translate(15%,0)}70%{transform:translate(0,10%)}80%{transform:translate(-15%,0)}90%{transform:translate(10%,5%)}100%{transform:translate(5%,0)}}
@keyframes threatPulse{0%,100%{text-shadow:0 0 8px rgba(196,60,60,.4)}50%{text-shadow:0 0 25px rgba(196,60,60,.7),0 0 50px rgba(196,60,60,.2)}}
@keyframes scroll{to{transform:translateX(-50%)}}
@keyframes expandIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@keyframes divergencePulse{0%,100%{border-color:rgba(196,60,60,.12)}50%{border-color:rgba(196,60,60,.3)}}
@keyframes riskGlow{0%,100%{box-shadow:0 0 15px rgba(196,60,60,.15),0 0 5px rgba(196,60,60,.1)}50%{box-shadow:0 0 30px rgba(196,60,60,.35),0 0 60px rgba(196,60,60,.12)}}
@keyframes nodeAppear{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes stampSlam{0%{transform:scale(4) rotate(-10deg);opacity:0}100%{transform:scale(1) rotate(-5deg);opacity:1}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes ambientGlow{0%,100%{opacity:.4}50%{opacity:.7}}
@keyframes borderTrace{0%{background-position:0% 0%}100%{background-position:100% 100%}}
@keyframes radarSweep{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
@keyframes threatWave{0%{transform:scaleX(0);opacity:.6}50%{transform:scaleX(1);opacity:.2}100%{transform:scaleX(1);opacity:0}}
@keyframes holoFlicker{0%,97%{opacity:1}97.5%{opacity:.6}98%{opacity:1}98.5%{opacity:.7}99%{opacity:1}}
@keyframes dataStream{0%{transform:translateY(-100%)}100%{transform:translateY(100vh)}}
@keyframes cardReveal{0%{opacity:0;transform:translateY(16px) scale(.97)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes heroGlow{0%,100%{box-shadow:inset 0 0 20px rgba(196,60,60,0)}50%{box-shadow:inset 0 0 20px rgba(196,60,60,.06)}}
@keyframes gridPulse{0%,100%{opacity:.3}50%{opacity:.8}}
@keyframes warningStrobe{0%,85%,100%{opacity:0}90%{opacity:.4}95%{opacity:.6}}
@keyframes numberGlitch{0%,100%{transform:none;opacity:1}33%{transform:translate(-2px,1px) skewX(-2deg);opacity:.8}66%{transform:translate(2px,-1px) skewX(2deg);opacity:.9}}

/* ══════ CINEMATIC OVERLAY ══════ */
.cine-overlay{
  position:fixed;inset:0;z-index:9999;
  background:#08090d;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.film-grain{
  position:absolute;inset:-50%;width:200%;height:200%;
  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="4" stitchTiles="stitch"/></filter><rect width="200" height="200" filter="url(%23n)" opacity=".06"/></svg>');
  animation:grainShift 8s steps(10) infinite;pointer-events:none;z-index:1;
}
.cine-phase{position:absolute;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;z-index:2}
#phase-classified{display:flex;opacity:1}
#phase-classified .classified-stamp{animation:stampSlam .15s ease-out both}
#phase-classified .classified-sub{animation:fadeUp .4s .2s ease both}
.classified-stamp{
  font-family:var(--fd);font-size:clamp(2.5rem,8vw,5rem);font-weight:900;
  color:var(--red);letter-spacing:14px;
  text-shadow:0 0 30px rgba(196,60,60,.35),0 0 80px rgba(196,60,60,.1);
  border:3px solid var(--red);padding:.6rem 2.5rem;
  position:relative;
}
.classified-stamp::before{
  content:'';position:absolute;inset:-6px;
  border:1px solid rgba(196,60,60,.15);
}
.classified-sub{font-family:'Noto Serif SC','Noto Sans SC',var(--fh),serif;font-size:clamp(.85rem,2.5vw,1.1rem);color:var(--txt3);letter-spacing:6px;margin-top:1.4rem;font-weight:600}
.intel-block{font-family:var(--fm);font-size:clamp(.7rem,1.8vw,.9rem);color:var(--gold);max-width:650px;width:90%}
.intel-line{padding:.45rem 0;border-bottom:1px solid rgba(200,164,90,.06);min-height:1.4rem;letter-spacing:1px}
.threat-box{
  margin-top:1.8rem;display:flex;align-items:center;gap:1.2rem;
  padding:1rem 2.2rem;border:3px solid var(--red);
  background:rgba(196,60,60,.08);border-radius:4px;
  position:relative;z-index:5;
  box-shadow:0 0 40px rgba(196,60,60,.15),inset 0 0 30px rgba(196,60,60,.05);
}
.threat-label{font-family:var(--fd);font-size:.7rem;color:var(--txt3);letter-spacing:3px}
.threat-val{font-family:var(--fd),'Impact','Arial Black',sans-serif;font-size:3rem;color:var(--red);font-weight:900;animation:threatPulse 2.5s infinite;letter-spacing:14px;text-shadow:0 0 30px rgba(196,60,60,.6),0 0 60px rgba(196,60,60,.3),0 2px 4px rgba(0,0,0,.5);text-transform:uppercase}
.jet-trail{position:absolute;top:30%;height:2px;background:linear-gradient(90deg,transparent,rgba(200,164,90,.5),transparent);width:60%;filter:blur(1px)}
.jet-trail.reverse{top:65%}
.impact-flash{display:none!important}
.fireball{position:absolute;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,#fff,#c87832,#c43c3c,transparent);left:50%;top:50%;transform:translate(-50%,-50%) scale(0);z-index:4}
.title-block{text-align:center;z-index:3;perspective:1000px}
.title-main{
  font-family:var(--fd);font-size:clamp(2rem,6vw,3.5rem);font-weight:900;
  color:var(--txt);letter-spacing:12px;
  text-shadow:0 0 40px rgba(200,164,90,.2);
  white-space:nowrap;
}
.title-divider{width:240px;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:1.2rem auto;transform-origin:center}
.title-sub{font-family:'Noto Sans SC','Noto Serif SC','PingFang SC',sans-serif;font-size:clamp(1.2rem,3vw,1.6rem);color:var(--txt);letter-spacing:8px;margin-bottom:.4rem;font-weight:900;text-shadow:0 0 30px rgba(200,164,90,.25),0 2px 4px rgba(0,0,0,.5)}
.title-cn{font-family:var(--fc);font-size:clamp(.85rem,2.2vw,1.1rem);color:var(--txt3);letter-spacing:5px}
.title-vs{display:flex;align-items:center;gap:.8rem;margin-top:1rem;width:100%;max-width:500px;justify-content:center}
.vs-line{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(200,164,90,.25),transparent)}
.vs-text{font-family:var(--fc);font-size:clamp(.68rem,1.8vw,.82rem);color:var(--gold);letter-spacing:4px;white-space:nowrap}
.title-models{display:flex;gap:.5rem;justify-content:center;margin-top:1rem;flex-wrap:wrap;align-items:center}
.mbadge{font-family:var(--fd);font-size:.6rem;letter-spacing:2px;padding:.35rem .9rem;border-radius:2px;border:1px solid;opacity:.8}
.mbadge-vs{font-family:var(--fd);font-size:.7rem;font-weight:700;color:var(--red);letter-spacing:3px;text-shadow:0 0 12px rgba(196,60,60,.4);animation:threatPulse 2s infinite}
.title-desc{font-family:var(--fc);font-size:clamp(.78rem,2vw,.95rem);color:var(--txt2);letter-spacing:3px;margin-top:.8rem;opacity:.8}
.mb-claude{border-color:var(--claude);color:var(--claude)}.mb-gpt{border-color:var(--gpt);color:var(--gpt)}.mb-gemini{border-color:var(--gemini);color:var(--gemini)}.mb-quewi{border-color:var(--quewi);color:var(--quewi);box-shadow:var(--glow-quewi)}
.title-powered{font-family:var(--fb);font-size:.8rem;color:var(--txt3);margin-top:1rem;letter-spacing:1px}
.q-link{color:var(--quewi);font-weight:600;border-bottom:1px solid rgba(144,112,176,.3);transition:all .3s}
.q-link:hover{color:#b090d0;text-shadow:0 0 8px rgba(144,112,176,.25)}

/* QueWi Hero Branding — title phase */
.title-quewi-hero{display:flex;align-items:center;justify-content:center;gap:.6rem;margin-bottom:1.4rem;opacity:0}
.quewi-hero-logo{
  width:48px;height:48px;border-radius:12px;
  background:linear-gradient(135deg,rgba(144,112,176,.2),rgba(144,112,176,.05));
  border:2px solid rgba(144,112,176,.4);
  color:var(--quewi);font-family:var(--fd);font-size:1.2rem;font-weight:900;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 25px rgba(144,112,176,.2),0 0 50px rgba(144,112,176,.05);
  text-shadow:0 0 10px rgba(144,112,176,.5);
}
.quewi-hero-name{
  font-family:var(--fd);font-size:1.6rem;font-weight:800;color:var(--quewi);
  letter-spacing:4px;text-shadow:0 0 20px rgba(144,112,176,.3);
}
.quewi-hero-name sup{font-size:.6em;color:var(--gold)}
.quewi-hero-tag{
  font-family:var(--fd);font-size:.55rem;letter-spacing:4px;color:var(--txt3);
  padding:.2rem .8rem;border:1px solid rgba(144,112,176,.2);border-radius:2px;
  background:rgba(144,112,176,.04);
}

/* Logo QueWi badge in topbar */
.logo-quewi{
  font-family:var(--fd);font-size:.7rem;font-weight:800;
  color:var(--quewi);letter-spacing:2.5px;
  padding:.2rem .65rem;margin-left:.5rem;
  background:linear-gradient(135deg,rgba(144,112,176,.15),rgba(144,112,176,.04));
  border:1px solid rgba(144,112,176,.3);border-radius:2px;
  box-shadow:0 0 15px rgba(144,112,176,.1);
  text-shadow:0 0 8px rgba(144,112,176,.4);
}
.logo-quewi sup{font-size:.65em;color:var(--gold)}

/* Stamp slam animation */
@keyframes threatStampSlam{
  0%{transform:scale(3.5) rotate(-8deg);opacity:0;filter:blur(4px)}
  60%{transform:scale(0.95) rotate(0deg);opacity:1;filter:blur(0)}
  75%{transform:scale(1.05) rotate(1deg)}
  100%{transform:scale(1) rotate(0deg);opacity:1;filter:blur(0)}
}
@keyframes threatStampShake{
  0%{transform:translate(0)}
  15%{transform:translate(-10px,6px) rotate(-1deg)}
  30%{transform:translate(8px,-4px) rotate(1deg)}
  45%{transform:translate(-6px,3px)}
  60%{transform:translate(4px,-2px)}
  75%{transform:translate(-2px,1px)}
  100%{transform:translate(0)}
}

.ember-layer{position:absolute;inset:0;pointer-events:none;z-index:1}
.ember{position:absolute;border-radius:50%;background:radial-gradient(circle,#dbb96e,#c87832);box-shadow:0 0 4px rgba(200,164,90,.3);pointer-events:none;z-index:1}
.shatter-box{position:absolute;inset:0;pointer-events:none;z-index:10}
.shard{position:absolute;background:linear-gradient(135deg,rgba(200,164,90,.1),rgba(200,164,90,.01));border:1px solid rgba(200,164,90,.08)}

/* ── Cinematic Enter Button (merged from audio gate) ── */
.cine-enter-wrap{
  margin-top:2rem;text-align:center;z-index:5;
}
.cine-enter-btn{
  font-family:'Noto Serif SC','Rajdhani',sans-serif;
  font-size:clamp(1.1rem,2.5vw,1.5rem);
  color:#c8a45a;letter-spacing:6px;
  padding:.9rem 2.8rem;
  background:rgba(200,164,90,.04);
  border:1px solid rgba(200,164,90,.35);
  border-radius:4px;cursor:pointer;
  transition:all .4s;
  text-shadow:0 0 20px rgba(200,164,90,.3);
  font-weight:700;
  box-shadow:0 0 30px rgba(200,164,90,.05);
}
.cine-enter-btn:hover{
  background:rgba(200,164,90,.1);
  border-color:rgba(200,164,90,.6);
  box-shadow:0 0 40px rgba(200,164,90,.15);
  transform:translateY(-2px);
}
.cine-enter-hint{
  font-family:'Rajdhani',sans-serif;font-size:.7rem;
  color:rgba(200,164,90,.2);letter-spacing:4px;margin-top:.8rem;
}

.skip-btn{
  position:fixed;bottom:2.5rem;right:2.5rem;z-index:99999;
  background:rgba(200,164,90,.15);border:1px solid rgba(200,164,90,.5);
  color:rgba(200,164,90,.85);padding:.65rem 1.6rem;
  font-family:var(--fd);font-size:.75rem;cursor:pointer;
  border-radius:3px;backdrop-filter:blur(8px);letter-spacing:3px;transition:all .3s;
  animation:skipPulse 2s ease-in-out infinite;
}
.skip-btn:hover{background:rgba(200,164,90,.25);border-color:var(--gold);color:var(--gold)}
@keyframes skipPulse{0%,100%{opacity:.85}50%{opacity:1;box-shadow:0 0 12px rgba(200,164,90,.3)}}

/* ══════ TOP BAR ══════ */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:.6rem 1.2rem;
  background:linear-gradient(180deg,rgba(16,22,32,.97),rgba(12,16,24,.95));
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border2);
  position:sticky;top:0;z-index:100;gap:1rem;
}
/* Gold accent strip under topbar */
.topbar::after{
  content:'';position:absolute;bottom:-1px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent 5%,var(--gold) 50%,transparent 95%);
  opacity:.25;
}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:.7rem}
/* Mobile back button — only visible on mobile */
.mobile-back-btn{
  display:none;text-decoration:none;
  font-size:1.2rem;color:var(--gold);padding:.2rem .5rem;
  border:1px solid var(--border2);border-radius:3px;
  background:rgba(200,164,90,.06);
  transition:all .3s;line-height:1;
}
.mobile-back-btn:hover{background:rgba(200,164,90,.15);color:var(--gold2)}
@media(max-width:768px){.mobile-back-btn{display:flex;align-items:center}}
.topbar-center{flex:1;text-align:center}
.logo{display:flex;align-items:center;gap:.5rem}
.logo-icon{font-size:1.4rem}
.logo-txt{font-family:var(--fd);font-size:1rem;font-weight:700;letter-spacing:5px;color:var(--gold);text-shadow:0 0 12px rgba(200,164,90,.15)}
.live-ind{display:flex;align-items:center;gap:.3rem;font-family:var(--fd);font-size:.68rem;letter-spacing:2px;color:var(--red)}
.live-dot{width:6px;height:6px;border-radius:50%;background:var(--red);animation:pulse 1.5s infinite;box-shadow:0 0 4px var(--red)}
.sfx-toggle{background:none;border:1px solid var(--border);color:var(--txt3);padding:.25rem .5rem;border-radius:2px;cursor:pointer;font-size:.85rem;transition:all .3s}
.sfx-toggle:hover{border-color:var(--gold);color:var(--gold)}
.theater-label{font-family:var(--f-impact);font-size:1rem;color:var(--txt);letter-spacing:5px;font-weight:800;text-shadow:0 0 15px rgba(200,164,90,.15)}
.data-ts{font-family:var(--fm);font-size:.65rem;color:var(--txt3);margin-top:.15rem}
.refresh-btn{
  display:flex;align-items:center;gap:.3rem;
  padding:.35rem .75rem;background:rgba(200,164,90,.04);
  border:1px solid var(--border2);color:var(--gold);
  font-size:.75rem;cursor:pointer;border-radius:2px;
  font-family:var(--fb);transition:all .3s;letter-spacing:.5px;
}
.refresh-btn:hover{background:rgba(200,164,90,.08);box-shadow:var(--glow-gold);transform:translateY(-1px)}
.refresh-btn.spinning{animation:spin 1s linear infinite}
.auth-btn{
  display:flex;align-items:center;gap:.3rem;
  padding:.35rem .6rem;background:var(--glass);
  border:1px solid var(--border);color:var(--txt2);
  cursor:pointer;border-radius:2px;font-size:.75rem;font-family:var(--fb);transition:all .3s;
}
.auth-btn:hover{border-color:var(--gold);color:var(--gold)}
.auth-btn-cta{
  background:linear-gradient(135deg,rgba(200,164,90,.15),rgba(144,112,176,.18));
  border:1px solid rgba(200,164,90,.5);color:var(--gold);
  font-family:var(--fd);font-weight:700;font-size:.72rem;letter-spacing:1.5px;
  padding:.4rem .85rem;border-radius:3px;
  animation:authCtaPulse 2.5s ease-in-out infinite;
  text-shadow:0 0 8px rgba(200,164,90,.3);
  box-shadow:0 0 12px rgba(200,164,90,.15),inset 0 0 8px rgba(200,164,90,.05);
}
.auth-btn-cta:hover{
  background:linear-gradient(135deg,rgba(200,164,90,.28),rgba(144,112,176,.3));
  border-color:var(--gold);color:#fff;
  box-shadow:0 0 20px rgba(200,164,90,.3),inset 0 0 10px rgba(200,164,90,.1);
  transform:translateY(-1px);
}
.auth-cta-icon{font-size:.85rem;filter:drop-shadow(0 0 4px rgba(200,164,90,.5))}
@keyframes authCtaPulse{
  0%,100%{box-shadow:0 0 12px rgba(200,164,90,.15),inset 0 0 8px rgba(200,164,90,.05)}
  50%{box-shadow:0 0 22px rgba(200,164,90,.3),inset 0 0 12px rgba(200,164,90,.1)}
}
.q-badge{
  font-family:var(--fd);font-size:.78rem;letter-spacing:2px;
  padding:.35rem .95rem;background:rgba(144,112,176,.08);
  border:1px solid rgba(144,112,176,.3);color:var(--quewi);
  border-radius:2px;text-decoration:none;font-weight:700;
  transition:all .3s;box-shadow:var(--glow-quewi),0 0 20px rgba(144,112,176,.08);
}
.q-badge:hover{background:rgba(144,112,176,.12);transform:translateY(-1px)}

/* ══════ TICKER ══════ */
.ticker-bar{
  display:flex;align-items:center;
  background:linear-gradient(90deg,rgba(196,60,60,.04),rgba(196,60,60,.01),rgba(196,60,60,.04));
  border-bottom:1px solid rgba(196,60,60,.08);overflow:hidden;height:36px;
}
.ticker-label{
  font-family:var(--fd);font-size:.65rem;color:var(--red);
  letter-spacing:3px;padding:0 1rem;white-space:nowrap;flex-shrink:0;
  display:flex;align-items:center;gap:.4rem;
  border-right:1px solid rgba(196,60,60,.1);
}
.blink-red{animation:pulse 1s infinite}
.ticker-track{flex:1;overflow:hidden;position:relative;height:100%;display:flex;align-items:center}
.ticker-content{display:flex;gap:3rem;white-space:nowrap;animation:scroll 120s linear infinite;font-size:.88rem;color:var(--txt2);font-family:var(--f-headline)}
.ticker-item{cursor:pointer;transition:color .3s;padding:0 .3rem;letter-spacing:.3px}
.ticker-item:hover{color:var(--gold)}

/* ══════ HUD BOTTOM ══════ */
.hud-bottom-bar{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:.4rem .8rem;background:linear-gradient(0deg,rgba(8,9,13,.9),transparent);font-family:var(--fm);font-size:.7rem;color:var(--txt3);letter-spacing:1px;z-index:4}

/* ══════ DUAL-PANEL LAYOUT ══════ */
.dual-panel{display:grid;grid-template-columns:420px 1fr;min-height:calc(100vh - 44px)}

/* ══════ PANEL HEADER ══════ */
.panel-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:.65rem 1rem;
  background:linear-gradient(180deg,#0c0d13,#08090d);
  backdrop-filter:blur(12px);
  border-bottom:2px solid rgba(200,164,90,.15);
  position:sticky;top:44px;z-index:20;
  box-shadow:0 4px 16px rgba(0,0,0,.5);
}
/* Animated gold accent line under panel header */
.panel-header::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  opacity:.3;animation:borderTrace 6s linear infinite;
  background-size:200% 100%;
}
.ph-left{display:flex;align-items:center;gap:.5rem}
.ph-icon{font-size:1.2rem}
.ph-title{font-family:'LXGW WenKai SC','Noto Serif SC',serif;font-size:1.2rem;letter-spacing:2px;color:var(--txt);font-weight:700}
.panel-compare .ph-title{
  font-size:1.5rem;
  letter-spacing:4px;
  background:linear-gradient(90deg, var(--gold), #ff6b35, var(--gold));
  background-size:200% 100%;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  animation:wargame-title-shimmer 3s ease-in-out infinite;
  text-shadow:none;
  position:relative;
}
.panel-compare .ph-title::after{
  content:none;
}
@keyframes wargame-title-shimmer{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}
@keyframes live-blink{
  0%,100%{opacity:1}
  50%{opacity:0.3}
}
.ph-badge{
  font-family:var(--fm);font-size:.75rem;
  padding:.18rem .6rem;
  background:rgba(196,60,60,.06);border:1px solid rgba(196,60,60,.15);
  color:var(--red);border-radius:2px;min-width:26px;text-align:center;
}
.ph-right{display:flex;align-items:center;gap:.5rem}

/* ══════ QUEWI INTEL LABEL ══════ */
.quewi-intel-combined{
  font-family:var(--fd);font-size:.95rem;letter-spacing:3px;font-weight:700;
  color:var(--quewi);padding:.45rem 1rem;
  background:linear-gradient(135deg,rgba(144,112,176,.12),rgba(200,164,90,.06));
  border:1px solid rgba(144,112,176,.3);
  border-radius:3px;display:flex;align-items:center;gap:.4rem;
  box-shadow:var(--glow-quewi),0 0 12px rgba(144,112,176,.08);white-space:nowrap;
  text-shadow:0 0 8px rgba(144,112,176,.15);
}
.quewi-intel-combined .chat-quewi-logo{width:20px;height:20px;font-size:.6rem;margin-right:.2rem}
.qi-sat{font-size:.9rem;margin:0 .25rem;filter:drop-shadow(0 0 3px rgba(200,164,90,.3));animation:qi-pulse 2.5s infinite alternate}
@keyframes qi-pulse{0%{opacity:.6;transform:scale(1)}100%{opacity:1;transform:scale(1.08)}}

/* ══════ LEFT PANEL — INTEL FEED ══════ */
.panel-intel{
  background:var(--glass2);border-right:1px solid var(--border);
  display:flex;flex-direction:column;max-height:calc(100vh - 44px);
  position:sticky;top:44px;
  overflow:hidden;
}
/* Ambient scan line on intel panel */
.panel-intel::after{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,
    transparent 0%,
    transparent 45%,
    rgba(200,164,90,.06) 49%,
    rgba(200,164,90,.1) 50%,
    rgba(200,164,90,.06) 51%,
    transparent 55%,
    transparent 100%);
  background-size:100% 200%;
  animation:intelScan 5s ease-in-out infinite;
}
@keyframes intelScan{0%{background-position:0 -100%}50%{background-position:0 200%}100%{background-position:0 -100%}}
.panel-intel>*{position:relative;z-index:1}
.intel-search{position:relative}
.intel-search-input{
  background:var(--bg);border:1px solid var(--border);color:var(--txt);
  padding:.4rem .7rem .4rem 2.2rem;font-size:.8rem;border-radius:2px;
  width:170px;font-family:var(--fb);transition:all .3s;
}
.intel-search-input:focus{border-color:var(--gold);outline:none;width:210px;box-shadow:0 0 10px rgba(200,164,90,.06)}
.search-icon{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);font-size:.75rem;opacity:.4}
.news-list-wrap{flex:1;overflow-y:auto;padding:0}
.news-list{padding:.4rem 0;margin-top:1.2rem}

/* ══════ NEWS ITEMS ══════ */
.news-item{
  display:flex;gap:.8rem;padding:.85rem 1.1rem;margin:0;cursor:pointer;
  transition:all .35s ease;align-items:flex-start;position:relative;
  border-bottom:1px solid rgba(200,164,90,.04);
  animation:newsSlideIn .4s ease-out both;
}
.news-item:nth-child(1){animation-delay:0s}
.news-item:nth-child(2){animation-delay:.04s}
.news-item:nth-child(3){animation-delay:.08s}
.news-item:nth-child(4){animation-delay:.12s}
.news-item:nth-child(5){animation-delay:.16s}
.news-item:nth-child(6){animation-delay:.2s}
.news-item:nth-child(7){animation-delay:.24s}
.news-item:nth-child(8){animation-delay:.28s}
@keyframes newsSlideIn{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:translateX(0)}}
.news-item::before{
  content:'';position:absolute;left:0;top:0;bottom:0;
  width:0;background:linear-gradient(180deg,var(--gold),rgba(200,164,90,.3));transition:width .3s;opacity:.7;
}
.news-item:hover{
  background:linear-gradient(90deg,rgba(200,164,90,.05),transparent);
  transform:translateX(3px);
  box-shadow:inset 3px 0 12px rgba(200,164,90,.03);
}
.news-item:hover::before{width:2px}
.news-item.breaking{
  border-left:2px solid var(--red);
  background:linear-gradient(90deg,rgba(196,60,60,.04),transparent);
}
/* Live pulse dot for breaking news */
.news-item.breaking::after{
  content:'';position:absolute;right:8px;top:50%;width:6px;height:6px;
  border-radius:50%;background:var(--red);
  box-shadow:0 0 6px var(--red);
  animation:pulse 1.5s infinite;transform:translateY(-50%);
}
.news-item-thumb{
  width:68px;height:52px;border-radius:3px;object-fit:cover;flex-shrink:0;
  background:var(--bg4);border:1px solid var(--border);
  transition:all .3s;
}
.news-item:hover .news-item-thumb{border-color:rgba(200,164,90,.15);box-shadow:0 2px 8px rgba(0,0,0,.3)}
.news-item-body{flex:1;min-width:0}
.news-item-source{font-size:.72rem;margin-bottom:.35rem;line-height:1;display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}
.news-item-title{
  font-size:.95rem;line-height:1.6;color:var(--txt);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-family:var(--f-headline);font-weight:600;letter-spacing:.5px;
  transition:color .3s;
}
.news-item:hover .news-item-title{color:var(--gold2)}
.news-item-summary{
  font-size:.78rem;color:var(--txt3);line-height:1.5;margin-top:.15rem;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
}
.news-item-meta{
  display:flex;align-items:center;justify-content:space-between;margin-top:.25rem;gap:.4rem;
}
.news-item-time{font-size:.62rem;color:var(--txt3);font-family:var(--fm);white-space:nowrap}

/* ── News Item Mini Social Bar ── */
.news-social-mini{
  display:inline-flex;align-items:center;gap:.15rem;margin-left:auto;
}
.ns-btn{
  background:none;border:none;color:var(--txt3);font-size:.6rem;
  cursor:pointer;padding:2px 5px;border-radius:10px;
  display:inline-flex;align-items:center;gap:3px;
  transition:all .2s;white-space:nowrap;line-height:1;
}
.ns-svg{width:13px;height:13px;flex-shrink:0;opacity:.55;transition:opacity .2s}
.ns-btn:hover .ns-svg{opacity:1}
.ns-btn:hover{background:rgba(200,164,90,.1);color:var(--gold2)}
.ns-btn .ns-cnt{font-size:.58rem;font-family:var(--fm)}
.ns-liked{color:var(--red) !important}
.ns-liked:hover{background:rgba(196,60,60,.1)}
.ns-share:hover{color:var(--cyan)}
.ns-orig-link{color:var(--txt3);font-size:.6rem;letter-spacing:.3px}
.ns-orig-link:hover{color:var(--cyan);background:rgba(0,180,216,.08)}

/* ══════ INTEL FOOTER ══════ */
.intel-footer{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;border-top:1px solid var(--border);background:var(--glass)}
.intel-src-note{font-size:.62rem;color:var(--txt3)}
.intel-custom-btn{
  padding:.28rem .65rem;background:rgba(200,164,90,.04);
  border:1px solid rgba(200,164,90,.12);color:var(--gold);
  font-size:.68rem;cursor:pointer;border-radius:2px;font-family:var(--fb);transition:all .25s;
}
.intel-custom-btn:hover{background:rgba(200,164,90,.08);border-color:var(--gold)}

/* ══════ RIGHT PANEL — COMPARISON ══════ */
.panel-compare{
  background:var(--bg);min-height:0;overflow-y:auto;overflow-x:hidden;
  position:relative;
}
/* Ambient war-zone atmosphere on right panel */
.panel-compare::before{
  content:'';position:fixed;top:0;right:0;width:60vw;height:100vh;
  background:
    radial-gradient(ellipse at 25% 15%, rgba(196,60,60,.12) 0%, transparent 45%),
    radial-gradient(ellipse at 75% 85%, rgba(74,127,181,.08) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 50%, rgba(200,164,90,.06) 0%, transparent 55%);
  pointer-events:none;z-index:0;
  animation:ambientShift 12s ease-in-out infinite alternate;
}
@keyframes ambientShift{
  0%{opacity:.5;transform:scale(1) translate(0,0)}
  33%{opacity:.8;transform:scale(1.03) translate(1%,-1%)}
  66%{opacity:1;transform:scale(1.06) translate(-1%,1%)}
  100%{opacity:.5;transform:scale(1) translate(0,0)}
}
.panel-compare .panel-header{position:relative;z-index:2}
.compare-body{position:relative;z-index:1}
.panel-compare .panel-header{top:0;z-index:2}
.compare-body{padding:1.2rem;overflow:visible;position:relative;z-index:1}

/* ══════ MODEL INDICATORS (legacy — kept for compat) ══════ */
.model-indicators{display:flex;gap:.5rem}
.mi{
  font-family:var(--fd);font-size:.68rem;letter-spacing:1.5px;
  color:var(--mc);padding:.3rem .8rem;border:1px solid var(--mc);
  border-radius:2px;opacity:1;background:rgba(255,255,255,.02);font-weight:600;
}
.mi-clickable{cursor:pointer;transition:all .3s;position:relative}
.mi-clickable:hover{background:rgba(255,255,255,.06);transform:translateY(-1px)}
.mi-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;background:var(--mc);animation:miDotPulse 2s ease-in-out infinite}
@keyframes miDotPulse{0%,100%{opacity:1;box-shadow:0 0 3px var(--mc)}50%{opacity:.4;box-shadow:0 0 8px var(--mc)}}
.mi-pulse{animation:miBorderPulse 3s ease-in-out infinite}
@keyframes miBorderPulse{0%,100%{border-color:var(--mc);box-shadow:0 0 0 rgba(255,255,255,0)}50%{border-color:var(--mc);box-shadow:0 0 8px rgba(255,255,255,.08)}}
.mi-click-hint{display:none}

/* ── LIVE badge on header ── */
.wg-live-badge{
  font-family:var(--fd);font-size:.55rem;letter-spacing:2px;font-weight:700;
  color:#fff;background:var(--red);padding:2px 10px;border-radius:2px;
  margin-left:8px;animation:livePulse 1.5s ease-in-out infinite;
  box-shadow:0 0 8px rgba(196,60,60,.4);
}
@keyframes livePulse{0%,100%{opacity:1;box-shadow:0 0 8px rgba(196,60,60,.4)}50%{opacity:.75;box-shadow:0 0 18px rgba(196,60,60,.7)}}

/* ═══════════════════════════════════════════════════
   WAR-ROOM HERO MODEL CARDS — cinematic, dramatic
   ═══════════════════════════════════════════════════ */
.wg-hero-strip{
  position:relative;
  padding:1.2rem 1.2rem .8rem;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(200,164,90,.04) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 80%, rgba(100,160,210,.03) 0%, transparent 60%),
    linear-gradient(180deg, rgba(8,10,16,.95), rgba(12,14,22,.9));
  border-bottom:1px solid rgba(200,164,90,.08);
  overflow:hidden;
}
.wg-hero-scanline{
  position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(200,164,90,.015) 2px, rgba(200,164,90,.015) 4px);
  z-index:0;
}
.wg-hero-cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;
  position:relative;z-index:1;
}

/* ── Individual Hero Card ── */
.wg-hero-card{
  position:relative;cursor:pointer;
  padding:1.4rem 1.2rem 1rem;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(145deg, rgba(20,24,35,.9), rgba(14,18,28,.95));
  overflow:hidden;
  transition:all .35s cubic-bezier(.4,0,.2,1);
  text-align:center;
  box-shadow:0 4px 20px rgba(0,0,0,.3);
}
.wg-hero-card:hover{
  transform:translateY(-4px) scale(1.02);
  box-shadow:0 8px 40px rgba(0,0,0,.5);
  border-color:rgba(255,255,255,.12);
}
/* Model-specific accent colors */
.wg-hc-claude{--hc:var(--claude);--hcr:200,155,106}
.wg-hc-gpt{--hc:var(--gpt);--hcr:107,159,212}
.wg-hc-gemini{--hc:var(--gemini);--hcr:94,188,178}

.wg-hero-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg, transparent, var(--hc), transparent);
  opacity:.6;
}
.wg-hero-card:hover::before{opacity:1}

/* Corner glow */
.wg-hc-glow{
  position:absolute;top:-30px;right:-30px;width:100px;height:100px;
  background:radial-gradient(circle, rgba(var(--hcr),.12), transparent 70%);
  pointer-events:none;transition:opacity .3s;
}
.wg-hero-card:hover .wg-hc-glow{opacity:1.5}

/* Mini radar */
.wg-hc-radar{
  position:absolute;bottom:8px;right:8px;width:40px;height:40px;
  border-radius:50%;border:1px solid rgba(var(--hcr),.12);
  overflow:hidden;opacity:.4;
}
.wg-hc-radar-sweep{
  position:absolute;top:50%;left:50%;width:50%;height:1px;
  background:linear-gradient(90deg, rgba(var(--hcr),.5), transparent);
  transform-origin:left center;
  animation:radarSweep 3s linear infinite;
}
@keyframes radarSweep{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Status badge */
.wg-hc-status{
  font-family:var(--fd);font-size:.55rem;letter-spacing:2px;font-weight:700;
  color:var(--green);margin-bottom:.6rem;
  display:flex;align-items:center;justify-content:center;gap:5px;
}
.wg-hc-dot{
  width:6px;height:6px;border-radius:50%;background:var(--green);
  box-shadow:0 0 6px var(--green);
  animation:hcDotPulse 1.5s ease-in-out infinite;
}
@keyframes hcDotPulse{0%,100%{opacity:1;box-shadow:0 0 6px var(--green)}50%{opacity:.5;box-shadow:0 0 12px var(--green)}}

/* Icon */
.wg-hc-icon{
  font-size:2.2rem;margin-bottom:.4rem;
  filter:drop-shadow(0 0 12px rgba(var(--hcr),.4));
  animation:hcIconFloat 4s ease-in-out infinite;
}
@keyframes hcIconFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* Name */
.wg-hc-name{
  font-family:var(--fd);font-size:1.1rem;font-weight:700;
  letter-spacing:3px;color:var(--hc);
  text-shadow:0 0 20px rgba(var(--hcr),.3);
  margin-bottom:.15rem;
}

/* Sub-label */
.wg-hc-sub{
  font-family:var(--fm);font-size:.62rem;color:var(--txt3);
  letter-spacing:1px;margin-bottom:.7rem;
}

/* Loading bar */
.wg-hc-bar{
  height:2px;background:rgba(255,255,255,.06);border-radius:1px;
  overflow:hidden;margin-bottom:.5rem;
}
.wg-hc-bar-fill{
  height:100%;width:0%;border-radius:1px;
  background:linear-gradient(90deg, var(--hc), rgba(var(--hcr),.3));
  box-shadow:0 0 8px rgba(var(--hcr),.4);
  transition:width 1.5s cubic-bezier(.4,0,.2,1);
}

/* Bottom label */
.wg-hc-label{
  font-family:var(--fd);font-size:.5rem;letter-spacing:3px;
  color:rgba(255,255,255,.2);font-weight:600;
}

/* Hover effects */
.wg-hero-card:hover .wg-hc-name{text-shadow:0 0 30px rgba(var(--hcr),.5)}
.wg-hero-card:hover .wg-hc-radar{opacity:.8}
.wg-hero-card:hover .wg-hc-label{color:rgba(255,255,255,.4)}

/* Staggered entry animation */
.wg-hero-card{animation:hcSlideUp .6s ease-out both}
.wg-hc-claude{animation-delay:0s}
.wg-hc-gpt{animation-delay:.15s}
.wg-hc-gemini{animation-delay:.3s}
@keyframes hcSlideUp{
  from{opacity:0;transform:translateY(20px) scale(.95)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

/* ── Hero cards responsive ── */
@media(max-width:900px){
  .wg-hero-cards{gap:.7rem}
  .wg-hero-card{padding:1rem .8rem .8rem}
  .wg-hc-icon{font-size:1.6rem}
  .wg-hc-name{font-size:.9rem;letter-spacing:2px}
}
@media(max-width:600px){
  .wg-hero-cards{grid-template-columns:1fr;gap:.6rem}
  .wg-hero-strip{padding:.8rem .8rem .5rem}
  .wg-hero-card{
    display:grid;grid-template-columns:auto 1fr auto;align-items:center;
    text-align:left;padding:.7rem .8rem;gap:0 .6rem;
  }
  .wg-hc-glow,.wg-hc-radar,.wg-hc-scanline{display:none}
  .wg-hc-status{grid-column:1/-1;margin-bottom:.2rem;justify-content:flex-start;font-size:.5rem}
  .wg-hc-icon{font-size:1.4rem;grid-row:2;margin:0}
  .wg-hc-name{font-size:.8rem;grid-row:2;margin:0}
  .wg-hc-sub{grid-row:3;grid-column:2;margin:0;font-size:.55rem}
  .wg-hc-bar{grid-column:1/-1;margin:.3rem 0 .1rem}
  .wg-hc-label{grid-column:1/-1;text-align:center}
}

/* ══════ RISK OVERVIEW ══════ */
.risk-overview{
  margin-bottom:1.2rem;
  background:
    radial-gradient(ellipse at 20% 40%, rgba(196,60,60,.05) 0%, transparent 50%),
    linear-gradient(135deg,rgba(16,22,32,.92),rgba(22,32,45,.88));
  border:1px solid rgba(196,60,60,.12);border-left:3px solid rgba(196,60,60,.4);
  border-radius:4px;padding:1rem;position:relative;overflow:hidden;
  animation:riskGlow 6s ease-in-out infinite;
}
.risk-overview::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(45deg,transparent 30%,rgba(196,60,60,.02) 50%,transparent 70%);
  animation:scanMove 12s linear infinite;pointer-events:none;
}
/* Second overlay — holographic grid */
.risk-overview::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(196,60,60,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196,60,60,.02) 1px, transparent 1px);
  background-size:30px 30px;
  animation:gridPulse 6s ease-in-out infinite;
}
.risk-ov-title{
  font-family:var(--fd);font-size:.82rem;color:var(--red);letter-spacing:4px;
  margin-bottom:.7rem;display:flex;align-items:center;gap:.5rem;
  text-shadow:0 0 12px rgba(196,60,60,.2);font-weight:700;
  padding-bottom:.5rem;border-bottom:1px solid rgba(196,60,60,.1);
  position:relative;
}
.risk-ov-title .pulse-dot-red{width:8px;height:8px;background:var(--red);border-radius:50%;animation:pulse 1.5s infinite;box-shadow:0 0 8px var(--red)}
.risk-bars{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;position:relative}
.risk-bar-item{
  padding:.55rem .7rem;
  background:linear-gradient(145deg,rgba(0,0,0,.3),rgba(16,22,32,.6));
  border:1px solid rgba(200,164,90,.06);border-radius:4px;
  transition:all .3s;position:relative;overflow:hidden;
}
.risk-bar-item:hover{border-color:rgba(200,164,90,.12);transform:translateY(-1px);box-shadow:0 4px 15px rgba(0,0,0,.2)}
.risk-bar-label{font-family:var(--fh);font-size:.8rem;color:var(--txt2);letter-spacing:.5px;margin-bottom:.3rem;font-weight:500}
.risk-bar-track{height:6px;background:var(--bg4);border-radius:3px;overflow:hidden;margin-bottom:.2rem;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}
.risk-bar-fill{height:100%;border-radius:3px;transition:width 1s cubic-bezier(.4,0,.2,1);box-shadow:0 0 6px rgba(196,60,60,.15)}
.risk-bar-models{display:flex;justify-content:space-between;font-size:.62rem}
.risk-bar-models span{font-family:var(--fm)}

/* ══════ MILITARY DASHBOARD ══════ */
.mil-dashboard{
  margin-bottom:1.2rem;position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(180,50,40,.08) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(50,85,150,.06) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(200,164,90,.04) 0%, transparent 60%);
  border-radius:6px;padding:1rem;
  border:1px solid rgba(200,164,90,.06);
}
/* Holographic military grid overlay */
.mil-dashboard::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(200,164,90,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(200,164,90,.08) 1px, transparent 1px);
  background-size:40px 40px;
  animation:gridPulse 4s ease-in-out infinite;
}
/* Radar sweep overlay */
.mil-dashboard::after{
  content:'';position:absolute;top:50%;left:50%;width:600px;height:600px;
  transform:translate(-50%,-50%);
  background:conic-gradient(from 0deg, transparent 0deg, rgba(200,164,90,.04) 30deg, transparent 60deg);
  animation:radarSweep 12s linear infinite;
  pointer-events:none;z-index:0;opacity:.5;
  mask-image:radial-gradient(circle,#000 30%,transparent 70%);
  -webkit-mask-image:radial-gradient(circle,#000 30%,transparent 70%);
}
.mil-dashboard>*{position:relative;z-index:1}
.dash-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem;position:relative}
.dash-title{
  font-family:var(--f-impact);font-size:.95rem;color:var(--gold);letter-spacing:3px;
  display:flex;align-items:center;gap:.5rem;font-weight:700;
  text-shadow:0 0 12px rgba(200,164,90,.15);
}
.dash-refresh{
  font-size:.65rem;color:var(--txt3);cursor:pointer;padding:.25rem .55rem;
  border:1px solid var(--border2);border-radius:2px;background:rgba(200,164,90,.02);
  transition:all .3s;font-family:var(--fb);
}
.dash-refresh:hover{border-color:var(--gold);color:var(--gold);box-shadow:0 0 10px rgba(200,164,90,.1);background:rgba(200,164,90,.05)}

/* Dashboard freshness badge */
.dash-age{font-size:.55rem;margin-left:.5rem;padding:.15rem .4rem;border-radius:2px;font-family:var(--fb)}
.dash-age-fresh{color:#0f0;background:rgba(0,255,0,.08);border:1px solid rgba(0,255,0,.2)}
.dash-age-aging{color:var(--orange);background:rgba(255,165,0,.08);border:1px solid rgba(255,165,0,.2)}
.dash-age-stale{color:var(--red);background:rgba(255,60,60,.1);border:1px solid rgba(255,60,60,.3);animation:pulse-stale 2s infinite}
@keyframes pulse-stale{0%,100%{opacity:1}50%{opacity:.6}}

/* Force header */
.force-header{
  display:flex;align-items:center;justify-content:center;gap:1.8rem;
  margin-bottom:.9rem;padding:.9rem;
  background:linear-gradient(90deg,rgba(180,50,40,.15),rgba(16,22,32,.92) 30%,rgba(16,22,32,.92) 70%,rgba(50,85,150,.15));
  border-radius:4px;border:1px solid rgba(200,164,90,.15);
  position:relative;overflow:hidden;
  box-shadow:0 2px 20px rgba(0,0,0,.4),inset 0 0 40px rgba(0,0,0,.2);
  animation:headerTension 3s ease-in-out infinite;
}
@keyframes headerTension{
  0%,100%{background:linear-gradient(90deg,rgba(180,50,40,.10),rgba(16,22,32,.92) 30%,rgba(16,22,32,.92) 70%,rgba(50,85,150,.10))}
  50%{background:linear-gradient(90deg,rgba(180,50,40,.20),rgba(16,22,32,.92) 35%,rgba(16,22,32,.92) 65%,rgba(50,85,150,.20))}
}
/* Animated tension line between red and blue */
.force-header::before{
  content:'';position:absolute;top:50%;left:50%;width:2px;height:70%;
  background:linear-gradient(180deg,transparent,var(--gold),transparent);
  transform:translate(-50%,-50%);
  animation:pulse 2s infinite;
  box-shadow:0 0 8px rgba(200,164,90,.3);
}
.force-header::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(180,50,40,.04),transparent 40%,transparent 60%,rgba(50,85,150,.04));
  animation:warningStrobe 6s ease-in-out infinite;
  pointer-events:none;
}
.force-side{display:flex;align-items:center;gap:.6rem}
.force-side.red{color:var(--force-red)}.force-side.blue{color:var(--force-blue)}
.force-flag{font-size:1.6rem;animation:flagWave 4s ease-in-out infinite}
@keyframes flagWave{0%,100%{transform:rotate(0deg) scale(1)}25%{transform:rotate(-2deg) scale(1.03)}75%{transform:rotate(2deg) scale(1.03)}}
.force-name{font-family:var(--fd);font-size:.8rem;letter-spacing:3px;font-weight:700}
.force-vs{
  font-family:var(--fd);font-size:1.1rem;color:var(--gold);letter-spacing:4px;font-weight:800;
  text-shadow:0 0 12px rgba(200,164,90,.3),0 0 30px rgba(200,164,90,.1);
  animation:vsPulse 3s ease-in-out infinite;
}
@keyframes vsPulse{0%,100%{text-shadow:0 0 12px rgba(200,164,90,.3),0 0 30px rgba(200,164,90,.1)}50%{text-shadow:0 0 20px rgba(200,164,90,.5),0 0 50px rgba(200,164,90,.15),0 0 80px rgba(200,164,90,.05)}}

/* Force cards */
.force-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.7rem;margin-bottom:.9rem}
.force-card{
  background:linear-gradient(145deg,rgba(16,22,32,.88),rgba(22,32,45,.82));
  border:1px solid rgba(200,164,90,.12);border-radius:4px;
  padding:.8rem;transition:all .4s;position:relative;overflow:hidden;
  border-left:3px solid rgba(200,164,90,.35);
  animation:cardReveal .5s ease-out both, cardBreathe 4s ease-in-out infinite;
  box-shadow:0 2px 12px rgba(0,0,0,.3),inset 0 0 30px rgba(0,0,0,.15);
}
@keyframes cardBreathe{
  0%,100%{box-shadow:0 2px 12px rgba(0,0,0,.3),inset 0 0 30px rgba(0,0,0,.15),0 0 0 rgba(200,164,90,0)}
  50%{box-shadow:0 2px 12px rgba(0,0,0,.3),inset 0 0 30px rgba(0,0,0,.15),0 0 15px rgba(200,164,90,.08),inset 0 0 15px rgba(200,164,90,.03)}
}
.force-card:nth-child(1){animation-delay:.1s}
.force-card:nth-child(2){animation-delay:.18s}
.force-card:nth-child(3){animation-delay:.26s}
.force-card:nth-child(4){animation-delay:.34s}
.force-card:nth-child(5){animation-delay:.42s}
.force-card:nth-child(6){animation-delay:.5s}
.force-card:hover{border-color:rgba(200,164,90,.25);transform:translateY(-3px);box-shadow:0 6px 25px rgba(0,0,0,.45),0 0 20px rgba(200,164,90,.06),inset 0 0 30px rgba(0,0,0,.15)}
/* Ambient glow — subtle copper/teal tension */
.force-card::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(180,50,40,.03) 0%,transparent 40%,transparent 60%,rgba(50,85,150,.03) 100%);
  opacity:0;transition:opacity .5s;
}
.force-card:hover::before{opacity:1}
/* Scan line on force card */
.force-card::after{
  content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(200,164,90,.03),transparent);
  animation:shimmer 4s ease-in-out infinite;
  pointer-events:none;z-index:0;
}
.force-card-title{
  font-family:var(--fd);font-size:.75rem;color:var(--gold);letter-spacing:3px;
  margin-bottom:.5rem;display:flex;align-items:center;gap:.45rem;
  padding-bottom:.35rem;border-bottom:1px solid rgba(200,164,90,.08);font-weight:600;
  text-shadow:0 0 8px rgba(200,164,90,.15);
}
.force-card-icon{font-size:1.1rem;filter:drop-shadow(0 0 4px rgba(200,164,90,.2));animation:qi-pulse 3s infinite alternate}
/* Red vs Blue comparison bar */
.force-compare-bar{margin:.4rem 0;animation:cardReveal .5s ease-out both}
.fcb-label{font-size:.75rem;color:var(--txt2);margin-bottom:.15rem;font-family:var(--fb);display:flex;justify-content:space-between}
.fcb-label .fcb-red{color:var(--force-red);font-family:var(--fm);font-weight:600;text-shadow:0 0 6px rgba(200,60,50,.2)}
.fcb-label .fcb-blue{color:var(--force-blue);font-family:var(--fm);font-weight:600;text-shadow:0 0 6px rgba(50,90,160,.2)}
.fcb-track{
  display:flex;height:26px;background:linear-gradient(180deg,rgba(12,16,24,.5),rgba(22,32,45,.7));border-radius:13px;overflow:hidden;
  position:relative;box-shadow:inset 0 2px 8px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.3);
  border:1px solid rgba(200,164,90,.1);
}
/* Clash spark at the seam */
.fcb-track::after{
  content:'';position:absolute;top:-2px;bottom:-2px;width:3px;
  left:var(--clash-point,50%);z-index:2;
  background:linear-gradient(180deg,transparent,#fff,var(--gold),#fff,transparent);
  box-shadow:0 0 6px rgba(255,255,255,.6),0 0 16px rgba(200,164,90,.4),0 0 30px rgba(255,200,50,.1);
  animation:clashSpark 1.5s ease-in-out infinite;
  border-radius:2px;
}
@keyframes clashSpark{
  0%,100%{opacity:.5;box-shadow:0 0 4px rgba(255,255,255,.4),0 0 12px rgba(200,164,90,.2)}
  50%{opacity:1;box-shadow:0 0 10px rgba(255,255,255,.8),0 0 20px rgba(200,164,90,.5),0 0 40px rgba(255,200,50,.15)}
}
.fcb-fill-red{
  background:linear-gradient(90deg,rgba(160,50,40,.85),rgba(200,70,55,.8),rgba(220,95,75,.75));
  height:100%;transition:width 1.2s cubic-bezier(.4,0,.2,1);
  display:flex;align-items:center;justify-content:center;
  font-size:.58rem;font-family:var(--fm);color:#fff;font-weight:700;
  text-shadow:0 1px 3px rgba(0,0,0,.5);min-width:20px;
  position:relative;overflow:hidden;border-radius:0;
  animation:barPulseRed 2.5s ease-in-out infinite;
}
/* When red is 100%, track handles rounding */
.fcb-fill-red[data-w="100"]{border-radius:0}
@keyframes barPulseRed{
  0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 0 6px rgba(200,60,50,.2)}
  50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 0 12px rgba(200,60,50,.35),0 0 20px rgba(200,60,50,.1)}
}
/* Animated shimmer on red bar */
.fcb-fill-red::after{
  content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);
  animation:shimmer 2.5s ease-in-out infinite;
}
.fcb-fill-blue{
  background:linear-gradient(270deg,rgba(45,85,140,.85),rgba(65,115,180,.8),rgba(90,140,210,.75));
  height:100%;transition:width 1.2s cubic-bezier(.4,0,.2,1);
  display:flex;align-items:center;justify-content:center;
  font-size:.58rem;font-family:var(--fm);color:#fff;font-weight:700;
  text-shadow:0 1px 3px rgba(0,0,0,.5);min-width:20px;
  position:relative;overflow:hidden;border-radius:0;
  animation:barPulseBlue 2.8s ease-in-out infinite;
}
/* When blue is 100%, track handles rounding */
.fcb-fill-blue[data-w="100"]{border-radius:0}
@keyframes barPulseBlue{
  0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 0 6px rgba(50,90,160,.2)}
  50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 0 12px rgba(50,90,160,.35),0 0 20px rgba(50,90,160,.1)}
}
/* Animated shimmer on blue bar */
.fcb-fill-blue::after{
  content:'';position:absolute;top:0;right:-100%;width:60%;height:100%;
  background:linear-gradient(270deg,transparent,rgba(255,255,255,.15),transparent);
  animation:shimmer 2.8s ease-in-out infinite;
}

/* Interactive sliders */
.force-sliders{
  background:linear-gradient(145deg,rgba(16,22,32,.88),rgba(22,32,45,.82));
  border:1px solid var(--border2);border-radius:4px;
  padding:.8rem;margin-bottom:.9rem;border-left:3px solid rgba(200,164,90,.2);
  position:relative;
}
.force-sliders-title{
  font-family:var(--fd);font-size:.75rem;color:var(--gold);letter-spacing:3px;
  margin-bottom:.6rem;display:flex;align-items:center;gap:.4rem;
}
.slider-row{display:flex;align-items:center;gap:.6rem;margin:.35rem 0;padding:.25rem 0}
.slider-label{font-size:.75rem;color:var(--txt2);width:100px;flex-shrink:0;font-family:var(--fh);font-weight:500}
.slider-input{
  flex:1;-webkit-appearance:none;appearance:none;height:4px;
  background:linear-gradient(90deg,var(--force-red),var(--gold),var(--force-blue));
  border-radius:2px;outline:none;cursor:pointer;
}
.slider-input::-webkit-slider-thumb{
  -webkit-appearance:none;width:16px;height:16px;border-radius:50%;
  background:var(--gold);border:2px solid var(--bg);cursor:pointer;
  box-shadow:0 0 8px rgba(200,164,90,.3);transition:all .2s;
}
.slider-input::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 0 14px rgba(200,164,90,.5)}
.slider-value{font-family:var(--fm);font-size:.72rem;color:var(--gold);width:45px;text-align:right;font-weight:600}

/* Overall balance gauge */
.balance-gauge{
  background:linear-gradient(135deg,rgba(16,22,32,.9),rgba(200,164,90,.02),rgba(16,22,32,.9));
  border:1px solid rgba(200,164,90,.1);border-radius:4px;
  padding:.8rem;margin-bottom:.9rem;text-align:center;
  position:relative;overflow:hidden;
}
.balance-gauge::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(208,128,80,.02),transparent 30%,transparent 70%,rgba(61,143,160,.02));
  pointer-events:none;
}
.gauge-title{font-family:var(--fd);font-size:.78rem;color:var(--gold);letter-spacing:3px;margin-bottom:.5rem}
.gauge-bar{height:28px;background:var(--bg4);border-radius:3px;overflow:hidden;position:relative;margin:.4rem 0;display:flex}
.gauge-fill-red{height:100%;background:linear-gradient(90deg,rgba(160,50,40,.8),rgba(200,70,55,.75));border-radius:0;transition:width .8s ease;flex-shrink:0}
.gauge-fill-blue{height:100%;background:linear-gradient(270deg,rgba(45,85,140,.8),rgba(65,115,180,.75));border-radius:0;transition:width .8s ease;flex-shrink:0}
.gauge-marker{position:absolute;top:-3px;bottom:-3px;width:3px;background:#fff;border-radius:2px;transform:translateX(-50%);transition:left .8s ease;box-shadow:0 0 8px rgba(255,255,255,.4)}
.gauge-labels{display:flex;justify-content:space-between;font-size:.68rem}
.gauge-labels .g-red{color:var(--force-red);font-family:var(--fd);letter-spacing:1px}
.gauge-labels .g-blue{color:var(--force-blue);font-family:var(--fd);letter-spacing:1px}
.gauge-labels .g-pct{color:var(--gold);font-family:var(--fm);font-weight:700;font-size:.82rem}

/* Force AI Commentary Box */
.force-ai-commentary{
  margin-top:.6rem;padding:.6rem .75rem;
  background:linear-gradient(135deg,rgba(10,14,20,.7),rgba(20,28,40,.6));
  border:1px solid rgba(200,164,90,.1);border-radius:6px;
  border-left:3px solid var(--gold);
  animation:fadeSlideIn .4s ease-out;
}
.fac-header{
  display:flex;align-items:center;gap:6px;margin-bottom:.35rem;
  font-family:var(--fd);font-size:.65rem;color:var(--gold);letter-spacing:1.5px;text-transform:uppercase;
}
.fac-icon{width:14px;height:14px;flex-shrink:0;color:var(--gold)}
.fac-text{
  font-family:var(--fb);font-size:.78rem;color:var(--txt);line-height:1.65;
  letter-spacing:.2px;
}
.fac-loading{
  font-size:.7rem;color:var(--txt3);font-family:var(--fb);
  display:flex;align-items:center;gap:6px;
}
.fac-dot{
  width:6px;height:6px;border-radius:50%;background:var(--gold);
  animation:facPulse 1s infinite;
}
@keyframes facPulse{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes fadeSlideIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* Summary stats grid */
.dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5rem;margin-bottom:.7rem}
.dash-card{
  background:linear-gradient(145deg,rgba(16,22,32,.88),rgba(22,32,45,.82));
  border:1px solid var(--border2);border-radius:4px;
  padding:.6rem;text-align:center;transition:all .4s;position:relative;overflow:hidden;
  animation:cardReveal .5s ease-out both;
}
.dash-card:nth-child(1){animation-delay:.05s}
.dash-card:nth-child(2){animation-delay:.1s}
.dash-card:nth-child(3){animation-delay:.15s}
.dash-card:nth-child(4){animation-delay:.2s}
.dash-card:nth-child(5){animation-delay:.25s}
.dash-card:nth-child(6){animation-delay:.3s}
.dash-card:hover{border-color:rgba(200,164,90,.2);transform:translateY(-3px);box-shadow:0 6px 20px rgba(0,0,0,.35),0 0 12px var(--accent-glow,rgba(200,164,90,.06))}
.dash-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent,var(--gold));box-shadow:0 0 8px var(--accent,rgba(200,164,90,.15))}
.dash-card.danger{--accent:var(--red);--accent-glow:rgba(196,60,60,.08)}
.dash-card.warn{--accent:var(--orange);--accent-glow:rgba(200,120,50,.08)}
.dash-card.ok{--accent:var(--green);--accent-glow:rgba(106,154,74,.08)}
.dash-card.info{--accent:var(--gold);--accent-glow:rgba(200,164,90,.08)}
.dash-card.special{--accent:var(--quewi);--accent-glow:rgba(144,112,176,.08)}
.dash-icon{font-size:1.3rem;margin-bottom:.15rem;filter:drop-shadow(0 0 4px rgba(200,164,90,.1))}
.dash-value{font-family:var(--fd);font-size:1.05rem;font-weight:700;color:var(--accent,var(--gold));letter-spacing:1px;text-shadow:0 0 8px var(--accent-glow,rgba(200,164,90,.1))}
.dash-label{font-size:.68rem;color:var(--txt3);margin-top:.12rem;letter-spacing:.5px;font-family:var(--fb)}
/* accent classes moved into .dash-card block above */

/* Key events */
.dash-events{
  background:linear-gradient(135deg,rgba(16,22,32,.9),rgba(196,60,60,.02),rgba(16,22,32,.9));
  border:1px solid rgba(196,60,60,.1);border-radius:4px;
  padding:.6rem .8rem;margin-bottom:.7rem;border-left:3px solid rgba(196,60,60,.35);
  position:relative;overflow:hidden;
}
.dash-events::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(196,60,60,.015),transparent);
  animation:threatWave 7s ease-in-out infinite;
  transform-origin:left;pointer-events:none;
}
.dash-events-title{font-family:'Noto Sans SC',var(--fd),sans-serif;font-size:.75rem;color:var(--gold);letter-spacing:2px;margin-bottom:.4rem;display:flex;align-items:center;gap:.3rem;position:relative;font-weight:700;text-shadow:0 0 10px rgba(200,164,90,.1)}
.dash-event{
  font-size:.82rem;color:var(--txt);padding:.3rem 0;border-bottom:1px solid rgba(200,164,90,.03);
  display:flex;gap:.4rem;align-items:flex-start;line-height:1.8;font-family:'Noto Sans SC','PingFang SC',var(--fc),sans-serif;font-weight:400;
  animation:cardReveal .4s ease-out both;position:relative;
}
.dash-event:nth-child(1){animation-delay:.1s}
.dash-event:nth-child(2){animation-delay:.2s}
.dash-event:nth-child(3){animation-delay:.3s}
.dash-event:nth-child(4){animation-delay:.4s}
.dash-event:nth-child(5){animation-delay:.5s}
.dash-event:nth-child(6){animation-delay:.6s}
.dash-event:nth-child(7){animation-delay:.7s}
.dash-event:nth-child(8){animation-delay:.8s}
.dash-event:last-child{border-bottom:none}
.dash-event-dot{
  width:5px;height:5px;border-radius:50%;background:var(--red);
  flex-shrink:0;margin-top:.45rem;
  box-shadow:0 0 5px var(--red),0 0 10px rgba(196,60,60,.2);
  animation:pulse 2s infinite;
}

/* ══════ DATA SOURCES SECTION ══════ */
.dash-sources{
  background:var(--glass);border:1px solid var(--border);border-radius:4px;
  padding:.7rem .8rem;margin-bottom:.7rem;border-left:3px solid rgba(0,200,180,.15);
}
.dash-sources-title{
  font-family:var(--fd);font-size:.72rem;color:var(--teal,#4ecdc4);
  letter-spacing:2px;margin-bottom:.5rem;display:flex;align-items:center;gap:.3rem;
  text-transform:uppercase;
}
.dash-methodology{
  display:flex;gap:.4rem;align-items:flex-start;
  font-size:.78rem;color:var(--txt2);line-height:1.7;
  background:rgba(0,0,0,.2);border-radius:4px;padding:.5rem .6rem;margin-bottom:.5rem;
  border-left:2px solid rgba(78,205,196,.3);font-family:var(--fb);
}
.dash-meth-icon{flex-shrink:0;margin-top:1px}
.dash-src-list{
  display:flex;flex-direction:column;gap:.4rem;
}
.dash-src-item{
  padding:.4rem .5rem;border-radius:4px;
  background:rgba(0,0,0,.15);border:1px solid rgba(200,164,90,.06);
  transition:all .2s;
}
.dash-src-item:hover{background:rgba(200,164,90,.06);border-color:rgba(200,164,90,.12)}
.dash-src-head{display:flex;align-items:center;gap:.4rem;margin-bottom:.15rem}
.dash-src-badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:50%;
  background:rgba(78,205,196,.15);color:var(--teal,#4ecdc4);
  font-size:.6rem;font-weight:700;flex-shrink:0;
  border:1px solid rgba(78,205,196,.3);
}
.dash-src-name{
  font-size:.78rem;font-weight:600;color:var(--teal,#4ecdc4);
  font-family:var(--fd);letter-spacing:.5px;
}
.dash-src-headline{
  font-size:.72rem;color:var(--txt2);font-style:italic;
  padding-left:20px;line-height:1.5;font-family:var(--fb);
  opacity:.8;
}
.dash-src-usage{
  font-size:.7rem;color:var(--gold);padding-left:20px;
  line-height:1.5;font-family:var(--fb);margin-top:.1rem;
}
.dash-src-fallback{
  font-size:.76rem;color:var(--txt2);font-style:italic;
  padding:.3rem 0;line-height:1.6;
}
.dash-gen-time{
  font-size:.68rem;color:var(--txt2);opacity:.65;
  text-align:right;margin-top:.5rem;font-family:var(--fd);
  letter-spacing:.5px;
}

/* ══════ STAT HERO ROW ══════ */
.stat-hero-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-bottom:.8rem}
.stat-hero{
  text-align:center;padding:.65rem .4rem;
  background:linear-gradient(135deg,rgba(16,22,32,.92),rgba(22,32,45,.88));
  border:1px solid var(--border2);
  border-radius:4px;position:relative;overflow:hidden;transition:all .4s;
  animation:cardReveal .6s ease-out both, heroGlow 6s ease-in-out infinite;
  backdrop-filter:blur(4px);
}
.stat-hero:nth-child(1){animation-delay:.05s,.05s}
.stat-hero:nth-child(2){animation-delay:.12s,.12s}
.stat-hero:nth-child(3){animation-delay:.19s,.19s}
.stat-hero:nth-child(4){animation-delay:.26s,.26s}
.stat-hero:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px rgba(0,0,0,.4),0 0 15px rgba(200,164,90,.06)}
/* Top color bar */
.stat-hero::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;border-radius:2px 2px 0 0}
.stat-hero.danger::before{background:linear-gradient(90deg,var(--red),rgba(196,60,60,.3));box-shadow:0 0 12px rgba(196,60,60,.3)}
.stat-hero.warn::before{background:linear-gradient(90deg,var(--orange),rgba(200,120,50,.3));box-shadow:0 0 12px rgba(200,120,50,.2)}
.stat-hero.info::before{background:linear-gradient(90deg,var(--gold),rgba(200,164,90,.3));box-shadow:0 0 12px rgba(200,164,90,.2)}
/* Shimmer scan line */
.stat-hero::after{
  content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(200,164,90,.04),transparent);
  animation:shimmer 4s ease-in-out infinite;
  pointer-events:none;
}
.stat-hero-icon{font-size:1.5rem;margin-bottom:.2rem;filter:drop-shadow(0 0 3px rgba(200,164,90,.15))}
.stat-hero-num{
  font-family:var(--fd);font-size:1.35rem;font-weight:800;color:var(--txt);letter-spacing:2px;
  text-shadow:0 0 8px rgba(255,255,255,.05);
}
.stat-hero.danger .stat-hero-num{color:var(--red);text-shadow:0 0 12px rgba(196,60,60,.3)}
.stat-hero.warn .stat-hero-num{color:var(--orange);text-shadow:0 0 12px rgba(200,120,50,.25)}
.stat-hero-num.glitch{animation:numberGlitch .15s linear}
.stat-hero-label{font-size:.68rem;color:var(--txt3);font-family:var(--fb);margin-top:.1rem;letter-spacing:.5px}

/* ══════ THREAT STATUS BAR ══════ */
.threat-status-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-bottom:.8rem}
.tsb-item{
  padding:.45rem .6rem;background:linear-gradient(135deg,rgba(16,22,32,.85),rgba(22,32,45,.8));
  border:1px solid var(--border2);border-radius:4px;text-align:center;
  position:relative;overflow:hidden;transition:all .3s;
}
.tsb-item:hover{border-color:rgba(200,164,90,.18);box-shadow:0 2px 12px rgba(0,0,0,.25)}
/* Subtle data scan line */
.tsb-item::after{
  content:'';position:absolute;top:0;left:-100%;width:80%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(200,164,90,.025),transparent);
  animation:shimmer 6s ease-in-out infinite;
  pointer-events:none;
}
.tsb-label{display:block;font-size:.58rem;color:var(--txt3);font-family:var(--fd);letter-spacing:1.5px;margin-bottom:.15rem}
.tsb-val{display:block;font-family:var(--fd);font-size:.72rem;font-weight:700;color:var(--gold);letter-spacing:1px;word-break:break-all;line-height:1.3}
.tsb-danger .tsb-val{color:var(--red);text-shadow:0 0 10px rgba(196,60,60,.3);animation:threatPulse 3s infinite}
.tsb-warn .tsb-val{color:var(--orange)}
.tsb-red{color:var(--red)!important;text-shadow:0 0 8px rgba(196,60,60,.2)}

/* ══════ ESCALATION GAUGE ══════ */
.esc-gauge{
  background:linear-gradient(135deg,rgba(16,22,32,.9),rgba(196,60,60,.03),rgba(16,22,32,.9));
  border:1px solid rgba(196,60,60,.12);border-radius:4px;
  padding:.8rem;margin-bottom:.8rem;border-left:3px solid rgba(196,60,60,.4);
  position:relative;overflow:hidden;
  animation:riskGlow 4s ease-in-out infinite;
}
/* Threat wave that sweeps across the gauge */
.esc-gauge::before{
  content:'';position:absolute;top:0;left:0;right:0;bottom:0;
  background:linear-gradient(90deg,transparent,rgba(196,60,60,.06),transparent);
  animation:threatWave 5s ease-in-out infinite;
  transform-origin:left;pointer-events:none;
}
.esc-gauge-title{font-family:var(--fd);font-size:.78rem;color:var(--red);letter-spacing:3px;margin-bottom:.5rem;font-weight:700;position:relative;text-shadow:0 0 8px rgba(196,60,60,.2)}
.esc-gauge-track{
  height:26px;background:var(--bg4);
  border-radius:3px;overflow:hidden;position:relative;border:1px solid rgba(196,60,60,.15);
  box-shadow:inset 0 0 15px rgba(0,0,0,.3);
}
.esc-gauge-fill{
  height:100%;border-radius:3px;
  background:linear-gradient(90deg,var(--green),var(--amber) 40%,var(--orange) 65%,var(--red) 85%);
  transition:width 1.5s cubic-bezier(.4,0,.2,1);position:relative;
  box-shadow:0 0 12px rgba(196,60,60,.2);
}
.esc-gauge-fill::after{
  content:'';position:absolute;right:0;top:0;bottom:0;width:20px;
  background:radial-gradient(circle,rgba(255,255,255,.3),transparent);animation:pulse 1.5s infinite;
  filter:blur(2px);
}
.esc-gauge-val{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--fd);font-size:.8rem;font-weight:800;color:#fff;
  text-shadow:0 1px 4px rgba(0,0,0,.6),0 0 10px rgba(196,60,60,.3);letter-spacing:2px;
}
.esc-gauge-labels{display:flex;justify-content:space-between;margin-top:.25rem;font-size:.58rem;color:var(--txt3);font-family:var(--fm);position:relative}

/* ══════ RATIO GRID ══════ */
.ratio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:.8rem}
.ratio-item{
  padding:.45rem .55rem;background:linear-gradient(145deg,rgba(16,22,32,.88),rgba(22,32,45,.82));
  border:1px solid var(--border2);border-radius:4px;transition:all .4s;
  animation:cardReveal .4s ease-out both;
}
.ratio-item:nth-child(1){animation-delay:.1s}
.ratio-item:nth-child(2){animation-delay:.15s}
.ratio-item:nth-child(3){animation-delay:.2s}
.ratio-item:nth-child(4){animation-delay:.25s}
.ratio-item:nth-child(5){animation-delay:.3s}
.ratio-item:nth-child(6){animation-delay:.35s}
.ratio-item:hover{border-color:rgba(200,164,90,.18);transform:translateY(-2px);box-shadow:0 4px 15px rgba(0,0,0,.3)}
.ratio-item.adv-blue{border-left:3px solid var(--force-blue)}
.ratio-item.adv-red{border-left:3px solid var(--force-red)}
.ratio-item.contested{border-left:3px solid var(--gold)}
.ratio-label{font-size:.72rem;color:var(--txt2);margin-bottom:.2rem;font-family:var(--fb)}
.ratio-bar{display:flex;height:6px;background:var(--bg4);border-radius:3px;overflow:hidden;margin-bottom:.15rem}
.ratio-fill-r{background:var(--force-red);height:100%;transition:width .6s ease}
.ratio-fill-b{background:var(--force-blue);height:100%;transition:width .6s ease}
.ratio-pct{font-size:.58rem;color:var(--txt3);font-family:var(--fm);font-weight:600}

/* ══════ DIVERGENCE BANNER ══════ */
.divergence-banner{margin-bottom:1.2rem}
.div-banner-title{
  font-family:var(--fd);font-size:.82rem;color:var(--red);letter-spacing:4px;
  margin-bottom:.6rem;display:flex;align-items:center;gap:.5rem;
  font-weight:700;padding-bottom:.4rem;border-bottom:1px solid rgba(196,60,60,.08);
}
.div-banner-title .pulse-dot{width:6px;height:6px;background:var(--red);border-radius:50%;animation:pulse 1.5s infinite;box-shadow:0 0 4px var(--red)}
.div-item{
  margin-bottom:.6rem;padding:.65rem;
  background:var(--glass);
  border:1px solid rgba(196,60,60,.06);border-left:3px solid rgba(196,60,60,.3);
  border-radius:4px;transition:all .3s;
}
.div-item:hover{background:rgba(196,60,60,.02);border-left-color:var(--red)}
.div-topic{font-family:var(--f-impact);font-size:.95rem;color:var(--gold);letter-spacing:2.5px;margin-bottom:.5rem;font-weight:600}
.div-models{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.4rem}
.div-model-cell{padding:.45rem .55rem;background:rgba(0,0,0,.2);border-radius:4px;border-top:2px solid var(--mc)}
.div-model-name{font-family:var(--fd);font-size:.55rem;color:var(--mc);letter-spacing:1px;margin-bottom:.2rem}
.div-model-val{font-size:.9rem;color:var(--txt);line-height:1.8;font-family:var(--f-headline),var(--fb)}

/* Deep Divergence Analysis */
.div-deep-wrap{margin-top:.6rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.06)}
.div-deep-btn{
  width:100%;padding:.85rem 1.2rem;border:2px solid rgba(255,71,87,.45);border-radius:8px;
  background:linear-gradient(135deg,rgba(255,71,87,.14),rgba(200,164,90,.06));
  color:#ff4757;font-family:var(--fd);font-size:.88rem;letter-spacing:3px;
  cursor:pointer;transition:all .3s;text-transform:uppercase;
  box-shadow:0 0 12px rgba(255,71,87,.12),inset 0 1px 0 rgba(255,255,255,.04);
  position:relative;overflow:hidden;
}
.div-deep-btn::before{
  content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,71,87,.1),transparent);
  animation:shimmer 3s ease-in-out infinite;
}
.div-deep-btn:hover{background:linear-gradient(135deg,rgba(255,71,87,.22),rgba(200,164,90,.1));border-color:#ff4757;transform:translateY(-2px);box-shadow:0 4px 20px rgba(255,71,87,.2)}
.div-deep-btn:disabled{opacity:.5;cursor:wait}
.div-btn-loading{animation:pulse-glow 1.5s ease-in-out infinite}
@keyframes pulse-glow{0%,100%{box-shadow:0 0 5px rgba(255,71,87,.2)}50%{box-shadow:0 0 20px rgba(255,71,87,.4)}}

.div-deep-loading{text-align:center;padding:1.5rem;color:var(--txt2);font-size:.82rem}
.div-deep-loading .radar-spinner{margin:0 auto .8rem}
.div-deep-err{padding:.8rem;color:#ff4757;font-size:.82rem;text-align:center}

.div-deep-card{
  background:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.06);border-radius:8px;
  padding:.8rem;margin-top:.5rem;
}
.div-deep-header{display:flex;align-items:center;gap:1rem;margin-bottom:.8rem;padding-bottom:.6rem;border-bottom:1px solid rgba(255,255,255,.06)}
.div-score-circle{
  width:64px;height:64px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:3px solid currentColor;flex-shrink:0;
}
.div-score-high{color:#ff4757;background:rgba(255,71,87,.08)}
.div-score-med{color:#ffa502;background:rgba(255,165,2,.08)}
.div-score-low{color:#2ed573;background:rgba(46,213,115,.08)}
.div-score-num{font-family:var(--fd);font-size:1.4rem;font-weight:700;line-height:1}
.div-score-label{font-family:var(--fm);font-size:.5rem;opacity:.6}
.div-score-title{font-family:var(--fd);font-size:.72rem;letter-spacing:2px;color:var(--txt2);margin-bottom:.3rem}
.div-score-summary{font-size:.82rem;color:var(--txt);line-height:1.6;font-family:var(--f-headline),var(--fb)}

.div-deep-section{margin-bottom:.8rem}
.div-ds-title{font-family:var(--fd);font-size:.68rem;letter-spacing:2px;color:var(--gold);margin-bottom:.5rem;padding-bottom:.25rem;border-bottom:1px solid rgba(200,164,90,.12)}

.div-kd-item{margin-bottom:.6rem;padding:.5rem;background:rgba(255,255,255,.02);border-radius:6px;border:1px solid rgba(255,255,255,.04)}
.div-kd-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem}
.div-kd-dim{font-size:.82rem;color:var(--txt);font-weight:600}
.div-kd-score{font-family:var(--fd);font-size:.72rem;padding:.15rem .4rem;border-radius:4px;border:1px solid currentColor}
.div-kd-stances{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.3rem}
.div-kd-stance{font-size:.78rem;color:var(--txt2);line-height:1.5;padding:.25rem .5rem;border-left:3px solid var(--border);background:rgba(0,0,0,.15);border-radius:0 4px 4px 0}
.div-kd-analysis{font-size:.75rem;color:var(--txt3);line-height:1.6;padding:.3rem .5rem;font-style:italic}

.div-credible{font-size:.85rem;color:var(--txt);line-height:1.6;padding:.4rem .6rem;background:rgba(46,213,115,.05);border:1px solid rgba(46,213,115,.15);border-radius:6px}
.div-advice{font-size:.85rem;color:var(--txt);line-height:1.7;padding:.4rem .6rem;background:rgba(255,165,2,.05);border:1px solid rgba(255,165,2,.15);border-radius:6px}
.div-deep-ts{font-family:var(--fm);font-size:.55rem;color:var(--txt3);text-align:right;margin-top:.5rem}

/* QueWi share buttons in panels */
.div-deep-share,.tl-quewi-share,.ca-share-wrap{
  text-align:right;margin-top:.5rem;padding-top:.4rem;border-top:1px solid rgba(200,164,90,.06);
}
.div-deep-share .hz-quewi-fwd,
.tl-quewi-share .hz-quewi-fwd,
.ca-share-btn{
  font-size:.72rem!important;padding:6px 20px!important;border-radius:999px!important;
}
.ca-share-btn{
  background:linear-gradient(135deg,rgba(0,210,190,.15),rgba(144,112,226,.18))!important;
  border:1px solid rgba(0,210,190,.3)!important;
  color:#0ff!important;letter-spacing:1px;cursor:pointer;border-radius:999px;
  transition:all .35s ease;font-family:var(--fd);
  text-shadow:0 0 6px rgba(0,255,220,.25);
  box-shadow:0 2px 12px rgba(0,210,190,.12);
  animation:quewiFwdPulse 2.8s ease-in-out infinite;
}
.ca-share-btn:hover{
  background:linear-gradient(135deg,rgba(0,210,190,.28),rgba(144,112,226,.32))!important;
  border-color:rgba(0,255,220,.5)!important;color:#fff!important;
  text-shadow:0 0 10px rgba(0,255,220,.45);
  box-shadow:0 4px 20px rgba(0,210,190,.25);
}

/* ══════ VISUAL TIMELINE — REDESIGNED CARD LAYOUT ══════ */
.timeline-section{margin-bottom:1.5rem}
.timeline-title{
  font-family:var(--f-impact);font-size:1rem;color:var(--gold);letter-spacing:4px;
  margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;font-weight:700;
  padding-bottom:.5rem;border-bottom:1px solid rgba(200,164,90,.12);
}
/* vertical list of time horizons */
.tl-horizons{display:flex;flex-direction:column;gap:1.2rem}
.tl-horizon{
  background:rgba(0,0,0,.15);border-radius:8px;overflow:hidden;
  border:1px solid rgba(200,164,90,.06);
}
.tl-horizon-head{
  display:flex;align-items:center;gap:.6rem;
  padding:.65rem 1rem;
  background:linear-gradient(135deg,rgba(200,164,90,.06),transparent);
  border-bottom:1px solid rgba(200,164,90,.08);
}
.tl-horizon-head.critical{
  background:linear-gradient(135deg,rgba(196,60,60,.12),rgba(196,60,60,.02));
  border-bottom-color:rgba(196,60,60,.15);
}
.tl-horizon-head.warn{
  background:linear-gradient(135deg,rgba(200,120,50,.1),rgba(200,120,50,.02));
  border-bottom-color:rgba(200,120,50,.12);
}
.tl-horizon-icon{font-size:1.3rem}
.tl-horizon-label{
  font-family:var(--f-impact);font-size:1.1rem;color:var(--gold);
  letter-spacing:3px;font-weight:700;
}
.tl-horizon-head.critical .tl-horizon-label{color:#c43c3c}
.tl-horizon-head.warn .tl-horizon-label{color:#d08030}
/* model cards inside each horizon */
.tl-horizon-models{display:flex;flex-direction:column;gap:.6rem;padding:.8rem}
.tl-model-card{
  background:rgba(255,255,255,.015);border-radius:6px;
  border-left:3px solid var(--mc);padding:.7rem .9rem;
  transition:background .2s;
}
.tl-model-card:hover{background:rgba(255,255,255,.035)}
.tl-model-name{
  font-family:var(--f-impact);font-size:.82rem;color:var(--mc);
  letter-spacing:2px;font-weight:600;display:flex;align-items:center;gap:.4rem;
  margin-bottom:.5rem;
}
.tl-model-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
/* structured content blocks inside a model */
.tl-model-content{display:flex;flex-direction:column;gap:.4rem}
.tl-block{
  padding:.55rem .7rem;border-radius:5px;
  background:rgba(0,0,0,.12);position:relative;
}
.tl-block-label{
  font-family:var(--f-impact);font-size:.78rem;color:var(--gold);
  letter-spacing:1.5px;font-weight:600;margin-bottom:.3rem;
  display:flex;align-items:center;gap:.3rem;
}
.tl-block-icon{font-size:.85rem}
.tl-block-body{
  font-family:var(--f-headline),var(--fb);font-size:.92rem;
  color:var(--txt);line-height:1.85;letter-spacing:.2px;
}
/* color coding per block type */
.tl-baseline{border-left:2px solid rgba(200,164,90,.3)}
.tl-esc{border-left:2px solid rgba(196,60,60,.5);background:rgba(196,60,60,.04)}
.tl-esc .tl-block-label{color:#c43c3c}
.tl-deesc{border-left:2px solid rgba(60,160,100,.5);background:rgba(60,160,100,.04)}
.tl-deesc .tl-block-label{color:#3ca064}
.tl-trigger{border-left:2px solid rgba(200,164,90,.4)}
.tl-trigger .tl-block-label{color:#d4a84a}
.tl-decision{border-left:2px solid rgba(80,140,220,.5);background:rgba(80,140,220,.03)}
.tl-decision .tl-block-label{color:#508cdc}
.tl-iw{border-left:2px solid rgba(150,120,200,.4);background:rgba(150,120,200,.03)}
.tl-iw .tl-block-label{color:#9678c8}
.tl-conf{border-left:2px solid rgba(200,164,90,.25)}
.tl-conf .tl-block-body{font-size:.82rem;color:var(--txt2);font-style:italic}
.tl-extra{border-left:2px solid rgba(200,164,90,.15)}
.tl-empty{color:var(--txt3);font-size:.8rem}
/* keep old classes for backward compat but hide */
.timeline-track{display:none}
.timeline-node{display:none}

/* ══════ COMPARE TABLES ══════ */
.compare-tables{margin-bottom:1.2rem}
.ct-section{margin-bottom:.8rem}
.ct-title{
  font-family:var(--fd);font-size:.78rem;color:var(--gold);letter-spacing:3px;
  margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem;
  padding-bottom:.35rem;border-bottom:1px solid rgba(200,164,90,.08);font-weight:600;
}
.ct-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--glass);border-radius:4px;overflow:hidden;border:1px solid var(--border)}
.ct-table thead{background:linear-gradient(135deg,rgba(200,164,90,.03),transparent)}
.ct-table th{font-family:var(--fd);font-size:.62rem;color:var(--gold);letter-spacing:1.5px;padding:.5rem .55rem;text-align:left;border-bottom:1px solid var(--border);font-weight:500}
.ct-table th.col-claude{color:var(--claude)}.ct-table th.col-gpt{color:var(--gpt)}.ct-table th.col-gemini{color:var(--gemini)}
.ct-table td{padding:.5rem .55rem;font-size:.82rem;border-bottom:1px solid rgba(200,164,90,.02);vertical-align:top;line-height:1.7;font-family:var(--fb)}
.ct-table tr:last-child td{border-bottom:none}
.ct-table tr:hover td{background:rgba(200,164,90,.015)}
.ct-table td:first-child{font-family:var(--fh);font-size:.75rem;color:var(--gold);letter-spacing:1px;white-space:nowrap;width:80px;font-weight:400}
.ct-table .diff-cell{background:rgba(200,164,90,.03);border-left:2px solid var(--gold);padding-left:.4rem;font-weight:500}

/* ══════ CONSENSUS ══════ */
.consensus-block{
  margin-bottom:1.2rem;background:var(--glass);
  border:1px solid rgba(106,154,74,.1);border-radius:4px;
  padding:.8rem;border-left:3px solid var(--green);
}
.cons-title{font-family:var(--fd);font-size:.75rem;color:var(--green);letter-spacing:3px;margin-bottom:.4rem;display:flex;align-items:center;gap:.3rem;font-weight:600}
.cons-item{font-size:.82rem;padding:.3rem 0;border-bottom:1px solid rgba(200,164,90,.02);line-height:1.7;color:var(--txt);font-family:var(--fb)}
.cons-item:last-child{border-bottom:none}

/* ══════ WORST CASE CARDS ══════ */
.worst-case-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.wc-card{
  padding:.7rem;background:var(--glass);
  border:1px solid var(--border);border-radius:4px;
  border-top:2px solid var(--mc);transition:all .3s;
}
.wc-card:hover{border-color:var(--mc);transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.3)}
.wc-model{font-family:var(--f-impact);font-size:.72rem;color:var(--mc);letter-spacing:2px;margin-bottom:.4rem;display:flex;align-items:center;gap:.35rem;font-weight:600}
.wc-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.wc-desc{font-size:.92rem;color:var(--txt);line-height:1.85;margin-bottom:.35rem;font-family:var(--f-headline),var(--fb)}
.wc-prob{font-size:.78rem;color:var(--gold);font-family:var(--f-impact);letter-spacing:1px}

/* ══════ LEADER MOVES V2 — leader-centric with avatars ══════ */
.leader-moves-grid{display:flex;flex-direction:column;gap:.8rem}
.leader-model-block{padding:.7rem;background:rgba(0,0,0,.12);border-radius:4px;margin-bottom:.3rem}
.leader-model-name{font-family:var(--fd);font-size:.58rem;letter-spacing:2px;margin-bottom:.5rem;font-weight:600}

.leader-grid-v2{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:.8rem}

.ldr2-card{
  background:var(--glass);border:1px solid var(--border);border-radius:8px;
  padding:.8rem;transition:all .3s;overflow:hidden;
}
.ldr2-card:hover{border-color:var(--border2);background:rgba(200,164,90,.02);transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.3)}

/* Section dividers inside leader card */
.ldr2-section{margin-top:.5rem;padding-top:.45rem;border-top:1px solid var(--border)}
.ldr2-section:first-of-type{margin-top:.35rem}
.ldr2-sec-label{font-family:var(--fd);font-size:.6rem;letter-spacing:2px;color:var(--txt3);margin-bottom:.3rem;text-transform:uppercase}

.ldr2-header{display:flex;align-items:center;gap:.7rem;margin-bottom:.2rem}
.ldr2-avatar{
  width:48px;height:48px;border-radius:50%;overflow:hidden;flex-shrink:0;
  background:rgba(255,255,255,.04);border:2px solid var(--border2);
  display:flex;align-items:center;justify-content:center;
}
.ldr2-avatar img{width:100%;height:100%;object-fit:cover}
.ldr2-avatar-flag{font-size:1.4rem}
.ldr2-info{flex:1;min-width:0}
.ldr2-name{font-family:var(--fh);font-size:1rem;color:var(--gold);font-weight:600;line-height:1.3}
.ldr2-country{
  display:inline-block;font-size:.6rem;color:var(--txt3);font-family:var(--fb);
  padding:.1rem .4rem;background:rgba(255,255,255,.03);border-radius:2px;
  border:1px solid rgba(255,255,255,.06);margin-top:.15rem;
}

.ldr2-stance{font-size:.85rem;color:var(--txt2);line-height:1.7;font-family:var(--fh);padding:0}

/* Direct quotes */
.ldr2-quotes{
  background:rgba(200,164,90,.04);border-left:3px solid rgba(200,164,90,.25);
  padding:.4rem .6rem;margin-bottom:.45rem;border-radius:0 4px 4px 0;
}
.ldr2-quote{
  font-size:.88rem;color:var(--txt);line-height:1.7;font-family:var(--fh);
  font-style:italic;margin-bottom:.3rem;
}
.ldr2-quote:last-of-type{margin-bottom:0}
.ldr2-q-mark{color:var(--gold);font-size:1.1rem;font-weight:700;font-style:normal;opacity:.6}
.ldr2-quote-src{font-size:.62rem;color:var(--txt3);text-align:right;margin-top:.2rem;font-family:var(--fd);letter-spacing:.5px}

/* Multi-model predictions */
.ldr2-predictions{display:flex;flex-direction:column;gap:.3rem}
.ldr2-pred{
  padding:.35rem .5rem;border-left:3px solid var(--border);
  background:rgba(0,0,0,.12);border-radius:0 4px 4px 0;
}
.ldr2-pred-head{display:flex;align-items:center;gap:.4rem;margin-bottom:.2rem;flex-wrap:wrap}
.ldr2-pred-model{font-family:var(--fd);font-size:.62rem;letter-spacing:1.5px;font-weight:600}
.ldr2-timeline{font-size:.58rem;color:var(--orange);font-family:var(--fm);margin-left:auto}
.ldr2-pred-move{font-size:.9rem;color:var(--gold);line-height:1.7;font-weight:500;font-family:var(--fh)}
.ldr2-pred-rationale{font-size:.78rem;color:var(--txt3);line-height:1.65;font-family:var(--fh);margin-top:.15rem}

/* Leader section: refresh button */
.ldr-refresh-btn{
  float:right;font-size:.7rem;padding:.25rem .6rem;border-radius:4px;cursor:pointer;
  background:rgba(139,92,246,.12);color:var(--purple,#a78bfa);border:1px solid rgba(139,92,246,.25);
  font-family:var(--fb);transition:all .2s;margin-left:auto;
}
.ldr-refresh-btn:hover{background:rgba(139,92,246,.25);transform:scale(1.02)}
.ldr-refresh-btn.spinning{pointer-events:none;opacity:.7}
@keyframes spin360{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.ldr-refresh-btn.spinning::before{content:'';display:inline-block;animation:spin360 1s linear infinite}

/* Leader real-time badge */
.ldr-realtime-badge{
  display:inline-block;font-size:.6rem;padding:.15rem .45rem;border-radius:3px;margin-left:.4rem;
  background:rgba(16,185,129,.12);color:#10b981;border:1px solid rgba(16,185,129,.3);
  font-family:var(--fd);letter-spacing:.5px;animation:pulseBadge 2s ease-in-out infinite;
}
@keyframes pulseBadge{0%,100%{opacity:1}50%{opacity:.6}}

/* Leader loading overlay */
.ldr-loading-overlay{
  text-align:center;padding:1.5rem;color:var(--txt2);font-size:.8rem;font-family:var(--fb);
  background:rgba(0,0,0,.3);border-radius:6px;margin-bottom:.5rem;
}
.ldr-loading-overlay .radar-spinner{margin:0 auto .6rem}

/* Leader key signals */
.ldr2-signals{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;margin:.3rem 0;padding:.25rem 0}
.ldr2-signals-label{font-size:.65rem;color:var(--txt3);font-family:var(--fd);letter-spacing:.5px}
.ldr2-signal-tag{
  font-size:.62rem;padding:.12rem .35rem;border-radius:3px;font-family:var(--fb);
  background:rgba(14,165,233,.08);color:var(--cyan,#0ea5e9);border:1px solid rgba(14,165,233,.2);
}

/* Confidence badges (shared) */
.leader-conf{font-size:.58rem;font-family:var(--fd);letter-spacing:1px;padding:.15rem .45rem;border-radius:3px}
.conf-high{color:var(--green);background:rgba(106,154,74,.06);border:1px solid rgba(106,154,74,.15)}
.conf-med{color:var(--gold);background:rgba(200,164,90,.06);border:1px solid rgba(200,164,90,.15)}
.conf-low{color:var(--red);background:rgba(196,60,60,.06);border:1px solid rgba(196,60,60,.15)}

/* Dashboard provenance compact footer */
.dash-provenance{
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.4rem .6rem;margin-top:.3rem;
  font-size:.62rem;color:var(--txt3);opacity:.7;
  border-top:1px solid rgba(200,164,90,.06);font-family:var(--fd);letter-spacing:.3px;
}
.dash-prov-sources{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-prov-time{flex-shrink:0}

/* ══════ FACT-CHECK PANEL ══════ */
.factcheck-panel{
  margin-bottom:1.2rem;
  background:var(--glass);
  border:1px solid rgba(200,155,106,.1);
  border-radius:4px;overflow:hidden;
}
.fc-header{
  display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  padding:.7rem .9rem;
  background:linear-gradient(135deg,rgba(200,155,106,.04),transparent);
  border-bottom:1px solid rgba(200,155,106,.08);
}
.fc-title{font-family:var(--fd);font-size:.82rem;color:var(--claude);letter-spacing:2px;font-weight:700;display:flex;align-items:center;gap:.4rem}
.fc-icon{font-size:1rem}
.fc-subtitle{font-size:.65rem;color:var(--txt3);font-family:var(--fm);letter-spacing:1px;flex:1}
.fc-run-btn{
  padding:.28rem .65rem;background:rgba(200,155,106,.06);
  border:1px solid rgba(200,155,106,.2);border-radius:2px;
  color:var(--claude);font-family:var(--fd);font-size:.58rem;
  letter-spacing:1.5px;cursor:pointer;transition:all .3s;
}
.fc-run-btn:hover{background:rgba(200,155,106,.12);box-shadow:0 0 10px rgba(200,155,106,.1)}
.fc-run-btn.fc-loading{opacity:.5;pointer-events:none}
.fc-body{padding:.8rem .9rem}
.fc-placeholder{text-align:center;padding:1.5rem;color:var(--txt3)}
.fc-ph-icon{font-size:1.6rem;margin-bottom:.5rem;opacity:.4}
.fc-placeholder p{font-size:.78rem;margin:.15rem 0}
.fc-ph-sub{font-size:.65rem;color:var(--txt3);opacity:.6}
.fc-summary-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:.7rem}
.fc-model-score{
  padding:.55rem;border-radius:4px;text-align:center;
  background:rgba(0,0,0,.2);border:1px solid var(--border);
  border-top:2px solid var(--mc);transition:all .3s;
}
.fc-model-score:hover{border-color:var(--mc);transform:translateY(-1px)}
.fc-ms-name{font-family:var(--fd);font-size:.55rem;letter-spacing:1.5px;color:var(--mc);margin-bottom:.2rem}
.fc-ms-score{font-family:var(--fd);font-size:1.5rem;font-weight:800;color:var(--mc);line-height:1}
.fc-ms-rate{font-family:var(--fm);font-size:.62rem;margin-top:.15rem}
.fc-ms-rank{font-size:.58rem;color:var(--gold);font-family:var(--fd);letter-spacing:1px;margin-top:.1rem}
.fc-ms-bar{height:3px;background:rgba(255,255,255,.04);border-radius:2px;margin-top:.3rem;overflow:hidden}
.fc-ms-bar-fill{height:100%;border-radius:2px;transition:width 1s ease}
.fc-breakdown{margin-bottom:.7rem}
.fc-breakdown-title{font-family:var(--fd);font-size:.68rem;color:var(--txt2);letter-spacing:2px;margin-bottom:.4rem}
.fc-breakdown-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem}
.fc-bd-cell{padding:.35rem;background:rgba(0,0,0,.12);border-radius:3px;font-size:.65rem}
.fc-bd-label{color:var(--txt3);font-size:.52rem;font-family:var(--fm);display:block;margin-bottom:.1rem}
.fc-bd-val{font-family:var(--fm);font-weight:600}
.fc-predictions{margin-bottom:.6rem}
.fc-pred-title{font-family:var(--fd);font-size:.65rem;letter-spacing:1px;margin-bottom:.3rem;display:flex;align-items:center;gap:.3rem}
.fc-pred-title.correct{color:var(--green)}.fc-pred-title.wrong{color:var(--red)}.fc-pred-title.partial{color:var(--gold)}
.fc-pred-item{padding:.3rem .55rem;background:rgba(0,0,0,.1);border-radius:3px;margin-bottom:.2rem;font-size:.7rem;line-height:1.5;border-left:2px solid transparent}
.fc-pred-item.correct{border-left-color:var(--green)}.fc-pred-item.wrong{border-left-color:var(--red)}.fc-pred-item.partial{border-left-color:var(--gold)}
.fc-pred-label{font-size:.58rem;color:var(--txt3);font-family:var(--fm)}
.fc-meta{padding:.55rem;background:rgba(200,155,106,.03);border:1px solid rgba(200,155,106,.08);border-radius:4px;margin-top:.5rem}
.fc-meta-title{font-family:var(--fd);font-size:.65rem;color:var(--claude);letter-spacing:1px;margin-bottom:.3rem}
.fc-meta-text{font-size:.75rem;color:var(--txt);line-height:1.7}

/* ══════ MODEL DETAIL BAR ══════ */
.model-detail-bar{
  display:flex;align-items:center;gap:.5rem;margin-bottom:1.2rem;
  padding:.6rem .8rem;background:var(--glass);
  border:1px solid var(--border);border-radius:4px;flex-wrap:wrap;
}
.mdb-label{font-size:.75rem;color:var(--txt3);margin-right:.3rem;font-family:var(--fh)}
.mdb-btn{
  display:flex;align-items:center;gap:.3rem;
  padding:.42rem .75rem;background:rgba(255,255,255,.015);
  border:1px solid var(--border);color:var(--txt2);
  cursor:pointer;border-radius:2px;font-size:.78rem;font-family:var(--fb);transition:all .3s;
}
.mdb-btn:hover{transform:translateY(-1px);box-shadow:0 3px 12px rgba(0,0,0,.2)}
.mdb-claude:hover{border-color:var(--claude);color:var(--claude)}.mdb-gpt:hover{border-color:var(--gpt);color:var(--gpt)}.mdb-gemini:hover{border-color:var(--gemini);color:var(--gemini)}
.tdot{width:8px;height:8px;border-radius:50%}.cdot{background:var(--claude);color:var(--claude)}.gdot{background:var(--gpt);color:var(--gpt)}.emdot{background:var(--gemini);color:var(--gemini)}

/* ══════ CHAT SECTION ══════ */
.chat-section-inline{background:var(--glass);border:1px solid var(--border);border-radius:4px;overflow:hidden;margin-bottom:.7rem}
.chat-section-hdr{
  display:flex;align-items:center;justify-content:space-between;
  padding:.6rem .9rem;
  background:linear-gradient(135deg,rgba(144,112,176,.03),rgba(200,164,90,.02));
  border-bottom:1px solid var(--border);
  font-size:.82rem;color:var(--gold);font-family:var(--fd);letter-spacing:1.5px;
}
.chat-hdr-left{display:flex;align-items:center;gap:.5rem}
.chat-quewi-logo{
  width:22px;height:22px;border-radius:50%;
  background:linear-gradient(135deg,var(--quewi),var(--gold));
  display:flex;align-items:center;justify-content:center;
  font-size:.65rem;font-weight:800;color:#fff;
}
.chat-sel{background:var(--bg);border:1px solid var(--border);color:var(--txt);padding:.28rem .5rem;font-size:.72rem;border-radius:2px;font-family:var(--fb)}
.chat-msgs{max-height:220px;overflow-y:auto;padding:.6rem .9rem}
.chat-welcome{text-align:center;color:var(--txt2);font-size:.85rem;padding:.7rem;font-family:var(--fc)}
.chat-suggestions{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.5rem;justify-content:center}
.sgbtn{
  padding:.28rem .7rem;background:rgba(200,164,90,.03);
  border:1px solid var(--border2);color:var(--gold);
  font-size:.7rem;cursor:pointer;border-radius:2px;font-family:var(--fb);transition:all .3s;
}
.sgbtn:hover{background:rgba(200,164,90,.06);transform:translateY(-1px)}
.chat-input-area{padding:.6rem .9rem;border-top:1px solid var(--border)}
.chat-usage{font-size:.62rem;color:var(--txt3);margin-bottom:.25rem}
.chat-row{display:flex;gap:.4rem}
.chat-row textarea{
  flex:1;resize:none;background:var(--bg);border:1px solid var(--border);
  color:var(--txt);padding:.5rem;font-size:.82rem;border-radius:4px;
  font-family:var(--fb);transition:border-color .2s;line-height:1.5;
}
.chat-row textarea:focus{border-color:var(--gold);outline:none;box-shadow:0 0 8px rgba(200,164,90,.06)}
.chat-send-btn{
  padding:.5rem .9rem;background:linear-gradient(135deg,var(--gold),var(--gold2));
  border:none;color:var(--bg);cursor:pointer;border-radius:2px;
  font-weight:700;font-size:.78rem;transition:all .2s;font-family:var(--fb);
}
.chat-send-btn:hover{transform:translateY(-1px);box-shadow:0 2px 10px rgba(200,164,90,.2)}
.chat-msg{margin-bottom:.6rem;padding:.6rem .85rem;border-radius:4px;font-size:.82rem;line-height:1.8;font-family:var(--fb)}
.chat-msg.user{background:rgba(200,164,90,.04);border:1px solid rgba(200,164,90,.08);margin-left:1rem}
.chat-msg.ai{background:rgba(255,255,255,.015);border:1px solid var(--border);margin-right:1rem}
.chat-msg-thinking{font-size:.68rem;color:var(--txt3);font-style:italic;margin-bottom:.3rem;padding:.3rem;background:rgba(0,0,0,.1);border-radius:3px}

/* ══════ NEWS FLOATING POPUP ══════ */
.news-float-popup{
  position:fixed;z-index:50000;top:50%;left:50%;
  transform:translate(-50%,-50%) scale(.97);
  width:min(540px,92vw);max-height:85vh;
  background:var(--bg2);border:1px solid var(--border2);border-radius:4px;
  box-shadow:0 16px 80px rgba(0,0,0,.6),0 0 1px rgba(200,164,90,.15);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;transition:opacity .22s ease,transform .22s ease;pointer-events:none;
  backdrop-filter:blur(20px);
  will-change:opacity,transform;-webkit-backface-visibility:hidden;backface-visibility:hidden;
}
.news-float-popup.nfp-show{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
.news-float-popup.nfp-hide{opacity:0;transform:translate(-50%,-50%) scale(.97);pointer-events:none}
.nfp-header{display:flex;align-items:center;gap:.4rem;padding:.6rem 1rem;background:linear-gradient(90deg,rgba(200,164,90,.04),transparent);border-bottom:1px solid var(--border2)}
.nfp-source{font-size:.65rem;line-height:1}
.nfp-time{font-size:.62rem;color:var(--txt3);font-family:var(--fm);flex:1}
.nfp-close{background:transparent;border:none;color:var(--txt3);font-size:1rem;cursor:pointer;padding:.1rem .3rem;transition:color .2s;margin-left:auto;line-height:1}
.nfp-close:hover{color:var(--red)}
.nfp-scroll{overflow-y:auto;padding:1rem 1.2rem;flex:1;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(200,164,90,.15) transparent}
.nfp-img-wrap{margin-bottom:.6rem;border-radius:4px;overflow:hidden;border:1px solid var(--border);max-height:200px}
.nfp-img{width:100%;max-height:200px;object-fit:cover;display:block}
.nfp-title{font-size:1.15rem;line-height:1.8;color:var(--txt);margin-bottom:.4rem;font-weight:600;font-family:var(--f-headline)}
.nfp-title-en{font-size:.78rem;color:var(--txt3);line-height:1.4;margin-bottom:.6rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}
.nfp-body{font-size:.92rem;color:var(--txt);line-height:2;margin-bottom:.4rem;font-family:var(--fc);white-space:pre-wrap;text-align:justify;letter-spacing:.3px}
.nfp-no-content{color:var(--txt3);font-style:italic;font-size:.78rem}
.nfp-loading{color:var(--txt3);font-style:italic;text-align:center;padding:.5rem;font-size:.75rem}
.nfp-footer{display:flex;align-items:center;justify-content:space-between;padding:.45rem 1rem;border-top:1px solid var(--border);gap:.5rem}
.nfp-social-bar{display:inline-flex;align-items:center;gap:.15rem}
.nfp-social-bar .ns-btn{font-size:.72rem;padding:3px 8px}
.nfp-social-bar .ns-btn .ns-cnt{font-size:.65rem}
.nfp-link{color:var(--gold);text-decoration:none;font-size:.72rem;padding:.28rem .6rem;border:1px solid rgba(200,164,90,.15);border-radius:2px;transition:all .3s}
.nfp-link:hover{background:rgba(200,164,90,.05);border-color:var(--gold)}
/* Prominent QueWi forward in news popup */
.nfp-quewi-fwd{
  font-size:.78rem!important;padding:6px 20px!important;
  font-weight:700!important;letter-spacing:2px!important;
  flex-shrink:0;border-radius:999px!important;
}

/* ── Personal Wargame Button ── */
.chat-gen-wargame-btn{
  width:100%;margin-top:.5rem;padding:.55rem;
  background:linear-gradient(135deg,rgba(200,164,90,.08),rgba(144,112,176,.08));
  border:1px solid var(--border2);color:var(--gold);
  font-size:.78rem;cursor:pointer;border-radius:4px;
  font-family:var(--fb);transition:all .3s;font-weight:600;
  letter-spacing:.5px;
}
.chat-gen-wargame-btn:hover{
  background:linear-gradient(135deg,rgba(200,164,90,.15),rgba(144,112,176,.12));
  border-color:var(--gold);transform:translateY(-1px);
  box-shadow:0 4px 16px rgba(200,164,90,.1);
}
.chat-gen-wargame-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}

/* ── Personal Wargame Modal ── */
.personal-wg-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9999;
  display:flex;align-items:center;justify-content:center;padding:1rem;
  backdrop-filter:blur(4px);animation:fadeIn .3s;
}
.personal-wg-modal{
  background:var(--panel);border:1px solid var(--border);border-radius:6px;
  width:92%;max-width:600px;max-height:85vh;display:flex;flex-direction:column;
  box-shadow:0 20px 60px rgba(0,0,0,.4);
}
.pwg-header{
  display:flex;align-items:center;gap:.5rem;
  padding:.7rem 1rem;border-bottom:1px solid var(--border);
  background:linear-gradient(135deg,rgba(200,164,90,.04),rgba(144,112,176,.03));
}
.pwg-title{font-family:var(--fd);font-size:.9rem;color:var(--gold);letter-spacing:1px;font-weight:600}
.pwg-model{font-size:.65rem;color:var(--txt3);margin-left:auto;font-family:var(--fm)}
.pwg-close{background:none;border:none;color:var(--txt3);font-size:1rem;cursor:pointer;padding:.1rem .3rem;transition:color .2s}
.pwg-close:hover{color:var(--red)}
.pwg-body{
  flex:1;overflow-y:auto;padding:1rem 1.2rem;
  font-size:.85rem;color:var(--txt);line-height:1.9;
  font-family:var(--fb);white-space:pre-wrap;
}
.pwg-footer{
  display:flex;gap:.5rem;padding:.6rem 1rem;border-top:1px solid var(--border);justify-content:flex-end;
}
.pwg-download,.pwg-copy{
  padding:.35rem .75rem;font-size:.72rem;cursor:pointer;border-radius:3px;
  border:1px solid var(--border2);background:rgba(200,164,90,.04);color:var(--gold);
  font-family:var(--fb);transition:all .2s;
}
.pwg-download:hover,.pwg-copy:hover{background:rgba(200,164,90,.1);border-color:var(--gold)}
.pwg-share{
  padding:.35rem .75rem;font-size:.72rem;cursor:pointer;border-radius:3px;
  border:1px solid rgba(0,255,136,.2);background:rgba(0,255,136,.04);color:#00ff88;
  font-family:var(--fb);transition:all .2s;
}
.pwg-share:hover{background:rgba(0,255,136,.12);border-color:#00ff88}
.pwg-branding{
  text-align:center;padding:.4rem;font-family:var(--fm);font-size:.55rem;color:var(--txt3);
  border-top:1px solid rgba(255,255,255,.04);
}
.pwg-branding a{color:var(--gold);text-decoration:none}
.pwg-branding a:hover{text-decoration:underline}

/* ══════ RISK MATRIX CARDS ══════ */
.risk-matrix-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.risk-matrix-card{
  background:var(--glass);
  border:1px solid rgba(196,60,60,.06);border-radius:4px;
  padding:.7rem;transition:all .3s;position:relative;overflow:hidden;
}
.risk-matrix-card:hover{border-color:rgba(196,60,60,.15);box-shadow:0 4px 16px rgba(0,0,0,.2)}
.rmc-title{font-family:var(--fh);font-size:.82rem;color:var(--gold);letter-spacing:.5px;margin-bottom:.5rem;font-weight:600;padding-bottom:.35rem;border-bottom:1px solid var(--border)}
.rmc-model{margin-bottom:.4rem;padding:.35rem .5rem;background:rgba(0,0,0,.15);border-radius:4px;border-left:2px solid transparent}
.rmc-model-header{display:flex;align-items:center;gap:.35rem;margin-bottom:.2rem}
.rmc-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.rmc-model-name{font-family:var(--fd);font-size:.55rem;letter-spacing:1.5px}
.rmc-pct{font-family:var(--fm);font-size:.75rem;font-weight:700;margin-left:auto}
.rmc-bar-track{height:4px;background:rgba(255,255,255,.04);border-radius:2px;overflow:hidden;margin-bottom:.2rem}
.rmc-bar-fill{height:100%;border-radius:2px;transition:width .8s ease}
.rmc-rationale{font-size:.68rem;color:var(--txt2);line-height:1.55;opacity:.85}
.risk-val-card{padding:.15rem 0}
.risk-val-meters{display:flex;gap:.6rem;margin-bottom:.2rem;flex-wrap:wrap}
.risk-meter{display:flex;align-items:center;gap:.2rem}
.risk-meter-label{font-size:.58rem;color:var(--txt3);font-family:var(--fb);width:26px;flex-shrink:0}
.risk-pip{width:8px;height:8px;border-radius:2px;background:var(--bg4);transition:all .3s}
.risk-pip.active{background:var(--pip-color,var(--red));box-shadow:0 0 4px var(--pip-color,var(--red))}
.risk-val-text{font-size:.78rem;color:var(--txt2);line-height:1.7;margin-top:.15rem;font-family:var(--fb)}

/* ══════ NEWS READER MODAL ══════ */
.news-reader-overlay{position:fixed;inset:0;z-index:1000;background:rgba(8,9,13,.8);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:1rem;animation:expandIn .3s ease-out}
.news-reader{background:var(--bg2);border:1px solid var(--border2);border-radius:4px;max-width:700px;width:100%;max-height:90vh;overflow:hidden;box-shadow:0 0 50px rgba(0,0,0,.5);display:flex;flex-direction:column}
.nr-header{display:flex;justify-content:space-between;align-items:center;padding:.6rem .9rem;background:linear-gradient(90deg,rgba(200,164,90,.04),transparent);border-bottom:1px solid var(--border2)}
.nr-classify{font-family:var(--fd);font-size:.65rem;color:var(--gold);letter-spacing:3px}
.nr-close{background:transparent;border:none;color:var(--txt3);font-size:1.2rem;cursor:pointer;transition:color .2s;padding:.2rem}
.nr-close:hover{color:var(--red)}
.nr-content{overflow-y:auto;padding:1.2rem}
.nr-img-wrap{margin-bottom:.8rem;border-radius:4px;overflow:hidden;border:1px solid var(--border);position:relative}
.nr-img{width:100%;max-height:320px;object-fit:cover;display:block}
.nr-meta{display:flex;gap:.8rem;align-items:center;margin-bottom:.6rem}
.nr-source{font-size:.7rem;line-height:1}
.nr-time{font-size:.68rem;color:var(--txt3);font-family:var(--fm)}
.nr-title-cn{font-size:1.15rem;line-height:1.75;color:var(--txt);margin-bottom:.4rem;font-weight:600;font-family:var(--fh)}
.nr-title-en{font-size:.85rem;color:var(--txt3);line-height:1.5;margin-bottom:.6rem;padding-bottom:.6rem;border-bottom:1px solid var(--border)}
.nr-body-cn{font-size:.92rem;color:var(--txt);line-height:1.9;margin-bottom:.8rem;white-space:pre-wrap;font-family:var(--fb)}
.nr-body-cn .translating{color:var(--txt3);font-style:italic;text-align:center;padding:1rem}
.nr-footer-bar{display:flex;justify-content:flex-end;padding-top:.4rem;border-top:1px solid var(--border)}
.nr-orig-link{color:var(--gold);text-decoration:none;font-size:.8rem;font-family:var(--fb);padding:.4rem .8rem;border:1px solid rgba(200,164,90,.15);border-radius:2px;transition:all .3s}
.nr-orig-link:hover{background:rgba(200,164,90,.04);border-color:var(--gold)}

/* ══════ MODEL DETAIL MODAL ══════ */
.model-detail-overlay{position:fixed;inset:0;z-index:60000;background:rgba(8,9,13,.85);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:1rem;animation:expandIn .3s ease-out}
.model-detail-modal{background:var(--bg2);border:1px solid var(--border2);border-radius:4px;max-width:960px;width:95%;max-height:90vh;overflow:hidden;box-shadow:0 0 50px rgba(0,0,0,.5);display:flex;flex-direction:column}
.mdm-header{display:flex;justify-content:space-between;align-items:center;padding:.7rem 1.2rem;background:linear-gradient(90deg,rgba(200,164,90,.04),transparent);border-bottom:1px solid var(--border2)}
.mdm-title{font-family:var(--fd);font-size:.82rem;color:var(--gold);letter-spacing:3px}
.mdm-close{background:transparent;border:none;color:var(--txt3);font-size:1.2rem;cursor:pointer;transition:color .2s;padding:.2rem}
.mdm-close:hover{color:var(--red)}
.mdm-body{overflow-y:auto;padding:1.2rem;max-height:calc(90vh - 60px)}

/* ══════ WARGAME SECTIONS ══════ */
.wg-section{background:rgba(0,0,0,.1);border:1px solid var(--border);border-radius:4px;margin-bottom:.6rem;overflow:hidden;transition:all .3s}
.wg-section:hover{border-color:var(--border2);box-shadow:0 2px 12px rgba(0,0,0,.2)}
.wg-section-title{
  display:flex;align-items:center;gap:.5rem;padding:.65rem .9rem;
  background:linear-gradient(135deg,rgba(200,164,90,.03),transparent);
  font-family:var(--f-impact);font-size:.75rem;color:var(--gold);letter-spacing:3px;
  border-bottom:1px solid var(--border);
}
.wg-icon{font-size:1.05rem}
.wg-section-body{padding:.8rem 1rem;font-size:.95rem;line-height:1.9;color:var(--txt);font-family:var(--f-headline),var(--fb)}
.wg-obj{margin:.3rem 0}
.wg-obj.depth-1{padding-left:.6rem;border-left:2px solid rgba(200,164,90,.1);margin-left:.1rem}
.wg-obj.depth-2{padding-left:.5rem;border-left:2px solid rgba(200,164,90,.06);margin-left:.1rem}
.wg-obj.depth-3{padding-left:.4rem;border-left:1px solid rgba(200,164,90,.04);margin-left:.1rem}
.wg-field{display:block;padding:.4rem 0;border-bottom:1px solid rgba(200,164,90,.02)}
.wg-field:last-child{border-bottom:none}
.wg-key{display:block;font-family:var(--f-impact);font-size:.76rem;color:var(--gold);letter-spacing:1.5px;opacity:.8;margin-bottom:.2rem;font-weight:600}
.wg-val{display:block}.wg-nested{display:block;width:100%}
.wg-text{color:var(--txt);word-break:break-word;font-family:var(--f-headline),var(--fb)}.wg-num{color:var(--gold);font-family:var(--fm);font-weight:600}.wg-bool{color:var(--green);font-family:var(--fm)}.wg-null{color:var(--txt3)}
.wg-text-block{line-height:1.9;font-size:.92rem;font-family:var(--f-headline),var(--fb)}.wg-timestamp{font-family:var(--fm);font-size:.88rem;color:var(--gold);padding:.2rem 0}
.wg-link{color:var(--gold);text-decoration:none;border-bottom:1px dashed rgba(200,164,90,.2)}.wg-link:hover{border-bottom-style:solid}
.wg-list{list-style:none;padding:0;margin:.3rem 0}
.wg-list li{padding:.3rem 0 .3rem 1rem;position:relative;font-size:.85rem;line-height:1.75}
.wg-list li::before{content:'›';position:absolute;left:0;color:var(--gold);opacity:.4;font-weight:700;font-size:1.1rem}
.wg-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:.6rem;margin:.4rem 0}
.wg-card{background:rgba(200,164,90,.01);border:1px solid var(--border);border-radius:4px;padding:.85rem;transition:all .3s}
.wg-card:hover{border-color:var(--border2);transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.2)}
.wg-card-title{font-family:var(--fd);font-size:.7rem;color:var(--gold);letter-spacing:1.5px;margin-bottom:.45rem;padding-bottom:.3rem;border-bottom:1px solid var(--border)}
.wg-actors-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:.6rem}
.actor-card{padding:.9rem;background:var(--glass);border:1px solid var(--border);border-radius:4px;transition:all .3s;position:relative;overflow:hidden}
.actor-card:hover{border-color:var(--border2);transform:translateY(-2px);box-shadow:0 4px 18px rgba(0,0,0,.25)}
.actor-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:.4rem;border-bottom:1px solid var(--border);margin-bottom:.4rem}
.actor-name{font-family:var(--fd);font-size:.75rem;color:var(--gold);letter-spacing:1.5px}
.actor-role{font-size:.62rem;color:var(--gold);padding:.12rem .45rem;background:rgba(200,164,90,.04);border:1px solid rgba(200,164,90,.1);border-radius:2px}
.actor-body{font-size:.8rem}.actor-field{margin:.25rem 0}.actor-label{font-size:.58rem;color:var(--txt3);font-family:var(--fd);letter-spacing:.5px}.actor-value{color:var(--txt)}
.no-data{text-align:center;padding:2rem;color:var(--txt3)}.no-data-icon{font-size:2rem;margin-bottom:.6rem;animation:pulse 2s infinite}.no-data p{font-size:.8rem;margin:.2rem 0}
/* Model detail raw fallback */
.mdm-raw-fallback{padding:1rem}
.mdm-raw-notice{color:var(--orange);font-size:.78rem;margin-bottom:.6rem;font-family:var(--fb)}
.mdm-raw-text{font-size:.68rem;color:var(--txt2);line-height:1.6;white-space:pre-wrap;word-break:break-all;max-height:60vh;overflow-y:auto;background:rgba(0,0,0,.2);padding:.8rem;border-radius:4px;border:1px solid rgba(255,255,255,.05);font-family:var(--fm)}
.radar-spinner{width:36px;height:36px;border:2px solid var(--border);border-top-color:var(--gold);border-radius:50%;margin:0 auto .8rem;animation:spin 1s linear infinite}
.loading-state{text-align:center;padding:2rem}

/* ══════ QUEWI STYLES ══════ */
.mb-quewi{border-color:var(--quewi);color:var(--quewi);box-shadow:var(--glow-quewi)}
.mdb-quewi:hover{border-color:var(--quewi);color:var(--quewi)}
.qdot{background:var(--quewi);color:var(--quewi)}
.quewi-results{margin-top:.5rem}
.quewi-cite{padding:.35rem .6rem;background:rgba(144,112,176,.015);border:1px solid rgba(144,112,176,.08);border-radius:4px;margin-bottom:.3rem;font-size:.78rem;transition:all .25s}
.quewi-cite:hover{background:rgba(144,112,176,.04);border-color:rgba(144,112,176,.2)}
.quewi-cite-title{color:var(--quewi);font-weight:500;margin-bottom:.12rem}
.quewi-cite-title a{color:var(--quewi);text-decoration:none}.quewi-cite-title a:hover{text-decoration:underline}
.quewi-cite-snippet{color:var(--txt2);font-size:.72rem;line-height:1.45}
.quewi-cite-date{font-size:.58rem;color:var(--txt3);font-family:var(--fm);margin-top:.12rem}

/* ══════ INTEL CUSTOM MODAL ══════ */
.ic-modal{max-width:460px}
.ic-header{text-align:center;margin-bottom:1rem}
.ic-header h2{font-family:var(--fd);font-size:.82rem;color:var(--gold);letter-spacing:3px;margin-bottom:.3rem}
.ic-header p{font-size:.78rem;color:var(--txt2)}
.ic-input{width:100%;padding:.65rem;background:var(--bg);border:1px solid var(--border);color:var(--txt);font-size:.82rem;border-radius:4px;margin-bottom:.5rem;font-family:var(--fb)}
.ic-submit{width:100%;padding:.6rem;background:linear-gradient(135deg,var(--gold),var(--orange));border:none;color:var(--bg);font-weight:700;font-size:.8rem;cursor:pointer;border-radius:2px;margin-bottom:.6rem}
.ic-paywall{text-align:center;padding:.7rem;background:rgba(200,164,90,.02);border:1px solid rgba(200,164,90,.08);border-radius:4px}
.ic-paywall p{font-size:.78rem;color:var(--txt2);margin-bottom:.3rem}
.ic-price{color:var(--gold);font-weight:600}

/* ══════ FOOTER ══════ */
.wfooter{
  display:flex;justify-content:space-between;align-items:center;
  padding:.7rem 1.5rem;background:var(--glass2);backdrop-filter:blur(8px);
  border-top:1px solid var(--border);font-size:.68rem;color:var(--txt3);
}
.disclaimer{color:var(--gold);opacity:.7}
.wfooter a{color:var(--gold);text-decoration:none;opacity:.8}
.wfooter a:hover{opacity:1}

/* ══════ TOAST ══════ */
.toast-msg{
  position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--glass2);backdrop-filter:blur(16px);
  border:1px solid var(--gold);color:var(--txt);
  padding:.75rem 1.5rem;border-radius:4px;font-size:.82rem;
  z-index:10000;opacity:0;transition:all .4s;
  box-shadow:0 4px 20px rgba(0,0,0,.4);
}
.toast-msg.visible{opacity:1;transform:translateX(-50%) translateY(0)}

/* ══════ MODALS ══════ */
.modal-overlay{position:fixed;inset:0;z-index:1000;background:rgba(8,9,13,.85);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:1rem}
.modal{background:var(--bg3);border:1px solid var(--border2);border-radius:4px;max-width:520px;width:100%;padding:1.5rem;position:relative}
.modal-close{position:absolute;top:.8rem;right:.8rem;background:transparent;border:none;color:var(--txt3);font-size:1.1rem;cursor:pointer;transition:color .2s}.modal-close:hover{color:var(--gold)}
.auth-hdr{text-align:center;margin-bottom:1.2rem}
.auth-hdr h2{font-family:var(--fd);font-size:.82rem;color:var(--gold);margin-bottom:.4rem;letter-spacing:3px}
.auth-hdr p{font-size:.78rem;color:var(--txt2)}
.auth-methods{display:flex;flex-direction:column;gap:.4rem}
.auth-method-btn{padding:.65rem;background:rgba(255,255,255,.015);border:1px solid var(--border);color:var(--txt);font-size:.8rem;cursor:pointer;border-radius:2px;text-align:center;font-family:var(--fb);transition:all .2s}
.auth-method-btn:hover{border-color:var(--gold);background:rgba(200,164,90,.03)}
.auth-input{width:100%;padding:.65rem;background:var(--bg);border:1px solid var(--border);color:var(--txt);font-size:.8rem;border-radius:4px;margin-bottom:.4rem;font-family:var(--fb)}
.auth-submit-btn{width:100%;padding:.65rem;background:linear-gradient(135deg,var(--gold),var(--gold2));border:none;color:var(--bg);font-weight:700;font-size:.8rem;cursor:pointer;border-radius:2px}

/* ══════ SCROLLBAR ══════ */
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(200,164,90,.12);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:rgba(200,164,90,.22)}

/* ══════ RESPONSIVE ══════ */

/* --- Safe area for notch devices --- */
@supports(padding:env(safe-area-inset-top)){
  .topbar{padding-left:max(1.2rem,env(safe-area-inset-left));padding-right:max(1.2rem,env(safe-area-inset-right))}
  .wfooter{padding-bottom:max(.7rem,env(safe-area-inset-bottom))}
}

/* --- Tablet landscape / small desktop --- */
@media(max-width:1024px){
  .dual-panel{grid-template-columns:1fr;display:flex;flex-direction:column}
  /* Mobile order: dashboard(24h events) → news feed → risk matrix → rest */
  .panel-compare{order:0;display:flex;flex-direction:column}
  .panel-intel{order:0;max-height:none;position:static;border-right:none;border-bottom:1px solid var(--border)}

  /* Reorder compare-body children for mobile:
     mil-dashboard (24h events) first, then news panel injected via JS,
     risk-overview later */
  .compare-body{display:flex;flex-direction:column}
  .mil-dashboard{order:-3}
  /* News panel gets injected here via JS (order:-2) */
  .compare-body > .panel-intel{order:-2;max-height:none;border-right:none;border-bottom:1px solid var(--border)}
  .risk-overview{order:-1}
  .divergence-banner{order:0}
  .compare-tables{order:1}
  .consensus-block{order:2}
  .model-detail-bar{order:3}
  .chat-section-inline{order:4}
  .factcheck-panel{order:5}

  /* Scrollable news container on mobile */
  .panel-intel .news-list-wrap{max-height:45vh;overflow-y:auto;-webkit-overflow-scrolling:touch}

  .panel-header{position:static}
  .div-models{grid-template-columns:1fr}
  .risk-matrix-grid{grid-template-columns:1fr}
  .force-grid{grid-template-columns:1fr}
  .stat-hero-row{grid-template-columns:repeat(2,1fr)}
  .threat-status-bar{grid-template-columns:repeat(2,1fr)}
  .ratio-grid{grid-template-columns:repeat(2,1fr)}
  .worst-case-cards{grid-template-columns:1fr}
  .timeline-track{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:.5rem}
  .wg-cards{grid-template-columns:1fr}
  .wg-actors-grid{grid-template-columns:1fr}
}

/* --- Tablet portrait / large phones --- */
@media(max-width:768px){
  html{font-size:15px}
  /* Topbar compact */
  .topbar{flex-wrap:wrap;gap:.3rem;padding:.5rem .6rem}
  .topbar-left{order:1;flex:1}
  .topbar-center{order:3;width:100%;text-align:center;padding-top:.25rem;border-top:1px solid var(--border)}
  .topbar-right{order:2;gap:.4rem}
  .theater-label{font-size:.85rem;letter-spacing:3px}
  .refresh-btn{padding:.3rem .55rem;font-size:.72rem}
  .auth-btn{padding:.3rem .5rem;font-size:.72rem}

  /* Intel panel — JS handles mobile positioning */
  .panel-intel{max-height:none}
  .intel-search-input{width:130px;font-size:.78rem}
  .intel-search-input:focus{width:160px}
  .news-item{padding:.7rem .9rem;gap:.6rem}
  .news-item-thumb{width:60px;height:45px}
  .news-item-title{font-size:.9rem;-webkit-line-clamp:2}

  /* Compare */
  .compare-body{padding:.7rem}
  .model-detail-modal{max-width:96vw;width:96vw}
  .model-detail-bar{flex-direction:column;align-items:stretch}
  .model-detail-bar .mdb-btn{justify-content:center;padding:.5rem .8rem}
  .model-indicators{flex-wrap:wrap;gap:.3rem}
  .mi{font-size:.58rem;padding:.3rem .6rem}

  /* Force */
  .force-grid{grid-template-columns:1fr}
  .stat-hero-row{grid-template-columns:repeat(2,1fr);gap:.4rem}
  .stat-hero-num{font-size:1.1rem}
  .ratio-grid{grid-template-columns:1fr}
  .worst-case-cards{grid-template-columns:1fr}
  .div-models{grid-template-columns:1fr}
  .div-model-val{font-size:.75rem;line-height:1.55}

  /* Leaders */
  .leader-grid-v2{grid-template-columns:1fr}
  .ldr2-card{padding:.5rem}
  .ldr2-avatar{width:40px;height:40px}

  /* Timeline horizontal scroll */
  .timeline-node{min-width:150px}
  .timeline-model-text{font-size:.68rem}

  /* Tables: horizontal scroll wrapper */
  .ct-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ct-table thead,.ct-table tbody,.ct-table tr,.ct-table th,.ct-table td{min-width:100px}

  /* Hormuz */
  .hormuz-section{margin:.5rem}
  .hormuz-map{min-height:300px}

  /* Cinematic */
  .classified-stamp{letter-spacing:6px;padding:.4rem 1.2rem}

  /* News popup — near fullscreen */
  .news-float-popup{width:96vw!important;max-height:90vh;border-radius:6px}
  .nfp-scroll{padding:.9rem 1rem}
  .nfp-title{font-size:1.05rem}

  /* Modal detail — fullscreen feel */
  .model-detail-overlay{padding:.4rem}
  .mdm-body{padding:.8rem}
  .mdm-header{padding:.55rem .8rem}

  /* Chat */
  .chat-suggestions{flex-direction:column;align-items:stretch}
  .sgbtn{text-align:left;padding:.45rem .7rem;font-size:.72rem}

  /* Footer */
  .wfooter{flex-direction:column;gap:.3rem;text-align:center;padding:.6rem 1rem}
}

/* --- Phone --- */
@media(max-width:480px){
  html{font-size:14.5px}

  /* Cinematic: phone-safe */
  .classified-stamp{font-size:clamp(1.8rem,7vw,3rem);letter-spacing:4px;padding:.3rem 1rem}
  .classified-sub{font-size:.82rem;letter-spacing:3px}
  .intel-block{font-size:clamp(.65rem,1.6vw,.82rem)}
  .title-main{letter-spacing:1px!important;font-size:clamp(1.1rem,5vw,1.8rem)!important;white-space:nowrap!important;word-spacing:2px!important;text-align:center!important;line-height:1.3!important}
  .title-sub{letter-spacing:4px;font-size:clamp(.95rem,2.5vw,1.2rem)}
  .title-cn{letter-spacing:2px}
  .title-vs{max-width:320px;gap:.5rem}
  .vs-text{font-size:.62rem;letter-spacing:2px}
  .title-models{gap:.3rem}
  .mbadge{font-size:.52rem;padding:.28rem .6rem;letter-spacing:1px}
  .mbadge-vs{font-size:.55rem}
  .title-desc{font-size:.75rem;letter-spacing:1.5px}
  .cine-enter-btn{font-size:clamp(.95rem,2.5vw,1.2rem);padding:.7rem 2rem;letter-spacing:4px}
  .cine-enter-hint{font-size:.6rem}
  .skip-btn{bottom:1.5rem;right:1rem;padding:.45rem 1rem;font-size:.6rem}
  .threat-box{flex-direction:column;gap:.5rem;padding:.65rem 1rem;text-align:center}

  /* Topbar: compact but readable */
  .topbar{padding:.4rem .5rem;gap:.25rem}
  .logo-icon{font-size:1.1rem}
  .logo-txt{font-size:.72rem;letter-spacing:2px;white-space:nowrap}
  .live-ind{font-size:.55rem}
  .sfx-toggle{padding:.2rem .35rem;font-size:.75rem}
  .topbar-center .theater-label{font-size:.72rem;letter-spacing:2px}
  .data-ts{font-size:.58rem}
  .topbar-right .q-badge{display:none}
  .topbar-right .auth-btn span:nth-child(2){font-size:.55rem;letter-spacing:.5px}\n  .topbar-right .auth-btn-cta{padding:.25rem .5rem;font-size:.55rem;letter-spacing:.5px}
  .refresh-btn{padding:.28rem .5rem;font-size:.65rem;gap:.2rem}

  /* Ticker */
  .ticker-bar{height:30px}
  .ticker-label{font-size:.55rem;padding:0 .5rem;letter-spacing:1.5px}
  .ticker-content{font-size:.72rem;gap:2rem}

  /* Intel panel: on mobile, JS moves it into compare-body */
  .panel-intel{max-height:none}
  .panel-header{padding:.5rem .65rem}
  .ph-title{font-size:.85rem;letter-spacing:1.5px}
  .panel-compare .ph-title{font-size:1.1rem;letter-spacing:2.5px}
  .quewi-intel-combined{font-size:.68rem;padding:.28rem .55rem}
  .ph-badge{font-size:.65rem;padding:.12rem .45rem}
  .intel-search-input{width:100px;padding:.35rem .5rem .35rem 1.8rem;font-size:.75rem}
  .intel-search-input:focus{width:130px}
  .news-item{padding:.6rem .7rem;gap:.55rem}
  .news-item-thumb{width:54px;height:40px;border-radius:2px}
  .news-item-title{font-size:.88rem;line-height:1.6}
  .news-item-source{font-size:.65rem}
  .news-item-summary{font-size:.75rem}
  .news-item-time{font-size:.6rem}
  .intel-footer{padding:.4rem .65rem}
  .intel-src-note{font-size:.58rem}
  .intel-custom-btn{font-size:.62rem;padding:.24rem .5rem}

  /* Hormuz: phone layout */
  .hormuz-section{margin:.25rem;border-radius:4px}
  .hormuz-header{padding:.55rem .7rem}
  .hz-title{font-size:.72rem;letter-spacing:1.5px}
  .hz-subtitle{display:block;font-size:.45rem;letter-spacing:1px;padding:.1rem .35rem}
  .hz-icon{font-size:1rem}
  .hormuz-map{min-height:250px}
  .hz-map-stats{flex-wrap:wrap}
  .hz-mstat{min-width:50%;padding:.35rem .2rem}
  .hz-mstat-val{font-size:.85rem}
  .hz-mstat-label{font-size:.5rem}
  .hz-zoom-btns{gap:.2rem}
  .hz-zoom-btn{padding:.2rem .4rem;font-size:.6rem}
  .hz-stat-card{padding:.45rem .5rem;gap:.4rem}
  .hz-stat-icon{font-size:1rem}
  .hz-stat-num{font-size:.95rem}
  .hz-stat-desc{font-size:.62rem}
  .hz-oil-price{font-size:.85rem}
  .hz-oil-label{font-size:.55rem;min-width:60px}

  /* Compare body */
  .compare-body{padding:.45rem}

  /* Risk */
  .risk-ov-title{font-size:.72rem;letter-spacing:2px}
  .risk-bars{grid-template-columns:1fr}
  .risk-bar-item{padding:.45rem .55rem}

  /* Stats & Force */
  .stat-hero-row{grid-template-columns:repeat(2,1fr);gap:.35rem}
  .stat-hero{padding:.5rem .3rem}
  .stat-hero-num{font-size:.95rem}
  .stat-hero-icon{font-size:1.2rem}
  .stat-hero-label{font-size:.6rem}
  .threat-status-bar{grid-template-columns:repeat(2,1fr);gap:.3rem}
  .tsb-label{font-size:.5rem}
  .tsb-val{font-size:.65rem}
  .force-header{flex-direction:column;gap:.4rem;padding:.55rem}
  .force-flag{font-size:1.2rem}
  .force-name{font-size:.68rem;letter-spacing:2px}
  .force-vs{font-size:.85rem}
  .force-card{padding:.6rem}
  .force-card-title{font-size:.68rem;letter-spacing:2px}
  .slider-label{width:70px;font-size:.62rem}
  .slider-input::-webkit-slider-thumb{width:20px;height:20px}
  .balance-gauge{padding:.5rem}
  .gauge-bar{height:22px}
  .gauge-labels{font-size:.6rem}
  .esc-gauge-track{height:22px}
  .esc-gauge-val{font-size:.72rem}

  /* Divergence */
  .div-banner-title{font-size:.72rem;letter-spacing:2px}
  .div-topic{font-size:.78rem}
  .div-model-cell{padding:.35rem .4rem}
  .div-model-name{font-size:.5rem}
  .div-model-val{font-size:.72rem;line-height:1.5}

  /* Ratio */
  .ratio-grid{grid-template-columns:1fr}
  .risk-matrix-grid{grid-template-columns:1fr}

  /* Timeline */
  .timeline-node{min-width:130px;padding-top:2rem}
  .timeline-dot{width:16px;height:16px;font-size:.45rem}
  .timeline-label{font-size:.62rem}
  .timeline-model-text{font-size:.65rem;line-height:1.5}

  /* Leaders */
  .leader-grid-v2{grid-template-columns:1fr}
  .ldr2-card{padding:.4rem}
  .ldr2-name{font-size:.78rem}
  .ldr2-avatar{width:36px;height:36px}
  .ldr2-quote{font-size:.7rem}

  /* Model detail buttons */
  .model-detail-bar{padding:.4rem .5rem;gap:.35rem}
  .mdb-label{font-size:.68rem;display:none}
  .mdb-btn{padding:.45rem .6rem;font-size:.72rem;flex:1;justify-content:center}

  /* Indicators */
  .model-indicators{flex-wrap:wrap;gap:.25rem}
  .mi{font-size:.5rem;padding:.22rem .45rem;letter-spacing:1px}

  /* Chat */
  .chat-section-hdr{padding:.45rem .6rem;font-size:.72rem}
  .chat-quewi-logo{width:18px;height:18px;font-size:.55rem}
  .chat-sel{font-size:.65rem;padding:.22rem .4rem}
  .chat-msgs{max-height:180px;padding:.4rem .6rem}
  .chat-welcome{font-size:.78rem;padding:.5rem}
  .chat-input-area{padding:.4rem .6rem}
  .chat-row textarea{padding:.4rem;font-size:.78rem}
  .chat-send-btn{padding:.4rem .7rem;font-size:.72rem}
  .chat-usage{font-size:.55rem}

  /* Fact check */
  .fc-summary-bar{grid-template-columns:1fr}
  .fc-breakdown-grid{grid-template-columns:1fr}

  /* News popup — fullscreen on phone */
  .news-float-popup{
    width:100vw!important;max-height:100vh!important;
    border-radius:0!important;top:0!important;left:0!important;
    transform:none!important;
  }
  .news-float-popup.nfp-show{transform:none!important}
  .nfp-scroll{padding:.8rem .9rem}
  .nfp-title{font-size:1rem;line-height:1.7}
  .nfp-title-en{font-size:.72rem}
  .nfp-body{font-size:.88rem;line-height:1.85}

  /* Model detail modal — fullscreen */
  .model-detail-overlay{padding:0}
  .model-detail-modal{max-width:100vw;width:100vw;max-height:100vh;border-radius:0}
  .mdm-body{padding:.65rem;max-height:calc(100vh - 50px)}
  .mdm-header{padding:.5rem .7rem}
  .mdm-title{font-size:.72rem;letter-spacing:2px}
  .wg-cards{grid-template-columns:1fr}
  .wg-actors-grid{grid-template-columns:1fr}
  .wg-section-title{font-size:.68rem;letter-spacing:2px;padding:.5rem .65rem}
  .wg-section-body{padding:.6rem .7rem;font-size:.82rem;line-height:1.75}

  /* Auth & modals */
  .modal-overlay{padding:.3rem}
  .modal{max-width:100%;padding:1.2rem;border-radius:4px}

  /* Footer */
  .wfooter{padding:.5rem .8rem;font-size:.6rem;gap:.2rem}
}

/* --- Small phones (iPhone SE, etc.) --- */
@media(max-width:360px){
  html{font-size:13.5px}
  .topbar-left .logo-txt{font-size:.62rem;letter-spacing:1px}
  .topbar-left .live-ind{display:none}
  .topbar-center .theater-label{font-size:.65rem;letter-spacing:1.5px}
  .stat-hero-row{grid-template-columns:1fr 1fr;gap:.25rem}
  .stat-hero-num{font-size:.88rem}
  .stat-hero-label{font-size:.58rem}
  .force-card{padding:.45rem}
  .force-card-title{font-size:.65rem}
  .timeline-track{gap:0;padding:.5rem 0}
  .timeline-node{min-width:110px}
  .chat-msgs{max-height:150px}
  .dual-panel{min-height:auto}
  .panel-intel{max-height:none}
  .news-item-thumb{display:none}
  .news-item{padding:.5rem .6rem}
  .news-item-title{font-size:.82rem;-webkit-line-clamp:2}
  .hormuz-map{min-height:220px}
  .hz-header-left .hz-icon{display:none}
  .hz-zoom-btns{display:none}
  .mdb-btn{font-size:.65rem;padding:.4rem .45rem}
  .classified-stamp{font-size:clamp(1.5rem,6vw,2.5rem);letter-spacing:3px;padding:.25rem .8rem;border-width:2px}
  .classified-sub{font-size:.68rem;letter-spacing:2px}
}

/* --- Landscape phones --- */
@media(max-height:500px) and (orientation:landscape){
  .cine-overlay{overflow-y:auto}
  .classified-stamp{font-size:2rem;letter-spacing:4px}
  .title-main{font-size:clamp(1rem,4.5vw,1.6rem)!important;letter-spacing:1px!important;white-space:nowrap!important;word-spacing:2px!important;text-align:center!important}
  .title-models{flex-wrap:nowrap}
  .skip-btn{bottom:.8rem;right:.8rem}
  .topbar-center{display:none}
  .panel-intel{max-height:none}
  .hormuz-map{min-height:200px}
}

/* --- Touch device optimizations --- */
@media(hover:none) and (pointer:coarse){
  /* Larger touch targets (min 44px) */
  .refresh-btn,.auth-btn,.hz-zoom-btn,.hz-track-btn,.mdb-btn,.sgbtn,.fc-run-btn,.intel-custom-btn,.skip-btn,.nfp-close,.nr-close,.mdm-close,.modal-close{
    min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;
  }
  .news-item{min-height:52px}
  .mi-clickable{min-height:36px;display:inline-flex;align-items:center}
  /* Remove hover effects that linger on touch */
  .news-item:hover{transform:none;background:transparent}
  .news-item:active{background:rgba(200,164,90,.04)}
  .force-card:hover,.hz-stat-card:hover,.stat-hero:hover,.dash-card:hover,.wc-card:hover{transform:none}
  .force-card:active,.hz-stat-card:active,.stat-hero:active{background:rgba(200,164,90,.03)}
  /* Improve scroll performance */
  .news-list-wrap,.mdm-body,.nfp-scroll,.hormuz-stats,.compare-body{
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  }
  /* Prevent text selection on interactive elements */
  .topbar,.ticker-bar,.model-detail-bar,.hz-zoom-btns,.chat-suggestions{
    -webkit-user-select:none;user-select:none;
  }
  /* Better tap feedback */
  .news-item,.mi-clickable,.mdb-btn,.sgbtn,.hz-zoom-btn,.refresh-btn{
    -webkit-tap-highlight-color:rgba(200,164,90,.08);
  }
}

/* ═══════════════════════════════════════════════════
   HORMUZ MARITIME TRACKING PANEL
   ═══════════════════════════════════════════════════ */
.hormuz-section{
  margin:1rem;padding:0;
  background:var(--glass2);border:1px solid var(--border2);
  border-radius:4px;overflow:hidden;
  box-shadow:0 8px 32px rgba(0,0,0,.3);
}
.hormuz-header{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
  padding:.8rem 1.4rem;
  background:linear-gradient(135deg,rgba(74,152,196,.04),transparent);
  border-bottom:1px solid var(--border2);gap:.5rem;
}
.hz-header-left{display:flex;align-items:center;gap:.7rem}
.hz-icon{font-size:1.3rem}
.hz-title{
  font-family:var(--fd);font-size:.95rem;font-weight:700;letter-spacing:4px;
  color:#5b9ec4;text-shadow:0 0 12px rgba(91,158,196,.15);
}
.hz-subtitle{
  font-family:var(--fm);font-size:.55rem;color:var(--txt3);
  letter-spacing:2px;background:rgba(91,158,196,.04);
  padding:.15rem .55rem;border-radius:2px;border:1px solid rgba(91,158,196,.08);
}
.hz-header-right{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.hz-api-badge{font-family:var(--fm);font-size:.62rem;letter-spacing:1px;padding:.2rem .6rem;border-radius:2px;display:flex;align-items:center;gap:.3rem}
.hz-api-online{background:rgba(106,154,74,.08);color:var(--green);border:1px solid rgba(106,154,74,.15)}
.hz-api-offline{background:rgba(200,164,90,.06);color:var(--gold);border:1px solid rgba(200,164,90,.12)}
.hz-api-dot{width:5px;height:5px;border-radius:50%;display:inline-block}
.hz-online{background:var(--green);box-shadow:0 0 4px var(--green);animation:pulse 1.5s infinite}
.hz-offline{background:var(--gold);box-shadow:0 0 3px var(--gold)}
.hz-api-pulse{animation:apiBadgeFlash .6s ease}
@keyframes apiBadgeFlash{0%{box-shadow:0 0 0 0 rgba(106,154,74,.3)}50%{box-shadow:0 0 6px 3px rgba(106,154,74,.15)}100%{box-shadow:none}}
.hz-live-badge{display:inline-block;background:var(--red);color:#fff;font-size:.52rem;font-weight:700;padding:0 .35rem;border-radius:2px;letter-spacing:.05em;animation:livePulse 2s ease infinite;vertical-align:middle;line-height:1.5}
@keyframes livePulse{0%,100%{opacity:1}50%{opacity:.6}}
.hz-sim-badge{display:inline-block;background:rgba(200,164,90,.2);color:var(--gold);font-size:.52rem;font-weight:700;padding:0 .35rem;border-radius:2px;letter-spacing:.05em;vertical-align:middle;line-height:1.5}
.hz-zoom-btns{display:flex;gap:.3rem}
.hz-zoom-btn{
  background:rgba(91,158,196,.04);border:1px solid var(--border);
  color:var(--txt2);padding:.22rem .55rem;border-radius:2px;
  font-size:.68rem;cursor:pointer;font-family:var(--fb);transition:all .3s;
}
.hz-zoom-btn:hover{border-color:#5b9ec4;color:#5b9ec4;background:rgba(91,158,196,.08)}

/* Hormuz body layout */
.hormuz-body{display:grid;grid-template-columns:1fr 300px;gap:0;min-height:450px}
.hormuz-map-wrap{position:relative;overflow:hidden}
.hormuz-map{width:100%;height:100%;min-height:450px;background:#0a1210;z-index:1}
.hormuz-map .leaflet-container{background:#0a1210!important}
.hormuz-map .leaflet-control-zoom a{background:var(--glass2)!important;color:var(--gold)!important;border-color:var(--border2)!important}
.hormuz-map .leaflet-popup-content-wrapper{background:var(--bg2)!important;color:var(--txt)!important;border:1px solid var(--border2);border-radius:4px;box-shadow:0 4px 20px rgba(0,0,0,.5)}
.hormuz-map .leaflet-popup-tip{background:var(--bg2)!important}
.v-popup{font-family:var(--fb);font-size:.78rem;min-width:180px}
.v-popup-name{font-family:var(--fd);font-size:.72rem;font-weight:700;color:#5b9ec4;letter-spacing:1px;margin-bottom:.4rem;padding-bottom:.3rem;border-bottom:1px solid var(--border)}
.v-popup-row{padding:.15rem 0;color:var(--txt2);font-size:.72rem}
.v-popup-row strong{color:var(--txt)}
.v-popup-social{display:flex;gap:6px;margin-top:.5rem;padding-top:.4rem;border-top:1px solid var(--border);flex-wrap:wrap}
.v-social-btn{background:rgba(200,164,90,.04);border:1px solid rgba(255,255,255,.08);color:var(--txt2);font-size:.6rem;padding:.2rem .4rem;border-radius:3px;cursor:pointer;display:inline-flex;align-items:center;gap:4px;transition:all .25s;font-family:var(--fb);backdrop-filter:blur(4px)}
.v-social-btn:hover{border-color:rgba(200,164,90,.25);color:var(--gold);background:rgba(200,164,90,.08)}
.v-social-btn:active{transform:scale(.95)}
.vp-svg{width:12px;height:12px;flex-shrink:0;opacity:.65;transition:opacity .2s}
.v-social-btn:hover .vp-svg{opacity:1}
.vp-liked{color:#e05050;border-color:rgba(200,60,60,.2);background:rgba(200,60,60,.06)}
.vp-liked .vp-svg{opacity:1}
.vp-active{color:var(--force-blue);border-color:rgba(70,120,180,.25)}
.v-share-btn{color:var(--quewi);border-color:rgba(144,112,176,.15)}
.v-share-btn:hover{border-color:var(--quewi);color:#fff;background:rgba(144,112,176,.1)}
.v-social-cnt{font-family:var(--fm);font-size:.56rem;letter-spacing:.5px}
.vessel-marker-stable{transition:none!important;will-change:auto!important}

/* ═══ MARKER CLUSTER — Dark military theme overrides ═══ */
.hz-cluster-icon{background:none!important;border:none!important}
.hz-cluster{
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;font-family:var(--fm);font-weight:700;
  color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8);
  box-sizing:border-box;cursor:pointer;
  transition:transform .15s ease;
}
.hz-cluster:hover{transform:scale(1.15)}
/* Vessel clusters — cyan/teal */
.hz-cluster-vessel{background:rgba(0,180,200,.25);border:2px solid rgba(0,229,255,.6);box-shadow:0 0 12px rgba(0,229,255,.3)}
.hz-cluster-vessel.hz-cluster-sm{width:30px;height:30px;font-size:11px}
.hz-cluster-vessel.hz-cluster-md{width:36px;height:36px;font-size:12px}
.hz-cluster-vessel.hz-cluster-lg{width:44px;height:44px;font-size:14px;border-width:2.5px}
/* Satellite clusters — magenta/red */
.hz-cluster-sat{background:rgba(255,45,85,.2);border:2px solid rgba(255,45,85,.55);box-shadow:0 0 12px rgba(255,45,85,.25);gap:2px;font-size:10px}
.hz-cluster-sat.hz-cluster-sm{width:34px;height:34px;font-size:10px}
.hz-cluster-sat.hz-cluster-md{width:40px;height:40px;font-size:11px}
.hz-cluster-sat.hz-cluster-lg{width:48px;height:48px;font-size:13px;border-width:2.5px}
/* Override default leaflet markercluster styles */
.marker-cluster-small,.marker-cluster-medium,.marker-cluster-large{background:rgba(30,30,40,.7)!important}
.marker-cluster-small div,.marker-cluster-medium div,.marker-cluster-large div{background:rgba(0,180,200,.35)!important;color:#fff!important;font-family:var(--fm)!important}
/* Spiderfy legs */
.leaflet-cluster-anim .leaflet-marker-icon,.leaflet-cluster-anim .leaflet-marker-shadow{transition:transform .3s ease,opacity .3s ease}

.vessel-marker-stable:hover{z-index:1000!important}
.vessel-marker-stable:hover .v-svg-marker{transform:scale(1.2)}
.v-marker-wrap{position:relative;width:36px;height:36px;display:flex;align-items:center;justify-content:center}
.v-svg-marker{width:32px;height:32px;transition:transform .2s ease}
.v-flag-label{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-size:13px;line-height:1;text-shadow:0 1px 3px rgba(0,0,0,.8);pointer-events:none;white-space:nowrap}
.v-dot{width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:8px;box-shadow:0 0 6px currentColor;position:relative}
.v-tracked-dot{width:24px;height:24px;font-size:14px;animation:glowPulse 1.5s infinite}
.v-heading{position:absolute;top:-8px;left:50%;transform-origin:center bottom;font-size:8px;color:#6a9a4a;text-shadow:0 0 4px #6a9a4a}
.v-icon{font-size:7px;line-height:1}
.loc-dot{width:8px;height:8px;border-radius:50%;position:relative}
.loc-dot::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:1px solid currentColor;opacity:.25;animation:pulse 2s infinite}
.hz-tooltip{background:var(--bg2)!important;color:var(--txt)!important;border:1px solid var(--border2)!important;border-radius:4px!important;font-family:var(--fb)!important;font-size:.68rem!important;padding:.3rem .5rem!important;box-shadow:0 4px 12px rgba(0,0,0,.4)!important;white-space:pre-line}
.hz-tooltip::before{border-top-color:var(--border2)!important}
.hormuz-label{background:none!important;border:none!important}
.hz-label-inner{text-align:center;font-family:var(--fd);font-size:.68rem;color:rgba(196,60,60,.6);letter-spacing:3px;text-shadow:0 0 8px rgba(196,60,60,.2);animation:threatPulse 3s infinite}
.hz-sub{font-size:.52rem;color:rgba(196,60,60,.4);letter-spacing:3px}

/* Map stats bar */
.hz-map-stats{
  position:absolute;bottom:0;left:0;right:0;z-index:1000;
  display:flex;gap:0;
  background:linear-gradient(0deg,rgba(8,9,13,.92),rgba(8,9,13,.6));
  backdrop-filter:blur(8px);border-top:1px solid var(--border);
}
.hz-mstat{flex:1;text-align:center;padding:.45rem .3rem;border-right:1px solid var(--border)}
.hz-mstat:last-child{border-right:none}
.hz-mstat-val{display:block;font-family:var(--fd);font-size:1rem;font-weight:700;color:var(--gold)}
.hz-mstat-green .hz-mstat-val{color:var(--green)}
.hz-mstat-red .hz-mstat-val{color:var(--red)}
.hz-mstat-purple .hz-mstat-val{color:var(--quewi)}
.hz-mstat-label{font-size:.58rem;color:var(--txt3);letter-spacing:1px;font-family:var(--fb)}

/* Stats sidebar */
.hormuz-stats{background:var(--bg2);border-left:1px solid var(--border);padding:.45rem;display:flex;flex-direction:column;gap:.25rem;overflow-y:auto}

/* Satellite section */
.hz-sat-section{
  padding:.6rem;border-radius:4px;
  background:linear-gradient(135deg,rgba(91,158,196,.04),rgba(200,164,90,.02));
  border:1px solid rgba(91,158,196,.12);margin-bottom:.15rem;
}
.hz-sat-title{font-family:var(--fd);font-size:.65rem;letter-spacing:3px;color:#5b9ec4;margin-bottom:.5rem;display:flex;align-items:center;gap:.3rem;text-shadow:0 0 6px rgba(91,158,196,.2)}
.hz-sat-grid{display:flex;flex-direction:column;gap:.25rem}
.hz-sat-item{display:flex;justify-content:space-between;align-items:center;padding:.22rem .4rem;border-radius:3px;background:rgba(0,0,0,.15)}
.hz-sat-label{font-family:var(--fd);font-size:.52rem;letter-spacing:1.5px;color:var(--txt3)}
.hz-sat-val{font-family:var(--fm);font-size:.6rem;font-weight:600;color:var(--txt2)}
.hz-sat-active{color:var(--green)}
.hz-sat-cov{color:#5b9ec4}
.hz-sat-ref{margin-top:.4rem;text-align:center}
.hz-sat-link{font-family:var(--fm);font-size:.55rem;color:rgba(91,158,196,.6);text-decoration:none;letter-spacing:.5px;transition:all .3s}
.hz-sat-link:hover{color:#5b9ec4}

/* Oil prices */
.hz-oil-section{
  padding:.6rem;border-radius:4px;
  background:linear-gradient(135deg,rgba(200,164,90,.04),rgba(196,60,60,.02));
  border:1px solid rgba(200,164,90,.12);margin-bottom:.15rem;
}
.hz-oil-title{font-family:var(--fd);font-size:.65rem;letter-spacing:3px;color:var(--gold);margin-bottom:.5rem;display:flex;align-items:center;gap:.3rem}
.hz-oil-cards{display:flex;flex-direction:column;gap:.35rem}
.hz-oil-card{
  display:flex;align-items:center;justify-content:space-between;
  padding:.42rem .6rem;border-radius:3px;
  background:rgba(0,0,0,.2);border:1px solid rgba(200,164,90,.08);transition:all .3s;
}
.hz-oil-card:hover{border-color:rgba(200,164,90,.2);background:rgba(200,164,90,.03)}
.hz-oil-card-gas{border-color:rgba(91,158,196,.1)}
.hz-oil-card-gas:hover{border-color:rgba(91,158,196,.2);background:rgba(91,158,196,.03)}
.hz-oil-label{font-family:var(--fm);font-size:.6rem;color:var(--txt3);letter-spacing:.5px;min-width:75px}
.hz-oil-price{font-family:var(--fd);font-size:1rem;font-weight:700;color:var(--gold);text-shadow:0 0 6px rgba(200,164,90,.2)}
.hz-oil-card-gas .hz-oil-price{color:#5b9ec4;text-shadow:0 0 6px rgba(91,158,196,.2)}
.hz-oil-change{font-family:var(--fm);font-size:.65rem;font-weight:600;padding:.1rem .35rem;border-radius:2px;min-width:52px;text-align:center}
.hz-oil-change.up{color:var(--red);background:rgba(196,60,60,.08)}
.hz-oil-change.down{color:var(--green);background:rgba(106,154,74,.08)}
.hz-oil-change.flat{color:var(--txt3);background:rgba(255,255,255,.03)}
.hz-oil-update{font-size:.52rem;color:var(--txt3);text-align:right;margin-top:.3rem;font-family:var(--fm)}
@keyframes oilFlash{0%{opacity:1}50%{opacity:.5}100%{opacity:1}}
.hz-oil-flash{animation:oilFlash .6s ease}

/* Stat cards */
.hz-stat-card{
  display:flex;align-items:center;gap:.6rem;
  padding:.55rem .65rem;border-radius:4px;
  background:var(--glass);border:1px solid var(--border);transition:all .3s;
}
.hz-stat-card:hover{border-color:var(--border2);background:rgba(200,164,90,.02)}
.hz-stat-danger{border-color:rgba(196,60,60,.1);background:rgba(196,60,60,.02)}
.hz-stat-danger:hover{border-color:rgba(196,60,60,.2)}
.hz-stat-icon{font-size:1.3rem}
.hz-stat-num{font-family:var(--fd);font-size:1.15rem;font-weight:700;color:var(--gold)}
.hz-stat-danger .hz-stat-num{color:var(--red)}
.hz-stat-desc{font-size:.7rem;color:var(--txt3);font-family:var(--fb);letter-spacing:1px}

/* Tracker */
.hz-tracker{padding:.55rem;border-radius:4px;background:var(--glass);border:1px solid var(--border)}
.hz-tracker-title{font-family:var(--fd);font-size:.6rem;color:var(--txt2);letter-spacing:2px;margin-bottom:.4rem}
.hz-track-input{width:100%;padding:.32rem .5rem;background:var(--bg);border:1px solid var(--border);border-radius:2px;color:var(--txt);font-family:var(--fm);font-size:.72rem;margin-bottom:.3rem;outline:none}
.hz-track-input:focus{border-color:var(--gold);box-shadow:0 0 6px rgba(200,164,90,.08)}
.hz-track-btn{width:100%;padding:.32rem;background:rgba(200,164,90,.06);border:1px solid rgba(200,164,90,.15);border-radius:2px;color:var(--gold);font-family:var(--fd);font-size:.6rem;letter-spacing:2px;cursor:pointer;transition:all .3s}
.hz-track-btn:hover{background:rgba(200,164,90,.1)}
.hz-track-status{font-size:.62rem;color:var(--txt3);margin-top:.3rem;font-family:var(--fm)}

/* Legend */
.hz-legend{padding:.45rem .55rem;border-radius:4px;background:rgba(200,164,90,.02);border:1px solid var(--border)}
.hz-legend-title{font-family:var(--fd);font-size:.55rem;color:var(--txt3);letter-spacing:2px;margin-bottom:.3rem}
.hz-legend-row{display:flex;align-items:center;gap:.4rem;font-size:.62rem;color:var(--txt2);padding:.1rem 0}
.hz-ldot{width:7px;height:7px;border-radius:50%;flex-shrink:0;box-shadow:0 0 3px currentColor}

/* ═══ AI INTEL PANEL — Claude Opus 4.6 ═══ */
.hz-ai-intel{
  padding:.6rem;border-radius:4px;
  background:linear-gradient(135deg,rgba(200,164,90,.03),rgba(144,112,176,.03));
  border:1px solid rgba(144,112,176,.15);
  position:relative;overflow:hidden;
}
.hz-ai-intel::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--claude),var(--quewi),transparent);
  opacity:.6;
}
.hz-ai-intel-header{
  display:flex;align-items:center;justify-content:space-between;gap:.4rem;margin-bottom:.35rem;
}
.hz-ai-intel-title{
  font-family:var(--fd);font-size:.62rem;color:var(--claude);letter-spacing:2px;
  display:flex;align-items:center;gap:.3rem;
}
.hz-ai-brain{font-size:.85rem}
.hz-ai-intel-badges{display:flex;align-items:center;gap:.35rem}
.hz-intel-badge{
  font-family:var(--fm);font-size:.55rem;padding:.15rem .4rem;border-radius:2px;
  display:inline-flex;align-items:center;gap:.2rem;
}
.hz-intel-loading-state{color:var(--claude);background:rgba(200,155,106,.06);border:1px solid rgba(200,155,106,.15)}
.hz-intel-error-state{color:var(--red);background:rgba(196,60,60,.06);border:1px solid rgba(196,60,60,.15)}
.hz-intel-ready-state{color:var(--green);background:rgba(106,154,74,.06);border:1px solid rgba(106,154,74,.15)}
.hz-intel-loading{animation:pulse 1.5s infinite}
.hz-intel-threat-badge{
  font-family:var(--fd);font-size:.55rem;font-weight:700;letter-spacing:2px;
  padding:.15rem .45rem;border-radius:2px;border:1px solid var(--orange);color:var(--orange);
}
.hz-intel-threat-sm{font-family:var(--fd);font-size:.5rem;letter-spacing:1px;font-weight:700}
.hz-ai-intel-subtitle{
  font-family:var(--fc);font-size:.58rem;color:var(--txt3);margin-bottom:.4rem;
  display:flex;align-items:center;gap:.25rem;letter-spacing:.5px;
}
.hz-ai-q{
  display:inline-flex;align-items:center;justify-content:center;
  width:14px;height:14px;background:var(--quewi);color:#fff;
  font-family:var(--fd);font-size:.55rem;font-weight:700;border-radius:2px;flex-shrink:0;
}
.hz-ai-intel-summary{
  font-family:var(--fc);font-size:.72rem;color:var(--txt);
  line-height:1.6;padding:.4rem .5rem;
  background:rgba(200,164,90,.02);border-left:2px solid var(--claude);
  border-radius:0 3px 3px 0;margin-bottom:.4rem;
}
.hz-ai-intel-events{
  display:flex;flex-direction:column;gap:.3rem;
  max-height:200px;overflow-y:auto;margin-bottom:.4rem;
  scrollbar-width:thin;scrollbar-color:var(--border2) transparent;
}
.hz-intel-event{
  padding:.35rem .45rem;border-radius:3px;cursor:pointer;
  background:rgba(16,22,32,.5);border:1px solid var(--border);transition:all .3s;
}
.hz-intel-event:hover{background:rgba(200,164,90,.04);border-color:var(--border2)}
.hz-ie-head{display:flex;align-items:center;gap:.3rem;margin-bottom:.15rem}
.hz-ie-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:50%;font-family:var(--fd);
  font-size:.5rem;color:#fff;font-weight:700;flex-shrink:0;
}
.hz-ie-icon{font-size:.72rem}
.hz-ie-title{font-family:var(--fb);font-size:.68rem;font-weight:600;color:var(--txt)}
.hz-ie-detail{font-size:.6rem;color:var(--txt2);line-height:1.55;font-family:var(--fc)}
.hz-ie-meta{font-size:.5rem;color:var(--txt3);font-family:var(--fm);margin-top:.15rem}
.hz-ai-intel-ship{
  font-size:.62rem;color:var(--txt2);font-family:var(--fc);
  padding:.3rem .4rem;background:rgba(91,158,196,.03);
  border:1px solid rgba(91,158,196,.08);border-radius:3px;margin-bottom:.3rem;
}
.hz-ai-intel-footer{
  display:flex;align-items:center;justify-content:space-between;gap:.3rem;
}
.hz-intel-ts{font-size:.5rem;color:var(--txt3);font-family:var(--fm)}
.hz-intel-refresh-btn{
  font-family:var(--fd);font-size:.5rem;padding:.2rem .5rem;
  background:rgba(200,155,106,.06);border:1px solid rgba(200,155,106,.15);
  color:var(--claude);border-radius:2px;cursor:pointer;letter-spacing:1px;transition:all .3s;
}
.hz-intel-refresh-btn:hover{background:rgba(200,155,106,.12);border-color:var(--claude)}

/* ═══ INTEL MAP MARKERS ═══ */
.intel-marker-div{background:transparent!important;border:none!important}
.intel-marker-wrap{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center}
.intel-ring{
  position:absolute;inset:2px;border-radius:50%;border:2px solid;
  opacity:.7;
}
.intel-marker-pulse .intel-ring{animation:intelPulseRing 2s infinite}
@keyframes intelPulseRing{
  0%{transform:scale(1);opacity:.7}
  50%{transform:scale(1.5);opacity:.2}
  100%{transform:scale(1);opacity:.7}
}
.intel-icon{
  width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:.7rem;z-index:2;position:relative;
}
.intel-idx{
  position:absolute;top:-2px;right:-2px;
  width:14px;height:14px;border-radius:50%;
  background:var(--bg);border:1px solid rgba(200,164,90,.3);
  font-family:var(--fd);font-size:.45rem;color:var(--gold);
  display:flex;align-items:center;justify-content:center;
  z-index:3;
}
.intel-popup-container .leaflet-popup-content-wrapper{
  background:rgba(16,22,32,.95)!important;
  border:1px solid rgba(144,112,176,.2)!important;
}
.intel-popup{font-family:var(--fb);font-size:.75rem;min-width:200px}
.intel-popup-header{
  display:flex;align-items:center;gap:.4rem;padding:.3rem .4rem;
  margin-bottom:.3rem;background:rgba(200,164,90,.03);border-radius:2px;
}
.intel-popup-icon{font-size:1rem}
.intel-popup-title{font-weight:600;color:var(--txt);flex:1}
.intel-popup-sev{font-family:var(--fd);font-size:.55rem;letter-spacing:1px}
.intel-popup-body{font-size:.7rem;color:var(--txt2);line-height:1.6;padding:.2rem 0;font-family:var(--fc)}
.intel-popup-meta{
  display:flex;gap:.6rem;font-size:.58rem;color:var(--txt3);
  font-family:var(--fm);padding:.2rem 0;border-top:1px solid var(--border);margin-top:.2rem;
}
.intel-popup-coords{font-family:var(--fm);font-size:.52rem;color:var(--txt3);margin-top:.15rem}

/* Intel popup social buttons */
.intel-popup-social{
  display:flex;gap:.35rem;margin-top:.35rem;padding-top:.35rem;
  border-top:1px solid rgba(255,255,255,.08);
}
.ips-btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:.25rem;
  padding:.3rem .4rem;border:1px solid rgba(255,255,255,.1);border-radius:4px;
  background:rgba(255,255,255,.03);color:var(--txt2);font-size:.62rem;
  cursor:pointer;transition:all .2s;font-family:var(--fm);
}
.ips-btn:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.ips-like.ips-liked{color:#ff4757;border-color:rgba(255,71,87,.3);background:rgba(255,71,87,.08)}
.ips-share:hover{color:#00ff88;border-color:rgba(0,255,136,.3)}
.ips-count{font-size:.55rem;opacity:.7}

/* ═══ MIDDLE EAST FLIGHTS PANEL ═══ */
.hz-flights-panel{
  padding:.5rem .6rem;border-radius:6px;
  background:linear-gradient(135deg,rgba(74,144,217,.04),rgba(74,144,217,.01));
  border:1px solid rgba(74,144,217,.15);
  margin-top:.3rem;
}
.hz-flights-header{display:flex;justify-content:space-between;align-items:center;gap:.4rem;margin-bottom:.25rem}
.hz-flights-title{display:flex;align-items:center;gap:.35rem;font-family:var(--fd);font-size:.72rem;font-weight:700;color:#4a90d9;letter-spacing:1px}
.hz-flights-icon{font-size:1rem}
.hz-flights-badges{display:flex;align-items:center;gap:.3rem}
.hz-flight-badge{
  font-family:var(--fd);font-size:.52rem;letter-spacing:1px;
  padding:.1rem .4rem;border-radius:3px;white-space:nowrap;
}
.hz-flight-loading-state{color:#ffab00;background:rgba(255,171,0,.08);border:1px solid rgba(255,171,0,.2)}
.hz-flight-loading{animation:blink 1.2s ease infinite}
.hz-flight-error-state{color:#ff4444;background:rgba(255,68,68,.08);border:1px solid rgba(255,68,68,.2)}
.hz-flight-ready-state{color:#00e676;background:rgba(0,230,118,.06);border:1px solid rgba(0,230,118,.15)}
.hz-flight-ok{font-weight:700}
.hz-flight-cnt{color:var(--txt2);margin-left:.2rem}
.hz-flight-count-badge{
  font-family:var(--fd);font-size:.58rem;font-weight:700;
  color:#4a90d9;background:rgba(74,144,217,.1);
  padding:.1rem .35rem;border-radius:3px;border:1px solid rgba(74,144,217,.2);
}
.hz-flights-subtitle{
  font-size:.58rem;color:var(--txt3);font-family:var(--fm);
  display:flex;align-items:center;gap:.3rem;margin-bottom:.3rem;
}
.hz-flights-ae{
  display:inline-block;font-family:var(--fd);font-size:.5rem;font-weight:700;
  color:#4a90d9;background:rgba(74,144,217,.12);
  padding:.05rem .25rem;border-radius:2px;letter-spacing:1px;margin-right:.15rem;
}
.hz-flights-stats{
  display:flex;gap:.5rem;align-items:flex-start;padding:.25rem 0;
  border-top:1px solid rgba(74,144,217,.1);border-bottom:1px solid rgba(74,144,217,.1);
  margin-bottom:.25rem;
}
.hz-fs-item{display:flex;flex-direction:column;gap:.1rem;flex:1}
.hz-fs-label{font-family:var(--fd);font-size:.5rem;color:var(--txt3);letter-spacing:1px}
.hz-fs-val{font-family:var(--fm);font-size:.65rem;color:var(--txt)}
.hz-fs-airlines{display:flex;flex-wrap:wrap;gap:.2rem}
.hz-fa-tag{
  font-family:var(--fd);font-size:.48rem;font-weight:600;
  color:#4a90d9;background:rgba(74,144,217,.06);
  padding:.05rem .2rem;border-radius:2px;border:1px solid rgba(74,144,217,.12);
  white-space:nowrap;
}
.hz-fa-tag b{color:var(--txt)}
.hz-flights-list{
  max-height:220px;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:rgba(74,144,217,.2) transparent;
}
.hz-flight-item{
  padding:.25rem .3rem;border-radius:4px;cursor:pointer;
  border-bottom:1px solid rgba(74,144,217,.06);
  transition:background .2s;
}
.hz-flight-item:hover{background:rgba(74,144,217,.08)}
.hz-fi-head{display:flex;align-items:center;gap:.3rem}
.hz-fi-flag{font-size:.7rem}
.hz-fi-fn{font-family:var(--fd);font-size:.62rem;font-weight:700;letter-spacing:1px}
.hz-fi-route{font-family:var(--fm);font-size:.55rem;color:var(--txt3);margin-left:auto}
.hz-fi-meta{
  display:flex;gap:.5rem;font-size:.52rem;color:var(--txt3);
  font-family:var(--fm);padding-left:1.2rem;
}
.hz-flights-footer{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:.25rem;border-top:1px solid rgba(74,144,217,.1);margin-top:.25rem;
}
.hz-flight-ts{font-family:var(--fm);font-size:.52rem;color:var(--txt3)}
.hz-flights-refresh-btn{
  font-family:var(--fd);font-size:.52rem;font-weight:700;
  letter-spacing:1px;color:#4a90d9;background:rgba(74,144,217,.08);
  border:1px solid rgba(74,144,217,.2);border-radius:3px;
  padding:.15rem .4rem;cursor:pointer;transition:all .2s;
}
.hz-flights-refresh-btn:hover{background:rgba(74,144,217,.2);color:#fff}

/* ═══ FLIGHT MAP MARKERS ═══ */
.flight-marker-div{background:none!important;border:none!important}
.flight-marker-wrap{
  position:relative;display:flex;flex-direction:column;align-items:center;
  pointer-events:auto;cursor:pointer;
}
.flight-plane-icon{
  line-height:1;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.6));
}
.flight-label{
  font-family:var(--fd);font-size:.42rem;font-weight:700;
  letter-spacing:.5px;white-space:nowrap;
  text-shadow:0 1px 3px rgba(0,0,0,.8);
  margin-top:-2px;
}
.flight-contrail{
  position:absolute;height:2px;border-radius:1px;
  top:50%;left:50%;transform-origin:center left;
  pointer-events:none;
}
.flight-iran .flight-plane-icon svg path{
  stroke:rgba(255,50,50,.8)!important;stroke-width:1!important;
}
.flight-airport-icon{
  display:flex;flex-direction:column;align-items:center;pointer-events:none;
}
.fa-dot{
  width:5px;height:5px;border-radius:50%;
  background:rgba(74,144,217,.6);
  box-shadow:0 0 6px rgba(74,144,217,.4);
}
.fa-code{
  font-family:var(--fd);font-size:.4rem;font-weight:700;
  color:rgba(74,144,217,.5);letter-spacing:.5px;
  text-shadow:0 1px 2px rgba(0,0,0,.8);
}

/* Flight popup */
.flight-popup-container .leaflet-popup-content-wrapper{
  background:rgba(8,9,13,.94)!important;border:1px solid rgba(74,144,217,.25)!important;
  border-radius:6px!important;box-shadow:0 4px 20px rgba(0,0,0,.6)!important;
  backdrop-filter:blur(12px);
}
.flight-popup-container .leaflet-popup-tip{background:rgba(8,9,13,.94)!important;border-color:rgba(74,144,217,.25)!important}
.flight-popup{font-family:var(--fb);font-size:.75rem;min-width:220px}
.flight-popup-header{
  display:flex;align-items:center;gap:.4rem;padding:.3rem .4rem;
  background:rgba(74,144,217,.06);border-radius:4px 4px 0 0;
  margin:-.3rem -.3rem .3rem -.3rem;
}
.flight-popup-flag{font-size:1.1rem}
.flight-popup-fn{font-family:var(--fd);font-size:.85rem;font-weight:700;letter-spacing:1px}
.flight-popup-airline{font-size:.65rem;color:var(--txt2);margin-left:auto;font-family:var(--fc)}
.flight-popup-route{
  display:flex;align-items:center;justify-content:center;gap:.4rem;
  padding:.25rem 0;font-family:var(--fd);font-size:.7rem;color:var(--txt);
  letter-spacing:1px;
}
.flight-popup-arrow{color:#4a90d9;font-size:.65rem}
.flight-popup-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:.15rem .5rem;
  padding:.2rem 0;border-top:1px solid var(--border);
}
.fpg-item{display:flex;flex-direction:column}
.fpg-label{font-family:var(--fd);font-size:.48rem;color:var(--txt3);letter-spacing:1px}
.fpg-val{font-family:var(--fm);font-size:.62rem;color:var(--txt)}

/* ═══ MILITARY FLIGHT MARKERS — 军事飞行器标记 ═══ */
.mil-flight-marker-div{background:transparent!important;border:none!important}
.mil-flight-marker-wrap{
  position:relative;display:flex;flex-direction:column;align-items:center;
  animation:milFlightPulse 2s ease-in-out infinite;
}
@keyframes milFlightPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.3)}}
.mil-flight-plane-icon{position:relative;z-index:2}
.mil-flight-label{
  font-family:var(--fd);font-size:.5rem;font-weight:700;letter-spacing:1.5px;
  white-space:nowrap;margin-top:-2px;z-index:1;
}
.mil-threat-ring{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:42px;height:42px;border-radius:50%;border:1.5px solid;
  animation:milThreatPulse 1.5s ease-in-out infinite;z-index:0;
}
@keyframes milThreatPulse{
  0%{opacity:.8;transform:translate(-50%,-50%) scale(1)}
  50%{opacity:.3;transform:translate(-50%,-50%) scale(1.6)}
  100%{opacity:.8;transform:translate(-50%,-50%) scale(1)}
}
.mil-flight-popup-container .leaflet-popup-content-wrapper{
  background:rgba(15,5,5,.95)!important;border:1px solid rgba(255,34,34,.35)!important;
  box-shadow:0 0 20px rgba(255,0,0,.15);border-radius:6px!important;
}
.mil-flight-popup-container .leaflet-popup-tip{background:rgba(15,5,5,.95)!important;border-color:rgba(255,34,34,.25)!important}
.mil-flight-popup{font-family:var(--fb);font-size:.75rem;min-width:220px}
.mfp-header{
  display:flex;align-items:center;gap:.5rem;padding:.4rem .5rem;
  background:rgba(255,34,34,.08);border-radius:4px;margin-bottom:.4rem;
}
.mfp-icon{font-size:1rem}
.mfp-callsign{font-family:var(--fd);font-size:.85rem;font-weight:700;letter-spacing:1px}
.mfp-class{font-size:.6rem;color:var(--txt2);margin-left:auto;font-family:var(--fc);opacity:.8}
.mfp-grid{display:grid;grid-template-columns:1fr 1fr;gap:.15rem .5rem;padding:.3rem .5rem}
.mfp-item{display:flex;justify-content:space-between;align-items:center;padding:.1rem 0;border-bottom:1px solid rgba(255,255,255,.04)}
.mfp-label{font-family:var(--fc);font-size:.55rem;color:var(--txt2);text-transform:uppercase;letter-spacing:.5px}
.mfp-val{font-family:var(--fm);font-size:.62rem;color:var(--txt)}

/* ═══ COLLAPSIBLE SIDEBAR SECTIONS — 折叠面板系统 ═══ */
.hz-sec{position:relative;transition:all .3s}
.hz-sec-hdr{
  display:flex;align-items:center;gap:.3rem;
  padding:.35rem .45rem;cursor:pointer;user-select:none;
  transition:background .2s;font-family:var(--fd);
  font-size:.58rem;letter-spacing:1.5px;font-weight:600;
  border-radius:3px;margin-bottom:.2rem;
}
.hz-sec-hdr:hover{background:rgba(255,255,255,.035)}
.hz-sec-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:3px;
  font-family:var(--fd);font-size:.48rem;font-weight:800;
  letter-spacing:0;flex-shrink:0;
}
.hz-sec-tag{font-family:var(--fm);font-size:.42rem;letter-spacing:1.5px;color:var(--txt3);margin-left:auto;opacity:.5}
.hz-sec-arr{font-size:.55rem;color:var(--txt3);transition:transform .3s ease;margin-left:.15rem;width:10px;text-align:center}
.hz-sec.collapsed .hz-sec-arr{transform:rotate(-90deg)}
.hz-sec-body{max-height:800px;overflow:hidden;transition:max-height .4s ease,opacity .3s ease;opacity:1}
.hz-sec.collapsed .hz-sec-body{max-height:0!important;opacity:0;overflow:hidden}

/* Section accent colors */
.hz-sec.acc-sat{border-left:3px solid #4a9ec8}
.hz-sec.acc-sat .hz-sec-num{background:rgba(74,158,200,.15);color:#4a9ec8}
.hz-sec.acc-sat .hz-sec-hdr{color:#4a9ec8}
.hz-sec.acc-oil{border-left:3px solid var(--gold)}
.hz-sec.acc-oil .hz-sec-num{background:rgba(200,164,90,.15);color:var(--gold)}
.hz-sec.acc-oil .hz-sec-hdr{color:var(--gold)}
.hz-sec.acc-stats{border-left:3px solid #6a9a4a;border-radius:6px;padding:.35rem;background:var(--glass);border:1px solid var(--border)}
.hz-sec.acc-stats .hz-sec-num{background:rgba(106,154,74,.15);color:#6a9a4a}
.hz-sec.acc-stats .hz-sec-hdr{color:#6a9a4a}
.hz-sec.acc-track{border-left:3px solid #5b9ec4}
.hz-sec.acc-track .hz-sec-num{background:rgba(91,158,196,.15);color:#5b9ec4}
.hz-sec.acc-track .hz-sec-hdr{color:#5b9ec4}
.hz-sec.acc-intel{border-left:3px solid var(--claude)}
.hz-sec.acc-intel .hz-sec-num{background:rgba(200,155,106,.15);color:var(--claude)}
.hz-sec.acc-flight{border-left:3px solid #4a90d9}
.hz-sec.acc-flight .hz-sec-num{background:rgba(74,144,217,.15);color:#4a90d9}
.hz-sec.acc-legend{border-left:3px solid rgba(107,104,96,.4)}
.hz-sec.acc-legend .hz-sec-num{background:rgba(107,104,96,.15);color:var(--txt3)}
.hz-sec.acc-legend .hz-sec-hdr{color:var(--txt3)}

/* Stat cards 2x2 grid */
.hz-stat-grid-2x2{display:grid;grid-template-columns:1fr 1fr;gap:.3rem}

/* Toggle all button */
.hz-toggle-all{text-align:right;margin-bottom:.15rem}
.hz-toggle-all-btn{font-family:var(--fd);font-size:.48rem;letter-spacing:1px;color:var(--txt3);background:none;border:1px solid var(--border);padding:.15rem .4rem;border-radius:2px;cursor:pointer;transition:all .2s}
.hz-toggle-all-btn:hover{color:var(--gold);border-color:var(--gold)}

/* Right panel section number badges */
.sec-num-badge{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-family:var(--fd);font-size:.52rem;font-weight:800;margin-right:.35rem;flex-shrink:0;letter-spacing:0}
.snb-red{background:rgba(196,60,60,.1);color:var(--red);border:1px solid rgba(196,60,60,.2)}
.snb-gold{background:rgba(200,164,90,.1);color:var(--gold);border:1px solid rgba(200,164,90,.2)}
.snb-blue{background:rgba(74,127,181,.1);color:var(--force-blue);border:1px solid rgba(74,127,181,.2)}
.snb-green{background:rgba(106,154,74,.1);color:var(--green);border:1px solid rgba(106,154,74,.2)}
.snb-purple{background:rgba(144,112,176,.1);color:var(--quewi);border:1px solid rgba(144,112,176,.2)}

/* Enhanced right panel section headers — 提高識別度 */
.risk-ov-title{font-size:.88rem!important;background:linear-gradient(90deg,rgba(196,60,60,.05),transparent)!important;padding:.55rem .7rem!important;margin:0 -.5rem .7rem -.5rem;border-radius:4px}
.div-banner-title{font-size:.88rem!important;background:linear-gradient(90deg,rgba(196,60,60,.05),transparent)!important;padding:.55rem .7rem!important;margin:0 -.5rem .7rem -.5rem;border-radius:4px}
.dash-title{font-size:1rem!important;background:linear-gradient(90deg,rgba(200,164,90,.05),transparent)!important;padding:.55rem .7rem!important;border-radius:4px}
.timeline-title{font-size:.88rem!important;background:linear-gradient(90deg,rgba(74,127,181,.05),transparent)!important;padding:.55rem .7rem!important;margin:0 -.5rem .7rem -.5rem;border-radius:4px}
.ct-title{font-size:.85rem!important;background:linear-gradient(90deg,rgba(200,164,90,.04),transparent)!important;padding:.55rem .7rem!important;margin:0 -.5rem .7rem -.5rem;border-radius:4px}
.cons-title{font-size:.82rem!important;background:linear-gradient(90deg,rgba(106,154,74,.05),transparent)!important;padding:.55rem .7rem!important;margin:0 -.5rem .7rem -.5rem;border-radius:4px}

/* Hormuz responsive */
@media(max-width:900px){
  .hormuz-body{grid-template-columns:1fr;min-height:auto}
  .hormuz-map{min-height:320px}
  .hormuz-stats{flex-direction:row;flex-wrap:wrap;border-left:none;border-top:1px solid var(--border);padding:.5rem}
  .hz-stat-card{flex:1;min-width:140px}
  .hz-sat-section{flex:1 1 100%}
  .hz-oil-section{flex:1 1 100%}
  .hz-oil-cards{flex-direction:row;flex-wrap:wrap}
  .hz-oil-card{flex:1;min-width:140px}
  .hz-tracker{flex:1 1 100%}
  .hz-legend{flex:1 1 100%}
  .hz-ai-intel{flex:1 1 100%}
  .hz-ai-intel-events{max-height:150px}
  .hz-flights-panel{flex:1 1 100%}
  .hz-flights-list{max-height:120px}
  .hz-legend-row{display:inline-flex;margin-right:.8rem}
}
@media(max-width:600px){
  .hormuz-header{flex-direction:column;align-items:flex-start;gap:.4rem;padding:.5rem .7rem}
  .hz-zoom-btns{flex-wrap:wrap;gap:.2rem}
  .hz-map-stats{flex-wrap:wrap}
  .hz-mstat{min-width:50%}
  .hormuz-stats{padding:.35rem}
  .hz-stat-card{min-width:calc(50% - .25rem)}
  .hz-oil-cards{flex-direction:column}
  .hz-oil-card{min-width:100%}
}

/* SAR scan overlay */
.hormuz-map-wrap::after{
  content:'';position:absolute;inset:0;z-index:500;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(8,9,13,.1) 0%,transparent 30%,transparent 70%,rgba(8,9,13,.15) 100%),
    repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(200,164,90,.006) 3px,rgba(200,164,90,.006) 4px);
  mix-blend-mode:multiply;
}

/* Remove old scanline overlay on warroom */
.warroom::before{display:none}

/* Lane pulse */
@keyframes lanePulse{0%{stroke-dashoffset:0}100%{stroke-dashoffset:40}}
.lane-pulse{animation:lanePulse 2s linear infinite}

/* ═══ SOURCE BADGES ═══ */
.src-badge{
  display:inline-flex;align-items:center;gap:.25rem;
  font-family:var(--fd);font-size:.55rem;letter-spacing:1.5px;font-weight:600;
  padding:.15rem .5rem;border-radius:2px;white-space:nowrap;
  vertical-align:middle;line-height:1.2;
}
.src-tier-wire{color:#c8a45a;background:rgba(200,164,90,.06);border:1px solid rgba(200,164,90,.15)}
.src-tier-media{color:#5b9ec4;background:rgba(91,158,196,.04);border:1px solid rgba(91,158,196,.1)}
.src-tier-regional{color:#9070b0;background:rgba(144,112,176,.04);border:1px solid rgba(144,112,176,.1)}
.src-tier-alt{color:var(--orange);background:rgba(200,120,50,.04);border:1px solid rgba(200,120,50,.1)}

/* Leaflet overrides */
.leaflet-control-layers{background:rgba(8,9,13,.92)!important;border:1px solid var(--border2)!important;border-radius:4px!important;color:var(--txt)!important;backdrop-filter:blur(8px);box-shadow:0 4px 16px rgba(0,0,0,.4)!important}
.leaflet-control-layers-toggle{background-color:rgba(8,9,13,.92)!important;border:1px solid var(--border2)!important;border-radius:4px!important;width:30px!important;height:30px!important}
.leaflet-control-layers label{color:var(--txt2)!important;font-family:var(--fm);font-size:.7rem}
.leaflet-control-layers-separator{border-top-color:var(--border2)!important}


/* ╔══════════════════════════════════════════════════════════════╗
   ║  SURVEILLANCE CAMERA MODE — 全屏监控模式                    ║
   ╚══════════════════════════════════════════════════════════════╝ */

/* ─── Fullscreen Section ─── */
.hz-surveillance {
  position: relative;
  width: 100%;
  height: calc(100vh - 70px);
  min-height: 500px;
  overflow: hidden;
  background: #000;
}

.hz-fullmap {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: #040812;
}
.hz-fullmap .leaflet-container {
  background: #040812 !important;
}
.hz-fullmap .leaflet-tile-pane {
  filter: saturate(1.15) brightness(0.88) contrast(1.08) sepia(0.06) hue-rotate(-3deg);
  background: #040812;
}
/* Premium warm military satellite tint — subtle blue-gold shift */
.hz-fullmap .leaflet-tile-pane::after {
  content:'';position:absolute;inset:0;pointer-events:none;z-index:999;
  background:linear-gradient(180deg,
    rgba(16,24,36,.15) 0%,
    rgba(200,164,90,.03) 30%,
    transparent 50%,
    rgba(61,143,160,.03) 70%,
    rgba(16,24,36,.2) 100%);
  mix-blend-mode:multiply;
}
.hz-fullmap .leaflet-control-layers {
  background: rgba(0,0,0,0.75) !important;
  border: 1px solid rgba(0,255,136,0.2) !important;
  color: #ccc !important;
  border-radius: 4px !important;
}
.hz-fullmap .leaflet-control-layers label {
  color: #ccc !important;
  font-size: 0.7rem !important;
}
.hz-fullmap .leaflet-control-zoom a {
  background: rgba(0,0,0,0.7) !important;
  color: #0f8 !important;
  border-color: rgba(0,255,136,0.15) !important;
}
/* Push Leaflet controls below REC bar */
.hz-fullmap .leaflet-top.leaflet-left {
  top: 36px !important;
}
@media(max-width:768px){
  .hz-fullmap .leaflet-top.leaflet-left { top: 32px !important; }
  .hz-fullmap .leaflet-control-zoom { display: none !important; }
}

/* ─── Scanlines ─── */
.hz-scanlines {
  position: absolute;
  inset: 0;
  z-index: 90;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0,0,0,0.06) 2px,
    rgba(0,0,0,0.06) 4px
  );
  mix-blend-mode: overlay;
}

/* ─── Vignette ─── */
.hz-vignette {
  position: absolute;
  inset: 0;
  z-index: 91;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,0.55) 100%);
}

/* ─── Corner Brackets ─── */
.hz-corner {
  position: absolute;
  width: 40px;
  height: 40px;
  z-index: 95;
  pointer-events: none;
}
.hz-corner-tl { top: 8px; left: 8px; border-top: 2px solid rgba(0,255,136,0.5); border-left: 2px solid rgba(0,255,136,0.5); }
.hz-corner-tr { top: 8px; right: 8px; border-top: 2px solid rgba(0,255,136,0.5); border-right: 2px solid rgba(0,255,136,0.5); }
.hz-corner-bl { bottom: 8px; left: 8px; border-bottom: 2px solid rgba(0,255,136,0.5); border-left: 2px solid rgba(0,255,136,0.5); }
.hz-corner-br { bottom: 8px; right: 8px; border-bottom: 2px solid rgba(0,255,136,0.5); border-right: 2px solid rgba(0,255,136,0.5); }

/* ─── Crosshair ─── */
.hz-crosshair {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 92;
  pointer-events: none;
  width: 60px; height: 60px;
}
.hz-cross-h, .hz-cross-v {
  position: absolute;
  background: rgba(0,255,136,0.18);
}
.hz-cross-h { top: 50%; left: 0; right: 0; height: 1px; }
.hz-cross-v { left: 50%; top: 0; bottom: 0; width: 1px; }
.hz-cross-circle {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 30px; height: 30px;
  border: 1px solid rgba(0,255,136,0.15);
  border-radius: 50%;
}

/* ╔══════════════════════════════════════════════╗
   ║  REC HEADER BAR                              ║
   ╚══════════════════════════════════════════════╝ */
.hz-rec-bar {
  position: absolute;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 14px;
  background: none;
  font-family: 'JetBrains Mono', monospace;
  user-select: none;
  pointer-events: none;
}
.hz-rec-bar * { pointer-events: auto; }
.hz-rec-left {
  display: flex;
  align-items: center;
  gap: 8px;
}
.hz-rec-dot {
  width: 10px; height: 10px;
  background: #ff0000;
  border-radius: 50%;
  box-shadow: 0 0 8px #ff0000, 0 0 20px rgba(255,0,0,0.4);
  animation: recBlink 1s ease-in-out infinite;
}
@keyframes recBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.2; }
}
.hz-rec-label {
  color: #ff0000;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-shadow: 0 0 10px rgba(255,0,0,0.5);
}
.hz-rec-time {
  color: #00ff88;
  font-size: 0.75rem;
  letter-spacing: 1px;
}
.hz-rec-sep {
  color: rgba(255,255,255,0.2);
  font-size: 0.7rem;
}
.hz-rec-frames {
  color: rgba(255,255,255,0.35);
  font-size: 0.6rem;
  letter-spacing: 1px;
}

.hz-rec-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.hz-rec-title {
  color: rgba(255,255,255,0.85);
  font-size: 0.78rem;
  letter-spacing: 4px;
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(200,164,90,.15), 0 1px 3px rgba(0,0,0,.6);
  font-weight: 600;
}
.hz-rec-subtitle {
  color: rgba(200,164,90,0.85);
  font-size: 0.9rem;
  letter-spacing: 5px;
  font-family: 'LXGW WenKai SC', 'Noto Serif SC', serif;
  font-weight: 700;
  text-shadow: 0 0 14px rgba(200,164,90,.2), 0 0 40px rgba(200,164,90,.06), 0 1px 2px rgba(0,0,0,.6);
  background: linear-gradient(90deg, rgba(200,164,90,.0), rgba(200,164,90,.08), rgba(200,164,90,.0));
  padding: 2px 12px;
  border-radius: 3px;
  animation: subtitleGlow 4s ease-in-out infinite;
}
@keyframes subtitleGlow {
  0%,100% { text-shadow: 0 0 14px rgba(200,164,90,.15), 0 1px 2px rgba(0,0,0,.6); opacity: .85; }
  50% { text-shadow: 0 0 20px rgba(200,164,90,.3), 0 0 50px rgba(200,164,90,.08), 0 1px 2px rgba(0,0,0,.6); opacity: 1; }
}

.hz-rec-right {
  display: flex;
  align-items: center;
  gap: 6px;
}
.hz-cam-btn {
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(0,255,136,0.2);
  color: #0f8;
  padding: 3px 10px;
  font-size: 0.65rem;
  border-radius: 3px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.2s;
}
.hz-cam-btn:hover {
  background: rgba(0,255,136,0.1);
  border-color: rgba(0,255,136,0.5);
  text-shadow: 0 0 6px rgba(0,255,136,0.5);
}
/* QueWi战情转发 button — eye-catching with glow pulse */
.hz-quewi-fwd{
  background:linear-gradient(135deg,rgba(0,210,190,.15),rgba(144,112,226,.18))!important;
  border:1px solid rgba(0,210,190,.3)!important;
  color:#0ff!important;font-size:.7rem!important;padding:6px 18px;border-radius:999px;
  cursor:pointer;font-family:inherit;transition:all .35s ease;letter-spacing:1px;
  text-shadow:0 0 6px rgba(0,255,220,.25);
  box-shadow:0 2px 12px rgba(0,210,190,.12),inset 0 1px 6px rgba(0,210,190,.04);
  animation:quewiFwdPulse 2.8s ease-in-out infinite;
}
.hz-quewi-fwd:hover{
  background:linear-gradient(135deg,rgba(0,210,190,.28),rgba(144,112,226,.32))!important;
  border-color:rgba(0,255,220,.5)!important;
  text-shadow:0 0 10px rgba(0,255,220,.45);
  box-shadow:0 4px 20px rgba(0,210,190,.25),inset 0 1px 8px rgba(0,210,190,.08);
  color:#fff!important;transform:translateY(-1px) scale(1.02);
}
@keyframes quewiFwdPulse{
  0%,100%{box-shadow:0 2px 12px rgba(0,210,190,.1),inset 0 1px 6px rgba(0,210,190,.03)}
  50%{box-shadow:0 4px 22px rgba(0,210,190,.22),inset 0 1px 10px rgba(0,210,190,.06)}
}
/* Per-event forward icon */
.hz-ie-fwd{
  margin-left:auto;cursor:pointer;font-size:.7rem;opacity:.5;transition:all .2s;
  flex-shrink:0;padding:1px 4px;border-radius:3px;
}
.hz-ie-fwd:hover{opacity:1;background:rgba(144,112,176,.15);text-shadow:0 0 6px rgba(144,112,176,.3)}

/* ╔══════════════════════════════════════════════╗
   ║  GLASS PANELS (Semi-transparent overlays)    ║
   ╚══════════════════════════════════════════════╝ */
.hz-glass {
  background: rgba(0, 5, 12, 0.72);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(0, 255, 136, 0.12);
  border-radius: 6px;
  padding: 10px 12px;
  margin-bottom: 8px;
  color: #dde;
  font-family: 'JetBrains Mono', 'Rajdhani', monospace;
  font-size: 0.7rem;
  box-shadow: 0 4px 20px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.03);
}
.hz-glass-compact {
  padding: 7px 10px;
}
.hz-glass-hdr {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #00ff88;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 8px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(0,255,136,0.08);
}
.hz-glass-icon {
  font-size: 0.75rem;
}
.hz-glass-tag {
  margin-left: auto;
  background: rgba(255,0,0,0.2);
  color: #ff4444;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 0.5rem;
  letter-spacing: 1px;
  animation: recBlink 2s ease-in-out infinite;
}
.hz-glass-foot {
  color: rgba(255,255,255,0.3);
  font-size: 0.6rem;
  margin-top: 6px;
  padding-top: 4px;
  border-top: 1px solid rgba(255,255,255,0.05);
}

/* ─── Overlay positioning ─── */
.hz-overlay-left {
  position: absolute;
  top: 52px;
  left: 12px;
  z-index: 100;
  width: 240px;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
  scrollbar-width: none;
}
.hz-overlay-left::-webkit-scrollbar { display: none; }

.hz-overlay-right {
  position: absolute;
  top: 52px;
  right: 12px;
  z-index: 100;
  width: 320px;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
  scrollbar-width: none;
}
.hz-overlay-right::-webkit-scrollbar { display: none; }

.hz-overlay-bottom {
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
}

/* ╔══════════════════════════════════════════════╗
   ║  OIL PRICE GRID                              ║
   ╚══════════════════════════════════════════════╝ */
.hz-oil-grid {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hz-oil-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 6px;
  background: rgba(255,255,255,0.02);
  border-radius: 3px;
  border-left: 2px solid rgba(0,255,136,0.2);
}
.hz-oil-name {
  color: rgba(255,255,255,0.5);
  font-size: 0.55rem;
  letter-spacing: 1.5px;
  min-width: 50px;
}
.hz-oil-val {
  color: #ffd700;
  font-size: 0.85rem;
  font-weight: 700;
  font-family: 'Orbitron', monospace;
  text-shadow: 0 0 8px rgba(255,215,0,0.3);
}
.hz-oil-chg {
  font-size: 0.6rem;
  min-width: 65px;
  text-align: right;
}
.hz-oil-chg.up, .hz-oil-change.up { color: #ff4444; }
.hz-oil-chg.down, .hz-oil-change.down { color: #00e676; }
.hz-oil-chg.flat { color: #888; }

/* Oil flash animation */
@keyframes oilFlash {
  0% { text-shadow: 0 0 8px rgba(255,215,0,0.3); }
  50% { text-shadow: 0 0 20px rgba(255,215,0,0.8); }
  100% { text-shadow: 0 0 8px rgba(255,215,0,0.3); }
}
.hz-oil-flash { animation: oilFlash 0.5s ease-out; }

/* ╔══════════════════════════════════════════════╗
   ║  MARITIME STATUS GRID                        ║
   ╚══════════════════════════════════════════════╝ */
.hz-status-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 6px;
}
.hz-sg {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6px 4px;
  background: rgba(255,255,255,0.02);
  border-radius: 4px;
  border: 1px solid rgba(0,255,136,0.05);
}
.hz-sg-num {
  color: #00e5ff;
  font-size: 1.1rem;
  font-weight: 700;
  font-family: 'Orbitron', monospace;
  line-height: 1;
  text-shadow: 0 0 10px rgba(0,229,255,0.3);
}
.hz-sg-lbl {
  color: rgba(255,255,255,0.45);
  font-size: 0.6rem;
  margin-top: 3px;
  letter-spacing: 0.5px;
}
.hz-status-bar {
  display: flex;
  justify-content: space-between;
  font-size: 0.6rem;
  color: rgba(255,255,255,0.35);
  padding: 4px 2px 0;
  border-top: 1px solid rgba(255,255,255,0.05);
}
.hz-status-bar b {
  color: #00e5ff;
  font-weight: 600;
}
.hz-bar-warn b { color: #ff6d00; }
.hz-bar-purple b { color: #e040fb; }

/* ─── Satellite mini ─── */
.hz-sat-info {
  color: rgba(255,255,255,0.4);
  font-size: 0.65rem;
  letter-spacing: 0.5px;
}

/* ╔══════════════════════════════════════════════╗
   ║  FLIGHTS MINI PANEL                          ║
   ╚══════════════════════════════════════════════╝ */
.hz-flight-mini-badge {
  margin-left: auto;
  font-size: 0.5rem;
  color: rgba(255,255,255,0.4);
}
.hz-flight-cnt {
  color: #00e5ff;
  font-size: 0.55rem;
  margin-left: 4px;
}
.hz-flights-scroll {
  max-height: 120px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0,255,136,0.2) transparent;
}
.hz-flights-scroll::-webkit-scrollbar { width: 3px; }
.hz-flights-scroll::-webkit-scrollbar-thumb { background: rgba(0,255,136,0.2); border-radius: 2px; }

/* Flight items within the mini panel */
.hz-flights-scroll .hz-fi {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 4px;
  border-bottom: 1px solid rgba(255,255,255,0.03);
  font-size: 0.55rem;
  cursor: pointer;
  transition: background 0.15s;
}
.hz-flights-scroll .hz-fi:hover {
  background: rgba(0,255,136,0.05);
}

/* ╔══════════════════════════════════════════════╗
   ║  AI INTEL PANEL (RIGHT)                      ║
   ╚══════════════════════════════════════════════╝ */
.hz-glass-intel {
  padding: 12px;
  border-color: rgba(167, 139, 250, 0.15);
}
.hz-intel-head {
  margin-bottom: 8px;
}
.hz-intel-title-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}
.hz-intel-model-name {
  color: #a78bfa;
  font-size: 1.0rem;
  font-weight: 600;
  letter-spacing: 1px;
}
.hz-intel-status-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.hz-intel-src {
  color: rgba(255,255,255,0.3);
  font-size: 0.72rem;
  letter-spacing: 0.5px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(167,139,250,0.08);
}
.hz-intel-body {
  max-height: calc(100vh - 320px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(167,139,250,0.2) transparent;
}
.hz-intel-body::-webkit-scrollbar { width: 3px; }
.hz-intel-body::-webkit-scrollbar-thumb { background: rgba(167,139,250,0.2); border-radius: 2px; }

.hz-ai-intel-summary {
  color: rgba(255,255,255,0.75);
  font-size: 0.85rem;
  line-height: 1.6;
  margin-bottom: 8px;
  padding: 8px;
  background: rgba(167,139,250,0.04);
  border-radius: 4px;
  border-left: 2px solid rgba(167,139,250,0.2);
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
}
.hz-ai-intel-events {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 6px;
}
.hz-ai-intel-ship {
  color: rgba(255,255,255,0.45);
  font-size: 0.7rem;
  padding: 5px 8px;
  background: rgba(0,255,136,0.03);
  border-radius: 3px;
  margin-bottom: 4px;
}
.hz-intel-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 6px;
  border-top: 1px solid rgba(167,139,250,0.08);
}
.hz-intel-ts {
  color: rgba(255,255,255,0.25);
  font-size: 0.5rem;
}

/* Intel event cards */
.hz-intel-ev {
  display: flex;
  gap: 8px;
  padding: 6px 8px;
  background: rgba(255,255,255,0.02);
  border-radius: 4px;
  border-left: 2px solid;
  font-size: 0.55rem;
  cursor: pointer;
  transition: background 0.15s;
}
.hz-intel-ev:hover {
  background: rgba(255,255,255,0.05);
}
.hz-intel-ev-idx {
  color: rgba(255,255,255,0.3);
  font-size: 0.5rem;
  min-width: 14px;
}
.hz-intel-ev-icon {
  font-size: 0.7rem;
}
.hz-intel-ev-body {
  flex: 1;
}
.hz-intel-ev-title {
  color: rgba(255,255,255,0.8);
  font-size: 0.55rem;
  font-weight: 500;
  margin-bottom: 2px;
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
}
.hz-intel-ev-desc {
  color: rgba(255,255,255,0.4);
  font-size: 0.48rem;
  line-height: 1.4;
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
}
.hz-intel-ev-sev {
  font-size: 0.45rem;
  padding: 1px 4px;
  border-radius: 2px;
  margin-left: auto;
  white-space: nowrap;
  align-self: flex-start;
}

/* ─── Intel Badges (reuse from before) ─── */
.hz-intel-badge {
  font-size: 0.5rem;
  padding: 2px 6px;
  border-radius: 3px;
}
.hz-intel-loading-state {
  background: rgba(255,255,255,0.05);
  color: rgba(255,255,255,0.4);
}
.hz-intel-loading {
  font-size: 0.5rem;
}
.hz-intel-ready-state {
  background: rgba(0,255,136,0.1);
  color: #00ff88;
}
.hz-intel-error-state {
  background: rgba(255,0,0,0.1);
  color: #ff4444;
}
.hz-intel-threat-badge {
  font-size: 0.5rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 3px;
  letter-spacing: 1px;
}

/* ─── Bottom Legend ─── */
.hz-bottom-legend {
  display: flex;
  gap: 12px;
  padding: 5px 16px;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 20px;
  border: 1px solid rgba(0,255,136,0.1);
}
.hz-lg {
  display: flex;
  align-items: center;
  gap: 4px;
  color: rgba(255,255,255,0.5);
  font-size: 0.5rem;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.5px;
}
.hz-ldot2 {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ─── API Status Badge (surveillance style) ─── */
.hz-surveillance .hz-api-badge {
  font-size: 0.55rem;
  padding: 2px 8px;
  border-radius: 3px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 1px;
}
.hz-surveillance .hz-api-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-right: 4px;
}
.hz-surveillance .hz-online {
  background: #00ff88;
  box-shadow: 0 0 6px #00ff88;
}
.hz-surveillance .hz-offline {
  background: #ff4444;
}
.hz-surveillance .hz-api-offline {
  background: rgba(255,68,68,0.1);
  color: #ff8888;
}
.hz-surveillance .hz-live-badge {
  color: #ff0000;
  font-weight: 700;
  animation: recBlink 1.5s infinite;
}
.hz-surveillance .hz-sim-badge {
  color: #ffab00;
}

/* ─── Hide old hormuz styles that conflict ─── */
.hormuz-section { display: none !important; }

/* ╔══════════════════════════════════════════════╗
   ║  INTEL EVENT ITEMS                            ║
   ╚══════════════════════════════════════════════╝ */
.hz-intel-event {
  padding: 6px 8px;
  background: rgba(255,255,255,0.02);
  border-radius: 4px;
  border-left: 3px solid rgba(167,139,250,0.3);
  margin-bottom: 4px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.hz-intel-event:hover {
  background: rgba(167,139,250,0.06);
  border-left-color: rgba(167,139,250,0.6);
}
.hz-ie-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 3px;
}
.hz-ie-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px; height: 16px;
  border-radius: 3px;
  color: #fff;
  font-size: 0.45rem;
  font-weight: 700;
  flex-shrink: 0;
}
.hz-ie-icon {
  font-size: 0.65rem;
}
.hz-ie-title {
  color: rgba(255,255,255,0.88);
  font-size: 0.82rem;
  font-weight: 500;
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
  line-height: 1.4;
}
.hz-ie-detail {
  color: rgba(255,255,255,0.5);
  font-size: 0.72rem;
  line-height: 1.5;
  padding-left: 22px;
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
}
.hz-ie-meta {
  color: rgba(255,255,255,0.3);
  font-size: 0.6rem;
  padding-left: 22px;
  margin-top: 2px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.5px;
}

/* ╔══════════════════════════════════════════════╗
   ║  FLIGHT ITEMS (surveillance compact)          ║
   ╚══════════════════════════════════════════════╝ */
.hz-flight-item {
  padding: 4px 6px;
  border-bottom: 1px solid rgba(255,255,255,0.03);
  cursor: pointer;
  transition: background 0.15s;
}
.hz-flight-item:hover {
  background: rgba(0,255,136,0.04);
}
.hz-fi-head {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.55rem;
}
.hz-fi-flag {
  font-size: 0.6rem;
}
.hz-fi-fn {
  font-weight: 600;
  font-size: 0.55rem;
  letter-spacing: 0.5px;
}
.hz-fi-route {
  color: rgba(255,255,255,0.35);
  font-size: 0.48rem;
  margin-left: auto;
  letter-spacing: 0.5px;
}
.hz-fi-meta {
  display: flex;
  gap: 8px;
  font-size: 0.45rem;
  color: rgba(255,255,255,0.25);
  padding-left: 18px;
  margin-top: 1px;
}

/* ─── Responsive: mobile ─── */
@media (max-width: 768px) {
  /* Make overlays flow below map on mobile instead of overlapping */
  .hz-surveillance { position: relative; display: flex; flex-direction: column; }
  .hz-fullmap { min-height: 55vh; position: relative; }
  .hz-overlay-left { 
    position: relative; top: auto; left: auto; width: 100%; max-height: none;
    display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; padding: .4rem;
    background: var(--bg2);
  }
  .hz-overlay-right { 
    position: relative; top: auto; right: auto; width: 100%; max-height: none;
    padding: .4rem;
    background: var(--bg2);
    order: 2;
  }
  .hz-fullmap { order: 1; }
  .hz-scanlines, .hz-vignette { order: 1; }
  .hz-rec-bar { order: 1; }
  .hz-overlay-left { order: 3; }
  .hz-overlay-bottom { position: relative; bottom: auto; left: auto; transform: none; width: 100%; order: 4; }
  .hz-rec-center { display: flex; }
  .hz-rec-bar { padding: 4px 8px; }
  .hz-rec-subtitle { font-size: .65rem; letter-spacing: 2px; padding: 1px 6px; }
  .hz-glass { padding: 6px 8px; font-size: 0.7rem; background:rgba(0,5,12,.96)!important; backdrop-filter:none; -webkit-backdrop-filter:none; }
  .hz-glass-intel { max-height: none; background:rgba(8,10,18,.97)!important; }
  .hz-intel-body { max-height: none; }
  /* Fix geo-intel text containment on mobile */
  .hz-intel-event{ overflow:hidden; word-break:break-word; overflow-wrap:break-word; background:rgba(16,22,32,.95); margin-bottom:4px; border-radius:4px; }
  .hz-ie-title{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:break-word; }
  .hz-ie-detail{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; word-break:break-word; font-size:.65rem; line-height:1.55; }
  .hz-ie-meta{ font-size:.5rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .hz-ie-entity{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .hz-pred-card{ overflow:hidden; word-break:break-word; overflow-wrap:break-word; background:rgba(138,43,226,.06); margin-bottom:4px; }
  .hz-pred-text{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; word-break:break-word; }
  .hz-pred-loc{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .hz-pred-evidence{ overflow:hidden; }
  .hz-pred-ev-tag{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
  .hz-ai-intel-summary{ word-break:break-word; overflow-wrap:break-word; background:rgba(167,139,250,.06); }
  .hz-oil-val { font-size: 0.75rem; }
  .hz-sg-num { font-size: 0.95rem; }
  .hz-sg-lbl { font-size: 0.55rem; }
  .hz-bottom-legend { gap: 6px; padding: 3px 10px; justify-content: center; }
  .hz-lg { font-size: 0.55rem; }
  /* Corner brackets hidden on mobile */
  .hz-corner { display: none; }
  .hz-crosshair { display: none; }
  /* ── Mobile: hide GEO-INTEL card images ── */
  .hz-ie-img { display: none !important; }
  /* ── Mobile: enlarge popup close button for touch ── */
  .leaflet-popup-close-button {
    width: 32px !important;
    height: 32px !important;
    font-size: 22px !important;
    line-height: 30px !important;
    padding: 0 !important;
    top: 2px !important;
    right: 2px !important;
    color: #fff !important;
    background: rgba(0,0,0,0.5) !important;
    border-radius: 50% !important;
    text-align: center !important;
    z-index: 9999 !important;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }
  .leaflet-popup-close-button:hover,
  .leaflet-popup-close-button:active {
    background: rgba(255,0,0,0.5) !important;
    color: #fff !important;
  }
  /* ── Mobile: constrain popup width ── */
  .intel-popup-container .leaflet-popup-content-wrapper,
  .flight-popup-container .leaflet-popup-content-wrapper,
  .mil-flight-popup-container .leaflet-popup-content-wrapper {
    max-width: calc(100vw - 40px) !important;
  }
  .leaflet-popup-content { margin: 8px !important; }
  /* ── Mobile: popup image smaller ── */
  .intel-popup-img { max-height: 90px; }
  .intel-popup-img img { height: 90px; }
  /* ── Mobile: prevent touch delay ── */
  .leaflet-container { touch-action: manipulation; -webkit-touch-callout: none; }
  .intel-popup-social { flex-wrap: wrap; gap: 4px; }
  .ips-btn { padding: 6px 8px; font-size: .65rem; min-height: 36px; }
}

@media (max-width: 480px) {
  .hz-fullmap { min-height: 45vh; }
  .hz-overlay-left { grid-template-columns: 1fr; padding: .3rem; }
  .hz-overlay-right { padding: .3rem; }
  /* Show all panels on mobile, just make them compact */
  .hz-glass-compact { font-size: 0.65rem; }
  /* ── 480px: further popup adjustments ── */
  .intel-popup { min-width: 180px; font-size: .7rem; }
  .intel-popup-body { font-size: .65rem; }
  .intel-popup-img { max-height: 75px; }
  .intel-popup-img img { height: 75px; }
  .leaflet-popup-close-button {
    width: 36px !important;
    height: 36px !important;
    font-size: 24px !important;
    line-height: 34px !important;
  }
}

/* ═══ INLINE SOCIAL BAR (for timeline/leader sections) ═══ */
.social-bar-inline {
  border-top: 1px solid rgba(255,255,255,.04);
  padding: 5px 8px;
  margin-top: 6px;
  background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(10,14,20,.25) 100%);
}
.social-bar-inline .social-bar-inner { gap: 5px; }
.social-bar-inline .social-btn {
  padding: 4px 8px;
  font-size: .62rem;
  border-radius: 3px;
}
.social-bar-inline .sb-svg { width: 12px; height: 12px; }
.social-bar-inline .sb-label { font-size: .55rem; }

/* ═══════════════════════════════════════════════════════
   SOCIAL ENGAGEMENT UI
   ═══════════════════════════════════════════════════════ */

/* Social bar — bottom of each panel */
.social-bar {
  position: relative;
  z-index: 10;
  border-top: 1px solid rgba(255,255,255,.06);
  background: linear-gradient(180deg, rgba(0,0,0,.3) 0%, rgba(10,14,20,.5) 100%);
  padding: 6px 10px;
  margin-top: 6px;
}
.social-bar-inner {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.social-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 4px;
  background: rgba(255,255,255,.02);
  color: var(--txt2);
  font-size: .7rem;
  cursor: pointer;
  transition: all .25s;
  font-family: var(--fn);
  white-space: nowrap;
  backdrop-filter: blur(4px);
}
.social-btn:hover {
  background: rgba(200,164,90,.06);
  border-color: rgba(200,164,90,.2);
  color: var(--gold2);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
}
.social-btn:active { transform: scale(.97); }
.sb-svg { width: 14px; height: 14px; flex-shrink: 0; opacity: .7; transition: opacity .2s; }
.social-btn:hover .sb-svg { opacity: 1; }
.sb-count { font-size: .62rem; color: var(--txt3); font-family: var(--fd); letter-spacing: .5px; }
.sb-label { font-size: .62rem; letter-spacing: .5px; }
.sb-like.liked { background: rgba(200,60,60,.08); border-color: rgba(200,60,60,.2); color: #e05050; }
.sb-like.liked .sb-svg { opacity: 1; }
.sb-like.liked .sb-count { color: #e05050; }
.sb-forward {
  background: linear-gradient(135deg, rgba(200,164,90,.04) 0%, rgba(144,112,176,.04) 100%);
  border-color: rgba(200,164,90,.15);
  color: var(--gold);
}
.sb-forward:hover {
  background: linear-gradient(135deg, rgba(200,164,90,.1) 0%, rgba(144,112,176,.1) 100%);
  box-shadow: 0 2px 12px rgba(200,164,90,.12);
  border-color: rgba(200,164,90,.3);
}

/* Heart burst animation */
.heart-burst {
  position: absolute;
  font-size: 1.5rem;
  pointer-events: none;
  animation: heartFloat .8s ease-out forwards;
  z-index: 100;
  left: 30px;
  top: -5px;
}
@keyframes heartFloat {
  0% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-40px) scale(1.5); }
}

/* ═══ COMMENT OVERLAY ═══ */
.comment-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  animation: fadeIn .2s;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.comment-modal {
  width: 100%;
  max-width: 560px;
  max-height: 75vh;
  background: linear-gradient(180deg, #141a24 0%, #0c1018 100%);
  border-top: 2px solid var(--gold);
  border-radius: 16px 16px 0 0;
  display: flex;
  flex-direction: column;
  animation: slideUp .3s ease-out;
}
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

.comment-header {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  gap: 8px;
}
.comment-title { font-family: var(--fn); font-size: .85rem; color: var(--gold); flex: 1; }
.comment-count { font-family: var(--fd); font-size: .65rem; color: var(--txt3); }
.comment-close { background: none; border: none; color: var(--txt3); font-size: 1.2rem; cursor: pointer; padding: 4px 8px; }
.comment-close:hover { color: var(--red); }

/* ── News card preview inside comment modal ── */
.cmt-news-card {
  display: flex;
  gap: 10px;
  padding: 10px 14px;
  margin: 0;
  background: rgba(255,255,255,0.03);
  border-bottom: 1px solid rgba(200,164,90,0.12);
  max-height: 120px;
  overflow: hidden;
}
.cmt-card-img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 6px;
  flex-shrink: 0;
  border: 1px solid rgba(255,255,255,0.06);
}
.cmt-card-info { flex: 1; min-width: 0; }
.cmt-card-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.cmt-card-source {
  font-family: var(--fd);
  font-size: 0.6rem;
  color: var(--gold);
  letter-spacing: 1px;
  text-transform: uppercase;
  background: rgba(200,164,90,0.08);
  padding: 1px 6px;
  border-radius: 3px;
}
.cmt-card-time {
  font-family: var(--fm);
  font-size: 0.55rem;
  color: var(--txt3);
}
.cmt-card-title {
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
  font-size: 0.82rem;
  color: var(--txt);
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 3px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cmt-card-body {
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
  font-size: 0.7rem;
  color: var(--txt2);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.comment-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px 12px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.1) transparent;
}
.no-comments {
  text-align: center;
  padding: 30px;
  color: var(--txt3);
  font-size: .85rem;
}
.comment-item {
  display: flex;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.comment-avatar { font-size: 1.3rem; flex-shrink: 0; }
.comment-body { flex: 1; min-width: 0; }
.comment-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}
.comment-author { font-size: .72rem; color: var(--cyan); font-family: var(--fn); }
.comment-time { font-size: .6rem; color: var(--txt3); }
.comment-text { font-size: .78rem; color: var(--txt1); line-height: 1.5; word-break: break-all; }
.comment-actions { margin-top: 4px; }
.comment-like-btn {
  background: none;
  border: none;
  color: var(--txt3);
  font-size: .65rem;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 8px;
}
.comment-like-btn:hover { background: rgba(255,255,255,.06); }
.comment-liked { color: var(--gold) !important; }

.comment-input-area {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.2);
}
.comment-input {
  flex: 1;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 20px;
  padding: 8px 16px;
  color: var(--txt1);
  font-size: .78rem;
  font-family: var(--fn);
  outline: none;
}
.comment-input:focus { border-color: var(--gold); }
.comment-submit {
  padding: 8px 18px;
  background: var(--gold);
  border: none;
  border-radius: 20px;
  color: #000;
  font-weight: 600;
  font-size: .75rem;
  cursor: pointer;
  font-family: var(--fn);
}
.comment-submit:hover { background: #ffcc00; }

/* ═══ SHARE OVERLAY ═══ */
.share-overlay {
  position: fixed;
  inset: 0;
  z-index: 199999;
  background: rgba(0,0,0,.65);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn .2s;
}
.share-modal {
  width: 90%;
  max-width: 480px;
  background: linear-gradient(180deg, #1a2030 0%, #0e1420 100%);
  border: 1px solid rgba(255,170,0,.2);
  border-radius: 16px;
  overflow: hidden;
  animation: scaleIn .3s ease-out;
}
@keyframes scaleIn { from { transform: scale(.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }

.share-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: linear-gradient(90deg, rgba(255,170,0,.08) 0%, transparent 100%);
}
.share-title { font-family: var(--fn); font-size: .9rem; color: var(--gold); }
.share-close { background: none; border: none; color: var(--txt3); font-size: 1.2rem; cursor: pointer; }
.share-close:hover { color: var(--red); }

.share-body { padding: 16px; }
.share-loading {
  text-align: center;
  padding: 30px;
  color: var(--txt2);
}
.share-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(255,170,0,.2);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: spin .8s linear infinite;
  margin: 0 auto 12px;
}
@keyframes spin { to { transform: rotate(360deg); } }
.share-loading p { margin: 4px 0; font-size: .78rem; }

.share-result { }
.share-headline {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--gold);
  line-height: 1.5;
  margin-bottom: 10px;
  font-family: var(--fn);
  text-shadow: 0 0 12px rgba(255,170,0,.15);
}
.share-text-content {
  font-size: .9rem;
  color: var(--txt1);
  line-height: 1.7;
  margin-bottom: 10px;
  font-family: var(--fn);
}
.share-hook {
  font-size: .88rem;
  color: rgba(255,170,0,.9);
  font-weight: 600;
  margin-bottom: 12px;
  font-family: var(--fn);
}
.share-link {
  font-size: .82rem;
  color: var(--gold);
  word-break: break-all;
  margin-bottom: 14px;
  padding: 8px 12px;
  background: rgba(255,170,0,.08);
  border-radius: 6px;
  border: 1px solid rgba(255,170,0,.2);
}
.share-link a { color: var(--gold); text-decoration: underline; }
.share-link-label { font-weight: 700; }
.share-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.share-actions button {
  padding: 8px 18px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.1);
  font-size: .75rem;
  cursor: pointer;
  font-family: var(--fn);
  transition: all .2s;
}
.share-copy-btn { background: var(--gold); color: #000; border-color: var(--gold); font-weight: 600; flex: 1; }
.share-copy-btn:hover { background: #ffcc00; }
.share-regen-btn { background: rgba(255,255,255,.05); color: var(--txt2); }
.share-regen-btn:hover { background: rgba(255,255,255,.1); }
.share-error {
  text-align: center;
  padding: 20px;
  color: var(--red);
  font-size: .8rem;
}

/* ═══════════════════════════════════════════════════════
   MOBILE RESPONSIVE — Full Adaptation
   ═══════════════════════════════════════════════════════ */

/* Tablet breakpoint */
@media (max-width: 1024px) {
  .dual-panel {
    grid-template-columns: 1fr !important;
    gap: 0;
  }
  .panel-intel {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    order: 2;
    max-height: 60vh;
  }
  .panel-compare {
    order: 1;
    width: 100% !important;
  }
  .topbar {
    flex-wrap: wrap;
    padding: 6px 10px;
    gap: 4px;
  }
  .topbar-center {
    order: 3;
    width: 100%;
    text-align: center;
  }
  .force-grid { grid-template-columns: 1fr !important; }
  .risk-matrix-grid { grid-template-columns: 1fr !important; }

  .stat-hero-row {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .model-detail-modal {
    width: 95vw !important;
    max-width: 95vw !important;
    margin: 10px;
  }
}

/* Mobile breakpoint */
@media (max-width: 768px) {
  :root {
    --panel-pad: 8px;
  }

  body { font-size: 14px; }

  /* Globe: fullscreen on mobile too, toggle button repositioned */
  .hz-dim-toggle {
    bottom: 56px;
    left: 8px;
    padding: 6px 10px;
    font-size: 10px;
    gap: 4px;
  }
  .hz-dim-toggle .hz-dim-icon {
    font-size: 14px;
  }
  .hz-globe-full-hud {
    top: 8px;
  }
  .hz-globe-full-hud .hz-globe-full-label {
    font-size: 7px;
    letter-spacing: 1px;
  }
  .hz-globe-full-hud .hz-globe-full-count {
    font-size: 8px;
    padding: 1px 5px;
  }

  .topbar {
    flex-wrap: wrap;
    padding: 6px 8px;
    gap: 2px;
  }
  .topbar-left { gap: 6px; }
  .logo-txt { font-size: .55rem; }
  .theater-label { font-size: .55rem; }
  .topbar-right {
    gap: 4px;
  }
  .refresh-btn {
    padding: 4px 8px;
    font-size: .6rem;
  }
  .auth-btn {
    padding: 4px 8px;
    font-size: .6rem;
  }
  .q-badge { display: none; }

  .ticker-bar {
    font-size: .65rem;
    padding: 3px 8px;
  }

  /* Dual panel → single column */
  .dual-panel {
    grid-template-columns: 1fr !important;
    padding: 0 4px;
  }
  .panel-intel,
  .panel-compare {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    border-radius: 8px;
  }
  .panel-intel {
    order: 2;
    max-height: none;
  }
  .panel-compare {
    order: 1;
  }
  .panel-header {
    flex-wrap: wrap;
    padding: 6px 8px;
    gap: 4px;
  }
  .ph-title { font-size: .7rem; }
  .panel-compare .ph-title { font-size: .9rem; letter-spacing: 1.5px; }
  .model-indicators { font-size: .55rem; gap: 3px; }
  .mi { padding: 2px 6px; }

  /* Dashboard */
  .stat-hero-row {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 6px !important;
  }
  .stat-hero { padding: 8px !important; }
  .stat-hero-icon { font-size: 1rem; }
  .stat-hero-num { font-size: 1.3rem; }
  .stat-hero-label { font-size: .55rem; }

  .threat-status-bar {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 4px;
  }

  .esc-gauge { padding: 8px; }
  .esc-gauge-title { font-size: .7rem; }

  .force-header { flex-wrap: wrap; gap: 4px; padding: 6px; }
  .force-side { font-size: .65rem; }
  .force-vs { font-size: .8rem; }
  .force-grid { grid-template-columns: 1fr !important; gap: 6px; }
  .force-card { padding: 8px; }

  /* Comparison tables */
  .risk-matrix-grid { grid-template-columns: 1fr !important; }
  .rmc-bars { flex-direction: column; }

  /* Compare tables */
  .compare-tables { font-size: .7rem; }
  .wgt-row { flex-direction: column; gap: 4px; }
  .wgt-cell { min-width: 0; }

  /* Leaders */
  .ldr2-card { padding: 8px; }
  .ldr2-name { font-size: .78rem; }
  .ldr2-pred { padding: 6px; }

  /* Model detail */
  .model-detail-modal {
    width: 98vw !important;
    max-width: 98vw !important;
    height: 90vh !important;
    margin: 5vh 1vw;
    border-radius: 12px;
  }
  .mdm-header { padding: 8px 12px; }
  .mdm-title { font-size: .8rem; }

  /* Model detail bar */
  .model-detail-bar {
    flex-wrap: wrap;
    gap: 4px;
    padding: 8px;
  }
  .mdb-btn { padding: 6px 10px; font-size: .6rem; }
  .mdb-label { font-size: .6rem; width: 100%; }

  /* Chat */
  .chat-section-inline { padding: 8px; }
  .chat-msgs { max-height: 200px; }
  .chat-row textarea { font-size: .75rem; }

  /* News items */
  .news-card { padding: 8px; }
  .news-card-title { font-size: .75rem; }

  /* Social bar */
  .social-bar { padding: 4px 6px; }
  .social-btn { padding: 4px 8px; font-size: .62rem; }
  .sb-svg { width: 12px; height: 12px; }
  .sb-forward .sb-label { display: none; }

  /* Force AI commentary */
  .force-ai-commentary { padding: .45rem .55rem; }
  .fac-text { font-size: .72rem; }
  .fac-header { font-size: .6rem; }

  /* Footer */
  .wfooter { font-size: .55rem; padding: 6px 8px; flex-wrap: wrap; gap: 4px; }

  /* Hormuz section — auto height on mobile for flow layout */
  .hz-surveillance { min-height: auto; height: auto; }
  /* Don't set fixed overlay widths — let flow layout from earlier breakpoint handle it */
}

/* Small phone */
@media (max-width: 480px) {
  /* Don't set fixed overlay widths — let full-width flow from 768px handle it */
  .hz-intel-body { max-height: none; }
  .hz-rec-center { display: none; }

  .stat-hero-row {
    grid-template-columns: 1fr 1fr !important;
  }

  .topbar-center { display: none; }
  .force-header .force-name { font-size: .55rem; }
  .force-vs { font-size: .65rem; }

  /* Comment/Share modals full width */
  .comment-modal { max-width: 100%; border-radius: 12px 12px 0 0; }
  .share-modal { max-width: 95%; }

  .social-bar-inner { gap: 4px; }
  .social-btn { padding: 3px 6px; }
  .sb-svg { width: 11px; height: 11px; }
  .v-social-btn { font-size: .55rem; padding: .15rem .3rem; }
  .vp-svg { width: 10px; height: 10px; }
}

/* Touch-friendly enhancements */
@media (hover: none) and (pointer: coarse) {
  .social-btn {
    min-height: 36px;
    min-width: 36px;
  }
  .comment-like-btn {
    min-height: 30px;
    padding: 4px 10px;
  }
  .share-actions button {
    min-height: 38px;
    padding: 8px 16px;
  }
  .mdb-btn {
    min-height: 40px;
  }
  .mi { min-height: 28px; }
}

/* ═══════════════════════════════════════════════════════
   HORMUZ INTEL — TENSION UI (紧张感极限设计)
   ═══════════════════════════════════════════════════════ */

/* Critical pulse animation for threat badge */
.hz-threat-critical-pulse {
  animation: threatCriticalPulse 1.2s ease-in-out infinite;
}
@keyframes threatCriticalPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.08); text-shadow: 0 0 12px #ff0000, 0 0 25px rgba(255,0,0,0.5); }
}

/* Critical flash for summary text */
.hz-intel-critical-flash {
  border-left-color: #ff0000 !important;
  background: rgba(255,0,0,0.06) !important;
  animation: summaryFlash 3s ease-in-out infinite;
}
@keyframes summaryFlash {
  0%, 100% { border-left-color: #ff0000; }
  50% { border-left-color: #ff4444; background: rgba(255,0,0,0.1); }
}

/* Intel critical state badge */
.hz-intel-critical-state {
  background: rgba(255,0,0,0.12) !important;
  border-color: rgba(255,0,0,0.3) !important;
  animation: badgeCritical 2s infinite;
}
@keyframes badgeCritical {
  0%, 100% { box-shadow: 0 0 0 rgba(255,0,0,0); }
  50% { box-shadow: 0 0 8px rgba(255,0,0,0.3); }
}

/* Scan line in loading state */
.hz-intel-scan-line {
  display: inline-block;
  width: 50px;
  height: 2px;
  background: linear-gradient(90deg, transparent, #a78bfa, transparent);
  animation: scanLine 1.5s linear infinite;
  margin-left: 6px;
  vertical-align: middle;
}
@keyframes scanLine {
  0% { transform: translateX(-20px); opacity: 0; }
  50% { opacity: 1; }
  100% { transform: translateX(20px); opacity: 0; }
}

/* Meta count in status bar */
.hz-intel-meta-sm {
  font-size: 0.42rem;
  color: rgba(255,255,255,0.3);
  margin-left: 4px;
}

/* News count badge */
.hz-intel-newscount {
  font-size: 0.42rem;
  color: rgba(167,139,250,0.5);
  background: rgba(167,139,250,0.08);
  padding: 1px 5px;
  border-radius: 8px;
  margin-left: auto;
}

/* Urgency text */
.hz-intel-urgency {
  color: #ff4444;
  font-size: 0.5rem;
  font-weight: 600;
  padding: 3px 0;
  letter-spacing: 0.5px;
  animation: urgencyGlow 2s ease-in-out infinite;
}
@keyframes urgencyGlow {
  0%, 100% { opacity: 0.8; }
  50% { opacity: 1; text-shadow: 0 0 6px rgba(255,68,68,0.4); }
}

/* Enhanced intel body */
.hz-intel-body-enhanced {
  max-height: calc(100vh - 240px) !important;
}

/* Section labels within intel body */
.hz-intel-section-label {
  font-family: var(--f-impact);
  font-size: 0.75rem;
  color: rgba(255,255,255,0.55);
  font-weight: 600;
  letter-spacing: 1px;
  padding: 10px 0 5px;
  border-top: 1px solid rgba(167,139,250,0.08);
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.hz-isl-tag {
  font-size: 0.52rem;
  color: rgba(167,139,250,0.5);
  background: rgba(167,139,250,0.08);
  padding: 2px 6px;
  border-radius: 2px;
  letter-spacing: 1.5px;
  font-family: var(--fd);
}

/* Event severity variants */
.hz-ie-sev-critical {
  border-left: 2px solid #ff0000 !important;
  background: rgba(255,0,0,0.04) !important;
}
.hz-ie-sev-danger {
  border-left: 2px solid #ff4444 !important;
}
.hz-ie-sev-warning {
  border-left: 2px solid #ffab00 !important;
}
.hz-ie-sev-badge {
  font-size: 0.6rem;
  margin-left: auto;
}
.hz-ie-entity {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.48rem;
  color: rgba(167,139,250,0.6);
  padding: 2px 0 2px 22px;
  font-style: italic;
}

/* ─── Intel popup entity row ─── */
.intel-popup-entity {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px 0;
  font-size: 0.65rem;
  color: #a78bfa;
  border-bottom: 1px solid rgba(167,139,250,0.1);
}
.ipe-icon { font-size: 0.8rem; }
.ipe-name { font-weight: 500; }

/* ─── Intel popup news image ─── */
.intel-popup-img {
  width: 100%;
  max-height: 120px;
  overflow: hidden;
  border-radius: 4px 4px 0 0;
  margin: -4px -4px 4px -4px;
  padding: 0;
}
.intel-popup-img img {
  width: calc(100% + 8px);
  height: 120px;
  object-fit: cover;
  display: block;
  filter: brightness(0.85) contrast(1.1);
}

/* ─── Intel event list news image ─── */
.hz-ie-img {
  width: 100%;
  max-height: 60px;
  overflow: hidden;
  border-radius: 3px;
  margin-bottom: 4px;
}
.hz-ie-img img {
  width: 100%;
  height: 60px;
  object-fit: cover;
  display: block;
  filter: brightness(0.8) contrast(1.1);
}
.hz-ie-entity-inline {
  display: inline-block;
  font-size: 0.46rem;
  color: rgba(167,139,250,0.7);
  font-style: italic;
  padding: 1px 0 1px 22px;
}

/* ─── Intel marker enhanced ─── */
.intel-ring-outer {
  position: absolute;
  inset: -2px;
  border: 1px dashed;
  border-radius: 50%;
  opacity: 0.3;
  animation: outerRingSpin 8s linear infinite;
}
@keyframes outerRingSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.intel-entity-badge {
  position: absolute;
  bottom: -4px; right: -4px;
  font-size: 0.6rem;
  background: rgba(0,0,0,0.8);
  border-radius: 50%;
  width: 16px; height: 16px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(167,139,250,0.3);
}
.intel-marker-critical .intel-ring {
  animation: criticalRingPulse 1s ease-in-out infinite !important;
}
@keyframes criticalRingPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 8px rgba(255,0,0,0.4); }
  50% { transform: scale(1.15); box-shadow: 0 0 20px rgba(255,0,0,0.7); }
}
.intel-radius-outer {
  animation: outerRadiusPulse 4s ease-in-out infinite;
}
@keyframes outerRadiusPulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.6; }
}

/* ─── Leadership Stances Cards ─── */
.hz-leaders-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hz-leader-card {
  background: rgba(255,255,255,0.02);
  border-radius: 4px;
  padding: 6px 8px;
  border-left: 3px solid rgba(167,139,250,0.2);
  transition: all 0.2s;
}
.hz-leader-card:hover {
  background: rgba(255,255,255,0.05);
  border-left-color: rgba(167,139,250,0.5);
}
.hz-lc-head {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 3px;
}
.hz-lc-flag { font-size: 0.85rem; }
.hz-lc-name {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
}
.hz-lc-pos {
  font-size: 0.6rem;
  color: rgba(255,255,255,0.3);
  margin-left: auto;
}
.hz-lc-stance {
  display: inline-block;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  padding: 2px 8px;
  border: 1px solid;
  border-radius: 2px;
  margin-bottom: 3px;
  font-family: var(--fd);
}
.hz-lc-intensity {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-bottom: 3px;
}
.hz-lc-il {
  font-size: 0.4rem;
  color: rgba(255,255,255,0.3);
  margin-right: 4px;
}
.hz-intensity-bar {
  width: 10px;
  height: 3px;
  background: rgba(255,255,255,0.1);
  border-radius: 1px;
  transition: background 0.3s;
}
.hz-intensity-bar.active {
  background: currentColor;
}
.hz-lc-quote {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.55);
  font-style: italic;
  line-height: 1.5;
  padding: 2px 0;
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
}
.hz-lc-redline {
  font-size: 0.62rem;
  color: #ff4444;
  padding: 2px 0;
  font-weight: 500;
}

/* ─── Next-Move Forecast Cards ─── */
.hz-nextmove-card {
  background: rgba(255,255,255,0.02);
  border-radius: 4px;
  padding: 6px 8px;
  margin-bottom: 4px;
  border-left: 2px solid rgba(255,171,0,0.2);
  transition: all 0.2s;
}
.hz-nextmove-card:hover {
  background: rgba(255,255,255,0.05);
}
.hz-nm-head {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 2px;
}
.hz-nm-rank {
  font-size: 0.42rem;
  color: rgba(255,255,255,0.3);
  font-family: var(--fd);
}
.hz-nm-method { font-size: 0.7rem; }
.hz-nm-leader {
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(255,255,255,0.8);
}
.hz-nm-conf {
  font-size: 0.4rem;
  font-weight: 700;
  letter-spacing: 1px;
  margin-left: auto;
  font-family: var(--fd);
}
.hz-nm-action {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.5;
  padding: 2px 0;
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
}
.hz-nm-meta {
  display: flex;
  gap: 8px;
  font-size: 0.42rem;
  color: rgba(255,255,255,0.3);
}
.hz-nm-rationale {
  font-size: 0.42rem;
  color: rgba(255,171,0,0.5);
  padding: 2px 0;
  line-height: 1.3;
  font-style: italic;
}

/* ─── Cross-Leader Interaction Map ─── */
.hz-cm-section {
  margin-bottom: 4px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.hz-cm-label {
  font-size: 0.44rem;
  color: rgba(255,255,255,0.4);
  font-weight: 600;
  min-width: 60px;
}
.hz-cm-tag {
  font-size: 0.42rem;
  padding: 1px 6px;
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
}
.hz-cm-coop {
  color: #6a9a4a;
  border: 1px solid rgba(106,154,74,0.2);
}
.hz-cm-fault {
  color: #ff4444;
  border: 1px solid rgba(255,68,68,0.2);
}
.hz-cm-bridge {
  color: #4a90d9;
  border: 1px solid rgba(74,144,217,0.2);
}

/* ─── China Lens ─── */
.hz-ai-intel-china {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.6);
  line-height: 1.6;
  padding: 5px 8px;
  background: rgba(255,59,48,0.03);
  border-radius: 3px;
  border-left: 2px solid rgba(255,59,48,0.2);
  font-family: 'LXGW WenKai SC', 'Noto Sans SC', sans-serif;
}

/* ─── Risk & Insurance badges ─── */
.hz-ai-intel-risk,
.hz-ai-intel-insurance {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.45);
  padding: 3px 8px;
  margin-top: 2px;
}
.hz-ai-intel-risk { border-left: 2px solid rgba(255,68,68,0.15); }
.hz-ai-intel-insurance { border-left: 2px solid rgba(255,171,0,0.15); }

/* ─── Refresh button pulse ─── */
.hz-cam-btn-pulse {
  animation: refreshBtnGlow 3s ease-in-out infinite;
}
@keyframes refreshBtnGlow {
  0%, 100% { box-shadow: none; }
  50% { box-shadow: 0 0 6px rgba(167,139,250,0.3); }
}

/* ─── Enhanced marker wrap for larger size ─── */
.intel-marker-wrap {
  width: 48px !important;
  height: 48px !important;
}
.intel-ring {
  /* Use inset for proper centering instead of fixed width/height */
  inset: 4px !important;
  width: auto !important;
  height: auto !important;
}

/* ══════ CRITICAL ALERT OVERLAY ══════ */
.critical-alert-overlay{
  position:fixed;inset:0;z-index:99999;
  background:rgba(0,0,0,.85);
  display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(8px);
  animation:alertFadeIn .3s ease-out;
}
.critical-alert-overlay.hidden{display:none}
@keyframes alertFadeIn{from{opacity:0}to{opacity:1}}
@keyframes alertPulseRed{0%,100%{box-shadow:0 0 30px rgba(196,60,60,.4),inset 0 0 20px rgba(196,60,60,.05)}50%{box-shadow:0 0 60px rgba(196,60,60,.6),inset 0 0 40px rgba(196,60,60,.1)}}
.ca-inner{
  width:90%;max-width:520px;
  background:linear-gradient(135deg,rgba(16,22,32,.98),rgba(196,60,60,.08),rgba(16,22,32,.98));
  border:2px solid rgba(196,60,60,.5);border-radius:6px;
  animation:alertPulseRed 2s infinite;
  overflow:hidden;
}
.ca-header{
  display:flex;align-items:center;gap:.5rem;
  padding:.6rem 1rem;
  background:linear-gradient(90deg,rgba(196,60,60,.15),transparent);
  border-bottom:1px solid rgba(196,60,60,.3);
}
.ca-icon{font-size:1.2rem;animation:pulse 1s infinite}
.ca-title{font-family:'Noto Sans SC',var(--fd),sans-serif;font-size:.9rem;font-weight:800;color:var(--red);letter-spacing:3px;flex:1}
.ca-close{color:var(--txt3);cursor:pointer;font-size:1rem;padding:.2rem;transition:color .3s}
.ca-close:hover{color:var(--red)}
.ca-body{padding:.8rem 1rem;max-height:60vh;overflow-y:auto}
.ca-alert-item{
  padding:.6rem .8rem;margin-bottom:.5rem;
  border-radius:4px;border-left:3px solid var(--red);
  background:rgba(196,60,60,.04);
  animation:cardReveal .4s ease-out both;
}
.ca-alert-item:last-child{margin-bottom:0}
.ca-sev-critical{border-left-color:var(--red);background:rgba(196,60,60,.06)}
.ca-sev-warning{border-left-color:var(--gold);background:rgba(200,164,90,.04)}
.ca-alert-title{font-family:'Noto Sans SC',sans-serif;font-size:.85rem;font-weight:700;color:var(--txt);margin-bottom:.3rem}
.ca-alert-msg{font-family:'Noto Sans SC',sans-serif;font-size:.78rem;color:var(--txt2);line-height:1.7;margin-bottom:.2rem}
.ca-alert-detail{font-family:var(--fm);font-size:.68rem;color:var(--txt3);line-height:1.5}
.ca-footer{
  display:flex;justify-content:space-between;align-items:center;
  padding:.4rem 1rem;
  border-top:1px solid rgba(196,60,60,.15);
  background:rgba(196,60,60,.02);
}
.ca-time{font-family:var(--fm);font-size:.65rem;color:var(--txt3)}
.ca-source{font-family:var(--fm);font-size:.62rem;color:var(--txt3);letter-spacing:1px}

/* ═══ PREDICTION CARD STYLES ═══ */
.hz-isl-predict {
  color: rgba(138,43,226,0.6) !important;
  background: rgba(138,43,226,0.1) !important;
}
.hz-predict-label {
  margin-top: 10px;
}
.hz-pred-card {
  background: rgba(138,43,226,0.04);
  border-radius: 4px;
  padding: 8px 10px;
  margin-bottom: 6px;
  border-left: 3px solid rgba(138,43,226,0.4);
  transition: all 0.25s ease;
}
.hz-pred-card[data-lat] {
  cursor: pointer;
}
.hz-pred-card[data-lat]:hover {
  background: rgba(138,43,226,0.12);
  transform: translateX(3px);
  box-shadow: 0 0 12px rgba(138,43,226,0.25);
}
.hz-pred-card:hover {
  background: rgba(138,43,226,0.08);
}
.hz-pred-anchor {
  font-family: var(--fd);
  letter-spacing: 0.5px;
}
.hz-pred-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}
.hz-pred-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px; height: 18px;
  border-radius: 50%;
  font-size: 0.55rem;
  font-weight: 700;
  color: #fff;
  font-family: var(--fd);
}
.hz-pred-conf {
  font-size: 0.52rem;
  font-weight: 600;
  letter-spacing: 0.5px;
  font-family: var(--fd);
}
.hz-pred-tw {
  font-size: 0.5rem;
  color: rgba(255,255,255,0.4);
  margin-left: auto;
  font-family: var(--fd);
}
.hz-pred-text {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.85);
  line-height: 1.45;
  margin-bottom: 4px;
}
.hz-pred-loc {
  font-size: 0.52rem;
  color: rgba(138,43,226,0.6);
  margin-bottom: 3px;
}
.hz-pred-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin-top: 3px;
}
.hz-pred-ev-tag {
  font-size: 0.46rem;
  color: rgba(255,255,255,0.5);
  background: rgba(255,255,255,0.04);
  padding: 1px 5px;
  border-radius: 2px;
  font-family: var(--fd);
}
.hz-pred-impact {
  font-size: 0.52rem;
  color: rgba(255,160,0,0.7);
  margin-top: 4px;
  font-style: italic;
}
/* Prediction metadata (model + timestamp) */
.hz-pred-meta {
  font-size: 0.48rem;
  color: rgba(138,43,226,0.6);
  font-family: var(--fm);
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed rgba(138,43,226,0.15);
  letter-spacing: 0.3px;
}
/* Confirmed prediction banner */
.hz-pred-confirmed {
  background: linear-gradient(90deg, rgba(0,230,118,0.15), rgba(0,230,118,0.05));
  border: 1px solid rgba(0,230,118,0.4);
  border-radius: 3px;
  padding: 4px 8px;
  margin-bottom: 6px;
  font-size: 0.56rem;
  font-weight: 700;
  color: #00e676;
  font-family: var(--fd);
  letter-spacing: 0.5px;
  animation: confirmedGlow 2s ease-in-out infinite;
}
@keyframes confirmedGlow {
  0%, 100% { box-shadow: 0 0 6px rgba(0,230,118,0.3); }
  50% { box-shadow: 0 0 18px rgba(0,230,118,0.6); }
}
/* Prediction marker pulse */
.pred-marker-div .intel-marker-wrap {
  animation: predPulse 2s ease-in-out infinite;
}
.pred-marker-div .intel-ring {
  border-color: #8a2be2 !important;
  box-shadow: 0 0 18px rgba(138,43,226,0.6) !important;
}
.pred-marker-div .intel-icon {
  background: #8a2be2 !important;
}
@keyframes predPulse {
  0%, 100% { box-shadow: 0 0 12px rgba(138,43,226,0.4); }
  50% { box-shadow: 0 0 28px rgba(138,43,226,0.8); }
}

/* ══════ LANGUAGE TOGGLE ══════ */
.lang-toggle{
  display:flex;align-items:center;gap:0;
  border:1px solid var(--border);border-radius:2px;overflow:hidden;
}
.lang-toggle-btn{
  background:none;border:none;color:var(--txt3);
  font-family:var(--fd);font-size:.62rem;letter-spacing:1px;
  padding:.22rem .5rem;cursor:pointer;transition:all .3s;
}
.lang-toggle-btn:first-child{border-right:1px solid var(--border)}
.lang-toggle-btn.active{background:rgba(200,164,90,.12);color:var(--gold);font-weight:700}
.lang-toggle-btn:hover{color:var(--gold)}

/* ═══════════════════════════════════════════════════════
   ROUND 9: COMPREHENSIVE MOBILE / TABLET ADAPTATION
   iOS (iPhone SE → 16 Pro Max) · Android · iPad
   20260307l
   ═══════════════════════════════════════════════════════ */

/* ── iOS Safe Area (viewport-fit=cover) ── */
@supports(padding: env(safe-area-inset-top)){
  body{
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
  .topbar{
    padding-top: max(.4rem, env(safe-area-inset-top));
    padding-left: max(.6rem, env(safe-area-inset-left));
    padding-right: max(.6rem, env(safe-area-inset-right));
  }
  .wfooter{
    padding-bottom: max(.5rem, env(safe-area-inset-bottom));
  }
  /* Fullscreen modals need safe areas */
  .news-float-popup{
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .model-detail-modal{
    padding-top: env(safe-area-inset-top);
  }
  .critical-alert-overlay{
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  }
  /* Cinematic overlay respects notch */
  .cine-overlay{
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }
}

/* ── Global overflow prevention ── */
html,body{ overflow-x:hidden; max-width:100vw; }
.topbar,.ticker-bar,.compare-body,.hormuz-section,.dual-panel{ max-width:100vw; }
img,video,iframe,.leaflet-container{ max-width:100%; }

/* ── iPad Pro 12.9" / iPad Air landscape (769–1024px) ── */
@media(min-width:769px) and (max-width:1024px){
  /* Keep richer grid layouts on iPad */
  .stat-hero-row{ grid-template-columns:repeat(4,1fr)!important }
  .force-grid{ grid-template-columns:repeat(2,1fr)!important }
  .risk-matrix-grid{ grid-template-columns:repeat(2,1fr)!important }
  .worst-case-cards{ grid-template-columns:repeat(2,1fr)!important }
  .leader-grid-v2{ grid-template-columns:repeat(2,1fr)!important }
  .wg-cards{ grid-template-columns:repeat(2,1fr)!important }
  .fc-breakdown-grid{ grid-template-columns:repeat(2,1fr) }

  /* Hormuz keeps sidebar on iPad */
  .hormuz-body{ grid-template-columns:1fr 260px!important }
  .hormuz-map{ min-height:400px }

  /* Auth CTA properly sized */
  .auth-btn-cta{ padding:.35rem .8rem; font-size:.65rem }

  /* Modal not fullscreen on iPad */
  .model-detail-modal{ width:88vw!important; max-width:88vw!important; border-radius:10px }

  /* News list scrollable */
  .panel-intel .news-list-wrap{ max-height:50vh }

  /* Better tab sizing */
  .mi{ padding:.3rem .65rem; font-size:.58rem }

  /* Timeline scroll area */
  .timeline-track{ padding-bottom:.8rem }
}

/* ── iPad Mini portrait / large phone landscape (481–768px) ── */
@media(min-width:481px) and (max-width:768px){
  .stat-hero-row{ grid-template-columns:repeat(2,1fr)!important; gap:6px }
  .threat-status-bar{ grid-template-columns:repeat(2,1fr)!important }
  .worst-case-cards{ grid-template-columns:1fr }
  .leader-grid-v2{ grid-template-columns:1fr }

  /* Hormuz stacked but map larger */
  .hormuz-body{ grid-template-columns:1fr; min-height:auto }
  .hormuz-map{ min-height:320px }
  .hormuz-stats{ flex-direction:row; flex-wrap:wrap; border-left:none; border-top:1px solid var(--border); padding:.5rem }

  /* Better spacing for touch */
  .news-item{ padding:10px 12px; min-height:56px }
  .social-btn{ min-height:40px; padding:6px 10px }
  .chat-msgs{ max-height:250px }

  /* Oil cards side by side on tablet */
  .hz-oil-cards{ flex-direction:row; flex-wrap:wrap }
  .hz-oil-card{ flex:1; min-width:140px }

  /* Intel events scrollable */
  .hz-ai-intel-events{ max-height:180px }
}

/* ── Phones 430px (iPhone 14/15 Pro Max) ── */
@media(max-width:430px){
  /* Auth CTA compact but visible */
  .auth-btn-cta{
    padding:.22rem .5rem!important;
    font-size:.52rem!important;
    letter-spacing:.3px!important;
    white-space:nowrap;
  }
  .auth-cta-icon{ font-size:.6rem }

  /* Language toggle tight */
  .lang-toggle-btn{ padding:.2rem .35rem; font-size:.55rem }

  /* Prediction cards */
  .hz-pred-card{ padding:6px 8px; margin-bottom:4px }
  .hz-pred-text{ font-size:.64rem; line-height:1.5 }
  .hz-pred-evidence{ gap:2px }
  .hz-pred-ev-tag{ font-size:.44rem; padding:1px 4px }
  .hz-pred-head{ gap:4px }
  .hz-pred-num{ width:16px; height:16px; font-size:.48rem }
  .hz-pred-conf{ font-size:.48rem }
  .hz-pred-tw{ font-size:.46rem }

  /* Leadership stance cards */
  .hz-leader-card{ padding:5px 7px }
  .hz-lc-name{ font-size:.72rem }
  .hz-lc-quote{ font-size:.64rem }
  .hz-lc-redline{ font-size:.6rem }
  .hz-lc-stance{ font-size:.52rem; padding:2px 6px }
  .hz-lc-flag{ font-size:.75rem }

  /* Next-move cards */
  .hz-nextmove-card{ padding:5px 7px }
  .hz-nm-leader{ font-size:.68rem }
  .hz-nm-action{ font-size:.64rem }

  /* Critical alert compact */
  .ca-inner{ width:96%; max-width:none }
  .ca-title{ font-size:.78rem; letter-spacing:2px }
  .ca-alert-title{ font-size:.78rem }
  .ca-alert-msg{ font-size:.72rem; line-height:1.7 }
  .ca-alert-detail{ font-size:.64rem }
  .ca-header{ padding:.5rem .8rem }
  .ca-body{ padding:.6rem .8rem }

  /* Flights panel */
  .hz-flights-title{ font-size:.65rem }
  .hz-flight-item{ padding:.2rem .25rem }
  .hz-fi-fn{ font-size:.55rem }
  .hz-fi-meta{ font-size:.48rem }
  .hz-flights-list{ max-height:100px }

  /* Collapsible sidebar sections */
  .hz-sec-hdr{ padding:.3rem .35rem; font-size:.52rem }
  .hz-sec-num{ width:16px; height:16px; font-size:.42rem }
  .hz-sec-tag{ font-size:.38rem }

  /* China lens & risk/insurance */
  .hz-ai-intel-china{ font-size:.66rem; padding:4px 6px }
  .hz-ai-intel-risk,.hz-ai-intel-insurance{ font-size:.6rem; padding:3px 6px }

  /* Intel marker smaller on phone */
  .intel-marker-wrap{ width:36px!important; height:36px!important }
  .intel-icon{ width:18px; height:18px; font-size:.6rem }
  .intel-idx{ width:12px; height:12px; font-size:.4rem }

  /* Vessel marker smaller */
  .v-marker-wrap{ width:28px; height:28px }
  .v-svg-marker{ width:24px; height:24px }

  /* Share overlay */
  .share-overlay{ padding:.3rem }
  .share-modal{ padding:1rem; border-radius:8px }
  .share-textarea{ font-size:.72rem; min-height:100px }
  .share-actions{ flex-direction:column; gap:.3rem }
  .share-actions button{ width:100% }

  /* Comment panel */
  .comment-modal{ border-radius:12px 12px 0 0; max-width:100% }
}

/* ── Small phones 375px (iPhone 12/13/14 standard) ── */
@media(max-width:375px){
  html{ font-size:13px }

  /* Ultra-compact topbar */
  .topbar{ padding:.3rem .4rem; gap:2px }
  .logo-icon{ font-size:.95rem }
  .logo-txt{ font-size:.55rem; letter-spacing:1px }
  .logo-quewi{ display:none }
  .sfx-toggle{ font-size:.65rem; padding:.15rem .3rem }

  /* Auth CTA minimal */
  .auth-btn-cta{
    padding:.18rem .35rem!important;
    font-size:.45rem!important;
    animation-duration:3.5s;
  }

  /* Ticker ultra-compact */
  .ticker-bar{ height:26px }
  .ticker-label{ font-size:.48rem; padding:0 .35rem }
  .ticker-content{ font-size:.65rem; gap:1.5rem }

  /* Force balance gauge */
  .gauge-bar{ height:18px }
  .gauge-labels{ font-size:.52rem }
  .balance-gauge{ padding:.35rem }

  /* Map smaller */
  .hormuz-map{ min-height:200px!important }
  .hz-map-stats{ flex-wrap:wrap }
  .hz-mstat{ min-width:50%; padding:.3rem .15rem }
  .hz-mstat-val{ font-size:.78rem }
  .hz-mstat-label{ font-size:.45rem }

  /* Hide secondary sections on tiny screens */
  .hz-flights-panel{ display:none }
  .hz-sat-section .hz-sat-ref{ display:none }

  /* Timeline tighter */
  .timeline-node{ min-width:100px; padding-top:1.5rem }
  .timeline-dot{ width:14px; height:14px; font-size:.4rem }
  .timeline-label{ font-size:.55rem }

  /* Footer compact */
  .wfooter{ padding:.4rem .6rem; font-size:.52rem }

  /* News items */
  .news-item-thumb{ width:44px; height:33px }
  .news-item-title{ font-size:.8rem; -webkit-line-clamp:2 }
  .news-item-summary{ font-size:.7rem; -webkit-line-clamp:2 }
}

/* ── Tiny phones 320px (iPhone SE 1st gen, old Android) ── */
@media(max-width:320px){
  html{ font-size:12px }
  .topbar-left .live-ind{ display:none }
  .sfx-toggle{ display:none }
  .auth-btn-cta span:not(.auth-cta-icon){ font-size:.4rem }
  .news-item-thumb{ display:none }
  .hz-zoom-btns{ display:none }
  .hz-flights-panel{ display:none }
  .hz-sat-section{ display:none }
  .timeline-track{ display:none }
  .stat-hero-row{ grid-template-columns:1fr 1fr!important; gap:.2rem }
  .stat-hero{ padding:.35rem!important }
  .stat-hero-num{ font-size:.82rem }
  .stat-hero-icon{ font-size:1rem }
}

/* ── Landscape phones (short + wide) ── */
@media(max-height:500px) and (orientation:landscape){
  .topbar{ padding:.25rem .5rem }
  .topbar-center{ display:none }
  .ticker-bar{ height:24px }
  .hormuz-map{ min-height:180px!important }
  .panel-intel .news-list-wrap{ max-height:30vh }
  .chat-msgs{ max-height:120px }
  .ca-inner{ max-height:85vh; overflow-y:auto }
  .ca-body{ max-height:55vh }
}

/* ── Tall phones (iPhone Pro Max, Samsung Ultra) ── */
@media(min-height:800px) and (max-width:430px){
  /* Take advantage of vertical space */
  .hormuz-map{ min-height:280px!important }
  .chat-msgs{ max-height:220px }
  .hz-ai-intel-events{ max-height:200px }
  .panel-intel .news-list-wrap{ max-height:55vh }
}

/* ── All mobile: smooth scroll & overscroll ── */
@media(max-width:1024px){
  body{ overscroll-behavior-y:none; -webkit-text-size-adjust:100%; text-size-adjust:100% }
  .compare-body,.news-list-wrap,.hormuz-stats,.mdm-body,.nfp-scroll,
  .hz-ai-intel-events,.hz-flights-list,.ca-body{
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    scroll-behavior:smooth;
  }
  /* Prevent zoom on double-tap for inputs */
  input,select,textarea{ font-size:16px!important }
  /* Kill layout shift on panel transitions */
  .dual-panel,.panel-intel,.panel-compare{ transition:none!important }

  /* Ensure map tiles don't overflow */
  .hormuz-map-wrap{ overflow:hidden }
  .leaflet-container{ touch-action:pan-x pan-y }

  /* Social bar inline layout on mobile */
  .social-bar-inner{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch }
  .social-bar-inner::-webkit-scrollbar{ display:none }

  /* QueWi forward button mobile-friendly */
  .hz-quewi-fwd,.nfp-quewi-fwd{ min-height:40px; font-size:.6rem; padding:.3rem .6rem }
}

/* ── Enhanced touch targets (Apple HIG: 44pt, Material: 48dp) ── */
@media(hover:none) and (pointer:coarse){
  .hz-sec-hdr{ min-height:44px; display:flex; align-items:center }
  .hz-pred-card{ min-height:44px }
  .hz-pred-card[data-lat]{ cursor:pointer }
  .hz-intel-event{ min-height:44px }
  .hz-leader-card{ min-height:44px }
  .lang-toggle-btn{ min-height:36px; min-width:36px }
  .v-social-btn{ min-height:36px; min-width:36px }
  .share-copy-btn,.share-regen-btn{ min-height:44px }
  .ca-close{ min-height:44px; min-width:44px; display:flex; align-items:center; justify-content:center }
  .hz-zoom-btn{ min-height:40px; min-width:40px }
  .hz-track-btn{ min-height:44px }
  .hz-intel-refresh-btn{ min-height:36px }
  .hz-flights-refresh-btn{ min-height:36px }
  .intel-custom-btn{ min-height:40px }
  .ips-btn{ min-height:36px }

  /* Remove hover transforms that cause jank on touch */
  .hz-pred-card:hover,.hz-pred-card[data-lat]:hover{ transform:none }
  .hz-nextmove-card:hover{ transform:none }
  .hz-leader-card:hover{ transform:none }
  .hz-oil-card:hover{ transform:none }
  .hz-stat-card:hover{ transform:none }
  .hz-flight-item:hover{ background:transparent }
  .intel-popup-social .ips-btn:hover{ transform:none }

  /* Active state feedback instead of hover */
  .hz-pred-card[data-lat]:active{ background:rgba(138,43,226,.12); border-left-color:rgba(138,43,226,.6) }
  .hz-intel-event:active{ background:rgba(200,164,90,.06) }
  .hz-leader-card:active{ background:rgba(255,255,255,.06) }
  .hz-flight-item:active{ background:rgba(74,144,217,.08) }
}

/* ── Fix auth CTA animation performance on mobile ── */
@media(max-width:768px){
  .auth-btn-cta{
    will-change:auto;
    animation:authCtaPulse 3s ease-in-out infinite;
  }
  /* Reduce glow complexity for GPU perf */
  .auth-btn-cta:hover{
    box-shadow:0 0 10px rgba(200,164,90,.2);
  }
}

/* ── Cinematic overlay phone fixes ── */
@media(max-width:480px){
  .cine-overlay{
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .title-vs{
    flex-direction:column;
    gap:.3rem;
    max-width:90vw;
  }
  .title-models{
    flex-wrap:wrap;
    justify-content:center;
    gap:.25rem;
  }
  .cine-enter-btn{
    font-size:clamp(.85rem,2.2vw,1.1rem);
    padding:.6rem 1.5rem;
    letter-spacing:3px;
  }
  /* Ensure cinematic items don't overflow */
  .cine-overlay *{ max-width:100vw; box-sizing:border-box }
}

/* ── Print / accessibility ── */
@media print{
  .topbar,.ticker-bar,.cine-overlay,.wfooter,.social-bar,.chat-section-inline{ display:none!important }
  body{ background:#fff; color:#000 }
  .panel-intel,.panel-compare{ break-inside:avoid }
}

/* ═══════════════════════════════════════════════════════════════
   MULTI-SOURCE INTELLIGENCE UPGRADE v20260310c
   Full-Screen 2D↔3D Globe Toggle · Strategic Globe.GL Overlay
   ═══════════════════════════════════════════════════════════════ */

/* ── Fullscreen 3D Globe Overlay ── */
.hz-globe-full {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: #000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.6s cubic-bezier(0.16,1,0.3,1);
}
.hz-globe-full.hz-view-active {
  opacity: 1;
  pointer-events: auto;
}

/* ── Globe.GL / CesiumJS Container (fills overlay) ── */
.hz-globe-container-full {
  width: 100%;
  height: 100%;
  background: #000;
  overflow: hidden;
  position: relative;
}
.hz-globe-container-full canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}
/* Override CesiumJS default widget styles for clean military look */
.hz-globe-container-full .cesium-viewer,
.hz-globe-container-full .cesium-viewer-cesiumWidgetContainer,
.hz-globe-container-full .cesium-widget,
.hz-globe-container-full .cesium-widget canvas {
  width: 100% !important;
  height: 100% !important;
  position: absolute !important;
  inset: 0 !important;
}
.hz-globe-container-full .cesium-viewer-bottom,
.hz-globe-container-full .cesium-viewer-toolbar,
.hz-globe-container-full .cesium-performanceDisplay-defaultContainer {
  display: none !important;
}

/* ── 3D HUD Overlay (top label) ── */
.hz-globe-full-hud {
  position: absolute;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
  align-items: center;
  pointer-events: none;
  z-index: 10;
  opacity: 0;
  transition: opacity 0.4s 0.3s;
}
.hz-globe-full.hz-view-active .hz-globe-full-hud {
  opacity: 1;
}
.hz-globe-full-label {
  font-family: var(--fd);
  font-size: 9px;
  letter-spacing: 2px;
  color: rgba(0,229,255,0.7);
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(0,229,255,0.4);
}
.hz-globe-full-count {
  font-family: var(--fm);
  font-size: 10px;
  color: rgba(255,255,255,0.6);
  background: rgba(0,0,0,0.5);
  padding: 2px 8px;
  border-radius: 4px;
  backdrop-filter: blur(4px);
}

/* ── 2D/3D Dimension Toggle Button ── */
.hz-dim-toggle {
  position: absolute;
  bottom: 70px;
  left: 16px;
  z-index: 900;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 24px;
  border: 1px solid rgba(0,229,255,0.25);
  background: rgba(0,10,20,0.75);
  backdrop-filter: blur(12px) saturate(1.4);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  color: rgba(0,229,255,0.8);
  font-family: var(--fd);
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.16,1,0.3,1);
  box-shadow: 0 2px 16px rgba(0,0,0,0.5), 0 0 0 0 rgba(0,229,255,0);
  user-select: none;
  -webkit-user-select: none;
}
.hz-dim-toggle:hover {
  border-color: rgba(0,229,255,0.5);
  background: rgba(0,20,40,0.85);
  box-shadow: 0 4px 24px rgba(0,0,0,0.6), 0 0 20px rgba(0,229,255,0.12);
  transform: scale(1.05);
}
.hz-dim-toggle:active {
  transform: scale(0.96);
}
.hz-dim-toggle .hz-dim-icon {
  font-size: 16px;
  line-height: 1;
  filter: drop-shadow(0 0 4px rgba(0,229,255,0.4));
}
.hz-dim-toggle .hz-dim-label {
  font-weight: 600;
}

/* Active 3D state */
.hz-dim-toggle.hz-dim-3d-active {
  border-color: rgba(0,229,255,0.5);
  background: rgba(0,229,255,0.15);
  box-shadow: 0 4px 24px rgba(0,0,0,0.6), 0 0 24px rgba(0,229,255,0.2);
  color: #00e5ff;
}
.hz-dim-toggle.hz-dim-3d-active .hz-dim-icon {
  animation: hz-pulse-glow 2s ease-in-out infinite;
}

@keyframes hz-pulse-glow {
  0%, 100% { filter: drop-shadow(0 0 4px rgba(0,229,255,0.4)); }
  50% { filter: drop-shadow(0 0 12px rgba(0,229,255,0.8)); }
}

/* ── 2D Map / 3D Globe view state helpers ── */
.hz-view-active {
  opacity: 1;
  pointer-events: auto;
}
.hz-view-hidden {
  opacity: 0;
  pointer-events: none;
}

/* ── Satellite Marker Styles ── */
.sat-marker-div { background: none !important; border: none !important; }
.sat-marker-wrap {
  display: flex; flex-direction: column; align-items: center;
  pointer-events: auto; cursor: pointer;
  transition: transform .2s;
}
.sat-marker-wrap:hover { transform: scale(1.3); }
.sat-icon {
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.2);
}
.sat-isr .sat-icon {
  animation: satPulse 2s ease-in-out infinite;
  border-color: rgba(255,45,85,.5);
}
.sat-label {
  font-family: var(--fm);
  font-size: 9px;
  white-space: nowrap;
  text-shadow: 0 1px 3px rgba(0,0,0,.9);
  margin-top: 1px;
}
.sat-over-me .sat-icon { border-color: rgba(0,229,255,.5); }

@keyframes satPulse {
  0%, 100% { box-shadow: 0 0 6px rgba(255,45,85,.4); }
  50% { box-shadow: 0 0 18px rgba(255,45,85,.7), 0 0 30px rgba(255,45,85,.2); }
}

/* Ground track lines */
.sat-ground-track { opacity: .6; }

/* Satellite Popup */
.sat-popup-container .leaflet-popup-content-wrapper {
  background: rgba(10,14,20,.95);
  border: 1px solid rgba(0,229,255,.2);
  border-radius: 8px;
  color: var(--txt);
  font-family: var(--fb);
}
.sat-popup-container .leaflet-popup-tip { background: rgba(10,14,20,.95); }
.sat-popup { padding: 6px 2px; }
.sat-popup-hdr {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 8px;
  font-weight: 600;
  border-radius: 4px 4px 0 0;
  background: rgba(0,229,255,.05);
}
.sat-popup-name { font-family: var(--fm); font-size: 13px; }
.sat-isr-badge {
  font-size: 9px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px;
  background: rgba(255,45,85,.2);
  color: #ff2d55;
  border: 1px solid rgba(255,45,85,.3);
  font-family: var(--fd);
  letter-spacing: 1px;
}
.sat-popup-grid { padding: 6px 8px; }
.spg { display: flex; justify-content: space-between; padding: 2px 0; border-bottom: 1px solid rgba(255,255,255,.05); }
.spg-l { font-size: 11px; color: var(--txt3); }
.spg-v { font-size: 11px; font-family: var(--fm); color: var(--txt); }
.sat-popup-foot {
  padding: 4px 8px;
  font-size: 9px;
  color: var(--txt3);
  border-top: 1px solid rgba(255,255,255,.05);
}

/* ── Satellite Panel (left overlay) ── */
.hz-tag-sat {
  background: rgba(0,229,255,.12) !important;
  color: #00e5ff !important;
  border: 1px solid rgba(0,229,255,.25) !important;
}
.hz-sat-live-dot {
  display: inline-block; width: 6px; height: 6px;
  background: #00e5ff; border-radius: 50%;
  animation: pulse 2s ease-in-out infinite;
  margin-left: 6px;
}
.hz-sat-info {
  font-size: 11px; color: var(--txt2);
  padding: 4px 10px;
  font-family: var(--fm);
}
.hz-sat-isr-count { color: #ff2d55; font-weight: 600; }
.hz-sat-me-count { color: #00e5ff; font-weight: 600; }
.hz-sat-scroll {
  max-height: 120px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0,229,255,.2) transparent;
}
.hz-sat-item {
  display: flex; align-items: center; gap: 4px;
  padding: 3px 10px;
  font-size: 11px;
  cursor: pointer;
  transition: background .2s;
  border-bottom: 1px solid rgba(255,255,255,.03);
}
.hz-sat-item:hover { background: rgba(0,229,255,.08); }
.hz-sat-item-icon { font-size: 12px; }
.hz-sat-item-name {
  flex: 1;
  font-family: var(--fm);
  font-size: 10px;
  color: var(--txt2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.hz-sat-isr-tag {
  font-size: 8px; font-weight: 700;
  padding: 0 3px; border-radius: 2px;
  background: rgba(255,45,85,.15);
  color: #ff2d55;
  font-family: var(--fd);
}
.hz-sat-item-alt {
  font-family: var(--fm);
  font-size: 9px;
  color: var(--txt3);
}
.hz-sat-empty {
  padding: 8px 10px;
  font-size: 11px;
  color: var(--txt3);
  text-align: center;
}

/* ── Legend satellite dot ── */
.hz-sat-dot-legend {
  width: 8px; height: 8px;
  background: #00e5ff;
  border-radius: 50%;
  display: inline-block;
  box-shadow: 0 0 6px rgba(0,229,255,.5);
  animation: satPulse 3s ease-in-out infinite;
}
.hz-lg-src {
  font-size: 9px !important;
  color: var(--txt3) !important;
  font-family: var(--fm) !important;
  opacity: .7;
}

/* ── ADSB.lol source badge in military popup ── */
.mfp-val { font-family: var(--fm); }

/* ── War-room tension radar sweep ── */
@keyframes radarSweep {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.hz-radar-sweep {
  position: absolute;
  top: 50%; left: 50%;
  width: 300px; height: 300px;
  margin: -150px 0 0 -150px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 2;
  opacity: .12;
  background: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(0,229,255,.3) 30deg,
    transparent 60deg
  );
  animation: radarSweep 6s linear infinite;
}

/* ── Enhanced wartime tension indicators ── */
.hz-intel-body-enhanced {
  border-left: 2px solid rgba(196,60,60,.15);
}
.hz-intel-critical-flash {
  animation: criticalFlash 1.5s ease-in-out 3;
}
@keyframes criticalFlash {
  0%, 100% { background: transparent; }
  50% { background: rgba(255,0,0,.08); }
}

/* ── Threat-level glow borders (war-room tension feel) ── */
.hz-surveillance {
  position: relative;
}
.hz-surveillance::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 5;
  border: 1px solid rgba(196,60,60,.08);
  box-shadow: inset 0 0 60px rgba(196,60,60,.03), inset 0 0 120px rgba(0,0,0,.15);
}

/* ── ADSB.lol confirmed military flight enhanced marker ── */
.mil-flight-marker-wrap[data-source="adsb.lol"] .mil-threat-ring {
  border-style: dashed;
}

/* ── Multi-source data fusion status bar ── */
.hz-intel-src {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.hz-intel-newscount {
  font-family: var(--fm) !important;
  font-size: 10px !important;
  letter-spacing: .5px;
}

/* ── Enhanced glass panels with war-room borders ── */
.hz-glass {
  border: 1px solid rgba(200,164,90,.08);
  position: relative;
  overflow: hidden;
}
.hz-glass::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200,164,90,.2), transparent);
  pointer-events: none;
}

/* ── Enhanced corner brackets with glow ── */
.hz-corner { box-shadow: none; }
.hz-corner-tl { border-top: 2px solid rgba(0,229,255,.3); border-left: 2px solid rgba(0,229,255,.3); }
.hz-corner-tr { border-top: 2px solid rgba(0,229,255,.3); border-right: 2px solid rgba(0,229,255,.3); }
.hz-corner-bl { border-bottom: 2px solid rgba(255,45,85,.3); border-left: 2px solid rgba(255,45,85,.3); }
.hz-corner-br { border-bottom: 2px solid rgba(255,45,85,.3); border-right: 2px solid rgba(255,45,85,.3); }

/* ── REC bar enhancement ── */
/* background removed — no dark overlay bar */

/* ═══════════════════════════════════════════════════
   MULTI-SOURCE INTELLIGENCE STATUS BAR
   ═══════════════════════════════════════════════════ */
.hz-msrc-bar {
  position: absolute;
  bottom: 12px; left: 50%;
  transform: translateX(-50%);
  z-index: 1200;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  background: rgba(8,12,18,.92);
  border: 1px solid rgba(0,229,255,.18);
  border-radius: 8px;
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 20px rgba(0,0,0,.5), 0 0 30px rgba(0,229,255,.06);
  font-family: var(--fm);
  font-size: 11px;
  white-space: nowrap;
  animation: msrcSlideIn 0.8s ease-out;
}
@keyframes msrcSlideIn {
  from { opacity: 0; transform: translateX(-50%) translateY(20px); }
  to { opacity: 1; transform: translateX(-50%) translateY(0); }
}
.hz-msrc-title {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #00e5ff;
  font-family: var(--fd);
  font-size: 9px;
  letter-spacing: 1.5px;
  font-weight: 700;
  padding-right: 10px;
  border-right: 1px solid rgba(0,229,255,.15);
}
.hz-msrc-icon { font-size: 13px; }
.hz-msrc-sources {
  display: flex;
  align-items: center;
  gap: 2px;
}
.hz-msrc-src {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 4px;
  transition: all .3s;
  cursor: default;
}
.hz-msrc-src:hover {
  background: rgba(0,229,255,.08);
}
.hz-msrc-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  transition: all .3s;
}
.hz-msrc-pending {
  background: #555;
  animation: msrcBlink 1.5s ease-in-out infinite;
}
.hz-msrc-on {
  background: #00e676;
  box-shadow: 0 0 8px rgba(0,230,118,.5);
}
.hz-msrc-warn {
  background: #ffab00;
  box-shadow: 0 0 8px rgba(255,171,0,.5);
}
.hz-msrc-off {
  background: #555;
}
.hz-msrc-err {
  background: #ff2d55;
  box-shadow: 0 0 8px rgba(255,45,85,.5);
}
@keyframes msrcBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}
.hz-msrc-name {
  color: var(--txt2);
  font-size: 10px;
  font-weight: 500;
}
.hz-msrc-val {
  color: #fff;
  font-family: var(--fm);
  font-size: 10px;
  font-weight: 600;
  min-width: 16px;
  text-align: center;
}

/* Active source highlight */
.hz-msrc-src.msrc-active .hz-msrc-name { color: #00e5ff; }
.hz-msrc-src.msrc-active .hz-msrc-val { color: #00e5ff; font-weight: 700; }

/* ═══ DATA FRESHNESS CLOCK ═══ */
.hz-freshness-clock {
  display: none;
  position: absolute;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1080;
  background: rgba(0,10,20,.85);
  border: 1px solid rgba(0,229,255,.25);
  border-radius: 6px;
  padding: 4px 14px;
  font-family: var(--fm);
  font-size: 10px;
  color: #8cf;
  letter-spacing: .3px;
  white-space: nowrap;
  backdrop-filter: blur(8px);
  pointer-events: none;
  transition: border-color .4s, background .4s;
}
.hz-freshness-clock.hz-fc-stale {
  border-color: rgba(255,80,80,.6);
  background: rgba(40,0,0,.88);
  color: #ffa;
  animation: freshness-pulse 1.5s infinite;
}
@keyframes freshness-pulse {
  0%,100% { opacity: 1; }
  50% { opacity: .7; }
}
.fc-waiting { color: #889; }

.hz-stale-badge {
  position: absolute;
  top: 106px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1081;
  background: rgba(255,40,40,.88);
  color: #fff;
  font-family: var(--fm);
  font-size: 11px;
  font-weight: 700;
  padding: 3px 12px;
  border-radius: 4px;
  letter-spacing: .5px;
  pointer-events: none;
  animation: freshness-pulse 1.2s infinite;
}

/* Heatmap no-data overlay */
.heatmap-nodata {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 900;
  text-align: center;
  pointer-events: none;
}
.heatmap-nodata-warn {
  font-size: 28px;
  color: rgba(255,255,255,.4);
  font-family: var(--fm);
  letter-spacing: 2px;
}

/* Heatmap live timestamp label */
.heatmap-ts-label {
  position: absolute;
  bottom: 4px;
  right: 10px;
  z-index: 910;
  pointer-events: none;
}
.hm-ts {
  font-family: var(--fm);
  font-size: 9px;
  color: rgba(0,229,255,.5);
  background: rgba(0,10,20,.6);
  padding: 2px 6px;
  border-radius: 3px;
}

/* ── Satellite orbit arc on map (visible at all zoom) ── */
.sat-orbit-arc { opacity: .5; }
.sat-marker-div { background: none !important; border: none !important; z-index: 800 !important; }

/* ═══════════════════════════════════════════════════
   BATTLEFIELD VISUALIZATION — Heatmap, Patrols, Strikes
   ═══════════════════════════════════════════════════ */

/* ── GPS Jamming Zone ── */
.gps-jam-zone { animation: jamPulse 3s ease-in-out infinite; }
.gps-jam-pulse { animation: jamPulse 2s ease-in-out infinite alternate; }
@keyframes jamPulse {
  0% { opacity: 0.3; }
  50% { opacity: 0.8; }
  100% { opacity: 0.3; }
}

/* ── No-Fly Zone ── */
.nofly-zone { transition: fill-opacity 0.3s; }
.nofly-zone:hover { fill-opacity: 0.15 !important; }
.nofly-label { background: none !important; border: none !important; pointer-events: none; z-index: 600 !important; }
.nofly-label-inner {
  font: 700 11px var(--fm);
  letter-spacing: 2px;
  opacity: 0.5;
  animation: noflyBlink 4s ease-in-out infinite;
}
@keyframes noflyBlink {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.7; }
}
.hz-nofly-tooltip {
  background: rgba(10,14,26,0.92) !important;
  border: 1px solid rgba(255,34,34,0.3) !important;
  color: #ff6644 !important;
  font: 600 12px var(--fm) !important;
}

/* ── Strike Zones ── */
.strike-zone-pulse { animation: strikePulse 2s ease-in-out infinite; }
.strike-core-pulse { animation: strikePulse 1.5s ease-in-out infinite alternate; }
@keyframes strikePulse {
  0% { opacity: 0.3; stroke-opacity: 0.3; }
  50% { opacity: 1; stroke-opacity: 1; }
  100% { opacity: 0.3; stroke-opacity: 0.3; }
}
.strike-marker { background: none !important; border: none !important; pointer-events: auto; z-index: 700 !important; }
.strike-marker-inner {
  font-size: 20px;
  text-align: center;
  animation: strikeGlow 2s ease-in-out infinite;
  cursor: pointer;
}
@keyframes strikeGlow {
  0%, 100% { filter: brightness(1); transform: scale(1); }
  50% { filter: brightness(1.5); transform: scale(1.15); }
}
.strike-marker-label {
  font: 600 9px var(--fm);
  text-align: center;
  margin-top: 2px;
  opacity: 0.8;
  white-space: nowrap;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.strike-popup-container .leaflet-popup-content-wrapper {
  background: rgba(10,14,26,0.95) !important;
  border: 1px solid rgba(255,0,0,0.3) !important;
  border-radius: 6px !important;
}
.strike-popup-container .leaflet-popup-tip { background: rgba(10,14,26,0.95) !important; }
.strike-popup { font: 12px var(--fm); color: #e8e4dc; }
.strike-popup-hdr {
  padding: 6px 10px;
  margin-bottom: 6px;
  font-size: 13px;
}
.strike-popup-body {
  padding: 4px 10px 8px;
  font-size: 11px;
  line-height: 1.6;
  color: #a8a49a;
}
.strike-popup-body div { margin-bottom: 2px; }

/* ── Missile Fan & Ballistic Arc ── */
.missile-fan { transition: fill-opacity 0.3s; }
.missile-fan:hover { fill-opacity: 0.12 !important; }
.ballistic-arc { animation: arcFlow 2s linear infinite; }
@keyframes arcFlow {
  0% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: -28; }
}
.ballistic-impact { animation: impactPulse 2s ease-in-out infinite; }
@keyframes impactPulse {
  0%, 100% { r: 4; opacity: 0.5; }
  50% { r: 8; opacity: 1; }
}

/* ── Patrol Routes ── */
.patrol-route { transition: opacity 0.3s; }
.patrol-trail { opacity: 0.9; }
.patrol-ship-marker { background: none !important; border: none !important; z-index: 750 !important; }
.patrol-ship {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.patrol-ship-icon {
  font-size: 18px;
  animation: shipBob 3s ease-in-out infinite;
}
@keyframes shipBob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}
.patrol-ship-name {
  font: 600 10px var(--fm);
  opacity: 0.9;
}

/* ── Aircraft Patrol ── */
.patrol-aircraft-marker { background: none !important; border: none !important; z-index: 780 !important; }
.patrol-aircraft {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.patrol-ac-label {
  font: 500 9px var(--fm);
  opacity: 0.85;
}
.route-arrow { background: none !important; border: none !important; pointer-events: none; }

/* ── Live Flight Trails ── */
.live-flight-trail { opacity: 0.6; }
.live-flight-trail-ghost { opacity: 0.12; }

/* ── Mil Patrol Route ── */
.mil-patrol-route { opacity: 0.5; }
.mil-patrol-shadow { opacity: 0.15; }

/* ══════════════ Carrier Strike Group Tracker ══════════════ */
.carrier-marker-div{
  background:none!important;border:none!important;
  filter:drop-shadow(0 0 10px rgba(0,191,255,.35));
  cursor:pointer;
  transition:filter .3s;
}
.carrier-marker-div:hover{
  filter:drop-shadow(0 0 20px rgba(0,191,255,.6)) brightness(1.2);
}
@keyframes carrierPulse{
  0%{transform:scale(1);opacity:.6}
  50%{transform:scale(1.45);opacity:.15}
  100%{transform:scale(1);opacity:.6}
}
.carrier-popup .leaflet-popup-content-wrapper{
  background:rgba(10,14,20,.97)!important;
  border:1px solid rgba(0,191,255,.3)!important;
  border-radius:6px!important;
  box-shadow:0 8px 32px rgba(0,0,0,.6),0 0 40px rgba(0,191,255,.08)!important;
}
.carrier-popup .leaflet-popup-tip{
  background:rgba(10,14,20,.97)!important;
  border:1px solid rgba(0,191,255,.15)!important;
}
.carrier-popup .leaflet-popup-content{
  margin:0!important;
  padding:0!important;
}
.carrier-popup .leaflet-popup-close-button{
  color:#555!important;
  font-size:18px!important;
  top:6px!important;right:8px!important;
}
.carrier-popup .leaflet-popup-close-button:hover{
  color:#00bfff!important;
}

/* ═══════════════════════════════════════════════════════
   INSS LIONS' ROAR — Premium War Stats Dashboard
   ═══════════════════════════════════════════════════════ */
.inss-dashboard{
  position:relative;
  background:linear-gradient(135deg,rgba(8,12,20,.95) 0%,rgba(15,22,36,.92) 50%,rgba(8,12,20,.95) 100%);
  border:1px solid rgba(200,164,90,.15);
  border-radius:14px;
  padding:0;
  margin-bottom:1.2rem;
  overflow:hidden;
  backdrop-filter:blur(20px);
  box-shadow:
    0 4px 40px rgba(0,0,0,.5),
    0 0 80px rgba(200,164,90,.04),
    inset 0 1px 0 rgba(200,164,90,.08);
}
.inss-dashboard::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 20% 0%,rgba(200,164,90,.06) 0%,transparent 50%),
    radial-gradient(ellipse at 80% 100%,rgba(196,60,60,.04) 0%,transparent 50%);
  pointer-events:none;z-index:0;
}
.inss-dashboard::after{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent 0%,rgba(200,164,90,.4) 30%,rgba(200,164,90,.6) 50%,rgba(200,164,90,.4) 70%,transparent 100%);
  z-index:2;
}

/* ── Header ── */
.inss-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:1rem 1.4rem;
  border-bottom:1px solid rgba(200,164,90,.1);
  position:relative;z-index:1;
}
.inss-header-left{display:flex;align-items:center;gap:.8rem}
.inss-logo-mark{
  position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center;
}
.inss-logo-icon{font-size:1.6rem;position:relative;z-index:1;filter:drop-shadow(0 0 8px rgba(200,164,90,.4))}
.inss-logo-glow{
  position:absolute;inset:-4px;border-radius:50%;
  background:radial-gradient(circle,rgba(200,164,90,.2),transparent 70%);
  animation:inssLogoGlow 3s ease-in-out infinite;
}
@keyframes inssLogoGlow{
  0%,100%{opacity:.4;transform:scale(1)}
  50%{opacity:.8;transform:scale(1.15)}
}
.inss-title{
  font-family:var(--fo);font-size:.95rem;font-weight:700;
  letter-spacing:3px;color:var(--gold);
  text-shadow:0 0 20px rgba(200,164,90,.3);
}
.inss-subtitle{
  font-family:var(--fn);font-size:.72rem;color:var(--txt3);
  letter-spacing:.5px;margin-top:2px;
}
.inss-header-right{display:flex;align-items:center;gap:1rem}
.inss-war-day{
  display:flex;flex-direction:column;align-items:center;
  background:rgba(196,60,60,.12);
  border:1px solid rgba(196,60,60,.3);
  border-radius:8px;padding:.3rem .7rem;
  position:relative;overflow:hidden;
}
.inss-war-day::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(196,60,60,.1),transparent);
  pointer-events:none;
}
.inss-day-label{
  font-family:var(--fo);font-size:.55rem;color:rgba(196,60,60,.7);
  letter-spacing:2px;font-weight:600;
}
.inss-day-num{
  font-family:var(--fo);font-size:1.5rem;font-weight:800;
  color:#ff4444;text-shadow:0 0 15px rgba(255,68,68,.4);
  line-height:1.1;
}
.inss-refresh-btn{
  width:36px;height:36px;border-radius:8px;border:1px solid rgba(200,164,90,.2);
  background:rgba(200,164,90,.08);color:var(--gold);font-size:1.1rem;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:all .3s ease;
}
.inss-refresh-btn:hover{
  background:rgba(200,164,90,.2);border-color:rgba(200,164,90,.4);
  transform:rotate(180deg);
}
.inss-refresh-btn.loading .inss-refresh-icon{
  animation:spin 1s linear infinite;
}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* ── Hero Stats Row ── */
.inss-hero-row{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0;
  position:relative;z-index:1;
  border-bottom:1px solid rgba(200,164,90,.08);
}
.inss-hero-card{
  position:relative;
  padding:1.1rem .6rem .9rem;
  text-align:center;
  border-right:1px solid rgba(200,164,90,.06);
  transition:all .4s cubic-bezier(.23,1,.32,1);
  overflow:hidden;
  cursor:default;
}
.inss-hero-card:last-child{border-right:none}
.inss-hero-card:hover{
  background:rgba(200,164,90,.04);
}
.inss-hero-card:hover .inss-hero-glow{opacity:1}
.inss-hero-glow{
  position:absolute;bottom:0;left:50%;transform:translateX(-50%);
  width:60%;height:3px;border-radius:3px 3px 0 0;
  opacity:.5;transition:opacity .4s ease;
}
.inss-hero-rockets .inss-hero-glow{background:linear-gradient(90deg,transparent,#ff6b35,transparent);box-shadow:0 0 15px rgba(255,107,53,.4)}
.inss-hero-intercept .inss-hero-glow{background:linear-gradient(90deg,transparent,#4caf50,transparent);box-shadow:0 0 15px rgba(76,175,80,.4)}
.inss-hero-idf .inss-hero-glow{background:linear-gradient(90deg,transparent,#2196f3,transparent);box-shadow:0 0 15px rgba(33,150,243,.4)}
.inss-hero-strikes .inss-hero-glow{background:linear-gradient(90deg,transparent,#ffd740,transparent);box-shadow:0 0 15px rgba(255,215,64,.4)}
.inss-hero-displaced .inss-hero-glow{background:linear-gradient(90deg,transparent,#ff9800,transparent);box-shadow:0 0 15px rgba(255,152,0,.4)}
.inss-hero-iran-cas .inss-hero-glow{background:linear-gradient(90deg,transparent,#ff6e40,transparent);box-shadow:0 0 15px rgba(255,110,64,.4)}

.inss-hero-icon{
  font-size:1.4rem;margin-bottom:.3rem;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.3));
}
.inss-hero-num{
  font-family:var(--fo);font-size:2rem;font-weight:800;
  color:#fff;letter-spacing:1px;
  line-height:1.1;margin-bottom:.3rem;
  text-shadow:0 2px 12px rgba(0,0,0,.5);
  transition:all .3s ease;
}
.inss-hero-rockets .inss-hero-num{color:#ff6b35}
.inss-hero-intercept .inss-hero-num{color:#4caf50}
.inss-hero-idf .inss-hero-num{color:#5c9df5}
.inss-hero-strikes .inss-hero-num{color:#ffd740}
.inss-hero-displaced .inss-hero-num{color:#ff9800}
.inss-hero-iran-cas .inss-hero-num{color:#ff6e40}

.inss-hero-label{
  font-family:var(--fn);font-size:.72rem;color:rgba(255,255,255,.75);
  line-height:1.3;letter-spacing:.3px;
}
.inss-hero-sub{display:none}
/* INSS source link */
.inss-source-link{
  color:rgba(200,164,90,.6);text-decoration:none;
  border-bottom:1px dotted rgba(200,164,90,.3);
  transition:all .3s ease;
}
.inss-source-link:hover{
  color:var(--gold);border-bottom-color:var(--gold);
}

/* Number count-up animation */
.inss-hero-num.counting{
  animation:inssCountPulse .08s ease-in-out infinite alternate;
}
@keyframes inssCountPulse{
  from{opacity:.85}to{opacity:1}
}
/* Glitch micro-effect on hover */
.inss-hero-card:hover .inss-hero-num{
  text-shadow:0 0 20px currentColor,.5px 0 0 rgba(255,0,0,.3),-.5px 0 0 rgba(0,255,255,.3);
}

/* ── Multi-Front Cards ── */
.inss-fronts{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.6rem;
  padding:.9rem 1rem;
  position:relative;z-index:1;
}
.inss-front-card{
  position:relative;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(200,164,90,.1);
  border-radius:10px;
  padding:.8rem .9rem;
  transition:all .4s cubic-bezier(.23,1,.32,1);
  overflow:hidden;
}
.inss-front-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.02),transparent 40%);
  pointer-events:none;border-radius:10px;
}
.inss-front-card:hover{
  border-color:rgba(200,164,90,.2);
  background:rgba(200,164,90,.04);
  transform:translateY(-2px);
  box-shadow:0 8px 25px rgba(0,0,0,.3);
}
.inss-front-indicator{
  position:absolute;top:0;left:0;right:0;height:2px;border-radius:2px 2px 0 0;
}
.inss-status-active .inss-front-indicator,
.inss-front-indicator.inss-status-active{
  background:linear-gradient(90deg,rgba(255,68,68,.8),rgba(255,107,53,.6));
  box-shadow:0 0 10px rgba(255,68,68,.3);
  animation:inssStatusPulse 2s ease-in-out infinite;
}
.inss-status-moderate .inss-front-indicator,
.inss-front-indicator.inss-status-moderate{
  background:linear-gradient(90deg,rgba(255,152,0,.7),rgba(255,193,7,.5));
  box-shadow:0 0 8px rgba(255,152,0,.2);
}
.inss-status-critical .inss-front-indicator,
.inss-front-indicator.inss-status-critical{
  background:linear-gradient(90deg,rgba(255,0,0,.9),rgba(255,68,68,.7));
  box-shadow:0 0 12px rgba(255,0,0,.4);
  animation:inssStatusPulse 1.2s ease-in-out infinite;
}
.inss-status-ceasefire .inss-front-indicator,
.inss-front-indicator.inss-status-ceasefire{
  background:linear-gradient(90deg,rgba(76,175,80,.6),rgba(129,199,132,.4));
}
@keyframes inssStatusPulse{
  0%,100%{opacity:1}50%{opacity:.4}
}

.inss-front-header{
  display:flex;align-items:center;gap:.5rem;margin-bottom:.6rem;
}
.inss-front-flag{font-size:1.1rem;flex-shrink:0}
.inss-front-name{
  font-family:var(--fn);font-size:.85rem;font-weight:700;color:#fff;
  white-space:nowrap;flex-shrink:0;
}
.inss-front-status{
  font-family:var(--fm);font-size:.58rem;
  padding:2px 8px;border-radius:4px;
  background:rgba(196,60,60,.15);color:#ff6b6b;
  border:1px solid rgba(196,60,60,.2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:180px;
  flex-shrink:1;min-width:0;
}

.inss-front-stats{
  display:grid;grid-template-columns:1fr 1fr;gap:.4rem;
}
.inss-fs{
  display:flex;flex-direction:column;
  padding:.35rem .45rem;
  background:rgba(0,0,0,.2);
  border-radius:6px;
  border:1px solid rgba(255,255,255,.05);
}
.inss-fs-val{
  font-family:var(--fo);font-size:1.1rem;font-weight:800;
  color:#fff;letter-spacing:.5px;
  text-shadow:0 1px 8px rgba(0,0,0,.4);
}
.inss-fs-lbl{
  font-family:var(--fn);font-size:.62rem;color:rgba(255,255,255,.5);
  letter-spacing:.3px;margin-top:1px;
}

/* ── Footer / 24h Changes ── */
.inss-footer{
  padding:.6rem 1rem;
  border-top:1px solid rgba(200,164,90,.08);
  position:relative;z-index:1;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:.4rem;
}
.inss-changes{
  display:flex;gap:.6rem;flex-wrap:wrap;flex:1;
}
.inss-change-tag{
  font-family:var(--fm);font-size:.66rem;
  padding:3px 10px;border-radius:5px;
  background:rgba(255,107,53,.1);
  color:#ffab76;border:1px solid rgba(255,107,53,.18);
  display:flex;align-items:center;gap:.3rem;
  line-height:1.4;
}
.inss-change-tag .up{color:#ff4444}
.inss-change-tag .down{color:#4caf50}
.inss-meta{
  display:flex;gap:.8rem;align-items:center;
}
.inss-confidence{
  font-family:var(--fm);font-size:.6rem;
  padding:2px 8px;border-radius:4px;
  background:rgba(76,175,80,.1);color:#81c784;
  border:1px solid rgba(76,175,80,.15);
}
.inss-ts{
  font-family:var(--fm);font-size:.58rem;color:var(--txt3);
}

/* ── Ambient animated scanline for INSS ── */
.inss-dashboard>.inss-scan{
  position:absolute;left:0;right:0;height:1px;top:0;z-index:3;pointer-events:none;
  background:linear-gradient(90deg,transparent 10%,rgba(200,164,90,.2) 50%,transparent 90%);
  animation:inssScan 8s linear infinite;
}
@keyframes inssScan{
  0%{top:0;opacity:0}5%{opacity:.8}95%{opacity:.8}100%{top:100%;opacity:0}
}

/* ── Responsive: tablet ── */
@media(max-width:1024px){
  .inss-hero-row{grid-template-columns:repeat(3,1fr)}
  .inss-fronts{grid-template-columns:repeat(2,1fr)}
}
/* ── Responsive: mobile ── */
@media(max-width:640px){
  .inss-hero-row{grid-template-columns:repeat(2,1fr)}
  .inss-fronts{grid-template-columns:1fr}
  .inss-hero-num{font-size:1.3rem}
  .inss-header{flex-wrap:wrap;gap:.5rem;padding:.8rem 1rem}
  .inss-title{font-size:.8rem;letter-spacing:2px}
  .inss-footer{flex-direction:column;align-items:flex-start}
}

/* ═══════════════════════════════════════════════════
   PREDICTION HITS — "QueWi War Room 成功预测" Banner
   ═══════════════════════════════════════════════════ */

/* ── Banner container ── */
.pred-hits-wrap {
  margin: 1rem 0;
  border: 1px solid rgba(255,215,0,0.3);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(255,215,0,0.06) 0%, rgba(255,180,0,0.03) 100%);
  overflow: hidden;
  animation: predHitsGlow 3s ease-in-out infinite;
}
@keyframes predHitsGlow {
  0%,100% { box-shadow: 0 0 15px rgba(255,215,0,0.1); }
  50%     { box-shadow: 0 0 25px rgba(255,215,0,0.25); }
}
.pred-hits-header {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .8rem 1.2rem;
  background: linear-gradient(90deg, rgba(255,215,0,0.12), transparent);
  border-bottom: 1px solid rgba(255,215,0,0.15);
}
.pred-hits-icon {
  font-size: 1.3rem;
  animation: predPulse 2s ease-in-out infinite;
}
@keyframes predPulse {
  0%,100% { transform: scale(1); }
  50%     { transform: scale(1.15); }
}
.pred-hits-title {
  font-family: var(--fd);
  font-size: .75rem;
  letter-spacing: 2px;
  color: var(--gold);
  text-transform: uppercase;
  font-weight: 600;
}
.pred-hits-count {
  margin-left: auto;
  font-family: var(--fd);
  font-size: .65rem;
  letter-spacing: 1px;
  color: var(--txt3);
  background: rgba(255,215,0,0.1);
  padding: .2rem .6rem;
  border-radius: 20px;
  border: 1px solid rgba(255,215,0,0.2);
}

/* ── Hit cards list ── */
.pred-hits-list {
  padding: .6rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  max-height: 400px;
  overflow-y: auto;
}
.pred-hit-card {
  background: rgba(255,215,0,0.04);
  border: 1px solid rgba(255,215,0,0.12);
  border-radius: 8px;
  padding: .7rem .9rem;
  transition: all .25s;
}
.pred-hit-card:hover {
  background: rgba(255,215,0,0.08);
  border-color: rgba(255,215,0,0.25);
}
.pred-hit-badge {
  display: inline-block;
  font-family: var(--fd);
  font-size: .6rem;
  letter-spacing: 1.5px;
  color: #000;
  background: linear-gradient(135deg, #ffd700, #ffaa00);
  padding: .15rem .5rem;
  border-radius: 4px;
  font-weight: 700;
  margin-bottom: .4rem;
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}
.pred-hit-meta {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-bottom: .3rem;
}
.pred-hit-model {
  font-family: var(--fd);
  font-size: .6rem;
  letter-spacing: 1px;
  font-weight: 600;
}
.pred-hit-delta {
  font-size: .65rem;
  color: var(--green);
  font-weight: 600;
  background: rgba(0,230,118,0.1);
  padding: .1rem .4rem;
  border-radius: 10px;
  border: 1px solid rgba(0,230,118,0.2);
}
.pred-hit-label {
  font-weight: 600;
  color: var(--txt3);
  font-size: .7rem;
}
.pred-hit-prediction {
  font-size: .78rem;
  color: var(--txt1);
  line-height: 1.5;
  margin-bottom: .25rem;
  padding: .3rem .5rem;
  background: rgba(255,215,0,0.06);
  border-radius: 4px;
  border-left: 3px solid var(--gold);
}
.pred-hit-news {
  font-size: .72rem;
  color: var(--txt2);
  line-height: 1.4;
  margin-bottom: .3rem;
}
.pred-hit-news a {
  color: var(--accent);
  text-decoration: none;
}
.pred-hit-news a:hover {
  text-decoration: underline;
}
.pred-hit-stamp {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
  margin-top: .3rem;
}
.pred-hit-quewi {
  font-family: var(--fd);
  font-size: .6rem;
  letter-spacing: .8px;
  color: var(--gold);
  font-style: italic;
  opacity: .9;
}
.pred-hit-kw {
  display: flex;
  flex-wrap: wrap;
  gap: .2rem;
}
.pred-kw-tag {
  font-size: .55rem;
  padding: .1rem .3rem;
  border-radius: 3px;
  background: rgba(255,215,0,0.1);
  border: 1px solid rgba(255,215,0,0.15);
  color: var(--txt3);
  font-family: var(--fd);
  letter-spacing: .5px;
}

/* ── Inline hit badge in leader predictions ── */
.ldr2-pred-hit {
  background: rgba(255,215,0,0.06) !important;
  border: 1px solid rgba(255,215,0,0.2) !important;
  position: relative;
}
.ldr2-pred-hit::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 20px rgba(255,215,0,0.08);
  pointer-events: none;
}
.ldr2-hit-badge {
  font-family: var(--fd);
  font-size: .5rem;
  letter-spacing: 1px;
  color: #000;
  background: linear-gradient(135deg, #ffd700, #ffaa00);
  padding: .12rem .4rem;
  border-radius: 3px;
  font-weight: 700;
  text-shadow: 0 1px 1px rgba(0,0,0,0.15);
  margin-left: auto;
  animation: hitBadgePulse 2s ease-in-out infinite;
}
@keyframes hitBadgePulse {
  0%,100% { opacity: 1; }
  50%     { opacity: .7; }
}
.ldr2-pred-hit-stamp {
  font-family: var(--fd);
  font-size: .58rem;
  letter-spacing: .5px;
  color: var(--gold);
  font-style: italic;
  margin-top: .3rem;
  padding: .25rem .4rem;
  background: linear-gradient(90deg, rgba(255,215,0,0.08), transparent);
  border-radius: 4px;
  border-left: 2px solid var(--gold);
}

/* ── Responsive ── */
@media(max-width:640px){
  .pred-hits-header { flex-wrap:wrap; padding:.6rem .8rem; }
  .pred-hits-title { font-size:.65rem; }
  .pred-hit-card { padding:.5rem .6rem; }
  .pred-hit-prediction { font-size:.72rem; }
  .pred-hit-stamp { flex-direction:column; align-items:flex-start; }
}

/* ═══════════════════════════════════════════════════════════════════
   ROUND 10: ULTRA VISUAL COMFORT — iOS / Android / iPad
   Full device adaptation for high visual comfort (高度视觉舒适感)
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. Global Mobile Typography & Rendering ── */
@media(max-width:1024px){
  html{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
  }
  body{
    /* Prevent overscroll bounce (iOS Safari) */
    overscroll-behavior-y:none;
    /* Better Chinese text rendering */
    font-feature-settings:'palt','kern';
    word-break:break-word;
    -webkit-hyphens:auto;
    hyphens:auto;
  }
  /* Smoother Chinese text line heights for readability */
  .wg-section-body,
  .dash-event,
  .nfp-body,
  .nr-body-cn,
  .div-model-val,
  .tl-block-body,
  .ldr2-stance,
  .ldr2-quote,
  .ldr2-pred-move,
  .fac-text,
  .hz-ai-intel-summary{
    line-height:2;
    letter-spacing:.3px;
  }
}

/* ── 2. iPad Pro / iPad Air (landscape & portrait) 769–1366px ── */
@media(min-width:769px) and (max-width:1366px){
  /* Hormuz: stack sidebar below map on iPad portrait */
  .hormuz-body{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto;
  }
  .hormuz-stats{
    border-left:none;
    border-top:1px solid var(--border);
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:.4rem;
    padding:.6rem;
    max-height:none;
    overflow-y:visible;
  }
  .hormuz-map{min-height:380px!important}

  /* Map stats bar: better spacing on iPad */
  .hz-map-stats{
    flex-wrap:wrap;
    justify-content:center;
  }
  .hz-mstat{
    min-width:auto;
    flex:1 1 16%;
    padding:.5rem .4rem;
  }

  /* INSS hero row: 3 cols on iPad */
  .inss-hero-row{grid-template-columns:repeat(3,1fr)}
  .inss-fronts{grid-template-columns:repeat(2,1fr)}
  .inss-hero-num{font-size:1.8rem}

  /* Multi-source bar: grid layout for iPad */
  .hz-msrc-bar{
    flex-direction:column;
    align-items:center;
    gap:6px;
    padding:8px 14px;
    max-width:420px;
    white-space:normal;
  }
  .hz-msrc-sources{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:4px 8px;
    width:100%;
  }
  .hz-msrc-src{
    justify-content:center;
  }

  /* Wargame card grids */
  .wg-cards{grid-template-columns:repeat(2,1fr)}
  .leader-grid-v2{grid-template-columns:repeat(2,1fr)}

  /* Better risk matrix on iPad */
  .risk-matrix-grid{grid-template-columns:1fr 1fr}

  /* Compare tables: ensure they don't overflow */
  .ct-table{font-size:.78rem}

  /* News popup: centered with nice size */
  .news-float-popup{
    width:min(600px,88vw)!important;
    max-height:88vh;
    border-radius:10px!important;
  }

  /* Model detail modal: nice iPad frame */
  .model-detail-modal{
    max-width:88vw;
    max-height:88vh;
    border-radius:8px;
  }

  /* Prediction hits: 2 col on wider iPads */
  .pred-hits-list{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.5rem;
  }
}

/* ── 3. iPad Portrait specific (768-834px) ── */
@media(min-width:768px) and (max-width:834px){
  /* Slightly smaller fonts for iPad Mini */
  html{font-size:15.5px}

  .hormuz-map{min-height:340px!important}

  /* Stack Hormuz overlays */
  .hormuz-stats{
    grid-template-columns:repeat(2,1fr);
  }

  /* Force comparison bars: ensure readable */
  .fcb-track{height:30px}
  .fcb-fill-red,.fcb-fill-blue{font-size:.62rem}

  /* INSS cards: prevent cramping */
  .inss-front-card{padding:.7rem}
  .inss-front-stats{gap:.35rem}
}

/* ── 4. Phone Visual Comfort (max-width:480px) ── */
@media(max-width:480px){
  /* Breathing room: generous padding for thumb navigation */
  .compare-body{padding:.6rem!important}
  .panel-header{padding:.55rem .7rem}

  /* Larger, more readable text on phones */
  .dash-event{
    font-size:.85rem;
    line-height:2;
    padding:.4rem 0;
  }
  .dash-card{padding:.7rem}
  .dash-value{font-size:1.1rem}
  .dash-label{font-size:.72rem}

  /* Better force comparison readability */
  .fcb-track{height:28px;border-radius:14px}
  .fcb-fill-red,.fcb-fill-blue{font-size:.6rem}
  .fcb-label{font-size:.78rem;margin-bottom:.2rem}

  /* Escalation gauge: taller for readability */
  .esc-gauge-track{height:24px}
  .esc-gauge-val{font-size:.78rem;letter-spacing:1px}
  .esc-gauge-labels{font-size:.62rem}

  /* INSS dashboard phone comfort */
  .inss-header{
    padding:.7rem .8rem;
    flex-wrap:wrap;
    gap:.4rem;
  }
  .inss-logo-mark{width:32px;height:32px}
  .inss-logo-icon{font-size:1.3rem}
  .inss-title{font-size:.78rem;letter-spacing:2px}
  .inss-hero-row{grid-template-columns:repeat(2,1fr)!important}
  .inss-hero-card{padding:.8rem .5rem .7rem}
  .inss-hero-num{font-size:1.4rem!important}
  .inss-hero-label{font-size:.68rem}
  .inss-fronts{
    grid-template-columns:1fr!important;
    gap:.5rem;
    padding:.7rem;
  }
  .inss-front-card{padding:.7rem .8rem}
  .inss-front-name{font-size:.82rem}
  .inss-fs-val{font-size:1rem}
  .inss-fs-lbl{font-size:.62rem}
  .inss-footer{
    padding:.5rem .7rem;
    flex-direction:column;
    gap:.4rem;
    align-items:flex-start;
  }
  .inss-change-tag{font-size:.62rem;padding:3px 8px}

  /* Better Hormuz on phone */
  .hormuz-body{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto;
  }
  .hormuz-stats{
    border-left:none!important;
    border-top:1px solid var(--border);
    display:flex;
    flex-direction:column;
    max-height:none;
    overflow-y:visible;
    padding:.5rem;
    gap:.4rem;
  }
  .hormuz-map{min-height:240px!important}

  /* Map stats: scrollable on phone */
  .hz-map-stats{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .hz-map-stats::-webkit-scrollbar{display:none}
  .hz-mstat{
    min-width:80px;
    flex:0 0 auto;
    padding:.4rem .3rem;
  }

  /* Multi-source intelligence bar: compact grid on phone */
  .hz-msrc-bar{
    flex-direction:column;
    align-items:center;
    gap:5px;
    padding:8px 10px;
    font-size:10px;
    max-width:min(320px, 92vw);
    bottom:8px;
    white-space:normal;
    border-radius:10px;
  }
  .hz-msrc-title{
    font-size:8px;
    padding-right:0;
    border-right:none;
    width:100%;
    justify-content:center;
    padding-bottom:4px;
    margin-bottom:2px;
    border-bottom:1px solid rgba(0,229,255,.12);
  }
  .hz-msrc-icon{font-size:11px}
  .hz-msrc-sources{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:4px 6px;
    width:100%;
  }
  .hz-msrc-src{
    padding:3px 4px;
    justify-content:center;
    gap:3px;
    border-radius:4px;
    background:rgba(0,229,255,.04);
  }
  .hz-msrc-dot{width:6px;height:6px}
  .hz-msrc-name{font-size:8.5px;letter-spacing:.2px}
  .hz-msrc-val{font-size:8.5px;min-width:14px}

  /* AI Intel panel: better readability */
  .hz-ai-intel-summary{
    font-size:.78rem;
    line-height:1.8;
    padding:.45rem .55rem;
  }
  .hz-intel-event{
    padding:.4rem .5rem;
    min-height:48px;
  }
  .hz-ie-title{font-size:.72rem}
  .hz-ie-detail{font-size:.65rem;line-height:1.6}

  /* Oil prices: better tap targets */
  .hz-oil-card{
    padding:.5rem .65rem;
    min-height:44px;
  }
  .hz-oil-price{font-size:.92rem}
  .hz-oil-label{font-size:.62rem}
  .hz-oil-change{font-size:.68rem;padding:.15rem .4rem}

  /* Prediction hits on phone */
  .pred-hits-list{
    max-height:300px;
  }
  .pred-hit-card{padding:.6rem .7rem}
  .pred-hit-prediction{font-size:.78rem;line-height:1.7}

  /* Globe toggle: repositioned for phone */
  .hz-dim-toggle{
    bottom:55px;
    left:10px;
    padding:6px 10px;
    font-size:10px;
    border-radius:20px;
  }

  /* Freshness clock: don't overlap map controls */
  .hz-freshness-clock{
    top:auto;
    bottom:45px;
    font-size:9px;
    padding:3px 10px;
  }

  /* Better chat on phone */
  .chat-msgs{
    max-height:200px;
    padding:.5rem .7rem;
  }
  .chat-msg{
    padding:.5rem .7rem;
    font-size:.85rem;
    line-height:1.85;
    border-radius:6px;
  }
  .chat-msg.user{margin-left:.5rem}
  .chat-msg.ai{margin-right:.5rem}
  .chat-row textarea{
    min-height:44px;
    padding:.45rem;
    font-size:.85rem;
    border-radius:6px;
  }
  .chat-send-btn{
    min-height:44px;
    min-width:52px;
    border-radius:6px;
    font-size:.78rem;
  }

  /* Personal wargame modal: fullscreen on phone */
  .personal-wg-modal{
    width:100%!important;
    max-width:100vw!important;
    max-height:100vh!important;
    border-radius:0!important;
  }
  .pwg-body{
    font-size:.88rem;
    line-height:2;
  }
}

/* ── 5. iPhone Pro Max / Samsung Ultra (tall phones 430px) ── */
@media(max-width:430px){
  /* Take advantage of extra height */
  .hormuz-map{min-height:260px!important}
  .chat-msgs{max-height:220px}
  .hz-ai-intel-events{max-height:180px}

  /* Multi-source Intel: perfect 430px fit */
  .hz-msrc-bar{
    max-width:min(300px, 88vw);
    padding:7px 10px;
    gap:4px;
  }
  .hz-msrc-sources{
    grid-template-columns:repeat(3, 1fr);
    gap:3px 5px;
  }
  .hz-msrc-src{
    padding:3px 3px;
    gap:2px;
  }
  .hz-msrc-name{font-size:8px}
  .hz-msrc-val{font-size:8px}

  /* Better spaced INSS */
  .inss-hero-card{padding:.85rem .5rem .75rem}

  /* News items: comfortable thumb reach */
  .news-item{
    padding:.65rem .75rem;
    gap:.5rem;
    min-height:56px;
  }
  .news-item-title{
    font-size:.9rem;
    line-height:1.65;
  }
  .news-item-summary{
    font-size:.78rem;
    line-height:1.55;
    -webkit-line-clamp:2;
  }
}

/* ── 6. iPhone SE / Small Android (375px and below) ── */
@media(max-width:375px){
  html{font-size:14px}

  /* INSS: tighter but readable */
  .inss-hero-num{font-size:1.2rem!important}
  .inss-hero-label{font-size:.62rem}
  .inss-hero-card{padding:.7rem .4rem .6rem}
  .inss-front-stats{grid-template-columns:1fr}

  /* Topbar: ultra-compact */
  .topbar{padding:.35rem .45rem}
  .topbar-center{display:none!important}
  .logo-txt{font-size:.65rem;letter-spacing:1.5px}

  /* Smaller map */
  .hormuz-map{min-height:200px!important}

  /* Oil section: stack on tiny screens */
  .hz-oil-card{
    flex-wrap:wrap;
    gap:.3rem;
  }
  .hz-oil-label{min-width:auto;flex:1 1 100%}

  /* Multi-source Intel: 2-col ultra-compact on small phones */
  .hz-msrc-bar{
    max-width:min(260px, 86vw);
    padding:6px 8px;
    gap:3px;
    bottom:6px;
    border-radius:8px;
  }
  .hz-msrc-title{
    font-size:7px;
    letter-spacing:1px;
    padding-bottom:3px;
  }
  .hz-msrc-sources{
    grid-template-columns:repeat(2, 1fr);
    gap:3px 4px;
  }
  .hz-msrc-src{
    padding:2px 3px;
    gap:2px;
  }
  .hz-msrc-dot{width:5px;height:5px}
  .hz-msrc-name{font-size:7.5px}
  .hz-msrc-val{font-size:7.5px;min-width:12px}

  /* Hide non-essential on tiny screens */
  .hz-flights-panel{display:none}
  .hz-sat-section .hz-sat-ref{display:none}
  .hz-dim-toggle{display:none}
  .hz-freshness-clock{display:none!important}

  /* Prediction hits: single col compact */
  .pred-hits-list{max-height:250px}
  .pred-hit-card{padding:.4rem .5rem}

  /* Force header: ultra-compact */
  .force-header{padding:.45rem;gap:.3rem}
  .force-flag{font-size:1.1rem}
  .force-name{font-size:.6rem;letter-spacing:1.5px}
  .force-vs{font-size:.75rem;letter-spacing:2px}
}

/* ── 7. iOS Safe Area Enhancements ── */
@supports(padding:env(safe-area-inset-top)){
  /* Full safe area coverage */
  .topbar{
    padding-top:max(.5rem,env(safe-area-inset-top));
    padding-left:max(.6rem,env(safe-area-inset-left));
    padding-right:max(.6rem,env(safe-area-inset-right));
  }
  .wfooter{
    padding-bottom:max(.6rem,env(safe-area-inset-bottom));
  }
  /* Fullscreen modals: respect notch */
  @media(max-width:480px){
    .news-float-popup{
      padding-top:env(safe-area-inset-top);
      padding-bottom:env(safe-area-inset-bottom);
    }
    .model-detail-modal{
      padding-top:env(safe-area-inset-top);
    }
    .personal-wg-modal{
      padding-top:env(safe-area-inset-top);
      padding-bottom:env(safe-area-inset-bottom);
    }
    .cine-overlay{
      padding-top:env(safe-area-inset-top);
      padding-bottom:env(safe-area-inset-bottom);
    }
  }
  /* Hormuz bottom controls: above home indicator */
  .hz-msrc-bar{
    bottom:max(12px,calc(env(safe-area-inset-bottom) + 4px));
  }
}

/* ── 8. Android-Specific Fixes ── */
@media(max-width:480px){
  /* Android Chrome address bar: avoid layout jump */
  .cine-overlay{
    height:100dvh;
    min-height:-webkit-fill-available;
  }
  .hormuz-map-wrap{
    min-height:240px;
  }
  /* Better font rendering on Android */
  body{
    text-rendering:optimizeSpeed;
    -webkit-font-smoothing:subpixel-antialiased;
  }
}

/* ── 9. Enhanced Touch Feedback (all mobile) ── */
@media(hover:none) and (pointer:coarse){
  /* Ripple-style active state for key interactive elements */
  .news-item:active{
    background:rgba(200,164,90,.06)!important;
    transition:background .1s;
  }
  .inss-hero-card:active{
    background:rgba(200,164,90,.06);
    transition:background .1s;
  }
  .inss-front-card:active{
    background:rgba(200,164,90,.06);
    transition:background .1s;
  }
  .hz-intel-event:active{
    background:rgba(200,164,90,.08);
  }
  .pred-hit-card:active{
    background:rgba(255,215,0,.1);
    border-color:rgba(255,215,0,.3);
  }

  /* Ensure all clickable elements have 44px minimum */
  .inss-refresh-btn{
    min-width:44px;min-height:44px;
    display:flex;align-items:center;justify-content:center;
  }
  .hz-flights-refresh-btn,
  .hz-intel-refresh-btn{
    min-height:36px;
    padding:.3rem .6rem;
  }
  .dash-refresh{
    min-height:40px;
    display:inline-flex;
    align-items:center;
  }

  /* Remove all hover transforms that cause jank on mobile */
  .inss-hero-card:hover,
  .inss-front-card:hover,
  .force-card:hover,
  .stat-hero:hover,
  .dash-card:hover,
  .wc-card:hover,
  .risk-matrix-card:hover,
  .ldr2-card:hover,
  .ratio-item:hover,
  .pred-hit-card:hover{
    transform:none!important;
  }

  /* Smoother scrolling for all scrollable regions */
  .hz-ai-intel-events,
  .hz-flights-list,
  .pred-hits-list,
  .hz-sat-scroll,
  .chat-msgs,
  .mdm-body,
  .nfp-scroll,
  .compare-body,
  .news-list-wrap,
  .pwg-body{
    -webkit-overflow-scrolling:touch;
    scroll-behavior:smooth;
    overscroll-behavior:contain;
  }
}

/* ── 10. Landscape Phone Optimization ── */
@media(max-height:500px) and (orientation:landscape){
  /* Compact everything for landscape phones */
  .inss-hero-row{grid-template-columns:repeat(3,1fr)!important}
  .inss-hero-card{padding:.5rem .3rem .4rem}
  .inss-hero-num{font-size:1.1rem!important}
  .inss-fronts{grid-template-columns:repeat(2,1fr)!important}

  /* Hormuz: wider map in landscape */
  .hormuz-map{min-height:200px!important}
  .hormuz-body{
    grid-template-columns:1fr 200px!important;
  }

  /* Hide verbose elements */
  .hz-msrc-title{display:none}
  .hz-msrc-bar{
    flex-direction:row;
    max-width:min(380px, 60vw);
    padding:4px 10px;
    gap:4px;
    white-space:normal;
  }
  .hz-msrc-sources{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:2px 6px;
  }
  .hz-msrc-dot{width:5px;height:5px}
  .hz-msrc-name{font-size:8px}
  .hz-msrc-val{font-size:8px}
  .inss-subtitle{display:none}
}

/* ── 11. Dark Mode Contrast Enhancement (all mobile) ── */
@media(max-width:1024px){
  /* Slightly brighter text for outdoor readability */
  .dash-event{color:rgba(236,232,224,.95)}
  .wg-section-body{color:rgba(236,232,224,.92)}
  .nfp-body{color:rgba(236,232,224,.95)}
  .ldr2-stance{color:rgba(180,176,168,.95)}
  .hz-ai-intel-summary{color:rgba(236,232,224,.92)}
  .tl-block-body{color:rgba(236,232,224,.92)}

  /* Better contrast for small labels */
  .stat-hero-label,
  .dash-label,
  .hz-mstat-label,
  .tsb-label{
    color:rgba(160,156,148,.85);
  }

  /* Stronger borders for panel separation */
  .hormuz-section{
    border-color:rgba(200,164,90,.12);
  }
  .inss-dashboard{
    border-color:rgba(200,164,90,.18);
  }
  .mil-dashboard{
    border-color:rgba(200,164,90,.1);
  }
}

/* ── 12. Reduce Motion for Accessibility ── */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .hz-radar-sweep{display:none}
  .mil-dashboard::after{display:none}
  .inss-dashboard>.inss-scan{display:none}
}

/* ── 13. High DPI / Retina Sharpness ── */
@media(-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){
  .inss-dashboard,
  .mil-dashboard,
  .hormuz-section{
    border-width:0.5px;
  }
  /* Crisp 1px borders on retina */
  .hz-stat-card,
  .hz-oil-card,
  .hz-intel-event,
  .news-item,
  .inss-front-card{
    border-width:0.5px;
  }
}