.native-storyboard .preview-column{padding:18px 6px;justify-content:center;gap:12px}
.native-storyboard .preview-window{flex:0 1 auto;min-height:0;display:block;overflow:visible;border-radius:0;background:transparent}
.native-storyboard .preview-empty{position:relative;inset:auto;aspect-ratio:var(--preview-ratio,16 / 9);border-radius:22px;background:#1a1a1a;min-height:180px;gap:0}
.native-storyboard .preview-empty p{display:inline;margin:0;color:#ccc;font-size:12px}
.native-storyboard .preview-empty .sbe-preview-generate{padding:0 2px;min-height:0;font-size:12px}
.native-storyboard .preview-empty .play-ring{margin-bottom:18px}
.storyboard-player{width:100%;min-width:0}
.sv-frame{position:relative;width:100%;aspect-ratio:var(--preview-ratio,16 / 9);max-height:calc(100dvh - 310px);border-radius:22px;overflow:hidden;background:#080808}
.native-storyboard .sv-frame video{display:block;width:100%;height:100%;object-fit:contain;cursor:pointer}
.storyboard-player button,.storyboard-player a{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;padding:5px;border:0;border-radius:5px;background:transparent;color:#ddd;cursor:pointer;text-decoration:none}
.storyboard-player button:hover,.storyboard-player a:hover{background:#ffffff20;color:#fff}
.storyboard-player button:focus-visible,.storyboard-player a:focus-visible{outline:2px solid #bb9df0;outline-offset:2px}
.storyboard-player .icon{width:16px;height:16px;stroke-width:1.6}
.sv-tools{position:absolute;right:10px;top:10px;display:flex;align-items:center;gap:1px;padding:2px 5px;border-radius:20px;background:#292929d9;opacity:1;z-index:2}
.sv-tools button,.sv-tools a{width:25px;height:25px;padding:5px}
.sv-tools .icon{width:15px;height:15px}
.sv-time{position:absolute;bottom:11px;left:50%;transform:translateX(-50%);font-size:11px;line-height:18px;color:#fff;text-shadow:0 1px 3px #000;white-space:nowrap;pointer-events:none}
.storyboard-player .sv-fullscreen{position:absolute;right:11px;bottom:11px;width:28px;height:28px;border-radius:50%;background:#292929c9;color:white}
.sv-controls{display:flex;align-items:center;width:100%;height:40px;margin-top:14px;padding:3px 1px;gap:9px;border:1px solid #343434;background:#181818}
.sv-controls [data-player-action=play] .icon{fill:currentColor;stroke-width:0}
.sv-controls [data-player-action=play][aria-label=暂停] .icon{fill:none;stroke-width:4}
.sv-controls .sv-seek{appearance:none;position:relative;z-index:1;width:100%;min-width:15px;height:20px;padding:0;margin:0;cursor:pointer;border:0;border-radius:0;background:transparent;box-shadow:none;outline:none}
.sv-seek::-webkit-slider-thumb{appearance:none;width:8px;height:36px;border:0;border-radius:0;background:radial-gradient(circle at 4px 4px,#bc9cf3 3.8px,transparent 4px),linear-gradient(#bc9cf3,#bc9cf3) center / 2px 100% no-repeat;box-shadow:none}
.sv-seek::-moz-range-thumb{width:8px;height:36px;border:0;border-radius:0;background:radial-gradient(circle at 4px 4px,#bc9cf3 3.8px,transparent 4px),linear-gradient(#bc9cf3,#bc9cf3) center / 2px 100% no-repeat}
.sv-seek:focus-visible{outline:1px solid #bb9df0!important;outline-offset:4px}
.sv-mode{position:relative}
.sv-mode:after{content:'';position:absolute;right:0;bottom:3px;width:12px;height:7px;border-radius:6px;background:#555;border:1px solid #191919}
.sv-mode[aria-checked=true]:after{background:#24cf6d}
.sv-mode:before{content:'';position:absolute;right:6px;bottom:5px;width:4px;height:4px;border-radius:50%;background:white;z-index:1}
.sv-mode[aria-checked=true]:before{right:2px}
.sv-volume{position:relative;display:flex;align-items:center;flex:none}
.sv-volume-popover{display:none;position:absolute;bottom:24px;right:0;width:115px;padding:15px 12px 12px;background:#282828;border:1px solid #404040;border-radius:9px;z-index:5}
.sv-volume:hover .sv-volume-popover,.sv-volume:focus-within .sv-volume-popover{display:block}
.sv-volume-popover input{width:100%;padding:0;margin:0;accent-color:#ddd;cursor:pointer}
.sv-media-error{position:absolute;left:15px;right:15px;top:50%;text-align:center;font-size:12px;color:#ddd;background:#222b;padding:12px;border-radius:8px}
.sv-media-error[hidden]{display:none}
.storyboard-player:fullscreen{display:flex;flex-direction:column;justify-content:center;background:#111;padding:20px}
.storyboard-player:fullscreen .sv-frame{flex:1;max-height:calc(100vh - 80px);aspect-ratio:auto}
.storyboard-player:fullscreen .sv-controls{flex:none}
.native-storyboard .shot-generation-progress.sv-generating{position:relative;inset:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;aspect-ratio:var(--preview-ratio,16 / 9);min-height:170px;max-height:calc(100dvh - 290px);margin:0;padding:20px;border:0;border-radius:24px;overflow:hidden;background:radial-gradient(ellipse at center,#383c3e 5%,#515354 80%)}
.sv-generating:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle,#c3c8c9 1px,transparent 1.9px) center / 13px 13px;mask-image:radial-gradient(ellipse 50% 65% at 50% 50%,#000 8%,transparent 85%);animation:sv-pulse 2.4s ease-in-out infinite alternate}
.native-storyboard .sv-generating>.sv-generation-label{position:relative;flex:none;flex-basis:auto;display:block;padding:10px 16px;border-radius:30px;border:1px solid #74787970;background:#4e5355e8;color:#b3c5d9;font-size:12px;line-height:18px;text-align:center;z-index:1}
.native-storyboard .sv-generating>.sv-stop{position:relative;flex:none;border:1px solid #797b7c80;background:#505456e8;border-radius:24px;color:#fff;font-size:12px;line-height:18px;min-height:0;padding:7px 14px;z-index:1}
.native-storyboard .sv-generating>.sv-stop:hover{background:#64686b}
.storyboard-original-video{display:block;width:100%;max-height:75vh;object-fit:contain;background:black;border-radius:10px}
@keyframes sv-pulse{from{opacity:.55}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.sv-generating:before{animation:none}}
@media(hover:none){.sv-tools{opacity:1}}
@media(max-width:800px){.native-storyboard .preview-column{padding:12px 6px}.sv-frame{max-height:none}}

.sv-track{position:relative;flex:1;min-width:15px;height:20px}
.sv-gaps{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#aaa,#aaa) center / calc(100% - 8px) 1px no-repeat}
.sv-gaps:before,.sv-gaps:after{content:'';position:absolute;top:2px;width:1px;height:16px;background:#aaa}
.sv-gaps:before{left:4px}.sv-gaps:after{right:4px}
.sv-segment-gap{position:absolute;top:8px;width:2px;height:5px;background:#181818;transform:translateX(-50%)}
.sv-frame-menu{position:relative}
.sv-frame-menu summary{list-style:none;display:flex;align-items:center;justify-content:center;width:25px;height:25px;padding:5px;cursor:pointer;border-radius:4px}
.sv-frame-menu summary::-webkit-details-marker{display:none}
.sv-frame-menu summary:hover{background:#ffffff20}
.sv-frame-menu>div{position:absolute;right:0;top:30px;width:145px;padding:5px;background:#303033;box-shadow:0 4px 16px #0008;border-radius:8px}
.sv-frame-menu [role=menuitem]{width:100%;justify-content:flex-start;gap:8px;height:32px;font-size:12px}
.sv-frame-menu [role=menuitem]:after{content:attr(aria-label)}
