:root{--bg:#0e0e12;--card:#16161c;--line:#2a2a33;--text:#f4f4f6;--muted:#a2a2ae;--yellow:#ffd60a;--danger:#ff6b6b;--ok:#4ade80}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Cairo,system-ui,sans-serif;line-height:1.6}a{color:var(--yellow);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}.page{place-items:center;min-height:100dvh;padding:24px 16px;display:grid}.wrap{width:100%;max-width:440px}.brand{align-items:center;gap:14px;margin-bottom:24px;display:flex}.mark{border:1px solid var(--line);width:52px;height:52px;color:var(--yellow);background:#000;border-radius:14px;place-items:center;padding-bottom:3px;font-family:Unbounded,sans-serif;font-size:30px;line-height:1;display:grid}.wordmark{letter-spacing:1px;direction:ltr;font-family:Unbounded,sans-serif;font-size:26px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:28px 28px 28px 44px;position:relative;overflow:hidden}.card:before{content:"";background:repeating-linear-gradient(to bottom, transparent 0 10px, var(--bg) 10px 22px, transparent 22px 32px) center / 8px 100% no-repeat, var(--yellow);width:16px;position:absolute;inset-block:0;inset-inline-end:0}.card{padding-inline:28px 44px}h1{margin:0 0 6px;font-size:26px;line-height:1.3}.sub{color:var(--muted);margin:0 0 22px;font-size:15px}.field{margin-bottom:14px}label{margin-bottom:6px;font-size:14px;font-weight:600;display:block}.input-wrap{position:relative}input[type=email],input[type=text],input[type=password]{width:100%;color:var(--text);border:1px solid var(--line);font:inherit;background:#0e0e12;border-radius:10px;padding:12px 14px;font-size:16px}input:focus{border-color:var(--yellow);outline:none}input[dir=ltr]{text-align:left}.toggle{color:var(--muted);cursor:pointer;font:inherit;background:0 0;border:0;padding:0 10px;font-size:13px;position:absolute;inset-block:0;inset-inline-start:6px}.hint{min-height:20px;color:var(--muted);margin-top:5px;font-size:13px}.hint.err{color:var(--danger)}.hint.ok{color:var(--ok)}.strength{gap:4px;margin-top:8px;display:flex}.strength i{background:var(--line);border-radius:2px;flex:1;height:4px}.strength i.on{background:var(--yellow)}.check{color:var(--muted);align-items:flex-start;gap:10px;margin:6px 0 18px;font-size:14px;font-weight:400;display:flex}.check input{accent-color:var(--yellow);width:16px;height:16px;margin-top:5px}.btn{width:100%;font:inherit;cursor:pointer;border:0;border-radius:10px;justify-content:center;align-items:center;gap:10px;padding:13px 16px;font-size:16px;font-weight:700;display:flex}.btn-primary{background:var(--yellow);color:#000}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-ghost{color:var(--text);border:1px solid var(--line);background:0 0}.btn-ghost:hover{border-color:var(--yellow)}.divider{color:var(--muted);align-items:center;gap:12px;margin:18px 0;font-size:14px;display:flex}.divider:before,.divider:after{content:"";background:var(--line);flex:1;height:1px}.alert{border-radius:10px;margin-bottom:14px;padding:12px 14px;font-size:14px}.alert.err{color:var(--danger);background:#ff6b6b1a;border:1px solid #ff6b6b66}.alert.ok{color:var(--ok);background:#4ade801a;border:1px solid #4ade8066}.foot{text-align:center;color:var(--muted);margin-top:18px;font-size:15px}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.center-note{text-align:center}.auth{grid-template-columns:1fr 1fr;min-height:100dvh;display:grid}.auth-brand{background:radial-gradient(700px 420px at 90% -5%,#ffd60a24,#0000 65%),radial-gradient(600px 400px at 0 100%,#2979ff1a,#0000 65%),#0b0b0f;flex-direction:column;justify-content:space-between;gap:40px;padding:44px clamp(28px,5vw,76px);display:flex;position:relative;overflow:hidden}.auth-brand:after{content:"";background:linear-gradient(to bottom, transparent, var(--yellow) 20%, var(--yellow) 80%, transparent);opacity:.85;width:3px;position:absolute;inset-block:0;inset-inline-end:0}.auth-logo{align-items:center;gap:14px;display:flex}.auth-logo img{border-radius:16px;display:block}.auth-hero{max-width:520px}.auth-slogan{color:var(--yellow);letter-spacing:.3px;background:#ffd60a1f;border:1px solid #ffd60a59;border-radius:999px;margin:0 0 18px;padding:6px 14px;font-size:15px;font-weight:700;display:inline-block}.auth-title{margin:0 0 14px;font-size:clamp(28px,3.4vw,46px);font-weight:700;line-height:1.3}.auth-lead{color:var(--muted);max-width:440px;margin:0 0 30px;font-size:clamp(15px,1.2vw,18px)}.auth-features{gap:14px;margin:0;padding:0;list-style:none;display:grid}.auth-features li{align-items:center;gap:14px;font-size:16px;display:flex}.auth-features svg{background:var(--card);border:1px solid var(--line);fill:none;width:40px;height:40px;stroke:var(--yellow);stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;border-radius:12px;flex:none;padding:10px}.auth-copy{color:var(--muted);opacity:.75;margin:0;font-size:13px}.auth-form{isolation:isolate;place-items:center;padding:32px 20px;display:grid;position:relative;overflow:hidden}.auth-bg{object-fit:cover;z-index:-2;width:100%;height:100%;position:absolute;inset:0}.auth-scrim{z-index:-1;background:linear-gradient(#08080c94,#08080cd1);position:absolute;inset:0}.auth-box{width:100%;max-width:440px}.auth-form .card{-webkit-backdrop-filter:blur(18px)saturate(1.2);backdrop-filter:blur(18px)saturate(1.2);background:#121218cc;border-color:#ffffff1f;box-shadow:0 24px 60px #0000008c}.auth-form .foot{color:#dcdce4;text-shadow:0 1px 10px #000000e6}@media (width<=899px){.auth{grid-template-columns:1fr}.auth-brand{gap:18px;padding:24px 20px 28px}.auth-brand:after{background:linear-gradient(to left, transparent, var(--yellow) 25%, var(--yellow) 75%, transparent);width:auto;height:3px;inset-block:auto 0;inset-inline:0}.auth-logo img{border-radius:12px;width:48px;height:48px}.auth-slogan{margin-bottom:10px;padding:4px 12px;font-size:13px}.auth-title{margin:0;font-size:22px}.auth-lead,.auth-features,.auth-copy{display:none}.auth-form{padding:24px 16px calc(32px + env(safe-area-inset-bottom,0px))}}@media (backdrop-filter:none){.auth-form .card{background:#121218f0}}
