:root{--ink:#070a10;--line:#27303e;--muted:#8995a7;--yellow:#ffd400;--green:#4be296}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#090d13;color:#f7f9fc;font-family:Inter,Arial,sans-serif}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr}.visual{position:relative;overflow:hidden;padding:42px 7vw;background:radial-gradient(circle at 73% 24%,#ffd40022,transparent 25%),radial-gradient(circle at 15% 80%,#2b70ff18,transparent 28%),linear-gradient(145deg,#0a0e15,#111722 60%,#0c1017)}.visual:after{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent)}.brand{position:relative;z-index:1;color:#fff;text-decoration:none;display:flex;align-items:center;gap:12px;font-size:20px;letter-spacing:.5px}.brand span{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;background:var(--yellow);color:#111;box-shadow:0 12px 35px #ffd4002b}.hero{position:relative;z-index:1;max-width:650px;margin-top:17vh}.badge{display:inline-block;color:var(--yellow);font-size:11px;font-weight:800;letter-spacing:1.6px;padding:9px 12px;border:1px solid #ffd40038;background:#ffd4000b;border-radius:30px}.hero h1{font-size:clamp(38px,4.6vw,68px);line-height:1.04;letter-spacing:-2.6px;margin:24px 0}.hero>p{max-width:590px;color:#a8b2c1;font-size:16px;line-height:1.75}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:42px}.features article{display:flex;gap:11px;padding:16px;background:#ffffff07;border:1px solid #ffffff0d;border-radius:12px;backdrop-filter:blur(8px)}.features i{font-style:normal;color:var(--yellow);font-size:18px}.features b,.features small{display:block}.features b{font-size:12px}.features small{margin-top:5px;color:#758194;font-size:10px;line-height:1.4}.copyright{position:absolute;z-index:1;bottom:28px;color:#596475}.form-side{display:grid;place-items:center;padding:40px;background:linear-gradient(160deg,#111720,#0d1118)}form{width:min(430px,100%)}.mobile-logo{display:none}.lock{display:grid;place-items:center;width:56px;height:56px;border-radius:15px;background:linear-gradient(135deg,var(--yellow),#ff9f00);color:#111;font-size:26px;box-shadow:0 15px 40px #ffd40024}form h2{font-size:32px;letter-spacing:-1px;margin:25px 0 8px}form>p{color:var(--muted);margin:0 0 28px}.alert{margin-bottom:18px;padding:13px 15px;border:1px solid #773844;border-radius:9px;background:#3c1920;color:#ff9ba8}form>label{display:block;color:#cbd2dc;font-size:12px;font-weight:bold;margin:17px 0}.field{height:50px;display:flex;align-items:center;margin-top:8px;border:1px solid var(--line);border-radius:10px;background:#0b1017;transition:.2s}.field:focus-within{border-color:var(--yellow);box-shadow:0 0 0 3px #ffd40014}.field i{font-style:normal;color:#697587;padding-left:15px;font-size:10px}.field input{min-width:0;flex:1;height:100%;border:0;outline:0;background:none;color:#fff;padding:0 13px}.field button{height:100%;width:48px;border:0;background:none;color:#8b96a7;cursor:pointer}.meta{display:flex;justify-content:space-between;align-items:center;color:#778396;font-size:11px;margin:6px 0 20px}.remember{display:flex;align-items:center;gap:7px}.remember input{accent-color:var(--yellow)}.submit{width:100%;height:51px;border:0;border-radius:10px;background:linear-gradient(90deg,#ffd400,#ffb800);color:#15120a;font-weight:900;cursor:pointer;box-shadow:0 13px 30px #ffd4001e}.submit:hover{transform:translateY(-1px);filter:brightness(1.05)}.submit b{float:right;margin-right:10px}.secure{text-align:center;margin-top:20px;color:#6f7b8c;font-size:10px}.back{display:block;text-align:center;margin-top:30px;color:#a6b0be;text-decoration:none;font-size:12px}.back:hover{color:var(--yellow)}@media(max-width:900px){.login-shell{grid-template-columns:1fr}.visual{display:none}.form-side{min-height:100vh;padding:26px}.mobile-logo{display:block;margin-bottom:35px;color:var(--yellow);font-size:17px}}@media(max-width:480px){form h2{font-size:27px}.meta{align-items:flex-start;gap:10px;flex-direction:column}.form-side{padding:22px}}
