.header{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:#fff;padding:var(--spacing-lg) var(--spacing-md);padding-top:calc(var(--spacing-lg) + env(safe-area-inset-top,0px));position:sticky;top:0;z-index:var(--z-dropdown);box-shadow:var(--shadow-lg)}.header-content{max-width:600px;margin:0 auto}.header-title-section{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.header-icon{font-size:var(--font-size-3xl);filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.header-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0;letter-spacing:-.02em}.header-subtitle{font-size:var(--font-size-sm);opacity:.9;margin:var(--spacing-xs) 0 0 0}.header-progress{display:flex;align-items:center;gap:var(--spacing-sm)}.progress-bar{flex:1;height:8px;background:#ffffff4d;border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;background:#fff;border-radius:var(--radius-full);transition:width var(--transition-normal)}.progress-text{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);min-width:40px;text-align:right}.item-form-container{padding:var(--spacing-md);max-width:600px;margin:0 auto}.add-item-button{width:100%;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);background:var(--color-surface);border:2px dashed var(--color-border);border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);transition:all var(--transition-fast)}.add-item-button:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-primary-light)}.add-item-button:active{transform:scale(.98)}.add-icon{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold)}.item-form{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-lg)}.form-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg)}.form-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.close-button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);color:var(--color-text-muted);font-size:var(--font-size-lg);transition:all var(--transition-fast)}.close-button:hover{background:var(--color-surface-hover);color:var(--color-text-primary)}.form-group{margin-bottom:var(--spacing-md)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md)}.form-label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.form-input{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background);border:2px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);color:var(--color-text-primary);transition:border-color var(--transition-fast)}.form-input:hover{border-color:var(--color-text-muted)}.form-input:focus{border-color:var(--color-primary);outline:none}.form-input::-moz-placeholder{color:var(--color-text-muted)}.form-input::placeholder{color:var(--color-text-muted)}.form-input.input-error{border-color:var(--color-danger)}.error-message{display:block;font-size:var(--font-size-xs);color:var(--color-danger);margin-top:var(--spacing-xs)}.category-options{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.category-option{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background);border:2px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);transition:all var(--transition-fast)}.category-option:hover{border-color:var(--category-color);background:var(--color-surface)}.category-option.selected{border-color:var(--category-color);background:var(--color-surface);color:var(--color-text-primary)}.category-option.selected:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--category-color);border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.category-option{position:relative}.category-icon{font-size:var(--font-size-lg)}.category-label{font-weight:var(--font-weight-medium)}.submit-button{width:100%;padding:var(--spacing-md) var(--spacing-lg);background:var(--color-primary);color:#fff;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);border-radius:var(--radius-sm);margin-top:var(--spacing-md);transition:all var(--transition-fast)}.submit-button:hover{background:var(--color-primary-dark)}.submit-button:active{transform:scale(.98)}.category-filter{padding:var(--spacing-md);padding-bottom:0;max-width:600px;margin:0 auto}.filter-scroll{display:flex;gap:var(--spacing-sm);overflow-x:auto;padding-bottom:var(--spacing-sm);scrollbar-width:none;-ms-overflow-style:none}.filter-scroll::-webkit-scrollbar{display:none}.filter-chip{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-full);font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:nowrap;transition:all var(--transition-fast);flex-shrink:0}.filter-chip:hover{border-color:var(--color-text-muted);background:var(--color-surface-hover)}.filter-chip.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.filter-chip.active .chip-count{background:#fff3;color:#fff}.chip-icon{font-size:var(--font-size-base)}.chip-label{font-weight:var(--font-weight-medium)}.chip-count{background:var(--color-background);color:var(--color-text-muted);padding:2px 8px;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold)}.shopping-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border-left:4px solid var(--category-color);transition:all var(--transition-normal);animation:fadeIn var(--transition-normal) forwards}.shopping-item:hover{box-shadow:var(--shadow-md)}.shopping-item.purchased{background:var(--color-surface-hover);opacity:.7}.shopping-item.purchased .item-name{text-decoration:line-through;color:var(--color-text-muted)}.shopping-item.deleting{animation:slideOutRight var(--transition-normal) forwards}.item-checkbox{flex-shrink:0;width:28px;height:28px;padding:0;display:flex;align-items:center;justify-content:center}.checkbox-inner{width:24px;height:24px;border:2px solid var(--color-border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);background:var(--color-surface)}.shopping-item.purchased .checkbox-inner{background:var(--color-primary);border-color:var(--color-primary)}.check-icon{width:14px;height:14px;color:#fff;stroke-dasharray:100;animation:checkmark .3s ease forwards}.item-checkbox:hover .checkbox-inner{border-color:var(--color-primary)}.item-checkbox:active .checkbox-inner{transform:scale(.9)}.item-content{flex:1;min-width:0}.item-header{display:flex;align-items:center;gap:var(--spacing-sm);flex-wrap:wrap;margin-bottom:var(--spacing-xs)}.item-name{font-weight:var(--font-weight-medium);color:var(--color-text-primary);word-break:break-word}.item-category-badge{font-size:var(--font-size-xs);color:var(--color-text-muted);background:var(--color-background);padding:2px 8px;border-radius:var(--radius-full)}.item-details{display:flex;align-items:center;gap:var(--spacing-md);font-size:var(--font-size-sm)}.item-quantity{color:var(--color-text-secondary)}.item-price{font-weight:var(--font-weight-semibold);color:var(--color-primary-dark)}.shopping-item.purchased .item-price{color:var(--color-text-muted)}.delete-button{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--color-text-muted);transition:all var(--transition-fast)}.delete-button svg{width:18px;height:18px}.delete-button:hover{background:var(--color-danger-light);color:var(--color-danger)}.delete-button:active{transform:scale(.9)}.item-list{padding:var(--spacing-md);max-width:600px;margin:0 auto}.list-container{display:flex;flex-direction:column;gap:var(--spacing-sm)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-2xl) var(--spacing-lg);text-align:center}.empty-icon{font-size:64px;margin-bottom:var(--spacing-md);opacity:.5}.empty-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-sm) 0}.empty-description{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0;max-width:280px}.summary{padding:var(--spacing-md);padding-bottom:calc(var(--spacing-md) + env(safe-area-inset-bottom,0px));max-width:600px;margin:0 auto;position:sticky;bottom:0;background:linear-gradient(to top,var(--color-background) 80%,transparent)}.summary-card{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-md);box-shadow:var(--shadow-lg);border:1px solid var(--color-border)}.summary-row{display:flex;justify-content:space-between;gap:var(--spacing-md)}.summary-row:first-child{justify-content:center}.summary-divider{height:1px;background:var(--color-border);margin:var(--spacing-md) 0}.summary-item{display:flex;flex-direction:column;gap:var(--spacing-xs)}.summary-row:last-child .summary-item{flex:1}.summary-row:last-child .summary-item:last-child{align-items:flex-end}.summary-label{display:flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.status-dot{width:8px;height:8px;border-radius:var(--radius-full)}.status-dot.pending{background:var(--color-primary)}.status-dot.purchased{background:var(--color-text-muted)}.summary-value{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.summary-value.total{font-size:var(--font-size-2xl);color:var(--color-text-primary)}.summary-value.pending{color:var(--color-primary-dark)}.summary-value.purchased{color:var(--color-text-muted)}:root{--color-primary: #10B981;--color-primary-light: #D1FAE5;--color-primary-dark: #059669;--color-background: #F8FAFC;--color-surface: #FFFFFF;--color-surface-hover: #F1F5F9;--color-text-primary: #1E293B;--color-text-secondary: #64748B;--color-text-muted: #94A3B8;--color-border: #E2E8F0;--color-border-light: #F1F5F9;--color-danger: #EF4444;--color-danger-light: #FEE2E2;--color-mercado: #3B82F6;--color-limpeza: #8B5CF6;--color-higiene: #EC4899;--color-outros: #F59E0B;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 30px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .35s ease;--z-dropdown: 100;--z-modal: 200;--z-toast: 300}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(10px)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(100%)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes checkmark{0%{stroke-dashoffset:100}to{stroke-dashoffset:0}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@keyframes countUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--transition-normal) forwards}.animate-fade-out{animation:fadeOut var(--transition-normal) forwards}.animate-slide-in{animation:slideInUp var(--transition-normal) forwards}.animate-slide-out{animation:slideOutRight var(--transition-normal) forwards}.animate-scale-in{animation:scaleIn var(--transition-fast) forwards}.animate-pulse{animation:pulse .3s ease}.animate-shake{animation:shake .3s ease}.animate-count{animation:countUp var(--transition-fast) forwards}.stagger-children>*{opacity:0;animation:fadeIn var(--transition-normal) forwards}.stagger-children>*:nth-child(1){animation-delay:0ms}.stagger-children>*:nth-child(2){animation-delay:50ms}.stagger-children>*:nth-child(3){animation-delay:.1s}.stagger-children>*:nth-child(4){animation-delay:.15s}.stagger-children>*:nth-child(5){animation-delay:.2s}.stagger-children>*:nth-child(6){animation-delay:.25s}.stagger-children>*:nth-child(7){animation-delay:.3s}.stagger-children>*:nth-child(8){animation-delay:.35s}.stagger-children>*:nth-child(9){animation-delay:.4s}.stagger-children>*:nth-child(10){animation-delay:.45s}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-background);min-height:100vh;min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;min-height:100dvh}button{font-family:inherit;cursor:pointer;border:none;background:none}input,select{font-family:inherit;font-size:var(--font-size-base)}input:focus,select:focus,button:focus{outline:2px solid var(--color-primary);outline-offset:2px}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--color-border-light)}::-webkit-scrollbar-thumb{background:var(--color-text-muted);border-radius:var(--radius-full)}::-moz-selection{background:var(--color-primary-light);color:var(--color-primary-dark)}::selection{background:var(--color-primary-light);color:var(--color-primary-dark)}