/* Vendored from playroom-paks/shared/components/game-components.css; sha256=744ef619fe128c8362ce1bbe5dd9b080c16c7ee67a3ea92146104ed47f4fe867 */
.game-speech{position:fixed;z-index:60;display:inline-flex;align-items:center;justify-content:center;gap:var(--size-space-4_0,4px);max-width:min(var(--size-length-180_0,176px),70vw);min-width:var(--size-length-24_0,24px);min-height:var(--size-length-24_0,24px);padding:var(--size-space-4_0,4px) var(--size-space-8_0,8px);border:var(--size-border-1_0,1px) solid var(--color-border-subtle,#90b088);border-radius:var(--size-radius-13_0,12px);background:var(--color-bubble-game,#e6f2df);color:var(--color-text-primary,#244c35);box-shadow:0 4px 10px #183b2b25;font:700 clamp(var(--size-type-13_0,12px),1.5vw,var(--size-type-16_0,16px))/1.3 system-ui;white-space:normal;pointer-events:none;}
.game-speech:after{content:"";position:absolute;bottom:-5px;left:12px;width:var(--size-length-7_0,8px);height:var(--size-length-7_0,8px);transform:rotate(45deg);border-right:var(--size-border-1_0,1px) solid var(--color-border-subtle,#90b088);border-bottom:var(--size-border-1_0,1px) solid var(--color-border-subtle,#90b088);background:inherit;}
.game-speech.is-chat{background:var(--color-bubble-chat,#fffdf4);border-color:var(--color-border-subtle,#d8dacd);color:var(--color-text-primary,#283c30);}
.game-speech-icon svg{width:var(--size-length-16_0,16px);height:var(--size-length-16_0,16px);vertical-align:middle;}
.game-speech.is-success{animation:speech-success var(--ui-duration-speech,320ms) ease-in-out 2;}.game-speech.is-error{animation:speech-error var(--ui-duration-speech,320ms) ease-in-out 2;}
@keyframes speech-success{50%{background:var(--color-material-bubble-success,#b9e5aa);box-shadow:0 0 0 4px #73b66a55}}@keyframes speech-error{50%{background:var(--color-material-bubble-error,#f4c9c0);box-shadow:0 0 0 4px #df7e7055}}
body.reduced-motion .game-speech,.reduced-motion .game-speech{animation:none!important;}

/* Independent translation preserves the seat transform, including rotated hands. */
.player-panel.is-participant-affected{animation:player-turn-skipped var(--feedback-skip-ms,450ms) ease-in-out both!important;}
@keyframes player-turn-skipped{0%,100%{translate:0 0}18%,52%{translate:-4px 0;background:var(--color-material-bubble-error,#f4c9c0);box-shadow:inset 0 0 0 2px #b64d43}35%,69%{translate:4px 0;background:var(--color-material-bubble-error,#f4c9c0);box-shadow:inset 0 0 0 2px #b64d43}85%{translate:0 0;background:var(--color-material-bubble-error,#f4c9c0)}}
body.reduced-motion .player-panel.is-participant-affected,.reduced-motion .player-panel.is-participant-affected{animation:none!important;background:var(--color-material-bubble-error,#f4c9c0)!important;box-shadow:inset 0 0 0 2px #b64d43!important;}
@media(prefers-reduced-motion:reduce){.player-panel.is-participant-affected{animation:none!important;background:var(--color-material-bubble-error,#f4c9c0)!important;box-shadow:inset 0 0 0 2px #b64d43!important;}}

.action-reveal{position:fixed;inset:0;z-index:55;display:block;overflow:clip;pointer-events:none;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--color-surface-panel,#f4f2e8) 82%,transparent) 0%,transparent 66%);}
.action-reveal-title{max-width:90vw;padding:var(--size-space-8_0,8px) var(--size-space-14_0,12px);border-radius:var(--size-radius-14_0,12px);background:var(--color-surface-raised,#fffaf0);color:var(--color-text-primary,#244c35);font-size:clamp(var(--size-type-16_0,16px),4vw,var(--size-type-24_0,24px));text-align:center;}
.action-reveal-art{width:min(36vw,var(--size-length-150_0,148px),calc(70dvh - var(--size-length-67_0,68px)));transform-origin:center;filter:drop-shadow(0 8px 12px #142e3038);}
.action-reveal-art.scene{display:block!important;min-height:0!important;max-height:none!important;height:auto!important;padding:0!important;margin:0!important;overflow:visible!important;aspect-ratio:auto!important;background:none!important;border:0!important;}
.action-reveal-art.scene>*{display:block!important;width:100%!important;height:auto!important;min-width:0!important;max-width:none!important;aspect-ratio:72/103;transform:none!important;margin:0!important;}
.action-reveal-art.is-dice{display:flex;align-items:center;justify-content:center;gap:var(--size-space-8_0,8px);width:auto;max-width:90vw;}
.action-reveal-die{display:block;width:min(14vw,var(--size-length-64_0,64px));aspect-ratio:1;}.action-reveal-die>svg{display:block;width:100%;height:auto;}.action-reveal-die.is-unused{opacity:.35;transform:scale(.82);}

/* Presentation overlays cannot contribute to document scroll geometry. */
.game-feedback-layer{position:fixed;inset:0;overflow:clip;pointer-events:none;z-index:60;contain:strict;}
.game-feedback-layer .game-speech{max-width:min(var(--size-length-240_0,240px),calc(100vw - var(--size-length-16_0,16px)));min-height:var(--size-length-32_0,32px);box-sizing:border-box;}
.game-speech-icon svg{width:var(--size-length-22_0,20px);height:var(--size-length-22_0,20px);}
/* Interaction shape is part of the component, independent of a game's rules. */
[data-interaction-shape="circle"]{border-radius:50%!important;}
[data-interaction-shape="cell"]{border-radius:0!important;}
:is(.game-scene,.app-game-layout) :is(.is-playable,.is-selected){outline:var(--interaction-ring-width,var(--size-border-2_0,2px)) solid var(--ui-action-outline,var(--color-interaction-available,#638658))!important;outline-offset:var(--ui-selection-offset,1px);}
:is(.game-scene,.app-game-layout) .is-selected{outline-color:var(--color-interaction-selected,#d3aa45)!important;outline-offset:var(--ui-selection-offset,1px);}
[data-interaction-shape="circle"]{--interaction-ring-width:2px;}

.action-reveal-content{position:absolute;left:var(--reveal-x,50%);top:var(--reveal-y,50%);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:var(--size-space-12_0,12px);max-width:calc(100vw - var(--size-length-24_0,24px));}

/* One exposed header contains both rank and suit for compact vertical stacks. */
.inline-index-face .shared-card-corner{display:flex;flex-direction:row;align-items:center;gap:3px;top:3px;left:4px;font-size:15px;line-height:17px;white-space:nowrap}
.inline-index-face .shared-card-corner small{font-size:15px;line-height:17px}
.inline-index-face .shared-card-corner.bottom{top:auto;left:auto;bottom:3px;right:4px}

/* Legacy class aliases share the canonical button stylesheet. */
.btn{min-height:var(--ui-button-height,48px);padding:var(--ui-button-padding-y,12px) var(--ui-button-padding-x,22px);border:0;border-radius:var(--ui-button-radius,15px);background:var(--green);color:var(--color-action-on-primary,#fffef8);font-weight:700;display:inline-flex;gap:10px;align-items:center;justify-content:center;box-shadow:0 4px 0 #1c4436;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(2px);box-shadow:0 1px 0 #1c4436}
.btn.secondary{background:var(--color-surface-raised,#e6e9dc);color:var(--ink);box-shadow:0 3px 0 #d4d9c6}
.btn.plain{box-shadow:none;background:transparent;color:var(--ink)}
.btn.coral{background:var(--coral);box-shadow:0 4px 0 #c45e46}
/* Shared button primitive: explicit visual role, icon first, optional label. */
.ui-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--ui-button-gap,10px);font:inherit;font-weight:700;box-sizing:border-box;text-align:center;vertical-align:middle;touch-action:manipulation}
.ui-button>svg{width:var(--ui-button-icon-size,22px);height:var(--ui-button-icon-size,22px);flex:none;margin:0;vertical-align:middle}
.ui-button-label{min-width:0;overflow-wrap:anywhere}
.ui-button--label{min-height:var(--ui-button-height,48px);padding:var(--ui-button-padding-y,12px) var(--ui-button-padding-x,22px);border:0;border-radius:var(--ui-button-radius,15px)}
.ui-button--icon{min-width:var(--ui-control-size,44px);min-height:var(--ui-control-size,44px);padding:0;gap:0;border-radius:15px}
.ui-button--primary{background:var(--color-action-primary,#356951);color:var(--color-action-on-primary,#fffef8);box-shadow:0 4px 0 #1c4436}
.ui-button--secondary{background:var(--color-surface-raised,#e6e9dc);color:var(--color-text-primary,#263c36);box-shadow:0 3px 0 #d4d9c6}
.ui-button--danger{background:var(--coral,#eb795c);color:var(--color-action-on-primary,#fffef8);box-shadow:0 4px 0 #c45e46}
.ui-button--outline{background:transparent;color:inherit;border:1px solid var(--line,#dcded0);box-shadow:none}
.ui-button--plain{background:transparent;color:inherit;box-shadow:none}
.ui-button--game{min-height:var(--ui-control-size,44px);padding:var(--ui-game-button-padding-y,8px) var(--ui-game-button-padding-x,12px);border-radius:var(--ui-game-button-radius,12px);background:var(--color-table-action,#e2edcc);color:var(--color-table-action-mark,#244f3c)}
.ui-button:disabled{cursor:default;opacity:.43}

/* Shared visible control edges, including secondary and icon-only actions. */
:is(.btn,.icon-btn,.ui-button,.ui-icon-button){border:1px solid color-mix(in srgb,var(--ink,#29483e) 28%,transparent)}

/* The physical card is painted by its type, including its rim and lower edge.
   The same complete SVG travels through hands, piles, reveals and motion clones. */
:is(.game-scene,.playroom-motion-layer,.playroom-request-layer,.action-reveal-art,.player-target-menu) :is([data-size-role="card"],.shared-card,.art-card,.piece-back):has(>.card-deck-art){background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;isolation:isolate}
.card-deck-art{display:block;width:100%;height:100%;overflow:hidden;pointer-events:none}
.card-deck-print .shared-face{border:0;border-radius:0;background:transparent}
/* Print coordinates stay in artboard units; containers scale the complete card. */
.card-deck-art .card-deck-print .shared-face .shared-card-corner{font:800 15px/1 system-ui,sans-serif!important;letter-spacing:0!important;top:5px!important;left:5px!important}
.card-deck-art .card-deck-print .shared-face .shared-card-corner small{font:800 12px/1 system-ui,sans-serif!important;margin:0!important}
.card-deck-art .card-deck-print .shared-face .shared-card-corner.bottom{top:auto!important;left:auto!important;bottom:5px!important;right:5px!important}
.card-deck-art .card-deck-print .inline-index-face .shared-card-corner{top:3px!important;left:4px!important}
.card-deck-art .card-deck-print .inline-index-face .shared-card-corner small{font-size:15px!important}
.card-deck-art .card-deck-print .inline-index-face .shared-card-corner.bottom{top:auto!important;left:auto!important;bottom:3px!important;right:4px!important}

/* Interaction follows the object's printed contour, including rotated pieces. */
:is(.game-scene,.app-game-layout) :is(.is-playable,.is-selected,.solitaire-hint,.is-drop-target,.playroom-drop-hover){--piece-interaction-color:var(--ui-action-outline,var(--color-interaction-available,#638658));outline-offset:-2px!important;}
:is(.game-scene,.app-game-layout) :is(.is-selected,.solitaire-hint){--piece-interaction-color:var(--color-interaction-selected,#d3aa45);}
:is(.game-scene,.app-game-layout) :is(.is-playable,.is-selected,.solitaire-hint,.is-drop-target,.playroom-drop-hover):has(.piece-contour){outline:none!important;}
:is(.game-scene,.app-game-layout) :is(.is-playable,.is-selected,.solitaire-hint,.is-drop-target,.playroom-drop-hover) .piece-contour{stroke:var(--piece-interaction-color)!important;}
:is(.game-scene,.app-game-layout) :is(.is-playable,.is-selected,.solitaire-hint,.is-drop-target,.playroom-drop-hover) .card-outline{stroke:var(--piece-interaction-color)!important;}

/* Drag destinations use the same contour as selection, without a rectangular halo. */
:is(.game-scene,.app-game-layout) [data-drop-piece].playroom-drop-hover{outline-offset:-2px!important;box-shadow:none!important;--piece-interaction-color:var(--color-interaction-selected,#d3aa45);}
:is(.game-scene,.app-game-layout) [data-drop-piece].playroom-drop-hover:has(.piece-contour){outline:none!important;background-color:transparent!important;}

/* All game objects share a quiet pulse; only the interaction contour changes. */
@property --piece-highlight-strength{syntax:"<percentage>";inherits:true;initial-value:100%;}
@keyframes piece-highlight-pulse{0%,100%{--piece-highlight-strength:100%}50%{--piece-highlight-strength:58%}}
:is(.game-scene,.app-game-layout){animation:piece-highlight-pulse 2.6s ease-in-out infinite}
:is(.game-scene,.app-game-layout) :is(.is-playable,.is-selected,.solitaire-hint,.is-drop-target,.playroom-drop-hover){outline-color:color-mix(in srgb,var(--piece-interaction-color,var(--color-interaction-available,#638658)) var(--piece-highlight-strength),transparent)!important}
:is(.game-scene,.app-game-layout) :is(.is-playable,.is-selected,.solitaire-hint,.is-drop-target,.playroom-drop-hover) :is(.piece-contour,.card-outline){stroke-opacity:var(--piece-highlight-strength)}
.player-score.is-token-counter.is-overlapping{gap:0!important;isolation:isolate}
.player-score.is-overlapping .counter-token{position:relative}
.player-score.is-overlapping .counter-token+.counter-token{margin-left:calc(var(--counter-token-width,13px) * -.54)}
.player-score.is-overlapping .counter-token.is-empty{opacity:1;fill:var(--counter-token-empty-fill,var(--color-surface-panel,#e9eddf))}
@media(prefers-reduced-motion:reduce){:is(.game-scene,.app-game-layout){animation:none;--piece-highlight-strength:100%}}

.hand-track.is-overlapping{display:block!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;padding-top:8px;padding-bottom:18px}
.hand-overlap-row{display:grid;grid-template-columns:repeat(calc(var(--hand-count) - 1),minmax(0,var(--scene-card-width,var(--size-card)))) var(--scene-card-width,var(--size-card));gap:2px;justify-content:safe center;margin:auto;max-width:100%}
.hand-overlap-row>.hand-card{position:relative;z-index:1}
.hand-overlap-row>.hand-card.is-selected{z-index:3;transform:translateY(-4px)!important}

.hand-overlap-row:has(>.hand-card:only-child){grid-template-columns:var(--scene-card-width,var(--size-card))}

.player-score.token-heart .counter-token,.player-score.token-crown .counter-token{stroke:color-mix(in srgb,currentColor 78%,#27352c);stroke-width:1;paint-order:fill stroke}
.player-score.is-token-counter .counter-token.is-empty{opacity:1;fill:none;stroke:color-mix(in srgb,currentColor 60%,transparent)}
.player-score.is-token-counter:is(.token-heart,.token-meeple) .counter-token.is-empty{fill:#fff}