:root { --green:#176b5b; --deep:#132321; --ink:#1f2933; --muted:#667085; --line:#dce3ea; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; display:grid; place-items:center; padding:24px; color:var(--ink); background:#edf2f1; font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif; }
.login-shell { width:min(980px,100%); min-height:590px; display:grid; grid-template-columns:44% 56%; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#fff; box-shadow:0 28px 80px rgba(31,41,51,.15); }
.brand-panel { padding:48px; display:flex; flex-direction:column; justify-content:space-between; color:#fff; background:var(--deep); }
.brand-panel img { width:150px; height:92px; padding:8px; object-fit:contain; border-radius:8px; background:#fff; }
.brand-panel strong,.brand-panel span { display:block; }.brand-panel strong { font-size:2rem; }.brand-panel span { max-width:270px; margin-top:8px; color:#b8cac5; line-height:1.5; }
.login-panel { display:grid; place-items:center; padding:48px; }.login-panel form { width:min(390px,100%); }
header span { color:var(--green); font-size:.78rem; font-weight:800; text-transform:uppercase; } h1 { margin:8px 0; font-size:2rem; letter-spacing:0; } header p,footer { color:var(--muted); line-height:1.5; }
label { display:grid; gap:7px; margin-top:20px; font-weight:700; font-size:.9rem; } input { width:100%; min-height:48px; border:1px solid var(--line); border-radius:8px; padding:0 13px; font:inherit; } input:focus { outline:3px solid rgba(23,107,91,.15); border-color:var(--green); }
button { width:100%; min-height:48px; margin-top:24px; border:0; border-radius:8px; background:var(--green); color:#fff; font:inherit; font-weight:800; cursor:pointer; } footer { margin-top:20px; font-size:.8rem; text-align:center; }.error { margin-top:18px; padding:12px; border:1px solid #efcaca; border-radius:8px; color:#9d3232; background:#fff3f3; }
@media(max-width:720px){ body{padding:0;background:#fff}.login-shell{min-height:100vh;display:block;border:0}.brand-panel{padding:22px;flex-direction:row;align-items:center}.brand-panel img{width:82px;height:52px}.brand-panel div{margin-left:14px}.brand-panel strong{font-size:1.3rem}.brand-panel span{font-size:.8rem;margin-top:2px}.login-panel{padding:42px 24px}h1{font-size:1.7rem} }