:root{
  --bg:#f7f6f2; --card:#ffffff; --ink:#1c1a16; --muted:#5f5b52; --line:#dedad0;
  --sauce:#b23a12; --sauce-soft:#f7e4da; --said:#2d6a3a; --said-soft:#e2f0e4;
  --guess:#8a5a00; --guess-soft:#f8ecd2; --old:#5a5f6b; --old-soft:#e7e9ee;
  --font:"Atkinson Hyperlegible","Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#121110; --card:#1c1b19; --ink:#f2efe8; --muted:#aaa598; --line:#36332e;
    --sauce:#ff8558; --sauce-soft:#3a2118; --said:#7ccc8a; --said-soft:#1d3322;
    --guess:#e7b85a; --guess-soft:#3a2e14; --old:#aab0bc; --old-soft:#2a2d33; color-scheme:dark; }
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.5}
.wrap{max-width:760px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.banner{background:var(--sauce-soft);color:var(--ink);text-align:center;padding:8px 16px;font-size:14px;border-bottom:1px solid var(--line)}
main{padding-block:28px 40px;display:flex;flex-direction:column;gap:20px}
h1{font-size:clamp(28px,5vw,40px);line-height:1.15;margin:0;text-wrap:balance}
h2{font-size:24px;margin:0;text-wrap:balance}
h3{font-size:18px;margin:0}
p{margin:0}
.lead{font-size:19px;color:var(--muted)}
.muted{color:var(--muted)}
.small{font-size:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:14px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.stack{display:flex;flex-direction:column;gap:10px}
label{font-weight:700}
.field{display:flex;flex-direction:column;gap:6px}
.hint{font-weight:400;color:var(--muted);font-size:14px}
input[type=text],input[type=email],input[type=number],textarea,select{
  font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%}
textarea{min-height:96px;resize:vertical}
input:focus,textarea:focus,select:focus,button:focus-visible{outline:3px solid var(--sauce);outline-offset:1px}
button{font:inherit;font-weight:700;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:10px 16px;min-height:44px;cursor:pointer}
button.primary{background:var(--sauce);border-color:var(--sauce);color:#fff}
button.link{border:none;background:none;color:var(--sauce);padding:4px 0;min-height:auto;text-decoration:underline}
button:disabled{opacity:.45;cursor:default}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:6px 12px;background:var(--bg);font-weight:400;cursor:pointer}
.chip input{margin:0}
.chip.on{border-color:var(--sauce);background:var(--sauce-soft)}
.progress{display:flex;gap:6px}
.progress span{flex:1;height:6px;border-radius:3px;background:var(--line)}
.progress span.done{background:var(--sauce)}
.badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;border-radius:999px;padding:2px 8px;white-space:nowrap}
.b-said{background:var(--said-soft);color:var(--said)}
.b-inferred{background:var(--guess-soft);color:var(--guess)}
.b-outdated{background:var(--old-soft);color:var(--old)}
.item{display:grid;grid-template-columns:1fr;gap:8px;align-items:start;border-top:1px solid var(--line);padding-top:10px}
.item:first-of-type{border-top:none;padding-top:0}
.item input[type=text]{min-width:0}
.item .controls{display:flex;gap:6px;align-items:center;justify-content:flex-start}
.item textarea{min-height:0;resize:vertical}
@media (min-width:700px){.item{grid-template-columns:1fr auto}}
.item select{width:auto;padding:6px 8px;font-size:14px}
.memline{display:grid;grid-template-columns:1fr;gap:8px;align-items:center;padding:6px 0;border-top:1px dashed var(--line)}
.memline.removed span{text-decoration:line-through;color:var(--muted)}
.prompt{white-space:pre-wrap;background:var(--bg);border:1px dashed var(--line);border-radius:10px;padding:12px;font-size:14px;max-height:220px;overflow:auto}
.recipe{white-space:pre-wrap;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:16px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px;line-height:1.55;overflow-x:auto}
.diff{display:grid;gap:8px}
.diff .add{border-left:4px solid var(--said);padding-left:10px}
.diff .rem{border-left:4px solid var(--old);padding-left:10px;color:var(--muted);text-decoration:line-through}
.offer{border:2px solid var(--sauce)}
.notice{background:var(--guess-soft);border-radius:10px;padding:10px 12px;font-size:15px}
.foot{padding-block:0 40px;color:var(--muted);font-size:14px}
@media print{
  .banner,.foot,.no-print{display:none!important}
  body{background:#fff;color:#000}
  .card{border:none;padding:0}
  .recipe{border:none;background:#fff;color:#000;white-space:pre-wrap;font-size:11pt}
}

@media (min-width:700px){.memline{grid-template-columns:1fr auto}}
.memline select{width:auto}