/* Undercover : film noir et dossier de police. Noir et blanc granuleux, une seule touche de rouge
   (tampons, votes, éliminations), faisceau de projecteur qui balaie, fiches de suspects tapées à la machine. */
@font-face { font-family: 'Noir'; src: url('../fonts/noir.woff2') format('woff2'); font-display: swap; }

.ag-undercover {
  --uc-red: #e0161e; --uc-red-hi: #ff434a; /* même rouge, éclairci pour le texte sur fond noir */
  --uc-paper: #e9e3d3; --uc-paper-2: #d6cfbd; --uc-ink: #191919; --uc-ink-2: #59554d; --uc-smoke: #bdb7a9;
  --uc-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  --uc-worn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -4 2.7'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
  --fun-font: 'Noir', 'Courier New', monospace;
  --fun-bg: radial-gradient(120% 90% at 50% 0%, #313131 0%, #161616 50%, #060606 100%);
  --fun-ink: #ece6d8; --fun-line: #000; --fun-accent: var(--uc-red); --fun-card: var(--uc-paper);
  --fun-btn: var(--uc-red); --fun-btn-ink: #f7f2e6; --fun-title: #f3eee2; --fun-shadow: #000; --fun-bad: var(--uc-red-hi); --fun-good: #f3eee2;
}

/* ---------- Écran : en-tête, grain, vignette, projecteur ---------- */
.ag.fun.ag-undercover .ag-hud { border-bottom: 1px solid #ffffff14; }
.ag.fun.ag-undercover .ag-title { rotate: 0deg; font-size: clamp(1rem, 4.6vw, 1.35rem); letter-spacing: .24em; text-transform: uppercase; color: var(--fun-title); text-shadow: 0 0 18px #fff4; }
.ag.fun.ag-undercover .ag-title::after { content: ''; display: block; width: 58%; height: 3px; margin-top: 3px; background: var(--uc-red); }
.ag.fun.ag-undercover .ag-info { color: var(--uc-smoke); font-size: .85rem; letter-spacing: .04em; }
.ag.fun.ag-undercover .mg-quit { background: var(--uc-paper); color: var(--uc-ink); border: 2px solid #000; box-shadow: 0 3px 0 #000; font-family: var(--fun-font); font-weight: 400; }
.ag.fun.ag-undercover .ag-body { padding: 6px 10px 10px; }
.ag-undercover::after { content: ''; position: absolute; inset: 0; z-index: 4; pointer-events: none; background: radial-gradient(130% 100% at 50% 40%, #0000 55%, #000000a8 100%); }
/* Le grain déborde de sa boîte pour bouger : la boîte coupe, sinon l'écran deviendrait défilable */
.uc-grain { position: absolute; inset: 0; z-index: 30; overflow: hidden; pointer-events: none; opacity: .2; mix-blend-mode: overlay; }
.uc-grain::before { content: ''; position: absolute; inset: -60px; background: var(--uc-noise) 0 0 / 200px 200px; animation: ucGrain .7s steps(6) infinite; }
@keyframes ucGrain { 0% { transform: translate(0, 0); } 20% { transform: translate(-30px, 18px); } 40% { transform: translate(22px, -26px); } 60% { transform: translate(-14px, -8px); } 80% { transform: translate(26px, 30px); } 100% { transform: translate(-6px, 12px); } }
.uc-beam { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.uc-beam i { position: absolute; left: 50%; top: -14%; width: 76vmax; height: 150vmax; margin-left: -38vmax; transform-origin: 50% 0; will-change: transform;
  background: linear-gradient(90deg, #0000 8%, #ffffff12 32%, #ffffff26 50%, #ffffff12 68%, #0000 92%); clip-path: polygon(47% 0, 53% 0, 100% 100%, 0 100%);
  animation: ucSweep 11s ease-in-out infinite alternate; }
.uc-beam i + i { width: 50vmax; margin-left: -25vmax; opacity: .55; animation-duration: 16s; animation-delay: -7s; }
@keyframes ucSweep { 0% { transform: rotate(-34deg); } 48% { opacity: 1; } 52% { opacity: .82; } 56% { opacity: 1; } 100% { transform: rotate(34deg); } }
@media (prefers-reduced-motion: reduce) { .uc-grain::before, .uc-beam i { animation: none; } }

.uc-wait { margin-top: 32vh; text-align: center; font-family: var(--fun-font); letter-spacing: .12em; animation: ucBlink 1.2s steps(2) infinite; }
@keyframes ucBlink { 50% { opacity: .35; } }
@keyframes ucFade { from { opacity: 0; } }
@keyframes ucFadeOut { to { opacity: 0; } }
@keyframes ucDrop { from { transform: translateY(-40px) rotate(-6deg) scale(1.08); opacity: 0; } }
@keyframes ucShake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
@keyframes ucType { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }

/* ---------- Tampons (seule touche de rouge) ---------- */
.uc-stamp { position: absolute; z-index: 3; right: 6px; top: 34px; padding: 3px 9px 2px; border: 3px double var(--uc-red); border-radius: 3px; color: var(--uc-red);
  font-family: var(--fun-font); font-size: .95rem; line-height: 1.1; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; rotate: -14deg; pointer-events: none;
  background: #e0161e10; -webkit-mask: var(--uc-worn) 0 0 / 120px 120px; mask: var(--uc-worn) 0 0 / 120px 120px; }
.uc-stamp.is-new { animation: ucStamp .5s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes ucStamp { 0% { transform: scale(3.2); opacity: 0; } 55% { transform: scale(.94); opacity: 1; } 100% { transform: scale(1); } }
.uc-stamp.is-mini { position: static; rotate: -6deg; padding: 1px 5px; border-width: 2px; font-size: .66rem; letter-spacing: .06em; -webkit-mask-size: 60px 60px; mask-size: 60px 60px; }
.uc-stamp.is-big { position: absolute; left: 50%; right: auto; top: 46%; translate: -50% -50%; padding: 6px 16px 4px; border-width: 6px; font-size: clamp(1.6rem, 8vw, 2.5rem); animation-delay: .25s; }

/* ---------- Partie ---------- */
.uc-game { position: relative; height: 100%; max-width: 1300px; margin: 0 auto; display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto minmax(112px, 23%); grid-template-areas: 'top' 'board' 'act' 'side'; }
@media (orientation: landscape) and (min-width: 600px) {
  /* Paysage (Discord sur ordinateur, téléphone couché) : la discussion à droite sur toute la hauteur */
  .uc-game { grid-template-columns: minmax(0, 1fr) clamp(220px, 28vw, 330px); grid-template-rows: auto minmax(0, 1fr) auto; grid-template-areas: 'top side' 'board side' 'act side'; }
}
.uc-slot { display: contents; }

/* En-tête : onglet de phase, étiquette du mot, chrono */
.uc-top { grid-area: top; display: flex; align-items: center; gap: 10px; min-width: 0; }
.uc-phase { flex: none; max-width: 42%; display: grid; line-height: 1.05; padding: 5px 22px 6px 12px; background: var(--uc-paper); color: var(--uc-ink); font-family: var(--fun-font);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%); }
.uc-phase small { font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--uc-ink-2); }
.uc-phase b { font-weight: 400; font-size: clamp(.8rem, 3.4vw, 1.1rem); letter-spacing: .05em; text-transform: uppercase; }
.uc-mine { flex: 1; min-width: 0; display: flex; justify-content: center; }
.uc-tag { position: relative; display: inline-flex; flex-direction: column; align-items: flex-start; max-width: 100%; min-width: 0; padding: 5px 14px 6px 26px; text-align: left; border: 0; cursor: pointer;
  font: inherit; font-family: var(--fun-font); background: var(--uc-paper-2); color: var(--uc-ink); rotate: -1.5deg;
  clip-path: polygon(14px 0, 100% 0, 100% 100%, 14px 100%, 0 50%); transition: transform .2s; }
.uc-tag::before { content: ''; position: absolute; left: 10px; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: #111; box-shadow: inset 0 0 0 1.5px #8a8a8a; }
.uc-tag:active { transform: scale(.96); }
.uc-tag small { font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--uc-ink-2); }
.uc-tag b { max-width: 100%; font-weight: 400; font-size: clamp(.95rem, 4.2vw, 1.3rem); line-height: 1.05; letter-spacing: .05em; text-transform: uppercase; overflow-wrap: break-word; transition: filter .25s; }
.uc-tag.is-white b { color: var(--uc-red); }
.uc-tag.is-hidden b { filter: blur(7px); }
.uc-clock { --p: 0; position: relative; flex: none; width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; border: 2px solid var(--uc-paper);
  background: linear-gradient(#ffffff30, #ffffff30) 50% 0 / 1px 100% no-repeat, linear-gradient(#ffffff30, #ffffff30) 0 50% / 100% 1px no-repeat,
    conic-gradient(#e9e3d3d0 calc(var(--p) * 360deg), #ffffff0d 0), #101010;
  box-shadow: 0 0 0 3px #000, 0 0 22px #0009; }
.uc-clock b { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #101010; box-shadow: 0 0 0 1px #ffffff40;
  font-family: var(--fun-font); font-weight: 400; font-size: 1.05rem; color: #f3eee2; }
.uc-clock.is-low { border-color: var(--uc-red); }
.uc-clock.is-low b { color: var(--uc-red-hi); animation: ucBlink .5s steps(2) infinite; }

/* Tableau des suspects */
.uc-board { grid-area: board; position: relative; z-index: 1; min-height: 0; overflow-x: hidden; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(146px, 1fr));
  grid-auto-rows: max-content; /* sinon les lignes se tassent à la hauteur du tableau */
  gap: 20px 12px; align-content: start; padding: 16px 6px 12px; scrollbar-width: thin; scrollbar-color: #ffffff33 #0000; }
.uc-card { --tilt: 0deg; position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 7px 9px; align-content: start; padding: 11px 10px 12px; min-height: 104px;
  background: repeating-linear-gradient(#0000 0 21px, #0000001a 21px 22px) 0 74px / 100% 100% no-repeat, var(--uc-paper);
  color: var(--uc-ink); font-family: var(--fun-font); border-radius: 2px; rotate: var(--tilt); box-shadow: 0 12px 18px -8px #000d, inset 0 0 0 1px #00000014;
  transition: transform .25s, filter .35s, box-shadow .25s, rotate .25s; }
.uc-card:nth-child(4n+1) { --tilt: -1.4deg; } .uc-card:nth-child(4n+2) { --tilt: 1deg; } .uc-card:nth-child(4n+3) { --tilt: -.5deg; } .uc-card:nth-child(4n) { --tilt: 1.6deg; }
.uc-clip { position: absolute; z-index: 2; top: -15px; left: 16px; width: 14px; height: 32px; color: #a2a2a2; rotate: 8deg; filter: drop-shadow(1px 1px 0 #000b); pointer-events: none; }
.uc-photo { position: relative; width: 48px; height: 58px; overflow: hidden; border: 2px solid #191919; background: repeating-linear-gradient(#0000 0 5px, #0000002e 5px 6px), #a7a195; }
.uc-photo img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.3) brightness(.92); }
.uc-id { min-width: 0; display: grid; align-content: center; line-height: 1.12; }
.uc-id small { font-size: .56rem; letter-spacing: .12em; text-transform: uppercase; color: var(--uc-ink-2); }
.uc-id b { font-weight: 400; font-size: 1rem; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uc-clues { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2px 10px; font-size: .95rem; line-height: 1.35; min-width: 0; }
.uc-clues li { overflow-wrap: anywhere; }
.uc-clues i { margin-right: 3px; font-style: normal; font-size: .58rem; vertical-align: super; color: var(--uc-ink-2); }
.uc-clues .is-auto { color: var(--uc-ink-2); }
.uc-clues .is-empty { font-size: .72rem; color: var(--uc-ink-2); }
.uc-clues .is-new { animation: ucType .7s steps(10) both; }
/* Celui qui dépose est sous le projecteur, les autres dans l'ombre */
.uc-board.has-speaker .uc-card:not(.is-speaker) { filter: brightness(.6); }
.uc-card.is-speaker { z-index: 2; rotate: 0deg; transform: scale(1.05); box-shadow: 0 0 0 2px #fff, 0 0 46px 12px #ffffff3a, 0 14px 24px -6px #000; }
.uc-flag { position: absolute; top: -10px; right: 8px; padding: 2px 8px; background: #111; color: var(--uc-paper); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; animation: ucBlink 1s steps(2) infinite; }
/* Éliminé : fiche assombrie, nom barré, tampon du rôle */
.uc-card.is-out::after { content: ''; position: absolute; inset: 0; z-index: 1; background: #000000 var(--uc-noise) 0 0 / 160px; opacity: .45; pointer-events: none; }
.uc-card.is-out .uc-photo img { filter: grayscale(1) contrast(1.1) brightness(.55); }
.uc-card.is-out .uc-id b { text-decoration: line-through; text-decoration-color: var(--uc-red); text-decoration-thickness: 2px; }
.uc-gone { position: absolute; z-index: 2; top: 8px; right: 8px; font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: var(--uc-paper); background: #111; padding: 1px 6px; }
/* Vote */
.uc-board.is-voting .uc-card:not(.can-vote):not(.is-out) { filter: brightness(.75); }
.uc-card.can-vote { cursor: pointer; }
.uc-card.can-vote:hover, .uc-card.can-vote:focus-visible { outline: none; rotate: 0deg; transform: translateY(-4px); box-shadow: 0 0 0 2px var(--uc-red), 0 16px 22px -6px #000; }
.uc-card.is-picked { rotate: 0deg; box-shadow: 0 0 0 3px var(--uc-red), 0 16px 22px -6px #000; }
.uc-ring { position: absolute; z-index: 2; left: 2px; top: 4px; width: 66px; height: 74px; border: 3px solid var(--uc-red); border-radius: 50%; rotate: -10deg; pointer-events: none;
}
.uc-ring.is-new { animation: ucRing .35s ease-out both; }
@keyframes ucRing { from { clip-path: inset(0 0 100% 0); transform: scale(1.3); } }
.uc-voted { position: absolute; z-index: 2; top: 8px; right: 8px; padding: 1px 6px; border: 1.5px solid var(--uc-red); color: var(--uc-red); font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; rotate: 6deg; }
.uc-voted.is-new { animation: ucStamp .35s cubic-bezier(.2, 1.4, .4, 1) both; }
.uc-tally { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; padding-top: 4px; border-top: 1px dashed #0000004d; color: var(--uc-red); font-size: .8rem; }
.uc-tally.is-new { animation: ucFade .5s both; }
.uc-tally b { font-weight: 400; font-size: 1.25rem; line-height: 1; }
.uc-tally small { min-width: 0; font-size: .7rem; color: var(--uc-ink-2); overflow-wrap: anywhere; }
.uc-card.is-sent { box-shadow: 0 0 0 3px var(--uc-red), 0 16px 22px -6px #000; }

/* Zone d'action : consigne, saisie de l'indice ou de la devinette */
.uc-act { grid-area: act; position: relative; z-index: 2; min-height: 44px; display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; align-content: center; gap: 5px; text-align: center; }
.uc-hint { font-family: var(--fun-font); font-size: clamp(.92rem, 3.8vw, 1.08rem); color: var(--fun-ink); }
.uc-hint b { font-weight: 400; color: #fff; text-decoration: underline; text-decoration-color: #ffffff55; }
.uc-hint.is-me { color: #fff; text-shadow: 0 0 14px #fff6; }
.uc-form { display: flex; gap: 8px; width: min(480px, 100%); }
.uc-form input { flex: 1; min-width: 0; padding: 9px 12px; font-family: var(--fun-font); font-size: 1.2rem; color: var(--uc-ink); background: var(--uc-paper); border: 0; border-bottom: 3px solid #000;
  border-radius: 2px; box-shadow: inset 0 2px 8px #0004, 0 0 0 2px #ffffff30; }
.uc-form input:focus { outline: 2px solid #fff; outline-offset: 1px; }
.uc-form .fun-btn { padding: 8px 14px; }
.uc-form.is-sending { opacity: .6; }
.uc-err { min-height: 1.1em; font-family: var(--fun-font); font-size: .88rem; color: var(--uc-red-hi); }
.uc-err.is-on { animation: ucShake .35s; }
.uc-note { font-family: var(--fun-font); font-size: .75rem; color: var(--uc-smoke); }

/* Discussion */
.uc-side { grid-area: side; position: relative; z-index: 2; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 6px; }
.uc-chat { list-style: none; margin: 0; padding: 8px 10px; min-height: 0; overflow-y: auto; display: grid; align-content: start; gap: 3px; background: #0b0b0bdb; border: 1px solid #ffffff1f; border-radius: 3px;
  font-family: var(--fun-font); font-size: .86rem; color: #d9d3c4; box-shadow: inset 0 0 24px #000; scrollbar-width: thin; scrollbar-color: #ffffff33 #0000; }
.uc-chat li { line-height: 1.28; overflow-wrap: anywhere; }
.uc-chat b { font-weight: 400; color: #fff; }
.uc-chat .is-me b { text-decoration: underline; }
.uc-chat .is-ghost { opacity: .5; }
.uc-chat .is-sys { color: #948e82; font-size: .8rem; }
.uc-chat .is-clue { color: #f3eee2; }
.uc-chat .is-bad { color: var(--uc-red-hi); }
.uc-chat .is-round { margin-top: 3px; padding-top: 3px; border-top: 1px dashed #ffffff33; text-align: center; letter-spacing: .2em; text-transform: uppercase; color: #fff; }
.uc-say { display: flex; gap: 6px; }
.uc-say input { flex: 1; min-width: 0; padding: 8px 10px; font-family: var(--fun-font); font-size: 1rem; color: #f3eee2; background: #161616; border: 1px solid #ffffff33; border-radius: 3px; }
.uc-say input::placeholder, .uc-form input::placeholder { color: #8a857a; }
.uc-say input:focus { outline: 1px solid #fff; }
.uc-send { flex: none; width: 42px; border: 0; border-radius: 3px; background: var(--uc-paper); color: var(--uc-ink); font-family: var(--fun-font); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.uc-send:active { transform: translateY(2px); }

/* Ouverture du dossier : chacun découvre son mot */
.uc-intro { position: absolute; inset: 0; z-index: 9; display: grid; place-items: center; padding: 16px; background: #000000d0; animation: ucFade .3s both; }
.uc-intro.out { animation: ucFadeOut .45s both; }
.uc-env { position: relative; width: min(380px, 100%); display: grid; justify-items: center; gap: 8px; padding: 46px 22px 24px; text-align: center; rotate: -1deg;
  background: repeating-linear-gradient(#0000 0 25px, #0000001a 25px 26px), var(--uc-paper); color: var(--uc-ink); font-family: var(--fun-font); box-shadow: 0 30px 60px #000;
  animation: ucDrop .55s cubic-bezier(.2, 1.3, .4, 1) both; }
.uc-env small { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--uc-ink-2); }
.uc-type { font-weight: 400; font-size: clamp(1.8rem, 9vw, 2.8rem); line-height: 1.1; letter-spacing: .05em; text-transform: uppercase; overflow-wrap: anywhere; animation: ucType 1.1s steps(14) .45s both; }
.uc-type.is-none { color: var(--uc-ink-2); }
.uc-env p { font-size: .9rem; line-height: 1.35; color: var(--uc-ink-2); }
.uc-env em { font-style: normal; color: var(--uc-red); text-transform: uppercase; }
.uc-stamp.is-conf { top: 12px; right: auto; left: 50%; translate: -50% 0; rotate: -4deg; font-size: .8rem; animation: ucStamp .5s cubic-bezier(.2, 1.4, .4, 1) .15s both; }

/* Élimination : grande fiche tamponnée */
.uc-verdict { position: absolute; inset: 0; z-index: 12; display: grid; place-items: center; padding: 16px; background: #000000b8; cursor: pointer; animation: ucFade .25s both; }
.uc-verdict.out { animation: ucFadeOut .4s both; }
.uc-v-card { position: relative; display: grid; justify-items: center; gap: 6px; min-width: 220px; padding: 26px 30px 28px; background: var(--uc-paper); color: var(--uc-ink); font-family: var(--fun-font);
  rotate: -2deg; box-shadow: 0 0 80px 20px #ffffff1c, 0 30px 60px #000; animation: ucDrop .4s cubic-bezier(.2, 1.3, .4, 1) both; }
.uc-v-card .uc-clip { top: -18px; left: 28px; width: 18px; height: 42px; }
.uc-v-card .uc-photo { width: 96px; height: 116px; }
.uc-v-card b { font-weight: 400; font-size: 1.5rem; text-transform: uppercase; max-width: 70vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uc-v-card small { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--uc-ink-2); }

/* ---------- Salle d'attente et fin : dossier papier ---------- */
.uc-center { height: 100%; overflow-x: hidden; overflow-y: auto; display: grid; place-items: center; padding: 20px 0 12px; }
.ag-undercover .fun-dialog { position: relative; border: 0; border-radius: 2px; text-align: left; rotate: -.6deg; font-family: var(--fun-font); color: var(--uc-ink);
  background: repeating-linear-gradient(#0000 0 27px, #00000014 27px 28px) 0 64px / 100% 100% no-repeat, var(--uc-paper); box-shadow: 0 30px 60px -10px #000, 0 0 70px #ffffff12;
  animation: ucDrop .5s cubic-bezier(.2, 1.3, .4, 1) both; }
.ag-undercover .fun-dialog-wrap { background: #000000b0; }
.ag-undercover .fun-title { color: var(--uc-ink); text-shadow: none; font-size: clamp(1.4rem, 6.5vw, 1.9rem); letter-spacing: .03em; text-transform: uppercase; }
.ag-undercover .fun-sub { font-weight: 400; color: var(--uc-ink-2); opacity: 1; }
.ag-undercover .fun-actions { justify-content: flex-end; }
.ag-undercover .fun-actions .fun-sub { align-self: center; }
.ag-undercover .fun-btn { font-family: var(--fun-font); font-size: .98rem; letter-spacing: .08em; text-transform: uppercase; color: var(--uc-ink); background: var(--uc-paper); border: 2px solid #000; border-radius: 2px; box-shadow: 0 4px 0 #000; }
.ag-undercover .fun-btn.is-main { background: var(--uc-red); color: #f7f2e6; }
.ag-undercover .fun-shout { font-family: var(--fun-font); text-transform: uppercase; letter-spacing: .12em; -webkit-text-stroke: 0; color: #f3eee2; text-shadow: 0 0 24px #000, 0 0 3px #000, 0 0 40px #fff5; }
.uc-file .uc-clip { top: -18px; left: 26px; width: 18px; height: 42px; }
.uc-file-tab { margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid #0003; font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; color: var(--uc-ink-2); }
.uc-file .uc-stamp.is-verdict { top: 30px; right: 12px; rotate: 12deg; font-size: 1.35rem; border-width: 4px; }
.uc-file.is-over .fun-title { padding-right: 96px; }
.uc-rules { display: grid; gap: 6px; margin: 8px 0 10px; padding-left: 18px; font-size: .86rem; line-height: 1.32; }
.uc-rules b { font-weight: 400; text-decoration: underline; }
.uc-words { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0 6px; }
.uc-words span { display: grid; min-width: 0; padding: 6px 10px; background: #ffffff70; border: 1px solid #0003; }
.uc-words small { font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: var(--uc-ink-2); }
.uc-words b { font-weight: 400; font-size: 1.15rem; text-transform: uppercase; overflow-wrap: anywhere; }
.uc-roster { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px 10px; margin: 10px 0 4px; padding: 0; }
.uc-roster.is-over { grid-template-columns: minmax(0, 1fr); }
.uc-roster li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 4px 8px; background: #0000000a; border-bottom: 1px dashed #00000033; }
.uc-roster li.is-me { background: #00000014; }
.uc-roster .fav { filter: grayscale(1) contrast(1.15); }
.uc-r-name { min-width: 0; display: grid; line-height: 1.15; }
.uc-r-name b { font-weight: 400; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uc-r-name small { font-size: .74rem; color: var(--uc-ink-2); overflow-wrap: anywhere; }
.uc-r-name em { font-style: normal; color: var(--uc-red); text-transform: uppercase; letter-spacing: .06em; }

/* Grands écrans : fiches plus grandes */
@media (min-width: 900px) and (min-height: 600px) {
  .uc-board { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 24px 16px; }
  .uc-photo { width: 58px; height: 70px; }
  .uc-ring { width: 76px; height: 86px; }
  .uc-id b { font-size: 1.15rem; }
  .uc-clues { font-size: 1.05rem; }
}
/* Écrans peu hauts : tout se resserre */
@media (max-height: 560px) {
  .ag.fun.ag-undercover .ag-hud { padding: 6px 12px 2px; }
  .uc-game { gap: 5px; }
  .uc-clock { width: 42px; height: 42px; } .uc-clock b { width: 26px; height: 26px; font-size: .9rem; }
  .uc-board { gap: 16px 10px; padding-top: 12px; }
  .uc-card { min-height: 0; }
  .uc-photo { width: 40px; height: 48px; }
  .uc-form input { padding: 6px 10px; font-size: 1.05rem; }
}

/* ---------- Tuile du salon ---------- */
.uc-art .uc-art-beam { transform-box: view-box; transform-origin: 50px 3px; animation: ucArtSweep 5s ease-in-out infinite alternate; }
@keyframes ucArtSweep { from { transform: rotate(-12deg); } to { transform: rotate(12deg); } }