/* 主题：深色(默认) / 浅色。所有页面共用。切换 。 */
:root {
color-scheme: dark;
--bg: #0f1420; --card: #1a2233; --card2: #212b40;
--text: #e8edf5; --muted: #8b95a8; --accent: #4f8cff; --accent2: #22c55e;
--warn: #f59e0b; --danger: #ef4444; --border: rgba(255,255,255,.08);
--grad-a: #1a2233; --grad-b: #212b40;
--thead-bg: rgba(255,255,255,.03); --thead-hover: rgba(255,255,255,.07);
--sticky-head-bg: #232c42; --row-hover: rgba(255,255,255,.04);
--total-bg: rgba(34,197,94,.07); --total-first-bg: #20302a;
--side-bg: #141b2b; --side-text: #c7d0df; --side-brand: #e8edf5; --side-group: #8b95a8;
--side-hover: rgba(255,255,255,.06); --side-active-bg: #4f8cff; --side-active-text: #fff;
--side-btn-bg: #1a2233; --side-btn-border: rgba(255,255,255,.12);
}
:root[data-theme="light"] {
color-scheme: light;
--bg: #f4f6fb; --card: #ffffff; --card2: #eef1f7;
--text: #1b2432; --muted: #6b7688; --accent: #2f6fe4; --accent2: #12a150;
--warn: #d97706; --danger: #dc2626; --border: rgba(20,30,50,.10);
--grad-a: #ffffff; --grad-b: #eef1f7;
--thead-bg: #eef2f8; --thead-hover: #e2e9f4;
--sticky-head-bg: #e7ecf5; --row-hover: #f5f8fd;
--total-bg: rgba(18,161,80,.08); --total-first-bg: #e6f4ec;
--side-bg: #ffffff; --side-text: #3a4658; --side-brand: #1b2432; --side-group: #8a94a6;
--side-hover: rgba(20,30,50,.06); --side-active-bg: #2f6fe4; --side-active-text: #fff;
--side-btn-bg: #ffffff; --side-btn-border: rgba(20,30,50,.14);
}
body { background: var(--bg); color: var(--text); }
/* 全局视觉细节 */
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
button, input, select, textarea, a { font-family: inherit; }
::selection { background: var(--accent); color: #fff; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
a { color: inherit; }
/* 主题化滚动条 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--card2); border-radius: 8px; border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: var(--muted); }
/* 通用卡片阴影（各页 .card/.stat 若已定义背景，这里补阴影与层次） */
.card, .stat, .item, .region-item { box-shadow: 0 1px 2px rgba(0,0,0,.06); }
:root[data-theme="light"] .card, :root[data-theme="light"] .stat, :root[data-theme="light"] .item, :root[data-theme="light"] .region-item { box-shadow: 0 1px 3px rgba(20,30,50,.08); }
/* 区间选择框 + 日历弹窗（看板与后台设置共用） */
.range-field {
flex: 1; background: var(--card2); color: var(--text); border: 1px solid var(--border);
border-radius: 8px; padding: 8px 10px; font-size: 13px; min-width: 0; font-family: inherit;
cursor: pointer; text-align: center; font-variant-numeric: tabular-nums;
}
.range-field:active { border-color: var(--accent); }
.cal-mask { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: none; z-index: 1200; }
.cal-mask.show { display: block; }
.cal-pop {
position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%);
width: min(360px, calc(100vw - 32px)); background: var(--card); border: 1px solid var(--border);
border-radius: 16px; padding: 14px; z-index: 1210; box-shadow: 0 10px 40px rgba(0,0,0,.4);
}
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.cal-title { font-size: 15px; font-weight: 700; }
.cal-nav { background: var(--card2); border: 1px solid var(--border); color: var(--text); border-radius: 8px; width: 30px; height: 30px; cursor: pointer; font-size: 16px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cal-wd { text-align: center; font-size: 11px; color: var(--muted); padding: 4px 0; }
.cal-day { text-align: center; padding: 8px 0; font-size: 13px; border-radius: 8px; cursor: pointer; user-select: none; }
.cal-day:hover { background: var(--card2); }
.cal-day.dis { opacity: .22; cursor: default; }
.cal-day.dis:hover { background: transparent; }
.cal-day.other { opacity: 0; pointer-events: none; }
.cal-day.inrange { background: color-mix(in srgb, var(--accent) 18%, transparent); border-radius: 0; }
.cal-day.edge { background: var(--accent); color: #fff; font-weight: 700; border-radius: 8px; }
.cal-day.today { box-shadow: inset 0 0 0 1.5px var(--accent2); }
.cal-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; font-size: 12px; color: var(--muted); }
.cal-foot .cf-hint { flex: 1; text-align: center; padding: 0 8px; }
.cal-btn { background: var(--card2); border: 1px solid var(--border); color: var(--text); border-radius: 8px; padding: 6px 12px; cursor: pointer; font-size: 12px; }