:root{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:#0b0e14;color:#eef2f8}*{box-sizing:border-box}body{margin:0;background:#0b0e14;color:#eef2f8}a{color:#8bb8ff;text-decoration:none}.top{height:64px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;background:#111620;border-bottom:1px solid #252c38;position:sticky;top:0;z-index:10}.top nav{display:flex;gap:18px}.wrap{max-width:1200px;margin:auto;padding:28px 18px}.hero{padding:30px 0}.hero h1{font-size:38px;margin:0 0 8px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}.card{background:#141a24;border:1px solid #252d3a;border-radius:16px;overflow:hidden;color:inherit}.cover{aspect-ratio:3/5;background-size:cover;background-position:center}.pad{padding:14px}.pad h3{margin:0 0 6px}.panel{background:#111720;border:1px solid #273040;border-radius:16px;padding:18px}.auth{min-height:100vh;display:grid;place-items:center;padding:20px}.auth .panel{width:min(420px,100%)}label{display:block;font-size:13px;color:#aab4c4;margin:12px 0}input,textarea,select{width:100%;margin-top:6px;background:#0c1118;color:#eef2f8;border:1px solid #303a4a;border-radius:9px;padding:11px;font:inherit}textarea{min-height:90px;resize:vertical}button,.button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:10px;padding:11px 16px;background:#4f8cff;color:white;font-weight:700;cursor:pointer}.button{color:white}.secondary{background:#263143}.danger{color:#ff8e8e!important}.link{background:none;padding:0;color:#8bb8ff;font-weight:500}.toolbar,.actions,.row{display:flex;gap:10px;align-items:center}.toolbar{justify-content:space-between;margin-bottom:18px}.row>*{flex:1}.row.four>*{min-width:0}.check{display:flex;align-items:center;gap:7px;white-space:nowrap}.check input{width:auto;margin:0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;background:#111720}th,td{padding:13px;border-bottom:1px solid #293241;text-align:left;white-space:nowrap}.badge{padding:4px 8px;border-radius:999px;font-size:12px;background:#333}.badge.published{background:#164d36;color:#9af0c2}.badge.draft{background:#443a1b;color:#ffe3a0}.muted{color:#8e99aa}.notice{background:#173d2a;padding:10px;border-radius:9px;margin-bottom:12px}.err{background:#4a2020;padding:10px;border-radius:9px;margin-bottom:12px}.empty{padding:40px;color:#8e99aa}.editor-grid,.generator-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:18px}.item{padding:12px;background:#0d131b;border:1px solid #283140;border-radius:10px;margin-bottom:10px}.item .row{margin:0 0 6px}.jsonbox{min-height:500px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:12px}.preview{width:min(100%,360px);height:auto;background:#000;border-radius:12px;display:block;margin:auto}.upload-item{padding:12px;border:1px solid #293342;border-radius:10px;margin-bottom:10px;background:#0d131b}.progress{height:8px;background:#1d2530;border-radius:99px;overflow:hidden;margin:16px 0}.progress:after{content:"";display:block;height:100%;width:var(--p,0%);background:#4f8cff}.hidden{display:none!important}.generator canvas{width:100%;max-height:72vh;object-fit:contain;background:#000;border-radius:14px}.generator-grid{align-items:start}@media(max-width:800px){.editor-grid,.generator-grid{grid-template-columns:1fr}.hero h1{font-size:30px}.top{padding:0 14px}.top nav{gap:10px}.row{flex-wrap:wrap}.row>*{min-width:120px}}

.preview-controls{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:12px auto 0}.preview-controls button{min-width:130px}.preview-controls .muted{min-width:95px;text-align:center}
.upload-box{padding:12px;border:1px dashed #39465a;border-radius:12px;background:#0d131b;margin:8px 0 16px}.admin-video-preview{width:min(100%,360px);max-height:520px;display:block;margin-top:12px;border-radius:12px;background:#000}.admin-audio-preview{width:min(100%,520px);display:block;margin-top:12px}
/* CapCut-style public template discovery */
.discover-page{background:#090b10}.discover-top{position:sticky;top:0}.discover-wrap{max-width:980px;margin:auto;padding:18px 14px 50px}.discover-hero{padding:10px 2px 20px}.discover-hero h1{font-size:30px;margin:0 0 5px}.discover-hero p{margin:0;color:#8e99aa;font-size:14px}.template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.template-card{min-width:0;background:#12161f;border:1px solid #222a36;border-radius:14px;overflow:hidden;cursor:pointer}.template-media{position:relative;aspect-ratio:9/16;background:#000;overflow:hidden}.template-media .cover,.grid-video{width:100%;height:100%;object-fit:cover;display:block}.grid-play{position:absolute;left:10px;bottom:10px;width:36px;height:36px;padding:0;border-radius:50%;background:rgba(0,0,0,.58);backdrop-filter:blur(6px);font-size:14px}.template-duration{position:absolute;right:9px;top:9px;padding:4px 7px;border-radius:8px;background:rgba(0,0,0,.55);font-size:11px}.template-card-info{padding:10px 11px 12px}.template-card-info h3{font-size:15px;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.template-card-info span{display:block;color:#8792a3;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.viewer-open{overflow:hidden}.template-viewer{position:fixed;inset:0;z-index:100;background:#000;display:none;overflow:hidden;touch-action:none}.template-viewer.open{display:block}.viewer-stage{position:absolute;inset:0;display:grid;place-items:center}.viewer-card{height:100%;width:min(100vw,calc(100vh * 9 / 16));position:relative;background:#000}.viewer-video,.viewer-cover{width:100%;height:100%;object-fit:cover;display:block}.viewer-top{position:absolute;z-index:3;top:0;left:0;right:0;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(rgba(0,0,0,.55),transparent);font-size:13px}.viewer-icon{width:42px;height:42px;padding:0;border-radius:50%;background:rgba(0,0,0,.38);backdrop-filter:blur(8px);font-size:20px}.viewer-bottom{position:absolute;z-index:4;left:0;right:0;bottom:0;padding:18px 18px 22px;display:flex;align-items:end;justify-content:space-between;gap:12px;background:linear-gradient(transparent,rgba(0,0,0,.85));pointer-events:none}.viewer-bottom>div{min-width:0;display:flex;flex-direction:column;gap:5px}.viewer-bottom strong{font-size:18px}.viewer-bottom span{font-size:13px;color:#d1d7e0;max-width:58vw}.use-template-btn{pointer-events:auto;flex:0 0 auto;background:#fff;color:#111;padding:12px 16px;border-radius:11px;font-weight:800}.viewer-bottom a{text-decoration:none}.upload-box{padding:12px;border:1px dashed #39465a;border-radius:12px;background:#0d131b;margin:8px 0 16px}.admin-video-preview{width:min(100%,360px);max-height:520px;display:block;margin-top:12px;border-radius:12px;background:#000}.admin-audio-preview{width:min(100%,520px);display:block;margin-top:12px}@media(max-width:520px){.discover-wrap{padding-left:10px;padding-right:10px}.template-grid{gap:8px}.template-card{border-radius:11px}.template-card-info{padding:8px}.template-card-info h3{font-size:14px}.viewer-bottom{padding:14px 12px 18px}.viewer-bottom strong{font-size:16px}.viewer-bottom span{max-width:48vw}.use-template-btn{padding:11px 12px;font-size:13px}}

.material-symbols-rounded{font-family:'Material Symbols Rounded';font-weight:normal;font-style:normal;font-size:22px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-feature-settings:'liga';font-variation-settings:'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24}.grid-play,.viewer-icon{display:inline-flex;align-items:center;justify-content:center}.preview-controls button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.preview-controls .material-symbols-rounded{font-size:20px}
