:root { --ink:#17332a; --muted:#66766e; --green:#147a58; --green-dark:#0d5940; --cream:#f5f2e8; --paper:#fffdf8; --line:#d9ddd5; --red:#9b332d; --gold:#9b6a13; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif; }
a { color:var(--green-dark); text-underline-offset:3px; }
.site-header { min-height:76px; padding:14px clamp(18px,4vw,54px); display:flex; align-items:center; justify-content:space-between; gap:24px; color:white; background:#123f31; }
.brand { display:flex; align-items:center; gap:10px; color:white; text-decoration:none; }
.brand-logo { width:46px; height:46px; display:block; flex:0 0 auto; object-fit:contain; }
.brand-copy { display:grid; }
.brand-copy strong { font-family:Georgia,serif; font-size:1.45rem; }
.brand-copy > span { color:#c9ded5; font-size:.69rem; letter-spacing:.06em; text-transform:uppercase; }
nav { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
nav a,.link-button { padding:5px 0; border:0; color:white; background:none; font:inherit; font-size:.84rem; font-weight:700; cursor:pointer; text-decoration:none; }
nav form { margin:0; }
main { width:min(1180px,calc(100% - 28px)); margin:28px auto 70px; }
footer { padding:22px; color:var(--muted); font-size:.75rem; text-align:center; }
h1,h2 { margin:.15em 0 .45em; font-family:Georgia,serif; font-weight:500; }
h3 { margin:.15em 0 .45em; font-family:Georgia,serif; font-size:1.18rem; font-weight:500; }
h1 { font-size:clamp(2rem,5vw,3.5rem); }
h2 { font-size:1.45rem; }
p { line-height:1.55; }
.eyebrow { margin:0; color:var(--green); font-size:.7rem; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }
.hero { margin-bottom:18px; padding:28px; display:grid; grid-template-columns:1.25fr 1fr; align-items:end; gap:30px; border-radius:18px; background:#e7eee7; }
.hero p:last-child { color:var(--muted); }
.panel,.auth-card { margin-bottom:18px; padding:22px; border:1px solid var(--line); border-radius:16px; background:var(--paper); box-shadow:0 8px 24px rgba(19,54,42,.05); }
.auth-card { width:min(520px,100%); margin:8vh auto; }
.panel-heading { margin-bottom:16px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.panel-heading > span { color:var(--muted); font-size:.76rem; }
.search-row { display:grid; grid-template-columns:2fr 1fr .8fr auto; gap:12px; align-items:end; }
.form-grid { display:grid; grid-template-columns:repeat(3,minmax(150px,1fr)); gap:14px; align-items:end; }
.form-grid.one-column { grid-template-columns:1fr; }
label { display:grid; gap:6px; color:var(--muted); font-size:.69rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
input,select,textarea { width:100%; min-height:42px; padding:9px 11px; border:1px solid #bbc6be; border-radius:8px; color:var(--ink); background:white; font:inherit; font-size:.9rem; }
textarea { resize:vertical; }
input:focus,select:focus,textarea:focus { outline:3px solid rgba(20,122,88,.17); border-color:var(--green); }
.button { min-height:41px; padding:9px 15px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--green); border-radius:9px; font-weight:800; cursor:pointer; text-decoration:none; }
.button.primary { color:white; background:var(--green); }
.button.primary:hover { background:var(--green-dark); }
.button.ghost { color:var(--green-dark); background:white; }
.notice { margin-bottom:16px; padding:14px 17px; border-left:4px solid var(--green); border-radius:8px; background:#e1eee7; }
.notice.error { border-color:var(--red); color:#73231e; background:#f4dfdc; }
.notice.warning { border-color:var(--gold); background:#f5ead0; }
.source-handoff { margin:16px 0 0; display:flex; align-items:center; gap:12px; flex-wrap:wrap; color:var(--muted); font-size:.82rem; }
.source-handoff > span { flex-basis:100%; }
.guest-actions,.preview-next-step { display:flex; align-items:center; justify-content:space-between; gap:22px; }
.guest-actions p { margin-bottom:0; color:var(--muted); }
.guest-action-buttons { display:flex; flex:none; gap:10px; flex-wrap:wrap; }
.auth-alternative { margin:18px 0 0; color:var(--muted); font-size:.82rem; text-align:center; }
.preview-next-step { margin-top:18px; padding:15px; border-radius:10px; background:#edf6ef; }
.preview-next-step > div { display:grid; gap:4px; }
.preview-next-step span { color:var(--muted); font-size:.76rem; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; font-size:.82rem; }
th,td { padding:12px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
th { color:var(--muted); font-size:.67rem; text-transform:uppercase; letter-spacing:.05em; }
td strong,td small { display:block; }
td small { margin-top:4px; color:var(--muted); }
.number { text-align:right; white-space:nowrap; }
.empty,.empty-state { color:var(--muted); text-align:center; }
.history-list,.ingredient-list,.match-list { display:grid; gap:9px; }
.history-card { padding:12px; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:18px; border:1px solid var(--line); border-radius:10px; }
.history-card > div { display:grid; gap:3px; }
.history-card span { color:var(--muted); font-size:.72rem; }
.history-card.withdrawn { opacity:.62; }
.token-reveal { display:grid; gap:9px; }
.token-reveal code { padding:10px; overflow-wrap:anywhere; border-radius:6px; background:white; }
.setup-steps { padding-left:22px; color:var(--muted); line-height:1.65; }
.setup-secret { display:block; margin-top:6px; padding:10px; overflow-wrap:anywhere; border:1px solid var(--line); border-radius:7px; color:var(--ink); background:#f1f4ef; font-size:.9rem; letter-spacing:.08em; }
.recovery-codes { margin:18px 0; padding:15px; display:grid; grid-template-columns:1fr 1fr; gap:9px; border:1px solid var(--line); border-radius:10px; background:#f1f4ef; }
.recovery-codes code { text-align:center; letter-spacing:.08em; }
.recipe-layout { display:grid; grid-template-columns:260px 1fr; gap:18px; align-items:start; }
.basket-list { position:sticky; top:16px; display:grid; gap:8px; }
.basket-link { padding:11px; display:grid; gap:4px; border:1px solid var(--line); border-radius:9px; text-decoration:none; }
.basket-link.active { border-color:var(--green); background:#e9f2ec; }
.basket-link span { color:var(--muted); font-size:.72rem; }
.title-input { width:min(520px,100%); }
.title-input input { font-family:Georgia,serif; font-size:1.25rem; }
.ingredient-card { padding:15px; display:grid; gap:10px; border:1px solid var(--line); border-left:4px solid var(--green); border-radius:10px; }
.ingredient-card.pantry { opacity:.7; border-left-color:#87948e; }
.ingredient-heading { display:flex; justify-content:space-between; gap:16px; }
.check { display:flex; grid-auto-flow:column; align-items:center; justify-content:start; gap:6px; text-transform:none; letter-spacing:0; }
.check input { width:auto; min-height:0; }
.remove { color:var(--red); }
.match-list span { padding:8px 10px; border-radius:8px; background:#edf2ed; font-size:.78rem; }
.flipp-checklist { border-color:#b8cdbf; background:#f8fbf7; }
.flipp-checklist > p { color:var(--muted); }
.flipp-search-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.flipp-search-list > a { padding:12px 14px; display:flex; justify-content:space-between; align-items:center; gap:14px; border:1px solid var(--line); border-radius:10px; background:white; text-decoration:none; }
.flipp-search-list > a:hover { border-color:var(--green); box-shadow:0 4px 12px rgba(19,54,42,.08); }
.flipp-search-list span { min-width:0; display:grid; gap:3px; }
.flipp-search-list small { overflow:hidden; color:var(--muted); font-size:.7rem; text-overflow:ellipsis; white-space:nowrap; }
.flipp-search-list b { flex:none; font-size:.75rem; }
.archive-form { margin-top:18px; }
.form-note { margin:0; color:var(--muted); font-size:.78rem; }
.search-radius-help { margin-top:10px; }
.search-scope-note { margin:0 0 14px; padding:11px 13px; border-left:4px solid var(--green); border-radius:8px; color:var(--muted); background:#edf6ef; font-size:.8rem; }
.search-scope-note.warning { border-left-color:var(--gold); color:#6e4b0d; background:#fbf5e7; }
.purchase-history-card { margin-top:16px; padding:15px; display:grid; grid-template-columns:minmax(210px,.7fr) minmax(0,1.3fr); align-items:center; gap:20px; border:1px solid #d8c896; border-left:4px solid var(--gold); border-radius:10px; background:#fbf5e7; }
.purchase-history-card.personal { border-color:#9fc4b1; border-left-color:var(--green); background:#edf6ef; }
.purchase-history-card h3,.purchase-history-card p { margin:0; }
.purchase-history-card > p { color:var(--muted); font-size:.8rem; }
.basket-recommendations > p { color:var(--muted); }
.decision-card { margin:18px 0 24px; padding:20px; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr); gap:18px 28px; align-items:center; border:1px solid #9fc4b1; border-left:6px solid var(--green); border-radius:14px; background:#edf6ef; }
.decision-card.partial { border-color:#dec788; border-left-color:var(--gold); background:#fbf5e7; }
.decision-card p { margin:.35rem 0 0; color:var(--muted); }
.decision-card dl { margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.decision-card dl div { padding:9px 11px; border-radius:8px; background:rgba(255,255,255,.72); }
.decision-card dt { color:var(--muted); font-size:.61rem; font-weight:850; letter-spacing:.05em; text-transform:uppercase; }
.decision-card dd { margin:3px 0 0; font-weight:850; }
.decision-card form { grid-column:1/-1; }
.alternatives-heading { margin-top:8px; }
.recommendation-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.recommendation-card { padding:15px; display:grid; gap:12px; border:1px solid var(--line); border-left:4px solid var(--gold); border-radius:11px; background:#fff; }
.recommendation-card.complete { border-left-color:var(--green); }
.recommendation-heading { display:flex; justify-content:space-between; align-items:start; gap:14px; }
.recommendation-heading > div { display:grid; gap:4px; }
.recommendation-heading span,.recommendation-total span { color:var(--muted); font-size:.7rem; }
.recommendation-total { flex:none; text-align:right; }
.recommendation-total strong { font-size:1.15rem; }
.cost-adjustment,.missing-evidence { margin:0; font-size:.76rem; }
.estimate-range { margin:0; color:var(--muted); font-size:.74rem; }
.evidence-caution { margin:0; padding:7px 9px; border-radius:7px; color:#6e4b0d; background:#f5ead0; font-size:.74rem; }
.missing-evidence { color:var(--muted); }
.recommendation-card details { font-size:.76rem; }
.recommendation-card summary { color:var(--green-dark); font-weight:800; cursor:pointer; }
.recommendation-lines { margin-top:9px; display:grid; gap:8px; }
.recommendation-lines span { display:grid; gap:2px; }
.recommendation-lines em { color:var(--muted); font-size:.7rem; font-style:normal; }
.import-job-list { display:grid; gap:9px; }
.import-job { padding:12px; display:flex; align-items:center; justify-content:space-between; gap:16px; border:1px solid var(--line); border-left:4px solid #87948e; border-radius:9px; }
.import-job > div { min-width:0; display:grid; gap:4px; }
.import-job strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.import-job span,.import-job small { color:var(--muted); font-size:.72rem; }
.import-job.running { border-left-color:var(--gold); }
.import-job.succeeded { border-left-color:var(--green); }
.import-job.failed { border-left-color:var(--red); }
.import-job.failed small { color:var(--red); }
.two-column { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.compact-hero h1 { font-size:clamp(1.9rem,4vw,2.8rem); }
.receipt-upload-panel { display:grid; grid-template-columns:1.1fr .9fr; gap:26px; align-items:center; }
.receipt-upload-panel p { color:var(--muted); }
.reader-options { margin:0; padding:0; display:grid; gap:8px; border:0; }
.reader-options legend { margin-bottom:7px; color:var(--muted); font-size:.69rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.reader-option { padding:11px; display:flex; align-items:start; gap:9px; border:1px solid var(--line); border-radius:9px; color:var(--ink); text-transform:none; letter-spacing:0; cursor:pointer; }
.reader-option:has(input:checked) { border-color:var(--green); background:#edf6ef; }
.reader-option input,.consent-choice input { width:auto; min-height:0; margin-top:3px; }
.reader-option span { display:grid; gap:3px; }
.reader-option small { color:var(--muted); font-size:.72rem; font-weight:500; }
.consent-choice { padding:11px; display:flex; align-items:start; gap:9px; border:1px solid #d6ba78; border-radius:9px; color:#6e4b0d; background:#fbf5e7; font-weight:600; line-height:1.45; text-transform:none; letter-spacing:0; }
.receipt-review-form { display:grid; }
.receipt-review-list { display:grid; gap:12px; }
.receipt-review-item { padding:15px; display:grid; gap:12px; border:1px solid var(--line); border-left:4px solid var(--green); border-radius:10px; background:white; }
.receipt-review-item > p { margin:0; color:var(--muted); font-size:.72rem; }
.publish-choice { display:flex; align-items:center; gap:8px; color:var(--green-dark); font-size:.76rem; text-transform:none; letter-spacing:0; }
.publish-choice input { width:auto; min-height:0; }
.receipt-review-choices { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.reject-choice { display:flex; align-items:center; gap:8px; color:var(--red); font-size:.72rem; text-transform:none; letter-spacing:0; }
.reject-choice input { width:auto; min-height:0; }
.receipt-review-item.ocr-rejected { opacity:.62; border-left-color:var(--red); background:#fbf1ef; }
.missed-item-panel > p { color:var(--muted); font-size:.8rem; }
.missed-item-panel [data-add-missed-item] { margin-top:13px; }
.missed-receipt-item { border-left-color:var(--gold); }
.receipt-review-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; align-items:end; }
.receipt-publish-bar { position:sticky; bottom:10px; z-index:4; display:flex; align-items:center; justify-content:space-between; gap:20px; border-color:#9fc4b1; box-shadow:0 12px 30px rgba(19,54,42,.15); }
.receipt-publish-bar > div { display:grid; gap:4px; }
.receipt-publish-bar span { color:var(--muted); font-size:.75rem; }
.cancel-intake { margin:-8px 0 22px; text-align:right; }
.curation-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.alias-list { display:grid; gap:8px; }
.alias-row { padding:10px 12px; display:flex; justify-content:space-between; gap:14px; border:1px solid var(--line); border-radius:8px; background:white; }
.alias-row span { color:var(--muted); font-size:.72rem; }
.pilot-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.pilot-stat { padding:13px; display:grid; gap:4px; border:1px solid var(--line); border-radius:9px; background:white; }
.pilot-stat strong { font-size:1.15rem; }
.pilot-stat span { color:var(--muted); font-size:.68rem; }
.quality-window-grid { margin-top:16px; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.quality-window-card { padding:14px; border:1px solid var(--line); border-left:4px solid var(--green); border-radius:9px; background:white; }
.quality-window-card.attention { border-left-color:var(--gold); background:#fbf5e7; }
.quality-window-card > div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.quality-window-card span,.quality-window-card p,.quality-window-card li { color:var(--muted); font-size:.7rem; }
.quality-window-card dl { margin:12px 0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; }
.quality-window-card dl div { padding:7px; border-radius:7px; background:#f1f4ef; }
.quality-window-card dt { color:var(--muted); font-size:.58rem; font-weight:800; text-transform:uppercase; }
.quality-window-card dd { margin:2px 0 0; font-size:.82rem; font-weight:800; }
.trip-list { display:grid; gap:10px; }
.trip-card { padding:14px; display:grid; grid-template-columns:minmax(220px,1fr) minmax(320px,1.25fr); align-items:center; gap:18px; border:1px solid var(--line); border-left:4px solid var(--gold); border-radius:10px; background:white; }
.trip-card.verified { border-left-color:var(--green); }
.trip-card > div { display:grid; gap:4px; }
.trip-card span { color:var(--muted); font-size:.73rem; }
.trip-card form { display:grid; grid-template-columns:1fr 1fr auto; gap:9px; align-items:end; }
.trip-result { text-align:right; }
@media (max-width:780px) { .site-header,.hero { align-items:start; flex-direction:column; grid-template-columns:1fr; } .site-header { display:flex; } nav { gap:13px; } .search-row,.form-grid,.recipe-layout,.two-column,.flipp-search-list,.recovery-codes,.recommendation-grid,.decision-card,.trip-card,.trip-card form,.receipt-upload-panel,.curation-grid,.quality-window-grid,.purchase-history-card { grid-template-columns:1fr; } .guest-actions,.preview-next-step { align-items:stretch; flex-direction:column; } .receipt-review-grid,.pilot-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .quality-window-card dl { grid-template-columns:repeat(3,minmax(0,1fr)); } .receipt-publish-bar { position:static; align-items:stretch; flex-direction:column; } .basket-list { position:static; } .history-card { grid-template-columns:1fr auto; } .history-card form { grid-column:1/-1; } .panel { padding:16px; } .recommendation-heading { align-items:stretch; flex-direction:column; } .recommendation-total,.trip-result { text-align:left; } }
@media (max-width:480px) { .receipt-review-grid,.pilot-stats { grid-template-columns:1fr; } }