*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:radial-gradient(circle at center,#2f6f52,#244736 70%);color:#fff}#app{min-height:100vh;display:flex;flex-direction:column;align-items:stretch;width:100%;padding:1rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.auth-card,.pair-hub,.unauthorized{background:#00000059;border-radius:.75rem;padding:1.5rem;max-width:420px;width:100%;margin-inline:auto}.auth-card button,.pair-card button,.game-room-header button{margin-top:.75rem;padding:.5rem 1rem;border-radius:.5rem;border:0;font-weight:600;cursor:pointer;background:#f0ddbb;color:#2d1f17}.pair-list{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.pair-card{background:#ffffff14;border-radius:.5rem;padding:1rem}.pair-card-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}.game-room{width:100%;max-width:1280px;margin-inline:auto}.game-room-board{min-width:0;width:100%}.game-room-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.75rem}.game-room-body{width:100%}.chat-panel{background:#00000059;border-radius:.5rem;padding:.75rem;max-height:70vh;display:flex;flex-direction:column}.chat-messages{flex:1;overflow-y:auto;min-height:200px;font-size:.9rem;margin-bottom:.5rem}.chat-msg{margin-bottom:.35rem;word-break:break-word}.chat-form{display:flex;gap:.35rem}.chat-form input{flex:1;padding:.4rem .5rem;border-radius:.35rem;border:0}.chat-form button{margin-top:0;padding:.4rem .65rem}:root{--board-frame: #5a3724;--board-surface: #d7b98f;--point-dark: #7a3f23;--point-light: #f0ddbb;--bar: #6b452f;--checker-light: #f8f8f4;--checker-dark: #1f2228;--pip-shadow: rgba(0, 0, 0, .2);--die-size: 44px;--bg-side-column: 300px}.bg-board-wrap{width:min(1240px,96vw)}.bg-board-layout{display:grid;grid-template-columns:var(--bg-side-column) 1fr;gap:.9rem;align-items:stretch}.bg-left-stack{display:flex;flex-direction:column;gap:.9rem;width:var(--bg-side-column);min-width:0;align-self:stretch}.bg-chat-mount{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.bg-chat-mount .chat-panel{flex:1;min-height:0;max-height:none}.bg-board{aspect-ratio:2 / 1.75;width:100%;min-height:720px;padding:1rem;border-radius:1rem;background:linear-gradient(145deg,#704529,#4a2d1f);box-shadow:0 10px 24px #00000073,inset 0 1px #ffffff26}.bg-playfield{height:100%;border-radius:.6rem;background:var(--board-surface);display:grid;grid-template-columns:72px 1fr 74px 1fr 72px;overflow:hidden}.bg-tray{background:#00000024;display:flex;justify-content:center;align-items:stretch;font-size:.8rem;color:#2d1f17;font-weight:700;text-transform:uppercase;letter-spacing:.08em;position:relative;overflow:hidden}.bg-quadrant{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:3fr 2fr 3fr;position:relative;background:#ffffff0f}.bg-bar{background:var(--bar);box-shadow:inset 0 0 0 2px #00000026;display:grid;grid-template-rows:1fr 1fr;position:relative}.bg-zone-label{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#ffffffd9;font-weight:700;letter-spacing:.12em;font-size:.85rem;text-transform:uppercase;pointer-events:none;z-index:1}.bg-tray .bg-zone-label{color:#2d1f17;writing-mode:vertical-rl;transform:rotate(180deg)}.bg-point{position:relative;display:flex;justify-content:center;align-items:flex-end;overflow:hidden}.bg-point.top{grid-row:1;align-items:flex-start}.bg-point.bottom{grid-row:3}.bg-point:before{content:"";position:absolute;left:0;right:0;margin-inline:auto;width:100%;clip-path:polygon(50% 100%,0 0,100% 0);background:var(--point-dark)}.bg-point.top:before{top:0;bottom:auto;height:100%;clip-path:polygon(50% 100%,0 0,100% 0)}.bg-point.bottom:before{bottom:0;top:auto;height:100%;clip-path:polygon(0 100%,100% 100%,50% 0)}.bg-point.alt:before{background:var(--point-light)}.bg-stack{position:relative;z-index:2;width:88%;display:flex;flex-direction:column;gap:4px;padding:4px 0;pointer-events:auto}.bg-point.top .bg-stack{justify-content:flex-start}.bg-point.bottom .bg-stack{justify-content:flex-end;margin-top:auto}.bg-checker{width:var(--checker-size, 56px);max-width:100%;aspect-ratio:1 / 1;border-radius:50%;cursor:grab;box-shadow:inset 0 -2px 4px #0003,inset 0 2px 2px #ffffff59,0 1px 2px var(--pip-shadow);border:1px solid rgba(0,0,0,.3)}.bg-checker:active{cursor:grabbing}.bg-checker.dragging{opacity:.55}.bg-drop-target{outline:2px dashed rgba(255,255,255,.7);outline-offset:-2px}.bg-zone-stack{position:relative;z-index:2;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;padding:6px 3px}.bg-checker.light{background:radial-gradient(circle at 35% 30%,#ffffff,var(--checker-light))}.bg-checker.dark{background:radial-gradient(circle at 35% 30%,#3a3f49,var(--checker-dark))}.bg-dice-panel{flex:0 0 auto;display:grid;grid-template-columns:1fr;align-content:start;gap:.8rem}.bg-player-dice{background:#00000040;border-radius:.6rem;padding:.65rem;display:grid;gap:.5rem}.bg-dice-header{display:flex;justify-content:space-between;align-items:center;font-size:.88rem;letter-spacing:.04em;text-transform:uppercase;font-weight:700}.bg-roll-btn{border:0;border-radius:.45rem;width:2rem;height:2rem;padding:0;font-weight:700;cursor:pointer;background:#f0ddbb;color:#2d1f17;display:grid;place-items:center}.bg-roll-btn:before{content:"🎲";font-size:1rem}.bg-dice-row{display:flex;gap:.45rem}.bg-die{width:var(--die-size);height:var(--die-size);border-radius:.5rem;display:grid;place-items:center;font-size:0;font-weight:700;box-shadow:inset 0 -2px 5px #0000002e;-webkit-user-select:none;user-select:none;overflow:hidden}.bg-die:before{content:attr(data-face);font-size:calc(var(--die-size) * 1.5);line-height:1;transform:translateY(calc(var(--die-size) * -.42))}.bg-die.white{background:#f8f8f4;color:#1f2228;border:1px solid rgba(0,0,0,.25)}.bg-die.brown{background:#7a3f23;color:#f8f8f4;border:1px solid rgba(255,255,255,.2)}