/* PISTORA v54 design layer — refines the existing green-and-cream system and loads last on every page.
   Layout concept: one calm working surface; state is shown in form (chips, meters), never by colour alone.
   Single light theme by choice: the product is printed and used on shop-floor tablets, so every colour below is explicit. */
:root{
 color-scheme:light;
 --ink:#253a2e;--muted:#66705f;--bg:#f7f6ef;--paper:#fffefa;--line:#dfe2d5;--green:#284d37;--lime:#dce5b4;--orange:#bd6c47;
 --focus:#2f6b45;--ok:#2f6b45;--ok-bg:#e4eed8;--warn:#8f5410;--warn-bg:#f7ead6;--bad:#a23b2a;--bad-bg:#f5e0db;
 --radius:10px;--shadow:0 1px 2px #23392d0f,0 6px 20px #23392d0d;
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);text-rendering:optimizeLegibility}
/* Header: the tab row wraps inside the sticky bar instead of floating over the page (seen at 900–1180 px). */
header.nav{height:auto;min-height:72px;row-gap:0}
header.nav nav{scrollbar-width:none;-ms-overflow-style:none}
header.nav nav::-webkit-scrollbar{display:none}
/* Numbers line up in every table, tile and input. */
.metrics,.metric strong,table,.ingredients,input[type=number],.mixcheck-check b,.range-meter,.costbook,.stock,[class*=total]{font-variant-numeric:tabular-nums}
/* Keyboard focus is always visible. */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:where(input,select,textarea):focus-visible{outline-offset:0}
/* Comfortable touch targets on tablets and phones. */
@media (pointer:coarse){:where(button,.button,select,summary,input[type=checkbox]+span){min-height:44px}input[type=checkbox],input[type=radio]{width:20px;height:20px}}
/* Headings balance across lines; long names never overflow their card. */
:where(h1,h2,h3){text-wrap:balance}
:where(.recipe-name,.metric,.mixcheck-check,td,th){overflow-wrap:anywhere}
/* Formulation check: state chips and a range meter under each value. */
.mixcheck-check{position:relative}
.mixcheck-check.in-range small{color:var(--ok)}
.mixcheck-check.low small,.mixcheck-check.high small{color:var(--warn)}
.mixcheck-check.unknown small{color:var(--muted)}
.range-meter{display:block;position:relative;height:6px;margin-top:8px;border-radius:3px;background:#e8eadf;overflow:visible}
.range-meter .band{position:absolute;top:0;bottom:0;border-radius:3px;background:#b9cf9a}
.range-meter .mark{position:absolute;top:-3px;width:3px;height:12px;margin-left:-1.5px;border-radius:2px;background:var(--ink)}
.mixcheck-check.low .range-meter .mark,.mixcheck-check.high .range-meter .mark{background:var(--warn)}
.flavour-targets table{width:100%;border-collapse:collapse;font-size:13px}
.flavour-targets th,.flavour-targets td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
.flavour-targets th{font-size:11px;letter-spacing:.04em;color:var(--muted);font-weight:600}
/* Target dialog: two solver choices side by side. */
.solver-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
.solver-actions .outline{font-size:13px;padding:12px 16px}
/* Install button and offline notice. */
.install-app{border:1px solid var(--green);background:var(--paper);color:var(--green);font-weight:600;font-size:12px;padding:8px 12px;border-radius:999px;white-space:nowrap}
.offline-bar{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;max-width:calc(100% - 32px);padding:10px 16px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:13px;line-height:1.4;box-shadow:var(--shadow)}
/* Print: drop chrome, keep the sheet. */
@media print{header.nav,.offline-bar,.install-app,footer,.welcome-actions,#chat-launcher{display:none!important}body{background:#fff}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* v64: copyright notice */
.ip-notice{margin:10px 0 0;font-size:11px;line-height:1.5;color:var(--muted,#66705f);max-width:72ch}
.ip-notice a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.ip-footer{padding:18px 16px 24px;display:flex;justify-content:center;text-align:center}