:root{color-scheme:light;--color-background: #fff8f5;--color-surface-container-lowest: #ffffff;--color-surface-container-low: #fef1eb;--color-surface-container: #f9ebe5;--color-surface-container-high: #f3e6e0;--color-surface-container-highest: #ede0da;--color-on-surface: #211a17;--color-on-surface-variant: #57423c;--color-outline: #8b716b;--color-outline-variant: #dec0b8;--color-primary: #a2391a;--color-on-primary: #ffffff;--color-primary-container: #ffdbd1;--color-on-primary-container: #842505;--color-secondary: #4f6448;--color-on-secondary: #ffffff;--color-secondary-container: #cfe7c3;--color-on-secondary-container: #384c32;--color-error: #ba1a1a;--color-on-error: #ffffff;--color-error-container: #ffdad6;--color-on-error-container: #93000a;--font-serif: "Newsreader", Georgia, serif;--font-sans: "Be Vietnam Pro", system-ui, sans-serif;--radius-sm: .5rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 32px;--space-xl: 48px;--shadow-sm: 0 1px 3px rgba(88, 55, 40, .12);--shadow-card: 0 4px 20px -2px rgba(165, 60, 28, .12);font-family:var(--font-sans)}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden;overscroll-behavior:none}body{background:var(--color-background);color:var(--color-on-surface);font-family:var(--font-sans);line-height:1.5;-webkit-tap-highlight-color:transparent}#app{max-width:720px;margin:0 auto;height:100vh;height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch}#app-shell{height:100%;display:flex;flex-direction:column}h1,h2,h3{font-family:var(--font-serif);color:var(--color-on-surface);font-weight:600;line-height:1.25;margin:0 0 var(--space-md)}h1{font-size:2rem}h2{font-size:1.375rem;margin-top:var(--space-lg)}h3{font-size:1.125rem}p{margin:0 0 var(--space-sm)}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}.topbar{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:calc(var(--space-md) + env(safe-area-inset-top)) var(--space-md) var(--space-sm);background:var(--color-surface-container-low);border-bottom:1px solid var(--color-outline-variant)}.topbar .brand{font-family:var(--font-serif);font-style:italic;font-size:1.25rem;font-weight:600;color:var(--color-primary);white-space:nowrap}.topbar .brand:hover{text-decoration:none}.topbar-actions{display:flex;align-items:center;gap:var(--space-sm)}.nav-user{font-size:.875rem;color:var(--color-on-surface-variant);white-space:nowrap}#content{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:var(--space-md)}.bottom-nav{flex-shrink:0;display:flex;background:var(--color-surface-container-low);border-top:1px solid var(--color-outline-variant);padding:var(--space-xs) var(--space-xs) calc(var(--space-xs) + env(safe-area-inset-bottom))}.bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:none;border:none;padding:var(--space-sm) var(--space-xs);border-radius:var(--radius-md);color:var(--color-on-surface-variant);box-shadow:none}.bottom-nav button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.bottom-nav button span{font-size:.7rem;font-weight:600;letter-spacing:.01em}.bottom-nav button.active{color:var(--color-primary);background:var(--color-primary-container)}.menu-toggle{display:flex;align-items:center;justify-content:center;padding:.35rem;background:transparent;color:var(--color-on-surface);box-shadow:none}.menu-toggle svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.menu-toggle:hover{color:var(--color-primary)}.menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#211a1766;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:40}.menu-overlay.open{opacity:1;pointer-events:auto}.menu-panel{position:fixed;top:0;right:0;bottom:0;width:min(280px,80vw);background:var(--color-surface-container-lowest);border-left:1px solid var(--color-outline-variant);padding:calc(var(--space-md) + env(safe-area-inset-top)) var(--space-md) calc(var(--space-md) + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:var(--space-xs);transform:translate(100%);transition:transform .2s ease;z-index:50}.menu-panel.open{transform:translate(0)}.menu-item{display:flex;align-items:center;gap:var(--space-sm);width:100%;text-align:left;background:none;box-shadow:none;color:var(--color-on-surface);padding:var(--space-sm);border-radius:var(--radius-md)}.menu-item svg{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.menu-item:hover{background:var(--color-surface-container-high)}.menu-item:disabled{color:var(--color-outline);cursor:default}.menu-item:disabled:hover{background:none}.menu-item-badge{margin-left:auto;font-size:.7rem;font-weight:600;color:var(--color-outline);background:var(--color-surface-container-high);padding:.1rem .5rem;border-radius:var(--radius-full)}.menu-item-danger{color:var(--color-error)}.photo-upload{display:flex;flex-direction:column;gap:var(--space-sm);margin-bottom:var(--space-md)}.photo-upload-actions{display:flex;gap:var(--space-sm)}.photo-upload-label{display:inline-flex;align-items:center;cursor:pointer}.crop-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#211a178c;display:flex;align-items:center;justify-content:center;padding:var(--space-md);z-index:100}.crop-dialog{background:var(--color-surface-container-lowest);border-radius:var(--radius-lg);padding:var(--space-md);display:flex;flex-direction:column;align-items:center;gap:var(--space-md);max-width:100%}.crop-dialog h2{margin:0;align-self:flex-start}.crop-frame{position:relative;overflow:hidden;border-radius:var(--radius-md);background:var(--color-surface-container-high);touch-action:none;cursor:grab}.crop-image{position:absolute;top:0;left:0;max-width:none;-webkit-user-select:none;user-select:none;pointer-events:none}.crop-zoom{width:100%}button{font-family:var(--font-sans);font-size:.9rem;font-weight:600;border-radius:var(--radius-sm);border:none;padding:.65rem 1.25rem;cursor:pointer;background:var(--color-surface-container-high);color:var(--color-on-surface);transition:filter .15s ease,transform .1s ease,box-shadow .15s ease}button:active{transform:scale(.97)}button[type=submit],.btn-primary{background:var(--color-primary);color:var(--color-on-primary);box-shadow:var(--shadow-sm)}button[type=submit]:hover,.btn-primary:hover{filter:brightness(1.08)}.btn-secondary{background:var(--color-surface-container-high);color:var(--color-on-surface);border:1px solid var(--color-outline-variant)}.btn-danger{background:var(--color-error-container);color:var(--color-on-error-container)}.btn-sm{padding:.4rem .85rem;font-size:.8rem}.btn-icon{padding:.35rem .55rem;background:transparent;color:var(--color-outline)}.btn-icon:hover{color:var(--color-error)}.btn-link{background:transparent;color:var(--color-primary);padding:.25rem 0;font-weight:500}.btn-link:hover{text-decoration:underline}.login-view{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;align-items:center;justify-content:center;padding:var(--space-lg) var(--space-md)}.login-box{width:100%;max-width:360px}.login-box h1{text-align:center}.tabs{display:flex;gap:var(--space-sm);margin-bottom:var(--space-md);border-bottom:1px solid var(--color-outline-variant)}.tabs button{background:transparent;border-radius:0;padding:var(--space-sm) var(--space-sm);color:var(--color-on-surface-variant);border-bottom:2px solid transparent}.tabs button.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-md);gap:var(--space-md)}.toolbar h1{margin:0}.toolbar-actions{display:flex;align-items:center;gap:var(--space-sm)}.btn-icon-inline{display:flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0}.btn-icon-inline svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}form label{display:block;margin-bottom:var(--space-md);font-size:.875rem;font-weight:600;color:var(--color-on-surface-variant)}form input,form select,form textarea{display:block;width:100%;box-sizing:border-box;margin-top:var(--space-xs);padding:.65rem .85rem;font-family:var(--font-sans);font-size:.95rem;font-weight:400;color:var(--color-on-surface);background:var(--color-surface-container-low);border:1px solid var(--color-outline-variant);border-radius:var(--radius-sm)}form input:focus,form select:focus,form textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #a2391a26}form textarea{resize:vertical;min-height:4rem;font-family:var(--font-sans)}.hint{font-size:.8rem;color:var(--color-on-surface-variant);font-style:italic;margin-top:calc(var(--space-sm) * -1)}.hint code{background:var(--color-surface-container-high);border-radius:var(--radius-sm);padding:0 .3rem}.ingredient-row{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:var(--space-sm);margin-bottom:var(--space-sm);align-items:center}.ingredient-row input{margin-top:0}.ingredient-name-field{position:relative}.ingredient-suggestions{position:absolute;top:100%;left:0;right:0;z-index:20;margin:2px 0 0;padding:4px;list-style:none;background:var(--color-surface-container-lowest);border:1px solid var(--color-outline-variant);border-radius:var(--radius-md);box-shadow:var(--shadow-card);max-height:220px;overflow-y:auto}.ingredient-suggestions li{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);padding:.5rem .6rem;border-radius:var(--radius-sm);font-size:.9rem;cursor:pointer}.ingredient-suggestions li:hover{background:var(--color-surface-container-high)}.ingredient-suggestions li[data-suggest]{color:var(--color-primary);font-style:italic}.ingredient-suggestions li.suggestion-feedback{color:var(--color-on-surface-variant);font-style:italic;cursor:default}.ingredient-suggestions li.suggestion-feedback:hover{background:none}.ingredient-suggestions .unit-hint{color:var(--color-on-surface-variant);font-size:.8rem;flex-shrink:0}.cook-mode{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;background:var(--color-surface-container-lowest);display:flex;flex-direction:column}.cook-mode-exit{position:absolute;top:calc(var(--space-md) + env(safe-area-inset-top));right:var(--space-md);z-index:2;width:40px;height:40px;padding:0;border-radius:var(--radius-full);background:var(--color-surface-container-high);box-shadow:var(--shadow-sm)}.cook-mode-dots{display:flex;justify-content:center;align-items:center;gap:var(--space-sm);padding:calc(var(--space-md) + env(safe-area-inset-top)) 0 var(--space-sm);flex-shrink:0}.cook-mode-dots .dot{width:8px;height:8px;padding:0;border-radius:var(--radius-full);background:var(--color-outline-variant);box-shadow:none}.cook-mode-dots .dot.active{background:var(--color-primary)}.cook-mode-track{flex:1;min-height:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.cook-panel{flex:0 0 100%;width:100%;scroll-snap-align:start;overflow-y:auto;-webkit-overflow-scrolling:touch;box-sizing:border-box;padding:var(--space-md) var(--space-lg) calc(var(--space-lg) + env(safe-area-inset-bottom))}.cook-photo{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover;border-radius:var(--radius-xl);margin-bottom:var(--space-md)}.cook-meta{color:var(--color-on-surface-variant)}.cook-checklist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-xs)}.cook-checklist label{display:flex;align-items:flex-start;gap:var(--space-sm);padding:var(--space-sm) 0;cursor:pointer}.cook-checklist input[type=checkbox]{width:24px;height:24px;flex-shrink:0;margin-top:2px;accent-color:var(--color-primary)}.cook-checklist input[type=checkbox]:checked+span{text-decoration:line-through;color:var(--color-on-surface-variant)}.cook-steps{font-size:1.2rem;line-height:1.7}.cook-steps li{list-style:decimal;margin-left:1.5rem;padding-left:var(--space-xs)}.shopping-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-xs)}.shopping-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-container-low);border:1px solid var(--color-outline-variant);border-radius:var(--radius-md)}.shopping-item-label{display:flex;align-items:center;gap:var(--space-sm);flex:1;min-width:0;cursor:pointer}.shopping-item-label input[type=checkbox]{width:20px;height:20px;flex-shrink:0;accent-color:var(--color-primary)}.shopping-item-text{display:flex;gap:.4rem;min-width:0;flex-wrap:wrap}.shopping-item-text .amount,.shopping-item-text .unit{color:var(--color-on-surface-variant);flex-shrink:0}.shopping-item.checked .shopping-item-text{text-decoration:line-through;color:var(--color-on-surface-variant)}.recipe-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-sm)}.recipe-card{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--color-surface-container-low);border:1px solid var(--color-outline-variant);border-radius:var(--radius-lg);cursor:pointer;box-shadow:var(--shadow-sm);transition:box-shadow .15s ease,transform .15s ease}.recipe-card:hover{box-shadow:var(--shadow-card);transform:translateY(-1px)}.recipe-thumb{width:64px;height:64px;flex-shrink:0;object-fit:cover;border-radius:var(--radius-md);background:var(--color-surface-container-high)}.recipe-card-body{flex:1;min-width:0}.recipe-card strong{font-family:var(--font-serif);font-size:1.1rem;font-weight:600;color:var(--color-on-surface)}.recipe-card .meta{margin-top:var(--space-xs)}.recipe-hero{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover;border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);margin-bottom:var(--space-md)}.recipe-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-md)}.recipe-title-row h1{margin-bottom:var(--space-sm)}.recipe-icon-actions{display:flex;gap:var(--space-xs);flex-shrink:0;padding-top:var(--space-xs)}.icon-action{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border-radius:var(--radius-full);background:var(--color-surface-container-high);color:var(--color-on-surface-variant);box-shadow:none}.icon-action:hover:not(:disabled){background:var(--color-primary-container);color:var(--color-on-primary-container)}.icon-action svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon-action:disabled{opacity:.45;cursor:default}.badge{display:inline-block;font-size:.7rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;background:var(--color-secondary-container);color:var(--color-on-secondary-container);border-radius:var(--radius-full);padding:.15rem .6rem;vertical-align:middle}.category{display:inline-block;font-size:.8rem;font-weight:600;color:var(--color-primary);text-transform:uppercase;letter-spacing:.02em;margin-bottom:var(--space-sm)}.tags{font-size:.85rem;color:var(--color-on-surface-variant)}.meta{color:var(--color-on-surface-variant);font-size:.9rem}.category-icon{display:inline-flex;align-items:center;gap:.3rem}.category-icon svg{width:16px;height:16px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.infobox{background:var(--color-primary-container);border-left:3px solid var(--color-primary);color:var(--color-on-primary-container);padding:var(--space-sm) var(--space-md);margin:var(--space-md) 0;border-radius:0 var(--radius-md) var(--radius-md) 0;font-size:.9rem}.message{background:var(--color-surface-container-high);color:var(--color-on-surface-variant);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);margin-bottom:var(--space-md);font-size:.9rem}.ingredients{list-style:none;padding:0;margin:0 0 var(--space-md)}.ingredients li{display:grid;grid-template-columns:3.5rem 4.5rem 1fr;gap:var(--space-md);align-items:baseline;padding:var(--space-sm) 0;border-bottom:1px solid var(--color-outline-variant);font-size:.95rem}.ingredients li:last-child{border-bottom:none}.ingredients .amount{text-align:right;font-weight:600;color:var(--color-on-surface)}.ingredients .unit{color:var(--color-on-surface-variant)}.ingredients .name{color:var(--color-on-surface)}.ingredients-header{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.02em;color:var(--color-on-surface-variant)}.ingredients-header .amount,.ingredients-header .unit,.ingredients-header .name{color:inherit;font-weight:inherit}#content ol{padding-left:1.4rem;margin:0 0 var(--space-md)}#content ol li{margin-bottom:var(--space-sm);line-height:1.6}.actions{display:flex;gap:var(--space-sm);margin-top:var(--space-lg);flex-wrap:wrap}.admin-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-sm)}.admin-list li{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:var(--space-md);background:var(--color-surface-container-low);border:1px solid var(--color-outline-variant);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.actions-inline{display:flex;gap:var(--space-sm);flex-shrink:0}.suggestion-name-input{flex:1;min-width:0;margin:0;padding:.5rem .7rem;font-family:var(--font-sans);font-size:.9rem;color:var(--color-on-surface);background:var(--color-surface-container-lowest);border:1px solid var(--color-outline-variant);border-radius:var(--radius-sm)}.suggestion-name-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #a2391a26}@media print{.topbar,.bottom-nav,.menu-overlay,.menu-panel,#back,.recipe-icon-actions{display:none!important}html,body{height:auto;overflow:visible}#app,#app-shell{height:auto;display:block}#content{overflow:visible;padding:0}.recipe-hero{box-shadow:none}.ingredients li,.infobox,ol>li{break-inside:avoid}@page{size:A4;margin:2cm}}