.svg-app{--ink:#17202a;--muted:#65717d;--line:#dfe5e9;--accent:#e7a83b;--soft:#fffaf0;--paper:#f6f2ea;font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);max-width:1120px;margin:30px auto;padding:22px}.svg-hero{background:linear-gradient(135deg,#17202a,#2f3f48);color:#fff;border-radius:24px;padding:42px 44px;margin-bottom:20px}.svg-hero h2,.svg-output h3,.svg-history-head h3{font-family:Fraunces,Georgia,serif;letter-spacing:-.025em}.svg-kicker{font-size:11px;letter-spacing:.15em;font-weight:800;color:#f28a70}.svg-hero h2{font-size:clamp(30px,4vw,54px);line-height:1.02;max-width:730px;margin:12px 0;color:#fff!important;-webkit-text-fill-color:#fff!important}.svg-hero p{color:#d8e0e3!important;-webkit-text-fill-color:#d8e0e3!important;max-width:640px;font-size:17px}.svg-hero .svg-kicker{color:#f28a70!important;-webkit-text-fill-color:#f28a70!important}.svg-grid{display:grid;grid-template-columns:360px 1fr;gap:20px;align-items:start}.svg-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 12px 30px rgba(23,32,42,.06)}.svg-card label,.svg-label{display:block;font-weight:700;font-size:13px;margin-bottom:16px}.svg-card input,.svg-card textarea,.svg-card select{width:100%;box-sizing:border-box;border:1px solid #cfd8dd;border-radius:10px;padding:11px;margin-top:7px;font:inherit;color:var(--ink);background:#fff}.svg-card textarea{min-height:108px;resize:vertical}.svg-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.svg-button{border:0;border-radius:999px;background:var(--accent);color:#fff;padding:13px 18px;font-weight:800;cursor:pointer;transition:.18s transform,.18s opacity}.svg-button:hover{transform:translateY(-1px);opacity:.92}.svg-button:disabled{opacity:.55;cursor:wait}.svg-button.small{padding:10px 14px;font-size:12px}.svg-status{min-height:20px;margin-top:12px;font-size:13px;color:var(--muted)}.svg-status.is-error,.svg-error{color:#b52e20}.svg-empty,.svg-loading{color:var(--muted);padding:40px 10px;text-align:center}.svg-output-head{display:flex;gap:15px;justify-content:space-between;align-items:start}.svg-output h3{margin:5px 0 16px;font-size:26px}.svg-hook{background:var(--soft);border-left:4px solid var(--accent);padding:14px 16px;border-radius:8px;font-weight:700}.svg-scenes{display:grid;gap:12px}.svg-scene{border:1px solid var(--line);border-radius:14px;padding:14px}.svg-scene-top{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.svg-scene-top span{color:var(--muted);font-size:12px;flex:1}.svg-scene-top button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 11px;cursor:pointer;font-weight:700;font-size:12px}.svg-scene p{font-size:13px;margin:10px 0}.svg-media{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:10px;overflow:visible;width:100%}.svg-clip{min-width:0;width:100%;border:2px solid transparent;background:#f4f6f7;border-radius:10px;padding:4px;cursor:pointer;text-align:left}.svg-clip.selected{border-color:var(--accent);box-shadow:0 0 0 2px rgba(231,168,59,.12)}.svg-clip img{display:block;width:100%;height:138px;object-fit:cover;border-radius:7px}.svg-clip span{display:block;padding:5px 2px;font-size:10px;color:var(--muted)}.svg-cta{margin-top:16px;padding:14px;background:#eef8f5;border-radius:10px;font-size:13px}.svg-audio{margin-top:16px;padding:14px;background:#f4f6f7;border-radius:10px;display:grid;gap:10px}.svg-audio audio{width:100%}.svg-download{color:var(--accent);font-weight:800;text-decoration:none;font-size:13px}.svg-note{margin-top:12px;color:var(--muted);font-size:12px}.svg-label textarea{min-height:140px}@media(max-width:800px){.svg-grid{grid-template-columns:1fr}.svg-hero{padding:30px 24px}.svg-app{padding:10px}.svg-output-head{display:block}.svg-output-head .svg-button{margin-bottom:15px}.svg-options{grid-template-columns:1fr}.svg-media{grid-template-columns:repeat(3,minmax(0,1fr))}.svg-clip img{height:110px}}

:root{--svg-ease:cubic-bezier(.23,1,.32,1)}.svg-app{--svg-ease:var(--svg-ease)}.svg-actions{display:flex;gap:8px;flex-wrap:wrap}.svg-button.dark{background:#17202a}.svg-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}.svg-options label{font-size:12px;font-weight:800}.svg-options input{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:10px;border:1px solid #cfd8dd;border-radius:9px;font:inherit}.svg-help{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:4px}.svg-caption-edit{margin:8px 0}.svg-caption-edit input{width:100%;box-sizing:border-box;border:1px solid #d8e0e3;border-radius:8px;padding:8px;font:inherit;font-size:13px}.svg-final{margin-top:16px;padding:16px;border-radius:14px;background:#17202a;color:#fff}.svg-final h4{margin:0 0 12px;color:#fff!important;-webkit-text-fill-color:#fff!important}.svg-final video{display:block;width:230px;max-width:100%;max-height:420px;margin:auto;border-radius:10px;background:#000}.download-video{display:block;width:max-content;margin:14px auto 0;text-decoration:none}.svg-final .svg-note{color:#cbd5d9}

.svg-segment-note{color:var(--muted);font-style:italic;margin:-4px 0 8px}

.svg-subhead{color:var(--muted);font-size:14px;max-width:650px;margin-top:-8px}
.svg-angle{margin:0;color:var(--muted);font-size:13px}
.svg-angle b{color:var(--ink)}
.svg-hook span{display:block;font-size:10px;letter-spacing:.12em;color:var(--accent);font-weight:900;margin-bottom:5px}
.svg-topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}
.svg-topic{position:relative;text-align:left;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;cursor:pointer;min-height:170px;transition:transform .18s var(--svg-ease),box-shadow .18s var(--svg-ease),border-color .18s var(--svg-ease),background-color .18s var(--svg-ease);overflow:hidden}.svg-topic:focus-visible,.svg-history-close:focus-visible,.svg-history-item .svg-button:focus-visible{outline:3px solid rgba(231,168,59,.42);outline-offset:3px}.svg-topic:active{transform:scale(.985)}
.svg-topic:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(23,32,42,.09);border-color:#bcc8ce}
.svg-topic.selected{border-color:var(--accent);background:#fffaf0;box-shadow:0 0 0 3px rgba(231,168,59,.18),0 12px 28px rgba(23,32,42,.08)}.svg-topic.selected .svg-topic-arrow{color:var(--accent)}
.svg-topic-num{position:absolute;right:15px;top:12px;font-size:28px;font-weight:900;color:#edf0f1}
.svg-topic-format{display:block;font-size:10px;letter-spacing:.12em;color:var(--accent);font-weight:900;margin-bottom:10px}
.svg-topic strong{display:block;font-size:16px;line-height:1.2;max-width:85%;margin-bottom:9px}
.svg-topic small{display:block;color:var(--muted);font-size:12px;line-height:1.5;max-width:92%}
.svg-topic-arrow{display:block;margin-top:14px;font-size:11px;font-weight:900;color:var(--ink);transition:color .18s var(--svg-ease)}.svg-history-empty{display:flex;flex-direction:column;align-items:flex-start;gap:9px;margin-top:18px;padding:22px;border:1px solid var(--line);border-left:3px solid var(--accent);background:#fffaf0}.svg-history-empty strong{font-size:15px}.svg-history-empty span{max-width:560px;color:var(--muted);font-size:13px;line-height:1.55}.svg-history-empty .svg-button{margin-top:5px}.svg-history-item{transition:transform .18s var(--svg-ease),box-shadow .18s var(--svg-ease),border-color .18s var(--svg-ease)}.svg-history-item:hover{transform:translateX(-2px);border-color:#c6b98f;box-shadow:0 8px 20px rgba(23,32,42,.06)}.svg-history-item .svg-button{white-space:nowrap}.svg-history-panel{animation:svg-history-in .22s var(--svg-ease)}@keyframes svg-history-in{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}@media(prefers-reduced-motion:reduce){.svg-history-panel{animation:none}.svg-topic,.svg-history-item,.svg-topic-arrow{transition:none}}
.svg-building{margin-top:18px;padding:24px;border:1px solid var(--line);border-radius:14px;background:#fafbfb;display:flex;gap:10px;align-items:center}
.svg-building strong{font-size:13px}.svg-spinner{width:16px;height:16px;border:2px solid #dfe5e9;border-top-color:var(--accent);border-radius:50%;animation:svgspin .7s linear infinite;flex:0 0 auto}
@keyframes svgspin{to{transform:rotate(360deg)}}
.svg-loading{display:flex;flex-direction:column;align-items:center;gap:10px;min-height:160px;justify-content:center}
.svg-loading span{font-size:12px;color:var(--muted)}
.svg-progress-wrap{padding:20px 4px 10px}
.svg-progress-head{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:9px}
.svg-progress-head span{font-variant-numeric:tabular-nums;color:var(--muted)}
.svg-progress{height:9px;background:#e9eef0;border-radius:999px;overflow:hidden}
.svg-progress i{display:block;width:0;height:100%;background:var(--accent);border-radius:999px;transition:width .2s linear}
.svg-progress-message{font-size:12px;color:var(--muted);margin-top:10px;min-height:18px}
@media(max-width:800px){.svg-topic-grid{grid-template-columns:1fr}.svg-topic{min-height:145px}}
.svg-render-area{margin-top:18px;padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#fbfcfc,#f3f6f7);text-align:center}.render-main{width:100%;font-size:16px;padding:15px 22px;box-shadow:0 10px 24px rgba(23,32,42,.10)}.svg-render-hint{margin:10px auto 0;max-width:650px;color:var(--muted);font-size:12px;line-height:1.55}.svg-progress-wrap{margin-top:18px;padding:24px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(23,32,42,.06)}.svg-progress-head{font-size:14px}.svg-progress-head strong{font-size:15px}.svg-progress{height:12px;background:#e7ecee;border-radius:999px;overflow:hidden;box-shadow:inset 0 1px 3px rgba(23,32,42,.10)}.svg-progress i{background:var(--accent);box-shadow:0 0 12px rgba(231,168,59,.28)}.svg-progress-message{font-size:13px;line-height:1.55;min-height:40px;padding:10px 12px;background:#f7f9fa;border-radius:10px;margin-top:13px;color:var(--ink)}

.svg-form-actions{display:flex;gap:9px;flex-wrap:wrap}.svg-form-actions .svg-button{flex:1;min-width:180px}
.svg-history-backdrop{position:fixed;inset:0;z-index:99999;background:rgba(23,32,42,.58);backdrop-filter:blur(6px);display:flex;justify-content:flex-end;padding:18px}
.svg-history-panel{width:min(560px,100%);height:100%;box-sizing:border-box;background:#fff;border-radius:22px;padding:26px;box-shadow:0 24px 70px rgba(0,0,0,.22);overflow:auto}.svg-history-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:18px}.svg-history-head h3{font-size:28px;margin:6px 0 8px}.svg-history-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}.svg-history-close{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:#fff;font-size:26px;line-height:1;cursor:pointer;flex:0 0 auto}.svg-history-list{display:grid;gap:10px;padding-top:16px}.svg-history-item{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:14px}.svg-history-item strong{display:block;font-size:14px}.svg-history-item small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.svg-history-item .svg-button{flex:0 0 auto}

/* Restore action visibility guard: keeps the primary history action readable against theme overrides. */
.svg-history-item .svg-history-restore,
.svg-history-restore {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 134px !important;
  min-height: 40px !important;
  padding: 10px 14px !important;
  border: 1px solid #b97d12 !important;
  border-radius: 999px !important;
  background: #e7a83b !important;
  color: #17202a !important;
  -webkit-text-fill-color: #17202a !important;
  font: 800 12px/1.2 "DM Sans", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-indent: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  appearance: none !important;
}
.svg-history-item .svg-history-restore:hover,
.svg-history-restore:hover {
  background: #f0ba58 !important;
  color: #17202a !important;
  -webkit-text-fill-color: #17202a !important;
}
.svg-history-item .svg-history-restore:focus-visible,
.svg-history-restore:focus-visible {
  outline: 3px solid rgba(231, 168, 59, .45) !important;
  outline-offset: 3px !important;
}
@media (max-width: 560px) {
  .svg-history-item .svg-history-restore,
  .svg-history-restore {
    width: 100% !important;
  }
}

/* Plan / credits UI */
.svg-credit-chip{margin:14px 0 0;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);color:#fff;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:700}
.svg-guest-chip a{color:#fff;text-decoration:underline}
.svg-free-note{color:#b97d12;font-weight:700}

/* Locked angles for free users */
.svg-topic-locked{pointer-events:auto;cursor:pointer;filter:none;position:relative;overflow:hidden}
.svg-topic-locked > *:not(.svg-topic-lock-overlay){filter:blur(3.5px);opacity:.45;user-select:none}
.svg-topic-lock-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:rgba(255,255,255,.72);backdrop-filter:blur(2px);z-index:2;padding:12px;text-align:center}
.svg-topic-lock-overlay span{font-size:12px;font-weight:800;color:var(--ink)}
.svg-lock-icon{font-size:22px;line-height:1}
.svg-upgrade-banner{margin-top:16px;padding:16px 18px;border-radius:14px;border:1px solid #f0d9a8;background:linear-gradient(135deg,#fffaf0,#fff6e6);display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.svg-upgrade-banner strong{display:block;font-size:14px;margin-bottom:4px}
.svg-upgrade-banner span{display:block;font-size:12px;color:var(--muted);max-width:480px;line-height:1.45}

/* Guest / upgrade modal */
.svg-gate-modal{position:fixed;inset:0;z-index:100000;background:rgba(23,32,42,.62);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px}
.svg-gate-card{background:#fff;border-radius:20px;padding:28px 26px;max-width:420px;width:100%;box-shadow:0 24px 60px rgba(0,0,0,.25);text-align:center}
.svg-gate-card h3{margin:8px 0 10px;font-size:22px;font-family:Fraunces,Georgia,serif}
.svg-gate-card p{color:var(--muted);font-size:14px;line-height:1.55;margin:0 0 18px}
.svg-gate-card .svg-button{display:inline-flex;margin:0 auto 10px}
.svg-gate-close{display:block;margin:8px auto 0;border:0;background:transparent;color:var(--muted);font-weight:700;cursor:pointer;font-size:13px}
@media(max-width:560px){.svg-upgrade-banner{flex-direction:column;align-items:flex-start}}
