:root{color:#1a1a1a;background:#fff;font-family:system-ui,sans-serif;line-height:1.45}body{margin:0}#root{min-height:100vh}:root{--card-aspect-w:216;--card-aspect-h:306;--card-raise-frac:.15;--card-desktop-scale:1.2;--hand-card-h:clamp(calc(4rem * var(--card-desktop-scale)), calc(11.4vw * var(--card-desktop-scale)), calc(6.4rem * var(--card-desktop-scale)));--hand-card-w:clamp(calc(2.8rem * var(--card-desktop-scale)), calc(8vw * var(--card-desktop-scale)), calc(4.5rem * var(--card-desktop-scale)));--center-card-h:clamp(calc(4rem * var(--card-desktop-scale)), calc(11.4vw * var(--card-desktop-scale)), calc(6.4rem * var(--card-desktop-scale)));--center-card-w:clamp(calc(2.8rem * var(--card-desktop-scale)), calc(8vw * var(--card-desktop-scale)), calc(4.5rem * var(--card-desktop-scale)));--hand-gap:.35rem}.cardFace{width:calc(4.5rem * var(--card-desktop-scale));height:calc(6.4rem * var(--card-desktop-scale));background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex;overflow:visible}.cardFaceSmall{width:var(--hand-card-w);height:var(--hand-card-h)}.cardFaceCenter{width:var(--center-card-w);height:var(--center-card-h)}.cardFaceBoard{border-radius:12px;width:100%;height:100%}.cardFaceClickable{cursor:pointer;transition:transform .12s}.cardFaceClickable:hover:not(:disabled):not(.cardFaceRaised):not(.cardFaceSelected){transform:translateY(-4px)}.cardFaceRaised{transform:translateY(calc(var(--card-raise-frac) * -100%));z-index:2;position:relative}.cardFaceSelected{outline-offset:2px;outline:3px solid #f1c40f}.cardFaceRaised.cardFaceSelected{z-index:3}.cardFaceDisabled{opacity:.35;cursor:not-allowed}.cardFaceImg{object-fit:contain;pointer-events:none;width:100%;height:100%}.cardFaceFallback{color:#333;background:linear-gradient(145deg,#f5f1e8,#ddd);border:2px solid #aaa;border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;font-size:1.1rem;font-weight:700;display:flex}.cardFaceSmall .cardFaceFallback{font-size:.75rem}.handFan{gap:var(--hand-gap);box-sizing:border-box;padding-top:calc(var(--hand-card-h) * var(--card-raise-frac));min-height:calc(var(--hand-card-h) * (1 + var(--card-raise-frac)) + .375rem);flex-wrap:nowrap;justify-content:center;align-items:flex-end;padding-bottom:.375rem;display:flex;position:relative;overflow:auto hidden}.handFanSlot{flex-shrink:0;position:relative;overflow:visible}.opponentFan{justify-content:center;gap:.15rem;display:flex}.opponentFan .cardFace{margin-left:-1.2rem}.opponentFan .cardFace:first-child{margin-left:0}.gameLayout{--board-size:min(100%, 42rem);flex-direction:column;align-items:center;gap:.5rem;display:flex;overflow:visible}.seatStripHumanBelow{z-index:2;box-sizing:border-box;flex-direction:column;gap:.35rem;width:100%;padding:0 .75rem .5rem;display:flex;position:relative;overflow:visible}.seatStripHumanBelowBoardPick{pointer-events:none}.seatStripHumanBelowBoardPick .handFan{pointer-events:auto}.humanHandZoneShift{padding-top:calc(var(--hand-card-h) * .4);flex-direction:column;gap:.35rem;width:100%;display:flex;overflow:visible}.handActionBar{text-align:center;flex-direction:column;align-items:center;gap:.35rem;width:100%;display:flex}.handActionButtons{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.exchangeHint{box-sizing:border-box;color:#444;text-align:center;text-wrap:balance;width:100%;max-width:100%;margin:0;padding-inline:.5rem;font-family:Georgia,Palatino Linotype,Palatino,serif;font-size:clamp(.6rem,2.2vw,.82rem);line-height:1.35}p.exchangeHint.muted.small{margin:0;font-size:clamp(.6rem,2.2vw,.82rem)}.tableCenter{width:100%;max-width:min(42rem,100%);position:relative}.seatStrip{flex-direction:column;align-items:center;gap:.35rem;max-width:100%;display:flex}.seatStripOpp{padding:.25rem}.seatStripHuman{width:100%;overflow:visible}.seatHeader{border-left:4px solid #888;align-items:baseline;gap:.5rem;padding-left:.4rem;font-size:.85rem;display:flex}.exitBadge{text-align:center;-webkit-user-select:none;user-select:none;margin:.15rem 0 .25rem;font-size:2.55rem;line-height:1;display:block}.seatTurn{outline-offset:4px;border-radius:8px;outline:3px solid #f1c40f;padding:.2rem}.seatTurn .seatName{font-weight:700}.seatName{white-space:nowrap}.seatCount{color:#666;font-size:.8rem}.moreCards{color:#666;align-self:center;font-size:.75rem}.boardSeatOverlay{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.boardSeatOverlay .boardCardSlot,.boardSeatOverlay .boardSeatExitHtml{pointer-events:auto}.boardSeatName{fill:#f2f2f2;letter-spacing:1px;pointer-events:none;font-family:Georgia,serif}.boardSeatAvatar{fill:#281810eb;stroke-width:4px;pointer-events:none}.boardSeatAvatarTurn{stroke:#f1c40f;stroke-width:8px}.boardSeatExitHtml{box-sizing:border-box;pointer-events:none;justify-content:flex-end;align-items:center;height:100%;padding-right:4px;display:flex}.boardSeatExitHtml .exitBadge{filter:drop-shadow(0 4px 8px #00000073);margin:0;font-size:4.8rem;line-height:1;display:block}.boardCardSlot{filter:drop-shadow(0 12px 14px #0000008c);justify-content:stretch;align-items:stretch;width:100%;height:100%;display:flex}.boardCardSlot .cardFaceBoard{background:#f5f1e8;border-radius:12px;width:100%;height:100%}.boardCardSlot .cardFaceBoard.cardFaceClickable:hover:not(:disabled){transform:translateY(-6px)}.boardCardSlot .cardFaceBoard.cardFaceDisabled{opacity:1;cursor:not-allowed}.boardCardSlot .cardFaceBoard.cardFaceSelected{outline-offset:2px;outline:3px solid #f1c40f}.centerPlaysOverlay{width:min(100%, calc(20rem * var(--card-desktop-scale,1)));height:min(100%, calc(20rem * var(--card-desktop-scale,1)));pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.centerPlayAnchor{width:0;height:0;position:absolute;top:50%;left:50%}.centerPlayCard{transform-origin:50%;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}.moveFlow{width:100%}.movePhaseBlock{margin-bottom:.65rem}.moveHint,.moveLabel{margin:0 0 .4rem;font-size:.88rem}.playerChips{gap:.35rem;display:flex}.playerChips button{min-width:2.2rem}.chipActive{background:#e8f4fc;font-weight:700}.devilPanel{border-left:3px solid #8e44ad;padding-left:.65rem}.legalPick{margin:.5rem 0}.legalList{max-height:10rem;margin:0;padding:0;list-style:none;overflow:auto}.legalList li{margin:.2rem 0;font-size:.85rem}.btnGhost{background:0 0;border:1px solid #aaa}.tacReplayEightActions{flex-wrap:wrap;gap:.5rem;display:flex}.tableStage{aspect-ratio:1;width:min(100%,42rem);margin:0 auto;position:relative}.tableStageInner,.tableWrap{width:100%;height:100%;position:relative}.tableBg{object-fit:contain;width:100%;height:100%;display:block}.tableOverlay{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.tablePawnSelectable{filter:drop-shadow(0 0 6px #f1c40f)}.tablePawnSelected{filter:drop-shadow(0 0 10px #27ae60)}.cellHighlight{fill:#2ecc7144;stroke:#27ae60;stroke-width:4px}.cellHighlightClickable{fill:#2ecc7166;stroke-width:5px}.cellHighlightClickable:hover{fill:#2ecc7099}.gameScreen{width:100%;max-width:56rem;margin:0 auto;overflow:visible}.toast{margin:0 0 .5rem}.devilHandSwap{flex-direction:column;gap:.5rem;width:100%;display:flex}.devilHandSwapRow{flex-direction:row;align-items:flex-end;gap:.5rem;width:100%;display:flex}.devilHandSwapRow .seatStripHuman{flex:1;min-width:0}@media (width>=601px){.appGame .gameLayout{gap:.25rem}.appGame .humanHandZoneShift{padding-top:calc(var(--hand-card-h) * .3)}.appGame .seatStripHumanBelow{margin-top:calc(var(--hand-card-h) * -.08)}}@media (width<=600px){.appGame .gameScreen{max-width:none;margin:0}.appGame .gameLayout{--board-size:100vw;--center-circumradius-factor:1.2242;--center-card-h:calc(var(--board-size) * 570 / 2000 * .86 / var(--center-circumradius-factor));--center-card-w:calc(var(--center-card-h) * var(--card-aspect-w) / var(--card-aspect-h));--hand-gap:.5vw;--hand-card-w:calc((var(--board-size) - 5 * var(--hand-gap)) / 6);--hand-card-h:calc(var(--hand-card-w) * var(--card-aspect-h) / var(--card-aspect-w));gap:0}.appGame .tableCenter{max-width:none}.appGame .tableStage{width:100%;max-width:none}.appGame .seatStripHumanBelow{margin-top:calc(var(--hand-card-h) * -.22);padding-left:0;padding-right:0}.appGame .exchangeHint{font-size:clamp(.55rem,2.8vw,.75rem)}.appGame .centerPlaysOverlay{width:100%;height:100%;transform:translate(-50%,calc(2px - 50%))}}.app{max-width:56rem;margin:0 auto;padding:1.5rem;font-family:system-ui,sans-serif}.appGame{max-width:62rem}@media (width<=600px){.app.appGame{max-width:none;margin:0;padding:0}}.header h1{margin:0 0 .35rem;font-size:1.35rem}.muted{color:#555;margin:0;font-size:.95rem}.muted.small{margin:.35rem 0 .75rem;font-size:.82rem}.small{font-size:.82rem}.actionPanel{margin-top:.25rem}.fieldset{border:1px solid #ccc;border-radius:6px;margin:.5rem 0 0;padding:.65rem .75rem}.legend{padding:0 .35rem;font-size:.88rem}.radioRow{align-items:center;gap:.45rem;margin:.25rem 0;font-size:.9rem;display:flex}.draftBlock{border-top:1px dashed #ccc;margin-top:1rem;padding-top:.75rem}.ta{resize:vertical;width:100%;max-width:36rem}.boardStack{flex-direction:column;gap:0;margin-top:1.25rem;display:flex}.boardStack .boardPanel{border-bottom-right-radius:0;border-bottom-left-radius:0;margin-top:0}.panel{background:#fafafa;border:1px solid #ddd;border-radius:8px;margin-top:1.25rem;padding:1rem}.panelTitle{margin:0 0 .75rem;font-size:1.05rem}.subTitle{margin:1rem 0 .4rem;font-size:.95rem;font-weight:600}.subTitle.small{margin:.5rem 0 .35rem;font-size:.88rem}.legalMovesBlock{border-top:1px dashed #e0e0e0;margin-top:.5rem;padding:.5rem 0 0}.fieldset.tight{margin-top:.35rem;padding:.45rem .55rem}.btnRow{flex-wrap:wrap;gap:.5rem;margin-top:.25rem;display:flex}.rowInline{flex-direction:row;align-items:center;gap:.5rem}.mono{word-break:break-word;font-family:ui-monospace,Consolas,monospace;font-size:.85rem}.gridTight{margin-top:.35rem}.eventList{max-height:16rem;margin:0;padding:0;list-style:none;overflow:auto}.eventList li{border-bottom:1px solid #e8e8e8;grid-template-columns:14rem 1fr;gap:.5rem;padding:.35rem 0;font-size:.85rem;display:grid}.evKind{color:#222;font-weight:600}.evDetail{color:#444}.replayTape li{grid-template-columns:3.5rem 11rem 1fr}.evStep{color:#666;font-weight:600}.replayRunN{align-items:center;margin-bottom:0}input.narrow{width:4.5rem;max-width:4.5rem}.row{flex-direction:column;gap:.35rem;margin-bottom:.75rem;font-size:.9rem;display:flex}.row input{max-width:12rem;padding:.4rem .5rem}button{cursor:pointer;padding:.45rem .75rem}button:disabled{cursor:not-allowed;opacity:.55}.error{color:#a40000;margin:.5rem 0 0}.ok{color:#0a5;word-break:break-all;margin:.5rem 0 0}.grid{grid-template-columns:11rem 1fr;gap:.35rem .75rem;margin:.5rem 0 1rem;display:grid}.grid dt{color:#333;margin:0;font-weight:600}.grid dd{margin:0}.raw{background:#fff;border:1px solid #e0e0e0;border-radius:6px;max-height:24rem;margin-top:.75rem;padding:.75rem;font-size:.8rem;overflow:auto}.linkish{color:#06c;background:0 0;border:none;padding:0;text-decoration:underline}code.mono{font-size:.88em}.boardPanel .boardSvg{max-width:min(100%,440px);height:auto;margin:.5rem 0;display:block}.boardLegend{flex-wrap:wrap;gap:.75rem 1.25rem;margin:.5rem 0 .25rem;display:flex}.legendRow{align-items:center;gap:.35rem;font-size:.88rem;display:flex}.legendActive{outline-offset:2px;border-radius:4px;outline:2px solid #333;padding:.1rem .25rem;font-weight:700}.swatch{border:1px solid #888;border-radius:50%;width:.75rem;height:.75rem}.tag{text-transform:uppercase;color:#0a5;font-size:.72rem}.homeGrid{gap:.5rem;margin-top:.75rem;display:grid}.homeRow{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.homeLabel{min-width:5rem;font-weight:600}.homeSlots{gap:.35rem;display:flex}.homeSlot{background:#fff;border:1px solid #ccc;border-radius:4px;justify-content:center;align-items:center;width:1.75rem;height:1.75rem;display:flex}.homePawn{border:1px solid #555;border-radius:50%;width:1.1rem;height:1.1rem}.homeEmpty{color:#ccc;font-size:1.2rem;line-height:1}.authScreen{max-width:22rem;margin:2rem auto}.authScreen h1{margin:0 0 1rem;font-size:1.5rem}.authTabs{gap:.5rem;margin-bottom:1rem;display:flex}.authTabs button{background:#eee;border:1px solid #ccc;flex:1}.authTabs button.active{background:#fff;font-weight:600}.authForm label{flex-direction:column;gap:.35rem;margin-bottom:.75rem;font-size:.9rem;display:flex}.authForm input{padding:.45rem .5rem}.hint{color:#666;font-size:.82rem}.hint.ok{color:#0a5}.hint.bad{color:#a40000}.lobbyScreen{max-width:40rem}.lobbyJoin{margin:1rem 0}.lobbyJoinForm{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.lobbyInviteInput{border:1px solid #ccc;border-radius:6px;flex:16rem;min-width:0;padding:.45rem .6rem;font-family:ui-monospace,monospace;font-size:.85rem}.lobbyCreate{border-top:1px solid #e8e8e8;margin-top:1.25rem;padding-top:1rem}.lobbyInvite{background:#fafafa;border:1px solid #ddd;border-radius:8px;margin:0 0 1rem;padding:.75rem}.lobbyInviteLabel{color:#555;margin:0 0 .35rem;font-size:.85rem}.lobbyInviteCode{word-break:break-all;background:#fff;border:1px solid #e0e0e0;border-radius:6px;margin-bottom:.6rem;padding:.45rem .5rem;font-size:.78rem;display:block}.lobbyInviteActions{flex-wrap:wrap;gap:.5rem;display:flex}.lobbyInviteHint{margin:.6rem 0 0}.lobbyHeader{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1rem;display:flex}.lobbySeats{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.75rem;margin:1rem 0;display:grid}.lobbySeat{background:#fafafa;border:2px solid #ddd;border-radius:8px;padding:.75rem}.lobbySeat--team0{border-color:#3a8fb5}.lobbySeat--team1{border-color:#d45a4a}.lobbySeat--empty{border-style:dashed}.lobbySeatTitleRow{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.lobbySeatTitle{color:#666;font-size:.82rem}.lobbySeatPawnPreview{flex-shrink:0;width:28px;height:28px;display:block}.lobbySeatName{margin:.35rem 0;font-weight:600}.lobbySeatReady{color:#444;font-size:.85rem}.lobbySeatActions{flex-direction:column;gap:.35rem;margin-top:.5rem;display:flex}.lobbyFooter{flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:1rem;display:flex}