:root{color-scheme:dark;--bg:#071014;--panel:#0d1b20;--line:#26383e;--muted:#9aafb4;--mint:#9aeee0;--warm:#ffb08b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#ecf4f3;font-family:Arial,Helvetica,sans-serif;font-size:16px}button,input,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:5px}header{height:84px;margin:0 3.2%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:14px;letter-spacing:2px;font-size:14px;font-weight:700}.brand svg{width:30px;height:30px}.headernote{font-size:13px;color:var(--muted);letter-spacing:1px}.intro{padding:30px 3.2% 24px;display:flex;align-items:end;justify-content:space-between;gap:20px}.eyebrow{color:var(--mint);font-size:12px;letter-spacing:2px;text-transform:uppercase;margin:0 0 12px}h1{font-size:clamp(32px,3.5vw,52px);font-weight:400;letter-spacing:-2px;margin:0}h1 em{font-family:Georgia,serif;color:var(--mint);font-weight:400}.intro p:last-child{color:var(--muted);max-width:360px;line-height:1.55;margin:0;font-size:14px}.lab{margin:0 3.2%;display:grid;grid-template-columns:minmax(0,1fr) 310px;border:1px solid var(--line);border-radius:14px;overflow:hidden}.viewport{position:relative;min-width:0;background:radial-gradient(ellipse at 50% 48%,#163239 0%,#09191f 55%,#071216 100%);min-height:610px;overflow:hidden}.viewtop{position:absolute;top:24px;left:24px;right:24px;z-index:2;display:flex;justify-content:space-between;gap:14px;align-items:start}.tabs{display:flex;background:#081519e8;border:1px solid #344a4d;border-radius:8px;padding:4px}.tabs button{background:none;border:0;border-radius:5px;padding:10px 15px;font-size:14px;color:var(--muted)}.tabs button[aria-pressed=true]{background:#29443f;color:#cefff2}.live{font-size:12px;color:var(--mint);letter-spacing:1px;line-height:1.8;text-align:right}.live small{color:var(--muted);font-size:12px}.scene{display:block;width:100%;height:530px;margin-top:48px}.viewbottom{position:absolute;bottom:20px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:end;gap:20px}.legend{display:flex;flex-wrap:wrap;gap:16px;font-size:12px;color:#b9cecf}.legend span:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--c);margin-right:7px}.scale{font-size:12px;color:var(--muted);text-align:right}.scale b{display:block;color:#d4e6e4;font-weight:400;margin-bottom:6px}.control{background:var(--panel);border-left:1px solid var(--line);padding:26px 24px;display:flex;flex-direction:column;gap:22px}.controlhead{display:flex;align-items:center;justify-content:space-between;font-size:16px}.switch{padding:7px 12px;border:1px solid #456f61;border-radius:20px;background:#233e32;color:#b5f8cd;font-size:12px}.switch[aria-pressed=false]{background:#1d282d;color:#a8b9be;border-color:#485b63}.fieldgroup label{font-size:13px;color:var(--muted);display:flex;justify-content:space-between;gap:10px;margin-bottom:12px}.fieldgroup output{font-size:16px;color:#e9f4f0;font-variant-numeric:tabular-nums}.fieldgroup input[type=range]{width:100%;accent-color:var(--mint);height:18px;cursor:pointer}.ends{display:flex;justify-content:space-between;color:#94a9af;font-size:12px;margin-top:5px}.presets{display:flex;gap:6px;margin-top:10px}.presets button{font-size:12px;border:1px solid #385057;background:none;border-radius:4px;padding:5px 8px}.readout{border-top:1px solid var(--line);padding-top:19px}.temp{font-size:39px;font-weight:400;letter-spacing:-1.5px;color:var(--warm);margin:8px 0}.temp small{font-size:18px;letter-spacing:0;color:#c1cacc}.readout p{font-size:12px;color:var(--muted);line-height:1.6;margin:5px 0}.meter{height:4px;background:#2c383b;margin:14px 0;overflow:hidden}.meter span{display:block;height:100%;background:linear-gradient(90deg,#9de8d9,#ff956b);width:0}.actions{display:flex;gap:8px}.actions button{border:1px solid #3a5055;border-radius:6px;background:transparent;padding:10px 12px;font-size:13px;flex:1}.actions button:first-child{background:#b9eadd;color:#0c2524;border-color:#b9eadd}.checks{font-size:13px;display:flex;gap:14px;flex-wrap:wrap;color:#bccdce}.checks label{display:flex;gap:7px;align-items:center;cursor:pointer}.checks input{accent-color:var(--mint)}.caption{display:grid;grid-template-columns:40px 1fr auto;gap:15px;margin:0 3.2%;padding:23px 0;border-bottom:1px solid var(--line);align-items:start}.caption .num{font-family:Georgia,serif;color:var(--mint);font-size:26px}.caption h2{margin:0 0 8px;font-size:18px;font-weight:400}.caption p{margin:0;color:var(--muted);font-size:14px;line-height:1.6;max-width:790px}.caption button{background:none;border:1px solid #3a5055;border-radius:6px;font-size:13px;padding:10px 14px}.explain{margin:35px 3.2%;display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.explain h3{font-size:16px;font-weight:400;margin:12px 0}.explain p{font-size:14px;color:var(--muted);line-height:1.75}.tag{color:var(--mint);font-size:12px;letter-spacing:1px}details{margin:0 3.2% 35px;padding:22px 0;border-top:1px solid var(--line);color:var(--muted);font-size:14px;line-height:1.7}summary{cursor:pointer;color:#d8e5e3}details a{color:var(--mint)}footer{margin:25px 3.2%;display:flex;justify-content:space-between;gap:15px;color:var(--muted);font-size:12px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.annotation{font:14px Arial;fill:#d2e9e7}.labelLine{stroke:#719b9c;stroke-width:1;fill:none;opacity:.7}.organelle{cursor:pointer}.organelle:hover{filter:brightness(1.35)}#info{color:#b9dfd8;font-size:13px;min-height:18px;line-height:1.5}.mobiletitle{display:none}@media(min-width:1500px){.viewport{min-height:700px}.scene{height:625px}.control{gap:29px}}@media(max-width:1000px){.lab{grid-template-columns:minmax(0,1fr) 280px}.control{padding:24px 18px}.viewtop{left:16px;right:16px}.live{display:none}.scene{height:530px}.tabs button{padding:9px 11px}}@media(max-width:760px){header{height:64px}.headernote{display:none}.intro{display:block;padding:24px 4%}.intro p:last-child{margin-top:14px;max-width:none}.lab{margin:0 4%;grid-template-columns:1fr}.viewport{min-height:450px}.scene{height:360px;margin-top:64px}.viewtop{top:16px}.control{border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:22px 18px}.controlhead,.readout,.actions,.checks{grid-column:1/-1}.readout{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.readout .meter{grid-column:1/-1}.readout>p:first-child{grid-column:1/-1}.temp{font-size:36px}.viewbottom{left:16px;right:16px;bottom:16px}.legend{gap:10px;font-size:11px}.scale{font-size:11px}.caption{margin:0 4%;grid-template-columns:28px 1fr}.caption button{grid-column:2;justify-self:start}.explain{margin:30px 4%;grid-template-columns:1fr;gap:12px}h1{letter-spacing:-1px}.annotation{font-size:17px}footer{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

.frequency-note{font-size:12px;color:var(--muted);line-height:1.55;margin:12px 0 0}.realtime{font-size:12px;margin-top:12px;padding:8px;border:1px solid #46605e;background:transparent;border-radius:5px}.realtime:disabled{opacity:.5;cursor:default}.presets{flex-wrap:wrap}.live{min-width:180px}.viewtop{flex-wrap:wrap}@media(max-width:1000px){.live{display:block;font-size:11px;min-width:0}.live small{font-size:11px}}@media(max-width:760px){.live{width:100%;text-align:left;line-height:1.6}.live br{display:none}.live small{margin-left:8px}.scene{margin-top:105px}.viewport{min-height:490px}.control>.fieldgroup:has(#frequency){grid-column:1/-1}}