:root{--bg:#131110;--surface:#1c1a18;--surface-2:#242120;--surface-3:#302c29;--ink:#ece7df;--ink-soft:#a39a8e;--ink-faint:#6e655b;--line:#2c2926;--line-strong:#3b3531;--accent:#e07a5f;--accent-ink:#1a0f0c;--accent-soft:color-mix(in oklab, var(--accent) 20%, transparent);--tan:#ca9c66;--liquid:#5aa6d4;--liquid-soft:color-mix(in oklab, var(--liquid) 20%, transparent);--flour:#c89a5e;--flour-soft:color-mix(in oklab, var(--flour) 20%, transparent);--fat:#e0a13a;--fat-soft:color-mix(in oklab, var(--fat) 20%, transparent);--danger:#e2685a;--r-lg:12px;--r-md:8px;--r-sm:5px;--pad:16px;--gap:10px;--page-bottom:92px;--font-display:"Outfit", system-ui, sans-serif;--font-body:"Outfit", system-ui, sans-serif;--font-mono:"IBM Plex Mono", "SFMono-Regular", monospace;--shadow-card:0 1px 2px #0000004d;--shadow-card-hover:0 6px 24px -10px #0009;--label-tracking:.08em;--label-transform:uppercase;--label-weight:600}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}html,body{height:100%;margin:0}body{background:radial-gradient(120% 80% at 50% -10%, #1a1715 0%, var(--bg) 60%);font-family:var(--font-body);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit;color:inherit}h1,h2,h3,h4,p{margin:0}.stage{flex-direction:column;min-height:100dvh;display:flex}.phone{background:var(--bg);flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.statusbar{height:max(8px, env(safe-area-inset-top,0px));flex:none}.screen{-webkit-overflow-scrolling:touch;scrollbar-width:none;min-height:0;padding-bottom:env(safe-area-inset-bottom);flex:1 1 0;overflow:hidden auto}.screen::-webkit-scrollbar{display:none}.cta-bar{padding:12px var(--pad) calc(14px + env(safe-area-inset-bottom));background:linear-gradient(to top, var(--bg) 70%, transparent);z-index:4;flex:none;margin-top:-60px;position:relative}.tabbar{margin:0 10px calc(10px + env(safe-area-inset-bottom));background:color-mix(in oklab, var(--surface) 88%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-card);flex:none;gap:4px;padding:5px;display:flex}.tabbar button,.tabbar a{border-radius:var(--r-sm);cursor:pointer;color:var(--ink-faint);font-family:var(--font-body);letter-spacing:.05em;text-transform:uppercase;background:0 0;border:0;flex-direction:column;flex:1;align-items:center;gap:3px;padding:8px 4px;font-size:9.5px;font-weight:600;text-decoration:none;transition:color .18s,background .18s;display:flex}.tabbar button.active,.tabbar a.active{color:var(--accent);background:var(--accent-soft)}.tabbar button svg,.tabbar a svg{width:21px;height:21px}.h-display{font-family:var(--font-display);letter-spacing:-.015em;font-weight:600;line-height:1.05}.label{font-size:10px;font-weight:var(--label-weight);letter-spacing:var(--label-tracking);text-transform:var(--label-transform);color:var(--ink-faint)}.mono{font-family:var(--font-mono);font-feature-settings:"tnum" 1;font-size:.92em}.page-head{padding:4px var(--pad) 14px}.page-head__eyebrow{margin-bottom:4px}.page-head__title{font-size:clamp(1.5rem,4.5vw,1.85rem);line-height:1.06}.page-head__title-row{justify-content:space-between;align-items:center;gap:10px;margin-top:6px;display:flex}.page-head__title-row .iconbtn{flex-shrink:0}.page-head__desc{color:var(--ink-soft);max-width:38ch;margin-top:8px;font-size:13px;line-height:1.5}.page-head__desc strong{font-weight:600}.text-liquid{color:var(--liquid)}.text-fat{color:var(--fat)}.text-flour{color:var(--flour)}.page-list{gap:var(--gap);padding:0 var(--pad) var(--page-bottom);flex-direction:column;display:flex}.field{border:1px solid var(--line-strong);border-radius:var(--r-sm);width:100%;font:inherit;background:var(--surface);color:var(--ink);outline:none;margin:6px 0 14px;padding:12px 14px;font-size:15px;transition:border-color .15s,box-shadow .15s}.field:focus{border-color:color-mix(in oklab, var(--accent) 55%, transparent);box-shadow:0 0 0 3px var(--accent-soft)}.sheet-card{margin-bottom:16px;padding:2px 14px}.sheet-row{border-bottom:1px solid var(--line);color:var(--ink-soft);justify-content:space-between;align-items:center;gap:12px;padding:13px 0;font-size:14px;display:flex}.sheet-row--last{border-bottom:0}.ing-card{padding:12px 14px;transition:box-shadow .18s}.ing-card__head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.ing-card__title{align-items:center;gap:10px;min-width:0;display:flex}.ing-card__name{letter-spacing:-.01em;font-size:15px;font-weight:600}.ing-card__flour{color:var(--ink-soft);flex-shrink:0;align-items:center;gap:10px;font-size:12px;display:flex}.ing-card__flour-label{align-items:center;gap:6px;display:flex}.ing-card__actions{flex-shrink:0;align-items:center;gap:10px;display:flex}.ing-card__del{border:1px solid var(--line);border-radius:var(--r-sm);width:30px;height:30px;color:var(--ink-faint);cursor:pointer;background:0 0;justify-content:center;align-items:center;transition:color .15s,border-color .15s,background .15s;display:inline-flex}.ing-card__del:hover{color:var(--danger);border-color:color-mix(in oklab, var(--danger) 45%, transparent);background:color-mix(in oklab, var(--danger) 10%, transparent)}.ing-card__attrs{flex-direction:row;gap:10px;display:flex}.ing-attr{flex:1;min-width:0}.ing-attr--muted{opacity:.4;pointer-events:none}.ing-attr__top{justify-content:space-between;align-items:center;margin-bottom:5px;display:flex}.ing-attr__label{color:var(--ink-soft);align-items:center;gap:6px;font-size:12px;font-weight:500;display:flex}.ing-attr__value{color:var(--ink-faint);font-size:11px}.ing-attr__row{align-items:center;gap:8px;display:flex}.iconbtn{border-radius:var(--r-sm);border:1px solid var(--line-strong);background:var(--surface);width:34px;height:34px;color:var(--ink);cursor:pointer;flex:none;justify-content:center;align-items:center;transition:transform .1s,background .15s,border-color .15s;display:inline-flex}.iconbtn:hover{border-color:var(--ink-faint)}.iconbtn:active{transform:scale(.92)}.iconbtn svg{width:17px;height:17px}.appbar{z-index:20;padding:8px var(--pad);background:color-mix(in oklab, var(--bg) 84%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);align-items:center;gap:10px;display:flex;position:sticky;top:0}.appbar .iconbtn{margin-left:0}.page-chrome{z-index:20;padding:10px var(--pad);background:color-mix(in oklab, var(--bg) 82%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;display:flex;position:sticky;top:0}.page-chrome__actions{flex-shrink:0;align-items:center;gap:6px;display:flex}.breadcrumb{min-width:0}.breadcrumb__list{flex-wrap:nowrap;align-items:center;min-width:0;margin:0;padding:0;list-style:none;display:flex}.breadcrumb__item{align-items:center;min-width:0;display:inline-flex}.breadcrumb__home{color:var(--ink-faint);flex-shrink:0;justify-content:center;align-items:center;transition:color .15s;display:inline-flex}.breadcrumb__home:hover{color:var(--accent)}.breadcrumb__sep{color:var(--ink-faint);-webkit-user-select:none;user-select:none;margin:0 7px;font-size:13px}.breadcrumb__link{letter-spacing:.02em;color:var(--ink-faint);white-space:nowrap;text-overflow:ellipsis;max-width:13ch;font-size:12.5px;font-weight:600;text-decoration:none;transition:color .15s;overflow:hidden}.breadcrumb__link:hover{color:var(--accent)}.breadcrumb__current{letter-spacing:.01em;color:var(--ink);white-space:nowrap;text-overflow:ellipsis;max-width:20ch;font-size:12.5px;font-weight:700;overflow:hidden}.confirm-backdrop{z-index:80;padding:var(--pad);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0806049e;justify-content:center;align-items:center;animation:.18s fadeup;display:flex;position:absolute;inset:0}.confirm-panel{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-md);width:100%;max-width:340px;box-shadow:var(--shadow-card);padding:18px 16px 14px}.confirm-panel__title{margin:0 0 10px;font-size:1.15rem;line-height:1.2}.confirm-panel__message{color:var(--ink-soft);margin:0 0 12px;font-size:14px;line-height:1.5}.confirm-panel__list{color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);max-height:180px;margin:0 0 16px;padding:10px 12px 10px 28px;font-size:13.5px;line-height:1.45;overflow-y:auto}.confirm-panel__list li+li{margin-top:6px}.confirm-panel__actions{justify-content:flex-end;gap:8px;display:flex}.confirm-panel__actions .btn{min-width:96px}.confirm-panel__actions--solo{justify-content:center}.confirm-panel__actions--solo .btn{min-width:120px}.metric-ring{flex-shrink:0;width:50px;height:50px;position:relative}.metric-ring__svg{width:100%;height:100%}.metric-ring__track{fill:none;stroke:var(--surface-3);stroke-width:3.5px}.metric-ring__fill{fill:none;stroke-width:3.5px;stroke-linecap:round;transition:stroke-dasharray .25s}.metric-ring--liquid .metric-ring__fill{stroke:var(--liquid)}.metric-ring--fat .metric-ring__fill{stroke:var(--fat)}.metric-ring__center{flex-direction:column;justify-content:center;align-items:center;gap:1px;display:flex;position:absolute;inset:0}.metric-ring--liquid .metric-ring__center{color:var(--liquid)}.metric-ring--fat .metric-ring__center{color:var(--fat)}.metric-ring__value{font-size:10px;font-weight:700;line-height:1}.metric-rings{align-items:center;gap:12px;display:flex}.metric-rings__item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);align-items:center;gap:8px;padding:8px 12px 8px 8px;display:flex}.metric-rings__label{color:var(--ink-faint);letter-spacing:.06em;text-transform:uppercase;font-size:9.5px;font-weight:600}.editor-body{padding:0 var(--pad) 100px}.editor-title{border:0;border-bottom:1px solid var(--line-strong);width:100%;color:var(--ink);font-size:1.4rem;font-family:var(--font-display);letter-spacing:-.02em;background:0 0;outline:none;padding:10px 0 12px;font-weight:600}.editor-title::placeholder{color:var(--ink-faint)}.editor-section{margin:18px 0 7px;font-size:10px}.editor-row{padding:9px 12px}.card-link{text-align:left;cursor:pointer;color:inherit;padding:13px 14px;transition:box-shadow .18s,transform .12s,border-color .18s;display:block}.card-link:active{transform:scale(.985)}.card-link:hover{border-color:var(--line-strong)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-card)}a.card:hover,button.card:hover,.card-link:hover{box-shadow:var(--shadow-card-hover)}.chip{border-radius:var(--r-sm);letter-spacing:.02em;background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line);white-space:nowrap;align-items:center;gap:6px;padding:4px 9px;font-size:11px;font-weight:600;display:inline-flex}.chip.accent{background:var(--accent-soft);color:var(--accent);border-color:color-mix(in oklab, var(--accent) 30%, transparent)}.btn{cursor:pointer;font-family:var(--font-body);letter-spacing:-.01em;border-radius:var(--r-md);background:var(--accent);color:var(--accent-ink);box-shadow:0 4px 16px -6px color-mix(in oklab, var(--accent) 70%, transparent);border:0;justify-content:center;align-items:center;gap:8px;padding:14px 20px;font-size:15px;font-weight:700;transition:transform .12s,filter .15s,box-shadow .15s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:hover{filter:brightness(1.06)}.btn.ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line-strong);box-shadow:none}.btn.ghost:hover{border-color:var(--ink-faint);filter:none}.btn.danger-btn{color:var(--danger);border:1px solid color-mix(in oklab, var(--danger) 45%, transparent);box-shadow:none;background:0 0}.btn.danger-btn:hover{background:color-mix(in oklab, var(--danger) 12%, transparent);filter:none}.btn.block{width:100%}.dot{border-radius:50%;flex:none;width:7px;height:7px;display:inline-block}.dot.liquid{background:var(--liquid);box-shadow:0 0 0 3px var(--liquid-soft)}.dot.flour{background:var(--flour);box-shadow:0 0 0 3px var(--flour-soft)}.dot.fat{background:var(--fat);box-shadow:0 0 0 3px var(--fat-soft)}.dot.other{background:var(--ink-faint)}.rows>*+*{border-top:1px solid var(--line)}.bigfield{align-items:baseline;gap:12px;display:flex}.bigfield input{font-family:var(--font-mono);font-feature-settings:"tnum" 1;color:var(--ink);letter-spacing:-.01em;background:0 0;border:0;outline:none;width:100%;padding:0;font-size:38px;font-weight:500}.bigfield input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.bigfield input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.bigfield .unit{font-family:var(--font-mono);color:var(--ink-faint);flex-shrink:0;font-size:16px}.seg{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);gap:3px;padding:3px;display:flex}.seg button{cursor:pointer;font-family:var(--font-body);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);border-radius:var(--r-sm);background:0 0;border:0;flex:1;padding:10px 8px;font-size:11px;font-weight:700;line-height:1.2;transition:all .15s}.seg button.active{background:var(--accent);color:var(--accent-ink)}.stepper{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);flex-shrink:0;align-items:center;gap:0;padding:2px;display:inline-flex}.stepper button{border-radius:calc(var(--r-sm) - 2px);width:28px;height:28px;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;font-size:16px;line-height:1;transition:background .12s,color .12s}.stepper button:hover{background:var(--surface-3);color:var(--ink)}.stepper button:active{background:var(--line)}.stepper input{text-align:center;width:42px;font-family:var(--font-mono);color:var(--ink);background:0 0;border:0;outline:none;height:28px;padding:0;font-size:13px;font-weight:500}.toggle{cursor:pointer;background:var(--surface-3);border:0;border-radius:999px;flex:none;width:44px;height:26px;transition:background .2s;position:relative}.toggle:after{content:"";background:var(--ink);border-radius:50%;width:20px;height:20px;transition:transform .2s cubic-bezier(.34,1.2,.64,1);position:absolute;top:3px;left:3px}.toggle.on{background:var(--accent)}.toggle.on:after{background:var(--accent-ink);transform:translate(18px)}.meter{border-radius:var(--r-sm);background:var(--surface-3);height:6px;overflow:hidden}.meter>i{border-radius:var(--r-sm);background:var(--liquid);height:100%;transition:width .2s;display:block}.meter--liquid>i{background:var(--liquid)}.meter--fat>i,.meter.fat>i{background:var(--fat)}.fab{z-index:25;border-radius:var(--r-md);background:var(--accent);width:52px;height:52px;color:var(--accent-ink);cursor:pointer;box-shadow:0 8px 24px -8px color-mix(in oklab, var(--accent) 80%, transparent);border:0;justify-content:center;align-items:center;text-decoration:none;transition:transform .12s,box-shadow .15s;display:flex;position:absolute;bottom:84px;right:16px}.fab:hover{box-shadow:0 10px 28px -8px color-mix(in oklab, var(--accent) 90%, transparent)}.fab:active{transform:scale(.92)}.fab svg{width:25px;height:25px}.imgslot{background:repeating-linear-gradient(45deg, var(--surface-2), var(--surface-2) 9px, transparent 9px, transparent 18px), var(--surface);border:1px solid var(--line);color:var(--ink-faint);font-family:var(--font-mono);letter-spacing:.04em;justify-content:center;align-items:center;font-size:10.5px;display:flex}@keyframes slidein{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:none}}@keyframes fadeup{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.anim-slide{animation:.24s cubic-bezier(.22,.61,.36,1) slidein}@keyframes pulse{0%{color:var(--accent)}to{color:inherit}}.pulse{animation:.5s ease-out pulse}.sticky-top,.recipe-top{z-index:20;background:color-mix(in oklab, var(--bg) 88%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);position:sticky;top:0}.sticky-top .page-chrome,.recipe-top .page-chrome{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border-bottom:none;position:static}.recipe-sticky-head{padding:0 var(--pad) 10px;align-items:center;gap:10px;display:flex}.recipe-sticky-head__title{flex:1;min-width:0}.recipe-sticky-head__name{text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:clamp(1.15rem,3.8vw,1.45rem);line-height:1.12;overflow:hidden}.recipe-sticky-head__input{width:100%;color:var(--ink);font-size:clamp(1.15rem,3.8vw,1.45rem);font-family:var(--font-display);letter-spacing:-.02em;background:0 0;border:0;outline:none;margin:0;padding:2px 0 4px;font-weight:600}.recipe-sticky-head__input::placeholder{color:var(--ink-faint)}.recipe-metrics{flex-shrink:0;align-items:center;gap:5px;display:flex}.recipe-metrics__item{border-radius:var(--r-sm);border:1px solid #0000;align-items:center;gap:4px;padding:4px 7px;font-size:12px;font-weight:600;display:inline-flex}.recipe-metrics__item--liquid{background:var(--liquid-soft);color:var(--liquid);border-color:color-mix(in oklab, var(--liquid) 28%, transparent)}.recipe-metrics__item--fat{background:var(--fat-soft);color:var(--fat);border-color:color-mix(in oklab, var(--fat) 28%, transparent)}.recipe-desc{margin:10px var(--pad) 0;color:var(--ink-soft);font-size:13.5px;line-height:1.45}.sync-link{position:relative}.sync-link--pending:after{content:"";background:var(--accent);border:1.5px solid var(--bg);border-radius:50%;width:7px;height:7px;position:absolute;top:5px;right:5px}.stat-strip{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);display:flex;overflow:hidden}.stat-strip--inset{margin:14px 0 0}.stat-strip__cell{text-align:center;flex:1;padding:10px 6px}.stat-strip__cell--border{border-left:1px solid var(--line)}.stat-strip__value{font-size:15px;font-weight:600}.stat-strip__label{margin-top:3px;font-size:9px}.stack{flex-direction:column;display:flex}.row{align-items:center;display:flex}.between{justify-content:space-between}.muted{color:var(--ink-soft)}.faint{color:var(--ink-faint)}.center{text-align:center}.grow{flex:1}
