:root{color-scheme:dark;--ink:#f1f2ef;--muted:#889494;--line:#253030;--cyan:#77d6df;--amber:#dfb16e}*{box-sizing:border-box}body{margin:0;background:#06090a;color:var(--ink);font:14px Arial,sans-serif}header{padding:23px 5%;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;font-size:10px;letter-spacing:2px}header a{color:inherit;text-decoration:none}header span{color:var(--muted)}main{max-width:1500px;margin:auto;padding:0 5%}.intro{display:flex;justify-content:space-between;align-items:end;padding:36px 0 23px}.eyebrow{font:9px monospace;letter-spacing:2px;color:var(--cyan)}h1{font-size:clamp(24px,3.6vw,49px);font-weight:400;letter-spacing:-1.7px;margin:15px 0 0}h1 span{display:block;color:#889494;font-weight:300}.invitation{color:var(--muted);font-size:13px;line-height:1.7}.instrument{position:relative;border:1px solid var(--line);background:#020405}canvas{width:100%;height:clamp(360px,53vh,650px);display:block}.instrument-top{position:absolute;top:19px;left:22px;right:22px;display:flex;justify-content:space-between;pointer-events:none;font:9px monospace;letter-spacing:1px;color:var(--muted)}#status{color:var(--amber)}.telemetry{position:absolute;right:25px;top:67px;display:grid;gap:23px;pointer-events:none}.telemetry span{font:8px monospace;letter-spacing:1px;color:var(--muted)}.telemetry b{display:block;font:20px monospace;letter-spacing:-1px;color:var(--ink);margin-top:5px}.legend{display:flex;gap:23px;flex-wrap:wrap;padding:16px 0;font:10px monospace;color:var(--muted)}.legend span:before{content:'—';margin-right:8px}.truth:before{color:white}.estimate:before{color:var(--cyan)}.collection:before{color:var(--amber)}.play{border-top:1px solid var(--line);padding:20px 0}.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}button,select{border:1px solid #394546;background:#101718;color:var(--ink);padding:12px 17px;border-radius:3px;font:11px monospace;cursor:pointer}button:hover{border-color:var(--cyan)}button.primary{background:#bddfe0;color:#0c2225;border-color:#bddfe0}button[aria-pressed=true]{background:var(--amber);border-color:var(--amber)}.preset{margin-left:auto;color:var(--muted);font:9px monospace;letter-spacing:1px}.preset select{margin-left:10px}.controls,.advanced{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding:25px 0 10px}.control label{display:flex;justify-content:space-between;color:#bbc3c3;font:11px monospace}.control output{color:var(--cyan)}input[type=range]{width:100%;margin:18px 0 0;accent-color:var(--cyan)}details{border-top:1px solid var(--line);padding:22px 0;color:var(--muted)}summary{cursor:pointer;font:11px monospace;color:var(--ink)}details p{max-width:85ch;font-size:12px;line-height:1.8}h2{font-size:18px;font-weight:400;color:var(--ink)}footer{padding:28px 0;display:flex;justify-content:space-between;border-top:1px solid var(--line);color:var(--muted);font:9px monospace;letter-spacing:1px}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--amber);outline-offset:4px}@media(max-width:650px){header span,.invitation,.instrument-top>span:last-child{display:none}.controls,.advanced{grid-template-columns:1fr 1fr;gap:20px}.preset{margin-left:0;width:100%}.telemetry{right:12px;top:52px;gap:12px}.telemetry b{font-size:15px}.telemetry span{font-size:7px}.legend{gap:10px;font-size:9px}footer{font-size:7px;gap:20px}}

.view-controls{display:flex;gap:20px;flex-wrap:wrap;align-items:center;padding:14px 0 20px;font:10px monospace;color:var(--muted)}.view-controls label{display:flex;gap:9px;align-items:center}.view-controls input[type=range]{width:90px;margin:0}.view-controls select{font-size:10px;padding:9px}.instrument canvas{height:clamp(380px,58vh,700px)}

#field{cursor:grab}#field.dragging{cursor:grabbing}.instrument-top,.telemetry{pointer-events:none}

.hero{margin:28px 0 0}.hero img{width:100%;height:auto;display:block}.hero figcaption{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);font:9px monospace;letter-spacing:1px;color:var(--muted)}.hero a{color:var(--cyan);text-decoration:none}#instrument{scroll-margin-top:20px}.recording{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:20px 0;border-top:1px solid var(--line);font:10px monospace;color:var(--muted)}.recording input{width:75px;padding:10px;background:#101718;color:white;border:1px solid var(--line)}.recording button:disabled{opacity:.4;cursor:default}#recordStatus{flex-basis:100%;line-height:1.6}[hidden]{display:none!important}

.telemetry{top:132px}@media(max-width:650px){.telemetry{top:126px;gap:9px}}

.preset-note{margin:14px 0 0;color:var(--muted);font:10px/1.6 monospace}
.control-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:30px}.control-heading label{min-width:0}.parameter-value{display:flex;align-items:center;gap:3px;white-space:nowrap;color:var(--cyan);font:10px monospace}.parameter-value input,.view-number{width:6.8ch;min-width:0;border:1px solid transparent;border-bottom-color:#3a5558;border-radius:2px;background:#0b1416;color:var(--cyan);padding:5px 3px;font:11px monospace;text-align:right;appearance:textfield}.parameter-value input::-webkit-inner-spin-button,.view-number::-webkit-inner-spin-button{appearance:none}.parameter-value input:hover,.view-number:hover{border-color:var(--cyan)}.parameter-value input:focus,.view-number:focus{background:#142327}.control{min-width:0}#evolution{color:var(--amber);font-variant-numeric:tabular-nums}#evolution:empty{display:none}@media(max-width:650px){.control-heading{align-items:flex-start;flex-direction:column;gap:5px}.parameter-value{align-self:flex-end}.control input[type=range]{margin-top:12px}}

.schedule-table{max-width:480px;margin:18px 0}.schedule-heading,.schedule-row{display:grid;grid-template-columns:1fr 1fr 90px;gap:12px;align-items:center;margin:8px 0}.schedule-heading{font:10px monospace}.schedule-row input{width:100%;padding:10px;background:#101718;border:1px solid var(--line);color:var(--cyan);font:12px monospace}.center-schedule .actions{font:10px monospace}.center-schedule select{margin-left:8px}#centerScheduleStatus{color:var(--amber)}

@media(max-width:650px){.telemetry{position:static;display:flex;justify-content:space-between;gap:8px;padding:12px;border-top:1px solid var(--line)}.preset select{max-width:100%;margin:8px 0 0}.view-controls{gap:12px}.view-controls label{flex-wrap:wrap}}

.comparison{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 18px}.comparison[hidden]{display:none}.compare-pane{border:1px solid var(--line);background:#020405;min-width:0}.compare-pane header{padding:11px 14px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;font:9px monospace;letter-spacing:.7px;color:var(--muted)}.compare-pane header b{color:var(--cyan)}.compare-pane header strong{color:var(--ink);font-weight:400}.compare-pane canvas{height:clamp(380px,58vh,700px)}.compare-pane>label{display:flex;align-items:center;gap:10px;padding:10px 14px;color:var(--muted);font:9px monospace;letter-spacing:.6px}.compare-pane input{width:72px;padding:6px;border:1px solid #394546;background:#101718;color:var(--ink);font:11px monospace}@media(max-width:850px){.comparison{grid-template-columns:1fr}}

/* Production Unfold: full-width instrument with room between sections. */
body>header{padding-inline:clamp(22px,3vw,56px)}
main{width:100%;max-width:none;margin:0;padding-inline:clamp(22px,3vw,56px)}
.hero{margin-top:40px}
.hero figcaption{padding-block:18px}
.intro{padding-block:48px 34px;gap:32px}
.instrument{margin-top:8px}
.legend{padding-block:20px}
.view-controls{gap:24px;padding-block:20px 28px}
.play{padding-block:28px}
.controls,.advanced{column-gap:clamp(28px,4vw,64px);row-gap:38px;padding-block:34px 22px}
.recording{gap:16px;padding-block:28px}
.comparison{gap:18px;margin-bottom:28px}
.compare-pane header{padding:15px 18px}
.compare-pane>label{padding:14px 18px}
details{padding-block:30px}
footer{padding-block:36px}
@media(max-width:650px){
  body>header{padding:18px}
  main{padding-inline:18px}
  .hero{margin-top:22px}
  .intro{padding-block:32px 24px;gap:16px}
  .view-controls{gap:14px;padding-block:16px 22px}
  .play{padding-block:20px}
  .controls,.advanced{column-gap:18px;row-gap:26px;padding-block:24px 16px}
  .recording{gap:10px;padding-block:20px}
  .comparison{gap:14px;margin-bottom:20px}
  .compare-pane header{padding:12px}
  .compare-pane>label{padding:12px}
  details{padding-block:24px}
  footer{padding-block:26px}
}