:root { --bg:#f3f5f8; --card:#fff; --ink:#18212f; --muted:#667085; --line:#d9dee7; --accent:#1d5fc4; --err:#b42318; --errbg:#fdecea; }
@media (prefers-color-scheme: dark) { :root { --bg:#0f141c; --card:#182130; --ink:#e8edf5; --muted:#9aa6ba; --line:#2a3548; --accent:#5b9bff; --err:#ff8f85; --errbg:#3a1d1b; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
main { max-width:460px; margin:0 auto; padding:16px; }
.brand { font-weight:600; padding:8px 2px 12px; color:var(--muted); }
.wifi-ico { color:var(--accent); }
.card { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px; }
h1 { font-size:1.35rem; margin:0 0 10px; } h2 { font-size:1.05rem; margin:20px 0 8px; }
.muted { color:var(--muted); font-size:.92rem; }
label { display:block; font-size:.9rem; margin:12px 0 4px; color:var(--muted); }
input[type=text], input[type=tel], textarea { width:100%; padding:12px; font:inherit; color:inherit; background:var(--bg); border:1px solid var(--line); border-radius:10px; }
textarea { font-family:ui-monospace,Consolas,monospace; font-size:.85rem; resize:none; }
.check { display:flex; gap:10px; align-items:flex-start; color:var(--ink); font-size:.85rem; margin:16px 0; }
.check input { margin-top:3px; }
button, .btn { display:inline-block; font:inherit; font-weight:600; padding:12px 16px; border-radius:10px; border:1px solid var(--line); background:var(--card); color:var(--ink); text-decoration:none; cursor:pointer; }
.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
form > button.primary:last-child { width:100%; }
.error { background:var(--errbg); color:var(--err); border-radius:10px; padding:10px 12px; margin:12px 0; }
.notice { background:var(--bg); border:1px dashed var(--line); border-radius:10px; padding:10px 12px; margin:12px 0; font-size:.9rem; }
.plan, .free { display:flex; justify-content:space-between; align-items:center; gap:12px; border:1px solid var(--line); border-radius:12px; padding:12px; margin:10px 0; }
.plan div, .free div { display:flex; flex-direction:column; } .plan span, .free span { color:var(--muted); font-size:.85rem; }
.free { border-color:var(--accent); }
button:disabled { opacity:.55; cursor:not-allowed; }
