.demo-stage{position:relative;aspect-ratio:16/9;width:100%;overflow:hidden;border-radius:16px;background:#282338;margin:18px 0;isolation:isolate}.demo-stage>img{position:absolute;width:100%;height:100%;inset:0}.demo-drag{position:absolute!important;min-width:0!important;min-height:0!important;padding:0!important;touch-action:none;cursor:move;border:2px solid #bc9bff!important;border-radius:8px;background:#ffffffeb;background-size:contain;background-repeat:no-repeat;background-position:center;color:#32274f;font-size:clamp(8px,1vw,15px);z-index:3}.demo-titles{position:absolute;top:48%;width:100%;text-align:center;color:white;pointer-events:none}.demo-titles b{font-size:clamp(12px,2vw,30px)}.demo-titles p{color:#eee}.demo-titles span{background:#d23e87;padding:8px 18px;border-radius:20px}.video-label{position:absolute;bottom:10px;left:10px;color:#fff;font-size:12px}.editor-hint{color:#82758e;font-size:13px;line-height:1.6}.frame-order,.qr-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.frame-qr{position:absolute;z-index:5;min-height:0!important;min-width:0!important;padding:0!important;background:white!important;color:#181326!important;border:2px solid #181326!important;border-radius:0;touch-action:none;cursor:move;font-size:clamp(8px,1vw,14px)}.capture-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.capture-modes button{padding:18px;text-align:left;white-space:normal;border:1px solid #e8dfee;background:#fff}.capture-modes b,.capture-modes small{display:block}.capture-modes small{margin-top:8px;color:#81718d;line-height:1.5}.capture-modes button.selected{border:2px solid #9461eb;background:#f5eefe}.demo-person{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:clamp(44px,6vw,72px);color:#c7bbc9;background:radial-gradient(ellipse at center,rgba(105,98,116,0.35) 0%,rgba(35,29,46,0.92) 75%);pointer-events:none}.demo-person small{display:block;font-size:11px;font-weight:600;letter-spacing:1px;margin-top:6px;color:#b3a6c8}.demo-countdown{position:absolute!important;left:50%!important;top:46%!important;transform:translate(-50%,-50%)!important;font-size:clamp(32px,5vw,68px);color:white;font-weight:bold;text-align:center!important;pointer-events:none!important;z-index:6!important;line-height:1!important}.demo-layout{white-space:pre-line;background-color:#ece7f7;line-height:2.5;z-index:4}.slot-details[hidden],[data-pane="layout"] #autoSlots[hidden],.bundle-setting[hidden]{display:none!important}#bundleLayouts .layout-choice{min-width:140px}.qr-tools input[type=number]{width:110px}.welcome-demo{max-height:550px}#bundle-welcome details{margin-top:14px}@media(max-width:700px){.capture-modes{grid-template-columns:1fr}.capture-modes button{padding:12px}.demo-titles p{font-size:10px;margin:3px}.demo-titles span{font-size:9px;padding:4px 9px}.qr-tools{display:block}.frame-order button{flex:1}.demo-stage{border-radius:9px}}
.welcome-object-tabs{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:14px 0}.welcome-object-tabs button{min-height:40px}.welcome-demo .editing{outline:3px solid #ffcd61;outline-offset:3px}.welcome-controls{display:block!important}.welcome-controls .bundle-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.welcome-controls .bundle-setting{border:1px solid #eee3f1;border-radius:12px;padding:12px;background:#fcfaff;min-width:0}.welcome-controls input{min-width:0;width:100%;font-size:14px}.step-buttons{display:flex;gap:6px;margin-top:6px}.step-buttons button{flex:1;min-height:34px;padding:4px}.welcome-demo{position:sticky;top:0;z-index:4;box-shadow:0 4px 18px #20132a20;max-height:none;aspect-ratio:16/9}.welcome-controls summary{font-weight:700;padding:14px}#slots{display:none!important}@media(max-width:750px){.welcome-controls .bundle-settings{grid-template-columns:repeat(2,minmax(0,1fr))}.welcome-demo{position:relative}.welcome-object-tabs b{width:100%}}@media(max-width:420px){.welcome-controls .bundle-settings{grid-template-columns:1fr}}
.welcome-demo{position:relative;max-width:760px;margin-left:auto;margin-right:auto}.welcome-controls .bundle-setting input[type=checkbox]{width:20px}.welcome-controls .step-buttons button{font-size:18px}
[data-pane="welcome"] .panel-card{overflow:visible}.welcome-demo{display:block!important;position:relative!important;width:100%!important;max-width:100%!important;aspect-ratio:16/9!important;height:auto!important;max-height:none!important;min-height:unset!important;margin:12px 0!important;background:#FFF9F6!important;border:1.5px solid #e2e8f0!important;border-radius:16px!important;box-shadow:0 4px 20px rgba(0,0,0,0.06)!important;overflow:hidden!important}.welcome-demo .demo-drag{display:block;z-index:5;min-width:24px!important;min-height:24px!important}.welcome-demo .demo-drag[hidden]{display:none!important}.welcome-object-tabs{position:relative;z-index:6}.welcome-demo::after{display:none!important}.video-label{display:none!important}.welcome-demo .demo-titles{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;text-align:center;color:#0f172a;pointer-events:none;z-index:2}.welcome-demo .demo-titles b{display:block;font-size:clamp(18px,3.5vw,44px);font-weight:800;color:#0f172a;letter-spacing:-0.5px}.welcome-demo .demo-titles p{font-size:clamp(12px,1.8vw,20px);color:#475569;font-weight:600;margin:8px 0 16px 0}.welcome-demo .demo-titles span{display:inline-block;background:linear-gradient(135deg,#ec4899 0%,#8b5cf6 100%);color:#ffffff;padding:10px 28px;border-radius:999px;font-weight:800;font-size:clamp(11px,1.4vw,16px);box-shadow:0 6px 20px rgba(236,72,153,0.35);letter-spacing:0.5px;text-transform:uppercase}.welcome-controls{margin-top:22px}#demoAdmin.demo-drag{border-radius:50%!important;background:rgba(255,255,255,0.92)!important;backdrop-filter:blur(8px)!important;border:1.5px solid #cbd5e1!important;box-shadow:0 4px 12px rgba(0,0,0,0.1)!important;color:#475569!important;display:flex!important;align-items:center!important;justify-content:center!important}#demoAlbum.demo-drag{border-radius:8px!important;background:#ffffff!important;border:1px solid #e2e8f0!important;box-shadow:0 8px 24px rgba(0,0,0,0.12)!important;color:#0f172a!important;font-weight:700!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}

/* Extra shots stepper inline */
.extra-shots-stepper{display:none;align-items:center;justify-content:space-between;margin-top:12px;padding:6px 12px;background:#f0e6ff;border-radius:8px;border:1px solid #d8b4fe}
.extra-shots-stepper .stepper-title{font-size:13px;font-weight:600;color:#4c1d95}
.extra-shots-stepper .stepper-controls{display:inline-flex;align-items:center;gap:8px}
.extra-shots-stepper .step-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:#7c3aed;color:#fff;border-radius:6px;font-weight:bold;font-size:16px;cursor:pointer;user-select:none;transition:transform .1s,background .15s}
.extra-shots-stepper .step-btn:hover{background:#6d28d9}
.extra-shots-stepper .step-btn:active{transform:scale(0.92)}
.extra-shots-stepper .step-count{font-size:15px;font-weight:800;color:#3b0764;min-width:20px;text-align:center}

/* Live View Enlarged Stage */
.liveview-demo-large,[data-pane="capture"] .capture-demo{width:100%!important;max-width:100%!important;aspect-ratio:16/9!important;height:auto!important;max-height:none!important;min-height:unset!important;margin:12px 0!important;box-shadow:0 8px 30px rgba(0,0,0,0.25);border-radius:16px}
.liveview-editor-panel .toolbar{display:flex;justify-content:space-between;align-items:center}
.liveview-tag{background:#eef2ff;color:#4338ca;font-size:12px;font-weight:600;padding:4px 10px;border-radius:9999px;border:1px solid #c7d2fe}

/* 3 Countdown Number Styles */
.demo-countdown{transition:all .15s ease}
.demo-countdown.cd-transparent-outline{color:transparent!important;-webkit-text-stroke:3.5px #ffffff;text-stroke:3.5px #ffffff;text-shadow:0 0 14px rgba(0,0,0,0.8);font-size:clamp(36px,6vw,72px)!important;font-weight:900!important}
.demo-countdown.cd-solid-white{color:#ffffff!important;-webkit-text-stroke:0!important;text-shadow:0 2px 14px rgba(0,0,0,0.85);font-size:clamp(36px,6vw,72px)!important;font-weight:900!important}
.demo-countdown.cd-solid-black{color:#111111!important;-webkit-text-stroke:0!important;text-shadow:0 0 10px rgba(255,255,255,0.9),0 0 4px rgba(255,255,255,0.95);font-size:clamp(36px,6vw,72px)!important;font-weight:900!important}

/* Live View Controls & Countdown Style Picker */
.liveview-options-bar{display:grid;grid-template-columns:1fr 1.2fr;gap:20px;margin-top:18px;padding:18px;background:#f8f7fb;border-radius:14px;border:1px solid #ede8f5}
@media(max-width:860px){.liveview-options-bar{grid-template-columns:1fr}}
.liveview-option-block{display:flex;flex-direction:column;gap:10px}
.opt-label{font-size:13px;font-weight:700;color:#374151}
.countdown-style-selector{display:flex;gap:8px;flex-wrap:wrap}
.cd-style-btn{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1.5px solid #e5e7eb;border-radius:9px;background:#fff;cursor:pointer;font-size:13px;font-weight:500;color:#4b5563;transition:all .15s ease}
.cd-style-btn:hover{border-color:#a78bfa;background:#faf5ff}
.cd-style-btn.selected{border-color:#7c3aed;background:#f5f3ff;color:#6d28d9;font-weight:700;box-shadow:0 0 0 2px rgba(124,58,237,0.15)}
.cd-badge{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:#1f2937;font-weight:900;font-size:16px}
.cd-badge-outline{color:transparent;-webkit-text-stroke:1.5px #ffffff}
.cd-badge-white{color:#ffffff}
.cd-badge-black{background:#f3f4f6;color:#000000;border:1px solid #d1d5db}

/* Layout Preview Controls */
.liveview-layout-config{display:flex;flex-direction:column;gap:10px}
.layout-toggle-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.liveview-switch{display:inline-flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;user-select:none}
.liveview-switch input[type=checkbox]{width:18px;height:18px;accent-color:#7c3aed;cursor:pointer}
.link-btn{background:transparent;border:none;color:#6366f1;font-size:12px;font-weight:600;cursor:pointer;padding:4px 6px;border-radius:4px}
.link-btn:hover{background:#eef2ff}
.layout-selects-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;transition:opacity .2s}
@media(max-width:600px){.layout-selects-row{grid-template-columns:1fr}}
.layout-selects-row label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#6b7280;font-weight:600}
.layout-selects-row select{padding:6px 8px;border:1px solid #d1d5db;border-radius:6px;background:#fff;font-size:13px;color:#1f2937}

