/*
 * Morrow & Rook — layout and drawing styles. Every value comes from
 * assets/tokens.css (--s-*). Breakpoints are the only literals (CSS @media
 * cannot read custom properties); they are mirrored in tokens.css for JS.
 *   phone  < 768   tablet 768–1023   desktop ≥ 1024
 */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: var(--s-nav-h); }
html:has(.mr-menu-toggle:checked) { overflow: hidden; }
body {
    margin: 0;
    background: var(--s-forest);
    color: var(--s-bone);
    font: var(--s-weight-regular) var(--s-step-body)/var(--s-lh-body) var(--s-font-body);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
img, svg, canvas { display: block; max-width: 100%; }
a { color: inherit; }
p { margin: 0; }
:focus-visible { outline: var(--s-focus-w) solid var(--s-copper); outline-offset: var(--s-focus-offset); }
.mr-vh {
    position: absolute !important; width: var(--s-hair); height: var(--s-hair); padding: 0; margin: calc(-1 * var(--s-hair));
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.mr-skip {
    position: absolute; left: var(--s-gutter); top: 0; z-index: var(--s-z-sheet);
    transform: translateY(-120%); padding: var(--s-space-6) var(--s-space-9); background: var(--s-bone); color: var(--s-ink);
    border-radius: var(--s-pill); text-decoration: none; font-weight: var(--s-weight-strong);
}
.mr-skip:focus { transform: none; }

/* ── pills: filled, full radius, copper dot as the hover/focus affordance ── */
.mr-pill {
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--s-space-5);
    min-height: var(--s-target); padding: 0 var(--s-space-12);
    border: 0; border-radius: var(--s-pill);
    font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-display) var(--s-font-body); text-decoration: none; cursor: pointer;
    transition: background-color var(--s-dur-fast) var(--s-ease-soft), transform var(--s-dur-fast) var(--s-ease-soft);
    -webkit-tap-highlight-color: transparent;
}
.mr-pill::before {
    content: ""; position: absolute; left: var(--s-space-6); top: 50%; width: var(--s-dot); height: var(--s-dot); margin-top: calc(var(--s-dot) / -2);
    border-radius: 50%; background: var(--s-copper); transform: scale(0); transition: transform var(--s-dur) var(--s-ease);
}
.mr-pill:hover::before, .mr-pill:focus-visible::before { transform: scale(1); }
.mr-pill--forest { background: var(--s-forest); color: var(--s-bone); box-shadow: var(--s-pill-shadow); }
.mr-pill--forest:hover { background: var(--s-pill-hover); }
.mr-pill--bone { background: var(--s-bone); color: var(--s-ink); }
.mr-pill--bone:hover { background: var(--s-bone-hover); }
.mr-pill--bone::before { background: var(--s-copper-deep); }

/* ── navigation ──────────────────────────────────────────────────────── */
.mr-menu-toggle { position: absolute; opacity: 0; pointer-events: none; width: var(--s-hair); height: var(--s-hair); }
.mr-nav {
    position: sticky; top: 0; z-index: var(--s-z-nav);
    display: flex; align-items: center; gap: var(--s-space-12);
    height: var(--s-nav-h); padding: 0 var(--s-gutter);
    background: var(--s-nav-bg);
    -webkit-backdrop-filter: blur(var(--s-blur-nav)); backdrop-filter: blur(var(--s-blur-nav));
    border-bottom: var(--s-rule-w) solid var(--s-rule-dark);
}
.mr-nav__mark {
    display: inline-flex; align-items: center; min-height: var(--s-target);
    font: var(--s-wordmark-weight) var(--s-step-l)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-wordmark-vary);
    letter-spacing: var(--s-track-wordmark); text-decoration: none; white-space: nowrap;
}
.mr-nav__links { flex: 1; display: flex; justify-content: center; }
.mr-nav__links ul { display: flex; gap: var(--s-nav-gap); margin: 0; padding: 0; list-style: none; }
.mr-nav__links a {
    display: inline-flex; align-items: center; min-height: var(--s-target);
    color: var(--s-bone-dim); text-decoration: none; font-size: var(--s-step-small);
    transition: color var(--s-dur-fast) var(--s-ease-soft);
}
.mr-nav__links a:hover { color: var(--s-bone); }
.mr-nav__menu { display: none; }
.mr-nav__menu-close { display: none; }

.mr-sheet {
    position: fixed; inset: 0; z-index: var(--s-z-sheet);
    display: none; flex-direction: column; gap: var(--s-space-12);
    padding: calc(var(--s-nav-h-mobile) + var(--s-ribbon-h) + var(--s-space-12)) var(--s-gutter) var(--s-space-14);
    background: var(--s-forest); overflow-y: auto;
}
.mr-sheet__title { color: var(--s-bone-dim); font: italic var(--s-dish-weight) var(--s-step-lede)/var(--s-lh-label) var(--s-font-display); font-variation-settings: var(--s-dish-vary); }
.mr-sheet__list { list-style: none; margin: 0; padding: 0; border-top: var(--s-rule-w) solid var(--s-rule-dark); }
.mr-sheet__list a {
    display: flex; align-items: center; gap: var(--s-space-8); min-height: var(--s-target-row);
    border-bottom: var(--s-rule-w) solid var(--s-rule-dark); text-decoration: none;
    font: var(--s-display-weight) var(--s-step-l)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-display-vary);
}
.mr-sheet__num {
    display: inline-grid; place-items: center; width: var(--s-sheet-num); height: var(--s-sheet-num); flex: none;
    border: var(--s-rule-w) solid var(--s-copper); border-radius: 50%;
    color: var(--s-copper); font-size: var(--s-step-sm);
}
.mr-sheet__cta { align-self: flex-start; min-height: var(--s-target-row); padding: 0 var(--s-space-13); }

@media (max-width: 1023px) {
    .mr-nav { height: var(--s-nav-h-mobile); gap: var(--s-space-6); }
    .mr-nav__links, .mr-nav__cta { display: none; }
    .mr-nav__mark { margin-right: auto; font-size: var(--s-step-m2); }
    .mr-nav__menu { display: inline-flex; }
    .mr-menu-toggle:focus-visible ~ .mr-nav .mr-nav__menu { outline: var(--s-focus-w) solid var(--s-copper); outline-offset: var(--s-focus-offset); }
    .mr-menu-toggle:checked ~ .mr-nav { z-index: calc(var(--s-z-sheet) + 1); -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--s-forest); }
    .mr-menu-toggle:checked ~ .mr-nav .mr-nav__menu-open { display: none; }
    .mr-menu-toggle:checked ~ .mr-nav .mr-nav__menu-close { display: inline; }
    .mr-menu-toggle:checked ~ .mr-sheet { display: flex; }
    html { scroll-padding-top: var(--s-nav-h-mobile); }
}
@media (min-width: 1024px) { .mr-menu-toggle { display: none; } }

/* ── shared: the menu card (bone, paper tooth, copper inset rule) ─────── */
.mr-card {
    position: relative;
    background-color: var(--s-bone);
    background-image:
        radial-gradient(circle, var(--s-tooth) var(--s-tooth-dot), transparent var(--s-tooth-clear)),
        radial-gradient(circle, var(--s-tooth-2) var(--s-tooth-dot), transparent var(--s-tooth-clear)),
        radial-gradient(ellipse at 50% 38%, transparent 58%, var(--s-card-edge));
    background-size: var(--s-tooth-a) var(--s-tooth-a), var(--s-tooth-b) var(--s-tooth-b), 100% 100%;
    background-position: 0 0, var(--s-tooth-offset), 0 0;
    color: var(--s-ink);
    border-radius: var(--s-radius-card);
    box-shadow: var(--s-card-shadow);
}
.mr-card::before {
    content: ""; position: absolute; inset: var(--s-card-inset); pointer-events: none;
    border: var(--s-rule-w) solid var(--s-copper); border-radius: var(--s-radius-card);
}
.mr-card .mr-pill--forest:focus-visible, .mr-card :focus-visible { outline-color: var(--s-copper-deep); }

/* ── 1. hero ─────────────────────────────────────────────────────────── */
.mr-hero {
    display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--s-col-gap);
    max-width: calc(var(--s-max) + 2 * var(--s-gutter)); margin-inline: auto;
    padding: var(--s-hero-pad-y) var(--s-gutter);
    min-height: calc(100vh - var(--s-ribbon-h) - var(--s-nav-h));
    min-height: calc(100svh - var(--s-ribbon-h) - var(--s-nav-h));
}
.mr-hero__card {
    grid-column: 1 / span 5; grid-row: 1; z-index: var(--s-z-card);
    display: flex; flex-direction: column; gap: var(--s-card-gap);
    padding: var(--s-card-pad) calc(var(--s-card-pad) + var(--s-space-2));
}
.mr-js .mr-hero__card { animation: mr-settle var(--s-dur-settle) var(--s-ease) var(--s-delay-settle) both; }
@keyframes mr-settle {
    from { transform: translateY(calc(-1 * var(--s-settle-y))); box-shadow: var(--s-card-settle-shadow); }
    to { transform: none; box-shadow: var(--s-card-shadow); }
}
.mr-hero__art { grid-column: 6 / -1; grid-row: 1; position: relative; min-height: 0; }
.mr-room { position: absolute; inset: 0; width: 100%; height: 100%; }
.mr-room--m { display: none; }
.mr-hero__canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: var(--s-z-canvas); }

.mr-card__date {
    display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-space-3) var(--s-space-6);
    font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase;
    color: var(--s-ink-soft);
}
.mr-card__sep { width: var(--s-space-2); height: var(--s-space-2); border-radius: 50%; background: var(--s-copper-deep); }
.mr-wordmark {
    margin: 0; color: var(--s-ink);
    font: var(--s-wordmark-weight) var(--s-step-wordmark)/var(--s-lh-tight) var(--s-font-display);
    font-variation-settings: var(--s-wordmark-vary); letter-spacing: var(--s-track-wordmark);
}
.mr-wordmark__a, .mr-wordmark__b { display: block; }
.mr-wordmark__b { padding-left: var(--s-wordmark-indent); }
.mr-wordmark__amp { font-style: italic; color: var(--s-copper-deep); font-variation-settings: var(--s-dish-vary); }
.mr-card__line {
    max-width: var(--s-measure-short); color: var(--s-ink);
    font: italic var(--s-dish-weight) var(--s-step-lede)/var(--s-leading-138) var(--s-font-display); font-variation-settings: var(--s-dish-vary);
}
.mr-card__act { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-space-7) var(--s-space-11); }
.mr-card__act .mr-pill { min-height: var(--s-target-lg); padding: 0 var(--s-space-13); }
.mr-card__release { font-size: var(--s-step-small); color: var(--s-ink-soft); }
.mr-card__begin { margin-top: auto; }
.mr-card__begin-title { font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase; color: var(--s-ink-soft); margin-bottom: var(--s-space-4); }
.mr-card__begin-list { list-style: none; margin: 0; padding: 0; }
.mr-card__begin-list li {
    display: flex; align-items: baseline; gap: var(--s-space-7); padding: var(--s-space-3) 0; border-top: var(--s-rule-w) solid var(--s-rule-bone);
    font: italic var(--s-dish-weight) var(--s-step-sm)/var(--s-lh-label) var(--s-font-display); font-variation-settings: var(--s-dish-vary);
}
.mr-card__begin-n { flex: none; font-style: normal; font-size: var(--s-step-small); color: var(--s-copper-deep); }
.mr-card__colophon {
    padding-top: var(--s-space-7); max-width: var(--s-measure-card);
    border-top: var(--s-rule-w) solid var(--s-rule-bone);
    font-size: var(--s-step-small); line-height: var(--s-lh-lede); color: var(--s-ink-soft);
}

/* counter drawing */
.mr-r-floor { fill: var(--s-floor); }
.mr-r-tile { fill: none; stroke: var(--s-floor-line); stroke-width: 1; }
.mr-r-cast { fill: var(--s-kitchen-cast); stroke: none; }
.mr-r-pan-cast { fill: var(--s-kitchen-cast); stroke: var(--s-kitchen-cast); stroke-width: var(--s-r-handle-w); stroke-linecap: round; }
.mr-r-brush { stroke: var(--s-steel-brush); stroke-width: var(--s-r-hair); }
.mr-r-steel-edge { fill: none; stroke: var(--s-steel-hi); stroke-width: var(--s-r-hair); opacity: var(--s-r-edge-alpha); }
.mr-r-steel-lip { fill: none; stroke: var(--s-steel-dk); stroke-width: var(--s-r-lip-w); opacity: var(--s-r-edge-alpha); }
.mr-r-handle { stroke: var(--s-pan-deep); stroke-width: var(--s-r-handle-w); stroke-linecap: round; }
.mr-r-handle-hi { stroke: var(--s-pan-sheen); stroke-width: var(--s-r-hair); stroke-linecap: round; opacity: var(--s-r-edge-alpha); }
.mr-r-pan-food--butter { fill: var(--s-food-honey); }
.mr-r-pan-food--jus { fill: var(--s-food-jus); }
.mr-r-pan-food--leek { fill: var(--s-food-leek-green); }
.mr-r-pan-food { opacity: var(--s-r-food-alpha); }
.mr-r-pan-gleam { fill: none; stroke: var(--s-pan-sheen); stroke-width: var(--s-r-lip-w); stroke-linecap: round; opacity: var(--s-r-edge-alpha); }
.mr-r-coal { fill: var(--s-ember-deep); }
.mr-r-coal--hot { fill: var(--s-ember-hot); }
.mr-r-shadow { fill: none; stroke: var(--s-counter-shadow); stroke-linecap: round; opacity: .8; }
.mr-r-stool { stroke: var(--s-stool-rim); stroke-width: 2; }
.mr-r-stool-in { fill: var(--s-stool-rim); opacity: .55; }
.mr-r-band { fill: none; stroke-linecap: round; }
.mr-r-grain { fill: none; stroke: var(--s-oak-grain); stroke-width: 1.2; stroke-linecap: round; opacity: .45; }
.mr-r-grain--lt { stroke: var(--s-oak-grain-lt); opacity: .3; }
.mr-r-edge-out { fill: none; stroke: var(--s-oak-edge); stroke-width: 2; stroke-linecap: round; opacity: .7; }
.mr-r-edge-in { fill: none; stroke: var(--s-oak-grain); stroke-width: 2.5; stroke-linecap: round; opacity: .6; }
.mr-r-cutlery { stroke: var(--s-cutlery); stroke-width: 2.2; stroke-linecap: round; }
.mr-r-glass { fill: var(--s-glass); stroke: var(--s-bone); stroke-width: .8; stroke-opacity: .6; }
.mr-r-plate { fill: var(--s-plate-porcelain); stroke: var(--s-plate-porcelain-edge); stroke-width: 1; }
.mr-r-plate-well { fill: none; stroke: var(--s-plate-porcelain-rim); stroke-width: 1; }
.mr-r-plate-shadow { fill: var(--s-plate-shadow); opacity: .5; }
.mr-r-candle { fill: var(--s-candle); }
.mr-r-flame { fill: var(--s-flame); }
.mr-r-steam path { fill: none; stroke: var(--s-steam); stroke-width: 3; stroke-linecap: round; opacity: .55; }
.mr-r-grill { stroke: var(--s-steel-dk); stroke-width: var(--s-r-grill-w); stroke-linecap: round; }
.mr-r-grill-hi { stroke: var(--s-steel-hi); stroke-width: var(--s-r-hair); stroke-linecap: round; opacity: var(--s-r-edge-alpha); }
.mr-canvas-on .mr-r-steam { display: none; }

/* ── plates (the plating sketches) ───────────────────────────────────── */
.mr-plate { width: 100%; height: 100%; overflow: visible; }
.mr-pb-edge { fill: var(--s-plate-porcelain); stroke: var(--s-plate-porcelain-edge); stroke-width: 1.2; }
.mr-pb-rim { fill: none; stroke: var(--s-plate-porcelain-rim); stroke-width: 1.4; }
.mr-pb-well { fill: none; stroke: var(--s-plate-porcelain-rim); stroke-width: .8; }
.mr-pb-gleam { fill: none; stroke: var(--s-bone-hover); stroke-width: 3; stroke-linecap: round; opacity: .9; }
.mr-plate--stoneware .mr-pb-edge { fill: var(--s-plate-stoneware); stroke: var(--s-plate-stoneware-edge); }
.mr-plate--stoneware .mr-pb-rim, .mr-plate--stoneware .mr-pb-well { stroke: var(--s-plate-stoneware-rim); }
.mr-plate--stoneware .mr-pb-gleam { stroke: var(--s-plate-stoneware-rim); }
.mr-pb-speck { fill: var(--s-sketch-light); opacity: .18; }
.mr-fill { fill: var(--f); }
.mr-stroke { fill: none; stroke: var(--f); stroke-linecap: round; }
.mr-sk { fill: none; stroke: var(--s-sketch); stroke-width: .9; stroke-linejoin: round; opacity: .5; }
.mr-plate--stoneware .mr-sk { stroke: var(--s-sketch-light); opacity: .35; }
.mr-glaze { fill: none; stroke: var(--s-glaze); stroke-width: 2.4; stroke-linecap: round; }
.mr-glaze-dot { fill: var(--s-glaze); }
.mr-part, .mr-dish-art { transform-box: fill-box; transform-origin: center; }

/* ── sections + menu-card division markers ──────────────────────────── */
.mr-section { padding: var(--s-section) var(--s-gutter); }
.mr-section > * { max-width: var(--s-max); margin-inline: auto; }
.mr-band { background: var(--s-moss); }
.mr-head { text-align: center; }
.mr-marker {
    display: flex; align-items: center; justify-content: center; gap: var(--s-space-7); margin: 0 0 var(--s-space-11);
    font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-heading) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase;
    color: var(--s-bone-dim);
}
.mr-marker::before, .mr-marker::after { content: ""; flex: 0 0 var(--s-marker-rule); height: var(--s-rule-w); background: var(--s-copper); }
.mr-marker--left { justify-content: flex-start; }
.mr-marker--left::before { display: none; }
.mr-marker__num {
    display: inline-grid; place-items: center; flex: none;
    width: var(--s-marker); height: var(--s-marker); border: var(--s-rule-w) solid var(--s-copper); border-radius: 50%;
    color: var(--s-bone); font: var(--s-display-weight) var(--s-step-l2)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary);
    letter-spacing: 0; text-transform: none;
}
.mr-head--bone .mr-marker { color: var(--s-ink-soft); }
.mr-head--bone .mr-marker__num { color: var(--s-copper-deep); border-color: var(--s-copper-deep); }
.mr-h2 {
    margin: 0 auto; max-width: var(--s-measure-head); text-wrap: balance;
    font: var(--s-display-weight) var(--s-step-h2)/var(--s-lh-display) var(--s-font-display); font-variation-settings: var(--s-display-vary);
    letter-spacing: var(--s-track-h2);
}
.mr-h3 { margin: 0 0 var(--s-space-6); font: var(--s-weight-regular) var(--s-step-h3)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-lede { margin: var(--s-space-10) auto 0; max-width: var(--s-measure-lede); font-size: var(--s-step-lede); line-height: var(--s-lh-lede); color: var(--s-bone-dim); text-wrap: pretty; }
.mr-lede--left { margin-left: 0; }
.mr-head--bone .mr-lede { color: var(--s-ink-soft); }
.mr-note { color: var(--s-bone-dim); max-width: var(--s-measure-note); margin-top: var(--s-space-7); }

/* ── 2. tonight's menu ───────────────────────────────────────────────── */
.mr-menu__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-col-gap); margin-top: var(--s-section-tight); }
.mr-stage { display: none; }
.mr-courses { list-style: none; margin: 0; padding: 0; }
.mr-course {
    display: grid; grid-template-columns: var(--s-plate-inline) minmax(0, 1fr); gap: var(--s-course-gap); align-items: center;
    padding: var(--s-course-pad) 0; border-top: var(--s-rule-w) solid var(--s-rule-dark);
}
.mr-course__plate { position: relative; aspect-ratio: 1; }
.mr-course__shadow, .mr-stage__shadow {
    position: absolute; inset: 4%; border-radius: 50%; pointer-events: none;
    background: radial-gradient(circle, var(--s-plate-shadow) 52%, transparent 70%);
    transform: translate(2%, 5%); filter: blur(var(--s-blur-plate-shadow)); opacity: .6;
}
.mr-course__plate .mr-plate { position: relative; }
.mr-course__num { margin-bottom: var(--s-space-3); color: var(--s-copper); font: var(--s-display-weight) var(--s-step-l2)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-dish {
    margin: 0 0 var(--s-space-5); text-wrap: balance;
    font: italic var(--s-dish-weight) var(--s-step-dish)/var(--s-leading-116) var(--s-font-display); font-variation-settings: var(--s-dish-vary);
}
.mr-course__story { max-width: var(--s-measure-body); color: var(--s-bone-dim); }
.mr-course__source {
    display: inline-flex; align-items: center; gap: var(--s-space-4); margin-top: var(--s-space-7); padding: var(--s-space-3) var(--s-space-7);
    border-radius: var(--s-pill); background: var(--s-moss);
    font: var(--s-weight-500) var(--s-step-micro)/var(--s-lh-heading) var(--s-font-body); color: var(--s-bone);
}
.mr-course__source::before { content: ""; width: var(--s-dot); height: var(--s-dot); border-radius: 50%; background: var(--s-copper); }

/* the evening's three movements: a copper numeral and an italic name set into the list */
.mr-movement {
    display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: var(--s-space-2) var(--s-space-9);
    padding: var(--s-space-17) 0 var(--s-space-10); border-top: var(--s-rule-w) solid var(--s-copper-soft);
}
.mr-movement:first-child { padding-top: var(--s-space-4); border-top: 0; }
.mr-movement__num { grid-row: 1 / span 2; color: var(--s-copper); font: var(--s-display-weight) var(--s-step-xl)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-movement__name { font: italic var(--s-dish-weight) var(--s-step-h3)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-dish-vary); color: var(--s-bone); }
.mr-movement__line { color: var(--s-bone-dim); font-size: var(--s-step-small); letter-spacing: var(--s-track-strip); }

/* the interlude: the kitchen's own ticket, pinned between two courses */
.mr-interlude {
    position: relative; margin: var(--s-space-14) 0; padding: var(--s-space-13) var(--s-space-14) var(--s-space-14);
    background: var(--s-bone); color: var(--s-ink); border-radius: var(--s-radius-soft);
    box-shadow: 0 var(--s-space-10) var(--s-space-17) var(--s-forest-deep);
    transform: rotate(var(--s-ticket-tilt));
}
.mr-interlude::before {
    content: ""; position: absolute; left: var(--s-space-14); right: var(--s-space-14); top: 0; height: var(--s-space-3);
    background: radial-gradient(circle at 50% 0, var(--s-forest) 45%, transparent 50%) 0 0 / var(--s-space-10) var(--s-space-3) repeat-x;
}
.mr-interlude__head {
    display: flex; justify-content: space-between; gap: var(--s-space-8); padding-bottom: var(--s-space-7); margin-bottom: var(--s-space-9);
    border-bottom: var(--s-rule-w) dashed var(--s-rule-bone);
    font: var(--s-weight-500) var(--s-step-xs)/var(--s-lh-label) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase; color: var(--s-ink-soft);
}
.mr-interlude__time { color: var(--s-copper-deep); font-variant-numeric: tabular-nums; }
.mr-interlude__quote {
    margin: 0 0 var(--s-space-7); text-wrap: balance;
    font: italic var(--s-dish-weight) var(--s-step-quote)/var(--s-leading-118) var(--s-font-display); font-variation-settings: var(--s-dish-vary);
}
.mr-interlude__note { color: var(--s-ink-soft); max-width: var(--s-measure-body); }
@media (min-width: 1024px) {
    .mr-movement, .mr-interlude { grid-column: 1 / -1; }
}

/* without the motion stage on a large screen: two still columns, every course plated */
@media (min-width: 1024px) {
    .mr-courses { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--s-col-gap); }
}

/* the signature: sticky plate + reading list, only when motion runs on a large screen */
@media (min-width: 1024px) {
    .mr-motion .mr-menu__grid { grid-template-columns: 5fr 7fr; align-items: start; }
    .mr-motion .mr-stage { display: block; height: 100%; }
    .mr-motion .mr-stage__inner {
        position: sticky; top: calc(var(--s-nav-h) + var(--s-stick-stage));
        height: calc(100vh - var(--s-nav-h) - 2 * var(--s-stick-stage));
        display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-space-12);
    }
    .mr-motion .mr-courses { display: block; }
    .mr-motion .mr-course {
        grid-template-columns: minmax(0, 1fr); min-height: max(var(--s-course-row), var(--s-course-row-min));
        align-content: center; padding-left: var(--s-space-13); position: relative;
        transition: background-color var(--s-dur) var(--s-ease-soft);
    }
    .mr-motion .mr-course::before {
        content: ""; position: absolute; left: 0; top: 22%; bottom: 22%; width: var(--s-space-1); background: var(--s-copper);
        transform: scaleY(0); transform-origin: top; transition: transform var(--s-dur) var(--s-ease);
    }
    .mr-motion .mr-course.is-on { background: var(--s-row-wash); }
    .mr-motion .mr-course.is-on::before { transform: scaleY(1); }
    .mr-motion .mr-course__plate { display: none; }
    .mr-motion .mr-course .mr-dish { color: var(--s-bone-dim); transition: color var(--s-dur) var(--s-ease-soft); }
    .mr-motion .mr-course.is-on .mr-dish { color: var(--s-bone); }
}
.mr-stage__table {
    position: relative; width: var(--s-plate-stage); aspect-ratio: 1; border-radius: var(--s-radius-soft);
    background:
        radial-gradient(ellipse at 28% 18%, var(--s-glow-mid), transparent 60%),
        radial-gradient(ellipse at 50% 120%, var(--s-oak-1), transparent 70%),
        var(--s-oak-grain-pattern),
        linear-gradient(160deg, var(--s-oak-3), var(--s-oak-2));
    box-shadow: var(--s-stage-shadow);
}
.mr-stage__plate { position: absolute; inset: 7%; visibility: hidden; }
.mr-stage__plate.is-on { visibility: visible; }
.mr-stage__plate .mr-plate { position: relative; }
.mr-stage__count { display: flex; align-items: baseline; gap: var(--s-space-6); }
.mr-stage__label { color: var(--s-bone-dim); font-size: var(--s-step-small); letter-spacing: var(--s-track-caps); text-transform: uppercase; font-weight: var(--s-weight-strong); }
.mr-roll { display: inline-block; height: var(--s-measure-1); line-height: var(--s-leading-100); overflow: hidden; vertical-align: var(--s-roll-drop); }
.mr-roll__track { display: flex; flex-direction: column; }
.mr-roll__track > span { display: block; height: var(--s-measure-1); line-height: var(--s-leading-100); }
.mr-roll--big { font: var(--s-display-weight) var(--s-step-num)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary); color: var(--s-copper); }

.mr-chip { display: none; }
/* Phone + tablet: the course counter is a docked bar, not a floating pill.
   It is full-bleed and opaque, with a scrim fading the list into it, so no
   course text is ever read through or under it; the list ends with room for it. */
@media (max-width: 1023px) {
    .mr-motion .mr-courses { padding-bottom: var(--s-dock-h); }
    .mr-motion .mr-chip {
        display: block; position: sticky; bottom: 0; z-index: var(--s-z-chip);
        max-width: none; margin: calc(-1 * var(--s-dock-h)) calc(-1 * var(--s-gutter)) 0;
        padding-bottom: env(safe-area-inset-bottom); background: var(--s-forest-deep);
        pointer-events: none; opacity: 0; transition: opacity var(--s-dur) var(--s-ease-soft);
    }
    .mr-motion .mr-chip.is-live { opacity: 1; }
    .mr-motion .mr-chip::before {
        content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: var(--s-dock-scrim);
        background: linear-gradient(to top, var(--s-forest-deep), var(--s-forest-clear));
    }
    .mr-chip__bar {
        display: flex; align-items: center; justify-content: space-between; gap: var(--s-space-7);
        min-height: var(--s-dock-h); padding: 0 var(--s-gutter);
        border-top: var(--s-rule-w) solid var(--s-copper-soft);
    }
    .mr-chip__count {
        display: flex; align-items: baseline; gap: var(--s-space-3); margin: 0; color: var(--s-bone);
        font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-solid) var(--s-font-body);
        letter-spacing: var(--s-track-caps); text-transform: uppercase;
    }
    .mr-chip__num { color: var(--s-copper); font: var(--s-display-weight) var(--s-step-l)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary); letter-spacing: 0; }
    .mr-chip__ticks { display: flex; gap: var(--s-space-1); margin: 0; padding: 0; list-style: none; flex: 0 1 var(--s-dock-ticks); }
    .mr-chip__ticks li { flex: 1; height: var(--s-space-1); border-radius: var(--s-pill); background: var(--s-rule-dark); transition: background-color var(--s-dur-fast) var(--s-ease-soft); }
    .mr-chip__ticks li.is-on { background: var(--s-copper); }
}

.mr-menu { padding-bottom: var(--s-section-tight); }
.mr-menu__close { margin-top: var(--s-menu-close-gap); text-align: center; }
.mr-menu__close p:last-child { max-width: var(--s-measure-close); margin: var(--s-space-5) auto 0; color: var(--s-bone-dim); }
.mr-menu__close-title { font: italic var(--s-dish-weight) var(--s-step-h3)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-dish-vary); }

@media (max-width: 767px) {
    .mr-course { grid-template-columns: var(--s-plate-card) minmax(0, 1fr); align-items: start; gap: var(--s-space-9); }
    .mr-course__num { font-size: var(--s-step-m); }
    .mr-course__source { flex-wrap: wrap; }
}

/* ── 3. the counter ──────────────────────────────────────────────────── */
.mr-counter__grid { display: grid; grid-template-columns: 5fr 7fr; gap: var(--s-gap-wide); margin-top: var(--s-section-tight); align-items: start; }
.mr-plan { margin: 0; position: sticky; top: calc(var(--s-nav-h) + var(--s-stick-plan)); padding: var(--s-card-pad); }
.mr-plan__svg { width: 100%; height: auto; }
.mr-plan__band { fill: none; stroke: var(--s-copper-deep); stroke-linecap: round; }
.mr-plan__band-in { fill: none; stroke: var(--s-bone); stroke-linecap: round; }
.mr-plan__label { fill: var(--s-ink-soft); font: italic var(--s-weight-regular) var(--s-svg-label) var(--s-font-display); }
.mr-plan__label--door { font-size: var(--s-svg-label-sm); }
.mr-plan__seat circle { fill: var(--s-bone-shade); stroke: var(--s-ink-soft); stroke-width: 1.2; transition: fill var(--s-dur) var(--s-ease-soft), stroke var(--s-dur) var(--s-ease-soft); }
.mr-plan__seat text { fill: var(--s-ink); font: var(--s-weight-strong) var(--s-svg-seat) var(--s-font-body); }
.mr-plan__seat.is-lit circle { fill: var(--s-copper); stroke: var(--s-copper-deep); }
.mr-plan__cap { margin-top: var(--s-space-6); font-size: var(--s-step-small); color: var(--s-ink-soft); }
.mr-plan__title { display: block; color: var(--s-ink); font: italic var(--s-dish-weight) var(--s-step-lede)/var(--s-lh-label) var(--s-font-display); font-variation-settings: var(--s-dish-vary); }
.mr-counter__text .mr-lede { margin-top: 0; color: var(--s-bone); }
.mr-cooks__title { margin-top: var(--s-cooks-gap); }
.mr-cooks { list-style: none; margin: 0; padding: 0; }
.mr-cook {
    display: grid; grid-template-columns: var(--s-cook-tool) minmax(0, 1fr); column-gap: var(--s-space-12); align-items: start;
    padding: var(--s-space-12) 0; border-top: var(--s-rule-w) solid var(--s-rule-dark);
}
.mr-cook__tool { grid-row: 1 / span 3; width: var(--s-cook-tool); height: var(--s-cook-tool); }
.mr-ink { fill: none; stroke: var(--s-bone-dim); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.mr-ink--thin { stroke-width: 1.2; opacity: .8; }
.mr-ink--fill { fill: var(--s-bone-dim); }
.mr-ink--copper { stroke: var(--s-copper); }
.mr-cook__role { font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase; color: var(--s-bone-dim); }
.mr-cook__name { margin: var(--s-space-2) 0 var(--s-space-4); font: var(--s-display-weight) var(--s-step-h3)/var(--s-lh-display) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-cook__what { color: var(--s-bone-dim); font: italic var(--s-weight-regular) var(--s-step-lede)/var(--s-leading-145) var(--s-font-display); font-variation-settings: var(--s-dish-vary); max-width: var(--s-measure-cook); }
.mr-cooks__hint { display: none; }

.mr-map { display: grid; grid-template-columns: 5fr 7fr; gap: var(--s-gap-wide); align-items: center; margin-top: var(--s-section); }
.mr-map__svg { overflow: hidden; width: 100%; height: auto; border-radius: var(--s-radius-soft); box-shadow: var(--s-card-shadow); }
.mr-map__sea { fill: var(--s-sea); }
.mr-map__wave { fill: none; stroke: var(--s-sea-line); stroke-width: 1.4; stroke-linecap: round; }
.mr-map__land { fill: var(--s-land); stroke: var(--s-land-edge); stroke-width: 1.6; }
.mr-map__contour { fill: none; stroke: var(--s-land-edge); stroke-width: 1; opacity: .7; }
.mr-map__island { fill: var(--s-land); stroke: var(--s-land-edge); stroke-width: 1.4; }
.mr-map__route { fill: none; stroke: var(--s-route); stroke-width: 1.8; stroke-dasharray: 4 7; stroke-linecap: round; }
.mr-map__pin circle { fill: var(--s-forest); stroke: var(--s-copper); stroke-width: 1.6; }
.mr-map__pin text { fill: var(--s-bone); font: var(--s-weight-strong) var(--s-svg-pin) var(--s-font-body); }
.mr-map__home circle { fill: var(--s-copper-faint); stroke: var(--s-copper); stroke-width: 1.6; }
.mr-map__home .mr-map__home-dot { fill: var(--s-copper); stroke: none; }
.mr-map__home text { paint-order: stroke; stroke: var(--s-land); stroke-width: 6; stroke-linejoin: round; fill: var(--s-bone); font: italic var(--s-weight-regular) var(--s-svg-home) var(--s-font-display); }
.mr-suppliers { list-style: none; margin: var(--s-space-12) 0 0; padding: 0; }
.mr-supplier {
    display: grid; grid-template-columns: var(--s-space-15) minmax(0, 1fr) auto; column-gap: var(--s-space-7); row-gap: var(--s-space-1); align-items: baseline;
    padding: var(--s-space-7) 0; border-top: var(--s-rule-w) solid var(--s-rule-dark);
}
.mr-supplier__num {
    grid-row: 1 / span 2; align-self: start; display: inline-grid; place-items: center; width: var(--s-pin-num); height: var(--s-pin-num);
    border: var(--s-rule-w) solid var(--s-copper); border-radius: 50%; font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-solid) var(--s-font-body); color: var(--s-bone);
}
.mr-supplier__name { font: var(--s-weight-regular) var(--s-step-m)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-supplier__dist { font-weight: var(--s-weight-strong); font-variant-numeric: tabular-nums; color: var(--s-bone); }
.mr-supplier__kind { grid-column: 2 / -1; font-size: var(--s-step-small); color: var(--s-bone-dim); }
.mr-map__note { margin-top: var(--s-space-7); font-size: var(--s-step-small); color: var(--s-bone-dim); }

@media (max-width: 1023px) {
    .mr-counter__grid, .mr-map { grid-template-columns: minmax(0, 1fr); }
    .mr-plan { position: relative; top: auto; max-width: var(--s-plan-max); margin-inline: auto; width: 100%; }
    .mr-map__svg { order: -1; }
}
@media (max-width: 767px) {
    .mr-cooks {
        display: flex; gap: var(--s-space-7); overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
        margin-inline: calc(-1 * var(--s-gutter)); padding: var(--s-space-2) var(--s-gutter) var(--s-space-6); scroll-padding-inline: var(--s-gutter);
        scrollbar-width: none;
    }
    .mr-cooks::-webkit-scrollbar { display: none; }
    .mr-cook {
        flex: 0 0 var(--s-carousel-card); scroll-snap-align: start; grid-template-columns: minmax(0, 1fr);
        padding: var(--s-space-11); border: 0; border-radius: var(--s-radius-soft); background: var(--s-moss-deep);
    }
    .mr-cook__tool { grid-row: auto; width: var(--s-cook-tool-m); height: var(--s-cook-tool-m); margin-bottom: var(--s-space-5); }
    .mr-cooks__hint { display: block; margin-top: var(--s-space-4); font-size: var(--s-step-small); color: var(--s-bone-dim); }
}

/* ── 4. the cellar ───────────────────────────────────────────────────── */
.mr-cellar__grid { display: grid; grid-template-columns: 4fr 8fr; gap: var(--s-gap-wide); margin-top: var(--s-section-tight); align-items: start; }
.mr-cellar__aside { position: sticky; top: calc(var(--s-nav-h) + var(--s-stick-glass)); display: grid; gap: var(--s-space-12); }
.mr-glass {
    position: relative; display: flex; justify-content: center; align-items: center;
    min-height: var(--s-glass-stage-short);
}
/* tonight's pour list under the glass: the courses each glass meets */
.mr-pours { padding: var(--s-space-12) var(--s-space-13); border: var(--s-rule-w) solid var(--s-copper-soft); border-radius: var(--s-radius-soft); background: var(--s-forest-lift); }
.mr-pours__title { margin-bottom: var(--s-space-7); font: var(--s-weight-500) var(--s-step-xs)/var(--s-lh-label) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase; color: var(--s-copper); }
.mr-pours__list { list-style: none; margin: 0; padding: 0; }
.mr-pour {
    display: grid; grid-template-columns: var(--s-space-17) minmax(0, 1fr); column-gap: var(--s-space-7);
    padding: var(--s-space-5) 0; border-top: var(--s-rule-w) solid var(--s-rule-dark);
}
.mr-pour__courses { grid-row: 1 / span 2; color: var(--s-copper); font: var(--s-weight-500) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); font-variant-numeric: tabular-nums; }
.mr-pour__wine { font: italic var(--s-dish-weight) var(--s-step-sm2)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-dish-vary); }
.mr-pour__grower { color: var(--s-bone-dim); font-size: var(--s-step-small); }
.mr-pours__note { margin-top: var(--s-space-7); color: var(--s-bone-dim); font-size: var(--s-step-small); }
.mr-js .mr-pour { transition: opacity var(--s-dur) var(--s-ease-soft); }
/* desktop: the list sits beside the principles, so it can follow them; on a phone it is read on its own */
@media (min-width: 768px) { .mr-js .mr-pours.is-pouring .mr-pour:not(.is-on) { opacity: var(--s-pour-dim); } }
/* the candle the glass is held up to: a warm pool behind the bowl */
.mr-glass::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: radial-gradient(ellipse var(--s-glass-glow-size) at 50% var(--s-glass-glow-y), var(--s-glow-mid), transparent 70%);
}
.mr-glass__svg { position: relative; height: var(--s-glass-h); width: auto; overflow: visible; }
.mr-glass__line { fill: none; stroke: var(--s-bone-dim); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mr-glass__gleam { fill: none; stroke: var(--s-bone); stroke-width: 3; stroke-linecap: round; opacity: .3; }
.mr-glass__wine { fill: var(--s-wine); }
.mr-glass__wine-hi { fill: var(--s-wine-hi); }
.mr-glass__shadow { fill: var(--s-forest-deep); }
.mr-glass__pour { transform-box: fill-box; transform-origin: 50% 100%; }
.mr-principles { list-style: none; margin: 0; padding: 0; }
.mr-principle { display: grid; grid-template-columns: var(--s-space-17) minmax(0, 1fr); column-gap: var(--s-space-10); padding: var(--s-principle-pad) 0; border-top: var(--s-rule-w) solid var(--s-rule-dark); }
.mr-principle__num { grid-row: 1 / span 2; color: var(--s-copper); font: var(--s-display-weight) var(--s-step-xl)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-quote { margin: 0 0 var(--s-space-7); }
.mr-quote p { font: italic var(--s-dish-weight) var(--s-step-quote)/var(--s-leading-118) var(--s-font-display); font-variation-settings: var(--s-dish-vary); text-wrap: balance; }
.mr-principle__body { color: var(--s-bone-dim); max-width: var(--s-measure-body); }
.mr-prices { margin-top: var(--s-section-tight); padding: var(--s-card-pad); border: var(--s-rule-w) solid var(--s-copper-soft); border-radius: var(--s-radius-soft); background: var(--s-forest-lift); }
.mr-prices__table { width: 100%; border-collapse: collapse; }
.mr-prices__table caption { text-align: left; padding-bottom: var(--s-space-9); }
.mr-prices__title { display: block; font: var(--s-weight-regular) var(--s-step-h3)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-prices__cap { display: block; margin-top: var(--s-space-3); color: var(--s-bone-dim); font-size: var(--s-step-small); }
.mr-prices__table th, .mr-prices__table td { padding: var(--s-space-10) 0; border-top: var(--s-rule-w) solid var(--s-rule-dark); text-align: left; vertical-align: baseline; font-weight: var(--s-weight-regular); }
.mr-prices__what { display: block; font: var(--s-weight-regular) var(--s-step-m2)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-prices__note { display: block; color: var(--s-bone-dim); font-size: var(--s-step-small); }
.mr-prices__table td { text-align: right; color: var(--s-copper); font: var(--s-display-weight) var(--s-step-h3)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
@media (max-width: 767px) {
    .mr-cellar__grid { grid-template-columns: minmax(0, 1fr); }
    .mr-cellar__aside { position: relative; top: auto; }
    .mr-glass { min-height: 0; }
    .mr-glass__svg { height: var(--s-glass-h-m); }
    .mr-principle { grid-template-columns: var(--s-space-15) minmax(0, 1fr); column-gap: var(--s-space-6); }
}

/* ── 5. how booking works (a printed sheet) ──────────────────────────── */
.mr-cellar { padding-bottom: var(--s-section-tight); }
.mr-booking { padding-top: var(--s-section-tight); }
.mr-paper { padding: var(--s-paper-pad-y) var(--s-card-pad); }
.mr-paper .mr-h3 { color: var(--s-ink); }
.mr-cal { margin-top: var(--s-section-tight); }
.mr-cal__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--s-space-5) var(--s-space-12); margin-bottom: var(--s-space-8); }
.mr-cal__title { margin: 0; font: italic var(--s-dish-weight) var(--s-step-h3)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-dish-vary); }
.mr-cal__key { display: flex; flex-wrap: wrap; gap: var(--s-space-4) var(--s-space-11); margin: 0; padding: 0; list-style: none; font-size: var(--s-step-small); color: var(--s-ink-soft); }
.mr-cal__key-item { display: inline-flex; align-items: center; gap: var(--s-space-4); }
.mr-cal__key-item span { width: var(--s-space-7); height: var(--s-space-7); border-radius: var(--s-radius-key); }
.mr-cal__key-item--release span { background: var(--s-copper-deep); }
.mr-cal__key-item--service span { background: var(--s-forest); }
.mr-cal__key-item--closed span { border: var(--s-rule-w) solid var(--s-ink-soft); }
.mr-cal__strip {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: var(--s-space-2);
    margin: 0; padding: 0; list-style: none;
}
.mr-day { border-radius: var(--s-radius-day); text-align: center; padding: var(--s-space-5) 0 var(--s-space-6); border: var(--s-rule-w) solid var(--s-rule-bone); color: var(--s-ink-soft); }
.mr-day time { display: flex; flex-direction: column; align-items: center; gap: var(--s-space-2); }
.mr-day__wd { font: var(--s-weight-strong) var(--s-step-strip)/var(--s-lh-solid) var(--s-font-body); letter-spacing: var(--s-track-strip); text-transform: uppercase; }
.mr-day__n { font: var(--s-display-weight) var(--s-step-m)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-day--service { background: var(--s-forest); border-color: var(--s-forest); color: var(--s-bone); }
.mr-day--release { background: var(--s-copper-deep); border-color: var(--s-copper-deep); color: var(--s-bone); }
.mr-cal__flag { display: flex; align-items: center; gap: var(--s-space-5); margin-top: var(--s-space-7); font-size: var(--s-step-small); color: var(--s-ink-soft); }
.mr-cal__flag strong { color: var(--s-ink); }
.mr-cal__flag-dot { width: var(--s-space-5); height: var(--s-space-5); border-radius: 50%; background: var(--s-copper-deep); }

.mr-steps__title { margin-top: var(--s-section-tight); }
.mr-steps { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s-space-12); margin: var(--s-space-11) 0 0; padding: 0; list-style: none; }
.mr-steps::before { content: ""; position: absolute; left: calc(var(--s-target) / 2); right: calc(var(--s-target) / 2); top: calc(var(--s-target) / 2); height: var(--s-rule-w); background: var(--s-copper); }
.mr-step { position: relative; }
.mr-step__num {
    position: relative; display: inline-grid; place-items: center; width: var(--s-target); height: var(--s-target); margin-bottom: var(--s-space-8);
    border: var(--s-rule-w) solid var(--s-copper-deep); border-radius: 50%; background: var(--s-bone);
    color: var(--s-copper-deep); font: var(--s-display-weight) var(--s-step-m)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary);
}
.mr-step__when { font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); color: var(--s-copper-deep); font-variant-numeric: tabular-nums; }
.mr-step__title { margin: var(--s-space-3) 0 var(--s-space-4); font: var(--s-weight-regular) var(--s-step-m2)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-display-vary); }
.mr-step__body { font-size: var(--s-step-small); line-height: var(--s-leading-155); color: var(--s-ink-soft); }

.mr-diet { margin-top: var(--s-section-tight); padding-top: var(--s-section-tight); border-top: var(--s-rule-w) solid var(--s-rule-bone); }
.mr-diet__cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-col-gap); margin-top: var(--s-space-9); }
.mr-diet__head { margin: 0 0 var(--s-space-5); font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase; color: var(--s-ink-soft); }
.mr-diet__list { list-style: none; margin: 0; padding: 0; }
.mr-diet__list li { position: relative; padding: var(--s-space-5) 0 var(--s-space-5) var(--s-space-13); border-top: var(--s-rule-w) solid var(--s-rule-bone); }
.mr-diet__list li::before { content: ""; position: absolute; left: var(--s-space-1); top: var(--s-diet-mark-y); width: var(--s-space-7); height: var(--s-space-3); }
.mr-diet__list--can li::before { border-left: var(--s-space-1) solid var(--s-forest); border-bottom: var(--s-space-1) solid var(--s-forest); transform: rotate(-45deg); top: var(--s-diet-tick-y); }
.mr-diet__list--cannot li::before { height: var(--s-space-1); background: var(--s-copper-deep); top: var(--s-diet-dash-y); }

@media (max-width: 1023px) {
    .mr-cal__strip { grid-auto-flow: row; grid-template-columns: repeat(7, minmax(0, 1fr)); }
    .mr-day:first-child { grid-column-start: var(--col); }
    .mr-steps { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .mr-steps::before { left: calc(var(--s-target) / 2 - var(--s-rule-w)); right: auto; top: calc(var(--s-target) / 2); bottom: calc(var(--s-target) / 2); width: var(--s-rule-w); height: auto; }
    .mr-step { padding: 0 0 var(--s-space-12) calc(var(--s-target) + var(--s-space-11)); }
    .mr-step__num { position: absolute; left: 0; top: 0; margin: 0; }
    .mr-step__when { padding-top: var(--s-space-5); }
}
@media (max-width: 767px) {
    .mr-booking { padding-inline: var(--s-space-6); }
    .mr-paper { padding: var(--s-space-16) var(--s-space-11); }
    .mr-diet__cols { grid-template-columns: minmax(0, 1fr); }
    .mr-day { padding: var(--s-space-4) 0; }
    .mr-day__n { font-size: var(--s-step-sm); }
}

/* ── 6. request a seat ───────────────────────────────────────────────── */
.mr-request__grid { display: grid; grid-template-columns: 5fr 7fr; gap: var(--s-gap-wide); align-items: start; }
.mr-request__intro { position: sticky; top: calc(var(--s-nav-h) + var(--s-stick-intro)); }
.mr-request__intro .mr-h2 { margin: 0; text-align: left; }
/* what follows a request: three numbered lines on a copper rule, so the intro column is never empty */
.mr-after { position: relative; display: grid; gap: var(--s-space-12); margin: var(--s-space-17) 0 0; padding: 0; list-style: none; max-width: var(--s-measure-lede); }
.mr-after::before { content: ""; position: absolute; left: calc(var(--s-target) / 2); top: var(--s-space-8); bottom: var(--s-space-8); width: var(--s-rule-w); background: var(--s-copper-soft); }
.mr-after__step { position: relative; display: grid; grid-template-columns: var(--s-target) minmax(0, 1fr); column-gap: var(--s-space-8); }
.mr-after__num {
    grid-row: 1 / span 2; display: grid; place-items: center; width: var(--s-target); height: var(--s-target); border-radius: 50%;
    background: var(--s-moss); border: var(--s-rule-w) solid var(--s-copper); color: var(--s-pan-sheen);
    font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); font-variant-numeric: lining-nums;
}
.mr-after__when { margin: var(--s-space-3) 0 0; font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); color: var(--s-pan-sheen); }
.mr-after__what { margin: var(--s-space-2) 0 0; color: var(--s-bone-dim); text-wrap: pretty; }
.mr-form { display: grid; gap: var(--s-space-11); padding: calc(var(--s-card-pad) + var(--s-space-3)) var(--s-card-pad); }
.mr-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-space-11); }
.mr-field { display: grid; gap: var(--s-space-3); margin: 0; padding: 0; border: 0; min-width: 0; }
.mr-field label, .mr-field legend { padding: 0; font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); color: var(--s-ink); }
.mr-field__opt { font-weight: var(--s-weight-regular); color: var(--s-ink-soft); }
.mr-field__hint { font-size: var(--s-step-micro); color: var(--s-ink-soft); }
.mr-field input[type="text"], .mr-field input[type="email"], .mr-field input[type="tel"], .mr-field select, .mr-field textarea {
    width: 100%; min-height: var(--s-target-lg); padding: var(--s-space-6) var(--s-space-7);
    font: var(--s-weight-regular) var(--s-input-size)/var(--s-leading-140) var(--s-font-body); color: var(--s-ink);
    background: var(--s-bone-hover); border: var(--s-rule-w) solid var(--s-ink-soft); border-radius: var(--s-radius-field);
    -webkit-appearance: none; appearance: none;
}
.mr-field select {
    background-image: linear-gradient(45deg, transparent 50%, var(--s-ink) 50%), linear-gradient(135deg, var(--s-ink) 50%, transparent 50%);
    background-position: var(--s-select-arrow-pos); background-size: var(--s-select-arrow-size); background-repeat: no-repeat;
    padding-right: var(--s-space-16);
}
.mr-field textarea { resize: vertical; }
.mr-field ::placeholder { color: var(--s-ink-soft); opacity: 1; }
.mr-field [aria-invalid="true"] { border-color: var(--s-error); box-shadow: var(--s-field-error-ring); }
.mr-field__err { color: var(--s-error); font-size: var(--s-step-small); font-weight: var(--s-weight-strong); }
.mr-party__opts { display: flex; gap: var(--s-space-5); }
.mr-party__opt { position: relative; }
.mr-party__opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.mr-party__opt span {
    display: inline-grid; place-items: center; width: var(--s-target-lg); height: var(--s-target-lg); border-radius: 50%;
    border: var(--s-rule-w) solid var(--s-ink-soft); background: var(--s-bone-hover);
    font: var(--s-display-weight) var(--s-step-m2)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-display-vary);
    transition: background-color var(--s-dur-fast) var(--s-ease-soft), color var(--s-dur-fast) var(--s-ease-soft);
}
.mr-party__opt input:checked + span { background: var(--s-forest); border-color: var(--s-forest); color: var(--s-bone); }
.mr-party__opt input:focus-visible + span { outline: var(--s-focus-w) solid var(--s-copper-deep); outline-offset: var(--s-focus-offset); }
.mr-switch { position: relative; display: flex; align-items: center; gap: var(--s-space-7); min-height: var(--s-target-row); padding-block: var(--s-space-3); cursor: pointer; font-size: var(--s-step-small); }
/* the whole label row (≥ 44px high, full width) is the hit area; the input covers it */
.mr-switch input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.mr-switch__track { position: relative; flex: none; width: var(--s-switch-w); height: var(--s-switch-h); border-radius: var(--s-pill); background: var(--s-bone-shade); border: var(--s-rule-w) solid var(--s-ink-soft); transition: background-color var(--s-dur-fast) var(--s-ease-soft); }
.mr-switch__track::after { content: ""; position: absolute; top: var(--s-switch-pad); left: var(--s-switch-pad); width: var(--s-switch-thumb); height: var(--s-switch-thumb); border-radius: 50%; background: var(--s-ink-soft); transition: transform var(--s-dur) var(--s-ease), background-color var(--s-dur-fast) var(--s-ease-soft); }
.mr-switch input:checked + .mr-switch__track { background: var(--s-forest); border-color: var(--s-forest); }
.mr-switch input:checked + .mr-switch__track::after { transform: translateX(var(--s-switch-travel)); background: var(--s-copper); }
.mr-switch input:focus-visible + .mr-switch__track { outline: var(--s-focus-w) solid var(--s-copper-deep); outline-offset: var(--s-focus-offset); }
.mr-form__submit { justify-self: start; min-height: var(--s-target-lg); padding: 0 var(--s-space-14); }
.mr-form__errors { padding: var(--s-space-7) var(--s-space-9); border-left: var(--s-rule-strong) solid var(--s-error); background: var(--s-bone-hover); color: var(--s-error); font-weight: var(--s-weight-strong); }
.mr-form__errors ul { margin: var(--s-space-3) 0 0; padding-left: var(--s-space-9); font-weight: var(--s-weight-regular); }
.mr-form__errors a { color: inherit; }
.mr-form__status:empty { display: none; }
.mr-form__status { padding: var(--s-space-9) var(--s-space-10); border-radius: var(--s-radius-field); background: var(--s-forest); color: var(--s-bone); }
.mr-form__sent-title { font: italic var(--s-dish-weight) var(--s-step-m2)/var(--s-lh-heading) var(--s-font-display); font-variation-settings: var(--s-dish-vary); margin-bottom: var(--s-space-3); }
@media (max-width: 1023px) {
    .mr-request__grid { grid-template-columns: minmax(0, 1fr); }
    .mr-request__intro { position: relative; top: auto; }
}
@media (max-width: 767px) {
    .mr-request { padding-inline: var(--s-space-6); }
    .mr-request__intro { padding-inline: var(--s-space-4); }
    .mr-form { padding: var(--s-space-15) var(--s-space-11); }
    .mr-form__row { grid-template-columns: minmax(0, 1fr); }
}

/* ── footer ──────────────────────────────────────────────────────────── */
.mr-foot { background: var(--s-forest-deep); padding: var(--s-section-tight) var(--s-gutter) var(--s-space-13); }
.mr-foot__grid, .mr-foot__base { max-width: var(--s-max); margin-inline: auto; }
.mr-foot__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--s-col-gap); }
.mr-foot__mark { font: var(--s-wordmark-weight) var(--s-step-xl2)/var(--s-lh-solid) var(--s-font-display); font-variation-settings: var(--s-wordmark-vary); letter-spacing: var(--s-track-wordmark); }
.mr-foot__head { margin: 0 0 var(--s-space-5); font: var(--s-weight-strong) var(--s-step-small)/var(--s-lh-label) var(--s-font-body); letter-spacing: var(--s-track-caps); text-transform: uppercase; color: var(--s-bone-dim); }
.mr-foot__lines { font-style: normal; }
.mr-foot__lines span { display: block; }
.mr-foot__link { display: inline-flex; align-items: center; min-height: var(--s-target); text-underline-offset: var(--s-underline-offset); text-decoration-color: var(--s-copper); }
.mr-foot__lines .mr-foot__link { display: flex; }
.mr-foot__base { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-space-4) var(--s-space-12); margin-top: var(--s-section-tight); padding-top: var(--s-space-9); border-top: var(--s-rule-w) solid var(--s-rule-dark); font-size: var(--s-step-small); color: var(--s-bone-dim); }
.mr-foot__sign { font: italic var(--s-weight-regular) var(--s-step-lede)/var(--s-lh-label) var(--s-font-display); color: var(--s-bone); font-variation-settings: var(--s-dish-vary); }
@media (max-width: 1023px) { .mr-foot__grid { grid-template-columns: 1fr 1fr; } .mr-foot__mark { grid-column: 1 / -1; } }
@media (max-width: 479px) { .mr-foot__grid { grid-template-columns: minmax(0, 1fr); } }

/* ── hero: tablet + phone compositions ───────────────────────────────── */
@media (max-width: 1023px) {
    :root { --s-ribbon-h: var(--s-ribbon-est-mobile); }
    .mr-hero { min-height: calc(100vh - var(--s-ribbon-h) - var(--s-nav-h-mobile)); min-height: calc(100svh - var(--s-ribbon-h) - var(--s-nav-h-mobile)); }
    .mr-hero__card { grid-column: 1 / span 6; }
    .mr-hero__art { grid-column: 7 / -1; }
}
@media (max-width: 767px), (max-width: 1023px) and (orientation: portrait) {
    .mr-hero {
        grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto;
        padding: 0 var(--s-gutter);
    }
    .mr-hero__art {
        grid-column: 1; grid-row: 2; margin-inline: calc(-1 * var(--s-gutter));
        height: var(--s-hero-art-mobile-fb); height: var(--s-hero-art-mobile);
    }
    .mr-card__begin { margin-top: var(--s-space-1); }
    .mr-card__begin-list li { font-size: var(--s-step-s); padding: var(--s-space-2) 0; }
    .mr-room--d { display: none; }
    .mr-room--m { display: block; }
    /* The title card comes first on a phone: the name, tonight's line and "Request a seat" land on the
       first screen, and the counter is set below it, tucked under the card's lower edge like a menu
       laid on the table. */
    .mr-hero__card {
        grid-column: 1; grid-row: 1; margin: 0 calc(-1 * var(--s-gutter)) var(--s-card-overlap); position: relative; z-index: var(--s-z-card);
        border-radius: 0 0 var(--s-radius-soft) var(--s-radius-soft);
        padding: var(--s-space-10) var(--s-gutter) var(--s-space-12); gap: var(--s-space-7);
    }
    .mr-hero__card::before { inset: 0 var(--s-card-inset) var(--s-card-inset); border-top: 0; border-radius: 0 0 var(--s-radius-soft) var(--s-radius-soft); }
    .mr-wordmark { font-size: var(--s-step-wordmark-m); }
    .mr-wordmark__a, .mr-wordmark__b { display: inline; }
    .mr-wordmark__b { padding-left: 0; }
    .mr-card__date { font-size: var(--s-step-xs); }
    .mr-card__line { font-size: var(--s-step-sm2); max-width: none; }
    .mr-card__act { gap: var(--s-space-5) var(--s-space-8); }
    .mr-card__colophon { display: none; }
}

/* ── reduced motion: the final, composed state, still ────────────────── */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition: none !important; animation: none !important; }
    .mr-hero__canvas { display: none; }
}

/* portrait tablet: the phone composition, with more room for the counter */
@media (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
    .mr-hero__art { height: var(--s-hero-art-tablet-fb); height: var(--s-hero-art-tablet); }
    .mr-card__colophon { display: block; }
    .mr-hero__card { padding-inline: calc(var(--s-gutter) + var(--s-space-4)); }
}
