:root{--face:#ece9d8;--face-dk:#d6d2c2;--frame:#0831d9;--edge-lo:#aca899;--edge-dk:#6f6b5f;--ink:#16171d;--ink-soft:#4a4a45;--legend:#0a246a;--sunk-a:gray;--sunk-b:#404040;--ui:var(--font-body), "IBM Plex Sans", system-ui, sans-serif}*,:before,:after{box-sizing:border-box}*{margin:0}html,body{height:100%;overflow:hidden}html{-webkit-text-size-adjust:100%}body{height:100svh;padding:max(6px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left));font-family:var(--ui);color:var(--ink);-webkit-font-smoothing:antialiased;overscroll-behavior:none;background:radial-gradient(125% 95% at 50% 0,#5c9fe2 0%,#2f69ad 55%,#1d4d8c 100%);font-size:14px;line-height:1.5;display:flex}.win{background:var(--face);border:3px solid var(--frame);border-top:0;border-radius:9px 9px 3px 3px;flex-direction:column;flex:1;max-width:560px;min-height:0;margin:0 auto;display:flex;box-shadow:0 10px 26px #00000061}.titlebar{background:linear-gradient(#0e5fd8 0%,#3d8cf2 5%,#1d70e6 11%,#0d5ada 46%,#0a4ec6 84%,#1257ce 94%,#2f78e2 100%);border-radius:7px 7px 0 0;flex:none;align-items:center;gap:7px;padding:4px 5px 5px 8px;display:flex;box-shadow:inset 0 1px #ffffff73}.titlebar h1,.titlebar h2{color:#fff;text-shadow:1px 1px 1px #00000073;letter-spacing:.01em;flex:1;font-size:14px;font-weight:700;line-height:1.28}.titlebar h1 .sub{color:#ffffffd1;font-size:11.5px;font-weight:400}.tb-icon{flex:0 0 17px;width:17px;height:17px;display:block}.caps{flex:none;gap:2px;display:flex}.cap{cursor:pointer;background:linear-gradient(#f08a72 0%,#dc5030 45%,#c33a1c 55%,#e9765a 100%);border:1px solid #ffffffa6;border-radius:3px;width:21px;height:20px;padding:0;position:relative;box-shadow:inset 0 1px #ffffff80}.cap:before,.cap:after{content:"";background:#fff;border-radius:1px;height:2px;position:absolute;top:9px;left:4px;right:4px}.cap:before{transform:rotate(45deg)}.cap:after{transform:rotate(-45deg)}.cap:focus-visible{outline-offset:1px;outline:2px solid #fff}.body{flex-direction:column;flex:1;gap:10px;min-height:0;padding:10px;display:flex}.client{min-height:64px;box-shadow:inset 1px 1px 0 var(--sunk-a), inset 2px 2px 0 var(--sunk-b), inset -1px -1px 0 #fff;background:#000;flex:1;position:relative}#src,#out{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}#out{background:#000}#idle{text-align:center;color:#9fb4c9;justify-content:center;align-items:center;padding:20px;font-size:13px;line-height:1.7;display:flex;position:absolute;inset:0}#idle.gone{display:none}fieldset{border:1px solid var(--edge-lo);border-radius:3px;flex:none;min-width:0;padding:9px 10px 8px;box-shadow:inset 1px 1px #fff,1px 1px #fff}legend{color:var(--legend);padding:0 5px;font-size:12px;font-weight:700}.row{align-items:center;gap:10px;display:flex}.row+.row{margin-top:4px}.row .spacer,.row input[type=range]{flex:1}.val{color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:17px;font-weight:700}.row>.val{flex:none;min-width:76px}.val em{color:var(--ink-soft);margin-left:3px;font-size:12px;font-style:normal;font-weight:400}.btn{appearance:none;font:inherit;color:#000;cursor:pointer;touch-action:manipulation;background:linear-gradient(#fefefe 0%,#f2f1e8 45%,#eae8d8 47%,#f7f6ee 100%);border:1px solid #003c74;border-radius:3px;min-height:42px;padding:9px 16px;font-size:14px;box-shadow:inset 0 0 0 1px #fff,0 1px #00000014}.btn:active{background:linear-gradient(#dedbc9 0%,#e8e5d4 55%,#f4f2e6 100%);box-shadow:inset 1px 1px 3px #00000038}.btn:focus-visible{outline-offset:2px;outline:2px solid #0a4fc8}.btn.wide{flex:none;width:100%;font-weight:700}.btn.step{width:42px;padding:0;font-size:19px;font-weight:700;line-height:1}.btn.tap{font-variant-numeric:tabular-nums;flex:none;min-width:72px;padding:0 10px;font-size:13px;font-weight:700}.btn.tap[data-live="1"]{background:linear-gradient(#fdfefe 0%,#e2ecfa 45%,#d3e2f6 47%,#eef4fd 100%);border-color:#0a4fc8}input[type=range]{appearance:none;background:0 0;width:100%;height:32px;margin:0;display:block}input[type=range]::-webkit-slider-runnable-track{background:#c9c5b4;border-radius:1px;height:6px;box-shadow:inset 1px 1px #6f6b5f,inset 2px 2px #4040404d,inset -1px -1px #fff}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:linear-gradient(#fbfaf5 0%,#e4e1cf 46%,#cfcbb6 54%,#eae7d9 100%);border:1px solid #43535d;border-radius:3px;width:21px;height:30px;margin-top:-12px;box-shadow:inset 0 0 0 1px #fff,0 1px 1px #0003}input[type=range]::-moz-range-track{height:6px;box-shadow:inset 1px 1px 0 var(--edge-dk);background:#c9c5b4;border-radius:1px}input[type=range]::-moz-range-thumb{background:linear-gradient(#fbfaf5 0%,#e4e1cf 46%,#cfcbb6 54%,#eae7d9 100%);border:1px solid #43535d;border-radius:3px;width:19px;height:28px}input[type=range]:focus-visible{outline-offset:-2px;outline:2px solid #0a4fc8}.status{border-top:1px solid #fff;flex:none;gap:2px;padding:3px;display:flex}.status>*{color:var(--ink-soft);border:1px solid;border-color:var(--edge-lo) #fff #fff var(--edge-lo);font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;background:0 0;padding:4px 8px;font-family:inherit;font-size:12px;overflow:hidden}.status .grow{flex:1;min-width:0}button.statbtn{cursor:pointer;color:var(--legend);text-underline-offset:2px;font-weight:700;text-decoration:underline}button.statbtn:active{border-color:var(--edge-dk) #fff #fff var(--edge-dk)}button.statbtn:focus-visible{outline-offset:-2px;outline:2px solid #0a4fc8}.err{color:#8a2020;background:#fdf0f0;border:1px solid #b58b8b;border-radius:3px;flex:none;padding:8px 10px;font-size:12.5px;line-height:1.45;display:none}.err.on{display:block}dialog.dlg{border:3px solid var(--frame);background:var(--face);width:min(520px,100vw - 24px);max-height:min(78svh,640px);color:var(--ink);border-top:0;border-radius:9px 9px 3px 3px;padding:0;overflow:hidden;box-shadow:0 14px 40px #00000080}dialog.dlg::backdrop{background:#04102c80}dialog.dlg[open]{flex-direction:column;display:flex}.dlg-body{min-height:0;font-family:var(--ui);flex-direction:column;flex:1;gap:11px;padding:14px;display:flex;overflow-y:auto}.dlg-body p{font-size:14px;line-height:1.62}.dlg-body em{font-style:italic}.dlg-foot{flex:none;justify-content:flex-end;padding:10px 14px 14px;display:flex}.dlg-foot .btn{text-align:center;min-width:96px}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
