body, html { overscroll-behavior: none; touch-action: none; }
.board-grid { display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(5, 1fr); gap: 4px; }
.center-dash { grid-column: 2 / 5; grid-row: 2 / 5; }
.board-tile { background: rgba(30, 41, 59, 0.9); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 6px; position: relative; display: flex; flex-direction: column; align-items: center; padding-top: 4px; box-shadow: inset 0 0 10px rgba(0,0,0,0.5); }
.board-tile.corner { background: rgba(15, 23, 42, 0.9); border-color: rgba(16, 185, 129, 0.3); }
.tokens-container { position: absolute; bottom: 4px; width: 100%; display: flex; justify-content: center; flex-wrap: wrap; gap: 2px; }

/* %20 YAVAŞLATILMIŞ PİYON GEÇİŞİ */
.token { width: 11px; height: 11px; border-radius: 50%; border: 1px solid #fff; transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); }

/* %20 YAVAŞLATILMIŞ ZAR ANİMASYONU */
@keyframes diceRoll { 0% { transform: rotate(0deg) scale(1); } 50% { transform: rotate(360deg) scale(1.3); } 100% { transform: rotate(720deg) scale(1); } }
.rolling { animation: diceRoll 0.6s ease-in-out; }