/* FineNights experience layer. All rules are opt-in to the shared page shell.
   Existing page hooks, positioning and business states remain authoritative. */
.fn-premium {
  --fn-bg: var(--fn-ui-bg);
  --fn-bg-elevated: var(--fn-ui-surface);
  --fn-bg-card: var(--fn-ui-surface);
  --fn-card: var(--fn-ui-surface);
  --fn-surface: var(--fn-ui-surface);
  --fn-surface-2: var(--fn-ui-surface-raised);
  --fn-surface-3: var(--fn-ui-surface-hover);
  --fn-border: var(--fn-ui-line);
  --fn-border-soft: rgba(185, 202, 228, 0.08);
  --fn-border-strong: var(--fn-ui-line-strong);
  --fn-text: var(--fn-ui-ink);
  --fn-text-secondary: var(--fn-ui-ink-secondary);
  --fn-text-muted: var(--fn-ui-ink-muted);
  --fn-on-accent: var(--fn-ui-on-action);
  --fn-radius: var(--fn-ui-radius-card);
  --fn-radius-sm: 12px;
  --fn-radius-lg: 24px;
  --fn-radius-control: var(--fn-ui-radius-control);
  --fn-radius-pill: var(--fn-ui-radius-control);
  --fn-header-h: 68px;
  --fn-max: var(--fn-ui-page-width);
  /* Bridge legacy account/regional tokens to the same theme. */
  --bg: var(--fn-bg);
  --bg-elevated: var(--fn-surface);
  --bg-soft: var(--fn-surface-2);
  --text: var(--fn-text);
  --text-muted: var(--fn-text-secondary);
  --border: var(--fn-border);
  --radius: var(--fn-radius);
  color-scheme: dark;
  margin: 0;
  background: var(--fn-bg);
  color: var(--fn-text);
  font-family: var(--fn-font);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
.fn-premium *, .fn-premium *::before, .fn-premium *::after { box-sizing: border-box; }
.fn-premium [hidden] { display: none !important; }
.fn-premium :is(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--fn-ui-focus);
  outline-offset: 3px;
  box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.14);
}
.fn-premium :is(h1, h2, h3) { color: var(--fn-text); text-wrap: balance; }
.fn-premium h1 { letter-spacing: -0.04em; line-height: 1.12; }
.fn-premium h2 { letter-spacing: -0.025em; line-height: 1.25; }
.fn-premium :is(p, li, td, dd) { overflow-wrap: anywhere; }
.fn-premium :is(button, input, select, textarea) { font: inherit; }
.fn-premium button { touch-action: manipulation; }
.fn-premium :is(input, select, textarea):disabled, .fn-premium button:disabled { cursor: not-allowed; opacity: .5; }
.fn-premium :is(.fn-main, .account-main, .public-main, .regional-main, .fn-vc-main) { min-width: 0; }
.fn-premium :is(.fn-btn, .account-link-btn, .account-submit, .fn-vc-btn, .fn-night-btn) {
  border-radius: var(--fn-radius-control);
  min-height: 44px;
  font-weight: 650;
  transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
.fn-premium :is(.fn-btn-primary, .fn-btn-join:not(.is-in):not(.is-pending):not(.is-muted), .account-submit, .account-link-btn-primary, .fn-night-btn.is-primary) {
  color: var(--fn-on-accent);
  background: var(--fn-orange);
  border-color: transparent;
  box-shadow: 0 4px 16px rgba(255, 138, 0, .1);
}
.fn-premium :is(.fn-btn-primary, .account-submit, .account-link-btn-primary):hover:not(:disabled) {
  background: #ffa027;
  color: var(--fn-on-accent);
}
.fn-premium :is(.fn-btn-outline, .fn-btn-ghost, .account-link-btn:not(.account-link-btn-primary)) {
  color: var(--fn-text);
  border: 1px solid var(--fn-border-strong);
  background: var(--fn-surface-2);
}
.fn-premium :is(.fn-btn-outline, .fn-btn-ghost, .account-link-btn):hover:not(:disabled) { border-color: rgba(255, 138, 0, .45); }
.fn-premium :is(.account-field input, .account-field select, .account-field textarea, .account-form > input, .fn-wallet input, .regional-filter select, .regional-filter input) {
  min-height: 46px;
  max-width: 100%;
  border: 1px solid var(--fn-border-strong);
  border-radius: var(--fn-radius-control);
  padding: 10px 12px;
  color: var(--fn-text);
  background: var(--fn-bg);
}
.fn-premium :is(input[type=checkbox], input[type=radio], input[type=range]) { accent-color: var(--fn-orange); }
.fn-premium :is(.account-label, .fn-vc-field-label) { color: var(--fn-text-secondary); font-size: 13px; font-weight: 650; }
.fn-premium :is(.account-errors, .account-field-error, .account-error) { color: #ffaaa6; }
.fn-premium .account-errors { padding: 14px; border: 1px solid rgba(255, 105, 105, .25); border-radius: 12px; background: rgba(255, 105, 105, .06); }
.fn-premium :is(.account-message, .fn-chats-flash-item, .fn-notifications-flash-item) { padding: 14px 18px; border: 1px solid var(--fn-border); border-radius: 12px; background: var(--fn-surface-2); }
.fn-premium .fn-skip-link { position: fixed; top: -100px; left: 16px; z-index: 100010; padding: 12px 18px; color: var(--fn-on-accent); background: var(--fn-orange); border-radius: 10px; text-decoration: none; }
.fn-premium .fn-skip-link:focus { top: 12px; }

/* Shared shell: original logo, compact utility controls, a clear current page. */
.fn-premium :is(.fn-header, .account-topbar, .public-topbar, .regional-topbar) {
  min-height: var(--fn-header-h);
  background: rgba(8, 11, 18, .95);
  border-bottom: 1px solid var(--fn-border);
  backdrop-filter: blur(18px);
}
.fn-premium .fn-header-inner { max-width: 1440px; margin: auto; min-height: var(--fn-header-h); padding-inline: var(--fn-ui-gutter); gap: 18px; }
.fn-premium :is(.fn-header-left, .fn-header-right, .account-topbar-actions) { min-width: 0; gap: 10px; }
.fn-premium :is(.fn-brand-logo, .account-brand-logo, .public-brand-logo) { object-fit: contain; width: 145px; height: auto; max-width: 100%; }
.fn-premium .fn-header-link { min-height: 42px; display: inline-flex; align-items: center; border-radius: 10px; padding: 0 13px; color: var(--fn-text-secondary); font-size: 13px; font-weight: 600; }
.fn-premium .fn-header-link.is-active { color: var(--fn-text); background: var(--fn-surface-2); }
.fn-premium .fn-city-btn { background: transparent; border: 1px solid var(--fn-border); border-radius: 9px; padding: 7px 10px; min-width: 0; }
.fn-premium .fn-icon-btn { border-radius: 10px; background: var(--fn-surface); }
.fn-premium .account-topbar { display: flex; position: sticky; top: 0; z-index: 80; width: 100%; padding: 8px var(--fn-ui-gutter); margin: 0; }
.fn-premium .account-shell { width: 100%; max-width: none; padding: 0; }
.fn-premium .account-main { width: 100%; max-width: 1200px; margin: 0 auto; padding: 28px var(--fn-ui-gutter) calc(88px + var(--fn-safe-bottom)); }
.fn-premium .fn-bottom-nav { border: 1px solid var(--fn-border-strong); border-bottom: 0; background: rgba(16, 21, 31, .97); backdrop-filter: blur(20px); box-shadow: 0 -8px 40px rgba(0, 0, 0, .2); }
.fn-premium .fn-bottom-nav-item { color: var(--fn-text-muted); min-height: 52px; border-radius: 12px; }
.fn-premium .fn-bottom-nav-item.is-active { color: var(--fn-orange); background: var(--fn-orange-soft); }
.fn-premium .fn-footer { border-top: 1px solid var(--fn-border); color: var(--fn-text-muted); padding: 24px var(--fn-ui-gutter); }

/* Reusable headers and states; no interaction logic lives in these components. */
.fn-premium .fn-page-head { margin: 0 0 28px; }
.fn-premium .fn-page-eyebrow, .fn-premium .fn-catalog-kicker { color: var(--fn-orange); font-size: 11px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 10px; }
.fn-premium .fn-page-title { margin: 0; font-size: var(--fn-ui-title-size); font-weight: 750; }
.fn-premium .fn-page-description { margin: 14px 0 0; max-width: 62ch; color: var(--fn-text-secondary); line-height: 1.65; }
.fn-premium :is(.fn-ui-empty, .fn-empty, .fn-chats-empty, .fn-notify-empty, .fn-home-empty) { display: grid; place-items: center; gap: 12px; padding: 40px 22px; border: 1px dashed var(--fn-border-strong); border-radius: 18px; background: var(--fn-surface); text-align: center; }
.fn-premium .fn-ui-empty-mark { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--fn-orange-soft); color: var(--fn-orange); }
.fn-premium .fn-ui-empty-mark .fn-icon { width: 24px; height: 24px; }
.fn-premium .fn-ui-empty-title { font-weight: 700; font-size: 17px; margin: 0; }
.fn-premium .fn-ui-empty-description { color: var(--fn-text-secondary); max-width: 42ch; margin: 0; font-size: 14px; }
.fn-premium :is(.fn-skeleton, .fn-browse-skeleton) { border-radius: 14px; }

/* Public discovery: an editorial hero and legible cards, using existing data. */
.fn-premium .fn-home { max-width: var(--fn-ui-page-width); margin: auto; padding: 26px var(--fn-ui-gutter) 40px; }
.fn-premium .fn-home-hero { position: relative; display: grid; gap: 24px; padding: clamp(26px, 5vw, 64px); margin: 0 0 36px; border: 1px solid var(--fn-border-strong); border-radius: 24px; background: radial-gradient(ellipse at 100% 0, rgba(139, 92, 246, .15), transparent 58%), radial-gradient(ellipse at 0 100%, rgba(255, 138, 0, .08), transparent 60%), var(--fn-surface); }
.fn-premium .fn-home-hero-title { margin: 0; font-size: clamp(36px, 5vw, 62px); line-height: 1.03; font-weight: 780; letter-spacing: -.055em; }
.fn-premium .fn-home-hero-title span { display: block; }
.fn-premium .fn-home-hero-accent { color: var(--fn-orange); }
.fn-premium .fn-home-hero-lead { display: block; max-width: 54ch; margin: 18px 0 0; color: var(--fn-text-secondary); font-size: 15px; line-height: 1.65; }
.fn-premium .fn-home-hero-actions { flex-wrap: wrap; gap: 12px; justify-content: flex-start; }
.fn-premium .fn-home-hero-actions .fn-btn { min-height: 46px; padding: 0 20px; font-size: 14px; }
.fn-premium .fn-home-section { margin-bottom: 36px; }
.fn-premium :is(.fn-home-section-head h2, .fn-catalog-section-title) { font-size: var(--fn-ui-section-size); letter-spacing: -.03em; }
.fn-premium .fn-home-section-lead { color: var(--fn-text-muted); line-height: 1.5; }
.fn-premium .fn-home-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.fn-premium .fn-home-places-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fn-premium :is(.fn-sn-card, .fn-tour-card, .fn-event-card, .fn-tonight-card, .fn-browse-card, .fn-place-card) { min-width: 0; border: 1px solid var(--fn-border); border-radius: 18px; background: var(--fn-surface); box-shadow: var(--fn-ui-shadow); }
.fn-premium :is(.fn-sn-card, .fn-tour-card, .fn-event-card, .fn-browse-card):hover { border-color: rgba(255, 138, 0, .3); }
.fn-premium .fn-home-tonight-grid > :is(.fn-sn-card, .fn-tour-card, .fn-event-card, .fn-tonight-card) { width: 100%; min-width: 0; height: auto; min-height: 200px; padding: 18px; }
.fn-premium .fn-home-places-grid > * { min-width: 0; }
.fn-premium .fn-catalog { width: 100%; max-width: var(--fn-ui-page-width); padding: 32px var(--fn-ui-gutter) calc(88px + var(--fn-safe-bottom)); }
.fn-premium :is(.fn-catalog-title, .fn-nights-create-title, .fn-tours-create-title) { font-size: var(--fn-ui-title-size); font-weight: 750; letter-spacing: -.04em; }
.fn-premium :is(.fn-catalog-lead, .fn-nights-create-lead, .fn-tours-create-lead) { color: var(--fn-text-secondary); font-size: 15px; line-height: 1.65; }
.fn-premium :is(.fn-catalog-search, .fn-search, .fn-nights-search) { border-radius: 12px; min-height: 46px; border-color: var(--fn-border-strong); background: var(--fn-surface); }
.fn-premium :is(.fn-nights-tab, .fn-nights-time-chip, .fn-home-date-chip, .fn-home-cat, .fn-catalog-day-chip) { border-radius: 9px; min-height: 40px; }
.fn-premium :is(.fn-nights-tab.is-active, .fn-home-date-chip.is-active) { background: var(--fn-orange); color: var(--fn-on-accent); }
.fn-premium :is(.fn-nights-list, .fn-catalog-list) { gap: 18px; }
.fn-premium :is(.fn-night-hero, .fn-social-detail-card, .fn-vd, .fn-page-card) { border-radius: 20px; }
.fn-premium .fn-vd { min-width: 0; max-width: 1120px; }
.fn-premium :is(.fn-night-section, .fn-detail-section, .fn-vd-section) { border-color: var(--fn-border); }
.fn-premium :is(.fn-nights-create, .fn-tours-create) { width: 100%; max-width: 900px; margin: auto; }
.fn-premium :is(.fn-nights-create-card, .fn-create-wizard-card, .fn-create-step, .fn-tours-create-card) { border-radius: 18px; border-color: var(--fn-border); background: var(--fn-surface); }

/* Map controls keep existing map/list and provider logic. */
.fn-premium.fn-explore-page .app { background: var(--fn-bg); }
.fn-premium :is(.fn-explore-topbar, .topbar, .fn-explore-sidebar, .venue-info-panel) { border-color: var(--fn-border); }
.fn-premium :is(.fn-explore-sidebar, .venue-info-panel, .map-controls) { background-color: var(--fn-surface); }
.fn-premium :is(.search-input, .topbar-search, .filter-chip) { border-color: var(--fn-border-strong); border-radius: 10px; }
.fn-premium .venue-info-panel { border-radius: 18px; box-shadow: var(--fn-ui-shadow); }
.fn-premium .region-picker-panel { background: var(--fn-surface); border: 1px solid var(--fn-border-strong); border-radius: 20px; color: var(--fn-text); }
.fn-premium .region-picker-backdrop { background: rgba(2, 5, 12, .72); backdrop-filter: blur(4px); }

/* Account/authentication, public profiles, QR, ratings and conversations. */
.fn-premium .account-card { width: min(100%, 480px); margin: clamp(16px, 5vw, 64px) auto; padding: clamp(24px, 4vw, 38px); border: 1px solid var(--fn-border-strong); border-radius: 24px; background: var(--fn-surface); box-shadow: var(--fn-ui-shadow); }
.fn-premium .account-title { font-size: clamp(27px, 4vw, 36px); line-height: 1.15; letter-spacing: -.035em; }
.fn-premium .account-lead { color: var(--fn-text-secondary); font-size: 14px; line-height: 1.65; }
.fn-premium .account-form { gap: 20px; }
.fn-premium .account-field { gap: 8px; }
.fn-premium .account-form .account-submit { width: 100%; margin-top: 6px; }
.fn-premium :is(.account-switch, .account-help) { color: var(--fn-text-muted); font-size: 13px; }
.fn-premium .account-switch a { color: var(--fn-text); text-underline-offset: 4px; }
.fn-premium .fn-ig-account { --fn-ig-surface: var(--fn-surface); --fn-ig-surface-border: var(--fn-border); --fn-ig-bg: var(--fn-bg); }
.fn-premium :is(.fn-acct-profile, .fn-ig-settings-card, .fn-ig-card, .account-section-card) { border-radius: 18px; border-color: var(--fn-border); background-color: var(--fn-surface); }
.fn-premium :is(.fn-ig-menu-row, .account-user-panel-link) { min-height: 52px; border-radius: 12px; }
.fn-premium .public-shell { width: 100%; max-width: none; }
.fn-premium .public-main { width: 100%; max-width: 1000px; margin: auto; padding: 28px var(--fn-ui-gutter) 48px; }
.fn-premium .public-topbar { display: flex; align-items: center; justify-content: space-between; padding: 10px var(--fn-ui-gutter); }
.fn-premium :is(.user-fn-profile, .public-user-profile, .rate-user-card, .rate-visit-card) { min-width: 0; width: 100%; max-width: 720px; margin-inline: auto; border-radius: 20px; background-color: var(--fn-surface); border-color: var(--fn-border); }
.fn-premium :is(.public-share-section, .public-card, .fn-account-qr-card) { min-width: 0; max-width: 100%; border-radius: 18px; }
.fn-premium :is(.public-qr, .share-qr, .qr-share-panel) img { max-width: 100%; height: auto; }
.fn-premium :is(.fn-chat-window, .fn-chat-panel, .fn-chats-row, .fn-chat-conversation) { border-color: var(--fn-border); background-color: var(--fn-surface); border-radius: 18px; }
.fn-premium :is(.fn-chat-message, .fn-chat-bubble) { border-radius: 16px; }
.fn-premium :is(.fn-chat-compose, .fn-chat-composer) { background: var(--fn-bg); border-color: var(--fn-border); }
.fn-premium :is(.fn-chat-compose textarea, .fn-chat-composer textarea) { color: var(--fn-text); background: var(--fn-surface); border-radius: 12px; }

/* Wallet/treasury: value hierarchy without changing balances or payment state. */
.fn-premium .fn-wallet { width: 100%; max-width: var(--fn-ui-page-width); min-width: 0; margin: 0 auto 32px; padding: 0; }
.fn-premium .fn-wallet > header { margin-bottom: 28px; }
.fn-premium .fn-wallet h1 { font-size: var(--fn-ui-title-size); }
.fn-premium .fn-wallet h2 { font-size: var(--fn-ui-section-size); }
.fn-premium .fn-wallet-panel { width: 100%; min-width: 0; padding: clamp(18px, 2.4vw, 28px); border-radius: 20px; background: var(--fn-surface); border-color: var(--fn-border); }
.fn-premium .fn-wallet-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
.fn-premium .fn-wallet-balances { grid-template-columns: minmax(0, 1fr); gap: 14px; margin-block: 24px; }
.fn-premium .fn-wallet-balances article { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; padding: 22px; border-radius: 18px; border-color: var(--fn-border-strong); background: linear-gradient(125deg, rgba(139, 92, 246, .07), transparent), var(--fn-surface); }
.fn-premium .fn-wallet-balances article > span { font-size: 13px; color: var(--fn-text-secondary); }
.fn-premium .fn-wallet-balances article > strong { grid-column: 2; grid-row: 1 / 3; align-self: center; margin: 0; font-size: clamp(27px, 4vw, 38px); letter-spacing: -.04em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fn-premium .fn-wallet-balances article > strong small { display: block; text-align: right; font-size: 11px; letter-spacing: .08em; color: var(--fn-ui-focus); }
.fn-premium .fn-wallet-balances article > p { margin: 0; font-size: 12px; color: var(--fn-text-muted); }
.fn-premium .fn-wallet-balances article > a { grid-column: 1 / -1; margin-top: 12px; }
.fn-premium .fn-wallet-balances h2 { grid-column: 1 / -1; }
.fn-premium .fn-wallet-balances dl { grid-column: 1 / -1; }
.fn-premium .fn-wallet-actions { gap: 8px; }
.fn-premium .fn-wallet-actions .account-link-btn { font-size: 12px; padding: 8px 12px; }
.fn-premium .fn-wallet-table { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid var(--fn-border); border-radius: 12px; }
.fn-premium .fn-wallet table { min-width: 560px; font-size: 13px; }
.fn-premium .fn-wallet th { background: var(--fn-surface-2); color: var(--fn-text-muted); font-size: 11px; letter-spacing: .045em; text-transform: uppercase; }
.fn-premium .fn-wallet td, .fn-premium .fn-wallet th { padding: 14px; border-color: var(--fn-border); }
.fn-premium .fn-wallet details { font-size: 12px; }
.fn-premium .fn-wallet input { min-width: 0; width: 110px; margin: 8px 0; }
.fn-premium .fn-wallet-service { gap: 14px; }
.fn-premium .fn-wallet a { color: var(--fn-ui-focus); text-underline-offset: 4px; }
.fn-premium .fn-wallet a.account-link-btn-primary { color: var(--fn-on-accent); }

/* Management and specialized roles keep all original permission-gated links. */
.fn-premium .fn-vc { min-width: 0; width: 100%; background: var(--fn-bg); gap: 0; }
.fn-premium .fn-vc > * { min-width: 0; }
.fn-premium .fn-vc-sidebar { min-width: 0; max-width: 100%; background: var(--fn-surface); border-color: var(--fn-border); }
.fn-premium .fn-vc-main { min-width: 0; padding: 26px; }
.fn-premium .fn-vc-page-head { flex-wrap: wrap; gap: 18px; margin-bottom: 26px; }
.fn-premium .fn-vc-title { font-size: var(--fn-ui-title-size); }
.fn-premium .fn-vc-lead { color: var(--fn-text-secondary); line-height: 1.6; }
.fn-premium :is(.fn-vc-panel, .fn-vc-kpi, .fn-vc-menu-section, .fn-vc-menu-item) { min-width: 0; border-color: var(--fn-border); border-radius: 16px; background: var(--fn-surface); }
.fn-premium .fn-vc-nav-item.is-active { color: var(--fn-orange); background: var(--fn-orange-soft); border-radius: 10px; }
.fn-premium .fn-vc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.fn-premium :is(.fn-vc-item-row, .fn-vc-menu-item, .fn-vc-menu-list) { max-width: 100%; min-width: 0; }
.fn-premium :is(dialog, .fn-vc-dialog, .fn-vc-share-dialog) { width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); padding: 24px; color: var(--fn-text); background: var(--fn-surface); border: 1px solid var(--fn-border-strong); border-radius: 22px; box-shadow: 0 32px 100px rgba(0, 0, 0, .5); }
.fn-premium dialog::backdrop { background: rgba(2, 5, 12, .72); backdrop-filter: blur(4px); }
.fn-premium .regional-shell { max-width: 1440px; padding: 0 var(--fn-ui-gutter) 40px; }
.fn-premium .regional-topbar { padding: 14px 0; gap: 18px; margin-bottom: 26px; }
.fn-premium .regional-topbar-meta { min-width: 0; gap: 10px; }
.fn-premium .regional-topbar-user { overflow-wrap: anywhere; }
.fn-premium .regional-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
.fn-premium .regional-sidebar { border-radius: 18px; border-color: var(--fn-border); background: var(--fn-surface); padding: 18px; }
.fn-premium .regional-nav { display: flex; flex-wrap: wrap; gap: 6px; }
.fn-premium .regional-nav-link { flex: 1 1 auto; min-height: 44px; padding: 10px 12px; font-size: 13px; border-radius: 10px; }
.fn-premium .regional-nav-link.is-active { background: var(--fn-orange-soft); border-color: transparent; color: var(--fn-orange); }
.fn-premium :is(.regional-panel, .regional-stat-card) { min-width: 0; background: var(--fn-surface); border: 1px solid var(--fn-border); border-radius: 18px; }
.fn-premium .regional-panel { padding: 24px; }
.fn-premium .regional-panel-head { flex-wrap: wrap; gap: 12px; }
.fn-premium .regional-panel-head h1 { font-size: 30px; }
.fn-premium .regional-stat-grid { grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)); gap: 14px; }
.fn-premium .regional-mini-list { padding: 0; list-style: none; }
.fn-premium .regional-mini-list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 18px; padding: 16px 0; border-bottom: 1px solid var(--fn-border); }
.fn-premium .regional-mini-list li span { color: var(--fn-text-muted); }
.fn-premium .regional-main { max-width: 100%; }
.fn-premium .regional-table-wrap { max-width: 100%; overflow: auto; }

/* Breakpoints match the existing shell, with content-driven grids between them. */
@media (max-width: 767px) {
  .fn-premium { --fn-header-h: 62px; }
  .fn-premium .fn-header-inner { gap: 8px; padding-inline: 14px; }
  .fn-premium :is(.fn-brand-logo, .account-brand-logo, .public-brand-logo) { width: 112px; }
  .fn-premium :is(.fn-header-left, .fn-header-right, .account-topbar-actions) { gap: 6px; }
  .fn-premium .fn-city-btn { max-width: 64px; padding: 6px; font-size: 11px; }
  .fn-premium .account-topbar { padding-inline: 14px; gap: 8px; }
  .fn-premium .account-desktop-nav { display: none; }
  .fn-premium .account-topbar-actions { margin-left: auto; }
  .fn-premium .account-user-trigger { padding: 0; width: 38px; min-width: 38px; }
  .fn-premium :is(.account-user-trigger-text, .account-user-chevron) { display: none; }
  .fn-premium .account-main { padding-top: 22px; }
  .fn-premium .fn-home { padding-top: 20px; }
  .fn-premium .fn-home-hero { padding: 28px 22px; border-radius: 20px; gap: 22px; }
  .fn-premium .fn-home-hero-title { font-size: clamp(34px, 8vw, 48px); }
  .fn-premium .fn-home-hero-lead { font-size: 13px; }
  .fn-premium .fn-home-hero-actions .fn-btn { padding-inline: 14px; font-size: 13px; }
  .fn-premium .fn-home-section-head { flex-wrap: wrap; gap: 8px; }
  .fn-premium .fn-vc { grid-template-columns: minmax(0, 1fr); }
  .fn-premium .fn-vc-main { padding: 20px 16px 88px; }
  .fn-premium .fn-vc-sidebar { width: 100%; height: auto; }
  .fn-premium .regional-topbar { flex-wrap: wrap; }
  .fn-premium .regional-topbar-meta { flex: 1; justify-content: flex-end; font-size: 12px; }
  .fn-premium .regional-topbar-meta .account-link-btn { padding: 7px 10px; font-size: 12px; }
  .fn-premium .regional-main { padding: 0 !important; }
  .fn-premium .public-main { padding-inline: 16px; }
}
@media (min-width: 640px) {
  .fn-premium .fn-home-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fn-premium .fn-wallet-balances { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fn-premium .fn-wallet-balances article { display: flex; flex-direction: column; align-items: flex-start; }
  .fn-premium .fn-wallet-balances article > strong { margin: 8px 0; align-self: flex-start; }
  .fn-premium .fn-wallet-balances article > strong small { display: inline; text-align: left; }
  .fn-premium .fn-wallet-balances article > a { margin-top: auto; }
  .fn-premium .fn-wallet-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .fn-premium .fn-home-hero { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
  .fn-premium .fn-home-hero-actions { flex-direction: column; align-items: stretch; min-width: 170px; }
  .fn-premium .fn-home-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fn-premium .fn-home-places-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .fn-premium .regional-layout { grid-template-columns: 236px minmax(0, 1fr); gap: 28px; }
  .fn-premium .regional-nav { display: grid; }
  .fn-premium .regional-sidebar { top: 24px; }
  .fn-premium .fn-vc-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .fn-premium .account-main { padding-bottom: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .fn-premium *, .fn-premium *::before, .fn-premium *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
.fn-premium.fn-admin {
  --body-bg: var(--fn-bg); --body-fg: var(--fn-text); --body-quiet-color: var(--fn-text-secondary);
  --body-loud-color: var(--fn-text); --darkened-bg: var(--fn-surface-2); --header-bg: var(--fn-surface);
  --header-color: var(--fn-text); --header-link-color: var(--fn-text); --breadcrumbs-bg: var(--fn-surface-2);
  --breadcrumbs-fg: var(--fn-text-muted); --breadcrumbs-link-fg: var(--fn-text); --link-fg: #c4b5fd;
  --link-hover-color: var(--fn-orange); --hairline-color: var(--fn-border); --border-color: var(--fn-border-strong);
  --selected-bg: var(--fn-surface-2); --selected-row: #252033; --primary: #7250b5; --secondary: var(--fn-surface-2);
}
.fn-premium.fn-admin #header { border-bottom: 1px solid var(--fn-border); }
.fn-premium.fn-admin .module { border: 1px solid var(--fn-border); border-radius: 12px; overflow: auto; }
.fn-premium.fn-admin input[type=submit] { min-height: 40px; border-radius: 8px; }
/* The legacy immersive profile rule hard-hides this header with !important. */
.fn-premium.account-profile-immersive .account-topbar { display: flex !important; }
.fn-premium.account-page .account-topbar { margin: 0; flex-direction: row; flex-wrap: nowrap; align-items: center; }
@media (max-width: 767px) {
  .fn-premium.account-page .account-topbar { padding: 8px 14px; }
  .fn-premium.account-page .account-topbar-actions { width: auto; flex-wrap: nowrap; justify-content: flex-end; }
}
/* Accessible action contrast and inline-link affordances. */
.fn-premium .fn-header .fn-btn { color: var(--fn-on-accent); }
.fn-premium .account-switch a { text-decoration: underline; }
.fn-premium .fn-acct-plus-btn { background: var(--fn-violet-hot); color: #fff; }
.fn-premium :is(.fn-wallet td, .fn-wallet-balances strong, .fn-review-card-text) { user-select: text; }