@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Noto+Color+Emoji&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--font-sans:"Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--font-emoji:"Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", sans-serif;--bg-darkest:#070913;--bg-dark:#0c0f1e;--bg-card:#13172c;--bg-card-hover:#1a203d;--bg-card-selected:#a855f71f;--bg-input:#0a0c18;--bg-subtle:#ffffff0a;--unicorn-purple:#a855f7;--unicorn-purple-light:#c084fc;--unicorn-pink:#ec4899;--unicorn-cyan:#00f6df;--unicorn-amber:#fbbf24;--unicorn-indigo:#6366f1;--unicorn-emerald:#10b981;--border-subtle:#ffffff14;--border-card:#ffffff1f;--border-focus:#00f6df;--border-active:#a855f799;--text-main:#f8fafc;--text-muted:#94a3b8;--text-dim:#64748b;--radius-xs:6px;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--shadow-sm:0 4px 12px #00000040;--shadow-md:0 8px 24px #00000059;--shadow-glow:0 0 24px #a855f74d;--shadow-cyan-glow:0 0 20px #00f6df40;--shadow-green-glow:0 0 24px #10b98159;--trans-fast:.15s cubic-bezier(.4, 0, .2, 1);--trans-smooth:.25s cubic-bezier(.16, 1, .3, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--bg-darkest);min-height:100%;color:var(--text-main);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;line-height:1.5}body{background-image:radial-gradient(800px at 50% -120px,#6366f129,#0000 70%),radial-gradient(600px at 90% 90%,#a855f714,#0000 60%);background-repeat:no-repeat}.emoji,[data-emoji],.unicorn-badge,.sample-icon,.drop-emoji,.preset-emoji{font-family:var(--font-emoji);vertical-align:middle;font-style:normal;line-height:1;display:inline-block}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:#ffffff24;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--unicorn-cyan)}.app-shell{flex-direction:column;gap:20px;max-width:1560px;min-height:100vh;margin:0 auto;padding:20px 24px 40px;display:flex}.app-header{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;display:flex}.brand-container{align-items:center;gap:14px;display:flex}.brand-logo-wrap{border-radius:var(--radius-md);background:linear-gradient(135deg,#7c3aed 0%,#ec4899 50%,#00f6df 100%);flex-shrink:0;justify-content:center;align-items:center;width:50px;height:50px;display:flex;box-shadow:0 4px 16px #a855f766}.unicorn-badge{filter:drop-shadow(0 2px 4px #0006);-webkit-user-select:none;user-select:none;font-size:26px}.brand-meta{flex-direction:column;display:flex}.brand-title-row{align-items:center;gap:10px;display:flex}.brand-title-row h1{letter-spacing:-.02em;background:linear-gradient(90deg, #fff 40%, var(--unicorn-cyan) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.4rem;font-weight:800}.brand-tag{color:#c084fc;text-transform:uppercase;background:#a855f726;border:1px solid #a855f74d;border-radius:999px;padding:2px 8px;font-size:.72rem;font-weight:700}.brand-desc{color:var(--text-muted);font-size:.8rem}.user-mode-switcher-wrap{align-items:center;display:flex}.user-mode-switcher{border:1px solid var(--border-card);background:#0a0c18cc;border-radius:999px;gap:4px;padding:4px;display:flex}.mode-nav-btn{color:var(--text-muted);font-family:var(--font-sans);cursor:pointer;transition:var(--trans-fast);background:0 0;border:none;border-radius:999px;align-items:center;gap:8px;padding:8px 18px;font-size:.82rem;font-weight:600;display:inline-flex}.mode-nav-btn:hover{color:var(--text-main);background:#ffffff0d}.mode-nav-btn.is-active{background:linear-gradient(135deg, var(--unicorn-purple) 0%, #7c3aed 100%);color:#fff;font-weight:700;box-shadow:0 2px 12px #a855f766}.header-status{align-items:center;gap:10px;display:flex}.status-chip{color:var(--unicorn-cyan);background:#00f6df14;border:1px solid #00f6df40;border-radius:999px;align-items:center;gap:8px;padding:6px 14px;font-size:.76rem;font-weight:600;display:inline-flex}.pulse-indicator{background-color:var(--unicorn-cyan);width:7px;height:7px;box-shadow:0 0 8px var(--unicorn-cyan);border-radius:50%;animation:2s ease-in-out infinite pulse-ring}@keyframes pulse-ring{0%{opacity:.7;transform:scale(.9)}50%{opacity:1;transform:scale(1.3)}to{opacity:.7;transform:scale(.9)}}.chip-unicorn{color:#f472b6;background:#ec489914;border:1px solid #ec489940;border-radius:999px;align-items:center;gap:6px;padding:6px 14px;font-size:.76rem;font-weight:600;display:inline-flex}.simple-view-wrapper{flex-direction:column;gap:16px;width:100%;display:flex}.simple-banner-row{border-radius:var(--radius-md);background:linear-gradient(135deg,#a855f724 0%,#00f6df14 100%);border:1px solid #a855f740;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.banner-title-wrap{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.banner-badge{color:#d8b4fe;background:#a855f738;border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:.74rem;font-weight:700;display:inline-flex}.banner-title-wrap h2{color:#fff;font-size:1.25rem;font-weight:800}.banner-info-text{color:var(--text-muted);font-size:.84rem}.banner-info-text strong{color:var(--unicorn-cyan)}.simple-dual-grid{grid-template-columns:1fr 1fr;align-items:start;gap:20px;display:grid}@media (max-width:1100px){.simple-dual-grid{grid-template-columns:1fr}}.simple-col-left,.simple-col-right{flex-direction:column;gap:16px;display:flex}.simple-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);flex-direction:column;gap:14px;padding:18px 20px;display:flex}.step-head-bar{align-items:center;gap:10px;display:flex}.step-tag{background:linear-gradient(135deg, var(--unicorn-cyan) 0%, #06b6d4 100%);color:#070913;text-transform:uppercase;letter-spacing:.04em;border-radius:999px;flex-shrink:0;padding:3px 10px;font-size:.72rem;font-weight:800}.step-head-bar h3{color:var(--text-main);font-size:1.05rem;font-weight:700}.card-desc-text{color:var(--text-muted);margin-top:-6px;font-size:.8rem}.sub-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-size:.72rem;font-weight:700}.simple-samples-flow{flex-direction:column;gap:6px;display:flex}.simple-compact-dropzone{text-align:left;flex-direction:row;align-items:center;gap:12px;padding:16px 14px}.simple-compact-dropzone .drop-icon-box{flex-shrink:0;width:40px;height:40px;font-size:18px}.simple-compact-dropzone .drop-content strong{color:var(--text-main);font-size:.86rem;display:block}.simple-compact-dropzone .drop-content p{color:var(--text-muted);font-size:.74rem}.simple-presets-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.preset-card-compact{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);cursor:pointer;transition:var(--trans-fast);text-align:left;background:#ffffff08;align-items:center;gap:10px;padding:10px 12px;display:flex}.preset-card-compact:hover{background:#ffffff12;border-color:#fff3;transform:translateY(-1px)}.preset-card-compact.is-selected{border-color:var(--unicorn-purple);background:#a855f71f;box-shadow:0 0 12px #a855f740}.preset-card-compact .preset-emoji{flex-shrink:0;font-size:22px}.preset-info strong{color:var(--text-main);font-size:.82rem;display:block}.preset-info small{color:var(--text-muted);font-size:.68rem;line-height:1.25;display:block}.preview-action-card{padding:18px 20px}.simple-viewport-box{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background-color:#080a15;flex-direction:column;min-height:380px;display:flex;overflow:hidden}.simple-canvas-wrap{flex:1;justify-content:center;align-items:center;min-height:300px;padding:20px;display:flex;overflow:hidden}.simple-toolbar{border-top:1px solid var(--border-subtle);background:#0a0c18f2;padding:8px 14px}.simple-export-block{flex-direction:column;gap:12px;margin-top:4px;display:flex}.btn-giant-download{color:#051614;border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-green-glow);transition:var(--trans-fast);text-align:left;background:linear-gradient(135deg,#10b981 0%,#00f6df 100%);border:none;align-items:center;gap:12px;padding:14px 18px;display:flex}.btn-giant-download:hover{transform:translateY(-2px);box-shadow:0 8px 26px #10b98173}.btn-giant-download .emoji{font-size:26px}.giant-btn-text strong{font-size:1rem;font-weight:800;display:block}.giant-btn-text small{color:#051614d9;margin-top:1px;font-size:.72rem;font-weight:600;display:block}.simple-secondary-actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.simple-sub-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-xs);color:var(--text-main);font-family:var(--font-sans);cursor:pointer;transition:var(--trans-fast);background:#ffffff0d;justify-content:center;align-items:center;gap:6px;padding:8px 10px;font-size:.76rem;font-weight:600;display:flex}.simple-sub-btn:hover{background:#ffffff1a;border-color:#fff3}.simple-hints-box{border:1px solid var(--border-subtle);border-radius:var(--radius-xs);color:var(--text-muted);background:#0000004d;padding:10px 12px;font-size:.74rem}.hint-title{color:var(--unicorn-cyan);margin-bottom:4px;font-weight:700;display:block}.simple-hints-box ul{flex-direction:column;gap:4px;list-style-type:none;display:flex}.simple-hints-box li strong{color:var(--text-main)}.simple-hints-box code{font-family:var(--font-mono);background:#ffffff14;border-radius:3px;padding:1px 4px;font-size:.68rem}.switch-to-pro-bar{border-radius:var(--radius-sm);color:var(--text-muted);background:#a855f714;border:1px dashed #a855f74d;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;font-size:.8rem;display:flex}.switch-hint{color:var(--text-muted);font-size:.78rem}.btn-pro-switch{border:1px solid var(--unicorn-purple);color:#fff;font-family:var(--font-sans);cursor:pointer;transition:var(--trans-fast);background:#a855f733;border-radius:999px;align-items:center;gap:6px;padding:6px 14px;font-size:.76rem;font-weight:700;display:inline-flex}.btn-pro-switch:hover{background:var(--unicorn-purple);box-shadow:0 4px 16px #a855f766}.workspace-grid{grid-template-columns:480px 1fr;align-items:start;gap:20px;display:grid}@media (max-width:1160px){.workspace-grid{grid-template-columns:1fr}}.panel{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;gap:16px;padding:20px;display:flex}.panel-head{justify-content:space-between;align-items:center;display:flex}.panel-head-title{align-items:center;gap:8px;display:flex}.panel-head-title h2{color:var(--text-main);font-size:1.05rem;font-weight:700}.btn-text-action{border:1px solid var(--border-subtle);border-radius:var(--radius-xs);color:var(--text-muted);cursor:pointer;transition:var(--trans-fast);background:#ffffff0d;align-items:center;gap:6px;padding:4px 10px;font-size:.76rem;font-weight:600;display:inline-flex}.btn-text-action:hover{color:var(--text-main);background:#ffffff1a;border-color:#fff3}.dropzone{border-radius:var(--radius-md);text-align:center;background:var(--bg-input);cursor:pointer;transition:var(--trans-smooth);border:2px dashed #ffffff24;flex-direction:column;align-items:center;gap:10px;padding:22px 18px;display:flex}.dropzone:hover,.dropzone.is-dragover{border-color:var(--unicorn-cyan);box-shadow:var(--shadow-cyan-glow);background:#00f6df0a}.drop-icon-box{width:44px;height:44px;transition:var(--trans-fast);background:#a855f71f;border-radius:50%;justify-content:center;align-items:center;display:flex}.drop-emoji{font-size:22px}.dropzone:hover .drop-icon-box{background:#00f6df26;transform:scale(1.1)}.drop-content h3{font-size:.92rem;font-weight:600}.drop-content p{color:var(--text-muted);font-size:.76rem}.samples-section{flex-direction:column;gap:8px;display:flex}.section-label-bar{justify-content:space-between;align-items:center;display:flex}.sec-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);font-size:.74rem;font-weight:700}.sec-hint{color:var(--unicorn-cyan);font-size:.7rem;font-weight:600}.samples-pill-grid{flex-wrap:wrap;gap:8px;display:flex}.sample-btn{border:1px solid var(--border-subtle);color:var(--text-muted);cursor:pointer;transition:var(--trans-fast);background:#ffffff0a;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:.78rem;font-weight:500;display:inline-flex}.sample-btn:hover{color:var(--text-main);background:#ffffff14;border-color:#fff3;transform:translateY(-1px)}.sample-btn.is-active{border-color:var(--unicorn-cyan);color:var(--unicorn-cyan);background:#00f6df1f;font-weight:700;box-shadow:0 0 12px #00f6df33}.sample-icon{font-size:14px}.editor-section{flex-direction:column;gap:8px;display:flex}.editor-actions{gap:6px;display:flex}.mini-btn{border:1px solid var(--border-subtle);color:var(--text-dim);border-radius:var(--radius-xs);cursor:pointer;transition:var(--trans-fast);background:#ffffff0d;padding:3px 8px;font-size:.72rem;font-weight:600}.mini-btn:hover{color:var(--text-main);background:#ffffff1a}.mini-btn-primary{color:var(--unicorn-cyan);border-radius:var(--radius-xs);cursor:pointer;transition:var(--trans-fast);background:#00f6df26;border:1px solid #00f6df66;padding:3px 10px;font-size:.72rem;font-weight:700}.mini-btn-primary:hover{background:var(--unicorn-cyan);color:#070913}.svg-code-area{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:#38bdf8;width:100%;height:130px;font-family:var(--font-mono);resize:vertical;transition:var(--trans-fast);outline:none;padding:10px 12px;font-size:.78rem;line-height:1.45}.svg-code-area:focus{border-color:var(--unicorn-cyan);box-shadow:0 0 12px #00f6df26}.config-box{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#0a0c17b3;flex-direction:column;gap:12px;padding:16px;display:flex}.config-box-header{align-items:center;gap:8px;display:flex}.config-box-header h3{color:var(--text-muted);font-size:.85rem;font-weight:700}.layer-mode-block{flex-direction:column;display:flex}.mode-switch-container{flex-direction:column;gap:8px;display:flex}.mode-switch-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);text-align:left;cursor:pointer;transition:var(--trans-fast);background:#ffffff05;padding:10px 12px}.mode-switch-btn:hover{background:#ffffff0f;border-color:#fff3}.mode-switch-btn.is-active{border-color:var(--unicorn-purple);background:#a855f717;box-shadow:0 0 12px #a855f733}.mode-btn-content{flex-direction:column;gap:2px;display:flex}.mode-top-line{color:var(--text-main);align-items:center;gap:6px;font-size:.82rem;display:flex}.badge-rec{color:var(--unicorn-cyan);background:#00f6df26;border:1px solid #00f6df4d;border-radius:999px;padding:1px 6px;font-size:.65rem;font-weight:700}.mode-btn-content small{color:var(--text-muted);font-size:.72rem;line-height:1.35}.form-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.form-field{flex-direction:column;gap:4px;display:flex}.form-field label{color:var(--text-dim);font-size:.74rem;font-weight:600}.text-input,.select-input{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-xs);color:var(--text-main);font-family:var(--font-sans);transition:var(--trans-fast);outline:none;padding:7px 10px;font-size:.82rem}.text-input:focus,.select-input:focus{border-color:var(--unicorn-cyan)}.checkbox-field{justify-content:flex-end;padding-bottom:6px}.custom-check-label{color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;font-size:.78rem;display:flex}.custom-check-label input[type=checkbox]{accent-color:var(--unicorn-cyan);cursor:pointer;width:15px;height:15px}.timeline-layers-summary{flex-direction:column;gap:6px;margin-top:4px;display:flex}.timeline-layers-head{justify-content:space-between;align-items:center;display:flex}.layers-count-badge{font-family:var(--font-mono);color:var(--unicorn-cyan);font-size:.7rem;font-weight:600}.layers-scroll-list{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-xs);flex-direction:column;gap:4px;max-height:160px;padding:6px;display:flex;overflow-y:auto}.layer-row{background:#ffffff05;border-radius:4px;justify-content:space-between;align-items:center;padding:5px 8px;font-size:.75rem;display:flex}.layer-meta{align-items:center;gap:6px;display:flex}.layer-num{font-family:var(--font-mono);color:#d8b4fe;background:#a855f733;border-radius:3px;padding:1px 4px;font-size:.68rem;font-weight:700}.layer-title{font-family:var(--font-mono);color:var(--text-main);font-weight:600}.layer-parent{color:var(--text-dim);font-size:.68rem}.layer-type{border-radius:3px;padding:1px 6px;font-size:.65rem;font-weight:600}.type-shape{color:var(--unicorn-cyan);background:#00f6df1f}.type-null{color:#f472b6;background:#ec489926}.stats-row{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.metric-card{border:1px solid var(--border-subtle);border-radius:var(--radius-xs);text-align:center;background:#0a0c17b3;padding:8px 10px}.metric-val{font-family:var(--font-mono);color:var(--text-main);font-size:1.05rem;font-weight:700;display:block}.accent-val{color:var(--unicorn-cyan)}.metric-lbl{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-size:.66rem}.viewport-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.mode-tabs{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:#0a0c17cc;gap:4px;padding:4px;display:flex}.tab-btn{color:var(--text-muted);font-family:var(--font-sans);border-radius:var(--radius-xs);cursor:pointer;transition:var(--trans-fast);background:0 0;border:none;align-items:center;gap:6px;padding:6px 14px;font-size:.78rem;font-weight:600;display:inline-flex}.tab-btn:hover{color:var(--text-main);background:#ffffff0d}.tab-btn.is-active{background:linear-gradient(135deg, var(--unicorn-purple) 0%, var(--unicorn-indigo) 100%);color:#fff;box-shadow:0 2px 10px #a855f759}.export-btn-group{gap:8px;display:flex}.btn-primary{background:linear-gradient(135deg, var(--unicorn-cyan) 0%, #06b6d4 100%);color:#070913;font-family:var(--font-sans);border-radius:var(--radius-sm);cursor:pointer;transition:var(--trans-fast);border:none;align-items:center;gap:6px;padding:8px 16px;font-size:.82rem;font-weight:700;display:inline-flex;box-shadow:0 3px 12px #00f6df4d}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 5px 18px #00f6df66}.btn-secondary{border:1px solid var(--border-subtle);color:var(--text-main);font-family:var(--font-sans);border-radius:var(--radius-sm);cursor:pointer;transition:var(--trans-fast);background:#ffffff0f;align-items:center;gap:6px;padding:8px 14px;font-size:.82rem;font-weight:600;display:inline-flex}.btn-secondary:hover{background:#ffffff1f;border-color:#fff3}.viewport-box{border:1px solid var(--border-subtle);border-radius:var(--radius-md);min-height:480px;transition:background-color var(--trans-smooth);flex-direction:column;display:flex;position:relative;overflow:hidden}.viewport-box.bg-dark,.simple-viewport-box.bg-dark{background-color:#080a15}.viewport-box.bg-black,.simple-viewport-box.bg-black{background-color:#000}.viewport-box.bg-light,.simple-viewport-box.bg-light{color:#0f172a;background-color:#f8fafc}.viewport-box.bg-checkered,.simple-viewport-box.bg-checkered{background-color:#0c0f1e;background-image:linear-gradient(45deg,#13172e 25%,#0000 25%),linear-gradient(-45deg,#13172e 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#13172e 75%),linear-gradient(-45deg,#0000 75%,#13172e 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.stages-wrapper{flex:1;grid-template-columns:1fr 1fr;min-height:400px;display:grid}.stages-wrapper.is-single{grid-template-columns:1fr}.stage-card{border-right:1px solid var(--border-subtle);flex-direction:column;height:100%;display:flex}.stage-card:last-child{border-right:none}.stage-tag-bar{border-bottom:1px solid var(--border-subtle);background:#00000059;justify-content:space-between;align-items:center;padding:8px 14px;font-size:.72rem;font-weight:600;display:flex}.stage-title{color:var(--text-muted)}.stage-badge{color:var(--text-dim);background:#ffffff14;border-radius:3px;padding:1px 6px;font-size:.65rem}.badge-lottie{color:var(--unicorn-cyan);background:#00f6df26;font-weight:700}.stage-canvas{flex:1;justify-content:center;align-items:center;padding:24px;display:flex;position:relative;overflow:hidden}.stage-canvas svg,.svg-render-canvas svg,.simple-canvas-wrap svg{filter:drop-shadow(0 6px 18px #00000059);max-width:100%;height:auto;max-height:350px}.lottie-inner{justify-content:center;align-items:center;width:100%;height:100%;max-height:350px;display:flex}.lottie-inner svg{filter:drop-shadow(0 6px 18px #00000059);max-width:100%;height:auto;max-height:350px}.json-inspector-view{flex-direction:column;flex:1;height:100%;max-height:440px;display:flex}.json-pre-box{background:var(--bg-input);font-family:var(--font-mono);color:#38bdf8;white-space:pre;flex:1;padding:16px;font-size:.78rem;line-height:1.5;overflow-y:auto}.player-toolbar{border-top:1px solid var(--border-subtle);background:#0a0c17f2;align-items:center;gap:12px;padding:10px 16px;display:flex}.ctrl-circle-btn{border:1px solid var(--border-subtle);color:var(--text-main);cursor:pointer;width:34px;height:34px;transition:var(--trans-fast);background:#ffffff14;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.ctrl-circle-btn:hover{background:var(--unicorn-cyan);color:#070913;border-color:var(--unicorn-cyan)}.ctrl-icon-btn{cursor:pointer;color:var(--text-muted);transition:var(--trans-fast);background:0 0;border:none;border-radius:4px;padding:4px;font-size:1rem}.ctrl-icon-btn:hover{transform:scale(1.15)}.scrub-container{flex:1;align-items:center;gap:10px;display:flex}.scrub-slider{appearance:none;cursor:pointer;background:#ffffff26;border-radius:3px;outline:none;flex:1;height:6px}.scrub-slider::-webkit-slider-thumb{appearance:none;background:var(--unicorn-cyan);cursor:pointer;width:14px;height:14px;box-shadow:0 0 8px var(--unicorn-cyan);border-radius:50%;transition:transform .1s}.scrub-slider::-webkit-slider-thumb:hover{transform:scale(1.25)}.frame-tag{font-family:var(--font-mono);color:var(--text-muted);text-align:right;min-width:65px;font-size:.74rem}.select-pill{background:var(--bg-input);border:1px solid var(--border-subtle);color:var(--text-main);font-family:var(--font-sans);border-radius:var(--radius-xs);cursor:pointer;outline:none;padding:5px 8px;font-size:.76rem}.pill-toggle{border:1px solid var(--border-subtle);color:var(--text-dim);border-radius:var(--radius-xs);cursor:pointer;transition:var(--trans-fast);background:#ffffff0d;align-items:center;gap:4px;padding:5px 10px;font-size:.74rem;font-weight:600;display:inline-flex}.pill-toggle.is-active{border-color:var(--unicorn-purple);color:#d8b4fe;background:#a855f726}.bg-palette{border-left:1px solid var(--border-subtle);align-items:center;gap:6px;padding-left:6px;display:flex}.bg-btn{cursor:pointer;width:18px;height:18px;transition:var(--trans-fast);border:2px solid #0000;border-radius:50%}.bg-btn:hover{transform:scale(1.15)}.bg-btn.is-active{border-color:var(--unicorn-cyan)}.bg-theme-dark{background:#080a15}.bg-theme-black{background:#000}.bg-theme-light{background:#f8fafc}.bg-theme-check{background-color:#0000;background-image:linear-gradient(45deg,#222 25%,#0000 25%),linear-gradient(-45deg,#222 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#222 75%),linear-gradient(-45deg,#0000 75%,#222 75%);background-position:0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat;background-size:6px 6px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box}.toast-bubble{border:1px solid var(--unicorn-cyan);border-radius:var(--radius-sm);color:var(--text-main);box-shadow:var(--shadow-md), 0 0 16px #00f6df40;z-index:9999;background:#12162cf2;align-items:center;gap:10px;padding:10px 18px;font-size:.84rem;font-weight:600;animation:.25s cubic-bezier(.16,1,.3,1) slide-up;display:flex;position:fixed;bottom:24px;right:24px}@keyframes slide-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.app-footer{text-align:center;color:var(--text-dim);padding-top:10px;font-size:.76rem}.app-footer strong{color:var(--unicorn-purple)}