:root{--bg-0: #0a0c12;--bg-1: #12151f;--bg-2: #191d2a;--bg-input: #1d2233;--line: rgba(255, 255, 255, .1);--line-strong: rgba(255, 255, 255, .2);--text: #eef1f8;--text-dim: #9aa3b8;--accent: #38e1ff;--accent-2: #7c8bff;--accent-soft: rgba(56, 225, 255, .16);--accent-glow: rgba(56, 225, 255, .3);--danger: #ff7a5c;--radius: 14px;--radius-sm: 10px;color:var(--text);background:var(--bg-0);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}.app{min-height:100vh;padding:16px;background:radial-gradient(1100px 620px at 78% -8%,rgba(124,139,255,.16),transparent 60%),radial-gradient(960px 560px at 6% 4%,rgba(56,225,255,.12),transparent 55%),var(--bg-0)}.workspace{display:grid;grid-template-rows:auto minmax(0,1fr);gap:14px;height:calc(100vh - 32px);min-height:0;max-width:1320px;margin:0 auto;overflow:hidden}.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:14px 18px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,#ffffff0a,#fff0),var(--bg-1);box-shadow:0 1px #ffffff0d inset,0 18px 40px #00000073}.brand{min-width:0}.tagline{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0;padding:0;list-style:none}.tagline li{position:relative;padding:6px 12px 6px 30px;border:1px solid var(--line);border-radius:999px;background:var(--bg-2);color:var(--text);font-size:12px;font-weight:700;letter-spacing:.01em}.tagline li:before{content:"✓";position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--accent);font-size:12px;font-weight:900}.eyebrow{margin:0 0 8px;color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}h1{max-width:820px;margin:0;font-size:clamp(26px,3.4vw,44px);font-weight:800;line-height:1.02;letter-spacing:-.01em;background:linear-gradient(92deg,var(--text) 18%,var(--accent) 65%,var(--accent-2) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}h2{margin:0;color:var(--text-dim);font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px}.actionsRow{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-end}.actionsRow-primary{justify-content:flex-end}.pageNav{display:flex;flex-wrap:wrap;gap:8px;padding:4px;border:1px solid var(--line);border-radius:999px;background:var(--bg-2)}.pageNavLink{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 16px;border-radius:999px;color:var(--text-dim);font-size:13px;font-weight:700;text-decoration:none;transition:color .15s ease,background .15s ease}.pageNavLink:hover{color:var(--text)}.pageNavLink.isActive{color:#07111b;background:linear-gradient(180deg,var(--accent),#21b9e0)}.button,.effectButton,.sceneStyleButton,.presetButton,.backgroundPresetButton,.fitButton,.wideButton{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-2);color:var(--text);font-weight:700;cursor:pointer;transition:transform .12s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease,color .15s ease}.button:hover,.effectButton:hover,.sceneStyleButton:hover,.presetButton:hover,.backgroundPresetButton:hover,.fitButton:hover,.wideButton:hover{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.button:active,.effectButton:active,.presetButton:active,.backgroundPresetButton:active,.fitButton:active,.wideButton:active{transform:translateY(1px)}.button:focus-visible,.effectButton:focus-visible,.sceneStyleButton:focus-visible,.presetButton:focus-visible,.backgroundPresetButton:focus-visible,.fitButton:focus-visible,.wideButton:focus-visible,.pageNavLink:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.button:disabled,.effectButton:disabled,.sceneStyleButton:disabled,.presetButton:disabled,.backgroundPresetButton:disabled,.fitButton:disabled,.wideButton:disabled{color:var(--text-dim);cursor:not-allowed;opacity:.45;transform:none;border-color:var(--line);box-shadow:none}.button input{display:none}.button{padding:0 18px}.button-primary{border-color:transparent;background:linear-gradient(180deg,var(--accent),#1fb6dd);color:#06121a;font-weight:800;box-shadow:0 8px 22px #38e1ff47}.button-primary:hover{box-shadow:0 10px 28px #38e1ff66}.button-secondary{background:var(--bg-2)}.button-ghost{min-height:44px;padding:0 14px;background:transparent;color:var(--text-dim);font-weight:700}.button-ghost:hover{color:var(--text)}.button-cta{gap:9px;min-height:50px;padding:0 24px;border-color:transparent;background:linear-gradient(180deg,var(--accent),#1fb6dd);color:#06121a;font-size:15px;font-weight:800;box-shadow:0 10px 26px #38e1ff66;animation:ctaPulse 2.6s ease-in-out infinite}.button-cta:hover{border-color:transparent;box-shadow:0 12px 34px #38e1ff94}.ctaIcon{flex:none}@keyframes ctaPulse{0%,to{box-shadow:0 10px 26px #38e1ff57}50%{box-shadow:0 12px 34px #38e1ff99}}@media(prefers-reduced-motion:reduce){.button-cta{animation:none}}.editor{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);gap:14px;height:100%;min-height:0;overflow:hidden}.stagePanel{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;height:100%;padding:14px;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:radial-gradient(420px 300px at 50% 0%,rgba(124,139,255,.1),transparent 70%),#0c0e15;box-shadow:0 1px #ffffff0a inset,0 18px 40px #00000073}canvas{width:auto;height:auto;max-width:100%;max-height:100%;min-width:0;min-height:0;border-radius:6px;background:#fff;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;box-shadow:0 12px 30px #00000080}canvas.isDragging{cursor:grabbing}.dropHint{position:absolute;top:20px;right:20px;bottom:20px;left:20px;display:grid;place-items:center;border:2px dashed var(--accent);border-radius:var(--radius-sm);color:var(--text);font-size:17px;font-weight:800;background:#38e1ff0f;pointer-events:none;opacity:0;transition:opacity .15s ease}.dropHint.isActive{opacity:1}.dropHint.isHidden{display:none}.controls{display:flex;flex-direction:column;gap:12px;min-height:0;height:100%;padding-right:6px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}.controls::-webkit-scrollbar{width:8px}.controls::-webkit-scrollbar-thumb{border-radius:999px;background:var(--line-strong)}.controlGroup{display:grid;gap:12px;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,#ffffff09,#fff0),var(--bg-1);box-shadow:0 12px 28px #00000059}.segmented,.presetGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.backgroundPresetGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.effectButton,.sceneStyleButton,.presetButton,.backgroundPresetButton,.fitButton,.wideButton{width:100%;padding:0 10px;font-size:13px}.effectButton.isActive,.sceneStyleButton.isActive,.fitButton.isActive,.backgroundPresetButton.isActive{border-color:transparent;background:linear-gradient(180deg,var(--accent),#1fb6dd);color:#06121a;font-weight:800}.subtleButton{min-height:40px;border-style:dashed;background:transparent;color:var(--text-dim);font-size:13px}.subtleButton.isActive{border-style:solid;border-color:var(--accent-2);background:#7c8bff24;color:var(--text)}.customControls{display:grid;gap:12px;padding:12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg-2)}.customControls[hidden]{display:none}.statusText{min-height:34px;margin:0;color:var(--text-dim);font-size:12px;font-weight:600;line-height:1.4}label{display:grid;gap:8px;color:var(--text-dim);font-size:13px;font-weight:700}input[type=text]{width:100%;min-height:44px;padding:0 14px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-input);color:var(--text);font-weight:600}input[type=text]::placeholder{color:var(--text-dim)}input[type=text]:focus{border-color:var(--accent)}input[type=range]{accent-color:var(--accent)}input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent)}@media(max-width:900px){.workspace{height:auto;min-height:calc(100vh - 32px)}.topbar{align-items:stretch;flex-direction:column}.actions{width:100%;align-items:stretch}.actionsRow{justify-content:flex-start}.actionsRow-primary .button-cta{flex:1}.editor{grid-template-columns:1fr}.stagePanel{min-height:auto;height:auto;aspect-ratio:4 / 3}canvas{width:100%;max-height:none}.controls{height:auto;overflow:visible;padding-right:0}}@media(max-width:520px){.app{padding:12px}.workspace{min-height:calc(100vh - 24px)}h1{font-size:30px}}