:root { --ink:#2a2320; --muted:#7a6f69; --line:#e6dfd9; --bg:#faf7f4; --rose:#b8466a; --ok:#2f7d4f; --warn:#a86a00; --bad:#a3261c; }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; color:var(--ink); background:var(--bg); }
.bar { display:flex; align-items:center; gap:1.5rem; padding:.7rem 1.5rem; background:#fff; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.brand { font-weight:700; color:var(--ink); text-decoration:none; display:flex; align-items:center; gap:.5rem; }
.mark { background:var(--rose); color:#fff; border-radius:8px; padding:.15rem .4rem; font-size:.8rem; }
nav { display:flex; gap:1.1rem; } nav a { color:var(--ink); text-decoration:none; } nav a:hover { color:var(--rose); }
.signout { margin-left:auto; display:flex; gap:.6rem; align-items:center; color:var(--muted); font-size:.9rem; }
main { max-width:1200px; margin:0 auto; padding:1.5rem; }
h1 { font-size:1.6rem; margin:.2rem 0 1rem; } h2 { font-size:1.1rem; margin:1.4rem 0 .5rem; } h2:first-child { margin-top:0; }
.heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.card { background:#fff; border:1px solid var(--line); border-radius:12px; padding:1.2rem 1.4rem; margin-bottom:1.2rem; }
.narrow { max-width:32rem; }
.split { display:grid; grid-template-columns: minmax(280px, 5fr) 7fr; gap:1.2rem; align-items:start; }
@media (max-width: 900px) { .split { grid-template-columns:1fr; } }
.photos { position:sticky; top:1rem; } .photos img { width:100%; border-radius:8px; border:1px solid var(--line); cursor:zoom-in; }
figure { margin:0 0 1rem; } figcaption { display:flex; gap:.8rem; align-items:center; margin-top:.3rem; flex-wrap:wrap; }
label { display:block; margin:.5rem 0; font-weight:600; font-size:.92rem; }
input, textarea, select { width:100%; font:inherit; padding:.5rem .6rem; border:1px solid #d6ccc4; border-radius:8px; background:#fff; margin-top:.2rem; }
textarea { font-family: ui-monospace, Menlo, monospace; font-size:.9rem; }
input[type=checkbox], input[type=radio] { width:auto; margin:0 .4rem 0 0; }
.check { font-weight:400; display:flex; align-items:flex-start; gap:.2rem; }
.check.suggested { background:#fff4d6; border-radius:6px; padding:0 .3rem; }
.check.confirm { background:#fff4d6; padding:.6rem; border-radius:8px; font-weight:600; }
.grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:0 1rem; }
.row { display:grid; grid-template-columns:2fr 1fr; gap:1rem; }
button, .button { font:inherit; padding:.5rem .9rem; border-radius:8px; border:1px solid #cbbfb6; background:#fff; color:var(--ink); cursor:pointer; text-decoration:none; display:inline-block; }
button:hover, .button:hover { border-color:var(--rose); }
.primary { background:var(--rose); border-color:var(--rose); color:#fff; font-weight:600; }
.primary:hover { filter:brightness(1.07); }
button.link { border:none; background:none; padding:0; color:var(--muted); text-decoration:underline; }
.actions { display:flex; gap:.8rem; margin-top:1rem; flex-wrap:wrap; }
.flash { padding:.7rem 1rem; border-radius:8px; margin:0 0 1rem; }
.flash.error { background:#fdecea; color:var(--bad); } .flash.info { background:#eef4fb; color:#1f4f82; } .flash.success { background:#e8f5ec; color:var(--ok); }
.issues { list-style:none; padding:0; margin:.5rem 0; } .issues li { padding:.5rem .7rem; border-radius:8px; margin-bottom:.4rem; font-size:.92rem; }
.issues .block { background:#fdecea; color:var(--bad); } .issues .confirm { background:#fff4d6; color:#6b4a00; } .issues .info { background:#eef4fb; color:#1f4f82; }
.ok-text { color:var(--ok); font-weight:600; }
.tag { display:inline-block; font-size:.75rem; padding:.1rem .45rem; border-radius:999px; background:#eee; color:#555; font-weight:600; vertical-align:middle; }
.tag.ok { background:#e2f3e8; color:var(--ok); } .tag.warn { background:#fff0cc; color:var(--warn); }
table.list, table.plain { width:100%; border-collapse:collapse; background:#fff; }
table.list th, table.list td { text-align:left; padding:.55rem .6rem; border-bottom:1px solid var(--line); }
table.list th { font-size:.8rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); }
table.plain td { padding:.3rem .5rem .3rem 0; vertical-align:top; }
.qty { width:6rem; } td.w { color:var(--muted); white-space:nowrap; }
.search { max-width:22rem; margin-bottom:.8rem; }
.total { font-size:1.05rem; }
.hint { color:var(--muted); font-size:.85rem; font-weight:400; }
.declaration { background:var(--bg); border:1px dashed var(--line); padding:.6rem .8rem; border-radius:8px; }
.declaration strong { text-transform:uppercase; }
.label-mock { max-width:384px; margin:0 auto; min-height:576px; background:#fff; border:1px solid #bbb; box-shadow:0 2px 8px rgba(0,0,0,.08); padding:15px; font:12px/1.25 Helvetica, Arial, sans-serif; color:#000; }
.label-mock p { margin:.45em 0; }
.lm-brand { text-align:center; font-weight:700; font-size:17px; }
.lm-product { text-align:center; font-weight:700; font-size:15px; margin-top:3px; }
.lm-centre { text-align:center; }
.lm-ingredients strong { text-transform:uppercase; }
.lm-box { border:1.5px solid #000; padding:4px 6px; font-weight:700; margin:.6em 0; }
.extraction { background:var(--bg); border-radius:8px; padding:.4rem .8rem; margin-top:1rem; font-size:.9rem; }
details summary { cursor:pointer; color:var(--rose); margin-top:.6rem; }
code { background:#f3eee9; padding:0 .25rem; border-radius:4px; }
.exception { background:#fff8e8; border:1px solid #f0dfb0; border-radius:8px; padding:.4rem .8rem; margin:.5rem 0; }
.exception.recorded { background:#eef4fb; border-color:#cddcee; }
.nutrition label { display:block; }
.nutrition input { display:block; max-width:9rem; }
.exception summary { color:var(--muted); margin:0; }
details.exception[open] summary { color:var(--ink); font-weight:600; margin-bottom:.4rem; }
fieldset.nutrition-choice { border:1px solid var(--line); border-radius:8px; margin:.8rem 0; padding:.4rem .9rem .6rem; }
.lm-nutrition { width:100%; border:1.2px solid #000; border-collapse:collapse; margin:.5em 0; font-size:11px; }
.lm-nutrition th, .lm-nutrition td { text-align:left; padding:1px 4px; }
.lm-nutrition th { border-bottom:1px solid #000; }
.lm-note { font-style:italic; color:#555; }
.exception.decision { background:#fdecea; border-color:#f3c4bf; }
details.earlier { margin-top:1rem; }
.tag.no { background:#fdecea; color:var(--bad); }
.diet-tags .tag { margin-right:.15rem; }
tr.ineligible td { color:#aaa; }
tr.ineligible .diet-reason { display:inline-block; }
.row4 { display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:0 1rem; }