/* Pages de connexion et d'ajout de boutique : même charte que le tableau de bord. */
body.auth{min-height:100vh;display:grid;place-items:center;padding:32px 16px;background:radial-gradient(1100px 520px at 50% -8%,#0f2a20 0%,transparent 62%),var(--bg)}
.auth-wrap{width:100%;max-width:440px}
.auth-wrap.wide{max-width:560px}
.auth-brand{display:flex;justify-content:center;margin-bottom:28px}
.auth-card{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:30px 28px;box-shadow:0 24px 60px -30px #000c}
.auth-card+.auth-card{margin-top:16px}
.auth-card h1{font-family:var(--display);font-weight:800;font-size:28px;letter-spacing:-.8px;margin:10px 0 8px;line-height:1.15}
.auth-card h1 span{color:var(--accent)}
.auth-card p{color:var(--muted);font-size:15px;line-height:1.55;margin:0 0 4px}
.auth-card ol{margin:14px 0 0;padding-left:20px;color:var(--muted);font-size:14.5px;line-height:1.6}
.auth-card li{margin:6px 0}
.auth-card li strong{color:var(--text);font-weight:600}
.auth-card code{font-family:var(--mono);font-size:13px;background:#101316;border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:#b6d6c6}
.auth-card .fine{font-size:13px;color:var(--quiet);margin-top:14px}
.field{display:block;margin-top:18px}
.field label{display:block;font-size:13.5px;font-weight:500;color:#c7ced6;margin-bottom:7px}
.field input{width:100%;min-height:46px;padding:11px 13px;border-radius:9px;border:1px solid var(--line);background:#101316;color:var(--text);font-size:15px;transition:border-color .18s,box-shadow .18s,background .18s}
.field input::placeholder{color:#59636d}
.field input:hover{border-color:#3a4249}
.field input:focus{outline:none;border-color:var(--green-2);box-shadow:0 0 0 3px #10b98126;background:#0e1215}
.auth-actions{margin-top:22px}
.auth-card .button.primary{width:100%;min-height:46px;font-size:15px;font-weight:600;color:#fff;background:linear-gradient(180deg,#19c088,#059669);border-color:#0b8f66;box-shadow:0 8px 24px -10px #059669b0,0 1px 0 #ffffff26 inset}
.auth-card .button.primary:hover{background:linear-gradient(180deg,#22cf97,#07a875)}
.auth-card .button.primary:disabled{opacity:.6}
.auth-msg{margin-top:14px;font-size:14px;min-height:1.4em;line-height:1.45}
.auth-msg.ok{color:var(--accent)}
.auth-msg.err{color:#f3b4b4}
.auth-foot{text-align:center;margin-top:22px;font-size:13px;color:var(--quiet)}
.auth-foot a{color:#b6d6c6;border-bottom:1px solid #2e5a47}
.auth-foot a:hover{color:#fff}
.mailmark{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--forest);border:1px solid var(--forest-3);color:var(--accent)}
.mailmark .icon{width:24px;height:24px}
@media (max-width:480px){.auth-card{padding:24px 20px}.auth-card h1{font-size:25px}}

.auth-card form{padding:0;margin:0}
.otp-label{display:block;font-size:13.5px;font-weight:500;color:#c7ced6;margin-bottom:10px}
.otp{display:grid;grid-template-columns:repeat(3,1fr) 14px repeat(3,1fr);gap:8px}
.otp .otp-box:nth-child(4){grid-column:5}
.otp .otp-box{width:100%;min-height:60px;padding:0;text-align:center;font-family:var(--display);font-size:27px;font-weight:700;letter-spacing:0;border-radius:11px;caret-color:var(--accent)}
.otp .otp-box:not(:focus):not(.filled){border-color:#343b42}
.otp .otp-box.filled{border-color:#2f6b52;background:#0f1614}
.otp.err .otp-box{border-color:#b45353;animation:gw-shake .32s ease}
@keyframes gw-shake{25%{transform:translateX(-5px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}
@media (max-width:380px){.otp{gap:6px;grid-template-columns:repeat(3,1fr) 8px repeat(3,1fr)}.otp .otp-box{min-height:52px;font-size:23px}}
@media (prefers-reduced-motion:reduce){.otp.err .otp-box{animation:none}}
.connect-steps{counter-reset:cs;list-style:none;margin:26px 0 0!important;padding:20px 0 0!important;border-top:1px solid var(--line);display:grid;gap:14px}
.connect-steps li{counter-increment:cs;position:relative;margin:0!important;padding-left:38px;font-size:14.5px;line-height:1.5;color:var(--muted)}
.connect-steps li::before{content:counter(cs);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:var(--forest);border:1px solid var(--forest-3);color:var(--accent);font:700 12px var(--mono)}
.auth-card a.button.primary{display:flex;align-items:center;justify-content:center;text-decoration:none}
.auth-card.ready{border-color:#2f6b52;box-shadow:0 24px 60px -30px #000c,0 0 0 1px #10b98126}
.mailmark.wait{animation:gw-pulse 2.6s ease-out infinite}
#shops .auth-card{margin-bottom:16px}
@media (prefers-reduced-motion:reduce){.mailmark.wait{animation:none}}