:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; --bg:#070912; --text:#f5f2eb; --muted:#9da3b5; --red:#ef4a5e; --line:rgba(255,255,255,.11); }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; min-height:100vh; display:grid; place-items:center; overflow-x:hidden; color:var(--text); background:radial-gradient(circle at 18% 20%,rgba(91,55,119,.22),transparent 30rem),radial-gradient(circle at 90% 90%,rgba(37,104,139,.18),transparent 30rem),var(--bg); }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.25; background-image:radial-gradient(circle,rgba(255,255,255,.7) 0 1px,transparent 1px); background-size:57px 57px; mask-image:linear-gradient(135deg,#000,transparent 70%); }
.auth-shell { position:relative; width:min(1040px,calc(100% - 36px)); min-height:620px; display:grid; grid-template-columns:1.05fr .95fr; overflow:hidden; border:1px solid var(--line); border-radius:26px; background:rgba(13,16,27,.88); box-shadow:0 40px 100px rgba(0,0,0,.52); backdrop-filter:blur(18px); }
.intro { position:relative; overflow:hidden; padding:70px 62px; background:linear-gradient(145deg,rgba(32,36,57,.87),rgba(11,14,24,.7)); }
.intro::after { content:""; position:absolute; inset:0; opacity:.35; background:repeating-linear-gradient(125deg,transparent 0 40px,rgba(255,255,255,.035) 41px 42px); }
.eyebrow { position:relative; z-index:2; display:flex; align-items:center; gap:9px; color:#b7bbca; font-size:.68rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow i { width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 0 5px rgba(239,74,94,.11),0 0 18px var(--red); }
.intro h1 { position:relative; z-index:2; margin:58px 0 20px; font-family:Georgia,serif; font-size:clamp(3.6rem,7vw,6.4rem); font-weight:400; line-height:.82; letter-spacing:-.06em; }
.intro h1 em { color:transparent; font-weight:400; -webkit-text-stroke:1px rgba(245,242,235,.65); }
.intro p { position:relative; z-index:2; max-width:390px; color:#aeb3c3; font-size:.95rem; line-height:1.75; }
.orbit { position:absolute; right:-105px; bottom:-125px; width:350px; height:350px; display:grid; place-items:center; border:1px solid rgba(239,74,94,.25); border-radius:50%; box-shadow:0 0 80px rgba(239,74,94,.08); }
.orbit::before,.orbit::after { content:""; position:absolute; border:1px solid rgba(101,215,231,.13); border-radius:50%; }
.orbit::before { inset:45px; }.orbit::after { inset:92px; }
.orbit span { z-index:2; display:grid; place-items:center; width:75px; height:75px; border:1px solid rgba(239,74,94,.6); border-radius:20px; background:#151826; font-family:Georgia,serif; font-size:2rem; font-weight:700; box-shadow:0 0 50px rgba(239,74,94,.25); }
.auth-card { padding:54px 58px; background:rgba(9,11,19,.65); }
.tabs { display:grid; grid-template-columns:1fr 1fr; padding:4px; border-radius:11px; background:rgba(255,255,255,.045); }
.tab { min-height:40px; border:0; border-radius:8px; background:transparent; color:#8f95a7; font-size:.72rem; font-weight:700; cursor:pointer; }
.tab.active { background:#252a3d;color:#fff;box-shadow:0 4px 16px rgba(0,0,0,.25); }
form { padding-top:48px; }
.kicker { margin:0 0 8px; color:var(--red); font-size:.64rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
h2 { margin:0 0 34px; font-family:Georgia,serif; font-size:2.4rem; font-weight:400; letter-spacing:-.035em; }
label { display:block; margin-bottom:19px; }
label > span { display:block; margin-bottom:8px; color:#afb3c1; font-size:.67rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
input { width:100%; height:48px; padding:0 14px; border:1px solid var(--line); border-radius:10px; outline:0; background:#111522; color:var(--text); transition:.2s ease; }
input:focus { border-color:rgba(239,74,94,.65); box-shadow:0 0 0 3px rgba(239,74,94,.08); }
.message { margin:-2px 0 17px; padding:11px 13px; border:1px solid rgba(239,74,94,.25); border-radius:9px; background:rgba(239,74,94,.07); color:#ff9daa; font-size:.72rem; line-height:1.5; }
.submit-button { width:100%; height:49px; display:flex; align-items:center; justify-content:center; gap:9px; border:1px solid rgba(255,255,255,.06); border-radius:10px; background:linear-gradient(135deg,#d6324b,#a91f38); color:#fff; font-weight:750; cursor:pointer; box-shadow:0 9px 25px rgba(184,35,59,.24); transition:.2s ease; }
.submit-button:hover { transform:translateY(-2px);filter:brightness(1.1); }.submit-button:disabled{opacity:.55;cursor:wait;transform:none;}
.hint { margin:15px 0 0; color:#73798c; font-size:.66rem; text-align:center; }
@media(max-width:760px){.auth-shell{grid-template-columns:1fr;min-height:0}.intro{padding:42px 32px}.intro h1{margin:35px 0 16px;font-size:3.7rem}.intro p{margin-bottom:80px}.auth-card{padding:38px 28px 42px}form{padding-top:35px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
