/* 2026-10: shared visual refresh, layered over the existing component styles. */
:root {
    --primary:#245bcc; --primary-dark:#19439b; --text:#24334b;
    --text-light:#596a82; --border:#dce4ef; --secondary:#edf3fc;
    --radius:12px; --shadow:0 4px 18px rgba(31,55,92,.045);
}
body { background:#f3f6fb; -webkit-font-smoothing:antialiased; }
.container { max-width:1440px; padding-inline:clamp(16px,3vw,40px); }
.main-content { padding-block:30px 48px; min-width:0; }
.main-content > h1 { font-size:clamp(1.5rem,2.5vw,2rem); letter-spacing:-.035em; line-height:1.25; margin-bottom:10px; }
.main-content h1 { overflow-wrap:anywhere; font-size:clamp(1.35rem,2.5vw,2rem); line-height:1.25; letter-spacing:-.035em; }
.main-content > p { margin-bottom:24px; }
.text-light { color:var(--text-light); }
.main-header { box-shadow:0 3px 16px rgba(31,55,92,.04); }
.header-inner { height:auto; min-height:72px; flex-wrap:wrap; gap:10px; padding-block:14px 10px; }
.logo { color:#18396f; letter-spacing:-.035em; font-size:1.3rem; }
.logo::before { content:''; display:inline-block; width:21px; height:22px; margin-right:10px; border-left:5px solid #245bcc; border-right:5px solid #7da6f5; box-shadow:inset 5px 0 #fff,inset 11px 0 #467fe4; border-radius:3px; vertical-align:-3px; }
.main-nav { width:100%; }
.main-nav > ul { flex-wrap:wrap; gap:4px; }
.main-nav li.dropdown { position:relative; }
.main-nav li.dropdown > button { display:block; border:0; background:transparent; color:var(--text); font:inherit; font-size:.875rem; font-weight:600; padding:10px 12px; border-radius:8px; cursor:pointer; text-align:left; }
.main-nav li.dropdown > button:hover,.main-nav li.dropdown > button.active-section,.main-nav li.dropdown > button[aria-expanded=true] { background:#eaf1ff; color:var(--primary-dark); }
.main-nav li.dropdown > ul { position:absolute; top:100%; left:0; min-width:236px; padding:7px; margin-top:4px; border:1px solid var(--border); border-radius:12px; background:white; box-shadow:0 14px 36px rgba(24,49,82,.15); z-index:200; }
.main-nav li.dropdown > ul > li { display:block; }
.main-nav li.dropdown > ul a { padding:9px 12px; white-space:nowrap; }
.main-nav li.dropdown li.dropdown > button { width:100%; }
.main-nav li.dropdown li.dropdown > ul { top:0; left:100%; margin-top:0; }
.main-nav li.dropdown > ul.opens-left { left:auto; right:0; }
.main-nav li.dropdown li.dropdown > ul.opens-left { left:auto; right:100%; }
.user-menu { margin-left:auto; gap:6px; }
.user-name { max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.btn-logout { font-size:.8rem!important; }
.card,.stat-card { box-shadow:var(--shadow); border-color:#dfe7f2; }
.card { padding:24px; }
.card-header { gap:12px; flex-wrap:wrap; }
.stat-card { padding:22px; min-width:0; }
.stat-label { font-weight:500; }
.stat-value { letter-spacing:-.035em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
a.stat-card { display:block; }
a.stat-card:hover { border-color:#adc4ef; box-shadow:0 8px 22px rgba(31,55,92,.09); transform:translateY(-2px); }
.btn { min-height:40px; gap:6px; border-radius:8px; }
.btn-sm { min-height:34px; }
.btn-secondary { border:1px solid var(--border); background:#f5f8fd; }
.btn-secondary:hover { background:#e9f0fa; }
input,select,textarea,button { font-family:inherit; }
input[type=checkbox],input[type=radio] { accent-color:var(--primary); }
.form-group input,.form-group select,.form-group textarea { border-color:#cbd7e7; }
:where(a,button,input,select,textarea,[tabindex]):focus-visible { outline:3px solid #527fe5; outline-offset:3px; }
.table-wrap { width:100%; max-width:100%; overflow-x:auto; border-radius:10px; }
table { font-variant-numeric:tabular-nums; }
th { background:#f2f6fc; color:#4e607b; font-size:.72rem; letter-spacing:.045em; }
td { vertical-align:middle; }
tbody tr:last-child td { border-bottom:0; }
.alert { border-radius:10px; line-height:1.6; }
.main-footer { padding:20px 0; background:transparent; font-size:.78rem; }
.skip-link { position:fixed; top:-100px; left:16px; padding:12px 18px; background:#fff; color:var(--primary-dark); z-index:1000; border:2px solid var(--primary); border-radius:8px; }
.skip-link:focus { top:12px; }
.login-page { background:radial-gradient(ellipse at 18% 15%,#315b97 0,transparent 50%),linear-gradient(140deg,#12294d,#204c83); padding-block:30px; }
.login-container { max-width:470px; }
.login-box { padding:36px; border-radius:20px; box-shadow:0 25px 80px #081b3a55; border:1px solid #ffffff55; }
.login-box h1 { font-size:clamp(1.15rem,4.8vw,1.5rem); letter-spacing:-.04em; overflow-wrap:anywhere; }
.login-box .subtitle { margin-block:8px 26px; line-height:1.6; }
.login-info { font-size:.85rem; line-height:1.7; }
#code { text-align:center; font-size:1.7rem; letter-spacing:.35em; font-variant-numeric:tabular-nums; }
.dashboard-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; flex-wrap:wrap; margin-bottom:26px; }
.dashboard-heading h1 { font-size:clamp(1.5rem,2.5vw,2rem); letter-spacing:-.035em; }
.dashboard-heading p { margin-top:5px; }
.dashboard-period { display:flex; align-items:center; gap:10px; font-size:.85rem; color:var(--text-light); }
.dashboard-period select { padding:9px 12px; border:1px solid var(--border); border-radius:8px; background:#fff; font-size:.9rem; }
.dashboard-note { font-size:.8rem; color:var(--text-light); margin-block:-10px 22px; }
@media(max-width:1200px) {
    .header-inner { flex-wrap:nowrap; padding-block:14px; min-height:66px; }
    .menu-toggle { display:block; border-radius:8px; padding:5px 10px; }
    .main-nav { display:none; position:absolute; inset:100% 0 auto; width:100%; max-height:calc(100dvh - 70px); overflow-y:auto; background:#fff; border-bottom:1px solid var(--border); box-shadow:0 12px 24px #20365315; }
    .main-nav.open { display:block; }
    .main-nav > ul { display:block; padding:12px 16px; }
    .main-nav > ul > li { display:block; width:100%; }
    .main-nav li.dropdown > button { width:100%; min-height:44px; }
    .main-nav li.dropdown > ul,.main-nav li.dropdown li.dropdown > ul,.main-nav li.dropdown > ul.opens-left { position:static; min-width:0; margin:0 0 6px 10px; box-shadow:none; border:0; border-left:2px solid #dce7fa; border-radius:0; padding:3px 0 3px 8px; }
    .main-nav li.dropdown > ul a { white-space:normal; min-height:42px; }
    .user-menu { margin:12px 0 0; padding:12px 0 0; border:0; border-top:1px solid var(--border); }
    .user-menu .user-name { display:block; margin:8px 12px; max-width:none; }
}
@media(max-width:768px) {
    .main-content { padding-block:22px 36px; }
    .card,.stat-card { padding:18px; }
    .grid-2,.grid-3 { grid-template-columns:minmax(0,1fr); }
    .stats-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); }
    .logo { font-size:1.05rem; }
    .logo::before { width:17px; height:19px; margin-right:7px; }
    .login-box { padding:26px 22px; }
    th,td { padding:11px 12px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; } }
@media print {
    .skip-link,.dashboard-period { display:none!important; }
    .container { max-width:none; padding:0; }
    .table-wrap { overflow:visible; }
    body { background:#fff; }
}