.export-body{min-height:100vh;background:radial-gradient(circle at 82% -8%,rgba(239,199,111,.12),transparent 30%),radial-gradient(circle at 12% 12%,rgba(76,119,191,.14),transparent 28%),linear-gradient(145deg,#060912,#0a1020 50%,#070b14);}
.export-shell{max-width:1720px;margin:0 auto;padding:22px}.export-topbar{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 4px 18px;border-bottom:1px solid var(--line)}.soft-title{font-weight:450;color:#9da9bf;font-size:.78em;margin-left:7px}.top-select{width:auto;min-width:180px;padding:9px 10px}
.export-layout{display:grid;grid-template-columns:minmax(620px,.92fr) minmax(620px,1.08fr);gap:20px;padding-top:20px}.export-controls{display:flex;flex-direction:column;gap:15px}.step-card,.asset-panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(17,25,45,.95),rgba(8,13,25,.96));border-radius:18px;box-shadow:var(--shadow);padding:19px}.step-head{display:flex;align-items:center;gap:13px;margin-bottom:16px}.step-head>span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(145deg,rgba(239,199,111,.14),rgba(239,199,111,.03));border:1px solid rgba(239,199,111,.26);color:var(--gold);font-weight:850;font-size:12px}.export-grid{margin-top:10px}.inline-fields{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}.inline-fields>span{color:var(--muted);font-weight:600}.mini-notice{margin:12px 0;padding:10px 11px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.025);font-size:10.5px;line-height:1.55;color:#929fb5}.mini-notice.good{color:#a5e8cb;border-color:rgba(80,211,154,.2)}.mini-notice.bad{color:#ff9ba7;border-color:rgba(255,60,79,.2)}.full{width:100%;margin-top:11px}.reading-summary{margin-top:11px;color:#b3bfd3;font-size:11px;line-height:1.55}.advanced{margin-top:11px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(0,0,0,.12);padding:10px 12px}.advanced summary{cursor:pointer;color:#aab5c8;font-size:11px;font-weight:750}.advanced .inner{margin-top:12px}
.media-upload-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}.media-drop{position:relative;display:flex;min-height:95px;flex-direction:column;justify-content:center;gap:6px;padding:13px;border:1px dashed rgba(239,199,111,.28);border-radius:12px;background:linear-gradient(145deg,rgba(239,199,111,.035),rgba(255,255,255,.015));cursor:pointer}.media-drop strong{font-size:11px;color:#f4e3b5}.media-drop span{font-size:9px;line-height:1.4;color:#8290a8}.media-drop input{position:absolute;inset:0;opacity:0;cursor:pointer}.check-field{display:flex;align-items:center;gap:8px;padding:11px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:#0a1020;color:#c7d0e2;font-size:11px;font-weight:700}.check-field input{width:auto}.render-card{border-color:rgba(239,199,111,.22);box-shadow:0 22px 70px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.025)}.render-btn{width:100%;margin-top:17px;padding:16px;border:1px solid #f2d184;border-radius:13px;background:linear-gradient(135deg,#9d772d,#d6ad55 50%,#f0d685);color:#171109;font-weight:900;letter-spacing:.11em;box-shadow:0 12px 32px rgba(209,164,69,.18);transition:.18s ease}.render-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 40px rgba(209,164,69,.28)}.render-btn:disabled{opacity:.38;cursor:not-allowed}.render-btn span{margin-right:7px}.render-progress{height:8px;margin-top:14px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden}.render-progress>div{height:100%;width:0;background:linear-gradient(90deg,#c59b42,#ffe39a);transition:width .25s}.render-status{margin-top:8px;color:#93a0b9;font-size:10.5px}.download-area{display:flex;flex-wrap:wrap;gap:8px;margin-top:11px}.download-area:empty{display:none}.download-area a{display:inline-flex;padding:9px 11px;border-radius:9px;border:1px solid rgba(80,211,154,.23);background:rgba(80,211,154,.06);color:#a9e7cd;text-decoration:none;font-size:10px;font-weight:800}
.export-preview-col{min-width:0}.sticky-preview{position:sticky;top:18px;display:flex;flex-direction:column;gap:15px}.preview-head,.asset-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.preview-head{margin-bottom:10px}.preview-head>span{padding:7px 9px;border-radius:999px;border:1px solid rgba(239,199,111,.18);background:rgba(239,199,111,.05);color:var(--gold);font-size:9px;font-weight:800}.design-preview{--preview-gold:#f0cf78;position:relative;overflow:hidden;width:100%;aspect-ratio:16/9;border-radius:18px;border:1px solid rgba(239,199,111,.24);box-shadow:0 26px 80px rgba(0,0,0,.44);background:radial-gradient(circle at 76% 18%,rgba(237,196,104,.19),transparent 26%),linear-gradient(145deg,#07101f,#0c1a30 54%,#050a12);isolation:isolate}.design-preview.ratio-vertical{aspect-ratio:9/16;max-height:68vh;width:auto;max-width:100%;margin:0 auto}.design-preview.ratio-square{aspect-ratio:1/1}.design-preview.theme-midnight{background:radial-gradient(circle at 75% 20%,rgba(89,137,210,.18),transparent 27%),linear-gradient(145deg,#02050c,#071327 55%,#020711)}.design-preview.theme-sunrise{background:radial-gradient(circle at 82% 20%,rgba(255,225,169,.32),transparent 27%),linear-gradient(155deg,#13111d,#3a2740 46%,#17111d)}.design-preview>img#previewImage,.design-preview>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}.preview-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(2,6,14,.42),rgba(2,6,14,.58)),radial-gradient(circle at 50% 42%,transparent,rgba(0,0,0,.4));}.preview-headline{position:absolute;top:7%;left:7%;right:7%;display:flex;align-items:center;justify-content:space-between;gap:12px}.preview-headline span{font-size:clamp(7px,.65vw,11px);letter-spacing:.23em;color:#aab5c7}.preview-headline strong{font:700 clamp(13px,1.8vw,31px)/1 Georgia,serif;color:#efd085;letter-spacing:.06em;text-align:right}.preview-scripture{position:absolute;left:10%;right:10%;top:28%;bottom:18%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.preview-scripture p{font:500 clamp(17px,2.65vw,48px)/1.36 Georgia,serif;text-shadow:0 3px 16px rgba(0,0,0,.7);max-width:100%}.preview-scripture p .demo-gold{color:var(--preview-gold);text-shadow:0 0 16px rgba(240,207,120,.26)}.preview-scripture b{margin-top:5%;font:600 clamp(8px,.85vw,14px)/1 Georgia,serif;letter-spacing:.18em;color:#ecd18b}.preview-footer{position:absolute;left:5%;right:5%;bottom:5%;display:flex;justify-content:space-between;gap:15px;color:#8794aa;font-size:clamp(6px,.48vw,9px);letter-spacing:.06em}.preview-logo{position:absolute;z-index:3;max-width:14%;max-height:14%;object-fit:contain;filter:drop-shadow(0 5px 14px rgba(0,0,0,.45))}.preview-logo.top-right{top:6%;right:6%}.preview-logo.top-left{top:6%;left:6%}.preview-logo.bottom-right{bottom:8%;right:6%}.preview-logo.bottom-left{bottom:8%;left:6%}
.asset-panel{padding:15px}.asset-head{margin-bottom:12px}.media-library,.export-history{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:260px;overflow:auto}.media-item,.history-item{display:flex;align-items:center;gap:9px;min-width:0;padding:9px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.025)}.media-thumb{width:48px;height:38px;border-radius:7px;object-fit:cover;background:#050914}.media-icon{width:48px;height:38px;display:grid;place-items:center;border-radius:7px;background:#0c1424;color:var(--gold);font-size:16px}.media-item>div,.history-item>div{min-width:0;flex:1}.media-item strong,.history-item strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.media-item small,.history-item small{display:block;margin-top:3px;color:#758299;font-size:8.5px}.media-item button{border:0;background:transparent;color:#7f8ba0;font-size:13px}.history-links{display:flex;gap:5px;margin-top:5px}.history-links a{font-size:8px;color:#d9bd77;text-decoration:none}.history-item.rendering{border-color:rgba(239,199,111,.2)}.history-item.failed{border-color:rgba(255,60,79,.2)}
@media(max-width:1180px){.export-layout{grid-template-columns:1fr}.sticky-preview{position:static}.export-preview-col{order:-1}.design-preview{max-width:900px;margin:0 auto}}@media(max-width:760px){.export-shell{padding:12px}.export-topbar{align-items:flex-start;flex-direction:column}.media-upload-grid,.grid.two,.grid.three{grid-template-columns:1fr}.media-library,.export-history{grid-template-columns:1fr}.design-preview{border-radius:13px}.preview-footer{display:none}}


/* Keep Export Studio's canvas visually aligned with the live broadcast overlay. */
.preview-live{position:absolute;top:6%;left:4%;z-index:4;display:flex;align-items:center;gap:.45em;padding:.55em .75em;border:1px solid rgba(255,126,138,.8);border-radius:5px;background:linear-gradient(180deg,#d82338,#a70f25);box-shadow:0 0 1.2em rgba(255,42,66,.28);color:#fff;font-size:clamp(7px,.75vw,12px);font-weight:850;letter-spacing:.06em}.preview-live span{width:.55em;height:.55em;border-radius:50%;background:#fff;box-shadow:0 0 .5em rgba(255,255,255,.8)}
.preview-sky-glow{position:absolute;right:-12%;top:-24%;z-index:-1;width:64%;height:66%;background:radial-gradient(ellipse at center,rgba(255,221,147,.33),rgba(200,143,55,.08) 38%,transparent 70%);filter:blur(5px)}.preview-stars{position:absolute;inset:0;z-index:-1;opacity:.6;background-image:radial-gradient(circle at 16% 18%,rgba(255,226,156,.8) 0 1px,transparent 2px),radial-gradient(circle at 64% 23%,rgba(255,255,255,.5) 0 1px,transparent 2px),radial-gradient(circle at 78% 61%,rgba(255,218,128,.65) 0 2px,transparent 3px),radial-gradient(circle at 35% 67%,rgba(255,255,255,.35) 0 1px,transparent 2px)}
.preview-cross{position:absolute;right:10%;top:17%;z-index:-1;color:rgba(3,5,10,.72);font:700 clamp(110px,16vw,260px)/.8 Georgia,serif;text-shadow:0 0 1.2em rgba(255,211,125,.12)}.preview-bible{position:absolute;left:-5%;bottom:4%;z-index:-1;width:38%;height:28%;transform:rotate(-5deg);opacity:.18;filter:blur(.3px);background:linear-gradient(135deg,rgba(255,245,215,.7),rgba(125,115,95,.16));border:1px solid rgba(255,255,255,.15);box-shadow:inset 0 0 26px rgba(0,0,0,.4)}
.preview-headline{top:6%;left:4%;right:4%;z-index:3;display:block;text-align:center}.preview-headline span{position:absolute;top:0;right:0;font-size:clamp(6px,.48vw,9px);letter-spacing:.25em;color:#f2d891}.preview-headline strong{display:block;font-size:clamp(15px,2.4vw,38px);line-height:1;color:#f5d483;text-align:center}.preview-subtitle{position:absolute;top:15%;left:0;right:0;z-index:3;color:#eef2f8;font:600 clamp(7px,.7vw,12px)/1 Georgia,serif;letter-spacing:.48em;text-align:center}.preview-side{position:absolute;z-index:3;color:#a4adbe;font-size:clamp(5px,.43vw,8px);line-height:2.05;letter-spacing:.35em}.preview-side-left{left:4%;top:25%;padding-left:1em;border-left:2px solid #d5ad52}.preview-side-right{right:4%;top:51%;color:#9aa4b6}.preview-side small{display:block;margin-top:.4em;color:#d8b968;font-size:.8em;letter-spacing:.25em}.preview-side i{display:block;width:3em;height:1px;margin-top:1em;background:#caa247}.preview-progress{position:absolute;left:4%;right:4%;bottom:11%;z-index:3;height:2px;border-radius:99px;background:rgba(214,224,240,.28);overflow:hidden}.preview-progress div{width:21%;height:100%;background:linear-gradient(90deg,#ffe596,#d2a443);box-shadow:0 0 1em rgba(239,199,111,.45)}.preview-footer{left:4%;right:4%;bottom:3.5%;z-index:3;display:flex;align-items:end;justify-content:space-between;gap:12px;color:#aeb7c6;font-size:clamp(5px,.42vw,8px);letter-spacing:.18em}.preview-footer>div{display:flex;flex-direction:column;gap:3px}.preview-footer strong{font-size:1em;font-weight:500}.preview-footer small{color:#778397;font-size:.78em;letter-spacing:.13em}.preview-footer>span{color:#aeb7c6}.preview-scripture{z-index:2}.preview-scripture b{margin-top:4%;font-size:clamp(7px,.72vw,12px)}