@import "../cats/style.css?v=20260615-181704";

:root {
  --page-bg: linear-gradient(145deg, #fff0b8 0%, #ffe0ef 46%, #c9f3ff 100%);
  --panel-bg: rgba(255, 252, 245, 0.9);
  --panel-border: rgba(134, 72, 126, 0.18);
  --board-bg: #f3a7bd;
  --cell-bg: rgba(255, 255, 255, 0.32);
  --text-main: #4b304a;
  --text-muted: #7d5f78;
  --button-main: #f06f8f;
  --button-main-hover: #d94c74;
  --button-secondary: rgba(255, 252, 245, 0.96);
  --shadow-soft: 0 20px 45px rgba(163, 88, 126, 0.2);
  --shadow-card: 0 10px 24px rgba(163, 88, 126, 0.18);
}

body {
  background:
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.78), transparent 18%),
    radial-gradient(circle at 82% 20%, rgba(255, 213, 71, 0.36), transparent 20%),
    radial-gradient(circle at 74% 82%, rgba(82, 211, 255, 0.28), transparent 24%),
    var(--page-bg);
}

.theme-label {
  color: #c94d78;
}

.site-nav-link.is-active {
  box-shadow: none;
}

.board-frame {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.7), rgba(255, 240, 184, 0.38)),
    rgba(255, 252, 245, 0.62);
}

.board {
  box-shadow:
    inset 0 4px 18px rgba(115, 42, 82, 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.18);
}

.tile {
  background: transparent;
}

.tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}