.recording-clip-modal>dialog,.recording-clip-modal>dialog[open]{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:100dvh;margin:0;padding:0;border:none;border-radius:0;background:#000;overflow:hidden;overscroll-behavior:none;transform:none}.recording-clip-modal>dialog::backdrop{background:#000}html:has(.recording-clip-modal>dialog[open]),html:has(.recording-clip-modal>dialog[open]) body{overflow:hidden;overscroll-behavior:none}.recording-clip-editor{--clip-primary: #d7ff13;--clip-detail: #335847;--clip-background: #192523;--clip-secondary: #f4ecd9;position:relative;display:flex;flex-direction:column;width:100%;height:100%;min-height:0;min-width:0;overflow:hidden;user-select:none;-webkit-user-select:none}.recording-clip-editor__landscape-gate{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:1.5rem;background:var(--clip-background);text-align:center}.recording-clip-editor__landscape-gate-icon{display:flex;align-items:center;justify-content:center;width:4.5rem;height:4.5rem;border-radius:9999px;border:2px solid color-mix(in srgb,var(--clip-primary) 45%,transparent);color:var(--clip-primary);animation:recording-clip-rotate-hint 2.4s ease-in-out infinite}@keyframes recording-clip-rotate-hint{0%,to{transform:rotate(0)}45%{transform:rotate(90deg)}}.recording-clip-editor__body{position:relative;display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;overflow:hidden}.recording-clip-editor__player-stage{position:relative;flex:1;width:100%;min-width:0;min-height:0;overflow:hidden;background:#000}.recording-clip-editor__close-btn{position:absolute;top:max(.65rem,env(safe-area-inset-top));right:max(.65rem,env(safe-area-inset-right));z-index:10;display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border:none;border-radius:9999px;background:color-mix(in srgb,var(--clip-background) 55%,transparent);color:var(--clip-secondary);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 2px 10px #00000059}.recording-clip-editor__close-btn:hover{color:var(--clip-primary)}.recording-clip-editor__player{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;touch-action:manipulation}.recording-clip-editor__player .video-js,.recording-clip-editor__player .vjs-tech{touch-action:manipulation}.recording-clip-editor__player .video-js{position:relative;width:100%!important;height:100%!important;max-width:100%;max-height:100%;padding-top:0!important}.recording-clip-editor__player .video-js.vjs-fluid{padding-top:0!important}.recording-clip-editor__player .video-js .vjs-tech{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:contain;object-position:center}.recording-clip-editor__player .vjs-control-bar,.recording-clip-editor__player .vjs-big-play-button{display:none}.vjs-hidden-thumb-capture{position:absolute!important;width:1px!important;height:1px!important;left:-9999px!important;top:0!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important}.recording-clip-editor__thumb-host{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}.recording-clip-editor__overlay{position:absolute;inset-inline:0;bottom:0;z-index:5;display:flex;flex-direction:column;gap:.65rem;padding:1.25rem max(.85rem,env(safe-area-inset-right)) max(.85rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left));background:linear-gradient(180deg,transparent 0%,color-mix(in srgb,var(--clip-background) 55%,transparent) 25%,color-mix(in srgb,var(--clip-background) 94%,transparent) 100%);pointer-events:none}.recording-clip-editor__overlay>*{pointer-events:auto}.recording-clip-editor__save-btn{grid-column:3;grid-row:1 / 4;align-self:center;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;padding:0;border-radius:9999px;border:none;background:var(--clip-primary);color:var(--clip-background);box-shadow:0 2px 12px #00000059}.recording-clip-editor__save-btn:disabled{opacity:.85;cursor:wait}.recording-clip-editor__timeline-row{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto auto;align-items:center;gap:.35rem .65rem}.recording-clip-editor__timeline{display:contents}.recording-clip-editor__play-btn{grid-column:1;grid-row:1 / 4;align-self:center;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:9999px;border:2px solid color-mix(in srgb,var(--clip-primary) 55%,transparent);background:color-mix(in srgb,var(--clip-background) 75%,transparent);color:var(--clip-primary);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.recording-clip-editor__viewport{grid-column:2;grid-row:2;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none;border-radius:.65rem;cursor:grab;touch-action:pan-x;user-select:none;-webkit-user-select:none}.recording-clip-editor__viewport::-webkit-scrollbar{display:none}.recording-clip-editor__viewport.is-panning{cursor:grabbing}.recording-clip-editor__track{position:relative;min-width:100%;border-radius:.65rem;background:color-mix(in srgb,var(--clip-detail) 40%,transparent);border:1px solid color-mix(in srgb,var(--clip-detail) 80%,transparent);overflow:hidden}.recording-clip-editor__thumbs{position:absolute;inset:0;z-index:0;pointer-events:none}.recording-clip-editor__thumb{position:absolute;top:0;bottom:0;height:100%;overflow:hidden;background:color-mix(in srgb,var(--clip-detail) 70%,transparent)}.recording-clip-editor__thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;-webkit-user-drag:none;user-select:none;-webkit-user-select:none}.recording-clip-editor__range{position:absolute;top:0;bottom:0;z-index:2;border-radius:0;background:color-mix(in srgb,var(--clip-primary) 22%,transparent);border-inline:1px solid color-mix(in srgb,var(--clip-primary) 55%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--clip-primary) 25%,transparent);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;overflow:hidden}.recording-clip-editor__range.is-dragging{cursor:grabbing}.recording-clip-editor__playhead{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--clip-secondary);pointer-events:none;z-index:1;box-shadow:0 0 6px #0000008c}.recording-clip-editor__handle{position:absolute;top:50%;width:1.15rem;height:2.85rem;margin-left:-.575rem;transform:translateY(-50%);border-radius:.45rem;background:var(--clip-primary);border:2px solid var(--clip-background);box-shadow:0 2px 12px #00000073;cursor:ew-resize;touch-action:none;z-index:3}.recording-clip-editor__handle:after{content:"";position:absolute;inset:.4rem .3rem;border-radius:.2rem;background:color-mix(in srgb,var(--clip-background) 30%,transparent)}.recording-clip-editor__selection-times{grid-column:2;grid-row:1;position:relative;min-height:1.35rem;margin-bottom:.2rem;pointer-events:none}.recording-clip-editor__selection-time{position:absolute;top:0;transform:translate(-50%);padding:.18rem .5rem;border-radius:.4rem;font-size:.8125rem;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;color:var(--clip-primary);white-space:nowrap;background:color-mix(in srgb,var(--clip-background) 92%,transparent);border:1px solid color-mix(in srgb,var(--clip-primary) 50%,transparent);box-shadow:0 2px 10px #00000080}.recording-clip-editor__times{grid-column:2;grid-row:3;position:relative;min-height:1.1rem;font-size:.75rem;font-variant-numeric:tabular-nums;color:color-mix(in srgb,var(--clip-secondary) 85%,transparent);text-shadow:0 1px 2px rgba(0,0,0,.65)}.recording-clip-editor__times-edge{position:absolute;top:0}.recording-clip-editor__times-edge--start{left:0}.recording-clip-editor__times-edge--end{right:0}.recording-clip-editor__times-now{position:absolute;top:0;transform:translate(-50%);padding:.12rem .4rem;border-radius:.35rem;font-weight:700;color:var(--clip-primary);white-space:nowrap;pointer-events:none;background:color-mix(in srgb,var(--clip-background) 88%,transparent);border:1px solid color-mix(in srgb,var(--clip-primary) 35%,transparent);box-shadow:0 2px 8px #00000073}.recording-clip-editor__loading{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;border-radius:0;background:color-mix(in srgb,var(--clip-background) 70%,transparent);color:var(--clip-secondary);font-size:.85rem}.recording-clip-editor__error{width:100%;display:flex;align-items:flex-start;gap:.45rem;padding:.55rem .7rem;border-radius:.55rem;border:1px solid color-mix(in srgb,#f87171 50%,transparent);background:color-mix(in srgb,#7f1d1d 75%,transparent);color:#fecaca;font-size:.75rem;line-height:1.35}.recording-clip-editor__export-status{width:100%}.recording-clip-editor__export-status-card{display:flex;flex-direction:column;gap:.55rem;padding:.7rem .8rem;border-radius:.65rem;border:1px solid color-mix(in srgb,var(--clip-primary) 35%,transparent);background:color-mix(in srgb,var(--clip-background) 94%,transparent);box-shadow:0 8px 24px #00000059;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.recording-clip-editor__export-status-header{display:flex;align-items:center;gap:.5rem;min-width:0}.recording-clip-editor__export-status-icon{width:1rem;height:1rem;flex-shrink:0;color:var(--clip-primary)}.recording-clip-editor__export-progress{width:100%;height:.5rem;border-radius:9999px;overflow:hidden;background:color-mix(in srgb,var(--clip-detail) 55%,transparent);border:1px solid color-mix(in srgb,var(--clip-detail) 80%,transparent)}.recording-clip-editor__export-progress-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--clip-primary) 85%,white),var(--clip-primary));transition:width .35s ease;box-shadow:0 0 10px color-mix(in srgb,var(--clip-primary) 45%,transparent)}.recording-clip-editor__export-status-text{margin:0;flex:1;min-width:0;font-size:.875rem;font-weight:600;line-height:1.3;color:var(--clip-secondary)}.recording-clip-editor__export-status-percent{flex-shrink:0;padding:.15rem .45rem;border-radius:.35rem;font-size:.75rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--clip-background);background:var(--clip-primary)}@media(max-width:896px),(hover:none)and (pointer:coarse){.recording-clip-editor__overlay{gap:.45rem;padding-top:.85rem}.recording-clip-editor__timeline-row{gap:.3rem .45rem}.recording-clip-editor__play-btn,.recording-clip-editor__save-btn{width:2.125rem;height:2.125rem}.recording-clip-editor__play-btn :is(svg,[data-flux-icon]){width:1.125rem;height:1.125rem}.recording-clip-editor__save-btn :is(svg,[data-flux-icon]){width:1rem;height:1rem}.recording-clip-editor__handle{width:.95rem;height:2.35rem;margin-left:-.475rem}.recording-clip-editor__selection-times{min-height:1.2rem;margin-bottom:.15rem}.recording-clip-editor__selection-time{font-size:.75rem;padding:.15rem .4rem}.recording-clip-editor__export-status-card{padding:.6rem .7rem}.recording-clip-editor__export-status-text{font-size:.8125rem}.recording-clip-editor__times{min-height:1rem;font-size:.6875rem}}