:root{--bg-deep: #0f0f10;--bg-primary: #1a1a1a;--bg-sidebar: #151515;--bg-elevated: #222222;--bg-input: #2a2a2a;--bg-hover: #333333;--text-primary: #ffffff;--text-secondary: #cccccc;--text-tertiary: #aaaaaa;--text-muted: #888888;--text-disabled: #666666;--text-faint: #555555;--brand-primary: #1868da;--brand-hover: #2878ea;--brand-accent: #4a9eff;--border-default: #333333;--border-subtle: #2a2a2a;--border-input: #444444;--border-hover: #555555;--color-success: #4caf50;--color-warning: #febc2e;--color-error: #e74c3c;--warning-bg: rgba(255, 200, 50, .08);--warning-border: rgba(255, 200, 50, .2);--warning-text: #b89a3a;--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--space-xxl: 32px;--radius-sm: 3px;--radius-default: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--transition-quick: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;color:var(--text-primary);background:var(--bg-primary);overflow:hidden;-webkit-user-select:none;user-select:none;height:100vh}#root{height:100vh;display:flex;flex-direction:column}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#444;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#555}.navbar{display:flex;align-items:center;height:44px;background:var(--bg-primary);border-bottom:1px solid var(--border-subtle);padding:0 var(--space-lg);flex-shrink:0}.navbar-brand{font-size:13px;font-weight:600;color:var(--text-primary);letter-spacing:.3px;display:flex;align-items:center;gap:var(--space-sm)}.navbar-logo{height:22px;width:auto}.navbar-nav{display:flex;align-items:center;gap:2px;margin-left:var(--space-xl)}.nav-item{padding:var(--space-sm) var(--space-md);font-size:13px;color:var(--text-muted);text-decoration:none;border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-quick),color var(--transition-quick);border:none;background:none;font-family:inherit}.nav-item:hover{background:#ffffff0d;color:var(--text-secondary)}.nav-item.active{background:#1868da26;color:var(--brand-accent)}.navbar-spacer{flex:1}.navbar-actions{display:flex;align-items:center;gap:var(--space-sm);font-size:11px;color:var(--text-disabled)}.app-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.editor-empty{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--space-xxl)}.editor-empty .drop-zone{max-width:500px;width:100%}.editor-layout{flex:1;display:flex;overflow:hidden}.editor-preview-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.editor-controls-area{width:320px;min-width:320px;border-left:1px solid var(--border-subtle);display:flex;flex-direction:column;overflow:hidden;background:var(--bg-sidebar)}.editor-file-bar{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);border-bottom:1px solid var(--border-subtle);background:var(--bg-sidebar);flex-shrink:0}.editor-file-bar .drop-zone{flex:1;padding:0;border-bottom:none}.editor-file-bar .drop-zone-inner{padding:var(--space-xs) var(--space-sm);border:none}.editor-file-bar .file-info{font-size:12px}.editor-textures-panel{border-bottom:1px solid var(--border-subtle);padding:var(--space-md) var(--space-lg);background:var(--bg-primary);max-height:240px;overflow-y:auto;flex-shrink:0}.editor-text-bar{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-lg);border-top:1px solid var(--border-subtle);background:var(--bg-sidebar);flex-shrink:0}.editor-text-bar label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-disabled);white-space:nowrap}.editor-text-bar input{flex:1;font-size:16px;letter-spacing:3px;text-transform:uppercase;padding:var(--space-sm) var(--space-md)}.editor-text-count{font-size:10px;color:var(--text-disabled);font-family:monospace}.editor-preview-wrapper{flex:1;display:flex;align-items:center;justify-content:center;background:var(--bg-deep);overflow:hidden;min-height:200px}.plate-preview-box{display:flex;align-items:center;justify-content:center;padding:var(--space-xl)}.plate-preview-box canvas{max-width:100%;max-height:100%;border-radius:var(--radius-md);box-shadow:0 4px 24px #0006}.plate-strip{display:flex;gap:2px;padding:var(--space-xs) var(--space-md);border-bottom:1px solid var(--border-subtle);background:var(--bg-primary);overflow-x:auto;flex-shrink:0}.plate-strip-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--space-xs) var(--space-sm);border:1px solid transparent;border-radius:var(--radius-md);background:none;cursor:pointer;font-family:inherit;color:var(--text-muted);transition:background var(--transition-quick),border-color var(--transition-quick),color var(--transition-quick);min-width:64px;flex-shrink:0}.plate-strip-item:hover{background:#ffffff0d;color:var(--text-secondary)}.plate-strip-item.active{background:#1868da1f;border-color:var(--brand-primary);color:var(--brand-accent)}.plate-strip-thumb{width:48px;height:26px;object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--border-default)}.plate-strip-placeholder{width:48px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);border:1px solid var(--border-default);background:var(--bg-elevated)}.plate-strip-label{font-size:9px;font-weight:500;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:60px}.plate-strip-slots{font-size:8px;font-family:monospace;color:var(--text-disabled)}.editor-panel{display:flex;flex-direction:column;flex:1;overflow:hidden}.editor-tabs{display:flex;gap:0;border-bottom:1px solid var(--border-subtle);padding:0 var(--space-lg);flex-shrink:0}.editor-tab{padding:var(--space-sm) var(--space-lg);font-size:12px;font-weight:500;color:var(--text-muted);border:none;background:none;font-family:inherit;cursor:pointer;border-bottom:2px solid transparent;transition:color var(--transition-quick),border-color var(--transition-quick);margin-bottom:-1px}.editor-tab:hover{color:var(--text-secondary)}.editor-tab.active{color:var(--brand-accent);border-bottom-color:var(--brand-accent)}.settings-content{flex:1;overflow-y:auto;padding:var(--space-md) var(--space-lg)}.settings-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text-disabled);font-size:12px;gap:var(--space-sm)}.settings-section{margin-bottom:var(--space-lg)}.settings-section:last-child{margin-bottom:0}.settings-section-header{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm);padding-bottom:var(--space-xs);border-bottom:1px solid var(--border-subtle)}.settings-section-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted)}.setting-row{display:flex;align-items:center;gap:var(--space-sm);padding:4px 0}.setting-row label{font-size:12px;color:var(--text-secondary);cursor:pointer}.slider-row{display:flex;align-items:center;gap:var(--space-sm);padding:4px 0}.slider-label{font-size:11px;color:var(--text-secondary);min-width:42px}.slider-input{flex:1;-webkit-appearance:none;appearance:none;height:4px;background:var(--bg-input);border-radius:2px;outline:none}.slider-input::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--brand-primary);cursor:pointer;border:2px solid var(--bg-primary)}.slider-input::-webkit-slider-thumb:hover{background:var(--brand-hover)}.slider-num{width:64px;text-align:right;font-size:10px;font-family:monospace}.btn-reset-axis{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:none;border-radius:var(--radius-sm);background:var(--bg-input);color:var(--text-muted);cursor:pointer;flex-shrink:0}.btn-reset-axis:hover{background:var(--brand-primary);color:var(--text-primary)}.color-input-group{display:flex;align-items:center;gap:var(--space-sm)}.color-swatch{width:24px;height:24px;border-radius:var(--radius-default);border:1px solid var(--border-input);cursor:pointer;flex-shrink:0;padding:0}.color-text-input{width:100px;font-size:11px}.toggle-switch{position:relative;width:36px;height:20px;flex-shrink:0;display:inline-block}.toggle-slider{position:absolute;cursor:pointer;inset:0;background:var(--bg-input);border:1px solid var(--border-input);border-radius:10px;transition:background var(--transition-quick),border-color var(--transition-quick)}.toggle-slider:before{content:"";position:absolute;height:14px;width:14px;left:2px;bottom:2px;background:var(--text-muted);border-radius:50%;transition:transform var(--transition-quick),background var(--transition-quick)}.toggle-switch input:checked+.toggle-slider{background:var(--brand-primary);border-color:var(--brand-primary)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(16px);background:#fff}.xml-editor-area{display:flex;flex-direction:column;flex:1;overflow:hidden}.xml-textarea{flex:1;resize:none;background:var(--bg-deep);color:var(--text-primary);border:none;padding:var(--space-md);font-family:Consolas,Fira Code,monospace;font-size:11px;line-height:1.5;outline:none;tab-size:2}.xml-editor-actions{padding:var(--space-sm) var(--space-md);border-top:1px solid var(--border-subtle);display:flex;justify-content:flex-end;gap:var(--space-sm);flex-shrink:0}.drop-zone{display:flex;align-items:center;justify-content:center;padding:var(--space-lg) var(--space-xl)}.drop-zone-inner{display:flex;align-items:center;justify-content:center;width:100%;padding:var(--space-xl) var(--space-xxl);border:2px dashed var(--border-default);border-radius:var(--radius-lg);color:var(--text-muted);font-size:13px;cursor:pointer;transition:border-color var(--transition-quick),color var(--transition-quick),background var(--transition-quick)}.drop-zone-inner:hover{border-color:var(--brand-primary);color:var(--text-secondary);background:#1868da0d}.drop-zone-inner.drag-over{border-color:var(--brand-accent);color:var(--text-primary);background:#1868da1a}.drop-zone.file-loaded .drop-zone-inner{padding:var(--space-xs) var(--space-sm);border:none;cursor:default}.drop-zone.file-loaded .drop-zone-inner:hover{background:transparent;color:var(--text-muted)}.drop-prompt{display:flex;align-items:center;gap:var(--space-sm)}.drop-prompt svg{width:18px;height:18px;flex-shrink:0;opacity:.6}.file-info{display:flex;align-items:center;gap:var(--space-sm);font-size:13px;font-weight:500;color:var(--text-secondary)}.file-info svg{color:var(--text-muted);flex-shrink:0}.file-name{color:var(--brand-accent)}.file-change-btn{margin-left:var(--space-sm);font-size:11px;color:var(--text-disabled);cursor:pointer;transition:color var(--transition-quick);background:none;border:none;font-family:inherit}.file-change-btn:hover{color:var(--text-secondary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:6px 12px;font-family:inherit;font-size:12px;font-weight:500;border:1px solid var(--border-input);border-radius:var(--radius-default);background:transparent;color:var(--text-muted);cursor:pointer;transition:all var(--transition-quick);white-space:nowrap}.btn:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-hover)}.btn:active{transform:scale(.98)}.btn-primary{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}.btn-primary:hover{background:var(--brand-hover);border-color:var(--brand-hover);color:#fff}.btn-sm{padding:var(--space-xs) var(--space-sm);font-size:11px}.btn:disabled{opacity:.4;cursor:not-allowed}.btn svg{width:14px;height:14px}input[type=text],input[type=number]{padding:6px var(--space-md);font-family:inherit;font-size:12px;background:var(--bg-input);border:1px solid var(--border-input);border-radius:var(--radius-default);color:var(--text-primary);outline:none;transition:border-color var(--transition-quick)}input[type=text]:focus,input[type=number]:focus{border-color:var(--brand-primary)}input[type=text]::placeholder,input[type=number]::placeholder{color:var(--text-faint)}input[type=number]{padding:4px var(--space-sm);font-size:11px;-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.badge{display:inline-flex;align-items:center;gap:4px;padding:1px 6px;border-radius:var(--radius-sm);font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.badge-success{background:#4caf5026;color:var(--color-success);border:1px solid rgba(76,175,80,.25)}.badge-warning{background:var(--warning-bg);color:var(--warning-text);border:1px solid var(--warning-border)}.badge-error{background:#e74c3c26;color:var(--color-error);border:1px solid rgba(231,76,60,.25)}.badge-default{background:var(--bg-elevated);color:var(--text-disabled);border:1px solid var(--border-default)}.texture-upload{display:flex;flex-direction:column;gap:var(--space-sm)}.texture-drop{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-md);border:2px dashed var(--border-default);border-radius:var(--radius-md);color:var(--text-muted);font-size:12px;cursor:pointer;transition:border-color var(--transition-quick),color var(--transition-quick),background var(--transition-quick)}.texture-drop:hover{border-color:var(--brand-primary);color:var(--text-secondary);background:#1868da0d}.texture-drop.drag-over{border-color:var(--brand-accent);color:var(--text-primary);background:#1868da1a}.texture-status-list{display:flex;flex-direction:column;gap:2px}.texture-status-row{display:flex;align-items:center;gap:var(--space-sm);padding:2px 0;font-size:11px}.texture-status-name{color:var(--text-secondary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.texture-assign-select{background:var(--bg-input);border:1px solid var(--border-input);border-radius:var(--radius-default);color:var(--text-primary);font-size:10px;padding:2px 4px;font-family:inherit}.toast-container{position:fixed;bottom:16px;right:16px;display:flex;flex-direction:column-reverse;gap:var(--space-sm);z-index:10000;pointer-events:none}.toast{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);background:#1e1e1ef2;border:1px solid var(--border-input);border-radius:var(--radius-lg);box-shadow:0 4px 20px #00000080;font-size:13px;color:var(--text-primary);pointer-events:auto;animation:slideIn .3s ease-out;max-width:360px}.toast.success{border-left:3px solid var(--color-success)}.toast.warning{border-left:3px solid var(--color-warning)}.toast.error{border-left:3px solid var(--color-error)}@keyframes slideIn{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}#footer{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;background:var(--bg-sidebar);border-top:1px solid var(--border-subtle);z-index:100;flex-shrink:0}.footer-left{display:flex;flex-direction:column;gap:4px}.footer-copyright{font-size:11px;color:#e9edf5}.footer-branding{display:flex;align-items:center;gap:4px;font-size:10px;color:#e9edf5;letter-spacing:.5px}.footer-branding a{display:flex;align-items:center;text-decoration:none}.footer-branding img{height:10px;width:auto}.footer-right{display:flex;gap:16px}.footer-right a{font-size:11px;color:#e9edf5;text-decoration:none}.footer-right a:hover{text-decoration:underline}