/* Connect uses the shared Mahjong page shell; only its flat board is custom. */
.connect-stage{position:relative;display:flex;flex-direction:column;flex:1;min-height:0}
.connect-page .connect-scroll{display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain;padding:4px;scrollbar-width:thin}
.connect-board{position:relative;flex:none;margin:auto;--cell:48px;--tile-height:64px;width:calc((var(--cols) + 2)*var(--cell));height:calc((var(--rows) + 2)*var(--tile-height));isolation:isolate}
.connect-page.shared-play-page .home-game-layout #board{width:calc((var(--cols) + 2)*var(--cell));height:calc((var(--rows) + 2)*var(--tile-height));margin:auto;flex:none}
.connect-tile{position:absolute;left:calc((var(--col) + 1)*var(--cell) + 2px);top:calc((var(--row) + 1)*var(--tile-height) + 2px);width:calc(var(--cell) - 4px);height:calc(var(--tile-height) - 5px);padding:1px;min-height:0;border-radius:5px;border:1px solid #d6cbb0;background:linear-gradient(110deg,#fffef5,#f1ebd9);box-shadow:1px 2px 0 #c1b595,2px 4px 0 #8a8166,2px 5px 5px #00180d66;touch-action:manipulation;transition:none}
/* A stable tile face prevents gradient/solid repaint flashes on pointer entry. */
.connect-page .connect-tile:hover,.connect-page .connect-tile:active{background:linear-gradient(110deg,#fffef5,#f1ebd9);transform:none;animation:none;transition:none;border-color:#a78e47;filter:brightness(1.04)}
.connect-tile svg,.connect-tile img{display:block;width:100%;height:100%;pointer-events:none;object-fit:contain;border-radius:3px;padding:3%}
.connect-page .connect-tile.selected,.connect-page .connect-tile.selected:hover{outline:3px solid #f7cd62;outline-offset:-1px;background:#ffe9a6;transform:none;filter:none;z-index:2}
.connect-page .connect-tile.hinted,.connect-page .connect-tile.hinted:hover{outline:3px solid #a9edc0;outline-offset:-1px;background:#dbffe4;transform:none;filter:none;z-index:2}
.connect-tile:focus-visible{outline:3px solid #98d8ff;outline-offset:-1px;z-index:3}.connect-tile.removing{opacity:.55}
.connect-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:4}.connect-lines polyline{fill:none;stroke:#fff2a3;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 3px #123d20)}
.connect-page .home-game-options .menu-copy strong{max-width:110px}
.connect-page .shared-hud{width:auto;min-width:0}.connect-page .shared-hud>div{min-width:0}
.connect-page .board-message p{margin:0}.connect-page .board-message{color:var(--muted)}
.connect-page .under-table,.connect-page .connect-shortcuts{font-size:12px;color:var(--muted);line-height:1.6}
.connect-page .connect-result{text-align:center}.connect-result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:24px}.connect-result:not(.win-dialog) h2{font:34px Georgia,serif;color:var(--gold)}
.connect-page #confirm form>div{display:flex;gap:12px;justify-content:flex-end;margin-top:22px}
.connect-page #confirm button,.connect-page .connect-result-actions button{padding:10px 15px;min-height:44px;border-radius:11px}
.connect-page footer{margin-bottom:24px;line-height:1.7}.connect-page .noscript{position:static;margin:20px}
.connect-page .connect-languages{display:flex;flex-wrap:wrap;gap:5px}.connect-languages a{display:block;padding:8px 10px}.connect-languages a[aria-current=page]{font-weight:800;text-decoration:underline;text-underline-offset:3px}
.connect-page .language-menu>summary{cursor:pointer;padding:8px 10px;font-weight:700;font-size:13px;list-style:none}
/* Shared menu controls retain their icons when their labels change. */
.connect-page .home-more-panel #fullscreen .control-label{display:inline}.connect-page .home-more-panel #zoom{margin:0}
@media(max-width:700px){.connect-page .shared-game-content{padding:0 12px}.connect-page .connect-shortcuts{display:none}.connect-page .shared-hud{gap:14px}.connect-page .shared-hud span{font-size:9px}.connect-page .home-game-options .menu-copy strong{max-width:100px}.connect-page .home-primary-controls .control-label{font-size:10px}.connect-page .home-primary-controls .ctl-btn{padding-inline:5px;gap:3px}.connect-page .home-toolbar #btn-autoplay{padding-inline:5px;font-size:10px}.connect-page .home-primary-controls #btn-autoplay .control-label{max-width:64px;white-space:normal;text-align:center}.connect-page .home-primary-controls .sound-label{display:none}}
@media(prefers-reduced-motion:reduce){.connect-page .connect-tile{transition:none;animation:none}}
/* Keep longer translated labels inside the same six shared toolbar buttons. */
@media(max-width:700px){
 .connect-page .home-game-layout .home-toolbar .home-primary-controls .ctl-btn{flex:1 1 0;flex-direction:column;gap:3px;padding:4px 3px;min-height:56px}
 .connect-page .home-game-layout .home-toolbar .home-primary-controls .control-label{white-space:normal;overflow-wrap:normal;text-align:center;font-size:10px;line-height:1.15;max-width:100%}
 .connect-page .home-game-layout .home-toolbar .home-primary-controls #btn-sound{flex:0 0 36px}
 .connect-page.shared-play-page .home-game-options .menu-copy strong{max-width:145px}
}
@media(max-width:440px){
 .connect-page .home-game-layout .home-toolbar .home-primary-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 .connect-page .home-game-layout .home-toolbar .home-primary-controls .ctl-btn{width:100%;min-height:48px}
 .connect-page .home-game-layout .home-toolbar .home-primary-controls .control-label{font-size:11px}
 .connect-page .home-game-layout .home-toolbar .home-primary-controls .control-icon{display:block}
}

/* Native result dialogs use Mahjong's shared victory card and support modules. */
.connect-page #cover .dialog-content{position:relative}
.connect-page #cover [hidden]{display:none!important}
.connect-page #cover .win-stats{margin-top:24px}
.connect-page #cover.win-dialog .connect-result-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.connect-page #cover.win-dialog .connect-result-actions button{min-width:0}
.connect-page #cover .dialog-close{padding:0;min-height:36px}
.connect-page #cover-text{max-width:340px;margin-inline:auto}
