.department-subnav { grid-template-columns: repeat(4,minmax(0,1fr)); width: min(720px,calc(100% - 32px)); }
.sa-page { --sa-ink:#172b48; --sa-muted:#728197; color:var(--sa-ink); padding-bottom:44px; }
.sa-page *, .sa-page *::before, .sa-page *::after { box-sizing:border-box; }
.sa-page [hidden] { display:none !important; }
.sa-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 0 26px; }
.sa-eyebrow { margin:0 0 10px; color:#2878f0; font-size:12px; font-weight:700; letter-spacing:2px; }
.sa-page h1 { margin:0; font-size:32px; line-height:1.35; letter-spacing:-1px; }
.sa-subtitle { color:var(--sa-muted); font-size:14px; margin:12px 0 0; }
.sa-badge { border:1px solid #dbe7f8; background:#f3f8ff; padding:9px 14px; border-radius:30px; color:#5378a9; font-size:12px; white-space:nowrap; }
.sa-panel { background:rgba(255,255,255,.94); border:1px solid #e6ecf5; border-radius:22px; box-shadow:0 7px 28px #21477505; }
.sa-filters { padding:24px; display:grid; grid-template-columns:1.6fr 1fr .8fr auto; gap:18px; align-items:end; }
.sa-filters label { display:grid; gap:10px; font-size:12px; font-weight:600; color:#66768b; min-width:0; }
.sa-filters input, .sa-filters select { min-width:0; width:100%; height:46px; border:1px solid #dde5f0; background:#fafcff; color:var(--sa-ink); border-radius:12px; padding:0 13px; font:inherit; font-size:14px; }
.sa-page button { cursor:pointer; font:inherit; }
.sa-page button:focus-visible, .sa-page input:focus-visible, .sa-page select:focus-visible, .sa-page summary:focus-visible { outline:3px solid #75abff; outline-offset:3px; }
.sa-primary { height:46px; padding:0 26px; color:#fff; background:#1675ef; border:0; border-radius:12px; font-weight:600 !important; box-shadow:0 5px 12px #2878f022; white-space:nowrap; }
.sa-primary span { margin-left:16px; }
.sa-page button:disabled { opacity:.45; cursor:default; }
.sa-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:22px 0; color:var(--sa-muted); font-size:12px; }
.sa-week-nav { display:flex; align-items:center; gap:12px; color:var(--sa-ink); }
.sa-week-nav button { width:30px; height:30px; border:1px solid #e0e7f1; background:white; border-radius:9px; color:#527299; }
.sa-message { padding:20px; background:#f1f6fd; border-radius:14px; color:#527299; text-align:center; font-size:14px; }
.sa-message.is-error { color:#9f4036; background:#fff3ee; }
.sa-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:0 0 24px; }
.sa-card { --shift-color:#2878f0; border:1px solid #e4eaf4; border-radius:20px; background:#fff; padding:22px; position:relative; overflow:hidden; }
.sa-color-1 { --shift-color:#2878f0; }.sa-color-2 { --shift-color:#18a999; }.sa-color-3 { --shift-color:#8b5cf6; }.sa-color-4 { --shift-color:#f5a33b; }
.sa-card::before { content:''; position:absolute; left:0; right:0; top:0; height:3px; background:var(--shift-color); }
.sa-card h2 { display:flex; align-items:center; gap:8px; font-size:16px; margin:0 0 20px; }
.sa-dot { display:inline-block; flex:none; width:7px; height:7px; border-radius:50%; background:var(--shift-color); margin-right:5px; }
.sa-card small { display:block; font-size:11px; color:var(--sa-muted); margin-bottom:7px; }
.sa-card strong { display:block; font-size:27px; letter-spacing:-.7px; font-weight:700; font-variant-numeric:tabular-nums; }
.sa-card .sa-secondary-amount { font-size:21px; }
.sa-card-metric + .sa-card-metric { margin-top:16px; padding-top:16px; border-top:1px solid #f0f3f8; }
.sa-card p { font-size:11px; color:var(--sa-muted); margin:8px 0 0; }
.sa-chart-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:24px; }
.sa-chart-panel { padding:24px 22px 16px; min-width:0; }
.sa-panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:18px; }
.sa-panel-heading h2 { margin:0; font-size:17px; font-weight:650; }
.sa-panel-heading p { margin:8px 0 0; color:var(--sa-muted); font-size:12px; line-height:1.6; }
.sa-platform-mark { display:grid; place-items:center; width:34px; height:34px; background:#f0f3f8; color:#28354b; border-radius:11px; font-size:14px; font-weight:700; }
.sa-wx { color:#b58621; background:#fff8e5; }
.sa-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.sa-chart svg text { font-family:inherit; font-size:11px; fill:#8592a4; }
.sa-chart svg circle { cursor:pointer; }
.sa-chart svg circle:focus { outline:none; stroke:#152f55; stroke-width:3; }
.sa-chart svg .sa-chart-value { font-size:11px; font-weight:650; font-variant-numeric:tabular-nums; }
.sa-chart svg .sa-label-0 { fill:#2167cd; }.sa-chart svg .sa-label-1 { fill:#078675; }.sa-chart svg .sa-label-2 { fill:#7543d5; }.sa-chart svg .sa-label-3 { fill:#af690e; }
.sa-chart svg .sa-chart-date { fill:#236ed6; font-weight:650; }
.sa-chart svg .sa-week-hit { cursor:crosshair; outline:none; }
.sa-chart svg .sa-week-hit:focus-visible { stroke:#7799c7; stroke-width:1; stroke-dasharray:3 3; }
.sa-chart-legend { display:flex; justify-content:center; flex-wrap:wrap; gap:16px; margin:8px 0 10px; font-size:12px; color:#64728a; }
.sa-chart-tooltip { min-height:36px; font-size:12px; line-height:1.6; text-align:center; color:#60718a; margin:10px 0 0; }
.sa-chart-tooltip strong, .sa-chart-tooltip span { display:block; }.sa-chart-tooltip strong { margin-bottom:5px; }
.sa-chart-empty { height:214px; display:grid; place-content:center; text-align:center; color:#8795a8; font-size:13px; gap:10px; }
.sa-chart-empty strong { font-size:16px; color:#6f8096; }
.sa-summary-panel, .sa-detail-panel { padding:26px; }
.sa-table-scroll { overflow-x:auto; }
.sa-table { border-collapse:collapse; width:100%; white-space:nowrap; font-size:13px; }
.sa-table th { background:#f6f9fd; color:#7b899c; font-weight:500; font-size:12px; }
.sa-table td,.sa-table th { padding:17px 14px; text-align:right; border-bottom:1px solid #eef2f7; }
.sa-table td:first-child,.sa-table th:first-child { text-align:left; }
.sa-table tbody tr:last-child td { border-bottom:0; }
.sa-table td { font-variant-numeric:tabular-nums; }
.sa-table .sa-mean { font-weight:650; color:#264568; }
.sa-text-button { background:none; border:0; padding:5px 0; color:#2878f0; font-size:12px !important; white-space:nowrap; }
.sa-footnote { color:#8391a4; font-size:12px; line-height:1.8; margin:16px 5px 24px; }
.sa-detail-day { border-top:1px solid #edf1f7; padding:18px 0; }
.sa-detail-day summary { cursor:pointer; display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; font-size:13px; line-height:1.8; }
.sa-detail-day summary strong { color:#314c6c; }.sa-detail-day summary span { color:#708198; }
.sa-detail-day p { font-size:12px; color:#728197; line-height:1.8; margin:12px 0; }
.sa-detail-day .sa-not-included { color:#b37b35; }
@media (max-width:1050px) { .sa-filters { grid-template-columns:1.4fr 1fr; }.sa-chart-grid { grid-template-columns:1fr; }.sa-card { padding:18px; }.sa-card strong { font-size:23px; } }
@media (max-width:600px) {
  .department-subnav { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sa-intro { margin:4px 0 20px; }.sa-page h1 { font-size:26px; }.sa-badge { display:none; }.sa-subtitle { font-size:12px; line-height:1.7; }
  .sa-filters { padding:18px; gap:16px 12px; grid-template-columns:1fr 1fr; }.sa-account { grid-column:1/-1; }.sa-primary { grid-column:1/-1; }
  .sa-toolbar { flex-direction:column; align-items:flex-start; gap:10px; }.sa-week-nav { width:100%; justify-content:space-between; }.sa-week-nav button { width:40px; height:40px; }
  .sa-cards { grid-template-columns:1fr 1fr; gap:12px; }.sa-card { padding:18px 15px; }.sa-card strong { font-size:23px; }.sa-card .sa-secondary-amount { font-size:19px; }
  .sa-panel { border-radius:18px; }.sa-chart-panel { padding:20px 14px 14px; }.sa-panel-heading h2 { font-size:16px; }.sa-chart-legend { gap:13px; }
  .sa-summary-panel,.sa-detail-panel { padding:20px 16px; }.sa-panel-heading { flex-wrap:wrap; }.sa-table td,.sa-table th { padding:15px 12px; }
}