/* Page Jouer : accueil, salon et compléments de la table multijoueur */
.home{display:flex;flex-direction:column;align-items:center;gap:18px;padding-top:clamp(8px,3vw,28px)}
.home-hero{text-align:center;max-width:640px}
.home-hero h1{font-family:var(--display);font-weight:800;font-size:clamp(26px,4.4vw,40px);line-height:1.1;margin:0;letter-spacing:-.01em}
.home-hero h1 span{color:var(--brass);white-space:nowrap}
.home-hero p{margin:8px 0 0;color:var(--muted)}
.about{width:100%;max-width:760px;display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:16px}
.about .panel{padding:18px 20px}
.about h2{font-size:19px;margin-bottom:8px}
.about h3{font-size:14px;margin:14px 0 4px;color:var(--brass)}
.about p{margin:6px 0}
.about a{color:var(--brass)}
.steps{margin:6px 0;padding-left:20px;display:grid;gap:6px}
.home-card{max-width:420px;width:100%;display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:22px}
.home-card h2{font-size:24px}
.home-card p{margin:0}
.field{display:grid;gap:6px;font-size:13px;color:var(--muted)}
input{font:inherit;color:var(--ink);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:9px 12px;min-width:0}
input:focus{border-color:var(--brass);outline:none}
.btn.big{padding:11px 16px;font-size:16px}
.or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.or::before,.or::after{content:"";flex:1;border-top:1px solid var(--line)}
.joinrow{display:flex;gap:8px}
.joinrow input{flex:1;width:100%;text-transform:uppercase;letter-spacing:.3em;font-family:var(--display);font-weight:800;font-size:18px;text-align:center}
.home-err{color:var(--bad);min-height:20px;font-size:13px}

.lobby{max-width:720px;margin:0 auto}
.lobby .panel{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:20px}
.lobby-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}
.roomcode{font-family:var(--display);font-weight:800;font-size:44px;letter-spacing:.18em;color:var(--brass);line-height:1.1}
.teams{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:520px){.teams{grid-template-columns:minmax(0,1fr)}}
.team{background:var(--panel-2);border-radius:12px;padding:12px;display:grid;gap:8px}
.team h3{margin:0;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.lseat{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px dashed var(--line);border-radius:10px;padding:10px 12px;min-height:52px;background:transparent;text-align:left;width:100%}
.lseat.taken{border-style:solid;background:var(--panel)}
.lseat.mine{border-color:var(--brass)}
button.lseat:hover{border-color:var(--brass)}
.lseat .who{display:grid}
.lseat .who small{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em}
.lseat .acts{display:flex;gap:6px}
.lseat .acts .btn{padding:4px 9px;font-size:12px}
.lobby-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px}
.lobby-foot p{margin:0}

.banner{background:rgba(233,180,76,.14);border:1px solid var(--warn);color:var(--ink);border-radius:10px;padding:8px 12px;margin-bottom:12px;font-size:13.5px}
.players{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px;font-size:14px}
.players li{display:flex;align-items:center;gap:8px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--good);flex:none}
.dot.off{background:var(--line)}
.players .team-tag{margin-left:auto;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.tag .off{opacity:.6;font-weight:400}
.lasttrick p{margin:6px 0 8px}
.lt{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.lt li{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;text-align:center;min-width:0}
.lt li span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lt .card{--cw:clamp(34px,4vw,46px);cursor:default}
.lt li.w .card{box-shadow:0 0 0 3px var(--brass),0 3px 8px rgba(0,0,0,.35)}