:root{--mauve-bark: #664e4c;--willow-green: #c1d37f;--light-gold: #e2d58b;--vanilla-custard: #f0e2a3;--peach-fuzz: #f9d4bb;--mauve-bark-dark: #4d3b39;--willow-green-dark: #a7ba5f;--surface: #fffaf2;--text: #3a2c2b;--text-muted: #7a6663;--danger: #c1543b;--danger-dark: #a3432d;--radius: 14px;--radius-sm: 9px;--shadow: 0 8px 24px rgba(102, 78, 76, .14);--shadow-sm: 0 3px 10px rgba(102, 78, 76, .12);font-family:Segoe UI,system-ui,-apple-system,sans-serif;color:var(--text)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh}body{background:linear-gradient(160deg,var(--peach-fuzz) 0%,var(--vanilla-custard) 100%);background-attachment:fixed}a{color:var(--mauve-bark);text-decoration:none}h1,h2,h3{color:var(--mauve-bark);margin:0 0 .5em}button{font-family:inherit}.app-shell{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.container{width:100%;max-width:960px;margin:0 auto;padding:24px 20px calc(48px + env(safe-area-inset-bottom))}.header{background:var(--mauve-bark);color:var(--peach-fuzz);box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:20}.header-inner{max-width:960px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;gap:16px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.15rem;color:var(--peach-fuzz);white-space:nowrap}.brand img{width:30px;height:30px;flex-shrink:0}.nav{margin-left:auto;display:flex;align-items:center;gap:4px}.nav a,.nav button{color:var(--peach-fuzz);background:transparent;border:none;padding:8px 14px;border-radius:var(--radius-sm);font-size:.95rem;cursor:pointer;transition:background .15s ease}.nav a:hover,.nav button:hover{background:#f9d4bb2e}.nav a.active{background:var(--willow-green);color:var(--mauve-bark-dark);font-weight:600}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:var(--radius-sm);padding:11px 20px;min-height:44px;font-size:.98rem;font-weight:600;cursor:pointer;transition:transform .08s ease,filter .15s ease,background .15s ease;text-decoration:none;-webkit-tap-highlight-color:transparent}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--mauve-bark);color:var(--peach-fuzz)}.btn-primary:hover:not(:disabled){filter:brightness(1.12)}.btn-accent{background:var(--willow-green);color:var(--mauve-bark-dark)}.btn-accent:hover:not(:disabled){background:var(--willow-green-dark)}.btn-ghost{background:transparent;color:var(--mauve-bark);border:1.5px solid var(--mauve-bark)}.btn-ghost:hover:not(:disabled){background:#664e4c14}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){background:var(--danger-dark)}.btn-sm{padding:7px 13px;min-height:38px;font-size:.85rem}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}.panel{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:20px}.hero{text-align:center;padding:64px 20px 40px}.hero h1{font-size:clamp(2.2rem,6vw,3.4rem);line-height:1.1}.hero p{font-size:1.15rem;color:var(--text-muted);max-width:560px;margin:16px auto 28px}.hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}.hero-badge{display:inline-block;background:var(--willow-green);color:var(--mauve-bark-dark);padding:6px 16px;border-radius:999px;font-weight:600;font-size:.85rem;margin-bottom:18px}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:40px}.feature{background:var(--surface);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm)}.feature .emoji{font-size:1.8rem}.feature h3{margin:10px 0 6px}.feature p{margin:0;color:var(--text-muted);font-size:.95rem}.form-group{margin-bottom:16px}.form-group label{display:block;font-weight:600;margin-bottom:6px;color:var(--mauve-bark);font-size:.92rem}.input,textarea.input{width:100%;padding:11px 13px;border:1.5px solid #e2d3c8;border-radius:var(--radius-sm);font-size:1rem;background:#fffdf9;font-family:inherit;color:var(--text)}.input:focus,textarea.input:focus{outline:none;border-color:var(--willow-green-dark);box-shadow:0 0 0 3px #c1d37f59}textarea.input{resize:vertical;min-height:80px}.auth-wrap{max-width:420px;margin:48px auto}.alert{padding:12px 15px;border-radius:var(--radius-sm);margin-bottom:16px;font-size:.93rem}.alert-error{background:#fbe4de;color:var(--danger-dark);border:1px solid #f0b8ab}.alert-info{background:var(--vanilla-custard);color:var(--mauve-bark-dark);border:1px solid var(--light-gold)}.page-head{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:24px}.page-head h1{margin:0}.spacer{flex:1}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}.recipe-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}.recipe-grid.recipe-list{display:flex;flex-direction:column;gap:12px}.recipe-list .recipe-card{display:grid;grid-template-columns:1fr auto;grid-template-areas:"title actions" "meta actions" "desc actions";align-items:center;gap:6px 18px;border-top:none;border-left:5px solid var(--willow-green)}.recipe-list .recipe-card:hover{transform:none;box-shadow:var(--shadow)}.recipe-list .recipe-card h3{grid-area:title}.recipe-list .recipe-card .meta{grid-area:meta}.recipe-list .recipe-card .desc{grid-area:desc;-webkit-line-clamp:2}.recipe-list .card-actions{grid-area:actions;margin-top:0;flex-direction:column}.recipe-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:18px;display:flex;flex-direction:column;gap:10px;transition:transform .12s ease,box-shadow .12s ease;border-top:5px solid var(--willow-green)}.recipe-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.recipe-card h3{margin:0;font-size:1.1rem}.recipe-card .meta{color:var(--text-muted);font-size:.85rem;display:flex;gap:12px;flex-wrap:wrap}.recipe-card .desc{color:var(--text-muted);font-size:.9rem;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.card-actions{display:flex;gap:8px;margin-top:auto}.search-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}.search-input{flex:1 1 220px;display:flex;align-items:center;gap:8px;background:var(--surface);border:1.5px solid var(--light-gold);border-radius:var(--radius-sm);padding:0 12px;min-height:44px}.search-input input{border:none;outline:none;background:transparent;flex:1;font-size:1rem;color:var(--mauve-bark);min-width:0}.select{min-height:44px;padding:0 12px;border-radius:var(--radius-sm);border:1.5px solid var(--light-gold);background:var(--surface);color:var(--mauve-bark);font-size:.95rem}.btn-filter-active{background:var(--willow-green);color:var(--mauve-bark-dark);border-color:var(--willow-green-dark)}.view-toggle{display:flex;border:1.5px solid var(--light-gold);border-radius:var(--radius-sm);overflow:hidden}.view-btn{min-width:44px;min-height:44px;border:none;background:var(--surface);color:var(--mauve-bark);font-size:1.1rem;cursor:pointer;transition:background .12s ease,color .12s ease}.view-btn+.view-btn{border-left:1.5px solid var(--light-gold)}.view-btn.active{background:var(--willow-green);color:var(--mauve-bark-dark)}.filter-panel{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:16px;margin-bottom:18px;display:flex;flex-direction:column;gap:16px}.filter-empty{margin:0;color:var(--text-muted);font-size:.9rem}.filter-group{display:flex;flex-direction:column;gap:8px}.filter-label{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}.chip-row{display:flex;flex-wrap:wrap;gap:8px}.chip-toggle{border:1.5px solid var(--light-gold);background:var(--vanilla-custard);color:var(--mauve-bark-dark);border-radius:999px;padding:8px 14px;font-size:.85rem;font-weight:600;cursor:pointer;min-height:40px;transition:background .12s ease,border-color .12s ease}.chip-toggle:hover{border-color:var(--willow-green-dark)}.chip-toggle.active{background:var(--willow-green);border-color:var(--willow-green-dark);color:var(--mauve-bark-dark)}.filter-actions{display:flex;justify-content:flex-end}.result-count{color:var(--text-muted);font-size:.85rem;margin:0 0 12px}.tag-chip{background:var(--willow-green);color:var(--mauve-bark-dark);border-radius:999px;padding:2px 10px;font-size:.75rem;font-weight:700}.recipe-meta-row{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 22px}.chip{background:var(--vanilla-custard);color:var(--mauve-bark-dark);border-radius:999px;padding:6px 14px;font-size:.85rem;font-weight:600}.markdown-body{line-height:1.6}.markdown-body h1,.markdown-body h2,.markdown-body h3{margin-top:1.2em}.markdown-body ul,.markdown-body ol{padding-left:1.4em}.markdown-body li{margin:4px 0}.list-row{display:flex;gap:8px;margin-bottom:10px;align-items:flex-start}.list-row .input{flex:1}.ingredient-row{display:grid;grid-template-columns:80px 90px 1fr auto;gap:8px;margin-bottom:10px}@media (max-width: 520px){.ingredient-row{grid-template-columns:1fr 1fr}.ingredient-row>:nth-child(3){grid-column:1 / -1}.ingredient-row .icon-btn{grid-column:1 / -1;width:100%}}.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}.section-title{display:flex;align-items:center;gap:10px;margin:26px 0 12px}.section-title h3{margin:0}.icon-btn{background:transparent;border:1.5px solid #e2d3c8;color:var(--danger);border-radius:var(--radius-sm);width:44px;min-height:44px;cursor:pointer;font-size:1.1rem;display:flex;align-items:center;justify-content:center}.icon-btn:hover{background:#fbe4de;border-color:#f0b8ab}.center-state{text-align:center;padding:60px 20px;color:var(--text-muted)}.spinner{width:38px;height:38px;border:4px solid rgba(102,78,76,.2);border-top-color:var(--mauve-bark);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}.footer{text-align:center;padding:20px;color:var(--mauve-bark);font-size:.85rem;opacity:.8;margin-top:auto}.back-link{display:inline-flex;align-items:center;gap:6px;margin-bottom:16px;color:var(--mauve-bark);font-weight:600}.hidden-input{display:none}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#3a2c2b8c;display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}.modal{background:var(--surface);border-radius:var(--radius);padding:26px;max-width:400px;width:100%;box-shadow:var(--shadow)}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}@media (max-width: 640px){.container{padding:18px 14px calc(36px + env(safe-area-inset-bottom))}.header-inner{padding:12px 14px;gap:8px}.brand{font-size:1.02rem}.nav{gap:2px}.nav a,.nav button{padding:9px 11px;font-size:.9rem;min-height:44px;display:inline-flex;align-items:center}.hero{padding:40px 4px 28px}.hero-actions{flex-direction:column}.hero-actions .btn{width:100%}.card{padding:18px 16px}.toolbar{flex-direction:column}.toolbar .btn{width:100%}.page-head{gap:10px}.page-head h1{font-size:1.6rem}.recipe-grid{grid-template-columns:1fr}.card-actions{flex-wrap:wrap}.card-actions .btn{flex:1 1 auto}.overlay{align-items:flex-end;padding:0}.modal{max-width:100%;border-radius:var(--radius) var(--radius) 0 0;padding:22px 18px calc(22px + env(safe-area-inset-bottom))}.modal-actions .btn{flex:1 1 auto}}@media (hover: none){.recipe-card:hover{transform:none;box-shadow:var(--shadow-sm)}}