:root{--bg:#f4f6f8;--surface:#fff;--ink:#16202b;--ink-2:#55636f;--rule:#d8e0e7;--accent:#1f5c8b;--danger:#a63a28}@media (prefers-color-scheme:dark){:root{--bg:#0f171e;--surface:#18212b;--ink:#e3eaf0;--ink-2:#9dadba;--rule:#2a3644;--accent:#77b4df;--danger:#e2887a}}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);justify-content:center;align-items:center;min-height:100vh;margin:0;font-family:IBM Plex Sans KR,Apple SD Gothic Neo,system-ui,sans-serif;display:flex}.card{background:var(--surface);border:1px solid var(--rule);border-radius:6px;width:min(400px,100vw - 32px);padding:36px 32px;box-shadow:0 8px 28px -14px #00000047}h1{letter-spacing:-.01em;margin:0 0 6px;font-size:21px}.sub{color:var(--ink-2);margin:0 0 24px;font-size:14px}label{color:var(--ink-2);margin-bottom:6px;font-size:13px;display:block}input{border:1px solid var(--rule);background:var(--bg);width:100%;color:var(--ink);border-radius:4px;padding:11px 13px;font-size:15px}input:focus{outline:2px solid var(--accent);outline-offset:1px}button{border:1px solid var(--accent);cursor:pointer;background:var(--accent);width:100%;color:var(--surface);border-radius:4px;margin-top:12px;padding:11px 14px;font-size:15px;font-weight:600}button.ghost{color:var(--accent);background:0 0}button:disabled{opacity:.55;cursor:default}.err{color:var(--danger);min-height:20px;margin-top:14px;font-size:13.5px}.otp{letter-spacing:.5em;text-align:center;font-size:20px}