/* The game retains its original board, player colors, and input behavior. */
body.rp-hex {
    --bg: #111514;
    --bg-card: #1b251e;
    --border: #3a5040;
    --text: #e6ede3;
    --text-dim: #98af9b;
    background: #111514;
    background-image: none;
    color: #e6ede3;
    font-family: "Segoe UI Variable Display", "Segoe UI", Arial, sans-serif;
}
.rp-hex .top-bar { border-bottom: 1px solid #35483a; padding-block: 16px; }
.rp-hex .back-link { display: inline-flex; align-items: center; gap: 10px; color: #c1ddc5; }
.rp-hex .back-link img { width: 38px; height: 38px; object-fit: contain; border: 1px solid #3b5441; }
.rp-hex .title-row h1 { font-weight: 450; letter-spacing: -.04em; text-shadow: none; }
.rp-hex .title-row h1 span { color: #a7e5cb; font-family: Georgia, "Times New Roman", serif; font-style: italic; }
.rp-hex :is(.controls, .rules-box, .canvas-wrap, .status-bar) { background: #19251d; border-color: #3a5040; border-radius: 0; box-shadow: none; }
.rp-hex :is(button, select, .btn) { border-radius: 0; }
.rp-hex .btn { background: #a7e5cb; color: #183525; border: 1px solid #82b38e; box-shadow: none; }
.rp-hex .btn-outline { background: transparent; color: #bddbc3; border-color: #597b60; }
.rp-hex :is(a, button, select):focus-visible { outline: 3px solid #f4a16c; outline-offset: 4px; }
.rp-hex .player-badge.p2 { color: #ff9aa7; }
.rp-hex .rules-box strong[style*="--p2"] { color: #ff9aa7 !important; }
.rp-hex :is(select, .btn) { font-size: 14px; }