@import url('https://fonts.googleapis.com/css2?family=Finger+Paint&display=swap');
:root{color-scheme:dark;--bg:#0d1117;--box:#171c24;--line:#344052;--blue:#77c9ff;--pink:#ff8fb8;--muted:#aab4c4;--green:#8ee3a1}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:#f5f7fb;font-family:'Finger Paint',sans-serif}main{width:min(1050px,calc(100% - 32px));margin:auto;padding:28px 0 40px}header{text-align:center;margin-bottom:24px}h1{font-size:clamp(1.7rem,4vw,2.7rem);margin:0 0 8px}h2{margin-top:0;color:var(--blue)}p{color:var(--muted)}.card{background:var(--box);border:1px solid var(--line);border-radius:17px;padding:22px;margin:16px 0}label{display:grid;gap:7px;margin:14px 0;color:var(--muted)}select,input{width:100%;min-height:50px;border:1px solid var(--line);border-radius:11px;background:#0f141b;color:#fff;padding:10px 14px;font:inherit}#pin-code{font-size:1.55rem;letter-spacing:.45em;text-align:center}button{border:0;border-radius:11px;background:var(--blue);color:#08111b;padding:11px 18px;font:inherit;cursor:pointer}button.secondary,.reset{background:var(--pink)}button:disabled{opacity:.45;cursor:wait}.buttons{display:flex;gap:12px;flex-wrap:wrap}.result{min-height:28px;color:#fff}.result.ok{color:var(--green)}.result.bad{color:var(--pink)}.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px;padding-left:24px}.steps li{color:#7f8998}.steps li.done{color:var(--green)}.reset{display:block;margin:22px auto 0}@media(max-width:650px){.steps{grid-template-columns:1fr}.card{padding:17px}}