/* Embruns — une table marine : cartes en papier, défausses au centre */
body[data-theme="embruns"] {
  --bg: #082a33;
  --bg-glow: #15586a;
  --surface: #0f3d48;
  --fg: #e8f4f0;
  --muted: #93b9ba;
  --line: rgba(232, 244, 240, .15);
  --glass: rgba(232, 244, 240, .05);
  --accent: #f4d58d;
  --accent-ink: #18262c;
  --hot: #ff6a4f;
  --hot-ink: #ffffff;
  --paper: #fbf9f2;
  --ink: #18262c;
  --ink-soft: #5a6a70;
  --f-display: "IM Fell English", Georgia, "Times New Roman", serif;
  --f-body: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.tile-embruns { background: linear-gradient(160deg, #0f3d48, #082a33); color: #e8f4f0; }
.tile-embruns h2 { font-family: "IM Fell English", Georgia, serif; color: #f4d58d; font-size: 34px; }
.tile-embruns .btn.primary { background: #f4d58d; color: #18262c; }

/* ---------- Cartes, style gravure : papier teinté, mer gravée, double filet, phylactère ---------- */
.em-card, .em-mc { --sf: #fff6e4; --sk: #1b2026; }
.em-card {
  --cc: #cfdde2; --ct: #1b2026;
  appearance: none; border: 0; padding: 0 0 7px; margin: 0; font: inherit;
  width: 76px; height: 110px; border-radius: 8px; color: var(--ct);
  background-color: var(--cc);
  /* mer gravée : rangées de vagues fines */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='7'%3E%3Cpath d='M0 5 q 5 -3.6 10 0 t 10 0' fill='none' stroke='%231b2026' stroke-opacity='.17' stroke-width='.8'/%3E%3C/svg%3E");
  background-size: 20px 7px;
  display: flex; flex-direction: column; align-items: center; overflow: hidden; position: relative; flex: none;
  box-shadow: inset 0 0 16px rgba(10, 14, 16, .22), 0 3px 0 rgba(0, 0, 0, .32), 0 6px 14px rgba(0, 0, 0, .18);
  transition: transform .15s, box-shadow .15s;
}
/* grain de papier */
.em-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .2; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .15 0 0 0 0 .1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
/* double filet de planche gravée */
.em-card::after { content: ""; position: absolute; inset: 3px; border: 1.2px solid rgba(27, 32, 38, .55); border-radius: 5px; pointer-events: none;
  outline: 1px solid rgba(27, 32, 38, .3); outline-offset: -3px; }
button.em-card { cursor: pointer; }
button.em-card:disabled { cursor: default; }
.em-card .art { display: block; width: 100%; aspect-ratio: 1; flex: none; margin-top: 2px; overflow: hidden; position: relative; z-index: 1; }
/* phylactère : bande de papier aux bouts échancrés, filets en haut et en bas */
.em-card .nm {
  position: relative; z-index: 2; margin-top: -7px; padding: 2.5px 9px 2px;
  background: var(--sf); color: var(--sk); border-top: 1px solid var(--sk); border-bottom: 1px solid var(--sk);
  clip-path: polygon(0 0, 100% 0, calc(100% - 5px) 50%, 100% 100%, 0 100%, 5px 50%);
  font: 400 12px/1 "IM Fell English SC", "IM Fell English", Georgia, "Times New Roman", serif; letter-spacing: .02em; white-space: nowrap;
}
.em-card .nm.long { font-size: 10.5px; letter-spacing: 0; padding-inline: 8px; }
/* cartouche de règle */
.em-card .hint { margin-top: auto; position: relative; z-index: 2; font: 800 8px/1 var(--f-body); letter-spacing: .02em;
  background: var(--sf); color: var(--sk); padding: 2.5px 5px 2px; border-radius: 2px; box-shadow: 0 0 0 1px var(--sk), 0 0 0 2.5px var(--sf);
  white-space: nowrap; max-width: calc(100% - 12px); overflow: hidden; text-overflow: ellipsis; }
.em-card.sel { transform: translateY(-10px); box-shadow: inset 0 0 16px rgba(10, 14, 16, .22), 0 0 0 3px var(--accent), 0 12px 18px rgba(0, 0, 0, .45); }
.em-card.mermaid, .em-mc.mermaid { background-color: #e9e4f3; --cc: #f3a3c6; --ct: #3d3150; }
.em-card.mermaid { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='7'%3E%3Cpath d='M0 5 q 5 -3.6 10 0 t 10 0' fill='none' stroke='%231b2026' stroke-opacity='.13' stroke-width='.8'/%3E%3C/svg%3E"),
  linear-gradient(160deg, #f1dcfb 0%, #cfeef2 52%, #fde2d0 100%); background-size: 20px 7px, 100% 100%; }
.em-card.big { width: 112px; height: 162px; border-radius: 12px; padding-bottom: 11px; background-size: 26px 9px; }
.em-card.big::after { inset: 4.5px; border-radius: 8px; outline-offset: -4px; }
.em-card.big .nm { font-size: 17px; padding: 3.5px 13px 3px; margin-top: -10px; clip-path: polygon(0 0, 100% 0, calc(100% - 7px) 50%, 100% 100%, 0 100%, 7px 50%); }
.em-card.big .nm.long { font-size: 15px; }
.em-card.big .hint { font-size: 11px; padding: 3px 7px; }

/* Carte encre : liseré papier autour du dessin, sinon l'encre se perd dans le fond */
.em-card.dark .ea { filter: drop-shadow(0 0 .7px rgba(255, 246, 228, .95)) drop-shadow(0 0 .9px rgba(255, 246, 228, .55)); }
.em-card.dark { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='7'%3E%3Cpath d='M0 5 q 5 -3.6 10 0 t 10 0' fill='none' stroke='%23fff6e4' stroke-opacity='.12' stroke-width='.8'/%3E%3C/svg%3E"); }
.em-card.dark::after { border-color: rgba(255, 246, 228, .4); outline-color: rgba(255, 246, 228, .22); }

/* Dos de carte */
.em-card.back { padding: 0; background: #123f4a; }
.em-card.back::after { display: none; }
.em-card.back .ea-back { position: absolute; inset: 0; width: 100%; height: 100%; }
.em-card.back .cnt { position: absolute; left: 50%; bottom: 7px; transform: translateX(-50%); background: var(--sf); color: var(--sk);
  font: 400 14px/1 "IM Fell English", Georgia, serif; padding: 3px 9px 2px; border-radius: 2px; box-shadow: 0 0 0 1px var(--sk); font-variant-numeric: tabular-nums; }

/* ---------- Illustrations gravées (voir art.js) ----------
   --k compense l'épaisseur des traits dans les groupes réduits (manchots, sardines…) */
.ea { display: block; width: 100%; height: 100%; overflow: visible; }
.ea * { stroke-linejoin: round; stroke-linecap: round; }
.ea .pf { fill: var(--sf); stroke: none; }
.ea .ol { fill: none; stroke: var(--sk); stroke-width: calc(2.2 * var(--k, 1)); }
.ea .o { fill: var(--sf); stroke: var(--sk); stroke-width: calc(2.2 * var(--k, 1)); }
.ea .i { fill: var(--sk); stroke: var(--sk); stroke-width: calc(2 * var(--k, 1)); }
.ea .in { fill: var(--sk); stroke: none; }
.ea .l { fill: none; stroke: var(--sk); stroke-width: calc(2.4 * var(--k, 1)); }
.ea .l2 { fill: none; stroke: var(--sk); stroke-width: calc(1.4 * var(--k, 1)); }
.ea .l3 { fill: none; stroke: var(--sk); stroke-width: calc(.85 * var(--k, 1)); }
.ea .lc { fill: none; stroke: var(--sf); stroke-width: calc(.9 * var(--k, 1)); opacity: .8; }
.ea .hd { fill: url(#eh-d); stroke: none; }
.ea .hx { fill: url(#eh-x); stroke: none; }
.ea .hh { fill: url(#eh-h); stroke: none; }
.ea .hc { fill: url(#eh-c); stroke: none; opacity: .75; }
.ea .st { fill: url(#eh-st); stroke: none; }
.ea .hl { fill: var(--sf); stroke: none; opacity: .36; }
.ea .dots circle { fill: var(--sk); stroke: none; }
.ea .suck circle { fill: var(--sf); stroke: var(--sk); stroke-width: calc(.7 * var(--k, 1)); }
.ea .cn { fill: var(--cc); stroke: none; }
.ea .pg { fill: #20272e; stroke: var(--sk); stroke-width: calc(2 * var(--k, 1)); }
/* rehauts de couleur, comme une gravure coloriée à la main */
.ea .tr { fill: #c8473a; stroke: var(--sk); stroke-width: calc(1.6 * var(--k, 1)); }
.ea .trn { fill: #c8473a; stroke: none; opacity: .9; }
.ea .tg { fill: #f2d16b; stroke: var(--sk); stroke-width: calc(1.6 * var(--k, 1)); }
.ea .tgo { fill: #dcae45; stroke: var(--sk); stroke-width: calc(1.4 * var(--k, 1)); }
.ea .to { fill: #e08a33; stroke: var(--sk); stroke-width: calc(1.4 * var(--k, 1)); }
.ea .th { fill: #b9563d; stroke: var(--sk); stroke-width: calc(1.6 * var(--k, 1)); }
.ea .tt { fill: #3b9a8c; stroke: var(--sk); stroke-width: calc(1.6 * var(--k, 1)); }
.ea .tp { fill: #f2c9db; stroke: var(--sk); stroke-width: calc(1.2 * var(--k, 1)); }

/* Symboles du cartouche */
.em-card .hint { display: inline-flex; align-items: center; gap: 1.5px; }
.em-card .hint b { font-weight: 800; }
.ei { width: 1.45em; height: 1.45em; flex: none; margin: -.25em 0; fill: none; stroke: var(--sk); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ei .f { fill: var(--sf); }
.ei .k { fill: var(--sk); }
.ei rect[style] { stroke-width: 1; }

.em-mc { --cc: #93b9ba; display: inline-flex; width: 24px; height: 24px; border-radius: 6px; background: var(--cc); overflow: hidden; flex: none; box-shadow: 0 1px 0 rgba(0, 0, 0, .3), inset 0 0 0 1px rgba(0, 0, 0, .08); }
.em-minis { display: flex; flex-wrap: wrap; gap: 3px; }
.em-pairs { display: flex; flex-wrap: wrap; gap: 8px; }
.em-pairs .pr { display: flex; gap: 2px; padding: 3px; border-radius: 8px; background: rgba(232, 244, 240, .06); }
.em-rrow td { border-bottom: 0; padding-bottom: 2px; }
.em-rcards td { padding-top: 0; }
.em-rcards .em-minis { flex-wrap: wrap; }

@media (max-width: 420px) {
  .em-card { width: 68px; height: 100px; padding-bottom: 6px; }
  .em-card .nm { font-size: 11px; padding-inline: 8px; }
  .em-card .nm.long { font-size: 9.6px; padding-inline: 7px; }
  .em-card .hint { font-size: 7.4px; letter-spacing: 0; padding: 2px 3.5px 1.5px; max-width: calc(100% - 6px); }
}

/* ---------- Table de jeu (plein écran) ---------- */
.em-table {
  flex: 1; min-height: 0; position: relative; overflow: hidden;
  display: grid; grid-template-rows: auto minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr);
  background:
    radial-gradient(120% 70% at 50% 42%, rgba(30, 110, 125, .55) 0%, transparent 62%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='9'%3E%3Cpath d='M0 6.5 q 6.5 -4.6 13 0 t 13 0' fill='none' stroke='%23e8f4f0' stroke-opacity='.05' stroke-width='.9'/%3E%3C/svg%3E"),
    #072730;
  box-shadow: inset 0 0 120px rgba(0, 0, 0, .55);
}

/* Sièges des adversaires */
.em-seats { display: flex; justify-content: center; gap: 8px; padding: 10px max(10px, env(safe-area-inset-left, 0px)) 0; min-width: 0; }
.em-seat {
  appearance: none; font: inherit; color: var(--fg); text-align: left;
  flex: 1 1 0; max-width: 240px; min-width: 0; position: relative;
  display: flex; flex-direction: column; gap: 6px; padding: 8px 10px 9px;
  background: linear-gradient(180deg, rgba(15, 61, 72, .92), rgba(8, 42, 51, .92));
  border: 1px solid rgba(232, 244, 240, .14); border-radius: 14px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
}
.em-seat.active { border-color: var(--accent); animation: em-glow 1.8s ease-in-out infinite; }
@keyframes em-glow { 50% { box-shadow: 0 0 0 2px rgba(244, 213, 141, .5), 0 0 26px rgba(244, 213, 141, .35); } }
button.em-seat { cursor: pointer; }
.em-seat.steal { border-color: var(--hot); box-shadow: 0 0 0 2px var(--hot), 0 8px 22px rgba(0, 0, 0, .4); animation: em-pulse 1.2s ease-in-out infinite; }
@keyframes em-pulse { 50% { transform: translateY(-3px); } }
.em-steal-tag { position: absolute; top: -10px; right: 10px; background: var(--hot); color: #fff; font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: 999px; }
.em-seat-head, .em-mebadge { display: flex; align-items: center; gap: 8px; min-width: 0; }
.em-seat .who, .em-mebadge .who { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.em-seat .who b, .em-mebadge .who b { font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.em-seat .who span, .em-mebadge .who span { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.em-mebadge .who span b { color: var(--accent); }
.em-seat .dot { margin: 0 0 0 auto; }
/* Médaillon gravé : initiale au centre */
.em-av { --av: #f4d58d; flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle at 35% 30%, #fff6e4 0 45%, color-mix(in srgb, var(--av) 55%, #fff6e4) 46%);
  box-shadow: 0 0 0 2px #1b2026, 0 0 0 4px var(--av), 0 3px 8px rgba(0, 0, 0, .4);
  color: #1b2026; font: 400 19px/1 "IM Fell English", Georgia, serif; }
/* Dos de cartes miniatures (main adverse) */
.em-backs { display: flex; align-items: center; padding-left: 9px; min-height: 26px; }
.em-mb { width: 17px; height: 25px; margin-left: -9px; border-radius: 3px; flex: none;
  background: #123f4a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='4'%3E%3Cpath d='M0 3 q 2 -1.6 4 0 t 4 0' fill='none' stroke='%23fff6e4' stroke-opacity='.35' stroke-width='.6'/%3E%3C/svg%3E");
  box-shadow: inset 0 0 0 1.4px rgba(255, 246, 228, .6), 0 1px 3px rgba(0, 0, 0, .5); }
.em-mb:nth-child(odd) { transform: rotate(-3deg); } .em-mb:nth-child(even) { transform: rotate(2deg); }
.em-hc { margin-left: 8px; font-weight: 800; font-size: 13px; font-variant-numeric: tabular-nums; color: var(--muted); }
.em-seat .em-pairs { gap: 4px; }
.em-seat .em-pairs .pr { padding: 2px; }
.em-seat .em-mc { width: 18px; height: 18px; border-radius: 4px; }
.em-seat .em-mc .ea { width: 18px; height: 18px; }
.em-seat .flag { align-self: flex-start; }

/* Tapis central */
.em-mat {
  align-self: center; justify-self: center; width: min(560px, calc(100% - 20px)); margin: 10px auto;
  display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 14px 12px;
  border-radius: 46px / 36px;
  background: radial-gradient(ellipse at 50% 40%, #15606f 0%, #0d4652 70%, #0a3a44 100%);
  box-shadow: inset 0 0 0 2px rgba(244, 213, 141, .22), inset 0 0 40px rgba(0, 0, 0, .35), 0 14px 40px rgba(0, 0, 0, .4);
  outline: 1.5px dashed rgba(244, 213, 141, .28); outline-offset: -9px;
}
.em-status { display: flex; gap: 10px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.em-banner { font-weight: 700; text-align: center; padding: 6px 14px; border-radius: 999px; background: rgba(0, 0, 0, .22); min-height: 32px; max-width: 100%; }
.em-banner.mine { background: var(--hot); color: #fff; box-shadow: 0 6px 16px rgba(255, 106, 79, .35); }
.em-extra { font-size: 12px; background: rgba(255, 255, 255, .25); padding: 1px 7px; border-radius: 999px; margin-left: 4px; }
.em-lastchance { font-size: 12.5px; color: var(--accent); text-align: center; }
.em-piles { display: flex; justify-content: center; align-items: flex-end; gap: clamp(14px, 5vw, 34px); }
.em-pile-slot { display: flex; flex-direction: column; align-items: center; gap: 5px; position: relative; }
.em-pile-slot .lbl { font-size: 10px; }
.em-pile-slot.can .em-card, .em-pile-slot.can .em-empty { box-shadow: 0 0 0 3px var(--hot), 0 10px 20px rgba(0, 0, 0, .45); animation: em-bob 1.5s ease-in-out infinite; }
@keyframes em-bob { 50% { transform: translateY(-4px); } }
.em-pile-slot.deck .em-card { box-shadow: 2px 2px 0 #0a3540, 4px 4px 0 #082c35, 0 10px 20px rgba(0, 0, 0, .45); }
.em-pile-slot.deck.can .em-card { box-shadow: 2px 2px 0 #0a3540, 4px 4px 0 #082c35, 0 0 0 3px var(--hot), 0 10px 20px rgba(0, 0, 0, .45); }
.em-empty { width: 76px; height: 110px; border: 2px dashed rgba(232, 244, 240, .2); border-radius: 9px; }
.em-count { font-size: 12px; font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; min-height: 15px; }
.em-ticker { font-size: 12px; color: var(--muted); text-align: center; display: flex; flex-direction: column; gap: 1px; min-height: 30px; }
.em-ticker div:nth-child(2) { opacity: .6; }
.em-ticker b { color: var(--fg); }

/* Ma place : badge, paires, actions, éventail */
.em-me { position: relative; padding: 4px max(10px, env(safe-area-inset-left, 0px)) 0; }
.em-mebar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; max-width: 980px; margin: 0 auto; }
.em-mebadge { padding: 6px 12px 6px 8px; border-radius: 999px; background: rgba(8, 42, 51, .85); border: 1px solid rgba(232, 244, 240, .14); }
.em-me.active .em-mebadge { border-color: var(--accent); }
.em-mypairs .em-pairs { gap: 4px; }
.em-mypairs .em-mc { width: 22px; height: 22px; } .em-mypairs .em-mc .ea { width: 22px; height: 22px; }
.em-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.em-actions .btn { box-shadow: 0 6px 16px rgba(0, 0, 0, .35); }
.em-note { text-align: center; font-size: 12.5px; color: var(--muted); margin: 4px 0 0; }
.em-fan { position: relative; max-width: 980px; margin: 0 auto; }
.em-fan .em-card { position: absolute; bottom: var(--b, 10px); left: var(--x); transform: var(--t); transform-origin: 50% 130%;
  transition: transform .3s cubic-bezier(.2, .8, .2, 1), left .3s cubic-bezier(.2, .8, .2, 1), bottom .3s, box-shadow .2s; }
.em-fan .em-card.sel { transform: var(--t) translateY(-24px); box-shadow: inset 0 0 16px rgba(10, 14, 16, .22), 0 0 0 3px var(--accent), 0 16px 24px rgba(0, 0, 0, .5); }
@media (hover: hover) { .em-fan button.em-card:hover:not(.sel) { transform: var(--t) translateY(-10px); } }
.em-empty-hand { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); }
@media (min-width: 900px) {
  .em-fan .em-card:not(.big) { width: 92px; height: 133px; }
  .em-fan .em-card .nm { font-size: 13.5px; }
  .em-fan .em-card .hint { font-size: 9px; }
}

/* Animations : cartes qui arrivent, carte posée, cartes retournées, paires */
@keyframes em-in { from { transform: translateY(-42vh) scale(.5) rotate(-10deg); opacity: 0; } to { transform: var(--t); opacity: 1; } }
.em-fan .em-card.new { animation: em-in .6s cubic-bezier(.2, .8, .2, 1) both; animation-delay: var(--d, 0s); }
@keyframes em-drop { from { transform: translateY(-22px) scale(1.14) rotate(7deg); opacity: .2; } to { transform: none; opacity: 1; } }
.em-pile-slot .em-card.drop { animation: em-drop .38s ease-out both; }
@keyframes em-flip { from { transform: perspective(600px) rotateY(90deg) scale(.9); } to { transform: none; } }
.em-ov .em-card.flip { animation: em-flip .45s ease-out both; animation-delay: var(--d, 0s); }
@keyframes em-pop { from { transform: scale(.2); opacity: 0; } }
.pop { animation: em-pop .4s cubic-bezier(.2, .8, .2, 1.3) both; }

/* Surcouches (choix, fouille, vol, fin de manche) */
.em-ov { position: absolute; inset: 0; z-index: 20; display: flex; align-items: center; justify-content: center; padding: 14px;
  background: rgba(3, 18, 22, .58); backdrop-filter: blur(2px); animation: em-fade .2s ease-out both; }
@keyframes em-fade { from { opacity: 0; } }
.em-ov-box { width: min(440px, 100%); max-height: 100%; overflow: auto; display: flex; flex-direction: column; gap: 12px; align-items: stretch;
  background: linear-gradient(180deg, #11434f, #0b3540); border: 1px solid rgba(244, 213, 141, .3); border-radius: 18px; padding: 18px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .55); }
.em-ov-box.wide { width: min(640px, 100%); }
.em-ov-box h3 { font: 400 24px/1.1 var(--f-display); color: var(--accent); text-align: center; text-transform: none; letter-spacing: 0; margin: 0; }
.em-ov-box > p { text-align: center; }
.em-ov-box h2 { color: var(--accent); }
.actions.center { justify-content: center; }
.em-choice { display: flex; justify-content: center; gap: 18px; padding: 6px 0 4px; }
.em-pile-view { display: flex; flex-direction: column; gap: 6px; }
.em-pile-view .cards { display: flex; flex-wrap: wrap; gap: 6px; }
.em-steal-backs { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 4px 0; }
.em-steal-backs .em-card.pick { animation: em-pop .35s ease-out both; animation-delay: var(--d, 0s); transition: transform .15s; }
.em-steal-backs .em-card.pick:hover { transform: translateY(-8px) rotate(-2deg); }
.em-steal-backs .em-card.taken { transform: translateY(-12px) scale(1.06); box-shadow: 0 0 0 3px var(--hot), 0 14px 24px rgba(0, 0, 0, .5); transition: transform .2s, box-shadow .2s; }

/* Grands écrans : adversaires répartis autour du tapis */
@media (min-width: 900px) and (min-height: 600px) {
  .em-table { grid-template-columns: minmax(180px, 1fr) minmax(460px, 2.2fr) minmax(180px, 1fr); grid-template-rows: auto minmax(0, 1fr) auto;
    grid-template-areas: "top top top" "left mat right" "me me me"; }
  .em-seats { display: contents; }
  .em-seat { width: 220px; max-width: none; flex: none; }
  .em-seat.pos-top { grid-area: top; justify-self: center; margin-top: 12px; }
  .em-seat.pos-left { grid-area: left; justify-self: center; align-self: center; }
  .em-seat.pos-right { grid-area: right; justify-self: center; align-self: center; }
  .em-mat { grid-area: mat; }
  .em-me { grid-area: me; }
  .em-table[data-n="2"] .em-mat, .em-table[data-n="1"] .em-mat { margin-top: 20px; }
  .em-empty, .em-mat .em-card:not(.big) { width: 92px; height: 133px; }
}
@media (max-width: 420px) {
  .em-seat { padding: 7px 8px 8px; gap: 5px; }
  .em-av { width: 28px; height: 28px; font-size: 16px; }
  .em-seat .who b { font-size: 13px; }
  .em-mat { border-radius: 34px / 28px; padding: 10px 8px; gap: 6px; }
  .em-banner { font-size: 13.5px; }
  .em-actions { margin-left: 0; width: 100%; justify-content: center; }
  .em-empty { width: 68px; height: 100px; }
}

/* Règles : une vraie carte par sorte */
.em-refs { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.em-ref { align-items: center !important; }
.em-ref .em-card { transform: scale(.82); transform-origin: left center; margin-right: -12px; }

/* Cartes en vol (fx.js) : une copie traverse la table, recto et verso dos à dos pour se retourner */
.em-fx-layer { position: fixed; inset: 0; pointer-events: none; z-index: 60; overflow: hidden; }
.em-ghost { position: absolute; left: 0; top: 0; transform-style: preserve-3d; will-change: transform; }
.em-ghost .gf { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.em-ghost .gf.back { transform: rotateY(180deg); }
.em-ghost .gf > .em-card { width: 100%; height: 100%; box-shadow: inset 0 0 16px rgba(10, 14, 16, .22), 0 14px 26px rgba(0, 0, 0, .45); }
@keyframes em-land { from { filter: brightness(1.4) drop-shadow(0 0 8px rgba(244, 213, 141, .8)); } }
.em-land { animation: em-land .38s ease-out; }