:root{--navy:#11191f;--slate:#233b4b;--steel:#4f748b;--ivory:#f5f2ec;--sand:#dccbb8;--taupe:#9b806a;--ink:#25221f;--muted:#6f7b82;--line:#d9dde0;--background:#eef1f3;--white:#fff}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--background);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}.page{min-height:100vh;padding:32px}.shell{width:min(1180px,100%);margin:0 auto}.topbar{justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;display:flex}.eyebrow{color:var(--steel);letter-spacing:.11em;text-transform:uppercase;font-size:11px;font-weight:800}h1{color:var(--navy);letter-spacing:-.04em;margin:5px 0 6px;font-size:clamp(28px,4vw,42px)}h2{color:var(--slate)}.muted{color:var(--muted)}.grid{gap:14px;display:grid}.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:18px}.metric-label{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:800}.metric-value{color:var(--navy);margin-top:7px;font-size:30px;font-weight:850}.brandbar{min-height:100vh;display:flex}.sidebar{background:var(--navy);color:#fff;width:240px;padding:28px 20px}.logo{letter-spacing:.08em;font-size:18px;font-weight:900}.logo small{color:#aebec7;margin-top:5px;font-size:9px;display:block}.content{flex:1;padding:32px}.nav{gap:6px;margin-top:32px;display:grid}.nav a{color:#cbd5da;border-radius:9px;padding:10px 12px}.nav a:hover{color:#fff;background:#1c2b34}.button{cursor:pointer;background:var(--slate);color:#fff;border:0;border-radius:10px;padding:10px 14px;font-weight:750}.button.secondary{color:var(--slate);border:1px solid var(--line);background:#fff}.login-wrap{place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{border:1px solid var(--line);background:#fff;border-radius:20px;width:min(460px,100%);padding:30px}.login-card input{border:1px solid var(--line);border-radius:10px;width:100%;margin:6px 0 12px;padding:12px}.notice{color:#6f5c4b;background:#f7f4ef;border-radius:10px;margin-top:14px;padding:11px 12px;font-size:12px;line-height:1.5}.portal-hero{color:#fff;background:linear-gradient(135deg, var(--navy), var(--slate));border-radius:20px;padding:28px}.portal-hero h1,.portal-hero .muted{color:#fff}@media (max-width:900px){.metrics{grid-template-columns:1fr 1fr}.brandbar{display:block}.sidebar{width:100%}}@media (max-width:560px){.page,.content{padding:20px}.metrics{grid-template-columns:1fr}}