:root { --navy:#14323a; --teal:#087f78; --mint:#dff3ef; --cream:#f6f5ef; --ink:#193138; --muted:#65767a; --line:#d8e3e1; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; font-family:Manrope,sans-serif; color:var(--ink); background:var(--cream); }
.auth-shell { min-height:100vh; display:grid; grid-template-columns:minmax(320px,1.05fr) minmax(380px,.95fr); }
.auth-brand { position:relative; overflow:hidden; padding:clamp(48px,8vw,110px); display:flex; flex-direction:column; justify-content:center; color:white; background:linear-gradient(145deg,#102f38,#087f78); }
.auth-brand>* { position:relative; z-index:1; }
.auth-brand::after { content:""; position:absolute; width:420px; height:420px; right:-150px; bottom:-170px; border:70px solid rgba(255,255,255,.08); border-radius:50%; }
.brand-mark { display:grid; place-items:center; width:58px; height:58px; margin-bottom:34px; border:1px solid rgba(255,255,255,.35); border-radius:18px; background:rgba(255,255,255,.12); font-size:1.8rem; font-weight:800; }
.brand-mark svg { width:38px; height:38px; fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.auth-brand h1 { max-width:640px; margin:8px 0 18px; font-size:clamp(2.2rem,4vw,4.6rem); line-height:1.02; letter-spacing:-.05em; }
.auth-brand>p:last-child { max-width:560px; color:#d8edeb; font-size:1.05rem; line-height:1.7; }
.eyebrow { margin:0; text-transform:uppercase; letter-spacing:.18em; font-size:.76rem; font-weight:800; }
.auth-panel { display:grid; place-items:center; padding:32px; background:radial-gradient(circle at 100% 0,#dff3ef,transparent 45%),var(--cream); }
.auth-card { width:min(440px,100%); padding:42px; background:rgba(255,255,255,.94); border:1px solid var(--line); border-radius:26px; box-shadow:0 28px 70px rgba(20,50,58,.12); }
.auth-card .eyebrow { color:var(--teal); }
.auth-card h2 { margin:8px 0; font-size:2rem; letter-spacing:-.03em; }
.muted { margin:0 0 28px; color:var(--muted); }
form { display:grid; gap:17px; }
label { display:grid; gap:7px; font-size:.86rem; font-weight:800; }
input { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:12px; background:#fbfcfb; font:inherit; outline:none; }
input:focus { border-color:var(--teal); box-shadow:0 0 0 4px rgba(8,127,120,.12); }
button { margin-top:6px; padding:14px 18px; border:0; border-radius:12px; color:white; background:var(--teal); font:inherit; font-weight:800; cursor:pointer; }
button:disabled { opacity:.6; cursor:wait; }
small { color:var(--muted); }
.message { min-height:22px; margin:18px 0 0; font-size:.9rem; font-weight:700; }
.message.error { color:#a53636; } .message.success { color:#087f50; } .message.info { color:var(--muted); }
.auth-link { margin:22px 0 0; color:var(--muted); font-size:.9rem; }
a { color:var(--teal); font-weight:800; }
@media (max-width:800px) { .auth-shell{grid-template-columns:1fr}.auth-brand{min-height:300px;padding:42px 28px}.auth-brand h1{font-size:2.35rem}.auth-panel{padding:24px}.auth-card{padding:30px 24px} }