:root{color-scheme:dark;--surface:#162120;--line:#30443c;--muted:#adc1b6;--accent:#98f2c0}*{box-sizing:border-box}body{margin:0;background:#0e1614;color:#edf5f0;font:16px/1.5 system-ui,sans-serif}main{max-width:850px;margin:auto;padding:clamp(22px,6vw,68px)}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:35px}header p,#seen{color:var(--muted)}.brand{font-weight:850;font-size:52px;letter-spacing:-.1em;line-height:1}.brand span,#notice{color:var(--accent)}h1{font-size:clamp(30px,6vw,52px);letter-spacing:-.05em}form{max-width:400px}label{display:block;margin:12px 0 6px}input,select,button{font:inherit;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:9px 12px}input{display:block;width:100%;margin-top:6px}form button{margin-top:14px;background:var(--accent);color:#102219;font-weight:700}button{cursor:pointer}select{min-width:min(100%,240px)}.panel,li{margin-top:12px;padding:12px 18px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}ul{padding:0;list-style:none}.offline{color:#ffbd96}.online{color:var(--accent)}