/* Puissance 4 */
:root{ --p4r:#ff4d5e; --p4y:#ffd23f; --p4board:#21449e; }

/* Tuile du hub */
.game-tile.p4{box-shadow:inset 0 -40px 60px -40px var(--p4r)}
.gt-mark .gt-r{color:var(--p4r)}
.gt-mark .gt-y{color:var(--p4y)}

/* Entête joueurs */
#screen-p4 .player.p-a .mark, #screen-p4-local .player.p-a .mark{color:var(--p4r)}
#screen-p4 .player.p-b .mark, #screen-p4-local .player.p-b .mark{color:var(--p4y)}
.player.p-a.active{border-color:rgba(255,77,94,.55);box-shadow:0 0 24px -6px var(--p4r)}
.player.p-b.active{border-color:rgba(255,210,63,.55);box-shadow:0 0 24px -6px var(--p4y)}

/* Plateau */
.p4-board{
  display:grid;grid-template-columns:repeat(7,1fr);gap:5px;
  background:linear-gradient(160deg,#2a52c4,var(--p4board));
  padding:8px;border-radius:16px;margin:0 auto;max-width:360px;
  aspect-ratio:7/6;box-shadow:inset 0 2px 0 rgba(255,255,255,.12), 0 16px 40px -18px #000;
}
.p4-col{
  display:grid;grid-template-rows:repeat(6,1fr);gap:5px;
  background:transparent;border:0;padding:3px;border-radius:10px;cursor:default;min-width:0;
}
.p4-board.playable .p4-col{cursor:pointer}
.p4-board.playable .p4-col:hover{background:rgba(255,255,255,.10)}
.p4-cell{
  border-radius:50%;aspect-ratio:1;min-width:0;
  background:radial-gradient(circle at 38% 32%, #0e1330, #070a1c);
  box-shadow:inset 0 2px 4px rgba(0,0,0,.6);
}
.p4-cell.a{background:radial-gradient(circle at 38% 30%, #ff8a96, var(--p4r));box-shadow:inset 0 -3px 6px rgba(0,0,0,.35),0 0 14px -2px var(--p4r)}
.p4-cell.b{background:radial-gradient(circle at 38% 30%, #ffe48a, var(--p4y));box-shadow:inset 0 -3px 6px rgba(0,0,0,.35),0 0 14px -2px var(--p4y)}
.p4-cell.win{outline:3px solid #fff;outline-offset:-3px;animation:p4flash 1s ease-in-out infinite}
@keyframes p4flash{50%{outline-color:rgba(255,255,255,.35)}}
.p4-cell.drop{animation:p4fall .34s cubic-bezier(.45,0,.85,.5)}
@keyframes p4fall{from{transform:translateY(-340%)}to{transform:translateY(0)}}