:root{--size:3;--navy:#06245a;--navy2:#031b44;--blue:#1e88e5;--sky:#39a9ff;--orange:#ff8a00;--green:#37b75a;--purple:#8850c7;--red:#ef3f49;--ink:#0d1b2e;--muted:#67758a;--card:#fff;--line:#dce3eb;--radius:18px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#eef3f8}body{min-height:100dvh;overscroll-behavior:none}button{font:inherit}.hidden{display:none!important}.app-shell{min-height:100dvh}.home-screen{min-height:100dvh;display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));background:radial-gradient(circle at 50% -10%,#0b4ca4,var(--navy) 46%,var(--navy2));color:#fff}.home-card{width:min(100%,780px);text-align:center}.brand{display:flex;justify-content:center;gap:.2em;align-items:center;font-weight:950;font-size:clamp(2rem,8vw,4.7rem);letter-spacing:.01em;text-shadow:0 4px 0 #0003}.brand span{color:#ffb000}.brand b{color:#fff}.brand em{font-style:normal;color:#40b6ff}.subtitle{margin:.2rem 0 1.25rem;color:#dbe9ff;font-size:clamp(1rem,3.3vw,1.3rem)}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mode-card{border:2px solid transparent;border-radius:20px;padding:14px;background:#f6fbff;color:#10253e;text-align:left;display:grid;grid-template-columns:92px 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;box-shadow:0 12px 28px #0003;cursor:pointer;transition:.18s}.mode-card:hover,.mode-card.selected{transform:translateY(-2px)}.mode-card[data-mode=taquin].selected{border-color:#ff9a00;box-shadow:0 0 0 3px #ff9a0035,0 12px 28px #0003}.mode-card[data-mode=puzzle].selected{border-color:#38a8ff;box-shadow:0 0 0 3px #38a8ff35,0 12px 28px #0003}.mode-card strong{font-size:1.35rem}.mode-card[data-mode=taquin] strong{color:#e66d00}.mode-card[data-mode=puzzle] strong{color:#1473c9}.mode-card small{grid-column:2;line-height:1.3;font-size:.88rem;color:#33475d}.mode-icon{grid-row:1/3;width:90px;aspect-ratio:1;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:4px;border-radius:11px;background:#0d2a4b}.mode-icon i{display:block;border-radius:4px}.taquin-icon i{background:#ffb21b}.taquin-icon i:last-child{background:#101f35}.puzzle-icon i{background:#35a9ff}.home-card h2{font-size:1.05rem;margin:24px 0 10px;color:#fff}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}.level-grid button{border:0;border-radius:14px;padding:13px 6px;color:#fff;box-shadow:0 7px 0 #0002,0 10px 20px #0002;cursor:pointer}.level-grid button:nth-child(1){background:var(--green)}.level-grid button:nth-child(2){background:var(--blue)}.level-grid button:nth-child(3){background:var(--orange)}.level-grid button:nth-child(4){background:var(--purple)}.level-grid strong{display:block;font-size:1.3rem}.level-grid span{font-size:.8rem}.home-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.secondary-btn,.danger-btn,.primary-btn,.icon-btn{border:0;border-radius:11px;padding:11px 13px;font-weight:800;cursor:pointer}.secondary-btn{background:#0a356f;color:#fff;border:1px solid #72a5e4}.progress-home{color:#bdd7fb;font-size:.9rem}.ios-install{margin:12px auto 0;max-width:600px;background:#00183d;padding:11px 14px;border-radius:12px;color:#dbe9ff;font-size:.86rem}.game-screen{min-height:100dvh;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:linear-gradient(#f8fafc,#edf2f7)}.game-header{height:48px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;max-width:760px;margin:0 auto 8px}.game-header strong{text-align:center;color:#0c4f9c;font-size:clamp(.9rem,3.8vw,1.15rem)}.game-header span{font-size:.8rem;color:#526174}.icon-btn{padding:8px 10px;background:#fff;border:1px solid var(--line);box-shadow:0 3px 10px #001a3b18;color:#21476e}.board-zone{display:grid;place-items:start center}.board{position:relative;width:min(calc(100vw - 16px),calc(100dvh - 245px),720px);aspect-ratio:1;background:#dfe6ed;border:5px solid #fff;border-radius:18px;box-shadow:0 10px 28px #001a3b30;overflow:hidden;touch-action:none}.tile{position:absolute;width:calc(100% / var(--size));height:calc(100% / var(--size));background-repeat:no-repeat;border:1px solid #ffffffb5;cursor:pointer;transition:transform 170ms cubic-bezier(.2,.8,.2,1),filter 150ms,box-shadow 150ms;will-change:transform;user-select:none;-webkit-user-select:none}.selected-tile{z-index:12;filter:brightness(1.08) saturate(1.1);box-shadow:0 9px 16px #001a3b7a,0 0 0 3px #fff inset}.complete-piece{pointer-events:none}.below-game{max-width:760px;margin:10px auto 0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(130px,.92fr);gap:10px;align-items:stretch}.info-panel,.model-panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:9px;box-shadow:0 4px 15px #001a3b14}.info-title{text-align:center;font-size:.72rem;font-weight:900;color:#44536a;margin-bottom:6px}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}.stat{border:1px solid #e6ebf1;border-radius:9px;padding:7px 8px;background:#fafcfe;min-width:0}.stat span{display:block;color:#69788c;font-size:.69rem}.stat strong{display:block;margin-top:1px;font-size:.96rem;color:#172a41;white-space:nowrap}.game-hint{margin:7px 2px;color:#637186;font-size:.72rem;line-height:1.3}.controls{display:grid;grid-template-columns:1fr 1fr;gap:6px}.primary-btn{background:linear-gradient(#3098ff,#1479dd);color:#fff}.danger-btn{background:linear-gradient(#f55059,#e9343f);color:#fff}.model-panel{display:flex;flex-direction:column}.preview-box{position:relative;margin:auto;width:100%;max-height:230px;aspect-ratio:1;overflow:hidden;border-radius:11px;background:#dce4ec;border:1px solid #cad4df}.preview{display:block;width:100%;height:100%;object-fit:cover}.preview-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--size),1fr);grid-template-rows:repeat(var(--size),1fr);pointer-events:none}.preview-grid i{border:.5px solid #ffffff8c}.missing-mark{position:absolute;background:repeating-linear-gradient(135deg,#f5f5f5 0,#f5f5f5 5px,#5b6470 5px,#5b6470 9px);border:2px solid #fff;box-shadow:0 0 0 1px #4f5966;pointer-events:none}.fx-canvas{position:fixed;inset:0;width:100vw;height:100dvh;pointer-events:none;z-index:40}.win-message{position:fixed;left:50%;top:50%;translate:-50% -50%;z-index:50;opacity:0;transform:scale(.9);pointer-events:none;transition:.25s}.win-message.show{opacity:1;transform:scale(1);pointer-events:auto}.win-message>div{background:#06245af5;color:#fff;border:2px solid #ffffff40;border-radius:20px;padding:24px 28px;text-align:center;box-shadow:0 20px 70px #001a3b80}.win-message strong{display:block;font-size:1.9rem;color:#ffb000}.win-message span{display:block;color:#dceaff;margin:8px 0 15px}.modal{position:fixed;inset:0;z-index:80;background:#031833df;display:grid;place-items:center;padding:14px}.modal-card{position:relative;width:min(96vw,600px);max-height:90dvh;overflow:auto;background:#fff;border-radius:20px;padding:20px;color:#172a41;box-shadow:0 20px 70px #0008}.modal-card h2{text-align:center;margin:0 0 14px;color:#123e74}.close-btn{position:absolute;right:10px;top:6px;border:0;background:transparent;color:#49637e;font-size:2rem}.score-tabs{display:grid;grid-template-columns:1fr 1fr;border:1px solid #dce4ed;border-radius:10px;overflow:hidden;margin-bottom:10px}.score-tab{border:0;padding:9px;background:#f6f8fb;color:#1d64ae;font-weight:850}.score-tab.active{background:#ff8a00;color:#fff}.score-level{border-top:1px solid #e5eaf0;padding-top:4px}.score-level h3{margin:7px 0 4px}.score-level ol{list-style:none;padding:0;margin:0}.score-level li{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:5px 2px;border-top:1px solid #eff2f6;font-size:.88rem}.score-level .rank{font-weight:800;color:#e67b00}.score-level li>span:last-child{color:#7b8795}.no-score{color:#8b96a3;font-size:.85rem}.modal .danger-btn{width:100%;margin-top:12px}
@media(max-width:560px){.home-screen{display:block}.home-card{padding-top:7vh}.mode-grid{grid-template-columns:1fr}.mode-card{grid-template-columns:76px 1fr;padding:10px}.mode-icon{width:72px}.level-grid{grid-template-columns:1fr 1fr}.home-actions{grid-template-columns:1fr}.board{width:min(calc(100vw - 16px),calc(100dvh - 300px));min-width:250px}.below-game{grid-template-columns:1.1fr .9fr}.info-panel,.model-panel{padding:7px}.stat{padding:5px 6px}.stat span{font-size:.62rem}.stat strong{font-size:.83rem}.game-hint{font-size:.65rem}.controls{grid-template-columns:1fr}.controls button{padding:8px 4px;font-size:.75rem}.preview-box{max-height:190px}.game-header{height:42px}.game-header span{font-size:.68rem}.icon-btn{font-size:.75rem}}
@media(max-width:380px){.board{width:min(calc(100vw - 12px),calc(100dvh - 315px));min-width:230px}.below-game{gap:6px}.game-hint{display:none}.stat span{font-size:.58rem}.stat strong{font-size:.77rem}.info-title{font-size:.65rem}}
@media(min-width:780px) and (orientation:landscape){.game-screen{display:flex;flex-direction:column}.board{width:min(68vh,700px)}.below-game{width:min(68vh,700px)}}


/* V2.1 - corrections visuelles */
.mode-card{border-width:4px}
.mode-card.selected{transform:translateY(-3px) scale(1.025);position:relative;z-index:2}
.mode-card[data-mode=taquin].selected{border-color:#ff9a00;box-shadow:0 0 0 5px #fff,0 0 0 10px #ff9a00,0 16px 32px #0005}
.mode-card[data-mode=puzzle].selected{border-color:#38a8ff;box-shadow:0 0 0 5px #fff,0 0 0 10px #38a8ff,0 16px 32px #0005}

/* Les pièces utilisent exactement le même cadrage carré "cover" que le modèle. */
.tile{overflow:hidden;background:none!important}
.tile-image{position:absolute;display:block;max-width:none!important;object-fit:cover;object-position:center;pointer-events:none;user-select:none;-webkit-user-drag:none}
.preview{object-fit:cover;object-position:center}

/* Une fois la photo reconstituée, plus aucun trait de grille sur l'image. */
.board.solved-view .tile{border-color:transparent!important;box-shadow:none}
.board.solved-view .selected-tile{filter:none;box-shadow:none}

/* Le message de victoire reste sous le jeu et ne masque jamais la photo réussie. */
.win-message{position:relative;left:auto;top:auto;translate:none;z-index:20;width:min(100%,760px);margin:10px auto 0;opacity:0;transform:translateY(8px) scale(.98);pointer-events:none;max-height:0;overflow:hidden;transition:opacity .25s,transform .25s,max-height .3s}
.win-message.show{opacity:1;transform:none;pointer-events:auto;max-height:180px}
.win-message>div{padding:14px 18px;border-radius:16px}
.win-message strong{font-size:1.55rem}
.win-message span{margin:5px 0 10px}

@media(max-width:560px){
  .mode-card.selected{transform:scale(1.015)}
  .mode-card[data-mode=taquin].selected{box-shadow:0 0 0 4px #fff,0 0 0 8px #ff9a00,0 12px 28px #0005}
  .mode-card[data-mode=puzzle].selected{box-shadow:0 0 0 4px #fff,0 0 0 8px #38a8ff,0 12px 28px #0005}
  .win-message{margin-top:8px}
}


/* V3 : à la réussite, une image unique recouvre les pièces : aucune jointure de grille possible. */
.solved-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;z-index:30;pointer-events:none}
.board.solved-view .tile{border:0!important;outline:0!important;box-shadow:none!important}
.board.solved-view{background:#fff}
/* Bravo est placé immédiatement sous le plateau et reste lisible sur mobile. */
.win-message.show{overflow:visible;max-height:220px}
.win-message .primary-btn{min-height:46px;font-size:1rem;padding:11px 18px}
\n\n/* VERSION 4 - univers pictural bleu nuit / or, inspiré de Van Gogh */
.home-screen{
  background:
    radial-gradient(circle at 12% 12%,#d9a51422 0 5%,transparent 6%),
    radial-gradient(circle at 82% 18%,#f2c94c25 0 4%,transparent 5%),
    repeating-radial-gradient(ellipse at 55% 5%,transparent 0 22px,#2e75b520 24px 28px,transparent 30px 45px),
    linear-gradient(155deg,#061638,#0b3270 48%,#061936);
}
.edition-badge{display:inline-block;margin:.35rem auto .25rem;padding:6px 12px;border:1px solid #efc04b88;border-radius:999px;color:#ffd66b;background:#061936b8;font-weight:850;font-size:.72rem;letter-spacing:.12em}
.home-card{filter:drop-shadow(0 18px 28px #00102a55)}
.mode-card{background:linear-gradient(145deg,#fff9e9,#edf7ff)}
.mode-card[data-mode=taquin].selected{box-shadow:0 0 0 5px #fff8da,0 0 0 10px #f2b51d,0 0 32px #ffc83288,0 16px 32px #0005}
.mode-card[data-mode=puzzle].selected{box-shadow:0 0 0 5px #e8f5ff,0 0 0 10px #3ea9ff,0 0 32px #3ea9ff77,0 16px 32px #0005}
.game-screen{background:linear-gradient(#f7f4e9,#edf3f7)}
.board{border-color:#fff7da;box-shadow:0 0 0 2px #d5a52b55,0 10px 28px #001a3b30}
.info-panel,.model-panel{background:linear-gradient(#fffdf5,#fff)}

/* V7 - état de téléchargement/validation de l'image aléatoire */
.random-status{max-width:760px;margin:0 auto 8px;padding:9px 12px;border-radius:12px;background:#e8f3ff;border:1px solid #9ecbf4;color:#174e82;text-align:center;font-size:.82rem;font-weight:750}
.random-status.error{background:#fff0f0;border-color:#efaaaa;color:#9a2830}
.board.loading-board::after{content:'Recherche d\2019 une image…';position:absolute;inset:0;z-index:60;display:grid;place-items:center;background:#eff4f9;color:#28577f;font-weight:850;letter-spacing:.01em}