/* Mêmes couleurs que l'app de classement ; clair / sombre selon le téléphone. */
:root{--fond:#f4f5f7;--carte:#fff;--texte:#16181d;--muted:#6b7280;--ligne:#e5e7eb;--accent:#1f3864;--accent-txt:#fff;
--vert:#1e7b45;--vert-c:#e2f0d9;--rouge:#b42318;--rouge-c:#fbe3e1;--orange:#9a5b00;--orange-c:#fff1d6;--champ:#fff;
--jaune-c:#fff3c4;--jaune:#7a5b00}
@media (prefers-color-scheme:dark){:root{--fond:#0f1115;--carte:#191c22;--texte:#eceef2;--muted:#9aa1ad;--ligne:#2a2f38;
--accent:#8fb1ff;--accent-txt:#0f1115;--vert:#5cc98a;--vert-c:#16301f;--rouge:#ff8a80;--rouge-c:#3a1b19;--orange:#f3c26b;
--orange-c:#3a2c10;--champ:#11141a;--jaune-c:#3a300a;--jaune:#ffd54f}}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--texte);font:16px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
header{padding:16px 16px 4px;max-width:760px;margin:auto}
.tete{display:flex;justify-content:space-between;align-items:center;gap:8px}
h1{margin:0;font-size:22px;color:var(--accent)}
h2{margin:0 0 10px;font-size:18px}
h3{margin:16px 0 6px;font-size:14px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.03em}
main{max-width:760px;margin:auto;padding:4px 16px 48px}
a{color:var(--accent)}
.muted{color:var(--muted)}.petit{font-size:13px}
.nav{display:flex;gap:6px;margin:12px 0 4px}
.nav a{flex:1;text-align:center;padding:10px 6px;border-radius:12px;background:var(--carte);border:1px solid var(--ligne);
text-decoration:none;color:var(--texte);font-weight:600;font-size:15px}
.nav a.actif{background:var(--accent);color:var(--accent-txt);border-color:var(--accent)}
.sync{font-size:12px;padding:4px 8px;border-radius:999px;background:var(--carte);border:1px solid var(--ligne);white-space:nowrap}
.sync.horsligne{background:var(--orange-c);color:var(--orange)}
.carte{background:var(--carte);border:1px solid var(--ligne);border-radius:14px;padding:14px;margin:12px 0}
.ligne{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ligne>*{min-width:0}
.espace{justify-content:space-between}
button,.bouton{font:inherit;font-weight:600;font-size:15px;min-height:44px;padding:10px 14px;border-radius:12px;border:1px solid var(--ligne);
background:var(--carte);color:var(--texte);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}
button.principal,.bouton.principal{background:var(--accent);color:var(--accent-txt);border-color:var(--accent)}
button.danger{color:var(--rouge);border-color:var(--rouge)}
button.lien{background:none;border:none;color:var(--accent);padding:6px 4px;min-height:auto}
button:disabled{opacity:.5}
button.large{width:100%}
label{display:block;font-size:14px;font-weight:600;margin:10px 0 4px}
label.case{display:flex;align-items:center;gap:10px;font-weight:400;font-size:15px;margin:0;padding:8px 0;min-height:44px}
input,select,textarea{font:inherit;font-size:16px;width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--ligne);
background:var(--champ);color:var(--texte);min-height:44px}
input[type=checkbox],input[type=radio]{width:22px;height:22px;min-height:auto;flex:none;accent-color:var(--accent)}
textarea{min-height:70px}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.trois{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.deux label,.trois label{margin-top:6px}
.choix{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}
.choix label{margin:0;display:flex;gap:8px;align-items:flex-start;padding:12px;border:1px solid var(--ligne);border-radius:12px;
font-weight:400;cursor:pointer;background:var(--champ)}
.choix label:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.choix b{display:block}
.aide{font-size:13px;color:var(--muted);margin:4px 0 0}
.msg{padding:10px 12px;border-radius:10px;margin:8px 0;font-size:14px}
.msg.info{background:var(--fond);border:1px solid var(--ligne)}
.msg.ok{background:var(--vert-c);color:var(--vert)}
.msg.alerte{background:var(--orange-c);color:var(--orange)}
.msg.erreur{background:var(--rouge-c);color:var(--rouge)}
.liste{list-style:none;margin:0;padding:0}
.liste>li{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--ligne)}
.liste>li:first-child{border-top:none}
.liste .nom{flex:1;min-width:0}
.liste .nom b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge{display:inline-block;font-size:12px;padding:2px 7px;border-radius:999px;background:var(--fond);border:1px solid var(--ligne);
white-space:nowrap;font-weight:600}
.badge.g{background:#e8f0ff;color:#1f3864;border-color:#c7d6f5}
.badge.d{background:#fde9ef;color:#8a1538;border-color:#f3c2d1}
@media (prefers-color-scheme:dark){.badge.g{background:#1b2740;color:#a9c3ff;border-color:#2c3d63}
.badge.d{background:#3a1622;color:#ffb3c8;border-color:#5a2433}}
.absent{opacity:.55}
.toast{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--texte);
color:var(--fond);padding:10px 16px;border-radius:12px;font-size:14px;max-width:calc(100% - 32px);z-index:10;box-shadow:0 4px 18px #0004}
/* Terrains */
.terrain{border:1px solid var(--ligne);border-radius:14px;padding:12px;margin:10px 0;background:var(--carte)}
.terrain .t-nom{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;display:flex;justify-content:space-between}
.equipe{font-size:17px;font-weight:600;margin:4px 0;display:flex;justify-content:space-between;align-items:center;gap:8px}
.equipe .niv{font-size:12px;color:var(--muted);font-weight:400;white-space:nowrap}
.contre{font-size:12px;color:var(--muted);text-align:center;margin:2px 0;letter-spacing:.1em}
.score{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin-top:10px}
.score input{text-align:center;font-size:22px;font-weight:700;padding:8px}
.score .tiret{font-size:20px;color:var(--muted)}
.score-fixe{font-size:20px;font-weight:700;text-align:center;margin-top:6px}
.gagne{color:var(--vert)}
.repos{font-size:14px;color:var(--muted);margin:8px 0}
.onglets{display:flex;gap:6px;margin:12px 0}
.onglets button{flex:1}
.onglets button.actif{background:var(--accent);color:var(--accent-txt);border-color:var(--accent)}
details.carte>summary{cursor:pointer;font-weight:600;list-style-position:inside}
details.carte[open]>summary{margin-bottom:8px}
/* Classement */
.tableau{overflow-x:auto;margin:0 -4px}
table.cl{border-collapse:collapse;width:100%;font-size:14px}
table.cl th,table.cl td{padding:8px 5px;text-align:center;border-bottom:1px solid var(--ligne);white-space:nowrap}
table.cl th{font-size:12px;color:var(--muted);cursor:pointer;user-select:none}
table.cl th.tri::after{content:" ▼";font-size:9px}
table.cl td.n,table.cl th.n{text-align:left;white-space:normal;min-width:90px}
table.cl td.pos{font-weight:700;color:var(--muted)}
table.cl td.pts{font-weight:700}
table.cl tr.podium-1 td.pos{color:#c9a400}table.cl tr.podium-2 td.pos{color:#8a8f98}table.cl tr.podium-3 td.pos{color:#b06a2c}
.col-opt{display:none}
.detail .col-opt{display:table-cell}
.paire-sel{display:grid;grid-template-columns:auto 1fr 1fr;gap:6px;align-items:center;margin:6px 0}
.compte{font-weight:700;color:var(--accent)}
.resume-t{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
@media (max-width:420px){.deux.serre,.trois{grid-template-columns:1fr 1fr}.choix{grid-template-columns:1fr}}