/* ===================== MAGNAT — thème "table de jeu" chaleureux ===================== */
:root{
  --cream:#fbf2dd; --cream2:#f3e6c6; --paper:#fffdf6; --paper2:#fbf4e3;
  --ink:#3a2c1a; --muted:#977f57; --line:#e7d6ab;
  --felt:#157246; --felt2:#0f5a35; --felt-line:#0c4a2c;
  --red:#d1394b; --red2:#b31e35; --gold:#f1b011; --gold2:#d9930a;
  --green:#1f9d55; --up:#1f9d55; --down:#d1394b; --blue:#2f7dd1;
  --shadow:0 10px 30px rgba(90,60,15,.18);
  --shadow-sm:0 3px 10px rgba(90,60,15,.12);
  --radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{
  font-family:'Inter',system-ui,sans-serif; color:var(--ink);
  background:
    radial-gradient(1100px 700px at 80% -15%, #fff6e2 0, transparent 55%),
    radial-gradient(900px 700px at -10% 115%, #ffe9c9 0, transparent 55%),
    linear-gradient(160deg,var(--cream),var(--cream2));
  overflow:hidden;
}
button{font-family:inherit;cursor:pointer}
input{font-family:inherit}

/* ---------- écrans ---------- */
.screen{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:20px}
.screen.active{display:flex}
#screen-game.active{display:flex;flex-direction:column;align-items:stretch;padding:0}

/* ---------- boutons ---------- */
.btn{border:none;border-radius:12px;padding:11px 18px;font-weight:800;font-size:15px;transition:.15s;color:#fff}
.btn:active{transform:translateY(1px)}
.btn-gold{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#4a3208;box-shadow:0 5px 14px rgba(217,147,10,.35)}
.btn-gold:hover{filter:brightness(1.05)}
.btn-red{background:linear-gradient(180deg,var(--red),var(--red2));color:#fff;box-shadow:0 5px 14px rgba(179,30,53,.3)}
.btn-red:hover{filter:brightness(1.05)}
.btn-outline{background:var(--paper);color:var(--ink);border:1.5px solid var(--line)}
.btn-outline:hover{border-color:var(--gold2);color:var(--gold2)}
.btn-ghost{background:transparent;color:var(--muted);border:none}
.btn-ghost:hover{color:var(--ink)}
.btn-big{padding:14px 26px;font-size:17px}
.btn:disabled{opacity:.45;cursor:not-allowed}

/* ---------- logo ---------- */
.logo{font-family:'Playfair Display',serif;font-weight:900;font-size:60px;letter-spacing:1px;color:var(--red);
  text-shadow:2px 2px 0 rgba(0,0,0,.06)}
.logo.small{font-size:34px}.logo.tiny{font-size:22px}
.tagline{color:var(--muted);text-align:center;margin:6px 0 26px;font-size:15px;font-weight:600}

/* ---------- accueil / lobby ---------- */
.home-card,.lobby-card{background:linear-gradient(180deg,var(--paper),var(--paper2));border:1px solid var(--line);
  border-radius:22px;padding:38px;width:min(460px,92vw);box-shadow:var(--shadow);text-align:center}
.field{display:block;margin-bottom:18px;text-align:left}
.field span{display:block;font-size:13px;color:var(--muted);margin-bottom:6px;font-weight:600}
.field input,.code-input,.join-row input,#invite-link{
  width:100%;background:#fff;border:1.5px solid var(--line);color:var(--ink);
  border-radius:12px;padding:12px 14px;font-size:16px;outline:none}
.field input:focus,.code-input:focus{border-color:var(--gold2)}
.home-actions{display:flex;flex-direction:column;gap:14px}
.or{text-align:center;color:var(--muted);font-size:13px}
.join-row{display:flex;gap:10px}
.code-input{text-transform:uppercase;letter-spacing:4px;font-weight:800;text-align:center;width:150px}
.home-foot{margin-top:22px;text-align:center;color:var(--muted);font-size:12.5px}

.lobby-card{width:min(560px,94vw)}
.lobby-card h2{text-align:center;margin:4px 0 20px;color:var(--ink)}
.invite-box{background:var(--paper2);border:1px dashed var(--line);border-radius:14px;padding:16px;margin-bottom:18px;text-align:left}
.invite-label{font-size:13px;color:var(--muted);margin-bottom:8px;font-weight:600}
.invite-row{display:flex;gap:8px}
.invite-code{margin-top:10px;font-size:13px;color:var(--muted)}
.invite-code b{color:var(--red);letter-spacing:2px}
.lobby-players{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.lp{display:flex;align-items:center;gap:12px;background:var(--paper2);border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.lp .tok{font-size:22px}
.lp .nm{font-weight:800;flex:1;color:var(--ink)}
.lp .st{font-size:12px;color:var(--muted);font-weight:600}
.lp .st.ok{color:var(--green)}
.lp .host{font-size:11px;color:#fff;background:var(--red);border-radius:6px;padding:2px 7px;font-weight:800}
.lobby-controls{display:flex;gap:12px;justify-content:center}
.lobby-hint{text-align:center;color:var(--muted);font-size:12.5px;margin-top:12px;min-height:16px}

/* ===================== JEU ===================== */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;
  background:linear-gradient(180deg,#fff8ea,#f6ead0);border-bottom:2px solid var(--line);gap:12px;box-shadow:var(--shadow-sm)}
.topbar-mid{display:flex;gap:8px;align-items:center;flex:1;justify-content:center;flex-wrap:wrap}
.chip{background:#fff;border:1.5px solid var(--line);border-radius:20px;padding:5px 12px;font-size:13px;color:var(--muted);font-weight:600}
.chip b{color:var(--ink)}
.chip-btn{color:var(--red);border-color:var(--red);cursor:pointer}
.chip-btn:hover{background:var(--red);color:#fff}
.turn-banner{font-weight:800;font-size:15px;padding:7px 16px;border-radius:20px;background:#fff;border:1.5px solid var(--line);min-width:150px;text-align:center;color:var(--ink)}
.turn-banner.mine{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#4a3208;border-color:var(--gold2)}

.game-main{flex:1;display:flex;gap:16px;padding:16px;min-height:0}

/* ---------- plateau (feutre vert + cases crème) ---------- */
.board-wrap{position:relative;aspect-ratio:1/1;height:min(86vh,86vw);max-width:86vh;flex:0 0 auto;margin:auto}
.board{position:absolute;inset:0;display:grid;grid-template-columns:repeat(11,1fr);grid-template-rows:repeat(11,1fr);
  gap:3px;background:linear-gradient(160deg,var(--felt),var(--felt2));border:6px solid var(--felt2);border-radius:14px;
  box-shadow:var(--shadow), inset 0 0 60px rgba(0,0,0,.15)}
.tile{position:relative;background:linear-gradient(180deg,#fffdf6,#f7edd6);border:1px solid #e7d6ab;border-radius:5px;
  display:flex;flex-direction:column;overflow:hidden;font-size:9px;line-height:1.05;padding:3px;box-shadow:var(--shadow-sm)}
.tile .tname{font-weight:800;font-size:8.5px;color:#4a3a22;overflow:hidden;max-height:26px}
.tile .tprice{margin-top:auto;color:#a08a5f;font-size:8px;font-weight:700}
.tile .cbar{height:15px;margin:-3px -3px 3px;border-bottom:1px solid rgba(0,0,0,.18)}
.tile.corner{align-items:center;justify-content:center;text-align:center;background:linear-gradient(180deg,#fff6df,#f3e4bf)}
.tile.corner .tname{font-size:9px}
.tile .emoji{font-size:16px}
.tile.special{align-items:center;justify-content:center;text-align:center}
.tile .own-flag{position:absolute;top:2px;right:2px;width:10px;height:10px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.tile .lvl{position:absolute;bottom:2px;right:3px;font-size:8px;color:var(--red2);font-weight:800}
.tile.mortg{opacity:.45}
.tile .tokens{position:absolute;inset:auto 2px 2px 2px;display:flex;flex-wrap:wrap;gap:1px;justify-content:center}
.tile .ptok{font-size:13px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4));transition:transform .3s}
.tile.hl{outline:3px solid var(--gold);outline-offset:-2px;z-index:3}

/* centre */
.board-center{position:absolute;top:calc(9.09% + 5px);left:calc(9.09% + 5px);
  width:calc(81.8% - 10px);height:calc(81.8% - 10px);display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:14px;pointer-events:none;padding:16px;text-align:center}
.center-logo{font-family:'Playfair Display',serif;font-weight:900;font-size:min(5.5vh,50px);color:rgba(255,255,255,.92);
  text-shadow:0 2px 8px rgba(0,0,0,.35);transform:rotate(-8deg)}
.center-msg{color:#fff;font-size:14px;font-weight:700;text-align:center;max-width:80%;min-height:18px;
  background:rgba(0,0,0,.22);padding:6px 14px;border-radius:20px;backdrop-filter:blur(2px)}
.center-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;pointer-events:auto}
.center-actions .btn{padding:12px 22px;font-size:16px}

/* dés */
.dice{display:flex;gap:12px}
.die{width:46px;height:46px;border-radius:11px;background:#fffdf7;box-shadow:inset 0 -3px 0 rgba(0,0,0,.1),0 5px 12px rgba(0,0,0,.35);position:relative}
.die{background-repeat:no-repeat}
.die[data-face="1"]{background-image:radial-gradient(circle,#b31e35 22%,transparent 24%);background-position:center;background-size:100% 100%}
.die[data-face="2"]{background-image:radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%);background-position:26% 26%,74% 74%;background-size:40% 40%,40% 40%}
.die[data-face="3"]{background-image:radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%);background-position:24% 24%,50% 50%,76% 76%;background-size:36% 36%,36% 36%,36% 36%}
.die[data-face="4"]{background-image:radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%);background-position:26% 26%,74% 26%,26% 74%,74% 74%;background-size:36% 36%,36% 36%,36% 36%,36% 36%}
.die[data-face="5"]{background-image:radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%);background-position:24% 24%,76% 24%,50% 50%,24% 76%,76% 76%;background-size:32% 32%,32% 32%,32% 32%,32% 32%,32% 32%}
.die[data-face="6"]{background-image:radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%),radial-gradient(circle,#b31e35 22%,transparent 24%);background-position:26% 20%,74% 20%,26% 50%,74% 50%,26% 80%,74% 80%;background-size:30% 26%,30% 26%,30% 26%,30% 26%,30% 26%,30% 26%}
.die.rolling{animation:roll .6s ease}
@keyframes roll{0%{transform:rotate(0) scale(1)}25%{transform:rotate(90deg) scale(1.15)}50%{transform:rotate(200deg) scale(.9)}75%{transform:rotate(300deg) scale(1.1)}100%{transform:rotate(360deg) scale(1)}}

/* ---------- sidebar ---------- */
.sidebar{flex:1;min-width:300px;max-width:410px;display:flex;flex-direction:column;gap:14px;overflow:hidden}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;min-height:0;box-shadow:var(--shadow-sm)}
.panel-title{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:10px;font-weight:800}
#panel-players{flex:0 0 auto}
.panel-tabs{flex:1;min-height:0;padding:0;overflow:hidden}

.prow{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;margin-bottom:5px;background:var(--paper2);border:1.5px solid transparent}
.prow.turn{border-color:var(--gold2);background:#fff7e2;box-shadow:0 0 0 2px rgba(241,176,17,.25)}
.prow.dead{opacity:.45;filter:grayscale(1)}
.prow .tok{font-size:22px;flex-shrink:0}
.prow .pinfo{flex:1;min-width:0}
.prow .pname{font-weight:800;font-size:13.5px;display:flex;align-items:center;gap:5px;color:var(--ink);flex-wrap:wrap}
.prow .pdot{width:9px;height:9px;border-radius:50%;border:1px solid rgba(0,0,0,.15)}
.prow .pcash{font-size:12.5px;color:var(--green);font-weight:800}
.prow .pnet{font-size:11px;color:var(--muted);text-align:right;font-weight:600;white-space:nowrap;flex-shrink:0;padding-left:8px}
.prow .pnet b{color:var(--ink);font-size:12.5px}
.prow .off{color:var(--red);font-size:10px;font-weight:700}
.prow .mhold{color:var(--muted);font-weight:600;font-size:11px}

/* onglets */
.tabs{display:flex;border-bottom:2px solid var(--line);background:var(--paper2);border-radius:14px 14px 0 0;flex:0 0 auto}
.tab{flex:1;background:transparent;border:none;padding:12px 8px;font-weight:800;font-size:13px;color:var(--muted);
  border-bottom:3px solid transparent;margin-bottom:-2px;transition:.15s}
.tab:hover{color:var(--ink)}
.tab.active{color:var(--red);border-bottom-color:var(--red)}
.tab-body{flex:1;min-height:0;overflow-y:auto;padding:12px}
.tabpane{display:none}
.tabpane.active{display:block}
.pane-head{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:10px;font-weight:800}

/* ----- Mon empire ----- */
.empire-head{display:flex;gap:10px;margin-bottom:12px}
.empire-head>div{flex:1;background:linear-gradient(180deg,#fff8e8,#fbefcf);border:1.5px solid var(--line);border-radius:12px;padding:10px 12px}
.empire-head span{display:block;font-size:11px;color:var(--muted);font-weight:700}
.empire-head b{font-size:19px;color:var(--ink)}
.empire-head .eh-cash b{color:var(--green)}
.empire-sum{display:flex;gap:8px;margin-bottom:16px}
.empire-sum .es{flex:1;text-align:center;background:var(--paper2);border:1px solid var(--line);border-radius:10px;padding:8px 4px;font-size:11px;color:var(--muted);font-weight:700}
.empire-sum .es b{display:block;font-size:14px;margin-top:3px;color:var(--ink)}
.empire-sum .es.up b{color:var(--green)}
.empire-sum .es.down b{color:var(--red)}
.city{margin-bottom:14px}
.city-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:14px}
.city-head b{color:var(--ink)}
.city-dot{width:14px;height:14px;border-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.city-prog{margin-left:auto;font-size:11px;font-weight:800;color:var(--muted);background:var(--paper2);border:1px solid var(--line);border-radius:20px;padding:2px 9px}
.city-prog.full{color:#fff;background:var(--green);border-color:var(--green)}
/* Le bien tient sur deux lignes : son identité, puis ce qu'on peut en faire.
   Avec l'hypothèque il y a désormais jusqu'à quatre leviers — les serrer sur
   une seule ligne écrasait le nom du quartier. */
.prop{display:flex;flex-direction:column;gap:7px;padding:8px 10px;background:var(--paper2);border:1px solid var(--line);border-radius:10px;margin-bottom:5px}
.prop-name{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.35}
.prop-name .lvl{color:var(--gold2);font-size:11px}
.prop-actions{display:flex;gap:5px;flex-wrap:wrap}
.empire-empty,.assets-empty{color:var(--muted);font-size:13px;padding:16px 8px;text-align:center;line-height:1.5}
.mini{border:1.5px solid var(--line);background:#fff;color:var(--ink);border-radius:8px;padding:4px 9px;font-size:12px;font-weight:800;white-space:nowrap}
.mini:hover:not(:disabled){border-color:var(--gold2);color:var(--gold2)}
.mini.gold{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#4a3208;border-color:var(--gold2)}
.mini.danger{color:var(--red2);border-color:#f0cdd2}
.mini.danger:hover:not(:disabled){border-color:var(--red);color:var(--red)}
.mini:disabled{opacity:.4;cursor:not-allowed}
.btn-danger{background:linear-gradient(180deg,var(--red),var(--red2));color:#fff;box-shadow:0 5px 14px rgba(179,30,53,.3)}
.btn-danger:hover{filter:brightness(1.05)}
.btn-outline.danger{color:var(--red2);border-color:#f0cdd2}
.btn-outline.danger:hover{border-color:var(--red);color:var(--red)}

/* ----- gestion : hypothèque & banque -----
   Un bien hypothéqué n'est pas perdu : il dort. On le montre grisé et barré
   d'un liseré, pour qu'on voie d'un coup d'œil ce qui ne rapporte plus. */
.prop.hyp{background:repeating-linear-gradient(135deg,#f4ece0 0 8px,#efe5d6 8px 16px);border-color:#dcc9a4;opacity:.9}
.prop.hyp .prop-name{color:#8a7551}
.hyp-tag{display:inline-block;font-size:10px;font-weight:900;color:#8a5a1e;background:#f7e2bb;border:1px solid #e6c98f;border-radius:20px;padding:1px 7px;vertical-align:1px}
.empire-sum .es-hyp{font-size:11px;color:#8a5a1e;font-weight:800}
.empire-lock{font-size:12px;font-weight:700;color:var(--muted);background:var(--paper2);border:1px dashed var(--line);border-radius:10px;padding:8px 10px;text-align:center;margin-bottom:12px}
.ti-hyp{font-size:12px;font-weight:800;color:#8a5a1e;background:#f7e2bb;border:1px solid #e6c98f;border-radius:10px;padding:6px 10px;margin:0 0 10px}

.loan-card{border:1.5px solid var(--line);border-radius:14px;padding:12px 13px;margin-bottom:14px;
  background:linear-gradient(180deg,#fffaf0,#f6ecd6)}
.loan-card.owing{border-color:#e8bfc6;background:linear-gradient(180deg,#fff6f4,#f8e9e4)}
.loan-head{display:flex;align-items:center;gap:8px;font-weight:900;font-size:13.5px;color:var(--ink);margin-bottom:8px}
.loan-note{margin-left:auto;font-size:10.5px;font-weight:800;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:20px;padding:2px 8px}
.loan-lines{display:flex;gap:6px;margin-bottom:9px}
.loan-lines .ll{flex:1;background:#fff;border:1px solid var(--line);border-radius:9px;padding:6px 8px;text-align:center}
.loan-lines .ll span{display:block;font-size:10px;color:var(--muted);font-weight:700}
.loan-lines .ll b{font-size:13.5px;color:var(--ink)}
.loan-lines .ll b.red{color:var(--red)}
.loan-acts{display:flex;gap:6px;flex-wrap:wrap}
.loan-warn{margin-top:8px;font-size:10.5px;line-height:1.45;color:var(--muted);font-weight:600}

/* ----- « Règle ta situation » -----
   Rien n'est vendu à ta place : cette fenêtre pose tes leviers sur la table
   et attend ta décision. La jauge dit à quel point tu t'en approches. */
.debt-box{width:min(520px,95vw);text-align:left;padding:22px}
.debt-head{text-align:center;margin-bottom:14px}
.debt-ico{font-size:34px;line-height:1;margin-bottom:4px;animation:debtPulse 1.6s ease-in-out infinite}
@keyframes debtPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.09)}}
.debt-head h3{font-size:21px;margin:0 0 4px;color:var(--red2)}
.debt-sub{font-size:12.5px;color:var(--muted);font-weight:600;line-height:1.45}
.debt-gauge{height:9px;border-radius:20px;background:#eadfc6;overflow:hidden;margin-bottom:14px;border:1px solid var(--line)}
.debt-gauge i{display:block;height:100%;width:0;border-radius:20px;transition:width .35s ease;
  background:linear-gradient(90deg,var(--red),var(--gold))}
.debt-gauge i.full{background:linear-gradient(90deg,var(--green),#43c07d)}
.debt-body{max-height:52vh;overflow-y:auto;margin:0 -4px;padding:0 4px}
.debt-cash{font-size:13px;font-weight:800;color:var(--ink);background:var(--paper2);border:1px solid var(--line);
  border-radius:11px;padding:9px 12px;margin-bottom:12px}
.debt-cash b{color:var(--green)}
.debt-cash .dc-sub{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-top:2px}
.debt-lever{border:1.5px solid var(--line);border-radius:13px;padding:11px 12px;margin-bottom:10px;background:var(--paper)}
.dl-head{display:flex;flex-direction:column;gap:2px;margin-bottom:8px}
.dl-head>span:first-child{font-weight:900;font-size:13.5px;color:var(--ink)}
.dl-note{font-size:10.5px;color:var(--muted);font-weight:600;line-height:1.4}
.dl-list{display:flex;flex-direction:column;gap:5px}
.dl-item{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:8px 11px;transition:.13s}
.dl-item:hover{border-color:var(--gold2);background:#fffaf0;transform:translateX(2px)}
.dli-name{flex:1;font-size:12.5px;font-weight:800;color:var(--ink)}
.dli-val{font-size:13px;font-weight:900;color:var(--green);white-space:nowrap}
.debt-none{text-align:center;font-size:12.5px;color:var(--muted);font-weight:700;padding:14px 8px;line-height:1.5}
.debt-foot{margin-top:14px;text-align:center;border-top:1px solid var(--line);padding-top:12px}
.debt-foot .btn{font-size:13px;padding:8px 14px}

/* ----- confirmation ----- */
.ask-box{width:min(400px,94vw)}
.ask-ico{font-size:34px;line-height:1;margin-bottom:6px}
.ask-text{font-size:13px;color:var(--muted);line-height:1.55;margin-bottom:16px;font-weight:600}
.ask-text b{color:var(--ink)}
.ask-acts{display:flex;gap:8px}
.ask-acts .btn{flex:1;font-size:14px}

/* ----- bourse ----- */
#market-list{margin-bottom:6px}
.mrow{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--paper2);margin-bottom:6px;border:1px solid var(--line)}
.mrow .memoji{font-size:17px}
.mrow .mname{flex:1;font-size:12.5px;font-weight:800;color:var(--ink)}
.mrow .mprice{font-weight:800;font-size:13.5px;color:var(--ink)}
.mrow .mchg{font-size:11px;font-weight:800;min-width:52px;text-align:right}
.up{color:var(--up)} .down{color:var(--down)}
.mrow .mbuy{display:flex;gap:4px}
.market-hint{font-size:11.5px;color:var(--muted);margin-top:6px;font-weight:600}
.mhold{font-size:10.5px;color:var(--gold2);margin-left:4px;font-weight:800}

/* ----- journal ----- */
#log-list{overflow-y:visible;font-size:12.5px;line-height:1.5}
#log-list .le{padding:4px 2px;border-bottom:1px solid rgba(0,0,0,.05);color:#5a4a30}
#log-list .le.turn{color:var(--red);font-weight:800}

/* ===================== MODALES ===================== */
.modal{position:fixed;inset:0;background:rgba(50,35,10,.5);backdrop-filter:blur(4px);display:none;
  align-items:center;justify-content:center;z-index:50;padding:20px}
.modal.open{display:flex;animation:fade .2s}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal-box{background:linear-gradient(180deg,var(--paper),var(--paper2));border:1px solid var(--line);
  border-radius:18px;padding:26px;width:min(440px,94vw);box-shadow:var(--shadow);position:relative;text-align:center}
.modal-box h3{margin:0 0 8px;color:var(--ink)}
.modal-close{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--muted);font-size:18px}
.muted{color:var(--muted)}

.buy-title{font-weight:900;font-size:21px;margin-bottom:14px;color:var(--ink)}
.deed{border-radius:12px;overflow:hidden;border:1px solid var(--line);margin-bottom:18px;background:#fff}
.deed .deed-head{padding:14px;color:#fff;font-weight:900;font-size:16px;text-shadow:0 1px 2px rgba(0,0,0,.25)}
.deed .deed-body{padding:14px;font-size:13px;color:var(--ink);text-align:left}
.deed .deed-row{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px dashed var(--line)}
.pay-q{font-size:14px;color:var(--muted);margin-bottom:10px;font-weight:700}
.pay-btns{display:flex;gap:10px;justify-content:center;margin-bottom:10px}

/* LECTEUR DE CARTE */
.card-reader{display:none;flex-direction:column;align-items:center;gap:14px;margin-top:8px;position:relative;height:230px;justify-content:flex-end}
.card-reader.show{display:flex}
.reader-body{width:150px;background:linear-gradient(180deg,#3a3f52,#22283a);border-radius:14px;padding:12px;box-shadow:var(--shadow);position:relative;z-index:2}
.reader-screen{background:#0a1f13;border-radius:6px;padding:8px;font-family:monospace;color:#57ff9d;font-size:11px;letter-spacing:1px;min-height:30px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 10px rgba(0,0,0,.6)}
.reader-slot{height:8px;background:#05070d;border-radius:4px;margin:10px 6px;box-shadow:inset 0 2px 4px rgba(0,0,0,.9)}
.reader-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.reader-pad span{height:16px;background:#4a5270;border-radius:4px;transition:.1s}
.reader-pad.typing span.lit{background:var(--gold)}
.bank-card{position:absolute;top:0;width:150px;height:94px;border-radius:11px;
  background:linear-gradient(135deg,#c9a13b,#f6d777 40%,#b8862a);box-shadow:var(--shadow);
  padding:12px;text-align:left;z-index:1;transition:transform .1s}
.bank-card .chip-gold{width:28px;height:22px;border-radius:5px;background:linear-gradient(135deg,#8a6d1f,#e9c95d);margin-bottom:14px}
.bank-card .card-num{font-family:monospace;font-size:12px;color:#3a2c07;letter-spacing:1px}
.bank-card .card-name{font-size:10px;color:#3a2c07;margin-top:4px;font-weight:700}
.bank-card.insert{animation:insertCard 1.1s cubic-bezier(.6,.05,.3,1) forwards}
@keyframes insertCard{0%{transform:translateY(-40px) rotate(-2deg);opacity:1}55%{transform:translateY(120px) rotate(0);opacity:1}70%{transform:translateY(140px) scale(.98)}100%{transform:translateY(150px) scale(.9);opacity:.15}}
.reader-pin{font-family:monospace;font-size:26px;color:var(--gold2);letter-spacing:8px;height:28px}
.reader-approved{display:none;color:var(--green);font-weight:800;font-size:16px;padding:6px 14px;border:2px solid var(--green);border-radius:10px;animation:pop .3s}
.reader-approved.show{display:block}
@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}

/* carte chance/événement */
.card-box{background:linear-gradient(180deg,#fff6df,#f7e8c4)}
.card-kind{font-family:'Playfair Display',serif;font-weight:900;font-size:26px;color:var(--red);margin-bottom:12px}
.card-text{font-size:16px;line-height:1.5;margin-bottom:20px;color:var(--ink)}

/* prison / trade / offre */
.jail-btns{display:flex;flex-direction:column;gap:8px;margin-top:14px}
#trade-body .tr-item{display:flex;gap:8px;align-items:center;margin-bottom:8px}
#trade-body select,#trade-body input{background:#fff;border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:8px}

/* fin */
.over-box .crown{font-size:56px}
#over-title{margin:6px 0;color:var(--ink)}

/* toasts */
.toasts{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:99;align-items:center}
.toast{background:#fff;border:2px solid var(--gold);color:var(--ink);padding:10px 18px;border-radius:12px;font-size:14px;box-shadow:var(--shadow);animation:tin .25s;font-weight:700}
@keyframes tin{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}

/* case achetable : entourée + pulsation (montre où on est sur le plateau) */
.tile{cursor:pointer}
.tile.buyable{outline:3px solid var(--gold);outline-offset:-2px;z-index:5;animation:buypulse 1.1s ease-in-out infinite}
@keyframes buypulse{0%,100%{box-shadow:0 0 0 0 rgba(241,176,17,.75)}50%{box-shadow:0 0 0 9px rgba(241,176,17,0)}}

/* barre d'achat en bas (ne masque pas le plateau) */
.buy-bar{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:60;display:none;
  align-items:center;gap:14px;background:linear-gradient(180deg,#fffdf6,#fbf1d6);border:2px solid var(--gold);
  border-radius:16px;padding:12px 16px;box-shadow:var(--shadow);max-width:94vw}
.buy-bar.show{display:flex;animation:tin .25s}
.buy-bar .bb-info{display:flex;align-items:center;gap:10px}
.buy-bar .bb-dot{width:22px;height:22px;border-radius:6px;flex-shrink:0;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.buy-bar .bb-name{font-weight:800;color:var(--ink);font-size:15px;line-height:1.1}
.buy-bar .bb-sub{font-size:12px;color:var(--muted);font-weight:700}
.buy-bar .bb-btns{display:flex;gap:8px;flex-wrap:wrap}
.buy-bar .bb-btns .btn{padding:10px 14px;font-size:14px}

/* fiche propriété (clic sur une case) */
#tile-info .ti-head{padding:14px;border-radius:12px 12px 0 0;color:#fff;font-weight:900;font-size:17px;margin:-26px -26px 14px;text-shadow:0 1px 2px rgba(0,0,0,.3)}
#tile-info .ti-head.plain{background:#6b5a3a}
#tile-info .ti-owner{margin:0 0 12px;font-weight:800;font-size:14px;display:flex;align-items:center;gap:8px;justify-content:center}
#tile-info .ti-owner .odot{width:12px;height:12px;border-radius:50%}
#tile-info .ti-row{display:flex;justify-content:space-between;padding:5px 2px;border-bottom:1px dashed var(--line);font-size:13.5px;text-align:left}
#tile-info .ti-row span{color:var(--muted)}
#tile-info .ti-actions{display:flex;gap:8px;justify-content:center;margin-top:16px;flex-wrap:wrap}

/* ===== responsive : tablette ===== */
@media(max-width:900px){
  .game-main{flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:10px;gap:10px}
  .board-wrap{height:auto;width:min(96vw,72vh);max-width:none;margin:0 auto}
  .sidebar{max-width:none;min-width:0;width:100%}
  .panel-tabs{min-height:300px}
}
/* ===== responsive : téléphone ===== */
@media(max-width:600px){
  .topbar{flex-wrap:wrap;padding:8px 10px;gap:6px}
  .topbar .logo.tiny{font-size:18px}
  .topbar-mid{order:3;width:100%;justify-content:center;gap:6px}
  .turn-banner{min-width:0;font-size:12.5px;padding:6px 12px}
  .board-wrap{width:96vw;height:96vw}
  .tile{font-size:8px;padding:2px}
  .tile .tname{font-size:7.5px;max-height:24px}
  .tile .cbar{height:11px}
  .center-msg{font-size:12px;padding:5px 10px}
  .center-actions .btn{padding:12px 20px;font-size:15px}
  .center-logo{font-size:min(6vw,34px)}
  .die{width:38px;height:38px}
  .sidebar{gap:10px}
  .tab{font-size:12px;padding:13px 4px}
  .tab-body{padding:10px}
  .empire-head b{font-size:16px}
  .mini{padding:7px 11px;font-size:12px}
  .modal-box{padding:20px}
  .buy-bar{flex-direction:column;gap:10px;bottom:10px;padding:12px}
  .buy-bar .bb-btns .btn{padding:12px 16px;font-size:15px}
}

/* ===================== Kydos : connexion / hall / admin ===================== */
.auth-card{width:min(420px,92vw)}
.auth-note{background:#fff7e2;border:1px solid var(--gold2);color:#7a5a10;border-radius:10px;padding:10px 12px;font-size:13px;margin-bottom:14px;display:none;font-weight:700;text-align:left}
.auth-note.show{display:block}
.auth-tabs{margin-bottom:16px;border:1px solid var(--line);border-radius:12px 12px 0 0;overflow:hidden}
.auth-tabs .tab{padding:11px}
.auth-err{color:var(--red);font-size:13px;min-height:18px;margin:2px 0 8px;font-weight:700;text-align:left}

.hub-actions{display:flex;gap:8px}
#screen-hub.active,#screen-admin.active,#screen-casino.active,#screen-slots.active{display:flex;flex-direction:column;align-items:stretch;padding:0}
.hub-body{flex:1;overflow:auto;padding:30px 20px;display:flex;flex-direction:column;align-items:center}
.hub-title{font-family:'Playfair Display',serif;color:var(--ink);margin:6px 0 26px;text-align:center;font-size:30px}
.hub-games{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;width:min(920px,96%)}
.game-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:8px;position:relative}
.game-card.soon{opacity:.55}
.game-card .gc-emoji{font-size:40px}
.game-card .gc-title{font-weight:900;font-size:21px;color:var(--ink)}
.game-card .gc-desc{font-size:13px;color:var(--muted);flex:1;line-height:1.4}
.game-card .gc-actions{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.game-card .gc-join{display:flex;gap:6px}
.game-card .gc-join input{flex:1;min-width:0;background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:9px 10px;text-transform:uppercase;letter-spacing:2px;font-weight:800;text-align:center}
.soon-badge{position:absolute;top:14px;right:14px;background:var(--line);color:var(--muted);border-radius:20px;padding:3px 10px;font-size:11px;font-weight:800}

.admin-body{flex:1;overflow:auto;padding:20px;max-width:1040px;margin:0 auto;width:100%}
.admin-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:10px;flex-wrap:wrap}
.admin-head h2{color:var(--ink);margin:0}
.admin-list{display:flex;flex-direction:column;gap:8px}
.admin-row{display:grid;grid-template-columns:1.5fr 1.1fr 1.1fr .7fr auto;gap:12px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow-sm)}
.admin-row.head{background:transparent;box-shadow:none;border:none;font-size:11px;text-transform:uppercase;color:var(--muted);font-weight:800;padding:2px 14px}
.admin-row .au-name{font-weight:800;color:var(--ink);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.admin-row .col{font-size:12.5px;color:var(--muted)}
.admin-row .col b{color:var(--ink)}
.badge{font-size:10px;font-weight:800;border-radius:20px;padding:2px 8px;white-space:nowrap}
.badge.on{background:var(--green);color:#fff}
.badge.off{background:var(--line);color:var(--muted)}
.badge.admin{background:var(--blue);color:#fff}
.badge.banned{background:var(--red);color:#fff}
@media(max-width:700px){
  .admin-row{grid-template-columns:1fr auto;gap:6px}
  .admin-row .col{grid-column:1}
  .admin-row.head{display:none}
}

/* bouton "Mettre à jour" quand une nouvelle version est en ligne */
.chip-btn.update-ready{background:var(--green);color:#fff;border-color:var(--green);animation:pulseup 1.1s ease-in-out infinite}
@keyframes pulseup{0%,100%{box-shadow:0 0 0 0 rgba(31,157,85,.6)}50%{box-shadow:0 0 0 6px rgba(31,157,85,0)}}
#ver-chip{font-size:11px}

/* pions animés (couche au-dessus du plateau) */
.token-layer{position:absolute;inset:0;pointer-events:none;z-index:6}
.anim-token{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;display:flex;align-items:center;justify-content:center;
  font-size:19px;filter:drop-shadow(0 2px 2px rgba(0,0,0,.5));transition:left .16s ease, top .16s ease, transform .15s;z-index:6}
.anim-token.current{transform:scale(1.25);z-index:8}
.anim-token.hop{transform:translateY(-6px) scale(1.15)}
.anim-token.current.hop{transform:translateY(-7px) scale(1.35)}

/* ===================== ÉCHECS ===================== */
#screen-chess.active{display:flex;flex-direction:column;align-items:stretch;padding:0}
.chess-main{flex:1;display:flex;gap:16px;padding:16px;min-height:0}
.chess-board-wrap{aspect-ratio:1/1;height:min(86vh,86vw);max-width:86vh;flex:0 0 auto;margin:auto}
.chess-board{position:relative;width:100%;height:100%;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);
  border:6px solid #6b4a2b;border-radius:10px;box-shadow:var(--shadow);overflow:hidden}
.pc.fly{position:absolute;display:flex;align-items:center;justify-content:center;margin:0;z-index:20;pointer-events:none;
  transition:left .32s cubic-bezier(.2,.8,.2,1),top .32s cubic-bezier(.2,.8,.2,1)}
.sqr{position:relative;display:flex;align-items:center;justify-content:center;user-select:none;cursor:pointer}
/* Le damier prend les couleurs du plateau porté (voir pieces.js). */
.sqr.light{background:var(--sq-l,#efe0bd)}
.sqr.dark{background:var(--sq-d,#b07a46)}
/* Les pièces sont des dessins : elles occupent la case, avec une ombre portée
   discrète qui les décolle du bois sans les alourdir. */
.sqr .pc{width:88%;height:88%;line-height:0;pointer-events:none;display:flex;align-items:center;justify-content:center}
.sqr .pc .pcsvg{width:100%;height:100%;filter:drop-shadow(0 2px 2px rgba(0,0,0,.28))}
.cap-pcs .pcsvg,.tok .pcsvg{vertical-align:middle}
.wpc,.bpc{color:inherit;text-shadow:none}
.sqr.last::after{content:"";position:absolute;inset:0;background:rgba(241,176,17,.34)}
.sqr.sel::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 4px var(--gold);background:rgba(241,176,17,.28)}
.sqr.dest::before{content:"";position:absolute;width:30%;height:30%;border-radius:50%;background:rgba(31,157,85,.6);z-index:1}
.sqr.capture::before{content:"";position:absolute;inset:6%;border-radius:50%;box-shadow:inset 0 0 0 5px rgba(209,57,75,.75);z-index:1}
.sqr.check{background:radial-gradient(circle,#ff6b6b 0,#d1394b 75%)!important}
.sqr .coord{position:absolute;font-size:10px;font-weight:800;color:var(--sq-edge,rgba(58,44,26,.55));opacity:.75;pointer-events:none;z-index:2}
.sqr.dark .coord{color:var(--sq-l,#fffdf6);opacity:.8}
.sqr .coord.rank{top:2px;left:3px}
.sqr .coord.file{bottom:1px;right:3px}
.chess-status{font-size:15px;color:var(--ink);text-align:center;padding:4px 0}
.chess-captured{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.cap-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--paper2);border:1px solid var(--line);border-radius:10px;padding:6px 12px;min-height:34px}
.cap-lbl{font-size:12px;color:var(--muted);font-weight:700}
.cap-pcs{font-size:22px;letter-spacing:0;line-height:1;display:inline-flex;flex-wrap:wrap;gap:1px;align-items:center}
.chess-log{overflow:auto;display:flex;flex-direction:column;gap:3px;max-height:240px}
.chess-log .lg{font-size:13px;color:var(--ink);background:var(--paper2);border-radius:8px;padding:5px 9px}
.lp.current{border-color:var(--gold2);box-shadow:0 0 0 2px rgba(241,176,17,.3)}
.lp .tok{font-size:22px;line-height:1}
.promo-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.promo-btns .btn{font-size:16px}
.elo-badge{display:inline-block;background:var(--blue);color:#fff;font-size:10px;font-weight:800;border-radius:20px;padding:1px 7px;margin-left:4px;vertical-align:middle}
/* sélecteur de niveau d'ordinateur (lobby échecs) */
.botlevels{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.bl-title{font-size:12px;color:var(--muted);font-weight:700;text-align:left;margin-bottom:2px}
.bl-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--paper);border:1.5px solid var(--line);
  border-radius:12px;padding:11px 14px;font-weight:800;color:var(--ink);transition:.15s}
.bl-btn:hover{border-color:var(--gold2);color:var(--gold2);transform:translateY(-1px)}
.bl-btn .bl-name{font-size:15px}
.bl-btn .bl-elo{font-size:12px;color:#fff;background:var(--blue);border-radius:20px;padding:2px 9px;font-weight:800}
@media(max-width:900px){
  .chess-main{flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:10px;gap:10px}
  .chess-board-wrap{height:auto;width:min(96vw,72vh);max-width:none;margin:0 auto}
}
@media(max-width:600px){
  .chess-board-wrap{width:96vw;height:96vw}
}

/* ===================== POKER ===================== */
#screen-poker.active{display:flex;flex-direction:column;align-items:stretch;padding:0}
.poker-main{flex:1;display:flex;flex-direction:column;min-height:0;padding:10px 14px 0}
.poker-table-wrap{flex:1;display:flex;align-items:center;justify-content:center;min-height:0}
.poker-table{position:relative;width:min(980px,96vw);aspect-ratio:16/10;max-height:100%}
.pt-felt{position:absolute;inset:8%;border-radius:50%/50%;
  background:radial-gradient(ellipse at 50% 35%,#1a8b55 0,var(--felt) 55%,var(--felt2) 100%);
  border:10px solid #6b4a2b;box-shadow:inset 0 0 60px rgba(0,0,0,.35),var(--shadow)}
.pt-center{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);text-align:center;z-index:3;width:60%}
.pt-pot{display:inline-block;background:rgba(0,0,0,.35);color:#ffe9b8;font-weight:800;font-size:15px;
  padding:5px 16px;border-radius:20px;margin-bottom:10px}
.pt-community{display:flex;gap:6px;justify-content:center;min-height:62px;align-items:center;flex-wrap:wrap}
.pt-waiting{color:rgba(255,255,255,.45);font-size:22px}
.pt-msg{color:#fff;font-size:14px;margin-top:8px;text-shadow:0 1px 3px rgba(0,0,0,.6);min-height:18px}

/* cartes */
.pk-card{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  width:44px;height:62px;background:#fffdf6;border-radius:7px;border:1px solid #d8c9a4;
  box-shadow:0 3px 8px rgba(0,0,0,.35);color:#1e1a12;font-family:'Inter',sans-serif;line-height:1}
.pk-card b{font-size:19px;font-weight:800}
.pk-card i{font-size:17px;font-style:normal}
.pk-card.red{color:#c8102e}
.pk-card.small{width:30px;height:43px}
.pk-card.small b{font-size:13px}.pk-card.small i{font-size:12px}
.pk-card.back{background:repeating-linear-gradient(45deg,#8d2230,#8d2230 5px,#a32b3a 5px,#a32b3a 10px);border-color:#5f141d}
.pk-card.win{box-shadow:0 0 0 3px var(--gold),0 3px 8px rgba(0,0,0,.35)}

/* sièges */
.pk-seat{position:absolute;transform:translate(-50%,-50%);z-index:4;display:flex;flex-direction:column;
  align-items:center;gap:3px;width:150px}
.pk-seat.folded{opacity:.42}
.pk-seat.busted{opacity:.3;filter:grayscale(1)}
.pk-cards{display:flex;gap:3px;min-height:20px}
.pk-plate{background:var(--paper);border:1.5px solid var(--line);border-radius:11px;padding:5px 10px;
  text-align:center;box-shadow:var(--shadow-sm);width:100%}
.pk-seat.turn .pk-plate{border-color:var(--gold);box-shadow:0 0 0 3px rgba(241,176,17,.45)}
.pk-name{font-weight:800;font-size:12.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pk-chips{font-size:12px;color:var(--gold2);font-weight:800}
.pk-hand-text{font-size:10.5px;color:var(--green);font-weight:800;margin-top:2px}
.pk-last{font-size:10.5px;color:var(--muted);font-style:italic}
.pk-btn-d{display:inline-block;background:#fff;color:#1e1a12;border:1.5px solid var(--ink);border-radius:50%;
  width:16px;height:16px;font-size:10px;line-height:13px;font-weight:900;margin-right:4px}
.pk-bet{position:absolute;top:-14px;background:var(--gold);color:#4a3208;font-weight:800;font-size:11px;
  padding:2px 9px;border-radius:20px;box-shadow:var(--shadow-sm)}
.pk-allin{position:absolute;bottom:-13px;background:var(--red);color:#fff;font-weight:900;font-size:10px;
  padding:2px 8px;border-radius:20px;letter-spacing:.5px}

/* barre d'actions */
.poker-actions{display:none;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;
  background:var(--paper);border-top:1px solid var(--line);padding:12px 16px;box-shadow:0 -4px 16px rgba(90,60,15,.12)}
.poker-actions.show{display:flex}
.pk-raise{display:flex;flex-direction:column;gap:5px;min-width:230px}
.pk-raise input[type=range]{width:100%;accent-color:var(--gold2)}
.pk-raise-row{display:flex;align-items:center;gap:10px;justify-content:space-between;font-size:13px;color:var(--muted);font-weight:700}
.pk-raise-row b{color:var(--ink);font-size:15px}

@media(max-width:900px){
  .poker-table{width:98vw}
  .pk-seat{width:112px}
  .pk-card{width:34px;height:48px}.pk-card b{font-size:15px}.pk-card i{font-size:13px}
  .pk-card.small{width:24px;height:34px}.pk-card.small b{font-size:11px}.pk-card.small i{font-size:10px}
}
@media(max-width:600px){
  .poker-main{padding:6px 6px 0}
  .pk-seat{width:92px}
  .pk-name{font-size:11px}.pk-chips{font-size:11px}
  .pk-card{width:27px;height:39px}.pk-card b{font-size:12px}.pk-card i{font-size:11px}
  .pt-pot{font-size:13px;padding:4px 12px}
  .poker-actions{padding:9px 8px;gap:7px}
  .poker-actions .btn{padding:10px 13px;font-size:13.5px}
  .pk-raise{min-width:170px}
}

/* =====================================================================
   ✦ REFONTE VISUELLE — système de design Kydos
   Chaque jeu a son ambiance propre, sur une base commune cohérente.
   ===================================================================== */
:root{
  --ink-soft:#5c4a30;
  --felt-dark:#0d3b26; --felt-mid:#12563a; --felt-lite:#1a8b55;
  --night:#141019; --night2:#1e1726; --night3:#2a2033;
  --gold-lite:#ffd873; --gold-deep:#b8860b;
  --ring:0 0 0 3px rgba(241,176,17,.42);
}

/* ---------- typographie & titres ---------- */
.logo{letter-spacing:.5px}
.hub-title{position:relative;display:inline-block}
.hub-title::after{content:"";display:block;height:3px;width:64px;margin:10px auto 0;border-radius:3px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* ---------- HALL : cartes de jeu avec identité ---------- */
.hub-body{padding:34px 20px 40px}
.hub-games{gap:22px;width:min(1080px,96%)}
.game-card{overflow:hidden;border:none;padding:0;background:var(--paper);
  box-shadow:0 8px 26px rgba(90,60,15,.16);transition:transform .18s,box-shadow .18s}
.game-card:not(.soon):hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(90,60,15,.24)}
.game-card::before{content:"";display:block;height:86px;background:var(--gc-grad,linear-gradient(135deg,#e7d6ab,#f3e6c6));
  position:relative}
.game-card .gc-emoji{position:absolute;top:20px;left:22px;font-size:46px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.32));z-index:2;margin:0}
.game-card .gc-title,.game-card .gc-desc,.game-card .gc-actions{padding-left:22px;padding-right:22px}
.game-card .gc-title{margin-top:12px;font-family:'Playfair Display',serif;font-size:24px;letter-spacing:.3px}
.game-card .gc-desc{margin-top:4px}
.game-card .gc-actions{padding-bottom:22px;margin-top:14px}
/* identités par jeu */
.gc-magnat::before{background:linear-gradient(135deg,#d1394b,#f1b011)}
.gc-chess::before{background:linear-gradient(135deg,#6b4a2b,#b07a46)}
.gc-poker::before{background:linear-gradient(135deg,#0d3b26,#1a8b55)}
.gc-blackjack::before{background:linear-gradient(135deg,#141019,#5b2333)}
.gc-join::before{background:linear-gradient(135deg,#2f7dd1,#7fb2e5)}
.game-card.soon::before{background:linear-gradient(135deg,#d8cbab,#e7d6ab)}
.soon-badge{z-index:3}

/* ---------- barre du haut « casino » ---------- */
.casino-bar{background:linear-gradient(180deg,var(--night2),var(--night));border-bottom:2px solid var(--gold-deep)}
.casino-bar .logo{color:var(--gold-lite);text-shadow:0 2px 10px rgba(241,176,17,.35)}
.casino-bar .chip{background:rgba(255,255,255,.07);border-color:rgba(255,216,115,.28);color:#f3e7cd}
.casino-bar .chip b{color:var(--gold-lite)}
.casino-bar .chip-btn:hover{border-color:var(--gold);color:var(--gold-lite)}
.casino-bar .turn-banner{background:rgba(255,255,255,.08);border-color:rgba(255,216,115,.3);color:#f3e7cd}
.casino-bar .turn-banner.mine{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#3a2a06;border-color:var(--gold-lite)}

/* ---------- POKER : feutre premium ---------- */
#screen-poker{background:radial-gradient(1200px 800px at 50% -10%,#241a2e 0,var(--night) 60%)}
#screen-poker .topbar{background:linear-gradient(180deg,var(--night2),var(--night));border-bottom:2px solid var(--gold-deep)}
#screen-poker .logo{color:var(--gold-lite);text-shadow:0 2px 10px rgba(241,176,17,.35)}
#screen-poker .chip{background:rgba(255,255,255,.07);border-color:rgba(255,216,115,.28);color:#f3e7cd}
#screen-poker .chip b{color:var(--gold-lite)}
#screen-poker .turn-banner{background:rgba(255,255,255,.08);border-color:rgba(255,216,115,.3);color:#f3e7cd}
#screen-poker .turn-banner.mine{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#3a2a06}
.pt-felt{inset:6%;
  background:
    radial-gradient(ellipse at 50% 32%,var(--felt-lite) 0,var(--felt-mid) 52%,var(--felt-dark) 100%);
  border:14px solid #4a3120;
  box-shadow:inset 0 0 90px rgba(0,0,0,.5),inset 0 0 0 3px rgba(255,216,115,.22),0 24px 60px rgba(0,0,0,.5)}
.pt-pot{background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.4));color:var(--gold-lite);
  border:1px solid rgba(255,216,115,.35);font-size:16px;letter-spacing:.4px;
  box-shadow:0 4px 14px rgba(0,0,0,.4)}
.pt-msg{color:#ffeec2;font-weight:700}
.pk-plate{background:linear-gradient(180deg,var(--night3),var(--night2));border-color:rgba(255,216,115,.22);
  box-shadow:0 6px 18px rgba(0,0,0,.45)}
.pk-name{color:#f3e7cd}
.pk-chips{color:var(--gold-lite)}
.pk-last{color:#a996b5}
.pk-seat.turn .pk-plate{border-color:var(--gold);box-shadow:var(--ring),0 6px 18px rgba(0,0,0,.5)}
.pk-btn-d{background:linear-gradient(180deg,#fff,#e8e0cf);border-color:#3a2c1a}
.pk-blind{display:inline-block;background:rgba(255,255,255,.14);color:#ffeec2;border-radius:20px;
  font-size:9px;font-weight:900;padding:1px 6px;margin-right:4px;letter-spacing:.4px}
.poker-actions{background:linear-gradient(180deg,var(--night2),var(--night));border-top:2px solid var(--gold-deep)}
.poker-actions .btn-outline{background:rgba(255,255,255,.08);color:#f3e7cd;border-color:rgba(255,216,115,.3)}
.poker-actions .btn-outline:hover{border-color:var(--gold);color:var(--gold-lite)}
.poker-actions .btn-ghost{color:#b3a2bf}
.poker-actions .btn-ghost:hover{color:#fff}
.pk-raise-row{color:#c9b9d3}
.pk-raise-row b{color:var(--gold-lite)}

/* cartes plus « vraies » */
.pk-card{background:linear-gradient(160deg,#fffefa,#f2ead6);border:1px solid rgba(0,0,0,.18);
  box-shadow:0 4px 10px rgba(0,0,0,.45),inset 0 1px 0 #fff;border-radius:8px}
.pk-card b{letter-spacing:-.5px}
.pk-card.back{background:
    repeating-linear-gradient(45deg,#7d1d2b,#7d1d2b 6px,#9c2739 6px,#9c2739 12px);
  border-color:#4d0f18;box-shadow:0 4px 10px rgba(0,0,0,.5),inset 0 0 0 2px rgba(255,216,115,.35)}

/* ---------- BLACKJACK : ambiance feutre nuit ---------- */
#screen-bj.active{display:flex;flex-direction:column;align-items:stretch;padding:0}
#screen-bj{background:radial-gradient(1200px 800px at 50% -10%,#2a1622 0,var(--night) 60%)}
.bj-main{flex:1;display:flex;flex-direction:column;min-height:0;padding:14px 14px 0;
  align-items:center;justify-content:center;overflow:auto}
.bj-table{position:relative;width:min(1040px,100%);display:flex;flex-direction:column;align-items:center;
  justify-content:flex-start;gap:20px;padding:26px 18px 24px;border-radius:180px 180px 20px 20px;overflow:hidden}
.bj-felt{position:absolute;inset:0;border-radius:180px 180px 20px 20px;
  background:
    radial-gradient(ellipse 70% 55% at 50% 6%,rgba(255,215,150,.16) 0,transparent 60%),
    radial-gradient(ellipse at 50% 0%,#8d2740 0,#5a1a2c 42%,#33111d 100%);
  box-shadow:inset 0 0 120px rgba(0,0,0,.6),inset 0 0 0 3px rgba(255,216,115,.22),0 24px 60px rgba(0,0,0,.5);
  border:11px solid #3a2120}
.bj-dealer,.bj-arc,.bj-seats{position:relative;z-index:2;width:100%}
.bj-dealer{display:flex;flex-direction:column;align-items:center;gap:7px;min-height:104px;justify-content:center}
.bj-dealer-label{color:rgba(255,216,115,.75);font-size:11px;font-weight:900;letter-spacing:3px}
.bj-cards{display:flex;gap:5px;justify-content:center;flex-wrap:wrap}
.bj-total{min-height:22px}
.bj-badge{display:inline-block;background:rgba(0,0,0,.5);color:#ffeec2;border:1px solid rgba(255,216,115,.35);
  border-radius:20px;padding:3px 13px;font-weight:800;font-size:13px}
.bj-badge.ok{background:rgba(31,157,85,.3);border-color:#1f9d55;color:#c6f5da}
.bj-badge.bust{background:rgba(209,57,75,.35);border-color:var(--red);color:#ffd7dc}
.bj-arc{display:flex;justify-content:center;padding:6px 0}
.bj-rule{color:rgba(255,236,200,.5);font-size:10.5px;font-weight:800;letter-spacing:1.6px;text-align:center;
  border-top:1px solid rgba(255,216,115,.18);border-bottom:1px solid rgba(255,216,115,.18);padding:7px 18px;border-radius:40px}
.bj-seats{display:flex;gap:12px;justify-content:center;align-items:flex-end;flex-wrap:wrap;min-height:118px}
.bj-seat{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:132px;max-width:210px}
.bj-seat.out{opacity:.4;filter:grayscale(1)}
.bj-seat.me .pk-plate{border-color:rgba(255,216,115,.5)}
.bj-seat.turn .pk-plate{border-color:var(--gold);box-shadow:var(--ring),0 6px 18px rgba(0,0,0,.5)}
.bj-hands{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;justify-content:center;min-height:52px}
.bj-hand{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px;border-radius:11px;
  border:1.5px solid transparent}
.bj-hand.active{border-color:var(--gold);background:rgba(241,176,17,.12)}
.bj-handinfo{display:flex;gap:5px;align-items:center}
.bj-tag{background:rgba(0,0,0,.5);color:#ffeec2;border-radius:20px;padding:1px 8px;font-size:10.5px;font-weight:800}
.bj-tag.bj{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#3a2a06}
.bj-tag.bust{background:var(--red);color:#fff}
.bj-hbet{font-size:10.5px;color:var(--gold-lite);font-weight:800}
.bj-waitbet{color:#c9b9d3;font-size:12px;font-weight:700;min-height:24px;display:flex;align-items:center}
.bj-ins{font-size:10px;color:#8fd0ff;font-weight:800}
.bj-res{font-size:11px;font-weight:900;margin-top:2px}
.bj-res.win{color:#5ee39b}.bj-res.lose{color:#ff8f9c}
.bj-actions{display:none;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;
  background:linear-gradient(180deg,var(--night2),var(--night));border-top:2px solid var(--gold-deep);padding:12px 16px}
.bj-actions.show{display:flex}
.bj-actions .btn-outline{background:rgba(255,255,255,.08);color:#f3e7cd;border-color:rgba(255,216,115,.3)}
.bj-actions .btn-outline:hover{border-color:var(--gold);color:var(--gold-lite)}
.bj-actions .btn-ghost{color:#b3a2bf}
.bj-wait{color:#d8c9e2;font-weight:700;font-size:14px}
.bj-betrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bj-chip{width:52px;height:52px;border-radius:50%;border:3px dashed rgba(255,255,255,.55);font-weight:900;
  font-size:13px;color:#fff;box-shadow:0 5px 14px rgba(0,0,0,.45);transition:transform .12s}
.bj-chip:hover:not(:disabled){transform:translateY(-3px) scale(1.05)}
.bj-chip:disabled{opacity:.3;cursor:not-allowed}
.bj-chip.c50{background:radial-gradient(circle at 50% 35%,#4b9fe0,#1f5f96)}
.bj-chip.c100{background:radial-gradient(circle at 50% 35%,#5ac47e,#1d7a44)}
.bj-chip.c250{background:radial-gradient(circle at 50% 35%,#e0605f,#96201f)}
.bj-chip.c500{background:radial-gradient(circle at 50% 35%,#b07ce8,#5b2b96)}
.bj-chip.c1000{background:radial-gradient(circle at 50% 35%,#3a3a3a,#0d0d0d);border-color:rgba(255,216,115,.7)}
.bj-betconfirm{display:flex;align-items:center;gap:12px}
.bj-betamount{color:#e6d8ef;font-weight:700}
.bj-betamount b{color:var(--gold-lite);font-size:17px}
.bj-minmax{color:#9a89a6;font-size:11px;font-weight:700}

/* ---------- ÉCHECS : la matière du plateau porté ----------
   Un léger dégradé donne le grain du bois ou de la pierre sans jamais trahir
   les deux couleurs choisies : elles restent lisibles, la pièce se détache. */
.chess-board{border-color:var(--sq-edge,#4a3120);
  box-shadow:0 22px 50px rgba(60,45,20,.28),inset 0 0 0 2px rgba(255,255,255,.14)}
.sqr.light{background:linear-gradient(150deg,var(--sq-l,#f3e6c6),color-mix(in srgb,var(--sq-l,#e6d5ae) 88%,#000))}
.sqr.dark{background:linear-gradient(150deg,var(--sq-d,#b07a46),color-mix(in srgb,var(--sq-d,#95643a) 88%,#000))}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .bj-seats{gap:8px}
  .bj-seat{min-width:110px}
  .bj-rule{font-size:9px;letter-spacing:1px}
}
@media(max-width:600px){
  .game-card::before{height:66px}
  .game-card .gc-emoji{font-size:36px;top:14px;left:16px}
  .game-card .gc-title,.game-card .gc-desc,.game-card .gc-actions{padding-left:16px;padding-right:16px}
  .bj-main{padding:8px 6px 0}
  .bj-seat{min-width:92px}
  .bj-chip{width:44px;height:44px;font-size:11px}
  .bj-rule{display:none}
  .bj-actions{padding:9px 8px;gap:7px}
  .bj-actions .btn{padding:10px 13px;font-size:13.5px}
}


/* ---------- Blackjack : sabot, cartes qui volent, jetons ---------- */
.bj-shoebox{position:absolute;top:19%;right:7%;width:52px;height:38px;border-radius:6px;z-index:3;
  transform:rotate(-8deg);
  background:linear-gradient(160deg,#4a2f22,#2e1c15);border:2px solid rgba(255,216,115,.35);
  box-shadow:0 6px 16px rgba(0,0,0,.5),inset 0 -6px 10px rgba(0,0,0,.45)}
.bj-shoebox::after{content:"";position:absolute;left:5px;right:5px;top:5px;height:9px;border-radius:3px;
  background:repeating-linear-gradient(45deg,#7d1d2b,#7d1d2b 4px,#9c2739 4px,#9c2739 8px);
  box-shadow:0 1px 0 rgba(255,255,255,.18)}
.bj-fly{position:absolute;inset:0;pointer-events:none;z-index:30}
.pk-card.bj-flying{position:absolute;margin:0;transform:rotate(-12deg);
  transition:left .34s cubic-bezier(.22,.75,.24,1),top .34s cubic-bezier(.22,.75,.24,1),
             transform .34s ease-out,opacity .12s linear}

/* jeton posé sur le tapis */
.bj-chipspot{min-height:34px;display:flex;align-items:center;justify-content:center}
.bj-chipspot.empty{min-height:34px}
.bj-tokenchip{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;
  padding:0 7px;border-radius:50%;font-size:11.5px;font-weight:900;color:#fff;
  background:radial-gradient(circle at 50% 32%,#e0605f,#8e1d1d);
  border:3px dashed rgba(255,255,255,.6);box-shadow:0 5px 12px rgba(0,0,0,.5)}
.bj-chipspot.drop .bj-tokenchip{animation:chipdrop .42s cubic-bezier(.2,.9,.25,1.15)}
@keyframes chipdrop{
  0%{transform:translateY(-120px) scale(1.5) rotate(-25deg);opacity:0}
  60%{transform:translateY(6px) scale(.94) rotate(4deg);opacity:1}
  100%{transform:translateY(0) scale(1) rotate(0);opacity:1}
}
.chip-btn.on{background:var(--gold);color:#3a2a06;border-color:var(--gold)}
@media(max-width:600px){
  .bj-shoebox{width:40px;height:30px;top:16%;right:5%}
  .bj-tokenchip{min-width:32px;height:32px;font-size:10.5px}
}

/* ==========================================================================
   CHARGEMENT — l'écran qui se pose entre deux moments de jeu.
   Un éventail de cartes qui se déploie, le nom du jeu qu'on rejoint, et une
   barre qui avance : on comprend tout de suite ce qui se passe.
   ========================================================================== */
.veil{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(700px 460px at 50% 38%,rgba(58,44,72,.6) 0,rgba(16,12,20,.93) 70%);
  backdrop-filter:blur(9px);opacity:0;pointer-events:none;transition:opacity .3s ease}
.veil.show{opacity:1;pointer-events:all}
.veil.closing .veil-box{transform:translateY(-8px) scale(.97);opacity:0}

.veil-box{--vc1:#f1b011;--vc2:#d1394b;
  display:flex;flex-direction:column;align-items:center;gap:15px;
  transition:transform .34s cubic-bezier(.22,1,.36,1),opacity .3s ease}
.veil.show .veil-box{animation:veilIn .42s cubic-bezier(.22,1,.36,1) both}
@keyframes veilIn{from{transform:translateY(14px) scale(.96);opacity:0}to{transform:none;opacity:1}}

.veil-logo{font-family:'Playfair Display',serif;font-weight:900;font-size:34px;letter-spacing:.5px;
  background:linear-gradient(100deg,var(--vc1),#fff3d0 45%,var(--vc1));-webkit-background-clip:text;
  background-clip:text;color:transparent;background-size:220% 100%;animation:veilShine 2.6s linear infinite}
@keyframes veilShine{to{background-position:220% 0}}

/* éventail de cartes : chacune se lève l'une après l'autre */
.veil-cards{display:flex;height:52px;align-items:flex-end;gap:5px;margin-top:2px}
.veil-cards span{width:30px;height:42px;border-radius:5px;background:linear-gradient(160deg,#fffdf6,#efe2c2);
  border:1px solid rgba(0,0,0,.18);box-shadow:0 4px 10px rgba(0,0,0,.4);transform-origin:50% 100%;
  animation:veilCard 1.25s cubic-bezier(.4,0,.3,1) infinite}
.veil-cards span:nth-child(1){animation-delay:0s}
.veil-cards span:nth-child(2){animation-delay:.1s}
.veil-cards span:nth-child(3){animation-delay:.2s}
.veil-cards span:nth-child(4){animation-delay:.3s}
.veil-cards span:nth-child(5){animation-delay:.4s}
@keyframes veilCard{
  0%,100%{transform:translateY(0) rotate(0deg);background:linear-gradient(160deg,#fffdf6,#efe2c2)}
  35%{transform:translateY(-15px) rotate(-7deg);background:linear-gradient(160deg,#fff,#ffe9b5)}
}

.veil-text{color:#f6ecd6;font-weight:800;font-size:16px;letter-spacing:.2px;text-align:center}
.veil-sub{color:rgba(246,236,214,.6);font-weight:600;font-size:12.5px;letter-spacing:.4px;
  text-transform:uppercase;min-height:14px}
.veil-bar{width:190px;height:4px;border-radius:99px;background:rgba(255,255,255,.13);overflow:hidden}
.veil-bar i{display:block;height:100%;width:42%;border-radius:99px;
  background:linear-gradient(90deg,var(--vc2),var(--vc1));animation:veilBar 1.15s ease-in-out infinite}
@keyframes veilBar{0%{transform:translateX(-115%)}100%{transform:translateX(340%)}}

/* une couleur par jeu : on sait où on arrive avant même d'y être */
.veil-box.vt-magnat{--vc1:#f1b011;--vc2:#d1394b}
.veil-box.vt-chess{--vc1:#d9c9a3;--vc2:#6b5a3a}
.veil-box.vt-poker{--vc1:#ffd873;--vc2:#127a4a}
.veil-box.vt-bj{--vc1:#ffd873;--vc2:#8c1c28}
.veil-box.vt-casino{--vc1:#ffd873;--vc2:#7b2ff7}
.veil-box.vt-hub{--vc1:#f1b011;--vc2:#d1394b}
@media(prefers-reduced-motion:reduce){
  .veil-cards span,.veil-bar i,.veil-logo{animation:none}
}

/* ==========================================================================
   HISTORIQUE — tiroir latéral (remplace le bandeau du bas)
   ========================================================================== */
.histo{position:fixed;top:0;right:0;bottom:0;width:min(330px,86vw);z-index:150;
  background:var(--paper,#fffdf6);border-left:1px solid var(--line,#e7d6ab);
  box-shadow:-14px 0 40px rgba(0,0,0,.28);transform:translateX(102%);
  transition:transform .34s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column}
.histo.open{transform:none}
.histo-head{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px;border-bottom:1px solid var(--line,#e7d6ab)}
.histo-title{font-weight:800;font-size:14px;letter-spacing:.3px}
.histo-x{background:none;border:none;font-size:17px;cursor:pointer;color:var(--muted,#977f57);
  padding:2px 6px;border-radius:8px}
.histo-x:hover{background:rgba(0,0,0,.06)}
.histo-list{flex:1;overflow:auto;padding:10px 16px 22px;display:flex;flex-direction:column;gap:5px}
.histo-list .lg{font-size:12.5px;line-height:1.45;color:#5c4a30;
  padding-bottom:5px;border-bottom:1px dashed rgba(0,0,0,.07)}
/* sur les écrans sombres (poker, blackjack) le tiroir suit l'ambiance */
#screen-poker.active~.histo,#screen-bj.active~.histo{background:#231a2c;border-left-color:rgba(255,216,115,.18)}
#screen-poker.active~.histo .histo-title,#screen-bj.active~.histo .histo-title{color:#f3e7cd}
#screen-poker.active~.histo .histo-x,#screen-bj.active~.histo .histo-x{color:#b9a9c4}
#screen-poker.active~.histo .lg,#screen-bj.active~.histo .lg{color:#c9bad3;border-bottom-color:rgba(255,255,255,.07)}

/* ==========================================================================
   SIÈGES LIBRES — « viens t'asseoir »
   ========================================================================== */
.seat-chair{display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;
  padding:10px 12px;border-radius:14px;border:2px dashed rgba(255,216,115,.34);
  background:rgba(255,255,255,.04);transition:.18s ease;min-width:104px}
.seat-chair:hover{border-color:var(--gold,#f1b011);background:rgba(255,216,115,.12);transform:translateY(-2px)}
.seat-chair.sitting{opacity:.5;pointer-events:none}
.chair-icon{font-size:21px;filter:grayscale(.35);transition:.18s}
.seat-chair:hover .chair-icon{filter:none;transform:scale(1.12)}
.chair-label{font-size:10.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  color:rgba(255,216,115,.72)}
.chair-cta{font-size:11px;font-weight:700;color:rgba(255,255,255,.62)}
.pk-seat.empty,.bj-seat.empty{opacity:.85}
.pk-seat.empty:hover,.bj-seat.empty:hover{opacity:1}
.pk-seat.waiting .pk-plate,.bj-seat.waiting .pk-plate{border-style:dashed;opacity:.86}
.pk-seat.leaving,.bj-seat.leaving{opacity:.62}
.pk-seat.me .pk-plate{border-color:rgba(255,216,115,.5)}
.pk-wait{font-size:10px;font-weight:700;color:rgba(255,216,115,.72);letter-spacing:.2px;margin-top:2px}
.seat-no{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;
  border-radius:50%;background:rgba(255,216,115,.2);color:rgba(255,216,115,.9);
  font-size:9.5px;font-weight:900;margin-right:5px}
.pk-watchers,.table-watchers{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);
  font-size:11px;font-weight:700;color:rgba(255,255,255,.45);white-space:nowrap}
.table-watchers{position:relative;left:auto;bottom:auto;transform:none;text-align:center;margin-top:8px}
/* l'arrivée à table : le siège se pose doucement */
.bj-seat,.pk-seat{transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .25s ease}
@keyframes seatIn{from{transform:translateY(16px) scale(.9);opacity:0}to{transform:none;opacity:1}}

/* ---------- Code d'invitation (plus de lien) ---------- */
.code-display{display:flex;align-items:center;gap:12px;justify-content:center;flex-wrap:wrap}
.code-big{font-family:'Playfair Display',serif;font-size:40px;font-weight:900;letter-spacing:9px;
  color:var(--red);background:#fff;border:2px dashed var(--line);border-radius:14px;
  padding:8px 10px 8px 19px;line-height:1.15;box-shadow:var(--shadow-sm)}
.invite-hint{margin-top:10px;font-size:12.5px;color:var(--muted);text-align:center}

/* ---------- Bannissement ---------- */
.ban-durations{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}
.ban-durations .btn{width:100%}
.badge.banned{max-width:190px;overflow:hidden;text-overflow:ellipsis}
.auth-note.danger{background:#fdecee;border-color:var(--red);color:#8c1c28}

@media(max-width:600px){
  .code-big{font-size:30px;letter-spacing:6px;padding:7px 8px 7px 14px}
  .ban-durations{grid-template-columns:1fr}
}

/* ==========================================================================
   LE CASINO
   ========================================================================== */
.chip-wallet{background:linear-gradient(180deg,#fff3d0,#f5dd9a);border-color:#d9930a;color:#5a4108;
  font-weight:900;cursor:pointer}
.chip-wallet b{font-weight:900}
.chip-wallet:hover{filter:brightness(1.04)}
.hub-sub{font-weight:600;font-size:12.5px;color:var(--muted);letter-spacing:0;margin-left:10px}

/* --- écran casino --- */
#screen-casino{background:radial-gradient(1000px 620px at 50% -10%,#3a1442 0,#1a1020 55%,#120c17 100%);color:#f3e7cd}
.casino-body{flex:1;overflow:auto;padding:24px clamp(14px,4vw,46px) 60px}
.cas-h{margin:26px 0 14px;font-size:18px;color:#f3e7cd}
.cas-h .hub-sub{color:rgba(243,231,205,.5)}

.cas-grants{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.grant{display:flex;align-items:center;gap:13px;padding:13px 17px;border-radius:15px;min-width:290px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.grant.ready{background:rgba(255,216,115,.12);border-color:rgba(255,216,115,.5)}
.grant.wait{background:rgba(120,150,255,.09);border-color:rgba(150,175,255,.28)}
.grant.warn{background:rgba(209,57,75,.12);border-color:rgba(209,57,75,.4)}
.grant-ico{font-size:24px}
.grant-txt{display:flex;flex-direction:column;gap:2px;flex:1}
.grant-txt b{font-size:13.5px;color:#fff6de}
.grant-txt span{font-size:12px;color:rgba(243,231,205,.62);line-height:1.4}

/* échelle des paliers */
.cas-ladder{display:flex;gap:10px;flex-wrap:wrap}
.tier{flex:1;min-width:104px;text-align:center;padding:13px 8px;border-radius:15px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09)}
.tier.on{background:color-mix(in srgb,var(--tc) 16%,transparent);border-color:var(--tc);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--tc) 35%,transparent)}
.tier.off{opacity:.5}
.tier-emo{font-size:22px}
.tier-name{font-weight:900;font-size:13px;margin-top:3px;color:#fff6de}
.tier-need{font-size:10.5px;color:rgba(243,231,205,.6);margin-top:2px;font-weight:700}

/* blocs de tables */
.cas-tables{display:flex;flex-direction:column;gap:20px}
.tier-block{border-radius:18px;padding:16px 18px;background:rgba(255,255,255,.035);
  border:1px solid color-mix(in srgb,var(--tc) 34%,transparent)}
.tier-block.locked{opacity:.62}
.tb-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;font-size:15px;color:#fff6de}
.tb-head b{font-size:16px}
.tb-buyin{background:color-mix(in srgb,var(--tc) 22%,transparent);border:1px solid var(--tc);
  border-radius:99px;padding:3px 11px;font-size:11.5px;font-weight:800}
.tb-lock{background:rgba(209,57,75,.18);border:1px solid rgba(209,57,75,.5);border-radius:99px;
  padding:3px 11px;font-size:11.5px;font-weight:800;color:#ffb9c2}
.tb-desc{flex-basis:100%;font-size:12px;color:rgba(243,231,205,.5);font-weight:600}
.tb-tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:11px}

.ctable{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:14px;cursor:pointer;
  background:rgba(0,0,0,.24);border:1px solid rgba(255,255,255,.1);transition:.18s ease}
.ctable:hover{border-color:var(--tc,#ffd873);transform:translateY(-2px);background:rgba(0,0,0,.34)}
.ctable.dim{opacity:.45;cursor:not-allowed}
.ctable.dim:hover{transform:none;border-color:rgba(255,255,255,.1)}
.ct-ico{font-size:25px}
.ct-mid{flex:1;min-width:0}
.ct-name{font-weight:800;font-size:14px;color:#fff6de}
.ct-stakes{font-size:11.5px;color:rgba(243,231,205,.58);font-weight:600;margin-top:2px}
.ct-right{text-align:right}
.ct-seats{font-size:11px;color:rgba(243,231,205,.5);font-weight:700}
.ct-cta{font-size:12.5px;font-weight:800;color:#ffd873;margin-top:3px;white-space:nowrap}
.slot-entry{background:linear-gradient(120deg,rgba(122,18,48,.4),rgba(42,17,64,.4))}

/* ==========================================================================
   MACHINE À SOUS
   ========================================================================== */
#screen-slots{background:radial-gradient(900px 600px at 50% -8%,#40154a 0,#1a1020 58%,#120c17 100%);color:#f3e7cd}
.slots-body{flex:1;overflow:auto;display:flex;gap:26px;align-items:flex-start;justify-content:center;
  padding:26px clamp(14px,4vw,46px) 50px;flex-wrap:wrap}
.slot-machine{position:relative;width:min(440px,94vw);border-radius:26px;padding:22px;text-align:center;
  background:linear-gradient(180deg,#5c1030,#320a26);border:2px solid rgba(255,216,115,.42);
  box-shadow:0 22px 60px rgba(0,0,0,.55),inset 0 2px 0 rgba(255,255,255,.14)}
.slot-machine.flash{animation:slotFlash .8s ease}
@keyframes slotFlash{0%,100%{box-shadow:0 22px 60px rgba(0,0,0,.55)}
  50%{box-shadow:0 0 0 6px rgba(255,216,115,.5),0 22px 70px rgba(255,216,115,.4)}}
.slot-top{font-family:'Playfair Display',serif;font-weight:900;letter-spacing:5px;font-size:15px;
  color:#ffd873;margin-bottom:14px;text-shadow:0 0 14px rgba(255,216,115,.55)}
.slot-window{position:relative;display:flex;gap:9px;justify-content:center;padding:13px;border-radius:16px;
  background:#150a12;border:2px solid rgba(255,216,115,.28);box-shadow:inset 0 6px 18px rgba(0,0,0,.7)}
.reel{width:84px;height:96px;overflow:hidden;border-radius:11px;
  background:linear-gradient(180deg,#fffdf6,#e8dcc0);box-shadow:inset 0 0 14px rgba(0,0,0,.28)}
.reel-strip{display:flex;flex-direction:column;transition:transform .32s cubic-bezier(.2,.8,.3,1)}
.reel-strip span{height:96px;display:flex;align-items:center;justify-content:center;font-size:44px;line-height:1}
.reel-strip span.hit{animation:reelHit .5s ease}
@keyframes reelHit{0%{transform:scale(1)}45%{transform:scale(1.22)}100%{transform:scale(1)}}
.reel.spinning .reel-strip{animation:reelSpin .18s linear infinite;transition:none}
@keyframes reelSpin{from{transform:translateY(0)}to{transform:translateY(-288px)}}
.slot-line{position:absolute;left:8px;right:8px;top:50%;height:2px;transform:translateY(-1px);
  background:linear-gradient(90deg,transparent,rgba(209,57,75,.85),transparent);pointer-events:none}
.slot-msg{margin:16px 0 12px;min-height:24px;font-weight:800;font-size:15px;color:rgba(243,231,205,.72)}
.slot-msg.win{color:#ffd873;font-size:17px}
.slot-msg.win.jackpot{animation:pulseBadge .5s ease-in-out 4}
.slot-msg.lose{color:rgba(243,231,205,.5)}
.slot-bets{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:14px}
.slot-bet{display:flex;flex-direction:column;gap:1px;align-items:center;min-width:66px;padding:8px 10px;
  border-radius:12px;cursor:pointer;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.14);
  color:#f3e7cd;font-family:inherit;transition:.16s}
.slot-bet:hover:not(:disabled){border-color:rgba(255,216,115,.6)}
.slot-bet.on{background:rgba(255,216,115,.2);border-color:#ffd873}
.slot-bet:disabled{opacity:.35;cursor:not-allowed}
.sb-val{font-weight:900;font-size:14px}
.sb-tier{font-size:10px;font-weight:700;opacity:.7}
.slot-spin{width:100%}
.slot-paytable{width:min(300px,94vw);border-radius:18px;padding:16px 18px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.sp-head{font-weight:900;font-size:14px;color:#fff6de;margin-bottom:10px;display:flex;
  justify-content:space-between;align-items:baseline}
.sp-head span{font-size:11px;font-weight:700;color:rgba(243,231,205,.5)}
.sp-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;
  border-bottom:1px dashed rgba(255,255,255,.09)}
.sp-ico{font-size:19px;letter-spacing:2px}
.sp-row b{color:#ffd873;font-size:14px}
.sp-note{margin-top:11px;font-size:11.5px;line-height:1.5;color:rgba(243,231,205,.55)}
.sp-note b{color:#ffd873}

@media(max-width:700px){
  .cc-title{font-size:31px}
  .cc-bal{font-size:27px}
  .tb-tables{grid-template-columns:1fr}
  .reel{width:66px;height:78px}
  .reel-strip span{height:78px;font-size:34px}
  @keyframes reelSpin{from{transform:translateY(0)}to{transform:translateY(-234px)}}
}

/* la table des gains s'efface sur petit écran, et s'ouvre au bouton */
@media(max-width:900px){
  .slot-paytable{display:none}
  .slot-paytable.open{display:block}
}

/* couleurs des jetons : par RANG dans l'échelle de la table (pas par valeur),
   pour que chaque palier ait ses cinq couleurs habituelles */
.bj-chip.k0{background:radial-gradient(circle at 50% 35%,#4b9fe0,#1f5f96)}
.bj-chip.k1{background:radial-gradient(circle at 50% 35%,#5ac47e,#1d7a44)}
.bj-chip.k2{background:radial-gradient(circle at 50% 35%,#e0605f,#96201f)}
.bj-chip.k3{background:radial-gradient(circle at 50% 35%,#b07ce8,#5b2b96)}
.bj-chip.k4{background:radial-gradient(circle at 50% 35%,#3a3a3a,#0d0d0d);border-color:rgba(255,216,115,.7)}

/* ---------- Journal des jetons (panel admin) ---------- */
.wal-sum{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:4px 0 14px}
.wal-sum>div{background:var(--cream);border:1px solid var(--line);border-radius:11px;padding:9px 12px;
  display:flex;flex-direction:column;gap:1px}
.wal-sum span{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.6px}
.wal-sum b{font-size:15px}
.wal-list{max-height:330px;overflow:auto;display:flex;flex-direction:column;gap:3px}
.wal-row{display:grid;grid-template-columns:118px 1fr auto auto;gap:9px;align-items:center;
  font-size:12px;padding:5px 2px;border-bottom:1px dashed rgba(0,0,0,.07)}
.wal-date{color:var(--muted);font-size:10.5px}
.wal-kind{color:#5c4a30}
.wal-row b.up{color:var(--green,#1f9d55)}
.wal-row b.down{color:var(--red)}
.wal-bal{color:var(--muted);font-size:10.5px;min-width:64px;text-align:right}

/* ---------- Ajustement du solde par l'admin ---------- */
.wal-edit{background:var(--cream);border:1px solid var(--line);border-radius:13px;
  padding:13px 15px;margin:0 0 14px}
.wal-edit-title{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;
  color:var(--muted);margin-bottom:9px}
.wal-quick{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:9px}
.wal-fields{display:grid;grid-template-columns:130px 1fr;gap:8px;margin-bottom:9px}
.wal-fields input{background:#fff;border:1.5px solid var(--line);border-radius:9px;
  padding:8px 10px;font-family:inherit;font-size:13.5px;font-weight:600;min-width:0}
.wal-fields input:focus{outline:none;border-color:var(--gold)}
.wal-acts{display:flex;gap:7px;flex-wrap:wrap}
.wal-acts .btn{flex:1;min-width:104px;padding:9px 10px;font-size:13.5px}
.wal-note{margin-top:9px;font-size:11px;line-height:1.45;color:var(--muted)}
.wal-msg{margin-top:7px;font-size:12.5px;font-weight:700;min-height:16px}
.wal-msg.err{color:var(--red)}
@media(max-width:600px){
  .wal-fields{grid-template-columns:1fr}
  .wal-acts .btn{min-width:0}
}

/* ---- la mise, annoncée dans le salon d'attente ---- */
.lobby-stake{display:flex;align-items:flex-start;gap:11px;padding:12px 15px;border-radius:13px;
  margin-bottom:16px;background:#fff7e2;border:1px solid var(--gold2);text-align:left}
.lobby-stake.free{background:var(--cream);border-color:var(--line)}
.ls-emo{font-size:21px;line-height:1.1}
.ls-txt{font-size:13px;line-height:1.5;color:#5c4a30}
.ls-txt b{color:var(--ink)}
.ls-sub{display:block;font-size:11px;color:var(--muted);margin-top:3px}

/* ---- le sort du pot, en fin de partie ---- */
.pot-line{margin:0 0 14px;padding:11px 14px;border-radius:12px;font-size:14px;font-weight:700;
  line-height:1.45;text-align:center}
.pot-line.win{background:#eefaf1;border:1px solid #1f9d55;color:#146c3a}
.pot-line.lose{background:#fdecee;border:1px solid var(--red);color:#8c1c28}
.pot-line.neutral{background:var(--cream);border:1px solid var(--line);color:#5c4a30}
.pot-line b{font-size:16px}
.pot-sub{display:block;font-size:11.5px;font-weight:600;opacity:.75;margin-top:2px}

@media(max-width:700px){
  .hall-h{font-size:21px}
  .stk{min-width:84px;padding:9px 10px}
  #screen-hub .hub-games{grid-template-columns:1fr}
}


/* ==========================================================================
   LE CASINO — une salle qui se visite jeu par jeu.
   Colonne de gauche : les jeux. Panneau de droite : uniquement celui qu'on a
   choisi. Rien n'est empilé, on ne fait jamais défiler pour trouver.
   ========================================================================== */
#screen-casino{background:
  radial-gradient(900px 520px at 12% -14%,rgba(122,18,48,.5) 0,transparent 62%),
  radial-gradient(880px 540px at 90% -8%,rgba(58,20,66,.58) 0,transparent 60%),
  linear-gradient(180deg,#1c1224 0,#140d1a 55%,#100b16 100%);
  color:#f3e7cd}
.casino-layout{flex:1;min-height:0;display:grid;grid-template-columns:236px 1fr;gap:0}

/* ---- colonne de gauche ---- */
.cas-rail{border-right:1px solid rgba(255,216,115,.14);padding:18px 15px 30px;overflow:auto;
  background:rgba(0,0,0,.2)}
.rail-title{font-size:10.5px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase;
  color:rgba(255,216,115,.55);margin:4px 0 10px}
.cas-nav{display:flex;flex-direction:column;gap:5px;margin-bottom:22px}
.cnav{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:12px;cursor:pointer;
  background:transparent;border:1px solid transparent;color:rgba(243,231,205,.72);
  font-family:inherit;font-size:14px;font-weight:700;text-align:left;transition:.16s ease;width:100%}
.cnav:hover{background:rgba(255,255,255,.06);color:#fff6de}
.cnav.on{background:rgba(255,216,115,.14);border-color:rgba(255,216,115,.45);color:#fff6de;
  box-shadow:inset 3px 0 0 #ffd873}
.cnav-emo{font-size:19px;line-height:1}
.cas-rail .cas-grants{display:flex;flex-direction:column;gap:8px;margin-bottom:22px}
.cas-rail .grant{min-width:0;padding:11px 12px;flex-wrap:wrap;gap:9px}
.cas-rail .grant .btn{width:100%;padding:7px 10px;font-size:13px}
.cas-rail .grant-txt b{font-size:12.5px}
.cas-rail .grant-txt span{font-size:11px}
/* l'échelle des paliers, en colonne */
.cas-rail .cas-ladder{display:flex;flex-direction:column;gap:5px}
.cas-rail .tier{display:flex;align-items:center;gap:9px;text-align:left;min-width:0;padding:8px 11px;
  border-radius:10px}
.cas-rail .tier-emo{font-size:15px}
.cas-rail .tier-name{flex:1;font-size:12.5px;margin:0}
.cas-rail .tier-need{font-size:10.5px;margin:0;white-space:nowrap}

/* ---- panneau de droite ---- */
.cas-main{overflow:auto;padding:24px clamp(16px,3vw,34px) 46px}
.cas-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid rgba(255,216,115,.15)}
.cas-head-left{min-width:240px;flex:1}
.cas-game-title{display:flex;align-items:center;gap:11px;font-family:'Playfair Display',serif;
  font-weight:900;font-size:30px;color:#fff6de;letter-spacing:.3px}
.cgt-emo{font-size:26px}
.cas-game-desc{font-size:13px;line-height:1.5;color:rgba(243,231,205,.55);margin-top:5px;max-width:640px}
.cas-modes{display:flex;gap:6px;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.1);
  border-radius:13px;padding:4px}
.cmode{padding:9px 16px;border-radius:10px;cursor:pointer;background:transparent;border:none;
  color:rgba(243,231,205,.65);font-family:inherit;font-size:13.5px;font-weight:800;transition:.16s;white-space:nowrap}
.cmode:hover{color:#fff6de}
.cmode.on{background:rgba(255,216,115,.2);color:#ffd873;box-shadow:0 0 0 1px rgba(255,216,115,.4)}

.cas-note{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.1);border-radius:13px;
  padding:12px 15px;font-size:12.5px;line-height:1.55;color:rgba(243,231,205,.62);margin-bottom:18px}
.cas-note b{color:#ffd873}
.cas-empty{color:rgba(243,231,205,.45);font-size:13.5px;padding:26px 0;text-align:center}

/* liste de tables : une ligne par table, lisible d'un coup d'œil */
.cas-list{display:flex;flex-direction:column;gap:9px}
.cas-list .ctable{display:grid;grid-template-columns:132px 1fr auto;align-items:center;gap:16px;
  padding:14px 17px;border-radius:14px;cursor:pointer;background:rgba(0,0,0,.26);
  border:1px solid rgba(255,255,255,.1);transition:.18s ease}
.cas-list .ctable:hover{border-color:var(--tc,#ffd873);background:rgba(0,0,0,.36);transform:translateX(3px)}
.cas-list .ctable.dim{opacity:.42;cursor:not-allowed}
.cas-list .ctable.dim:hover{transform:none;border-color:rgba(255,255,255,.1)}
.ct-tier{display:flex;align-items:center;gap:8px;font-size:19px}
.ct-tier span{font-size:13px;font-weight:900;color:var(--tc,#ffd873);letter-spacing:.2px}
.cas-list .ct-name{font-weight:800;font-size:14.5px;color:#fff6de}
.cas-list .ct-stakes{font-size:11.5px;color:rgba(243,231,205,.5);font-weight:600;margin-top:2px}
.cas-list .ct-right{text-align:right}
.cas-list .ct-seats{font-size:11.5px;color:rgba(243,231,205,.55);font-weight:700}
.cas-list .ct-seats b{color:#fff6de;font-size:14px}
.cas-list .ct-cta{font-size:12.5px;font-weight:800;color:#ffd873;margin-top:3px;white-space:nowrap}

/* créer une partie entre amis */
.cas-create{margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.09)}
.cas-create>.btn{width:100%;max-width:440px}
.cas-join{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:14px;
  font-size:13px;color:rgba(243,231,205,.55);font-weight:600}
.cas-join input{width:118px;background:rgba(0,0,0,.3);border:1.5px solid rgba(255,255,255,.16);
  border-radius:10px;padding:9px 10px;color:#fff6de;text-transform:uppercase;letter-spacing:3px;
  font-weight:800;text-align:center;font-family:inherit}
.cas-join input:focus{outline:none;border-color:#ffd873}

/* le choix de la mise */
.stk-label{font-size:10.5px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase;
  color:rgba(255,216,115,.6);margin-bottom:9px}
.stk-row{display:flex;gap:9px;flex-wrap:wrap}
.stk{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:106px;padding:11px 14px;
  border-radius:14px;cursor:pointer;font-family:inherit;color:#f3e7cd;
  background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.12);transition:.18s ease}
.stk:hover:not(:disabled){border-color:rgba(255,216,115,.55);transform:translateY(-2px)}
.stk.on{background:rgba(255,216,115,.16);border-color:#ffd873;
  box-shadow:0 0 0 1px rgba(255,216,115,.35),0 6px 18px rgba(255,216,115,.14)}
.stk:disabled{opacity:.3;cursor:not-allowed}
.stk-emo{font-size:19px}
.stk-name{font-weight:900;font-size:13.5px}
.stk-amt{font-size:11px;font-weight:700;color:rgba(243,231,205,.6)}
.stk.on .stk-amt{color:#ffd873}
.stk-note{margin-top:10px;font-size:12px;color:rgba(243,231,205,.5)}

/* ---- le hall : la carte d'entrée et le code ---- */
.hub-quick{width:100%;max-width:1080px;margin:0 auto}
.quick-card{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:var(--paper);
  border:1px solid var(--line);border-radius:18px;padding:20px 24px;box-shadow:var(--shadow-sm)}
.qc-ico{font-size:32px}
.qc-mid{flex:1;min-width:200px}
.qc-title{font-weight:900;font-size:17px;color:var(--ink)}
.qc-sub{font-size:13px;color:var(--muted);margin-top:2px}
.qc-row{display:flex;gap:9px}
.qc-row input{width:140px;background:#fff;border:1.5px solid var(--line);border-radius:11px;
  padding:11px 12px;text-transform:uppercase;letter-spacing:4px;font-weight:800;text-align:center;
  font-family:inherit;font-size:15px}
.qc-row input:focus{outline:none;border-color:var(--gold)}

@media(max-width:900px){
  .casino-layout{grid-template-columns:1fr}
  .cas-rail{border-right:none;border-bottom:1px solid rgba(255,216,115,.14);padding-bottom:18px}
  .cas-nav{flex-direction:row;flex-wrap:wrap}
  .cnav{width:auto;flex:1;min-width:132px;justify-content:center}
  .cnav.on{box-shadow:inset 0 -3px 0 #ffd873}
  .cas-rail .cas-ladder{flex-direction:row;flex-wrap:wrap}
  .cas-rail .tier{flex:1;min-width:104px}
  .cas-list .ctable{grid-template-columns:1fr;gap:8px}
  .cas-list .ct-right{text-align:left}
  .cas-game-title{font-size:24px}
}

/* ==========================================================================
   LE HALL — deux portes compactes
   Le casino et les jeux de société côte à côte. Assez petites pour tout voir
   d'un coup, assez présentes pour donner envie d'entrer.
   ========================================================================== */
.hub-blocks{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;
  width:100%;max-width:840px;margin:0 auto 18px}
.hub-block{position:relative;overflow:hidden;cursor:pointer;border-radius:18px;padding:22px 24px 20px;
  color:#f6ecd6;border:1px solid rgba(255,216,115,.28);box-shadow:0 12px 30px rgba(30,10,35,.34);
  transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s,border-color .2s}
.hub-block:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(30,10,35,.46);
  border-color:rgba(255,216,115,.6)}
.hb-casino{background:linear-gradient(140deg,#3a1030 0,#6d1230 62%,#8c1b28 100%)}
.hb-societe{background:linear-gradient(140deg,#1e2b46 0,#2f4a6b 58%,#3f6b5a 100%);
  border-color:rgba(190,220,255,.28)}
.hb-societe:hover{border-color:rgba(190,220,255,.6)}
.hb-glow{position:absolute;inset:-55% -25% auto auto;width:270px;height:270px;pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.16) 0,transparent 62%)}
.hb-emo{font-size:30px;line-height:1;filter:drop-shadow(0 3px 7px rgba(0,0,0,.4))}
.hb-title{font-family:'Playfair Display',serif;font-weight:900;font-size:25px;letter-spacing:1.2px;
  margin-top:8px;color:#fff6de}
.hb-line{font-size:12.5px;font-weight:800;color:rgba(255,216,115,.9);margin-top:3px;letter-spacing:.2px}
.hb-societe .hb-line{color:rgba(190,230,255,.92)}
.hb-desc{font-size:12.5px;line-height:1.5;color:rgba(246,236,214,.62);margin-top:8px;max-width:330px}
.hb-badge{display:inline-block;margin-top:11px;background:rgba(255,216,115,.18);
  border:1px solid rgba(255,216,115,.5);color:#ffd873;border-radius:99px;padding:4px 11px;
  font-size:11px;font-weight:800;animation:pulseBadge 2s ease-in-out infinite}
.hb-badge.relief{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff3d0}
.hb-cta{margin-top:14px;font-size:13.5px;font-weight:900;color:#ffd873;letter-spacing:.3px}
.hb-societe .hb-cta{color:#bfe3ff}

.hub-quick{width:100%;max-width:840px;margin:0 auto}

/* la salle des jeux de société prend une lumière plus froide */
#screen-casino.societe{background:
  radial-gradient(900px 520px at 12% -14%,rgba(30,60,100,.5) 0,transparent 62%),
  radial-gradient(880px 540px at 90% -8%,rgba(35,70,60,.5) 0,transparent 60%),
  linear-gradient(180deg,#141c28 0,#101620 55%,#0d1219 100%)}
#screen-casino.societe .cnav.on{background:rgba(150,210,255,.14);border-color:rgba(150,210,255,.45);
  box-shadow:inset 3px 0 0 #7fc6ff}
#screen-casino.societe .cmode.on{background:rgba(150,210,255,.18);color:#bfe3ff;
  box-shadow:0 0 0 1px rgba(150,210,255,.4)}
#screen-casino.societe .rail-title{color:rgba(150,210,255,.6)}

@media(max-width:600px){
  .hub-blocks{grid-template-columns:1fr}
  .hb-title{font-size:21px}
}
/* boutons secondaires sur fond sombre */
#screen-casino .btn-outline{background:transparent;border-color:rgba(255,216,115,.45);color:#ffd873}
#screen-casino .btn-outline:hover{background:rgba(255,216,115,.14);border-color:#ffd873}
#screen-casino.societe .btn-outline{border-color:rgba(150,210,255,.45);color:#bfe3ff}
#screen-casino.societe .btn-outline:hover{background:rgba(150,210,255,.14);border-color:#7fc6ff}
/* pastille de palier : discrète tant qu'elle n'a rien à dire */
.chip-rank:empty,.chip-rank[data-empty="1"]{display:none}

/* =========================================================================
   ═══  LE SALON DE JEU  ═══
   Les salles, le profil et le parcours.

   On revient à la matière : du bois chaud, du feutre, du laiton. Un vrai
   salon de jeu, pas une vitrine de boutique. Les panneaux sont posés sur la
   table, avec de l'épaisseur et une ombre ; les titres sont gravés ; l'or ne
   sert qu'à désigner ce qui compte — le tour de jouer, la table ouverte, le
   palier atteint.

   Deux ambiances, une par salle, pour qu'on sache où l'on est dès l'arrivée :
   le casino en acajou et or, les jeux de société en feutre vert et laiton.
   ========================================================================= */
:root{
  --jz-bois:#2a1a12;        /* le bois du meuble */
  --jz-feutre:#12482f;      /* le tapis */
  --jz-or:#f1b011;
  --jz-or2:#d9930a;
  --jz-or-clair:#ffd873;
  --jz-creme:#fdf6e6;
  --jz-creme2:rgba(253,246,230,.62);
  --jz-creme3:rgba(253,246,230,.4);
  --jz-verre:rgba(255,255,255,.055);   /* les panneaux posés dessus */
  --jz-verre2:rgba(255,255,255,.09);
  --jz-trait:rgba(255,216,115,.22);
}

/* ---------- le fond des salles : du bois et de la lumière ---------- */
#screen-casino{
  background:
    radial-gradient(1000px 520px at 50% -18%,rgba(255,216,115,.16) 0,transparent 62%),
    radial-gradient(760px 520px at 8% 108%,rgba(140,27,47,.4) 0,transparent 60%),
    linear-gradient(168deg,#4a2418 0,#33190f 42%,#241109 100%);
  color:var(--jz-creme)}
#screen-casino.societe{
  background:
    radial-gradient(1000px 520px at 50% -18%,rgba(255,216,115,.13) 0,transparent 62%),
    radial-gradient(820px 540px at 92% 104%,rgba(18,72,47,.55) 0,transparent 58%),
    linear-gradient(168deg,#20402f 0,#16301f 45%,#0f2116 100%)}
/* un liseré d'or en haut de la salle, comme le chant d'un meuble */
#screen-casino::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;z-index:5;
  background:linear-gradient(90deg,transparent,var(--jz-or),transparent);opacity:.55;pointer-events:none}

.casino-bar{background:rgba(0,0,0,.28);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--jz-trait)}
#screen-casino .logo.tiny{color:var(--jz-or-clair);font-family:'Playfair Display',serif;
  font-weight:900;font-size:19px;letter-spacing:.4px;text-shadow:0 2px 6px rgba(0,0,0,.5)}
#screen-casino .chip{background:rgba(0,0,0,.3);border:1px solid var(--jz-trait);color:var(--jz-creme2);
  border-radius:22px;font-weight:800}
#screen-casino .chip-btn:hover{border-color:var(--jz-or);color:var(--jz-or-clair);background:rgba(255,216,115,.1)}
#screen-casino .chip-wallet{background:linear-gradient(180deg,rgba(255,216,115,.2),rgba(255,216,115,.08));
  border-color:rgba(255,216,115,.5)}
#screen-casino .chip-wallet b{color:var(--jz-or-clair)}

/* ---------- la colonne des jeux ---------- */
#screen-casino .cas-rail{background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.16));
  border-right:1px solid var(--jz-trait);padding:20px 15px 34px}
#screen-casino .rail-title{color:rgba(255,216,115,.62);letter-spacing:2px;font-size:10px;
  font-weight:900;margin:6px 0 11px;text-transform:uppercase}
#screen-casino .cnav{border-radius:13px;color:var(--jz-creme2);border:1px solid transparent;
  padding:12px 13px;font-weight:800;font-size:14px;background:transparent}
#screen-casino .cnav:hover{background:var(--jz-verre);color:var(--jz-creme)}
#screen-casino .cnav.on,#screen-casino.societe .cnav.on{
  background:linear-gradient(100deg,rgba(255,216,115,.24),rgba(255,216,115,.08));
  border-color:rgba(255,216,115,.5);color:#fff6de;
  box-shadow:inset 3px 0 0 var(--jz-or),0 4px 16px rgba(0,0,0,.3)}
#screen-casino .cnav-emo{font-size:20px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}

/* ---------- le panneau principal ---------- */
#screen-casino .cas-main{padding:26px clamp(16px,3vw,38px) 50px}
#screen-casino .cas-head{border-bottom:1px solid var(--jz-trait);padding-bottom:18px;margin-bottom:22px}
#screen-casino .cas-game-title{color:#fff6de;font-family:'Playfair Display',serif;font-weight:900;
  font-size:clamp(28px,3.4vw,38px);text-shadow:0 3px 10px rgba(0,0,0,.45)}
#screen-casino .cgt-emo{font-size:28px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}
#screen-casino .cas-game-desc{color:var(--jz-creme3);font-size:13px;line-height:1.55;max-width:56ch;margin-top:6px}
#screen-casino .cas-modes{background:rgba(0,0,0,.32);border:1px solid var(--jz-trait);
  border-radius:14px;padding:4px;gap:4px}
#screen-casino .cmode{padding:9px 17px;border-radius:11px;color:var(--jz-creme3);font-size:13.5px;
  font-weight:800;border:none;text-transform:none;letter-spacing:0}
#screen-casino .cmode:hover{color:#fff6de}
#screen-casino .cmode.on,#screen-casino.societe .cmode.on{
  background:linear-gradient(180deg,var(--jz-or),var(--jz-or2));color:#4a3208;
  box-shadow:0 3px 10px rgba(217,147,10,.4)}
#screen-casino .cas-note{background:var(--jz-verre);border:1px solid var(--jz-trait);border-radius:13px;
  padding:12px 15px;color:var(--jz-creme3);font-size:12.5px;margin-bottom:18px;line-height:1.55}
#screen-casino .cas-note b{color:var(--jz-or-clair)}
#screen-casino .cas-empty{color:var(--jz-creme3)}

/* ---------- les tables : de vraies cartes, avec du relief ---------- */
#screen-casino .cas-list{gap:10px;border-top:none}
#screen-casino .cas-list .ctable{
  background:linear-gradient(150deg,rgba(255,255,255,.085),rgba(0,0,0,.22));
  border:1px solid var(--jz-trait);border-radius:15px;padding:15px 18px;
  box-shadow:0 6px 18px rgba(0,0,0,.26);transition:.18s ease}
#screen-casino .cas-list .ctable:hover{transform:translateX(4px);
  border-color:var(--tc,var(--jz-or));box-shadow:0 10px 26px rgba(0,0,0,.36)}
#screen-casino .cas-list .ctable.dim{opacity:.4}
#screen-casino .cas-list .ctable.dim:hover{transform:none;border-color:var(--jz-trait)}
#screen-casino .ct-tier{font-size:20px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
#screen-casino .ct-tier span{color:var(--tc,var(--jz-or-clair));font-size:12px;font-weight:900;
  letter-spacing:.6px;text-transform:none}
#screen-casino .cas-list .ct-name{color:#fff6de;font-size:15px;font-weight:900}
#screen-casino .cas-list .ct-stakes{color:var(--jz-creme3);font-size:11.5px;margin-top:2px}
#screen-casino .cas-list .ct-seats{color:var(--jz-creme3)}
#screen-casino .cas-list .ct-seats b{color:#fff6de;font-size:15px}
#screen-casino .cas-list .ct-cta{color:var(--jz-or-clair);font-size:12.5px;font-weight:900;
  letter-spacing:0;text-transform:none}

/* ---------- créer une partie, choisir sa mise ---------- */
#screen-casino .cas-create{border-top:1px solid var(--jz-trait);margin-top:26px;padding-top:22px}
#screen-casino .stk-label{color:rgba(255,216,115,.62);letter-spacing:2px;font-size:10px}
#screen-casino .stk{background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(0,0,0,.2));
  border:1.5px solid var(--jz-trait);border-radius:15px;color:var(--jz-creme);padding:12px 15px}
#screen-casino .stk:hover:not(:disabled){transform:translateY(-2px);border-color:rgba(255,216,115,.6)}
#screen-casino .stk.on{background:linear-gradient(160deg,rgba(255,216,115,.24),rgba(255,216,115,.07));
  border-color:var(--jz-or);box-shadow:0 6px 20px rgba(241,176,17,.24)}
#screen-casino .stk-emo{font-size:20px}
#screen-casino .stk-name{color:#fff6de;font-size:13.5px;font-weight:900}
#screen-casino .stk-amt,#screen-casino .stk-note,#screen-casino .cas-join{color:var(--jz-creme3)}
#screen-casino .stk.on .stk-amt{color:var(--jz-or-clair)}
#screen-casino .cas-join input{background:rgba(0,0,0,.3);border:1.5px solid var(--jz-trait);
  border-radius:11px;color:#fff6de}
#screen-casino .cas-join input:focus{border-color:var(--jz-or)}

/* ---------- boutons de salle ---------- */
#screen-casino .btn{border-radius:13px;letter-spacing:0;text-transform:none;font-size:15px;
  font-weight:800;padding:12px 20px}
#screen-casino .btn-gold{background:linear-gradient(180deg,var(--jz-or),var(--jz-or2));color:#4a3208;
  box-shadow:0 6px 18px rgba(217,147,10,.35)}
#screen-casino .btn-gold:hover{filter:brightness(1.06)}
#screen-casino .btn-outline,#screen-casino.societe .btn-outline{background:rgba(255,255,255,.05);
  border:1.5px solid rgba(255,216,115,.45);color:var(--jz-or-clair)}
#screen-casino .btn-outline:hover,#screen-casino.societe .btn-outline:hover{
  background:rgba(255,216,115,.15);border-color:var(--jz-or);color:#fff6de}

/* ---------- dotations et paliers ---------- */
#screen-casino .grant{background:linear-gradient(150deg,rgba(255,216,115,.16),rgba(0,0,0,.2));
  border:1px solid rgba(255,216,115,.4);border-radius:14px}
#screen-casino .grant-txt b{color:#fff6de}
#screen-casino .grant-txt span{color:var(--jz-creme3)}
#screen-casino .tier{border-radius:12px;border:1px solid transparent;background:var(--jz-verre)}
#screen-casino .tier-name{color:var(--jz-creme2)}
#screen-casino .tier-need{color:var(--jz-creme3)}
#screen-casino .tier.on{background:linear-gradient(100deg,color-mix(in srgb,var(--tc) 26%,transparent),transparent);
  border-color:var(--tc)}
#screen-casino .tier.locked{opacity:.42}

/* =========================================================================
   MON PROFIL — la même matière que les salles.
   Un écran de jeu : bois chaud, panneaux dorés, médailles. On doit avoir
   envie de l'ouvrir pour regarder où on en est, pas seulement pour changer
   son mot de passe.
   ========================================================================= */
#screen-profil.active{display:flex;flex-direction:column;align-items:stretch;padding:0}
#screen-profil{color:var(--jz-creme);background:
  radial-gradient(1000px 520px at 50% -18%,rgba(255,216,115,.15) 0,transparent 62%),
  radial-gradient(800px 520px at 92% 106%,rgba(74,36,24,.55) 0,transparent 58%),
  linear-gradient(168deg,#3d2317 0,#2b1710 45%,#1e0f08 100%)}
#screen-profil::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;z-index:5;
  background:linear-gradient(90deg,transparent,var(--jz-or),transparent);opacity:.55;pointer-events:none}
#screen-profil .topbar{background:rgba(0,0,0,.28);backdrop-filter:blur(10px);border-bottom:1px solid var(--jz-trait)}
#screen-profil .logo.tiny{color:var(--jz-or-clair);font-family:'Playfair Display',serif;font-weight:900;font-size:19px}
#screen-profil .chip{background:rgba(0,0,0,.3);border:1px solid var(--jz-trait);color:var(--jz-creme2);border-radius:22px}
#screen-profil .chip-btn:hover{border-color:var(--jz-or);color:var(--jz-or-clair);background:rgba(255,216,115,.1)}
.prof-body{flex:1;min-height:0;overflow:auto;padding:24px clamp(14px,3vw,40px) 54px;
  width:100%;max-width:1180px;margin:0 auto}

/* ---------- l'avatar ---------- */
.av{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;
  width:36px;height:36px;border-radius:50%;background:var(--av,#b3a894);flex-shrink:0;
  position:relative;vertical-align:middle;box-shadow:0 3px 10px rgba(0,0,0,.35)}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.av i{font-style:normal;font-weight:900;font-size:13px;color:#fffdf6;letter-spacing:.5px;
  text-shadow:0 1px 3px rgba(0,0,0,.55)}
.av-sm{width:30px;height:30px}.av-sm i{font-size:11px}
.av-lg{width:74px;height:74px}.av-lg i{font-size:26px}
.av-xl{width:116px;height:116px}.av-xl i{font-size:40px}
/* les bordures se débloquent en montant */
.av.fr-filet{box-shadow:0 0 0 2px rgba(255,216,115,.5),0 3px 10px rgba(0,0,0,.35)}
.av.fr-double{box-shadow:0 0 0 2px var(--jz-or),0 0 0 5px rgba(0,0,0,.45),0 0 0 7px rgba(255,216,115,.45)}
.av.fr-laurier{box-shadow:0 0 0 3px #7d9a63,0 0 0 6px rgba(0,0,0,.45),0 0 0 8px #a8c48a}
.av.fr-or{box-shadow:0 0 0 3px var(--jz-or),0 0 0 6px rgba(0,0,0,.5),0 0 0 8px #ffe9a8,
  0 0 22px rgba(241,176,17,.5)}
.av.fr-noir{box-shadow:0 0 0 4px #14110d,0 0 0 7px var(--jz-or),0 0 26px rgba(241,176,17,.35)}

/* ---------- la pastille de grade ---------- */
.grade-pill{display:inline-flex;align-items:center;gap:5px;margin-left:6px;padding:2px 9px 2px 3px;
  border-radius:20px;background:linear-gradient(180deg,var(--g,#8d8579),color-mix(in srgb,var(--g,#8d8579) 74%,#000));
  color:var(--gi,#fff);font-size:9.5px;font-weight:900;letter-spacing:.5px;text-transform:uppercase;
  vertical-align:1px;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.grade-pill b{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;
  border-radius:50%;background:rgba(255,255,255,.3);font-size:9.5px;padding:0 3px}
.grade-pill.big{font-size:11.5px;padding:4px 14px 4px 5px;gap:8px}
.grade-pill.big b{min-width:22px;height:22px;font-size:12.5px}
.ttl{font-style:normal;font-size:11.5px;color:var(--jz-or-clair);font-weight:800;margin-left:6px}

/* ---------- la carte d'identité : le panneau du haut ---------- */
.prof-card{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(16px,3vw,36px);align-items:center;
  border:1px solid rgba(255,216,115,.34);border-radius:20px;padding:24px clamp(16px,3vw,30px);margin-bottom:20px;
  background:linear-gradient(150deg,rgba(255,216,115,.12),rgba(0,0,0,.28));
  box-shadow:0 14px 40px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08)}
.pc-left{display:flex;flex-direction:column;align-items:center;gap:10px}
.pc-left .mini{background:rgba(0,0,0,.3);border:1.5px solid rgba(255,216,115,.4);color:var(--jz-or-clair);
  border-radius:20px;font-size:11px}
.pc-left .mini:hover{background:rgba(255,216,115,.16);border-color:var(--jz-or);color:#fff6de}
.pc-name{font-family:'Playfair Display',serif;font-size:clamp(28px,3.2vw,40px);font-weight:900;
  color:#fff6de;line-height:1.05;text-shadow:0 3px 12px rgba(0,0,0,.45)}
.pc-grade{margin:9px 0 15px;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.pc-grade .grade-pill{margin-left:0}
/* la barre de niveau : le repère qu'on cherche des yeux en arrivant */
.pc-bar{height:11px;border-radius:20px;background:rgba(0,0,0,.4);overflow:hidden;margin-bottom:9px;
  border:1px solid rgba(255,216,115,.28);box-shadow:inset 0 2px 5px rgba(0,0,0,.4)}
.pc-bar i{display:block;height:100%;border-radius:20px;transition:width .6s cubic-bezier(.3,1,.4,1);
  background:linear-gradient(90deg,var(--jz-or2),var(--jz-or) 55%,#ffe9a8);
  box-shadow:0 0 14px rgba(241,176,17,.6)}
.pc-xp{font-size:13px;color:var(--jz-creme3)}
.pc-xp b{color:#fff6de}
.pc-next{font-size:12px;color:var(--jz-creme3);margin-top:5px}
.pc-next b{color:var(--jz-or-clair)}
.pc-right{display:flex;flex-direction:column;gap:6px;min-width:158px}
.pc-stat{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:7px 12px;
  background:rgba(0,0,0,.26);border:1px solid var(--jz-trait);border-radius:11px}
.pc-stat span{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--jz-creme3);font-weight:800}
.pc-stat b{font-size:16px;color:#fff6de}
.pc-day{font-size:10.5px;color:var(--jz-creme3);margin-top:4px;line-height:1.4;text-align:center}

/* ---------- les onglets ---------- */
.prof-tabs{display:flex;gap:5px;background:rgba(0,0,0,.3);border:1px solid var(--jz-trait);
  border-radius:15px;padding:5px;margin-bottom:22px;width:fit-content}
.prof-tabs .tab{background:none;border:none;border-radius:11px;padding:10px 22px;font-family:inherit;
  font-size:14px;font-weight:800;color:var(--jz-creme3);cursor:pointer;transition:.16s}
.prof-tabs .tab:hover{color:#fff6de}
.prof-tabs .tab.active{background:linear-gradient(180deg,var(--jz-or),var(--jz-or2));color:#4a3208;
  box-shadow:0 3px 12px rgba(217,147,10,.4)}
.prof-pane{display:none}
.prof-pane.active{display:block}

/* ---------- le parcours ---------- */
.parc-intro{display:grid;grid-template-columns:1fr 330px;gap:22px;margin-bottom:22px}
.pi-txt h3{font-family:'Playfair Display',serif;font-size:23px;color:#fff6de;margin:0 0 9px;font-weight:900}
.pi-txt p{font-size:13.5px;line-height:1.65;color:var(--jz-creme3);margin:0;max-width:56ch}
.pi-tab{border:1px solid var(--jz-trait);border-radius:16px;padding:6px 16px;
  background:linear-gradient(150deg,rgba(255,255,255,.07),rgba(0,0,0,.22))}
.pi-tab>div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;
  border-bottom:1px solid rgba(255,216,115,.13);font-size:12.5px;color:var(--jz-creme3)}
.pi-tab>div:last-child{border-bottom:none}
.pi-tab b{color:var(--jz-or-clair);font-weight:900}
.pi-tab .pi-warn{display:block;font-size:10.5px;line-height:1.5;color:var(--jz-creme3);padding:10px 0}

/* le prochain déblocage : la carotte, avec sa médaille */
.pi-next{margin-top:18px;border:1px solid rgba(255,216,115,.4);border-radius:16px;padding:16px 18px;
  background:linear-gradient(140deg,rgba(255,216,115,.16),rgba(0,0,0,.24));
  display:flex;align-items:center;gap:16px;max-width:460px;box-shadow:0 8px 24px rgba(0,0,0,.28)}
.pi-next .pn-lvl{display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:58px;height:58px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(160deg,var(--jz-or),var(--jz-or2));color:#4a3208;
  box-shadow:0 4px 14px rgba(217,147,10,.45)}
.pi-next .pn-lvl b{font-size:21px;line-height:1}
.pi-next .pn-lvl span{font-size:7.5px;letter-spacing:1.2px;text-transform:uppercase;font-weight:900;opacity:.75}
.pi-next .pn-lbl{font-size:9.5px;letter-spacing:1.8px;text-transform:uppercase;color:rgba(255,216,115,.7);font-weight:900}
.pi-next .pn-name{font-size:17px;font-weight:900;color:#fff6de;margin:3px 0}
.pi-next .pn-sub{font-size:11.5px;color:var(--jz-creme3);line-height:1.45}

/* la piste : une médaille par niveau, celle du moment allumée */
.parc-track{position:relative;border:1px solid var(--jz-trait);border-radius:16px;overflow:hidden auto;
  max-height:min(54vh,580px);background:rgba(0,0,0,.2);scrollbar-width:thin}
.parc-row{display:grid;grid-template-columns:62px 1fr auto;gap:16px;align-items:center;
  padding:12px 16px;border-bottom:1px solid rgba(255,216,115,.1);transition:.16s}
.parc-row:last-child{border-bottom:none}
.parc-row:hover{background:rgba(255,216,115,.07)}
.pr-lvl b{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;
  font-size:15px;font-weight:900;color:var(--jz-creme3);background:rgba(0,0,0,.35);
  border:1.5px solid rgba(255,216,115,.22)}
.parc-row.done{opacity:.6}
.parc-row.done .pr-lvl b{background:linear-gradient(160deg,#6d5a33,#4a3d22);color:#ffe9a8;
  border-color:rgba(255,216,115,.4)}
.parc-row.now{background:linear-gradient(90deg,rgba(255,216,115,.18),transparent 70%);
  box-shadow:inset 3px 0 0 var(--jz-or)}
.parc-row.now .pr-lvl b{background:linear-gradient(160deg,var(--jz-or),var(--jz-or2));color:#4a3208;
  border-color:#ffe9a8;box-shadow:0 0 18px rgba(241,176,17,.55)}
.pr-grade{display:inline-block;font-size:9.5px;font-weight:900;letter-spacing:1.2px;text-transform:uppercase;
  background:linear-gradient(180deg,var(--g),color-mix(in srgb,var(--g) 74%,#000));color:var(--gi);
  padding:3px 10px;border-radius:20px;margin-bottom:5px;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.pr-rew{display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-size:13.5px}
.pr-chips{color:var(--jz-or-clair);font-weight:900}
.pr-item{color:#fff6de;font-weight:800}
.pr-desc{font-size:11.5px;color:var(--jz-creme3);margin-top:3px}
.pr-xp{font-size:11px;color:var(--jz-creme3);white-space:nowrap;font-weight:800}

/* ---------- le vestiaire ---------- */
.vest-block{margin-bottom:30px}
.vest-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.vest-head h3{font-family:'Playfair Display',serif;font-size:21px;color:#fff6de;margin:0;font-weight:900}
.vest-head span{font-size:12px;color:var(--jz-creme3)}
.vest-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:12px}
.vest-card{border:1.5px solid var(--jz-trait);border-radius:16px;padding:14px;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:6px;transition:.18s;
  background:linear-gradient(155deg,rgba(255,255,255,.075),rgba(0,0,0,.24));
  box-shadow:0 6px 18px rgba(0,0,0,.24)}
.vest-card:hover{transform:translateY(-3px);border-color:rgba(255,216,115,.55)}
.vest-card.on{border-color:var(--jz-or);
  background:linear-gradient(155deg,rgba(255,216,115,.2),rgba(0,0,0,.2));
  box-shadow:0 8px 24px rgba(241,176,17,.24)}
.vest-card.locked{opacity:.48;filter:saturate(.5)}
.vest-card.locked:hover{transform:none}
.vc-top{min-height:64px;display:flex;align-items:center;justify-content:center;padding:4px 0}
.vc-name{font-size:13.5px;font-weight:900;color:#fff6de}
.vc-desc{font-size:10.5px;color:var(--jz-creme3);line-height:1.45;min-height:28px}
.vest-card .mini{background:rgba(0,0,0,.3);border:1.5px solid rgba(255,216,115,.4);
  color:var(--jz-or-clair);border-radius:20px;font-size:11.5px}
.vest-card .mini:hover{background:linear-gradient(180deg,var(--jz-or),var(--jz-or2));color:#4a3208;border-color:var(--jz-or)}
.vc-on{font-size:10px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase;color:var(--jz-or-clair)}
.vc-lock{font-size:11px;font-weight:800;color:var(--jz-creme3)}
.vc-titre{display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1.2}
.vc-titre b{font-size:13.5px;color:#fff6de}
.vc-titre .ttl{margin-left:0}
.vc-sw{display:inline-flex;border-radius:9px;overflow:hidden;border:1px solid var(--jz-trait)}
.vc-sw i{width:27px;height:27px;display:block}
.vc-board{display:grid;grid-template-columns:repeat(4,14px);grid-template-rows:repeat(4,14px);
  border-radius:5px;overflow:hidden;box-shadow:0 3px 10px rgba(0,0,0,.4)}
.vc-board i{display:block}
.vc-pieces{display:flex;align-items:center;gap:2px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.45))}

/* ---------- le compte ---------- */
.cpt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(292px,1fr));gap:14px}
.cpt-card{border:1px solid var(--jz-trait);border-radius:18px;padding:22px;
  background:linear-gradient(155deg,rgba(255,255,255,.07),rgba(0,0,0,.24));
  box-shadow:0 8px 24px rgba(0,0,0,.26)}
.cpt-card h3{font-family:'Playfair Display',serif;font-size:19px;color:#fff6de;margin:0 0 8px;font-weight:900}
.cpt-card p{font-size:12px;line-height:1.6;margin:0 0 15px;color:var(--jz-creme3)}
.cpt-card .field span{font-size:11px;color:var(--jz-creme3);font-weight:800}
.cpt-card .field input{background:rgba(0,0,0,.32);border:1.5px solid var(--jz-trait);
  border-radius:11px;color:#fff6de}
.cpt-card .field input:focus{outline:none;border-color:var(--jz-or)}
.cpt-card .btn{width:100%;border-radius:12px;font-size:14px;padding:12px}
.cpt-card .btn-gold{background:linear-gradient(180deg,var(--jz-or),var(--jz-or2));color:#4a3208;
  box-shadow:0 5px 16px rgba(217,147,10,.35)}
.cpt-card .btn-outline{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,216,115,.45);
  color:var(--jz-or-clair)}
.cpt-card .btn-outline:hover{background:rgba(255,216,115,.15);color:#fff6de}
.cpt-msg{font-size:12px;color:var(--jz-or-clair);min-height:16px;margin-bottom:8px;font-weight:800}
.cpt-photo{display:flex;align-items:center;gap:16px}
.cpt-photo-acts{display:flex;flex-direction:column;gap:6px}
.cpt-photo .mini{background:rgba(0,0,0,.3);border:1.5px solid rgba(255,216,115,.4);
  color:var(--jz-or-clair);border-radius:20px;font-size:11.5px}
.cpt-photo .mini.danger{border-color:rgba(209,57,75,.5);color:#ff9aa6}

/* ---------- la pastille « moi » du hall ---------- */
.chip-me{display:inline-flex;align-items:center;gap:9px;padding:4px 13px 4px 4px}
.chip-me .me-txt{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.chip-me .me-txt b{font-size:12.5px}
.chip-me .me-txt i{font-style:normal;font-size:10px;color:var(--muted);font-weight:800}

/* ---------- rester connecté ---------- */
.check{display:flex;align-items:center;gap:9px;margin:2px 0 14px;font-size:12.5px;
  color:var(--muted);font-weight:700;cursor:pointer;user-select:none}
.check input{width:16px;height:16px;accent-color:var(--gold2);cursor:pointer}

/* =========================================================================
   LA MONTÉE DE NIVEAU
   La seule fois où l'on interrompt le joueur. Un halo d'or, le chiffre en
   grand, et ce qu'on vient de gagner. Court, franc, et on repart jouer.
   ========================================================================= */
.level-box{width:min(420px,94vw);text-align:center;overflow:hidden;color:var(--jz-creme);
  background:linear-gradient(165deg,#4a2c18 0,#2e1a0e 60%,#231207 100%);
  border:1.5px solid rgba(255,216,115,.5);
  box-shadow:0 26px 70px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.1)}
.lvl-halo{position:absolute;inset:-45% -20% auto;height:280px;pointer-events:none;
  background:radial-gradient(58% 100% at 50% 100%,rgba(241,176,17,.55) 0,transparent 72%);
  animation:haloIn .8s ease}
@keyframes haloIn{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
.lvl-num{font-family:'Playfair Display',serif;font-size:82px;line-height:1;font-weight:900;
  position:relative;color:#ffe9a8;text-shadow:0 0 34px rgba(241,176,17,.75),0 4px 12px rgba(0,0,0,.5);
  animation:lvlIn .55s cubic-bezier(.2,1.4,.4,1)}
@keyframes lvlIn{from{opacity:0;transform:scale(.55) translateY(14px)}to{opacity:1;transform:none}}
.lvl-say{font-size:11px;letter-spacing:2.6px;text-transform:uppercase;color:rgba(255,216,115,.75);
  font-weight:900;margin:6px 0 15px;position:relative}
.lvl-grade{display:inline-block;font-size:10.5px;font-weight:900;letter-spacing:1.6px;text-transform:uppercase;
  background:linear-gradient(180deg,var(--g),color-mix(in srgb,var(--g) 72%,#000));color:var(--gi);
  padding:6px 16px;border-radius:20px;margin-bottom:16px;position:relative;
  box-shadow:0 4px 16px rgba(0,0,0,.4)}
.lvl-rewards{text-align:left;margin-bottom:18px;position:relative;
  border:1px solid rgba(255,216,115,.24);border-radius:14px;background:rgba(0,0,0,.28)}
.lvl-rewards .lr{display:flex;gap:13px;align-items:center;padding:13px 15px;
  border-bottom:1px solid rgba(255,216,115,.14)}
.lvl-rewards .lr:last-child{border-bottom:none}
.lvl-rewards .lr>span{font-size:22px;width:28px;text-align:center;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
.lvl-rewards .lr b{display:block;font-size:15px;color:#fff6de}
.lvl-rewards .lr i{font-style:normal;font-size:11.5px;color:var(--jz-creme3)}
.level-box .btn{border-radius:12px;position:relative;font-size:15px;
  background:linear-gradient(180deg,var(--jz-or),var(--jz-or2));color:#4a3208;
  box-shadow:0 6px 20px rgba(217,147,10,.4)}

/* ---------- la feuille de partie ---------- */
.chess-moves{max-height:190px;overflow-y:auto;font-size:12.5px;
  font-family:ui-monospace,'SFMono-Regular',Menlo,monospace}
.mv-row{display:grid;grid-template-columns:30px 1fr 1fr;gap:6px;padding:3px 5px;border-radius:5px}
.mv-row:nth-child(odd){background:rgba(0,0,0,.035)}
.mv-row.last{background:rgba(217,147,10,.2);font-weight:800}
.mv-n{color:var(--muted);font-size:11px;text-align:right}
.mv-w,.mv-b{color:var(--ink)}

@media(max-width:900px){
  .parc-intro{grid-template-columns:1fr}
}
@media(max-width:760px){
  .prof-card{grid-template-columns:1fr;text-align:center;justify-items:center}
  .pc-right{width:100%;max-width:340px}
  .prof-tabs{width:100%}
  .prof-tabs .tab{flex:1;padding:10px 8px;font-size:13px}
}

/* 1.6.16 - table classique et transitions desktop */
#screen-classic{overflow:hidden!important;background:#0b0f0d!important}
#screen-classic>.topbar{position:relative;z-index:5}
#screen-classic .classic-main{
  width:100%;height:calc(100dvh - 64px);min-height:0;
  grid-template-columns:minmax(420px,1fr) minmax(270px,310px);
  gap:0;padding:0;overflow:hidden;
}
#screen-classic .classic-stage{
  min-width:0;width:100%;padding:18px 26px 22px;overflow:hidden;
  background:#0b0f0d;
}
#screen-classic .classic-heading{width:min(100%,760px);margin-bottom:12px}
#screen-classic .classic-board{
  width:min(100%,calc(100dvh - 166px),760px)!important;
  max-width:760px;max-height:calc(100dvh - 166px);
  box-sizing:border-box;flex:0 1 auto;
}
#screen-classic .classic-board.game-tictactoe{width:min(100%,58dvh,520px)!important}
#screen-classic .classic-board.game-connect4{
  width:min(100%,calc(100dvh - 166px),780px)!important;
  max-width:780px;max-height:calc(100dvh - 166px);
}
#screen-classic .classic-side{
  min-width:0;min-height:0;gap:0;padding:18px 18px 24px;
  overflow-x:hidden;overflow-y:auto;border-left:1px solid #28302a;background:#101512;
}
#screen-classic .classic-panel{
  padding:0 0 16px;border:0;border-bottom:1px solid #2a312c;background:transparent;
}
#screen-classic .classic-panel h2{margin:0 0 10px;color:#aab2ac;font-size:10px}
#screen-classic .classic-player{grid-template-columns:36px minmax(0,1fr);padding:9px 0}
#screen-classic .classic-token{width:32px;height:32px}
#screen-classic .classic-token .stone,
#screen-classic .classic-token .connect-disc,
#screen-classic .classic-token .draught{width:25px;height:25px}
#screen-classic .classic-status-wrap{padding-top:14px}
#screen-classic #classic-status{min-height:38px;color:#e8ebe8;font-size:12px}
#screen-classic #classic-resign{border:0;color:#b9beba;background:transparent!important}
#screen-classic #classic-resign:hover{color:#ff7d87;background:#231517!important}
#screen-classic .classic-fold{padding:0;border:0;border-bottom:1px solid #2a312c;background:transparent;color:#e7eae7}
#screen-classic .classic-fold summary{
  position:relative;padding:14px 22px 14px 0;list-style:none;color:#dce1dd;
  font-size:11px;font-weight:800;text-transform:uppercase;cursor:pointer;
}
#screen-classic .classic-fold summary::-webkit-details-marker{display:none}
#screen-classic .classic-fold summary::after{content:"+";position:absolute;right:2px;color:#e7c75c;font-size:16px;font-weight:400}
#screen-classic .classic-fold[open] summary::after{content:"-"}
#screen-classic .classic-fold>div{padding:0 0 12px}
#screen-classic .classic-rules>div>div{padding:7px 0;font-size:10px}
#screen-classic .classic-log-panel{min-height:0}
#screen-classic .classic-log-panel p{font-size:10px}

.classic-board.game-connect4 .connect-disc.drop-in{
  position:relative;z-index:4;
  animation:connectDrop .58s cubic-bezier(.22,.72,.28,1.12) both;
}
@keyframes connectDrop{
  0%{transform:translateY(calc(var(--drop-cells,1) * -128%));opacity:.45}
  72%{transform:translateY(5%);opacity:1}
  88%{transform:translateY(-5%)}
  100%{transform:translateY(0)}
}

/* Une transition sobre, lisible et sans fausse fenêtre flottante. */
.veil{background:#090d0b!important;backdrop-filter:none!important}
.veil-box{
  width:min(420px,calc(100vw - 40px));padding:0!important;border:0!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
.veil-logo{font-family:inherit!important;font-size:42px!important;font-weight:800!important;letter-spacing:0!important;color:#f4f1e9!important;background:none!important}
.veil-table{width:150px;height:44px;display:flex;align-items:center;justify-content:center;gap:18px;margin:12px auto 18px;border-top:1px solid #475149;border-bottom:1px solid #475149}
.veil-table span{width:10px;height:10px;border-radius:50%;background:#e9c955}
.veil-table i{width:42px;height:2px;background:#49c98a;animation:veilPulse 1s ease-in-out infinite;transform-origin:center}
@keyframes veilPulse{0%,100%{transform:scaleX(.35);opacity:.45}50%{transform:scaleX(1);opacity:1}}
.veil-text{font-size:15px!important;font-weight:700!important;letter-spacing:0!important}
.veil-sub{max-width:360px;margin-top:7px!important;color:#929c95!important;font-size:11px!important;letter-spacing:0!important;text-transform:none!important}
.veil-bar{width:210px!important;height:2px!important;margin-top:18px!important;border-radius:0!important;background:#29312b!important}
.veil-bar i{border-radius:0!important;background:#e7c75c!important}

@media(max-width:950px){
  #screen-classic{overflow:auto!important}
  #screen-classic .classic-main{height:auto;min-height:calc(100dvh - 64px);grid-template-columns:1fr;overflow:visible}
  #screen-classic .classic-stage{padding:18px 18px 24px;overflow:visible}
  #screen-classic .classic-board,#screen-classic .classic-board.game-connect4{width:min(100%,720px)!important;max-height:none}
  #screen-classic .classic-side{width:100%;padding:18px;border-top:1px solid #28302a;border-left:0;overflow:visible}
}
@media(prefers-reduced-motion:reduce){.classic-board.game-connect4 .connect-disc.drop-in,.veil-table i{animation:none!important}}

/* 1.6.17 - les décisions MAGNAT occupent leur propre rangée.
   Elles ne flottent plus au-dessus des cases du plateau. */
#screen-game{overflow:hidden!important}
#screen-game .game-main{overflow:hidden!important}
#screen-game .board-wrap{
  width:auto!important;
  height:min(100%,820px)!important;
  max-width:100%!important;
  max-height:100%!important;
}
.game-action-dock{position:relative;z-index:70;flex:0 0 auto;min-width:0;background:#111411}
.game-action-dock .buy-bar,
.game-action-dock .auction-bar{
  position:static!important;
  left:auto!important;bottom:auto!important;
  width:min(1040px,calc(100% - 36px))!important;
  margin:0 auto 14px!important;
  transform:none!important;
  box-shadow:0 10px 28px rgba(0,0,0,.32)!important;
}
.game-action-dock .buy-bar{min-height:62px;padding:10px 12px!important}
.game-action-dock .auction-bar{min-height:62px}

@media(max-width:1100px){
  #screen-game{overflow:auto!important}
  #screen-game .game-main{overflow:visible!important}
  #screen-game .board-wrap{width:min(calc(100vw - 36px),760px)!important;height:auto!important;max-height:none!important}
  .game-action-dock{position:sticky;bottom:0;padding-top:1px}
  .game-action-dock .buy-bar,.game-action-dock .auction-bar{width:calc(100% - 20px)!important;margin-bottom:10px!important}
}

/* =========================================================================
   LA MATIÈRE
   Un aplat de couleur reste plat, quelle que soit la couleur. Ce qui donne
   l'impression d'un vrai meuble, c'est la trame : un tissage très fin par
   dessus le fond, une lumière en haut des panneaux, une ombre en bas. On ne
   le voit pas consciemment — on sent juste que ça a de l'épaisseur.
   ========================================================================= */
#screen-casino::after,#screen-profil::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background-image:
    repeating-linear-gradient(45deg,rgba(255,255,255,.022) 0 2px,transparent 2px 5px),
    repeating-linear-gradient(-45deg,rgba(0,0,0,.05) 0 2px,transparent 2px 5px),
    radial-gradient(120% 90% at 50% 40%,transparent 45%,rgba(0,0,0,.4) 100%)}
#screen-casino>*,#screen-profil>*{position:relative;z-index:1}

/* les panneaux prennent tous le même relief : lumière en haut, ombre portée */
#screen-casino .cas-list .ctable,#screen-casino .stk,#screen-casino .grant,
.prof-card,.pi-tab,.pi-next,.parc-track,.vest-card,.cpt-card,.prof-tabs{
  box-shadow:0 10px 28px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.09)}

/* ---------- plus de contraste sur les cartes de table ---------- */
#screen-casino .cas-list .ctable{
  background:linear-gradient(155deg,rgba(255,236,196,.13) 0,rgba(0,0,0,.3) 100%)}
#screen-casino .cas-list .ctable:hover{
  background:linear-gradient(155deg,rgba(255,236,196,.2) 0,rgba(0,0,0,.26) 100%)}
/* le panneau de droite repose sur la table : un ton plus sombre que la colonne */
#screen-casino .cas-main{background:linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,.3))}
#screen-casino .cas-rail{box-shadow:6px 0 22px rgba(0,0,0,.3)}

/* un filet d'or sous les grands titres : la gravure du meuble */
#screen-casino .cas-game-title::after,.pi-txt h3::after,.vest-head h3::after{
  content:"";display:block;height:2px;width:52px;margin-top:9px;border-radius:2px;
  background:linear-gradient(90deg,var(--jz-or),transparent)}
#screen-casino .cas-game-title{flex-wrap:wrap}
#screen-casino .cas-game-title::after{width:64px}

/* ---------- l'avatar par défaut : un jeton, pas une pastille grise ---------- */
.av{background:radial-gradient(120% 120% at 32% 24%,
      color-mix(in srgb,var(--av,#b3a894) 72%,#fff) 0,var(--av,#b3a894) 58%,
      color-mix(in srgb,var(--av,#b3a894) 74%,#000) 100%);
  box-shadow:0 0 0 2px rgba(255,216,115,.4),0 4px 14px rgba(0,0,0,.35),
    inset 0 2px 6px rgba(255,255,255,.18)}

/* ---------- la barre de niveau : elle doit se voir de loin ---------- */
.pc-bar{position:relative}
.pc-bar::after{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;
  background:repeating-linear-gradient(115deg,rgba(255,255,255,.09) 0 6px,transparent 6px 14px)}

/* ---------- la piste du parcours ---------- */
.parc-track{background:linear-gradient(180deg,rgba(0,0,0,.32),rgba(0,0,0,.18))}
.parc-row.milestone{background:linear-gradient(90deg,rgba(255,216,115,.09),transparent 60%)}
.parc-row.now.milestone{background:linear-gradient(90deg,rgba(255,216,115,.22),transparent 70%)}

/* ---------- le hall : on garde les portes colorées, on les rend plus nettes ---------- */
.hub-block{box-shadow:0 16px 40px rgba(40,18,10,.4),inset 0 1px 0 rgba(255,255,255,.12)}
.hub-block:hover{box-shadow:0 22px 52px rgba(40,18,10,.5),inset 0 1px 0 rgba(255,255,255,.16)}

/* ---------- les règles de la maison, sous les tables ----------
   Un joueur ne devrait jamais avoir à chercher combien paie un blackjack.
   C'est écrit là, en clair, à sa place. */
.cas-rules{margin-top:26px;border:1px solid var(--jz-trait);border-radius:16px;overflow:hidden;
  background:linear-gradient(155deg,rgba(255,236,196,.08),rgba(0,0,0,.26));
  box-shadow:0 10px 28px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.08)}
.cr-title{padding:12px 18px;font-weight:900;font-size:13px;letter-spacing:1.4px;text-transform:uppercase;
  color:rgba(255,216,115,.85);background:rgba(0,0,0,.24);border-bottom:1px solid var(--jz-trait)}
.cr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0 30px;padding:6px 18px 14px}
.cr-row{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:9px 0;
  border-bottom:1px solid rgba(255,216,115,.1);font-size:12.5px;color:var(--jz-creme3)}
.cr-row b{color:#fff6de;font-weight:800;text-align:right;flex:0 1 auto}
.cr-row>span{flex:0 0 auto;white-space:nowrap}

/* ---------- la bande de progression du hall ----------
   Elle reprend les couleurs chaudes du hall, pas celles des salles : on est
   encore sur le seuil, pas dans le jeu. */
.hub-prog{width:100%;max-width:1080px;margin:0 auto 16px}
.hp-card{display:flex;align-items:center;gap:clamp(14px,2.4vw,26px);flex-wrap:wrap;
  background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:16px 22px;
  box-shadow:var(--shadow-sm)}
.hp-badge{display:inline-flex;align-items:center;gap:8px;padding:5px 14px 5px 5px;border-radius:20px;
  background:linear-gradient(180deg,var(--g),color-mix(in srgb,var(--g) 74%,#000));color:var(--gi);
  font-size:11px;font-weight:900;letter-spacing:.5px;text-transform:uppercase;flex-shrink:0;
  box-shadow:0 3px 10px rgba(0,0,0,.2)}
.hp-badge b{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;
  border-radius:50%;background:rgba(255,255,255,.3);font-size:13px}
.hp-mid{flex:1;min-width:210px}
.hp-line{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-size:12.5px;color:var(--muted);font-weight:700;margin-bottom:6px}
.hp-line b{color:var(--ink)}
.hp-next{color:var(--gold2);font-weight:800}
.hp-bar{height:9px;border-radius:20px;background:var(--cream2);overflow:hidden;
  border:1px solid var(--line);box-shadow:inset 0 1px 3px rgba(90,60,15,.15)}
.hp-bar i{display:block;height:100%;border-radius:20px;transition:width .6s cubic-bezier(.3,1,.4,1);
  background:linear-gradient(90deg,var(--gold2),var(--gold) 60%,#ffe9a8);
  box-shadow:0 0 10px rgba(241,176,17,.5)}
.hp-unlock{display:flex;flex-direction:column;gap:1px;padding:0 16px;border-left:1px solid var(--line);
  min-width:180px}
.hu-lbl{font-size:9.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);font-weight:800}
.hu-name{font-size:14px;font-weight:900;color:var(--ink)}
.hu-lvl{font-size:11px;color:var(--gold2);font-weight:800}
.hp-card .btn{border-radius:12px;padding:11px 18px;font-size:13.5px;flex-shrink:0}
@media(max-width:820px){
  .hp-unlock{border-left:none;padding:0;border-top:1px solid var(--line);padding-top:10px;width:100%}
  .hp-card .btn{width:100%}
}

/* ==========================================================================
   KYDOS REDESIGN 2026
   Interface unifiée pour l'app desktop : panneaux nets, tables lisibles,
   moins de papier/crème, plus de profondeur et de contraste.
   ========================================================================== */
:root{
  --cream:#17130f; --cream2:#201a14; --paper:#24201a; --paper2:#1d1914;
  --ink:#f6efe4; --muted:#b8ab96; --line:rgba(238,213,161,.18);
  --felt:#126645; --felt2:#0b3f2c; --felt-line:#082e20;
  --red:#e25555; --red2:#b7313d; --gold:#e8bf57; --gold2:#b9822e;
  --green:#45bf7d; --up:#45bf7d; --down:#e25555; --blue:#58a6ff;
  --night:#11100e; --night2:#1d1813; --gold-lite:#f2d781; --gold-deep:#6f5521;
  --jz-creme:#f6efe4; --jz-creme2:#e8ddcc; --jz-creme3:#b8ab96;
  --jz-or:#e8bf57; --jz-or2:#b9822e; --jz-or-clair:#f2d781;
  --jz-trait:rgba(238,213,161,.18);
  --shadow:0 18px 50px rgba(0,0,0,.42);
  --shadow-sm:0 10px 24px rgba(0,0,0,.26);
  --radius:8px;
}

html{background:#11100e}
body{
  color:var(--ink);
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(135deg,#11100e 0,#18130f 42%,#0f1712 100%);
  background-size:32px 32px,32px 32px,auto;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:
    linear-gradient(180deg,rgba(255,255,255,.045),transparent 22%),
    repeating-linear-gradient(135deg,rgba(232,191,87,.035) 0 1px,transparent 1px 7px);
}

button,input,select{font:inherit}
button{border-radius:8px}
input,select{
  background:#14110e;color:var(--ink);border:1px solid var(--line);
  border-radius:8px;outline:none;
}
input:focus,select:focus{border-color:rgba(232,191,87,.68);box-shadow:0 0 0 3px rgba(232,191,87,.14)}
.screen{padding:0;background:transparent}
.screen.active{display:flex}

.logo{
  font-family:Inter,system-ui,sans-serif;font-weight:900;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink);text-shadow:none;
}
.logo::first-letter{color:var(--gold)}
.logo.small{font-size:28px}.logo.tiny{font-size:18px}
.tagline,.home-foot,.muted{color:var(--muted)}

.btn,.mini,.chip,.tab,.cnav,.cmode,.stk,.slot-bet,.seat-chair{
  transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease;
}
.btn{
  border-radius:8px;padding:10px 16px;font-weight:850;letter-spacing:0;
  min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px;
}
.btn:hover:not(:disabled),.mini:hover:not(:disabled),.chip-btn:hover{transform:translateY(-1px)}
.btn-gold{
  background:linear-gradient(180deg,#f0ca68,#c99132);color:#231705;
  box-shadow:0 10px 24px rgba(201,145,50,.26),inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-outline{
  background:rgba(255,255,255,.055);color:var(--ink);border:1px solid rgba(238,213,161,.24);
}
.btn-outline:hover{border-color:var(--gold);color:var(--gold-lite);background:rgba(232,191,87,.09)}
.btn-ghost{color:var(--muted)}
.btn-ghost:hover{color:var(--ink);background:rgba(255,255,255,.06)}
.btn-red,.btn-danger{background:linear-gradient(180deg,#e25555,#a92f3c);color:#fff}
.btn:disabled,.mini:disabled{opacity:.45;cursor:not-allowed;transform:none}

.home-card,.lobby-card,.panel,.modal-box,.quick-card,.hp-card,.admin-row,.prof-card,
.cpt-card,.vest-card,.pi-tab,.pi-next,.parc-track,.cas-rules,.ctable,.grant,.stk,
.slot-machine,.slot-paytable{
  border-radius:8px;border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:var(--shadow-sm),inset 0 1px 0 rgba(255,255,255,.06);
}

/* Login et lobby */
#screen-login,#screen-lobby{
  align-items:center;justify-content:center;padding:24px;
  background:
    linear-gradient(90deg,rgba(232,191,87,.08),transparent 42%),
    linear-gradient(135deg,#11100e,#19130f 56%,#0d1712);
}
.home-card,.auth-card,.lobby-card{
  width:min(460px,calc(100vw - 32px));padding:32px;text-align:left;
}
.home-card .logo,.lobby-card .logo{text-align:left;font-size:42px}
.tagline{text-align:left;margin:8px 0 24px}
.field span,.check{color:var(--muted)}
.field input,.code-input,.join-row input,#invite-link,.wal-fields input,.cas-join input{
  background:#12100d;border-color:rgba(238,213,161,.2);color:var(--ink);
}
.auth-tabs,.tabs{
  background:rgba(0,0,0,.18);border:1px solid var(--line);border-radius:8px;padding:4px;gap:4px;
}
.auth-tabs .tab,.tabs .tab{
  border:0;border-radius:6px;margin:0;padding:9px 12px;color:var(--muted);
}
.auth-tabs .tab.active,.tabs .tab.active{
  color:#211607;background:linear-gradient(180deg,var(--gold),var(--gold2));
}
.auth-note{background:rgba(232,191,87,.11);border-color:rgba(232,191,87,.36);color:var(--gold-lite)}
.auth-note.danger,.auth-err{color:#ff9ea5}
.invite-box,.lobby-stake,.botlevels{
  background:rgba(0,0,0,.18);border:1px solid var(--line);border-radius:8px;
}
.code-display{display:flex;align-items:center;justify-content:space-between;gap:14px}
.code-big{font-size:34px;letter-spacing:.18em;color:var(--gold-lite);font-weight:900}
.lp{background:rgba(255,255,255,.045);border-color:var(--line);border-radius:8px}
.lp .host,.badge.admin{border-radius:6px;background:var(--gold);color:#201405}

/* Barres hautes et hub */
.topbar{
  min-height:62px;padding:10px 16px;background:rgba(18,16,13,.86);
  backdrop-filter:blur(14px);border-bottom:1px solid rgba(238,213,161,.17);
  box-shadow:0 10px 28px rgba(0,0,0,.24);
}
.topbar-mid{gap:8px}
.chip{
  background:rgba(255,255,255,.055);border:1px solid rgba(238,213,161,.18);
  color:var(--muted);border-radius:999px;min-height:34px;display:inline-flex;align-items:center;gap:6px;
}
.chip b{color:var(--ink)}
.chip-btn{color:var(--gold-lite);border-color:rgba(232,191,87,.34);background:rgba(232,191,87,.06)}
.chip-btn:hover{background:rgba(232,191,87,.16);color:#fff;border-color:var(--gold)}
.turn-banner{
  border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.055);
  color:var(--ink);box-shadow:none;
}
.turn-banner.mine{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#211607}

#screen-hub.active,#screen-admin.active,#screen-profil.active,#screen-casino.active,#screen-slots.active{
  display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
}
.hub-body{width:100%;max-width:1180px;margin:0 auto;padding:28px 20px 52px;overflow:auto}
.hub-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.hub-blocks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 auto 18px;max-width:1080px}
.hub-block{
  position:relative;overflow:hidden;min-height:210px;padding:22px;
  border:1px solid var(--line);border-radius:8px;cursor:pointer;
  background:
    linear-gradient(135deg,rgba(232,191,87,.14),transparent 48%),
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  box-shadow:var(--shadow-sm),inset 0 1px 0 rgba(255,255,255,.06);
}
.hub-block:hover{transform:translateY(-3px);border-color:rgba(232,191,87,.58)}
.hb-glow{display:none}
.hb-emo{font-size:34px;margin-bottom:18px}
.hb-title{font-size:30px;font-weight:950;letter-spacing:.08em;color:var(--ink)}
.hb-line{color:var(--gold-lite);font-weight:850;margin-top:6px}
.hb-desc{color:var(--muted);line-height:1.5;max-width:46ch;margin-top:10px}
.hb-cta{position:absolute;right:18px;bottom:16px;color:var(--gold-lite);font-weight:900}
.hb-badge{position:absolute;top:14px;right:14px;border-radius:999px;background:rgba(69,191,125,.14);
  border:1px solid rgba(69,191,125,.45);color:#9bf0bd;padding:6px 10px;font-size:12px;font-weight:900}
.quick-card,.hp-card{max-width:1080px;margin:0 auto 14px;padding:16px 18px;display:flex;align-items:center;gap:16px}
.qc-ico{font-size:24px}.qc-mid{flex:1}.qc-title{font-weight:950;color:var(--ink)}.qc-sub{color:var(--muted);font-size:13px}
.qc-row{display:flex;gap:8px;align-items:center}.qc-row input{width:112px;text-align:center;letter-spacing:.18em;font-weight:900}
.hp-bar{background:#14110e;border-color:var(--line)}.hp-bar i,.pc-bar i{background:linear-gradient(90deg,#45bf7d,#e8bf57)}
.hp-unlock{border-color:var(--line)}.hu-name,.hp-line b{color:var(--ink)}

/* Casino, profil, admin */
.casino-layout{grid-template-columns:250px 1fr;background:transparent}
.cas-rail{
  background:rgba(13,12,10,.56);border-right:1px solid var(--line);padding:16px;
}
.rail-title{color:var(--muted);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:900;margin:14px 0 8px}
.cnav{
  width:100%;border:1px solid transparent;background:transparent;color:var(--muted);
  border-radius:8px;padding:11px 12px;display:flex;align-items:center;gap:10px;font-weight:850;text-align:left;
}
.cnav:hover{background:rgba(255,255,255,.055);color:var(--ink)}
.cnav.on{background:rgba(232,191,87,.12);border-color:rgba(232,191,87,.36);color:var(--gold-lite)}
.cas-main,.prof-body,.admin-body,.casino-body{padding:24px;overflow:auto}
.cas-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px;
}
.cas-game-title{font-size:36px;font-weight:950;letter-spacing:.02em;color:var(--ink)}
.cas-game-desc{color:var(--muted);line-height:1.55;max-width:70ch}
.cas-modes{display:flex;gap:6px;background:rgba(0,0,0,.2);border:1px solid var(--line);border-radius:8px;padding:4px}
.cmode{border:0;background:transparent;color:var(--muted);padding:9px 12px;border-radius:6px;font-weight:850}
.cmode.on{background:var(--gold);color:#201405}
.cas-note,.stk-note,.grant-txt span,.ct-stakes,.tier-need{color:var(--muted)}
.cas-list{display:grid;gap:10px}
.ctable{
  display:grid;grid-template-columns:160px 1fr auto;gap:16px;align-items:center;padding:15px 16px;cursor:pointer;
}
.ctable:hover{border-color:rgba(232,191,87,.55);transform:translateY(-1px)}
.ctable.dim{opacity:.52}
.ct-tier{display:flex;align-items:center;gap:9px;color:var(--gold-lite);font-weight:950}
.ct-name{font-weight:950;color:var(--ink)}.ct-cta{color:var(--gold-lite);font-weight:900;text-align:right}
.stk-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:10px}
.stk{padding:12px;border:1px solid var(--line);background:rgba(255,255,255,.045);color:var(--ink)}
.stk.on{border-color:var(--gold);background:rgba(232,191,87,.14)}
.grant{padding:12px;display:flex;align-items:center;gap:10px;margin-bottom:8px}
.grant.ready{border-color:rgba(69,191,125,.45);background:rgba(69,191,125,.08)}
.tier{border-radius:8px;background:rgba(255,255,255,.045);border:1px solid var(--line);padding:8px 10px;margin-bottom:6px}
.tier.on{border-color:rgba(69,191,125,.35)}
.admin-head h2,.prof-card,.pc-name,.pi-txt h3,.vest-head h3,.cpt-card h3{color:var(--ink)}
.admin-row{grid-template-columns:1.5fr 1.1fr 1.1fr .7fr auto;padding:12px 14px}
.admin-row.head{background:transparent;box-shadow:none}

/* Tables de jeu */
.game-main{background:transparent;padding:16px;gap:16px}
.board-wrap{height:min(82vh,78vw);filter:drop-shadow(0 28px 48px rgba(0,0,0,.32))}
.board{
  gap:2px;border:8px solid #17110c;border-radius:8px;
  background:
    repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 2px,transparent 2px 8px),
    linear-gradient(160deg,#145f43,#0d3f2c);
}
.tile{border-radius:4px;background:#f0e6d6;color:#2b2118;border-color:rgba(43,33,24,.18)}
.tile .tname{color:#30251a}.tile .tprice{color:#7d6648}.tile.corner{background:#ead9bc}
.center-logo{font-family:Inter,system-ui,sans-serif;letter-spacing:.18em;transform:none;color:rgba(255,255,255,.88)}
.center-msg{background:rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.12);border-radius:8px}
.sidebar{min-width:320px;max-width:430px}.panel{padding:14px}
.panel-title,.pane-head{color:var(--muted);letter-spacing:.12em}
.prow,.prop,.loan-card,.empire-head>div,.empire-sum .es{
  background:rgba(255,255,255,.045);border-color:var(--line);border-radius:8px;color:var(--ink);
}
.prow .pname,.prow .pnet b,.empire-head b,.empire-sum .es b,.prop-name{color:var(--ink)}
.tabs{border-bottom:0}.tab-body{padding:12px}
.mini{border-radius:7px;background:rgba(255,255,255,.055);border:1px solid var(--line);color:var(--ink)}
.mini.gold{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#211607}

#screen-poker,#screen-bj,#screen-chess,#screen-game{
  background:linear-gradient(135deg,#11100e,#121c16 52%,#17110d);
}
.poker-table,.bj-table{filter:drop-shadow(0 26px 46px rgba(0,0,0,.38))}
.pt-felt,.bj-felt{
  background:
    repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 2px,transparent 2px 8px),
    radial-gradient(70% 70% at 50% 42%,#178156,#0a3e2a 74%);
  border:10px solid #17110c;box-shadow:inset 0 0 70px rgba(0,0,0,.35),0 18px 50px rgba(0,0,0,.36);
}
.pk-plate{
  background:rgba(18,16,13,.9);border:1px solid rgba(238,213,161,.22);
  border-radius:8px;color:var(--ink);box-shadow:0 10px 24px rgba(0,0,0,.34);
}
.pk-name,.pk-chips,.pt-pot,.pt-msg{color:var(--ink)}
.pk-card{
  border-radius:7px;background:#f7f2ea;color:#201713;border:1px solid rgba(0,0,0,.14);
  box-shadow:0 6px 12px rgba(0,0,0,.24);
}
.pk-card.red{color:#be2d3c}.pk-card.back{background:linear-gradient(135deg,#9f2938,#38131a)}
.seat-chair{border:1px dashed rgba(238,213,161,.28);background:rgba(18,16,13,.58);color:var(--muted)}
.seat-chair:hover{border-color:var(--gold);color:var(--gold-lite);background:rgba(232,191,87,.09)}
.poker-actions,.bj-actions{background:rgba(18,16,13,.92);border-top:1px solid var(--line);backdrop-filter:blur(12px)}
.bj-chip{box-shadow:0 8px 18px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.22)}

/* Machine, modales, notifications */
.slot-machine{border-radius:8px;background:linear-gradient(180deg,#2a1818,#18110f)}
.slot-window{border-radius:8px;background:#0f0d0b;border:1px solid rgba(238,213,161,.2)}
.reel{border-radius:7px;background:#f5eee4}
.slot-paytable{border-radius:8px}
.modal{background:rgba(6,5,4,.72);backdrop-filter:blur(8px)}
.modal-box{padding:24px;color:var(--ink)}
.modal-close{color:var(--muted);border-radius:6px}
.modal-close:hover{background:rgba(255,255,255,.08);color:var(--ink)}
.toast{border-radius:8px;background:#211c16;border:1px solid rgba(232,191,87,.5);color:var(--ink)}
.veil{background:rgba(8,7,6,.78)}
.veil-box{border-radius:8px;background:linear-gradient(180deg,#24201a,#15120f);border:1px solid var(--line)}

/* Responsive */
@media(max-width:980px){
  .hub-blocks{grid-template-columns:1fr}
  .game-main{flex-direction:column;overflow:auto}
  .board-wrap{width:min(94vw,680px);height:auto;margin:0 auto}
  .sidebar{max-width:none;width:100%;min-width:0}
  .casino-layout{grid-template-columns:1fr}
  .cas-rail{border-right:0;border-bottom:1px solid var(--line)}
  .cas-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:6px}
  .ctable{grid-template-columns:1fr}
  .ct-right{display:flex;justify-content:space-between;gap:12px}
}
@media(max-width:680px){
  .topbar{align-items:flex-start;flex-wrap:wrap}
  .topbar-mid{justify-content:flex-start}
  .hub-body,.cas-main,.prof-body,.admin-body{padding:16px}
  .home-card,.auth-card,.lobby-card{padding:24px}
  .home-card .logo,.lobby-card .logo{font-size:34px}
  .quick-card,.hp-card{align-items:stretch;flex-direction:column}
  .qc-row{width:100%}.qc-row input,.qc-row .btn{flex:1}
  .cas-head{flex-direction:column}.cas-game-title{font-size:28px}
  .admin-row{grid-template-columns:1fr}.admin-row.head{display:none}
}

/* ==========================================================================
   1.6.5 — direction immersive "lounge app"
   Inspiration : grandes photos, noir premium, peu de cadres visibles.
   ========================================================================== */
:root{
  --v165-bg:#090b0b;
  --v165-ink:#f7f3ea;
  --v165-muted:rgba(247,243,234,.68);
  --v165-soft:rgba(247,243,234,.42);
  --v165-line:rgba(247,243,234,.12);
  --v165-panel:rgba(14,16,16,.72);
  --v165-panel2:rgba(255,255,255,.07);
  --v165-gold:#f2c85f;
  --v165-green:#52d394;
  --v165-blue:#79bdff;
  --v165-red:#ff6d7d;
  --v165-home:url('https://images.unsplash.com/photo-1676651471150-0e3a5f8de05e?auto=format&fit=crop&q=70&w=2200');
  --v165-social:url('https://images.unsplash.com/photo-1677188010559-0667a1ed33a0?auto=format&fit=crop&q=70&w=2200');
  --v165-casino:url('https://images.unsplash.com/photo-1446669052213-5dcff53f1f3f?auto=format&fit=crop&q=70&w=2200');
}

html,body{
  background:var(--v165-bg)!important;
  color:var(--v165-ink)!important;
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
}
body{overflow:hidden}
button,input{letter-spacing:0}
.screen{color:var(--v165-ink)}
#screen-hub.active,#screen-casino.active,#screen-profil.active,#screen-admin.active{
  display:flex!important;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  padding:0;
}

/* Auth */
#screen-login{
  background:
    linear-gradient(90deg,rgba(6,7,7,.42),rgba(6,7,7,.78) 52%,rgba(6,7,7,.94)),
    var(--v165-home) center/cover no-repeat!important;
}
.home-card.auth-card{
  width:min(420px,92vw)!important;
  margin-left:auto;
  margin-right:8vw;
  border:0!important;
  border-radius:26px!important;
  background:rgba(10,12,12,.72)!important;
  box-shadow:0 36px 90px rgba(0,0,0,.46)!important;
  backdrop-filter:blur(20px);
  text-align:left!important;
}
.home-card.auth-card .logo{
  color:#fff!important;
  font-family:'Inter',system-ui,sans-serif!important;
  font-size:42px!important;
  letter-spacing:-.045em!important;
  text-shadow:none!important;
}
.tagline,.home-foot,.field span,.auth-note{color:var(--v165-muted)!important;text-align:left}
.field input,.code-input,.join-row input,#invite-link,.cas-join input{
  background:rgba(255,255,255,.92)!important;
  color:#151515!important;
  border:0!important;
  border-radius:999px!important;
}
.auth-tabs.tabs,.tabs.auth-tabs{
  border:0!important;
  background:rgba(255,255,255,.08)!important;
  border-radius:999px!important;
  padding:4px!important;
}
.auth-tabs .tab{border-radius:999px!important;color:var(--v165-muted)!important}
.auth-tabs .tab.active{background:#fff!important;color:#101010!important;box-shadow:none!important}

/* Top navigation */
.topbar{
  position:relative;
  z-index:10;
  min-height:76px;
  padding:14px 24px!important;
  background:rgba(8,10,10,.78)!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:none!important;
  backdrop-filter:blur(18px);
}
.logo,.logo.tiny,.logo.small{
  font-family:'Inter',system-ui,sans-serif!important;
  color:#fff!important;
  text-shadow:none!important;
  letter-spacing:-.035em!important;
  font-weight:900!important;
}
.logo.tiny{font-size:25px!important}
.topbar-mid{color:var(--v165-muted)}
.chip,.turn-banner{
  border:0!important;
  background:transparent!important;
  color:var(--v165-muted)!important;
  box-shadow:none!important;
  padding:8px 10px!important;
  border-radius:999px!important;
}
.chip b,.turn-banner.mine{color:#fff!important}
.chip-wallet{
  background:rgba(242,200,95,.14)!important;
  color:#ffe6a8!important;
  padding:10px 14px!important;
}
.chip-wallet b{color:#fff!important}
.chip-btn{
  color:var(--v165-muted)!important;
  border:1px solid transparent!important;
}
.chip-btn:hover{
  color:#fff!important;
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(255,255,255,.12)!important;
}
#btn-update{
  background:#fff!important;
  color:#111!important;
  font-weight:900!important;
}
.btn{
  border-radius:999px!important;
  box-shadow:none!important;
}
.btn-gold{
  background:#fff!important;
  color:#111!important;
}
.btn-outline{
  background:transparent!important;
  color:var(--v165-ink)!important;
  border:1px solid var(--v165-line)!important;
}

/* Hall */
#screen-hub{
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(8,10,10,.42),rgba(8,10,10,.88) 56%,rgba(8,10,10,.96)),
    var(--v165-home) center/cover no-repeat!important;
}
#screen-hub::after,#screen-casino::after,#screen-profil::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 18%),
    radial-gradient(900px 440px at 18% 0,rgba(242,200,95,.18),transparent 64%);
  z-index:0;
}
#screen-hub>.topbar,#screen-casino>.topbar,#screen-profil>.topbar{z-index:2}
.hub-body{
  position:relative;
  z-index:1;
  width:100%!important;
  max-width:1320px!important;
  margin:0 auto!important;
  padding:54px 32px 46px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(280px,360px);
  grid-template-areas:"deck progress" "quick quick";
  align-items:start!important;
  gap:28px!important;
  overflow:auto!important;
}
.playdeck{grid-area:deck;max-width:none!important;width:100%}
.playdeck-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end!important;
  gap:24px!important;
  margin:0 0 30px!important;
}
.playdeck-kicker{
  color:#fff!important;
  font-size:clamp(66px,8vw,132px)!important;
  line-height:.82!important;
  letter-spacing:-.075em!important;
  font-weight:900!important;
  text-transform:uppercase!important;
  margin:0 0 18px!important;
}
.playdeck-title{
  color:#fff!important;
  font-size:clamp(26px,3.1vw,52px)!important;
  line-height:.96!important;
  letter-spacing:-.055em!important;
  max-width:720px!important;
  font-weight:850!important;
}
.playdeck-sub{
  max-width:560px;
  margin-top:14px;
  color:var(--v165-muted);
  font-size:15px;
  line-height:1.5;
}
.playdeck-actions .mini{
  border-radius:999px!important;
  border:0!important;
  background:#fff!important;
  color:#111!important;
  padding:11px 17px!important;
}
.game-shelf{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:14px!important;
  background:transparent!important;
}
.game-card{
  grid-column:span 4;
  min-height:360px!important;
  border:0!important;
  border-radius:28px!important;
  overflow:hidden!important;
  padding:22px!important;
  background:
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.2) 44%,rgba(0,0,0,.72)),
    var(--photo) center/cover no-repeat!important;
  box-shadow:0 34px 88px rgba(0,0,0,.36)!important;
  justify-content:flex-end;
  isolation:isolate;
}
.game-card.game-blackjack,.game-card.game-poker{grid-column:span 6}
.game-card.game-magnat{grid-column:span 5}
.game-card.game-chess{grid-column:span 4}
.game-card.game-slots{grid-column:span 3}
.game-card::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  opacity:1!important;
  background:
    radial-gradient(90% 70% at 0 0,color-mix(in srgb,var(--game) 34%,transparent),transparent 60%),
    linear-gradient(90deg,rgba(0,0,0,.26),transparent 48%)!important;
}
.game-card::after{
  content:"";
  position:absolute;
  inset:14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  pointer-events:none;
  opacity:.72;
  z-index:1;
}
.game-photo{display:none}
.game-top,.game-title,.game-desc,.game-modes,.game-card-hit{
  z-index:2!important;
}
.game-card:hover{
  transform:translateY(-6px)!important;
  box-shadow:0 46px 110px rgba(0,0,0,.46)!important;
}
.game-top{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  margin-bottom:auto!important;
}
.game-emoji,.cnav-emo,.cas-hero-emoji{
  width:auto!important;
  height:auto!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#fff!important;
  font-size:16px!important;
  font-weight:900!important;
  letter-spacing:.03em!important;
}
.game-pill{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:rgba(255,255,255,.76)!important;
  padding:0!important;
  font-size:12px!important;
  text-transform:uppercase;
}
.game-title{
  color:#fff!important;
  font-size:clamp(28px,3.2vw,46px)!important;
  line-height:.92!important;
  letter-spacing:-.05em!important;
  max-width:9ch;
  margin-top:150px!important;
}
.game-desc{
  color:rgba(255,255,255,.72)!important;
  font-size:14px!important;
  max-width:34ch;
}
.game-modes{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap;
  gap:8px!important;
  margin-top:16px!important;
}
.game-modes button{
  background:#fff!important;
  color:#101010!important;
  border:0!important;
  border-radius:999px!important;
  padding:10px 15px!important;
  font-size:13px!important;
}
#hub-prog{grid-area:progress;width:100%}
.hp-card{
  margin:104px 0 0!important;
  border:0!important;
  border-radius:28px!important;
  background:rgba(10,12,12,.68)!important;
  box-shadow:0 30px 80px rgba(0,0,0,.34)!important;
  backdrop-filter:blur(18px);
}
.hp-badge{border-radius:999px!important}
.hp-line,.hp-next,.hp-unlock,.qc-sub{color:var(--v165-muted)!important}
.hp-bar{background:rgba(255,255,255,.12)!important}
.hp-bar i{background:linear-gradient(90deg,var(--v165-green),var(--v165-gold))!important}
#hub-quick{
  grid-area:quick;
  width:100%;
}
.quick-card{
  margin:8px auto 0!important;
  width:min(780px,100%)!important;
  max-width:none!important;
  border:0!important;
  border-radius:999px!important;
  background:rgba(10,12,12,.72)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.36)!important;
  backdrop-filter:blur(18px);
}
.qc-ico{
  width:58px!important;
  height:58px!important;
  display:grid!important;
  place-items:center!important;
  font-size:12px!important;
  letter-spacing:.14em!important;
  font-weight:950!important;
  color:#111!important;
  background:#fff!important;
  border-radius:50%!important;
}
.qc-title{color:#fff!important}
.qc-row input{border-radius:999px!important;border:0!important}

/* Casino / social club */
#screen-casino{
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(8,10,10,.74),rgba(8,10,10,.88)),
    var(--v165-casino) center/cover no-repeat!important;
}
#screen-casino.societe{
  background:
    linear-gradient(90deg,rgba(8,10,10,.74),rgba(8,10,10,.88)),
    var(--v165-social) center/cover no-repeat!important;
}
.casino-layout{
  position:relative;
  z-index:1;
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  border:0!important;
  overflow:hidden;
}
#screen-casino .cas-rail{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:18px!important;
  align-items:center!important;
  padding:18px 30px!important;
  background:rgba(8,10,10,.38)!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:none!important;
  backdrop-filter:blur(16px);
}
#screen-casino .cas-nav{
  display:flex!important;
  gap:14px!important;
  min-width:0;
}
.lounge-switch{
  background:rgba(255,255,255,.08)!important;
  border:0!important;
  border-radius:999px!important;
  padding:5px!important;
}
.lounge-switch button{
  border-radius:999px!important;
  padding:10px 16px!important;
  color:var(--v165-muted)!important;
}
.lounge-switch button.on{
  background:#fff!important;
  color:#111!important;
}
.lounge-games{
  display:flex!important;
  gap:10px!important;
  overflow-x:auto!important;
  padding:0 0 3px!important;
}
#screen-casino .cnav{
  min-width:178px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  display:grid!important;
  grid-template-columns:auto 1fr!important;
  gap:0 10px!important;
  padding:8px 0!important;
  text-align:left;
}
#screen-casino .cnav.on{
  background:transparent!important;
  box-shadow:inset 0 -2px 0 var(--game)!important;
}
#screen-casino .cnav-txt{color:#fff!important;font-weight:900!important}
#screen-casino .cnav-mood{color:var(--v165-muted)!important}
#screen-casino .cas-grants{
  display:flex!important;
  gap:10px!important;
  max-width:420px!important;
  overflow:hidden!important;
}
#screen-casino .grant{
  border:0!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
}
#screen-casino .cas-main{
  flex:1;
  padding:34px clamp(22px,4vw,64px) 60px!important;
  overflow:auto!important;
}
#screen-casino .cas-head{margin:0 0 26px!important;padding:0!important;border:0!important}
.cas-hero-card{
  position:relative;
  min-height:330px;
  display:grid!important;
  grid-template-columns:1fr auto!important;
  align-items:end!important;
  gap:24px!important;
  border:0!important;
  border-radius:34px!important;
  overflow:hidden;
  padding:30px!important;
  background:#111!important;
  box-shadow:0 42px 110px rgba(0,0,0,.42)!important;
}
.cas-hero-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.38) 48%,rgba(0,0,0,.9)),
    radial-gradient(80% 90% at 0 0,color-mix(in srgb,var(--game) 42%,transparent),transparent 62%),
    var(--photo) center/cover no-repeat;
}
.cas-hero-card>*{position:relative;z-index:1}
.cas-hero-card .cas-hero-emoji{
  position:absolute;
  left:30px;
  top:26px;
}
#screen-casino .cas-game-title{
  color:#fff!important;
  font-size:clamp(48px,7vw,92px)!important;
  line-height:.84!important;
  letter-spacing:-.075em!important;
  max-width:760px;
}
#screen-casino .cas-game-desc{
  color:rgba(255,255,255,.74)!important;
  max-width:55ch!important;
  font-size:15px!important;
}
#screen-casino .cas-modes{
  border:0!important;
  background:rgba(255,255,255,.12)!important;
  border-radius:999px!important;
  padding:5px!important;
  backdrop-filter:blur(12px);
}
#screen-casino .cmode{
  border-radius:999px!important;
  color:rgba(255,255,255,.72)!important;
  padding:12px 17px!important;
}
#screen-casino .cmode.on{
  background:#fff!important;
  color:#111!important;
}
.play-panel{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 340px!important;
  gap:30px!important;
}
.section-title{
  margin:0 0 14px!important;
  align-items:end!important;
}
.section-title span{
  color:#fff!important;
  font-size:22px!important;
}
.section-title small{
  color:var(--v165-muted)!important;
}
.table-grid{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  background:rgba(255,255,255,.1)!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
.table-card,.slot-tier-card,.party-card{
  border:0!important;
  border-radius:0!important;
  background:rgba(12,15,15,.72)!important;
  box-shadow:none!important;
  min-height:126px!important;
  color:#fff!important;
}
.table-card:hover,.slot-tier-card:hover,.party-card:hover{
  background:rgba(255,255,255,.1)!important;
}
.table-name,.table-foot b,.party-card b,.slot-tier-card b{color:#fff!important}
.table-tier,.table-foot i,.slot-tier-card i{color:var(--tc,var(--game,var(--v165-gold)))!important}
.table-meta,.slot-tier-card span,.party-card small{color:var(--v165-muted)!important}
.play-side{gap:14px!important}
.side-card,#screen-casino .cas-rules{
  border:0!important;
  border-radius:22px!important;
  background:rgba(12,15,15,.74)!important;
  box-shadow:none!important;
  backdrop-filter:blur(14px);
}
.side-card b,#screen-casino .cr-title,#screen-casino .cr-row b{color:#fff!important}
.side-card span,#screen-casino .cr-row span{color:var(--v165-muted)!important}
.friend-actions,.slot-tier-grid,.stake-pills{
  gap:12px!important;
}
.party-card.create-party{
  background:
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.76)),
    var(--photo) center/cover no-repeat!important;
}
.stake-pills{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;
}
#screen-casino .stk{
  border:0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.08)!important;
}
#screen-casino .stk.on{
  background:#fff!important;
  color:#111!important;
}

/* Profil / vestiaire */
#screen-profil{
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(8,10,10,.7),rgba(8,10,10,.9)),
    var(--v165-social) center/cover no-repeat!important;
}
.prof-body{
  position:relative;
  z-index:1;
  max-width:1220px!important;
  width:100%!important;
  margin:0 auto!important;
  padding:36px 30px 60px!important;
  overflow:auto!important;
}
.prof-card{
  border:0!important;
  border-radius:34px!important;
  padding:30px!important;
  background:
    linear-gradient(90deg,rgba(10,12,12,.88),rgba(10,12,12,.54)),
    var(--v165-social) center/cover no-repeat!important;
  box-shadow:0 42px 120px rgba(0,0,0,.48)!important;
  backdrop-filter:blur(10px);
}
.pc-name{
  color:#fff!important;
  font-size:clamp(48px,6vw,86px)!important;
  line-height:.84!important;
  letter-spacing:-.075em!important;
}
.pc-xp,.pc-next,.pc-day,.vest-head span,.vc-desc,.cpt-card p,.pi-txt p,.pr-desc{color:var(--v165-muted)!important}
.pc-stat{
  border:0!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.09)!important;
}
.pc-bar{background:rgba(255,255,255,.16)!important;border:0!important}
.pc-bar i{background:linear-gradient(90deg,var(--v165-green),var(--v165-gold))!important}
.prof-tabs{
  margin-top:24px!important;
  border:0!important;
  background:rgba(255,255,255,.08)!important;
  border-radius:999px!important;
  padding:5px!important;
  width:max-content!important;
}
.prof-tabs .tab{
  border-radius:999px!important;
  color:var(--v165-muted)!important;
}
.prof-tabs .tab.active{
  background:#fff!important;
  color:#111!important;
  box-shadow:none!important;
}
.parc-intro,.vest-grid,.cpt-grid{
  background:transparent!important;
}
.pi-tab,.pi-next,.parc-track,.vest-card,.cpt-card{
  border:0!important;
  border-radius:22px!important;
  background:rgba(10,12,12,.72)!important;
  box-shadow:none!important;
  backdrop-filter:blur(14px);
}
.vest-block{
  border-top:1px solid rgba(255,255,255,.1)!important;
}
.vest-head h3,.pi-txt h3,.cpt-card h3,.vc-name,.pr-rew{color:#fff!important}
.vest-card.on,.vest-card:hover{
  background:rgba(255,255,255,.1)!important;
}

/* Poker et blackjack : table plus casino, moins interface plate */
#screen-poker,#screen-bj{
  background:
    radial-gradient(900px 540px at 50% 3%,rgba(66,160,103,.18),transparent 62%),
    linear-gradient(180deg,#070808,#10100d)!important;
}
#screen-poker .topbar,#screen-bj .topbar{
  background:rgba(7,8,8,.72)!important;
}
.poker-main,.bj-main{
  background:
    radial-gradient(740px 360px at 50% 38%,rgba(242,200,95,.11),transparent 66%),
    radial-gradient(980px 520px at 50% 68%,rgba(32,91,58,.34),transparent 60%)!important;
}
.poker-table{
  width:min(1120px,96vw)!important;
  aspect-ratio:16/9!important;
}
.poker-table,.bj-table{
  filter:drop-shadow(0 56px 100px rgba(0,0,0,.58))!important;
}
.pt-felt,.bj-felt{
  background:
    radial-gradient(70% 55% at 50% 45%,rgba(89,179,120,.34),transparent 70%),
    repeating-radial-gradient(ellipse at 50% 50%,rgba(255,255,255,.025) 0 1px,transparent 1px 10px),
    linear-gradient(145deg,#0e6a42,#084227 70%,#062b1d)!important;
  border:16px solid #17120d!important;
  box-shadow:
    inset 0 0 0 2px rgba(242,200,95,.36),
    inset 0 0 110px rgba(0,0,0,.52),
    0 40px 90px rgba(0,0,0,.46)!important;
}
.pt-felt::after,.bj-felt::after{
  border-color:rgba(242,200,95,.3)!important;
}
.pk-card{
  border-radius:8px!important;
  background:linear-gradient(160deg,#fff,#ede5d2)!important;
  border:0!important;
  color:#161411!important;
  box-shadow:0 10px 20px rgba(0,0,0,.32)!important;
}
.pk-card.red{color:#b91832!important}
.pk-card.back{
  background:
    linear-gradient(135deg,rgba(255,255,255,.14),transparent),
    repeating-linear-gradient(45deg,#8f2434 0 7px,#4f111b 7px 14px)!important;
}
.pk-plate{
  border:0!important;
  border-radius:999px!important;
  background:rgba(6,8,8,.76)!important;
  color:#fff!important;
  box-shadow:0 12px 26px rgba(0,0,0,.34)!important;
  backdrop-filter:blur(8px);
}
.pk-name,.pk-chips,.pt-pot,.pt-msg,.bj-dealer-label{color:#fff!important}
.pk-chips,.bj-hbet{color:#f7d37c!important}
.pk-seat.turn .pk-plate,.bj-seat.turn .pk-plate{
  box-shadow:0 0 0 2px rgba(242,200,95,.68),0 16px 30px rgba(0,0,0,.38)!important;
}
.pk-deck,.bj-shoebox{
  background:
    linear-gradient(135deg,rgba(255,255,255,.12),transparent),
    repeating-linear-gradient(45deg,#8f2434 0 7px,#4f111b 7px 14px)!important;
  border:0!important;
}
.bj-table{
  width:min(1120px,96vw)!important;
  min-height:min(690px,calc(100vh - 180px))!important;
  border-radius:260px 260px 34px 34px!important;
}
.bj-felt{
  border-radius:260px 260px 34px 34px!important;
}
.bj-rule{
  background:rgba(0,0,0,.26)!important;
  border:0!important;
  color:rgba(255,255,255,.54)!important;
  border-radius:999px!important;
}
.bj-actions,.poker-actions{
  min-height:84px;
  background:rgba(7,8,8,.82)!important;
  border:0!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
  backdrop-filter:blur(18px);
}
.bj-actions .btn,.poker-actions .btn{
  border-radius:999px!important;
  padding:12px 18px!important;
}
.bj-chip{
  border:3px solid rgba(255,255,255,.7)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.44),inset 0 0 0 4px rgba(255,255,255,.12)!important;
}
.seat-chair{
  border:1px dashed rgba(255,255,255,.22)!important;
  border-radius:22px!important;
  background:rgba(6,8,8,.46)!important;
}
.chair-icon{color:#fff!important}

@media(max-width:1100px){
  .hub-body{
    grid-template-columns:1fr!important;
    grid-template-areas:"deck" "progress" "quick"!important;
  }
  .hp-card{margin:0!important}
  .game-card,.game-card.game-blackjack,.game-card.game-poker,.game-card.game-magnat,.game-card.game-chess,.game-card.game-slots{
    grid-column:span 6;
  }
  .play-panel{grid-template-columns:1fr!important}
  #screen-casino .cas-rail{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .topbar{min-height:64px;padding:10px 14px!important}
  .hub-body,.prof-body,#screen-casino .cas-main{
    padding:24px 14px 42px!important;
  }
  .playdeck-head{grid-template-columns:1fr!important}
  .playdeck-kicker{font-size:56px!important}
  .playdeck-title,#screen-casino .cas-game-title,.pc-name{font-size:38px!important}
  .game-shelf{grid-template-columns:1fr!important}
  .game-card,.game-card.game-blackjack,.game-card.game-poker,.game-card.game-magnat,.game-card.game-chess,.game-card.game-slots{
    grid-column:auto;
    min-height:300px!important;
  }
  .quick-card{
    border-radius:24px!important;
    display:grid!important;
    grid-template-columns:auto 1fr!important;
  }
  .qc-row{grid-column:1 / -1;width:100%}
  .cas-hero-card{
    min-height:300px;
    grid-template-columns:1fr!important;
    padding:22px!important;
  }
  #screen-casino .cas-nav{flex-direction:column!important}
  .lounge-games{width:100%}
  #screen-casino .cnav{min-width:148px!important}
  .prof-tabs{width:100%!important}
  .prof-tabs .tab{flex:1!important;padding:11px 8px!important}
  .bj-table{min-height:600px!important}
}

/* Dernière passe : neutralise les restes très "vieux casino" encore portés
   par les sélecteurs historiques plus précis. */
#screen-casino,
#screen-casino.societe,
#screen-profil{
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(135deg,#11100e 0,#151816 52%,#101417 100%);
  background-size:32px 32px,32px 32px,auto;
}
#screen-casino::after,#screen-profil::after{
  opacity:.22;
  background:
    linear-gradient(180deg,rgba(255,255,255,.045),transparent 30%),
    repeating-linear-gradient(135deg,rgba(232,191,87,.028) 0 1px,transparent 1px 8px);
}
#screen-casino::before{background:linear-gradient(90deg,#e8bf57,#45bf7d,#58a6ff)}

#screen-casino .logo.tiny,
#screen-profil .logo.tiny,
.hb-title,
#screen-casino .cas-game-title,
.pc-name,
.pi-txt h3,
.vest-head h3,
.cpt-card h3,
.level-box .lvl-num{
  font-family:Inter,system-ui,sans-serif;
  letter-spacing:.04em;
  text-transform:uppercase;
}
#screen-casino .logo.tiny,#screen-profil .logo.tiny{
  color:var(--ink);font-size:18px;text-shadow:none;
}
#screen-casino .cas-game-title{
  color:var(--ink);font-size:34px;line-height:1.08;text-shadow:none;
}
#screen-casino .cas-game-title::after{background:linear-gradient(90deg,var(--gold),#45bf7d,transparent)}
#screen-casino.societe .cas-game-title::after{background:linear-gradient(90deg,#58a6ff,#45bf7d,transparent)}

.hub-block{
  background:
    linear-gradient(135deg,rgba(232,191,87,.12),transparent 44%),
    linear-gradient(180deg,rgba(255,255,255,.072),rgba(255,255,255,.032));
}
.hub-block.hb-casino{
  background:
    linear-gradient(135deg,rgba(232,191,87,.14),transparent 42%),
    linear-gradient(225deg,rgba(69,191,125,.12),transparent 45%),
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.032));
}
.hub-block.hb-societe{
  background:
    linear-gradient(135deg,rgba(88,166,255,.12),transparent 42%),
    linear-gradient(225deg,rgba(69,191,125,.1),transparent 45%),
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.032));
}
.hb-title{font-size:28px;color:var(--ink);line-height:1.08}
.hb-line{color:#f2d781}.hub-block.hb-societe .hb-line{color:#9cd2ff}

#screen-casino .casino-bar,
#screen-poker .topbar,
#screen-bj .topbar{
  background:rgba(17,16,14,.9);border-bottom:1px solid var(--line);
}
#screen-casino .cas-rail{
  background:rgba(10,10,9,.48);border-right:1px solid var(--line);box-shadow:none;
}
#screen-casino .cas-main{
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.01));
}
#screen-casino .rail-title{color:var(--muted)}
#screen-casino .cnav{
  border-radius:8px;color:var(--muted);background:transparent;
}
#screen-casino .cnav:hover{background:rgba(255,255,255,.055);color:var(--ink)}
#screen-casino .cnav.on,#screen-casino.societe .cnav.on{
  background:rgba(232,191,87,.12);border-color:rgba(232,191,87,.42);color:var(--ink);
  box-shadow:inset 3px 0 0 var(--gold);
}
#screen-casino.societe .cnav.on{
  background:rgba(88,166,255,.1);border-color:rgba(88,166,255,.36);
  box-shadow:inset 3px 0 0 #58a6ff;
}
#screen-casino .cas-note,
#screen-casino .cas-rules,
#screen-casino .cas-list .ctable,
#screen-casino .stk,
#screen-casino .grant{
  background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.028));
  border-color:rgba(238,213,161,.18);
  border-radius:8px;
}
#screen-casino .cas-list .ctable:hover{
  transform:translateY(-1px);
  border-color:rgba(232,191,87,.52);
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));
}
#screen-casino .cas-list .ct-name,
#screen-casino .cas-rules .cr-row b,
#screen-casino .grant-txt b,
#screen-casino .stk-name{color:var(--ink)}
#screen-casino .cas-list .ct-stakes,
#screen-casino .cas-list .ct-seats,
#screen-casino .cas-game-desc,
#screen-casino .cas-note,
#screen-casino .stk-note,
#screen-casino .cas-join,
#screen-casino .grant-txt span,
#screen-casino .tier-need{color:var(--muted)}
#screen-casino .cas-list .ct-cta{color:var(--gold-lite)}
#screen-casino.societe .cas-list .ct-cta,
#screen-casino.societe .hub-block .hb-cta{color:#9cd2ff}
#screen-casino .cmode{border-radius:6px;color:var(--muted)}
#screen-casino .cmode.on,#screen-casino.societe .cmode.on{
  background:linear-gradient(180deg,var(--gold),var(--gold2));color:#201405;
  box-shadow:0 8px 18px rgba(185,130,46,.24);
}
#screen-casino.societe .cmode.on{
  background:linear-gradient(180deg,#8fc8ff,#58a6ff);color:#07131d;
}
#screen-casino .btn{border-radius:8px}

@media(max-width:680px){
  .hub-actions{width:100%;justify-content:flex-start}
  .topbar .logo.tiny{width:100%}
  .topbar-mid{width:100%}
  .hb-title{font-size:26px}
  #screen-casino .cas-game-title{font-size:27px}
}

/* Lisibilité des écrans de partie. */
.lobby-card{
  background:linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.045));
  border-color:rgba(238,213,161,.24);
}
.lobby-card .logo,.lobby-card h2,.lobby-card .nm,.invite-code b{
  color:var(--ink);text-shadow:none;
}
.lobby-card .logo{letter-spacing:.12em}
.invite-box,.lobby-stake,.lp,#btn-addbot,.botlevels{
  background:rgba(255,255,255,.055);border-color:rgba(238,213,161,.2);
}
.invite-label,.invite-hint,.lobby-hint,.lobby-stake .ls-txt,.lp .st{
  color:var(--muted);
}
.lobby-stake .ls-txt b,.lp .nm b{color:var(--ink)}
.lobby-card .btn-outline{background:rgba(255,255,255,.06);color:var(--ink)}
.lobby-card .btn-ghost{color:var(--muted)}
.lobby-card .btn-ghost:hover{color:var(--ink)}

#screen-game .prow.turn,
#screen-chess .prow.turn{
  background:linear-gradient(180deg,rgba(232,191,87,.18),rgba(232,191,87,.075));
  border-color:rgba(232,191,87,.55);
  box-shadow:0 0 0 1px rgba(232,191,87,.12),0 10px 22px rgba(0,0,0,.22);
}
#screen-game .prow.turn .pname,
#screen-game .prow.turn .pnet b,
#screen-game .prow.turn .pcash,
#screen-chess .prow.turn .pname{
  color:var(--ink);
}
#screen-game .empire-empty,#screen-game .assets-empty{color:#c7bda9}

/* ==========================================================================
   KYDOS LOUNGE
   Refonte d'organisation : les jeux deviennent la navigation principale,
   avec une ambiance plus posée et sociale, proche d'un hub entre amis.
   ========================================================================== */
:root{
  --lounge-bg:#101417;
  --lounge-panel:rgba(255,255,255,.075);
  --lounge-panel2:rgba(255,255,255,.045);
  --lounge-line:rgba(255,255,255,.12);
  --lounge-soft:#bfc7bd;
  --lounge-blue:#7fc8ff;
  --lounge-mint:#69d6a2;
  --lounge-pink:#ff8bb5;
  --lounge-yellow:#f2ca6b;
}

.hub-body{
  max-width:1240px;
  padding-top:24px;
}
.playdeck{
  display:block;
  max-width:1120px;
}
.playdeck-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:18px;
  margin:0 0 16px;
}
.playdeck-kicker{
  color:var(--lounge-mint);font-size:11px;font-weight:950;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:6px;
}
.playdeck-title{
  color:var(--ink);font-weight:950;font-size:clamp(24px,3vw,38px);
  letter-spacing:-.01em;max-width:760px;line-height:1.06;
}
.playdeck-actions{display:flex;gap:8px;flex-wrap:wrap}
.game-shelf{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.game-card{
  --game:#7fc8ff;
  position:relative;min-height:238px;padding:16px;
  border:1px solid color-mix(in srgb,var(--game) 34%,transparent);
  border-radius:18px;overflow:hidden;
  background:
    radial-gradient(120% 72% at 50% 0,color-mix(in srgb,var(--game) 18%,transparent),transparent 62%),
    linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));
  box-shadow:0 16px 34px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08);
  display:flex;flex-direction:column;
}
.game-card::before{
  content:"";position:absolute;inset:0;opacity:.42;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,255,255,.08),transparent 38%),
    repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 1px,transparent 1px 8px);
}
.game-card:hover{
  transform:translateY(-4px);
  border-color:color-mix(in srgb,var(--game) 62%,white 8%);
  box-shadow:0 24px 48px rgba(0,0,0,.34),0 0 0 1px color-mix(in srgb,var(--game) 18%,transparent);
}
.game-card-hit{position:absolute;inset:0;border:0;background:transparent;z-index:1}
.game-top,.game-title,.game-desc,.game-modes{position:relative;z-index:2}
.game-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.game-emoji{
  width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:27px;
  background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.12);
}
.game-pill{
  color:color-mix(in srgb,var(--game) 70%,white 25%);
  background:rgba(0,0,0,.22);border:1px solid color-mix(in srgb,var(--game) 32%,transparent);
  border-radius:999px;padding:5px 9px;font-size:11px;font-weight:900;
}
.game-title{
  color:var(--ink);font-size:22px;font-weight:950;margin-top:18px;line-height:1.05;
}
.game-desc{color:var(--lounge-soft);font-size:13px;line-height:1.45;margin-top:8px;margin-bottom:14px}
.game-modes{
  position:relative;left:auto;right:auto;bottom:auto;margin-top:auto;display:flex;flex-direction:column;gap:7px;
}
.game-modes button{
  border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(0,0,0,.24);
  color:var(--ink);padding:8px 10px;font-weight:900;text-align:left;
}
.game-modes button:hover{
  border-color:color-mix(in srgb,var(--game) 62%,transparent);
  background:color-mix(in srgb,var(--game) 18%,rgba(0,0,0,.24));
}

.quick-card,.hp-card{
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));
}
.quick-card{max-width:860px;margin-top:22px}
.hp-card{margin-top:16px}

/* Le salon interne n'a plus de colonne lourde : navigation horizontale et
   panneau de jeu clair. */
.casino-layout{
  display:flex;flex-direction:column;min-height:0;
}
#screen-casino .cas-rail{
  display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:14px;
  padding:14px 22px;background:rgba(10,12,13,.58);
  border-right:0;border-bottom:1px solid var(--lounge-line);
}
#screen-casino .rail-title{display:none}
#screen-casino .cas-nav{
  display:flex;align-items:center;gap:12px;min-width:0;
}
.lounge-switch{
  display:flex;gap:6px;padding:4px;border:1px solid var(--lounge-line);
  background:rgba(0,0,0,.22);border-radius:999px;flex-shrink:0;
}
.lounge-switch button{
  border:0;border-radius:999px;background:transparent;color:var(--muted);
  padding:8px 13px;font-weight:900;display:flex;align-items:center;gap:7px;
}
.lounge-switch button.on{
  background:rgba(255,255,255,.1);color:var(--ink);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.lounge-games{
  display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px;
}
#screen-casino .cnav{
  min-width:156px;padding:10px 12px;border-radius:14px;
  background:rgba(255,255,255,.045);border:1px solid var(--lounge-line);
  display:grid;grid-template-columns:auto 1fr;grid-template-areas:"ico txt" "ico mood";gap:1px 9px;
}
#screen-casino .cnav-emo{grid-area:ico;font-size:24px}
#screen-casino .cnav-txt{grid-area:txt;color:var(--ink);font-weight:950}
#screen-casino .cnav-mood{grid-area:mood;color:var(--muted);font-size:11px;font-weight:800}
#screen-casino .cnav.on,#screen-casino.societe .cnav.on{
  background:color-mix(in srgb,var(--game) 18%,rgba(255,255,255,.045));
  border-color:color-mix(in srgb,var(--game) 58%,transparent);
  box-shadow:inset 0 -3px 0 var(--game);
}
#screen-casino .cas-grants{
  display:flex;gap:8px;max-width:380px;overflow:hidden;
}
#screen-casino .cas-grants .grant{
  margin:0;min-width:220px;padding:9px 10px;border-radius:14px;
}
#screen-casino .cas-ladder{display:none}
#screen-casino .cas-ladder + *{display:none}
#screen-casino .cas-main{
  flex:1;padding:24px clamp(18px,4vw,52px) 54px;
}
#screen-casino .cas-head{border:0;padding:0;margin:0 0 18px}
.cas-hero-card{
  width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;
  border:1px solid color-mix(in srgb,var(--game) 38%,transparent);
  border-radius:22px;padding:18px 20px;
  background:
    radial-gradient(80% 120% at 0 0,color-mix(in srgb,var(--game) 24%,transparent),transparent 62%),
    linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.035));
  box-shadow:0 18px 42px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.08);
}
.cas-hero-emoji{
  width:74px;height:74px;border-radius:22px;display:grid;place-items:center;font-size:38px;
  background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.13);
}
#screen-casino .cas-game-title{
  font-size:clamp(30px,4vw,50px);letter-spacing:-.02em;text-transform:none;
}
#screen-casino .cas-game-title::after{display:none}
#screen-casino .cas-game-desc{max-width:680px;font-size:14px;color:#cfd7ce}
#screen-casino .cas-modes{
  border-radius:999px;background:rgba(0,0,0,.22);padding:5px;white-space:nowrap;
}
#screen-casino .cmode{border-radius:999px;padding:10px 14px}

.play-panel{
  display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start;
}
.play-main,.play-side{min-width:0}
.section-title{
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:2px 0 12px;
}
.section-title span{color:var(--ink);font-size:18px;font-weight:950}
.section-title small{color:var(--muted);font-size:12.5px;line-height:1.35;text-align:right}
.section-title.compact{margin-top:18px}
.table-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;
}
.table-card,.slot-tier-card,.party-card{
  border:1px solid color-mix(in srgb,var(--tc,var(--game,#e8bf57)) 34%,transparent);
  border-radius:18px;background:
    radial-gradient(100% 80% at 50% 0,color-mix(in srgb,var(--tc,var(--game,#e8bf57)) 18%,transparent),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  color:var(--ink);padding:16px;text-align:left;min-height:150px;
  display:flex;flex-direction:column;gap:7px;
  box-shadow:0 14px 30px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.07);
}
.table-card:hover,.slot-tier-card:hover,.party-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--tc,var(--game,#e8bf57)) 64%,white 8%);
}
.table-card.dim,.slot-tier-card.dim{opacity:.42}
.table-tier{font-size:12px;color:color-mix(in srgb,var(--tc,#e8bf57) 72%,white 18%);font-weight:950}
.table-name{font-size:22px;font-weight:950;line-height:1.08;margin-top:4px}
.table-meta{color:var(--muted);font-size:12.5px}
.table-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:10px}
.table-foot b{color:var(--ink)}
.table-foot i{font-style:normal;color:var(--gold-lite);font-weight:950}
.play-side{display:flex;flex-direction:column;gap:12px}
.side-card{
  border-radius:18px;border:1px solid var(--lounge-line);
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  padding:16px;display:flex;flex-direction:column;gap:7px;
}
.side-ico{font-size:30px}.side-card b{font-size:17px;color:var(--ink)}.side-card span{color:var(--muted);line-height:1.45;font-size:13px}
#screen-casino .cas-rules{border-radius:18px;overflow:hidden}
#screen-casino .cr-title{font-size:11px}
#screen-casino .cr-grid{grid-template-columns:1fr;padding:6px 14px 12px}
#screen-casino .cr-row{font-size:12px}

.friend-actions{
  display:grid;grid-template-columns:minmax(240px,1.1fr) minmax(240px,.9fr);gap:12px;
}
.party-card{min-height:176px;position:relative}
.create-party{
  --tc:var(--game);justify-content:flex-end;
  background:
    radial-gradient(120% 100% at 10% 0,color-mix(in srgb,var(--game) 28%,transparent),transparent 72%),
    linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));
}
.party-ico{font-size:34px}.party-card b{font-size:24px;line-height:1.05}.party-card small{color:var(--muted);font-weight:800}
.join-party .cas-join{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:auto}
.join-party input{text-align:center;letter-spacing:.2em;font-weight:950;text-transform:uppercase}
.stake-pills{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
#screen-casino .stake-pills .stk{
  border-radius:16px;min-height:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
}
#screen-casino .stake-pills .stk.on{
  background:rgba(242,202,107,.16);box-shadow:0 0 0 1px rgba(242,202,107,.18),0 12px 24px rgba(0,0,0,.22);
}

.slot-tier-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.slot-tier-card{--tc:#f05d8f;min-height:180px;text-align:center;align-items:center;justify-content:center}
.slot-tier-emo{font-size:34px}.slot-tier-card b{font-size:20px}.slot-tier-card span{color:var(--muted)}.slot-tier-card i{font-style:normal;color:var(--gold-lite);font-weight:950}

.update-notice{
  margin:0 0 18px;
  border:1px solid rgba(242,202,107,.38);
  border-radius:20px;
  background:
    radial-gradient(90% 160% at 0 0,rgba(242,202,107,.18),transparent 62%),
    linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.05));
  box-shadow:0 18px 44px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.12);
  padding:14px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:13px;
}
.update-notice.required{border-color:rgba(255,111,121,.52)}
.un-ico{
  width:46px;height:46px;border-radius:15px;
  display:grid;place-items:center;
  background:rgba(242,202,107,.16);
  box-shadow:inset 0 0 0 1px rgba(242,202,107,.2);
  font-size:23px;
}
.un-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.un-main b{color:var(--ink);font-size:17px}
.un-main span{color:var(--muted);font-size:13px;line-height:1.35}

@media(max-width:1120px){
  .game-shelf{grid-template-columns:repeat(3,minmax(0,1fr))}
  .play-panel{grid-template-columns:1fr}
  .play-side{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  #screen-casino .cas-rail{grid-template-columns:1fr}
  #screen-casino .cas-grants{max-width:none}
}
@media(max-width:760px){
  .playdeck-head{align-items:flex-start;flex-direction:column}
  .game-shelf{grid-template-columns:1fr}
  .game-card{min-height:220px}
  .casino-layout{overflow:auto}
  #screen-casino .cas-rail{padding:12px 14px}
  #screen-casino .cas-nav{flex-direction:column;align-items:stretch}
  .lounge-switch{width:100%;justify-content:center}
  .lounge-switch button{flex:1;justify-content:center}
  .lounge-games{width:100%}
  #screen-casino .cnav{min-width:142px}
  .cas-hero-card{grid-template-columns:1fr;padding:16px}
  .cas-hero-emoji{width:58px;height:58px;border-radius:17px;font-size:30px}
  .cas-hero-mode .cas-modes{display:flex;width:100%}
  .cas-hero-mode .cmode{flex:1}
  .section-title{align-items:flex-start;flex-direction:column}
  .section-title small{text-align:left}
  .friend-actions{grid-template-columns:1fr}
  .update-notice{grid-template-columns:auto 1fr}
  .update-notice .btn{grid-column:1 / -1;width:100%}
}

/* ==========================================================================
   KYDOS PUBLIC POLISH — profil, vestiaire et tables casino
   ========================================================================== */
:root{
  --ky-bg:#101514;
  --ky-panel:rgba(255,255,255,.072);
  --ky-panel2:rgba(255,255,255,.04);
  --ky-line:rgba(255,255,255,.12);
  --ky-gold:#f1c761;
  --ky-mint:#5ee6a8;
  --ky-sky:#70b7ff;
  --ky-rose:#f06b82;
  --ky-ink:#f8f1df;
  --ky-muted:rgba(248,241,223,.66);
  --ky-soft:rgba(248,241,223,.42);
}

#screen-profil{
  color:var(--ky-ink);
  background:
    radial-gradient(820px 520px at 18% 4%,rgba(94,230,168,.16),transparent 62%),
    radial-gradient(760px 520px at 86% 2%,rgba(112,183,255,.14),transparent 58%),
    linear-gradient(135deg,#121816 0,#15130f 48%,#11151a 100%);
  background-size:auto;
}
#screen-profil::before{
  background:linear-gradient(90deg,transparent,var(--ky-mint),var(--ky-gold),transparent);
  opacity:.75;
}
#screen-profil .topbar{
  background:rgba(13,17,17,.72);
  border-bottom:1px solid rgba(255,255,255,.1);
  box-shadow:0 10px 28px rgba(0,0,0,.22);
}
#screen-profil .chip{
  background:rgba(255,255,255,.075);
  border-color:rgba(255,255,255,.14);
  color:var(--ky-ink);
}
#screen-profil .chip-btn:hover{
  background:rgba(94,230,168,.12);
  border-color:rgba(94,230,168,.45);
  color:#fff;
}
.prof-body{max-width:1240px;padding-top:26px}
.prof-card{
  border-radius:26px;
  border:1px solid rgba(255,255,255,.14);
  background:
    linear-gradient(135deg,rgba(94,230,168,.14),transparent 32%),
    linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.045));
  box-shadow:0 24px 70px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.14);
  overflow:hidden;
  position:relative;
}
.prof-card::after{
  content:"";
  position:absolute;inset:auto 22px 0 auto;width:220px;height:120px;
  background:linear-gradient(135deg,transparent,rgba(241,199,97,.12));
  clip-path:polygon(22% 0,100% 0,100% 100%,0 100%);
  pointer-events:none;
}
.pc-name{
  color:var(--ky-ink);
  text-shadow:none;
  font-size:clamp(30px,3.2vw,44px);
  letter-spacing:.02em;
}
.pc-xp,.pc-next,.pc-day,.vest-head span,.vc-desc,.cpt-card p{color:var(--ky-muted)}
.pc-bar{
  background:rgba(0,0,0,.34);
  border-color:rgba(255,255,255,.12);
  height:13px;
}
.pc-bar i{
  background:linear-gradient(90deg,var(--ky-mint),var(--ky-gold));
  box-shadow:0 0 18px rgba(94,230,168,.4);
}
.pc-stat{
  background:rgba(0,0,0,.28);
  border-color:rgba(255,255,255,.12);
}
.pc-stat b,.pc-xp b,.pc-next b,.vest-head h3,.cpt-card h3,.vc-name{color:var(--ky-ink)}
.prof-tabs{
  width:min(620px,100%);
  border-radius:18px;
  padding:6px;
  background:rgba(0,0,0,.28);
  border-color:rgba(255,255,255,.12);
}
.prof-tabs .tab{
  flex:1;
  border-radius:14px;
  color:var(--ky-muted);
}
.prof-tabs .tab.active{
  background:linear-gradient(135deg,var(--ky-mint),var(--ky-gold));
  color:#172018;
  box-shadow:0 12px 30px rgba(94,230,168,.22);
}
.parc-intro,.cpt-grid{
  grid-template-columns:minmax(0,1fr) minmax(280px,360px);
}
.pi-tab,.pi-next,.parc-track,.cpt-card{
  border-color:rgba(255,255,255,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.038));
  box-shadow:0 16px 42px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.1);
}
.pi-txt h3{color:var(--ky-ink)}
.pi-next{background:linear-gradient(135deg,rgba(94,230,168,.14),rgba(241,199,97,.09))}
.pi-next .pn-lvl,.parc-row.now .pr-lvl b{
  background:linear-gradient(135deg,var(--ky-mint),var(--ky-gold));
  color:#172018;
}
.parc-row{border-bottom-color:rgba(255,255,255,.08)}
.parc-row.now{background:linear-gradient(90deg,rgba(94,230,168,.17),transparent 72%);box-shadow:inset 3px 0 0 var(--ky-mint)}
.pr-item,.pi-next .pn-name{color:var(--ky-ink)}
.pr-chips,.vc-on,.ttl{color:var(--ky-gold)}

.vest-block{
  padding:18px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:24px;
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.vest-head{justify-content:space-between}
.vest-head h3{
  display:flex;align-items:center;gap:9px;
  font-size:20px;letter-spacing:.04em;text-transform:uppercase;
}
.vest-head h3::before{
  content:"";
  width:9px;height:28px;border-radius:99px;
  background:linear-gradient(180deg,var(--ky-mint),var(--ky-gold));
}
.vest-grid{grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:14px}
.vest-card{
  min-height:194px;
  border-radius:20px;
  border-color:rgba(255,255,255,.12);
  background:
    radial-gradient(120% 90% at 50% 0,rgba(255,255,255,.11),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));
  box-shadow:0 18px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.1);
}
.vest-card:hover{
  transform:translateY(-4px);
  border-color:rgba(94,230,168,.55);
  box-shadow:0 22px 54px rgba(0,0,0,.27),0 0 0 1px rgba(94,230,168,.14);
}
.vest-card.on{
  border-color:rgba(241,199,97,.78);
  background:
    radial-gradient(120% 90% at 50% 0,rgba(241,199,97,.22),transparent 68%),
    linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));
}
.vest-card.locked{opacity:.58;filter:saturate(.68)}
.vc-top{
  width:100%;
  min-height:78px;
  border-radius:16px;
  background:rgba(0,0,0,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.vc-desc{min-height:34px}
.vest-card .mini,.cpt-card .btn,.cpt-photo .mini,.pc-left .mini{
  border-radius:13px;
}
.vest-card .mini{
  width:100%;
  background:rgba(94,230,168,.12);
  border-color:rgba(94,230,168,.36);
  color:var(--ky-ink);
}
.vest-card .mini:hover{
  background:linear-gradient(135deg,var(--ky-mint),var(--ky-gold));
  color:#172018;
}
.cpt-card{
  border-radius:22px;
  background:
    linear-gradient(135deg,rgba(112,183,255,.1),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.038));
}
.cpt-card .field input{
  background:rgba(0,0,0,.28);
  border-color:rgba(255,255,255,.12);
  color:var(--ky-ink);
}
.cpt-card .field input:focus{border-color:var(--ky-mint);box-shadow:0 0 0 3px rgba(94,230,168,.12)}
.cpt-card .btn-gold{
  background:linear-gradient(135deg,var(--ky-mint),var(--ky-gold));
  color:#172018;
}

.game-card{
  min-height:260px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(120% 90% at 8% 0,color-mix(in srgb,var(--game,#f1c761) 24%,transparent),transparent 64%),
    linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));
  overflow:hidden;
  box-shadow:0 24px 58px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12);
}
.game-card::before{
  height:92px;
  background:
    linear-gradient(90deg,color-mix(in srgb,var(--game,#f1c761) 46%,transparent),transparent),
    repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 1px,transparent 1px 8px);
}
.game-card:hover{
  transform:translateY(-5px);
  border-color:color-mix(in srgb,var(--game,#f1c761) 70%,white 12%);
  box-shadow:0 30px 76px rgba(0,0,0,.34),0 0 0 1px color-mix(in srgb,var(--game,#f1c761) 20%,transparent);
}
.game-card-hit{
  z-index:2;
}
.game-card .game-top,
.game-card .game-title,
.game-card .game-desc{
  position:relative;
  z-index:3;
  pointer-events:none;
}
.game-card .game-modes{
  position:relative;
  z-index:5;
}
.game-card .game-emoji,
.game-card .gc-emoji{
  width:64px;height:64px;border-radius:19px;
  display:grid;place-items:center;
  background:rgba(0,0,0,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.11);
}
.game-card .game-title,.game-card .gc-title{font-size:25px;letter-spacing:.01em}
.game-card .game-desc,.game-card .gc-desc{line-height:1.45}
.game-modes .mode-btn{
  border-radius:13px;
  background:rgba(0,0,0,.22);
  border-color:rgba(255,255,255,.13);
}
.game-modes .mode-btn:hover{
  background:color-mix(in srgb,var(--game,#f1c761) 18%,rgba(0,0,0,.22));
}

#screen-poker,#screen-bj{
  background:
    radial-gradient(900px 560px at 50% 0,rgba(94,230,168,.12),transparent 62%),
    linear-gradient(135deg,#0c1210 0,#101410 48%,#121017 100%);
}
#screen-poker .topbar,#screen-bj .topbar{
  background:rgba(9,12,11,.74);
  border-bottom:1px solid rgba(255,255,255,.1);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
}
.poker-table,.bj-table{filter:drop-shadow(0 34px 60px rgba(0,0,0,.45))}
.poker-table{width:min(1080px,97vw);aspect-ratio:16/9}
.pt-felt,.bj-felt{
  background:
    radial-gradient(ellipse 72% 54% at 50% 46%,rgba(94,230,168,.16),transparent 72%),
    repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 2px,transparent 2px 9px),
    radial-gradient(ellipse at 50% 48%,#17744d 0,#0b482f 58%,#062719 100%);
  border:12px solid #211814;
  box-shadow:inset 0 0 90px rgba(0,0,0,.5),inset 0 0 0 2px rgba(241,199,97,.16),0 24px 70px rgba(0,0,0,.4);
}
.pt-felt::after,.bj-felt::after{
  content:"";
  position:absolute;inset:8%;
  border:1px solid rgba(241,199,97,.22);
  border-radius:inherit;
  pointer-events:none;
}
.pt-center{
  width:min(520px,58%);
  padding:14px;
  border-radius:999px;
  background:rgba(0,0,0,.1);
}
.pt-pot{
  background:rgba(0,0,0,.48);
  border:1px solid rgba(241,199,97,.28);
  color:var(--ky-gold);
  box-shadow:0 10px 24px rgba(0,0,0,.3);
}
.pt-community{gap:8px;min-height:76px}
.pk-deck{
  position:absolute;left:50%;top:34%;z-index:4;
  width:54px;height:76px;border-radius:8px;
  transform:translate(-50%,-50%) rotate(-8deg);
  background:
    linear-gradient(135deg,rgba(255,255,255,.16),transparent),
    repeating-linear-gradient(45deg,#8e2130 0 5px,#b33142 5px 10px);
  border:2px solid rgba(255,255,255,.18);
  box-shadow:0 12px 28px rgba(0,0,0,.45),6px 5px 0 rgba(255,255,255,.16),10px 9px 0 rgba(0,0,0,.18);
}
.pk-deck::after{
  content:"";
  position:absolute;inset:8px;
  border:1px solid rgba(255,255,255,.38);
  border-radius:5px;
}
.pk-fly{position:absolute;inset:0;pointer-events:none;z-index:40}
.pk-card.pk-flying{
  position:absolute;margin:0;transform:rotate(-15deg);
  transition:left .36s cubic-bezier(.2,.78,.2,1),top .36s cubic-bezier(.2,.78,.2,1),
             transform .36s ease,opacity .12s linear;
}
.pk-card{
  width:48px;height:68px;border-radius:8px;
  background:
    radial-gradient(circle at 50% 8%,rgba(255,255,255,.92),transparent 22%),
    linear-gradient(160deg,#fffefa,#eee3c9);
  color:#1d1712;
  border:1px solid rgba(20,14,8,.2);
  box-shadow:0 9px 18px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.8);
}
.pk-card b{font-size:20px;font-weight:950;letter-spacing:0}
.pk-card i{font-size:18px}
.pk-card.red{color:#b9172f}
.pk-card.back{
  background:
    linear-gradient(135deg,rgba(255,255,255,.14),transparent),
    repeating-linear-gradient(45deg,#8e2130 0 5px,#b33142 5px 10px);
  border-color:rgba(255,255,255,.18);
}
.pk-card.back::after{
  content:"";
  position:absolute;inset:7px;
  border:1px solid rgba(255,255,255,.4);
  border-radius:5px;
}
.pk-seat{gap:5px}
.pk-plate{
  border-radius:14px;
  background:rgba(10,12,11,.84);
  border:1px solid rgba(255,255,255,.13);
  color:var(--ky-ink);
  box-shadow:0 16px 32px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.07);
}
.pk-seat.turn .pk-plate,.bj-seat.turn .pk-plate{
  border-color:rgba(241,199,97,.72);
  box-shadow:0 0 0 3px rgba(241,199,97,.18),0 18px 36px rgba(0,0,0,.4);
}
.pk-name,.pk-chips,.pt-msg{color:var(--ky-ink)}
.pk-chips{color:var(--ky-gold)}
.pk-bet,.bj-tokenchip{
  background:radial-gradient(circle at 50% 30%,#f6d47b,#b87921);
  color:#231607;
  border:2px dashed rgba(255,255,255,.58);
  box-shadow:0 10px 24px rgba(0,0,0,.38);
}
.pk-btn-d,.pk-blind{
  box-shadow:0 3px 8px rgba(0,0,0,.25);
}
.pk-allin{
  background:linear-gradient(135deg,#f06b82,#b9172f);
  box-shadow:0 8px 18px rgba(185,23,47,.28);
}
.poker-actions,.bj-actions{
  background:rgba(8,10,9,.88);
  border-top:1px solid rgba(255,255,255,.12);
  box-shadow:0 -18px 44px rgba(0,0,0,.28);
}
.poker-actions.show,.bj-actions.show{display:flex}
.poker-actions .btn,.bj-actions .btn{
  border-radius:13px;
}
.poker-actions .btn-gold,.bj-actions .btn-gold{
  background:linear-gradient(135deg,var(--ky-mint),var(--ky-gold));
  color:#162016;
}
.bj-table{
  width:min(1120px,98vw);
  min-height:min(690px,calc(100vh - 124px));
  border-radius:220px 220px 26px 26px;
  padding-top:34px;
}
.bj-felt{border-radius:220px 220px 26px 26px}
.bj-dealer-label{
  color:var(--ky-gold);
  text-shadow:0 0 16px rgba(241,199,97,.25);
}
.bj-rule{
  color:rgba(248,241,223,.62);
  border-color:rgba(241,199,97,.22);
  background:rgba(0,0,0,.16);
}
.bj-shoebox{
  width:64px;height:46px;
  background:linear-gradient(160deg,#3c2a1e,#1f1510);
  border-color:rgba(241,199,97,.38);
  box-shadow:0 12px 26px rgba(0,0,0,.46),inset 0 -8px 12px rgba(0,0,0,.42);
}
.bj-hand{
  border-radius:14px;
  background:rgba(0,0,0,.08);
}
.bj-hand.active{
  background:rgba(241,199,97,.13);
  box-shadow:0 0 0 2px rgba(241,199,97,.22);
}
.bj-badge,.bj-tag{
  background:rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.12);
  color:var(--ky-ink);
}
.bj-tag.bj{
  background:linear-gradient(135deg,var(--ky-mint),var(--ky-gold));
  color:#162016;
}
.bj-chip{
  border-width:3px;
  box-shadow:0 12px 28px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.25);
}
.seat-chair{
  border-radius:16px;
  background:rgba(0,0,0,.2);
  border-color:rgba(255,255,255,.16);
}
.seat-chair:hover{
  background:rgba(94,230,168,.11);
  border-color:rgba(94,230,168,.54);
}

@media(max-width:980px){
  .parc-intro,.cpt-grid{grid-template-columns:1fr}
  .prof-card{grid-template-columns:1fr;text-align:center;justify-items:center}
  .pc-right{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
  .pc-day{grid-column:1 / -1}
}
@media(max-width:700px){
  .vest-block{padding:14px;border-radius:20px}
  .vest-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .game-card{min-height:230px}
  .pk-deck{width:40px;height:56px;top:31%}
  .pt-community{gap:5px}
  .bj-table{min-height:620px}
}

/* ==========================================================================
   1.6.4 — Product UI pass
   Direction: fewer framed blocks, quieter surfaces, stronger information flow.
   ========================================================================== */
:root{
  --ui-bg:#0f1312;
  --ui-surface:#151918;
  --ui-surface-2:#1b201e;
  --ui-raised:#202624;
  --ui-line:rgba(236,229,211,.09);
  --ui-line-strong:rgba(236,229,211,.16);
  --ui-text:#eee7d8;
  --ui-muted:#a9a191;
  --ui-subtle:#756f64;
  --ui-yellow:#d9b65f;
  --ui-green:#45c486;
  --ui-blue:#65a7e8;
  --ui-red:#dc5968;
  --ui-radius:8px;
}
body{
  background:var(--ui-bg);
  color:var(--ui-text);
}
.screen{
  background:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px),
    var(--ui-bg);
  background-size:36px 36px,36px 36px,auto;
}
.topbar{
  min-height:60px;
  padding:0 16px;
  background:rgba(15,19,18,.92)!important;
  border-bottom:1px solid var(--ui-line)!important;
  box-shadow:none!important;
  backdrop-filter:blur(14px);
}
.logo,.logo.tiny{
  font-family:Inter,system-ui,sans-serif!important;
  color:var(--ui-text)!important;
  font-size:18px!important;
  font-weight:850!important;
  letter-spacing:.02em!important;
  text-transform:none!important;
  text-shadow:none!important;
}
.chip,.chip-btn,.chip-wallet,.chip-rank{
  min-height:34px;
  border:0!important;
  border-radius:var(--ui-radius)!important;
  background:transparent!important;
  color:var(--ui-muted)!important;
  box-shadow:none!important;
  padding:8px 10px;
}
.chip b,.chip-wallet b{color:var(--ui-text)}
.chip-wallet{
  background:rgba(217,182,95,.1)!important;
  color:var(--ui-yellow)!important;
}
.chip-btn:hover,.chip-me:hover{
  background:rgba(255,255,255,.06)!important;
  color:var(--ui-text)!important;
}
.btn,.mini,.tab{
  border-radius:var(--ui-radius)!important;
  box-shadow:none!important;
}
.btn-gold,.mini.gold{
  background:var(--ui-yellow)!important;
  color:#16140f!important;
  border-color:transparent!important;
}
.btn-outline{
  background:transparent!important;
  border:1px solid var(--ui-line-strong)!important;
  color:var(--ui-text)!important;
}
.btn-ghost{
  background:transparent!important;
  color:var(--ui-muted)!important;
}
.btn:hover,.mini:hover{
  transform:translateY(-1px);
}

/* Auth / hall */
.home-card,.auth-card,.lobby-card{
  border:0!important;
  border-radius:10px!important;
  background:var(--ui-surface)!important;
  box-shadow:0 24px 72px rgba(0,0,0,.34)!important;
}
.home-card .logo,.lobby-card .logo{
  color:var(--ui-text)!important;
  letter-spacing:.01em!important;
}
.field input{
  border-radius:var(--ui-radius)!important;
  border:1px solid var(--ui-line-strong)!important;
  background:#101413!important;
  color:var(--ui-text)!important;
}
.hub-body,.casino-layout,.prof-body,.admin-body{
  max-width:1280px;
  margin:0 auto;
}
.hub-body{
  padding:28px clamp(16px,3vw,34px) 58px;
}
.playdeck{
  max-width:none;
  padding:0;
}
.playdeck-head{
  align-items:flex-end;
  padding:0 0 22px;
  border-bottom:1px solid var(--ui-line);
  margin-bottom:18px;
}
.playdeck-kicker{
  color:var(--ui-green);
  font-size:12px;
  letter-spacing:.08em;
}
.playdeck-title{
  max-width:720px;
  color:var(--ui-text);
  font-size:clamp(28px,4vw,52px);
  line-height:1.02;
  letter-spacing:-.02em;
}
.game-shelf{
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:1px;
  background:var(--ui-line);
  border-radius:10px;
  overflow:hidden;
}
.game-card{
  min-height:230px;
  border:0!important;
  border-radius:0!important;
  background:var(--ui-surface)!important;
  box-shadow:none!important;
  padding:20px!important;
}
.game-card::before{
  display:none;
}
.game-card:hover{
  background:var(--ui-surface-2)!important;
  transform:none!important;
  box-shadow:none!important;
}
.game-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:auto;
}
.game-card .game-emoji{
  width:42px;height:42px;
  border-radius:var(--ui-radius);
  background:rgba(255,255,255,.055);
  color:var(--game,var(--ui-yellow));
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
}
.game-pill{
  border:0!important;
  background:transparent!important;
  color:var(--ui-subtle)!important;
  padding:0!important;
  font-size:12px!important;
}
.game-title{
  margin-top:44px!important;
  color:var(--ui-text)!important;
  font-size:28px!important;
  line-height:1.05!important;
  letter-spacing:-.01em!important;
}
.game-desc{
  color:var(--ui-muted)!important;
  margin-top:9px!important;
}
.game-modes{
  margin-top:18px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.game-modes button{
  border:1px solid var(--ui-line-strong)!important;
  border-radius:var(--ui-radius)!important;
  color:var(--ui-text)!important;
  background:transparent!important;
  padding:8px 10px!important;
}
.quick-card,.hp-card{
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  border-top:1px solid var(--ui-line)!important;
  box-shadow:none!important;
  padding:18px 0!important;
}

/* Casino navigation and table list */
#screen-casino,#screen-profil,#screen-admin{
  background:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px),
    var(--ui-bg)!important;
  background-size:36px 36px,36px 36px,auto!important;
  color:var(--ui-text)!important;
}
#screen-casino::before,#screen-casino::after,#screen-profil::before,#screen-profil::after{
  display:none!important;
}
.casino-layout{
  grid-template-columns:280px minmax(0,1fr);
  min-height:calc(100vh - 60px);
  border-left:1px solid var(--ui-line);
  border-right:1px solid var(--ui-line);
}
.cas-rail{
  background:rgba(255,255,255,.018)!important;
  border-right:1px solid var(--ui-line)!important;
  padding:22px 16px!important;
}
.rail-title{
  color:var(--ui-subtle)!important;
  font-size:11px!important;
  letter-spacing:.1em!important;
}
.lounge-switch,.lounge-games{
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  padding:0!important;
}
.lounge-switch span{display:none}
.lounge-switch button,.cnav{
  border:0!important;
  border-radius:var(--ui-radius)!important;
  background:transparent!important;
  color:var(--ui-muted)!important;
}
.lounge-switch button.active,.cnav.active{
  background:rgba(255,255,255,.07)!important;
  color:var(--ui-text)!important;
  box-shadow:none!important;
}
.cnav-emo{
  width:28px;height:28px;border-radius:6px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.06);
  color:var(--tc,var(--ui-yellow));
  font-size:10px;
  font-weight:950;
}
.cas-main{
  padding:24px!important;
}
.cas-hero-card{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0 0 22px!important;
  border-bottom:1px solid var(--ui-line)!important;
}
.cas-hero-emoji{
  border-radius:var(--ui-radius)!important;
  background:var(--ui-surface-2)!important;
  color:var(--game,var(--ui-yellow))!important;
  font-size:15px!important;
  font-weight:900!important;
}
.cas-game-title{
  color:var(--ui-text)!important;
  font-size:clamp(34px,5vw,64px)!important;
  text-transform:none!important;
  letter-spacing:-.03em!important;
}
.cas-game-sub,.section-title small,.table-meta,.side-card span{
  color:var(--ui-muted)!important;
}
.play-panel{
  grid-template-columns:minmax(0,1fr) 300px;
  gap:28px;
}
.table-grid{
  display:flex!important;
  flex-direction:column;
  gap:1px!important;
  background:var(--ui-line);
  border-radius:10px;
  overflow:hidden;
}
.table-card,.slot-tier-card,.party-card{
  min-height:118px!important;
  border:0!important;
  border-radius:0!important;
  background:var(--ui-surface)!important;
  box-shadow:none!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
}
.table-card:hover,.slot-tier-card:hover,.party-card:hover{
  transform:none!important;
  background:var(--ui-surface-2)!important;
}
.table-tier,.table-foot i{
  color:var(--tc,var(--ui-yellow))!important;
}
.table-name{
  font-size:24px!important;
  color:var(--ui-text)!important;
}
.table-foot{
  grid-column:2;
  grid-row:1 / span 3;
  flex-direction:column;
  align-items:flex-end!important;
}
.side-card,.grant,.tier,.cas-rules{
  border:0!important;
  border-radius:10px!important;
  background:var(--ui-surface)!important;
  box-shadow:none!important;
}
.grant-ico{
  min-width:64px;
  color:var(--ui-yellow);
  font-size:12px!important;
  font-weight:850;
  letter-spacing:.06em;
}

/* Profile */
.prof-body{
  padding:26px clamp(16px,3vw,34px) 56px;
}
.prof-card{
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0 0 24px!important;
  border-bottom:1px solid var(--ui-line)!important;
}
.prof-card::after{display:none}
.pc-name{
  color:var(--ui-text)!important;
  font-size:clamp(36px,5vw,64px)!important;
  letter-spacing:-.035em!important;
  text-transform:none!important;
}
.pc-bar{
  height:8px!important;
  border:0!important;
  background:#252a27!important;
}
.pc-bar i{
  background:linear-gradient(90deg,var(--ui-green),var(--ui-yellow))!important;
  box-shadow:none!important;
}
.pc-stat{
  border:0!important;
  border-radius:var(--ui-radius)!important;
  background:var(--ui-surface)!important;
}
.prof-tabs{
  width:100%;
  border:0!important;
  border-radius:0!important;
  border-bottom:1px solid var(--ui-line)!important;
  background:transparent!important;
  padding:0!important;
  gap:0!important;
}
.prof-tabs .tab{
  flex:0 0 auto;
  border-radius:0!important;
  padding:14px 18px!important;
  color:var(--ui-muted)!important;
  background:transparent!important;
}
.prof-tabs .tab.active{
  color:var(--ui-text)!important;
  background:transparent!important;
  box-shadow:inset 0 -2px 0 var(--ui-green)!important;
}
.parc-intro{
  grid-template-columns:minmax(0,1fr) 320px;
}
.pi-tab,.pi-next,.parc-track,.vest-block,.vest-card,.cpt-card{
  border:0!important;
  border-radius:10px!important;
  background:var(--ui-surface)!important;
  box-shadow:none!important;
}
.vest-block{
  padding:0!important;
  background:transparent!important;
  border-top:1px solid var(--ui-line)!important;
  border-radius:0!important;
  padding-top:24px!important;
}
.vest-head h3::before{display:none}
.vest-grid{
  gap:1px!important;
  background:var(--ui-line);
  border-radius:10px;
  overflow:hidden;
}
.vest-card{
  border-radius:0!important;
  min-height:178px!important;
}
.vest-card:hover,.vest-card.on{
  transform:none!important;
  background:var(--ui-surface-2)!important;
}
.vc-top{
  border-radius:var(--ui-radius)!important;
  background:#111514!important;
}
.cpt-grid{
  gap:1px!important;
  background:var(--ui-line);
  border-radius:10px;
  overflow:hidden;
}
.cpt-card{
  border-radius:0!important;
}

/* Game tables */
#screen-poker,#screen-bj,#screen-chess,#screen-game{
  background:
    radial-gradient(1000px 560px at 50% -18%,rgba(69,196,134,.11),transparent 58%),
    var(--ui-bg)!important;
}
.poker-table,.bj-table{
  filter:none!important;
}
.pt-felt,.bj-felt{
  border:8px solid #191611!important;
  box-shadow:inset 0 0 80px rgba(0,0,0,.42)!important;
}
.pk-plate{
  border:0!important;
  border-radius:var(--ui-radius)!important;
  background:rgba(16,20,19,.88)!important;
  box-shadow:none!important;
}
.pk-card{
  border-radius:7px!important;
  box-shadow:0 8px 18px rgba(0,0,0,.22)!important;
}
.poker-actions,.bj-actions{
  background:rgba(15,19,18,.94)!important;
  border-top:1px solid var(--ui-line)!important;
}
.bj-table{
  border-radius:150px 150px 10px 10px!important;
}
.bj-felt{
  border-radius:150px 150px 10px 10px!important;
}
.bj-rule{
  border:0!important;
  border-radius:var(--ui-radius)!important;
  background:rgba(0,0,0,.18)!important;
}
.seat-chair{
  border:1px dashed rgba(236,229,211,.16)!important;
  border-radius:var(--ui-radius)!important;
  background:rgba(15,19,18,.52)!important;
}
.chair-icon{
  font-size:16px!important;
  opacity:.7;
}
.chair-label,.chair-cta{
  color:var(--ui-muted)!important;
}

@media(max-width:980px){
  .casino-layout{
    display:block!important;
    border-left:0;border-right:0;
  }
  .cas-rail{
    border-right:0!important;
    border-bottom:1px solid var(--ui-line)!important;
  }
  .play-panel,.parc-intro{
    grid-template-columns:1fr;
  }
}
@media(max-width:680px){
  .topbar{
    padding:10px 14px;
  }
  .hub-body,.cas-main,.prof-body,.admin-body{
    padding:18px 14px 42px!important;
  }
  .playdeck-title,.pc-name,.cas-game-title{
    font-size:34px!important;
  }
  .game-shelf,.vest-grid,.cpt-grid,.table-grid{
    border-radius:8px;
  }
  .table-card,.slot-tier-card,.party-card{
    grid-template-columns:1fr;
  }
  .table-foot{
    grid-column:auto;
    grid-row:auto;
    align-items:flex-start!important;
  }
}

/* ========================================================================== 
   1.6.6 - interface desktop Kydos
   Navigation constante, bibliotheque lisible et jeux plein format.
   ========================================================================== */
:root{
  --ky-bg:#0b0d0c;
  --ky-surface:#121513;
  --ky-surface-2:#191d1a;
  --ky-paper:#f4f1e9;
  --ky-text:#f5f3ec;
  --ky-muted:#9c9f98;
  --ky-line:rgba(245,243,236,.11);
  --ky-yellow:#f1c75b;
  --ky-green:#57c98b;
  --ky-blue:#6cabed;
  --ky-coral:#ee776f;
  --ky-rail:232px;
  --ky-hero:url('../assets/kydos-lounge-166.png');
}

html,body{
  background:var(--ky-bg)!important;
  color:var(--ky-text)!important;
  font-family:'Manrope','Segoe UI',Arial,sans-serif!important;
}
*,*::before,*::after{box-sizing:border-box}
body,button,input,select,textarea{letter-spacing:0!important}
button,input,select,textarea{font-family:inherit!important}
button:focus-visible,input:focus-visible,select:focus-visible{
  outline:2px solid var(--ky-yellow)!important;
  outline-offset:2px;
}
.screen{background:var(--ky-bg)!important}
.muted{color:var(--ky-muted)!important}

/* Authentification */
#screen-login{
  justify-content:flex-end!important;
  padding:42px 6vw!important;
  background:
    linear-gradient(90deg,rgba(8,10,9,.12),rgba(8,10,9,.48) 50%,rgba(8,10,9,.92) 76%),
    var(--ky-hero) center/cover no-repeat!important;
}
.home-card.auth-card{
  width:420px!important;
  margin:0!important;
  padding:34px!important;
  border:1px solid var(--ky-line)!important;
  border-radius:12px!important;
  background:rgba(13,16,14,.9)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.45)!important;
  backdrop-filter:blur(20px);
}
.home-card.auth-card .logo{
  font-size:34px!important;
  line-height:1!important;
  color:var(--ky-text)!important;
}
.home-card.auth-card .logo::after{
  content:'JEUX ENTRE AMIS';
  display:block;
  margin-top:10px;
  color:var(--ky-yellow);
  font-size:10px;
  font-weight:800;
}
.auth-tabs.tabs{margin:26px 0 18px!important}
.field input,.code-input,.join-row input,#invite-link,.cas-join input{
  min-height:46px;
  border-radius:6px!important;
  background:#f6f4ef!important;
}
.btn,.mini{border-radius:6px!important}
.btn-gold{
  background:var(--ky-yellow)!important;
  color:#171813!important;
}

/* Coque desktop */
.app-nav{display:none}
@media(min-width:1081px){
  #screen-hub>.topbar,
  #screen-casino>.topbar,
  #screen-profil>.topbar,
  #screen-admin>.topbar{
    position:absolute!important;
    inset:0 auto 0 0!important;
    width:var(--ky-rail)!important;
    min-height:100vh!important;
    padding:28px 18px 20px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    background:rgba(10,12,11,.96)!important;
    border:0!important;
    border-right:1px solid var(--ky-line)!important;
    backdrop-filter:blur(22px);
  }
  #screen-hub>.topbar .logo,
  #screen-casino>.topbar .logo,
  #screen-profil>.topbar .logo,
  #screen-admin>.topbar .logo{
    padding:0 10px;
    font-size:25px!important;
    color:var(--ky-text)!important;
  }
  #screen-hub>.topbar .logo::after,
  #screen-casino>.topbar .logo::after,
  #screen-profil>.topbar .logo::after,
  #screen-admin>.topbar .logo::after{
    content:'PLAY TOGETHER';
    display:block;
    margin-top:7px;
    color:var(--ky-muted);
    font-size:9px;
    font-weight:700;
  }
  .app-nav{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin:46px 0 22px;
  }
  .app-nav button{
    width:100%;
    height:48px;
    padding:0 10px;
    display:flex;
    align-items:center;
    gap:12px;
    border:0;
    border-radius:6px;
    background:transparent;
    color:var(--ky-muted);
    font-size:13px;
    font-weight:700;
    text-align:left;
    cursor:pointer;
  }
  .app-nav button:hover{background:rgba(255,255,255,.05);color:var(--ky-text)}
  .app-nav button.active{background:var(--ky-paper);color:#121411}
  .app-nav-mark{
    width:25px;
    height:25px;
    display:grid;
    place-items:center;
    flex:0 0 25px;
    border:1px solid currentColor;
    border-radius:50%;
    font-size:10px;
    font-weight:800;
  }
  #screen-hub>.topbar .topbar-mid,
  #screen-profil>.topbar .topbar-mid,
  #screen-admin>.topbar .topbar-mid{display:none!important}
  #screen-casino>.topbar .topbar-mid{
    order:5;
    margin-top:auto;
    padding:14px 6px 0;
    display:flex!important;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
  }
  #screen-hub .hub-actions{
    margin-top:auto;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:4px!important;
  }
  #screen-hub .hub-actions>.chip,
  #screen-hub .hub-actions>button,
  #screen-casino>.topbar>.chip-btn,
  #screen-profil>.topbar>.chip-btn,
  #screen-admin>.topbar>.chip-btn{
    width:100%;
    min-height:38px;
    justify-content:flex-start!important;
    text-align:left;
    padding:8px 10px!important;
  }
  #hub-profil{
    min-height:58px!important;
    display:flex!important;
    align-items:center!important;
    gap:10px;
    border-top:1px solid var(--ky-line)!important;
    border-radius:0!important;
    padding-top:14px!important;
  }
  #hub-profil .me-txt{min-width:0}
  #hub-profil .me-txt b,#hub-profil .me-txt i{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #hub-wallet{background:rgba(241,199,91,.1)!important;color:#f7db91!important}
  #btn-logout{color:#d4a09d!important}
  #ver-chip{color:#646862!important;font-size:11px!important}
  #screen-casino>.topbar>#cas-back,
  #screen-profil>.topbar>#btn-profil-back,
  #screen-admin>.topbar>#btn-admin-back{
    order:6;
    margin-top:8px;
    color:var(--ky-muted)!important;
  }
  #screen-hub .hub-body,
  #screen-casino .casino-layout,
  #screen-profil .prof-body,
  #screen-admin .admin-body{
    width:calc(100% - var(--ky-rail))!important;
    max-width:none!important;
    margin:0 0 0 var(--ky-rail)!important;
  }
}

/* Hall - tous les jeux visibles comme dans un lanceur PC */
#screen-hub{
  overflow:hidden!important;
  background:
    linear-gradient(90deg,rgba(8,10,9,.9),rgba(8,10,9,.66) 54%,rgba(8,10,9,.82)),
    var(--ky-hero) center/cover no-repeat!important;
}
#screen-hub::after,#screen-casino::after,#screen-profil::after{display:none!important}
.hub-body{
  height:100vh;
  min-height:0;
  padding:38px 42px 30px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(330px,420px)!important;
  grid-template-areas:'deck deck' 'progress quick'!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  gap:18px!important;
  overflow:auto!important;
}
.playdeck{grid-area:deck!important;min-height:0;display:flex;flex-direction:column}
.playdeck-head{
  min-height:112px;
  margin:0 0 24px!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:24px;
}
.playdeck-kicker{
  margin:0 0 10px!important;
  color:var(--ky-yellow)!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:800!important;
  text-transform:uppercase;
}
.playdeck-title{
  max-width:none!important;
  color:var(--ky-text)!important;
  font-size:48px!important;
  line-height:1.04!important;
  font-weight:700!important;
}
.playdeck-sub{
  max-width:660px!important;
  margin-top:10px!important;
  color:#c8c8c1!important;
  font-size:14px!important;
}
.playdeck-actions{align-self:flex-end}
.playdeck-actions .mini{background:var(--ky-yellow)!important;color:#141510!important;padding:10px 16px!important}
.game-shelf{
  flex:1;
  min-height:300px;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(150px,1fr))!important;
  gap:12px!important;
  background:transparent!important;
}
.game-card,
.game-card.game-blackjack,.game-card.game-poker,.game-card.game-slots,
.game-card.game-chess,.game-card.game-magnat{
  grid-column:auto!important;
  min-height:300px!important;
  height:100%!important;
  padding:18px!important;
  justify-content:flex-end!important;
  border:0!important;
  border-radius:8px!important;
  background:
    linear-gradient(180deg,rgba(5,7,6,.06),rgba(5,7,6,.22) 42%,rgba(5,7,6,.94)),
    var(--photo) center/cover no-repeat!important;
  box-shadow:0 18px 50px rgba(0,0,0,.22)!important;
}
.game-card::before{
  background:linear-gradient(180deg,color-mix(in srgb,var(--game) 18%,transparent),transparent 48%)!important;
}
.game-card::after{display:none!important}
.game-card:hover{transform:translateY(-3px)!important;box-shadow:0 24px 60px rgba(0,0,0,.36)!important}
.game-title{
  max-width:100%!important;
  margin:100px 0 0!important;
  color:#fff!important;
  font-size:27px!important;
  line-height:1.05!important;
  font-weight:700!important;
}
.game-desc{
  min-height:57px;
  color:rgba(255,255,255,.72)!important;
  font-size:12px!important;
  line-height:1.45!important;
}
.game-top{font-size:11px!important}
.game-emoji{font-size:12px!important}
.game-pill{font-size:9px!important}
.game-modes{gap:6px!important;margin-top:13px!important}
.game-modes button{
  padding:8px 10px!important;
  border-radius:5px!important;
  font-size:10px!important;
  font-weight:800!important;
}
#hub-prog{grid-area:progress!important}
#hub-quick{grid-area:quick!important}
.hp-card,.quick-card{
  width:100%!important;
  max-width:none!important;
  min-height:96px;
  margin:0!important;
  padding:16px 18px!important;
  border:1px solid var(--ky-line)!important;
  border-radius:8px!important;
  background:rgba(12,15,13,.83)!important;
  box-shadow:none!important;
  backdrop-filter:blur(18px);
}
.hp-card{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important}
.hp-unlock{display:none!important}
.hp-badge{border-radius:5px!important}
.quick-card{display:grid!important;grid-template-columns:auto minmax(0,1fr) minmax(180px,240px)!important}
.qc-ico{width:44px!important;height:44px!important;border-radius:50%!important;background:var(--ky-paper)!important}
.qc-title{font-size:15px!important}
.qc-row{min-width:0!important}
.qc-row input{min-width:0!important;border-radius:5px!important}
#update-notice{grid-column:1/-1;order:-1;border-radius:8px!important}

/* Catalogue de jeux */
#screen-casino{overflow:hidden!important;background:var(--ky-bg)!important}
.casino-layout{
  height:100vh;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:220px minmax(0,1fr)!important;
  overflow:hidden;
  background:var(--ky-bg)!important;
}
#screen-casino .cas-rail{
  min-height:0;
  padding:28px 16px 20px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
  overflow:auto!important;
  background:#0f1210!important;
  border:0!important;
  border-right:1px solid var(--ky-line)!important;
  backdrop-filter:none!important;
}
#screen-casino .cas-rail>.rail-title{display:none!important}
#screen-casino .cas-nav{display:flex!important;flex-direction:column!important;gap:20px!important}
.lounge-switch{
  display:grid!important;
  grid-template-columns:1fr 1fr;
  gap:3px!important;
  padding:3px!important;
  border-radius:6px!important;
  background:#1b1f1c!important;
}
.lounge-switch button{
  min-width:0;
  padding:9px 6px!important;
  border-radius:4px!important;
  font-size:11px!important;
}
.lounge-switch button span{display:none!important}
.lounge-switch button.on{background:var(--ky-paper)!important;color:#151713!important}
.lounge-games{
  display:flex!important;
  flex-direction:column!important;
  gap:3px!important;
  overflow:visible!important;
}
#screen-casino .cnav{
  width:100%!important;
  min-width:0!important;
  min-height:58px;
  padding:10px!important;
  display:grid!important;
  grid-template-columns:32px 1fr!important;
  align-items:center;
  gap:2px 9px!important;
  border:0!important;
  border-radius:6px!important;
  background:transparent!important;
}
#screen-casino .cnav:hover{background:#191d1a!important}
#screen-casino .cnav.on{background:#222723!important;box-shadow:none!important}
#screen-casino .cnav.on::after{
  content:'';
  position:absolute;
  left:0;
  top:12px;
  bottom:12px;
  width:3px;
  border-radius:0 3px 3px 0;
  background:var(--game);
}
.cnav-emo{grid-row:1/3!important;font-size:11px!important;color:var(--game)!important}
.cnav-txt{font-size:13px!important}
.cnav-mood{font-size:10px!important}
#screen-casino .cas-grants{
  margin-top:auto;
  display:flex!important;
  flex-direction:column;
  gap:8px!important;
  max-width:none!important;
}
#screen-casino .grant{padding:12px!important;border-radius:6px!important;background:#191d1a!important}
#screen-casino .cas-ladder{display:none!important}
#screen-casino .cas-main{
  min-width:0;
  padding:28px 34px 60px!important;
  overflow:auto!important;
  background:
    linear-gradient(rgba(10,12,11,.93),rgba(10,12,11,.96)),
    var(--ky-hero) center/cover fixed no-repeat!important;
}
#screen-casino .cas-head{margin:0 0 28px!important}
.cas-hero-card{
  min-height:240px!important;
  padding:26px!important;
  border-radius:8px!important;
  box-shadow:none!important;
}
.cas-hero-card::before{
  background:
    linear-gradient(90deg,rgba(6,8,7,.88),rgba(6,8,7,.22) 70%),
    linear-gradient(0deg,rgba(6,8,7,.75),transparent 60%),
    var(--photo) center/cover no-repeat!important;
}
.cas-hero-card .cas-hero-emoji{left:26px!important;top:24px!important;color:var(--game)!important;font-size:12px!important}
#screen-casino .cas-game-title{
  max-width:100%!important;
  font-size:54px!important;
  line-height:1!important;
  font-weight:700!important;
}
#screen-casino .cas-game-desc{font-size:14px!important}
#screen-casino .cas-modes{border-radius:6px!important;padding:3px!important;background:rgba(12,14,13,.72)!important}
#screen-casino .cmode{border-radius:4px!important;padding:10px 14px!important;font-size:11px!important}
.play-panel{grid-template-columns:minmax(0,1fr) 300px!important;gap:30px!important}
.section-title span{font-size:20px!important}
.table-grid{border-radius:0!important;background:transparent!important;overflow:visible!important}
.table-card,.slot-tier-card,.party-card{
  min-height:108px!important;
  padding:17px 18px!important;
  border-radius:0!important;
  border-bottom:1px solid var(--ky-line)!important;
  background:rgba(19,23,20,.88)!important;
}
.table-card:first-child,.slot-tier-card:first-child{border-radius:7px 7px 0 0!important}
.table-card:last-child,.slot-tier-card:last-child{border-radius:0 0 7px 7px!important;border-bottom:0!important}
.table-card:hover,.slot-tier-card:hover{background:#202521!important;transform:none!important}
.table-name{font-size:22px!important}
.side-card,#screen-casino .cas-rules{
  border-radius:7px!important;
  background:rgba(18,21,19,.92)!important;
}
.friend-actions{display:grid!important;grid-template-columns:1fr 1fr!important}
.party-card{border:1px solid var(--ky-line)!important;border-radius:7px!important}
.stake-pills{grid-template-columns:repeat(3,minmax(0,1fr))!important}
#screen-casino .stk{border-radius:6px!important;background:#181c19!important}
#screen-casino .stk.on{background:var(--ky-paper)!important;color:#151713!important}

/* Profil et vestiaire */
#screen-profil{overflow:hidden!important;background:var(--ky-bg)!important}
.prof-body{
  height:100vh;
  min-height:0;
  padding:32px 40px 60px!important;
  overflow:auto!important;
  background:
    linear-gradient(90deg,rgba(9,11,10,.96),rgba(9,11,10,.86)),
    var(--ky-hero) center/cover fixed no-repeat!important;
}
.prof-card{
  min-height:210px;
  padding:28px 30px!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) 270px!important;
  gap:28px!important;
  border:0!important;
  border-radius:8px!important;
  background:
    linear-gradient(90deg,rgba(16,19,17,.95),rgba(16,19,17,.64)),
    var(--ky-hero) 65% center/cover no-repeat!important;
  box-shadow:none!important;
}
.pc-name{font-size:42px!important;line-height:1.05!important;font-weight:700!important}
.pc-right{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:1px!important;background:var(--ky-line)!important}
.pc-stat{padding:14px 10px!important;background:rgba(15,18,16,.88)!important}
.pc-stat b{font-size:22px!important}
.pc-day{grid-column:1/-1;background:rgba(15,18,16,.88)!important}
.prof-tabs{
  position:sticky;
  top:-32px;
  z-index:4;
  margin:22px 0 24px!important;
  padding:12px 0 0!important;
  display:flex!important;
  gap:24px!important;
  border:0!important;
  border-bottom:1px solid var(--ky-line)!important;
  border-radius:0!important;
  background:rgba(11,13,12,.94)!important;
  backdrop-filter:blur(16px);
}
.prof-tabs .tab{
  min-width:0!important;
  padding:12px 2px!important;
  border-radius:0!important;
  color:var(--ky-muted)!important;
}
.prof-tabs .tab.active{background:transparent!important;color:var(--ky-text)!important;box-shadow:inset 0 -2px 0 var(--ky-yellow)!important}
.parc-intro{grid-template-columns:minmax(0,1fr) 360px!important;gap:34px!important}
.pi-txt,.pi-tab,.pi-next,.parc-track,.vest-card,.cpt-card{
  border-radius:7px!important;
  box-shadow:none!important;
}
.pi-txt{padding:10px 0!important;background:transparent!important;border:0!important}
.pi-tab{background:rgba(17,20,18,.92)!important}
.parc-track{background:rgba(13,16,14,.9)!important}
.parc-row{border-bottom:1px solid var(--ky-line)!important}
.vest-block{margin-bottom:36px!important}
.vest-head{border-bottom:1px solid var(--ky-line);padding-bottom:12px!important}
.vest-grid{grid-template-columns:repeat(5,minmax(150px,1fr))!important;gap:10px!important;background:transparent!important}
.vest-card{
  min-height:230px!important;
  padding:16px!important;
  border:1px solid transparent!important;
  background:rgba(18,21,19,.94)!important;
}
.vest-card:hover{background:#1c211d!important}
.vest-card.on{border-color:var(--ky-green)!important;background:#17231c!important}
.vc-top{min-height:92px!important;background:#0c0f0d!important;border-radius:5px!important}
.cpt-grid{grid-template-columns:1fr 1fr!important;gap:1px!important;border-radius:7px!important;background:var(--ky-line)!important}
.cpt-card{min-height:280px!important;border:0!important;background:rgba(16,19,17,.96)!important}

/* Administration */
#screen-admin{overflow:hidden!important}
.admin-body{height:100vh!important;padding:34px 40px 60px!important;background:#0e100f!important}
.admin-head{padding-bottom:18px;border-bottom:1px solid var(--ky-line)}
.admin-list{border-radius:7px!important;overflow:hidden}
.admin-row{border-bottom:1px solid var(--ky-line)!important;background:#151815!important}

/* Salons d'attente */
#screen-lobby{
  padding:32px!important;
  background:
    linear-gradient(90deg,rgba(8,10,9,.88),rgba(8,10,9,.68)),
    var(--ky-hero) center/cover no-repeat!important;
}
.lobby-card{
  width:min(860px,94vw)!important;
  max-height:calc(100vh - 64px);
  overflow:auto;
  padding:30px 34px!important;
  border:1px solid var(--ky-line)!important;
  border-radius:9px!important;
  background:rgba(13,16,14,.94)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.42)!important;
}
.lobby-card h2{text-align:left!important;font-size:30px!important}
.invite-box{border-radius:7px!important;background:#181c19!important;border:0!important}
.lobby-players{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px!important}
.lobby-player{border-radius:6px!important;background:#181c19!important}
.lobby-controls{justify-content:flex-end!important;border-top:1px solid var(--ky-line);padding-top:16px}

/* Barres des jeux : courtes, lisibles, toujours au meme endroit */
#screen-game>.topbar,#screen-chess>.topbar,#screen-poker>.topbar,#screen-bj>.topbar,#screen-slots>.topbar{
  min-height:64px!important;
  padding:10px 20px!important;
  background:#0c0f0d!important;
  border-bottom:1px solid var(--ky-line)!important;
}
#screen-game>.topbar .logo,#screen-chess>.topbar .logo,#screen-poker>.topbar .logo,#screen-bj>.topbar .logo,#screen-slots>.topbar .logo{
  min-width:130px;
  color:var(--ky-text)!important;
  font-size:20px!important;
}
#screen-game .topbar-mid,#screen-chess .topbar-mid,#screen-poker .topbar-mid,#screen-bj .topbar-mid,#screen-slots .topbar-mid{
  justify-content:flex-start!important;
  flex-wrap:nowrap!important;
  overflow-x:auto;
}
.turn-banner{margin-left:auto;white-space:nowrap;font-size:12px!important}

/* MAGNAT */
#screen-game{background:#111411!important}
.game-main{
  padding:14px 18px 18px!important;
  display:grid!important;
  grid-template-columns:minmax(620px,1fr) 330px!important;
  gap:16px!important;
}
.board-wrap{width:min(100%,calc(100vh - 98px),820px)!important;height:auto!important;max-height:none!important;aspect-ratio:1/1;margin:auto!important}
.board{border-radius:4px!important;box-shadow:0 20px 60px rgba(0,0,0,.34)!important}
.sidebar{width:auto!important;min-width:0!important;gap:10px!important}
.panel{border-radius:7px!important;border:1px solid var(--ky-line)!important;background:#171b18!important;box-shadow:none!important}

/* Echecs */
#screen-chess{background:#101310!important}
.chess-main{
  padding:14px 18px 18px!important;
  display:grid!important;
  grid-template-columns:minmax(560px,1fr) 340px!important;
  gap:18px!important;
}
.chess-board-wrap{display:grid!important;place-items:center!important;min-width:0}
.chess-board{width:min(calc(100vh - 100px),calc(100vw - 410px))!important;height:auto!important;aspect-ratio:1/1}
#screen-chess .sidebar{overflow:auto!important}

/* Poker et blackjack */
#screen-poker,#screen-bj{
  background:
    radial-gradient(circle at 50% 22%,rgba(42,99,69,.2),transparent 40%),
    #080b09!important;
}
.poker-main,.bj-main{padding:12px 18px 0!important}
.poker-table-wrap{min-height:0!important;display:grid!important;place-items:center!important}
.poker-table{
  width:min(1180px,86vw)!important;
  height:min(660px,calc(100vh - 160px))!important;
  border-radius:50%!important;
  box-shadow:0 30px 90px rgba(0,0,0,.55)!important;
}
.pt-felt{
  border:12px solid #241f17!important;
  border-radius:50%!important;
  background:
    radial-gradient(ellipse at center,rgba(255,255,255,.055),transparent 52%),
    repeating-radial-gradient(ellipse at center,#11653f 0,#11653f 2px,#0f5d3a 3px,#0f5d3a 5px)!important;
}
.bj-main{display:grid!important;place-items:center!important}
.bj-table{
  width:min(1180px,88vw)!important;
  height:min(650px,calc(100vh - 160px))!important;
  border-radius:260px 260px 16px 16px!important;
  box-shadow:0 30px 90px rgba(0,0,0,.55)!important;
}
.bj-felt{
  border:12px solid #241f17!important;
  border-radius:260px 260px 16px 16px!important;
  background:
    radial-gradient(ellipse at 50% 46%,rgba(255,255,255,.055),transparent 58%),
    repeating-radial-gradient(ellipse at center,#10653f 0,#10653f 2px,#0e5c39 3px,#0e5c39 5px)!important;
}
.seat-chair{border-radius:7px!important;background:rgba(8,20,14,.72)!important}
.poker-actions,.bj-actions{
  min-height:76px;
  padding:10px 18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  background:#0d100e!important;
  border-top:1px solid var(--ky-line)!important;
}
.poker-actions .btn,.bj-actions .btn{min-width:120px}

/* Machine a sous */
#screen-slots{
  background:
    linear-gradient(90deg,rgba(9,11,10,.86),rgba(9,11,10,.74)),
    var(--ky-hero) center/cover no-repeat!important;
}
.slots-body{
  padding:34px!important;
  align-items:center!important;
  gap:28px!important;
}
.slot-machine{
  width:min(620px,58vw)!important;
  border-radius:9px!important;
  border:1px solid var(--ky-line)!important;
  background:#141815!important;
  box-shadow:0 28px 80px rgba(0,0,0,.4)!important;
}
.slot-window{border-radius:7px!important}
.slot-paytable{width:min(420px,34vw)!important;border-radius:8px!important;background:#141815!important}

/* Fenetres, historique et messages */
.modal{backdrop-filter:blur(8px)}
.modal-box{
  border:1px solid var(--ky-line)!important;
  border-radius:9px!important;
  background:#151815!important;
  box-shadow:0 28px 90px rgba(0,0,0,.55)!important;
}
.histo{background:#111411!important;border-left:1px solid var(--ky-line)!important}
.toast{border-radius:6px!important;background:#f4f1e9!important;color:#121411!important}
.veil{background:rgba(8,10,9,.92)!important}

/* Le desktop est prioritaire ; en fenetre etroite, on garde une barre haute. */
@media(max-width:1080px){
  .app-nav{display:none!important}
  .hub-body{height:auto;grid-template-columns:1fr!important;grid-template-areas:'deck' 'progress' 'quick'!important;grid-template-rows:auto!important}
  .game-shelf{grid-template-columns:repeat(2,minmax(220px,1fr))!important}
  .game-card{min-height:340px!important}
  .casino-layout{height:auto;grid-template-columns:1fr!important}
  #screen-casino .cas-rail{border-right:0!important;border-bottom:1px solid var(--ky-line)!important}
  .lounge-games{flex-direction:row!important;overflow-x:auto!important}
  #screen-casino .cnav{min-width:170px!important}
  .prof-body{height:auto!important}
  .vest-grid{grid-template-columns:repeat(3,minmax(150px,1fr))!important}
}

@media(max-width:720px){
  #screen-login{padding:18px!important;background-position:62% center!important}
  .home-card.auth-card{width:100%!important;padding:24px!important}
  .hub-body{padding:24px 16px 40px!important}
  .playdeck-head{align-items:flex-start!important;flex-direction:column!important}
  .playdeck-title{font-size:36px!important}
  .game-shelf{grid-template-columns:1fr!important}
  .game-card{min-height:330px!important}
  .hp-card,.quick-card{display:flex!important;flex-direction:column!important;align-items:stretch!important}
  .play-panel{grid-template-columns:1fr!important}
  .friend-actions,.stake-pills{grid-template-columns:1fr!important}
  .prof-card,.parc-intro,.cpt-grid{grid-template-columns:1fr!important}
  .vest-grid{grid-template-columns:repeat(2,minmax(130px,1fr))!important}
}

/* 1.6.7 - compte compact en bas de la navigation */
.account-menu{display:none}
.me-chevron{margin-left:auto;color:var(--ky-muted);font-size:17px;line-height:1}

@media(min-width:1081px){
  #screen-hub .hub-actions{
    position:relative;
    margin-top:auto!important;
    gap:0!important;
  }
  #screen-hub .hub-actions>#hub-wallet,
  #screen-hub .hub-actions>#cas-rank,
  #screen-hub .hub-actions>#ver-chip,
  #screen-hub .hub-actions>#btn-update,
  #screen-hub .hub-actions>#btn-admin,
  #screen-hub .hub-actions>#btn-logout{
    display:none!important;
  }
  #hub-profil{
    width:calc(100% + 36px)!important;
    height:78px!important;
    min-height:78px!important;
    margin:0 -18px -20px!important;
    padding:11px 17px!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    border:0!important;
    border-top:1px solid var(--ky-line)!important;
    border-radius:0!important;
    background:#0d0f0e!important;
    color:var(--ky-text)!important;
    cursor:pointer;
  }
  #hub-profil:hover,#hub-profil[aria-expanded="true"]{background:#171a18!important}
  #hub-profil .av{flex:0 0 auto}
  #hub-profil .me-txt{flex:1;min-width:0;text-align:left}
  #hub-profil .me-txt b{font-size:13px;line-height:1.3;color:var(--ky-text)}
  #hub-profil .me-txt i{
    display:inline-flex!important;
    width:max-content;
    max-width:100%;
    margin-top:5px;
    padding:3px 8px;
    border-radius:999px;
    background:rgba(241,199,91,.12);
    color:#efd484;
    font-size:9px;
    font-style:normal;
    line-height:1.2;
  }
  #hub-profil[aria-expanded="true"] .me-chevron{transform:rotate(180deg)}

  .account-menu{
    position:absolute;
    left:12px;
    bottom:91px;
    z-index:80;
    width:286px;
    padding:10px;
    display:block;
    visibility:hidden;
    opacity:0;
    transform:translateY(8px);
    pointer-events:none;
    border:1px solid rgba(255,255,255,.11);
    border-radius:8px;
    background:#1a191d;
    box-shadow:0 24px 70px rgba(0,0,0,.5);
    transition:opacity .16s ease,transform .16s ease,visibility .16s;
  }
  .account-menu.open{
    visibility:visible;
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
  }
  .account-menu::after{
    content:'';
    position:absolute;
    left:27px;
    bottom:-6px;
    width:11px;
    height:11px;
    border-right:1px solid rgba(255,255,255,.11);
    border-bottom:1px solid rgba(255,255,255,.11);
    background:#1a191d;
    transform:rotate(45deg);
  }
  .account-menu-head{
    min-height:58px;
    padding:8px 8px 12px;
    display:flex;
    align-items:center;
    gap:10px;
    border-bottom:1px solid rgba(255,255,255,.09);
  }
  .account-menu-head>span:not(.av){min-width:0}
  .account-menu-head b,.account-menu-head i{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .account-menu-head b{color:#fff;font-size:13px}
  .account-menu-head i{margin-top:4px;color:#918e98;font-size:10px;font-style:normal}
  .account-menu-actions{padding:7px 0}
  .account-menu button{
    width:100%;
    min-height:42px;
    padding:0 9px;
    display:grid;
    grid-template-columns:26px minmax(0,1fr) auto;
    align-items:center;
    gap:7px;
    border:0;
    border-radius:5px;
    background:transparent;
    color:#dedbe3;
    text-align:left;
    cursor:pointer;
  }
  .account-menu button:hover{background:rgba(255,255,255,.065);color:#fff}
  .account-menu button>span:nth-child(2){font-size:12px;font-weight:600}
  .account-menu button small{color:#87848e;font-size:9px;white-space:nowrap}
  .account-icon{
    width:22px;
    height:22px;
    display:grid;
    place-items:center;
    border:1px solid #77737f;
    border-radius:50%;
    color:#aaa6b2;
    font-size:8px;
    font-weight:800;
  }
  .account-menu .account-update{color:#f1c75b}
  .account-menu .account-update .account-icon{border-color:#a98d45;color:#f1c75b}
  .account-menu-foot{
    padding-top:7px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:4px;
    border-top:1px solid rgba(255,255,255,.09);
  }
  .account-menu-foot button{color:#f07c89}
  .account-menu-foot button .account-icon{border-color:#a0525b;color:#f07c89}
  .account-menu-foot>small{padding-right:9px;color:#6f6c75;font-size:9px}
}

@media(max-width:1080px){
  .account-menu.open{
    position:fixed;
    top:76px;
    right:14px;
    z-index:80;
    width:min(286px,calc(100vw - 28px));
    padding:10px;
    display:block;
    border:1px solid rgba(255,255,255,.11);
    border-radius:8px;
    background:#1a191d;
    box-shadow:0 24px 70px rgba(0,0,0,.5);
  }
}

/* 1.6.8 - pages de jeu compactes et textes toujours lisibles */
.quick-card{
  grid-template-columns:44px minmax(0,1fr)!important;
  grid-template-areas:
    "quick-icon quick-copy"
    "quick-form quick-form"!important;
  align-items:center!important;
  gap:9px 13px!important;
  min-height:132px!important;
}
.quick-card .qc-ico{grid-area:quick-icon!important}
.quick-card .qc-mid{grid-area:quick-copy!important;min-width:0!important}
.quick-card .qc-title,
.quick-card .qc-sub{
  max-width:100%!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}
.quick-card .qc-title{line-height:1.25!important}
.quick-card .qc-sub{margin-top:3px;line-height:1.35!important}
.quick-card .qc-row{
  grid-area:quick-form!important;
  width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:8px!important;
}
.quick-card .qc-row input{width:100%!important;min-width:0!important}
.quick-card .qc-row .btn{min-width:108px!important;padding-inline:14px!important}

/* Une seule navigation secondaire, réservée au choix du jeu. */
#screen-casino .casino-layout{
  grid-template-columns:188px minmax(0,1fr)!important;
}
#screen-casino .cas-rail{
  padding:26px 12px 18px!important;
  gap:14px!important;
}
#screen-casino .cas-nav{gap:11px!important}
.lounge-label{
  padding:0 10px;
  color:#777d78;
  font-size:9px;
  line-height:1.2;
  font-weight:800;
  text-transform:uppercase;
}
#screen-casino .lounge-games{gap:2px!important}
#screen-casino .cnav{
  min-height:62px!important;
  grid-template-columns:30px minmax(0,1fr)!important;
  padding:9px 10px!important;
  overflow:hidden;
}
#screen-casino .cnav-emo{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb,var(--game) 40%,transparent);
  border-radius:50%;
  font-size:9px!important;
}
#screen-casino .cnav-txt,
#screen-casino .cnav-mood{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#screen-casino .cnav-txt{font-size:12px!important}
#screen-casino .cnav-mood{font-size:9px!important}

#screen-casino .cas-main{
  padding:24px 30px 56px!important;
  scroll-padding-top:24px;
  background:
    linear-gradient(90deg,rgba(10,12,11,.97),rgba(10,12,11,.92)),
    var(--ky-hero) center/cover fixed no-repeat!important;
}
#screen-casino .cas-head{margin:0 0 22px!important}
#screen-casino .cas-hero-card{
  min-height:170px!important;
  padding:22px 24px!important;
  grid-template-columns:44px minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:15px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:7px!important;
  overflow:hidden;
}
#screen-casino .cas-hero-card::before{
  background:
    linear-gradient(90deg,rgba(5,7,6,.94) 0%,rgba(5,7,6,.76) 48%,rgba(5,7,6,.2) 100%),
    linear-gradient(0deg,rgba(5,7,6,.72),transparent 70%),
    var(--photo) center 48%/cover no-repeat!important;
}
#screen-casino .cas-hero-card .cas-hero-emoji{
  position:static!important;
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  align-self:end!important;
  border:1px solid color-mix(in srgb,var(--game) 55%,transparent)!important;
  border-radius:50%!important;
  background:rgba(7,9,8,.56)!important;
  color:var(--game)!important;
  font-size:10px!important;
  font-weight:900;
}
#screen-casino .cas-head-left{min-width:0}
#screen-casino .cas-overline{
  margin-bottom:6px;
  color:var(--game);
  font-size:9px;
  font-weight:900;
  line-height:1.2;
  text-transform:uppercase;
}
#screen-casino .cas-game-title{
  max-width:100%!important;
  color:#f4f1e9!important;
  font-size:42px!important;
  line-height:1!important;
  letter-spacing:0!important;
  overflow-wrap:anywhere;
}
#screen-casino .cas-game-desc{
  max-width:620px!important;
  margin-top:7px!important;
  color:#c4c7c2!important;
  font-size:13px!important;
  line-height:1.4!important;
}
#screen-casino .cas-hero-mode{align-self:end!important}
#screen-casino .cas-modes{
  padding:3px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:6px!important;
  background:rgba(7,9,8,.72)!important;
}
#screen-casino .cmode{
  min-width:88px;
  padding:9px 12px!important;
  border-radius:4px!important;
  font-size:10px!important;
}
#screen-casino .cmode.on{background:#f2eee5!important;color:#111411!important}

#screen-casino .game-room-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 292px!important;
  align-items:start!important;
  gap:30px!important;
}
#screen-casino .play-main{min-width:0}
#screen-casino .section-title{
  min-height:45px;
  margin:0 0 13px!important;
  padding:0 0 12px!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:16px!important;
  border-bottom:1px solid var(--ky-line);
}
#screen-casino .section-title span{
  flex:0 0 auto;
  color:#f4f1e9!important;
  font-size:18px!important;
  line-height:1.2!important;
}
#screen-casino .section-title small{
  min-width:0;
  max-width:520px;
  color:#9ca19c!important;
  font-size:11px!important;
  line-height:1.35!important;
  text-align:right!important;
  overflow-wrap:anywhere;
}
#screen-casino .section-title.compact{margin-top:26px!important}

#screen-casino .friend-actions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:10px!important;
}
#screen-casino .party-card{
  min-width:0!important;
  min-height:150px!important;
  padding:18px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:5px!important;
  border:1px solid var(--ky-line)!important;
  border-radius:6px!important;
  background:#151916!important;
  box-shadow:none!important;
  overflow:hidden;
}
#screen-casino .party-card:hover{background:#1a1f1b!important;transform:none!important}
#screen-casino .create-party{
  border-top:3px solid var(--game)!important;
  background:
    linear-gradient(120deg,color-mix(in srgb,var(--game) 11%,transparent),transparent 55%),
    #151916!important;
}
#screen-casino .party-kicker{
  color:var(--game,#a7ada8)!important;
  font-size:9px!important;
  line-height:1.2;
  font-weight:900;
  text-transform:uppercase;
}
#screen-casino .party-card b{
  max-width:100%;
  color:#f4f1e9!important;
  font-size:19px!important;
  line-height:1.15!important;
  overflow-wrap:anywhere;
}
#screen-casino .party-card small{
  max-width:100%;
  color:#969c97!important;
  font-size:10px!important;
  line-height:1.35!important;
  overflow-wrap:anywhere;
}
#screen-casino .party-cta{
  margin-top:auto;
  color:#f4f1e9;
  font-size:11px;
  font-weight:900;
}
#screen-casino .join-party .cas-join{
  width:100%;
  min-width:0;
  margin-top:auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:7px!important;
}
#screen-casino .join-party input{
  width:100%!important;
  min-width:0!important;
  height:40px!important;
  padding:0 10px!important;
  border-radius:4px!important;
  letter-spacing:0!important;
}
#screen-casino .join-party .btn{
  min-width:96px!important;
  height:40px!important;
  padding:0 12px!important;
  border-radius:4px!important;
  font-size:10px!important;
}

#screen-casino .stake-pills{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:7px!important;
}
#screen-casino .stake-pills .stk{
  min-width:0!important;
  min-height:76px!important;
  padding:9px 6px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  border:1px solid var(--ky-line)!important;
  border-radius:5px!important;
  background:#151916!important;
  box-shadow:none!important;
}
#screen-casino .stake-pills .stk:hover:not(:disabled){background:#1d221e!important}
#screen-casino .stake-pills .stk.on{
  border-color:#f1c75b!important;
  background:#f1c75b!important;
  color:#151713!important;
  box-shadow:none!important;
}
#screen-casino .stk-emo{font-size:12px!important}
#screen-casino .stk-name{
  max-width:100%;
  font-size:10px!important;
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#screen-casino .stk-amt{
  max-width:100%;
  color:#9aa09a;
  font-size:8px!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#screen-casino .stk.on .stk-amt{color:#514719!important}

#screen-casino .play-side{
  min-width:0;
  padding-left:22px;
  display:flex!important;
  flex-direction:column!important;
  gap:22px!important;
  border-left:1px solid var(--ky-line);
}
#screen-casino .room-aside-intro{
  padding:3px 0 0;
  background:transparent!important;
}
#screen-casino .room-aside-kicker{
  display:block;
  margin-bottom:7px;
  color:var(--game,#d0ae57);
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
}
#screen-casino .room-aside-intro b{
  display:block;
  color:#f4f1e9;
  font-size:17px;
  line-height:1.2;
}
#screen-casino .room-aside-intro p{
  margin:7px 0 0;
  color:#969c97;
  font-size:11px;
  line-height:1.5;
}
#screen-casino .cas-rules{
  overflow:visible!important;
  border:0!important;
  border-top:1px solid var(--ky-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
#screen-casino .cr-title{
  padding:14px 0 9px!important;
  color:#c7cbc7!important;
  font-size:9px!important;
  font-weight:900!important;
}
#screen-casino .cr-grid{padding:0!important}
#screen-casino .cr-row{
  min-width:0;
  padding:9px 0!important;
  display:grid!important;
  grid-template-columns:minmax(0,38%) minmax(0,62%)!important;
  gap:10px!important;
  border-bottom:1px solid rgba(255,255,255,.055)!important;
  font-size:9px!important;
  line-height:1.35!important;
}
#screen-casino .cr-row span,
#screen-casino .cr-row b{
  min-width:0;
  overflow-wrap:anywhere;
}
#screen-casino .cr-row span{color:#8e948f!important}
#screen-casino .cr-row b{color:#d9ddd9!important;text-align:right!important}

/* Les tables publiques se lisent comme une liste, sans empilement de cartes. */
#screen-casino .table-grid{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  overflow:visible!important;
  border-top:1px solid var(--ky-line)!important;
  border-radius:0!important;
  background:transparent!important;
}
#screen-casino .table-card{
  min-width:0!important;
  min-height:76px!important;
  padding:12px 4px!important;
  display:grid!important;
  grid-template-columns:90px minmax(150px,1fr) 140px 145px!important;
  align-items:center!important;
  gap:12px!important;
  border:0!important;
  border-bottom:1px solid var(--ky-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:left!important;
}
#screen-casino .table-card:hover{padding-left:10px!important;background:#151916!important;transform:none!important}
#screen-casino .table-tier{font-size:9px!important}
#screen-casino .table-name{margin:0!important;font-size:17px!important;line-height:1.2!important}
#screen-casino .table-meta{font-size:10px!important}
#screen-casino .table-foot{margin:0!important;display:flex!important;justify-content:space-between!important;gap:8px!important}
#screen-casino .table-foot b{font-size:10px!important}
#screen-casino .table-foot i{font-size:10px!important;white-space:nowrap}

#screen-casino .slot-tier-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;
  gap:8px!important;
}
#screen-casino .slot-tier-card{
  min-width:0!important;
  min-height:128px!important;
  padding:15px 10px!important;
  border:1px solid var(--ky-line)!important;
  border-radius:6px!important;
  background:#151916!important;
  box-shadow:none!important;
}
#screen-casino .slot-tier-card:hover{background:#1a1f1b!important;transform:none!important}
#screen-casino .slot-tier-emo{font-size:15px!important}
#screen-casino .slot-tier-card b{font-size:15px!important}
#screen-casino .slot-tier-card span,
#screen-casino .slot-tier-card i{font-size:9px!important}

@media(max-width:1450px){
  #screen-casino .game-room-layout{grid-template-columns:1fr!important}
  #screen-casino .play-side{
    padding:20px 0 0!important;
    display:grid!important;
    grid-template-columns:minmax(190px,.7fr) minmax(0,1.3fr)!important;
    gap:24px!important;
    border-left:0!important;
    border-top:1px solid var(--ky-line)!important;
  }
  #screen-casino .cas-rules{border-top:0!important}
  #screen-casino .cr-title{padding-top:3px!important}
}

@media(max-width:1180px){
  #screen-casino .cas-main{padding-inline:20px!important}
  #screen-casino .table-card{grid-template-columns:78px minmax(135px,1fr) 120px 125px!important}
  #screen-casino .stake-pills{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:1080px){
  #screen-casino .casino-layout{grid-template-columns:1fr!important;height:auto!important}
  #screen-casino .cas-rail{padding:12px 16px!important}
  #screen-casino .cas-nav{gap:7px!important}
  #screen-casino .lounge-games{flex-direction:row!important;overflow-x:auto!important}
  #screen-casino .cnav{min-width:160px!important}
  #screen-casino .cas-main{overflow:visible!important}
}

@media(max-width:760px){
  .quick-card .qc-row{grid-template-columns:1fr!important}
  .quick-card .qc-row .btn{width:100%!important}
  #screen-casino .cas-hero-card{
    grid-template-columns:36px minmax(0,1fr)!important;
    min-height:190px!important;
  }
  #screen-casino .cas-hero-card .cas-hero-emoji{width:34px!important;height:34px!important}
  #screen-casino .cas-game-title{font-size:34px!important}
  #screen-casino .cas-hero-mode{grid-column:1/-1!important;width:100%}
  #screen-casino .cas-modes{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%}
  #screen-casino .friend-actions,
  #screen-casino .play-side{grid-template-columns:1fr!important}
  #screen-casino .stake-pills{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #screen-casino .section-title{align-items:flex-start!important;flex-direction:column!important;gap:5px!important}
  #screen-casino .section-title small{text-align:left!important}
  #screen-casino .table-card{
    grid-template-columns:68px minmax(0,1fr)!important;
    gap:7px 10px!important;
  }
  #screen-casino .table-meta{grid-column:2}
  #screen-casino .table-foot{grid-column:1/-1}
}

/* 1.6.9 - reconstruction complete de l'ecran d'un jeu */
#screen-casino{
  overflow:hidden!important;
  background:#0b0e0c!important;
}
#screen-casino .casino-layout{
  width:100%!important;
  height:100vh!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:82px minmax(0,1fr)!important;
  overflow:hidden!important;
  background:#0b0e0c!important;
}
@media(min-width:1081px){
  #screen-casino .casino-layout{
    width:calc(100% - var(--ky-rail))!important;
    margin-left:var(--ky-rail)!important;
  }
}

/* Barre de jeux horizontale : elle remplace entierement la seconde colonne. */
#screen-casino .cas-rail{
  min-width:0!important;
  min-height:82px!important;
  height:82px!important;
  padding:11px 24px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:18px!important;
  overflow:hidden!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  background:#0f1310!important;
}
#screen-casino .cas-rail>.rail-title,
#screen-casino .cas-ladder{display:none!important}
#screen-casino .cas-nav{
  flex:1 1 auto!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:18px!important;
}
#screen-casino .gamebar-title{
  flex:0 0 124px;
  min-width:0;
  padding-right:18px;
  border-right:1px solid rgba(255,255,255,.08);
}
#screen-casino .gamebar-title b,
#screen-casino .gamebar-title span{display:block}
#screen-casino .gamebar-title b{
  color:#f3f0e8;
  font-size:12px;
  line-height:1.2;
}
#screen-casino .gamebar-title span{
  margin-top:4px;
  color:#747a75;
  font-size:9px;
}
#screen-casino .lounge-games{
  min-width:0!important;
  display:flex!important;
  flex:1 1 auto!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:4px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none;
}
#screen-casino .lounge-games::-webkit-scrollbar{display:none}
#screen-casino .cnav{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:144px!important;
  min-height:56px!important;
  padding:8px 11px!important;
  display:grid!important;
  grid-template-columns:28px minmax(86px,1fr)!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  gap:1px 8px!important;
  border:1px solid transparent!important;
  border-radius:5px!important;
  background:transparent!important;
  overflow:hidden!important;
}
#screen-casino .cnav:hover{background:#171c18!important}
#screen-casino .cnav.on{
  border-color:color-mix(in srgb,var(--game) 38%,transparent)!important;
  background:color-mix(in srgb,var(--game) 9%,#171c18)!important;
}
#screen-casino .cnav.on::after{display:none!important}
#screen-casino .cnav-emo{
  grid-row:1/3!important;
  width:26px!important;
  height:26px!important;
  border:0!important;
  border-radius:4px!important;
  background:color-mix(in srgb,var(--game) 14%,transparent)!important;
  color:var(--game)!important;
  font-size:9px!important;
}
#screen-casino .cnav-txt{
  color:#f1eee7!important;
  font-size:11px!important;
  line-height:1.2!important;
}
#screen-casino .cnav-mood{
  color:#838984!important;
  font-size:8px!important;
  line-height:1.2!important;
}

/* Le bonus reste dans la barre, sans descendre sous l'ecran. */
#screen-casino .cas-grants{
  flex:0 1 300px!important;
  min-width:0!important;
  max-width:300px!important;
  margin:0!important;
  display:flex!important;
  flex-direction:row!important;
  gap:6px!important;
  overflow:hidden!important;
}
#screen-casino .cas-grants:empty{display:none!important}
#screen-casino .grant{
  flex:1 1 auto!important;
  min-width:0!important;
  min-height:54px!important;
  height:54px!important;
  margin:0!important;
  padding:8px 10px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:8px!important;
  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:5px!important;
  background:#171c18!important;
  overflow:hidden!important;
}
#screen-casino .grant-ico{display:none!important}
#screen-casino .grant-txt{min-width:0!important}
#screen-casino .grant-txt b,
#screen-casino .grant-txt span{
  display:block!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#screen-casino .grant-txt b{color:#eeeae1!important;font-size:9px!important}
#screen-casino .grant-txt span{margin-top:3px;color:#8d938e!important;font-size:8px!important}
#screen-casino .grant .btn{
  width:auto!important;
  min-width:76px!important;
  padding:7px 9px!important;
  border-radius:4px!important;
  font-size:8px!important;
}

/* Zone principale pleine largeur. */
#screen-casino .cas-main{
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  padding:22px 28px 52px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  background:#0b0e0c!important;
}
#screen-casino .cas-head,
#screen-casino .cas-panel{
  width:min(1500px,100%)!important;
  margin-inline:auto!important;
}
#screen-casino .cas-head{margin-bottom:24px!important}
#screen-casino .cas-hero-card{
  width:100%!important;
  min-height:210px!important;
  padding:30px 34px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:26px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:7px!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
#screen-casino .cas-hero-card::before{
  background:
    linear-gradient(90deg,rgba(5,7,6,.94) 0%,rgba(5,7,6,.72) 45%,rgba(5,7,6,.18) 100%),
    linear-gradient(0deg,rgba(5,7,6,.74),transparent 76%),
    var(--photo) center/cover no-repeat!important;
}
#screen-casino .cas-head-left{min-width:0!important}
#screen-casino .cas-overline{
  margin:0 0 9px!important;
  color:var(--game)!important;
  font-size:9px!important;
  font-weight:900!important;
  line-height:1.2!important;
  text-transform:uppercase!important;
}
#screen-casino .cas-game-title{
  max-width:100%!important;
  color:#f7f4ec!important;
  font-size:52px!important;
  line-height:.96!important;
  letter-spacing:0!important;
  overflow-wrap:anywhere!important;
}
#screen-casino .cas-game-desc{
  max-width:620px!important;
  margin-top:10px!important;
  color:#c8ccc8!important;
  font-size:14px!important;
  line-height:1.45!important;
}
#screen-casino .cas-hero-mode{align-self:end!important}
#screen-casino .cas-modes{
  padding:4px!important;
  display:flex!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:5px!important;
  background:rgba(8,10,9,.82)!important;
}
#screen-casino .cmode{
  min-width:116px!important;
  min-height:42px!important;
  padding:0 14px!important;
  border-radius:3px!important;
  color:#9da29d!important;
  font-size:9px!important;
}
#screen-casino .cmode.on{background:#f2eee5!important;color:#111411!important}

/* Composition commune aux cinq jeux. */
#screen-casino .game-room-layout{
  width:100%!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:28px!important;
}
#screen-casino .play-main{width:100%!important;min-width:0!important}
#screen-casino .section-title{
  min-height:56px!important;
  margin:0 0 16px!important;
  padding:0 0 14px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:20px!important;
  border-bottom:1px solid rgba(255,255,255,.09)!important;
}
#screen-casino .section-title>div{min-width:0!important}
#screen-casino .section-title span,
#screen-casino .section-title small{display:block!important;text-align:left!important}
#screen-casino .section-title span{
  color:#f4f1e9!important;
  font-size:20px!important;
  line-height:1.2!important;
}
#screen-casino .section-title small{
  max-width:700px!important;
  margin-top:5px!important;
  color:#858b86!important;
  font-size:10px!important;
  line-height:1.4!important;
  overflow-wrap:anywhere!important;
}
#screen-casino .section-title.compact{
  min-height:0!important;
  margin-top:28px!important;
  padding-bottom:11px!important;
}
#screen-casino .room-status{
  flex:0 0 auto;
  padding:6px 9px;
  border-radius:4px;
  background:rgba(69,191,125,.1);
  color:#55c98a;
  font-size:8px;
  line-height:1;
  text-transform:uppercase;
}
#screen-casino .room-status.private{background:rgba(232,191,87,.1);color:#e8bf57}
#screen-casino .room-status.solo{background:rgba(240,93,143,.1);color:#f05d8f}

/* Tables publiques : cartes coherentes et entierement cliquables. */
#screen-casino .table-grid{
  width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:9px!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#screen-casino .table-card{
  min-width:0!important;
  min-height:160px!important;
  padding:16px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:8px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-top:3px solid var(--tc)!important;
  border-radius:6px!important;
  background:#151916!important;
  box-shadow:none!important;
  color:#f3f0e8!important;
  text-align:left!important;
  overflow:hidden!important;
}
#screen-casino .table-card:hover{
  padding:16px!important;
  border-color:color-mix(in srgb,var(--tc) 55%,rgba(255,255,255,.09))!important;
  border-top-color:var(--tc)!important;
  background:#1a1f1b!important;
  transform:translateY(-2px)!important;
}
#screen-casino .table-card.dim{opacity:.46!important}
#screen-casino .table-card-top{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
#screen-casino .table-card-top i{
  color:var(--tc);
  font-size:8px;
  font-style:normal;
  font-weight:900;
  text-transform:uppercase;
}
#screen-casino .table-card-top b{color:#7f8580;font-size:8px;font-weight:700}
#screen-casino .table-card strong{
  max-width:100%;
  color:#f6f2e9;
  font-size:20px;
  line-height:1.15;
  overflow-wrap:anywhere;
}
#screen-casino .table-buyin{
  color:#858b86;
  font-size:9px;
  line-height:1.3;
}
#screen-casino .table-buyin b{color:#c7cbc7;font-size:inherit}
#screen-casino .table-action{
  width:100%;
  margin-top:auto;
  padding-top:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border-top:1px solid rgba(255,255,255,.07);
  color:var(--tc);
  font-size:9px;
  font-weight:900;
}
#screen-casino .table-action i{font-size:14px;font-style:normal}

/* Creer et rejoindre sont les deux seules actions dominantes en prive. */
#screen-casino .friend-actions{
  width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
#screen-casino .party-card{
  min-width:0!important;
  min-height:180px!important;
  padding:22px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:6px!important;
  background:#151916!important;
  box-shadow:none!important;
}
#screen-casino .create-party{
  border-top:3px solid var(--game)!important;
  background:
    linear-gradient(120deg,color-mix(in srgb,var(--game) 11%,transparent),transparent 55%),
    #151916!important;
}
#screen-casino .party-card:hover{background:#1a1f1b!important;transform:translateY(-2px)!important}
#screen-casino .party-kicker{font-size:8px!important}
#screen-casino .party-card b{font-size:22px!important;line-height:1.15!important}
#screen-casino .party-card small{font-size:9px!important;line-height:1.4!important}
#screen-casino .party-cta{
  width:100%;
  margin-top:auto!important;
  padding-top:11px;
  display:flex;
  justify-content:space-between;
  border-top:1px solid rgba(255,255,255,.07);
  font-size:9px!important;
}
#screen-casino .party-cta i{font-size:14px;font-style:normal}
#screen-casino .join-party .cas-join{
  margin-top:auto!important;
  grid-template-columns:minmax(0,1fr) 112px!important;
}
#screen-casino .join-party input,
#screen-casino .join-party .btn{height:44px!important}

#screen-casino .stake-pills{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:7px!important;
}
#screen-casino .stake-pills .stk{
  min-width:0!important;
  min-height:86px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:5px!important;
  background:#151916!important;
}

/* Solo */
#screen-casino .slot-tier-grid{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:9px!important;
}
#screen-casino .slot-tier-card{
  min-width:0!important;
  min-height:170px!important;
  border-top:3px solid var(--tc)!important;
  border-radius:6px!important;
}

/* Informations et regles restent accessibles, sans voler la vedette au jeu. */
#screen-casino .game-footer-info{
  width:100%!important;
  min-width:0!important;
  padding:22px 0 0!important;
  display:grid!important;
  grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr)!important;
  align-items:start!important;
  gap:40px!important;
  border:0!important;
  border-top:1px solid rgba(255,255,255,.09)!important;
}
#screen-casino .room-aside-intro{padding:0!important}
#screen-casino .room-aside-kicker{margin-bottom:6px!important;font-size:8px!important}
#screen-casino .room-aside-intro b{font-size:14px!important}
#screen-casino .room-aside-intro p{max-width:56ch;font-size:9px!important;line-height:1.5!important}
#screen-casino .cas-rules{
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#screen-casino .cas-rules summary{
  min-height:42px;
  padding:0 0 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid rgba(255,255,255,.09);
  color:#e9e6df;
  cursor:pointer;
  list-style:none;
}
#screen-casino .cas-rules summary::-webkit-details-marker{display:none}
#screen-casino .cas-rules summary span{font-size:11px;font-weight:900}
#screen-casino .cas-rules summary small{color:#8b918c;font-size:8px}
#screen-casino .cas-rules summary small::after{content:' +';margin-left:4px;color:#e8bf57}
#screen-casino .cas-rules[open] summary small::after{content:' -'}
#screen-casino .cr-grid{
  padding:10px 0 0!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:0 22px!important;
}
#screen-casino .cr-row{
  padding:9px 0!important;
  grid-template-columns:minmax(0,40%) minmax(0,60%)!important;
  font-size:8px!important;
}

@media(max-width:1500px){
  #screen-casino .cas-grants{flex-basis:230px!important;max-width:230px!important}
  #screen-casino .table-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #screen-casino .slot-tier-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:1180px){
  #screen-casino .casino-layout{grid-template-rows:auto minmax(0,1fr)!important}
  #screen-casino .cas-rail{height:auto!important;min-height:76px!important;padding:10px 16px!important}
  #screen-casino .gamebar-title{display:none!important}
  #screen-casino .cas-grants{display:none!important}
  #screen-casino .cas-main{padding:18px 18px 46px!important}
  #screen-casino .cas-hero-card{min-height:190px!important;padding:24px!important}
  #screen-casino .friend-actions{grid-template-columns:1fr!important}
  #screen-casino .stake-pills{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:760px){
  #screen-casino .casino-layout{height:auto!important;min-height:100vh!important;overflow:visible!important}
  #screen-casino .cas-main{overflow:visible!important}
  #screen-casino .cas-hero-card{grid-template-columns:1fr!important;min-height:240px!important}
  #screen-casino .cas-game-title{font-size:38px!important}
  #screen-casino .cas-hero-mode{width:100%!important}
  #screen-casino .cas-modes{width:100%!important}
  #screen-casino .cmode{flex:1 1 50%!important;min-width:0!important}
  #screen-casino .section-title{align-items:flex-start!important}
  #screen-casino .table-grid,
  #screen-casino .slot-tier-grid,
  #screen-casino .game-footer-info,
  #screen-casino .cr-grid{grid-template-columns:1fr!important}
  #screen-casino .stake-pills{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* 1.6.10 - direction fluide, sans catalogue de cartes */
#screen-casino .casino-layout{
  grid-template-rows:68px minmax(0,1fr)!important;
  background:#0a0d0b!important;
}

/* Navigation typographique, dans la continuite de l'accueil. */
#screen-casino .cas-rail{
  height:68px!important;
  min-height:68px!important;
  padding:0 28px!important;
  gap:22px!important;
  background:#0c100d!important;
}
#screen-casino .cas-nav{gap:22px!important}
#screen-casino .gamebar-title{
  flex-basis:116px!important;
  padding-right:22px!important;
}
#screen-casino .gamebar-title b{font-size:11px!important}
#screen-casino .gamebar-title span{font-size:8px!important}
#screen-casino .lounge-games{
  height:100%!important;
  gap:24px!important;
}
#screen-casino .cnav{
  position:relative!important;
  width:auto!important;
  min-width:96px!important;
  min-height:68px!important;
  padding:0 2px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:4px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#screen-casino .cnav:hover,
#screen-casino .cnav.on{background:transparent!important}
#screen-casino .cnav::before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  background:transparent;
}
#screen-casino .cnav.on::before{background:var(--game)}
#screen-casino .cnav-emo{display:none!important}
#screen-casino .cnav-txt{
  color:#d8dcd8!important;
  font-size:10px!important;
  font-weight:800!important;
}
#screen-casino .cnav.on .cnav-txt{color:#fff!important}
#screen-casino .cnav-mood{color:#69706a!important;font-size:8px!important}

/* La dotation devient une information de barre, pas une carte. */
#screen-casino .cas-grants{
  flex-basis:260px!important;
  max-width:260px!important;
  height:100%!important;
  padding-left:22px;
  border-left:1px solid rgba(255,255,255,.08);
}
#screen-casino .grant{
  height:100%!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#screen-casino .grant-txt b{font-size:9px!important}
#screen-casino .grant-txt span{font-size:8px!important}

/* L'image du jeu est une bande pleine largeur, sans cadre. */
#screen-casino .cas-main{
  padding:0 0 64px!important;
  background:#0a0d0b!important;
}
#screen-casino .cas-head{
  width:100%!important;
  max-width:none!important;
  margin:0 0 38px!important;
}
#screen-casino .cas-panel{
  width:min(1360px,calc(100% - 64px))!important;
  max-width:1360px!important;
}
#screen-casino .cas-hero-card{
  min-height:280px!important;
  padding-block:46px!important;
  padding-inline:max(32px,calc((100% - 1360px)/2))!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
#screen-casino .cas-hero-card::before{
  background:
    linear-gradient(90deg,rgba(4,6,5,.97) 0%,rgba(4,6,5,.78) 42%,rgba(4,6,5,.12) 100%),
    linear-gradient(0deg,rgba(4,6,5,.72),transparent 72%),
    var(--photo) center/cover no-repeat!important;
}
#screen-casino .cas-overline{margin-bottom:12px!important;font-size:8px!important}
#screen-casino .cas-game-title{font-size:58px!important}
#screen-casino .cas-game-desc{font-size:13px!important}
#screen-casino .cas-modes{
  gap:22px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#screen-casino .cmode{
  min-width:0!important;
  min-height:36px!important;
  padding:0 0 7px!important;
  border-bottom:2px solid transparent!important;
  border-radius:0!important;
  background:transparent!important;
  color:#989e99!important;
  font-size:9px!important;
}
#screen-casino .cmode.on{
  border-bottom-color:var(--game)!important;
  background:transparent!important;
  color:#fff!important;
}

#screen-casino .game-room-layout{gap:38px!important}
#screen-casino .section-title{
  min-height:0!important;
  margin-bottom:8px!important;
  padding-bottom:16px!important;
}
#screen-casino .section-title span{font-size:22px!important}
#screen-casino .section-title small{font-size:9px!important}
#screen-casino .room-status{
  position:relative;
  padding:0 0 0 12px!important;
  border-radius:0!important;
  background:transparent!important;
  color:#8f9690!important;
  font-size:8px!important;
}
#screen-casino .room-status::before{
  content:'';
  position:absolute;
  left:0;
  top:50%;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#45bf7d;
  transform:translateY(-50%);
}
#screen-casino .room-status.private,
#screen-casino .room-status.solo{background:transparent!important;color:#8f9690!important}
#screen-casino .room-status.private::before{background:#e8bf57}
#screen-casino .room-status.solo::before{background:#f05d8f}

/* Lobby en lignes : aucune boite, uniquement une grille et des separateurs. */
#screen-casino .table-list-head,
#screen-casino .table-card{
  display:grid!important;
  grid-template-columns:150px minmax(250px,1.35fr) 150px 130px 180px!important;
  align-items:center!important;
  gap:18px!important;
}
#screen-casino .table-list-head{
  min-height:34px;
  padding:0 18px;
  border-bottom:1px solid rgba(255,255,255,.1);
  color:#626963;
  font-size:7px;
  font-weight:800;
  text-transform:uppercase;
}
#screen-casino .table-grid{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
}
#screen-casino .table-card{
  min-height:86px!important;
  padding:0 18px!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.075)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}
#screen-casino .table-card:hover{
  padding:0 18px!important;
  border-color:rgba(255,255,255,.075)!important;
  background:rgba(255,255,255,.035)!important;
  transform:none!important;
}
#screen-casino .table-card.dim{opacity:.42!important}
#screen-casino .table-tier-name{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}
#screen-casino .table-tier-name i,
#screen-casino .slot-tier-name i{
  flex:0 0 auto;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--tc);
}
#screen-casino .table-tier-name b{
  color:var(--tc);
  font-size:8px;
  text-transform:uppercase;
}
#screen-casino .table-card>strong{
  color:#f4f1e9!important;
  font-size:17px!important;
  line-height:1.2!important;
}
#screen-casino .table-buyin,
#screen-casino .table-players{color:#747b75;font-size:9px!important}
#screen-casino .table-buyin b,
#screen-casino .table-players b{color:#c4c9c4;font-size:inherit}
#screen-casino .table-action{
  margin:0!important;
  padding:0!important;
  border:0!important;
  color:#dce0dc!important;
  font-size:9px!important;
}
#screen-casino .table-card:hover .table-action{color:var(--tc)!important}

/* Partie privee : deux grandes lignes d'action, sans cartes. */
#screen-casino .friend-actions{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  border-top:1px solid rgba(255,255,255,.1);
}
#screen-casino .party-card{
  min-height:102px!important;
  padding:16px 18px!important;
  display:grid!important;
  grid-template-columns:120px minmax(220px,1fr) minmax(220px,.8fr) 210px!important;
  grid-template-rows:auto!important;
  align-items:center!important;
  gap:18px!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.075)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#screen-casino .create-party{background:transparent!important}
#screen-casino .party-card:hover{
  background:rgba(255,255,255,.035)!important;
  transform:none!important;
}
#screen-casino .party-kicker{color:var(--game,#e8bf57)!important;font-size:8px!important}
#screen-casino .party-card b{font-size:17px!important}
#screen-casino .party-card small{font-size:9px!important}
#screen-casino .party-cta{
  margin:0!important;
  padding:0!important;
  border:0!important;
  color:#f0ede5!important;
  font-size:9px!important;
}
#screen-casino .join-party .cas-join{
  width:100%!important;
  margin:0!important;
  grid-template-columns:minmax(0,1fr) 96px!important;
}
#screen-casino .join-party input{
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.2)!important;
  border-radius:0!important;
  background:transparent!important;
  color:#fff!important;
}
#screen-casino .join-party .btn{border-radius:3px!important}

/* Les mises sont des choix texte, pas cinq nouvelles cartes. */
#screen-casino .stake-pills{
  display:flex!important;
  align-items:stretch!important;
  gap:0!important;
  border-top:1px solid rgba(255,255,255,.1);
}
#screen-casino .stake-pills .stk{
  flex:1 1 20%!important;
  min-width:0!important;
  min-height:74px!important;
  padding:10px 12px!important;
  border:0!important;
  border-right:1px solid rgba(255,255,255,.075)!important;
  border-bottom:2px solid transparent!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#screen-casino .stake-pills .stk:last-child{border-right:0!important}
#screen-casino .stake-pills .stk:hover:not(:disabled){background:rgba(255,255,255,.03)!important}
#screen-casino .stake-pills .stk.on{
  border-color:rgba(255,255,255,.075)!important;
  border-bottom-color:#e8bf57!important;
  background:rgba(232,191,87,.045)!important;
  color:#f2eee5!important;
}
#screen-casino .stake-pills .stk.on .stk-amt{color:#9f9680!important}
#screen-casino .stk-emo{display:none!important}

/* Les paliers solo reprennent exactement le langage de la liste. */
#screen-casino .slot-list-head,
#screen-casino .slot-tier-card{
  display:grid!important;
  grid-template-columns:180px minmax(220px,1fr) minmax(220px,1fr) 190px!important;
  align-items:center!important;
  gap:18px!important;
}
#screen-casino .slot-list-head{
  min-height:34px;
  padding:0 18px;
  border-bottom:1px solid rgba(255,255,255,.1);
  color:#626963;
  font-size:7px;
  font-weight:800;
  text-transform:uppercase;
}
#screen-casino .slot-tier-grid{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
}
#screen-casino .slot-tier-card{
  min-height:86px!important;
  padding:0 18px!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.075)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:left!important;
}
#screen-casino .slot-tier-card:hover{background:rgba(255,255,255,.035)!important;transform:none!important}
#screen-casino .slot-tier-name{display:flex!important;align-items:center!important;gap:10px!important}
#screen-casino .slot-tier-name b{color:var(--tc)!important;font-size:9px!important}
#screen-casino .slot-tier-card strong{color:#f4f1e9;font-size:16px}
#screen-casino .slot-tier-card span,
#screen-casino .slot-tier-card>i{color:#818782!important;font-size:9px!important;text-align:left!important}
#screen-casino .slot-tier-card>i{color:var(--tc)!important;font-style:normal!important;text-align:right!important}

#screen-casino .game-footer-info{
  padding-top:28px!important;
  gap:56px!important;
  background:transparent!important;
}

@media(max-width:1320px){
  #screen-casino .table-list-head,
  #screen-casino .table-card{
    grid-template-columns:120px minmax(190px,1fr) 120px 100px 150px!important;
    gap:12px!important;
  }
  #screen-casino .party-card{
    grid-template-columns:100px minmax(180px,1fr) minmax(180px,.8fr) 190px!important;
    gap:12px!important;
  }
}

@media(max-width:900px){
  #screen-casino .cas-panel{width:min(calc(100% - 32px),1360px)!important}
  #screen-casino .table-list-head,
  #screen-casino .slot-list-head{display:none!important}
  #screen-casino .table-card{
    min-height:110px!important;
    padding:14px 4px!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px 16px!important;
  }
  #screen-casino .table-card>strong{grid-column:1}
  #screen-casino .table-buyin{grid-column:1}
  #screen-casino .table-players{grid-column:2;grid-row:1}
  #screen-casino .table-action{grid-column:2;grid-row:2/4}
  #screen-casino .party-card{
    grid-template-columns:1fr!important;
    gap:6px!important;
  }
  #screen-casino .stake-pills{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #screen-casino .slot-tier-card{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px 16px!important;
  }
  #screen-casino .slot-tier-card>i{text-align:right!important}
}
/* 1.6.11 - commandes de règlement et enchères MAGNAT */
.chess-draw-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.chess-draw-actions .btn{width:100%;padding:9px 8px;font-size:12px}
.auction-bar{position:fixed;left:50%;bottom:20px;z-index:70;display:none;align-items:center;justify-content:space-between;gap:24px;width:min(760px,calc(100vw - 32px));padding:14px 16px;background:#151915;border:1px solid #394139;box-shadow:0 16px 48px rgba(0,0,0,.45);transform:translateX(-50%)}
.auction-bar.show{display:flex}
.auction-copy,.auction-controls{display:flex;align-items:center;gap:10px;min-width:0}
.auction-copy b,.auction-copy small{display:block}.auction-copy small{margin-top:3px;color:#aaa497;font-size:12px}
.auction-hammer{font-size:24px}.auction-controls input{width:130px;padding:10px 12px;border:1px solid #4a504a;background:#0c0f0c;color:#f4f0e7;font:inherit}
.auction-leading{color:#f4cf66;font-weight:750;font-size:13px}
@media(max-width:700px){.auction-bar{align-items:stretch;flex-direction:column;gap:10px}.auction-controls{flex-wrap:wrap}.auction-controls input{flex:1}}

/* 1.6.12 - MAGNAT responsive et jeux classiques */
@media(max-width:1180px){
  #screen-game{overflow:auto!important}
  #screen-game .game-main{grid-template-columns:minmax(0,1fr)!important;overflow:visible!important}
  #screen-game .board-wrap{width:min(calc(100vw - 36px),calc(100vh - 100px),760px)!important}
  #screen-game .sidebar{width:min(760px,100%)!important;margin:0 auto!important}
}

#screen-classic{background:#0d110f;color:#f5f2ea}
#screen-classic>.topbar{min-height:64px;padding:10px 20px;background:#0a0d0b;border-bottom:1px solid rgba(255,255,255,.1)}
#screen-classic>.topbar .logo{min-width:180px;color:#f5f2ea;font-size:20px}
.classic-main{height:calc(100vh - 64px);display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;padding:20px 24px;overflow:hidden}
.classic-stage{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.classic-heading{width:min(760px,100%);display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:14px}
.classic-heading h1{margin:3px 0 0;font-size:30px;line-height:1.05;letter-spacing:0}
.classic-heading>div>span{color:#8e9891;font-size:10px;font-weight:800;text-transform:uppercase}
.classic-score{display:flex;align-items:center;gap:9px;color:#aeb6b0;font-size:12px}.classic-score b{color:#fff;font-size:20px}.classic-score i{font-style:normal;color:#59615b}
.classic-board{--rows:8;--cols:8;width:min(72vh,calc(100vw - 400px),760px);aspect-ratio:var(--cols)/var(--rows);display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);overflow:hidden;background:#161b18;border:1px solid rgba(255,255,255,.13);box-shadow:0 30px 80px rgba(0,0,0,.42)}
.classic-cell{position:relative;min-width:0;min-height:0;display:grid;place-items:center;padding:0;border:0;border-right:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);border-radius:0;background:#1b211d;color:inherit;cursor:default}
.classic-cell:disabled{opacity:1}.classic-cell.legal{cursor:pointer}.classic-cell.legal::after{content:"";position:absolute;width:18%;aspect-ratio:1;border-radius:50%;background:#62d698;box-shadow:0 0 0 5px rgba(98,214,152,.12)}
.classic-cell.last{box-shadow:inset 0 0 0 3px #e7c75c}.classic-cell.selected{box-shadow:inset 0 0 0 4px #62d698}
.classic-side{min-height:0;display:flex;flex-direction:column;gap:10px;overflow:auto;padding-right:3px}
.classic-panel{padding:15px 16px;background:#151a17;border-top:1px solid rgba(255,255,255,.12)}
.classic-panel h2{margin:0 0 12px;color:#8f9992;font-size:10px;text-transform:uppercase;letter-spacing:0}
.classic-player{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.classic-player:last-child{border-bottom:0}.classic-player.active{color:#f3ce62}.classic-player>span:nth-child(2){min-width:0}.classic-player b,.classic-player small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.classic-player b{font-size:13px}.classic-player small{margin-top:3px;color:#858e88;font-size:10px}
.classic-token{width:38px;height:38px;display:grid;place-items:center}.classic-token .stone,.classic-token .connect-disc,.classic-token .draught{width:28px;height:28px}.classic-token .tt-mark{font-size:24px}
#classic-status{color:#cbd0cc;font-size:12px;line-height:1.5}.classic-panel #classic-resign{width:100%;margin-top:8px}
.classic-draw-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.classic-draw-actions .btn{width:100%;padding:8px 6px;font-size:11px}.classic-draw-actions #classic-draw-offer{grid-column:1/-1}
.classic-rules>div>div{display:grid;grid-template-columns:20px 1fr;gap:8px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.07);color:#aeb5b0;font-size:11px;line-height:1.45}.classic-rules>div>div:last-child{border-bottom:0}.classic-rules>div b{color:#e7c75c}
.classic-log-panel{min-height:120px}.classic-log-panel p{margin:0;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.06);color:#939c96;font-size:10px;line-height:1.4}

.classic-board.game-tictactoe{width:min(58vh,520px);background:#111713;gap:6px;padding:6px;border:0;box-shadow:none}.classic-board.game-tictactoe .classic-cell{background:#1a221d;border:0}.classic-board.game-tictactoe .classic-cell.legal::after{width:10px}.tt-mark{font-size:clamp(36px,7vh,72px);font-weight:500;line-height:1}.tt-mark.side-1{color:#65d6a0}.tt-mark.side-2{color:#f2c85d}
.classic-board.game-connect4{width:min(78vh,850px);padding:14px;gap:8px;border:0;background:#1760a5;box-shadow:0 28px 70px rgba(0,0,0,.42)}.classic-board.game-connect4 .classic-cell{border:0;border-radius:50%;background:#09100c}.connect-disc{width:78%;aspect-ratio:1;border-radius:50%;box-shadow:inset 0 4px 9px rgba(255,255,255,.18),0 4px 8px rgba(0,0,0,.3)}.connect-disc.side-1{background:#e84f4f}.connect-disc.side-2{background:#f2ce45}.classic-board.game-connect4 .classic-cell.legal::after{width:20%;z-index:2}
.classic-board.game-reversi{background:#176942;border:8px solid #151915}.classic-board.game-reversi .classic-cell{background:transparent;border-color:rgba(0,0,0,.32)}
.stone{width:76%;aspect-ratio:1;border-radius:50%;box-shadow:0 5px 9px rgba(0,0,0,.38),inset 0 2px 4px rgba(255,255,255,.16)}.stone.side-1{background:#101311}.stone.side-2{background:#f0eee7}
.classic-board.game-gomoku{background-color:#d7ad6f;background-image:linear-gradient(rgba(79,51,24,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(79,51,24,.5) 1px,transparent 1px);background-size:calc(100% / 15) calc(100% / 15);border:10px solid #7d5630}.classic-board.game-gomoku .classic-cell{overflow:visible;background:transparent;border:0}.classic-board.game-gomoku .stone{width:76%;z-index:2}.classic-board.game-gomoku .classic-cell.legal::after{width:15%;background:#267d57;box-shadow:none}
.classic-board.game-checkers{background:#d8c9aa;border:8px solid #332b23}.classic-board.game-checkers .classic-cell{border:0}.classic-board.game-checkers .classic-cell.light{background:#d6c7a7}.classic-board.game-checkers .classic-cell.dark{background:#476552}.draught{width:76%;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;box-shadow:inset 0 0 0 4px rgba(255,255,255,.14),0 5px 8px rgba(0,0,0,.35)}.draught.white{background:#f0ece1;border:2px solid #bdb7a9}.draught.black{background:#171a18;border:2px solid #050706}.draught.king{box-shadow:inset 0 0 0 4px #d5b542,0 5px 8px rgba(0,0,0,.4)}.draught i{color:#d5b542;font-size:45%;font-style:normal}.classic-board.game-checkers .classic-cell.legal::after{z-index:3}

@media(max-width:1100px){
  #screen-classic{overflow:auto}.classic-main{height:auto;min-height:calc(100vh - 64px);grid-template-columns:1fr;overflow:visible}.classic-board{width:min(calc(100vw - 48px),720px)}.classic-side{width:min(720px,100%);margin:auto;overflow:visible}.classic-stage{justify-content:flex-start}
}
@media(max-width:600px){.classic-main{padding:16px 12px}.classic-heading h1{font-size:24px}.classic-board.game-connect4{padding:8px;gap:4px}.classic-board{width:calc(100vw - 24px)}.classic-side{width:100%}}

/* =======================================================================
   JEUX DE TABLE SOCIAUX — une table commune, neuf expériences distinctes
   ======================================================================= */
#screen-social{--social-accent:#e8c75d;background:#0b0f0d;color:#f4f1e8;overflow:hidden}
#screen-social.active{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:0}
#screen-social>.topbar{width:100%;min-height:64px;flex:0 0 64px}
.social-topbar{border-bottom:1px solid #242a26;background:#0a0e0c}
.social-main{height:calc(100vh - 64px);display:grid;grid-template-columns:minmax(0,1fr) 340px;overflow:hidden}
.social-stage{min-width:0;overflow:auto;padding:28px 34px 42px;background-color:#0d120f;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:48px 48px}
.social-heading{max-width:1200px;margin:0 auto 20px;display:flex;align-items:end;justify-content:space-between;border-bottom:1px solid #29302b;padding-bottom:16px}
.social-heading span,.social-section-label{color:#9ca69e;font-size:11px;font-weight:800;text-transform:uppercase}.social-heading h1{font-size:36px;margin:4px 0 0;letter-spacing:0}.social-round{color:#d5bd72;font-weight:800}
.social-table{max-width:1200px;min-height:clamp(280px,42vh,400px);margin:auto;display:grid;place-items:center;padding:26px;background:#111713;border:1px solid #29312b;border-radius:6px;overflow:hidden}
.social-hand-wrap{max-width:1200px;margin:18px auto 0;border-top:1px solid #29302b;padding-top:14px}.social-hand{min-height:126px;display:flex;align-items:center;justify-content:center;gap:7px;overflow-x:auto;padding:12px 4px}
.social-side{overflow-y:auto;border-left:1px solid #272e29;background:#0b100d;padding:18px;display:flex;flex-direction:column;gap:10px}
.social-panel{padding:18px 4px;border-bottom:1px solid #29302b}.social-panel h2{font-size:14px;margin:0 0 14px;text-transform:uppercase;color:#b3bcb5}.social-player{min-height:58px;display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:8px;border-left:2px solid transparent}.social-player.active{background:#171e19;border-left-color:#e6c85d}.social-player.out{opacity:.48}.social-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#29322c;font-size:11px;font-weight:900}.social-player b{font-size:14px}.social-player small{display:block;color:#8e9890;margin-top:3px}.social-player em{font-size:11px;color:#c6ad67;font-style:normal}.social-status{color:#c9d0cb;font-size:14px;line-height:1.45;margin-bottom:12px}.social-actions{display:flex;flex-wrap:wrap;gap:8px}.social-actions .btn{flex:1;min-width:120px}.social-fold summary{cursor:pointer;font-size:13px;font-weight:800;color:#b5beb7}.social-fold>div{padding-top:12px}.social-fold>div>div{display:grid;grid-template-columns:22px 1fr;gap:8px;padding:8px 0;border-bottom:1px solid #252c27;color:#aeb7b0;font-size:12px;line-height:1.4}.social-fold>div>div>b{color:#e5c75e}.social-fold p{font-size:12px;color:#9ea8a0;border-bottom:1px solid #242a26;padding:8px 0;margin:0}
.social-card-button{border:0;background:none;padding:0;flex:0 0 auto;transition:transform .16s ease}.social-card-button:not(:disabled):hover{transform:translateY(-8px)}.social-card-button.selected{transform:translateY(-12px)}.social-card-button:disabled{opacity:.52}.social-card{width:72px;aspect-ratio:5/7;display:grid;place-items:center;position:relative;border-radius:6px;background:#f5f1e8;color:#171b18;border:1px solid rgba(0,0,0,.22);box-shadow:0 8px 18px rgba(0,0,0,.28)}.social-card.back{background:repeating-linear-gradient(45deg,#1e4b39 0 7px,#143628 7px 14px);border:5px solid #e8e3d8;color:#fff}.playing-card b{position:absolute;left:7px;top:5px;font-size:18px}.playing-card i{font-size:30px;font-style:normal}.playing-card.red{color:#bd343d}.uno-card{color:#fff;border:6px solid #f5f0e7;overflow:hidden}.uno-card::before{content:'';position:absolute;width:110%;height:56%;background:rgba(255,255,255,.84);border-radius:50%;transform:rotate(-34deg)}.uno-card b{position:relative;color:#fff;text-shadow:0 2px 3px rgba(0,0,0,.6);font-size:25px;z-index:1}.uno-card i{position:absolute;left:4px;top:2px;font-style:normal;font-weight:900;font-size:11px}.uno-card.red{background:#cf3e3d}.uno-card.yellow{background:#e7b82e}.uno-card.green{background:#31945e}.uno-card.blue{background:#347bc0}.uno-card.wild{background:#222a25}.skyjo-card b{font-size:28px}.skyjo-card.v0{background:#b9d3c2}.skyjo-card.vm2,.skyjo-card.vm1{background:#77b7cc}.skyjo-card.v10,.skyjo-card.v11,.skyjo-card.v12{background:#df7769}

/* UNO */
.uno-table{width:min(760px,100%);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:28px}.uno-direction,.uno-color{color:#99a49b;text-align:center}.uno-pile{display:flex;gap:22px}.uno-pile>div{display:grid;gap:7px;text-align:center}.uno-color{display:grid;justify-items:center;gap:7px}.swatch{width:28px;height:28px;border-radius:50%;border:2px solid #e9e4da}.swatch.red{background:#cf3e3d}.swatch.yellow{background:#e7b82e}.swatch.green{background:#31945e}.swatch.blue{background:#347bc0}.social-color-pick{display:flex;gap:12px}.social-color-pick .swatch{width:44px;height:44px}

/* Mastermind */
.master-board{width:min(620px,100%);display:flex;flex-direction:column-reverse;gap:6px}.master-row{display:grid;grid-template-columns:28px 1fr 150px;align-items:center;padding:8px 12px;border-bottom:1px solid #303832}.master-row>div,.master-secret{display:flex;justify-content:center;gap:12px}.master-row i,.master-secret i,.master-draft i{width:27px;height:27px;border-radius:50%;background:var(--peg);box-shadow:inset 0 3px 5px rgba(255,255,255,.2),0 3px 5px #000}.master-row b{font-size:12px;color:#b6c0b8}.master-secret{padding:18px;background:#080b09;border:1px solid #303832}.master-secret.hidden{color:#7e8880;font-weight:900;letter-spacing:2px}.master-empty{text-align:center;color:#77827a;padding:70px}.master-compose{display:grid;gap:16px}.master-draft,.master-palette{display:flex;justify-content:center;gap:10px}.code-peg{width:38px;height:38px;border-radius:50%;border:2px solid #d7d2c8;background:var(--peg)}

/* Dobble */
.dobble-table{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px}.dobble-table>div>small{display:block;text-align:center;margin-bottom:9px;color:#99a39b}.dobble-vs{font-size:14px;font-weight:900;color:#e5c65b}.dobble-card{width:280px;aspect-ratio:1;border-radius:50%;background:#f3efe5;color:#151916;display:grid;grid-template-columns:repeat(3,1fr);place-items:center;padding:28px;box-shadow:0 16px 40px rgba(0,0,0,.35)}.dobble-card button{border:0;background:none;font-weight:900;font-size:clamp(9px,1vw,13px);transform:rotate(var(--r)) scale(var(--z));color:#18201b}.dobble-card button:not(:disabled){color:#18201b;cursor:pointer}.dobble-card button:not(:disabled):hover{color:#b63442;text-decoration:underline}

/* Quoridor */
.quoridor-board{width:min(70vh,680px);aspect-ratio:1;display:grid;grid-template-columns:repeat(9,1fr);gap:6px;position:relative;background:#5b3b26;padding:13px;border:8px solid #332218}.quoridor-cell{background:#d8b987;border:0;position:relative}.quoridor-cell.legal::after{content:'';width:12px;aspect-ratio:1;border-radius:50%;background:#2f865b;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.q-pawn{width:54%;aspect-ratio:1;border-radius:50% 50% 42% 42%;display:block;margin:auto;background:#e8d7ad;box-shadow:0 4px 8px #000}.q-pawn.side-2{background:#252b27}.q-wall{position:absolute;background:#e8c14f;box-shadow:0 3px 6px #000}.q-wall.h{height:5px;width:calc((100% - 26px - 8 * 6px) / 9 * 2 + 6px);left:calc(13px + var(--c) * ((100% - 26px - 8 * 6px) / 9 + 6px));top:calc(13px + (var(--r) + 1) * ((100% - 26px - 8 * 6px) / 9 + 6px) - 5px)}.q-wall.v{width:5px;height:calc((100% - 26px - 8 * 6px) / 9 * 2 + 6px);top:calc(13px + var(--r) * ((100% - 26px - 8 * 6px) / 9 + 6px));left:calc(13px + (var(--c) + 1) * ((100% - 26px - 8 * 6px) / 9 + 6px) - 5px)}.wall-builder{display:grid;grid-template-columns:1fr 1fr;gap:8px}.wall-builder label{font-size:11px;color:#9ea8a0}.wall-builder input{width:100%;background:#171d19;border:1px solid #39413b;color:#fff;padding:8px}.wall-builder>div{display:flex;gap:4px}.wall-builder>div button{background:#171d19;color:#9ea8a0;border:1px solid #39413b;padding:8px}.wall-builder>div button.on{background:#e7c65a;color:#111}.wall-builder .btn{grid-column:1/-1}

/* Skyjo */
.skyjo-table{width:100%;display:grid;gap:22px}.skyjo-opponents{display:flex;justify-content:center;gap:18px;overflow-x:auto}.skyjo-opponent{display:grid;gap:6px;color:#aeb8b0}.skyjo-grid{display:grid;grid-template-columns:repeat(4,42px);grid-template-rows:repeat(3,58px);gap:4px}.skyjo-grid.mine{grid-template-columns:repeat(4,72px);grid-template-rows:repeat(3,101px)}.skyjo-grid button{border:0;padding:0;background:none}.skyjo-grid:not(.mine) .social-card{width:42px}.skyjo-grid.mine button.selected{outline:3px solid #edc650}.skyjo-empty{background:#151b17;border:1px dashed #344039}.skyjo-piles{display:flex;justify-content:center;gap:22px}.skyjo-piles>div{display:grid;justify-items:center;gap:6px;color:#9ca69e}

/* Dame de pique et Skat */
.trick-table,.skat-trick{min-height:180px;display:flex;align-items:center;justify-content:center;gap:18px}.trick-table>div,.skat-trick>div{display:grid;justify-items:center;gap:6px}.hearts-state{display:flex;justify-content:space-between;color:#aeb8b0}.skat-table{width:min(760px,100%)}.skat-contract{display:grid;grid-template-columns:1fr auto 1fr auto;gap:14px;padding:14px;border-bottom:1px solid #303832;color:#9ea8a0}.skat-contract b{color:#edc85d}

/* Cluedo */
.cluedo-mansion{width:min(850px,100%);display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:#232923;padding:6px}.cluedo-room{min-height:110px;background:#d9cfb4;color:#25271f;border:0;padding:13px;text-align:left;display:flex;flex-direction:column;justify-content:space-between}.cluedo-room.mine{box-shadow:inset 0 0 0 4px #bd4852}.cluedo-room.legal{cursor:pointer;background:#ede4ca}.cluedo-room span{font-size:11px;color:#676455}.cluedo-clues{display:flex;gap:8px;flex-wrap:wrap}.clue-chip{padding:10px 12px;background:#171e19;border-left:3px solid #d5b758}.clue-chip small{display:block;color:#89948b}.cluedo-form{display:grid;gap:7px;width:100%;padding:10px 0}.cluedo-form select{background:#171e19;color:#ece8df;border:1px solid #39413b;padding:9px}.cluedo-refute{display:grid;gap:6px;width:100%}.cluedo-refute button,.werewolf-actions button{background:#171e19;color:#eee9df;border:1px solid #3b443e;padding:11px;text-align:left}

/* Loups-garous */
.werewolf-scene{width:100%}.werewolf-time{text-align:center;margin-bottom:22px}.werewolf-time small{display:block;color:#8c978e}.werewolf-time b{font-size:44px}.village-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px}.village-person{min-height:110px;background:#18201b;display:grid;place-items:center;padding:10px}.village-person>span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#d4bd72;color:#171b18;font-weight:900}.village-person small{color:#89948c}.village-person.dead{opacity:.45}.role-card{width:min(480px,100%);padding:18px;border-left:4px solid #ca535f;background:#171d19}.role-card small,.role-card span{display:block;color:#9ca69e}.role-card b{display:block;font-size:25px;margin:6px 0}.werewolf-actions{display:grid;gap:6px;width:100%}

@media(max-width:1100px){.social-main{grid-template-columns:1fr}.social-stage{overflow:visible}.social-side{overflow:visible;border-left:0;border-top:1px solid #29302b}.social-main{overflow:auto}.dobble-card{width:220px}.social-table{min-height:340px}}
@media(max-width:680px){.social-stage{padding:18px 12px}.social-table{padding:14px;min-height:300px}.social-heading h1{font-size:27px}.social-main{height:calc(100vh - 58px)}.dobble-table{grid-template-columns:1fr;gap:10px}.dobble-vs{display:none}.dobble-card{width:190px}.uno-table{grid-template-columns:1fr}.uno-direction,.uno-color{display:none}.social-card{width:58px}.skyjo-grid.mine{grid-template-columns:repeat(4,58px);grid-template-rows:repeat(3,81px)}.cluedo-room{min-height:90px;padding:8px;font-size:11px}}

/* 1.6.13 - bibliothèque extensible pour plusieurs centaines de jeux */
#screen-hub .hub-body{
  height:100vh!important;
  min-height:100vh!important;
  padding:30px 34px 42px!important;
  display:block!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  scrollbar-gutter:stable;
}
#screen-hub .library-shell{
  width:100%!important;
  max-width:none!important;
  min-height:0!important;
  margin:0!important;
  display:block!important;
}
#screen-hub .library-head{
  min-height:106px;
  padding:0 0 24px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  border-bottom:1px solid rgba(255,255,255,.11);
}
#screen-hub .library-kicker{
  margin-bottom:8px;
  color:#f0c958;
  font-size:10px;
  font-weight:850;
  line-height:1;
  letter-spacing:0;
  text-transform:uppercase;
}
#screen-hub .library-title{
  color:#f5f2ea;
  font-size:34px;
  font-weight:720;
  line-height:1.08;
  letter-spacing:0;
}
#screen-hub .library-sub{margin-top:8px;color:#a9afa9;font-size:12px;letter-spacing:0}
#screen-hub .library-head-actions{display:flex;align-items:flex-end;gap:10px;flex:0 0 auto}
#screen-hub .library-head-actions>.mini{height:38px;margin-bottom:1px;border-radius:4px!important}
#screen-hub .library-join-inline>label{
  display:block;
  margin-bottom:6px;
  color:#8b918c;
  font-size:8px;
  font-weight:800;
  letter-spacing:0;
  text-transform:uppercase;
}
#screen-hub .library-join-inline>div{display:grid;grid-template-columns:104px 92px;gap:6px}
#screen-hub .library-join-inline input{
  width:100%;
  min-width:0;
  height:38px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:4px;
  outline:0;
  background:rgba(8,11,9,.86);
  color:#fff;
  font-family:inherit;
  font-size:12px;
  font-weight:800;
  letter-spacing:0;
  text-align:center;
  text-transform:uppercase;
}
#screen-hub .library-join-inline input:focus{border-color:#f0c958;box-shadow:0 0 0 2px rgba(240,201,88,.12)}
#screen-hub .library-join-inline .btn{height:38px;padding:0 12px;border-radius:4px!important;font-size:10px}

#screen-hub .library-controls{
  position:sticky;
  top:0;
  z-index:20;
  min-height:66px;
  margin:0 -4px;
  padding:12px 4px;
  display:grid;
  grid-template-columns:minmax(220px,1.15fr) minmax(300px,2fr) 150px 166px;
  align-items:end;
  gap:10px;
  background:rgba(9,12,10,.94);
  border-bottom:1px solid rgba(255,255,255,.09);
  backdrop-filter:blur(16px);
}
#screen-hub .library-search,#screen-hub .library-select{position:relative;display:block;min-width:0}
#screen-hub .library-search>span,#screen-hub .library-select>span{
  display:block;
  margin-bottom:5px;
  color:#747b75;
  font-size:8px;
  font-weight:800;
  letter-spacing:0;
  text-transform:uppercase;
}
#screen-hub .library-search input,#screen-hub .library-select select{
  width:100%;
  height:34px;
  min-width:0;
  padding:0 32px 0 10px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:4px;
  outline:0;
  background:#141815;
  color:#e9ece9;
  font-family:inherit;
  font-size:10px;
  font-weight:600;
  letter-spacing:0;
}
#screen-hub .library-search input:focus,#screen-hub .library-select select:focus{border-color:#6f7b72}
#screen-hub .library-search input::-webkit-search-cancel-button{display:none}
#screen-hub #hub-search-clear{
  position:absolute;
  right:5px;
  bottom:4px;
  width:26px;
  height:26px;
  display:none;
  place-items:center;
  padding:0;
  border:0;
  border-radius:3px;
  background:transparent;
  color:#939a94;
  font-size:18px;
  cursor:pointer;
}
#screen-hub #hub-search-clear.show{display:grid}
#screen-hub #hub-search-clear:hover{background:rgba(255,255,255,.07);color:#fff}
#screen-hub .library-categories{
  min-width:0;
  height:34px;
  display:flex;
  align-items:stretch;
  gap:2px;
  overflow-x:auto;
  scrollbar-width:none;
}
#screen-hub .library-categories::-webkit-scrollbar{display:none}
#screen-hub .library-categories button{
  flex:0 0 auto;
  min-width:82px;
  padding:0 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:0;
  border-bottom:2px solid transparent;
  border-radius:0;
  background:transparent;
  color:#8c938d;
  font-size:10px;
  font-weight:750;
  letter-spacing:0;
  cursor:pointer;
}
#screen-hub .library-categories button:hover{color:#e4e7e4;background:rgba(255,255,255,.035)}
#screen-hub .library-categories button.on{border-bottom-color:#f0c958;color:#fff}
#screen-hub .library-categories button b{color:#626963;font-size:8px;font-weight:700}
#screen-hub .library-categories button.on b{color:#d7bb69}

#screen-hub .library-result-head{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
#screen-hub .library-result-head strong{color:#e9ece8;font-size:13px;letter-spacing:0}
#screen-hub .library-result-head span{color:#747b75;font-size:9px;letter-spacing:0}
#screen-hub .library-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));
  align-items:stretch;
  gap:14px;
}
#screen-hub .library-game{
  position:relative;
  min-width:0;
  height:270px;
  display:grid;
  grid-template-rows:118px minmax(0,1fr) 38px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.105);
  border-top:2px solid var(--game);
  border-radius:6px;
  background:#131714;
  box-shadow:0 10px 30px rgba(0,0,0,.2);
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
#screen-hub .library-game:hover{
  border-color:color-mix(in srgb,var(--game) 55%,rgba(255,255,255,.13));
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(0,0,0,.32);
}
#screen-hub .library-game-hit{position:absolute;inset:0;z-index:2;border:0;background:transparent;cursor:pointer}
#screen-hub .library-game-photo{position:relative;min-width:0;overflow:hidden;background:#202521}
#screen-hub .library-game-photo::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(3,5,4,.06),rgba(3,5,4,.18) 55%,rgba(3,5,4,.68));
}
#screen-hub .library-game-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
#screen-hub .library-game-code,#screen-hub .library-game-mood{
  position:absolute;
  z-index:1;
  top:10px;
  color:#fff;
  font-size:9px;
  font-weight:850;
  letter-spacing:0;
  text-transform:uppercase;
}
#screen-hub .library-game-code{left:11px;padding-left:8px;border-left:3px solid var(--game)}
#screen-hub .library-game-mood{right:11px;color:rgba(255,255,255,.7);font-size:7px}
#screen-hub .library-game-copy{min-width:0;padding:12px 13px 6px}
#screen-hub .library-game-title{
  overflow:hidden;
  color:#f5f3ed;
  font-size:17px;
  font-weight:750;
  line-height:1.15;
  letter-spacing:0;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#screen-hub .library-game-ruleset{
  margin-top:5px;
  overflow:hidden;
  color:var(--game);
  font-size:7px;
  font-weight:850;
  line-height:1.25;
  letter-spacing:0;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}
#screen-hub .library-game-desc{
  min-height:30px;
  margin-top:6px;
  display:-webkit-box;
  overflow:hidden;
  color:#949b95;
  font-size:9px;
  line-height:1.45;
  letter-spacing:0;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
#screen-hub .library-game-modes{position:relative;z-index:3;padding:0 12px 11px;display:flex;align-items:end;gap:6px}
#screen-hub .library-game-modes button{
  min-width:0;
  height:27px;
  padding:0 9px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:3px;
  background:transparent;
  color:#d8dcd8;
  font-size:8px;
  font-weight:800;
  letter-spacing:0;
  cursor:pointer;
}
#screen-hub .library-game-modes button:hover{border-color:var(--game);color:#fff;background:color-mix(in srgb,var(--game) 12%,transparent)}
#screen-hub .library-empty{display:none;min-height:220px;place-items:center;align-content:center;gap:7px;color:#7f8780;text-align:center}
#screen-hub .library-empty.show{display:grid}
#screen-hub .library-empty b{color:#e2e6e2;font-size:17px}
#screen-hub .library-empty span{font-size:10px}
#screen-hub .library-empty button{margin-top:8px;border:0;background:transparent;color:#f0c958;font-size:10px;font-weight:800;cursor:pointer}
#screen-hub #hub-prog{width:100%!important;max-width:none!important;margin:20px 0 0!important}
#screen-hub #hub-quick{display:none!important}
#screen-hub .hp-card{min-height:76px!important;background:rgba(12,15,13,.94)!important}
#screen-casino .cr-ruleset{
  padding:12px 0 4px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  color:#777f78;
  font-size:8px;
  letter-spacing:0;
}
#screen-casino .cr-ruleset b{color:#e8bf57;font-size:9px;text-align:right}

@media(max-width:1450px){
  #screen-hub .library-controls{grid-template-columns:minmax(210px,1fr) minmax(250px,1.45fr) 140px 150px}
  #screen-hub .library-grid{grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr))}
}
@media(max-width:1080px){
  #screen-hub .hub-body{height:auto!important;padding:24px 20px 36px!important}
  #screen-hub .library-head{align-items:flex-start;flex-direction:column}
  #screen-hub .library-head-actions{width:100%}
  #screen-hub .library-controls{position:relative;grid-template-columns:minmax(220px,1fr) minmax(280px,1.3fr)}
  #screen-hub .library-grid{grid-template-columns:repeat(auto-fill,minmax(min(210px,100%),1fr))}
}
@media(max-width:650px){
  #screen-hub .hub-body{padding:18px 12px 30px!important}
  #screen-hub .library-title{font-size:28px}
  #screen-hub .library-head-actions{align-items:stretch;flex-direction:column}
  #screen-hub .library-join-inline>div{grid-template-columns:minmax(0,1fr) 100px}
  #screen-hub .library-controls{grid-template-columns:1fr}
  #screen-hub .library-categories{order:2}
  #screen-hub .library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #screen-hub .library-game{height:254px;grid-template-rows:100px minmax(0,1fr) 38px}
  #screen-hub .library-game-title{font-size:14px}
  #screen-hub .library-game-desc{font-size:8px}
  #screen-hub .library-game-modes button{padding:0 6px;font-size:7px}
}
@media(max-width:390px){#screen-hub .library-grid{grid-template-columns:1fr}}

/* ========================================================================== 
   KYDOS DESKTOP 1.6.27 - cadre produit, amis et messagerie
   ========================================================================== */
:root{
  --ky-bg:#0b0f13;--ky-side:#0e1319;--ky-panel:#121920;--ky-panel2:#171f27;
  --ky-line:#27313a;--ky-soft:#89949e;--ky-text:#eef2f4;--ky-accent:#63a8ff;
  --ky-green:#45c887;--ky-gold:#e7bd58;--ky-red:#ef6a7a;
}

#screen-hub,#screen-friends,#screen-profil,#screen-admin{background:var(--ky-bg)!important;color:var(--ky-text)!important}
#screen-hub.active,#screen-friends.active,#screen-profil.active,#screen-admin.active{display:block!important;padding:0!important;overflow:hidden!important}

/* La barre du haut devient la navigation principale fixe de l'application. */
#screen-hub>.topbar,#screen-friends>.topbar,#screen-profil>.topbar,#screen-admin>.topbar{
  position:fixed!important;z-index:70!important;left:0!important;top:0!important;bottom:0!important;
  width:216px!important;height:100vh!important;min-height:0!important;padding:22px 14px 16px!important;
  display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;
  background:var(--ky-side)!important;border:0!important;border-right:1px solid var(--ky-line)!important;box-shadow:none!important;
}
#screen-hub>.topbar>.logo,#screen-friends>.topbar>.logo,#screen-profil>.topbar>.logo,#screen-admin>.topbar>.logo{
  width:auto!important;min-width:0!important;margin:0 10px 26px!important;color:var(--ky-text)!important;font-size:19px!important;line-height:1!important;text-align:left!important;
}
#screen-hub>.topbar>.logo::after,#screen-friends>.topbar>.logo::after,#screen-profil>.topbar>.logo::after,#screen-admin>.topbar>.logo::after{
  content:'PLAY TOGETHER'!important;display:block!important;margin-top:8px!important;color:#68737c!important;font-size:8px!important;font-weight:800!important;letter-spacing:1.4px!important;
}
#screen-hub>.topbar .app-nav,#screen-friends>.topbar .app-nav,#screen-profil>.topbar .app-nav,#screen-admin>.topbar .app-nav{
  width:100%!important;display:flex!important;flex-direction:column!important;gap:4px!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;
}
#screen-hub>.topbar .app-nav button,#screen-friends>.topbar .app-nav button,#screen-profil>.topbar .app-nav button,#screen-admin>.topbar .app-nav button{
  width:100%!important;height:42px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:11px!important;
  padding:0 11px!important;border:1px solid transparent!important;border-radius:5px!important;background:transparent!important;color:#929ca5!important;font-size:12px!important;font-weight:700!important;
}
#screen-hub>.topbar .app-nav button:hover,#screen-friends>.topbar .app-nav button:hover,#screen-profil>.topbar .app-nav button:hover,#screen-admin>.topbar .app-nav button:hover{background:#151c23!important;color:#e9eef1!important}
#screen-hub>.topbar .app-nav button.active,#screen-friends>.topbar .app-nav button.active,#screen-profil>.topbar .app-nav button.active,#screen-admin>.topbar .app-nav button.active{border-color:#34424f!important;background:#1a232c!important;color:#fff!important}
#screen-hub>.topbar .app-nav button[hidden],#screen-friends>.topbar .app-nav button[hidden],#screen-profil>.topbar .app-nav button[hidden],#screen-admin>.topbar .app-nav button[hidden]{display:none!important}
.app-nav-mark{width:24px!important;height:24px!important;display:grid!important;place-items:center!important;flex:0 0 24px!important;border:1px solid #46515b!important;border-radius:50%!important;color:#bac2c8!important;font-size:9px!important}
.app-nav button.active .app-nav-mark{border-color:var(--ky-accent)!important;color:var(--ky-accent)!important;background:#132438!important}

#screen-hub>.topbar>.topbar-mid,#screen-friends>.topbar>.topbar-mid,#screen-profil>.topbar>.topbar-mid,#screen-admin>.topbar>.topbar-mid{display:none!important}
#screen-friends>.topbar>#friends-back,#screen-profil>.topbar>#btn-profil-back,#screen-admin>.topbar>#btn-admin-back{margin-top:auto!important;width:100%!important;border:0!important;background:transparent!important;color:#87919a!important;text-align:left!important}
#screen-hub>.topbar>.hub-actions{margin-top:auto!important;width:100%!important;display:flex!important;flex-direction:column!important;gap:4px!important}
#screen-hub>.topbar>.hub-actions>*{display:none!important}
#screen-hub>.topbar>.hub-actions>#hub-profil{display:flex!important;width:100%!important;min-height:56px!important;padding:8px!important;border:1px solid var(--ky-line)!important;border-radius:5px!important;background:#121820!important;color:#fff!important;justify-content:flex-start!important}
#hub-profil .me-txt{min-width:0!important;text-align:left!important}#hub-profil .me-txt b{color:#fff!important;font-size:11px!important}#hub-profil .me-txt i{color:#78838d!important;font-size:8px!important}

#screen-hub>.hub-body,#screen-friends>.friends-page,#screen-profil>.prof-body,#screen-admin>.admin-body{
  margin-left:216px!important;width:calc(100vw - 216px)!important;height:100vh!important;max-width:none!important;
}

/* Accueil : catalogue dense au centre, activité sociale toujours visible à droite. */
#screen-hub>.hub-body.ky-dashboard{display:grid!important;grid-template-columns:minmax(0,1fr) 280px!important;padding:0!important;overflow:hidden!important;background:var(--ky-bg)!important}
.hub-center{min-width:0;height:100vh;overflow-y:auto;overflow-x:hidden;padding:22px 24px 42px}
.hub-welcome{display:flex;align-items:end;justify-content:space-between;gap:24px;margin:0 0 18px;padding-bottom:16px;border-bottom:1px solid var(--ky-line)}
.hub-welcome h1,.friends-page-head h1,.profile-page-title h1{margin:3px 0 0;color:var(--ky-text);font-size:25px;line-height:1.05;letter-spacing:0}
.hub-welcome p,.friends-page-head p{margin:0;color:var(--ky-soft);font-size:11px}
.section-kicker{color:var(--ky-gold);font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:1.1px}
#screen-hub .library-shell{min-width:0!important;width:100%!important;overflow:hidden!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
#screen-hub .library-head{display:none!important}
#screen-hub .library-controls{position:sticky!important;z-index:8!important;top:-22px!important;grid-template-columns:minmax(155px,.9fr) minmax(230px,1.35fr) minmax(105px,.65fr) minmax(110px,.7fr)!important;gap:8px!important;min-width:0!important;margin:0 0 12px!important;padding:12px 0!important;background:rgba(11,15,19,.96)!important;backdrop-filter:blur(12px)!important;border-bottom:1px solid var(--ky-line)!important}
#screen-hub .library-search,#screen-hub .library-select,#screen-hub .library-categories{min-width:0!important;width:100%!important}
#screen-hub .library-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}
#screen-hub .library-game{height:238px!important;grid-template-rows:105px minmax(0,1fr) 38px!important;border:1px solid var(--ky-line)!important;border-radius:5px!important;background:var(--ky-panel)!important;box-shadow:none!important}
#screen-hub .library-game:hover{border-color:#50606f!important;transform:translateY(-2px)!important}
#screen-hub .library-game-copy{padding:10px 11px 5px!important}
#screen-hub .library-game-title{font-size:14px!important}#screen-hub .library-game-ruleset{font-size:7px!important}#screen-hub .library-game-desc{font-size:8px!important;line-height:1.45!important}
#screen-hub .hub-prog,#screen-hub .hub-quick{margin-top:12px!important}

.hub-social{height:100vh;overflow:auto;padding:18px 16px;border-left:1px solid var(--ky-line);background:#0f151b}
.social-rail-section{padding:14px 0;border-bottom:1px solid var(--ky-line)}.social-rail-section:first-child{padding-top:0}.social-rail-section:last-child{border-bottom:0}
.social-rail-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.social-rail-head span{color:#e7ecef;font-size:10px;font-weight:800}.social-rail-head b{color:#74808a;font-size:9px}
.social-rail-section p{margin:5px 0 10px;color:#7e8992;font-size:9px;line-height:1.5}.social-rail-section .btn{width:100%;height:32px;border-radius:4px!important;font-size:9px}
.hub-online-list{display:grid;gap:3px}.hub-online-list>button{position:relative;width:100%;display:flex;align-items:center;gap:8px;padding:7px;border:0;border-radius:4px;background:transparent;color:#fff;text-align:left;cursor:pointer}.hub-online-list>button:hover{background:#182129}.hub-online-list em{margin-left:auto;min-width:17px;height:17px;display:grid;place-items:center;border-radius:9px;background:var(--ky-accent);color:#07111b;font-size:8px;font-style:normal;font-weight:900}
.social-link{width:100%;margin-top:8px;padding:8px;border:0;border-top:1px solid #202a33;background:transparent;color:var(--ky-accent);font-size:9px;font-weight:800;text-align:left;cursor:pointer}
.social-person-copy{display:flex;flex:1;min-width:0;flex-direction:column}.social-person-copy b{overflow:hidden;color:#edf1f3;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.social-person-copy i{color:#75818b;font-size:8px;font-style:normal}.presence-dot{width:7px;height:7px;flex:0 0 7px;border:2px solid #11181e;border-radius:50%;background:var(--ky-green);box-shadow:0 0 0 1px rgba(69,200,135,.25)}
.mini-request{display:flex;align-items:center;gap:7px;padding:7px 0}.mini-request>div:last-child{display:flex;gap:3px}.mini-request>div button{width:24px;height:24px;border:1px solid var(--ky-line);border-radius:4px;background:#172029;color:#cbd2d7;cursor:pointer}.mini-request>div button:first-child{color:var(--ky-green)}

/* Page amis */
.friends-page{padding:26px 28px 40px!important;overflow:auto;background:var(--ky-bg)}
.friends-page-head{display:flex;align-items:end;justify-content:space-between;gap:24px;padding-bottom:20px;border-bottom:1px solid var(--ky-line)}
.friends-page-head p{margin-top:7px}.friend-search{width:min(360px,42vw);display:grid;gap:7px}.friend-search span{color:#8c98a2;font-size:8px;font-weight:800;text-transform:uppercase}.friend-search input{height:38px;padding:0 12px;border:1px solid #35414b;border-radius:4px;background:#121920;color:#fff;outline:0}.friend-search input:focus{border-color:var(--ky-accent)}
.friends-workspace{display:grid;grid-template-columns:minmax(340px,1.2fr) minmax(300px,1fr) minmax(260px,.8fr);gap:0;margin-top:20px;border:1px solid var(--ky-line);border-radius:6px;overflow:hidden;background:var(--ky-panel)}
.friends-column,.friend-discovery{min-width:0;padding:18px;border-right:1px solid var(--ky-line)}.friend-discovery{border-right:0;background:#0f151b}
.friends-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.friends-section-head h2{margin:0;color:#f0f3f5;font-size:13px}.friends-section-head span{color:#76818a;font-size:9px}
.friends-list,.friend-requests,.friend-results{display:grid;gap:6px}.friend-row,.request-row,.result-row{display:flex;align-items:center;gap:10px;min-height:58px;padding:9px;border:1px solid #26313a;border-radius:5px;background:#151d24}.friend-main{display:flex;align-items:center;gap:9px;min-width:0;flex:1;padding:0;border:0;background:transparent;text-align:left;cursor:pointer}.friend-level{color:#77838d;font-size:8px}.friend-row>.btn,.request-row .btn,.result-row>.btn{height:30px;padding:0 10px;font-size:8px}.request-row>div:last-child{display:flex;align-items:center;gap:5px}.request-row.pending>div:last-child span,.relation-label{color:#7f8b94;font-size:8px}.social-empty{min-height:72px;display:grid;place-items:center;padding:14px;color:#727e87;font-size:9px;text-align:center}

/* Profil : identité à gauche, progression et vestiaire à droite. */
#screen-profil>.prof-body.profile-workspace{display:grid!important;grid-template-columns:280px minmax(0,1fr)!important;padding:0!important;overflow:hidden!important;background:var(--ky-bg)!important}
.profile-identity{height:100vh;overflow:auto;padding:26px 20px;border-right:1px solid var(--ky-line);background:#0f151b}
.profile-content{height:100vh;overflow:auto;padding:28px 32px 54px}.profile-page-title{padding-bottom:18px;border-bottom:1px solid var(--ky-line)}
#screen-profil .prof-card{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
#screen-profil .prof-card{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:18px!important;width:100%!important;min-width:0!important}
#screen-profil .pc-left{width:100%!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:10px!important;padding:0!important}
#screen-profil .pc-left .av-xl{width:112px!important;height:112px!important;flex:0 0 112px!important;font-size:31px!important}
#screen-profil .pc-left .mini{width:auto!important;max-width:100%!important}
#screen-profil .pc-mid{width:100%!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;text-align:center!important}
#screen-profil .pc-name{overflow:hidden!important;font-size:28px!important;line-height:1.1!important;text-overflow:ellipsis!important;white-space:nowrap!important}
#screen-profil .pc-grade{display:flex!important;justify-content:center!important}.pc-grade .grade-pill{max-width:100%!important}
#screen-profil .pc-bar{width:100%!important;height:6px!important;margin:2px 0!important}
#screen-profil .pc-xp,#screen-profil .pc-next{width:100%!important;color:#89949d!important;font-size:9px!important;line-height:1.5!important;text-align:left!important}
#screen-profil .pc-right{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:1px!important;padding:1px!important;border:1px solid var(--ky-line)!important;border-radius:5px!important;background:var(--ky-line)!important;overflow:hidden!important}
#screen-profil .pc-stat{min-width:0!important;display:grid!important;gap:3px!important;padding:10px!important;background:var(--ky-panel)!important;text-align:left!important}
#screen-profil .pc-stat:nth-child(3){grid-column:1/-1!important}
#screen-profil .pc-stat span{color:#74808a!important;font-size:7px!important}#screen-profil .pc-stat b{color:#fff!important;font-size:15px!important}
#screen-profil .pc-day{grid-column:1/-1!important;padding:9px!important;background:#11181e!important;color:#76818a!important;font-size:7px!important;line-height:1.4!important}
#screen-profil .prof-tabs{margin:0!important;padding:14px 0!important;justify-content:flex-start!important;border-bottom:1px solid var(--ky-line)!important;background:transparent!important}
#screen-profil .prof-tabs .tab{min-width:110px!important;height:34px!important;border-radius:4px!important;font-size:9px!important}
#screen-profil .prof-pane{padding-top:18px!important}.profile-social-summary{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:20px;border:1px solid var(--ky-line);border-radius:5px;overflow:hidden;background:var(--ky-line)}.profile-social-summary>div{display:grid;gap:3px;padding:12px;background:var(--ky-panel)}.profile-social-summary span{color:#77838c;font-size:8px}.profile-social-summary b{color:#fff;font-size:17px}.profile-social-summary button{grid-column:1/-1;height:34px;border:0;background:#17232f;color:var(--ky-accent);font-size:9px;font-weight:800;cursor:pointer}

/* Administration : lecture rapide, lignes serrées et actions à droite. */
#screen-admin>.admin-body{padding:28px 32px 50px!important;overflow:auto!important;background:var(--ky-bg)!important}
#screen-admin .admin-head{margin:0 0 16px!important;padding:0 0 16px!important;border-bottom:1px solid var(--ky-line)!important}#screen-admin .admin-head h2{font-size:22px!important;color:#f0f3f4!important}
#screen-admin .admin-list{border:1px solid var(--ky-line)!important;border-radius:6px!important;background:var(--ky-panel)!important;overflow:hidden!important}
#screen-admin .admin-row{min-height:48px!important;margin:0!important;padding:9px 12px!important;border:0!important;border-bottom:1px solid var(--ky-line)!important;border-radius:0!important;background:var(--ky-panel)!important;box-shadow:none!important}.admin-row:last-child{border-bottom:0!important}.admin-row:hover{background:#182129!important}

/* Messagerie privée */
.dm-drawer{position:fixed;z-index:180;right:0;top:0;width:370px;height:100vh;display:flex;flex-direction:column;transform:translateX(102%);transition:transform .22s ease;background:#10171e;border-left:1px solid #34404a;box-shadow:-20px 0 45px rgba(0,0,0,.38)}
.dm-drawer.open{transform:translateX(0)}.dm-head{height:64px;display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--ky-line)}.dm-person{display:flex;align-items:center;gap:9px;min-width:0;flex:1}.icon-btn{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--ky-line);border-radius:4px;background:#161f27;color:#bdc6cc;font-size:17px;cursor:pointer}.icon-btn.danger{color:var(--ky-red)}
.dm-messages{flex:1;overflow:auto;display:flex;flex-direction:column;gap:7px;padding:14px}.dm-message{align-self:flex-start;max-width:82%;display:grid;gap:4px;padding:9px 10px;border:1px solid #2c3740;border-radius:6px;background:#19222a;color:#edf1f3;font-size:10px}.dm-message.mine{align-self:flex-end;border-color:#31577a;background:#172c40}.dm-message time{color:#74808a;font-size:7px}.dm-message button{padding:6px;border:1px solid #4c6f8f;border-radius:3px;background:transparent;color:#8bc1f5;font-size:8px;cursor:pointer}.dm-invite-row:empty{display:none}.dm-invite-row{padding:8px 12px;border-top:1px solid var(--ky-line)}.dm-invite-row .btn{width:100%;font-size:8px}.dm-form{display:grid;grid-template-columns:1fr auto;gap:7px;padding:11px;border-top:1px solid var(--ky-line);background:#0d1318}.dm-form input,.room-chat-form input{min-width:0;height:38px;padding:0 11px;border:1px solid #34414c;border-radius:4px;background:#151d24;color:#fff;outline:0}.dm-form input:focus,.room-chat-form input:focus{border-color:var(--ky-accent)}

/* Chat de table : fermé par défaut et totalement absent des tables publiques. */
.room-chat{position:fixed;z-index:150;right:16px;bottom:16px;display:none}.room-chat.available{display:block}.room-chat-toggle{height:38px;display:flex;align-items:center;gap:8px;padding:0 14px;border:1px solid #3a4650;border-radius:5px;background:#151e26;color:#e8edef;font-size:9px;font-weight:800;box-shadow:0 8px 24px rgba(0,0,0,.3);cursor:pointer}.room-chat-toggle b{min-width:16px;height:16px;display:grid;place-items:center;border-radius:8px;background:var(--ky-accent);color:#08131d;font-size:7px}.room-chat-panel{width:330px;height:430px;display:none;grid-template-rows:auto 1fr auto;border:1px solid #37434d;border-radius:6px;background:#10171d;box-shadow:0 18px 50px rgba(0,0,0,.52);overflow:hidden}.room-chat.open .room-chat-toggle{display:none}.room-chat.open .room-chat-panel{display:grid}.room-chat-panel>header{display:flex;align-items:center;justify-content:space-between;padding:12px;border-bottom:1px solid var(--ky-line)}.room-chat-panel>header div{display:grid;gap:2px}.room-chat-panel>header span{color:var(--ky-gold);font-size:7px;text-transform:uppercase}.room-chat-panel>header b{color:#fff;font-size:11px}.room-chat-messages{overflow:auto;display:flex;flex-direction:column;gap:7px;padding:12px}.room-chat-message{align-self:flex-start;max-width:86%;display:grid;grid-template-columns:1fr auto;gap:3px 8px;padding:8px 9px;border:1px solid #29343d;border-radius:5px;background:#182129}.room-chat-message.mine{align-self:flex-end;border-color:#315879;background:#172b3e}.room-chat-message b{color:#8ebbe5;font-size:8px}.room-chat-message span{grid-column:1/-1;color:#e8ecef;font-size:9px;line-height:1.45}.room-chat-message time{color:#6f7a83;font-size:7px}.room-chat-form{display:grid;grid-template-columns:1fr auto;gap:6px;padding:9px;border-top:1px solid var(--ky-line)}

@media(max-width:1280px){
  #screen-hub>.hub-body.ky-dashboard{grid-template-columns:minmax(0,1fr) 250px!important}
  #screen-hub .library-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .friends-workspace{grid-template-columns:1fr 1fr}.friend-discovery{grid-column:1/-1;border-top:1px solid var(--ky-line)}
}
@media(max-width:980px){
  #screen-hub>.hub-body.ky-dashboard{grid-template-columns:1fr!important}.hub-social{display:none}
  #screen-hub .library-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #screen-profil>.prof-body.profile-workspace{grid-template-columns:230px minmax(0,1fr)!important}
}
@media(max-width:720px){
  #screen-hub>.topbar,#screen-friends>.topbar,#screen-profil>.topbar,#screen-admin>.topbar{position:fixed!important;right:0!important;bottom:auto!important;width:100%!important;height:58px!important;padding:7px 10px!important;flex-direction:row!important;align-items:center!important;border-right:0!important;border-bottom:1px solid var(--ky-line)!important}
  #screen-hub>.topbar>.logo,#screen-friends>.topbar>.logo,#screen-profil>.topbar>.logo,#screen-admin>.topbar>.logo{margin:0 8px!important}.topbar>.logo::after{display:none!important}
  #screen-hub>.topbar .app-nav,#screen-friends>.topbar .app-nav,#screen-profil>.topbar .app-nav,#screen-admin>.topbar .app-nav{flex-direction:row!important;overflow:auto!important}.app-nav button{width:40px!important;padding:0!important;justify-content:center!important}.app-nav button>span:last-child{display:none}
  #screen-hub>.topbar>.hub-actions{display:none!important}
  #screen-hub>.hub-body,#screen-friends>.friends-page,#screen-profil>.prof-body,#screen-admin>.admin-body{margin-left:0!important;margin-top:58px!important;width:100vw!important;height:calc(100vh - 58px)!important}
  .hub-center,.friends-page,.profile-content{padding:16px!important}.hub-welcome,.friends-page-head{align-items:flex-start;flex-direction:column}.friend-search{width:100%}
  .friends-workspace{grid-template-columns:1fr}.friends-column,.friend-discovery{border-right:0;border-bottom:1px solid var(--ky-line)}
  #screen-profil>.prof-body.profile-workspace{grid-template-columns:1fr!important;overflow:auto!important}.profile-identity,.profile-content{height:auto!important}.profile-identity{border-right:0;border-bottom:1px solid var(--ky-line)}
  .dm-drawer{width:min(100vw,370px)}.room-chat{right:8px;bottom:8px}.room-chat-panel{width:min(330px,calc(100vw - 16px));height:min(430px,70vh)}
}

/* 1.6.15 - couche finale des jeux et fenetres de decision
   Les anciens themes clair et sombre cohabitaient encore dans quelques
   composants MAGNAT. Cette couche fixe un seul contrat de contraste. */
.modal{
  padding:24px!important;
  background:rgba(5,7,6,.78)!important;
  color:#f3f1eb!important;
}
.modal-box{
  width:min(480px,calc(100vw - 32px));
  max-height:min(88vh,820px);
  overflow:auto;
  padding:24px!important;
  border:1px solid #343a35!important;
  border-radius:8px!important;
  background:#141815!important;
  color:#f3f1eb!important;
  text-align:left;
}
.modal-box h2,.modal-box h3,.modal-box b,.buy-title,#over-title{color:#f3f1eb!important}
.modal-box .muted,.pay-q,.debt-sub,.ask-text{color:#a6ada7!important}
.modal-close{width:34px;height:34px;display:grid;place-items:center;top:10px;right:10px;color:#aeb5af!important;cursor:pointer}
.modal-close:hover{background:#252a26!important;color:#fff!important}

#modal-buy .buy-box{width:min(520px,calc(100vw - 32px))}
.deed{margin-bottom:18px!important;border:1px solid #3c433d!important;border-radius:6px!important;background:#0e120f!important}
.deed .deed-head{padding:15px 16px!important;color:#fff!important}
.deed .deed-body{padding:15px 16px!important;background:#111512!important;color:#e5e8e5!important}
.deed .deed-row{gap:20px;border-color:#303630!important;color:#aeb5af!important}
.deed .deed-row b{color:#f3f1eb!important;text-align:right}
.pay-choice{text-align:left}
.pay-btns{justify-content:flex-start!important;flex-wrap:wrap}
#modal-buy #buy-decline{padding-left:0;background:transparent!important;color:#a9b0aa!important}

.buy-bar{
  width:min(900px,calc(100vw - 40px));
  max-width:none!important;
  min-height:70px;
  justify-content:space-between;
  gap:18px!important;
  padding:12px 14px!important;
  border:1px solid #3f463f!important;
  border-radius:7px!important;
  background:#121613!important;
  box-shadow:0 18px 58px rgba(0,0,0,.58)!important;
}
.buy-bar .bb-info{min-width:0;flex:1}
.buy-bar .bb-info>div{min-width:0}
.buy-bar .bb-name{overflow:hidden;color:#f5f3ed!important;font-size:14px!important;text-overflow:ellipsis;white-space:nowrap}
.buy-bar .bb-sub{margin-top:3px;color:#a3aba4!important;font-size:11px!important}
.buy-bar .bb-btns{justify-content:flex-end;flex-wrap:nowrap!important}
.buy-bar .bb-btns .btn{min-height:40px;white-space:nowrap}

#modal-card .card-box{background:#151915!important;text-align:center}
#modal-card .card-kind{color:#e7c75c!important}
#modal-card .card-text{color:#eef0ed!important}
#trade-body .tr-item{display:grid!important;grid-template-columns:80px minmax(0,1fr);text-align:left}
#trade-body select,#trade-body input,.modal-box input,.modal-box select{
  min-width:0;background:#0c100d!important;border:1px solid #414842!important;color:#f3f1eb!important;
}
#trade-body .btn{margin-top:10px}
.trade-note{display:block;margin:8px 0;color:#d8bd70!important;font-size:11px;line-height:1.45}
#modal-card .modal-box,#modal-over .modal-box,#modal-level .modal-box,#modal-ask .modal-box{text-align:center}

.prop.hyp,.loan-card,.loan-card.owing,.debt-lever,.debt-cash{
  border-color:#343b35!important;background:#101411!important;color:#e8ebe8!important;
}
.prop.hyp .prop-name,.loan-head,.loan-lines .ll b,.dli-name,.debt-cash{color:#e8ebe8!important}
.hyp-tag,.ti-hyp{border-color:#65542b!important;background:#272213!important;color:#e6c767!important}
.loan-note,.loan-lines .ll,.dl-item{
  border-color:#384039!important;background:#171c18!important;color:#e8ebe8!important;
}
.dl-item:hover{border-color:#d7b954!important;background:#1e241f!important}
.debt-gauge{border-color:#343b35!important;background:#090c0a!important}
#tile-info .ti-row{gap:18px;border-color:#343a35!important}
#tile-info .ti-row span{color:#a6ada7!important}
#tile-info .ti-row b{max-width:62%;color:#f2f0e9!important;text-align:right;overflow-wrap:anywhere}
#tile-info .ti-owner{color:#f2f0e9!important}
.ask-acts,.jail-btns,.promo-btns{flex-wrap:wrap}
.ask-acts .btn,.jail-btns .btn,.promo-btns .btn{min-height:42px}

/* Les plateaux et tables restent utilisables dans une fenetre desktop reduite. */
#screen-classic .classic-heading,#screen-chess .chess-head{min-width:0}
#screen-classic .classic-heading h1,#screen-chess .chess-head h1{overflow-wrap:anywhere}
.classic-panel,.chess-panel,.slot-paytable{color:#eef0ed}
.classic-panel button,.chess-panel button,.poker-actions button,.bj-actions button{white-space:normal}

@media(max-width:760px){
  .modal{padding:12px!important}
  .modal-box{width:calc(100vw - 24px);padding:20px!important}
  .buy-bar{bottom:10px!important;width:calc(100vw - 20px);align-items:stretch;flex-direction:column!important}
  .buy-bar .bb-btns{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));justify-content:stretch}
  .buy-bar .bb-btns .btn{width:100%;padding:9px 7px!important}
  #trade-body .tr-item{grid-template-columns:1fr}
}

/* 1.6.19 - comptabilite lisible de MAGNAT */
#screen-game .money-feed{
  flex:0 0 auto;
  padding:2px 2px 5px;
  border-bottom:1px solid #303631;
}
#screen-game .money-feed-head{
  min-height:28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:#eef0ed;
  font-size:11px;
  font-weight:800;
}
#screen-game .money-feed-head span:last-child{color:#768078;font-size:9px;font-weight:650}
#screen-game .money-feed-list{display:grid}
#screen-game .money-feed-row{
  min-width:0;
  padding:8px 0;
  border-top:1px solid #252b26;
}
#screen-game .money-flow{
  color:#cfd4cf;
  font-size:10px;
  line-height:1.35;
  overflow-wrap:anywhere;
}
#screen-game .money-flow b{color:#f3f1eb}
#screen-game .money-flow strong{color:#f08b7d;font-size:11px}
#screen-game .money-feed-row.incoming .money-flow strong{color:#65d69a}
#screen-game .money-reason{
  margin-top:2px;
  color:#778078;
  font-size:8px;
  line-height:1.3;
  text-transform:uppercase;
}
#screen-game .money-feed-empty{padding:8px 0;color:#737b74;font-size:9px}
#screen-game .money-feed-row.fresh{animation:moneyFeedIn .42s ease-out}
@keyframes moneyFeedIn{
  from{background:rgba(231,199,92,.13);transform:translateX(8px)}
  to{background:transparent;transform:translateX(0)}
}
#modal-card .card-player{
  margin:-4px 0 14px;
  color:#8e978f;
  font-size:11px;
  font-weight:750;
  text-transform:uppercase;
}

/* 1.6.20 - carte Chance / Evenement physique */
#modal-card{perspective:1200px}
#modal-card .card-box{
  --card-accent:#d7b64d;
  width:min(460px,calc(100vw - 32px));
  min-height:430px;
  padding:28px 30px!important;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  border:2px solid var(--card-accent)!important;
  border-radius:8px!important;
  background:#f1eee6!important;
  color:#111512!important;
  box-shadow:0 28px 90px rgba(0,0,0,.68)!important;
  transform-origin:center;
}
#modal-card .card-box.tone-gain{--card-accent:#278a5a}
#modal-card .card-box.tone-cost{--card-accent:#c44f45}
#modal-card .card-box.tone-move{--card-accent:#397ec4}
#modal-card .card-box.tone-keep{--card-accent:#b68b1c}
#modal-card .card-box.dealing{animation:magnatCardDeal .58s cubic-bezier(.2,.8,.2,1)}
@keyframes magnatCardDeal{
  0%{opacity:0;transform:translateY(-70px) rotateX(16deg) rotateZ(-3deg) scale(.84)}
  70%{opacity:1;transform:translateY(4px) rotateX(0) rotateZ(1deg) scale(1.015)}
  100%{transform:translateY(0) rotateZ(0) scale(1)}
}
#modal-card .card-draw-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding-bottom:16px;
  border-bottom:1px solid #c7c4bb;
}
#modal-card .card-kind{
  margin:0!important;
  color:#111512!important;
  font-family:inherit!important;
  font-size:21px!important;
  font-weight:900!important;
  text-transform:uppercase;
}
#modal-card .card-random{
  color:#666b66;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
}
#modal-card .card-mark{
  width:76px;
  height:76px;
  margin:30px auto 20px;
  display:grid;
  place-items:center;
  border:2px solid var(--card-accent);
  color:var(--card-accent);
  font-size:38px;
  font-weight:900;
  line-height:1;
}
#modal-card .card-player{
  margin:0 0 12px!important;
  color:#626862!important;
  font-size:10px!important;
  letter-spacing:0;
}
#modal-card .card-text{
  flex:1;
  margin:0!important;
  color:#111512!important;
  font-size:21px!important;
  font-weight:760;
  line-height:1.35!important;
}
#modal-card .card-effect{
  margin-top:24px;
  padding:13px 0;
  border-top:1px solid #c7c4bb;
  border-bottom:1px solid #c7c4bb;
  color:var(--card-accent);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}
#modal-card .card-continue{
  width:100%;
  min-height:44px;
  margin-top:18px;
  border-color:var(--card-accent)!important;
  background:var(--card-accent)!important;
  color:#fff!important;
}
@media(max-width:520px){
  #modal-card .card-box{min-height:390px;padding:22px!important}
  #modal-card .card-mark{width:64px;height:64px;margin:24px auto 17px;font-size:32px}
  #modal-card .card-text{font-size:18px!important}
}

/* 1.6.21 - plateaux des nouveaux classiques */
.classic-player-dot{width:24px;display:block;aspect-ratio:1;border-radius:50%;background:#d95c55;box-shadow:inset 0 0 0 3px rgba(255,255,255,.15)}
.classic-player-dot.side-2{background:#4e91cf}
.classic-board.game-hex{
  width:min(66vh,660px);
  padding:18px 92px 18px 20px;
  gap:2px;
  overflow:visible;
  border:0;
  background:transparent;
  box-shadow:none;
}
.classic-board.game-hex .classic-cell{
  aspect-ratio:1;
  border:0;
  background:#d8c89e;
  clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);
  transform:translateX(calc(var(--hex-row) * 22%));
}
.classic-board.game-hex .classic-cell:nth-child(-n+11),
.classic-board.game-hex .classic-cell:nth-last-child(-n+11){background:#d8c89e}
.classic-board.game-hex .stone{width:68%;box-shadow:0 3px 7px rgba(0,0,0,.38)}
.classic-board.game-hex .stone.side-1{background:#d9584f}
.classic-board.game-hex .stone.side-2{background:#3e82c8}
.classic-board.game-hex .classic-cell.legal::after{width:13%;z-index:2}

.classic-board.game-pente{
  width:min(74vh,760px);
  padding:12px;
  border:9px solid #76502d;
  background-color:#d4aa6a;
  background-image:linear-gradient(rgba(72,45,20,.52) 1px,transparent 1px),linear-gradient(90deg,rgba(72,45,20,.52) 1px,transparent 1px);
  background-size:calc(100% / 19) calc(100% / 19);
}
.classic-board.game-pente .classic-cell{overflow:visible;border:0;background:transparent}
.classic-board.game-pente .stone{width:78%;z-index:2}
.classic-board.game-pente .classic-cell.legal::after{width:13%;background:#267d57;box-shadow:none}

.classic-board.game-mancala{
  width:min(90%,900px);
  aspect-ratio:3.6/1;
  padding:22px;
  display:grid;
  grid-template-columns:1.25fr repeat(6,1fr) 1.25fr!important;
  grid-template-rows:repeat(2,1fr)!important;
  gap:12px;
  border:7px solid #6e472d;
  border-radius:60px;
  background:#aa7046;
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.08),0 26px 70px rgba(0,0,0,.42);
}
.classic-board.game-awale{
  width:min(90%,860px);
  aspect-ratio:3.3/1;
  padding:22px;
  display:grid;
  grid-template-columns:repeat(6,1fr)!important;
  grid-template-rows:repeat(2,1fr)!important;
  gap:12px;
  border:7px solid #64402a;
  border-radius:54px;
  background:#9a623e;
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.08),0 26px 70px rgba(0,0,0,.42);
}
.classic-board.game-mancala .classic-cell,.classic-board.game-awale .classic-cell{
  border:2px solid rgba(64,34,18,.58);
  border-radius:50%;
  background:#704329;
  box-shadow:inset 0 8px 18px rgba(25,12,5,.55),0 2px 0 rgba(255,255,255,.1);
}
.classic-board.game-mancala .mancala-store{border-radius:50px}
.seed-count{position:relative;width:100%;height:100%;display:grid;place-items:center}
.seed-count i{position:absolute;width:18%;aspect-ratio:1;border-radius:50%;background:#e4ca88;box-shadow:18px 8px 0 #c8a862,-14px 14px 0 #f0d99d,4px -16px 0 #b99355}
.seed-count b{position:relative;z-index:2;min-width:28px;padding:3px 5px;border-radius:12px;background:rgba(14,10,7,.76);color:#fff;font-size:12px}
.classic-board.game-mancala .classic-cell.legal::after,.classic-board.game-awale .classic-cell.legal::after{width:12px;right:8px;bottom:8px;box-shadow:0 0 0 4px rgba(98,214,152,.2)}

.classic-board.game-memory{
  width:min(72vh,690px);
  padding:10px;
  gap:8px;
  border:0;
  background:#0f1411;
  box-shadow:none;
}
.classic-board.game-memory .classic-cell{border:1px solid #343b35;border-radius:5px;background:#1a211c;transition:transform .2s ease,background .2s ease}
.classic-board.game-memory .classic-cell.hidden::before{content:'KYDOS';color:#626b64;font-size:7px;font-weight:900;transform:rotate(-35deg)}
.classic-board.game-memory .classic-cell.revealed{background:#eee9de;transform:rotateY(180deg)}
.classic-board.game-memory .classic-cell.matched{border-color:#55bb82;background:#dff0e5}
.classic-board.game-memory .classic-cell.mismatch{border-color:#cf6259;background:#f2dfdc}
.classic-board.game-memory .classic-cell.revealed>*{transform:rotateY(180deg)}
.memory-face{color:#17201a;font-size:24px;font-weight:900}
.classic-board.game-memory .classic-cell.legal::after{right:7px;bottom:7px;width:7px;box-shadow:none}

.classic-board.game-war{width:min(92%,900px);aspect-ratio:2.2/1;border:0;background:transparent;box-shadow:none;display:block}
.war-table{width:100%;height:100%;display:grid;grid-template-columns:1fr 128px 160px 128px 1fr;align-items:center;gap:20px;padding:28px;border:1px solid #324039;background:#174f38;box-shadow:inset 0 0 0 7px #123b2b,0 28px 80px rgba(0,0,0,.46)}
.war-seat{display:grid;gap:5px;color:#d8dfda}.war-seat small{color:#91a097;font-size:9px;text-transform:uppercase}.war-seat b{font-size:15px}.war-seat.side-1{text-align:right}
.war-card{height:176px;display:grid;place-items:center;border:7px solid #eee9df;border-radius:8px;background:#18221c;color:#f2eee6;font-size:42px;font-weight:900;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.war-card.side-1{color:#ed665d}.war-card.side-2{color:#66a5e2}.war-card:not(.up){background:repeating-linear-gradient(45deg,#202a24 0 7px,#354039 7px 14px);color:transparent}
.war-deck{min-height:92px;display:grid;place-items:center;gap:4px;padding:12px;border:1px solid #e3c35e;border-radius:5px;background:#101612;color:#f4f1e9;cursor:pointer}.war-deck span{font-size:14px;font-weight:850}.war-deck b{color:#d6bc66;font-size:9px;text-transform:uppercase}.war-deck:disabled{opacity:.6;cursor:default}

@media(max-width:760px){
  .classic-board.game-hex{width:min(78vw,620px);padding-right:60px}
  .classic-board.game-mancala,.classic-board.game-awale{width:100%;padding:12px;gap:6px;border-width:4px}
  .seed-count b{min-width:22px;font-size:9px}
  .war-table{grid-template-columns:1fr 76px 96px 76px 1fr;gap:8px;padding:12px}.war-card{height:110px;font-size:28px}
}

/* 1.6.24 - reçu de loyer intégré à la comptabilité, jamais sur le plateau */
#screen-game .rent-notice{
  --rent-accent:#5ea9c9;
  position:relative;
  flex:0 0 auto;
  width:100%;
  max-height:0;
  padding:0 38px 0 13px;
  overflow:hidden;
  border:0 solid #39413b;
  border-left:3px solid var(--rent-accent);
  border-radius:6px;
  background:#171b18;
  color:#eef1ed;
  box-shadow:none;
  opacity:0;
  pointer-events:none;
  transform:translateY(-5px);
  transition:max-height .24s ease,padding .24s ease,border-width .24s ease,opacity .18s ease,transform .24s ease;
}
#screen-game .rent-notice.show{
  max-height:190px;
  padding:12px 38px 12px 13px;
  border-width:1px 1px 1px 3px;
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
#screen-game .rent-notice-close{
  position:absolute;
  top:7px;
  right:7px;
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  background:transparent;
  color:#7f8881;
  font-size:19px;
  line-height:1;
}
#screen-game .rent-notice-close:hover{background:#252b27;color:#f3f5f2}
#screen-game .rent-notice-kicker{
  color:var(--rent-accent);
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
}
#screen-game .rent-notice-property{margin-top:2px;font-size:16px;font-weight:900;line-height:1.15}
#screen-game .rent-notice-flow{
  min-width:0;
  margin-top:9px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto auto minmax(0,1fr);
  align-items:center;
  gap:6px;
  padding:7px 0;
  border-top:1px solid #303731;
  border-bottom:1px solid #303731;
  font-size:10px;
  font-weight:800;
}
#screen-game .rent-notice-flow>span:first-child{text-align:right}
#screen-game .rent-notice-flow>span:last-child{text-align:left}
#screen-game .rent-notice-flow>span:not(.rent-notice-arrow){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#screen-game .rent-notice-arrow{color:#69726b;font-weight:500}
#screen-game .rent-notice-flow strong{color:#f0cb64;font-size:15px;white-space:nowrap}
#screen-game .rent-notice-message{margin:8px 0 0;color:#d3d8d4;font-size:10px;font-weight:750;line-height:1.35}
#screen-game .rent-notice-detail{margin-top:2px;color:#778078;font-size:8px;font-weight:800;text-transform:uppercase}
@media(max-width:520px){
  #screen-game .rent-notice.show{padding:11px 35px 11px 11px}
  #screen-game .rent-notice-property{font-size:15px}
  #screen-game .rent-notice-flow{gap:5px;font-size:9px}
  #screen-game .rent-notice-flow strong{font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  #screen-game .rent-notice{transition:none}
}

/* 1.6.23 - la mise à jour reste impossible à manquer dans le menu desktop */
.account-menu .account-update{
  margin:6px 0 2px;
  border:1px solid rgba(241,199,91,.42)!important;
  background:rgba(241,199,91,.09)!important;
  color:#f1c75b!important;
}
.account-menu .account-update:hover{background:rgba(241,199,91,.16)!important}
.account-menu .account-update small{color:#d8bd78!important;font-weight:800}

/* 1.6.27 - finitions prioritaires placées après tous les anciens thèmes. */
.app-nav button[hidden]{display:none!important}

#screen-lobby.active{display:grid!important;place-items:center!important;padding:24px!important;overflow:hidden!important;background:linear-gradient(rgba(7,11,14,.8),rgba(7,11,14,.94)),var(--v165-home) center/cover no-repeat!important}
#screen-lobby .lobby-card{width:min(860px,calc(100vw - 48px))!important;max-height:calc(100vh - 48px)!important;overflow:auto!important;padding:26px 30px!important;border:1px solid #313b44!important;border-radius:6px!important;background:rgba(14,20,25,.96)!important;box-shadow:0 24px 70px rgba(0,0,0,.48)!important;text-align:left!important}
#screen-lobby .lobby-card>.logo{margin:0!important;color:var(--ky-gold)!important;font-family:Manrope,sans-serif!important;font-size:11px!important;letter-spacing:.5px!important;text-transform:uppercase!important}
#screen-lobby .lobby-card h2{margin:5px 0 18px!important;color:#f2f4f5!important;font-size:25px!important;text-align:left!important}
#screen-lobby .invite-box{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:7px 18px!important;margin:0 0 12px!important;padding:15px!important;border:1px solid var(--ky-line)!important;border-radius:5px!important;background:#121920!important}
#screen-lobby .invite-label{grid-column:1/-1!important;margin:0!important;color:#83909a!important;font-size:8px!important;text-transform:uppercase!important}
#screen-lobby .code-display{grid-column:1/-1!important}.code-display .code-big{padding:7px 10px!important;border:1px solid #34414b!important;border-radius:4px!important;background:#0b1116!important;color:var(--ky-gold)!important;font-size:24px!important;line-height:1!important}.code-display .btn{height:36px!important}
#screen-lobby .invite-hint{grid-column:1/-1!important;color:#76828b!important;font-size:8px!important;text-align:left!important}
#screen-lobby .lobby-stake{margin:0 0 12px!important;padding:11px 13px!important;border:1px solid var(--ky-line)!important;border-radius:5px!important;background:#11181e!important;color:#b9c0c5!important}
#screen-lobby .lobby-players{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;margin:0 0 12px!important}
#screen-lobby .lp{min-width:0!important;padding:9px 11px!important;border:1px solid var(--ky-line)!important;border-radius:5px!important;background:#151d24!important}.lobby-card .lp .nm{color:#eef1f3!important;font-size:10px!important}.lobby-card .lp .st{color:#84909a!important;font-size:8px!important}.lobby-card .lp .host{border-radius:3px!important;background:#2b3e50!important;color:#9dc7ed!important;font-size:7px!important}
#screen-lobby .botlevels{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;margin:0 0 12px!important;padding:0!important;border:0!important;background:transparent!important}.botlevels .bl-title{grid-column:1/-1!important;margin:0 0 3px!important;color:#89959e!important;font-size:8px!important;text-transform:uppercase!important}.botlevels .bl-btn{min-height:42px!important;padding:8px 11px!important;border:1px solid var(--ky-line)!important;border-radius:4px!important;background:#151d24!important;color:#edf1f3!important}.botlevels .bl-name{font-size:10px!important}.botlevels .bl-elo{border-radius:3px!important;background:#243646!important;color:#9fc7ea!important;font-size:7px!important}
#screen-lobby .lobby-controls{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important}.lobby-controls .btn{height:40px!important;border-radius:4px!important;font-size:10px!important}.lobby-hint{margin-top:8px!important;color:#75818a!important;font-size:8px!important;text-align:left!important}
#screen-lobby #btn-lobby-leave{height:32px!important;margin-top:4px!important;color:#7f8a93!important;font-size:9px!important;text-align:left!important}

@media(max-width:640px){
  #screen-lobby.active{padding:10px!important}
  #screen-lobby .lobby-card{width:100%!important;max-height:calc(100vh - 20px)!important;padding:18px!important}
  #screen-lobby .lobby-players,#screen-lobby .botlevels{grid-template-columns:1fr!important}
  #screen-lobby .botlevels .bl-title{grid-column:1!important}
}

#screen-profil .profile-content{overflow-y:auto!important;overflow-x:hidden!important}
#screen-profil .vest-grid{width:100%!important;min-width:0!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))!important;gap:10px!important}
#screen-profil .vest-card{width:auto!important;min-width:0!important;max-width:none!important}
.room-chat-panel{grid-template-rows:auto auto 1fr auto!important}
.room-chat-invite{min-height:37px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;padding:7px 9px;border-bottom:1px solid var(--ky-line);background:#0d1318}.room-chat-invite select{min-width:0;height:28px;padding:0 7px;border:1px solid #34414b;border-radius:3px;background:#151d24;color:#dbe1e5;font-size:8px}.room-chat-invite button{height:28px;padding:0 9px;border:1px solid #3f6380;border-radius:3px;background:#172a3a;color:#94c6ee;font-size:8px;font-weight:800;cursor:pointer}.room-chat-invite span{grid-column:1/-1;color:#6f7a83;font-size:8px}