@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@500;600;700;800&family=Roboto+Mono:wght@400;500&display=swap";
:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-primary:#ff5722;--color-primary-hover:#e64a19;--color-secondary:#4caf50;--color-bg:#fff;--color-bg-secondary:#eee;--color-bg-hover:#e8eaed;--color-surface:#fff;--color-surface-hover:#f1f3f4;--color-surface-alt:#fff9f2;--color-button-neutral-bg:#e3e5e7;--color-text-primary:#1a1a1a;--color-text-secondary:#616161;--color-border:#ddd;--color-success:#2e7d32;--color-error:#d32f2f;--color-warning:#ffa000;--color-warning-surface:#f59e0b1f;--color-warning-border:#f59e0b59;--color-warning-text:#d97706;--color-warning-solid:#da5f47;--color-image-placeholder:#eee;--color-surface-tint:#0000000d;--color-glass-bg:#fffffff5;--color-glass-border:#fff9;--color-info-surface:#6366f11f;--color-info-border:#6366f159;--color-info-text:#6366f1;--color-on-accent:#fff;--color-on-warning:#1a1a1a;--color-text-heading:#1a1a1a;--color-gradient-warm-end:#ff8a65;--color-shimmer-base:#eee;--color-shimmer-highlight:#ddd;--color-surface-raised:#fff;--color-primary-rgb:255, 87, 34;--color-success-rgb:46, 125, 50;--color-error-rgb:211, 47, 47;--color-background:var(--color-bg);--color-badge:var(--color-bg-secondary);--color-surface-warm:var(--color-surface-alt);--scrim-subtle:#00000040;--scrim-backdrop:#0006;--scrim-strong:#00000061;--scrim-control:#0000004d;--scrim-heavy:#000000bf;--scrim-immersive:#000000eb}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-primary:#ff8a65;--color-primary-hover:#ff7043;--color-secondary:#81c784;--color-bg:#121212;--color-bg-secondary:#2d2d2d;--color-bg-hover:#323232;--color-surface:#1e1e1e;--color-surface-hover:#242424;--color-surface-alt:#1a1816;--color-button-neutral-bg:#3a3a3a;--color-text-primary:#e0e0e0;--color-text-secondary:#a0a0a0;--color-border:#333;--color-success:#81c784;--color-error:#e57373;--color-warning:#ffb74d;--color-warning-surface:#f59e0b1f;--color-warning-border:#f59e0b59;--color-warning-text:#d97706;--color-warning-solid:#da5f47;--color-image-placeholder:#2d2d2d;--color-surface-tint:#ffffff12;--color-glass-bg:#121212f5;--color-glass-border:#ffffff14;--color-info-surface:#6366f11f;--color-info-border:#6366f159;--color-info-text:#6366f1;--color-on-accent:#fff;--color-on-warning:#1a1a1a;--color-text-heading:#fff;--color-gradient-warm-end:#ffb300;--color-shimmer-base:#242424;--color-shimmer-highlight:#323232;--color-surface-raised:#3a3a3c;--color-primary-rgb:255, 138, 101;--color-success-rgb:129, 199, 132;--color-error-rgb:229, 115, 115;--color-background:var(--color-bg);--color-badge:var(--color-bg-secondary);--color-surface-warm:var(--color-surface-alt);--scrim-subtle:#00000040;--scrim-backdrop:#0006;--scrim-strong:#00000061;--scrim-control:#0000004d;--scrim-heavy:#000000bf;--scrim-immersive:#000000eb}
@keyframes spin{to{transform:rotate(360deg)}}:root{--glass-bg:var(--color-glass-bg);--glass-border:var(--color-glass-border);--glass-blur:blur(20px) saturate(180%);--nav-height:72px;--topbar-height:64px;--topbar-offset:0px;--page-max-width:1100px;--page-max-width-narrow:720px;--page-px:1.5rem;--page-px-mobile:1rem;--page-pt:calc(env(safe-area-inset-top,0px) + 2rem);--page-pt-mobile:calc(env(safe-area-inset-top,0px) + 1.5rem);--page-pb-nav:calc(var(--nav-height) + 2rem);--page-header-py:.75rem;--space-2:.125rem;--space-4:.25rem;--space-6:.375rem;--space-8:.5rem;--space-10:.625rem;--space-12:.75rem;--space-14:.875rem;--space-16:1rem;--space-20:1.25rem;--space-24:1.5rem;--space-32:2rem;--space-40:2.5rem;--space-48:3rem;--font-main:"Inter", -apple-system, sans-serif;--font-heading:"Outfit", "Inter", sans-serif;--font-mono:"Roboto Mono", monospace;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:2rem;--text-4xl:1.75rem;--text-5xl:2.25rem;--text-hero:2.625rem;--leading-none:1;--leading-tight:1.15;--leading-snug:1.3;--leading-normal:1.5;--leading-relaxed:1.65;--tracking-tight:-.02em;--tracking-snug:-.01em;--tracking-normal:0;--tracking-wide:.02em;--tracking-wider:.05em;--z-base:0;--z-card-fab:10;--z-dropdown:40;--z-bottom-nav:50;--z-header:100;--z-topbar:110;--z-modal:1000;--z-toast:2000;--touch-target:2.75rem;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--shadow-sm:0 4px 12px #0000001a;--shadow-md:0 12px 32px #0000001f;--transition-fast:.15s ease-in-out}[data-theme=dark]{--shadow-sm:0 4px 12px #0000004d;--shadow-md:0 18px 48px #00000073}*{box-sizing:border-box;margin:0;padding:0}html,body{max-width:100%;font-family:var(--font-main);background-color:var(--color-bg);color:var(--color-text-primary);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased;overflow-x:hidden}html{overscroll-behavior-y:none;scrollbar-gutter:stable}*{-webkit-tap-highlight-color:transparent}button,a,label,summary{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}a{color:var(--color-primary);transition:color var(--transition-fast);text-decoration:none}@media (hover:hover) and (pointer:fine){a:hover{color:var(--color-primary-hover)}}button,input,select,textarea{font:inherit;line-height:normal}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}button,.button,[role=button]{transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s cubic-bezier(.16,1,.3,1),background .2s}button:active,.button:active,[role=button]:active{opacity:1;transition:transform .2s,box-shadow .2s,background .2s;transition-delay:.15s!important;transform:scale(.96)translateY(2px)!important}.button{min-height:48px;padding:var(--space-8) var(--space-24);font-weight:500;font-size:var(--text-base);cursor:pointer;transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast), opacity var(--transition-fast), filter var(--transition-fast), transform var(--transition-fast);border:1px solid #0000;border-radius:9999px;justify-content:center;align-items:center;display:inline-flex}.button-sm{min-height:36px;padding:var(--space-4) var(--space-16);font-size:var(--text-sm)}.button-pill{border-radius:9999px}.button:disabled{opacity:.6;cursor:not-allowed}.button-primary{background-color:var(--color-primary);color:var(--color-on-accent);box-shadow:var(--shadow-sm)}@media (hover:hover) and (pointer:fine){.button-primary:hover{background-color:var(--color-primary-hover)}}.button-primary:active:not(:disabled){background-color:var(--color-primary-hover);transition-delay:.15s;box-shadow:0 2px 5px #0003!important}.button-primary:disabled{opacity:.6;cursor:not-allowed}.button-success{background-color:var(--color-success);color:var(--color-on-accent)}@media (hover:hover) and (pointer:fine){.button-success:hover{filter:brightness(.95)}}.button-success:active:not(:disabled){filter:brightness(.9)}.button-outline{color:var(--color-text-secondary);border:2px solid var(--color-border);background-color:#0000}@media (hover:hover) and (pointer:fine){.button-outline:hover{background-color:var(--color-surface-hover);color:var(--color-text-primary);border-color:var(--color-text-secondary)}}.button-outline:active{background-color:var(--color-surface-hover);transition-delay:.15s}.button-outline-destructive{color:var(--color-error);background-color:#0000;border:none}@media (hover:hover) and (pointer:fine){.button-outline-destructive:hover{background-color:var(--color-surface-hover);color:var(--color-error)}}.button-outline-destructive:active{background-color:var(--color-surface-hover);transition-delay:.15s}.button-neutral{background-color:var(--color-button-neutral-bg);color:var(--color-text-primary);border-radius:var(--radius-md);border-color:#0000}@media (hover:hover) and (pointer:fine){.button-neutral:hover{background-color:var(--color-border)}}.button-neutral:active{background-color:var(--color-border);transition-delay:.15s}.button-dashed{gap:var(--space-8);border:2px dashed var(--color-border);color:var(--color-text-secondary);background:0 0;width:fit-content}@media (hover:hover) and (pointer:fine){.button-dashed:hover{background:rgba(var(--color-primary-rgb), .05);border-color:var(--color-primary);color:var(--color-primary)}}.button-dashed:active{background:rgba(var(--color-primary-rgb), .1);transition-delay:.15s}.btn-content,.btn-loading-content{justify-content:center;align-items:center;display:flex}.btn-stack{display:grid}.btn-stack>*{grid-area:1/1}.btn-content-loading{opacity:0}.dots-loading{align-items:center;gap:calc(var(--dot-size,5px) * .8);display:inline-flex}.dots-loading span{width:var(--dot-size,5px);height:var(--dot-size,5px);background:currentColor;border-radius:50%;animation:.64s ease-in-out infinite dot-pulse}.dots-loading span:nth-child(2){animation-delay:.16s}.dots-loading span:nth-child(3){animation-delay:.32s}@keyframes dot-pulse{0%,to{opacity:.35;transform:scale(.7)}50%{opacity:1;transform:scale(1)}}.input{width:100%;padding:var(--space-12) var(--space-16);border-radius:var(--radius-md);background-color:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-primary);font-family:inherit;font-size:var(--text-base);transition:border-color var(--transition-fast)}.input:focus{border-color:var(--color-primary);outline:none}.input option{background-color:var(--color-surface);color:var(--color-text-primary)}.input::placeholder{color:var(--color-text-secondary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.4s cubic-bezier(.16,1,.3,1) forwards fadeIn}.text-gradient{background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-gradient-warm-end) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.header-greeting{font-family:var(--font-heading);font-size:var(--text-5xl);letter-spacing:var(--tracking-tight);color:var(--color-text-primary);align-items:center;gap:var(--space-6);font-weight:500;display:flex}.header-name{font-weight:800}@container content (max-width:640px){.header-greeting{font-size:var(--text-4xl);flex-wrap:wrap}}.field-group{flex-direction:column;width:100%;display:flex}.field-label{margin-bottom:var(--space-4);font-size:var(--text-base);color:var(--color-text-primary);font-weight:600;display:block}.modal-overlay{background:var(--scrim-backdrop);-webkit-backdrop-filter:blur(12px)saturate(150%);z-index:9999;padding:var(--space-16);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}[data-theme=dark] .modal-overlay{background:var(--scrim-strong)}.modal-box{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);width:90%;max-width:420px;max-height:90vh;box-shadow:var(--shadow-md);flex-direction:column;display:flex;position:relative;overflow:hidden}.modal-box-wide{max-width:640px}.modal-box:focus-visible{outline:none}.modal-header{padding:var(--space-24) 72px var(--space-20) var(--space-24);align-items:center;gap:var(--space-10);display:flex}.modal-header h2,.modal-header h3{font-size:var(--text-xl);font-weight:600;font-family:var(--font-heading);color:var(--color-text-primary);margin:0}.modal-header-icon{color:var(--color-primary);flex-shrink:0}.modal-body{padding:0 var(--space-24);gap:var(--space-24);flex-direction:column;flex:1;display:flex;overflow-y:auto}.modal-body:last-child{padding-bottom:var(--space-24)}.modal-footer{padding:var(--space-20) var(--space-24) var(--space-24);gap:var(--space-12);flex-direction:column;display:flex}.modal-footer-row{justify-content:flex-end;gap:var(--space-16);flex-direction:row}.modal-footer-row .button,.modal-footer-row button{flex:1}@media (min-width:480px){.modal-footer-row .button,.modal-footer-row button{flex:0 auto;min-width:100px}}.modal-field-group{gap:var(--space-8);flex-direction:column;display:flex}.modal-label{font-size:var(--text-base);color:var(--color-text-primary);font-weight:600;font-family:var(--font-main)}.modal-save-btn{width:100%}.char-limit-hint{font-size:var(--text-xs);color:var(--color-primary);margin-top:var(--space-2)}.field-error-hint{font-size:var(--text-xs);color:var(--color-error);margin-top:var(--space-4)}.modal-separator{border:none;border-top:1px solid var(--color-border);margin:var(--space-4) 0}.modal-info-section{margin-top:var(--space-8);padding-top:var(--space-16);border-top:1px solid var(--color-border);gap:var(--space-12);flex-direction:column;display:flex}.modal-info-row{font-size:var(--text-sm);color:var(--color-text-secondary);justify-content:space-between;align-items:center;display:flex}.modal-info-label{align-items:center;gap:var(--space-6);display:flex}@media (max-width:640px){.modal-overlay{align-items:flex-end;padding:0}.modal-box{width:100%;max-width:100%;padding-bottom:env(safe-area-inset-bottom);border-radius:20px 20px 0 0;margin:0;animation:.35s cubic-bezier(.16,1,.3,1) forwards sheetSlideUp;transform:translateY(100%)}.modal-box:before{content:"";width:40px;height:4px;margin:var(--space-10) auto 0;background-color:#96969666;border-radius:2px;display:block}.modal-header{padding-top:var(--space-16)}}@keyframes sheetSlideUp{0%{opacity:.5;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.page-wrapper{max-width:var(--page-max-width);padding-left:var(--page-px);padding-right:var(--page-px);margin:0 auto;container:layout/inline-size}.page-header-inner{max-width:var(--page-max-width);padding:var(--page-header-py) var(--page-px);margin:0 auto}.page-main{max-width:var(--page-max-width);padding:var(--page-pt) var(--page-px) var(--page-pb-nav);margin:0 auto;container:content/inline-size}.page-centered{max-width:var(--page-max-width);padding:var(--page-pt) var(--page-px) var(--page-pb-nav);flex-direction:column;justify-content:center;align-items:center;min-height:100dvh;margin:0 auto;display:flex}@media (max-width:640px){.page-wrapper{padding-left:var(--page-px-mobile);padding-right:var(--page-px-mobile)}.page-header-inner{padding:var(--page-header-py) var(--page-px-mobile)}.page-main,.page-centered{padding:var(--page-pt-mobile) var(--page-px-mobile) var(--page-pb-nav)}}.page-narrow{--page-max-width:var(--page-max-width-narrow)}.page-title{font-family:var(--font-heading);font-size:var(--text-3xl);color:var(--color-text-primary);margin:0;font-weight:600}@media (min-width:1024px){:root{--topbar-offset:var(--topbar-height)}}.modal-close-btn{z-index:10;position:absolute;top:16px;right:16px}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.skeleton-shimmer{background:linear-gradient(to right, var(--color-shimmer-base) 4%, var(--color-shimmer-highlight) 25%, var(--color-shimmer-base) 36%);background-size:1000px 100%;animation:2s linear infinite shimmer}.recipe-grid{column-gap:var(--space-24);row-gap:var(--space-32);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}@media (max-width:640px){.recipe-grid{row-gap:var(--space-24)}}@media (pointer:coarse){:where(.button-sm){position:relative}.button-sm:after{content:"";inset:calc((36px - var(--touch-target)) / 2) 0;position:absolute}.input{min-height:var(--touch-target)}}@media print{[data-noprint]{display:none!important}}