:root{--tv-bg-color:#000;--tv-checker-color:#1a1a1a;--tv-frame-color:#000;--tv-screen-color:#000;--tv-text-primary:#fff;--tv-text-secondary:#9ca3af;--tv-button-bg:#000;--tv-button-hover:#374151;--tv-checker-size:40px}.tv-container{background-color:var(--tv-bg-color);background-image:linear-gradient(45deg,var(--tv-checker-color)25%,transparent 25%),linear-gradient(-45deg,var(--tv-checker-color)25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tv-checker-color)75%),linear-gradient(-45deg,transparent 75%,var(--tv-checker-color)75%);background-size:var(--tv-checker-size)var(--tv-checker-size);background-position:0 0,0 20px,20px -20px,-20px 0;flex-direction:column;justify-content:center;align-items:center;gap:2rem;min-height:100vh;padding:2rem;display:flex}.tv-screen{aspect-ratio:16/9;background-color:var(--tv-screen-color);width:100%;max-width:56rem;position:relative;overflow:hidden}.tv-controls{justify-content:space-between;align-items:center;width:100%;max-width:56rem;display:flex}.tv-now-playing{color:var(--tv-text-primary)}.tv-now-playing-label{font-size:var(--text-size);font-weight:var(--text-label-weight);letter-spacing:.08em;color:var(--tv-text-secondary)}.tv-now-playing-title{font-size:var(--text-size);text-transform:none;font-weight:500}.tv-control-buttons{gap:1rem;display:flex}.tv-button{background-color:var(--tv-button-bg);color:var(--tv-text-primary);cursor:pointer;border:none;border-radius:.5rem;justify-content:center;align-items:center;padding:.75rem;transition:background-color .2s;display:flex}.tv-button:hover{background-color:var(--tv-button-hover)}.tv-now-playing-mobile{display:none}.tv-now-playing-desktop{display:block}@media (max-width:768px){.tv-container{justify-content:space-between;height:100vh;min-height:100vh;padding-top:1rem;padding-bottom:1rem}.tv-now-playing-mobile{text-align:center;flex-shrink:0;width:100%;max-width:56rem;display:block}.tv-now-playing-desktop{display:none}.tv-screen{flex:1;justify-content:center;align-items:center;width:100%;max-width:100%;min-height:0;display:flex}.tv-screen>div{aspect-ratio:16/9;width:100%;max-width:100%;height:auto!important}.tv-screen>div>div{width:100%;height:100%}.tv-controls{flex-direction:column;flex-shrink:0;gap:1rem}.tv-control-buttons{gap:1rem;width:100%;display:flex}.tv-button{flex:1;min-height:48px;padding:1rem}}
.animation-page{background-color:var(--tv-bg-color,#000);background-image:linear-gradient(45deg,var(--tv-checker-color,#1a1a1a)25%,transparent 25%),linear-gradient(-45deg,var(--tv-checker-color,#1a1a1a)25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tv-checker-color,#1a1a1a)75%),linear-gradient(-45deg,transparent 75%,var(--tv-checker-color,#1a1a1a)75%);background-size:var(--tv-checker-size,40px)var(--tv-checker-size,40px);background-position:0 0,0 20px,20px -20px,-20px 0;min-height:100vh}.animation-stage{width:100%;min-height:100vh;position:relative;overflow:hidden}.browser-panel{background:#1c1c1e;border-radius:10px 10px 0 0;flex-direction:column;transition:box-shadow .2s;display:flex;overflow:hidden;box-shadow:0 12px 40px #00000080,0 0 0 1px #ffffff14}.browser-panel:active{box-shadow:0 16px 48px #0009,0 0 0 1px #ffffff1f}.browser-panel-titlebar{-webkit-user-select:none;user-select:none;touch-action:none;background:#2c2c2e;border-bottom:1px solid #ffffff14;align-items:center;gap:8px;min-height:44px;padding:8px 10px 8px 12px;display:flex}.browser-panel-grip{color:#fff6;pointer-events:none;flex-shrink:0}.browser-panel-title{color:#ffffffe6;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:.875rem;font-weight:500;overflow:hidden}.browser-panel-toggle{color:#ffffffb3;cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:28px;padding:0;transition:background .15s,color .15s;display:flex}.browser-panel-toggle:hover{color:#fff;background:#ffffff1f}.browser-panel-toggle:focus-visible{outline-offset:2px;outline:2px solid #ffffff80}.browser-panel-content{background:#000;flex:1;min-height:0}.browser-panel-content .w-full.h-full,.browser-panel-content>div{width:100%;height:100%;min-height:200px}.browser-panel-fullscreen{border-radius:0;width:100vw!important;max-width:none!important;height:100vh!important;max-height:none!important;position:fixed!important;top:0!important;left:0!important}.browser-panel-fullscreen .browser-panel-content{flex-direction:column;flex:1;min-height:0;display:flex}.browser-panel-fullscreen .browser-panel-content>div,.browser-panel-fullscreen .browser-panel-content .w-full.h-full{flex:1;min-height:0}