.shop-item{transition:background-color .2s ease}.shop-item td{padding:var(--spacing-sm) var(--spacing-md);border-bottom:1px solid var(--color-border)}.shop-item:hover{background:var(--color-background)}.shop-item.checked{background:var(--color-checked-bg)}.shop-item.planned-not-in-cart .item-checkbox input[type=checkbox]{opacity:.4}.shop-item.editing,.shop-item.editing-details{background:var(--color-background)}.shop-item.editing-details td{border-bottom:1px solid var(--color-border);padding-top:0}.shop-item .item-checkbox input[type=checkbox]{width:1.25rem;height:1.25rem;cursor:pointer;accent-color:var(--color-primary)}.shop-item .item-name-cell label{font-size:var(--font-size-base);font-weight:500;color:var(--color-text);cursor:pointer;word-break:break-word}.shop-item .item-name-cell .item-shop-label{font-size:var(--font-size-xs);color:#10b981;font-weight:500;margin-left:var(--spacing-sm)}.shop-item .item-name-cell .edit-name-input{width:100%;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);font-weight:500}.shop-item .item-name-cell .edit-name-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.shop-item .item-shop-cell .edit-shop-input{width:100%;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm)}.shop-item .item-shop-cell .edit-shop-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.shop-item .item-quantity-cell{text-align:right;font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:500;min-width:2.5rem}.shop-item .item-quantity-cell input{width:3.5rem;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);text-align:right}.shop-item .item-quantity-cell input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.shop-item .item-price-cell{text-align:right;font-size:var(--font-size-sm);color:var(--color-text-secondary);min-width:3.5rem}.shop-item .item-price-cell input{width:4.5rem;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);text-align:right}.shop-item .item-price-cell input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.shop-item .item-total-cell{text-align:right;font-size:var(--font-size-sm);font-weight:600;color:var(--color-primary);min-width:3.5rem}.shop-item .item-actions{display:flex;gap:var(--spacing-xs);align-items:center}.shop-item .item-actions .btn-icon-small{width:1.75rem;height:1.75rem;border-radius:var(--radius-sm);border:none;background:var(--color-text-secondary);color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s ease;font-size:.75rem}.shop-item .item-actions .btn-icon-small:hover{background:var(--color-text);transform:scale(1.05)}.shop-item .item-actions .btn-icon-small.btn-delete{background:var(--color-danger)}.shop-item .item-actions .btn-icon-small.btn-delete:hover{background:#dc2626}.shop-item .item-actions .btn-icon-small.btn-save{background:var(--color-success)}.shop-item .item-actions .btn-icon-small.btn-save:hover{background:#16a34a}.shop-item .item-actions .btn-icon-small.btn-cancel{background:var(--color-text-secondary)}.shop-item .item-actions .btn-icon-small.btn-cancel:hover{background:#475569}@media (max-width: 640px){.shop-item td{padding:var(--spacing-sm);font-size:.875rem}.shop-item .item-checkbox input[type=checkbox]{width:1.125rem;height:1.125rem}.shop-item .item-name-cell label{font-size:.875rem}.shop-item .item-quantity-cell,.shop-item .item-price-cell,.shop-item .item-total-cell{font-size:.8125rem}.shop-item .item-quantity-cell{min-width:2rem}.shop-item .item-quantity-cell input{width:3rem}.shop-item .item-price-cell{min-width:3rem}.shop-item .item-price-cell input{width:4rem}.shop-item .item-total-cell{min-width:3rem}.shop-item .item-actions{gap:.25rem}.shop-item .item-actions .btn-icon-small{width:1.625rem;height:1.625rem;font-size:.7rem}}.dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-md);animation:fadeIn .2s ease;@keyframes fadeIn{0%{opacity:0}to{opacity:1}}}.dialog-overlay .dialog{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:500px;animation:slideUp .2s ease;@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}}.dialog-overlay .dialog .dialog-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.dialog-overlay .dialog .dialog-header h3{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text)}.dialog-overlay .dialog .dialog-header .btn-close{width:2rem;height:2rem;border:none;background:transparent;color:var(--color-text-secondary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-lg);transition:all .2s ease}.dialog-overlay .dialog .dialog-header .btn-close:hover{background:var(--color-background);color:var(--color-text)}.dialog-overlay .dialog .dialog-form{padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md)}.dialog-overlay .dialog .dialog-form .form-field{display:flex;flex-direction:column;gap:var(--spacing-xs)}.dialog-overlay .dialog .dialog-form .form-field label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text)}.dialog-overlay .dialog .dialog-form .form-field input,.dialog-overlay .dialog .dialog-form .form-field select{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);transition:all .2s ease;background:#fff}.dialog-overlay .dialog .dialog-form .form-field input:focus,.dialog-overlay .dialog .dialog-form .form-field select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.dialog-overlay .dialog .dialog-form .form-field input::-moz-placeholder,.dialog-overlay .dialog .dialog-form .form-field select::-moz-placeholder{color:var(--color-text-pale)}.dialog-overlay .dialog .dialog-form .form-field input::placeholder,.dialog-overlay .dialog .dialog-form .form-field select::placeholder{color:var(--color-text-pale)}.dialog-overlay .dialog .dialog-form .form-field select{cursor:pointer}.dialog-overlay .dialog .dialog-form .form-field .custom-shop-input{margin-top:var(--spacing-sm)}.dialog-overlay .dialog .dialog-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md)}.dialog-overlay .dialog .dialog-form .dialog-actions{display:flex;gap:var(--spacing-sm);justify-content:flex-end;margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--color-border)}.dialog-overlay .dialog .dialog-form .dialog-actions button{padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-md);font-weight:600;font-size:var(--font-size-base);transition:all .2s ease}.dialog-overlay .dialog .dialog-form .dialog-actions button.btn-secondary{border:1px solid var(--color-border);background:#fff;color:var(--color-text)}.dialog-overlay .dialog .dialog-form .dialog-actions button.btn-secondary:hover{background:var(--color-background)}.dialog-overlay .dialog .dialog-form .dialog-actions button.btn-primary{border:none;background:var(--color-primary);color:#fff}.dialog-overlay .dialog .dialog-form .dialog-actions button.btn-primary:hover{background:var(--color-primary-dark)}.dialog-overlay .dialog .dialog-form .dialog-actions button:active{transform:scale(.98)}@media (max-width: 640px){.dialog-overlay .dialog .dialog-header{padding:var(--spacing-md)}.dialog-overlay .dialog .dialog-header h3{font-size:var(--font-size-lg)}.dialog-overlay .dialog .dialog-form{padding:var(--spacing-md)}.dialog-overlay .dialog .dialog-form .form-row{grid-template-columns:1fr}}.shop-section{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;border:2px solid transparent;transition:all .2s ease}.shop-section.in-shop{border-color:var(--color-primary);box-shadow:var(--shadow-md)}.shop-section.inactive{opacity:.6}.shop-section .shop-header{padding:var(--spacing-lg);background:var(--color-background);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md);flex-wrap:wrap}.shop-section .shop-header .shop-info{display:flex;align-items:baseline;gap:var(--spacing-md);flex:1;min-width:0}.shop-section .shop-header .shop-info h2{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shop-section .shop-header .shop-info .shop-total{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}.shop-section .shop-header .shop-info .shop-total .total-current{font-size:var(--font-size-lg);font-weight:700;color:var(--color-primary);white-space:nowrap}.shop-section .shop-header .shop-info .shop-total .total-planned{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);opacity:.7;white-space:nowrap}.shop-section .shop-header .shop-actions{display:flex;gap:var(--spacing-sm);align-items:center}.shop-section .shop-header .shop-actions .btn-icon{width:2.5rem;height:2.5rem;border-radius:var(--radius-md);border:none;background:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s ease;font-size:var(--font-size-lg)}.shop-section .shop-header .shop-actions .btn-icon:hover{background:var(--color-primary-dark);transform:scale(1.05)}.shop-section .shop-header .shop-actions .btn-icon:active{transform:scale(.95)}.shop-section .shop-header .shop-actions .btn-shop-toggle{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);border:2px solid var(--color-primary);background:#fff;color:var(--color-primary);display:flex;align-items:center;gap:var(--spacing-sm);font-weight:600;transition:all .2s ease}.shop-section .shop-header .shop-actions .btn-shop-toggle:hover,.shop-section .shop-header .shop-actions .btn-shop-toggle.active{background:var(--color-primary);color:#fff}.shop-section .aisle-group .aisle-header{padding:var(--spacing-md) var(--spacing-lg);background:var(--color-background);border-bottom:1px solid var(--color-border);border-top:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md)}.shop-section .aisle-group .aisle-header h3{font-size:var(--font-size-base);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin:0}.shop-section .aisle-group .aisle-header .btn-aisle-add{width:2rem;height:2rem;border-radius:var(--radius-md);border:none;background:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s ease;cursor:pointer}.shop-section .aisle-group .aisle-header .btn-aisle-add:hover{background:var(--color-primary-dark);transform:scale(1.05)}.shop-section .aisle-group .aisle-header .btn-aisle-add:active{transform:scale(.95)}.shop-section .shop-items{width:100%;border-collapse:collapse}.shop-section .shop-items thead th{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background);border-bottom:2px solid var(--color-border);font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.025em}.shop-section .shop-items thead .header-checkbox{width:1.25rem}.shop-section .shop-items thead .header-name{text-align:left}.shop-section .shop-items thead .header-quantity{text-align:right;min-width:2.5rem}.shop-section .shop-items thead .header-price,.shop-section .shop-items thead .header-total{text-align:right;min-width:3.5rem}.shop-section .shop-items thead .header-actions{min-width:4rem}@media (max-width: 640px){.shop-section .shop-header{padding:var(--spacing-md)}.shop-section .shop-header .shop-info h2{font-size:var(--font-size-lg)}.shop-section .shop-header .shop-info .shop-total{font-size:var(--font-size-base)}.shop-section .shop-header .shop-actions .btn-icon{width:2.25rem;height:2.25rem}.shop-section .shop-header .shop-actions .btn-shop-toggle{padding:var(--spacing-sm);font-size:var(--font-size-sm)}.shop-section .shop-items thead th{padding:var(--spacing-sm);font-size:.75rem}.shop-section .shop-items .header-checkbox{width:1.125rem}.shop-section .shop-items .header-quantity{min-width:2rem}.shop-section .shop-items .header-price,.shop-section .shop-items .header-total{min-width:3rem}.shop-section .shop-items .header-actions{min-width:3.5rem}}.shopping-list{display:flex;flex-direction:column;gap:var(--spacing-lg)}.shopping-list .empty-state{text-align:center;padding:var(--spacing-xl);color:var(--color-text-secondary)}.shopping-list .empty-state i{font-size:4rem;margin-bottom:var(--spacing-lg);opacity:.5}.shopping-list .empty-state p{font-size:var(--font-size-lg);margin-bottom:var(--spacing-sm)}.shopping-list .empty-state .empty-state-hint{font-size:var(--font-size-sm);opacity:.7}.app{min-height:100vh;display:flex;flex-direction:column}.app .app-header{background:var(--color-primary);color:#fff;padding:var(--spacing-lg) var(--spacing-md);box-shadow:var(--shadow-md);position:sticky;top:0;z-index:100}.app .app-header h1{font-size:var(--font-size-2xl);font-weight:600;display:flex;align-items:center;gap:var(--spacing-md);max-width:1200px;margin:0 auto}.app .app-header h1 i{font-size:var(--font-size-xl)}.app .app-main{flex:1;padding:var(--spacing-lg) var(--spacing-md);padding-bottom:6rem;max-width:1200px;width:100%;margin:0 auto}.app .csv-actions{position:fixed;bottom:var(--spacing-xl);left:50%;transform:translate(-50%);display:flex;gap:var(--spacing-md);z-index:50;background:#fff;padding:var(--spacing-md);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}.app .csv-actions .btn-csv{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);border:2px solid var(--color-primary);background:#fff;color:var(--color-primary);display:flex;align-items:center;gap:var(--spacing-sm);font-weight:600;font-size:var(--font-size-sm);transition:all .2s ease;cursor:pointer}.app .csv-actions .btn-csv:hover{background:var(--color-primary);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.app .csv-actions .btn-csv:active{transform:translateY(0)}.app .fab{position:fixed;bottom:var(--spacing-xl);right:var(--spacing-xl);width:3.5rem;height:3.5rem;border-radius:50%;border:none;background:var(--color-primary);color:#fff;box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xl);transition:all .3s ease;z-index:50}.app .fab:hover{background:var(--color-primary-dark);transform:scale(1.1) rotate(90deg);box-shadow:0 20px 25px -5px #0003}.app .fab:active{transform:scale(1.05) rotate(90deg)}@media (max-width: 640px){.app .app-header{padding:var(--spacing-md)}.app .app-header h1{font-size:var(--font-size-xl)}.app .app-main{padding:var(--spacing-md);padding-bottom:8rem}.app .csv-actions{bottom:var(--spacing-lg);padding:var(--spacing-sm);gap:var(--spacing-sm)}.app .csv-actions .btn-csv{padding:var(--spacing-xs) var(--spacing-sm);font-size:.75rem}.app .csv-actions .btn-csv svg{width:16px;height:16px}.app .fab{bottom:var(--spacing-lg);right:var(--spacing-lg);width:3rem;height:3rem;font-size:var(--font-size-lg)}}:root{--color-primary: #2563eb;--color-primary-dark: #1e40af;--color-background: #f8fafc;--color-surface: #ffffff;--color-text: #1e293b;--color-text-secondary: #64748b;--color-text-pale: #cbd5e1;--color-border: #e2e8f0;--color-checked-bg: #f1f5f9;--color-success: #22c55e;--color-danger: #ef4444;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1);--font-sans: system-ui, -apple-system, sans-serif;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-sans);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-background);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}button{font-family:inherit;cursor:pointer}input{font-family:inherit}