:root{--color-primary:#d11a2a;--color-primary-dark:#a30e1c;--color-primary-light:#e24a56;--color-primary-contrast:#fff;--color-secondary:#0055bf;--color-accent:#f2cd37;--color-background:#f4f6f9;--color-surface:#fff;--color-surface-hover:#f0f2f5;--color-surface-active:#e4e7eb;--color-text:#212529;--color-text-muted:#5f6368;--color-text-subtle:#8a8d91;--color-border:#dee2e6;--color-border-subtle:#eaedf0;--color-success:#2e7d32;--color-success-bg:#e8f5e9;--color-warning:#e65100;--color-warning-bg:#fff3e0;--color-error:#c62828;--color-error-bg:#ffebee;--color-info:#0288d1;--color-info-bg:#e1f5fe;--lego-black:#212121;--lego-white:#fff;--lego-red:#c91a09;--lego-blue:#0055bf;--lego-yellow:#f2cd37;--lego-green:#237841;--lego-dark-gray:#4f5358;--lego-light-gray:#9ba19d;--lego-orange:#fe8a18;--lego-brown:#583927;--lego-tan:#e4cd9e;--lego-trans:#e6f0ffa6;--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-md:1rem;--font-size-lg:1.25rem;--font-size-xl:1.5rem;--font-size-2xl:1.875rem;--line-height:1.5;--spacing-2xs:.125rem;--spacing-xs:.25rem;--spacing-sm:.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-full:9999px;--shadow-sm:0 1px 3px #00000014;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001f, 0 4px 6px -2px #0000000f;--header-height:60px;--drawer-width:280px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0;padding:0}body{font-family:var(--font-family);font-size:var(--font-size-md);line-height:var(--line-height);color:var(--color-text);background-color:var(--color-background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--color-primary);transition:color var(--transition-fast);text-decoration:none;&:hover{color:var(--color-primary-dark)}}button,input,select,textarea{font:inherit;color:inherit}.app-shell{flex-direction:column;min-height:100vh;display:flex;position:relative}.app-header{z-index:100;align-items:center;gap:var(--spacing-md);height:var(--header-height);padding:0 var(--spacing-md);background-color:var(--color-primary);color:var(--color-primary-contrast);box-shadow:var(--shadow-md);display:flex;position:sticky;top:0;& .nav-toggle{width:40px;height:40px;color:var(--color-primary-contrast);cursor:pointer;border-radius:var(--radius-sm);transition:background-color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:inline-flex;&:hover,&:focus-visible{background-color:#ffffff26;outline:none}& svg{fill:currentColor;width:24px;height:24px}}& .app-title{font-size:var(--font-size-lg);letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;flex:1;margin:0;font-weight:600;overflow:hidden}& .header-actions{align-items:center;gap:var(--spacing-sm);display:flex}}@keyframes spin{to{transform:rotate(360deg)}}.drawer-backdrop{z-index:150;opacity:0;pointer-events:none;transition:opacity var(--transition-normal);background-color:#00000080;position:fixed;inset:0;&.open{opacity:1;pointer-events:auto}}.drawer{z-index:200;width:var(--drawer-width);background-color:var(--color-surface);max-width:85vw;box-shadow:var(--shadow-lg);transition:transform var(--transition-normal);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto;transform:translate(-100%);&.open{transform:translate(0,0)}& .drawer-header{height:var(--header-height);padding:0 var(--spacing-md);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex;& .drawer-title{font-size:var(--font-size-md);color:var(--color-text);margin:0;font-weight:600}& .drawer-close{width:36px;height:36px;color:var(--color-text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex;&:hover,&:focus-visible{background-color:var(--color-surface-hover);color:var(--color-text);outline:none}}}& .drawer-nav{padding:var(--spacing-sm) 0;flex-direction:column;display:flex;& .drawer-link{align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);color:var(--color-text);transition:background-color var(--transition-fast), color var(--transition-fast);border-radius:0;font-weight:500;display:flex;&:hover,&:focus-visible{background-color:var(--color-surface-hover);color:var(--color-primary);outline:none}&.active{color:var(--color-primary);background-color:#d11a2a14;font-weight:600}& .drawer-link-icon{fill:currentColor;flex-shrink:0;width:20px;height:20px}}& .drawer-divider{height:1px;margin:var(--spacing-sm) 0;background-color:var(--color-border)}}}.app-main{width:100%;max-width:1200px;padding:var(--spacing-md);box-sizing:border-box;flex:1;margin:0 auto}.toast{bottom:var(--spacing-lg);z-index:300;justify-content:space-between;align-items:center;gap:var(--spacing-md);min-width:280px;max-width:calc(100vw - 32px);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);color:#fff;box-shadow:var(--shadow-lg);font-size:var(--font-size-sm);background-color:#323232;display:flex;position:fixed;left:50%;transform:translate(-50%);&.toast--error{background-color:var(--color-error)}&.toast--success{background-color:var(--color-success)}& .toast-close{color:inherit;cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);background:0 0;border:none;align-items:center;display:inline-flex;&:hover{background-color:#fff3}}}.grid-cards{gap:var(--spacing-md);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.card{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--spacing-md);transition:box-shadow var(--transition-fast), border-color var(--transition-fast);&:hover{box-shadow:var(--shadow-md);border-color:var(--color-border-subtle)}}.card.set-card{flex-direction:column;height:100%;padding:0;display:flex;overflow:hidden;& .set-card-media{background:linear-gradient(#f8f9fa 0%,#eceff1 100%);justify-content:center;align-items:center;height:190px;text-decoration:none;display:flex;position:relative;overflow:hidden;& .set-card-image{object-fit:contain;max-width:100%;max-height:100%;padding:var(--spacing-sm);transition:transform var(--transition-normal)}&:hover .set-card-image{transform:scale(1.05)}& .set-card-no-image{width:100%;height:100%;color:var(--color-text-subtle);font-size:var(--font-size-md);justify-content:center;align-items:center;font-weight:600;display:flex}& .set-card-chip{top:var(--spacing-sm);right:var(--spacing-sm);box-shadow:var(--shadow-sm);backdrop-filter:blur(4px);font-weight:700;position:absolute}}& .set-card-body{padding:var(--spacing-md);gap:var(--spacing-sm);flex-direction:column;flex:1;display:flex;& .set-card-header{margin-bottom:var(--spacing-xs)}& .set-card-title{margin:0 0 var(--spacing-xs) 0;font-size:var(--font-size-md);font-weight:600;line-height:1.3;& a{color:var(--color-text);text-decoration:none;&:hover{color:var(--color-primary)}}}& .set-card-meta{font-size:var(--font-size-xs);color:var(--color-text-muted);justify-content:space-between;align-items:center;display:flex;& .set-number-label{font-family:monospace;font-size:var(--font-size-sm)}}}& .progress-bar{background-color:var(--color-surface-hover);border-radius:var(--radius-full);width:100%;height:6px;margin:var(--spacing-xs) 0;overflow:hidden;& .progress-bar-fill{background-color:var(--color-warning);border-radius:var(--radius-full);height:100%;transition:width var(--transition-normal);&.complete{background-color:var(--color-success)}}}& table.set-stats-table{border-collapse:collapse;width:100%;font-size:var(--font-size-xs);margin-top:auto;& th,& td{border-bottom:1px solid var(--color-border-subtle);padding:4px 6px}& th{color:var(--color-text-muted);text-align:left;background:0 0;font-weight:500}& td{color:var(--color-text);font-weight:600;&.stat-collected{text-align:right;color:var(--color-text)}&.stat-total{text-align:right;color:var(--color-text-muted)}}& tbody tr:hover{background-color:var(--color-surface-hover)}& tbody tr:last-child th,& tbody tr:last-child td{border-bottom:none}}& .set-card-actions{justify-content:space-between;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-surface);border-top:1px solid var(--color-border-subtle);display:flex;& .btn{text-align:center;flex:1}& .btn-rebrickable{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-sm);color:var(--color-text-muted);flex:none;&:hover{color:var(--color-secondary)}}}}.table-container{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);width:100%;overflow-x:auto}table.data-table{border-collapse:collapse;text-align:left;width:100%;font-size:var(--font-size-sm);& th,& td{padding:var(--spacing-sm) var(--spacing-md);border-bottom:1px solid var(--color-border-subtle)}& th{background-color:var(--color-background);color:var(--color-text-muted);font-weight:600}& tbody tr:last-child td{border-bottom:none}& tbody tr:hover{background-color:var(--color-surface-hover)}}.counter{border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-surface);width:100%;transition:border-color var(--transition-fast), background-color var(--transition-fast);align-items:center;display:flex;overflow:hidden;& button{cursor:pointer;width:36px;height:36px;font-weight:700;font-size:var(--font-size-lg);color:var(--color-text);transition:background-color var(--transition-fast), color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex;&:hover:not(:disabled){background-color:var(--color-surface-hover)}&:active:not(:disabled){background-color:var(--color-surface-active)}&:disabled{opacity:.35;cursor:not-allowed}}& .counter-display{width:auto;min-width:68px;padding:0 var(--spacing-sm);text-align:center;font-weight:600;font-size:var(--font-size-sm);user-select:none;border-left:1px solid var(--color-border);border-right:1px solid var(--color-border);border-radius:0;flex:1;& .spare-indicator{font-size:var(--font-size-xs);color:var(--color-primary);margin-left:2px;font-weight:700}}&.counter--state-zero{border-color:var(--color-border);& .counter-display{color:var(--color-text-muted);background-color:#0000}}&.counter--state-partial{border-color:var(--color-warning);background-color:var(--color-warning-bg);& .counter-display{color:var(--color-warning);background-color:#e651001f}& .counter-btn-inc{color:var(--color-warning)}}&.counter--state-complete{border-color:var(--color-success);background-color:var(--color-success-bg);& .counter-display{color:var(--color-success);background-color:#2e7d3226;font-weight:700}& .counter-btn-inc{color:var(--color-success)}}&.counter--state-excess{border-color:var(--color-error);background-color:var(--color-error-bg);& .counter-display{color:var(--color-error);background-color:#c6282826;font-weight:700}& .counter-btn-inc{color:var(--color-error)}}}.badge{align-items:center;gap:var(--spacing-xs);padding:var(--spacing-2xs) var(--spacing-sm);font-size:var(--font-size-xs);border-radius:var(--radius-full);background-color:var(--color-surface-hover);color:var(--color-text);font-weight:600;display:inline-flex;&.badge--success{background-color:var(--color-success-bg);color:var(--color-success)}&.badge--warning{background-color:var(--color-warning-bg);color:var(--color-warning)}&.badge--error{background-color:var(--color-error-bg);color:var(--color-error)}}.color-badge{align-items:center;gap:var(--spacing-xs);border-radius:var(--radius-full);font-size:var(--font-size-xs);border:1px solid var(--color-border);background-color:var(--color-surface);white-space:nowrap;padding:2px 8px;font-weight:500;display:inline-flex;& .color-swatch{border:1px solid #0003;border-radius:50%;flex-shrink:0;width:12px;height:12px;display:inline-block}}.inventory-controls{justify-content:space-between;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);flex-wrap:wrap;display:flex;& .inventory-filters{align-items:center;gap:var(--spacing-md);flex-wrap:wrap;display:flex}& .filter-group{align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-sm);display:inline-flex;& label{color:var(--color-text-muted);cursor:pointer;font-weight:500}& select{padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-surface);color:var(--color-text);font-size:var(--font-size-sm);cursor:pointer}& input[type=checkbox]{cursor:pointer;width:16px;height:16px;accent-color:var(--color-primary)}}& .inventory-summary{font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:500}}.inventory-table{& th,& td{vertical-align:middle}& .part-image-cell{text-align:center;width:80px;padding:var(--spacing-xs);& img{object-fit:contain;border-radius:var(--radius-sm);background-color:#fafafa;max-width:72px;max-height:72px}& .no-image{background-color:var(--color-surface-hover);width:60px;height:60px;color:var(--color-text-subtle);font-size:var(--font-size-xs);border-radius:var(--radius-sm);justify-content:center;align-items:center;display:inline-flex}}& .part-meta-cell{white-space:nowrap;width:1%;min-width:180px;& part-counter{width:100%;display:block}& .part-meta-header{justify-content:space-between;align-items:center;gap:var(--spacing-xs);margin-bottom:var(--spacing-xs);font-size:var(--font-size-xs);display:flex}& .part-num{color:var(--color-text-muted);font-family:monospace;font-weight:600}}& .part-info-cell{& .part-title{color:var(--color-text);margin-bottom:2px;font-weight:500}& .set-source-link{font-size:var(--font-size-xs);color:var(--color-secondary);margin-top:2px;display:inline-block}}}dialog.modal{border-radius:var(--radius-lg);padding:var(--spacing-lg);background-color:var(--color-surface);box-shadow:var(--shadow-lg);border:none;max-width:90vw;max-height:90vh;overflow:auto;&::backdrop{backdrop-filter:blur(2px);background-color:#0009}}.btn{justify-content:center;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-sm);font-weight:500;font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast);border:1px solid #0000;display:inline-flex;&.btn-primary{background-color:var(--color-primary);color:var(--color-primary-contrast);&:hover:not(:disabled){background-color:var(--color-primary-dark)}}&.btn-secondary{background-color:var(--color-surface);border-color:var(--color-border);color:var(--color-text);&:hover:not(:disabled){background-color:var(--color-surface-hover)}}&.btn-sm{font-size:var(--font-size-xs);padding:.25rem .5rem}}.search-set-container{gap:var(--spacing-lg);flex-direction:column;width:100%;display:flex}.search-input-card{padding:var(--spacing-lg)}.search-label{margin-bottom:var(--spacing-sm);color:var(--color-text);font-weight:500;display:block}.search-input-group{gap:var(--spacing-sm);max-width:650px;display:flex}.search-input{border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-surface);color:var(--color-text);font-size:var(--font-size-md);transition:border-color var(--transition-fast);outline:none;flex:1;padding:.625rem .875rem;&:focus{border-color:var(--color-primary)}}.search-status-area{gap:var(--spacing-sm);flex-direction:column;display:flex}.search-state-message{&.searching{align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);color:var(--color-text-muted);display:flex}&.error{padding:var(--spacing-md);border-radius:var(--radius-sm);color:#b91c1c;background-color:#fee2e2;border:1px solid #f87171;justify-content:space-between;align-items:center;display:flex}}.loading-spinner{border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:1.25rem;height:1.25rem;animation:.8s linear infinite spin}.search-results-section{gap:var(--spacing-md);flex-direction:column;display:flex}.results-header{justify-content:space-between;align-items:center;display:flex}.results-title{font-size:var(--font-size-lg);margin:0}.search-results-list{gap:var(--spacing-md);flex-direction:column;display:flex}.search-result-item{align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);transition:box-shadow var(--transition-fast);display:flex;&:hover{box-shadow:var(--shadow-md)}@media (width<=640px){flex-direction:column;align-items:stretch}}.result-media{background-color:var(--color-surface-hover);border-radius:var(--radius-sm);flex-shrink:0;justify-content:center;align-items:center;width:100px;height:100px;display:flex;position:relative;overflow:hidden;@media (width<=640px){width:100%;height:180px}}.result-thumb{object-fit:contain;cursor:pointer;max-width:100%;max-height:100%;transition:transform var(--transition-fast);&:hover{transform:scale(1.05)}}.preview-zoom-btn{color:#fff;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast);background:#0009;border:none;justify-content:center;align-items:center;padding:4px;display:flex;position:absolute;bottom:4px;right:4px;&:hover{background:#000000d9}}.result-thumb-placeholder{font-size:var(--font-size-xs);color:var(--color-text-muted)}.result-content{justify-content:space-between;align-items:center;gap:var(--spacing-md);flex-wrap:wrap;flex:1;display:flex}.result-info{gap:var(--spacing-xs);flex-direction:column;display:flex}.result-name{font-size:var(--font-size-md);margin:0;font-weight:600}.result-meta{align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text-muted);flex-wrap:wrap;display:flex}.badge-set-num{background-color:var(--color-surface-hover);color:var(--color-text);border-radius:var(--radius-sm);padding:2px 6px;font-family:monospace;font-weight:600}.result-actions{align-items:center;gap:var(--spacing-sm);display:flex;@media (width<=640px){justify-content:flex-end;width:100%}}dialog.set-image-dialog{border-radius:var(--radius-lg);background-color:var(--color-surface);max-width:min(840px,92vw);max-height:90vh;box-shadow:var(--shadow-lg);border:none;padding:0;&::backdrop{backdrop-filter:blur(4px);background-color:#000000bf}}.dialog-inner{flex-direction:column;max-height:90vh;display:flex}.dialog-header{padding:var(--spacing-md) var(--spacing-lg);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.dialog-header-text{flex-direction:column;gap:2px;display:flex}.dialog-title{font-size:var(--font-size-lg);margin:0;font-weight:600}.dialog-subtitle{font-size:var(--font-size-sm);color:var(--color-text-muted)}.dialog-close-btn{color:var(--color-text-muted);cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);background:0 0;border:none;font-size:1.75rem;line-height:1;&:hover{color:var(--color-text);background-color:var(--color-surface-hover)}}.dialog-body{padding:var(--spacing-lg);background-color:var(--color-surface-hover);justify-content:center;align-items:center;min-height:250px;display:flex;overflow:auto}.dialog-full-image{object-fit:contain;border-radius:var(--radius-sm);max-width:100%;max-height:60vh}.dialog-footer{justify-content:flex-end;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);border-top:1px solid var(--color-border);display:flex}