/* Light instrument panel using the portfolio’s ink, paper, orange, and display type. */
[hidden] { display:none !important; }
body.air-dashboard { --shell:1040px; padding-bottom:2rem; }
.dashboard-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:2.5rem 0 2rem; }
.dashboard-head h1 { font:700 clamp(2.8rem,5vw,4rem)/1 var(--display); text-transform:uppercase; letter-spacing:.015em; margin-top:.65rem; }
.dashboard-head .eyebrow { color:#62625c; font-size:.75rem; }
.unit-select,.section-row label { font-size:.875rem; color:#55554f; }
select { appearance:none; font:500 .875rem var(--sans); color:#20201c; background:#ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='m4 6 4 4 4-4' stroke='%2355554f' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right .75rem center; padding:.7rem 2.4rem .7rem 1rem; margin-left:.5rem; border:1px solid #d3d3ca; border-radius:24px; min-height:44px; cursor:pointer; }
.instrument { background:#ffffff; border:1px solid #ddddd4; border-radius:14px; overflow:hidden; box-shadow:0 8px 28px #11111105; }
.connection-bar,.section-row,.warm-header,.chart-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.connection-bar { padding:1.1rem 2rem; border-bottom:1px solid #ddddd4; }
.connection-bar > div:first-child { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; }
.instrument .eyebrow { font:500 .75rem var(--mono); letter-spacing:.09em; color:#64645d; }
#connection-state { color:#34342e; }#device-id { font: .75rem var(--mono); color:#68685f; overflow-wrap:anywhere; }
.instrument .btn { font:600 .8125rem var(--mono); text-transform:uppercase; letter-spacing:.02em; color:#393930; border:1px solid #d3d3c9; background:transparent; border-radius:8px; padding:.7rem 1.1rem; min-height:44px; box-shadow:none; cursor:pointer; }
.instrument .btn--solid { background:#ff8200; border-color:#ff8200; color:#111111; }
.instrument .btn:hover { transform:none; box-shadow:none; background:#f4f4ef; }.instrument .btn--solid:hover { background:#f59a3d; }
.instrument button:disabled { opacity:.4; cursor:not-allowed; }
button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible { outline:2px solid #a64a00; outline-offset:4px; }
.notice { background:#fff2df; color:#6c400d; padding:1rem 2rem; font-size:.9375rem; }
.status-panel { --signal:#72756d; display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:2rem; padding:2rem 2.5rem; min-height:300px; background:radial-gradient(ellipse at 24% 50%,#ff820009,transparent 65%); }
.status-panel[data-state="green"] { --signal:#23834a; }.status-panel[data-state="yellow"] { --signal:#a76708; }.status-panel[data-state="red"] { --signal:#bd4433; }.status-panel[data-state="warmup"] { --signal:#7b807b; }
.signal { position:relative; display:grid; place-items:center; width:min(100%,230px); aspect-ratio:1; margin:auto; }
.led { position:absolute; inset:0; border:2px solid color-mix(in srgb,var(--signal) 75%,transparent); border-radius:50%; box-shadow:0 0 32px color-mix(in srgb,var(--signal) 13%,transparent),inset 0 0 32px color-mix(in srgb,var(--signal) 9%,transparent); }
.led::before { content:''; position:absolute; inset:9px; border-radius:50%; border:1px solid color-mix(in srgb,var(--signal) 18%,transparent); }
.led::after { content:''; position:absolute; inset:-10px; border-radius:50%; border:1px solid color-mix(in srgb,var(--signal) 8%,transparent); }
.signal-center { display:grid; gap:.6rem; justify-items:center; position:relative; text-align:center; padding:1.5rem; }
.signal-label { font:.75rem var(--mono); text-transform:uppercase; letter-spacing:.14em; color:#68685e; }
#r-ratio { font:700 clamp(3rem,5vw,4rem)/1 var(--display); letter-spacing:0; color:var(--signal); font-variant-numeric:tabular-nums; }
#ratio-detail { font-size:.8125rem; color:#636359; }
.status-copy { max-width:39ch; min-width:0; }.status-copy h2 { font:700 clamp(1.8rem,3.2vw,2.6rem)/1.05 var(--display); text-transform:uppercase; letter-spacing:.015em; margin:.8rem 0; text-wrap:balance; }
.status-copy p { color:#55554c; font-size:1rem; line-height:1.65; }.freshness { display:block; color:#64645b; font:.75rem var(--mono); margin-top:1.25rem; }
.warmup { margin:0 2rem 1.5rem; padding:1.25rem 1.5rem; border:1px solid #dcdcd2; border-radius:14px; color:#494941; font-size:.875rem; }.warm-header strong { font-weight:500; }.warm-track { height:3px; background:#e7e7de; margin:1rem 0; border-radius:4px; }#warm-fill { height:100%; width:0; background:#dd7100; transition:width .5s; }.settling-help{margin-top:.75rem;}.settling-help summary{cursor:pointer;color:#5e5e54;}.settling-help p{margin-top:.5rem;}
.readings { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:1.5rem 2rem 2rem; gap:2rem; border-bottom:1px solid #ddddd4; }.reading{padding-left:1.2rem;border-left:1px solid #dcdcd1;}.reading strong { font:700 clamp(2.2rem,3.5vw,2.8rem)/1.5 var(--display); letter-spacing:0; font-variant-numeric:tabular-nums; }.reading div>span{font-size:.875rem;color:#59594f;}.reading>span:last-child{display:block;font-size:.75rem;color:#696960;}
.trend-panel{padding:2rem;}.instrument h2:not(#status-label){font:700 1.65rem var(--display);text-transform:uppercase;letter-spacing:.015em;}.section-row p{margin-top:.4rem;}#chart-summary,.muted{font-size:.8125rem;color:#626259;}.chart-wrap{position:relative;height:220px;margin:1.5rem 0 .5rem;}#chart{width:100%;height:100%;display:block;}#chart-empty{position:absolute;inset:0;display:grid;place-content:center;font-size:.9375rem;color:#64645b;text-align:center;padding:1rem;}.chart-footer{font-size:.8125rem;color:#62625a;}.chart-footer strong{font-weight:500;color:#22221c;}.swatch{display:inline-block;width:16px;vertical-align:middle;margin-right:.4rem;}.swatch.gas{border-top:2px solid #b75a00;}.swatch.baseline{border-top:2px dashed #7d837c;}.text-button{font:500 .8125rem var(--sans);color:#914500;background:none;border:0;cursor:pointer;min-height:44px;}#history-note{margin-top:.6rem;}
.bottom-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #ddddd4;}.controls,.meaning{padding:2rem;}.meaning{border-left:1px solid #ddddd4;}.meaning p{margin-top:1rem;font-size:.875rem;color:#55554e;}.meaning p.muted{font-size:.8125rem;color:#64645b;}.mode-buttons{display:flex;gap:.5rem;margin:1.3rem 0;flex-wrap:wrap;}.mode-buttons [aria-pressed="true"]{color:#111111;background:#ff8200;border-color:#ff8200;}.slider-row{display:flex;justify-content:space-between;font-size:.875rem;color:#55554b;}#brightness{width:100%;accent-color:#dc7000;margin:1rem 0;cursor:pointer;}#command-status{font-size:.8125rem;color:#626258;min-height:2.8em;}.thresholds{display:flex;gap:1rem;flex-wrap:wrap;font-size:.75rem;margin-top:1rem;color:#55554d;}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:.4rem;}.green{background:#23834a;}.yellow{background:#a76708;}.red{background:#bd4433;}
.diagnostics{padding:1.3rem 2rem;border-top:1px solid #ddddd4;color:#55554b;font-size:.875rem;}.diagnostics summary{cursor:pointer;}#uptime{float:right;font:.75rem var(--mono);}.diagnostics p,.diagnostics .section-row{margin-top:1rem;}#log{max-height:220px;overflow:auto;overflow-wrap:anywhere;font:.75rem/1.7 var(--mono);background:#f5f5ef;padding:1rem;margin-top:1rem;border-radius:10px;}#log .err{color:#b13224;}#log .ok{color:#23834a;}.pager{margin-top:2rem;}
.led.warming{animation:breathe 3s ease-in-out infinite;}.led.stale{border-style:dashed;}.led.rainbow{animation:rainbow 12s linear infinite;border-color:#716ad3;box-shadow:0 0 30px #a2c7ff33,inset 0 0 25px #eab0d322;}
@keyframes breathe{50%{opacity:.35;}}@keyframes rainbow{to{filter:hue-rotate(360deg);}}
@media(max-width:700px){.dashboard-head{padding:1.5rem 0;}.status-panel{grid-template-columns:1fr;padding:2.5rem 1.5rem 1.5rem;gap:2rem;}.signal{width:220px;}.status-copy{text-align:center;margin:auto;}.readings{gap:.75rem;padding:1.5rem 1rem;}.reading{padding-left:.6rem;}.reading .eyebrow{font-size:.75rem;letter-spacing:0;}.reading>span:last-child{font-size:.75rem;}.bottom-grid{grid-template-columns:1fr;}.meaning{border-left:0;border-top:1px solid #ddddd4;}.connection-bar,.trend-panel,.controls,.meaning,.diagnostics{padding:1.25rem;}.connection-bar>div:first-child{display:grid;gap:.3rem;}.warmup{margin-inline:1rem;}.topbar{gap:1rem;}.dashboard-head{flex-wrap:wrap;}.unit-select{margin-left:auto;}}
@media(prefers-reduced-motion:reduce){.led{animation:none!important;}#warm-fill{transition:none;}}

/* The orange index mark anchors the instrument to the site's drawing-set style. */
#connection-state::before { content:''; display:inline-block; width:6px; height:6px; background:var(--accent); border-radius:50%; margin-right:.6rem; }
.status-copy .eyebrow { color:#a64a00; }
.signal-center { pointer-events:none; }
.led { background:radial-gradient(circle,#fff 50%,#f6f6f0 100%); }
#r-ratio { color:var(--ink); }
.instrument .btn:disabled:hover { background:transparent; }
.instrument .btn--solid:disabled:hover { background:var(--accent); }
@media(max-width:400px) { .readings{grid-template-columns:1fr;gap:1rem;}.reading{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;}.reading>span:last-child{display:none;}.connection-bar{gap:.75rem;}.signal{width:200px;} }
