.backgammon-main{flex:1;display:flex;flex-direction:column;align-items:center;padding:calc(var(--space-16) + var(--space-2)) var(--space-4) var(--space-8);gap:var(--space-6);max-width:1100px;margin:0 auto;width:100%}.backgammon-intro{width:100%;max-width:500px;padding:var(--space-8);display:flex;flex-direction:column;align-items:center;gap:var(--space-5);text-align:center;margin-top:var(--space-8)}.backgammon-intro h1{font-family:var(--font-display);font-size:var(--text-4xl);font-weight:900;letter-spacing:-.03em}.backgammon-intro p{color:var(--color-text-secondary);line-height:1.6}.backgammon-modes{display:flex;gap:var(--space-3);width:100%}.backgammon-modes button{flex:1}.backgammon-hud{display:flex;justify-content:space-between;align-items:center;width:100%;background:var(--color-surface-raised);border:1px solid var(--color-border-subtle);padding:var(--space-4) var(--space-6);border-radius:var(--radius-xl);box-shadow:0 4px 12px #0003;transition:all .3s ease;gap:var(--space-4)}@keyframes turn-glow{0%,to{border-color:var(--color-border-subtle);box-shadow:0 4px 12px #0003}50%{border-color:var(--game-accent);box-shadow:0 0 20px var(--game-accent-glow),0 4px 12px #0003}}.backgammon-hud.your-turn{animation:turn-glow 2s infinite ease-in-out}.pulse-btn{animation:button-pulse 1.5s infinite ease-in-out}@keyframes button-pulse{0%{transform:scale(1);box-shadow:0 0 0 0 var(--game-accent-glow)}70%{transform:scale(1.04);box-shadow:0 0 0 10px #10b98100}to{transform:scale(1);box-shadow:0 0 #10b98100}}.hud-status{display:flex;align-items:center;gap:var(--space-2)}.turn-indicator{width:14px;height:14px;border-radius:50%;display:inline-block;box-shadow:0 0 8px #0000004d}.turn-indicator.white{background:#fff}.turn-indicator.red{background:#ef4444}.turn-text{font-weight:700;font-size:var(--text-sm)}.dice-section{display:flex;align-items:center;gap:var(--space-4)}.die-3d-wrap{width:32px;height:32px;perspective:160px}.die{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .6s ease-out}.die-face{position:absolute;width:32px;height:32px;background:#fff;color:#111;border:1px solid #cccccc;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;box-shadow:inset 0 0 4px #0000001a,0 2px 4px #00000026;backface-visibility:hidden}.die-svg{width:100%;height:100%;display:block;padding:4px;box-sizing:border-box}.face-1{transform:rotateY(0) translateZ(16px)}.face-6{transform:rotateY(180deg) translateZ(16px)}.face-2{transform:rotateX(90deg) translateZ(16px)}.face-5{transform:rotateX(-90deg) translateZ(16px)}.face-3{transform:rotateY(90deg) translateZ(16px)}.face-4{transform:rotateY(-90deg) translateZ(16px)}.die.rolling{animation:die-spin .8s linear infinite}@keyframes die-spin{0%{transform:rotateX(0) rotateY(0) rotate(0)}to{transform:rotateX(360deg) rotateY(360deg) rotate(360deg)}}.move-pill{background:var(--game-accent-subtle);border:1.5px solid var(--game-accent);color:var(--game-accent);font-weight:800;font-size:var(--text-xs);padding:2px 8px;border-radius:var(--radius-full)}.moves-left-panel{display:flex;gap:var(--space-1)}.game-board-area{display:flex;gap:var(--space-4);width:100%;align-items:stretch}#backgammon-board-container{flex:1}.backgammon-board-frame{background:#0f2d1e;border:12px solid #5a3c26;border-radius:var(--radius-xl);box-shadow:0 16px 40px #00000080;display:flex;flex-direction:column;aspect-ratio:1.3 / 1;width:100%;position:relative;overflow:hidden}.board-half{flex:1;display:flex;position:relative}.top-half{border-bottom:2px solid #5a3c26}.board-quadrant{flex:1;display:flex;justify-content:space-around;position:relative;padding:0 var(--space-2)}.left-quadrant{border-right:6px solid #5a3c26}.right-quadrant{border-left:6px solid #5a3c26}.board-bar{width:44px;background:#5a3c26;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:var(--space-2) 0;position:relative;box-shadow:inset 0 0 8px #0006;cursor:pointer}.board-bar.selected{outline:3px solid var(--game-accent);box-shadow:0 0 15px var(--game-accent-glow);z-index:10}.bar-label{font-family:var(--font-display);font-weight:900;color:#ffffff4d;font-size:var(--text-xs);letter-spacing:.1em;transform:rotate(-90deg)}.board-point{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:opacity var(--duration-fast) ease}.board-point.selected{background:#ffffff1a;box-shadow:inset 0 0 0 2px var(--game-accent)}.board-point.legal-dest{background:#10b98126;box-shadow:inset 0 0 10px #10b9814d}.point-triangle{position:absolute;width:90%;height:85%;z-index:1;opacity:.85}.point-dark .point-triangle{background-color:#1e3b2e}.point-light .point-triangle{background-color:#8c7355}.bottom .point-triangle{bottom:0;clip-path:polygon(50% 0%,0% 100%,100% 100%)}.top .point-triangle{top:0;clip-path:polygon(50% 100%,0% 0%,100% 0%)}.checkers-stack,.bar-checkers-stack{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;width:100%}.bottom .checkers-stack{bottom:var(--space-1);flex-direction:column-reverse}.top .checkers-stack{top:var(--space-1);flex-direction:column}.bar-checkers-stack{position:relative;gap:2px}:root{--checker-size: clamp(14px, 3.2vw, 36px)}.checker{width:var(--checker-size);height:var(--checker-size);border-radius:50%;box-shadow:0 3px 6px #0006,inset 0 -2px 4px #0003;border:1px solid rgba(0,0,0,.15)}.checker.white{background:radial-gradient(circle at 35% 35%,#fff,#ddd 60%,#aaa)}.checker.red{background:radial-gradient(circle at 35% 35%,#ef4444,#b91c1c 60%,#7f1d1d)}.checkers-stack .checker+.checker{margin-top:var(--checker-margin, 2px)}#bearoff-container{width:130px;flex-shrink:0}.bearoff-panel{display:flex;flex-direction:column;gap:var(--space-4);height:100%}.bearoff-box{flex:1;background:var(--color-surface-raised);border:2px solid var(--color-border-subtle);border-radius:var(--radius-xl);padding:var(--space-3);display:flex;flex-direction:column;align-items:center;gap:var(--space-2);position:relative}.bearoff-box.legal-dest{border-color:var(--game-accent);box-shadow:0 0 12px var(--game-accent-glow);cursor:pointer}.bo-label{font-size:10px;font-weight:800;letter-spacing:.05em;color:var(--color-text-tertiary)}.bo-count{font-family:var(--font-display);font-weight:900;font-size:var(--text-md)}.bearoff-stack{display:flex;flex-wrap:wrap;gap:2px;width:100%;justify-content:center}.bo-checker{width:16px;height:8px;border-radius:2px;border:1px solid rgba(0,0,0,.2)}.bo-checker.white{background:#fff}.bo-checker.red{background:#ef4444}.game-footer{display:flex;justify-content:center;width:100%}@media (max-width: 768px){.game-board-area{flex-direction:column}#bearoff-container{width:100%;height:auto}.bearoff-panel{flex-direction:row;height:auto}.bearoff-box{padding:var(--space-2);height:70px;flex-direction:row;justify-content:space-around}}.board-point.drag-hover,.bearoff-box.drag-hover{background:#10b9814d!important}@media (max-width: 600px){.backgammon-hud{flex-direction:column;gap:var(--space-3);text-align:center}}