/* ============================================================
   GRUB MONKEYS — PREMIUM MOBILE MENU MOTION
   Mobile-first art direction for /menu. Uses existing menu data/assets.
   Core content is never collapsed or shortened on mobile.
   ============================================================ */

body[data-page="menu"]{
  --gm-menu-ink:#252524;
  --gm-menu-paper:#F0EFE9;
  --gm-menu-red:#EB0000;
  --gm-menu-teal:#00DDC2;
  --gm-menu-ease:cubic-bezier(.16,1,.3,1);
  --gm-menu-snap:cubic-bezier(.2,.82,.24,1);
}

/* Hero treatment is intentionally mobile-only. Desktop remains pixel-compatible with the original page. */
@media (max-width:900px){
body[data-page="menu"] .menu-page-hero{ isolation:isolate; overflow:hidden; }
body[data-page="menu"] .menu-page-hero::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(110deg,rgba(0,0,0,.08),transparent 34%,rgba(255,255,255,.045) 54%,transparent 72%),repeating-linear-gradient(0deg,rgba(240,239,233,.018) 0 1px,transparent 1px 4px); mix-blend-mode:screen; }
}

@media (max-width:900px){
  body[data-page="menu"] .menu-section#menu{
    position:relative;
    padding:54px 0 82px;
    overflow:clip;
    background:
      radial-gradient(circle at 86% 5%,rgba(235,0,0,.13),transparent 27rem),
      #292928;
  }

  body[data-page="menu"] .menu-section#menu::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.18;
    background-image:
      radial-gradient(circle at 20% 18%,rgba(240,239,233,.18) 0 .55px,transparent .7px),
      radial-gradient(circle at 71% 63%,rgba(240,239,233,.11) 0 .55px,transparent .7px);
    background-size:29px 31px,43px 47px;
  }

  body[data-page="menu"] .menu-section#menu > *{position:relative;z-index:2}

  body[data-page="menu"] .menu-head{
    padding:0 var(--pad-x) 22px;
  }
  body[data-page="menu"] .menu-head .menu-department-title{
    max-width:10ch;
    margin:0;
    line-height:.86;
    letter-spacing:-.025em;
  }

  /* Sticky selector: behaves like a physical diner station strip. */
  body[data-page="menu"] .menu-wrap{
    max-width:none;
    padding:0;
  }
  body[data-page="menu"] .menu-tabs{
    position:sticky;
    top:62px;
    z-index:45;
    display:flex;
    flex-wrap:nowrap;
    gap:7px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    margin:0;
    padding:10px max(var(--pad-x),16px) 11px;
    border:0;
    background:rgba(35,35,34,.965);
    box-shadow:0 1px 0 rgba(240,239,233,.12),0 12px 26px rgba(0,0,0,.18);
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);
  }
  body[data-page="menu"] .menu-tabs::-webkit-scrollbar{display:none}
  body[data-page="menu"] .menu-tabs::after{
    content:"";
    flex:0 0 max(var(--pad-x),16px);
  }
  body[data-page="menu"] .menu-tab{
    position:relative;
    min-height:48px;
    flex:0 0 auto;
    scroll-snap-align:center;
    display:grid;
    grid-template-columns:auto auto;
    align-items:center;
    gap:8px;
    padding:10px 13px 9px;
    border:1px solid rgba(240,239,233,.18);
    border-radius:2px;
    background:#313130;
    color:rgba(240,239,233,.78);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
    font-size:.68rem;
    line-height:1;
    letter-spacing:.035em;
    white-space:nowrap;
    transform:translateZ(0);
    transition:
      transform 180ms var(--gm-menu-snap),
      background 260ms var(--gm-menu-ease),
      color 260ms ease,
      border-color 260ms ease,
      box-shadow 260ms ease;
  }
  body[data-page="menu"] .menu-tab::before{
    content:"";
    position:absolute;
    left:8px;
    right:8px;
    bottom:-1px;
    height:3px;
    background:var(--gm-menu-teal);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform 420ms var(--gm-menu-ease);
  }
  body[data-page="menu"] .menu-tab .jcode{
    min-width:24px;
    color:var(--gm-menu-teal);
    font-size:.78rem;
  }
  body[data-page="menu"] .menu-tab.active,
  body[data-page="menu"] .menu-tab[aria-selected="true"]{
    background:var(--gm-menu-red);
    border-color:var(--gm-menu-red);
    color:#fff;
    box-shadow:0 6px 16px rgba(235,0,0,.18),inset 0 1px 0 rgba(255,255,255,.12);
  }
  body[data-page="menu"] .menu-tab.active::before,
  body[data-page="menu"] .menu-tab[aria-selected="true"]::before{transform:scaleX(1)}
  body[data-page="menu"] .menu-tab.active .jcode,
  body[data-page="menu"] .menu-tab[aria-selected="true"] .jcode{color:#fff}
  body[data-page="menu"] .menu-tab:active{transform:translateY(1px) scale(.985)}

  body[data-page="menu"] .menu-body{
    display:block;
    margin-top:0;
  }
  body[data-page="menu"] .menu-body > div:first-child{display:block}
  body[data-page="menu"] .menu-preview-col{display:none!important}

  /* On mobile every department is part of one continuous menu.

     content-visibility:auto is deliberately not used here: its
     placeholder height is always far short of a real panel's rendered
     height (often 1900px+, department-dependent), so as each panel's
     true size is revealed on scroll the whole page jumps under the
     visitor, and it desyncs the active-tab tracking below (which reads
     real layout). Eight short panels cost nothing to lay out upfront. */
  body[data-page="menu"] .menu-panel,
  body[data-page="menu"] .menu-panel[hidden],
  body[data-page="menu"] .menu-panel.active{
    display:block!important;
    position:relative;
    min-height:0;
    padding:34px var(--pad-x) 62px;
    border:0;
    outline:0;
    overflow:clip;
  }
  body[data-page="menu"] .menu-panel + .menu-panel{
    border-top:1px solid rgba(240,239,233,.15);
  }
  body[data-page="menu"] .menu-panel::after{
    content:"";
    position:absolute;
    left:var(--pad-x);
    right:var(--pad-x);
    bottom:0;
    height:1px;
    background:linear-gradient(90deg,var(--gm-menu-red) 0 18%,rgba(240,239,233,.15) 18% 100%);
    transform:scaleX(.15);
    transform-origin:left;
    opacity:.5;
    transition:transform 900ms var(--gm-menu-ease),opacity 600ms ease;
  }
  body[data-page="menu"] .menu-panel.gm-inview::after{transform:scaleX(1);opacity:1}

  /* Art-directed chapter card generated from the existing tab image. */
  body[data-page="menu"] .gm-menu-chapter{
    position:relative;
    height:clamp(250px,72vw,390px);
    margin:0 0 30px;
    overflow:hidden;
    border:2px solid #151515;
    background:#181818;
    box-shadow:9px 10px 0 rgba(235,0,0,.86),0 22px 42px rgba(0,0,0,.22);
    isolation:isolate;
    transform:translateY(22px);
    opacity:0;
    transition:transform 850ms var(--gm-menu-ease),opacity 520ms ease;
  }
  body[data-page="menu"] .gm-menu-chapter::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:
      linear-gradient(180deg,rgba(0,0,0,.04) 10%,rgba(0,0,0,.14) 46%,rgba(0,0,0,.82) 100%),
      linear-gradient(90deg,rgba(235,0,0,.5),transparent 35%);
    pointer-events:none;
  }
  body[data-page="menu"] .gm-menu-chapter::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:5;
    pointer-events:none;
    opacity:.11;
    background:repeating-linear-gradient(0deg,rgba(255,255,255,.3) 0 1px,transparent 1px 4px);
    mix-blend-mode:soft-light;
  }
  body[data-page="menu"] .gm-menu-chapter__image{
    position:absolute;
    inset:-4%;
    width:108%;
    height:108%;
    object-fit:cover;
    transform:scale(1.075) translate3d(0,18px,0);
    filter:saturate(.88) contrast(1.04);
    clip-path:inset(0 100% 0 0);
    transition:
      clip-path 950ms var(--gm-menu-ease),
      transform 1250ms var(--gm-menu-ease),
      filter 900ms ease;
  }
  body[data-page="menu"] .gm-menu-chapter__wipe{
    position:absolute;
    z-index:4;
    inset:0;
    background:var(--gm-menu-red);
    transform:translateX(0);
    transform-origin:right;
    transition:transform 1000ms var(--gm-menu-ease) 80ms;
  }
  body[data-page="menu"] .gm-menu-chapter__code{
    position:absolute;
    z-index:6;
    top:15px;
    left:15px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 9px 6px;
    border:1px solid rgba(240,239,233,.66);
    background:rgba(28,28,27,.8);
    color:var(--gm-menu-paper);
    font-family:var(--f-body);
    font-size:.58rem;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
    transform:translateY(-8px);
    opacity:0;
    transition:transform 520ms var(--gm-menu-ease) 300ms,opacity 400ms ease 300ms;
  }
  body[data-page="menu"] .gm-menu-chapter__code i{
    width:6px;height:6px;border-radius:50%;background:var(--gm-menu-teal);box-shadow:0 0 0 3px rgba(0,221,194,.12)
  }
  body[data-page="menu"] .gm-menu-chapter__title{
    position:absolute;
    z-index:6;
    left:16px;
    right:16px;
    bottom:16px;
    margin:0;
    color:var(--gm-menu-paper);
    font-family:var(--f-display);
    font-size:clamp(2.55rem,12vw,4.75rem);
    line-height:.84;
    text-transform:uppercase;
    letter-spacing:-.03em;
  }
  body[data-page="menu"] .gm-menu-chapter__title span{
    display:block;
    transform:translateY(112%);
    transition:transform 780ms var(--gm-menu-ease) 250ms;
  }
  body[data-page="menu"] .gm-menu-chapter__title b{
    display:block;
    overflow:hidden;
    font-weight:400;
  }
  body[data-page="menu"] .gm-menu-chapter__ghost{
    position:absolute;
    z-index:3;
    right:-5px;
    top:-18px;
    color:rgba(240,239,233,.13);
    font-family:var(--f-display);
    font-size:clamp(7rem,34vw,13rem);
    line-height:1;
    transform:translate3d(12px,-8px,0);
    transition:transform 1150ms var(--gm-menu-ease);
  }

  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter{transform:none;opacity:1}
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__image{
    clip-path:inset(0 0 0 0);
    transform:scale(1.015) translate3d(0,0,0);
    filter:saturate(1) contrast(1.04);
  }
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__wipe{transform:translateX(103%)}
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__title span{transform:translateY(0)}
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__code{transform:none;opacity:1}
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__ghost{transform:translate3d(0,0,0)}

  /* Menu groups become restrained printed ledgers. */
  body[data-page="menu"] .menu-group{
    position:relative;
    margin:0 0 16px;
    padding:19px 16px 14px;
    background:var(--gm-menu-paper);
    border:1px solid rgba(0,0,0,.15);
    box-shadow:4px 5px 0 rgba(0,0,0,.14);
    color:var(--gm-menu-ink);
    opacity:0;
    transform:translate3d(0,14px,0);
    transition:opacity 500ms ease,transform 720ms var(--gm-menu-ease);
  }
  body[data-page="menu"] .menu-group::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.18;
    background-image:
      radial-gradient(circle at 14% 22%,rgba(58,58,58,.24) 0 .45px,transparent .65px),
      radial-gradient(circle at 77% 62%,rgba(235,0,0,.14) 0 .45px,transparent .65px);
    background-size:27px 31px,39px 41px;
  }
  body[data-page="menu"] .menu-panel.gm-inview .menu-group{opacity:1;transform:none}
  body[data-page="menu"] .menu-panel.gm-inview .menu-group:nth-of-type(2){transition-delay:80ms}
  body[data-page="menu"] .menu-panel.gm-inview .menu-group:nth-of-type(3){transition-delay:140ms}
  body[data-page="menu"] .menu-panel.gm-inview .menu-group:nth-of-type(4){transition-delay:200ms}
  body[data-page="menu"] .menu-panel.gm-inview .menu-group:nth-of-type(5){transition-delay:250ms}

  body[data-page="menu"] .menu-group-title{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
    width:100%;
    margin:0 0 8px;
    padding:0 0 10px;
    border-bottom:2px solid var(--gm-menu-red);
    color:var(--gm-menu-red);
    font-size:1.28rem;
    line-height:1;
    letter-spacing:.005em;
  }
  body[data-page="menu"] .menu-group-title::after{
    content:"KITCHEN / 69";
    color:rgba(58,58,58,.48);
    font-family:var(--f-body);
    font-size:.47rem;
    font-weight:800;
    letter-spacing:.12em;
    white-space:nowrap;
  }

  body[data-page="menu"] .menu-row{
    position:relative;
    z-index:2;
    display:flex;
    align-items:baseline;
    gap:8px;
    min-height:38px;
    padding:8px 0 7px;
    border-bottom:1px solid rgba(58,58,58,.16);
    color:var(--gm-menu-ink);
    font-size:.84rem;
    opacity:0;
    transform:translate3d(0,7px,0);
    transition:
      opacity 390ms ease,
      transform 540ms var(--gm-menu-ease),
      padding-left 180ms var(--gm-menu-snap),
      background 180ms ease;
  }
  body[data-page="menu"] .menu-group.gm-rows-in .menu-row{opacity:1;transform:none}
  body[data-page="menu"] .menu-group.gm-rows-in .menu-row:nth-child(2){transition-delay:20ms}
  body[data-page="menu"] .menu-group.gm-rows-in .menu-row:nth-child(3){transition-delay:42ms}
  body[data-page="menu"] .menu-group.gm-rows-in .menu-row:nth-child(4){transition-delay:64ms}
  body[data-page="menu"] .menu-group.gm-rows-in .menu-row:nth-child(5){transition-delay:86ms}
  body[data-page="menu"] .menu-group.gm-rows-in .menu-row:nth-child(6){transition-delay:108ms}
  body[data-page="menu"] .menu-group.gm-rows-in .menu-row:nth-child(n+7){transition-delay:130ms}

  body[data-page="menu"] .menu-row .name{color:#343432;font-weight:560;line-height:1.35}
  body[data-page="menu"] .menu-row.multi .name{color:#595753;font-size:.78rem;line-height:1.45}
  body[data-page="menu"] .menu-row .leader{border-bottom-color:rgba(58,58,58,.25)}
  body[data-page="menu"] .menu-row .price{color:#222;font-size:.82rem;font-weight:800}
  body[data-page="menu"] .menu-row .dot{box-shadow:0 0 0 1px rgba(0,0,0,.14)}
  body[data-page="menu"] .menu-row:active{
    padding-left:4px;
    background:rgba(235,0,0,.035);
  }

  body[data-page="menu"] .menu-note{
    margin:0 0 16px;
    padding:11px 13px;
    border-left:3px solid var(--gm-menu-teal);
    background:rgba(240,239,233,.07);
    color:rgba(240,239,233,.72);
    font-size:.72rem;
    line-height:1.5;
  }

  /* The split board becomes a compact status instrument, not a hero block. */
  body[data-page="menu"] .menu-split-board{
    margin-top:20px;
    transform:translateY(8px);
  }

  /* Hero motion: weighted and subtle, no scroll-jacking. */
  body[data-page="menu"] .menu-page-hero .page-hero-copy{
    animation:gmMenuHeroCopy 900ms var(--gm-menu-ease) both;
  }
  body[data-page="menu"] .menu-page-hero > img{
    transform:scale(1.045);
    animation:gmMenuHeroImage 1400ms var(--gm-menu-ease) both;
  }
  @keyframes gmMenuHeroCopy{
    from{opacity:0;transform:translate3d(0,22px,0)}
    to{opacity:1;transform:none}
  }
  @keyframes gmMenuHeroImage{
    from{opacity:.45;transform:scale(1.11) translate3d(0,14px,0)}
    to{opacity:1;transform:scale(1.045) translate3d(0,0,0)}
  }

  /* Slightly richer ending so the menu doesn't just stop. */
  body[data-page="menu"] .menu-order-band{
    position:relative;
    overflow:hidden;
  }
  body[data-page="menu"] .menu-order-band::before{
    content:"FEED THE INSTINCT";
    position:absolute;
    right:-.04em;
    bottom:-.25em;
    color:rgba(240,239,233,.045);
    font-family:var(--f-display);
    font-size:clamp(4.5rem,22vw,9rem);
    line-height:.8;
    white-space:nowrap;
    pointer-events:none;
  }
}

@media (max-width:420px){
  body[data-page="menu"] .menu-tabs{top:58px;padding-left:14px;padding-right:14px}
  body[data-page="menu"] .menu-panel{padding-left:14px;padding-right:14px}
  body[data-page="menu"] .gm-menu-chapter{height:76vw;min-height:245px}
  body[data-page="menu"] .menu-group{padding:17px 13px 12px}
  body[data-page="menu"] .menu-row{font-size:.8rem;gap:7px}
  body[data-page="menu"] .menu-row .price{font-size:.78rem}
}

@media (prefers-reduced-motion:reduce){
  body[data-page="menu"] .menu-page-hero .page-hero-copy,
  body[data-page="menu"] .menu-page-hero > img,
  body[data-page="menu"] .menu-tab,
  body[data-page="menu"] .menu-panel::after,
  body[data-page="menu"] .gm-menu-chapter,
  body[data-page="menu"] .gm-menu-chapter__image,
  body[data-page="menu"] .gm-menu-chapter__wipe,
  body[data-page="menu"] .gm-menu-chapter__code,
  body[data-page="menu"] .gm-menu-chapter__title span,
  body[data-page="menu"] .gm-menu-chapter__ghost,
  body[data-page="menu"] .menu-group,
  body[data-page="menu"] .menu-row{
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }
  body[data-page="menu"] .gm-menu-chapter,
  body[data-page="menu"] .gm-menu-chapter__code,
  body[data-page="menu"] .menu-group,
  body[data-page="menu"] .menu-row{opacity:1!important}
  body[data-page="menu"] .gm-menu-chapter__image{clip-path:none!important}
  body[data-page="menu"] .gm-menu-chapter__wipe{display:none!important}
  body[data-page="menu"] .gm-menu-chapter__title span{transform:none!important}
}


/* === GRUB MONKEYS PREMIUM MENU V2 / MOBILE ART DIRECTION === */
@media (max-width:900px){
  body[data-page="menu"] .gm-menu-instrument{position:fixed;z-index:44;right:12px;bottom:18px;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;width:min(232px,calc(100vw - 24px));min-height:52px;overflow:hidden;border:1px solid rgba(240,239,233,.2);background:rgba(25,25,24,.94);box-shadow:0 14px 34px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.04);color:var(--gm-menu-paper);opacity:0;transform:translate3d(0,12px,0);transition:opacity .35s ease,transform .55s var(--gm-menu-ease);pointer-events:none}
  body[data-page="menu"] .gm-menu-instrument.is-on{opacity:1;transform:none}
  body[data-page="menu"] .gm-menu-instrument__num{height:52px;overflow:hidden;border-right:1px solid rgba(240,239,233,.14);background:var(--gm-menu-red);font-family:var(--f-display);font-size:1.55rem;line-height:52px;text-align:center}
  body[data-page="menu"] .gm-menu-instrument__num span{display:block;height:52px;transition:transform .48s cubic-bezier(.22,.8,.22,1)}
  body[data-page="menu"] .gm-menu-instrument.is-rolling .gm-menu-instrument__num span{transform:translateY(-52px)}
  body[data-page="menu"] .gm-menu-instrument__label{min-width:0;padding:0 12px;font-family:var(--f-body);font-size:.58rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body[data-page="menu"] .gm-menu-instrument__label::before{content:"NOW SERVING / ";color:var(--gm-menu-teal)}

  /* Editorial compositions: deliberately varied, never one repeated card template. */
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter{height:clamp(285px,82vw,430px);margin-left:calc(var(--pad-x) * -1);margin-right:calc(var(--pad-x) * -1);border-left:0;border-right:0;box-shadow:0 22px 44px rgba(0,0,0,.24)}
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter__title{left:var(--pad-x);right:30%;bottom:22px}
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter__ghost{right:auto;left:-12px;top:auto;bottom:-30px}

  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter{width:84%;margin-left:auto;height:clamp(300px,88vw,455px);box-shadow:-10px 11px 0 rgba(240,239,233,.92),0 24px 44px rgba(0,0,0,.24)}
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter::before{background:linear-gradient(180deg,transparent 18%,rgba(0,0,0,.18) 48%,rgba(0,0,0,.86)),linear-gradient(90deg,transparent 40%,rgba(235,0,0,.34))}
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter__code{left:auto;right:14px}
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter__title{left:-18%;right:10px}

  body[data-page="menu"] .menu-panel:nth-of-type(4n+4) .gm-menu-chapter{height:clamp(225px,62vw,340px);box-shadow:10px 11px 0 rgba(0,221,194,.82),0 22px 42px rgba(0,0,0,.22)}
  body[data-page="menu"] .menu-panel:nth-of-type(4n+4) .gm-menu-chapter__title{max-width:72%}

  /* Alternating cinematic reveal direction. */
  body[data-page="menu"] .menu-panel:nth-of-type(even) .gm-menu-chapter__image{clip-path:inset(0 0 0 100%)}
  body[data-page="menu"] .menu-panel:nth-of-type(even).gm-inview .gm-menu-chapter__image{clip-path:inset(0)}
  body[data-page="menu"] .menu-panel:nth-of-type(even).gm-inview .gm-menu-chapter__wipe{transform:translateX(-103%)}

  /* Brief old-print registration snap on category typography. */
  body[data-page="menu"] .gm-menu-chapter__title b{position:relative}
  body[data-page="menu"] .gm-menu-chapter__title b::before{content:attr(data-gm-title);position:absolute;inset:0;color:var(--gm-menu-red);opacity:0;transform:translate3d(-5px,2px,0);mix-blend-mode:screen;pointer-events:none}
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__title b::before{animation:gmRegister .46s steps(3,end) .48s both}
  @keyframes gmRegister{0%{opacity:.7;transform:translate3d(-6px,2px,0)}45%{opacity:.5;transform:translate3d(3px,-1px,0)}75%{opacity:.28;transform:translate3d(-1px,0,0)}100%{opacity:0;transform:none}}

  /* Tactile ledger rows. */
  body[data-page="menu"] .menu-row::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--gm-menu-red);transition:width .32s var(--gm-menu-ease)}
  body[data-page="menu"] .menu-row:active::after{width:100%}
  body[data-page="menu"] .menu-row .price{transition:transform .22s var(--gm-menu-ease),color .22s ease}
  body[data-page="menu"] .menu-row:active .price{transform:translateX(-3px);color:var(--gm-menu-red)}

  /* Sparse registration marks / bookends. */
  body[data-page="menu"] .menu-panel:nth-of-type(3n)::before{content:"+";position:absolute;right:8px;top:14px;color:rgba(0,221,194,.42);font:800 1rem/1 var(--f-body);transform:rotate(45deg)}
  body[data-page="menu"] .menu-panel:nth-of-type(3n+1)::before{content:"69";position:absolute;right:-.08em;top:.1em;color:rgba(240,239,233,.025);font:400 clamp(8rem,40vw,16rem)/.8 var(--f-display);pointer-events:none}
  body[data-page="menu"] .menu-panel:first-child{padding-top:44px}
  body[data-page="menu"] .menu-panel:last-child{padding-bottom:96px}
  body[data-page="menu"] .menu-panel:last-child::after{height:3px;background:linear-gradient(90deg,var(--gm-menu-red) 0 33%,var(--gm-menu-paper) 33% 66%,var(--gm-menu-teal) 66%)}
}
@media (max-width:420px){
  body[data-page="menu"] .gm-menu-instrument{right:10px;bottom:12px;width:min(218px,calc(100vw - 20px))}
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter{width:88%}
}
@media (prefers-reduced-motion:reduce){
  body[data-page="menu"] .gm-menu-instrument,body[data-page="menu"] .gm-menu-instrument__num span,body[data-page="menu"] .gm-menu-chapter__title b::before,body[data-page="menu"] .menu-row::after,body[data-page="menu"] .menu-row .price{animation:none!important;transition:none!important}
}

/* ============================================================
   FINAL REFINEMENT — QUIETER, MORE EXPENSIVE, LESS EFFECT-HEAVY
   ============================================================ */
@media (max-width:900px){
  /* Remove V2 overlay/instrument entirely. */
  body[data-page="menu"] .gm-menu-instrument{display:none!important}

  /* Category rail: typographic, slim, one moving registration line. */
  body[data-page="menu"] .menu-tabs{
    position:sticky;
    top:62px;
    gap:22px;
    padding:12px max(var(--pad-x),18px) 13px;
    background:rgba(37,37,36,.985);
    border-bottom:1px solid rgba(240,239,233,.14);
    box-shadow:0 8px 24px rgba(0,0,0,.15);
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  body[data-page="menu"] .menu-tabs::after{flex:0 0 max(var(--pad-x),18px)}
  body[data-page="menu"] .gm-menu-rail-indicator{
    position:absolute;
    left:0;
    bottom:0;
    height:3px;
    width:0;
    background:linear-gradient(90deg,var(--gm-menu-red) 0 82%,var(--gm-menu-teal) 82% 100%);
    transform:translate3d(0,0,0);
    transition:transform .5s var(--gm-menu-ease),width .5s var(--gm-menu-ease);
    pointer-events:none;
  }
  body[data-page="menu"] .menu-tab{
    min-height:34px;
    display:flex;
    gap:7px;
    padding:4px 0 6px;
    border:0;
    border-radius:0;
    background:transparent!important;
    box-shadow:none!important;
    color:rgba(240,239,233,.55);
    font-size:.66rem;
    letter-spacing:.055em;
  }
  body[data-page="menu"] .menu-tab::before{display:none}
  body[data-page="menu"] .menu-tab .jcode{min-width:0;color:rgba(0,221,194,.68);font-size:.69rem}
  body[data-page="menu"] .menu-tab.active,
  body[data-page="menu"] .menu-tab[aria-selected="true"]{color:#fff}
  body[data-page="menu"] .menu-tab.active .jcode,
  body[data-page="menu"] .menu-tab[aria-selected="true"] .jcode{color:var(--gm-menu-red)}
  body[data-page="menu"] .menu-tab:active{transform:translateY(1px)}

  /* Departments become one continuous printed sheet each.
     content-visibility:auto is intentionally omitted (see the earlier
     .menu-panel rule for why). */
  body[data-page="menu"] .menu-panel,
  body[data-page="menu"] .menu-panel[hidden],
  body[data-page="menu"] .menu-panel.active{
    margin:0 var(--pad-x) 30px;
    padding:0 0 24px;
    overflow:hidden;
    background:var(--gm-menu-paper);
    color:var(--gm-menu-ink);
    border:1px solid rgba(0,0,0,.18);
    box-shadow:0 20px 42px rgba(0,0,0,.18);
  }
  body[data-page="menu"] .menu-panel + .menu-panel{border-top:1px solid rgba(0,0,0,.18)}
  body[data-page="menu"] .menu-panel::after{display:none!important}
  body[data-page="menu"] .menu-panel::before{display:none!important}
  body[data-page="menu"] .menu-panel:first-child{padding-top:0}
  body[data-page="menu"] .menu-panel:last-child{padding-bottom:24px}

  /* One confident chapter system. No offset cards, no parallax, no giant colored shadows. */
  body[data-page="menu"] .gm-menu-chapter,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+4) .gm-menu-chapter{
    width:auto;
    height:clamp(235px,67vw,360px);
    min-height:0;
    margin:0 0 2px;
    border:0;
    box-shadow:none;
    background:#191918;
    transform:translateY(14px);
  }
  body[data-page="menu"] .gm-menu-chapter::before,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter::before{
    background:linear-gradient(180deg,rgba(0,0,0,.04) 5%,rgba(0,0,0,.12) 45%,rgba(0,0,0,.82) 100%);
  }
  body[data-page="menu"] .gm-menu-chapter::after{opacity:.055}
  body[data-page="menu"] .gm-menu-chapter__image,
  body[data-page="menu"] .menu-panel:nth-of-type(even) .gm-menu-chapter__image{
    inset:0;
    width:100%;
    height:100%;
    transform:scale(1.045);
    filter:saturate(.94) contrast(1.03);
    clip-path:inset(0 100% 0 0);
    transition:clip-path .8s var(--gm-menu-ease),transform 1.05s var(--gm-menu-ease);
    translate:none!important;
  }
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__image,
  body[data-page="menu"] .menu-panel:nth-of-type(even).gm-inview .gm-menu-chapter__image{
    clip-path:inset(0);
    transform:scale(1);
  }
  body[data-page="menu"] .gm-menu-chapter__wipe,
  body[data-page="menu"] .menu-panel:nth-of-type(even) .gm-menu-chapter__wipe{
    background:var(--gm-menu-red);
    transform:translateX(0);
    transition:transform .82s var(--gm-menu-ease) .04s;
  }
  body[data-page="menu"] .menu-panel.gm-inview .gm-menu-chapter__wipe,
  body[data-page="menu"] .menu-panel:nth-of-type(even).gm-inview .gm-menu-chapter__wipe{transform:translateX(103%)}
  body[data-page="menu"] .gm-menu-chapter__code,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter__code{
    top:16px;left:16px;right:auto;
    padding:0;
    border:0;
    background:transparent;
    font-size:.56rem;
    letter-spacing:.16em;
  }
  body[data-page="menu"] .gm-menu-chapter__code i{width:5px;height:5px;box-shadow:none}
  body[data-page="menu"] .gm-menu-chapter__title,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter__title,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter__title,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+4) .gm-menu-chapter__title{
    left:16px;right:16px;bottom:17px;
    max-width:9ch;
    font-size:clamp(2.7rem,12.2vw,4.6rem);
  }
  body[data-page="menu"] .gm-menu-chapter__ghost,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter__ghost{
    right:8px;left:auto;top:6px;bottom:auto;
    color:rgba(240,239,233,.09);
    font-size:clamp(6.8rem,31vw,11rem);
  }
  body[data-page="menu"] .gm-menu-chapter__title b::before{display:none!important}

  /* Wings image repeats the hero, so its chapter is intentionally type-led.
     Matched against every nth-of-type(...) .gm-menu-chapter combination
     above: those rules are grouped with the plain .gm-menu-chapter
     selector and set a flat background, which -- whenever the type-led
     chapter's own panel position happens to land on one of those
     variants -- outranks .gm-menu-chapter--type on specificity alone
     and silently wins regardless of source order, wiping the red
     diagonal down to a flat dark box (background:<color> resets
     background-image to none). */
  body[data-page="menu"] .gm-menu-chapter--type,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter--type,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter--type,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+4) .gm-menu-chapter--type{
    height:clamp(190px,49vw,270px);
    background:
      linear-gradient(135deg,rgba(235,0,0,.96) 0 34%,transparent 34%),
      linear-gradient(180deg,#222221,#171716);
  }
  body[data-page="menu"] .gm-menu-chapter--type::before{
    background:repeating-linear-gradient(0deg,rgba(240,239,233,.035) 0 1px,transparent 1px 5px);
  }
  body[data-page="menu"] .gm-menu-chapter--type .gm-menu-chapter__wipe{display:none}
  body[data-page="menu"] .gm-menu-chapter--type .gm-menu-chapter__ghost{color:rgba(240,239,233,.12)}
  body[data-page="menu"] .gm-menu-chapter--type .gm-menu-chapter__title{max-width:7ch}

  /* Continuous ledger: groups stop looking like stacked component cards. */
  body[data-page="menu"] .menu-group{
    margin:0 16px;
    padding:22px 0 4px;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    opacity:1;
    transform:none;
    transition:none;
  }
  body[data-page="menu"] .menu-group + .menu-group{
    margin-top:10px;
    border-top:1px solid rgba(58,58,58,.19);
  }
  body[data-page="menu"] .menu-group::before{display:none}
  body[data-page="menu"] .menu-group-title{
    margin-bottom:10px;
    padding-bottom:9px;
    border-bottom:1px solid var(--gm-menu-red);
    font-size:1.17rem;
  }
  body[data-page="menu"] .menu-group-title::after{
    content:"DINER MENU";
    font-size:.44rem;
    color:rgba(58,58,58,.42);
  }
  body[data-page="menu"] .menu-row{
    min-height:40px;
    padding:9px 0 8px;
    opacity:1;
    transform:none;
    transition:background .16s ease,padding-left .16s ease;
  }
  body[data-page="menu"] .menu-row::after{display:none}
  body[data-page="menu"] .menu-row .price{transition:color .16s ease;transform:none!important}
  body[data-page="menu"] .menu-row:active{padding-left:3px;background:rgba(235,0,0,.025)}
  body[data-page="menu"] .menu-row:active .price{color:var(--gm-menu-red)}

  body[data-page="menu"] .menu-note{
    margin:15px 16px 0;
    padding:10px 12px;
    color:#5b5955;
    background:rgba(58,58,58,.045);
    border-left:2px solid var(--gm-menu-teal);
  }

  /* Keep the close confident but quiet. */
  body[data-page="menu"] .menu-order-band::before{opacity:.7}
}

@media (max-width:420px){
  body[data-page="menu"] .menu-tabs{top:58px;gap:19px;padding-left:16px;padding-right:16px}
  body[data-page="menu"] .menu-panel,
  body[data-page="menu"] .menu-panel[hidden],
  body[data-page="menu"] .menu-panel.active{margin-left:12px;margin-right:12px}
  body[data-page="menu"] .gm-menu-chapter,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+2) .gm-menu-chapter,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+3) .gm-menu-chapter,
  body[data-page="menu"] .menu-panel:nth-of-type(4n+4) .gm-menu-chapter{height:66vw;min-height:232px}
  body[data-page="menu"] .gm-menu-chapter--type{height:48vw;min-height:184px}
}

@media (prefers-reduced-motion:reduce){
  body[data-page="menu"] .gm-menu-rail-indicator,
  body[data-page="menu"] .gm-menu-chapter,
  body[data-page="menu"] .gm-menu-chapter__image,
  body[data-page="menu"] .gm-menu-chapter__wipe,
  body[data-page="menu"] .gm-menu-chapter__code,
  body[data-page="menu"] .gm-menu-chapter__title span,
  body[data-page="menu"] .gm-menu-chapter__ghost{transition:none!important;animation:none!important}
}


/* ============================================================
   FINAL QA PATCH
   Remove the legacy split-board from the mobile/tablet premium
   experience: sticky section navigation + chapter title already
   communicate the active department. Keeping all three made the
   first viewport visually redundant.
   ============================================================ */
@media (max-width:900px){
  body[data-page="menu"] #menuSplitBoard{
    display:none!important;
  }
}

/* Mac & Wings photo: the bowl sits in the lower half of the shot, and the
   default center crop was cutting into it. Anchoring lower keeps more of
   the bowl in frame at the cost of the wall art up top, which the site
   doesn't need here anyway. */
@media (max-width:900px){
  body[data-page="menu"] #m1 .gm-menu-chapter__image{
    object-position:center 80%;
  }
}