:root{--blue-950:#06183d;--blue-900:#08245c;--blue-800:#0a3b91;--blue-700:#1558e8;--blue-500:#2f7eff;--red:#e30613;--ink:#12213b;--muted:#6d7b91;--line:#dce5f2;--success:#15965f}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body.izzant-login-page{min-height:100vh;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:radial-gradient(circle at 10% 10%,rgba(47,126,255,.22),transparent 28%),radial-gradient(circle at 92% 90%,rgba(21,88,232,.15),transparent 24%),linear-gradient(135deg,#eaf2ff,#f8fbff 50%,#edf4ff);overflow-x:hidden}
.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(560px,1.1fr) minmax(430px,.9fr)}
.brand-panel{position:relative;overflow:hidden;padding:44px 58px;color:#fff;background:radial-gradient(circle at 16% 12%,rgba(255,255,255,.12),transparent 25%),linear-gradient(145deg,var(--blue-950),var(--blue-700))}
.brand-panel:before{content:"";position:absolute;width:680px;height:680px;border-radius:50%;right:-350px;bottom:-360px;border:1px solid rgba(255,255,255,.14);box-shadow:0 0 0 65px rgba(255,255,255,.035),0 0 0 125px rgba(255,255,255,.025)}
.brand-panel:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 66%,rgba(255,255,255,.06) 66% 67%,transparent 67%),linear-gradient(165deg,transparent 0 76%,rgba(255,255,255,.05) 76% 77%,transparent 77%);pointer-events:none}
.official-company-logo{position:relative;z-index:2;width:250px;height:auto;display:block;filter:drop-shadow(0 10px 22px rgba(0,0,0,.18))}
.brand-content{position:relative;z-index:2;margin-top:68px;max-width:680px}
.product-badge{display:inline-flex;align-items:center;gap:9px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.product-badge span{width:8px;height:8px;border-radius:50%;background:#5ce3b4;box-shadow:0 0 0 5px rgba(92,227,180,.13)}
.brand-content h1{margin:25px 0 0;font-size:64px;font-weight:900;line-height:.96;letter-spacing:-.055em}.brand-content h1 strong{color:#ff2531}
.enterprise-title{margin-top:16px;font-size:20px;letter-spacing:.30em;text-transform:uppercase;color:#dbe8ff;font-weight:500}
.brand-rule{width:430px;max-width:80%;height:2px;margin:29px 0;background:linear-gradient(90deg,var(--red),rgba(227,6,19,0));position:relative}.brand-rule:after{content:"";position:absolute;left:48%;top:50%;width:7px;height:7px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);box-shadow:0 0 0 5px rgba(227,6,19,.44),0 0 18px #fff}
.brand-content>p{max-width:560px;margin:0;font-size:22px;line-height:1.48;color:rgba(255,255,255,.84)}
.module-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:29px}.module-tags span{padding:9px 12px;border-radius:11px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.13);font-size:12px;font-weight:700}
.brand-footer{position:absolute;z-index:2;left:58px;right:58px;bottom:31px;display:flex;justify-content:space-between;color:rgba(255,255,255,.62);font-size:12px}
.access-panel{display:flex;align-items:center;justify-content:center;padding:40px}
.login-card{width:100%;max-width:490px;padding:37px 40px 31px;border-radius:26px;background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.9);box-shadow:0 30px 72px rgba(30,68,135,.18)}
.login-card-header{display:flex;align-items:center;gap:18px;padding-bottom:23px;margin-bottom:25px;border-bottom:1px solid var(--line)}.login-card-header img{width:82px;height:68px;object-fit:contain}.login-card-header h2{margin:0;font-size:28px;letter-spacing:-.035em}.login-card-header p{margin:6px 0 0;color:var(--muted);font-size:14px}
.login-alert{display:flex;align-items:flex-start;gap:10px;margin:0 0 18px;padding:12px 14px;border:1px solid #f0c7cc;border-radius:12px;background:#fff5f6;color:#9f1f2d;font-size:13px;font-weight:700}.login-alert svg{flex:0 0 19px;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.login-form>label{display:block;margin:0 0 8px;font-size:13px;font-weight:800;color:#33415a}.input-wrap{position:relative;margin-bottom:17px}.input-wrap>svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:19px;height:19px;fill:none;stroke:#7f8ca3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.input-wrap input{width:100%;height:52px;border:1px solid var(--line);border-radius:13px;background:#fbfdff;color:var(--ink);font:500 15px Inter,"Segoe UI",Arial,sans-serif;padding:0 46px;outline:none;transition:.18s ease}.input-wrap input:focus{border-color:#8db9ff;background:#fff;box-shadow:0 0 0 4px rgba(47,126,255,.11)}
.password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:8px;background:transparent;color:#7f8ca3;cursor:pointer}.password-toggle:hover{background:#edf4ff;color:var(--blue-700)}.password-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.login-options{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:3px 0 23px;font-size:13px}.remember-option{display:flex;align-items:center;gap:8px;color:#5d6b82;cursor:pointer}.remember-option input{accent-color:var(--red)}.secure-label{display:flex;align-items:center;gap:5px;color:var(--blue-700);font-weight:800}.secure-label svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.submit-button{width:100%;height:54px;border:0;border-radius:14px;color:#fff;font-size:15px;font-weight:900;letter-spacing:.02em;cursor:pointer;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(135deg,var(--blue-500),var(--blue-700));box-shadow:0 14px 28px rgba(21,88,232,.27);transition:.18s ease}.submit-button:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--red)}.submit-button:hover{transform:translateY(-1px);box-shadow:0 18px 32px rgba(21,88,232,.32)}.submit-button:focus-visible{outline:3px solid rgba(21,88,232,.25);outline-offset:3px}.submit-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.system-information{margin-top:23px;padding-top:19px;border-top:1px solid var(--line)}.system-information h3{text-align:center;color:#758197;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin:0 0 10px}.system-information>div{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:9px 0;border-bottom:1px solid #edf1f6;font-size:12px;color:#5e6b80}.system-information strong{color:#263650;text-align:right}.system-information .operational{display:flex;align-items:center;gap:6px;color:var(--success)}.operational i{display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(21,150,95,.12)}
@media(max-width:1100px){.brand-panel{padding:38px}.brand-footer{left:38px;right:38px}.brand-content h1{font-size:54px}.access-panel{padding:28px}}
@media(max-width:960px){.login-shell{grid-template-columns:1fr}.brand-panel{display:none}.access-panel{min-height:100vh;padding:22px}}
@media(max-width:520px){.login-card{padding:28px 22px;border-radius:20px}.login-card-header h2{font-size:23px}.login-options{align-items:flex-start;flex-direction:column}.system-information>div{align-items:flex-start}.system-information strong{max-width:62%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}