:root { color-scheme: dark; --bg:#07110f; --panel:#0e1d19; --line:#24463e; --text:#edf8ef; --muted:#91aaa0; --accent:#6ef2b4; --warn:#ffd166; } * { box-sizing:border-box; } body { margin:0; min-height:100vh; background:radial-gradient(circle at 80% 0%,#15372c,var(--bg) 45%); color:var(--text); font:18px/1.45 Inter,ui-sans-serif,system-ui,sans-serif; } main { max-width:1100px; padding:48px 36px 80px; margin:auto; } header,.panel-head,.alert-row { display:flex; justify-content:space-between; align-items:center; gap:20px; } h1 { margin:0; font-size:clamp(2rem,5vw,4rem); letter-spacing:-.04em; } h2 { margin:0; } .eyebrow,.label { color:var(--accent); font-size:.73rem; font-weight:800; letter-spacing:.14em; margin:0 0 8px; } .badge { border:1px solid var(--line); padding:7px 10px; color:var(--muted); font-size:.7rem; letter-spacing:.12em; font-weight:800; } .live,.ok { color:var(--accent); } .access-card,.panel,article { background:color-mix(in srgb,var(--panel) 94%,transparent); border:1px solid var(--line); } .access-card { max-width:600px; margin:72px auto; padding:34px; } .grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:30px 0; } article { padding:20px; } article strong { font-size:1.25rem; } .panel { padding:28px; margin-top:18px; } .buttons { display:flex; gap:10px; flex-wrap:wrap; } button { background:var(--accent); color:#052116; font-weight:900; padding:12px 16px; border:0; cursor:pointer; text-transform:uppercase; letter-spacing:.06em; } button:disabled { opacity:.6; } input { min-width:280px; max-width:100%; padding:13px; border:1px solid var(--line); background:#07110f; color:white; font-size:1rem; } form { display:flex; gap:10px; flex-wrap:wrap; } .muted { color:var(--muted); } .error { color:var(--warn); } .alerts { margin-top:18px; } .alert-row { border-top:1px solid var(--line); padding:15px 0; } .alert-row span,time { color:var(--muted); } time { font-size:.85rem; } @media (max-width:650px) { main { padding:28px 18px; } .grid { grid-template-columns:1fr; } .panel-head,.alert-row { align-items:flex-start; flex-direction:column; gap:4px; } }
