/* Royal Snake Game shared visual system tokens.
   Generated by tools/art/generate-rsg-visual-system.mjs. */
:root {
  --rsg-art-night: #050302;
  --rsg-art-ebony: #0b0907;
  --rsg-art-obsidian: #12151b;
  --rsg-art-lacquer: #170d08;
  --rsg-art-oxblood: #6f2110;
  --rsg-art-ruby: #c63d35;
  --rsg-art-cinnabar: #f06c56;
  --rsg-art-bronze: #b87745;
  --rsg-art-gold: #d5a33c;
  --rsg-art-gold-bright: #f3d278;
  --rsg-art-parchment: #ead9b2;
  --rsg-art-parchment-light: #fff1c4;
  --rsg-art-ink: #2a160c;
  --rsg-art-smoke: #b9a878;
  --rsg-art-teal: #2f7d76;
  --rsg-art-mint: #88e7cf;
  --rsg-art-emerald: #155d52;
  --rsg-art-sky: #5dc8ff;
  --rsg-art-violet: #8f72ff;
  --rsg-art-shadow: #000000;
  --rsg-art-radius-sm: 6px;
  --rsg-art-radius-md: 8px;
  --rsg-art-radius-lg: 14px;
  --rsg-art-shadow-panel: 0 22px 56px rgba(0, 0, 0, 0.42);
  --rsg-art-shadow-deep: 0 34px 92px rgba(0, 0, 0, 0.62);
  --rsg-art-bg-royal-arena: url("/media/rsg-visual-system/backgrounds/bg-royal-arena.svg");
  --rsg-art-bg-mobile-hub: url("/media/rsg-visual-system/backgrounds/bg-mobile-hub.svg");
  --rsg-art-bg-parchment: url("/media/rsg-visual-system/backgrounds/bg-parchment-field.svg");
  --rsg-art-bg-lacquer: url("/media/rsg-visual-system/backgrounds/bg-lacquer-noise.svg");
  --rsg-art-border-panel: url("/media/rsg-visual-system/borders/border-panel-gold.svg");
  --rsg-art-divider: url("/media/rsg-visual-system/borders/divider-royal-fang.svg");
  --rsg-art-piece-ivory-snake: url("/media/rsg-visual-system/pieces/pawn-ivory-snake.svg");
  --rsg-art-piece-onyx-snake: url("/media/rsg-visual-system/pieces/pawn-onyx-snake.svg");
  --rsg-art-piece-ivory-king: url("/media/rsg-visual-system/pieces/pawn-ivory-king-cobra.svg");
  --rsg-art-piece-onyx-king: url("/media/rsg-visual-system/pieces/pawn-onyx-king-cobra.svg");
}

.rsg-art-bg-royal {
  background-image:
    linear-gradient(90deg, rgba(5, 3, 2, 0.9), rgba(5, 3, 2, 0.46) 48%, rgba(5, 3, 2, 0.84)),
    var(--rsg-art-bg-royal-arena);
  background-position: center;
  background-size: cover;
}

.rsg-art-bg-mobile {
  background-image:
    linear-gradient(180deg, rgba(5, 3, 2, 0.14), rgba(5, 3, 2, 0.92)),
    var(--rsg-art-bg-mobile-hub);
  background-position: center top;
  background-size: cover;
}

.rsg-art-parchment {
  background:
    linear-gradient(rgba(255, 246, 220, 0.9), rgba(234, 217, 178, 0.92)),
    var(--rsg-art-bg-parchment) center / cover;
}

.rsg-art-panel-border {
  border: 12px solid transparent;
  border-image: var(--rsg-art-border-panel) 32 fill / 12px / 0 round;
}

.rsg-art-divider {
  min-height: 24px;
  background: var(--rsg-art-divider) center / contain no-repeat;
}