/* The tabletop renderer is shared by the wide pavilion and seated view. */
#house-tabletop-root{position:fixed;inset:0;z-index:3;pointer-events:none;overflow:hidden}
#yunyi-preview .house-tabletop-canvas{position:fixed;overflow:hidden;pointer-events:none;touch-action:manipulation;outline-offset:-4px}
.house-tabletop-canvas canvas{display:block;width:100%;height:100%}
#yunyi-preview .house-tabletop-canvas[data-interactive="true"]{pointer-events:auto;cursor:pointer}
#yunyi-preview .house-tabletop-canvas:focus-visible{outline:1px solid #ecd4ac;outline-offset:-8px}
#yunyi-preview #house-board-target{width:100%;height:clamp(440px,48vw,660px);pointer-events:none}
#yunyi-preview #yy-3d{display:block;width:100%}
#yunyi-preview [data-view="scene"] .house-game-layout{display:grid;visibility:hidden;pointer-events:none}
#yunyi-preview [data-view="play"] .house-game-layout{visibility:visible}
#yunyi-preview .yy-3d-controls{position:relative;z-index:4;padding:12px 0}
#yunyi-preview .yy-game-top{z-index:4}

#yunyi-preview[data-screen="game"] .yy-screen{animation:none}
.house-scenery{will-change:transform;transform-origin:50% 75%}
#house-tabletop-root[data-travelling="true"] .house-tabletop-canvas{pointer-events:none}
#house-tabletop-root[data-fallback="true"] canvas{display:none}
.house-start-seats{border:0;padding:0;margin:0 0 18px;display:flex;gap:18px;font-size:13px;flex-wrap:wrap}
.house-start-seats legend{font-size:12px;padding:0 0 12px;color:var(--yy-sub)}
.house-start-seats label{cursor:pointer}.house-start-seats input{accent-color:#715d4c}
.house-seat-choice{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;font-size:13px;color:#f6e8d7;text-shadow:0 2px 5px #30251c}
#yunyi-preview .house-seat-choice button{padding:10px 15px;border:1px solid #d5bba770;border-radius:20px;background:#544438d9;color:#f3e5d6;font-size:12px}
#yunyi-preview .house-seat-choice button[aria-pressed="true"]{background:#dcc4aa;color:#403126;text-shadow:none}
.house-rematch{padding:25px 28px;background:#54453bed;backdrop-filter:blur(24px);border:1px solid #d8bd9e66;border-radius:20px;color:#f5e6d6;box-shadow:0 14px 40px #2a1d2333;max-width:680px;width:100%;align-self:center}
#yunyi-preview .house-rematch h2{font-size:22px;line-height:1.5;letter-spacing:1px;color:#f6e9da}
#yunyi-preview .house-rematch p{font-size:13px;line-height:1.8;margin:12px 0;color:#dbc8b3}
.house-rematch>div{display:flex;gap:10px;flex-wrap:wrap}
#yunyi-preview .house-rematch button,#yunyi-preview #house-rematch-reopen{font-size:13px;border:1px solid #c5a88d88;border-radius:22px;padding:10px 16px;color:#f6e5d4;background:#88705c40}
#yunyi-preview .house-rematch button:first-child{background:#ddc3a6;color:#443426}
#house-rematch-reopen{align-self:center}
#yunyi-preview .yy-header,#yunyi-preview .yy-preview-nav{z-index:5}
@media(max-width:900px){#yunyi-preview #house-board-target{height:550px}}
@media(max-width:620px){
 #yunyi-preview [data-page="game"]:not([hidden]){padding:0 14px 30px}
 #yunyi-preview #house-board-target{height:420px}
 #yunyi-preview .yy-game-top{padding:12px 0}
 #yunyi-preview .yy-room-title{font-size:13px}
 .house-rematch{padding:22px 18px}#yunyi-preview .house-rematch h2{font-size:19px}
 .house-start-seats{gap:12px}
}
@media(prefers-reduced-motion:reduce){.house-scenery{will-change:auto}}
#yunyi-preview .house-board-seat{padding:0 0 62px}
#yunyi-preview #house-board-target{max-width:720px;margin:0 auto;height:clamp(340px,calc(100svh - 300px),740px)}
#yunyi-preview .house-board-seat .yy-player[data-seat="opponent"]{left:0;top:0}
#yunyi-preview .house-board-seat .yy-player[data-seat="self"]{right:0;bottom:0}
#yunyi-preview .house-board-seat .yy-player{z-index:4;max-width:215px}
#yunyi-preview .house-board-seat .yy-player strong{font-size:28px}
@media(max-width:1100px){#yunyi-preview .house-board-seat .yy-player{max-width:180px}#yunyi-preview .house-board-seat .yy-player strong{font-size:24px}}
@media(max-width:900px){#yunyi-preview .house-board-seat{padding:62px 0 65px}#yunyi-preview #house-board-target{height:clamp(360px,calc(100svh - 370px),600px)}}
#yunyi-preview[data-screen="game"] .yy-stage{position:relative;z-index:4;pointer-events:none}
#yunyi-preview[data-screen="game"] .yy-game-top,#yunyi-preview[data-screen="game"] .yy-3d-controls,#yunyi-preview[data-screen="game"] .house-game-actions,#yunyi-preview[data-screen="game"] .yy-game-bottom,#yunyi-preview[data-screen="game"] .house-seat-choice,#yunyi-preview[data-screen="game"] .house-rematch,#yunyi-preview[data-screen="game"] .house-chat,#yunyi-preview[data-screen="game"] #house-rematch-reopen,#yunyi-preview[data-screen="game"] .yy-board-focus{pointer-events:auto}
#yunyi-preview .house-tabletop-canvas:focus-visible{outline:none}
#yunyi-preview #house-board-target{height:clamp(360px,calc(100svh - 260px),740px)}
@media(max-width:900px){#yunyi-preview #house-board-target{height:clamp(360px,calc(100svh - 370px),600px)}}


/* Board owns the available width; names track its projected corners. */
#yunyi-preview .house-game-layout{grid-template-columns:minmax(0,1fr) minmax(330px,29%);gap:24px}
#yunyi-preview .house-board-seat{padding:0 4px 24px}
#yunyi-preview #house-board-target{height:clamp(420px,calc(100svh - 400px),1040px);max-width:none}
#yunyi-preview .house-board-seat .yy-player{width:auto;max-width:260px;top:0;bottom:auto!important;right:auto!important;transform:none;flex-wrap:nowrap;justify-content:flex-start;text-align:left!important;gap:12px}
#yunyi-preview .house-board-seat .yy-player[data-seat="self"]{left:auto;top:auto;bottom:0}
#yunyi-preview .house-board-seat .yy-player strong{font-size:30px;letter-spacing:1px}
#yunyi-preview .house-board-seat .yy-player small{font-size:12px;letter-spacing:1px}
.house-board-hint{font-size:11px;color:#f0dfc7;text-shadow:0 2px 5px #30231a;text-align:center;margin:5px 0 0}
#yunyi-preview .house-game-actions{margin:0 0 8px;flex-wrap:wrap}
@media(max-width:1150px){#yunyi-preview .house-game-layout{grid-template-columns:minmax(0,1fr) 320px;gap:18px}#yunyi-preview .house-board-seat .yy-player strong{font-size:26px}}
@media(max-width:900px){#yunyi-preview .house-game-layout{grid-template-columns:minmax(0,1fr)}#yunyi-preview .house-board-seat{padding:62px 0 76px}#yunyi-preview #house-board-target{height:clamp(350px,calc(100svh - 290px),850px)}.house-chat{max-width:none!important;width:100%}}
@media(max-width:620px){#yunyi-preview .house-board-seat .yy-player{max-width:90%;gap:9px}#yunyi-preview .house-board-seat .yy-player strong{font-size:25px}#yunyi-preview #house-board-target{height:min(calc((100vw - 28px)*1.14),calc(100svh - 260px))}}

/* Measure intrinsic name widths before positioning; left/right placement must
   not change shrink-to-fit width on the first seated frame. */
#yunyi-preview .house-board-seat .yy-player{width:max-content;max-width:min(260px,100%);transition:opacity .14s ease}
#yunyi-preview .house-board-seat .yy-player>div{min-width:0}
#yunyi-preview .house-board-seat:not([data-nameplates-ready="true"]) .yy-player{opacity:0;visibility:hidden;transition:none}
@media(max-width:620px){#yunyi-preview .house-board-seat .yy-player{max-width:90%}}

/* Keep the opponent nameplate above the board at every aspect ratio.
   The height comes from the actual label, including wrapped player names. */
#yunyi-preview .house-board-seat{padding-top:var(--house-opponent-space,0px)}

/* Once the camera arrives, the mobile board scrolls natively with this slot. */
#yunyi-preview #house-board-target{position:relative}
#yunyi-preview .house-tabletop-canvas[data-docked="true"]{position:absolute;inset:0;z-index:1;touch-action:pan-y}
#yunyi-preview .house-tabletop-canvas[data-docked="true"] canvas{touch-action:pan-y}