:root{color-scheme:light dark;--bg:#f5f7fc;--panel:#fff;--text:#18243a;--muted:#657590;--line:#dce4f0;--accent:#2563eb;--soft:#edf3ff}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}header,main,footer{max-width:1180px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;font-weight:750;font-size:22px;text-decoration:none;color:var(--text)}.brand img{border-radius:10px;background:#fff}.brand small{display:block;font-size:13px;font-weight:500;color:var(--muted)}nav,.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}h1{font-size:clamp(32px,5vw,52px);line-height:1.13;letter-spacing:-.035em;margin:12px 0 22px}h2{font-size:26px;line-height:1.3;letter-spacing:-.02em;margin:0 0 12px}h3{font-size:20px;margin:0 0 10px}p{color:var(--muted);margin:10px 0 20px}.intro{max-width:720px;padding:40px 0 20px}.eyebrow{font-size:12px;letter-spacing:.1em;font-weight:750;color:var(--accent)}.panel,.device{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;margin:22px 0}.narrow{max-width:580px}.row{display:flex;align-items:end;gap:16px;flex-wrap:wrap}.row label{flex:1;min-width:160px}label{display:grid;gap:7px;font-size:14px;color:var(--muted);font-weight:600;margin:14px 0}input,select,textarea,button{font:inherit;border:1px solid var(--line);border-radius:10px;color:var(--text);background:var(--panel);padding:12px 16px;min-height:48px}input,textarea,select{width:100%;min-width:0}textarea{font:14px/1.5 ui-monospace,monospace;resize:vertical;overflow-wrap:anywhere}button{cursor:pointer;font-weight:650;white-space:normal}button:disabled{opacity:.55;cursor:wait}.primary{background:var(--accent);color:white;border-color:var(--accent)}button:hover:not(:disabled){filter:brightness(.95)}:focus-visible{outline:3px solid #78a7ff;outline-offset:3px}a{color:var(--accent)}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:38px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:22px}.device{margin:0;min-width:0;display:flex;flex-direction:column}.device h3{overflow-wrap:anywhere}.device .actions{margin-top:auto}.readings{display:grid;grid-template-columns:1fr 1fr;gap:12px}.reading{background:var(--soft);border-radius:10px;padding:14px}.reading strong{display:block;font-size:26px;font-variant-numeric:tabular-nums}.reading small{color:var(--muted)}svg{width:100%;height:auto;min-height:120px}.item{border-bottom:1px solid var(--line);padding:16px 0;display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap}.item p{margin:0;overflow-wrap:anywhere}#message:empty{display:none}#message{background:var(--soft);padding:14px;border-radius:10px;color:var(--text)}code,pre{font:13px/1.6 ui-monospace,monospace}pre{background:var(--soft);padding:18px;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:12px}.guide{max-width:860px}.guide section{margin:40px 0}.guide table{width:100%;border-collapse:collapse;font-size:14px}.guide td,.guide th{padding:10px;border-bottom:1px solid var(--line);text-align:left}footer{font-size:13px;color:var(--muted);margin-top:50px}html[data-theme=dark]{--bg:#0e1722;--panel:#182433;--text:#e9eff8;--muted:#a5b2c6;--line:#304359;--accent:#78a7ff;--soft:#21334b;color-scheme:dark}html[data-theme=dark] .primary{color:#0b1626}@media(prefers-color-scheme:dark){html:not([data-theme=light]){--bg:#0e1722;--panel:#182433;--text:#e9eff8;--muted:#a5b2c6;--line:#304359;--accent:#78a7ff;--soft:#21334b}html:not([data-theme=light]) .primary{color:#0b1626}}@media(max-width:600px){header,main,footer{padding:18px}header{align-items:start;flex-wrap:wrap}nav{gap:8px;font-size:14px}.panel,.device{padding:20px}.row{display:grid;grid-template-columns:1fr;gap:6px}.row label{margin:8px 0}.row button{width:100%}.section-heading{align-items:start;flex-wrap:wrap}.intro{padding-top:26px}.actions button{flex:1}.guide table{font-size:12px}}
/* Match control typography and baselines across compact forms. */
input,select,textarea,button{font-size:16px;line-height:1.35}input,select,textarea{font-weight:400}.row label{margin-bottom:0}.guide td,.guide th{overflow-wrap:anywhere}.guide table{table-layout:fixed}
/* Long API paths and inline JSON must wrap on a phone, too. */
.guide{overflow-wrap:anywhere}.guide code{overflow-wrap:anywhere;word-break:break-word}
