body{color:#ff2d55;-webkit-user-select:none;user-select:none;background-color:#000;margin:0;padding:0;font-family:DotGothic16,monospace;overflow:hidden}#canvas-container{z-index:0;touch-action:none;width:100vw;height:100vh;position:absolute;top:0;left:0}#ui-layer{pointer-events:none;z-index:10;width:100%;height:100%;position:absolute;top:0;left:0}#header{pointer-events:auto;background:#000000e6;border-bottom:1px solid #ff2d55;justify-content:space-between;align-items:center;padding:20px;display:flex}#controls button{color:#ff2d55;cursor:pointer;background:0 0;border:1px solid #ff2d55;margin-left:10px;padding:5px 15px;font-family:inherit;font-weight:700;transition:all .2s}#controls button:hover{color:#000;background:#ff2d55}#progress-container{background:#ff2d5533;border:1px solid #ff2d5566;height:4px;position:absolute;top:80px;left:20px;right:20px}#progress-bar{background:#ff2d55;width:0%;height:100%;box-shadow:0 0 10px #ff2d55}#time-display{font-size:12px;position:absolute;top:10px;right:0}#meta{letter-spacing:2px;font-size:14px}#overlay{text-align:center;background:#000c;border:1px solid #ff2d55;padding:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#media{opacity:.5;z-index:100;position:fixed;bottom:0;right:0}#media.disabled{display:none}