:root {
  --ca-v5-asset-root: "../assets";
  --ca-v5-navy: #153a67;
  --ca-v5-text: #0b2850;
  --ca-v5-gap: clamp(8px, 0.8vw, 14px);
}

.ca-v5,
.ca-v5 * {
  box-sizing: border-box;
}

/* PNG files are empty skins. Keep all text, data and icons in HTML. */
.ca-v5 [data-ca-skin] {
  position: relative;
  border: 0 !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  box-shadow: none !important;
}

.ca-v5 [data-ca-skin="app-shell"] {
  padding: 22px;
  background-image: url("../assets/panels/app-shell.png") !important;
}

.ca-v5 [data-ca-skin="section-card"] {
  padding: 20px;
  background-image: url("../assets/panels/section-card.png") !important;
}

.ca-v5 [data-ca-skin="chat-panel"] {
  padding: 20px;
  background-image: url("../assets/panels/chat-panel.png") !important;
}

.ca-v5 [data-ca-skin="sidebar-panel"] {
  padding: 20px;
  background-image: url("../assets/panels/sidebar-panel.png") !important;
}

.ca-v5 [data-ca-skin="inset-cream"],
.ca-v5 [data-ca-skin="inset-blue"] {
  padding: 16px;
}

.ca-v5 [data-ca-skin="inset-cream"] {
  background-image: url("../assets/panels/inset-well-cream.png") !important;
}

.ca-v5 [data-ca-skin="inset-blue"] {
  background-image: url("../assets/panels/inset-well-blue.png") !important;
}

.ca-v5 [data-ca-skin="toolbar"] {
  padding: 18px 22px;
  background-image: url("../assets/panels/toolbar-rail.png") !important;
}

.ca-v5 [data-ca-skin="footer"] {
  padding: 14px 22px;
  background-image: url("../assets/panels/footer-rail.png") !important;
}

.ca-v5 [data-ca-skin="player-card"] {
  min-width: 0;
  padding: 18px;
}

.ca-v5 [data-ca-skin="player-card"][data-player="btc"] {
  background-image: url("../assets/cards/player-card-btc.png") !important;
}

.ca-v5 [data-ca-skin="player-card"][data-player="eth"] {
  background-image: url("../assets/cards/player-card-eth.png") !important;
}

.ca-v5 [data-ca-skin="player-card"][data-player="sol"] {
  background-image: url("../assets/cards/player-card-sol.png") !important;
}

.ca-v5 [data-ca-skin="player-card"][data-player="doge"] {
  background-image: url("../assets/cards/player-card-doge.png") !important;
}

.ca-v5 [data-ca-skin="character-tile"] {
  padding: 14px;
  background-image: url("../assets/cards/character-tile.png") !important;
}

.ca-v5 [data-ca-skin="character-tile"][aria-selected="true"],
.ca-v5 [data-ca-skin="character-tile"].is-selected {
  background-image: url("../assets/cards/character-tile-selected.png") !important;
}

.ca-v5 [data-ca-skin="stat-tile"] {
  padding: 14px;
  background-image: url("../assets/cards/stat-tile.png") !important;
}

.ca-v5 [data-ca-skin="result-modal"] {
  width: min(760px, calc(100vw - 32px));
  padding: 70px 46px 42px;
  color: var(--ca-v5-text);
  background-image: url("../assets/panels/result-modal-shell.png") !important;
}

.ca-v5 [data-ca-skin="result-plate"] {
  min-height: 76px;
  padding: 18px 36px;
  color: #fff;
  text-align: center;
  background-image: url("../assets/results/result-plate-victory.png") !important;
}

.ca-v5 [data-result="defeat"] [data-ca-skin="result-plate"] {
  background-image: url("../assets/results/result-plate-defeat.png") !important;
}

.ca-v5 [data-ca-skin="ranking-row"] {
  min-height: 58px;
  padding: 12px 22px;
}

.ca-v5 [data-ca-skin="ranking-row"][data-rank="1"] {
  background-image: url("../assets/results/ranking-row-gold.png") !important;
}

.ca-v5 [data-ca-skin="ranking-row"][data-coin="eth"] {
  background-image: url("../assets/results/ranking-row-blue.png") !important;
}

.ca-v5 [data-ca-skin="ranking-row"][data-coin="sol"] {
  background-image: url("../assets/results/ranking-row-purple.png") !important;
}

.ca-v5 [data-ca-skin="ranking-row"][data-coin="doge"] {
  background-image: url("../assets/results/ranking-row-green.png") !important;
}

.ca-v5 [data-result="defeat"] [data-ca-skin="ranking-row"][data-current="true"] {
  background-image: url("../assets/results/ranking-row-red.png") !important;
}

.ca-v5 [data-ca-skin="hud-top"] {
  padding: 16px 24px;
  background-image: url("../assets/gameplay/hud-top-rail.png") !important;
}

.ca-v5 [data-ca-skin="map-frame"] {
  padding: clamp(14px, 1.3vw, 24px);
  background-image: url("../assets/gameplay/map-frame.png") !important;
}

.ca-v5 [data-ca-skin="spectator-bar"] {
  width: min(520px, calc(100% - 24px));
  min-height: 92px;
  padding: 18px 28px;
  color: #fff;
  background-image: url("../assets/gameplay/spectator-bar.png") !important;
  pointer-events: none;
}

.ca-v5 [data-ca-skin="elimination-toast"] {
  width: min(320px, calc(100% - 24px));
  min-height: 64px;
  padding: 14px 22px;
  color: #fff;
  background-image: url("../assets/gameplay/elimination-toast.png") !important;
  pointer-events: none;
}

.ca-v5 [data-ca-button-skin] {
  min-height: 48px;
  border: 0 !important;
  color: #fff;
  background-color: transparent !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  box-shadow: none !important;
}

.ca-v5 [data-ca-button-skin="primary-orange"] { background-image: url("../assets/buttons/button-primary-orange.png") !important; }
.ca-v5 [data-ca-button-skin="primary-blue"] { background-image: url("../assets/buttons/button-primary-blue.png") !important; }
.ca-v5 [data-ca-button-skin="action-cyan"] { background-image: url("../assets/buttons/button-action-cyan.png") !important; }
.ca-v5 [data-ca-button-skin="secondary-cream"] { color: var(--ca-v5-text); background-image: url("../assets/buttons/button-secondary-cream.png") !important; }
.ca-v5 [data-ca-button-skin="danger-red"] { background-image: url("../assets/buttons/button-danger-red.png") !important; }
.ca-v5 [data-ca-button-skin="success-green"] { background-image: url("../assets/buttons/button-success-green.png") !important; }
.ca-v5 [data-ca-button-skin="disabled-gray"] { background-image: url("../assets/buttons/button-disabled-gray.png") !important; }

.ca-v5 [data-ca-button-skin]:hover:not(:disabled) { filter: brightness(1.04) saturate(1.04); transform: translateY(-1px); }
.ca-v5 [data-ca-button-skin]:active:not(:disabled) { filter: brightness(.96); transform: translateY(2px); }
.ca-v5 [data-ca-button-skin]:focus-visible { outline: 3px solid #55d0ee; outline-offset: 3px; }
.ca-v5 [data-ca-button-skin]:disabled { cursor: not-allowed; filter: grayscale(.2); opacity: .62; }

@media (max-width: 1024px) {
  .ca-v5 [data-ca-skin="result-modal"] {
    padding: 54px 28px 30px;
  }
}