/* V9: landscape phones get a rectangular table and a full-width hand. */
.game-screen .mahjong-tile:not(.tile-back),.river-view .mahjong-tile:not(.tile-back) { background:#fffefa; border-top-color:#fff; border-left-color:#fff; }
.game-screen .felt-texture,.game-screen .table-emblem,.game-screen .table-brand { display:none; }
.mahjong-table::before { background:#234b67; box-shadow:0 0 0 2px #dbb98a,0 7px #392b43,inset 0 0 0 2px #123d56; }
.table-edge { border:1px solid #a4d1d121; box-shadow:none; }
.river { cursor:zoom-in; touch-action:manipulation; min-height:20px; }
.river:focus-visible { outline:3px solid #ffe6a0; outline-offset:5px; }
.river .mahjong-tile { padding:0; background:#fffefa; }
.river .river-tsumogiri { filter:none; }
.river .river-tsumogiri::before { content:''; position:absolute; bottom:0; left:20%; right:20%; height:2px; background:#436e93; z-index:1; }
.river .river-called { opacity:.72; }
.river .river-called::after { content:'×'; position:absolute; inset:0; display:grid; place-items:center; color:#713252; font:700 18px var(--sans); background:#e5dbea66; }
.hand-tiles .mahjong-tile:disabled:not(.unavailable) { filter:none; }
.hand-tiles .mahjong-tile.unavailable { filter:none; background:#d8dfe0; }
.seat-handcount { display:none; }
.table-auto-settings h3 { margin:24px 0 4px; font-size:15px; color:#87516d; }

/* Public discards stay readable at any viewport size, without revealing hands. */
.river-player-tabs { display:flex; gap:7px; flex-wrap:wrap; margin:18px 0 10px; }
.river-player-tabs>button { flex:1; min-width:100px; min-height:44px; padding:9px 10px; border:1px solid #deb4c8; border-radius:12px; background:#fff; color:#84556f; font-size:12px; }
.river-player-tabs>button[aria-pressed=true] { background:#965e87; border-color:#965e87; color:#fff; font-weight:700; }
.river-view-note { font-size:12px; color:#735969; line-height:1.7; }
.river-zoom-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:13px 9px; margin:16px 0 22px; padding:16px 10px; background:#234b67; border:2px solid #b99982; border-radius:12px; list-style:none; }
.river-zoom-item { display:flex; flex-direction:column; align-items:center; min-width:0; gap:6px; }
.river-order { color:#e1eef5; font-size:10px; line-height:1.2; }
.river-zoom-item .mahjong-tile { width:clamp(30px,7vw,52px); padding:1px; }
.river-flags { color:#e6eff5; font-size:9px; min-height:24px; text-align:center; line-height:1.4; overflow-wrap:anywhere; }
.river-zoom-item.is-last .mahjong-tile { outline:3px solid #ffda81; outline-offset:2px; }
.river-zoom-item.is-riichi .river-flags { color:#ffc5df; font-weight:700; }
.river-view-melds h3 { font-size:13px; margin-bottom:12px; }
.river-view-melds>div { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:24px; }
.river-view-melds .mahjong-tile { width:34px; }
.river-resume { display:block; min-height:44px; margin:16px auto 0; }
.river-empty { padding:40px 0; text-align:center; color:#8d7281; font-size:14px; }

@media (orientation:landscape) and (max-height:600px), (orientation:landscape) and (max-width:760px) {
 .game-screen {
  --safe-l:env(safe-area-inset-left,0px); --safe-r:env(safe-area-inset-right,0px); --safe-b:env(safe-area-inset-bottom,0px);
  --hand-h:clamp(48px,18dvh,90px);
  --table-h:calc(100dvh - var(--safe-b) - var(--hand-h) - 54px);
  --board:calc(100vw - var(--safe-l) - var(--safe-r) - 224px);
  --core:clamp(70px,20dvh,100px);
  --river-base:clamp(8px,calc((var(--table-h) - var(--core) - 28px) / 8.4),28px);
 }
 .mahjong-table { background:#284461; }
 .mahjong-table::before { inset:4px calc(var(--safe-r) + 4px) calc(var(--safe-b) + var(--hand-h) + 17px) calc(var(--safe-l) + 4px); border-width:4px; border-radius:16px; }
 .table-edge { inset:12px calc(var(--safe-r) + 12px) calc(var(--safe-b) + var(--hand-h) + 25px) calc(var(--safe-l) + 12px); border-radius:10px; }
 .table-board { left:calc(var(--safe-l) + 112px); top:20px; width:var(--board); height:var(--table-h); transform:none; }
 .river,.river.river-long { --rv:calc(var(--river-base) * var(--river-scale,1)); gap:calc(2px * var(--river-scale,1)); }
 .river .mahjong-tile { padding:0; border-radius:2px; box-shadow:0 2px #c1ae82,0 3px 2px #10283799; }
 .river-top { bottom:calc(50% + var(--core) / 2 + 8px); }
 .river-bottom { top:calc(50% + var(--core) / 2 + 8px); }
 .river-left { left:28%; top:50%; }
 .river-right { left:72%; top:50%; }
 .river .river-last { outline-width:2px; outline-offset:1px; }
 .table-center { border-width:2px; border-radius:10px; background:#3c4262; }
 .center-main { left:21%; right:21%; top:25%; bottom:25%; background:#17394f; border-radius:4px; }
 .center-seat { gap:3px; }
 .center-seat-score { font:700 clamp(11px,3.1dvh,15px)/1 var(--sans); letter-spacing:0; color:#ffe5a0; }
 .center-seat-wind { font-size:9px; color:#e3f3f5; }
 .center-round { font-size:12px; color:#c2faf3; }
 .center-main .center-wall { margin-top:3px; gap:2px; font-size:6px; color:#d2e8ed; }
 .center-wall b { font:700 13px/1 var(--sans); color:#fff; }
 .seat-card { width:62px; gap:0; }
 .seat-card .avatar { width:38px; height:42px; }
 .seat-info { padding:4px 3px; border-radius:7px; }
 .seat-name { font-size:10px; }
 .seat-score { font:700 13px/1.1 var(--sans); margin-top:3px; }
 .seat-handcount { display:block; margin-top:3px; font:8px/1.1 var(--sans); color:#e3d8ed; }
 .opponent-top .seat-card { left:auto; right:0; top:8px; }
 .opponent-left .seat-card { left:0; top:51%; }
 .opponent-right .seat-card { right:0; top:59%; }
 .seat-riichi { font-size:10px; padding:3px 8px; top:-15px; }
 .back-row:not(.revealed-hand) { display:none; }
 .back-row.revealed-hand .mahjong-tile { width:14px; }
 .opponent-top .back-row { top:0; }
 .opponent-left .back-row { left:17%; }
 .opponent-right .back-row { right:17%; }
 .open-melds { gap:4px; max-width:none; }
 .open-melds .mahjong-tile { width:13px; }
 .opponent-top .open-melds { top:4px; left:0; right:auto; max-width:calc(50% - 80px); flex-wrap:wrap; }
 .opponent-left .open-melds { left:15%; top:50%; }
 .opponent-right .open-melds { right:15%; top:50%; }
 .nuki-pile .mahjong-tile { width:13px; }
 .opponent-top .nuki-pile { left:3%; top:8px; }
 .opponent-left .nuki-pile { left:0; top:37%; }
 .opponent-right .nuki-pile { right:0; top:48%; }
 .game-topbar { top:6px; left:calc(var(--safe-l) + 8px); right:calc(var(--safe-r) + 8px); }
 .game-breadcrumb { padding:0; border:0; background:none; box-shadow:none; }
 .game-breadcrumb>strong,.game-breadcrumb>span { display:none; }
 .game-breadcrumb>button { min-height:36px; padding:4px 10px; font-size:11px; border:1px solid #d6b78c; border-radius:10px; background:#3d3b60; }
 .game-top-tools { display:grid; grid-template-columns:repeat(3,30px); gap:4px; width:98px; }
 .game-top-tools .icon-button { width:30px; height:34px; border-radius:8px; }
 .game-top-tools>button:not(.icon-button) { font-size:9px; min-height:30px; padding:4px; }
 #speed-button { grid-column:1 / 3; } #table-rules-button { grid-column:3; font-size:8px; line-height:1.25; }
 .dora-rack { left:calc(var(--safe-l) + 8px); top:51px; width:96px; padding:7px 5px; gap:5px; border-radius:10px; }
 .round-plaque { font-size:20px; }
 .rack-counters { gap:8px; font-size:8px; padding:0; }
 .rack-counters b { font-size:10px; }
 .dora-rack-label { display:block; font-size:8px; padding-top:4px; }
 .dora-tiles { gap:1px; }
 .dora-tiles .mahjong-tile { width:16px; padding:0; }
 .dora-tiles .tile-back { width:10px; }
 .table-bottom { display:none; }
 .hand-area { left:calc(var(--safe-l) + 72px); right:calc(var(--safe-r) + 10px); bottom:calc(var(--safe-b) + 27px); height:var(--hand-h); }
 .hand-area::before { left:-72px; right:-10px; top:8px; bottom:calc(-27px - var(--safe-b)); background:linear-gradient(#675673,#40334f); border-top:2px solid #dfbca7; }
 .hand-topline { position:static; height:0; margin:0; }
 .hand-tiles { height:100%; min-height:0; gap:2px; padding:0; }
 .hand-tiles .mahjong-tile { width:calc((100% - 38px) / 14); max-width:calc(var(--hand-h) / 1.4); padding:1px 0; border-radius:4px; box-shadow:0 4px #d9c58f,0 6px #91704e,0 8px 5px #211c35a6; }
 .hand-tiles .drawn-tile { margin-left:12px; }
 .hand-tiles .mahjong-tile:not(:disabled):hover { transform:translateY(-6px); filter:none; }
 .hand-tiles .mahjong-tile.selected-tile { transform:translateY(-9px); outline:2px solid #ffdf8d; outline-offset:1px; }
 .hand-status { position:absolute; left:0; bottom:calc(100% + 8px); font-size:10px; padding:4px 7px; background:#28364de8; }
 .human-badge { left:-65px; bottom:-1px; width:56px; gap:2px; }
 .human-badge .avatar { width:37px; height:42px; }
 .human-badge .human-wind { top:29px; right:0; font-size:11px; }
 .human-badge>strong { font-size:10px; }
 .human-badge .you-label { display:none; }
 .human-score { display:block; font:700 12px/1.2 var(--sans); color:#ffe1a2; }
 .human-melds { bottom:0; right:0; max-width:70%; gap:5px; }
 .human-melds .mahjong-tile { width:clamp(18px,3.8vw,35px); }
 .hand-bottomline { position:absolute; top:calc(100% + 8px); left:0; right:162px; margin:0; gap:8px; font-size:9px; line-height:1.1; color:#fff0e8; }
 .hand-small-actions { gap:6px; }
 .hand-small-actions>button { font-size:9px; padding:0 3px; }
 .table-quick-tools { right:calc(var(--safe-r) + 10px); bottom:calc(var(--safe-b) + 2px); top:auto; flex-direction:row; gap:4px; }
 .table-quick-tools>button { min-width:46px; min-height:22px; font-size:10px; border-radius:7px; background:#4e4164; }
 .table-quick-tools>button>span { display:none; }
 #river-view-button { background:#f6d698; color:#523c50; font-weight:700; border-color:#ffe7b8; min-width:54px; }
 .action-dock { left:auto; right:calc(var(--safe-r) + 7px); bottom:calc(var(--safe-b) + var(--hand-h) + 43px); width:98px; max-width:98px; max-height:calc(var(--table-h) - 54px); gap:7px; overflow:auto; scrollbar-width:thin; pointer-events:auto; }
 .action-prompt { font-size:10px; padding:4px; text-align:center; white-space:normal; background:#2b3555e6; border-radius:7px; width:100%; }
 .action-prompt>span { font-size:9px; }
 .action-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 4px; width:100%; padding:2px 0 5px; }
 .action-btn,.action-btn.action-win,.action-btn.action-pass { min-width:0; width:100%; min-height:47px; padding:6px 2px; border-width:2px; border-radius:10px 3px; }
 .action-btn:only-child { grid-column:1 / -1; }
 .action-main,.action-btn.action-win .action-main { font-size:19px; }
 .action-pass .action-main { font-size:9px; }
 .action-caption { font-size:6px; letter-spacing:0; }
 .action-btn .inline-meld { display:none; }
 .auto-discard-label { grid-column:1 / -1; font-size:10px; }
 .river-view { padding:18px 24px; }
 .river-view .modal-heading h2 { font-size:21px; }
 .river-view .modal-heading .section-kicker { display:none; }
 .river-player-tabs { margin-top:10px; }
 .river-zoom-grid { grid-template-columns:repeat(6,minmax(0,1fr)); max-width:480px; margin:12px auto; }
 .river-zoom-item .mahjong-tile { width:42px; }
}
@media (orientation:landscape) and (max-height:360px) {
 .game-screen { --hand-h:clamp(42px,16dvh,58px); --core:64px; }
 .center-seat-score { font-size:10px; }
 .center-seat-wind { font-size:8px; }
 .center-round { font-size:10px; }
 .center-wall b { font-size:11px; }
 .center-wall>span { display:none; }
 .seat-handcount { display:none; }
 .human-badge .avatar { width:30px; height:34px; }
 .human-badge .human-wind { top:22px; }
 .human-badge>strong { display:none; }
 .opponent-top .seat-card { top:0; }
}
@media (orientation:landscape) and (max-width:680px) {
 .game-screen { --board:calc(100vw - var(--safe-l) - var(--safe-r) - 188px); }
 .table-board { left:calc(var(--safe-l) + 94px); }
 .dora-rack { width:80px; }
 .dora-tiles { flex-wrap:wrap; }
 .dora-tiles .mahjong-tile { width:15px; }
 .dora-tiles .tile-back { width:8px; }
 .seat-card { width:48px; }
 .seat-card .avatar { width:32px; height:35px; }
 .seat-score { font-size:11px; }
 .seat-name { font-size:9px; }
 .opponent-top .seat-card { right:2px; }
 .action-dock,.game-top-tools { width:82px; max-width:82px; }
 .game-top-tools { grid-template-columns:repeat(3,25px); gap:3px; }
 .game-top-tools .icon-button { width:25px; }
 .action-main,.action-btn.action-win .action-main { font-size:16px; }
 .hand-area { left:calc(var(--safe-l) + 61px); }
 .human-badge { left:-55px; width:47px; }
 .hand-bottomline { font-size:8px; right:156px; }
 #sort-button { display:none; }
 .hand-small-actions>button { font-size:8px; }
}