:root { --bg:#070b12; --panel:#101826; --panel2:#151f2f; --text:#edf3f8; --muted:#95a3b6; --line:#263447; --green:#22c55e; --amber:#f59e0b; --red:#ef4444; --blue:#60a5fa; --purple:#a78bfa; }
* { box-sizing:border-box; }
body { margin:0; font-family:Arial, Helvetica, sans-serif; background:radial-gradient(circle at top left, #111d2f 0, #070b12 420px); color:var(--text); }
a { color:#9cc6ff; }
.shell { width:min(1220px, calc(100% - 32px)); margin:0 auto; padding:24px 0 44px; }
.hero { display:grid; grid-template-columns:minmax(0, 1.5fr) minmax(280px, .8fr); gap:18px; align-items:stretch; margin-bottom:18px; }
.hero-copy, .hero-score-card, .card { background:linear-gradient(180deg, rgba(21,31,47,.96), rgba(13,20,32,.96)); border:1px solid var(--line); border-radius:12px; padding:20px; box-shadow:0 18px 50px rgba(0,0,0,.24); }
.eyebrow { margin:0 0 8px; color:var(--blue); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
h1 { margin:0; font-size:42px; line-height:1.05; letter-spacing:0; }
h2 { margin:0 0 8px; font-size:24px; letter-spacing:0; }
h3 { margin:0; font-size:17px; }
h4 { margin:14px 0 8px; font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
p, li { color:#d3dbe6; line-height:1.55; }
.hero-summary { font-size:17px; max-width:860px; }
.date-label, .metric-grid span, .segment-meta span, .mini-kpis span { color:var(--muted); font-size:12px; }
.hero-score-card { display:flex; flex-direction:column; gap:14px; }
.hero-score-card strong { font-size:22px; }
.kpi-strip, .metric-grid, .definition-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; }
.kpi-strip div, .metric-grid div, .definition-grid div { background:rgba(255,255,255,.035); border:1px solid var(--line); border-radius:10px; padding:11px; min-width:0; }
.kpi-strip span, .metric-grid span { display:block; color:var(--muted); margin-bottom:5px; font-size:12px; }
.badge { display:inline-flex; align-items:center; width:max-content; border-radius:999px; padding:6px 10px; color:#061016; font-size:12px; font-weight:800; text-transform:uppercase; }
.green { background:rgba(34,197,94,.95); }
.amber { background:rgba(245,158,11,.95); }
.red { background:rgba(239,68,68,.95); color:#fff; }
.gray { background:#64748b; color:#fff; }
.decision-chips, .chip-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.decision-chip, .evidence-chip { border:1px solid var(--line); background:rgba(96,165,250,.08); color:#dceafe; border-radius:999px; padding:7px 10px; font-size:12px; }
.section-block { margin:22px 0; }
.section-head { margin:0 0 14px; }
.strategy-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
.segment-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.strategy-card, .segment-card { min-height:100%; }
.card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.score-row { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:12px; margin-bottom:6px; }
.score-row b { color:var(--text); }
.score-bar { height:10px; background:#0a111d; border:1px solid var(--line); border-radius:999px; overflow:hidden; }
.score-bar span { display:block; height:100%; background:linear-gradient(90deg, var(--red), var(--amber), var(--green)); border-radius:999px; }
.mini-kpis, .segment-meta { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.mini-kpis span, .segment-meta span { border:1px solid var(--line); border-radius:8px; padding:7px 8px; background:rgba(255,255,255,.03); }
details.card { margin-bottom:12px; }
summary { cursor:pointer; color:var(--text); font-weight:800; }
.chart-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.chart-grid img, img { display:block; max-width:100%; height:auto; background:#0b1220; border:1px solid var(--line); border-radius:12px; }
.span-2 { grid-column:span 2; }
.table-wrap { overflow-x:auto; }
table { width:100%; min-width:850px; border-collapse:collapse; margin-top:12px; }
th, td { border-bottom:1px solid var(--line); padding:9px 8px; text-align:right; white-space:nowrap; font-size:13px; }
th:first-child, td:first-child { text-align:left; }
th { color:var(--muted); background:rgba(255,255,255,.03); }
.button { display:inline-flex; text-decoration:none; background:var(--blue); color:#061016; font-weight:800; border-radius:9px; padding:10px 13px; }
.button.secondary { background:transparent; color:var(--text); border:1px solid var(--line); }
.footer { border-top:1px solid var(--line); background:#05080d; }
.footer .shell { padding:18px 0; }
@media (max-width: 920px) { .hero, .strategy-grid, .segment-grid, .chart-grid { grid-template-columns:1fr; } .span-2 { grid-column:auto; } .kpi-strip, .metric-grid, .definition-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); } h1 { font-size:34px; } }
@media (max-width: 560px) { .shell { width:min(100% - 20px, 1220px); padding-top:14px; } .hero-copy, .hero-score-card, .card { padding:15px; border-radius:10px; } .kpi-strip, .metric-grid, .definition-grid { grid-template-columns:1fr; } h1 { font-size:28px; } }