/* The gallery is isolated from the editing workspace. */
body:not(.editing){background:radial-gradient(ellipse at 82% 0%,#a9885120,transparent 48%),var(--bg)}
body:not(.editing)>header{height:68px;padding:0 36px;background:transparent;border-bottom-color:color-mix(in srgb,var(--line) 55%,transparent)}
body:not(.editing) .history-actions,body:not(.editing) #save,body:not(.editing) #switch{display:none!important}
body:not(.editing){scrollbar-gutter:stable}
body:has(#template-dialog[open]){overflow:hidden}
body:not(.editing) #restore{width:auto;padding:0 12px;gap:7px}
body:not(.editing) #restore::after{content:'打开项目';font-size:12px}
#welcome{max-width:1600px;width:100%;padding:44px 36px 24px;margin:0 auto}
.scene-start{border:0;border-radius:0;background:none;padding:0;box-shadow:none}
.scene-start-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:0 0 36px}
.scene-start-heading .eyebrow{display:flex;align-items:center;gap:8px;color:var(--accent);font-size:10px;letter-spacing:2px}
.scene-start-heading .eyebrow::before{content:'';width:20px;height:1px;background:var(--accent)}
.scene-start h1{font-size:clamp(30px,3.2vw,48px);line-height:1.3;letter-spacing:-1.5px;font-weight:600;margin:15px 0 12px}
.scene-start h1 em{font-style:normal;color:var(--accent)}
.scene-start-heading p{font-size:13px;line-height:1.7;color:var(--muted);margin:0}
.scene-start-actions{display:flex;align-items:flex-end;flex-direction:column;gap:9px;max-width:none;margin:0;flex:none}
.scene-start-actions>div{display:flex;align-items:center;gap:8px}
.scene-start-actions button{min-height:42px;padding:10px 16px;border-radius:7px;font-size:12px;display:flex;align-items:center;gap:7px}
.scene-start-actions button svg{width:15px;height:15px}
.scene-start-actions #resume-scene{background:transparent}
.scene-start-actions #new-scene-summary{font-size:10px;color:var(--muted);margin:0}
.starter-examples{border-top:1px solid var(--line);padding-top:22px;margin-top:0}
.template-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.template-heading h2{font-size:16px;letter-spacing:.2px;font-weight:550;display:flex;align-items:baseline;gap:10px;margin:0}
.template-heading h2 span{font-size:10px;color:var(--muted);font-weight:400;letter-spacing:1px}
.template-heading p{font-size:11px;color:var(--muted);margin:0;display:flex;gap:16px}
.template-heading p span::before{content:'·';color:var(--accent);margin-right:6px}
#template-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1px;gap:0 20px;margin:0;align-items:start}
.template-card{padding:0;min-width:0;grid-row-end:span 320;background:none;border:0;border-radius:0;overflow:visible;transition:none}
.template-card:hover{box-shadow:none;border:0}
.template-card-inner{border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden;transition:border-color .18s,box-shadow .18s}
.template-card-inner:hover{border-color:color-mix(in srgb,var(--accent) 65%,var(--line));box-shadow:0 10px 28px #00000018}
.template-poster{position:relative;display:block;overflow:hidden;width:100%;aspect-ratio:16/10;padding:0;border:0;border-radius:0;background:#dce0d7;min-height:0}
.template-poster.portrait{aspect-ratio:4/5}
.template-poster img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s}
.template-poster.portrait img{object-fit:contain;background:#dce0d7}
.template-poster:hover img{transform:scale(1.035)}
.template-category,.template-duration{position:absolute;top:12px;font-size:10px;letter-spacing:.2px;color:#f3f0e9;background:#24241ed9;border:1px solid #ffffff18;border-radius:4px;padding:4px 7px;pointer-events:none}
.template-category{left:12px}.template-duration{right:12px;font-variant-numeric:tabular-nums}
.template-play{position:absolute;bottom:12px;right:12px;height:34px;padding:0 11px 0 9px;border-radius:20px;display:flex;align-items:center;gap:5px;background:#f5f0e7ed;border:1px solid #ffffff70;color:#2b2822;box-shadow:0 2px 12px #0002;font-size:10px;transition:background .18s;pointer-events:none}
.template-play svg{width:15px;height:15px}
.template-poster:hover .template-play{background:#dfc6a3}
.template-card-content{padding:15px 15px 13px}
.template-card-content h3{font-size:14px;line-height:1.6;font-weight:550;letter-spacing:.1px;margin:0 0 14px}
.template-card-content h3 button{padding:0;min-height:0;background:none;border:0;border-radius:2px;font:inherit;line-height:inherit;text-align:left}
.template-card-content h3 button:hover{color:var(--accent)}
.template-card-actions{display:flex;align-items:center;gap:8px;justify-content:space-between}
.template-card-actions button{min-height:30px;font-size:10px;padding:5px 9px;display:flex;align-items:center;gap:5px;border-radius:5px}
.template-card-actions svg{width:12px;height:12px}
.template-detail{border-color:transparent;background:transparent;color:var(--muted);margin-left:-9px}
.template-make{background:var(--active);color:var(--accent);border-color:transparent}
.template-make:hover{border-color:var(--accent);background:var(--active)}
.gallery-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;border-top:1px solid var(--line);padding:18px 0 0;margin:10px 0 0;color:var(--muted);font-size:10px}
.gallery-foot>span:last-child{letter-spacing:2px;font-size:9px;opacity:.7}
#template-dialog{width:min(1160px,calc(100vw - 64px));max-width:none;max-height:calc(100dvh - 48px);padding:0;border-radius:14px;overflow:auto;background:var(--panel);box-shadow:0 32px 120px #0008}
#template-dialog::backdrop{background:#080807b8;backdrop-filter:blur(8px)}
.template-dialog-head{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid var(--line);gap:16px}
.template-dialog-head h2{font-size:18px;line-height:1.5;font-weight:550;letter-spacing:0;margin:0}
#template-dialog-meta{font-size:11px;color:var(--muted);margin-top:5px}
#close-template{position:static;width:32px;height:32px;flex:none;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center}
.template-dialog-main{display:flex;min-height:0;background:var(--bg)}
.template-video-wrap{min-width:0;flex:1;display:flex;align-items:center;justify-content:center;background:#10110f;padding:0}
#template-preview{display:block;width:100%;height:min(62dvh,610px);object-fit:contain;outline:none}
#template-dialog[data-ratio=portrait][data-mode=preview]{width:min(800px,calc(100vw - 64px))}
#template-dialog[data-ratio=portrait] #template-preview{height:min(68dvh,700px)}
#template-details-panel{width:285px;flex:none;padding:24px;background:var(--panel);overflow:auto}
.template-detail-eyebrow{color:var(--accent);font-size:10px;letter-spacing:1.5px}
#template-details-panel #template-original-name{font-size:16px;font-weight:550;line-height:1.6;margin:10px 0 24px;color:var(--text)}
#template-details-panel h3{font-size:11px;font-weight:500;margin:24px 0 12px;color:var(--muted)}
#template-beats{padding:0;list-style:none;display:grid;gap:13px;margin:0}
#template-beats li{font-size:12px;line-height:1.6;display:flex;gap:10px;align-items:baseline}
#template-beats span{font-size:10px;font-variant-numeric:tabular-nums;color:var(--accent)}
#template-edit-note{font-size:11px;line-height:1.85;color:var(--muted);margin:0 0 12px}
.template-license-link{font-size:10px;color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.template-dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding:14px 22px}
#template-playback-status{font-size:11px;color:var(--muted);line-height:1.6;margin-right:auto}
.template-dialog-footer>div{display:flex;gap:8px;flex:none;margin-left:auto}
.template-dialog-footer button{font-size:12px;min-height:37px;padding:8px 17px;border-radius:6px}
:root[data-theme=light] body:not(.editing){background:radial-gradient(ellipse at 82% 0%,#d9c5a72b,transparent 48%),var(--bg)}
@media(min-width:1800px){#welcome{max-width:1760px;padding-left:44px;padding-right:44px}}
@media(max-width:1350px){#template-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:920px){#welcome{padding:32px 22px 20px}body:not(.editing)>header{padding:0 22px}.scene-start-heading{gap:16px}.scene-start h1{font-size:32px}.scene-start-actions>div{flex-direction:column;align-items:stretch}.scene-start-actions button{min-height:36px;padding:8px 12px}.scene-start-heading p{font-size:12px}#template-options{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}.template-heading p{display:none}#template-details-panel{width:240px;padding:20px}.template-dialog-head h2{font-size:16px}}
@media(max-width:600px){body:not(.editing)>header{height:56px;padding:0 16px;flex-wrap:nowrap}body:not(.editing) .brand{width:auto;font-size:15px}body:not(.editing) .header-actions{display:flex;margin-left:auto}body:not(.editing) #restore{display:none}#welcome{padding:28px 16px 18px}.scene-start-heading{display:block;padding-bottom:25px}.scene-start h1{font-size:30px;letter-spacing:-1px}.scene-start-actions{align-items:stretch;margin-top:22px}.scene-start-actions>div{flex-direction:row}.scene-start-actions #new-scene-summary{display:none}.template-heading{margin-bottom:16px}#template-options{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:10px}.template-card-content{padding:10px}.template-card-content h3{font-size:12px;margin-bottom:10px}.template-card-actions{gap:2px;flex-wrap:wrap}.template-card-actions button{padding:5px;font-size:10px}.template-detail{margin-left:-5px}.template-category,.template-duration{top:7px;font-size:9px;padding:3px 5px}.template-category{left:7px}.template-duration{right:7px}.template-play{bottom:7px;right:7px;height:28px;padding:0 7px}.template-play span{display:none}.gallery-foot{font-size:9px}.gallery-foot>span:last-child{display:none}#template-dialog,#template-dialog[data-ratio=portrait][data-mode=preview]{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.template-dialog-head{padding:14px;gap:8px}.template-dialog-head h2{font-size:14px}#template-dialog-meta{font-size:10px}.template-dialog-main{display:block}#template-preview,#template-dialog[data-ratio=portrait] #template-preview{height:min(53dvh,480px)}#template-details-panel{width:auto;padding:18px}#template-original-name{margin-bottom:14px}#template-details-panel h3{margin-top:16px}.template-dialog-footer{padding:12px 14px;gap:8px;flex-wrap:wrap}.template-dialog-footer button{font-size:11px;padding:7px 12px}}
@media(prefers-reduced-motion:reduce){.template-poster img,.template-card-inner{transition:none}}