/* Generated silhouettes share a single quiet material. No glyphs or baked gold bevels. */
.ui-icon{background:#e7d6ae!important;mask:var(--icon-art) center/contain no-repeat;-webkit-mask:var(--icon-art) center/contain no-repeat;width:26px;height:26px;filter:none!important}
.icon-spade{--icon-art:url('/assets/ui-v42/spade.webp')}
.icon-heart{--icon-art:url('/assets/ui-v42/heart.webp')}
.icon-club{--icon-art:url('/assets/ui-v42/club.webp')}
.icon-diamond{--icon-art:url('/assets/ui-v42/diamond.webp')}
.icon-sound{--icon-art:url('/assets/ui-v42/sound.webp')}
.icon-mute{--icon-art:url('/assets/ui-v42/mute.webp')}
.icon-book{--icon-art:url('/assets/ui-v42/book.webp')}
.icon-menu{--icon-art:url('/assets/ui-v42/menu.webp')}
.icon-left{--icon-art:url('/assets/ui-v42/left.webp')}
.icon-right{--icon-art:url('/assets/ui-v42/right.webp')}
.icon-close{--icon-art:url('/assets/ui-v42/close.webp')}
.icon-cards{--icon-art:url('/assets/ui-v42/cards.webp')}
.icon-heart,.icon-diamond{background:#c4745e!important}
.game .battles{column-gap:var(--pair-gap,32px)!important}
.game:has(.battles[data-pairs="4"]) .play-area,.game:has(.battles[data-pairs="5"]) .play-area,.game:has(.battles[data-pairs="6"]) .play-area{left:10%;right:10%;top:30%;bottom:31%}
.last-action{position:absolute;top:var(--hud-action-top,30%);left:24%;right:24%;margin:0;text-align:center;color:#d4c7a9;font:clamp(13px,1.05cqw,19px)/1.35 "Literata", Georgia,serif;pointer-events:none;z-index:5;min-height:1.35em;text-wrap:pretty;overflow-wrap:anywhere}
.last-action:empty{display:none}
body.presenting .actions button{pointer-events:none;opacity:.65}
@media(max-width:900px) and (orientation:portrait){.last-action{left:5%;right:5%;font-size:12px}.game:has(.battles[data-pairs="4"]) .play-area,.game:has(.battles[data-pairs="5"]) .play-area,.game:has(.battles[data-pairs="6"]) .play-area{left:5%;right:5%;top:36%;bottom:44%}}

body.in-game #sound .ui-icon,.game .game-menu .ui-icon{width:50%!important;height:50%!important;max-width:28px;max-height:28px}
@media(max-width:900px) and (orientation:portrait){
 .game:has(.battles[data-pairs="4"]) .player-dock,.game:has(.battles[data-pairs="5"]) .player-dock,.game:has(.battles[data-pairs="6"]) .player-dock{bottom:18%}
 .game:has(.battles[data-pairs="4"]) .play-area,.game:has(.battles[data-pairs="5"]) .play-area,.game:has(.battles[data-pairs="6"]) .play-area{bottom:35%}
}
@media(max-height:700px) and (orientation:portrait){
 .game:has(.battles[data-pairs="4"]) .play-area,.game:has(.battles[data-pairs="5"]) .play-area,.game:has(.battles[data-pairs="6"]) .play-area{bottom:39%}
}

/* Keep the context below real opponent copy, including wrapped status labels.
   The same measured boundary constrains the table, not just the text itself. */
.game .play-area{top:max(32%,var(--hud-bottom,0px))!important}
.game:has(.battles[data-pairs="4"]) .play-area,.game:has(.battles[data-pairs="5"]) .play-area,.game:has(.battles[data-pairs="6"]) .play-area{top:max(30%,var(--hud-bottom,0px))!important}
.game .control-stack{gap:clamp(5px,.45cqw,8px)}
.game .actions{margin-top:0}
@media(max-width:900px) and (orientation:portrait){
 .game .table-stats{top:max(30%,var(--hud-stats-top,0px))!important}
 .game .play-area,.game:has(.battles[data-pairs="4"]) .play-area,.game:has(.battles[data-pairs="5"]) .play-area,.game:has(.battles[data-pairs="6"]) .play-area{top:max(36%,var(--hud-bottom,0px))!important}
 .game .control-stack{gap:6px}
}
@media(max-height:500px) and (orientation:landscape){.game .control-stack{gap:5px}}

/* Recent action is a quiet sidebar, separate from persistent player roles. */
.game .last-action{left:4.7%;right:auto;width:16%;display:flex;gap:10px;align-items:flex-start;text-align:left;font:clamp(13px,1.05cqw,18px)/1.4 "Literata", Georgia,serif;padding:12px 0;border-top:1px solid #d4bc7938}
.game .last-action:empty{display:none}
.game .last-action .action-avatar{width:clamp(32px,3cqw,48px);height:clamp(32px,3cqw,48px);flex:none;border:1px solid #b89f68;margin:0}
.game .last-action strong,.game .last-action span:not(.portrait){display:block}
.game .last-action strong{font-weight:600;color:#eddcba;margin-bottom:3px}
.game .last-action>div{min-width:0}
.game .opponent.active .portrait[data-avatar]{border-color:#ffe4a0;box-shadow:0 0 0 3px #c39e4d,0 0 0 5px #ffdd8952,0 0 24px #e6bc5266,0 4px 9px #0009}
.game.is-your-turn .self-avatar{border-color:#ffe4a0;box-shadow:0 0 0 3px #c39e4d,0 0 18px #e6bc5266,0 3px 8px #0006}
@media(min-width:901px),(orientation:landscape){.game:has(.battles[data-pairs="4"]) .play-area,.game:has(.battles[data-pairs="5"]) .play-area,.game:has(.battles[data-pairs="6"]) .play-area{left:26%;right:7%}}
@media(max-width:900px) and (orientation:portrait){
 .game .last-action{left:5%;right:5%;width:auto;font-size:12px;gap:8px;padding:5px 0;border:0;align-items:center}
 .game .last-action .action-avatar{width:28px;height:28px}
 .game .last-action strong{display:inline;margin:0 5px 0 0}.game .last-action span:not(.portrait){display:inline}
}

@media(max-width:900px) and (orientation:portrait){.game .last-action>div{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}}

@media(max-height:700px) and (orientation:portrait){.game .play-area{bottom:43%}}