:root{--bg:#f6f7f9;--card:#fff;--ink:#1d2330;--mute:#6b7280;--line:#e5e7eb;--acc:#2563eb;--ok:#16a34a;--part:#d97706;--swap:#7c3aed;--miss:#dc2626}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;background:var(--bg);color:var(--ink);line-height:1.5}
header,main,footer{max-width:960px;margin:0 auto;padding:0 24px}
details>summary{cursor:pointer;list-style:none;user-select:none}
details>summary::-webkit-details-marker{display:none}
details>summary h2{display:inline-block;margin:0}
details>summary::before{content:"▸";display:inline-block;width:1.1em;color:var(--mute);transition:transform .15s}
details[open]>summary::before{transform:rotate(90deg)}
details[open]>summary{margin-bottom:12px}
.count{color:var(--mute);font-weight:400;font-size:13px}
header{padding-top:28px}
h1{margin:0;font-size:26px}
h2{font-size:17px;margin:0 0 12px}
.sub{color:var(--mute);margin:4px 0 0;font-size:14px}
.example{background:#fef3c7;border:1px solid #f59e0b;padding:8px 12px;border-radius:8px;font-weight:600}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:20px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.card .k{color:var(--mute);font-size:13px}
.card .v{font-size:28px;font-weight:700;margin-top:2px}
.card .s{color:var(--mute);font-size:12px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:16px}
.chart-wrap{position:relative;height:300px}
.hint{color:var(--mute);font-size:13px;margin:-6px 0 10px}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--mute);font-weight:600;white-space:nowrap}
td.n{white-space:nowrap}
tr.week td{background:#f3f4f6;font-weight:600;color:var(--mute);font-size:13px}
.tag{display:inline-block;padding:1px 8px;border-radius:999px;font-size:12px;color:#fff;white-space:nowrap}
.done{background:var(--ok)}.partial{background:var(--part)}.swapped{background:var(--swap)}.missed{background:var(--miss)}.rest,.rest_planned{background:#9ca3af}.planned{background:var(--acc)}
footer{color:var(--mute);font-size:12px;padding-bottom:32px}
.panel{min-width:0;overflow:hidden}
.chart-wrap canvas{max-width:100%}
#plan td:nth-child(2){min-width:96px}
@media (max-width:600px){header,main,footer{padding-left:16px;padding-right:16px}h1{font-size:22px}.card .v{font-size:24px}.chart-wrap{height:240px}th,td{padding:6px 4px;font-size:13px}td.note{min-width:150px}}