/* POLICES : modifier --font-main (texte) et --cond (titres) dans :root ci-dessous ; le lien Google Fonts est dans index.html (<link ... fonts.googleapis.com>) */
:root{
  --bg:#07090e;--bg2:#0b0f17;--panel:rgba(14,18,28,0.72);--panel2:rgba(20,27,40,0.82);--panel3:rgba(28,38,56,0.88);
  --line:rgba(255,255,255,0.08);--line2:rgba(255,255,255,0.14);
  --text:#f3f4f6;--muted:#9ba1b0;--dim:#646b7a;
  --acc:#ffab1a;--acc-h:#ffbd42;--acc-d:#d97706;--acc-rgb:255,171,26;--on-acc:#0e0a02;
  --green:#10b981;--red:#f43f5e;--yellow:#f59e0b;--orange:#f97316;--blue:#3b82f6;
  --font-main:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --cond:'Inter Tight','Inter',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
}
:root{color-scheme:dark}
*{box-sizing:border-box;margin:0;padding:0;scrollbar-width:thin;scrollbar-color:#33363d transparent}
::-webkit-scrollbar{width:10px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#2c2f36;border-radius:8px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:#3a3e46}
::-webkit-scrollbar-corner{background:transparent}
[hidden]{display:none!important}
html,body{
  background-color:#07090e;
  background-image:
    radial-gradient(ellipse 90% 55% at 50% -12%,rgba(255,171,26,0.08) 0%,transparent 60%),
    radial-gradient(circle 800px at 15% 85%,rgba(59,130,246,0.04) 0%,transparent 50%),
    linear-gradient(180deg,#090c14 0%,#06080c 100%);
  background-attachment:fixed;
}
body{color:var(--text);font-family:var(--font-main);font-size:14px;line-height:1.5;letter-spacing:-0.01em;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
button{font:inherit;color:inherit}
.tx{font-style:normal}
.pos{color:var(--green)}.neg{color:var(--red)}.mid{color:var(--text)}

/* ---------- Structure ---------- */
.app{display:grid;grid-template-columns:64px minmax(0,1fr);min-height:100vh}
.main{min-width:0}
.rail{background:var(--bg2);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:14px 0;gap:4px;position:sticky;top:0;height:100vh;z-index:30}
.logo{width:38px;height:38px;border-radius:6px;background:var(--acc);display:grid;place-items:center;font-family:var(--cond);font-weight:700;font-size:15px;color:var(--on-acc);margin-bottom:16px}
.rail-btn{width:44px;height:44px;border-radius:6px;display:grid;place-items:center;color:var(--dim);cursor:pointer;border:none;background:none;position:relative;transition:color .15s,background .15s}
.rail-btn:hover{color:var(--text);background:var(--panel)}
.rail-btn.active{color:var(--text);background:var(--panel2)}
.rail-btn.active::before{content:"";position:absolute;left:-10px;top:10px;bottom:10px;width:3px;background:var(--acc)}
.rail-btn svg{width:20px;height:20px}
.rail .spacer{flex:1}

.top{display:flex;align-items:center;gap:22px;padding:0 28px;height:60px;border-bottom:1px solid var(--line);background:var(--bg2);position:sticky;top:0;z-index:20}
.brand{font-family:var(--cond);font-weight:700;letter-spacing:.048em;font-size:19px}
.brand b{color:var(--acc);font-weight:800}
.concept{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.04em;padding:3px 7px;border-radius:3px;background:var(--panel2);color:var(--muted)}
.tabs{display:flex;height:100%}
.tab{display:flex;align-items:center;padding:0 14px;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:15px;letter-spacing:.016em;text-transform:uppercase;cursor:pointer;border-bottom:2px solid transparent;transition:color .15s}
.tab:hover{color:var(--text)}
.tab.active{color:var(--text);border-bottom-color:var(--acc)}
.grow{flex:1}
.online{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--muted)}
.online b{color:var(--text);font-variant-numeric:tabular-nums;font-weight:500}
.dot{width:7px;height:7px;border-radius:50%;background:var(--green)}
.icon-btn{width:38px;height:38px;border-radius:6px;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center;color:var(--muted);cursor:pointer;position:relative}
.icon-btn svg{width:17px;height:17px}
.icon-btn i{position:absolute;top:8px;right:8px;width:6px;height:6px;border-radius:50%;background:var(--orange)}
.profile{display:flex;align-items:center;gap:10px;padding:4px 4px 4px 12px;border-radius:6px;cursor:pointer;transition:background .15s}
.profile:hover{background:var(--panel)}
.profile .meta{text-align:right;line-height:1.25}
.profile .top-name-row{display:flex;align-items:center;justify-content:flex-end;gap:5px}
.profile .top-badges{display:inline-flex;align-items:center;gap:3px}
.profile .top-badges:empty{display:none}
.profile .top-badges .pb{font-size:9px;font-weight:800;padding:1px 4.5px;line-height:1.15;letter-spacing:.05em;margin:0;display:inline-flex;align-items:center;gap:2.5px}
.profile .top-badges .pb svg{width:8.5px;height:8.5px;flex-shrink:0}
.profile .top-badges .pb.pb-more{font-size:8.5px;padding:1px 3.5px}
.profile .name{font-weight:700;font-size:14px}
.profile .elo{font-size:12px;color:var(--muted)}

.avatar{width:36px;height:36px;border-radius:4px;display:grid;place-items:center;font-family:var(--cond);font-weight:700;font-size:16px;color:#fff;flex-shrink:0;background-size:cover;background-position:center;background-repeat:no-repeat}
.avatar:not(.big),.pa,.md-av,.p-av{overflow:hidden}
.avatar>img,.pa>img,.md-av>img,.p-av>img{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important;border-radius:inherit;display:block}
.lvl{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;position:relative;flex-shrink:0;font-family:var(--cond);font-weight:700;font-size:13px;line-height:1;user-select:none;font-variant-numeric:tabular-nums;vertical-align:middle}
.lvl svg{width:100%;height:100%;display:block;overflow:visible}
.lvl .lvl-n{position:absolute;inset:0;display:grid;place-items:center;letter-spacing:-.02em}
.lvl.lvl-10 .lvl-n{font-size:12px;letter-spacing:-.05em}
.lvl.lvl-lg{width:52px;height:52px;font-size:22px}
.lvl.lvl-lg.lvl-10 .lvl-n{font-size:20px}
.tf{display:inline-flex;align-items:center;gap:4px;font-family:var(--cond);font-weight:700;font-size:13px;color:var(--c);font-variant-numeric:tabular-nums}
.tf svg{width:13px;height:13px}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:10px;border:1px solid var(--line2);background:var(--panel2);font-family:var(--font-main);font-weight:600;font-size:13px;cursor:pointer;transition:all .18s cubic-bezier(0.16,1,0.3,1);white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.btn:hover{background:var(--panel3);border-color:rgba(255,255,255,.2);transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.btn:active{transform:translateY(1px);box-shadow:none}
.btn.primary{background:linear-gradient(180deg,#ffbd42 0%,#ff9e1f 100%);border:1px solid rgba(255,255,255,.18);color:#0e0a02;font-weight:700;box-shadow:0 1px 2px rgba(0,0,0,.3),0 3px 10px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.primary:hover{background:linear-gradient(180deg,#ffc654 0%,#ffa72b 100%);border-color:rgba(255,255,255,.3);box-shadow:0 0 0 1px rgba(255,171,26,.4),0 4px 14px rgba(0,0,0,.5),0 6px 18px rgba(255,171,26,.12),inset 0 1px 0 rgba(255,255,255,.45)}
.btn.danger{background:linear-gradient(180deg,#f43f5e 0%,#e11d48 100%);border:1px solid rgba(255,255,255,.15);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.3),0 3px 10px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.25)}
.btn.danger:hover{background:linear-gradient(180deg,#fb7185 0%,#f43f5e 100%);border-color:rgba(255,255,255,.25);box-shadow:0 0 0 1px rgba(244,63,94,.4),0 4px 14px rgba(0,0,0,.5),0 6px 18px rgba(244,63,94,.12),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.ghost{background:transparent;border-color:var(--line2)}
.btn.ghost:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.25)}
.btn.sm{height:32px;padding:0 12px;font-size:12px;border-radius:8px}
.btn svg{width:16px;height:16px}
.btn:disabled{opacity:.5;cursor:default;transform:none!important;box-shadow:none!important}
.link{background:none;border:none;color:var(--acc);font-weight:700;cursor:pointer;font-size:13px;transition:color .15s}
.link:hover{color:var(--acc-h);text-decoration:underline}
.flag-btn{width:28px;height:28px;border-radius:6px;border:none;background:transparent;color:var(--dim);cursor:pointer;display:grid;place-items:center;transition:.15s;flex-shrink:0}
.flag-btn svg{width:14px;height:14px}
.flag-btn:hover{color:var(--red);background:rgba(239,85,96,.12)}
.flag-btn.done{color:var(--red);cursor:default}

/* ---------- Bandeau recherche ---------- */
.banner{display:flex;align-items:center;justify-content:center;gap:12px;height:0;overflow:hidden;font-size:13px;color:var(--muted);background:var(--panel);border-bottom:1px solid transparent;transition:height .25s}
.banner.on{height:40px;border-color:var(--line)}
.banner b{color:var(--text);font-variant-numeric:tabular-nums}
.spin{width:13px;height:13px;border:2px solid var(--line2);border-top-color:var(--acc);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}
.spin.inl{display:inline-block;vertical-align:-2px}

/* ---------- Commun ---------- */
.page{max-width:1280px;margin:0 auto;padding:26px 28px 48px;animation:fade .3s}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 8px 28px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.05)}
.h3{font-family:var(--cond);font-weight:700;font-size:18px;letter-spacing:.02em;text-transform:uppercase;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center;gap:10px;color:#fff}
.h3 span{font-family:var(--font-main);text-transform:none;letter-spacing:0;font-weight:500;font-size:12px;color:var(--muted)}
.label{font-family:var(--font-main);font-size:13px;font-weight:700;color:var(--muted);margin-bottom:10px;display:flex;justify-content:space-between;align-items:center}
.label span{letter-spacing:0;text-transform:none;font-weight:500;color:var(--dim);font-size:12px}
.pill{font-family:var(--font-main);font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.pill b{color:#fff;font-weight:700}
.h1{font-family:var(--cond);font-size:36px;font-weight:700;letter-spacing:.008em;text-transform:uppercase;color:#fff}
.wl{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;font-family:var(--cond);font-size:12px;font-weight:700}
.wl.w{background:rgba(16,185,129,.16);color:var(--green);border:1px solid rgba(16,185,129,.3)}
.wl.l{background:rgba(244,63,94,.16);color:var(--red);border:1px solid rgba(244,63,94,.3)}
.bar{height:6px;border-radius:3px;background:var(--panel3);overflow:hidden}
.bar i{display:block;height:100%;background:var(--acc);transition:width .8s ease}
.lvlbar{margin-top:14px}
.lvlbar .row{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:6px}

/* ---------- Jouer ---------- */
.modes{display:flex;gap:10px;border-bottom:none;margin-bottom:22px;padding:6px;background:rgba(12,16,24,.6);border-radius:14px;border:1px solid var(--line);backdrop-filter:blur(12px);overflow-x:auto;scrollbar-width:none}
.modes::-webkit-scrollbar{display:none}
.mode{flex:1;min-width:140px;padding:12px 18px;cursor:pointer;border-radius:10px;border:1px solid transparent;background:transparent;white-space:nowrap;transition:all .2s cubic-bezier(0.16,1,0.3,1);position:relative}
.mode .tag{font-family:var(--font-main);font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--dim);text-transform:uppercase;transition:color .18s}
.mode .nm{font-family:var(--cond);font-size:20px;font-weight:700;letter-spacing:.016em;color:var(--muted);text-transform:uppercase;margin-top:2px;transition:color .18s}
.mode .ds{font-size:12px;color:var(--dim);margin-top:3px;line-height:1.3;white-space:normal}
.mode:hover{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.06)}
.mode:hover .nm{color:#fff}
.mode.active{background:linear-gradient(180deg,rgba(255,171,26,.08) 0%,rgba(255,171,26,.01) 100%);border-color:rgba(255,171,26,.45);box-shadow:0 0 0 1px rgba(255,171,26,.2),0 4px 16px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.06)}
.mode.active .nm{color:#fff;text-shadow:none}
.mode.active .tag{color:var(--acc)}
.mode.active .ds{color:var(--muted)}

.stage{background:rgba(14,18,28,.75);border:1px solid var(--line);border-radius:18px;padding:24px 26px 28px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 12px 40px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.05)}
.stage-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.stage-head .ttl{font-family:var(--cond);font-weight:700;letter-spacing:.024em;font-size:18px;text-transform:uppercase;color:#fff}
.stage-head .right{display:flex;gap:8px;flex-wrap:wrap}
.party{display:flex;justify-content:center;gap:14px;margin-bottom:20px}
.pcard{position:relative;flex:0 1 204px;min-width:0;border-radius:14px;background:linear-gradient(180deg,rgba(23,29,44,.75) 0%,rgba(14,18,28,.85) 100%);border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;animation:fade .25s backwards;box-shadow:0 8px 24px rgba(0,0,0,.3);transition:transform .25s cubic-bezier(0.16,1,0.3,1),border-color .2s,box-shadow .25s}
.pcard:hover:not(.empty){transform:translateY(-3px);border-color:var(--line2);box-shadow:0 12px 32px rgba(0,0,0,.5)}
.pcard.me{border-color:rgba(255,171,26,.55);box-shadow:0 0 0 1px rgba(255,171,26,.25),0 8px 24px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1)}
.pcard .bn{height:72px;background-size:cover;background-position:center;position:relative}
.pcard .bn::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,18,28,.1) 0%,rgba(14,18,28,.95) 100%)}
.pcard .big{width:76px;height:76px;font-size:32px;border-radius:12px;margin:-42px auto 0;position:relative;z-index:1;border:3px solid rgba(18,23,36,.95);box-shadow:0 4px 16px rgba(0,0,0,.5)}
.pcard .big .lvl{position:absolute;right:-9px;bottom:-9px;width:30px;height:30px;font-size:13px}
.pcard .pname{font-family:var(--cond);font-weight:700;font-size:19px;letter-spacing:.008em;text-align:center;margin-top:10px;padding:0 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.pcard-badges{display:flex;align-items:center;justify-content:center;gap:4px;margin:5px auto 0;padding:0 8px;flex-wrap:wrap;max-width:100%}
.pcard-badges:empty{display:none}
.pcard-badges .pb{font-size:9.5px;font-weight:800;padding:2px 6px;border-radius:4px;line-height:1.2;margin:0;letter-spacing:.05em;max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:3px}
.pcard-badges .pb svg{width:10px;height:10px;flex-shrink:0}
.pcard-badges .pb.pb-more{font-size:9px;padding:2px 5px;max-width:none}
.pcard .prole{font-size:12px;color:var(--muted);text-align:center;margin-top:3px;display:flex;justify-content:center;align-items:center;gap:5px;white-space:nowrap}
.pcard .psteam{display:block;text-align:center;margin-top:4px;font-size:11px;color:var(--red)}
.pcard .pfoot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-top:1px solid var(--line);margin-top:16px;font-size:12px;color:var(--muted);background:rgba(10,13,20,.4)}
.pcard .pfoot b{font-family:var(--cond);font-size:18px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.pcard .x{position:absolute;top:8px;right:8px;z-index:2;width:26px;height:26px;border-radius:6px;border:none;background:rgba(0,0,0,.65);color:var(--muted);cursor:pointer;display:grid;place-items:center;opacity:0;transition:.18s}
.pcard .x svg{width:14px;height:14px}
.pcard:hover .x{opacity:1}
.pcard .x:hover{color:var(--red);background:rgba(239,85,96,.2)}

.pcard.empty{border:1.5px dashed rgba(255,255,255,.15);background:rgba(14,18,28,.35);justify-content:center;align-items:center;cursor:pointer;color:var(--dim);gap:12px;min-height:220px;transition:all .25s cubic-bezier(0.16,1,0.3,1)}
.pcard.empty .plus{width:48px;height:48px;border-radius:50%;border:1.5px dashed rgba(255,255,255,.25);display:grid;place-items:center;font-size:26px;font-weight:300;color:var(--dim);transition:all .2s ease}
.pcard.empty span{font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.032em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.pcard.empty:hover{color:#fff;border-color:rgba(255,171,26,.5);background:rgba(255,171,26,.04);transform:translateY(-2px);box-shadow:0 0 0 1px rgba(255,171,26,.2),0 8px 24px rgba(0,0,0,.4)}
.pcard.empty:hover .plus{border-color:var(--acc);color:var(--acc);transform:scale(1.08)}
.pcard.empty:hover span{color:#fff}
.searching-on .pcard:not(.empty){border-color:var(--line2)}
.crown{color:var(--yellow);display:inline-flex}
.crown svg{width:13px;height:13px}

.launch{max-width:540px;margin:24px auto 0}
.regions{display:flex;gap:8px;margin-bottom:12px}
.chip{flex:1;text-align:center;padding:9px 0;border-radius:10px;background:rgba(18,23,34,.65);font-family:var(--cond);font-size:15px;font-weight:700;letter-spacing:.016em;color:var(--muted);cursor:pointer;border:1px solid var(--line);transition:all .18s ease}
.chip:hover{color:#fff;border-color:var(--line2);background:rgba(255,255,255,.05)}
.chip.active{color:#fff;border-color:var(--acc);background:linear-gradient(180deg,rgba(255,171,26,.12) 0%,rgba(255,171,26,.02) 100%);box-shadow:0 0 0 1px rgba(255,171,26,.25),0 2px 8px rgba(0,0,0,.35)}
.chip small{display:block;font-family:var(--font-main);font-size:11px;font-weight:600;margin-top:2px;color:var(--dim)}
.chip.active small{color:var(--muted)}

.find{position:relative;width:100%;height:66px;border:1px solid rgba(255,255,255,.2);border-radius:14px;cursor:pointer;color:#0e0a02;background:linear-gradient(180deg,#ffbd42 0%,#f59e0b 60%,#d97706 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.5),0 4px 16px rgba(245,158,11,.12),inset 0 1px 0 rgba(255,255,255,.45);transition:transform .2s cubic-bezier(0.16,1,0.3,1),box-shadow .2s ease,filter .2s ease}
.find:hover{transform:translateY(-1px);filter:brightness(1.04);border-color:rgba(255,255,255,.35);box-shadow:0 0 0 1px rgba(255,190,66,.5),0 4px 10px rgba(0,0,0,.4),0 12px 28px rgba(0,0,0,.6),0 8px 24px rgba(245,158,11,.14),inset 0 1px 0 rgba(255,255,255,.5)}
.find:active{transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.5),inset 0 1px 2px rgba(0,0,0,.2)}
.find .fl{font-family:var(--cond);font-weight:900;font-size:24px;letter-spacing:.032em;line-height:1;text-shadow:none}
.find .t{font-family:var(--font-main);font-size:12px;font-weight:600;opacity:.88}
.find.searching{color:#fff;background:#0d1017;border:1px solid rgba(255,171,26,.5);box-shadow:0 0 0 1px rgba(255,171,26,.25),0 8px 24px rgba(0,0,0,.7)}
.find.searching .t{color:var(--muted);opacity:1}
.find.searching:hover .t{color:var(--red)}
.find.searching::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:35%;background:linear-gradient(90deg,transparent,var(--acc),transparent);animation:scan 1.4s ease-in-out infinite}
.find b{font-variant-numeric:tabular-nums;color:var(--acc)}
.stats{display:flex;justify-content:center;gap:18px;margin-top:14px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.stat{display:flex;align-items:center;gap:6px}
.stat b{color:#fff;font-variant-numeric:tabular-nums;font-weight:600}
.stat svg{width:14px;height:14px}
.stat.ac{color:var(--green)}

.pool{margin-top:28px}
.maps{display:flex;flex-direction:column;gap:14px}
.maps-in{display:grid;grid-template-columns:repeat(auto-fill,minmax(154px,1fr));gap:10px}
.mg-t{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.048em;text-transform:uppercase;color:var(--dim);margin-bottom:8px}
.pool-tools{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:-2px 0 14px}
.seg-l{font-size:12px;color:var(--dim);padding:0 6px 0 8px;align-self:center}
.mwr{position:absolute;right:8px;bottom:7px;z-index:2;font-family:var(--cond);font-weight:700;font-size:14px;color:var(--acc)}
.map{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;cursor:pointer;border:2px solid var(--acc);transition:all .2s cubic-bezier(0.16,1,0.3,1);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.map .bg{position:absolute;inset:0;transition:filter .2s,transform .4s}
.map:hover .bg{transform:scale(1.06)}
.map:hover{box-shadow:0 8px 24px rgba(0,0,0,.5)}
.map::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.88),rgba(0,0,0,0) 65%)}
.map .mn{position:absolute;left:10px;bottom:8px;z-index:2;font-family:var(--cond);font-weight:700;font-size:17px;letter-spacing:.024em;text-transform:uppercase;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.map .tick{position:absolute;top:8px;right:8px;z-index:2;width:22px;height:22px;border-radius:6px;background:var(--acc);display:grid;place-items:center;color:var(--on-acc);box-shadow:0 2px 6px rgba(0,0,0,.3)}
.map .tick svg{width:13px;height:13px}
.map.off{border-color:transparent;opacity:.65}
.map.off .bg{filter:grayscale(1) brightness(.3)}
.map.off:hover{opacity:.85}
.map.off .tick{background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.2)}
.map.off .tick svg{opacity:0}
.map.off .mn{color:var(--muted)}

/* ---------- Lobby ---------- */
.lobby-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
.lobby-top .label{margin:0 0 2px}
.versus{display:grid;grid-template-columns:minmax(0,1fr) 320px minmax(0,1fr);gap:14px;margin-top:18px;align-items:start}
.team{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.05)}
.team-h{padding:12px 16px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}
.team.a{border-top:1px solid rgba(88,166,255,.5);box-shadow:0 8px 24px rgba(0,0,0,.35),0 0 0 1px rgba(88,166,255,.15),inset 0 1px 0 rgba(88,166,255,.2)}
.team.b{border-top:1px solid rgba(244,63,94,.5);box-shadow:0 8px 24px rgba(0,0,0,.35),0 0 0 1px rgba(244,63,94,.15),inset 0 1px 0 rgba(244,63,94,.2)}
.team-h h3{font-family:var(--cond);font-size:17px;font-weight:700;letter-spacing:.016em}
.team-h span{font-size:12px;color:var(--muted)}
.prow{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 16px;border-bottom:1px solid var(--line);animation:fade .3s backwards}
.prow:last-child{border-bottom:none}
.prow.me{background:rgba(var(--acc-rgb),.07)}
.who{flex:1;min-width:0}
.pn{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:5px}
.ps{font-size:12px;color:var(--muted);margin-top:1px}
.pe{font-family:var(--cond);font-weight:700;font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums;width:42px;text-align:right}
.mapbig{height:170px;border-radius:6px;position:relative;overflow:hidden;border:1px solid var(--line)}
.mapbig .bg{position:absolute;inset:0}
.mapbig::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.85),rgba(0,0,0,.05) 70%)}
.mb-info{position:absolute;left:16px;bottom:12px;z-index:2}
.mb-info span{font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.056em;color:var(--muted)}
.mb-info b{display:block;font-family:var(--cond);font-size:30px;font-weight:700;letter-spacing:.024em;text-transform:uppercase}
.vs{position:absolute;top:10px;right:10px;z-index:2;font-family:var(--cond);font-weight:700;font-size:13px;padding:3px 8px;border-radius:3px;background:rgba(0,0,0,.65);letter-spacing:.032em}
.info{margin-top:12px}
.irow{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:8px 0;border-bottom:1px solid var(--line)}
.irow span{color:var(--muted)}
.irow b{font-weight:500;text-align:right}
.stakes{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0 8px}
.stakes div{border-radius:4px;padding:8px;text-align:center;font-family:var(--cond);font-weight:700;font-size:19px;background:var(--panel2)}
.stakes small{display:block;font-family:var(--font-main);font-size:11px;font-weight:500;color:var(--muted)}
.win{color:var(--green)}.loss{color:var(--red)}
.perf-note{font-size:11px;color:var(--dim);line-height:1.45;margin-bottom:12px}
.connect{width:100%;height:50px;border:none;border-radius:5px;background:var(--acc);color:var(--on-acc);font-family:var(--cond);font-weight:700;font-size:19px;letter-spacing:.032em;cursor:pointer}
.connect:hover{background:var(--acc-h)}
.ip{margin-top:8px;font-family:var(--font-mono);font-size:12px;color:var(--dim);text-align:center}
.sim{width:100%;margin-top:10px;height:40px;border-radius:5px;border:1px dashed var(--line2);background:transparent;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.02em;cursor:pointer}
.sim:hover{color:var(--text);border-color:var(--muted)}
.sim small{font-family:var(--font-main);font-weight:400;letter-spacing:0;opacity:.7}

/* ---------- Tableaux ---------- */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;border:1px solid var(--line);box-shadow:0 4px 16px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.04);background:rgba(12,16,24,.4)}
table.tbl{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums;min-width:680px}
.tbl th{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;color:rgba(255,255,255,.45);text-align:right;padding:12px 14px;border-bottom:1px solid var(--line);background:rgba(10,13,20,.5);white-space:nowrap}
.tbl th:first-child,.tbl td:first-child{text-align:left}
.tbl td{padding:12px 14px;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap;transition:background .15s}
.tbl tbody tr:hover td{background:rgba(255,255,255,.025)}
.tbl tbody tr:last-child td{border-bottom:none}
.tbl tr.me td{background:rgba(var(--acc-rgb),.09)}
.tbl .pl{display:flex;align-items:center;gap:10px;font-weight:700}
.tbl .pl .avatar{width:30px;height:30px;font-size:13px;border-radius:6px}
.tbl .pl .lvl{width:24px;height:24px;font-size:11px}
.rt{font-family:var(--cond);font-weight:700;font-size:15px}

/* ---------- Résultat ---------- */
.res-head{position:relative;border-radius:6px;padding:26px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;overflow:hidden;border:1px solid var(--line)}
.res-head .bg{position:absolute;inset:0}
.res-head::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,6,.95),rgba(5,5,6,.7) 55%,rgba(5,5,6,.92))}
.res-head>*{position:relative;z-index:1}
.res-tag{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--muted)}
.res-title{font-family:var(--cond);font-weight:700;font-size:46px;letter-spacing:.012em;line-height:1.05;margin-top:2px}
.res-title.w{color:var(--green)}.res-title.l{color:var(--red)}
.res-score{font-family:var(--cond);font-weight:700;font-size:54px;font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:14px}
.res-score i{font-style:normal;color:var(--dim);font-size:30px}
.res-score .a{color:var(--blue)}.res-score .b{color:var(--red)}
.res-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:12px;margin:12px 0}
.elo-big{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.elo-big b{font-family:var(--cond);font-weight:700;font-size:44px;font-variant-numeric:tabular-nums}
.elo-big .d{font-family:var(--cond);font-weight:700;font-size:26px}
.elo-big small{color:var(--muted);font-size:13px}
.breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:14px}
.bk{background:var(--panel2);border-radius:4px;padding:10px 12px}
.bk span{display:block;font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;color:var(--muted)}
.bk b{display:block;font-family:var(--cond);font-weight:700;font-size:21px;margin-top:2px;font-variant-numeric:tabular-nums}
.bk small{display:block;font-size:11px;color:var(--dim);margin-top:1px}
.mvp{display:flex;align-items:center;gap:14px}
.mvp .avatar{width:60px;height:60px;font-size:26px}
.mvp-tag{font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.048em;color:var(--yellow)}
.mvp-n{font-family:var(--cond);font-weight:700;font-size:24px}
.mvp-s{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:14px}
.board{margin-top:12px;padding:0;overflow:hidden}
.board .bh{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line)}
.board .bh h3{font-family:var(--cond);font-size:17px;font-weight:700;letter-spacing:.016em}
.board.a{border-top:1px solid rgba(88,166,255,.45);box-shadow:0 8px 24px rgba(0,0,0,.35),0 0 0 1px rgba(88,166,255,.12),inset 0 1px 0 rgba(88,166,255,.18)}.board.b{border-top:1px solid rgba(244,63,94,.45);box-shadow:0 8px 24px rgba(0,0,0,.35),0 0 0 1px rgba(244,63,94,.12),inset 0 1px 0 rgba(244,63,94,.18)}
.res-actions{display:flex;gap:10px;justify-content:center;margin-top:22px}
.res-actions .find{width:300px;height:52px}
.res-actions .find .fl{font-size:19px}
.res-actions .btn{height:52px}

/* ---------- Profil ---------- */
.p-hero{border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--panel);box-shadow:0 12px 36px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.05)}
.p-banner{height:210px;background-size:cover;background-position:center;position:relative}
.p-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--panel),rgba(13,17,23,0) 70%);pointer-events:none;z-index:1}
.p-banner > .btn{position:absolute;top:12px;right:12px;z-index:2;background:rgba(0,0,0,.6);border-color:rgba(255,255,255,.15)}
.p-row{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:end;padding:0 24px 22px;margin-top:-62px;position:relative;z-index:1}
.p-av{width:124px;height:124px;border-radius:6px;display:grid;place-items:center;font-family:var(--cond);font-weight:700;font-size:54px;color:#fff;border:4px solid var(--panel);background-size:cover;background-position:center;position:relative}
.p-av .on{position:absolute;right:-6px;bottom:-6px;width:20px;height:20px;border-radius:50%;background:var(--green);border:4px solid var(--panel)}
.p-name{font-family:var(--cond);font-weight:700;font-size:34px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;line-height:1.1}
.flag{width:24px;height:16px;border-radius:2px;background:linear-gradient(90deg,#2b4fd6 33%,#f1f1f1 33% 66%,#e2323e 66%);display:inline-block}
.prem{font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.04em;padding:3px 8px;border-radius:3px;background:var(--yellow);color:#231700}
.steam{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.steam .ok{display:flex;align-items:center;gap:6px;color:var(--green);font-weight:700}
.steam .ok svg{width:15px;height:15px}
.steam code{font-family:var(--font-mono);font-size:12px;color:var(--dim)}
.btn.steam-btn{background:#1b2838;border-color:#2a475e;color:#c7d5e0}
.btn.steam-btn:hover{background:#2a475e;color:#fff}
.p-since{font-size:12px;color:var(--dim);margin-top:6px}
.p-lvl{min-width:220px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:14px 16px;box-shadow:0 4px 14px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.05)}
.p-lvl .top2{display:flex;align-items:center;gap:12px}
.p-lvl .lvl{width:52px;height:52px;font-size:22px}
.p-lvl .lvl.lvl-10 .lvl-n{font-size:20px}
.p-lvl .elo{font-family:var(--cond);font-weight:700;font-size:28px;font-variant-numeric:tabular-nums;line-height:1}
.p-lvl .elo small{font-family:var(--font-main);font-size:12px;font-weight:500;color:var(--muted)}
.tiles{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin:12px 0}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;box-shadow:0 2px 8px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.04);transition:border-color .15s,transform .15s}
.tile:hover{border-color:var(--line2);transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.tile span{display:block;font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.tile b{display:block;font-family:var(--cond);font-weight:700;font-size:26px;margin-top:2px;font-variant-numeric:tabular-nums}
.tile small{display:block;font-size:11px;color:var(--dim)}
.p-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px}
.p-grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:12px;align-items:start}
.p-grid2.solo>.card{grid-column:1/-1}
.hist-card{margin-top:12px}
.hist-card table.tbl{min-width:620px}
.chart svg{width:100%;height:auto;display:block}
.form{display:flex;gap:4px;margin-top:12px;flex-wrap:wrap}
.mrow{display:grid;grid-template-columns:86px 1fr 46px 46px;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px;font-variant-numeric:tabular-nums}
.mrow:last-child{border-bottom:none}
.mrow .mn{font-family:var(--cond);font-weight:700;text-transform:uppercase;font-size:14px}
.mrow .bar i{background:var(--green)}
.mrow .r{text-align:right;color:var(--muted)}
.mrow .r b{color:var(--text);font-weight:500}
.more{display:flex;justify-content:center;align-items:center;gap:12px;padding:12px 0 2px;border-top:1px solid var(--line);margin-top:4px;font-size:12px;color:var(--dim)}
.locked{text-align:center;padding:50px 20px;color:var(--muted);margin-top:12px;line-height:1.6}
.locked b{display:block;font-family:var(--cond);font-size:22px;color:var(--text);margin-bottom:6px;text-transform:uppercase}
.locked .btn{margin-top:16px}

/* Trust factor */
.tf-big{display:flex;align-items:center;gap:16px}
.tf-score{font-family:var(--cond);font-weight:700;font-size:46px;line-height:1;color:var(--c);font-variant-numeric:tabular-nums}
.tf-score small{font-size:18px;color:var(--dim)}
.tf-tier{display:inline-block;font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;color:var(--c);padding:3px 8px;border-radius:3px;background:color-mix(in srgb,var(--c) 14%,transparent)}
.tf-scale,.tf-legend{display:grid;grid-template-columns:4fr 2fr 2fr 2fr;gap:3px}
.tf-scale{margin:16px 0 6px}
.tf-scale i{height:6px;border-radius:2px;opacity:.25}
.tf-scale i.on{opacity:1}
.tf-legend{font-size:11px;color:var(--dim)}
.tf-legend span:last-child{display:flex;justify-content:space-between}
.tf-lines{margin-top:14px;font-size:13px;color:var(--muted);line-height:1.6}
.tf-lines b{color:var(--text);font-weight:500}
.tf-lines code{font-family:var(--font-mono);font-size:12px;background:var(--panel2);padding:2px 6px;border-radius:3px;color:var(--text)}
.rep-list{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:12px}
.rep-list div{display:flex;justify-content:space-between;background:var(--panel2);border-radius:4px;padding:7px 10px;font-size:12px;color:var(--muted)}
.rep-list b{color:var(--text);font-weight:500}

/* ---------- Modales ---------- */
.overlay{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:rgba(4,6,10,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .2s;padding:16px}
.overlay.on{opacity:1;pointer-events:auto}
.modal{width:min(480px,100%);max-height:calc(100vh - 32px);overflow:auto;background:rgba(16,21,33,.96);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:28px 26px 24px;transform:translateY(8px);transition:transform .2s;box-shadow:0 24px 64px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.06),inset 0 1px 0 rgba(255,255,255,.1)}
.overlay.on .modal{transform:none}
.modal.wide{width:min(640px,100%)}
.m-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.m-h h3{font-family:var(--cond);font-size:24px;font-weight:700;text-transform:uppercase;letter-spacing:.016em;color:#fff}
.x2{width:34px;height:34px;border:none;background:var(--panel2);border-radius:8px;cursor:pointer;color:var(--muted);font-size:20px;line-height:1;display:grid;place-items:center;transition:all .15s}
.x2:hover{color:#fff;background:var(--panel3)}
.m-f{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;flex-wrap:wrap}
.m-f .grow{flex:1}

.found{text-align:center}
.found-tag{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.064em;color:var(--green)}
.found-t{font-family:var(--cond);font-size:40px;font-weight:700;letter-spacing:.016em;margin-top:2px}
.found-s{color:var(--muted);font-size:13px;margin-top:2px}
.ring{position:relative;width:110px;height:110px;margin:20px auto 16px}
.ring svg{transform:rotate(-90deg);width:100%;height:100%}
.ring circle{fill:none;stroke-width:7}
.ring .bgc{stroke:var(--line2)}
.ring .fg{stroke:var(--green);transition:stroke .3s}
.ring .num{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--cond);font-size:38px;font-weight:700}
.accepts{display:flex;justify-content:center;gap:5px;margin-bottom:8px;flex-wrap:wrap}
.acc{width:28px;height:6px;border-radius:2px;background:var(--line2);transition:.25s}
.acc.ok{background:var(--green)}.acc.no{background:var(--red)}
.f-status{font-size:13px;color:var(--muted);margin-bottom:18px;min-height:18px}
.accept-btn{width:100%;height:56px;border:none;border-radius:5px;background:var(--green);color:#062214;font-family:var(--cond);font-weight:700;font-size:22px;letter-spacing:.04em;cursor:pointer}
.accept-btn:hover{filter:brightness(1.08)}
.accept-btn:disabled{opacity:.5;cursor:default}

.rep-who{display:flex;align-items:center;gap:12px;padding:12px;background:var(--panel2);border-radius:5px}
.rep-who .avatar{width:42px;height:42px;font-size:18px}
.rep-who b{font-family:var(--cond);font-size:18px}
.rep-who .ps{display:flex;gap:10px}
.reasons{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:14px}
.reason{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:5px;border:1px solid var(--line2);background:transparent;cursor:pointer;text-align:left;font-weight:500;font-size:13px;transition:.15s}
.reason:hover{border-color:var(--muted)}
.reason.on{border-color:var(--red);background:rgba(239,85,96,.08)}
.reason i{width:14px;height:14px;border-radius:50%;border:2px solid var(--line2);flex-shrink:0}
.reason.on i{border-color:var(--red);background:var(--red);box-shadow:inset 0 0 0 2px var(--panel)}
textarea.note{width:100%;margin-top:10px;min-height:70px;resize:vertical;background:var(--bg2);border:1px solid var(--line2);border-radius:5px;padding:10px;color:var(--text);font:inherit;font-size:13px}
textarea.note:focus{outline:none;border-color:var(--acc)}
.m-hint{font-size:12px;color:var(--dim);margin-top:10px;line-height:1.5}

.ed-prev{border-radius:6px;overflow:hidden;border:1px solid var(--line);background:var(--panel2)}
/* aperçu de l'éditeur : accroché aux identifiants (la classe pb est celle des badges, et le JS remplace les classes de #edAv) */
.ed-prev #edBanner{display:block;position:static;margin:0;padding:0;border-radius:0;height:120px;background-size:cover;background-position:center}
.ed-prev #edAv{position:relative;z-index:1;width:76px;height:76px;min-width:76px;margin:-38px 0 12px 16px;border:3px solid var(--panel2);border-radius:6px;display:grid;place-items:center;font-family:var(--cond);font-weight:700;font-size:32px;color:#fff;background-size:cover;background-position:center}
.ed-sec{margin-top:16px}
.ed-sec .label{margin-bottom:8px}
.ed-opts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.sw{width:34px;height:34px;border-radius:4px;border:2px solid transparent;cursor:pointer}
.sw.on{border-color:#fff}
.bp{width:86px;height:40px;border-radius:4px;border:2px solid transparent;cursor:pointer;background-size:cover;background-position:center;position:relative;overflow:hidden}
.bp span{position:absolute;left:4px;bottom:2px;font-family:var(--cond);font-size:10px;font-weight:700;text-transform:uppercase;text-shadow:0 1px 2px #000}
.bp.on{border-color:#fff}
.upl{position:relative;overflow:hidden}
.upl input{position:absolute;inset:0;opacity:0;cursor:pointer}
.ed-name-row{display:flex;gap:8px;align-items:center}
.ed-name-in{flex:1;height:38px;padding:0 12px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:600 14px var(--font-main)}
.ed-name-in:focus{outline:none;border-color:var(--acc)}
.ed-name-in:disabled{opacity:.55;cursor:not-allowed;color:var(--muted)}
.ed-cd-pill{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;padding:3px 8px;border-radius:3px;background:var(--panel3);color:var(--muted)}
.ed-cd-pill.ok{color:var(--green);background:rgba(63,207,142,.12)}
.ed-cd-pill.lock{color:var(--orange);background:rgba(255,138,61,.12)}
.ed-name-msg{font-size:12px;color:var(--dim);margin-top:6px;line-height:1.4}
.ed-name-msg.err{color:var(--red)}
.ed-name-msg.ok{color:var(--green)}

/* ---------- Config CS:GO Cloud (Viewmodel, Binds, Autoexec) ---------- */
.cfg-card{margin-top:12px}
.cfg-status{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-radius:5px;background:var(--panel2);border:1px solid var(--line);margin-bottom:14px;flex-wrap:wrap;font-size:13px}
.cfg-status.restored{border-color:rgba(var(--acc-rgb),.45);background:rgba(var(--acc-rgb),.07)}
.cfg-status.ok{border-color:rgba(63,207,142,.35)}
.cfg-status .st-left{display:flex;align-items:center;gap:8px}
.cfg-status .dot-ok{width:8px;height:8px;border-radius:50%;background:var(--green);flex-shrink:0}
.cfg-status.restored .dot-ok{background:var(--acc)}
.cfg-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cfg-box{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:12px 14px}
.cfg-box-t{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;display:flex;justify-content:space-between;align-items:center}
.cfg-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid var(--line);font-size:12px}
.cfg-row:last-child{border-bottom:none}
.cfg-row label{color:var(--muted);font-family:var(--font-mono);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cfg-row input,.cfg-row select{width:96px;height:28px;padding:0 8px;border-radius:4px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:600 12px ui-monospace,Menlo,monospace;text-align:right;flex-shrink:0}
.cfg-row input:focus,.cfg-row select:focus,.cfg-raw:focus{outline:none;border-color:var(--acc)}
.cfg-row input.fixed{border-color:var(--acc);background:rgba(var(--acc-rgb),.08)}
.cfg-raw-wrap{margin-top:12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.cfg-raw{width:100%;min-height:84px;resize:vertical;background:var(--bg2);border:1px solid var(--line2);border-radius:5px;padding:9px 11px;color:var(--text);font:12px/1.45 ui-monospace,Menlo,monospace}
.cfg-out{background:#090a0c;border:1px solid var(--line);color:#9ca3af}
.cfg-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;flex-wrap:wrap}
.cfg-actions .left,.cfg-actions .right{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
@media(max-width:980px){.cfg-cols,.cfg-raw-wrap{grid-template-columns:1fr}}

/* ---------- Rotation des Maps & Non-Classé ---------- */
.rot-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:5px;background:var(--panel);border:1px solid var(--line);margin-bottom:12px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.rot-bar b{color:var(--text);font-weight:600}
.rot-next{display:inline-flex;align-items:center;gap:8px;font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.016em;padding:3px 9px;border-radius:3px;background:var(--panel2);border:1px solid var(--line2);color:var(--text)}
.rot-next .in{color:var(--green)}.rot-next .out{color:var(--red)}
.map.comp-lock{cursor:not-allowed;border-color:var(--line)!important}
.map.comp-lock .bg{filter:grayscale(1) brightness(.28)!important;transform:none!important}
.map.comp-lock .tick{display:none}
.map .m-lock-tag{position:absolute;top:7px;left:8px;z-index:2;font-family:var(--cond);font-size:10px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;padding:2px 6px;border-radius:3px;background:rgba(10,11,14,.82);border:1px solid var(--line2);color:var(--muted)}

/* ---------- Lancement auto CS:GO ---------- */
.autolaunch-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;margin-top:8px;border-radius:4px;background:var(--panel2);border:1px solid var(--line);font-size:12px;color:var(--muted)}
.autolaunch-row label{display:flex;align-items:center;gap:7px;cursor:pointer;color:var(--text);font-weight:500}
.autolaunch-row input{accent-color:var(--acc);width:14px;height:14px;cursor:pointer}

/* ---------- Ligues & Teams ---------- */
.lg-grid{display:grid;grid-template-columns:340px minmax(0,1fr);gap:14px;align-items:start}
.tm-card{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:18px}
.tm-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.tm-tag{width:52px;height:52px;border-radius:6px;display:grid;place-items:center;font-family:var(--cond);font-weight:700;font-size:18px;letter-spacing:.016em;color:#fff;flex-shrink:0;border:2px solid rgba(255,255,255,.15)}
.tm-roster{display:flex;flex-direction:column;gap:6px;margin:12px 0}
.tm-slot{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:5px;background:var(--panel2);border:1px solid var(--line);font-size:13px}
.tm-slot.empty{border-style:dashed;color:var(--dim);justify-content:space-between}
.lg-divs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:14px}
.lg-div{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:12px;cursor:pointer;transition:border-color .15s,background .15s;text-align:left}
.lg-div:hover{background:var(--panel2)}
.lg-div.on{border-color:var(--acc);background:var(--panel2)}
.lg-div .d-tier{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.032em;text-transform:uppercase;color:var(--dim)}
.lg-div .d-nm{font-family:var(--cond);font-size:19px;font-weight:700;text-transform:uppercase;margin-top:2px}
.lg-div .d-req{font-size:11.5px;color:var(--muted);margin-top:3px}
.lg-div .ld-t{font-family:var(--font-main);font-size:11.5px;font-weight:600;color:var(--dim)}
.lg-div .ld-n{font-family:var(--cond);font-size:18px;font-weight:700;margin-top:2px;line-height:1.1}
.lg-div .ld-p{font-family:var(--cond);font-size:13px;font-weight:700;color:var(--acc);margin-top:8px}
#leagues .fld input,#leagues .fld select{width:100%;height:40px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}
.tab{white-space:nowrap}
.lg-div .d-prz{font-family:var(--cond);font-size:13px;font-weight:700;color:var(--acc);margin-top:8px}
.lad-brackets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.lad-br{flex:1;min-width:165px;padding:10px 12px;border-radius:6px;background:var(--panel);border:1px solid var(--line);cursor:pointer;text-align:left;transition:border-color .15s,background .15s}
.lad-br:hover{background:var(--panel2)}
.lad-br.on{border-color:var(--acc);background:var(--panel2)}
.lad-br.mine .br-tag{color:var(--green)}
.lad-br .br-tag{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.028em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between}
.lad-br .br-t{font-family:var(--cond);font-size:17px;font-weight:700;margin-top:2px;display:flex;align-items:center;gap:6px}
.lad-br .br-s{font-size:11.5px;color:var(--muted);margin-top:2px}
@media(max-width:1020px){.lg-grid{grid-template-columns:1fr}.lg-divs{grid-template-columns:repeat(2,1fr)}}

/* ---------- Sanctions ---------- */
.banbox{display:flex;gap:14px;align-items:center;padding:14px 16px;border:1px solid rgba(239,85,96,.45);background:rgba(239,85,96,.07);border-radius:6px;margin-bottom:14px;flex-wrap:wrap}
.banbox .ico{width:38px;height:38px;border-radius:5px;background:rgba(239,85,96,.15);color:var(--red);display:grid;place-items:center;flex-shrink:0}
.banbox .ico svg{width:20px;height:20px}
.banbox .bt{font-family:var(--cond);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.012em;color:var(--red)}
.banbox .bs{font-size:13px;color:var(--muted);margin-top:2px}
.banbox .bc{margin-left:auto;text-align:right}
.banbox .bc b{display:block;font-family:var(--cond);font-weight:700;font-size:28px;font-variant-numeric:tabular-nums;color:var(--text);line-height:1}
.banbox .bc small{font-size:11px;color:var(--dim)}
.find.banned{background:var(--panel2);color:var(--red);box-shadow:inset 0 0 0 1px rgba(239,85,96,.55);cursor:not-allowed}
.find.banned:hover{background:var(--panel2)}
.find.banned .t{color:var(--muted);opacity:1}
.decline-btn{margin-top:10px;background:none;border:none;color:var(--muted);font-size:13px;font-weight:700;cursor:pointer;letter-spacing:.04em}
.decline-btn:hover{color:var(--red)}
.st{display:inline-block;font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.016em;text-transform:uppercase;padding:2px 7px;border-radius:3px}
.st.on{background:rgba(239,85,96,.15);color:var(--red)}
.st.off{background:var(--panel3);color:var(--muted)}
.san-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-bottom:12px}
.san-steps{display:flex;gap:4px;margin:2px 0 14px}
.san-steps span{flex:1;text-align:center;padding:6px 0;border-radius:3px;background:var(--panel2);font-family:var(--cond);font-weight:700;font-size:13px;color:var(--dim)}
.san-steps span.done{background:rgba(239,85,96,.15);color:var(--red)}
.san-steps span.next{box-shadow:inset 0 0 0 1px var(--red);color:var(--text)}
.warn-txt{font-size:14px;color:var(--muted);line-height:1.55}
.warn-txt b{color:var(--red)}
.sim-row{display:grid;grid-template-columns:1fr;gap:6px;margin-top:10px}
.sim-row .sim{margin-top:0}
.find.banned b{color:var(--text)}
.sim.afk:hover{color:var(--red);border-color:var(--red)}

/* ---------- Amis / profils publics ---------- */
[data-profile]{cursor:pointer}
.pname[data-profile]:hover,.pn [data-profile]:hover,.pl [data-profile]:hover,.mvp-n[data-profile]:hover,.fr-n[data-profile]:hover{text-decoration:underline}
.cc{font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.024em;padding:2px 6px;border-radius:3px;background:var(--panel3);color:var(--muted)}
.p-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.p-av .on.off{background:var(--dim)}
.p-banner > .back{left:12px;right:auto}
.fr-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.fr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.fr-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .18s,border-color .18s,box-shadow .18s}
.fr-card:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 8px 24px rgba(0,0,0,.45)}
.fr-card .bn{height:46px;background-size:cover;background-position:center;position:relative}
.fr-card .bn::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--panel),rgba(13,14,16,.3))}
.fr-body{padding:0 14px 14px;margin-top:-22px;position:relative;z-index:1}
.fr-top{display:flex;align-items:flex-end;gap:10px}
.fr-top .avatar{width:48px;height:48px;font-size:20px;border:3px solid var(--panel);border-radius:5px}
.fr-n{font-family:var(--cond);font-weight:700;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fr-st{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.fr-st i{width:7px;height:7px;border-radius:50%;background:var(--dim)}
.fr-st.s-online i{background:var(--green)}.fr-st.s-ingame i{background:var(--yellow)}
.fr-meta{display:flex;align-items:center;gap:10px;margin:12px 0;font-size:12px;color:var(--muted)}
.fr-meta b{font-family:var(--cond);font-size:15px;color:var(--text)}
.fr-btns{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.fr-btns .btn{height:32px;font-size:12px;padding:0 8px}
.fr-btns .btn:nth-child(3){grid-column:1/-1}
.fr-btns .fr-del-btn{grid-column:1/-1;border-color:transparent;color:var(--dim)}
.fr-btns .fr-del-btn:hover{color:var(--red);border-color:rgba(239,85,96,.3)}

.party-invite-banner{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:1050;background:#0d1017;background:rgba(13,16,23,0.98);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--acc);border-radius:10px;padding:12px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 18px 48px rgba(0,0,0,.8),0 0 0 1px rgba(255,171,26,.2);animation:slideDown .25s ease-out;max-width:min(520px,calc(100vw - 32px))}
@keyframes slideDown{from{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%,0)}}
.pib-who{display:flex;align-items:center;gap:10px;min-width:0}
.pib-who .avatar{width:38px;height:38px;border-radius:6px;font-size:16px}
.pib-txt{min-width:0;display:flex;flex-direction:column}
.pib-txt b{font-size:14px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pib-txt span{font-size:12px;color:var(--muted)}
.pib-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.pib-actions .btn{height:34px;padding:0 14px;font-size:13px}

.fr-hero{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.fr-hero-left h1{margin:0;font-size:26px;display:flex;align-items:center;gap:10px}
.fr-hero-left p{margin:4px 0 0;font-size:13px;color:var(--muted)}
.fr-hero-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fr-code-box{background:var(--bg2);border:1px dashed var(--line2);border-radius:8px;padding:6px 14px;display:flex;align-items:center;gap:10px}
.fr-code-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);font-weight:700}
.fr-code-val{font-family:var(--font-mono);font-size:15px;font-weight:800;color:var(--acc);letter-spacing:.1em}
.fr-subtabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:18px;overflow-x:auto}
.fr-subtab{padding:10px 16px;background:none;border:none;border-bottom:2px solid transparent;color:var(--muted);font-family:var(--cond);font-size:15px;font-weight:700;text-transform:uppercase;cursor:pointer;display:flex;align-items:center;gap:8px;margin-bottom:-1px;white-space:nowrap}
.fr-subtab:hover{color:var(--text)}
.fr-subtab.on{color:var(--text);border-bottom-color:var(--acc)}
.fr-tab-cnt{padding:2px 7px;border-radius:10px;background:var(--panel2);font-size:11px;color:var(--dim)}
.fr-subtab.on .fr-tab-cnt{background:var(--acc);color:#fff}
.fr-tab-cnt.alert{background:var(--red);color:#fff}

.fr-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.fr-search{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:0 12px;height:38px;width:min(320px,100%)}
.fr-search svg{width:16px;height:16px;color:var(--dim)}
.fr-search input{background:none;border:none;outline:none;color:var(--text);font:inherit;font-size:13px;width:100%}
.fr-filter-chips{display:flex;gap:6px}
.fr-chip{padding:4px 10px;border-radius:6px;border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:12px;cursor:pointer;font-weight:600}
.fr-chip.on{border-color:var(--acc);color:var(--text);background:var(--panel2)}

.fr-empty{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:48px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.fr-empty-icon{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;color:var(--dim);margin-bottom:14px}
.fr-empty-icon svg{width:28px;height:28px}
.fr-empty h3{font-size:18px;margin:0 0 6px}
.fr-empty p{font-size:13px;color:var(--muted);max-width:440px;margin:0 0 18px}
.fr-empty-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}

.fr-add-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:22px;max-width:640px;margin:0 auto}
.fr-add-form{display:flex;gap:10px;margin-top:14px}
.fr-add-input{flex:1;height:44px;padding:0 14px;border-radius:8px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit;font-size:14px}
.fr-add-result{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}

.fr-req-list{display:flex;flex-direction:column;gap:10px;max-width:680px}
.fr-req-item{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.fr-req-left{display:flex;align-items:center;gap:12px;min-width:0}
.fr-req-left .avatar{width:42px;height:42px;border-radius:6px;font-size:18px}
.fr-req-info{min-width:0}
.fr-req-info b{font-size:15px;display:block}
.fr-req-info span{font-size:12px;color:var(--muted)}
.fr-req-btns{display:flex;gap:8px}

.pl-sec-title{font-family:var(--cond);font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.024em;color:var(--muted);margin:16px 0 8px;display:flex;align-items:center;justify-content:space-between}
.pl-friends-list{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto;padding-right:4px}
.pl-friend-item{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px 12px}
.pl-friend-left{display:flex;align-items:center;gap:10px;min-width:0}
.pl-friend-left .avatar{width:34px;height:34px;border-radius:5px;font-size:14px}
.pl-friend-left b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-friend-left span{font-size:11px;color:var(--dim)}
.sec-t{font-family:var(--cond);font-weight:700;font-size:16px;letter-spacing:.02em;text-transform:uppercase;margin:26px 0 4px}
.sec-s{font-size:12px;color:var(--dim);margin-bottom:12px}
.mnav{display:none}
@media(max-width:720px){
  .mnav{display:flex;position:fixed;left:0;right:0;bottom:0;height:58px;background:var(--bg2);border-top:1px solid var(--line);z-index:40}
  .mnav button{flex:1;border:none;background:none;color:var(--dim);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-family:var(--cond);font-size:12px;font-weight:700;text-transform:uppercase;cursor:pointer}
  .mnav button svg{width:20px;height:20px}
  .mnav button.active{color:var(--text)}
  body{padding-bottom:58px}.toast{bottom:74px}
}

/* ---------- Veto ---------- */
.veto{margin-top:12px}
.veto-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}
.veto-h b{font-family:var(--cond);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.016em}
.veto-clock{font-family:var(--cond);font-weight:700;font-size:18px;font-variant-numeric:tabular-nums}
.veto-s{font-size:12px;color:var(--muted);margin-bottom:10px}
.veto-s.me{color:var(--acc)}
.veto-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.vmap{position:relative;height:46px;border-radius:4px;overflow:hidden;border:1px solid var(--line2);background-size:cover;background-position:center;cursor:default;text-align:left;padding:0}
.vmap::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.75),rgba(0,0,0,.25))}
.vmap{height:50px}
.vmap .vn{position:absolute;left:9px;top:7px;z-index:1;font-family:var(--cond);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.016em}
.vmap .vby{position:absolute;top:24px;left:9px;right:6px;z-index:1;font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vmap.can{cursor:pointer}
.vmap.can:hover{border-color:var(--red)}
.vmap.can:hover .vn{color:var(--red)}
.vmap.ban{filter:grayscale(1);opacity:.45}
.vmap.ban .vn{text-decoration:line-through}
.vmap.pick{border-color:var(--green)}
.connect:disabled,.sim:disabled{opacity:.4;cursor:not-allowed}

/* ---------- Classement ---------- */
.rk-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.rk-sub{font-size:13px;color:var(--muted);margin-top:2px}
.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.podium>*{min-width:0}
@media(max-width:720px){.podium{grid-template-columns:minmax(0,1fr)}}
.pod{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:14px;display:flex;align-items:center;gap:12px}
.pod .rk{font-family:var(--cond);font-weight:700;font-size:30px;width:34px;color:var(--dim)}
.pod.r1 .rk{color:#f2b632}.pod.r2 .rk{color:#c5cad3}.pod.r3 .rk{color:#c98a52}
.pod .avatar{width:46px;height:46px;font-size:20px}
.pod .nm{font-family:var(--cond);font-weight:700;font-size:18px}
.pod .el{font-size:12px;color:var(--muted)}
.rk-table td.rk,.rk-table th.rk{text-align:left;width:46px;font-family:var(--cond);font-weight:700;color:var(--muted)}
.rk-table tr.me td{background:rgba(var(--acc-rgb),.09)}
.rk-table tr.gap td{text-align:center;color:var(--dim);padding:4px}

/* ---------- Abonnements ---------- */
.pb{display:inline-block;margin-left:2px;font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.04em;padding:2px 6px;border-radius:3px;line-height:1.3;vertical-align:middle}
.pb.plus{background:var(--panel3);color:var(--acc);box-shadow:inset 0 0 0 1px rgba(var(--acc-rgb),.5)}
.pb.premium{background:var(--acc);color:var(--on-acc)}
.gold{color:var(--acc)!important}
.go-prem{height:34px;padding:0 12px;border-radius:5px;border:1px solid var(--acc);background:transparent;color:var(--acc);font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.024em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.go-prem:hover{background:rgba(var(--acc-rgb),.1)}
.go-prem.has{border-color:var(--line2);color:var(--muted)}
.pr-hero{text-align:center;max-width:760px;margin:6px auto 24px}
.pr-hero h1{font-family:var(--cond);font-size:40px;font-weight:700;text-transform:uppercase;line-height:1.05;letter-spacing:.004em}
.pr-hero p{color:var(--muted);font-size:15px;margin-top:10px;line-height:1.5}
.bill{display:inline-flex;gap:4px;padding:4px;border-radius:6px;background:var(--panel);border:1px solid var(--line);margin-top:18px}
.bill button{height:34px;padding:0 14px;border:none;border-radius:4px;background:none;color:var(--muted);font-weight:700;cursor:pointer}
.bill button.on{background:var(--panel3);color:var(--text)}
.bill .save{font-size:11px;color:var(--green);margin-left:4px}
.pay-cs-banner{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:12px;border:1px solid rgba(255,171,26,.3);background:linear-gradient(90deg,rgba(255,171,26,.08),transparent 80%);box-shadow:0 8px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.05);margin:0 0 24px}
@media(max-width:640px){.pay-cs-banner{flex-direction:column;align-items:flex-start;gap:10px}}
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch}
.plan{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:24px;display:flex;flex-direction:column;position:relative;box-shadow:0 8px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .2s,box-shadow .2s,border-color .2s}
.plan:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 12px 32px rgba(0,0,0,.5)}
.plan.feat{border-color:rgba(255,171,26,.5);box-shadow:0 0 0 1px rgba(255,171,26,.25),0 12px 36px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.1)}
.plan .tagf{position:absolute;top:-11px;left:22px;background:linear-gradient(180deg,#ffbd42 0%,#ff9e1f 100%);color:#0e0a02;font-family:var(--cond);font-weight:700;font-size:11.5px;letter-spacing:.032em;padding:3px 10px;border-radius:4px;text-transform:uppercase;box-shadow:0 2px 6px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.35)}
.plan h3{font-family:var(--cond);font-size:24px;font-weight:700;letter-spacing:.016em}
.plan .pd{color:var(--muted);font-size:13px;margin-top:2px}
.plan .price{font-family:var(--cond);font-size:44px;font-weight:700;margin:16px 0 0;line-height:1}
.plan .price small{font-size:16px;color:var(--muted);font-weight:600}
.plan .bil{font-size:12px;color:var(--dim);min-height:16px;margin-top:4px}
.plan ul{list-style:none;margin:18px 0;display:flex;flex-direction:column;gap:9px;flex:1}
.plan li{display:flex;gap:9px;font-size:14px;line-height:1.35}
.plan li svg{width:16px;height:16px;flex-shrink:0;margin-top:1px;color:var(--green)}
.plan li.hd{color:var(--muted);font-size:13px}
.plan .btn{width:100%;height:44px;font-size:14px}
.cmp{margin-top:26px;padding:0}
.cmp table{min-width:560px}
.cmp td:not(:first-child),.cmp th:not(:first-child){text-align:center}
.cmp .yes{color:var(--green)}.cmp .no{color:var(--dim)}
.faq{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.faq .card b{display:block;font-family:var(--cond);font-size:17px;margin-bottom:6px}
.faq .card p{font-size:13px;color:var(--muted);line-height:1.55}
.co-line{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.co-line span{color:var(--muted)}
.co-total{font-family:var(--cond);font-size:22px;font-weight:700}

/* ---------- Casier (skins) ---------- */
.lo-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.lo-sub{color:var(--muted);font-size:13px;margin-top:2px}
.seg{display:inline-flex;gap:3px;padding:3px;border-radius:6px;background:var(--panel);border:1px solid var(--line)}
.seg button{height:32px;padding:0 12px;border:none;border-radius:4px;background:none;color:var(--muted);font-weight:700;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:6px}
.seg button.on{background:var(--panel3);color:var(--text)}
.lo-note{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:6px;background:var(--panel);border:1px solid var(--line);font-size:13px;color:var(--muted);margin-bottom:12px;flex-wrap:wrap}
.lo-note.lock{border-color:rgba(var(--acc-rgb),.45);background:rgba(var(--acc-rgb),.06);color:var(--text)}
.lo-note .btn{margin-left:auto}
.cats{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:12px;overflow-x:auto;scrollbar-width:none}
.cats button{padding:9px 14px;border:none;background:none;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.012em;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.cats button.on{color:var(--text);border-bottom-color:var(--acc)}
.lo-grid{display:grid;grid-template-columns:220px minmax(0,1fr) 320px;gap:12px;align-items:start}
.wlist{display:flex;flex-direction:column;gap:6px}
.wcard{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:5px;background:var(--panel);border:1px solid var(--line);cursor:pointer;text-align:left;width:100%}
.wcard:hover{border-color:var(--line2)}
.wcard.on{border-color:var(--acc)}
.wcard .th{width:62px;height:40px;flex-shrink:0;display:grid;place-items:center}
.wcard .th img{max-width:100%;max-height:100%}
.wcard b{display:block;font-family:var(--cond);font-size:15px}
.wcard small{display:block;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}
.skgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.sk{position:relative;border-radius:5px;background:var(--panel);border:1px solid var(--line);cursor:pointer;padding:8px 8px 10px;text-align:left;overflow:hidden}
.sk:hover{border-color:var(--line2)}
.sk.on{border-color:var(--acc);background:var(--panel2)}
.sk::before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--rc)}
.sk .im{height:86px;display:grid;place-items:center;background:radial-gradient(closest-side,color-mix(in srgb,var(--rc) 22%,transparent),transparent)}
.sk .im img{max-width:100%;max-height:82px}
.sk .im .ph{font-family:var(--cond);font-weight:700;color:var(--dim);font-size:12px;text-transform:uppercase;text-align:center}
.sk b{display:block;font-size:13px;font-weight:600;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk small{font-size:11px;color:var(--rc)}
.sk .tg{position:absolute;top:6px;left:6px;display:flex;gap:4px}
.sk .tg span{font-family:var(--cond);font-size:10px;font-weight:700;letter-spacing:.024em;padding:1px 5px;border-radius:3px;background:rgba(0,0,0,.6);color:var(--muted);text-transform:uppercase}
.sk .tg .ow{color:var(--green)}.sk .tg .eq{background:var(--acc);color:var(--on-acc)}
.sk .lk{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:4px;background:rgba(0,0,0,.6);display:grid;place-items:center;color:var(--acc)}
.sk .lk svg{width:12px;height:12px}
.skcfg{position:sticky;top:72px}
.skcfg .big{height:150px;display:grid;place-items:center;border-radius:5px;background:radial-gradient(closest-side,color-mix(in srgb,var(--rc) 25%,transparent),transparent),var(--panel2);margin-bottom:12px}
.skcfg .big img{max-width:92%;max-height:140px}
.skcfg h3{font-family:var(--cond);font-size:22px;font-weight:700;line-height:1.1}
.skcfg .rn{font-size:12px;color:var(--rc);margin-top:2px}
.fld{margin-top:14px}
.fld label{display:flex;justify-content:space-between;font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.fld label b{color:var(--text);font-family:var(--font-main);font-size:13px;letter-spacing:0;text-transform:none}
.fld input[type=range]{width:100%;accent-color:var(--acc)}
.fld input[type=text],.fld input[type=number]{width:100%;height:36px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}
.fld input:focus{outline:none;border-color:var(--acc)}
.fld input:disabled{opacity:.5}
.tog{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px}
.tog input{width:18px;height:18px;accent-color:var(--acc)}
.cfg-act{display:flex;gap:6px;margin-top:16px}
.cfg-act .btn{flex:1}
.ag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.ag-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.lock-ico{display:inline-grid;place-items:center;width:16px;height:16px;vertical-align:-3px}

.noimg::after{content:attr(data-ph);font-family:var(--cond);font-weight:700;font-size:12px;color:var(--dim);text-transform:uppercase;text-align:center;padding:0 6px}
.online,.concept,.profile .meta{white-space:nowrap}
@media(max-width:1520px){.online,.concept{display:none}}
.top .tab{padding:0 12px}
/* ---------- Analyse de match ---------- */
.review{margin-top:12px;position:relative;overflow:hidden}
.rv-lock{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background:rgba(5,5,6,.55);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.rv-lock .in{max-width:440px;text-align:center;padding:20px}
.rv-lock b{display:block;font-family:var(--cond);font-size:22px;font-weight:700;text-transform:uppercase;margin:8px 0}
.rv-lock p{color:var(--muted);font-size:14px;line-height:1.5;margin-bottom:14px}
.rounds{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:3px;margin:6px 0 4px}
.rd{height:34px;border-radius:3px;display:grid;place-items:center;font-size:10px;font-weight:700;color:rgba(0,0,0,.65)}
.rd.a{background:var(--blue)}.rd.b{background:var(--red)}
.rd.half{box-shadow:-3px 0 0 var(--bg)}
.rd svg{width:12px;height:12px}
.rnum{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:3px;font-size:10px;color:var(--dim);text-align:center}
.rv-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:8px}
.rv-legend span{display:flex;align-items:center;gap:5px}
.rv-legend svg{width:12px;height:12px}
.rv-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:16px}
.rv-two{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:20px;margin-top:16px;align-items:start}
.halves{display:flex;gap:8px;margin-top:4px}
.halves .bk{flex:1}
.heat{width:100%;aspect-ratio:1;border-radius:6px;overflow:hidden;position:relative;border:1px solid var(--line)}
.heat .bg{position:absolute;inset:0;filter:grayscale(.6) brightness(.45)}
.heat.radar{background:#0c0d10}.heat.radar .bg{background-size:contain!important;background-repeat:no-repeat!important;background-position:center!important;filter:none;opacity:.95}
.heat-na{position:absolute;inset:auto 10px 10px;font-size:12px;color:var(--muted);text-align:center}
.heat svg{position:absolute;inset:0;width:100%;height:100%}
.rv-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%}

@media(max-width:1100px){.lo-grid{grid-template-columns:200px minmax(0,1fr)}.skcfg{grid-column:1/-1;position:static}.plans,.faq{grid-template-columns:minmax(0,1fr)}.rv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rv-two{grid-template-columns:minmax(0,1fr)}}
@media(max-width:720px){.lo-grid{grid-template-columns:minmax(0,1fr)}.wlist{flex-direction:row;overflow-x:auto}.wcard{min-width:170px}.pr-hero h1{font-size:30px}.go-prem{display:none}.ag-cols{grid-template-columns:minmax(0,1fr)}}

/* ---------- Boutique / pass / ladder ---------- */
.tc{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--acc);color:var(--on-acc);font-family:var(--cond);font-weight:700;font-size:10px;vertical-align:-3px;margin-right:4px}
.wallet{height:34px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background:var(--panel);color:var(--text);font-family:var(--cond);font-weight:700;font-size:15px;cursor:pointer;white-space:nowrap;display:flex;align-items:center}
.wallet:hover{border-color:var(--acc)}
.sh-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.sh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.item{position:relative;border-radius:12px;background:var(--panel);border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 4px 14px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .2s,box-shadow .2s,border-color .2s}
.item:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 8px 24px rgba(0,0,0,.5)}
.item::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--rc)}
.item .im{height:120px;display:grid;place-items:center;background:radial-gradient(closest-side,color-mix(in srgb,var(--rc) 22%,transparent),transparent)}
.item .im img{max-width:90%;max-height:110px}
.item .bd{padding:10px 12px 12px;display:flex;flex-direction:column;gap:2px;flex:1}
.item b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item small{font-size:12px;color:var(--rc)}
.item .btn{margin-top:auto;width:100%;height:36px}
.item .pr{font-family:var(--cond);font-weight:700;font-size:18px;margin:6px 0 8px}
.packs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.pack{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .2s,box-shadow .2s,border-color .2s}
.pack:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 8px 24px rgba(0,0,0,.5)}
.pack .n{font-family:var(--cond);font-size:34px;font-weight:700;color:var(--acc)}
.pack .bn{font-size:12px;color:var(--green);min-height:16px}
.pack .btn{width:100%;margin-top:12px}
.pass-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center}
.pass-lv{font-family:var(--cond);font-size:40px;font-weight:700;line-height:1}
.track{display:grid;grid-auto-flow:column;grid-auto-columns:118px;gap:6px;overflow-x:auto;padding-bottom:8px;margin-top:14px}
.tier{display:flex;flex-direction:column;gap:6px}
.tier .tn{font-family:var(--cond);font-weight:700;font-size:13px;color:var(--dim);text-align:center}
.tier.reached .tn{color:var(--acc)}
.rw{position:relative;height:104px;border-radius:5px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px;text-align:center;font-size:11px;color:var(--muted)}
.rw.prem{background:linear-gradient(180deg,rgba(var(--acc-rgb),.06),var(--panel))}
.rw img{max-width:90%;max-height:46px}
.rw .cn{font-family:var(--cond);font-weight:700;font-size:18px;color:var(--acc)}
.rw .btn{height:24px;padding:0 8px;font-size:11px}
.rw.done{opacity:.45}
.rw .lk{position:absolute;top:5px;right:5px;color:var(--dim)}
.rw .lk svg{width:12px;height:12px}
.rw-lbl{font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.032em;text-transform:uppercase;color:var(--dim);margin-top:6px}
.rk-tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:14px}
.rk-tabs button{padding:9px 14px;border:none;background:none;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:16px;text-transform:uppercase;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.rk-tabs button.on{color:var(--text);border-bottom-color:var(--acc)}
.lad{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;align-items:start}
.rwd{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.rwd:last-child{border-bottom:none}
@media(max-width:1100px){.packs{grid-template-columns:repeat(2,minmax(0,1fr))}.lad{grid-template-columns:minmax(0,1fr)}}
@media(max-width:720px){.wallet{display:none}}

/* ---------- Toggle tri matchmaking ---------- */
.mm-tog{cursor:pointer;user-select:none;gap:8px!important;display:inline-flex;align-items:center}
.mm-tog input{display:none}
.mm-tog .sw{position:relative;display:inline-block;width:32px;height:18px;border:none;padding:0;border-radius:999px;background:var(--line2);transition:background .15s;flex:none;box-sizing:border-box}
.mm-tog .sw::after{content:"";position:absolute;left:3px;top:50%;transform:translateY(-50%);width:12px;height:12px;border-radius:50%;background:var(--muted);transition:transform .15s,background .15s}
.mm-tog input:checked+.sw{background:var(--acc)}
.mm-tog input:checked+.sw::after{transform:translate(14px,-50%);background:var(--on-acc)}
/* ---------- Stickers ---------- */
.skcfg .big{position:relative}
.stk-ov{position:absolute;left:8%;right:8%;bottom:10px;display:flex;justify-content:center;gap:4%;pointer-events:none}
.stk-ov img{width:15%;max-width:46px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.stk-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.stk-slot{position:relative;aspect-ratio:1;border-radius:5px;border:1px dashed var(--line2);background:var(--panel2);display:grid;place-items:center;cursor:pointer;color:var(--dim);font-size:22px;padding:0}
.stk-slot:hover{border-color:var(--acc);color:var(--acc)}
.stk-slot.on{border:1px solid var(--acc)}
.stk-slot.full{border-style:solid}
.stk-slot img{width:84%;height:84%;object-fit:contain}
.stk-slot .lk{position:absolute;inset:0;display:grid;place-items:center;background:rgba(5,5,6,.55);border-radius:5px}
.stk-slot .lk svg{width:14px;height:14px}
.stk-sel{display:flex;gap:8px;align-items:center;margin-top:8px;font-size:12px;color:var(--muted)}
.stk-sel b{color:var(--text);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.stk-sel .btn{height:26px;padding:0 9px;font-size:12px}
.stk-modal{width:min(760px,calc(100vw - 32px))}
.stk-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.stk-tools input{flex:1;min-width:160px;height:34px;border-radius:5px;border:1px solid var(--line2);background:var(--panel2);color:var(--text);padding:0 10px;font:inherit}
.stk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px;max-height:min(56vh,460px);overflow-y:auto;padding-right:4px}
.stk-it{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;border-radius:5px;border:1px solid var(--line);background:var(--panel2);cursor:pointer;color:var(--text);font:inherit;font-size:11px;text-align:center;border-bottom:2px solid var(--rc)}
.stk-it:hover{border-color:var(--acc)}
.stk-it .im{width:64px;height:64px;display:grid;place-items:center}
.stk-it img{max-width:64px;max-height:64px}
.stk-it span{line-height:1.2;max-height:2.4em;overflow:hidden}
.stk-it small{color:var(--rc);font-size:10px}

/* ---------- Missions du jour ---------- */
.missions{margin-top:24px}
.ms-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ms{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px;min-height:132px;box-shadow:0 4px 14px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .18s,box-shadow .18s,border-color .18s}
.ms:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 8px 24px rgba(0,0,0,.45)}
.ms.done{border-color:color-mix(in srgb,var(--green) 45%,var(--line))}
.ms.got{opacity:.5}
.ms .tt{font-weight:600;font-size:14px;line-height:1.3}
.ms .rw2{display:flex;gap:8px;font-family:var(--cond);font-weight:700;font-size:14px;color:var(--acc)}
.ms .pg{height:5px;border-radius:3px;background:var(--line2);overflow:hidden;margin-top:auto}
.ms .pg i{display:block;height:100%;background:var(--acc)}
.ms.done .pg i{background:var(--green)}
.ms .ft{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}
.ms .btn{height:26px;padding:0 10px;font-size:12px}
.ms.locked{border-style:dashed;align-items:center;justify-content:center;text-align:center;color:var(--muted);cursor:pointer}
.ms.locked:hover{border-color:var(--acc)}
.ms.locked svg{width:18px;height:18px}
.kg-band{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 12px;padding:12px 14px;border-radius:6px;border:1px solid color-mix(in srgb,var(--acc) 35%,var(--line));background:linear-gradient(90deg,rgba(var(--acc-rgb),.08),transparent 70%);font-size:13px}
.kg-band b{font-family:var(--cond);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.012em;margin-right:6px}
.overlay{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.modal.found{border:1px solid rgba(46,204,113,.45);border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,.85),0 0 0 1px rgba(46,204,113,.2),0 8px 24px rgba(46,204,113,.08),inset 0 1px 0 rgba(255,255,255,.1)}
@media(max-width:1100px){.ms-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- Connexion / inscription ---------- */
.auth{position:fixed;inset:0;z-index:200;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(390px,520px);background:#07090d;overflow:hidden}
.auth[hidden]{display:none}
.auth-slider-bg{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.auth-bg-layer{position:absolute;inset:0;background-size:cover;background-position:center;transition:opacity .45s ease;opacity:0}
.auth-bg-layer.active{opacity:1}
.auth-bg-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,9,13,.62) 0%,rgba(7,9,13,.38) 45%,rgba(7,9,13,.84) 100%),linear-gradient(90deg,rgba(7,9,13,.42) 0%,rgba(7,9,13,.22) 45%,rgba(7,9,13,.78) 78%,rgba(7,9,13,.94) 100%);pointer-events:none}
.auth-bg-particles{display:none}

.auth-art{position:relative;z-index:2;overflow:hidden;padding:36px 48px;display:flex;flex-direction:column;justify-content:space-between;cursor:default}
.auth-art-header{display:flex;align-items:center;justify-content:space-between;gap:16px}
.auth-brand{font-family:var(--cond);font-weight:900;font-size:30px;letter-spacing:.048em}
.auth-brand b{color:var(--acc)}
.auth-pill-tag{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;background:#12151c;border:1px solid rgba(255,255,255,.12);border-radius:4px;font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.04em;color:#d4d7e1}
.auth-pill-tag .live-dot{width:7px;height:7px;border-radius:50%;background:var(--green)}

.auth-vpresentation{position:relative;margin:auto 0;display:grid;grid-template-columns:135px minmax(0,1fr);gap:28px;align-items:center;min-height:360px}
.auth-vrail{position:relative;display:flex;align-items:center}
.auth-vrail-track{position:absolute;left:11px;top:14px;bottom:14px;width:2px;background:rgba(255,255,255,.12);border-radius:2px}
.auth-vrail-thumb{position:absolute;left:0;top:0;width:2px;height:24px;background:var(--acc);transition:top .25s ease-out}
.auth-vrail-steps{display:flex;flex-direction:column;gap:16px;position:relative;z-index:2;width:100%}
.auth-vstep-btn{display:flex;align-items:center;gap:10px;background:none;border:none;color:#858a98;padding:6px 0;cursor:pointer;font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.032em;transition:color .15s;text-align:left}
.auth-vstep-btn:hover{color:#fff}
.auth-vstep-btn.active{color:var(--acc)}
.auth-vstep-btn .vstep-num{display:grid;place-items:center;width:24px;height:24px;border-radius:4px;background:#12151c;border:1px solid rgba(255,255,255,.15);font-size:11px;letter-spacing:0;color:#c2c6d4;transition:border-color .15s,background .15s,color .15s}
.auth-vstep-btn:hover .vstep-num{border-color:rgba(255,178,31,.5);color:#fff}
.auth-vstep-btn.active .vstep-num{background:var(--acc);color:#07090d;border-color:var(--acc)}
.auth-vstep-btn .vstep-line{width:12px;height:1px;background:rgba(255,255,255,.15);transition:width .18s,background .18s}
.auth-vstep-btn.active .vstep-line{width:18px;background:var(--acc)}
.auth-vstep-btn .vstep-label{white-space:nowrap}

.auth-vslider-viewport{position:relative;overflow:hidden;min-height:340px;display:flex;align-items:center}
.auth-slide{width:100%}
.auth-slide.slide-descending{animation:authSlideDescend .22s ease-out forwards}
.auth-slide.slide-ascending{animation:authSlideAscend .22s ease-out forwards}
@keyframes authSlideDescend{0%{opacity:0;transform:translateY(-12px)}100%{opacity:1;transform:translateY(0)}}
@keyframes authSlideAscend{0%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:translateY(0)}}

.auth-slide-title{font-family:var(--cond);font-weight:900;font-size:clamp(34px,4vw,54px);line-height:.96;text-transform:uppercase;color:#fff;margin:0 0 14px;letter-spacing:.008em;text-shadow:0 4px 28px rgba(0,0,0,.75);max-width:640px}
.auth-slide-desc{font-size:15px;line-height:1.55;color:#c0c4d2;max-width:540px;margin:0 0 24px;text-shadow:0 2px 10px rgba(0,0,0,.7)}
.auth-slide-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:560px}
.auth-stat-card{background:#10131a;border:1px solid #232833;border-radius:8px;padding:12px 14px;box-shadow:0 4px 14px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.04);transition:border-color .15s,transform .15s,box-shadow .15s}
.auth-stat-card:hover{border-color:rgba(255,178,31,.45);transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.45)}
.auth-stat-card .stat-val{font-family:var(--cond);font-size:21px;font-weight:900;color:var(--acc);line-height:1.1;margin-bottom:4px;letter-spacing:.016em}
.auth-stat-card .stat-lbl{font-size:11.5px;line-height:1.35;color:#989da9;font-weight:500}

.auth-art-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.auth-scroll-prompt{display:inline-flex;align-items:center;gap:10px;background:#12151c;border:1px solid rgba(255,255,255,.14);border-radius:4px;padding:7px 14px;color:#d0d4e0;font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.04em;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
.auth-scroll-prompt:hover{background:var(--acc);color:#07090d;border-color:var(--acc)}
.auth-scroll-prompt .scroll-mouse-icon{width:14px;height:20px;border:1.6px solid currentColor;border-radius:7px;position:relative;display:inline-block}
.auth-scroll-prompt .scroll-wheel{position:absolute;top:4px;left:50%;width:2px;height:4px;background:currentColor;border-radius:1px;transform:translateX(-50%)}
.auth-scroll-prompt .scroll-chevron{width:15px;height:15px}
.auth-slide-counter{display:inline-flex;align-items:center;gap:6px;font-family:var(--cond);font-weight:700;font-size:14px;color:#858a98}
.auth-slide-counter .cur-num{color:var(--acc);font-size:17px}
.auth-slide-counter .counter-sep{opacity:.4}

.auth-side{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px 42px;background:#0b0d12;border-left:1px solid rgba(255,255,255,.09);box-shadow:-18px 0 50px rgba(0,0,0,.5);overflow-y:auto;z-index:3}
.auth-langs{position:absolute;top:18px;right:20px;display:flex;gap:4px}
.auth-langs button{height:28px;padding:0 9px;border-radius:4px;border:1px solid var(--line2);background:none;color:var(--muted);font-weight:700;font-size:12px;cursor:pointer}
.auth-langs button.on{color:var(--text);border-color:var(--acc)}
.auth-card{width:100%;max-width:400px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);margin-bottom:22px}
.auth-tabs button{height:44px;background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:17px;letter-spacing:.016em;text-transform:uppercase;cursor:pointer}
.auth-tabs button.on{color:var(--text);border-bottom-color:var(--acc)}
.auth-form h2{font-family:var(--cond);font-size:30px;font-weight:700;margin-bottom:16px}
.af{margin-bottom:14px}
.af label{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.af label small{font-family:var(--font-main);text-transform:none;letter-spacing:0;font-weight:400;color:var(--dim);font-size:11px}
.af input{width:100%;height:44px;padding:0 12px;border-radius:8px;border:1px solid var(--line2);background:var(--panel);color:var(--text);font:inherit;font-size:14.5px;transition:border-color .15s,box-shadow .15s}
.af input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),0 2px 8px rgba(0,0,0,.4)}
.af input.bad{border-color:var(--red)}
.af input.good{border-color:color-mix(in srgb,var(--green) 60%,var(--line2))}
.pw{position:relative}
.pw input{padding-right:44px}
.pw-eye{position:absolute;right:4px;top:4px;width:36px;height:36px;border:none;background:none;color:var(--dim);cursor:pointer;display:grid;place-items:center}
.pw-eye:hover,.pw-eye.on{color:var(--text)}
.pw-eye svg{width:18px;height:18px}
.pw-meter{height:4px;border-radius:2px;background:var(--line2);margin-top:8px;overflow:hidden}
.pw-meter i{display:block;height:100%;width:0;transition:width .2s,background .2s}
.pw-rules{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px;font-size:12px;color:var(--dim)}
.pw-rules span.ok{color:var(--green)}
.af-row{display:flex;justify-content:space-between;align-items:center;margin:-2px 0 12px}
.chk{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);cursor:pointer}
.chk input{width:16px;height:16px;accent-color:var(--acc)}
.af-cgu{margin:4px 0 12px;line-height:1.4}
.lnk{background:none;border:none;color:var(--acc);font:inherit;font-size:13px;cursor:pointer;padding:0}
.lnk:hover{text-decoration:underline}
.af-err{min-height:0;font-size:13px;color:var(--red);margin-bottom:10px}
.af-err:empty{display:none}
.af-go{width:100%;height:46px;font-size:15px}
.af-go:disabled{opacity:.6;cursor:default}
.af-or{display:flex;align-items:center;gap:10px;margin:16px 0;color:var(--dim);font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.af-or::before,.af-or::after{content:"";flex:1;height:1px;background:var(--line)}
.af-social-btns{display:flex;flex-direction:column;gap:10px;width:100%}
.btn.af-google{width:100%;height:46px;background:#ffffff!important;border:1px solid #dadce0!important;color:#1f1f1f!important;font-weight:600;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:4px;cursor:pointer;box-shadow:none!important;transition:background .15s,box-shadow .15s}
.btn.af-google span{color:#1f1f1f!important}
.btn.af-google:hover{background:#f8f9fa!important;box-shadow:0 1px 3px rgba(60,64,67,.3)!important;border-color:#dadce0!important}
.af-google svg{width:18px;height:18px;flex-shrink:0}
.af-steam{width:100%;height:46px;background:#171a21;border-color:#2a3f5a;color:#c7d5e0}
.af-steam:hover{background:#1b2838;border-color:#66c0f4}
.af-steam svg{width:20px;height:20px}
.af-sw{text-align:center;margin-top:18px;font-size:13px;color:var(--muted)}
.auth-verify{text-align:center;padding:12px 4px 6px}
.verify-icon{width:64px;height:64px;margin:0 auto 16px;border-radius:50%;background:rgba(255,107,0,0.12);border:1px solid rgba(255,107,0,0.35);display:flex;align-items:center;justify-content:center;color:var(--acc,#ff6b00);box-shadow:0 0 24px rgba(255,107,0,0.22)}
.verify-icon svg{width:30px;height:30px}
.auth-verify h2{font-family:var(--cond);font-size:26px;font-weight:700;margin-bottom:8px;color:var(--text)}
.verify-desc{color:var(--muted);font-size:13.5px;line-height:1.5;margin:0 auto 16px;max-width:320px}
.verify-target-box{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:var(--panel,#161a23);border:1px solid var(--line2,#232a38);border-radius:8px;color:var(--text);font-size:14px;margin-bottom:16px;word-break:break-all}
.verify-mail-icon{font-size:16px;color:var(--acc,#ff6b00)}
.verify-target-box b{color:var(--text);font-weight:700}
.verify-alert{padding:10px 14px;border-radius:6px;font-size:13px;line-height:1.4;margin-bottom:14px;text-align:center}
.verify-alert.err{background:rgba(235,87,87,0.12);border:1px solid rgba(235,87,87,0.3);color:var(--red,#eb5757)}
.verify-alert.ok{background:rgba(39,174,96,0.12);border:1px solid rgba(39,174,96,0.3);color:var(--green,#27ae60)}
.verify-actions{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.btn.outline{background:transparent;border:1px solid var(--line2,#232a38);color:var(--text)}
.btn.outline:hover{background:var(--panel-h,#1d2330);border-color:var(--line3,#30394c)}
.umenu{position:fixed;z-index:120;min-width:220px;background:#0d1017;background:rgba(13,16,23,0.98);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid #232a38;border-radius:8px;padding:6px;box-shadow:0 18px 48px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,0.06)}
.umenu[hidden]{display:none}
.um-h{padding:10px 12px;border-bottom:1px solid #1f2533;margin-bottom:4px;display:flex;flex-direction:column;background:#11151f;border-radius:6px 6px 0 0}
.um-h small{color:var(--dim);font-size:12px}
.umenu button{display:block;width:100%;text-align:left;padding:9px 12px;border:none;background:none;color:var(--text);font:inherit;font-size:13px;border-radius:6px;cursor:pointer;transition:background .12s}
.umenu button:hover{background:#181e2b}
.umenu button.danger{color:var(--red)}
.acc-row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}
.acc-row b{color:var(--text);font-weight:600;text-align:right;word-break:break-all}
.acc-pw{margin-top:16px}
.acc-pw .af input{height:40px}
@media(max-width:1150px){.auth-vpresentation{grid-template-columns:1fr}.auth-vrail{display:none}}
@media(max-width:900px){.auth{grid-template-columns:minmax(0,1fr)}.auth-art{display:none}.auth-side{border-left:none;padding:60px 18px 28px;align-items:flex-start;background:rgba(12,15,22,.85)}}

/* ---------- Lancement : rejoindre le serveur ---------- */
.joinbox{border:1px solid var(--line2);border-radius:6px;padding:10px 12px;margin:12px 0 10px;background:var(--panel2)}
.joinbox .jb-h{display:flex;justify-content:space-between;align-items:center}
.joinbox .jb-h b{font-family:var(--cond);font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.016em}
.joinbox .jb-c{font-family:var(--cond);font-size:24px;font-weight:700;color:var(--acc);font-variant-numeric:tabular-nums}
.joinbox.hot .jb-c{color:var(--red);animation:jbBlink 1s infinite}
@keyframes jbBlink{50%{opacity:.45}}
.joinbox .jb-bar{height:5px;border-radius:3px;background:var(--line2);margin:8px 0 6px;overflow:hidden}
.joinbox .jb-bar i{display:block;height:100%;background:var(--green);transition:width .3s}
.joinbox .jb-s{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.joinbox.live{border-color:color-mix(in srgb,var(--green) 50%,var(--line2));display:flex;gap:10px;align-items:center;font-size:13px}
.joinbox.live b{color:var(--green);font-family:var(--cond);font-size:16px;letter-spacing:.024em}
.prow{position:relative}
.prow .jdot{position:absolute;left:6px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--dim);border:2px solid var(--panel);z-index:1;animation:jbBlink 1.4s infinite}
.prow.in .jdot{background:var(--green);animation:none}
.prio-tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:3px;background:var(--acc);color:var(--on-acc);font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.024em;text-transform:uppercase;vertical-align:1px}

/* ---------- Notifications ---------- */
.notif-btn .nb{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--orange,#ff6a2b);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;border:2px solid var(--bg)}
.notif-btn.shake svg{animation:bellShake .7s ease}
@keyframes bellShake{0%,100%{transform:rotate(0)}20%{transform:rotate(16deg)}40%{transform:rotate(-14deg)}60%{transform:rotate(8deg)}80%{transform:rotate(-4deg)}}
.npanel{position:fixed;z-index:120;width:min(380px,calc(100vw - 16px));background:#0d1017;background:rgba(13,16,23,0.98);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid #232a38;border-radius:8px;box-shadow:0 18px 48px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,0.06);overflow:hidden}
.npanel[hidden]{display:none}
.np-h,.np-f{display:flex;justify-content:space-between;align-items:center;padding:12px 14px}
.np-h{background:#11151f;border-bottom:1px solid #1f2533}
.np-h b{font-family:var(--cond);font-size:16px;font-weight:700;letter-spacing:.008em;color:var(--text)}
.np-f{background:#0b0d13;border-top:1px solid #1f2533;justify-content:center}
.np-list{max-height:min(60vh,420px);overflow-y:auto;background:#0d1017}
.ni{display:flex;gap:12px;width:100%;text-align:left;padding:12px 14px;border:none;border-bottom:1px solid #181d29;background:none;color:var(--muted);font:inherit;font-size:13px;line-height:1.4;cursor:pointer;transition:background .12s,color .12s}
.ni:hover{background:#151a26;color:var(--text)}
.ni.unread{color:var(--text);background:rgba(255,171,26,0.05)}
.ni.unread:hover{background:rgba(255,171,26,0.09)}
.ni.unread .nic{box-shadow:0 0 0 2px var(--acc)}
.nic{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--panel3);font-size:14px;font-weight:800;color:var(--muted)}
.t-win .nic{color:var(--green)}.t-loss .nic,.t-ban .nic{color:var(--red)}.t-pass .nic,.t-prio .nic,.t-shop .nic{color:var(--acc)}.t-mission .nic{color:var(--green)}
.nt{display:flex;flex-direction:column;gap:3px}
.nt small{color:var(--dim);font-size:11px}
.np-empty{padding:30px 14px;text-align:center;color:var(--dim);font-size:13px;background:#0d1017}
@media(max-width:860px){.top .notif-btn{display:grid}}

/* ---------- Stats de maps au veto ---------- */
.veto-grid .vmap{height:74px}
.vmap .vst{position:absolute;left:8px;right:8px;bottom:6px;z-index:1;display:flex;justify-content:space-between;align-items:flex-end;gap:6px;pointer-events:none}
.vmap .vst .us,.vmap .vst .them{display:flex;flex-direction:column;line-height:1}
.vmap .vst .them{align-items:flex-end}
.vmap .vst small{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:2px}
.vmap .vst .us b{font-family:var(--cond);font-size:15px;font-weight:700;color:#d6d8dc}
.vmap .vst .them b{font-family:var(--cond);font-size:24px;font-weight:700}
.vmap .vst .them b.hi{color:#ff5a5a}.vmap .vst .them b.mid{color:#f2c94c}.vmap .vst .them b.lo{color:#4ade80}
.vmap.rec{box-shadow:inset 0 0 0 2px var(--red)}
.vmap .rtag{position:absolute;top:5px;right:6px;z-index:1;font-family:var(--cond);font-size:10px;font-weight:700;letter-spacing:.032em;text-transform:uppercase;background:var(--red);color:#fff;padding:1px 5px;border-radius:2px}
.vmap.ban .vst{opacity:.45}
.veto-legend{display:flex;justify-content:space-between;font-size:11px;color:var(--dim);margin:-4px 0 8px}

/* ---------- Chat de la room ---------- */
.lchat{margin-top:14px;padding:0;overflow:hidden}
.lc-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line)}
.lc-h>b{display:flex;align-items:center;gap:8px;font-family:var(--cond);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.016em}
.lc-h svg{width:16px;height:16px;color:var(--acc)}
.lc-tabs button{position:relative}
.lc-tabs button i{position:absolute;top:4px;right:4px;width:6px;height:6px;border-radius:50%;background:var(--acc);display:none}
.lc-tabs button.new i{display:block}
.lc-msgs{height:220px;overflow-y:auto;padding:10px 14px;display:flex;flex-direction:column;gap:5px;font-size:13px;line-height:1.4}
.lm{word-wrap:break-word}
.lm .tm{color:var(--dim);font-size:11px;margin-right:6px;font-variant-numeric:tabular-nums}
.lm .ch{font-family:var(--cond);font-weight:700;font-size:11px;letter-spacing:.02em;margin-right:4px}
.lm .who{font-weight:700;cursor:pointer;margin-right:4px}
.lm.tA .who{color:#5aa2ff}.lm.tB .who{color:#ef5560}.lm.me .who{color:var(--acc)}
.lm.c-team .ch{color:#5aa2ff}.lm.c-all .ch{color:var(--dim)}
.lm.sys{color:var(--muted);font-style:italic;font-size:12px}
.lm.sys::before{content:"• ";color:var(--acc)}
.lc-form{display:flex;gap:8px;align-items:center;padding:10px 14px;border-top:1px solid var(--line);background:var(--bg2)}
.lc-to{font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.02em;text-transform:uppercase;color:#5aa2ff;white-space:nowrap}
.lc-to.all{color:var(--muted)}
.lc-form input{flex:1;min-width:0;height:38px;padding:0 12px;border-radius:8px;border:1px solid var(--line2);background:var(--panel);color:var(--text);font:inherit;transition:border-color .15s,box-shadow .15s}
.lc-form input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),0 2px 8px rgba(0,0,0,.4)}
.lc-form .btn{height:38px;width:44px;padding:0}
.lc-form .btn svg{width:16px;height:16px}

/* ---------- Messages privés (dock) ---------- */
.dock{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none}
.dock>*{pointer-events:auto}
.dk-btn{position:relative;width:52px;height:52px;border-radius:50%;border:1px solid var(--line2);background:var(--panel);color:var(--text);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.5);transition:border-color .15s,transform .15s}
.dk-btn:hover{border-color:var(--acc);transform:translateY(-1px)}
.dk-btn svg{width:22px;height:22px}
.dk-btn b{position:absolute;top:-3px;right:-3px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--acc);color:var(--on-acc);font-size:11px;font-weight:800;display:grid;place-items:center;border:2px solid var(--bg)}
.dk-btn b[hidden],.notif-btn .nb[hidden]{display:none!important}
.dk-list,.dk-win{width:340px;max-width:calc(100vw - 24px);background:#0d1017;background:rgba(13,16,23,0.98);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid #232a38;border-radius:8px;box-shadow:0 18px 48px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,0.06);overflow:hidden}
.dk-list[hidden],.dk-win[hidden]{display:none}
.dk-lh{padding:12px 14px;border-bottom:1px solid #1f2533;background:#11151f;font-family:var(--cond);font-size:16px;font-weight:700;letter-spacing:.008em}
.dk-items{max-height:min(60vh,420px);overflow-y:auto;background:#0d1017}
.dk-it{display:flex;gap:10px;align-items:center;width:100%;padding:10px 14px;border:none;border-bottom:1px solid #181d29;background:none;color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:background .12s}
.dk-it:hover{background:#151a26}
.dk-it .av{flex:none}
.dk-it .mid{flex:1;min-width:0}
.dk-it .mid b{display:flex;align-items:center;gap:6px;font-size:14px}
.dk-it .mid small{display:block;color:var(--dim);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dk-it .un{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--acc);color:var(--on-acc);font-size:11px;font-weight:800;display:grid;place-items:center}
.sdot{width:8px;height:8px;border-radius:50%;background:var(--dim);flex:none}
.sdot.online{background:var(--green)}.sdot.ingame{background:var(--acc)}
.dk-win{display:flex;flex-direction:column;height:min(460px,calc(100vh - 120px))}
.dk-wh{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid #1f2533;background:#11151f}
.dk-wh .mid{flex:1;min-width:0;cursor:pointer}
.dk-wh .mid b{display:block;font-size:14px}
.dk-wh .mid small{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px}
.dk-wh button.ic{width:30px;height:30px;border-radius:5px;border:1px solid transparent;background:none;color:var(--muted);cursor:pointer;display:grid;place-items:center;font-size:18px;line-height:1}
.dk-wh button.ic:hover{border-color:var(--line2);color:var(--text)}
.dk-wh button.ic:disabled{opacity:.35;cursor:default}
.dk-wh button.ic svg{width:16px;height:16px}
.dk-msgs{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:4px}
.bub{max-width:78%;padding:7px 11px;border-radius:14px;font-size:13px;line-height:1.4;word-wrap:break-word;background:var(--panel3);align-self:flex-start;border-bottom-left-radius:4px}
.bub.me{align-self:flex-end;background:var(--acc);color:var(--on-acc);border-bottom-left-radius:14px;border-bottom-right-radius:4px}
.bub-t{font-size:10px;color:var(--dim);margin:2px 4px 6px;align-self:flex-start}
.bub-t.me{align-self:flex-end}
.dk-day{align-self:center;font-size:11px;color:var(--dim);margin:6px 0}
.dk-note{align-self:center;text-align:center;font-size:12px;color:var(--muted);background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:6px 10px;margin:6px 0}
.typing{align-self:flex-start;display:flex;gap:4px;padding:10px 12px;border-radius:14px;background:var(--panel3)}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:tyDot 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes tyDot{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.dk-form{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}
.dk-form input{flex:1;min-width:0;height:38px;padding:0 12px;border-radius:19px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}
.dk-form input:focus{outline:none;border-color:var(--acc)}
.dk-form .btn{width:38px;height:38px;padding:0;border-radius:50%}
.dk-form .btn svg{width:16px;height:16px}
.dk-empty{padding:26px 14px;text-align:center;color:var(--dim);font-size:13px}
@media(max-width:720px){.dock{right:12px;bottom:70px}.dk-btn{width:46px;height:46px}.lc-msgs{height:180px}}

/* ---------- Vocal de la room ---------- */
.vc-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,rgba(63,207,142,.05),transparent 60%)}
.vc-bar .vc-t{display:flex;align-items:center;gap:8px;font-family:var(--cond);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.016em}
.vc-bar .vc-t svg{width:16px;height:16px;color:var(--green)}
.vc-bar .vc-t small{font-family:var(--font-main);font-size:12px;font-weight:400;text-transform:none;letter-spacing:0;color:var(--muted)}
.vc-bar .grow{flex:1}
.vc-bar .btn{height:34px;font-size:12px}
.vc-bar .btn.on{border-color:var(--red);color:var(--red)}
.vc-bar .btn.join{background:var(--green);border-color:var(--green);color:#062214}
.vc-bar .btn svg{width:15px;height:15px}
.vc-meter{width:90px;height:6px;border-radius:3px;background:var(--line2);overflow:hidden}
.vc-meter i{display:block;height:100%;width:0;background:var(--green);transition:width .08s}
.vc-ptt{font-size:12px;color:var(--muted)}
.vc-ptt kbd{display:inline-block;min-width:18px;padding:0 5px;border:1px solid var(--line2);border-bottom-width:2px;border-radius:3px;font:700 11px var(--font-main);color:var(--text);text-align:center}
.vc-ptt.down kbd{background:var(--green);color:#062214;border-color:var(--green)}
.vc-note{width:100%;font-size:11px;color:var(--dim)}
.prow.talk .avatar{box-shadow:0 0 0 2px var(--green),0 2px 8px rgba(0,0,0,.5)}
.prow .vspk{display:none;color:var(--green);margin-left:4px;vertical-align:-2px}
.prow .vspk svg{width:13px;height:13px}
.prow.talk .vspk{display:inline}
.prow.vmuted .vspk{display:inline;color:var(--red)}

/* ---------- Compétition ---------- */
.cp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.cp-tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:16px;overflow-x:auto}
.cp-tabs button{padding:10px 16px;border:none;background:none;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.012em;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.cp-tabs button.on{color:var(--text);border-bottom-color:var(--acc)}
/* ligues */
.lg-hero{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:22px;align-items:center;padding:22px;border-radius:8px;border:1px solid var(--line);background:var(--panel);overflow:hidden}
.emb{position:relative;width:110px;height:124px;display:grid;place-items:center;flex:none}
.emb::before{content:"";position:absolute;inset:0;clip-path:polygon(50% 0,100% 22%,100% 70%,50% 100%,0 70%,0 22%);background:linear-gradient(160deg,color-mix(in srgb,var(--lc) 100%,#fff 25%),color-mix(in srgb,var(--lc) 70%,#000 45%))}
.emb::after{content:"";position:absolute;inset:7px;clip-path:polygon(50% 0,100% 22%,100% 70%,50% 100%,0 70%,0 22%);background:linear-gradient(160deg,#18191d,#0b0b0d)}
.emb b{position:relative;z-index:1;font-family:var(--cond);font-weight:700;font-size:38px;color:var(--lc);line-height:1;text-shadow:0 2px 8px rgba(0,0,0,.85)}
.emb small{position:absolute;z-index:1;bottom:20px;font-family:var(--cond);font-weight:700;font-size:13px;letter-spacing:.048em;color:#fff}
.emb.sm{width:42px;height:48px}.emb.sm::after{inset:3px}.emb.sm b{font-size:15px}.emb.sm small{display:none}
.lg-name{font-family:var(--cond);font-weight:700;font-size:40px;line-height:1;text-transform:uppercase;color:var(--lc)}
.lg-sub{color:var(--muted);margin-top:4px}
.lg-bar{height:8px;border-radius:4px;background:var(--line2);margin:14px 0 6px;overflow:hidden;max-width:560px}
.lg-bar i{display:block;height:100%;background:var(--lc)}
.lg-meta{display:flex;justify-content:space-between;max-width:560px;font-size:12px;color:var(--muted)}
.lg-season{text-align:right}
.lg-season b{display:block;font-family:var(--cond);font-size:26px;font-weight:700}
.lg-season small{color:var(--muted);font-size:12px}
.lg-ladder{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;margin:14px 0}
.lg-step{padding:10px 8px;border-radius:6px;border:1px solid var(--line);background:var(--panel);text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.lg-step.me{border-color:var(--lc);box-shadow:0 0 0 1px var(--lc) inset}
.lg-step b{font-family:var(--cond);font-size:14px;font-weight:700;text-transform:uppercase;color:var(--lc)}
.lg-step small{font-size:11px;color:var(--dim)}
.lg-step .pc{font-size:12px;color:var(--muted)}
.cpl-grid>*,.tn-top>*{min-width:0}
#compet .lg-embed{margin-top:0}
#leagues.lg-embed>.rk-head .h1{display:none}
.cpl-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:12px;align-items:start}
.zone-up td:first-child{box-shadow:inset 3px 0 0 var(--green)}
.zone-down td:first-child{box-shadow:inset 3px 0 0 var(--red)}
.lg-legend{display:flex;gap:14px;font-size:12px;color:var(--muted);padding:10px 14px;border-top:1px solid var(--line)}
.lg-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.rgn{display:inline-block;min-width:30px;text-align:center;font-family:var(--cond);font-weight:700;font-size:11px;letter-spacing:.02em;padding:1px 5px;border-radius:3px;background:var(--panel3);color:var(--muted)}
.pro-band{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:8px;margin:14px 0;border:1px solid #6b5a33;background:linear-gradient(90deg,rgba(var(--acc-rgb),.12),transparent 70%)}
.pro-band b{font-family:var(--cond);font-size:20px;font-weight:700;text-transform:uppercase;color:var(--acc)}
.pro-band span{color:var(--muted);font-size:13px}
/* tournois */
.tn-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.tn-tools .seg{max-width:100%;overflow-x:auto;scrollbar-width:none}
.tn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.tn-card{position:relative;border-radius:8px;border:1px solid var(--line);background:var(--panel);overflow:hidden;cursor:pointer;display:flex;flex-direction:column;transition:border-color .15s}
.tn-card:hover{border-color:var(--line2)}
.tn-card .bn{height:92px;background-size:cover;background-position:center;position:relative}
.tn-card .bn::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--panel),rgba(13,14,16,.35))}
.tn-card .tags{position:absolute;top:10px;left:10px;z-index:1;display:flex;gap:6px}
.tg2{font-family:var(--cond);font-weight:700;font-size:11px;letter-spacing:.024em;text-transform:uppercase;padding:2px 7px;border-radius:3px;background:rgba(5,5,6,.75);color:var(--text);border:1px solid var(--line2)}
.tg2.off{background:var(--acc);color:var(--on-acc);border-color:var(--acc)}
.tg2.live{background:var(--red);border-color:var(--red);color:#fff}
.tg2.done{color:var(--dim)}
.tg2.fund{border-color:#f2c94c;color:#f2c94c}
.tn-card .bd{padding:4px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.tn-card h3{font-family:var(--cond);font-size:22px;font-weight:700;line-height:1.05}
.tn-card .org{font-size:12px;color:var(--dim)}
.tn-card .prize{font-family:var(--cond);font-size:26px;font-weight:700;color:var(--acc);line-height:1}
.tn-card .prize small{font-size:12px;color:var(--muted);font-family:var(--font-main);font-weight:400;margin-left:6px}
.tn-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:auto}
.tn-facts div{background:var(--panel2);border-radius:4px;padding:6px 8px;font-size:11px;color:var(--dim)}
.tn-facts b{display:block;font-size:13px;color:var(--text)}
.tn-slots{height:4px;border-radius:2px;background:var(--line2);overflow:hidden}
.tn-slots i{display:block;height:100%;background:var(--green)}
.tn-top{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:12px;align-items:start}
.tn-hero{border-radius:8px;overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.tn-hero .bn{height:150px;background-size:cover;background-position:center;position:relative}
.tn-hero .bn::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--panel),rgba(13,14,16,.2))}
.tn-hero .in{padding:0 18px 18px;margin-top:-46px;position:relative;z-index:1}
.tn-hero h2{font-family:var(--cond);font-size:38px;font-weight:700;line-height:1}
.tn-rules{white-space:pre-wrap;font-size:13px;color:var(--muted);margin-top:10px;line-height:1.5}
.pz-row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.pz-row b{font-family:var(--cond);font-size:17px;font-weight:700;color:var(--acc)}
.bracket{display:flex;gap:26px;overflow-x:auto;padding:6px 2px 14px}
.br-col{display:flex;flex-direction:column;justify-content:space-around;gap:10px;min-width:200px}
.br-col h4{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.032em;text-transform:uppercase;color:var(--dim);text-align:center;margin-bottom:2px}
.br-m{border:1px solid var(--line2);border-radius:5px;background:var(--panel);overflow:hidden;font-size:13px}
.br-t{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 9px}
.br-t+.br-t{border-top:1px solid var(--line)}
.br-t span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:6px}
.br-t b{font-family:var(--cond);font-weight:700;font-size:15px;color:var(--dim)}
.br-t.w{background:rgba(63,207,142,.07)}.br-t.w b{color:var(--green)}
.br-t.l{opacity:.5}
.br-t.mine span{color:var(--acc);font-weight:700}
.br-t.tbd{color:var(--dim);font-style:italic}
.tm-dot{width:10px;height:10px;border-radius:3px;flex:none}
.champ{display:flex;align-items:center;gap:12px;padding:14px;border-radius:6px;border:1px solid #6b5a33;background:linear-gradient(90deg,rgba(var(--acc-rgb),.12),transparent)}
.champ b{font-family:var(--cond);font-size:22px;font-weight:700}
.reg-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px}
.reg-it{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:5px;background:var(--panel2);font-size:13px}
.reg-it small{margin-left:auto;color:var(--dim)}
.reg-it.mine{box-shadow:inset 0 0 0 1px var(--acc)}
.legal{font-size:12px;color:var(--muted);background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:10px 12px;line-height:1.5}
.legal b{color:var(--text)}
#tnForm .af input,#tnForm .af select,#tnForm .af textarea{width:100%;height:40px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}
#tnForm .af textarea{height:80px;padding:8px 10px;resize:vertical}
#tnForm .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* équipes */
.team-card{border-radius:14px;border:1px solid var(--line);background:var(--panel);overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .18s,border-color .18s,box-shadow .18s}
.team-card:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 10px 28px rgba(0,0,0,.45)}
.team-card .bn{height:84px;position:relative;background:linear-gradient(120deg,var(--tc),#0b0b0d 80%)}
.team-card .tlogo{position:absolute;left:18px;bottom:-26px;width:64px;height:64px;border-radius:10px;display:grid;place-items:center;background:var(--tc);border:3px solid var(--panel);font-family:var(--cond);font-weight:700;font-size:20px;color:#fff;letter-spacing:.016em}
.team-card .in{padding:34px 18px 18px}
.team-card h2{font-family:var(--cond);font-size:30px;font-weight:700;line-height:1}
.team-card h2 small{font-size:16px;color:var(--muted);margin-left:8px}
.tm-stats{display:flex;gap:18px;margin:10px 0 14px;font-size:13px;color:var(--muted)}
.tm-stats b{color:var(--text);font-family:var(--cond);font-size:18px}
.ros{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.ros .nm{flex:1;min-width:0}
.ros .nm b{font-size:14px}.ros .nm small{display:block;color:var(--dim);font-size:12px}
.ros .btn{height:28px;font-size:12px;padding:0 10px}
.swatches{display:flex;gap:6px;flex-wrap:wrap}
.swatches button{width:28px;height:28px;border-radius:6px;border:2px solid transparent;cursor:pointer}
.swatches button.on{border-color:#fff}
.team-new{max-width:520px}
.team-new .af input{width:100%;height:42px;padding:0 12px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}
.inv-it{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}
.inv-it span{flex:1}
@media(max-width:1100px){.cpl-grid,.tn-top{grid-template-columns:minmax(0,1fr)}.lg-ladder{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:720px){.lg-hero{grid-template-columns:auto minmax(0,1fr)}.lg-season{grid-column:1/-1;text-align:left}.lg-name{font-size:30px}.emb{width:84px;height:96px}.emb b{font-size:28px}.tn-grid{grid-template-columns:minmax(0,1fr)}#tnForm .two{grid-template-columns:1fr}}

/* ---------- Langues ---------- */
.lang{position:relative}
.lang-btn{display:grid;place-items:center;gap:1px;cursor:pointer;border:none;background:none;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.024em}
.lang-btn svg{width:18px;height:18px}
.lang-btn:hover,.lang.open .lang-btn{color:var(--text)}
.rail .lang-btn{width:44px;height:50px;border-radius:6px}
.rail .lang-btn:hover,.rail .lang.open .lang-btn{background:var(--panel)}
.lang-top{display:none}
.lang-top .lang-btn{height:38px;padding:0 10px;border-radius:6px;border:1px solid var(--line);background:var(--panel);display:flex;gap:6px}
.lang-menu{position:absolute;z-index:120;min-width:190px;padding:6px;border-radius:8px;background:#0d1017;background:rgba(13,16,23,0.98);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid #232a38;box-shadow:0 18px 48px rgba(0,0,0,.8);opacity:0;pointer-events:none;transform:translateY(4px);transition:.15s}
.lang.open .lang-menu{opacity:1;pointer-events:auto;transform:none}
.rail .lang-menu{left:54px;bottom:0}
.lang-top .lang-menu{right:0;top:46px}
.lang-h{font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--dim);padding:7px 9px 5px}
.lang-opt{display:flex;align-items:center;gap:10px;width:100%;padding:9px;border:none;background:none;border-radius:4px;cursor:pointer;text-align:left;font-size:14px;font-weight:500;color:var(--muted)}
.lang-opt:hover{background:var(--panel3);color:var(--text)}
.lang-opt.on{color:var(--text)}
.lang-opt .code{width:28px;height:20px;border-radius:3px;display:grid;place-items:center;font-family:var(--cond);font-size:11px;font-weight:700;color:var(--text);background:var(--panel3);flex-shrink:0}
.lang-opt.on .code{background:var(--acc);color:var(--on-acc)}
.lang-opt .chk2{margin-left:auto;color:var(--acc);opacity:0}
.lang-opt.on .chk2{opacity:1}
.lang-opt .chk2 svg{width:14px;height:14px}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);background:var(--panel3);border:1px solid var(--line2);padding:11px 16px;border-radius:6px;font-size:13px;font-weight:500;opacity:0;pointer-events:none;transition:.25s;z-index:200;box-shadow:0 12px 30px rgba(0,0,0,.5);max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes scan{0%{left:-30%}100%{left:100%}}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
  .versus{grid-template-columns:minmax(0,1fr)}.versus .center{order:-1}
  .party{flex-wrap:wrap}.pcard{flex:0 1 180px}
  .tiles{grid-template-columns:repeat(4,1fr)}.p-grid,.p-grid2,.res-grid{grid-template-columns:minmax(0,1fr)}
  .p-row{grid-template-columns:auto 1fr}.p-lvl{grid-column:1/-1}
}
.mobile-hub{display:none}
@media(max-width:768px){
  .mobile-hub{display:block;margin-bottom:14px}
  .mh-card{background:linear-gradient(135deg,#0d141d 0%,#080c10 100%);border:1px solid rgba(240,165,30,.25);border-radius:8px;padding:16px 14px;box-shadow:0 8px 24px rgba(0,0,0,.45)}
  .mh-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;flex-wrap:wrap}
  .mh-badge{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.032em;color:var(--acc);background:rgba(240,165,30,.12);border:1px solid rgba(240,165,30,.3);padding:2px 8px;border-radius:4px}
  .mh-tag{font-size:12px;font-weight:600;color:var(--text);opacity:.9}
  .mh-title{font-family:var(--cond);font-size:18px;font-weight:700;color:#fff;margin:0 0 6px;line-height:1.2}
  .mh-desc{font-size:12.5px;color:var(--muted);line-height:1.45;margin:0 0 14px}
  .mh-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
  .mh-btn{width:100%;height:38px;padding:0 10px;font-size:12.5px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:6px;white-space:nowrap}
}
@media(max-width:720px){
  .app{grid-template-columns:minmax(0,1fr)}.rail{display:none}
  .top{padding:0 14px;gap:10px}.tabs,.online,.icon-btn,.concept,.profile .meta{display:none}.lang-top{display:block}
  .brand{font-size:16px}
  .page{padding:14px 12px 76px}
  .modes{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-bottom:12px}
  .mode{padding:10px 10px;min-height:auto}
  .mode .m-name{font-size:14px}
  .mode .m-desc{display:none}
  .party{gap:6px}
  .pcard{flex:1 1 130px}
  .pcard .bn{height:48px}
  .pcard .big{width:56px;height:56px;margin-top:-28px}
  .pcard .pname{font-size:15px;margin-top:6px}
  .pcard.empty{min-height:0;height:54px;flex-direction:row;flex-basis:100%}.pcard.empty .plus{width:28px;height:28px;font-size:16px}
  .maps{grid-template-columns:repeat(2,1fr);gap:6px}
  .map{height:76px}
  .map .mn{font-size:13px}
  .find{height:52px}
  .find .fl{font-size:18px}
  .res-head{flex-direction:column;align-items:flex-start;padding:20px 16px}.res-title{font-size:34px}.res-score{font-size:40px}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .p-banner{height:140px}.p-row{grid-template-columns:1fr;padding:0 16px 18px;margin-top:-48px;gap:14px}
  .p-av{width:96px;height:96px;font-size:40px}.p-name{font-size:26px}
  .res-actions{flex-direction:column}.res-actions .find{width:100%}
  .reasons,.rep-list{grid-template-columns:1fr}
}

/* =====================================================================
   THÈME v2 — graphite « menu CS » : noir bleuté, panneaux acier, ambre de marque.
   Titres en casse normale (plus de petites capitales espacées partout),
   chiffres tabulaires. Une seule chose spectaculaire : le prestige des meilleurs.
   ===================================================================== */
:root{
  --bg:#06080b;--bg2:#090c10;--panel:#0d1117;--panel2:#131922;--panel3:#1a212c;
  --line:#19202a;--line2:#26303d;
  --text:#e8ecf1;--muted:#93a0b0;--dim:#5d6878;
  --ct:#6c9ef8;--tt:#e0a640;
  --master:#a77bff;--elite:#ff4d5e;--pro1:#fff3c4;--pro2:#f2c14e;--pro3:#a8711a;
}
body{font-variant-numeric:tabular-nums}
.h1{text-transform:none;letter-spacing:-.01em;font-size:36px;line-height:1.05}
.h3{text-transform:none;letter-spacing:0;font-size:19px;font-weight:700}
.h3 span{font-family:var(--font-main);font-size:12px;font-weight:500;color:var(--dim)}
.label{text-transform:none;letter-spacing:0;font-family:var(--font-main);font-weight:600;font-size:13px;color:var(--muted)}
.tab{text-transform:none;letter-spacing:.01em;font-size:17px;font-weight:600}
.tab.active{color:var(--text)}
.cats button,.cp-tabs button,.rk-tabs button,.auth-tabs button,.lc-h>b,.vc-bar .vc-t,.np-h b,.dk-lh,
.stage-head .ttl,.pcard.empty span,.mg-t,.tbl th,.tile span,.m-h h3,.banbox .bt,.sec-t,.veto-h b,.fld label,.af label,.af-or,
.joinbox .jb-h b,.lg-step b,.pro-band b,.br-col h4,.lang-h,.kg-band b,.rw-lbl,.locked b{text-transform:none;letter-spacing:0}
.stage-head .ttl,.m-h h3,.sec-t{font-size:19px}
.tbl th{font-family:var(--font-main);font-weight:600;font-size:12px}
.fld label,.af label{font-family:var(--font-main);font-weight:600;font-size:13px}
.mg-t{font-family:var(--font-main);font-weight:600;font-size:12px;color:var(--dim)}
.card{border-radius:4px}
.btn.primary:disabled{background:var(--panel2);border-color:var(--line2);color:var(--dim);opacity:1}
.top{background:linear-gradient(180deg,#0b0f15,var(--bg))}
.rail{background:#080b0f}
.team.a{border-top-color:var(--ct)}.team.b{border-top-color:var(--tt)}

/* =====================================================================
   PRESTIGE — Master (2100+), Élite (2400+), Pro League (top 50 mondial)
   Master : liseré violet · Élite : double liseré rouge + puce
   Pro League : anneau « or brossé » qui tourne lentement, pseudo doré, plaque sur le profil
   ===================================================================== */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.avatar.pr-master{box-shadow:0 0 0 2px var(--panel),0 0 0 3px var(--master)}
.avatar.pr-elite{box-shadow:0 0 0 2px var(--panel),0 0 0 3px var(--elite),0 4px 12px rgba(0,0,0,.5)}
.avatar.pr-pro{position:relative;box-shadow:0 4px 14px rgba(0,0,0,.6)}
.avatar.pr-pro::before{content:"";position:absolute;inset:-4px;border-radius:7px;padding:2px;pointer-events:none;
  background:conic-gradient(from var(--ang),var(--pro3),var(--pro1),var(--pro2),var(--pro3),var(--pro1),var(--pro2),var(--pro3));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:foil 7s linear infinite}
@keyframes foil{to{--ang:360deg}}
.pb.pro{background:linear-gradient(135deg,var(--pro1),var(--pro2) 45%,var(--pro3));color:#2a1a00}
.pb.elite{background:rgba(255,77,94,.1);color:var(--elite);box-shadow:inset 0 0 0 1px var(--elite)}
.gold-txt,.pl:has(.pb.pro)>span[data-profile]:nth-child(2),.pn:has(.pb.pro)>span[data-profile],#profile.pp-pro .p-name{
  background:linear-gradient(100deg,var(--pro3),var(--pro1) 30%,var(--pro2) 55%,var(--pro3));-webkit-background-clip:text;background-clip:text;color:transparent}
/* profil */
#profile.pp-pro .p-hero,#profile.pp-elite .p-hero{position:relative}
#profile.pp-pro .p-hero{box-shadow:0 0 0 1px var(--pro3),0 18px 48px -20px rgba(242,193,78,.2),0 12px 36px rgba(0,0,0,.6)}
#profile.pp-elite .p-hero{box-shadow:0 0 0 1px rgba(255,77,94,.55)}
#profile.pp-pro .p-banner{position:relative}
#profile.pp-pro .p-banner::after{background:linear-gradient(90deg,var(--pro3),var(--pro1),var(--pro2),var(--pro3)) bottom/100% 3px no-repeat,linear-gradient(0deg,var(--panel),rgba(13,17,23,0) 70%)}
#profile.pp-elite .p-banner::after{background:linear-gradient(var(--elite),var(--elite)) bottom/100% 3px no-repeat,linear-gradient(0deg,var(--panel),rgba(13,17,23,0) 70%)}
#profile.pp-pro .p-av,#profile.pp-elite .p-av{position:relative}
#profile.pp-pro .p-av::before{content:"";position:absolute;inset:-5px;border-radius:10px;padding:3px;pointer-events:none;
  background:conic-gradient(from var(--ang),var(--pro3),var(--pro1),var(--pro2),var(--pro3),var(--pro1),var(--pro3));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:foil 7s linear infinite}
#profile.pp-pro .p-name,#profile.pp-elite .p-name{filter:drop-shadow(0 2px 3px rgba(0,0,0,.85))}
#profile.pp-elite .p-name{color:#ff8b96}
#profile.pp-elite .p-av{box-shadow:0 0 0 3px var(--panel),0 0 0 5px var(--elite)}
.p-banner .pro-plaque{position:absolute;z-index:2;top:14px;right:14px;margin:0;background:rgba(6,8,11,.82);backdrop-filter:blur(4px)}
.pro-plaque{display:inline-flex;align-items:center;gap:10px;margin-top:8px;padding:5px 12px 5px 6px;border-radius:4px;border:1px solid var(--pro3);background:linear-gradient(90deg,rgba(242,193,78,.14),rgba(242,193,78,.02));font-size:13px;color:var(--muted)}
.pro-plaque b{font-family:var(--cond);font-size:20px;font-weight:700;line-height:1;padding:2px 7px;border-radius:3px;background:linear-gradient(135deg,var(--pro1),var(--pro2) 45%,var(--pro3));color:#2a1a00}
.pro-plaque.elite{border-color:rgba(255,77,94,.6);background:rgba(255,77,94,.07)}
.pro-plaque.elite b{background:var(--elite);color:#fff}
.p-banner .pro-plaque.elite{background:rgba(24,7,10,.85)}
@media(max-width:720px){.p-banner .pro-plaque{top:auto;bottom:14px;right:10px;font-size:12px}.p-banner .pro-plaque b{font-size:16px}}
#profile.pp-pro .p-row,#profile.pp-elite .p-row{position:relative;z-index:1}
/* classement : podium */
#ranking .rk-table tbody tr:nth-child(-n+3) td.rk{font-family:var(--cond);font-size:20px;font-weight:700}
#ranking .rk-table tbody tr:nth-child(1){background:linear-gradient(90deg,rgba(242,193,78,.1),transparent 55%)}
#ranking .rk-table tbody tr:nth-child(1) td.rk{color:var(--pro2)}
#ranking .rk-table tbody tr:nth-child(2) td.rk{color:#c9d2dc}
#ranking .rk-table tbody tr:nth-child(3) td.rk{color:#c98a55}
@media (prefers-reduced-motion:reduce){.avatar.pr-pro::before,#profile.pp-pro .p-av::before{animation:none}}

/* =====================================================================
   v3 — plus sombre, moins flashy ; boutons « touches » qui s'enfoncent ;
   chiffres centrés
   ===================================================================== */
:root{
  --bg:#050608;--bg2:#080a0d;--panel:#0b0e13;--panel2:#11161d;--panel3:#171d26;
  --line:#171d26;--line2:#232b36;
  --acc:#f0a51e;--acc-h:#ffb93a;--acc-d:#a86a08;--on-acc:#1a1102;
}
/* chiffres */
.tcv{display:inline-flex;align-items:center;gap:5px;vertical-align:middle;line-height:1;white-space:nowrap}
.tcv .tc{margin:0;vertical-align:0;flex:none}
.lvl .lvl-n{display:none}
.lvl svg text{font-variant-numeric:tabular-nums}
.tbl th.c,.tbl td:has(>.lvl){text-align:center}
.tbl td>.lvl{margin:0 auto;vertical-align:middle}
.tbl td,.tbl th{vertical-align:middle}
.ms .rw2{align-items:center;line-height:1}
.ms .ft{min-height:26px}
.ms-grid{align-items:stretch}.ms.locked{margin:0;min-height:0;height:auto}
.rwd b,.pz-row b,.prize,.pack .n{display:inline-flex;align-items:center;gap:6px}

/* ---------- Boutons ---------- */
.btn{height:40px;padding:0 18px;border-radius:10px;font-weight:600;font-size:13.5px;letter-spacing:.01em;
  background:var(--panel2);border:1px solid var(--line2);
  box-shadow:0 1px 2px rgba(0,0,0,.3),0 2px 6px rgba(0,0,0,.25);
  transition:background .15s,border-color .15s,color .15s,transform .08s,box-shadow .08s}
.btn:hover{background:var(--panel3);border-color:rgba(255,255,255,.2);box-shadow:0 2px 8px rgba(0,0,0,.4)}
.btn:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 1px 2px rgba(0,0,0,.5)}
.btn:focus-visible,.find:focus-visible,.connect:focus-visible,.accept-btn:focus-visible,.seg button:focus-visible,.tab:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.btn.primary{color:#0e0a02;border:1px solid rgba(255,255,255,.18);font-weight:700;
  background:linear-gradient(180deg,#ffbd42 0%,#ff9e1f 100%);
  box-shadow:0 1px 2px rgba(0,0,0,.3),0 3px 10px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.primary:hover{background:linear-gradient(180deg,#ffc654 0%,#ffa72b 100%);border-color:rgba(255,255,255,.3);box-shadow:0 0 0 1px rgba(255,171,26,.4),0 4px 14px rgba(0,0,0,.5),0 6px 18px rgba(255,171,26,.12),inset 0 1px 0 rgba(255,255,255,.45)}
.btn.primary:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,.4),inset 0 1px 2px rgba(0,0,0,.2)}
.btn.primary:disabled{background:var(--panel2);border-color:var(--line2);color:var(--dim);box-shadow:none}
.btn.ghost{background:transparent;box-shadow:none}
.btn.ghost:hover{background:var(--panel2);border-color:#334051}
.btn.danger{background:linear-gradient(180deg,#f43f5e 0%,#e11d48 100%);border:1px solid rgba(255,255,255,.15);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.3),0 3px 10px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.25)}
.btn.danger:hover{background:linear-gradient(180deg,#fb7185 0%,#f43f5e 100%);border-color:rgba(255,255,255,.25);box-shadow:0 0 0 1px rgba(244,63,94,.4),0 4px 14px rgba(0,0,0,.5),0 6px 18px rgba(244,63,94,.12),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.sm{height:32px;padding:0 12px;font-size:12.5px;border-radius:8px}
.btn.steam-btn{background:linear-gradient(180deg,#22344a,#1b2838);border-color:#2f4a63}
.find,.connect,.accept-btn{border-radius:14px;clip-path:none;transition:transform .08s,filter .15s,background .15s}
.find{background:linear-gradient(180deg,#ffbd42 0%,#f59e0b 60%,#d97706 100%);border:1px solid rgba(255,255,255,.2);box-shadow:0 2px 4px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.5),0 4px 16px rgba(245,158,11,.12),inset 0 1px 0 rgba(255,255,255,.45)}
.find:hover{background:linear-gradient(180deg,#ffc552 0%,#fbbf24 60%,#d97706 100%);border-color:rgba(255,255,255,.35);box-shadow:0 0 0 1px rgba(255,190,66,.5),0 4px 10px rgba(0,0,0,.4),0 12px 28px rgba(0,0,0,.6),0 8px 24px rgba(245,158,11,.14),inset 0 1px 0 rgba(255,255,255,.5)}
.find:active{transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.5),inset 0 1px 2px rgba(0,0,0,.2)}
.find .fl{letter-spacing:.08em}
.find.searching{background:#0d1017;border:1px solid rgba(255,171,26,.5);box-shadow:0 0 0 1px rgba(255,171,26,.25),0 8px 24px rgba(0,0,0,.7)}
.find.banned{background:linear-gradient(180deg,#1a1114,#140d10)}
.connect{background:linear-gradient(180deg,#ffbd42 0%,#f59e0b 60%,#d97706 100%);border:1px solid rgba(255,255,255,.2);box-shadow:0 2px 4px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.5),0 4px 16px rgba(245,158,11,.12),inset 0 1px 0 rgba(255,255,255,.45)}
.connect:hover:not(:disabled){background:linear-gradient(180deg,#ffc552 0%,#fbbf24 60%,#d97706 100%);border-color:rgba(255,255,255,.35);box-shadow:0 0 0 1px rgba(255,190,66,.5),0 4px 10px rgba(0,0,0,.4),0 12px 28px rgba(0,0,0,.6),0 8px 24px rgba(245,158,11,.14),inset 0 1px 0 rgba(255,255,255,.5)}
.connect:active:not(:disabled){transform:translateY(1px)}
.accept-btn{background:linear-gradient(180deg,#34d399 0%,#10b981 60%,#059669 100%);border:1px solid rgba(255,255,255,.25);box-shadow:0 2px 4px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.5),0 4px 16px rgba(16,185,129,.15),inset 0 1px 0 rgba(255,255,255,.4)}
.accept-btn:active:not(:disabled){transform:translateY(1px)}
.sim{border-radius:6px}
.go-prem{border-radius:6px;background:rgba(240,165,30,.06)}
.seg{border-radius:7px;background:var(--bg2)}
.seg button{border-radius:5px;transition:background .15s,color .15s}
.seg button:hover{color:var(--text)}
.seg button.on{background:linear-gradient(180deg,#1d2530,#161c25);color:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 1px 2px rgba(0,0,0,.5)}
.chip{border-radius:6px;background:var(--panel)}
.chip.active{background:linear-gradient(180deg,#171e27,#11161d);border-color:rgba(240,165,30,.7)}
/* moins flashy : maps, pastilles */
.map{border:1px solid var(--line2)}
.map:not(.off){border-color:rgba(240,165,30,.55)}
.pb.premium{background:rgba(240,165,30,.14);color:var(--acc);box-shadow:inset 0 0 0 1px rgba(240,165,30,.6)}
.pb.chal{background:transparent;color:#d9c48a;box-shadow:inset 0 0 0 1px rgba(217,196,138,.45)}
.lg-step.me,.lg-div.on{box-shadow:none}
.launch-hint{font-size:11.5px;color:var(--dim);text-align:center;margin-top:8px}
/* boutique : boutons « Acheter » en contour (12 boutons orange pleins, c'était trop) */
.item .btn.primary,.pack .btn.primary{background:rgba(240,165,30,.08);color:var(--acc);border-color:rgba(240,165,30,.45);box-shadow:none}
.item .btn.primary:hover,.pack .btn.primary:hover{background:linear-gradient(180deg,var(--acc-h),var(--acc) 55%,#dd9310);color:var(--on-acc);border-color:#c4820e}
@media (prefers-reduced-motion:reduce){.btn,.find,.connect,.accept-btn{transition:none}}

/* =====================================================================
   v4 — mise en page « plateforme » (barre latérale avec libellés, recherche),
   gris anthracite neutres, boutons pleins arrondis
   ===================================================================== */
:root{
  --bg:#07090e;--bg2:#0b0f17;--panel:rgba(14,18,28,0.72);--panel2:rgba(20,27,40,0.82);--panel3:rgba(28,38,56,0.88);
  --line:rgba(255,255,255,0.08);--line2:rgba(255,255,255,0.14);
  --text:#f3f4f6;--muted:#9ba1b0;--dim:#646b7a;
  --acc:#ffab1a;--acc-h:#ffbd42;--acc-d:#d97706;--on-acc:#0e0a02;
}
.app{grid-template-columns:232px minmax(0,1fr)}
.rail{align-items:stretch;padding:16px 12px;gap:3px;background:rgba(9,12,19,0.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--line)}
.logo-row{display:flex;align-items:center;gap:12px;padding:2px 8px 18px;margin-bottom:8px;border-bottom:1px solid var(--line)}
.logo-row .logo{margin:0;width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--acc-h),var(--acc) 55%,#d97706);box-shadow:0 2px 8px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.35);color:#0a0700;font-weight:900}
.rail-brand{font-family:var(--cond);font-weight:700;font-size:20px;letter-spacing:.032em;line-height:1}
.rail-brand b{color:var(--acc)}
.rail-brand small{display:block;font-family:var(--font-main);font-weight:600;font-size:11px;letter-spacing:0;color:var(--dim);margin-top:4px}
.rail-sec{font-family:var(--font-main);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.3);padding:16px 12px 6px}
.rail-btn{width:100%;height:42px;display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:0 14px;border-radius:10px;color:var(--muted);font-size:14px;font-weight:600;transition:all .18s cubic-bezier(0.16,1,0.3,1);position:relative;border:none;background:transparent;cursor:pointer}
.rail-btn svg{width:19px;height:19px;flex:none;transition:color .18s,transform .18s}
.rail-btn:hover{background:rgba(255,255,255,.05);color:#fff;transform:translateX(2px)}
.rail-btn:hover svg{color:var(--acc)}
.rail-btn.active{background:linear-gradient(90deg,rgba(255,171,26,.14) 0%,rgba(255,171,26,.02) 100%);color:#fff;font-weight:700}
.rail-btn.active svg{color:var(--acc)}
.rail-btn.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;background:var(--acc);border-radius:0 3px 3px 0;box-shadow:0 0 6px rgba(255,171,26,.3)}
.rail .lang{align-self:flex-start}
.rail .lang-btn{width:auto;height:40px;padding:0 12px;display:flex;gap:8px;align-items:center}
.top{background:rgba(8,11,18,.82);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--line);height:64px}
.top .brand{display:flex;align-items:center;gap:10px;font-family:var(--cond);font-weight:700;letter-spacing:.032em;font-size:19px;margin-right:12px;cursor:pointer;flex-shrink:0}
.top .brand b{color:var(--acc)}
.top .brand .brand-logo{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,var(--acc-h),var(--acc) 55%,#d97706);color:#0a0a0c;display:grid;place-items:center;font-family:var(--cond);font-weight:900;font-size:13.5px;letter-spacing:0;box-shadow:0 2px 6px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.3)}
.top .concept{display:inline-flex;align-items:center;font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.032em;padding:3px 8px;border-radius:6px;background:var(--panel2);color:var(--muted);margin-right:14px;flex-shrink:0}
.top .tabs{display:none}
.inv-lo-tabs{display:flex;gap:8px;margin-bottom:18px;background:var(--panel2);padding:6px;border-radius:12px;border:1px solid var(--line2);width:fit-content;max-width:100%}
.inv-lo-tab{display:flex;align-items:center;gap:9px;padding:9px 18px;border-radius:8px;border:none;background:transparent;color:var(--muted);font-family:var(--cond);font-size:15px;font-weight:700;letter-spacing:.016em;text-transform:uppercase;cursor:pointer;transition:all .15s ease}
.inv-lo-tab svg{width:17px;height:17px;flex:none}
.inv-lo-tab:hover{color:#fff;background:rgba(255,255,255,.05)}
.inv-lo-tab.on{background:linear-gradient(135deg,var(--acc-h),var(--acc));color:#0c0d12;box-shadow:0 1px 3px rgba(0,0,0,.3),0 4px 12px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.inv-lo-tab.on svg{color:#0c0d12}
.inv-lo-cnt{font-family:var(--font-mono);font-size:11px;font-weight:800;padding:2px 7px;border-radius:999px;background:rgba(0,0,0,.25);color:inherit}
.psearch{position:relative;flex:1;max-width:400px;min-width:180px}
.psearch>svg{position:absolute;left:13px;top:50%;width:16px;height:16px;transform:translateY(-50%);color:var(--dim);pointer-events:none}
.psearch input{width:100%;height:38px;padding:0 12px 0 38px;border-radius:10px;border:1px solid var(--line2);background:rgba(12,16,25,.65);color:var(--text);font:inherit;font-size:13.5px;transition:all .18s ease}
.psearch input:focus{outline:none;border-color:var(--acc);background:rgba(16,22,34,.85);box-shadow:0 0 0 1px var(--acc),0 2px 8px rgba(0,0,0,.4)}
.ps-res{position:absolute;top:44px;left:0;right:0;z-index:120;background:#0d1017;background:rgba(13,16,23,0.98);border:1px solid #232a38;border-radius:12px;box-shadow:0 18px 48px rgba(0,0,0,.8);overflow:hidden;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.ps-it{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;background:none;color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:background .15s}
.ps-it:hover,.ps-it:focus{background:rgba(255,255,255,.06);outline:none}
.ps-it>span{flex:1;min-width:0}
.ps-it small{display:block;color:var(--dim);font-size:12px}
.ps-it b{margin-right:6px}
.ps-none{padding:14px;color:var(--dim);font-size:13px}
.card,.tn-card,.item,.ms,.fr-card,.team-card,.lg-hero,.tn-hero,.p-hero,.pack,.plan{border-radius:14px}
.card{background:var(--panel);border-color:var(--line)}
/* boutons : structurés façon Linear/Steam, ombre physique et liseré spéculaire */
.btn{border-radius:10px;font-weight:600;background:var(--panel2);border:1px solid var(--line2);box-shadow:0 1px 2px rgba(0,0,0,.3),0 2px 6px rgba(0,0,0,.25)}
.btn:hover{background:var(--panel3);border-color:rgba(255,255,255,.2);box-shadow:0 2px 8px rgba(0,0,0,.4)}
.btn.primary{border:1px solid rgba(255,255,255,.18);color:#0e0a02;font-weight:700;background:linear-gradient(180deg,#ffbd42 0%,#ff9e1f 100%);box-shadow:0 1px 2px rgba(0,0,0,.3),0 3px 10px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.primary:hover{background:linear-gradient(180deg,#ffc654 0%,#ffa72b 100%);border-color:rgba(255,255,255,.3);box-shadow:0 0 0 1px rgba(255,171,26,.4),0 4px 14px rgba(0,0,0,.5),0 6px 18px rgba(255,171,26,.12),inset 0 1px 0 rgba(255,255,255,.45)}
.btn.primary:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,.4),inset 0 1px 2px rgba(0,0,0,.2)}
.btn.ghost{background:transparent;border-color:var(--line2)}
.btn.ghost:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.25)}
.find,.connect,.accept-btn{border-radius:14px;clip-path:none}
.find,.connect{background:linear-gradient(180deg,#ffbd42 0%,#f59e0b 60%,#d97706 100%);border:1px solid rgba(255,255,255,.2);box-shadow:0 2px 4px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.5),0 4px 16px rgba(245,158,11,.12),inset 0 1px 0 rgba(255,255,255,.45)}
.find:hover,.connect:hover:not(:disabled){background:linear-gradient(180deg,#ffc552 0%,#fbbf24 60%,#d97706 100%);border-color:rgba(255,255,255,.35);box-shadow:0 0 0 1px rgba(255,190,66,.5),0 4px 10px rgba(0,0,0,.4),0 12px 28px rgba(0,0,0,.6),0 8px 24px rgba(245,158,11,.14),inset 0 1px 0 rgba(255,255,255,.5)}
.find.searching{background:#0d1017;border:1px solid rgba(255,171,26,.5);box-shadow:0 0 0 1px rgba(255,171,26,.25),0 8px 24px rgba(0,0,0,.7)}
.accept-btn{background:linear-gradient(180deg,#34d399 0%,#10b981 60%,#059669 100%);border:1px solid rgba(255,255,255,.25);box-shadow:0 2px 4px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.5),0 4px 16px rgba(16,185,129,.15),inset 0 1px 0 rgba(255,255,255,.4)}
.go-prem{border-radius:10px;border:none;background:linear-gradient(135deg,var(--acc-h),var(--acc));color:var(--on-acc);font-weight:800}
.go-prem:hover{background:linear-gradient(135deg,#ffc44d,#ffab1a)}
.go-prem.has{background:var(--panel2);color:var(--muted)}
.wallet,.icon-btn{border-radius:10px;background:var(--panel)}
.seg{border-radius:10px;background:var(--panel)}
.seg button{border-radius:8px}
.seg button.on{background:var(--panel3);box-shadow:none}
.chip{border-radius:10px}
.map{border-radius:10px}
/* tablette : barre latérale en icônes seules */
@media(max-width:1180px){
  .app{grid-template-columns:68px minmax(0,1fr)}
  .rail{padding:14px 10px}
  .rail-brand,.rail-sec,.rail-btn .rl,.rail .lang-btn [data-lang-code]{display:none}
  .logo-row{justify-content:center;padding:0 0 14px}
  .rail-btn{justify-content:center;padding:0}
  .rail-sec{display:block;height:1px;padding:0;margin:10px 6px;background:var(--line);font-size:0}
}
@media(max-width:720px){.app{grid-template-columns:minmax(0,1fr)}.rail{display:none}.psearch{display:none}.top .brand{display:block}}

/* ---------- Room de match : on remplit les trous sous les équipes ---------- */
.versus{grid-template-areas:"a c b" "chat c voice";grid-template-rows:auto 1fr}
.versus>.team.a{grid-area:a}.versus>.center{grid-area:c}.versus>.team.b{grid-area:b}
.versus>#lchat{grid-area:chat;margin-top:0;align-self:start;display:flex;flex-direction:column;height:540px;position:sticky;top:76px}
.versus>#vcCard{grid-area:voice;align-self:start;padding:0;overflow:hidden}
#lchat .lc-msgs{flex:1;height:auto;min-height:240px;max-height:none}
#vcCard .vc-bar{border-bottom:none;flex-direction:column;align-items:stretch;gap:10px}
#vcCard .vc-bar .grow{display:none}
#vcCard .vc-bar>.seg,#vcCard .vc-bar>.btn{width:100%}
#vcCard .vc-bar>.seg button{flex:1;justify-content:center}
#vcCard .vc-row{display:flex;gap:8px;align-items:center}
#vcCard .vc-row .vc-meter{flex:1;width:auto}
@media(max-width:1100px){.versus{grid-template-areas:"c" "a" "b" "voice" "chat";grid-template-rows:none}.versus>#lchat{height:420px;position:static}}
/* signaler un message */
.lm{position:relative;padding-right:26px}
.lm-rep{position:absolute;right:0;top:0;width:22px;height:22px;border:none;border-radius:4px;background:none;color:var(--dim);cursor:pointer;opacity:0;display:grid;place-items:center}
.lm:hover .lm-rep,.lm-rep:focus-visible{opacity:1}
.lm-rep:hover{color:var(--red);background:var(--panel3)}
.lm-rep svg{width:13px;height:13px}
.lm.reported{opacity:.45}
.lm.reported .lm-rep{opacity:1;color:var(--red);cursor:default}
.bub-wrap{display:flex;align-items:center;gap:4px;align-self:flex-start;max-width:86%}
.bub-wrap .bub{max-width:none}
.bub-wrap .lm-rep{position:static;opacity:0}
.bub-wrap:hover .lm-rep{opacity:1}

/* ---------- Animation de montée de niveau ---------- */
.lvup{position:fixed;inset:0;z-index:300;display:grid;place-items:center;background:radial-gradient(ellipse at center,rgba(8,8,9,.88),rgba(4,4,5,.97));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .35s}
.lvup.on{opacity:1;pointer-events:auto;cursor:pointer}
.lvup .rays{position:absolute;width:900px;height:900px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;
  background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--lc) 22%,transparent) 0 6deg,transparent 6deg 18deg);
  -webkit-mask:radial-gradient(circle,#000 0,transparent 62%);mask:radial-gradient(circle,#000 0,transparent 62%);animation:lvRays 14s linear infinite;opacity:.8}
@keyframes lvRays{to{transform:translate(-50%,-50%) rotate(360deg)}}
.lvup .box{position:relative;text-align:center}
.lvup .k{font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.12em;color:var(--lc);opacity:0;animation:lvIn .5s .2s forwards}
.lvup .badge{position:relative;width:210px;height:210px;margin:14px auto 10px}
.lvup .badge svg{width:100%;height:100%;overflow:visible}
.lvup .badge .ring{stroke-dasharray:var(--c);stroke-dashoffset:var(--c);animation:lvRing 1.1s .35s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes lvRing{to{stroke-dashoffset:0}}
.lvup .old,.lvup .new{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--cond);font-weight:700;font-size:96px;line-height:1}
.lvup .old{color:var(--dim);animation:lvOld .6s .35s forwards}
.lvup .new{color:var(--lc);opacity:0;transform:scale(.4);animation:lvNew .7s 1.05s cubic-bezier(.2,1.6,.4,1) forwards;text-shadow:none;filter:drop-shadow(0 4px 12px rgba(0,0,0,.6))}
@keyframes lvOld{to{opacity:0;transform:translateY(-30px) scale(.7)}}
@keyframes lvNew{to{opacity:1;transform:none}}
@keyframes lvIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.lvup h2{font-family:var(--cond);font-weight:700;font-size:46px;line-height:1;opacity:0;animation:lvIn .5s 1.25s forwards}
.lvup p{color:var(--muted);margin-top:8px;opacity:0;animation:lvIn .5s 1.45s forwards}
.lvup .spark{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:var(--lc);opacity:0;animation:lvSpark 1.1s 1.05s ease-out forwards}
@keyframes lvSpark{0%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.3)}}
.lvup .hint{position:absolute;bottom:-70px;left:0;right:0;font-size:12px;color:var(--dim)}
@media (prefers-reduced-motion:reduce){.lvup *{animation-duration:.01s!important;animation-delay:0s!important}.lvup .rays{animation:none}}

/* ---------- Vocal : membres présents ---------- */
.vc-list{display:flex;flex-direction:column;gap:2px;padding:4px 10px 10px;max-height:340px;overflow-y:auto}
.vc-m{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:8px;transition:background .15s}
.vc-m:hover{background:var(--panel2)}
.vc-m .avatar{width:30px;height:30px;font-size:13px;transition:box-shadow .12s}
.vc-m.talk .avatar{box-shadow:0 0 0 2px var(--panel),0 0 0 3px var(--green),0 2px 8px rgba(0,0,0,.5)}
.vc-m .nm{flex:1;min-width:0;line-height:1.2}
.vc-m .nm b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vc-m .nm small{font-size:11.5px;color:var(--dim)}
.vc-m.tA .nm small{color:#6c9ef8}.vc-m.tB .nm small{color:#e0a640}
.vc-m.mut{opacity:.55}
.vc-mbtn{width:30px;height:30px;border-radius:7px;border:none;background:none;color:var(--dim);display:grid;place-items:center;cursor:pointer;font-size:13px}
.vc-mbtn:hover:not(:disabled){background:var(--panel3);color:var(--text)}
.vc-mbtn:disabled{cursor:default}
.vc-mbtn svg{width:14px;height:14px}
.vc-m.talk .vc-mbtn{color:var(--green)}
.vc-none{padding:10px 8px;font-size:12.5px;color:var(--dim)}
.vc-game{margin:0 14px 14px;padding:10px 12px;border-radius:8px;background:var(--bg2);border:1px solid var(--line);font-size:12px;color:var(--muted);line-height:1.45}
.vc-game b{display:block;color:var(--text);font-size:12.5px;margin-bottom:2px}

/* ---------- Paramètres ---------- */
.st-wrap{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start}
.st-nav{display:flex;flex-direction:column;gap:2px;position:sticky;top:76px}
.st-nav button{height:40px;padding:0 12px;border:none;border-radius:8px;background:none;color:var(--muted);font:inherit;font-weight:600;font-size:14px;text-align:left;cursor:pointer}
.st-nav button:hover{background:var(--panel);color:var(--text)}
.st-nav button.on{background:linear-gradient(90deg,rgba(255,171,26,.12) 0%,rgba(255,171,26,.02) 100%);color:#fff;font-weight:700;box-shadow:inset 2px 0 0 var(--acc)}
.st-body{display:flex;flex-direction:column;gap:12px;min-width:0;max-width:760px}
.st-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px 22px;box-shadow:0 4px 16px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.05)}
.st-card h3{font-family:var(--cond);font-size:19px;font-weight:700;margin-bottom:12px}
.st-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;border-top:1px solid var(--line)}
.st-card h3+.st-row{border-top:none;padding-top:0}
.st-row>span{min-width:0}
.st-row b,.st-tog b{display:block;font-size:14px;font-weight:600}
.st-row small,.st-tog small{display:block;color:var(--dim);font-size:12.5px;margin-top:2px}
.st-who{display:flex;align-items:center;gap:12px}
.st-who .avatar{width:44px;height:44px;font-size:18px}
.st-note{display:block;font-size:12px;color:var(--dim);margin-top:6px}
.st-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.st-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.st-f label{display:flex;justify-content:space-between;font-size:13px;font-weight:600;color:var(--muted)}
.st-f label b{color:var(--text);font-weight:600}
.st-f select{height:40px;padding:0 10px;border-radius:8px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit;min-width:0}
.st-f select:disabled{opacity:.5}
.st-f input[type=range],.vc-qs input[type=range]{width:100%;accent-color:var(--acc)}
.st-meter{position:relative;height:12px;border-radius:6px;background:var(--bg2);border:1px solid var(--line2);overflow:hidden;margin-bottom:14px}
.st-meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,#2d9f6c,var(--green));transition:width .08s}
.st-meter.on i{background:linear-gradient(90deg,var(--green),#7cf0b8)}
.st-meter.off{opacity:.5}
.st-meter .thr{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--acc)}
.st-actions{display:flex;gap:14px;align-items:center;margin-top:14px;flex-wrap:wrap}
.st-tog{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-top:1px solid var(--line);cursor:pointer}
.st-card h3+.st-tog{border-top:none;padding-top:0}
.st-tog.inline{border:none;padding:0;gap:10px;font-size:13px;color:var(--muted)}
.st-tog input{display:none}
.st-tog .sw{position:relative;display:inline-block;flex:none;width:38px;height:22px;border:none;padding:0;border-radius:999px;background:var(--line2);transition:background .15s;box-sizing:border-box}
.st-tog .sw::after{content:"";position:absolute;left:3px;top:50%;transform:translateY(-50%);width:16px;height:16px;border-radius:50%;background:var(--muted);transition:transform .15s,background .15s}
.st-tog input:checked+.sw{background:var(--acc)}
.st-tog input:checked+.sw::after{transform:translate(16px,-50%);background:var(--on-acc)}
.st-key kbd{font:700 13px var(--font-main);min-width:28px;display:inline-block}
.st-key.wait{border-color:var(--acc);color:var(--acc)}
/* réglages rapides dans la carte vocal */
.vc-top{display:flex;align-items:center;justify-content:space-between;width:100%}
.vc-gear{width:32px;height:32px;border-radius:8px;border:1px solid transparent;background:none;color:var(--muted);display:grid;place-items:center;cursor:pointer}
.vc-gear:hover,.vc-gear.on{background:var(--panel2);border-color:var(--line2);color:var(--text)}
.vc-gear svg{width:16px;height:16px}
.vc-qs{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px}
.vc-qs .st-grid2{grid-template-columns:1fr}
.vc-qs-f{display:flex;justify-content:flex-end;margin-top:10px}
/* animations réduites */
html.rm *,html.rm *::before,html.rm *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
@media(max-width:860px){.st-wrap{grid-template-columns:minmax(0,1fr)}.st-nav{position:static;flex-direction:row;overflow-x:auto}.st-nav button{white-space:nowrap}.st-grid2{grid-template-columns:1fr}}

/* ===== Vigie ===== */
.vg-tag{color:var(--muted);margin-top:4px}
.vg-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0 18px}
.vg-step{display:flex;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.vg-step b{font-family:var(--cond);font-size:16px}.vg-step p{color:var(--muted);font-size:13px;line-height:1.45;margin-top:4px}
.vg-si{flex:none;width:36px;height:36px;border-radius:8px;display:grid;place-items:center;background:var(--panel2);color:var(--acc)}.vg-si svg{width:18px;height:18px}
.vg-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.vg-main,.vg-side{display:flex;flex-direction:column;gap:12px;min-width:0}
.vg-kpi{display:flex;gap:18px;flex-wrap:wrap}.vg-kpi b{display:block;font-family:var(--cond);font-size:24px;font-variant-numeric:tabular-nums}.vg-kpi small{color:var(--muted);font-size:12px}
.vg-cnt{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px 0 8px}
.vg-cnt span{background:var(--panel2);border-radius:8px;padding:8px;text-align:center;font-size:11px;color:var(--muted)}.vg-cnt b{display:block;font-size:17px;color:var(--text)}
.vg-pool{font-weight:700;font-size:13px;padding:4px 10px;border-radius:999px;background:var(--panel2);white-space:nowrap}.vg-pool.p-normal{color:var(--green)}.vg-pool.p-low{color:var(--red)}
.vg-ul{padding-left:18px;display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:13px;line-height:1.45}
.vg-ch{display:flex;gap:14px;align-items:center}.vg-ch h3{margin:0}.vg-ch small{color:var(--muted)}
.vg-map{width:84px;height:52px;border-radius:8px;background-size:cover;background-position:center;flex:none}
.vg-tl{position:relative;margin:4px 0 18px;padding-top:16px}
.vg-tlr{position:relative;height:14px;font-size:10px;color:var(--dim)}.vg-tlr span{position:absolute;top:-14px}
.vg-tlm{position:relative;height:10px;border-radius:6px;background:var(--panel2)}
.vg-tlm i{position:absolute;top:-3px;width:4px;height:16px;border-radius:2px;margin-left:-2px;background:var(--acc)}
.t-flick,.vg-tlm i.t-flick{--k:#ff5d5d}.t-react,.vg-tlm i.t-react{--k:#ff9b1f}.t-track,.vg-tlm i.t-track{--k:#b57cff}.t-wallbang,.vg-tlm i.t-wallbang{--k:#4fa3ff}.t-smoke,.vg-tlm i.t-smoke{--k:#8fa0b3}.t-hs,.vg-tlm i.t-hs{--k:#3ccf7a}
.vg-tlm i{background:var(--k)}
.vg-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.vg-cols h4{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:8px}
.vg-cmd{display:flex;gap:8px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 6px 6px 10px;margin-bottom:6px}
.vg-cmd code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px}
.vg-mos{display:flex;flex-direction:column;gap:6px}
.vg-mo{display:flex;align-items:center;gap:10px;font-size:13px;padding:6px 0;border-top:1px solid var(--line)}.vg-mo>span:nth-child(2){flex:1;min-width:0;color:var(--muted)}
.vg-mt{font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;color:var(--k);background:color-mix(in srgb,var(--k) 14%,transparent);white-space:nowrap}
.vg-fs{display:flex;flex-direction:column}
.vg-f{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l v" "b e" "s s";column-gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:13px}
.vg-fl{grid-area:l;color:var(--muted)}.vg-f b{grid-area:v;text-align:right;font-variant-numeric:tabular-nums}.vg-f small{grid-area:s;color:var(--dim);font-size:11px}
.vg-bar{grid-area:b;align-self:center;height:6px;border-radius:4px;background:var(--panel2);overflow:hidden;margin-top:4px}.vg-bar i{display:block;height:100%;background:var(--green)}
.vg-bar.mid i{background:var(--orange)}.vg-bar.hi i{background:var(--red)}
.vg-f em{grid-area:e;font-style:normal;font-size:12px;font-weight:700;text-align:right;color:var(--green)}.vg-f em.mid{color:var(--orange)}.vg-f em.hi{color:var(--red)}
.vg-q{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:18px 0 10px;padding-top:14px;border-top:1px solid var(--line)}
.vg-wait{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.vg-vote{display:flex;flex-wrap:wrap;gap:8px}
.btn.vg-bad{border-color:color-mix(in srgb,var(--red) 50%,var(--line));color:#ff8a8a}.btn.vg-bad:hover:not(:disabled){background:color-mix(in srgb,var(--red) 18%,transparent)}
.btn.vg-good{border-color:color-mix(in srgb,var(--green) 50%,var(--line));color:#7ee2a6}.btn.vg-good:hover:not(:disabled){background:color-mix(in srgb,var(--green) 18%,transparent)}
.vg-done{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.vg-v{font-weight:700}.vg-v.v-guilty{color:var(--red)}.vg-v.v-clean{color:var(--green)}.vg-v.v-insufficient{color:var(--muted)}
.vg-h{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) 20px;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:13px;align-items:center}
.st-card h3+.vg-h{border-top:none}.vg-h b.ok{color:var(--green)}.vg-h b.ko{color:var(--red)}
@media (max-width:1100px){.vg-grid{grid-template-columns:minmax(0,1fr)}.vg-steps{grid-template-columns:minmax(0,1fr)}}
@media (max-width:720px){.vg-cols{grid-template-columns:minmax(0,1fr)}.vg-cnt{grid-template-columns:repeat(2,minmax(0,1fr))}.vg-h{grid-template-columns:minmax(0,1fr) auto;}.vg-h span:nth-child(2){display:none}}


.rl-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:4px 0 12px;color:var(--muted);font-size:13px}.rl-bar .btn{margin-left:auto}
.rl-av{width:30px;height:30px;border-radius:7px;display:grid;place-items:center;background:var(--panel2);border:1px solid var(--line2);font-weight:800;font-size:13px;flex:none}
.rl-empty{padding:28px;text-align:center;color:var(--muted)}
/* ===== v5 : lisibilité, contrôles, maps en haut ===== */
:root{--dim:#868690}
.m-hint,.st-note{font-size:12.5px;color:var(--muted);line-height:1.55}
.m-hint{margin-top:8px}
.btn+.m-hint,.btn+.st-note{margin-top:10px}
.m-hint+.btn,.st-note+.btn,p+.btn{margin-top:12px}
.st-row small,.ps,.tile small{color:var(--muted)}
.st-row>span{min-width:0}
.st-row small{display:block;margin-top:3px;line-height:1.45}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}
.btn.sm{min-width:0;gap:6px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{border:1px solid var(--line2)}
.btn.ghost:hover:not(:disabled){border-color:#45454d;background:var(--panel2)}
/* curseurs */
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:22px;background:transparent;cursor:pointer;--p:50%;accent-color:auto}
input[type=range]:focus{outline:none}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:linear-gradient(90deg,var(--acc) 0 var(--p),#2c2c31 var(--p) 100%)}
input[type=range]::-moz-range-track{height:6px;border-radius:999px;background:#2c2c31}
input[type=range]::-moz-range-progress{height:6px;border-radius:999px;background:var(--acc)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-5px;border-radius:50%;background:#f4f4f5;border:3px solid var(--acc);box-shadow:0 1px 4px rgba(0,0,0,.5);transition:transform .12s}
input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#f4f4f5;border:3px solid var(--acc);box-shadow:0 1px 4px rgba(0,0,0,.5)}
input[type=range]:hover::-webkit-slider-thumb,input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}
input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px color-mix(in srgb,var(--acc) 35%,transparent)}
input[type=range]:disabled{opacity:.4;cursor:not-allowed}
/* listes déroulantes */
select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3a3ab' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 10px center!important;background-size:14px!important;padding-right:32px!important;cursor:pointer;text-overflow:ellipsis}
select:hover{border-color:#45454d}
select:focus,input:focus-visible,textarea:focus-visible{outline:none;border-color:var(--acc)!important;box-shadow:0 0 0 1px var(--acc),0 2px 8px rgba(0,0,0,.4)}
select option{background:#1c1c1f;color:#f4f4f5}
/* rotation (page Jouer) */
.pool{margin:22px 0 18px}
.rot-card{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap;padding:12px 16px;margin-top:2px;border-radius:8px;background:var(--panel);border:1px solid var(--line)}
.rot-k{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-bottom:2px}
.rot-k em{font-style:normal;color:var(--text)}
.rot-main b{display:block;font-family:var(--cond);font-size:17px;font-weight:700;line-height:1.15}
.rot-main small{display:block;color:var(--muted);font-size:12px;margin-top:2px;line-height:1.4}
.rc-list{display:flex;flex-wrap:wrap;gap:6px}
.rc{font-size:12px;font-weight:600;padding:3px 8px;border-radius:5px;background:var(--panel2);border:1px solid var(--line2)}
.rc.in{color:#56d69a}.rc.out{color:#ff7d86}
.rot-sim{opacity:.6}.rot-sim:hover{opacity:1}
.maps-more{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:40px;margin-top:10px;border-radius:8px;border:1px dashed var(--line2);background:none;color:var(--muted);font:inherit;font-weight:600;font-size:13px;cursor:pointer}
.maps-more:hover{color:var(--text);border-color:#45454d;background:var(--panel)}
.maps-more svg{width:16px;height:16px}
.mgroup+.mgroup{margin-top:14px}
@media (max-width:900px){.rot-card{grid-template-columns:minmax(0,1fr)}.rot-sim{justify-self:start}}
/* profil : carte ELO remplie + graphe interactif */
.card.chart{display:flex;flex-direction:column}
.card.chart svg{flex:none}
.card.chart .pf-kpis{margin-top:auto;padding-top:14px}
.elo-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.elo-head .h3{margin-bottom:0}
.elo-tabs{display:inline-flex;background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:2px;gap:2px}
.elo-tabs button{border:none;background:transparent;color:var(--muted);font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.016em;text-transform:uppercase;padding:4px 10px;border-radius:4px;cursor:pointer;transition:.15s}
.elo-tabs button:hover{color:var(--text)}
.elo-tabs button.on{background:var(--acc);color:var(--on-acc)}
.elo-svg-wrap{position:relative;user-select:none}
.elo-svg-wrap svg{cursor:crosshair;overflow:visible}
.elo-hover-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:26px;padding:4px 10px;margin-bottom:6px;border-radius:5px;background:var(--panel2);border:1px solid var(--line);font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.elo-hover-bar b{color:var(--text);font-family:var(--cond);font-size:15px;letter-spacing:.008em}
.elo-hover-bar .pos{color:var(--green);font-weight:700}
.elo-hover-bar .neg{color:var(--red);font-weight:700}
.form{align-items:center;margin-top:10px}
.form-l{font-size:12px;color:var(--muted);margin-right:6px}
.pf-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:14px}
.pf-kpis>div{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px 12px;min-width:0}
.pf-kpis span{display:block;font-size:11.5px;color:var(--muted)}
.pf-kpis b{display:block;font-family:var(--cond);font-size:20px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-kpis small{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-kpis b>span{display:inline;font-size:inherit}.pf-kpis .pos{color:var(--green)}.pf-kpis .neg{color:var(--red)}
@media (max-width:720px){.pf-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Vigie : onglets + présentation */
.vg-tabs{display:flex;gap:4px;margin:12px 0 4px;border-bottom:1px solid var(--line)}
.vg-tabs button{height:40px;padding:0 14px;border:none;background:none;color:var(--muted);font:inherit;font-weight:700;font-size:14px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.vg-tabs button.on{color:var(--text);border-bottom-color:var(--acc)}
.vp-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:center;margin:18px 0;padding:24px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.vp-hero h2{font-family:var(--cond);font-size:30px;line-height:1.1}
.vp-hero p{color:var(--muted);margin-top:10px;line-height:1.6;font-size:14.5px}
.vp-hero .vp-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.vp-nums{display:grid;gap:10px}
.vp-nums div{display:flex;align-items:baseline;gap:12px;padding:12px 14px;border-radius:10px;background:var(--panel2);border:1px solid var(--line)}
.vp-nums b{font-family:var(--cond);font-size:28px;color:var(--acc);min-width:44px}
.vp-nums span{color:var(--muted);font-size:13.5px;line-height:1.4}
.vp-sec{margin:26px 0 12px;font-family:var(--cond);font-size:22px}
.vp-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;counter-reset:f}
.vp-flow>div{position:relative;padding:14px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.vp-flow>div::before{counter-increment:f;content:counter(f);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--acc);color:#111;font-weight:800;font-size:13px;margin-bottom:10px}
.vp-flow>div:not(:last-child)::after{content:"";position:absolute;right:-9px;top:26px;width:8px;height:8px;border-top:2px solid var(--line2);border-right:2px solid var(--line2);transform:rotate(45deg)}
.vp-flow b{display:block;font-size:14px}.vp-flow p{color:var(--muted);font-size:12.5px;line-height:1.5;margin-top:6px}
.vp-sig{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.vp-sig>div{padding:14px 16px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.vp-sig b{display:flex;align-items:center;gap:8px;font-size:14px}
.vp-sig b i{width:8px;height:8px;border-radius:50%;background:var(--k,var(--acc))}
.vp-sig p{color:var(--muted);font-size:12.5px;line-height:1.5;margin-top:6px}
.vp-sig small{display:inline-block;margin-top:8px;font-size:11.5px;font-weight:700;color:var(--k,var(--acc))}
.vp-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.vp-ladder{display:flex;flex-direction:column;gap:8px}
.vp-ladder div{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border-radius:8px;background:var(--panel2)}
.vp-ladder em{flex:none;font-style:normal;font-weight:800;font-size:12px;padding:3px 8px;border-radius:6px;background:var(--panel);border:1px solid var(--line2)}
.vp-ladder span{color:var(--muted);font-size:13px;line-height:1.45}
.vp-ex{display:grid;gap:8px}
.vp-ex div{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:8px;background:var(--panel2);font-size:13px}
.vp-ex div span{color:var(--muted)}.vp-ex b{font-variant-numeric:tabular-nums}
.vp-faq details{border:1px solid var(--line);border-radius:10px;background:var(--panel);margin-bottom:8px}
.vp-faq summary{cursor:pointer;padding:14px 16px;font-weight:700;font-size:14px;list-style:none;display:flex;justify-content:space-between;gap:12px}
.vp-faq summary::-webkit-details-marker{display:none}
.vp-faq summary::after{content:"+";color:var(--muted);font-size:18px;line-height:1}
.vp-faq details[open] summary::after{content:"–"}
.vp-faq p{padding:0 16px 14px;color:var(--muted);font-size:13.5px;line-height:1.6}
@media (max-width:1100px){.vp-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.vp-flow>div::after{display:none}.vp-sig{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.vp-hero{grid-template-columns:minmax(0,1fr);padding:18px}.vp-hero h2{font-size:24px}.vp-flow,.vp-sig,.vp-two{grid-template-columns:minmax(0,1fr)}}
/* ===== v6 ===== */
/* veto : tuiles lisibles */
.veto-grid .vmap{height:86px}
.vmap::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(8,8,10,.72) 0%,rgba(8,8,10,.25) 42%,rgba(8,8,10,.82) 100%);pointer-events:none}
.vmap .vn{right:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.vmap .rtag{top:27px;left:9px;right:auto;border-radius:4px;padding:1px 6px;font-size:9.5px}
.vmap .vst{bottom:7px}
.vmap .vst small{font-size:9.5px;color:rgba(255,255,255,.72)}
.vmap .vst .us b,.vmap .vst .them b{font-size:17px;line-height:1.05;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.vmap .vst .us b{color:#e8e9ec}
.vmap.ban::after{content:"";position:absolute;inset:0;background:rgba(10,10,12,.55);z-index:0}
/* historique cliquable */
#profile .hist-card tbody tr[data-md]{cursor:pointer}
#profile .hist-card tbody tr[data-md]:hover td{background:var(--panel2)}
/* détail de match */
.md-modal{width:min(980px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto}
.md-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;border-radius:10px;overflow:hidden;margin-bottom:14px}
.md-bg{position:absolute;inset:0;background:var(--bg);background-size:cover;background-position:center;filter:brightness(.35)}
.md-head>div:not(.md-bg){position:relative}
.md-tag{font-size:12px;color:rgba(255,255,255,.75);letter-spacing:.04em}
.md-res{font-family:var(--cond);font-size:30px;font-weight:700;text-transform:uppercase;margin-top:4px}
.md-res.w{color:var(--green)}.md-res.l{color:var(--red)}
.md-score{font-family:var(--cond);font-size:44px;font-weight:700;display:flex;gap:10px;align-items:center;font-variant-numeric:tabular-nums}
.md-score span{color:rgba(255,255,255,.55)}.md-score span.w{color:#fff}.md-score i{font-style:normal;color:rgba(255,255,255,.35)}
.md-sec{margin-bottom:14px}
.md-st{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}.md-st small{color:var(--muted);font-size:12.5px}
.md-rounds{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.md-r{width:24px;height:24px;border-radius:5px;display:grid;place-items:center;font-size:10.5px;font-weight:800;font-variant-numeric:tabular-nums}
.md-r.w{background:color-mix(in srgb,var(--green) 22%,transparent);color:#7ee2a6}.md-r.l{background:color-mix(in srgb,var(--red) 20%,transparent);color:#ff8a8a}
.md-half{width:2px;height:24px;background:var(--line2);margin:0 6px}
.md-team{margin-bottom:12px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.md-th{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--panel2)}
.md-th b{font-family:var(--cond);font-size:15px;text-transform:uppercase;letter-spacing:.016em}.md-th span{font-family:var(--cond);font-size:22px;font-weight:700}
.md-team.us .md-th{box-shadow:inset 3px 0 0 var(--blue)}.md-team.them .md-th{box-shadow:inset 3px 0 0 var(--orange)}
.md-tbl{min-width:620px}
.md-tbl td,.md-tbl th{text-align:center}
.md-av{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff;flex:none}
.md-mvp{font-size:10px;font-weight:800;letter-spacing:.06em;color:#111;background:var(--acc);padding:2px 6px;border-radius:4px}
.md-foot{display:flex;gap:10px;margin-top:4px}
/* Bien démarrer */
#onb:empty{display:none}
.ob{margin:0 0 16px;padding:16px 18px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.ob-h{display:flex;align-items:center;gap:16px}
.ob-h>div:first-child{flex:none}
.ob-h b{display:block;font-family:var(--cond);font-size:17px}.ob-h small{color:var(--muted);font-size:12.5px}
.ob-bar{flex:1;height:6px;border-radius:999px;background:var(--panel2);overflow:hidden}.ob-bar i{display:block;height:100%;background:var(--acc);transition:width .4s}
.ob-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:14px}
.ob-i{display:flex;align-items:center;gap:10px;min-height:46px;padding:8px 12px;border-radius:8px;border:1px solid var(--line2);background:var(--panel2);color:var(--text);font:inherit;font-size:13px;font-weight:600;text-align:left;cursor:pointer}
.ob-i:hover:not(:disabled){border-color:var(--acc)}
.ob-i.ok{color:var(--muted);cursor:default;text-decoration:line-through;text-decoration-color:rgba(255,255,255,.25)}
.ob-c{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center}
.ob-i.ok .ob-c{background:var(--green);border-color:var(--green);color:#0b0b0c}.ob-c svg{width:12px;height:12px}
@media (max-width:1100px){.ob-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.ob-h{flex-wrap:wrap}.ob-bar{order:3;flex-basis:100%}.ob-list{grid-template-columns:minmax(0,1fr)}.md-score{font-size:32px}.md-head{padding:16px}}
/* ===== v7 ===== */
.pl-btn svg{width:14px;height:14px}
.pl-modal{width:min(560px,calc(100vw - 32px))}
.pl-link{display:flex;gap:8px}.pl-link input{flex:1;min-width:0;height:40px;padding:0 12px;border-radius:8px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:13px ui-monospace,Menlo,monospace}
.pl-meta{display:flex;align-items:center;gap:12px;margin-top:10px;color:var(--muted);font-size:13px}.pl-meta .btn{margin-left:auto}
.pl-code{font-family:var(--font-mono);font-weight:800;letter-spacing:.2em;color:var(--acc);font-size:15px}
.pl-j{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.pl-j b{width:100%;font-size:13px;margin-bottom:2px}
.cmp-modal{width:min(900px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto}
.cmp-head{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;margin-bottom:16px}
.cmp-p{display:flex;align-items:center;gap:10px;min-width:0}.cmp-p.b{flex-direction:row-reverse;text-align:right}
.cmp-p b{display:block;font-size:16px}.cmp-p small{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12.5px;margin-top:2px}.cmp-p.b small{justify-content:flex-end}
.cmp-vs{text-align:center;font-family:var(--cond);font-size:26px;font-weight:700;color:var(--muted)}.cmp-vs small{display:block;font-family:inherit;font-size:11.5px;font-weight:600;max-width:160px}
.cmp-rows{display:flex;flex-direction:column;gap:2px}
.cmp-r{display:grid;grid-template-columns:80px minmax(0,1fr) 80px;align-items:center;gap:12px;padding:7px 0;border-top:1px solid var(--line)}
.cmp-r>b{font-family:var(--cond);font-size:18px;font-variant-numeric:tabular-nums;color:var(--muted)}.cmp-r>b:last-child{text-align:right}.cmp-r>b.win{color:var(--text)}
.cmp-mid span{display:block;text-align:center;font-size:12px;color:var(--muted);margin-bottom:4px}
.cmp-bar{display:flex;height:6px;border-radius:999px;overflow:hidden;gap:2px}.cmp-bar .a{background:var(--acc)}.cmp-bar .b{background:#4fa3ff}
.cmp-two{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:18px;margin-top:18px}
.cmp-two h4{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:8px}
.cmp-svg{width:100%;height:auto;display:block}
.cmp-leg{display:flex;gap:14px;font-size:12px;color:var(--muted);margin-top:4px}.cmp-leg span::before{content:"";display:inline-block;width:10px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}.cmp-leg .a::before{background:var(--acc)}.cmp-leg .b::before{background:#4fa3ff}
.cmp-m{display:grid;grid-template-columns:minmax(0,1fr) 70px 70px;gap:8px;padding:7px 0;border-top:1px solid var(--line);font-size:13px}.cmp-m b{text-align:right;color:var(--muted)}.cmp-m b.win{color:var(--green)}
.cmp-m.hd{border-top:none;font-size:11.5px}.cmp-m.hd b{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#live{margin-top:22px}
.lv-h{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:10px}.lv-h b{display:flex;align-items:center;gap:8px;font-family:var(--cond);font-size:18px}.lv-h small{color:var(--muted);font-size:12.5px}
.lv-dot{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(239,85,96,.6);animation:lvp 1.6s infinite}
@keyframes lvp{70%{box-shadow:0 0 0 8px rgba(239,85,96,0)}100%{box-shadow:0 0 0 0 rgba(239,85,96,0)}}
.lv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.lv-card{position:relative;overflow:hidden;text-align:left;padding:14px 16px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text);font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:10px}
.lv-card:hover{border-color:#45454d}.lv-card:hover .lv-go{color:var(--acc)}
.lv-bg{position:absolute;inset:0;background-size:cover!important;background-position:center!important;opacity:.16;filter:grayscale(.3)}
.lv-card>div:not(.lv-bg){position:relative}
.lv-top{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted)}.lv-v{margin-left:auto}
.lv-tag{font-size:10.5px;font-weight:800;letter-spacing:.08em;color:#fff;background:var(--red);padding:2px 7px;border-radius:4px}
.lv-sc{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px}
.lv-sc b{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lv-sc small{color:var(--muted);font-size:12px}.lv-sc .r{text-align:right}
.lv-num{font-family:var(--cond);font-size:30px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}.lv-num .w{color:var(--text)}
.lv-foot{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted)}.lv-go{margin-left:auto;font-weight:700}
.lv-fr{color:var(--green);font-weight:700}
.spec-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px}
.spec-feed{max-height:330px;overflow:auto}
.kf{display:flex;align-items:center;gap:8px;padding:6px 0;border-top:1px solid var(--line);font-size:13px}.kf em{font-style:normal;color:var(--muted);font-size:12px;flex:none}.kf em b{color:var(--acc)}
.kf .ka{color:#7fb4ff;font-weight:700}.kf .kb{color:#ffb070;font-weight:700}.kf span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:900px){.lv-grid,.spec-grid,.cmp-two{grid-template-columns:minmax(0,1fr)}}
@media (max-width:720px){.cmp-head{grid-template-columns:minmax(0,1fr)}.cmp-p.b{flex-direction:row;text-align:left}.cmp-p.b small{justify-content:flex-start}.cmp-r{grid-template-columns:56px minmax(0,1fr) 56px}.pl-btn span{display:none}}
/* ===== v9 : économie ===== */
.lo-head .seg{display:none}
.rail-btn.has-new::after{content:attr(data-n);position:absolute;top:50%;right:10px;transform:translateY(-50%);min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--acc);color:#111;font-size:10px;font-weight:800;display:grid;place-items:center}
.inv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:10px}
.inv-kpi{display:flex;gap:10px}.inv-kpi>div{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 14px;min-width:140px}
.inv-kpi span{display:block;font-size:12px;color:var(--muted)}.inv-kpi b{display:block;font-family:var(--cond);font-size:20px;white-space:nowrap}.inv-kpi b .tcv{display:inline-flex;align-items:center;gap:6px}
@media (max-width:1180px){.rail-btn.has-new::after{top:4px;right:2px;transform:none}}
.inv-week{font-size:12.5px;color:var(--muted);margin-bottom:12px}.inv-week .link{color:var(--acc);background:none;border:none;font:inherit;cursor:pointer;padding:0}
.inv-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}.inv-bar .cats{margin:0}
.inv-tools,.mk-tools{display:flex;gap:8px;flex-wrap:wrap}
.inv-tools input,.mk-tools input{height:38px;padding:0 12px;border-radius:8px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit;min-width:200px}
.inv-tools select,.mk-tools select{height:38px;padding:0 10px;border-radius:8px;border:1px solid var(--line2);background-color:var(--bg2);color:var(--text);font:inherit}
.mk-tools{margin-bottom:10px}
.inv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:10px}
.it-card{position:relative;display:flex;flex-direction:column;gap:3px;padding:10px 12px 12px;border-radius:10px;border:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--rc,#666) 10%,var(--panel)),var(--panel) 60%);color:var(--text);font:inherit;text-align:left;cursor:pointer;box-shadow:inset 0 -3px 0 var(--rc,#666);transition:transform .12s,border-color .12s}
.it-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--rc,#666) 55%,var(--line))}
.it-card.is-new::before{content:"NEW";position:absolute;top:8px;left:8px;font-size:9.5px;font-weight:800;letter-spacing:.06em;background:var(--acc);color:#111;padding:1px 5px;border-radius:4px;z-index:1}
.it-card.listed{opacity:.6}
.it-im{display:grid;place-items:center;height:96px}.it-im img{max-width:100%;max-height:96px;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
.it-im.sm{height:42px;width:56px}.it-im.sm img{max-height:42px}
.it-card b{font-size:13px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.it-card small{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.it-pr{margin-top:auto;padding-top:6px;font-weight:700;font-size:13px}.it-pr.open{color:var(--acc)}.it-pr.deal .tcv{color:var(--green)}
.it-card.case{--rc:#e4ae39}
.st-b{position:absolute;top:8px;right:8px;font-size:9.5px;font-weight:800;color:#ff8f3f;background:rgba(255,143,63,.14);padding:1px 5px;border-radius:4px}
.pt-b{display:inline-block;font-size:10.5px;font-weight:800;padding:1px 6px;border-radius:4px;background:var(--panel2);color:var(--muted);vertical-align:1px}
.it-card .pt-b{position:absolute;top:30px;right:8px}
.pt-b.good{color:#7fb4ff;background:rgba(79,163,255,.14)}.pt-b.gem{color:#ffd166;background:rgba(255,209,102,.16)}
.ls-b{position:absolute;top:8px;left:8px;font-size:9.5px;font-weight:800;background:#4fa3ff;color:#06121f;padding:1px 5px;border-radius:4px}
.mk-s{color:var(--dim)!important}.mk-f{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:8px}.mk-f .it-pr{margin:0;padding:0}
.it-card.mk{cursor:default}.mk-lp{font-weight:800;color:#7fb4ff}
.inv-pend{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.pend{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:10px;border:1px dashed var(--acc);background:color-mix(in srgb,var(--acc) 6%,var(--panel))}.pend>span:nth-child(2){flex:1;min-width:0}.pend b{display:block;font-size:13.5px}.pend small{color:var(--muted);font-size:12px}
/* fiche objet */
.io-modal{width:min(640px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto}
.io-top{display:flex;gap:16px;align-items:center;padding:14px;border-radius:10px;background:radial-gradient(120% 120% at 0 0,color-mix(in srgb,var(--rc) 20%,transparent),transparent 60%),var(--panel2);box-shadow:inset 0 -3px 0 var(--rc)}
.io-im{width:200px;flex:none;display:grid;place-items:center}.io-im img{max-width:100%;max-height:140px;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.5))}
.io-meta{min-width:0}.io-r{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--rc,#aaa)}
.io-meta h3{font-size:18px;line-height:1.25;margin:4px 0}.io-w{color:var(--muted);font-size:13px}
.io-v{margin-top:10px;font-family:var(--cond);font-size:24px;font-weight:700}.io-v small{display:block;font-family:var(--font-main);font-size:11.5px;font-weight:600;color:var(--muted)}
.io-f{margin:14px 0 4px}
.ir{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-size:13px;border-top:1px solid var(--line)}.ir span{color:var(--muted)}.ir b{text-align:right}
.io-f .ir{border-top:none}.mono{font-family:var(--font-mono);font-weight:600}
.fbar{position:relative;height:10px;margin:4px 0 2px}.fb-seg{display:flex;height:6px;margin-top:2px;border-radius:999px;overflow:hidden}
.fb-fn{background:#3fcf8e}.fb-mw{background:#8fd14f}.fb-ft{background:#e4c13a}.fb-ww{background:#f08a3c}.fb-bs{background:#ef5560}
.fb-off{position:absolute;top:2px;height:6px;background:rgba(10,10,12,.72)}
.fb-mk{position:absolute;top:-3px;width:3px;height:16px;margin-left:-1.5px;border-radius:2px;background:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.5)}
.io-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:10px}.io-how{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:6px 0 2px}
.io-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.sell-box{margin-top:14px;padding:12px 14px;border-radius:10px;background:var(--panel2)}.sell-box label{font-size:12.5px;color:var(--muted)}
.sell-row{display:flex;gap:8px;margin-top:6px}.sell-row input{flex:1;height:40px;padding:0 12px;border-radius:8px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit;font-size:15px;font-weight:700}
/* caisse */
.cs-modal{width:min(920px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow:auto}
.cs-stage{
  position:relative;
  min-height:210px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:radial-gradient(ellipse 70% 85% at 50% 35%,#1d2028 0%,#0b0c10 85%);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 2px 14px rgba(0,0,0,.85),0 14px 40px rgba(0,0,0,.55);
  overflow:hidden;
  margin-bottom:6px;
  transition:min-height .35s cubic-bezier(.2,1,.3,1),background .4s ease;
}
.cs-stage.revealed{
  min-height:440px;
  background:radial-gradient(ellipse 75% 70% at 50% 55%,color-mix(in srgb,var(--rc,#f59e0b) 20%,transparent) 0%,#0b0c10 85%);
}
.cs-crate{display:flex;flex-direction:column;align-items:center;gap:4px;padding:18px 16px;text-align:center}
.cs-crate .it-im{width:220px;height:130px;filter:drop-shadow(0 14px 18px rgba(0,0,0,.6));animation:crateIn .5s ease}.cs-crate .it-im img{max-height:130px}
.cs-crate h3{font-size:18px;margin:6px 0 0;font-weight:700}.cs-crate small{color:var(--muted);font-size:12px;max-width:440px}
.cs-crate.opening{animation:crateUnlock .45s cubic-bezier(.36,.07,.19,.97)}
@keyframes crateUnlock{
  0%,100%{transform:none}
  25%{transform:translate(-3px,1px) rotate(-1deg)}
  50%{transform:translate(3px,-2px) rotate(1deg) scale(1.02)}
  75%{transform:translate(-2px,2px)}
}
@keyframes crateIn{from{opacity:0;transform:translateY(10px) scale(.94)}to{opacity:1;transform:none}}
.cs-unlock{min-width:240px;letter-spacing:.02em}
.cs-unlock.loading{opacity:.85;cursor:wait}

/* bande de roulement */
.cs-reel{
  position:relative;
  width:100%;
  height:200px;
  overflow:hidden;
  background:linear-gradient(180deg,#0a0b0e 0%,#141720 50%,#0a0b0e 100%);
  box-shadow:inset 0 0 24px rgba(0,0,0,.9);
}
.cs-reel::before,.cs-reel::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:140px;
  z-index:2;
  pointer-events:none;
}
.cs-reel::before{left:0;background:linear-gradient(90deg,#0a0b0e 15%,transparent 100%)}
.cs-reel::after{right:0;background:linear-gradient(270deg,#0a0b0e 15%,transparent 100%)}
.cs-strip{
  display:flex;
  gap:6px;
  padding:16px 0;
  will-change:transform;
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
}
.cs-rt{
  flex:none;
  width:164px;
  display:flex;
  flex-direction:column;
  background:#161920;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 4px 12px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
  contain:layout paint;
  transform:translateZ(0);
}
.cs-rt-im{
  height:114px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
  background:radial-gradient(circle at 50% 60%,color-mix(in srgb,var(--rc) 35%,transparent) 0%,#181b22 75%);
  border-bottom:3px solid var(--rc);
  position:relative;
}
.cs-rt-im img{
  max-width:100%;
  max-height:92px;
  object-fit:contain;
}
.cs-rt-n{
  padding:7px 9px 8px;
  background:#0f1116;
  display:flex;
  flex-direction:column;
  min-width:0;
}
.cs-rt-n small{
  font-size:11px;
  color:#8c93a0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-weight:500;
}
.cs-rt-n b{
  font-size:12.5px;
  font-weight:700;
  color:#e4e7ee;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cs-rt.rare .cs-rt-im{
  background:radial-gradient(circle at 50% 50%,rgba(228,174,57,.45) 0%,#1f1c14 80%);
}
.cs-rt.rare .cs-rt-n b{color:#f59e0b}
.rare-q{font-size:52px;line-height:1;color:#f59e0b;text-shadow:0 2px 12px rgba(245,158,11,.6)}

/* aiguille centrale selector */
.cs-mark{
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  width:24px;
  margin-left:-12px;
  z-index:4;
  pointer-events:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:space-between;
}
.cs-mark-line{
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  width:2px;
  margin-left:-1px;
  background:linear-gradient(180deg,#ffb82e,#ffd76a 50%,#ffb82e);
  box-shadow:0 0 8px rgba(255,184,46,.7),0 0 2px #fff;
  opacity:.92;
}
.cs-mark-t,.cs-mark-b{
  position:relative;
  z-index:2;
  width:0;
  height:0;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.8));
  transition:transform .06s cubic-bezier(.2,1.8,.4,1);
}
.cs-mark-t{
  border-top:11px solid #ffb82e;
  margin-top:2px;
}
.cs-mark-b{
  border-bottom:11px solid #ffb82e;
  margin-bottom:2px;
}
.cs-mark.tick .cs-mark-t{transform:scale(1.22) translateY(2px)}
.cs-mark.tick .cs-mark-b{transform:scale(1.22) translateY(-2px)}

.cs-reel.done .cs-rt:not(.win){opacity:.22;transition:opacity .5s ease}
.cs-reel.done .cs-rt.win{
  transform:scale(1.08);
  box-shadow:0 0 0 2px var(--rc),0 12px 32px rgba(0,0,0,.8),0 0 24px color-mix(in srgb,var(--rc) 60%,transparent);
  position:relative;
  z-index:2;
  transition:transform .4s cubic-bezier(.2,1.6,.4,1),box-shadow .4s ease;
}
.cs-reel.done .cs-mark{opacity:0;transition:opacity .35s}
.cs-reel.hype{animation:csHypeBg 1.35s ease-in}
.cs-reel.hype .cs-rt.win{animation:csHypePulse .5s ease-in-out infinite alternate}
@keyframes csHypePulse{
  from{transform:scale(1.08);box-shadow:0 0 0 2px var(--rc),0 12px 32px rgba(0,0,0,.8),0 0 20px color-mix(in srgb,var(--rc) 50%,transparent)}
  to{transform:scale(1.13);box-shadow:0 0 0 3px var(--rc),0 16px 40px rgba(0,0,0,.9),0 0 36px color-mix(in srgb,var(--rc) 80%,transparent)}
}
@keyframes csHypeBg{to{box-shadow:inset 0 0 90px rgba(255,255,255,.08)}}

/* « Vous avez reçu » - reveal immersif */
.cs-reveal{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:22px 20px 24px;
  text-align:center;
  animation:revIn .45s cubic-bezier(.16,1,.3,1);
  position:relative;
  overflow:hidden;
}
@keyframes revIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:none}}
.cs-rv-h{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:#9aa0a8;font-weight:700}
.cs-rv-im{
  position:relative;
  width:360px;
  max-width:100%;
  height:190px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:4px 0 6px;
}
.cs-rv-im img{
  position:relative;
  z-index:2;
  max-width:100%;
  max-height:185px;
  object-fit:contain;
  filter:drop-shadow(0 14px 24px rgba(0,0,0,.75));
  animation:revBig .8s cubic-bezier(.2,1.4,.35,1),csFloat 3.6s ease-in-out .8s infinite;
}
@keyframes revBig{0%{transform:scale(.25) rotate(-14deg);opacity:0}65%{transform:scale(1.12) rotate(2deg);opacity:1}100%{transform:none}}
@keyframes csFloat{0%,100%{transform:none}50%{transform:translateY(-8px) rotate(-1deg)}}

.cs-st-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:3px 9px;
  background:#120c08;
  border:1px solid rgba(207,106,50,.55);
  border-radius:4px;
  box-shadow:0 0 12px rgba(207,106,50,.25),inset 0 1px 0 rgba(255,255,255,.1);
  margin-bottom:2px;
  animation:csUp .4s ease both;
}
.cs-st-lbl{
  font-family:var(--cond);
  font-size:12px;
  font-weight:700;
  color:#cf6a32;
  letter-spacing:.032em;
  text-transform:uppercase;
}
.cs-st-digits{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:13px;
  font-weight:800;
  color:#ff8838;
  letter-spacing:.12em;
  text-shadow:0 0 6px rgba(255,136,56,.6);
}
.cs-rv-name{
  font-family:var(--cond);
  font-size:26px;
  font-weight:700;
  letter-spacing:.012em;
  color:#f3f5f8;
  text-transform:uppercase;
  line-height:1.15;
}
.cs-rv-name b{color:#fff}
.cs-rv-name .cs-ph{font-size:14px;color:var(--muted);vertical-align:middle}
.cs-sep{color:#6c7178;font-weight:400}
.cs-star{color:#f59e0b}
.cs-rv-r{
  margin:4px 0 8px;
}
.cs-rv-r span{
  display:inline-block;
  padding:4px 14px;
  border-radius:20px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.3);
}

.cs-rv-float-card{
  width:min(440px,100%);
  padding:10px 14px;
  background:rgba(16,19,25,.75);
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  backdrop-filter:blur(8px);
  box-shadow:0 4px 14px rgba(0,0,0,.4);
  margin:4px 0 10px;
  display:flex;
  flex-direction:column;
  gap:6px;
  animation:csUp .4s ease .2s both;
}
.cs-rv-fmeta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:12px;
  color:#b2b8c4;
}
.cs-wear-name{font-weight:700;color:#fff}
.cs-float-val{color:var(--muted);font-family:ui-monospace,monospace;font-size:11.5px}
.cs-seed-val{color:#8c94a4;font-size:11.5px}

.cs-rv-val{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 14px;
  background:rgba(255,171,26,.08);
  border:1px solid rgba(255,171,26,.3);
  border-radius:20px;
  margin-top:2px;
  animation:csUp .4s ease .3s both;
}
.cs-rv-val .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.cs-rv-val .val{font-size:15px;color:var(--acc)}

.cs-rv-glow{
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--rc) 30%,transparent) 0%,transparent 70%);
  pointer-events:none;
  z-index:1;
}
.cs-rays{
  position:absolute;
  left:50%;
  top:50%;
  width:440px;
  height:440px;
  margin:-220px 0 0 -220px;
  border-radius:50%;
  background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--rc) 38%,transparent) 0deg 7deg,transparent 7deg 22deg);
  -webkit-mask:radial-gradient(circle,#000 20%,transparent 66%);
  mask:radial-gradient(circle,#000 20%,transparent 66%);
  animation:rays 14s linear infinite;
  opacity:.85;
}
@keyframes rays{to{transform:rotate(360deg)}}
.cs-reveal>*{position:relative;z-index:2}
.cs-reveal>.cs-flash,.cs-reveal>.cs-ring,.cs-reveal>.cs-fx{position:absolute;pointer-events:none}
.cs-fx{inset:0;width:100%;height:100%;z-index:3!important}
.cs-flash{inset:0;z-index:4!important;background:radial-gradient(circle at 50% 45%,#fff 0,color-mix(in srgb,var(--rc) 80%,#fff) 25%,transparent 70%);opacity:0;animation:csFlash .55s ease-out}
.cs-reveal.t0 .cs-flash,.cs-reveal.t1 .cs-flash{animation-name:csFlashS}
@keyframes csFlash{0%{opacity:.95}100%{opacity:0}}
@keyframes csFlashS{0%{opacity:.35}100%{opacity:0}}
.cs-ring{left:50%;top:45%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;border:2px solid var(--rc);box-shadow:0 0 12px color-mix(in srgb,var(--rc) 50%,transparent),inset 0 0 12px color-mix(in srgb,var(--rc) 50%,transparent);opacity:0;animation:csRing .9s cubic-bezier(.1,.7,.3,1)}
.cs-ring.r2{animation-delay:.18s;border-width:2px}
@keyframes csRing{0%{opacity:1;transform:scale(.2)}100%{opacity:0;transform:scale(5.5)}}
.cs-reveal .cs-rv-name,.cs-reveal .cs-rv-r,.cs-reveal .cs-rv-float-card,.cs-reveal .cs-rv-val{animation:csUp .5s ease both}
@keyframes csUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* rouge et ★ : effets intenses */
.cs-reveal.t3 .cs-rays,.cs-reveal.t4 .cs-rays{width:560px;height:560px;margin:-280px 0 0 -280px;animation:rays 9s linear infinite,raysIn .8s ease-out;opacity:1}
.cs-reveal.t4 .cs-rays{background:repeating-conic-gradient(from 0deg,rgba(255,215,106,.55) 0deg 6deg,transparent 6deg 15deg)}
@keyframes raysIn{from{transform:scale(.2) rotate(-40deg);opacity:0}}
.cs-reveal.t4 .cs-rv-name{
  background:linear-gradient(100deg,#f59e0b 20%,#fff6d5 40%,#f59e0b 60%) 0 0/250% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:csUp .5s ease .15s both,csShine 2.2s linear .7s infinite;
}
@keyframes csShine{to{background-position:-250% 0}}
.cs-modal.shake{animation:csShake .45s cubic-bezier(.36,.07,.19,.97)}
.cs-modal.shake2{animation:csShake .7s cubic-bezier(.36,.07,.19,.97)}
@keyframes csShake{10%,90%{transform:translate(-2px,1px)}20%,80%{transform:translate(4px,-2px)}30%,50%,70%{transform:translate(-7px,3px)}40%,60%{transform:translate(7px,-3px)}}
@media (prefers-reduced-motion:reduce){.cs-modal.shake,.cs-modal.shake2,.cs-reel.hype .cs-rt.win,.cs-rays{animation:none!important}}
.btn.big{height:48px;padding:0 40px;font-size:16px}
.cs-act{display:flex;flex-direction:column;align-items:center;gap:12px;margin:14px 0}
.cs-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.cs-cont{margin-top:8px}.cs-ct{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}.cs-ct small{font-size:12px;color:var(--muted)}
.cs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px}.cs-grid .cs-rt{width:auto}.cs-grid .cs-rt-im{height:84px}.cs-grid .cs-rt-im img{max-height:70px}.cs-grid .rare-q{font-size:40px}
/* usure au choix */
.wc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.wc{display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:10px;border:1px solid var(--line2);background:var(--panel2);color:var(--text);font:inherit;text-align:left;cursor:pointer}.wc:hover{border-color:var(--acc)}
.wc small{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}.wc span{font-size:12.5px;margin-top:4px}
/* drops (résultat) */
.dr-row{display:flex;gap:10px;flex-wrap:wrap}
.dr-c{width:190px;display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:10px;background:radial-gradient(120% 120% at 50% 0,color-mix(in srgb,var(--rc) 22%,transparent),transparent 60%),var(--panel2);box-shadow:inset 0 -3px 0 var(--rc)}
.dr-c small{font-size:11.5px;color:var(--muted)}.dr-c b{font-size:13px;line-height:1.25}.dr-c .btn{margin-top:6px}
.dr-c.flip{opacity:0;animation:drIn .6s cubic-bezier(.2,.9,.3,1.3) forwards}
@keyframes drIn{0%{opacity:0;transform:perspective(600px) rotateY(90deg) scale(.9)}100%{opacity:1;transform:none}}
@media (max-width:720px){.io-top{flex-direction:column;text-align:center}.io-im{width:100%}.io-grid{grid-template-columns:1fr}.inv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.inv-tools input,.mk-tools input{min-width:0;flex:1}.cs-rt{width:132px}.cs-rt-im{height:92px}.dr-c{width:calc(50% - 5px)}}
/* ===== v10 : comment jouer ===== */
.hw-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px;align-items:start;margin-top:16px}
.hw-steps{display:flex;flex-direction:column;gap:10px}
.hw-step{display:flex;gap:16px;padding:18px 20px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.hw-n{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--acc);color:#111;font-family:var(--cond);font-size:20px;font-weight:700}
.hw-step b{display:block;font-family:var(--cond);font-size:19px}.hw-step p{color:var(--muted);font-size:14px;line-height:1.55;margin:6px 0 12px}
.cc-row{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.cc-i{flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center;font-weight:800;font-size:13px;margin-top:1px}
.cc-i svg{width:13px;height:13px}.cc-row.ok .cc-i{background:var(--green);border-color:var(--green);color:#0b0b0c}.cc-row.ko .cc-i{background:var(--red);border-color:var(--red);color:#fff}
.cc-row b{display:block;font-size:14px}.cc-row small{display:block;color:var(--muted);font-size:12.5px;line-height:1.5;margin-top:4px}
.cc-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.cc-wait{display:flex!important;align-items:center;gap:8px}
.cc-help{margin-top:8px;border-top:1px solid var(--line);padding-top:10px}.cc-help summary{cursor:pointer;font-weight:700;font-size:13.5px}
.cc-help ul{margin:8px 0 0 18px;color:var(--muted);font-size:13px;line-height:1.55;display:flex;flex-direction:column;gap:4px}
@media (max-width:900px){.hw-grid{grid-template-columns:minmax(0,1fr)}}
/* ===== Danger Zone (Futur mode CS:GO sur nos serveurs) ===== */
.mode.dz-mode{position:relative}
.mode.dz-mode .tag{display:inline-flex;align-items:center;gap:6px;color:#ff8a3d}
.mode.dz-mode .dz-pill{font-family:var(--cond);font-size:10px;font-weight:700;letter-spacing:.032em;padding:1px 6px;border-radius:3px;background:rgba(255,138,61,.16);border:1px solid rgba(255,138,61,.38);color:#ff9d5c;text-transform:uppercase}
.dz-wrap{display:flex;flex-direction:column;gap:14px;animation:fade .22s ease}
.dz-hero{position:relative;border-radius:8px;overflow:hidden;border:1px solid var(--line2);background:var(--panel);padding:22px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.dz-hero-l{max-width:680px}
.dz-kicker{display:inline-flex;align-items:center;gap:8px;font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;color:#ff9d5c;background:rgba(255,138,61,.1);border:1px solid rgba(255,138,61,.25);padding:3px 9px;border-radius:4px;margin-bottom:10px}
.dz-kicker i{width:6px;height:6px;border-radius:50%;background:#ff8a3d}
.dz-hero h2{font-family:var(--cond);font-size:30px;font-weight:700;letter-spacing:.008em;text-transform:uppercase;margin:0 0 6px;color:var(--text)}
.dz-hero p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.dz-hero-r{display:flex;flex-direction:column;align-items:flex-end;gap:8px;min-width:230px}
.dz-specs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.dz-spec{background:rgba(0,0,0,.35);border:1px solid var(--line2);border-radius:5px;padding:7px 12px;font-size:12px;color:var(--muted)}
.dz-spec b{display:block;font-family:var(--cond);font-size:16px;color:var(--text);letter-spacing:.012em}
.dz-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:960px){.dz-grid{grid-template-columns:repeat(2,1fr)}.dz-hero-r{align-items:flex-start}}
@media(max-width:560px){.dz-grid{grid-template-columns:1fr}}
.dz-rule{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.dz-rule .rk-tag{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.032em;text-transform:uppercase;color:#ff9d5c}
.dz-rule b{font-family:var(--cond);font-size:17px;font-weight:700;text-transform:uppercase;letter-spacing:.008em}
.dz-rule p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5}
.dz-maps{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
@media(max-width:960px){.dz-maps{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.dz-maps{grid-template-columns:repeat(2,1fr)}}
.dz-map{position:relative;height:96px;border-radius:6px;overflow:hidden;border:1px solid var(--line2);padding:10px 12px;display:flex;flex-direction:column;justify-content:space-between}
.dz-map .m-code{font-family:var(--font-mono);font-size:10.5px;color:rgba(255,255,255,.72);background:rgba(0,0,0,.45);padding:2px 6px;border-radius:3px;align-self:flex-start}
.dz-map b{font-family:var(--cond);font-size:18px;font-weight:700;letter-spacing:.012em;text-transform:uppercase;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.dz-map small{display:block;font-size:11px;color:rgba(255,255,255,.78)}

/* =====================================================
   TICKRATE — Feuille de style principale & Système de Thèmes CSS
   ===================================================== */
:root {
  --acc-rgb: 255, 178, 31;
}
html[data-theme="amber"] {
  --acc: #ffb21f; --acc-h: #ffc44d; --acc-rgb: 255, 178, 31; --on-acc: #1b1203;
}
html[data-theme="crimson"] {
  --acc: #ff4d5e; --acc-h: #ff707e; --acc-rgb: 255, 77, 94; --on-acc: #ffffff;
}
html[data-theme="cyber"] {
  --acc: #3b9eff; --acc-h: #66b3ff; --acc-rgb: 59, 158, 255; --on-acc: #041324;
}
html[data-theme="emerald"] {
  --acc: #3fcf8e; --acc-h: #62dca4; --acc-rgb: 63, 207, 142; --on-acc: #041a10;
}
html[data-theme="violet"] {
  --acc: #9d6cff; --acc-h: #b58eff; --acc-rgb: 157, 108, 255; --on-acc: #ffffff;
}

html[data-surface="oled"] {
  --bg: #000000; --bg2: #040406; --panel: #08090c; --panel2: #0e1015; --panel3: #151820;
  --line: #16181f; --line2: #222530;
}
html[data-surface="slate"] {
  --bg: #070a10; --bg2: #0b0f18; --panel: #101622; --panel2: #161e2e; --panel3: #1d273b;
  --line: #1e2738; --line2: #2a364d;
}

/* Sélecteur de thème & Panneau CSS dans Paramètres */
.theme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); gap: 10px; margin-top: 10px; }
.theme-swatch { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 6px; border: 1px solid var(--line2); background: var(--panel2); cursor: pointer; transition: border-color .15s, transform .12s, background .15s; text-align: left; }
.theme-swatch:hover { border-color: var(--muted); transform: translateY(-1px); }
.theme-swatch.on { border-color: var(--acc); background: rgba(var(--acc-rgb), .1); box-shadow: 0 0 0 1px var(--acc) inset; }
.theme-dot { width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0; box-shadow: 0 2px 8px rgba(0,0,0,.45); border: 2px solid rgba(255,255,255,.2); }
.theme-swatch b { display: block; font-size: 13px; color: var(--text); }
.theme-swatch small { display: block; font-size: 11px; color: var(--muted); }
.css-editor { width: 100%; min-height: 120px; background: var(--bg); color: var(--text); border: 1px solid var(--line2); border-radius: 6px; padding: 10px 12px; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.5; resize: vertical; margin-top: 8px; }
.css-editor:focus { outline: none; border-color: var(--acc); }
.theme-pop-wrap { position: relative; }
.theme-pop { position: absolute; top: calc(100% + 8px); right: 0; width: 250px; background: #0d1017; background: rgba(13,16,23,0.98); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid #232a38; border-radius: 8px; padding: 12px; box-shadow: 0 18px 48px rgba(0,0,0,.8); z-index: 120; display: none; }
.theme-pop.open { display: block; }
.theme-pop-h { font-family: var(--cond); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing:.032em; color: var(--muted); margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; }
.theme-pop-dots { display: flex; gap: 8px; margin-bottom: 10px; }
.theme-pop-dot { width: 30px; height: 30px; border-radius: 6px; border: 2px solid transparent; cursor: pointer; display: grid; place-items: center; transition: transform .12s, border-color .12s; }
.theme-pop-dot:hover { transform: scale(1.08); }
.theme-pop-dot.on { border-color: #fff; box-shadow: 0 0 0 2px var(--panel), 0 2px 6px rgba(0,0,0,.5); }


/* ===== Programme Influenceur ===== */
.pb.inf{display:inline-flex;align-items:center;gap:4px;padding:2px 7px 2px 5px;letter-spacing:.04em;text-transform:uppercase;font-weight:700;color:#f4727a;
  background:rgba(239,85,96,.12);box-shadow:inset 0 0 0 1px rgba(239,85,96,.5)}
.pb.inf svg{width:12px;height:12px;flex:none}
#influencer{max-width:1080px}
.inf-tabs{display:flex;width:max-content;margin:0 auto 18px}
.inf-tabs button{height:32px;padding:0 16px;border:none;border-radius:5px;background:none;color:var(--muted);font:inherit;font-weight:600;cursor:pointer}
.inf-tabs button.on{background:var(--panel3);color:var(--text)}
.inf-n{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:4px;border-radius:9px;background:var(--acc);color:var(--on-acc);font-size:11px;font-weight:700}
.inf-load{display:grid;place-items:center;padding:40px}
.inf-cols{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:14px;align-items:start}
.inf-perks,.inf-rules{list-style:none;display:grid;gap:10px;font-size:13.5px;line-height:1.45}
.inf-perks li{padding-left:14px;position:relative}
.inf-perks li::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--acc)}
.inf-rules li{display:flex;gap:10px;align-items:flex-start;color:var(--muted)}
.inf-rules i{flex:none;width:14px;height:14px;margin-top:2px;border-radius:50%;border:2px solid var(--line2)}
.inf-rules li.ok{color:var(--text)}.inf-rules li.ok i{border-color:var(--green);background:var(--green)}
.inf-rules li.ko i{border-color:var(--red)}
.inf-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.inf-grid .fld{margin-top:12px}.inf-wide{grid-column:1/-1}
.inf-form select,.inf-form input[type=text],.inf-form input[type=number],.inf-form textarea{width:100%;height:38px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background-color:var(--bg2);color:var(--text);font:inherit}
.inf-form textarea{height:auto;padding:8px 10px;resize:vertical}
.inf-code{display:flex;gap:16px;align-items:center;justify-content:space-between;margin:16px 0 12px;padding:14px;border-radius:6px;border:1px dashed var(--line2);background:var(--bg2)}
.inf-code p{color:var(--muted);font-size:12.5px;line-height:1.45;margin-top:4px}
.inf-code-box{display:flex;gap:8px;align-items:center;flex:none}
.inf-code-box code,.inf-st code,.inf-rv code{font-family:var(--font-mono);font-size:13px;padding:3px 7px;border-radius:4px;background:var(--panel3);color:var(--text)}
.inf-ck{display:flex;gap:8px;align-items:center;margin-top:8px;font-size:13.5px;cursor:pointer}
.inf-ck input{accent-color:var(--acc);width:15px;height:15px}
.inf-err{margin-top:12px;padding:9px 12px;border-radius:5px;background:rgba(255,77,94,.1);color:var(--red);font-size:13px}
#infSend{width:100%;margin-top:14px}
.inf-hint{color:var(--muted);font-size:13.5px}
.inf-st{margin-bottom:14px;border-left:3px solid var(--line2)}
.inf-st b{display:flex;gap:8px;align-items:center;font-size:15px}
.inf-st p{color:var(--muted);font-size:13px;margin-top:6px;line-height:1.45}
.inf-st.wait{border-left-color:var(--acc)}.inf-st.ok{border-left-color:var(--green)}.inf-st.ko{border-left-color:var(--red)}
.inf-rv{margin-top:10px}
.inf-rv-h{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}
.inf-rv-h small{color:var(--dim);font-size:12px}
.inf-rv-d{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px;font-size:13px;color:var(--muted)}
.inf-rv-d a{color:var(--acc)}.inf-rv-d b{color:var(--text)}
.inf-rv-m{margin-top:10px;font-size:13px;color:var(--muted);line-height:1.45;white-space:pre-wrap}
.inf-rv-a{display:flex;gap:8px;margin-top:12px}
.inf-rv-a input{flex:1;min-width:0;height:32px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit;font-size:13px}
.inf-cta{display:flex;gap:16px;align-items:center;justify-content:space-between;margin-top:18px}
.inf-cta b{display:flex;gap:8px;align-items:center;font-size:15px}
.inf-cta p{color:var(--muted);font-size:13px;margin-top:4px;line-height:1.45;max-width:640px}
@media (max-width:800px){
  .inf-cols,.inf-grid{grid-template-columns:1fr}
  .inf-code,.inf-cta{flex-direction:column;align-items:stretch}
  .inf-rv-a{flex-wrap:wrap}
}

.lv-empty{padding:22px;text-align:center;color:var(--muted);font-size:13.5px}

/* ===== Rangs façon CS:GO (ranks.js) ===== */
.emb2{position:relative;width:118px;height:118px;flex:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.6))}
.emb2 svg,.rk-emb svg{width:100%;height:100%;display:block}
.emb2.sm{width:46px;height:46px;filter:none}
.lg-step .emb2.sm{transition:transform .15s}
.lg-step:hover .emb2.sm{transform:translateY(-2px)}
.lg-step:not(.me) .emb2.sm{opacity:.75}
.lg-name{letter-spacing:.01em}
.rk-lvl{width:28px;height:28px}
.rk-lvl.lvl-lg{width:56px;height:56px}
.rk-emb{display:inline-block;width:28px;height:28px;vertical-align:middle}
.lvup .old svg,.lvup .new svg{width:128px;height:128px}
.lvup .new svg{filter:drop-shadow(0 4px 12px rgba(0,0,0,.6))}
@media(max-width:720px){.emb2{width:88px;height:88px}}


/* ===== Rangs CS:GO : vraies images (format 5:2) ===== */
img.rk-img{width:100%;height:100%;object-fit:contain;display:block;image-rendering:auto;-webkit-user-drag:none}
.lvl.rk-lvl{width:60px;height:24px}
.lvl.rk-lvl.lvl-lg,.p-lvl .lvl.rk-lvl{width:120px;height:48px}
.tbl .pl .lvl.rk-lvl{width:50px;height:20px}
.pcard .big .lvl.rk-lvl{width:50px;height:20px;right:-22px;bottom:-8px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.rk-emb{width:60px;height:24px}
.emb2{width:190px;height:76px}
.emb2.sm{width:80px;height:32px}
.lvup .old img,.lvup .new img{width:280px;height:112px}

/* ===== Badge Pro League ===== */
.pro-svg{width:100%;height:100%;display:block;overflow:visible}
.pro-sweep{animation:proSweep 3.6s ease-in-out infinite}
@keyframes proSweep{0%,55%{transform:skewX(-20deg) translateX(0)}100%{transform:skewX(-20deg) translateX(300px)}}
.emb2.pro{filter:drop-shadow(0 4px 12px rgba(0,0,0,.6))}
.lg-step .emb2.sm .pro-svg,.pro-band .emb2.sm .pro-svg{filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
.pb.pro{display:inline-flex;align-items:center;gap:4px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,246,207,.55),0 1px 3px rgba(0,0,0,.4)}
.pb.pro svg{width:12px;height:8px;flex:none}
.pb.pro::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.6) 50%,transparent 65%);transform:translateX(-120%);animation:proChip 3.6s ease-in-out infinite}
@keyframes proChip{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.pro-plaque .pro-mini{display:block;width:85px;height:34px;flex:none}
@media (prefers-reduced-motion:reduce){.pro-sweep,.pb.pro::after{animation:none}}

/* ===== Ligues : sélection d'une division ===== */
button.lg-step{font:inherit;color:inherit;cursor:pointer;transition:border-color .15s,background .15s}
button.lg-step:hover{border-color:color-mix(in srgb,var(--lc) 60%,var(--line))}
button.lg-step.sel{background:color-mix(in srgb,var(--lc) 9%,var(--panel));border-color:var(--lc)}
button.lg-step.sel .emb2.sm{opacity:1}
.lg-divcard .h3{gap:10px}
.lg-subs{display:flex;gap:6px;overflow-x:auto;padding:12px 16px 4px;scrollbar-width:thin}
.lg-subs button{flex:none;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:96px;padding:8px 10px;border-radius:6px;border:1px solid var(--line);background:var(--panel2);color:var(--muted);font:inherit;cursor:pointer}
.lg-subs button:hover{border-color:var(--line2);color:var(--text)}
.lg-subs button.on{border-color:var(--acc);color:var(--text);background:rgba(var(--acc-rgb),.08)}
.lg-subs button.me{box-shadow:inset 0 -2px 0 var(--acc)}
.lg-subs-im{display:block;width:60px;height:24px}
.lg-subs-im svg,.lg-subs-im img{width:100%;height:100%;display:block;object-fit:contain}
.lg-subs b{font-size:11.5px;font-weight:600;white-space:nowrap}
.lg-subs small{font-size:11px;color:var(--dim)}

.lg-empty{padding:26px 16px!important;text-align:center!important;color:var(--muted)}

/* Programme Influenceur : statut donné par un dev */
.inf-grant .h3{margin-bottom:12px}
.inf-grant-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1.6fr) auto;gap:8px}
.inf-grant-row input,.inf-grant-row select{width:100%;height:38px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background-color:var(--bg2);color:var(--text);font:inherit;font-size:13px}
@media(max-width:800px){.inf-grant-row{grid-template-columns:1fr}}

/* ===== Modération (dev) sur les profils ===== */
.adm{margin-top:12px;padding:12px 14px;border-color:rgba(255,77,94,.35);background:linear-gradient(180deg,rgba(255,77,94,.05),transparent)}
.adm-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.adm-h b{font-family:var(--cond);font-size:14px;text-transform:uppercase;letter-spacing:.024em;color:var(--red)}
.adm-h small{font-size:11px;color:var(--dim)}
.adm-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.adm-l{font-size:12px;color:var(--muted);min-width:44px}
.adm-tog{height:30px;padding:0 12px;border-radius:15px;border:1px solid var(--line2);background:var(--panel2);color:var(--muted);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.adm-tog.on{border-color:var(--acc);color:var(--acc);background:rgba(var(--acc-rgb),.1)}
.adm-row select,.adm-row input{height:32px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background-color:var(--bg2);color:var(--text);font:inherit;font-size:13px}
.adm-row input{flex:1;min-width:140px}
.adm-danger{border-color:rgba(255,77,94,.6);color:var(--red)}
.adm-ban{font-size:13px;color:var(--red);flex:1}

/* profil banni (visible par tous) */
.p-banned{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 10px;padding:9px 12px;border-radius:6px;border:1px solid rgba(255,77,94,.55);background:rgba(255,77,94,.09);font-size:13px;color:var(--text)}
.p-banned b{font-family:var(--cond);font-size:12px;letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:3px;background:var(--red);color:#fff}
.adm-devtag{height:30px;display:inline-flex;align-items:center;padding:0 12px;border-radius:15px;font-size:12.5px;font-weight:600;color:var(--muted);border:1px dashed var(--line2)}

/* ===== Inventaire façon ancien CS:GO (.csi) ===== */
.csi{position:relative;--cs-bg:#1b1e24;--cs-pan:#23272f;--cs-tile:#2c313a;--cs-line:#3a404b;--cs-txt:#d7dbe2;--cs-dim:#8a919e;
  background:linear-gradient(180deg,#1f232a,#16181d);border:1px solid #2e333c;border-radius:4px;padding:0 0 10px;color:var(--cs-txt)}
.csi-top{display:flex;justify-content:space-between;align-items:stretch;border-bottom:1px solid var(--cs-line);background:linear-gradient(180deg,#2a2f38,#20242b)}
.csi-main{display:flex}
.csi-main button{position:relative;display:flex;align-items:center;gap:8px;padding:14px 22px;border:none;background:none;color:var(--cs-dim);font-family:var(--cond);font-size:17px;font-weight:700;letter-spacing:.032em;text-transform:uppercase;cursor:pointer}
.csi-main button:hover{color:#fff}
.csi-main button.on{color:#fff}
.csi-main button.on::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background:#fff}
.csi-cnt{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:0;padding:1px 6px;border-radius:2px;background:#3a404b;color:#cfd4dc}
.csi-kpi{display:flex;align-items:center;gap:10px;padding:0 18px;font-size:12px;color:var(--cs-dim);text-transform:uppercase;letter-spacing:.06em}
.csi-kpi b{font-size:15px;color:#fff;letter-spacing:0}
.csi-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;background:var(--cs-pan);border-bottom:1px solid #2e333c}
.csi-cats{display:flex;gap:2px;flex-wrap:wrap}
.csi-cats button{padding:6px 14px;border:none;border-radius:2px;background:none;color:var(--cs-dim);font:inherit;font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.csi-cats button:hover{color:#fff;background:rgba(255,255,255,.04)}
.csi-cats button.on{color:#fff;background:#3a404b}
.csi-tools{display:flex;gap:6px}
.csi-tools input,.csi-tools select{height:30px;padding:0 10px;border-radius:2px;border:1px solid #3a404b;background-color:#15171b;color:var(--cs-txt);font:inherit;font-size:12.5px}
.csi-tools input{width:190px}
.csi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;padding:12px 14px 4px}
.csi-t{position:relative;display:flex;flex-direction:column;aspect-ratio:4/3.4;padding:0;border:1px solid #333944;border-radius:2px;cursor:pointer;color:inherit;font:inherit;text-align:left;
  background:radial-gradient(ellipse 90% 70% at 50% 40%,#3b414c,#2a2e36 70%);box-shadow:inset 0 -3px 0 var(--rc,#5e6673);transition:border-color .12s,background .12s}
.csi-t:hover{border-color:#8a919e;background:radial-gradient(ellipse 90% 70% at 50% 40%,#48505d,#30353e 70%)}
.csi-t.empty{cursor:default;background:#20242b;border-color:#2a2e36;box-shadow:none}
.csi-t.listed{opacity:.55}
.csi-t.is-new::before{content:var(--new,"NEW");position:absolute;top:4px;left:4px;z-index:2;font-size:9px;font-weight:800;letter-spacing:.06em;padding:1px 5px;border-radius:2px;background:#8bc34a;color:#11150c}
.csi-im{flex:1;min-height:0;display:grid;place-items:center;padding:8px 10px 0}
.csi-im img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.45))}
.csi-n{display:block;padding:3px 7px 7px;line-height:1.2;min-width:0}
.csi-n b,.csi-n small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.csi-n b{font-size:11.5px;font-weight:600;color:#e3e6eb}
.csi-n small{font-size:11px;color:var(--cs-dim)}
.csi-t.csi-st .csi-n b{color:#cf6a32}
.csi-tag{position:absolute;top:4px;right:4px;font-size:9.5px;font-weight:700;padding:1px 5px;border-radius:2px;background:#4b69ff;color:#fff}
/* infobulle */
.csi-tip{position:absolute;z-index:20;left:calc(100% + 6px);top:0;width:230px;display:none;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid #4a515d;border-radius:2px;
  background:#15171b;box-shadow:0 10px 30px rgba(0,0,0,.6);font-size:12px;color:var(--cs-dim);pointer-events:none}
.csi-tip b{font-size:13px;line-height:1.3}
.csi-t:hover .csi-tip{display:flex}
.csi-grid .csi-t:nth-child(6n) .csi-tip,.csi-grid .csi-t:nth-child(6n-1) .csi-tip{left:auto;right:calc(100% + 6px)}
/* menu d'actions */
.csi-menu{position:absolute;z-index:30;min-width:190px;padding:4px 0;border:1px solid #4a515d;border-radius:2px;background:#1b1e24;box-shadow:0 12px 30px rgba(0,0,0,.6)}
.csi-menu button{display:block;width:100%;padding:8px 14px;border:none;background:none;color:#e3e6eb;font:inherit;font-size:13px;text-align:left;cursor:pointer}
.csi-menu button:hover:not(:disabled){background:#3a404b}
.csi-menu button:disabled{color:var(--cs-dim);cursor:default}
.csi-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 14px 0}
.csi-week{font-size:12px;color:var(--cs-dim)}
.csi-pg{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--cs-txt);font-variant-numeric:tabular-nums}
.csi-pg button{width:30px;height:28px;border:1px solid #3a404b;border-radius:2px;background:#2a2e36;color:#fff;font-size:18px;line-height:1;cursor:pointer}
.csi-pg button:disabled{opacity:.35;cursor:default}
.csi-empty{padding:50px 20px;text-align:center;color:var(--cs-dim)}
.csi .inv-pend{margin:10px 14px 0}
@media(max-width:1000px){.csi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.csi-grid .csi-t:nth-child(n) .csi-tip{display:none}}
@media(max-width:560px){.csi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.csi-main button{padding:12px 12px;font-size:14px}.csi-tools input{width:120px}}

/* inventaire fusionné : équipement + case cochée */
.csi-loadout{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 14px;background:#1d2027;border-bottom:1px solid #2e333c}
.csi-loadout>b{font-family:var(--cond);font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:#fff}
.csi-loadout>small{font-size:11.5px;color:var(--cs-dim);margin-left:auto}
.csi-slot{display:flex;align-items:center;gap:8px}
.csi-slot>span{font-size:12px;color:var(--cs-dim);text-transform:uppercase;letter-spacing:.05em}
.csi-slot>div{display:flex;border:1px solid #3a404b;border-radius:2px;overflow:hidden}
.csi-slot button,.csi-agents{height:28px;padding:0 12px;border:none;background:#2a2e36;color:var(--cs-dim);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.csi-slot button+button{border-left:1px solid #3a404b}
.csi-slot button:hover,.csi-agents:hover{color:#fff}
.csi-slot button.on{background:#4a5160;color:#fff}
.csi-agents{border:1px solid #3a404b;border-radius:2px}
.csi-eq{position:absolute;top:5px;right:5px;z-index:2;display:inline-flex;align-items:center;gap:3px;padding:1px 5px 1px 2px;border-radius:2px;background:#4caf50;color:#fff;font-size:10px;font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.5)}
.csi-eq svg{width:13px;height:13px}
.csi-eq em{font-style:normal;letter-spacing:.03em}

/* inventaire : skins Steam + fenêtres Personnaliser / Agents */
.csi-tag.steam{background:#1b2838;color:#66c0f4;box-shadow:inset 0 0 0 1px #2a475e;right:auto;left:4px;top:auto;bottom:44px}
.csi-t.ext{opacity:.85}
.csi-note{margin:10px 14px 0;padding:9px 12px;border-radius:2px;background:#1b2838;color:#a9c7e0;font-size:12.5px;border:1px solid #2a475e}
.cust-modal{max-width:520px}
.cust-top{display:flex;gap:14px;align-items:center;margin-bottom:6px}
.cust-top .big{position:relative;width:200px;aspect-ratio:4/3;flex:none;display:grid;place-items:center;border-radius:4px;background:radial-gradient(ellipse at 50% 40%,#3b414c,#23272f 75%);box-shadow:inset 0 -3px 0 var(--rc)}
.cust-top .big img{max-width:92%;max-height:92%;object-fit:contain}
.cust-top h3{font-size:16px;line-height:1.25}
.cust-top small{color:var(--muted);font-size:12px}
.cust-modal .fld input[type=text]{width:100%;height:36px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}
.cust-modal .cfg-act{display:flex;gap:8px;margin-top:16px}
.ag-modal{max-width:880px}

.cust-pick-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.cust-pick-h b{font-size:14px}
.cust-stk-grid{max-height:52vh;overflow-y:auto}
.cust-modal .stk-tools input{width:100%;height:34px;padding:0 10px;border-radius:5px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit;margin-bottom:8px}

/* caisses du shop */
.cs-shop .im img{object-fit:contain}
.cs-shop-b{display:grid;gap:6px}.cs-shop-b .btn{width:100%;white-space:nowrap}
/* barre du haut sur téléphone : le badge à côté du logo poussait le profil hors de l'écran (page dézoomée) */
@media(max-width:720px){.top .concept{display:none}}
@media(max-width:380px){.top .rk-img{width:44px}.top{gap:8px}}
@media(max-width:720px){.st-row{flex-wrap:wrap}.st-row>.btn{white-space:normal;max-width:100%}}

/* badge bêta à côté du logo, régions pas encore ouvertes */
.beta-tag{font-family:var(--cond);font-size:10px;font-weight:700;letter-spacing:.048em;line-height:1;padding:3px 6px;border-radius:4px;background:var(--acc);color:#111;align-self:center;margin-left:2px}
.regions .chip.soon{opacity:1;cursor:not-allowed;color:#a0aec0;border-color:rgba(255,255,255,.08);background:rgba(18,24,32,.75)}
.regions .chip.soon small{font-style:italic;color:#b0bec5}

/* bouton « Match de test » (comptes dev), sous le bouton de recherche */
.rm-test{display:block;margin:8px auto 0;border-style:dashed}

/* commande de connexion + bouton Copier (CS:GO déjà ouvert) */
.ip-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.ip-row .ip{margin-top:0;user-select:all;word-break:break-all}
.ip-copy{flex-shrink:0}
.ip-hint{margin-top:6px;font-size:11.5px;color:var(--dim);text-align:center}

/* match de test (comptes dev) : rounds et fin réelle */
.rm-test-box{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:8px}
.rm-test-box .rm-test{margin:0}
.rm-test-box select{height:30px;border-radius:6px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font-size:12px;padding:0 6px}
.rm-test-real{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);cursor:pointer}

/* inventaire : doublons empilés, filtre par type, contrat d'échange */
.csi-stack{position:absolute;top:6px;right:6px;z-index:2;font-size:11px;font-weight:800;padding:1px 6px;border-radius:9px;background:rgba(0,0,0,.65);color:#fff}
#invW{height:32px;max-width:190px;border-radius:4px;border:1px solid #333944;background:#15181d;color:inherit;font-size:12.5px;padding:0 6px}
.csi-t.tu-sel{outline:2px solid var(--acc);outline-offset:-2px}
.tu-panel{border:1px solid #333944;border-radius:4px;background:#14171c;padding:14px;margin:0 0 12px}
.tu-h{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.tu-h span{font-size:12.5px;color:var(--muted)}
.tu-slots{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px}
.tu-slot{aspect-ratio:4/3;border:1px dashed #3a404b;border-radius:3px;display:grid;place-items:center;overflow:hidden}
.tu-slot.full{border:1px solid var(--rc);background:linear-gradient(180deg,transparent 60%,color-mix(in srgb,var(--rc) 25%,transparent))}
.tu-slot img{width:100%;height:100%;object-fit:contain}
.tu-odds{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px;margin-top:12px}.tu-odds>small{grid-column:1/-1;color:var(--muted)}
.tu-out{display:flex;align-items:center;gap:8px;padding:6px 8px;border-left:3px solid var(--rc);background:#1a1e24;border-radius:3px}
.tu-out .tu-im{width:54px;height:40px;flex-shrink:0}.tu-out .tu-im img{width:100%;height:100%;object-fit:contain}
.tu-out span{display:flex;flex-direction:column;min-width:0;flex:1}.tu-out b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tu-out small{font-size:11px;color:var(--muted)}
.tu-out em{font-style:normal;font-weight:800;font-size:13px}
.tu-act{display:flex;gap:8px;margin-top:12px}
@media(max-width:720px){.tu-slots{grid-template-columns:repeat(5,minmax(0,1fr))}#invW{max-width:130px}}

/* ---------- développeurs : badge DEV et profil décoré ---------- */
:root{--dev1:#5aa2ff;--dev2:#2d63b8}
.pb.dev{display:inline-flex;align-items:center;gap:4px;padding:2px 7px 2px 5px;color:#5aa2ff;letter-spacing:.08em;
  background:rgba(79,156,249,.12);box-shadow:inset 0 0 0 1px rgba(79,156,249,.55)}
.pb.dev svg{width:12px;height:12px;flex:none}
#profile.pp-dev .p-hero{position:relative;box-shadow:0 0 0 1px rgba(79,156,249,.45)}
#profile.pp-dev .p-banner{position:relative;overflow:hidden}
#profile.pp-dev .p-banner::after{background:linear-gradient(90deg,transparent,var(--dev1),transparent) bottom/100% 2px no-repeat,linear-gradient(0deg,var(--panel),rgba(13,17,23,0) 70%)}
#profile.pp-dev .p-av{position:relative;box-shadow:0 0 0 3px var(--panel),0 0 0 5px var(--dev1)}
#profile.pp-dev .p-name{color:#d8e9ff}
.dev-plaque{position:absolute;z-index:2;top:14px;left:14px;display:flex;align-items:center;gap:9px;padding:6px 12px 6px 8px;border-radius:4px;
  background:#0a0d13;border:1px solid rgba(79,156,249,.5)}
.dev-plaque svg{width:20px;height:20px;color:var(--dev1)}
.dev-plaque span{display:flex;flex-direction:column;line-height:1.1}
.dev-plaque b{font-family:var(--cond);font-size:15px;font-weight:700;letter-spacing:.024em;text-transform:uppercase;color:#d8e9ff}
.dev-plaque small{font-size:10px;letter-spacing:.18em;color:var(--muted)}
@media(max-width:720px){.dev-plaque{top:10px;left:10px;padding:4px 9px 4px 6px}.dev-plaque b{font-size:13px}}

/* retours bêta (profil dev) */
.fb-box{margin-top:16px;padding:14px 16px}
.fb-list{display:grid;gap:8px;margin-top:10px;max-height:420px;overflow:auto}
.fb-it{padding:10px 12px;border-radius:6px;background:var(--bg2,rgba(255,255,255,.03));border:1px solid var(--line,rgba(255,255,255,.08))}
.fb-it>div{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.fb-it small{color:var(--muted,#8b949e);font-size:12px}
.fb-it p{margin:6px 0 0;white-space:pre-wrap;word-break:break-word}

/* page Support et lien Discord */
.discord-link{color:#9aa8ff}
.discord-link:hover{color:#fff;background:#5865f2}
.sp-wrap{max-width:960px;margin:0 auto;display:grid;gap:16px}
.sp-hero{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.sp-hero h1{margin:0 0 4px}
.sp-hero p{margin:0;color:var(--muted)}
.sp-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}
@media (max-width:820px){.sp-grid{grid-template-columns:1fr}}
.sp-card{padding:18px}
.sp-card h3{margin:0 0 12px;font-size:16px}
.sp-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.sp-cats button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:4px;padding:6px 12px;font:inherit;font-size:13px;cursor:pointer}
.sp-cats button.on{border-color:var(--acc);color:var(--acc);background:rgba(255,166,0,.08)}
.sp-card textarea{width:100%;min-height:140px;resize:vertical;box-sizing:border-box;background:var(--bg2);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:10px 12px;font:inherit}
.sp-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.sp-row small{color:var(--muted)}
.sp-dc{display:flex;gap:14px;align-items:center;padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-radius:6px}
.sp-dc svg{width:36px;height:36px;color:var(--muted);flex:none}
.sp-dc div{flex:1}
.sp-dc p{margin:2px 0 0;color:var(--muted);font-size:13px}
.sp-dc .btn{background:var(--panel2);border-color:var(--line2);color:var(--text)}
.sp-dc .btn:hover{border-color:var(--acc);color:var(--acc)}
.tk-list{display:grid;gap:10px}
.tk{padding:12px;border-radius:6px;background:var(--bg2);border:1px solid var(--line)}
.tk-h{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tk-h small{color:var(--muted);margin-left:auto;font-size:12px}
.tk p{margin:6px 0 0;white-space:pre-wrap;word-break:break-word}
.tk-st,.tk-cat{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:4px;border:1px solid var(--line)}
.tk-st.open{color:var(--acc);border-color:var(--acc)}
.tk-st.answered{color:#3fb950;border-color:#3fb950}
.tk-st.closed{color:var(--muted)}
.tk-reply{margin-top:8px;padding:8px 10px;border-left:3px solid #3fb950;background:rgba(63,185,80,.07);border-radius:4px}
.tk-reply b{font-size:12px;color:#3fb950}
.fb-it.closed{opacity:.6}
.fb-it .tk-st,.fb-it .tk-cat{margin-left:2px}
.fb-act{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.fb-act textarea{flex:1 1 220px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:5px;padding:6px 8px;font:inherit;resize:vertical}
.rail-btn[hidden]{display:none!important}

/* bouton Support dans l'en-tête (seul accès sur mobile, où la barre de gauche est cachée) */
.top-help.active{color:var(--acc)}
@media (max-width:480px){#topProfile .meta,#topProfile #topLvl{display:none}}
@media (max-width:760px){.top .icon-btn.top-help{display:inline-flex}}

/* fiche objet : compteur StatTrak et réglages dev */
.st-row b{color:#cf6a32}
.dv-box{margin-top:14px;padding:12px 14px;border:1px dashed var(--acc);border-radius:6px;display:grid;gap:8px}
.dv-box label{font-size:13px;color:var(--muted);display:flex;gap:6px;align-items:center}
.dv-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.dv-row input[type=range]{flex:1 1 160px;accent-color:var(--acc)}
.dv-row input[type=number]{width:110px;background:var(--bg2);color:var(--text);border:1px solid var(--line);border-radius:5px;padding:5px 8px}
#dvS{width:80px}
#dvW{font-size:13px;color:var(--text);min-width:110px}

/* échanges entre joueurs */
.tr-modal{width:min(980px,96vw);max-height:90vh;overflow:auto}
.tr-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:720px){.tr-cols{grid-template-columns:1fr}}
.tr-cols h4,.tr-sec{margin:6px 0 8px;font-size:14px;display:flex;justify-content:space-between;align-items:baseline}
.tr-cols h4 small{color:var(--muted)}
.tr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;max-height:46vh;overflow:auto;padding:2px}
.tr-mini{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px}
.tr-it{font-size:12px;gap:2px}
.tr-it b{font-size:12px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tr-it small{color:var(--muted);font-size:11px}
.tr-it .it-im img{width:100%;height:60px;object-fit:contain}
.tr-it.on{outline:2px solid var(--acc);border-color:var(--acc)}
.tr-foot{display:flex;gap:16px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.tr-row{padding:12px;border:1px solid var(--line);border-radius:6px;background:var(--bg2);margin-bottom:10px}
.tr-row-h{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.tr-row-h small{margin-left:auto;color:var(--muted);font-size:12px}
.tr-acts{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}

/* panneau Équipement (armes interchangeables) */
.sl-panel{margin:10px 0 12px;padding:12px;border:1px solid var(--line);border-radius:6px;background:var(--panel)}
.sl-h{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin-bottom:10px}
.sl-h small{color:var(--muted);flex:1;min-width:200px}
.sl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.sl-card{display:grid;gap:6px;padding:8px;border-radius:5px;background:var(--bg2);border:1px solid var(--line)}
.sl-l{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.sl-pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px}
.sl-or{color:var(--muted);font-size:12px}
.sl-opt{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px;border-radius:5px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font:inherit;cursor:pointer;opacity:.55;transition:opacity .12s,border-color .12s}
.sl-opt:hover{opacity:.9}
.sl-opt.on{opacity:1;border-color:var(--acc);box-shadow:0 0 0 1px var(--acc) inset;background:color-mix(in srgb,var(--acc) 8%,var(--panel2))}
.sl-im{height:52px;display:flex;align-items:center;justify-content:center}
.sl-im img{max-height:52px;max-width:100%;object-fit:contain}
.sl-im img.sl-ghost{filter:grayscale(1) brightness(1.4) contrast(.6);opacity:.8}
.sl-n{font-size:12px;font-weight:600;text-align:center}
.sl-ck{position:absolute;top:4px;right:4px;width:16px;height:16px;border-radius:3px;background:var(--acc);color:#111;display:flex;align-items:center;justify-content:center}
.sl-ck svg{width:11px;height:11px}

/* rôle Bêta testeur */
.pb.beta{display:inline-flex;align-items:center;gap:4px;padding:2px 7px 2px 5px;color:var(--green);letter-spacing:.04em;text-transform:uppercase;font-weight:700;
  background:rgba(63,207,142,.12);box-shadow:inset 0 0 0 1px rgba(63,207,142,.5)}
.pb.beta svg{width:12px;height:12px;flex:none}

/* rooms privées */
.ro-wrap{margin-top:12px}
.ro{padding:14px 16px;display:grid;gap:12px;text-align:left}
.ro-h{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ro-h span{color:var(--muted);font-size:13px}
.ro-set{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.ro-set label{display:grid;gap:4px;font-size:12px;color:var(--muted)}
.ro-set select{background:var(--bg2);color:var(--text);border:1px solid var(--line);border-radius:5px;padding:6px 8px;font:inherit}
.ro-set .ro-ck{display:flex;gap:6px;align-items:center;color:var(--text);font-size:13px}
.ro-invrow{display:flex;gap:8px}
.ro-invrow input{flex:1;background:var(--bg2);color:var(--text);border:1px solid var(--line);border-radius:5px;padding:7px 10px;font:inherit}
.ro-teams{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:560px){.ro-teams{grid-template-columns:1fr}}
.ro-team{padding:10px;border-radius:6px;background:var(--bg2);border:1px solid var(--line)}
.ro-team h4{margin:0 0 8px;font-size:13px;display:flex;justify-content:space-between}
.ro-team h4 small{color:var(--muted)}
.ro-pl{display:flex;align-items:center;gap:6px;padding:5px 0;border-bottom:1px solid var(--line)}
.ro-pl:last-of-type{border-bottom:0}
.ro-pl span{flex:1}
.ro-pl em{font-style:normal;font-size:11px;color:var(--acc);margin-left:4px}
.ro-ic{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:5px;width:26px;height:26px;cursor:pointer;font:inherit}
.ro-bots{margin:6px 0 0;font-size:12px;color:var(--muted)}
.ro-act{display:flex;gap:8px;justify-content:flex-end;align-items:center}
.ro-inv{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 12px;margin-bottom:8px;border:1px solid var(--acc);border-radius:6px;background:color-mix(in srgb,var(--acc) 8%,var(--panel))}
.ro-inv span{flex:1}
.ro-new{margin-top:6px}

/* ELO Wingman sur le profil */
.p-wm{display:inline-flex;align-items:center;margin-left:6px;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:600;color:var(--text);background:var(--panel2);border:1px solid var(--line)}

/* courbe ELO : 5v5 ou Wingman */
.elo-modes{margin-left:auto;margin-right:8px}

/* bouton GOTV sur les cartes « Matchs en direct » */
.lv-gotv{cursor:pointer;padding:3px 9px;border-radius:4px;background:var(--acc);color:#111;font-weight:700}
.lv-gotv:hover{filter:brightness(1.1)}
/* profil : choix du classement affiché (5v5 / Wingman) */
.p-modes{display:flex;margin:14px 0 4px;width:100%}
.p-modes button{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:700}
.p-modes small{font-weight:500;color:var(--muted);font-size:12px}
.p-modes button.on small{color:inherit;opacity:.8}
.p-mode{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.p-mode b{color:var(--text)}
.rl-modes{display:inline-flex;margin-left:auto}
.rl-modes~.btn{margin-left:0!important}

/* écran de fin de match façon FACEIT (rankup.js) */
.mr-ov{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:16px;background:rgba(5,5,6,.86);opacity:0;transition:opacity .25s;--rc:var(--acc)}
.mr-ov.on{opacity:1}
.mr-ov.win{--rc:#3fcf8e}.mr-ov.loss{--rc:#ef5560}.mr-ov.draw{--rc:#c9ccd3}
.mr-card{width:min(640px,100%);max-height:calc(100vh - 32px);overflow:auto;background:var(--panel);border:1px solid rgba(255,255,255,.1);border-top:1px solid var(--rc);border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.06),inset 0 1px 0 rgba(255,255,255,.08);transform:translateY(14px) scale(.98);transition:transform .28s ease-out}
.mr-ov.on .mr-card{transform:none}
.mr-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 22px;background-size:cover;background-position:center}
.mr-res{font:800 34px/1 var(--cond,sans-serif);text-transform:uppercase;letter-spacing:.05em;color:var(--rc)}
.mr-map{margin-top:6px;color:var(--muted);font-size:13px}
.mr-score{display:flex;align-items:center;gap:8px;font:800 34px/1 var(--cond,sans-serif)}
.mr-score i{color:var(--dim);font-style:normal}
.mr-score b:first-child{color:var(--rc)}
.mr-body{padding:20px 22px 22px;display:grid;gap:18px}
.mr-elo{display:flex;align-items:center;gap:16px}
.mr-lvl{flex:none}
.mr-lvl.pop{animation:mr-pop .5s ease-out}
.mr-elo-main{flex:1;min-width:0}
.mr-elo-row{display:flex;align-items:baseline;gap:8px}
.mr-num{font:800 40px/1 var(--cond,sans-serif);font-variant-numeric:tabular-nums}
.mr-elo-row small{color:var(--muted);font-weight:600}
.mr-delta{margin-left:auto;font:800 22px var(--cond,sans-serif);padding:2px 10px;border-radius:4px;opacity:0;animation:mr-in .35s .4s forwards}
.mr-delta.pos{color:#3fcf8e;background:rgba(63,207,142,.12)}.mr-delta.neg{color:#ef5560;background:rgba(239,85,96,.12)}
.mr-bar{height:8px;margin-top:12px;border-radius:3px;background:var(--line2);overflow:hidden}
.mr-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),#ffd36b);transition:width .12s linear}
.mr-bar-t{display:flex;justify-content:space-between;margin-top:6px;font-size:12px;color:var(--muted)}
.mr-banner{margin-top:8px;font:800 14px var(--cond,sans-serif);text-transform:uppercase;letter-spacing:.12em;animation:mr-in .35s}
.mr-banner.up{color:#ffd36b}.mr-banner.down{color:#ef5560}
.mr-rank{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid var(--line);border-radius:5px;background:var(--panel2)}
.mr-rank-l{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--dim)}
.mr-emb{position:relative;width:90px;height:36px;flex:none}
.mr-emb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.mr-emb-new{opacity:0}
.mr-rank:not(.up):not(.down) .mr-emb-old{opacity:0}.mr-rank:not(.up):not(.down) .mr-emb-new{opacity:1}
.mr-rank.go .mr-emb-old{animation:mr-out .4s forwards}
.mr-rank.go .mr-emb-new{animation:mr-emb .5s .25s ease-out forwards}
.mr-rank.up.go .mr-emb::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 30px 14px #ffd36b;transform:translate(-50%,-50%);animation:mr-flash .65s .2s forwards;opacity:0}
.mr-rank b{font-size:15px}
.mr-rank-tag{margin-left:auto;font:800 12px var(--cond,sans-serif);text-transform:uppercase;letter-spacing:.12em;padding:4px 10px;border-radius:4px;opacity:0}
.mr-rank.up .mr-rank-tag{color:#1a1205;background:#ffd36b}.mr-rank.down .mr-rank-tag{color:#fff;background:#ef5560}
.mr-rank.go .mr-rank-tag{animation:mr-in .35s .5s forwards}
.mr-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.mr-st{padding:10px 6px;text-align:center;border-radius:5px;background:var(--panel2)}
.mr-st b{display:block;font:700 17px var(--cond,sans-serif);white-space:nowrap}
.mr-st span{font-size:11px;color:var(--muted)}
.mr-drops{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:var(--muted)}
.mr-drops em{font-style:normal;color:var(--text);padding:4px 9px;border-radius:4px;border:1px solid var(--line);background:var(--panel2)}
.mr-go{justify-self:end;min-width:140px}
@media (max-width:560px){.mr-stats{grid-template-columns:repeat(3,1fr)}.mr-res,.mr-score{font-size:26px}.mr-num{font-size:32px}.mr-go{justify-self:stretch}}
@keyframes mr-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes mr-pop{0%{transform:scale(1)}40%{transform:scale(1.3)}100%{transform:scale(1)}}
@keyframes mr-out{to{opacity:0;transform:scale(.7);filter:grayscale(1)}}
@keyframes mr-emb{from{opacity:0;transform:scale(1.6)}to{opacity:1;transform:none}}
@keyframes mr-flash{0%{opacity:0}30%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(9)}}
html.rm .mr-ov *{animation-duration:.01s!important;animation-delay:0s!important}
/* équipes, ligue d'équipes et tournois réels (leagues.js) */
.tq-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.tq-row:first-of-type{border-top:none}
.tq-row small{color:var(--muted)}
.tq-act{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.tq-pl{display:flex;align-items:center;gap:8px;padding:8px 0;border-top:1px solid var(--line);flex-wrap:wrap}
.tq-pl small{color:var(--muted);font-size:12px}
.tq-pl.pend{opacity:.7}
.tq-dot{width:8px;height:8px;border-radius:50%;background:var(--line2);flex:none}
.tq-dot.on{background:var(--green,#3fcf8e)}
.tq-inv{display:flex;gap:8px;margin-top:10px}
.tq-inv input{flex:1;min-width:0}
.tq-how{margin:0;padding-left:18px;color:var(--muted);font-size:13px;line-height:1.7}
.tq-new .af{margin-bottom:10px}
.tz-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.tz-card{cursor:pointer;display:flex;flex-direction:column;gap:4px;transition:border-color .15s}
.tz-card:hover{border-color:var(--acc)}
.tz-card b{font-size:16px}
.tz-card small{color:var(--muted);font-size:12px}
.tz-top{display:flex;gap:6px;align-items:center;margin-bottom:4px}
.tz-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.tz-meta span{font-size:12px;padding:3px 8px;border-radius:4px;background:var(--panel2);border:1px solid var(--line);color:var(--muted)}
.tz-head{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;margin-top:10px}
.tz-head h2{margin:2px 0 4px}
.tz-head small{color:var(--muted)}
.tz-desc{white-space:pre-wrap;color:var(--muted);font-size:13px;margin:10px 0 0}
.tz-win{margin-top:10px;font-weight:700;color:#ffd36b}
.tz-org{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tz-org span{margin-right:auto;color:var(--muted);font-size:13px}
.tz-br{display:flex;gap:14px;overflow-x:auto;padding-bottom:6px}
.tz-col{display:flex;flex-direction:column;justify-content:space-around;gap:10px;min-width:210px}
.tz-rn{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--dim)}
.tz-m{border:1px solid var(--line);border-radius:5px;background:var(--panel2);overflow:hidden}
.tz-t{display:flex;justify-content:space-between;gap:8px;padding:7px 10px;font-size:13px}
.tz-t+.tz-t{border-top:1px solid var(--line)}
.tz-t span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tz-t.w{color:var(--text);font-weight:700}.tz-t.w b{color:var(--green,#3fcf8e)}
.tz-t.l{opacity:.55}
.tz-run{padding:4px 10px;font-size:11px;color:var(--acc);border-top:1px solid var(--line)}
.tz-ctl{display:flex;flex-wrap:wrap;gap:6px;padding:8px;border-top:1px solid var(--line)}
.tz-ctl select{flex:1 1 100%}
/* mot de passe oublié : au-dessus de l'écran de connexion */
.rs-ov{z-index:320}
.rs-ok{margin:4px 0 12px;padding:10px 12px;border-radius:5px;background:rgba(63,207,142,.12);color:#3fcf8e;font-size:13px}
/* bandeau « nouvelle version du site » (update.js) */
.upd-bar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:400;display:flex;align-items:center;gap:12px;padding:10px 12px 10px 16px;border-radius:6px;background:#0d1017;background:rgba(13,16,23,0.98);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--acc);box-shadow:0 18px 48px rgba(0,0,0,.8);font-size:13px;max-width:calc(100vw - 32px)}
.sp-legal{text-align:right;font-size:12px;color:var(--muted);margin:0 0 8px}.sp-legal a{color:var(--muted)}.af-cgu a{color:var(--acc)}
.auth-legal{margin-top:14px;text-align:center;font-size:11.5px;color:var(--dim)}.auth-legal a{color:var(--muted);text-decoration:none}.auth-legal a:hover{color:var(--text);text-decoration:underline}
.rail-legal{display:flex;flex-wrap:wrap;gap:6px 10px;padding:8px 12px 2px;font-size:11px;color:var(--dim);border-top:1px solid var(--line)}.rail-legal a{color:var(--dim);text-decoration:none}.rail-legal a:hover{color:var(--muted)}
/* ===== sobriété & fluidité : pas de lueurs décoratives, pas d'effet verre, pas de soulèvement au survol, pas d'effets en boucle ===== */
.auth-pill-tag .live-dot,.auth-vrail-thumb,.auth-vstep-btn.active .vstep-num{box-shadow:none}
.emb b,.rare-q{text-shadow:none}
.prow.talk .avatar{box-shadow:0 0 0 2px var(--green)}
.vc-m.talk .avatar{box-shadow:0 0 0 2px var(--panel),0 0 0 4px var(--green)}
.avatar.pr-elite{box-shadow:0 0 0 2px var(--panel),0 0 0 3px var(--elite)}
.avatar.pr-pro{box-shadow:none}
#profile.pp-pro .p-hero{box-shadow:0 0 0 1px var(--pro3)}
.avatar.pr-pro::before,#profile.pp-pro .p-av::before,.pb.pro::after,.pro-sweep{animation:none}
.pb.pro::after{display:none}
.auth-bg-particles{display:none}
.rv-lock,.overlay,.auth-pill-tag,.auth-stat-card,.auth-scroll-prompt,.auth-side,.p-banner .pro-plaque,.top,.mr-ov{backdrop-filter:none;-webkit-backdrop-filter:none}
.auth-stat-card{background:#10131a;border-color:#232833}
.auth-pill-tag,.auth-scroll-prompt{background:#12151c}
.auth-side{background:#0b0d12}
.top{background:#0d0d0e}
.rv-lock{background:rgba(5,5,6,.82)}
.auth-stat-card:hover,.auth-scroll-prompt:hover,.dk-btn:hover,.it-card:hover,.theme-swatch:hover,.sl-opt:hover,.lg-step:hover .emb2.sm,.mode:hover,.map:hover,.fr-card:hover{transform:none}
#themeBtn,#themePop,#themeWrap{display:none!important}
.rk-table,.inv-grid,.sh-grid,.fr-grid{content-visibility:auto;contain-intrinsic-size:auto 320px}
/* Premium : en-tête simple, pas de carte « mise en avant », liste sans icônes */
.pr-hero{text-align:left;max-width:none;margin:6px 0 22px}
.pr-hero h1{font-size:32px}
.pr-hero p{max-width:680px}
.plan .tagf{display:none}
.plan.cur{border-color:var(--acc)}
.pl-list{list-style:none;padding:0;margin:14px 0}
.pl-list li{position:relative;padding:5px 0 5px 14px;border-top:1px solid var(--line);font-size:13.5px;color:#cfd2d8}
.pl-list li:first-child{border-top:none}
.pl-list li:not(.hd)::before{content:"";position:absolute;left:0;top:13px;width:5px;height:1px;background:var(--muted)}
.cmp .yes{color:var(--text)}

/* ===== v2.84 : Refonte UI Globale, Pop-ups & Badges Tactiques (FACEIT revisité) ===== */
/* 1. Badges tactiques biseautés (.pb) + Pastille de niveau 1-10 (.rk-lv-tag) */
.pb{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:4px;
  height:18px;
  padding:0 7px 0 6px;
  margin-left:5px;
  font-family:var(--cond);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.032em;
  text-transform:uppercase;
  line-height:1;
  border-radius:2px;
  clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px);
  vertical-align:middle;
  user-select:none;
  white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.pb svg{width:11px;height:11px;flex:none;display:block}
.pb.plus{
  background:#132033;
  color:#74b3ff;
  border:1px solid #25456b;
  border-left:2.5px solid #4c9aff;
}
.pb.premium{
  background:linear-gradient(90deg,#2a1808 0%,#1f150c 100%);
  color:#ffb21f;
  border:1px solid #5c3913;
  border-left:2.5px solid #ff7a18;
}
.pb.pro{
  background:linear-gradient(90deg,#2b2009 0%,#1c1609 100%);
  color:#ffd86b;
  border:1px solid #6b5119;
  border-left:2.5px solid #f2c14e;
}
.pb.elite{
  background:linear-gradient(90deg,#2e1015 0%,#1d0c10 100%);
  color:#ff7582;
  border:1px solid #68212b;
  border-left:2.5px solid #ff4d5e;
}
.pb.chal{
  background:#191c24;
  color:#d5dae3;
  border:1px solid #323846;
  border-left:2.5px solid #9aa3b5;
}
.pb.inf{
  background:#291217;
  color:#ff858d;
  border:1px solid #59252e;
  border-left:2.5px solid #ef5560;
}
.pb.dev{
  background:#111e30;
  color:#7cb8ff;
  border:1px solid #244369;
  border-left:2.5px solid #5aa2ff;
}
.pb.beta{
  background:#0f241c;
  color:#56d69a;
  border:1px solid #1f4f3b;
  border-left:2.5px solid #3fcf8e;
}
.beta-tag{
  font-family:var(--cond);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.04em;
  padding:2px 6px;
  border-radius:2px;
  clip-path:polygon(3px 0,100% 0,100% calc(100% - 3px),calc(100% - 3px) 100%,0 100%,0 3px);
  background:#261a08;
  color:var(--acc);
  border:1px solid #573b12;
  border-left:2px solid var(--acc);
}

/* Pastille de niveau 1-10 façon FACEIT revisité sur le badge de rang */
.lvl.rk-lvl{
  position:relative;
  overflow:visible;
}
.rk-lv-tag{
  position:absolute;
  right:-4px;
  bottom:-4px;
  min-width:15px;
  height:14px;
  padding:0 3.5px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:var(--cond);
  font-size:9.5px;
  font-weight:700;
  line-height:1;
  letter-spacing:.008em;
  color:var(--lv-c,#ffb21f);
  background:#0b0d11;
  border:1px solid var(--lv-c,#ffb21f);
  border-radius:2px;
  clip-path:polygon(2.5px 0,100% 0,100% calc(100% - 2.5px),calc(100% - 2.5px) 100%,0 100%,0 2.5px);
  box-shadow:0 1px 3px rgba(0,0,0,.85);
  pointer-events:none;
}
.lvl.rk-lvl.lvl-lg .rk-lv-tag{
  right:-5px;
  bottom:-4px;
  min-width:20px;
  height:17px;
  padding:0 5px;
  font-size:11.5px;
  border-width:1.5px;
}

/* 2. Refonte complète des Pop-ups / Modales (.overlay, .modal, .m-h, .m-f, .x2) */
.overlay{
  background:rgba(5,6,8,.82);
  padding:20px;
}
.modal{
  background:#11141b;
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  padding:24px;
  box-shadow:0 24px 64px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.06),inset 0 1px 0 rgba(255,255,255,.08);
  color:var(--text);
}
.modal .m-h{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin:-24px -24px 18px;
  padding:15px 22px;
  background:#0c0e12;
  border-bottom:1px solid #20242d;
  border-radius:4px 4px 0 0;
}
.modal .m-h h2,.modal .m-h h3{
  font-family:var(--cond);
  font-size:19px;
  font-weight:700;
  letter-spacing:.016em;
  text-transform:uppercase;
  margin:0;
}
.modal .x2{
  width:30px;
  height:30px;
  border-radius:4px;
  border:1px solid #262b35;
  background:#151820;
  color:var(--muted);
  font-size:16px;
  font-weight:700;
  display:grid;
  place-items:center;
  transition:border-color .12s,color .12s,background .12s;
}
.modal .x2:hover{
  background:#1d212b;
  border-color:#3a4150;
  color:var(--text);
}
.modal .m-f{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  margin:20px -24px -24px;
  padding:14px 22px;
  background:#0c0e12;
  border-top:1px solid #20242d;
  border-radius:0 0 4px 4px;
}
.modal label:not(.st-check){
  display:block;
  font-family:var(--cond);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.028em;
  text-transform:uppercase;
  color:var(--muted);
  margin:12px 0 5px;
}
.modal input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),
.modal select,
.modal textarea{
  background:#0b0d11;
  border:1px solid #252a34;
  border-radius:4px;
  color:var(--text);
  transition:border-color .12s;
}
.modal input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):focus,
.modal select:focus,
.modal textarea:focus{
  border-color:var(--acc);
  outline:none;
  box-shadow:0 0 0 1px var(--acc),0 2px 8px rgba(0,0,0,.4);
}

/* Modales de danger (Suppression de compte, Confirmation critique, Signalement) */
.modal.modal-danger,#confirmModal .modal,#reportModal .modal{
  border-color:rgba(244,63,94,.4);
  box-shadow:0 24px 64px rgba(0,0,0,.85),0 0 0 1px rgba(244,63,94,.2),inset 0 1px 0 rgba(244,63,94,.25);
}
.del-acc-warn{
  padding:12px 14px;
  border-radius:4px;
  background:rgba(239,85,96,.08);
  border:1px solid rgba(239,85,96,.28);
  border-left:3px solid var(--red);
  color:#f2c6c9;
  font-size:13px;
  line-height:1.55;
  margin-bottom:10px;
}
.st-card.st-danger-zone{
  border-color:rgba(239,85,96,.32);
  border-left:3px solid var(--red);
  background:linear-gradient(90deg,rgba(239,85,96,.05) 0%,#121316 100%);
}
.btn-danger-solid{
  background:var(--red)!important;
  color:#fff!important;
  border:1px solid #ff6b75!important;
  font-family:var(--cond);
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.btn-danger-solid:hover:not(:disabled){
  background:#df434e!important;
}
.btn-danger-solid:disabled{
  opacity:.45;
  cursor:not-allowed;
}

/* 3. Polissage UI Global (Topbar, Rail, Cartes, Tableaux, Boutons) */
.top{
  background:#0b0d11;
  border-bottom:1px solid #1e222b;
}
.rail{
  background:#0b0d11;
  border-right:1px solid #1e222b;
}
.r-btn{
  border-radius:4px;
}
.r-btn.active{
  background:#151922;
  color:var(--acc);
  border-left:2px solid var(--acc);
}
.card,.st-card,.pcard{
  background:#111318;
  border:1px solid #20242d;
  border-radius:6px;
}
.tbl th{
  font-family:var(--cond);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.032em;
  color:var(--dim);
  background:#0d0f14;
}
.tbl tr:hover td{
  background:#151821;
}
.play{
  border-radius:4px;
  letter-spacing:.08em;
}
.btn2,.gbtn{
  border-radius:4px;
}

/* 4. Contraintes strictes sur les avatars et bannières d'invitation (correctif pdp géante sans couper le badge de rang sur .avatar.big) */
.avatar{
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
.avatar:not(.big){
  overflow:hidden;
}
.avatar.big{
  overflow:visible!important;
}
.avatar>img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:cover!important;
  display:block;
}
.avatar .rk-img,img.rk-img{
  object-fit:contain!important;
  border-radius:0!important;
}
#topLvl{
  display:flex;
  align-items:center;
  margin-right:6px;
}
.pcard .big .lvl.rk-lvl{
  width:50px;
  height:20px;
  right:-22px;
  bottom:-9px;
  z-index:2;
}
.pcard .pname{
  margin-top:13px;
}
.pib-who .avatar{
  width:38px!important;
  height:38px!important;
  min-width:38px;
  min-height:38px;
  max-width:38px;
  max-height:38px;
  overflow:hidden;
  flex-shrink:0;
}
.fr-req-left .avatar{
  width:42px!important;
  height:42px!important;
  min-width:42px;
  min-height:42px;
  max-width:42px;
  max-height:42px;
  overflow:hidden;
  flex-shrink:0;
}
.pl-friend-left .avatar{
  width:34px!important;
  height:34px!important;
  min-width:34px;
  min-height:34px;
  max-width:34px;
  max-height:34px;
  overflow:hidden;
  flex-shrink:0;
}
.fr-req-info span,.pl-friend-left span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.fr-req-info .lvl.rk-lvl,.pl-friend-left .lvl.rk-lvl{
  width:46px;
  height:18px;
}

/* 5. Barre rapide Ligues & Teams (.cp-quickbar), filtre instantané (.cp-filter-in) et invitation rapide d'amis (.tq-quick-friends) */
.cp-quickbar{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:10px;
  margin-bottom:12px;
}
.cp-qitem{
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 14px;
  background:#111318;
  border:1px solid #20242d;
  border-left:3px solid var(--acc);
  border-radius:6px;
}
.cp-qtxt{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.cp-qtxt small{
  font-family:var(--cond);
  font-size:11px;
  font-weight:700;
  letter-spacing:.024em;
  text-transform:uppercase;
  color:var(--muted);
  display:flex;
  align-items:center;
}
.cp-qtxt b{
  font-size:13.5px;
  font-weight:700;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cp-filter-in{
  height:32px;
  width:220px;
  max-width:100%;
  padding:0 10px;
  border-radius:4px;
  border:1px solid #252a34;
  background:#0b0d11;
  color:var(--text);
  font-size:12.5px;
}
.cp-filter-in:focus{
  border-color:var(--acc);
  outline:none;
}
.tq-quick-friends{
  margin-top:8px;
  padding-top:8px;
  border-top:1px dashed var(--line);
}
.tq-quick-friends small{
  display:block;
  font-size:11.5px;
  color:var(--muted);
  margin-bottom:6px;
}
.tq-qf-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.tq-qf-pill{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:4px 9px;
  border-radius:4px;
  background:#14171e;
  border:1px solid #262b36;
  color:var(--text);
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition:border-color .12s,background .12s;
}
.tq-qf-pill:hover{
  border-color:var(--acc);
  background:#1a1e27;
}
.tq-qf-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--dim);
}
.tq-qf-dot.on{
  background:var(--green);
}

/* =====================================================
   CARTES DE PROFIL TACTIQUES (Accueil, Amis, Profil & Boutique)
   ===================================================== */
.pcard-edit-btn{
  position:absolute;
  top:6px;
  left:6px;
  z-index:3;
  width:24px;
  height:24px;
  border-radius:4px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(10,11,14,.78);
  color:var(--muted);
  cursor:pointer;
  display:grid;
  place-items:center;
  opacity:0;
  transition:opacity .15s,color .15s,border-color .15s;
}
.pcard-edit-btn svg{
  width:13px;
  height:13px;
}
.pcard:hover .pcard-edit-btn{
  opacity:1;
}
.pcard-edit-btn:hover{
  color:var(--acc);
  border-color:var(--acc);
}

.pcard-deco{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
  overflow:hidden;
}
.pcard-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
@keyframes pcardSpin{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
@keyframes pcardBlink{
  0%,100%{opacity:.95;transform:scale(1)}
  50%{opacity:.2;transform:scale(.75)}
}
@keyframes pcardPetal{
  0%{transform:translate(0,0) rotate(0deg);opacity:.85}
  50%{transform:translate(-12px,42px) rotate(45deg);opacity:.9}
  100%{transform:translate(8px,92px) rotate(95deg);opacity:0}
}
@keyframes pcardAurora{
  0%,100%{transform:translateY(0) scaleY(1);opacity:.42}
  50%{transform:translateY(-5px) scaleY(1.18);opacity:.68}
}
@keyframes pcardBolt{
  0%,82%,100%{opacity:.12}
  86%{opacity:.95}
  90%{opacity:.25}
  94%{opacity:1}
}
@keyframes pcardEmber{
  0%{transform:translateY(0) scale(1);opacity:.9}
  100%{transform:translateY(-68px) scale(.4);opacity:0}
}
@keyframes pcardSlash{
  0%,76%,100%{opacity:.35}
  82%{opacity:1}
  88%{opacity:.55}
}
.pcard-svg-spin{animation:pcardSpin 7s linear infinite}
.pcard-svg-blink{animation:pcardBlink 2.2s ease-in-out infinite}
.pcard-petal{animation:pcardPetal 4.8s ease-in-out infinite}
.pcard-petal.p2{animation-delay:1.1s;animation-duration:5.4s}
.pcard-petal.p3{animation-delay:2.2s;animation-duration:4.4s}
.pcard-petal.p4{animation-delay:.6s;animation-duration:5.1s}
.pcard-petal.p5{animation-delay:1.7s;animation-duration:4.9s}
.pcard-aurora-wave{animation:pcardAurora 4.5s ease-in-out infinite}
.pcard-bolt{animation:pcardBolt 3.2s infinite}
.pcard-bolt.b2{animation-delay:1.1s}
.pcard-bolt.b3{animation-delay:2.1s}
.pcard-ember{animation:pcardEmber 3.4s ease-out infinite}
.pcard-ember.e2{animation-delay:.7s;animation-duration:3.9s}
.pcard-ember.e3{animation-delay:1.4s;animation-duration:3.1s}
.pcard-ember.e4{animation-delay:2.1s;animation-duration:3.7s}
.pcard-ember.e5{animation-delay:1.1s;animation-duration:4.2s}
.pcard-slash-line,.pcard-slash-glint{animation:pcardSlash 3.6s infinite}
.pcard-corner{
  position:absolute;
  width:9px;
  height:9px;
  border-color:var(--cs-trim,rgba(255,255,255,.32));
  border-style:solid;
  border-width:0;
}
.pcard-corner.tl{top:4px;left:4px;border-top-width:2px;border-left-width:2px}
.pcard-corner.tr{top:4px;right:4px;border-top-width:2px;border-right-width:2px}
.pcard-corner.bl{bottom:4px;left:4px;border-bottom-width:2px;border-left-width:2px}
.pcard-corner.br{bottom:4px;right:4px;border-bottom-width:2px;border-right-width:2px}

.pcard-serial{
  position:absolute;
  top:6px;
  right:8px;
  font-family:var(--font-mono);
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.08em;
  padding:1px 5px;
  border-radius:2px;
  background:rgba(9,10,13,.82);
  color:var(--cs-trim,#c8cdd6);
  border:1px solid rgba(255,255,255,.12);
}

/* 1. Carbone Forgé */
.pcard-cs-carbon{
  --cs-trim:#8b95a5;
  background:
    repeating-linear-gradient(45deg,#121418 0 4px,#171a20 4px 8px)!important;
  border:1px solid #3a4250!important;
  box-shadow:inset 0 2px 0 #8b95a5;
}
.pcard-cs-carbon .big{border-color:#2c333e!important}
.pcard-cs-carbon .pfoot{background:rgba(12,14,18,.88);border-top-color:#2b313c}

/* 2. Acier de Damas */
.pcard-cs-damascus{
  --cs-trim:#6e93b5;
  background:
    repeating-linear-gradient(-30deg,#12171f 0 6px,#18202b 6px 12px,#141b24 12px 18px)!important;
  border:1px solid #45617d!important;
  box-shadow:inset 0 2px 0 #6e93b5;
}
.pcard-cs-damascus .big{border-color:#45617d!important}
.pcard-cs-damascus .pfoot{background:rgba(13,18,25,.9);border-top-color:#31465c}

/* 3. Tiger Strike */
.pcard-cs-tiger{
  --cs-trim:#e0822b;
  background:
    linear-gradient(180deg,rgba(224,130,43,.09),transparent 45%),
    repeating-linear-gradient(-55deg,#141210 0 10px,#1c1712 10px 16px,#261c12 16px 19px)!important;
  border:1px solid #8c5119!important;
  box-shadow:inset 0 2px 0 #e0822b;
}
.pcard-cs-tiger .big{border-color:#b8681f!important}
.pcard-cs-tiger .pname{color:#f5e6d3}
.pcard-cs-tiger .pfoot{background:rgba(20,15,11,.92);border-top-color:#4d2f12}

/* 4. Châssis Asiimov */
.pcard-cs-asiimov{
  --cs-trim:#e05a2b;
  background:
    linear-gradient(135deg,#18191d 0 62%,#231815 62% 76%,#141518 76% 100%)!important;
  border:1px solid #c94e23!important;
  box-shadow:inset 0 3px 0 #e05a2b,inset 0 -2px 0 #d8dadf;
}
.pcard-cs-asiimov .big{border-color:#e05a2b!important}
.pcard-cs-asiimov .pfoot{background:rgba(17,15,16,.92);border-top:1px solid rgba(224,90,43,.4)}

/* 5. Printstream Noir */
.pcard-cs-printstream{
  --cs-trim:#e2e5ec;
  background:
    linear-gradient(180deg,#181a20 0,#0e1014 100%)!important;
  border:1px solid #aeb5c2!important;
  box-shadow:inset 0 3px 0 #e2e5ec;
}
.pcard-cs-printstream .big{border-color:#d5dae3!important}
.pcard-cs-printstream .pfoot{background:#0b0c0f;border-top:1px solid rgba(226,229,236,.28)}

/* 6. Or Légionnaire */
.pcard-cs-legion{
  --cs-trim:#d4a024;
  background:
    linear-gradient(165deg,#1d1810 0,#13110d 65%,#1f1910 100%)!important;
  border:1px solid #9e7519!important;
  box-shadow:inset 0 2px 0 #d4a024,inset 0 -1px 0 rgba(212,160,36,.35);
}
.pcard-cs-legion .big{border-color:#c49222!important}
.pcard-cs-legion .pname{color:#f5e4b8}
.pcard-cs-legion .pfoot{background:rgba(20,16,10,.92);border-top-color:rgba(212,160,36,.32)}

/* 7. Doppler Rubis */
.pcard-cs-ruby{
  --cs-trim:#d6384c;
  background:
    linear-gradient(160deg,#210f14 0,#130a0d 65%,#261116 100%)!important;
  border:1px solid #962433!important;
  box-shadow:inset 0 2px 0 #d6384c,inset 0 -1px 0 rgba(214,56,76,.35);
}
.pcard-cs-ruby .big{border-color:#b82c3e!important}
.pcard-cs-ruby .pname{color:#f7dadd}
.pcard-cs-ruby .pfoot{background:rgba(20,9,12,.92);border-top-color:rgba(214,56,76,.32)}

/* 8. Opérateur Radar (Animé) */
.pcard-cs-radar{
  --cs-trim:#3fcf8e;
  background:
    radial-gradient(circle at 50% 28%,rgba(63,207,142,.16),transparent 60%),
    linear-gradient(180deg,#0c1612 0,#0a100e 100%)!important;
  border:1px solid #287a56!important;
  box-shadow:inset 0 2px 0 #3fcf8e;
}
.pcard-cs-radar .big{border-color:#3fcf8e!important}
.pcard-cs-radar .pname{color:#d7f9e9}
.pcard-cs-radar .pfoot{background:rgba(9,16,13,.92);border-top-color:rgba(63,207,142,.3)}

/* 9. Lance de Gungnir */
.pcard-cs-gungnir{
  --cs-trim:#6cb8f7;
  background:
    radial-gradient(circle at 50% 25%,rgba(108,184,247,.18),transparent 62%),
    linear-gradient(165deg,#101926 0,#0c121b 65%,#142234 100%)!important;
  border:1px solid #3c78ad!important;
  box-shadow:inset 0 2px 0 #6cb8f7,inset 0 -1px 0 rgba(108,184,247,.35);
}
.pcard-cs-gungnir .big{border-color:#6cb8f7!important}
.pcard-cs-gungnir .pname{color:#e0f0ff}
.pcard-cs-gungnir .pfoot{background:rgba(11,17,26,.92);border-top-color:rgba(108,184,247,.32)}

/* 10. Vent de Sakura (Animé) */
.pcard-cs-sakura{
  --cs-trim:#f48fb1;
  background:
    radial-gradient(circle at 50% 20%,rgba(244,143,177,.16),transparent 60%),
    linear-gradient(170deg,#1c1118 0,#110b10 70%,#21131b 100%)!important;
  border:1px solid #9c4668!important;
  box-shadow:inset 0 2px 0 #f48fb1;
}
.pcard-cs-sakura .big{border-color:#e87da0!important}
.pcard-cs-sakura .pname{color:#fce4ec}
.pcard-cs-sakura .pfoot{background:rgba(18,10,15,.92);border-top-color:rgba(244,143,177,.3)}

/* 11. Aurore Boréale (Animé) */
.pcard-cs-aurora{
  --cs-trim:#46c9a7;
  background:
    linear-gradient(180deg,rgba(70,201,167,.16) 0,rgba(56,189,248,.08) 42%,#0c1318 100%)!important;
  border:1px solid #2d8a75!important;
  box-shadow:inset 0 2px 0 #46c9a7;
}
.pcard-cs-aurora .big{border-color:#46c9a7!important}
.pcard-cs-aurora .pname{color:#dcfaef}
.pcard-cs-aurora .pfoot{background:rgba(10,17,21,.92);border-top-color:rgba(70,201,167,.3)}

/* 12. Doppler Émeraude */
.pcard-cs-emerald{
  --cs-trim:#2ec27e;
  background:
    linear-gradient(160deg,#0e2017 0,#0a140f 65%,#11261b 100%)!important;
  border:1px solid #1f8757!important;
  box-shadow:inset 0 2px 0 #2ec27e,inset 0 -1px 0 rgba(46,194,126,.35);
}
.pcard-cs-emerald .big{border-color:#2ec27e!important}
.pcard-cs-emerald .pname{color:#d8f8e8}
.pcard-cs-emerald .pfoot{background:rgba(9,19,14,.92);border-top-color:rgba(46,194,126,.32)}

/* 13. Tempête d'Éclairs (Animé) */
.pcard-cs-storm{
  --cs-trim:#60a5fa;
  background:
    radial-gradient(circle at 50% 15%,rgba(96,165,250,.22),transparent 58%),
    linear-gradient(175deg,#101829 0,#0b0f19 70%,#131e36 100%)!important;
  border:1px solid #3b76c4!important;
  box-shadow:inset 0 2px 0 #60a5fa;
}
.pcard-cs-storm .big{border-color:#60a5fa!important}
.pcard-cs-storm .pname{color:#e0edff}
.pcard-cs-storm .pfoot{background:rgba(10,14,24,.92);border-top-color:rgba(96,165,250,.32)}

/* 14. Braisier Volcanique (Animé) */
.pcard-cs-magma{
  --cs-trim:#f97316;
  background:
    radial-gradient(circle at 50% 95%,rgba(249,115,22,.22),transparent 60%),
    linear-gradient(180deg,#18100d 0,#120b09 65%,#24120c 100%)!important;
  border:1px solid #b54812!important;
  box-shadow:inset 0 2px 0 #f97316,inset 0 -2px 0 #ea580c;
}
.pcard-cs-magma .big{border-color:#f97316!important}
.pcard-cs-magma .pname{color:#ffedd5}
.pcard-cs-magma .pfoot{background:rgba(22,11,8,.92);border-top-color:rgba(249,115,22,.35)}

/* 15. Katana Oni (Animé) */
.pcard-cs-oni{
  --cs-trim:#f43f5e;
  background:
    linear-gradient(155deg,#1f0c11 0,#0f090c 60%,#290e15 100%)!important;
  border:1px solid #a82039!important;
  box-shadow:inset 0 2px 0 #f43f5e;
}
.pcard-cs-oni .big{border-color:#f43f5e!important}
.pcard-cs-oni .pname{color:#ffe4e6}
.pcard-cs-oni .pfoot{background:rgba(18,8,11,.94);border-top-color:rgba(244,63,94,.35)}

/* 16. Prédateur Howl */
.pcard-cs-howl{
  --cs-trim:#ef4444;
  background:
    radial-gradient(circle at 50% 35%,rgba(239,68,68,.18),transparent 62%),
    linear-gradient(165deg,#210d0d 0,#110909 65%,#26140c 100%)!important;
  border:1px solid #b92b27!important;
  box-shadow:inset 0 2px 0 #ef4444,inset 0 -2px 0 #f59e0b;
}
.pcard-cs-howl .big{border-color:#f59e0b!important}
.pcard-cs-howl .pname{color:#fef08a}
.pcard-cs-howl .pfoot{background:rgba(20,10,9,.94);border-top-color:rgba(245,158,11,.35)}

/* 17. Dragon Lore */
.pcard-cs-dragon{
  --cs-trim:#e5b53b;
  background:
    repeating-linear-gradient(45deg,rgba(229,181,59,.05) 0 6px,transparent 6px 12px),
    linear-gradient(165deg,#211b10 0,#14110b 65%,#261e10 100%)!important;
  border:1px solid #b58922!important;
  box-shadow:inset 0 2px 0 #e5b53b,inset 0 -2px 0 #b91c1c;
}
.pcard-cs-dragon .big{border-color:#e5b53b!important}
.pcard-cs-dragon .pname{color:#fef3c7}
.pcard-cs-dragon .pfoot{background:rgba(20,16,10,.94);border-top-color:rgba(229,181,59,.38)}

/* 18. Singularité / Trou Noir (Animé) */
.pcard-cs-singularity{
  --cs-trim:#f59e0b;
  background:
    radial-gradient(circle at 50% 29%,#050507 0 22%,rgba(234,88,12,.22) 34%,#0d0b10 68%)!important;
  border:1px solid #b4691b!important;
  box-shadow:inset 0 2px 0 #f59e0b;
}
.pcard-cs-singularity .big{border-color:#fbbf24!important}
.pcard-cs-singularity .pname{color:#fef3c7}
.pcard-cs-singularity .pfoot{background:rgba(13,11,16,.94);border-top-color:rgba(245,158,11,.35)}

/* 19. Souverain Immortel (Animé) */
.pcard-cs-sovereign{
  --cs-trim:#f2c14e;
  background:
    radial-gradient(circle at 50% 28%,rgba(242,193,78,.22),transparent 62%),
    linear-gradient(165deg,#221b0f 0,#12100c 60%,#281f10 100%)!important;
  border:1px solid #c99926!important;
  box-shadow:inset 0 2px 0 #f2c14e,inset 0 -2px 0 #f2c14e;
}
.pcard-cs-sovereign .big{border-color:#f2c14e!important}
.pcard-cs-sovereign .pname{color:#fff3c4}
.pcard-cs-sovereign .pfoot{background:rgba(18,15,10,.94);border-top-color:rgba(242,193,78,.42)}

/* Lignes de joueurs dans le salon de match (.prow) */
.prow[class*="pcard-cs-"]:not(.pcard-cs-default){
  border-left:3px solid var(--cs-trim,var(--acc));
}

/* Barre de filtres de catégories dans la boutique Cartes */
.sh-cards-filters{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:14px;
}

/* Badge de carte sur le Hero du profil (.p-hero) */
.p-hero-card-badge{
  position:absolute;
  top:12px;
  left:12px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border-radius:4px;
  background:rgba(10,11,14,.86);
  border:1px solid var(--tc,#8b95a5);
  font-family:var(--cond);
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--text);
}
.p-hero-card-badge b{
  color:var(--tc,#8b95a5);
  font-family:var(--font-mono);
  font-size:11px;
}

/* Boutique : Onglet Cartes de profil */
.sh-cards-hero{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) 260px;
  gap:20px;
  align-items:center;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:6px;
  padding:20px 22px;
  margin-bottom:16px;
}
.sh-cards-kicker{
  font-family:var(--cond);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--acc);
  margin-bottom:4px;
}
.sh-cards-hero-left h2{
  font-family:var(--cond);
  font-size:26px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.008em;
  margin:0 0 6px;
}
.sh-cards-hero-left p{
  font-size:13.5px;
  color:var(--muted);
  line-height:1.5;
  margin:0 0 14px;
  max-width:620px;
}
.sh-cards-preview-meta{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  flex-wrap:wrap;
}
.sh-cards-preview-meta b{
  font-family:var(--cond);
  font-size:18px;
  font-weight:700;
  text-transform:uppercase;
}
.sh-cards-preview-btns{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.sh-cards-hero-right{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:6px;
  padding:12px;
}
.sh-cards-live-label{
  font-family:var(--cond);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.032em;
  text-transform:uppercase;
  color:var(--dim);
  margin-bottom:8px;
}

.sh-pcard-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(245px,1fr));
  gap:12px;
}
.sh-pcard-item{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:6px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  cursor:pointer;
  transition:border-color .15s;
}
.sh-pcard-item:hover{
  border-color:var(--line2);
}
.sh-pcard-item.is-prev{
  border-color:var(--acc);
}
.sh-pcard-item.is-eq{
  border-color:var(--green);
}
.sh-pcard-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:8px 12px;
  border-bottom:1px solid var(--line);
  background:var(--bg2);
}
.sh-pcard-tier{
  font-family:var(--cond);
  font-size:11px;
  font-weight:700;
  letter-spacing:.032em;
  text-transform:uppercase;
  padding:2px 7px;
  border-radius:3px;
  background:rgba(255,255,255,.04);
  color:var(--tc,var(--muted));
  border-left:2px solid var(--tc,var(--muted));
}
.sh-pcard-code{
  font-size:11px;
  color:var(--dim);
}
.sh-pcard-stage{
  padding:14px 12px;
  display:flex;
  justify-content:center;
  background:#0b0c0f;
  border-bottom:1px solid var(--line);
}
.pcard.pcard-mini{
  width:176px;
  flex:0 0 176px;
  pointer-events:none;
  animation:none;
}
.pcard.pcard-mini .bn{height:50px}
.pcard.pcard-mini .big{width:58px;height:58px;font-size:24px;margin-top:-32px}
.pcard.pcard-mini .pname{font-size:15px;margin-top:8px}
.pcard.pcard-mini .pfoot{margin-top:10px;padding:8px 10px}
.sh-pcard-body{
  padding:12px 14px 14px;
  display:flex;
  flex-direction:column;
  flex:1;
}
.sh-pcard-title{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:8px;
}
.sh-pcard-title b{
  font-family:var(--cond);
  font-size:18px;
  font-weight:700;
  text-transform:uppercase;
}
.sh-pcard-desc{
  font-size:12px;
  color:var(--muted);
  line-height:1.45;
  margin:6px 0 12px;
  flex:1;
}
.sh-pcard-actions{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:6px;
}

/* Sélecteur de carte dans la modale Personnaliser (#editModal) */
.ed-card-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:4px;
  background:var(--bg2);
  border:1px solid var(--line2);
  color:var(--text);
  font-family:var(--cond);
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
.ed-card-pill:hover{
  border-color:var(--tc,var(--acc));
}
.ed-card-pill.on{
  border-color:var(--tc,var(--acc));
  background:var(--panel2);
}
.ed-card-pill.locked{
  opacity:.65;
}
.ed-card-pill small{
  font-size:11px;
  color:var(--acc);
  margin-left:2px;
}
.ed-cp-dot{
  width:8px;
  height:8px;
  border-radius:2px;
  background:var(--tc,#7a7e87);
}
@media(max-width:760px){
  .sh-cards-hero{grid-template-columns:1fr}
}

/* Badge +N pour badges cumulés */
.pb.pb-more{
  background:rgba(255,255,255,.08);
  color:var(--muted);
  border:1px solid rgba(255,255,255,.18);
  padding:1px 6px;
  font-size:10px;
  font-family:var(--cond);
  font-weight:700;
  border-radius:3px;
  cursor:help;
  transition:all .15s ease;
}
.pb.pb-more:hover{
  background:rgba(255,255,255,.16);
  color:#fff;
  border-color:var(--acc);
}

/* Bannière développeur dans la boutique */
.sh-cards-dev-banner{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  margin-bottom:14px;
  background:linear-gradient(90deg,rgba(239,68,68,.15),rgba(15,23,42,.7));
  border:1px solid rgba(239,68,68,.4);
  border-left:3px solid #ef4444;
  border-radius:6px;
  font-size:13px;
  color:var(--text);
}

/* ---------- 8 Nouvelles Cartes de Profil CS:GO ---------- */

/* 21. Cyberpunk 2077 (Animé) */
.pcard-cs-cyberpunk{
  --cs-trim:#00f0ff;
  background:
    radial-gradient(circle at 50% 25%,rgba(0,240,255,.14),transparent 62%),
    linear-gradient(175deg,#06131c 0%,#060910 65%,#0d1e2e 100%)!important;
  border:1px solid #00c4d6!important;
  box-shadow:inset 0 1px 0 #00f0ff,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(0,240,255,.15);
}
.pcard-cs-cyberpunk .big{border-color:#00f0ff!important;box-shadow:0 0 0 1px #00f0ff,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-cyberpunk .pname{color:#d6f9ff;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-cyberpunk .pfoot{background:rgba(5,12,18,.94);border-top-color:rgba(0,240,255,.35)}

/* 22. Outrun Synthwave (Animé) */
.pcard-cs-retrowave{
  --cs-trim:#ff2a85;
  background:
    radial-gradient(circle at 50% 30%,rgba(255,42,133,.16),transparent 64%),
    linear-gradient(180deg,#1f0a1c 0%,#0e0714 60%,#200829 100%)!important;
  border:1px solid #c2185b!important;
  box-shadow:inset 0 1px 0 #ff2a85,inset 0 -1px 0 #8b5cf6,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(255,42,133,.15);
}
.pcard-cs-retrowave .big{border-color:#ff2a85!important;box-shadow:0 0 0 1px #ff2a85,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-retrowave .pname{color:#ffe4f1;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-retrowave .pfoot{background:rgba(18,7,24,.94);border-top-color:rgba(255,42,133,.35)}

/* 23. Zone Toxique (Animé) */
.pcard-cs-toxic{
  --cs-trim:#39ff14;
  background:
    radial-gradient(circle at 50% 28%,rgba(57,255,20,.12),transparent 60%),
    linear-gradient(165deg,#091a0c 0%,#060e07 65%,#0f2b12 100%)!important;
  border:1px solid #28b812!important;
  box-shadow:inset 0 1px 0 #39ff14,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(57,255,20,.15);
}
.pcard-cs-toxic .big{border-color:#39ff14!important;box-shadow:0 0 0 1px #39ff14,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-toxic .pname{color:#e4ffe0;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-toxic .pfoot{background:rgba(8,18,9,.94);border-top-color:rgba(57,255,20,.35)}

/* 24. Zéro Absolu (Animé) */
.pcard-cs-frost{
  --cs-trim:#70d6ff;
  background:
    radial-gradient(circle at 50% 20%,rgba(112,214,255,.15),transparent 62%),
    linear-gradient(175deg,#0a1724 0%,#060d15 65%,#10273d 100%)!important;
  border:1px solid #38bdf8!important;
  box-shadow:inset 0 1px 0 #70d6ff,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(112,214,255,.15);
}
.pcard-cs-frost .big{border-color:#70d6ff!important;box-shadow:0 0 0 1px #70d6ff,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-frost .pname{color:#e6f7ff;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-frost .pfoot{background:rgba(8,17,26,.94);border-top-color:rgba(112,214,255,.35)}

/* 25. Serpent de Feu (Animé) */
.pcard-cs-fire_serpent{
  --cs-trim:#ff5400;
  background:
    radial-gradient(circle at 50% 32%,rgba(255,84,0,.16),transparent 65%),
    linear-gradient(165deg,#240c06 0%,#120603 65%,#301007 100%)!important;
  border:1px solid #d94300!important;
  box-shadow:inset 0 1px 0 #ff5400,inset 0 -1px 0 #ffaa00,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(255,84,0,.15);
}
.pcard-cs-fire_serpent .big{border-color:#ff5400!important;box-shadow:0 0 0 1px #ff5400,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-fire_serpent .pname{color:#ffe8db;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-fire_serpent .pfoot{background:rgba(22,9,5,.94);border-top-color:rgba(255,84,0,.38)}

/* 26. Hyperdrive Warp (Animé) */
.pcard-cs-hyperdrive{
  --cs-trim:#b388ff;
  background:
    radial-gradient(circle at 50% 25%,rgba(179,136,255,.16),transparent 62%),
    linear-gradient(175deg,#140b2b 0%,#080512 65%,#221045 100%)!important;
  border:1px solid #9c27b0!important;
  box-shadow:inset 0 1px 0 #b388ff,inset 0 -1px 0 #3b82f6,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(179,136,255,.15);
}
.pcard-cs-hyperdrive .big{border-color:#b388ff!important;box-shadow:0 0 0 1px #b388ff,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-hyperdrive .pname{color:#f3ebff;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-hyperdrive .pfoot{background:rgba(14,8,26,.94);border-top-color:rgba(179,136,255,.35)}

/* 27. Matière Noire (Animé) */
.pcard-cs-dark_matter{
  --cs-trim:#a855f7;
  background:
    radial-gradient(circle at 50% 28%,#040208 0%,rgba(168,85,247,.16) 40%,#0d0617 72%)!important;
  border:1px solid #7e22ce!important;
  box-shadow:inset 0 1px 0 #a855f7,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(168,85,247,.15);
}
.pcard-cs-dark_matter .big{border-color:#c084fc!important;box-shadow:0 0 0 1px #c084fc,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-dark_matter .pname{color:#f5e8ff;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-dark_matter .pfoot{background:rgba(12,6,20,.94);border-top-color:rgba(168,85,247,.38)}

/* 28. Lingot Pur 24K (Animé) */
.pcard-cs-gold_ingot{
  --cs-trim:#ffd700;
  background:
    linear-gradient(135deg,rgba(255,215,0,.1) 0%,transparent 40%,rgba(255,215,0,.06) 100%),
    linear-gradient(165deg,#261f08 0%,#130f04 60%,#302609 100%)!important;
  border:1px solid #d4af37!important;
  box-shadow:inset 0 1px 0 #ffd700,inset 0 -1px 0 #ffd700,0 8px 24px rgba(0,0,0,.5),0 0 0 1px rgba(255,215,0,.15);
}
.pcard-cs-gold_ingot .big{border-color:#ffd700!important;box-shadow:0 0 0 1px #ffd700,0 4px 12px rgba(0,0,0,.6)}
.pcard-cs-gold_ingot .pname{color:#fff9db;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.pcard-cs-gold_ingot .pfoot{background:rgba(22,17,6,.94);border-top-color:rgba(255,215,0,.45)}

/* Animations Cartes & SVG */
@keyframes pcardBlink{
  0%,100%{opacity:.3;transform:scale(.9)}
  50%{opacity:1;transform:scale(1.2)}
}
.pcard-svg-blink{
  animation:pcardBlink 2.4s ease-in-out infinite;
}
@keyframes pcardPulseGlow{
  0%,100%{filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
  50%{filter:drop-shadow(0 2px 4px rgba(0,0,0,.6)) drop-shadow(0 0 6px color-mix(in srgb,var(--cs-trim,#f59e0b) 50%,transparent))}
}
.pcard-svg-pulse{
  animation:pcardPulseGlow 3s ease-in-out infinite;
}
@keyframes pcardRotateRay{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
.pcard-svg-spin{
  transform-origin:center;
  animation:pcardRotateRay 16s linear infinite;
}

/* ---------- Steam Profile Backgrounds System ---------- */
#profile{
  position:relative;
  transition:all .25s ease;
}

#profile[data-profile-bg]:not([data-profile-bg="none"]):not([data-profile-bg="default"]){
  position:relative;
  padding:18px;
  background:rgba(8,10,14,.45);
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 20px 60px rgba(0,0,0,.55);
  overflow:hidden;
}

#profile[data-profile-bg]:not([data-profile-bg="none"]) > *:not(.p-steam-bg){
  position:relative;
  z-index:2;
}

#profile[data-profile-bg]:not([data-profile-bg="none"]) .p-hero,
#profile[data-profile-bg]:not([data-profile-bg="none"]) .tile,
#profile[data-profile-bg]:not([data-profile-bg="none"]) .card,
#profile[data-profile-bg]:not([data-profile-bg="none"]) .hist-card{
  background:rgba(14,18,25,.82)!important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-color:rgba(255,255,255,.1)!important;
  box-shadow:0 8px 32px rgba(0,0,0,.35);
}

.p-steam-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:1;
  overflow:hidden;
  border-radius:inherit;
}

.p-steam-bg .pbg-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

/* 1. Cyber City */
.p-steam-bg-cyber_city .pbg-sky{
  background:linear-gradient(180deg,#050711 0%,#0d1226 55%,#1d102e 100%);
}
.p-steam-bg-cyber_city .pbg-city-skyline{
  display:flex;
  align-items:flex-end;
}
.p-steam-bg-cyber_city .pbg-city-skyline svg{
  width:100%;
  height:70%;
  display:block;
}
.p-steam-bg-cyber_city .pbg-rain{
  background:repeating-linear-gradient(175deg,rgba(6,182,212,.12) 0px,transparent 2px,transparent 24px);
  animation:rainStream 1.2s linear infinite;
}
.p-steam-bg-cyber_city .pbg-hologlow{
  background:radial-gradient(circle at 20% 25%,rgba(6,182,212,.18),transparent 45%),
              radial-gradient(circle at 80% 30%,rgba(236,72,153,.18),transparent 45%);
}

/* 2. Deep Cosmos */
.p-steam-bg-deep_cosmos .pbg-nebula{
  background:
    radial-gradient(ellipse at 25% 25%,rgba(139,92,246,.28),transparent 55%),
    radial-gradient(ellipse at 80% 70%,rgba(59,130,246,.22),transparent 55%),
    radial-gradient(ellipse at 65% 35%,rgba(236,72,153,.18),transparent 50%),
    #05060b;
}
.p-steam-bg-deep_cosmos .pbg-stars svg{
  width:100%;
  height:100%;
}
.p-steam-bg-deep_cosmos .pbg-cosmic-glow{
  background:radial-gradient(circle at 50% 50%,rgba(124,58,237,.12),transparent 70%);
  animation:cosmicBreathe 6s ease-in-out infinite alternate;
}

/* 3. Matrix Code */
.p-steam-bg-matrix_code{
  background:#030804;
}
.p-steam-bg-matrix_code .pbg-matrix-rain{
  background:
    repeating-linear-gradient(180deg,rgba(34,197,94,.15) 0 2px,transparent 2px 20px),
    repeating-linear-gradient(90deg,rgba(34,197,94,.04) 0 18px,transparent 18px 20px);
  animation:matrixScan 4s linear infinite;
}
.p-steam-bg-matrix_code .pbg-matrix-overlay{
  background:radial-gradient(ellipse at center,transparent 40%,rgba(3,8,4,.85) 100%),
              linear-gradient(180deg,rgba(34,197,94,.1),transparent 30%,transparent 70%,rgba(34,197,94,.1));
}

/* 4. Frost Glacier */
.p-steam-bg-frost_glacier .pbg-ice-gradient{
  background:linear-gradient(180deg,#06111e 0%,#081829 50%,#0c253d 100%);
}
.p-steam-bg-frost_glacier .pbg-snowflakes{
  background-image:
    radial-gradient(2px 2px at 20px 30px,#ffffff,rgba(0,0,0,0)),
    radial-gradient(2px 2px at 40px 70px,rgba(255,255,255,.8),rgba(0,0,0,0)),
    radial-gradient(1.5px 1.5px at 90px 40px,#e0f2fe,rgba(0,0,0,0)),
    radial-gradient(2px 2px at 160px 120px,rgba(224,242,254,.7),rgba(0,0,0,0));
  background-repeat:repeat;
  background-size:200px 200px;
  animation:snowDrift 14s linear infinite;
}
.p-steam-bg-frost_glacier .pbg-frost-mist{
  background:radial-gradient(ellipse at 50% 100%,rgba(56,189,248,.22),transparent 70%);
  animation:mistPulse 5s ease-in-out infinite alternate;
}

/* 5. Hyper Grid (Interactive) */
.p-steam-bg-hyper_grid{
  background:#0a0514;
}
.p-steam-bg-hyper_grid .pbg-synth-sun{
  position:absolute;
  top:15%;
  left:50%;
  width:180px;
  height:180px;
  border-radius:50%;
  background:linear-gradient(180deg,#ff007f 0%,#facc15 100%);
  box-shadow:0 0 32px rgba(255,0,127,.25),0 0 64px rgba(250,204,21,.15);
  transform:translate(calc(-50% + var(--pbg-px, 0px) * -16px),calc(var(--pbg-py, 0px) * -10px));
  transition:transform .1s ease-out;
}
.p-steam-bg-hyper_grid .pbg-synth-grid{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:60%;
  background:
    linear-gradient(180deg,transparent 0%,#0a0514 100%),
    repeating-linear-gradient(90deg,rgba(236,72,153,.3) 0 2px,transparent 2px 40px),
    repeating-linear-gradient(0deg,rgba(6,182,212,.3) 0 2px,transparent 2px 30px);
  transform:perspective(300px) rotateX(60deg);
  transform-origin:center bottom;
  animation:synthGridMove 6s linear infinite;
}
.p-steam-bg-hyper_grid .pbg-synth-horizon{
  position:absolute;
  top:40%;
  left:0;
  width:100%;
  height:2px;
  background:#ff007f;
  box-shadow:0 0 12px rgba(255,0,127,.35),0 0 24px rgba(6,182,212,.2);
}

/* 6. Magma Forge */
.p-steam-bg-magma_forge .pbg-lava-gradient{
  background:linear-gradient(180deg,#120603 0%,#1f0b06 60%,#360f06 100%);
}
.p-steam-bg-magma_forge .pbg-magma-embers{
  background-image:
    radial-gradient(2px 2px at 30px 50px,#ff5400,transparent),
    radial-gradient(3px 3px at 80px 120px,#ffaa00,transparent),
    radial-gradient(2px 2px at 140px 70px,#ef4444,transparent),
    radial-gradient(2.5px 2.5px at 190px 140px,#f97316,transparent);
  background-repeat:repeat;
  background-size:220px 220px;
  animation:embersRise 8s linear infinite;
}
.p-steam-bg-magma_forge .pbg-heat-distortion{
  background:radial-gradient(ellipse at 50% 100%,rgba(255,84,0,.28),transparent 60%);
  animation:heatPulse 4s ease-in-out infinite alternate;
}

/* 7. Aurora Sky */
.p-steam-bg-aurora_sky .pbg-aurora-ribbons{
  background:
    radial-gradient(ellipse at 35% 0%,rgba(52,211,153,.35) 0%,transparent 60%),
    radial-gradient(ellipse at 65% 10%,rgba(56,189,248,.3) 0%,transparent 60%),
    radial-gradient(ellipse at 50% 25%,rgba(167,139,250,.25) 0%,transparent 60%),
    linear-gradient(180deg,#050c14 0%,#071520 100%);
  animation:auroraCurtain 8s ease-in-out infinite alternate;
}
.p-steam-bg-aurora_sky .pbg-aurora-stars{
  background-image:
    radial-gradient(1.5px 1.5px at 25px 25px,#fff,transparent),
    radial-gradient(2px 2px at 75px 65px,rgba(255,255,255,.9),transparent),
    radial-gradient(1.2px 1.2px at 150px 110px,#a7f3d0,transparent);
  background-repeat:repeat;
  background-size:240px 240px;
}

/* 8. Quantum Field (Interactive) */
.p-steam-bg-quantum_field{
  background:#06050e;
}
.p-steam-bg-quantum_field .pbg-quantum-glow{
  background:radial-gradient(circle at var(--pbg-mx, 50%) var(--pbg-my, 50%),rgba(168,85,247,.35) 0%,rgba(59,130,246,.15) 35%,transparent 65%);
  transition:background-position .1s ease-out;
}
.p-steam-bg-quantum_field .pbg-quantum-particles{
  background-image:
    radial-gradient(2px 2px at 30px 40px,#c084fc,transparent),
    radial-gradient(2.5px 2.5px at 110px 80px,#60a5fa,transparent),
    radial-gradient(1.5px 1.5px at 170px 140px,#f472b6,transparent);
  background-repeat:repeat;
  background-size:200px 200px;
  transform:translate(calc(var(--pbg-px, 0px) * 14px),calc(var(--pbg-py, 0px) * 10px));
  transition:transform .1s ease-out;
}

/* 9. Bubble Ambient (Interactive) */
.p-steam-bg-bubble_ambient .pbg-bubble-gradient{
  background:linear-gradient(180deg,#080d1a 0%,#0d162b 55%,#18223d 100%);
}
.pbg-bubbles-container{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}
.pbg-bubble{
  position:absolute;
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.45) 0%,rgba(56,189,248,.25) 45%,rgba(168,85,247,.15) 80%,transparent 100%);
  border:1px solid rgba(255,255,255,.35);
  box-shadow:inset 0 0 15px rgba(255,255,255,.3),0 0 25px rgba(56,189,248,.25);
  animation:floatBubble 12s ease-in-out infinite;
}
.pbg-bubble.b1{width:90px;height:90px;left:10%;bottom:-50px;animation-duration:11s;animation-delay:0s}
.pbg-bubble.b2{width:140px;height:140px;left:35%;bottom:-80px;animation-duration:15s;animation-delay:2s}
.pbg-bubble.b3{width:70px;height:70px;left:65%;bottom:-40px;animation-duration:9s;animation-delay:4s}
.pbg-bubble.b4{width:110px;height:110px;left:82%;bottom:-60px;animation-duration:13s;animation-delay:1s}
.pbg-bubble.b5{width:50px;height:50px;left:24%;bottom:-30px;animation-duration:8s;animation-delay:3s}
.pbg-bubble.b6{width:125px;height:125px;left:52%;bottom:-70px;animation-duration:14s;animation-delay:5s}

/* 10. Dragon's Lair */
.p-steam-bg-dragons_lair .pbg-dragon-scales{
  background:
    radial-gradient(circle at 50% 50%,rgba(239,68,68,.08) 0%,transparent 70%),
    repeating-linear-gradient(45deg,#140706 0 12px,#1a0a09 12px 24px);
}
.p-steam-bg-dragons_lair .pbg-dragon-eyes{
  position:absolute;
  top:24%;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:70px;
}
.dragon-eye{
  width:32px;
  height:12px;
  background:radial-gradient(ellipse at center,#ffd700 0%,#ff5400 65%,transparent 100%);
  border-radius:50%;
  box-shadow:0 0 14px rgba(255,84,0,.4),0 0 28px rgba(255,0,0,.2);
  animation:dragonBlink 5s infinite;
}
.p-steam-bg-dragons_lair .pbg-dragon-glow{
  background:radial-gradient(ellipse at 50% 30%,rgba(255,84,0,.22),transparent 60%);
}

/* 11. Golden Dynasty */
.p-steam-bg-golden_dynasty .pbg-gold-sweep{
  background:
    linear-gradient(135deg,rgba(255,215,0,.06) 0%,transparent 40%,rgba(255,215,0,.12) 60%,transparent 100%),
    linear-gradient(180deg,#141005 0%,#1f1807 55%,#2a200a 100%);
  animation:goldShimmer 7s linear infinite;
}
.p-steam-bg-golden_dynasty .pbg-gold-pattern{
  background-image:
    repeating-linear-gradient(45deg,rgba(255,215,0,.04) 0 2px,transparent 2px 20px),
    repeating-linear-gradient(-45deg,rgba(255,215,0,.04) 0 2px,transparent 2px 20px);
}

/* 12. Default Vignette */
.p-steam-bg-default .pbg-default-vignette{
  background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.04),transparent 70%);
}

/* Background Keyframes */
@keyframes rainStream{
  from{background-position:0 0}
  to{background-position:-20px 200px}
}
@keyframes cosmicBreathe{
  0%{transform:scale(1);opacity:.8}
  100%{transform:scale(1.08);opacity:1}
}
@keyframes matrixScan{
  0%{background-position:0 0}
  100%{background-position:0 400px}
}
@keyframes snowDrift{
  0%{background-position:0 0}
  100%{background-position:60px 200px}
}
@keyframes mistPulse{
  0%{opacity:.6;transform:scaleY(.95)}
  100%{opacity:1;transform:scaleY(1.05)}
}
@keyframes synthGridMove{
  0%{background-position:0 0}
  100%{background-position:0 40px}
}
@keyframes embersRise{
  0%{background-position:0 0}
  100%{background-position:-30px -220px}
}
@keyframes heatPulse{
  0%{opacity:.7}
  100%{opacity:1}
}
@keyframes auroraCurtain{
  0%{transform:scale(1) translateY(0);filter:hue-rotate(0deg)}
  50%{transform:scale(1.04) translateY(-10px);filter:hue-rotate(25deg)}
  100%{transform:scale(1) translateY(0);filter:hue-rotate(0deg)}
}
@keyframes floatBubble{
  0%{transform:translateY(0) translateX(0) scale(.9);opacity:0}
  10%{opacity:.8}
  90%{opacity:.8}
  100%{transform:translateY(-500px) translateX(30px) scale(1.1);opacity:0}
}
@keyframes dragonBlink{
  0%,45%,55%,100%{transform:scaleY(1)}
  50%{transform:scaleY(.08)}
}
@keyframes goldShimmer{
  0%{background-position:0 0,0 0}
  100%{background-position:600px 300px,0 0}
}

/* Boutique : Onglet Fonds de profil Steam */
.sh-bgs-hero{
  position:relative;
  border-radius:8px;
  overflow:hidden;
  border:1px solid var(--line);
  margin-bottom:20px;
  background:#0d1117;
  box-shadow:0 16px 40px rgba(0,0,0,.4);
}
.sh-bgs-hero-stage{
  position:relative;
  min-height:280px;
  width:100%;
}
.sh-bgs-hero-stage > .p-steam-bg{
  position:absolute;
  inset:0;
  z-index:1;
}
.sh-bgs-hero-content{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) 280px;
  gap:24px;
  padding:24px 28px;
  background:linear-gradient(90deg,rgba(13,17,23,.95) 0%,rgba(13,17,23,.85) 65%,rgba(13,17,23,.45) 100%);
  backdrop-filter:blur(10px);
}
.sh-bgs-hero-right{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:rgba(10,12,16,.75);
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  padding:16px 20px;
  backdrop-filter:blur(12px);
}
.sh-bgs-mini-profile{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-align:center;
}
.sh-bgs-mini-profile b{
  font-family:var(--cond);
  font-size:18px;
  font-weight:700;
  text-transform:uppercase;
}
.sh-bg-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:14px;
}
.sh-bg-item{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  cursor:pointer;
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.sh-bg-item:hover{
  transform:translateY(-2px);
  border-color:var(--line2);
  box-shadow:0 8px 24px rgba(0,0,0,.3);
}
.sh-bg-item.is-prev{
  border-color:var(--acc);
  box-shadow:0 0 0 1px var(--acc),0 8px 24px rgba(var(--acc-rgb),.2);
}
.sh-bg-item.is-eq{
  border-color:var(--green);
}
.sh-bg-thumb-wrap{
  position:relative;
  height:140px;
  background:#090b10;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.sh-bg-thumb-stage{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
}
.sh-bg-thumb-stage .p-steam-bg{
  position:absolute;
  inset:0;
  border-radius:0;
}
.sh-bg-tag{
  position:absolute;
  top:8px;
  left:8px;
  z-index:3;
  font-family:var(--cond);
  font-size:11px;
  font-weight:700;
  letter-spacing:.032em;
  text-transform:uppercase;
  padding:2px 7px;
  border-radius:3px;
  background:rgba(10,12,16,.85);
  color:var(--tc,var(--muted));
  border-left:2px solid var(--tc,var(--muted));
  backdrop-filter:blur(4px);
}
.sh-bg-inter-pill{
  position:absolute;
  bottom:8px;
  right:8px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:2px 8px;
  border-radius:3px;
  font-family:var(--cond);
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  background:rgba(236,72,153,.2);
  color:#f472b6;
  border:1px solid rgba(236,72,153,.5);
  backdrop-filter:blur(4px);
}

@media(max-width:760px){
  .sh-bgs-hero-content{
    grid-template-columns:1fr;
  }
}



/* =====================================================
   CONTOURS & CADRES DE PHOTO DE PROFIL (AVATAR FRAMES)
   ===================================================== */
/* Cadres d'avatar style CS:GO sobre et net (sans lueur néon invasive) */
.avatar.av-frame {
  position: relative;
  box-shadow: 0 0 0 1.5px #0a0c10, 0 0 0 3px var(--frame-col, #38bdf8);
}
.p-av.av-frame {
  position: relative;
  box-shadow: 0 0 0 2px #0a0c10, 0 0 0 4px var(--frame-col, #38bdf8) !important;
  border-color: #0a0c10 !important;
}

/* Couleurs spécifiques de chaque cadre (34 modèles) */
.av-frame-carbon { --frame-col: #8b95a5; --frame-glow: rgba(139,149,165,.5); }
.av-frame-radar { --frame-col: #3fcf8e; --frame-glow: rgba(63,207,142,.6); }
.av-frame-damascus { --frame-col: #6085a8; --frame-glow: rgba(96,133,168,.5); }
.av-frame-tiger { --frame-col: #d97724; --frame-glow: rgba(217,119,36,.55); }
.av-frame-asiimov { --frame-col: #e05a2b; --frame-glow: rgba(224,90,43,.6); }
.av-frame-printstream { --frame-col: #e2e5ec; --frame-glow: rgba(226,229,236,.65); }
.av-frame-gungnir { --frame-col: #5ca8e6; --frame-glow: rgba(92,168,230,.6); }
.av-frame-sakura { --frame-col: #f48fb1; --frame-glow: rgba(244,143,177,.65); }
.av-frame-aurora { --frame-col: #46c9a7; --frame-glow: rgba(70,201,167,.65); }
.av-frame-legion { --frame-col: #d4a024; --frame-glow: rgba(212,160,36,.6); }
.av-frame-cyberpunk { --frame-col: #00f0ff; --frame-glow: rgba(0,240,255,.7); }
.av-frame-emerald { --frame-col: #2ec27e; --frame-glow: rgba(46,194,126,.6); }
.av-frame-retrowave { --frame-col: #ff2a85; --frame-glow: rgba(255,42,133,.7); }
.av-frame-ruby { --frame-col: #d6384c; --frame-glow: rgba(214,56,76,.6); }
.av-frame-toxic { --frame-col: #39ff14; --frame-glow: rgba(57,255,20,.7); }
.av-frame-storm { --frame-col: #60a5fa; --frame-glow: rgba(96,165,250,.7); }
.av-frame-frost { --frame-col: #70d6ff; --frame-glow: rgba(112,214,255,.7); }
.av-frame-magma { --frame-col: #f97316; --frame-glow: rgba(249,115,22,.7); }
.av-frame-fire_serpent { --frame-col: #ff5400; --frame-glow: rgba(255,84,0,.7); }
.av-frame-oni { --frame-col: #f43f5e; --frame-glow: rgba(244,63,94,.7); }
.av-frame-howl { --frame-col: #ef4444; --frame-glow: rgba(239,68,68,.7); }
.av-frame-hyperdrive { --frame-col: #b388ff; --frame-glow: rgba(179,136,255,.7); }
.av-frame-dragon { --frame-col: #e5b53b; --frame-glow: rgba(229,181,59,.7); }
.av-frame-dark_matter { --frame-col: #a855f7; --frame-glow: rgba(168,85,247,.75); }
.av-frame-singularity { --frame-col: #f59e0b; --frame-glow: rgba(245,158,11,.75); }
.av-frame-gold_ingot { --frame-col: #ffd700; --frame-glow: rgba(255,215,0,.75); }
.av-frame-sovereign { --frame-col: #f2c14e; --frame-glow: rgba(242,193,78,.75); }
.av-frame-blood_moon { --frame-col: #e11d48; --frame-glow: rgba(225,29,72,.75); }
.av-frame-mecha_industry { --frame-col: #f97316; --frame-glow: rgba(249,115,22,.65); }
.av-frame-void_walker { --frame-col: #6366f1; --frame-glow: rgba(99,102,241,.75); }
.av-frame-solar_flare { --frame-col: #f59e0b; --frame-glow: rgba(245,158,11,.75); }
.av-frame-neon_tokyo { --frame-col: #ec4899; --frame-glow: rgba(236,72,153,.75); }
.av-frame-case_hardened { --frame-col: #0284c7; --frame-glow: rgba(2,132,199,.75); }

/* Profil : La Carte de Profil habille le bloc d'identité (Hero, Bannière et PDP) */
.p-hero[class*="pcard-cs-"]:not(.pcard-cs-default) {
  position: relative;
  border-radius: 12px !important;
  border: 1px solid var(--cs-trim, var(--line2)) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(var(--acc-rgb), .2), inset 0 1px 0 var(--cs-trim) !important;
  overflow: hidden;
  margin-bottom: 16px;
  background: var(--panel);
}

.p-hero[class*="pcard-cs-"]:not(.pcard-cs-default) .p-banner {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.p-hero[class*="pcard-cs-"]:not(.pcard-cs-default) .p-banner::after {
  background: linear-gradient(0deg, rgba(14, 18, 25, 0.95) 0%, rgba(14, 18, 25, 0.6) 40%, rgba(13, 17, 23, 0) 100%) !important;
}

/* Profil CS:GO Card Container */
.p-hero[class*="pcard-cs-"]:not(.pcard-cs-default) .p-row {
  position: relative;
  z-index: 2;
}

/* Bannière de profil : Conteneurs anti-superposition */
.p-banner-badges {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 10;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  max-width: 48%;
}

.p-banner-badges .btn,
.p-banner-badges .back,
.p-banner-badges .dev-plaque,
.p-banner-badges .p-hero-card-badge {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
}

.p-banner-actions {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 10;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  max-width: 50%;
  justify-content: flex-end;
}

.p-banner-actions .btn,
.p-banner-actions .pro-plaque {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  white-space: nowrap;
}

.p-banner-actions .btn,
.p-banner-badges .btn {
  background: var(--panel2);
  border: 1px solid var(--line2);
  color: var(--text);
}

.p-banner-actions .btn:hover,
.p-banner-badges .btn:hover {
  background: var(--panel3);
  border-color: var(--acc);
}

@media (max-width: 720px) {
  .p-banner {
    height: auto !important;
    min-height: 140px;
    padding: 10px 10px 58px !important;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .p-banner-badges, .p-banner-actions {
    position: static !important;
    max-width: 100% !important;
  }
  .p-banner-actions {
    justify-content: flex-start;
  }
}

/* ---------- SLIDER DISCORD DE CARTES EN LONG (LIGUES & MONDE) ---------- */
.lg-slider-section {
  margin-bottom: 18px;
  background: rgba(10, 12, 16, 0.5);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px 16px;
}
.lg-slider-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  flex-wrap: wrap;
  gap: 8px;
}
.lg-slider-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--cond);
  font-size: 13.5px;
  font-weight:700;
  letter-spacing:.032em;
  text-transform: uppercase;
  color: var(--acc);
}
.lg-slider-header small {
  color: var(--muted);
  font-size: 12px;
}
.lg-cards-slider {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 8px;
  scrollbar-width: thin;
}
.dc-card {
  flex: 0 0 240px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
  position: relative;
}
.dc-card:hover {
  transform: translateY(-3px);
  border-color: var(--tc, var(--line2));
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}
.dc-card.is-me {
  border-color: var(--acc);
  box-shadow: 0 0 0 1px var(--acc);
}
.dc-card-top {
  height: 52px;
  position: relative;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid var(--line);
}
.dc-card-top::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 0%, rgba(13, 17, 23, 0.75) 100%);
}
.dc-rank-pill {
  position: absolute;
  top: 6px;
  left: 8px;
  z-index: 2;
  font-family: var(--cond);
  font-size: 11px;
  font-weight:700;
  background: rgba(0, 0, 0, 0.8);
  padding: 1px 6px;
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.15);
}
.dc-card-tag {
  position: absolute;
  top: 6px;
  right: 8px;
  z-index: 2;
  font-family: var(--cond);
  font-size: 10px;
  font-weight:700;
  text-transform: uppercase;
  background: rgba(0, 0, 0, 0.8);
  color: var(--tc, #8b95a5);
  border-left: 2px solid var(--tc, #8b95a5);
  padding: 1px 6px;
  border-radius: 2px;
}
.dc-card-body {
  padding: 0 12px 12px;
  display: flex;
  flex-direction: column;
  position: relative;
}
.dc-card-av-slot {
  margin-top: -24px;
  margin-bottom: 8px;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
}
.dc-card-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dc-card-name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--cond);
  font-size: 16px;
  font-weight:700;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dc-card-badges {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  min-height: 20px;
}
.dc-card-score {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.dc-elo {
  font-family: var(--cond);
  font-weight:700;
  color: var(--text);
}

/* Bannière promotionnelle Boutique */
.sh-promo-banner {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.15);
  background: linear-gradient(135deg, #0e1320 0%, #151024 60%, #1c0f1e 100%);
  padding: 22px 24px;
  margin-bottom: 20px;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.sh-promo-banner .sh-pb-content {
  position: relative;
  z-index: 2;
  max-width: 720px;
}
.sh-promo-banner h2 {
  font-family: var(--cond);
  font-size: 24px;
  font-weight:700;
  text-transform: uppercase;
  letter-spacing:.012em;
  margin: 6px 0 8px;
}
.sh-promo-banner p {
  color: var(--muted);
  font-size: 13.5px;
  line-height: 1.5;
  margin: 0 0 14px;
}
.sh-pb-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.sh-cat-tag {
  font-size: 9.5px;
  font-weight: 800;
  background: var(--acc);
  color: #120e06;
  padding: 1px 5px;
  border-radius: 3px;
  margin-left: 4px;
  letter-spacing: .05em;
  vertical-align: middle;
}

/* ---------- 6 NOUVELLES CARTES DE PROFIL ---------- */

/* 29. Lune de Sang (Animé) */
.pcard-cs-blood_moon {
  --cs-trim: #e11d48;
  background:
    radial-gradient(circle at 50% 25%, rgba(225, 29, 72, 0.16), transparent 62%),
    linear-gradient(175deg, #1f070e 0%, #0d0407 65%, #260a12 100%) !important;
  border: 1px solid #be123c !important;
  box-shadow: inset 0 1px 0 #e11d48, 0 8px 24px rgba(0,0,0,.5), 0 0 0 1px rgba(225, 29, 72, 0.15);
}
.pcard-cs-blood_moon .big { border-color: #e11d48 !important; box-shadow: 0 0 0 1px #e11d48, 0 4px 12px rgba(0,0,0,.6); }
.pcard-cs-blood_moon .pname { color: #ffe4e6; text-shadow: 0 1px 2px rgba(0,0,0,.85); }
.pcard-cs-blood_moon .pfoot { background: rgba(18, 5, 10, 0.94); border-top-color: rgba(225, 29, 72, 0.38); }

/* 30. Mecha Industrie */
.pcard-cs-mecha_industry {
  --cs-trim: #f97316;
  background:
    linear-gradient(135deg, #18191f 0%, #0f1015 60%, #1f222b 100%) !important;
  border: 1px solid #ea580c !important;
  box-shadow: inset 0 2px 0 #f97316, inset 0 -1px 0 rgba(255,255,255,.15), 0 8px 24px rgba(0,0,0,.5);
}
.pcard-cs-mecha_industry .big { border-color: #f97316 !important; box-shadow: 0 0 0 1px #f97316, 0 4px 12px rgba(0,0,0,.6); }
.pcard-cs-mecha_industry .pname { color: #ffedd5; text-shadow: 0 1px 2px rgba(0,0,0,.85); }
.pcard-cs-mecha_industry .pfoot { background: rgba(15, 16, 20, 0.94); border-top-color: rgba(249, 115, 22, 0.4); }

/* 31. Marcheur du Néant (Animé) */
.pcard-cs-void_walker {
  --cs-trim: #6366f1;
  background:
    radial-gradient(circle at 50% 28%, rgba(99, 102, 241, 0.16), transparent 64%),
    linear-gradient(175deg, #0e0d24 0%, #070614 65%, #151336 100%) !important;
  border: 1px solid #4f46e5 !important;
  box-shadow: inset 0 1px 0 #6366f1, 0 8px 24px rgba(0,0,0,.5), 0 0 0 1px rgba(99, 102, 241, 0.15);
}
.pcard-cs-void_walker .big { border-color: #818cf8 !important; box-shadow: 0 0 0 1px #818cf8, 0 4px 12px rgba(0,0,0,.6); }
.pcard-cs-void_walker .pname { color: #e0e7ff; text-shadow: 0 1px 2px rgba(0,0,0,.85); }
.pcard-cs-void_walker .pfoot { background: rgba(10, 9, 24, 0.94); border-top-color: rgba(99, 102, 241, 0.38); }

/* 32. Éruption Solaire (Animé) */
.pcard-cs-solar_flare {
  --cs-trim: #f59e0b;
  background:
    radial-gradient(circle at 50% 25%, rgba(245, 158, 11, 0.18), transparent 65%),
    linear-gradient(165deg, #241405 0%, #120902 65%, #301a07 100%) !important;
  border: 1px solid #d97706 !important;
  box-shadow: inset 0 1px 0 #f59e0b, 0 8px 24px rgba(0,0,0,.5), 0 0 0 1px rgba(245, 158, 11, 0.15);
}
.pcard-cs-solar_flare .big { border-color: #fbbf24 !important; box-shadow: 0 0 0 1px #fbbf24, 0 4px 12px rgba(0,0,0,.6); }
.pcard-cs-solar_flare .pname { color: #fef3c7; text-shadow: 0 1px 2px rgba(0,0,0,.85); }
.pcard-cs-solar_flare .pfoot { background: rgba(22, 11, 4, 0.94); border-top-color: rgba(245, 158, 11, 0.4); }

/* 33. Tokyo Néo-Cyber (Animé) */
.pcard-cs-neon_tokyo {
  --cs-trim: #ec4899;
  background:
    radial-gradient(circle at 30% 20%, rgba(236, 72, 153, 0.15), transparent 50%),
    radial-gradient(circle at 70% 35%, rgba(6, 182, 212, 0.15), transparent 50%),
    linear-gradient(175deg, #1a081c 0%, #080612 65%, #180924 100%) !important;
  border: 1px solid #db2777 !important;
  box-shadow: inset 0 1px 0 #ec4899, inset 0 -1px 0 #06b6d4, 0 8px 24px rgba(0,0,0,.5), 0 0 0 1px rgba(236, 72, 153, 0.15);
}
.pcard-cs-neon_tokyo .big { border-color: #ec4899 !important; box-shadow: 0 0 0 1px #ec4899, 0 4px 12px rgba(0,0,0,.6); }
.pcard-cs-neon_tokyo .pname { color: #fce7f3; text-shadow: 0 1px 2px rgba(0,0,0,.85); }
.pcard-cs-neon_tokyo .pfoot { background: rgba(18, 6, 22, 0.94); border-top-color: rgba(236, 72, 153, 0.35); }

/* 34. Cémenté Blue Gem */
.pcard-cs-case_hardened {
  --cs-trim: #0284c7;
  background:
    radial-gradient(circle at 45% 25%, rgba(56, 189, 248, 0.18), transparent 55%),
    linear-gradient(135deg, #091724 0%, #150f24 50%, #201a08 100%) !important;
  border: 1px solid #0369a1 !important;
  box-shadow: inset 0 1px 0 #0284c7, inset 0 -1px 0 #eab308, 0 8px 24px rgba(0,0,0,.5), 0 0 0 1px rgba(2, 132, 199, 0.15);
}
.pcard-cs-case_hardened .big { border-color: #38bdf8 !important; box-shadow: 0 0 0 1px #38bdf8, 0 4px 12px rgba(0,0,0,.6); }
.pcard-cs-case_hardened .pname { color: #e0f2fe; text-shadow: 0 1px 2px rgba(0,0,0,.85); }
.pcard-cs-case_hardened .pfoot { background: rgba(9, 18, 28, 0.94); border-top-color: rgba(2, 132, 199, 0.4); }

/* ---------- 6 NOUVEAUX FONDS DE PROFIL STEAM ---------- */

/* 13. Éclipse Sanglante */
.p-steam-bg-blood_eclipse .pbg-blood-sky {
  background: linear-gradient(180deg, #100306 0%, #1f070e 55%, #2a0b14 100%);
}
.p-steam-bg-blood_eclipse .pbg-blood-moon {
  position: absolute;
  top: 16%;
  left: 50%;
  transform: translateX(-50%);
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: radial-gradient(circle at center, #e11d48 0%, #881337 70%, transparent 100%);
  box-shadow: 0 0 36px rgba(225, 29, 72, 0.25), 0 0 72px rgba(225, 29, 72, 0.12);
  animation: cosmicBreathe 7s ease-in-out infinite alternate;
}
.p-steam-bg-blood_eclipse .pbg-blood-embers {
  background-image:
    radial-gradient(2px 2px at 25px 35px, #e11d48, transparent),
    radial-gradient(2.5px 2.5px at 95px 110px, #f43f5e, transparent),
    radial-gradient(1.8px 1.8px at 165px 75px, #fda4af, transparent);
  background-repeat: repeat;
  background-size: 200px 200px;
  animation: embersRise 9s linear infinite;
}

/* 14. Arcade Cyberpunk 84 */
.p-steam-bg-cyber_arcade .pbg-arcade-grid {
  background:
    repeating-linear-gradient(90deg, rgba(6, 182, 212, 0.08) 0 2px, transparent 2px 40px),
    repeating-linear-gradient(0deg, rgba(236, 72, 153, 0.08) 0 2px, transparent 2px 40px),
    #08060f;
}
.p-steam-bg-cyber_arcade .pbg-arcade-neons {
  background:
    radial-gradient(ellipse at 20% 30%, rgba(6, 182, 212, 0.22), transparent 50%),
    radial-gradient(ellipse at 80% 35%, rgba(236, 72, 153, 0.22), transparent 50%);
}
.p-steam-bg-cyber_arcade .pbg-arcade-scanlines {
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0 2px, transparent 2px 4px);
  animation: matrixScan 5s linear infinite;
}

/* 15. Aurore Boréale Boréalis HD */
.p-steam-bg-aurora_borealis_hd .pbg-hd-aurora-sky {
  background: linear-gradient(180deg, #030a0f 0%, #06151f 50%, #0a2533 100%);
}
.p-steam-bg-aurora_borealis_hd .pbg-hd-aurora-curtains {
  background:
    radial-gradient(ellipse at 30% 10%, rgba(52, 211, 153, 0.4) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 15%, rgba(56, 189, 248, 0.35) 0%, transparent 60%),
    radial-gradient(ellipse at 50% 30%, rgba(167, 139, 250, 0.25) 0%, transparent 60%);
  animation: auroraCurtain 7s ease-in-out infinite alternate;
}
.p-steam-bg-aurora_borealis_hd .pbg-hd-aurora-stars {
  background-image:
    radial-gradient(1.5px 1.5px at 30px 40px, #fff, transparent),
    radial-gradient(2px 2px at 110px 80px, #a7f3d0, transparent);
  background-repeat: repeat;
  background-size: 220px 220px;
}

/* 16. Rêve de Sakura */
.p-steam-bg-sakura_dream .pbg-sakura-night {
  background: linear-gradient(180deg, #120914 0%, #1f0e22 55%, #2d1430 100%);
}
.p-steam-bg-sakura_dream .pbg-sakura-petals {
  background-image:
    radial-gradient(3px 3px at 20px 30px, #f472b6, transparent),
    radial-gradient(4px 2px at 60px 80px, #fbcfe8, transparent),
    radial-gradient(2px 4px at 120px 50px, #f472b6, transparent),
    radial-gradient(3px 3px at 180px 140px, #fda4af, transparent);
  background-repeat: repeat;
  background-size: 200px 200px;
  animation: snowDrift 12s linear infinite;
}
.p-steam-bg-sakura_dream .pbg-sakura-glow {
  background: radial-gradient(circle at 50% 40%, rgba(244, 114, 182, 0.18), transparent 65%);
}

/* 17. Horizon des Événements */
.p-steam-bg-black_hole_event .pbg-bh-void {
  background: #040207;
}
.p-steam-bg-black_hole_event .pbg-bh-accretion {
  position: absolute;
  top: 25%;
  left: 50%;
  width: 220px;
  height: 90px;
  transform: translate(-50%, -50%) rotate(-15deg);
  border-radius: 50%;
  background: radial-gradient(ellipse at center, transparent 35%, #f59e0b 45%, #ef4444 65%, transparent 75%);
  box-shadow: 0 0 36px rgba(245, 158, 11, 0.22), 0 0 72px rgba(239, 68, 68, 0.12);
  animation: pcardRotateRay 20s linear infinite;
}
.p-steam-bg-black_hole_event .pbg-bh-lensing {
  background: radial-gradient(circle at 50% 25%, #000000 0%, #000000 18%, rgba(168, 85, 247, 0.25) 35%, transparent 65%);
}

/* 18. Dimension Glitchée (Interactif) */
.p-steam-bg-glitch_dimension {
  background: #05080c;
}
.p-steam-bg-glitch_dimension .pbg-glitch-layer1 {
  background:
    radial-gradient(circle at var(--pbg-x, 50%) var(--pbg-y, 50%), rgba(6, 182, 212, 0.28) 0%, transparent 60%);
}
.p-steam-bg-glitch_dimension .pbg-glitch-layer2 {
  background:
    repeating-linear-gradient(90deg, rgba(236, 72, 153, 0.06) 0 3px, transparent 3px 30px);
  transform: translate(calc(var(--pbg-px, 0px) * -12px), calc(var(--pbg-py, 0px) * -8px));
  transition: transform 0.1s ease-out;
}
.p-steam-bg-glitch_dimension .pbg-glitch-scan {
  background: repeating-linear-gradient(180deg, rgba(56, 189, 248, 0.08) 0 2px, transparent 2px 8px);
  animation: matrixScan 3s linear infinite;
}

/* Règle stricte : Tailles de PDP verrouillées sur toutes les invitations */
.party-invite-banner .avatar,
.party-invite-banner .pib-who .avatar,
.pib-who .avatar,
.pl-friend-left .avatar,
.fr-req-left .avatar,
.party-invite-banner img,
.pib-who img {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  max-width: 38px !important;
  max-height: 38px !important;
  border-radius: 6px !important;
  object-fit: cover !important;
  flex: 0 0 38px !important;
  overflow: hidden !important;
}

/* ---------- Section Référencement & FAQ Accessible ---------- */
.seo-hub {
  margin-top: 28px;
  margin-bottom: 24px;
}
.seo-card {
  background: #0d1017;
  background: rgba(13, 16, 23, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 24px 28px;
}
.seo-badge {
  display: inline-block;
  font-family: var(--cond);
  font-size: 11px;
  font-weight:700;
  letter-spacing:.032em;
  color: var(--acc);
  background: rgba(255, 171, 26, 0.1);
  border: 1px solid rgba(255, 171, 26, 0.25);
  padding: 3px 9px;
  border-radius: 4px;
  margin-bottom: 10px;
}
.seo-card h2 {
  font-family: var(--cond);
  font-size: 22px;
  font-weight:700;
  letter-spacing:.008em;
  color: #fff;
  margin-bottom: 8px;
}
.seo-card p {
  color: var(--muted);
  font-size: 13.5px;
  line-height: 1.6;
  max-width: 900px;
  margin-bottom: 20px;
}
.seo-features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.seo-feat {
  background: #11151f;
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  padding: 14px 16px;
}
.seo-feat h3 {
  font-family: var(--cond);
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}
.seo-feat p {
  font-size: 12.5px;
  color: var(--dim);
  margin-bottom: 0;
  line-height: 1.45;
}
.seo-faq h3 {
  font-family: var(--cond);
  font-size: 18px;
  font-weight:700;
  color: #fff;
  margin-bottom: 12px;
}
.faq-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding: 10px 0;
}
.faq-item summary {
  cursor: pointer;
  font-size: 13.5px;
  color: var(--text);
  user-select: none;
}
.faq-item summary:hover {
  color: var(--acc);
}
.faq-item p {
  margin-top: 8px;
  margin-bottom: 4px;
  font-size: 13px;
  color: var(--muted);
}
@media (max-width: 720px) {
  .seo-card {
    padding: 18px 16px;
  }
  .seo-card h2 {
    font-size: 19px;
  }
}

/* =====================================================================
   Unités de stockage (Conteneurs) & Pack Développeur CS:GO
   ===================================================================== */
.cs-dev-pack-btn {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: #0b0d13 !important;
  font-weight: 800 !important;
  border: 1px solid rgba(251, 191, 36, 0.6) !important;
  box-shadow: 0 0 16px rgba(245, 158, 11, 0.35) !important;
  letter-spacing: .02em;
  transition: transform .15s ease, box-shadow .15s ease !important;
}
.cs-dev-pack-btn:hover {
  transform: translateY(-1px) scale(1.02);
  box-shadow: 0 0 24px rgba(245, 158, 11, 0.55) !important;
}

.cs-dev-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.12) 0%, rgba(17, 21, 31, 0.9) 100%);
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: 12px;
  margin-bottom: 20px;
  animation: fadeIn .2s ease;
}
.cs-dev-box .badge.dev {
  background: #f59e0b;
  color: #0b0d13;
  font-weight: 900;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 11px;
}
.cs-dev-box-txt {
  flex: 1;
  font-size: 13.5px;
  color: #e2e8f0;
}
.cs-dev-box-txt b {
  color: #fbbf24;
}

/* Dashboard Conteneurs */
.co-dashboard {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 14px;
  animation: fadeIn .2s ease;
}
.co-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  padding: 22px 28px;
  background: linear-gradient(135deg, rgba(26, 31, 46, 0.9) 0%, rgba(13, 16, 23, 0.95) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}
.co-banner-info h3 {
  font-family: var(--cond);
  font-size: 24px;
  font-weight:700;
  color: #fff;
  letter-spacing:.008em;
  margin-bottom: 6px;
}
.co-banner-info p {
  color: var(--muted);
  font-size: 13.5px;
  line-height: 1.5;
  max-width: 620px;
  margin: 0;
}
.co-stats {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.co-stat-box {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 18px;
  background: rgba(8, 10, 15, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  min-width: 120px;
}
.co-stat-box .co-st-l {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--dim);
}
.co-stat-box b {
  font-family: var(--cond);
  font-size: 20px;
  color: #fff;
}
.co-stat-box b small {
  font-size: 13px;
  color: var(--dim);
  font-weight: 400;
}

/* Grille de conteneurs */
.co-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}
.co-card {
  position: relative;
  background: linear-gradient(180deg, rgba(22, 27, 39, 0.85) 0%, rgba(13, 16, 24, 0.95) 100%);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform .2s cubic-bezier(0.16, 1, 0.3, 1), border-color .2s ease, box-shadow .2s ease;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}
.co-card:hover {
  transform: translateY(-3px);
  border-color: rgba(255, 171, 26, 0.45);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.5), 0 0 20px rgba(255, 171, 26, 0.12);
}
.co-card-svg {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 130px;
  background: radial-gradient(circle, rgba(255, 171, 26, 0.08) 0%, transparent 70%);
  border-radius: 10px;
  overflow: hidden;
}
.co-card-svg svg {
  width: 100%;
  max-width: 220px;
  height: auto;
  filter: drop-shadow(0 6px 12px rgba(0,0,0,0.6));
  transition: transform .2s ease;
}
.co-card:hover .co-card-svg svg {
  transform: scale(1.04);
}
.co-card-info {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.co-card-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.co-card-title {
  font-family: var(--cond);
  font-size: 19px;
  font-weight:700;
  color: #fff;
  letter-spacing:.008em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.co-card-val {
  font-size: 12.5px;
  font-weight: 700;
  color: #fbbf24;
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(245, 158, 11, 0.25);
  padding: 3px 8px;
  border-radius: 6px;
  white-space: nowrap;
}
.co-card-bar-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.co-card-bar-lbl {
  display: flex;
  justify-content: space-between;
  font-size: 11.5px;
  color: var(--muted);
}
.co-card-bar {
  height: 6px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 3px;
  overflow: hidden;
}
.co-card-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #f59e0b, #fbbf24);
  border-radius: 3px;
  transition: width .3s ease;
}
.co-card-acts {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.co-card-acts .btn.primary {
  flex: 1;
}

/* État vide conteneurs */
.co-empty-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 50px 30px;
  background: rgba(14, 18, 28, 0.75);
  border: 1px dashed rgba(255, 255, 255, 0.14);
  border-radius: 16px;
  gap: 16px;
  max-width: 600px;
  margin: 20px auto;
}
.co-crate-ico-big {
  width: 140px;
  height: 100px;
}
.co-crate-ico-big svg {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.6));
}
.co-empty-card h4 {
  font-family: var(--cond);
  font-size: 22px;
  font-weight:700;
  color: #fff;
}
.co-empty-card p {
  color: var(--muted);
  font-size: 14px;
  max-width: 440px;
  line-height: 1.5;
  margin: 0;
}

/* Modale Conteneur */
.co-modal {
  max-width: 900px !important;
  width: 94vw !important;
  max-height: 90vh !important;
  display: flex;
  flex-direction: column;
}
.co-m-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow-y: auto;
  padding: 18px 24px 24px;
}
.co-m-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  padding: 14px 18px;
  background: rgba(10, 13, 20, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
}
.co-m-top-info {
  display: flex;
  align-items: center;
  gap: 16px;
}
.co-m-acts {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

/* Grille des skins à l'intérieur d'un conteneur */
.co-items-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 12px;
  max-height: 520px;
  overflow-y: auto;
  padding: 4px;
}
.co-tile {
  position: relative;
  background: linear-gradient(180deg, rgba(24, 29, 43, 0.8) 0%, rgba(13, 16, 25, 0.9) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-align: center;
  cursor: pointer;
  transition: all .15s ease;
  user-select: none;
}
.co-tile:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
}
.co-tile.selected {
  border-color: #f59e0b !important;
  background: rgba(245, 158, 11, 0.12) !important;
  box-shadow: 0 0 0 1px #f59e0b, 0 4px 16px rgba(245, 158, 11, 0.25) !important;
}
.co-tile .co-chk {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 18px;
  height: 18px;
  accent-color: #f59e0b;
  cursor: pointer;
}
.co-tile-im {
  width: 90px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.co-tile-im img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.5));
}
.co-tile-n {
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}
.co-tile-w {
  font-size: 10px;
  color: var(--dim);
}
.co-tile-p {
  font-size: 10.5px;
  font-weight: 700;
  color: #fbbf24;
}
.co-tile-act {
  margin-top: 4px;
  width: 100%;
}
.co-tile-act .btn {
  width: 100%;
  height: 26px;
  font-size: 10.5px;
  padding: 0 6px;
}

@media (max-width: 640px) {
  .co-banner {
    padding: 16px;
  }
  .co-grid {
    grid-template-columns: 1fr;
  }
  .co-items-grid {
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  }
}