:root{
  --cell:42px;
  --line:#8392a3;
  --ink:#30343b;
  --blue:#2e86e6;
  --blue-dark:#315676;
  --head:#dce9f5;
  --cell-bg:#f4f7fa;
  --blocked-a:#c9dbe8;
  --blocked-b:#e8f1f7;
  --pending:#2387e8;
  --yellow:#ffd84e;
  --red:#ef4b50;
  --paper:#ffffff;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;width:100%;min-height:100%;background:#f5f7fa;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);overscroll-behavior:none;touch-action:manipulation}
body{min-height:100dvh}
button{font:inherit}
.app{width:min(100%,430px);min-height:100dvh;margin:auto;padding:calc(10px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;background:linear-gradient(#fff,#f1f5f9)}
.topbar{display:grid;grid-template-columns:96px 1fr 65px;align-items:center;gap:8px}.topbar-left{display:flex;align-items:center;gap:6px}.back-btn{text-decoration:none;display:grid;place-items:center;line-height:1}
.icon-btn{width:44px;height:44px;border:1px solid #b7c6d5;border-radius:13px;background:#fff;color:#287ccf;font-size:28px;font-weight:800;box-shadow:0 2px 6px #294d6f18}
.title-block{text-align:center;min-width:0}.title-block h1{font-size:22px;margin:0;color:#34536e}.title-block span{display:block;margin-top:2px;color:#8a96a3;font-size:11px}
.score-box{height:46px;border:1px solid #c8d6e3;border-radius:12px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-box small{font-size:10px;color:#758392}.score-box strong{font-size:20px;color:#2a80d5;line-height:1}
.clue-card{border:1px solid #d4b078;border-radius:12px;background:linear-gradient(#fffdf7,#fff5df);padding:9px 11px;min-height:66px;box-shadow:0 2px 5px #8a6d4213}.clue-meta{font-size:12px;font-weight:800;color:#2f5f8f}.clue-text{font-size:15px;font-weight:650;line-height:1.24;margin-top:4px;color:#25292e}
.board-shell{align-self:center;display:grid;grid-template-columns:32px repeat(7,var(--cell));grid-template-rows:32px repeat(9,var(--cell));background:var(--line);gap:1px;border:2px solid var(--line);box-shadow:0 2px 7px #30475e1f}
.corner.integrated{background:var(--head)}
.head-btn{border:0;border-radius:0;background:var(--head);color:#24435e;font-weight:850;font-size:13px;padding:0;display:grid;place-items:center}.head-btn.active{background:#ffcf68;color:#5d3b08}.head-btn:active{filter:brightness(.96)}
.cell{width:var(--cell);height:var(--cell);border:0;border-radius:0;padding:0;display:grid;place-items:center;background:var(--cell-bg);font-size:25px;font-weight:850;line-height:1;color:var(--ink);position:relative;overflow:visible;touch-action:none;user-select:none}
.cell.blocked{background:repeating-linear-gradient(135deg,var(--blocked-a) 0 7px,var(--blocked-b) 7px 14px);cursor:default}.cell.blocked::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px #9fb8ca}
.cell.selected-word{position:relative;box-shadow:inset 0 0 0 999px rgba(196,145,18,.38)}.cell.pending{color:#135f9d;background:#dceeff;box-shadow:none}.cell.validated{color:var(--ink);background:var(--cell-bg);box-shadow:none;z-index:1}.cell.correct-flash{animation:correctFlash .28s linear 5}.cell.snap-target{z-index:4;box-shadow:inset 0 0 0 3px #56a7ef,0 0 0 2px #fff,0 0 13px #2787d477}.cell.source-moving{color:transparent!important}.cell.error{animation:errorFlash .28s linear 6}.cell.word-wave{animation:wordWave .48s ease var(--wave-delay,0ms)}
@keyframes correctFlash{0%,100%{background:var(--cell-bg);box-shadow:none}50%{background:#79e68b;box-shadow:inset 0 0 0 4px #17a43c,0 0 13px #2ed94daa}}
@keyframes errorFlash{0%,100%{background:var(--cell-bg);box-shadow:none}50%{background:#ffcccc;box-shadow:inset 0 0 0 4px var(--red),0 0 9px #ff4c4c99}}
@keyframes wordWave{0%,100%{transform:translateY(0)}45%{transform:translateY(-9px);box-shadow:inset 0 0 0 3px var(--yellow),0 8px 8px #3e566b33}}
.rack-card{border:1px solid #bed1e2;border-radius:12px;background:#eaf3fb;padding:8px}.rack-title{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:7px}.rack-title strong{font-size:13px;color:#294d6b}.rack-title span{font-size:10px;color:#6f8496;text-align:right}.rack{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;min-height:52px}.tile{height:52px;border:1px solid #e0b76e;border-radius:9px;background:linear-gradient(#fffdf7,#fff0d3);box-shadow:0 3px 0 #c59349;color:#1f2630;font-size:27px;font-weight:850;display:grid;place-items:center;touch-action:none;user-select:none}.tile.drag-source{opacity:.18}
.drag-ghost{position:fixed;left:0;top:0;z-index:500;pointer-events:none;width:54px;height:54px;border:1px solid #e0b76e;border-radius:10px;background:linear-gradient(#fffdf7,#fff0d3);box-shadow:0 10px 24px #26384a55;color:#1f2630;font-size:28px;font-weight:850;display:grid;place-items:center;will-change:transform}
.actions{display:grid;grid-template-columns:1fr 1.5fr;gap:8px}.actions button{height:48px;border-radius:13px;font-weight:800}.secondary{border:1px solid #c6d4e1;background:#fff;color:#316891}.validate{border:0;background:linear-gradient(#3b93ef,#257bd5);color:#fff;box-shadow:0 3px 0 #1b5e9f}.validate:disabled{background:#d8dde3;color:#969fa8;box-shadow:none}.legend{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;color:#748190;font-size:10px}.legend span{display:flex;gap:4px;align-items:center}.sample{display:inline-block;width:14px;height:14px;border:1px solid #9ea9b4;background:#f5f7fa}.sample.pending{background:#dceeff;border-color:#b9cfdf}.sample.valid{background:var(--cell-bg);border-color:#9ea9b4}.sample.blocked{background:repeating-linear-gradient(135deg,var(--blocked-a) 0 4px,var(--blocked-b) 4px 8px)}
.toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translate(-50%,18px);opacity:0;background:#27394b;color:#fff;padding:9px 14px;border-radius:18px;font-size:12px;font-weight:700;transition:.18s;z-index:600;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
.victory[hidden]{display:none}.victory{position:fixed;inset:0;z-index:700;background:#082643dd;display:grid;place-items:center}.victory canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.victory-card{position:relative;width:min(84vw,340px);background:linear-gradient(#fffdf6,#f3dfbb);border:3px solid #d5a85f;border-radius:20px;padding:24px;text-align:center;box-shadow:0 20px 60px #0007}.victory-card h2{margin:0 0 8px;color:#2c5e8f}.victory-card p{margin:0 0 12px}.victory-card strong{display:block;font-size:24px;color:#d38a12;margin-bottom:15px}.victory-card button{border:0;border-radius:11px;background:#2c9b47;color:#fff;padding:10px 22px;font-weight:800}
@media(max-width:370px){:root{--cell:39px}.app{padding-left:8px;padding-right:8px}.title-block h1{font-size:19px}.clue-text{font-size:14px}.rack{gap:4px}.tile{height:48px;font-size:24px}}

/* V2.1 — comptage visuel des points */
.cell-score{position:fixed;z-index:2400;transform:translate(-100%,-100%);font-size:17px;font-weight:950;line-height:1;pointer-events:none;white-space:nowrap;text-shadow:0 1px 2px #fff,0 0 6px #fff;animation:cellScoreFloat 1.85s ease-out forwards}
.cell-score.plus{color:#128b37}.cell-score.minus{color:#c9232f}
@keyframes cellScoreFloat{0%{opacity:0;transform:translate(-100%,-70%) scale(.72)}15%{opacity:1;transform:translate(-100%,-105%) scale(1.22)}72%{opacity:1;transform:translate(-100%,-125%) scale(1)}100%{opacity:0;transform:translate(-100%,-155%) scale(.9)}}
.word-bonus{position:fixed;z-index:2200;transform:translate(-50%,-50%);white-space:nowrap;padding:6px 10px;border-radius:12px;background:#ffd84e;color:#664300;font-size:13px;font-weight:950;box-shadow:0 4px 14px #7d5f2077,0 0 0 2px #fff8;pointer-events:none;animation:bonusPop 2.2s ease-out forwards}
@keyframes bonusPop{0%{opacity:0;transform:translate(-50%,-20%) scale(.7)}14%{opacity:1;transform:translate(-50%,-75%) scale(1.2)}72%{opacity:1;transform:translate(-50%,-90%) scale(1)}100%{opacity:0;transform:translate(-50%,-125%) scale(.9)}}
.score-box.score-up strong{animation:scoreUp .32s ease}.score-box.score-down strong{animation:scoreDown .32s ease}
@keyframes scoreUp{0%,100%{transform:scale(1);color:#2a80d5}50%{transform:scale(1.35);color:#1aa64b}}
@keyframes scoreDown{0%,100%{transform:scale(1);color:#2a80d5}50%{transform:scale(1.35);color:#d5303a}}

/* V2.2 — cadres de définition et de lettres à hauteur fixe */
.clue-card{
  height:76px;
  min-height:76px;
  max-height:76px;
  flex:0 0 76px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.clue-meta{
  flex:0 0 auto;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.1;
}
.clue-text{
  flex:1 1 auto;
  min-height:0;
  margin-top:4px;
  font-size:14px;
  line-height:1.16;
  overflow:hidden;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.rack-card{
  height:84px;
  min-height:84px;
  max-height:84px;
  flex:0 0 84px;
  overflow:hidden;
  padding:7px 8px;
}
.rack-title{
  height:17px;
  min-height:17px;
  margin-bottom:5px;
  overflow:hidden;
}
.rack-title strong{font-size:12px;line-height:17px;white-space:nowrap}
.rack-title span{font-size:9px;line-height:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rack{
  height:48px;
  min-height:48px;
  max-height:48px;
  align-items:stretch;
}
.tile{
  height:48px;
  min-height:48px;
  max-height:48px;
  font-size:25px;
}
@media(max-width:370px){
  .clue-card{height:72px;min-height:72px;max-height:72px;flex-basis:72px;padding:7px 9px}
  .clue-meta{font-size:11px}
  .clue-text{font-size:12px;line-height:1.14}
  .rack-card{height:78px;min-height:78px;max-height:78px;flex-basis:78px;padding:6px}
  .rack-title{height:15px;min-height:15px;margin-bottom:4px}
  .rack-title strong{font-size:11px;line-height:15px}
  .rack-title span{font-size:8px;line-height:15px}
  .rack{height:44px;min-height:44px;max-height:44px}
  .tile{height:44px;min-height:44px;max-height:44px;font-size:23px}
}

/* V2.3 — retouches lisibilité et animation */
.board-shell{overflow:visible}
.app{overflow:visible}

/* V5 — indices visuels + cases bloquées bleu neutre */
.clue-text.visual-clue{-webkit-line-clamp:unset;display:flex;align-items:center;justify-content:center;gap:7px;margin-top:1px;overflow:visible;font-size:20px;line-height:1}
.clue-text.rebus-clue strong{font-size:18px;font-weight:900;color:#253746;letter-spacing:-.4px}
.clue-picture{display:inline-grid;place-items:center;min-width:44px;height:42px;font-size:34px;line-height:1;filter:saturate(1.08)}
.cell.blocked{background:repeating-linear-gradient(135deg,var(--blocked-a) 0 7px,var(--blocked-b) 7px 14px)}
.sample.blocked{background:repeating-linear-gradient(135deg,var(--blocked-a) 0 4px,var(--blocked-b) 4px 8px)}

/* Accueil, classements et accès générateur */
.home-page,.generator-page{width:min(100%,560px);min-height:100dvh;margin:auto;padding:max(18px,env(safe-area-inset-top)) 14px max(18px,env(safe-area-inset-bottom));background:linear-gradient(#f7fbff,#eef4f8);color:#283d50}
.home-hero{text-align:center;padding:18px 10px 10px}.home-hero h1{font-size:34px;margin:0;color:#315b80}.home-hero p{margin:7px 0 0;color:#718699;font-size:14px}.secret-word{border:0;background:none;padding:0;color:#e26e2b;font:inherit;font-weight:inherit;cursor:default}.home-card{background:#fff;border:1px solid #cbdbe8;border-radius:16px;box-shadow:0 4px 15px #294d6f12}.profile-card{padding:14px;margin:12px 0}.profile-card label{display:block;font-weight:850;color:#315b80;margin-bottom:7px}.pseudo-row{display:grid;grid-template-columns:1fr auto;gap:8px}.pseudo-row input{min-width:0;height:44px;border:1px solid #bfcfdd;border-radius:11px;padding:0 11px;font-size:15px}.pseudo-row button{border:0;border-radius:11px;background:#2e82d1;color:#fff;padding:0 13px;font-weight:800}.profile-card small{display:block;color:#728697;margin-top:7px}.home-actions{margin:12px 0}.primary-home{display:block;text-align:center;text-decoration:none;background:linear-gradient(#3b93ef,#257bd5);color:white;border-radius:14px;padding:14px;font-weight:900;box-shadow:0 3px 0 #1b5e9f}.ranking-grid{display:grid;grid-template-columns:1fr;gap:12px}.ranking-card{padding:12px}.ranking-title{display:flex;justify-content:space-between;align-items:end;gap:8px;border-bottom:1px solid #e2ebf2;padding-bottom:8px;margin-bottom:5px}.ranking-title h2{margin:0;font-size:17px;color:#315b80}.ranking-title span{font-size:9px;color:#80909e}.ranking-list{min-height:40px}.rank-row{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:7px;padding:8px 5px;border-bottom:1px solid #edf2f6}.rank-row:last-child{border-bottom:0}.rank-row b{color:#7d8e9b}.rank-row strong{color:#2d7dcc;font-size:16px}.rank-row.me{background:#fff5d7;border-radius:9px}.empty{font-size:12px;color:#8998a4;text-align:center}.secret-hint{text-align:center;font-size:9px;color:#b0bac2;margin-top:14px}.generator-head{display:flex;gap:12px;align-items:center;margin-bottom:16px}.generator-head a{text-decoration:none;color:#2a78bf;font-weight:800}.generator-head h1{margin:0;font-size:22px;color:#315b80}.generator-head p{margin:2px 0 0;color:#81909d;font-size:12px}.generator-card{padding:15px;background:#fff;border:1px solid #cbdbe8;border-radius:16px;box-shadow:0 4px 15px #294d6f12;overflow:auto}.generator-board{--gcell:min(10.8vw,55px);display:grid;grid-template-columns:32px repeat(7,var(--gcell));grid-template-rows:32px repeat(9,var(--gcell));gap:1px;background:#9aabba;border:2px solid #9aabba;width:max-content;margin:auto}.gen-corner,.gen-head{background:#e3edf5}.gen-head{display:grid;place-items:center;font-weight:850;color:#31536d;font-size:12px}.gen-cell{background:#fffdf8}
@media(min-width:700px){.ranking-grid{grid-template-columns:1fr 1fr}}

/* V6 — générateur : sélection du mot fil rouge */
.generator-layout{display:grid;grid-template-columns:1fr;gap:12px}.generator-card-title{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}.generator-card-title strong{display:block;color:#315b80}.generator-card-title small{display:block;color:#80909e;font-size:10px;margin-top:2px}.generator-card-title button{border:0;border-radius:10px;background:#2e82d1;color:#fff;padding:8px 10px;font-weight:800}.thread-status{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#edf6fd;border:1px solid #c6dfee;border-radius:11px;padding:8px 10px;margin-bottom:9px}.thread-status span{font-variant-numeric:tabular-nums;color:#5c7488;font-size:12px}.thread-status strong{font-size:12px;color:#315b80}.thread-status strong.done{color:#d96824}.thread-list{height:258px;overflow-y:auto;border:1px solid #d7e3ec;border-radius:12px;background:#f9fcfe;padding:5px;scrollbar-width:thin}.thread-word{padding:7px 9px;border-radius:8px;font-size:13px;font-weight:800;color:#60778a;letter-spacing:.4px;transition:.08s}.thread-word:nth-child(even){background:#f2f7fa}.thread-word.active{background:linear-gradient(#ffcf71,#f2a93d);color:#5a3513;box-shadow:0 0 0 2px #fff,0 0 0 4px #e7a03a;transform:scale(1.02)}.gen-cell{display:grid;place-items:center;color:#28455e;font-weight:900;font-size:calc(var(--gcell)*.42)}.gen-cell.thread-cell{background:linear-gradient(#fff2c3,#ffd67e);color:#a44914;box-shadow:inset 0 0 0 2px #e89734}.chosen-word{margin:12px auto 0;max-width:320px;text-align:center;background:#fff6df;border:1px solid #e8bf78;border-radius:12px;padding:9px}.chosen-word span,.chosen-word small{display:block;font-size:10px;color:#7d6a55}.chosen-word strong{display:block;font-size:21px;color:#d36824;margin:2px 0}@media(min-width:760px){.generator-layout{grid-template-columns:minmax(240px,.72fr) minmax(400px,1.28fr)}.thread-list{height:500px}}

/* V15 — sélection lisible sans masquer l’état des lettres */
.cell.selected-word.pending{background:#dceeff;box-shadow:inset 0 0 0 999px rgba(196,145,18,.28)}
.cell.selected-word.validated{background:var(--cell-bg);box-shadow:inset 0 0 0 999px rgba(196,145,18,.38)}
.cell.selected-word.snap-target{box-shadow:inset 0 0 0 999px rgba(196,145,18,.25),inset 0 0 0 3px #56a7ef,0 0 0 2px #fff,0 0 13px #2787d477}
.grid-picker-open{width:100%;border:0;font:inherit;cursor:pointer}
.modal-open{overflow:hidden}
.modal-overlay[hidden]{display:none}.modal-overlay{position:fixed;inset:0;z-index:900;background:rgba(25,45,63,.58);display:grid;place-items:center;padding:18px}
.grid-modal{width:min(92vw,430px);max-height:min(78vh,650px);background:#fff;border:1px solid #c7d8e5;border-radius:18px;box-shadow:0 20px 60px #10283f66;display:flex;flex-direction:column;overflow:hidden}
.grid-modal-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:15px 15px 11px;border-bottom:1px solid #e0e9f0;background:#f7fbfe}.grid-modal-head h2{margin:0;color:#315b80;font-size:20px}.grid-modal-head p{margin:3px 0 0;color:#7d8e9d;font-size:11px}.grid-modal-head button{border:0;background:#e7f0f7;color:#315b80;width:34px;height:34px;border-radius:50%;font-size:24px;line-height:1;flex:none}
.grid-choice-list{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:9px;min-height:0}.grid-choice-list a{display:flex;flex-direction:column;gap:3px;text-decoration:none;padding:13px 12px;margin-bottom:8px;border:1px solid #d7e3ec;border-radius:12px;background:linear-gradient(#fff,#f7fbfe)}.grid-choice-list a:last-child{margin-bottom:0}.grid-choice-list strong{color:#2d6fa9;font-size:15px}.grid-choice-list span{color:#80909e;font-size:11px}

/* V18 — mot fil rouge ARENES */
.home-app-icon{width:82px;height:82px;border-radius:20px;display:block;margin:0 auto 10px;box-shadow:0 5px 16px #1d3f5f33}
.cell.thread-letter{background:linear-gradient(rgba(133,75,173,.22),rgba(133,75,173,.22)),var(--cell-bg)}
.cell.thread-letter.pending{background:linear-gradient(rgba(133,75,173,.20),rgba(133,75,173,.20)),#dceeff}
.cell.thread-letter.validated{background:linear-gradient(rgba(133,75,173,.22),rgba(133,75,173,.22)),var(--cell-bg)}
.cell.thread-letter.selected-word{box-shadow:inset 0 0 0 999px rgba(194,142,17,.34),inset 0 0 0 3px rgba(114,57,154,.35)}
.cell.thread-letter.pending.selected-word{background:linear-gradient(rgba(133,75,173,.18),rgba(133,75,173,.18)),#dceeff}

.firework-message{position:relative;z-index:2;color:white;font-size:26px;font-weight:950;text-shadow:0 3px 12px #000;letter-spacing:.2px;background:#08264388;border:1px solid #ffffff55;border-radius:18px;padding:11px 18px;backdrop-filter:blur(4px)}

.thread-game[hidden],.history-modal[hidden]{display:none}
.thread-game,.history-modal{position:fixed;inset:0;z-index:1200;background:#102b43e8;display:grid;place-items:center;padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom));overflow:auto}
.thread-game-card{width:min(100%,430px);max-height:96dvh;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 24px 75px #00192a88;border:2px solid #d2b180;display:flex;flex-direction:column}
.thread-image-wrap{height:min(42dvh,340px);min-height:230px;background:#e9eef2;overflow:hidden}
.thread-image-wrap img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 48%}
.thread-game-body{padding:15px 16px 17px;text-align:center;background:linear-gradient(#fffdf8,#f7ead4)}
.thread-game-body small,.history-content>small{color:#704391;font-weight:950;letter-spacing:.08em}
.thread-game-body h2{font-size:21px;line-height:1.12;margin:4px 0 6px;color:#35546e}.thread-game-body p{font-size:12px;line-height:1.35;color:#657785;margin:0 0 12px}
.thread-slots,.thread-pool{display:grid;grid-template-columns:repeat(var(--thread-count,6),minmax(0,1fr));gap:var(--thread-gap,6px);margin:8px 0;width:100%}
.thread-slot,.thread-tile{height:48px;min-width:0;border-radius:9px;font-size:var(--thread-font,25px);font-weight:950;display:grid;place-items:center;padding:0;overflow:hidden}
.thread-slot{border:2px dashed #b9a8c7;background:#f7f2fa;color:#5d3a75}.thread-slot.filled{border-style:solid;border-color:#ad82c5;background:#efe2f5;box-shadow:0 2px 0 #9d71b6}.thread-tile{border:1px solid #d6ae6b;background:linear-gradient(#fffdf7,#ffedd0);box-shadow:0 3px 0 #bd8840;color:#27394a}
.thread-validate{width:100%;height:47px;border:0;border-radius:12px;background:linear-gradient(#7951a2,#5e397f);color:#fff;font-weight:900;font-size:16px;margin-top:6px;box-shadow:0 3px 0 #44245d}.thread-validate:disabled{background:#c7c4ca;box-shadow:none;color:#747078}.thread-feedback{height:23px;padding-top:6px;font-size:12px;font-weight:850;color:#6b4584}.thread-success{animation:threadSuccess .75s ease}@keyframes threadSuccess{0%,100%{transform:scale(1)}45%{transform:scale(1.025);box-shadow:0 0 0 7px #b98ddb66,0 24px 75px #00192a88}}
.thread-slot.thread-wrong{animation:threadWrong .55s ease}@keyframes threadWrong{20%,60%{background:#ffd4d6;border-color:#e3545d;transform:translateX(-3px)}40%,80%{transform:translateX(3px)}}

.history-card{position:relative;width:min(100%,430px);max-height:94dvh;overflow:auto;border-radius:23px;border:2px solid #d6b47f;box-shadow:0 24px 75px #00192a88;background:#fffaf0;isolation:isolate}
.history-bg{position:absolute;inset:0;z-index:-1;background:url('assets/arenes-arles-cartoon.png') center/cover no-repeat;opacity:.16}
.history-content{padding:24px 20px 20px;background:linear-gradient(rgba(255,250,240,.84),rgba(255,250,240,.9));min-height:100%}.history-content h2{font-family:Georgia,serif;font-size:27px;color:#684080;margin:4px 0 13px}.history-content p{font-size:14px;line-height:1.48;color:#314355;margin:0 0 11px}.history-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:17px}.history-actions a,.history-actions button{height:46px;border-radius:12px;font-weight:850;display:grid;place-items:center;text-decoration:none;font-size:13px}.history-home{background:#fff;border:1px solid #bfcfda;color:#35678e}.history-actions button{border:0;background:#6d438c;color:#fff}
@media(max-height:720px){.thread-image-wrap{height:29dvh;min-height:160px}.thread-game-body{padding:10px 13px}.thread-game-body h2{font-size:18px}.thread-game-body p{font-size:11px}.thread-slot,.thread-tile{height:42px;font-size:22px}.history-content{padding:17px 16px}.history-content p{font-size:12px;line-height:1.38}}

/* V20 — drag & drop du mini-jeu fil rouge */
.thread-tile,.thread-slot.filled{touch-action:none;cursor:grab}
.thread-tile:active,.thread-slot.filled:active{cursor:grabbing}
.thread-drag-source{opacity:.25}
.thread-drag-ghost{position:fixed;z-index:2600;transform:translate(-50%,-68%) scale(1.08);pointer-events:none;display:grid;place-items:center;border-radius:10px;background:linear-gradient(#fffdf7,#ffedd0);border:2px solid #c99b57;box-shadow:0 12px 26px #00192a55,0 3px 0 #bd8840;color:#27394a;font-size:25px;font-weight:950;will-change:left,top}
.thread-slot.thread-snap{transform:scale(1.07);border-color:#7d53a0;background:#eadcf1;box-shadow:0 0 0 3px #b996cf66,0 5px 12px #3d254f28}
.thread-slot,.thread-tile{transition:transform .14s ease,box-shadow .14s ease,background .14s ease,border-color .14s ease}

/* V21 — fil rouge plus clair et sans encadrement spécifique à la sélection */
.cell.thread-letter{
  background:linear-gradient(rgba(205,181,224,.24),rgba(205,181,224,.24)),var(--cell-bg);
}
.cell.thread-letter.pending{
  background:linear-gradient(rgba(205,181,224,.20),rgba(205,181,224,.20)),#dceeff;
}
.cell.thread-letter.validated{
  background:linear-gradient(rgba(205,181,224,.24),rgba(205,181,224,.24)),var(--cell-bg);
}
/* Lorsqu'une entrée contenant une lettre fil rouge est sélectionnée,
   on garde uniquement le masque jaune de sélection, sans contour violet. */
.cell.thread-letter.selected-word{
  box-shadow:inset 0 0 0 999px rgba(196,145,18,.34);
}
.cell.thread-letter.pending.selected-word{
  background:linear-gradient(rgba(205,181,224,.18),rgba(205,181,224,.18)),#dceeff;
  box-shadow:inset 0 0 0 999px rgba(196,145,18,.28);
}
.cell.thread-letter.validated.selected-word{
  background:linear-gradient(rgba(205,181,224,.24),rgba(205,181,224,.24)),var(--cell-bg);
  box-shadow:inset 0 0 0 999px rgba(196,145,18,.38);
}

/* V22 — violet du fil rouge légèrement renforcé */
.cell.thread-letter{
  background:linear-gradient(rgba(176,135,207,.30),rgba(176,135,207,.30)),var(--cell-bg);
}
.cell.thread-letter.pending{
  background:linear-gradient(rgba(176,135,207,.25),rgba(176,135,207,.25)),#dceeff;
}
.cell.thread-letter.validated{
  background:linear-gradient(rgba(176,135,207,.30),rgba(176,135,207,.30)),var(--cell-bg);
}
.cell.thread-letter.selected-word{
  box-shadow:inset 0 0 0 999px rgba(196,145,18,.34);
}
.cell.thread-letter.pending.selected-word{
  background:linear-gradient(rgba(176,135,207,.23),rgba(176,135,207,.23)),#dceeff;
  box-shadow:inset 0 0 0 999px rgba(196,145,18,.28);
}
.cell.thread-letter.validated.selected-word{
  background:linear-gradient(rgba(176,135,207,.30),rgba(176,135,207,.30)),var(--cell-bg);
  box-shadow:inset 0 0 0 999px rgba(196,145,18,.38);
}
/* V23 - classements en popups */
.ranking-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.ranking-open{border:1px solid #c7d8e5;background:#fff;color:#315b80;border-radius:14px;padding:13px 8px;font-weight:900;box-shadow:0 3px 10px #294d6f12}
.ranking-modal-body{overflow-y:auto;overscroll-behavior:contain;padding:7px 13px 14px;min-height:90px;max-height:calc(78vh - 78px);-webkit-overflow-scrolling:touch}
.rank-row.podium{grid-template-columns:38px 1fr auto;padding:10px 5px}
.rank-medal{font-size:24px;text-align:center;line-height:1}
@media(max-width:390px){.ranking-buttons{grid-template-columns:1fr}}

/* V26 — bonus positionnés selon l'orientation et vague avec rotation 3D façon carrousel */
.word-bonus.horizontal{animation:bonusAbove 2.35s ease-out forwards}
.word-bonus.vertical{animation:bonusSide 2.35s ease-out forwards}
@keyframes bonusAbove{
  0%{opacity:0;transform:translate(-50%,-30%) scale(.72)}
  14%{opacity:1;transform:translate(-50%,-65%) scale(1.18)}
  72%{opacity:1;transform:translate(-50%,-72%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-90%) scale(.92)}
}
@keyframes bonusSide{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.72)}
  14%{opacity:1;transform:translate(-50%,-50%) scale(1.18)}
  72%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(.92)}
}
.cell.word-wave.word-spin{
  transform-style:preserve-3d;
  backface-visibility:visible;
  animation:wordWaveCarousel .86s cubic-bezier(.2,.68,.24,1) var(--wave-delay,0ms);
}
@keyframes wordWaveCarousel{
  0%{transform:perspective(260px) translateY(0) rotateY(0deg) scale(1)}
  16%{transform:perspective(260px) translateY(-5px) rotateY(38deg) scale(1.03)}
  38%{transform:perspective(260px) translateY(-10px) rotateY(118deg) scale(1.07);box-shadow:inset 0 0 0 3px var(--yellow),0 9px 10px #3e566b3a}
  58%{transform:perspective(260px) translateY(-11px) rotateY(218deg) scale(1.07);box-shadow:inset 0 0 0 3px var(--yellow),0 9px 10px #3e566b3a}
  80%{transform:perspective(260px) translateY(-5px) rotateY(322deg) scale(1.03)}
  100%{transform:perspective(260px) translateY(0) rotateY(360deg) scale(1)}
}

/* V25 — présence sur l'accueil */
.online-presence{margin-top:10px;display:flex;align-items:center;justify-content:center;gap:7px;min-height:24px;color:#587187;font-size:12px;font-weight:800}
.online-dot{width:9px;height:9px;border-radius:50%;background:#4db96a;box-shadow:0 0 0 3px rgba(77,185,106,.15),0 0 9px rgba(77,185,106,.35);animation:onlinePulse 2s ease-in-out infinite}
@keyframes onlinePulse{50%{transform:scale(.82);opacity:.7}}

/* V29 multi-grilles */
.thread-image-wrap.symbol-only{display:grid;place-items:center;min-height:190px;background:linear-gradient(160deg,#e9e0ff,#f8f3ff)}
.thread-symbol{font-size:92px;filter:drop-shadow(0 8px 12px rgba(67,42,105,.25))}
.grid-choice-list{max-height:min(58vh,520px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding-right:3px}

/* V29 — mise en évidence temporaire du mot trouvé avant et pendant la vague */
.cell.word-found-yellow{
  background:#ffe28a !important;
  transition:background-color .22s ease;
}

/* V30 — félicitations et adaptation du mot fil rouge */
.firework-message{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.firework-message strong{font-size:1.35em;letter-spacing:.02em}
.firework-message span{display:block}
.thread-game-card{--thread-count:6;--thread-font:25px;--thread-gap:6px}

/* V31 — accueil illustré plein écran */
.home-body-v31{margin:0;width:100%;height:100dvh;min-height:100dvh;overflow:hidden;background:#1e4d78}
.home-scene-v31{position:fixed;inset:0;width:100%;height:100dvh;background:url('assets/home-background-v31.png') center center/100% 100% no-repeat;overflow:hidden;isolation:isolate}
.home-scene-v31 button,.home-scene-v31 input{font-family:inherit}
.secret-title-hit{position:absolute;left:12%;top:8.5%;width:75%;height:18%;border:0;background:transparent;padding:0;opacity:0;z-index:3}
.profile-overlay-v31{position:absolute;left:8.3%;top:51.3%;width:83.5%;height:17.3%;z-index:5;pointer-events:none}
.profile-overlay-v31 input{position:absolute;left:5.6%;top:29.5%;width:58.4%;height:29.8%;border:0;outline:0;background:transparent;color:#281f32;font-size:clamp(18px,5vw,29px);padding:0 2.7%;font-weight:600;pointer-events:auto;appearance:none;-webkit-appearance:none;box-shadow:none}
.profile-overlay-v31 input::placeholder{color:#6e6571;opacity:.56}
.profile-overlay-v31 #savePseudo{position:absolute;left:68.1%;top:29.1%;width:27.3%;height:29.8%;border:0;background:transparent;padding:0;opacity:0;pointer-events:auto}
.pseudo-info-v31{position:absolute;left:6.3%;right:5%;top:65%;height:12%;display:flex;align-items:center;color:#4a2a5d;font-size:clamp(10px,2.85vw,16px);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.online-presence-v31{position:absolute;left:6.3%;right:5%;top:79%;height:12%;display:flex;align-items:center;justify-content:center;color:#315f38;font-size:clamp(10px,2.8vw,16px);font-weight:850;pointer-events:none}
.home-hit{position:absolute;border:0;background:transparent;padding:0;opacity:0;z-index:4}
#playBtn{left:8.6%;top:70.0%;width:82.7%;height:7.2%}
.ranking-hit.personal{left:8.7%;top:77.8%;width:40.0%;height:7.2%}
.ranking-hit.global{left:51.4%;top:77.8%;width:40.0%;height:7.2%}
.home-hit:focus-visible,.secret-title-hit:focus-visible,.profile-overlay-v31 #savePseudo:focus-visible{opacity:1;outline:3px solid #fff9;outline-offset:-3px;border-radius:14px}
@media (orientation:landscape){.home-body-v31{overflow:auto}.home-scene-v31{position:relative;width:min(100vw,48vh);height:100vh;margin:auto}}

/* V32 — zones Aide/Paramètres sur le visuel d'accueil et fenêtres associées */
.top-image-hit{position:absolute;top:1.7%;height:7.6%;border:0;background:transparent;padding:0;opacity:0;z-index:6}
.help-hit-v32{left:73.3%;width:9.2%}
.settings-hit-v32{left:84.0%;width:9.2%}
.top-image-hit:focus-visible{opacity:1;outline:3px solid #fff9;outline-offset:-3px;border-radius:50%}
.info-modal-v32{max-height:min(82vh,700px)}
.info-modal-body-v32{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:15px 17px 18px;color:#334e65}
.info-modal-body-v32 h3{margin:12px 0 4px;color:#684080;font-size:15px}.info-modal-body-v32 h3:first-child{margin-top:0}
.info-modal-body-v32 p{margin:0 0 8px;font-size:13px;line-height:1.45}
.settings-body-v32{display:grid;gap:10px}
.setting-row-v32{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px;border:1px solid #d9e4ec;border-radius:13px;background:#f9fcfe}
.setting-row-v32 span{display:flex;flex-direction:column;gap:3px}.setting-row-v32 strong{font-size:14px;color:#315b80}.setting-row-v32 small{font-size:11px;color:#788b9b;line-height:1.3}
.setting-row-v32 input{width:22px;height:22px;accent-color:#684080}
.setting-separator-v32{height:1px;background:#e0e8ef;margin:2px 0}
.settings-action-v32{height:44px;border:0;border-radius:12px;background:linear-gradient(#7951a2,#5e397f);color:#fff;font-weight:900;font-size:13px;box-shadow:0 3px 0 #44245d}
.settings-note-v32{text-align:center!important;color:#8999a5!important;font-size:10px!important;margin:0!important}


/* V33 — reprise de partie et statut des grilles */
.grid-choice-title{display:flex;align-items:center;justify-content:space-between;gap:10px}
.grid-progress-badge{font-style:normal;font-size:10px;font-weight:950;letter-spacing:.02em;color:#704391;background:#efe2f5;border:1px solid #c9a7d9;border-radius:999px;padding:4px 8px;white-space:nowrap}
.grid-choice-list a.in-progress{background:linear-gradient(#fff,#faf4fd);border-color:#d5b9e1;box-shadow:inset 4px 0 0 #9f73b9}

/* V34 — compteur de réussites dans le choix des grilles */
.grid-choice-status{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap}
.grid-success-badge{font-style:normal;font-size:10px;font-weight:950;letter-spacing:.01em;color:#276a43;background:#e2f5e9;border:1px solid #9fd0b1;border-radius:999px;padding:4px 8px;white-space:nowrap}
.grid-choice-list a.has-success{border-color:#b7d9c4}
