/* ── Sign-in ── */
@font-face{font-family:"Plus Jakarta Sans";src:url(/fonts/PlusJakartaSans-400.ttf);font-weight:400}
@font-face{font-family:"Plus Jakarta Sans";src:url(/fonts/PlusJakartaSans-700.ttf);font-weight:700}
@font-face{font-family:"Plus Jakarta Sans";src:url(/fonts/PlusJakartaSans-800.ttf);font-weight:800}
body{font-family:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif}
.auth{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--card)}
.auth-art{position:relative;overflow:hidden;color:#fff;background:radial-gradient(120% 80% at 20% 10%,#1BA37D 0%,var(--court) 45%,#073F31 100%);display:flex;align-items:flex-end;padding:48px}
.auth-art .court{position:absolute;inset:0;width:100%;height:100%;opacity:.22;transform:perspective(900px) rotateX(38deg) scale(1.15);transform-origin:50% 70%}
.auth-art .court *{fill:none;stroke:#fff;stroke-width:3}.auth-art .court .net{stroke:#D9F24B;stroke-width:5;stroke-dasharray:10 7}
.ball-track{position:absolute;left:58%;top:16%;width:80px;height:46%}
.ball{position:absolute;left:0;top:0;width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#F0FF8A,#D9F24B 55%,#A9C21C);box-shadow:inset -6px -8px 12px rgba(0,0,0,.18);animation:bounce 1.6s cubic-bezier(.45,0,.55,1) infinite}
.ball::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,#B5CC2C 2.5px,transparent 3px) 0 0/16px 16px;opacity:.75}
.shadow{position:absolute;left:4px;bottom:-6px;width:50px;height:10px;border-radius:50%;background:rgba(0,0,0,.28);filter:blur(3px);animation:shadow 1.6s cubic-bezier(.45,0,.55,1) infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(calc(46vh - 120px)) scale(1.04,.94)}}
@keyframes shadow{0%,100%{transform:scale(.55);opacity:.35}50%{transform:scale(1);opacity:.8}}
@media (prefers-reduced-motion:reduce){.ball,.shadow{animation:none}}
.auth-art-copy{position:relative;max-width:420px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.02em;font-size:18px}
.logo img{border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.auth-art h1{font-size:56px;line-height:1;margin:18px 0 10px;letter-spacing:-.02em}
.auth-art p{font-size:18px;opacity:.9;margin:0}
.auth-panel{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;align-items:center;padding:40px 24px;background:var(--bg)}
.auth-card{position:relative;z-index:1;width:100%;max-width:400px;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:32px;box-shadow:0 24px 60px rgba(11,42,32,.10);display:grid;gap:14px;animation:rise .45s ease-out}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.small-logo{color:var(--court);font-size:14px}.small-logo img{box-shadow:none;border-radius:8px}
.auth-card h2{font-size:28px;margin:6px 0 0;letter-spacing:-.01em}.auth-card>.muted{margin:-6px 0 4px}
.field{display:grid;gap:6px;font-weight:700;font-size:13px}
.input{position:relative;display:flex;align-items:center}
.input svg{position:absolute;left:12px;width:18px;height:18px;fill:none;stroke:var(--muted);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.input input{padding:13px 14px 13px 40px;border-radius:12px;font-size:15px;font-weight:400;transition:border-color .15s,box-shadow .15s}
.input input:focus{outline:none;border-color:var(--court);box-shadow:0 0 0 4px rgba(15,123,95,.14)}
.input input.code{letter-spacing:.5em;font-weight:700}
.reveal{position:absolute;right:8px;background:none;border:0;color:var(--court);font-weight:700;font-size:12px;cursor:pointer;padding:6px 8px;border-radius:8px}
.reveal:hover{background:rgba(15,123,95,.08)}.input:has(.reveal) input{padding-right:64px}
.form-row{display:flex;justify-content:space-between;align-items:center;margin-top:-6px}
.form-error{margin:0;color:var(--danger);font-weight:600;font-size:13px;background:#fdecec;border-radius:10px;padding:10px 12px}
.form-error:empty{display:none}
.primary.big{position:relative;padding:14px;font-size:15px;border-radius:14px;display:flex;justify-content:center;align-items:center;gap:10px;transition:transform .1s,filter .15s,opacity .15s}
.primary.big:hover{filter:brightness(1.08)}.primary.big:active{transform:scale(.98)}
.primary.big[disabled]{opacity:.75;cursor:progress}
.spinner{display:none;width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;animation:spin .7s linear infinite}
.busy .spinner{display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}
.fine{margin:2px 0 0;font-size:12px;color:var(--muted);text-align:center}.fine a{color:var(--court);font-weight:600}
.center-link{justify-self:center}
.steps{display:flex;gap:8px;list-style:none;padding:0;margin:0;counter-reset:s}
.steps li{counter-increment:s;flex:1;font-size:12px;font-weight:700;color:var(--muted);border-top:3px solid var(--line);padding-top:6px}
.steps li::before{content:counter(s) ". "}.steps li.on{color:var(--court);border-color:var(--court)}
@media (max-width:860px){
  .auth{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .auth-art{padding:28px 24px 56px;min-height:220px}.auth-art h1{font-size:36px;margin:12px 0 6px}.auth-art p{font-size:15px}
  .ball-track{left:auto;right:28px;top:18px;height:130px}.ball{width:40px;height:40px}.shadow{width:34px}
  @keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(84px) scale(1.04,.94)}}
  .auth-panel{align-items:start;padding:0 16px 40px}.auth-card{padding:24px;margin-top:-32px}
  .small-logo{display:none}
}
