.full-game-page { background: #fff9e9; }
.full-game-main { min-height: 100vh; padding: 132px 0 92px; color: #351108; background: radial-gradient(circle at 16% 8%, #fff9e9, transparent 32rem), #fff9e9; }
.full-game-heading { display: grid; grid-template-columns: 1.2fr .55fr; align-items: end; gap: 48px; margin-bottom: 28px; }
.full-game-heading .kicker { color: #351108; }
.full-game-heading h1 { max-width: 850px; margin: 12px 0 0; font: 500 clamp(46px,6vw,78px)/.96 var(--serif); letter-spacing: -.04em; }
.full-game-heading p { margin: 0; color: #351108; font-size: 15px; }
.full-game-table { overflow: hidden; border: 1px solid #e7cca0; border-radius: 28px; background: #fff9e9; box-shadow: 0 32px 100px rgba(0,0,0,.5); }
.full-game-bar,.full-game-footer { position: relative; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; background: #fff9e9; }
.full-game-bar>div:first-child { display: flex; align-items: center; gap: 8px; }
.full-game-bar strong { font-size: 11px; letter-spacing: .16em; }
.full-game-bar small { padding-left: 8px; border-left: 1px solid #e7cca0; color: #23724b; font-size: 8px; letter-spacing: .12em; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: #67e3a1; box-shadow: 0 0 13px #e7cca0; }
.turn-badge { display: flex; align-items: center; gap: 9px; }
.turn-badge span { color: #351108; font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.turn-badge b { padding: 7px 9px; border: 1px solid #e7cca0; border-radius: 999px; color: #67564c; font-size: 8px; }
.full-game-felt { position: relative; min-height: 650px; padding: 22px 28px 28px; background: radial-gradient(ellipse at 50% 36%, #fff9e9, #fff9e9 48%, #fff9e9 82%); box-shadow: inset 0 0 0 8px rgba(0,0,0,.12), inset 0 0 100px rgba(0,0,0,.38); }
.full-game-felt::after { content: "RUMMY CIRCLE"; position: absolute; z-index: 0; left: 50%; top: 36%; translate: -50% -50%; color: #351108; font: 700 clamp(28px,5vw,65px)/1 var(--serif); letter-spacing: .18em; white-space: nowrap; }
.game-opponent { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 66px; }
.opponent-avatar { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid #e7cca0; border-radius: 50%; color: #351108; background: #fff9e9; font-size: 10px; font-weight: 900; }
.game-opponent strong,.game-opponent small { display: block; }
.game-opponent strong { font-size: 11px; }
.game-opponent small { margin-top: 3px; color: #67564c; font-size: 8px; }
.game-opponent>b { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; color: #b72208; background: #efc65f; font-size: 9px; }
.opponent-hand { display: flex; margin-inline: 8px; }
.opponent-hand i { width: 20px; height: 29px; margin-left: -8px; border: 1px solid #e7cca0; border-radius: 3px; background: repeating-linear-gradient(45deg,#fff9e9 0 3px,#fff9e9 3px 6px); box-shadow: 0 3px 6px rgba(0,0,0,.2); }
.game-piles { position: relative; z-index: 2; display: flex; align-items: flex-start; justify-content: center; gap: 18px; min-height: 135px; padding-top: 4px; }
.game-pile { display: grid; justify-items: center; gap: 7px; }
.game-pile>small { color: #351108; font-size: 8px; }
.game-stock,.game-open-card { width: 66px; height: 93px; padding: 0; border: 0; border-radius: 8px; }
.game-stock { display: grid; place-items: center; align-content: center; border: 2px solid #e7cca0; color: #351108; background: repeating-linear-gradient(45deg,#fff9e9,#fff9e9 5px,#fff9e9 5px,#fff9e9 10px); box-shadow: 6px 5px 0 #e7cca0,9px 8px 14px rgba(0,0,0,.32); cursor: pointer; }
.game-stock span { font-size: 7px; font-weight: 800; letter-spacing: .1em; }.game-stock strong { margin-top: 3px; font-size: 10px; }.game-stock i { margin-top: 7px; color: #351108; font: normal 20px/1 var(--serif); }
.game-open-card { background: transparent; cursor: pointer; transition: transform .18s,filter .18s; }.game-open-card img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 7px 8px rgba(0,0,0,.28)); }.game-open-card:not(:disabled):hover { transform: translateY(-6px); }
.game-stock:disabled,.game-open-card:disabled { cursor: default; opacity: .7; }
.full-game-main[data-phase="draw"] .game-open-card,.full-game-main[data-phase="draw"] .game-stock { animation: gameChoice 1.2s ease-in-out infinite; }
.wild-indicator { margin: 18px 0 0 10px; padding: 8px 10px; border: 1px solid #e7cca0; border-radius: 12px; text-align: center; background: #fff9e9; }.wild-indicator span { display:block;color:#351108;font-size:6px;font-weight:900;letter-spacing:.1em; }.wild-indicator strong { display:block;margin-top:3px;color:#351108;font:700 18px/1 var(--serif); }
.game-coach { position: relative; z-index: 3; display: flex; align-items: center; gap: 11px; width: fit-content; max-width: 680px; min-height: 50px; margin: 0 auto 14px; padding: 9px 15px 9px 10px; border: 1px solid #e7cca0; border-radius: 999px; background: #fff9e9; box-shadow: 0 10px 28px rgba(0,0,0,.2); }.game-coach span { flex:none;padding:8px 9px;border-radius:999px;color:#b72208;background:#f1c65e;font-size:7px;font-weight:900;letter-spacing:.1em; }.game-coach p { margin:0;color:#351108;font-size:11px;line-height:1.45; }.game-coach strong { color:#351108; }
.player-zone { position: relative; z-index: 2; }.player-meta { display:flex;justify-content:space-between;max-width:1040px;margin:0 auto 8px;color:#351108;font-size:8px;font-weight:900;letter-spacing:.12em; }.player-meta small { letter-spacing:.03em; }
.full-game-hand { display:grid;grid-template-columns:repeat(13,minmax(0,1fr));align-items:end;gap:clamp(3px,.55vw,7px);max-width:1040px;min-height:126px;margin:auto; }
.game-card { min-width:0;padding:0;border:0;border-radius:9px;background:transparent;cursor:default;transition:transform .18s,filter .18s; }.game-card img { display:block;width:100%;aspect-ratio:3/4;object-fit:contain;filter:drop-shadow(0 8px 7px rgba(0,0,0,.3)); }.game-card.is-dealt { opacity:0;transform:translate(-190px,-170px) rotate(-10deg);animation:gameDeal .34s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--i)*55ms); }.full-game-main[data-phase="discard"] .game-card { cursor:pointer; }.full-game-main[data-phase="discard"] .game-card:hover { transform:translateY(-10px); }.game-card.is-suggested { animation:gameCardHint 1.15s ease-in-out infinite; }.game-card.is-ready { transform:translateY(-8px);filter:drop-shadow(0 0 8px rgba(255,214,102,.8)); }
.game-actions { display:flex;justify-content:center;gap:9px;margin-top:15px; }.game-actions button { min-height:42px;padding:0 16px;border:1px solid #e7cca0;border-radius:11px;color:#351108;background:#fffdf5;cursor:pointer;font-size:10px;font-weight:800; }.game-actions .declare-button { min-width:170px;color:#b72208;border-color:#e7cca0;background:#f3c557; }.game-actions .declare-button:disabled { color:#67564c;border-color:#e7cca0;background:#fffdf5;cursor:default; }
.game-result { position:absolute;z-index:10;inset:50% auto auto 50%;translate:-50% -50%;width:min(680px,calc(100% - 30px));padding:28px;border:1px solid #e7cca0;border-radius:22px;color:#351108;background:linear-gradient(145deg,#fff9e9,#fff9e9);box-shadow:0 30px 100px rgba(0,0,0,.55);text-align:center; }.game-result[hidden]{display:none}.result-confetti{color:#351108;letter-spacing:1em;font-size:18px}.result-check{display:grid;place-items:center;width:52px;height:52px;margin:14px auto;border-radius:50%;color:#23724b;background:#6de0a4;font-size:26px;font-weight:900}.game-result small{color:#23724b;font-size:8px;font-weight:900;letter-spacing:.14em}.game-result h2{margin:8px 0;color:#351108;font:600 34px/1.1 var(--serif)}.game-result p{max-width:500px;margin:0 auto;color:#351108;font-size:12px}.game-result-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:19px}.game-result-actions a,.game-result-actions button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;border:1px solid #e7cca0;border-radius:11px;color:#351108;background:transparent;cursor:pointer;font-size:10px;font-weight:850}.game-result-actions .download-game{color:#b72208;border-color:#e7cca0;background:linear-gradient(#ffdb5b,#f0b82b)}
.full-game-footer { border-top:1px solid #e7cca0;color:#67564c;font-size:9px; }.full-game-footer a{color:#351108}
@keyframes gameDeal{to{opacity:1;transform:none}}@keyframes gameChoice{50%{transform:translateY(-6px);filter:drop-shadow(0 0 8px rgba(255,214,102,.7))}}@keyframes gameCardHint{50%{transform:translateY(-10px);filter:drop-shadow(0 0 9px rgba(255,214,102,.85))}}
@media(max-width:900px){.full-game-heading{grid-template-columns:1fr;gap:16px}.full-game-felt{min-height:720px}.full-game-hand{grid-template-columns:repeat(7,minmax(0,66px));justify-content:center;gap:4px}.game-card:nth-child(n+8){margin-top:-11px}}
@media(max-width:620px){.full-game-main{padding:108px 0 100px}.full-game-heading h1{font-size:43px}.full-game-heading p{font-size:13px}.full-game-table{border-radius:19px}.full-game-bar{padding:12px}.full-game-bar small{display:none}.full-game-felt{min-height:675px;padding:13px 10px 20px}.game-opponent{justify-content:flex-start}.opponent-hand{margin-left:auto}.game-piles{min-height:126px}.game-coach{max-width:100%;border-radius:14px}.game-coach p{font-size:9px}.full-game-hand{grid-template-columns:repeat(7,minmax(0,47px));gap:2px;min-height:205px}.game-card:nth-child(n+8){margin-top:-2px}.game-actions{display:grid;grid-template-columns:.7fr 1.3fr}.game-actions button{padding:0 9px}.game-result{padding:21px 14px}.game-result h2{font-size:28px}.game-result-actions{display:grid}.full-game-footer{padding:11px 13px}}
@media(prefers-reduced-motion:reduce){.game-card.is-dealt{opacity:1;transform:none;animation:none}.full-game-main[data-phase="draw"] .game-open-card,.full-game-main[data-phase="draw"] .game-stock,.game-card.is-suggested{animation:none;outline:3px solid #e7cca0;outline-offset:3px}}