/* ===================== L'IMPOSTEUR — DA "tableau d'enquête" =====================
   Bureau de détective la nuit : boiseries, lampe chaude, pluie à la fenêtre ; tableau en liège avec
   Polaroids punaisés, post-its manuscrits, fils rouges, tampons encreurs. Tout en CSS (pas d'image).
   Polices : Special Elite (machine à écrire), Permanent Marker (feutre), Caveat (post-its). */
:root{ --imp-ink:#2a2633; --imp-paper:#fbf6e9; --imp-kraft:#d7b98a; --imp-red:#c8102e; --imp-cork:#c8955c; }
body.imp-bg #app-bg{ background:
  radial-gradient(ellipse 60% 55% at 22% 18%, rgba(255,196,110,.38), transparent 70%),
  radial-gradient(ellipse at 50% 120%, rgba(0,0,0,.65), transparent 60%),
  repeating-linear-gradient(90deg, #3b2418 0 74px, #34200f 74px 76px, #432a1b 76px 150px, #2c1a0e 150px 152px); }
body.imp-bg #app-bg::after{ display:none; }
.imp-scene{ font-family:Nunito,sans-serif; }



/* boutons "tampon" */
.imp-btn{ font-family:'Special Elite',monospace; font-size:17px; letter-spacing:1px; text-transform:uppercase; cursor:pointer;
  color:#fff; background:var(--imp-red); border:3px double #fbf6e9; border-radius:6px; padding:12px 18px;
  box-shadow:0 4px 0 #7a0a1c, 0 8px 18px rgba(0,0,0,.35); transform:rotate(-1deg); transition:transform .1s, filter .15s; }
.imp-btn:hover{ filter:brightness(1.1); transform:rotate(0) scale(1.02); }
.imp-btn:active{ transform:translateY(3px); box-shadow:0 1px 0 #7a0a1c; }
.imp-btn:disabled{ filter:grayscale(1) brightness(.7); cursor:not-allowed; }
.imp-btn.ghost{ color:var(--imp-ink); background:transparent; border:2px solid var(--imp-ink); box-shadow:none; }
.imp-btn.small{ font-size:13px; padding:7px 11px; }
.imp-line{ display:flex; gap:8px; width:100%; }
.imp-line[hidden]{ display:none; }
.imp-line input{ flex:1; min-width:0; font-family:'Special Elite',monospace; font-size:20px; color:var(--imp-ink); text-align:center;
  background:transparent; border:none; border-bottom:2px dashed var(--imp-ink); padding:8px 6px; outline:none; }
.imp-line input:focus{ border-bottom-style:solid; border-color:var(--imp-red); }
#imp-join-code{ text-transform:uppercase; letter-spacing:8px; }

/* ---------- accueil : bureau ---------- */
.imp-home{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:30px; width:min(900px,96vw); }
.imp-title{ font-family:'Special Elite',monospace; font-weight:normal; font-size:clamp(38px,8vw,72px); color:var(--imp-red); margin:0; letter-spacing:4px;
  border:6px solid var(--imp-red); border-radius:10px; padding:0 22px; transform:rotate(-3deg); background:rgba(251,246,233,.92);
  box-shadow:0 10px 30px rgba(0,0,0,.45); animation:imp-title-in .5s cubic-bezier(.2,1.6,.4,1) both; }
.imp-title span{ font-size:.7em; }
@keyframes imp-title-in{ from{ transform:rotate(-3deg) scale(2.5); opacity:0; } }
.imp-home-grid{ display:grid; grid-template-columns:1fr 1fr; gap:34px 22px; width:100%; }
@media (max-width:760px){ .imp-home-grid{ grid-template-columns:1fr; } }
.imp-folder{ position:relative; background:linear-gradient(170deg,#e2c697,var(--imp-kraft)); border-radius:4px 14px 14px 14px; padding:30px 20px 20px;
  box-shadow:0 14px 30px rgba(0,0,0,.45), inset 0 0 0 1px rgba(90,53,25,.3); display:flex; flex-direction:column; align-items:center; gap:14px; color:var(--imp-ink); }
.imp-folder-tab{ position:absolute; top:-26px; left:0; font-family:'Special Elite',monospace; font-size:14px; text-transform:uppercase; letter-spacing:2px;
  background:#e2c697; padding:5px 18px 6px; border-radius:10px 10px 0 0; }
.imp-folder::after{ content:"CONFIDENTIEL"; position:absolute; right:14px; top:10px; font-family:'Special Elite',monospace; font-size:11px; color:var(--imp-red);
  border:2px solid var(--imp-red); padding:0 5px; transform:rotate(6deg); opacity:.75; }

/* éditeur d'avatar : la Polaroid au centre, les flèches alignées sur chapeau / tête / tenue */
.imp-ed-stage{ position:relative; width:100%; max-width:340px; display:flex; justify-content:center; }
.imp-ed-pol{ width:min(200px,50vw); --rot:-2deg; }
.imp-ed-pol .imp-pol-name{ font-size:20px; }
.imp-ed-arrows{ position:absolute; inset:0; z-index:2; pointer-events:none; }
.imp-ed-row{ position:absolute; left:0; right:0; display:flex; justify-content:space-between; align-items:center; }
.imp-ed-h{ top:9%; } .imp-ed-t{ top:36%; } .imp-ed-b{ top:62%; }
.imp-arrow{ pointer-events:auto; width:44px; height:44px; border-radius:50%; border:3px solid var(--imp-ink); background:var(--imp-paper); color:var(--imp-ink);
  font-size:15px; cursor:pointer; box-shadow:0 3px 0 var(--imp-ink); transition:transform .1s; }
.imp-arrow:hover{ transform:scale(1.1); } .imp-arrow:active{ transform:translateY(2px); box-shadow:none; }
.imp-ed-label{ display:none; }
.imp-ed-colors{ display:flex; gap:7px; flex-wrap:wrap; justify-content:center; }
.imp-swatch{ width:28px; height:28px; border-radius:50%; background:var(--c); border:3px solid var(--imp-paper); box-shadow:0 0 0 2px var(--imp-ink); cursor:pointer; transition:transform .1s; }
.imp-swatch.on{ transform:scale(1.25); box-shadow:0 0 0 3px var(--imp-ink), 0 0 12px var(--c); }

.imp-cases > .imp-btn:first-of-type{ width:100%; font-size:20px; }
.imp-open-title{ align-self:flex-start; font-family:'Special Elite',monospace; text-transform:uppercase; letter-spacing:1px; font-size:13px; border-bottom:2px solid var(--imp-ink); }
.imp-open-list{ width:100%; display:flex; flex-direction:column; gap:6px; max-height:210px; overflow:auto; }
.imp-open-row{ display:flex; align-items:center; gap:8px; background:rgba(251,246,233,.7); border-radius:6px; padding:6px 8px; font-size:14px; }
.imp-open-row b{ font-family:'Special Elite',monospace; color:var(--imp-red); letter-spacing:2px; }
.imp-open-host{ font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.imp-open-meta{ margin-left:auto; font-size:12px; opacity:.75; white-space:nowrap; }
.imp-empty{ font-family:'Caveat',cursive; font-size:21px; opacity:.7; }

/* ---------- Polaroid ---------- */
.imp-pol{ position:relative; background:var(--imp-paper); padding:7px 7px 6px; border-radius:2px; transform:rotate(var(--rot,0deg));
  box-shadow:0 6px 14px rgba(0,0,0,.4); transition:transform .25s, filter .3s, box-shadow .3s; }
.imp-pol-photo{ position:relative; aspect-ratio:1; overflow:hidden;
  background:radial-gradient(circle at 50% 35%, color-mix(in srgb, var(--pc,#3fa7d6) 50%, #fff), var(--pc,#3fa7d6)); box-shadow:inset 0 0 0 2px rgba(0,0,0,.12); }
.imp-pol-photo.bump{ animation:imp-bump .25s; }
.imp-av{ display:block; width:100%; height:100%; }
.imp-pol-name{ font-family:'Permanent Marker',cursive; font-size:16px; text-align:center; color:color-mix(in srgb, var(--pc,var(--imp-ink)) 75%, #000); margin-top:3px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.imp-pin{ position:absolute; top:-7px; left:50%; width:18px; height:18px; margin-left:-9px; border-radius:50%; z-index:3;
  background:radial-gradient(circle at 35% 30%, #ff8a8a, var(--imp-red) 55%, #6d0013); box-shadow:2px 3px 3px rgba(0,0,0,.45); }
/* avatars vivants : respiration + clignement (transform-box -> autour de leur propre centre) */
.imp-av .av-body{ transform-box:fill-box; transform-origin:50% 100%; animation:imp-breathe 3.2s ease-in-out infinite; }
.imp-av .av-eyes{ transform-box:fill-box; transform-origin:50% 50%; animation:imp-blink 4.5s infinite; }
.imp-pol:nth-child(2n) .av-eyes{ animation-delay:1.7s; } .imp-pol:nth-child(3n) .av-body{ animation-delay:.8s; }
.imp-shock .av-mouth{ display:none; } .imp-shock .av-mouth-o{ display:inline; }
.imp-shock .imp-av{ animation:imp-tremble .15s 6; }
@keyframes imp-breathe{ 50%{ transform:scaleY(1.03); } }
@keyframes imp-blink{ 0%,94%,100%{ transform:scaleY(1); } 97%{ transform:scaleY(.1); } }
@keyframes imp-tremble{ 25%{ transform:translateX(-2px); } 75%{ transform:translateX(2px); } }
@keyframes imp-bump{ 50%{ transform:scale(1.06) rotate(2deg); } }

/* ---------- salle de jeu ---------- */
.imp-room{ position:relative; z-index:1; display:flex; flex-direction:column; gap:12px; width:min(980px,97vw); margin:auto 0; }
.imp-room.shake{ animation:imp-shake .35s; }
@keyframes imp-shake{ 20%{ transform:translate(-6px,3px); } 40%{ transform:translate(5px,-4px); } 60%{ transform:translate(-3px,2px); } 80%{ transform:translate(2px,-1px); } }
.imp-hud{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.imp-tab{ font-family:'Special Elite',monospace; font-size:15px; text-transform:uppercase; cursor:pointer; color:var(--imp-ink);
  background:#e2c697; border:none; border-radius:10px 10px 4px 4px; padding:7px 14px; box-shadow:0 4px 10px rgba(0,0,0,.4); }
.imp-tab b{ color:var(--imp-red); letter-spacing:3px; font-size:18px; }
.imp-manche{ font-family:'Special Elite',monospace; color:#f3e3c3; font-size:16px; text-shadow:0 2px 4px #000; }
.imp-manche em{ font-style:normal; color:#ffd36b; }
.imp-spec-count{ color:#f3e3c3; font-weight:800; }
.imp-spec-count[hidden]{ display:none; }
/* mèche de dynamite */
.imp-fuse{ margin-left:auto; display:flex; align-items:center; gap:12px; width:min(260px,40vw); }
.imp-fuse[hidden]{ display:none; }
.imp-fuse > span{ font-family:'Special Elite',monospace; color:#f3e3c3; font-size:18px; min-width:40px; text-align:right; order:2; }
.imp-fuse-cord{ position:relative; height:6px; border-radius:3px; transition:width .2s linear;
  background:repeating-linear-gradient(60deg,#d9c39a 0 4px,#8a6a3a 4px 7px); box-shadow:0 1px 2px #000; }
.imp-spark{ position:absolute; right:-9px; top:50%; width:18px; height:18px; margin-top:-9px; border-radius:50%;
  background:radial-gradient(circle,#fff 0 15%,#ffe14d 30%,#ff8a3d 55%,transparent 70%); animation:imp-spark .12s infinite alternate; }
@keyframes imp-spark{ to{ transform:scale(1.4) rotate(45deg); filter:brightness(1.3); } }
.imp-fuse.urgent > span{ color:#ff5a5a; animation:imp-pulse .5s infinite alternate; }
.imp-fuse.urgent .imp-spark{ width:28px; height:28px; margin-top:-14px; right:-14px; }
@keyframes imp-pulse{ to{ transform:scale(1.15); } }

/* tableau en liège */
.imp-board{ position:relative; border:16px solid #5a3519; border-radius:8px; padding:26px 18px 18px; min-height:240px;
  box-shadow:inset 0 0 0 2px #2a170b, inset 0 0 40px rgba(0,0,0,.45), 0 18px 40px rgba(0,0,0,.55);
  background:radial-gradient(circle at 20% 30%, rgba(0,0,0,.13) 1px, transparent 2px) 0 0/9px 9px,
    radial-gradient(circle at 70% 60%, rgba(255,255,255,.13) 1px, transparent 2px) 0 0/11px 11px,
    radial-gradient(circle at 40% 80%, rgba(90,50,20,.25) 2px, transparent 3px) 0 0/17px 17px, var(--imp-cork); }
.imp-players{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(auto-fit,minmax(118px,140px)); justify-content:center; gap:84px 26px; padding-bottom:70px; }
.imp-players .imp-pol{ animation:imp-pin-in .4s cubic-bezier(.2,1.5,.4,1) both; }
@keyframes imp-pin-in{ from{ transform:translateY(-30px) rotate(calc(var(--rot,0deg) * 3)); opacity:0; } }
.imp-pol.me{ box-shadow:0 0 0 3px #ffd36b, 0 6px 14px rgba(0,0,0,.4); }
.imp-pol.off{ filter:grayscale(.8) brightness(.8); }
.imp-pol-score{ position:absolute; top:10px; right:-10px; font-family:'Special Elite',monospace; font-size:12px; color:var(--imp-ink);
  background:#ffd36b; padding:1px 6px; transform:rotate(8deg); box-shadow:0 2px 3px rgba(0,0,0,.3); z-index:2; }
.imp-pol-badge{ position:absolute; left:50%; bottom:34px; transform:translateX(-50%) rotate(-6deg); font-family:'Special Elite',monospace; font-size:12px;
  background:var(--imp-paper); color:var(--imp-ink); padding:1px 7px; border:1px solid var(--imp-ink); white-space:nowrap; z-index:2; }
.imp-pol-badge[hidden]{ display:none; }
.imp-pol-clues{ position:absolute; left:-10px; right:-10px; top:calc(100% + 6px); display:flex; flex-wrap:wrap; justify-content:center; gap:4px; z-index:2; pointer-events:none; }
.imp-postit{ font-family:'Caveat',cursive; font-size:21px; line-height:1; color:#2a2633; padding:5px 8px 6px; max-width:100%; overflow-wrap:anywhere;
  background:color-mix(in srgb, var(--pc) 35%, #fff6a8); transform:rotate(var(--r)); box-shadow:0 3px 5px rgba(0,0,0,.3);
  animation:imp-postit .35s cubic-bezier(.2,1.6,.4,1) both; }
.imp-postit.skipped{ opacity:.6; }
@keyframes imp-postit{ from{ transform:scale(0) rotate(30deg); } }
/* projecteur sur celui qui parle */
.imp-board.spot .imp-pol:not(.speaking){ filter:brightness(.55) saturate(.6); }
.imp-pol.speaking{ transform:translateY(-8px) rotate(0) scale(1.07); z-index:4; box-shadow:0 0 0 3px #ffe9a8, 0 0 40px 10px rgba(255,214,120,.55), 0 14px 22px rgba(0,0,0,.45); }
.imp-pol.speaking .imp-pol-photo::after{ content:"✍️"; position:absolute; right:4px; bottom:2px; font-size:24px; animation:imp-pulse .4s infinite alternate; }
/* vote : lumière éteinte + lampe de poche */
.imp-flash{ position:absolute; inset:-16px; z-index:3; pointer-events:none; opacity:0; transition:opacity .5s; border-radius:8px;
  background:radial-gradient(circle 170px at var(--mx,50%) var(--my,40%), transparent 45%, rgba(5,3,10,.7) 100%); }
.imp-board.dark .imp-flash{ opacity:1; }
.imp-pol.votable{ cursor:pointer; z-index:5; } .imp-pol.votable:hover{ transform:scale(1.06) rotate(0); }
.imp-pol.my-vote{ box-shadow:0 0 0 4px var(--imp-red), 0 6px 14px rgba(0,0,0,.4); z-index:5; }
.imp-strings{ position:absolute; inset:0; width:100%; height:100%; z-index:6; pointer-events:none; overflow:visible; }
.imp-string{ fill:none; stroke:var(--c); stroke-width:3; stroke-linecap:round; filter:drop-shadow(1px 2px 1px rgba(0,0,0,.4)); stroke-dasharray:1; stroke-dashoffset:0; }
.imp-string.draw{ stroke-dashoffset:1; animation:imp-draw .5s ease-out forwards; }
@keyframes imp-draw{ to{ stroke-dashoffset:0; } }
/* tampons + chute */
.imp-stamp{ position:absolute; left:50%; top:40%; z-index:6; font-family:'Special Elite',monospace; font-size:20px; letter-spacing:2px; white-space:nowrap;
  padding:2px 10px; border:4px solid currentColor; border-radius:6px; transform:translate(-50%,-50%) rotate(-14deg);
  background:rgba(251,246,233,.6); animation:imp-stamp-in .35s cubic-bezier(.2,1.6,.4,1) both; }
.imp-stamp.red{ color:var(--imp-red); } .imp-stamp.blue{ color:#1f4fb5; }
@keyframes imp-stamp-in{ from{ transform:translate(-50%,-50%) rotate(-14deg) scale(3.2); opacity:0; } }
.imp-pol.fallen{ animation:imp-fall 1.1s cubic-bezier(.5,0,.8,.4) forwards; z-index:6; }
@keyframes imp-fall{ 15%{ transform:rotate(18deg) translateY(4px); } 100%{ transform:rotate(70deg) translate(60px,120vh); } }
.imp-pol-photo.wiggle{ animation:imp-wiggle .4s; } @keyframes imp-wiggle{ 30%{ transform:rotate(-6deg) scale(1.05); } 60%{ transform:rotate(5deg); } }
.imp-bubble{ position:absolute; top:-30px; right:-14px; z-index:7; font-size:28px; background:#fff; border-radius:50%; width:46px; height:46px;
  display:grid; place-items:center; box-shadow:0 4px 10px rgba(0,0,0,.4); animation:imp-bubble 1.6s forwards; }
@keyframes imp-bubble{ 0%{ transform:scale(0); } 15%{ transform:scale(1.2); } 25%,80%{ transform:scale(1); } 100%{ transform:scale(1) translateY(-14px); opacity:0; } }

/* bas : enveloppe (rôle) + note d'action */
.imp-bottom{ display:grid; grid-template-columns:minmax(220px,300px) 1fr; gap:16px; align-items:stretch; }
@media (max-width:760px){ .imp-bottom{ grid-template-columns:1fr; } }
.imp-envelope[hidden] + .imp-note{ grid-column:1 / -1; }
.imp-envelope{ font:inherit; position:relative; cursor:pointer; border:none; padding:14px; border-radius:6px; text-align:center;
  background:linear-gradient(160deg,#e2c697,#c9a46a); box-shadow:0 10px 24px rgba(0,0,0,.45); }
.imp-envelope[hidden]{ display:none; }
.imp-envelope::before{ content:""; position:absolute; left:0; right:0; top:0; height:44%; clip-path:polygon(0 0,100% 0,50% 100%); background:rgba(90,53,25,.18); }
.imp-card{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:2px; background:var(--imp-paper); padding:12px 10px;
  box-shadow:0 3px 8px rgba(0,0,0,.25); color:var(--imp-ink); }
.imp-envelope.open .imp-card{ animation:imp-slide .6s cubic-bezier(.2,1.3,.4,1) both; }
@keyframes imp-slide{ from{ transform:translateY(40px) scale(.9); opacity:0; } }
.imp-card small{ font-family:'Special Elite',monospace; text-transform:uppercase; letter-spacing:2px; font-size:11px; opacity:.7; }
.imp-card strong{ font-family:'Special Elite',monospace; font-weight:normal; font-size:clamp(24px,4vw,34px); line-height:1.1; }
.imp-card em{ font-style:normal; font-size:13px; font-weight:700; opacity:.85; }
.imp-card.torn{ clip-path:polygon(0 6%,8% 0,20% 6%,34% 0,48% 5%,62% 0,76% 6%,90% 0,100% 5%,100% 100%,0 100%); }
.imp-envelope.is-imp .imp-card strong{ color:var(--imp-red); letter-spacing:8px; }
.imp-envelope.is-imp .imp-card b{ color:var(--imp-red); }
.imp-envelope.masked .imp-card strong, .imp-envelope.masked .imp-card em{ filter:blur(9px); }
.imp-seal{ position:absolute; z-index:2; right:12px; bottom:10px; width:30px; height:30px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#e8434f,#8a0a1c); box-shadow:0 2px 4px rgba(0,0,0,.4); }
.imp-note{ position:relative; display:flex; flex-direction:column; gap:10px; justify-content:center; padding:16px 18px 16px 44px; color:var(--imp-ink);
  background:repeating-linear-gradient(transparent 0 27px, #b7cbe6 27px 28px), var(--imp-paper); border-radius:3px; box-shadow:0 10px 24px rgba(0,0,0,.45); }
.imp-note::before{ content:""; position:absolute; left:30px; top:0; bottom:0; width:2px; background:#e8a0a0; }
.imp-msg{ font-family:'Special Elite',monospace; font-size:16px; line-height:1.6; }
.imp-msg .hl{ background:#ffe14d; padding:0 4px; } .imp-msg .bad{ color:var(--imp-red); font-weight:bold; } .imp-msg .good{ color:#1d7a3e; font-weight:bold; }
.imp-result{ font-size:19px; margin-bottom:4px; }
.imp-note-btns{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.imp-note-btns #imp-start{ flex:1; }
.imp-note [hidden]{ display:none !important; }
.imp-foot{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.imp-reacts{ display:flex; gap:6px; flex-wrap:wrap; }
.imp-react{ font-size:22px; width:42px; height:42px; border-radius:50%; border:none; cursor:pointer; background:rgba(251,246,233,.9); box-shadow:0 3px 0 #5a3519; transition:transform .1s; }
.imp-react:hover{ transform:scale(1.15) rotate(-8deg); } .imp-react:active{ transform:translateY(2px); box-shadow:none; }
.imp-foot .imp-btn.ghost{ color:#f3e3c3; border-color:#f3e3c3; }

/* effets plein écran */
.imp-fx{ position:fixed; inset:0; pointer-events:none; z-index:50; overflow:hidden; }
.imp-ink{ position:fixed; width:9px; height:9px; border-radius:50%; background:var(--imp-red); animation:imp-ink .6s ease-out forwards; }
@keyframes imp-ink{ to{ transform:translate(var(--dx),var(--dy)) scale(.3); opacity:0; } }
.imp-confetti{ position:fixed; top:-20px; width:10px; height:14px; background:var(--c); clip-path:polygon(0 0,100% 10%,90% 100%,5% 85%);
  animation:imp-conf linear forwards; }
@keyframes imp-conf{ to{ transform:translate(var(--dx),110vh) rotate(var(--rz)); } }
.imp-float{ position:fixed; bottom:-40px; font-size:38px; animation:imp-floatup 2.6s ease-out forwards; }
@keyframes imp-floatup{ to{ transform:translateY(-70vh) rotate(20deg); opacity:0; } }

/* podium (fin de partie) */
.imp-podium{ position:fixed; inset:0; z-index:40; display:grid; place-items:center; background:rgba(10,5,2,.72); animation:imp-fade .4s; }
.imp-podium[hidden]{ display:none; }
@keyframes imp-fade{ from{ opacity:0; } }
.imp-podium-in{ display:flex; flex-direction:column; align-items:center; gap:18px; }
.imp-podium h2{ font-family:'Special Elite',monospace; font-weight:normal; color:var(--imp-red); background:var(--imp-paper); border:5px solid var(--imp-red); padding:2px 18px;
  transform:rotate(-3deg); font-size:clamp(26px,5vw,40px); margin:0; animation:imp-title-in .5s cubic-bezier(.2,1.6,.4,1) both; }
.imp-steps{ display:flex; align-items:flex-end; gap:10px; }
.imp-step{ display:flex; flex-direction:column; align-items:center; gap:4px; width:min(150px,28vw); animation:imp-pin-in .5s cubic-bezier(.2,1.5,.4,1) both; }
.imp-step.p1{ animation-delay:.6s; } .imp-step.p2{ animation-delay:.3s; }
.imp-pol.mini{ width:80%; --rot:-3deg; }
.imp-step.p1 .imp-pol.mini{ width:95%; --rot:2deg; box-shadow:0 0 30px 6px rgba(255,214,120,.6); }
.imp-step-name{ font-family:'Permanent Marker',cursive; font-size:18px; filter:brightness(1.2); text-shadow:0 2px 3px #000; }
.imp-step-block{ width:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; font-family:'Special Elite',monospace;
  font-size:36px; color:var(--imp-ink); background:linear-gradient(#e2c697,#b08850); border-radius:6px 6px 0 0; box-shadow:inset 0 -6px 0 rgba(0,0,0,.2); }
.imp-step-block small{ font-size:14px; }
.imp-step.p1 .imp-step-block{ height:130px; } .imp-step.p2 .imp-step-block{ height:95px; } .imp-step.p3 .imp-step-block{ height:70px; }
.imp-podium-in .imp-btn.ghost{ color:#f3e3c3; border-color:#f3e3c3; }

/* mobile : 3 Polaroids par rangée, plus compactes */
@media (max-width:560px){
  .imp-board{ border-width:10px; padding:20px 8px 8px; }
  .imp-players{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:62px 12px; padding-bottom:56px; }
  .imp-pol{ padding:5px 5px 4px; }
  .imp-pol-name{ font-size:12px; }
  .imp-pol-score{ font-size:10px; right:-6px; }
  .imp-postit{ font-size:15px; padding:3px 5px 4px; }
  .imp-stamp{ font-size:12px; border-width:3px; padding:1px 5px; letter-spacing:1px; }
  .imp-pol-badge{ font-size:10px; bottom:24px; }
  .imp-msg{ font-size:14px; }
  .imp-react{ width:38px; height:38px; font-size:19px; }
  .imp-fuse{ width:100%; margin-left:0; }
}

/* réglage du son, version "enquête" : étiquette kraft punaisée, piste = fil rouge, curseur = punaise */
body.imp-bg #audio-ctrl{ background:linear-gradient(170deg,#e2c697,var(--imp-kraft)); border:none; border-radius:3px; padding:9px 14px 7px 10px;
  transform:rotate(2deg); box-shadow:0 6px 14px rgba(0,0,0,.5), inset 0 0 0 1px rgba(90,53,25,.35); backdrop-filter:none; }
body.imp-bg #audio-ctrl::before{ content:""; position:absolute; top:-6px; left:50%; width:13px; height:13px; margin-left:-6px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #ff8a8a, var(--imp-red) 55%, #6d0013); box-shadow:1px 2px 2px rgba(0,0,0,.45); }
body.imp-bg #mute-btn{ color:var(--imp-ink); }
body.imp-bg #audio-ctrl input[type=range]{ height:26px; }
body.imp-bg #audio-ctrl input[type=range]::-webkit-slider-runnable-track{ height:3px; border-radius:2px; background:var(--imp-red); box-shadow:0 1px 1px rgba(0,0,0,.35); }
body.imp-bg #audio-ctrl input[type=range]::-moz-range-track{ height:3px; border-radius:2px; background:var(--imp-red); }
body.imp-bg #audio-ctrl input[type=range]::-webkit-slider-thumb{ width:18px; height:18px; margin-top:-7.5px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #ff8a8a, var(--imp-red) 55%, #6d0013); box-shadow:1px 2px 3px rgba(0,0,0,.5); }
body.imp-bg #audio-ctrl input[type=range]::-moz-range-thumb{ width:18px; height:18px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #ff8a8a, var(--imp-red) 55%, #6d0013); box-shadow:1px 2px 3px rgba(0,0,0,.5); }

/* ---------- écran pseudo (landing partagé) en version enquête ---------- */
body.imp-bg #landing .landing-inner{ position:relative; gap:18px; padding:34px 34px 24px; width:min(440px,92vw);
  background:linear-gradient(170deg,#e2c697,var(--imp-kraft)); border-radius:4px 14px 14px 14px; color:var(--imp-ink);
  box-shadow:0 18px 40px rgba(0,0,0,.55), inset 0 0 0 1px rgba(90,53,25,.3); }
body.imp-bg #landing .landing-inner::before{ content:"Dossier d'accès"; position:absolute; top:-26px; left:0; font-family:'Special Elite',monospace; font-size:14px;
  text-transform:uppercase; letter-spacing:2px; background:#e2c697; padding:5px 18px 6px; border-radius:10px 10px 0 0; }
body.imp-bg #landing .landing-inner::after{ content:"CONFIDENTIEL"; position:absolute; right:14px; bottom:14px; font-family:'Special Elite',monospace; font-size:11px;
  color:var(--imp-red); border:2px solid var(--imp-red); padding:0 5px; transform:rotate(6deg); opacity:.75; }
body.imp-bg #logo-text{ font-family:'Special Elite',monospace; font-weight:normal; font-size:clamp(34px,9vw,58px); line-height:1.15; letter-spacing:3px; color:var(--imp-red);
  text-shadow:none; border:5px solid var(--imp-red); border-radius:8px; padding:0 16px; transform:rotate(-3deg); background:rgba(251,246,233,.92);
  box-shadow:0 8px 20px rgba(0,0,0,.3); animation:imp-title-in .5s cubic-bezier(.2,1.6,.4,1) both; margin-top:6px; }
body.imp-bg #logo-text span{ font-size:.7em; }
body.imp-bg .tagline{ color:var(--imp-ink); font-family:'Special Elite',monospace; font-weight:normal; opacity:.8; }
body.imp-bg #landing .field{ width:100%; color:var(--imp-ink); font-family:'Special Elite',monospace; font-weight:normal; letter-spacing:2px; }
body.imp-bg #landing .field input{ font-family:'Special Elite',monospace; font-size:22px; font-weight:normal; color:var(--imp-ink); text-align:center;
  background:rgba(251,246,233,.6); border:none; border-bottom:2px dashed var(--imp-ink); border-radius:4px 4px 0 0; box-shadow:none; }
body.imp-bg #landing .field input:focus{ border-bottom:2px solid var(--imp-red); box-shadow:none; }
body.imp-bg #land-back{ color:var(--imp-ink); font-family:'Special Elite',monospace; }

/* bouton JOUER : médaillon (détective en Polaroid ronde, bordure dorée) + plaque rouge façon tampon */
#btn-play.imp-play{ position:relative; display:flex; align-items:center; width:min(320px,80vw); height:84px; padding:0 0 0 64px; border:none; background:none;
  cursor:pointer; font:inherit; -webkit-tap-highlight-color:transparent; transition:transform .12s ease, filter .12s ease; }
#btn-play.imp-play:hover{ transform:scale(1.04) rotate(-1deg); filter:brightness(1.08); }
#btn-play.imp-play:active{ transform:scale(.97); }
#btn-play.imp-play:focus-visible{ outline:3px dashed var(--imp-red); outline-offset:6px; }
.imp-play-label{ flex:1; height:62px; display:flex; align-items:center; justify-content:center; padding-left:30px;
  font-family:'Special Elite',monospace; font-size:34px; letter-spacing:6px; color:#fbf6e9; text-shadow:0 2px 0 #6d0013;
  background:linear-gradient(#e0213f,var(--imp-red) 55%,#9a0a22); border-radius:0 31px 31px 0;
  box-shadow:inset 0 0 0 3px #6d0013, inset 0 0 0 6px rgba(251,246,233,.85), inset 0 0 0 8px #6d0013, inset 0 3px 0 9px rgba(255,255,255,.18), 0 6px 0 #5a0a18, 0 12px 22px rgba(0,0,0,.45); }
.imp-play-medal{ position:absolute; left:0; top:0; width:84px; height:84px; border-radius:50%; overflow:hidden; z-index:1;
  background:radial-gradient(circle at 50% 38%, #8fd0f0, #3fa7d6); box-shadow:0 0 0 5px #fbf6e9, 0 0 0 9px #c99a3a, 0 0 0 11px #6d4a12, 0 8px 16px rgba(0,0,0,.45); }
.imp-play-medal .imp-av{ width:100%; height:100%; transform:translateY(6%) scale(1.12); }

/* ===================== DÉCOR ANIMÉ DU BUREAU (imposteur-decor.js) ===================== */
#imp-decor{ display:none; position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
body.imp-bg #imp-decor{ display:block; }
/* lampe suspendue qui se balance + poussière dans le cône de lumière */
.impd-lamp{ position:absolute; top:0; left:20vw; width:120px; transform-origin:60px 0; animation:impd-sway 7s ease-in-out infinite; }
@keyframes impd-sway{ 0%,100%{ transform:rotate(2.2deg); } 50%{ transform:rotate(-2.2deg); } }
.impd-cord{ display:block; width:3px; height:9vh; margin:0 auto; background:#1a0f08; }
.impd-shade{ display:block; width:120px; margin-top:-2px; filter:drop-shadow(0 0 18px rgba(255,214,120,.55)); }
.impd-cone{ position:absolute; top:calc(9vh + 50px); left:50%; width:62vw; height:90vh; transform:translateX(-50%); clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);
  background:linear-gradient(rgba(255,214,130,.20), rgba(255,214,130,.04) 70%, transparent); }
.impd-cone b{ position:absolute; width:3px; height:3px; border-radius:50%; background:rgba(255,236,190,.8); animation:impd-dust 9s linear infinite; }
.impd-cone b:nth-child(1){ left:48%; top:10%; } .impd-cone b:nth-child(2){ left:40%; top:30%; animation-delay:-2s; } .impd-cone b:nth-child(3){ left:58%; top:22%; animation-delay:-4s; }
.impd-cone b:nth-child(4){ left:35%; top:55%; animation-delay:-6s; } .impd-cone b:nth-child(5){ left:62%; top:48%; animation-delay:-1s; } .impd-cone b:nth-child(6){ left:52%; top:70%; animation-delay:-3s; }
.impd-cone b:nth-child(7){ left:28%; top:80%; animation-delay:-5s; } .impd-cone b:nth-child(8){ left:70%; top:75%; animation-delay:-7s; } .impd-cone b:nth-child(9){ left:45%; top:42%; animation-delay:-8s; }
.impd-cone b:nth-child(10){ left:55%; top:60%; animation-delay:-2.5s; } .impd-cone b:nth-child(11){ left:38%; top:18%; animation-delay:-4.5s; } .impd-cone b:nth-child(12){ left:65%; top:35%; animation-delay:-6.5s; }
@keyframes impd-dust{ 0%{ transform:translate(0,0); opacity:0; } 20%{ opacity:1; } 50%{ transform:translate(14px,-22px); } 80%{ opacity:.8; } 100%{ transform:translate(-8px,-44px); opacity:0; } }

/* horloge + affiche + portemanteau */
.impd-clock{ position:absolute; top:9vh; left:4vw; width:clamp(80px,7vw,120px); filter:drop-shadow(0 8px 10px rgba(0,0,0,.5)); }
.impd-clock svg{ display:block; width:100%; }
.impd-clock-city{ display:block; width:max-content; margin:4px auto 0; padding:1px 8px; font-family:'Special Elite',monospace; font-size:11px; letter-spacing:2px; text-transform:uppercase;
  color:#3b2418; background:linear-gradient(#e8c66a,#b8913a); border-radius:2px; box-shadow:0 2px 3px rgba(0,0,0,.5); }
.impd-clock-city:empty{ display:none; }
.impd-poster{ position:absolute; top:34vh; left:3.5vw; width:clamp(110px,10vw,160px); padding:10px 10px 12px; text-align:center; transform:rotate(-4deg);
  background:linear-gradient(#efe0bd,#d9c08e); color:#3b2418; box-shadow:0 10px 18px rgba(0,0,0,.5); font-family:'Special Elite',monospace; }
.impd-poster b{ display:block; font-size:clamp(18px,1.8vw,26px); letter-spacing:2px; }
.impd-poster-av{ position:relative; margin:4px 0; background:#b08850; border:3px solid #3b2418; }
.impd-poster-av .imp-av{ filter:brightness(0) opacity(.85); }
.impd-poster-av span{ position:absolute; inset:0; display:grid; place-items:center; font-family:'Permanent Marker',cursive; font-size:clamp(34px,3.4vw,54px); color:#efe0bd; }
.impd-poster em{ display:block; font-style:normal; font-size:clamp(11px,1vw,14px); color:var(--imp-red); }
.impd-poster small{ display:block; font-size:clamp(9px,.8vw,11px); margin-top:3px; }
.impd-rack{ position:absolute; bottom:5vh; right:9vw; height:44vh; aspect-ratio:120/400; filter:drop-shadow(6px 8px 10px rgba(0,0,0,.55)); }
.impd-rack svg{ display:block; height:100%; }

/* fenêtre : ciel, ville, bandit, pluie, éclair, store vénitien, cadre */
.impd-window{ position:absolute; top:9vh; right:5vw; width:clamp(180px,17vw,290px); aspect-ratio:3/4; border-radius:3px; overflow:hidden;
  box-shadow:0 0 0 12px #2a170b, 0 0 0 14px #1a0f08, 0 18px 40px 12px rgba(0,0,0,.55); }
.impd-sky{ position:absolute; inset:0; background:linear-gradient(#06101f,#14243c 70%,#22324a); }
.impd-sky.on{ animation:impd-skyflash .7s; } @keyframes impd-skyflash{ 8%{ filter:brightness(2.6); } 16%{ filter:brightness(1.1); } 26%{ filter:brightness(2); } 100%{ filter:none; } }
.impd-moon{ position:absolute; top:30%; right:16%; width:22%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 40% 40%,#fff8d8,#e9dca8); box-shadow:0 0 30px 8px rgba(255,248,216,.25); }
.impd-cloud{ position:absolute; height:12%; border-radius:50px; background:rgba(30,42,62,.95); filter:blur(3px); animation:impd-cloud 40s linear infinite; }
.impd-cloud.a{ top:28%; width:70%; } .impd-cloud.b{ top:38%; width:50%; animation-duration:58s; animation-delay:-20s; }
@keyframes impd-cloud{ from{ transform:translateX(-80%); } to{ transform:translateX(160%); } }
.impd-city{ position:absolute; left:0; right:0; bottom:0; width:100%; height:55%; }
.impd-lit{ animation:impd-lit 20s steps(1) infinite; } @keyframes impd-lit{ 0%,70%{ opacity:1; } 71%,100%{ opacity:.15; } }
.impd-rain{ position:absolute; inset:0; width:100%; height:100%; z-index:3; }
.impd-flash{ position:absolute; inset:0; z-index:4; background:#dfe8ff; opacity:0; }
.impd-flash.on{ animation:impd-flash .7s; }
@keyframes impd-flash{ 0%{ opacity:0; } 8%{ opacity:.85; } 16%{ opacity:.1; } 26%{ opacity:.6; } 100%{ opacity:0; } }
.impd-roomflash{ position:absolute; inset:0; background:#cdd9ff; opacity:0; mix-blend-mode:screen; }
.impd-roomflash.on{ animation:impd-roomflash .7s; } @keyframes impd-roomflash{ 8%{ opacity:.22; } 16%{ opacity:0; } 26%{ opacity:.14; } 100%{ opacity:0; } }
.impd-blinds{ position:absolute; top:0; left:0; right:0; height:24%; z-index:5; display:flex; flex-direction:column; }
.impd-blinds i{ flex:1; margin-bottom:2px; background:linear-gradient(#d9c39a,#b39467); box-shadow:0 2px 2px rgba(0,0,0,.45); }
.impd-blind-cord{ position:absolute; right:12%; top:0; width:2px; height:170%; background:#e9dcc0; }
.impd-blind-cord::after{ content:""; position:absolute; bottom:-6px; left:-4px; width:10px; height:10px; border-radius:50%; background:#c99a3a; }
.impd-frame{ position:absolute; inset:0; z-index:6;
  background:linear-gradient(90deg,transparent calc(50% - 6px),#2a170b calc(50% - 6px) calc(50% + 6px),transparent calc(50% + 6px)),
    linear-gradient(transparent calc(55% - 6px),#2a170b calc(55% - 6px) calc(55% + 6px),transparent calc(55% + 6px));
  box-shadow:inset 0 0 0 6px #2a170b, inset 0 0 26px rgba(0,0,0,.6); }
/* bandit : derrière la pluie, sous le store */
.impd-bandit{ position:absolute; inset:0; z-index:2; }
.impd-bandit-body{ position:absolute; bottom:0; left:12%; width:76%; transform:translateY(110%); }
.impd-bandit-body svg, .impd-hands svg{ display:block; width:100%; }
.impd-hands{ position:absolute; bottom:-2px; left:8%; width:84%; transform:translateY(110%); }
.impd-bandit .impd-pupils, .impd-bandit .impd-lids{ transform-box:fill-box; }
.impd-bandit .impd-lids{ transform-origin:50% 0; transform:scaleY(0); }
.impd-bandit.peek .impd-bandit-body{ animation:impd-peek 6.5s ease-in-out both; }
.impd-bandit.peek .impd-hands{ animation:impd-hands 6.5s ease-in-out both; }
.impd-bandit.peek .impd-pupils, .impd-bandit.peek-side .impd-pupils{ animation:impd-look 6.5s ease-in-out both; }
.impd-bandit.peek .impd-lids, .impd-bandit.peek-side .impd-lids{ animation:impd-blink 6.5s both; }
.impd-bandit.peek-side .impd-bandit-body{ animation:impd-peek-side 6.5s ease-in-out both; }
@keyframes impd-peek{ 0%{ transform:translateY(110%); } 14%{ transform:translateY(30%); } 20%{ transform:translateY(34%); } 26%,72%{ transform:translateY(30%); }
  78%{ transform:translateY(24%) rotate(3deg); } 84%{ transform:translateY(30%); } 100%{ transform:translateY(115%); } }
@keyframes impd-hands{ 0%,6%{ transform:translateY(110%); } 14%,82%{ transform:translateY(0); } 92%,100%{ transform:translateY(110%); } }
@keyframes impd-peek-side{ 0%{ transform:translate(-120%,40%) rotate(-24deg); } 16%,76%{ transform:translate(-52%,40%) rotate(-16deg); } 82%{ transform:translate(-58%,40%) rotate(-18deg); } 100%{ transform:translate(-125%,40%) rotate(-24deg); } }
@keyframes impd-look{ 0%,24%{ transform:translate(0,0); } 30%,40%{ transform:translate(-6px,0); } 46%,56%{ transform:translate(6px,0); } 62%,100%{ transform:translate(0,2px); } }
@keyframes impd-blink{ 0%,58%{ transform:scaleY(0); } 60%{ transform:scaleY(1); } 62%,100%{ transform:scaleY(0); } }

/* bureau au premier plan : bord de table + café fumant + loupe + papiers */
.impd-desk{ position:absolute; left:0; right:0; bottom:0; height:9vh; background:linear-gradient(#6b3d1f,#4a2a14 30%,#2e190b);
  box-shadow:0 -4px 0 #7d4a26, 0 -14px 30px rgba(0,0,0,.45); }
.impd-mug{ position:absolute; bottom:4vh; left:6vw; width:clamp(50px,4.5vw,76px); overflow:visible; filter:drop-shadow(4px 6px 5px rgba(0,0,0,.5)); }
.impd-steam path{ animation:impd-steam 3.2s ease-in-out infinite; opacity:0; }
.impd-steam path:nth-child(2){ animation-delay:1s; } .impd-steam path:nth-child(3){ animation-delay:2s; }
@keyframes impd-steam{ 0%{ transform:translateY(10px) scaleY(.6); opacity:0; } 40%{ opacity:.8; } 100%{ transform:translateY(-22px) scaleY(1.1); opacity:0; } }
.impd-loupe{ position:absolute; bottom:2.5vh; right:7vw; width:clamp(90px,8vw,140px); transform:rotate(-12deg); filter:drop-shadow(4px 6px 5px rgba(0,0,0,.5)); }
.impd-papers{ position:absolute; bottom:3vh; left:12vw; }
.impd-papers i{ position:absolute; bottom:0; width:clamp(60px,6vw,96px); aspect-ratio:3/4; background:#f2ead6; box-shadow:0 2px 4px rgba(0,0,0,.4);
  transform:rotate(-8deg) scaleY(.35); transform-origin:bottom; }
.impd-papers i:nth-child(2){ left:20px; transform:rotate(6deg) scaleY(.35); background:#e9dcc0; } .impd-papers i:nth-child(3){ left:46px; transform:rotate(-2deg) scaleY(.35); }

/* écrans moyens : on garde fenêtre + lampe + bureau ; petits écrans : seulement lampe + bureau */
@media (max-width:1250px){ .impd-poster, .impd-rack, .impd-clock{ display:none; } }
@media (max-width:900px){ .impd-window, .impd-clock, .impd-loupe, .impd-papers{ display:none; } .impd-lamp{ left:50%; margin-left:-60px; } }
@media (prefers-reduced-motion:reduce){ #imp-decor *{ animation:none !important; } }

/* ---------- rôles Undercover : éliminés, tampon Mr White, réglage de la composition ---------- */
.imp-pol.dead{ filter:grayscale(.9) brightness(.8); transform:rotate(calc(var(--rot,0deg) * 2.5)) translateY(6px); }
.imp-stamp.white{ color:#2a2633; background:rgba(255,255,255,.85); }
.imp-cfg{ display:flex; gap:10px; flex-wrap:wrap; margin:6px 0 4px; }
.imp-cfg-item{ display:inline-flex; align-items:center; gap:6px; padding:3px 8px; border:2px dashed currentColor; border-radius:6px; font-size:15px; }
.imp-cfg-item.red{ color:var(--imp-red); } .imp-cfg-item.white{ color:var(--imp-ink); }
.imp-cfg-item b{ font-size:20px; }
.imp-cfg-btn{ width:28px; height:28px; border-radius:50%; border:2px solid currentColor; background:var(--imp-paper); color:inherit; font:inherit; font-size:18px; line-height:1; cursor:pointer; }
.imp-cfg-btn:disabled{ opacity:.3; cursor:not-allowed; }