.sss-studio,.sss-studio[data-sss-theme=light]{--sss-bg-primary: #F7F5F2;--sss-bg-secondary: #FFFFFF;--sss-bg-tertiary: #F0EDE8;--sss-bg-canvas: #FFFEFA;--sss-text-primary: #000000;--sss-text-secondary: #333333;--sss-text-muted: #555555;--sss-accent: #2563EB;--sss-accent-hover: #1D4ED8;--sss-accent-soft: #EFF6FF;--sss-accent-secondary: #0D9488;--sss-border: #E5E1DB;--sss-border-light: #EEEAE4;--sss-canvas-border: #D4CFC7;--sss-canvas-guides: #D4CFC7;--sss-danger: #DC2626;--sss-danger-soft: #FEF2F2;--sss-success: #16A34A;--sss-success-soft: #F0FDF4;--sss-shadow-sm: 0 1px 2px rgba(0,0,0,.04);--sss-shadow-md: 0 4px 12px rgba(0,0,0,.06)}.sss-studio[data-sss-theme=dark]{--sss-bg-primary: #121212;--sss-bg-secondary: #1E1E1E;--sss-bg-tertiary: #2A2A2A;--sss-bg-canvas: #0A0A0A;--sss-text-primary: #FFFFFF;--sss-text-secondary: #D4D4D4;--sss-text-muted: #9CA3AF;--sss-accent: #3B82F6;--sss-accent-hover: #60A5FA;--sss-accent-soft: rgba(59, 130, 246, .15);--sss-accent-secondary: #2DD4BF;--sss-border: #404040;--sss-border-light: #333333;--sss-canvas-border: #444444;--sss-canvas-guides: #3A3A3A;--sss-danger: #F87171;--sss-danger-soft: rgba(248, 113, 113, .1);--sss-success: #4ADE80;--sss-success-soft: rgba(74, 222, 128, .1);--sss-shadow-sm: 0 1px 2px rgba(0,0,0,.2);--sss-shadow-md: 0 4px 12px rgba(0,0,0,.3)}.sss-studio[data-sss-theme=sepia]{--sss-bg-primary: #F4ECD8;--sss-bg-secondary: #FDF8EE;--sss-bg-tertiary: #EBE3CF;--sss-bg-canvas: #FFFDF5;--sss-text-primary: #1A1408;--sss-text-secondary: #3D3428;--sss-text-muted: #5C5344;--sss-accent: #B45309;--sss-accent-hover: #92400E;--sss-accent-soft: #FEF3C7;--sss-accent-secondary: #047857;--sss-border: #DDD5C0;--sss-border-light: #E8E0CC;--sss-canvas-border: #D0C7B0;--sss-canvas-guides: #D6CDBA;--sss-danger: #B91C1C;--sss-danger-soft: #FEF2F2;--sss-success: #15803D;--sss-success-soft: #F0FDF4;--sss-shadow-sm: 0 1px 2px rgba(61,52,40,.06);--sss-shadow-md: 0 4px 12px rgba(61,52,40,.08)}.sss-studio[data-sss-theme=high-contrast]{--sss-bg-primary: #000000;--sss-bg-secondary: #0A0A0A;--sss-bg-tertiary: #1A1A1A;--sss-bg-canvas: #000000;--sss-text-primary: #FFFFFF;--sss-text-secondary: #F0F0F0;--sss-text-muted: #CCCCCC;--sss-accent: #00D4FF;--sss-accent-hover: #00BFFF;--sss-accent-soft: rgba(0, 212, 255, .2);--sss-accent-secondary: #00FF88;--sss-border: #555555;--sss-border-light: #333333;--sss-canvas-border: #666666;--sss-canvas-guides: #444444;--sss-danger: #FF4444;--sss-danger-soft: rgba(255, 68, 68, .15);--sss-success: #00FF88;--sss-success-soft: rgba(0, 255, 136, .15);--sss-shadow-sm: 0 1px 2px rgba(255,255,255,.05);--sss-shadow-md: 0 4px 12px rgba(255,255,255,.08)}.sss-studio *,.sss-studio *:before,.sss-studio *:after{box-sizing:border-box}.sss-studio{height:100vh;height:100dvh;background:var(--sss-bg-primary);color:var(--sss-text-primary);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;overflow:hidden;transition:background .3s ease,color .3s ease}.sss-header{background:var(--sss-bg-secondary);border-bottom:1px solid var(--sss-border);padding:.75rem 1.5rem;display:flex;justify-content:space-between;align-items:center;flex-shrink:0;transition:background .3s ease,border-color .3s ease}.sss-header-left{display:flex;align-items:center;gap:1rem}.sss-back-btn{display:flex;align-items:center;gap:.375rem;padding:.5rem .875rem;border:1px solid var(--sss-border);border-radius:6px;background:var(--sss-bg-secondary);color:var(--sss-text-secondary);font-size:.8rem;font-weight:500;cursor:pointer;text-decoration:none;transition:all .2s ease}.sss-back-btn:hover{border-color:var(--sss-accent);color:var(--sss-accent)}.sss-back-btn svg{width:14px;height:14px}.sss-header-title h1{font-family:Fraunces,Georgia,serif;font-size:1.375rem;font-weight:600;color:var(--sss-text-primary);letter-spacing:-.02em;margin:0}.sss-header-title span{font-size:.7rem;color:var(--sss-accent);font-weight:600;text-transform:uppercase;letter-spacing:.08em;display:block}.sss-header-right{display:flex;align-items:center;gap:1rem}.sss-theme-toggle{display:flex;align-items:center;gap:4px;padding:4px;background:var(--sss-bg-tertiary);border-radius:8px;border:2px solid var(--sss-border)}.sss-theme-btn{display:flex;align-items:center;justify-content:center;width:36px;height:32px;border-radius:6px;border:2px solid var(--sss-border);background:var(--sss-bg-secondary);color:var(--sss-text-primary);cursor:pointer;transition:all .2s ease;position:relative}.sss-theme-btn:hover{border-color:var(--sss-accent);background:var(--sss-accent-soft)}.sss-theme-btn.active{background:var(--sss-accent);color:#fff;border-color:var(--sss-accent);box-shadow:0 2px 8px #0003}.sss-theme-btn svg{width:18px;height:18px;flex-shrink:0}.sss-logo{width:38px;height:38px;background:var(--sss-accent);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.65rem;letter-spacing:.02em}.sss-reference-mode-badge{display:flex;align-items:center;gap:12px;padding:8px 16px;background:linear-gradient(135deg,#10B981 0%,#059669 100%);border-radius:8px;color:#fff}.sss-reference-lesson{font-size:14px;font-weight:600;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sss-reference-credits{font-size:13px;font-weight:500;padding:4px 10px;background:rgba(255,255,255,.2);border-radius:4px}.sss-controls{display:flex;justify-content:center;gap:.5rem;padding:.875rem 1.5rem;background:var(--sss-bg-secondary);border-bottom:1px solid var(--sss-border);flex-shrink:0;transition:background .3s ease,border-color .3s ease}.sss-action-buttons{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.sss-action-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:6px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:1px solid var(--sss-border);background:var(--sss-bg-secondary);color:var(--sss-text-secondary)}.sss-action-btn:hover{border-color:var(--sss-accent);color:var(--sss-accent);background:var(--sss-accent-soft)}.sss-action-btn.primary{background:var(--sss-accent);color:#fff;border-color:var(--sss-accent)}.sss-action-btn.primary:hover{background:var(--sss-accent-hover);border-color:var(--sss-accent-hover)}.sss-action-btn.danger:hover{color:var(--sss-danger);border-color:var(--sss-danger);background:var(--sss-danger-soft)}.sss-action-btn:disabled{opacity:.5;cursor:not-allowed}.sss-action-btn:disabled:hover{border-color:var(--sss-border);color:var(--sss-text-secondary);background:var(--sss-bg-secondary)}.sss-action-btn svg{width:15px;height:15px}.sss-preset-selector{display:flex;gap:.375rem;align-items:center}.sss-preset-btn{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.375rem .5rem;border:1px solid var(--sss-border);border-radius:6px;background:var(--sss-bg-secondary);cursor:pointer;transition:all .15s ease}.sss-preset-btn:hover{border-color:var(--sss-accent);background:var(--sss-accent-soft)}.sss-preset-btn.active{border-color:var(--sss-accent);background:var(--sss-accent-soft);box-shadow:0 0 0 2px var(--sss-accent-soft)}.sss-preset-shape{width:28px;max-height:20px;background:var(--sss-text-muted);border-radius:2px;opacity:.4;transition:all .15s ease}.sss-preset-btn:hover .sss-preset-shape,.sss-preset-btn.active .sss-preset-shape{background:var(--sss-accent);opacity:1}.sss-preset-label{font-size:.65rem;font-weight:600;color:var(--sss-text-muted);transition:color .15s ease}.sss-preset-btn:hover .sss-preset-label,.sss-preset-btn.active .sss-preset-label{color:var(--sss-accent)}.sss-controls-divider{width:1px;height:32px;background:var(--sss-border);margin:0 .5rem}.sss-status{display:flex;justify-content:center;padding:0 1rem}.sss-status-message{padding:.5rem 1rem;border-radius:6px;font-size:.8rem;font-weight:500}.sss-status-error{background:var(--sss-danger-soft);color:var(--sss-danger);border:1px solid var(--sss-danger)}.sss-content{display:grid;grid-template-columns:minmax(220px,260px) 1fr minmax(220px,260px);gap:1rem;padding:1rem;flex:1 1 auto;min-height:0;overflow:hidden}.sss-left-panel,.sss-right-panel{background:var(--sss-bg-secondary);border-radius:10px;border:1px solid var(--sss-border);box-shadow:var(--sss-shadow-sm);overflow-y:auto;transition:background .3s ease,border-color .3s ease}.sss-panel-section{display:flex;flex-direction:column}.sss-panel-header{padding:1rem 1.125rem;border-bottom:1px solid var(--sss-border)}.sss-panel-title{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--sss-text-muted);margin:0}.sss-panel-content{padding:1.125rem}.sss-control-group{margin-bottom:1.5rem}.sss-control-group:last-child{margin-bottom:0}.sss-group-header{margin-bottom:.625rem}.sss-group-title{font-size:.75rem;font-weight:600;color:var(--sss-text-secondary)}.sss-color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.sss-color-btn{width:100%;aspect-ratio:1;border-radius:4px;cursor:pointer;border:2px solid transparent;transition:all .15s ease;position:relative}.sss-color-btn:hover{transform:scale(1.1);z-index:1}.sss-color-btn.sss-color-active{border-color:var(--sss-accent);box-shadow:0 0 0 2px var(--sss-accent-soft)}.sss-color-btn.sss-color-active:after{content:"";position:absolute;top:1px;right:1px;bottom:1px;left:1px;border-radius:2px;border:1px solid var(--sss-bg-secondary)}.sss-stroke-options{display:flex;flex-direction:column;gap:.375rem}.sss-stroke-option{display:flex;align-items:center;gap:.75rem;padding:.625rem .875rem;border:1px solid var(--sss-border);border-radius:6px;cursor:pointer;transition:all .15s ease;background:var(--sss-bg-tertiary)}.sss-stroke-option:hover{border-color:var(--sss-accent)}.sss-stroke-option.active{border-color:var(--sss-accent);background:var(--sss-accent-soft)}.sss-stroke-preview{width:28px;height:2px;background:var(--sss-text-primary);border-radius:1px}.sss-stroke-preview.medium{height:4px}.sss-stroke-preview.thick{height:6px}.sss-stroke-option span{font-size:.775rem;color:var(--sss-text-secondary);font-weight:500}.sss-guidelines-toggles{display:flex;flex-direction:column;gap:.5rem}.sss-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0}.sss-toggle-label{font-size:.8rem;color:var(--sss-text-secondary)}.sss-toggle-switch{position:relative;width:40px;height:22px;background:var(--sss-bg-tertiary);border:1px solid var(--sss-border);border-radius:11px;cursor:pointer;transition:all .2s ease}.sss-toggle-switch.active{background:var(--sss-accent);border-color:var(--sss-accent)}.sss-toggle-switch:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:white;border-radius:50%;transition:transform .2s ease;box-shadow:0 1px 3px #00000026}.sss-toggle-switch.active:after{transform:translate(18px)}.sss-center-panel{background:var(--sss-bg-secondary);border-radius:10px;border:1px solid var(--sss-border);box-shadow:var(--sss-shadow-md);padding:1.125rem;display:flex;flex-direction:column;min-height:0;overflow:hidden;transition:background .3s ease,border-color .3s ease}.sss-canvas-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.875rem;flex-shrink:0}.sss-zoom-controls{display:flex;align-items:center;gap:.375rem}.sss-zoom-btn{display:flex;align-items:center;justify-content:center;padding:.375rem .5rem;border:1px solid var(--sss-border);border-radius:4px;background:var(--sss-bg-secondary);color:var(--sss-text-secondary);font-size:.75rem;font-weight:500;cursor:pointer;transition:all .15s ease}.sss-zoom-btn:hover{border-color:var(--sss-accent);color:var(--sss-accent);background:var(--sss-accent-soft)}.sss-zoom-btn svg{width:14px;height:14px}.sss-zoom-level{font-size:.75rem;font-weight:600;color:var(--sss-text-secondary);min-width:36px;text-align:center}.sss-canvas-stats{display:flex;gap:1rem}.sss-stat{font-size:.75rem;color:var(--sss-text-muted)}.sss-stat strong{color:var(--sss-accent);font-weight:600}.sss-canvas-container{display:flex;justify-content:center;align-items:flex-start;width:100%;flex:1 1 auto;min-height:0;overflow:hidden;background:transparent;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.sss-canvas-wrapper{position:relative;line-height:0;font-size:0;border:2px solid var(--sss-canvas-border);border-radius:8px;overflow:hidden;flex-shrink:0;flex-grow:0;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.sss-canvas{display:block;touch-action:none;width:auto;height:auto;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.sss-canvas-wrapper.show-grid:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to right,var(--grid-color, rgba(0,0,0,.15)) 1px,transparent 1px),linear-gradient(to bottom,var(--grid-color, rgba(0,0,0,.15)) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;z-index:1}.sss-canvas-instruction{text-align:center;padding-top:.875rem;color:var(--sss-text-muted);font-size:.775rem}.sss-canvas-instruction strong{color:var(--sss-accent);font-weight:600}.sss-speed-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.sss-speed-option{background:var(--sss-bg-tertiary);border:1px solid var(--sss-border);border-radius:6px;padding:.5rem;cursor:pointer;transition:all .15s ease;text-align:center}.sss-speed-option:hover{border-color:var(--sss-accent)}.sss-speed-option.active{border-color:var(--sss-accent);background:var(--sss-accent-soft)}.sss-speed-preview{width:100%;aspect-ratio:16/10;background:var(--sss-bg-canvas);border-radius:4px;margin-bottom:.375rem;display:flex;align-items:center;justify-content:center;font-size:.65rem;color:var(--sss-text-muted);border:1px solid var(--sss-border-light);overflow:hidden}.sss-speed-preview img,.sss-speed-preview video{width:100%;height:100%;object-fit:cover}.sss-speed-label{font-size:.7rem;font-weight:600;color:var(--sss-text-secondary)}.sss-speed-time{font-size:.65rem;color:var(--sss-text-muted)}.sss-option-buttons{display:flex;flex-wrap:wrap;gap:.375rem}.sss-option-btn{flex:1;min-width:calc(50% - .1875rem);padding:.5rem .625rem;border:1px solid var(--sss-border);border-radius:5px;background:var(--sss-bg-tertiary);color:var(--sss-text-secondary);font-size:.7rem;font-weight:500;cursor:pointer;transition:all .15s ease;text-align:center}.sss-option-btn:hover{border-color:var(--sss-accent)}.sss-option-btn.active{border-color:var(--sss-accent);background:var(--sss-accent-soft);color:var(--sss-accent)}.sss-option-btn.disabled,.sss-option-btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.sss-bg-color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.sss-bg-color-btn{width:100%;aspect-ratio:1;border-radius:8px;cursor:pointer;transition:all .15s ease;border:2px solid transparent}.sss-bg-color-btn:hover{transform:scale(1.1);box-shadow:0 2px 8px #0003}.sss-bg-color-btn.active{border-color:var(--sss-accent)!important;box-shadow:0 0 0 3px var(--sss-accent-soft)}.sss-bg-color-picker-wrap{position:relative;width:100%;aspect-ratio:1;border-radius:8px;border:2px dashed var(--sss-border);display:flex;align-items:center;justify-content:center;cursor:pointer;background:linear-gradient(135deg,#FF6B6B 0%,#4ECDC4 25%,#FFE66D 50%,#95E1D3 75%,#A8E6CF 100%)}.sss-bg-color-picker-wrap:hover{border-color:var(--sss-accent)}.sss-bg-color-picker{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.sss-color-picker-label{font-size:1.25rem;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none}.sss-bg-transparent-row{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--sss-border)}.sss-checkbox-label{display:flex;align-items:center;gap:.5rem;font-size:.85rem;cursor:pointer;font-weight:600}.sss-checkbox-label span{color:inherit}.sss-studio[data-sss-theme=light] .sss-checkbox-label,.sss-studio[data-sss-theme=light] .sss-checkbox-label span,.sss-studio[data-sss-theme=sepia] .sss-checkbox-label,.sss-studio[data-sss-theme=sepia] .sss-checkbox-label span{color:#000!important}.sss-studio[data-sss-theme=dark] .sss-checkbox-label,.sss-studio[data-sss-theme=dark] .sss-checkbox-label span,.sss-studio[data-sss-theme=high-contrast] .sss-checkbox-label,.sss-studio[data-sss-theme=high-contrast] .sss-checkbox-label span{color:#fff!important}.sss-checkbox-label input[type=checkbox]{width:18px;height:18px;accent-color:var(--sss-accent);cursor:pointer}.sss-group-hint{font-size:.7rem;color:var(--sss-text-muted);margin:.25rem 0 .75rem;line-height:1.4}.sss-info-box{background:var(--sss-accent-soft);border:1px solid var(--sss-border);border-radius:6px;padding:.75rem;margin-top:1rem}.sss-info-box p{font-size:.725rem;color:var(--sss-text-secondary);line-height:1.5;margin:0}.sss-info-box strong{color:var(--sss-accent)}.sss-loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);display:flex;justify-content:center;align-items:center;z-index:1000}.sss-loading-spinner{width:48px;height:48px;border:3px solid var(--sss-border);border-top-color:var(--sss-accent);border-radius:50%;animation:sss-spin 1s linear infinite}@keyframes sss-spin{to{transform:rotate(360deg)}}@media screen and (min-width: 1400px){.sss-content{grid-template-columns:minmax(260px,300px) 1fr minmax(260px,300px);gap:1.5rem;padding:1.5rem}}@media screen and (max-width: 1200px){.sss-content{grid-template-columns:minmax(200px,240px) 1fr minmax(200px,240px);gap:.875rem;padding:.875rem}.sss-panel-content{padding:1rem}}@media screen and (max-width: 1024px){.sss-content{grid-template-columns:minmax(180px,220px) 1fr minmax(180px,220px);gap:.75rem;padding:.75rem}.sss-panel-content{padding:.875rem}.sss-header{padding:.5rem 1rem}.sss-header-title h1{font-size:1.2rem}}.sss-mobile-block{display:none}@media screen and (max-width: 767px){.sss-studio>*:not(.sss-mobile-block){display:none!important}.sss-mobile-block{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center;background:var(--sss-bg-primary)}.sss-mobile-block-icon{font-size:4rem;margin-bottom:1.5rem}.sss-mobile-block h2{font-size:1.5rem;font-weight:700;color:var(--sss-text-primary);margin:0 0 1rem}.sss-mobile-block p{font-size:1rem;color:var(--sss-text-secondary);margin:0 0 2rem;max-width:300px;line-height:1.5}.sss-mobile-block-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 1.5rem;background:var(--sss-accent);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;text-decoration:none}}@media (max-height: 480px){.sss-studio>*:not(.sss-mobile-block){display:none!important}.sss-mobile-block{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center;background:var(--sss-bg-primary)}.sss-mobile-block-icon{font-size:4rem;margin-bottom:1.5rem}.sss-mobile-block h2{font-size:1.5rem;font-weight:700;color:var(--sss-text-primary);margin:0 0 1rem}.sss-mobile-block p{font-size:1rem;color:var(--sss-text-secondary);margin:0 0 2rem;max-width:300px;line-height:1.5}.sss-mobile-block-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 1.5rem;background:var(--sss-accent);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;text-decoration:none}}.sss-canvas-demo-mode{cursor:pointer}.sss-canvas-hidden{display:none}.sss-demo-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;cursor:pointer;background:#000;border-radius:8px}.sss-demo-controls{position:absolute;top:15px;left:50%;transform:translate(-50%);background:rgba(0,0,0,.85);padding:12px 20px;border-radius:20px;color:var(--sss-accent);font-size:12px;text-align:center;border:1px solid var(--sss-border);max-width:90%;z-index:5}.sss-demo-content{display:flex;flex-direction:column;align-items:center;gap:8px}.sss-demo-dots{display:flex;gap:6px;align-items:center}.sss-demo-dot{width:8px;height:8px;border-radius:50%;background:var(--sss-border);transition:all .3s ease}.sss-demo-dot-active{background:var(--sss-accent);width:10px;height:10px}.sss-demo-labels{display:flex;gap:15px;font-size:11px;color:var(--sss-text-muted)}.sss-demo-label-active{color:var(--sss-accent);font-weight:600}.sss-demo-instruction{color:var(--sss-text-primary);font-weight:400;font-size:11px}.sss-start-drawing-btn{position:absolute;top:15px;right:15px;background:var(--sss-accent);padding:10px 20px;border-radius:20px;color:#fff;font-size:14px;font-weight:600;border:none;cursor:pointer;z-index:10;transition:all .2s ease}.sss-start-drawing-btn:hover{background:var(--sss-accent-hover)}.sss-mode-buttons{display:flex;gap:6px;flex-wrap:wrap}.sss-mode-btn{flex:1;min-width:70px;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 8px;background:var(--sss-bg-tertiary);border:2px solid var(--sss-border);border-radius:8px;color:var(--sss-text-secondary);font-size:11px;font-weight:500;cursor:pointer;transition:all .15s ease}.sss-mode-btn:hover:not(:disabled){border-color:var(--sss-accent);color:var(--sss-accent)}.sss-mode-btn.active{background:var(--sss-accent-soft);border-color:var(--sss-accent);color:var(--sss-accent)}.sss-mode-btn:disabled{opacity:.4;cursor:not-allowed}.sss-mode-btn svg{flex-shrink:0}.sss-studio[data-mode=erase] .sss-canvas-surface{cursor:none}.sss-studio[data-mode=move] .sss-canvas-surface{cursor:move}.sss-eraser-size{margin-top:12px;padding:10px 4px;background:var(--sss-bg-tertiary);border-radius:8px}.sss-eraser-size-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.sss-eraser-slider.simple-range{width:100%!important;max-width:100%!important;height:4px!important;background:#555!important;border-radius:2px!important;outline:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;margin:0 0 5px!important;padding:0!important;border:none!important}.sss-eraser-slider.simple-range::-webkit-slider-runnable-track{height:4px;background:#555;border-radius:2px}.sss-eraser-slider.simple-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:#4ecdc4;border-radius:50%;cursor:pointer;border:2px solid #fff;transition:all .2s ease;margin-top:-7px}.sss-eraser-slider.simple-range::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 0 10px #4ecdc480}.sss-eraser-slider.simple-range::-moz-range-track{height:4px;background:#555;border-radius:2px;border:none}.sss-eraser-slider.simple-range::-moz-range-thumb{width:18px;height:18px;background:#4ecdc4;border-radius:50%;cursor:pointer;border:2px solid #fff;-moz-appearance:none;-webkit-appearance:none;appearance:none}@media (hover: none) and (pointer: coarse){.sss-action-btn:hover{border-color:var(--sss-border);color:var(--sss-text-secondary);background:var(--sss-bg-secondary)}.sss-action-btn.primary:hover{background:var(--sss-accent);border-color:var(--sss-accent)}.sss-action-btn.danger:hover{color:var(--sss-text-secondary);border-color:var(--sss-border);background:var(--sss-bg-secondary)}}.sss-studio button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}.sss-guidance-toggle{display:flex;align-items:center;gap:8px;padding:8px 16px;background:linear-gradient(135deg,#10B981 0%,#059669 100%);border:none;border-radius:8px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;margin-right:12px}.sss-guidance-toggle:hover{transform:translateY(-1px);box-shadow:0 4px 12px #10b98166}.sss-guidance-toggle svg{width:18px;height:18px}.sss-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.sss-login-prompt{position:relative;width:100%;max-width:420px;background:var(--sss-panel-bg, #1a1a2e);border-radius:20px;padding:40px 32px;text-align:center;border:1px solid var(--sss-border-color, #2d2d4a);box-shadow:0 20px 60px #00000080}.sss-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border:none;background:rgba(255,255,255,.1);border-radius:50%;color:var(--sss-text-secondary, #9CA3AF);font-size:20px;cursor:pointer;transition:all .2s ease}.sss-modal-close:hover{background:rgba(255,255,255,.2);color:#fff}.sss-login-icon{font-size:56px;margin-bottom:20px}.sss-login-prompt h2{font-size:22px;font-weight:600;color:var(--sss-text-color, #ffffff);margin-bottom:12px}.sss-login-prompt>p{font-size:14px;color:var(--sss-text-secondary, #9CA3AF);line-height:1.5;margin-bottom:24px}.sss-login-features{display:flex;flex-direction:column;gap:12px;margin-bottom:28px}.sss-login-feature{display:flex;align-items:center;gap:12px;padding:12px 16px;background:rgba(16,185,129,.1);border-radius:10px;text-align:left}.sss-login-feature span:first-child{font-size:20px}.sss-login-feature span:last-child{font-size:13px;color:var(--sss-text-color, #ffffff)}.sss-login-btn{width:100%;padding:14px 24px;background:linear-gradient(135deg,#10B981 0%,#059669 100%);border:none;border-radius:10px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease}.sss-login-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px #10b98166}.sss-login-note{margin-top:16px;font-size:12px;color:var(--sss-text-muted, #6B7280)}[data-sss-theme=light] .sss-login-prompt{background:#ffffff;border-color:#e5e7eb}[data-sss-theme=light] .sss-login-prompt h2{color:#1f2937}[data-sss-theme=light] .sss-login-feature span:last-child{color:#374151}[data-sss-theme=sepia] .sss-login-prompt{background:#fdf6e3;border-color:#ddd5c0}[data-sss-theme=sepia] .sss-login-prompt h2{color:#3d3428}@media (max-width: 768px){.sss-guidance-toggle span{display:none}.sss-guidance-toggle{padding:8px}.sss-login-prompt{padding:32px 20px}}.spm-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.6);display:flex;justify-content:center;align-items:flex-start;padding-top:80px;z-index:1000}.spm-modal{background:#2d2d2d;border:1px solid #4a4a4a;border-radius:12px;box-shadow:0 8px 32px #0006;width:420px;max-width:95vw;padding:12px}.spm-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.spm-title{font-size:.9rem;font-weight:600;color:#fff}.spm-close{background:transparent;border:none;color:#fff;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background .15s ease}.spm-close:hover{background:#444444}.spm-canvas-wrap{border-radius:8px;border:1px solid #4a4a4a;margin-bottom:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#FFFFFF}.spm-canvas{display:block;width:100%;height:100%}.spm-placeholder{color:#333;font-size:.85rem;padding:40px}.spm-controls{display:flex;align-items:center;gap:8px}.spm-slider{flex:1;min-width:200px;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#555555;border-radius:3px;outline:none;cursor:pointer}.spm-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:#3b82f6;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0000004d;transition:transform .15s ease}.spm-slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.spm-slider::-moz-range-thumb{width:18px;height:18px;background:#3b82f6;border:none;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0000004d}.spm-apply{background:#3b82f6;color:#fff;border:none;border-radius:6px;padding:8px 12px;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .15s ease;display:flex;align-items:center;gap:8px;white-space:nowrap}.spm-apply:hover{background:#2563eb}.spm-time{background:rgba(255,255,255,.2);padding:2px 6px;border-radius:4px;font-size:.75rem}@media screen and (max-width: 480px){.spm-backdrop{padding-top:40px}.spm-modal{padding:10px;border-radius:10px}.spm-slider{min-width:120px}}.sss-speed-selector-btn{width:100%;display:flex;align-items:center;justify-content:space-between;padding:.875rem 1rem;background:var(--sss-bg-tertiary);border:2px solid var(--sss-border);border-radius:8px;cursor:pointer;transition:all .15s ease}.sss-speed-selector-btn:hover{border-color:var(--sss-accent);background:var(--sss-accent-soft)}.sss-speed-selector-content{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}.sss-speed-selector-label{font-size:.9rem;font-weight:600;color:var(--sss-text-primary)}.sss-speed-selector-hint{font-size:.7rem;color:var(--sss-text-muted)}.sss-speed-selector-icon{color:var(--sss-text-muted);transition:all .15s ease}.sss-speed-selector-btn:hover .sss-speed-selector-icon{color:var(--sss-accent);transform:translate(2px)}