.wall-app { --sage:#426956; --blue:#365e83; --gold:#936b28; max-width:1200px; margin:0 auto; padding:0 36px; color:var(--ink); font:15px/1.6 var(--sans); }
@media(prefers-color-scheme:dark) { .wall-app { --sage:#9abcaa; --blue:#9bbadb; --gold:#d9b775; } }
.wall-app *, .wall-app *::before, .wall-app *::after { box-sizing:border-box; }
.wall-app h1,.wall-app h2,.wall-app h3 { font-family:var(--serif); font-weight:400; color:var(--ink); border:0; padding:0; text-transform:none; }
.wall-app h1 { font-size:clamp(66px,8.2vw,105px); line-height:.98; letter-spacing:-4px; margin:15px 0 22px; }
.wall-app h2 { font-size:clamp(29px,3.2vw,40px); line-height:1.15; letter-spacing:-.8px; margin:8px 0; }
.wall-app h3 { font-size:23px; line-height:1.2; margin:0; }
.wall-app p { margin:0 0 14px; }
.wall-app a { color:inherit; text-decoration:none; border:0; }
.wall-app a:hover { color:var(--accent); text-decoration:underline; text-underline-offset:4px; }
.wall-app .eyebrow { font:10px/1.5 var(--mono); text-transform:uppercase; letter-spacing:1.4px; color:var(--ink-soft); }
.wall-hero { display:grid; grid-template-columns:1.1fr 1fr; gap:80px; padding:52px 0 42px; align-items:end; }
.wall-app .hero-line { font:29px/1.2 var(--serif); letter-spacing:-.3px; margin:0; }
.wall-app em { color:var(--accent); font-weight:400; }
.hero-copy { max-width:440px; padding-bottom:4px; color:var(--ink-soft); font-size:16px; line-height:1.75; }
.wall-app .text-link { display:inline-block; margin-top:6px; font-size:13px; color:var(--accent); }
.text-link span { padding-left:12px; }
.chapter-nav { display:flex; flex-wrap:wrap; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); gap:12px 30px; padding:16px 0; }
.chapter-nav a { font-size:12px; white-space:nowrap; }
.chapter-nav span { font:10px var(--mono); color:var(--accent); margin-right:7px; }
.wall-app .experiment { margin:0; padding:58px 0; border-bottom:1px solid var(--rule); scroll-margin-top:24px; }
.section-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:48px; margin-bottom:24px; }
.section-heading>p { max-width:430px; font-size:14px; color:var(--ink-soft); margin:0 0 5px; }
.wall-app button { cursor:pointer; border:1px solid var(--rule); background:var(--bg); border-radius:3px; color:var(--ink-soft); padding:9px 13px; font:12px/1.4 var(--sans); min-height:38px; }
.wall-app button:hover { border-color:var(--ink-soft); color:var(--ink); }
.wall-app button[aria-pressed=true] { background:var(--accent); color:var(--bg); border-color:var(--accent); }
.wall-app button:focus-visible,.wall-app input:focus-visible,.wall-app a:focus-visible,.wall-app summary:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.wall-app button:disabled { opacity:.5; cursor:default; }
.toolbar { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:18px; }
.state-tag { margin-left:auto; font:10px var(--mono); color:var(--sage); border-bottom:1px solid currentColor; padding:4px 0; }
.state-tag.boundary { color:var(--accent); }
.chamber-grid { display:grid; grid-template-columns:1fr 1fr 1fr; border:1px solid var(--rule); background:var(--bg-panel); }
.lab-panel { min-width:0; padding:20px; }
.chamber-grid .lab-panel+.lab-panel { border-left:1px solid var(--rule); }
.panel-title { display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.panel-title>span:first-child { font:10px var(--mono); color:var(--accent); }
.panel-title .panel-meta { font:9px var(--mono); color:var(--ink-soft); margin-left:auto; }
.wall-app svg { width:100%; height:auto; display:block; overflow:visible; }
.wall-app svg text { font-family:var(--mono); fill:var(--ink-soft); font-size:11px; }
.wall-app svg .serif-label { font-family:var(--serif); font-size:18px; fill:var(--ink); }
.wall-app svg .axis { stroke:var(--rule); stroke-width:1; }
.wall-app svg .guide { stroke:var(--ink-faint); stroke-width:1; stroke-dasharray:3 5; }
.wall-app svg .mode-one { stroke:var(--accent); }
.wall-app svg .mode-two { stroke:var(--blue); }
.wall-app svg .mode-three { stroke:var(--gold); }
#chamber-svg { touch-action:none; cursor:crosshair; }
.control { display:block; font:11px/1.6 var(--sans); color:var(--ink-soft); margin:12px 0; }
.control>span:first-child { display:flex; gap:8px; justify-content:space-between; }
.control output { font:11px var(--mono); color:var(--ink); padding-top:2px; }
.wall-app input[type=range] { width:100%; display:block; margin:8px 0; height:20px; accent-color:var(--accent); cursor:pointer; }
.range-caption { display:flex; justify-content:space-between; gap:8px; font:9px/1.4 var(--mono); color:var(--ink-soft); }
.scale-control { margin-top:22px; padding-top:13px; border-top:1px solid var(--rule); }
.wall-app .micro { font-size:11px; color:var(--ink-soft); line-height:1.65; margin:12px 0 0; }
.legend { font-size:9px; color:var(--ink-soft); display:flex; gap:5px; flex-wrap:wrap; align-items:center; justify-content:center; }
.legend span:last-child { margin-left:4px; }
.swatch { display:inline-block; width:7px; height:7px; border-radius:50%; }
.positive { background:var(--accent); }
.negative { background:var(--blue); }
.mode-buttons { display:flex; gap:6px; margin:17px 0 8px; }
.mode-buttons button { flex:1; padding:7px 3px; }
.wall-app .quiet-button { width:100%; background:transparent; }
.response-intro { font:28px/1.25 var(--serif); padding:32px 0 19px; }
.spectrum-head { display:flex; justify-content:space-between; gap:8px; font:9px var(--mono); color:var(--ink-soft); padding-bottom:12px; border-bottom:1px solid var(--rule); }
.spectrum-row { margin:17px 0 23px; }
.spectrum-numbers { display:flex; justify-content:space-between; gap:8px; font:12px var(--mono); }
.spectrum-numbers span { font-size:10px; color:var(--ink-soft); }
.spectrum-numbers strong { font-weight:500; }
.spectrum-row.selected .spectrum-numbers { color:var(--accent); }
.spectrum-bar { height:6px; margin-top:10px; background:repeating-linear-gradient(to right,var(--rule) 0 1px,transparent 1px 10%),var(--bg); }
.spectrum-bar i { display:block; height:6px; background:var(--ink-faint); }
.spectrum-row.selected .spectrum-bar i { background:var(--accent); }
.energy-readout { border-top:1px solid var(--rule); padding-top:18px; display:flex; flex-direction:column; gap:7px; }
.energy-readout span { font-size:10px; color:var(--ink-soft); }
.energy-readout strong { font:25px var(--serif); }
.observation { display:grid; grid-template-columns:170px 1fr; gap:22px; border-left:2px solid var(--accent); background:var(--bg-panel); padding:20px 24px; margin:22px 0; }
.observation>span { font:10px/1.7 var(--mono); color:var(--accent); }
.observation p { margin:0; font-size:14px; }
.explanation { display:grid; grid-template-columns:1fr 1fr; gap:40px; padding:6px 0; font-size:14px; color:var(--ink-soft); }
.wall-app .math-note { margin-top:22px; border-top:1px solid var(--rule); font-size:13px; color:var(--ink-soft); }
.math-note summary { cursor:pointer; padding:15px 0; color:var(--ink); font-size:12px; }
.math-note>div { max-width:860px; padding:10px 0; line-height:1.8; }
.split-lab { display:grid; grid-template-columns:minmax(0,1.9fr) minmax(260px,1fr); border:1px solid var(--rule); background:var(--bg-panel); }
.plot-panel { min-width:0; padding:24px 22px 18px; }
.plot-caption { font:10px/1.6 var(--sans); color:var(--ink-soft); margin:15px 0 0!important; }
.side-panel { padding:24px; border-left:1px solid var(--rule); }
.side-panel .control { margin:0 0 26px; }
.power-readout { border-top:1px solid var(--rule); padding-top:15px; }
.power-readout p { display:flex; align-items:center; gap:10px; padding:5px 0; font-family:var(--serif); font-size:20px; }
.power-readout i { font:10px var(--mono); width:20px; height:20px; border-radius:50%; text-align:center; line-height:20px; background:var(--bg); }
.power-readout .mode-one { color:var(--accent); }.power-readout .mode-two { color:var(--blue); }.power-readout .mode-three { color:var(--gold); }
.power-readout output { margin-left:auto; font:11px var(--mono); }
.side-reading { font-size:12px; color:var(--ink-soft); line-height:1.8; margin:20px 0!important; }
.section-reading { max-width:800px; font-size:14px; color:var(--ink-soft); margin:23px 0 0!important; }
.cycle-control { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; padding:18px 24px; background:var(--bg-panel); border:1px solid var(--rule); border-bottom:0; }
.cycle-control p { margin:0; color:var(--ink-soft); font-size:12px; }
.comparison-grid { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--rule); }
.comparison-grid .lab-panel { padding:23px 32px; }
.comparison-grid .lab-panel+.lab-panel { border-left:1px solid var(--rule); }
.comparison-grid svg { max-width:390px; margin:auto; }
.mini-values { display:flex; justify-content:space-around; gap:12px; border-top:1px solid var(--rule); padding:16px 0 4px; font:13px var(--mono); }
.mini-values span { display:block; font:9px var(--mono); color:var(--ink-soft); padding-bottom:6px; }
.profile-number { display:flex; flex-direction:column; gap:8px; border-top:1px solid var(--rule); padding-top:18px; }
.profile-number span { font:10px var(--mono); color:var(--ink-soft); }
.profile-number strong { font:38px var(--serif); color:var(--accent); }
.flow-presets { gap:5px; margin-top:-10px; margin-bottom:24px; }
.flow-presets button { font-size:10px; padding:7px 10px; flex:1; }
.formula { font:18px/1.8 var(--serif); color:var(--ink); }
.paper-reading { margin:0!important; padding:52px 0 40px; }
.paper-reading>p:not(.eyebrow) { max-width:740px; font-size:14px; color:var(--ink-soft); margin:18px 0 26px; }
.wall-app .paper-row { display:grid; grid-template-columns:160px 1fr 20px; gap:24px; align-items:baseline; padding:21px 0; border-top:1px solid var(--rule); }
.paper-row>span:first-child { font:10px var(--mono); color:var(--ink-soft); }
.paper-row strong { font:20px/1.4 var(--serif); }
.reading-links { display:flex; flex-wrap:wrap; gap:12px 25px; font-size:11px!important; }
.wall-footer { margin:0; padding:25px 0 40px; border-top:1px solid var(--rule); display:flex; gap:24px; font:10px var(--sans); color:var(--ink-soft); }
.wall-footer span { margin-right:auto; }
.wall-app .notice { padding:20px; background:var(--bg-panel); border:1px solid var(--rule); }
@media(min-width:1000px) { .chamber-grid .lab-panel { padding:22px; } }
@media(max-width:1000px) { .wall-app { padding:0 24px; }.wall-hero { gap:40px; }.chamber-grid { grid-template-columns:1fr 1fr; }.chamber-grid .spectrum-panel { grid-column:1/-1; border-left:0!important; border-top:1px solid var(--rule); }.spectrum-panel .response-intro { padding:15px 0; font-size:24px; }.spectrum-panel #spectrum-rows { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }.spectrum-panel .energy-readout { flex-direction:row; justify-content:space-between; }.split-lab { grid-template-columns:minmax(0,1.5fr) minmax(230px,1fr); }.side-panel { padding:20px; }.power-readout p { font-size:17px; }.section-heading { gap:30px; } }
@media(max-width:680px) { .wall-app { padding:0 18px; }.wall-hero { grid-template-columns:1fr; gap:25px; padding:35px 0 28px; }.wall-app h1 { font-size:76px; letter-spacing:-3px; }.wall-app .hero-line { font-size:25px; }.hero-copy { font-size:14px; max-width:none; }.chapter-nav { display:grid; grid-template-columns:1fr 1fr; gap:13px; }.chapter-nav a { font-size:11px; }.wall-app .experiment { padding:36px 0; }.section-heading { grid-template-columns:1fr; gap:10px; }.section-heading>p { max-width:none; }.chamber-grid { grid-template-columns:1fr; }.chamber-grid .lab-panel+.lab-panel { border-left:0; border-top:1px solid var(--rule); }.chamber-grid .lab-panel { padding:20px; }.chamber-grid svg { max-width:350px; margin:auto; }.chamber-grid .spectrum-panel { grid-column:auto; }.spectrum-panel #spectrum-rows { display:block; }.toolbar { gap:6px; }.toolbar button { font-size:11px; padding:8px 10px; }.state-tag { width:100%; margin:6px 0 0; border:0; }.observation { grid-template-columns:1fr; gap:7px; padding:17px 18px; }.explanation { grid-template-columns:1fr; gap:0; }.split-lab { grid-template-columns:1fr; }.plot-panel { padding:20px 8px 15px; }.plot-caption { padding:0 10px; }.side-panel { border-left:0; border-top:1px solid var(--rule); }.cycle-control { grid-template-columns:1fr; gap:5px; padding:12px 20px; }.comparison-grid { grid-template-columns:1fr; }.comparison-grid .lab-panel+.lab-panel { border-left:0; border-top:1px solid var(--rule); }.comparison-grid .lab-panel { padding:20px; }.wall-app .paper-row { grid-template-columns:1fr 20px; gap:8px; }.paper-row>span:first-child { grid-column:1/-1; }.paper-row strong { font-size:19px; }.wall-footer { flex-wrap:wrap; gap:15px; }.wall-footer span { width:100%; }.mini-values { font-size:12px; } }
@media(prefers-reduced-motion:no-preference) { html:has(.wall-app) { scroll-behavior:smooth; } }
@media(max-width:680px) {
  .wall-app h1 { font-size:clamp(53px,16vw,66px); letter-spacing:-2px; }
  .wall-app .plot-panel svg text { font-size:13px; }
}

.wall-app .plot-legend { display:flex; flex-wrap:wrap; gap:8px 18px; font:10px/1.5 var(--mono); padding:0 12px 20px; }