/* Staff auth pages: login, forgot/reset password, signup, subscription */
*,*::before,*::after{ box-sizing:border-box }
:root{ --brand:#169ca6; --brand2:#0f6f78; --ink:#0f172a; --ink2:#475569; --ink3:#94a3b8; --line:#e5e7eb; --bg:#f6f7fb; --ok:#047857; --okbg:#ecfdf5; --bad:#b91c1c; --badbg:#fef2f2; }
html,body{ margin:0; height:100%; font:15px/1.5 "Plus Jakarta Sans",system-ui,sans-serif; color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased }
a{ color:var(--brand); text-decoration:none } a:hover{ text-decoration:underline }
.auth{ min-height:100vh; display:grid; grid-template-columns: minmax(380px, 46%) 1fr; }
.auth-side{ position:relative; overflow:hidden; color:#fff; padding:44px 52px; display:flex; flex-direction:column; justify-content:space-between;
  background: radial-gradient(900px 520px at 110% 110%, rgba(52,179,187,.45), transparent 60%), linear-gradient(155deg, #0c1a1f 0%, #12343a 55%, #13707a 100%); }
.auth-side::after{ content:""; position:absolute; right:-120px; bottom:-120px; width:420px; height:420px; border-radius:50%; border:70px solid rgba(255,255,255,.06); }
.auth-brand{ display:flex; align-items:center; gap:10px; font-weight:800; font-size:18px; letter-spacing:-.01em }
.auth-brand .mark{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; background:rgba(255,255,255,.16); font-size:18px }
.auth-pitch h2{ font-size:34px; line-height:1.15; letter-spacing:-.02em; margin:0 0 22px; max-width:420px }
.auth-pitch ul{ list-style:none; padding:0; margin:0; display:grid; gap:12px }
.auth-pitch li{ display:flex; gap:10px; align-items:center; color:rgba(255,255,255,.9); font-weight:500 }
.auth-pitch li i{ color:#a5f3fc }
.auth-foot{ color:rgba(255,255,255,.6); font-size:13px }
.auth-main{ display:grid; place-items:center; padding:32px 20px; background:var(--bg) }
.auth-card{ width:100%; max-width:410px; background:#fff; border:1px solid var(--line); border-radius:20px; padding:34px 32px; box-shadow:0 20px 50px rgba(15,23,42,.06) }
.auth-card h1{ font-size:26px; letter-spacing:-.02em; margin:0 0 4px }
.auth-card .sub{ color:var(--ink2); margin:0 0 22px }
.only-mobile{ display:none; color:var(--ink); margin-bottom:20px } .only-mobile .mark{ background:var(--brand); color:#fff }
.fld{ display:flex; flex-direction:column; gap:7px; font-weight:600; font-size:13.5px; color:var(--ink2); margin-bottom:16px }
.fld .row{ display:flex; justify-content:space-between; align-items:center }
.fld input, .fld select{ font:inherit; font-size:15px; font-weight:500; color:var(--ink); height:46px; padding:0 14px; border:1px solid var(--line); border-radius:12px; background:#fff; outline:none; transition:border-color .15s, box-shadow .15s; width:100% }
.fld input:focus, .fld select:focus{ border-color:var(--brand); box-shadow:0 0 0 4px rgba(22,156,166,.16) }
.fld .hint{ font-weight:500; font-size:12.5px; color:var(--ink3) }
.pw{ position:relative; display:block } .pw input{ padding-right:46px }
.pw button{ position:absolute; right:6px; top:50%; transform:translateY(-50%); border:0; background:none; width:36px; height:36px; border-radius:9px; color:var(--ink3); cursor:pointer; font-size:17px }
.pw button:hover{ background:#f1f5f9; color:var(--ink) }
.link{ font-weight:600; font-size:13.5px }
.btn-main{ position:relative; width:100%; height:48px; border:0; border-radius:12px; background:var(--brand); color:#fff; font:700 15px inherit; font-family:inherit; cursor:pointer; margin-top:6px; transition:filter .15s }
.btn-main:hover{ filter:brightness(1.08) } .btn-main:disabled{ opacity:.7; cursor:default }
.btn-main.busy span{ visibility:hidden }
.btn-main.busy::after{ content:""; position:absolute; inset:0; margin:auto; width:18px; height:18px; border:2px solid rgba(255,255,255,.4); border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite }
.note{ padding:11px 13px; border-radius:11px; font-size:14px; font-weight:600; margin-bottom:16px }
.note.ok{ background:var(--okbg); color:var(--ok) } .note.bad{ background:var(--badbg); color:var(--bad) }
.alt{ text-align:center; color:var(--ink2); font-size:13.5px; margin:20px 0 0 }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:0 12px }
@keyframes spin{ to{ transform:rotate(360deg) } }
@media (max-width: 860px){ .auth{ grid-template-columns:1fr } .auth-side{ display:none } .only-mobile{ display:flex } .auth-card{ padding:28px 22px } .grid2{ grid-template-columns:1fr } }

/* GymPilot brand */
.gp-word{ font-weight:800; letter-spacing:-.02em } .gp-word b{ color:#5fd3da; font-weight:800 }
.only-mobile .gp-word b{ color:var(--brand) }
.auth-brand .mark{ background:linear-gradient(135deg,#34b3bb,#13707a) !important; color:#fff }
.by-scaleup{ display:inline-flex; align-items:center; gap:12px; background:#fff; border-radius:14px; padding:10px 16px; color:#334155; font-size:12.5px; font-weight:600; box-shadow:0 10px 30px rgba(0,0,0,.18) }
.by-scaleup img{ height:26px; display:block }
.card-by{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:22px; padding-top:18px; border-top:1px solid var(--line); color:var(--ink3); font-size:12px; font-weight:600 }
.card-by img{ height:18px }