/* Une table plein écran, des pages courtes, les détails à la demande. */
body {
  --felt-light:#429c50; --felt-dark:#247c46; --surface:#164e48; --surface-raised:#22665a;
  --theme-bg:#0e3e3d; --theme-glow:#2d857e88; --theme-muted:#d2e9da; --theme-edge:#a6e2bf42;
  --ink:#fffced; --muted:#c5e2d6; --gold:#ffdb77; --green:#9ae1a3; --paper:#0e3e3d;
  --card-back-fill:#d89635; --card-back-pattern:repeating-linear-gradient(45deg,#fff6ce55 0 1px,transparent 1px 5px);
  background:radial-gradient(ellipse at 50% 0%,var(--theme-glow),transparent 75%),var(--theme-bg);
  font-family:"Segoe UI",system-ui,sans-serif;
}
body[data-theme="midnight"] { --felt-light:#288dba;--felt-dark:#1a608a;--surface:#184b66;--surface-raised:#276d85;--theme-bg:#133c54;--theme-glow:#4b9fb47a;--theme-muted:#d4ebf4;--theme-edge:#a2dcec44;--ink:#fffced; }
body[data-theme="wine"] { --felt-light:#bc577a;--felt-dark:#8d3558;--surface:#673449;--surface-raised:#87435b;--theme-bg:#482a41;--theme-glow:#b263847a;--theme-muted:#f4dce6;--theme-edge:#efb5cc44;--ink:#fffced; }
body[data-theme="sunset"] { --felt-light:#d58a56;--felt-dark:#a94d4d;--surface:#7b4743;--surface-raised:#a6604e;--theme-bg:#563638;--theme-glow:#ee9b626e;--theme-muted:#ffe2c5;--theme-edge:#ffd2a44d;--ink:#fffced; }
body[data-theme="violet"] { --felt-light:#8870c8;--felt-dark:#554393;--surface:#4d417c;--surface-raised:#6e5ca5;--theme-bg:#332d59;--theme-glow:#9e8be36e;--theme-muted:#e5ddff;--theme-edge:#d7caff4d;--ink:#fffced; }
body.in-room { background:radial-gradient(ellipse at 50% 40%,var(--theme-glow),transparent 80%),var(--theme-bg); }
h1,h2,.room-heading h1 { font-family:"Trebuchet MS","Segoe UI",sans-serif; font-weight:800; letter-spacing:-.8px; }
h1 em { font-weight:800; font-style:normal; }
button { font-family:inherit; }
.button,.account-button { border-radius:14px; font-size:14px; font-weight:700; min-height:44px; }
.button-primary { background:linear-gradient(#ffe58a,#ffc753);border-color:#ffe399;color:#4a371b;box-shadow:0 3px 0 #ba8634,0 6px 14px #082c2833; }
.button-primary:hover:enabled { background:linear-gradient(#fff0ab,#ffd976); }
.button-secondary,.account-button { background:#ffffff0c; color:var(--ink);border-color:#bfe1ce50; }
.button-secondary:hover:enabled,.account-button:hover { background:#ffffff1c; }
.button-quiet { color:#f3d2c5; }
.brand { letter-spacing:.8px; font-size:18px; font-style:italic; }
.brand-mark { color:#3a6035;background:linear-gradient(#fff6b1,#ffc453);border-color:#ffe9a6;box-shadow:0 3px 0 #b47a2d; }
.brand-subtitle { color:#ffdd88;letter-spacing:3px;font-size:9px; }
.shell { max-width:1280px;padding:0 28px; }
.site-header { height:76px;border:0; }
.header-detail { gap:12px; }
.header-tagline { color:var(--theme-muted); }
.welcome { min-height:calc(100dvh - 132px);padding:26px 25px;gap:60px; }
.intro h1 { font-size:clamp(44px,6vw,78px); }
.intro .eyebrow { color:var(--gold); }
.intro-copy { color:var(--theme-muted); }
.entry-panel { border:2px solid #a8d2b530;box-shadow:0 14px 0 #062c292b,0 20px 50px #062c292b; border-radius:24px; }
.entry-tab { border-radius:12px;color:#d4e7d8;font-size:13px; }
.entry-tab.active { background:#458572;color:#fff8db; }
.entry-tabs { border-radius:17px; }
.entry-panel h2 { font-size:28px; }
.entry-panel label,.game-dialog label { font-size:13px;color:var(--theme-muted); }
.entry-panel input { border-radius:12px; }
.small-note { color:#cae4d5; }
.fan-caption { color:#b3d9c0; }
.site-footer { color:var(--theme-muted);border:0;padding:10px 0; }
/* Tous les éléments du plateau se partagent la hauteur réellement disponible. */
body.in-room { height:100dvh;min-height:0;overflow:hidden; }
.in-room .shell { height:100%; display:flex;flex-direction:column;max-width:1120px;padding:0 22px; }
.in-room .site-header { height:58px;min-height:58px; }
.in-room main { flex:1;min-height:0; }
.in-room .room { padding:0 0 10px;height:100%;min-height:0; }
.room-heading,.room-sidebar { display:none; }
.room-layout { display:block;height:100%;min-height:0; }
.table-play-area { display:grid;height:100%;min-height:0;gap:5px;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto minmax(130px,1fr) auto auto auto;grid-template-areas:"phase" "score" "ribbon" "table" "hand" "actions" "tools"; }
.phase-banner { grid-area:phase;min-height:56px;padding:8px 16px;margin:0;gap:12px;border:1px solid #a8dcb33d;border-radius:16px;box-shadow:0 3px 0 #062e292b; }
.phase-banner.your-turn { background:linear-gradient(100deg,#437951,var(--surface));border-color:#ffe2a8; }
.phase-icon { width:36px;height:36px;font-size:24px;flex-shrink:0;border-radius:12px; }
.phase-label { font-size:9px;letter-spacing:1.5px;margin:0 0 2px;color:#ffe496; }
.phase-banner h2 { font-size:20px;line-height:1.2;margin:0; }
.phase-help { font-size:11px;margin:3px 0 0;line-height:1.3;color:var(--theme-muted); }
.score-board { grid-area:score;margin:0;min-height:36px;padding:4px 16px;border-radius:13px;display:grid;grid-template-columns:minmax(0,1fr) minmax(76px,.8fr) minmax(0,1fr);gap:10px; }
.score-board .team-score { gap:8px;display:flex;align-items:center;min-width:0; }
.score-board #scoreA { justify-content:flex-end; }
.score-board #scoreB { justify-content:flex-end;flex-direction:row-reverse; }
.score-board .team-score span { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.score-board .team-score strong { font-size:24px; }
.team-score small { font-size:11px; }
.score-target { font-size:10px; }
#tableRibbon { grid-area:ribbon;margin:0;text-align:center;font-size:11px;color:#edf3d6;line-height:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.table-stage,.room:has(#playPanel:not([hidden])) .table-stage { grid-area:table;height:100%;width:100%;max-width:900px;min-height:0;margin:0 auto; }
.table-felt { inset:21px 32px;border:7px solid #c78d43;border-radius:43%;background:repeating-linear-gradient(25deg,#ffffff03 0 1px,#00000002 1px 3px),radial-gradient(ellipse at 50% 30%,var(--felt-light),var(--felt-dark));box-shadow:0 0 0 2px #f6d18a,0 5px 0 4px #483e2660,inset 0 0 25px #044a2e55; }
.table-felt::after { border:1px solid #effcc44a;inset:12px; }
.table-center { color:#e1f6bd80; }
.seat { background:linear-gradient(140deg,var(--surface-raised),var(--surface));width:110px;min-height:70px;padding:6px;gap:3px;border:2px solid #e0f3c452;border-radius:17px;box-shadow:0 3px 0 #0c30256b; }
.seat-name { font-size:12px;line-height:1.1; }
.seat-team { font-size:10px;color:#cce9d4; }
.seat-card-count { display:none; }
.seat .avatar,.seat.occupied .avatar { width:32px;height:32px;border:2px solid #ffebb9;background:linear-gradient(#73cdb1,#37a494);color:#fff5ca; }
.seat[data-position="left"] .avatar { background:linear-gradient(#edaa76,#d67b66); }
.seat[data-position="right"] .avatar { background:linear-gradient(#af9be4,#7967b9); }
.seat[data-position="top"] .avatar { background:linear-gradient(#74b8e3,#4789bb); }
.seat.occupied .avatar.has-symbol { font-size:25px; }
.seat.is-turn { border-color:#ffe35f;box-shadow:0 0 0 3px #ffe27555,0 5px 16px #17391566; }
.seat.is-ready { border-color:#a8f0b9;box-shadow:0 0 0 2px #75d89388,0 5px 16px #17391566; }
.seat[data-position="top"],.seat[data-position="bottom"] { width:180px;min-height:45px;display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;gap:2px 8px;text-align:left;padding:5px 9px; }
.seat[data-position="top"] .avatar,.seat[data-position="bottom"] .avatar { grid-row:1/3;width:32px;height:32px; }
.seat-turn-label { background:#ffdb70;color:#354525;border-color:#ffeb9c;font-size:9px;min-height:16px;padding:2px 6px; }
.seat[data-position="top"] .seat-turn-label { top:calc(100% + 5px); }
.opponent-hand { bottom:-17px;height:27px; }
.seat[data-position="top"] .opponent-hand { left:-23px;bottom:7px; }
.mini-card { width:20px;height:28px; }
.turned-area { top:50%;gap:4px; }
#turnedCard .game-card { width:64px;height:92px; }
.turned-label,.turned-help { font-size:11px;color:#fff2c0; }
.turned-label { white-space:pre-line;line-height:1.35;font-weight:750; }
.trick-area { top:50%;width:198px;height:185px;transform:translate(-50%,-50%); }
.played-card { width:62px;height:87px; }
.played-card[data-position="top"] { top:0;left:68px; }
.played-card[data-position="left"] { top:44px;left:0; }
.played-card[data-position="right"] { top:44px;left:136px; }
.played-card[data-position="bottom"] { top:94px;left:68px; }
.played-by { font-size:9px;max-width:100px; }
.trick-caption { display:none; }
.hand-section { grid-area:hand;padding:0;margin:0;width:100%;max-width:none; }
.hand-heading { display:none; }
.hand-help,.play-status { display:none; }
/* L'emplacement des cartes est stable durant le tour ; seule la sélection se relève. */
.hand-cards,body[data-card-size="large"] .hand-cards { height:144px;padding:14px 8px 0;justify-content:center;align-items:flex-end;overflow:visible; }
.hand-cards > [role="listitem"],body[data-card-size="large"] .hand-cards > [role="listitem"],.hand-cards.complete-hand > [role="listitem"],body[data-card-size="large"] .hand-cards.complete-hand > [role="listitem"],.room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot,body[data-card-size="large"] .room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot { flex:0 0 90px;height:128px;margin-left:-21px; }
.hand-cards > [role="listitem"]:first-child,body[data-card-size="large"] .hand-cards > [role="listitem"]:first-child,.room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot:first-child,body[data-card-size="large"] .room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot:first-child { margin-left:0; }
.hand-slot.selected-card { z-index:30; }
.hand-slot .game-card.is-selected { transform:translateY(-16px);outline:3px solid #ffdd66;box-shadow:0 0 18px #ffee8866; }
.hand-slot .game-card:disabled { opacity:.62;filter:saturate(.65); }
#gameActions { grid-area:actions;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;min-height:45px;padding:0;margin:0;background:none;border:0;box-shadow:none; }
#gameActions .room-status,#gameActions #playPanel { display:none; }
#gameActions > .button { width:auto;min-width:150px;min-height:42px;padding:10px 18px;margin:0; }
#gameActions .bidding-panel { width:100%;margin:0;padding:0;border:0; }
#gameActions #biddingStatus,#gameActions #biddingHelp { display:none; }
#gameActions .bid-actions { display:flex;justify-content:center;gap:8px; }
#gameActions .bid-actions .button { width:auto;flex:0 1 170px;min-width:0;min-height:44px;padding:8px;font-size:14px;margin:0; }
#lobbyShortcuts { display:flex;gap:8px; }
#lobbyShortcuts .button { padding:9px 15px;min-height:44px; }
.table-controls { grid-area:tools;display:flex;justify-content:center;gap:8px;margin:0; }
.table-controls .button { width:auto;min-width:100px;min-height:38px;font-size:12px;padding:8px 15px;border-radius:12px; }
#gameActions #roomMessage,.invitation-notice { position:fixed;z-index:30;bottom:12px;left:16px;right:16px;max-width:600px;margin:auto;padding:12px;background:#314b39;border:1px solid #dce9a3;box-shadow:0 8px 30px #0005; }
#gameActions #refreshButton { position:fixed;bottom:8px;right:18px;z-index:31; }
#gameActions #dealNotice { display:none!important; }
#room[data-stage="playing"] #gameActions::before { content:"Touchez une carte éclairée pour la jouer";color:var(--theme-muted);font-size:12px; }
body[data-card-play-mode="double"] #room[data-stage="playing"] #gameActions::before { content:"Touchez une carte une première fois pour la choisir, une seconde pour la jouer"; }
/* Fenêtres : une fonction par page, grandes cibles tactiles. */
.game-dialog { --ink:#fffdf4;--muted:#e1eee9;--theme-muted:#e1eee9;color:var(--ink);border:2px solid #b7e0bc66;border-radius:23px;box-shadow:0 20px 70px #021d23aa;padding:22px;overscroll-behavior:contain;scrollbar-width:thin; }
.game-dialog::backdrop { background:#042629a6;backdrop-filter:blur(4px); }
.dialog-heading h2 { font-size:24px; }
.dialog-close { min-width:44px;min-height:44px;background:#ffffff12;border-radius:13px; }
.menu-dialog { width:480px; }
.menu-grid { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.menu-grid > button { width:100%;max-width:none;min-height:64px;text-align:center;justify-content:center;white-space:normal;font-size:14px;font-weight:750;margin:0;color:#fffdf4;background:#ffffff13;border-color:#d5eee35c; }
.menu-grid #leaveButton { grid-column:1/-1;min-height:44px; }
#menuBackButton { margin-top:16px; }
.menu-dialog .invite-panel,.menu-dialog .lobby-teams { padding:0;border:0;background:transparent; }
.menu-dialog .invite-panel .panel-eyebrow,.menu-dialog #codeHelp,.menu-dialog .invitation-link-label,.menu-dialog #invitationLink { display:none; }
.menu-dialog #invitationHelp { font-size:12px; }
.menu-dialog .room-code { font-size:36px;margin:0 0 12px; }
.menu-dialog .solo-room-info { margin:16px 0; }
.menu-dialog .round-result { margin:0;padding:0;border:0; }
.menu-dialog .round-result h2 { font-size:22px; }
.menu-dialog #menuHistory .bid-details { margin:0;border:0; }
.mini-tabs { display:flex;gap:8px;margin:0 0 10px; }
.mini-tabs button { flex:1;border:1px solid #d5eee344;background:#071f282d;color:#e8f3ef;border-radius:12px;min-height:40px;font-weight:700; }
.mini-tabs button[aria-selected="true"] { background:#ffdb7033;border-color:#ffd76c;color:#ffe394;box-shadow:inset 0 0 0 1px #ffd76c44; }
.account-dialog .appearance-preview { padding:12px;min-height:92px;margin:8px 0 14px; }
.account-dialog .preference-grid { grid-template-columns:1fr 1fr; }
.account-dialog .preference-grid select { min-height:44px; }
@media(max-width:740px) {
 .shell { padding:0 16px; }
 .site-header { height:64px; }
 .header-tagline { display:none; }
 .brand { font-size:16px;gap:10px; }
 .brand-mark { width:30px;height:38px;font-size:25px; }
 .header-detail { gap:7px; }
 .account-button { font-size:13px;min-height:42px;padding:8px 12px; }
 .welcome { display:block;padding:8px 0 16px;min-height:0; }
 .intro { text-align:center; }
 .intro .eyebrow { display:none; }
 .intro h1 { font-size:39px;line-height:1.08;margin:4px 0 7px;letter-spacing:-1px; }
 .intro h1 br { display:none; }.intro h1 em::before { content:" "; }
 .intro-copy { font-size:12px;max-width:none;line-height:1.45;margin:0 auto; }
 .card-fan { height:123px;width:230px;margin:8px auto 2px;transform:scale(.7);transform-origin:center top; }
 .card-fan .fan-caption { display:none; }
 .small-note { display:none; }
 .entry-panel { padding:8px 18px 16px;border-radius:22px; }
 .entry-tabs { margin:0 -10px 16px;padding:4px; }
 .entry-tab { min-height:44px;padding:8px 5px;font-size:12px; }
 .entry-panel .panel-eyebrow { display:none; }
 .entry-panel h2 { font-size:23px;margin-bottom:8px; }
 .entry-panel .panel-copy { font-size:12px;margin-bottom:12px;line-height:1.5; }
 .entry-panel label { margin-bottom:5px; }
 .entry-panel input { min-height:45px;padding:10px 12px;margin-bottom:12px; }
 .entry-footnote,.solo-limit { display:none; }
 .site-footer { display:none; }
 .in-room .shell { padding:0 9px; }
 .in-room .site-header { height:50px;min-height:50px; }
 .in-room .room { padding:0 0 5px; }
 .table-play-area { gap:4px; }
 .in-room .phase-banner { min-height:52px;padding:7px 10px;gap:8px; }
 .phase-icon { width:28px;height:28px;font-size:21px; }
 .phase-label { font-size:8px;letter-spacing:.9px; }
 .in-room .phase-banner h2 { font-size:16px;line-height:1.2;letter-spacing:-.3px; }
 .phase-help { display:none; }
 .score-board { min-height:32px;padding:2px 8px;grid-template-columns:minmax(0,1fr) minmax(68px,.7fr) minmax(0,1fr);gap:5px; }
 .score-board .team-score strong { font-size:22px; }
 .score-board .team-score { gap:4px; }
 .score-board .team-score span { font-size:9px; }
 .score-target { font-size:8px; }
 #tableRibbon { font-size:10px;line-height:16px; }
 .table-stage,.in-room .table-stage,.room:has(#playPanel:not([hidden])) .table-stage,.in-room .room:has(#playPanel:not([hidden])) .table-stage { height:100%; }
 .table-felt { inset:21px 16px 18px;border-width:5px;border-radius:34%; }
 .seat { width:78px;min-height:67px;padding:5px 3px;border-radius:13px; }
 .seat-name { font-size:11px;max-height:30px;overflow:hidden; }
 .seat-team { font-size:9px; }
 .seat .avatar { width:28px;height:28px; }
 .seat[data-position="top"],.seat[data-position="bottom"] { width:155px;min-height:44px;grid-template-columns:28px 1fr;padding:4px 7px;gap:2px 6px; }
 .seat[data-position="top"] .avatar,.seat[data-position="bottom"] .avatar { width:28px;height:28px; }
 .seat-turn-label { font-size:8px;padding:2px 4px; }
 .opponent-hand { bottom:-15px; }
 .seat:not([data-position="bottom"]) .opponent-hand { opacity:0; }
 .seat:not([data-position="bottom"]) .seat-team { display:none; }
 .seat:not([data-position="bottom"]) .seat-card-count { display:block;color:#e6f2ed;font-size:8px; }
 .mini-card { width:17px;height:24px;left:calc(50% + (var(--back-index,0) - (var(--back-count,5) - 1)/2)*6px); }
 .turned-label,.turned-help { font-size:10px; }
 #turnedCard .game-card { width:57px;height:82px; }
 .trick-area { width:168px;height:157px; }
 .played-card { width:52px;height:73px; }
 .played-card[data-position="top"] { top:0;left:58px; }
 .played-card[data-position="left"] { top:36px;left:0; }
 .played-card[data-position="right"] { top:36px;left:116px; }
 .played-card[data-position="bottom"] { top:79px;left:58px; }
 .played-by { font-size:8px;padding:2px 3px;max-width:56px; }
 .played-card[data-position="top"] .played-by { top:auto;bottom:calc(100% + 3px);left:50%;right:auto;transform:translateX(-50%); }
 .played-card[data-position="bottom"] .played-by { top:calc(100% + 3px);bottom:auto;left:50%;right:auto;transform:translateX(-50%); }
 .played-card[data-position="left"] .played-by,.played-card[data-position="right"] .played-by { top:auto;bottom:calc(100% + 3px);left:50%;right:auto;transform:translateX(-50%); }
 .hand-cards,body[data-card-size="large"] .hand-cards { height:130px;padding:14px 2px 0; }
 .hand-cards > [role="listitem"],body[data-card-size="large"] .hand-cards > [role="listitem"],.hand-cards.complete-hand > [role="listitem"],body[data-card-size="large"] .hand-cards.complete-hand > [role="listitem"],.room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot,body[data-card-size="large"] .room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot { flex:0 0 80px;height:114px;margin-left:clamp(-47px,calc((100vw - 674px)/7),-32px); }
 #gameActions { min-height:44px;gap:6px; }
 #gameActions > .button { min-width:0;min-height:44px;font-size:13px;padding:10px 14px; }
 #gameActions .bid-actions { gap:5px; }
 #gameActions .bid-actions .button { font-size:12px;min-height:44px; }
 #lobbyShortcuts { gap:6px; }
 #lobbyShortcuts .button { padding:8px 10px;font-size:12px; }
 .table-controls { gap:6px; }
 .in-room .table-controls { margin:0; }
 .table-controls .button { min-width:0;min-height:36px;padding:7px 12px;font-size:11px; }
 .game-dialog { padding:17px;max-width:calc(100vw - var(--belote-safe-left) - var(--belote-safe-right) - 20px);max-height:calc(100dvh - var(--belote-safe-top) - var(--belote-safe-bottom) - 20px); }
 .dialog-heading h2 { font-size:22px; }
 .menu-grid { gap:8px; }
 .menu-grid > button { min-height:63px;font-size:13px; }
 .account-dialog .appearance-preview small { display:none; }
}
@media(max-width:740px) and (max-height:650px) {
 .card-fan { display:none; }
 .intro { margin-bottom:14px; }
 .intro h1 { font-size:31px; }
 .intro-copy { font-size:11px; }
 .in-room .site-header { height:44px;min-height:44px; }
 .in-room .phase-banner { min-height:44px;padding:5px 8px; }
 .in-room .phase-banner h2 { font-size:14px; }
 .hand-cards,body[data-card-size="large"] .hand-cards { height:112px; }
 .hand-cards > [role="listitem"],body[data-card-size="large"] .hand-cards > [role="listitem"],.hand-cards.complete-hand > [role="listitem"],body[data-card-size="large"] .hand-cards.complete-hand > [role="listitem"],.room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot,body[data-card-size="large"] .room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot { height:97px; }
 .trick-area { transform:translate(-50%,-50%) scale(.88); }
 #tableRibbon { font-size:9px; }
 .game-dialog .dialog-pause-note { font-size:11px;padding:8px; }
}
@media(orientation:landscape) and (max-height:540px) {
 .in-room .shell { max-width:none;padding:0 12px; }
 .in-room .site-header { height:40px;min-height:40px; }
 .in-room .site-header .brand { font-size:13px; }
 .in-room .brand-mark { height:29px;width:25px;font-size:22px; }
 .in-room .brand-subtitle { margin-top:3px;font-size:8px; }
 .in-room .account-button { min-height:32px;padding:5px 12px; }
 .table-play-area { gap:4px 15px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:auto auto minmax(90px,1fr) auto auto;grid-template-areas:"phase score" "table ribbon" "table hand" "table actions" "table tools"; }
 .phase-banner,.in-room .phase-banner { min-height:43px;padding:5px 9px; }
 .phase-banner h2,.in-room .phase-banner h2 { font-size:14px; }
 .phase-label { font-size:8px; }.phase-help { display:none; }
 .score-board { align-self:stretch;padding:3px 9px;min-height:0; }
 .table-stage,.in-room .table-stage,.room:has(#playPanel:not([hidden])) .table-stage,.in-room .room:has(#playPanel:not([hidden])) .table-stage { height:100%;width:100%; }
 .table-felt { inset:20px 12px;border-width:5px; }
 .seat { width:78px;min-height:62px;padding:4px; }
 .seat-name { font-size:10px; }.seat-team { font-size:8px; }
 .seat[data-position="top"],.seat[data-position="bottom"] { width:143px;min-height:38px;grid-template-columns:25px 1fr;padding:3px 6px; }
 .seat .avatar,.seat[data-position="top"] .avatar,.seat[data-position="bottom"] .avatar { width:25px;height:25px; }
 .seat.occupied .avatar.has-symbol { font-size:21px; }
 .trick-area { transform:translate(-50%,-50%) scale(.83); }
 .turned-area { top:52%; }
 #turnedCard .game-card { width:52px;height:74px; }
 .turned-label,.turned-help { font-size:9px; }
 .hand-section { align-self:end; }
 .hand-cards,body[data-card-size="large"] .hand-cards { height:117px;padding:12px 0 0; }
 .hand-cards > [role="listitem"],body[data-card-size="large"] .hand-cards > [role="listitem"],.hand-cards.complete-hand > [role="listitem"],body[data-card-size="large"] .hand-cards.complete-hand > [role="listitem"],.room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot,body[data-card-size="large"] .room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot { flex:0 0 74px;height:104px;margin-left:clamp(-51px,calc((100vw - 1328px)/14),-23px); }
 .table-controls .button { min-height:35px;padding:6px 8px;font-size:10px;min-width:0; }
 #gameActions > .button { min-height:40px;padding:8px 12px;font-size:12px;min-width:0; }
 #gameActions { min-height:40px; }
 .table-controls { gap:5px; }
 #gameActions .bid-actions { gap:4px; }
 #gameActions .bid-actions .button { font-size:11px;padding:6px 4px; }
 .welcome { display:grid;grid-template-columns:1fr 1.2fr;gap:20px;padding:10px 0; }
 .intro h1 { font-size:38px; }.card-fan { display:none; }
 .entry-panel h2,.entry-panel .panel-copy { display:none; }
 .site-header { height:42px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; } }
/* Garder les figures lisibles pendant la réflexion des autres joueurs. */
.hand-slot .game-card:disabled { opacity:1;filter:none; }
.hand-cards:has(.is-playable) .hand-slot .game-card:disabled { opacity:1;filter:brightness(.76) saturate(.8); }
@media(max-width:740px),(orientation:landscape) and (max-height:540px) {
 .hand-cards > [role="listitem"] { transform:none; }
 .hand-cards > [role="listitem"]:focus-within { z-index:35; }
 .hand-cards { --hand-card-width:76px; }
 body[data-card-size="large"] .hand-cards { --hand-card-width:84px; }
 .hand-cards > [role="listitem"],body[data-card-size="large"] .hand-cards > [role="listitem"],.hand-cards.complete-hand > [role="listitem"],body[data-card-size="large"] .hand-cards.complete-hand > [role="listitem"],.room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot,body[data-card-size="large"] .room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot { flex-basis:var(--hand-card-width);margin-left:min(-12px,calc((100% - var(--hand-card-width)*8 - 12px)/7)); }
 .hand-cards > [role="listitem"]:first-child,body[data-card-size="large"] .hand-cards > [role="listitem"]:first-child,.room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot:first-child,body[data-card-size="large"] .room:has(#playPanel:not([hidden])) .hand-cards.complete-hand > .hand-slot:first-child { margin-left:0; }
}

.menu-dialog .invite-panel.copy-fallback #invitationLink, .menu-dialog .invite-panel.copy-fallback .invitation-link-label { display:block; }

/* Accueil plus lumineux : une vraie pile verticale sur téléphone, sans décor superposé. */
body:not(.in-room) {
 --ink:#173f35;--muted:#527267;--theme-muted:#486c61;--gold:#c77a16;--theme-edge:#2b765a38;
 color-scheme:light;
 background:
  radial-gradient(circle at 12% 8%,#fff7c8 0,transparent 27%),
  radial-gradient(circle at 88% 20%,#bde7d1 0,transparent 32%),
  linear-gradient(155deg,#f4f2dd 0%,#d9efe0 48%,#c4e4d5 100%);
}
body:not(.in-room) .site-header { border-bottom:1px solid #1f604720; }
body:not(.in-room) .brand { color:#17473b; }
body:not(.in-room) .brand-mark { color:#17473b;background:linear-gradient(145deg,#ffe88f,#f4b83f);border-color:#fff2b9;box-shadow:0 3px 0 #bb7928,0 8px 18px #4c7b5b25; }
body:not(.in-room) .brand-subtitle { color:#9b6519; }
body:not(.in-room) .account-button { color:#17473b;background:#ffffff80;border-color:#276c5140;box-shadow:0 5px 16px #276c5115; }
body:not(.in-room) .intro h1 { color:#173f35; }
body:not(.in-room) .intro h1 em { color:#cf7b16; }
body:not(.in-room) .intro-copy,body:not(.in-room) .small-note { color:#527267; }
body:not(.in-room) .entry-panel { background:linear-gradient(155deg,#fffdf5f5,#f7f1ddf2);border-color:#ffffffcc;box-shadow:0 8px 0 #39745c20,0 22px 45px #285b4530; }
body:not(.in-room) .entry-tabs { background:#dce9dc;border:1px solid #38765c22; }
body:not(.in-room) .entry-tab { color:#527267; }
body:not(.in-room) .entry-tab.active { background:#25745f;color:#fffef6;box-shadow:0 3px 8px #174c3c35; }
body:not(.in-room) .entry-panel h2 { color:#173f35; }
body:not(.in-room) .entry-panel label { color:#345b50; }
body:not(.in-room) .entry-panel input { color:#173f35;background:#ffffffd9;border-color:#2d6b5038;box-shadow:inset 0 1px 3px #315d4814; }
body:not(.in-room) .entry-panel input::placeholder { color:#809b91; }
body:not(.in-room) .panel-copy,body:not(.in-room) .entry-footnote,body:not(.in-room) .solo-limit { color:#5b786e; }

@media(max-width:740px) {
 body:not(.in-room) .shell { min-height:100dvh;padding:0 14px 18px; }
 body:not(.in-room) .site-header { height:58px; }
 body:not(.in-room) .welcome { display:flex;flex-direction:column;gap:12px;padding:8px 0 18px; }
 body:not(.in-room) .intro { width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;margin:0; }
 body:not(.in-room) .intro h1 { font-size:36px;line-height:1.05;margin:2px 0 5px;letter-spacing:-1.2px; }
 body:not(.in-room) .intro-copy { position:relative;font-size:13px;line-height:1.45;margin:0;max-width:350px; }
 body:not(.in-room) .card-fan { position:relative;top:auto;right:auto;width:190px;height:104px;margin:8px auto 0;transform:none;transform-origin:center;pointer-events:none; }
 body:not(.in-room) .card-fan .playing-card { top:4px;width:70px;height:98px;padding:6px;border-radius:8px;box-shadow:0 8px 18px #234e3a38,inset 0 0 0 2px #ffffff99; }
 body:not(.in-room) .card-fan .playing-card b,body:not(.in-room) .card-fan .playing-card small { top:6px;left:6px;font-size:13px; }
 body:not(.in-room) .card-fan .playing-card b>span,body:not(.in-room) .card-fan .playing-card small>span { font-size:11px;margin-top:1px; }
 body:not(.in-room) .card-fan .playing-card small { top:auto;left:auto;right:6px;bottom:6px; }
 body:not(.in-room) .card-fan .card-one { left:8px;transform:rotate(-15deg); }
 body:not(.in-room) .card-fan .card-two { left:59px;top:0;transform:rotate(-1deg); }
 body:not(.in-room) .card-fan .card-three { left:110px;transform:rotate(14deg); }
 body:not(.in-room) .card-fan .decorative-court { inset:17px 16px;font-size:29px; }
 body:not(.in-room) .card-fan .decorative-pips { inset:17px 16px;font-size:11px;line-height:1.05; }
 body:not(.in-room) .card-fan .decorative-ace { font-size:45px; }
 body:not(.in-room) .entry-panel { width:100%;padding:7px 16px 16px;border-radius:24px; }
 body:not(.in-room) .entry-tabs { margin:0 -9px 14px;padding:4px; }
 body:not(.in-room) .entry-tab { min-height:43px;font-size:12px; }
 body:not(.in-room) .entry-panel h2 { font-size:24px;margin-bottom:7px; }
 body:not(.in-room) .entry-panel .panel-copy { font-size:12px;line-height:1.4;margin-bottom:11px; }
 body:not(.in-room) .entry-panel input { min-height:47px;margin-bottom:12px; }
}
@media(max-width:380px),(max-width:740px) and (max-height:690px) {
 body:not(.in-room) .site-header { height:52px; }
 body:not(.in-room) .brand { font-size:14px; }
 body:not(.in-room) .brand-mark { width:27px;height:34px;font-size:22px; }
 body:not(.in-room) .account-button { min-height:38px;padding:6px 10px; }
 body:not(.in-room) .welcome { gap:8px;padding-top:5px; }
 body:not(.in-room) .intro h1 { font-size:31px; }
 body:not(.in-room) .intro-copy { font-size:11px; }
 body:not(.in-room) .card-fan { width:164px;height:78px;margin-top:4px;transform:scale(.82);transform-origin:center top; }
 body:not(.in-room) .entry-panel { padding:6px 14px 13px; }
 body:not(.in-room) .entry-panel .panel-copy { display:none; }
}
