/* Self-hosted, Times-compatible serif prevents platform fallback fonts from
   changing the measured title/label widths. No external font/CDN request. */
@font-face {
  font-family:"Product Serif";
  src:url("/fonts/tinos-latin-700-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}

/* Final readability pass: center product identity while supporting copy stays
   left-aligned, and keep the active 3D caption fully floating. */

/* Main product page: the restaurant name in the top bar and the product name
   are centered identity elements. Explanatory/supporting copy stays left. */
.topbar {
  position:relative!important;
}
.topbar > div:first-child {
  min-width:0;
}
.topbar #restaurantName {
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:min(56%,320px)!important;
  margin:0!important;
  transform:translate(-50%,-50%)!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:center!important;
  pointer-events:none;
}
/* Keep the small context label aligned left instead of moving it with the
   centered restaurant identity. */
.topbar .top-label {
  text-align:left!important;
}

.dish-card .dish-title-row {
  display:block!important;
  width:100%;
  text-align:center!important;
}
.dish-card .dish-title-row > div {
  width:100%!important;
  text-align:center!important;
}
.dish-card .restaurant-small,
.dish-card #productName,
.dish-card h1 {
  display:block;
  width:100%;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}
.dish-card .price {
  display:block;
  width:max-content;
  margin:10px auto 0!important;
  text-align:center!important;
}
.dish-card .description,
.dish-card .support-message,
.dish-card .ar-help {
  text-align:left!important;
  unicode-bidi:plaintext;
}

/* AR entry card (the screen shown before entering 3D): center only the
   restaurant + product identity. Guidance stays left-aligned for readability. */
.ar-entry-card .ar-entry-restaurant,
.ar-entry-card #arEntryProduct,
.ar-entry-card h1 {
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
  unicode-bidi:plaintext;
}
.ar-entry-card .ar-entry-copy,
.ar-entry-card .ar-entry-description,
.ar-entry-card .ar-entry-hint {
  width:100%;
  max-width:none;
  text-align:left!important;
  unicode-bidi:plaintext;
}

/* Active 3D stays clean and floating. */
html.ar-route-3d .ar-entry-3d-caption {
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  transform:none!important;
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:58px 20px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  color:#18130f!important;
  text-align:center!important;
  text-shadow:none!important;
  direction:ltr;
  pointer-events:none;
}
html.ar-route-3d .ar-entry-3d-caption .dish-title {
  display:block;
  width:100%;
  margin:0;
  padding:0 20px;
  color:#18130f!important;
  font-size:34px!important;
  font-weight:700!important;
  line-height:1.08!important;
  letter-spacing:-.8px!important;
  text-align:center!important;
  text-shadow:none!important;
  unicode-bidi:plaintext;
}

/* Reference measured at 840 x 1344: card 89% of viewport width, button
   80%, button height 13.1vw, title 8.15vw. One shared unit preserves the
   icon/text/spacing ratios on phones; cap it for larger screens. */
html.ar-route-ready,
html.ar-route-unsupported { --launch-unit:min(1vw,6px); }
html.ar-route-ready .ar-entry-wash,
html.ar-route-unsupported .ar-entry-wash {
  background:linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.02) 55%,rgba(0,0,0,.12) 100%)!important;
}
html.ar-route-ready model-viewer,
html.ar-route-unsupported model-viewer {
  opacity:1!important;
  transform:none!important;
}

html.ar-route-ready .ar-entry-card,
html.ar-route-unsupported .ar-entry-card {
  left:50%!important;
  bottom:max(calc(4 * var(--launch-unit)),calc(env(safe-area-inset-bottom) + 8px))!important;
  transform:translateX(-50%)!important;
  width:calc(89 * var(--launch-unit))!important;
  box-sizing:border-box;
  align-items:center!important;
  padding:calc(3.9 * var(--launch-unit)) calc(4.4 * var(--launch-unit)) calc(3.8 * var(--launch-unit))!important;
  border:1px solid color-mix(in srgb,var(--accent) 38%,rgba(255,244,223,.55))!important;
  border-radius:calc(5.2 * var(--launch-unit))!important;
  background:linear-gradient(180deg,rgba(36,28,21,.68),rgba(31,24,19,.78))!important;
  box-shadow:0 18px 44px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.06)!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
  color:#fff8ec!important;
  text-align:center!important;
  direction:ltr!important;
  max-height:calc(100svh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);
  overflow:auto;
}

html.ar-route-ready .ar-entry-card .ar-entry-restaurant,
html.ar-route-ready .ar-entry-card .ar-entry-meta,
html.ar-route-ready .ar-entry-card .ar-entry-description,
html.ar-route-ready .ar-entry-card .ar-entry-hint,
html.ar-route-unsupported .ar-entry-card .ar-entry-restaurant,
html.ar-route-unsupported .ar-entry-card .ar-entry-meta,
html.ar-route-unsupported .ar-entry-card .ar-entry-description,
html.ar-route-unsupported .ar-entry-card .ar-entry-hint {
  display:none!important;
}

.ar-entry-kicker {
  margin:0 0 calc(1 * var(--launch-unit,1vw))!important;
  color:rgba(255,244,224,.76)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
  font-size:calc(2.15 * var(--launch-unit,1vw))!important;
  font-weight:500!important;
  line-height:1.2!important;
  letter-spacing:.42em!important;
  text-transform:uppercase!important;
  text-align:center!important;
}

html.ar-route-ready .ar-entry-card #arEntryProduct,
html.ar-route-unsupported .ar-entry-card #arEntryProduct {
  width:100%!important;
  margin:0!important;
  color:#fffaf2!important;
  font-family:"Product Serif",Georgia,"Times New Roman",serif!important;
  font-size:calc(8.15 * var(--launch-unit))!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:-.005em!important;
  text-align:center!important;
  text-shadow:0 2px 12px rgba(0,0,0,.18)!important;
  text-wrap:balance;
  overflow-wrap:anywhere;
}

html.ar-route-ready .ar-entry-card .ar-entry-copy,
html.ar-route-unsupported .ar-entry-card .ar-entry-copy {
  width:100%!important;
  margin:calc(1 * var(--launch-unit)) 0 0!important;
  color:rgba(255,245,228,.68)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
  font-size:calc(2.5 * var(--launch-unit))!important;
  font-weight:400!important;
  line-height:1.35!important;
  letter-spacing:.01em!important;
  text-align:center!important;
  text-shadow:0 1px 10px rgba(0,0,0,.2)!important;
}

html.ar-route-ready .ar-entry-card .ar-entry-button,
html.ar-route-unsupported .ar-entry-card .ar-entry-button {
  width:100%!important;
  box-sizing:border-box;
  min-height:calc(13.1 * var(--launch-unit))!important;
  margin-top:calc(3 * var(--launch-unit))!important;
  padding:calc(1.2 * var(--launch-unit)) calc(7 * var(--launch-unit))!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:0!important;
  border:1px solid color-mix(in srgb,var(--accent) 48%,rgba(255,244,223,.42))!important;
  border-radius:calc(4.5 * var(--launch-unit))!important;
  background:color-mix(in srgb,var(--accent) 18%,rgba(16,13,10,.54))!important;
  color:#fffaf2!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 28px rgba(0,0,0,.14)!important;
  font-family:"Product Serif",Georgia,"Times New Roman",serif!important;
  font-size:calc(4.4 * var(--launch-unit))!important;
  font-weight:600!important;
  line-height:1.1!important;
  letter-spacing:0!important;
  text-align:center!important;
  direction:ltr!important;
}
html.ar-route-ready .ar-entry-card .ar-entry-button::after,
html.ar-route-unsupported .ar-entry-card .ar-entry-button::after {
  content:none!important;
  display:none!important;
}
.ar-entry-button-content {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:calc(2.5 * var(--launch-unit));
  min-width:0;
  transform:translateX(calc(-1.5 * var(--launch-unit)));
}
#arEntryButtonLabel { min-width:0; overflow-wrap:anywhere; }
.ar-entry-button-icon,
.ar-entry-button-chevron {
  display:grid;
  place-items:center;
  flex-shrink:0;
}
.ar-entry-button-icon {
  /* Tint derives from the configured accent, lifted for dark colors and
     shaded for very light colors.
     It stays distinct from the ivory label, even with a white accent. */
  color:var(--ar-icon-color,color-mix(in srgb,var(--accent) 45%,#f1dfb6));
}
.ar-entry-button-icon svg {
  width:calc(9.6 * var(--launch-unit));
  height:calc(9.6 * var(--launch-unit));
  stroke:currentColor;
  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.ar-entry-button-chevron {
  position:absolute;
  right:calc(3.5 * var(--launch-unit));
  color:currentColor;
  pointer-events:none;
}
.ar-entry-button-chevron svg {
  width:calc(4.7 * var(--launch-unit));
  height:calc(4.7 * var(--launch-unit));
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

@media (max-width:480px) {
  .topbar #restaurantName { width:min(52%,220px)!important; }
}

@media (max-width:369px) {
  html.ar-route-3d .ar-entry-3d-caption { padding-inline:16px!important; }
  html.ar-route-3d .ar-entry-3d-caption .dish-title {
    padding-inline:16px;
    font-size:30px!important;
  }
}
