:root {
  color-scheme: dark;
  --bg: #07111f;
  --bg2: #0f172a;
  --panel: rgba(15, 23, 42, .78);
  --panel2: rgba(30, 41, 59, .72);
  --text: #eff6ff;
  --muted: #a8b3c7;
  --line: rgba(148, 163, 184, .24);
  --green: #34d399;
  --amber: #fbbf24;
  --red: #fb7185;
  --cyan: #38bdf8;
  --blue: #60a5fa;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font: 16px/1.6 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background:
    radial-gradient(circle at 15% 0%, rgba(56, 189, 248, .18), transparent 28rem),
    radial-gradient(circle at 82% 12%, rgba(52, 211, 153, .14), transparent 30rem),
    linear-gradient(135deg, #050b14 0%, var(--bg) 52%, #111827 100%);
  color: var(--text);
}
a { color: #7dd3fc; text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { width: min(1120px, calc(100% - 32px)); margin: 0 auto; }
.nav { display:flex; justify-content:space-between; align-items:center; padding: 22px 0; color: var(--muted); }
.brand { display:flex; gap:10px; align-items:center; font-weight:800; color:var(--text); }
.logo { width:34px;height:34px;border-radius:12px;background:linear-gradient(135deg,var(--cyan),var(--green)); box-shadow:0 0 28px rgba(56,189,248,.35); }
.navlinks { display:flex; flex-wrap:wrap; gap:14px; font-size:14px; }
.hero { padding: 56px 0 30px; }
.kicker { color: var(--green); font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:13px; }
h1 { font-size: clamp(38px, 7vw, 76px); line-height:.95; margin: 12px 0 20px; max-width: 900px; }
.lead { font-size: 20px; color: var(--muted); max-width: 760px; }
.grid { display:grid; gap:18px; }
.grid.cols3 { grid-template-columns: repeat(3, 1fr); }
.grid.cols2 { grid-template-columns: repeat(2, 1fr); }
.card { border:1px solid var(--line); background: linear-gradient(180deg, var(--panel), rgba(15,23,42,.55)); border-radius:24px; padding:22px; box-shadow: 0 24px 80px rgba(0,0,0,.22); }
.bigprob { font-size: 76px; line-height:1; font-weight:900; color: var(--amber); }
.badge { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:999px; padding:6px 10px; color:var(--muted); font-size:13px; }
.dot { width:8px;height:8px;border-radius:50%;background:var(--amber); box-shadow:0 0 14px var(--amber); }
.signal { display:flex; gap:14px; align-items:flex-start; }
.signal strong { display:block; color:var(--text); }
.signal span { color:var(--muted); font-size:14px; }
.icon { width:38px; height:38px; border-radius:14px; display:grid; place-items:center; background:rgba(56,189,248,.12); border:1px solid rgba(56,189,248,.22); }
.section { padding: 34px 0; }
h2 { font-size: 30px; margin:0 0 16px; }
h3 { margin:0 0 8px; }
.timeline { display:grid; gap:12px; }
.event { display:grid; grid-template-columns: 120px 1fr auto; gap:16px; align-items:start; padding:16px; border:1px solid var(--line); border-radius:18px; background:rgba(15,23,42,.54); }
.event time { color:var(--cyan); font-weight:700; }
.conf { font-size:12px; color:#020617; border-radius:999px; padding:4px 8px; background:var(--amber); font-weight:800; }
.conf.high { background:var(--green); }
.conf.medium { background:var(--amber); }
.tool label { display:block; color:var(--muted); font-size:13px; margin: 10px 0 4px; }
.tool input, .tool select { width:100%; border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:rgba(2,6,23,.7); color:var(--text); }
.result { margin-top:14px; padding:14px; border-radius:16px; background:rgba(52,211,153,.10); border:1px solid rgba(52,211,153,.28); }
.cta { display:inline-flex; gap:10px; align-items:center; justify-content:center; padding:13px 18px; border-radius:14px; border:1px solid rgba(56,189,248,.4); background:rgba(56,189,248,.14); color:var(--text); font-weight:800; }
.footer { margin-top:50px; padding:28px 0 46px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }
.disclaimer { border:1px solid rgba(251,191,36,.35); background:rgba(251,191,36,.08); border-radius:18px; padding:16px; color:#fde68a; }
.article { max-width:860px; padding: 38px 0; }
.article h1 { font-size: clamp(34px, 5vw, 58px); }
.article p, .article li { color: var(--muted); }
@media (max-width: 820px) { .grid.cols3,.grid.cols2{grid-template-columns:1fr}.event{grid-template-columns:1fr}.nav{align-items:flex-start;gap:14px;flex-direction:column}.bigprob{font-size:58px} }