:root { --ink:#12312d; --paper:#f5f2e9; --peach:#f6d3b4; --teal:#0d615b; --mint:#8de1b9; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { min-height:100vh; margin:0; color:#fff; background:radial-gradient(circle at 83% 18%,rgba(83,180,168,.44),transparent 31%),linear-gradient(135deg,#0a3d39,#07534e 68%,#0f6b64); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.login-shell { min-height:100vh; overflow:hidden; padding:28px clamp(24px,6vw,96px); }
nav { position:relative; z-index:5; display:flex; align-items:center; justify-content:space-between; max-width:1240px; margin:auto; }
nav>span { color:rgba(255,255,255,.65); font-size:11px; font-weight:650; letter-spacing:.17em; text-transform:uppercase; }
.brand { color:#fff; text-decoration:none; font-size:18px; font-weight:650; }
.brand-mark { display:inline-grid; place-items:center; width:36px; height:36px; margin-right:10px; border-radius:50%; color:var(--teal); background:#f5dfc4; font-family:Georgia,serif; }
.login-grid { position:relative; min-height:calc(100vh - 96px); max-width:1240px; margin:auto; display:flex; align-items:center; }
.login-card { position:relative; z-index:4; width:min(620px,55%); padding:64px 0; }
.eyebrow { margin:0 0 18px; color:rgba(255,255,255,.76); font-size:11px; font-weight:650; letter-spacing:.17em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(54px,6.5vw,84px); font-weight:500; line-height:.96; letter-spacing:-.055em; }
h1 em { color:var(--peach); font-family:Georgia,"Times New Roman",serif; font-weight:500; }
.intro { max-width:510px; margin:28px 0 32px; color:rgba(255,255,255,.76); font-size:17px; line-height:1.6; }
button { display:grid; grid-template-columns:30px 1fr 20px; align-items:center; width:min(440px,100%); min-height:58px; padding:0 18px; border:0; border-radius:5px; color:var(--ink); background:var(--peach); font:700 15px inherit; text-align:left; cursor:pointer; transition:transform .2s,opacity .2s; }
button:hover { transform:translateY(-2px); }
button:disabled { opacity:.65; cursor:wait; transform:none; }
.google-mark { display:grid; place-items:center; width:25px; height:25px; border-radius:50%; color:#fff; background:#fff; color:#4285f4; font:700 15px Arial,sans-serif; }
.method-divider { display:flex; align-items:center; gap:14px; width:min(440px,100%); margin:20px 0; color:rgba(255,255,255,.46); font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.method-divider::before,.method-divider::after { content:""; flex:1; height:1px; background:rgba(255,255,255,.18); }
#email-link-form { width:min(520px,100%); }
#email-link-form label { display:block; margin:0 0 8px 3px; color:rgba(255,255,255,.7); font-size:10px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.email-entry { display:grid; grid-template-columns:minmax(180px,1fr) 230px; gap:9px; }
.email-entry input { min-width:0; height:54px; padding:0 14px; border:1px solid rgba(255,255,255,.28); border-radius:5px; outline:0; color:#fff; background:rgba(1,34,32,.34); font:inherit; }
.email-entry input:focus { border-color:var(--mint); box-shadow:0 0 0 3px rgba(141,225,185,.14); }
.email-entry input::placeholder { color:rgba(255,255,255,.4); }
.email-button { grid-template-columns:24px 1fr 16px; width:100%; min-height:54px; padding:0 13px; border:1px solid rgba(255,255,255,.38); color:#fff; background:transparent; font-size:13px; }
.email-button:hover { color:var(--ink); background:#fff; }
.email-help { margin:9px 2px 0; color:rgba(255,255,255,.48); font-size:11px; line-height:1.45; }
.login-status { min-height:24px; max-width:470px; margin:16px 0 0; color:#ffc0ad; font-size:13px; line-height:1.5; }
.login-status.success { color:var(--mint); }
.request-link { margin-top:22px; color:rgba(255,255,255,.56); font-size:13px; }
.request-link a { color:#fff; }
.cruiser-stage { position:absolute; right:-4vw; bottom:-42px; width:min(49vw,600px); aspect-ratio:1; }
.stage-rings { position:absolute; inset:8%; border:1px solid rgba(255,255,255,.26); border-radius:50%; box-shadow:0 0 0 65px rgba(255,255,255,.025),0 0 0 130px rgba(255,255,255,.018); }
.cruiser-stage img { position:absolute; z-index:2; left:50%; bottom:0; width:102%; transform:translateX(-50%); filter:drop-shadow(0 30px 36px rgba(2,28,26,.34)); }
.stage-shade { position:absolute; z-index:3; right:-20%; bottom:-5%; width:140%; height:23%; border-radius:50% 50% 0 0/100% 100% 0 0; background:var(--paper); }
@media (max-width:800px) { nav>span{display:none}.login-card{width:100%;padding:62px 0 340px}.intro{max-width:88%}.cruiser-stage{right:-145px;bottom:-35px;width:440px} }
@media (max-width:560px) { .email-entry{grid-template-columns:1fr}.email-button{width:100%} }