:root{--color-bg: #f4f6f8;--color-surface: #ffffff;--color-surface-muted: #eef1f4;--color-text: #141a1f;--color-text-muted: #5b6770;--color-border: #d7dde2;--color-green: #1f8a4c;--color-green-bg: #e4f5ea;--color-yellow: #a66a00;--color-yellow-bg: #fff3dc;--color-red: #c2272d;--color-red-bg: #fde8e8;--color-blue: #1a5fb4;--color-blue-bg: #e6f0fb;--color-gray: #8a9299;--color-gray-bg: #eceef0;--color-purple: #7b3fb8;--color-purple-bg: #f1e7fa;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--font-sans: "Noto Sans Thai", "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--control-min-height: 48px}@media (prefers-color-scheme: dark){:root{--color-bg: #10151a;--color-surface: #1a2127;--color-surface-muted: #212a31;--color-text: #eef2f5;--color-text-muted: #9aa5ad;--color-border: #313c44;--color-green: #4fd27a;--color-green-bg: #163322;--color-yellow: #e8b14a;--color-yellow-bg: #3a2c0f;--color-red: #f16a6a;--color-red-bg: #3a1818;--color-blue: #6ba6ec;--color-blue-bg: #122a44;--color-gray: #7d8893;--color-gray-bg: #242c33;--color-purple: #b794e8;--color-purple-bg: #2b1f3a}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}#root{max-width:480px;margin:0 auto;min-height:100vh}@media (min-width: 900px){#root{max-width:920px}}h1,h2,h3,p{margin:0}button{font-family:inherit;font-size:1rem;min-height:var(--control-min-height);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);cursor:pointer;padding:0 var(--space-4)}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:3px solid var(--color-blue);outline-offset:2px}a{color:var(--color-blue);text-decoration:none}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4)}.stack{display:flex;flex-direction:column;gap:var(--space-3)}.row{display:flex;align-items:center;gap:var(--space-2)}.row-between{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.muted{color:var(--color-text-muted);font-size:.875rem}.page{padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-4);padding-bottom:var(--space-6)}input,select{font-family:inherit;font-size:1rem;min-height:var(--control-min-height);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);padding:0 var(--space-3)}.uplot,.uplot *,.uplot *:before,.uplot *:after{box-sizing:border-box}.uplot{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5;width:min-content}.u-title{text-align:center;font-size:18px;font-weight:700}.u-wrap{position:relative;-webkit-user-select:none;user-select:none}.u-over,.u-under{position:absolute}.u-under{overflow:hidden}.uplot canvas{display:block;position:relative;width:100%;height:100%}.u-axis{position:absolute}.u-legend{font-size:14px;margin:auto;text-align:center}.u-inline{display:block}.u-inline *{display:inline-block}.u-inline tr{margin-right:16px}.u-legend th{font-weight:600}.u-legend th>*{vertical-align:middle;display:inline-block}.u-legend .u-marker{width:1em;height:1em;margin-right:4px;background-clip:padding-box!important}.u-inline.u-live th:after{content:":";vertical-align:middle}.u-inline:not(.u-live) .u-value{display:none}.u-series>*{padding:4px}.u-series th{cursor:pointer}.u-legend .u-off>*{opacity:.3}.u-select{background:#00000012;position:absolute;pointer-events:none}.u-cursor-x,.u-cursor-y{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}.u-hz .u-cursor-x,.u-vt .u-cursor-y{height:100%;border-right:1px dashed #607D8B}.u-hz .u-cursor-y,.u-vt .u-cursor-x{width:100%;border-bottom:1px dashed #607D8B}.u-cursor-pt{position:absolute;top:0;left:0;border-radius:50%;border:0 solid;pointer-events:none;will-change:transform;background-clip:padding-box!important}.u-axis.u-off,.u-select.u-off,.u-cursor-x.u-off,.u-cursor-y.u-off,.u-cursor-pt.u-off{display:none}
