/* Native pile controls and only the actions belonging to the current phase. */
#app .game-pife [hidden]{display:none!important}
#app .game-pife button.pife-pile{min-width:64px;min-height:44px;padding:4px 6px;border:1px solid #d6b36b66;border-radius:8px;background:#d6b36b0b;color:inherit;white-space:normal;line-height:1.2}
#app .game-pife button.pife-pile:disabled{opacity:1;cursor:default;border-color:transparent;background:transparent}
#app .game-pife button.pife-pile:not(:disabled):hover{border-color:var(--gold);background:#d6b36b24}
#app .game-pife button.pife-pile:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
#app .game-pife button.pife-pile .card{pointer-events:none;margin:0;flex:none}
#app .game-pife .pife-actions>button,#app .game-pife .pife-hand-heading>button,#app .game-pife .toolbar-buttons>button,#app .game-pife #pife-start,#app .game-pife #pife-next-round{min-height:44px;min-width:44px}
#app .game-pife .pife-actions[data-phase="draw"]>#pife-knock{grid-column:1/-1}
#app .game-pife .pife-actions[data-phase="play"]>#pife-discard:has(+ #pife-knock[hidden]){grid-column:1/-1}
@media(max-width:650px){#app .game-pife button.pife-pile{min-width:60px;padding:2px 4px;border-radius:6px}}

/* The turn message already explains the next action. Keep the selection name
   when useful and retain the consequence of accepting/discarding a new card. */
#app .game-pife .pife-hand-section:not(:has(.card.selected)) #pife-selected-card:not(.pife-incoming-note){display:none}
#app .game-pife #pife-action-hint{height:auto;min-height:0;white-space:normal;overflow:visible;text-overflow:clip;font-size:12px;line-height:16px;margin:3px 0 6px}
#app .game-pife .pife-opponents .seat{font-size:13px;line-height:16px}
#app .game-pife .pife-opponents .seat small{font-size:11px;line-height:14px}
#app .game-pife .pife-score span{font-size:12px;line-height:15px}
#app .game-pife .pife-hand-heading{font-size:12px;line-height:15px}
#app .game-pife #pife-selected-card{height:auto;min-height:16px;font-size:12px;line-height:16px;white-space:normal;overflow:visible;margin:2px 0}
#app .game-pife .pife-pile{font-size:11px;line-height:14px}
#app .game-pife .pife-actions>button{font-size:13px;line-height:16px}
@media(max-width:650px){
 #app .game-pife .pife-opponents .seat{font-size:12px;line-height:15px}
 #app .game-pife .pife-opponents .seat small{font-size:10px;line-height:12px}
 #app .game-pife .pife-score span{font-size:11px;line-height:14px}
 #app .game-pife .pife-hand-heading>button{font-size:11px}
 #app .game-pife #pife-selected-card,#app .game-pife #pife-action-hint{font-size:11px;line-height:14px;min-height:14px}
 #app .game-pife #pife-action-hint{margin:2px 0 7px}
 #app .game-pife .pife-actions>button{font-size:12px;line-height:15px}
}
@media(max-width:650px) and (max-height:620px){
 #app .game-pife>.pife-score>div{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:2px;padding:3px;min-height:27px}
 #app .game-pife>.pife-score span{font-size:11px;line-height:14px;text-align:left}
 #app .game-pife>.pife-score strong{font-size:17px;line-height:19px}
 #app .game-pife>.pife-score small{font-size:10px;line-height:12px}
 #app .game-pife .pife-pile{font-size:10px;line-height:12px}
}