/* Cartes Uno et Skyjo (télé + téléphones). Taille réglée par --cw (largeur). */
.ucard { --cw: 70px; position: relative; width: var(--cw); height: calc(var(--cw) * 1.5); border-radius: calc(var(--cw) * 0.12); flex: none;
  background: var(--uc, #222); box-shadow: inset 0 0 0 calc(var(--cw) * 0.06) #fff, 0 4px 14px rgba(0, 0, 0, 0.45); overflow: hidden; color: #fff; font-family: 'Inter', sans-serif; }
.ucard.c-r { --uc: #e5293a; } .ucard.c-y { --uc: #f5c518; } .ucard.c-g { --uc: #2fa84f; } .ucard.c-b { --uc: #1f6fd1; } .ucard.c-w { --uc: #111; }
.ucard.back { --uc: #111; }
.uno-oval { position: absolute; inset: 14% 10%; border-radius: 50%; background: #fff; transform: rotate(-28deg); display: grid; place-items: center; overflow: hidden; }
.uno-oval b { transform: rotate(28deg); font-size: calc(var(--cw) * 0.48); font-weight: 900; color: var(--uc); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.25); letter-spacing: -0.04em; }
.ucard.c-w .uno-oval b { color: #111; position: relative; z-index: 2; }
.ucard.back .uno-oval { background: #e5293a; }
.ucard.back .uno-oval b { color: #f5c518; font-size: calc(var(--cw) * 0.3); font-style: italic; }
.uno-oval i { position: absolute; width: 50%; height: 50%; }
.uno-oval .w1 { left: 0; top: 0; background: #e5293a; } .uno-oval .w2 { right: 0; top: 0; background: #1f6fd1; }
.uno-oval .w3 { left: 0; bottom: 0; background: #f5c518; } .uno-oval .w4 { right: 0; bottom: 0; background: #2fa84f; }
.uno-corner { position: absolute; left: 9%; top: 5%; font-size: calc(var(--cw) * 0.2); font-weight: 900; }
.uno-corner.br { left: auto; top: auto; right: 9%; bottom: 5%; transform: rotate(180deg); }

.sky { --cw: 56px; width: var(--cw); height: calc(var(--cw) * 1.4); border-radius: calc(var(--cw) * 0.14); flex: none; display: grid; place-items: center;
  background: var(--sc); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.25), 0 3px 10px rgba(0, 0, 0, 0.4); font-family: 'Inter', sans-serif; }
.sky b { font-size: calc(var(--cw) * 0.5); font-weight: 900; color: #fff; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.35); }
.sky.hid { --sc: repeating-linear-gradient(135deg, #2b2f45 0 8px, #33385a 8px 16px); }
.sky.neg { --sc: #3949ab; } .sky.zero { --sc: #29b6f6; } .sky.low { --sc: #43a047; } .sky.mid { --sc: #f9a825; } .sky.high { --sc: #e53935; }
.sky.gone { visibility: hidden; }

/* cartes illustrées façon BD (images) : le chiffre reste dessiné par le jeu */
.ucard { background: var(--uimg) center / 100% 100% no-repeat !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45) !important; border-radius: calc(var(--cw) * 0.1); }
.ucard.c-r { --uimg: url(/shared/img/cards/uno-r.webp); } .ucard.c-y { --uimg: url(/shared/img/cards/uno-y.webp); }
.ucard.c-g { --uimg: url(/shared/img/cards/uno-g.webp); } .ucard.c-b { --uimg: url(/shared/img/cards/uno-b.webp); }
.ucard.c-w { --uimg: url(/shared/img/cards/uno-w.webp); } .ucard.back { --uimg: url(/shared/img/cards/uno-back.webp); }
.ucard .uno-oval { background: transparent !important; inset: 18% 16%; }
.ucard .uno-oval i { display: none; }
.ucard.back .uno-oval { display: none; }
.ucard .uno-oval b { -webkit-text-stroke: calc(var(--cw) * 0.012) #000; }
.ucard.c-w .uno-oval b { color: #fff !important; text-shadow: 2px 2px 0 #000; }
.ucard .uno-corner { text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000; }
.sky { background: var(--simg) center / 100% 100% no-repeat !important; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4) !important; }
.sky.neg { --simg: url(/shared/img/cards/sky-neg.webp); } .sky.zero { --simg: url(/shared/img/cards/sky-zero.webp); }
.sky.low { --simg: url(/shared/img/cards/sky-low.webp); } .sky.mid { --simg: url(/shared/img/cards/sky-mid.webp); }
.sky.high { --simg: url(/shared/img/cards/sky-high.webp); } .sky.hid { --simg: url(/shared/img/cards/sky-hid.webp); }
.sky b { text-shadow: 2px 2px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000; }