:root{--bg-primary:#000;--bg-secondary:#000;--bg-surface:#2f2f2f;--bg-surface-hover:#adb1ae;--bg-glass:#1f1f1fbf;--border-color:#ffffff1f;--border-glow:#ffffff1f;--text-primary:#fff;--text-secondary:#adb1ae;--text-muted:#ffae00;--accent-1:#fff;--accent-2:#fff;--accent-gradient:#ffae00;--accent-gradient-hover:#ffae00;--success:#4ade80;--error:#f87171;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px;--shadow-glow:0 0 20px #00000026;--panel-width:360px;--header-height:56px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-base:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.4s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg-primary);height:100%;color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;overflow:hidden}::selection{color:#fff;background:#ffffff4d}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#fff3;border-radius:9999px}#app-header{height:var(--header-height);background:var(--bg-glass);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border-color);z-index:100;justify-content:space-between;align-items:center;padding:0 24px;display:flex;position:relative}.header-left,.logo{align-items:center;gap:12px;display:flex}.logo-icon{border-radius:var(--radius-md);border:1px solid var(--border-color);background:#1f1f1fbf;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.logo h1{letter-spacing:-.3px;color:var(--text-primary);font-size:18px;font-weight:600}.gradient-text{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.badge{text-transform:uppercase;letter-spacing:.5px;border:1px solid var(--border-color);border-radius:var(--radius-full);color:var(--accent-1);background:#ffae004c;padding:4px 12px;font-size:11px;font-weight:600}#app-main{height:calc(100vh - var(--header-height));display:flex;position:relative}#viewport{background:var(--bg-primary);flex:1;position:relative;overflow:hidden}#viewport canvas{display:block;width:100%!important;height:100%!important}#viewport-overlay{pointer-events:none;z-index:10;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.hint{color:var(--text-muted);background:var(--bg-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-full);border:1px solid var(--border-color);white-space:nowrap;padding:4px 16px;font-size:12px}#control-panel{width:var(--panel-width);background:var(--bg-glass);-webkit-backdrop-filter:blur(24px);border-right:1px solid var(--border-color);z-index:50;border-left:none;flex-direction:column;order:-1;height:100%;display:flex;position:relative;overflow:hidden}#control-panel:before{content:"";background:var(--accent-gradient);opacity:.5;height:1px;position:absolute;top:0;left:0;right:0}.panel-header{border-bottom:1px solid var(--border-color);flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.panel-header h2{color:var(--text-primary);align-items:center;gap:8px;font-size:15px;font-weight:600;display:flex}.drawer-handle{color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:var(--transition-fast);background:0 0;border:none;padding:4px;display:none}.drawer-handle:hover{background:var(--bg-surface-hover)}.drawer-handle.flipped svg{transform:rotate(180deg)}.panel-body{flex:1;padding:12px 0;overflow-y:auto}.section{border-bottom:1px solid var(--border-color);animation:.3s ease-out fadeIn}.section:last-child{border-bottom:none}.section-title{cursor:pointer;color:var(--text-secondary);transition:var(--transition-fast);-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:12px 24px;font-size:13px;font-weight:600;display:flex}.section-title:hover{color:var(--text-primary);background:#1f1f1f}.section-title span{align-items:center;gap:8px;display:flex}.chevron{transition:transform var(--transition-base)}.chevron.rotated{transform:rotate(180deg)}.section-content{max-height:600px;transition:max-height var(--transition-slow), padding var(--transition-slow), opacity var(--transition-base);opacity:1;padding:0 24px 16px;overflow:hidden}.section-content.collapsed{opacity:0;max-height:0;padding-top:0;padding-bottom:0}.style-picker{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.style-btn{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);min-width:0;color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);text-align:center;white-space:nowrap;flex:auto;padding:6px 8px;font-family:inherit;font-size:12px}.style-btn:hover{border-color:var(--accent-1);color:var(--text-primary);background:var(--bg-surface-hover)}.style-btn.active{border-color:var(--accent-1);color:#000;background:#ffae00;box-shadow:0 0 8px #fff}.control-group{margin-bottom:12px}.control-group:last-child{margin-bottom:0}.control-group label{color:var(--text-secondary);justify-content:space-between;align-items:center;margin-bottom:4px;font-size:12px;font-weight:500;display:flex}.value-display{color:var(--accent-1);font-variant-numeric:tabular-nums;font-size:11px;font-weight:600}input[type=text]{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);width:100%;color:var(--text-primary);transition:var(--transition-fast);outline:none;padding:8px 12px;font-family:inherit;font-size:14px}input[type=text]:focus{border-color:var(--accent-1);box-shadow:0 0 0 3px #2f2f2f}input[type=text]::placeholder{color:var(--text-muted)}select{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);width:100%;color:var(--text-primary);cursor:pointer;appearance:none;transition:var(--transition-fast);background-image:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239fa8da' stroke-width='2' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;outline:none;padding:8px 32px 8px 12px;font-family:inherit;font-size:13px}select:focus{border-color:var(--accent-1);box-shadow:0 0 0 3px #2f2f2f}input[type=range]{appearance:none;background:var(--bg-surface);border-radius:var(--radius-full);cursor:pointer;outline:none;width:100%;height:6px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent-gradient);cursor:pointer;border:2px solid var(--bg-primary);width:18px;height:18px;transition:var(--transition-fast);border-radius:50%;box-shadow:0 0 8px #ffffff4d}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 0 14px #ffffff4d}input[type=range]::-moz-range-thumb{background:var(--accent-gradient);cursor:pointer;border:2px solid var(--bg-primary);border-radius:50%;width:18px;height:18px}input[type=color]{border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-surface);cursor:pointer;width:100%;height:36px;padding:2px}input[type=color]:hover{border-color:var(--border-glow)}.checkbox-group label{cursor:pointer;justify-content:flex-start;align-items:center;gap:8px;display:flex}input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent-1);cursor:pointer}.hidden-file-input{display:none}.file-upload-label{background:var(--bg-surface);border:2px dashed var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-base);color:var(--text-secondary);align-items:center;gap:8px;padding:12px 16px;font-size:13px;font-weight:500;justify-content:center!important;display:flex!important}.file-upload-label:hover{border-color:var(--accent-1);color:var(--text-primary);background:#2f2f2f}#image-preview-container{border-radius:var(--radius-md);border:1px solid var(--border-color);margin-bottom:12px;position:relative;overflow:hidden}#image-preview{object-fit:contain;background:var(--bg-surface);width:100%;height:120px;display:block}.btn-icon{border-radius:var(--radius-sm);color:#fff;cursor:pointer;width:28px;height:28px;transition:var(--transition-fast);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#f87171cc;border:none;justify-content:center;align-items:center;font-size:14px;display:flex;position:absolute;top:4px;right:4px}.btn-icon:hover{background:var(--error);transform:scale(1.1)}.export-buttons{gap:12px;display:flex}.btn{border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-base);border:none;flex:1;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-family:inherit;font-size:13px;font-weight:600;display:flex;position:relative;overflow:hidden}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent-gradient);color:#000}.btn-primary:hover{box-shadow:var(--shadow-glow)}.btn-secondary{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-color)}.btn-secondary:hover{border-color:var(--accent-1);background:var(--bg-surface-hover)}.loading-indicator{color:var(--accent-1);align-items:center;gap:8px;padding:8px 0;font-size:12px;display:flex}.spinner{border:2px solid var(--border-color);border-top-color:var(--accent-1);border-radius:50%;width:16px;height:16px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toast{border-radius:var(--radius-lg);z-index:1000;opacity:0;transition:all var(--transition-base);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);white-space:nowrap;padding:12px 24px;font-size:13px;font-weight:500;position:fixed;bottom:24px;left:50%;transform:translate(-50%)translateY(20px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.toast-success{color:var(--success);background:#4ade8026;border:1px solid #4ade804d}.toast-error{color:var(--error);background:#f8717126;border:1px solid #f871714d}.hidden{display:none!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (width<=768px){:root{--panel-width:100%;--header-height:48px}#app-header{padding:0 16px}.logo h1{font-size:15px}.badge{padding:2px 8px;font-size:10px}#app-main{flex-direction:column}#viewport{flex:1;min-height:45vh}.hint{font-size:11px}#control-panel{border-left:none;border-right:none;border-top:1px solid var(--border-color);border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;height:auto;max-height:55vh;transition:transform var(--transition-slow);position:fixed;bottom:0;left:0;right:0;transform:translateY(calc(100% - 52px));box-shadow:0 -4px 30px #0006}#control-panel.drawer-open{transform:translateY(0)}.drawer-handle{display:flex!important}.panel-header{cursor:pointer;padding:12px 16px;position:relative}.panel-header:before{content:"";background:var(--border-color);border-radius:var(--radius-full);width:36px;height:4px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.panel-body{-webkit-overflow-scrolling:touch;max-height:calc(55vh - 52px);overflow-y:auto}.export-buttons{flex-direction:column}.toast{bottom:60px}}.filament-select-row{grid-template-columns:28px 1fr;align-items:center;gap:8px;display:grid}.filament-swatch{border:1px solid #ffffff2e;border-radius:8px;width:28px;height:28px;box-shadow:inset 0 0 0 1px #00000026}.color-note,.shop-warning{color:var(--text-muted);margin:8px 0 0;font-size:11px;line-height:1.45}.purchase-card{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);justify-content:space-between;align-items:end;gap:12px;margin-bottom:10px;padding:12px;display:flex}.purchase-label{color:var(--text-muted);margin-bottom:2px;font-size:11px;display:block}.purchase-price{color:var(--text-primary);font-size:20px;line-height:1.1;display:block}.purchase-note{color:var(--text-muted);white-space:nowrap;font-size:11px}.btn-cart{width:100%}.btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.5)}