.clara-login{--font-ui:var(--font-hanken), system-ui, sans-serif;--font-voice:var(--font-newsreader), Georgia, serif;--font-mono:var(--font-plex-mono), ui-monospace, monospace;--grad:linear-gradient(118deg, #3ecf8e 0%, #3b82f6 100%);font-family:var(--font-ui);background:var(--canvas);color:var(--ink);flex-direction:column;min-height:100vh;line-height:1.5;transition:background .4s,color .4s;display:flex}.clara-login[data-theme=dark]{--canvas:#0e1116;--canvas-2:#0a0d11;--surface:#161a21;--surface-2:#1b212b;--ink:#e8edf3;--ink-2:#b4bdc8;--muted:#7e8a98;--line:#232a33;--line-2:#303843;--attn:#e0903e;--shadow:0 1px 2px #0006, 0 40px 90px -38px #000000eb;--glow:.6}.clara-login[data-theme=light]{--canvas:#f6f1e8;--canvas-2:#efe8db;--surface:#fff;--surface-2:#fbf6ec;--ink:#211c15;--ink-2:#564e43;--muted:#8c8377;--line:#e7dfd1;--line-2:#d9cdb9;--attn:#b0712a;--shadow:0 1px 2px #3c280a0d, 0 40px 90px -42px #3c280a80;--glow:.42}.clara-login a{color:inherit;text-decoration:none}.clara-login button,.clara-login input{font-family:inherit}.clara-login .topbar{border-bottom:1px solid color-mix(in srgb, var(--line) 70%, transparent);justify-content:space-between;align-items:center;height:68px;padding:0 28px;display:flex}.clara-login .brand{align-items:center;gap:10px;display:flex}.clara-login .brand-logo{-o-object-fit:contain;object-fit:contain;flex-shrink:0;width:30px;height:30px}.clara-login .brand b{letter-spacing:-.01em;text-transform:lowercase;background:var(--grad);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:22px;font-weight:700}.clara-login .theme-toggle{border:1px solid var(--line-2);background:var(--surface);width:38px;height:38px;color:var(--ink-2);cursor:pointer;border-radius:50%;place-items:center;transition:all .18s;display:grid}.clara-login .theme-toggle:hover{color:var(--ink);border-color:var(--ink-2)}.clara-login .stage{flex:1;justify-content:center;align-items:center;padding:48px 24px 64px;display:flex;position:relative;overflow:hidden}.clara-login .stage-glow{background:radial-gradient(ellipse at center, color-mix(in srgb, #3b82f6 calc(var(--glow) * 26%), transparent), transparent 62%);filter:blur(26px);pointer-events:none;z-index:0;width:620px;max-width:130vw;height:540px;position:absolute;top:50%;left:50%;transform:translate(-50%,-64%)}.clara-login .authcard{z-index:1;background:var(--surface);border:1px solid var(--line);width:100%;max-width:432px;box-shadow:var(--shadow);text-align:center;border-radius:26px;padding:40px 38px 34px;position:relative}.clara-login .mark{background:radial-gradient(circle,#3b82f638,#0000 70%);border-radius:50%;place-items:center;width:76px;height:76px;margin:0 auto 26px;animation:6s ease-in-out infinite clara-login-breathe;display:grid;position:relative}.clara-login .mark-logo{-o-object-fit:contain;object-fit:contain;width:44px;height:44px}.clara-login .mark-check{background:var(--grad);color:#fff;border-radius:50%;place-items:center;width:26px;height:26px;transition:transform .45s cubic-bezier(.2,.8,.2,1);display:grid;position:absolute;bottom:2px;right:2px;transform:scale(0);box-shadow:0 0 16px -4px #3ecf8e}.clara-login .mark.busy{animation:1.9s ease-in-out infinite clara-login-breathe}.clara-login .mark.done .mark-check{transform:scale(1)}@keyframes clara-login-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}.clara-login .step{display:none}.clara-login .step.active{animation:.5s cubic-bezier(.2,.8,.2,1) clara-login-stepIn;display:block}@keyframes clara-login-stepIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.clara-login h1.title{font-family:var(--font-voice);letter-spacing:-.02em;font-size:32px;font-weight:500;line-height:1.08}.clara-login h1.title em{font-style:italic}.clara-login .sub{font-family:var(--font-voice);color:var(--ink-2);text-wrap:pretty;max-width:30ch;margin-top:11px;margin-left:auto;margin-right:auto;font-size:17px;line-height:1.5}.clara-login .sub b{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:500}.clara-login .field{text-align:left;margin-top:28px}.clara-login .field-label{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;font-size:10.5px;display:block}.clara-login .phone-field{background:var(--surface-2);border:1px solid var(--line-2);border-radius:14px;align-items:center;gap:2px;padding:4px 6px 4px 4px;transition:border-color .18s,box-shadow .18s;display:flex}.clara-login .phone-field:focus-within{border-color:color-mix(in srgb, #3b82f6 55%, var(--line-2));box-shadow:0 0 0 4px #3b82f624}.clara-login .phone-field.err{border-color:var(--attn);box-shadow:0 0 0 4px color-mix(in srgb, var(--attn) 16%, transparent)}.clara-login .phone-field .cc{font-family:var(--font-mono);color:var(--ink-2);border-right:1px solid var(--line);white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;padding:12px;font-size:14px}.clara-login .phone-field input{color:var(--ink);letter-spacing:.01em;background:0 0;border:0;outline:0;flex:1;min-width:0;padding:12px;font-size:16px}.clara-login .phone-field input::placeholder{color:var(--muted)}.clara-login .field-err{font-family:var(--font-mono);color:var(--attn);letter-spacing:.02em;opacity:0;min-height:14px;margin-top:9px;font-size:11px;transition:opacity .2s}.clara-login .field-err.show{opacity:1}.clara-login .otp{justify-content:center;gap:9px;margin-top:28px;display:flex}.clara-login .otp input{text-align:center;width:46px;height:56px;font-family:var(--font-mono);color:var(--ink);background:var(--surface-2);border:1px solid var(--line-2);border-radius:13px;outline:0;font-size:22px;transition:border-color .18s,box-shadow .18s,background .18s}.clara-login .otp input:focus{border-color:color-mix(in srgb, #3b82f6 60%, var(--line-2));box-shadow:0 0 0 4px #3b82f624}.clara-login .otp input.filled{border-color:color-mix(in srgb, #3ecf8e 42%, var(--line-2));background:color-mix(in srgb, #3b82f6 8%, var(--surface-2))}.clara-login .otp.err input{border-color:var(--attn)}@media (max-width:420px){.clara-login .otp input{width:42px;height:52px;font-size:20px}}.clara-login .btn{cursor:pointer;border:1px solid #0000;border-radius:14px;justify-content:center;align-items:center;gap:9px;width:100%;margin-top:22px;padding:15px;font-size:15px;font-weight:600;transition:all .18s;display:inline-flex}.clara-login .btn--go{background:var(--grad);color:#fff;box-shadow:0 12px 28px -14px #3b82f6}.clara-login .btn--go:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}.clara-login .btn--go:disabled{opacity:.55;cursor:default}.clara-login .btn .spin{border:2px solid #fff6;border-top-color:#fff;border-radius:50%;width:15px;height:15px;animation:.7s linear infinite clara-login-spin;display:none}.clara-login .btn.loading .spin{display:block}.clara-login .btn.loading .label{opacity:.85}@keyframes clara-login-spin{to{transform:rotate(360deg)}}.clara-login .remember{width:fit-content;font-family:var(--font-mono);letter-spacing:.04em;color:var(--muted);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;margin:22px auto 0;padding:9px 14px;font-size:11px;transition:color .15s;display:flex}.clara-login .remember:hover{color:var(--ink-2)}.clara-login .remember input{accent-color:#3ecf8e;cursor:pointer;flex-shrink:0;width:15px;height:15px}.clara-login .reassure{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:22px;font-size:10.5px}.clara-login .code-meta{flex-direction:column;align-items:center;gap:12px;margin-top:22px;display:flex}.clara-login .resend{font-family:var(--font-mono);letter-spacing:.03em;color:var(--muted);font-size:11.5px}.clara-login .resend b{color:var(--ink-2)}.clara-login .resend button{color:color-mix(in srgb, #3ecf8e 80%, var(--ink));font-family:var(--font-mono);cursor:pointer;background:0 0;border:0;padding:0;font-size:11.5px;font-weight:500}.clara-login .resend button:disabled{color:var(--muted);cursor:default}.clara-login .linkbtn{color:var(--ink-2);cursor:pointer;background:0 0;border:0;align-items:center;gap:7px;font-size:13px;transition:color .15s;display:inline-flex}.clara-login .linkbtn:hover{color:var(--ink)}.clara-login .linkbtn svg{width:14px;height:14px}.clara-login .dev-hint{font-family:var(--font-mono);letter-spacing:.02em;color:var(--attn);margin-top:16px;font-size:11px}.clara-login .err-banner{font-family:var(--font-mono);letter-spacing:.02em;color:var(--attn);min-height:14px;margin-top:16px;font-size:11.5px}.clara-login .err-banner.ok{color:color-mix(in srgb, #3ecf8e 80%, var(--ink))}.clara-login .think{justify-content:center;align-items:center;gap:5px;height:18px;margin-top:24px;display:none}.clara-login .think.show{display:flex}.clara-login .think span{background:var(--muted);border-radius:50%;width:6px;height:6px;animation:1.3s ease-in-out infinite clara-login-think}.clara-login .think span:nth-child(2){animation-delay:.18s}.clara-login .think span:nth-child(3){animation-delay:.36s}@keyframes clara-login-think{0%,to{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}.clara-login .shake{animation:.35s clara-login-shake}@keyframes clara-login-shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.clara-login footer{text-align:center;font-family:var(--font-mono);letter-spacing:.02em;color:var(--muted);padding:22px;font-size:11.5px}@media (prefers-reduced-motion:reduce){.clara-login *{animation:none!important}}