/* contrastes vérifiés dans les deux thèmes (WCAG AA) : texte ≥ 4,5:1 (--on-accent sur --accent, --muted/--ok/--warn sur --bg et --card),
   icône ✕ (--warn sur --line) ≥ 3:1 */
/* familles du dé (♠ ♥ ♦ ♣ = 0 à 3) : symbole (fg), fond (bg), nom (tx) ; couleurs du vrai jeu, nom en blanc ou en noir selon le fond */
:root{--s0-fg:#f07a1a;--s0-bg:#2f6fd0;--s0-tx:#fff;--s1-fg:#d6283c;--s1-bg:#f8c6d4;--s1-tx:#2b2118;--s2-fg:#6a2c91;--s2-bg:#f7a23b;--s2-tx:#2b2118;--s3-fg:#2f9e44;--s3-bg:#f5d63d;--s3-tx:#2b2118}
:root{--bg:#fff8f0;--card:#fff;--ink:#2b2118;--muted:#7a6b5d;--accent:#c2410c;--on-accent:#fff;--accent2:#f59f00;--line:#ecdccb;--ok:#237a36;--warn:#c92a2a}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#1c1712;--card:#27201a;--ink:#f3e9df;--muted:#a8998a;--line:#3d3228;--accent:#ff7a3d;--on-accent:#1c1712;--accent2:#ffc048;--ok:#51cf66;--warn:#ff8787;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#1c1712;--card:#27201a;--ink:#f3e9df;--muted:#a8998a;--line:#3d3228;--accent:#ff7a3d;--on-accent:#1c1712;--accent2:#ffc048;--ok:#51cf66;--warn:#ff8787;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
body{padding:env(safe-area-inset-top) 0 calc(96px + env(safe-area-inset-bottom))}
header{padding:14px 16px;display:flex;align-items:center;gap:10px}
header h1{margin:0;font-size:1.3rem;letter-spacing:.5px}
header h1 .logo{width:1.35em;height:1.35em;vertical-align:-.3em;margin-right:8px}
header h1 span{color:var(--accent)}
#gear{margin-left:auto;background:none;font-size:1.4rem;padding:6px 8px}
select{width:100%;font:inherit;font-size:1rem;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
label.check{display:flex;align-items:center;gap:10px;margin-top:16px;color:var(--ink);font-size:1rem}
label.check input{width:22px;height:22px;accent-color:var(--accent)}
small.quit{font-weight:400;color:var(--muted);font-size:.75rem}
tr.editable{cursor:pointer}
tr.editable:active td{background:color-mix(in srgb,var(--accent) 12%,transparent)}
td.n small{display:block;font-size:.6rem;line-height:1;opacity:.7}
.foot{text-align:center;color:var(--muted);font-size:.75rem;margin:4px 0 14px}
.lnk{background:none;padding:0;color:var(--muted);text-decoration:underline;font-size:inherit}
.legal{line-height:1.5}
main{max-width:720px;margin:0 auto;padding:0 16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:14px}
.card h2{margin:0 0 10px;font-size:1rem;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
label{display:block;margin:8px 0 4px;color:var(--muted);font-size:.9rem}
input{width:100%;font-size:1.1rem;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
input:focus{outline:2px solid var(--accent);border-color:transparent}
button{font:inherit;border:0;border-radius:12px;padding:12px 16px;cursor:pointer;background:var(--line);color:var(--ink)}
button.primary{background:var(--accent);color:var(--on-accent);font-weight:600}
button.secondary{background:var(--accent2);color:var(--on-accent2,#2b2118);font-weight:600}
button:disabled{opacity:.4;cursor:default}
input:disabled{opacity:.55;cursor:not-allowed}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row>*{flex:1}
.counter{display:flex;align-items:center;justify-content:center;gap:24px;margin:16px 0}
.counter button{width:56px;height:56px;font-size:1.6rem;border-radius:50%}
.counter output{font-size:2.6rem;font-weight:700;min-width:60px;text-align:center}
.tablewrap{margin:0 -8px}
table{border-collapse:collapse;width:100%;table-layout:fixed;font-variant-numeric:tabular-nums}
th,td{padding:7px 2px;text-align:center;border-bottom:1px solid var(--line);overflow:hidden}
th{font-size:.82rem;color:var(--muted);font-weight:600;line-height:1.15;vertical-align:bottom}
th .pn{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* un nom ne tient pas dans sa colonne (fitHeads, app.js) : tous les noms du tableau à la verticale, jamais coupés en plein mot */
table.vert th .pn{display:block;writing-mode:vertical-rl;transform:rotate(180deg);margin:0 auto;max-height:86px;white-space:nowrap;text-overflow:ellipsis;font-size:.74rem}
/* noms des joueurs centrés sur le score, pas sur le bloc score + médaille : décalage de la moitié de l'emplacement
   de la médaille (12px + 1px d'écart, voir td .sv) ; à 7–8 joueurs la médaille est dessous, rien à compenser */
table:not(.c7):not(.c8) th:not(:first-child){padding-right:15px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
table col.n{width:24px}
table.c6 td,table.c7 td{font-size:.9rem} table.c6 th,table.c7 th{font-size:.74rem}
table.c8 td{font-size:.82rem} table.c8 th{font-size:.68rem} table.c8 th small{font-size:.6rem}
table.c7 tfoot .tot td{font-size:.86rem} table.c8 tfoot .tot td{font-size:.76rem}
td.n{color:var(--muted);font-size:.72rem}
td .r{color:var(--muted)}
/* médaille du podium au cumul (tableHTML) ; estompée quand la place ne change pas.
   Médaille et emplacement en px (pas em) : même colonne de médailles dans les manches et sur la ligne Σ, plus grosse,
   et médaille jamais plus large que son emplacement quelle que soit la taille du texte du tableau.
   Bloc score + médaille centré dans la case ; score sur 3 chiffres au moins, aligné à droite : unités sous unités. */
td .sv{display:grid;justify-content:center;grid-template-columns:minmax(3ch,max-content) 12px;align-items:center;column-gap:1px}
td .sv>span:first-child{text-align:right}
td .md-slot{text-align:left;line-height:1}
td .md{font-size:10px;vertical-align:.2em}
td .md.same{opacity:.35}
/* 7 et 8 joueurs : colonnes trop étroites pour la médaille à côté, elle passe sous le score (emplacement toujours réservé) */
:is(table.c7,table.c8) td .sv{display:flex;flex-direction:column;align-items:center;line-height:1.1}
:is(table.c7,table.c8) td .md-slot{min-height:10px;text-align:center}
:is(table.c7,table.c8) td .md{vertical-align:0}
td b{font-size:1.05rem}
tr.last td{background:color-mix(in srgb,var(--accent2) 14%,transparent)}
.empty{color:var(--muted);text-align:center;padding:18px 0}
ol.rank{list-style:none;margin:0;padding:0}
ol.rank li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
ol.rank li:last-child{border:0}
ol.rank .ico{font-size:1.5rem;width:34px;text-align:center}
ol.rank .nm{flex:1;font-weight:600}
ol.rank .pt{font-weight:700;font-variant-numeric:tabular-nums}
ol.rank .gap{color:var(--muted);font-size:.8rem;margin-left:6px}
.info{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;align-items:center}
.info dt{color:var(--muted)}
.info dd{margin:0;font-weight:600}
.dice{margin-top:12px}
.dice .lbl{color:var(--muted);font-size:.9rem;margin-bottom:6px}
.suits{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.suits button{padding:8px 0;border-radius:10px;border:3px solid transparent;display:flex;flex-direction:column;align-items:center;line-height:1.1}
.suits button b{font-size:1.5rem}
.suits button small{font-size:.65rem;font-weight:600}
.suits button.on{border-color:var(--ink);transform:scale(1.06)}
.suits button.off{opacity:.45}
.suits #roll{font-size:1.5rem}
.bar{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:flex;gap:10px;justify-content:center}
.bar .inner{display:flex;gap:10px;max-width:720px;width:100%}
.bar button{flex:1}
.bar .icon{flex:0 0 52px;font-size:1.3rem}
.entry{display:grid;grid-template-columns:1fr 44px 130px;gap:8px;align-items:center;margin-bottom:8px}
body.haskp .entry{height:var(--rowh,48px);margin:0}
body.haskp .entry .f,body.haskp .entry .pick{height:calc(100% - 6px)}
.entry .nm{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.entry .f{height:44px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);text-align:right;font-size:1.15rem;padding:0 10px;font-variant-numeric:tabular-nums;display:flex;align-items:center;justify-content:flex-end;overflow:hidden;white-space:nowrap}
.entry .f small{color:var(--muted);font-size:.72rem;margin-right:auto}
.entry .f.act{outline:2px solid var(--accent);border-color:transparent}
.entry .f.bad{color:var(--warn)}
.caret{display:inline-block;width:2px;height:1.2em;background:var(--accent);margin-left:2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
body.haskp{padding-bottom:var(--kp,280px)}
body.haskp header{display:none}
body.haskp .card{padding:10px 12px;margin:8px 0 0}
body.haskp .card h2{margin-bottom:6px}
body.haskp .total{margin:6px 0 0}
body.haskp .bar{padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
body.haskp .bar .inner{flex-direction:column;gap:8px}
.kp{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.kp button{padding:8px 0;font-size:1.2rem;font-variant-numeric:tabular-nums;border-radius:10px}
.kp .op{background:var(--accent2);color:var(--on-accent2,#2b2118);font-weight:700}
.kp .ok{background:var(--accent);color:var(--on-accent);font-weight:600;font-size:1rem}
.kp .w2{grid-column:span 2}
.kp .fillkey{background:var(--accent2);color:var(--on-accent2,#2b2118);font-size:.85rem;line-height:1.1;padding:4px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}
.kp .fillkey b{font-size:1.05rem}
.kp .fillkey small{font-size:.72rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kp [hidden]{display:none}
.kpbar{display:flex;gap:10px}
.kpbar button{flex:1}
.hero{border:2px solid var(--accent)}
.card h2 em{float:right;font-style:normal;text-transform:none;letter-spacing:0;color:var(--accent);font-weight:600}
.who{display:flex;gap:8px;margin-bottom:10px}
.who div{flex:1;background:var(--bg);border-radius:10px;padding:6px 10px}
.who small{display:block;color:var(--muted);font-size:.72rem}
.who b{font-size:1.1rem}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.chip{background:var(--bg);border-radius:20px;padding:4px 10px;font-size:.85rem}
.ci{display:inline-block;width:.6em;height:.85em;margin:0 1px 0 2px;vertical-align:-.1em;border:1.5px solid var(--accent);border-radius:2px;background:var(--card);box-shadow:2px -2px 0 -.5px var(--card),2px -2px 0 1px var(--accent)}
.chip.warn{background:color-mix(in srgb,var(--accent2) 30%,transparent)}
tfoot .tot td{font-weight:800;font-size:1.05rem;border-top:2px solid var(--ink);border-bottom:0}
.pap .pl{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:12px 6px;padding-top:4px}
.pap h2 em{color:var(--muted);font-weight:400}
/* boutons neutres : spécificité minimale, les styles visuels (themes.css) gardent la main */
:where(.pap .pl) button{padding:8px 4px;font-size:.95rem;min-width:0;border:2px solid transparent;background:var(--bg)}
.pap .pl button{position:relative;overflow:visible}
.pap .pl .nm{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* icône en pastille dans le coin : le nom garde toute la largeur du bouton */
.pap .pl .ic{position:absolute;top:-9px;right:-5px;font-size:1.05rem;line-height:1;pointer-events:none}
.pap .pl .ic img{width:1.3em;height:1.3em;display:block;border-radius:4px;box-shadow:0 0 0 2px var(--card)}
/* refileur (et refileur en attente) : couleurs du bouton secondaire ; preneur : celles du bouton principal (contrastes garantis par chaque style) */
.pap .pl button.sel,.pap .pl button.from{border-color:var(--on-accent2,#2b2118);background:var(--accent2);color:var(--on-accent2,#2b2118)}
.pap .pl button.sel{border-style:dashed}
.pap .pl button.to{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}
.pap .st{margin:8px 0 0;color:var(--muted);font-size:.85rem}
.pap .st b{color:var(--ink)}
button.more{display:block;width:100%;background:none;color:var(--muted);font-size:.85rem;padding:8px 0 0}
ol.rank.compact{display:grid;grid-auto-flow:column;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
ol.rank.compact .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
ol.rank.compact li{padding:5px 0}
ol.rank.compact .ico{font-size:1.2rem;width:26px}
ol.rank.compact li:last-child{border-bottom:1px solid var(--line)}
ol.rank.compact .rk{display:inline-block;font-size:.85rem;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
/* historique : classement compact plus petit, le tableau reste l'essentiel */
.hist .hrank ol.rank.compact li{padding:3px 0;gap:6px;font-size:.88rem}
.hist .hrank ol.rank.compact .ico{font-size:1rem;width:22px}
.hist .hrank ol.rank.compact .rk{font-size:.78rem}
.sheet{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:flex-end;z-index:10}
.sheet-in{background:var(--card);width:100%;max-width:720px;margin:0 auto;border-radius:18px 18px 0 0;padding:12px 16px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px}
.sheet-in button{text-align:left;font-size:1.05rem;padding:14px 16px}
.sheet-in .danger{color:var(--warn)}
.row .danger{color:var(--warn)}
.sheet-in .close{text-align:center;background:none;color:var(--muted)}
.sheet.dlg{align-items:center;padding:16px}
/* menu ⋯ : flottant au-dessus de la barre du bas, contre son bord droit (marges posées par sheet()) */
.sheet.menu{justify-content:flex-end;padding:16px;background:rgba(0,0,0,.25)}
.sheet.menu .sheet-in{width:auto;max-width:100%;margin:0;border-radius:14px;padding:6px;gap:4px;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.sheet.menu .sheet-in button{display:flex;align-items:center;justify-content:flex-end;gap:10px;text-align:right;padding:12px 14px}
.sheet.menu .sheet-in .ico{flex:0 0 1.4em;text-align:center}
.dlg-in{background:var(--card);width:100%;max-width:420px;margin:0 auto;border-radius:18px;padding:18px 16px 16px;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.dlg-in p{margin:0 0 16px;white-space:pre-line;line-height:1.45}
.dlg-in input{margin-bottom:16px}
.dlg-in .danger{color:var(--warn);font-weight:700}
.entry .pick{padding:0;height:44px;font-size:1.2rem;border-radius:10px}
.entry .pick.on{background:var(--accent2)}
/* glissé du doigt pour sélectionner plusieurs cartes : pas de défilement ni de sélection de texte depuis la grille */
.cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.pc{aspect-ratio:3/4;border-radius:10px;border:2px solid var(--line);background:var(--card);color:var(--ink);font-size:1.4rem;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;position:relative}
.pc small{font-size:.6rem;font-weight:500;color:var(--muted)}
.pc.sel{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.pc.sel small{color:var(--on-accent)}
.pc.taken{opacity:.25;text-decoration:line-through}
.pc.seven{grid-column:span 2;aspect-ratio:auto;font-size:1.8rem;border-color:var(--accent2);overflow:hidden;min-width:0}
.pc.seven.sel{background:var(--accent2);border-color:var(--accent2);color:var(--on-accent2,#2b2118)}
.pc.seven.sel small{color:var(--on-accent2,#2b2118)}
.pc.seven.suited{border-color:transparent}
.pc.seven.suited small{color:inherit;font-weight:600}
.pc.seven.suited.sel{outline:4px solid var(--accent);outline-offset:-4px}
.pc.seven.suited.sel::after{content:'✓';position:absolute;top:4px;right:8px;font-size:1rem;background:var(--accent);color:var(--on-accent);border-radius:50%;width:22px;height:22px;line-height:22px}
.picktotal{text-align:center;font-size:2rem;font-weight:700;margin:14px 0 0}
.entry .calc{color:var(--muted);font-size:.9rem;text-align:right}
.entry .calc.bad{color:var(--warn)}
.total{margin:12px 0;font-weight:600}
.total.ok{color:var(--ok)}.total.bad{color:var(--warn)}
.hint{color:var(--muted);font-size:.85rem}
.big{font-size:3rem;text-align:center;margin:6px 0}
.linkbtn{display:block;margin:4px auto 14px;background:none;color:var(--warn);font-size:.9rem;padding:8px}
/* historique : une carte par partie ; la partie sélectionnée est cerclée, les autres s'effacent */
.hist .hg{border:1px solid var(--line);border-radius:12px;margin-bottom:8px;transition:opacity .15s}
.hist .hg:last-child{margin-bottom:0}
.hist .hg.sel{border:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--card))}
.hist.has .hg:not(.sel){opacity:.55}
.hist .hsum{width:100%;background:none;border-radius:inherit;text-align:left;display:flex;gap:10px;align-items:center;padding:12px;color:var(--ink)}
.hist .hg.sel .hsum{padding:11px}
.hist .hsum .d{color:var(--muted);font-size:.8rem;min-width:62px;line-height:1.25}
.hist .hsum .d small{display:block;font-size:.75rem}
.hist .hsum .w{flex:1;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hist .hsum .w small{color:var(--muted);font-weight:400}
.hist .hsum .m{color:var(--muted);font-size:.8rem}
.hist .hsum .ck{color:var(--accent);font-weight:700;font-size:1.1rem}
.hist .body{padding:0 11px 11px}
#hres{flex:2}
th.gone,td.gone{opacity:.4}
.gonebox{margin-top:10px;padding:8px 10px;border-radius:10px;background:var(--bg);font-size:.85rem;color:var(--muted)}
.gonebox b{color:var(--ink);font-weight:600}
.gonebox div+div{margin-top:4px}
th small{font-weight:400;font-size:.7rem}
.prow{display:flex;gap:8px;margin-bottom:8px}
.prow input{flex:1}
.prow .rm{flex:0 0 48px;color:var(--warn)}
.prow .rp{flex:0 0 48px}

.toast{position:fixed;left:16px;right:16px;top:calc(12px + env(safe-area-inset-top));max-width:688px;margin:0 auto;background:#c92a2a;color:#fff;border-radius:12px;padding:12px 14px;z-index:20;font-size:.95rem}
h2[tabindex="-1"]:focus{outline:none}
.remind{border:2px solid var(--accent2)}
/* ---------- profils, progression, statistiques, récap ---------- */
.homeplus{margin-bottom:14px}
.sugg{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.sugg[hidden]{display:none}
.sugg button{padding:6px 12px;border-radius:18px;font-size:.92rem;background:var(--bg);border:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.choices{display:flex;flex-direction:column;gap:8px;max-height:60vh;overflow:auto}
.choices button{text-align:left}
.choices button.skip{background:none;border:1px solid var(--line);text-align:center;color:var(--muted);font-weight:600}
.profs{display:flex;flex-direction:column}
.prof{display:flex;align-items:center;gap:12px;background:none;border-radius:0;border-bottom:1px solid var(--line);padding:12px 2px;text-align:left}
.profs .prof:last-child{border-bottom:0}
.prof .nm{flex:1;min-width:0;font-weight:600;display:flex;flex-direction:column;gap:2px}
.prof .pn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* liste des joueurs : badges sous le nom, sur une ligne (les plus rares d'abord) */
.prof .pb{font-size:.95rem;line-height:1.2;font-weight:400;letter-spacing:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prof .lv{text-align:right;font-weight:600;font-size:.9rem;white-space:nowrap}
.av{flex:0 0 40px;height:40px;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem}
.av.big{width:64px;height:64px;flex-basis:64px;font-size:1.8rem;margin:0 auto 8px}
details.arch{margin-top:10px}
details.arch summary{cursor:pointer;color:var(--muted);font-size:.9rem;padding:6px 0}
.prohead{text-align:center}
.card h2.pname{color:var(--ink);font-size:1.3rem;text-transform:none;letter-spacing:0;margin-bottom:2px}
.pname small{font-size:.8rem;color:var(--muted);font-weight:400}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}
.kpis div{background:var(--bg);border-radius:10px;padding:8px 4px}
.kpis dt{color:var(--muted);font-size:.75rem}
.kpis dd{margin:2px 0 0;font-weight:700;font-size:1.1rem}
.kpis dd small{display:block;font-weight:400;color:var(--muted);font-size:.72rem}
.kpis .go{cursor:pointer;box-shadow:inset 0 0 0 1.5px var(--line)}
.kpis .go dt{color:var(--accent)}
.kpis .go:active{transform:scale(.97)}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.badge,.nb,.rl{display:flex;gap:10px;align-items:flex-start;padding:8px;border-radius:10px;background:var(--bg)}
.badge small,.nb small,.rl small{display:block;color:var(--muted);font-size:.78rem;line-height:1.3}
.badge small.when{margin-top:2px;font-size:.72rem}
.bico{font-size:1.6rem;line-height:1;flex:0 0 32px;text-align:center}
.newbadges{border:2px solid var(--accent2)}
.tag{display:inline-block;padding:0 6px;border-radius:999px;background:var(--accent2);color:#2b2118;font-size:.72rem;font-weight:700;vertical-align:1px}
.bgroup{margin:14px 0 8px;font-size:.9rem;color:var(--ink)}
.bgroup small{display:block;font-weight:400;font-size:.75rem;color:var(--muted)}
.badge.locked{opacity:.55;filter:grayscale(1)}
.nb+.nb,.rl+.rl{margin-top:8px}
/* badges de la partie ouverte dans l'historique : version sobre de la carte de fin de partie */
.gbadges{margin-top:12px}
.gbadges h3{margin:0 0 6px;font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
.gb{background:var(--bg);border-radius:10px;padding:6px 8px}
.gb+.gb{margin-top:4px}
.gb summary{display:flex;gap:10px;align-items:center;cursor:pointer;list-style:none}
.gb summary::-webkit-details-marker{display:none}
.gb .chev{margin-left:auto;color:var(--muted);transition:transform .15s}
.gb[open] .chev{transform:rotate(90deg)}
.gb small{display:block;color:var(--muted);font-size:.78rem;line-height:1.3;margin:4px 0 0 34px}
.gbadges .bico{font-size:1.2rem;flex-basis:24px}
/* partie ouverte : classement compact, puis tableau sur toute la largeur de la partie (plus de place à 7–8 joueurs) */
.hist .hrank{margin-bottom:10px}
.hist .body .tablewrap{margin:0 -11px}
dl.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin:0}
dl.stats div{background:var(--bg);border-radius:10px;padding:8px 10px}
dl.stats dt{color:var(--muted);font-size:.78rem}
dl.stats dd{margin:2px 0 0;font-weight:700;font-size:1.05rem}
dl.stats dd small{font-weight:400;color:var(--muted);font-size:.75rem}
small.base{display:block}
/* statistiques : forme récente, classement du groupe, places finales */
.form{display:flex;gap:3px;margin:6px 0 2px}
.form span{flex:1 1 0;max-width:34px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.74rem;font-weight:700;background:var(--bg);color:var(--muted)}
.form span.w{background:var(--accent);color:var(--on-accent)}
.form span.l{box-shadow:inset 0 0 0 1.5px var(--warn);color:var(--warn)}
.form span.q{opacity:.5}
.delta{font-weight:700}.delta.up{color:var(--ok)}.delta.down{color:var(--warn)}
.lb{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.lb>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb:last-of-type{border-bottom:0}
.lb.me{font-weight:800;color:var(--accent)}
.lb .r{display:inline-block;min-width:22px;color:var(--muted);font-weight:400}
.places{display:grid;grid-template-columns:auto 1fr auto;gap:6px 10px;align-items:center;font-size:.85rem}
.places .b{height:12px;border-radius:6px;background:var(--accent);min-width:3px}
.places .b.l{background:var(--warn)}
.places .n{color:var(--muted);font-variant-numeric:tabular-nums;text-align:right}
.duo{margin:0 0 8px}
.duo small{color:var(--muted)}
.vsrow{padding:8px 0;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline}
.vsrow:last-child{border:0}
.vsrow .nm{flex:1;font-weight:600;min-width:0}
.vsrow .sc{font-size:.9rem}
.vsrow .gv{flex-basis:100%;color:var(--muted);font-size:.78rem}
.recap h2 select{width:auto;float:right;padding:2px 8px;font-size:.9rem}
/* ---------- partage d'une partie ---------- */
.dlg-in.share,.dlg-in.recv{max-height:calc(100vh - 32px);overflow:auto}
.dlg-in h2{margin:0 0 10px;font-size:1.1rem}
.dlg-in h3{margin:14px 0 6px;font-size:.95rem;color:var(--muted)}
.dlg-in.share{text-align:center}
.dlg-in.share p{margin:10px 0}
/* QR code : toujours noir sur blanc, zone de silence comprise, quel que soit le thème ou le style */
svg.qr{display:block;width:100%;max-width:340px;min-width:240px;height:auto;margin:0 auto;background:#fff;border-radius:6px}
.recv .note{margin:10px 0;font-weight:600}
.who-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:8px;align-items:center;margin-bottom:6px}
.who-row label{margin:0;color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who-row select{padding:8px}
/* image de fin de partie : aperçu du canvas, choix du style et du thème */
.share-btns{justify-content:center;flex-wrap:wrap}
.imgprev{display:flex;justify-content:center;min-height:120px;align-items:center}
.imgprev canvas{width:auto;max-width:100%;max-height:55vh;height:auto;border:1px solid var(--line);border-radius:8px}
.imgopts{margin:12px 0}
.imgopts select{flex:1;min-width:0}

/* ---------- écran des noms : lignes compactes, ordre modifiable ---------- */
.nlistcard{padding:12px 12px 12px 4px}
.nlistcard h2,.nlistcard .hint{margin-left:8px}
.nlistcard h2{margin-bottom:2px;font-size:.875rem}
.nlistcard .hint{margin-top:0;margin-bottom:8px;font-size:.8rem}
.nlist{position:relative}
.nrow{position:relative;transition:transform .15s;margin-bottom:6px;border-radius:12px;background:var(--card)}
.nline{display:flex;align-items:center;gap:4px}
.nline input{flex:1;min-width:0;height:44px;padding:0 12px;font-size:1.05rem}
.grip{flex:0 0 36px;width:36px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;background:none;color:var(--muted);touch-action:none;cursor:grab}
.pos{flex:0 0 26px;width:26px;height:26px;margin-right:6px;border-radius:50%;background:var(--line);color:var(--ink);font-size:.8rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.pos.first{background:var(--accent);color:var(--on-accent)}
.nrow.drag{z-index:2;transition:none;box-shadow:0 8px 22px rgba(0,0,0,.28);outline:2px solid var(--accent)}
.nrow.drag .grip{color:var(--accent);cursor:grabbing}
.nrow .sugg{flex-wrap:nowrap;overflow-x:auto;padding:4px 0 2px 76px;margin:0}
.nrow .sugg button{flex-shrink:0;white-space:nowrap}
.roundsrow{display:flex;align-items:center;gap:8px;padding:10px 12px 10px 16px}
.rlab{flex:1}
.rlab b{display:block;font-size:.95rem}
.rlab small{color:var(--muted);font-size:.78rem}
.roundsrow button{flex:0 0 44px;width:44px;height:44px;padding:0;font-size:1.4rem}
.roundsrow output{width:36px;text-align:center;font-size:1.5rem;font-weight:700}
@media (prefers-reduced-motion:reduce){.nrow{transition:none}}
/* ---------- premium (phase 2) : marqueur 👑, présentation, aperçus ---------- */
/* marqueur : pastille dans le coin d'un bouton icône (mk), ou à la suite d'un libellé (mki) */
button:has(> .mk){position:relative;overflow:visible}
.mk{position:absolute;top:-8px;right:-6px;font-size:.85rem;line-height:1;pointer-events:none}
.mki{font-size:.85em;margin-left:6px}
td.n small.lk{opacity:1;font-size:.55rem}
tr.lockd td{color:var(--muted)}
/* présentation : liste défilante, boutons toujours visibles */
.dlg-in.pm{display:flex;flex-direction:column;max-height:calc(100vh - 32px);padding-bottom:12px}
.pmbody{overflow:auto;margin:0 -4px;padding:0 4px 4px}
.dlg-in.pm .row{margin-top:12px}
.pmhead{text-align:center}
.pmhead .big{margin:0 0 4px}
.pmhead h2{color:var(--ink);font-size:1.3rem;margin:0 0 4px}
.pmhead p{margin:0;color:var(--muted);font-size:.9rem}
.feat{display:flex;gap:10px;align-items:flex-start;padding:8px;border-radius:10px;background:var(--bg)}
.feat+.feat{margin-top:6px}
.feat b{font-size:.95rem}
.feat small{display:block;color:var(--muted);font-size:.78rem;line-height:1.3}
.feat .bico{font-size:1.3rem;flex-basis:28px}
.feat.hl{outline:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--card))}
.dlg-in .freeline{font-size:.82rem;color:var(--muted);margin:12px 0 0}
.price{font-size:.8rem;font-weight:400;display:block;opacity:.9}
/* aperçu flouté des statistiques */
.veil{position:relative}
.veil .blur{filter:blur(5px);opacity:.7;pointer-events:none;user-select:none}
.veil .over{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:0 20px}
.veil .over p{margin:0;font-weight:600}
/* aperçu d'un style premium dans les paramètres */
.preview{border:2px dashed var(--accent2);border-radius:10px;padding:10px 12px;margin-top:10px}
.preview p{margin:0 0 10px;font-size:.92rem}

/* Coach Papayoo : carte de fin de partie et du détail d'une partie de l'historique */
.coach{border:2px solid var(--accent2)}
.coach h3{margin:12px 0 4px;font-size:.9rem}
.co{display:flex;gap:10px;align-items:flex-start;padding:8px;border-radius:10px;background:var(--bg);line-height:1.35}
.co+.co{margin-top:8px}
.coi{font-size:1.2rem;line-height:1.2}
.cf{display:flex;gap:8px;align-items:baseline;padding:4px 0;font-size:.95rem}
.cf span:last-child{color:var(--muted);margin-left:auto;text-align:right}
.coachmore{width:100%;margin-top:10px}

/* Groupes : écran de gestion, filtre de l'historique */
.grow{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.grow:first-of-type{border-top:none}
.grow .gi{flex:1;min-width:0}
.grow .gi small{display:block;color:var(--muted);font-size:.8rem}
.gtag{font-size:.7rem;padding:1px 7px;border-radius:8px;background:var(--bg);color:var(--muted);font-weight:400}
.grow .icon{flex:0 0 44px;font-size:1.2rem}
.garch summary{cursor:pointer;color:var(--muted);padding:4px 0}
.gchips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.gchip{padding:5px 12px;border-radius:16px;font-size:.85rem;background:var(--bg);color:var(--ink);border:1px solid transparent}
.gchip[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.hist .hsum .w small.gname{display:block}

/* Accueil : promesse du carnet et rappel que les données restent sur le téléphone */
.tagline{text-align:center;color:var(--muted);font-size:.9rem;margin:0 0 10px}
.local{text-align:center;color:var(--muted);font-size:.85rem;margin:10px 0 0}