/* Tree House breakfast: the shared base for the order page, the review page and the kitchen tracker.
   Palette, type and drawings come from the first page (13-10-2026); this file only puts them in one place
   and themes the browser surfaces that were left on defaults. */
:root{
  --bg:#E4E9DC; --surface:#F7F6F0; --line:#C9D1BE; --fg:#26301F; --muted:#56624E;
  --accent:#A24C27; --accent-strong:#8C3F1F; --accent-ink:#FFF8F1; --pick:#26301F; --pick-ink:#F7F6F0;
  --warn:#8A5200; --warn-bg:#F6E7C8; --ok:#2F6B3A; --ok-bg:#DCEBD8; --yolk:#C27400; --yolk-soft:#F7BE36;
  --sel:#F2C9B4; --ctl-line:#77836A;
  --display:"DM Serif Display", Georgia, serif; --body:"Work Sans", system-ui, -apple-system, sans-serif;
  --r-s:10px; --r-m:14px; --r-l:20px;
  --shadow:0 1px 2px rgba(38,48,31,.06), 0 8px 24px -12px rgba(38,48,31,.22);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#171C14; --surface:#20271C; --line:#36412F; --fg:#E9EEE2; --muted:#A8B49E;
  --accent:#E08A5E; --accent-strong:#EBA27D; --accent-ink:#1B120C; --pick:#E9EEE2; --pick-ink:#171C14;
  --warn:#F2C26B; --warn-bg:#3A2E14; --ok:#9BD3A3; --ok-bg:#1F3324; --yolk:#F2B53A; --yolk-soft:#F7C95A;
  --sel:#5A3A28; --ctl-line:#6E7B63;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 28px -14px rgba(0,0,0,.6);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#171C14; --surface:#20271C; --line:#36412F; --fg:#E9EEE2; --muted:#A8B49E;
  --accent:#E08A5E; --accent-strong:#EBA27D; --accent-ink:#1B120C; --pick:#E9EEE2; --pick-ink:#171C14;
  --warn:#F2C26B; --warn-bg:#3A2E14; --ok:#9BD3A3; --ok-bg:#1F3324; --yolk:#F2B53A; --yolk-soft:#F7C95A;
  --sel:#5A3A28; --ctl-line:#6E7B63;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 28px -14px rgba(0,0,0,.6);
  color-scheme:dark}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--line) transparent}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:16px;line-height:1.45;
  font-variant-numeric:tabular-nums;caret-color:var(--accent);accent-color:var(--accent);
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);-webkit-tap-highlight-color:transparent}
::selection{background:var(--sel);color:var(--fg)}
[hidden]{display:none!important}
img,svg{max-width:100%}
a{color:var(--accent);text-underline-offset:.18em;text-decoration-thickness:1px}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;text-wrap:balance;letter-spacing:-.005em}
p{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.ico{width:1.1em;height:1.1em;flex:none;display:inline-block;vertical-align:-.15em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Fields */
.field{display:flex;flex-direction:column;gap:6px}
.field>label,.label{font-size:14px;font-weight:600;color:var(--fg)}
.help{font-size:14px;color:var(--muted)}
input[type=text],input[type=date],input[type=time],input[type=number],textarea,select{
  font:inherit;font-size:16px;color:var(--fg);background:var(--surface);border:1px solid var(--ctl-line);border-radius:var(--r-s);
  padding:11px 12px;width:100%;min-width:0;min-height:48px}
textarea{resize:vertical;min-height:84px}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:600;font-size:16px;
  border-radius:var(--r-m);border:1px solid transparent;padding:12px 18px;min-height:48px;cursor:pointer;text-decoration:none}
.btn-primary{background:var(--accent);color:var(--accent-ink)}
.btn-primary:hover{background:var(--accent-strong)}
.btn-dark{background:var(--fg);color:var(--bg)}
.btn-ghost{background:transparent;border-color:var(--ctl-line);color:var(--fg)}
.btn-ghost:hover{background:var(--surface)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.6;cursor:progress}
.linkbtn{background:none;border:0;padding:10px 0;min-height:44px;font:inherit;font-size:15px;font-weight:600;color:var(--accent);cursor:pointer;text-align:left;display:inline-flex;align-items:center;gap:6px}

/* Stars (reviews) */
.stars{display:inline-flex;gap:2px;color:var(--yolk)}
.stars svg{width:16px;height:16px}
.stars .off{color:var(--line)}
.stars.meter{position:relative;display:inline-block;line-height:0}
.stars.meter .row{display:inline-flex;gap:2px;white-space:nowrap}
.stars.meter .row.on{position:absolute;left:0;top:0;overflow:hidden;color:var(--yolk)}
.stars.meter .row.off{color:var(--line)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}