:root{--bg-primary:#fff;--bg-secondary:#f8f9fa;--bg-tertiary:#f0f1f3;--bg-sidebar:#0f0f0f;--bg-sidebar-hover:#1a1a1a;--bg-sidebar-active:#252525;--text-primary:#1a1a1a;--text-secondary:#6b7280;--text-tertiary:#9ca3af;--text-sidebar:#e5e5e5;--text-sidebar-muted:#737373;--border:#e5e7eb;--border-light:#f3f4f6;--border-focus:var(--accent);--accent:#b8956a;--accent-light:#d4b896;--accent-dark:#9a7a55;--accent-bg:#b8956a14;--accent-bg-hover:#b8956a24;--success:#10b981;--success-bg:#10b9811a;--warning:#f59e0b;--warning-bg:#f59e0b1a;--danger:#ef4444;--danger-bg:#ef44441a;--font-body:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-heading:"Outfit", "Inter", sans-serif;--text-xs:.75rem;--text-sm:.8125rem;--text-base:.9375rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:2rem;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--leading-tight:1.2;--leading-normal:1.5;--leading-relaxed:1.7;--tracking-tight:-.02em;--tracking-normal:0;--tracking-wide:.02em;--tracking-wider:.05em;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px;--shadow-xs:0 1px 2px #0000000a;--shadow-sm:0 1px 3px #0000000f, 0 1px 2px #0000000a;--shadow-md:0 4px 6px -1px #0000000f, 0 2px 4px -2px #0000000a;--shadow-lg:0 10px 15px -3px #0000000f, 0 4px 6px -4px #0000000a;--shadow-xl:0 20px 25px -5px #00000014, 0 8px 10px -6px #0000000a;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.35s ease;--sidebar-width:240px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--weight-regular);line-height:var(--leading-normal);color:var(--text-primary);background:var(--bg-primary);overflow:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:var(--weight-semibold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight)}a{color:var(--accent);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--accent-dark)}img{max-width:100%;display:block}button{font-family:var(--font-body);cursor:pointer;font-size:inherit;background:0 0;border:none}input,textarea,select{font-family:var(--font-body);font-size:var(--text-base)}#app{width:100vw;height:100vh;display:flex}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);background:var(--bg-sidebar);z-index:10;border-right:1px solid #ffffff0f;flex-direction:column;display:flex}.sidebar-header{padding:var(--space-6) var(--space-5);align-items:center;gap:var(--space-3);border-bottom:1px solid #ffffff0f;display:flex}.logo-mark{flex-shrink:0}.logo-text{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text-sidebar);letter-spacing:var(--tracking-tight)}.sidebar-nav{padding:var(--space-4) var(--space-3);gap:var(--space-1);flex-direction:column;flex:1;display:flex}.nav-btn{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);color:var(--text-sidebar-muted);font-size:var(--text-sm);font-weight:var(--weight-medium);transition:all var(--transition-fast);text-align:left;width:100%;display:flex}.nav-btn:hover{background:var(--bg-sidebar-hover);color:var(--text-sidebar)}.nav-btn.active{background:var(--bg-sidebar-active);color:#fff}.nav-btn svg{opacity:.7;flex-shrink:0}.nav-btn.active svg,.nav-btn:hover svg{opacity:1}.sidebar-footer{padding:var(--space-4) var(--space-4);border-top:1px solid #ffffff0f}.sidebar-version{font-size:var(--text-xs);color:var(--text-sidebar-muted)}.sidebar-storage{margin-bottom:var(--space-3);border-radius:var(--radius-sm);transition:all var(--transition-fast);cursor:pointer;background:#ffffff08;border:1px solid #ffffff0f;padding:8px 10px}.sidebar-storage:hover{background:#ffffff0f;border-color:#ffffff1a}.storage-header{justify-content:space-between;align-items:center;margin-bottom:5px;display:flex}.storage-label{color:var(--text-sidebar-muted);letter-spacing:.02em;align-items:center;gap:5px;font-size:.68rem;font-weight:500;display:flex}.storage-label svg{opacity:.6;flex-shrink:0}.storage-free-text{color:var(--text-sidebar-muted);letter-spacing:.01em;opacity:.85;font-size:.68rem;font-weight:500}.storage-bar{background:#ffffff14;border-radius:2px;width:100%;height:3px;overflow:hidden}.storage-progress{background:var(--accent);opacity:.85;border-radius:2px;height:100%;transition:width .4s,background-color .3s}.storage-progress.warning{opacity:1;background:#f59e0b!important}.storage-progress.danger{opacity:1;background:#ef4444!important}.mobile-topbar{background:var(--bg-sidebar);z-index:100;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;height:56px;padding:10px 16px;display:none;position:fixed;top:0;left:0;right:0}.mobile-topbar-left{align-items:center;gap:12px;display:flex}.mobile-btn-menu{color:var(--text-sidebar);cursor:pointer;transition:background var(--transition-fast);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;display:flex}.mobile-btn-menu:active{background:var(--bg-sidebar-hover)}.sidebar-backdrop{-webkit-backdrop-filter:blur(4px);z-index:998;opacity:0;pointer-events:none;background:#000000a6;transition:opacity .25s;display:none;position:fixed;inset:0}.sidebar-header-brand{align-items:center;gap:var(--space-3);display:flex}.btn-close-sidebar{color:var(--text-sidebar-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;border-radius:6px;padding:6px;display:none}.btn-close-sidebar:hover{color:#fff;background:var(--bg-sidebar-hover)}.storage-alert-box{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);margin-bottom:var(--space-5);line-height:1.5;display:flex}.storage-alert-box.warning{color:#92400e;background:#fef3c7;border:1px solid #fcd34d}.storage-alert-box.danger{color:#991b1b;background:#fee2e2;border:1px solid #fca5a5}.storage-alert-box svg{flex-shrink:0;margin-top:2px}.project-card-analytics{align-items:center;margin-top:8px;display:flex}.analytics-pill{border-radius:var(--radius-full);align-items:center;gap:5px;padding:3px 8px;font-size:.7rem;font-weight:500;line-height:1.2;display:inline-flex}.analytics-pill.viewed{color:#059669;background:#10b9811a;border:1px solid #10b98140}.analytics-pill.unviewed{background:var(--bg-tertiary);color:var(--text-tertiary);border:1px solid var(--border)}.stats-overview-grid{gap:var(--space-3);margin-top:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(130px,1fr));display:grid}.stat-box{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;gap:4px;padding:14px 16px;display:flex}.stat-number{font-family:var(--font-heading);color:var(--text-primary);font-size:1.5rem;font-weight:700;line-height:1}.stat-value-text{color:var(--text-primary);font-size:.92rem;font-weight:600}.stat-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;font-size:.7rem;font-weight:500}.recent-views-list{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-primary);flex-direction:column;gap:4px;max-height:200px;padding:8px 12px;display:flex;overflow-y:auto}.recent-view-row{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:6px 0;font-size:.8rem;display:flex}.recent-view-row:last-child{border-bottom:none}.recent-view-info{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.recent-view-device{color:var(--text-primary);font-weight:500}.recent-view-location{color:var(--text-secondary);background:var(--bg-secondary);border-radius:var(--radius-sm);border:1px solid var(--border-light);align-items:center;padding:1px 6px;font-size:.72rem;display:inline-flex}.recent-view-time{color:var(--text-secondary);white-space:nowrap;font-size:.75rem}.recent-view-duration{color:var(--accent);background:var(--accent-bg);border-radius:var(--radius-sm);white-space:nowrap;border:1px solid #b7cf1f33;align-items:center;gap:4px;padding:1px 7px;font-size:.72rem;font-weight:500;display:inline-flex}.top-img-count-badge{color:var(--accent);background:var(--accent-bg);border-radius:var(--radius-full);white-space:nowrap;align-items:center;padding:2px 8px;font-size:.72rem;font-weight:600;display:inline-flex}.sidebar-section-header{padding:var(--space-4) var(--space-4) var(--space-2);margin-top:var(--space-2);letter-spacing:.08em;color:var(--text-sidebar-muted);border-top:1px solid #ffffff0f;justify-content:space-between;align-items:center;font-size:.68rem;font-weight:600;display:flex}.sidebar-btn-add{color:var(--text-sidebar-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:2px 4px;display:flex}.sidebar-btn-add:hover{background:var(--bg-sidebar-hover);color:var(--text-sidebar)}.sidebar-projects-list{max-height:280px;padding:0 var(--space-1);flex-direction:column;gap:2px;display:flex;overflow-y:auto}.sidebar-projects-list::-webkit-scrollbar{width:4px}.sidebar-projects-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}.sidebar-project-item{align-items:center;gap:var(--space-2);border-radius:var(--radius-sm);color:var(--text-sidebar-muted);text-align:left;cursor:pointer;width:100%;transition:all var(--transition-fast);white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;padding:7px 10px;font-size:.8rem;font-weight:400;display:flex;overflow:hidden}.sidebar-project-item:hover{background:var(--bg-sidebar-hover);color:var(--text-sidebar)}.sidebar-project-item.active{background:var(--bg-sidebar-active);color:#fff;font-weight:500}.sidebar-project-dot{background:var(--accent);opacity:.6;border-radius:50%;flex-shrink:0;width:6px;height:6px}.sidebar-project-item.active .sidebar-project-dot,.sidebar-project-item:hover .sidebar-project-dot{opacity:1}.sidebar-project-name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.projects-toolbar{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.projects-search-box{flex:1;min-width:260px;max-width:440px;position:relative}.projects-search-box svg{color:var(--text-tertiary);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.projects-search-box input{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-primary);width:100%;font-size:var(--text-sm);color:var(--text-primary);transition:border-color var(--transition-fast);outline:none;padding:10px 36px 10px 38px}.projects-search-box input:focus{border-color:var(--accent)}.btn-clear-search{color:var(--text-tertiary);cursor:pointer;background:0 0;border:none;border-radius:50%;padding:2px 6px;font-size:18px;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.btn-clear-search:hover{color:var(--text-primary)}.projects-toolbar-actions{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.select-wrapper{position:relative}.form-select{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-primary);font-size:var(--text-sm);color:var(--text-primary);cursor:pointer;transition:border-color var(--transition-fast);outline:none;padding:10px 14px}.form-select:focus{border-color:var(--accent)}.main-content{background:var(--bg-secondary);flex:1;overflow-y:auto}.page-header{padding:var(--space-8) var(--space-10);background:var(--bg-primary);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;display:flex}.page-header h2{font-size:var(--text-2xl);color:var(--text-primary)}.page-header-subtitle{font-size:var(--text-sm);color:var(--text-secondary);margin-top:var(--space-1)}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-medium);transition:all var(--transition-fast);white-space:nowrap;line-height:1;display:inline-flex}.btn-primary{background:var(--accent);color:#fff;box-shadow:0 1px 3px #b8956a4d}.btn-primary:hover{background:var(--accent-dark);transform:translateY(-1px);box-shadow:0 4px 12px #b8956a59}.btn-secondary{background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg-secondary);border-color:var(--text-tertiary)}.btn-ghost{color:var(--text-secondary);padding:var(--space-2) var(--space-3)}.btn-ghost:hover{background:var(--bg-tertiary);color:var(--text-primary)}.btn-danger{color:var(--danger)}.btn-danger:hover{background:var(--danger-bg)}.btn-icon{padding:var(--space-2);border-radius:var(--radius-sm)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--text-base);border-radius:var(--radius-lg)}.card{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);transition:all var(--transition-base);overflow:hidden}.card:hover{box-shadow:var(--shadow-lg);border-color:var(--border-light)}.card-body{padding:var(--space-5)}.projects-grid{gap:var(--space-6);padding:var(--space-8) var(--space-10);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.project-card{cursor:pointer;position:relative}.project-card-thumb{aspect-ratio:16/10;background:var(--bg-tertiary);justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.project-card-thumb img{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-slow)}.project-card:hover .project-card-thumb img{transform:scale(1.05)}.project-card-thumb-placeholder{color:var(--text-tertiary);align-items:center;gap:var(--space-2);font-size:var(--text-sm);flex-direction:column;display:flex}.project-card-thumb-placeholder svg{opacity:.4}.project-card-body{padding:var(--space-5)}.project-card-name{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--space-1)}.project-card-meta{font-size:var(--text-sm);color:var(--text-secondary);align-items:center;gap:var(--space-2);display:flex}.project-card-badge{padding:var(--space-1) var(--space-2);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-medium);background:var(--accent-bg);color:var(--accent-dark);align-items:center;display:inline-flex}.project-card-actions{top:var(--space-3);right:var(--space-3);opacity:0;transition:opacity var(--transition-fast);position:absolute}.project-card:hover .project-card-actions{opacity:1}.new-project-card{border:2px dashed var(--border);cursor:pointer;min-height:220px;transition:all var(--transition-base);border-radius:var(--radius-lg);background:0 0;justify-content:center;align-items:center;display:flex}.new-project-card:hover{border-color:var(--accent);background:var(--accent-bg)}.new-project-card-inner{text-align:center;color:var(--text-tertiary);transition:color var(--transition-fast)}.new-project-card:hover .new-project-card-inner{color:var(--accent)}.new-project-card-inner svg{margin-bottom:var(--space-2)}.new-project-card-inner p{font-size:var(--text-sm);font-weight:var(--weight-medium)}.form-group{margin-bottom:var(--space-5)}.form-label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);margin-bottom:var(--space-2);letter-spacing:var(--tracking-wide);text-transform:uppercase;display:block}.form-input,.form-textarea,.form-select{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-primary);color:var(--text-primary);font-size:var(--text-base);transition:all var(--transition-fast);outline:none}.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-bg)}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-tertiary)}.form-textarea{resize:vertical;min-height:120px;line-height:var(--leading-relaxed)}.form-row{gap:var(--space-5);grid-template-columns:1fr 1fr;display:grid}.form-hint{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:var(--space-1)}.section{padding:var(--space-8) var(--space-10)}.section-title{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--space-6);align-items:center;gap:var(--space-3);display:flex}.section-card{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-8)}.editor-layout{flex-direction:column;height:100%;display:flex}.editor-header{padding:var(--space-5) var(--space-8);background:var(--bg-primary);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.editor-header-left{align-items:center;gap:var(--space-4);display:flex}.editor-header-right{align-items:center;gap:var(--space-3);display:flex}.editor-back-btn{align-items:center;gap:var(--space-2);color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);transition:all var(--transition-fast);display:flex}.editor-back-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.editor-project-name{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:var(--weight-semibold)}.editor-tabs{padding:0 var(--space-8);background:var(--bg-primary);border-bottom:1px solid var(--border);flex-shrink:0;gap:0;display:flex}.editor-tab{padding:var(--space-4) var(--space-6);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);transition:all var(--transition-fast);border-bottom:2px solid #0000;position:relative;top:1px}.editor-tab:hover{color:var(--text-primary)}.editor-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.editor-body{background:var(--bg-secondary);flex:1;overflow-y:auto}.image-uploader{border:2px dashed var(--border);border-radius:var(--radius-lg);padding:var(--space-10);text-align:center;cursor:pointer;transition:all var(--transition-base);background:var(--bg-primary)}.image-uploader:hover,.image-uploader.dragover{border-color:var(--accent);background:var(--accent-bg)}.image-uploader-icon{color:var(--text-tertiary);margin-bottom:var(--space-3)}.image-uploader:hover .image-uploader-icon,.image-uploader.dragover .image-uploader-icon{color:var(--accent)}.image-uploader-text{font-size:var(--text-sm);color:var(--text-secondary)}.image-uploader-text strong{color:var(--accent)}.image-uploader-hint{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:var(--space-2)}.upload-progress-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);margin-top:var(--space-4);box-shadow:var(--shadow-sm);animation:.2s fadeIn}.upload-progress-header{margin-bottom:var(--space-2);justify-content:space-between;align-items:center;display:flex}.upload-progress-title{align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-primary);font-weight:500;display:flex}.upload-progress-percent{font-size:var(--text-sm);color:var(--accent);font-variant-numeric:tabular-nums;font-weight:600}.upload-progress-bar-bg{background:var(--bg-tertiary,#e5e5e5);border-radius:var(--radius-full);width:100%;height:8px;margin-bottom:var(--space-2);overflow:hidden}.upload-progress-bar-fill{background:linear-gradient(90deg, var(--accent), var(--accent-light,#c49a6c));border-radius:var(--radius-full);height:100%;transition:width .25s ease-out}.upload-progress-filename{font-size:var(--text-xs);color:var(--text-tertiary);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.images-grid{gap:var(--space-4);margin-top:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(180px,1fr));display:grid}.image-card{border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-primary);transition:all var(--transition-base);group:true;position:relative;overflow:hidden}.image-card:hover{box-shadow:var(--shadow-md)}.image-card-preview{aspect-ratio:4/3;background:var(--bg-tertiary);overflow:hidden}.image-card-preview img{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-slow)}.image-card:hover .image-card-preview img{transform:scale(1.05)}.image-card-info{padding:var(--space-3)}.image-card-name{font-size:var(--text-xs);color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.image-card-category{font-size:var(--text-xs);color:var(--accent);font-weight:var(--weight-medium);margin-top:var(--space-1)}.image-card-overlay{justify-content:center;align-items:center;gap:var(--space-2);opacity:0;transition:opacity var(--transition-fast);background:#00000080;display:flex;position:absolute;inset:0}.image-card:hover .image-card-overlay{opacity:1}.image-card-overlay button{padding:var(--space-2);border-radius:var(--radius-sm);color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background var(--transition-fast);background:#fff3}.image-card-overlay button:hover{background:#ffffff59}.image-card.is-hero{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-bg)}.image-card.is-hero:after{content:"★ HERO";top:var(--space-2);left:var(--space-2);background:var(--accent);color:#fff;font-size:10px;font-weight:var(--weight-bold);border-radius:var(--radius-full);letter-spacing:var(--tracking-wider);padding:2px 8px;position:absolute}.category-filters{gap:var(--space-2);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.category-chip{padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-medium);background:var(--bg-tertiary);color:var(--text-secondary);transition:all var(--transition-fast);border:1px solid #0000}.category-chip:hover{background:var(--bg-primary);border-color:var(--border)}.category-chip.active{background:var(--accent-bg);color:var(--accent-dark);border-color:var(--accent-light)}.custom-fields-list{gap:var(--space-3);flex-direction:column;display:flex}.custom-field-row{gap:var(--space-3);grid-template-columns:1fr 2fr auto;align-items:start;display:grid}.custom-field-row .btn-icon{margin-top:var(--space-1)}.toggle-wrapper{align-items:center;gap:var(--space-3);display:flex}.toggle{background:var(--bg-tertiary);border-radius:var(--radius-full);cursor:pointer;width:44px;height:24px;transition:background var(--transition-fast);border:1px solid var(--border);position:relative}.toggle.active{background:var(--accent);border-color:var(--accent)}.toggle:after{content:"";width:18px;height:18px;transition:transform var(--transition-fast);box-shadow:var(--shadow-sm);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px}.toggle.active:after{transform:translate(20px)}.toggle-label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-primary)}.branding-preview{padding:var(--space-8);border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--bg-primary);text-align:center}.branding-logo-upload{border-radius:var(--radius-lg);border:2px dashed var(--border);cursor:pointer;width:120px;height:120px;transition:all var(--transition-base);margin:0 auto var(--space-5);background:var(--bg-secondary);justify-content:center;align-items:center;display:flex;overflow:hidden}.branding-logo-upload:hover{border-color:var(--accent);background:var(--accent-bg)}.branding-logo-upload img{object-fit:contain;width:100%;height:100%;padding:var(--space-2)}.color-swatch-group{gap:var(--space-3);margin-top:var(--space-3);align-items:center;display:flex}.color-swatch{border-radius:var(--radius-md);border:2px solid var(--border);cursor:pointer;width:40px;height:40px;transition:all var(--transition-fast);position:relative;overflow:hidden}.color-swatch:hover{box-shadow:var(--shadow-md);transform:scale(1.1)}.color-swatch.selected{border-color:var(--text-primary);box-shadow:0 0 0 2px var(--bg-primary), 0 0 0 4px var(--text-primary)}.color-swatch input[type=color]{cursor:pointer;background:0 0;border:none;width:calc(100% + 16px);height:calc(100% + 16px);position:absolute;inset:-8px}.color-hex-input{width:100px;padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-sm);text-align:center;text-transform:uppercase;font-family:monospace}.color-hex-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-bg);outline:none}.palette-presets{gap:var(--space-3);margin-top:var(--space-4);flex-wrap:wrap;display:flex}.palette-preset{padding:var(--space-1);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);background:var(--bg-primary);border:2px solid #0000;gap:2px;display:flex}.palette-preset:hover{border-color:var(--border);transform:scale(1.05)}.palette-preset.selected{border-color:var(--text-primary)}.palette-preset-swatch{border-radius:3px;width:20px;height:28px}.palette-preset-swatch:first-child{border-radius:5px 3px 3px 5px}.palette-preset-swatch:last-child{border-radius:3px 5px 5px 3px}.toast-container{bottom:var(--space-6);right:var(--space-6);z-index:1000;gap:var(--space-3);flex-direction:column;display:flex;position:fixed}.toast{align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-5);background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);font-size:var(--text-sm);font-weight:var(--weight-medium);min-width:280px;max-width:420px;animation:.3s forwards toast-in;display:flex}.toast.toast-success{border-left:3px solid var(--success)}.toast.toast-error{border-left:3px solid var(--danger)}.toast.toast-warning{border-left:3px solid var(--warning)}.toast.removing{animation:.3s forwards toast-out}.toast-icon{flex-shrink:0}.toast-message{color:var(--text-primary);flex:1}@keyframes toast-in{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes toast-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(40px)}}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#00000080;justify-content:center;align-items:center;animation:.2s modal-overlay-in;display:flex;position:fixed;inset:0}.modal-overlay.hidden{display:none}.modal-content{background:var(--bg-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);width:90%;max-width:480px;padding:var(--space-8);animation:.25s modal-content-in}.modal-title{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:var(--weight-semibold);margin-bottom:var(--space-3)}.modal-body{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-6);line-height:var(--leading-relaxed)}.modal-actions{justify-content:flex-end;gap:var(--space-3);display:flex}@keyframes modal-overlay-in{0%{opacity:0}to{opacity:1}}@keyframes modal-content-in{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.empty-state{text-align:center;padding:var(--space-16) var(--space-8);color:var(--text-tertiary)}.empty-state svg{margin-bottom:var(--space-4);opacity:.3}.empty-state h3{font-size:var(--text-lg);color:var(--text-secondary);margin-bottom:var(--space-2)}.empty-state p{font-size:var(--text-sm);max-width:360px;margin:0 auto}.main-content::-webkit-scrollbar{width:6px}.editor-body::-webkit-scrollbar{width:6px}.main-content::-webkit-scrollbar-track{background:0 0}.editor-body::-webkit-scrollbar-track{background:0 0}.main-content::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.editor-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.main-content::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}.editor-body::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}.category-input-wrapper{gap:var(--space-2);margin-top:var(--space-2);align-items:center;display:flex}.category-input-wrapper .form-input{padding:var(--space-2) var(--space-3);font-size:var(--text-sm);flex:1}.spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=768px){#app{flex-direction:column;width:100vw;height:100vh;padding-top:56px;overflow-x:hidden}.mobile-topbar{display:flex}.sidebar-backdrop{display:block}.sidebar-backdrop.active{opacity:1;pointer-events:auto}.btn-close-sidebar{justify-content:center;align-items:center;display:flex}.sidebar{z-index:1000;background:var(--bg-sidebar);width:280px;max-width:85vw;transition:transform .3s cubic-bezier(.16,1,.3,1);position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:4px 0 24px #00000080}.sidebar.open{transform:translate(0)}.logo-text,.nav-btn span,.sidebar-section-header span,.sidebar-project-name{display:inline-block!important}.sidebar-header{padding:var(--space-4) var(--space-4);justify-content:space-between}.sidebar-header-brand{align-items:center;gap:var(--space-3);display:flex}.nav-btn{padding:var(--space-3) var(--space-4);justify-content:flex-start}.main-content{flex:1;width:100%;padding:0;overflow-y:auto}.page-header{padding:var(--space-4) var(--space-4) var(--space-2);align-items:flex-start;gap:var(--space-3);flex-direction:column}.page-header .btn-primary{justify-content:center;width:100%}.projects-toolbar{padding:0 var(--space-4);align-items:stretch;gap:var(--space-2);flex-direction:column}.projects-search-box{width:100%;min-width:0;max-width:100%}.projects-toolbar-actions{gap:var(--space-2);flex-direction:column;width:100%}.select-wrapper,.form-select{width:100%}.projects-grid{padding:0 var(--space-4) var(--space-6);grid-template-columns:1fr}.editor-header{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);flex-direction:column}.editor-header-left{width:100%}.editor-header-right{gap:var(--space-2);flex-wrap:wrap;width:100%;display:flex}.editor-header-right .btn{flex:1;justify-content:center;padding:8px 10px;font-size:.8rem}.editor-tabs{padding:0 var(--space-4);white-space:nowrap;overflow-x:auto}.editor-body{padding:var(--space-4)}.form-row{grid-template-columns:1fr}}.cad-files-container{margin-top:var(--space-4)}.cad-files-list{gap:var(--space-3);flex-direction:column;display:flex}.cad-file-card{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-fast);justify-content:space-between;align-items:center;gap:var(--space-3);padding:14px 18px;display:flex}.cad-file-card:hover{border-color:var(--accent-light);box-shadow:var(--shadow-sm)}.cad-file-icon-box{background:var(--accent-bg);width:44px;height:44px;color:var(--accent-dark);border-radius:var(--radius-sm);letter-spacing:.05em;font-size:.8rem;font-weight:700;font-family:var(--font-heading);flex-shrink:0;justify-content:center;align-items:center;display:flex}.cad-file-meta{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.cad-file-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;font-weight:600;overflow:hidden}.cad-file-sub{color:var(--text-tertiary);align-items:center;gap:6px;font-size:.78rem;display:flex}.cad-file-actions{align-items:center;gap:var(--space-2);flex-shrink:0;display:flex}