html,body { margin:0; width:100%; height:100%; overflow:hidden; font-family:var(--gn-font-ui,system-ui,-apple-system,"Segoe UI",sans-serif); line-height:1.5; }
body { background:var(--gn-linen,#e6d4b7); }
#blazor-error-ui { display:none; position:fixed; z-index:10000; inset:auto 0 0; background:#fff4c7; color:#302b24; padding:16px; }
.tabletop-boot { display:grid; place-items:center; place-content:center; gap:8px; min-height:100dvh; text-align:center; color:#302b24; }
.tabletop-boot img { width:72px; height:72px; }
.tabletop-boot strong { font:40px Georgia,serif; }
.tabletop-boot p { font-size:18px; }
.tabletop-entry-links { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.tabletop-entry-links a { min-height:48px; display:flex; align-items:center; padding:0 4px; color:#285c46; font-size:16px; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.tabletop-entry-links > span { display:none; color:var(--tt-muted,#6a5b48); font-size:14px; }
.tabletop-shell {
    --tt-ink: var(--gn-ink,#302b24); --tt-muted: var(--gn-muted,#6a5b48); --tt-paper: var(--gn-paper,#fff9ec);
    --tt-border: var(--gn-line,#d7c9b0); --tt-accent: var(--gn-felt,#285c46); --tt-shadow: 0 10px 28px #493c2520;
    position: fixed; inset: 0; z-index: 100; height: 100dvh; overflow: hidden;
    color: var(--tt-ink); background: var(--gn-linen,#e6d4b7);
    background-image: repeating-linear-gradient(96deg, transparent 0 97px, #79634409 98px 99px);
    font-family: var(--gn-font-ui,system-ui,-apple-system,"Segoe UI",sans-serif);
    padding: max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
    box-sizing: border-box;
}
.tabletop-shell * { box-sizing: border-box; }
.tabletop-content { width: min(100%, 430px); height: 100%; margin: auto; display: flex; flex-direction: column; gap: 18px; }
.tabletop-brand { display:flex; align-items:center; gap:11px; min-width:max-content; color:var(--tt-ink); }
.tabletop-brand-mark { display:block; width:40px; height:40px; flex:0 0 40px; }
.tabletop-brand-copy { display:flex; flex-direction:column; align-items:flex-start; gap:3px; }
.tabletop-brand-wordmark { display:flex; align-items:baseline; letter-spacing:-.8px; line-height:1; }
.tabletop-brand-wordmark > span { font-family:var(--gn-font-display,Georgia,"Times New Roman",serif); font-size:23px; font-weight:700; }
.tabletop-brand-wordmark > strong { color:var(--tt-accent); font-size:21px; font-weight:780; }
.tabletop-studio-credit { color:var(--tt-muted,#6a5b48); font-size:12px; font-weight:700; line-height:1; text-decoration:none; }
.tabletop-studio-credit:hover,.tabletop-studio-credit:focus-visible { color:var(--tt-accent); text-decoration:underline; text-underline-offset:2px; }
.tabletop-lobby-header { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.tabletop-sister-link { display:flex; align-items:center; gap:7px; min-height:44px; padding:7px 11px; border:1px solid #bba98d; border-radius:999px; color:var(--tt-ink); background:#fff9ecb8; text-decoration:none; }
.tabletop-sister-link > span:first-child { display:none; }
.tabletop-sister-link strong { color:var(--tt-accent); font-size:13px; }
.tabletop-sister-link > span:last-child { color:var(--tt-accent); font-size:15px; }
.tabletop-welcome { text-align: center; margin: auto 0 0; }
.tabletop-eyebrow { font-size: 13px; line-height: 1.4; font-weight: 750; letter-spacing: 1.6px; color: var(--tt-muted); }
.tabletop-shell h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(30px, 8.5vw, 40px); line-height: 1.08; font-weight: 500; letter-spacing: -1.4px; margin: 14px 0; }
.tabletop-shell h2 { font-size: 19px; line-height: 1.2; font-weight: 700; margin: 0; }
.tabletop-shell p { font-size: var(--gn-controller-body,16px); line-height: 1.45; color: var(--tt-muted); margin: 12px 0 0; }
.tabletop-welcome-lead { max-width:40rem; }
.tabletop-play-modes { display:none; }
.tabletop-entry-intro { display:none; }
.tabletop-panel { border: 1px solid var(--tt-border); border-radius: 18px; padding: 20px; background: var(--tt-paper); box-shadow: var(--tt-shadow); }
.tabletop-entry { margin: 2px 0 auto; }
.tabletop-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; background: #ebe3d4; border-radius: 12px; margin-bottom: 18px; }
.tabletop-shell button { cursor: pointer; font: inherit; font-size: var(--gn-controller-action,16px); font-weight: 700; border: 1px solid var(--tt-border); min-height: 48px; border-radius: 10px; padding: 10px 14px; background: var(--tt-paper); color: var(--tt-ink); }
.tabletop-tabs button { border: 0; background: transparent; }
.tabletop-tabs button[aria-pressed=true] { background: var(--tt-paper); box-shadow: 0 2px 5px #493c2520; }
.tabletop-shell button:focus-visible, .tabletop-shell input:focus-visible { outline: 3px solid #ac632b; outline-offset: 3px; }
.tabletop-shell button:disabled { cursor: default; opacity: .6; }
.tabletop-shell label { display: block; font-size: var(--gn-controller-body,16px); font-weight: 700; margin: 14px 0 7px; }
.tabletop-shell input { display: block; width: 100%; min-height: 50px; padding: 10px 13px; font: inherit; font-size: 16px; border: 1px solid #b4a68e; border-radius: 9px; color: var(--tt-ink); background: #fffefa; }
.tabletop-shell .tabletop-code-input { text-transform: uppercase; letter-spacing: 9px; font-weight: 750; font-size: 23px; }
.tabletop-shell .tabletop-primary { display: flex; justify-content: center; align-items: center; gap: 20px; width: 100%; min-height: 54px; color: white; background: var(--tt-accent); border-color: var(--tt-accent); font-size: 16px; }
.tabletop-entry .tabletop-primary { margin-top: 20px; }
.tabletop-footer { text-align: center; color: var(--tt-muted); font-size: 12px; }
.tabletop-room-heading, .tabletop-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tabletop-room-heading h1 { letter-spacing: 7px; font-size: 38px; margin: 6px 0 0; }
.tabletop-room-state { padding: 8px 12px; border: 1px solid #bfb194; border-radius: 40px; font-size: 12px; }
.tabletop-section-heading span { font-size: 12px; white-space: nowrap; color: var(--tt-muted); }
.tabletop-roster { list-style: none; padding: 0; margin: 14px 0 0; }
.tabletop-roster li { display: flex; align-items: center; gap: 10px; min-height: 48px; border-top: 1px solid #e6ddcb; }
.tabletop-token { flex: 0 0 30px; height: 30px; display: grid; place-items: center; background: #ddd1b7; border: 1px solid #c6b695; border-radius: 50%; font-weight: 750; font-size: 14px; box-shadow: 0 2px #b7a98e; }
.tabletop-player-name { font-size: 14px; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.tabletop-player-status { margin-left: auto; font-size: 12px; color: var(--tt-muted); white-space: nowrap; }
.tabletop-waiting { margin-top: auto; text-align: center; padding: 22px 16px; }
.tabletop-waiting h2 { font-family: Georgia, serif; font-size: 26px; font-weight: 500; margin-top: 8px; }
.tabletop-pagination { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; font-size: 12px; }
.tabletop-error { padding: 12px 14px; border: 1px solid #b56f56; border-radius: 10px; background: #fff5ed; color: #71351f; font-size: 14px; line-height: 1.3; }
.tabletop-waiting .tabletop-primary { margin-top: 16px; }
.tabletop-game-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tabletop-game-heading h1 { font-size: 32px; margin: 4px 0 0; }
.tabletop-unus-context { display: flex; align-items: center; gap: 14px; padding: 14px; }
.tabletop-unus-context p { font-size: 13px; line-height: 1.35; margin-top: 6px; }
.tabletop-discard { flex: 0 0 78px; min-height: 100px; border: 3px solid var(--card-color, #776b59); border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 7px; text-align: center; }
.tabletop-discard span { font-size: 12px; }
.tabletop-discard strong { font-size: 24px; line-height: 1.1; overflow-wrap: anywhere; }
.tabletop-card-red { --card-color: #a24036; }
.tabletop-card-blue { --card-color: #355d90; }
.tabletop-card-green { --card-color: #336246; }
.tabletop-card-yellow { --card-color: #9a6a0b; }
.tabletop-card-gray { --card-color: #726657; }
.tabletop-hand { padding: 14px; min-height: 0; }
.tabletop-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 12px; }
.tabletop-shell .tabletop-playing-card { border: 2px solid var(--card-color); border-top-width: 6px; padding: 7px 4px; border-radius: 10px; min-height: 108px; display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: 4px; text-align: center; }
.tabletop-shell .tabletop-playing-card:disabled { opacity: 1; background: #e9e2d5; color: #685c4d; }
.tabletop-playing-card strong { font-size: 16px; line-height: 1.15; }
.tabletop-card-color, .tabletop-card-hint { font-size: 12px; font-weight: 500; line-height: 1.1; }
.tabletop-action-bar { margin-top: auto; display: flex; gap: 10px; }
.tabletop-action-bar > button { flex: 1; }
.tabletop-choice-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.tabletop-modal { width: min(410px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow: auto; border: 1px solid #b4a68e; border-radius: 18px; padding: 20px; color: var(--tt-ink); background: var(--tt-paper); }
.tabletop-modal::backdrop { background: #211a11a8; }
.tabletop-modal-body { margin-top: 20px; }
.tabletop-modal-body h2 { margin-top: 20px; }
.tabletop-modal-body li { font-size: 14px; margin-top: 10px; }
.tabletop-modal-body .tabletop-primary { margin-top: 18px; }
.tabletop-scores, .tabletop-results ol { list-style: none; padding: 0; margin: 12px 0; }
.tabletop-scores li, .tabletop-results li { display: flex; flex-direction: column; padding: 8px 0; border-bottom: 1px solid #d7c9b0; }
.tabletop-scores span { font-size: 13px; }
.tabletop-results li { flex-direction: row; justify-content: space-between; }
.tabletop-rotate { display: none; }
.tabletop-game-picker { padding: 14px; }
.tabletop-game-picker h2 { margin-top: 0; }
.tabletop-game-options { display: grid; gap: 8px; margin: 10px 0; }
.tabletop-game-options button { min-height: 48px; }
.tabletop-spoons-context { padding: 14px; }
.tabletop-spoons-context p { font-size: 14px; margin-top: 8px; }
.tabletop-spoon-tokens { display: flex; justify-content: center; gap: 18px; margin: 20px 0 8px; }
.tabletop-spoon-token { display: block; position: relative; height: 90px; width: 22px; flex-shrink: 0; }
.tabletop-spoon-token::before { content: ''; position: absolute; width: 24px; height: 35px; border-radius: 50%; background: #b8834e; border: 2px solid #79522f; box-shadow: inset 2px 3px 4px #80502866; }
.tabletop-spoon-token::after { content: ''; position: absolute; width: 9px; height: 58px; border-radius: 0 0 8px 8px; background: #b8834e; border: 2px solid #79522f; left: 8px; top: 31px; border-top: none; }
.tabletop-mode-screen .tabletop-spoon-tokens { margin: 32px 0; gap: 24px; }
.tabletop-grab-spoon { min-height: 70px !important; }
.tabletop-shell input[type=checkbox] { width: 20px; height: 20px; min-height: 20px; display: inline-block; margin: 0 10px 0 0; vertical-align: middle; }
.tabletop-modal label:has(input[type=checkbox]) { min-height: 44px; display: flex; align-items: center; }
.tabletop-yacht-dice, .tabletop-yacht-sheet { padding: 14px; }
.tabletop-yacht-dice h2 { font-size: 21px; overflow-wrap: anywhere; }
.tabletop-yacht-dice p, .tabletop-yacht-sheet p { font-size: 14px; margin-top: 8px; }
.tabletop-dice { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 14px 0; }
.tabletop-dice button { padding: 5px; background: #fffdf6; border-bottom: 3px solid #b7a890; display: flex; flex-direction: column; align-items: center; }
.tabletop-dice strong { font-size: 30px; }
.tabletop-dice small { font-size: 12px; }
.tabletop-dice button[aria-pressed=true] { outline: 3px solid var(--tt-accent); background: #e2ebdd; }
.tabletop-yacht-categories { margin: 10px 0; display: grid; gap: 5px; }
.tabletop-yacht-categories button { display: flex; justify-content: space-between; min-height: 44px; padding: 8px 12px; }
.tabletop-whist-context, .tabletop-whist-hand { padding: 14px; }
.tabletop-whist-context p, .tabletop-whist-hand p { font-size: 14px; margin: 8px 0 0; }
.tabletop-whist-context h2 { font-size: 19px; overflow-wrap: anywhere; }
.tabletop-whist-context .tabletop-section-heading > span { flex-shrink: 0; }
.tabletop-playing-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; margin: 14px 0; }
.tabletop-playing-cards button { padding: 5px 1px; min-height: 80px; display: flex; flex-direction: column; justify-content: center; align-items: center; background: #fffdf6; border-bottom: 3px solid #b7a890; }
.tabletop-playing-cards button strong { font-size: 21px; }
.tabletop-playing-cards button span { font-size: 23px; }
.tabletop-playing-cards button.is-red { color: #a1282b; }
.tabletop-shell .tabletop-playing-cards button:disabled { opacity: 1; }
.tabletop-playing-cards button[aria-pressed=true] { outline: 3px solid var(--tt-accent); }
.tabletop-trick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.tabletop-trick > div { padding: 6px; border: 1px solid var(--tt-border); border-radius: 6px; background: #fffdf6; min-width: 0; flex: 1 1 65px; }
.tabletop-trick strong { display: block; font-size: 19px; }
.tabletop-trick span { display: block; font-size: 12px; overflow-wrap: anywhere; }
.tabletop-whist-choice { display: grid; grid-template-columns: 1fr 1.6fr; gap: 8px; }
.tabletop-whist-choice label { grid-column: 1 / -1; margin: 0; }
.tabletop-whist-results .tabletop-final-ranking li { padding: 8px 0; }
.tabletop-mode-screen .tabletop-trick { width: 100%; }
.tabletop-mode-screen .tabletop-trick strong { font-size: 24px; }
.tabletop-secondary-game { width: 100%; margin-top: 10px; }
.tabletop-shell select { width: 100%; min-height: 48px; border-radius: 8px; border: 1px solid var(--tt-border); font: inherit; font-size: 16px; padding: 10px; background: #fffefa; }
.tabletop-poker-context { padding: 14px; }
.tabletop-poker-context p { font-size: 14px; margin-top: 6px; }
.tabletop-community { display: flex; gap: 10px; margin-top: 12px; }
.tabletop-letter-token { display: grid; place-items: center; width: 45px; height: 45px; background: #e8d9b9; border: 1px solid #bba983; border-radius: 8px; font-size: 24px; font-weight: 700; box-shadow: 0 3px #bba983; }
.tabletop-tile-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 14px 0; }
.tabletop-tile-grid button { padding: 6px; min-height: 57px; background: #f3e7ca; display: flex; align-items: center; justify-content: center; gap: 6px; border-bottom-width: 3px; }
.tabletop-tile-grid button strong { font-size: 24px; }
.tabletop-tile-grid button small { font-size: 12px; }
.tabletop-tile-grid button[aria-pressed=true] { outline: 3px solid var(--tt-accent); outline-offset: 0; }
.tabletop-tile-grid button.is-committed { background: #d8d1c4; }
.tabletop-poker-hand { padding: 14px; }
.tabletop-poker-hand label { font-size: 14px; }
.tabletop-poker-hand .tabletop-primary { margin-top: 12px; }
.tabletop-secondary-actions { display: flex; gap: 12px; }
.tabletop-secondary-actions button { flex: 1; }
.tabletop-campaign-final { margin-top: 14px; }
.tabletop-campaign-final h2 { font: 36px Georgia, serif; margin: 14px 0; }
.tabletop-final-ranking { list-style: none; padding: 0; }
.tabletop-final-ranking li { display: flex; justify-content: space-between; padding: 12px 0; font-size: 16px; border-bottom: 1px solid var(--tt-border); }
.tabletop-mode-screen { padding: 32px; }
.tabletop-mode-screen .tabletop-content { width: min(1800px, 100%); gap: 26px; }
.tabletop-mode-screen p, .tabletop-mode-screen span, .tabletop-mode-screen label, .tabletop-mode-screen input, .tabletop-mode-screen select, .tabletop-mode-screen button { font-size: var(--gn-tv-body,clamp(24px,1.65vw,32px)); }
.tabletop-mode-screen h1 { font-size: var(--gn-tv-heading,clamp(40px,4vw,64px)); }
.tabletop-mode-screen h2 { font-size: var(--gn-tv-subheading,clamp(32px,2.6vw,46px)); }
.tabletop-display-header { display: flex; justify-content: space-between; align-items: center; }
.tabletop-brand-display .tabletop-brand-mark { width:64px; height:64px; flex-basis:64px; }
.tabletop-brand-display .tabletop-brand-wordmark > span { font-size:var(--gn-tv-brand,clamp(34px,2.8vw,48px)); }
.tabletop-brand-display .tabletop-brand-wordmark > strong { font-size:clamp(32px,2.6vw,45px); }
.tabletop-display-entry { width: min(800px, 100%); margin: auto; text-align: center; }
.tabletop-display-entry form { max-width: 430px; margin: 24px auto 0; }
.tabletop-display-entry .tabletop-primary { margin-top: 20px; }
.tabletop-display-game { display: grid; grid-template-columns: .9fr 1.4fr; gap: 26px; min-height: 0; flex: 1; }
.tabletop-display-focus { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.tabletop-display-focus .tabletop-discard { flex: none; width: 120px; min-height: 150px; margin: 12px; }
.tabletop-display-focus .tabletop-discard strong { font-size: 36px; }
.tabletop-display-scores ol { padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 26px 0 0; }
.tabletop-display-scores li { min-width: 0; display: flex; flex-direction: column; gap: 4px; padding: 14px; border: 1px solid var(--tt-border); border-radius: 12px; }
.tabletop-display-scores li.is-active { border: 3px solid var(--tt-accent); padding: 12px; }
.tabletop-display-scores strong { font-size: 28px; overflow-wrap: anywhere; }
.tabletop-display-welcome { text-align: center; margin: auto 0; }
.tabletop-display-names { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin: 32px 0; }
.tabletop-display-names span { padding: 12px; border-radius: 14px; background: #ebe3d4; overflow-wrap: anywhere; }
@media (min-width: 960px) and (min-height: 620px) {
    .tabletop-mode-lobby { padding: clamp(28px,4vh,44px) clamp(42px,5vw,80px) clamp(22px,3vh,34px); }
    .tabletop-mode-lobby .tabletop-content { width:min(1320px,100%); display:grid; grid-template-columns:minmax(0,1.35fr) minmax(400px,460px); grid-template-rows:auto minmax(0,1fr) auto; column-gap:clamp(58px,7vw,112px); row-gap:clamp(20px,3vh,34px); }
    .tabletop-mode-lobby .tabletop-content > header { grid-column: 1 / -1; }
    .tabletop-mode-lobby .tabletop-brand-mark { width:56px; height:56px; flex-basis:56px; }
    .tabletop-mode-lobby .tabletop-brand-wordmark > span { font-size:32px; }
    .tabletop-mode-lobby .tabletop-brand-wordmark > strong { font-size:29px; }
    .tabletop-mode-lobby .tabletop-studio-credit { font-size:12px; }
    .tabletop-sister-link { padding:9px 16px; border-radius:16px; box-shadow:0 7px 18px #493c2512; }
    .tabletop-sister-link > span:first-child { display:inline; color:var(--tt-muted); font-size:14px; }
    .tabletop-sister-link strong { font-size:15px; }
    .tabletop-welcome { text-align:left; align-self:center; margin:0; max-width:760px; }
    .tabletop-mode-lobby .tabletop-welcome h1 { max-width:10ch; margin:16px 0 14px; font-size:clamp(54px,4.6vw,72px); line-height:.98; letter-spacing:-2.7px; }
    .tabletop-welcome-lead { max-width:660px; margin-top:0!important; color:#514332!important; font-size:clamp(18px,1.35vw,21px)!important; line-height:1.48!important; }
    .tabletop-play-modes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:clamp(24px,3.5vh,34px); }
    .tabletop-play-modes article { display:flex; align-items:flex-start; gap:11px; min-height:118px; padding:16px 14px; border:1px solid #cdbb9d; border-radius:16px; background:#fff9ece6; box-shadow:0 8px 20px #493c2512; }
    .tabletop-mode-icon { display:grid; place-items:center; flex:0 0 35px; width:35px; height:35px; border-radius:10px; color:#fff; background:var(--tt-accent); font-size:20px; font-weight:800; }
    .tabletop-play-modes article:nth-child(2) .tabletop-mode-icon { background:var(--gn-ember,#b85c38); }
    .tabletop-play-modes article:nth-child(3) .tabletop-mode-icon { color:var(--tt-ink); background:var(--gn-marigold,#d49a32); }
    .tabletop-play-modes article strong { display:block; margin:1px 0 5px; font-size:16px; }
    .tabletop-play-modes article div > span { display:block; color:var(--tt-muted); font-size:14px; line-height:1.34; }
    .tabletop-entry { align-self:center; margin:0; padding:clamp(24px,2.4vw,30px); border-radius:24px; box-shadow:0 20px 50px #493c2528; }
    .tabletop-entry-intro { display:block; margin-bottom:20px; }
    .tabletop-entry-intro h2 { margin:5px 0 0; font-family:var(--gn-font-display,Georgia,serif); font-size:30px; font-weight:600; }
    .tabletop-entry-intro p { margin-top:4px; font-size:15px; }
    .tabletop-entry-links { grid-column:1 / -1; min-height:50px; padding-right:58px; border-top:1px solid #8f765a38; }
    .tabletop-entry-links > span { display:block; margin-left:auto; margin-right:auto; }
}
@media (max-height: 740px) {
    .tabletop-shell { padding-top: 12px; padding-bottom: 12px; }
    .tabletop-content { gap: 12px; }
    .tabletop-shell h1 { margin: 8px 0; font-size: 30px; }
    .tabletop-welcome p { margin-top: 6px; }
    .tabletop-panel { padding: 14px; }
    .tabletop-tabs { margin-bottom: 8px; }
    .tabletop-shell label { margin-top: 8px; }
    .tabletop-entry .tabletop-primary { margin-top: 14px; }
}
@media (min-width: 960px) and (min-height: 620px) and (max-height: 740px) {
    .tabletop-mode-lobby { padding-top: 18px; padding-bottom: 14px; }
    .tabletop-mode-lobby .tabletop-content { row-gap: 14px; }
    .tabletop-mode-lobby .tabletop-welcome h1 { margin: 10px 0; font-size: clamp(48px,4.3vw,64px); }
    .tabletop-mode-lobby .tabletop-welcome-lead { margin-top: 0; }
    .tabletop-mode-lobby .tabletop-play-modes { margin-top: 18px; }
    .tabletop-mode-lobby .tabletop-play-modes article { min-height: 104px; padding: 13px 12px; }
    .tabletop-mode-lobby .tabletop-entry { padding: 22px 24px; }
}
@media (orientation: landscape) {
    .tabletop-mode-controller .tabletop-content { visibility: hidden; }
    .tabletop-mode-controller .tabletop-rotate { display: flex; }
}
@media (orientation: portrait) {
    .tabletop-mode-screen .tabletop-content { visibility: hidden; }
    .tabletop-mode-screen .tabletop-rotate { display: flex; }
}
.tabletop-rotate { position: absolute; inset: 0; flex-direction: column; align-items: center; justify-content: center; padding: 30px; text-align: center; }
.tabletop-rotate-icon { font-size: 56px; color: var(--tt-accent); }
@media (prefers-reduced-motion: reduce) { .tabletop-shell *, .tabletop-shell *::before, .tabletop-shell *::after { animation: none !important; transition: none !important; } }

.tabletop-prompt-context { padding: 14px; }
.tabletop-prompt-context p { font-size: 16px; margin-top: 8px; }
.tabletop-prompt-choices { padding: 14px; }
.tabletop-prompt-choices > button { display: flex; flex-direction: column; justify-content: center; width: 100%; min-height: 72px; margin-top: 10px; text-align: left; line-height: 1.4; }
.tabletop-prompt-choices > button:disabled { opacity: 1; }
.tabletop-prompt-choices small { font-size: 12px; display: block; margin-top: 6px; color: var(--tt-muted); }
.tabletop-prompt-context + section .tabletop-primary { margin-top: 12px; }
.tabletop-shell .tabletop-prompt-status { font-size: 14px; margin: 0; }
.tabletop-display-prompt { font-size: 30px !important; }
.tabletop-display-choices { display: flex; flex-direction: column; gap: 20px; }
.tabletop-display-choices p { font-size: 26px; background: #eee4d3; border-radius: 12px; padding: 18px; margin: 0; }

.tabletop-canvas-wrap { min-width: 0; position: relative; }
.tabletop-modal-heading { display: grid; grid-template-columns: minmax(0, 1fr) 44px auto; align-items: center; gap: 8px; }
.tabletop-modal-heading h2 { min-width: 0; overflow-wrap: anywhere; }
.tabletop-modal-heading button { min-width: 44px; min-height: 44px; padding: 8px; }
.tabletop-canvas-status { position: absolute; inset: 0; border-radius: 12px; padding: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--paper, #fffaf0); color: var(--ink, #29221b); text-align: center; }
.tabletop-canvas { display: block; width: 100%; aspect-ratio: 8 / 5; height: auto; max-height: 240px; background: white; border: 2px solid var(--tt-border); border-radius: 12px; touch-action: none; }
.tabletop-small-canvas .tabletop-canvas { max-height: 160px; object-fit: contain; }
.tabletop-drawing-tools, .tabletop-drawing-actions { display: flex; gap: 8px; margin-top: 8px; }
.tabletop-drawing-tools button { flex: 1; min-width: 0; padding: 8px; }
.tabletop-drawing-actions .tabletop-primary { flex: 1; }
.tabletop-drawing-context { padding: 14px; }
.tabletop-drawing-context p { margin-top: 8px; font-size: 15px; line-height: 1.35; }
.tabletop-drawing-context .tabletop-primary { margin-top: 12px; }
.tabletop-pen-colors { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.tabletop-handoff h2 { margin-top: 18px; font-size: 26px; }
.tabletop-handoff .tabletop-primary { margin-top: 24px; }
.tabletop-mode-screen .tabletop-canvas { max-height: 470px; }

.tabletop-quiz-clues { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.tabletop-quiz-clue { background:var(--paper,#fffaf0); border:1px solid #dac5a7; border-radius:12px; padding:8px; text-align:center; min-width:0; }
.tabletop-quiz-clue p { font-size:14px; margin:0 0 8px; }
.tabletop-quiz-clue img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; filter:invert(1); border-radius:8px; }
.tabletop-quiz-clue strong { display:grid; place-items:center; min-height:70px; font-size:18px; overflow-wrap:anywhere; }
.tabletop-buzz { min-height:76px; font-size:20px; }
.tabletop-mode-screen .tabletop-quiz-clues { gap:16px; margin-top:24px; }
.tabletop-mode-screen .tabletop-quiz-clue { padding:16px; }
.tabletop-mode-screen .tabletop-quiz-clue p,.tabletop-mode-screen .tabletop-quiz-clue strong { font-size:clamp(24px,2vw,36px); }
.tabletop-mode-screen .tabletop-quiz-clue img { max-height:320px; }
.tabletop-choice { display:block; width:100%; margin:8px 0; }

.tabletop-meld-status { padding:12px; }
.tabletop-meld-status h2 { font-size:17px; }
.tabletop-meld-status p { font-size:14px; margin-top:6px; }
.tabletop-meld-scores { display:flex; justify-content:space-between; gap:8px; margin-top:8px; }
.tabletop-meld-scores strong { font-size:12px; }
.tabletop-meld-board { display:grid; gap:6px; min-height:0; }
.tabletop-shell .tabletop-meld-tile { min-width:0; display:flex; align-items:center; gap:8px; min-height:52px; padding:6px 8px; text-align:left; }
.tabletop-meld-tile:disabled { opacity:1 !important; }
.tabletop-meld-tile strong { font-size:14px; overflow-wrap:anywhere; flex:1; }
.tabletop-meld-tile img { height:36px; width:36px; object-fit:contain; }
.tabletop-meld-tile .tabletop-meld-index { font-size:12px; min-width:18px; }
.tabletop-meld-tile .tabletop-meld-role { font-size:12px; min-width:52px; text-transform:capitalize; }
.tabletop-meld-tile[data-role=red] { background:#984336; color:white; border-color:#984336; }
.tabletop-meld-tile[data-role=blue] { background:#345f85; color:white; border-color:#345f85; }
.tabletop-meld-tile[data-role=neutral] { background:#decbaa; color:#302b24; }
.tabletop-meld-tile[data-role=killer] { background:#302b24; color:white; border-color:#302b24; }
.tabletop-meld-tile[data-role=red] img,.tabletop-meld-tile[data-role=blue] img,.tabletop-meld-tile[data-role=killer] img { filter:invert(1); }
.tabletop-meld-preview { display:block; max-width:220px; width:100%; max-height:220px; object-fit:contain; margin:16px auto; }
.tabletop-meld-options label { display:flex; align-items:center; gap:8px; min-height:44px; margin:0; }
.tabletop-meld-display { display:flex; flex-direction:column; gap:12px; flex:1; min-height:0; }
.tabletop-meld-display-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; }
.tabletop-meld-display-heading h1 { font-size:38px; margin:0; }
.tabletop-meld-display-heading p { font-size:24px; margin-top:6px; }
.tabletop-meld-display-heading strong { display:block; font-size:24px; }
.tabletop-meld-board.is-display { flex:1; grid-template-columns:repeat(5,minmax(0,1fr)); grid-template-rows:repeat(5,minmax(0,1fr)); gap:8px; }
.tabletop-meld-board.is-display.has-images { grid-template-rows:repeat(2,minmax(0,1fr)); }
.tabletop-meld-board.is-display .tabletop-meld-tile { flex-direction:column; justify-content:center; gap:4px; text-align:center; min-height:0; }
.tabletop-meld-board.is-display .tabletop-meld-tile strong { flex:0; font-size:24px; line-height:1.1; }
.tabletop-meld-board.is-display .tabletop-meld-index { display:none; }
.tabletop-meld-board.is-display .tabletop-meld-role { font-size:24px; }
.tabletop-meld-board.is-display .tabletop-meld-tile img { width:90px; height:90px; }
.tabletop-meld-display .tabletop-meld-page { font-size:24px; margin:0; }

.tabletop-poke-status { padding: 12px; }
.tabletop-poke-status h2 { font-size: 17px; margin-bottom: 6px; }
.tabletop-poke-status p { font-size: 14px; margin-bottom: 6px; }
.tabletop-poke-status > span { font-size: 12px; }
.tabletop-poke-community { padding: 10px 12px; }
.tabletop-poke-community h2 { font-size: 14px; margin: 0 0 8px; }
.tabletop-poke-community > div { display: flex; gap: 6px; }
.tabletop-poke-community > div > span { display: flex; align-items: center; justify-content: center; gap: 4px; flex: 1; min-height: 44px; border: 1px solid var(--tabletop-line); border-radius: 7px; background: #fffdf8; font-size: 18px; }
.tabletop-poke-community .is-red, .tabletop-poke-display-cards .is-red { color: #983c31; }
.tabletop-poke-actions, .tabletop-poke-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tabletop-poke-results { padding: 12px; }
.tabletop-poke-results h2 { font-size: 17px; }
.tabletop-poke-results .tabletop-final-ranking { margin: 8px 0; }
.tabletop-poke-return { font-size: 14px; margin: 0; }
.tabletop-poke-display-cards { display: flex; flex-wrap: wrap; gap: 10px; }
.tabletop-poke-display-cards > span { display: flex; align-items: center; justify-content: center; gap: 8px; min-width: 72px; min-height: 86px; padding: 8px; border: 1px solid #d3bfa0; border-radius: 8px; background: #fffdf8; font-size: 30px; }

.tabletop-city-map { margin: 0; min-width: 0; }
.tabletop-city-map svg { display: block; width: 100%; max-height: 180px; border-radius: 12px; }
.tabletop-city-map figcaption { margin-top: 7px; color: var(--tt-muted); font-size: 12px; line-height: 1.3; }
.tabletop-mode-screen .tabletop-city-map svg { max-height: 460px; }
.tabletop-mode-screen .tabletop-city-map figcaption { font-size: 24px; }
.tabletop-mogul-status, .tabletop-mogul-draft, .tabletop-mogul-turn, .tabletop-mogul-standing { padding: 10px 12px; }
.tabletop-mogul-status h2, .tabletop-mogul-draft h2, .tabletop-mogul-turn h2 { font-size: 17px; margin: 0 0 5px; }
.tabletop-mogul-status p, .tabletop-mogul-draft p { font-size: 14px; margin: 0 0 6px; }
.tabletop-mogul-money { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.tabletop-mogul-money > div { background: #ede2cb; border-radius: 8px; padding: 8px 10px; }
.tabletop-mogul-money span { display: block; font-size: 12px; }
.tabletop-mogul-money strong { font-size: 18px; }
.tabletop-mode-controller .tabletop-city-map svg { max-height: 100px; }
.tabletop-mogul-actions, .tabletop-mogul-menu { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tabletop-mogul-actions button, .tabletop-mogul-menu button { font-size: 14px; padding: 8px; }
.tabletop-mogul-dialog { display: grid; gap: 10px; }
.tabletop-mogul-dialog label { display: grid; gap: 4px; font-size: 14px; margin: 0; }
.tabletop-mogul-dialog input, .tabletop-mogul-dialog select { width: 100%; min-width: 0; font-size: 16px; margin: 0; }
.tabletop-mogul-dialog h2, .tabletop-mogul-dialog h3 { font-size: 18px; margin: 0 0 6px; }
.tabletop-mogul-dialog p { font-size: 14px; margin: 0 0 6px; }
.tabletop-mogul-dialog small { display: block; font-size: 14px; }
.tabletop-mogul-dialog .mogul-offer-form, .tabletop-mogul-dialog .mogul-install-form, .tabletop-mogul-dialog .mogul-market-actions, .tabletop-mogul-dialog .mogul-route-grid { display: grid; gap: 8px; }
.tabletop-mogul-dialog .mogul-route-grid button, .tabletop-mogul-dialog .mogul-destination-list button { display: grid; gap: 4px; width: 100%; text-align: left; }
.tabletop-mogul-dialog .mogul-destination-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.tabletop-mogul-dialog .mogul-action-row, .tabletop-mogul-dialog .mogul-loan-actions, .tabletop-mogul-dialog .mogul-slot-actions { display: grid; gap: 8px; margin-top: 8px; }
.tabletop-mogul-dialog .mogul-value-breakdown, .tabletop-mogul-dialog .mogul-tax-panel { display: grid; gap: 10px; }
.tabletop-mogul-tabs { display: flex; gap: 6px; }
.tabletop-mogul-tabs button { flex: 1; font-size: 14px; padding: 6px; }
.tabletop-mogul-dialog .tabletop-mogul-help { font-size: 14px; }
.tabletop-mogul-display { display: flex; flex: 1; flex-direction: column; min-height: 0; gap: 18px; }
.tabletop-mogul-display header { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.tabletop-mogul-display h1 { font-size: 38px; margin: 0; }
.tabletop-mogul-display h2 { font-size: 28px; margin: 0 0 12px; }
.tabletop-mogul-display p, .tabletop-mogul-display span, .tabletop-mogul-display strong { font-size: 24px; }
.tabletop-mogul-display p { margin: 8px 0 0; }
.tabletop-mogul-display-body { display: grid; grid-template-columns: 1.5fr 1fr; gap: 20px; min-height: 0; }
.tabletop-mogul-display-body article { display: grid; gap: 3px; margin-bottom: 16px; }
.tabletop-mogul-display-final li { display: flex; justify-content: space-between; gap: 20px; margin: 20px 0; }
.tabletop-office-title { font-size: 28px !important; }
.tabletop-office-status, .tabletop-office-decision, .tabletop-office-roster { padding: 10px 12px; }
.tabletop-office-status h2, .tabletop-office-decision h2 { font-size: 16px; margin: 5px 0; }
.tabletop-office-status p, .tabletop-office-decision p, .tabletop-office-wait { font-size: 14px; margin: 6px 0; }
.tabletop-office-roster article { display: grid; gap: 2px; padding: 6px 0; }
.tabletop-office-roster article strong { font-size: 14px; }
.tabletop-office-roster article span { font-size: 12px; }
.tabletop-office-actions, .tabletop-office-hand, .tabletop-office-card-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tabletop-office-actions button, .tabletop-office-hand button, .tabletop-office-card-choices button { font-size: 14px; padding: 8px; }
.tabletop-office-action-list { display: grid; gap: 10px; }
.tabletop-office-action-list button { display: grid; gap: 6px; text-align: left; }
.tabletop-office-action-list span { font-size: 14px; font-weight: 400; }
.tabletop-office-display article { display: grid; gap: 4px; margin: 18px 0; }
.tabletop-office-display article span { font-size: 24px; }

/* FASCar: readable race decisions, with public context available on each phone. */
.tabletop-race-map { display:block; width:100%; height:140px; }
.tabletop-race-context { padding:8px 12px; }
.tabletop-race-context button { width:100%; }
.tabletop-race-status { padding:12px 16px; }
.tabletop-race-status h2,.tabletop-race-decision h2 { font-size:18px; margin:3px 0; }
.tabletop-race-status p,.tabletop-race-decision p { margin:4px 0; font-size:14px; }
.tabletop-race-decision { padding:12px; display:grid; gap:8px; }
.tabletop-race-gears { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.tabletop-race-gears button { min-height:56px; padding:6px; }
.tabletop-race-gears span { display:block; font-size:12px; font-weight:400; }
.tabletop-race-tools { display:flex; gap:8px; }
.tabletop-race-tools > button { flex:1; min-width:0; }
.tabletop-race-wait { font-size:14px; margin:0; }
.tabletop-race-condition { display:grid; grid-template-columns:1fr auto 1fr auto; gap:8px; font-size:16px; }
.tabletop-race-condition dd { margin:0; font-weight:700; }
.tabletop-race-options { display:grid; gap:8px; }
.tabletop-race-options label { min-height:44px; display:flex; align-items:center; gap:8px; }
.tabletop-race-standings { list-style-position:inside; padding:0; margin:0; display:grid; gap:12px; }
.tabletop-race-standings li { padding:10px; background:#f3e6cd; border-radius:12px; }
.tabletop-race-standings li strong { overflow-wrap:anywhere; }
.tabletop-race-standings li > span { display:block; margin-top:6px; }
.tabletop-race-marker { display:inline-block; width:12px; height:12px; border:1px solid #30291f; border-radius:50%; margin-right:6px; }
.tabletop-race-display .tabletop-race-map { height:clamp(220px,30vh,390px); }
.tabletop-race-display .tabletop-race-standings { font-size:24px; }
.tabletop-race-display .tabletop-race-standings li { padding:16px; }
.tabletop-office-decision > .tabletop-primary { margin-top:8px; }

.tabletop-playtest-title { font-size:24px!important; }
.tabletop-content:has(.tabletop-playtest-title) { gap:10px; }
.tabletop-playtest-public h2,.tabletop-playtest-card strong { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; overflow-wrap:anywhere; }
.tabletop-playtest-status,.tabletop-playtest-public,.tabletop-playtest-hand { padding:12px 16px; }
.tabletop-playtest-status h2,.tabletop-playtest-public h2,.tabletop-playtest-hand h2 { font-size:18px; margin:4px 0; }
.tabletop-playtest-status p,.tabletop-playtest-public p { font-size:14px; margin:6px 0; }
.tabletop-playtest-tools { display:flex; gap:8px; margin-top:8px; }
.tabletop-playtest-tools button { flex:1; min-width:0; }
.tabletop-playtest-card { width:100%; min-height:70px; padding:12px; text-align:left; }
.tabletop-playtest-card span { display:block; font-weight:400; margin-top:5px; }
.tabletop-playtest-footer { font-size:12px; }
.tabletop-long-copy { overflow-wrap:anywhere; }
.tabletop-playtest-display .tabletop-long-copy { font-size:24px; line-height:1.35; }
.tabletop-playtest-display .tabletop-display-focus h1 { font-size:40px; }
.tabletop-playtest-display .tabletop-display-scores h2 { font-size:28px; }

.tabletop-race-context .tabletop-race-map { height:100px; }
.tabletop-race-context .tabletop-race-tools { margin:0; }
.tabletop-race-decision .tabletop-primary { margin:0; }
.tabletop-modal .tabletop-race-map { height:200px; }

.tabletop-mode-support .tabletop-content { max-width:600px; width:100%; gap:14px; }
.tabletop-mode-support .tabletop-room-heading h1 { letter-spacing:-1px; }
.tabletop-mode-support .tabletop-tabs { flex-shrink:0; margin-bottom:0; }
.tabletop-support-form { padding:16px 20px; }
.tabletop-support-form .tabletop-primary { margin-top:14px; }
.tabletop-support-form textarea { width:100%; resize:none; padding:10px; border:1px solid var(--tabletop-line,#d8c4a5); border-radius:12px; background:#fffaf0; color:#30291f; font-family:inherit; font-size:16px; line-height:1.4; }
.tabletop-support-list { display:grid; gap:12px; }
.tabletop-support-list button { text-align:left; }
.tabletop-support-list button span { display:block; margin-top:8px; font-weight:400; overflow-wrap:anywhere; }
.tabletop-support-back { min-height:44px; display:flex; align-items:center; justify-content:center; color:#215d4d; font-weight:700; }

/* Retain the protected quiet guitar affordance; reserve room beside support links. */
.tabletop-entry-links { padding-right:52px; }
.tabletop-entry-links .tabletop-guitar-link { position:fixed; right:max(14px,env(safe-area-inset-right)); bottom:max(14px,env(safe-area-inset-bottom)); width:44px; height:44px; justify-content:center; opacity:.35; z-index:10; }
.tabletop-entry-links .tabletop-guitar-link:hover,.tabletop-entry-links .tabletop-guitar-link:focus-visible { opacity:.8; }
.tabletop-guitar-link img { width:28px; height:28px; border:1px solid #b49a55; border-radius:5px; box-shadow:0 2px 5px #60422135; }

/* Brand-scale contract: controllers are held close; shared displays are read across a room. */
.tabletop-mode-controller .tabletop-player-name,
.tabletop-mode-controller .tabletop-shell label { font-size:var(--gn-controller-body,16px); }
.tabletop-mode-screen :where(p,li,label,input,select,button,a,small,figcaption) {
    font-size:var(--gn-tv-body,clamp(24px,1.65vw,32px)) !important;
    line-height:1.35;
}
.tabletop-mode-screen :where(.tabletop-eyebrow,.tabletop-player-name,.tabletop-player-status,.tabletop-room-state,.tabletop-section-heading > span,.tabletop-card-color,.tabletop-card-hint,.tabletop-trick span,.tabletop-display-scores span,.tabletop-display-names span,.tabletop-playtest-footer,.tabletop-meld-page) {
    font-size:var(--gn-tv-body,clamp(24px,1.65vw,32px)) !important;
}
.tabletop-mode-screen .tabletop-eyebrow { letter-spacing:.12em; }
.tabletop-mode-screen .tabletop-display-header > span { font-size:clamp(24px,2vw,34px); font-weight:750; letter-spacing:.08em; }

@media (max-width:900px) {
    .tabletop-display-header { gap:20px; }
    .tabletop-brand-display .tabletop-brand-mark { width:54px; height:54px; flex-basis:54px; }
}