:root { color-scheme:dark; font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; background:#11110f; color:#f6f1e5; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(ellipse at 50% -12%,#363024 0%,#171715 42%,#0b0c0b 100%); }
.shell { width:min(100% - 36px,520px); margin:0 auto; padding:48px 0 36px; }
.logo { width:155px; height:auto; display:block; }
.eyebrow { margin:38px 0 11px; color:#d4bd7b; font-size:11px; letter-spacing:.19em; font-weight:700; }
h1 { margin:0; font-size:clamp(25px,5vw,33px); letter-spacing:.04em; line-height:1.3; }
.intro { color:#d6d0c3; font-size:15px; line-height:1.8; margin:12px 0 22px; }
.panel { padding:23px; border:1px solid #62553a; border-radius:12px; background:#f4f0e7; color:#24221d; }
label:not(.remember) { display:block; font-size:14px; font-weight:700; margin-bottom:9px; }
input:not([type=checkbox]) { width:100%; border:1px solid #a89d89; border-radius:7px; background:#fff; color:#1f1e1a; padding:13px 12px; font:inherit; font-size:17px; }
.helper { font-size:12px; color:#625c51; line-height:1.7; margin:7px 0 15px; }
.remember { display:flex; gap:9px; align-items:center; font-size:14px; line-height:1.5; font-weight:600; }
.remember input { width:18px; height:18px; margin:0; accent-color:#78602c; flex:none; }
button { border:0; border-radius:7px; width:100%; padding:14px 16px; color:#fff6e3; background:#28241b; font:inherit; font-weight:700; cursor:pointer; }
button:hover { background:#473b20; } button:disabled { opacity:.65; cursor:wait; }
input:focus-visible,button:focus-visible { outline:3px solid #b2801c; outline-offset:3px; }
.result { margin-top:16px; padding:20px 22px; border-radius:10px; border:1px solid #b99b54; background:#252318; }
.result[hidden] { display:none; } .result.fail { border-color:#a6907b; background:#28231f; }
.result-tag { color:#ddc487; font-size:11px; letter-spacing:.13em; font-weight:700; margin:0 0 7px; }
.result h2 { font-size:19px; margin:0 0 7px; } .result p:last-child { color:#e2ddcf; margin:0; font-size:14px; line-height:1.8; overflow-wrap:anywhere; }
.help { margin:28px 0 0; padding-left:15px; border-left:2px solid #b99b54; }
.help h2 { font-size:15px; color:#e3c980; margin:0 0 7px; } .help p,.notice { color:#d0c9ba; font-size:13px; line-height:1.8; margin:0; }
.notice { margin-top:25px; } footer { margin-top:36px; color:#aaa395; font-size:12px; }
@media(max-width:360px) { .shell { width:calc(100% - 28px); padding-top:34px; } .panel { padding:18px; } }