*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,Arial,sans-serif;background:#0d171a;color:#fff}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
button,input{font:inherit}
.landing{min-height:100vh;background:#0d171a}
.hero{position:relative;min-height:100svh;background:#0d171a url('assets/ui/new_UI/new_start_page/background_01.png') center/cover no-repeat;overflow:hidden;isolation:isolate}
.landing-header{position:absolute;z-index:6;top:32px;left:50%;transform:translateX(-50%);width:min(1648px,86vw);height:54px;display:grid;grid-template-columns:360px 1fr 150px;align-items:center;gap:28px}
.brand-slot{height:54px}
.topbar{display:flex;align-items:center;justify-content:center;gap:clamp(24px,2.65vw,54px);font-size:clamp(15px,1.05vw,20px)}
.topbar a,.nav-login{color:#f4f7f8;text-decoration:none;background:none;border:0;cursor:pointer;white-space:nowrap;transition:color .18s,background .18s,transform .18s}
.topbar a:hover,.nav-login:hover{color:#65d9fa;transform:translateY(-1px)}
.nav-pill,.nav-login{min-width:146px;padding:13px 28px!important;border:1px solid rgba(255,255,255,.24)!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(4,10,12,.64),rgba(16,62,84,.74))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);text-align:center}
.nav-login{justify-self:end;font-size:clamp(15px,1.05vw,20px)}
.hero-copy{position:relative;z-index:3;padding-top:clamp(245px,25.5vh,276px);margin-left:max(7vw,72px);width:min(920px,52vw)}
.eyebrow{font-size:clamp(12px,.9vw,16px);letter-spacing:.43em;color:#dbe4e7;margin-bottom:30px;white-space:nowrap}
.hero h1{font-size:clamp(56px,4.55vw,88px);line-height:.94;margin:0 0 42px;font-weight:900;letter-spacing:-.045em;text-wrap:balance}
.hero h1 span{background:linear-gradient(#77d6ff,#00a3d4);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-copy>p{max-width:650px;font-size:clamp(18px,1.35vw,26px);line-height:1.2;color:#f0f2f3;margin:0 0 44px}
.hero-actions{width:min(385px,92%);display:grid;gap:12px}
.hero-actions button{height:100px;border-radius:999px;font-size:clamp(20px,1.5vw,26px);color:#fff;cursor:pointer;transition:transform .18s,filter .18s}
.hero-actions button:hover{transform:translateY(-3px);filter:brightness(1.08)}
.primary{border:0;background:linear-gradient(180deg,#13c4ec,#0092c7);font-weight:900;box-shadow:0 12px 30px rgba(0,174,225,.18)}
.secondary{height:85px!important;border:1.5px solid #00a3d4;background:rgba(9,19,22,.28);font-weight:400;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hero-actions small{color:rgba(255,255,255,.35);font-size:12px;line-height:1.15;margin:0 3px}
.hero-photos{position:absolute;z-index:2;right:2.8vw;top:21.5vh;width:min(47vw,895px);aspect-ratio:1;background:url('assets/ui/new_UI/new_start_page/two_photo.webp') center/contain no-repeat;pointer-events:none;user-select:none}
.scribble{position:absolute;z-index:3;object-fit:contain;pointer-events:none;user-select:none;filter:brightness(1.12)}
.place{right:25vw;top:15.5vh;width:clamp(160px,11vw,222px)}
.explore{left:40.5vw;bottom:14.5vh;width:clamp(185px,12.5vw,242px)}
.below{padding:88px 8vw;background:#0d171a;text-align:center}.below h2{font-size:clamp(28px,2.3vw,40px);margin:0 0 12px}.below p{color:#b9c9d5;font-size:18px}
footer{display:flex;gap:28px;justify-content:center;padding:28px 20px 44px;background:#0d171a}footer a{color:#8adfff}
.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:14px}.modal-backdrop{position:absolute;inset:0;background:rgba(0,8,14,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.auth-card{position:relative;z-index:1;width:min(470px,calc(100vw - 28px));max-height:calc(100svh - 28px);overflow:auto;padding:34px;border:1px solid rgba(49,198,237,.45);border-radius:30px;background:linear-gradient(160deg,#0a2935,#041218);box-shadow:0 30px 100px #0009}
.auth-card h2{margin:0 35px 8px;text-align:center;font-size:24px}.auth-sub{text-align:center;color:#a9bec9;margin:0 0 22px}.close{position:absolute;right:16px;top:12px;background:none;border:0;color:#fff;font-size:32px;cursor:pointer}
.auth-card label:not(.checks label):not(.existing-account){display:grid;gap:7px;color:#bdd0d9;font-size:12px;margin:10px 0}.auth-card input[type=email],.auth-card input[type=text],.auth-card input:not([type]){height:52px;border:1px solid #285566;border-radius:14px;background:#061920;color:#fff;padding:0 15px;font-size:16px;outline:none}.existing-account{display:flex;align-items:center;gap:9px;color:#d3e2e9;font-size:13px;margin:13px 2px 12px;cursor:pointer}.existing-account input{width:17px;height:17px;accent-color:#15bde6}
.auth-action{width:100%;height:52px;border:0;border-radius:14px;background:#16bde7;color:#fff;font-weight:900;font-size:15px;cursor:pointer;margin-top:8px}.auth-action:disabled{opacity:.55;cursor:wait}.otp-area{margin-top:12px}.otp-area label[hidden]{display:none!important}.checks{display:grid;gap:10px;margin:18px 0;font-size:12px;color:#b8c8d0}.checks[hidden]{display:none}.checks label{display:flex;align-items:flex-start;gap:8px}.checks a{color:#59cdf0}.auth-error{min-height:18px;margin:10px 0 0;color:#ff8585;text-align:center;font-size:12px}.auth-status{min-height:18px;margin:10px 0 0;color:#8fe6ff;text-align:center;font-size:12px}
.landing-boot{position:fixed;z-index:200;inset:0;display:grid;place-items:center;background:#0d171a;transition:opacity .22s}.landing-boot.is-done{opacity:0;pointer-events:none}.landing-spinner{width:42px;height:42px;border:4px solid #ffffff22;border-top-color:#19c5ed;border-radius:50%;animation:landingSpin .7s linear infinite}@keyframes landingSpin{to{transform:rotate(360deg)}}
@media(max-width:1450px){.landing-header{grid-template-columns:220px 1fr 135px;width:90vw}.topbar{gap:24px}.hero-copy{margin-left:6vw}.hero-photos{right:0;width:51vw}.place{right:22vw}.explore{left:42vw}}
@media(max-width:1050px){.landing-header{grid-template-columns:1fr auto}.brand-slot{display:none}.topbar{justify-content:flex-start}.topbar a:not(.nav-pill){display:none}.hero-copy{width:62vw}.hero-photos{right:-12vw;width:64vw;opacity:.82}.place,.explore{display:none}.hero h1{font-size:clamp(52px,7vw,74px)}}
@media(max-width:700px){.landing-header{top:18px;width:calc(100vw - 36px)}.nav-pill{display:none}.topbar{min-width:0}.nav-login{grid-column:2}.hero{min-height:790px}.hero-copy{padding-top:150px;margin-left:24px;width:calc(100vw - 48px)}.eyebrow{font-size:10px;letter-spacing:.28em;white-space:normal}.hero h1{font-size:46px;line-height:.98;margin-bottom:28px}.hero-copy>p{font-size:17px;max-width:500px}.hero-photos{right:-20vw;top:50vh;width:100vw;opacity:.30}.hero-actions{width:min(385px,100%)}.hero-actions button{height:70px}.secondary{height:64px!important}.below{padding:60px 24px}.auth-card{padding:28px 22px}}
