*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#000;color:#f5e5d5}body{font-family:'Courier New',monospace;cursor:none}body.operating{cursor:default}button,input{font:inherit}button{cursor:pointer}#stage{position:fixed;left:50%;top:50%;width:var(--stage-size,100vmin);height:var(--stage-size,100vmin);transform:translate(-50%,-50%) scale(var(--stage-x,1),var(--stage-y,1));overflow:hidden;background:#06030b}#field{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}#instrument{position:absolute;inset:0;pointer-events:none;transition:opacity 1.5s}#instrument.off{opacity:0}header{position:absolute;top:4.3%;left:3.5%;right:3.5%;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:2px;opacity:.78}.signature{font-family:Helvetica,Arial,sans-serif;font-size:23px;font-weight:500;letter-spacing:6px;display:flex;align-items:center;gap:17px}.signature-mark{font-size:25px;font-weight:400;letter-spacing:0}.top-note{position:absolute;left:0;top:40px;font-size:8px;letter-spacing:2px;opacity:.6}.live{display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:1.5px}.live i{height:4px;width:4px;background:#e8ad7d;border-radius:50%}footer{position:absolute;bottom:4%;left:3.5%;right:3.5%;display:flex;justify-content:space-between;align-items:flex-end;font-size:10px;letter-spacing:2px;line-height:1.7}.caption,.frame-readout{display:flex;flex-direction:column;gap:5px}.caption span:nth-child(2){font-size:8px;opacity:.4;letter-spacing:2.5px}.frame-readout{text-align:right;font-size:8px;opacity:.6;letter-spacing:1.7px}.frame-readout span:last-child{font-size:11px;opacity:.8}.cycle{position:absolute;left:50%;transform:translateX(-50%);width:128px;text-align:center;font-size:7px;letter-spacing:1.8px;opacity:.4}.track{margin-top:11px;height:1px;background:#f5e5d526;width:100%}.track i{display:block;transform-origin:left;width:100%;height:1px;background:#f5e5d5}.scale{position:absolute;right:3.5%;top:39%;height:22%;display:flex;flex-direction:column;align-items:center;gap:10px;font-size:7px;letter-spacing:1px;opacity:.55}.scale div{width:4px;flex:1;background:linear-gradient(to bottom,#fffadb,#ffb314,#f0382b,#850a8f,#240854,#06030b)}.registration{position:absolute;width:12px;height:12px;border-color:#f5e5d535;border-style:solid}.r1{top:11%;left:3.5%;border-width:1px 0 0 1px}.r2{top:11%;right:3.5%;border-width:1px 1px 0 0}.r3{bottom:12%;left:3.5%;border-width:0 0 1px 1px}.r4{bottom:12%;right:3.5%;border-width:0 1px 1px 0}#feedLabels{position:absolute;inset:0;opacity:0;transition:opacity 2s}#feedLabels span{position:absolute;font-size:8px;letter-spacing:1.7px;opacity:.6}#feedLabels span:nth-child(1){left:5%;top:14%}#feedLabels span:nth-child(2){left:52%;top:14%}#feedLabels span:nth-child(3){left:5%;top:54%}#feedLabels span:nth-child(4){left:52%;top:54%}#feedLabels span:nth-child(5),#feedLabels span:nth-child(6){display:none}#controls{position:fixed;bottom:25px;left:25px;width:min(450px,calc(100vw - 50px));padding:22px;background:#100a13f5;border:1px solid #6f4351;font-size:11px;z-index:5}#controls[hidden],#blackout[hidden],#fallback[hidden],#calibration[hidden]{display:none}#calibration{position:absolute;inset:0;background:#08050b;z-index:3}#calibration p{position:absolute;top:7%;left:8%;right:8%;text-align:center;font-size:14px;letter-spacing:3px;line-height:2}#calibration small{font-size:8px;letter-spacing:1px}.calibration-square{position:absolute;inset:20%;border:1px solid #f5e5d5}.calibration-circle{position:absolute;inset:20%;border:1px solid #f2a44a;border-radius:50%}.calibration-center{position:absolute;inset:0;display:grid;place-items:center;color:#f5e5d5;font-size:24px;font-weight:100}.control-heading{display:flex;justify-content:space-between;align-items:center;letter-spacing:2px;font-size:10px;margin-bottom:20px}button{background:transparent;color:#f5e5d5;border:1px solid #59404d;padding:10px;text-align:left}button:hover,button:focus-visible{background:#402039;outline:1px solid #eb9c77}#close{border:0;padding:0 4px;font-size:23px}.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:12px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}#controls p{font-size:9px;line-height:1.8;color:#b395a5;margin-top:20px}#controls label{display:flex;align-items:center;justify-content:space-between;margin-top:20px;gap:15px}input{accent-color:#e07a57;flex:1}#status{color:#d7b1a5;font-size:9px}#blackout{position:fixed;inset:0;background:#000;z-index:4}#fallback{position:absolute;inset:0;background:#08030e}.fallback-form{position:absolute;inset:15% 25%;border-radius:45% 55% 38% 62%;background:radial-gradient(ellipse at 48% 45%,#fff2b7 0%,#ffad20 10%,#e73835 27%,#880c88 46%,#26094d 62%,#08030e 73%);filter:blur(18px)}#fallback p{position:absolute;left:4%;bottom:13%;font-size:10px;line-height:2;letter-spacing:2px}#fallback small{opacity:.6;letter-spacing:0}@media(max-width:700px){.signature{font-size:16px;letter-spacing:3px;gap:7px}.signature-mark{font-size:20px}.top-note{display:none}.live{font-size:7px;letter-spacing:1px}.caption span:nth-child(2){max-width:170px;font-size:6px}.cycle{display:none}footer{font-size:8px}.scale{right:4%}#feedLabels span{font-size:6px;letter-spacing:.4px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
