/* ============================================================
   FloodVision AI — control-room visual system
   ============================================================ */
:root{
  --bg:        #070b14;
  --bg-2:      #0b1322;
  --panel:     #0e1726;
  --panel-2:   #111d30;
  --line:      rgba(255,255,255,0.08);
  --line-2:    rgba(56,225,198,0.18);
  --ink:       #eef4ff;
  --ink-dim:   #97a6c0;
  --ink-faint: #5e6e8a;

  --cyan:   #38e1c6;
  --cyan-2: #2bb6e0;
  --blue:   #3a7bff;

  --low:  #34d399;
  --mod:  #ffce4d;
  --high: #ff8a3d;
  --sev:  #ff4d5e;

  --shadow: 0 18px 50px rgba(0,0,0,0.5);
  --r: 14px;

  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --disp: "Space Grotesk", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
em{ font-style:normal; color:var(--cyan); }

/* ---- shared ---- */
.accent{ color:var(--cyan); }
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--disp); font-weight:600; font-size:.95rem;
  padding:.78rem 1.5rem; border-radius:999px; cursor:pointer;
  border:1px solid transparent; transition:.18s ease; white-space:nowrap;
}
.btn--primary{ background:linear-gradient(120deg,var(--cyan),var(--cyan-2)); color:#04221d; box-shadow:0 8px 24px rgba(56,225,198,.25); }
.btn--primary:hover{ transform:translateY(-2px); box-shadow:0 12px 30px rgba(56,225,198,.35); }
.btn--ghost{ border-color:var(--line); color:var(--ink); }
.btn--ghost:hover{ border-color:var(--cyan); color:var(--cyan); }

.section-head{ max-width:760px; margin:0 auto 2.6rem; text-align:center; padding:0 1.5rem; }
.eyebrow{
  font-family:var(--mono); font-size:.74rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--cyan); display:inline-block; margin-bottom:.9rem;
}
.section-head h2{ font-family:var(--disp); font-size:clamp(1.7rem,3.4vw,2.5rem); font-weight:700; letter-spacing:-.02em; line-height:1.1; }
.section-lead{ color:var(--ink-dim); margin-top:.9rem; font-size:1.02rem; text-wrap:pretty; }

/* ============ NAV ============ */
.nav{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; gap:2rem;
  padding:1rem clamp(1.2rem,4vw,3rem);
  background:rgba(7,11,20,.78); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav__brand{ display:flex; align-items:center; gap:.6rem; }
.logo{ color:var(--cyan); display:flex; }
.nav__name{ font-family:var(--disp); font-weight:500; font-size:1.18rem; letter-spacing:-.01em; }
.nav__name strong{ color:var(--cyan); font-weight:700; }
.nav__links{ display:flex; gap:1.7rem; margin-left:auto; }
.nav__links a{ font-size:.92rem; color:var(--ink-dim); transition:.15s; }
.nav__links a:hover{ color:var(--ink); }
.nav__cta{ padding:.55rem 1.1rem; font-size:.86rem; }

/* ============ HERO ============ */
.hero{ position:relative; padding:clamp(3.5rem,9vw,7rem) 1.5rem clamp(3rem,7vw,5rem); overflow:hidden;
  background:radial-gradient(120% 80% at 70% -10%, rgba(58,123,255,.16), transparent 55%),
             radial-gradient(90% 70% at 10% 0%, rgba(56,225,198,.12), transparent 50%); }
.hero__grid{ position:absolute; inset:0;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:48px 48px; mask-image:radial-gradient(70% 70% at 50% 30%,#000,transparent 80%); opacity:.5; }
.hero__inner{ position:relative; max-width:920px; margin:0 auto; text-align:center; }
.status-pill{
  display:inline-flex; align-items:center; gap:.6rem; font-family:var(--mono); font-size:.8rem;
  color:var(--ink-dim); padding:.45rem 1rem; border:1px solid var(--line); border-radius:999px;
  background:rgba(255,255,255,.02); margin-bottom:1.8rem;
}
.status-dot{ width:8px; height:8px; border-radius:50%; background:var(--low); box-shadow:0 0 0 0 rgba(52,211,153,.6); animation:pulse 2.2s infinite; }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(52,211,153,.55)} 70%{box-shadow:0 0 0 9px rgba(52,211,153,0)} 100%{box-shadow:0 0 0 0 rgba(52,211,153,0)} }
.hero__title{ font-family:var(--disp); font-weight:700; font-size:clamp(2.2rem,6vw,4.1rem); line-height:1.04; letter-spacing:-.03em; }
.hero__sub{ max-width:620px; margin:1.4rem auto 0; color:var(--ink-dim); font-size:1.12rem; text-wrap:pretty; }
.hero__actions{ display:flex; gap:.9rem; justify-content:center; margin-top:2rem; flex-wrap:wrap; }
.hero__stats{ display:flex; gap:clamp(1.5rem,5vw,3.5rem); justify-content:center; margin-top:3.2rem; flex-wrap:wrap; }
.hero__stats dt{ font-family:var(--disp); font-weight:700; font-size:clamp(1.6rem,3vw,2.3rem); color:var(--ink); }
.hero__stats dd{ font-family:var(--mono); font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin-top:.3rem; }

/* ============ DASHBOARD ============ */
.dash{ padding:clamp(3rem,6vw,5rem) clamp(1rem,4vw,3rem) 4rem; background:linear-gradient(180deg,var(--bg),var(--bg-2)); }
.kpi-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; max-width:1280px; margin:0 auto 1.2rem; }
.kpi{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.1rem 1.25rem; position:relative; overflow:hidden; }
.kpi::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--cyan); opacity:.7; }
.kpi__label{ font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); display:block; }
.kpi__value{ font-family:var(--disp); font-weight:700; font-size:2rem; display:block; margin:.25rem 0 .1rem; letter-spacing:-.02em; }
.kpi__meta{ font-size:.78rem; color:var(--ink-dim); }

.console{
  display:grid; max-width:1280px; margin:0 auto; gap:1rem;
  grid-template-columns:1.35fr 1fr;
  grid-template-areas:
    "map      inspector"
    "feed     inspector"
    "forecast forecast";
}
.panel{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); display:flex; flex-direction:column; min-width:0; }
.panel--map{ grid-area:map; }
.panel--inspector{ grid-area:inspector; }
.panel--feed{ grid-area:feed; }
.panel--forecast{ grid-area:forecast; }
.panel__head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.2rem; border-bottom:1px solid var(--line); }
.panel__head h3{ font-family:var(--disp); font-weight:600; font-size:1rem; letter-spacing:-.01em; }
.tag{ font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-dim); border:1px solid var(--line); padding:.22rem .55rem; border-radius:999px; }
.tag--live{ color:var(--cyan); border-color:var(--line-2); display:inline-flex; align-items:center; gap:.4rem; }
.tag--live i{ width:6px; height:6px; border-radius:50%; background:var(--cyan); animation:pulse 1.8s infinite; }

/* legend */
.legend{ display:flex; gap:.9rem; flex-wrap:wrap; }
.legend__item{ font-size:.74rem; color:var(--ink-dim); display:inline-flex; align-items:center; gap:.35rem; }
.dot{ width:9px; height:9px; border-radius:50%; display:inline-block; }
.dot--low{ background:var(--low);} .dot--mod{ background:var(--mod);} .dot--high{ background:var(--high);} .dot--sev{ background:var(--sev);} 

/* map */
.map{ position:relative; aspect-ratio:100/42; margin:1rem; border-radius:10px;
  background:radial-gradient(120% 100% at 50% 30%, rgba(58,123,255,.08), transparent 60%), #0a1322;
  border:1px solid var(--line); overflow:hidden; }
.map__land,.map__links{ position:absolute; inset:0; width:100%; height:100%; }
.node{ position:absolute; transform:translate(-50%,-50%); width:9px; height:9px; border-radius:50%; cursor:pointer; border:1.5px solid rgba(7,11,20,.7); transition:.15s; padding:0; }
.node::after{ content:""; position:absolute; inset:-4px; border-radius:50%; border:1px solid currentColor; opacity:.3; animation:ring 2.6s infinite; }
.node:hover{ transform:translate(-50%,-50%) scale(1.8); z-index:5; }
.node.is-active{ box-shadow:0 0 0 2.5px rgba(255,255,255,.9), 0 0 16px currentColor; transform:translate(-50%,-50%) scale(1.9); z-index:6; }
.node--low{ background:var(--low); color:var(--low);} .node--mod{ background:var(--mod); color:var(--mod);} 
.node--high{ background:var(--high); color:var(--high);} .node--sev{ background:var(--sev); color:var(--sev);} 
@keyframes ring{ 0%{transform:scale(.7);opacity:.5} 100%{transform:scale(1.7);opacity:0} }
.node__tip{ position:absolute; bottom:140%; left:50%; transform:translateX(-50%); background:#04101c; border:1px solid var(--line-2);
  padding:.3rem .55rem; border-radius:7px; font-size:.72rem; white-space:nowrap; color:var(--ink); pointer-events:none; opacity:0; transition:.15s; font-family:var(--mono); }
.node:hover .node__tip{ opacity:1; }
.map__hint{ font-size:.76rem; color:var(--ink-faint); padding:0 1.2rem 1rem; }

/* inspector */
.inspector{ padding:1.2rem; display:flex; flex-direction:column; gap:1.1rem; }
.insp__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.insp__region{ font-family:var(--disp); font-weight:700; font-size:1.45rem; display:block; letter-spacing:-.02em; }
.insp__sub{ font-family:var(--mono); font-size:.76rem; color:var(--ink-faint); }
.risk-badge{ font-family:var(--mono); font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; padding:.35rem .7rem; border-radius:999px; font-weight:600; background:rgba(255,255,255,.06); }
.risk-badge.b-low{ color:var(--low); background:rgba(52,211,153,.12);} 
.risk-badge.b-mod{ color:var(--mod); background:rgba(255,206,77,.12);} 
.risk-badge.b-high{ color:var(--high); background:rgba(255,138,61,.14);} 
.risk-badge.b-sev{ color:var(--sev); background:rgba(255,77,94,.16);} 

.gauge{ position:relative; width:160px; margin:0 auto; }
.gauge svg{ width:100%; display:block; }
.gauge__num{ position:absolute; bottom:2px; left:50%; transform:translateX(-50%); text-align:center; }
.gauge__num span{ font-family:var(--disp); font-weight:700; font-size:1.8rem; }
.gauge__num small{ display:block; font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); }

.insp__metrics{ display:grid; grid-template-columns:1fr 1fr; gap:.5rem .9rem; }
.metric{ display:flex; justify-content:space-between; align-items:baseline; gap:.6rem; padding:.5rem .2rem; border-bottom:1px dashed var(--line); }
.metric__k{ font-size:.8rem; color:var(--ink-dim); }
.metric__v{ font-family:var(--mono); font-size:.9rem; font-weight:500; }

.insp__chart-head{ font-size:.76rem; color:var(--ink-dim); margin-bottom:.4rem; }
#riverChart{ width:100%; height:auto; display:block; }

/* feed */
.feed{ list-style:none; overflow-y:auto; max-height:340px; padding:.6rem; display:flex; flex-direction:column; gap:.5rem; }
.feed__item{ display:grid; grid-template-columns:auto 1fr; gap:.7rem; padding:.7rem .8rem; border-radius:10px; background:var(--panel-2); border:1px solid var(--line); animation:slideIn .35s ease; }
@keyframes slideIn{ from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:none} }
.feed__sev{ width:8px; height:8px; border-radius:50%; margin-top:.45rem; }
.feed__sev.s-low{background:var(--low)} .feed__sev.s-mod{background:var(--mod)} .feed__sev.s-high{background:var(--high)} .feed__sev.s-sev{background:var(--sev)}
.feed__body b{ font-family:var(--disp); font-weight:600; font-size:.92rem; }
.feed__msg{ font-size:.83rem; color:var(--ink-dim); }
.feed__time{ font-family:var(--mono); font-size:.7rem; color:var(--ink-faint); }

/* forecast */
.panel--forecast{ padding-bottom:1rem; }
#rainChart{ width:100%; height:auto; display:block; padding:1rem 1.2rem 0; }
.forecast__foot{ display:flex; gap:2rem; padding:.6rem 1.2rem 0; font-size:.82rem; color:var(--ink-dim); flex-wrap:wrap; }
.forecast__foot b{ font-family:var(--disp); color:var(--ink); font-size:1rem; }

/* ============ HOW TO USE ============ */
.how{ padding:clamp(3.5rem,7vw,6rem) clamp(1.2rem,4vw,3rem); background:var(--bg); }
.steps{ list-style:none; max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:1rem; counter-reset:s; }
.step{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.5rem 1.4rem; position:relative; overflow:hidden; }
.step::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--cyan),transparent); }
.step__n{ font-family:var(--disp); font-weight:700; font-size:.9rem; color:var(--cyan); letter-spacing:.1em; }
.step h3{ font-family:var(--disp); font-weight:600; font-size:1.15rem; margin:.5rem 0 .6rem; }
.step p{ font-size:.92rem; color:var(--ink-dim); text-wrap:pretty; }
.step b{ color:var(--ink); font-weight:600; }

.callout{ max-width:1180px; margin:1.4rem auto 0; display:flex; gap:1.1rem; align-items:flex-start;
  background:linear-gradient(120deg,rgba(56,225,198,.08),rgba(58,123,255,.05)); border:1px solid var(--line-2); border-radius:var(--r); padding:1.4rem 1.6rem; }
.callout__icon{ flex:none; width:34px; height:34px; border-radius:50%; background:var(--cyan); color:#04221d; font-family:var(--disp); font-weight:700; display:grid; place-items:center; }
.callout h4{ font-family:var(--disp); font-size:1.05rem; margin-bottom:.35rem; }
.callout p{ font-size:.92rem; color:var(--ink-dim); }
.c-low{color:var(--low)} .c-mod{color:var(--mod)} .c-high{color:var(--high)} .c-sev{color:var(--sev)}
.how__note{ max-width:1180px; margin:1.4rem auto 0; font-size:.8rem; color:var(--ink-faint); font-family:var(--mono); }

/* ============ DATA & METHODOLOGY ============ */
.method{ padding:clamp(3.5rem,7vw,6rem) clamp(1.2rem,4vw,3rem); background:var(--bg-2); }
.pipe{ max-width:1100px; margin:0 auto 2rem; display:flex; align-items:stretch; justify-content:center; gap:.6rem; flex-wrap:wrap; }
.pipe__step{ flex:1; min-width:180px; background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.3rem 1.3rem; position:relative; }
.pipe__step::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:linear-gradient(var(--cyan),var(--blue)); border-radius:3px 0 0 3px; }
.pipe__n{ display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:rgba(56,225,198,.14); color:var(--cyan); font-family:var(--disp); font-weight:700; font-size:.9rem; margin-bottom:.7rem; }
.pipe__step h3{ font-family:var(--disp); font-weight:600; font-size:1.05rem; margin-bottom:.4rem; }
.pipe__step p{ font-size:.86rem; color:var(--ink-dim); text-wrap:pretty; }
.pipe__arrow{ align-self:center; color:var(--ink-faint); font-size:1.4rem; }

.sources{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; }
.source{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.4rem 1.4rem; transition:.18s; }
.source:hover{ border-color:var(--line-2); }
.source h3{ font-family:var(--disp); font-weight:600; font-size:1.05rem; display:flex; align-items:center; gap:.55rem; margin-bottom:.5rem; }
.source__ic{ color:var(--cyan); font-size:1.2rem; }
.source__what{ font-size:.88rem; color:var(--ink-dim); margin-bottom:.8rem; text-wrap:pretty; }
.source__list{ list-style:none; display:flex; flex-direction:column; gap:.4rem; }
.source__list li{ font-size:.82rem; color:var(--ink-dim); padding-left:.9rem; position:relative; }
.source__list li::before{ content:"›"; position:absolute; left:0; color:var(--cyan); }
.source__list b{ color:var(--ink); font-weight:600; }

.formula{ max-width:1100px; margin:1.4rem auto 0; background:linear-gradient(120deg,rgba(56,225,198,.07),rgba(58,123,255,.05)); border:1px solid var(--line-2); border-radius:var(--r); padding:1.6rem 1.7rem; }
.formula h4{ font-family:var(--disp); font-size:1.1rem; margin-bottom:.6rem; }
.formula p{ font-size:.92rem; color:var(--ink-dim); }
.formula__eq{ display:block; font-family:var(--mono); font-size:.86rem; color:var(--cyan); background:#04101c; border:1px solid var(--line); border-radius:10px; padding:.9rem 1.1rem; margin:.9rem 0; overflow-x:auto; line-height:1.6; }
.formula__note{ font-size:.86rem; }
.method__disclaimer{ max-width:1100px; margin:1.4rem auto 0; font-size:.86rem; color:var(--ink-dim); border-left:3px solid var(--cyan); padding:.4rem 0 .4rem 1rem; text-wrap:pretty; }
.method__disclaimer code{ font-family:var(--mono); color:var(--cyan); font-size:.82rem; }

/* ============ FEATURES ============ */
.features{ padding:clamp(3.5rem,7vw,6rem) clamp(1.2rem,4vw,3rem); background:linear-gradient(180deg,var(--bg-2),var(--bg)); }
.feat-grid{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1rem; }
.feat{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.7rem 1.5rem; transition:.18s; }
.feat:hover{ border-color:var(--line-2); transform:translateY(-3px); }
.feat__ic{ font-size:1.6rem; color:var(--cyan); display:block; margin-bottom:.7rem; }
.feat h3{ font-family:var(--disp); font-weight:600; font-size:1.15rem; margin-bottom:.45rem; }
.feat p{ font-size:.92rem; color:var(--ink-dim); text-wrap:pretty; }

/* ============ FOOTER ============ */
.foot{ background:#05080f; border-top:1px solid var(--line); padding:3.5rem clamp(1.2rem,4vw,3rem) 1.5rem; }
.foot__inner{ max-width:1180px; margin:0 auto; display:flex; gap:3rem; flex-wrap:wrap; justify-content:space-between; }
.foot__brand{ max-width:420px; }
.foot__brand p{ color:var(--ink-dim); font-size:.92rem; margin-top:.8rem; }
.foot__cols{ display:flex; gap:3rem; flex-wrap:wrap; }
.foot__cols h5{ font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:.8rem; }
.foot__cols a{ display:block; color:var(--ink-dim); font-size:.9rem; padding:.18rem 0; transition:.15s; }
.foot__cols a:hover{ color:var(--cyan); }
.foot__bar{ max-width:1180px; margin:2.5rem auto 0; padding-top:1.3rem; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-family:var(--mono); font-size:.74rem; color:var(--ink-faint); }

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
  .kpi-strip{ grid-template-columns:repeat(2,1fr); }
  .console{ grid-template-columns:1fr; grid-template-areas:"map" "inspector" "feed" "forecast"; }
  .nav__links{ display:none; }
}
@media (max-width:760px){
  .pipe__arrow{ transform:rotate(90deg); }
}
@media (max-width:520px){
  .kpi-strip{ grid-template-columns:1fr 1fr; }
  .insp__metrics{ grid-template-columns:1fr; }
}

/* ============ SCIENTIFIC ANALYSIS ============ */
.analysis{padding:5rem 5vw;background:linear-gradient(180deg,rgba(24,42,64,.25),rgba(8,18,30,.4));border-top:1px solid var(--line);}
.analysis-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.15fr .85fr;gap:1.2rem;}
.analysis-card{min-width:0;}
.analysis-card--chart canvas{width:100%;height:auto;min-height:260px;background:rgba(4,12,22,.45);border-radius:10px;}
.analysis-table-wrap{overflow-x:auto;}
.analysis-table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.72rem;white-space:nowrap;}
.analysis-table th,.analysis-table td{padding:.65rem .45rem;border-bottom:1px solid var(--line);text-align:right;}
.analysis-table th:first-child,.analysis-table td:first-child{text-align:left;color:var(--ink-dim);}
.analysis-table th{color:var(--cyan);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;}
.analysis-table td{color:var(--ink);}
.analysis-table td:nth-child(5){color:var(--amber);}
.alert-box{display:flex;gap:.8rem;align-items:flex-start;margin-top:1.2rem;padding:1rem;border:1px solid rgba(255,138,61,.45);background:rgba(255,138,61,.08);border-radius:10px;}
.alert-box__icon{color:var(--amber);font-size:1.4rem;line-height:1;}
.alert-box b{color:var(--amber);font-size:.9rem;}
.alert-box p{margin:.35rem 0 0;color:var(--ink-dim);font-size:.82rem;line-height:1.45;}
.analysis-note,.analysis-method{color:var(--ink-dim);font-size:.78rem;line-height:1.5;}
.analysis-note{margin:.7rem 0 0;}
.analysis-method{max-width:1180px;margin:1.2rem auto 0;padding:1rem 1.2rem;border-left:3px solid var(--cyan);background:rgba(56,225,198,.05);}
@media (max-width:980px){.analysis-grid{grid-template-columns:1fr;}}

/* ============ AI FORECAST ============ */
.ai-layer{padding:5rem 5vw;background:radial-gradient(circle at 15% 0,rgba(111,78,255,.11),transparent 38%),var(--bg);border-top:1px solid var(--line);}
.ai-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:1.2rem;}
.ai-map-card canvas{width:100%;height:auto;background:linear-gradient(145deg,rgba(7,20,34,.9),rgba(18,34,50,.7));border-radius:10px;}
.ai-horizons{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;}
.ai-horizon{padding:.8rem;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.025);}
.ai-horizon h4{margin:0 0 .45rem;color:var(--cyan);font:600 .76rem var(--mono);text-transform:uppercase;}
.ai-horizon strong{font-size:1.35rem;color:var(--ink);}
.ai-horizon dl{margin:.55rem 0 0;display:grid;grid-template-columns:1fr auto;gap:.25rem .5rem;font:500 .68rem var(--mono);color:var(--ink-dim);}
.ai-horizon dd{margin:0;color:var(--ink);}
.ai-report{margin-top:1rem;padding:1rem;border-left:3px solid #8b7bff;background:rgba(139,123,255,.07);}
.ai-report b{color:#b9b0ff;}.ai-report p{margin:.45rem 0 0;color:var(--ink-dim);font-size:.8rem;line-height:1.5;}
.ai-empty{grid-column:1/-1;color:var(--ink-dim);padding:2rem;text-align:center;}
@media (max-width:980px){.ai-grid{grid-template-columns:1fr;}}
@media (max-width:560px){.ai-horizons{grid-template-columns:1fr;}}