:root{font-family:Arial,sans-serif;color:#e6e4db;background:#181d1d;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select,input{border:1px solid #53605b;background:#252d2a;color:#ecebe0;border-radius:4px}button{padding:10px 12px;cursor:pointer}button:hover{background:#3e5045}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #e9bd6c;outline-offset:3px}header{padding:25px 4vw;display:flex;justify-content:space-between;border-bottom:1px solid #39413d}.wordmark{font-weight:700;letter-spacing:3px}.wordmark span{font:10px monospace;margin-left:22px;color:#9ba89e}.header-right{font:12px monospace;color:#a9b5aa}.dot{display:inline-block;width:7px;height:7px;background:#b4cc9c;border-radius:50%;margin-right:8px}.intro{display:flex;justify-content:space-between;align-items:flex-end;padding:42px 4vw 34px}.eyebrow{font:11px monospace;letter-spacing:2px;color:#b4cc9c}h1{font-size:clamp(42px,5vw,76px);line-height:.98;letter-spacing:-3px;margin:16px 0 0;font-weight:500}h1 em{font-family:Georgia,serif;color:#c1d2b3;font-weight:400}.lede{font-size:15px;line-height:1.7;color:#aab5ae;max-width:370px}.workspace{display:grid;grid-template-columns:290px 1fr;border-top:1px solid #39413d;min-height:80vh}aside{padding:26px 22px 30px 4vw;background:#1e2522;border-right:1px solid #39413d}h2{font:11px monospace;letter-spacing:1.5px;color:#c3cfbb;text-transform:uppercase;margin:8px 0 23px}label{display:block;font-size:12px;color:#bec9c0;margin:16px 0 8px}select{display:block;width:100%;padding:11px 8px;margin:9px 0 12px}input[type=range]{display:block;width:100%;accent-color:#c0d7a6;margin:14px 0}.hint{font-size:11px;line-height:1.6;color:#99a69e}.filmstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:20px 0}.filmstrip button{padding:11px 8px;display:flex;justify-content:space-between;align-items:center}.filmstrip small{font:9px monospace;color:#a1afa6}.selected{border-color:#b6d697;background:#3d4d3e}.coords{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.coords input{width:100%;padding:8px 3px;margin-top:5px}.row{display:flex;gap:8px;flex-wrap:wrap}.row button{font-size:12px}.stage{min-width:0;padding:25px 4vw 36px 28px}nav{display:flex;gap:4px;margin-bottom:22px}nav button{border-color:transparent;background:transparent;color:#aebbb0;font-size:12px}nav .active{background:#c2d1b1;color:#1c2921}.canvas-wrap{background:#101817;padding:26px;min-height:340px;display:flex;align-items:center;justify-content:center;border:1px solid #35433c}canvas{display:block;width:min(100%,640px);height:auto;image-rendering:pixelated;background:conic-gradient(#455048 25%,#586359 0,#586359 50%,#455048 0,#455048 75%,#586359 0) 0 0/16px 16px;cursor:crosshair}.readout{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #424d45;margin-top:24px;padding-bottom:23px;gap:14px}.readout small{display:block;font:9px monospace;letter-spacing:1px;color:#9eada2}.readout strong{display:block;font-size:38px;font-weight:400;margin-top:9px}.readout em{font:14px monospace;color:#92a28e}.readout .witness{font-size:23px;margin-top:17px}.readout span{font:10px monospace;color:#b2c4a5}.status{font:11px monospace;color:#cadbb7;min-height:28px}.notice{border-left:2px solid #beab7d;padding:10px 15px;background:#282d26;font-size:12px;line-height:1.7;color:#b9bfb0}.notice b{color:#e0dfc8}.exports{margin-top:30px}.exports .row{margin:10px 0}footer{padding:20px 4vw;border-top:1px solid #39413d;color:#a4b0a7;font-size:12px;line-height:1.6}footer details{max-width:760px}summary{cursor:pointer}@media(max-width:800px){.intro{display:block}.lede{margin-top:25px}.workspace{grid-template-columns:1fr}aside{padding:20px;border-right:0}.filmstrip{grid-template-columns:repeat(9,1fr)}.filmstrip button{display:block;padding:8px 2px}.filmstrip small{display:block}.stage{padding:20px}.header-right{display:none}.canvas-wrap{padding:12px;min-height:230px}.readout strong{font-size:28px}.readout .witness{font-size:18px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}canvas[hidden]{display:none}