/* Hardcore War: dark, high contrast, gunmetal and olive drab. Hull artwork
   is still Classic's shapes (see js/themes/hardcore.js) until that gets its
   own distinct silhouettes; the palette, texture and hit effect below are
   already Hardcore War specific. */
:root[data-theme="hardcore"] {
  --page-bg: #14151a;
  --water: #232733;
  --water-border: #3a4050;
  --ship: #545b52;
  --hit: #ff3b30;
  --hit-wash: rgba(255, 59, 48, 0.55);
  --sunk: #4a0d0d;
  --sunk-wash: rgba(0, 0, 0, 0.6);
  --sunk-wash-edge: rgba(0, 0, 0, 0.7);
  --miss: #3a4050;
  --ink: #e8e6df;
  --muted: #9a978c;
  --preview-ok: #3f6b3a;
  --preview-ok-edge: #7bbf6a;
  --preview-bad: #6b2a2a;
  --preview-bad-edge: #ff3b30;
  --reject-bg: #ff3b30;
  --surface-bg: #1e2027;
  --surface-bg-hover: #2a2d36;
  --surface-bg-active: #34373f;
  --water-hover: #2d3345;
  --attached-bg: #34373f;
  --attached-ring: rgba(255, 59, 48, 0.35);
  --panel-shadow: rgba(0, 0, 0, 0.6);
  --panel-radius: 4px;
  --win-color: #7bbf6a;
  --lose-color: #ff3b30;
}

:root[data-theme="hardcore"] .ship-carrier {
  --ship-color: #3b3f2b;
}

:root[data-theme="hardcore"] .ship-battleship {
  --ship-color: #4a4f57;
}

:root[data-theme="hardcore"] .ship-cruiser {
  --ship-color: #6b4423;
}

:root[data-theme="hardcore"] .ship-submarine {
  --ship-color: #2f2f2f;
}

:root[data-theme="hardcore"] .ship-destroyer {
  --ship-color: #6e6a52;
}

:root[data-theme="hardcore"] .board-panel,
:root[data-theme="hardcore"] .stat,
:root[data-theme="hardcore"] .fleet-ship,
:root[data-theme="hardcore"] .tray-ship,
:root[data-theme="hardcore"] button {
  border-radius: var(--panel-radius);
}

/* War torn camouflage blotches, dark on dark so the grid still reads first. */
:root[data-theme="hardcore"] .cell:not(.hit):not(.miss):not(.sunk):not(.over-boat) {
  background-image: radial-gradient(circle at 20% 30%, rgba(0, 0, 0, 0.35) 0 6px, transparent 7px),
    radial-gradient(circle at 70% 65%, rgba(0, 0, 0, 0.3) 0 5px, transparent 6px);
}

/* A gritty shrapnel burst: harsher, faster, and darker at the edge than
   Classic's clean flash. */
@keyframes hit-fx-hardcore-anim {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 59, 48, 0.95);
  }
  70% {
    box-shadow: 0 0 14px 10px rgba(255, 59, 48, 0.35);
  }
  100% {
    box-shadow: 0 0 22px 16px rgba(0, 0, 0, 0);
  }
}

:root[data-theme="hardcore"] .cell.hit-fx-hardcore {
  animation: hit-fx-hardcore-anim 0.4s ease-in;
}