@layer theme,base;@layer components{.auth-card{background:var(--color-white);border:1px solid var(--color-line-soft);border-radius:var(--radius-lg);box-shadow:0 40px 90px -44px color-mix(in srgb, var(--shadow-tint) 30%, transparent);justify-self:end;width:100%;max-width:480px;padding:clamp(32px,3vw,44px)}.auth-card h2{font-size:var(--text-h3);letter-spacing:-.02em}.card-sub{font-size:var(--text-ui);color:var(--color-ink-2);margin-top:12px;line-height:1.55}.card-sub b{color:var(--color-ink);word-break:break-all;font-weight:600}.auth-form{margin-top:28px}.field label,.otp-label{font:500 var(--text-small) / 1 var(--font-body);letter-spacing:.01em;margin-bottom:12px;display:block}.field input:is([type=email],[type=text]){border:1px solid var(--color-line);border-radius:var(--radius-md);background:var(--color-paper);width:100%;height:56px;font:400 var(--text-ui) / 1 var(--font-body);color:var(--color-ink);transition:border-color .25s var(--ease-soft), box-shadow .25s var(--ease-soft), background .25s var(--ease-soft);padding:0 20px}.field input::placeholder{color:var(--color-ink-3)}.field input:focus{border-color:var(--color-accent);box-shadow:0 0 0 4px color-mix(in srgb, var(--color-accent) 14%, transparent);background:var(--color-white);outline:none}.field input[aria-invalid=true]{border-color:var(--color-danger)}.form-msg{font-size:var(--text-small);min-height:1.5em;margin-top:16px;line-height:1.5}.form-msg.is-err{color:var(--color-danger)}.form-msg.is-ok{color:var(--color-accent-deep)}.consent{border:0;flex-direction:column;gap:12px;margin-top:20px;display:flex}.check{font-size:var(--text-small);color:var(--color-ink-2);cursor:pointer;grid-template-columns:20px minmax(0,1fr);align-items:start;gap:12px;line-height:1.5;display:grid}.check input{appearance:none;border-radius:var(--radius-xs);border:1.5px solid var(--color-ink-4);background:var(--color-white);cursor:pointer;place-items:center;width:20px;height:20px;margin-top:1px;transition:background .12s linear,border-color .12s linear;display:grid}.check input:checked{background:var(--color-ink);border-color:var(--color-ink)}.check input:checked:after{content:"";border:2px solid var(--color-white);border-top:0;border-right:0;width:9px;height:5px;transform:rotate(-45deg)translate(1px,-1px)}.check input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.check a{color:var(--color-accent-deep);text-underline-offset:3px;text-decoration:underline}.otp{grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(8px,1.2vw,12px);display:grid}.otp input{border:1px solid var(--color-line);border-radius:var(--radius-md);background:var(--color-paper);text-align:center;width:100%;height:60px;font:500 var(--text-title) / 1 var(--font-mono);color:var(--color-ink);caret-color:var(--color-accent);transition:border-color .2s var(--ease-soft), box-shadow .2s var(--ease-soft), background .2s var(--ease-soft)}.otp input:focus{border-color:var(--color-accent);box-shadow:0 0 0 4px color-mix(in srgb, var(--color-accent) 14%, transparent);background:var(--color-white);outline:none}.otp.is-err input{border-color:var(--color-danger);background:var(--color-danger-bg)}.otp.shake{animation:shake .42s var(--ease-soft)}.code-links{flex-wrap:wrap;gap:8px 24px;margin-top:20px;display:flex}.text-btn{font:500 var(--text-small) / 1.4 var(--font-body);color:var(--color-accent-deep);text-underline-offset:3px;text-decoration:underline}.text-btn:disabled{color:var(--color-ink-3);cursor:not-allowed;text-decoration:none}.back-btn{margin-top:20px}.devices{border:0;flex-direction:column;gap:12px;display:flex}.device{border-radius:var(--radius-md);border:1px solid var(--color-line);cursor:pointer;transition:border-color .2s var(--ease-soft), background .2s var(--ease-soft), box-shadow .2s var(--ease-soft);grid-template-columns:44px minmax(0,1fr);align-items:center;gap:16px;padding:16px;display:grid;position:relative}.device:hover{border-color:var(--color-ink-4)}.device input{opacity:0;cursor:pointer;position:absolute;inset:0}.device:has(input:checked){border-color:var(--color-ink);background:var(--color-paper);box-shadow:inset 0 0 0 1px var(--color-ink)}.device:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}.dev-ic{border-radius:var(--radius-sm);background:var(--color-ice);width:44px;height:44px;color:var(--color-accent-deep);place-items:center;display:grid}.dev-ic svg{width:21px;height:21px}.dev-t b{font:500 var(--text-ui) / 1.3 var(--font-body);display:block}.dev-t small{font-size:var(--text-caption);color:var(--color-ink-3);margin-top:2px;display:block}.confirm{border-radius:var(--radius-md);background:var(--color-warning-bg);font-size:var(--text-small);color:var(--color-ink);margin-top:20px;padding:16px;line-height:1.55}.confirm-btns{gap:12px;margin-top:12px;display:flex}.done-ic{background:var(--color-success-bg);width:56px;height:56px;color:var(--color-success);border-radius:50%;place-items:center;margin-bottom:20px;display:grid}.done-ic svg{width:26px;height:26px}@media (width<=1080px){.auth-card{justify-self:stretch;max-width:none}}@media (width<=640px){.otp input{border-radius:var(--radius-sm);height:54px}}@media (prefers-reduced-motion:reduce){.otp.shake{animation:none}}}@layer utilities;@keyframes shake{20%{transform:translate(-7px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(3px)}}
