*{box-sizing:border-box}body,html{height:100%;margin:0;font-family:system-ui,Arial,sans-serif;background:#000;color:#eee}:root{--base:min(100vw, 100vh)}.layout{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;padding:1rem}.layout{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;padding:1rem}.tv-wrapper{position:relative;width:var(--base);height:var(--base);max-width:100vw;max-height:100vh}body,html{display:flex;align-items:center;justify-content:center}:root{--tv-frame-base-width:900;--tv-frame-scale:0.4;--tv-frame-shift-x:0px;--tv-frame-shift-y:0px;--tv-screen-offset-x:0px;--tv-screen-offset-y:0px;--tv-screen-width:28%;--tv-screen-aspect:16/9}.tv-frame{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;pointer-events:none;display:flex;align-items:center;justify-content:center}.tv-frame-img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 28px rgba(0,0,0,.6))}.screen{z-index:1}body.frame-mode .screen{width:var(--tv-screen-width);aspect-ratio:var(--tv-screen-aspect);position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) translate(var(--tv-screen-offset-x),var(--tv-screen-offset-y));max-height:80vh;height:auto;border-radius:12px;background:#000;box-shadow:0 0 0 2px #050505,0 0 26px -6px #000}.screen{background:#000;border-radius:14px;box-shadow:0 0 0 2px #0a0a0a,0 0 28px -6px #000;display:flex;align-items:center;justify-content:center;overflow:hidden}.remote.hidden{display:none!important}.remote-toggle{position:fixed;bottom:.85rem;right:.85rem;z-index:460;background:#1d2730;border:1px solid #2f3d48;color:#d4dde4;padding:.55rem .9rem;font-size:.7rem;border-radius:28px;cursor:pointer;box-shadow:0 4px 18px -6px #000}.remote-toggle:hover{background:#24313b}.remote-toggle:active{transform:translateY(1px)}@media (max-width:640px){.remote-toggle{font-size:.65rem;padding:.5rem .7rem}}.screen.has-bg{background:rgba(0,0,0,.55);border-radius:10px;backdrop-filter:blur(2px)}.screen.debug{outline:2px dashed rgba(0,255,0,.6);background:rgba(0,255,0,.08)}.yt-frame{width:100%;height:100%;border:0}.media-frame{width:100%;height:100%;border:0;background:#000}.settings-panel{position:fixed;top:0;left:0;width:320px;max-width:90vw;height:100vh;background:#0c0c0f;border-right:1px solid #222;transform:translateX(-100%);transition:transform .35s ease;display:flex;flex-direction:column;z-index:50}.settings-panel[aria-hidden=false]{transform:translateX(0)}.settings-panel header{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1rem;border-bottom:1px solid #222}.settings-panel h3{margin:0;font-size:1rem}.settings-group{padding:.75rem 1rem;display:grid;grid-template-columns:1fr;gap:.5rem;overflow:auto}.settings-group label{display:flex;flex-direction:column;font-size:.7rem;gap:.25rem;letter-spacing:.5px}.settings-group input[type=range]{width:100%}.settings-group input,.settings-group select{background:#121212;border:1px solid #333;color:#eee;padding:.4rem .5rem;border-radius:4px;font-size:.75rem}.info-block{margin-top:auto;font-size:.65rem;padding:.75rem 1rem;opacity:.75}.remote{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;max-width:90vw;background:#0f0f12;border:1px solid #222;border-radius:18px;padding:.65rem .65rem .4rem;display:flex;flex-direction:column;gap:.5rem;font-family:'Segoe UI',system-ui,sans-serif;box-shadow:0 6px 18px -4px #000 inset,0 4px 14px -2px #000,0 0 40px rgba(0,0,0,.5);z-index:400;pointer-events:auto}.remote:before{content:"";position:absolute;inset:0;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,0));pointer-events:none}.remote button{background:#1a1d22;border:1px solid #2c3238;color:#e2e6ea;border-radius:10px;padding:.55rem .6rem;cursor:pointer;font-size:.7rem;letter-spacing:.5px;box-shadow:0 2px 0 #000}.remote button:hover{background:#232830}.remote button:active{transform:translateY(1px);box-shadow:0 1px 0 #000}.remote .danger{background:#521c1c;border-color:#6d2929}.remote .danger:hover{background:#6d2d2d}.remote-top{display:flex;justify-content:space-between}.remote-top{flex-direction:column;gap:.4rem}.remote-top button{flex:1}.remote-top button.danger{flex:1}.remote-row.wide-sys{display:flex;gap:.45rem}.remote-row.wide-sys button{font-size:.75rem}.remote-row.mini-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem}.remote-row.mini-meta button{font-size:.6rem;padding:.4rem .2rem;letter-spacing:.5px}.remote-block.labels{text-align:center;font-size:.75rem;letter-spacing:2px;color:#9aa5b1}.remote-dpad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:.4rem}.remote-dpad button{aspect-ratio:1/1}#btnOk{grid-column:2;grid-row:2}#btnUp{grid-column:2;grid-row:1}#btnDown{grid-column:2;grid-row:3}#btnLeft{grid-column:1;grid-row:2}#btnRight{grid-column:3;grid-row:2}.remote-row{display:flex;justify-content:space-between;gap:.5rem}.remote-row.combo{align-items:stretch}.remote-row.combo .col{display:flex;flex-direction:column;gap:.45rem}.remote-row.combo .col.center{justify-content:center}.remote-row.combo .col button{width:100%}.remote-row.combo .col.stack button{min-width:3.1rem}.remote-row.small button{flex:1}.remote-numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem}.remote-numpad button.wide{grid-column:1/span 3}.remote-footer{text-align:center;font-size:.6rem;opacity:.8;margin-top:.15rem;display:flex;justify-content:space-between;align-items:center;gap:.4rem}.remote-footer button{background:#1d2227;border:1px solid #2c3238;color:#ddd;padding:.25rem .45rem;font-size:.65rem;border-radius:6px;cursor:pointer}.remote-footer button:hover{background:#252c33}.remote.locked{outline:2px dashed #444}@media (max-width:900px){.remote{width:170px;padding:.55rem .55rem .35rem}}@media (max-width:480px){.remote{width:150px;padding:.45rem .45rem .3rem;transform:translate(-50%,-50%) scale(.85)}.remote button{font-size:.6rem;padding:.4rem .45rem}.remote-block.labels{font-size:.6rem}.remote-numpad button{font-size:.6rem}}@media (max-width:360px){.remote{width:140px;transform:translate(-50%,-50%) scale(.75)}}@media (min-width:1400px){.remote{width:220px}.remote button{font-size:.8rem;padding:.65rem .7rem}.remote-block.labels{font-size:.85rem}}.guide-btn{background:linear-gradient(135deg,#f5a425,#e8941b)!important;color:#0f1115!important;border-color:#d4880f!important;font-weight:700!important;font-size:.55rem!important;padding:.3rem .5rem!important;border-radius:8px!important;letter-spacing:.3px;text-shadow:none}.guide-btn:hover{background:linear-gradient(135deg,#ffb347,#f5a425)!important}.guide-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:1000;align-items:center;justify-content:center;backdrop-filter:blur(4px)}.guide-modal-overlay[aria-hidden=false]{display:flex}.guide-modal{background:#14171c;border:1px solid #2c3238;border-radius:16px;max-width:520px;width:90vw;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.6);animation:guideSlideIn .3s ease}@keyframes guideSlideIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.guide-modal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;border-bottom:1px solid #2c3238;background:linear-gradient(135deg,rgba(245,164,37,.15),transparent);border-radius:16px 16px 0 0}.guide-modal-header h3{margin:0;font-size:.95rem;color:#f5a425}.guide-modal-close{background:0 0;border:none;color:#aaa;font-size:1.2rem;cursor:pointer;padding:.3rem}.guide-modal-close:hover{color:#fff}.guide-modal-body{padding:1rem 1.2rem}.guide-section{margin-bottom:1rem}.guide-section:last-child{margin-bottom:0}.guide-section h4{color:#f5a425;font-size:.8rem;margin:0 0 .5rem 0;border-bottom:1px solid #1e2228;padding-bottom:.3rem}.guide-section ul{list-style:none;padding:0;margin:0}.guide-section li{font-size:.72rem;color:#c0c6ce;padding:.25rem 0;line-height:1.4}.guide-section li strong{color:#e2e6ea}@media (max-width:480px){.guide-modal{max-width:95vw}.guide-modal-header h3{font-size:.8rem}.guide-section h4{font-size:.7rem}.guide-section li{font-size:.65rem}}.ambient-glow{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;filter:blur(min(4vw,40px));opacity:.35;background:radial-gradient(circle at 50% 50%,#00ffaa55,transparent 70%);transition:background-color .6s ease}.ambient-glow,.curve-mask,.noise-canvas,.power-on,.scanlines{z-index:3}.scanlines{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.06) 0 1px,transparent 2px 3px);mix-blend-mode:overlay;opacity:.07}.curve-mask{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,transparent 60%,rgba(0,0,0,.4))}.noise-canvas{position:absolute;inset:0;pointer-events:none;opacity:.08;mix-blend-mode:screen}.power-on{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}.power-on.active{animation:powerFlash .8s ease}@keyframes powerFlash{0%{opacity:0}5%{opacity:1}40%{opacity:.2}100%{opacity:0}}.skeleton{position:absolute;inset:0;background:linear-gradient(90deg,#1a1a1a,#2a2a2a,#1a1a1a);background-size:300% 100%;animation:skeleton 2s linear infinite}@keyframes skeleton{0%{background-position:0 0}100%{background-position:300% 0}}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid #0af;outline-offset:2px}#snapshotOutput{position:fixed;bottom:.5rem;left:.5rem;max-width:25vmin;border:1px solid #333;background:#000;padding:4px;display:none}#snapshotOutput img{width:100%;display:block}.ach-toast{position:fixed;bottom:1rem;left:1rem;background:#111a22;border:1px solid #1e4958;padding:.55rem .7rem .6rem;width:200px;font-size:.6rem;line-height:1.25;border-radius:10px;box-shadow:0 4px 14px -4px #000;transform:translateY(10px);opacity:0;transition:opacity .3s ease,transform .3s ease;z-index:250}.ach-toast.show{opacity:1;transform:translateY(0)}.video-form{display:flex;flex-direction:column;gap:.5rem;width:min(600px,90vw)}.video-form input{padding:.65rem .75rem;border:1px solid #444;border-radius:6px;background:#1d1d1d;color:#eee}.video-form button{padding:.75rem 1rem;border:none;background:#e50914;color:#fff;font-weight:600;border-radius:6px;cursor:pointer}.video-form button:hover{background:#f6121d}@media (max-width:600px){.tv-wrapper{width:100vw}.screen{border-radius:8px}}