html{height:100%;touch-action:manipulation}body{margin:0;padding:0;height:100%;overflow:hidden;background-color:#fff;font-family:Atkinson Hyperlegible Mono,sans-serif}#container{width:100%;height:100%;position:relative}#controller{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background:#0006;-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);padding:8px 16px;border-radius:4px;display:grid;grid-template-columns:auto 1fr 80px;align-items:center;gap:16px;max-width:640px;z-index:1}.time-display{color:#fff;text-align:center;font-size:1rem}.progress-slider{min-width:160px}.controls{display:flex;gap:8px;justify-content:center}.btn{padding:8px 16px;background:#333;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:14px;transition:background .3s}.btn:hover{background:#555}.btn:active{background:#222}.progress-slider{-webkit-appearance:none;width:100%;height:12px;background:transparent;outline:none;cursor:pointer}.progress-slider::-webkit-slider-runnable-track{width:100%;height:12px;background:#333;border:1px #777 solid;border-radius:8px}.progress-slider::-webkit-slider-thumb{-webkit-appearance:none;height:12px;width:12px;border:none;background:gray;cursor:grab;border-radius:8px}.progress-slider:focus{outline:rgba(255,255,255,.2) solid 1px}.progress-slider:focus::-webkit-slider-runnable-track{background:#222}.progress-slider::-moz-range-track{width:100%;height:12px;background:#333;border-radius:8px;border:1px #777 solid}.progress-slider::-moz-range-thumb{width:12px;height:12px;background:#777;border-radius:8px;border:1px #000 solid;cursor:grab}:is():active{cursor:grabbing}.touch .progress-slider::-webkit-slider-runnable-track{height:20px}.touch .progress-slider::-webkit-slider-thumb{width:12px}