:root{--green:#79cf00;--ink:#111820;--muted:#687780;--bg:#edf3f6;--line:#b9c3c7}
*{box-sizing:border-box}
body.auth-screen{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font:16px Inter,system-ui,-apple-system,"Segoe UI",sans-serif;padding-bottom:84px}
.sport-pattern{height:43vh;min-height:280px;max-height:520px;overflow:hidden;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;gap:24px;padding:30px;background:#dfe9ed;color:#a9b8bd;font-size:48px;filter:grayscale(1);opacity:.75}
.sport-pattern span:nth-child(2n){transform:rotate(18deg)}
.sport-pattern span:nth-child(3n){transform:rotate(-20deg)}
.back{position:absolute;top:28px;left:20px;z-index:5;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#607078cc;color:#fff;text-decoration:none;font-size:52px;font-weight:200;line-height:1}
.auth-sheet{position:relative;margin-top:-38px;min-height:60vh;padding:34px 30px 110px;border-radius:38px 38px 0 0;background:var(--bg)}
.auth-sheet h1{font-size:42px;line-height:1.05;margin:20px 0 34px;letter-spacing:-1.5px}
.auth-title{text-align:center;margin-top:-90px;background:#fff;padding:16px 20px;border-bottom:1px solid #dce3e6}
.auth-title h1{font-size:27px;margin:0}
.auth-title p{margin:6px 0 0;color:var(--muted)}
.auth-error{padding:12px 14px;margin:15px 0;border-radius:12px;background:#ffe3e5;color:#b82f3c}
.white-card{margin:22px -8px;padding:10px 28px 20px;border-radius:28px;background:#fff}
.line-input{position:relative;display:block;margin:26px 0}
.line-input span,.phone-line label span,.country small{display:block;color:var(--muted);font-size:14px;margin-bottom:4px}
.line-input input,.line-input select,.phone-line input{display:block;width:100%;height:45px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font-size:20px;outline:none}
.line-input select{appearance:none}
.phone-line{display:grid;grid-template-columns:160px 1fr 52px;align-items:end;gap:14px;margin:26px 0}
.country{height:51px;border-bottom:1px solid var(--line)}
.country strong{display:block;font-size:20px;white-space:nowrap}
.method-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:var(--green);color:#fff;font-size:24px}
.eye{position:absolute;right:0;bottom:7px;border:0;background:none;color:#65757d;font-size:22px}
.remember{display:flex;gap:10px;align-items:center;color:var(--muted);margin:12px 0 25px}
.remember input,.check input{width:25px;height:25px;accent-color:var(--green)}
.submit{width:100%;border:0;border-radius:13px;padding:15px;background:var(--green);color:#fff;font-size:19px;font-weight:850}
.forgot{display:block;text-align:center;margin:28px 0;color:var(--green);font-weight:750;text-decoration:none}
.switch-auth{text-align:center;color:var(--muted);margin:55px 0 10px}
.switch-auth a,.legal-links a{color:var(--green);font-weight:750;text-decoration:none}
.password-note{display:flex;gap:12px;align-items:center;background:var(--bg);padding:15px;border-radius:15px;color:var(--muted)}
.legal-links{display:grid;gap:25px;padding:18px 10px}
.check{display:grid;grid-template-columns:30px 1fr;gap:13px;align-items:start;margin:22px 10px;line-height:1.35}
.sticky-submit{position:sticky;bottom:80px;margin:34px -30px -20px;padding:14px 22px;background:#fff;border-radius:25px 25px 0 0;box-shadow:0 -8px 25px #263a460f}
.register-sheet .switch-auth{margin-top:45px}

/* Compact login layout: keeps the form visible with minimal scrolling. */
body.auth-screen:has(.login-sheet) .sport-pattern{height:27vh;min-height:170px;max-height:240px;grid-template-columns:repeat(6,1fr);gap:12px;padding:18px 24px;font-size:34px}
body.auth-screen:has(.login-sheet) .back{top:18px;width:44px;height:44px;font-size:42px}
.login-sheet{margin-top:-26px;min-height:0;padding:20px 28px 92px;border-radius:28px 28px 0 0}
.login-sheet h1{font-size:34px;margin:8px 0 18px;letter-spacing:-1px}
.login-sheet .auth-error{padding:9px 12px;margin:8px 0 12px}
.login-sheet .phone-line{grid-template-columns:126px minmax(0,1fr) 44px;gap:10px;margin:14px 0}
.login-sheet .country{height:47px}
.login-sheet .country strong{font-size:18px}
.login-sheet .phone-line input{height:41px;font-size:18px}
.login-sheet .method-icon{width:44px;height:44px;font-size:21px}
.login-sheet .line-input{margin:16px 0}
.login-sheet .line-input input{height:40px;font-size:18px}
.login-sheet .remember{margin:7px 0 14px}
.login-sheet .remember input{width:21px;height:21px}
.login-sheet .submit{padding:12px;font-size:18px}
.login-sheet .forgot{margin:17px 0}
.login-sheet .switch-auth{margin:24px 0 0}

/* Ultra-compact authentication screens: no page scrolling on a normal phone. */
body.auth-screen:has(.login-sheet),body.auth-screen:has(.register-sheet){height:100dvh;min-height:0;overflow:hidden;padding-bottom:76px}
body.auth-screen:has(.login-sheet) .sport-pattern{height:118px;min-height:118px;max-height:118px;padding:10px 22px;font-size:27px}
body.auth-screen:has(.login-sheet) .sport-pattern span:nth-child(n+7){display:none}
.login-sheet{height:calc(100dvh - 194px);min-height:0;margin-top:-18px;padding:15px 24px 78px;overflow:hidden}
.login-sheet h1{font-size:28px;margin:2px 0 12px}
.login-sheet .phone-line{margin:8px 0;grid-template-columns:112px minmax(0,1fr) 40px;gap:8px}
.login-sheet .country{height:42px}
.login-sheet .country small,.login-sheet .phone-line label span,.login-sheet .line-input span{font-size:12px}
.login-sheet .country strong{font-size:16px}
.login-sheet .phone-line input,.login-sheet .line-input input{height:36px;font-size:16px}
.login-sheet .method-icon{width:40px;height:40px;font-size:18px}
.login-sheet .line-input{margin:10px 0}
.login-sheet .remember{margin:4px 0 9px;font-size:13px}
.login-sheet .remember input{width:18px;height:18px}
.login-sheet .submit{padding:10px;font-size:16px}
.login-sheet .forgot{margin:10px 0;font-size:13px}
.login-sheet .switch-auth{margin:10px 0 0;font-size:13px}

body.auth-screen:has(.register-sheet) .sport-pattern{display:none}
body.auth-screen:has(.register-sheet) .back{position:fixed;top:9px;left:12px;width:40px;height:40px;background:transparent;color:var(--muted);font-size:42px}
.register-sheet{height:calc(100dvh - 76px);min-height:0;margin:0;padding:66px 14px 76px;border-radius:0;overflow:hidden}
.register-sheet .auth-title{position:absolute;top:0;left:0;right:0;height:58px;margin:0;padding:7px 54px;background:#fff}
.register-sheet .auth-title h1{font-size:21px;line-height:1.05}
.register-sheet .auth-title p{margin:3px 0 0;font-size:12px}
.register-sheet form{height:100%;display:flex;flex-direction:column;gap:6px}
.register-sheet .auth-error{padding:6px 9px;margin:0;font-size:12px}
.register-sheet .white-card{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;margin:0;padding:7px 14px 9px;border-radius:17px}
.register-sheet .white-card>.line-input{margin:0;min-width:0}
.register-sheet .white-card>.line-input:nth-child(1),.register-sheet .white-card>.phone-line,.register-sheet .white-card>.password-note{grid-column:1/-1}
.register-sheet .line-input span,.register-sheet .phone-line label span,.register-sheet .country small{font-size:11px;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.register-sheet .line-input input,.register-sheet .line-input select,.register-sheet .phone-line input{height:30px;font-size:14px}
.register-sheet .phone-line{grid-template-columns:96px minmax(0,1fr);gap:8px;margin:0}
.register-sheet .country{height:33px}
.register-sheet .country strong{font-size:14px}
.register-sheet .eye{bottom:3px;font-size:17px}
.register-sheet .password-note{padding:5px 8px;border-radius:9px;font-size:11px}
.register-sheet .legal-links{display:flex;justify-content:space-between;gap:8px;padding:2px 6px;font-size:11px}
.register-sheet .check{grid-template-columns:19px minmax(0,1fr);gap:7px;margin:0 5px;font-size:11px;line-height:1.15}
.register-sheet .check input{width:17px;height:17px;margin:0}
.register-sheet .sticky-submit{position:static;margin:auto 0 0;padding:0;background:transparent;border-radius:0;box-shadow:none}
.register-sheet .submit{padding:9px;font-size:15px}
.register-sheet .switch-auth{margin:0;text-align:center;font-size:11px}
.register-sheet .country-select select{padding-right:4px}
.register-sheet .checks-grid{display:grid;gap:4px}
.auth-success{padding:10px 12px;margin:10px 0;border-radius:12px;background:#e2f7c8;color:#3d7400}
.legal-page,.reset-page{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font:15px Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.legal-page header{position:sticky;top:0;display:flex;align-items:center;gap:12px;padding:14px 18px;background:#fff;border-bottom:1px solid #dce3e6}
.legal-page header a,.reset-back{color:var(--muted);font-size:38px;line-height:1;text-decoration:none}
.legal-page h1{font-size:21px;margin:0}.legal-page main{max-width:680px;margin:auto;padding:18px}.legal-page h2{font-size:16px;margin:18px 0 6px}.legal-page p{color:var(--muted);line-height:1.55;margin:0}
.reset-page{display:grid;place-items:center;padding:20px}.reset-page main{position:relative;width:min(100%,440px);padding:28px 24px;background:#fff;border-radius:24px}.reset-page h1{font-size:26px;margin:10px 0}.reset-page p{color:var(--muted)}.reset-page .reset-back{position:absolute;top:10px;right:18px}

@media(max-height:650px){
  .login-sheet{padding-top:10px}
  body.auth-screen:has(.login-sheet) .sport-pattern{height:94px;min-height:94px;max-height:94px}
  .login-sheet{height:calc(100dvh - 170px)}
  .register-sheet{padding-top:60px}
  .register-sheet .white-card{gap:1px 10px;padding-top:4px;padding-bottom:5px}
  .register-sheet .line-input input,.register-sheet .line-input select,.register-sheet .phone-line input{height:27px}
  .register-sheet .password-note{display:none}
  .register-sheet .legal-links{padding:0 6px}
  .register-sheet .check{font-size:10px}
}

@media(max-height:700px){
  body.auth-screen:has(.login-sheet) .sport-pattern{font-size:25px}
  body.auth-screen:has(.login-sheet) .sport-pattern span:nth-child(n+7){display:none}
}

@media(max-width:390px){
  .login-sheet{padding-left:20px;padding-right:20px}
  .login-sheet .phone-line{grid-template-columns:112px minmax(0,1fr) 42px;gap:8px}
  .login-sheet .country strong{font-size:17px}
}

@media(min-width:760px){
  body.auth-screen{max-width:520px;margin:auto;box-shadow:0 0 70px #14283426}
  .auth-sheet{border-radius:38px}
  .sport-pattern{border-radius:0}
  .bottom{max-width:520px}
  .register-sheet{padding-left:38px;padding-right:38px}
}
