:root{
    --bg:#fbfaf7; --surface:#ffffff; --surface2:#f3efe7; --ink:#1c1917; --ink2:#5c554d;
    --line:#e3ddd2; --accent:#9a3412; --accent-ink:#ffffff; --green:#3f6212; --green-soft:#eef3d8;
    --gold:#92600a; --gold-soft:#fbf0d3; --accent-soft:#fbe9dd;
    --chip:#f3efe7; --warn:#92600a; --shadow:0 1px 2px rgba(28,25,23,.06),0 4px 14px rgba(28,25,23,.05);
  }
  @media (prefers-color-scheme: dark){
    :root{
      --bg:#171412; --surface:#211d1a; --surface2:#292420; --ink:#f3ede4; --ink2:#b8ada0;
      --line:#3a342e; --accent:#f08c4a; --accent-ink:#241105; --green:#a3c96a; --green-soft:#2c3816;
      --gold:#e3b34e; --gold-soft:#3a2f10; --accent-soft:#3d2413;
      --chip:#292420; --warn:#e3b34e; --shadow:0 1px 2px rgba(0,0,0,.35),0 4px 14px rgba(0,0,0,.3);
    }
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{margin:0;background:var(--bg);color:var(--ink);
    font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    font-size:16px;line-height:1.45}
  h1,h2,h3,.serif{font-family:"Iowan Old Style",Palatino,"Palatino Linotype",Georgia,serif}
  button{font:inherit;cursor:pointer}
  input,select{font:inherit;color:var(--ink)}
  a{color:var(--accent)}
  .wrap{max-width:1180px;margin:0 auto;padding:0 14px 40px}

  /* Compact header */
  header{padding:14px 0 10px;border-bottom:2px solid var(--accent)}
  .htop{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
  h1{font-size:27px;margin:0;letter-spacing:.2px}
  .tagline{color:var(--ink2);font-size:14px;margin:0}
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
  .stat{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:7px 10px;box-shadow:var(--shadow)}
  .stat b{display:block;font-size:18px;line-height:1.1}
  .stat span{font-size:12px;color:var(--ink2)}
  @media(max-width:560px){ .stats{grid-template-columns:repeat(2,1fr)} h1{font-size:23px} }
  @media(max-width:560px){ .filters .field{flex:1 1 100%} }

  /* Tabs */
  nav.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 4px}
  nav.tabs button{border:1px solid var(--line);background:var(--surface);color:var(--ink);
    border-radius:999px;padding:8px 14px;font-weight:600}
  nav.tabs button[aria-selected="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  nav.tabs .count{font-weight:400;opacity:.85;font-size:13px}

  /* Filters — normal flow, scrolls away */
  .filters{background:var(--surface);border:1px solid var(--line);border-radius:10px;
    padding:12px;margin:10px 0 14px;box-shadow:var(--shadow)}
  .frow{display:flex;flex-wrap:wrap;gap:8px}
  .frow + .frow{margin-top:8px}
  .field{display:flex;flex-direction:column;gap:3px;flex:1 1 150px;min-width:0}
  .field.grow2{flex:2 1 220px}
  .field label{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink2)}
  .field input,.field select{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:7px;background:var(--bg)}
  .shelves{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
  .shelves button{border:1px solid var(--line);background:var(--chip);color:var(--ink);
    border-radius:999px;padding:6px 12px;font-size:14px}
  .shelves button[aria-pressed="true"]{background:var(--green);color:#fff;border-color:var(--green)}
  @media (prefers-color-scheme: dark){ .shelves button[aria-pressed="true"]{color:#141a10} }
  .note{font-size:13px;color:var(--warn);margin:8px 0 0}
  .resultsbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;margin:4px 0 10px}
  .resultsbar p{margin:0;color:var(--ink2);font-size:14px}
  .resultsbar select{padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--surface)}
  .clearbtn{background:none;border:1px solid var(--line);border-radius:7px;padding:7px 12px;color:var(--ink)}

  /* Cards */
  .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
  @media(max-width:560px){ .grid{grid-template-columns:1fr} }
  .card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;box-shadow:var(--shadow);
    display:flex;flex-direction:column;gap:8px;min-width:0}
  .card h3{margin:0;font-size:19px;line-height:1.25;overflow-wrap:anywhere}
  .desc{margin:0;color:var(--ink2);font-size:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .chips{display:flex;flex-wrap:wrap;gap:5px}
  .chip{background:var(--chip);border-radius:999px;padding:2px 9px;font-size:12.5px;color:var(--ink)}
  .chip.diet{background:var(--green-soft)}
  .pairs{font-size:13.5px;color:var(--ink2);margin:0}
  .pairs button{background:none;border:none;padding:0;color:var(--accent);text-decoration:underline;font-size:13.5px}
  .source{font-size:13px;color:var(--ink2);margin:0}
  .cardactions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:auto}
  .cardactions button{border:1px solid var(--line);background:var(--surface2);color:var(--ink);
    border-radius:8px;padding:9px 6px;font-weight:600;font-size:14.5px}
  .cardactions button.faved{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .cardactions .wide{grid-column:1 / -1;background:var(--green);color:#fff;border-color:var(--green)}
  @media (prefers-color-scheme: dark){ .cardactions .wide{color:#141a10} }
  .detail{border-top:1px dashed var(--line);padding-top:10px}
  .detail h4{margin:10px 0 5px;font-size:15px}
  .detail ul,.detail ol{margin:4px 0 8px;padding-left:22px}
  .detail li{margin:3px 0;overflow-wrap:anywhere}
  .scaler{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--surface2);
    border-radius:8px;padding:8px 10px}
  .scaler button{width:38px;height:38px;border-radius:8px;border:1px solid var(--line);background:var(--surface);
    color:var(--ink);font-size:19px;font-weight:700}
  .nutri{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:6px;margin-top:4px}
  .nutri div{background:var(--surface2);border-radius:7px;padding:6px 9px;font-size:13px}
  .nutri b{display:block;font-size:14.5px}
  .more{display:block;margin:18px auto 0;background:var(--accent);color:var(--accent-ink);border:none;
    border-radius:9px;padding:12px 26px;font-weight:700}
  .empty{background:var(--surface);border:1px dashed var(--line);border-radius:10px;padding:22px;text-align:center;color:var(--ink2)}

  /* Planner */
  .planner{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}
  .day{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:11px;box-shadow:var(--shadow);min-width:0}
  .day h3{margin:0 0 8px;font-size:16.5px;border-bottom:1px solid var(--line);padding-bottom:6px}
  .day ul{list-style:none;margin:0;padding:0}
  .day li{display:flex;gap:7px;align-items:flex-start;padding:6px 0;border-bottom:1px dotted var(--line);font-size:14.5px}
  .day li:last-child{border-bottom:none}
  .day .meal{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--green);white-space:nowrap;padding-top:2px}
  .day .x{margin-left:auto;background:none;border:none;color:var(--accent);font-size:17px;line-height:1;padding:2px 4px}
  .day .none{color:var(--ink2);font-size:14px}

  /* Collections + shopping */
  .panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;box-shadow:var(--shadow);margin-bottom:12px}
  .panel h2{margin:0 0 8px;font-size:20px}
  .panel h3{margin:12px 0 6px;font-size:16.5px}
  .inlineform{display:flex;gap:8px;flex-wrap:wrap}
  .inlineform input{flex:1 1 200px;padding:9px 10px;border:1px solid var(--line);border-radius:7px;background:var(--bg)}
  .inlineform select{flex:1 1 200px;padding:9px 10px;border:1px solid var(--line);border-radius:7px;background:var(--bg)}
  .primary{background:var(--accent);color:var(--accent-ink);border:none;border-radius:8px;padding:10px 16px;font-weight:700}
  .ghost{background:var(--surface2);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:9px 14px;font-weight:600}
  .collist{list-style:none;margin:6px 0;padding:0}
  .collist li{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:7px 0;border-bottom:1px dotted var(--line);font-size:15px}
  .collist .x{background:none;border:none;color:var(--accent);font-size:16px}
  .shopitems{list-style:none;margin:8px 0;padding:0;columns:2;column-gap:28px}
  @media(max-width:640px){ .shopitems{columns:1} }
  .shopitems li{padding:6px 0 6px 26px;position:relative;border-bottom:1px dotted var(--line);break-inside:avoid;font-size:15px}
  .shopitems li::before{content:"";position:absolute;left:2px;top:10px;width:13px;height:13px;
    border:1.5px solid var(--ink2);border-radius:3px}
  .shopitems .n{color:var(--ink2);font-size:13px}

  /* Dialog / sheet */
  .overlay{position:fixed;inset:0;background:rgba(15,12,6,.55);display:none;z-index:50}
  .overlay.open{display:block}
  .sheet{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:51;display:none;
    background:var(--surface);color:var(--ink);border-radius:12px;border:1px solid var(--line);
    width:min(480px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;padding:18px;box-shadow:0 12px 40px rgba(0,0,0,.35)}
  .sheet.open{display:block}
  @media(max-width:560px){
    .sheet{left:0;right:0;bottom:0;top:auto;transform:none;width:auto;border-radius:14px 14px 0 0;
      max-height:86dvh;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
  }
  .sheet h2{margin:0 0 4px;font-size:19px;padding-right:34px}
  .sheet .sub{color:var(--ink2);font-size:14px;margin:0 0 12px}
  .sheet .close{position:absolute;top:10px;right:12px;background:none;border:none;font-size:24px;color:var(--ink);padding:4px 8px}
  .sheet label{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink2);display:block;margin:10px 0 4px}
  .sheet select,.sheet input{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--bg)}
  .sheet .row{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
  .sheet .row button{flex:1 1 140px}
  .daygrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
  .daygrid button{border:1px solid var(--line);background:var(--surface2);color:var(--ink);border-radius:8px;padding:9px 2px;font-weight:600}
  .daygrid button.sel{background:var(--green);color:#fff;border-color:var(--green)}
  @media (prefers-color-scheme: dark){ .daygrid button.sel{color:#141a10} }

  footer{margin-top:34px;border-top:1px solid var(--line);padding:16px 0 8px;color:var(--ink2);font-size:14px}
  footer p{margin:5px 0}
  .hidden{display:none !important}
  @media (prefers-reduced-motion: reduce){ *{transition:none !important;animation:none !important} }

  /* Quick taps */
  .quickrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}
  .quickrow .qlabel{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink2);margin-right:2px}
  .quickrow button{border:1px solid var(--line);background:var(--surface);color:var(--ink);
    border-radius:999px;padding:6px 12px;font-size:14px}
  .quickrow button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .quickrow button.qbtn{background:var(--chip)}
  .quickrow button.qbtn[aria-pressed="true"]{background:var(--green);color:#fff;border-color:var(--green)}
  @media (prefers-color-scheme: dark){ .quickrow button.qbtn[aria-pressed="true"]{color:#141a10} }
  .chip.health{background:var(--surface2);border:1px dashed var(--green)}
  fieldset.shelfset{border:none;margin:10px 0 0;padding:0}
  fieldset.shelfset legend{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink2);padding:0;margin-bottom:6px}
  .shelves{margin-top:0}

  /* Planner toolbar + print sheet */
  .plantools{display:flex;gap:8px;flex-wrap:wrap}
  .printsheet{display:none}
  body.printing .wrap{display:none}
  body.printing .printsheet{display:block;max-width:820px;margin:0 auto;padding:24px 16px 40px}
  .printsheet h2{font-size:24px;margin:0 0 2px}
  .printsheet .psub{color:var(--ink2);margin:0 0 16px;font-size:14px}
  .printsheet h3{font-size:17px;margin:18px 0 6px;border-bottom:2px solid var(--ink);padding-bottom:4px}
  .printsheet ul{list-style:none;margin:0;padding:0}
  .printsheet li{padding:5px 0;border-bottom:1px dotted var(--line);font-size:15px}
  .printsheet .meal{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--green);margin-right:8px}
  .printsheet .none{color:var(--ink2)}
  .printsheet .pback{margin-top:22px}
  @media print{
    body{background:#fff;color:#000}
    body:not(.printing) .wrap{display:block}
    .printsheet{display:none}
    body.printing .printsheet{display:block;max-width:none;padding:0}
    body.printing .pback{display:none}
  }
  /* ================= Redesign 2026-10-30 — matched to the Recipe Index app =================
     Spice ribbon, sticky Jump-to navigation, illustrated hero header,
     color-coded stat cards, Explore-by-cuisine tiles, the search panel
     as a colorful card, color-coded section headings, and the large
     recipe reader window. Layers on top of the base styles above. */
  :root{
    --teal:#0f766e; --teal-soft:#ccfbf1;
    --berry:#be123c; --berry-soft:#ffe4e6;
    --leaf:#15803d; --leaf-soft:#dcfce7;
    --navy:#1e40af; --navy-soft:#dbeafe;
    --saffron:#b45309; --saffron-soft:#fef3c7;
    --cyan:#0e7490; --cyan-soft:#cffafe;
  }
  @media (prefers-color-scheme: dark){
    :root{
      --teal:#2dd4bf; --teal-soft:#134e4a;
      --berry:#fb7185; --berry-soft:#4c0519;
      --leaf:#4ade80; --leaf-soft:#14532d;
      --navy:#93c5fd; --navy-soft:#1e3a8a;
      --saffron:#fbbf24; --saffron-soft:#451a03;
      --cyan:#22d3ee; --cyan-soft:#164e63;
    }
  }

  /* ---------- Spice ribbon + sticky Jump-to navigation ---------- */
  .spice-ribbon{height:9px;border-radius:0 0 6px 6px;
    background:linear-gradient(90deg,#be123c 0 14.3%,#c2410c 14.3% 28.6%,#b45309 28.6% 42.9%,#15803d 42.9% 57.2%,#0f766e 57.2% 71.5%,#0284c7 71.5% 85.8%,#1e40af 85.8% 100%)}
  .topnav{position:sticky;top:0;z-index:30;display:flex;flex-wrap:wrap;gap:7px;align-items:center;
    padding:10px 0 9px;background:var(--bg);border-bottom:1px solid var(--line)}
  .topnav-lbl{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-right:2px}
  .nav-pill{min-height:40px;padding:8px 15px;border-radius:999px;border:1.5px solid var(--line);
    background:var(--surface);color:var(--ink);font-size:14.5px;font-weight:700}
  .nav-pill:active{transform:translateY(1px)}
  .nav-search{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
  .nav-cuisines{background:var(--teal-soft);border-color:var(--teal);color:var(--teal)}
  .nav-results{background:var(--saffron-soft);border-color:var(--saffron);color:var(--saffron)}
  .nav-favorites{background:var(--berry-soft);border-color:var(--berry);color:var(--berry)}
  .nav-week{background:var(--leaf-soft);border-color:var(--leaf);color:var(--leaf)}
  .nav-top{background:var(--ink);border-color:var(--ink);color:var(--bg);margin-left:auto}
  @media (prefers-color-scheme: dark){
    .nav-search,.nav-cuisines,.nav-results,.nav-favorites,.nav-week{color:var(--ink)}
    .nav-top{color:#171412}
  }

  /* ---------- Header & hero ---------- */
  header.ri-header{margin-top:14px;padding:24px 20px 20px;background:var(--surface);
    border:1px solid var(--line);border-bottom:3px solid var(--accent);border-radius:20px;box-shadow:var(--shadow)}
  .kicker{display:inline-block;background:var(--accent);color:var(--accent-ink);padding:5px 12px;
    border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:0 0 8px}
  header.ri-header h1{font-size:clamp(34px,7vw,52px);line-height:1.05;margin:0 0 10px}
  .lede{margin:0 0 16px;color:var(--ink2);font-size:17px;max-width:62ch}
  .nutrition-disclaimer{margin:0 0 16px;padding:12px 14px;background:var(--gold-soft);border:1px solid var(--gold);border-radius:10px;color:var(--ink);font-size:14.5px;line-height:1.55;max-width:75ch}
  .nutri-src{font-size:12.5px;color:var(--ink2);font-style:italic;margin:6px 0 0}
  .hero-img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--line);margin:4px 0 18px}
  .stats{grid-template-columns:repeat(5,1fr);margin-top:0}
  .stat{border-top:4px solid var(--accent);border-radius:14px;padding:10px 14px}
  .stat b{font-family:"Iowan Old Style",Palatino,"Palatino Linotype",Georgia,serif;font-size:26px}
  .stat span{font-size:12.5px;font-weight:600}
  .stats .stat:nth-child(2){border-top-color:var(--teal)}
  .stats .stat:nth-child(3){border-top-color:var(--gold)}
  .stats .stat:nth-child(4){border-top-color:var(--berry)}
  .stats .stat:nth-child(5){border-top-color:var(--leaf)}
  .stat.dessert b{color:var(--gold)}
  .progress{margin:14px 0 2px}
  .progress .bar{height:8px;background:var(--surface2);border:1px solid var(--line);border-radius:99px;overflow:hidden}
  .progress .fill{height:100%;background:var(--accent);border-radius:99px;min-width:4px}
  .progress p{margin:6px 0 0;font-size:13px;color:var(--ink2)}
  .progress p strong{color:var(--ink)}
  .loadbar{margin:2px 0 12px}
  .loadbar-track{height:8px;background:var(--surface2);border:1px solid var(--line);border-radius:99px;overflow:hidden}
  .loadbar-fill{height:100%;background:var(--accent);border-radius:99px;width:0;transition:width .3s ease}
  .loadbar p{margin:6px 0 0;font-size:13px;color:var(--ink2)}
  @media (prefers-reduced-motion: reduce){ .loadbar-fill{transition:none} }

  /* ---------- Explore by cuisine tiles ---------- */
  .cuisine-section{margin-top:26px;scroll-margin-top:84px}
  .cuisine-section h2{font-size:28px;margin:0}
  .cuisine-sub{margin:4px 0 0;font-size:15px;color:var(--ink2)}
  .cuisine-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
  @media(min-width:760px){ .cuisine-grid{grid-template-columns:repeat(4,minmax(0,1fr))} }
  .cuisine-tile{--ct:var(--accent);display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;
    min-height:104px;padding:14px 15px 12px;border-radius:16px;border:2px solid var(--ct);border-top-width:7px;
    background:var(--surface);color:var(--ink);box-shadow:var(--shadow);min-width:0}
  .cuisine-tile .ct-name{font-family:"Iowan Old Style",Palatino,"Palatino Linotype",Georgia,serif;
    font-size:21px;font-weight:700;line-height:1.15;color:var(--ct);overflow-wrap:anywhere}
  .cuisine-tile .ct-count{font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink2)}
  .cuisine-tile .ct-blurb{font-size:13.5px;line-height:1.4;color:var(--ink2)}
  .cuisine-tile.on{background:var(--ct);border-color:var(--ct)}
  .cuisine-tile.on .ct-name,.cuisine-tile.on .ct-count,.cuisine-tile.on .ct-blurb{color:#fff}
  .ct-haitian{--ct:#be123c} .ct-trinidadian{--ct:#c2410c} .ct-cuban{--ct:#0f766e}
  .ct-puertorican{--ct:#0284c7} .ct-jamaican{--ct:#15803d} .ct-italian{--ct:#b45309}
  .ct-french{--ct:#1e40af} .ct-seafood{--ct:#0e7490} .ct-hawaiian{--ct:#db2777} .ct-korean{--ct:#b42318}
  .ct-japanese{--ct:#9d174d} .ct-indian{--ct:#c2410c} .ct-bbq{--ct:#7c2d12}
  .ct-cajun{--ct:#166534} .ct-thai{--ct:#6d28d9} .ct-pizza{--ct:#b91c1c}
  @media (prefers-color-scheme: dark){
    .ct-haitian{--ct:#fb7185} .ct-trinidadian{--ct:#fb923c} .ct-cuban{--ct:#2dd4bf}
    .ct-puertorican{--ct:#38bdf8} .ct-jamaican{--ct:#4ade80} .ct-italian{--ct:#fbbf24}
    .ct-french{--ct:#93c5fd} .ct-seafood{--ct:#22d3ee} .ct-hawaiian{--ct:#f472b6} .ct-korean{--ct:#fca5a5}
    .ct-japanese{--ct:#f9a8d4} .ct-indian{--ct:#fdba74} .ct-bbq{--ct:#fca5a5}
    .ct-cajun{--ct:#86efac} .ct-thai{--ct:#c4b5fd} .ct-pizza{--ct:#fca5a5}
    .cuisine-tile.on .ct-name,.cuisine-tile.on .ct-count,.cuisine-tile.on .ct-blurb{color:#171412}
  }

  /* ---------- Search panel as a colorful card ---------- */
  .filters{margin-top:26px;background:var(--surface);border:1px solid var(--line);border-top:5px solid var(--teal);
    border-radius:18px;box-shadow:var(--shadow);padding:18px 18px 14px;scroll-margin-top:84px}
  .filters-title{color:var(--teal);font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 12px;
    font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700}
  .chip.health{background:var(--teal-soft);color:var(--teal);border:1px solid transparent}
  #resultsAnchor{scroll-margin-top:84px}

  /* ---------- Color-coded section headings ---------- */
  .viewtitle{font-size:26px;margin:16px 0 10px}
  .vt-fav{color:var(--berry)}
  .vt-week{color:var(--leaf)}
  #view-collections .panel h2{color:var(--berry)}
  #view-shopping .panel h2{color:var(--leaf)}
  .day h3{color:var(--leaf)}

  /* ---------- Cards ---------- */
  .card{border-top:4px solid var(--accent-soft);border-radius:14px}
  .source{font-size:14px;font-weight:600;color:var(--accent)}
  .chip.cuisine{background:var(--accent-soft);color:var(--accent)}
  .chip.main{background:var(--green-soft);color:var(--green)}
  .topbtn{background:var(--surface);color:var(--accent);border:1.5px solid var(--accent);
    border-radius:999px;padding:9px 16px;font-weight:700}

  /* ---------- Recipe reader window ---------- */
  .reader-backdrop{position:fixed;inset:0;z-index:60;background:rgba(20,16,12,.62);display:none;
    align-items:center;justify-content:center;padding:18px}
  .reader-backdrop.open{display:flex}
  .reader{background:var(--surface);color:var(--ink);width:100%;max-width:920px;height:min(92dvh,1000px);
    max-height:92dvh;display:flex;flex-direction:column;border:1.5px solid var(--line);border-radius:18px;
    box-shadow:0 18px 50px rgba(0,0,0,.35);overflow:hidden}
  .reader-head{flex:none;display:flex;gap:14px;align-items:flex-start;justify-content:space-between;
    padding:20px 26px 14px;border-bottom:2px solid var(--line);background:var(--surface)}
  .reader-head h2{font-size:30px;line-height:1.15;margin:0}
  .reader-meta{margin:6px 0 8px;font-size:15.5px;font-weight:600;color:var(--ink)}
  .reader-head .chips{margin-top:2px}
  .reader-close{flex:none;min-height:48px;padding:10px 18px;border-radius:999px;border:1.5px solid var(--accent);
    background:var(--accent);color:var(--accent-ink);font-size:16px;font-weight:700;white-space:nowrap}
  .reader-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    padding:20px 26px 30px;font-size:17px;line-height:1.65;border-top:none}
  .reader-body .desc{font-size:17.5px;line-height:1.65;color:var(--ink);display:block;-webkit-line-clamp:none;overflow:visible}
  .reader-body h4{font-size:15px;letter-spacing:.08em;text-transform:uppercase;margin:18px 0 8px}
  .reader-body ul,.reader-body ol{font-size:17px;line-height:1.65}
  .reader-body li{margin:7px 0}
  .reader-body ol li{margin:12px 0}
  .reader-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px}
  .reader-actions button{border:1px solid var(--line);background:var(--surface2);color:var(--ink);
    border-radius:8px;padding:10px 16px;font-weight:700;font-size:15px}
  .reader-actions button.faved{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .reader-cols{display:grid;grid-template-columns:1fr;gap:4px 36px;align-items:start}
  @media(min-width:760px){ .reader-cols{grid-template-columns:minmax(0,5fr) minmax(0,7fr)} }
  .serve-box{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 8px;font-size:15.5px}
  .serve-lbl{font-weight:700}
  .serve-step{width:36px;height:36px;border-radius:999px;border:1.5px solid var(--accent);background:var(--surface);
    color:var(--accent);font-size:18px;font-weight:700;line-height:1;padding:0}
  .serve-n{font-weight:700;font-size:16px;min-width:24px;text-align:center}
  .serve-quick{display:inline-flex;gap:6px;flex-wrap:wrap}
  .chip.serve-chip{min-height:36px;padding:6px 12px;border:1px solid var(--line);background:var(--surface);
    border-radius:999px;font-weight:600}
  .chip.serve-chip.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .serve-adj{color:var(--green);font-weight:600}
  .serve-orig{background:none;border:none;padding:0;color:var(--accent);font:inherit;font-weight:700;
    text-decoration:underline;cursor:pointer}
  .nut-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;margin:0 0 6px}
  .nut-cell{background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:8px 10px}
  .nut-cell dt{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink2)}
  .nut-cell dd{margin:2px 0 0;font-size:15px;font-weight:700}
  .reader-body h4 .hint{font-weight:400;text-transform:none;letter-spacing:0;color:var(--ink2)}
  .reader-credit{margin:20px 0 0;font-size:14px;font-weight:600;color:var(--accent)}

  /* ---------- Phone layout for the redesign ---------- */
  @media(max-width:759px){
    header.ri-header{padding:18px 15px 16px;border-radius:16px}
    .hero-img{margin-bottom:14px;border-radius:10px}
    .lede{font-size:15.5px}
    .topnav{gap:6px;padding:8px 0 7px}
    .topnav-lbl{flex:1 1 100%}
    .nav-pill{flex:1 1 auto;min-height:38px;padding:7px 10px;font-size:13.5px;text-align:center}
    .nav-top{margin-left:0}
    .cuisine-section{margin-top:20px;scroll-margin-top:132px}
    .cuisine-section h2{font-size:24px}
    .cuisine-tile{min-height:96px;padding:12px 12px 10px}
    .cuisine-tile .ct-name{font-size:19px}
    .filters{padding:15px 13px 12px;border-radius:16px;scroll-margin-top:132px}
    #resultsAnchor{scroll-margin-top:132px}
    .stats{grid-template-columns:repeat(2,1fr)}
    .stats .stat:last-child{grid-column:1 / -1}
    .stat b{font-size:23px}
    .reader-backdrop{padding:0;align-items:stretch}
    .reader{max-width:none;height:100dvh;max-height:100dvh;border:none;border-radius:0}
    .reader-head{padding:calc(14px + env(safe-area-inset-top)) 16px 12px}
    .reader-head h2{font-size:25px}
    .reader-body{padding:16px 16px calc(24px + env(safe-area-inset-bottom))}
    .reader-actions button{flex:1 1 100px}
    .nut-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  }
  @media(max-width:340px){ .cuisine-grid{grid-template-columns:1fr} }
  @media print{ .topnav,.reader-backdrop{display:none !important} }


  /* ---------- Analytics & Plans (tracking build) ---------- */
  .vt-analytics{color:var(--navy)} .vt-plans{color:var(--saffron)}
  .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 12px}
  @media(max-width:760px){ .kpis{grid-template-columns:repeat(2,1fr)} }
  .kpi{background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--navy);border-radius:12px;padding:10px 12px;box-shadow:var(--shadow)}
  .kpi b{display:block;font-family:"Iowan Old Style",Palatino,Georgia,serif;font-size:26px;line-height:1.1}
  .kpi span{font-size:12.5px;font-weight:600;color:var(--ink2)}
  .kpi small{display:block;font-size:12px;color:var(--ink2);margin-top:2px}
  .kpis .kpi:nth-child(2){border-top-color:var(--teal)} .kpis .kpi:nth-child(3){border-top-color:var(--leaf)}
  .kpis .kpi:nth-child(4){border-top-color:var(--saffron)} .kpis .kpi:nth-child(5){border-top-color:var(--berry)}
  .kpis .kpi:nth-child(6){border-top-color:var(--cyan)} .kpis .kpi:nth-child(7){border-top-color:var(--gold)}
  .kpis .kpi:nth-child(8){border-top-color:var(--accent)}
  .agrid{display:grid;grid-template-columns:1fr;gap:12px}
  @media(min-width:860px){ .agrid{grid-template-columns:1fr 1fr} }
  .atable{width:100%;border-collapse:collapse;font-size:14.5px}
  .atable th,.atable td{padding:8px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
  .atable th{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink2)}
  .atable td.num,.atable th.num{text-align:right;font-variant-numeric:tabular-nums}
  .bar-row{display:grid;grid-template-columns:118px 1fr 44px;gap:8px;align-items:center;margin:7px 0;font-size:14px}
  .bar-track{height:14px;background:var(--surface2);border:1px solid var(--line);border-radius:99px;overflow:hidden}
  .bar-fill{height:100%;border-radius:99px}
  .bar-val{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
  .plan-grid{display:grid;grid-template-columns:1fr;gap:12px}
  @media(min-width:860px){ .plan-grid{grid-template-columns:repeat(3,1fr)} }
  .plan-card{background:var(--surface);border:1px solid var(--line);border-top:6px solid var(--teal);border-radius:14px;padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px}
  .plan-card.annual{border-top-color:var(--saffron)} .plan-card.free{border-top-color:var(--leaf)}
  .plan-card h3{margin:0;font-size:20px}
  .plan-price{font-family:"Iowan Old Style",Palatino,Georgia,serif;font-size:30px;line-height:1}
  .plan-price small{font-size:14px;color:var(--ink2);font-family:system-ui,sans-serif}
  .plan-card ul{margin:0;padding-left:19px;color:var(--ink2);font-size:14.5px}
  .plan-card .primary,.plan-card .ghost{margin-top:auto;text-align:center}
  .rep-out{white-space:pre-wrap;background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:14px;font-size:14px;line-height:1.55;overflow-wrap:anywhere}
  .status-pill{display:inline-block;border-radius:999px;padding:1px 9px;font-size:12px;font-weight:700;background:var(--green-soft);color:var(--green)}
  .status-pill.off{background:var(--surface2);color:var(--ink2)}
  .mini{font-size:13px;color:var(--ink2)}
  @media print{ .kpis,.agrid{break-inside:avoid} }

  /* ---------- Trust & Transparency + cook/report loop ---------- */
  .nav-trust{background:var(--navy-soft);border-color:var(--navy);color:var(--navy)}
  @media (prefers-color-scheme: dark){ .nav-trust{color:var(--ink)} }
  .header-trust{margin:0 0 14px;font-size:15px;font-weight:600}
  .vt-trust{color:var(--navy)}
  #view-trust .panel h2{color:var(--navy)}
  .facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:4px 0 10px}
  .fact{background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
  .fact b{display:block;font-family:"Iowan Old Style",Palatino,Georgia,serif;font-size:21px;line-height:1.15}
  .fact span{font-size:12.5px;font-weight:600;color:var(--ink2)}
  .adstxt{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--surface2);border:1px solid var(--line);
    border-radius:10px;padding:12px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13.5px;line-height:1.55;margin:8px 0}
  .changelog{list-style:none;margin:6px 0;padding:0}
  .changelog li{padding:7px 0;border-bottom:1px dotted var(--line);font-size:15px}
  .changelog li:last-child{border-bottom:none}
  .fbactions{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .fbactions button{border:1px solid var(--line);background:var(--surface);color:var(--ink);
    border-radius:8px;padding:9px 6px;font-weight:600;font-size:14.5px}
  .fbactions button.cooked-on{background:var(--green);color:#fff;border-color:var(--green)}
  @media (prefers-color-scheme: dark){ .fbactions button.cooked-on{color:#141a10} }
  .reader-actions button.cooked-on{background:var(--green);color:#fff;border-color:var(--green)}
  @media (prefers-color-scheme: dark){ .reader-actions button.cooked-on{color:#141a10} }
  .sheet textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit;resize:vertical}

  /* ---------- Recipe photos (6,388 recipes, 11,265 images, bundled into pack sheets) ---------- */
  .card-photo{display:block;width:100%;height:auto;aspect-ratio:3/2;border:1px solid var(--line);border-radius:8px}
  .photocell{background-repeat:no-repeat;background-color:var(--surface)}
  .reader-photos{display:grid;grid-template-columns:1fr;gap:14px;margin:0 0 16px}
  @media(min-width:760px){ .reader-photos{grid-template-columns:1fr 1fr} }
  .reader-photos.in-detail{grid-template-columns:1fr;margin:2px 0 10px}
  .reader-photos figure{margin:0;min-width:0}
  .reader-photos .photocell{display:block;width:100%;height:auto;aspect-ratio:3/2;border:1px solid var(--line);border-radius:10px}
  .reader-photos figcaption{font-size:14px;line-height:1.45;color:var(--ink2);margin-top:6px}
  .reader-photos figcaption strong{color:var(--ink)}
  .reader-photos.in-detail figcaption{font-size:13px}
  .reader-photos.single{grid-template-columns:1fr}
  @media(min-width:760px){ .reader-photos.single figure{max-width:520px} }

  /* ---------- Admin pull-down (top ribbon) ---------- */
  .nav-admin{background:var(--navy-soft);border-color:var(--navy);color:var(--navy)}
  .nav-calc{background:var(--cyan-soft);border-color:var(--cyan);color:var(--cyan)}
  @media (prefers-color-scheme: dark){ .nav-admin,.nav-calc{color:var(--ink)} }
  .admin-menu{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--surface);
    border:1.5px solid var(--navy);border-radius:12px;padding:9px 10px;margin-top:2px}
  .admin-menu button{display:inline-flex;justify-content:space-between;gap:10px;text-align:left;
    background:var(--surface2);border:1px solid var(--line);border-radius:8px;padding:10px 14px;font-weight:700;color:var(--ink)}
  .admin-menu-note{font-size:12.5px;color:var(--ink2)}
  .users-wrap{min-width:0}
  .users-wrap td{overflow-wrap:anywhere}
  @media(max-width:640px){ .hide-sm{display:none} }

  /* ---------- Nutrition Calculator ---------- */
  .vt-calc{color:var(--teal)}
  #view-calculator .panel h2{color:var(--teal)}
  .calc-nutgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:8px;margin-top:8px}
  .calc-totals{width:100%;border-collapse:collapse;font-size:15px}
  .calc-totals th,.calc-totals td{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
  .calc-totals th{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink2)}
  .calc-totals td.num,.calc-totals th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
  .calc-totals td.cov{font-size:13px;color:var(--ink2)}

  /* ---------- Welcome popup (first landing, once per visitor) ---------- */
  .welcome-backdrop{position:fixed;inset:0;z-index:70;background:rgba(20,16,12,.62);display:none;
    align-items:center;justify-content:center;padding:16px}
  .welcome-backdrop.open{display:flex}
  .welcome-pop{position:relative;background:var(--surface);color:var(--ink);width:100%;max-width:640px;
    max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    border:1.5px solid var(--line);border-top:6px solid var(--accent);border-radius:16px;
    box-shadow:0 18px 50px rgba(0,0,0,.35);padding:26px 28px 24px}
  .welcome-pop:focus{outline:none}
  .welcome-pop h2{font-size:29px;line-height:1.15;margin:0 44px 8px 0}
  .welcome-intro{margin:0 0 6px;color:var(--ink2);font-size:15.5px;line-height:1.5}
  .welcome-pop h3{font-size:17px;margin:16px 0 5px;color:var(--accent)}
  .welcome-list{list-style:none;margin:0;padding:0}
  .welcome-list li{position:relative;padding:3px 0 3px 20px;font-size:15px;line-height:1.5}
  .welcome-list li::before{content:"•";position:absolute;left:4px;top:3px;color:var(--accent);font-weight:700}
  .welcome-close{position:absolute;top:10px;right:10px;width:44px;height:44px;border-radius:999px;
    border:1px solid var(--line);background:var(--surface2);color:var(--ink);font-size:24px;line-height:1;padding:0}
  .welcome-cta{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}
  .welcome-trial{font-family:"Iowan Old Style",Palatino,"Palatino Linotype",Georgia,serif;
    font-size:21px;font-weight:700;line-height:1.25;margin:0 0 6px;color:var(--accent)}
  .welcome-price{margin:0 0 4px;font-size:14.5px;color:var(--ink2);line-height:1.5}
  .welcome-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
  .welcome-actions button{flex:1 1 180px;min-height:48px;font-size:16px}
  @media(max-width:560px){
    .welcome-backdrop{padding:10px}
    .welcome-pop{max-height:calc(100dvh - 20px);border-radius:14px;padding:20px 18px calc(18px + env(safe-area-inset-bottom))}
    .welcome-pop h2{font-size:24px}
    .welcome-actions button{flex:1 1 100%}
  }
  @media print{ .welcome-backdrop{display:none !important} }

  /* ---------- Installable app (PWA) — install bar, update toast, offline note ---------- */
  .pwa-bar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:55;
    display:none;align-items:center;gap:10px;background:var(--surface);color:var(--ink);
    border:1.5px solid var(--accent);border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.28);padding:11px 12px}
  .pwa-bar.show{display:flex}
  .pwa-bar p{margin:0;font-size:14.5px;line-height:1.4;flex:1 1 auto;min-width:0}
  .pwa-bar p b{display:block;font-size:15px}
  .pwa-bar .pwa-install{flex:none;background:var(--accent);color:var(--accent-ink);border:none;
    border-radius:9px;padding:10px 15px;font-weight:700;min-height:44px}
  .pwa-bar .pwa-x{flex:none;background:none;border:none;color:var(--ink2);font-size:22px;line-height:1;padding:6px 8px}
  .pwa-toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom));z-index:56;
    display:none;align-items:center;gap:10px;background:var(--ink);color:var(--bg);
    border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.3);padding:9px 10px 9px 16px;font-size:14.5px;max-width:calc(100vw - 24px)}
  .pwa-toast.show{display:flex}
  .pwa-toast button{flex:none;background:var(--accent);color:var(--accent-ink);border:none;border-radius:999px;
    padding:8px 14px;font-weight:700;min-height:38px}
  @media (prefers-color-scheme: dark){ .pwa-toast button{color:#241105} }
  .offline-note{display:none;margin:0 0 12px;padding:10px 13px;background:var(--gold-soft);border:1px solid var(--gold);
    border-radius:10px;color:var(--ink);font-size:14.5px}
  .offline-note.show{display:block}
  .pwa-help-list{margin:6px 0 4px;padding-left:20px;font-size:15px;line-height:1.55}
  @media print{ .pwa-bar,.pwa-toast{display:none !important} }


  /* ================= Editorial redesign — November 7, 2026 =================
     The approved magazine look, layered over the base styles: warm paper,
     serif type throughout, a newspaper nameplate masthead, hairline rules
     instead of cards and shadows, square corners, one restrained accent.
     Pages are routed views (front page, cuisine pages, recipe pages, meal
     pages, shelf and collection pages, tool pages) — see the router script. */
  :root{
    --bg:#faf6ec; --surface:#fffdf6; --surface2:#f3eddc; --ink:#1e1a14; --ink2:#57503f; --ink3:#7d7461;
    --line:#d9d0ba; --hair:#d9d0ba; --hair2:#b9ae94;
    --accent:#8a2d1a; --accent-ink:#fffdf6; --green:#4d6420; --green-soft:#e9ecd4;
    --gold:#8a6d1a; --gold-soft:#f3eddc; --accent-soft:#f3eddc;
    --chip:#f3eddc; --warn:#8a6d1a; --shadow:none;
    --teal:#57503f; --teal-soft:#f3eddc; --berry:#8a2d1a; --berry-soft:#f3eddc;
    --leaf:#4d6420; --leaf-soft:#e9ecd4; --navy:#1e1a14; --navy-soft:#f3eddc;
    --saffron:#8a6d1a; --saffron-soft:#f3eddc; --cyan:#57503f; --cyan-soft:#f3eddc;
  }
  @media (prefers-color-scheme: dark){
    :root{
      --bg:#181510; --surface:#1f1b15; --surface2:#201c15; --ink:#ece4d2; --ink2:#bdb29a; --ink3:#8f846d;
      --line:#3b352a; --hair:#3b352a; --hair2:#554c3a;
      --accent:#d98d64; --accent-ink:#241105; --green:#a3c96a; --green-soft:#2c3816;
      --gold:#e3b34e; --gold-soft:#201c15; --accent-soft:#201c15;
      --chip:#201c15; --warn:#e3b34e;
      --teal:#bdb29a; --teal-soft:#201c15; --berry:#d98d64; --berry-soft:#201c15;
      --leaf:#a3c96a; --leaf-soft:#2c3816; --navy:#ece4d2; --navy-soft:#201c15;
      --saffron:#e3b34e; --saffron-soft:#201c15; --cyan:#bdb29a; --cyan-soft:#201c15;
    }
  }
  body{font-family:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",serif;
    font-size:17px;line-height:1.62}
  h1,h2,h3,h4,.serif{font-family:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,serif}
  a{text-decoration:none} a:hover{text-decoration:underline}
  .wrap{max-width:1060px;padding:0 20px 64px}
  :focus-visible{outline:2px solid var(--accent);outline-offset:2px}

  /* ---------- Masthead ---------- */
  .spice-ribbon{display:none}
  .topnav{position:static;justify-content:center;gap:6px 22px;border-bottom:1px solid var(--hair2);
    padding:10px 0;background:var(--bg)}
  .topnav-lbl{display:none}
  .nav-pill{min-height:0;padding:4px 2px;border:none;border-radius:0;background:none;color:var(--ink);
    font-size:15px;font-weight:400}
  .nav-pill:hover{text-decoration:underline}
  .nav-search,.nav-cuisines,.nav-results,.nav-favorites,.nav-week,.nav-trust,.nav-calc,.nav-admin,.nav-top{
    background:none;border:none;color:var(--ink);margin-left:0}
  @media (prefers-color-scheme: dark){
    .nav-search,.nav-cuisines,.nav-results,.nav-favorites,.nav-week,.nav-trust,.nav-calc,.nav-admin,.nav-top{color:var(--ink)}
  }
  .admin-menu{border:1px solid var(--hair2);border-radius:0;background:var(--surface)}
  .admin-menu button{border-radius:2px;background:var(--surface2)}
  header.ri-header{margin-top:0;padding:0;background:none;border:none;border-radius:0;box-shadow:none}
  .dateline{display:flex;justify-content:space-between;gap:6px 18px;flex-wrap:wrap;font-size:13px;
    letter-spacing:.04em;color:var(--ink2);border-bottom:1px solid var(--hair2);padding:10px 0 8px}
  .nameplate{text-align:center;padding:24px 0 4px}
  .nameplate .over{font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink2);margin:0}
  .nameplate h1{font-size:clamp(44px,9vw,84px);line-height:1.02;margin:6px 0 6px;font-weight:700;letter-spacing:-.01em}
  .nameplate h1 a{color:var(--ink)} .nameplate h1 a:hover{text-decoration:none}
  .nameplate .tagline{font-style:italic;color:var(--ink2);font-size:18px;margin:0}
  .doublerule{border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);height:5px;margin:16px 0 18px}
  header.ri-header h1{font-size:clamp(44px,9vw,84px)}
  .lede{font-size:20px;line-height:1.55;color:var(--ink);max-width:72ch;margin:0 0 16px}
  .kicker{display:inline-block;background:none;color:var(--accent);padding:0;border-radius:0;
    font-size:13px;letter-spacing:.26em;margin:0 0 10px}
  .nutrition-disclaimer{background:var(--surface2);border:1px solid var(--hair2);border-radius:0;
    font-size:14.5px;max-width:75ch}
  .header-trust{font-weight:400;font-style:italic}
  .hero-img{border-radius:0;border:1px solid var(--hair2)}
  .stats{grid-template-columns:repeat(5,1fr);gap:0 22px}
  .stat{background:none;border:none;border-top:1px solid var(--line);border-radius:0;box-shadow:none;padding:10px 2px 2px}
  .stats .stat:nth-child(n){border-top:1px solid var(--line)}
  .stat b{font-size:24px;color:var(--ink)}
  .stat.dessert b{color:var(--ink)}
  .stat span{font-weight:400;color:var(--ink2)}
  .progress .bar{height:4px;background:var(--surface2);border:none;border-radius:0}
  .progress .fill{background:var(--accent);border-radius:0}
  .loadbar-track{height:4px;background:var(--surface2);border:none;border-radius:0}
  .loadbar-fill{background:var(--accent);border-radius:0}
  @media(max-width:700px){ .stats{grid-template-columns:repeat(2,1fr)} .stats .stat:last-child{grid-column:auto} }

  /* ---------- Tabs as a section nav ---------- */
  nav.tabs{gap:2px 8px;border-bottom:1px solid var(--hair2);margin:18px 0 6px;padding-bottom:0}
  nav.tabs button{border:none;background:none;color:var(--ink);border-radius:0;padding:9px 10px;font-weight:400;font-size:16px}
  nav.tabs button:hover{text-decoration:underline}
  nav.tabs button[aria-selected="true"]{background:none;color:var(--accent);border-color:transparent;
    font-weight:700;box-shadow:inset 0 -3px 0 var(--accent)}
  .viewtitle{font-size:30px;line-height:1.15;margin:22px 0 8px;color:var(--ink)}
  .vt-fav,.vt-week,.vt-calc,.vt-plans,.vt-analytics,.vt-trust{color:var(--ink)}
  #view-collections .panel h2,#view-shopping .panel h2,#view-trust .panel h2,#view-calculator .panel h2{color:var(--ink)}
  .day h3{color:var(--ink)}

  /* ---------- Page heads, crumbs, front-page lead ---------- */
  .crumbs{font-size:14px;color:var(--ink2);padding:16px 0 0;margin:0}
  .crumbs a{color:var(--ink2);text-decoration:underline}
  .pagehead{padding-top:6px;max-width:760px}
  .pagehead h2{font-size:clamp(38px,6vw,58px);line-height:1.05;margin:10px 0 10px;font-weight:700}
  .standfirst{font-size:19px;line-height:1.55;color:var(--ink);margin:0 0 6px}
  .cuisine-head{padding-top:6px;max-width:720px}
  .frontlead{padding-top:26px}
  .frontlead h2{font-size:clamp(32px,5.4vw,50px);line-height:1.08;margin:0 0 12px;font-weight:700}
  .frontlead h2 a{color:var(--ink)} .frontlead h2 a:hover{text-decoration:underline}
  .lead-grid{display:grid;grid-template-columns:1fr;gap:24px;margin-top:16px}
  @media(min-width:820px){ .lead-grid{grid-template-columns:7fr 5fr;align-items:start} }
  .frontlead figure{margin:0}
  .frontlead figcaption{font-size:14px;line-height:1.5;color:var(--ink2);margin-top:8px}
  .frontlead figcaption b{color:var(--ink)}
  .frontlead .photocell{display:block;width:100%;aspect-ratio:3/2;border:1px solid var(--hair2)}
  .readlink{font-size:17px;font-weight:700}
  .idline{font-size:13px;letter-spacing:.08em;color:var(--ink3);text-transform:uppercase;margin:0 0 8px}
  .dirlist{list-style:none;margin:10px 0 0;padding:0;max-width:860px}
  .dirlist li{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--hair);padding:11px 0;font-size:17px}
  .dirlist li:first-child{border-top:0}
  .dirlist a{font-weight:700;color:var(--ink)} .dirlist a:hover{color:var(--accent)}
  .dirlist .n{color:var(--ink3);font-variant-numeric:tabular-nums;white-space:nowrap}
  .dirlist .blurb{color:var(--ink2);font-size:15px;font-weight:400}
  .grouphead{font-size:14px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink2);margin:28px 0 0}

  /* ---------- Search & filters box ---------- */
  .filters{background:var(--surface);border:1px solid var(--hair2);border-top:1px solid var(--hair2);
    border-radius:0;box-shadow:none;padding:20px 22px 16px}
  .filters-title{color:var(--ink2);font-family:Georgia,"Iowan Old Style",Palatino,serif;
    font-size:13px;letter-spacing:.22em}
  .field label{color:var(--ink2);letter-spacing:.06em}
  .field input,.field select{border:1px solid var(--hair2);border-radius:2px;background:var(--bg)}
  .inlineform input,.inlineform select{border:1px solid var(--hair2);border-radius:2px;background:var(--bg)}
  .resultsbar select{border:1px solid var(--hair2);border-radius:2px;background:var(--surface)}
  .clearbtn{border:1px solid var(--hair2);border-radius:2px;background:none}
  .quickrow button{border:1px solid var(--hair2);background:none;border-radius:2px;padding:6px 12px}
  .quickrow button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .quickrow button.qbtn{background:none}
  .quickrow button.qbtn[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  @media (prefers-color-scheme: dark){
    .quickrow button[aria-pressed="true"],.quickrow button.qbtn[aria-pressed="true"]{color:var(--bg)}
  }
  .shelves button{border:1px solid var(--hair2);background:none;border-radius:2px;padding:6px 12px}
  .shelves button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  @media (prefers-color-scheme: dark){ .shelves button[aria-pressed="true"]{color:var(--bg)} }
  .note{color:var(--ink2)}
  .offline-note{background:var(--surface2);border:1px solid var(--hair2);border-radius:0}

  /* ---------- Cuisine tiles as directory rows ---------- */
  .cuisine-section h2{font-size:30px}
  .cuisine-grid{gap:0 44px;margin-top:6px}
  .cuisine-tile{--ct:var(--accent);min-height:0;padding:14px 2px 12px;border:none;border-top:1px solid var(--hair);
    border-radius:0;background:none;box-shadow:none;gap:2px}
  .cuisine-tile .ct-name{color:var(--ink);font-size:22px}
  .cuisine-tile .ct-count{color:var(--ink3);font-weight:400}
  .cuisine-tile .ct-blurb{color:var(--ink2)}
  .cuisine-tile:hover .ct-name{color:var(--accent)}
  .cuisine-tile.on{background:none;border-color:var(--hair)}
  .cuisine-tile.on .ct-name{color:var(--accent)}
  .cuisine-tile.on .ct-count,.cuisine-tile.on .ct-blurb{color:var(--ink2)}
  @media (prefers-color-scheme: dark){
    .cuisine-tile.on .ct-name{color:var(--accent)}
    .cuisine-tile.on .ct-count,.cuisine-tile.on .ct-blurb{color:var(--ink2)}
  }

  /* ---------- Recipe entries (the results list) ---------- */
  .grid{grid-template-columns:1fr;gap:0}
  .card{display:block;background:none;border:none;border-top:1px solid var(--hair);border-radius:0;
    box-shadow:none;padding:22px 0 20px}
  .card::after{content:"";display:block;clear:both}
  .card-photo{border:1px solid var(--hair2);border-radius:0;width:100%}
  @media(min-width:760px){ .card-photo{float:left;width:300px;margin:2px 22px 10px 0} }
  .card h3{font-size:23px;line-height:1.22;font-weight:700;cursor:pointer}
  .card h3:hover{color:var(--accent);text-decoration:underline}
  .desc{color:var(--ink);font-size:16px;-webkit-line-clamp:4}
  .chip{background:none;border:1px solid var(--hair);border-radius:2px;color:var(--ink2);padding:2px 8px}
  .chip.diet{background:var(--green-soft)}
  .chip.health{background:none;border:1px dashed var(--green);color:var(--ink)}
  .pairs{font-size:15px;color:var(--ink2)}
  .pairs button{font-size:15px}
  .source{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);font-weight:400}
  .cardactions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;clear:none}
  .cardactions button{border:1px solid var(--hair2);background:none;border-radius:2px;padding:8px 14px;font-weight:400}
  .cardactions button.faved{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .cardactions .wide{background:var(--ink);color:var(--bg);border-color:var(--ink);flex:1 1 180px;font-weight:700}
  @media (prefers-color-scheme: dark){ .cardactions .wide{color:var(--bg)} }
  .fbactions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
  .fbactions button{border:1px solid var(--hair2);background:none;border-radius:2px;padding:8px 14px;font-weight:400}
  .fbactions button.cooked-on{background:var(--green);border-color:var(--green);color:#fff}
  .detail{clear:both;border-top:1px solid var(--hair);margin-top:14px}
  .scaler{background:var(--surface2);border-radius:0}
  .scaler button{border-radius:2px;background:var(--surface)}
  .nutri div{background:none;border-bottom:1px solid var(--hair);border-radius:0;padding:6px 2px}
  .more{background:var(--ink);color:var(--bg);border-radius:2px}
  @media (prefers-color-scheme: dark){ .more{color:var(--bg)} }
  .empty{background:none;border:1px dashed var(--hair2);border-radius:0}

  /* ---------- Panels, plans, planner, tables ---------- */
  .panel{background:var(--surface);border:1px solid var(--hair2);border-radius:0;box-shadow:none;padding:18px 20px}
  .primary{background:var(--ink);color:var(--bg);border:1px solid var(--ink);border-radius:2px}
  @media (prefers-color-scheme: dark){ .primary{color:var(--bg)} }
  .ghost{background:none;border:1px solid var(--hair2);border-radius:2px}
  .topbtn{background:none;color:var(--accent);border:1px solid var(--hair2);border-radius:2px}
  .plan-card{background:none;border:none;border-top:2px solid var(--ink);border-radius:0;box-shadow:none;padding:14px 2px}
  .plan-card.annual,.plan-card.free{border-top:2px solid var(--ink)}
  .plan-price small{font-family:Georgia,serif}
  .kpi{background:none;border:none;border-top:2px solid var(--ink);border-radius:0;box-shadow:none;padding:10px 2px}
  .kpis .kpi:nth-child(n){border-top-color:var(--ink)}
  .day{background:var(--surface);border:1px solid var(--hair2);border-radius:0;box-shadow:none}
  .bar-track{border-radius:0;background:var(--surface2)}
  .bar-fill{border-radius:0}
  .atable th{color:var(--ink2)}
  .status-pill{border-radius:2px}
  .fact{background:none;border:none;border-top:1px solid var(--hair);border-radius:0;padding:10px 2px}
  .adstxt{background:var(--surface2);border:1px solid var(--hair2);border-radius:0}
  .rep-out{background:var(--surface2);border:1px solid var(--hair2);border-radius:0}
  .nut-cell{background:none;border:none;border-bottom:1px solid var(--hair);border-radius:0;padding:7px 2px}
  footer{border-top:3px solid var(--ink)}

  /* ---------- Recipe page (the reader, as a page) ---------- */
  .reader-backdrop{background:var(--bg);padding:0;align-items:stretch;justify-content:center}
  .reader{background:var(--bg);width:100%;max-width:1060px;height:100dvh;max-height:100dvh;
    border:none;border-radius:0;box-shadow:none;margin:0 auto}
  .reader-head{background:var(--bg);border-bottom:1px solid var(--hair2);padding:18px 20px 14px}
  .reader-head h2{font-size:clamp(32px,5.6vw,52px);line-height:1.08;font-weight:700}
  .reader-close{background:var(--ink);color:var(--bg);border:1px solid var(--ink);border-radius:2px;min-height:44px}
  @media (prefers-color-scheme: dark){ .reader-close{color:var(--bg)} }
  .reader-body{padding:22px 20px 44px;font-size:17px}
  .reader-body h4{font-size:22px;letter-spacing:0;text-transform:none;font-family:Georgia,"Iowan Old Style",Palatino,serif;
    border-bottom:2px solid var(--ink);padding-bottom:6px;margin:26px 0 10px}
  .reader-photos .photocell{border:1px solid var(--hair2);border-radius:0}
  .reader-actions button{border:1px solid var(--hair2);background:none;border-radius:2px;font-weight:400}
  .reader-actions button.faved{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .reader-actions button.cooked-on{background:var(--green);border-color:var(--green);color:#fff}
  .serve-step{border:1.5px solid var(--ink);background:none;color:var(--ink);border-radius:2px}
  .chip.serve-chip{border:1px solid var(--hair2);background:none;border-radius:2px}
  .chip.serve-chip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  @media (prefers-color-scheme: dark){ .chip.serve-chip.on{color:var(--bg)} }
  .serve-adj{color:var(--green)}
  .reader-credit{color:var(--ink3);font-weight:400;letter-spacing:.06em;text-transform:uppercase;font-size:13px}
  .pagecrumbs{font-size:14px;color:var(--ink2);margin:0 0 4px}
  .pagecrumbs a{color:var(--ink2);text-decoration:underline}
  @media(max-width:759px){
    .reader{height:100dvh;max-height:100dvh}
    .reader-head{padding:calc(12px + env(safe-area-inset-top)) 16px 12px}
    .reader-body{padding:16px 16px calc(26px + env(safe-area-inset-bottom))}
    .topnav{flex-wrap:wrap;gap:4px 16px}
    .filters{padding:16px 14px 12px}
    .panel{padding:15px 14px}
    header.ri-header{padding:0}
  }

  /* ---------- Sheets, welcome, PWA chrome ---------- */
  .sheet{border:1px solid var(--hair2);border-radius:0;background:var(--surface)}
  @media(max-width:560px){ .sheet{border-radius:0} }
  .sheet select,.sheet input,.sheet textarea{border:1px solid var(--hair2);border-radius:2px;background:var(--bg)}
  .daygrid button{border:1px solid var(--hair2);background:none;border-radius:2px}
  .daygrid button.sel{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  @media (prefers-color-scheme: dark){ .daygrid button.sel{color:var(--bg)} }
  .welcome-pop{border:1px solid var(--hair2);border-top:3px solid var(--ink);border-radius:0;background:var(--surface)}
  .welcome-pop h3{color:var(--ink)}
  .welcome-trial{color:var(--accent)}
  .pwa-bar{border:1px solid var(--hair2);border-radius:0;background:var(--surface)}
  .pwa-bar .pwa-install{background:var(--ink);color:var(--bg);border-radius:2px}
  @media (prefers-color-scheme: dark){ .pwa-bar .pwa-install{color:var(--bg)} }
  .pwa-toast{border-radius:2px}
  .pwa-toast button{background:var(--accent);border-radius:2px}
  @media print{ .pagehead .crumbs{display:none} }

/* --- multi-page additions (Recipe Index rebuild) --- */
.pagenav{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:22px 0}
.pagenav a,.pagenav span.cur{border:1px solid var(--line,#dde1e6);border-radius:6px;padding:6px 11px;text-decoration:none}
.pagenav span.cur{background:var(--ink,#1d2735);color:#fff}
.pagenav span.gap{padding:6px 2px}
.countline{color:var(--ink2);margin:4px 0 14px}
.chiplinks{display:flex;gap:8px;flex-wrap:wrap}
.chiplinks a{border:1px solid var(--line,#dde1e6);border-radius:999px;padding:6px 13px;text-decoration:none}
.homesection{margin:30px 0}
.cuisine-grid a.tile{display:block;text-decoration:none}
.card h3 a{text-decoration:none;color:inherit}
.cardlink{display:inline-block;text-align:center;text-decoration:none}
.pageactions{margin-top:18px}
.idline{color:var(--ink2);font-size:14px}
a[aria-current="page"]{font-weight:700}

/* --- supermarket finder (added 2026-11-14) --- */
.finderlinks{white-space:nowrap;font-size:13px}
.finderlinks a{text-decoration:none;border-bottom:1px dotted currentColor}
.finderpanel{border-top:1px solid var(--line,#dde1e6);margin-top:10px}