:root{color-scheme:light;--paper:#f7f8f4;--ink:#23332d;--muted:#5c6862;--line:#d6ddd6;--reading:#167044;--excess:#ae2424}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.45 'Trebuchet MS',Arial,sans-serif}main{max-width:920px;margin:auto;padding:24px 24px 40px}header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--line)}h1{margin:0;font-size:21px;font-weight:600;letter-spacing:.01em}select{min-height:44px;max-width:150px;padding:6px 10px;border:1px solid #89988f;border-radius:3px;background:transparent;color:inherit;font:inherit}select:focus-visible{outline:2px solid var(--reading);outline-offset:3px}.readings{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:22px 0 10px}dl,dd{margin:0}dt{color:var(--muted);font-size:14px}dd{font-size:clamp(27px,4.8vw,42px);line-height:1.3;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;font-variant-numeric:tabular-nums}dd strong{font-weight:600;white-space:nowrap}dd small{font-size:15px;color:var(--muted);font-weight:400}#meter{color:var(--reading)}.context{display:flex;flex-wrap:wrap;gap:4px 20px;margin:0 0 7px;font-size:13px;color:var(--muted)}#periodLine{margin:0 0 22px;font-size:13px;color:var(--muted)}#period{font-variant-numeric:tabular-nums}h2{font-size:15px;margin:0 0 8px;font-weight:600}.table-wrap{width:100%}table{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}th{font-size:12px;color:var(--muted);font-weight:400}th,td{padding:10px 6px;border-bottom:1px solid var(--line);text-align:right}th:first-child,td:first-child{text-align:left;padding-left:0;width:51%}th:last-child,td:last-child{padding-right:0}td:first-child{font-size:13px}tr.over-limit td:last-child{color:var(--excess);font-weight:700}caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:480px){main{padding:16px 14px 30px}.readings{gap:12px}dt{font-size:12px}dd small{font-size:12px}table{font-size:14px}td:first-child{font-size:12px;width:48%}th,td{padding:9px 4px}#period{font-size:12px}h1{font-size:19px}}
.history-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.history-heading h2{margin:0}.history-heading select{font-size:14px}.chart-scroll{max-width:100%;min-width:0;overflow-x:auto;margin:0 0 14px;padding-top:16px}.chart-scroll:focus-visible{outline:2px solid var(--reading);outline-offset:2px}#chartPlot{position:relative;min-width:100%;width:max-content}#historyChart{list-style:none;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(44px,1fr);gap:6px;padding:0;margin:0;min-width:100%;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}#historyChart:empty{display:none}#historyChart li{display:grid;grid-template-rows:22px 120px 28px;text-align:center;min-width:0}#historyChart li>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:80px}#historyChart li>span:last-child{padding-top:6px}.bar-track{display:flex;align-items:flex-end;justify-content:center;border-bottom:1px solid var(--line)}.bar{display:block;width:60%;max-width:32px;background:#89988f}.bar.over-limit{background:var(--excess)}.bar.zero{height:2px!important;background:var(--ink)}.unknown .bar{display:none}#chartReference{position:absolute;top:var(--reference-top,22px);left:0;right:0;border-top:1px dashed var(--muted);font-size:10px;text-align:right;line-height:1;pointer-events:none;z-index:1;transform:translateY(-1px)}#chartReference[hidden]{display:none}