    :root{
      --paper:#efe4cb;
      --paper-warm:#ead9b3;
      --ink:#221b0d;
      --ink-soft:rgba(34,27,13,0.72);
      --ink-faint:rgba(34,27,13,0.32);
      --rule:rgba(34,27,13,0.5);
      --oxblood:#6f1d1c;
      --oxblood-deep:#4a1110;
      --sage:#4d5e35;
      --gold:#a07c34;
      --shadow:rgba(34,27,13,0.22);
      --display:'Italiana','Bodoni Moda',serif;
      --body:'EB Garamond',Garamond,Georgia,serif;
      --hand:'Caveat',cursive;
      --mono:'DM Mono','Courier New',monospace;
    }
    *{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
    html{background:#231b10;}
    body{
      margin:0;
      min-height:100vh;
      font-family:var(--body);
      font-size:17px;
      line-height:1.55;
      color:var(--ink);
      background:var(--paper);
      background-image:
        radial-gradient(ellipse 800px 600px at 0% 0%, rgba(218,180,120,0.45) 0%, transparent 60%),
        radial-gradient(ellipse 700px 700px at 100% 100%, rgba(180,140,90,0.32) 0%, transparent 60%),
        radial-gradient(ellipse 900px 500px at 50% 90%, rgba(110,30,30,0.06) 0%, transparent 70%);
      padding:28px 16px 64px;
      position:relative;
      overflow-x:hidden;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
    }
    body::before{
      content:'';
      position:fixed;inset:0;
      pointer-events:none;
      background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.10 0 0 0 0 0.05 0 0 0 0.55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
      opacity:0.22;
      mix-blend-mode:multiply;
      z-index:1;
    }

    .masthead{
      text-align:center;
      margin:6px auto 22px;
      max-width:760px;
      position:relative;z-index:2;
    }
    .masthead__pre{
      font-family:var(--mono);
      font-size:10.5px;
      letter-spacing:0.46em;
      text-transform:uppercase;
      color:var(--oxblood);
      margin:0 0 12px;
    }
    .masthead__title{
      font-family:var(--display);
      font-size:clamp(46px,9vw,86px);
      margin:0;
      line-height:0.92;
      letter-spacing:0.012em;
      font-weight:400;
    }
    .masthead__post{
      font-family:var(--body);
      font-style:italic;
      font-size:15px;
      color:var(--ink-soft);
      margin:14px 0 0;
    }
    .masthead__post::before,.masthead__post::after{
      content:'·  ·  ·';
      margin:0 14px;
      color:var(--ink-faint);
      letter-spacing:0.4em;
    }

    .day-tabs{
      display:flex;
      flex-wrap:wrap;
      justify-content:center;
      gap:5px;
      margin:0 auto 12px;
      max-width:900px;
      position:relative;z-index:2;
    }
    .day-tab{
      background:transparent;
      border:1px solid var(--ink-faint);
      border-radius:999px;
      padding:7px 14px;
      font-family:var(--mono);
      font-size:10.5px;
      font-weight:500;
      letter-spacing:0.22em;
      text-transform:uppercase;
      color:var(--ink-soft);
      cursor:pointer;
      transition:all 0.22s ease;
      position:relative;
    }
    .day-tab:hover{border-color:var(--ink);color:var(--ink);}
    .day-tab.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}
    .day-tab.grocery-tab{margin-left:8px;}
    .day-tab.grocery-tab.active{background:var(--oxblood);border-color:var(--oxblood);}
    .day-tab.is-today::after{
      content:'';
      position:absolute;
      top:-2px;right:-2px;
      width:7px;height:7px;
      background:var(--oxblood);
      border-radius:50%;
      box-shadow:0 0 0 2px var(--paper);
    }
    .day-tab.is-rest{
      border-style:dashed;
    }

    .filter-row{
      display:flex;
      flex-wrap:wrap;
      justify-content:center;
      align-items:center;
      gap:6px;
      max-width:900px;
      margin:0 auto 22px;
      padding:10px 14px;
      background:rgba(34,27,13,0.04);
      border-radius:2px;
      border:1px solid var(--ink-faint);
      position:relative;z-index:2;
    }
    .filter-row__label{
      font-family:var(--hand);
      font-size:17px;
      color:var(--oxblood);
      margin-right:6px;
      flex-shrink:0;
    }
    .filter-pill{
      background:transparent;
      border:1px solid var(--ink-faint);
      border-radius:999px;
      padding:6px 11px;
      font-family:var(--mono);
      font-size:10px;
      font-weight:500;
      letter-spacing:0.18em;
      text-transform:uppercase;
      color:var(--ink-soft);
      cursor:pointer;
      transition:all 0.18s ease;
    }
    .filter-pill:hover{border-color:var(--ink);color:var(--ink);}
    .filter-pill.active{background:var(--oxblood);color:var(--paper);border-color:var(--oxblood);}

    .book{
      position:relative;
      max-width:900px;
      margin:0 auto;
      perspective:1800px;
      z-index:2;
    }
    .book__pages{
      position:relative;
    }
    .book__pages > .card{
      position:absolute;
      top:0; left:0; right:0;
    }
    .book__pages > .card.active{
      position:relative;
    }

    .card{
      background:linear-gradient(180deg,#f5ebcf 0%,#ecdfbb 100%);
      border:1px solid rgba(34,27,13,0.18);
      border-radius:2px;
      padding:48px 42px 56px;
      box-shadow:
        0 1px 0 rgba(255,255,255,0.5) inset,
        0 30px 60px -22px var(--shadow),
        0 8px 20px -10px var(--shadow);
      position:relative;
      opacity:0;
      transform:translateY(14px) rotateZ(-0.6deg);
      pointer-events:none;
      transition:opacity 0.42s ease, transform 0.55s cubic-bezier(0.4,0,0.2,1);
    }
    .card.active{
      opacity:1;
      transform:translateY(0) rotateZ(0);
      pointer-events:auto;
      z-index:5;
    }
    .card::before{
      content:'';
      position:absolute;
      top:0;left:0;right:0;height:3px;
      background:linear-gradient(90deg,transparent 5%,rgba(34,27,13,0.10) 50%,transparent 95%);
    }

    .card__corner{
      position:absolute;
      top:18px;right:24px;
      text-align:right;
    }
    .card__corner-pre{
      font-family:var(--mono);
      font-size:8.5px;
      letter-spacing:0.42em;
      text-transform:uppercase;
      color:var(--ink-faint);
      margin-bottom:1px;
    }
    .card__numeral{
      font-family:var(--display);
      font-size:20px;
      letter-spacing:0.06em;
      color:var(--oxblood);
    }
    .card__seal{
      position:absolute;
      top:20px;left:24px;
      width:42px;height:42px;
      border:1px solid var(--oxblood);
      border-radius:50%;
      display:flex;align-items:center;justify-content:center;
      font-family:var(--display);
      color:var(--oxblood);
      font-size:11px;
      letter-spacing:0.08em;
      transform:rotate(-7deg);
      opacity:0.78;
    }
    .card__seal::before{
      content:'';
      position:absolute;
      inset:3px;
      border:1px dashed var(--oxblood);
      border-radius:50%;
      opacity:0.55;
    }

    .card__head{
      text-align:center;
      margin:18px 0 10px;
    }
    .card__day{
      font-family:var(--mono);
      font-size:11px;
      letter-spacing:0.42em;
      text-transform:uppercase;
      color:var(--ink-soft);
      margin:0 0 5px;
    }
    .card__date{
      font-family:var(--body);
      font-style:italic;
      color:var(--ink-soft);
      margin:0;
      font-size:16px;
    }
    .card__chip{
      display:inline-block;
      margin-top:10px;
      padding:3px 10px;
      font-family:var(--mono);
      font-size:9px;
      letter-spacing:0.32em;
      text-transform:uppercase;
      border-radius:999px;
      border:1px solid var(--ink-soft);
      color:var(--ink-soft);
    }
    .card__chip.train{
      background:var(--oxblood);
      color:var(--paper);
      border-color:var(--oxblood);
    }
    .card__chip.rest{
      background:var(--paper);
      color:var(--ink);
      border-style:dashed;
    }

    .card__divider{
      text-align:center;
      margin:14px 0 18px;
      letter-spacing:0.9em;
      font-size:14px;
      color:var(--ink-faint);
    }

    .daily-totals{
      list-style:none;
      margin:0 0 28px;
      padding:14px 0;
      border-top:1px solid var(--rule);
      border-bottom:1px solid var(--rule);
      display:flex;
      justify-content:space-between;
      text-align:center;
      gap:8px;
    }
    .daily-totals li{
      flex:1;
      display:flex;flex-direction:column;
      gap:2px;
    }
    .daily-totals b{
      font-family:var(--body);
      font-size:22px;
      font-weight:800;
      color:var(--oxblood);
      letter-spacing:0.005em;
    }
    .daily-totals b small{
      font-family:var(--mono);
      font-size:0.42em;
      font-weight:700;
      color:var(--ink-soft);
      letter-spacing:0.08em;
      margin-left:1px;
    }
    .daily-totals span{
      font-family:var(--mono);
      font-size:8.5px;
      font-weight:500;
      letter-spacing:0.26em;
      text-transform:uppercase;
      color:var(--ink-faint);
    }
    .daily-totals__label{
      font-family:var(--hand);
      font-size:16px;
      color:var(--oxblood);
      text-align:center;
      margin:-22px 0 14px;
      transform:rotate(-0.4deg);
    }
    .daily-totals__label.is-filtered::before{content:'just ';}

    .meal{
      margin:0 0 26px;
      padding-bottom:18px;
      border-bottom:1px solid var(--ink-faint);
    }
    .meal:last-of-type{border-bottom:none;padding-bottom:0;}
    .meal[hidden]{display:none;}

    .meal__header{
      display:flex;
      align-items:baseline;
      gap:14px;
      margin-bottom:8px;
    }
    .meal__numeral{
      font-family:var(--display);
      font-size:18px;
      color:var(--oxblood);
      letter-spacing:0.05em;
      flex-shrink:0;
      min-width:34px;
    }
    .meal__type{
      font-family:var(--mono);
      font-size:9.5px;
      letter-spacing:0.36em;
      text-transform:uppercase;
      color:var(--ink-faint);
      flex:1;
    }
    .meal__time{
      font-family:var(--mono);
      font-size:9.5px;
      letter-spacing:0.18em;
      color:var(--ink-faint);
    }
    .meal__title{
      font-family:var(--display);
      font-size:clamp(26px,4.4vw,34px);
      margin:0 0 4px;
      font-weight:400;
      line-height:1.1;
    }
    .meal__sub{
      font-style:italic;
      color:var(--ink-soft);
      font-size:16px;
      margin:0 0 12px;
    }
    .meal__macros{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
      margin:0 0 14px;
      font-family:var(--mono);
      font-size:11px;
      letter-spacing:0.14em;
      color:var(--ink-soft);
    }
    .meal__macros span b{
      font-family:var(--body);
      font-weight:800;
      font-size:14.5px;
      color:var(--oxblood);
      margin-right:3px;
      letter-spacing:0;
    }
    .meal__portions{
      display:inline-block;
      padding:2px 8px;
      font-family:var(--hand);
      font-size:14px;
      color:var(--oxblood);
      border:1px solid var(--oxblood);
      border-radius:999px;
      transform:rotate(-1deg);
      flex-shrink:0;
    }

    .meal__note{
      font-family:var(--hand);
      font-size:17px;
      color:var(--oxblood);
      margin:0 0 12px;
      line-height:1.3;
      transform:rotate(-0.4deg);
    }
    .meal__note::before,.meal__note::after{
      content:'~';margin:0 6px;color:var(--oxblood);opacity:0.55;
    }

    .meal__sub-head{
      font-family:var(--mono);
      font-size:9.5px;
      letter-spacing:0.34em;
      text-transform:uppercase;
      color:var(--ink-soft);
      margin:14px 0 8px;
      padding-bottom:4px;
      border-bottom:1px dotted var(--ink-faint);
    }

    .meal__method{margin:8px 0 10px;}
    .meal__method ol{
      list-style:none;
      counter-reset:m;
      margin:0;padding:0;
    }
    .meal__method ol li{
      counter-increment:m;
      position:relative;
      padding:1px 0 10px 60px;
      font-size:17px;
      line-height:1.45;
    }
    .meal__method ol li::before{
      content:counter(m,upper-roman) '.';
      position:absolute;
      left:34px;top:1px;
      font-family:var(--display);
      font-size:14px;
      color:var(--oxblood);
      letter-spacing:0.05em;
      min-width:24px;
    }
    .method-step__label{
      display:block;
      cursor:pointer;
      user-select:none;
    }
    .method-step__check{
      position:absolute;
      left:0;top:1px;
      opacity:0;width:22px;height:22px;
      margin:0;pointer-events:none;
    }
    .method-step__box{
      position:absolute;
      left:0;top:2px;
      width:22px;height:22px;
      border:1px solid var(--ink-soft);
      border-radius:2px;
      background:rgba(255,255,255,0.42);
      transition:all 0.18s;
    }
    .method-step__label:hover .method-step__box{
      border-color:var(--oxblood);
    }
    .method-step__check:checked + .method-step__box{
      border-color:var(--oxblood);
      background:rgba(255,255,255,0.65);
    }
    .method-step__check:checked + .method-step__box::after{
      content:'✓';
      position:absolute;
      inset:-4px 0 0 0;
      display:flex;align-items:center;justify-content:center;
      font-family:var(--hand);
      font-size:26px;
      color:var(--oxblood);
      line-height:1;
    }
    .method-step.is-done .method-step__text{
      text-decoration:line-through;
      color:var(--ink-faint);
    }
    body.is-read-only .method-step__label{cursor:default;}
    body.is-read-only .method-step__box{display:none;}
    body.is-read-only .meal__method ol li{padding-left:26px;}
    body.is-read-only .meal__method ol li::before{left:0;}

    .meal__ingredients ul{list-style:none;margin:0;padding:0;}
    .ingredient{
      display:flex;
      align-items:center;
      gap:12px;
      padding:9px 4px;
      border-bottom:1px dotted rgba(34,27,13,0.24);
      user-select:none;
    }
    .ing-toggle{
      display:inline-flex;
      flex-shrink:0;
      border:1px solid var(--rule);
      background:transparent;
      position:relative;
    }
    .ing-toggle input{
      position:absolute;opacity:0;pointer-events:none;
      width:0;height:0;
    }
    .ing-toggle__opt{
      font-family:var(--mono);
      font-size:9.5px;
      letter-spacing:0.22em;
      text-transform:uppercase;
      color:var(--ink-soft);
      padding:5px 9px;
      cursor:pointer;
      transition:all 0.15s ease;
      display:inline-block;
      line-height:1.2;
      min-width:38px;
      text-align:center;
    }
    .ing-toggle__opt + .ing-toggle__opt{
      border-left:1px solid var(--rule);
    }
    .ing-toggle__opt:hover{background:rgba(34,27,13,0.06);}
    .ing-toggle input:checked + .ing-toggle__opt{
      background:var(--oxblood);
      color:var(--paper);
      box-shadow:inset 0 0 0 1px var(--oxblood);
    }
    .ing-toggle__opt:focus-within{outline:1px dotted var(--oxblood);outline-offset:1px;}
    .ingredient__qty{
      font-family:var(--mono);
      font-size:11px;
      color:var(--ink-faint);
      min-width:74px;
      letter-spacing:0.04em;
    }
    .ingredient__name{
      font-size:17px;
      flex:1;
    }
    .ingredient__tag{
      font-family:var(--mono);
      font-size:8.5px;
      letter-spacing:0.22em;
      text-transform:uppercase;
      color:var(--gold);
      border:1px solid var(--gold);
      padding:1px 6px 0;
      border-radius:1px;
      flex-shrink:0;
    }
    .ingredient.have .ingredient__name,
    .ingredient.have .ingredient__qty{
      text-decoration:line-through;
      color:var(--ink-faint);
    }
    body.is-read-only .ing-toggle{display:none;}

    /* Cook-for stepper (in the Ingredients sub-head) */
    .cookfor-control{
      display:inline-flex;
      align-items:center;
      gap:5px;
      float:right;
      font-family:var(--hand);
      font-size:14px;
      color:var(--oxblood);
      letter-spacing:0;
      text-transform:none;
      font-weight:normal;
      line-height:1;
      vertical-align:middle;
    }
    .cookfor-label{
      font-style:italic;
      margin-right:2px;
      letter-spacing:0;
    }
    .cookfor-btn{
      width:22px;height:22px;
      border:1px solid var(--rule);
      background:transparent;
      color:var(--ink-soft);
      font-family:var(--mono);
      font-size:14px;
      line-height:1;
      padding:0;
      cursor:pointer;
      transition:all 0.12s ease;
      display:inline-flex;align-items:center;justify-content:center;
    }
    .cookfor-btn:hover{
      border-color:var(--oxblood);
      color:var(--oxblood);
    }
    .cookfor-btn:active{transform:scale(0.95);}
    .cookfor-input{
      width:36px;height:22px;
      text-align:center;
      border:1px solid var(--rule);
      background:rgba(255,255,255,0.42);
      padding:0;
      font-family:var(--mono);
      font-size:12px;
      color:var(--ink);
      -moz-appearance:textfield;
      box-sizing:border-box;
      line-height:1;
    }
    .cookfor-input::-webkit-outer-spin-button,
    .cookfor-input::-webkit-inner-spin-button{
      -webkit-appearance:none;margin:0;
    }
    .cookfor-input:focus{
      outline:1px dotted var(--oxblood);
      outline-offset:2px;
      border-color:var(--oxblood);
    }
    body.is-read-only .cookfor-btn{display:none;}
    body.is-read-only .cookfor-input{
      pointer-events:none;
      background:transparent;
      border-color:transparent;
    }

    .arrow{
      position:absolute;
      top:50%;
      transform:translateY(-50%);
      background:rgba(245,235,207,0.85);
      border:1px solid var(--ink-faint);
      width:46px;height:46px;
      border-radius:50%;
      font-size:22px;
      font-family:var(--display);
      color:var(--ink);
      cursor:pointer;
      z-index:10;
      transition:all 0.2s;
      display:flex;align-items:center;justify-content:center;
      backdrop-filter:blur(4px);
      -webkit-backdrop-filter:blur(4px);
    }
    .arrow:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
    .arrow:active{transform:translateY(-50%) scale(0.94);}
    .arrow--prev{left:-66px;}
    .arrow--next{right:-66px;}

    .card--grocery{
      background:linear-gradient(180deg,#f5e9c8 0%,#ead29c 100%);
    }
    .card--grocery .card__day{color:var(--oxblood);}
    .grocery-intro{
      font-style:italic;
      text-align:center;
      color:var(--ink-soft);
      font-size:17px;
      margin:0 0 24px;
    }
    .grocery-cat{margin-bottom:28px;}
    .grocery-cat h3{
      font-family:var(--display);
      font-size:24px;
      font-weight:400;
      color:var(--oxblood);
      margin:0 0 6px;
      border-bottom:1px solid var(--ink-faint);
      padding-bottom:6px;
      display:flex;align-items:baseline;justify-content:space-between;
      letter-spacing:0.01em;
    }
    .grocery-cat h3 small{
      font-family:var(--mono);
      font-size:9.5px;
      letter-spacing:0.3em;
      text-transform:uppercase;
      color:var(--ink-faint);
      font-weight:400;
    }
    .grocery-cat ul{list-style:none;margin:0;padding:0;}
    .grocery-item{
      display:flex;align-items:center;gap:14px;
      padding:11px 4px;
      border-bottom:1px dotted rgba(34,27,13,0.28);
    }
    .bought-toggle{
      width:24px;height:24px;
      border:1px solid var(--ink-soft);
      border-radius:50%;
      background:rgba(255,255,255,0.45);
      font-family:var(--hand);
      font-size:18px;
      color:var(--paper);
      cursor:pointer;
      flex-shrink:0;
      display:flex;align-items:center;justify-content:center;
      padding:0;
      line-height:1;
      transition:all 0.18s;
    }
    .bought-toggle:hover{border-color:var(--oxblood);}
    .grocery-item__name{
      flex:1;
      font-size:18px;
    }
    .grocery-item__qty{
      font-family:var(--mono);
      font-size:11.5px;
      color:var(--ink-faint);
      letter-spacing:0.04em;
      text-align:right;
    }
    .grocery-item__staple{
      font-family:var(--mono);
      font-size:8.5px;
      letter-spacing:0.22em;
      text-transform:uppercase;
      color:var(--gold);
      flex-shrink:0;
    }
    .grocery-item.bought{opacity:0.55;}
    .grocery-item.bought .grocery-item__name,
    .grocery-item.bought .grocery-item__qty{
      text-decoration:line-through;
      color:var(--ink-faint);
    }
    .grocery-item.bought .bought-toggle{
      background:var(--oxblood);
      color:var(--paper);
      border-color:var(--oxblood);
    }
    .grocery-empty{
      text-align:center;
      font-family:var(--hand);
      font-size:26px;
      color:var(--oxblood);
      padding:50px 0 20px;
      line-height:1.2;
    }
    .grocery-empty::before{
      content:'·  ·  ·';
      display:block;
      letter-spacing:0.4em;
      font-family:var(--mono);
      font-size:14px;
      color:var(--ink-faint);
      margin-bottom:16px;
    }

    .grocery-actions{
      display:flex;flex-wrap:wrap;gap:8px;
      margin-top:30px;
      padding-top:22px;
      border-top:1px solid var(--ink-faint);
    }
    .grocery-actions button{
      flex:1 1 auto;
      min-width:120px;
      background:var(--ink);
      color:var(--paper);
      border:1px solid var(--ink);
      padding:12px 14px;
      font-family:var(--mono);
      font-size:10.5px;
      letter-spacing:0.24em;
      text-transform:uppercase;
      cursor:pointer;
      border-radius:1px;
      font-weight:500;
      transition:all 0.18s;
    }
    .grocery-actions button:hover{background:var(--oxblood-deep);border-color:var(--oxblood-deep);}
    .grocery-actions button.ghost{background:transparent;color:var(--ink);}
    .grocery-actions button.ghost:hover{background:var(--ink);color:var(--paper);}
    .grocery-actions button.whatsapp{
      background:var(--sage);
      border-color:var(--sage);
      display:inline-flex;align-items:center;justify-content:center;gap:8px;
    }
    .grocery-actions button.whatsapp:hover{background:#3a4a26;border-color:#3a4a26;}
    .grocery-actions button.whatsapp svg{width:14px;height:14px;fill:currentColor;flex-shrink:0;}
    .grocery-actions button.keep{
      background:var(--gold);
      border-color:var(--gold);
      display:inline-flex;align-items:center;justify-content:center;gap:8px;
    }
    .grocery-actions button.keep:hover{background:#806328;border-color:#806328;}
    .grocery-actions button.keep svg{
      width:14px;height:14px;
      stroke:currentColor;fill:none;stroke-width:2;
      stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;
    }

    .footnote{
      text-align:center;
      margin:38px auto 0;
      max-width:520px;
      font-size:13px;
      font-style:italic;
      color:var(--ink-faint);
      position:relative;z-index:2;
    }
    .footnote::before{
      content:'·  ·  ·';
      display:block;
      letter-spacing:0.4em;
      margin-bottom:8px;
      font-family:var(--mono);
      font-style:normal;
    }

    .flash{
      position:fixed;
      bottom:24px;left:50%;
      transform:translateX(-50%);
      background:var(--ink);
      color:var(--paper);
      padding:12px 22px;
      border-radius:2px;
      font-family:var(--mono);
      font-size:10.5px;
      letter-spacing:0.28em;
      text-transform:uppercase;
      z-index:100;
      animation:flashIn 0.3s ease;
      box-shadow:0 8px 20px var(--shadow);
    }
    @keyframes flashIn{
      from{opacity:0;transform:translate(-50%,8px);}
      to{opacity:1;transform:translate(-50%,0);}
    }

    @media (max-width:800px){
      body{padding:18px 8px 56px;}
      .arrow--prev{left:-2px;}
      .arrow--next{right:-2px;}
      .card{padding:42px 18px 40px;}
      .card__seal{width:36px;height:36px;font-size:9.5px;top:14px;left:14px;}
      .card__corner{top:14px;right:16px;}
      .card__numeral{font-size:16px;}
      .meal__title{font-size:22px;}
      .ingredient__qty{min-width:60px;font-size:9.5px;}
      .ingredient__name{font-size:15px;}
      .daily-totals b{font-size:18px;}
      .daily-totals{gap:4px;}
      .daily-totals span{font-size:8px;letter-spacing:0.18em;}
      .day-tab{padding:6px 11px;font-size:10px;letter-spacing:0.18em;}
      .filter-pill{padding:5px 10px;font-size:9.5px;}
      .filter-row__label{font-size:15px;}
    }
    @media (max-width:420px){
      .meal__header{flex-wrap:wrap;}
      .meal__macros{font-size:9.5px;gap:10px;}
      .grocery-actions{flex-direction:column;}
      .ingredient{flex-wrap:wrap;}
      .ingredient .ing-toggle{order:1;}
      .ingredient__name{order:2;flex-basis:calc(100% - 110px);min-width:0;}
      .ingredient__qty{order:3;width:100%;padding-left:0;}
      .ingredient__tag{order:4;}
      .ing-toggle__opt{padding:4px 7px;font-size:9px;letter-spacing:0.18em;min-width:34px;}
    }

    @media print{
      body{background:#fff;padding:0;}
      body::before,.day-tabs,.filter-row,.arrow,.grocery-actions,.footnote,.fab,.modal{display:none;}
      .card{position:static!important;opacity:1!important;page-break-after:always;box-shadow:none;transform:none!important;}
    }

    /* ============================================================
       Phase 2 — modals, swap, FAB, read-only
       ============================================================ */

    /* meal__title becomes the swap trigger (write mode) */
    body:not(.is-read-only) .meal__title{cursor:pointer;transition:color 0.15s ease;}
    body:not(.is-read-only) .meal__title:hover{color:var(--oxblood);}
    body:not(.is-read-only) .meal__title::after{
      content:'  ✎';
      font-family:var(--mono);
      font-size:0.55em;
      color:var(--ink-faint);
      letter-spacing:0;
      vertical-align:middle;
      transition:color 0.15s ease;
    }
    body:not(.is-read-only) .meal__title:hover::after{color:var(--oxblood);}

    /* Floating action buttons — bottom right */
    .fab{
      position:fixed;
      right:22px;bottom:22px;
      display:flex;flex-direction:column;gap:10px;
      z-index:80;
    }
    .fab__btn{
      width:56px;height:56px;
      border:1px solid var(--oxblood-deep);
      background:var(--paper);
      color:var(--oxblood);
      font-family:var(--display);
      font-size:28px;line-height:1;
      box-shadow:0 6px 18px var(--shadow),inset 0 0 0 4px var(--paper);
      cursor:pointer;
      border-radius:50%;
      display:flex;align-items:center;justify-content:center;
      transition:transform 0.15s ease,box-shadow 0.15s ease,background 0.15s ease;
      position:relative;
    }
    .fab__btn:hover{
      transform:translateY(-2px);
      background:var(--oxblood);
      color:var(--paper);
      box-shadow:0 10px 22px var(--shadow),inset 0 0 0 4px var(--oxblood);
    }
    .fab__btn::after{
      content:attr(data-label);
      position:absolute;
      right:calc(100% + 10px);top:50%;
      transform:translateY(-50%);
      background:var(--ink);
      color:var(--paper);
      padding:5px 11px;
      font-family:var(--mono);
      font-size:9.5px;letter-spacing:0.22em;
      text-transform:uppercase;
      white-space:nowrap;
      border-radius:2px;
      opacity:0;pointer-events:none;
      transition:opacity 0.15s ease;
    }
    .fab__btn:hover::after{opacity:1;}
    body.is-read-only .fab{display:none;}

    /* Modal scaffolding */
    .modal{
      position:fixed;inset:0;
      background:rgba(34,27,13,0.55);
      backdrop-filter:blur(4px);
      -webkit-backdrop-filter:blur(4px);
      z-index:90;
      display:none;
      align-items:flex-start;justify-content:center;
      padding:24px 12px;
      overflow-y:auto;
      animation:modalFade 0.2s ease;
    }
    .modal.is-open{display:flex;}
    @keyframes modalFade{from{opacity:0;}to{opacity:1;}}

    .modal__panel{
      position:relative;
      width:100%;max-width:640px;
      margin:24px auto auto;
      background:var(--paper);
      background-image:
        radial-gradient(ellipse 600px 400px at 0% 0%, rgba(218,180,120,0.4) 0%, transparent 60%),
        radial-gradient(ellipse 500px 500px at 100% 100%, rgba(180,140,90,0.28) 0%, transparent 60%);
      border:1px solid var(--rule);
      box-shadow:0 22px 60px rgba(34,27,13,0.45);
      padding:30px 30px 26px;
      animation:modalRise 0.25s cubic-bezier(0.2,0.7,0.3,1);
    }
    @keyframes modalRise{
      from{transform:translateY(14px);opacity:0;}
      to{transform:translateY(0);opacity:1;}
    }
    .modal__panel::before{
      content:'';
      position:absolute;inset:0;
      pointer-events:none;
      background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.10 0 0 0 0 0.05 0 0 0 0.55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
      opacity:0.18;mix-blend-mode:multiply;
    }
    .modal__panel > *{position:relative;z-index:1;}

    .modal__pre{
      font-family:var(--mono);
      font-size:10px;letter-spacing:0.42em;
      text-transform:uppercase;color:var(--oxblood);
      margin:0 0 8px;
    }
    .modal__title{
      font-family:var(--display);
      font-size:clamp(28px,5vw,38px);
      margin:0 0 4px;line-height:1;
      letter-spacing:0.005em;font-weight:400;
    }
    .modal__sub{
      font-family:var(--body);font-style:italic;
      color:var(--ink-soft);margin:0 0 18px;
      font-size:15px;
    }
    .modal__close{
      position:absolute;top:14px;right:16px;
      width:32px;height:32px;
      background:transparent;
      border:1px solid var(--rule);
      color:var(--ink-soft);
      font-family:var(--mono);font-size:14px;line-height:1;
      cursor:pointer;
      border-radius:50%;
      transition:all 0.15s ease;
      z-index:2;
    }
    .modal__close:hover{border-color:var(--oxblood);color:var(--oxblood);}

    /* Swap recipe list */
    .swap-list{
      list-style:none;margin:0;padding:0;
      display:grid;gap:10px;
      max-height:60vh;overflow-y:auto;
      padding-right:4px;
    }
    .swap-list__empty{
      padding:32px 12px;text-align:center;
      color:var(--ink-soft);font-style:italic;
    }
    .swap-card{
      border:1px solid var(--rule);
      background:rgba(255,253,247,0.55);
      padding:14px 16px;
      cursor:pointer;
      transition:border-color 0.15s ease,background 0.15s ease,transform 0.12s ease;
      display:flex;flex-direction:column;gap:4px;
      text-align:left;
      font-family:var(--body);
      width:100%;
    }
    .swap-card:hover{border-color:var(--oxblood);background:rgba(255,253,247,0.85);}
    .swap-card.is-current{border-color:var(--oxblood);background:rgba(110,30,30,0.06);}
    .swap-card__name{
      font-family:var(--display);font-size:21px;line-height:1.1;
      color:var(--ink);
    }
    .swap-card__sub{
      font-style:italic;color:var(--ink-soft);font-size:14px;
    }
    .swap-card__meta{
      display:flex;gap:14px;flex-wrap:wrap;
      font-family:var(--mono);font-size:9.5px;letter-spacing:0.18em;
      text-transform:uppercase;color:var(--ink-faint);
      margin-top:4px;
    }
    .swap-card__current-tag{
      display:inline-block;
      font-family:var(--mono);font-size:8.5px;letter-spacing:0.28em;
      text-transform:uppercase;color:var(--oxblood);
      margin-left:6px;
    }

    /* Paste modal */
    .paste-area{
      width:100%;min-height:240px;
      font-family:var(--mono);font-size:13px;line-height:1.5;
      padding:14px;
      border:1px solid var(--rule);
      background:rgba(255,253,247,0.55);
      color:var(--ink);
      resize:vertical;
      box-sizing:border-box;
    }
    .paste-area:focus{outline:none;border-color:var(--oxblood);background:rgba(255,253,247,0.85);}
    .paste-hint{
      font-size:13px;color:var(--ink-soft);font-style:italic;
      margin:4px 0 12px;
    }

    /* Recipe form */
    .rec-form{display:grid;gap:16px;}
    .rec-form__row{display:grid;gap:6px;}
    .rec-form__row--inline{
      display:grid;grid-template-columns:repeat(2,1fr);gap:14px;
    }
    .rec-form__row--three{
      display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
    }
    @media (max-width:600px){
      .rec-form__row--three{grid-template-columns:1fr;}
    }
    .rec-form__row--macros{
      display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
    }
    .rec-form__row--ingredients{display:grid;gap:6px;}
    .rec-form__label{
      font-family:var(--mono);font-size:9.5px;letter-spacing:0.28em;
      text-transform:uppercase;color:var(--oxblood);
    }
    .rec-form__input,
    .rec-form__select,
    .rec-form__textarea{
      width:100%;
      font-family:var(--body);font-size:16px;line-height:1.4;
      padding:9px 11px;
      border:1px solid var(--rule);
      background:rgba(255,253,247,0.55);
      color:var(--ink);
      box-sizing:border-box;
      border-radius:0;
    }
    .rec-form__input:focus,
    .rec-form__select:focus,
    .rec-form__textarea:focus{
      outline:none;border-color:var(--oxblood);
      background:rgba(255,253,247,0.85);
    }
    .rec-form__textarea{resize:vertical;min-height:80px;font-family:var(--body);font-size:15px;line-height:1.55;}

    .ing-row{
      display:grid;
      grid-template-columns:90px 1fr 110px 60px 28px;
      gap:6px;align-items:center;
    }
    .ing-row__staple{
      display:flex;align-items:center;justify-content:center;
      font-family:var(--mono);font-size:9px;letter-spacing:0.2em;
      text-transform:uppercase;color:var(--ink-soft);
      gap:4px;
    }
    .ing-row__staple input{margin:0;}
    .ing-row__del{
      width:28px;height:28px;
      border:1px solid var(--rule);background:transparent;
      color:var(--ink-soft);cursor:pointer;
      font-family:var(--mono);font-size:14px;line-height:1;
      transition:all 0.12s ease;
      padding:0;
    }
    .ing-row__del:hover{border-color:var(--oxblood);color:var(--oxblood);}
    .ing-add{
      align-self:start;justify-self:start;
      background:transparent;border:1px dashed var(--rule);
      padding:6px 12px;
      font-family:var(--mono);font-size:10px;letter-spacing:0.24em;
      text-transform:uppercase;color:var(--ink-soft);
      cursor:pointer;
      transition:all 0.12s ease;
    }
    .ing-add:hover{border-color:var(--oxblood);color:var(--oxblood);border-style:solid;}

    .rec-form__error{
      font-family:var(--body);font-style:italic;
      font-size:14px;color:var(--oxblood);
      margin:0;
    }

    .modal__actions{
      display:flex;gap:10px;flex-wrap:wrap;
      margin-top:22px;padding-top:18px;
      border-top:1px solid var(--rule-soft);
    }
    .btn-primary,
    .btn-secondary,
    .btn-ghost{
      font-family:var(--mono);
      font-size:10.5px;letter-spacing:0.26em;
      text-transform:uppercase;
      padding:11px 22px;
      cursor:pointer;
      transition:all 0.15s ease;
      border-radius:0;
    }
    .btn-primary{
      background:var(--oxblood);color:var(--paper);
      border:1px solid var(--oxblood-deep);
    }
    .btn-primary:hover{background:var(--oxblood-deep);}
    .btn-primary:disabled{opacity:0.5;cursor:not-allowed;}
    .btn-secondary{
      background:transparent;color:var(--oxblood);
      border:1px solid var(--oxblood);
    }
    .btn-secondary:hover{background:var(--oxblood);color:var(--paper);}
    .btn-ghost{
      background:transparent;color:var(--ink-soft);
      border:1px solid var(--rule);
    }
    .btn-ghost:hover{border-color:var(--ink);color:var(--ink);}
    .btn-ghost.is-pushing-right{margin-left:auto;}

    .parse-spinner{
      display:none;align-items:center;gap:10px;
      font-family:var(--mono);font-size:11px;letter-spacing:0.22em;
      text-transform:uppercase;color:var(--ink-soft);
    }
    .parse-spinner.is-on{display:inline-flex;}
    .parse-spinner__dot{
      width:8px;height:8px;border-radius:50%;
      background:var(--oxblood);
      animation:pulse 1.2s ease-in-out infinite;
    }
    @keyframes pulse{0%,100%{opacity:0.3;}50%{opacity:1;}}

    /* Read-only banner */
    .read-only-badge{
      display:none;
      position:fixed;top:8px;right:8px;
      background:var(--ink);color:var(--paper);
      font-family:var(--mono);font-size:9.5px;letter-spacing:0.28em;
      text-transform:uppercase;
      padding:6px 12px;border-radius:2px;
      z-index:60;
      box-shadow:0 4px 12px var(--shadow);
    }
    body.is-read-only .read-only-badge{display:block;}

    @media (max-width:600px){
      .modal__panel{padding:22px 18px 18px;margin-top:8px;}
      .modal__close{top:10px;right:10px;}
      .ing-row{grid-template-columns:1fr 1fr;gap:6px;}
      .ing-row__qty{grid-column:1/2;}
      .ing-row__name{grid-column:1/3;}
      .ing-row__cat{grid-column:1/2;}
      .ing-row__staple{grid-column:2/3;justify-content:flex-start;}
      .ing-row__del{grid-column:1/3;justify-self:end;}
      .rec-form__row--inline{grid-template-columns:1fr;}
      .rec-form__row--macros{grid-template-columns:repeat(2,1fr);}
      .fab{right:14px;bottom:14px;}
      .fab__btn{width:50px;height:50px;font-size:24px;}
    }

    /* ============================================================
       Import chooser + URL + Image
       ============================================================ */
    .import-list{
      list-style:none;margin:0;padding:0;
      display:grid;gap:10px;
    }
    .import-card{
      display:flex;align-items:flex-start;gap:14px;
      width:100%;text-align:left;
      padding:14px 16px;
      background:rgba(255,253,247,0.55);
      border:1px solid var(--rule);
      cursor:pointer;
      transition:border-color 0.15s ease,background 0.15s ease,transform 0.12s ease;
      font-family:var(--body);
      color:var(--ink);
    }
    .import-card:hover:not(.is-disabled){
      border-color:var(--oxblood);
      background:rgba(255,253,247,0.9);
    }
    .import-card.is-disabled{
      opacity:0.55;cursor:not-allowed;
    }
    .import-card__icon{
      font-size:24px;line-height:1;
      width:42px;height:42px;
      display:flex;align-items:center;justify-content:center;
      border:1px solid var(--rule);
      background:var(--paper);
      flex-shrink:0;
    }
    .import-card__body{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0;}
    .import-card__title{
      font-family:var(--display);
      font-size:21px;line-height:1.1;
      color:var(--ink);
    }
    .import-card__hint{
      font-style:italic;
      font-size:14px;
      color:var(--ink-soft);
      line-height:1.4;
    }
    .import-card__pill{
      display:inline-block;
      font-family:var(--mono);font-size:8.5px;letter-spacing:0.26em;
      text-transform:uppercase;color:var(--oxblood);
      vertical-align:middle;
      margin-left:6px;
      padding:2px 7px;
      border:1px solid var(--oxblood);
      background:transparent;
    }

    .drop-zone{
      position:relative;
      border:2px dashed var(--rule);
      background:rgba(255,253,247,0.55);
      padding:30px 20px;
      text-align:center;
      cursor:pointer;
      transition:border-color 0.15s ease,background 0.15s ease;
      margin-bottom:6px;
    }
    .drop-zone:hover,
    .drop-zone:focus,
    .drop-zone.is-dragover{
      outline:none;
      border-color:var(--oxblood);
      background:rgba(255,253,247,0.85);
    }
    .drop-zone__icon{
      font-size:36px;line-height:1;margin-bottom:8px;
    }
    .drop-zone__title{
      font-family:var(--display);
      font-size:22px;
      margin:6px 0 4px;
    }
    .drop-zone__hint{
      font-style:italic;
      color:var(--ink-soft);
      font-size:14px;
      margin:0 0 6px;
    }
    .drop-zone__pick{
      background:none;border:0;padding:0;
      font:inherit;font-style:italic;
      color:var(--oxblood);
      cursor:pointer;
      text-decoration:underline;
      text-decoration-style:dotted;
      text-underline-offset:3px;
    }
    .drop-zone__pick:hover{color:var(--oxblood-deep);}
    .drop-zone__formats{
      font-family:var(--mono);font-size:9.5px;letter-spacing:0.22em;
      text-transform:uppercase;color:var(--ink-faint);
      margin:6px 0 0;
    }
    .drop-zone__preview{
      display:flex;flex-direction:column;align-items:center;gap:10px;
    }
    .drop-zone__preview img{
      max-width:100%;max-height:300px;
      border:1px solid var(--rule);
      background:var(--paper);
    }
    .drop-zone__meta{
      font-family:var(--mono);font-size:10px;letter-spacing:0.22em;
      text-transform:uppercase;color:var(--ink-soft);
    }

    @media (max-width:600px){
      .import-card{padding:12px 12px;gap:10px;}
      .import-card__icon{width:36px;height:36px;font-size:20px;}
      .import-card__title{font-size:18px;}
      .import-card__hint{font-size:13px;}
      .drop-zone{padding:22px 14px;}
      .drop-zone__icon{font-size:30px;}
      .drop-zone__title{font-size:18px;}
    }
