/* Le Duel, kit Koorami. 17/10/2026. */
.duel-home { padding-top: 28px; }
.duel-hero { display:grid; grid-template-columns:1.14fr 1fr; gap:64px; align-items:center; padding:32px 0 60px; }
.duel-intro { font-weight:800; font-size:17px; margin:0 0 20px; }
.duel-copy h1, .duel-pro-page h1 { font-size:clamp(48px,6.8vw,82px); font-weight:900; line-height:.99; letter-spacing:-.055em; margin:0 0 26px; }
.duel-copy h1 span, .duel-how h2 span, .duel-pro-page h1 span { color:var(--rouge); }
.duel-lead { font-size:20px; max-width:480px; line-height:1.5; margin-bottom:26px; }
.duel-copy .bouton { min-height:54px; padding:14px 28px; font-size:19px; }
.duel-join { display:block; margin:18px 0; font-size:15px; }
.duel-free { font-size:14px; color:var(--ardoise); margin:16px 0 8px; }
.duel-store { font-size:14px; text-underline-offset:4px; }
.duel-demo { border-left:1px solid var(--bordure); padding-left:40px; }
.duel-demo-label { font-size:20px; font-weight:900; }
.duel-demo .demo-prono { box-shadow:8px 8px 0 var(--marine); border:2px solid var(--marine); border-radius:12px; width:100%; }
.duel-demo-foot { margin:24px 0 0; font-size:13px; color:var(--ardoise); }
.duel-competitions { padding:28px 0 35px; border-top:2px solid var(--marine); border-bottom:1px solid var(--bordure); }
.duel-competitions h2 { font-size:20px; margin-bottom:20px; }
.duel-leagues { display:flex; flex-wrap:wrap; gap:12px 28px; }
.duel-leagues span { font-size:15px; font-weight:800; }
.duel-proof { display:grid; grid-template-columns:1fr 1.14fr; gap:80px; align-items:center; padding:80px 0; }
.duel-ranking { border:2px solid var(--marine); background:var(--surface); border-radius:12px; overflow:hidden; box-shadow:8px 8px 0 var(--rouge); }
.duel-ranking-top { display:flex; gap:12px; align-items:center; justify-content:space-between; background:var(--marine); color:white; padding:22px; }
.duel-ranking-top span { font-size:12px; }
.duel-ranking ol { margin:0; padding:0 22px; list-style:none; }
.duel-ranking li { display:grid; grid-template-columns:30px 1fr auto; gap:14px; align-items:center; padding:24px 0; border-bottom:1px solid var(--bordure); }
.duel-ranking li:last-child { border-bottom:0; }
.duel-ranking li > span { font-size:20px; font-weight:900; }
.duel-ranking small { display:block; font-weight:500; font-size:12px; }
.duel-ranking li strong { font-size:27px; font-variant-numeric:tabular-nums; text-align:right; }
.duel-ranking li strong small { display:inline; }
.duel-ranking > p { background:var(--rouge-fond); margin:0; padding:18px 22px; font-weight:800; }
.duel-how h2 { font-size:clamp(32px,4vw,46px); letter-spacing:-.04em; font-weight:900; margin-bottom:28px; }
.duel-how ol { list-style:none; counter-reset:etape; padding:0; margin-bottom:30px; }
.duel-how li { counter-increment:etape; margin:0 0 20px; padding-left:40px; position:relative; }
.duel-how li::before { content:counter(etape, decimal-leading-zero); position:absolute; left:0; font-weight:900; color:var(--rouge); }
.duel-how li b { display:block; }
.duel-pro { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:32px; background:var(--surface); border-top:4px solid var(--marine); }
.duel-pro p { max-width:550px; margin:10px 0 0; }
.duel-pro .bouton { flex-shrink:0; }
.duel-pro-page { padding-bottom:40px; }
.duel-pro-page .duel-lead { max-width:700px; }
.duel-pro-grid { display:grid; grid-template-columns:1fr 1fr; border-top:2px solid var(--marine); border-left:1px solid var(--bordure); margin-top:50px; }
.duel-pro-grid article,.duel-pro-grid aside { padding:35px; border-right:1px solid var(--bordure); border-bottom:1px solid var(--bordure); }
.duel-pro-grid article>span { display:block; color:var(--rouge); font-size:32px; font-weight:900; margin-bottom:16px; }
.duel-pro-grid h2 { font-size:27px; }
.duel-pro-grid p { margin:16px 0 24px; }
.duel-pro-grid aside { background:var(--marine); color:white; display:flex; flex-direction:column; justify-content:center; }
.duel-pro-grid aside h2, .duel-pro-grid aside a { color:white; }
.creation-default { padding:16px; background:var(--succes-fond); font-weight:700; margin-top:20px; border-left:3px solid var(--succes); }
.options-jeu { border-top:1px solid var(--bordure); margin:20px 0 26px; }
.options-jeu summary,.regles-repliees summary { cursor:pointer; font-weight:800; padding:16px 0; min-height:48px; }
.empty-join { margin:20px 0 0; }
.groupe-navigation { display:flex; align-items:flex-start; position:sticky; top:0; z-index:30; background:var(--creme); border-bottom:1px solid var(--bordure); }
.groupe-navigation .onglets { position:static; flex:1; margin:0; display:flex; overflow:visible; }
.onglets-principaux .onglet { flex:1; min-height:52px; padding:12px 8px; text-align:center; }
.groupe-plus { position:relative; flex-shrink:0; }
.groupe-plus summary { padding:16px 12px; min-height:52px; font-weight:800; cursor:pointer; }
.groupe-plus>div { position:absolute; top:100%; right:0; width:210px; border:1px solid var(--bordure); background:var(--surface); padding:8px; box-shadow:var(--ombre-carte); }
.groupe-plus .onglet { display:block; width:100%; text-align:left; min-height:48px; }
.regles-repliees { margin:16px auto; padding:0 18px 4px; }
.regles-repliees summary { padding:12px 0; }
.session-joueur .pied-de-page { padding-top:26px; }
.session-joueur .pied-liens { font-size:12px; gap:10px 16px; }
.entete-groupe .champ-invitation { max-width:240px; }
.duel-copy,.duel-demo { animation:duel-enter .45s both; }
.duel-demo { animation-delay:.09s; }
.bouton { transition:transform .15s,background-color .15s; }
.bouton:active { transform:translateY(2px); }
@keyframes duel-enter { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:720px) {
 .duel-home { padding-top:12px; }
 .duel-hero { grid-template-columns:1fr; gap:32px; padding:18px 0 40px; }
 .duel-copy h1 { font-size:clamp(46px,13vw,68px); }
 .duel-intro { font-size:14px; margin-bottom:18px; }
 .duel-lead { font-size:18px; }
 .duel-copy .bouton { width:100%; }
 .duel-demo { border-left:0; padding:0 8px 0 0; }
 .duel-demo .demo-prono { max-width:none; }
 .duel-proof { grid-template-columns:1fr; gap:40px; padding:48px 0; }
 .duel-ranking { margin-right:8px; }
 .duel-pro { flex-direction:column; align-items:stretch; padding:24px; }
 .duel-pro-grid { grid-template-columns:1fr; }
 .duel-pro-page h1 { font-size:44px; }
 .entete { flex-wrap:wrap; gap:12px; }
 .nav-liens { gap:14px; font-size:14px; }
 .marque img { height:28px; }
 .entete-groupe .champ-invitation { display:none; }
 .groupe-navigation { margin-inline:-4px; }
 .onglets-principaux .onglet { font-size:14px; }
 .groupe-plus summary { font-size:13px; }
}
@media(prefers-reduced-motion:reduce) { .duel-copy,.duel-demo { animation:none; } .bouton { transition:none; } }

@media(max-width:720px) {
 .session-joueur .entete { display:flex; flex-wrap:nowrap; padding:14px 0; margin-bottom:8px; }
 .session-joueur .marque img { height:32px; }
 .session-joueur .nav-liens { font-size:12px; gap:12px; }
 .session-joueur .nav-liens a[href="/deconnexion"] { display:none; }
 .session-joueur .entete-groupe { margin-top:4px; margin-bottom:16px; gap:14px; }
 .session-joueur .entete-groupe h1 { font-size:27px; }
 .session-joueur .rappel-notifs { margin:18px 0; }
}

#panneau-classement .affiche-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; padding:18px 0; }
#panneau-classement .affiche-actions .bouton { flex-basis:100%; }
#panneau-classement .affiche-actions .lien-discret { font-size:14px; }

.formulaire-prono input[type="number"] { appearance:textfield; -moz-appearance:textfield; }
.formulaire-prono input[type="number"]::-webkit-inner-spin-button,
.formulaire-prono input[type="number"]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }

.inscription-email { margin:8px 0 18px; }
.inscription-email summary { font-size:14px; }
.inscription-email .aide-champ { margin-top:8px; }