:root { color-scheme: dark; --bg:#08111f; --card:rgba(15,23,42,.86); --line:rgba(148,163,184,.18); --text:#e5eefb; --muted:#9fb0c8; --accent:#7dd3fc; --good:#6ee7b7; --warn:#fdba74; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--text); font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; background:radial-gradient(circle at 15% 0%,#123050 0,transparent 38%),linear-gradient(180deg,#08111f,#060b15); }
.shell { width:min(960px,calc(100% - 28px)); margin:auto; padding:28px 0 48px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:22px; box-shadow:0 20px 60px #02061766; backdrop-filter:blur(16px); }
.hero { padding:30px; }
.eyebrow,.label { margin:0 0 8px; color:var(--accent); font-size:.74rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
h1,h2,p { margin-top:0; } h1 { margin-bottom:4px; font-size:clamp(2.1rem,7vw,4rem); line-height:1.05; } h2 { margin-bottom:8px; font-size:1.25rem; } p { color:var(--muted); }
.subtitle { margin-bottom:20px; font-size:1.05rem; } .muted { font-size:.9rem; }
.status { display:inline-flex; align-items:center; gap:9px; padding:9px 13px; border:1px solid #fdba743d; border-radius:999px; color:var(--warn); font-size:.88rem; font-weight:700; }
.dot { width:9px; height:9px; border-radius:50%; background:var(--warn); box-shadow:0 0 12px var(--warn); }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:14px; } .panel { padding:22px; }
.progress { height:8px; margin:18px 0 8px; overflow:hidden; border-radius:99px; background:#ffffff12; } .progress span { display:block; height:100%; border-radius:inherit; background:var(--accent); }
.gate { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:14px; padding:22px; border-color:#fdba743d; } .gate h2 { margin-bottom:4px; }
.badge { flex:none; padding:8px 11px; border:1px solid #fdba7466; border-radius:999px; color:var(--warn); font-size:.72rem; font-weight:900; letter-spacing:.1em; }
.stages { margin-top:14px; padding:22px; } ol { display:grid; gap:8px; margin:14px 0 0; padding:0; list-style:none; } li { display:flex; align-items:center; gap:14px; padding:12px; border-radius:14px; color:var(--muted); } li span { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--line); border-radius:50%; font-size:.76rem; font-weight:800; } li strong,li small { display:block; } li small { margin-top:2px; color:var(--muted); font-size:.82rem; } li.active { background:#7dd3fc12; color:var(--text); } li.active span { border-color:#7dd3fc66; color:var(--accent); }
@media (max-width:680px) { .grid { grid-template-columns:1fr; } .gate { align-items:flex-start; flex-direction:column; } }