.draughts-game{width:min(96vw,560px);margin:0 auto;padding:6px 0 28px}.draughts-panel{margin-bottom:12px;padding:14px;border:1px solid var(--m-line,#E2E8E3);border-radius:20px;background:#fff;box-shadow:0 10px 28px rgba(37,50,57,.07)}.draughts-head{text-align:center}.draughts-title{color:var(--m-text,#253239);font-size:19px;font-weight:900}.draughts-sub{margin-top:5px;color:var(--m-muted,#627177);font-size:11px}.draughts-turn{margin-top:10px;display:flex;justify-content:center}.draughts-turn-pill{min-height:34px;padding:0 12px;display:inline-flex;align-items:center;gap:7px;border:1px solid #DCE4DF;border-radius:999px;background:#F7F9F7;color:#42545B;font-size:11px;font-weight:800}.draughts-alert{margin-top:9px;padding:9px 11px;border:1px solid #E7DDBE;border-radius:12px;background:#FBF7EA;color:#75622B;font-size:10px;font-weight:750;text-align:center}.draughts-board-shell{margin-top:12px;padding:6px;border-radius:18px;background:#476F70;box-shadow:0 14px 30px rgba(55,91,91,.14)}.draughts-board{display:grid;grid-template-columns:repeat(10,1fr);width:100%;aspect-ratio:1;overflow:hidden;border-radius:12px}.draughts-cell{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;padding:0;border:0}.draughts-cell.light{background:#EDF1EC}.draughts-cell.dark{background:#88A7A0}.draughts-cell.selectable:after{content:"";position:absolute;inset:10%;border:2px solid rgba(255,255,255,.78);border-radius:50%}.draughts-cell.destination:after{content:"";position:absolute;width:24%;aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(71,111,112,.16)}.draughts-cell.destination.capture:after{width:31%;background:#F5D985}.draughts-cell.selected{box-shadow:inset 0 0 0 3px rgba(255,255,255,.94)}.draughts-piece{position:relative;z-index:2;width:76%;aspect-ratio:1;border-radius:50%;pointer-events:none}.draughts-piece.white{background:radial-gradient(circle at 35% 28%,#fff,#E8E5D9 56%,#C8C4B5);border:1px solid rgba(92,92,82,.25);box-shadow:inset 0 2px 3px rgba(255,255,255,.85),inset 0 -3px 5px rgba(91,91,78,.15),0 2px 5px rgba(37,50,57,.22)}.draughts-piece.black{background:radial-gradient(circle at 35% 28%,#596267,#30383D 58%,#1E2529);border:1px solid rgba(0,0,0,.26);box-shadow:inset 0 2px 3px rgba(255,255,255,.12),inset 0 -3px 5px rgba(0,0,0,.28),0 2px 5px rgba(37,50,57,.24)}
/* damka: krążąca świecąca obwódka */
.draughts-piece.king:before{content:"";position:absolute;z-index:-1;inset:-7px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 45deg,#D7F0E8 95deg,#70A9A5 135deg,transparent 180deg 235deg,#F3D98B 285deg,#fff 320deg,transparent 360deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));filter:drop-shadow(0 0 5px rgba(91,150,146,.5));animation:draughtsKingOrbit 2.6s linear infinite}.draughts-piece.king:after{content:"";position:absolute;inset:-3px;border-radius:50%;box-shadow:0 0 10px rgba(108,160,156,.30)}@keyframes draughtsKingOrbit{to{transform:rotate(360deg)}}.draughts-piece.last{animation:draughtsPulse .28s ease}@keyframes draughtsPulse{0%{transform:scale(.78)}70%{transform:scale(1.07)}100%{transform:scale(1)}}.draughts-stats{margin-top:10px;display:flex;gap:7px;justify-content:center;flex-wrap:wrap}.draughts-chip{min-height:32px;padding:0 10px;display:inline-flex;align-items:center;gap:6px;border:1px solid #DDE5E0;border-radius:999px;background:#F7F9F7;color:#4B5C62;font-size:10px}.draughts-mini-piece{width:13px;height:13px;border-radius:50%}.draughts-mini-piece.white{background:#ECE9DC;border:1px solid #BDB9AA}.draughts-mini-piece.black{background:#313A3F}.draughts-result{margin-top:12px;padding:13px;border:1px solid #DDE5E0;border-radius:15px;background:#F6F8F6;text-align:center}.draughts-result strong{display:block;color:var(--m-text,#253239);font-size:17px}.draughts-result span{display:block;margin-top:4px;color:var(--m-muted,#627177);font-size:10px}.draughts-rematch-state{margin-top:8px;color:var(--m-muted,#627177);font-size:10px;text-align:center}.draughts-card .game-icon{background:#E8F1EE!important}@media(max-width:390px){.draughts-board-shell{padding:4px}.draughts-piece{width:73%}.draughts-piece.king:before{inset:-5px}}


/* =========================================================
   WARCABY — STABILNY RENDER, BEZ SKAKANIA PLANSZY
   ========================================================= */

#draughtsGame {
  overflow-anchor: none;
}

#draughtsGame .draughts-stable-panel {
  overflow-anchor: none;
}

#draughtsGame .draughts-board-shell {
  contain: layout paint;
  overflow-anchor: none;
}

#draughtsGame .draughts-board {
  min-width: 0;
  min-height: 0;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

#draughtsGame .draughts-cell {
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

#draughtsGame .draughts-piece {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}

#draughtsTurnSlot,
#draughtsAlertSlot,
#draughtsStatsSlot,
#draughtsResultSlot {
  overflow-anchor: none;
}


/* MUNIT_DRAUGHTS_CLOCK_CSS_V1 */

/*
 * Rezerwujemy stałą wysokość na:
 * "Musisz bić" / "Kontynuuj bicie".
 * Dzięki temu plansza nie przesuwa się,
 * gdy komunikat pojawia się albo znika.
 */
#draughtsAlertSlot {
  box-sizing: border-box;
  height: 54px;
  min-height: 54px;
  overflow: hidden;
}

#draughtsAlertSlot .draughts-alert {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  margin-top: 8px;

  display: flex;
  align-items: center;
  justify-content: center;

  line-height: 1.25;
}

/* Dwa zegary zawsze obok siebie */
#draughtsGame .draughts-clocks {
  display: grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(0,1fr);

  gap: 8px;

  margin:
    2px 0 10px;

  overflow-anchor: none;
}

#draughtsGame .draughts-clock {
  min-width: 0;
  padding: 9px 10px 8px;

  border:
    1px solid #DDE5E0;

  border-radius: 14px;

  background: #F7F9F7;

  color: #526269;

  transition:
    border-color .16s ease,
    background .16s ease,
    box-shadow .16s ease;
}

#draughtsGame .draughts-clock.active {
  border-color: #7EA5A1;

  background: #EEF5F2;

  box-shadow:
    inset 0 0 0 1px
    rgba(71,111,112,.12);
}

#draughtsGame .draughts-clock.expired {
  border-color: #D6A1A1;
  background: #FAF0F0;
}

#draughtsGame .draughts-clock-top {
  display: flex;
  align-items: center;
  gap: 6px;

  min-width: 0;
}

#draughtsGame .draughts-clock-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;

  color: #627177;

  font-size: 10px;
  font-weight: 750;
}

#draughtsGame .draughts-clock-time {
  margin-top: 3px;

  color: #253239;

  font-size: 24px;
  line-height: 1;
  font-weight: 900;

  letter-spacing: .02em;

  font-variant-numeric:
    tabular-nums;
}

#draughtsGame .draughts-clock.active
.draughts-clock-time {
  color: #3E6E70;
}

#draughtsGame .draughts-clock.expired
.draughts-clock-time {
  color: #A55454;
}

@media (max-width:390px) {
  #draughtsAlertSlot {
    height: 52px;
    min-height: 52px;
  }

  #draughtsGame .draughts-clock {
    padding:
      8px 8px 7px;
  }

  #draughtsGame .draughts-clock-time {
    font-size: 22px;
  }
}
