/* =========================================================
   NinjaStats — Silva : sous la canopée
   Pas de décor dessiné : de la lumière qui filtre, des ombres
   de feuilles qui bougent, de l'air. Interface sobre par-dessus.
   Chargé après style.css / auth.css ; limité à body.silva.
   ========================================================= */

body.silva{
  --bg:#0e1a13;
  --txt:#eef2e6;
  --txt-2:#bac5b1;
  --txt-3:#829079;
  --line:rgba(220,236,200,.11);
  --line-2:rgba(220,236,200,.07);
  --glass:rgba(16,30,21,.5);
  --glass-2:rgba(24,42,30,.52);

  --a1:#9fcb7c;      /* mousse   */
  --a2:#f1d690;      /* soleil   */
  --a3:#9fcb7c;
  --ok:#a7dc8b;
  --warn:#ebc66e;
  --bad:#e78c74;

  --accent:var(--a1);
  --grad:linear-gradient(180deg,#b2d690,#93c06f);
  --r-l:20px; --r-m:16px; --r-s:12px;
  --shadow:0 24px 50px -30px rgba(0,0,0,.7);
  --focus:rgba(159,203,124,.7);
  --focus-ring:0 0 0 3px rgba(159,203,124,.18);

  background:var(--bg);
  color-scheme:dark;   /* contrôles natifs (listes, flèches des nombres) en sombre */
}
.silva ::selection{background:rgba(159,203,124,.3)}
.silva,.silva *{scrollbar-color:rgba(220,236,200,.18) transparent}
.silva *::-webkit-scrollbar-thumb{background:rgba(220,236,200,.15); background-clip:content-box}
.silva *::-webkit-scrollbar-thumb:hover{background:rgba(220,236,200,.28); background-clip:content-box}

.silva h1,.silva h2,.silva h3{letter-spacing:-.02em; font-weight:700}
.silva .page h1{font-size:clamp(28px,4.6vw,40px)}
.silva .page__lead{color:var(--txt-2)}
.silva .sec-kicker{color:var(--a1); letter-spacing:.16em}
.silva .card-head h3{font-size:16px}

/* =========================================================
   Sous la canopée
   ========================================================= */
/* lumière verte qui descend : claire en haut (trouées), sombre au sol */
.silva .bg{background:
  radial-gradient(ellipse 80% 55% at 65% -5%,rgba(214,232,160,.20),transparent 65%),
  radial-gradient(ellipse 60% 45% at 15% 0%,rgba(170,210,140,.12),transparent 70%),
  linear-gradient(180deg,#1f3a28 0%,#162c1e 35%,#0f1f15 70%,#0b170f 100%)}
.silva .bg__grid,.silva .bg__noise{display:none}
.silva .bg__vignette{background:radial-gradient(ellipse 120% 90% at 50% 20%,transparent 50%,rgba(4,9,6,.7) 100%)}

/* rayon de soleil, très doux */
.silva .bg__aurora{border-radius:0; filter:blur(40px); mix-blend-mode:screen; animation:none}
.silva .bg__aurora--a{
  width:45vw; height:130vh; left:auto; right:12vw; top:-20vh; opacity:.35;
  background:linear-gradient(180deg,rgba(246,228,170,.22),rgba(246,228,170,0) 75%);
  transform:skewX(-14deg); animation:shaft 14s ease-in-out infinite alternate;
}
.silva .bg__aurora--b{
  width:22vw; height:120vh; left:18vw; top:-20vh; opacity:.25;
  background:linear-gradient(180deg,rgba(220,240,190,.2),rgba(220,240,190,0) 70%);
  transform:skewX(-10deg); animation:shaft 18s ease-in-out -6s infinite alternate;
}
@keyframes shaft{to{opacity:.12}}

/* taches de soleil (komorebi) qui glissent quand les feuilles bougent */
.bg__sun{
  position:absolute; inset:-10%;
  background:
    radial-gradient(closest-side,rgba(246,228,170,.13),transparent) 12% 22%/220px 160px,
    radial-gradient(closest-side,rgba(246,228,170,.10),transparent) 38% 60%/160px 120px,
    radial-gradient(closest-side,rgba(246,228,170,.12),transparent) 66% 30%/260px 180px,
    radial-gradient(closest-side,rgba(246,228,170,.08),transparent) 84% 70%/180px 130px,
    radial-gradient(closest-side,rgba(246,228,170,.09),transparent) 52% 88%/240px 150px,
    radial-gradient(closest-side,rgba(246,228,170,.07),transparent) 24% 82%/150px 110px;
  background-repeat:no-repeat; filter:blur(6px);
  animation:dapple 11s ease-in-out infinite alternate;
}
@keyframes dapple{
  0%{transform:translate(0,0); opacity:.9}
  40%{opacity:.55}
  100%{transform:translate(1.5vw,.8vh); opacity:1}
}

/* ombres des feuilles au-dessus de soi, floues, qui se balancent */
.bg__canopy,.bg__canopy--far{
  position:absolute; left:-6%; right:-6%; top:-4%; height:min(70vh,640px);
  background:url('../img/silva-canopy.svg') center top / cover no-repeat;
  transform-origin:50% 0; pointer-events:none;
}
.bg__canopy{opacity:.7; filter:blur(6px); animation:sway 9s ease-in-out infinite alternate}
.bg__canopy--far{background-image:url('../img/silva-canopy-far.svg'); opacity:.55; filter:blur(12px); animation:sway 13s ease-in-out -4s infinite alternate-reverse}
@keyframes sway{
  0%{transform:rotate(-.6deg) translateX(-.6%)}
  100%{transform:rotate(.6deg) translateX(.6%)}
}

/* particules dans la lumière */
.bg__motes,.bg__motes::after{
  position:absolute; inset:0;
  background-image:
    radial-gradient(1.5px 1.5px at 18% 34%,rgba(250,240,200,.8),transparent),
    radial-gradient(1px 1px at 33% 58%,rgba(250,240,200,.7),transparent),
    radial-gradient(1.5px 1.5px at 61% 24%,rgba(250,240,200,.8),transparent),
    radial-gradient(1px 1px at 72% 48%,rgba(250,240,200,.6),transparent),
    radial-gradient(1px 1px at 46% 76%,rgba(250,240,200,.5),transparent),
    radial-gradient(1.5px 1.5px at 86% 36%,rgba(250,240,200,.7),transparent);
  animation:float 22s linear infinite;
}
.bg__motes::after{content:''; transform:translate(-8vw,12vh); animation-duration:30s; animation-delay:-11s}
@keyframes float{
  0%{translate:0 0; opacity:0}
  15%{opacity:.9}
  85%{opacity:.7}
  100%{translate:3vw -14vh; opacity:0}
}

/* =========================================================
   Interface : panneaux simples, comme du verre dans la lumière
   ========================================================= */
.silva .glass{
  background:linear-gradient(180deg,var(--glass-2),var(--glass));
  backdrop-filter:blur(18px) saturate(115%); -webkit-backdrop-filter:blur(18px) saturate(115%);
}
.silva .glass::before{background:linear-gradient(180deg,rgba(240,248,225,.16),transparent 40%)}

.silva .btn{color:#14210f; box-shadow:0 8px 22px -14px rgba(159,203,124,.9)}
.silva .btn:hover{box-shadow:0 12px 28px -14px rgba(159,203,124,1)}
.silva .btn--ghost{background:rgba(220,236,200,.06); color:var(--txt); border:1px solid var(--line); box-shadow:none}
.silva .btn--ghost:hover{background:rgba(220,236,200,.12); box-shadow:none}
.silva .btn--danger{background:rgba(231,140,116,.1); color:var(--bad); border:1px solid rgba(231,140,116,.3); box-shadow:none}
.silva .btn--danger:hover{background:rgba(231,140,116,.18); box-shadow:none}

.silva .field input,.silva .field select{background:rgba(6,14,9,.4)}
.silva .field input:focus,.silva .field select:focus{border-color:var(--focus); box-shadow:var(--focus-ring)}
.silva .perm{background:rgba(220,236,200,.05)}
.silva .perm input{accent-color:var(--a1)}
.silva .perm:has(input:checked){border-color:rgba(159,203,124,.55); background:rgba(159,203,124,.12)}
.silva .page code{background:rgba(220,236,200,.08)}
.silva .tag{background:rgba(220,236,200,.08)}
.silva .users td{border-top-color:var(--line-2)}

.silva .nav::after{background:rgba(14,28,19,.88); border-bottom-color:var(--line-2)}
.silva .nav__logo{background:var(--grad); box-shadow:0 8px 20px -10px rgba(159,203,124,.8)}
.silva .acct__dot{color:#14210f; background:var(--grad)}
.silva .acct__menu{background:rgba(16,30,21,.96)}
.silva .acct__btn,.silva .acct__item:hover{background:rgba(220,236,200,.06)}
.silva .toast{background:rgba(16,30,21,.96)}
.silva .toast i{background:var(--a1); box-shadow:0 0 10px var(--a1)}
.silva .toast.ok i{background:var(--ok); box-shadow:0 0 10px var(--ok)}
.silva .toast.err i{background:var(--bad); box-shadow:0 0 10px var(--bad)}

/* style.css centre chaque <section> : dans les grilles Silva elles doivent remplir leur cellule */
.silva .page section{max-width:none; margin:0}

/* ---------------- onglets ---------------- */
.silva-tabs,.db-views,.elo-modes{display:inline-flex; gap:4px; padding:4px; border-radius:99px; flex-wrap:wrap;
  background:rgba(6,14,9,.35); border:1px solid var(--line)}
.silva-tabs{margin-bottom:22px}
.db-views{margin-bottom:18px}
.silva-tabs a,.db-views button,.elo-modes button{padding:7px 16px; border-radius:99px; font-size:13px; font-weight:600; color:var(--txt-2); transition:background .25s,color .25s}
.silva-tabs a:hover,.db-views button:hover,.elo-modes button:hover{color:var(--txt); background:rgba(220,236,200,.06)}
.silva-tabs a[aria-current="page"],.db-views button[aria-pressed="true"],.elo-modes button[aria-pressed="true"]{color:var(--txt); background:rgba(159,203,124,.2)}
.silva-tabs a[hidden],.db-views button[hidden],.db-view[hidden]{display:none}

/* =========================================================
   Panneau serveur
   ========================================================= */
.mc-head{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap}

.mc-pill,.db-role{display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:99px; font-size:12.5px;
  background:rgba(220,236,200,.06); border:1px solid var(--line); color:var(--txt-2)}
.mc-pill i{width:8px; height:8px; border-radius:50%; background:var(--txt-3)}
.mc-pill[data-state="on"] i{background:var(--ok); box-shadow:0 0 10px var(--ok)}
.mc-pill[data-state="off"] i{background:var(--bad); box-shadow:0 0 10px var(--bad)}
.mc-pill[data-state="off"]{color:var(--bad)}
.mc-pill[hidden]{display:none}
.db-role[data-role="manage"]{color:var(--a1); border-color:rgba(159,203,124,.4)}
.db-head-r{display:flex; gap:10px; align-items:center; flex-wrap:wrap}

.mc-stats{display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-bottom:20px}
.mc-stat{padding:14px 16px; border-radius:var(--r-m); display:grid; gap:4px}
.mc-stat span{font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:var(--txt-3); font-weight:600}
.mc-stat strong{font-size:22px; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.mc-stat small{font-size:12px; color:var(--txt-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

[data-level="ok"]{color:var(--ok)}
[data-level="warn"]{color:var(--warn)}
[data-level="bad"]{color:var(--bad)}
.users td.mono[data-level="ok"]{color:var(--ok)}
.users td.mono[data-level="warn"]{color:var(--warn)}
.users td.mono[data-level="bad"]{color:var(--bad)}

.mc-grid{display:grid; grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr); gap:20px; margin-bottom:20px; align-items:start}
.mc-side{display:grid; gap:20px}
.mc-side .form .btn{justify-self:stretch}

.mc-name{display:flex; align-items:center; gap:4px; flex-wrap:wrap}
.mc-sub{font-size:11.5px; color:var(--txt-3); margin-top:2px}
.tag--op{background:rgba(235,198,110,.14); color:var(--warn)}
.mc-empty{color:var(--txt-3); font-size:13px; padding:18px 10px 4px}

.mc-btns{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.mc-btns .btn{padding:8px 14px; font-size:12.5px}
#nameForm .mc-btns .btn{flex:1}

.mc-ops{list-style:none; margin:0; padding:0; display:grid; gap:2px; max-height:220px; overflow:auto}
.mc-ops li{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:6px 4px 6px 10px; border-radius:10px; font-size:13.5px}
.mc-ops li:hover{background:rgba(220,236,200,.05)}
.mc-ops .btn{padding:5px 11px; font-size:12px}
.mc-ops:empty::after{content:"No operators."; color:var(--txt-3); font-size:13px; padding:6px 10px}

/* ---------------- console ---------------- */
.mc-console__head{display:flex; justify-content:space-between; align-items:flex-end; gap:14px; flex-wrap:wrap}
.mc-filter{padding:7px 12px; border-radius:99px; background:rgba(6,14,9,.4); border:1px solid var(--line); color:var(--txt); font-size:12.5px; width:160px; outline:none}
.mc-filter:focus{border-color:var(--focus); box-shadow:var(--focus-ring)}

.mc-log{
  height:min(460px,60vh); overflow:auto; padding:12px 14px; border-radius:var(--r-s);
  background:rgba(4,10,6,.6); border:1px solid var(--line-2);
  font-family:'JetBrains Mono',ui-monospace,monospace; font-size:12px; line-height:1.55; color:var(--txt-2);
}
.mc-log:focus-visible{outline:2px solid var(--focus)}
.mc-line{white-space:pre-wrap; overflow-wrap:anywhere}
.mc-line--notice{color:var(--a1)}
.mc-line--warn{color:var(--warn)}
.mc-line--err{color:var(--bad)}
.mc-line--debug{color:var(--txt-3)}
.mc-line--cmd{color:var(--a2); margin-top:6px}
.mc-line--out{color:var(--txt); padding-left:14px}

.mc-cmd{display:flex; align-items:center; gap:10px; margin-top:12px; padding:6px 6px 6px 14px; border-radius:var(--r-s);
  background:rgba(6,14,9,.4); border:1px solid var(--line)}
.mc-cmd:focus-within{border-color:var(--focus); box-shadow:var(--focus-ring)}
.mc-cmd span{font-family:'JetBrains Mono',ui-monospace,monospace; color:var(--txt-3)}
.mc-cmd input{flex:1; min-width:0; background:none; border:0; outline:none; color:var(--txt);
  font-family:'JetBrains Mono',ui-monospace,monospace; font-size:13px; padding:6px 0}
.mc-cmd .btn{padding:8px 18px}

/* ---------------- boîtes de dialogue ---------------- */
.mc-dialog{
  margin:auto; width:min(420px,calc(100% - 32px)); padding:22px; border-radius:var(--r-l);
  color:var(--txt); background:rgba(18,33,23,.98); border:1px solid var(--line);
}
.silva .mc-dialog.glass{background:rgba(18,33,23,.98)}
.mc-dialog::backdrop{background:rgba(4,9,6,.6); backdrop-filter:blur(4px)}
.mc-dialog h3{font-size:18px}
.mc-dialog .mc-btns .btn{flex:1}
.mc-dialog [hidden]{display:none}

/* =========================================================
   Base de données : classement Elo
   ========================================================= */
.elo-bar{display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:18px}
.elo-tools{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.elo-tools .mc-filter{width:190px}

.elo-note{padding:12px 16px; margin:0 0 16px; border-radius:var(--r-m); font-size:13px; color:var(--txt-2);
  background:rgba(241,214,144,.06); border:1px solid rgba(241,214,144,.18)}
.elo-note[hidden]{display:none}

.elo-table th button{font:inherit; color:inherit; letter-spacing:inherit; text-transform:inherit; display:inline-flex; gap:4px; align-items:center}
.elo-table th button:hover{color:var(--txt)}
.elo-table th[aria-sort] button{color:var(--a1)}
.elo-table th[aria-sort="ascending"] button::after{content:'↑'}
.elo-table th[aria-sort="descending"] button::after{content:'↓'}
.elo-table th.num,.elo-table td.num{text-align:right}
.elo-table tbody tr{transition:background .2s}
.elo-table tbody tr:hover{background:rgba(220,236,200,.04)}
.elo-table tr.is-unrated td{color:var(--txt-3)}
.elo-pos{width:44px; color:var(--txt-3); font-family:'JetBrains Mono',ui-monospace,monospace; font-size:12.5px}
.elo-pos[data-pos="1"]{color:var(--a2)}
.elo-pos[data-pos="2"],.elo-pos[data-pos="3"]{color:var(--txt-2)}
.elo-val{font-size:16px; font-weight:700; color:var(--txt); font-variant-numeric:tabular-nums}
.is-unrated .elo-val{font-size:13px; font-weight:400; color:var(--txt-3)}
.elo-wl b{color:var(--ok); font-weight:600}
.elo-wl i{color:var(--bad); font-style:normal}
.elo-table td.elo-acts{width:1px; white-space:nowrap; text-align:right}
.elo-acts .btn{padding:5px 11px; font-size:12px}

.elo-dot{display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:7px; background:transparent; box-shadow:inset 0 0 0 1px var(--txt-3); flex:none}
.elo-dot[data-on="1"]{background:var(--ok); box-shadow:0 0 8px var(--ok)}
.tag--rank{font-weight:600}
.tag--bad{background:rgba(231,140,116,.14); color:var(--bad)}
.tag--warn{background:rgba(235,198,110,.14); color:var(--warn)}

/* =========================================================
   Base de données : tables, éditeurs, console SQL
   ========================================================= */
.db-layout{display:grid; grid-template-columns:220px minmax(0,1fr); gap:20px; align-items:start}
.db-tables{list-style:none; margin:0; padding:6px; display:grid; gap:2px}
.db-tables button{width:100%; display:flex; justify-content:space-between; gap:10px; align-items:center; padding:9px 12px; border-radius:10px;
  font-size:13.5px; color:var(--txt-2); text-align:left; transition:background .2s,color .2s}
.db-tables button:hover{background:rgba(220,236,200,.06); color:var(--txt)}
.db-tables button[aria-current="true"]{background:rgba(159,203,124,.16); color:var(--txt)}
.db-tables small{font-family:'JetBrains Mono',ui-monospace,monospace; font-size:11px; color:var(--txt-3)}
.db-side-head{display:flex; justify-content:space-between; align-items:center; padding:14px 16px 6px}
.db-side-head h3{font-size:14px}
.db-side-head .btn{padding:5px 10px; font-size:11.5px}

.db-main-head{display:flex; justify-content:space-between; align-items:flex-start; gap:14px; flex-wrap:wrap; margin-bottom:14px}
.db-main-head h3{font-size:18px}
.db-cols{display:flex; gap:6px; flex-wrap:wrap; margin-top:8px}
.db-col{font-family:'JetBrains Mono',ui-monospace,monospace; font-size:11px; padding:3px 8px; border-radius:99px;
  background:rgba(6,14,9,.35); border:1px solid var(--line-2); color:var(--txt-2)}
.db-col em{font-style:normal; color:var(--txt-3)}
.db-col[data-pk]{border-color:rgba(159,203,124,.45); color:var(--a1)}

.db-scroll{overflow:auto; max-height:min(620px,70vh); border-radius:var(--r-s); border:1px solid var(--line-2); background:rgba(4,10,6,.35)}
.db-grid{width:100%; border-collapse:collapse; font-size:12.5px; font-family:'JetBrains Mono',ui-monospace,monospace}
.db-grid th{position:sticky; top:0; z-index:1; text-align:left; padding:10px 12px; white-space:nowrap; font-family:'Inter',system-ui,sans-serif;
  font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--txt-3); background:rgba(18,33,23,.97); border-bottom:1px solid var(--line)}
.db-grid td{padding:8px 12px; border-top:1px solid var(--line-2); max-width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--txt)}
.db-grid tbody tr:hover{background:rgba(220,236,200,.04)}
.db-grid .db-null{color:var(--txt-3); font-style:italic}
.db-grid td.db-acts{position:sticky; right:0; background:rgba(18,33,23,.95); width:1px; overflow:visible}
.db-grid td.db-acts div{display:flex; gap:6px}
.db-grid td.db-acts .btn{padding:4px 10px; font-size:11.5px; font-family:'Inter',system-ui,sans-serif}
.db-pager{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:12px; font-size:12.5px; color:var(--txt-3); flex-wrap:wrap}

.db-dialog{width:min(560px,calc(100% - 32px))}
.db-fields{display:grid; gap:12px; max-height:min(60vh,520px); overflow:auto; padding:2px 4px 2px 0}
.db-field{display:grid; gap:5px}
.db-field label{display:flex; justify-content:space-between; gap:10px; font-size:12px; font-weight:600; color:var(--txt-2)}
.db-field label em{font-family:'JetBrains Mono',ui-monospace,monospace; font-style:normal; font-weight:400; color:var(--txt-3); font-size:10.5px}
.db-field textarea,.db-sql textarea{display:block; width:100%; resize:vertical; outline:none; color:var(--txt); border-radius:var(--r-s);
  font-family:'JetBrains Mono',ui-monospace,monospace; background:rgba(6,14,9,.45); border:1px solid var(--line)}
.db-field textarea{min-height:40px; padding:9px 12px; font-size:12.5px}
.db-field textarea:focus,.db-sql textarea:focus{border-color:var(--focus); box-shadow:var(--focus-ring)}
.db-field textarea:disabled{opacity:.4}
.db-field .perm{justify-self:start; font-size:11px; padding:2px 9px 2px 7px}

.db-sql textarea{min-height:160px; padding:14px; font-size:13px; line-height:1.55}
.db-sql__bar{display:flex; justify-content:space-between; align-items:center; gap:10px; margin:12px 0 4px; flex-wrap:wrap}
.db-sql__bar p{font-size:12px; color:var(--txt-3)}
.db-result{margin-top:18px}
.db-result h4{margin:0 0 8px; font-family:'JetBrains Mono',ui-monospace,monospace; font-size:12px; font-weight:400; color:var(--txt-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.db-err{margin-top:16px; padding:12px 14px; border-radius:var(--r-s); font-family:'JetBrains Mono',ui-monospace,monospace; font-size:12.5px;
  color:var(--bad); background:rgba(231,140,116,.08); border:1px solid rgba(231,140,116,.28); white-space:pre-wrap}
.db-err:empty{display:none}
.db-warn{padding:10px 12px; border-radius:var(--r-s); font-size:12.5px; color:var(--warn); background:rgba(235,198,110,.07); border:1px solid rgba(235,198,110,.22)}

/* fiche joueur */
.pl-dialog{width:min(640px,calc(100% - 32px)); overflow:hidden}
.pl-head h3{font-size:20px}
.pl-body{display:grid; gap:12px; max-height:min(62vh,600px); overflow:auto; padding-right:4px}
.pl-sec{margin:0; padding:12px 14px 14px; border-radius:var(--r-m); border:1px solid var(--line); background:rgba(6,14,9,.25); display:grid; gap:10px; min-width:0}
.pl-sec legend{padding:0 6px; font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--txt-2)}
.pl-sec legend .perm{font-size:12px; letter-spacing:.06em; text-transform:uppercase}
.pl-sec[data-kind] .pl-row{transition:opacity .25s}
.pl-sec[data-off] .pl-row{opacity:.35; pointer-events:none}
.pl-row{display:grid; grid-template-columns:1fr 1.4fr; gap:12px}
.pl-elo{display:grid; gap:8px}
.pl-mode{display:grid; grid-template-columns:100px repeat(4,minmax(0,1fr)); gap:8px; align-items:end}
.pl-mode strong{font-size:13px; color:var(--a1); padding-bottom:10px}
.pl-mode .field input{padding:8px 10px}
.pl-mode .field[hidden]{display:none}
.pl-dialog .db-warn{margin:0}
.pl-dialog .db-warn[hidden]{display:none}

/* accès */
.keep-table .tag--keeper{background:rgba(159,203,124,.16); color:var(--a1)}
.keep-table td:last-child{text-align:right}
.keep-table .btn{padding:6px 12px; font-size:12px}

@media (max-width:1000px){
  .mc-grid{grid-template-columns:1fr}
  .mc-stats{grid-template-columns:repeat(3,1fr)}
  .db-layout{grid-template-columns:1fr}
  .db-tables{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
}
@media (max-width:820px){
  /* table des joueurs : on garde pseudo, ping et actions */
  .mc-table th:nth-child(3),.mc-table td:nth-child(3),
  .mc-table th:nth-child(4),.mc-table td:nth-child(4){display:none}
  .mc-table th:nth-child(5),.mc-table td:nth-child(5){display:table-cell}
  /* classement : rang, joueur, Elo, W/L, winrate */
  .elo-table .elo-opt{display:none}
  .elo-table th:nth-child(4),.elo-table td:nth-child(4),
  .elo-table th:nth-child(5),.elo-table td:nth-child(5){display:table-cell}
}
@media (max-width:560px){
  .mc-stats{grid-template-columns:repeat(2,1fr)}
  .mc-filter,.elo-tools .mc-filter{width:100%}
  .elo-tools{width:100%}
  .elo-table th:nth-child(4),.elo-table td:nth-child(4){display:none}
  .pl-row{grid-template-columns:1fr}
  .pl-mode{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pl-mode strong{grid-column:1/-1; padding:0}
  .bg__canopy,.bg__canopy--far{height:60vh; background-size:1100px auto}
}
@media (prefers-reduced-motion:reduce){
  .bg__sun,.bg__canopy,.bg__canopy--far,.bg__motes,.bg__motes::after,.silva .bg__aurora{animation:none}
}