html,body{background:#000;margin:0;height:100%;overflow:hidden}

/* Les anciennes ruptures responsive sont volontairement neutralisees :
   la fenetre ne choisit jamais une autre mise en page. Seul --zoom change. */

/* LA SCENE A UNE RESOLUTION FIXE, COMME UNE CONSOLE.
   Jeremy, 26/09 : « le cadre s adapte bien mais le contenu a l interieur doit
   etre fige aussi. On est pas sur un site internet la, on est sur un jeu fige
   d une console. »

   Il a raison, et la nuance est tout le sujet : figer le RAPPORT ne suffit pas.
   Tant que la mise en page se recalcule, les clamp() changent de valeur, les
   textes se reorganisent, et le jeu n est jamais deux fois identique.

   Ici la page est dessinee UNE SEULE FOIS a 1600 x 1000, et on la ZOOME en bloc
   pour remplir l ecran. Rien ne se recalcule : c est la meme image, plus grande
   ou plus petite. Le facteur est pose par cadrer() dans app.js.
   Les clics restent justes : getBoundingClientRect tient compte du zoom. */
#app{
  position:absolute; left:50%; top:50%;
  width:1600px; height:1000px;      /* 4,00 m x 2,50 m, rapport 1,60 */
  container-type:size;              /* les unites de scene deviennent constantes */
  transform-origin:center center;
  transform:translate(-50%,-50%) scale(var(--zoom,1));
  overflow:hidden;
}
/* La borne d'inscription (/registration) est un ecran portrait (tablette
   verticale, plus haute que large — Jeremy, 13/10/2026 22h), pas un ecran
   Battle City classique. Memes mecanismes (cadrage fige, unites cqw/cqh),
   juste une scene plus etroite et plus haute. Doit rester synchro avec
   SCENE_L/SCENE_H dans app.js. */
#app.kiosk{width:1080px;height:1920px;}

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Inter:wght@400;500;600;700;800&display=swap');
:root{font-family:Inter,Arial,sans-serif;color:#f5f9ff;background:#06111e;font-synthesis:none}*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%;height:100%;overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,input:focus-visible{outline:3px solid #a4ff81;outline-offset:3px}.shell{--accent:#77caff;--accent-2:#38a9ff;--warm:#ffad64;--green:#87f784;position:relative;isolation:isolate;width:100%;height:100%;overflow:hidden;background:#06111e url('./assets/arena.jpg') center/cover no-repeat;}.shell:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,10,19,.58),rgba(3,14,26,.73) 24%,rgba(3,14,26,.76) 75%,rgba(2,10,19,.47)),linear-gradient(0deg,rgba(1,6,14,.53),transparent 30%,rgba(1,7,17,.16));z-index:-1}.shell:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:20;background:repeating-linear-gradient(0deg,transparent 0 4px,rgba(96,178,255,.015) 5px 6px)}.shell.leaving{animation:scene-out .18s ease-in forwards}.shell.entering{animation:scene-in .52s cubic-bezier(.16,1,.3,1)}@keyframes scene-in{from{opacity:.9;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes scene-out{to{opacity:.9;transform:translateY(-6px)}}.ambient{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 24%,rgba(10,76,129,.35),transparent 52%);pointer-events:none}.top-glow{position:absolute;top:0;left:40%;width:20%;height:12%;background:radial-gradient(ellipse at top,rgba(111,197,255,.24),transparent 70%);pointer-events:none}.topbar{position:absolute;top:0;left:0;right:0;height:10.5%;min-height:78px;padding:2.1cqh 3.4cqw;display:flex;align-items:flex-start;justify-content:space-between;z-index:5}.logo{font:italic 900 clamp(25px,2.85cqw,52px)/.85 'Barlow Condensed',Impact,sans-serif;letter-spacing:.035em;text-shadow:0 0 18px rgba(52,134,255,.4);white-space:nowrap}.logo em{font-style:italic;color:#ffbf72;text-shadow:0 0 14px #ff8b3b}.logo small{display:block;font:600 clamp(7px,.74cqw,14px)/1.4 Inter,Arial,sans-serif;letter-spacing:.23em;margin:8px 0 0 6px}.top-status{display:flex;gap:1cqw;align-items:center;font-size:clamp(9px,.82cqw,15px);letter-spacing:.16em;color:#b8d7ef}.top-status strong{font:700 clamp(20px,2.2cqw,40px) 'Barlow Condensed',sans-serif;color:#fff;letter-spacing:.02em;margin-left:1cqw}.status-dot{width:8px;height:8px;background:#82ff84;border-radius:50%;box-shadow:0 0 12px #82ff84}.footer{position:absolute;left:0;right:0;bottom:0;height:9.2%;min-height:62px;padding:0 3.4cqw;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(0deg,rgba(0,4,11,.8),rgba(0,4,11,.25));border-top:1px solid rgba(134,199,255,.16);z-index:4;font-size:clamp(9px,.8cqw,15px);letter-spacing:.15em;color:#a5c0d5}.footer-motto{font-weight:700;letter-spacing:.23em}.control{min-height:42px;padding:.55em 1.2em;background:rgba(3,18,34,.8);color:#eaf6ff;border:1px solid rgba(108,188,255,.5);border-radius:9px;font:700 clamp(12px,1.05cqw,18px) 'Barlow Condensed',sans-serif;letter-spacing:.06em;transition:.2s}.control:hover,.control:focus-visible{background:rgba(19,68,105,.9);box-shadow:0 0 18px rgba(44,143,234,.35)}.page-title{text-align:center;animation:rise .6s .1s both}.kicker{display:block;font-size:clamp(10px,1.05cqw,18px);letter-spacing:.3em;color:#91cfff;font-weight:700}.page-title h1{font:900 clamp(40px,4.1cqw,77px)/1.12 'Barlow Condensed',Impact,sans-serif;letter-spacing:.035em;margin:.1em 0 .14em;padding-bottom:.04em;overflow:visible;text-shadow:0 3px 22px rgba(24,97,193,.4)}/* interligne remonte de 0,94 a 1,06 : a 0,94 la boite etait plus courte que le
   texte (62 px pour 70 px de contenu) et rognait les jambages. Releve le 26/09
   en comparant clientHeight et scrollHeight sur chaque ecran. */.page-title h1 em{font-style:normal;color:#ffbe70}.page-title p{font-size:clamp(12px,1.1cqw,20px);color:#d1e0ee;line-height:1.3;margin:0}.btn{border:1px solid rgba(148,213,255,.52);border-radius:12px;padding:.7em 1.3em;min-height:48px;background:rgba(4,25,44,.8);color:#f6fbff;font:800 clamp(15px,1.5cqw,28px) 'Barlow Condensed',sans-serif;letter-spacing:.04em;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}.btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 0 26px rgba(47,158,255,.5)}.btn.primary{background:linear-gradient(160deg,#196521,#12451c);border:2px solid #b9ff9f;box-shadow:0 0 22px rgba(93,255,99,.38),inset 0 0 25px rgba(104,255,107,.1)}.btn.primary:hover{background:linear-gradient(160deg,#278b30,#155e20);box-shadow:0 0 35px rgba(93,255,99,.58)}.btn.secondary{background:rgba(4,28,51,.88)}.btn.disabled{opacity:.45;box-shadow:none}.btn b{margin-left:1em;font-size:1.2em}.icon{display:block;font:600 clamp(36px,4cqw,72px)/1.2 'Barlow Condensed',sans-serif;color:#e6f4ff;text-shadow:0 0 16px rgba(75,162,255,.5)}@keyframes rise{from{opacity:0;transform:translateY(17px)}to{opacity:1;transform:translateY(0)}}.toast{position:absolute;bottom:10%;left:50%;transform:translate(-50%,20px);min-width:270px;max-width:70cqw;padding:15px 25px;border-radius:10px;border:1px solid #82d6ff;background:#071a2d;color:#fff;font-weight:700;text-align:center;opacity:0;pointer-events:none;z-index:30;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
/* Reachable menus occupy the lower two thirds of the wall. */
.welcome .page-title h1{}.hero-content{position:absolute;left:22%;right:22%;top:23%;bottom:14%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.hero-content .page-title h1{font-size:clamp(60px,6.5cqw,125px);line-height:.82;margin:.18em 0}.hero-content .page-title p{font-size:clamp(15px,1.4cqw,25px)}.hero-actions{margin-top:5cqh}.hero-actions .btn{min-width:28cqw;min-height:72px}.hero-note{margin-top:3cqh;font-size:clamp(9px,.8cqw,15px);color:#80b4dc;letter-spacing:.24em}.checkin-content,.games-content,.settings-content,.found-content,.skills-content,.levels-content,.versus-content,.results-content,.settings-detail{position:absolute;inset:13% 4% 10%;display:flex;flex-direction:column;align-items:center}.checkin-content .page-title{margin-bottom:2.2cqh}.slots{width:min(84cqw,1500px);display:grid;grid-template-columns:repeat(6,1fr);gap:.8cqw}.slot{position:relative;min-width:0;height:clamp(150px,22cqh,250px);padding:1.3cqh .6cqw;background:linear-gradient(145deg,rgba(5,28,48,.94),rgba(5,18,32,.93));border:1px solid #428dcc;border-radius:12px;color:#f6fbff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4cqh;box-shadow:inset 0 0 20px rgba(63,133,199,.08);transition:.2s}.slot:hover{border-color:#8addff;background:#092e4b;transform:translateY(-2px)}.slot.filled{border-color:#65cfff}.slot-number{position:absolute;top:1cqh;font:700 clamp(14px,1.3cqw,25px) 'Barlow Condensed';border:1px solid #5ca9e1;border-radius:8px;padding:.15em .45em}.slot .avatar{margin-top:2cqh}.slot strong{font:800 clamp(17px,1.6cqw,29px) 'Barlow Condensed';text-overflow:ellipsis;overflow:hidden;max-width:100%}.slot small{font-size:clamp(9px,.7cqw,13px);color:#a8c5da}.slot .plus{font:300 clamp(42px,5cqw,80px) Inter;color:#c5e5ff}.slot-remove{position:absolute;top:.6cqh;right:.5cqw;width:26px;height:26px;border:1px solid #87c6f4;border-radius:50%;background:#09263b;color:#fff;font-size:19px;line-height:1}.avatar{flex:none;display:inline-grid;place-items:center;width:clamp(32px,3.2cqw,59px);height:clamp(32px,3.2cqw,59px);border-radius:50%;border:2px solid rgba(175,229,255,.9);background:linear-gradient(145deg,#3c91d4,#123259);box-shadow:0 0 15px rgba(63,181,255,.4);font:800 clamp(14px,1.3cqw,25px) 'Barlow Condensed';color:white}.avatar.large{width:clamp(72px,7cqw,132px);height:clamp(72px,7cqw,132px);font-size:clamp(28px,3cqw,55px)}.avatar-1{background:linear-gradient(145deg,#e88549,#4a264d)}.avatar-2{background:linear-gradient(145deg,#bb90e9,#30457f)}.avatar-3{background:linear-gradient(145deg,#46c9a0,#174d52)}.avatar-4{background:linear-gradient(145deg,#f3be55,#9b4456)}.entry-cards{width:min(84cqw,1500px);display:grid;grid-template-columns:repeat(3,1fr);gap:1.5cqw;margin-top:2.7cqh}.entry-card{height:clamp(110px,16cqh,190px);border:1px solid rgba(121,192,246,.75);background:rgba(6,26,46,.89);border-radius:13px;color:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.6cqh;transition:.2s}.entry-card:hover{transform:translateY(-3px);box-shadow:0 0 27px rgba(51,169,251,.4);border-color:#aff0ff}.entry-card .icon{font-size:clamp(30px,3.1cqw,60px);line-height:1}.entry-card strong{font:800 clamp(16px,1.45cqw,26px) 'Barlow Condensed'}.entry-card span:last-child{font-size:clamp(10px,.83cqw,15px);color:#c2d7e8}.bottom-cta{display:flex;align-items:center;flex-direction:column;gap:1cqh;margin-top:auto;margin-bottom:1.5cqh}.bottom-cta .btn{min-width:25cqw;min-height:clamp(50px,7cqh,85px)}.bottom-cta small{font-size:clamp(10px,.9cqw,16px);color:#c3d4e3}.phone-content{position:absolute;top:15%;bottom:11%;left:28%;right:28%;display:flex;align-items:center;flex-direction:column}.phone-box{width:100%;display:flex;align-items:center;justify-content:center;gap:2cqw;height:clamp(58px,9cqh,100px);margin:3cqh 0 2cqh;border:2px solid #67beff;border-radius:12px;background:rgba(6,29,52,.9);box-shadow:0 0 22px rgba(52,151,246,.4)}.phone-box span{font-size:clamp(17px,1.8cqw,32px);border-right:1px solid #66a9d2;padding-right:1.6cqw}.phone-box strong{font-size:clamp(24px,2.8cqw,48px);letter-spacing:.1em}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:.7cqh .8cqw;width:90%;flex:1;max-height:48cqh}.key{border:1px solid #4d9cda;border-radius:10px;background:rgba(5,29,53,.92);color:#fff;font:700 clamp(24px,2.7cqw,48px) 'Barlow Condensed';transition:.12s}.key:hover{background:#15517b;box-shadow:0 0 18px #367cb9}.key:active{transform:scale(.95)}.key.confirm{background:#1a6b27;border-color:#9fff95;font-size:clamp(17px,1.8cqw,34px);box-shadow:0 0 18px rgba(83,244,91,.4)}.phone-foot{margin:2cqh 0 0;color:#a8c9dd;font-size:clamp(11px,.9cqw,17px)}.found-content .page-title{margin-bottom:4cqh}.found-grid{display:flex;justify-content:center;gap:1.2cqw;width:100%;flex-wrap:wrap}.found-card{width:clamp(150px,14cqw,265px);height:clamp(215px,31cqh,360px);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1cqh;background:rgba(5,25,43,.93);border:1px solid #4f9bd4;border-radius:13px;color:#fff;transition:.2s}.found-card.selected{border:2px solid #a1ff91;box-shadow:0 0 25px rgba(93,239,106,.5)}.found-card:hover{transform:translateY(-4px)}.found-card strong{font:800 clamp(22px,2.1cqw,39px) 'Barlow Condensed'}.found-card small{font-size:clamp(10px,.85cqw,16px);color:#acc9de}.found-card span:last-child{font:700 clamp(13px,1cqw,18px) 'Barlow Condensed';padding:.65em 1em;border:1px solid #5dace4;border-radius:8px;margin-top:1cqh}.found-card.selected span:last-child{background:#21672c;border-color:#a7ff9c}.found-card.add .icon{border:2px solid #9bc9ed;border-radius:50%;width:80px;height:80px;display:grid;place-items:center}.found-content .bottom-cta .control{margin-top:1cqh}.create-content{position:absolute;top:12%;bottom:12%;left:21%;right:21%;display:flex;align-items:center;flex-direction:column}.create-content .page-title{margin-bottom:2cqh}.profile-form{width:100%;flex:1;min-height:0;overflow:auto;padding:2cqh 2cqw;border:1px solid #4f9bce;border-radius:15px;background:rgba(4,20,38,.93);display:flex;flex-direction:column}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2cqh 2cqw}.form-grid label{display:flex;flex-direction:column;gap:.5cqh;font-size:clamp(10px,.82cqw,15px);font-weight:700;letter-spacing:.08em;color:#b6d5e8}.form-grid input{height:clamp(38px,5cqh,58px);background:#09233c;border:1px solid #477ea9;border-radius:8px;color:#fff;padding:0 1cqw;font-size:clamp(14px,1.1cqw,21px)}.form-grid input::placeholder{color:#6f97b4}.avatar-picker{margin:2cqh 0;display:flex;align-items:center;justify-content:space-between;gap:1cqw;color:#b6d5e8;font-size:clamp(10px,.82cqw,15px);font-weight:700;letter-spacing:.08em}.avatar-picker>div{display:flex;gap:.8cqw}.avatar-choice input{position:absolute;opacity:0}.avatar-choice .avatar{font-style:normal}.avatar-choice input:checked+.avatar{outline:3px solid #a3ff91;box-shadow:0 0 19px #86ec7c}.form-footer{display:flex;align-items:center;justify-content:space-between;gap:1cqw;margin-top:auto}.form-footer small{color:#9fc0d7;font-size:clamp(10px,.78cqw,14px);max-width:40%}
.games-content{inset:12% 6% 10%}.player-strip{width:min(82cqw,1400px);min-height:clamp(58px,8cqh,96px);display:flex;align-items:center;justify-content:center;gap:1cqw;border:1px solid #468bc0;border-radius:11px;background:rgba(5,22,38,.88);margin:2.5cqh 0 2cqh;padding:.6cqh 1.5cqw}.player-strip>strong{font:700 clamp(16px,1.5cqw,27px) 'Barlow Condensed';margin-right:1cqw;white-space:nowrap}.player-strip>strong small{color:#83c6ee}.strip-player{display:flex;align-items:center;gap:.35cqw;font:700 clamp(13px,1.1cqw,19px) 'Barlow Condensed';min-width:0}.strip-player .avatar{width:clamp(28px,2.5cqw,47px);height:clamp(28px,2.5cqw,47px)}.strip-add{padding:.7em;border:1px dashed #83bfea;background:transparent;color:#d1e9fa;border-radius:8px;font:700 clamp(11px,.9cqw,16px) 'Barlow Condensed'}.sports-grid{width:min(82cqw,1400px);display:grid;grid-template-columns:repeat(5,1fr);gap:1cqw;flex:1;min-height:0;max-height:42cqh}.sport-card{position:relative;min-width:0;overflow:hidden;display:flex;align-items:center;flex-direction:column;justify-content:center;background:linear-gradient(140deg,rgba(9,53,80,.88),rgba(3,19,34,.96));border:1px solid #549ed0;border-radius:13px;color:#fff;transition:transform .2s,box-shadow .2s,border .2s}.sport-card:hover:not(:disabled){transform:translateY(-5px) scale(1.015);border-color:#b8edff;box-shadow:0 0 27px rgba(68,174,255,.4)}.sport-card.soon{opacity:.66;filter:grayscale(.3)}.sport-art{display:grid;place-items:center;flex:1;width:100%;font-size:clamp(50px,6cqw,105px);text-shadow:0 0 35px #43a8ff;filter:drop-shadow(0 0 20px rgba(65,159,255,.3))}.sport-football{background:linear-gradient(155deg,rgba(13,71,39,.9),rgba(4,23,37,.96))}.sport-tennis{background:linear-gradient(155deg,rgba(18,69,91,.9),rgba(4,23,37,.96))}.sport-basket{background:linear-gradient(155deg,rgba(96,48,19,.9),rgba(4,23,37,.96))}.sport-baseball{background:linear-gradient(155deg,rgba(91,35,53,.8),rgba(4,23,37,.96))}.sport-golf{background:linear-gradient(155deg,rgba(53,53,91,.8),rgba(4,23,37,.96))}.sport-info{display:flex;flex-direction:column;align-items:center;gap:.4cqh;background:rgba(2,12,24,.83);width:100%;padding:1.2cqh .3cqw}.sport-info strong{font:800 clamp(18px,1.8cqw,33px) 'Barlow Condensed';white-space:nowrap}.sport-info small{font-size:clamp(8px,.68cqw,12px);letter-spacing:.08em;color:#b5d5e9;text-align:center}.sport-flag{font:700 clamp(12px,.9cqw,17px) 'Barlow Condensed';color:#9bebff;letter-spacing:.06em;background:#061c30;width:100%;padding:.75cqh}.catalog-foot{display:flex;gap:1cqw;margin-top:2cqh}.catalog-foot .btn{font-size:clamp(13px,1.1cqw,20px)}.settings-content .page-title{margin-bottom:4cqh}.settings-grid{width:min(65cqw,1150px);display:grid;grid-template-columns:repeat(3,1fr);gap:1cqw}.setting-card{height:clamp(130px,20cqh,225px);background:rgba(5,27,48,.92);border:1px solid #4d9bd0;border-radius:12px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1cqh;transition:.2s}.setting-card:hover{transform:translateY(-4px);border-color:#acebff;box-shadow:0 0 24px rgba(37,149,235,.4)}.setting-card .icon{line-height:.9}.setting-card strong{font:800 clamp(19px,1.8cqw,34px) 'Barlow Condensed'}.setting-card small{font-size:clamp(10px,.8cqw,15px);color:#abcde2}.settings-footer{margin-top:3cqh}.settings-footer .btn{font-size:clamp(14px,1.1cqw,20px)}.settings-detail .page-title{margin-bottom:4cqh}.options-grid{width:min(70cqw,1200px);display:grid;grid-template-columns:repeat(4,1fr);gap:1cqw}.option-card{height:clamp(150px,23cqh,270px);background:rgba(6,28,49,.93);border:1px solid #498fca;border-radius:11px;color:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1cqh;transition:.2s}.option-card:hover{transform:translateY(-3px);border-color:#a9e6ff}.option-card.active{border:2px solid #a3ff96;box-shadow:0 0 23px rgba(91,238,87,.5)}.option-card strong{font:800 clamp(17px,1.5cqw,28px) 'Barlow Condensed'}.option-card small{font-size:clamp(10px,.76cqw,15px);color:#bad4e6}.option-card.pink{background:linear-gradient(140deg,#58215d,#081d36)}.option-card.gold{background:linear-gradient(140deg,#66501c,#081d36)}.option-card.neon{background:linear-gradient(140deg,#1d3867,#2f0b5b)}.volume-control{width:min(50cqw,850px);margin-top:5cqh;display:flex;align-items:center;gap:2cqw;font:800 clamp(18px,1.5cqw,28px) 'Barlow Condensed'}.volume-control input{flex:1;accent-color:#63c9ff}.option-note{margin-top:3cqh;color:#8cacc4;font-size:clamp(11px,.8cqw,15px)}.mini-slots{width:min(84cqw,1500px);display:grid;grid-template-columns:repeat(6,1fr);gap:.8cqw}.detail-actions{display:flex;gap:1cqw;margin-top:5cqh}.stats-picker{display:flex;gap:1cqw;margin-bottom:3cqh}.profile-pill{display:flex;align-items:center;gap:.5cqw;padding:.5cqh 1cqw;background:#071e34;color:#fff;border:1px solid #488fcc;border-radius:8px;font-weight:700}.profile-pill.active{border-color:#a4ff91;box-shadow:0 0 14px #4eaf5b}.stats-panel{width:min(66cqw,1150px);height:45cqh;display:grid;grid-template-columns:22% 1fr;gap:1cqw}.stats-identity,.stats-numbers,.history{background:rgba(5,25,44,.9);border:1px solid #4e91c6;border-radius:12px;padding:2cqh 1cqw}.stats-identity{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1cqh}.stats-identity strong{font:800 clamp(20px,1.8cqw,33px) 'Barlow Condensed'}.stats-identity span{font-size:clamp(10px,.8cqw,15px);color:#a9c8db}.stats-numbers{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;text-align:center}.stats-numbers small,.result-summary small{display:block;color:#9fc5df;font-size:clamp(10px,.8cqw,15px);font-weight:700}.stats-numbers strong{display:block;font:800 clamp(23px,2.4cqw,44px) 'Barlow Condensed'}.history{grid-column:2;overflow:auto;margin-top:-1cqw}.history>strong{font:800 clamp(16px,1.3cqw,24px) 'Barlow Condensed'}.history>div{display:flex;justify-content:space-between;border-top:1px solid #2b5675;padding:.7cqh 0;font-size:clamp(11px,.86cqw,16px)}.history p{color:#a7bed0}.empty-message{color:#b6cde0}
.mode-content,.skills-content,.levels-content,.versus-content{position:absolute;inset:14% 9% 10%;display:flex;align-items:center;flex-direction:column}.mode-content .page-title{margin-bottom:5cqh}.mode-grid{width:min(65cqw,1080px);height:45cqh;display:grid;grid-template-columns:repeat(2,1fr);gap:2cqw}.mode-card{border:2px solid #76c7ff;border-radius:16px;color:#fff;background:linear-gradient(150deg,rgba(14,65,80,.88),rgba(3,19,34,.96));display:flex;align-items:center;justify-content:center;flex-direction:column;padding:2cqw;gap:1.5cqh;transition:.2s}.mode-card.training{border-color:#82ff95;background:linear-gradient(150deg,rgba(13,77,42,.88),rgba(3,19,34,.96))}.mode-card.versus{border-color:#ffac69;background:linear-gradient(150deg,rgba(102,45,26,.88),rgba(3,19,34,.96))}.mode-card:hover{transform:translateY(-5px) scale(1.01);box-shadow:0 0 30px rgba(70,196,255,.45)}.mode-card .icon{font-size:clamp(60px,6cqw,110px)}.mode-card strong{font:800 clamp(27px,2.8cqw,52px) 'Barlow Condensed'}.mode-card p{font-size:clamp(12px,1cqw,18px);line-height:1.45;max-width:26ch;margin:0;color:#d1e6f5}.mode-card span:last-child{font:800 clamp(14px,1.2cqw,22px) 'Barlow Condensed';color:#a9ffc0}.skill-grid{display:flex;gap:1cqw;margin-top:4cqh;justify-content:center;width:100%}.skill-card{width:clamp(200px,20cqw,360px);height:clamp(200px,35cqh,400px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2cqh;background:rgba(5,31,51,.91);border:2px solid #80d5ff;border-radius:13px;color:#fff;transition:.2s}.skill-card:hover:not(:disabled){transform:translateY(-4px);box-shadow:0 0 23px #369ddf}.skill-card.locked{opacity:.42}.skill-card strong{font:800 clamp(25px,2.2cqw,42px) 'Barlow Condensed'}.skill-card small{color:#c4d9e8;font-size:clamp(11px,.9cqw,17px);max-width:18ch}.levels-content .page-title{margin-bottom:5cqh}.levels-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1cqw;width:min(75cqw,1250px)}.level-card{height:clamp(170px,30cqh,330px);background:rgba(6,28,50,.92);border:1px solid #5d9fd0;border-radius:12px;color:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1cqh;transition:.2s}.level-card:hover{transform:translateY(-4px);box-shadow:0 0 22px #378aca}.level-card.selected{border:2px solid #a0ff91;box-shadow:0 0 24px rgba(86,231,88,.55)}.level-card small{font-size:clamp(11px,.8cqw,15px);letter-spacing:.15em}.level-card strong{font:900 clamp(60px,6cqw,115px) 'Barlow Condensed';line-height:1}.level-card span{font:800 clamp(14px,1.2cqw,22px) 'Barlow Condensed'}.level-card i{color:#ffcb66;font-style:normal;font-size:clamp(15px,1.5cqw,28px)}.level-note{margin-top:3cqh;font-size:clamp(11px,.95cqw,17px);color:#b7d4e8}.versus-content .player-strip{margin:4cqh 0}.versus-options{width:min(65cqw,1100px);display:grid;grid-template-columns:1.5fr 1fr;gap:2cqw;background:rgba(5,25,43,.9);border:1px solid #4b94cf;border-radius:14px;padding:3cqh 2cqw}.versus-options>div>strong{display:block;font:800 clamp(19px,1.5cqw,27px) 'Barlow Condensed';margin-bottom:1cqh}.segmented{display:flex;gap:.6cqw}.segmented button{flex:1;min-height:clamp(44px,6cqh,75px);border:1px solid #4c93c7;background:#092b48;color:#fff;border-radius:9px;font:700 clamp(13px,1.1cqw,20px) 'Barlow Condensed'}.segmented button.active{background:#12609c;border-color:#a7e7ff;box-shadow:0 0 18px rgba(64,149,231,.55)}
.play-content{position:absolute;inset:12% 3% 9%;display:flex;flex-direction:column}.play-hud{height:13%;min-height:72px;display:flex;justify-content:space-between;align-items:flex-start;gap:1cqw}.play-hud>div:first-child span{display:block;color:#8bd6ff;font:700 clamp(13px,1.1cqw,21px) 'Barlow Condensed'}.play-hud>div:first-child strong{display:block;font:900 clamp(25px,2.7cqw,48px) 'Barlow Condensed'}.play-hud em{color:#8aff8a;font-style:normal;font-size:.6em;margin-left:.6em}.hud-score{display:flex;gap:.7cqw}.hud-score>div{min-width:7.5cqw;padding:.5cqh 1cqw;background:rgba(4,20,36,.88);border:1px solid #4e9bce;border-radius:9px;text-align:center}.hud-score small{display:block;color:#a4cce4;font:700 clamp(10px,.8cqw,15px) 'Barlow Condensed'}.hud-score strong{font:900 clamp(20px,2cqw,36px) 'Barlow Condensed'}.play-surface{position:relative;flex:1;min-height:0;overflow:hidden;border:2px solid #4bace8;border-radius:12px;background:radial-gradient(ellipse at 50% 100%,#167443 0,#0d3a32 35%,#071e2c 80%);box-shadow:inset 0 0 70px #001625,0 0 25px rgba(21,126,221,.35);touch-action:none}.play-surface:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,29,66,.38),transparent 50%),repeating-linear-gradient(90deg,transparent 0 9.9%,rgba(210,255,232,.045) 10% 10.1%);pointer-events:none}.scene-tennis{background:linear-gradient(180deg,#071a3d 0,#0e4c7a 55%,#145768 56%,#10394e 100%)}.scene-basket{background:linear-gradient(180deg,#11172a 0,#432c35 65%,#7c4c25 100%)}.football-field,.tennis-field,.basket-field{position:absolute;inset:0;pointer-events:none}.goal-frame{position:absolute;inset:8% 10% 10%;border:clamp(7px,.7cqw,13px) solid #e3f4ff;border-bottom-width:6px;box-shadow:0 0 18px #82cfff,inset 0 0 15px #7bbfff;background:linear-gradient(180deg,rgba(3,39,71,.25),rgba(1,10,26,.1))}.net{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 3.7%,rgba(173,221,241,.27) 3.8% 3.9%),repeating-linear-gradient(0deg,transparent 0 7%,rgba(173,221,241,.27) 7.2% 7.4%)}.tennis-floor{position:absolute;inset:57% 5% 0;border:2px solid rgba(207,244,255,.7);transform:perspective(400px) rotateX(18deg);background:repeating-linear-gradient(90deg,transparent 0 24%,rgba(228,246,255,.2) 25% 25.2%)}.tennis-net{position:absolute;top:53%;height:18%;left:0;right:0;border-top:8px solid #f1fcff;border-bottom:4px solid #d7f5ff;background:repeating-linear-gradient(90deg,rgba(163,224,245,.5) 0 2px,transparent 2px 15px),repeating-linear-gradient(0deg,rgba(163,224,245,.5) 0 2px,transparent 2px 15px);box-shadow:0 0 22px #59b9ff}.corridor{position:absolute;top:39%;height:13%;border:3px solid #9affb0;border-radius:12px;transform:translateX(-50%);background:rgba(70,255,131,.19);box-shadow:0 0 30px #62ff8d}.basket-board{position:absolute;top:10%;width:34%;height:45%;border:clamp(8px,.7cqw,14px) solid #eaf5ff;background:repeating-linear-gradient(90deg,rgba(174,208,229,.13) 0 1px,transparent 1px 12px),linear-gradient(130deg,rgba(235,247,255,.18),rgba(123,165,193,.08));box-shadow:0 0 27px #74cfff;transform-origin:top}.basket-square{position:absolute;top:29%;left:31%;width:38%;height:42%;border:7px solid #ffdeae}.basket-rim{position:absolute;top:72%;left:29%;width:42%;height:12%;border:clamp(7px,.6cqw,13px) solid #ff8c43;border-radius:50%;box-shadow:0 0 22px #ff7334}.basket-net{position:absolute;top:82%;left:33%;width:34%;height:27%;clip-path:polygon(0 0,100% 0,72% 100%,28% 100%);background:repeating-linear-gradient(90deg,transparent 0 15%,rgba(250,249,239,.8) 16% 17%),repeating-linear-gradient(0deg,transparent 0 26%,rgba(250,249,239,.8) 27% 28%)}.target-ring{position:absolute;width:var(--target-size);height:var(--target-size);transform:translate(-50%,-50%);border:5px solid #b0fcff;border-radius:50%;box-shadow:0 0 6px #fff,0 0 23px #39adff,inset 0 0 18px #5fc7ff;animation:pulse 1.6s ease-in-out infinite;pointer-events:none}.target-ring:before{content:'';position:absolute;inset:22%;border:3px solid #fff;border-radius:50%;background:rgba(80,182,250,.27)}@keyframes pulse{50%{box-shadow:0 0 15px #fff,0 0 43px #39adff,inset 0 0 35px #5fc7ff;transform:translate(-50%,-50%) scale(1.07)}}.impact{position:absolute;z-index:7;transform:translate(-50%,-50%);font:900 clamp(22px,3cqw,54px) 'Barlow Condensed';pointer-events:none;animation:impact-pop .8s forwards;text-shadow:0 0 15px currentColor}.impact.hit{color:#a0ff8e}.impact.miss{color:#ff9f8b}@keyframes impact-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}100%{opacity:0;transform:translate(-50%,-100%) scale(1)}}.falling-ball{position:absolute;top:36%;left:50%;font-size:clamp(30px,4cqw,70px);animation:ball-fall .8s forwards;pointer-events:none}@keyframes ball-fall{from{transform:translate(-50%,-40px) scale(1.5);opacity:1}to{transform:translate(-50%,180px) scale(.4);opacity:0}}.play-instruction{position:absolute;bottom:3%;left:50%;transform:translateX(-50%);white-space:nowrap;padding:.4em 1em;border-radius:8px;background:rgba(0,11,26,.67);color:#d7f1ff;font:800 clamp(12px,1.1cqw,21px) 'Barlow Condensed';letter-spacing:.1em}.play-bar{height:8%;min-height:45px;display:flex;align-items:center;justify-content:space-between;color:#d0e9f8;font:700 clamp(13px,1.1cqw,20px) 'Barlow Condensed'}.shot-track{display:flex;gap:.5cqw}.shot-track i{display:block;width:clamp(10px,1cqw,19px);height:clamp(10px,1cqw,19px);border:1px solid #78a9ca;border-radius:50%}.shot-track i.hit{background:#7eff8b;box-shadow:0 0 8px #7eff8b}.shot-track i.miss{background:#d46b69}.shot-track i.now{border:2px solid #c2ffbc;box-shadow:0 0 10px #a0ff91}.results-content .page-title{margin-bottom:3cqh}.result-main{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:1.2cqw;width:min(80cqw,1400px);height:45cqh}.result-badge,.result-ranking,.result-summary{background:rgba(4,24,43,.91);border:1px solid #549ccc;border-radius:13px;padding:1.5cqw}.result-badge{display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:clamp(75px,8cqw,145px);color:#ffd479;text-shadow:0 0 30px #ffa531}.result-badge small{display:block;font:800 clamp(17px,1.4cqw,27px) 'Barlow Condensed';color:#fff;text-shadow:none;text-align:center}.result-ranking{display:flex;flex-direction:column;justify-content:center;gap:1cqh}.rank{height:clamp(48px,7cqh,82px);display:flex;align-items:center;gap:1cqw;padding:.5cqh 1cqw;border:1px solid #3977a1;border-radius:9px;background:#082b49}.rank-1{border-color:#e1b75f;background:linear-gradient(90deg,#735624,#132942)}.rank>b{font:900 clamp(20px,2cqw,38px) 'Barlow Condensed';color:#ffcf68}.rank strong{flex:1;font:800 clamp(18px,1.7cqw,32px) 'Barlow Condensed'}.rank>span{font:900 clamp(20px,2cqw,37px) 'Barlow Condensed'}.rank>span small{font-size:.45em;color:#a2c1da}.result-summary{display:grid;grid-template-columns:repeat(2,1fr);gap:1cqw;align-items:center;text-align:center}.result-summary strong{display:block;font:800 clamp(19px,1.8cqw,34px) 'Barlow Condensed';margin-top:.4cqh}.result-actions{display:flex;gap:1cqw;margin-top:3cqh}.result-actions .btn{font-size:clamp(14px,1.2cqw,23px)}
.theme-pink{--accent:#fa8dec}.theme-pink:before{background:linear-gradient(90deg,rgba(28,3,31,.72),rgba(22,4,36,.78),rgba(18,5,38,.7)),linear-gradient(0deg,#120619,transparent 45%)}.theme-gold{--accent:#ffcf70}.theme-gold:before{background:linear-gradient(90deg,rgba(27,17,3,.69),rgba(30,23,5,.78),rgba(20,12,5,.7)),linear-gradient(0deg,#15100a,transparent 45%)}.theme-neon{--accent:#bb83ff}.theme-neon:before{background:linear-gradient(90deg,rgba(8,2,42,.7),rgba(12,4,41,.76),rgba(7,4,38,.73)),linear-gradient(0deg,#080727,transparent 45%)}.accessibility-contrast button{border-width:2px!important}.accessibility-large{font-size:115%}.accessibility-compact .page-title{transform:scale(.9)}
/* ⚠ Cette regle « ecran etroit » rendait la scene a la taille de la fenetre :
   en portrait, elle affichait du 0,67 au lieu du 1,60. Le format est fige,
   donc elle ne touche plus #app — seulement le document autour. */
@media(max-width:0px){html,body{overflow:hidden}.shell{min-height:850px;height:auto;min-height:100cqh;overflow:auto}.topbar{position:relative;height:auto;min-height:70px}.footer{position:relative;height:65px;margin-top:25px}.checkin-content,.games-content,.settings-content,.found-content,.skills-content,.levels-content,.versus-content,.results-content,.settings-detail,.create-content,.phone-content,.mode-content,.play-content{position:relative;inset:auto;left:auto;right:auto;top:auto;bottom:auto;margin:25px auto;width:94%;min-height:650px}.slots,.mini-slots{grid-template-columns:repeat(3,1fr);width:100%}.entry-cards{width:100%}.sports-grid{grid-template-columns:repeat(3,1fr);max-height:none}.sport-card{min-height:210px}.settings-grid{width:100%}.options-grid{grid-template-columns:repeat(2,1fr);width:100%}.hero-content{position:relative;inset:auto;min-height:70cqh}.phone-content{max-width:600px}.mode-grid{width:90%}.levels-grid{width:100%}.found-grid{width:100%}.profile-form{min-height:540px}.result-main{width:100%}.player-strip{width:100%;flex-wrap:wrap}.play-content{height:750px}.stats-panel{width:100%}}
@media(max-width:0px){.logo{font-size:27px}.top-status span:not(.status-dot){display:none}.top-status strong{font-size:21px}.page-title h1{font-size:38px}.slots,.mini-slots{grid-template-columns:repeat(2,1fr)}.entry-cards,.settings-grid{grid-template-columns:repeat(2,1fr)}.entry-card{height:125px}.sports-grid{grid-template-columns:repeat(2,1fr)}.sport-card{min-height:180px}.mode-grid{grid-template-columns:1fr;height:auto}.mode-card{min-height:240px}.skill-grid{flex-wrap:wrap}.levels-grid{grid-template-columns:repeat(2,1fr)}.level-card{height:190px}.form-grid{grid-template-columns:1fr}.create-content{min-height:850px}.form-footer{flex-direction:column}.form-footer small{max-width:none}.result-main{grid-template-columns:1fr;height:auto}.result-badge{display:none}.result-ranking,.result-summary{min-height:180px}.result-actions{flex-wrap:wrap}.versus-options{width:100%;grid-template-columns:1fr}.phone-content{width:94%}.phone-box{margin:20px 0}.keypad{min-height:380px}.found-card{width:42cqw}.footer-motto{display:none}.settings-shortcut{font-size:11px}.play-hud{height:115px}.hud-score>div{min-width:63px}.hud-score small{font-size:8px}.hud-score strong{font-size:16px}.play-instruction{font-size:11px;white-space:normal;text-align:center}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.sport-football,.sport-tennis,.sport-basket{background-size:cover;background-position:center}.sport-football{background-image:linear-gradient(180deg,transparent 45%,rgba(0,10,22,.8) 90%),url('./assets/football-card.jpg')}.sport-tennis{background-image:linear-gradient(180deg,transparent 45%,rgba(0,10,22,.8) 90%),url('./assets/tennis-card.jpg')}.sport-basket{background-image:linear-gradient(180deg,transparent 45%,rgba(0,10,22,.8) 90%),url('./assets/basket-card.jpg')}.sport-football .sport-art,.sport-tennis .sport-art,.sport-basket .sport-art{font-size:0}.sport-football .sport-info,.sport-tennis .sport-info,.sport-basket .sport-info{background:rgba(2,12,24,.87)}
.status-dot.local{background:#ffbf67;box-shadow:0 0 12px #ffbf67}.option-card.unavailable{opacity:.45;cursor:not-allowed}
.team-preview{display:grid;grid-template-columns:1fr 1fr;gap:1cqw;width:min(65cqw,1100px);margin-top:2cqh}.team-preview>div{min-height:9cqh;padding:1cqh 1cqw;border:1px solid #68bdff;border-radius:10px;background:rgba(5,35,68,.87);display:flex;align-items:center;gap:.7cqw;flex-wrap:wrap}.team-preview>div:nth-child(2){border-color:#ff9f6d;background:rgba(67,30,15,.85)}.team-preview strong{font:800 clamp(16px,1.3cqw,24px) 'Barlow Condensed';margin-right:auto}.team-preview span{display:flex;align-items:center;gap:.3cqw;font:700 clamp(12px,.9cqw,17px) 'Barlow Condensed'}.team-preview .avatar{width:29px;height:29px;font-size:14px}.team-result{width:min(80cqw,1400px);display:flex;align-items:center;justify-content:space-between;padding:.5cqh 2cqw;margin-bottom:1cqh;border:1px solid #78b9dd;border-radius:9px;background:rgba(5,26,48,.93);font:800 clamp(15px,1.3cqw,25px) 'Barlow Condensed'}.team-result span:first-child{color:#75caff}.team-result span:last-child{color:#ffae72}.team-result b{font-size:1.5em;margin-left:.7cqw}.team-result strong{color:#fff;font-size:1.5em}@media(max-width:0px){.team-preview{width:100%;grid-template-columns:1fr}.team-result{width:100%;font-size:11px}.team-result strong{font-size:14px}}
.level-card.locked{opacity:.42;cursor:not-allowed;box-shadow:none!important;transform:none!important}.result-badge>span{font-size:.52em;white-space:nowrap;letter-spacing:-.1em}
.session-clock{color:#a8ff9e!important;border:1px solid rgba(121,239,140,.55);border-radius:7px;padding:.4em .7em;font:800 clamp(11px,.85cqw,16px) 'Barlow Condensed',sans-serif;white-space:nowrap}
.target-ring{border-radius:50%}.target-ring.target-corridor{border-radius:12px;border-color:#b7ffd0;box-shadow:0 0 20px #52e989,inset 0 0 18px #52e989;animation:corridor-pulse 1.6s ease-in-out infinite}.target-ring.target-corridor:before{border-radius:5px}@keyframes corridor-pulse{50%{filter:brightness(1.45);transform:translate(-50%,-50%) scale(1.02)}}
.corridor{transform:translate(-50%,-50%)}.shot-marker{position:absolute;z-index:4;width:clamp(10px,1.4cqw,25px);height:clamp(10px,1.4cqw,25px);border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 12px currentColor}.shot-marker.hit{background:#86ff8b;color:#86ff8b}.shot-marker.miss{background:#ff8776;color:#ff8776}.shot-marker.baseball{z-index:6;width:clamp(18px,2.1cqw,38px);height:clamp(18px,2.1cqw,38px);border:clamp(2px,.2cqw,4px) solid #fff;background:radial-gradient(circle,#fff 0 16%,currentColor 18% 43%,rgba(2,13,24,.28) 46% 100%);box-shadow:0 0 0 clamp(2px,.25cqw,5px) rgba(2,13,24,.38),0 0 18px currentColor;opacity:.9}.shot-marker.baseball.hit{color:#76ecff}.shot-marker.baseball.miss{color:#ff8776}.shot-marker.baseball.home-run{color:#79d8ff;animation:baseball-impact-pulse .65s ease-out both}@keyframes baseball-impact-pulse{0%{transform:translate(-50%,-50%) scale(1.8);opacity:.2}55%{opacity:1}100%{transform:translate(-50%,-50%) scale(1);opacity:.9}}
@media(max-width:0px){html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}#app{height:auto;min-height:100cqh;overflow:visible}.shell{height:650px;min-height:650px;overflow:hidden}}
.birth-field{display:flex;flex-direction:column;gap:.5cqh;font-size:clamp(10px,.82cqw,15px);font-weight:700;letter-spacing:.08em;color:#b6d5e8}.birth-trigger{height:clamp(44px,5cqh,60px);padding:0 1cqw;display:flex;align-items:center;justify-content:space-between;text-align:left;background:#09233c;border:1px solid #477ea9;border-radius:8px;color:#fff;font-size:clamp(14px,1.1cqw,21px);letter-spacing:0}.birth-trigger:hover{border-color:#9bdfff;background:#123656}.birth-trigger b{color:#9fe1ff}
/* Borne : date de naissance en 3 champs inline (jour / mois / annee), voir
   birthFieldHtml() dans app.js — remplace le bouton + la fiche plein ecran.
   Les 3 champs sont le MEME composant (bouton + liste maison), meme largeur,
   meme style bleu du decor — demande explicite de Jeremy 14/10/2026 05h16
   (uniformite jour/mois/annee, fini la case fine/grise pour l'annee). */
.birth-inline{display:flex;gap:.8cqw;width:100%}
.birth-select.birth-dd-trigger{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:center;flex:1;min-width:0;height:clamp(44px,5cqh,60px);background:#09233c;border:1px solid #477ea9;border-radius:8px;color:#fff;font-size:clamp(14px,1.1cqw,21px);padding:0 .6cqw;letter-spacing:0;cursor:pointer;gap:.4em}
.birth-select.birth-dd-trigger:after{content:'▾';font-size:.75em;opacity:.75;line-height:1}
.birth-select.birth-dd-trigger:hover,.birth-select.birth-dd-trigger[aria-expanded="true"]{border-color:#9bdfff;background:#123656}
/* Le panneau #birth-dd est un enfant de .shell, positionne en JS juste sous
   le bouton clique (meme largeur) — voir renderBirthDropdown() dans app.js,
   qui compense le zoom de la scene pour tomber au bon endroit. Liste assez
   grande et lisible pour un doigt sur tablette : lignes hautes, texte a la
   taille du reste du design, defilement lisse. */
#birth-dd{position:absolute;inset:0;z-index:40}
.birth-dd-backdrop{position:absolute;inset:0}
.birth-dd-list{position:absolute;z-index:1;max-height:38cqh;overflow-y:auto;scroll-behavior:smooth;overscroll-behavior:contain;display:flex;flex-direction:column;gap:3px;background:#09233c;border:1px solid #477ea9;border-radius:10px;padding:6px;box-shadow:0 10px 26px rgba(0,3,10,.55)}
.birth-dd-list button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;min-height:clamp(46px,5.4cqh,64px);text-align:center;color:#dff0ff;font:700 clamp(16px,1.3cqw,24px) 'Barlow Condensed',sans-serif;padding:.3em .6em;border-radius:7px}
.birth-dd-list button:hover,.birth-dd-list button:focus-visible{background:#15517b}
.birth-dd-list button.active{background:#1a6b27;color:#fff;font-weight:800}
.phone-box strong.is-empty{color:#96b8cd;font-size:clamp(20px,2cqw,35px);letter-spacing:.08em}.phone-hint{margin:-1cqh 0 1.2cqh;color:#d0e6f3;font-size:clamp(13px,1cqw,19px);text-align:center}.phone-hint strong{color:#a8ff9e}
.birth-overlay{position:absolute;z-index:50;inset:0;display:grid;place-items:center;padding:18px;background:rgba(1,8,19,.86);backdrop-filter:blur(10px)}.birth-dialog{width:min(78cqw,1000px);max-height:calc(100% - 28px);overflow:auto;padding:clamp(20px,2.1cqw,40px);background:linear-gradient(140deg,#092e50,#071728);border:2px solid #85cfff;border-radius:20px;box-shadow:0 0 65px rgba(32,147,237,.38)}.birth-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.birth-heading span{color:#98dfff;font:700 clamp(12px,1cqw,18px) 'Barlow Condensed';letter-spacing:.18em}.birth-heading h2{margin:.2em 0;font:900 clamp(30px,3cqw,56px) 'Barlow Condensed';line-height:1}.birth-close{width:52px;height:52px;flex:none;background:#0b2d4b;border:1px solid #74b9eb;border-radius:10px;color:#fff;font-size:34px;line-height:1}.birth-progress{display:flex;gap:10px;margin:14px 0 22px;flex-wrap:wrap}.birth-progress span{padding:.55em .8em;color:#a4c3d8;background:#09243c;border:1px solid #416e92;border-radius:8px;font:800 clamp(12px,1cqw,18px) 'Barlow Condensed'}.birth-progress span.active{color:#d5ffcd;border-color:#98ec8d;background:#174625}.birth-grid{display:grid;gap:8px}.birth-days{grid-template-columns:repeat(7,1fr)}.birth-months{grid-template-columns:repeat(3,1fr)}.birth-grid button,.birth-keypad button{min-height:clamp(52px,5.5cqh,72px);padding:5px;background:#0b3558;border:1px solid #6aa6d2;border-radius:9px;color:#fff;font:800 clamp(19px,1.7cqw,31px) 'Barlow Condensed'}.birth-months button{font-size:clamp(16px,1.4cqw,25px)}.birth-grid button:hover:not(:disabled),.birth-keypad button:hover{background:#176294;border-color:#bcefff}.birth-grid button:disabled{opacity:.3}.birth-year{display:flex;flex-direction:column;align-items:center;gap:12px}.birth-year label{font:800 clamp(17px,1.4cqw,26px) 'Barlow Condensed'}.birth-year input{width:min(100%,320px);height:70px;text-align:center;background:#061d34;border:2px solid #8bd2ff;border-radius:10px;color:#fff;font:900 40px 'Barlow Condensed';letter-spacing:.2em}.birth-keypad{width:min(100%,320px);display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.birth-keypad button{min-height:54px}.birth-error{min-height:1.4em;margin:0;color:#ffab9e;font-weight:700}.birth-actions{display:flex;justify-content:center;gap:14px;margin-top:24px}.birth-actions .btn{min-width:180px}
@media(max-width:0px){.birth-dialog{width:100%;padding:18px}.birth-days{gap:5px}.birth-days button{min-height:48px;font-size:19px}.birth-months{grid-template-columns:repeat(2,1fr)}.birth-progress{gap:5px}.birth-progress span{font-size:11px}.birth-actions .btn{min-width:0}}

.hud-score .hud-active-player{border-color:#9cff9a;background:rgba(14,66,39,.9);box-shadow:0 0 18px rgba(105,239,107,.25);min-width:clamp(105px,11cqw,210px)}.hud-active-player strong{color:#e7ffdf}.hud-score .hud-timer{border-color:#f5c67a;min-width:clamp(86px,8cqw,150px)}.hud-timer strong{color:#ffe09a}.hud-timer strong.urgent{color:#ff8b74}

/* Basketball: the painted backboard square is the actual hit area. */
.menu-shortcut{flex:none;min-height:38px;padding:.35em .9em;border:1px solid #70c1f4;border-radius:8px;background:rgba(3,25,46,.9);color:#e7f6ff;font:800 clamp(12px,1cqw,18px) 'Barlow Condensed',sans-serif;letter-spacing:.09em;box-shadow:0 0 16px rgba(43,145,228,.2)}
.menu-shortcut:hover{background:#15547b;border-color:#b4e7ff}
.scene-basket{background:#08192c url('./assets/basket-court.jpg') center center/cover no-repeat;border-color:#e5a361;box-shadow:inset 0 0 80px #010917,0 0 24px rgba(255,135,47,.28)}
.scene-basket:before{background:linear-gradient(180deg,rgba(2,10,24,.13),transparent 45%,rgba(1,8,18,.18));z-index:1}
.basket-view-side{background-position:61% center;background-size:115% auto}
.basket-view-far{background-position:39% center;background-size:100% auto}
.basket-field{z-index:2}
.basket-backboard{position:absolute;border:clamp(5px,.48cqw,10px) solid #e7f0f9;border-radius:4px;background:linear-gradient(125deg,rgba(84,122,151,.92),rgba(15,42,69,.97) 45%,rgba(41,68,96,.94));box-shadow:0 0 0 3px rgba(16,35,51,.95),0 0 24px rgba(233,246,255,.8),0 22px 30px rgba(0,4,13,.75),inset 0 0 24px rgba(177,217,244,.4);transform:perspective(900px) rotateY(0deg);transition:left .35s,top .35s,width .35s,height .35s}
.basket-view-side .basket-backboard{transform:perspective(900px) rotateY(-12deg)}
.basket-view-far .basket-backboard{box-shadow:0 0 0 2px #122b3d,0 0 15px rgba(233,246,255,.7),0 14px 20px rgba(0,4,13,.7),inset 0 0 18px rgba(177,217,244,.3)}
.basket-glass{position:absolute;inset:0;background:linear-gradient(130deg,rgba(233,247,255,.22),transparent 32%),repeating-linear-gradient(90deg,transparent 0 18%,rgba(207,237,255,.055) 18.2% 18.5%);box-shadow:inset 0 0 0 2px rgba(231,246,255,.35)}
.basket-target{position:absolute;box-sizing:border-box;border:clamp(3px,.32cqw,6px) solid rgba(234,246,255,.72);border-radius:2px}
.basket-target.basket-outer{left:35%;top:14%;width:30%;height:56%}
.basket-target.basket-inner{left:41%;top:26%;width:18%;height:33%;border-width:clamp(2px,.25cqw,5px)}
.basket-target.active{z-index:2;border-color:#ffac4f;background:rgba(255,144,39,.22);box-shadow:0 0 0 2px rgba(255,194,95,.48),0 0 22px #ff982d,inset 0 0 25px rgba(255,145,43,.34);animation:basket-square-glow 1.8s ease-in-out infinite}
.basket-target.basket-outer.active+.basket-inner{border-color:rgba(255,246,230,.45)}
@keyframes basket-square-glow{50%{box-shadow:0 0 0 3px rgba(255,194,95,.58),0 0 35px #ff9c39,inset 0 0 30px rgba(255,145,43,.42)}}
.basket-rim{position:absolute;z-index:4;top:75%;left:30%;width:40%;height:15%;border:clamp(5px,.52cqw,10px) solid #ff842d;border-radius:50%;background:radial-gradient(ellipse,rgba(2,16,29,.86) 40%,transparent 45%);box-shadow:0 2px 0 #9c3e13,0 0 17px rgba(255,117,24,.8)}
.basket-rim:before{content:'';position:absolute;left:44%;top:-43%;height:54%;width:12%;border-radius:3px;background:#f7e9d8;box-shadow:0 0 10px #fff}
.basket-net{position:absolute;z-index:3;top:84%;left:35%;width:30%;height:32%;clip-path:polygon(0 0,100% 0,72% 100%,28% 100%);background:repeating-linear-gradient(68deg,transparent 0 13%,rgba(248,251,255,.95) 13.5% 15%),repeating-linear-gradient(-68deg,transparent 0 13%,rgba(248,251,255,.95) 13.5% 15%);filter:drop-shadow(0 4px 2px #071421)}
.basket-view-label{position:absolute;bottom:5%;right:3%;padding:.42em .8em;border:1px solid rgba(255,174,98,.5);border-radius:6px;background:rgba(2,14,29,.79);color:#ffcf9b;font:800 clamp(12px,1.12cqw,20px) 'Barlow Condensed';letter-spacing:.16em}
.basket-shot-ball{position:absolute;z-index:5;left:50%;top:42%;width:clamp(19px,2.1cqw,43px);aspect-ratio:1;border:2px solid #552008;border-radius:50%;background:linear-gradient(90deg,transparent 46%,#3d1b0e 47% 51%,transparent 52%),linear-gradient(0deg,transparent 46%,#3d1b0e 47% 51%,transparent 52%),radial-gradient(circle at 30% 25%,#ffc06e,#d96518 56%,#6f290b);box-shadow:inset -5px -7px 8px rgba(60,15,0,.45),0 0 12px rgba(255,159,59,.75);animation:basket-score-fall .8s cubic-bezier(.4,0,.8,.8) forwards}
.basket-shot-ball:before,.basket-shot-ball:after{content:'';position:absolute;inset:2px;border:2px solid #4e200e;border-radius:50%}
.basket-shot-ball:before{transform:scaleX(.48)}.basket-shot-ball:after{transform:scaleY(.48)}
@keyframes basket-score-fall{0%{top:42%;opacity:1;transform:translate(-50%,-50%) scale(1.2)}25%{top:68%;opacity:1;transform:translate(-50%,-50%) scale(1.05)}60%{top:86%;opacity:1;transform:translate(-50%,-50%) scale(.78)}100%{top:125%;opacity:0;transform:translate(-50%,-50%) scale(.48)}}
@media(max-width:0px){.top-status>span:not(.session-clock):not(.status-dot){display:none}.top-status .status-dot{display:none}.menu-shortcut{min-height:34px}.scene-basket{background-size:cover}.basket-view-side{background-size:115% auto}.basket-view-label{font-size:11px}}

/* Immersive, full-wall play view: only a slim overlay sits above the field. */
.shell.in-game{min-height:0;height:100cqh;overflow:hidden}
.shell.in-game .topbar,.shell.in-game .footer{display:none}
.in-game .play-content{position:absolute;inset:0;width:100%;height:100%;min-height:0;margin:0;display:block}
.in-game .play-surface{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;box-shadow:none}
.in-game .play-surface:before{z-index:1;pointer-events:none}
.in-game .scene-football{background:#09223b url('./assets/football-stadium.jpg') center center/cover no-repeat}
.in-game .football-view-near{background-size:130% auto;background-position:center 53%}
.in-game .football-view-side,.in-game .football-view-side-left{background-size:112% auto}
.in-game .football-view-far{background-size:100% auto}
.in-game .scene-football:before{background:linear-gradient(180deg,rgba(0,9,24,.63),transparent 16%,transparent 75%,rgba(0,12,25,.25))}
.football-goal{position:absolute;filter:drop-shadow(0 9px 12px rgba(0,8,12,.7));pointer-events:none}
.football-goal img{display:block;width:100%;height:100%;object-fit:fill}
.football-goal-side-left img{transform:scaleX(-1)}
.in-game .target-ring{z-index:4;pointer-events:none}
.in-game .scene-tennis{background:#082846 url('./assets/padel-court.jpg') center center/cover no-repeat}
.in-game .tennis-view-midcourt{background-size:113% auto;background-position:center 52%}
.in-game .tennis-view-near-net{background-size:128% auto;background-position:center 54%}
.in-game .scene-tennis:before{background:linear-gradient(180deg,rgba(0,9,24,.6),transparent 16%,transparent 75%,rgba(0,10,26,.1))}
.in-game .tennis-field .corridor{z-index:3;border-color:#b1ffa9;background:rgba(53,232,101,.26);box-shadow:0 0 20px #68ff88,inset 0 0 14px rgba(119,255,149,.32)}
.in-game .scene-basket{background-size:cover;background-position:center center}
.in-game .basket-view-center{background-size:130% auto;background-position:center 54%}
.in-game .basket-view-side{background-size:114% auto;background-position:60% 53%}
.in-game .basket-view-far{background-size:100% auto;background-position:43% center}
.play-hud{position:absolute;z-index:10;top:0;left:0;right:0;height:clamp(53px,7cqh,76px);min-height:0;padding:0 clamp(12px,1.3cqw,28px);display:flex;align-items:stretch;justify-content:flex-end;gap:0;background:linear-gradient(180deg,rgba(2,12,26,.95),rgba(2,15,30,.82));border-bottom:1px solid rgba(163,220,255,.4);box-shadow:0 3px 16px rgba(0,5,14,.3)}
.play-hud>div{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 clamp(9px,1.4cqw,27px);border-left:1px solid rgba(148,205,242,.26);text-align:center}
.play-hud small{display:block;color:#b3d4e8;font:700 clamp(9px,.79cqw,15px) 'Barlow Condensed';letter-spacing:.1em;white-space:nowrap}
.play-hud strong{display:block;color:#fff;font:900 clamp(18px,1.65cqw,32px)/1 'Barlow Condensed';white-space:nowrap}
.play-hud .play-hud-sport{align-items:flex-start;text-align:left;margin-right:auto;border-left:0}
.play-hud .play-hud-sport strong{color:#b5e6ff}
.play-hud .play-hud-player{background:rgba(16,75,37,.35)}
.play-hud .play-hud-player strong{color:#d5ffc9}
.play-hud .play-hud-timer strong{color:#ffe09b}
.play-hud .play-hud-timer strong.urgent{color:#ff9179}
.play-hud .play-hud-score strong{color:#ffcf8d}
.play-menu{align-self:center;flex:none;min-height:38px;padding:.3em .85em;border:1px solid rgba(171,224,255,.65);border-radius:6px;background:rgba(3,27,49,.9);color:#fff;font:800 clamp(11px,.95cqw,18px) 'Barlow Condensed';letter-spacing:.09em;white-space:nowrap}
.play-menu:hover{border-color:#fff;background:#15547b}
.play-bottom{position:absolute;z-index:8;left:0;right:0;bottom:0;min-height:clamp(30px,4cqh,45px);padding:0 1.5cqw;display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(0deg,rgba(0,9,21,.82),rgba(0,9,21,.5));border-top:1px solid rgba(195,228,245,.25);color:#e4f4ff;font:800 clamp(11px,.92cqw,18px) 'Barlow Condensed';letter-spacing:.1em;pointer-events:none}
.play-bottom .shot-track{display:flex;gap:.35cqw}
.play-bottom .shot-track i{width:clamp(9px,.8cqw,15px);height:clamp(9px,.8cqw,15px)}
.in-game .basket-view-label{bottom:6%}
@media(max-width:0px){.play-hud{height:52px;padding:0 4px}.play-hud>div{padding:0 5px}.play-hud small{font-size:8px}.play-hud strong{font-size:15px}.play-hud .play-hud-sport strong{font-size:12px}.play-menu{min-height:31px;padding:0 .4em;font-size:10px}.play-bottom{font-size:10px}.play-bottom .shot-track{display:none}}

/* A projected game always has the wall's physical 16:10 ratio. */
.shell.in-game{background:#020b18}
/* ⚠ Cette regle contraignait la zone de jeu en 16:10 avec des unites dvh —
   qui mesurent la FENETRE, pas la scene figee. Le jeu ne remplissait donc
   jamais le cadre. Jeremy, 26/09 : « les jeux ne couvrent pas tout l ecran
   comme le reste ». La scene FAIT deja 1600x1000, soit 16:10 exactement :
   la zone de jeu n a qu a la remplir. */
.in-game .play-content{position:absolute;inset:0;width:100%;height:100%;transform:none;aspect-ratio:auto}
.in-game .play-surface{background:#061525}
.in-game .play-surface:before{background:linear-gradient(180deg,rgba(0,8,20,.52),transparent 15%,transparent 82%,rgba(0,8,20,.12))}
.scene-image{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.football-field .scene-image{height:110.4%}
.scene-image.scene-flipped{transform:scaleX(-1)}
.in-game .scene-football,.in-game .football-view-near,.in-game .football-view-side,.in-game .football-view-side-left,.in-game .football-view-far,.in-game .scene-tennis,.in-game .tennis-view-midcourt,.in-game .tennis-view-near-net,.in-game .scene-basket,.in-game .basket-view-near,.in-game .basket-view-side,.in-game .basket-view-side-left,.in-game .basket-view-far{background:none}
.in-game .football-field,.in-game .tennis-field,.in-game .basket-field{z-index:0}
.basket-square-highlight{position:absolute;z-index:3;box-sizing:border-box;border:2px solid #ffae44;border-radius:2px;background:rgba(255,147,30,.05);box-shadow:0 0 9px #ff911d,inset 0 0 6px rgba(255,164,35,.7);animation:square-glow 1.5s ease-in-out infinite;pointer-events:none}
@keyframes square-glow{50%{box-shadow:0 0 18px #ffad43,inset 0 0 10px rgba(255,182,58,.9)}}
.in-game .basket-shot-ball{z-index:4;top:var(--ball-start);width:var(--ball-size,2.4%);animation:basket-scene-score .75s cubic-bezier(.2,.4,.5,1) forwards}
@keyframes basket-scene-score{0%{top:var(--ball-start);opacity:1;transform:translate(-50%,-50%) scale(1.1)}35%{top:var(--ball-start);opacity:1;transform:translate(-50%,-50%) scale(1.2)}100%{top:var(--ball-end);opacity:0;transform:translate(-50%,-50%) scale(.5)}}
.in-game .tennis-field .corridor{border-width:2px;background:rgba(54,244,127,.13);box-shadow:0 0 16px rgba(84,255,145,.65),inset 0 0 10px rgba(119,255,149,.2)}
@media(max-width:0px){.play-hud{height:42px}.play-hud strong{font-size:clamp(12px,2.2cqh,21px)}.play-hud small{font-size:clamp(7px,1.4cqh,11px)}.play-menu{min-height:28px}.play-bottom{min-height:24px;font-size:10px}}

/* ---- Football, huit niveaux : gardien, chrono, leurres, cibles felees ---- */
.target-ring>b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  border:3px solid #fff;border-radius:50%;background:rgba(255,255,255,.12);box-shadow:0 0 10px #fff}
.target-ring.leurre{border-color:#ff6a5a;box-shadow:0 0 6px #fff,0 0 22px #ff3b24,inset 0 0 16px #ff7a68}
.target-ring.leurre>b{border-color:#ffd4cd;box-shadow:0 0 8px #ff7a68}
.target-ring.fissure{border-style:dashed;animation:pulse .7s ease-in-out infinite}
.target-ring.perdue{opacity:.25;filter:grayscale(1)}
/* Le gardien : une bande sombre qui barre la cage. Une balle qui l atteint est arretee. */
.foot-gardien{position:absolute;z-index:3;transform:translate(-50%,-50%);
  background:linear-gradient(180deg,rgba(12,22,38,.93),rgba(6,12,22,.97));
  border:2px solid #9fd0ff;border-radius:8px;box-shadow:0 0 18px rgba(46,132,214,.55);pointer-events:none}
/* Le chrono : une barre qui se vide. Elle ne demarre qu une fois la cible affichee. */
.foot-chrono{position:absolute;z-index:9;left:8%;right:8%;top:5%;height:clamp(6px,1.1cqh,12px);
  background:rgba(2,12,24,.7);border:1px solid rgba(150,205,245,.5);border-radius:99px;overflow:hidden;pointer-events:none}
.foot-chrono i{display:block;height:100%;background:linear-gradient(90deg,#7bf3a0,#d8ff8a);transition:width .1s linear}
.foot-chrono i.urgent{background:linear-gradient(90deg,#ff8a5c,#ff4d4d)}
.foot-msg{position:absolute;z-index:9;left:50%;top:12%;transform:translateX(-50%);
  padding:.3em .9em;border-radius:8px;background:rgba(0,10,22,.75);color:#dff1ff;
  font:800 clamp(12px,1.2cqw,22px) 'Barlow Condensed';letter-spacing:.12em;pointer-events:none}
/* Huit niveaux : quatre colonnes sur deux lignes plutot que cinq et une orpheline. */
.levels-grid.huit{grid-template-columns:repeat(4,1fr)}
.levels-grid.huit .level-card{height:clamp(120px,19cqh,210px)}

/* ================= FOOTBALL — CIBLES, BLOCUS, UNIVERS PAR NIVEAU =================
   Jeremy, 25/09 23h40 : « je trouve pas les graphismes extraordinaires… la photo
   pour selectionner le jeu est bien plus belle que le jeu reellement. »
   Le diagnostic : la photo est bonne, ce sont NOS elements poses dessus qui
   faisaient pauvres. Tout est refait ici, et le decor change avec le niveau. */

/* ---- La cible ---- */
.cible{position:absolute;z-index:4;transform:translate(-50%,-50%) scale(.6);
  opacity:0;transition:opacity .25s ease,transform .25s cubic-bezier(.2,1.4,.4,1);pointer-events:none}
.cible.vivante{opacity:1;transform:translate(-50%,-50%) scale(1)}
.cible.dehors{filter:grayscale(1) brightness(.6);opacity:.45}
/* L anneau principal : une vraie couronne lumineuse, pas un trait. */
.cible-anneau{position:absolute;inset:0;border-radius:50%;
  border:.26em solid var(--c1,#b0fcff);
  box-shadow:0 0 .3em #fff, 0 0 1.3em var(--c2,#39adff);
  animation:cible-bat 1.6s ease-in-out infinite;font-size:min(3cqw,26px)}
/* ⚠ PLUS D OMBRE INTERIEURE SUR L ANNEAU. Elle dessinait un halo circulaire a
   l interieur du grand cercle, qu on lisait comme un SECOND rond — Jeremy l a
   releve sur un agrandissement : « tu trouves que la cible a deux ronds ? ».
   Le seul second rond doit etre le coeur, et il doit etre franc. */
.cible-coeur{position:absolute;left:50%;top:50%;width:33.3%;height:33.3%;
  transform:translate(-50%,-50%);border-radius:50%;
  border:.26em solid #fff;background:rgba(255,255,255,.14);
  box-shadow:0 0 .5em #fff;font-size:min(3cqw,26px)}
/* Le coeur fait 33,3 %% du grand cercle : c est le rapport 11 cm / 33 cm fixe par
   Jeremy le 26/09. Si les deux diametres changent dans app.js, ce chiffre suit. */
/* LE TEMPS EST DANS LA CIBLE : un arc qui se vide autour d elle.
   Jeremy : « il faut l afficher dans la cible si c est le cas. » */
.cible-temps{position:absolute;inset:-18%;border-radius:50%;
  background:conic-gradient(var(--tc,#8effb0) calc(var(--reste,1)*360deg),transparent 0);
  -webkit-mask:radial-gradient(circle,transparent 63%,#000 65%);
  mask:radial-gradient(circle,transparent 63%,#000 65%);opacity:.95}
.cible.urgent .cible-temps{--tc:#ff5b4d}
.cible.urgent .cible-anneau{animation-duration:.45s}
/* Une cible felee : elle a encaisse le premier coup du mode Double. */
.cible.fissure .cible-anneau{border-style:dashed;--c1:#ffd98a;--c2:#ff9b21}
.cible.fissure .cible-coeur{border-color:#ffd98a}
/* Les leurres du niveau 7. */
.cible.leurre .cible-anneau{--c1:#ffb3a6;--c2:#ff2d17}
.cible.leurre .cible-coeur{border-color:#ffd2c9;box-shadow:0 0 .7em #ff6a55,inset 0 0 .6em #ff6a55}

/* ---- Le blocus : une zone fermee, rouge, DEVANT la cible ----
   Jeremy : « c est pas un gardien mais un carre… j aurais fait un effet interieur
   rouge, comme une zone fermee. Et faut que ca passe devant la cible. » */
.blocus{position:absolute;z-index:6;transform:translate(-50%,-50%);
  border-radius:10px;overflow:hidden;pointer-events:none;
  border:2px solid rgba(255,120,96,.95);
  background:linear-gradient(180deg,rgba(72,10,12,.55),rgba(30,4,8,.72));
  box-shadow:0 0 22px rgba(255,64,48,.5),inset 0 0 26px rgba(255,60,40,.45)}
.blocus i{position:absolute;inset:-40px;
  background:repeating-linear-gradient(135deg,rgba(255,90,70,.30) 0 10px,transparent 10px 20px);
  animation:blocus-defile 1.4s linear infinite}
/* ⚠ Le motif se repete tous les 20px LE LONG DE SON AXE a 135 degres. Un
   deplacement horizontal de dx decale le motif de dx*cos(45) = dx*0,7071.
   Pour que la boucle retombe exactement sur elle-meme il faut donc
   dx = 20 / 0,7071 = 28,284px. A 20px, le motif revenait en arriere d un
   cinquieme a chaque tour : c est le « truc sur la gauche qui bouge et qui
   revient » que Jeremy a vu le 26/09. Et inset:-40px pour qu aucun bord du
   calque ne traverse la plaque pendant le defilement. */
@keyframes blocus-defile{to{transform:translateX(28.284px)}}

/* ---- Un univers par niveau ---- */
.play-surface.t-pelouse .cible{--c1:#d7ffe6;--c2:#35d97a}
.play-surface.t-blocus:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(ellipse at 50% 60%,transparent 50%,rgba(60,0,10,.26))}
.play-surface.t-brique .cible{--c1:#ffe6b0;--c2:#ff9b21}
.play-surface.t-brique:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(0deg,rgba(40,16,0,.24),transparent 55%)}
/* Neon : on eteint la photo et on fait ressortir les traits lumineux. */
.play-surface.t-neon{filter:saturate(1.25)}
.play-surface.t-neon .scene-image{filter:brightness(1.18) saturate(.75) hue-rotate(200deg)}
.play-surface.t-neon:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(6,0,40,.28),rgba(60,0,70,.22)),
    repeating-linear-gradient(0deg,transparent 0 3px,rgba(120,220,255,.05) 3px 4px)}
.play-surface.t-neon .cible{--c1:#e8b6ff;--c2:#b833ff}
/* Arcade : contraste dur, couleurs primaires. */
.play-surface.t-arcade .scene-image{filter:contrast(1.12) saturate(1.3) brightness(1.2)}
.play-surface.t-arcade:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.10) 0 2px,transparent 2px 5px)}
.play-surface.t-arcade .cible{--c1:#fff59a;--c2:#ffd400}
/* Nuit : le melange final, presque tout eteint sauf ce qui compte. */
.play-surface.t-nuit .scene-image{filter:brightness(1.12) saturate(.72)}/* pas de hue-rotate ici : a 185 degres la pelouse virait au violet et le
   theme ne disait plus « nuit » mais « synthwave ». La fraicheur vient du
   voile bleu au-dessus, qui n abime pas les couleurs du terrain. */
.play-surface.t-nuit:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(ellipse at 50% 45%,rgba(10,30,80,.10),rgba(6,16,54,.40))}
.play-surface.t-nuit .cible{--c1:#c9fbff;--c2:#00e0ff}

/* ---- L ecran de regle, avant de commencer ---- */
.brief-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3cqh;height:100%}
.brief-content .page-title p{max-width:min(70cqw,900px);margin:0 auto}
.brief-rappel{display:flex;gap:1.2cqw;flex-wrap:wrap;justify-content:center}
.brief-rappel>div{min-width:9cqw;padding:1cqh 1.4cqw;border:1px solid #4e9bce;border-radius:11px;
  background:rgba(4,22,41,.9);text-align:center}
.brief-rappel small{display:block;color:#9fcbe8;font:700 clamp(9px,.8cqw,15px) 'Barlow Condensed';letter-spacing:.14em}
.brief-rappel strong{font:900 clamp(18px,1.9cqw,34px) 'Barlow Condensed'}

/* ---- Ecran des modes ----
   ⚠ CET ECRAN EST LU SUR UNE PROJECTION DE 4 m x 2,5 m, A PLUSIEURS METRES.
   Jeremy, 26/09 10h53 : « les niveaux sont trop gros et trop hauts, pas assez de
   place pour la description… je pense que tu ne prends pas assez conscience qu il
   s agit d un ecran 4 m par 2,5 m. »
   Consequences tenues ici : les cartes descendent a 11 % de la hauteur pour rendre
   la place au texte, le texte est dimensionne en vh (donc en proportion de l ecran
   reel, pas en pixels), et un SCHEMA montre le mecanisme — a cette distance, une
   image se comprend avant une phrase. */
.modes-content{position:absolute;inset:12% 4% 11%;
  display:flex;flex-direction:column;justify-content:space-between;gap:2cqh}
/* ⚠ inset, et surtout 11 % EN BAS. Le pied de page « PLAY · MOVE · CHALLENGE »
   est positionne en absolu sur 9,2 % de la hauteur, au-dessus dans l empilement.
   Avec height:100% et sans marge basse, le bouton « JE SUIS PRET » passait
   DESSOUS : visible, mais impossible a cliquer. Signale par Jeremy le 26/09.
   Tous les autres ecrans du jeu utilisent deja ce principe (inset 14% 9% 10%). */
.mode-explique{display:flex;align-items:center;justify-content:center;gap:3cqw;
  width:min(88cqw,1750px);margin:0 auto;flex:1}
.mode-schema{flex:0 0 auto;width:min(30cqw,520px);height:auto;
  background:rgba(3,18,34,.55);border:1px solid rgba(120,190,245,.35);border-radius:14px;padding:1.2cqh 1cqw}
.mode-texte{flex:1;min-width:0;text-align:left}
.mode-kicker{display:block;font:700 clamp(12px,1.5cqh,26px) 'Barlow Condensed';letter-spacing:.3em;color:#91cfff}
.mode-texte h1{font:900 clamp(30px,6.2cqh,96px)/1.08 'Barlow Condensed',Impact,sans-serif;
  letter-spacing:.03em;margin:.1em 0 .25em;text-shadow:0 3px 22px rgba(24,97,193,.4)}
.mode-texte p{font:600 clamp(15px,2.6cqh,40px)/1.28 Inter,Arial,sans-serif;color:#dbeaf7;margin:0 0 2.2cqh;max-width:36em}
.brief-rappel{display:flex;gap:1cqw;flex-wrap:wrap}
.brief-rappel>div{padding:.9cqh 1.3cqw;border:1px solid #4e9bce;border-radius:11px;
  background:rgba(4,22,41,.9);text-align:center}
.brief-rappel small{display:block;color:#9fcbe8;font:700 clamp(9px,1.2cqh,19px) 'Barlow Condensed';letter-spacing:.16em}
.brief-rappel strong{font:900 clamp(16px,2.6cqh,42px) 'Barlow Condensed'}

/* Les huit niveaux : une ligne, des cartes BASSES.
   ⚠ La classe s appelle « niveau-card » et NON « mode-card » : ce dernier nom
   appartient deja aux cartes ENTRAINEMENT / VERSUS de l ecran precedent. En le
   reutilisant j ai impose a ces cartes une hauteur de 108 px pour un contenu de
   186 px — leur texte etait coupe. Jeremy, 26/09 : « entrainement et versus ne
   rentrent pas dans le cadre ». Un nom de classe est un espace partage. */
.modes-ligne{display:grid;grid-template-columns:repeat(8,1fr);gap:.6cqw;width:min(92cqw,1800px);margin:0 auto 1cqh}
.niveau-card{height:clamp(60px,11cqh,150px);padding:.6cqh .4cqw;border:1px solid #5d9fd0;border-radius:11px;
  background:rgba(6,28,50,.92);color:#fff;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:.3cqh;text-align:center;transition:.18s;overflow:hidden}
.niveau-card small{color:#8fd2ff;font:700 clamp(10px,1.4cqh,22px) 'Barlow Condensed';letter-spacing:.1em;line-height:1}
.niveau-card strong{font:900 clamp(11px,1.7cqh,28px)/1.02 'Barlow Condensed';letter-spacing:.02em}
.niveau-card i{font-style:normal;font:700 clamp(9px,1.2cqh,18px) 'Barlow Condensed';color:#ffcf68;letter-spacing:.06em}
.niveau-card:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 0 22px rgba(47,158,255,.45)}
.niveau-card.selected{border:2px solid #b9ff9f;box-shadow:0 0 26px rgba(93,255,99,.45);background:rgba(10,44,32,.94)}
.niveau-card.locked{opacity:.38}
@media(max-width:0px){.modes-ligne{grid-template-columns:repeat(4,1fr)}
  .mode-explique{flex-direction:column;gap:1.5cqh}.mode-schema{width:min(70cqw,460px)}.mode-texte{text-align:center}
  .brief-rappel{justify-content:center}}

/* ---- Cage agrandie : on zoome la photo autour de la cage, et le rectangle de jeu
   suit le meme facteur dans le code (ZOOM_CAGE). ---- */
/* ⚠ ON NE TOUCHE PLUS A LA PHOTO. Elle a ete refaite le 26/09 pour epouser
   exactement le 4/2,5 : la redimensionner ne pourrait que la degrader.
   Ce qui precedait faisait deux degats que Jeremy a vus tous les deux :
   — reduite a 0,988 x 0,976 pour forcer la cage a 3,60 x 2,00 m, elle ne
     couvrait plus le cadre, d ou le noir en bas ;
   — le fond flou qui bouchait ce noir etait une COPIE de la meme photo, donc sa
     ligne de but se voyait derriere la vraie : « la ligne de but est meme pas
     droite, on dirait un leger decalage hyper minime ». C etait un fantome, pas
     une ligne de travers — la ligne de la photo, elle, est droite a 3 mm pres
     sur 2,50 m, mesuree en sept points.
   La cage fait donc ce que la photo dit : 3,64 x 2,05 m au lieu de 3,60 x 2,00.
   Quatre centimetres d ecart, et aucune degradation. *//* deux facteurs, comme dans app.js (ZOOM_X, ZOOM_Y) : la cage est large et
   basse, un zoom uniforme est plafonne par la largeur et ne rend presque
   rien en hauteur. Les deux valeurs DOIVENT rester identiques ici et la :
   si elles divergent, les cibles ne tombent plus dans la cage dessinee. */

/* ---- Voile de pause ---- */
.voile-pause{position:absolute;inset:0;z-index:12;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:3cqh;
  background:rgba(2,10,20,.82);backdrop-filter:blur(3px)}
.voile-pause>strong{font:900 clamp(38px,5cqw,86px) 'Barlow Condensed',Impact,sans-serif;
  letter-spacing:.12em;color:#eaf6ff;text-shadow:0 0 28px rgba(60,160,255,.6)}
.voile-actions{display:flex;gap:1.2cqw;flex-wrap:wrap;justify-content:center}

/* ⚠ LA REGLE EST : AUCUN THEME NE DOIT ETRE PLUS SOMBRE QUE LA PHOTO NUE.
   Mesure du 26/09 : la photo de stade vaut deja 0,269 de luminosite moyenne —
   elle est sombre par nature. Mes themes la ramenaient a 0,181 (nuit), 0,197
   (neon) et 0,218 (arcade) : on ne voyait plus le terrain. L ambiance se prend
   desormais dans la TEINTE et le contraste, jamais dans l extinction, et la
   luminosite des trois themes sombres passe au-dessus de 1,0.
   ⚠ LUMINOSITE PLANCHER. Jeremy, 26/09 : « j ai teste un niveau ou c etait hyper
   sombre, le 7 ou le 8 ». C etait vrai : le neon etait a 0,42 de luminosite et la
   nuit a 0,30, avec en plus un voile sombre par-dessus — on ne voyait plus le
   terrain. Regle retenue : AUCUN THEME NE DESCEND SOUS 0,65 de luminosite, et les
   voiles ne depassent pas 0,45 d opacite. Un decor doit habiller le jeu, pas
   l eteindre : c est la cible qui doit ressortir, pas le fond qui doit disparaitre. */

/* ================= LA FRAPPE : BALLE, ONDE DE FILET, SECOUSSE =================
   La cage est une photo. On ne fait donc PAS bouger le filet : on pose trois
   effets locaux par-dessus, et c est suffisant pour que le coup se ressente.
   Duree totale 0,62 s — plus court que les 0,85 s avant le tir suivant, donc
   l animation ne retarde jamais le jeu. */

/* La balle part du bas du cadre — les pieds du joueur — et file vers le point
   touche en RAPETISSANT : c est le retrecissement qui donne la profondeur, pas
   la trajectoire. */
.balle{position:absolute;z-index:8;left:50%;top:112%;width:5.5%;aspect-ratio:1;   /* 0,22 m — taille reelle, constante */
  transform:translate(-50%,-50%);pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3CradialGradient%20id%3D%22ombre%22%20cx%3D%2234%25%22%20cy%3D%2228%25%22%20r%3D%2278%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%22.55%22%2F%3E%3Cstop%20offset%3D%2252%25%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%230a0f16%22%20stop-opacity%3D%22.42%22%2F%3E%3C%2FradialGradient%3E%3C%2Fdefs%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2249%22%20fill%3D%22%23fdfdfd%22%20stroke%3D%22%23c6ced8%22%20stroke-width%3D%221.2%22%2F%3E%3Cpolygon%20points%3D%2250.00%2C33.00%2066.17%2C44.75%2059.99%2C63.75%2040.01%2C63.75%2033.83%2C44.75%22%20fill%3D%22%231b1f26%22%2F%3E%3Cpolygon%20points%3D%2258.23%2C5.67%2063.31%2C21.33%2050.00%2C31.00%2036.69%2C21.33%2041.77%2C5.67%22%20fill%3D%22%231b1f26%22%20opacity%3D%22.92%22%2F%3E%3Cpolygon%20points%3D%2294.70%2C44.13%2081.38%2C53.80%2068.07%2C44.13%2073.16%2C28.48%2089.61%2C28.48%22%20fill%3D%22%231b1f26%22%20opacity%3D%22.92%22%2F%3E%3Cpolygon%20points%3D%2269.40%2C90.70%2056.08%2C81.02%2061.17%2C65.37%2077.63%2C65.37%2082.71%2C81.02%22%20fill%3D%22%231b1f26%22%20opacity%3D%22.92%22%2F%3E%3Cpolygon%20points%3D%2217.29%2C81.02%2022.37%2C65.37%2038.83%2C65.37%2043.92%2C81.02%2030.60%2C90.70%22%20fill%3D%22%231b1f26%22%20opacity%3D%22.92%22%2F%3E%3Cpolygon%20points%3D%2210.39%2C28.48%2026.84%2C28.48%2031.93%2C44.13%2018.62%2C53.80%205.30%2C44.13%22%20fill%3D%22%231b1f26%22%20opacity%3D%22.92%22%2F%3E%3Cline%20x1%3D%2250.0%22%20y1%3D%2233.0%22%20x2%3D%2250.0%22%20y2%3D%2220.0%22%20stroke%3D%22%236b7480%22%20stroke-width%3D%221.4%22%2F%3E%3Cline%20x1%3D%2266.2%22%20y1%3D%2244.7%22%20x2%3D%2278.5%22%20y2%3D%2240.7%22%20stroke%3D%22%236b7480%22%20stroke-width%3D%221.4%22%2F%3E%3Cline%20x1%3D%2260.0%22%20y1%3D%2263.8%22%20x2%3D%2267.6%22%20y2%3D%2274.3%22%20stroke%3D%22%236b7480%22%20stroke-width%3D%221.4%22%2F%3E%3Cline%20x1%3D%2240.0%22%20y1%3D%2263.8%22%20x2%3D%2232.4%22%20y2%3D%2274.3%22%20stroke%3D%22%236b7480%22%20stroke-width%3D%221.4%22%2F%3E%3Cline%20x1%3D%2233.8%22%20y1%3D%2244.7%22%20x2%3D%2221.5%22%20y2%3D%2240.7%22%20stroke%3D%22%236b7480%22%20stroke-width%3D%221.4%22%2F%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2249%22%20fill%3D%22url%28%23ombre%29%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
  filter:drop-shadow(0 .1em .5em rgba(0,0,0,.55));
  animation:balle-part .42s cubic-bezier(.35,.02,.72,1) forwards}
/* ⚠ TOUT EST A L ECHELLE 1:1. Jeremy, 26/09 : « ce qui compte, c est que le
   joueur va taper avec une VRAIE balle. Donc tu calcules tout en reel. 3 m 60,
   alors ca reste 3 m 60. Tout en taille reelle. »

   L ecran fait 4,00 m pour 1600 px logiques : 1 metre = 400 px, en largeur
   comme en hauteur. Un ballon de football mesure 0,22 m, donc 88 px, donc
   5,5 % du cadre — ET CETTE TAILLE NE CHANGE JAMAIS.

   Mon premier reglage le faisait passer de 22 % a 5,5 % « pour donner la
   profondeur ». C etait une perspective INVENTEE : sur un simulateur a taille
   reelle, il n y a pas de profondeur a simuler, l ecran EST le plan de la cage.
   Le ballon traverse donc le cadre a sa taille, comme il le ferait devant. */
@keyframes balle-part{
  0%  {left:50%; top:112%; opacity:0; transform:translate(-50%,-50%) rotate(0deg)}
  10% {opacity:1}
  100%{left:var(--bx); top:var(--by); opacity:1; transform:translate(-50%,-50%) rotate(420deg)}}

/* La deformation, au SEUL point touche : un anneau qui s ouvre et s efface,
   comme le filet qui encaisse. */
.onde-filet{position:absolute;z-index:7;width:2%;aspect-ratio:1;border-radius:50%;
  transform:translate(-50%,-50%);pointer-events:none;
  border:.22em solid rgba(255,255,255,.9);
  box-shadow:0 0 1.2em rgba(255,255,255,.65), inset 0 0 1em rgba(255,255,255,.35);
  animation:onde .6s ease-out .34s forwards;opacity:0}
@keyframes onde{
  0%  {opacity:.95; width:2%;  border-width:.22em}
  100%{opacity:0;   width:22%; border-width:.02em}}

/* Une secousse breve, seulement quand ca rentre. Legere : sur quatre metres,
   un tremblement fort donne le mal de mer. */
.play-surface.secousse{animation:secousse .26s ease-out .34s}
@keyframes secousse{
  0%,100%{transform:translate(0,0)}
  25%{transform:translate(.35%, -.5%)}
  60%{transform:translate(-.25%, .3%)}}

/* Bouton d entree directe, pour les essais de Jeremy. Volontairement distinct
   du reste : il ne doit pas se confondre avec un bouton du jeu, et il sautera
   aux yeux le jour ou il faudra le retirer avant la mise en service. */
.admin-entree{min-height:0;padding:.5cqh 1cqw;margin-right:1cqw;border-radius:8px;
  background:rgba(60,26,6,.9);color:#ffd08a;border:1px solid #ff9d3c;
  font:800 clamp(10px,1.2cqh,20px) 'Barlow Condensed',sans-serif;letter-spacing:.14em;
  box-shadow:0 0 12px rgba(255,140,40,.35)}
.admin-entree:hover{background:rgba(96,44,10,.95);box-shadow:0 0 20px rgba(255,140,40,.6)}

/* ============================ SENS D ECRITURE ============================
   L hebreu se lit de droite a gauche. i18n.js pose dir="rtl" sur <html>, et
   tout ce qui est en flex ou en grid se retourne tout seul. Ce qui ne se
   retourne PAS tout seul, et qu il faut donc ecrire ici :
     1. la typographie — 'Barlow Condensed' et 'Inter' n ont pas d hebreu, et
        l interlettrage d un alphabet a chasse variable ecrase les lettres ;
     2. le terrain de jeu — la cage, les cibles et le gardien sont places en
        metres reels depuis la GAUCHE de la photo. Un terrain qui se retourne
        avec l interface, c est un jeu qui ment sur ou se trouve la balle.
   ---------------------------------------------------------------------- */
:root[lang="he"], :root[lang="he"] body{
  font-family:'Noto Sans Hebrew','Heebo','Arial Hebrew',Arial,sans-serif;
}
/* .logo volontairement absent de cette liste (Jeremy, 14/10) : le texte du
   logo est toujours « BATTLE CITY » en latin, jamais traduit — lui appliquer
   la police hebraique ne faisait que changer sa typographie sans raison
   (un logo ne depend pas de la langue). Il garde Barlow Condensed partout,
   FR/EN/HE. */
:root[lang="he"] .page-title,
:root[lang="he"] h1,:root[lang="he"] h2,:root[lang="he"] h3,
:root[lang="he"] strong,:root[lang="he"] b,
:root[lang="he"] .btn,:root[lang="he"] .control,:root[lang="he"] .vk-key{
  font-family:'Noto Sans Hebrew','Heebo','Arial Hebrew',Arial,sans-serif;
  font-style:normal;                 /* l italique condense n existe pas en hebreu */
  letter-spacing:normal;             /* l interlettrage colle les lettres hebraiques */
}
:root[lang="he"] *{text-transform:none}   /* l hebreu n a pas de majuscules */
/* Les lettres hebraiques montent et descendent plus que les latines : a 1,06
   d interligne, la boite est plus courte que le texte et les jambages sont
   coupes. Mesure faite sur quatorze ecrans, pas choisie a l oeil. */
:root[lang="he"] h1,:root[lang="he"] h2,:root[lang="he"] h3,
:root[lang="he"] .page-title h1,:root[lang="he"] .mode-texte h1{line-height:1.3}
:root[lang="he"] strong,:root[lang="he"] b,:root[lang="he"] .level-card span{line-height:1.35}

/* Arabe (borne uniquement, Jeremy 14/10) : meme traitement que l hebreu —
   .logo garde Barlow Condensed (texte toujours « BATTLE CITY » en latin),
   le reste bascule sur une police qui a vraiment l arabe. L arabe est
   cursif : couper les lettres au letter-spacing les rendrait illisibles. */
:root[lang="ar"], :root[lang="ar"] body{
  font-family:'Noto Sans Arabic','Geeza Pro',Tahoma,Arial,sans-serif;
}
:root[lang="ar"] .page-title,
:root[lang="ar"] h1,:root[lang="ar"] h2,:root[lang="ar"] h3,
:root[lang="ar"] strong,:root[lang="ar"] b,
:root[lang="ar"] .btn,:root[lang="ar"] .control,:root[lang="ar"] .vk-key{
  font-family:'Noto Sans Arabic','Geeza Pro',Tahoma,Arial,sans-serif;
  font-style:normal;
  letter-spacing:normal;
}
:root[lang="ar"] *{text-transform:none}
:root[lang="ar"] h1,:root[lang="ar"] h2,:root[lang="ar"] h3,
:root[lang="ar"] .page-title h1,:root[lang="ar"] .mode-texte h1{line-height:1.3}
:root[lang="ar"] strong,:root[lang="ar"] b,:root[lang="ar"] .level-card span{line-height:1.35}

/* Le terrain reste dans le sens du monde reel, quelle que soit la langue. */
[dir="rtl"] .play-scene, [dir="rtl"] .cage-zone, [dir="rtl"] .terrain,
[dir="rtl"] .play-photo, [dir="rtl"] .blocus, [dir="rtl"] .cible{direction:ltr}

/* Les quelques decalages ecrits en dur, remis dans le bon sens. */
[dir="rtl"] .slot-number{left:auto;right:1.1cqw}
[dir="rtl"] .slot-remove{right:auto;left:1.1cqw}
[dir="rtl"] .footer-motto{direction:ltr}   /* PLAY · MOVE · CHALLENGE est une marque */
[dir="rtl"] .logo{direction:ltr}

/* ==================== TROIS MODES, ÉQUIPES, PODIUM ====================
   Jeremy, 26/09 : « on devrait avoir training/solo, multijoueur, et equipes »,
   « a la fin je veux un vrai classement avec un podium, les stats de chacun,
   tu as un grand ecran alors rends ca sympa », et la consigne de jeu « je
   l aurai mis en haut plutot qu en bas ».
   Tout est en unites de conteneur : la scene fait 1600x1000 et se zoome d un
   bloc, donc ce qui est dessine ici garde ses proportions sur un mur de 4 m.
   -------------------------------------------------------------------- */

/* --- trois cartes au lieu de deux --- */
.mode-grid.trois{grid-template-columns:repeat(3,1fr);width:min(82cqw,1330px)}
.mode-card.equipes .icon{color:#ffd166}

/* --- la consigne et les billes, en HAUT --- */
.play-consigne{position:absolute;z-index:9;left:0;right:0;top:clamp(46px,6.6cqh,74px);
  padding:.5cqh 1.6cqw;display:flex;align-items:center;justify-content:space-between;gap:1.2cqw;
  background:linear-gradient(180deg,rgba(0,9,21,.8),rgba(0,9,21,.34) 70%,transparent);
  color:#e4f4ff;font:800 clamp(11px,.92cqw,18px) 'Barlow Condensed',Impact,sans-serif;
  letter-spacing:.1em;pointer-events:none}
.play-consigne .shot-track i.hit{background:#8ef79a;border-color:#8ef79a}
.play-consigne .shot-track i.miss{background:#ff7a68;border-color:#ff7a68}
.play-consigne .shot-track i.now{background:#ffd166;border-color:#ffd166;
  box-shadow:0 0 0 .25cqw rgba(255,209,102,.35)}
.play-hud-player em{display:block;font-style:normal;font-size:.72em;letter-spacing:.08em;opacity:.95}

/* --- couleurs d'équipe, un seul endroit --- */
.equipe-bleue{--eq:#61b6ff}   .equipe-orange{--eq:#ffa657}
.equipe-verte{--eq:#7ee787}   .equipe-violette{--eq:#c39bff} .equipe-rouge{--eq:#ff6677}
.equipe-bleue,.equipe-orange,.equipe-verte,.equipe-violette,.equipe-rouge{color:var(--eq)}

/* --- préparation : composition des équipes --- */
.equipes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(15cqw,1fr));gap:1.2cqw;width:min(78cqw,1250px);margin:0 auto}
.equipe{border:2px solid color-mix(in srgb,var(--eq,#61b6ff) 55%,transparent);border-radius:14px;
  background:color-mix(in srgb,var(--eq,#61b6ff) 9%,rgba(4,16,30,.72));padding:1.1cqh 1cqw;min-height:11cqh}
.equipe>strong{display:block;font:900 clamp(12px,1.05cqw,21px) 'Barlow Condensed';letter-spacing:.12em;margin-bottom:.7cqh}
.equipe-joueurs{display:flex;flex-direction:column;gap:.45cqh;color:#e9f6ff;font-size:clamp(11px,.85cqw,17px)}
.equipe-joueurs span{display:flex;align-items:center;gap:.5cqw}
.equipe-joueurs em{opacity:.5;font-style:italic}
.repartition{width:min(78cqw,1250px);margin:1.4cqh auto 0;text-align:center}
.repartition>small{display:block;opacity:.75;margin-bottom:.8cqh;font-size:clamp(10px,.8cqw,16px)}
.repartition-joueurs{display:flex;flex-wrap:wrap;justify-content:center;gap:.9cqw}
.pastille{display:flex;align-items:center;gap:.6cqw;padding:.7cqh 1cqw;border-radius:999px;cursor:pointer;
  border:2px solid color-mix(in srgb,var(--eq,#61b6ff) 70%,transparent);
  background:color-mix(in srgb,var(--eq,#61b6ff) 14%,rgba(4,16,30,.8));color:#f2faff}
.pastille strong{font-size:clamp(11px,.9cqw,18px)}
.pastille small{color:var(--eq);font-weight:800;letter-spacing:.08em;font-size:clamp(9px,.7cqw,14px)}
.pastille:hover{filter:brightness(1.15)}

/* --- fin de partie : podium --- */
.results-content.multi{justify-content:flex-start;gap:1.2cqh}
.podium{display:flex;align-items:flex-end;justify-content:center;gap:1.6cqw;margin:.6cqh auto 0}
.marche{display:flex;flex-direction:column;align-items:center;gap:.35cqh;width:13cqw;
  padding:1.2cqh 1cqw;border-radius:16px 16px 6px 6px;background:linear-gradient(180deg,rgba(28,62,102,.85),rgba(6,20,38,.9));
  border:1px solid rgba(140,196,244,.32)}
.marche-1{height:24cqh;order:2;border-color:#ffd166;box-shadow:0 0 3cqh rgba(255,209,102,.28) inset}
.marche-2{height:19cqh;order:1}
.marche-3{height:16cqh;order:3}
.medaille{font-size:clamp(22px,2.4cqw,48px);line-height:1}
.marche strong{font:900 clamp(12px,1.05cqw,21px) 'Barlow Condensed';letter-spacing:.06em;text-align:center}
.marche b{font:900 clamp(20px,2cqw,40px) 'Barlow Condensed';color:#fff}
.marche small{opacity:.7;letter-spacing:.12em;font-size:clamp(9px,.7cqw,14px)}
.marche .record{font-style:normal;font-weight:900;letter-spacing:.1em;color:#0a1b2c;background:#ffd166;
  border-radius:999px;padding:.2cqh .6cqw;font-size:clamp(8px,.62cqw,13px)}

/* --- fin de partie : la table de tout le monde --- */
.table-scores{width:min(76cqw,1220px);margin:0 auto;border-collapse:collapse;
  font-size:clamp(11px,.88cqw,18px);color:#e9f6ff}
.table-scores th{font:800 clamp(9px,.72cqw,15px) 'Barlow Condensed';letter-spacing:.14em;
  text-transform:uppercase;opacity:.6;text-align:left;padding:.5cqh .7cqw}
.table-scores td{padding:.55cqh .7cqw;border-top:1px solid rgba(140,196,244,.18)}
.table-scores td:first-child{width:4cqw;font-weight:900;opacity:.7}
.table-scores td b{font-size:1.25em;color:#fff}
.table-scores tr.premier td{background:rgba(255,209,102,.1)}
.table-scores .avatar{width:clamp(18px,1.6cqw,32px);height:clamp(18px,1.6cqw,32px);margin-right:.5cqw;vertical-align:middle}

/* --- fin de partie : classement des équipes --- */
.equipes-resultat{width:min(76cqw,1220px);margin:0 auto}
.equipes-resultat h3{font:900 clamp(12px,1.05cqw,21px) 'Barlow Condensed';letter-spacing:.14em;
  text-align:center;margin:.4cqh 0;color:#cfe8ff}
.note-moyenne{display:block;text-align:center;opacity:.7;margin-bottom:.6cqh;font-size:clamp(9px,.72cqw,15px)}
.equipes-classement{display:grid;grid-template-columns:repeat(auto-fit,minmax(16cqw,1fr));gap:1cqw}
.equipe-rang{display:grid;grid-template-columns:auto 1fr;grid-template-areas:'rang nom' 'membres membres' 'total total';
  gap:.3cqh .7cqw;padding:1cqh 1cqw;border-radius:14px;
  border:2px solid color-mix(in srgb,var(--eq,#61b6ff) 55%,transparent);
  background:color-mix(in srgb,var(--eq,#61b6ff) 10%,rgba(4,16,30,.78))}
.equipe-rang.rang-1{border-color:#ffd166}
.equipe-rang>b{grid-area:rang;font:900 clamp(16px,1.6cqw,32px) 'Barlow Condensed';color:#ffd166}
.equipe-rang>strong{grid-area:nom;align-self:center;font:900 clamp(11px,.95cqw,19px) 'Barlow Condensed';letter-spacing:.1em}
.equipe-membres{grid-area:membres;display:flex;flex-direction:column;gap:.25cqh;color:#e9f6ff;font-size:clamp(10px,.8cqw,16px)}
.equipe-membres span{display:flex;align-items:center;gap:.4cqw}
.equipe-membres b{margin-left:auto;color:#fff}
.equipe-total{grid-area:total;text-align:right;font:900 clamp(15px,1.4cqw,28px) 'Barlow Condensed';color:#fff}
.equipe-total small{opacity:.6;font-size:.5em;letter-spacing:.14em}
.equipe-total em{display:block;font-style:normal;font-weight:700;opacity:.75;font-size:.42em;letter-spacing:.06em}
.voile-note{display:block;width:100%;text-align:center;opacity:.8;margin-top:.6cqh;font-size:clamp(10px,.78cqw,16px)}

/* --- l'écran de fin en multi : une pile verticale, pas la grille à trois
       colonnes du solo (badge | classement | résumé), qui écrasait la table --- */
.results-content.multi .result-main{grid-template-columns:1fr;height:auto;gap:1.1cqh;width:min(80cqw,1400px)}
.results-content.multi .result-summary{grid-template-columns:repeat(5,1fr);min-height:0;padding:1.1cqh 1.4cqw;gap:.8cqw}
.results-content.multi .result-actions{margin-top:1.4cqh}
.results-content.multi .page-title{margin-bottom:.4cqh}
.results-content.multi .page-title h1{font-size:clamp(26px,3.2cqw,62px)}
.podium{height:26cqh;align-items:flex-end}
.marche{justify-content:flex-end;width:11.5cqw;padding:1cqh .8cqw}
.marche-1{height:26cqh}.marche-2{height:21cqh}.marche-3{height:17.5cqh}
.marche .avatar{width:clamp(26px,2.6cqw,52px);height:clamp(26px,2.6cqw,52px)}

/* --- tout doit tenir dans la scène : 1600x1000, pas de défilement.
       Mesuré le 26/09 : 1044 px de contenu pour 770 px de cadre. --- */
.results-content.multi{gap:.7cqh;padding-top:.5cqh}
.results-content.multi .page-title{margin-bottom:.2cqh}
.results-content.multi .page-title h1{font-size:clamp(22px,2.6cqw,50px);margin:.05em 0 .08em}
.results-content.multi .page-title p{display:none}
.podium{height:19cqh}
.marche-1{height:19cqh}.marche-2{height:15.5cqh}.marche-3{height:13cqh}
.marche{gap:.15cqh;padding:.7cqh .8cqw;width:10.5cqw}
.marche .avatar,.marche .avatar.large{width:clamp(20px,1.9cqw,38px);height:clamp(20px,1.9cqw,38px);font-size:clamp(9px,.8cqw,16px);line-height:1}
.medaille{font-size:clamp(16px,1.7cqw,34px)}
.marche b{font-size:clamp(15px,1.5cqw,30px)}
.marche strong{font-size:clamp(10px,.85cqw,17px)}
.equipes-resultat h3{margin:.15cqh 0;font-size:clamp(10px,.85cqw,17px)}
.equipe-rang{padding:.55cqh .8cqw;gap:.15cqh .5cqw}
.equipe-membres{font-size:clamp(9px,.72cqw,15px)}
.equipe-membres .avatar{width:clamp(14px,1.2cqw,24px);height:clamp(14px,1.2cqw,24px);font-size:clamp(7px,.6cqw,12px)}
.equipe-total{font-size:clamp(12px,1.15cqw,23px)}
.equipe-rang>b{font-size:clamp(13px,1.25cqw,25px)}
.table-scores th{padding:.25cqh .6cqw}
.table-scores td{padding:.32cqh .6cqw}
.results-content.multi .result-summary{padding:.7cqh 1.2cqw}
.results-content.multi .result-summary strong{font-size:clamp(12px,1.1cqw,22px)}
.results-content.multi .result-summary small{font-size:clamp(8px,.62cqw,13px)}
.results-content.multi .result-actions{margin-top:.8cqh}

/* --- préparation des équipes : 800 px de contenu pour 760 de cadre, mesuré --- */
.versus-content .equipe{min-height:9cqh;padding:.8cqh .9cqw}
.versus-content .equipe>strong{margin-bottom:.4cqh}
.repartition{margin-top:.9cqh}
.repartition>small{margin-bottom:.5cqh}
.pastille{padding:.5cqh .85cqw}
.versus-options{margin-bottom:.8cqh}

/* --- les cartes d'équipe grandissaient avec le nombre de joueurs : à deux
       équipes de trois, 843 px pour 760. Les membres se rangent en ligne. --- */
.equipe-joueurs{flex-direction:row;flex-wrap:wrap;gap:.35cqh .8cqw}
.versus-content .equipe{min-height:7.5cqh}
.equipes-grid{gap:.9cqw}
.equipe-membres{flex-direction:row;flex-wrap:wrap;gap:.2cqh .7cqw}
.equipe-membres span{gap:.3cqw}
.equipe-membres b{margin-left:.15cqw}
.equipe-rang{grid-template-columns:auto 1fr auto;grid-template-areas:'rang nom total' 'membres membres membres'}
.equipe-total{align-self:center}

/* --- la préparation tenait sur deux réglages ; elle en a quatre blocs.
       Mesuré : 811 px pour 760, dont ~168 px d'espaces entre blocs. --- */
.versus-content{inset:12% 8% 9%;gap:.9cqh;justify-content:flex-start}
.versus-content .page-title{margin-bottom:0}
.versus-options{padding:1.4cqh 2cqw}
.versus-content .player-strip{margin:0}

/* Les ronds sont maintenant sur la pelouse et non sur un bandeau sombre :
   il leur faut un contour lisible à quatre mètres. */
.play-consigne .shot-track i{width:clamp(11px,1.05cqw,21px);height:clamp(11px,1.05cqw,21px);
  border-width:2px;border-color:rgba(255,255,255,.85);background:rgba(4,16,30,.45);
  box-shadow:0 1px 3px rgba(0,0,0,.6)}
.play-consigne span{text-shadow:0 2px 6px rgba(0,0,0,.85)}

/* --- les scores, mode par mode --- */
.stats-modes{display:flex;gap:.6cqw;margin:.8cqh 0}
.stats-modes button{display:flex;flex-direction:column;align-items:center;gap:.15cqh;
  padding:.6cqh 1cqw;border-radius:10px;cursor:pointer;
  border:1px solid rgba(140,196,244,.35);background:rgba(6,24,44,.7);color:#cfe8ff;
  font:800 clamp(10px,.8cqw,16px) 'Barlow Condensed';letter-spacing:.1em}
.stats-modes button small{font-size:.8em;opacity:.6;letter-spacing:0}
.stats-modes button.active{border-color:#7fd0ff;background:rgba(41,110,176,.55);color:#fff}
.stats-sports{display:flex;gap:.5cqw;margin:.4cqh 0 .8cqh;flex-wrap:wrap}
.stats-sports button{padding:.45cqh .8cqw;border:1px solid rgba(140,196,244,.35);
  border-radius:8px;background:rgba(6,24,44,.7);color:#cfe8ff;
  font:800 clamp(10px,.72cqw,15px) 'Barlow Condensed';cursor:pointer}
.stats-sports button.active{border-color:#7fd0ff;background:rgba(41,110,176,.55);color:#fff}
.result-padel-defi{display:flex;align-items:center;justify-content:center;gap:.7cqw;
  margin:.2cqh auto;color:#d9f5ff;font:800 clamp(11px,.9cqw,18px) 'Barlow Condensed'}
.result-padel-defi small{color:#90cfff;letter-spacing:.08em}

/* ==================== FIN DE PARTIE, DEUXIÈME PASSE ====================
   Jeremy, 26/09 : « les lettres sortent de la bulle », « un tableau par équipe,
   un à droite l'autre à gauche, en vertical », « en haut la meilleure équipe
   gagnante », « le récap cumulé ne sert à rien ».
   ---------------------------------------------------------------------- */

/* les noms débordaient de la marche : on les contient au lieu de les laisser filer */
.marche strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:clamp(9px,.78cqw,16px);letter-spacing:.02em}
.marche b i{font-style:normal;font-size:.42em;opacity:.55;letter-spacing:.06em}
.marche .etoiles{color:#ffd166;font-size:clamp(10px,.9cqw,18px);letter-spacing:.1em;line-height:1}
.marche u{text-decoration:none;font-size:clamp(7px,.58cqw,12px);opacity:.72;text-align:center;
  line-height:1.15;max-width:100%}
.play-hud-score i{font-style:normal;font-size:.45em;opacity:.55}

/* le vainqueur, en grand */
.champion{display:flex;flex-direction:column;align-items:center;gap:.1cqh;
  padding:1cqh 2.5cqw;border-radius:16px;margin:0 auto;
  border:2px solid var(--eq,#ffd166);background:color-mix(in srgb,var(--eq,#ffd166) 16%,rgba(4,16,30,.85));
  box-shadow:0 0 4cqh color-mix(in srgb,var(--eq,#ffd166) 22%,transparent)}
.champion small{letter-spacing:.2em;opacity:.7;font-size:clamp(8px,.65cqw,14px)}
.champion strong{font:900 clamp(18px,1.9cqw,38px) 'Barlow Condensed';letter-spacing:.08em;color:var(--eq)}
.champion b{font:900 clamp(22px,2.3cqw,46px) 'Barlow Condensed';color:#fff;line-height:1}
.champion b i{font-style:normal;font-size:.42em;opacity:.5}
.champion em{font-style:normal;opacity:.75;font-size:clamp(8px,.62cqw,13px);text-align:center;max-width:32cqw}

/* les suivantes, en petit et dans l'ordre */
.suivantes{display:flex;justify-content:center;gap:1.2cqw;list-style:none;margin:.5cqh 0 0;padding:0}
.suivantes li{display:flex;align-items:center;gap:.4cqw;font-size:clamp(9px,.75cqw,15px);opacity:.8}
.suivantes li b{color:var(--eq)}
.suivantes li em{font-style:normal;font-weight:900;color:#fff}

/* un tableau par équipe, côte à côte */
.equipes-tableaux{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:1.2cqw;
  width:min(84cqw,1350px);margin:.8cqh auto 0}
.equipe-tableau{border:2px solid color-mix(in srgb,var(--eq,#61b6ff) 55%,transparent);border-radius:14px;
  background:color-mix(in srgb,var(--eq,#61b6ff) 8%,rgba(4,16,30,.8));padding:.7cqh .9cqw}
.equipe-tableau.gagnante{border-color:#ffd166;box-shadow:0 0 2cqh rgba(255,209,102,.22) inset}
.equipe-tableau header{display:flex;align-items:center;gap:.5cqw;margin-bottom:.4cqh}
.equipe-tableau header b{font:900 clamp(13px,1.2cqw,24px) 'Barlow Condensed';color:#ffd166}
.equipe-tableau header strong{font:900 clamp(11px,.95cqw,19px) 'Barlow Condensed';letter-spacing:.1em;color:var(--eq)}
.equipe-tableau table{width:100%;border-collapse:collapse;font-size:clamp(9px,.78cqw,16px);color:#e9f6ff}
.equipe-tableau th{font:800 clamp(8px,.62cqw,13px) 'Barlow Condensed';letter-spacing:.12em;opacity:.55;text-align:left;padding:.15cqh .3cqw}
.equipe-tableau td{padding:.25cqh .3cqw;border-top:1px solid rgba(140,196,244,.16)}
.equipe-tableau td b{color:#fff;font-size:1.15em}
.equipe-tableau tr.premier td{background:rgba(255,209,102,.09)}
.equipe-tableau tfoot td{border-top:2px solid color-mix(in srgb,var(--eq,#61b6ff) 45%,transparent);
  font-weight:800;opacity:.9}
.equipe-tableau .avatar{width:clamp(14px,1.25cqw,25px);height:clamp(14px,1.25cqw,25px);
  font-size:clamp(7px,.6cqw,12px);margin-right:.35cqw;vertical-align:middle}
.results-content.equipes{gap:.5cqh}
.results-content.equipes .result-main{display:none}

/* ==================== TROISIÈME PASSE, 26/09 ====================
   « Les lettres sortent encore de leur bulle à côté du nom », « le classement
   des équipes sur une ligne, aucune utilité », « un tableau du gagnant au plus
   nul, de gauche à droite — et de droite à gauche en hébreu ».
   ---------------------------------------------------------------- */

/* La pastille et le nom se chevauchaient : la pastille est en ligne, le nom
   aussi, et rien ne les séparait. On met la cellule en ligne de flex. */
.table-scores td:nth-child(2),
.equipe-tableau tbody td:first-child{display:flex;align-items:center;gap:.5cqw;min-width:0}
.table-scores td:nth-child(2) span,
.equipe-tableau tbody td:first-child span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.table-scores .avatar,.equipe-tableau .avatar{flex:0 0 auto;margin-right:0}

/* le score de l'équipe, dans l'en-tête du tableau */
.equipe-tableau header{justify-content:flex-start}
.equipe-tableau header u{margin-inline-start:auto;text-decoration:none;
  font:900 clamp(12px,1.15cqw,23px) 'Barlow Condensed';color:#fff}
.equipe-tableau header u i{font-style:normal;font-size:.45em;opacity:.5}

/* la note sur les effectifs, quand elle sert */
.results-content.equipes .note-moyenne{margin:.2cqh 0 .1cqh}
.results-content.equipes{gap:.6cqh}
.results-content.equipes .podium{height:17cqh}
.results-content.equipes .marche-1{height:17cqh}
.results-content.equipes .marche-2{height:14cqh}
.results-content.equipes .marche-3{height:12cqh}

/* --- les quatre entrées de test, groupées dans le bandeau --- */
.admin-groupe{display:inline-flex;gap:.3cqw;align-items:center}
.admin-entree.bis{min-width:clamp(26px,2.2cqw,44px);padding-inline:.5cqw;text-align:center}

/* --- La consigne et les ronds étaient COLLÉS au bandeau, et le bandeau à la
       barre transversale : mesuré le 26/09, le HUD finit à 63 px et la consigne
       commençait à 59 — elles se chevauchaient de 4 px, et tout tenait dans les
       85 premiers pixels d'un écran de 900. Jeremy : « ça a l'air bouffi comme
       ça l'un sur l'autre. » On descend la ligne et on lui donne de l'air. --- */
.play-consigne{top:11cqh;padding:.9cqh 2.2cqw;gap:2.5cqw;
  background:linear-gradient(180deg,rgba(0,9,21,.55),rgba(0,9,21,.18) 65%,transparent)}
.play-consigne .shot-track{gap:.75cqw}
.play-consigne span{letter-spacing:.14em}

/* ==================== LE BANDEAU DE JEU, D'UN SEUL TENANT ====================
   Jeremy, 26/09 : « la consigne et les ronds sont collés au poteau [...] tu me
   fais du travail de débutant. Agrandis le menu et rajoute ça dans le menu. »
   Il avait raison : c'étaient deux lignes flottantes posées l'une sur l'autre
   par-dessus la photo. Elles n'en font plus qu'une.

   ⚠ POURQUOI UNE BANDE ET PAS UN DÉCALAGE DE LA PHOTO. Il a aussi proposé de
   pousser le terrain vers le bas. Mais la scène ENTIÈRE représente l'écran de
   4,00 m × 2,50 m : lui prendre une bande en haut, c'est réduire la hauteur
   utile, et la cage ne ferait plus 2,00 m. Le bandeau est donc posé sur le
   CIEL de la photo — au-dessus de la barre transversale, qui commence à 8,6 %
   de la hauteur — sans rien voler au terrain.
   -------------------------------------------------------------------------- */
.play-bandeau{position:absolute;z-index:10;top:0;left:0;right:0;
  display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(2,10,22,.94) 0%,rgba(2,10,22,.88) 62%,rgba(2,10,22,.66) 88%,transparent 100%);
  border-bottom:1px solid rgba(120,180,230,.22);pointer-events:none}
.play-bandeau .play-menu{pointer-events:auto}
.play-bandeau .play-menu{min-width:clamp(68px,6.2cqw,112px);min-height:clamp(27px,3.5cqh,38px);padding:.22em 1em;border:1px solid rgba(148,210,247,.55);border-radius:999px;background:linear-gradient(180deg,rgba(17,53,80,.84),rgba(5,27,49,.88));box-shadow:inset 0 1px rgba(255,255,255,.12),0 3px 10px rgba(0,5,14,.28);color:#dff3ff;letter-spacing:.12em;transition:border-color .18s ease,background .18s ease,transform .18s ease}.play-bandeau .play-menu:first-of-type{border-color:rgba(255,205,119,.62);color:#ffe3ad;background:linear-gradient(180deg,rgba(89,57,17,.8),rgba(43,28,10,.86))}.play-bandeau .play-menu+.play-menu{margin-left:clamp(8px,.65cqw,14px);margin-right:clamp(12px,1cqw,22px)}.play-bandeau .play-menu:hover{transform:translateY(-1px);border-color:#fff;background:rgba(22,83,121,.92)}
/* la barre du haut n'est plus positionnée elle-même : elle est la 1re ligne */
.play-bandeau .play-hud{position:static;background:none;border:0;padding-inline:clamp(12px,1.3cqw,28px)}
/* la 2e ligne : la consigne à gauche, les ronds à droite, dans la même bande */
.play-hud-bas{display:flex;align-items:center;justify-content:space-between;
  gap:2.5cqw;padding:0 clamp(12px,1.3cqw,28px) .75cqh;
  color:#cfe8ff;font:800 clamp(11px,.92cqw,18px) 'Barlow Condensed',Impact,sans-serif;
  letter-spacing:.14em}
.play-hud-bas .shot-track{gap:.75cqw}
.play-hud-bas .shot-track i{width:clamp(11px,1.05cqw,21px);height:clamp(11px,1.05cqw,21px);
  border:2px solid rgba(255,255,255,.7);background:rgba(4,16,30,.5);box-shadow:none}
.play-hud-bas .shot-track i.hit{background:#8ef79a;border-color:#8ef79a}
.play-hud-bas .shot-track i.miss{background:#ff7a68;border-color:#ff7a68}
.play-hud-bas .shot-track i.now{background:#ffd166;border-color:#ffd166;
  box-shadow:0 0 0 .25cqw rgba(255,209,102,.3)}

/* Le bandeau s'arrête PILE sur la barre transversale. Ce n'est pas un réglage
   à l'œil : la cage est peinte à 8,6 % de la hauteur de la photo (CAGE.top
   dans app.js), et la scène fait 1000 px de haut — le bandeau fait donc
   8,6 cqh. Si la photo change, cette valeur change avec CAGE.top. */
.play-bandeau{height:8.6cqh;overflow:hidden}
.play-bandeau .play-hud{flex:1 1 auto;height:auto;min-height:0;align-items:center}
.play-hud-bas{flex:0 0 auto;padding-bottom:.35cqh}

/* ==================== PADEL : CINQ COUPS, TROIS CIBLES ====================
   Jeremy, 26/09 : « pour le positionnement j'aurais affiché un plan du terrain
   et proposé de choisir l'un des 6 emplacements », et trois formes de cible —
   lignes, cercles, cible mouvante.
   ------------------------------------------------------------------------- */
.padel-content{position:absolute;inset:11% 7% 9%;display:flex;flex-direction:column;
  align-items:center;gap:1cqh}
.padel-choix{display:grid;grid-template-columns:1.25fr 1fr;gap:2cqw;
  width:min(80cqw,1320px);align-items:start}
.padel-colonne{display:flex;flex-direction:column;gap:.5cqh}
.padel-colonne>strong{font:800 clamp(9px,.72cqw,15px) 'Barlow Condensed';letter-spacing:.18em;
  opacity:.6;margin-top:.4cqh}
.padel-coups{display:grid;grid-template-columns:repeat(3,1fr);gap:.5cqw}
.padel-coups button{padding:.9cqh .5cqw;border-radius:10px;cursor:pointer;
  border:1px solid rgba(140,196,244,.32);background:rgba(6,24,44,.72);color:#d7ecff;
  font:900 clamp(10px,.82cqw,17px) 'Barlow Condensed';letter-spacing:.08em}
.padel-coups button.active{border-color:#7fd0ff;background:rgba(41,110,176,.6);color:#fff;
  box-shadow:0 0 1.6cqh rgba(80,180,255,.28)}
.padel-formes{display:grid;grid-template-columns:repeat(3,1fr);gap:.5cqw}
.padel-formes button{display:flex;flex-direction:column;gap:.2cqh;padding:.8cqh .6cqw;
  border-radius:10px;cursor:pointer;text-align:left;
  border:1px solid rgba(140,196,244,.32);background:rgba(6,24,44,.72);color:#cfe8ff}
.padel-formes button b{font:900 clamp(10px,.8cqw,16px) 'Barlow Condensed';letter-spacing:.08em}
.padel-formes button small{font-size:clamp(8px,.62cqw,13px);opacity:.72;line-height:1.2}
.padel-formes button.active{border-color:#7fd0ff;background:rgba(41,110,176,.55);color:#fff}

/* Trois vues calibrees : la vignette est seulement une aide au choix. */
.padel-vues{display:grid;grid-template-columns:repeat(3,1fr);gap:.65cqw}
.padel-vue{min-width:0;padding:.5cqh .4cqw;border-radius:10px;overflow:hidden;
  background:rgba(6,24,44,.75);border:1px solid rgba(140,196,244,.4);color:#e7f4ff}
.padel-vue img{display:block;width:100%;aspect-ratio:16/10;object-fit:fill;border-radius:5px}
.padel-vue strong{display:block;margin-top:.6cqh;font:800 clamp(10px,.85cqw,17px) 'Barlow Condensed'}
.padel-vue.active{border:2px solid #a4ff81;box-shadow:0 0 18px rgba(104,255,145,.32)}
.plan-absent{padding:2cqh 1.5cqw;border-radius:12px;border:1px dashed rgba(140,196,244,.4);
  background:rgba(6,24,44,.5);color:#cfe8ff;font-size:clamp(10px,.8cqw,16px);line-height:1.35}
.padel-apercu{width:min(80cqw,1320px);min-height:22cqh;display:grid;grid-template-columns:32cqw 1fr;gap:1.4cqw;
  padding:1cqh 1cqw;border:1px solid rgba(111,188,238,.48);border-radius:14px;
  background:linear-gradient(115deg,rgba(5,25,43,.96),rgba(5,20,36,.91));box-shadow:0 1.2cqh 3cqh rgba(0,5,14,.22)}
.padel-apercu-visuel{position:relative;width:32cqw;height:20cqh;overflow:hidden;border-radius:9px;
  border:1px solid rgba(155,211,245,.42);background:#061526}
.padel-apercu-visuel>img{display:block;width:100%;height:100%;object-fit:fill}
.padel-apercu-visuel .padel-bande{z-index:2}
.padel-apercu-visuel .padel-cible{z-index:3}
.padel-mobile-guide{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.padel-mobile-guide line{stroke:#ffd166;stroke-width:5;stroke-dasharray:18 14;vector-effect:non-scaling-stroke}
.padel-mobile-guide path{fill:#ffd166;filter:drop-shadow(0 0 8px rgba(255,209,102,.75))}
.padel-apercu-texte{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(13cqw,.65fr);grid-template-areas:'kicker target' 'title target' 'copy target' 'stats target';align-content:center;gap:.15cqh 1.2cqw;text-align:left}
.padel-apercu-texte>span{grid-area:kicker;color:#91cfff;font:800 clamp(8px,.62cqw,12px) 'Barlow Condensed';letter-spacing:.2em}
.padel-apercu-texte>h2{grid-area:title;margin:.15cqh 0;font:900 clamp(22px,2.1cqw,40px)/1 'Barlow Condensed';color:#fff}
.padel-apercu-texte>p{grid-area:copy;margin:.2cqh 0;color:#d5e8f6;font-size:clamp(9px,.72cqw,14px);line-height:1.3}
.padel-apercu-cible{grid-area:target;display:flex;flex-direction:column;justify-content:center;padding:.8cqh .9cqw;
  border-left:1px solid rgba(113,183,230,.3);background:rgba(13,51,77,.32);border-radius:9px}
[dir="rtl"] .padel-apercu-cible{border-left:0;border-right:1px solid rgba(113,183,230,.3)}
.padel-apercu-cible small,.padel-apercu-stats small{color:#88bad9;font:800 clamp(7px,.52cqw,10px) 'Barlow Condensed';letter-spacing:.13em}
.padel-apercu-cible strong{margin:.35cqh 0;font:900 clamp(13px,1.05cqw,21px) 'Barlow Condensed';color:#a4ff81}
.padel-apercu-cible p{margin:0;color:#c6dcea;font-size:clamp(8px,.6cqw,12px);line-height:1.25}
.padel-apercu-stats{grid-area:stats;display:flex;gap:.6cqw;margin-top:.6cqh}
.padel-apercu-stats>div{min-width:6cqw;padding:.35cqh .6cqw;border:1px solid rgba(98,164,209,.34);border-radius:7px;background:rgba(6,27,47,.72);text-align:center}
.padel-apercu-stats small{display:block}.padel-apercu-stats b{font:900 clamp(13px,1.05cqw,21px) 'Barlow Condensed'}
.in-game .play-surface.scene-tennis{border:0;border-radius:0;box-shadow:none}
/* la cible sur le terrain : les deux lignes, ou les cercles */
.padel-bande{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;overflow:visible;
  filter:drop-shadow(0 0 8px rgba(164,255,129,.55))}
.padel-bande polygon{fill:rgba(75,244,127,.09)}
.padel-bande polygon.service-area{stroke:#a4ff81;stroke-width:5;vector-effect:non-scaling-stroke}
.padel-bande line{stroke:#a4ff81;stroke-width:5;vector-effect:non-scaling-stroke}
.padel-cible{position:absolute;z-index:4;transform:translate(-50%,-50%);pointer-events:none}
.padel-cible .anneau{position:absolute;inset:0;border-radius:50%;
  border:.5cqh solid #8fe9ff;box-shadow:0 0 1.6cqh rgba(143,233,255,.55),inset 0 0 1.2cqh rgba(143,233,255,.35)}
.padel-cible .anneau.petit{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);
  border-color:#fff;box-shadow:0 0 1.2cqh rgba(255,255,255,.7)}
.padel-cible.mobile .anneau{border-color:#ffd166;box-shadow:0 0 1.6cqh rgba(255,209,102,.55)}
.plan-poste.impossible text{fill:rgba(190,210,230,.45)}

/* ==================== PROFIL & SCORES : TABLEAU DE BORD UTILE ====================
   Les points bruts et l'XP artificielle ont ete retires : les sports n'ont pas
   le meme bareme. Toutes les valeurs comparees ici sont des scores sur 100. */
.settings-detail.stats-detail{inset:9.5% 3.5% 7%;align-items:center}
.stats-detail .page-title{margin-bottom:1cqh}
.stats-detail .page-title h1{font-size:clamp(30px,3.4cqw,62px)}
.stats-detail .stats-picker{width:min(91cqw,1640px);min-height:5.5cqh;margin:0 0 .8cqh;
  padding:.45cqh .5cqw;display:flex;justify-content:center;gap:.55cqw;overflow-x:auto}
.stats-detail .profile-pill{flex:0 0 auto;min-height:4.6cqh;padding:.35cqh .75cqw;border-radius:999px;
  background:rgba(5,24,43,.9);border-color:rgba(103,174,226,.45);font-size:clamp(10px,.75cqw,15px)}
.stats-detail .profile-pill .avatar{width:clamp(27px,2.25cqw,43px);height:clamp(27px,2.25cqw,43px);
  font-size:clamp(10px,.9cqw,17px);border-width:1px}
.stats-dashboard{width:min(91cqw,1640px);flex:1;min-height:0;display:grid;
  grid-template-rows:auto auto minmax(0,1fr);gap:.8cqh}
.stats-toolbar{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(620px,2.2fr);gap:.8cqw;
  min-height:8.5cqh;padding:.75cqh .9cqw;border:1px solid rgba(93,164,216,.5);border-radius:13px;
  background:linear-gradient(120deg,rgba(8,37,62,.96),rgba(4,20,36,.94));box-shadow:0 12px 30px rgba(0,0,0,.18)}
.stats-profile-summary{display:flex;align-items:center;gap:.8cqw;min-width:0}
.stats-profile-summary .avatar.large{width:clamp(48px,4.2cqw,78px);height:clamp(48px,4.2cqw,78px);
  font-size:clamp(19px,1.8cqw,34px)}
.stats-profile-summary>div{display:flex;flex-direction:column;min-width:0}
.stats-profile-summary small{font:800 clamp(8px,.58cqw,12px) 'Barlow Condensed';letter-spacing:.14em;color:#78bce9}
.stats-profile-summary strong{font:900 clamp(20px,1.7cqw,32px) 'Barlow Condensed';white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stats-profile-summary span{font-size:clamp(8px,.6cqw,12px);color:#9fbed3;margin-top:.15cqh}
.stats-filter-stack{display:grid;grid-template-columns:1.45fr .8fr;gap:.65cqw;align-items:center;min-width:0}
.stats-detail .stats-modes,.stats-detail .stats-sports{margin:0;gap:.35cqw;flex-wrap:nowrap}
.stats-detail .stats-modes button,.stats-detail .stats-sports button{min-width:0;min-height:4.8cqh;
  padding:.35cqh .45cqw;border-radius:8px;font-size:clamp(8px,.62cqw,13px);letter-spacing:.04em}
.stats-detail .stats-modes button small{font-size:.72em}
.stats-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:.65cqw}
.stats-kpis>div{position:relative;min-height:9cqh;padding:.75cqh .9cqw;border:1px solid rgba(92,158,207,.42);
  border-radius:12px;background:rgba(5,25,44,.92);display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.stats-kpis>div:before{content:'';position:absolute;left:0;top:18%;bottom:18%;width:3px;background:#65c7ff;box-shadow:0 0 12px #65c7ff}
.stats-kpis small{font:800 clamp(8px,.62cqw,13px) 'Barlow Condensed';letter-spacing:.1em;color:#8fbfdf}
.stats-kpis strong{font:900 clamp(24px,2.15cqw,42px) 'Barlow Condensed';line-height:1;color:#fff;margin-top:.25cqh}
.stats-kpis strong i,.stats-sport-card header>b i,.history-score i{font-style:normal;font-size:.43em;opacity:.6;margin-left:.12em}
.stats-kpis span{font-size:clamp(7px,.5cqw,10px);color:#7fa1b8;margin-top:.2cqh}
.stats-main-grid{display:grid;grid-template-columns:minmax(310px,.75fr) minmax(590px,1.55fr);gap:.8cqw;min-height:0}
.stats-sport-overview,.stats-history{min-height:0;border:1px solid rgba(92,158,207,.42);border-radius:13px;
  background:rgba(4,20,36,.93);padding:.8cqh .8cqw;overflow:hidden}
.stats-sport-overview>header,.stats-history>header{height:2.8cqh;display:flex;align-items:center;justify-content:space-between;
  font:900 clamp(10px,.78cqw,16px) 'Barlow Condensed';letter-spacing:.1em;color:#dff3ff}
.stats-history>header small{font-size:.72em;color:#729ab5;letter-spacing:.04em}
.stats-sport-overview>div{height:calc(100% - 2.8cqh);display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:.6cqh}
.stats-sport-overview>div:has(.stats-sport-card:only-child){grid-template-rows:minmax(0,1fr)}
.stats-sport-card{min-height:0;padding:.6cqh .7cqw;border:1px solid rgba(110,179,226,.32);border-radius:10px;
  background:linear-gradient(120deg,rgba(13,50,75,.78),rgba(6,27,47,.9));display:flex;flex-direction:column;justify-content:center}
.stats-sport-card.sport-football{border-left:3px solid #68df8d}.stats-sport-card.sport-tennis{border-left:3px solid #60c8ff}
.stats-sport-card header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.55cqw}
.stats-sport-card header>span{font-size:clamp(20px,1.8cqw,34px)}
.stats-sport-card header>div{display:flex;flex-direction:column;min-width:0}
.stats-sport-card header strong{font:900 clamp(11px,.85cqw,17px) 'Barlow Condensed';white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stats-sport-card header small{font-size:clamp(7px,.52cqw,10px);color:#8dafc7}
.stats-sport-card header>b{font:900 clamp(18px,1.55cqw,30px) 'Barlow Condensed'}
.stats-progress{height:.55cqh;border-radius:999px;background:rgba(108,157,190,.18);overflow:hidden;margin:.5cqh 0}
.stats-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#55b8ff,#82f59d);box-shadow:0 0 8px rgba(98,213,255,.5)}
.stats-sport-card footer{display:flex;justify-content:space-between;color:#8eadc2;font-size:clamp(7px,.52cqw,10px)}
.stats-sport-card footer b{color:#e7f6ff;margin-left:.2em}
.stats-history-list{height:calc(100% - 2.8cqh);overflow:auto;padding-right:.2cqw}
.stats-history-row{min-height:5.4cqh;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:.7cqw;
  padding:.5cqh .55cqw;border-top:1px solid rgba(95,151,191,.22)}
.stats-history-row:first-child{border-top:0}
.history-sport{display:grid;place-items:center;width:clamp(30px,2.6cqw,48px);height:clamp(30px,2.6cqw,48px);
  border-radius:9px;background:rgba(42,105,150,.25);font-size:clamp(16px,1.35cqw,25px)}
.history-copy{min-width:0;display:flex;flex-direction:column;gap:.15cqh}
.history-copy strong{font:800 clamp(9px,.7cqw,14px) 'Barlow Condensed';white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.history-copy small{font-size:clamp(7px,.5cqw,10px);color:#83a6bf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.history-copy em{font-style:normal;color:#ffd166}
.history-hits{display:flex;flex-direction:column;align-items:center;min-width:4.5cqw}
.history-hits small{font-size:clamp(6px,.45cqw,9px);color:#7397b1;letter-spacing:.05em}
.history-hits b{font:800 clamp(11px,.8cqw,16px) 'Barlow Condensed'}
.history-score{min-width:5.5cqw;text-align:right;font:900 clamp(17px,1.45cqw,28px) 'Barlow Condensed';color:#bfffc0}
.stats-empty{height:100%;display:grid;place-items:center;color:#88a9bf;font-size:clamp(10px,.75cqw,14px);text-align:center}

@media(max-width:0px){
  .settings-detail.stats-detail{width:96%;min-height:850px}
  .stats-dashboard{width:100%;display:flex;flex-direction:column}
  .stats-toolbar{grid-template-columns:1fr}.stats-filter-stack{grid-template-columns:1fr}
  .stats-kpis{grid-template-columns:repeat(2,1fr)}
  .stats-main-grid{grid-template-columns:1fr}.stats-sport-overview,.stats-history{min-height:260px}
}

/* Préparation des équipes sur le mur 4 × 2,5 m : chaque contrôle reste à
   hauteur de main et assez grand pour être touché sans précision de souris. */
.versus-content.team-config{inset:10.5% 6% 8%;gap:1.1cqh;justify-content:flex-start}
.team-config .page-title{margin-bottom:.4cqh}
.team-config .player-strip{width:min(78cqw,1400px);min-height:8.5cqh;margin:0;padding:.65cqh 1.4cqw}
.team-count{width:min(38cqw,680px);display:grid;grid-template-columns:auto minmax(220px,1fr);align-items:center;
  gap:1.2cqw;padding:.85cqh 1.1cqw;border:1px solid rgba(84,160,214,.55);border-radius:12px;
  background:rgba(5,25,43,.91)}
.team-count>strong{font:900 clamp(13px,1.05cqw,21px) 'Barlow Condensed';white-space:nowrap}
.team-count .segmented button{min-height:clamp(48px,5.8cqh,70px);font-size:clamp(17px,1.35cqw,27px)}
.team-config .equipes-grid{width:min(78cqw,1400px);grid-template-columns:repeat(auto-fit,minmax(18cqw,1fr));gap:.8cqw}
.team-config .equipe{min-height:9cqh;padding:.8cqh 1cqw}
.team-config .repartition{width:min(78cqw,1400px);margin:.3cqh auto 0}
.team-config .pastille{min-height:5.5cqh;padding:.55cqh .9cqw}
.team-config .bottom-cta{margin-top:auto;margin-bottom:.5cqh}
.team-config .bottom-cta .btn{min-width:24cqw;min-height:clamp(55px,6.8cqh,82px)}

@media(max-width:0px){
  .team-count{width:100%;grid-template-columns:1fr}
  .team-config .equipes-grid{width:100%;grid-template-columns:repeat(2,1fr)}
}

/* Accueil joueurs : une zone de commande compacte, lisible à taille humaine
   sur le mur 4 × 2,5 m et assez souple pour les libellés hébreux. */
.checkin-content.compact-checkin{inset:10.5% 24% 9.2%;justify-content:center}
.compact-checkin .page-title{margin-bottom:1.4cqh}
.compact-checkin .page-title .kicker{font-size:clamp(9px,.62cqw,12px)}
.compact-checkin .page-title h1{font-size:clamp(42px,3.8cqw,68px);line-height:.92;margin:.08em 0}
.compact-checkin .page-title p{font-size:clamp(12px,.92cqw,17px);margin:.3cqh 0 0}
.compact-checkin .slots{width:min(52cqw,832px);grid-template-columns:repeat(3,1fr);gap:.65cqh .55cqw}
.compact-checkin .slot{height:clamp(88px,10cqh,106px);padding:.55cqh .5cqw;border-radius:10px;gap:.1cqh}
.compact-checkin .slot-number{top:.55cqh;font-size:clamp(12px,.85cqw,16px);padding:.1em .4em}
.compact-checkin .slot-number{inset-inline-start:.45cqw;z-index:3;min-width:24px;text-align:center;background:#092a43;box-shadow:0 0 0 2px rgba(4,20,34,.85)}
.compact-checkin .slot .avatar{margin-top:.8cqh;width:clamp(28px,2.2cqw,42px);height:clamp(28px,2.2cqw,42px);font-size:clamp(12px,.9cqw,17px)}
.compact-checkin .slot strong{font-size:clamp(15px,1.15cqw,21px)}
.compact-checkin .slot small{font-size:clamp(8px,.56cqw,11px)}
.compact-checkin .slot .plus{font-size:clamp(30px,3cqw,48px);line-height:.78}
.compact-checkin .slot-remove{top:.45cqh;width:24px;height:24px;font-size:17px}
.session-player-list{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  width:min(52cqw,832px);max-height:34cqh;overflow-y:auto;padding:.25cqh .2cqw}
.session-player-cards{width:100%;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:.7cqh .55cqw}
.session-player-list .slot{flex:0 0 12.2cqw;width:12.2cqw;height:clamp(88px,10cqh,106px)}
.session-player-list .add-player-slot{flex:none;border-style:dashed;margin:2.2cqh auto 0}
.session-player-cards:empty+.add-player-slot{margin-top:0}
.session-player-list .add-player-slot strong{white-space:normal;line-height:1.02;text-align:center}
.checkin-toolbar{width:min(52cqw,832px);display:flex;align-items:stretch;justify-content:center;gap:.6cqw;margin-top:1.4cqh}
.checkin-action{min-width:0;min-height:clamp(50px,5.8cqh,62px);flex:1;display:flex;align-items:center;justify-content:center;gap:.7cqw;
  padding:.5cqh 1cqw;border:1px solid rgba(121,192,246,.72);border-radius:10px;background:rgba(6,26,46,.89);color:#fff;transition:.18s}
.checkin-action:hover{transform:translateY(-2px);box-shadow:0 0 22px rgba(51,169,251,.32);border-color:#aff0ff}
.checkin-action .icon{font-size:clamp(20px,1.65cqw,29px);line-height:1}
.checkin-action strong{min-width:0;font:800 clamp(14px,1.1cqw,20px) 'Barlow Condensed';line-height:1.05;overflow-wrap:anywhere}
.checkin-action.checkin-help{flex:.82}
.checkin-submit{width:min(52cqw,832px);margin-top:2cqh;margin-bottom:.6cqh;display:flex;align-items:center;justify-content:flex-end;gap:1.2cqw}
.checkin-submit small{margin-inline-end:auto;color:#a9c6da;font-size:clamp(10px,.75cqw,14px)}
.checkin-submit .btn{min-width:clamp(270px,22cqw,390px);max-width:32cqw;min-height:clamp(52px,6cqh,66px);padding:.55em 1.25em;
  white-space:normal;overflow-wrap:anywhere;line-height:1.02}

@media(max-width:0px){
  .checkin-content.compact-checkin{position:relative;inset:auto;margin:22px auto;width:94%;min-height:650px}
  .compact-checkin .slots{width:100%;grid-template-columns:repeat(3,1fr)}
  .checkin-toolbar,.checkin-submit{width:100%}
  .checkin-toolbar{flex-wrap:wrap}
  .checkin-action{flex:1 1 44%}.checkin-action.checkin-help{flex:1 1 100%}
}

/* Les menus ne se déroulent plus tous devant la même photo de football.
   Chaque étape possède son décor, tout en gardant la lumière et les couleurs
   Battle City. Les écrans sportifs utilisent le terrain du sport choisi. */
.shell{background-color:#06111e;background-image:none;background-position:center;background-size:cover;background-repeat:no-repeat}
.shell.world-entry{background-image:url('./assets/arena.jpg')}
.shell.world-entry:before{background:
  radial-gradient(ellipse at 50% 36%,rgba(35,139,212,.18),transparent 34%),
  linear-gradient(90deg,rgba(2,10,19,.38),rgba(3,14,26,.75) 27%,rgba(3,14,26,.75) 73%,rgba(2,10,19,.38)),
  linear-gradient(0deg,rgba(1,6,14,.64),transparent 42%,rgba(1,7,17,.16))}

/* Accueil des joueurs : hall numérique, volontairement neutre pour ne pas
   annoncer un sport avant que la session ne soit composée. */
.shell.world-players{background-image:
  radial-gradient(ellipse at 50% 112%,rgba(26,116,166,.54) 0,rgba(6,31,53,.28) 34%,transparent 61%),
  radial-gradient(circle at 12% 38%,rgba(34,134,207,.19),transparent 22%),
  radial-gradient(circle at 88% 38%,rgba(255,153,72,.13),transparent 22%),
  linear-gradient(118deg,#06111e 0,#0a2338 42%,#061523 67%,#07111d 100%)}
.shell.world-players:before{background:
  linear-gradient(90deg,rgba(1,7,14,.18),rgba(3,14,26,.44) 28%,rgba(3,14,26,.44) 72%,rgba(1,7,14,.18)),
  repeating-linear-gradient(90deg,transparent 0 12.4%,rgba(104,187,239,.045) 12.5% 12.6%),
  linear-gradient(0deg,rgba(1,6,14,.45),transparent 38%,rgba(1,7,17,.16))}
.shell.world-players .ambient{background:
  linear-gradient(115deg,transparent 0 16%,rgba(78,184,255,.06) 16.1% 16.3%,transparent 16.4% 83%,rgba(255,176,105,.05) 83.1% 83.3%,transparent 83.4%),
  radial-gradient(ellipse at 50% 72%,rgba(36,139,199,.2),transparent 48%)}
.shell.screen-registration .ambient,.shell.screen-registrationDone .ambient{background:
  radial-gradient(circle at 50% 45%,rgba(67,174,232,.2),transparent 28%),
  linear-gradient(120deg,transparent 0 31%,rgba(86,181,232,.06) 31.1% 31.25%,transparent 31.35% 68%,rgba(255,178,103,.045) 68.1% 68.25%,transparent 68.35%)}
.shell.screen-checkin .ambient{background:
  radial-gradient(ellipse at 50% 63%,rgba(40,154,215,.23),transparent 43%),
  linear-gradient(115deg,transparent 0 16%,rgba(78,184,255,.06) 16.1% 16.3%,transparent 16.4% 83%,rgba(255,176,105,.05) 83.1% 83.3%,transparent 83.4%)}
.shell.screen-phone .ambient{background:
  radial-gradient(circle at 50% 56%,rgba(46,169,229,.23),transparent 31%),
  repeating-linear-gradient(90deg,transparent 0 19.8%,rgba(104,187,239,.04) 20% 20.15%)}
.shell.screen-found .ambient,.shell.screen-trainingPlayer .ambient{background:
  radial-gradient(circle at 24% 48%,rgba(45,147,214,.14),transparent 23%),
  radial-gradient(circle at 76% 48%,rgba(255,164,83,.1),transparent 23%)}
.shell.screen-create .ambient{background:
  linear-gradient(90deg,transparent 0 20%,rgba(54,154,210,.07) 20.1% 20.25%,transparent 20.35% 79%,rgba(54,154,210,.07) 79.1% 79.25%,transparent 79.35%),
  radial-gradient(ellipse at 50% 52%,rgba(37,139,199,.18),transparent 50%)}
.shell.screen-versusConfig .ambient{background:
  radial-gradient(circle at 24% 55%,rgba(71,166,225,.14),transparent 25%),
  radial-gradient(circle at 76% 55%,rgba(255,157,77,.13),transparent 25%)}

/* Catalogue : football et padel forment le panorama. Le basket reste en pause
   et ne doit donc pas être présenté comme une expérience déjà disponible. */
.shell.world-catalog{background-color:#06111e;background-image:
  linear-gradient(90deg,rgba(2,10,19,.78),rgba(2,12,23,.42) 35%,rgba(3,14,26,.65) 50%,rgba(2,12,23,.42) 65%,rgba(2,10,19,.78)),
  url('./assets/football-stadium.jpg'),url('./assets/padel-court.jpg');
  background-position:center,left center,right center;
  background-size:100% 100%,56% 100%,56% 100%;background-repeat:no-repeat}
.shell.world-catalog:before{background:linear-gradient(0deg,rgba(1,6,14,.7),rgba(2,11,22,.38) 55%,rgba(1,7,17,.45))}
.shell.world-catalog .ambient{background:radial-gradient(ellipse at 50% 35%,rgba(34,139,206,.22),transparent 55%)}

/* Paramètres et statistiques : régie sombre avec grille technique, distincte
   des terrains et plus calme pour la lecture. */
.shell.world-settings{background-image:
  radial-gradient(circle at 50% 30%,rgba(30,128,188,.26),transparent 35%),
  linear-gradient(125deg,#05101d,#0a2034 48%,#07121f)}
.shell.world-settings:before{background:
  linear-gradient(90deg,rgba(2,9,17,.54),rgba(4,17,29,.28) 50%,rgba(2,9,17,.54)),
  repeating-linear-gradient(90deg,transparent 0 6.2%,rgba(109,185,232,.04) 6.25% 6.32%),
  repeating-linear-gradient(0deg,transparent 0 9.8%,rgba(109,185,232,.035) 10% 10.08%)}
.shell.world-settings .ambient{background:
  radial-gradient(circle at 17% 78%,rgba(60,154,213,.11),transparent 20%),
  radial-gradient(circle at 83% 22%,rgba(255,161,82,.08),transparent 18%)}
.shell.screen-roomWaiting .ambient{background:
  radial-gradient(circle at 50% 48%,rgba(67,174,232,.2),transparent 28%),
  repeating-radial-gradient(circle at 50% 48%,transparent 0 8%,rgba(100,191,239,.045) 8.2% 8.35%,transparent 8.55% 16%)}
.shell.screen-settingsDetail .ambient{background:
  linear-gradient(90deg,transparent 0 8%,rgba(91,172,221,.04) 8.1% 8.18%,transparent 8.3% 91%,rgba(91,172,221,.04) 91.1% 91.18%,transparent 91.3%),
  radial-gradient(ellipse at 50% 48%,rgba(37,129,185,.13),transparent 52%)}

/* Sélection des modes, défis, niveaux et résultats : retour dans le lieu réel
   du sport sélectionné. */
.shell.world-sport.sport-bg-football{background-image:url('./assets/football-stadium.jpg')}
.shell.world-sport.sport-bg-tennis{background-image:url('./assets/padel-court.jpg')}
.shell.world-sport.sport-bg-basket{background-image:url('./assets/basket-court.jpg')}
.shell.world-sport.sport-bg-baseball,.shell.world-sport.sport-bg-golf{background-image:
  radial-gradient(ellipse at 50% 70%,rgba(42,113,151,.36),transparent 48%),linear-gradient(145deg,#07131f,#12263a 55%,#07111c)}
.shell.world-sport:before{background:
  linear-gradient(90deg,rgba(2,9,18,.76),rgba(3,14,26,.58) 24%,rgba(3,14,26,.58) 76%,rgba(2,9,18,.76)),
  linear-gradient(0deg,rgba(1,6,14,.72),rgba(1,8,18,.16) 58%,rgba(1,7,17,.48))}
.shell.world-sport .ambient{background:radial-gradient(ellipse at 50% 28%,rgba(52,159,226,.17),transparent 50%)}

/* Catalogue : chaque sport jouable occupe sa propre part du panorama. */
.shell.world-catalog{background-image:
  linear-gradient(90deg,rgba(2,10,19,.66) 0 49.85%,rgba(7,26,39,.58) 50.15% 100%),
  url('./assets/football-stadium.jpg'),url('./assets/padel-court.jpg');
  background-position:center,left center,right center;
  background-size:100% 100%,50% 100%,50% 100%}
.shell.world-catalog:after{content:'';position:absolute;z-index:0;top:8%;bottom:7%;left:50%;width:1px;background:linear-gradient(transparent,rgba(154,222,255,.5) 22% 78%,transparent);box-shadow:0 0 24px rgba(89,188,241,.28);pointer-events:none}
.shell.world-catalog .games-content{z-index:2}
.catalog-active-grid{grid-template-columns:repeat(var(--sport-count),minmax(0,1fr));gap:4cqw;max-height:35cqh;width:min(88cqw,1500px)}
.catalog-active-grid .sport-card{min-height:0;background:linear-gradient(145deg,rgba(5,25,42,.62),rgba(3,15,27,.84));border-color:rgba(132,207,250,.72);box-shadow:0 18px 46px rgba(0,0,0,.24);backdrop-filter:blur(4px)}
.catalog-active-grid .sport-football{background:linear-gradient(145deg,rgba(8,74,39,.58),rgba(3,22,31,.82))}
.catalog-active-grid .sport-tennis{background:linear-gradient(145deg,rgba(7,69,105,.58),rgba(3,22,31,.82))}
.catalog-active-grid .sport-art{font-size:clamp(52px,5.4cqw,94px)}
.catalog-soon-strip{width:min(70cqw,1190px);display:flex;justify-content:center;gap:.7cqw;margin-top:1.1cqh}
.catalog-soon-strip .sport-card{flex:0 1 230px;min-height:46px;height:5.2cqh;border-radius:9px;display:grid;grid-template-columns:auto 1fr auto;filter:grayscale(.45);opacity:.58}
.catalog-soon-strip .sport-art{font-size:clamp(18px,1.6cqw,28px);padding:0 .65cqw}
.catalog-soon-strip .sport-info{height:100%;align-items:flex-start;justify-content:center;padding:.35cqh .55cqw;background:rgba(2,12,24,.7)}
.catalog-soon-strip .sport-info strong{font-size:clamp(12px,1cqw,18px)}
.catalog-soon-strip .sport-info small{display:none}
.catalog-soon-strip .sport-flag{width:auto;align-self:stretch;display:grid;place-items:center;padding:0 .65cqw;font-size:clamp(8px,.6cqw,11px)}

/* Les choix actifs restent lisibles comme deux terrains, pas comme des cartes génériques. */
.shell.world-catalog:before{background:linear-gradient(0deg,rgba(1,6,14,.48),rgba(2,11,22,.16) 55%,rgba(1,7,17,.3))}
.catalog-active-grid{width:min(91cqw,1550px);gap:2.2cqw}
.catalog-active-grid .sport-card{background-position:center;background-size:cover;background-repeat:no-repeat}
.catalog-active-grid .sport-football{background-image:linear-gradient(180deg,rgba(2,16,15,.08),rgba(2,13,22,.12) 48%,rgba(1,9,16,.64)),url('./assets/football-stadium.jpg')}
.catalog-active-grid .sport-tennis{background-image:linear-gradient(180deg,rgba(2,16,25,.08),rgba(2,13,22,.12) 48%,rgba(1,9,16,.64)),url('./assets/padel-court.jpg')}
.catalog-active-grid .sport-art{background:radial-gradient(circle,rgba(3,15,25,.52),transparent 64%);text-shadow:0 3px 20px rgba(0,0,0,.85)}
.catalog-active-grid .sport-info{background:linear-gradient(90deg,rgba(2,10,18,.9),rgba(4,22,35,.74),rgba(2,10,18,.9));backdrop-filter:blur(3px)}

/* Dans le catalogue, la composition de la session reste un simple repère.
   Pas de titre, de compteur ni d'action : seulement les profils, centrés. */
.catalog-player-strip{width:auto;max-width:min(76cqw,1220px);min-height:clamp(38px,5.2cqh,54px);margin:1.25cqh 0 1.6cqh;padding:0;border:0;border-radius:0;background:transparent;gap:.65cqw;flex-wrap:nowrap}
.catalog-player-strip .strip-player{min-width:0;gap:.42cqw;padding:.25cqh .62cqw .25cqh .3cqw;border:1px solid rgba(113,190,238,.5);border-radius:9px;background:rgba(3,18,31,.72);box-shadow:inset 0 1px rgba(255,255,255,.04);font:800 clamp(11px,.82cqw,15px) Inter,sans-serif;white-space:nowrap}
.catalog-player-strip .strip-player .avatar{width:clamp(28px,2.1cqw,39px);height:clamp(28px,2.1cqw,39px)}
.catalog-player-strip.avatars-only{gap:.45cqw}
.catalog-player-strip.avatars-only .strip-player{padding:.18cqh;border-color:transparent;background:transparent;box-shadow:none}
.catalog-player-strip.avatars-only .strip-player-name{display:none}
.catalog-player-strip.avatars-only .strip-player .avatar{width:clamp(30px,2.4cqw,44px);height:clamp(30px,2.4cqw,44px)}

/* Modes de jeu : symboles géométriques et lumière Battle City. */
.mode-grid.trois{gap:1.35cqw;width:min(82cqw,1330px)}
.mode-card{position:relative;isolation:isolate;overflow:hidden;border:1px solid rgba(100,205,255,.58);background:linear-gradient(155deg,rgba(6,29,48,.9),rgba(2,12,23,.97));box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 20px 50px rgba(0,0,0,.24)}
.mode-card:before{content:'';position:absolute;z-index:-1;inset:0;background:radial-gradient(circle at 50% 22%,var(--mode-glow,rgba(78,205,255,.2)),transparent 48%);opacity:.9}
.mode-card:after{content:'';position:absolute;left:12%;right:12%;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--mode-accent,#64d7ff),transparent);box-shadow:0 0 18px var(--mode-accent,#64d7ff)}
.mode-card.training{--mode-accent:#76f7a3;--mode-glow:rgba(72,224,145,.24);border-color:rgba(118,247,163,.7);background:linear-gradient(155deg,rgba(6,57,43,.9),rgba(2,16,27,.97))}
.mode-card.multi{--mode-accent:#ff50d6;--mode-glow:rgba(194,61,255,.27);border-color:rgba(226,96,255,.74);background:linear-gradient(155deg,rgba(48,16,73,.91),rgba(5,15,31,.97))}
.mode-card.equipes{--mode-accent:#43ddff;--mode-glow:rgba(26,168,255,.29);border-color:rgba(67,221,255,.74);background:linear-gradient(155deg,rgba(5,49,79,.91),rgba(3,17,32,.97))}
.mode-card:hover{border-color:var(--mode-accent);box-shadow:0 0 34px color-mix(in srgb,var(--mode-accent) 45%,transparent),inset 0 0 34px color-mix(in srgb,var(--mode-accent) 9%,transparent)}
.mode-card>strong{letter-spacing:.045em;text-shadow:0 3px 14px rgba(0,0,0,.65)}
.mode-card>span:last-child{color:var(--mode-accent);letter-spacing:.045em}
.mode-glyph{width:clamp(86px,7.6cqw,138px);height:clamp(64px,7cqh,94px);overflow:visible;color:var(--mode-accent);filter:drop-shadow(0 0 10px color-mix(in srgb,var(--mode-accent) 70%,transparent))}
.mode-glyph *{vector-effect:non-scaling-stroke}
.training-glyph circle{fill:none;stroke:currentColor;stroke-width:4}
.training-glyph .solid{fill:currentColor;stroke:none}
.multi-glyph .side-a,.multi-glyph .side-b{fill:rgba(8,18,36,.68);stroke-width:3;stroke-linejoin:round}
.multi-glyph .side-a{stroke:#ff62dc}
.multi-glyph .side-b{stroke:#58dfff}
.multi-glyph .energy{fill:#f4fbff;stroke:#fff;stroke-width:1;filter:drop-shadow(0 0 7px #fff)}
.multi-glyph .pulse{fill:none;stroke:rgba(211,126,255,.34);stroke-width:2;stroke-dasharray:4 8}
.team-glyph .links{fill:none;stroke:#52ddff;stroke-width:3;stroke-linecap:round;opacity:.72}
.team-glyph .node{fill:rgba(4,28,48,.92);stroke:#5ee7ff;stroke-width:3;stroke-linejoin:round}
.team-glyph .node.main{fill:rgba(30,111,161,.54);stroke:#d8f8ff;filter:drop-shadow(0 0 7px #31cfff)}
/* Les choix de partie se lisent comme des situations de jeu, pas comme des logos. */
.mode-photo{position:relative;width:88%;height:clamp(105px,17cqh,190px);overflow:hidden;border:1px solid rgba(195,235,255,.62);border-radius:14px;background-position:center;background-size:cover;box-shadow:inset 0 -55px 55px rgba(1,8,16,.38),0 12px 28px rgba(0,0,0,.28)}
.mode-photo.sport-football{background-image:url('./assets/football-scene-near.jpg')}.mode-photo.sport-tennis{background-image:url('./assets/padel-axe-calibre.png')}.mode-photo.sport-baseball{background-image:url('./assets/baseball-scene.jpg')}.mode-photo.sport-basket{background-image:url('./assets/basket-scene-near.jpg')}
.mode-personnes{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12%;background:linear-gradient(180deg,transparent 42%,rgba(2,11,20,.48))}.mode-personnes i{display:block;width:clamp(36px,3.4cqw,62px);aspect-ratio:1;border:3px solid #fff;border-radius:50%;background:linear-gradient(145deg,#85eaff,#1976ae);box-shadow:0 0 0 5px rgba(4,18,31,.72),0 0 24px var(--mode-accent)}.mode-personnes b{color:#fff;font:900 clamp(22px,2.1cqw,40px) Inter;text-shadow:0 3px 12px #000}.composition-equipes .mode-personnes{gap:6%}.composition-equipes .mode-personnes>span{display:flex;gap:.4cqw}.composition-equipes .mode-personnes>span:first-child i{background:linear-gradient(145deg,#ff9bdc,#b22c89)}.composition-equipes .mode-personnes>span:last-child i{background:linear-gradient(145deg,#8cecff,#1b7ab8)}.composition-equipes .mode-personnes i{width:clamp(29px,2.7cqw,50px)}
/* Profils joueurs : avatars illustrés, photo personnelle et noms plus nets. */
.avatar{position:relative;overflow:hidden;border-radius:18%;border:1px solid rgba(213,242,255,.88);clip-path:polygon(15% 0,85% 0,100% 15%,100% 85%,85% 100%,15% 100%,0 85%,0 15%);background:#12324f;box-shadow:0 0 0 2px rgba(89,191,255,.12),0 0 18px rgba(52,173,255,.32);font-family:Inter,sans-serif}
.avatar img{display:block;width:100%;height:100%;object-fit:cover}
.avatar-portrait{display:block;width:88%;height:88%;overflow:visible;filter:drop-shadow(0 2px 5px rgba(0,0,0,.36))}
.portrait-face{fill:var(--skin,#d7a071)}
.portrait-hair{fill:var(--hair,#14202d)}
.portrait-shoulders{fill:var(--suit,#68d8ff)}
.portrait-eye{fill:#14202d}
.portrait-smile{fill:none;stroke:#7d443b;stroke-width:1.5;stroke-linecap:round}
.portrait-visor{fill:rgba(74,231,255,.55);stroke:#d9fbff;stroke-width:1}
.portrait-band{fill:none;stroke:#fcdf6a;stroke-width:3;stroke-linecap:round}
.avatar-0{--skin:#d7a071;--hair:#162535;--suit:#61d8ff;background:linear-gradient(145deg,#173a58,#0874a7)}
.avatar-1{--skin:#8c563e;--hair:#171423;--suit:#d4a5ff;background:linear-gradient(145deg,#322655,#7a4eb6)}
.avatar-2{--skin:#f0c8a0;--hair:#654229;--suit:#71f5d7;background:linear-gradient(145deg,#173e46,#13978d)}
.avatar-3{--skin:#6d402d;--hair:#111923;--suit:#ffc46b;background:linear-gradient(145deg,#4b321a,#c67420)}
.avatar-4{--skin:#e5ad80;--hair:#3b1b27;--suit:#ff8fae;background:linear-gradient(145deg,#482333,#b34868)}
.avatar-5{--skin:#b97550;--hair:#242019;--suit:#b8f46d;background:linear-gradient(145deg,#263b22,#60a82f)}
.avatar.has-photo{background:#0a1b2a;border-color:#d8f4ff;clip-path:polygon(12% 0,88% 0,100% 12%,100% 88%,88% 100%,12% 100%,0 88%,0 12%)}
.slot.filled{background:linear-gradient(145deg,rgba(8,35,58,.96),rgba(5,20,36,.95));border-color:rgba(92,199,255,.72);box-shadow:inset 0 1px rgba(255,255,255,.05),0 9px 26px rgba(0,0,0,.22)}
.slot strong,.found-card strong,.strip-player,.rank strong,.table-scores td span{font-family:Inter,sans-serif;font-weight:800;letter-spacing:.01em}
.slot strong{font-size:clamp(15px,1.08cqw,20px)}
.checkin-submit{flex-direction:column;justify-content:center;gap:.7cqh;text-align:center}
.checkin-submit small{margin:0;order:2}
.checkin-submit .btn{margin-inline:auto;order:1}
.avatar-studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,28%);gap:1.3cqw;align-items:stretch;margin:1.7cqh 0}
.avatar-picker{min-width:0;margin:0;padding:1.1cqh 1cqw;border:1px solid rgba(80,153,204,.58);border-radius:12px;background:rgba(7,30,50,.72);align-items:flex-start;flex-direction:column}
.avatar-picker>div{width:100%;justify-content:space-between;gap:.55cqw}
.avatar-choice{position:relative;cursor:pointer;padding:.2cqh}
.avatar-choice input{position:absolute;opacity:0;pointer-events:none}
.avatar-choice .avatar{width:clamp(38px,3.1cqw,56px);height:clamp(38px,3.1cqw,56px);transition:transform .18s,filter .18s,box-shadow .18s}
.avatar-choice:hover .avatar{transform:translateY(-2px);filter:brightness(1.14)}
.avatar-choice input:checked+.avatar{outline:0;transform:translateY(-2px);box-shadow:0 0 0 3px #071c2d,0 0 0 5px #9dff8f,0 0 23px rgba(111,255,141,.5)}
.avatar-upload{position:relative;display:flex;align-items:center;gap:.8cqw;padding:1.1cqh .9cqw;border:1px dashed rgba(133,205,247,.75);border-radius:12px;background:rgba(7,30,50,.72);cursor:pointer;transition:.18s;color:#eaf8ff}
.avatar-upload:hover,.avatar-upload.selected{border-style:solid;border-color:#9dff8f;background:rgba(10,46,57,.82);box-shadow:0 0 20px rgba(90,225,145,.16)}
.avatar-upload input{position:absolute;opacity:0;pointer-events:none}
.avatar-upload-preview{flex:none;width:clamp(45px,3.9cqw,68px);height:clamp(45px,3.9cqw,68px);display:grid;place-items:center;overflow:hidden;border-radius:16%;clip-path:polygon(14% 0,86% 0,100% 14%,100% 86%,86% 100%,14% 100%,0 86%,0 14%);background:linear-gradient(145deg,#143954,#0b2237);border:1px solid #87cdf2}
.avatar-upload-preview img{width:100%;height:100%;object-fit:cover}
.avatar-upload>span:last-child{display:flex;min-width:0;flex-direction:column;gap:.3cqh}
.avatar-upload strong{font:800 clamp(11px,.82cqw,15px) Inter,sans-serif;line-height:1.05}
.avatar-upload small{font-size:clamp(9px,.65cqw,12px);line-height:1.2;color:#9fc6dd}
.camera-mark{position:relative;width:48%;height:36%;border:2px solid #bdeaff;border-radius:4px;box-shadow:0 0 10px rgba(89,204,255,.35)}
.camera-mark:before{content:"";position:absolute;left:31%;top:16%;width:32%;height:55%;border:2px solid #bdeaff;border-radius:50%}
.camera-mark:after{content:"";position:absolute;left:9%;top:-30%;width:34%;height:28%;border:2px solid #bdeaff;border-bottom:0;border-radius:3px 3px 0 0}
.avatar-upload.loading{opacity:.58;pointer-events:none}
@media(max-width:0px){.avatar-studio{grid-template-columns:1fr}.avatar-picker>div{justify-content:flex-start;flex-wrap:wrap}}

/* ================= FOOTBALL — TROIS MODES, SEPT NIVEAUX ================= */
.football-modes{inset:12.5% 6% 10%}
.football-modes .page-title{margin-bottom:2.5cqh}
.football-modes .page-title h1{font-size:clamp(42px,4.4cqw,82px)}
.foot-mode-grid{width:min(88cqw,1640px);height:min(56cqh,600px);display:grid;grid-template-columns:repeat(4,1fr);gap:1.1cqw}
.baseball-modes .foot-mode-grid{grid-template-columns:repeat(3,1fr)}
.baseball-roles .foot-mode-grid{grid-template-columns:repeat(2,1fr)}
.baseball-modes:not(.baseball-roles) .foot-mode-grid:has(>.foot-mode-card:nth-child(2):last-child){width:min(62cqw,1180px);grid-template-columns:repeat(2,minmax(0,1fr))}
.baseball-modes .foot-mode-grid:has(>.foot-mode-card:only-child){grid-template-columns:minmax(380px,560px);justify-content:center}
.foot-mode-card{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-rows:auto 1fr auto auto auto;align-items:center;justify-items:center;gap:.65cqh;padding:1.7cqh 1.35cqw 1.5cqh;border:1px solid rgba(142,210,255,.58);border-radius:18px;background:linear-gradient(155deg,rgba(9,34,58,.90),rgba(3,15,29,.97));color:#fff;transition:transform .22s,border-color .22s,box-shadow .22s}
.foot-mode-card:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,18,31,.08),rgba(2,10,20,.86)),url('./assets/football-stadium.jpg') center/cover;opacity:.42;filter:saturate(.75)}
.foot-mode-card:after{content:'';position:absolute;inset:auto 10% 0;height:2px;background:linear-gradient(90deg,transparent,var(--mode-color),transparent);box-shadow:0 0 22px var(--mode-color)}
.foot-mode-card:hover{transform:translateY(-6px);border-color:var(--mode-color);box-shadow:0 16px 45px rgba(0,0,0,.35),0 0 30px color-mix(in srgb,var(--mode-color) 32%,transparent)}
.foot-mode-card.mode-viser{--mode-color:#7dff9a}.foot-mode-card.mode-enchainer{--mode-color:#6edcff}.foot-mode-card.mode-eviter{--mode-color:#ff9a6e}.foot-mode-card.mode-penalty{--mode-color:#ffd56e}
.foot-mode-number{justify-self:start;color:var(--mode-color);font:800 clamp(12px,1cqw,19px) 'Barlow Condensed';letter-spacing:.22em}
.foot-mode-art{width:100%;height:100%;min-height:clamp(145px,23cqh,245px);align-self:center;color:var(--mode-color)}
.foot-mode-art svg{display:block;width:100%;height:auto;overflow:visible}
.exercise-preview{position:relative;width:100%;height:100%;overflow:hidden;border:1px solid rgba(208,239,255,.58);border-radius:14px;background-position:center;background-size:cover;box-shadow:inset 0 -40px 48px rgba(1,9,16,.28),0 10px 25px rgba(0,0,0,.3)}
.preview-foot{background-image:url('./assets/football-scene-near.jpg')}.exercise-preview .preview-target{position:absolute;left:50%;top:47%;width:18%;aspect-ratio:1;transform:translate(-50%,-50%);display:grid;place-items:center;border:clamp(3px,.25cqw,5px) solid #a4ffb8;border-radius:50%;background:rgba(51,226,111,.18);box-shadow:0 0 22px rgba(81,255,136,.8);color:#fff;font:900 clamp(13px,1.15cqw,22px) Inter}.preview-enchainer .t1{left:27%;top:35%}.preview-enchainer .t2{left:51%;top:57%}.preview-enchainer .t3{left:75%;top:34%}.exercise-preview .preview-obstacle{position:absolute;left:43%;top:19%;width:14%;height:62%;border:3px solid #ff8e78;border-radius:8px;background:rgba(191,37,34,.7);box-shadow:0 0 22px rgba(255,67,51,.65)}
.preview-penalty .preview-keeper{position:absolute;left:50%;bottom:-8%;width:29%;height:88%;transform:translateX(-50%);object-fit:contain;object-position:center bottom;filter:drop-shadow(0 7px 8px rgba(0,0,0,.72))}.preview-countdown{position:absolute;left:72%;top:15%;display:grid;place-items:center;width:18%;aspect-ratio:1;border:2px solid #ffe18b;border-radius:50%;background:rgba(2,16,29,.82);box-shadow:0 0 20px rgba(255,207,83,.75);color:#fff;font:900 clamp(18px,2.2cqw,40px) 'Barlow Condensed'}
.preview-baseball.scene-field{background-image:url('./assets/baseball-scene.jpg')}.preview-baseball.scene-pitcher{background-image:url('./assets/baseball-pitcher-scene.jpg')}.preview-baseball.scene-batter,.preview-bat-field{background-image:url('./assets/baseball-batter-scene.jpg')}.preview-baseball.role-lanceur{background-position:center}.preview-baseball.role-batteur{background-position:center 58%}
.preview-bag{position:absolute;width:7%;aspect-ratio:1;transform:translate(-50%,-50%) rotate(45deg);border:2px solid #d8e0e2;border-radius:8%;background:#fff;box-shadow:0 4px 8px rgba(0,0,0,.5)}.preview-bag.bag-1{left:20%;top:63%}.preview-bag.bag-2{left:50%;top:66%}.preview-bag.bag-3{left:80%;top:63%}.preview-bag.bag-4{left:30%;top:43%}.preview-bag.bag-5{left:50%;top:35%}.preview-bag.bag-6{left:70%;top:43%}.preview-pitch-bases .preview-target{left:70%;top:43%;width:17%}
.preview-player{position:absolute;left:51%;top:48%;width:8%;height:23%;transform:translate(-50%,-50%);border-radius:50% 50% 22% 22%;background:linear-gradient(90deg,#184c78,#56c8ff,#184c78);box-shadow:0 0 18px #58d4ff}.preview-pitch-relay .preview-target{left:51%;top:48%;width:20%}
.preview-relay-player{position:absolute;left:50%;bottom:-13%;width:28%;height:92%;object-fit:contain;object-position:center bottom;transform:translateX(-50%);filter:drop-shadow(0 5px 9px rgba(0,0,0,.65))}.preview-pitch-relay .preview-target{left:50%;top:42%;width:16%}.preview-pitch-relay .preview-route{position:absolute;left:17%;right:17%;top:43%;border-top:2px dashed rgba(255,214,112,.9)}
.preview-strike{position:absolute;left:50%;top:50%;width:24%;height:43%;transform:translate(-50%,-50%);border:4px solid #70dcff;border-radius:8px;background:linear-gradient(90deg,transparent 32%,rgba(255,255,255,.28) 33% 34%,transparent 35% 65%,rgba(255,255,255,.28) 66% 67%,transparent 68%),linear-gradient(0deg,transparent 32%,rgba(255,255,255,.28) 33% 34%,transparent 35% 65%,rgba(255,255,255,.28) 66% 67%,transparent 68%),rgba(43,180,255,.13);box-shadow:0 0 24px rgba(66,195,255,.75)}
.preview-bat-field{position:relative}.preview-hit-zone{position:absolute;display:grid;place-items:center;border:1px solid rgba(218,242,255,.22);background:transparent;color:#fff;font:900 clamp(10px,.9cqw,17px) Inter;text-shadow:0 2px 5px #000}.preview-hit-zone.home-run{left:0;right:0;top:0;height:25%;border-color:rgba(128,220,255,.34);color:#9fe5ff}.preview-hit-zone.middle-left{left:0;top:25%;width:38%;height:47%}.preview-hit-zone.launcher-zero{left:38%;top:25%;width:24%;height:47%;border-color:rgba(255,180,164,.3);color:#ffb0a2}.preview-hit-zone.middle-right{right:0;top:25%;width:38%;height:47%}.preview-hit-zone.bottom-left{left:0;bottom:0;width:38%;height:28%}.preview-hit-zone.ground-ball{left:38%;bottom:0;width:24%;height:28%}.preview-hit-zone.bottom-right{right:0;bottom:0;width:38%;height:28%}
.foot-mode-art .goal{fill:rgba(3,14,27,.52);stroke:rgba(224,244,255,.72);stroke-width:2}.foot-mode-art .target,.foot-mode-art .step{fill:rgba(25,73,95,.48);stroke:currentColor;stroke-width:3}.foot-mode-art .target-core{fill:#fff;filter:drop-shadow(0 0 8px currentColor)}.foot-mode-art .pulse{fill:currentColor}.foot-mode-art .route,.foot-mode-art .safe{fill:none;stroke:currentColor;stroke-width:3;stroke-dasharray:6 5}.foot-mode-art .block{fill:rgba(255,75,53,.42);stroke:#ff8c75;stroke-width:2}.foot-mode-art text{fill:#fff;font:800 14px Inter;text-anchor:middle}
.foot-mode-card>strong{font:900 clamp(27px,2.45cqw,48px)/1 'Barlow Condensed';letter-spacing:.04em}
.foot-mode-card>p{min-height:2.8em;margin:0;max-width:28ch;color:#d7e8f4;font-size:clamp(12px,1cqw,18px);line-height:1.4;text-align:center}
.foot-mode-action{margin-top:.5cqh;padding:.65em 1.4em;border:1px solid color-mix(in srgb,var(--mode-color) 70%,transparent);border-radius:999px;background:rgba(2,14,25,.74);color:var(--mode-color);font:800 clamp(12px,1.05cqw,20px) 'Barlow Condensed';letter-spacing:.08em}

.foot-levels{inset:11.5% 4% 10%;gap:1.2cqh}
.foot-level-head{width:min(90cqw,1740px);display:flex;align-items:center;justify-content:space-between;gap:2cqw}
.foot-level-head>span{color:#9fc8e2;font:700 clamp(11px,.9cqw,17px) 'Barlow Condensed';letter-spacing:.14em;white-space:nowrap}
.foot-mode-switch{display:flex;gap:.55cqw;padding:.45cqh .45cqw;border:1px solid rgba(83,149,198,.45);border-radius:12px;background:rgba(2,15,28,.68)}
.foot-mode-switch button{min-width:10cqw;padding:.55cqh 1.2cqw;border:1px solid transparent;border-radius:8px;background:transparent;color:#91aec3;font:800 clamp(12px,1cqw,19px) 'Barlow Condensed';letter-spacing:.07em}
.foot-mode-switch button.active{color:#fff;border-color:#77d7ff;background:linear-gradient(150deg,#115985,#0a3558);box-shadow:0 0 18px rgba(52,164,235,.35)}
.foot-levels.mode-viser .foot-mode-switch button.active{border-color:#8dffa1;background:linear-gradient(150deg,#17622e,#0b3b23)}
.foot-levels.mode-eviter .foot-mode-switch button.active{border-color:#ff9b76;background:linear-gradient(150deg,#7d3126,#461a1b)}
.foot-levels.mode-penalty .foot-mode-switch button.active{border-color:#ffe08a;background:linear-gradient(150deg,#7a5a18,#3f2d0c)}
.foot-levels .mode-explique{width:min(90cqw,1740px);gap:2.5cqw;min-height:0}
.foot-levels .mode-schema{width:min(28cqw,500px);max-height:31cqh;padding:1cqh 1cqw;background:linear-gradient(145deg,rgba(3,22,39,.76),rgba(4,15,28,.9))}
.foot-levels .mode-explique-photo{width:min(31cqw,560px);height:min(31cqh,330px);flex:none}.foot-levels .mode-explique-photo .exercise-preview{min-height:100%;box-shadow:0 18px 42px rgba(0,0,0,.35),0 0 28px color-mix(in srgb,var(--mode-color,#65d8ff) 20%,transparent)}
.foot-levels .mode-schema rect:first-child{fill:rgba(7,33,50,.62);stroke:#b9dcf3;stroke-width:2}.foot-levels .mode-schema .ground{stroke:#fff;stroke-width:3}.foot-levels .mode-schema circle{fill:rgba(19,77,99,.72);stroke:#83e8ff;stroke-width:3}.foot-levels .mode-schema .good{stroke:#82ff98}.foot-levels .mode-schema .core{fill:#fff;stroke:#fff}.foot-levels .mode-schema .fake{stroke:#ff7566;fill:rgba(126,22,27,.55)}.foot-levels .mode-schema .route{fill:none;stroke:#ffd16d;stroke-width:2.5;stroke-dasharray:6 4}.foot-levels .mode-schema .timer{fill:none;stroke:#8dffa1;stroke-width:3}.foot-levels .mode-schema text{fill:#fff;font:800 13px Inter;text-anchor:middle}.foot-levels .mode-schema .block{fill:rgba(107,18,20,.72);stroke:#ff806b;stroke-width:2}.foot-levels .mode-schema .safe{fill:none;stroke:#8dffa1;stroke-width:3;stroke-dasharray:6 4}
.baseball-schema .bat-zone{stroke:rgba(235,249,255,.9);stroke-width:1.5}.baseball-schema .bat-zone.home{fill:rgba(25,151,224,.36);stroke:#80dcff}.baseball-schema .bat-zone.middle{fill:rgba(255,191,55,.3)}.baseball-schema .bat-zone.bottom{fill:rgba(50,188,255,.27)}.baseball-schema .bat-zone.ground{fill:rgba(50,211,103,.25)}.baseball-schema .bat-zone.zero{fill:rgba(92,11,16,.72);stroke:#ff7768}
.foot-levels .mode-texte h1{font-size:clamp(30px,5.2cqh,78px);margin:.06em 0 .16em}.foot-levels .mode-texte p{font-size:clamp(14px,2.15cqh,31px);margin-bottom:1.3cqh}.foot-rule-line{display:flex;align-items:center;gap:.8cqw;margin:0 0 1.35cqh;padding:.75cqh 1cqw;border-left:3px solid #79d9ff;background:linear-gradient(90deg,rgba(26,108,159,.22),transparent);color:#dff4ff}.foot-rule-line b{color:#85d9ff;font:800 clamp(10px,1.2cqh,18px) 'Barlow Condensed';letter-spacing:.18em}.foot-rule-line span{font:700 clamp(12px,1.55cqh,23px) Inter}
.modes-ligne.sept{grid-template-columns:repeat(var(--level-count,7),1fr);width:min(90cqw,1740px);gap:.7cqw;margin-bottom:.2cqh}.modes-ligne.sept .niveau-card{height:clamp(64px,10cqh,120px)}.modes-ligne.sept .niveau-card small{font-size:clamp(9px,1.15cqh,17px)}.modes-ligne.sept .niveau-card strong{font-size:clamp(10px,1.5cqh,22px)}

.cible.sequence{--c1:#c9f5ff;--c2:#37bbff}.cible.sequence.attente{opacity:.82}.cible.sequence.active-order{--c1:#d7ffe0;--c2:#39e478}.cible.sequence.terminee{opacity:0!important}.cible-ordre{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:55%;height:55%;border-radius:50%;background:rgba(2,16,29,.82);color:#fff;font:900 clamp(14px,2.2cqw,38px) 'Barlow Condensed';text-shadow:0 0 12px #59caff;transition:opacity .22s,transform .22s}.cible.memoire-cachee .cible-ordre{opacity:0;transform:translate(-50%,-50%) scale(.55)}.cible.sequence.leurre .cible-ordre{display:none}
.cible.cible-cachee{opacity:0!important;transform:translate(-50%,-50%) scale(.72)!important}
.cible-valeur{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:64%;height:64%;border-radius:50%;background:rgba(2,20,24,.86);color:#fff;font:900 clamp(12px,1.65cqw,30px) 'Barlow Condensed';text-shadow:0 0 10px #65ff95}
.cible.cible-eviter{--c1:#d7ffe6;--c2:#35d97a}
.blocus.obstacle-horizontal,.blocus.obstacle-vertical{border-radius:8px}.blocus.obstacle-horizontal i{animation-direction:reverse}
.play-surface.foot8.t-neon .scene-image{filter:brightness(1.04) saturate(.94)}
.play-surface.foot8.t-neon:after{background:linear-gradient(180deg,rgba(2,18,36,.12),rgba(4,32,50,.08))}

/* PENALTY : aucune cible ni aucun chrono. L'impact déclenche la réaction ;
   la dernière pose reste affichée avec le ballon au point réellement frappé. */
.play-surface.foot8.t-penalty .scene-image{filter:brightness(.9) saturate(.95)}
.play-surface.foot8.t-penalty:after{background:radial-gradient(ellipse at 50% 52%,transparent 18%,rgba(0,7,16,.18) 74%)}
.penalty-scene{position:absolute;inset:0;z-index:3;pointer-events:none}
.penalty-gardien{position:absolute;z-index:3;left:4.4%;top:9.5%;width:91.1%;height:90.5%;overflow:hidden}
.penalty-gardien img{position:absolute;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 9px 9px rgba(0,0,0,.72));transition:opacity .1s ease,transform .22s cubic-bezier(.18,.74,.28,1)}
.gardien-pret{left:50%;bottom:-4%;width:31%;height:92%;transform:translateX(-50%);opacity:1}
.gardien-plongeon{position:absolute;width:50%;height:95%;opacity:0;background:url('./assets/football-keeper-dive-sprite.png') 0 0/600% 100% no-repeat;filter:drop-shadow(0 9px 9px rgba(0,0,0,.72));--dive-top:-2%;--dive-y1:6.4%;--dive-y2:4.3%;--dive-y3:2.2%;--dive-y4:.1%}
.plongeon-gauche-bas .gardien-plongeon,.plongeon-droite-bas .gardien-plongeon{--dive-top:30%;--dive-y1:12.8%;--dive-y2:17.1%;--dive-y3:21.4%;--dive-y4:25.7%}
.phase-plonge .gardien-pret,.phase-resultat .gardien-pret,.phase-ferme .gardien-pret{opacity:0}
.phase-plonge.plongeon-gauche-bas .gardien-plongeon,.phase-plonge.plongeon-gauche-haut .gardien-plongeon{opacity:1;animation:keeper-dive-left 1s steps(1,end) var(--dive-offset,0s) both}
.phase-plonge.plongeon-droite-bas .gardien-plongeon,.phase-plonge.plongeon-droite-haut .gardien-plongeon{opacity:1;animation:keeper-dive-right 1s steps(1,end) var(--dive-offset,0s) both}
.phase-resultat .gardien-plongeon,.phase-ferme .gardien-plongeon{opacity:1;top:var(--dive-top);background-position:100% 0}.phase-resultat.plongeon-gauche-bas .gardien-plongeon,.phase-resultat.plongeon-gauche-haut .gardien-plongeon,.phase-ferme.plongeon-gauche-bas .gardien-plongeon,.phase-ferme.plongeon-gauche-haut .gardien-plongeon{left:9.4%;transform:scale(1.26)}.phase-resultat.plongeon-droite-bas .gardien-plongeon,.phase-resultat.plongeon-droite-haut .gardien-plongeon,.phase-ferme.plongeon-droite-bas .gardien-plongeon,.phase-ferme.plongeon-droite-haut .gardien-plongeon{right:9.4%;transform:scaleX(-1) scale(1.26)}
@keyframes keeper-dive-left{0%,16.66%{left:25%;top:10%;background-position:0 0;transform:none}16.67%,33.32%{left:22%;top:var(--dive-y1);background-position:20% 0;transform:none}33.33%,49.99%{left:19%;top:var(--dive-y2);background-position:40% 0;transform:none}50%,66.65%{left:16%;top:var(--dive-y3);background-position:60% 0;transform:none}66.66%,83.32%{left:12%;top:var(--dive-y4);background-position:80% 0;transform:none}83.33%,100%{left:9.4%;top:var(--dive-top);background-position:100% 0;transform:scale(1.26)}}
@keyframes keeper-dive-right{0%,16.66%{right:25%;top:10%;background-position:0 0;transform:scaleX(-1)}16.67%,33.32%{right:22%;top:var(--dive-y1);background-position:20% 0;transform:scaleX(-1)}33.33%,49.99%{right:19%;top:var(--dive-y2);background-position:40% 0;transform:scaleX(-1)}50%,66.65%{right:16%;top:var(--dive-y3);background-position:60% 0;transform:scaleX(-1)}66.66%,83.32%{right:12%;top:var(--dive-y4);background-position:80% 0;transform:scaleX(-1)}83.33%,100%{right:9.4%;top:var(--dive-top);background-position:100% 0;transform:scaleX(-1) scale(1.26)}}
.plongeon-centre.phase-plonge .gardien-pret,.plongeon-centre.phase-resultat .gardien-pret,.plongeon-centre.phase-ferme .gardien-pret{opacity:0}.plongeon-centre.phase-plonge .gardien-plongeon,.plongeon-centre.phase-resultat .gardien-plongeon,.plongeon-centre.phase-ferme .gardien-plongeon{opacity:1;left:25%;top:10%;background-position:0 0;transform:scale(1.1)}
.penalty-ball{position:absolute;z-index:4;width:7%;aspect-ratio:1;transform:translate(-50%,-50%) scale(0);animation:penalty-ball-impact .38s cubic-bezier(.18,1.42,.38,1) forwards;filter:drop-shadow(0 .45cqw .5cqw rgba(0,0,0,.82));transform-origin:center}.penalty-ball img{display:block;width:100%;height:100%;object-fit:contain}.penalty-ball:after{content:'';position:absolute;left:50%;top:50%;width:115%;height:115%;border:2px solid rgba(219,244,255,.5);border-radius:50%;transform:translate(-50%,-50%) scale(.3);opacity:0;animation:penalty-ball-ring .45s ease-out forwards}.penalty-ball.result-but{z-index:2;animation:penalty-ball-goal .72s cubic-bezier(.22,.72,.28,1) forwards;filter:drop-shadow(0 .13cqw .2cqw rgba(0,0,0,.58))}.penalty-ball.result-but:after{display:none}.penalty-ball.result-arret{z-index:5;--ball-scale:1.08}.penalty-ball.result-hors{z-index:5;--ball-scale:1}@keyframes penalty-ball-impact{0%{transform:translate(-50%,-50%) scale(2.15) rotate(-24deg);filter:blur(4px);opacity:.08}62%{opacity:1}100%{transform:translate(-50%,-50%) scale(var(--ball-scale,1)) rotate(0);filter:blur(0);opacity:1}}@keyframes penalty-ball-goal{0%{transform:translate(-50%,-50%) scale(1.18);filter:blur(1.5px);opacity:.38}45%{opacity:1}100%{transform:translate(-50%,-50%) scale(.9);filter:blur(0);opacity:1}}@keyframes penalty-ball-ring{0%{opacity:.8;transform:translate(-50%,-50%) scale(.35)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.7)}}
.penalty-outcome{position:absolute;z-index:9;left:50%;bottom:10%;transform:translate(-50%,30%) scale(.82);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .28s cubic-bezier(.2,1.3,.45,1)}.penalty-outcome.visible{opacity:1;transform:translate(-50%,0) scale(1)}.penalty-outcome strong{display:block;min-width:clamp(220px,28cqw,520px);padding:.22em .8em;border:clamp(2px,.22cqw,4px) solid #fff;border-radius:12px;background:rgba(3,20,34,.91);color:#fff;font:900 clamp(34px,5cqw,92px)/1 'Barlow Condensed';letter-spacing:.04em;text-align:center;text-shadow:0 3px 12px #000;box-shadow:0 0 35px rgba(88,213,255,.55)}.penalty-outcome.result-but strong{border-color:#7dff9a;background:rgba(6,87,39,.93);box-shadow:0 0 42px rgba(64,255,122,.72)}.penalty-outcome.result-arret strong{border-color:#ffba75;background:rgba(98,38,12,.94);box-shadow:0 0 40px rgba(255,121,55,.7)}.penalty-outcome.result-hors strong,.penalty-outcome.result-trop-tot strong,.penalty-outcome.result-trop-tard strong{border-color:#ff8d82;background:rgba(101,20,20,.94);box-shadow:0 0 36px rgba(255,72,55,.62)}


/* ---- LE MUR : les blocs de Viser, dernier niveau (28/09/2026) ----
   Jeremy : « un mur en tetris avec des formes rectangle et carre de toute sorte.
   Plus c est gros moins y a de points. » Le bloc n est donc PAS un anneau : c est
   une plaque pleine, rectangulaire, qui porte sa valeur. Quand elle tombe, elle
   laisse un trou — et le trou est ce qui rend le niveau de plus en plus dur.

   ⚠ LE MUR NE CLIGNOTE PAS ENTRE DEUX BALLES. Une cible ordinaire arrive en
   fondu (`.cible` naît a opacity 0 et `.vivante` la revele a l image suivante).
   Applique au mur, ca le faisait DISPARAITRE puis REAPPARAITRE a chaque tir —
   Jeremy : « les cases apparaissent vides et il remet les cases restantes ».
   Les blocs recoivent donc `vivante` des le rendu, et n ont pas de transition
   d entree : seul leur EFFACEMENT est anime. */
.cible.bloc{transform:translate(-50%,-50%);opacity:0;transition:opacity .28s ease,transform .28s ease}
.cible.bloc.vivante{opacity:1;transform:translate(-50%,-50%)}
.cible.bloc.terminee{opacity:0!important;transform:translate(-50%,-50%) scale(.72)}
.cible.bloc .cible-anneau{border-radius:.5em;border-width:.16em;animation:none;
  border-color:var(--bc1);
  background:var(--bf);
  box-shadow:0 0 .25em rgba(255,255,255,.55),0 0 1em var(--bc2),inset 0 -.4em .9em rgba(0,0,0,.22)}
.cible.bloc .cible-valeur{width:auto;height:auto;min-width:2.1em;padding:.08em .38em;
  border-radius:.32em;background:rgba(2,20,24,.72)}
/* La couleur dit la valeur, et le fond reste TRANSPARENT pour qu on voie la cage
   derriere — Jeremy : « remplir les cases d un fond vert transparent, meme une
   couleur differente selon les nombres a l interieur ». */
.cible.bloc{--bc1:#8effc0;--bc2:#35d97a;--bf:rgba(53,217,122,.22)}
.cible.bloc.valeur-5 {--bc1:#a9ffd0;--bc2:#2fd070;--bf:rgba(47,208,112,.16)}
.cible.bloc.valeur-10{--bc1:#ffe9a8;--bc2:#ffc233;--bf:rgba(255,194,51,.20)}
.cible.bloc.valeur-20{--bc1:#ffc0ae;--bc2:#ff6a3d;--bf:rgba(255,106,61,.24)}

/* ================= BASEBALL — terrain, modes et frappes ================= */
.shell.world-sport.sport-bg-baseball{background-image:url('./assets/baseball-scene.jpg');background-position:center;background-size:cover}
.shell.world-catalog{background-image:
  linear-gradient(90deg,rgba(2,10,19,.52),rgba(2,10,19,.28) 33%,rgba(2,10,19,.44) 50%,rgba(2,10,19,.28) 67%,rgba(2,10,19,.52)),
  url('./assets/football-stadium.jpg'),url('./assets/padel-court.jpg'),url('./assets/baseball-scene.jpg');
  background-position:center,left center,center center,right center;
  background-size:100% 100%,38% 100%,38% 100%,38% 100%;background-repeat:no-repeat}
.shell.world-catalog:after{left:0;width:100%;background:linear-gradient(90deg,transparent 33.25%,rgba(154,222,255,.5) 33.33%,transparent 33.41%,transparent 66.58%,rgba(154,222,255,.5) 66.66%,transparent 66.74%);box-shadow:none}
.catalog-active-grid .sport-baseball{background-image:linear-gradient(180deg,rgba(33,10,4,.05),rgba(36,13,5,.1) 48%,rgba(15,7,3,.68)),url('./assets/baseball-card.jpg');border-color:rgba(255,171,95,.78)}
.stats-sport-card.sport-baseball{border-left:3px solid #ff9f5c}

.baseball-mode-card:before{background-image:linear-gradient(180deg,rgba(18,8,2,.08),rgba(13,6,2,.88)),url('./assets/baseball-card.jpg')}
.foot-mode-card.mode-lanceur,.foot-mode-card.mode-pitch-bases,.foot-mode-card.mode-pitch-relay,.foot-mode-card.mode-pitch-strike{--mode-color:#65d8ff}.foot-mode-card.mode-batteur,.foot-mode-card.mode-bat-place,.foot-mode-card.mode-bat-bases,.foot-mode-card.mode-bat-power{--mode-color:#ff9f5c}
.baseball-role-grid{grid-template-columns:repeat(2,minmax(0,1fr));width:min(72cqw,1360px);margin-inline:auto}.baseball-role-return{width:min(88cqw,1660px);margin:-1.6cqh auto .8cqh}.baseball-role-return button{border:1px solid rgba(143,214,255,.36);border-radius:999px;background:rgba(3,18,31,.76);color:#dff6ff;padding:.55em 1.1em;font-weight:800}
.baseball-mode-card .diamond,.baseball-schema .diamond{fill:rgba(29,96,51,.4);stroke:#ecbe78;stroke-width:3}
.baseball-mode-card .baseline{fill:none;stroke:rgba(255,237,204,.55);stroke-width:2}
.baseball-mode-card .target{fill:rgba(84,234,127,.2);stroke:#8dffab;stroke-width:3}.baseball-mode-card .target-core{fill:#fff;stroke:#8dffab;stroke-width:2}
.baseball-mode-card .base{fill:#fff0c7;stroke:#ffbd56;stroke-width:2}.baseball-mode-card .route{fill:none;stroke:#ffca68;stroke-width:3;stroke-dasharray:6 4}
.baseball-mode-card .fence{fill:none;stroke:#ff9b66;stroke-width:4}.baseball-mode-card .flight,.baseball-mode-card .throw{fill:none;stroke:#f7fbff;stroke-width:3;stroke-dasharray:6 5}.baseball-mode-card .ball{fill:#fff;stroke:#ff6e58;stroke-width:2}.baseball-mode-card .strike{fill:rgba(101,216,255,.14);stroke:#65d8ff;stroke-width:3}.baseball-mode-card .plate{fill:#fff2d1;stroke:#ffca68;stroke-width:2}.baseball-mode-card .catcher,.baseball-mode-card .batter,.baseball-mode-card .fielder,.baseball-mode-card .bat{fill:none;stroke:#f7fbff;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.baseball-levels .mode-schema{background:linear-gradient(145deg,rgba(6,34,25,.8),rgba(24,12,5,.92));border-color:rgba(255,185,105,.42)}
.baseball-schema .good{fill:rgba(80,239,131,.2)!important;stroke:#81ff9f!important}.baseball-schema .fence{fill:none;stroke:#ff9b66;stroke-width:4}.baseball-schema .base{fill:rgba(255,190,82,.28)!important;stroke:#ffca68!important}.baseball-schema .block{fill:rgba(182,42,31,.78)!important;stroke:#ff8b70!important}.baseball-schema text{fill:#fff;font:800 10px Inter;text-anchor:middle}.baseball-schema .route{fill:none;stroke:#ffd16d;stroke-width:2.5;stroke-dasharray:6 4}
.modes-ligne.six{grid-template-columns:repeat(6,1fr);width:min(88cqw,1660px);gap:.75cqw;margin-bottom:.2cqh}.modes-ligne.six .niveau-card{height:clamp(68px,10.5cqh,122px)}
.modes-ligne.cinq{grid-template-columns:repeat(var(--level-count,5),1fr);width:min(84cqw,1580px);gap:.85cqw;margin-bottom:.2cqh}.modes-ligne.cinq .niveau-card{height:clamp(68px,10.5cqh,122px)}.modes-ligne.cinq:has(>.niveau-card:only-child){grid-template-columns:minmax(280px,520px);justify-content:center}

.in-game .scene-baseball{background:#071613;border:0;border-radius:0;box-shadow:none}.in-game .scene-baseball:before{background:linear-gradient(180deg,rgba(0,7,19,.38),transparent 16%,transparent 79%,rgba(21,7,2,.18))}
.in-game .baseball-field{position:absolute;inset:0;z-index:0;pointer-events:none}.baseball-field .scene-image{filter:saturate(1.05) contrast(1.02)}
.baseball-field .scene-image.pitch-strike-scene{transform:translateY(3.3%) scale(1.065);transform-origin:center center}
.baseball-target{position:absolute;z-index:4;transform:translate(-50%,-50%);display:grid;place-items:center;border:clamp(4px,.38cqw,7px) solid #9effb0;border-radius:50%;background:radial-gradient(circle,rgba(178,255,193,.24),rgba(45,226,108,.09) 57%,transparent 59%);box-shadow:0 0 7px #fff,0 0 32px rgba(74,255,129,.82),inset 0 0 28px rgba(79,255,138,.32)}
.baseball-target span{position:absolute;inset:31%;border:clamp(2px,.2cqw,4px) solid rgba(255,255,255,.95);border-radius:50%;box-shadow:0 0 14px #fff}.baseball-target b{position:absolute;top:105%;white-space:nowrap;padding:.18em .6em;border-radius:6px;background:rgba(3,19,17,.82);font:900 clamp(9px,.75cqw,14px) 'Barlow Condensed';letter-spacing:.08em;color:#e9fff0}
.baseball-base-layout{position:absolute;inset:0;z-index:2;pointer-events:none}.baseball-bag{position:absolute;width:4.4%;aspect-ratio:1;transform:translate(-50%,-50%) rotate(45deg);border:clamp(2px,.16cqw,3px) solid #dce5e8;border-radius:8%;background:linear-gradient(145deg,#fff,#cfd7d8);box-shadow:0 5px 8px rgba(0,0,0,.42),0 0 0 2px rgba(79,47,25,.34)}.baseball-bag span{position:absolute;inset:0;display:grid;place-items:center;transform:rotate(-45deg);color:#193047;font:900 clamp(10px,.85cqw,16px) Inter}.baseball-bag.bag-1{left:72%;top:61%}.baseball-bag.bag-2{left:50%;top:41%}.baseball-bag.bag-3{left:28%;top:61%}
.baseball-target.derby{border-color:#ffb05e;background:radial-gradient(ellipse,rgba(255,185,84,.28),rgba(255,80,38,.09) 62%,transparent 64%);box-shadow:0 0 8px #fff,0 0 34px rgba(255,105,50,.82),inset 0 0 30px rgba(255,160,56,.32)}.baseball-target.derby span{border-color:#fff0c4}
.baseball-target.pitch-strike{border-radius:16%;border-color:#65d8ff;background:rgba(30,174,255,.12);box-shadow:0 0 8px #fff,0 0 34px rgba(42,185,255,.8),inset 0 0 26px rgba(42,185,255,.22)}.baseball-target.pitch-strike span{border-radius:18%;inset:28%}.baseball-strike-grid{position:absolute;inset:0;background:linear-gradient(90deg,transparent 32%,rgba(255,255,255,.24) 33% 34%,transparent 35% 65%,rgba(255,255,255,.24) 66% 67%,transparent 68%),linear-gradient(0deg,transparent 32%,rgba(255,255,255,.24) 33% 34%,transparent 35% 65%,rgba(255,255,255,.24) 66% 67%,transparent 68%)}
.baseball-target.horizontal{animation:baseball-sweep 4.8s linear infinite alternate}.baseball-target.ellipse{animation:baseball-ellipse 6s linear infinite}.baseball-target.strike{animation:baseball-strike-move 4.2s ease-in-out infinite alternate}
@keyframes baseball-sweep{from{left:22%}to{left:78%}}@keyframes baseball-ellipse{0%{left:24%;top:48%}25%{left:50%;top:38%}50%{left:76%;top:48%}75%{left:50%;top:62%}100%{left:24%;top:48%}}@keyframes baseball-strike-move{0%{left:41%;top:39%}33%{left:57%;top:44%}66%{left:44%;top:58%}100%{left:59%;top:54%}}
.baseball-teammate{position:absolute;z-index:2;width:6%;height:17%;transform:translate(-50%,-42%);filter:drop-shadow(0 0 14px rgba(101,216,255,.8))}.baseball-teammate:before{content:'';position:absolute;left:34%;top:0;width:32%;aspect-ratio:1;border-radius:50%;background:#dca57e;border:2px solid #f6fbff}.baseball-teammate:after{content:'';position:absolute;left:20%;right:20%;top:26%;bottom:0;border:3px solid #79ddff;border-radius:40% 40% 18% 18%;background:linear-gradient(90deg,#113d68,#248cc1 50%,#113d68)}.baseball-teammate em{position:absolute;z-index:2;right:3%;top:39%;width:28%;aspect-ratio:1;border:3px solid #ffd07a;border-radius:50%;background:#7a481d}
.baseball-teammate.horizontal{animation:baseball-sweep 4.8s linear infinite alternate}
.baseball-zones{position:absolute;inset:0;z-index:3}.baseball-base-zone{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;border:clamp(3px,.28cqw,6px) solid var(--base-color);border-radius:50%;background:color-mix(in srgb,var(--base-color) 19%,transparent);box-shadow:0 0 24px color-mix(in srgb,var(--base-color) 70%,transparent),inset 0 0 20px color-mix(in srgb,var(--base-color) 22%,transparent)}
.baseball-base-zone span{font:900 clamp(13px,1.3cqw,24px) 'Barlow Condensed';color:#fff;text-shadow:0 2px 9px #000}.baseball-base-zone b{position:absolute;right:7%;bottom:6%;font:900 clamp(9px,.75cqw,14px) Inter;color:#fff}.baseball-base-zone.base-1{--base-color:#76f79a}.baseball-base-zone.base-2{--base-color:#65d8ff}.baseball-base-zone.base-3{--base-color:#ffca62}.baseball-base-zone.base-4{--base-color:#ff755c}
.baseball-fielder{position:absolute;left:18%;top:var(--fielder-y);width:4.2%;height:10%;transform:translate(-50%,-50%);animation:baseball-fielder var(--fielder-speed) linear infinite alternate;filter:drop-shadow(0 0 10px rgba(255,72,55,.8))}.baseball-fielder i{position:absolute;left:31%;top:0;width:38%;aspect-ratio:1;border-radius:50%;background:#ffae83;border:2px solid #fff}.baseball-fielder span{position:absolute;left:12%;right:12%;top:29%;bottom:0;border:3px solid #ff826d;border-radius:48% 48% 20% 20%;background:linear-gradient(90deg,#8f201f,#ef4f3d 50%,#8f201f)}.baseball-fielder.fielder-2{animation-direction:alternate-reverse}.baseball-fielder.fielder-3{animation-duration:3.9s}
@keyframes baseball-fielder{from{left:18%}to{left:82%}}
.baseball-flight-arc{position:absolute;z-index:6;left:50%;top:87%;width:1.2cqw;aspect-ratio:1;border-radius:50%;background:#fff;border:2px solid #d84938;box-shadow:0 0 14px #fff;animation:baseball-flight .8s ease-out forwards;pointer-events:none}
@keyframes baseball-flight{0%{left:50%;top:87%;transform:scale(1.4);opacity:1}100%{left:var(--impact-x);top:var(--impact-y);transform:scale(.35);opacity:0}}
.baseball-result-defi{border-color:rgba(255,166,91,.55)!important;background:rgba(38,17,6,.76)!important}

.ball-launcher-port{position:absolute;z-index:3;width:5.2%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 50% 48%,#000 0 38%,#111 39% 48%,#66727a 49% 55%,#20272b 56% 68%,transparent 69%);filter:drop-shadow(0 5px 7px rgba(0,0,0,.72));pointer-events:none}.ball-launcher-port:before{content:'';position:absolute;left:16%;right:16%;bottom:-18%;height:34%;border-radius:4px;background:linear-gradient(90deg,#20282d,#6b767c 48%,#222a2f);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}.ball-launcher-port i{position:absolute;inset:21%;border-radius:50%;box-shadow:inset 0 4px 7px rgba(255,255,255,.12),inset 0 -4px 8px #000}.ball-launcher-port.sport-tennis{width:4.5%;opacity:.96}

/* Baseball : les formes suivent les gestes reels. Le relayeur se deplace avec
   son gant ouvert ; le batteur lit cinq zones fixes qui couvrent le terrain. */
.baseball-target>span{left:50%;top:50%;inset:auto;width:30%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%}
.baseball-target.zone-rect{border-radius:12px;background:rgba(43,190,255,.14)}
.baseball-target.zone-rect>span{width:28%}
.baseball-target.pitch-strike>span{inset:auto;left:50%;top:50%;right:auto;bottom:auto;width:24%;height:auto;aspect-ratio:1;transform:translate(-50%,-50%)}
.baseball-relay-unit{position:absolute;z-index:3;left:50%;top:51%;width:15%;height:45%;transform:translate(-50%,-50%);pointer-events:none;animation-duration:var(--move-duration);animation-delay:var(--move-delay);animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate}
.baseball-relay-unit>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 12px rgba(0,0,0,.68))}
.baseball-relay-unit .baseball-target{position:absolute}
.baseball-relay-unit.path-horizontal{animation-name:relay-horizontal}.baseball-relay-unit.path-vertical{animation-name:relay-vertical}.baseball-relay-unit.path-diagonal{animation-name:relay-diagonal}.baseball-relay-unit.path-ellipse{animation-name:relay-ellipse;animation-direction:normal}
@keyframes relay-horizontal{from{left:18%;top:52%}to{left:82%;top:52%}}@keyframes relay-vertical{from{left:50%;top:39%;transform:translate(-50%,-50%) scale(.77)}to{left:50%;top:63%;transform:translate(-50%,-50%) scale(1.12)}}@keyframes relay-diagonal{from{left:20%;top:61%;transform:translate(-50%,-50%) scale(1.06)}to{left:80%;top:40%;transform:translate(-50%,-50%) scale(.8)}}@keyframes relay-ellipse{0%{left:18%;top:52%}25%{left:50%;top:37%}50%{left:82%;top:52%}75%{left:50%;top:64%}100%{left:18%;top:52%}}
.baseball-target.mobile{animation-duration:var(--move-duration);animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:alternate}.baseball-target.mobile.path-horizontal{animation-name:target-horizontal}.baseball-target.mobile.path-vertical{animation-name:target-vertical}.baseball-target.mobile.path-diagonal{animation-name:target-diagonal}.baseball-target.mobile.path-ellipse{animation-name:target-ellipse;animation-direction:normal}
@keyframes target-horizontal{from{left:35%}to{left:65%}}@keyframes target-vertical{from{top:34%}to{top:66%}}@keyframes target-diagonal{from{left:35%;top:64%}to{left:65%;top:34%}}@keyframes target-ellipse{0%{left:35%;top:50%}25%{left:50%;top:34%}50%{left:65%;top:50%}75%{left:50%;top:66%}100%{left:35%;top:50%}}
.baseball-target.memoire{animation:baseball-memory var(--memory-duration,4.4s) linear infinite}@keyframes baseball-memory{0%,34%{opacity:1}40%,92%{opacity:.06}100%{opacity:1}}
.baseball-batting-zones{position:absolute;z-index:3;inset:0;overflow:hidden;pointer-events:none}.baseball-batting-zones .hit-zone{position:absolute;box-sizing:border-box;display:grid;place-items:center;background:transparent;border:1px solid rgba(218,242,255,.16);box-shadow:none}.baseball-batting-zones .hit-zone strong{padding:.08em .32em;border-radius:5px;background:rgba(2,13,24,.16);color:#fff;font:900 clamp(24px,3cqw,56px) 'Barlow Condensed';text-shadow:0 3px 12px #000;opacity:.92}.baseball-batting-zones .home-run{background:transparent;border-color:rgba(128,220,255,.2)}.baseball-batting-zones .home-run strong{display:block;color:#9fe5ff;font-size:clamp(30px,3.8cqw,70px)}.baseball-batting-zones .launcher-zero{background:transparent;border-color:rgba(255,180,164,.18)}.baseball-batting-zones .launcher-zero strong{color:#ffb0a2}
.baseball-pitcher-machine{position:absolute;z-index:4;inset:0;pointer-events:none}.pitcher-sprite{position:absolute;z-index:4;left:42%;top:17%;width:16%;height:70%;background:url('./assets/baseball-pitcher-sprite.png') 0 0/600% 100% no-repeat;filter:drop-shadow(0 8px 11px rgba(0,0,0,.72))}.baseball-pitcher-machine.winding-up .pitcher-sprite{animation:baseball-pitcher-sprite 1.65s steps(1,end) both}.baseball-pitcher-machine.ball-ready .pitcher-sprite{background-position:80% 0}.baseball-pitcher-machine.repositioning .pitcher-sprite{background-position:0 0}@keyframes baseball-pitcher-sprite{0%,20%{background-position:0 0}20.01%,45%{background-position:20% 0}45.01%,70%{background-position:40% 0}70.01%,100%{background-position:80% 0}}
.baseball-pitcher-machine .ball-launcher-port{position:absolute;left:48.6%;top:36.2%;width:2.4%;z-index:5;opacity:0}.baseball-pitcher-machine.winding-up .ball-launcher-port{animation:baseball-port-release 1.65s steps(1,end) both}.baseball-pitcher-machine.ball-ready .ball-launcher-port{opacity:1}@keyframes baseball-port-release{0%,70%{opacity:0}70.01%,100%{opacity:1}}
.baseball-home-run-celebration{position:absolute;z-index:12;left:0;top:46%;width:100%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;border:0;background:none;box-shadow:none;text-align:center;animation:home-run-wow 1.2s cubic-bezier(.16,1.15,.35,1) both;pointer-events:none}.baseball-home-run-celebration:before,.baseball-home-run-celebration:after{content:'✦';position:absolute;color:#b9edff;font-size:clamp(28px,4cqw,72px);text-shadow:0 0 25px #56cfff;animation:home-run-star 1.1s ease-out both}.baseball-home-run-celebration:before{left:24%;top:-18%}.baseball-home-run-celebration:after{right:24%;bottom:-18%}.baseball-home-run-celebration strong{display:block;width:100%;white-space:nowrap;color:#fff;font:900 clamp(52px,7cqw,126px)/.9 'Barlow Condensed';letter-spacing:.05em;text-align:center;text-shadow:0 5px 18px #001b32,0 0 32px #32baff,0 0 64px #158fd0}.baseball-home-run-celebration span{display:block;margin-top:.16em;color:#9fe5ff;font:900 clamp(26px,3.4cqw,60px) 'Barlow Condensed';text-align:center;text-shadow:0 3px 14px #001b32,0 0 22px #36c4ff}@keyframes home-run-wow{0%{opacity:0;transform:translateY(-50%) scale(.42)}55%{opacity:1;transform:translateY(-50%) scale(1.08)}100%{opacity:1;transform:translateY(-50%) scale(1)}}@keyframes home-run-star{0%{opacity:0;transform:scale(.2) rotate(0)}55%{opacity:1}100%{opacity:.5;transform:scale(1.25) rotate(120deg)}}


/* Catalogue dynamique : les panneaux viennent exactement des sports autorisés
   dans la salle. Chaque panneau et chaque carte prend 1/N de la largeur. */
.shell.world-catalog{background:#06111e;background-image:none}
.shell.world-catalog:after{display:none}
.catalog-panorama{position:absolute;z-index:0;inset:0;display:grid;grid-template-columns:repeat(var(--sport-count),minmax(0,1fr));gap:0;overflow:hidden;background:#06111e;pointer-events:none}
.catalog-panorama:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(1,6,14,.58),rgba(2,11,22,.16) 52%,rgba(1,7,17,.36)),linear-gradient(90deg,rgba(2,10,19,.25),transparent 18% 82%,rgba(2,10,19,.25))}
.catalog-panel{position:relative;display:block;min-width:0;background-position:center;background-size:cover;background-repeat:no-repeat}
.catalog-panel+.catalog-panel{box-shadow:-8px 0 28px rgba(3,13,24,.28)}
.catalog-panel.sport-football{background-image:url('./assets/football-stadium.jpg')}
.catalog-panel.sport-tennis{background-image:url('./assets/padel-court.jpg')}
.catalog-panel.sport-baseball{background-image:url('./assets/baseball-scene.jpg')}
.catalog-panel.sport-basket{background-image:url('./assets/basket-scene-near.jpg')}
.catalog-active-grid{width:100cqw;grid-template-columns:repeat(var(--sport-count),minmax(0,1fr));grid-auto-rows:1fr;gap:0}
.catalog-active-grid .sport-card{justify-self:center;width:90%;height:100%;min-width:0;background-position:center;background-size:cover}
.catalog-active-grid .sport-baseball{background-image:linear-gradient(180deg,rgba(33,10,4,.05),rgba(36,13,5,.1) 48%,rgba(15,7,3,.68)),url('./assets/baseball-scene.jpg')}

/* Impact sur le cadre : la balle garde sa taille et repart du poteau ou de la
   transversale au lieu de produire l'effet de profondeur du filet. */
.penalty-ball.result-poteau-gauche,.penalty-ball.result-poteau-droit,.penalty-ball.result-transversale{z-index:6;animation:football-post-rebound .9s cubic-bezier(.2,.72,.28,1) both;--rebond-x:0%;--rebond-y:0%;filter:drop-shadow(0 .42cqw .5cqw rgba(0,0,0,.82))}
.penalty-ball.result-poteau-gauche{--rebond-x:85%;--rebond-y:-8%}.penalty-ball.result-poteau-droit{--rebond-x:-85%;--rebond-y:-8%}.penalty-ball.result-transversale{--rebond-x:12%;--rebond-y:80%}
.penalty-ball.result-poteau-gauche:after,.penalty-ball.result-poteau-droit:after,.penalty-ball.result-transversale:after{border-color:#eaf8ff;animation:football-post-flash .5s ease-out both}
@keyframes football-post-rebound{0%{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}30%{transform:translate(-50%,-50%) scale(1.04) rotate(-18deg);opacity:1}100%{transform:translate(calc(-50% + var(--rebond-x)),calc(-50% + var(--rebond-y))) scale(1) rotate(145deg);opacity:.96}}
@keyframes football-post-flash{0%{opacity:1;transform:translate(-50%,-50%) scale(.65)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.9)}}
.penalty-outcome.result-poteau-gauche strong,.penalty-outcome.result-poteau-droit strong,.penalty-outcome.result-transversale strong{border-color:#dff7ff;background:rgba(8,48,70,.94);box-shadow:0 0 40px rgba(112,215,255,.7)}
.access-blocking-error{width:min(1060px,92%);margin:10px auto 24px;padding:18px 24px;border:2px solid #ff795f;border-radius:16px;background:linear-gradient(135deg,rgba(109,24,21,.96),rgba(57,17,25,.96));box-shadow:0 0 32px rgba(255,80,55,.3);text-align:center;color:#fff}
.access-blocking-error strong{display:block;font:900 clamp(24px,2.1cqw,36px) 'Barlow Condensed';letter-spacing:.06em;color:#ffb09c}.access-blocking-error p{margin:7px 0 0;font:800 clamp(18px,1.45cqw,26px) 'Barlow Condensed';line-height:1.25}

/* Photos de profil et caméra — inscription sur le mur. */
.avatar-upload-copy{display:flex;min-width:0;flex:1;flex-direction:column;gap:.35cqh}
.avatar-photo-actions{display:flex;gap:.45cqw;flex-wrap:wrap;margin-top:.35cqh}
.avatar-photo-actions label,.avatar-photo-actions button{min-height:32px;padding:.35em .7em;border:1px solid #4e91b9;border-radius:7px;background:#103651;color:#eaf8ff;font:800 clamp(9px,.66cqw,12px) Inter,sans-serif;cursor:pointer}
.avatar-photo-actions button{border-color:#64c88a;background:#143f35}
.camera-overlay{position:fixed;z-index:120;inset:0;display:grid;place-items:center;padding:2cqw;background:rgba(1,8,16,.9);backdrop-filter:blur(10px)}
.camera-dialog{width:min(720px,92vw);overflow:hidden;border:1px solid #4e93bd;border-radius:18px;background:#081f32;box-shadow:0 30px 100px rgba(0,0,0,.65)}
.camera-dialog header,.camera-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 20px}.camera-dialog header h2{margin:0;font:900 28px 'Barlow Condensed',sans-serif}.camera-dialog header button{border:0;background:transparent;color:#cceaff;font-size:28px}.camera-dialog footer{justify-content:flex-end}
.camera-frame{position:relative;aspect-ratio:4/3;margin:0 20px;overflow:hidden;border-radius:14px;background:#020a10}.camera-frame:after{content:'';position:absolute;inset:10%;border:2px solid rgba(157,255,143,.8);border-radius:50%;pointer-events:none}.camera-frame video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}

/* Les cartes d'accueil montrent le visage et le nom, sans référence technique. */
.compact-checkin .slot.filled{height:clamp(108px,13cqh,138px);justify-content:center;gap:.55cqh}
.compact-checkin .slot.filled .avatar{margin-top:0;width:clamp(50px,4.2cqw,72px);height:clamp(50px,4.2cqw,72px)}
.compact-checkin .slot.filled strong{font-size:clamp(17px,1.35cqw,24px);max-width:92%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.session-player-list .slot.filled{height:clamp(108px,13cqh,138px)}

/* Fin de session depuis l'écran de salle : confirmations intégrées au jeu. */
.battle-dialog-overlay{position:fixed;z-index:140;inset:0;display:grid;place-items:center;padding:2cqw;background:rgba(1,8,16,.9);backdrop-filter:blur(10px)}
.battle-dialog{width:min(600px,90vw);padding:clamp(24px,3cqw,46px);border:1px solid #4f96c3;border-radius:20px;background:linear-gradient(145deg,#0b2a42,#061725);box-shadow:0 30px 100px rgba(0,0,0,.65);text-align:center}.battle-dialog h2{margin:0;font:900 clamp(30px,3cqw,50px) 'Barlow Condensed',sans-serif}.battle-dialog p{margin:20px 0;color:#bdd8e9;font:600 clamp(14px,1.15cqw,19px)/1.5 Inter,sans-serif}.battle-dialog footer{display:flex;justify-content:center;gap:14px}.btn.danger{background:linear-gradient(145deg,#a72e2e,#651a22);border-color:#ff847c;color:#fff}.settings-footer,.detail-actions{justify-content:center;flex-wrap:wrap}

/* Les profils de la session reprennent le format généreux de la sélection
   après saisie du téléphone, sans le libellé « sélectionner ». Jusqu’à cinq
   portraits tiennent sur une ligne ; dix joueurs occupent environ deux lignes. */
.compact-checkin .session-player-list{width:min(76cqw,1216px);max-height:49cqh}
.compact-checkin .session-player-cards{gap:1.1cqh .8cqw}
.compact-checkin .session-player-list .slot.filled{flex:0 0 14cqw;width:14cqw;height:clamp(170px,20cqh,220px);padding:1.2cqh .7cqw;gap:.8cqh}
.compact-checkin .session-player-list .slot.filled .avatar{width:clamp(78px,7cqw,126px);height:clamp(78px,7cqw,126px);font-size:clamp(28px,2.8cqw,50px);margin-top:.4cqh}
.compact-checkin .session-player-list .slot.filled strong{font-size:clamp(20px,1.7cqw,31px)}
.compact-checkin .session-player-list .add-player-slot{width:min(18cqw,290px);height:clamp(72px,8.5cqh,94px);margin-top:1.8cqh}
.session-player-list:has(.session-player-cards>.slot:nth-child(6)){width:min(76cqw,1216px);max-height:49cqh}
.session-player-list:has(.session-player-cards>.slot:nth-child(6)) .session-player-cards{gap:1.1cqh .8cqw}
.session-player-list:has(.session-player-cards>.slot:nth-child(6)) .slot{flex:0 0 14cqw;width:14cqw}
.settings-detail .session-player-list{width:min(72cqw,1150px);max-height:43cqh}
.settings-detail .session-player-list .slot.filled{height:clamp(112px,14cqh,145px);justify-content:center;gap:.5cqh}
.settings-detail .session-player-list .slot.filled .avatar{margin-top:0;width:clamp(52px,4.2cqw,72px);height:clamp(52px,4.2cqw,72px)}
.settings-detail .session-player-list .slot.filled strong{font-size:clamp(17px,1.3cqw,23px);max-width:92%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Arcade — un univers autonome, sans terrain ni cage de sport. */
.catalog-panel.sport-arcade{background-image:url('./assets/arcade-world-cover.jpg')}.catalog-active-grid .sport-arcade{background-image:linear-gradient(180deg,transparent 35%,rgba(0,8,20,.78)),url('./assets/arcade-world-cover.jpg');border-color:#41d9ff}.sport-arcade .sport-art{font-size:clamp(55px,6cqw,108px);color:#75e9ff;text-shadow:0 0 12px #22c9ff,0 0 35px #087eff}.mode-photo.sport-arcade{background-image:url('./assets/arcade-arena.jpg')}
.arcade-library{inset:11% 4% 8%;align-items:center}.arcade-library .page-title{margin-bottom:1.4cqh}.arcade-game-grid{width:min(92cqw,1570px);display:grid;grid-template-columns:repeat(5,1fr);gap:.85cqw;overflow:auto;padding:.4cqw}.arcade-game-card{min-height:25cqh;padding:0;overflow:hidden;display:flex;flex-direction:column;align-items:stretch;border:1px solid rgba(91,214,255,.55);border-radius:14px;background:linear-gradient(150deg,rgba(7,39,67,.96),rgba(2,12,27,.98));color:#fff;text-align:left;box-shadow:0 12px 30px rgba(0,0,0,.28);transition:.2s}.arcade-game-card:hover{transform:translateY(-4px);border-color:#b4f5ff;box-shadow:0 0 30px rgba(34,202,255,.27)}.arcade-game-card.unavailable{opacity:.42}.arcade-card-preview{height:12cqh;padding:1.2cqh 1cqw;background:radial-gradient(circle at 50% 50%,rgba(24,147,214,.2),transparent 65%),#020d1c}.arcade-game-card>strong{padding:1cqh 1cqw 0;font:900 clamp(17px,1.45cqw,27px) 'Barlow Condensed';letter-spacing:.03em}.arcade-game-card>p{flex:1;margin:.45cqh 1cqw;color:#a8cce0;font-size:clamp(9px,.72cqw,14px);line-height:1.35}.arcade-game-card>span{padding:.75cqh 1cqw;border-top:1px solid rgba(77,185,225,.22);color:#7ee9ff;font:800 clamp(10px,.78cqw,15px) 'Barlow Condensed';letter-spacing:.1em}.arcade-mini-grid{height:100%;display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:1fr;gap:4px}.arcade-mini-grid.three{grid-template-columns:repeat(3,1fr)}.arcade-mini-grid.connect{grid-template-columns:repeat(7,1fr)}.arcade-mini-grid i{display:grid;place-items:center;border:1px solid rgba(89,211,255,.52);background:rgba(6,57,91,.72);color:#c7f5ff;font:900 clamp(8px,.8cqw,15px) 'Barlow Condensed';font-style:normal;box-shadow:inset 0 0 10px rgba(54,196,255,.1)}.arcade-mini-grid i.blue{background:#1187cc}.arcade-mini-grid i.orange{background:#f36d44}.arcade-mini-grid i.green{background:#49b96b}.arcade-mini-grid i.power{color:#ffe271;background:#704b11;box-shadow:0 0 12px #ffd653}
.arcade-setup{position:absolute;inset:12% 7% 9%;display:grid;grid-template-columns:1.15fr .85fr;gap:3cqw;align-items:center}.arcade-setup-preview{position:relative;overflow:hidden;border:1px solid #59d9ff;border-radius:18px;box-shadow:0 0 45px rgba(40,189,255,.22)}.arcade-setup-preview>img{display:block;width:100%;aspect-ratio:1.6;object-fit:cover}.arcade-setup-preview>div{position:absolute;left:12.2%;top:16.5%;width:75.6%;height:56.5%;padding:2%;background:rgba(1,11,27,.2)}.arcade-setup-copy{display:flex;flex-direction:column;align-items:flex-start}.arcade-setup-copy h1{margin:.15em 0;font:900 clamp(39px,4cqw,76px)/.95 'Barlow Condensed';text-transform:uppercase}.arcade-setup-copy>p{color:#b8d2e3;font-size:clamp(13px,1cqw,19px);line-height:1.45}.arcade-rule{width:100%;margin:1.8cqh 0;padding:1.3cqh 1cqw;border-left:4px solid #64dcff;background:rgba(5,39,65,.78)}.arcade-rule b,.arcade-rule span{display:block}.arcade-rule b{color:#74e5ff;font-size:.75em;letter-spacing:.15em}.arcade-setup-copy h2{margin:1cqh 0;font:800 clamp(17px,1.4cqw,26px) 'Barlow Condensed'}.arcade-ball-picker{display:flex;gap:.7cqw}.arcade-ball-picker button{min-width:8cqw;padding:1cqh .7cqw;border:1px solid #3d789f;border-radius:10px;background:#061b30;color:#fff}.arcade-ball-picker button.active{border-color:#8df5ff;background:#0a4668;box-shadow:0 0 18px rgba(79,220,255,.32)}.arcade-ball-picker i{display:block;font-size:clamp(23px,2.4cqw,44px);font-style:normal}.arcade-ball-picker .ball-tennis{color:#d7ff4e;text-shadow:0 0 9px #b9ef27}.arcade-ball-picker span{display:block;margin-top:.3cqh;font:800 clamp(11px,.9cqw,17px) 'Barlow Condensed'}.arcade-setup-copy>small{margin-top:1cqh;color:#83a9c2}.arcade-setup-actions{margin-top:2.2cqh}
.scene-arcade{background:#020b18}.scene-arcade>.scene-image{position:absolute;left:-12%;top:-17%;width:124%;height:152%;object-fit:fill}.arcade-grid{position:absolute;z-index:3;left:4%;top:9.3%;width:92%;height:85%;display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);gap:clamp(2px,.22cqw,4px);padding:0;background:radial-gradient(ellipse at 50% 38%,rgba(31,112,156,.58),rgba(7,31,53,.72))}.arcade-cell{--edge:#58ddff;position:relative;display:grid;place-items:center;overflow:hidden;pointer-events:none;border-radius:10px;border:2px solid color-mix(in srgb,var(--edge) 92%,white);background:linear-gradient(180deg,color-mix(in srgb,var(--edge) 26%,rgba(15,34,48,.55)),color-mix(in srgb,var(--edge) 10%,rgba(3,12,24,.72)));box-shadow:0 0 22px color-mix(in srgb,var(--edge) 50%,transparent),inset 0 0 26px color-mix(in srgb,var(--edge) 45%,transparent);color:#fff;font:900 clamp(20px,2.8cqw,54px) 'Barlow Condensed';font-style:normal;letter-spacing:.035em;text-shadow:0 0 5px #fff,0 0 16px var(--edge);transition:opacity .18s,transform .18s,filter .18s}.arcade-cell[style*="--owner"]{--edge:var(--owner);background:linear-gradient(180deg,color-mix(in srgb,var(--owner) 88%,white),color-mix(in srgb,var(--owner) 72%,#07111e));border-color:color-mix(in srgb,var(--owner) 82%,white);box-shadow:0 0 24px color-mix(in srgb,var(--owner) 68%,transparent),inset 0 0 24px color-mix(in srgb,var(--owner) 58%,transparent),inset 0 1px 0 rgba(255,255,255,.38)}.arcade-cell.cleared{opacity:0;transform:scale(.72);filter:brightness(2)}.arcade-cell b{position:absolute;right:6%;top:4%;color:#ffe66c;font-size:.55em}.game-connect-four .arcade-cell{font-size:clamp(20px,3cqw,58px)}.game-tic-tac-toe .arcade-cell,.game-tic-tac-toe-flip .arcade-cell{font-size:clamp(45px,7cqw,130px)}
.arcade-topbar{position:absolute;z-index:10;left:0;right:0;top:0;height:8cqh;display:flex;align-items:stretch;background:linear-gradient(180deg,rgba(0,9,22,.98),rgba(1,16,33,.9));border-bottom:1px solid rgba(79,220,255,.42)}.arcade-topbar>button{width:4.2cqw;border:0;border-right:1px solid rgba(92,197,235,.22);background:rgba(7,38,63,.82);color:#bdefff;font-size:clamp(18px,1.7cqw,31px)}.arcade-topbar>button+button{margin-left:.35cqw}.arcade-topbar>div{display:flex;flex-direction:column;justify-content:center;padding:0 1.1cqw}.arcade-topbar small{color:#8abbd5;font:700 clamp(8px,.7cqw,13px) 'Barlow Condensed';letter-spacing:.12em}.arcade-topbar strong{font:900 clamp(15px,1.4cqw,27px) 'Barlow Condensed'}.arcade-competitors{flex:1;flex-direction:row!important;justify-content:center!important;gap:.45cqw}.arcade-competitors span{min-width:6.3cqw;padding:.45cqh .65cqw;border:1px solid color-mix(in srgb,var(--actor) 65%,#20364b);border-radius:7px;background:rgba(1,13,27,.7);text-align:center}.arcade-competitors span.active{background:color-mix(in srgb,var(--actor) 25%,#061426);box-shadow:0 0 16px color-mix(in srgb,var(--actor) 35%,transparent)}.arcade-competitors b,.arcade-competitors i{display:block}.arcade-competitors b{font:700 clamp(9px,.72cqw,14px) 'Barlow Condensed';white-space:nowrap}.arcade-competitors i{color:var(--actor);font:900 clamp(13px,1.2cqw,23px) 'Barlow Condensed';font-style:normal}.arcade-turn{min-width:12cqw;text-align:center}.arcade-turn em{position:absolute;right:.5cqw;bottom:.4cqh;font-size:1.3cqw}.arcade-topbar .arcade-stop{width:auto;padding:0 1.3cqw;background:#8a6014;color:#fff;font:900 clamp(12px,1cqw,19px) 'Barlow Condensed'}.arcade-impact{position:absolute;z-index:8;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;pointer-events:none;animation:arcade-impact .8s ease-out both}.arcade-impact span{font-size:clamp(35px,4.5cqw,85px);filter:drop-shadow(0 0 14px #fff)}.arcade-impact strong{margin-top:.3cqh;padding:.35em .65em;border-radius:6px;background:rgba(2,11,23,.88);color:#fff;font:900 clamp(17px,1.6cqw,31px) 'Barlow Condensed';white-space:nowrap}.arcade-impact.hit strong{color:#9affae}.arcade-impact.miss strong{color:#ff9e8d}@keyframes arcade-impact{0%{opacity:0;transform:translate(-50%,-50%) scale(1.8)}25%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.arcade-results{inset:12% 14% 9%;align-items:center}.arcade-result-title{display:flex;align-items:center;gap:1cqw;margin:1cqh 0 2cqh;padding:1cqh 1.5cqw;border:1px solid #46cbed;border-radius:10px;background:rgba(5,35,59,.8)}.arcade-result-title>span{font-size:2cqw;color:#6de9ff}.arcade-result-title strong{font:900 clamp(20px,2cqw,37px) 'Barlow Condensed'}.arcade-result-title small{color:#a9cde0}.arcade-result-reason{margin:-.4cqh 0 1cqh;color:#d9f7ff;font:800 clamp(15px,1.2cqw,23px) 'Barlow Condensed';text-align:center}.arcade-result-board{width:min(34cqw,560px);height:21cqh;display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);gap:3px;margin:-.8cqh auto 1.1cqh;padding:5px;border:1px solid rgba(89,217,255,.62);border-radius:10px;background:rgba(4,29,49,.88);box-shadow:0 0 28px rgba(42,198,255,.2)}.arcade-result-board i{display:grid;place-items:center;border:1px solid rgba(89,211,255,.35);border-radius:5px;background:rgba(13,60,86,.68);color:#fff;font:900 clamp(17px,2.2cqw,40px) 'Barlow Condensed';font-style:normal}.arcade-result-board i[style*="--owner"]{background:linear-gradient(180deg,color-mix(in srgb,var(--owner) 88%,white),color-mix(in srgb,var(--owner) 72%,#07111e));border-color:color-mix(in srgb,var(--owner) 82%,white)}.arcade-result-board i.winning{z-index:1;border-color:#fff;filter:brightness(1.35);box-shadow:0 0 9px #fff,0 0 28px var(--owner),inset 0 0 18px rgba(255,255,255,.55);animation:winning-line 1s ease-in-out infinite alternate}@keyframes winning-line{to{transform:scale(.91);filter:brightness(1.75)}}
.arcade-ranking{width:min(63cqw,1050px);display:flex;flex-direction:column;gap:.7cqh}.arcade-ranking article{display:grid;grid-template-columns:3cqw 3cqw 1fr auto;align-items:center;min-height:6cqh;padding:.7cqh 1cqw;border:1px solid color-mix(in srgb,var(--actor) 65%,#3c5b70);border-radius:9px;background:linear-gradient(90deg,color-mix(in srgb,var(--actor) 20%,#061426),rgba(3,17,32,.94))}.arcade-ranking article.winner{min-height:8cqh;box-shadow:0 0 25px color-mix(in srgb,var(--actor) 35%,transparent)}.arcade-ranking article>b{font:900 1.5cqw 'Barlow Condensed';color:var(--actor)}.arcade-ranking article>span{color:var(--actor);font-size:1.5cqw}.arcade-ranking article>strong{font:900 clamp(17px,1.5cqw,29px) 'Barlow Condensed'}.arcade-ranking article>em{color:#d6eef9;font:800 clamp(14px,1.2cqw,23px) 'Barlow Condensed';font-style:normal}
/* Arcade aventure : course et combat de monstre. */
.arcade-preview-horse,.arcade-preview-monster{position:relative;height:100%;overflow:hidden;background:radial-gradient(circle,#174a68,#020916)}.arcade-preview-horse img{position:absolute;left:38%;top:5%;height:92%;filter:drop-shadow(0 0 12px #39d9ff)}.arcade-preview-horse i{position:absolute;left:15%;right:15%;height:2px;background:#60e8ff;box-shadow:0 0 8px #60e8ff}.arcade-preview-horse i:nth-of-type(1){top:20%}.arcade-preview-horse i:nth-of-type(2){top:40%}.arcade-preview-horse i:nth-of-type(3){top:60%}.arcade-preview-horse i:nth-of-type(4){top:80%}.arcade-preview-monster img{position:absolute;left:35%;top:0;height:100%;filter:drop-shadow(0 0 16px #715cff)}.arcade-preview-monster i{position:absolute;width:12%;aspect-ratio:1;border:2px solid #7cfdff;border-radius:50%;box-shadow:0 0 14px #36d8ff}.arcade-preview-monster i:nth-of-type(1){left:42%;top:72%}.arcade-preview-monster i:nth-of-type(2){left:29%;top:42%}.arcade-preview-monster i:nth-of-type(3){left:57%;top:42%}
.race-world,.monster-world{position:absolute;inset:8% 0 0;overflow:hidden;background:radial-gradient(ellipse at 50% 0,#214f68 0,#071523 55%,#02070e 100%)}.race-world:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 7.5%,rgba(102,229,255,.17) 7.7% 8%),linear-gradient(90deg,transparent 49.7%,rgba(111,235,255,.8) 50%,transparent 50.3%);transform:perspective(700px) rotateX(7deg)}.race-lane{position:absolute;inset:0}.race-lane strong{position:absolute;bottom:2%;left:var(--lane-x);width:var(--lane-w);transform:translateX(-50%);padding:.5cqh;border:1px solid var(--actor);border-radius:8px;background:#05111f;color:white;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.race-step{position:absolute;left:var(--lane-x);width:var(--lane-w);height:5.4%;transform:translate(-50%,-50%);border:1px solid color-mix(in srgb,var(--actor) 60%,#7beaff);border-radius:7px;background:rgba(22,91,123,.35)}.race-step.next{background:color-mix(in srgb,var(--actor) 65%,#fff);box-shadow:0 0 30px var(--actor),inset 0 0 18px white;animation:race-next .65s ease-in-out infinite alternate}@keyframes race-next{to{filter:brightness(1.5);transform:translate(-50%,-50%) scale(1.04)}}.race-horse{position:absolute;z-index:4;width:min(11%,var(--lane-w));max-height:20%;object-fit:contain;transform:translate(-50%,-55%);filter:drop-shadow(0 0 18px var(--actor));transition:left .35s,top .45s cubic-bezier(.2,.8,.2,1)}.race-finish{position:absolute;left:8%;right:8%;top:9%;padding:.6cqh;text-align:center;border-block:5px double #fff;background:repeating-conic-gradient(#fff 0 25%,#111 0 50%) 0/20px 20px;color:#fff;font:900 1.5cqw 'Barlow Condensed';text-shadow:0 2px 4px #000}
.monster-world{background:radial-gradient(circle at 50% 45%,#18376c,#080b22 55%,#02030b)}.monster-world:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(88,94,255,.1),transparent);animation:monster-pan 3.5s ease-in-out infinite alternate}@keyframes monster-pan{to{transform:translateX(5%)}}.monster-world>img.monster-pose{position:absolute;z-index:2;left:30%;top:8%;width:40%;height:86%;object-fit:contain;opacity:0;transform:scale(.97);filter:drop-shadow(0 0 28px #4658ff);transition:opacity .28s ease,transform .45s cubic-bezier(.2,.8,.2,1),filter .3s}.monster-world>img.monster-pose.active{opacity:1;transform:scale(1);animation:monster-breathe 2s ease-in-out infinite alternate}@keyframes monster-breathe{to{transform:scale(1.025)}}.monster-world.defeated>img.monster-pose.active{transform:translateY(10%) scale(.94);filter:grayscale(.6) drop-shadow(0 0 18px #4658ff)}.monster-aura{position:absolute;left:29%;top:20%;width:42%;height:62%;border-radius:50%;background:radial-gradient(circle,rgba(83,68,255,.28),transparent 68%)}.monster-target{position:absolute;z-index:5;width:10%;aspect-ratio:1;transform:translate(-50%,-50%);border:5px solid #8cffff;border-radius:50%;box-shadow:0 0 8px white,0 0 30px #32cfff,inset 0 0 28px rgba(48,214,255,.45);animation:monster-target .7s ease-in-out infinite alternate}@keyframes monster-target{to{transform:translate(-50%,-50%) scale(1.13)}}.monster-target i{position:absolute;inset:32%;border-radius:50%;background:white;box-shadow:0 0 16px #fff}.monster-stage{position:absolute;z-index:6;left:2%;bottom:3%;padding:.8cqh 1.2cqw;border-left:4px solid #62eaff;background:rgba(2,13,31,.86);color:white;font:900 1.4cqw 'Barlow Condensed';letter-spacing:.12em}
.arcade-preview-bubbles{position:relative;height:100%;overflow:hidden;background:radial-gradient(circle at 50% 40%,#165378,#020916)}.arcade-preview-bubbles i{position:absolute;left:var(--x);top:var(--y);display:grid;place-items:center;width:16%;aspect-ratio:1;border:2px solid white;border-radius:50%;background:radial-gradient(circle at 34% 28%,#fff 0 5%,var(--bubble) 18%,color-mix(in srgb,var(--bubble) 45%,transparent) 62%,transparent 66%);box-shadow:0 0 15px var(--bubble);color:white;font:900 .9cqw 'Barlow Condensed';font-style:normal}
.bubble-world{position:absolute;inset:8% 0 0;overflow:hidden;background:radial-gradient(circle at 50% 35%,rgba(24,97,139,.35),rgba(2,8,18,.55))}.arcade-bubble{position:absolute;z-index:3;display:grid;place-items:center;aspect-ratio:1;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.9);border-radius:50%;background:radial-gradient(circle at 32% 25%,#fff 0 5%,var(--owner) 17%,color-mix(in srgb,var(--owner) 55%,transparent) 55%,transparent 69%);box-shadow:0 0 12px #fff,0 0 32px var(--owner),inset -8px -10px 18px rgba(0,0,0,.22);filter:saturate(1.2);font-style:normal;color:white;text-shadow:0 2px 5px #000;will-change:left,top;animation:bubble-arrive .28s ease-out both}.arcade-bubble b{font:900 clamp(15px,1.5cqw,30px) 'Barlow Condensed'}.arcade-bubble small{position:absolute;bottom:-.4cqh;right:-.2cqw;display:grid;place-items:center;min-width:1.7cqw;height:1.7cqw;border-radius:50%;background:#061426;border:1px solid var(--owner);font:800 .8cqw 'Barlow Condensed'}
@keyframes bubble-arrive{from{opacity:0;scale:.55}to{opacity:1;scale:1}}
.arcade-turn.live{border-color:#5ae9ff;box-shadow:0 0 18px rgba(90,233,255,.2)}.arcade-turn.live strong{color:#9ff6ff}
.monster-world.multi-monsters{display:block;background:radial-gradient(circle at 50% 45%,#18376c,#080b22 58%,#02030b)}.monster-unit{position:absolute;z-index:2;left:var(--monster-x);top:9%;width:var(--monster-w);height:87%;transform:translateX(-50%);filter:drop-shadow(0 0 18px var(--actor))}.monster-unit:after{content:'';position:absolute;z-index:-1;inset:10% 2% 8%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--actor) 22%,transparent),transparent 68%)}.monster-unit>img.monster-pose{position:absolute;inset:0;width:100%;height:92%;object-fit:contain;opacity:0;transform:scale(.96);transition:opacity .25s,transform .4s}.monster-unit>img.monster-pose.active{opacity:1;transform:scale(1);animation:monster-breathe 2s ease-in-out infinite alternate}.monster-unit>strong{position:absolute;z-index:6;left:8%;right:8%;bottom:0;padding:.45cqh .3cqw;border:1px solid var(--actor);border-radius:7px;background:rgba(3,14,28,.9);color:white;text-align:center;font:900 clamp(11px,.95cqw,19px) 'Barlow Condensed';overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.monster-unit.defeated>img.active{filter:grayscale(.65);transform:translateY(8%) scale(.93)}.monster-unit .monster-target.live{width:var(--target-size);border-color:var(--target-color);box-shadow:0 0 8px white,0 0 25px var(--target-color),inset 0 0 20px color-mix(in srgb,var(--target-color) 45%,transparent)}.monster-unit .monster-target.live b{position:absolute;inset:24%;display:grid;place-items:center;border-radius:50%;background:#fff;color:#061426;font:900 clamp(11px,1cqw,20px) 'Barlow Condensed'}
.padel-cible.sequence.next{opacity:.42;filter:saturate(.65);z-index:3}.padel-cible.sequence.next .anneau{border-style:dashed;border-color:#fff;box-shadow:0 0 14px rgba(255,255,255,.5)}.padel-cible.sequence.active{z-index:5}.padel-cible.sequence.active .anneau{border-color:#a4ff81;box-shadow:0 0 24px #7cff54}.tennis-view-tennis-sequence .ball-launcher-port{display:block}

/* Jeux Arcade additionnels — surfaces tactiles plein écran */
.arcade-card-preview.type-shape,.arcade-card-preview.type-quiz,.arcade-card-preview.type-parachute,.arcade-card-preview.type-destruction,.arcade-card-preview.type-darts{background:radial-gradient(circle at 50% 40%,#12365a,#030a16 72%)}
.arcade-preview-shape{position:absolute;inset:16%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6%}.arcade-preview-shape span{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.arcade-preview-shape i{aspect-ratio:1;border:1px solid #315b78;background:#071421}.arcade-preview-shape i.on{background:#5cf7ff;box-shadow:0 0 8px #41eaff}.arcade-preview-shape b{color:#fff;font-size:1.4cqw}
.arcade-preview-quiz{position:absolute;inset:12%;display:grid;grid-template-columns:repeat(2,1fr);gap:6%}.arcade-preview-quiz>b{grid-column:1/-1;color:#62ecff;font:900 2.6cqw 'Barlow Condensed';text-align:center}.arcade-preview-quiz i{display:grid;place-items:center;border:1px solid #5ee7ff;border-radius:5px;color:white;background:#0d2d49;font-style:normal;font-weight:900}
.arcade-preview-parachute{position:absolute;inset:4%;overflow:hidden;background:linear-gradient(#12699b 0 58%,#071124 58%)}.arcade-preview-parachute .preview-city{position:absolute;inset:auto 0 0;height:42%;opacity:.75;background:linear-gradient(90deg,#061020 0 8%,transparent 8% 11%,#0c1c32 11% 22%,transparent 22% 26%,#061020 26% 42%,transparent 42% 46%,#102541 46% 58%,transparent 58% 62%,#071426 62% 79%,transparent 79% 83%,#0e2037 83%)}.arcade-preview-parachute>i{position:absolute;width:12%;height:31%;filter:drop-shadow(0 0 4px #57eaff)}.arcade-preview-parachute>i:nth-of-type(1){left:15%;top:9%}.arcade-preview-parachute>i:nth-of-type(2){left:48%;top:22%}.arcade-preview-parachute>i:nth-of-type(3){right:12%;top:7%}.arcade-preview-parachute>i b{position:absolute;left:0;top:0;width:100%;height:42%;border:2px solid #9ef7ff;border-radius:55% 55% 12% 12%;border-bottom:0}.arcade-preview-parachute>i span{position:absolute;left:42%;top:45%;width:18%;height:35%;border-radius:50% 50% 20% 20%;background:#fff;box-shadow:0 0 5px #fff}.arcade-preview-parachute section{position:absolute;bottom:3%;width:27%;height:28%;border:2px solid var(--cyan);background:rgba(2,12,27,.9);box-shadow:0 0 8px var(--cyan)}.arcade-preview-parachute section:first-of-type{left:12%}.arcade-preview-parachute section:last-of-type{right:12%;border-color:#ff4c74;box-shadow:0 0 8px #ff4c74}.arcade-preview-parachute section>b{position:absolute;inset:18% 0 auto;text-align:center;color:white;font-size:1.2cqw}.arcade-preview-parachute section em{position:relative;display:inline-block;margin:.15cqw;width:.35cqw;height:.7cqw;background:#ffd56a;border-radius:50% 50% 20% 20%}
.arcade-preview-destruction{position:absolute;inset:20% 7%;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:7%}.arcade-preview-destruction span{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.arcade-preview-destruction i{aspect-ratio:1;border:1px solid #5cf0ff;background:#0f5d80;box-shadow:0 0 7px #30cfff}.arcade-preview-destruction b{align-self:center;color:#ffdc69}
.arcade-preview-darts{position:absolute;inset:3%;display:grid;place-items:center;background:radial-gradient(circle,#13345c,#030815 72%)}.arcade-preview-darts>div{position:relative;height:96%;aspect-ratio:1;border:3px solid #78f5ff;border-radius:50%;background:repeating-conic-gradient(from -9deg,#174b70 0 9deg,#07192d 9deg 18deg);box-shadow:0 0 12px #22dbff,inset 0 0 14px #020713}.arcade-preview-darts>div:before,.arcade-preview-darts>div:after{content:'';position:absolute;border-radius:50%;inset:15%;border:3px solid #ff51d2;box-shadow:0 0 8px #ff36c7}.arcade-preview-darts>div:after{inset:27%;border-color:#ffe464;box-shadow:0 0 8px #ffd43b}.arcade-preview-darts i{position:absolute;left:50%;top:0;width:1px;height:50%;transform-origin:bottom;background:rgba(180,249,255,.75)}.arcade-preview-darts i:nth-child(1){transform:rotate(45deg)}.arcade-preview-darts i:nth-child(2){transform:rotate(90deg)}.arcade-preview-darts i:nth-child(3){transform:rotate(135deg)}.arcade-preview-darts span,.arcade-preview-darts b{position:absolute;z-index:3;left:50%;transform:translate(-50%,-50%);color:white;font:900 .7cqw 'Barlow Condensed';text-shadow:0 0 6px #43eaff}.arcade-preview-darts span:nth-of-type(1){top:6%}.arcade-preview-darts span:nth-of-type(2){top:19%}.arcade-preview-darts span:nth-of-type(3){top:31%}.arcade-preview-darts span:nth-of-type(4){top:41%}.arcade-preview-darts b{top:50%;display:grid;place-items:center;width:18%;aspect-ratio:1;border-radius:50%;background:white;color:#061326;text-shadow:none}

.shape-copy-world,.quiz-world,.destruction-world,.darts-world,.parachute-sky{position:absolute;inset:8% 0 0;overflow:hidden;background:radial-gradient(circle at 50% 42%,#153d63,#040b18 68%,#01040a)}
.shape-copy-world{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:3cqw;padding:7cqh 5cqw 3cqh}.shape-copy-world>section{display:grid;gap:1.4cqh}.shape-copy-world>section>small{text-align:center;color:#8aefff;font:900 1.25cqw 'Barlow Condensed';letter-spacing:.12em}.shape-copy-world>section>div{display:grid;grid-template-columns:repeat(6,1fr);gap:.55cqw;padding:1.1cqw;border:1px solid #2f7199;border-radius:16px;background:rgba(2,16,31,.8);box-shadow:inset 0 0 35px #020b13}.shape-copy-world i{aspect-ratio:1;border:1px solid #285573;border-radius:7px;background:linear-gradient(145deg,#0a263a,#04111f);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}.shape-copy-world i.on{border-color:#baffff;background:linear-gradient(145deg,#98ffff,#20badb);box-shadow:0 0 18px #45eaff,inset 0 0 14px white}.shape-copy-world>b{color:#7df3ff;font:900 3.3cqw 'Barlow Condensed';text-shadow:0 0 20px #35d8ff}.shape-copy-world>aside{position:absolute;left:50%;bottom:2%;transform:translateX(-50%);padding:.6cqh 1.3cqw;border-radius:20px;background:#07192a;color:#ffd976;font:800 1cqw 'Barlow Condensed'}
.arcade-big-feedback{position:absolute;z-index:20;left:50%;top:52%;transform:translate(-50%,-50%);padding:2cqh 3cqw;border:2px solid #62efff;border-radius:16px;background:rgba(2,14,28,.94);color:#fff;font:900 2.4cqw 'Barlow Condensed';box-shadow:0 0 50px #32dfff}.arcade-big-feedback.fail{border-color:#ff6b74;box-shadow:0 0 50px #ff3a55}
.quiz-world{padding:8cqh 5cqw 3cqh}.quiz-clock{position:absolute;right:3cqw;top:3cqh;width:5cqw;aspect-ratio:1;display:grid;place-items:center;border:4px solid #ffda67;border-radius:50%;color:#fff;font:900 2.2cqw 'Barlow Condensed';box-shadow:0 0 25px #ffb52b}.quiz-world h2{height:15cqh;display:grid;place-items:center;margin:0 7cqw 3cqh;color:white;text-align:center;font:900 2.7cqw 'Barlow Condensed';text-shadow:0 0 20px #3bdcff}.quiz-answers{display:grid;grid-template-columns:repeat(2,1fr);gap:2cqh 2cqw}.quiz-answers article{height:16cqh;display:flex;align-items:center;gap:1.3cqw;padding:1.2cqw;border:2px solid #3faede;border-radius:14px;background:linear-gradient(145deg,rgba(16,66,98,.88),rgba(4,22,40,.95));box-shadow:inset 0 0 24px rgba(48,207,255,.08);color:white}.quiz-answers article b{width:3.6cqw;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:#42d7ff;color:#04111f;font:900 1.8cqw 'Barlow Condensed'}.quiz-answers article strong{font:800 1.7cqw 'Barlow Condensed'}
.parachute-sky{background:linear-gradient(#0d5685 0,#18466d 43%,#17213d 72%,#050914 100%)}.parachute-sky:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 16% 18%,rgba(255,255,255,.18) 0 1%,transparent 1.4%),radial-gradient(circle at 70% 24%,rgba(255,255,255,.13) 0 1.2%,transparent 1.5%);background-size:19cqw 13cqh}.parachute-city{position:absolute;left:0;right:0;bottom:0;height:24%;background:linear-gradient(90deg,#07101d 8%,transparent 8% 10%,#0a1424 10% 19%,transparent 19% 22%,#070f1b 22% 34%,transparent 34% 36%,#0c1727 36% 48%,transparent 48% 51%,#07101d 51% 62%,transparent 62% 66%,#0a1424 66% 78%,transparent 78% 81%,#07101d 81% 95%,transparent 95%)}.parachutist{position:absolute;z-index:4;width:7%;aspect-ratio:1.2;transform:translate(-50%,-50%);filter:drop-shadow(0 0 13px var(--actor));will-change:top}.parachutist>b{position:absolute;inset:0 0 34%;border-radius:50% 50% 8% 8%;border:5px solid var(--actor);border-bottom:0;background:linear-gradient(135deg,color-mix(in srgb,var(--actor) 82%,#fff),rgba(3,14,30,.55));box-shadow:inset 0 0 15px white}.parachutist:before,.parachutist:after{content:'';position:absolute;top:48%;width:42%;height:1px;background:var(--actor)}.parachutist:before{left:12%;transform:rotate(65deg)}.parachutist:after{right:12%;transform:rotate(-65deg)}.parachutist>span{position:absolute;left:42%;bottom:0;width:16%;height:35%;border-radius:45% 45% 30% 30%;background:#fff}.parachute-base{position:absolute;z-index:5;left:var(--base-x);bottom:1%;width:min(16%,180px);transform:translateX(-50%);display:grid;place-items:center;color:white}.parachute-base>b{font-size:3.2cqw;line-height:1;color:var(--actor);text-shadow:0 0 18px var(--actor)}.parachute-base>strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:900 1cqw 'Barlow Condensed'}.parachute-base>span{color:#ffe56e;letter-spacing:.15em}.parachute-base.lost{filter:grayscale(1);opacity:.38}
.destruction-world{background:linear-gradient(#101b39 0 68%,#050814 68%)}.neon-fortress{position:absolute;left:var(--fortress-x);bottom:4%;width:var(--fortress-w,38%);height:70%;transform:translateX(-50%);border:3px solid var(--actor);border-top:0;background:linear-gradient(90deg,transparent 4%,color-mix(in srgb,var(--actor) 10%,transparent) 4% 96%,transparent 96%);box-shadow:0 0 28px color-mix(in srgb,var(--actor) 55%,transparent),inset 0 0 25px color-mix(in srgb,var(--actor) 12%,transparent)}.neon-fortress:before,.neon-fortress:after{content:'';position:absolute;bottom:100%;width:32%;height:12%;border:3px solid var(--actor);border-bottom:0}.neon-fortress:before{left:-3px}.neon-fortress:after{right:-3px}.neon-fortress strong{position:absolute;left:0;right:0;bottom:-3.4cqh;text-align:center;color:white;font:900 1cqw 'Barlow Condensed'}.neon-fortress.destroyed{opacity:.25;transform:translateX(-50%) skew(-5deg) translateY(12%)}.destruction-block{position:absolute;z-index:5;transform:translate(-50%,-50%);border:2px solid #fff;border-radius:4px;background:linear-gradient(145deg,color-mix(in srgb,var(--actor) 84%,#fff),color-mix(in srgb,var(--actor) 70%,#06101e));box-shadow:0 0 10px var(--actor),inset 0 0 6px white;transition:opacity .28s,transform .28s}.destruction-block.broken{pointer-events:none;opacity:0;transform:translate(-50%,45%) rotate(25deg) scale(.18)}
.darts-world{background:radial-gradient(circle at 50% 50%,#142f55,#030814 68%)}.future-dartboard{position:absolute;z-index:2;left:50%;top:50%;width:min(88cqh,62cqw);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:repeating-conic-gradient(from -9deg,#123f63 0 9deg,#07172b 9deg 18deg);border:6px solid #7df6ff;box-shadow:0 0 25px #2ee8ff,0 0 80px rgba(43,172,255,.55),inset 0 0 35px #020711}.future-dartboard:before,.future-dartboard:after{content:'';position:absolute;border-radius:50%;inset:14%;border:5px solid #ff4dcb;box-shadow:0 0 18px #ff36c7}.future-dartboard:after{display:none}.future-dartboard i{position:absolute;left:50%;top:0;width:2px;height:50%;transform-origin:bottom;background:rgba(160,245,255,.6)}.future-dartboard i:nth-child(1){transform:rotate(45deg)}.future-dartboard i:nth-child(2){transform:rotate(90deg)}.future-dartboard i:nth-child(3){transform:rotate(135deg)}.future-dartboard i:nth-child(4){transform:rotate(180deg)}.future-dartboard b{position:absolute;z-index:2;inset:41%;display:grid;place-items:center;border-radius:50%;background:#fff;color:#061326;font:900 1.4cqw 'Barlow Condensed';box-shadow:0 0 22px white}.dart-ring{position:absolute;inset:27%;border:4px solid #ffe464;border-radius:50%;box-shadow:0 0 16px #ffd43b;text-decoration:none}.ring-score{position:absolute;z-index:4;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:2.2cqw;height:2.2cqw;border-radius:50%;background:#041124;border:2px solid #9df9ff;color:white;font:900 1.05cqw 'Barlow Condensed';box-shadow:0 0 10px #49eaff}.score-5{top:5%}.score-10{top:19%}.score-20{top:31%}.score-25{top:40%}.darts-score-panels{position:absolute;z-index:5;inset:15% 2% 8%;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.darts-score-panels article{width:15%;padding:1.5cqh .8cqw;text-align:center;border:2px solid var(--actor);border-radius:12px;background:rgba(2,10,23,.91);box-shadow:0 0 22px color-mix(in srgb,var(--actor) 50%,transparent)}.darts-score-panels article:nth-child(n+3){align-self:flex-end}.darts-score-panels article span,.darts-score-panels article small{display:block;color:#b9d4e7;font:800 .8cqw 'Barlow Condensed';text-transform:uppercase}.darts-score-panels article strong{display:block;color:white;font:900 3.2cqw/1 'Barlow Condensed';text-shadow:0 0 16px var(--actor)}.darts-score-panels article.active{background:color-mix(in srgb,var(--actor) 15%,#020a17)}.darts-counter{position:absolute;z-index:6;left:3%;bottom:4%;padding:1cqh 1.2cqw;border-left:4px solid #5beaff;background:rgba(3,16,31,.85);color:white;font:900 1.2cqw 'Barlow Condensed'}
.arcade-victory{position:absolute;z-index:80;inset:8% 0 0;display:grid;place-content:center;justify-items:center;overflow:hidden;background:radial-gradient(circle,rgba(2,10,22,.42),rgba(1,5,12,.78));color:white;text-align:center}.arcade-victory:before,.arcade-victory:after{content:'◆  ◆  ◆  ◆  ◆  ◆';position:absolute;left:-10%;right:-10%;color:var(--winner);font-size:2.2cqw;letter-spacing:6cqw;text-shadow:0 0 15px var(--winner);animation:victory-confetti 1.4s linear infinite}.arcade-victory:before{top:-8%;animation-delay:-.4s}.arcade-victory:after{top:-18%;animation-delay:-1.1s}.arcade-victory small{position:relative;z-index:2;color:#d9f9ff;font:900 1.25cqw 'Barlow Condensed';letter-spacing:.28em}.arcade-victory strong{position:relative;z-index:2;margin:.7cqh 0;color:#fff;font:900 5cqw 'Barlow Condensed';text-shadow:0 0 16px var(--winner),0 0 50px var(--winner);animation:victory-name .55s ease-in-out infinite alternate}.arcade-victory>span{position:relative;z-index:2;color:var(--winner);font-size:4cqw;filter:drop-shadow(0 0 20px var(--winner))}.victory-rays{position:absolute;width:58cqw;aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--winner) 22%,transparent) 0 6deg,transparent 6deg 16deg);animation:victory-rays 9s linear infinite}@keyframes victory-rays{to{transform:rotate(360deg)}}@keyframes victory-name{to{transform:scale(1.07)}}@keyframes victory-confetti{to{transform:translateY(120cqh) rotate(90deg)}}
.arcade-card-preview{position:relative;overflow:hidden}
.arcade-game-grid{max-height:67cqh;align-content:start}.arcade-game-card{min-height:21cqh}.arcade-card-preview{height:9.2cqh}.arcade-game-card>strong{padding:.65cqh .85cqw 0}.arcade-game-card>p{margin:.3cqh .85cqw;font-size:clamp(8px,.66cqw,13px)}.arcade-game-card>span{padding:.5cqh .85cqw}
/* Victoire Arcade : médaillon holographique lisible, sans explosion visuelle. */
.arcade-victory{background:linear-gradient(90deg,rgba(1,6,14,.72),rgba(3,14,28,.88) 34% 66%,rgba(1,6,14,.72));backdrop-filter:blur(3px)}.arcade-victory:before,.arcade-victory:after,.victory-rays{display:none}.victory-medal{position:relative;z-index:2;width:11cqw;aspect-ratio:1;display:grid;place-items:center;margin-bottom:1.5cqh;border:3px solid color-mix(in srgb,var(--winner) 78%,#fff);border-radius:28% 28% 50% 50%;background:radial-gradient(circle at 38% 30%,#fff 0 3%,color-mix(in srgb,var(--winner) 60%,#cfffff) 4% 18%,color-mix(in srgb,var(--winner) 45%,#07162b) 50%,#031020 76%);box-shadow:0 0 18px #fff,0 0 55px var(--winner),inset 0 0 30px color-mix(in srgb,var(--winner) 50%,transparent);clip-path:polygon(18% 0,82% 0,100% 22%,100% 74%,50% 100%,0 74%,0 22%);animation:victory-medal-in .55s cubic-bezier(.2,.9,.25,1.25) both}.victory-medal:before,.victory-medal:after{content:'';position:absolute;top:-4.8cqh;width:3.1cqw;height:6cqh;background:linear-gradient(90deg,#08243e,var(--winner),#0a2743);border:1px solid color-mix(in srgb,var(--winner) 70%,#fff);z-index:-1}.victory-medal:before{left:1.3cqw;transform:skew(10deg)}.victory-medal:after{right:1.3cqw;transform:skew(-10deg)}.victory-medal i{position:absolute;inset:12%;border:1px solid rgba(255,255,255,.72);clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%)}.victory-medal b{font:900 5cqw 'Barlow Condensed';color:white;text-shadow:0 0 16px #fff}.arcade-victory strong{font-size:4.4cqw;animation:victory-name .75s ease-in-out infinite alternate}.arcade-victory>span{padding:.45cqh 1.2cqw;border:1px solid color-mix(in srgb,var(--winner) 60%,#fff);border-radius:20px;background:rgba(2,13,27,.75);color:#dffcff;font:800 1cqw 'Barlow Condensed';letter-spacing:.12em;filter:none}@keyframes victory-medal-in{from{opacity:0;transform:translateY(-12%) scale(.45) rotate(-12deg)}to{opacity:1;transform:none}}
.parachute-colonizers{position:absolute;z-index:4;left:10%;right:10%;top:-3.5cqh;display:flex;justify-content:center;gap:.35cqw;height:4cqh}.parachute-colonizers i{position:relative;width:1.35cqw;height:3.2cqh;opacity:.12;filter:grayscale(1)}.parachute-colonizers i:before{content:'';position:absolute;left:32%;top:0;width:36%;aspect-ratio:1;border-radius:50%;background:white;box-shadow:0 0 8px var(--actor)}.parachute-colonizers i b{position:absolute;left:22%;top:28%;width:56%;height:52%;border-radius:45% 45% 20% 20%;background:var(--actor)}.parachute-colonizers i.occupied{opacity:1;filter:none;animation:colonizer-land .45s ease-out both}@keyframes colonizer-land{from{transform:translateY(-4cqh);opacity:0}to{transform:none;opacity:1}}
.quiz-setup{inset:9% 5% 7%;grid-template-columns:.9fr 1.1fr;gap:2.3cqw}.quiz-setup .arcade-setup-copy h1{font-size:3cqw}.quiz-setup .arcade-rule{margin:.7cqh 0;padding:.8cqh .8cqw}.quiz-setup-options{width:100%}.quiz-setup-options h2{margin:.7cqh 0 .4cqh}.quiz-option-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.45cqw}.quiz-option-row button{min-height:4.6cqh;padding:.35cqh .5cqw;border:1px solid #356f94;border-radius:8px;background:#061b30;color:#cfeeff;font:800 clamp(10px,.82cqw,16px) 'Barlow Condensed'}.quiz-option-row button.active{border-color:#8af5ff;background:linear-gradient(145deg,#126786,#0a395d);box-shadow:0 0 14px rgba(67,223,255,.35);color:#fff}.quiz-option-row.audiences{grid-template-columns:repeat(3,1fr)}.quiz-setup .arcade-setup-actions{margin-top:1cqh}.quiz-setup .arcade-ball-picker button{padding:.6cqh .6cqw}.quiz-setup .arcade-ball-picker i{font-size:1.7cqw}.quiz-flag{display:block;font-size:5cqw;line-height:1;margin-bottom:.4cqh}.quiz-answers.two{grid-template-columns:repeat(2,1fr);align-items:center;padding-top:7cqh}.quiz-answers.two article{height:23cqh;justify-content:center}.quiz-answers.two article strong{font-size:2.2cqw}

/* Fléchettes : les grands panneaux latéraux portent déjà les scores. */
.game-darts .arcade-topbar .arcade-competitors{display:none}
.game-darts .arcade-topbar{grid-template-columns:auto minmax(0,1fr) auto}

/* Tennis Arcade — le terrain reste entièrement lisible et les deux cibles
   utilisent exactement la même géométrie pour le dessin et pour l'impact. */
.arcade-preview-tennis{position:absolute;inset:0;overflow:hidden;background:#b85b2d}.arcade-preview-tennis img{width:100%;height:100%;object-fit:cover}.arcade-preview-tennis i{position:absolute;width:12%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%)}.arcade-preview-tennis .active{left:62%;top:58%;border:3px solid #baffff;background:rgba(66,220,255,.2);box-shadow:0 0 12px #49eaff,inset 0 0 10px #53dfff}.arcade-preview-tennis .active b{position:absolute;inset:27%;border:2px solid white;border-radius:50%;background:rgba(255,255,255,.18)}.arcade-preview-tennis .next{left:40%;top:55%;border:2px dashed #ffe76f;background:rgba(255,220,65,.08);box-shadow:0 0 8px #ffd33e}
.tennis-rally-world{position:absolute;inset:0;overflow:hidden;background:#a94720}.tennis-rally-world img{width:100%;height:100%;object-fit:cover}.tennis-rally-target{position:absolute;z-index:6;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none}.tennis-rally-target.active{border:clamp(4px,.35cqw,7px) solid #baffff;background:radial-gradient(circle,rgba(180,255,255,.2),rgba(36,199,255,.13));box-shadow:0 0 8px white,0 0 28px #29dfff,inset 0 0 20px #5deaff;animation:tennis-target-pulse 1.15s ease-in-out infinite alternate}.tennis-rally-target.active b{position:absolute;inset:27%;border:clamp(3px,.25cqw,5px) solid white;border-radius:50%;background:rgba(255,255,255,.16);box-shadow:0 0 15px white}.tennis-rally-target.next{border:clamp(3px,.24cqw,5px) dashed #ffe56a;background:rgba(255,219,59,.08);box-shadow:0 0 20px rgba(255,212,49,.72);opacity:.85}.tennis-rally-feedback{position:absolute;z-index:15;transform:translate(-50%,-50%);color:white;font:900 2.6cqw 'Barlow Condensed';text-shadow:0 0 10px currentColor,0 3px 10px #001;pointer-events:none;animation:tennis-feedback .8s ease-out both}.tennis-rally-feedback.success{color:#adffec}.tennis-rally-feedback.miss{color:#ff8f83}.tennis-rally-counter{position:absolute;z-index:7;left:2%;bottom:2%;padding:.6cqh 1cqw;border-left:4px solid #69eaff;background:rgba(2,16,29,.8);color:white;font:900 1cqw 'Barlow Condensed'}@keyframes tennis-target-pulse{to{transform:translate(-50%,-50%) scale(1.06);box-shadow:0 0 14px white,0 0 40px #29dfff,inset 0 0 25px #5deaff}}@keyframes tennis-feedback{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}35%{opacity:1;transform:translate(-50%,-65%) scale(1.2)}100%{opacity:0;transform:translate(-50%,-110%) scale(1)}}

/* Quiz « tous en meme temps » : un rond par joueur sous chaque reponse. Jeremy, 01/10/2026. */
.quiz-answers.avec-ronds article{flex-wrap:wrap;align-content:center;padding-bottom:1.2cqh}
.quiz-answers.avec-ronds .quiz-dots{flex:0 0 100%}
.quiz-dots{display:flex;justify-content:center;flex-wrap:wrap;gap:.6cqw;margin-top:1cqh}
.quiz-dot{width:clamp(26px,2.4cqw,46px);height:clamp(26px,2.4cqw,46px);border-radius:50%;background:var(--actor);border:2px solid rgba(255,255,255,.45);opacity:.5;transition:opacity .15s,transform .15s,box-shadow .15s}
.quiz-dot.choisi{opacity:1;transform:scale(1.15);box-shadow:0 0 18px var(--actor)}
.quiz-dot.juste{border-color:#a3ff96}

/* Conditions generales a l inscription — Jeremy, 01/10/2026. */
.terms-check{display:flex;align-items:center;justify-content:center;gap:.8cqw;margin-top:2cqh;font:700 clamp(12px,1cqw,18px) Inter,sans-serif;color:#cfe6f6}
.terms-check input{width:clamp(18px,1.5cqw,26px);height:clamp(18px,1.5cqw,26px);accent-color:#63c9ff}
.terms-read{display:block;margin:.8cqh auto 0;background:none;border:0;color:#7fd2ff;text-decoration:underline;font:700 clamp(11px,.9cqw,16px) Inter,sans-serif;cursor:pointer}

/* ============== BORNE D INSCRIPTION — Jeremy, 13/10/2026 ==============
   Accueil (New Player / Check Profile + drapeaux), bracelet RFID invisible,
   clavier virtuel. Memes codes couleur et unites cqw/cqh que le reste du jeu. */
.registration-actions{display:flex;gap:1.4cqw;flex-wrap:wrap;justify-content:center}
.registration-actions .btn{min-width:28cqw}
.lang-flags{display:flex;direction:ltr;gap:1cqw;margin-top:3.2cqh}
.flag-btn{width:clamp(50px,5cqw,86px);height:clamp(50px,5cqw,86px);border-radius:50%;display:grid;place-items:center;border:2px solid rgba(148,213,255,.5);background:rgba(4,25,44,.85);font-size:clamp(22px,2.1cqw,38px);transition:.2s}
.flag-btn:hover{transform:translateY(-3px);box-shadow:0 0 22px rgba(47,158,255,.45)}
.flag-btn.active{border-color:#a1ff91;box-shadow:0 0 20px rgba(93,255,99,.5)}

.bracelet-content{display:flex;flex-direction:column;align-items:center}
.bracelet-pulse{order:-1;margin-bottom:2.6cqh;width:clamp(110px,11cqw,190px);height:clamp(110px,11cqw,190px);border-radius:50%;display:grid;place-items:center;border:3px solid #67beff;background:radial-gradient(circle,rgba(47,158,255,.3),rgba(4,20,38,.92));box-shadow:0 0 30px rgba(47,158,255,.5);animation:bracelet-pulse 1.4s ease-in-out infinite}
.bracelet-pulse .icon{font-size:clamp(38px,4.2cqw,74px);text-shadow:none}
@keyframes bracelet-pulse{0%,100%{box-shadow:0 0 20px rgba(47,158,255,.4);transform:scale(1)}50%{box-shadow:0 0 50px rgba(47,158,255,.85);transform:scale(1.07)}}

.virtual-keyboard{position:absolute;z-index:55;left:0;right:0;bottom:0;padding:1.6cqh 2cqw 2.4cqh;background:linear-gradient(180deg,rgba(4,17,32,0),rgba(3,14,27,.97) 28%);backdrop-filter:blur(6px)}
.vk-rows{display:flex;flex-direction:column;align-items:center;gap:.7cqh}
.vk-row{display:flex;justify-content:center;gap:.5cqw;width:100%;max-width:980px}
.vk-key{min-width:clamp(36px,3.9cqw,62px);min-height:clamp(42px,5.6cqh,68px);background:#0b3558;border:1px solid #6aa6d2;border-radius:9px;color:#fff;font:800 clamp(16px,1.6cqw,26px) 'Barlow Condensed'}
.vk-key:hover{background:#176294;border-color:#bcefff}
.vk-key:active{transform:scale(.95)}
.vk-row-bottom{margin-top:.2cqh}
.vk-shift.active,.vk-done{background:#1a6b27;border-color:#9fff95;box-shadow:0 0 14px rgba(93,255,99,.35)}
.vk-space{flex:1;max-width:280px}
.vk-numeric{display:grid;grid-template-columns:repeat(3,1fr);gap:.7cqh .8cqw;width:100%;max-width:420px}
/* Jeremy, 13/10/2026 22h39 : le clavier virtuel alphabetique (prenom, nom,
   email, pseudo) est minuscule sur la borne, impossible a toucher du doigt —
   agrandir fortement, comme le pave numerique du telephone. */
.shell.kiosk .virtual-keyboard{padding:2cqh 3cqw 3cqh}
.shell.kiosk .vk-rows{gap:1.1cqh}
.shell.kiosk .vk-row{max-width:none;gap:.8cqw}
.shell.kiosk .vk-key{min-width:clamp(58px,8.6cqw,92px);min-height:clamp(66px,7.4cqh,98px);font-size:clamp(24px,3.4cqh,36px)}
.shell.kiosk .vk-numeric{max-width:520px;gap:1.1cqh 1.2cqw}

/* === BORNE D'INSCRIPTION — ECRAN PORTRAIT ===
   Jeremy, 13/10/2026 22h : « l'ecran de la borne est en format portrait (plus
   haut que large, type tablette verticale) ». La scene (#app.kiosk) est deja
   posee en 1080x1920 (voir plus haut + app.js, SCENE_L/SCENE_H). Les unites
   cqw/cqh s'adaptent donc deja a ce nouveau rapport pour l'essentiel de la
   mise en page ; ce qui suit n'est que l'habillage propre a la borne :
   un fond simple et calme (pas la photo d'arene du jeu), et un accueil
   epure (logo + deux gros boutons), comme demande. */
.shell.kiosk{background:linear-gradient(160deg,#0a2742 0%,#071a30 55%,#05121f 100%)}
.shell.kiosk:before,.shell.kiosk:after{content:none}
.shell.kiosk .ambient{background:radial-gradient(ellipse at 50% 20%,rgba(67,174,232,.22),transparent 55%)}
.shell.kiosk .top-glow{background:radial-gradient(ellipse at top,rgba(111,197,255,.2),transparent 70%)}
/* « Juste un logo en haut » (Jeremy) : le statut arene/horloge du jeu n'a
   rien a faire sur la borne d'inscription. */
.shell.kiosk .top-status{display:none}
/* Jeremy, 13/10/2026 22h39 : le logo BATTLE CITY doit rester CENTRE sur
   TOUS les ecrans de la borne (pas seulement l'accueil) — avant ca ne
   centrait que l'accueil, ailleurs le logo restait en haut a gauche
   (top-status cachait le 2e enfant du flex, justify-content:space-between
   collait alors le logo a gauche). */
.shell.kiosk .topbar{justify-content:center;text-align:center}
/* Accueil epure : juste le logo (topbar), deux gros boutons empiles, les
   3 drapeaux discrets en dessous. Pas de titre ni de texte d'explication
   (retires du gabarit par registration() dans app.js). Le logo de l'accueil
   est encore plus gros que sur le reste de la borne, et centre verticalement
   dans toute la zone au-dessus des boutons (pas juste colle en haut). */
.shell.kiosk.screen-registration .topbar{height:36cqh;align-items:center;padding-top:0}
.shell.kiosk.screen-registration .logo{font-size:clamp(58px,11cqw,112px);text-align:center}
.shell.kiosk.screen-registration .logo small{font-size:.34em;margin:14px auto 0;text-align:center}
.shell.kiosk.screen-registration .hero-content{top:36cqh;bottom:12cqh;left:8%;right:8%}
.shell.kiosk .registration-actions{flex-direction:column;align-items:stretch;gap:3cqh;width:100%;max-width:640px}
.shell.kiosk .registration-actions .btn{min-width:0;width:100%;min-height:clamp(96px,11cqh,160px);font-size:clamp(22px,3.4cqh,38px)}
/* Drapeaux de langue de l'accueil : ancres DIRECTEMENT sur la scene
   (.shell.kiosk.screen-registration, position:relative), pas sur .hero-content
   (qui est lui-meme position:absolute et s'arrete a bottom:12cqh de la scene).
   Avant, le div .lang-flags etait un enfant DOM de .hero-content : son
   bottom:4.2cqh se calculait donc par rapport au bas de hero-content, pas par
   rapport au bas reel de l'ecran -> 12 (ou 16) + 4.2cqh de vide en dessous.
   app.js sort maintenant <div class="lang-flags scene-lang-flags"> en frere de
   la section .hero-content (tous deux enfants directs de <main class="shell">),
   donc son position:absolute se cale sur .shell -> bottom reel de l'ecran. */
.shell.kiosk.screen-registration .scene-lang-flags{position:absolute;left:0;right:0;bottom:3.2cqh;margin-top:0;justify-content:center;gap:2.4cqw;z-index:3}
.shell.kiosk.screen-registration .scene-lang-flags .flag-btn{width:clamp(64px,7cqw,104px);height:clamp(64px,7cqw,104px);font-size:clamp(28px,2.8cqw,46px)}
/* Jeremy, 13/10/2026 22h08 : le bouton Settings (roue dentee du footer) n'a
   rien a faire sur la borne — retire pour tout le parcours (voir shell() dans
   app.js, REGISTER_MODE masque desormais le control settings-shortcut). */
/* Jeremy, 13/10/2026 22h05 puis 22h14 : le pad numerique (saisie du telephone)
   trop etroit, et le numero tape au-dessus restait petit malgre l'agrandissement
   du pad — la scene est passee de 1600 a 1080cqw (portrait), donc tout ce qui
   etait dimensionne en cqw retrecit d'autant sur la borne : on reagrandit ici
   le champ affiche ET les touches ensemble, pas seulement les touches. */
/* === BORNE — ALERTE (ex: numero invalide) : Jeremy, 14/10 matin — l'ancienne
   bulle .toast flottait en bas, pile sur la touche "0" du pave numerique,
   illisible. Sur la borne, l'erreur s'affiche desormais dans un emplacement
   reserve juste sous le titre (vide quand il n'y a rien a dire, donc ca ne
   pousse le reste que le temps du message), en rouge et bien visible. Pas de
   position absolue : on reste dans le flux, ca marche a toutes les tailles. */
.kiosk-alert{display:none;max-width:100%;margin:0;padding:0}
.kiosk-alert.show{display:block;max-width:100%;margin:0 0 1.6cqh;padding:.9cqh 1.4cqw;color:#ffd4d4;font:800 clamp(15px,1.9cqh,22px)/1.25 'Barlow Condensed',sans-serif;text-align:center;letter-spacing:.02em;background:rgba(140,12,12,.55);border:1px solid #ff5b5b;border-radius:10px;box-shadow:0 0 18px rgba(255,76,76,.45)}
.shell.kiosk .phone-content{left:9%;right:9%}
.shell.kiosk .phone-box{height:clamp(84px,10cqh,130px);margin:4cqh 0 3cqh}
.shell.kiosk .phone-box strong{font-size:clamp(34px,5.6cqw,64px)}
.shell.kiosk .phone-box strong.is-empty{font-size:clamp(26px,4.4cqw,50px)}
.shell.kiosk .phone-hint{font-size:clamp(15px,1.8cqh,22px)}
.shell.kiosk .keypad{width:100%;gap:1.4cqh 1.6cqw}
.shell.kiosk .key{font-size:clamp(28px,4.4cqw,56px)}

/* === BORNE — PROFILS TROUVES : Jeremy, 13/10/2026 22h39, ne pas empiler les
   profils existants et le bloc "ajouter un profil" dans la meme grille serree.
   Les profils existants restent en haut (found-grid), le bloc ajouter est a
   part (found-add-zone) et descend dans l'espace disponible (margin:auto 0
   dans la colonne flex du conteneur). */
.shell.kiosk .found-content{justify-content:flex-start}
.shell.kiosk .found-content .page-title{margin-bottom:3cqh}
.shell.kiosk .found-grid{margin-top:1cqh}
.shell.kiosk .found-add-zone{display:flex;justify-content:center;margin:auto 0}
.shell.kiosk .found-add-zone .found-card.add{width:min(72%,460px);height:clamp(170px,19cqh,240px)}
.shell.kiosk .found-card{width:clamp(180px,30cqw,320px)}

/* === BORNE — CREATE PROFILE (formulaire), repense pour la borne tactile
   portrait, pas un copier-coller du formulaire Battle City (large, 2 colonnes,
   pense pour un ecran de jeu horizontal). Ici : une seule colonne, des champs
   et boutons plus hauts (doigt, pas souris), et la marge suit celle du reste
   de la borne (6% au lieu de 21%, la colonne 2 n'a plus de sens en portrait). */
/* Jeremy, 13/10/2026 22h27 : le pied de page du site (MORE THAN A GAME /
   PLAY·MOVE·CHALLENGE / BATTLE CITY) n'a rien a faire sur la borne — shell()
   dans app.js ne rend plus ce footer de marque en REGISTER_MODE, seulement
   un bouton retour quand il y en a besoin. On lui donne ici une hauteur plus
   discrete (il n'a plus a porter toute la ligne de marque) et un gros bouton
   tactile. Le formulaire est donc remonte en consequence (bottom 12.5% au
   lieu de 7.5%) pour ne plus jamais passer sous ce pied de page. */
.shell.kiosk .footer{height:7.4cqh;min-height:56px;padding:0 6%;justify-content:flex-start;background:rgba(2,10,19,.55);border-top:1px solid rgba(134,199,255,.14)}
.shell.kiosk .kiosk-footer .control{min-height:clamp(52px,6.4cqh,72px);padding:.6em 1.6em;font-size:clamp(16px,2cqh,22px)}
/* Jeremy, 13/10/2026 22h39 : « Create Profile doit tenir sur une seule page,
   aucun scroll nulle part. » On remonte/elargit la zone disponible (top 5%,
   bottom 9%, juste au-dessus du footer reduit) et on resserre chaque bloc
   (gaps, paddings, hauteurs) pour que tout rentre sans jamais sacrifier la
   taille tactile (tout reste largement au-dessus des minimums tactiles
   usuels de 44-48px). Verifie par capture reelle (scrollHeight==clientHeight). */
.shell.kiosk .create-content{top:5%;bottom:9%;left:6%;right:6%}
.shell.kiosk .create-content .page-title{margin-bottom:1cqh}
.shell.kiosk .profile-form{padding:1.8cqh 4cqw;gap:.35cqh}
.shell.kiosk .form-grid{grid-template-columns:1fr;gap:1.1cqh 0}
.shell.kiosk .form-grid label{font-size:clamp(15px,2cqh,20px)}
.shell.kiosk .form-grid input{height:clamp(52px,5.6cqh,74px);font-size:clamp(18px,2.2cqh,25px);padding:0 1.2cqw}
.shell.kiosk .birth-field{font-size:clamp(15px,2cqh,20px)}
.shell.kiosk .birth-select{height:clamp(52px,5.6cqh,74px);font-size:clamp(16px,1.9cqh,22px);padding:0 .8cqw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shell.kiosk .birth-trigger{height:clamp(52px,5.6cqh,74px);font-size:clamp(18px,2.2cqh,25px);padding:0 1.2cqw}
/* Liste deroulante jour/mois/annee : sur la borne (portrait, unites cqh),
   lignes et texte plus genereux que sur le mur (cqw) — doigt sur tablette. */
.shell.kiosk .birth-dd-list{max-height:40cqh;padding:8px;gap:4px}
.shell.kiosk .birth-dd-list button{min-height:clamp(56px,6.2cqh,80px);font-size:clamp(20px,2.4cqh,28px)}
.shell.kiosk .avatar-studio{grid-template-columns:1fr;gap:1cqh}
.shell.kiosk .avatar-picker{justify-content:center;flex-wrap:wrap;gap:1cqh;padding:.8cqh 1cqw}
.shell.kiosk .avatar-picker>span{font-size:clamp(15px,2cqh,20px);letter-spacing:.06em}
.shell.kiosk .avatar-picker>div{flex-wrap:wrap;justify-content:center}
.shell.kiosk .avatar-choice .avatar{width:clamp(48px,5.2cqh,66px);height:clamp(48px,5.2cqh,66px)}
.shell.kiosk .avatar-upload{padding:1.1cqh 1.4cqw}
.shell.kiosk .avatar-upload-preview{width:clamp(50px,5.4cqh,66px);height:clamp(50px,5.4cqh,66px)}
.shell.kiosk .avatar-upload strong{font-size:clamp(15px,1.8cqh,19px)}
.shell.kiosk .avatar-upload small{font-size:clamp(12px,1.5cqh,15px)}
.shell.kiosk .avatar-photo-actions{gap:1cqw;margin-top:.6cqh}
.shell.kiosk .avatar-photo-actions label,.shell.kiosk .avatar-photo-actions button{min-height:46px;padding:.5em 1.1em;font-size:clamp(13px,1.7cqh,17px)}
.shell.kiosk .terms-check{font-size:clamp(15px,1.9cqh,19px);gap:1.2cqw;margin-top:1.1cqh}
.shell.kiosk .terms-check input{width:clamp(32px,4cqh,42px);height:clamp(32px,4cqh,42px)}
.shell.kiosk .terms-read{font-size:clamp(14px,1.8cqh,18px);margin-top:.5cqh;padding:.3em}
.shell.kiosk .form-footer{flex-direction:column;gap:.7cqh}
.shell.kiosk .form-footer .btn{width:100%;min-height:clamp(58px,6.2cqh,80px);font-size:clamp(17px,2.1cqh,24px)}
.shell.kiosk .form-footer small{max-width:none;text-align:center;order:2}

/* === BORNE — CHECK PROFILE (fiche en lecture seule) === */
.profile-view-content .avatar{width:clamp(84px,9cqh,130px);height:clamp(84px,9cqh,130px);font-size:clamp(32px,3.5cqh,48px);margin-bottom:1.6cqh}
.profile-view-card{width:min(100%,640px);display:flex;flex-direction:column;gap:.9cqh;margin-top:2.4cqh;padding:1.8cqh 2.2cqw;border:1px solid #4f9bce;border-radius:15px;background:rgba(4,20,38,.93)}
.profile-view-row{display:flex;align-items:baseline;justify-content:space-between;gap:1cqw;padding:.6cqh 0;border-bottom:1px solid rgba(100,170,220,.2)}
.profile-view-row:last-child{border-bottom:0}
.profile-view-row span{font:700 clamp(12px,1.5cqh,16px) Inter,sans-serif;letter-spacing:.08em;color:#9fc6dd;text-transform:uppercase}
.profile-view-row strong{font:800 clamp(16px,2cqh,22px) 'Barlow Condensed';color:#fff;text-align:right}
/* Le reste du parcours (profils trouves, bracelet, confirmation) garde ses
   proportions habituelles : les unites cqw/cqh se recalculent deja sur la
   scene 1080x1920, rien d'autre a figer en dur. */