/*
 * Readability layer for the production-only site build.
 *
 * The original component source is not present in this repository, so the
 * code-path attributes preserved by the bundle are used to scope page-level
 * refinements without changing layout or interaction behavior.
 */

/* Entry and chat panel: functional text must remain legible at card scale. */
.rq-panel-intro {
  color: rgba(223, 209, 186, 0.64);
  font-size: 12px;
}

/* Footer brand: use Ruiquan's official horizontal logo instead of the
   decorative text seal. The original span stays in the DOM as its text
   fallback, while the visible mark comes from the supplied brand asset. */
footer [code-path="src/components/Seal.tsx:4:5"] {
  width: 112px !important;
  height: 32px !important;
  flex: 0 0 112px;
  margin-top: 0 !important;
  border-radius: 0 !important;
  background: transparent url("../images/ruiquan-logo-light.svg") center / contain no-repeat !important;
  box-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  writing-mode: horizontal-tb !important;
  overflow: hidden;
}

@media (max-width: 480px) {
  footer [code-path="src/components/Seal.tsx:4:5"] {
    width: 104px !important;
    height: 28px !important;
    flex-basis: 104px;
  }
}

.rq-panel-field label {
  color: #b68b49;
  font-size: 13px;
}

.rq-panel-password-toggle,
.rq-panel-field p,
.rq-panel-consent-error {
  font-size: 12px;
}

.rq-panel-consent {
  color: rgba(223, 209, 186, 0.68);
  font-size: 12px;
}

.rq-card-chat {
  grid-template-rows: 44px 30px minmax(0, 1fr) auto auto 16px;
}

.rq-card-chat-toolbar,
.rq-card-sound {
  font-size: 12px;
}

.rq-card-chat-toolbar {
  color: rgba(223, 209, 186, 0.68);
}

.rq-card-sound {
  color: #c09249;
}

.rq-card-message-bubble {
  font-size: 13px;
  line-height: 1.72;
}

.rq-card-message-notice .rq-card-message-bubble {
  color: rgba(223, 209, 186, 0.68);
  font-size: 12px;
}

.rq-card-topics button {
  min-height: 34px;
  padding: 6px 11px;
  color: rgba(216, 181, 106, 0.92);
  font-size: 12px;
}

.rq-card-text-mode textarea,
.rq-card-voice-transcript p {
  font-size: 13px;
}

.rq-card-text-mode button,
.rq-card-voice-status,
.rq-card-voice-actions button {
  font-size: 12px;
}

.rq-card-voice-status {
  color: rgba(216, 181, 106, 0.86);
}

.rq-card-voice-actions button {
  height: 38px;
}

.rq-card-chat-hint {
  color: rgba(223, 209, 186, 0.58);
  font-size: 11px;
  line-height: 16px;
}

/* Match the larger tablet/desktop curator card with an equally legible type
   scale. These rules intentionally sit in the readability layer so they win
   over its compact base values without affecting phones. */
@media (min-width: 768px) {
  .rq-card-chat-toolbar,
  .rq-card-sound {
    font-size: 13px;
  }

  .rq-card-message-bubble {
    font-size: 15px;
    line-height: 1.72;
  }

  .rq-card-message-notice .rq-card-message-bubble {
    font-size: 13px;
  }

  .rq-card-topics button {
    min-height: 40px;
    padding: 7px 13px;
    font-size: 13px;
  }

  .rq-card-text-mode textarea,
  .rq-card-text-mode button,
  .rq-card-voice-transcript p {
    font-size: 14px;
  }

  .rq-card-chat-hint {
    font-size: 12px;
    line-height: 18px;
  }
}

/* Display typography: this site is viewed on exhibition screens as well as
   personal devices. Essential copy must remain readable from a few metres
   away; only genuinely decorative labels may use the compact tier. */
[code-path="src/v2/i18n/index.tsx:129:7"],
[code-path="src/v2/HeroV2.tsx:520:13"] {
  font-size: 14px !important;
}

/* Mobile language popover: pin both the trigger and the open menu to the
   visual viewport. This prevents narrow phones and embedded previews from
   clipping the trigger against a smaller app surface, while short screens
   can scroll the language list instead of pushing options off-screen. */
@media (max-width: 480px) {
  /* GSAP translates the Hero header while it is pinned. Once the curator card
     is visible, neutralize that off-screen containing block so the fixed
     navigation remains attached to the viewport instead of leaving the
     language control orphaned on its own. */
  html.rq-curator-card-visible [code-path="src/v2/HeroV2.tsx:356:5"] {
    transform: none !important;
  }

  [code-path="src/v2/HeroV2.tsx:503:7"] {
    position: fixed !important;
    inset: 0 0 auto !important;
    z-index: 130 !important;
    box-sizing: border-box;
    height: calc(60px + env(safe-area-inset-top));
    padding: env(safe-area-inset-top) 16px 0 !important;
    justify-content: initial !important;
    border-bottom: 1px solid rgba(201, 162, 75, 0.1);
    background: linear-gradient(180deg, rgba(13, 11, 8, 0.96), rgba(13, 11, 8, 0.82));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  [code-path="src/v2/HeroV2.tsx:508:9"] {
    position: absolute;
    top: calc(env(safe-area-inset-top) + 30px);
    left: 16px;
    min-width: 0;
    flex: 0 0 auto;
    transform: translateY(-50%);
  }

  [code-path="src/v2/HeroV2.tsx:509:11"] {
    width: auto;
    height: 22px !important;
  }

  [code-path="src/v2/HeroV2.tsx:512:9"] {
    position: absolute;
    top: calc(env(safe-area-inset-top) + 30px);
    left: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
  }

  [code-path="src/v2/HeroV2.tsx:520:13"] {
    font-size: 13px !important;
    letter-spacing: 0.18em !important;
  }

  [code-path="src/v2/AppV2.tsx:79:7"] {
    top: calc(env(safe-area-inset-top) + 12px) !important;
    right: max(16px, env(safe-area-inset-right)) !important;
    left: auto !important;
    z-index: 140 !important;
    max-width: calc(100vw - 24px);
  }

  [code-path="src/v2/i18n/index.tsx:107:5"],
  [code-path="src/v2/i18n/index.tsx:129:7"] {
    max-width: 100%;
  }

  [code-path="src/v2/i18n/index.tsx:129:7"] {
    box-sizing: border-box;
    width: auto !important;
    min-width: 114px !important;
    height: 36px !important;
    padding: 0 12px !important;
    border-radius: 0 !important;
    font-size: 14px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  [code-path="src/v2/i18n/index.tsx:109:9"] {
    position: fixed !important;
    top: max(56px, calc(env(safe-area-inset-top) + 48px)) !important;
    right: max(12px, env(safe-area-inset-right)) !important;
    left: auto !important;
    margin-top: 0 !important;
    width: min(168px, calc(100vw - 24px));
    min-width: 0 !important;
    max-height: calc(100svh - 68px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    box-sizing: border-box;
  }

  [code-path="src/v2/i18n/index.tsx:114:13"] {
    min-height: 40px;
    white-space: nowrap;
  }
}

@media (max-width: 360px) {
  [code-path="src/v2/HeroV2.tsx:503:7"] {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  [code-path="src/v2/HeroV2.tsx:508:9"] {
    left: 12px;
  }

  [code-path="src/v2/HeroV2.tsx:509:11"] {
    height: 20px !important;
  }

  [code-path="src/v2/HeroV2.tsx:512:9"] {
    left: 50%;
  }

  [code-path="src/v2/HeroV2.tsx:520:13"] {
    font-size: 12px !important;
    letter-spacing: 0.14em !important;
  }

  [code-path="src/v2/AppV2.tsx:79:7"] {
    right: max(12px, env(safe-area-inset-right)) !important;
  }

  [code-path="src/v2/i18n/index.tsx:129:7"] {
    min-width: 106px !important;
    padding-right: 10px !important;
    padding-left: 10px !important;
    gap: 5px !important;
    font-size: 13px !important;
  }
}

[code-path="src/v2/HeroV2.tsx:384:13"],
[code-path="src/v2/HeroV2.tsx:386:13"],
[code-path="src/v2/HeroV2.tsx:398:13"],
[code-path="src/v2/HeroV2.tsx:399:13"],
[code-path="src/v2/HeroV2.tsx:402:13"],
[code-path="src/v2/HeroV2.tsx:451:9"],
[code-path="src/v2/HeroV2.tsx:497:11"],
[code-path="src/v2/HeroV2.tsx:510:11"] {
  font-size: clamp(16px, 1.25vw, 18px) !important;
  line-height: 1.55 !important;
}

[code-path="src/v2/HeroV2.tsx:386:13"],
[code-path="src/v2/HeroV2.tsx:399:13"],
[code-path="src/v2/HeroV2.tsx:497:11"],
[code-path="src/v2/HeroV2.tsx:510:11"] {
  color: rgba(245, 240, 230, 0.74) !important;
}

[code-path="src/v2/HeroV2.tsx:402:13"] {
  color: rgba(216, 181, 106, 0.9) !important;
}

[code-path="src/v2/HeroV2.tsx:458:9"] {
  color: rgba(245, 240, 230, 0.9) !important;
  font-size: clamp(20px, 1.55vw, 22px) !important;
  line-height: 1.6 !important;
}

/* Brand story: long-form reading uses a stronger body tier than UI chrome. */
[code-path="src/v2/BrandV2.tsx:111:15"] {
  color: rgba(245, 240, 230, 0.94) !important;
  font-size: clamp(26px, 2vw, 32px) !important;
  line-height: 1.62 !important;
}

[code-path="src/v2/BrandV2.tsx:114:15"] {
  color: rgba(245, 240, 230, 0.76) !important;
  font-size: clamp(20px, 1.35vw, 22px) !important;
  font-weight: 400 !important;
  line-height: 1.85 !important;
}

[code-path="src/v2/BrandV2.tsx:120:17"] {
  color: rgba(245, 240, 230, 0.74) !important;
  font-size: 15px !important;
}

[code-path="src/v2/BrandV2.tsx:141:13"],
[code-path="src/v2/BrandV2.tsx:155:15"] {
  color: rgba(245, 240, 230, 0.7) !important;
  font-size: 14px !important;
}

[code-path="src/v2/BrandV2.tsx:177:19"] {
  color: rgba(245, 240, 230, 0.82) !important;
  font-size: 14px !important;
}

[code-path="src/v2/BrandV2.tsx:182:19"] {
  color: rgba(245, 240, 230, 0.72) !important;
  font-size: 14px !important;
}

[code-path="src/v2/BrandV2.tsx:220:11"] {
  color: rgba(245, 240, 230, 0.72) !important;
  font-size: 15px !important;
}

/* Digital museum: scanning hints, exhibit captions and curator metadata. */
[code-path="src/v2/DigitalV2.tsx:656:13"],
[code-path="src/v2/DigitalV2.tsx:660:13"],
[code-path="src/v2/DigitalV2.tsx:664:13"] {
  color: rgba(245, 240, 230, 0.72) !important;
  font-size: 15px !important;
}

[code-path="src/v2/DigitalV2.tsx:677:13"] {
  color: rgba(245, 240, 230, 0.7) !important;
  font-size: 14px !important;
}

[code-path="src/v2/DigitalV2.tsx:136:9"] {
  color: rgba(216, 181, 106, 0.82) !important;
  font-size: 14px !important;
}

[code-path="src/v2/DigitalV2.tsx:142:11"],
[code-path="src/v2/DigitalV2.tsx:145:7"] {
  color: rgba(245, 240, 230, 0.76) !important;
  font-size: 15px !important;
}

[code-path="src/v2/DigitalV2.tsx:716:19"] {
  color: rgba(216, 181, 106, 0.82) !important;
  font-size: 14px !important;
}

[code-path="src/v2/DigitalV2.tsx:765:13"] {
  color: rgba(245, 240, 230, 0.7) !important;
  font-size: 15px !important;
}

[code-path="src/v2/DigitalV2.tsx:782:23"] {
  display: none !important;
}

[code-path="src/v2/DigitalV2.tsx:794:21"] {
  color: rgba(245, 240, 230, 0.72) !important;
  font-size: 15px !important;
}

[code-path="src/v2/DigitalV2.tsx:831:23"] {
  min-height: 40px;
  color: rgba(245, 240, 230, 0.8) !important;
  font-size: 14px !important;
}

[code-path="src/v2/DigitalV2.tsx:843:13"] {
  color: rgba(245, 240, 230, 0.72) !important;
  font-size: 15px !important;
}

/* Reservation and footer: legal and contact information are functional text. */
[code-path="src/v2/ReserveV2.tsx:51:15"],
[code-path="src/v2/ReserveV2.tsx:71:17"] {
  color: rgba(245, 240, 230, 0.76) !important;
  font-size: 15px !important;
}

[code-path="src/v2/FooterV2.tsx:16:13"] {
  color: rgba(245, 240, 230, 0.7) !important;
  font-size: 15px !important;
}

[code-path^="src/v2/FooterV2.tsx:"] {
  --rq-footer-readable: rgba(245, 240, 230, 0.58);
}

[code-path="src/v2/FooterV2.tsx:21:11"],
[code-path="src/v2/FooterV2.tsx:22:11"],
[code-path="src/v2/FooterV2.tsx:30:13"],
[code-path="src/v2/FooterV2.tsx:31:13"],
[code-path="src/v2/FooterV2.tsx:32:13"],
[code-path="src/v2/FooterV2.tsx:33:13"] {
  color: var(--rq-footer-readable) !important;
  font-size: 15px !important;
}

[code-path="src/v2/FooterV2.tsx:38:9"],
[code-path="src/v2/FooterV2.tsx:39:9"] {
  color: rgba(245, 240, 230, 0.66) !important;
  font-size: 14px !important;
}

@media (max-width: 480px) {
  [code-path="src/v2/BrandV2.tsx:111:15"] {
    font-size: 20px !important;
  }

  [code-path="src/v2/BrandV2.tsx:114:15"] {
    font-size: 16px !important;
    line-height: 1.82 !important;
  }

  [code-path="src/v2/HeroV2.tsx:458:9"] {
    font-size: 17px !important;
  }

  [code-path="src/v2/HeroV2.tsx:384:13"],
  [code-path="src/v2/HeroV2.tsx:386:13"],
  [code-path="src/v2/HeroV2.tsx:398:13"],
  [code-path="src/v2/HeroV2.tsx:399:13"],
  [code-path="src/v2/HeroV2.tsx:402:13"],
  [code-path="src/v2/HeroV2.tsx:451:9"],
  [code-path="src/v2/HeroV2.tsx:497:11"],
  [code-path="src/v2/HeroV2.tsx:510:11"] {
    font-size: 14px !important;
  }

  [code-path="src/sections/Brand.tsx:103:17"],
  [code-path="src/v2/BrandV2.tsx:179:17"] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    column-gap: 20px;
    row-gap: 8px;
    min-width: 0;
  }

  [code-path="src/sections/Brand.tsx:104:19"],
  [code-path="src/v2/BrandV2.tsx:180:19"] {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  [code-path="src/sections/Brand.tsx:105:19"],
  [code-path="src/sections/Brand.tsx:106:19"],
  [code-path="src/v2/BrandV2.tsx:181:19"],
  [code-path="src/v2/BrandV2.tsx:182:19"] {
    grid-column: 2;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  [code-path="src/sections/Brand.tsx:105:19"],
  [code-path="src/v2/BrandV2.tsx:181:19"] {
    grid-row: 1;
    flex-shrink: 1;
  }

  [code-path="src/sections/Brand.tsx:106:19"],
  [code-path="src/v2/BrandV2.tsx:182:19"] {
    grid-row: 2;
  }

  [code-path="src/v2/DigitalV2.tsx:704:11"],
  [code-path="src/v2/DigitalV2.tsx:705:13"],
  [code-path="src/v2/DigitalV2.tsx:708:15"] {
    width: 100%;
    min-width: 0;
    max-width: 300px;
  }

  [code-path="src/v2/DigitalV2.tsx:716:19"] {
    right: 0 !important;
    left: 0 !important;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding-inline: 8px;
    overflow-wrap: anywhere;
  }

  [code-path="src/v2/DigitalV2.tsx:757:15"],
  [code-path="src/v2/DigitalV2.tsx:758:17"] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  [code-path="src/v2/DigitalV2.tsx:758:17"] {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 10px;
    padding-inline: 10px;
    white-space: normal;
  }

  [code-path="src/v2/DigitalV2.tsx:759:19"],
  [code-path="src/v2/DigitalV2.tsx:761:19"] {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .rq-card-chat {
    grid-template-rows: 48px 30px minmax(0, 1fr) auto auto 16px;
  }

  .rq-card-chat-toolbar,
  .rq-card-sound,
  .rq-panel-intro,
  .rq-panel-password-toggle,
  .rq-panel-consent {
    font-size: 13px;
  }

  .rq-card-topics button {
    min-height: 40px;
    padding-inline: 4px;
    font-size: 12px;
    letter-spacing: 0.03em;
  }

  .rq-card-chat-hint {
    font-size: 12px;
  }

  [code-path="src/v2/DigitalV2.tsx:716:19"] {
    font-size: 14px !important;
  }
}

@media (max-width: 400px) {
  .rq-card-topics button {
    font-size: 11px;
  }
}

/* Latin and Arabic scripts use horizontal type, so the brand title and story
   cannot share the narrow side-by-side track designed for vertical CJK type. */
html[data-lang="en"] [code-path="src/v2/BrandV2.tsx:101:11"],
html[data-lang="ar"] [code-path="src/v2/BrandV2.tsx:101:11"],
html[data-lang="es"] [code-path="src/v2/BrandV2.tsx:101:11"] {
  flex-direction: column;
  align-items: stretch;
  gap: clamp(2rem, 5vw, 4rem);
}

html[data-lang="en"] [code-path="src/v2/BrandV2.tsx:103:13"],
html[data-lang="ar"] [code-path="src/v2/BrandV2.tsx:103:13"],
html[data-lang="es"] [code-path="src/v2/BrandV2.tsx:103:13"] {
  box-sizing: border-box;
  width: 100%;
  height: auto;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.75rem 1.5rem;
}

html[data-lang="en"] [code-path="src/v2/BrandV2.tsx:104:15"],
html[data-lang="ar"] [code-path="src/v2/BrandV2.tsx:104:15"],
html[data-lang="es"] [code-path="src/v2/BrandV2.tsx:104:15"] {
  width: auto;
  height: auto;
  writing-mode: horizontal-tb !important;
  font-size: clamp(3rem, 5vw, 5rem) !important;
  line-height: 1.1 !important;
}

html[data-lang="en"] [code-path="src/v2/BrandV2.tsx:107:15"],
html[data-lang="ar"] [code-path="src/v2/BrandV2.tsx:107:15"],
html[data-lang="es"] [code-path="src/v2/BrandV2.tsx:107:15"] {
  margin-top: 0;
}

html[data-lang="en"] [code-path="src/v2/BrandV2.tsx:110:13"],
html[data-lang="ar"] [code-path="src/v2/BrandV2.tsx:110:13"],
html[data-lang="es"] [code-path="src/v2/BrandV2.tsx:110:13"] {
  box-sizing: border-box;
  width: 100%;
  max-width: 44rem;
  height: auto;
  padding-top: 0;
}