*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.visible{visibility:visible}.my-4{margin-top:1rem;margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.mb-6{margin-bottom:1.5rem}.mr-2{margin-right:.5rem}.mt-2{margin-top:.5rem}.block{display:block}.inline{display:inline}.flex{display:flex}.table{display:table}.pl-2{padding-left:.5rem}.pl-4{padding-left:1rem}.text-center{text-align:center}.indent-2{text-indent:.5rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-gray-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity, 1))}.placeholder-text::-moz-placeholder{--tw-placeholder-opacity: 1;color:rgb(44 44 44 / var(--tw-placeholder-opacity, 1))}.placeholder-text::placeholder{--tw-placeholder-opacity: 1;color:rgb(44 44 44 / var(--tw-placeholder-opacity, 1))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}#root{min-height:100vh}button,input,textarea,select{font-family:var(--font-family)}button:focus,input:focus,textarea:focus{outline:none}html{scroll-behavior:smooth}*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #8e432e;--color-primary-light: #af7025;--color-primary-dark: #6d341f;--color-primary-50: #fdf2f0;--color-primary-100: #fce7e3;--color-secondary: #767641;--color-secondary-light: #8a8a5a;--color-secondary-dark: #626235;--color-secondary-50: #f7f7f3;--color-secondary-100: #f0f0e8;--color-accent-1: #d1b58b;--color-accent-2: #b9c3ac;--color-accent-1-light: #e0c9a8;--color-accent-2-light: #c8d1b8;--color-background: #f8f8f2;--color-background-alt: #f1f0de;--color-surface: #ffffff;--color-surface-alt: #f8f8f2;--color-neutral: #d7d5b6;--color-neutral-50: #f0f0e8;--color-neutral-dark: #b8b69a;--color-text: #2c2c2c;--color-text-secondary: #4a4a4a;--color-text-muted: #6b6b6b;--color-text-inverse: #ffffff;--color-success: #7FB069;--color-success-light: #9bc285;--color-error: #D97777;--color-error-light: #e8a5a5;--color-warning: #E6B17A;--color-warning-light: #eec08f;--color-hover: #af7025;--color-active: #6d341f;--color-focus: rgba(142, 67, 46, .2);--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--shadow-sm: 0 1px 2px 0 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);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--transition-fast: .15s ease-in-out;--transition-normal: .25s ease-in-out;--transition-slow: .35s ease-in-out}body{font-family:var(--font-family);background-color:var(--color-background);color:var(--color-text);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{min-height:100vh;background:linear-gradient(135deg,var(--color-background) 0%,var(--color-background-alt) 100%)}.app-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:var(--spacing-lg)}.auth-container{max-width:480px;margin:0 auto;padding:var(--spacing-2xl) var(--spacing-lg);min-height:100vh;display:flex;flex-direction:column;justify-content:center}.auth-header{text-align:center;margin-bottom:var(--spacing-2xl)}.logo-container{margin-bottom:var(--spacing-lg);text-align:center}.logo-image{width:300px;height:auto;margin:0 auto;display:block;filter:drop-shadow(var(--shadow-md));transition:transform var(--transition-fast)}.logo-image:hover{transform:scale(1.05)}.logo-icon{font-size:4rem;display:inline-block;background:var(--color-primary);color:#fff;width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto;box-shadow:var(--shadow-lg)}.auth-header h1{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-sm)}.auth-header p{font-size:var(--font-size-lg);color:var(--color-text-secondary)}.auth-content{background:var(--color-surface);padding:var(--spacing-2xl);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);text-align:center;border:1px solid var(--color-neutral)}.auth-description{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);line-height:1.6}.magic-link-form{text-align:left}.magic-link-form .form-group{margin-bottom:var(--spacing-lg)}.magic-link-form .form-group label{display:block;font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-sm);font-size:var(--font-size-base);text-align:left}.email-input{width:100%;padding:var(--spacing-md);border:2px solid var(--color-neutral);border-radius:var(--radius-lg);font-size:var(--font-size-lg);font-family:var(--font-family);transition:all var(--transition-fast);background:var(--color-surface);color:var(--color-text);text-align:center}.email-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus);transform:translateY(-1px)}.email-input::-moz-placeholder{color:var(--color-text-muted);text-align:center}.email-input::placeholder{color:var(--color-text-muted);text-align:center}.magic-link-button{width:100%;padding:var(--spacing-md) var(--spacing-lg);background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-lg);font-size:var(--font-size-lg);font-weight:600;cursor:pointer;transition:all var(--transition-fast);box-shadow:var(--shadow-sm);margin-top:var(--spacing-md)}.magic-link-button:hover:not(:disabled){background:var(--color-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.magic-link-button:disabled{opacity:.6;cursor:not-allowed}.magic-link-sent{text-align:center;padding:var(--spacing-lg) 0}.success-icon{width:60px;height:60px;background:var(--color-success);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:700;margin:0 auto var(--spacing-lg);box-shadow:var(--shadow-md)}.magic-link-sent h3{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-md)}.magic-link-sent p{font-size:var(--font-size-base);color:var(--color-text-secondary);margin-bottom:var(--spacing-sm);line-height:1.6}.magic-link-note{font-size:var(--font-size-sm);color:var(--color-text-muted);font-style:italic;margin-bottom:var(--spacing-lg);padding:var(--spacing-md);background:var(--color-accent-1-light);border-radius:var(--radius-md);border-left:4px solid var(--color-primary)}.error-message{background:var(--color-error-light);color:var(--color-error);padding:var(--spacing-md);border-radius:var(--radius-md);margin-bottom:var(--spacing-lg);border:1px solid var(--color-error);font-size:var(--font-size-sm);font-weight:500;text-align:left}.auth-footer{margin-top:var(--spacing-lg);text-align:center}.auth-footer p{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:1.5}.powered-by{font-size:var(--font-size-xs);color:var(--color-text-muted);opacity:.8}.heartful-sprout{font-weight:600;color:var(--color-secondary);font-style:italic}@media (max-width: 768px){.auth-container{padding:var(--spacing-xl) var(--spacing-md)}}@media (max-width: 480px){.auth-header h1{font-size:var(--font-size-2xl)}.auth-content{padding:var(--spacing-lg)}.logo-icon{width:60px;height:60px;font-size:3rem}}.secure-image-placeholder{display:flex;align-items:center;justify-content:center;background:var(--color-background-alt)}.secure-image-placeholder .placeholder-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);color:var(--color-text-secondary);opacity:.7}.secure-image-placeholder .placeholder-content span{font-size:var(--font-size-sm);font-weight:500}.form-label{display:block;margin-top:var(--spacing-md);margin-bottom:var(--spacing-xs);font-weight:500;color:var(--color-text);font-size:var(--font-size-sm);font-family:var(--font-family)}.form-input,.form-textarea,.form-select,.search-input,.tag-input,.tag-search-input,.ingredient-form-grid .form-input,.ingredient-form-grid input,.ingredient-form-grid .form-select,.ingredient-form-grid select{width:100%;border:1px solid var(--color-neutral);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:var(--font-family);height:32px;min-height:32px;max-height:32px;box-sizing:border-box;background-color:var(--color-surface);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.ingredient-form-grid .search-field .search-input,.search-input{padding:var(--spacing-xs) var(--spacing-sm) var(--spacing-xs) 2rem!important;margin:0!important;background-color:#fff!important}.form-input:disabled,.form-textarea:disabled,.form-select:disabled,.search-input:disabled,.tag-input:disabled,.tag-search-input:disabled{background-color:var(--color-neutral-50, #f1f5f9)!important;cursor:not-allowed;opacity:.7}.form-input:focus,.form-textarea:focus,.form-select:focus,.search-input:focus,.tag-input:focus,.tag-search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus)}.form-input::-moz-placeholder,.form-textarea::-moz-placeholder,.search-input::-moz-placeholder,.tag-input::-moz-placeholder,.tag-search-input::-moz-placeholder{color:var(--color-text-muted)}.form-input::placeholder,.form-textarea::placeholder,.search-input::placeholder,.tag-input::placeholder,.tag-search-input::placeholder{color:var(--color-text-muted)}.form-textarea{resize:vertical;min-height:80px;max-height:none}.form-select,.ingredient-form-grid select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 8px center;background-size:16px;padding-right:32px}.ingredient-form-grid .form-group label{font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:500}.custom-select-container,.search-container{position:relative;width:100%;margin:0;padding:0}.search-container .search-icon{position:absolute;left:var(--spacing-sm);top:50%;transform:translateY(-50%);color:var(--color-text-secondary);pointer-events:none;z-index:1}.custom-select-trigger{width:100%;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-neutral);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:var(--font-family);height:32px;min-height:32px;max-height:32px;box-sizing:border-box;background-color:var(--color-surface);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);cursor:pointer;display:flex;align-items:center;justify-content:space-between;text-align:left}.custom-select-trigger:hover{border-color:var(--color-neutral-dark)}.custom-select-trigger:focus,.custom-select-trigger.open{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus)}.custom-select-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.custom-select-arrow{font-size:var(--font-size-xs);color:var(--color-text-muted);transition:transform var(--transition-fast);margin-left:var(--spacing-xs)}.custom-select-trigger.open .custom-select-arrow{transform:rotate(180deg)}.custom-select-dropdown,.dropdown-list,.tag-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--color-surface);border:1px solid var(--color-neutral);border-top:none;border-radius:0 0 var(--radius-md) var(--radius-md);max-height:200px;overflow-y:auto;z-index:1000;box-shadow:var(--shadow-md)}.custom-select-options{list-style:none;margin:0;padding:0}.custom-select-option,.dropdown-item,.tag-dropdown-item{padding:var(--spacing-sm);cursor:pointer;border-bottom:1px solid var(--color-neutral-50);font-size:var(--font-size-sm);font-family:var(--font-family);color:var(--color-text);transition:background-color var(--transition-fast);display:flex;align-items:center;gap:var(--spacing-sm);width:100%;border:none;background:none;text-align:left}.custom-select-option:hover,.custom-select-option.highlighted,.dropdown-item:hover,.tag-dropdown-item:hover{background-color:var(--color-primary-50)}.custom-select-option.highlighted{color:var(--color-primary)}.custom-select-option.selected,.dropdown-item.selected{background-color:var(--color-primary);color:var(--color-text-inverse)}.tag-dropdown-item.selected{background-color:var(--color-primary-100);color:var(--color-primary);font-weight:500}.custom-select-option:last-child,.dropdown-item:last-child,.tag-dropdown-item:last-child{border-bottom:none}.tag-dropdown-item.create-new{color:var(--color-success);font-weight:500}.tag-dropdown-item.create-new:hover{background-color:var(--color-success-light);color:var(--color-text-inverse)}.tag-dropdown-item.loading,.tag-dropdown-item.no-results,.no-results{color:var(--color-text-muted);cursor:default;font-style:italic;padding:var(--spacing-md) var(--spacing-sm);text-align:center;font-size:var(--font-size-sm)}.tag-dropdown-item.loading:hover,.tag-dropdown-item.no-results:hover,.no-results:hover{background-color:transparent}.loading-state{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-sm);color:var(--color-text-muted);font-size:var(--font-size-sm);cursor:default}.loading-state .loading-spinner{width:1rem;height:1rem;border:2px solid var(--color-neutral-50);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.error-state{display:flex;align-items:center;justify-content:center;padding:var(--spacing-md) var(--spacing-sm);color:var(--color-error);font-size:var(--font-size-sm);cursor:default;text-align:center}.ingredient-display{flex:1;display:flex;flex-direction:column;gap:2px}.ingredient-name{font-weight:500;color:var(--color-text);line-height:1.2;display:flex;align-items:center;gap:var(--spacing-xs)}.preferred-star{font-size:var(--font-size-sm);color:var(--color-warning, #f59e0b);flex-shrink:0;margin-right:2px;filter:drop-shadow(0 0 1px rgba(245,158,11,.3))}.ingredient-modifier{font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:1.2}.ingredient-brand{font-size:var(--font-size-xs);color:var(--color-primary);line-height:1.2;font-weight:500}.ingredient-brand .brand-name{color:var(--color-primary)}.ingredient-brand .brand-owner{color:var(--color-text-secondary);font-weight:400}.brand-info-row{display:flex;align-items:center;gap:var(--spacing-sm);margin-top:var(--spacing-sm);font-size:var(--font-size-sm)}.brand-info-row .detail-label{color:var(--color-text-muted);font-weight:500}.brand-info-row .brand-info{color:var(--color-primary);font-weight:500}.ingredient-calories{font-size:var(--font-size-xs);color:var(--color-success, #10b981);font-weight:500;line-height:1.2;margin-top:2px}.ingredient-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);margin-top:6px}.allergen-tags,.dietary-tags{display:flex;flex-wrap:wrap;gap:4px}.allergen-tag{display:inline-block;padding:2px 6px;font-size:10px;font-weight:600;border-radius:4px;background-color:#fee2e2;color:#dc2626;border:1px solid #fca5a5;white-space:nowrap}.dietary-tag{display:inline-block;padding:2px 6px;font-size:10px;font-weight:600;border-radius:4px;background-color:#dcfce7;color:#16a34a;border:1px solid #86efac;white-space:nowrap}.dropdown-item.selected .ingredient-name,.dropdown-item.selected .ingredient-modifier,.dropdown-item.selected .ingredient-brand,.dropdown-item.selected .ingredient-brand .brand-name,.dropdown-item.selected .ingredient-brand .brand-owner,.dropdown-item.selected .ingredient-calories{color:var(--color-text-inverse)}.dropdown-item.selected .allergen-tag{background-color:#fee2e24d;color:#fecaca;border-color:#fca5a54d}.dropdown-item.selected .dietary-tag{background-color:#dcfce74d;color:#bbf7d0;border-color:#86efac4d}.file-input-container{position:relative;display:flex;align-items:center;gap:var(--spacing-sm)}.remove-image-btn.inline{position:absolute;right:var(--spacing-sm);top:50%;transform:translateY(-50%);background:var(--color-error);color:var(--color-text-inverse);border:none;padding:var(--spacing-sm);margin-right:var(--spacing-xs);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--font-size-xs);transition:background-color var(--transition-fast);z-index:10}.remove-image-btn.inline:hover{background:var(--color-error-light)}.tag-input-container,.multi-select-tag-input{margin-bottom:var(--spacing-md)}.tag-input-wrapper{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm)}.tag-input{flex:1;padding:var(--spacing-sm)}.add-tag-btn{padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-secondary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:var(--font-family);cursor:pointer;transition:background-color var(--transition-fast)}.add-tag-btn:hover{background-color:var(--color-secondary-dark)}.tags-list,.selected-tags-container{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}.selected-tags-container{margin-bottom:var(--spacing-sm);padding:var(--spacing-sm);background-color:var(--color-surface-alt);border:1px solid var(--color-neutral);border-radius:var(--radius-md);min-height:2.5rem;align-items:center;transition:border-color var(--transition-fast)}.selected-tags-container:focus-within{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus)}.tag,.selected-tag{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:500;transition:background-color var(--transition-fast)}.tag{background-color:var(--color-primary-50);color:var(--color-primary);border:1px solid var(--color-primary-100)}.selected-tag{background-color:var(--color-primary);color:var(--color-text-inverse)}.selected-tag:hover{background-color:var(--color-primary-dark)}.remove-tag-btn{background:none;border:none;cursor:pointer;font-size:1rem;line-height:1;padding:0;margin-left:var(--spacing-xs);transition:opacity var(--transition-fast)}.tag .remove-tag-btn{color:var(--color-primary)}.tag .remove-tag-btn:hover{color:var(--color-error)}.selected-tag .remove-tag-btn{color:var(--color-text-inverse);opacity:.8;border-radius:var(--radius-sm)}.selected-tag .remove-tag-btn:hover{opacity:1;background-color:#ffffff1a}.tag-search-container{position:relative}.tag-checkbox{width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-sm);font-weight:700;color:inherit}.section-title{margin:0 0 var(--spacing-xs) 0;font-size:var(--font-size-xl);font-weight:600;color:var(--color-text)}.section-subtitle{margin:0;color:var(--color-text-secondary);font-size:var(--font-size-sm)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-sm) var(--spacing-md);border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:var(--font-family);font-weight:500;cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.btn:disabled,.btn-disabled{opacity:.5;cursor:not-allowed}.btn-primary,.btn-secondary,.btn-danger{color:var(--color-text-inverse)}.btn-primary{background-color:var(--color-primary)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-dark)}.btn-secondary{background-color:var(--color-secondary)}.btn-secondary:hover:not(:disabled){background-color:var(--color-secondary-dark)}.btn-danger{background-color:var(--color-error)}.btn-danger:hover:not(:disabled){background-color:var(--color-error-dark)}.btn-ghost{background-color:transparent;color:var(--color-text-secondary);border:1px solid var(--color-neutral)}.btn-ghost:hover:not(:disabled){background-color:var(--color-background-alt);color:var(--color-text)}.btn-sm{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs)}.btn-md{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm)}.btn-lg{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base)}.loading-spinner-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-sm)}.loading-spinner{border-radius:50%;border-style:solid;animation:spin 1s linear infinite}.loading-spinner-sm,.loading-spinner-md{border-width:2px}.loading-spinner-sm{width:1rem;height:1rem}.loading-spinner-md{width:1.5rem;height:1.5rem}.loading-spinner-lg{width:2.5rem;height:2.5rem;border-width:3px}.loading-spinner-primary,.loading-spinner-secondary{border-color:var(--color-neutral-50)}.loading-spinner-primary{border-top-color:var(--color-primary)}.loading-spinner-secondary{border-top-color:var(--color-secondary)}.loading-spinner-light{border-color:#ffffff4d;border-top-color:var(--color-text-inverse)}.loading-spinner-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:500}.loading-skeleton{background:linear-gradient(90deg,var(--color-neutral-50, #f1f5f9) 25%,var(--color-neutral-100, #e2e8f0) 50%,var(--color-neutral-50, #f1f5f9) 75%);background-size:200% 100%;border-radius:var(--radius-sm, 4px);display:block;min-height:1rem;background-color:#f1f5f9}.loading-skeleton-animated{animation:shimmer 1.5s ease-in-out infinite}.loading-skeleton-text{height:1em;margin-bottom:var(--spacing-xs, 8px)}.loading-skeleton-text:last-child{margin-bottom:0}.loading-skeleton-text-container{display:flex;flex-direction:column;gap:var(--spacing-xs, 8px)}.loading-skeleton-rectangle{border-radius:var(--radius-md, 8px)}.loading-skeleton-circle{border-radius:50%}.loading-skeleton-card{padding:var(--spacing-md, 16px);border:1px solid var(--color-neutral, #e2e8f0);border-radius:var(--radius-md, 8px);background:var(--color-surface, #ffffff);display:block}.loading-skeleton-card-header{display:flex;align-items:center;gap:var(--spacing-sm, 12px);margin-bottom:var(--spacing-md, 16px)}.loading-skeleton-card-title{flex:1;display:flex;flex-direction:column;gap:var(--spacing-xs, 8px)}.loading-skeleton-card-content{display:flex;flex-direction:column;gap:var(--spacing-xs, 8px)}.try-again-container{display:flex;align-items:center;justify-content:center}.try-again-simple{padding:var(--spacing-sm)}.try-again-detailed{padding:var(--spacing-lg);text-align:center}.try-again-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);max-width:400px}.try-again-icon{display:inline-flex;align-items:center;margin-right:var(--spacing-xs)}.try-again-icon-large{font-size:3rem;color:var(--color-text-muted);margin-bottom:var(--spacing-sm)}.try-again-message{text-align:center}.try-again-title{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}.try-again-text{margin:0;color:var(--color-text-secondary);font-size:var(--font-size-sm);line-height:1.5}.try-again-button{min-width:120px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.readonly-value{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-size:var(--font-size-base);line-height:1.5;min-height:44px;display:flex;align-items:center}.readonly-value.readonly-textarea{min-height:80px;align-items:flex-start;padding-top:var(--spacing-md);white-space:pre-wrap}.image-preview{border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;max-width:300px;max-height:200px;margin-top:var(--spacing-sm);position:relative;z-index:1;margin-left:auto;margin-right:auto;display:flex;justify-content:center;align-items:center}.image-preview img,.recipe-image-content{width:100%;height:auto;max-height:200px;max-width:300px;-o-object-fit:cover;object-fit:cover;display:block;position:relative}.recipe-image-placeholder{padding:var(--spacing-xl);background:var(--color-background-alt);display:flex;align-items:center;justify-content:center;min-height:200px}.ingredients-rows.readonly .ingredient-row,.direction-subsection.readonly .direction-row,.tag.readonly,.status-display.readonly{background:var(--color-background-alt);border:1px solid var(--color-border);cursor:default}.ingredients-rows.readonly .ingredient-row:hover,.direction-subsection.readonly .direction-row:hover,.tag.readonly:hover{background:var(--color-background-alt);transform:none}.ingredients-rows.readonly .ingredient-row:hover{box-shadow:none}.ingredient-row.readonly .remove-ingredient-btn,.direction-subsection.readonly .drag-handle,.direction-subsection.readonly .remove-btn{display:none}.direction-content.readonly{padding:var(--spacing-sm)}.direction-description{color:var(--color-text)!important;font-family:var(--font-family)!important;font-size:var(--font-size-base)!important;font-weight:400!important;line-height:1.6!important;white-space:pre-wrap}.tag.readonly{color:var(--color-text);flex-shrink:0}.status-display.readonly{border-radius:var(--radius-md);padding:var(--spacing-md)}.status-content.readonly{display:flex;align-items:center;gap:var(--spacing-sm)}.readonly-empty-state{padding:var(--spacing-lg);text-align:center;color:var(--color-text-secondary);font-style:italic;background:var(--color-background-alt);border:1px solid var(--color-border);border-radius:var(--radius-md)}.recipe-form.view-mode{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-2xl);box-shadow:var(--shadow-sm)}.recipe-navigation{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg);width:100%}.back-button{display:flex;align-items:center;gap:var(--spacing-xs)}.edit-button{margin-left:auto}.nutrition-status.readonly{margin:var(--spacing-md) 0}@media (max-width: 768px){.recipe-navigation{flex-direction:column;gap:var(--spacing-sm);align-items:stretch}.back-button{align-self:flex-start}.edit-button{margin-left:0;align-self:flex-end}.readonly-value{min-height:40px;padding:var(--spacing-xs) var(--spacing-sm)}}.tag-badge{display:inline-flex;align-items:center;padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-primary-50);color:var(--color-primary);border:1px solid var(--color-primary-100);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:500;cursor:default;transition:background-color var(--transition-fast);width:-moz-fit-content;width:fit-content;flex-shrink:0}.tag-badge:hover{background-color:var(--color-primary-100)}.tags-list.badge-style{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--spacing-sm);margin-top:var(--spacing-xs)}.layout{position:relative;min-height:100vh;font-family:var(--font-family)}.sidebar-toggle{position:fixed;top:20px;left:20px;z-index:1000;background:var(--color-surface);border:1px solid var(--color-neutral);border-radius:8px;padding:8px;cursor:pointer;transition:all .3s ease;box-shadow:var(--shadow-sm)}.sidebar-toggle:hover{background:var(--color-accent-1-light);transform:scale(1.05)}.sidebar-toggle.closed{left:20px}.sidebar-toggle.open{left:300px}.sidebar{position:fixed;top:0;left:0;width:280px;height:100vh;background:var(--color-surface);border-right:1px solid var(--color-neutral);transition:transform .3s ease;z-index:100;display:flex;flex-direction:column}.sidebar.closed{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.layout-header{padding:20px;border-bottom:1px solid var(--color-neutral);background:var(--color-surface);flex-shrink:0}.header-content{display:flex;flex-direction:column;gap:20px}.logo{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.logo img{width:160px;height:80px;-o-object-fit:contain;object-fit:contain;display:block}.logo h1{font-size:1.1rem;font-weight:600;color:var(--color-text);margin:0;line-height:1.3;font-family:var(--font-family)}.user-info{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:.9rem;font-family:var(--font-family)}.user-info span{color:var(--color-text-secondary)}.layout-nav{padding:20px 0;flex:1}.nav-content{padding:0 20px}.nav-menu{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.nav-item{margin:0}.nav-link{display:flex;align-items:center;gap:12px;padding:12px 16px;color:var(--color-text);text-decoration:none;border-radius:8px;transition:all .2s ease;font-size:.9rem;font-family:var(--font-family)}.nav-link:hover{background:var(--color-accent-1-light)}.nav-link.active{background:var(--color-accent-2-light);color:var(--color-text)}.nav-link svg{color:var(--color-text-secondary);flex-shrink:0}.sidebar-footer{padding:20px;border-top:1px solid var(--color-neutral);background:var(--color-surface);flex-shrink:0;display:flex;flex-direction:column;gap:12px}.logout-button{background:var(--color-secondary);color:#fff;border:1px solid var(--color-neutral);border-radius:6px;padding:8px 12px;cursor:pointer;font-size:.85rem;transition:all .2s ease;width:100%;font-family:var(--font-family);font-weight:500}.logout-button:hover{background:var(--color-accent-2-light)}.powered-by{text-align:center;font-size:.75rem;color:var(--color-text-secondary);font-style:italic;font-family:var(--font-family)}.layout-main{transition:margin-left .3s ease;min-height:100vh;padding:20px}.layout-main.sidebar-open{margin-left:280px}.layout-main.sidebar-closed{margin-left:0}@media (max-width: 768px){.sidebar{width:100%;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-toggle{top:15px;left:15px}.sidebar-toggle.open{left:15px}.layout-main.sidebar-open,.layout-main.sidebar-closed{margin-left:0;padding:15px}.logo h1{font-size:1rem}.layout-header{padding:15px}.nav-content{padding:0 15px}}.dashboard{width:100%}.dashboard-header{text-align:center;margin-bottom:var(--spacing-2xl)}.dashboard-header h2{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-sm)}.dashboard-header p{font-size:var(--font-size-lg);color:var(--color-text-secondary)}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-xl)}.dashboard-card{background:var(--color-surface);border:1px solid var(--color-neutral);border-radius:var(--radius-lg);padding:var(--spacing-xl);text-align:center;transition:all var(--transition-fast);cursor:pointer;position:relative;overflow:hidden}.dashboard-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--color-primary) 0%,var(--color-secondary) 100%);transform:scaleX(0);transition:transform var(--transition-fast)}.dashboard-card:hover:before{transform:scaleX(1)}.dashboard-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--color-primary-light)}.card-icon{width:48px;height:48px;margin:0 auto var(--spacing-lg);display:flex;align-items:center;justify-content:center;background:var(--color-primary-50);border-radius:var(--radius-lg);color:var(--color-primary);transition:all var(--transition-fast)}.dashboard-card:hover .card-icon{background:var(--color-primary);color:var(--color-text-inverse);transform:scale(1.1)}.dashboard-card h3{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-md)}.dashboard-card p{color:var(--color-text-secondary);line-height:1.6}@media (max-width: 768px){.dashboard-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.dashboard-card{padding:var(--spacing-lg)}}@media (max-width: 480px){.dashboard-header h2{font-size:var(--font-size-2xl)}.card-icon{width:40px;height:40px}}.membership-status{margin-top:1rem;padding:1rem;background:#ffffff1a;border-radius:8px;border:1px solid rgba(255,255,255,.2)}.membership-badge{display:flex;gap:.5rem;margin-bottom:.5rem}.badge{padding:.25rem .75rem;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.badge.member{background:#3b82f6;color:#fff}.badge.premium{background:#f59e0b;color:#fff}.badge.admin{background:#ef4444;color:#fff}.member-tags{color:#ffffffb3;font-size:.875rem}.dashboard-card.admin-only{border:2px solid #ef4444;background:linear-gradient(135deg,#ef44441a,#ef44440d)}.dashboard-card.premium-only{border:2px solid #f59e0b;background:linear-gradient(135deg,#f59e0b1a,#f59e0b0d)}.dashboard-card.admin-only .card-icon svg,.dashboard-card.premium-only .card-icon svg{filter:drop-shadow(0 0 8px currentColor)}.dashboard-card.admin-only .card-icon{color:#ef4444}.dashboard-card.premium-only .card-icon{color:#f59e0b}.error-highlight{animation:highlight-pulse 3s ease-in-out;border:2px solid var(--color-red-500, #ef4444)!important;border-radius:var(--radius-md);background-color:var(--color-red-50, #fef2f2)!important;box-shadow:0 0 0 3px #ef44441a!important;padding:1rem!important;margin:-1rem -1rem 2rem!important}@keyframes highlight-pulse{0%{box-shadow:0 0 0 3px #ef444466}50%{box-shadow:0 0 0 6px #ef444433}to{box-shadow:0 0 0 3px #ef44441a}}.create-recipe{max-width:800px;margin:0 auto;padding:var(--spacing-2xl) var(--spacing-lg)}.create-recipe-header{text-align:center;margin-bottom:var(--spacing-2xl)}.create-recipe-header h1{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-sm)}.create-recipe-header p{font-size:var(--font-size-lg);color:var(--color-text-secondary)}.recipe-form{background:var(--color-surface);border:1px solid var(--color-neutral);border-radius:var(--radius-lg);padding:var(--spacing-2xl);box-shadow:var(--shadow-md)}.recipe-actions{display:flex;gap:var(--spacing-sm);align-items:center}.delete-button{display:flex;align-items:center;gap:var(--spacing-xs)}.delete-button:hover{background-color:#dc2626!important;color:#fff!important}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-md);max-width:400px;width:90%;box-shadow:var(--shadow-xl)}.modal-content h3{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-md)}.modal-content p{color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);line-height:1.5}.modal-actions{display:flex;gap:var(--spacing-sm);justify-content:flex-end}.modal-actions .btn-danger{background-color:#dc2626!important;color:#fff!important}.modal-actions .btn-danger:hover:not(:disabled){background-color:#b91c1c!important;color:#fff!important}.form-section{margin-bottom:var(--spacing-2xl);padding-bottom:var(--spacing-xl);border-bottom:1px solid var(--color-neutral)}.form-section:last-of-type{border-bottom:none;margin-bottom:var(--spacing-xl)}.form-section h2{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-sm)}.form-section h2:before{content:"";width:4px;height:24px;background:var(--color-primary);border-radius:var(--radius-sm)}.radio-group{display:flex;flex-direction:column;gap:var(--spacing-md)}.radio-option{display:flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;padding:var(--spacing-sm);border-radius:var(--radius-md);transition:all var(--transition-fast)}.radio-option:hover{background:var(--color-primary-50)}.radio-option input[type=radio]{width:auto;margin:0;cursor:pointer}.radio-label{font-weight:500;color:var(--color-text);cursor:pointer}.status-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--spacing-sm)}.status-option{display:flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;padding:var(--spacing-xs) var(--spacing-sm);border:2px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg-secondary);transition:all var(--transition-fast);min-height:60px;position:relative;box-shadow:0 1px 3px #0000001a}.status-option:hover{border-color:var(--color-primary-300);background:var(--color-primary-50);transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.status-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.status-content{display:flex;align-items:center;gap:var(--spacing-sm);flex:1}.status-icon{font-size:1.2em;line-height:1;flex-shrink:0;font-weight:700;width:20px;text-align:center}.status-option[data-status=draft] .status-icon{color:var(--color-text-secondary)}.status-option[data-status=in_review] .status-icon{color:var(--color-warning)}.status-option[data-status=published] .status-icon{color:var(--color-success)}.status-text{display:flex;flex-direction:column;gap:2px;min-width:0}.status-label{font-weight:600;color:var(--color-text);font-size:.9rem;line-height:1.2}.status-description{font-size:.75rem;color:var(--color-text-secondary);line-height:1.2}.status-option:has(input:checked){border-color:var(--color-primary-500);background:var(--color-primary-100);box-shadow:0 0 0 3px var(--color-primary-100)}.status-option:has(input:focus-visible){outline:2px solid var(--color-primary-500);outline-offset:2px}.status-option:has(input:checked) .status-label{color:var(--color-primary-700);font-weight:700}.status-option:has(input:checked) .status-description{color:var(--color-primary-600)}.status-option:has(input:checked) .status-icon{color:var(--color-primary-600)}@media (max-width: 640px){.status-group{grid-template-columns:1fr;gap:var(--spacing-xs)}.status-option{min-height:50px;padding:var(--spacing-xs) var(--spacing-sm)}.status-icon{font-size:1.25em}}.form-actions{display:flex;gap:var(--spacing-md);justify-content:flex-end;align-items:center;padding-top:var(--spacing-xl)}.save-success-message{color:var(--color-success);font-weight:600;display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-success-50);border:1px solid var(--color-success-200);border-radius:var(--radius-md);font-size:var(--font-size-sm)}@media (max-width: 768px){.create-recipe{padding:var(--spacing-lg) var(--spacing-md)}.recipe-form{padding:var(--spacing-lg)}}@media (max-width: 480px){.create-recipe-header h1{font-size:var(--font-size-2xl)}.form-section h2{font-size:var(--font-size-lg)}.recipe-form{padding:var(--spacing-md)}}.ingredients-list{margin-bottom:var(--spacing-xl)}.ingredients-list h3{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm)}.ingredients-rows{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--spacing-lg)}.ingredient-row{display:flex;align-items:flex-start;justify-content:space-between;background:var(--color-surface);border:1px solid var(--color-neutral);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-md);transition:all var(--transition-fast);position:relative;min-height:52px}.ingredient-row:hover{border-color:var(--color-primary-300);box-shadow:0 1px 3px #00000014;background:var(--color-primary-25);transform:translateY(-1px)}.ingredient-row{cursor:grab}.ingredient-row.dragging{opacity:.5;transform:rotate(2deg) scale(1.02);cursor:grabbing;z-index:10;border-color:var(--color-primary-500);box-shadow:0 4px 12px #00000026}.ingredient-row.drag-over{border-color:var(--color-primary-500);background:var(--color-primary-100);transform:scale(1.02);box-shadow:0 2px 8px #0000001a}.drag-handle{color:var(--color-text-muted);font-size:14px;cursor:grab;padding:4px 8px 4px 4px;margin-right:var(--spacing-sm);opacity:.7;transition:all var(--transition-fast);flex-shrink:0;line-height:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ingredient-row:hover .drag-handle{opacity:1;color:var(--color-primary-600)}.ingredient-row.dragging .drag-handle{cursor:grabbing}.ingredient-info{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}.ingredient-name{font-size:var(--font-size-base);font-weight:600;color:var(--color-text);line-height:1.3;margin:0}.ingredient-sub-name{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:1.3;margin:0}.ingredient-fdc-id{font-size:var(--font-size-xs);color:var(--color-text-muted);opacity:.6;line-height:1.3;margin:0;font-family:monospace}.ingredient-gram-amount{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:500;line-height:1.3}.ingredient-amounts{display:flex;flex-direction:column;align-items:flex-end;gap:3px;margin-right:var(--spacing-sm);text-align:right;min-width:80px}.ingredient-unit-amount{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);background:var(--color-primary-50);padding:6px 12px;border-radius:var(--radius-sm);border:1px solid var(--color-primary-200);line-height:1.3;white-space:nowrap;display:flex;align-items:center;gap:6px}.remove-ingredient-btn{background:none;border:none;color:var(--color-text-muted);font-size:20px;font-weight:700;cursor:pointer;padding:4px;border-radius:var(--radius-xs);transition:all var(--transition-fast);line-height:1;width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.6}.remove-ingredient-btn:hover{background:var(--color-danger-50);color:var(--color-danger-600);opacity:1;transform:scale(1.1)}.edit-ingredient-btn{background:none;border:none;color:var(--color-primary-600);font-size:14px;cursor:pointer;padding:2px 4px;border-radius:var(--radius-xs);transition:all var(--transition-fast);line-height:1;display:flex;align-items:center;justify-content:center;opacity:.7;margin-left:2px}.edit-ingredient-btn:hover{background:var(--color-primary-100);opacity:1;transform:scale(1.1)}.ingredient-edit-section{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--color-primary-50);padding:6px 12px;border-radius:var(--radius-sm);border:1px solid var(--color-primary-200)}.ingredient-edit-amount-input{width:60px;display:flex;align-items:center}.ingredient-edit-amount-input input{padding:6px 8px;font-size:var(--font-size-sm);font-weight:600;height:28px;min-height:28px;border:1px solid var(--color-primary-300);text-align:center;line-height:1}.ingredient-unit-text{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);white-space:nowrap}.ingredient-edit-actions{display:flex;gap:6px;margin-left:6px}.save-edit-btn,.cancel-edit-btn{border:none;font-size:var(--font-size-sm);font-weight:500;cursor:pointer;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);transition:all var(--transition-fast);line-height:1;min-height:28px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-family)}.save-edit-btn{background-color:var(--color-primary);color:var(--color-text-inverse)}.save-edit-btn:hover{background-color:var(--color-primary-dark)}.cancel-edit-btn{background-color:transparent;color:var(--color-text-secondary);border:1px solid var(--color-neutral)}.cancel-edit-btn:hover{background-color:var(--color-background-alt);color:var(--color-text)}.recipe-allergen-dietary-summary{border:2px solid var(--color-primary-100, #dbeafe);border-radius:var(--radius-md);padding:var(--spacing-md);background:var(--color-primary-50, #eff6ff);max-width:800px;margin-bottom:var(--spacing-lg);box-shadow:0 1px 3px #0000001a}.recipe-allergen-dietary-summary h4{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-base);color:var(--color-text);font-weight:600}.recipe-allergen-dietary-summary .summary-content{display:flex;flex-direction:column;gap:var(--spacing-sm)}.recipe-allergen-dietary-summary .summary-section{display:flex;align-items:center;gap:var(--spacing-sm);flex-wrap:wrap}.recipe-allergen-dietary-summary .summary-label{font-weight:600;color:var(--color-text);font-size:var(--font-size-sm);white-space:nowrap}.ingredient-search-box{border:1px solid var(--color-neutral);border-radius:var(--radius-md);padding:var(--spacing-md);background:var(--color-background-alt);max-width:800px;margin-bottom:var(--spacing-md);box-shadow:0 1px 3px #0000001a}.ingredient-search-box h3{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-sm);color:var(--color-text-muted);font-weight:500}.ingredient-form-grid{display:flex;flex-direction:column;gap:var(--spacing-md)}.top-row,.bottom-row,.amount-row{display:flex;gap:var(--spacing-sm);align-items:flex-start}.search-field{flex:2;min-width:200px;margin:0;padding:0}.search-field .search-container{margin:0;padding:0}.name-field,.subname-field{flex:1;min-width:200px}.amount-field,.unit-field,.amount-grams-field{flex:1;min-width:150px}.ingredient-form-grid .form-group{margin-bottom:0;display:flex;flex-direction:column}.ingredient-form-grid .form-group>*{width:100%}.field-label{display:block;font-size:var(--font-size-xs);font-weight:500;color:var(--color-text-muted);margin-top:var(--spacing-md);margin-bottom:4px}.input--readonly,.input--shaded,.fdc-field input,.amount-grams-field input,.ingredient-fdc-display input,.author-disabled,.ingredient-amount-grams-display input{background-color:var(--color-background-alt)!important;border-color:var(--color-neutral)!important}.input--readonly,.fdc-field input,.amount-grams-field input,.ingredient-amount-grams-display input{flex:0 0 120px;height:32px;min-height:32px;max-height:32px;color:var(--color-text-muted);cursor:not-allowed;padding:4px 8px;box-sizing:border-box}.ingredient-form-grid .form-input:focus,.ingredient-form-grid input:focus,.ingredient-form-grid .form-select:focus,.ingredient-form-grid select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus)}.validation-errors{margin-top:var(--spacing-sm);padding:var(--spacing-sm);background:var(--color-error-50);border:1px solid var(--color-error);border-radius:var(--radius-md)}.validation-errors p{margin:0;font-size:var(--font-size-sm);color:var(--color-error);font-weight:500}.validation-errors p:not(:last-child){margin-bottom:var(--spacing-xs)}@media (max-width: 768px){.ingredient-row{flex-direction:column;align-items:flex-start;gap:var(--spacing-sm)}.ingredient-amounts{align-items:flex-start;margin-right:0;width:100%}.ingredient-unit-amount{align-self:flex-start}.ingredient-form-grid{gap:var(--spacing-sm)}.top-row,.bottom-row{flex-direction:column;gap:var(--spacing-sm)}.search-field,.fdc-field,.name-field,.subname-field{flex:1;min-width:100%}}.direction-subsection{margin-bottom:var(--spacing-md);border:1px solid var(--color-neutral);border-radius:var(--radius-md);background:var(--color-surface)}.direction-subsection-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-background-alt);border-bottom:1px solid var(--color-neutral-200);border-radius:var(--radius-md) var(--radius-md) 0 0}.direction-subsection-title{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-muted);margin:0;text-transform:uppercase;letter-spacing:.025em}.collapse-toggle-btn{font-size:var(--font-size-lg);font-weight:300;line-height:1;width:32px;height:32px;min-width:32px;padding:0;flex-shrink:0;border:none!important}.collapse-toggle-btn:hover{transform:scale(1.05);border:none!important}.direction-add-btn{margin:var(--spacing-sm) auto 0;justify-content:center;flex-wrap:wrap;box-shadow:0 2px 4px #0000001a;transition:all var(--transition-fast);display:block;width:auto}.direction-add-btn:hover{box-shadow:0 4px 8px #00000026;transform:translateY(-1px)}.direction-subsection-content{padding:var(--spacing-md);overflow:hidden;transition:all var(--transition-normal)}.direction-subsection-content.collapsed{max-height:0;padding-top:0;padding-bottom:0;opacity:0}.direction-row{display:flex;align-items:flex-start;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm);transition:all var(--transition-fast);border-radius:var(--radius-sm);padding:var(--spacing-xs);margin:var(--spacing-xs) calc(-1 * var(--spacing-xs));cursor:move}.direction-row:hover{background:var(--color-surface-alt);box-shadow:0 2px 4px #0000000d}.direction-row.dragging{opacity:.5;transform:rotate(2deg);box-shadow:0 4px 12px #00000026;background:var(--color-surface);border:1px dashed var(--color-primary)}.direction-row.drag-over{background:var(--color-primary-50);border:2px solid var(--color-primary);transform:scale(1.02)}.drag-handle{color:var(--color-text-muted);font-size:var(--font-size-sm);cursor:grab;padding:var(--spacing-xs);border-radius:var(--radius-xs);transition:all var(--transition-fast);line-height:1;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;width:20px;height:28px;flex-shrink:0;margin-top:var(--spacing-sm);align-self:flex-start}.drag-handle:hover{background:var(--color-neutral-100);color:var(--color-text);transform:scale(1.1)}.drag-handle:active{cursor:grabbing;transform:scale(.95)}.direction-step{display:flex;align-items:flex-start;gap:var(--spacing-sm);flex:1}.step-number{background:var(--color-primary);color:var(--color-text-inverse);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-sm);font-weight:600;flex-shrink:0;margin-top:var(--spacing-sm)}.direction-content{flex:1;display:flex;flex-direction:column;gap:var(--spacing-sm)}.direction-input{width:100%;min-height:60px;padding:var(--spacing-sm);border:1px solid var(--color-neutral);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:var(--font-family);background:var(--color-surface);color:var(--color-text);resize:none;overflow:hidden;transition:height var(--transition-fast)}.direction-input.auto-resize{resize:none;overflow-y:hidden}.direction-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-100)}.remove-btn{background:none;border:none;color:var(--color-text-muted);font-size:16px;font-weight:700;cursor:pointer;padding:4px;border-radius:var(--radius-xs);transition:all var(--transition-fast);line-height:1;width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.6}.remove-btn:hover{background:var(--color-danger-50);color:var(--color-danger-600);opacity:1;transform:scale(1.1)}@media (max-width: 768px){.direction-subsection-header{padding:var(--spacing-xs)}.direction-subsection-title{text-align:left}.direction-subsection-content{padding:var(--spacing-sm)}.direction-row{flex-direction:column;gap:var(--spacing-xs);align-items:stretch}.drag-handle{align-self:flex-start;margin-top:0}}.recipe-card{background:var(--color-surface);border:1px solid var(--color-neutral);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all var(--transition-normal);box-shadow:var(--shadow-sm);position:relative;width:100%;max-width:100%;box-sizing:border-box;display:flex;flex-direction:column}.recipe-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--color-primary) 0%,var(--color-secondary) 100%);transform:scaleX(0);transition:transform var(--transition-fast);z-index:10}.recipe-card:hover:before{transform:scaleX(1)}.recipe-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--color-primary-light)}.recipe-image,.recipe-image-placeholder{width:100%;height:160px;overflow:hidden;background:var(--color-background-alt);position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:center}.recipe-image-placeholder{display:flex;align-items:center;justify-content:center}.recipe-image-placeholder .placeholder-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);color:var(--color-text-secondary);opacity:.7}.recipe-image-placeholder .placeholder-content span{font-size:var(--font-size-sm);font-weight:500}.recipe-image img,.recipe-image-content{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;-o-object-position:center;object-position:center;transition:transform var(--transition-normal);z-index:1}.recipe-card:hover .recipe-image img,.recipe-card:hover .recipe-image .recipe-image-content{transform:scale(1.05)}.recipe-content{padding:var(--spacing-md);flex:1;min-height:0;position:relative;z-index:2}.recipe-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-sm);gap:var(--spacing-sm)}.recipe-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin:0;flex:1;line-height:1.3}.recipe-badges{display:flex;flex-direction:column;gap:var(--spacing-xs);flex-shrink:0}.status-badge,.complexity-badge{padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:500;text-transform:capitalize;text-align:center;min-width:60px;font-family:var(--font-family)}.status-published{background:var(--color-success-light);color:#000;border:1px solid var(--color-success);box-shadow:var(--shadow-sm)}.status-in-review{background:var(--color-warning-light);color:#000;border:1px solid var(--color-warning);box-shadow:var(--shadow-sm)}.status-draft{background:var(--color-neutral-50);color:#000;border:1px solid var(--color-neutral);box-shadow:var(--shadow-sm)}.complexity-easy{background:var(--color-success-light);color:var(--color-success)}.complexity-medium{background:var(--color-warning-light);color:var(--color-warning)}.complexity-hard{background:var(--color-error-light);color:var(--color-error)}.recipe-meta{display:flex;align-items:center;gap:var(--spacing-xs);margin-bottom:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);flex-wrap:wrap}.meta-item{display:inline-flex;align-items:center;gap:2px}.meta-item strong{color:var(--color-text);font-weight:600}.meta-divider{color:var(--color-text-muted);font-weight:700;margin:0 var(--spacing-xs)}.recipe-tags{display:flex;flex-wrap:wrap;gap:2px}.tag{display:inline-flex;align-items:center;background:var(--color-accent-1-light);color:var(--color-primary);padding:2px 4px;border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:500}.tag-more{background:var(--color-neutral-50);color:var(--color-text-secondary);padding:2px 6px;border-radius:4px;font-size:11px;font-weight:500;line-height:1.2}.recipe-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--color-neutral-50);padding-top:var(--spacing-sm);margin-top:auto}.author-info{display:flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-xs);color:var(--color-text-secondary)}.author-icon{flex-shrink:0;opacity:.7}.author-name{font-weight:500}.created-date{font-size:var(--font-size-xs);color:var(--color-text-muted);text-align:right}@media (max-width: 480px){.recipe-meta{grid-template-columns:1fr}}.view-recipes{padding:var(--spacing-lg);max-width:1200px;margin:0 auto;min-height:100vh}.view-recipes-header{margin-bottom:var(--spacing-2xl);text-align:center}.view-recipes-header h2{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-sm)}.view-recipes-header p{font-size:var(--font-size-lg);color:var(--color-text-secondary)}.recipes-controls{display:flex;align-items:center;gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);background:var(--color-surface);padding:var(--spacing-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-neutral-50)}.search-section{flex:2;min-width:350px;max-width:600px}.search-container{position:relative;width:100%}.search-icon{position:absolute;left:var(--spacing-md);top:50%;transform:translateY(-50%);color:var(--color-text-secondary);pointer-events:none;z-index:1}.search-input{width:100%;height:40px!important;min-height:40px!important;max-height:40px!important;padding:0 2.5rem!important;margin:0!important;border:2px solid var(--color-neutral)!important;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:var(--font-family);font-weight:500;line-height:1!important;background-color:var(--color-background);color:var(--color-text);transition:border-color var(--transition-fast);box-shadow:var(--shadow-sm);box-sizing:border-box!important;vertical-align:top;display:block}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus)}.search-input::-moz-placeholder{color:var(--color-text-secondary)}.search-input::placeholder{color:var(--color-text-secondary)}.clear-search{position:absolute;right:var(--spacing-md);top:50%;transform:translateY(-50%);background:none;border:none;color:var(--color-text-secondary);cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center}.clear-search:hover{color:var(--color-text);background:var(--color-neutral-50)}.filters-section{display:flex;align-items:center;flex-shrink:0}.filter-group{display:flex;align-items:center;gap:var(--spacing-md)}.ownership-toggle-container{display:flex;align-items:center}.toggle-switch{display:flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-weight:500;color:var(--color-text);font-size:var(--font-size-sm);height:40px;padding:0 var(--spacing-sm);border:2px solid var(--color-neutral);border-radius:var(--radius-md);background-color:var(--color-background);transition:border-color var(--transition-fast);box-shadow:var(--shadow-sm)}.toggle-switch:hover{border-color:var(--color-primary)}.toggle-switch:focus-within{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus)}.toggle-input{position:absolute;opacity:0;pointer-events:none}.toggle-slider{position:relative;width:56px;height:28px;background:linear-gradient(135deg,#e5e5e5,#d1d1d1);border-radius:28px;transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;box-shadow:inset 0 2px 6px #0000001a,0 1px 3px #0000001a}.toggle-slider:before{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;background:linear-gradient(135deg,#fff,#f8f8f8);border-radius:50%;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 3px 8px #00000026,0 1px 3px #0000001a}.toggle-input:checked+.toggle-slider{background:linear-gradient(135deg,#8e432e,#af7025);box-shadow:inset 0 2px 6px #8e432e4d,0 2px 8px #8e432e33}.toggle-input:checked+.toggle-slider:before{transform:translate(28px);box-shadow:0 4px 12px #0003,0 2px 4px #0000001a}.toggle-input:focus+.toggle-slider{box-shadow:inset 0 2px 6px #0000001a,0 1px 3px #0000001a,0 0 0 4px #8e432e26}.toggle-label-text{font-weight:600;color:var(--color-text);transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:.01em}.toggle-input:checked~.toggle-label-text{color:#8e432e}.status-filter-container{display:flex;align-items:center}.status-filter{height:40px;padding:0 var(--spacing-md);border:2px solid var(--color-neutral);border-radius:var(--radius-md);background:var(--color-background);color:var(--color-text);font-size:var(--font-size-sm);font-family:var(--font-family);font-weight:500;transition:border-color var(--transition-fast);cursor:pointer;box-shadow:var(--shadow-sm);min-width:140px}.status-filter:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-focus)}.status-filter:hover{border-color:var(--color-primary)}.loading-container,.error-container,.no-recipes{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-2xl);text-align:center}.error-message{font-size:var(--font-size-lg);color:var(--color-text-secondary);color:var(--color-error);margin-bottom:var(--spacing-md)}.empty-state h3,.no-results h3{font-size:var(--font-size-2xl);color:var(--color-text);margin-bottom:var(--spacing-md);font-weight:600}.empty-state p,.no-results p{color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);font-size:var(--font-size-base)}.recipes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:var(--spacing-lg);margin-top:var(--spacing-xl)}.recipe-detail{max-width:100%;margin:0 auto}.recipe-detail-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2xl);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-neutral)}.back-button{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md)}.recipe-actions{display:flex;gap:var(--spacing-md)}.recipe-detail-content{display:grid;grid-template-columns:1fr;gap:var(--spacing-xl)}.recipe-detail-main{display:flex;flex-direction:column;gap:var(--spacing-2xl)}.recipe-title-section{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-md)}.recipe-title-section h1{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-text);margin:0;flex:1;line-height:1.2}.recipe-detail-image,.recipe-detail-image-placeholder{width:100%;max-height:400px;overflow:hidden;border-radius:var(--radius-lg);background:var(--color-background-alt);box-shadow:var(--shadow-md)}.recipe-detail-image-placeholder{display:flex;align-items:center;justify-content:center;min-height:300px}.recipe-detail-image-placeholder .placeholder-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);color:var(--color-text-secondary);opacity:.7}.recipe-detail-image-placeholder .placeholder-content span{font-size:var(--font-size-lg);font-weight:500}.recipe-detail-image img,.recipe-detail-image-content{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.ingredients-section h3,.directions-section h3{font-size:var(--font-size-2xl);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-md)}.recipe-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md)}.info-card{background:var(--color-background-alt);padding:var(--spacing-lg);border-radius:var(--radius-lg);text-align:center;border:1px solid var(--color-neutral-50)}.info-card h4{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary);margin-bottom:var(--spacing-sm);text-transform:uppercase;letter-spacing:.05em}.info-card p{font-size:var(--font-size-xl);font-weight:700;color:var(--color-text);margin:0}.ingredients-list,.directions-list{display:flex;flex-direction:column;gap:var(--spacing-md)}.ingredient-item{display:grid;grid-template-columns:120px 1fr 80px;gap:var(--spacing-md);align-items:center;padding:var(--spacing-md);background:var(--color-surface);border-radius:var(--radius-md);border:1px solid var(--color-neutral-50);box-shadow:var(--shadow-sm)}.ingredient-amount{font-weight:600;color:var(--color-primary);font-size:var(--font-size-sm)}.ingredient-name strong{color:var(--color-text)}.ingredient-sub{color:var(--color-text-secondary);font-size:var(--font-size-sm);margin-left:var(--spacing-sm)}.ingredient-weight{font-weight:500;color:var(--color-text-secondary);text-align:right;font-size:var(--font-size-sm)}.direction-item{padding:var(--spacing-lg);background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-neutral-50);box-shadow:var(--shadow-sm)}.direction-header{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.step-number{display:flex;align-items:center;justify-content:center;margin-left:var(--spacing-xs);width:2rem;height:2rem;background:var(--color-primary);color:var(--color-text-inverse);border-radius:50%;font-weight:600;font-size:var(--font-size-sm)}.step-type{background:var(--color-neutral-50);color:var(--color-text);padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:500;text-transform:capitalize}.direction-description{font-size:var(--font-size-base);font-family:var(--font-family);line-height:1.6;color:var(--color-text);margin:0}.recipe-detail-sidebar{display:flex;flex-direction:column;gap:var(--spacing-lg)}.recipe-metadata h4,.recipe-tags h4{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-md)}.metadata-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) 0;border-bottom:1px solid var(--color-neutral-50)}.metadata-item:last-child{border-bottom:none}.metadata-item .label{font-weight:500;color:var(--color-text-secondary);font-size:var(--font-size-sm)}.metadata-item .value{color:var(--color-text);font-size:var(--font-size-sm)}@media (max-width: 992px){.recipes-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-md)}}@media (max-width: 768px){.view-recipes{padding:var(--spacing-md);max-width:100%}.recipes-controls{padding:var(--spacing-md);gap:var(--spacing-md)}.search-container{max-width:100%}.filter-group{flex-direction:column;gap:var(--spacing-md);align-items:stretch}.ownership-toggle-container,.status-filter-container{justify-content:center}.status-filter{min-width:160px}.recipes-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--spacing-md);margin-top:var(--spacing-lg)}.recipe-detail-content{grid-template-columns:1fr;gap:var(--spacing-lg)}.recipe-title-section{flex-direction:column;gap:var(--spacing-md)}.recipe-title-section h1{font-size:var(--font-size-2xl)}.recipe-detail-header{flex-direction:column;gap:var(--spacing-md);align-items:stretch}.recipe-actions{justify-content:center}.ingredient-item{grid-template-columns:1fr;gap:var(--spacing-sm);text-align:center}.ingredient-weight{text-align:center}}@media (max-width: 480px){.view-recipes{padding:var(--spacing-sm)}.recipes-grid{grid-template-columns:1fr;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.recipe-info-grid{grid-template-columns:1fr}.recipes-controls{gap:var(--spacing-sm)}}.tags-management{padding:2rem;max-width:1200px;margin:0 auto}.tags-header{margin-bottom:2rem}.tags-header h1{font-size:2rem;font-weight:600;color:#1f2937;margin-bottom:.5rem}.tags-header p{color:#6b7280;font-size:1rem;line-height:1.5}.error-message{background-color:#fef2f2;border:1px solid #fecaca;color:#dc2626;padding:1rem;border-radius:.5rem;margin-bottom:1.5rem;font-weight:500}.create-tag-section{background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:1.5rem;margin-bottom:2rem;box-shadow:0 1px 3px #0000001a}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.section-header h2{font-size:1.25rem;font-weight:600;color:#1f2937;margin:0}.add-tag-btn{display:flex;align-items:center;gap:.5rem}.create-tag-form{border-top:1px solid #e5e7eb;padding-top:1rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.form-actions{display:flex;gap:.75rem;align-items:center}.form-actions button{display:flex;align-items:center;gap:.5rem}.tags-list-section{background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:1.5rem;box-shadow:0 1px 3px #0000001a}.tags-list-section h2{font-size:1.25rem;font-weight:600;color:#1f2937;margin:0 0 1.5rem}.empty-state{text-align:center;padding:3rem;color:#6b7280}.empty-state p{font-size:1rem;margin:0}.tags-list{display:flex;flex-direction:column;gap:.75rem}.tag-item{display:flex;align-items:center;justify-content:space-between;padding:1rem;border:1px solid var(--color-neutral);border-radius:var(--radius-md);background:var(--color-surface-alt);transition:all .2s ease}.tag-item:hover{border-color:var(--color-neutral-dark);background:var(--color-background-alt)}.tag-content{flex:1;display:flex;flex-direction:column;gap:.25rem;min-width:0}.tag-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:.5rem}.tag-info{display:flex;align-items:center;gap:.75rem;flex:1}.tag-id{font-weight:600;color:var(--color-text);font-size:1rem;line-height:1.3}.tag-usage{flex-shrink:0}.usage-count{font-size:.75rem;font-weight:500;padding:.125rem .5rem;border-radius:var(--radius-md);text-transform:uppercase;letter-spacing:.025em;white-space:nowrap;line-height:1.2}.usage-count.unused{background-color:var(--color-neutral-50);color:var(--color-text-muted);border:1px solid var(--color-neutral)}.usage-count.used{background-color:var(--color-primary-50);color:var(--color-primary);border:1px solid var(--color-primary-light)}.tag-description{color:var(--color-text-secondary);font-size:.875rem;line-height:1.4}.tag-description em{font-style:italic;color:var(--color-text-muted)}.edit-description{margin-top:.25rem}.edit-description .description-input{font-size:.875rem}.tag-actions{display:flex;gap:.5rem;align-items:center;flex-shrink:0}.tag-actions button{display:flex;align-items:center;gap:.25rem}@media (max-width: 768px){.tags-management{padding:1rem}.form-row{grid-template-columns:1fr}.section-header,.tag-item{flex-direction:column;align-items:stretch;gap:1rem}.tag-header,.tag-info{flex-direction:column;align-items:flex-start;gap:.5rem}.tag-actions{justify-content:flex-end}.form-actions{flex-direction:column;align-items:stretch}}@media (max-width: 480px){.tags-header h1{font-size:1.5rem}.section-header h2{font-size:1.125rem}.tag-actions{flex-direction:column;gap:.5rem}.tag-actions button{width:100%;justify-content:center}}.nutrition-facts-label{max-width:400px;margin:0 auto;background:#fff;border:2px solid black;font:14px/1.2 Arial,sans-serif}.nutrition-facts-header{padding:8px 12px;border-bottom:8px solid black}.nutrition-facts-title{font:900 28px/1 Arial;margin:0;letter-spacing:-.5px}.serving-info{margin-top:4px}.serving-size{font:600 14px Arial;margin:0}.nutrition-facts-content{padding:0}.calories-section{padding:8px 12px;border-bottom:4px solid black}.calories-row{display:flex;justify-content:space-between;align-items:baseline}.calories-label,.calories-value{font-weight:900}.calories-label{font-size:20px}.calories-value{font-size:36px}.main-nutrients{padding:0 12px;border-bottom:12px solid black}.nutrient-row{display:flex;justify-content:space-between;align-items:center;padding:2px 0;border-bottom:1px solid #999;font-size:14px}.nutrient-row.major{font-weight:700;border-bottom-color:#000}.nutrient-row.indent{padding-left:16px;font-weight:400}.nutrient-row.indent-2{padding-left:32px;font-weight:400}.nutrient-row.compact{padding:1px 0;border-bottom:none;font:400 12px Arial}.nutrient-label{flex:1}.nutrient-value{font-weight:700}.vitamins-minerals{padding:12px}.subsection-header{font:700 13px Arial;text-transform:uppercase;letter-spacing:.5px;margin:8px 0 4px;padding:4px 12px;border-bottom:1px solid #666;color:#333}.nutrient-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding:0 12px}.nutrient-grid .nutrient-row{border-bottom:none}.nutrient-grid .nutrient-row.indent{padding-left:16px}.nutrient-grid .nutrient-row.indent-2{padding-left:32px}.nutrition-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg);padding:var(--spacing-lg);background:var(--color-background-alt);border:1px solid var(--color-neutral);border-radius:var(--radius-md)}.macronutrient-progress{display:flex;flex-direction:column;gap:var(--spacing-md);flex:1;margin-right:var(--spacing-lg)}.progress-bar-container{display:flex;justify-content:center;width:100%}.progress-bar{display:flex;height:24px;width:400px;background:var(--color-neutral-50);border:1px solid var(--color-neutral);border-radius:var(--radius-md);overflow:hidden}.progress-segment{height:100%;transition:width .3s ease}.protein-segment{background:linear-gradient(135deg,#4caf50,#66bb6a)}.carb-segment{background:linear-gradient(135deg,#ff9800,#ffb74d)}.fat-segment{background:linear-gradient(135deg,#f44336,#ef5350)}.macro-labels{display:flex;gap:var(--spacing-lg);justify-content:center}.macro-label{display:flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-sm)}.macro-color{width:12px;height:12px;border-radius:50%;border:2px solid var(--color-surface);box-shadow:0 1px 3px #0003}.protein-color{background:#4caf50}.carb-color{background:#ff9800}.fat-color{background:#f44336}.macro-name{font-weight:600;color:var(--color-text)}.macro-value{font-weight:700;color:var(--color-primary)}.macro-percentage{font:500 var(--font-size-xs) Arial;color:var(--color-text-secondary)}.nutrition-view-options{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.nutrition-support-text{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0;text-align:center;font-weight:500}.nutrition-facts-toggle-container{display:flex;justify-content:center;margin-top:var(--spacing-md)}.nutrition-facts-toggle-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background);border:1px solid var(--color-neutral);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);transition:all var(--transition-fast)}.nutrition-facts-toggle-btn:hover{background:var(--color-background-alt);border-color:var(--color-primary);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.nutrition-facts-toggle-btn:active{transform:translateY(0)}.toggle-text{font-weight:600}.nutrition-facts-toggle-btn .toggle-icon{font-size:12px;transition:transform .2s ease}.nutrition-facts-toggle-btn .toggle-icon.expanded{transform:rotate(0)}.nutrition-facts-toggle-btn .toggle-icon.collapsed{transform:rotate(-90deg)}.nutrition-summary-cards{display:flex;gap:var(--spacing-xs);justify-content:center;margin:0}.nutrition-summary-card{display:flex;align-items:center;gap:var(--spacing-sm);position:relative;overflow:hidden;background:#fff;border:1px solid var(--color-neutral);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:all var(--transition-fast);min-width:120px;padding:var(--spacing-sm)}.nutrition-summary-card.clickable{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.nutrition-summary-card.clickable:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);border-color:var(--color-primary-200)}.nutrition-summary-card.clickable.active{background:var(--color-primary-50);border-color:var(--color-primary);box-shadow:var(--shadow-md)}.nutrition-summary-card.clickable.active:before{background:var(--color-primary);height:3px}.nutrition-summary-card.clickable.active .nutrition-summary-value{color:var(--color-primary)}.nutrition-summary-card.clickable.active .nutrition-summary-label{color:var(--color-primary-700);font-weight:700}.nutrition-summary-card:before{position:absolute;top:0;left:0;right:0;height:2px;opacity:.8;content:"";background:linear-gradient(90deg,var(--color-primary),var(--color-secondary))}.nutrition-summary-content{display:flex;flex-direction:column;gap:var(--spacing-xs);flex:1}.nutrition-summary-value{font:700 var(--font-size-xl)/1.2 Arial;color:var(--color-primary)}.nutrition-summary-label{font:600 var(--font-size-xs) Arial;color:var(--color-text-muted);letter-spacing:.05em}.kcal-per-meal-card .nutrition-summary-content{gap:var(--spacing-xs)}.ml-per-meal-input{display:flex;align-items:center;gap:var(--spacing-xs);margin-top:var(--spacing-xs)}.ml-input{flex:1;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-neutral);border-radius:var(--radius-sm);font-size:var(--font-size-sm);background:var(--color-background);transition:border-color var(--transition-fast);min-width:0;width:80px}.ml-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-100)}.ml-input::-moz-placeholder{color:var(--color-text-muted);font-size:var(--font-size-xs)}.ml-input::placeholder{color:var(--color-text-muted);font-size:var(--font-size-xs)}.ml-unit{font:600 var(--font-size-xs) Arial;color:var(--color-text-muted);white-space:nowrap}.calculate-nutrition-btn{background:var(--color-primary);color:var(--color-text-inverse);padding:var(--spacing-md) var(--spacing-lg);font:600 var(--font-size-base) Arial;gap:var(--spacing-sm);min-width:160px}.calculate-nutrition-btn:hover:not(:disabled){background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.calculate-nutrition-btn.btn--disabled{background:var(--color-neutral);transform:none;box-shadow:none}@media (max-width: 768px){.nutrition-header{flex-direction:column;gap:var(--spacing-md);align-items:stretch}.macronutrient-progress{margin-right:0;margin-bottom:var(--spacing-md)}.progress-bar{width:100%;max-width:400px}.macro-labels{flex-direction:column;gap:var(--spacing-sm);align-items:center}.macro-label{min-width:auto}}@media (max-width: 640px){.nutrition-facts-label{max-width:100%;margin:0}.nutrition-facts-title{font-size:24px}.calories-value{font-size:28px}.nutrient-grid{grid-template-columns:1fr;gap:0}.nutrient-row.compact{font-size:13px;padding:2px 0}.nutrition-summary-cards{flex-direction:column;gap:var(--spacing-md)}.nutrition-summary-card{width:100%;justify-content:center;min-width:auto}}@media (max-width: 480px){.nutrition-facts-title{font-size:20px}.calories-label{font-size:16px}.calories-value{font-size:24px}.nutrient-row{font-size:12px}.nutrient-row.compact{font-size:11px}.subsection-header{font-size:11px;margin:6px 0 3px;padding:3px 0}}.ingredient-amount-input.disabled{background-color:var(--color-neutral-100);color:var(--color-neutral-500);cursor:not-allowed;opacity:.6}.custom-unit-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--spacing-md);background:var(--color-primary-25);border:1px solid var(--color-primary-200);border-radius:var(--radius-md)}.custom-amount-field,.custom-unit-field,.custom-grams-field{display:flex;flex-direction:column}.input-mode-selector{padding:var(--spacing-md);background:var(--color-neutral-50);border-radius:var(--radius-md);border:1px solid var(--color-neutral-200)}.input-mode-selector .field-label{display:block;font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-sm)}.mode-buttons{display:flex;gap:var(--spacing-sm)}.mode-button{flex:1;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-neutral-300);background:var(--color-background);color:var(--color-text);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);font-size:var(--font-size-sm);font-weight:500}.mode-button:hover{border-color:var(--color-primary-300);background:var(--color-primary-25)}.mode-button.active{background:var(--color-secondary);color:#fff;border-color:var(--color-primary)}.grams-input-row{display:flex;justify-content:center}.grams-field{max-width:300px;width:100%}.nutrition-lookup{max-width:1400px;margin:0 auto;padding:2rem;background-color:var(--color-background);min-height:100vh}.nutrition-lookup-header{text-align:center;margin-bottom:3rem}.nutrition-lookup-header h1{color:var(--color-text-primary);font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.nutrition-lookup-header p{color:var(--color-text-secondary);font-size:1.125rem;margin:0}.nutrition-lookup-content{display:grid;grid-template-columns:minmax(600px,1fr) 400px;gap:2rem;align-items:start}.lookup-controls{min-width:600px}.lookup-form{background:var(--color-white);border-radius:12px;padding:2rem;box-shadow:0 4px 6px -1px #0000001a}.ingredient-form-grid{display:flex;flex-direction:column;gap:1.5rem}.top-row{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:end}.search-field{min-width:0}.fdc-field{width:150px}.bottom-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.amount-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem;align-items:end}.form-actions{display:flex;justify-content:center;padding-top:.5rem}.validation-errors{background-color:#fee2e2;border:1px solid #fecaca;border-radius:6px;padding:.75rem;margin-top:1rem}.validation-errors p{color:#dc2626;margin:0;font-size:.875rem}.validation-errors p:not(:last-child){margin-bottom:.25rem}.nutrition-facts-column{position:sticky;top:2rem}.ingredient-name-display{font:500 12px Arial;color:#666;margin-top:2px}.nutrition-facts-placeholder{background:var(--color-white);border-radius:12px;padding:2rem;box-shadow:0 4px 6px -1px #0000001a;text-align:center}.placeholder-content h3{color:var(--color-text-primary);font-size:1.25rem;font-weight:600;margin:0 0 1rem}.placeholder-content p{color:var(--color-text-secondary);font-size:.875rem;margin:0 0 2rem;line-height:1.5}.placeholder-label{display:flex;justify-content:center}.placeholder-border{border:2px solid #e5e5e5;border-radius:8px;padding:1.5rem;max-width:300px;background:#fafafa}.placeholder-text{font-family:Arial,sans-serif;color:#ccc}.placeholder-title{font-size:18px;font-weight:900;margin-bottom:.5rem}.placeholder-serving{font-size:12px;font-weight:600;margin-bottom:.5rem}.placeholder-calories{font-size:16px;font-weight:900;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid #e5e5e5}.placeholder-nutrients div{font-size:12px;font-weight:600;margin-bottom:.25rem;display:flex;justify-content:space-between}@media (max-width: 1100px){.nutrition-lookup-content{grid-template-columns:1fr;gap:2rem}.nutrition-facts-column{position:static;order:2}.lookup-controls{order:1;min-width:0}}@media (max-width: 768px){.nutrition-lookup{padding:1rem}.nutrition-lookup-header h1{font-size:2rem}.lookup-form{padding:1.5rem}.top-row{grid-template-columns:1fr;gap:1rem}.fdc-field{width:100%}.bottom-row,.amount-row{grid-template-columns:1fr}.form-actions{flex-direction:column;align-items:stretch}.nutrition-facts-label{max-width:100%}.nutrition-facts-placeholder{padding:1.5rem}}@media (max-width: 480px){.nutrition-lookup{padding:.5rem}.nutrition-lookup-header{margin-bottom:2rem}.nutrition-lookup-header h1{font-size:1.75rem}.lookup-form,.nutrition-facts-placeholder{padding:1rem}.nutrition-facts-label{font-size:12px}.nutrition-facts-title{font-size:20px!important}.calories-value{font-size:28px!important}.placeholder-border{max-width:100%;padding:1rem}}.ingredient-swap{width:100%}.ingredient-swap-header{text-align:center;margin-bottom:var(--spacing-2xl)}.ingredient-swap-header h1{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-sm)}.ingredient-swap-header p{font-size:var(--font-size-lg);color:var(--color-text-secondary)}.create-group-section{margin-bottom:var(--spacing-xl);justify-self:center}.create-group-btn{background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-md);font-weight:500;cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;gap:var(--spacing-xs)}.create-group-btn:hover{background-color:var(--color-hover)}.create-group-form{display:flex;flex-direction:column;gap:var(--spacing-xs);padding:var(--spacing-md);background:var(--color-surface);border:1px solid var(--color-neutral);border-radius:var(--radius-md)}.form-row{display:flex;flex-direction:column;gap:0}.form-row .ingredient-edit-fields{display:flex;flex-direction:row;gap:var(--spacing-sm);align-items:flex-end}.form-row .form-actions{display:flex;gap:var(--spacing-xs);justify-content:flex-end}.form-actions{display:flex;gap:var(--spacing-sm)}.group-name-input .form-input,.ingredient-search-field .search-input,.fdc-display-field .form-input,.form-actions button,.create-group-form .search-container .search-input,.create-group-form .form-group .form-input{height:40px!important;min-height:34px!important;max-height:34px!important}.save-btn{background-color:var(--color-primary);color:var(--color-text-inverse)}.save-btn:hover{background-color:var(--color-hover)}.save-btn:disabled{background-color:var(--color-text-muted);cursor:not-allowed;opacity:.7}.cancel-btn{background-color:var(--color-text-muted);color:var(--color-text-inverse)}.cancel-btn:hover{background-color:var(--color-text)}.fdc-id-display,.calories-display{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm)}.fdc-id-display .detail-label,.calories-display .detail-label{font-weight:500;color:var(--color-text-muted)}.fdc-id-display .detail-value,.calories-display .detail-value{font-weight:600;color:var(--color-text)}.fdc-id-display .detail-value{font-family:monospace}.allergen-display,.dietary-display{display:flex;align-items:flex-start;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);margin-top:var(--spacing-xs)}.allergen-display .detail-label,.dietary-display .detail-label{font-weight:500;color:var(--color-text-muted);white-space:nowrap;padding-top:2px}.allergen-dietary-row{display:flex;flex-direction:column;gap:var(--spacing-xs);margin-top:var(--spacing-lg)}@media (max-width: 768px){.form-row .ingredient-edit-fields{flex-direction:column;align-items:stretch}}.groups-container{-moz-column-count:2;column-count:2;-moz-column-gap:var(--spacing-xl);column-gap:var(--spacing-xl);margin-bottom:var(--spacing-xl)}.group-card{-moz-column-break-inside:avoid;break-inside:avoid;margin-bottom:var(--spacing-xl);display:inline-block;width:100%;background:var(--color-surface);border:1px solid var(--color-neutral);border-radius:var(--radius-lg);padding:var(--spacing-md);transition:all var(--transition-fast);max-width:100%}.group-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.group-header{margin-bottom:0;padding-bottom:var(--spacing-xs);border-bottom:1px solid var(--color-border)}.group-title-section{display:flex;justify-content:space-between;align-items:center}.group-title-with-toggle{display:flex;align-items:center;gap:var(--spacing-sm)}.collapse-btn{padding:var(--spacing-xs);min-width:32px;height:32px}.chevron{transition:transform var(--transition-fast)}.chevron.expanded{transform:rotate(180deg)}.group-title{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text);margin:0}.group-actions{display:flex;gap:var(--spacing-sm)}.group-actions button{padding:var(--spacing-sm) var(--spacing-md);min-width:40px;height:36px}.group-edit-form{display:flex;gap:var(--spacing-md);align-items:flex-end}.group-edit-actions{display:flex;gap:var(--spacing-sm)}.group-edit-actions button{padding:var(--spacing-sm) var(--spacing-md);min-width:40px;height:36px}.add-ingredient-section{margin-bottom:var(--spacing-sm)}.add-ingredient-header{margin-bottom:4px}.add-form-toggle-btn{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);font-weight:500;transition:all var(--transition-fast)}.add-form-toggle-btn:hover{background-color:var(--color-surface);border-color:var(--color-primary)}.add-ingredient-form{display:block;padding:var(--spacing-sm);background-color:var(--color-surface-alt);border-radius:var(--radius-md);margin-top:var(--spacing-sm)}.add-ingredient-form .ingredient-search-field,.add-ingredient-form .fdc-display-field{display:flex;flex-direction:column;margin-bottom:var(--spacing-md)}.add-ingredient-form .ingredient-search-field .form-label,.add-ingredient-form .fdc-display-field .form-label{height:20px;font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);line-height:1;display:flex;align-items:center;margin-top:var(--spacing-md);margin-bottom:var(--spacing-xs)}.add-ingredient-form .search-container .search-input,.add-ingredient-form .fdc-display-field .form-input{height:40px!important;min-height:40px!important;max-height:40px!important}.add-ingredient-form .search-container{text-align:left!important}.add-ingredient-form .search-container .search-input{text-align:left!important;padding-right:8px!important}.add-ingredient-form .add-ingredient-btn{margin-top:var(--spacing-md)}.add-ingredient-btn{background-color:var(--color-success);color:var(--color-text-inverse);height:40px;min-height:40px;max-height:40px;display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);border:none;border-radius:var(--radius-md);font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-family);align-self:flex-end}.add-ingredient-btn:hover{background-color:var(--color-success-light)}.add-ingredient-btn:disabled{background-color:var(--color-text-muted);cursor:not-allowed;opacity:.7}.ingredients-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--spacing-sm)}.ingredient-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm);border:1px solid var(--color-border-light);border-radius:var(--radius-sm);margin-bottom:var(--spacing-xs);background:var(--color-surface);transition:all var(--transition-fast)}.ingredient-item:last-child{margin-bottom:0}.ingredient-item:hover{box-shadow:var(--shadow-sm);border-color:var(--color-primary)}.ingredient-content{display:flex;justify-content:space-between;align-items:center;width:100%;gap:var(--spacing-sm)}.ingredient-info{flex:1;display:flex;flex-direction:column;gap:2px}.ingredient-name{font-weight:600;color:var(--color-text);margin:0;font-size:var(--font-size-sm);line-height:1.2}.ingredient-name.editable{cursor:pointer;padding:2px 4px;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.ingredient-name.editable:hover{background-color:var(--color-surface-alt);color:var(--color-primary)}.ingredient-subname{font-weight:400;color:var(--color-text-muted);margin:0;font-size:var(--font-size-sm);line-height:1.2;font-style:italic}.ingredient-subname.editable{cursor:pointer;padding:2px 4px;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.ingredient-subname.editable:hover{background-color:var(--color-surface-alt);color:var(--color-primary)}.ingredient-subname.add-modifier{color:var(--color-text-muted);font-style:italic;opacity:.7}.ingredient-subname.add-modifier:hover{opacity:1;color:var(--color-primary)}.ingredient-calories-inline{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:2px;font-weight:500;line-height:1.2;padding:2px 4px}.fdc-id{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0;font-weight:500;background:var(--color-surface-alt);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);border:1px solid var(--color-border);white-space:nowrap;min-width:80px;text-align:center}.ingredient-name-input,.ingredient-subname-input{font-size:var(--font-size-sm);color:var(--color-text);border-radius:var(--radius-sm);margin:0;outline:none;width:100%;font-family:inherit}.ingredient-subname-input{font-weight:400;font-style:italic;color:var(--color-text-muted)}.ingredient-subname-input::-moz-placeholder{color:var(--color-text-muted);opacity:.7;font-style:italic}.ingredient-subname-input::placeholder{color:var(--color-text-muted);opacity:.7;font-style:italic}.ingredient-edit-fields{display:flex;flex-direction:column;gap:4px;margin-bottom:var(--spacing-sm)}.ingredient-edit-fields .form-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);font-family:var(--font-family);margin-top:var(--spacing-md);margin-bottom:var(--spacing-xs)}.fdc-id-display{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm)}.fdc-id-display .detail-label{font-weight:500;color:var(--color-text-muted)}.fdc-id-display .detail-value{font-weight:600;color:var(--color-text);font-family:monospace}.calories-display{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm)}.calories-display .detail-label{font-weight:500;color:var(--color-text-muted)}.calories-display .detail-value{font-weight:600;color:var(--color-text)}.ingredient-actions{display:flex;gap:var(--spacing-sm)}.ingredient-actions button{padding:var(--spacing-sm) var(--spacing-md);min-width:40px;height:36px}.ingredient-edit-form{display:flex;gap:var(--spacing-md);align-items:flex-end;width:100%}.ingredient-name-edit,.ingredient-subname-edit{flex:1}.fdc-id-edit{width:120px}.ingredient-edit-actions{display:flex;gap:var(--spacing-sm)}.ingredient-edit-actions button{padding:var(--spacing-sm) var(--spacing-md);min-width:40px;height:36px}.edit-btn{background-color:var(--color-primary);color:var(--color-text-inverse)}.edit-btn:hover{background-color:var(--color-hover)}.delete-btn{color:var(--color-error);border-color:var(--color-error)}.delete-btn:hover,.group-actions .delete-btn:hover,.ingredient-actions .delete-btn:hover{background-color:var(--color-error)!important;color:var(--color-text-inverse)!important;transform:translateY(-1px)!important;box-shadow:0 4px 8px #dc26264d!important}.empty-state{grid-column:1 / -1;text-align:center;padding:var(--spacing-2xl);color:var(--color-text-muted)}.empty-state h3{font-size:var(--font-size-lg);font-weight:600;margin:var(--spacing-md) 0 var(--spacing-sm) 0;color:var(--color-text)}.empty-state p{font-size:var(--font-size-base);margin:0}@media (max-width: 768px){.groups-container{-moz-column-count:1;column-count:1}.ingredient-content{flex-direction:column;align-items:flex-start;gap:var(--spacing-sm)}.ingredient-info{width:100%}.fdc-id{align-self:flex-start}.ingredient-actions{align-self:flex-end;margin-top:var(--spacing-sm)}}