*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:#070708;color:#ffd500;overflow:hidden;font-family:Silkscreen,monospace;-webkit-font-smoothing:none;text-rendering:geometricPrecision;touch-action:none}#app{position:relative;width:100%;height:100dvh;max-width:520px;margin:0 auto;border:1px solid #222}#stage{position:absolute;inset:0;background:#0a0a0c;overflow:hidden}#preview,#view{position:absolute;inset:0;width:100%;height:100%;display:block}#preview{z-index:2;background:#0a0a0c}#view{z-index:1;background:transparent;pointer-events:none}#view.gpu-fail{visibility:hidden;pointer-events:none}#recordCanvas{position:absolute;left:-9999px;top:0;width:1px;height:1px;opacity:0;pointer-events:none}#marksHost{position:absolute;inset:0;pointer-events:none;z-index:3}.ascii-marks{position:absolute;inset:0;pointer-events:none;--s: 2;font-family:Silkscreen,monospace;font-size:calc(8px * var(--s));line-height:1;color:#ffd500}.ascii-corner,.ascii-cross,.ascii-lock-lab,.ascii-tid{position:absolute;pointer-events:none;white-space:pre}.ascii-corner.sel,.ascii-tid.sel{color:#00ffc8}#chrome{position:absolute;inset:0;z-index:10;pointer-events:none;--s: 2;--huddi-ink: #ffd500;--huddi-cut: #070708;--huddi-solid: #ffd500;font-size:calc(8px * var(--s));color:#ffd500}#chrome .panel,#chrome #padCluster,#chrome #menuHost,#chrome .hit{pointer-events:auto}.tl-hud{position:absolute;left:calc(8px * var(--s));top:calc(8px * var(--s));z-index:12;pointer-events:none;white-space:pre;line-height:1.25;text-shadow:0 0 0 #070708}.tl-hud .rec-dot{color:#f35}#menuHost{position:absolute;right:calc(8px * var(--s));top:calc(8px * var(--s));z-index:13}#padCluster{position:absolute;left:50%;transform:translate(-50%);bottom:calc(10px * var(--s));display:flex;flex-direction:row;align-items:flex-end;gap:1ch;z-index:12;max-width:calc(100% - 16px * var(--s))}#joyHost,#bankHost,#recHost{display:flex;flex-direction:row;align-items:flex-end;gap:1ch}#desk{position:absolute;right:calc(8px * var(--s));top:calc(8px * var(--s) + 3.5em);max-height:calc(100dvh - 16px * var(--s) - 12em);overflow-y:auto;overflow-x:hidden;text-align:left;scrollbar-width:none;z-index:11;background:#070708;border:1px solid #ffd500;padding:calc(4px * var(--s))}#desk[hidden],#desk.menu-closed{display:none!important}#desk::-webkit-scrollbar{display:none}#hudRead{position:absolute;bottom:calc(8px * var(--s) + 11em);right:calc(8px * var(--s));text-align:right;pointer-events:none;z-index:9;opacity:.85}#logPanel{position:absolute;left:6px;right:6px;top:calc(16px + 3em);max-height:22%;overflow:hidden;background:#070708;border:1px solid #ffd500;padding:4px 6px;font-family:Silkscreen,monospace;font-size:8px;line-height:1.35;color:#ffd500;white-space:pre;pointer-events:none;z-index:8}#logPanel[hidden]{display:none!important}.banner{display:none;position:absolute;left:8px;right:8px;top:8px;padding:8px;background:#300;border:1px solid #f55;color:#fcc;font-size:11px;z-index:20}.banner.show{display:block}#pipStrip{position:absolute;left:16px;bottom:calc(16px + 10em);z-index:4;display:flex;flex-direction:row;flex-wrap:nowrap;gap:6px;justify-content:flex-start;align-items:flex-end;pointer-events:none;max-width:45%;overflow:hidden}#pipStrip:empty{display:none}.pip-tile{pointer-events:auto;position:relative;flex:0 0 auto;padding:0;margin:0;border:2px solid #ffd500;border-radius:0;background:#111;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent}.pip-tile.pip-selected{border-color:#00ffc8}.pip-tile.pip-lost{border-style:dashed}.pip-canvas{display:block;width:48px;height:64px;object-fit:cover;background:#0a0a0a;image-rendering:pixelated}.pip-label{position:absolute;left:0;right:0;bottom:0;padding:2px 3px;font-family:Silkscreen,monospace;font-size:8px;line-height:1.2;color:#070708;background:#ffd500;text-align:center;pointer-events:none}.pip-tile.pip-selected .pip-label{background:#00ffc8}