:root{--ink:#14213D;--accent:#0E7C8B;--line:#D9DFE6;--muted:#5A6577;--bad:#C0392F}
*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:"Golos Text",system-ui,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 20% 10%,#1d3157,#14213D 60%);color:var(--ink);display:grid;place-items:center;padding:20px}
.wrap{width:100%;max-width:420px}.card{background:#fff;border-radius:16px;padding:28px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:22px}.brand b{display:block;font-size:16px}.brand span{font-size:12px;color:var(--muted)}
.mark{display:grid;grid-template-columns:repeat(4,8px);gap:3px}.mark i{width:8px;height:8px;border-radius:2px;background:#3DB3C2;opacity:.4}.mark i:nth-child(3n){opacity:1}.mark i:nth-child(5){background:#E3AE37;opacity:1}
h1{font-size:20px;margin:0 0 14px}label{display:block;font-size:13px;font-weight:600;margin:0 0 12px}
input{display:block;width:100%;margin-top:5px;padding:11px 12px;font:inherit;font-size:16px;border:1px solid var(--line);border-radius:9px;border-bottom-width:2px}
input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(14,124,139,.18)}
button{width:100%;padding:12px;font:inherit;font-weight:700;color:#fff;background:linear-gradient(180deg,#169aac,#0E7C8B);border:0;border-bottom:3px solid #09545e;border-radius:10px;cursor:pointer;margin-top:4px}
button:disabled{opacity:.6}.hint{font-size:12.5px;color:var(--muted);line-height:1.5;margin:10px 0}ol.hint{padding-left:18px}
.err{background:#fdecea;color:var(--bad);border-radius:9px;padding:10px 12px;font-size:13px;margin-bottom:14px}
.rules{list-style:none;padding:0;margin:-4px 0 12px;font-size:12px;color:var(--muted);display:grid;grid-template-columns:1fr 1fr;gap:3px}
.rules li::before{content:"○ "}.rules li.ok{color:#2E8B57}.rules li.ok::before{content:"● "}
code{font-size:12px;word-break:break-all;background:#F2F4F6;padding:2px 6px;border-radius:5px}
.foot{text-align:center;color:#A9B6CA;font-size:12px;margin-top:14px}