.ssp-container{width:100%;max-width:1200px;margin:0 auto;color:var(--text-base, #1e293b);position:relative}.theme-dark .ssp-container{color:var(--text-base, #f8fafc)}.ssp-main-card{background:var(--bg-surface, #fff);border:1px solid var(--border-base, #cbd5e1);border-radius:16px;overflow:hidden;box-shadow:0 10px 35px #00000014;display:flex;flex-direction:column;position:relative}.theme-dark .ssp-main-card{background:var(--bg-surface, #090d16);border-color:var(--border-base, #1e293b);box-shadow:0 10px 35px #0006}.ssp-header-tabs{display:flex;background:#94a3b814;border-bottom:1px solid var(--border-base, #e2e8f0);padding:.5rem .5rem 0;gap:.5rem}.theme-dark .ssp-header-tabs{background:#0f172a;border-color:#1e293b}.ssp-tab-btn{flex:1;padding:.85rem 1.5rem;border:none;border-radius:10px 10px 0 0;background:transparent;color:inherit;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .2s ease;opacity:.65}.ssp-tab-btn.active{background:var(--bg-surface, #fff);color:var(--color-primary, #4f46e5);opacity:1;border:1px solid var(--border-base, #cbd5e1);border-bottom:1px solid var(--bg-surface, #fff);margin-bottom:-1px}.theme-dark .ssp-tab-btn.active{background:var(--bg-surface, #090d16);color:var(--color-primary-light, #818cf8);border-color:#1e293b;border-bottom-color:var(--bg-surface, #090d16)}.ssp-body-grid{display:grid;grid-template-columns:1fr;padding:1.5rem;gap:1.5rem}@media(min-width:900px){.ssp-body-grid{grid-template-columns:340px 1fr}}.ssp-sidebar-section{display:flex;flex-direction:column;gap:1.25rem;padding-right:0}@media(min-width:900px){.ssp-sidebar-section{padding-right:1.5rem;border-right:1px solid var(--border-base, #e2e8f0)}.theme-dark .ssp-sidebar-section{border-color:#1e293b}}.ssp-main-section{display:flex;flex-direction:column;gap:1.25rem}.ssp-dropzone{border:2px dashed var(--color-primary-light, #818cf8);border-radius:12px;padding:1.5rem 1rem;text-align:center;background:#818cf80d;cursor:pointer;transition:all .2s ease}.ssp-dropzone:hover,.ssp-dropzone.dragover{background:#818cf81f;border-color:var(--color-primary, #6366f1)}.ssp-drop-title{font-weight:700;font-size:1rem;margin-bottom:.25rem}.ssp-drop-sub{font-size:.8rem;opacity:.7}.ssp-file-input{display:none}.ssp-presets-row{display:flex;gap:.4rem;flex-wrap:wrap}.ssp-chip-btn{flex:1;min-width:85px;padding:.45rem .6rem;font-size:.75rem;font-weight:600;border-radius:6px;border:1px solid rgba(129,140,248,.3);background:#818cf814;color:inherit;cursor:pointer;transition:all .15s ease;text-align:center}.ssp-chip-btn:hover{background:#818cf833;border-color:var(--color-primary, #6366f1)}.ssp-chip-btn.active{background:linear-gradient(135deg,#6366f1,#4f46e5);color:var(--text-on-primary, #fff);border-color:var(--color-primary, #6366f1);box-shadow:0 2px 8px #6366f14d}.ssp-controls-list{display:flex;flex-direction:column;gap:1rem}.ssp-control-group{display:flex;flex-direction:column;gap:.4rem}.ssp-label{font-size:.85rem;font-weight:600;display:flex;justify-content:space-between}.ssp-stepper-box{display:flex;align-items:center;gap:.4rem;width:100%}.ssp-step-btn{width:32px;height:32px;border-radius:6px;border:1px solid var(--border-base, #cbd5e1);background:#94a3b81a;color:inherit;font-weight:700;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease,transform .1s ease;flex-shrink:0}.theme-dark .ssp-step-btn{border-color:#334155}.ssp-step-btn:hover{background:#6366f133;border-color:var(--color-primary, #6366f1)}.ssp-step-btn:active{transform:scale(.92)}.ssp-slider{flex:1;accent-color:var(--color-primary, #6366f1)}.ssp-select,.ssp-input{width:100%;padding:.6rem .8rem;border-radius:8px;border:1px solid var(--border-base, #cbd5e1);background:var(--bg-surface, #fff);color:inherit;font-size:.9rem}.theme-dark .ssp-select,.theme-dark .ssp-input{background:#1e293b;border-color:#334155}.ssp-toggle-group{display:flex;align-items:center;justify-content:space-between;padding:.3rem 0}.ssp-toggle-input{width:1.25rem;height:1.25rem;accent-color:var(--color-primary, #6366f1);cursor:pointer}.ssp-btn-row{display:flex;gap:.5rem;flex-wrap:wrap}.ssp-btn{flex:1;min-width:110px;padding:.7rem .9rem;border-radius:8px;border:none;font-weight:600;font-size:.88rem;cursor:pointer;transition:transform .15s ease,opacity .15s ease,background .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.ssp-btn:hover{transform:translateY(-1px)}.ssp-btn:active{transform:scale(.96)}.ssp-btn-primary{background:linear-gradient(135deg,#6366f1,#4f46e5);color:var(--text-on-primary, #fff)}.ssp-btn-secondary{background:#94a3b81f;color:inherit;border:1px solid var(--border-base, #cbd5e1)}.theme-dark .ssp-btn-secondary{border-color:#334155}.ssp-btn-danger{background:#dc2626;color:var(--text-on-primary, #fff)}.ssp-btn-success{background:#047857;color:var(--text-on-primary, #fff);border-color:#047857}.ssp-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.75rem}.ssp-stat-badge{background:#6366f114;border:1px solid rgba(99,102,241,.2);border-radius:10px;padding:.6rem .75rem;text-align:center}.ssp-stat-val{font-size:1.1rem;font-weight:700;color:var(--color-primary, #6366f1)}.theme-dark .ssp-stat-val{color:var(--color-primary-light, #818cf8)}.ssp-stat-lbl{font-size:.75rem;opacity:.8}.ssp-canvas-wrapper{width:100%;height:380px;overflow:auto;border-radius:12px;background-image:linear-gradient(45deg,#cbd5e1 25%,transparent 25%),linear-gradient(-45deg,#cbd5e1 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#cbd5e1 75%),linear-gradient(-45deg,transparent 75%,#cbd5e1 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;display:flex;align-items:center;justify-content:center;padding:1rem;border:1px solid var(--border-base, #e2e8f0);box-sizing:border-box}.theme-dark .ssp-canvas-wrapper{background-image:linear-gradient(45deg,#1e293b 25%,transparent 25%),linear-gradient(-45deg,#1e293b 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1e293b 75%),linear-gradient(-45deg,transparent 75%,#1e293b 75%);border-color:#1e293b}.ssp-canvas{max-width:100%;max-height:100%;object-fit:contain;border-radius:4px;box-shadow:0 4px 12px #00000026;image-rendering:pixelated}.ssp-flipbook-box{display:flex;flex-direction:column;gap:.75rem;padding:1rem;background:#6366f10a;border-radius:12px;border:1px solid rgba(99,102,241,.18)}.ssp-flipbook-header{font-weight:700;font-size:.9rem}.ssp-flipbook-body{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}.ssp-flipbook-canvas{width:100px;height:100px;image-rendering:pixelated;background:#0003;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.ssp-flipbook-controls{flex:1;min-width:200px;display:flex;flex-direction:column;gap:.75rem}.ssp-code-container{display:flex;flex-direction:column;border-radius:10px;overflow:hidden;border:1px solid var(--border-base, #e2e8f0);background:var(--bg-surface-secondary, #f8fafc)}.theme-dark .ssp-code-container{border-color:#1e293b;background:#090d16}.ssp-code-header{display:flex;align-items:center;justify-content:space-between;background:#94a3b81f;padding:.6rem .85rem;border-bottom:1px solid var(--border-base, #e2e8f0)}.theme-dark .ssp-code-header{background:#0f172a;border-color:#1e293b}.ssp-code-title{font-size:.82rem;font-weight:600;color:var(--text-base, #334155)}.theme-dark .ssp-code-title{color:var(--text-muted, #94a3b8)}.ssp-copy-btn{background:#6366f11a;border:1px solid rgba(99,102,241,.3);color:var(--color-primary, #4f46e5);padding:.35rem .75rem;border-radius:6px;font-size:.78rem;font-weight:600;cursor:pointer;transition:all .15s ease}.theme-dark .ssp-copy-btn{background:#38bdf81f;border-color:#38bdf84d;color:var(--color-cyan, #38bdf8)}.ssp-copy-btn:hover{background:#6366f133}.theme-dark .ssp-copy-btn:hover{background:#38bdf840}.ssp-copy-btn:active{transform:scale(.95)}.ssp-code-block{width:100%;margin:0;background:#f1f5f9;color:var(--text-base, #0f172a);font-size:.82rem;padding:.85rem 1rem;overflow-x:auto;white-space:pre-wrap;word-break:break-all}.theme-dark .ssp-code-block{background:#070a12;color:var(--color-cyan, #38bdf8)}.ssp-toast{position:fixed;bottom:2rem;right:2rem;background:#047857;color:var(--text-on-primary, #fff);padding:.75rem 1.25rem;border-radius:8px;font-weight:600;box-shadow:0 4px 14px #10b98166;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .3s ease,transform .3s ease;z-index:1000}.ssp-toast.show{opacity:1;transform:translateY(0)}.ssp-particle-container{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:2000}.ssp-particle{position:absolute;font-size:.75rem;font-weight:800;color:var(--color-primary, #4f46e5);background:#fffffff2;border:1px solid var(--color-primary, #6366f1);border-radius:4px;padding:.2rem .5rem;box-shadow:0 0 10px #6366f14d;animation:ssp-particle-float 1s forwards ease-out}.theme-dark .ssp-particle{color:var(--color-cyan, #38bdf8);background:#0f172ae6;border-color:#38bdf8;box-shadow:0 0 10px #38bdf880}@keyframes ssp-particle-float{0%{opacity:1;transform:translate(-50%,-50%) scale(.8)}50%{opacity:1;transform:translate(-50%,-120%) scale(1.1)}to{opacity:0;transform:translate(-50%,-180%) scale(.9)}}
