:root{--navy:#0b1f3a;--navy2:#102c52;--blue:#2563eb;--blue2:#0ea5e9;--cyan:#22d3ee;--bg:#f4f7fb;--panel:#fff;--text:#12213a;--muted:#69758a;--line:#e4eaf2;--success:#0f9f67;--danger:#d14343;--shadow:0 14px 40px rgba(17,39,73,.07);--radius:18px}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}button,input{font:inherit}
.login-body{min-height:100vh;background:#edf3fb;display:grid;place-items:center;padding:22px}.login-shell{width:min(1080px,100%);min-height:650px;background:#fff;border-radius:24px;overflow:hidden;display:grid;grid-template-columns:1.15fr .85fr;box-shadow:0 28px 80px rgba(18,43,79,.16);border:1px solid #dfe7f2}.login-visual{position:relative;min-height:650px;overflow:hidden}.login-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.login-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,24,49,.12),rgba(6,24,49,.88))}.login-visual-content{position:absolute;inset:auto 44px 42px;color:#fff}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.14em}.login-visual-content h1{font-size:30px;line-height:1.25;margin:10px 0}.login-visual-content p{max-width:500px;line-height:1.65;color:#d9e6f7}.visual-badge{display:inline-flex;margin-top:13px;border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border-radius:999px;padding:8px 11px;font-size:10px}.login-panel{display:grid;place-items:center;padding:36px}.login-card{width:min(360px,100%)}.login-logo-row{display:flex;align-items:center;gap:12px;margin-bottom:40px}.login-logo-row img{width:52px;height:52px;object-fit:contain;border-radius:13px;border:1px solid var(--line);padding:4px;background:#fff}.login-logo-row strong{display:block;font-size:14px}.login-logo-row span{display:block;font-size:9px;color:var(--muted);margin-top:4px}.login-heading h2{font-size:25px;margin:0 0 7px}.login-heading p{font-size:12px;line-height:1.6;color:var(--muted);margin:0 0 22px}.form-stack{display:flex;flex-direction:column;gap:14px}.form-stack label{font-size:11px;font-weight:750;color:#46556c;display:flex;flex-direction:column;gap:7px}.form-stack input{width:100%;border:1px solid #dbe3ee;border-radius:11px;background:#fff;color:var(--text);padding:10px 11px;outline:none;transition:.15s;font-size:12px}.form-stack input:focus{border-color:#8ab2ff;box-shadow:0 0 0 3px rgba(37,99,235,.09)}.password-wrap{position:relative}.password-wrap input{padding-right:72px}.password-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);border:0;background:#eef4ff;color:#225fc7;border-radius:8px;padding:6px 8px;font-size:9px;font-weight:800;cursor:pointer}.btn{border:0;border-radius:11px;padding:10px 14px;font-weight:750;font-size:12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:7px}.btn.primary{background:linear-gradient(135deg,var(--blue),#1b7dea);color:#fff;box-shadow:0 8px 18px rgba(37,99,235,.18)}.btn.large{min-height:46px;width:100%}.login-meta{display:flex;justify-content:space-between;color:#9aa6b7;font-size:9px;margin-top:22px}.alert{border-radius:11px;padding:10px 12px;font-size:10.5px;line-height:1.5;margin-bottom:14px}.alert.danger{background:#fff1f1;border:1px solid #ffd2d2;color:#a53131}.alert.success{background:#effbf5;border:1px solid #cdeedc;color:#147447}
@media(max-width:820px){.login-shell{grid-template-columns:1fr;min-height:auto}.login-visual{min-height:240px}.login-visual-content{inset:auto 24px 22px}.login-visual-content h1{font-size:23px}.login-panel{padding:30px 22px}.login-logo-row{margin-bottom:26px}}
@media(max-width:560px){.login-body{padding:0}.login-shell{border-radius:0;border:0;min-height:100vh}.login-visual{min-height:210px}.login-panel{align-items:start}}

/* E-Kreasi Commercial Core dynamic themes · MASTER UMKM POS 1:1 palette */
.login-body[data-theme="green-gold"],.login-body[data-theme="hijau-emas"]{--brand-primary:#1f6b45;--brand-dark:#123b2a;--brand-accent:#c89b3c;--brand-soft:#f5f7f2;--brand-hero:#123b2a}
.login-body[data-theme="blue-royal"],.login-body[data-theme="biru-royal"]{--brand-primary:#155eef;--brand-dark:#0b1f44;--brand-accent:#06b6d4;--brand-soft:#f5f8fd;--brand-hero:#0b1f44}
.login-body[data-theme="amethyst"]{--brand-primary:#6d3cc7;--brand-dark:#32135d;--brand-accent:#b77cf4;--brand-soft:#faf7ff;--brand-hero:#32135d}
.login-body[data-theme="maroon-gold"],.login-body[data-theme="maroon-emas"]{--brand-primary:#862c3d;--brand-dark:#4d1721;--brand-accent:#d6a64b;--brand-soft:#fbf7f4;--brand-hero:#4d1721}
.login-body[data-theme="teal-cyan"]{--brand-primary:#087d82;--brand-dark:#083d42;--brand-accent:#20c4d8;--brand-soft:#f3fbfb;--brand-hero:#083d42}
.login-body[data-theme]{background:color-mix(in srgb,var(--brand-soft) 78%,#edf3fb)}
.login-body[data-theme] .login-overlay{background:linear-gradient(180deg,color-mix(in srgb,var(--brand-hero) 30%,transparent),color-mix(in srgb,var(--brand-hero) 92%,transparent))}
.login-body[data-theme] .form-stack input:focus{border-color:color-mix(in srgb,var(--brand-primary) 55%,#fff);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-primary) 10%,transparent)}
.login-body[data-theme] .password-toggle{background:var(--brand-soft);color:var(--brand-primary)}
.login-body[data-theme] .btn.primary{background:linear-gradient(135deg,var(--brand-primary),var(--brand-dark));box-shadow:0 8px 18px color-mix(in srgb,var(--brand-primary) 20%,transparent)}
.login-body[data-theme] .login-logo-row img{border-color:color-mix(in srgb,var(--brand-primary) 14%,var(--line))}