:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0f1218;--bg-elevated:#171b24;--bg-soft:#1e2430;--border:#2a3344;--text:#e8ecf4;--muted:#8b95a8;--accent:#5bdc8a;--accent-dim:#2d8a52;--accent-bg:#5bdc8a1f;--danger:#ff7b7b;--warn:#f0c14b;--radius:10px;--font:"Segoe UI", system-ui, -apple-system, sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;font-family:var(--font);color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-weight:400;line-height:1.45}*,:before,:after{box-sizing:border-box}body{touch-action:manipulation;background:radial-gradient(ellipse 80% 50% at 10% -10%, #5bdc8a14, transparent), radial-gradient(ellipse 60% 40% at 100% 0%, #5a8cff0f, transparent), var(--bg);min-height:100vh;margin:0}#app{min-height:100vh}.layout{max-width:1120px;margin:0 auto;padding:1.25rem 1rem 3rem}.header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.25rem;display:flex}.brand h1{letter-spacing:-.02em;margin:0;font-size:1.45rem;font-weight:700}.tagline{color:var(--muted);margin:.25rem 0 0;font-size:.9rem}.status{background:var(--bg-elevated);border:1px solid var(--border);color:var(--muted);border-radius:999px;align-items:center;gap:.5rem;padding:.4rem .75rem;font-size:.85rem;display:inline-flex}.dot{background:var(--muted);border-radius:50%;width:.55rem;height:.55rem}.dot.ok{background:var(--accent);box-shadow:0 0 8px var(--accent-dim)}.dot.down{background:var(--danger)}.dot.unknown{background:var(--warn)}.tabs{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);gap:.35rem;margin-bottom:1rem;padding:.3rem;display:flex}.tab{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;padding:.55rem .75rem;font-weight:600;transition:background .15s,color .15s}.tab:hover{color:var(--text);background:var(--bg-soft)}.tab.active{color:var(--bg);background:var(--accent)}.panel{background:var(--bg-elevated);border:1px solid var(--border);border-radius:calc(var(--radius) + 2px);padding:1.15rem 1.2rem 1.35rem}.panel.empty{text-align:center;color:var(--muted);padding:2.5rem 1rem}.grid-2{grid-template-columns:1fr 1fr;gap:1.5rem;display:grid}@media (width<=820px){.grid-2{grid-template-columns:1fr}}.stack{flex-direction:column;gap:.9rem;min-width:0;display:flex}.section-title{margin:0;font-size:1.05rem;font-weight:650}.field{flex-direction:column;gap:.35rem;font-size:.9rem;display:flex}.field>span{color:var(--muted);font-weight:500}.hint,em.hint{color:var(--muted);font-size:.8rem;font-style:normal;font-weight:400}.muted{color:var(--muted);margin:0}.meta{font-size:.85rem;margin-bottom:.5rem!important}button:focus-visible{outline:2px solid var(--accent-dim);outline-offset:1px}.row{align-items:center;gap:.5rem;display:flex}.row.nums{flex-wrap:wrap;align-items:stretch}.stepper{align-items:center;gap:.4rem;display:flex}.stepper-btn{border:1px solid var(--border);background:var(--bg-soft);width:2.75rem;height:2.75rem;color:var(--text);cursor:pointer;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;font-size:1.15rem;font-weight:700;display:flex}.stepper-btn:hover:not(:disabled){border-color:var(--muted)}.stepper-btn:disabled{opacity:.35;cursor:not-allowed}.stepper-value{text-align:center;font-variant-numeric:tabular-nums;min-width:2rem;font-size:1.05rem;font-weight:700}.stepper-max{border:1px solid var(--border);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:999px;flex-shrink:0;margin-left:auto;padding:.4rem .6rem;font-size:.78rem;font-weight:700}.stepper-max:hover:not(:disabled){border-color:var(--accent-dim);color:var(--accent)}.stepper-max:disabled{opacity:.35;cursor:not-allowed}.btn{border:1px solid var(--border);background:var(--bg-soft);color:var(--text);font:inherit;cursor:pointer;white-space:nowrap;border-radius:8px;padding:.55rem .9rem;font-weight:600;transition:background .15s,border-color .15s,opacity .15s}.btn:hover:not(:disabled){border-color:var(--muted);background:#252c3a}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:var(--accent);color:#0a120e}.btn.primary:hover:not(:disabled){filter:brightness(1.05);background:var(--accent)}.btn.ghost{background:0 0}.btn.small{padding:.35rem .55rem;font-size:.8rem}.recipe-list{flex-direction:column;gap:.35rem;margin:0;padding:0;list-style:none;display:flex}.recipe-list li{background:var(--bg);border:1px solid var(--border);border-radius:8px;align-items:center;gap:.5rem;padding:.45rem .55rem;display:flex}.step-num{font-family:var(--mono);color:var(--accent);text-align:center;width:1.4rem;font-size:.75rem}.step-name{flex:1;font-weight:500}.step-actions{gap:.2rem;display:flex}.icon-btn{border:1px solid var(--border);background:var(--bg-soft);width:1.75rem;height:1.75rem;color:var(--text);cursor:pointer;font:inherit;border-radius:6px;line-height:1}.icon-btn:hover:not(:disabled){border-color:var(--muted)}.icon-btn:disabled{opacity:.35;cursor:not-allowed}.icon-btn.danger:hover:not(:disabled){border-color:var(--danger);color:var(--danger)}.stats{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.5rem;display:grid}.stat{background:var(--bg);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:.15rem;padding:.55rem .65rem;display:flex}.stat.highlight{border-color:var(--accent-dim);background:var(--accent-bg)}.stat-label{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-size:.75rem}.stat-value{font-variant-numeric:tabular-nums;font-weight:700}.chips{background:var(--bg);border:1px solid var(--border);border-radius:8px;flex-wrap:wrap;gap:.35rem;max-height:10rem;padding:.35rem;display:flex;overflow-y:auto}.chips.readonly{background:0 0;border:none;max-height:none;padding:0}.chip{border:1px solid var(--border);background:var(--bg-soft);color:var(--muted);font:inherit;cursor:pointer;border-radius:999px;padding:.25rem .6rem;font-size:.8rem;transition:background .12s,color .12s,border-color .12s}.chip:hover:not(:disabled){border-color:var(--muted);color:var(--text)}.chip.on{background:var(--accent-bg);border-color:var(--accent-dim);color:var(--accent);font-weight:600}.chip:disabled{opacity:.35;cursor:not-allowed}.chip.tiny{cursor:default;color:var(--text);padding:.12rem .4rem;font-size:.72rem}.field-head{justify-content:space-between;align-items:center;gap:.6rem;display:flex}.field-head>span{color:var(--muted);font-weight:500}.clear-link{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;padding:.1rem .3rem;font-size:.78rem;font-weight:700}.clear-link:hover{color:var(--danger)}.pill-row{flex-wrap:wrap;gap:.45rem;display:flex}.pill{border:1.5px solid var(--border);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:999px;padding:.45rem .85rem;font-size:.88rem;font-weight:600;transition:border-color .12s,color .12s,background .12s}.pill:hover{border-color:var(--muted);color:var(--text)}.pill.on{border-color:var(--accent);color:var(--accent);background:var(--accent-bg)}.pill.on:before{content:"";background:var(--accent);vertical-align:middle;border-radius:50%;width:.4rem;height:.4rem;margin-right:.42rem;display:inline-block}.summary-btn{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;border-radius:10px;justify-content:space-between;align-items:center;gap:.75rem;padding:.7rem .8rem;display:flex}.summary-btn:hover{border-color:var(--muted)}.summary-btn.empty{color:var(--muted);border-style:dashed}.summary-btn .chev{color:var(--muted);flex-shrink:0;font-size:1.1rem;line-height:1}.summary-main{flex-direction:column;gap:.35rem;min-width:0;display:flex}.summary-title{font-size:.92rem;font-weight:600}.summary-chips{flex-wrap:wrap;gap:.3rem;display:flex}.summary-chips .mini{background:var(--bg-soft);border:1px solid var(--border);color:var(--text);border-radius:999px;padding:.12rem .5rem;font-size:.74rem}.summary-chips .mini.more{color:var(--muted)}.modal-backdrop{z-index:40;background:#05070b99;justify-content:center;align-items:flex-end;display:none;position:fixed;inset:0}.modal-backdrop.open{display:flex}.modal{background:var(--bg-elevated);border:1px solid var(--border);border-bottom:none;border-radius:16px 16px 0 0;flex-direction:column;width:100%;max-height:88vh;display:flex;overflow:hidden}@media (width>=640px){.modal-backdrop{align-items:center}.modal{border-radius:calc(var(--radius) + 2px);border-bottom:1px solid var(--border);max-width:30rem;max-height:80vh}}.modal-head{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;gap:.75rem;padding:.9rem 1rem;display:flex}.modal-title{flex-direction:column;gap:.1rem;display:flex}.modal-title strong{font-size:1rem}.modal-title span{color:var(--muted);font-size:.78rem}.modal-close{border:1px solid var(--border);background:var(--bg-soft);width:2rem;height:2rem;color:var(--text);cursor:pointer;border-radius:50%;flex-shrink:0;font-size:1rem}.order-tray{border-bottom:1px solid var(--border);background:var(--bg);flex-shrink:0;gap:.4rem;padding:.7rem 1rem;display:flex;overflow-x:auto}.order-tray.is-empty:before{content:"Tap ingredients below — they'll be mixed in the order you tap them.";color:var(--muted);font-size:.82rem}.tray-chip{background:var(--accent-bg);border:1px solid var(--accent-dim);color:var(--accent);white-space:nowrap;cursor:pointer;border-radius:999px;flex-shrink:0;align-items:center;gap:.35rem;padding:.3rem .55rem .3rem .7rem;font-size:.82rem;font-weight:600;display:flex}.tray-chip .n{font-family:var(--mono);opacity:.8}.tray-chip .x{opacity:.75;font-size:.95rem}.modal-body{flex:1;padding:.9rem 1rem 1.1rem;overflow-y:auto}.modal-grid{grid-template-columns:repeat(auto-fill,minmax(7.2rem,1fr));gap:.5rem;display:grid}.grid-chip{border:1px solid var(--border);background:var(--bg);color:var(--text);font:inherit;cursor:pointer;text-align:left;border-radius:9px;justify-content:space-between;align-items:center;gap:.4rem;padding:.55rem .6rem;font-size:.86rem;font-weight:500;transition:transform 80ms,border-color .12s,background .12s;display:flex}.grid-chip:active{transform:scale(.96)}.grid-chip .check{border:1.5px solid var(--border);color:#0000;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;width:1.05rem;height:1.05rem;font-size:.7rem;display:flex}.grid-chip.on{border-color:var(--accent-dim);background:var(--accent-bg);color:var(--accent)}.grid-chip.on .check{background:var(--accent);border-color:var(--accent);color:#0a120e}.grid-chip:disabled{opacity:.35;cursor:not-allowed}.grid-chip .count-badge{font-family:var(--mono);color:var(--accent);background:var(--accent-bg);border-radius:999px;flex-shrink:0;padding:.05rem .4rem;font-size:.72rem}.modal-foot{padding:.8rem 1rem calc(.8rem + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--bg-elevated);flex-shrink:0;gap:.6rem;display:flex}.btn-done{background:var(--accent);border:1px solid var(--accent);color:#0a120e;font:inherit;cursor:pointer;border-radius:10px;flex:1;padding:.75rem;font-size:.95rem;font-weight:700}.btn-clear-modal{border:1px solid var(--border);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:10px;padding:.75rem .9rem;font-size:.95rem;font-weight:600}.btn-clear-modal:hover{border-color:var(--danger);color:var(--danger)}.btn-clear-modal:disabled{opacity:.35;cursor:not-allowed;border-color:var(--border);color:var(--muted)}.search-panel{flex-direction:column;gap:1.35rem;display:flex}.search-controls{border-bottom:1px solid var(--border);padding-bottom:.25rem}.search-fields{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));align-items:end;gap:.9rem 1rem;display:grid}.search-filters{grid-template-columns:1fr 1fr 1fr;gap:.9rem;display:grid}@media (width<=900px){.search-filters{grid-template-columns:1fr}}.search-results{min-width:0}.result-cards{flex-direction:column;gap:1rem;display:flex}.result-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:.85rem;padding:1rem 1.1rem 1.15rem;display:flex}.result-card-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.result-rank{align-items:center;gap:.65rem;display:flex}.rank-badge{background:var(--accent-bg);border:1px solid var(--accent-dim);min-width:2.25rem;color:var(--accent);font-variant-numeric:tabular-nums;border-radius:999px;justify-content:center;align-items:center;padding:.25rem .55rem;font-size:.9rem;font-weight:700;display:inline-flex}.btn.small.primary{padding:.4rem .75rem}.loading-box{color:var(--muted);text-align:center;flex-direction:column;align-items:center;gap:.75rem;padding:2rem 1rem;display:flex}.loading-box .loading-sub{margin:0;font-size:.85rem}.loading-box .queue-hint{max-width:28rem;color:var(--text);background:#f0c14b1a;border:1px solid #f0c14b59;border-radius:8px;margin:.25rem 0 0;padding:.65rem .85rem;font-size:.88rem;line-height:1.45}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:2rem;height:2rem;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.footer{text-align:center;color:var(--muted);margin-top:1.5rem;font-size:.8rem}.footer code,.panel code{font-family:var(--mono);background:var(--bg-soft);border-radius:4px;padding:.1rem .35rem;font-size:.85em}.toast{border:1px solid var(--danger);color:#ffd0d0;z-index:50;background:#2a1a1a;border-radius:10px;max-width:min(90vw,440px);padding:.75rem 1rem;font-size:.9rem;line-height:1.4;position:fixed;bottom:1.25rem;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #00000073}.toast.info{color:#f5e6b8;background:#1a2218;border-color:#f0c14b8c}