#right-controls-btn{transition:transform .2s ease,background-color .2s ease,border-color .2s ease;transform:translateZ(0);will-change:transform;color:#1e293b}#right-controls-btn svg{transition:color .2s ease,stroke .2s ease}@media (hover: hover) and (pointer: fine) and (min-width: 1024px){#right-controls-btn:hover{transform:scale(1.05)}}#right-controls-btn:active{transform:scale(.98)}#right-controls-container.controls-min,#right-controls-container.controls-middle,#right-controls-container.controls-full{transform:translateY(0)!important;opacity:1!important;pointer-events:auto!important}#right-controls-container.controls-min{height:15vh!important}#right-controls-container.controls-middle{height:40vh!important}#right-controls-container.controls-full{height:85vh!important;height:85dvh!important}#right-controls-container:not(.controls-visible):not(.controls-min):not(.controls-middle):not(.controls-full){transform:translateY(100%)!important;opacity:0!important;pointer-events:none!important}#right-controls-container.controls-visible{transform:translateY(0)!important;opacity:1!important;pointer-events:auto!important}.drag-handle{width:100%;padding:.75rem 0;cursor:grab;touch-action:pan-y;background:#fff;text-align:center;flex-shrink:0;-moz-user-select:none;user-select:none;-webkit-user-select:none}.drag-handle:active{cursor:grabbing}.drag-handle-bar{width:clamp(2.5rem,15vw,4rem);height:.25rem;background-color:#d1d5db;border-radius:9999px;margin:0 auto;transition:background-color .2s}@media (hover: hover) and (pointer: fine){.drag-handle:hover .drag-handle-bar{background-color:#9ca3af}}@media (min-width: 1024px){.right-controls-wrapper{bottom:calc(var(--safe-bottom) + 4rem)!important}#right-controls-container{bottom:calc(var(--safe-bottom) + 1rem)!important;right:calc(max(var(--safe-right),1rem) + 4.75rem)!important;height:auto!important;max-height:calc(100vh - 5rem)!important}#right-controls-container.controls-visible{transform:translate(0) translateY(0)!important}#right-controls-container:not(.controls-visible){transform:translate(20px) translateY(0)!important}#right-controls-container.controls-min,#right-controls-container.controls-middle,#right-controls-container.controls-full{height:auto!important;max-height:calc(100vh - 5rem)!important}}.right-controls-hover-popup{position:absolute;top:50%;right:100%;margin-right:.75rem;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility .2s ease,transform .2s ease;transform:translateY(-50%) translate(8px);z-index:100}.right-controls-hover-popup:before{content:"";position:absolute;top:-1rem;bottom:-1rem;right:-1rem;width:2rem;background:transparent}@media (hover: hover) and (pointer: fine) and (min-width: 1024px){.right-controls-wrapper:hover .right-controls-hover-popup,.right-controls-hover-popup:hover{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(-50%) translate(0)}.right-controls-wrapper.touch-active .right-controls-hover-popup,.right-controls-wrapper.touch-active:hover .right-controls-hover-popup{opacity:0!important;visibility:hidden!important;pointer-events:none!important}}@media (max-width: 1023px){.right-controls-hover-popup{display:none!important}}.right-controls-hover-popup-content{background:#fff;border-radius:.75rem;box-shadow:0 10px 25px #00000026,0 4px 10px #0000001a;padding:.5rem;display:flex;flex-direction:row;gap:.5rem;border:1px solid rgba(0,0,0,.1)}.right-controls-hover-option{display:flex;flex-direction:column;align-items:center;gap:.375rem;padding:.5rem;border-radius:.5rem;cursor:pointer;transition:background-color .15s ease,transform .1s ease;background:transparent;border:none;flex-shrink:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:3.5rem}.right-controls-hover-option:not([data-state]):hover{background-color:#f1f5f9;transform:translateY(-2px)}.right-controls-hover-option:active{transform:translateY(0) scale(.98)}.right-controls-hover-option[data-state=on-visible]{background:#10b981!important}.right-controls-hover-option[data-state=on-invisible]{background:#f97316!important}.right-controls-hover-option[data-state=on-visible] span,.right-controls-hover-option[data-state=on-invisible] span{color:#fff!important;font-weight:600}.right-controls-hover-option[data-state=on-visible] svg,.right-controls-hover-option[data-state=on-invisible] svg{color:#fff!important;stroke:#fff!important}.right-controls-hover-option svg{width:1.25rem;height:1.25rem;flex-shrink:0;color:#475569}.right-controls-hover-option span{font-size:.625rem;font-weight:500;color:#334155;font-family:JetBrains Mono,monospace;text-align:center;line-height:1.2;word-wrap:break-word;overflow-wrap:break-word;hyphens:auto}.control-option{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;border-radius:.5rem;cursor:pointer;transition:background-color .15s ease,transform .1s ease,border-color .15s ease;background:#fff;border:1px solid #e2e8f0;-moz-user-select:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.control-option[data-state=on-visible]{background:#10b981!important;border-color:#10b981!important}.control-option[data-state=on-invisible]{background:#f97316!important;border-color:#f97316!important}.control-option[data-state=on-visible] span,.control-option[data-state=on-invisible] span{color:#fff!important;font-weight:600}.control-option[data-state=on-visible] svg,.control-option[data-state=on-invisible] svg{color:#fff!important;stroke:#fff!important}.control-option:not([data-state]):hover{background-color:#f8fafc;border-color:#cbd5e1}.control-option:active{transform:scale(.98)}.control-option svg{width:1.5rem;height:1.5rem;flex-shrink:0;color:#475569}.control-option span{font-size:.9375rem;font-weight:500;color:#334155;font-family:JetBrains Mono,monospace}.control-option .zoom-subtext{font-size:.6rem;line-height:1;transition:color .2s;display:none;margin-top:.25rem;font-family:JetBrains Mono,monospace;color:#fff}
