/* ============================================================================
   Reviewr Scan-Landing Engine — shared stylesheet
   ----------------------------------------------------------------------------
   ONE uniform skeleton for every template. The page order and item positions
   are fixed here; a theme only changes CSS variables, fonts and decoration.
   Every colour routes through a variable so a brand colour swap is one value.
   ========================================================================== */

:root {
  /* Filled in per-page by the engine from THEME + CONFIG. Defaults are neutral. */
  --primary: #E8543B;
  --on-accent: #FFF7EE;
  --bg: #F0EEE9;
  --ink: #1A1916;
  --ink-soft: #3A3631;
  --muted: #7A6A5E;
  --surface: #FFFFFF;
  --line: #E5DFD3;
  --font-display: "Inter Tight", system-ui, sans-serif;
  --font-body: "Inter Tight", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --r: 14px;                 /* base radius */
  --pad: 30px;               /* page padding */
  --maxw: 460px;             /* page column width */

  /* Derived accent tints (set by engine via color-mix on --primary). */
  --primary-soft: color-mix(in srgb, var(--primary) 12%, transparent);
  --primary-12: color-mix(in srgb, var(--primary) 12%, transparent);
  --primary-30: color-mix(in srgb, var(--primary) 30%, transparent);
  --primary-45: color-mix(in srgb, var(--primary) 45%, transparent);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;                /* lock the document so the URL bar never moves */
  overscroll-behavior: none;
  background: #d9d6cf;            /* surround behind the phone column on desktop */
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ── The page column ───────────────────────────────────────────────────── */
.rv-app {
  position: fixed;
  top: 0; bottom: 0; left: 0; right: 0;
  margin-inline: auto;
  width: 100%;
  max-width: var(--maxw);
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  overflow: hidden;                /* default: fit-to-viewport, no scroll */
  scrollbar-width: none;

  /* Derived accent tints — defined here so they follow a per-page --primary. */
  --primary-soft: color-mix(in srgb, var(--primary) 12%, transparent);
  --primary-12: color-mix(in srgb, var(--primary) 12%, transparent);
  --primary-30: color-mix(in srgb, var(--primary) 30%, transparent);
  --primary-45: color-mix(in srgb, var(--primary) 45%, transparent);
}

.rv-app.rv-scroll { overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }

/* The scaler holds all page content; on fit pages it is scaled down to fit the
   viewport exactly (no scroll). Decoration + loader stay on .rv-app behind it. */
.rv-scaler {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: var(--pad);
  transform-origin: top left;
}
.rv-scaler > * { flex-shrink: 0; }

/* Language toggle — small, fixed, always reachable */
.rv-lang {
  position: fixed;
  top: 10px; right: 10px;
  z-index: 60;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--ink) 22%, transparent);
  background: color-mix(in srgb, var(--bg) 78%, transparent);
  color: var(--ink);
  cursor: pointer;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.rv-decor {
  position: fixed;                 /* a window-frame fixed to the column, not the scroll content */
  inset: 0;
  width: 100%;
  max-width: var(--maxw);
  margin-inline: auto;
  pointer-events: none;
  z-index: 0;
}
.rv-app > .rv-decor, .rv-app > .rv-loader { /* positioned layers, kept off the scaler */ }

::selection { background: var(--primary); color: var(--on-accent); }

/* Pre-paint guard: animated blocks + the headline start hidden only while JS
   will animate them in (avoids a font-swap reflow being visible). */
.rv-app::-webkit-scrollbar { width: 0; height: 0; }
.rv-app[data-anim-pending] [data-anim],
.rv-app[data-anim-pending] [data-charreveal] { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .rv-app[data-anim-pending] [data-anim],
  .rv-app[data-anim-pending] [data-charreveal] { opacity: 1; }
}

/* ── Header ────────────────────────────────────────────────────────────── */
.rv-top {
  display: flex;
  align-items: center;
  gap: 12px;
}
.rv-logo {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border-radius: var(--logo-r, var(--r));
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.rv-logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.rv-logo svg { width: 100%; height: 100%; display: block; }
.rv-logo--tile {
  background: var(--primary);
  color: var(--on-accent);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 24px;
  letter-spacing: -0.04em;
}
.rv-logo--3d { position: relative; overflow: hidden; }
.rv-logo--3d canvas { position: absolute; inset: 0; }
.rv-name {
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.05;
  color: var(--name-color, var(--ink));
  white-space: nowrap;
}
.rv-top-meta {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  text-align: right;
  white-space: nowrap;
}

/* ── Hero ──────────────────────────────────────────────────────────────── */
.rv-hero { margin-top: 30px; }
.rv-kicker {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--kicker-color, var(--primary));
}
.rv-headline {
  margin: 12px 0 0;
  font-family: var(--font-display);
  font-size: var(--headline-size, 46px);
  font-weight: var(--headline-weight, 700);
  line-height: var(--headline-lh, 0.96);
  letter-spacing: var(--headline-ls, -0.035em);
  color: var(--headline-color, var(--ink));
  text-wrap: pretty;
}
/* Thai needs breathing room: drop tight Latin tracking and add leading so the
   tone marks / sara above & below the line don't collide. Applied whenever the
   page is showing ไทย (engine sets html[data-locale]). */
html[data-locale="th"] .rv-headline { letter-spacing: 0; line-height: calc(var(--headline-lh, 0.96) + 0.16); }
html[data-locale="th"] .rv-name,
html[data-locale="th"] .rv-pill,
html[data-locale="th"] .rv-row-label,
html[data-locale="th"] .rv-cell-label,
html[data-locale="th"] .rv-sheet__title { letter-spacing: 0; }
html[data-locale="th"] .rv-row-label,
html[data-locale="th"] .rv-cell-label { line-height: 1.25; }
.rv-sub {
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--muted);
  max-width: 32ch;
}

/* ── Perk card ─────────────────────────────────────────────────────────── */
.rv-perk {
  margin-top: 22px;
  padding: 14px 16px;
  border-radius: var(--card-r, var(--r));
  background: var(--perk-bg, var(--primary-12));
  border: var(--perk-border, 1px solid var(--primary-30));
}
.rv-perk-label {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
}
.rv-perk-code {
  margin-top: 5px;
  font-family: var(--code-font, var(--font-display));
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--perk-code-color, var(--primary));
}

/* ── Rating gate ───────────────────────────────────────────────────────── */
.rv-rate { margin-top: 24px; text-align: center; }
.rv-rate-prompt {
  font-family: var(--prompt-font, var(--font-mono));
  font-size: 12px;
  letter-spacing: var(--prompt-ls, 0.1em);
  text-transform: var(--prompt-tt, uppercase);
  color: var(--muted);
  margin: 0 0 12px;
}
.rv-stars { display: inline-flex; gap: 7px; }
.rv-star { width: 34px; height: 34px; cursor: pointer; display: block; }
.rv-star path { fill: none; stroke: var(--primary); stroke-width: 1.8; transition: fill .12s; }
.rv-star[data-on="1"] path { fill: var(--primary); }
.rv-rate-note {
  margin: 10px 0 0;
  font-size: 13px;
  color: var(--primary);
  min-height: 16px;
}

/* ── Primary CTA (review) ──────────────────────────────────────────────── */
.rv-cta {
  margin-top: 14px;
  height: 54px;
  width: 100%;
  border: var(--cta-border, none);
  border-radius: var(--cta-r, var(--r));
  background: var(--primary);
  color: var(--on-accent);
  font-family: var(--cta-font, var(--font-display));
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.01em;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  cursor: pointer;
  text-decoration: none;
  box-shadow: var(--cta-shadow, none);
}
.rv-cta[data-disabled="1"] { opacity: 0.35; pointer-events: none; }
.rv-cta .arw { font-size: 15px; }

/* ── Action rows ───────────────────────────────────────────────────────── */
.rv-actions { margin-top: 18px; display: flex; flex-direction: column; gap: 9px; }
.rv-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 14px 15px;
  border: 1px solid var(--row-border, var(--line));
  border-radius: var(--row-r, var(--r));
  background: var(--row-bg, color-mix(in srgb, var(--primary) 8%, transparent));
  color: var(--ink);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  font-family: inherit;
  box-shadow: var(--row-shadow, none);
  transition: transform .1s ease, background .15s ease, border-color .15s ease;
}
.rv-row:hover { background: var(--row-bg-hover, color-mix(in srgb, var(--primary) 15%, transparent)); }
.rv-row:active { transform: translateY(1px); }
.rv-row-label {
  font-family: var(--row-font, var(--font-display));
  font-size: 16px;
  font-weight: var(--row-weight, 600);
  letter-spacing: -0.01em;
  color: var(--ink);
  flex: 1;
}
.rv-row-sub {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--muted);
  text-align: right;
}
.rv-row .chev {
  flex-shrink: 0;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--chev-r, 50%);
  background: var(--chev-bg, var(--primary));
  color: var(--chev-ink, var(--on-accent));
  font-size: 12px;
  line-height: 1;
}

/* ── Grid action cards (theme.actions: "grid") ─────────────────────────── */
.rv-actions.rv-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--cell-gap, 9px);
}
.rv-cell {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  min-height: var(--cell-h, 76px);
  padding: var(--cell-pad, 13px 14px);
  border: var(--cell-border, var(--row-border, 1px solid var(--line)));
  border-radius: var(--cell-r, var(--row-r, var(--r)));
  background: var(--cell-bg, var(--row-bg, var(--surface)));
  color: var(--cell-ink, var(--ink));
  box-shadow: var(--cell-shadow, var(--row-shadow, none));
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  font-family: inherit;
  transition: transform .1s ease, filter .15s ease, box-shadow .12s ease;
}
.rv-cell:hover { filter: var(--cell-hover, brightness(0.97)); }
.rv-cell:active { transform: translateY(1px); }
.rv-cell-label {
  font-family: var(--cell-font, var(--row-font, var(--font-display)));
  font-weight: var(--cell-weight, var(--row-weight, 700));
  font-size: var(--cell-label-size, 15px);
  letter-spacing: -0.01em;
  line-height: 1.05;
  color: inherit;
}
.rv-cell-sub {
  font-family: var(--cell-sub-font, var(--font-mono));
  font-size: var(--cell-sub-size, 10px);
  letter-spacing: 0.04em;
  color: var(--cell-sub-color, var(--muted));
  opacity: var(--cell-sub-opacity, 1);
  line-height: 1.2;
}

/* ── LINE button ───────────────────────────────────────────────────────── */
.rv-line {
  margin-top: 12px;
  height: 46px;
  border-radius: var(--cta-r, var(--r));
  background: #06C755;
  color: #fff;
  font-family: var(--cta-font, var(--font-display));
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  border: var(--line-btn-border, none);
  box-shadow: var(--cta-shadow, none);
}

/* ── Social row ────────────────────────────────────────────────────────── */
.rv-social { margin-top: 14px; display: flex; gap: 10px; justify-content: center; }
.rv-social a {
  width: 44px;
  height: 44px;
  border-radius: var(--social-r, 10px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--social-ink, var(--ink));
  background: var(--social-bg, transparent);
  border: var(--social-border, 1px solid var(--line));
  text-decoration: none;
}
.rv-social svg { width: 20px; height: 20px; }

/* ── Footer ────────────────────────────────────────────────────────────── */
.rv-footer {
  margin-top: auto;
  padding-top: 22px;
  text-align: center;
  font-family: var(--font-body);
}
.rv-footer .credit {
  font-size: 11px;
  letter-spacing: 0.02em;
  color: var(--footer-color, var(--muted));
}
.rv-footer .credit b { font-weight: 700; color: var(--footer-color, var(--muted)); }
.rv-footer .credit .dot { color: var(--primary); }
.rv-footer .pdpa {
  margin-top: 4px;
  font-size: 10px;
  letter-spacing: 0.01em;
  color: var(--footer-color, var(--muted));
  opacity: 0.7;
}

/* ── Loader veil (opt-in per theme) ────────────────────────────────────── */
.rv-loader {
  position: absolute;
  inset: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 14px;
  background: var(--loader-bg, var(--bg));
}
.rv-loader__label {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
}
.rv-loader__bar {
  width: 120px;
  height: 3px;
  background: var(--primary);
  transform: scaleX(0);
  transform-origin: left center;
  animation: rv-bar-fill 0.5s ease-in-out forwards;
}
@keyframes rv-bar-fill { to { transform: scaleX(1); } }
.rv-loader.rv-loader--out {
  transform: translateY(-100%);
  transition: transform 0.45s cubic-bezier(0.7,0,0.3,1);
}
@media (prefers-reduced-motion: reduce) { .rv-loader { display: none; } }

/* ── Bottom-sheet dialog (uniform; restyled by theme vars) ─────────────── */
dialog.rv-sheet {
  position: fixed;
  top: auto;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0;
  margin-inline: auto;
  padding: 0;
  width: 100%;
  max-width: var(--maxw);
  border: none;
  background: transparent;
  color: var(--sheet-ink, var(--ink));
  font-family: var(--font-body);
  overflow: visible;
}
.rv-sheet__panel {
  background: var(--sheet-bg, var(--surface));
  border-top: var(--sheet-border, none);
  border-radius: var(--sheet-r, 18px) var(--sheet-r, 18px) 0 0;
  box-shadow: 0 -8px 40px rgba(0,0,0,0.28);
  overflow: hidden;
}
dialog.rv-sheet[open] { display: block; max-height: 86vh; max-height: 86dvh; overflow-y: auto; }
#app { overflow-x: clip; }
dialog.rv-sheet::backdrop { background: rgba(0,0,0,0.55); }
dialog.rv-gallery { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: none; background: transparent; overflow: visible; }
dialog.rv-gallery[open] { display: flex; align-items: center; justify-content: center; }
dialog.rv-gallery::backdrop { background: rgba(0,0,0,0.9); }
.rv-gallery__card { position: relative; width: calc(100% - 36px); max-width: var(--maxw); height: 76%; display: flex; flex-direction: column; }
.rv-gallery__close { position: absolute; top: -44px; right: 0; width: 36px; height: 36px; border-radius: 50%; border: none; cursor: pointer; background: rgba(255,255,255,0.18); color: #fff; font-size: 16px; line-height: 1; display: flex; align-items: center; justify-content: center; }
.rv-gallery__track { flex: 1; min-height: 0; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; border-radius: 20px; -webkit-overflow-scrolling: touch; }
.rv-gallery__track::-webkit-scrollbar { display: none; }
.rv-gallery__slide { flex: 0 0 100%; scroll-snap-align: center; height: 100%; }
.rv-gallery__slide img { width: 100%; height: 100%; object-fit: contain; border-radius: 20px; display: block; background: rgba(0,0,0,0.35); }
.rv-gallery__dots { display: flex; gap: 6px; justify-content: center; margin-top: 16px; }
.rv-gallery__dots span { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,0.4); transition: background .2s, transform .2s; }
.rv-gallery__dots span.on { background: #fff; transform: scale(1.3); }
.rv-sheet__handle {
  width: 40px; height: 4px; border-radius: 2px;
  background: var(--sheet-muted, var(--muted)); opacity: 0.35;
  margin: 12px auto 0;
}
.rv-sheet__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px 8px;
}
.rv-sheet__title {
  margin: 0;
  font-family: var(--sheet-head-font, var(--font-display));
  font-size: 18px; font-weight: 700; line-height: 1.2;
  color: var(--sheet-ink, var(--ink));
}
.rv-sheet__close {
  background: none; border: none; cursor: pointer;
  color: var(--sheet-muted, var(--muted)); font-size: 20px; line-height: 1;
  padding: 4px; display: flex;
}
.rv-sheet__body { padding: 4px 18px 26px; }

/* Menu sheet */
.rv-menu-cat {
  margin: 14px 0 6px;
  font-family: var(--sheet-head-font, var(--font-display));
  font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--primary);
}
.rv-menu-item {
  display: flex; gap: 12px; padding: 10px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--sheet-muted, var(--muted)) 22%, transparent);
}
.rv-menu-item img { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.rv-menu-item .top { display: flex; justify-content: space-between; gap: 8px; }
.rv-menu-item .nm { font-weight: 600; font-size: 15px; color: var(--sheet-ink, var(--ink)); }
.rv-menu-item .pr { font-weight: 600; font-size: 15px; color: var(--primary); white-space: nowrap; }
.rv-menu-item .ds { margin: 2px 0 0; font-size: 13px; color: var(--sheet-muted, var(--muted)); line-height: 1.4; }

/* Hours sheet */
.rv-hours-status { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.rv-hours-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.rv-hours-status .lbl { font-size: 15px; font-weight: 600; }
.rv-hours-status .sub { font-size: 13px; color: var(--sheet-muted, var(--muted)); }
.rv-hours-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 6px; border-radius: 4px; font-size: 14px;
}
.rv-hours-row + .rv-hours-row { border-top: 1px solid color-mix(in srgb, var(--sheet-muted, var(--muted)) 18%, transparent); }
.rv-hours-row[data-today="1"] { background: var(--primary-12); font-weight: 700; }
.rv-hours-row .day { color: var(--sheet-ink, var(--ink)); }
.rv-hours-row[data-today="1"] .day, .rv-hours-row[data-today="1"] .val { color: var(--primary); }
.rv-hours-row .val.closed { color: var(--sheet-muted, var(--muted)); }

/* Location sheet */
.rv-loc-addr { margin: 0 0 18px; font-size: 16px; line-height: 1.5; color: var(--sheet-ink, var(--ink)); }
.rv-loc-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 16px; border-radius: var(--sheet-r, 10px);
  background: var(--primary); color: var(--on-accent);
  font-weight: 700; font-size: 15px; text-decoration: none;
  font-family: var(--sheet-head-font, var(--font-display));
}
.rv-loc-btn svg { width: 18px; height: 18px; }

/* ── Centered layout variant (link-in-bio style, per reference) ────────── */
.rv-center { text-align: center; }
.rv-center .rv-top { flex-direction: column; gap: 12px; }
.rv-center .rv-logo { width: 72px; height: 72px; margin: 0 auto; }
.rv-center .rv-name { white-space: normal; font-size: 24px; }
.rv-center .rv-hero { margin-top: 16px; }
.rv-center .rv-sub { margin-left: auto; margin-right: auto; }
.rv-center .rv-rate { margin-top: 22px; }
.rv-center .rv-cta { justify-content: center; gap: 10px; }
.rv-center .rv-social { margin-top: 24px; }

/* ── Pill action buttons (centered mode, or themes that opt in) ────────── */
.rv-actions.rv-pills { gap: 10px; margin-top: 20px; }
.rv-pill {
  width: 100%;
  min-height: 56px;
  padding: 12px 20px;
  border-radius: var(--pill-r, 999px);
  background: var(--pill-bg, var(--primary));
  color: var(--pill-ink, var(--on-accent));
  border: var(--pill-border, none);
  font-family: var(--cta-font, var(--font-display));
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.01em;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
  box-shadow: var(--pill-shadow, none);
}

/* ── Code pop-up body ──────────────────────────────────────────────────── */
.rv-code-sheet { text-align: center; padding: 8px 0 6px; }
.rv-code-sheet .rv-perk-label { color: var(--sheet-muted, var(--muted)); }
.rv-code-big {
  margin-top: 10px;
  font-family: var(--code-font, var(--sheet-head-font, var(--font-display)));
  font-size: 40px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--primary);
}
.rv-code-note { margin: 14px 0 0; font-size: 14px; color: var(--sheet-muted, var(--muted)); line-height: 1.5; }

/* ── Coloured header band with optional 3D scene (special pages) ───────── */
.rv-band {
  position: relative;
  margin: calc(-1 * var(--pad)) calc(-1 * var(--pad)) 24px;
  padding: 26px var(--pad) 28px;
  min-height: 330px;
  background: var(--band-bg, var(--primary-12));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border-bottom: var(--band-border, none);
}
.rv-band__scene { position: absolute; inset: 0; z-index: 0; }
.rv-band__scene canvas { display: block; width: 100% !important; height: 100% !important; }
.rv-band__id { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.rv-band__id .rv-logo { width: 72px; height: 72px; }
.rv-band .rv-name { white-space: nowrap; color: var(--band-ink, var(--ink)); font-size: 24px; }
.rv-band__tag { font-size: 14px; line-height: 1.4; color: var(--band-ink, var(--ink)); opacity: 0.82; max-width: 30ch; }

/* tagline shown directly under the name (bottom-band / link-in-bio identity) */
.rv-id-tag { margin-top: 8px; }

/* Full-bleed bottom scene strip (e.g. dogs walking along the bottom) */
.rv-bottom { margin-top: auto; }                 /* pin the footer + strip to the bottom */
.rv-bottom .rv-footer { margin-top: 18px; }
.rv-footscene {
  position: relative;
  margin: 14px calc(-1 * var(--pad)) calc(-1 * var(--pad));
  height: var(--footscene-h, 230px);
  overflow: hidden;
  background: var(--footscene-bg, var(--primary-12));
  border-top: var(--footscene-border, none);
}
.rv-footscene canvas { display: block; width: 100% !important; height: 100% !important; }