:root{--color-text-primary: #37352F;--color-text-secondary: #787774;--color-text-tertiary: #9B9A97;--color-bg-primary: #FFFFFF;--color-bg-secondary: #F7F6F3;--color-bg-tertiary: #EFEEEB;--color-border: #E3E2E0;--color-primary: #2383E2;--color-primary-hover: #0B6BCB;--color-primary-light: #E7F3FF;--status-not-started: #787774;--status-not-started-bg: #F1F1EF;--status-planning: #D9730D;--status-planning-bg: #FBF3DB;--status-in-progress: #2383E2;--status-in-progress-bg: #E7F3FF;--status-complete: #0F7B6C;--status-complete-bg: #DBEDDB;--status-waiting: #9065B0;--status-waiting-bg: #F6F3F8;--priority-low: #37352F;--priority-low-bg: #E3E2E0;--priority-medium: #D9730D;--priority-medium-bg: #FBF3DB;--priority-high: #E03E3E;--priority-high-bg: #FFE2DD;--accent-red: #E16259;--accent-orange: #D9730D;--accent-yellow: #DFAB01;--accent-green: #4DAB9A;--accent-blue: #2383E2;--accent-purple: #9065B0;--accent-pink: #E255A1;--accent-brown: #9F6B53;--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: ui-monospace, "SFMono-Regular", Consolas, monospace;--font-light: 300;--font-regular: 400;--font-medium: 500;--font-bold: 700;--text-xs: 11px;--text-sm: 12px;--text-base: 14px;--text-md: 16px;--text-lg: 18px;--text-xl: 20px;--text-2xl: 24px;--text-3xl: 32px;--text-4xl: 40px;--space-0: 0px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--sidebar-width: 240px;--content-max-width: 900px;--kanban-column-width: 280px;--table-row-height: 42px;--avatar-size-sm: 20px;--avatar-size-md: 24px;--avatar-size-lg: 32px;--radius-sm: 3px;--radius-md: 4px;--radius-lg: 8px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(55, 53, 47, .08);--shadow-md: 0 0 0 1px rgba(55, 53, 47, .09), 0 1px 2px rgba(55, 53, 47, .08);--shadow-lg: 0 0 0 1px rgba(55, 53, 47, .09), 0 4px 12px rgba(55, 53, 47, .12);--transition-fast: 60ms ease;--transition-base: .12s ease;--transition-slow: .2s ease;--primary: var(--color-primary);--primary-hover: var(--color-primary-hover);--danger: var(--priority-high);--danger-hover: #c42d2d;--bg-hover: var(--color-bg-tertiary);--text-muted: var(--color-text-tertiary);--shadow-focus: 0 0 0 2px var(--color-primary-light)}[data-theme=dark]{--color-text-primary: #FFFFFFDE;--color-text-secondary: #FFFFFF9E;--color-text-tertiary: #FFFFFF5E;--color-bg-primary: #191919;--color-bg-secondary: #202020;--color-bg-tertiary: #2C2C2C;--color-border: #373737;--color-primary-light: rgba(35, 131, 226, .15);--status-not-started-bg: #2C2C2C;--status-planning-bg: #4D3800;--status-in-progress-bg: #10304E;--status-complete-bg: #1C3829;--status-waiting-bg: #352643;--priority-low-bg: #2C2C2C;--priority-medium-bg: #4D3800;--priority-high-bg: #4E1818;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);--shadow-md: 0 0 0 1px rgba(255, 255, 255, .1), 0 1px 2px rgba(0, 0, 0, .4);--shadow-lg: 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 12px rgba(0, 0, 0, .5)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-primary);background-color:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.5;height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-bg-tertiary);border:2px solid var(--color-bg-primary);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}.app-layout{display:flex;height:100vh;width:100vw;overflow:hidden}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);background:var(--color-bg-secondary);border-right:1px solid var(--color-border);display:flex;flex-direction:column;z-index:10;transition:background .2s ease,border-color .2s ease}.sidebar-header{padding:var(--space-3) var(--space-4);flex-shrink:0}.sidebar-top-row{display:flex;align-items:center;justify-content:space-between;height:32px}.app-title{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-base);font-weight:var(--font-medium);color:var(--color-text-primary)}.sidebar-actions{display:flex;align-items:center;gap:var(--space-1)}.icon-btn,.help-btn-mini{background:transparent;color:var(--color-text-secondary);width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);cursor:pointer;border:none;transition:background var(--transition-fast)}.icon-btn:hover,.help-btn-mini:hover{background:var(--color-bg-tertiary);color:var(--color-text-primary)}.sidebar-content{flex:1;overflow-y:auto;padding:var(--space-2) var(--space-4);display:flex;flex-direction:column;gap:var(--space-6)}.sidebar-section{display:flex;flex-direction:column;gap:var(--space-2)}.sidebar-section-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-tertiary);margin-bottom:var(--space-1)}.stats-box{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2)}.stats-row{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-xs);line-height:1.4}.stats-row .label{color:var(--color-text-secondary);font-weight:500}.stats-row .value{color:var(--color-text-primary);font-family:var(--font-mono);font-weight:600}.sidebar-footer{padding:var(--space-2) var(--space-4);border-top:1px solid var(--color-border);font-size:var(--text-xs);color:var(--color-text-tertiary);display:flex;justify-content:space-between;background:var(--color-bg-secondary)}.main-content{flex:1;display:flex;flex-direction:column;background:var(--color-bg-primary);position:relative;min-width:0}.tab-nav{display:flex;height:44px;background:var(--color-bg-primary);border-bottom:1px solid var(--color-border);padding:0 var(--space-3);align-items:center;gap:var(--space-4)}.tab-btn{background:transparent;border:none;color:var(--color-text-secondary);padding:4px 0;font-size:var(--text-base);font-weight:var(--font-regular);cursor:pointer;display:flex;align-items:center;gap:var(--space-2);position:relative;transition:color var(--transition-fast)}.tab-btn:hover{color:var(--color-text-primary)}.tab-btn.active{color:var(--color-text-primary);font-weight:var(--font-medium)}.tab-btn.active:after{content:"";position:absolute;bottom:-11px;left:0;width:100%;height:2px;background:var(--color-text-primary)}.tab-content{display:none;flex:1;overflow:hidden;position:relative}.tab-content.active{display:flex;flex-direction:column}.preview-wrapper,.editor-wrapper{flex:1;display:flex;flex-direction:column;overflow:hidden;height:100%}.preview-wrapper{background-color:var(--color-bg-primary);background-image:linear-gradient(45deg,var(--color-bg-secondary) 25%,transparent 25%),linear-gradient(-45deg,var(--color-bg-secondary) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--color-bg-secondary) 75%),linear-gradient(-45deg,transparent 75%,var(--color-bg-secondary) 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}.upload-area-compact{display:flex;flex-direction:column;gap:var(--space-2)}.file-input-group{display:flex;flex-direction:column;gap:4px}.file-input-group label:first-child{font-size:var(--text-xs);color:var(--color-text-secondary)}.upload-button-compact{display:flex!important;align-items:center;gap:var(--space-2);width:100%;padding:6px 12px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg-primary);color:var(--color-text-primary);font-size:var(--text-sm);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast);justify-content:flex-start;margin:0!important;box-shadow:var(--shadow-sm);white-space:normal;word-break:break-all;height:auto;min-height:34px}.upload-button-compact:hover{background:var(--color-bg-tertiary);border-color:var(--color-text-tertiary);color:var(--color-text-primary)}.file-info-compact{font-size:var(--text-xs);color:var(--color-text-secondary);background:transparent;padding:2px 0;word-break:break-all;display:flex;align-items:center;gap:4px}.file-info-compact:before{content:"↳";color:var(--color-text-tertiary)}.action-buttons-row{display:grid;grid-template-columns:1fr auto;gap:var(--space-2);margin-top:var(--space-1)}.primary-btn{background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-sm);padding:6px 12px;font-weight:500;font-size:var(--text-sm);display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;width:100%;transition:background var(--transition-fast);box-shadow:0 1px 2px #0000001a}.primary-btn:hover:not(:disabled){background:var(--color-primary-hover)}.primary-btn:disabled{background:var(--color-bg-tertiary);color:var(--color-text-tertiary);cursor:not-allowed;box-shadow:none}.secondary-btn{background:transparent;border:1px solid var(--color-border);color:var(--color-text-secondary);border-radius:var(--radius-sm);font-size:var(--text-sm);cursor:pointer}.secondary-btn:hover:not(:disabled){background:var(--color-bg-tertiary);color:var(--color-text-primary)}.progress-bar-compact{height:4px;background:var(--color-bg-tertiary);width:100%;border-radius:2px;overflow:hidden}.progress-fill{background:var(--color-primary);height:100%;width:0%;transition:width .2s}.loading-container-compact{display:flex;align-items:center;gap:8px;font-size:var(--text-xs);color:var(--color-text-secondary);justify-content:center;padding:4px 0}.spinner-mini{width:12px;height:12px;border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.export-list{display:flex;flex-direction:column;gap:var(--space-2)}.export-btn{background:var(--color-bg-primary);border:1px solid var(--color-border);color:var(--color-text-primary);padding:6px 10px;border-radius:var(--radius-sm);font-size:var(--text-sm);text-align:center;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;width:100%;transition:background var(--transition-fast);box-shadow:var(--shadow-sm)}.export-btn:hover{background:var(--color-bg-tertiary)}.btn-secondary-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:var(--color-text-primary);text-decoration:underline;text-decoration-color:var(--color-border);padding:8px 0;cursor:pointer;font-size:var(--text-sm);font-weight:500;transition:color var(--transition-fast);border:none}.export-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)}.dropdown-arrow{width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);opacity:.5;margin-left:auto;margin-top:-2px;transition:transform .2s ease;display:inline-block}.sidebar-details{border:none;border-radius:0;background:transparent;overflow:hidden}.sidebar-details summary{padding:6px 4px;font-size:var(--text-xs);font-weight:600;text-transform:uppercase;color:var(--color-text-tertiary);cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;letter-spacing:.04em;transition:color var(--transition-fast)}.sidebar-details summary::-webkit-details-marker{display:none}.sidebar-details summary:hover{color:var(--color-text-primary)}.sidebar-details summary:after{content:"›";font-size:14px;font-weight:400;color:var(--color-text-tertiary);transform:rotate(90deg);transition:transform .2s}.sidebar-details[open] summary:after{transform:rotate(-90deg)}.tool-content{padding:var(--space-2) 0;background:transparent;display:flex;flex-direction:column;gap:var(--space-2)}.tool-btn{width:100%;padding:6px;font-size:var(--text-sm);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-bg-primary);color:var(--color-text-primary);cursor:pointer;margin:0!important;text-align:center;box-shadow:var(--shadow-sm)}.tool-btn.primary{background:var(--color-primary);color:#fff;border:none}.tool-btn.clear{background:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border);height:32px;width:32px;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:none}.tool-btn.clear:hover:not(:disabled){background:var(--color-bg-tertiary);color:var(--accent-red);border-color:var(--accent-red)}.tool-btn.clear:disabled{background:transparent;color:var(--color-text-tertiary);cursor:not-allowed;border-color:var(--color-border)}.editor-wrapper{flex:1;display:flex!important;flex-direction:column;overflow:hidden;height:100%}.editor-header{padding:0 var(--space-4);height:44px!important;background:var(--color-bg-primary);border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.editor-stats{display:flex;gap:var(--space-2)}.pill{font-size:var(--text-xs);background:var(--color-bg-secondary);padding:2px 8px;border-radius:var(--radius-sm);border:1px solid var(--color-border);color:var(--color-text-secondary)}.pill.error{color:var(--accent-red);border-color:transparent;background:var(--priority-high-bg)}.pill.success{color:var(--accent-green);border-color:transparent;background:var(--status-complete-bg)}.editor-toolbar{display:flex;gap:var(--space-2)}.toolbar-btn{background:transparent;border:none;color:var(--color-text-secondary);width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast)}.toolbar-btn:hover:not(:disabled){background:var(--color-bg-tertiary);color:var(--color-text-primary)}.toolbar-btn:disabled{color:var(--color-text-tertiary);cursor:default}.frame-grid-container{flex:1;overflow-y:auto;background:var(--color-bg-primary);display:flex;flex-direction:column;align-items:center;width:100%;padding-bottom:var(--space-4)}.frame-grid{display:grid;grid-template-columns:repeat(17,1fr);gap:1px;padding:var(--space-2);border:none;background:transparent;outline:none;width:100%}.frame-cell{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:0;font-size:9px;font-family:var(--font-mono);font-weight:600;position:relative;min-height:80px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center;cursor:pointer;user-select:none;transition:all .1s ease;overflow:hidden}.frame-cell.empty{background:var(--color-bg-secondary);border:1px solid var(--color-border);color:var(--color-text-tertiary);cursor:default;font-size:var(--text-xs);padding:2px}.frame-cell:not(.empty){box-shadow:var(--shadow-sm)}.frame-cell-sprite{max-width:100%;max-height:55px;object-fit:contain;pointer-events:none;margin:4px 4px 0;flex:1}.frame-cell .frame-name{font-weight:500;margin-bottom:0;line-height:1.1;word-break:normal;overflow-wrap:break-word;position:relative;z-index:2;background:var(--color-bg-tertiary);color:var(--color-text-secondary);padding:3px 2px;border-top:3px solid var(--color-border);width:100%;text-align:center;opacity:1;pointer-events:none;white-space:normal;display:block;min-height:18px}.frame-cell:hover .frame-name{color:var(--color-text-primary)}.frame-cell.selected{background:var(--status-in-progress-bg)!important;border-color:var(--color-primary)!important;box-shadow:0 0 0 1px var(--color-primary);z-index:10}.frame-cell.selected .frame-name{background:var(--color-primary);color:#fff}.frame-cell.removed{background:var(--priority-high-bg);border-color:var(--accent-red);opacity:.8;justify-content:center}.frame-cell.removed .frame-name{background:var(--accent-red);color:#fff}.frame-name.group-0{border-top-color:var(--accent-green)}.frame-name.group-1{border-top-color:var(--accent-blue)}.frame-name.group-2{border-top-color:var(--accent-purple)}.frame-name.group-3{border-top-color:var(--accent-green)}.frame-name.group-4{border-top-color:var(--accent-blue)}.frame-name.group-5{border-top-color:var(--accent-purple)}.frame-name.group-6{border-top-color:var(--accent-green)}.frame-name.group-7{border-top-color:var(--accent-blue)}.frame-name.group-8{border-top-color:var(--accent-purple)}.frame-name.group-9{border-top-color:var(--accent-green)}.frame-name.group-10{border-top-color:var(--accent-blue)}.frame-name.group-11{border-top-color:var(--accent-purple)}.frame-name.group-12{border-top-color:var(--accent-green)}.frame-name.group-13{border-top-color:var(--accent-blue)}.frame-name.group-14{border-top-color:var(--accent-purple)}.frame-name.group-15{border-top-color:var(--accent-green)}.frame-name.group-16{border-top-color:var(--accent-blue)}.frame-name.group-17{border-top-color:var(--accent-purple)}.frame-name.group-18{border-top-color:var(--accent-green)}.frame-name.group-19{border-top-color:var(--accent-blue)}.frame-name.group-20{border-top-color:var(--accent-purple)}.frame-name.group-21{border-top-color:var(--accent-green)}.frame-name.group-22{border-top-color:var(--accent-blue)}.frame-name.group-23{border-top-color:var(--accent-purple)}.delete-btn,.restore-btn{background:var(--bg-tertiary);color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:50%;width:16px;height:16px;font-size:10px;cursor:pointer;position:absolute;top:2px;right:2px;display:flex;align-items:center;justify-content:center;padding:0;z-index:20}.delete-btn:hover{background:var(--accent-red);color:#fff;border-color:transparent}.restore-btn:hover{background:var(--accent-green);color:#fff;border-color:transparent}.editor-footer{display:flex;flex-direction:column;background:var(--color-bg-secondary);border-top:1px solid var(--color-border)}.selection-bar{padding:4px 16px;height:32px!important;display:flex;justify-content:space-between;align-items:center;line-height:1;background:transparent}.selection-bar #selectionText{font-size:var(--text-xs);color:var(--color-text-secondary)}.keyboard-hints{font-size:10px;color:var(--color-text-tertiary);background:transparent;padding:0;border:none}.editor-downloads-label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);font-weight:600;line-height:1}.editor-downloads{margin-top:0;padding:4px 16px;height:48px!important;background:var(--color-bg-secondary);border-top:1px solid var(--color-border)!important;display:flex!important;flex-direction:row!important;align-items:center;gap:var(--space-2)}.editor-downloads .export-btn{width:auto!important;min-width:80px;border-radius:var(--radius-sm);padding:4px 12px;font-size:var(--text-sm);height:28px!important;box-shadow:var(--shadow-sm)}.gif-dropdown-container,.packed-dropdown-container{position:relative;width:100%}.gif-dropdown-menu,.packed-dropdown-menu{display:none;position:absolute;background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);z-index:100;width:100%;left:0;margin-top:4px;box-shadow:var(--shadow-lg);padding:4px}.gif-dropdown-menu.show,.packed-dropdown-menu.show{display:block}.gif-option,.packed-option{width:100%;text-align:center;padding:6px 8px;background:transparent;border:none;color:var(--color-text-primary);cursor:pointer;font-size:var(--text-sm);display:block;border-radius:var(--radius-sm);transition:background var(--transition-fast)}.gif-option:hover,.packed-option:hover{background:var(--color-bg-tertiary)}.gif-option.active,.packed-option.active{color:var(--color-text-primary);background:var(--color-bg-secondary);font-weight:500}.w-100{width:100%}.text-xs{font-size:var(--text-xs)}.text-sm{font-size:var(--text-sm)}.text-muted{color:var(--color-text-secondary)}.mt-2{margin-top:var(--space-2)}.mr-2{margin-right:var(--space-2)}.preview-container{display:flex;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden;position:relative}.preview-container canvas,.preview-container img{max-width:100%;max-height:100%;object-fit:contain;display:block;user-select:none;pointer-events:none}.preview-placeholder{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);text-align:center;position:relative;z-index:1;opacity:.5;color:var(--color-text-tertiary)}.modal{position:fixed;inset:0;background:#00000080;display:none;align-items:center;justify-content:center;z-index:999;backdrop-filter:blur(2px)}.modal.show{display:flex}.modal-content{background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);width:800px;max-width:90%;max-height:85vh;overflow-y:auto;box-shadow:var(--shadow-lg)}.modal-header{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center}.modal-body{padding:var(--space-5);color:var(--color-text-primary);line-height:1.6}.modal-body h2{font-size:var(--text-xl);font-weight:600}.modal-body h3{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin-top:var(--space-6);margin-bottom:var(--space-3);padding-bottom:6px;border-bottom:1px solid var(--color-border)}.modal-body h3:first-child{margin-top:0}.modal-body h4{font-size:var(--text-base);font-weight:600;color:var(--color-text-primary);margin-top:var(--space-4);margin-bottom:var(--space-2)}.modal-body p{font-size:var(--text-base);color:var(--color-text-secondary);margin-bottom:var(--space-3)}.modal-body ul,.modal-body ol{padding-left:20px;margin-bottom:var(--space-3);font-size:var(--text-base);color:var(--color-text-secondary)}.modal-body li{margin-bottom:4px}.modal-body code{background:var(--color-bg-tertiary);padding:2px 4px;border-radius:4px;font-family:var(--font-mono);font-size:85%;color:var(--accent-red)}.modal-body hr{border:none;border-top:1px solid var(--color-border);margin:var(--space-6) 0}.modal-body a{color:var(--color-primary);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}.modal-body a:hover{border-bottom-color:var(--color-primary)}.xnb-file-list-header{padding:8px 12px;background:var(--color-bg-tertiary);border-bottom:1px solid var(--color-border);font-size:var(--text-xs);color:var(--color-text-secondary);font-weight:600}.xnb-file-items{max-height:200px;overflow-y:auto}.xnb-file-item{padding:8px 12px;border-bottom:1px solid var(--color-border);font-size:var(--text-sm);color:var(--color-text-primary);display:flex;align-items:center}.xnb-file-item:last-child{border-bottom:none}.xnb-file-item-content{display:flex;align-items:center;gap:8px;width:100%;min-width:0}.xnb-file-icon{color:var(--color-text-tertiary);display:flex;align-items:center}.xnb-file-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.xnb-file-arrow{color:var(--color-text-tertiary);opacity:.5}.xnb-file-status{display:flex;align-items:center}.xnb-file-status svg{width:14px;height:14px}.xnb-file-item[data-status=success] .xnb-file-status{color:var(--accent-green)}.xnb-file-item[data-status=error] .xnb-file-status{color:var(--accent-red)}.xnb-file-item[data-status=processing] .xnb-file-status{color:var(--accent-blue)}.xnb-actions{padding:8px;display:flex;gap:6px;border-top:1px solid var(--color-border);background:var(--color-bg-secondary)}.xnb-file-error{color:var(--accent-red);font-size:var(--text-xs);margin-top:4px;padding-left:24px}.modal-close{background:none;border:none;color:var(--color-text-secondary);font-size:20px;cursor:pointer}.modal-close:hover{color:var(--color-text-primary)}.grid-info-compact{display:flex;flex-direction:column;gap:var(--space-2)}.grid-row-compact.three-col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--space-1)}.grid-item-compact{display:flex;flex-direction:column;gap:2px;align-items:center}.grid-item-compact .text-muted{font-size:var(--text-xs);letter-spacing:.02em;color:var(--color-text-secondary)}.grid-item-compact div:last-child{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-primary);font-weight:500}.keyboard-hints{display:flex;align-items:center;gap:var(--space-3);color:var(--color-text-tertiary);font-size:var(--text-xs);margin-left:auto}.hint-icon{color:var(--color-text-tertiary);opacity:.7}.hint-item{display:flex;align-items:center;gap:4px}kbd{display:inline-block;padding:0 4px;min-width:16px;height:16px;line-height:14px;font-family:var(--font-mono);font-size:9px;font-weight:500;text-align:center;color:var(--color-text-secondary);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:3px;box-shadow:0 1px 0 var(--color-border)}.separator{color:var(--color-border);font-size:8px}.toast-container{position:fixed;top:90px;right:20px;z-index:1000;display:flex;flex-direction:column;gap:10px;pointer-events:none}.toast{background:var(--color-bg-primary);color:var(--color-text-primary);padding:12px 16px;border-radius:var(--radius-md);border:1px solid var(--color-border);box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:12px;min-width:280px;pointer-events:auto;animation:slideIn .3s ease-out forwards}.toast.hiding{animation:slideOut .3s ease-in forwards}.toast-icon{display:flex;align-items:center}.toast-icon svg{width:20px;height:20px}.toast.success .toast-icon{color:var(--accent-green)}.toast.error .toast-icon{color:var(--accent-red)}.toast.info .toast-icon{color:var(--accent-blue)}.toast-message{font-size:var(--text-sm);font-weight:500}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOut{0%{transform:translate(0);opacity:1}to{transform:translate(100%);opacity:0}}.descriptions-details{border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden;background:var(--color-bg-secondary);width:100%}.descriptions-details summary{padding:8px 12px;font-size:var(--text-sm);font-weight:500;background:var(--color-bg-tertiary);color:var(--color-text-primary);cursor:pointer;user-select:none;border-bottom:1px solid transparent;transition:background .2s;display:flex;align-items:center;justify-content:space-between;list-style:none}.descriptions-details summary::-webkit-details-marker{display:none}.descriptions-details summary:after{content:"›";font-size:16px;color:var(--color-text-tertiary);transition:transform .2s;line-height:1}.descriptions-details[open] summary{border-bottom-color:var(--color-border)}.descriptions-details[open] summary:after{transform:rotate(90deg)}.descriptions-details summary:hover{background:var(--color-bg-hover)}.descriptions-details[open] .dropdown-content{padding:0;max-height:400px;overflow-y:auto;border-top:1px solid var(--color-border);background:var(--color-bg-secondary)}.description-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;padding:8px}.desc-card{background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:10px;display:flex;flex-direction:column;gap:6px;transition:border-color .2s,transform .1s;cursor:pointer}.desc-card:hover{border-color:var(--color-text-tertiary);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.desc-header{display:flex;align-items:center}.desc-tag{background:var(--color-bg-tertiary);color:var(--color-text-primary);font-family:var(--font-mono);font-size:10px;padding:3px 6px;border-radius:3px;border:1px solid var(--color-border);font-weight:600;letter-spacing:-.02em}.desc-text{font-size:var(--text-xs);color:var(--color-text-secondary);line-height:1.3}.json-actions-stack{display:flex;gap:var(--space-2);margin-bottom:var(--space-md);align-items:center}.json-actions-stack .tool-btn{flex:1;font-size:var(--text-xs);height:28px;display:flex;align-items:center;justify-content:center}.json-actions-stack .tool-btn.clear{flex:0 0 28px;height:28px;width:28px}.json-previews textarea{width:100%;height:120px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-secondary);font-family:var(--font-mono);font-size:10px;padding:8px;resize:vertical;outline:none;transition:border-color .2s}.json-previews textarea:focus{border-color:var(--color-primary);color:var(--color-text-primary)}.anim-player{position:fixed;bottom:24px;right:24px;width:240px;background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:1000;display:none;flex-direction:column;overflow:hidden;transition:opacity .2s ease,transform .2s ease;opacity:0;transform:translateY(10px) scale(.95)}.anim-player.visible{display:flex;opacity:1;transform:translateY(0) scale(1)}.anim-player-header{display:flex;align-items:center;justify-content:space-between;padding:0 8px;height:32px;background:var(--color-bg-secondary);border-bottom:1px solid var(--color-border);cursor:grab;user-select:none}.anim-player-header:active{cursor:grabbing}.anim-player-title{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.03em}.anim-player-title svg{color:var(--color-primary)}.anim-player-controls{display:flex;align-items:center;gap:6px}.anim-player-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:transparent;border:none;color:var(--color-text-tertiary);cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.anim-player-btn:hover{background:var(--color-bg-tertiary);color:var(--color-text-primary)}.anim-player-btn.close:hover{background:var(--priority-high-bg);color:var(--accent-red)}.anim-player-body{display:flex;align-items:center;justify-content:center;padding:12px;min-height:120px;background-image:linear-gradient(45deg,var(--color-bg-tertiary) 25%,transparent 25%),linear-gradient(-45deg,var(--color-bg-tertiary) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--color-bg-tertiary) 75%),linear-gradient(-45deg,transparent 75%,var(--color-bg-tertiary) 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0px;background-color:var(--color-bg-primary)}.anim-player-canvas{max-width:100%;max-height:140px;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges;border-radius:2px}.anim-player-footer{display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 10px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border)}.anim-player-btn.play{width:28px;height:28px;background:var(--color-bg-primary);border:1px solid var(--color-border);color:var(--color-text-secondary);border-radius:var(--radius-sm)}.anim-player-btn.play:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-bg-secondary)}.anim-player-frame-count{font-size:10px;font-family:var(--font-mono);color:var(--color-text-secondary);min-width:50px;text-align:center}.anim-player.minimized{width:auto;height:auto;min-width:180px;transform:translateY(0) scale(1)!important}.anim-player.minimized .anim-player-body,.anim-player.minimized .anim-player-footer{display:none}.header-controls{margin-left:auto;display:flex;align-items:center;gap:16px}.toggle-wrapper{display:flex;align-items:center;gap:8px}.toggle-label{font-size:var(--text-sm);color:var(--color-text-secondary);font-weight:500}.switch{position:relative;display:inline-block;width:36px;height:20px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:var(--color-bg-tertiary);transition:.3s;border:1px solid var(--color-border)}.slider:before{position:absolute;content:"";height:14px;width:14px;left:2px;bottom:2px;background-color:var(--color-text-tertiary);transition:.3s}input:checked+.slider{background-color:var(--color-primary);border-color:var(--color-primary)}input:focus+.slider{box-shadow:0 0 1px var(--color-primary)}input:checked+.slider:before{transform:translate(16px);background-color:#fff}.slider.round{border-radius:20px}.slider.round:before{border-radius:50%}.mobile-header{display:none}@media(max-width:768px){html,body{overflow-x:hidden!important;width:100%;max-width:100%;position:relative;margin:0;padding:0}body{overflow-y:auto!important;min-height:100vh}.app-layout{display:flex;flex-direction:column;position:relative;height:auto!important;min-height:100vh;width:100%!important;max-width:100%;overflow-x:hidden!important;overflow-y:visible!important;padding-bottom:0!important}.app-layout *{max-width:100%}.main-content{order:1;width:100%;flex:none!important;height:auto!important;overflow:visible!important;display:block!important}.preview-wrapper{min-height:40vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background-size:10px 10px;padding:16px;gap:16px}.preview-container{min-height:300px;height:100%;width:100%;display:flex;align-items:center;justify-content:center}.sidebar-header,.sidebar-footer{display:none!important}.mobile-header{display:flex!important;align-items:center;padding:8px 16px;background:var(--bg-secondary);border-bottom:1px solid var(--border-primary);height:50px;justify-content:space-between;flex:none}.mobile-actions{display:flex;gap:12px;align-items:center}.sidebar{order:2;position:relative!important;width:100%!important;min-width:0!important;height:auto!important;transform:none!important;left:auto!important;top:auto!important;border-right:none;border-top:1px solid var(--border-primary);z-index:1;transition:none!important;box-shadow:none!important}.app-layout.view-editor .sidebar,.sidebar-overlay,.mobile-menu-btn{display:none!important}.sidebar-content{padding:16px;height:auto!important;overflow:visible!important}.mobile-header{display:flex!important;align-items:center;padding:8px 16px;background:var(--bg-secondary);border-bottom:1px solid var(--border-primary);height:50px;justify-content:space-between}.mobile-menu-btn{background:transparent;border:none;color:var(--text-primary);padding:4px;cursor:pointer}.frame-grid{grid-template-columns:repeat(auto-fill,minmax(40px,1fr))!important;gap:2px}.frame-cell{min-height:60px;font-size:8px}.editor-header{height:auto!important;padding:8px;flex-wrap:wrap;gap:8px;position:static;background:transparent;box-shadow:none;display:block}.editor-stats{display:flex;justify-content:center;width:100%;margin-bottom:8px}.editor-toolbar{position:fixed;inset:50% 16px auto auto;transform:translateY(-50%);width:auto;min-width:0;min-height:200px;background:var(--color-bg-secondary);border:1px solid var(--color-border);padding:16px 8px;border-radius:100px;box-shadow:var(--shadow-lg);z-index:950;display:flex;flex-direction:column;gap:16px;justify-content:center;margin-left:0!important}.toolbar-btn{width:40px;height:40px}.toolbar-btn svg{width:20px;height:20px}.frame-grid-container{padding-right:0!important}.tab-nav{justify-content:flex-start}.tab-btn{flex:1;justify-content:center}.editor-downloads{height:auto!important;flex-wrap:wrap!important;gap:8px;padding:8px!important}.editor-downloads-label{width:100%;margin-bottom:4px}.export-btn{flex:1}.grid-row-compact{grid-template-columns:repeat(auto-fit,minmax(80px,1fr))!important}.keyboard-hints{display:none!important}.mobile-footer{display:flex!important;position:relative;width:100%;background:var(--bg-secondary);border-top:1px solid var(--border-primary);padding:0 16px;height:30px;justify-content:space-between;align-items:center;font-size:10px;color:var(--text-disabled);order:10;margin-top:auto;flex-shrink:0}.app-layout{padding-bottom:0!important}#previewToggleContainer{display:none!important}#animationPlayer{display:flex!important;position:relative!important;width:100%!important;max-width:100%!important;height:auto!important;inset:auto!important;transform:none!important;margin:16px 0!important;box-shadow:none!important;border:1px solid var(--border-primary);background:var(--bg-secondary);z-index:1!important;opacity:1!important;order:2}#animationPlayer:not(.visible){display:none!important}.anim-player-header{cursor:default!important}.anim-player-body{min-height:200px;background-size:16px 16px}.anim-player-controls{display:none!important}}@media(max-width:380px){.frame-grid{grid-template-columns:repeat(auto-fill,minmax(35px,1fr))!important}}