*{box-sizing:border-box}body{margin:0;font:16px Arial,sans-serif;background:#eef2f8;color:#173650}header{height:82px;background:linear-gradient(#2c4771,#152b49);border-bottom:3px solid #f1cc00;color:white;display:flex;align-items:center;gap:18px;padding:14px 22px;position:sticky;top:0;z-index:3}header strong{font-size:28px}header small{font-size:12px;font-weight:400}#clock{margin-left:auto;font-size:13px;color:#ffe14b}button,input{font:inherit}button{cursor:pointer}header button{background:#ffffff12;color:white;border:1px solid #8194ab;border-radius:12px;padding:12px}aside{position:fixed;top:82px;bottom:0;width:270px;background:#1d3555;padding:18px 12px;overflow:auto;z-index:2}aside button,aside a{display:block;width:100%;text-align:left;margin:0 0 12px;background:#104a73;border:1px solid #326080;color:#dce7f1;border-radius:14px;padding:18px;font-weight:bold;text-decoration:none}aside button.active{background:#365b38;border-left:5px solid #f2d500;color:white}main{margin-left:270px;padding:28px;max-width:1500px}.intro,.card{background:white;border:1px solid #ced8e4;border-radius:18px;box-shadow:0 7px 22px #18365312;margin-bottom:22px;overflow:hidden}.intro{padding:24px}h1{margin:0 0 10px;font-size:30px}.card h2{margin:0;background:linear-gradient(#2d4770,#162b46);color:white;padding:18px;font-size:20px}.body{padding:22px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}.stat{border:1px solid #c8d4e1;background:#edf3fb;border-radius:12px;padding:20px}.stat strong{display:block;font-size:26px;margin-top:15px;color:#2e6894}input,select{width:100%;padding:13px;margin:8px 0 16px;border:1px solid #b8c9db;border-radius:9px}form{max-width:450px}main button{padding:12px 20px;border:0;background:#21466e;color:white;border-radius:9px}table{width:100%;border-collapse:collapse;white-space:nowrap}th,td{text-align:left;padding:14px;border-bottom:1px solid #dce4ee}th{background:#edf3fb}.scroll{overflow:auto}#notice{color:#8a3508}#toggle{display:none}#content small{color:#607c91}@media(max-width:760px){header{padding:12px;gap:10px}header strong{font-size:24px}header small{display:none}#clock{font-size:10px}#toggle{display:block}aside{display:none;width:80%;box-shadow:0 0 0 100vw #142b4977}aside.open{display:block}main{margin-left:0;padding:18px 14px}.intro{padding:22px}header button{padding:10px}.grid{grid-template-columns:1fr 1fr}}

/* Login screen isolation */
body:not(.authenticated) #nav,
body:not(.authenticated) #toggle,
body:not(.authenticated) #logout{display:none!important}
body:not(.authenticated) main{
 margin:0 auto;max-width:560px;padding:28px 16px
}

/* Dashboard reference layout */
body:not(.authenticated) #nav,
body:not(.authenticated) #toggle,
body:not(.authenticated) #logout{display:none!important}
body:not(.authenticated) main{margin:0 auto;max-width:560px}
.dashboard-tabs{display:flex;padding:7px;background:#edf3fb;border-radius:17px;margin-top:24px;gap:8px}
.dashboard-tabs button{flex:1;padding:17px 8px;background:transparent;color:#405b70;font-weight:bold;font-size:18px}
.dashboard-tabs button.selected{background:linear-gradient(#2c4771,#152b49);color:white;box-shadow:0 6px 14px #17365233;border-radius:14px}
.dashboard-metric{padding:22px;background:#edf3fb;border:1px solid #c8d4e1;border-radius:11px;margin-bottom:16px}
.dashboard-metric span{display:block;font-weight:bold;color:#405b70}
.dashboard-metric strong{display:block;margin-top:20px;font-size:20px;color:#2d6895}
.account-summary{border:1px solid #c8d4e1;border-radius:13px;overflow:hidden}
.summary-heading{background:linear-gradient(#2c4771,#152b49);padding:17px;color:white}
.summary-heading small,.summary-heading strong{display:block;margin-bottom:5px}
.summary-grid{display:grid;grid-template-columns:1fr 1fr}
.summary-grid>div{padding:18px;border-bottom:1px solid #dce4ee}
.summary-grid small{display:block;color:#6b7f90;font-weight:bold;margin-bottom:10px}
.summary-grid strong{display:block;color:#2d6895}
