:root{font-family:Arial,Helvetica,sans-serif;color:#e7dcc5;background:#111918;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden}#machine{position:fixed;inset:0}canvas{display:block;touch-action:none}header,footer{position:fixed;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.15em}header{top:24px}header nav{display:flex;align-items:center;gap:18px}header button{background:none;border:0;padding:8px 0;font-size:12px}footer{bottom:20px;color:#aaa99a;font-size:9px;pointer-events:none}a{color:inherit;text-decoration:none;border-bottom:1px solid #78694d;padding-bottom:5px}i{font-style:normal;color:#cda35b;margin:0 12px}.intro{position:fixed;left:36px;top:90px;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:.18em;color:#c0a069}h1{font-family:Georgia,serif;font-size:clamp(36px,4vw,62px);line-height:1.06;letter-spacing:-.04em;font-weight:400;margin:18px 0}h1 em{color:#d8b56e;font-weight:400}.intro>p:last-child{font-size:14px;color:#b1b8ae;line-height:1.65}button,select{font:13px Arial;color:#e6ddc9;background:#182521;border:1px solid #53635a;border-radius:3px;padding:10px;cursor:pointer}button:hover,button[aria-pressed=true],button.primary{background:#c5a366;color:#14231c;border-color:#c5a366}button:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid #f5c978;outline-offset:4px}select{padding:8px;max-width:100%}label{font-size:11px;color:#b5bcaf}h2{font:36px/1.1 Georgia;font-weight:400;margin:20px 0}.readout{position:fixed;left:36px;top:370px;width:245px;pointer-events:none}.readout>div{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #a5ab902b;padding:12px 0}.readout span{font-size:9px;letter-spacing:.12em;color:#a6b0a4}.readout output{font:25px Georgia;letter-spacing:.13em;font-variant-numeric:tabular-nums;color:#e3c385}#equation{font:22px Georgia;margin:16px 0 8px}#stage{color:#a9b0a6;font-size:12px;line-height:1.5;min-height:36px}.transport{position:fixed;bottom:72px;left:36px;width:350px}.playback{display:flex;gap:7px;align-items:center}.playback label{display:flex;gap:5px;align-items:center}.program{margin-top:16px;display:flex;justify-content:space-between;align-items:center;gap:10px}.program label{font-size:9px;letter-spacing:.07em}.program select{display:block;margin-top:7px;width:202px}#step-count{font-size:9px;letter-spacing:.1em;color:#a0ad9f}.inspector{position:fixed;right:32px;bottom:72px;width:230px}#inspect{width:100%;text-align:left;background:#15201dea}#inspect span{float:right}#inspection{padding:14px;background:#15201df0;border:1px solid #53635a;border-top:0}#inspection label{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}#inspection select{width:150px}#inspection button{width:100%}#inspection p{font-size:10px;color:#a5ad9e;margin-bottom:0}dialog{background:#172520;color:#e7dcc5;border:1px solid #6c755f;padding:34px;max-width:540px;width:calc(100% - 28px);max-height:85vh;border-radius:4px;box-shadow:0 25px 90px #0008}dialog::backdrop{background:#08120fc9;backdrop-filter:blur(5px)}dialog p{color:#bfc5b7;font-size:14px;line-height:1.75}dialog a{font-size:12px;display:inline-block;margin:10px 12px 10px 0}.close{position:absolute;right:14px;top:12px;font-size:22px;border:0;background:none}#inventory{display:grid;grid-template-columns:1fr 1fr;gap:18px;border-block:1px solid #79806b44;padding:20px 0}#inventory div{font:25px Georgia}#inventory small{display:block;font:10px Arial;letter-spacing:.06em;color:#aeb6a4;margin-top:6px}details{margin-top:20px;font-size:12px}code{display:block;font-size:10px;overflow-wrap:anywhere;line-height:1.7;padding-top:10px}#loading{position:fixed;inset:0;background:#111918;display:grid;place-items:center;font:20px Georgia}#loading:empty{display:none}[hidden]{display:none!important}@media(max-height:850px) and (min-width:701px){.intro{top:75px}h1{font-size:44px}.readout{top:300px}.readout>div{padding:8px 0}.transport{bottom:64px}.readout output{font-size:22px}}@media(max-width:700px){header,footer{left:18px;right:18px;font-size:8px}header{top:16px;align-items:flex-start}header>span{max-width:120px;line-height:1.7}header i{margin:0 3px}header nav{gap:12px}header button{font-size:10px}.intro{left:20px;top:65px}h1{font-size:35px;margin:12px 0}.eyebrow{font-size:8px}.intro>p:last-child{font-size:11px;line-height:1.5}.readout{left:20px;right:20px;top:auto;bottom:197px;width:auto;display:flex;justify-content:space-between;gap:12px}.readout>div{display:flex;flex-direction:column;gap:8px;align-items:flex-start;flex:1}.readout output{font-size:22px}.readout span{font-size:7px;letter-spacing:.02em}#equation,#stage{display:none}.transport{left:20px;right:20px;bottom:75px;width:auto}.playback button{padding:10px;font-size:12px}.playback{justify-content:space-between}.program{margin-top:8px}.program select{padding:6px;margin-top:4px}.inspector{right:20px;bottom:260px;width:205px}#inspect{font-size:11px;padding:9px}#inspection{padding:10px}.inspector:has(#inspection:not([hidden])){z-index:2}footer{bottom:17px;display:block;font-size:8px;line-height:1.8}footer span{display:block}dialog{padding:26px}dialog p{font-size:13px}}
body[data-inspecting=true] .intro{display:none}
@media(min-width:701px){body[data-inspecting=true] .readout{top:110px}}
@media(max-width:700px){header{gap:12px}header>span{flex:0 0 100px}header nav{flex-wrap:wrap;justify-content:flex-end;gap:6px 12px}header nav a{white-space:nowrap}}
