/* Card artwork must not inherit toolbar SVG sizes or phone emoji fonts. */
.playing-card svg.card-suit-icon { display:block; width:1em; height:1em; fill:currentColor; stroke:none; stroke-width:0; flex:none; pointer-events:none; }

/* Reserve separate areas for the corner suit and main pip, including tiny fans.
   Percentages follow the physical card instead of the device's glyph metrics. */
:is(.tw-screen,.tw-result-cards,.tw-reveal-cards) .playing-card .card-face > .card-rank { position:absolute; left:6%; top:4%; margin:0; font-size:calc(var(--tw-card-width) * .41); line-height:1; }
:is(.tw-screen,.tw-result-cards,.tw-reveal-cards) .playing-card .card-face > .card-corner-suit { display:block; position:absolute; left:6%; top:35%; width:28%; height:20%; margin:0; padding:0; line-height:1; }
:is(.tw-screen,.tw-result-cards,.tw-reveal-cards) .playing-card .card-face > .card-pip { position:absolute; left:auto; right:4%; bottom:4%; width:54%; height:38%; margin:0; padding:0; transform:none; opacity:1; }
:is(.tw-screen,.tw-result-cards,.tw-reveal-cards) .playing-card .card-face svg.card-suit-icon { width:100%; height:100%; }