.tabletop-screen { gap: 16px; min-height: 360px; }
.tabletop-status { min-height: 20px; margin: 0; color: #d4d0df; font-size: 12px; line-height: 1.5; }
.tabletop-restart { margin-top: 5px; }
.tic-board { width: min(100%, 330px); display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.tic-cell { aspect-ratio: 1; border: 1px solid #ffffff24; border-radius: 10px; background: #302d43; color: var(--lime); cursor: pointer; font: 700 clamp(38px, 10vw, 65px) var(--display); }
.tic-cell:disabled { cursor: default; }
.tic-cell.mark-o { color: #83d8cb; }
.chess-board { width: min(100%, 520px); display: grid; grid-template-columns: repeat(8, 1fr); overflow: hidden; border: 4px solid #3c3547; border-radius: 8px; background: #f3ead9; }
.chess-square { aspect-ratio: 1; display: grid; place-items: center; padding: 0; border: 0; color: #262334; cursor: pointer; font: 400 clamp(22px, 6.3vw, 48px)/1 "Segoe UI Symbol", "Noto Sans Symbols 2", serif; }
.chess-square.is-light { background: #f3ead9; }.chess-square.is-dark { background: #9e7c68; }
.chess-square.is-selected { box-shadow: inset 0 0 0 4px var(--lime); }
.chess-square.is-legal { background-image: radial-gradient(#c7f477bb 19%, transparent 21%); }
.chess-square:focus-visible, .tic-cell:focus-visible { outline: 3px solid var(--lime); outline-offset: -3px; }
.chess-piece-black { color: #252234; text-shadow: 0 1px #fff9; }.chess-piece-white { color: #fffdf8; text-shadow: 0 1px #242033, 0 0 2px #242033; }
.patti-table { width: 100%; display: grid; gap: 14px; }
.patti-player { padding: 14px; border: 1px solid #ffffff18; border-radius: 10px; background: #191725; }
.patti-player h2 { margin: 0 0 10px; font: 600 14px var(--display); }
.patti-hand { display: flex; justify-content: center; gap: 8px; }
.playing-card { width: 69px; min-height: 98px; display: grid; align-content: space-between; justify-items: start; padding: 8px; border: 1px solid #ffffffad; border-radius: 8px; background: #fffdf6; color: #25213a; text-align: left; box-shadow: 0 4px 10px #05040b40; }
.playing-card strong { font: 700 18px var(--display); }.playing-card span { justify-self: end; font-size: 22px; }
.playing-card.is-red { color: #d64453; }.playing-card.is-hidden { place-items: center; background: linear-gradient(135deg, #7164e9, #39325e); color: white; font-size: 27px; }
.hand-result { margin: 10px 0 0; color: var(--lime); font-size: 10px; }
.uno-table { display: grid; width: 100%; gap: 15px; }
.uno-meta { display: flex; justify-content: space-between; gap: 12px; color: #d5d1df; font-size: 11px; }
.uno-top-cards { display: flex; justify-content: center; gap: 12px; }
.uno-card { min-width: 54px; min-height: 77px; padding: 7px; border: 2px solid #ffffffd9; border-radius: 10px; background: #f8f5ed; color: #25213a; cursor: pointer; font: 700 13px var(--display); box-shadow: 0 5px 12px #08071145; }
.uno-card:disabled { cursor: default; opacity: .55; }
.uno-card.uno-red { background: #e95468; color: white; }.uno-card.uno-blue { background: #4f8de5; color: white; }.uno-card.uno-green { background: #38a779; color: white; }.uno-card.uno-yellow { background: #eac448; color: #28233c; }.uno-card.uno-wild { background: linear-gradient(135deg, #e95468 0 25%, #eac448 25% 50%, #38a779 50% 75%, #4f8de5 75%); color: white; text-shadow: 0 1px #302d43; }
.uno-hand { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; }
.uno-hand .uno-card { min-width: 47px; min-height: 68px; }
.uno-controls { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.uno-controls .game-button { min-height: 39px; padding-inline: 16px; font-size: 11px; }
.uno-note { margin: 0; color: #aaa7b6; font-size: 10px; line-height: 1.5; }
.tambola-wrap { width: 100%; display: grid; gap: 14px; }
.tambola-call { display: flex; align-items: center; justify-content: center; gap: 13px; color: #aaa7b6; font: 9px var(--mono); }
.tambola-call strong { width: 58px; height: 58px; display: grid; place-items: center; border: 2px solid var(--lime); border-radius: 50%; color: var(--lime); font: 700 26px var(--display); }
.tambola-ticket { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 3px; padding: 7px; border: 1px solid #ffffff26; border-radius: 8px; background: #171522; }
.tambola-cell { min-width: 0; aspect-ratio: 1; display: grid; place-items: center; border: 1px solid #ffffff21; border-radius: 4px; background: #302d43; color: #f2eef7; font: 600 clamp(9px, 2.7vw, 16px) var(--display); }
.tambola-cell.is-blank { border-color: transparent; background: transparent; }
.tambola-cell.is-called { background: var(--lime); color: #25213a; }
.tambola-controls { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.tambola-controls .game-button, .tambola-claim { min-height: 39px; padding-inline: 14px; font-size: 10px; }
.tambola-claims { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.tambola-claim { border: 1px solid #ffffff35; border-radius: 24px; background: transparent; color: #d4d0df; cursor: pointer; }
.tambola-claim:disabled { opacity: .42; cursor: default; }
.tambola-claim.is-won { border-color: var(--lime); color: var(--lime); }
.tambola-history { margin: 0; color: #aaa7b6; font-size: 10px; line-height: 1.7; }
.tambola-mode-picker, .tambola-room-entry { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.tambola-mode-picker .game-button, .tambola-room-entry .game-button, .tambola-room-end { min-height: 40px; padding-inline: 15px; font-size: 10px; }
.tambola-room-setup, .tambola-room { width: 100%; display: grid; gap: 10px; }
.tambola-room-setup label, .tambola-room-share label { color: #d4d0df; font-size: 11px; text-align: center; }
.tambola-room-setup[hidden], .tambola-room[hidden], .tambola-room-share[hidden] { display: none; }
.tambola-room-entry input { min-width: 0; width: min(100%, 260px); min-height: 40px; padding: 8px 12px; border: 1px solid #ffffff35; border-radius: 8px; background: #171522; color: var(--paper); font-size: 12px; }
.tambola-room-setup > p { min-height: 16px; margin: 0; color: #aaa7b6; font-size: 10px; text-align: center; }
.tambola-room-status { min-height: 16px; margin: 0; color: #aaa7b6; font-size: 10px; line-height: 1.5; text-align: center; }
.tambola-room-status:empty { display: none; }
.tambola-room-code { margin: 0; color: var(--lime); font: 700 13px var(--mono); text-align: center; }
.tambola-room-end { justify-self: center; border: 1px solid #ffffff35; border-radius: 24px; background: transparent; cursor: pointer; }
.tambola-room-end:hover { border-color: #f58c94; color: #f58c94; }
@media (max-width: 520px) {
  .tabletop-screen { padding: 16px; }
  .playing-card { width: 57px; min-height: 83px; }
  .patti-player { padding: 9px; }
  .tambola-ticket { gap: 2px; padding: 4px; }
}