:root {
  --cream: #fff8e9;
  --cream-2: #f7ead0;
  --wine: #5b0d14;
  --wine-2: #7d1720;
  --gold: #c88a18;
  --gold-soft: #f5dfaa;
  --ink: #2d2926;
  --muted: #6f665f;
  --card: #ffffff;
  --shadow: 0 18px 50px rgba(65, 35, 20, 0.12);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}

img { display: block; max-width: 100%; }

a { color: inherit; }

button, a { -webkit-tap-highlight-color: transparent; }

.container {
  width: min(1120px, calc(100% - 32px));
  margin-inline: auto;
}

.site-header {
  background: var(--wine);
  color: #fff2d2;
  box-shadow: 0 4px 20px rgba(0,0,0,.18);
}

.header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 22px 0;
}

.site-header h1 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
}

.eyebrow {
  margin: 3px 0 0;
  color: #f5c85f;
  font-size: .75rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.header-contact {
  display: flex;
  flex-direction: column;
  text-align: right;
  font-size: .9rem;
}

.header-contact a {
  font-weight: 700;
  text-decoration: none;
}

.header-contact span {
  color: #f6cb68;
  font-size: .78rem;
  margin-top: 2px;
}

.hero {
  min-height: 430px;
  position: relative;
  display: grid;
  place-items: center;
  background:
    url("https://images.unsplash.com/photo-1555244162-803834f70033?auto=format&fit=crop&w=1800&q=85")
    center / cover no-repeat;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(26,10,6,.78), rgba(26,10,6,.48));
}

.hero-content {
  position: relative;
  z-index: 1;
  color: white;
  text-align: center;
  max-width: 760px;
}

.hero h2 {
  margin: 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(2.4rem, 7vw, 4.7rem);
  line-height: 1.03;
}

.hero p {
  margin: 18px auto 26px;
  color: #f7d98d;
  font-size: clamp(1rem, 2vw, 1.25rem);
}

.primary-btn,
.order-btn {
  border: 0;
  border-radius: 10px;
  background: var(--wine-2);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.primary-btn {
  display: inline-block;
  padding: 12px 20px;
  text-decoration: none;
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
}

.primary-btn:hover,
.order-btn:hover {
  background: #961e29;
  transform: translateY(-1px);
}

.section { padding: 64px 0; }

.chef-card {
  display: grid;
  grid-template-columns: minmax(280px, 34%) 1fr;
  background: var(--card);
  border: 1px solid #edd7a8;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: var(--shadow);
}

.chef-card img {
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
}

.chef-copy {
  align-self: center;
  padding: clamp(28px, 5vw, 52px);
}

.pill {
  display: inline-block;
  background: var(--gold-soft);
  color: #7a4d05;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 7px 11px;
  border-radius: 999px;
}

.chef-copy h2,
.section-heading h2 {
  font-family: "Playfair Display", serif;
  color: #211e1b;
}

.chef-copy h2 {
  margin: 14px 0 4px;
  font-size: clamp(1.7rem, 3vw, 2.4rem);
}

.chef-title {
  margin-top: 0;
  color: #a3660f;
  font-weight: 700;
}

.menu-section { padding-top: 18px; }

.section-heading {
  text-align: center;
  margin-bottom: 36px;
}

.section-heading h2 {
  margin-bottom: 8px;
  font-size: clamp(2rem, 4vw, 3rem);
}

.section-heading p {
  margin: 0;
  color: var(--muted);
}

.menu-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.menu-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--card);
  border: 1px solid #eadfd5;
  border-radius: 18px;
  box-shadow: 0 12px 30px rgba(61, 36, 23, .08);
}

.menu-card img {
  width: 100%;
  height: 205px;
  object-fit: cover;
}

.menu-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
  padding: 20px;
}

.menu-card h3 {
  margin: 0 0 8px;
  font-size: 1.06rem;
  line-height: 1.35;
}

.menu-card p {
  color: var(--muted);
  font-size: .91rem;
  margin: 0;
}

.menu-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #efe7e0;
}

.price {
  color: #74450a;
  font-size: 1.25rem;
  font-weight: 800;
}

.order-btn {
  padding: 10px 13px;
  font-size: .88rem;
}

.order-btn[disabled] {
  cursor: wait;
  opacity: .65;
  transform: none;
}

.checkout-message {
  min-height: 28px;
  margin: 24px auto 0;
  text-align: center;
  color: #8b1a24;
  font-weight: 600;
}

.site-footer {
  margin-top: 60px;
  border-top: 5px solid var(--gold);
  background: #201d1b;
  color: #d8d0ca;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 40px;
  padding: 48px 0 34px;
}

.site-footer h3 {
  color: white;
  margin: 0 0 10px;
}

.site-footer p { margin: 5px 0; }

.site-footer a { color: #f3ddaa; }

.copyright {
  padding: 17px 0 22px;
  border-top: 1px solid #37312d;
  color: #8f8580;
  text-align: center;
  font-size: .78rem;
}

.success-shell {
  min-height: calc(100vh - 190px);
  display: grid;
  place-items: center;
  padding: 60px 16px;
}

.success-card {
  width: min(640px, 100%);
  padding: clamp(28px, 6vw, 48px);
  background: #fff;
  border: 1px solid #edd7a8;
  border-radius: 24px;
  text-align: center;
  box-shadow: var(--shadow);
}

.success-mark {
  width: 68px;
  height: 68px;
  margin: 0 auto 18px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #dcfce7;
  color: #15803d;
  font-size: 2rem;
  font-weight: 900;
}

.success-card h2 {
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 5vw, 3rem);
  margin: 0 0 12px;
}

@media (max-width: 920px) {
  .menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .chef-card { grid-template-columns: 1fr; }
  .chef-card img { height: 340px; min-height: 0; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .container { width: min(100% - 22px, 1120px); }
  .header-inner { align-items: flex-start; flex-direction: column; }
  .header-contact { text-align: left; }
  .hero { min-height: 380px; }
  .section { padding: 44px 0; }
  .menu-grid { grid-template-columns: 1fr; }
  .menu-card img { height: 230px; }
  .footer-grid { grid-template-columns: 1fr; gap: 26px; }
}


.checkout-modal[hidden] { display: none; }

.checkout-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 20px;
}

.checkout-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 10, 8, .72);
  backdrop-filter: blur(3px);
}

.checkout-dialog {
  position: relative;
  z-index: 1;
  width: min(460px, 100%);
  background: #fffdf8;
  border: 1px solid #e8cf98;
  border-radius: 22px;
  padding: 34px 28px 28px;
  text-align: center;
  box-shadow: 0 24px 70px rgba(0,0,0,.3);
}

.checkout-dialog h2 {
  margin: 6px 0 10px;
  font-family: "Playfair Display", serif;
  font-size: 1.8rem;
  color: #2d2926;
}

.checkout-dialog p {
  margin: 0;
  color: #6f665f;
}

.modal-icon {
  font-size: 2.4rem;
}

.modal-close {
  position: absolute;
  right: 14px;
  top: 10px;
  border: 0;
  background: transparent;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
  color: #6f665f;
}

.modal-ok {
  margin-top: 20px;
}

.menu-loading,.menu-empty{grid-column:1/-1;background:#fff;border:1px dashed #d7c8ba;border-radius:16px;padding:30px;text-align:center;color:#6f665f}
.menu-card .restaurant-name{color:#8b5b0a;font-weight:700;font-size:.82rem;margin:0 0 6px}
.menu-card .pickup-line{font-size:.82rem;color:#746b65;margin-top:7px}
.order-dialog{max-height:90vh;overflow:auto}
.order-form{display:grid;gap:14px;text-align:left;margin-top:18px}
.order-form label{display:grid;gap:6px;font-weight:700;color:#403936}
.order-form input,.order-form textarea,.order-form select{width:100%;padding:11px 12px;border:1px solid #d8cabf;border-radius:10px;background:white;font:inherit}
.order-two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.order-meal-name{text-align:center;font-weight:700;color:#7a4d05;margin-top:0}
.pickup-details{background:#fff7df;border-left:4px solid #c88a18;border-radius:9px;padding:11px 12px;color:#5b4a35;font-size:.9rem}
@media(max-width:640px){.order-two-col{grid-template-columns:1fr}}


/* --- Pass the Gravy visual refresh --- */
body {
  background:
    radial-gradient(circle at 10% 15%, rgba(200,138,24,.08), transparent 26rem),
    radial-gradient(circle at 90% 45%, rgba(91,13,20,.07), transparent 30rem),
    var(--cream);
  overflow-x: hidden;
}

.site-header {
  position: static;
  background: rgba(91,13,20,.96);
}

.hero {
  min-height: 560px;
  overflow: hidden;
  background:
    url("https://images.unsplash.com/photo-1555244162-803834f70033?auto=format&fit=crop&w=2000&q=90")
    center / cover no-repeat;
  animation: heroZoom 16s ease-in-out infinite alternate;
}

.hero::after {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  right: -120px;
  bottom: -160px;
  border-radius: 50%;
  background: rgba(200,138,24,.22);
  filter: blur(8px);
  animation: floatGlow 7s ease-in-out infinite;
}

.hero-overlay {
  background:
    linear-gradient(120deg, rgba(25,8,6,.84), rgba(70,15,17,.58) 55%, rgba(25,8,6,.72)),
    linear-gradient(to top, rgba(0,0,0,.35), transparent 45%);
}

.hero-content {
  max-width: 880px;
  animation: heroEnter .9s ease both;
}

.hero h2 {
  text-shadow: 0 8px 28px rgba(0,0,0,.38);
}

.hero-kicker {
  display: inline-block;
  margin: 18px auto 2px !important;
  padding: 8px 14px;
  border: 1px solid rgba(255,224,157,.48);
  border-radius: 999px;
  color: #ffe09d !important;
  background: rgba(91,13,20,.38);
  font-weight: 800;
  letter-spacing: .03em;
  backdrop-filter: blur(6px);
}

.primary-btn {
  position: relative;
  overflow: hidden;
}

.primary-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-120%);
  background: linear-gradient(110deg, transparent 25%, rgba(255,255,255,.25), transparent 75%);
  transition: transform .65s ease;
}

.primary-btn:hover::after {
  transform: translateX(120%);
}

.community-story {
  padding: 72px 0 56px;
}

.community-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
}

.story-card {
  overflow: hidden;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(200,138,24,.24);
  border-radius: 26px;
  box-shadow: 0 20px 50px rgba(61,36,23,.10);
  transition: transform .35s ease, box-shadow .35s ease;
}

.story-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 28px 65px rgba(61,36,23,.16);
}

.story-image-wrap {
  position: relative;
  min-height: 330px;
  overflow: hidden;
}

.story-image-wrap img {
  width: 100%;
  height: 330px;
  object-fit: cover;
  transition: transform 1s cubic-bezier(.2,.7,.2,1);
}

.story-card:hover .story-image-wrap img {
  transform: scale(1.055);
}

.story-image-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(35,10,8,.48), transparent 58%);
}

.story-badge {
  position: absolute;
  left: 20px;
  bottom: 18px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,248,233,.92);
  color: var(--wine);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.story-copy {
  padding: 26px 28px 30px;
}

.story-copy h2 {
  margin: 0 0 10px;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
}

.story-copy p {
  margin: 0;
  color: var(--muted);
}

.photo-ribbon {
  position: relative;
  min-height: 390px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    url("https://images.pexels.com/photos/4262010/pexels-photo-4262010.jpeg?auto=compress&cs=tinysrgb&w=1800")
    center 45% / cover no-repeat;
  background-attachment: fixed;
}

.photo-ribbon-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(31,8,9,.88), rgba(91,13,20,.62), rgba(31,8,9,.82));
}

.photo-ribbon-content {
  position: relative;
  z-index: 1;
  text-align: center;
  color: white;
  padding: 70px 0;
}

.photo-ribbon-content .eyebrow {
  color: #ffd77b;
}

.photo-ribbon-content h2 {
  margin: 10px auto 24px;
  max-width: 760px;
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 5vw, 3.6rem);
  line-height: 1.08;
  text-shadow: 0 7px 24px rgba(0,0,0,.38);
}

.menu-section {
  position: relative;
}

.menu-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(200,138,24,.06), transparent 32%),
    linear-gradient(315deg, rgba(91,13,20,.045), transparent 34%);
}

.menu-card {
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.menu-card:hover {
  transform: translateY(-7px);
  border-color: rgba(200,138,24,.5);
  box-shadow: 0 20px 44px rgba(61,36,23,.15);
}

.menu-card img {
  transition: transform .65s ease;
}

.menu-card:hover img {
  transform: scale(1.045);
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .75s ease, transform .75s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

@keyframes heroEnter {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes heroZoom {
  from { background-size: 100% auto; }
  to { background-size: 108% auto; }
}

@keyframes floatGlow {
  0%,100% { transform: translateY(0) scale(1); opacity: .7; }
  50% { transform: translateY(-22px) scale(1.06); opacity: 1; }
}

@media (max-width: 920px) {
  .community-grid { grid-template-columns: 1fr; }
  .story-image-wrap,
  .story-image-wrap img { height: 300px; min-height: 300px; }
  .photo-ribbon { background-attachment: scroll; }
}

@media (max-width: 640px) {
  .hero { min-height: 500px; animation: none; }
  .hero-kicker { font-size: .9rem; }
  .community-story { padding: 46px 0 34px; }
  .story-copy { padding: 22px; }
  .photo-ribbon { min-height: 340px; }
}

/* Respect reduced-motion accessibility preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}


/* Legal and SMS consent */
.legal-links{margin-top:8px}.legal-links a{color:inherit;text-decoration:underline}.sms-consent{font-size:.86rem;line-height:1.5;background:#fff8e9;border:1px solid rgba(200,138,24,.35);padding:12px 14px;border-radius:12px}.sms-consent input{margin-right:8px}.sms-consent a{font-weight:700;color:var(--wine)}


/* Restaurant-style menu book slider */
.menu-book-section{
  margin:72px auto 22px;
  padding:38px 18px 30px;
  border-top:1px solid rgba(91,13,20,.12);
  border-bottom:1px solid rgba(91,13,20,.12);
}
.book-heading{max-width:760px;margin:0 auto 26px;text-align:center}
.menu-book-shell{
  position:relative;
  max-width:980px;
  margin:0 auto;
  padding:0 58px;
  perspective:1800px;
}
.menu-book-page{
  min-height:500px;
  display:grid;
  grid-template-columns:1fr 1fr;
  transform-style:preserve-3d;
  transform-origin:center;
  border-radius:18px;
  overflow:hidden;
  background:#f8f0df;
  border:1px solid rgba(92,57,34,.25);
  box-shadow:0 26px 65px rgba(54,33,18,.20), inset 0 0 0 1px rgba(255,255,255,.45);
  position:relative;
}
.menu-book-page::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:2px;
  transform:translateX(-1px);
  background:linear-gradient(to bottom,rgba(60,39,25,.08),rgba(60,39,25,.26),rgba(60,39,25,.08));
  box-shadow:0 0 16px rgba(38,22,13,.16);
  pointer-events:none;
  z-index:3;
}
.book-image-page,
.book-details-page{
  position:relative;
  min-width:0;
  background:
    linear-gradient(rgba(255,250,239,.91),rgba(255,247,231,.94)),
    repeating-linear-gradient(0deg,rgba(113,74,40,.025) 0 1px,transparent 1px 4px);
}
.book-image-page{padding:28px}
.book-image-page img{
  display:block;
  width:100%;
  height:100%;
  min-height:444px;
  object-fit:cover;
  border-radius:10px;
  border:7px solid #fff8e9;
  box-shadow:0 8px 24px rgba(62,36,19,.18);
}
.book-page-number{
  position:absolute;
  top:38px;
  left:38px;
  z-index:2;
  min-width:34px;
  height:34px;
  display:grid;
  place-items:center;
  padding:0 8px;
  border-radius:999px;
  background:rgba(91,13,20,.90);
  color:#fff;
  font-weight:800;
}
.book-details-page{
  padding:54px 46px 42px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.book-kicker{
  margin:0 0 12px;
  color:var(--wine);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:800;
  font-size:.75rem;
}
.book-details-page h3{
  margin:0 0 20px;
  color:#3d2419;
  font-family:"Playfair Display",serif;
  font-size:clamp(2rem,4vw,3.25rem);
  line-height:1.03;
}
.book-description{font-size:1.06rem;line-height:1.75;color:#5d5047}
.book-prep{margin-top:20px;color:#7b6a5e;font-size:.92rem}
.book-order-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-top:30px;
  padding-top:22px;
  border-top:1px solid rgba(91,13,20,.15);
}
.book-price{font-family:"Playfair Display",serif;font-size:1.75rem;font-weight:800;color:var(--wine)}
.book-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
  width:46px;
  height:70px;
  border:0;
  border-radius:999px;
  background:var(--wine);
  color:#fff;
  font-size:2.4rem;
  line-height:1;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(45,21,18,.22);
  transition:transform .2s ease,opacity .2s ease;
}
.book-nav:hover{transform:translateY(-50%) scale(1.06)}
.book-nav-prev{left:0}
.book-nav-next{right:0}
.book-counter{
  margin:14px auto 0;
  text-align:center;
  font-weight:800;
  color:#7b6a5e;
  letter-spacing:.08em;
}
.menu-book-page.flip-next{animation:bookFlipNext .58s cubic-bezier(.2,.7,.2,1)}
.menu-book-page.flip-prev{animation:bookFlipPrev .58s cubic-bezier(.2,.7,.2,1)}
@keyframes bookFlipNext{
  0%{transform:rotateY(0deg);filter:brightness(1)}
  44%{transform:rotateY(-13deg) scale(.985);filter:brightness(.88)}
  100%{transform:rotateY(0deg);filter:brightness(1)}
}
@keyframes bookFlipPrev{
  0%{transform:rotateY(0deg);filter:brightness(1)}
  44%{transform:rotateY(13deg) scale(.985);filter:brightness(.88)}
  100%{transform:rotateY(0deg);filter:brightness(1)}
}
.live-menu-section{margin-top:64px}
@media(max-width:780px){
  .menu-book-shell{padding:0 42px}
  .menu-book-page{grid-template-columns:1fr;min-height:0}
  .menu-book-page::after{display:none}
  .book-image-page{padding:18px 18px 0}
  .book-image-page img{height:310px;min-height:310px}
  .book-details-page{padding:28px 24px 30px}
  .book-details-page h3{font-size:2.15rem}
  .book-order-row{align-items:flex-start;flex-direction:column}
  .book-nav{width:38px;height:62px;font-size:2rem}
}
@media(prefers-reduced-motion:reduce){
  .menu-book-page.flip-next,.menu-book-page.flip-prev{animation:none}
}

.cursive-menu-heading{
  font-family:"Brush Script MT","Segoe Script","Lucida Handwriting",cursive !important;
  font-size:clamp(3rem,7vw,5.6rem) !important;
  font-weight:500 !important;
  letter-spacing:.02em;
  line-height:1;
  color:var(--wine);
  margin-bottom:12px !important;
}
.category-book + .category-book{margin-top:42px}


/* --- Background music control --- */
.music-mute-toggle {
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-height: 38px;
  margin: 0 0 8px auto;
  padding: .48rem .8rem;
  border: 1px solid rgba(245, 200, 95, .65);
  border-radius: 999px;
  background: rgba(255, 248, 233, .08);
  color: #fff2d2;
  font: inherit;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .03em;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.music-mute-toggle:hover {
  background: rgba(245, 200, 95, .15);
  border-color: #f5c85f;
}
.music-mute-toggle:focus-visible {
  outline: 3px solid rgba(245, 200, 95, .45);
  outline-offset: 3px;
}
.music-mute-toggle:active {
  transform: translateY(1px);
}
.music-mute-toggle.is-muted {
  color: #f5c85f;
  background: rgba(0, 0, 0, .12);
}
.music-icon {
  font-family: Georgia, serif;
  font-size: 1rem;
  line-height: 1;
}
@media (max-width: 640px) {
  .music-mute-toggle {
    align-self: flex-start;
    margin: 0 0 8px 0;
  }
}

/* Customer accounts, cart, live orders */
.account-drawer{position:fixed;z-index:1200;right:0;top:0;height:100vh;width:min(460px,94vw);overflow:auto;background:#fff;padding:1.25rem;box-shadow:-12px 0 40px rgba(0,0,0,.2)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid #ddd;margin-bottom:1rem}.drawer-head .modal-close{position:static}.cart-row{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid #eee}.cart-row>div:last-child{text-align:right}.cart-total{display:flex;justify-content:space-between;font-size:1.2rem;padding:1rem 0}.security-note{font-size:.86rem;color:#59636e;line-height:1.45}.auth-tabs{display:flex;gap:.5rem;margin-bottom:1rem}.customer-orders{display:grid;gap:.75rem}.order-status-card{border:1px solid #ddd;border-radius:12px;padding:1rem;background:#fafafa}.status-pill{float:right;border-radius:999px;padding:.2rem .6rem;background:#eee;text-transform:capitalize}.header-contact{flex-wrap:wrap}


/* Compact owner-facing Stripe verification control */
.stripe-test-btn{opacity:.82;font-size:.72rem;padding:.42rem .68rem}
.stripe-test-btn:hover{opacity:1}
.stripe-test-btn:disabled{opacity:.5;cursor:wait}


/* v2.9 food effects + quantity ordering */
.food-stage{position:relative;margin:0;overflow:visible;isolation:isolate}
.menu-card>.food-stage{width:100%}
.food-stage img{position:relative;z-index:2;width:100%;object-fit:cover;border-radius:inherit}
.food-fx-orbit,.food-fx-steam{position:absolute;z-index:1;pointer-events:none;opacity:0}
.food-fx-orbit{width:16px;height:16px;border-radius:50%;box-shadow:0 0 18px currentColor}
.food-fx-orbit-a{left:-9px;top:20%;}.food-fx-orbit-b{right:-9px;bottom:20%}
.food-fx-steam{width:14px;height:38px;top:-31px;border-radius:50%;border-left:3px solid rgba(255,255,255,.74);filter:blur(.3px)}
.food-fx-steam-a{left:34%}.food-fx-steam-b{left:58%;animation-delay:.25s}
.food-fx-sweet{color:#d5a52c}.food-fx-crisp{color:#c66b22}.food-fx-steam{color:#9d7b5a}.food-fx-fresh{color:#5f8f48}.food-fx-sizzle{color:#b14d2c}
.food-stage::before{content:"";position:absolute;z-index:0;inset:-8px;border-radius:22px;border:2px solid transparent;opacity:.5;transition:opacity .25s ease,transform .25s ease;box-shadow:0 0 0 1px color-mix(in srgb,currentColor 24%,transparent),0 0 24px color-mix(in srgb,currentColor 22%,transparent)}
.food-fx-active::before{animation:foodHalo 1.35s ease-out}
.food-fx-active .food-fx-orbit-a{animation:foodSparkA 1.15s ease-out}
.food-fx-active .food-fx-orbit-b{animation:foodSparkB 1.25s .1s ease-out}
.food-fx-steam.food-fx-active .food-fx-steam,.food-fx-sizzle.food-fx-active .food-fx-steam{animation:foodSteam 1.45s ease-out}
.food-fx-crisp.food-fx-active::after{content:"";position:absolute;z-index:1;left:8%;right:8%;bottom:-10px;height:4px;border-radius:50%;box-shadow:14px 0 0 currentColor,60px 2px 0 currentColor,110px -2px 0 currentColor,170px 2px 0 currentColor;animation:crumbPop .75s ease-out}
.food-fx-sweet.food-fx-active::after,.food-fx-fresh.food-fx-active::after{content:"✦";position:absolute;z-index:3;right:-15px;top:-18px;color:currentColor;font-size:26px;text-shadow:-220px 32px 0 currentColor;animation:sweetTwinkle 1.2s ease-out}
.book-image-page .food-stage{width:100%;height:100%;display:grid;place-items:center}
.book-image-page .food-stage img{height:100%;min-height:420px}
.menu-card>.food-stage img{height:205px;border-radius:18px 18px 0 0}
.quantity-picker{display:grid;grid-template-columns:46px minmax(70px,1fr) 46px;gap:8px;align-items:center}
.quantity-picker input{text-align:center;font-weight:800}
.qty-btn,.qty-mini{border:1px solid #d8cabf;background:#fff8ee;color:#5b0d14;border-radius:10px;font-weight:900;cursor:pointer}
.qty-btn{height:44px;font-size:1.35rem}.qty-mini{width:30px;height:30px}
.order-line-preview{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:12px;background:#fff8e9;border:1px solid rgba(200,138,24,.32)}
.cart-qty-controls{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin-bottom:6px;white-space:nowrap}
@keyframes foodHalo{0%{opacity:0;transform:scale(.97)}35%{opacity:.95;transform:scale(1.02)}100%{opacity:.38;transform:scale(1)}}
@keyframes foodSparkA{0%{opacity:0;transform:translate(0,18px) scale(.3)}45%{opacity:1}100%{opacity:0;transform:translate(-12px,-24px) scale(1.2)}}
@keyframes foodSparkB{0%{opacity:0;transform:translate(0,-12px) scale(.3)}45%{opacity:1}100%{opacity:0;transform:translate(16px,26px) scale(1.1)}}
@keyframes foodSteam{0%{opacity:0;transform:translateY(18px) scale(.7)}35%{opacity:.82}100%{opacity:0;transform:translateY(-25px) translateX(7px) scale(1.2)}}
@keyframes crumbPop{0%{opacity:0;transform:scale(.35)}45%{opacity:.9}100%{opacity:0;transform:translateY(10px) scale(1.2)}}
@keyframes sweetTwinkle{0%{opacity:0;transform:scale(.35) rotate(0)}45%{opacity:1}100%{opacity:0;transform:scale(1.25) rotate(65deg)}}
@media(prefers-reduced-motion:reduce){.food-fx-orbit,.food-fx-steam,.food-stage::after{display:none!important}.food-stage::before{animation:none!important}}

/* v3.0 food-specific motion system: effects stay around the food image, never over it. */
.food-fx-particle,.food-fx-vapor,.food-fx-snow,.food-fx-bubble{position:absolute;z-index:1;pointer-events:none;opacity:0}
.food-fx-particle{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}
.food-fx-particle.p1{left:-9px;bottom:22%}.food-fx-particle.p2{right:-8px;top:30%}.food-fx-particle.p3{left:48%;bottom:-10px}
.food-fx-vapor{width:15px;height:44px;top:-34px;border-radius:50%;border-left:3px solid rgba(255,255,255,.78);filter:blur(.45px)}
.food-fx-vapor.v1{left:33%}.food-fx-vapor.v2{left:62%;animation-delay:.18s}
.food-fx-snow{font-size:19px;line-height:1;color:#dff5ff;text-shadow:0 0 12px rgba(150,220,255,.85)}
.food-fx-snow.s1{left:-18px;top:15%}.food-fx-snow.s2{right:-18px;top:46%}.food-fx-snow.s3{left:47%;bottom:-20px}
.food-fx-bubble{border:2px solid currentColor;border-radius:50%}
.food-fx-bubble.b1{width:10px;height:10px;left:-8px;bottom:18%}.food-fx-bubble.b2{width:14px;height:14px;right:-11px;bottom:28%}.food-fx-bubble.b3{width:7px;height:7px;right:18%;bottom:-9px}
.food-fx-fried{color:#d47921}.food-fx-meat{color:#9c3f20}.food-fx-steam{color:#a88669}.food-fx-cold{color:#9edbf3}.food-fx-bakedSweet{color:#c99630}.food-fx-fresh{color:#5c9448}.food-fx-warm{color:#b45b31}
.food-fx-fried.food-fx-active .food-fx-particle{animation:oilCrackle .72s ease-out}
.food-fx-fried.food-fx-active .p2{animation-delay:.08s}.food-fx-fried.food-fx-active .p3{animation-delay:.15s}
.food-fx-meat.food-fx-active .food-fx-bubble{animation:greaseBubble .95s ease-out}
.food-fx-meat.food-fx-active .b2{animation-delay:.12s}.food-fx-meat.food-fx-active .b3{animation-delay:.23s}
.food-fx-meat.food-fx-active .food-fx-vapor,.food-fx-steam.food-fx-active .food-fx-vapor,.food-fx-warm.food-fx-active .food-fx-vapor{animation:mealSteam 1.45s ease-out}
.food-fx-steam.food-fx-active .food-fx-bubble{animation:simmerBubble 1.05s ease-out}
.food-fx-cold.food-fx-active .food-fx-snow{animation:snowDrift 1.8s ease-out}
.food-fx-cold.food-fx-active .s2{animation-delay:.12s}.food-fx-cold.food-fx-active .s3{animation-delay:.28s}
.food-fx-bakedSweet.food-fx-active .food-fx-particle{animation:ovenSpark 1.15s ease-out}
.food-fx-fresh.food-fx-active .food-fx-particle{animation:freshLift 1.15s ease-out}
.food-fx-active::before{animation:foodHalo 1.35s ease-out}
@keyframes oilCrackle{0%{opacity:0;transform:translateY(8px) scale(.3)}30%{opacity:1}65%{opacity:.8;transform:translateY(-12px) scale(1.15)}100%{opacity:0;transform:translateY(-24px) translateX(8px) scale(.55)}}
@keyframes greaseBubble{0%{opacity:0;transform:scale(.35)}35%{opacity:.95;transform:scale(1)}75%{opacity:.6;transform:translateY(-12px) scale(1.2)}100%{opacity:0;transform:translateY(-22px) scale(.5)}}
@keyframes mealSteam{0%{opacity:0;transform:translateY(17px) scale(.7)}30%{opacity:.78}100%{opacity:0;transform:translateY(-30px) translateX(9px) scale(1.25)}}
@keyframes simmerBubble{0%{opacity:0;transform:scale(.4)}35%{opacity:.75}100%{opacity:0;transform:translateY(-24px) scale(1.35)}}
@keyframes snowDrift{0%{opacity:0;transform:translateY(-8px) rotate(0) scale(.65)}25%{opacity:.95}100%{opacity:0;transform:translateY(36px) translateX(9px) rotate(130deg) scale(1.05)}}
@keyframes ovenSpark{0%{opacity:0;transform:scale(.25)}40%{opacity:1;box-shadow:0 0 16px currentColor}100%{opacity:0;transform:translateY(-18px) scale(1.3)}}
@keyframes freshLift{0%{opacity:0;transform:translateY(10px) scale(.35)}45%{opacity:.85}100%{opacity:0;transform:translateY(-20px) translateX(-7px) scale(.9)}}
@media(prefers-reduced-motion:reduce){.food-fx-particle,.food-fx-vapor,.food-fx-snow,.food-fx-bubble{display:none!important}}


/* v3.1: persistent, clearly visible food-specific effects while a slider item is displayed. */
.food-fx-toggle{border:1px solid rgba(255,255,255,.35)!important}
.food-stage.food-fx-active::before{opacity:.9!important;animation:foodHaloLoop 2.2s ease-in-out infinite!important}
.food-fx-fried.food-fx-active .food-fx-particle{animation:oilCrackleLoop 1.05s ease-out infinite!important}
.food-fx-fried.food-fx-active .p2{animation-delay:.18s!important}.food-fx-fried.food-fx-active .p3{animation-delay:.36s!important}
.food-fx-meat.food-fx-active .food-fx-bubble{animation:greaseBubbleLoop 1.35s ease-out infinite!important}
.food-fx-meat.food-fx-active .b2{animation-delay:.25s!important}.food-fx-meat.food-fx-active .b3{animation-delay:.5s!important}
.food-fx-meat.food-fx-active .food-fx-vapor,.food-fx-steam.food-fx-active .food-fx-vapor,.food-fx-warm.food-fx-active .food-fx-vapor{animation:mealSteamLoop 1.8s ease-out infinite!important}
.food-fx-steam.food-fx-active .food-fx-bubble{animation:simmerBubbleLoop 1.45s ease-out infinite!important}
.food-fx-cold.food-fx-active .food-fx-snow{animation:snowDriftLoop 2.2s linear infinite!important;font-size:23px!important}
.food-fx-cold.food-fx-active .s2{animation-delay:.65s!important}.food-fx-cold.food-fx-active .s3{animation-delay:1.25s!important}
.food-fx-bakedSweet.food-fx-active .food-fx-particle{animation:ovenSparkLoop 1.8s ease-out infinite!important}
.food-fx-fresh.food-fx-active .food-fx-particle{animation:freshLiftLoop 1.9s ease-out infinite!important}
.food-stage.food-fx-active .food-fx-particle,.food-stage.food-fx-active .food-fx-bubble,.food-stage.food-fx-active .food-fx-snow,.food-stage.food-fx-active .food-fx-vapor{will-change:transform,opacity}
@keyframes foodHaloLoop{0%,100%{opacity:.42;transform:scale(.99)}50%{opacity:1;transform:scale(1.025)}}
@keyframes oilCrackleLoop{0%{opacity:0;transform:translateY(9px) scale(.25)}22%{opacity:1}60%{opacity:.95;transform:translateY(-13px) scale(1.25)}100%{opacity:0;transform:translateY(-28px) translateX(10px) scale(.45)}}
@keyframes greaseBubbleLoop{0%{opacity:0;transform:scale(.25)}30%{opacity:1;transform:scale(1)}72%{opacity:.75;transform:translateY(-15px) scale(1.35)}100%{opacity:0;transform:translateY(-28px) scale(.55)}}
@keyframes mealSteamLoop{0%{opacity:0;transform:translateY(16px) scale(.7)}25%{opacity:.92}100%{opacity:0;transform:translateY(-38px) translateX(10px) scale(1.3)}}
@keyframes simmerBubbleLoop{0%{opacity:0;transform:scale(.35)}30%{opacity:.9}100%{opacity:0;transform:translateY(-30px) scale(1.45)}}
@keyframes snowDriftLoop{0%{opacity:0;transform:translateY(-14px) rotate(0) scale(.7)}18%{opacity:1}82%{opacity:.9}100%{opacity:0;transform:translateY(54px) translateX(12px) rotate(180deg) scale(1.08)}}
@keyframes ovenSparkLoop{0%{opacity:0;transform:scale(.2)}35%{opacity:1;box-shadow:0 0 20px currentColor}100%{opacity:0;transform:translateY(-24px) scale(1.45)}}
@keyframes freshLiftLoop{0%{opacity:0;transform:translateY(12px) scale(.3)}35%{opacity:.95}100%{opacity:0;transform:translateY(-25px) translateX(-9px) scale(1)}}
@media(prefers-reduced-motion:reduce){
  .food-stage.food-fx-active::before{display:block!important;animation:foodHaloLoop 3.4s ease-in-out infinite!important}
  .food-stage.food-fx-active .food-fx-snow,.food-stage.food-fx-active .food-fx-particle,.food-stage.food-fx-active .food-fx-vapor,.food-stage.food-fx-active .food-fx-bubble{display:block!important;animation-duration:3.8s!important}
}
\n\n/* v3.2: high-visibility food FX for mobile/iPhone. Effects sit in the photo mat/frame, not on the food. */\n.book-image-page{overflow:visible!important}\n.book-image-page .food-stage{overflow:visible!important;position:relative!important}\n.book-image-page .food-stage img{z-index:2!important}\n.food-stage.food-fx-active{filter:drop-shadow(0 0 10px color-mix(in srgb,currentColor 34%,transparent))}\n.food-stage.food-fx-active::before{inset:-14px!important;border:3px solid color-mix(in srgb,currentColor 62%,transparent)!important;box-shadow:0 0 18px color-mix(in srgb,currentColor 55%,transparent),0 0 42px color-mix(in srgb,currentColor 32%,transparent)!important}\n.food-fx-particle{z-index:4!important;width:12px!important;height:12px!important;box-shadow:0 0 10px currentColor,0 0 20px currentColor!important}\n.food-fx-vapor{z-index:4!important;width:22px!important;height:58px!important;border-left-width:4px!important;filter:blur(.2px) drop-shadow(0 0 6px rgba(255,255,255,.85))!important}\n.food-fx-bubble{z-index:4!important;border-width:3px!important;box-shadow:0 0 8px currentColor!important}\n.food-fx-snow{z-index:4!important;font-size:30px!important;text-shadow:0 0 8px #fff,0 0 18px rgba(120,210,255,.95)!important}\n.food-fx-particle.p1{left:-15px!important}.food-fx-particle.p2{right:-14px!important}.food-fx-particle.p3{bottom:-14px!important}\n.food-fx-vapor.v1{left:28%!important}.food-fx-vapor.v2{left:66%!important}\n.food-fx-fried.food-fx-active .food-fx-particle{animation:oilCrackleLoop .68s ease-out infinite!important}\n.food-fx-fried.food-fx-active::after{content:'✦  •  ✦';position:absolute;z-index:4;left:8%;right:8%;bottom:-18px;text-align:center;color:#e88a23;font-size:18px;letter-spacing:18px;text-shadow:0 0 12px #f6aa3b;animation:fryEdgeFlash .8s ease-in-out infinite;pointer-events:none}\n@keyframes fryEdgeFlash{0%,100%{opacity:.25;transform:scale(.94)}50%{opacity:1;transform:scale(1.05)}}\n@media(max-width:760px){\n .book-image-page{padding:28px 34px!important}\n .food-stage.food-fx-active::before{inset:-12px!important}\n .food-fx-particle.p1{left:-13px!important}.food-fx-particle.p2{right:-13px!important}\n}\n
/* v3.3: fail-safe always-visible food-specific FX.
   Visual effects do not rely on IntersectionObserver or JavaScript to become visible. */
.food-stage.food-fx-active,
.food-stage[data-food-fx]{
  position:relative!important;
  overflow:visible!important;
  isolation:isolate;
}
.book-image-page{overflow:visible!important}
.book-image-page .food-stage{overflow:visible!important}
.food-stage[data-food-fx]::before{
  content:"";
  position:absolute;
  inset:-12px;
  z-index:0;
  border:3px solid currentColor;
  border-radius:26px;
  opacity:.48;
  box-shadow:0 0 16px currentColor,0 0 38px color-mix(in srgb,currentColor 35%,transparent);
  animation:ptgFxHalo 1.65s ease-in-out infinite!important;
  pointer-events:none;
}
.food-stage[data-food-fx] img{position:relative;z-index:2!important}
.food-stage[data-food-fx] .food-fx-particle,
.food-stage[data-food-fx] .food-fx-vapor,
.food-stage[data-food-fx] .food-fx-snow,
.food-stage[data-food-fx] .food-fx-bubble{
  display:block!important;
  opacity:1;
  z-index:6!important;
}
.food-stage.food-fx-fried .food-fx-particle{animation:ptgFryPop .62s ease-out infinite!important;background:#f59a2a!important;color:#f59a2a!important}
.food-stage.food-fx-fried .p2{animation-delay:.19s!important}.food-stage.food-fx-fried .p3{animation-delay:.37s!important}
.food-stage.food-fx-fried::after{
  content:"✦  •  ✦  •  ✦";
  position:absolute;
  left:4%;right:4%;bottom:-24px;
  z-index:7;
  color:#e9801e;
  text-align:center;
  font-size:19px;
  letter-spacing:13px;
  text-shadow:0 0 10px #ffb04b;
  animation:ptgFryFlash .72s ease-in-out infinite!important;
  pointer-events:none;
}
.food-stage.food-fx-meat .food-fx-bubble{animation:ptgGrease 1.05s ease-out infinite!important;color:#bd592c!important}
.food-stage.food-fx-meat .b2{animation-delay:.3s!important}.food-stage.food-fx-meat .b3{animation-delay:.58s!important}
.food-stage.food-fx-meat .food-fx-vapor,
.food-stage.food-fx-steam .food-fx-vapor,
.food-stage.food-fx-warm .food-fx-vapor{animation:ptgSteam 1.55s ease-out infinite!important}
.food-stage.food-fx-steam .food-fx-bubble{animation:ptgSimmer 1.1s ease-out infinite!important}
.food-stage.food-fx-cold .food-fx-snow{
  animation:ptgSnowReal 2.4s linear infinite!important;
  width:7px!important;height:7px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.98) 0 22%,rgba(224,244,255,.88) 38%,rgba(255,255,255,.35) 62%,transparent 72%)!important;
  box-shadow:0 0 5px rgba(255,255,255,.9),0 0 11px rgba(190,230,255,.55)!important;
  filter:blur(.15px)!important;
  color:transparent!important;
  text-shadow:none!important;
}
.food-stage.food-fx-cold .s1{left:-16px!important;top:16%!important;width:6px!important;height:6px!important}
.food-stage.food-fx-cold .s2{right:-16px!important;top:44%!important;width:9px!important;height:9px!important;animation-delay:.7s!important}
.food-stage.food-fx-cold .s3{left:48%!important;bottom:-18px!important;width:5px!important;height:5px!important;animation-delay:1.35s!important}
@keyframes ptgSnowReal{
  0%{opacity:0;transform:translate3d(0,-10px,0) scale(.7)}
  16%{opacity:.82}
  55%{opacity:.7;transform:translate3d(5px,24px,0) scale(1)}
  100%{opacity:0;transform:translate3d(-4px,58px,0) scale(.82)}
}
.food-stage.food-fx-bakedSweet .food-fx-particle{animation:ptgSweet 1.25s ease-out infinite!important;color:#d6a438!important}
.food-stage.food-fx-fresh .food-fx-particle{animation:ptgFresh 1.45s ease-out infinite!important;color:#71a74e!important}
@keyframes ptgFxHalo{0%,100%{opacity:.28;transform:scale(.992)}50%{opacity:.8;transform:scale(1.014)}}
@keyframes ptgFryPop{0%{opacity:0;transform:translate(0,6px) scale(.35)}35%{opacity:1}100%{opacity:0;transform:translate(10px,-28px) scale(1.15)}}
@keyframes ptgFryFlash{0%,100%{opacity:.25;transform:scale(.96)}50%{opacity:1;transform:scale(1.05)}}
@keyframes ptgGrease{0%{opacity:0;transform:translateY(8px) scale(.35)}35%{opacity:1}100%{opacity:0;transform:translateY(-26px) scale(1.35)}}
@keyframes ptgSteam{0%{opacity:0;transform:translateY(14px) scale(.7)}25%{opacity:.9}100%{opacity:0;transform:translateY(-38px) translateX(8px) scale(1.25)}}
@keyframes ptgSimmer{0%{opacity:0;transform:translateY(8px) scale(.4)}40%{opacity:1}100%{opacity:0;transform:translateY(-24px) scale(1.4)}}
@keyframes ptgSnow{0%{opacity:0;transform:translateY(-18px) rotate(0)}20%{opacity:1}80%{opacity:1}100%{opacity:0;transform:translateY(62px) translateX(12px) rotate(190deg)}}
@keyframes ptgSweet{0%{opacity:0;transform:scale(.3) rotate(0)}40%{opacity:1}100%{opacity:0;transform:scale(1.35) rotate(90deg)}}
@keyframes ptgFresh{0%{opacity:0;transform:translateY(10px) scale(.55)}35%{opacity:1}100%{opacity:0;transform:translateY(-26px) scale(1.1)}}
/* Keep FX visibly present even when iOS Reduce Motion is enabled; movement is gentler. */
@media (prefers-reduced-motion:reduce){
  .food-stage[data-food-fx] .food-fx-particle,.food-stage[data-food-fx] .food-fx-vapor,.food-stage[data-food-fx] .food-fx-snow,.food-stage[data-food-fx] .food-fx-bubble{display:block!important}
  .food-stage[data-food-fx]::before{display:block!important;animation-duration:3.2s!important}
  .food-stage[data-food-fx] .food-fx-particle,.food-stage[data-food-fx] .food-fx-vapor,.food-stage[data-food-fx] .food-fx-snow,.food-stage[data-food-fx] .food-fx-bubble{animation-duration:3s!important}
}
@media(max-width:760px){
 .book-image-page .food-stage[data-food-fx]::before{inset:-10px!important;border-width:3px!important}
 .food-stage.food-fx-fried::after{bottom:-20px;font-size:17px;letter-spacing:10px}
}


/* v3.5 mobile stability + effect isolation ---------------------------------
   Only the effect that belongs to the current food type may render. This
   intentionally overrides the older iPhone fail-safe rules above. */
.food-stage[data-food-fx] .food-fx-particle,
.food-stage[data-food-fx] .food-fx-vapor,
.food-stage[data-food-fx] .food-fx-snow,
.food-stage[data-food-fx] .food-fx-bubble{
  display:none!important;
  opacity:0!important;
}
.food-stage.food-fx-fried .food-fx-particle,
.food-stage.food-fx-bakedSweet .food-fx-particle,
.food-stage.food-fx-fresh .food-fx-particle{
  display:block!important;
}
.food-stage.food-fx-meat .food-fx-bubble,
.food-stage.food-fx-steam .food-fx-bubble{
  display:block!important;
}
.food-stage.food-fx-meat .food-fx-vapor,
.food-stage.food-fx-steam .food-fx-vapor,
.food-stage.food-fx-warm .food-fx-vapor{
  display:block!important;
}
.food-stage.food-fx-cold .food-fx-snow{
  display:block!important;
}
/* Snow is hard-disabled for every non-cold meal, even with Reduce Motion. */
.food-stage:not(.food-fx-cold) .food-fx-snow{
  display:none!important;
  visibility:hidden!important;
  animation:none!important;
  opacity:0!important;
}

/* Mobile menu book: keep the photo compact and prevent giant blank panels. */
@media(max-width:780px){
  .menu-book-section{margin-top:48px;padding-left:8px;padding-right:8px}
  .menu-book-shell{padding:0 40px!important;max-width:100%!important}
  .menu-book-page{width:100%;border-radius:16px}
  .book-image-page{padding:14px 14px 0!important;min-height:0!important}
  .book-image-page .food-stage{height:auto!important;min-height:0!important;aspect-ratio:4/5;display:block!important}
  .book-image-page .food-stage img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    object-fit:cover!important;
    border-width:5px!important;
  }
  .book-page-number{top:28px;left:28px}
  .book-details-page{padding:24px 22px 28px!important}
  .book-details-page h3{font-size:clamp(2rem,10vw,2.65rem)!important;line-height:1.02}
  .book-description{font-size:1rem;line-height:1.58}
  .book-nav{width:42px;height:68px}
  .book-nav-prev{left:-2px}.book-nav-next{right:-2px}
}
@media(max-width:430px){
  .menu-book-shell{padding:0 34px!important}
  .book-image-page .food-stage{aspect-ratio:4/5}
  .book-nav{width:38px;height:62px;font-size:2rem}
  .book-details-page{padding:22px 18px 26px!important}
}

/* A fallback should still look intentional rather than leaving a white box. */
.meal-image-fallback{filter:saturate(.82) contrast(.96)}

/* v3.7 — food FX refinement: fried food = steam/smoke, not orange dots. */
.food-stage.food-fx-fried .food-fx-particle,
.food-stage.food-fx-fried .food-fx-bubble,
.food-stage.food-fx-fried::after{display:none!important;animation:none!important}
.food-stage.food-fx-fried .food-fx-vapor{
  display:block!important; opacity:0; z-index:4!important;
  border-left:4px solid rgba(245,242,235,.86)!important;
  filter:blur(1.1px) drop-shadow(0 0 5px rgba(255,255,255,.45))!important;
  animation:ptgFriedSmoke 2.15s ease-out infinite!important;
}
.food-stage.food-fx-fried .food-fx-vapor.v2{animation-delay:.72s!important}
@keyframes ptgFriedSmoke{
  0%{opacity:0;transform:translateY(18px) translateX(0) scale(.65)}
  22%{opacity:.72}
  65%{opacity:.46;transform:translateY(-25px) translateX(6px) scale(1.08)}
  100%{opacity:0;transform:translateY(-48px) translateX(-5px) scale(1.35)}
}
/* Hot/baked desserts intentionally retain the warm orange/gold dot effect. */
.food-stage.food-fx-bakedSweet .food-fx-particle{display:block!important;color:#d98b2b!important;background:#d98b2b!important}
