:root,
:root.is-web-2027 {
  --rt-font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  --rt-bg: #05080e;
  /* Explicit opaque surfaces are available on both platforms. */
  --rt-surface-solid: #090e17;
  --rt-surface-solid-2: #0d1420;
  --rt-surface: var(--rt-surface-solid);
  --rt-surface-2: var(--rt-surface-solid-2);

  --rt-text: #f5f7fa;
  --rt-muted: #8290a2;

  --rt-line: #1b2b3d;
  --rt-line-soft: #132131;

  --rt-gold: #ffc400;
  --rt-gold-deep: #d9a600;
  --rt-on-gold: #151000;

  --rt-danger: #ff9a9a;
  /* Existing destructive-action palette, shared with the current App. */
  --rt-danger-bg: #aa2323;
  --rt-danger-line: #d95c5c;
  --rt-success: #4caf50;
  --rt-warning: #f7c948;

  --rt-focus: var(--rt-gold);

  --rt-overlay: rgba(1,4,9,.84);
  --rt-overlay-web: rgba(0,0,0,.72);
}

/* Web panels use transparent backgrounds explicitly. The historical surface
   aliases stay unset on Web to preserve existing var() fallback behavior (e.g.
   Discogs). Use --rt-surface-solid[-2] for an explicitly opaque surface. Migrating
   individual consumers belongs to their component lots, not the shared shell. */
:root.is-web-2027 {
  --rt-surface: initial;
  --rt-surface-2: initial;
}

/* Shared compatibility tokens — preserve established geometry and cascade. */
:root{
  --rt-compat-card-surface: rgba(16, 24, 40, 0.52);
  --rt-compat-card-surface-2: rgba(16, 24, 40, 0.36);
  --rt-compat-line: rgba(255,255,255,0.10);
  --rt-compat-muted: rgba(255,255,255,0.68);
  --rt-compat-link: rgba(102,192,244,1);

  --rt-compat-brand: #DCAE3A;
  --rt-compat-edge: rgba(220,174,58,0.16);
  --rt-compat-edge-soft: rgba(220,174,58,0.08);
  --rt-compat-card-shadow: 0 22px 60px rgba(0,0,0,0.55);
  --rt-compat-radius: 22px;

  --rt-ease: cubic-bezier(.2,.8,.2,1);
}