:root{--plane:#f9f9f7;--surface:#fcfcfb;--ink:#0b0b0b;--ink-2:#52514e;--ink-muted:#898781;--grid:#e1e0d9;--axis:#c3c2b7;--ring:rgba(11,11,11,0.10);--cat-1:#2a78d6;--cat-2:#eb6834;--cat-3:#1baf7a;--cat-4:#eda100;--seq:#2a78d6;--seq-soft:#cde2fb;--good:#006300;--warning:#b45309;--critical:#d03b3b;--radius:14px;--radius-sm:9px}@media (prefers-color-scheme:dark){:root{--plane:#0d0d0d;--surface:#1a1a19;--ink:#ffffff;--ink-2:#c3c2b7;--ink-muted:#898781;--grid:#2c2c2a;--axis:#383835;--ring:rgba(255,255,255,0.10);--cat-1:#3987e5;--cat-2:#d95926;--cat-3:#199e70;--cat-4:#c98500;--seq:#3987e5;--seq-soft:#184f95;--good:#0ca30c;--warning:#fab219;--critical:#e66767}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--plane);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans Thai,Sarabun,sans-serif;font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}a{color:inherit;text-decoration:none}.shell{display:flex;min-height:100vh}.sidebar{width:226px;flex:0 0 226px;border-right:1px solid var(--grid);background:var(--surface);padding:22px 12px;position:-webkit-sticky;position:sticky;top:0;height:100vh}.brand{padding:0 12px 20px}.brand b{font-size:17px;letter-spacing:-.015em;display:block}.brand span{display:block;font-size:12px;color:var(--ink-muted);margin-top:1px}.nav a{display:block;padding:8px 12px;border-radius:var(--radius-sm);color:var(--ink-2);font-size:14px;margin-bottom:1px;transition:background .12s ease}.nav a:hover{background:var(--plane);color:var(--ink)}.main{flex:1 1;padding:30px 34px 72px;max-width:1140px}h1{font-size:21px;margin:0 0 3px;letter-spacing:-.015em}h1,h2{font-weight:620}h2{font-size:15px;margin:34px 0 13px;letter-spacing:-.01em}.sub{color:var(--ink-muted);font-size:13px;margin:0 0 24px}.card{padding:16px 18px}.card,.hero{background:var(--surface);border:1px solid var(--ring);border-radius:var(--radius)}.hero{padding:22px 24px;margin-bottom:14px}.hero .label{color:var(--ink-muted);font-size:13px;margin-bottom:2px}.hero .figure{font-size:46px;font-weight:600;letter-spacing:-.03em;line-height:1.15}.hero .figure .unit{font-size:20px;font-weight:400;color:var(--ink-muted);margin-left:6px}.hero .foot{color:var(--ink-2);font-size:13.5px;margin-top:4px}.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,1fr));grid-gap:12px;gap:12px}.card .label{color:var(--ink-muted);font-size:12.5px;margin-bottom:5px}.card .value{font-size:24px;font-weight:600;letter-spacing:-.02em;line-height:1.25}.card .value .unit{font-size:13px;font-weight:400;color:var(--ink-muted);margin-left:3px}.card .foot{font-size:12px;color:var(--ink-muted);margin-top:4px;line-height:1.45}.chart{background:var(--surface);border:1px solid var(--ring);border-radius:var(--radius);padding:18px 20px 12px}.chart-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:16px}.chart-title{font-size:14px;font-weight:600}.chart-note{font-size:12px;color:var(--ink-muted)}.cols{gap:2px;height:132px;border-bottom:1px solid var(--axis)}.col,.cols{display:flex;align-items:flex-end}.col{flex:1 1;position:relative;height:100%}.col .bar{width:100%;background:var(--seq);border-radius:4px 4px 0 0;min-height:2px;transition:opacity .12s ease}.col .bar.zero{background:var(--grid);min-height:2px;border-radius:2px}.col:hover .bar{opacity:.72}.col .tip{position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);background:var(--ink);color:var(--plane);font-size:12px;line-height:1.45;padding:6px 9px;border-radius:7px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .1s ease;z-index:5}.col:hover .tip{opacity:1}.axis-row{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-muted);margin-top:7px}.stack{display:flex;height:30px;border-radius:7px;overflow:hidden;gap:2px;background:var(--plane)}.stack>span{display:block;min-width:2px}.legend{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:14px}.legend .item{display:flex;align-items:center;gap:8px;font-size:13px}.legend .swatch{width:11px;height:11px;border-radius:3px;flex:0 0 11px}.legend .qty{color:var(--ink-2);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.legend .pct{color:var(--ink-muted);font-size:12px}.meter{height:10px;border-radius:5px;background:var(--seq-soft);overflow:hidden;margin-top:10px}.meter>span{display:block;height:100%;background:var(--seq);border-radius:5px}.tablewrap{overflow-x:auto;border:1px solid var(--ring);border-radius:var(--radius);background:var(--surface)}table{border-collapse:collapse;width:100%;font-size:14px}td,th{padding:10px 15px;text-align:left;white-space:nowrap}th{color:var(--ink-muted);font-weight:600;font-size:12px;letter-spacing:.01em;border-bottom:1px solid var(--grid)}tbody tr+tr td{border-top:1px solid var(--grid)}tbody tr:hover td{background:var(--plane)}td.num,th.num{text-align:right}.muted{color:var(--ink-muted)}.banner{background:var(--surface);border:1px solid var(--ring);border-left:3px solid var(--warning);border-radius:var(--radius);padding:13px 17px;margin-bottom:20px;font-size:14px}.banner b{color:var(--warning)}.filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}.chip{padding:6px 15px;font-size:13px;border-radius:999px;border:1px solid var(--ring);background:var(--surface);color:var(--ink-2)}.chip:hover{border-color:var(--axis)}.chip.on{background:var(--ink);color:var(--plane);border-color:var(--ink);font-weight:600}@media (max-width:860px){.shell{display:block}.sidebar{width:auto;height:auto;position:static;border-right:none;border-bottom:1px solid var(--grid);padding:14px}.brand{padding-bottom:12px}.nav{display:flex;gap:5px;overflow-x:auto}.nav a{white-space:nowrap}.main{padding:20px 16px 56px}.hero .figure{font-size:38px}.cols{height:108px}}