/* =========================================================================
   MemoQuest 6.30.3 — interface partagée et thèmes isolés
   Règle structurelle : chaque écran est une colonne flexible bornée.
   Rien ne peut déborder, rien ne peut se superposer.
   ========================================================================= */

.mq-shell {
	--ciel-1: #4bc3f0;
	--ciel-2: #8ddcf8;
	--ciel-3: #d9f0fc;
	--ciel-4: #eef8f0;
	--sable: #f6e7c9;

	--blanc: #ffffff;
	--encre: #153c7a;
	--encre-2: #55719c;
	--encre-3: #93a9c6;

	--turq: #16c4ce;
	--turq-2: #0fa3b4;
	--bleu: #2e86e0;
	--bleu-2: #1f6ac0;
	--degrade: linear-gradient(105deg, #16c4ce 0%, #2e86e0 100%);

	--or: #ffc02e;
	--or-2: #e8951c;
	--vert: #4cc93f;
	--vert-2: #2e9e23;
	--rouge: #f04438;
	--orange: #ff8a3d;

	--past-menthe: #e4f7ef;
	--past-bleu: #e7f1fe;
	--past-lilas: #f0ebfd;
	--past-creme: #fdf3e2;
	--past-rose: #fdeaee;
	--past-ciel: #e6f4fd;

	--r-s: 10px;
	--r-m: 16px;
	--r-l: 22px;
	--r-xl: 28px;
	--r-pill: 999px;

	--ombre: 0 2px 4px rgba(21, 60, 122, .06), 0 6px 16px rgba(21, 60, 122, .10);
	--ombre-forte: 0 4px 8px rgba(21, 60, 122, .09), 0 12px 28px rgba(21, 60, 122, .16);

	--ease: cubic-bezier(.32, .72, .24, 1);
	--sortie: cubic-bezier(.16, 1, .3, 1);
	--ressort: cubic-bezier(.34, 1.56, .5, 1);

	--gap: clamp(6px, 1.3vmin, 12px);
	--pad: clamp(8px, 1.8vmin, 18px);

	position: fixed;
	inset: 0;
	z-index: 9;
	overflow: hidden;
	overscroll-behavior: none;
	color: var(--encre);
	font-family: ui-rounded, "SF Pro Rounded", "Segoe UI Variable Display",
	             "Trebuchet MS", Verdana, system-ui, sans-serif;
	font-size: clamp(13px, 1.6vmin, 16px);
	line-height: 1.3;
	font-weight: 700;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
	background: linear-gradient(180deg,
		var(--ciel-1) 0%, var(--ciel-2) 20%, var(--ciel-3) 46%,
		var(--ciel-4) 72%, var(--sable) 100%);
}

.mq-shell[data-skin="ocean"] {
	--ciel-1:#3fcfe5; --ciel-2:#20a5c8; --ciel-3:#0e769e; --ciel-4:#075a80; --sable:#043d64;
	--turq:#27d9dc; --turq-2:#0daebf; --bleu:#2098e8; --bleu-2:#0f63ad;
	--degrade:linear-gradient(105deg,#27d9dc,#2098e8);
	--encre:#0b376f; --encre-2:#476b91; --encre-3:#86a8c2;
	--mq-ocean-pearl:#fbfeff; --mq-ocean-line:#c8f1f6; --mq-ocean-deep:#033b62;
	background:
		radial-gradient(circle at 50% -12%, rgba(218,255,255,.94) 0%, rgba(92,220,236,.54) 25%, transparent 52%),
		linear-gradient(180deg,#3bcde5 0%,#1b9fc3 24%,#0c779d 52%,#075678 76%,#04395f 100%);
}
.mq-shell[data-skin="ambre"]   { --ciel-1:#ffb457; --ciel-2:#ffd79a; --ciel-3:#fff0d8; --ciel-4:#fff7ea; --sable:#f4dcae; --turq:#ff9d3d; --bleu:#f2711c; --bleu-2:#c9550c; --degrade:linear-gradient(105deg,#ff9d3d,#f2711c); }
.mq-shell[data-skin="nuit"]    { --ciel-1:#070b14; --ciel-2:#0b1220; --ciel-3:#111b2c; --ciel-4:#172338; --sable:#080d17; --turq:#83dcf6; --turq-2:#5fbdd9; --bleu:#7587ef; --bleu-2:#5262c4; --degrade:linear-gradient(105deg,#83dcf6,#7587ef); --encre:#f4f7fb; --encre-2:#b7c2d5; --encre-3:#8492aa; }

.mq-shell *, .mq-shell *::before, .mq-shell *::after { box-sizing: border-box; }
.mq-shell [hidden] { display: none !important; }
.mq-shell button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; padding: 0; }
.mq-shell :focus-visible { outline: 3px solid var(--turq); outline-offset: 2px; border-radius: 8px; }
.mq-noscript { padding: 2rem; text-align: center; }

.mq-degrade-texte {
	background: linear-gradient(100deg, var(--turq) 0%, var(--bleu) 46%, #1b3a86 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- Décor ---------- */
.mq-ambiance { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.mq-ambiance i { position: absolute; border-radius: 50%; will-change: transform; }
.mq-ambiance i:nth-child(1) {
	width: 78vmax; height: 42vmax; left: -20vmax; top: -12vmax;
	background: radial-gradient(ellipse, rgba(255, 255, 255, .5) 0%, transparent 64%);
	animation: mq-derive-a 30s var(--ease) infinite alternate;
}
.mq-ambiance i:nth-child(2) {
	width: 56vmax; height: 56vmax; right: -22vmax; top: 26vmax;
	background: radial-gradient(circle, rgba(76, 201, 63, .18) 0%, transparent 62%);
	animation: mq-derive-b 36s var(--ease) infinite alternate;
}
.mq-ambiance i:nth-child(3) {
	width: 60vmax; height: 40vmax; left: -18vmax; bottom: -12vmax;
	background: radial-gradient(ellipse, rgba(22, 196, 206, .18) 0%, transparent 62%);
	animation: mq-derive-c 42s var(--ease) infinite alternate;
}
@keyframes mq-derive-a { to { transform: translate3d(8vmax, 3vmax, 0) scale(1.1); } }
@keyframes mq-derive-b { to { transform: translate3d(-9vmax, -6vmax, 0) scale(1.14); } }
@keyframes mq-derive-c { to { transform: translate3d(7vmax, -5vmax, 0) scale(1.12); } }

/* =========================================================================
   THÈME OCÉAN 6.26.0 — décor autonome, lumineux et strictement arrière-plan
   ========================================================================= */
.mq-ambiance > .mq-ocean-fish,
.mq-ambiance > .mq-ocean-flora { display:none; }

.mq-shell[data-skin="ocean"] .mq-ambiance {
	contain:strict;
	background:
		radial-gradient(ellipse at 50% 0%,rgba(197,255,255,.44) 0%,rgba(66,204,228,.14) 37%,transparent 68%),
		linear-gradient(180deg,rgba(6,85,124,.02),rgba(0,35,73,.14));
}
.mq-shell[data-skin="ocean"] .mq-ambiance::before {
	content:"";position:absolute;inset:-12% -20% 24%;opacity:.40;
	background:
		repeating-radial-gradient(ellipse at 50% -12%,transparent 0 8%,rgba(213,255,255,.17) 9% 10.4%,transparent 11.5% 19%),
		repeating-linear-gradient(106deg,transparent 0 8%,rgba(232,255,255,.12) 9% 10%,transparent 11% 18%);
	background-size:118% 112%,150% 100%;
	mix-blend-mode:screen;filter:blur(1px);
	animation:mq-ocean-caustics 16s ease-in-out infinite alternate;
	will-change:transform,background-position;
}
.mq-shell[data-skin="ocean"] .mq-ambiance::after {
	content:"";position:absolute;inset:auto 0 0;height:27%;opacity:.50;
	background:
		linear-gradient(180deg,transparent 0%,rgba(1,48,78,.05) 38%,rgba(1,34,64,.34) 100%),
		url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201200%20260%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22sand%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%230e7c99%22%20stop-opacity%3D%22.08%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23034870%22%20stop-opacity%3D%22.58%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath%20fill%3D%22url(%23sand)%22%20d%3D%22M0%20260V202c72-24%20148-18%20216%200%2056%2015%20104%2010%20158-11%2057-22%20118-22%20178%200%2053%2019%20103%2015%20159-8%2058-24%20122-25%20189%201%2062%2025%20112%2021%20170-2%2048-19%2092-21%20139-9%2048%2013%2096%2017%20161%209v60H0Z%22/%3E%3C/svg%3E") center bottom / 120% 100% no-repeat;
	filter:saturate(.96);transform:translateZ(0);
}
.mq-shell[data-skin="ocean"] .mq-ambiance i { border-radius:0; }
.mq-shell[data-skin="ocean"] .mq-ambiance i:nth-child(1) {
	width:82%;height:52%;left:9%;top:-4%;
	background:
		linear-gradient(103deg,transparent 0 18%,rgba(217,255,255,.25) 35%,transparent 53%),
		linear-gradient(78deg,transparent 0 32%,rgba(225,255,255,.17) 46%,transparent 61%);
	filter:blur(5px);transform-origin:50% 0;
	animation:mq-ocean-rays 13s ease-in-out infinite alternate;
}
.mq-shell[data-skin="ocean"] .mq-ambiance i:nth-child(2) {
	width:100%;height:100%;inset:0;
	background:
		radial-gradient(circle at 8% 78%,transparent 0 5px,rgba(220,253,255,.38) 6px 7px,transparent 8px),
		radial-gradient(circle at 91% 64%,transparent 0 7px,rgba(220,253,255,.34) 8px 9px,transparent 10px),
		radial-gradient(circle at 74% 35%,transparent 0 3px,rgba(233,255,255,.32) 4px 5px,transparent 6px),
		radial-gradient(circle at 19% 39%,transparent 0 4px,rgba(233,255,255,.28) 5px 6px,transparent 7px),
		radial-gradient(circle at 58% 82%,transparent 0 4px,rgba(233,255,255,.30) 5px 6px,transparent 7px);
	animation:mq-ocean-bubbles 15s linear infinite;
}
.mq-shell[data-skin="ocean"] .mq-ambiance i:nth-child(3) {
	width:90%;height:24%;left:5%;bottom:-7%;
	background:radial-gradient(ellipse,rgba(53,205,221,.25) 0%,rgba(5,80,112,.14) 55%,transparent 73%);
	filter:blur(18px);animation:mq-ocean-tide 10s ease-in-out infinite alternate;
}

/* Poissons vectoriels : décor discret, aucun clic ni image externe. */
.mq-shell[data-skin="ocean"] .mq-ambiance > .mq-ocean-fish,
.mq-shell[data-skin="ocean"] .mq-ambiance > .mq-ocean-flora {
	display:block;position:absolute;pointer-events:none;z-index:1;will-change:transform;
}
.mq-shell[data-skin="ocean"] .mq-ocean-fish-a {
	width:clamp(170px,36vw,390px);aspect-ratio:13/4;left:3%;top:24%;opacity:.22;
	background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20260%2080%22%3E%3Cg%20fill%3D%22%23dffcff%22%3E%3Cpath%20d%3D%22M42%2038c18-16%2045-16%2062%200-17%2016-44%2016-62%200Zm-20%200%2020-13v26Z%22/%3E%3Ccircle%20cx%3D%2288%22%20cy%3D%2234%22%20r%3D%222%22%20fill%3D%22%230b7194%22/%3E%3Cpath%20d%3D%22M126%2052c14-12%2035-12%2049%200-14%2012-35%2012-49%200Zm-16%200%2016-10v20Z%22%20opacity%3D%22.82%22/%3E%3Ccircle%20cx%3D%22162%22%20cy%3D%2249%22%20r%3D%221.7%22%20fill%3D%22%230b7194%22/%3E%3Cpath%20d%3D%22M190%2025c12-10%2030-10%2042%200-12%2010-30%2010-42%200Zm-14%200%2014-9v18Z%22%20opacity%3D%22.68%22/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
	animation:mq-ocean-fish-a 29s linear infinite;
}
.mq-shell[data-skin="ocean"] .mq-ocean-fish-b {
	width:clamp(145px,29vw,310px);aspect-ratio:13/4;right:2%;top:58%;opacity:.16;
	background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20260%2080%22%3E%3Cg%20fill%3D%22%23065f82%22%3E%3Cpath%20d%3D%22M36%2040c20-17%2049-17%2068%200-19%2017-48%2017-68%200Zm-22%200%2022-14v28Z%22/%3E%3Ccircle%20cx%3D%2288%22%20cy%3D%2236%22%20r%3D%222%22%20fill%3D%22%23c9f9ff%22/%3E%3Cpath%20d%3D%22M130%2024c14-12%2035-12%2049%200-14%2012-35%2012-49%200Zm-16%200%2016-10v20Z%22%20opacity%3D%22.8%22/%3E%3Cpath%20d%3D%22M190%2055c12-10%2030-10%2042%200-12%2010-30%2010-42%200Zm-14%200%2014-9v18Z%22%20opacity%3D%22.64%22/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
	animation:mq-ocean-fish-b 36s linear infinite;
}
.mq-shell[data-skin="ocean"] .mq-ocean-flora {
	inset:auto 0 0;height:24%;opacity:.34;z-index:0;
	background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201200%20300%22%3E%3Cg%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%3E%3Cg%20stroke%3D%22%23075c78%22%20stroke-width%3D%2218%22%20opacity%3D%22.72%22%3E%3Cpath%20d%3D%22M72%20300c0-105%2011-151%2038-211M76%20205l-48-51M104%20164l50-58M116%20231l46-42%22/%3E%3Cpath%20d%3D%22M1114%20300c0-111-9-158-37-222M1111%20203l49-58M1082%20162l-48-55M1075%20234l-49-43%22/%3E%3C/g%3E%3Cg%20stroke%3D%22%230b7890%22%20stroke-width%3D%2212%22%20opacity%3D%22.62%22%3E%3Cpath%20d%3D%22M190%20300c4-82-2-123-23-171M190%20228l38-42M173%20195l-34-36%22/%3E%3Cpath%20d%3D%22M996%20300c-4-85%202-128%2024-178M998%20224l-37-41M1016%20192l35-37%22/%3E%3C/g%3E%3C/g%3E%3Cg%20fill%3D%22%23096c86%22%20opacity%3D%22.5%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22270%22%20r%3D%2227%22/%3E%3Ccircle%20cx%3D%22940%22%20cy%3D%22272%22%20r%3D%2231%22/%3E%3Cpath%20d%3D%22M0%20300h1200v-34c-73-12-139-9-202%208-69%2018-132%2016-198-3-67-19-135-20-204%200-64%2018-127%2018-190%200-70-20-139-22-207-2-59%2017-126%2020-199%207V300Z%22/%3E%3C/g%3E%3C/svg%3E") center bottom/100% 100% no-repeat;
}

@keyframes mq-ocean-caustics {
	0% { transform:translate3d(-2%,0,0) scale(1.02);background-position:0 0,0 0; }
	100% { transform:translate3d(2%,-1.5%,0) scale(1.07);background-position:8% 5%,-9% 3%; }
}
@keyframes mq-ocean-rays { from { transform:skewX(-3deg) scaleX(.96);opacity:.68; } to { transform:skewX(4deg) scaleX(1.08);opacity:.95; } }
@keyframes mq-ocean-bubbles { from { transform:translate3d(0,7%,0); } to { transform:translate3d(0,-8%,0); } }
@keyframes mq-ocean-tide { to { transform:translate3d(0,-2vmax,0) scale(1.07);opacity:.76; } }
@keyframes mq-ocean-fish-a { from { transform:translate3d(-8%,0,0); } to { transform:translate3d(34%,-10%,0); } }
@keyframes mq-ocean-fish-b { from { transform:translate3d(10%,0,0) scaleX(-1); } to { transform:translate3d(-32%,8%,0) scaleX(-1); } }

/* ---------- Démarrage ---------- */
.mq-boot { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; z-index: 2; }
.mq-boot strong { font-size: 1.5rem; font-weight: 900; letter-spacing: -.03em; }
.mq-boot small { color: var(--encre-2); }
.mq-boot-mark { width: 58px; height: 58px; border-radius: 19px; background: var(--degrade); box-shadow: var(--ombre-forte); animation: mq-battement 1.5s var(--ease) infinite; }
@keyframes mq-battement { 0%, 100% { transform: scale(1) rotate(0); } 50% { transform: scale(.84) rotate(-9deg); } }

/* =========================================================================
   STRUCTURE — colonnes flexibles, jamais de débordement
   ========================================================================= */
.mq-app {
	position: absolute; inset: 0; z-index: 1;
	display: flex; flex-direction: column; gap: var(--gap);
	padding: max(var(--pad), env(safe-area-inset-top)) var(--pad) max(var(--pad), env(safe-area-inset-bottom));
	overflow: hidden;
}
.mq-app > .mq-top,
.mq-app > .mq-nav { flex: 0 0 auto; }
.mq-stage { position: relative; flex: 1 1 auto; min-height: 0; }

.mq-view {
	position: absolute; inset: 0;
	display: flex; flex-direction: column; gap: var(--gap);
	overflow: hidden;
	opacity: 0; visibility: hidden; transform: translateY(14px) scale(.98);
	transition: opacity .24s var(--sortie), transform .36s var(--sortie), visibility .36s;
}
.mq-view.is-active { opacity: 1; visibility: visible; transform: none; }
/* Le premier et le dernier bloc gardent leur taille, celui du milieu absorbe. */
.mq-view > *:nth-child(1),
.mq-view > *:nth-child(3) { flex: 0 1 auto; min-height: 0; }
.mq-view > *:nth-child(2) { flex: 1 1 auto; min-height: 0; }
.mq-view > .mq-choix { display: grid; }

/* =========================================================================
   BANDEAU JOUEUR — une seule rangée, jamais de retour à la ligne
   ========================================================================= */
.mq-top {
	display: flex; align-items: center; gap: 8px; flex-wrap: nowrap;
	padding: 6px 8px; border-radius: var(--r-l);
	background: var(--blanc); box-shadow: var(--ombre);
	min-height: 54px;
}
.mq-avatar {
	position: relative; width: 40px; height: 40px; border-radius: 50%; flex: 0 0 auto;
	background: var(--degrade); color: #fff; font-weight: 900; font-size: 1rem;
	display: flex; align-items: center; justify-content: center;
	border: 2px solid #fff; box-shadow: 0 0 0 2px rgba(22, 196, 206, .28);
}
.mq-avatar > img { width:100%; height:100%; display:block; border-radius:50%; object-fit:cover; }
.mq-avatar b {
	position: absolute; right: -5px; bottom: -5px;
	min-width: 20px; height: 20px; padding: 0 4px; border-radius: 99px;
	display: flex; align-items: center; justify-content: center;
	background: var(--turq); color: #fff; font-size: .64rem; font-weight: 900;
	border: 2px solid #fff;
}
.mq-profil-info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.mq-profil-info strong { font-size: .88rem; font-weight: 900; color: var(--encre); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mq-xp { height: 7px; border-radius: 99px; background: #e4ecf5; overflow: hidden; }
.mq-xp i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--turq), #3ad8ac); transition: width .5s var(--sortie); }

.mq-chip {
	display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto;
	padding: 4px 5px 4px 4px; border-radius: var(--r-pill);
	background: #f4f8fc; font-weight: 900; font-size: .88rem;
	font-variant-numeric: tabular-nums; color: var(--encre);
	transition: transform .18s var(--ressort);
}
.mq-chip .mq-coin {
	width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 50%;
	background: radial-gradient(circle at 34% 28%, #ffe08a, var(--or) 52%, var(--or-2));
	box-shadow: inset 0 -2px 3px rgba(140, 80, 0, .3); color: #7a4a00;
}
.mq-chip .mq-coin svg { width: 14px; height: 14px; stroke-width: 3; }
.mq-chip b { padding: 0 2px; }
.mq-chip .mq-plus {
	width: 21px; height: 21px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	background: var(--turq); color: #fff; font-weight: 900; font-size: .9rem; line-height: 1;
}
.mq-chip:active { transform: scale(.94); }
.mq-chip.is-pinged { animation: mq-bourse .7s var(--ressort); }
@keyframes mq-bourse { 28% { transform: scale(1.14) rotate(-3deg); } 58% { transform: scale(.97); } }

.mq-icon-btn {
	width: 38px; height: 38px; border-radius: 50%; flex: 0 0 auto; position: relative;
	display: flex; align-items: center; justify-content: center;
	color: var(--bleu); background: #f4f8fc;
	transition: transform .16s var(--ressort), background .2s;
}
.mq-icon-btn svg { width: 19px; height: 19px; stroke-width: 2.6; }
.mq-icon-btn:active { transform: scale(.9); }
.mq-coffre { color: var(--or-2); }
.mq-coffre.is-pret::after {
	content: ""; position: absolute; top: 0; right: 0; width: 11px; height: 11px; border-radius: 50%;
	background: var(--rouge); border: 2px solid #fff;
	animation: mq-badge 1.6s var(--ease) infinite;
}
@keyframes mq-badge { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.25); } }

/* ---------- Titres ---------- */
.mq-eyebrow { font-size: .68rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: var(--turq-2); margin: 0; }
.mq-title { font-size: clamp(1.15rem, 3.4vmin, 1.9rem); font-weight: 900; letter-spacing: -.035em; margin: 2px 0 0; }
.mq-lede { color: var(--encre-2); margin: 3px 0 0; font-size: .84rem; font-weight: 700; }

/* =========================================================================
   BOUTONS
   ========================================================================= */
.mq-btn {
	position: relative; overflow: hidden;
	display: inline-flex; align-items: center; justify-content: center; gap: 9px;
	padding: 12px 20px; border-radius: var(--r-pill);
	font-weight: 900; letter-spacing: -.01em; min-height: 46px;
	color: var(--encre); background: var(--blanc); box-shadow: var(--ombre);
	transition: transform .14s var(--ease), box-shadow .2s var(--ease);
}
.mq-btn svg { width: 19px; height: 19px; stroke-width: 2.6; flex: 0 0 auto; }
.mq-btn:active { transform: translateY(2px) scale(.98); }
.mq-btn[disabled] { opacity: .45; pointer-events: none; }
.mq-shell .mq-btn-primary {
	color: #fff;
	background-color: #2287dd;
	background-image: linear-gradient(105deg, #16c4ce 0%, #2e86e0 100%);
	box-shadow: 0 4px 0 #1f6ac0, 0 8px 18px rgba(31, 106, 192, .3);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .16);
}
.mq-shell[data-skin="ambre"] .mq-btn-primary { background-color:#f2711c; background-image:linear-gradient(105deg,#ff9d3d,#f2711c); box-shadow:0 4px 0 #c9550c, 0 8px 18px rgba(201,85,12,.3); }
.mq-shell[data-skin="nuit"] .mq-btn-primary { background-color:#3d4aa8; background-image:linear-gradient(105deg,#6d7fd6,#3d4aa8); box-shadow:0 4px 0 #2a3480, 0 8px 18px rgba(42,52,128,.3); }
.mq-shell .mq-btn-primary::after {
	content: ""; position: absolute; left: 3px; right: 3px; top: 3px; height: 40%;
	border-radius: var(--r-pill);
	background: linear-gradient(180deg, rgba(255, 255, 255, .34), transparent);
	pointer-events: none;
}
.mq-shell .mq-btn-primary:active { transform: translateY(3px); box-shadow: 0 1px 0 #1f6ac0; }
.mq-btn-vert { color: #fff; background: linear-gradient(105deg, #5fd94f, var(--vert-2)); box-shadow: 0 4px 0 #237a1a, 0 8px 18px rgba(46, 158, 35, .3); }
.mq-btn-vert:active { transform: translateY(3px); box-shadow: 0 1px 0 #237a1a; }
.mq-btn-ghost { background: rgba(255, 255, 255, .8); color: var(--encre-2); box-shadow: none; }

.mq-play {
	width: min(78%, 560px); min-height: clamp(58px, 8.8vmin, 82px); margin-inline: auto;
	font-size: clamp(1.25rem, 4.5vmin, 2rem); letter-spacing: .045em; gap: 14px;
	flex: 0 0 auto;
}
.mq-play svg { width: 1.05em; height: 1.05em; fill: currentColor; stroke: none; }
.mq-play span { position: relative; z-index: 1; }

/* =========================================================================
   PLAQUES ET TUILES
   ========================================================================= */
.mq-pick {
	display: flex; align-items: center; gap: 12px; text-align: left;
	padding: 11px 13px; border-radius: var(--r-l);
	background: var(--blanc); box-shadow: var(--ombre);
	transition: transform .18s var(--ressort), box-shadow .22s;
}
.mq-pick:active { transform: scale(.98); }
.mq-pick-icon { width: 42px; height: 42px; border-radius: 14px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; background: var(--past-ciel); color: var(--bleu); }
.mq-pick-icon svg { width: 22px; height: 22px; stroke-width: 2.4; }
.mq-pick > span:nth-child(2) { flex: 1 1 auto; min-width: 0; }
.mq-pick strong { display: block; font-weight: 900; color: var(--encre); }
.mq-pick small { display: block; color: var(--encre-2); font-size: .78rem; font-weight: 700; }
.mq-pick > svg:last-child { width: 17px; height: 17px; flex: 0 0 auto; color: var(--encre-3); stroke-width: 3; }

@keyframes mq-tuile-entree { to { transform: none; opacity: 1; } }

 
 
 
 
 
 

/* Rail de catégories */
.mq-panneau {
	padding: 8px; border-radius: var(--r-xl);
	background: rgba(255, 255, 255, .74); box-shadow: var(--ombre);
	min-height: 0; overflow: hidden;
}
.mq-rail { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; min-height: 0; }
.mq-rail::-webkit-scrollbar { display: none; }
.mq-vignette {
	flex: 0 0 auto; width: clamp(62px, 13vmin, 92px);
	display: flex; flex-direction: column; gap: 4px; min-height: 0;
	transition: transform .18s var(--ressort);
}
.mq-vignette:active { transform: scale(.95); }
.mq-vignette figure {
	margin: 0; flex: 0 0 auto; height: clamp(54px, 11vmin, 84px);
	border-radius: var(--r-m); overflow: hidden; padding: 6px;
	display: flex; align-items: center; justify-content: center;
	background: linear-gradient(165deg, #f2fbff, #dff0fa);
	border: 2px solid #fff; box-shadow: var(--ombre);
}
.mq-vignette figure img { width: 100%; height: 100%; object-fit: contain; }
.mq-vignette strong {
	flex: 0 0 auto; text-align: center; font-size: .7rem; font-weight: 900; color: var(--encre);
	background: #fff; border-radius: var(--r-s); padding: 4px 3px; box-shadow: var(--ombre);
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* =========================================================================
   PARCOURS RAPIDE 6.3.1 — reproduction fidèle des maquettes validées
   ========================================================================= */
.mq-view[data-view="miseEnPlace"] {
	gap: clamp(8px, 1.15vh, 12px);
	overflow: hidden;
	isolation: isolate;
}
.mq-view[data-view="miseEnPlace"]::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		radial-gradient(circle at 88% 20%, rgba(255,255,255,.32), transparent 24%),
		linear-gradient(155deg, transparent 0 32%, rgba(255,255,255,.13) 32.5% 33%, transparent 33.5% 100%);
}
.mq-setup-head {
	position: relative;
	display: grid;
	grid-template-columns: clamp(48px, 12.5vw, 58px) minmax(0,1fr);
	grid-template-areas: "back copy" "steps steps";
	align-items: end;
	column-gap: clamp(9px, 2.8vw, 15px);
	row-gap: clamp(8px, 1.25vh, 13px);
	padding: clamp(5px, .9vh, 9px) clamp(4px, 1vw, 8px) 0;
	flex: 0 0 clamp(126px, 17.2vh, 158px);
	min-height: 0;
}
.mq-setup-back {
	grid-area: back;
	align-self: start;
	width: clamp(45px, 12vw, 57px);
	height: clamp(45px, 12vw, 57px);
	border-radius: clamp(14px, 4vw, 19px);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #153c7a;
	background: rgba(255,255,255,.90);
	border: 1px solid rgba(255,255,255,.95);
	box-shadow: inset 0 2px 2px rgba(255,255,255,.9), 0 8px 20px rgba(21,60,122,.14);
	transition: transform .17s var(--ressort), box-shadow .2s var(--ease);
}
.mq-setup-back:active { transform: scale(.92); box-shadow: 0 3px 9px rgba(21,60,122,.12); }
.mq-setup-back svg { width: 52%; height: 52%; stroke-width: 2.9; }
.mq-setup-copy { grid-area: copy; min-width: 0; align-self: end; padding-bottom: 1px; }
.mq-setup-copy .mq-eyebrow {
	margin: 0 0 clamp(5px,.7vh,8px);
	font-size: clamp(.78rem, 3.2vw, .98rem);
	font-weight: 950;
	letter-spacing: .16em;
	line-height: 1;
	color: #0fa3b4;
}
.mq-setup-copy .mq-title {
	margin: 0;
	font-size: clamp(1.75rem, 7.3vw, 2.35rem);
	line-height: .98;
	font-weight: 950;
	letter-spacing: -.055em;
	color: #153c7a;
	text-wrap: balance;
}
.mq-setup-steps {
	grid-area: steps;
	display: flex;
	align-items: center;
	gap: clamp(8px, 2.3vw, 14px);
	padding-left: clamp(4px, 1vw, 8px);
}
.mq-setup-steps i {
	width: clamp(36px, 11vw, 58px);
	height: clamp(5px, .72vh, 7px);
	border-radius: 999px;
	background: rgba(46,134,224,.18);
	box-shadow: inset 0 1px 2px rgba(21,60,122,.08);
	transition: background .25s var(--ease), transform .25s var(--ressort);
}
.mq-setup-steps i.is-on {
	background: linear-gradient(100deg,#16c4ce,#2e86e0);
	box-shadow: 0 2px 8px rgba(22,196,206,.28);
}
.mq-setup-grid {
	display: grid;
	min-height: 0;
	overflow: hidden;
	gap: clamp(9px, 1.35vh, 13px);
	align-content: center;
}
.mq-carreau {
	position: relative;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	border-radius: clamp(23px, 6.8vw, 31px);
	background: linear-gradient(145deg,rgba(255,255,255,.96),rgba(246,252,255,.88));
	border: 2px solid rgba(255,255,255,.98);
	box-shadow: inset 0 2px 2px rgba(255,255,255,.95), 0 9px 22px rgba(21,60,122,.13), 0 2px 4px rgba(21,60,122,.05);
	transition: transform .18s var(--ressort), box-shadow .24s var(--ease), border-color .2s var(--ease);
}
.mq-carreau::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: radial-gradient(circle at 16% 2%,rgba(255,255,255,.98),transparent 45%);
	opacity: .75;
}
.mq-carreau:active { transform: scale(.982); }
.mq-carreau[aria-checked="true"] {
	border-color: #16c4ce;
	box-shadow: inset 0 2px 2px #fff, 0 0 0 2px rgba(22,196,206,.23), 0 12px 27px rgba(15,163,180,.22);
}
.mq-carreau[aria-checked="true"]::after {
	content: "";
	position: absolute;
	top: clamp(8px,1.3vh,12px);
	right: clamp(8px,2.2vw,12px);
	width: clamp(38px,10.8vw,52px);
	aspect-ratio: 1;
	border-radius: 50%;
	z-index: 8;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E"),
		radial-gradient(circle at 34% 24%,#66eadc 0%,#16c4ce 48%,#0b9caf 100%);
	background-size: 56% 56%,100% 100%;
	background-position: center;
	background-repeat: no-repeat;
	border: 3px solid #fff;
	box-shadow: 0 7px 15px rgba(15,163,180,.36),0 0 0 3px rgba(22,196,206,.16);
	animation: mq-tampon .34s var(--ressort);
}
@keyframes mq-tampon { from { transform: scale(0) rotate(-28deg); } }
.mq-carreau strong { color:#153c7a; font-weight:950; line-height:1.04; }
.mq-carreau small { color:#55719c; font-weight:850; line-height:1.08; }
.mq-carreau .mq-price { display:inline-flex;align-items:center;justify-content:center;gap:4px;color:#d99424;font-weight:950; }
.mq-carreau .mq-price svg { width:14px;height:14px;stroke-width:2.4; }

/* Étape 1 — proportions identiques à la maquette Comment jouer. */
.mq-setup-grid.is-experience {
	grid-template-columns: 1fr;
	grid-template-rows: repeat(3,clamp(104px,14.5vh,132px));
	align-content: center;
}

.mq-carreau-ico { width:clamp(58px,15vw,78px);aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#2e86e0;background:linear-gradient(145deg,#fff,#e5f3ff);box-shadow:inset 0 2px 2px #fff,0 7px 16px rgba(21,60,122,.13); }
.mq-carreau-ico svg { width:52%;height:52%;stroke-width:2.35; }

/* Étape 3 — dix formats. */
.mq-setup-grid.is-format { grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));align-content:stretch; }
.mq-format-card { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(4px,.6vh,7px);padding:clamp(6px,.9vh,10px) 4px; }
.mq-format-card strong { font-size:clamp(.92rem,3.85vw,1.24rem); }
.mq-format-card small { font-size:clamp(.66rem,2.65vw,.86rem);white-space:nowrap; }
.mq-mini-grille { display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(3px,.75vw,4px);padding:clamp(8px,2.4vw,11px);border-radius:clamp(13px,4vw,17px);background:linear-gradient(145deg,rgba(255,255,255,.99),#e7f5fd);box-shadow:inset 0 2px 2px #fff,0 5px 12px rgba(21,60,122,.10); }
.mq-mini-grille i { width:clamp(7px,2.2vw,10px);aspect-ratio:1;border-radius:3px;background:linear-gradient(145deg,#35d8d3,#159ebd);box-shadow:inset 0 1px 0 rgba(255,255,255,.5); }

.mq-setup-foot { padding:0 3px 4px;flex:0 0 auto; }
.mq-setup-foot .mq-btn { width:100%;min-height:clamp(57px,7.6vh,68px);font-size:clamp(1.12rem,4.5vw,1.45rem);box-shadow:0 5px 0 #1f6ac0,0 12px 25px rgba(31,106,192,.31),inset 0 2px 0 rgba(255,255,255,.48); }
.mq-setup-foot .mq-btn::before { content:"";position:absolute;left:4%;right:48%;top:5%;height:44%;border-radius:99px;background:radial-gradient(ellipse at top,rgba(255,255,255,.38),transparent 70%);pointer-events:none; }
.mq-setup-foot .mq-btn svg { width:24px;height:24px;stroke-width:3.1; }

@media (max-width:480px), (max-height:700px) {
	.mq-setup-head { flex-basis:112px;row-gap:5px;padding-top:1px; }
	.mq-setup-copy .mq-eyebrow { margin-bottom:3px;font-size:.7rem; }
	.mq-setup-copy .mq-title { font-size:1.55rem; }
	.mq-setup-grid { gap:7px; }
	.mq-setup-grid.is-experience { grid-template-rows:repeat(3,minmax(86px,1fr)); }
	
	
	
	
	
	
	
	
	.mq-format-card { gap:1px;padding:3px; }
	.mq-mini-grille { padding:5px;gap:2px; }
	
	.mq-setup-foot .mq-btn { min-height:48px;font-size:1rem; }
}
@media (max-width:350px) {
	.mq-setup-head { grid-template-columns:42px minmax(0,1fr);column-gap:8px; }
	.mq-setup-copy .mq-title { font-size:1.6rem; }
	
	
	
	
}

/* Aperçu d'habillage dans la boutique */
.mq-skin-apercu {
	position: relative; overflow: hidden; flex: 0 0 auto;
	width: 40px; height: 52px; border-radius: 11px; border: 3px solid #fff;
	background: linear-gradient(168deg, var(--a, #62e0da), var(--b, #2e86e0));
	box-shadow: var(--ombre);
}
.mq-skin-apercu::before {
	content: ""; position: absolute; inset: 0;
	background: no-repeat center / 48% auto
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2.4c.4 0 .8.25 1 .63l2.5 5.06 5.6.82c.9.13 1.26 1.24.6 1.87l-4.05 3.94.96 5.57c.15.9-.8 1.58-1.6 1.15L12 18.82l-5 2.63c-.8.43-1.75-.25-1.6-1.15l.96-5.57-4.05-3.94c-.66-.63-.3-1.74.6-1.87l5.6-.82L11 3.03c.2-.38.6-.63 1-.63Z'/%3E%3C/svg%3E");
}

/* ---------- Options ---------- */
.mq-options { display: grid; gap: 9px; align-content: start; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); padding: 2px 2px 6px; }
.mq-options.is-wide { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.mq-options.is-tight { grid-template-columns: repeat(auto-fill, minmax(94px, 1fr)); }

.mq-opt {
	position: relative;
	display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center;
	padding: 10px 8px; border-radius: var(--r-l);
	background: var(--blanc); box-shadow: var(--ombre); border: 2px solid transparent;
	transition: transform .18s var(--ressort), box-shadow .22s, border-color .2s;
}
.mq-opt:active { transform: scale(.97); }
.mq-opt strong { font-weight: 900; font-size: .88rem; color: var(--encre); }
.mq-opt small { color: var(--encre-2); font-size: .74rem; font-weight: 700; }
.mq-opt figure {
	margin: 0; width: 100%; height: clamp(58px, 12vmin, 92px);
	border-radius: var(--r-m); padding: 6px; overflow: hidden;
	display: flex; align-items: center; justify-content: center;
	background: linear-gradient(165deg, #f2fbff, #ddeffa);
}
.mq-opt figure img { width: 100%; height: 100%; object-fit: contain; }
.mq-opt[aria-checked="true"], .mq-opt.is-on { border-color: var(--turq); box-shadow: 0 0 0 3px rgba(22, 196, 206, .16), var(--ombre-forte); }
.mq-opt[aria-checked="true"]::after, .mq-opt.is-on::after {
	content: ""; position: absolute; top: -8px; right: -8px; width: 25px; height: 25px; border-radius: 50%;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E"),
		linear-gradient(150deg, #35d9c4, var(--turq-2));
	background-size: 62% 62%, 100% 100%; background-position: center; background-repeat: no-repeat;
	border: 2px solid #fff; box-shadow: 0 2px 6px rgba(15, 163, 180, .4);
	animation: mq-tampon .3s var(--ressort);
}
@keyframes mq-tampon { from { transform: scale(0) rotate(-45deg); } }
.mq-opt.is-locked { filter: saturate(.55); }
.mq-opt .mq-price { display: inline-flex; align-items: center; gap: 4px; color: var(--or-2); font-weight: 900; font-size: .78rem; font-variant-numeric: tabular-nums; }
.mq-opt .mq-price svg { width: 13px; height: 13px; }
.mq-opt .mq-ready { color: var(--turq-2); font-weight: 900; font-size: .76rem; }
.mq-opt .mq-ready svg { width: 12px; height: 12px; vertical-align: -2px; }

.mq-scroll { overflow-y: auto; min-height: 0; overscroll-behavior: contain; scrollbar-width: thin; }
.mq-scroll::-webkit-scrollbar { width: 5px; }
.mq-scroll::-webkit-scrollbar-thumb { background: rgba(21, 60, 122, .18); border-radius: 99px; }

.mq-foot { display: flex; align-items: center; gap: 9px; }
.mq-foot .mq-btn { flex: 1 1 auto; }

/* =========================================================================
   ACCUEIL
   ========================================================================= */
.mq-view[data-view="accueil"] { gap: clamp(8px, 1.5vmin, 15px); }
.mq-logo { display: flex; flex-direction: column; align-items: center; gap: 2px; min-height: 0; overflow: visible; }
.mq-demo {
	position: relative; flex: 0 1 auto; height: clamp(82px, 16.5vmin, 154px); min-height: 0;
	display: flex; align-items: center; justify-content: center;
	filter: drop-shadow(0 12px 18px rgba(21,60,122,.22));
}
.mq-demo::before, .mq-demo::after {
	content: "✦"; position: absolute; color: rgba(255,255,255,.9); font-size: clamp(12px,2.1vmin,20px);
	animation: mq-etincelle 2.8s var(--ease) infinite;
}
.mq-demo::before { left: -24%; top: 26%; }
.mq-demo::after { right: -25%; bottom: 24%; animation-delay: 1.2s; }
@keyframes mq-etincelle { 0%,100% { opacity:.2; transform:scale(.65) rotate(0); } 50% { opacity:1; transform:scale(1.18) rotate(35deg); } }
.mq-demo-card {
	height: 100%; aspect-ratio: 3 / 4; border-radius: clamp(16px, 2.8vmin, 24px); position: relative;
	transform-origin: 50% 86%; will-change: transform;
}
.mq-demo-card.is-left { transform: rotate(-10deg) translateX(14%); animation: mq-flotte-a 3.2s var(--ease) infinite alternate; }
.mq-demo-card.is-right { transform: rotate(9deg) translateX(-14%); animation: mq-flotte-b 3.55s var(--ease) infinite alternate; z-index: 2; }
@keyframes mq-flotte-a { to { transform: rotate(-12deg) translate(14%, -6%) scale(1.015); } }
@keyframes mq-flotte-b { to { transform: rotate(11deg) translate(-14%, -5%) scale(1.02); } }
.mq-demo-face {
	position: absolute; inset: 0; border-radius: inherit; display: flex; align-items: center; justify-content: center; overflow: hidden;
	border: clamp(3px,.55vmin,5px) solid #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.65), inset 0 -12px 18px rgba(21,60,122,.12);
}
.mq-demo-face::after { content:""; position:absolute; inset:-35% 42% -35% -20%; transform:rotate(18deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent); animation:mq-demo-brille 3.8s var(--ease) infinite; }
@keyframes mq-demo-brille { 0%,28% { transform:translateX(-170%) rotate(18deg); } 62%,100% { transform:translateX(250%) rotate(18deg); } }
.mq-demo-face.is-a { background: linear-gradient(165deg, #42ddd6, #12a9b8); }
.mq-demo-face.is-b { background: linear-gradient(165deg, #ff7c6c, #ef4f3f); }
.mq-demo-face svg { width: 46%; height: 46%; fill: #fff; stroke: none; filter:drop-shadow(0 3px 3px rgba(21,60,122,.18)); }
.mq-demo-seal {
	position: absolute; left: 50%; top: 58%; width: clamp(38px, 6.2vmin, 58px); aspect-ratio: 1;
	transform: translate(-50%, -50%); border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: radial-gradient(circle at 36% 28%, #a8ff83, #58d845 48%, #2e9e23); color: #0a5422; opacity: 0; z-index: 3;
	box-shadow: 0 0 0 5px rgba(76,201,63,.18), 0 9px 16px rgba(21,60,122,.25), inset 0 2px 1px rgba(255,255,255,.5);
	animation: mq-seal 4.4s var(--ease) infinite;
}
.mq-demo-seal svg { width: 54%; height: 54%; stroke-width: 3.4; }
@keyframes mq-seal {
	0%, 48% { opacity: 0; transform: translate(-50%, -50%) scale(1.8) rotate(-12deg); }
	58% { opacity: 1; transform: translate(-50%, -50%) scale(.82) rotate(5deg); }
	66%, 83% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0); }
	94%, 100% { opacity: 0; transform: translate(-50%, -58%) scale(.9); }
}
.mq-wordmark { font-size: clamp(2.15rem, 8.8vmin, 4rem); font-weight: 900; letter-spacing: -.055em; line-height: 1; margin: 3px 0 0; white-space: nowrap; }
.mq-wordmark span { color: var(--turq); }
.mq-wordmark b { color: #153c7a; }

/* =========================================================================
   ENTRÉE PREMIUM V2 — composition dynamique, stable et partagée
   ========================================================================= */
.mq-shell.is-app-intro-active .mq-app { opacity:0;visibility:hidden; }
.mq-shell:not(.is-app-intro-active) .mq-app { opacity:1;visibility:visible;transition:opacity .34s ease; }

.mq-app-intro,
.mq-entry-intro {
	--cinematic-charge:0;
	--cinematic-card-w:clamp(112px,34vw,178px);
	--cinematic-card-half:calc(var(--cinematic-card-w) / 2);
	--cinematic-gap:clamp(6px,1.8vw,12px);
	--intro-background:
		radial-gradient(circle at 50% 18%,rgba(255,255,255,.82) 0%,rgba(91,211,236,.36) 28%,transparent 54%),
		linear-gradient(180deg,#55c6ec 0%,#8cddf5 29%,#dff4f6 61%,#f5e4c5 100%);
	--intro-particles:
		radial-gradient(circle at 15% 17%,rgba(255,255,255,.78) 0 1px,transparent 1.8px),
		radial-gradient(circle at 82% 13%,rgba(25,143,190,.42) 0 1.2px,transparent 2px),
		radial-gradient(circle at 73% 64%,rgba(255,255,255,.44) 0 1px,transparent 1.8px),
		radial-gradient(circle at 23% 72%,rgba(19,158,184,.30) 0 1px,transparent 1.9px),
		radial-gradient(circle at 51% 81%,rgba(255,255,255,.34) 0 1px,transparent 1.8px);
	--intro-halo:radial-gradient(circle,rgba(255,255,255,.62) 0%,rgba(31,190,209,.21) 34%,transparent 68%);
	--intro-text:#123f69;
	--intro-loading-text:#123f69;
	--intro-muted:#315f80;
	--intro-logo-memo:#08aebd;
	--intro-logo-quest:#143f75;
	--intro-accent:#13bfca;
	--intro-accent-soft:rgba(19,191,202,.22);
	--intro-accent-faint:rgba(46,134,224,.12);
	--intro-accent-2:#2e86e0;
	--intro-line:#20becb;
	--intro-border:#ffffff;
	--intro-card-back:linear-gradient(145deg,#19c4ce 0%,#2f8de4 100%);
	--intro-card-front:#10385d;
	--intro-label-bg:rgba(4,27,48,.72);
	--intro-label-text:#ffffff;
	--intro-universe-bg:#eaf8fb;
	--intro-universe-border:rgba(19,109,150,.24);
	--intro-universe-opacity:.26;
	--intro-universe-active-opacity:.46;
	--intro-universe-filter:saturate(.86) brightness(.94);
	--intro-universe-active-filter:saturate(1) brightness(1);
	--intro-universe-overlay:linear-gradient(180deg,rgba(255,255,255,.04),rgba(5,42,65,.58));
	--intro-universe-caption:rgba(248,253,255,.94);
	--intro-track-bg:rgba(255,255,255,.58);
	--intro-track-border:rgba(15,166,190,.82);
	--intro-progress:linear-gradient(90deg,#0fb8c5 0%,#31d7df 48%,#2f8ee1 100%);
	--intro-progress-glow:rgba(26,184,209,.44);
	--intro-version:#315f80;
	--intro-version-strong:#087fa2;
	--intro-shadow:rgba(4,44,73,.26);
	--intro-logo-font:ui-rounded,"SF Pro Rounded","Segoe UI Variable Display","Trebuchet MS",system-ui,sans-serif;
	--intro-copy-font:ui-rounded,"SF Pro Rounded","Segoe UI Variable Text",system-ui,sans-serif;
	--intro-logo-weight:950;
	--intro-logo-spacing:-.045em;
	--intro-copy-weight:760;
	position:absolute;inset:0;z-index:1000;overflow:hidden;isolation:isolate;
	display:block;pointer-events:auto;opacity:0;color:var(--intro-text);
	font-family:var(--intro-copy-font);
	background:var(--intro-background);
	transition:opacity .34s ease;contain:layout paint style;
}
.mq-entry-intro { z-index:900; }

/* Habillages de l'entrée : un seul moteur de mouvement, six directions artistiques isolées. */
.mq-shell[data-skin="jade"] .mq-app-intro,
.mq-shell[data-skin="jade"] .mq-entry-intro {
	color-scheme:light;
}
.mq-shell[data-skin="ocean"] .mq-app-intro,
.mq-shell[data-skin="ocean"] .mq-entry-intro {
	--intro-background:
		radial-gradient(circle at 50% -5%,rgba(216,255,255,.74) 0%,rgba(58,206,225,.28) 24%,transparent 48%),
		linear-gradient(180deg,#1fb8d1 0%,#087b9f 34%,#075273 67%,#032f4c 100%);
	--intro-particles:
		radial-gradient(circle at 17% 18%,rgba(224,255,255,.74) 0 1px,transparent 2px),
		radial-gradient(circle at 79% 12%,rgba(206,252,255,.64) 0 1.4px,transparent 2.2px),
		radial-gradient(circle at 70% 58%,rgba(89,231,235,.42) 0 1px,transparent 2px),
		radial-gradient(circle at 25% 72%,rgba(206,252,255,.34) 0 1.2px,transparent 2px);
	--intro-halo:radial-gradient(circle,rgba(230,255,255,.48) 0%,rgba(44,224,225,.20) 31%,rgba(21,111,171,.10) 52%,transparent 70%);
	--intro-text:#f5fdff;--intro-loading-text:#f5fdff;--intro-muted:#c4edf3;--intro-logo-memo:#66f2f0;--intro-logo-quest:#ffffff;
	--intro-accent:#52e9e6;--intro-accent-soft:rgba(82,233,230,.22);--intro-accent-faint:rgba(79,169,243,.12);--intro-accent-2:#4fa9f3;--intro-line:#70f2ef;--intro-border:#eaffff;
	--intro-card-back:linear-gradient(145deg,#22d7d7 0%,#1477be 100%);--intro-card-front:#063653;
	--intro-label-bg:rgba(1,26,42,.76);--intro-universe-bg:#063c5b;--intro-universe-border:rgba(153,248,250,.22);
	--intro-universe-opacity:.19;--intro-universe-active-opacity:.34;--intro-universe-filter:saturate(.8) brightness(.74);
	--intro-universe-active-filter:saturate(1) brightness(.9);--intro-universe-overlay:linear-gradient(180deg,rgba(0,23,40,.04),rgba(0,24,42,.76));
	--intro-universe-caption:rgba(225,251,255,.88);--intro-track-bg:rgba(1,28,48,.66);--intro-track-border:rgba(112,242,239,.78);
	--intro-progress:linear-gradient(90deg,#17a8d1 0%,#42e4e1 52%,#bafcff 100%);--intro-progress-glow:rgba(62,228,226,.52);
	--intro-version:#c4edf3;--intro-version-strong:#69f2ef;--intro-shadow:rgba(0,22,41,.44);
	--intro-logo-font:"Avenir Next","Segoe UI Variable Display","Helvetica Neue",system-ui,sans-serif;
}
.mq-shell[data-skin="grenat"] .mq-app-intro,
.mq-shell[data-skin="grenat"] .mq-entry-intro {
	--intro-background:
		radial-gradient(circle at 50% 19%,rgba(255,237,216,.22) 0%,rgba(178,67,91,.18) 29%,transparent 56%),
		linear-gradient(180deg,#3a0c18 0%,#66182d 34%,#3d0d1c 69%,#1c0810 100%);
	--intro-particles:
		radial-gradient(circle at 16% 15%,rgba(255,226,194,.70) 0 1px,transparent 2px),
		radial-gradient(circle at 82% 17%,rgba(244,189,166,.52) 0 1.2px,transparent 2px),
		radial-gradient(circle at 72% 66%,rgba(255,238,218,.26) 0 1px,transparent 1.8px),
		radial-gradient(circle at 22% 74%,rgba(206,101,119,.34) 0 1px,transparent 2px);
	--intro-halo:radial-gradient(circle,rgba(255,242,219,.30) 0%,rgba(202,81,105,.18) 30%,rgba(96,19,40,.10) 52%,transparent 70%);
	--intro-text:#fff5e9;--intro-loading-text:#fff5e9;--intro-muted:#e8c7bb;--intro-logo-memo:#d39b72;--intro-logo-quest:#fff7ec;
	--intro-accent:#c34f69;--intro-accent-soft:rgba(195,79,105,.22);--intro-accent-faint:rgba(141,38,63,.12);--intro-accent-2:#8d263f;--intro-line:#e0aa82;--intro-border:#fff1df;
	--intro-card-back:linear-gradient(145deg,#b84460 0%,#68172e 100%);--intro-card-front:#35101c;
	--intro-label-bg:rgba(35,5,14,.78);--intro-universe-bg:#35101c;--intro-universe-border:rgba(248,210,177,.20);
	--intro-universe-opacity:.18;--intro-universe-active-opacity:.33;--intro-universe-filter:saturate(.72) brightness(.70);
	--intro-universe-active-filter:saturate(.94) brightness(.88);--intro-universe-overlay:linear-gradient(180deg,rgba(37,4,12,.02),rgba(30,4,11,.78));
	--intro-universe-caption:rgba(255,239,224,.88);--intro-track-bg:rgba(29,5,12,.74);--intro-track-border:rgba(224,170,130,.78);
	--intro-progress:linear-gradient(90deg,#84213a 0%,#c75670 52%,#e4b180 100%);--intro-progress-glow:rgba(205,88,111,.46);
	--intro-version:#e3c0b4;--intro-version-strong:#e5ae82;--intro-shadow:rgba(25,2,8,.50);
	--intro-logo-font:ui-serif,Georgia,"Times New Roman",serif;--intro-copy-font:"Avenir Next","Segoe UI Variable Text",system-ui,sans-serif;
	--intro-logo-weight:800;--intro-logo-spacing:-.035em;--intro-copy-weight:680;
}
.mq-shell[data-skin="ardoise"] .mq-app-intro,
.mq-shell[data-skin="ardoise"] .mq-entry-intro {
	--intro-background:
		radial-gradient(circle at 50% 21%,rgba(142,232,255,.16) 0%,rgba(67,93,119,.12) 30%,transparent 56%),
		linear-gradient(180deg,#15242e 0%,#1d2c36 36%,#111b22 70%,#091016 100%);
	--intro-particles:
		radial-gradient(circle at 13% 16%,rgba(220,245,255,.54) 0 1px,transparent 2px),
		radial-gradient(circle at 84% 13%,rgba(126,225,244,.46) 0 1.2px,transparent 2px),
		radial-gradient(circle at 73% 64%,rgba(195,225,236,.25) 0 1px,transparent 1.8px),
		radial-gradient(circle at 24% 75%,rgba(100,198,218,.28) 0 1px,transparent 2px);
	--intro-halo:radial-gradient(circle,rgba(224,249,255,.31) 0%,rgba(95,213,234,.16) 31%,rgba(58,89,112,.10) 52%,transparent 70%);
	--intro-text:#f3f8fb;--intro-loading-text:#f3f8fb;--intro-muted:#bdcbd3;--intro-logo-memo:#7ee8f4;--intro-logo-quest:#f7fbfd;
	--intro-accent:#73ddea;--intro-accent-soft:rgba(115,221,234,.22);--intro-accent-faint:rgba(79,143,172,.12);--intro-accent-2:#4f8fac;--intro-line:#83e6f1;--intro-border:#dce9ee;
	--intro-card-back:linear-gradient(145deg,#344b59 0%,#15252f 100%);--intro-card-front:#111e27;
	--intro-label-bg:rgba(5,15,21,.78);--intro-universe-bg:#15252e;--intro-universe-border:rgba(180,215,228,.18);
	--intro-universe-opacity:.17;--intro-universe-active-opacity:.31;--intro-universe-filter:saturate(.58) brightness(.68);
	--intro-universe-active-filter:saturate(.78) brightness(.84);--intro-universe-overlay:linear-gradient(180deg,rgba(5,16,23,.03),rgba(6,17,23,.78));
	--intro-universe-caption:rgba(224,238,244,.86);--intro-track-bg:rgba(5,14,20,.72);--intro-track-border:rgba(125,225,237,.72);
	--intro-progress:linear-gradient(90deg,#39768d 0%,#73ddea 52%,#d1f9ff 100%);--intro-progress-glow:rgba(103,219,233,.42);
	--intro-version:#b9cbd3;--intro-version-strong:#82e4ef;--intro-shadow:rgba(0,0,0,.50);
	--intro-logo-font:"Segoe UI Variable Display","Helvetica Neue",Arial,system-ui,sans-serif;--intro-copy-font:"Segoe UI Variable Text",system-ui,sans-serif;
	--intro-logo-weight:880;--intro-logo-spacing:-.04em;
}
.mq-shell[data-skin="ambre"] .mq-app-intro,
.mq-shell[data-skin="ambre"] .mq-entry-intro {
	--intro-background:
		radial-gradient(circle at 50% 18%,rgba(255,250,218,.76) 0%,rgba(255,183,70,.31) 29%,transparent 55%),
		linear-gradient(180deg,#f6a843 0%,#f5c477 31%,#ffe8bc 62%,#7a3518 100%);
	--intro-particles:
		radial-gradient(circle at 14% 16%,rgba(255,255,239,.78) 0 1px,transparent 2px),
		radial-gradient(circle at 82% 13%,rgba(255,239,187,.66) 0 1.2px,transparent 2px),
		radial-gradient(circle at 72% 64%,rgba(255,255,241,.34) 0 1px,transparent 1.8px),
		radial-gradient(circle at 23% 73%,rgba(255,188,77,.30) 0 1px,transparent 2px);
	--intro-halo:radial-gradient(circle,rgba(255,255,230,.66) 0%,rgba(255,177,60,.23) 33%,rgba(178,76,20,.10) 54%,transparent 70%);
	--intro-text:#4f2413;--intro-loading-text:#fff4df;--intro-muted:#6d3a22;--intro-logo-memo:#d75f16;--intro-logo-quest:#6a2d13;
	--intro-accent:#ed7a24;--intro-accent-soft:rgba(237,122,36,.22);--intro-accent-faint:rgba(189,78,18,.12);--intro-accent-2:#bd4e12;--intro-line:#f9b94d;--intro-border:#fff7df;
	--intro-card-back:linear-gradient(145deg,#ffad3e 0%,#d45d18 100%);--intro-card-front:#502411;
	--intro-label-bg:rgba(60,24,8,.74);--intro-universe-bg:#7a3518;--intro-universe-border:rgba(255,244,211,.28);
	--intro-universe-opacity:.19;--intro-universe-active-opacity:.36;--intro-universe-filter:saturate(.76) brightness(.76);
	--intro-universe-active-filter:saturate(.98) brightness(.92);--intro-universe-overlay:linear-gradient(180deg,rgba(91,35,9,.03),rgba(76,27,7,.68));
	--intro-universe-caption:rgba(255,248,225,.92);--intro-track-bg:rgba(255,248,225,.52);--intro-track-border:rgba(179,75,15,.70);
	--intro-progress:linear-gradient(90deg,#d85f17 0%,#ffa934 52%,#fff0a6 100%);--intro-progress-glow:rgba(237,123,35,.44);
	--intro-version:#f6ddc1;--intro-version-strong:#ffd47a;--intro-shadow:rgba(83,32,8,.32);
	--intro-logo-font:"Trebuchet MS","Avenir Next","Segoe UI Variable Display",system-ui,sans-serif;--intro-copy-font:"Avenir Next","Segoe UI Variable Text",system-ui,sans-serif;
	--intro-logo-weight:900;--intro-logo-spacing:-.04em;--intro-copy-weight:720;
}
.mq-shell[data-skin="nuit"] .mq-app-intro,
.mq-shell[data-skin="nuit"] .mq-entry-intro {
	--intro-background:
		radial-gradient(circle at 50% 18%,rgba(142,218,255,.15) 0%,rgba(82,99,201,.10) 29%,transparent 56%),
		linear-gradient(180deg,#060b16 0%,#0b1427 36%,#101b35 68%,#050912 100%);
	--intro-particles:
		radial-gradient(circle at 12% 15%,rgba(255,255,255,.78) 0 1px,transparent 2px),
		radial-gradient(circle at 84% 12%,rgba(151,233,255,.64) 0 1.2px,transparent 2px),
		radial-gradient(circle at 72% 61%,rgba(255,255,255,.31) 0 1px,transparent 1.8px),
		radial-gradient(circle at 24% 74%,rgba(112,148,255,.34) 0 1px,transparent 2px),
		radial-gradient(circle at 52% 83%,rgba(255,255,255,.22) 0 1px,transparent 1.8px);
	--intro-halo:radial-gradient(circle,rgba(220,247,255,.27) 0%,rgba(112,230,255,.15) 31%,rgba(83,99,207,.11) 53%,transparent 70%);
	--intro-text:#f3f7ff;--intro-loading-text:#f3f7ff;--intro-muted:#b6c3dc;--intro-logo-memo:#8ceaff;--intro-logo-quest:#ffffff;
	--intro-accent:#83e7fb;--intro-accent-soft:rgba(131,231,251,.22);--intro-accent-faint:rgba(100,119,228,.12);--intro-accent-2:#6477e4;--intro-line:#8ceaff;--intro-border:#e2efff;
	--intro-card-back:linear-gradient(145deg,#263759 0%,#111a32 100%);--intro-card-front:#0d1729;
	--intro-label-bg:rgba(3,9,20,.80);--intro-universe-bg:#101a31;--intro-universe-border:rgba(177,210,255,.17);
	--intro-universe-opacity:.16;--intro-universe-active-opacity:.30;--intro-universe-filter:saturate(.66) brightness(.64);
	--intro-universe-active-filter:saturate(.88) brightness(.82);--intro-universe-overlay:linear-gradient(180deg,rgba(4,10,22,.03),rgba(3,8,18,.82));
	--intro-universe-caption:rgba(226,238,255,.84);--intro-track-bg:rgba(3,9,20,.74);--intro-track-border:rgba(139,232,255,.70);
	--intro-progress:linear-gradient(90deg,#5265d1 0%,#83e7fb 52%,#d9f8ff 100%);--intro-progress-glow:rgba(112,226,250,.46);
	--intro-version:#b5c2dc;--intro-version-strong:#8ceaff;--intro-shadow:rgba(0,0,0,.54);
	--intro-logo-font:"Segoe UI Variable Display","SF Pro Display","Helvetica Neue",system-ui,sans-serif;--intro-copy-font:"Segoe UI Variable Text",system-ui,sans-serif;
	--intro-logo-weight:900;--intro-logo-spacing:-.04em;
}
.mq-app-intro.is-visible,
.mq-entry-intro.is-visible { opacity:1; }
.mq-app-intro::before,
.mq-entry-intro::before {
	content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.8;
	background:var(--intro-particles);
}
.mq-app-intro::after,
.mq-entry-intro::after {
	content:"";position:absolute;left:50%;top:30%;width:min(84vmin,560px);aspect-ratio:1;
	transform:translate(-50%,-50%);border-radius:50%;z-index:1;pointer-events:none;
	background:var(--intro-halo);
	opacity:calc(.48 + var(--cinematic-charge) * .3);
}

.mq-cinematic-universes { position:absolute;inset:0;z-index:1;pointer-events:none; }
.mq-cinematic-universe {
	position:absolute;width:clamp(86px,25vw,138px);aspect-ratio:3/4;margin:0;border-radius:18px;overflow:hidden;
	background:var(--intro-universe-bg);border:1px solid var(--intro-universe-border);opacity:var(--intro-universe-opacity);
	box-shadow:0 12px 30px var(--intro-shadow);filter:var(--intro-universe-filter);
	transform:rotate(var(--u-rotate));transition:opacity .36s ease,filter .36s ease,box-shadow .36s ease;
}
.mq-cinematic-universe img { width:100%;height:100%;object-fit:cover;display:block; }
.mq-cinematic-universe::after { content:"";position:absolute;inset:0;background:var(--intro-universe-overlay); }
.mq-cinematic-universe figcaption {
	position:absolute;left:8px;right:8px;bottom:10px;z-index:2;color:var(--intro-universe-caption);
	font-size:clamp(.55rem,1.7vw,.78rem);font-weight:850;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.mq-cinematic-universe.is-u1 { left:-4%;top:3%;--u-rotate:-8deg; }
.mq-cinematic-universe.is-u2 { left:36%;top:1%;--u-rotate:4deg; }
.mq-cinematic-universe.is-u3 { right:-4%;top:3%;--u-rotate:8deg; }
.mq-cinematic-universe.is-u4 { left:-8%;top:40%;--u-rotate:-7deg; }
.mq-cinematic-universe.is-u5 { right:-8%;top:40%;--u-rotate:7deg; }
.mq-cinematic-universe.is-u6 { left:5%;bottom:3%;--u-rotate:-5deg; }
.mq-pair-cinematic[data-intro-category="animaux"] .mq-cinematic-universe[data-intro-universe="animaux"],
.mq-pair-cinematic[data-intro-category="insectes"] .mq-cinematic-universe[data-intro-universe="insectes"],
.mq-pair-cinematic[data-intro-category="drapeaux"] .mq-cinematic-universe[data-intro-universe="drapeaux"],
.mq-pair-cinematic[data-intro-category="culture-generale"] .mq-cinematic-universe[data-intro-universe="culture-generale"],
.mq-pair-cinematic[data-intro-category="metiers"] .mq-cinematic-universe[data-intro-universe="metiers"],
.mq-pair-cinematic[data-intro-category="fruits-legumes"] .mq-cinematic-universe[data-intro-universe="fruits-legumes"] {
	opacity:var(--intro-universe-active-opacity);filter:var(--intro-universe-active-filter);box-shadow:0 12px 34px var(--intro-shadow);
}

.mq-cinematic-aura {
	position:absolute;left:50%;top:30%;width:min(78vmin,520px);aspect-ratio:1;z-index:2;
	transform:translate(-50%,-50%) scale(.82);border-radius:50%;pointer-events:none;opacity:0;
	background:radial-gradient(circle,rgba(255,255,255,.72) 0 5%,var(--intro-accent-soft) 22%,var(--intro-accent-faint) 43%,transparent 69%);
	transition:opacity .42s ease,transform .82s cubic-bezier(.2,.78,.2,1);
}
.mq-pair-cinematic.is-magnetizing .mq-cinematic-aura { opacity:1;transform:translate(-50%,-50%) scale(1); }

.mq-cinematic-pair {
	position:absolute;left:50%;top:30%;width:min(98vw,720px);height:clamp(270px,44vh,420px);
	transform:translate(-50%,-50%);perspective:1400px;z-index:6;
}
.mq-cinematic-card {
	position:absolute;left:50%;top:50%;width:var(--cinematic-card-w);aspect-ratio:3/4;z-index:4;
	transform-origin:50% 50%;will-change:transform;backface-visibility:hidden;
	transition:transform .92s cubic-bezier(.18,.8,.2,1),filter .3s ease,opacity .3s ease;
}
.mq-pair-cinematic.is-progress-moving .mq-cinematic-card { transition:filter .3s ease,opacity .3s ease; }
.mq-cinematic-card.is-left { transform:translate3d(calc(-50% - min(62vw,390px)),-50%,0) rotate(-4deg) scale(.9); }
.mq-cinematic-card.is-right { transform:translate3d(calc(-50% + min(62vw,390px)),-50%,0) rotate(4deg) scale(.9); }
.mq-pair-cinematic.is-magnetizing .mq-cinematic-card.is-left {
	transform:translate3d(calc(-50% - var(--cinematic-card-half) - var(--cinematic-gap) / 2),-50%,0) rotate(-.7deg) scale(1);
}
.mq-pair-cinematic.is-magnetizing .mq-cinematic-card.is-right {
	transform:translate3d(calc(-50% + var(--cinematic-card-half) + var(--cinematic-gap) / 2),-50%,0) rotate(.7deg) scale(1);
}
.mq-pair-cinematic.is-confirmed .mq-cinematic-card { filter:drop-shadow(0 0 16px rgba(91,230,112,.42)); }
.mq-cinematic-card-inner {
	position:absolute;inset:0;border-radius:clamp(14px,3.6vmin,25px);transform-style:preserve-3d;-webkit-transform-style:preserve-3d;
	transition:transform .48s cubic-bezier(.26,.72,.22,1);box-shadow:0 18px 36px rgba(0,0,0,.34);will-change:transform;
}
.mq-pair-cinematic.is-open-left .mq-cinematic-card.is-left .mq-cinematic-card-inner,
.mq-pair-cinematic.is-open-right .mq-cinematic-card.is-right .mq-cinematic-card-inner { transform:rotateY(180deg); }
.mq-cinematic-face {
	position:absolute;inset:0;border-radius:inherit;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;
	border:clamp(3px,.72vmin,5px) solid var(--intro-border);
}
.mq-cinematic-back {
	transform:rotateY(0deg) translateZ(.2px);background:var(--intro-card-back);
	box-shadow:inset 0 -18px 28px rgba(12,39,79,.2),inset 0 1px 0 rgba(255,255,255,.28);
}
.mq-cinematic-back::before {
	content:"";position:absolute;inset:0;background:no-repeat center/46% auto
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 7 38.4 23.2 56 24.3 42.4 35.6 46.8 53 32 43.4 17.2 53l4.4-17.4L8 24.3l17.6-1.1L32 7Z' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linejoin='round'/%3E%3Ccircle cx='32' cy='32' r='6.5' fill='%23fff' opacity='.28'/%3E%3C/svg%3E");
	filter:drop-shadow(0 4px 8px rgba(15,43,83,.22));
}
.mq-cinematic-back::after {
	content:"";position:absolute;inset:-25% 48% -25% -35%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
	transform:translateX(-170%) rotate(15deg);
}
.mq-pair-cinematic.is-charged .mq-cinematic-back::after { animation:mq-cinematic-card-charge .82s ease-out both; }
@keyframes mq-cinematic-card-charge { to { transform:translateX(440%) rotate(15deg); } }
.mq-cinematic-front { transform:rotateY(180deg) translateZ(.2px);background:var(--intro-card-front);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); }
.mq-cinematic-front img { width:100%;height:100%;display:block;object-fit:cover;opacity:0;transition:opacity .2s ease; }
.mq-pair-cinematic.is-image-ready .mq-cinematic-front img { opacity:1; }
.mq-cinematic-card-name {
	position:absolute;left:7%;right:7%;bottom:6%;z-index:2;padding:5px 8px;border-radius:999px;
	background:var(--intro-label-bg);color:var(--intro-label-text);font-size:clamp(.64rem,2.1vmin,.9rem);font-weight:900;text-align:center;
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 2px rgba(0,0,0,.72);
}

/* La ligne de charge reste derrière les deux cartes. */
.mq-cinematic-magnet {
	position:absolute;left:50%;top:50%;width:clamp(126px,38vw,250px);height:18px;z-index:1;
	transform:translate(-50%,-50%) scaleX(.12);transform-origin:center;opacity:0;border-radius:999px;pointer-events:none;
	background:linear-gradient(90deg,transparent,var(--intro-accent-soft) 19%,rgba(255,255,255,.22) 50%,var(--intro-accent-soft) 81%,transparent);
	box-shadow:0 0 16px rgba(44,206,216,.12),0 0 32px rgba(53,105,220,.08);
	transition:transform 1.06s cubic-bezier(.2,.78,.2,1),opacity .26s ease;
}
.mq-cinematic-magnet::before {
	content:"";position:absolute;left:50%;top:50%;width:0;height:4px;border-radius:999px;transform:translate(-50%,-50%);
	background:linear-gradient(90deg,transparent,var(--intro-line) 18%,#fff 50%,var(--intro-line) 82%,transparent);
	box-shadow:0 0 12px rgba(255,255,255,.48),0 0 20px rgba(77,220,220,.32);opacity:.15;
}
.mq-pair-cinematic.is-charging .mq-cinematic-magnet,
.mq-pair-cinematic.is-magnetizing .mq-cinematic-magnet { opacity:.9;transform:translate(-50%,-50%) scaleX(1); }
.mq-pair-cinematic.is-charging .mq-cinematic-magnet::before { animation:mq-cinematic-load-in 1.08s cubic-bezier(.2,.78,.2,1) both; }
@keyframes mq-cinematic-load-in { 0%{width:0;opacity:.15} 56%{opacity:1} 100%{width:100%;opacity:.98} }
.mq-cinematic-magnet i,.mq-cinematic-magnet b { position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%); }
.mq-cinematic-magnet i { width:clamp(22px,5.8vmin,36px);aspect-ratio:1;background:#fff;box-shadow:0 0 0 8px rgba(75,225,207,.12),0 0 26px rgba(255,255,255,.72); }
.mq-cinematic-magnet b { width:clamp(8px,2.3vmin,14px);aspect-ratio:1;background:var(--intro-accent);box-shadow:0 0 12px rgba(255,255,255,.64); }
.mq-pair-cinematic.is-confirmed .mq-cinematic-magnet { opacity:0;transition:opacity .24s ease; }

/* Validation au centre exact de la paire, au-dessus des cartes. */
.mq-cinematic-success {
	position:absolute;left:50%;top:50%;z-index:8;width:clamp(50px,14vmin,82px);aspect-ratio:1;
	transform:translate(-50%,-50%) scale(.2) rotate(-18deg);opacity:0;border-radius:50%;display:flex;align-items:center;justify-content:center;
	color:#123d2b;background:radial-gradient(circle at 34% 24%,#d9ffb5 0%,#7ce95a 44%,#39b934 77%,#239424 100%);
	border:clamp(3px,.8vmin,5px) solid rgba(255,255,255,.98);
	box-shadow:0 12px 24px rgba(27,124,50,.3),0 0 30px rgba(92,238,99,.3),inset 0 -6px 9px rgba(14,105,34,.2),inset 0 4px 8px rgba(255,255,255,.48);
	transition:opacity .18s ease,transform .48s cubic-bezier(.16,.86,.22,1.16);
}
.mq-cinematic-success svg { width:58%;height:58%;stroke-width:3.4; }
.mq-pair-cinematic.is-confirmed .mq-cinematic-success { opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0);animation:mq-cinematic-check-in .58s ease-out both; }
@keyframes mq-cinematic-check-in { 55%{transform:translate(-50%,-50%) scale(1.1) rotate(1deg)} }

.mq-cinematic-brand {
	position:absolute;left:50%;top:57%;z-index:12;width:96%;transform:translateX(-50%);text-align:center;white-space:nowrap;pointer-events:none;
	font-family:var(--intro-logo-font);font-size:clamp(2.3rem,11vmin,5rem);font-weight:var(--intro-logo-weight);line-height:1;letter-spacing:var(--intro-logo-spacing);
	filter:drop-shadow(0 10px 18px var(--intro-shadow));
}
.mq-cinematic-letter { display:inline-block;opacity:0;transform:translateY(18px) scale(.9); }
.mq-cinematic-letter.is-memo { color:var(--intro-logo-memo); }
.mq-cinematic-letter.is-quest { color:var(--intro-logo-quest); }
.mq-pair-cinematic.is-branded .mq-cinematic-letter { animation:mq-cinematic-wave-in .68s cubic-bezier(.16,.86,.22,1.12) both;animation-delay:calc(var(--letter-i) * 38ms); }
@keyframes mq-cinematic-wave-in { 0%{opacity:0;transform:translateY(18px) scale(.9)} 56%{opacity:1;transform:translateY(-6px) scale(1.035)} 100%{opacity:1;transform:none} }
.mq-cinematic-caption {
	position:absolute;left:50%;top:65%;z-index:12;transform:translateX(-50%);margin:0;padding:0 clamp(42px,12vw,92px);
	max-width:96%;color:var(--intro-muted);font-family:var(--intro-copy-font);font-size:clamp(.78rem,2.5vmin,1.08rem);font-weight:var(--intro-copy-weight);letter-spacing:.01em;
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .32s ease .18s;
}
.mq-cinematic-caption::before,.mq-cinematic-caption::after { content:"";position:absolute;top:50%;width:clamp(24px,8vw,64px);height:2px;background:linear-gradient(90deg,transparent,var(--intro-line)); }
.mq-cinematic-caption::before { left:0; }
.mq-cinematic-caption::after { right:0;transform:scaleX(-1); }
.mq-pair-cinematic.is-branded .mq-cinematic-caption { opacity:1; }

.mq-cinematic-loading {
	position:absolute;left:50%;bottom:max(3.2vh,22px);z-index:12;width:min(76vw,560px);transform:translateX(-50%);
	display:grid;gap:9px;justify-items:center;color:var(--intro-text);font-family:var(--intro-copy-font);font-variant-numeric:tabular-nums;
}
.mq-cinematic-loading-label { color:var(--intro-loading-text);font-size:clamp(.72rem,2.2vmin,.98rem);font-weight:var(--intro-copy-weight);text-align:center;text-shadow:0 2px 8px var(--intro-shadow); }
.mq-cinematic-loading-track {
	position:relative;width:100%;height:clamp(15px,3.8vmin,24px);padding:3px;border-radius:999px;overflow:hidden;
	background:var(--intro-track-bg);border:1px solid var(--intro-track-border);box-shadow:0 0 18px var(--intro-progress-glow),inset 0 0 10px var(--intro-shadow);
}
.mq-cinematic-loading-track i {
	display:block;width:100%;height:100%;border-radius:inherit;transform:scaleX(var(--cinematic-charge));transform-origin:left center;
	background:var(--intro-progress);box-shadow:0 0 13px var(--intro-progress-glow);
	transition:transform .42s cubic-bezier(.2,.74,.2,1);
}
.mq-cinematic-loading-track i::after { content:"";position:absolute;inset:0;background:repeating-linear-gradient(120deg,rgba(255,255,255,.18) 0 8px,transparent 8px 16px); }
.mq-cinematic-version { display:flex;align-items:center;gap:6px;color:var(--intro-version);font-size:clamp(.68rem,2vmin,.9rem); }
.mq-cinematic-version::before,.mq-cinematic-version::after { content:"";width:clamp(28px,9vw,70px);height:1px;background:linear-gradient(90deg,transparent,var(--intro-line)); }
.mq-cinematic-version::after { transform:scaleX(-1); }
.mq-cinematic-version b { color:var(--intro-version-strong);font-weight:850; }

.mq-cinematic-flare {
	position:absolute;left:50%;top:30%;z-index:5;width:22px;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) scale(.2);opacity:0;pointer-events:none;
	background:#fff;box-shadow:0 0 62px 28px rgba(255,255,255,.58),0 0 112px 54px rgba(74,217,203,.22);
}
.mq-pair-cinematic.is-confirmed .mq-cinematic-flare { animation:mq-cinematic-flare .58s ease-out both; }
@keyframes mq-cinematic-flare { 0%{opacity:0;transform:translate(-50%,-50%) scale(.2)} 36%{opacity:.72} 100%{opacity:0;transform:translate(-50%,-50%) scale(6)} }

.mq-app-intro.is-exiting,.mq-entry-intro.is-exiting { opacity:0;pointer-events:none;transition:opacity .56s ease; }
.mq-view[data-view="plateau"].is-awaiting-intro { opacity:0;pointer-events:none;transition:opacity .52s ease; }
.mq-pair-cinematic.is-paused *,.mq-pair-cinematic.is-paused::before,.mq-pair-cinematic.is-paused::after { animation-play-state:paused!important; }
.mq-pair-cinematic.is-reduced * { animation-duration:.18s!important;transition-duration:.18s!important; }
.mq-pair-cinematic.is-reduced .mq-cinematic-flare,.mq-pair-cinematic.is-reduced .mq-cinematic-back::after { display:none; }
@media (prefers-reduced-motion:reduce) {
	.mq-pair-cinematic * { animation-duration:.18s!important;transition-duration:.18s!important; }
	.mq-pair-cinematic .mq-cinematic-flare,.mq-pair-cinematic .mq-cinematic-back::after { display:none; }
}
@media (max-width:480px), (max-height:700px) {
	.mq-app-intro,.mq-entry-intro { --cinematic-card-w:clamp(92px,27vh,132px); }
	.mq-cinematic-pair,.mq-cinematic-aura,.mq-cinematic-flare { top:28%; }
	.mq-cinematic-brand { top:54%;font-size:clamp(1.9rem,9.5vmin,3.4rem); }
	.mq-cinematic-caption { top:63%; }
	.mq-cinematic-loading { bottom:max(2.2vh,14px);gap:6px; }
	.mq-cinematic-universe { width:clamp(68px,20vw,104px); }
}
@media (min-width:700px) {
	.mq-app-intro,.mq-entry-intro { --cinematic-card-w:min(20vmin,184px); }
	.mq-cinematic-loading { width:min(56vw,620px); }
}

/* =========================================================================
   PLATEAU
   ========================================================================= */
.mq-view[data-view="plateau"] { gap: clamp(3px, .7vmin, 6px); }
.mq-board-top { flex: 0 0 auto; min-height: 0; }
.mq-gamebar {
	position: relative;
	display: grid; grid-template-columns: clamp(54px, 14vw, 76px) minmax(92px, 1fr) clamp(54px, 14vw, 76px);
	align-items: center; gap: 6px;
	min-height: 42px; padding: 2px 3px;
}
.mq-score-chip {
	position: relative; width: 100%; height: 42px; min-width: 0;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
	border: 1px solid rgba(255,255,255,.75); border-radius: 13px;
	background: rgba(255,255,255,.88); box-shadow: 0 2px 9px rgba(21,60,122,.11);
	transition: border-color .25s, box-shadow .25s, background .25s;
	contain: layout paint;
}
.mq-score-chip small {
	display: block; width: calc(100% - 10px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	font-size: clamp(.48rem, 1.65vmin, .62rem); line-height: 1; font-weight: 900;
	letter-spacing: .045em; text-transform: uppercase; text-align: center; color: var(--encre-2);
}
.mq-score-chip .mq-player-name { text-transform:none;letter-spacing:0;font-size:clamp(.55rem,1.9vmin,.72rem);font-weight:950; }
.mq-score-chip strong {
	display: block; width: 100%; text-align: center;
	font-size: clamp(.95rem, 3vmin, 1.18rem); line-height: 1; font-weight: 950;
	font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
	color: var(--encre); white-space: nowrap;
}
.mq-score-avatar { width:24px;height:24px;flex:0 0 24px;object-fit:cover;border-radius:8px;border:1px solid rgba(255,255,255,.78);box-shadow:0 2px 5px rgba(22,54,90,.16); }
.mq-score-chip.is-placeholder { visibility: hidden; pointer-events: none; }
.mq-turn-dot {
	position: absolute; top: 4px; right: 5px; width: 6px; height: 6px;
	border-radius: 50%; opacity: 0; background: #35c85a;
	box-shadow: 0 0 0 3px rgba(53,200,90,.14), 0 0 8px rgba(53,200,90,.7);
}
.mq-score-chip.is-turn {
	border-color: rgba(53,200,90,.78);
	background: rgba(246,255,249,.94);
	box-shadow: 0 0 0 2px rgba(53,200,90,.14), 0 3px 12px rgba(28,139,70,.18);
	animation: mq-tour-actif 2.5s ease-in-out infinite;
}
.mq-score-chip.is-turn .mq-turn-dot { opacity: 1; animation: mq-tour-point 1.6s ease-in-out infinite; }
/* battement sans repeinture : transform seul (l'ombre reste statique) */
@keyframes mq-tour-actif { 0%,100% { transform: scale(1); } 50% { transform: scale(1.025); } }
@keyframes mq-tour-point { 0%,100% { transform: scale(.82); opacity: .72; } 50% { transform: scale(1.12); opacity: 1; } }
.mq-game-actions { min-width: 0; display: flex; align-items: center; justify-content: center; gap: clamp(8px, 2.4vw, 14px); }
.mq-game-action {
	width: 40px; height: 40px; flex: 0 0 40px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 13px !important; background: rgba(255,255,255,.9) !important;
	box-shadow: 0 2px 9px rgba(21,60,122,.12);
	transition: transform .16s var(--ressort), box-shadow .2s, background .2s;
}
.mq-game-action svg { width: 20px; height: 20px; stroke-width: 2.35; color: var(--encre); }
.mq-game-action:active { transform: scale(.92); box-shadow: 0 1px 4px rgba(21,60,122,.12); }

.mq-shell[data-motion="calme"] .mq-score-chip.is-turn,
.mq-shell[data-motion="calme"] .mq-score-chip.is-turn .mq-turn-dot { animation: none; }
@media (prefers-reduced-motion: reduce) {
	.mq-score-chip.is-turn, .mq-score-chip.is-turn .mq-turn-dot { animation: none; }
}
.mq-sr-only {
	position: absolute !important; width: 1px !important; height: 1px !important;
	padding: 0 !important; margin: -1px !important; overflow: hidden !important;
	clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important;
}

.mq-board-wrap { display: flex; align-items: center; justify-content: center; min-height: 0; min-width: 0; position: relative; overflow: hidden; }
.mq-online-activity-wait {
	position:absolute; z-index:30; left:50%; top:8px; transform:translateX(-50%);
	max-width:min(92%,430px); min-height:34px; padding:6px 9px 6px 11px;
	display:flex; align-items:center; justify-content:center; gap:9px;
	border:1px solid color-mix(in srgb,var(--turq) 34%,rgba(255,255,255,.82)); border-radius:999px;
	background:color-mix(in srgb,var(--blanc) 92%,var(--past-menthe) 8%); color:var(--encre);
	box-shadow:0 7px 18px rgba(21,60,122,.16); pointer-events:none;
	font-size:clamp(.66rem,2.5vw,.80rem); line-height:1.1; text-align:center;
}
.mq-online-activity-wait > span { min-width:0; display:flex; align-items:center; justify-content:center; gap:5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mq-online-activity-wait > span svg { width:16px; height:16px; flex:0 0 16px; color:var(--turq-2); }
.mq-online-activity-wait > span b { max-width:34vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mq-online-activity-wait > strong { flex:0 0 auto; min-width:38px; padding:4px 7px; border-radius:999px; background:var(--past-menthe); color:var(--turq-2); font-variant-numeric:tabular-nums; }
.mq-online-activity-wait.is-urgent > strong { background:#fff0ed; color:#b62d28; }
.mq-board { display: grid; gap: clamp(4px, 1.1vmin, 11px); perspective: 1400px; }
.mq-card-slot { position: relative; aspect-ratio: 3 / 4; visibility: hidden; pointer-events: none; }

/* ---------- La carte ---------- */
.mq-card {
	position: relative; aspect-ratio: 3 / 4; min-width: 0; min-height: 0;
	transform-style: preserve-3d; -webkit-transform-style: preserve-3d;
	transition: transform .46s var(--ease);
	border-radius: clamp(9px, 2vmin, 18px);
	will-change: transform;
}

.mq-board[data-compact-touch="true"] .mq-card { aspect-ratio: 5 / 6; }
.mq-board.is-dealing .mq-card { animation: mq-distribue .48s var(--sortie) backwards; animation-delay: calc(var(--i, 0) * 20ms); }
@keyframes mq-distribue { from { opacity: 0; transform: translateY(-40px) rotate(-9deg) scale(.7); } }
.mq-card.is-open, .mq-card.is-done { transform: rotateY(180deg); }
.mq-card.is-done { animation: mq-scelle .76s var(--sortie) .05s both; }
.mq-card.is-wrong { animation: mq-refus .5s var(--ease) .04s; }
@keyframes mq-scelle {
	0% { transform: rotateY(180deg) scale(1); }
	32% { transform: rotateY(180deg) translateZ(32px) scale(1.13) rotate(2deg); }
	60% { transform: rotateY(180deg) translateZ(6px) scale(.96) rotate(-1deg); }
	100% { transform: rotateY(180deg) scale(1); }
}
@keyframes mq-refus {
	15% { transform: rotateY(180deg) translateX(-8%) rotate(-3deg); }
	40% { transform: rotateY(180deg) translateX(8%) rotate(3deg); }
	68% { transform: rotateY(180deg) translateX(-4%) rotate(-1.5deg); }
	100% { transform: rotateY(180deg); }
}
.mq-card.is-hint .mq-back { animation: mq-clignote .5s var(--ease) 3; }
@keyframes mq-clignote { 50% { filter: brightness(1.4); } }

.mq-face {
	position: absolute; inset: 0; border-radius: inherit;
	backface-visibility: hidden; -webkit-backface-visibility: hidden;
	display: flex; align-items: center; justify-content: center; overflow: hidden;
	border: 3px solid #fff;
}
.mq-back {
	transform: rotateY(0deg) translateZ(.1px);
	background: linear-gradient(168deg, #62e0da 0%, #35b8ea 52%, #2e86e0 100%);
	box-shadow: inset 0 -10px 20px rgba(21, 60, 122, .16), 0 3px 8px rgba(21, 60, 122, .22);
}
.mq-back::before {
	content: ""; position: absolute; inset: 0;
	background: no-repeat center / 46% auto
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2.4c.4 0 .8.25 1 .63l2.5 5.06 5.6.82c.9.13 1.26 1.24.6 1.87l-4.05 3.94.96 5.57c.15.9-.8 1.58-1.6 1.15L12 18.82l-5 2.63c-.8.43-1.75-.25-1.6-1.15l.96-5.57-4.05-3.94c-.66-.63-.3-1.74.6-1.87l5.6-.82L11 3.03c.2-.38.6-.63 1-.63Z'/%3E%3C/svg%3E");
	filter: drop-shadow(0 3px 4px rgba(21, 60, 122, .28));
}
.mq-front {
	transform: rotateY(180deg) translateZ(.1px);
	background: linear-gradient(168deg, #f4fbff 0%, #e2f2fb 100%);
	box-shadow: 0 3px 8px rgba(21, 60, 122, .22);
	flex-direction: column; padding: 6%; gap: 2%;
}
.mq-front img { flex: 1 1 auto; min-height: 0; max-width: 100%; object-fit: contain; filter: drop-shadow(0 3px 5px rgba(21, 60, 122, .18)); }
.mq-front .mq-card-name { flex: 0 0 auto; max-width: 100%; font-size: clamp(7px, 1.5vmin, 12px); font-weight: 900; text-align: center; color: var(--encre); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mq-front .mq-card-fallback { display: none; position: absolute; inset: 8%; align-items: center; justify-content: center; padding: 8%; border-radius: inherit; text-align: center; font-weight: 900; font-size: clamp(8px, 1.55vmin, 13px); color: #fff; background: linear-gradient(160deg, #145d7d, #0d4565); }
.mq-board[data-category="animaux"] .mq-front { padding: 0; gap: 0; background: #0d4565; }
.mq-board[data-category="animaux"] .mq-front img { width: 100%; height: 100%; max-width: none; object-fit: cover; filter: none; }
.mq-board[data-category="animaux"] .mq-front > .mq-card-name { display: none; }
.mq-front.is-image-error img { display: none; }
.mq-front.is-image-error > .mq-card-fallback { display: flex; }
.mq-board[data-category="animaux"] .mq-front.is-image-error > .mq-card-fallback { display: flex; inset: 0; border-radius: 0; }
/* Aperçu x1,5 réel : calque indépendant, ancré à la carte ouverte. */
.mq-card-preview-layer {
	position: fixed; z-index: 2147483000; pointer-events: none;
	opacity: 0; transform: translate3d(0,0,0) scale(.94); transform-origin: 50% 50%;
	transition: transform .34s cubic-bezier(.34, 1.56, .5, 1), opacity .18s ease-out;
	will-change: transform, opacity; backface-visibility: hidden; -webkit-backface-visibility: hidden;
}
.mq-card-preview-layer.is-active {
	opacity: 1;
	transform: translate3d(var(--mq-preview-x, 0), var(--mq-preview-y, 0), 0) scale(1.5);
}
.mq-card-preview-layer.is-leaving {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
}
.mq-card-preview-surface {
	position: absolute; inset: 0; overflow: hidden;
	border-radius: clamp(9px, 2vmin, 18px); border: 3px solid #fff;
	background: #0d4565;
	box-shadow: 0 18px 38px rgba(13,69,101,.38), 0 0 0 3px rgba(98,224,218,.2);
}
.mq-card-preview-surface img { width: 100%; height: 100%; display: block; object-fit: cover; }
.mq-card-preview-surface > span { display: none; }
.mq-card-preview-surface.is-image-error img { display: none; }
.mq-card-preview-surface.is-image-error > .mq-card-fallback { display: flex; inset: 0; border-radius: 0; }
.mq-card-preview-layer.is-calm { transition-duration: .12s; }
@media (prefers-reduced-motion: reduce) {
	.mq-card-preview-layer { transition-duration: .12s; }
}
.mq-card.is-done .mq-front { background: linear-gradient(168deg, #eafbf3, #d6f5e8); }
.mq-card.is-done .mq-face { border-color: #7fe3b6; }
.mq-card.is-wrong .mq-face { border-color: #ffb3ab; }

.mq-game-progress {
	display: block; flex: 0 0 3px; width: 100%; height: 3px;
	border-radius: 99px; overflow: hidden;
	background: rgba(255,255,255,.36);
}
.mq-game-progress i {
	display: block; width: 0; height: 100%; border-radius: inherit;
	background: linear-gradient(90deg, #28c873, #39d6b0);
	box-shadow: 0 0 8px rgba(40,200,115,.35);
	transition: width .38s var(--sortie);
}

/* ---------- Océan : surfaces lisibles hors partie ---------- */
.mq-shell[data-skin="ocean"] .mq-view[data-view="online"] .mq-online-head .mq-title {
	color:#f9feff;text-shadow:0 2px 8px rgba(0,46,88,.28);
}
.mq-shell[data-skin="ocean"] .mq-view[data-view="online"] .mq-online-head .mq-eyebrow {
	color:#a9fff4;text-shadow:0 1px 6px rgba(0,62,84,.24);
}
.mq-shell[data-skin="ocean"] .mq-view[data-view="online"] .mq-online-head .mq-setup-back {
	color:#0d4e86;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(226,248,252,.92));
	border:1px solid rgba(211,246,251,.92);box-shadow:0 8px 20px rgba(0,45,83,.2),inset 0 1px 0 #fff;
}

.mq-shell[data-skin="ocean"] .mq-competitive-card {
	border-color:rgba(226,250,253,.98);
}
.mq-shell[data-skin="ocean"] .mq-competitive-card::after { opacity:.55; }

/* ---------- Océan : barre de jeu, plateau et cartes ---------- */
.mq-shell[data-skin="ocean"] .mq-gamebar { padding-top:5px; }
.mq-shell[data-skin="ocean"] .mq-score-chip {
	overflow:visible;
	border-color:rgba(215,249,255,.86);
	background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(232,249,252,.94));
	box-shadow:0 4px 14px rgba(0,36,81,.23), inset 0 1px 0 #fff, inset 0 -2px 0 rgba(85,190,212,.13);
}
.mq-shell[data-skin="ocean"] .mq-score-chip::before {
	content:""; position:absolute; width:24px; height:15px; left:50%; top:-8px; translate:-50% 0;
	background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2080%2048%22%3E%3Cpath%20d%3D%22M8%2042C12%2018%2024%206%2040%206s28%2012%2032%2036H8Z%22%20fill%3D%22%23f6fdff%22%20stroke%3D%22%23a9dbe8%22%20stroke-width%3D%223%22%2F%3E%3Cpath%20d%3D%22M40%208v32M26%2011l8%2029M54%2011l-8%2029M16%2022l13%2018M64%2022%2051%2040%22%20fill%3D%22none%22%20stroke%3D%22%23b5e3ec%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat; opacity:.96; pointer-events:none;
}
.mq-shell[data-skin="ocean"] .mq-score-chip::after {
	content:""; position:absolute; width:8px; height:8px; right:5px; bottom:4px; border-radius:50%;
	background:radial-gradient(circle at 35% 28%,#fff 0 22%,#d8f6fb 42%,#98cfda 100%);
	box-shadow:0 1px 4px rgba(4,71,100,.25); opacity:.88;
}
.mq-shell[data-skin="ocean"] .mq-score-chip.is-turn {
	border-color:rgba(85,235,184,.9);
	background:linear-gradient(180deg,#fbfffe,#e9fff5);
	box-shadow:0 0 0 2px rgba(67,222,166,.18),0 5px 18px rgba(0,72,95,.25),inset 0 1px 0 #fff;
}
.mq-shell[data-skin="ocean"] .mq-game-action {
	border:1px solid rgba(202,247,255,.78) !important;
	background:linear-gradient(180deg,rgba(74,218,240,.96),rgba(20,123,211,.96)) !important;
	box-shadow:0 5px 14px rgba(0,42,96,.27),inset 0 1px 0 rgba(255,255,255,.66),inset 0 -2px 0 rgba(0,48,120,.17);
}
.mq-shell[data-skin="ocean"] .mq-game-action svg { color:#fff; filter:drop-shadow(0 2px 2px rgba(0,50,115,.22)); }
.mq-shell[data-skin="ocean"] .mq-board-wrap { isolation:isolate; border-radius:clamp(14px,2.5vmin,24px); }
.mq-shell[data-skin="ocean"] .mq-board-wrap::before {
	content:""; position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit;
	border:1px solid rgba(128,229,242,.36);
	background:linear-gradient(180deg,rgba(1,48,88,.16),rgba(1,29,64,.24));
	box-shadow:inset 0 0 28px rgba(40,217,231,.12),0 10px 28px rgba(0,28,69,.18);
}
.mq-shell[data-skin="ocean"] .mq-board { position:relative; z-index:1; }
.mq-shell[data-skin="ocean"] .mq-card {
	border-radius:clamp(9px,2vmin,18px);
	transition:transform .5s cubic-bezier(.2,.82,.2,1),filter .28s ease;
}
.mq-shell[data-skin="ocean"] .mq-face {
	border-color:rgba(248,254,255,.98);
	box-shadow:0 4px 11px rgba(0,35,82,.28),inset 0 1px 0 rgba(255,255,255,.9);
}
.mq-shell[data-skin="ocean"] .mq-back {
	background:
		radial-gradient(circle at 28% 17%,rgba(255,255,255,.28),transparent 31%),
		linear-gradient(166deg,#49dce1 0%,#20b7e5 46%,#0968c8 100%);
	box-shadow:inset 0 -14px 24px rgba(0,43,112,.22),inset 0 1px 0 rgba(255,255,255,.52),0 4px 11px rgba(0,35,82,.3);
}
.mq-shell[data-skin="ocean"] .mq-back::before {
	content:""; position:absolute; inset:21%; z-index:2;
	background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23fff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23d8f7ff%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M60%208c6%200%209%2022%2012%2030%208-4%2028-15%2032-10%204%205-13%2022-19%2029%208%205%2028%2014%2026%2021-2%207-27%202-36%201-2%209-7%2033-15%2033s-13-24-15-33c-9%201-34%206-36-1-2-7%2018-16%2026-21-6-7-23-24-19-29%204-5%2024%206%2032%2010%203-8%206-30%2012-30Z%22%20fill%3D%22url%28%23g%29%22%20stroke%3D%22%23fff%22%20stroke-width%3D%224%22%20stroke-linejoin%3D%22round%22%2F%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%2257%22%20r%3D%227%22%20fill%3D%22%23bcecff%22%20opacity%3D%22.85%22%2F%3E%3Cg%20fill%3D%22%2383d7ef%22%20opacity%3D%22.8%22%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%2231%22%20r%3D%222.7%22%2F%3E%3Ccircle%20cx%3D%2238%22%20cy%3D%2248%22%20r%3D%222.7%22%2F%3E%3Ccircle%20cx%3D%2282%22%20cy%3D%2248%22%20r%3D%222.7%22%2F%3E%3Ccircle%20cx%3D%2247%22%20cy%3D%2275%22%20r%3D%222.7%22%2F%3E%3Ccircle%20cx%3D%2273%22%20cy%3D%2275%22%20r%3D%222.7%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") center/contain no-repeat;
	filter:drop-shadow(0 4px 5px rgba(0,55,120,.25));
}
.mq-shell[data-skin="ocean"] .mq-back::after {
	content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
	background:
		radial-gradient(circle at 17% 24%,transparent 0 2px,rgba(232,255,255,.32) 2.5px 3.2px,transparent 3.8px),
		radial-gradient(circle at 78% 37%,transparent 0 1.5px,rgba(232,255,255,.28) 2px 2.8px,transparent 3.2px),
		radial-gradient(circle at 67% 17%,transparent 0 1px,rgba(232,255,255,.3) 1.6px 2.3px,transparent 2.8px),
		linear-gradient(0deg,rgba(2,58,127,.3),transparent 42%);
	opacity:.9;
}
.mq-shell[data-skin="ocean"] .mq-front {
	border-color:#f6fdff;
	background:linear-gradient(168deg,#f9feff 0%,#e6f8fb 100%);
	box-shadow:0 5px 13px rgba(0,35,82,.3),inset 0 0 0 1px rgba(133,220,235,.25);
}
.mq-shell[data-skin="ocean"] .mq-front .mq-card-name {
	color:#073b70;
	text-shadow:0 1px 0 #fff;
}
.mq-shell[data-skin="ocean"] .mq-board:not([data-category="animaux"]) .mq-front .mq-card-name {
	max-width:94%; padding:.12em .48em; border-radius:999px;
	background:rgba(238,252,255,.9); box-shadow:0 1px 5px rgba(0,58,92,.12);
}
.mq-shell[data-skin="ocean"] .mq-board[data-category="animaux"] .mq-front { background:#073f69; }
.mq-shell[data-skin="ocean"] .mq-card.is-open:not(.is-done) .mq-front::after {
	content:""; position:absolute; inset:-35% -90%; pointer-events:none;
	background:linear-gradient(105deg,transparent 38%,rgba(214,254,255,.58) 49%,rgba(255,255,255,.84) 52%,rgba(193,247,255,.4) 56%,transparent 68%);
	transform:translateX(-48%) rotate(4deg); animation:mq-ocean-reveal .72s ease-out both;
}
.mq-shell[data-skin="ocean"] .mq-card.is-done .mq-front {
	border-color:#78efd0;
	background:linear-gradient(168deg,#f0fffb,#d9f8ee);
	box-shadow:0 0 0 2px rgba(91,235,193,.22),0 0 18px rgba(58,225,204,.46),0 5px 13px rgba(0,35,82,.26);
}
.mq-shell[data-skin="ocean"] .mq-card.is-done .mq-front::before {
	content:""; position:absolute; inset:-30%; pointer-events:none;
	background:radial-gradient(circle,rgba(174,255,232,.52) 0 18%,transparent 48%);
	animation:mq-ocean-match-wave .86s ease-out both;
}
.mq-shell[data-skin="ocean"] .mq-card.is-wrong .mq-face { border-color:#ff9f92; box-shadow:0 0 0 2px rgba(255,112,95,.14),0 5px 13px rgba(0,35,82,.26); }
.mq-shell[data-skin="ocean"] .mq-card.is-hint .mq-back { animation:mq-ocean-hint .7s ease-in-out 3; }
.mq-shell[data-skin="ocean"] .mq-game-progress { background:rgba(212,249,255,.22); box-shadow:inset 0 1px 3px rgba(0,20,58,.16); }
.mq-shell[data-skin="ocean"] .mq-game-progress i { background:linear-gradient(90deg,#53e6cc,#33d7db,#43efb2); box-shadow:0 0 10px rgba(58,235,211,.58); }
.mq-card-preview-layer[data-skin="ocean"] .mq-card-preview-surface {
	border-color:#f6fdff; background:#073f69;
	box-shadow:0 20px 45px rgba(0,27,65,.46),0 0 0 3px rgba(71,220,228,.24),0 0 28px rgba(50,211,224,.22);
}
@keyframes mq-ocean-reveal { from { transform:translateX(-55%) rotate(4deg); opacity:0; } 30% { opacity:1; } to { transform:translateX(55%) rotate(4deg); opacity:0; } }
@keyframes mq-ocean-match-wave { from { transform:scale(.48); opacity:0; } 28% { opacity:1; } to { transform:scale(1.2); opacity:0; } }
@keyframes mq-ocean-hint { 50% { filter:brightness(1.22) saturate(1.12); box-shadow:0 0 20px rgba(137,248,255,.72),inset 0 -14px 24px rgba(0,43,112,.18); } }
.mq-shell[data-skin="ocean"][data-motion="calme"] .mq-ambiance::before,
.mq-shell[data-skin="ocean"][data-motion="calme"] .mq-ambiance i,
.mq-shell[data-skin="ocean"][data-motion="calme"] .mq-ocean-fish,
.mq-shell[data-skin="ocean"][data-motion="calme"] .mq-card.is-open .mq-front::after,
.mq-shell[data-skin="ocean"][data-motion="calme"] .mq-card.is-done .mq-front::before { animation:none !important; }
@media (prefers-reduced-motion:reduce) {
	.mq-shell[data-skin="ocean"] .mq-ambiance::before,
	.mq-shell[data-skin="ocean"] .mq-ambiance i,
	.mq-shell[data-skin="ocean"] .mq-ocean-fish,
	.mq-shell[data-skin="ocean"] .mq-card.is-open .mq-front::after,
	.mq-shell[data-skin="ocean"] .mq-card.is-done .mq-front::before { animation:none !important; }
}

/* ---------- Effets de partie : voir le bloc IMPACT SYSTEM en fin de feuille ---------- */

/* =========================================================================
   PANNEAUX MODAUX
   ========================================================================= */
.mq-sheet-layer {
	position: absolute; inset: 0; z-index: 30;
	display: flex; align-items: center; justify-content: center; padding: var(--pad);
	background: rgba(21, 60, 122, .42);
	/* pas de flou d'arrière-plan : il obligeait à refiltrer tout l'écran à chaque image (saccade à l'ouverture) */
	animation: mq-fade .24s var(--sortie);
}
@keyframes mq-fade { from { opacity: 0; } }
.mq-sheet {
	width: min(520px, 100%); max-height: 100%;
	display: flex; flex-direction: column; gap: 12px;
	padding: clamp(14px, 2.6vmin, 24px);
	border-radius: var(--r-xl); background: var(--blanc);
	box-shadow: 0 20px 50px rgba(21, 60, 122, .38);
	animation: mq-monte .4s var(--ressort);
	overflow: hidden;
}
.mq-sheet > *:nth-child(1), .mq-sheet > *:nth-child(3) { flex: 0 0 auto; }
.mq-sheet > *:nth-child(2) { flex: 1 1 auto; min-height: 0; }
@keyframes mq-monte { from { opacity: 0; transform: translateY(26px) scale(.93); } }

.mq-sheet-head { display: flex; align-items: center; gap: 12px; }
.mq-sheet-thumb {
	width: 60px; height: 60px; border-radius: var(--r-m); padding: 7px; flex: 0 0 auto;
	display: flex; align-items: center; justify-content: center;
	background: linear-gradient(165deg, #f2fbff, #ddeffa); color: var(--bleu);
}
.mq-sheet-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; }
.mq-sheet-thumb svg { width: 56%; height: 56%; }
.mq-sheet-body { display: flex; flex-direction: column; gap: 11px; }

.mq-question { font-size: 1.02rem; font-weight: 900; margin: 0; color: var(--encre); }
.mq-fact { margin: 0; color: var(--encre-2); font-weight: 700; }
.mq-fact strong { color: var(--bleu); background: var(--past-bleu); padding: 1px 5px; border-radius: 5px; }

.mq-answers { display: grid; gap: 8px; }
.mq-answers.is-duo { grid-template-columns: 1fr 1fr; }
.mq-answer {
	display: flex; align-items: center; gap: 11px; text-align: left;
	padding: 12px 14px; border-radius: var(--r-m); color: var(--encre); font-weight: 800;
	background: #f5f9fd; border: 2px solid #e2ecf6;
	transition: transform .15s var(--ressort), background .2s, border-color .2s;
}
.mq-answer:active { transform: scale(.98); }
.mq-answer b { width: 28px; height: 28px; flex: 0 0 auto; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #fff; color: var(--bleu); font-size: .82rem; box-shadow: var(--ombre); }
.mq-answer.is-right { border-color: var(--vert); background: #eefbe9; }
.mq-answer.is-right b { background: var(--vert); color: #fff; }
.mq-answer.is-wrong { border-color: var(--rouge); background: #fdeceb; }
.mq-answer.is-wrong b { background: var(--rouge); color: #fff; }

.mq-verdict { display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: var(--r-m); border: 2px solid; }
.mq-verdict.is-right { background: #eefbe9; border-color: var(--vert); }
.mq-verdict.is-wrong { background: #fdeceb; border-color: var(--rouge); }
.mq-verdict strong { font-weight: 900; font-size: 1rem; }
.mq-verdict p { margin: 0; font-size: .86rem; color: var(--encre-2); font-weight: 700; }
.mq-verdict span { font-weight: 900; font-variant-numeric: tabular-nums; color: var(--or-2); }

.mq-input { width: 100%; padding: 13px 15px; border-radius: var(--r-m); font: inherit; font-weight: 800; color: var(--encre); background: #f5f9fd; border: 2px solid #e2ecf6; }
.mq-input::placeholder { color: var(--encre-3); }
.mq-hintbar { display: flex; justify-content: space-between; align-items: center; font-size: .8rem; font-weight: 900; color: var(--encre-2); font-variant-numeric: tabular-nums; }
.mq-hintbar b { color: var(--or-2); }

/* ---------- Victoire ---------- */
.mq-victoire { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.mq-victoire h3 { font-size: clamp(1.4rem, 5vmin, 2.2rem); font-weight: 900; letter-spacing: -.045em; margin: 0; }
.mq-victoire p { margin: 0; color: var(--encre-2); font-weight: 800; font-size: .86rem; }
.mq-recompense { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 12px; border-radius: var(--r-l); background: #f5f9fd; }
.mq-recompense span { width: 42px; height: 42px; border-radius: 50%; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle at 34% 28%, #ffe08a, var(--or) 52%, var(--or-2)); color: #7a4a00; }
.mq-recompense span svg { width: 22px; height: 22px; stroke-width: 3; }
.mq-recompense b { font-size: clamp(1.4rem, 4.6vmin, 2.1rem); font-weight: 900; color: var(--encre); font-variant-numeric: tabular-nums; }
.mq-result-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.mq-result-grid div { padding: 10px 6px; border-radius: var(--r-m); text-align: center; background: #f5f9fd; }
.mq-result-grid small { display: block; font-size: .6rem; color: var(--encre-2); font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.mq-result-grid strong { font-size: 1.2rem; font-weight: 900; font-variant-numeric: tabular-nums; color: var(--bleu); }
.mq-ruban { align-self: center; padding: 7px 22px; border-radius: var(--r-pill); background: var(--degrade); color: #fff; font-weight: 900; font-size: .82rem; letter-spacing: .08em; box-shadow: var(--ombre-forte); animation: mq-ruban .6s var(--ressort) both; }
@keyframes mq-ruban { from { opacity: 0; transform: scale(.5) rotate(-5deg); } }

.mq-confettis { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 35; }
.mq-confettis i { position: absolute; top: -8%; width: 9px; height: 14px; border-radius: 3px; left: var(--x); background: var(--c); animation: mq-chute var(--d) linear var(--r) forwards; will-change: transform, opacity; }
.mq-confettis .mq-fx-burst { position: absolute; left: 50%; top: 38%; width: 8px; height: 8px; margin: -4px; border-radius: 50%; background: var(--c); animation: mq-fx-burst .9s var(--sortie) forwards; will-change: transform, opacity; }
@keyframes mq-fx-burst { 0% { transform: rotate(calc(var(--a) * 1deg)) translateY(0) scale(1.4); opacity: 1; } 100% { transform: rotate(calc(var(--a) * 1deg)) translateY(-150px) scale(.2); opacity: 0; } }
@keyframes mq-chute { 0% { opacity: 1; transform: translateY(0) rotate(0deg); } 100% { opacity: .05; transform: translateY(115vh) rotate(820deg); } }

/* =========================================================================
   HISTOIRE V2 — parcours serpentin qui occupe toute la hauteur
   ========================================================================= */
.mq-histoire-tete { display: flex; flex-direction: column; gap: 7px; }
.mq-histoire-titre { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.mq-histoire-total {
	flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px;
	padding: 5px 12px; border-radius: var(--r-pill);
	background: var(--blanc); box-shadow: var(--ombre);
	font-weight: 900; font-size: .82rem; color: var(--or-2); font-variant-numeric: tabular-nums;
}

/* Pastilles de chapitre, compactes */
.mq-chapters { display: flex; gap: 7px; overflow-x: auto; padding: 3px 2px 5px; scrollbar-width: none; }
.mq-chapters::-webkit-scrollbar { display: none; }
.mq-chapter {
	flex: 0 0 auto; width: clamp(56px, 13vmin, 74px);
	display: flex; flex-direction: column; align-items: center; gap: 2px;
	padding: 7px 4px; border-radius: var(--r-m);
	background: var(--blanc); box-shadow: var(--ombre); border: 2px solid transparent;
	transition: transform .2s var(--ressort), border-color .2s, box-shadow .22s;
	animation: mq-chapitre-in .42s var(--sortie) backwards;
	animation-delay: calc(var(--d, 0) * 1ms);
}
@keyframes mq-chapitre-in { from { opacity: 0; transform: translateY(-12px) scale(.8); } }
.mq-chapter b {
	width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	background: #eef4fa; color: var(--encre-2); font-size: .8rem; font-weight: 900;
}
.mq-chapter small { font-size: .62rem; font-weight: 900; color: var(--encre-2); font-variant-numeric: tabular-nums; }
.mq-chapter[aria-current="true"] {
	border-color: var(--turq); transform: translateY(-3px);
	box-shadow: 0 0 0 3px rgba(22, 196, 206, .16), var(--ombre-forte);
}
.mq-chapter[aria-current="true"] b { background: var(--degrade); color: #fff; }
.mq-chapter[aria-current="true"] small { color: var(--turq-2); }
.mq-chapter.is-locked { opacity: .5; }
.mq-chapter.is-locked b { background: #e3eaf3; }

/* Le parcours */
.mq-chemin {
	position: relative; min-height: 0;
	display: grid; grid-template-columns: 1fr 1fr;
	grid-auto-rows: minmax(0, 1fr); gap: clamp(2px, .8vmin, 8px) clamp(10px, 3vmin, 26px);
	padding: 2px 0;
}
.mq-chemin::before {
	content: ""; position: absolute; left: 50%; top: 4%; bottom: 4%; width: 5px;
	transform: translateX(-50%); border-radius: 99px;
	background: repeating-linear-gradient(180deg, rgba(21, 60, 122, .14) 0 7px, transparent 7px 16px);
}
.mq-chemin-trace {
	position: absolute; left: 50%; top: 4%; width: 5px; transform: translateX(-50%);
	border-radius: 99px; background: linear-gradient(180deg, var(--turq), #3ad8ac);
	box-shadow: 0 0 12px rgba(22, 196, 206, .6);
	transition: height .9s var(--sortie);
}

.mq-jalon {
	position: relative; z-index: 1; min-width: 0;
	display: flex; align-items: center; gap: clamp(6px, 1.6vmin, 12px);
	padding: 4px 6px; border-radius: var(--r-l);
	animation: mq-jalon-in .5s var(--ressort) backwards;
	animation-delay: calc(var(--d, 0) * 1ms);
	transition: transform .18s var(--ressort);
}
@keyframes mq-jalon-in { from { opacity: 0; transform: translateY(18px) scale(.65); } }
.mq-jalon:nth-child(even) { flex-direction: row-reverse; text-align: right; }
.mq-jalon:active { transform: scale(.94); }

.mq-jalon-pastille {
	position: relative; flex: 0 0 auto;
	width: clamp(42px, 9.5vmin, 64px); height: clamp(42px, 9.5vmin, 64px);
	border-radius: 50%; display: flex; align-items: center; justify-content: center;
	background: #d9e4f0; color: #fff;
	font-size: clamp(.9rem, 2.4vmin, 1.25rem); font-weight: 900; font-variant-numeric: tabular-nums;
	border: 3px solid #fff; box-shadow: var(--ombre);
}
.mq-jalon-pastille svg { width: 46%; height: 46%; stroke-width: 3; }
.mq-jalon-txt { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.mq-jalon-txt strong {
	font-size: clamp(.68rem, 1.8vmin, .88rem); font-weight: 900; color: var(--encre);
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mq-jalon-etoiles { display: flex; gap: 2px; }
.mq-jalon:nth-child(even) .mq-jalon-etoiles { justify-content: flex-end; }

.mq-jalon.is-open .mq-jalon-pastille { background: var(--degrade); box-shadow: 0 4px 10px rgba(31, 106, 192, .34); }
.mq-jalon.is-done .mq-jalon-pastille { background: linear-gradient(150deg, #5fd94f, var(--vert-2)); }
.mq-jalon.is-boss .mq-jalon-pastille { background: linear-gradient(150deg, #ffd45e, var(--or-2)); color: #6b3f00; }
.mq-jalon.is-locked { opacity: .55; pointer-events: none; }
.mq-jalon.is-duel .mq-jalon-pastille::after {
	content: "IA"; position: absolute; top: -6px; right: -8px;
	padding: 2px 6px; border-radius: 99px; font-size: .52rem; font-weight: 900; color: #fff;
	background: linear-gradient(150deg, #a97cf8, #7c4ddb); border: 2px solid #fff;
}

/* Niveau courant : halo qui respire */
.mq-jalon.is-current .mq-jalon-pastille { position: relative; box-shadow: 0 4px 10px rgba(31, 106, 192, .34); }
.mq-jalon.is-current .mq-jalon-pastille::after { content: ""; position: absolute; inset: -3px; border-radius: inherit; border: 3px solid rgba(22, 196, 206, .55); animation: mq-halo 2s var(--ease) infinite; pointer-events: none; }
@keyframes mq-halo { 0% { opacity: .9; transform: scale(1); } 60%, 100% { opacity: 0; transform: scale(1.55); } }

/* Tampon de validation au retour d'un niveau réussi */
.mq-jalon.is-stamping .mq-jalon-pastille { animation: mq-tampon-jalon .7s var(--ressort) both; }
@keyframes mq-tampon-jalon {
	0% { transform: scale(2.4) rotate(-30deg); opacity: 0; }
	55% { transform: scale(.85) rotate(6deg); opacity: 1; }
	100% { transform: scale(1) rotate(0); opacity: 1; }
}
/* Déverrouillage du niveau suivant */
.mq-jalon.is-unlocking .mq-jalon-pastille { animation: mq-ouverture .8s var(--ressort) .5s both; }
@keyframes mq-ouverture {
	0% { transform: scale(.5); filter: grayscale(1) brightness(1.6); }
	60% { transform: scale(1.22); filter: none; }
	100% { transform: scale(1); filter: none; }
}
.mq-jalon.is-unlocking::before {
	content: ""; position: absolute; left: var(--ox, 8%); top: 50%; width: 30px; height: 30px;
	margin: -15px 0 0 -15px; border-radius: 50%; border: 4px solid var(--turq);
	animation: mq-onde-jalon .9s var(--sortie) .5s both;
}
@keyframes mq-onde-jalon { 0% { opacity: .9; transform: scale(.3); } 100% { opacity: 0; transform: scale(4.5); } }

/* Carte de mission : titre, mesures, bouton pleine largeur */
.mq-mission {
	display: flex; flex-direction: column; gap: 9px;
	padding: 12px 14px; border-radius: var(--r-xl);
	background: var(--blanc); box-shadow: var(--ombre-forte);
	animation: mq-mission-in .45s var(--sortie) both;
}
@keyframes mq-mission-in { from { opacity: 0; transform: translateY(22px); } }
.mq-mission-tete { display: flex; align-items: center; gap: 11px; }
.mq-mission-num {
	flex: 0 0 auto; width: 42px; height: 42px; border-radius: 14px;
	display: flex; align-items: center; justify-content: center;
	background: var(--degrade); color: #fff; font-weight: 900; font-size: 1.05rem;
	font-variant-numeric: tabular-nums;
}
.mq-mission-tete > div { flex: 1 1 auto; min-width: 0; }
.mq-mission-tete small { display: block; font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--encre-2); font-weight: 900; }
.mq-mission-tete strong { display: block; font-size: 1rem; font-weight: 900; color: var(--encre); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mq-mission-meta { display: flex; flex-wrap: wrap; gap: 5px; }
.mq-mission .mq-btn { width: 100%; }
.mq-tag {
	display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: var(--r-pill);
	font-size: .7rem; font-weight: 900; background: #f0f6fc; color: var(--encre);
	font-variant-numeric: tabular-nums; white-space: nowrap;
}
.mq-tag svg { width: 12px; height: 12px; color: var(--turq-2); stroke-width: 2.6; }

/* =========================================================================
   ÉTOILES — une seule pièce, trois tailles
   ========================================================================= */
.mq-etoile { position: relative; flex: 0 0 auto; display: inline-block; line-height: 0; overflow: visible; }
.mq-etoile svg { width: 100%; height: 100%; overflow: visible; display: block; }
/* Étoile bijou : or radial, ombrage, liseré, reflet, socle cuivré ; vide en verre givré. */
.mq-etoile .e-vide { fill: url(#mq-st-empty); stroke: rgba(21, 60, 122, .16); stroke-width: .8; stroke-linejoin: round; }
.mq-etoile .e-plein { clip-path: inset(-20% calc(100% - var(--f, 0%)) -20% -20%); }
.mq-etoile .e-socle { fill: #b8650a; opacity: .9; }
.mq-etoile .e-corps { fill: url(#mq-st-core); }
.mq-etoile .e-ombre { fill: url(#mq-st-shade); }
.mq-etoile .e-liseret { fill: none; stroke: url(#mq-st-rim); stroke-width: 1.1; stroke-linejoin: round; }
.mq-etoile .e-lueur { fill: url(#mq-st-gloss); opacity: .85; }
.mq-etoile .e-point { fill: #fff; opacity: .9; }
.mq-etoile.is-full svg { filter: drop-shadow(0 0 3px rgba(255, 190, 60, .5)) drop-shadow(0 4px 7px rgba(214, 124, 14, .3)); }
.mq-shell[data-skin="nuit"] .mq-etoile .e-vide, .mq-shell[data-skin="grenat"] .mq-etoile .e-vide, .mq-shell[data-skin="ardoise"] .mq-etoile .e-vide { fill: rgba(255, 255, 255, .1); stroke: rgba(255, 255, 255, .22); }
.mq-etoile-mini { width: clamp(9px, 2.1vmin, 14px); height: clamp(9px, 2.1vmin, 14px); }
.mq-etoile-moyen { width: clamp(16px, 3.6vmin, 24px); height: clamp(16px, 3.6vmin, 24px); }
.mq-etoile-geant { width: clamp(44px, 11vmin, 82px); height: clamp(44px, 11vmin, 82px); }

.mq-stars { display: flex; gap: clamp(5px, 1.6vmin, 12px); justify-content: center; align-items: center; padding: 4px 0; }
.mq-stars .mq-etoile-geant:nth-child(2) { width: clamp(52px, 13vmin, 96px); height: clamp(52px, 13vmin, 96px); }
.mq-stars .mq-etoile { opacity: 0; transform: scale(.2) rotate(-40deg); }
.mq-stars .mq-etoile.is-lit { animation: mq-star-in .6s cubic-bezier(.22, 1.6, .36, 1) both; }
@keyframes mq-star-in { to { opacity: 1; transform: none; } }
.mq-stars .mq-etoile .e-plein { transition: clip-path .55s var(--ease); }
.mq-stars .mq-etoile:not(.is-lit) .e-plein { clip-path: inset(-20% 100% -20% -20%); }
.mq-stars .mq-etoile.is-full.is-lit svg { animation: mq-star-breathe 3.2s ease-in-out 1.2s infinite; }
@keyframes mq-star-breathe { 50% { transform: scale(1.05); } }
.mq-star-spark { position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; margin: -3px; border-radius: 50%; background: #fff6c8; box-shadow: 0 0 10px var(--or); animation: mq-star-spark .7s var(--sortie) forwards; pointer-events: none; }
@keyframes mq-star-spark { 0% { transform: rotate(calc(var(--a) * 1deg)) translateY(0) scale(1.4); opacity: 1; } 100% { transform: rotate(calc(var(--a) * 1deg)) translateY(-26px) scale(.2); opacity: 0; } }
.mq-star-flash { position: absolute; inset: -30%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 240, 180, .9), transparent 65%); animation: mq-star-flash .5s var(--sortie) forwards; pointer-events: none; }
@keyframes mq-star-flash { 0% { opacity: 1; transform: scale(.4); } 100% { opacity: 0; transform: scale(1.4); } }
.mq-shell[data-motion="calme"] .mq-stars .mq-etoile { opacity: 1; transform: none; animation: none !important; }
.mq-shell[data-motion="calme"] .mq-stars .mq-etoile svg { animation: none !important; }
.mq-shell[data-motion="calme"] .mq-star-spark, .mq-shell[data-motion="calme"] .mq-star-flash { display: none; }

/* ---------- Réglages ---------- */
.mq-rows { display: flex; flex-direction: column; gap: 8px; padding: 2px 2px 6px; }
.mq-row { display: flex; align-items: center; gap: 13px; text-align: left; padding: 13px 15px; border-radius: var(--r-l); background: var(--blanc); box-shadow: var(--ombre); }
.mq-row > span:first-child { flex: 1 1 auto; min-width: 0; }
.mq-row strong { display: block; font-weight: 900; }
.mq-row small { display: block; color: var(--encre-2); font-size: .78rem; font-weight: 700; }
.mq-switch { width: 50px; height: 29px; border-radius: 99px; flex: 0 0 auto; position: relative; background: #dbe5f0; transition: background .25s var(--ease); }
.mq-switch i { position: absolute; top: 3px; left: 3px; width: 23px; height: 23px; border-radius: 50%; background: #fff; box-shadow: 0 2px 4px rgba(21, 60, 122, .3); transition: transform .3s var(--ressort); }
.mq-row[aria-pressed="true"] .mq-switch { background: linear-gradient(120deg, var(--turq), #3ad8ac); }
.mq-row[aria-pressed="true"] .mq-switch i { transform: translateX(21px); }
.mq-range { width: 100%; accent-color: var(--turq); }

/* ---------- Message flottant ---------- */
.mq-toast {
	position: absolute; left: 50%; bottom: calc(var(--pad) + 10px);
	transform: translateX(-50%) translateY(20px);
	padding: 11px 20px; border-radius: var(--r-pill); z-index: 40; pointer-events: none;
	max-width: calc(100% - 2 * var(--pad)); text-align: center;
	color: #fff; font-weight: 900; font-size: .86rem;
	background: var(--degrade); box-shadow: var(--ombre-forte);
	opacity: 0; transition: opacity .22s var(--ease), transform .36s var(--ressort);
}
.mq-toast.is-on { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ---------- Navigation basse ---------- */
.mq-nav { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; padding: 6px; border-radius: var(--r-xl); background: var(--blanc); box-shadow: var(--ombre-forte); }
.mq-nav button { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 7px 3px 9px; border-radius: var(--r-m); color: var(--encre-3); position: relative; transition: color .2s, background .22s, transform .18s var(--ressort); }
.mq-nav button svg { width: 21px; height: 21px; stroke-width: 2.4; }
.mq-nav button small { font-size: .62rem; font-weight: 900; }
.mq-nav button.is-on { color: var(--turq-2); background: var(--past-ciel); }
.mq-nav button.is-on::after { content: ""; position: absolute; bottom: 3px; left: 50%; transform: translateX(-50%); width: 18px; height: 3px; border-radius: 99px; background: var(--turq); }
.mq-nav button:active { transform: scale(.93); }
.mq-nav .mq-badge { position: absolute; top: 1px; right: calc(50% - 22px); min-width: 17px; height: 17px; padding: 0 4px; border-radius: 99px; display: flex; align-items: center; justify-content: center; background: var(--rouge); color: #fff; font-size: .6rem; font-weight: 900; border: 2px solid #fff; animation: mq-badge 1.8s var(--ease) infinite; }

/* =========================================================================
   ADAPTATIONS DE HAUTEUR — le contenu se comprime avant de disparaître
   ========================================================================= */
@media (max-height: 780px) {
	.mq-tuile small { display: none; }
	.mq-lede { display: none; }
}
@media (max-height: 680px) {
	
	.mq-nav button small { font-size: .58rem; }
}
@media (max-height: 600px) {
	.mq-demo { height: clamp(40px, 8vmin, 62px); }
	.mq-wordmark { font-size: clamp(1.25rem, 5vmin, 1.8rem); }
	.mq-vignette strong { display: none; }
}
@media (max-width: 380px) {
	.mq-profil-info strong { display: none; }
	.mq-answers.is-duo { grid-template-columns: 1fr; }
	.mq-stat small { font-size: .52rem; }
}
@media (min-width: 700px) {
	.mq-app { max-width: 560px; margin: 0 auto; width: 100%; }
	.mq-sheet-layer { left:50%; right:auto; width:min(560px,100%); transform:translateX(-50%); }
}

@media (max-height: 720px) {
	.mq-view[data-view="accueil"] .mq-demo { height: clamp(62px, 13vmin, 110px); }
	.mq-view[data-view="accueil"] .mq-wordmark { font-size: clamp(1.8rem, 7.2vmin, 3rem); }
	
	.mq-view[data-view="accueil"] .mq-play { min-height: 54px; }
}
@media (max-width: 430px) {
	.mq-top { gap: 5px; padding-inline: 7px; }
	.mq-profil-info strong { display: none; }
	.mq-play { width: 82%; }
}

/* Animations réduites */
.mq-shell[data-motion="calme"] *,
.mq-shell[data-motion="calme"] *::before,
.mq-shell[data-motion="calme"] *::after {
	animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .1s !important;
}
.mq-shell[data-motion="calme"] .mq-card { transition-duration: .22s !important; }
.mq-shell[data-motion="calme"] .mq-ambiance,
.mq-shell[data-motion="calme"] .mq-confettis,
.mq-shell[data-motion="calme"] .mq-fx-dot,
.mq-shell[data-motion="calme"] .mq-fx-rays,
.mq-shell[data-motion="calme"] .mq-fx-ring,
.mq-shell[data-motion="calme"] .mq-fx-ember,
.mq-shell[data-motion="calme"] .mq-fx-fly,
.mq-shell[data-motion="calme"] .mq-fx-flash,
.mq-shell[data-motion="calme"] .mq-fx-heat,
.mq-shell[data-motion="calme"] .mq-fx-aura,
.mq-shell[data-motion="calme"] .mq-fx-sweep,
.mq-shell[data-motion="calme"] .mq-fx-burst { display: none; }
.mq-shell[data-motion="calme"] .mq-fx-gain,
.mq-shell[data-motion="calme"] .mq-fx-combo { animation: mq-fx-calm .8s var(--sortie) forwards !important; }
.mq-shell[data-motion="calme"] .mq-board { animation: none !important; }

@media (prefers-reduced-motion: reduce) {
	.mq-shell *, .mq-shell *::before, .mq-shell *::after {
		animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .12s !important;
	}
	.mq-shell .mq-ambiance, .mq-shell .mq-confettis, .mq-shell .mq-fx-dot, .mq-shell .mq-fx-rays,
	.mq-shell .mq-fx-ring, .mq-shell .mq-fx-ember, .mq-shell .mq-fx-fly, .mq-shell .mq-fx-flash,
	.mq-shell .mq-fx-heat, .mq-shell .mq-fx-aura, .mq-shell .mq-fx-sweep, .mq-shell .mq-fx-burst { display: none; }
	.mq-shell .mq-fx-gain, .mq-shell .mq-fx-combo { animation: mq-fx-calm .8s var(--sortie) forwards !important; }
	.mq-shell .mq-board { animation: none !important; }
}

/* =========================================================================
   ACCUEIL 6.1.6 — composition fidèle à la maquette de référence
   Ce bloc est volontairement limité à l'écran Accueil afin de ne pas
   modifier la géométrie des écrans Histoire, Boutique et Réglages.
   ========================================================================= */
.mq-shell[data-screen="accueil"] {
	--home-blue-1: #20b8ee;
	--home-blue-2: #78d7f5;
	--home-blue-3: #d8f1fb;
	--home-cream: #fff1d2;
	background:
		radial-gradient(circle at 12% 24%, rgba(255,255,255,.32) 0 1px, transparent 2px),
		radial-gradient(circle at 86% 30%, rgba(255,255,255,.42) 0 1.4px, transparent 2.5px),
		linear-gradient(180deg, var(--home-blue-1) 0%, var(--home-blue-2) 24%, var(--home-blue-3) 53%, #eef8f1 72%, var(--home-cream) 100%);
	background-size: 128px 128px, 176px 176px, auto;
}
.mq-shell[data-screen="accueil"] .mq-ambiance i:nth-child(1) {
	width: 96vmax; height: 48vmax; left: -30vmax; top: -18vmax;
	background: radial-gradient(ellipse, rgba(255,255,255,.55) 0%, transparent 67%);
}
.mq-shell[data-screen="accueil"] .mq-ambiance i:nth-child(2) {
	right: -30vmax; top: 32vmax;
	background: radial-gradient(circle, rgba(255,255,255,.22) 0%, transparent 66%);
}
.mq-shell[data-screen="accueil"] .mq-ambiance i:nth-child(3) {
	left: -22vmax; bottom: -18vmax;
	background: radial-gradient(ellipse, rgba(255,218,137,.24) 0%, transparent 66%);
}

.mq-shell[data-screen="accueil"] .mq-app {
	gap: clamp(10px, 1.35vh, 15px);
	padding:
		max(clamp(14px, 2.25vh, 24px), env(safe-area-inset-top))
		clamp(11px, 3.05vw, 25px)
		max(clamp(12px, 1.8vh, 22px), env(safe-area-inset-bottom));
}

/* Bandeau supérieur : mêmes masses visuelles et même lecture que la capture. */
.mq-shell[data-screen="accueil"] .mq-top {
	min-height: 0;
	height: clamp(68px, 9.55vh, 92px);
	padding: clamp(7px, 1.05vh, 10px) clamp(9px, 2.2vw, 16px);
	gap: clamp(5px, 1.55vw, 11px);
	border: 1px solid rgba(255,255,255,.92);
	border-radius: clamp(26px, 7vw, 38px);
	background: rgba(255,255,255,.97);
	box-shadow: inset 0 1px 0 #fff, 0 7px 20px rgba(21,60,122,.15);
}
.mq-shell[data-screen="accueil"] .mq-avatar {
	width: clamp(48px, 6.5vh, 60px);
	height: clamp(48px, 6.5vh, 60px);
	font-size: clamp(1.18rem, 3.25vh, 1.65rem);
	border-width: 3px;
	box-shadow: 0 0 0 3px rgba(22,196,206,.23), inset 0 1px 0 rgba(255,255,255,.35);
}
.mq-shell[data-screen="accueil"] .mq-avatar b {
	right: -5px; bottom: -4px;
	min-width: clamp(21px, 2.8vh, 26px);
	height: clamp(21px, 2.8vh, 26px);
	font-size: clamp(.64rem, 1.45vh, .8rem);
	border-width: 2px;
}
.mq-shell[data-screen="accueil"] .mq-profil-info {
	justify-content: center;
	gap: 0;
	min-width: 40px;
}
.mq-shell[data-screen="accueil"] .mq-profil-info strong { display: none; }
.mq-shell[data-screen="accueil"] .mq-xp {
	height: clamp(8px, 1.25vh, 11px);
	background: #e5edf5;
	box-shadow: inset 0 1px 2px rgba(21,60,122,.08);
}
.mq-shell[data-screen="accueil"] .mq-xp i {
	background: linear-gradient(90deg, #16b8c7 0%, #34d0bd 100%);
}
.mq-shell[data-screen="accueil"] .mq-chip {
	gap: clamp(5px, 1.2vw, 9px);
	padding: 0;
	background: transparent;
	font-size: clamp(.95rem, 2.45vh, 1.28rem);
}
.mq-shell[data-screen="accueil"] .mq-chip .mq-coin {
	width: clamp(34px, 4.9vh, 45px);
	height: clamp(34px, 4.9vh, 45px);
	box-shadow: 0 3px 0 #d98816, 0 6px 12px rgba(232,149,28,.26), inset 0 2px 0 rgba(255,255,255,.5);
}
.mq-shell[data-screen="accueil"] .mq-chip .mq-coin svg { width: 45%; height: 45%; }
.mq-shell[data-screen="accueil"] .mq-chip b { min-width: 1.55em; text-align: center; }
.mq-shell[data-screen="accueil"] .mq-chip .mq-plus {
	width: clamp(32px, 4.45vh, 41px);
	height: clamp(32px, 4.45vh, 41px);
	font-size: clamp(1.1rem, 2.65vh, 1.45rem);
	box-shadow: 0 4px 10px rgba(15,163,180,.24), inset 0 1px 0 rgba(255,255,255,.45);
}
.mq-shell[data-screen="accueil"] .mq-icon-btn {
	width: clamp(37px, 4.8vh, 45px);
	height: clamp(37px, 4.8vh, 45px);
	background: transparent;
	box-shadow: none;
}
.mq-shell[data-screen="accueil"] .mq-icon-btn svg { width: 66%; height: 66%; stroke-width: 2.45; }

/* Zone centrale : logo vertical, grille compacte et bouton principal. */
.mq-shell[data-screen="accueil"] .mq-view[data-view="accueil"] {
	gap: clamp(9px, 1.2vh, 14px);
	overflow: visible;
}
.mq-shell[data-screen="accueil"] .mq-logo {
	flex: 0 0 clamp(245px, 31.7vh, 292px);
	justify-content: center;
	gap: clamp(3px, .55vh, 6px);
	padding-top: clamp(5px, .8vh, 9px);
}
.mq-shell[data-screen="accueil"] .mq-demo {
	height: clamp(112px, 14.7vh, 138px);
	gap: clamp(3px, .8vw, 7px);
	filter: drop-shadow(0 10px 16px rgba(21,60,122,.21));
}
.mq-shell[data-screen="accueil"] .mq-demo-card {
	height: 100%;
	transform: none;
	transform-origin: center;
	will-change: transform;
}
.mq-shell[data-screen="accueil"] .mq-demo-card.is-left,
.mq-shell[data-screen="accueil"] .mq-demo-card.is-right {
	transform: none;
	animation: mq-home-card-float 3.6s var(--ease) infinite alternate;
}
.mq-shell[data-screen="accueil"] .mq-demo-card.is-right {
	animation-delay: -.9s;
	z-index: 1;
}
@keyframes mq-home-card-float {
	from { transform: translateY(1px); }
	to { transform: translateY(-3px); }
}
.mq-shell[data-screen="accueil"] .mq-demo-face {
	border-radius: clamp(17px, 4vw, 24px);
	border-width: clamp(4px, .65vh, 6px);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.7), inset 0 -12px 18px rgba(21,60,122,.12), 0 6px 14px rgba(21,60,122,.10);
}
.mq-shell[data-screen="accueil"] .mq-demo-face svg { width: 43%; height: 43%; }
.mq-shell[data-screen="accueil"] .mq-demo-seal {
	top: 70%;
	width: clamp(45px, 6.3vh, 58px);
	opacity: 1;
	animation: mq-home-seal 2.8s ease-in-out infinite;
	box-shadow: 0 0 0 4px rgba(255,255,255,.9), 0 7px 14px rgba(21,60,122,.25), inset 0 2px 1px rgba(255,255,255,.55);
}
@keyframes mq-home-seal {
	0%,100% { transform: translate(-50%, -50%) scale(.97); }
	50% { transform: translate(-50%, -53%) scale(1.03); }
}
.mq-shell[data-screen="accueil"] .mq-wordmark {
	font-size: clamp(2.15rem, 5.25vh, 3.2rem);
	line-height: .98;
	margin-top: clamp(4px, .65vh, 7px);
	text-shadow: 0 2px 5px rgba(21,60,122,.06);
}

.mq-shell[data-screen="accueil"] .mq-play {
	width: min(75%, 590px);
	min-height: 0;
	height: clamp(66px, 8.75vh, 82px);
	font-size: clamp(1.28rem, 3.7vh, 1.9rem);
	gap: clamp(12px, 3vw, 20px);
	border-radius: 999px;
	box-shadow: 0 6px 0 #1768c0, 0 13px 26px rgba(31,106,192,.34);
}
.mq-shell[data-screen="accueil"] .mq-play svg { width: 1.05em; height: 1.05em; }

/* Navigation basse : grande, lisible et stable comme sur la référence. */
.mq-shell[data-screen="accueil"] .mq-nav {
	height: clamp(78px, 10.7vh, 98px);
	padding: clamp(7px, 1.05vh, 10px);
	gap: clamp(3px, 1vw, 8px);
	border: 1px solid rgba(255,255,255,.92);
	border-radius: clamp(27px, 7vw, 38px);
	background: rgba(255,255,255,.97);
	box-shadow: inset 0 1px 0 #fff, 0 8px 21px rgba(21,60,122,.15);
}
.mq-shell[data-screen="accueil"] .mq-nav button {
	gap: clamp(3px, .55vh, 6px);
	padding: clamp(7px, 1vh, 10px) 3px clamp(9px, 1.2vh, 12px);
	border-radius: clamp(18px, 4.7vw, 25px);
}
.mq-shell[data-screen="accueil"] .mq-nav button svg {
	width: clamp(25px, 3.5vh, 33px);
	height: clamp(25px, 3.5vh, 33px);
	stroke-width: 2.25;
}
.mq-shell[data-screen="accueil"] .mq-nav button small {
	font-size: clamp(.65rem, 1.55vh, .82rem);
	line-height: 1;
}
.mq-shell[data-screen="accueil"] .mq-nav button.is-on {
	background: linear-gradient(155deg, #e8f7ff 0%, #ddecfb 100%);
}
.mq-shell[data-screen="accueil"] .mq-nav button.is-on::after {
	bottom: clamp(5px, .65vh, 7px);
	width: clamp(22px, 6vw, 33px);
	height: 4px;
}

/* Téléphones étroits : préserver la hiérarchie sans écraser les commandes. */
@media (max-width: 370px) {
	.mq-shell[data-screen="accueil"] .mq-top { gap: 4px; padding-inline: 7px; }
	.mq-shell[data-screen="accueil"] .mq-avatar { width: 46px; height: 46px; }
	.mq-shell[data-screen="accueil"] .mq-chip { gap: 3px; }
	.mq-shell[data-screen="accueil"] .mq-chip .mq-coin { width: 32px; height: 32px; }
	.mq-shell[data-screen="accueil"] .mq-chip .mq-plus { width: 30px; height: 30px; }
	.mq-shell[data-screen="accueil"] .mq-icon-btn { width: 34px; height: 34px; }
	.mq-shell[data-screen="accueil"] .mq-logo { flex-basis: clamp(225px, 31vh, 250px); }
	.mq-shell[data-screen="accueil"] .mq-play { width: 79%; }
}

/* Écrans bas : réduire les espacements avant les éléments eux-mêmes. */
@media (max-height: 700px) {
	.mq-shell[data-screen="accueil"] .mq-app { gap: 7px; padding-top: max(8px, env(safe-area-inset-top)); padding-bottom: max(8px, env(safe-area-inset-bottom)); }
	.mq-shell[data-screen="accueil"] .mq-top { height: 62px; }
	.mq-shell[data-screen="accueil"] .mq-logo { flex-basis: 205px; }
	.mq-shell[data-screen="accueil"] .mq-demo { height: 92px; }
	.mq-shell[data-screen="accueil"] .mq-wordmark { font-size: 2rem; }
	.mq-shell[data-screen="accueil"] .mq-tagline { font-size: .84rem; }
	.mq-shell[data-screen="accueil"] .mq-tuile span { width: 37px; height: 37px; }
	.mq-shell[data-screen="accueil"] .mq-tuile strong { font-size: .8rem; }
	.mq-shell[data-screen="accueil"] .mq-play { height: 56px; }
	.mq-shell[data-screen="accueil"] .mq-nav { height: 66px; }
}

@media (min-width: 600px) {
	
}

@media (max-height: 650px) {
	.mq-shell[data-screen="accueil"] .mq-app {
		gap: 5px;
		padding-top: max(6px, env(safe-area-inset-top));
		padding-bottom: max(6px, env(safe-area-inset-bottom));
	}
	.mq-shell[data-screen="accueil"] .mq-top { height: 56px; }
	.mq-shell[data-screen="accueil"] .mq-avatar { width: 42px; height: 42px; font-size: 1rem; }
	.mq-shell[data-screen="accueil"] .mq-avatar b { min-width: 19px; height: 19px; }
	.mq-shell[data-screen="accueil"] .mq-chip .mq-coin { width: 29px; height: 29px; }
	.mq-shell[data-screen="accueil"] .mq-chip .mq-plus { width: 28px; height: 28px; }
	.mq-shell[data-screen="accueil"] .mq-icon-btn { width: 31px; height: 31px; }
	.mq-shell[data-screen="accueil"] .mq-view[data-view="accueil"] { gap: 6px; }
	.mq-shell[data-screen="accueil"] .mq-logo { flex-basis: 174px; padding-top: 0; gap: 2px; }
	.mq-shell[data-screen="accueil"] .mq-demo { height: 76px; }
	.mq-shell[data-screen="accueil"] .mq-demo-seal { width: 35px; }
	.mq-shell[data-screen="accueil"] .mq-wordmark { font-size: 1.75rem; margin-top: 2px; }
	
	
	
	
	
	
	.mq-shell[data-screen="accueil"] .mq-play { height: 50px; min-height: 50px; font-size: 1.08rem; }
	.mq-shell[data-screen="accueil"] .mq-nav { height: 58px; padding: 5px; }
	.mq-shell[data-screen="accueil"] .mq-nav button { padding: 4px 2px 7px; gap: 1px; border-radius: 14px; }
	.mq-shell[data-screen="accueil"] .mq-nav button svg { width: 20px; height: 20px; }
	.mq-shell[data-screen="accueil"] .mq-nav button small { font-size: .56rem; }
	.mq-shell[data-screen="accueil"] .mq-nav button.is-on::after { bottom: 3px; height: 3px; }
}

/* L'accueil de référence reste bleu, même lorsqu'un autre habillage est choisi pour le jeu. */
.mq-shell[data-screen="accueil"] .mq-avatar {
	background: linear-gradient(145deg, #16c4ce 0%, #2e86e0 100%);
}
.mq-shell[data-screen="accueil"] .mq-avatar b,
.mq-shell[data-screen="accueil"] .mq-chip .mq-plus {
	background: #16c4ce;
}
.mq-shell[data-screen="accueil"] .mq-wordmark span { color: #16c4ce; }
.mq-shell[data-screen="accueil"] .mq-wordmark b { color: #153c7a; }
.mq-shell[data-screen="accueil"] .mq-play {
	color: #fff;
	background-color: #2287dd;
	background-image: linear-gradient(105deg, #16c4ce 0%, #2e86e0 100%);
	box-shadow: 0 6px 0 #1768c0, 0 13px 26px rgba(31,106,192,.34);
}
.mq-shell[data-screen="accueil"] .mq-nav button.is-on { color: #0fa3b4; }
.mq-shell[data-screen="accueil"] .mq-nav button.is-on::after { background: #16c4ce; }

/* Bandeau et navigation du parcours : proportions des maquettes 9:16. */
.mq-shell:not([data-screen="accueil"]) .mq-top {
	min-height:clamp(62px,8.7vh,78px);
	padding:clamp(7px,1.1vh,11px) clamp(10px,2.6vw,15px);
	gap:clamp(6px,1.8vw,10px);
	border-radius:clamp(24px,7vw,34px);
	box-shadow:inset 0 2px 1px rgba(255,255,255,.96),0 10px 25px rgba(21,60,122,.14);
}
.mq-shell:not([data-screen="accueil"]) .mq-avatar { width:clamp(49px,13vw,58px);height:clamp(49px,13vw,58px);font-size:clamp(1.12rem,5vw,1.45rem);border-width:3px; }
.mq-shell:not([data-screen="accueil"]) .mq-avatar b { min-width:22px;height:22px;font-size:.68rem; }
.mq-shell:not([data-screen="accueil"]) .mq-profil-info strong { display:none; }
.mq-shell:not([data-screen="accueil"]) .mq-profil-info { justify-content:center; }
.mq-shell:not([data-screen="accueil"]) .mq-xp { height:clamp(8px,1.15vh,11px); }
.mq-shell:not([data-screen="accueil"]) .mq-chip { font-size:clamp(.95rem,4vw,1.18rem);gap:6px;background:transparent;padding-inline:2px; }
.mq-shell:not([data-screen="accueil"]) .mq-chip .mq-coin { width:clamp(36px,9.5vw,43px);height:clamp(36px,9.5vw,43px); }
.mq-shell:not([data-screen="accueil"]) .mq-chip .mq-plus { width:clamp(34px,9vw,40px);height:clamp(34px,9vw,40px);font-size:1.35em; }
.mq-shell:not([data-screen="accueil"]) .mq-icon-btn { width:clamp(38px,9.8vw,44px);height:clamp(38px,9.8vw,44px);background:transparent; }
.mq-shell:not([data-screen="accueil"]) .mq-icon-btn svg { width:62%;height:62%;stroke-width:2.5; }
.mq-shell[data-screen="miseEnPlace"] .mq-app { gap:clamp(8px,1.05vh,11px);padding:max(10px,env(safe-area-inset-top)) clamp(10px,2.6vw,16px) max(10px,env(safe-area-inset-bottom)); }
.mq-shell[data-screen="miseEnPlace"] .mq-nav { min-height:clamp(70px,9.2vh,82px);padding:clamp(6px,.8vh,9px);border-radius:clamp(25px,7vw,34px);box-shadow:0 12px 28px rgba(21,60,122,.16); }
.mq-shell[data-screen="miseEnPlace"] .mq-nav button { gap:3px;padding:clamp(7px,.8vh,10px) 3px clamp(10px,1.2vh,13px);border-radius:clamp(17px,4.8vw,23px); }
.mq-shell[data-screen="miseEnPlace"] .mq-nav button svg { width:clamp(25px,6.8vw,31px);height:clamp(25px,6.8vw,31px);stroke-width:2.45; }
.mq-shell[data-screen="miseEnPlace"] .mq-nav button small { font-size:clamp(.68rem,2.8vw,.86rem); }
.mq-shell[data-screen="miseEnPlace"] .mq-nav button.is-on::after { width:clamp(23px,6vw,29px);height:4px;bottom:4px; }

/* Ajustement final de fidélité visuelle aux captures validées. */
.mq-view[data-view="miseEnPlace"] > .mq-setup-head { flex:0 0 96px; }

.mq-view[data-view="miseEnPlace"] > .mq-setup-foot { flex:0 0 auto; }

.mq-view[data-view="miseEnPlace"] .mq-carreau { background:linear-gradient(145deg,#fff 0%,#f7fbff 100%); }
.mq-view[data-view="miseEnPlace"] .mq-carreau[aria-checked="true"] { background:linear-gradient(145deg,#fff 0%,#effefd 100%); }

.mq-view[data-view="miseEnPlace"] .mq-format-card strong { font-size:clamp(1rem,4.2vw,1.32rem); }
.mq-view[data-view="miseEnPlace"] .mq-format-card small { font-size:clamp(.7rem,2.8vw,.9rem); }
.mq-view[data-view="miseEnPlace"] .mq-mini-grille { padding:clamp(9px,2.65vw,12px); }
.mq-view[data-view="miseEnPlace"] .mq-mini-grille i { width:clamp(8px,2.35vw,11px); }

@media (max-width:480px), (max-height:700px) {
  .mq-view[data-view="miseEnPlace"] > .mq-setup-head { flex-basis:76px; }
  
  
  
  
}

/* Structure verticale exacte des maquettes : retour, titre, puis progression. */
.mq-view[data-view="miseEnPlace"] .mq-setup-head {
  grid-template-columns:1fr;
  grid-template-areas:"back" "copy" "steps";
  align-items:start;
  row-gap:clamp(7px,1vh,11px);
  padding-inline:clamp(8px,2vw,12px);
}
.mq-view[data-view="miseEnPlace"] > .mq-setup-head { flex-basis:122px; }

.mq-view[data-view="miseEnPlace"] .mq-setup-back { align-self:start; }
.mq-view[data-view="miseEnPlace"] .mq-setup-copy { align-self:start;padding-left:clamp(2px,.6vw,4px); }
.mq-view[data-view="miseEnPlace"] .mq-setup-steps { padding-left:clamp(2px,.6vw,4px); }
.mq-view[data-view="miseEnPlace"] .mq-setup-copy .mq-title { font-size:clamp(1.92rem,7.8vw,2.38rem); }

.mq-shell[data-screen="miseEnPlace"] .mq-avatar { width:clamp(54px,14vw,60px);height:clamp(54px,14vw,60px); }
.mq-shell[data-screen="miseEnPlace"] .mq-profil-info { min-width:62px; }
.mq-shell[data-screen="miseEnPlace"] .mq-chip .mq-coin { width:clamp(38px,10vw,44px);height:clamp(38px,10vw,44px); }
.mq-shell[data-screen="miseEnPlace"] .mq-chip .mq-plus { width:clamp(36px,9.5vw,42px);height:clamp(36px,9.5vw,42px); }
@media (max-width:480px), (max-height:700px) {
  .mq-view[data-view="miseEnPlace"] > .mq-setup-head { flex-basis:88px; }
  
  .mq-view[data-view="miseEnPlace"] .mq-setup-head { row-gap:4px; }
  .mq-view[data-view="miseEnPlace"] .mq-setup-back { width:38px;height:38px; }
  .mq-view[data-view="miseEnPlace"] .mq-setup-copy .mq-title { font-size:1.52rem; }
  
}

@media (max-width:480px), (max-height:700px) {
  
  
}

/* =========================================================================
   PATCH 6.3.2 — netteté de la section "mise en place"
   Objectif: supprimer l'effet flou/perlé de cette section uniquement.
   ========================================================================= */
.mq-view[data-view="miseEnPlace"]::before {
  background:
    radial-gradient(circle at 88% 20%, rgba(255,255,255,.16), transparent 22%),
    linear-gradient(155deg, transparent 0 40%, rgba(255,255,255,.06) 40.4% 40.8%, transparent 41.2% 100%);
}
.mq-view[data-view="miseEnPlace"] .mq-setup-back {
  background: #fff;
  border-color: rgba(235,244,250,.98);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 6px 16px rgba(21,60,122,.10);
}
.mq-view[data-view="miseEnPlace"] .mq-carreau {
  background: #fff;
  border-color: rgba(236,244,249,.98);
  box-shadow: 0 10px 24px rgba(21,60,122,.11), 0 2px 4px rgba(21,60,122,.05);
}
.mq-view[data-view="miseEnPlace"] .mq-carreau::before {
  background: linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,0) 42%);
  opacity: .45;
}
.mq-view[data-view="miseEnPlace"] .mq-carreau[aria-checked="true"] {
  box-shadow: 0 0 0 2px rgba(22,196,206,.20), 0 12px 26px rgba(15,163,180,.16);
}

.mq-view[data-view="miseEnPlace"] .mq-setup-grid,
.mq-view[data-view="miseEnPlace"] .mq-setup-head,
.mq-view[data-view="miseEnPlace"] .mq-setup-foot {
  filter: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* =========================================================================
   PARAMÈTRES PREMIUM 6.3.3 — reproduction fonctionnelle de la maquette
   ========================================================================= */
.mq-view[data-view="reglages"] {
	gap: clamp(8px, 1.05vh, 12px);
	overflow: hidden;
}
.mq-settings-head {
	padding: clamp(3px, .55vh, 7px) clamp(5px, 1.4vw, 10px) 0;
}
.mq-settings-head .mq-eyebrow {
	margin: 0 0 clamp(4px, .6vh, 7px);
	font-size: clamp(.74rem, 3vw, .92rem);
	letter-spacing: .16em;
	color: #0fa3b4;
}
.mq-settings-head .mq-title {
	margin: 0;
	font-size: clamp(1.7rem, 7.2vw, 2.25rem);
	line-height: 1;
	letter-spacing: -.045em;
	color: #153c7a;
}
.mq-settings-scroll {
	padding: 1px 3px 5px;
	scrollbar-width: none;
}
.mq-settings-scroll::-webkit-scrollbar { display: none; }
.mq-settings-list {
	display: flex;
	flex-direction: column;
	gap: clamp(7px, .9vh, 10px);
	padding: 1px 0 5px;
}
.mq-settings-row,
.mq-theme-panel {
	position: relative;
	flex: 0 0 auto;
	border-radius: clamp(21px, 5.7vw, 28px);
	background: #fff;
	border: 1px solid rgba(234,243,249,.98);
	box-shadow: 0 8px 20px rgba(21,60,122,.10), 0 2px 4px rgba(21,60,122,.04);
}
.mq-settings-row {
	display: grid;
	grid-template-columns: clamp(42px, 11.5vw, 54px) minmax(0,1fr) auto;
	align-items: center;
	gap: clamp(10px, 2.8vw, 15px);
	min-height: clamp(66px, 8.9vh, 82px);
	padding: clamp(9px, 1.25vh, 13px) clamp(12px, 3.4vw, 18px);
	text-align: left;
}
button.mq-settings-row:active { transform: scale(.99); }
.mq-settings-icon {
	width: clamp(40px, 10.7vw, 50px);
	aspect-ratio: 1;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #13b9c5;
	background: linear-gradient(145deg,#f6fcfe,#e7f3f7);
	box-shadow: inset 0 1px 0 #fff, 0 4px 10px rgba(21,60,122,.07);
}
.mq-settings-icon svg { width: 50%; height: 50%; stroke-width: 2.45; }
.mq-settings-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.mq-settings-copy strong {
	font-size: clamp(.96rem, 3.9vw, 1.22rem);
	font-weight: 950;
	line-height: 1.05;
	color: #153c7a;
}
.mq-settings-copy small {
	font-size: clamp(.68rem, 2.75vw, .87rem);
	font-weight: 760;
	line-height: 1.16;
	color: #55719c;
}
.mq-settings-open {
	width: clamp(34px, 9vw, 42px);
	aspect-ratio: 1;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #2e86e0;
	background: #eef7fc;
}
.mq-settings-open svg { width: 45%; height: 45%; stroke-width: 3; }
.mq-privacy-center { display:grid;gap:8px; }
.mq-privacy-center > p { margin:0 0 2px;color:var(--encre-2);font-size:.73rem;line-height:1.45;font-weight:720; }
.mq-privacy-center > button { width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) 28px;align-items:center;gap:10px;padding:10px;border:1px solid rgba(61,142,199,.16);border-radius:16px;background:#f4f9fd;color:var(--encre);text-align:left; }
.mq-privacy-center > button > span { width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#eaf8ff,#d9edf9);color:var(--bleu); }
.mq-privacy-center > button > span svg { width:22px;height:22px; }
.mq-privacy-center > button > b { min-width:0;display:grid;gap:3px;font-weight:inherit; }
.mq-privacy-center > button strong { font-size:.75rem;font-weight:950; }
.mq-privacy-center > button small { color:var(--encre-2);font-size:.58rem;line-height:1.3;font-weight:720; }
.mq-privacy-center > button > i { display:grid;place-items:center;color:var(--encre-2); }
.mq-privacy-center > button > i svg { width:17px;height:17px; }
.mq-privacy-center > button.is-danger { border-color:rgba(178,54,76,.18);background:#fff7f8; }
.mq-privacy-center > button.is-danger > span,.mq-privacy-center > button.is-danger > i { color:#a43145; }
.mq-delete-online-copy { display:grid;gap:10px; }
.mq-delete-online-copy p { margin:0;color:var(--encre-2);font-size:.75rem;line-height:1.5;font-weight:720; }
.mq-delete-online-copy strong { color:var(--encre); }
.mq-view[data-view="reglages"] .mq-switch {
	width: clamp(48px, 13vw, 58px);
	height: clamp(28px, 7.4vw, 34px);
	background: #dfe7ef;
	box-shadow: inset 0 2px 4px rgba(21,60,122,.08);
}
.mq-view[data-view="reglages"] .mq-switch i {
	top: 3px;
	left: 3px;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	max-width: clamp(22px, 6.3vw, 28px);
	box-shadow: 0 3px 7px rgba(21,60,122,.22);
}
.mq-view[data-view="reglages"] .mq-settings-row[aria-pressed="true"] .mq-switch {
	background: linear-gradient(115deg,#11c8cf,#24bfae);
}
.mq-view[data-view="reglages"] .mq-settings-row[aria-pressed="true"] .mq-switch i {
	transform: translateX(clamp(20px, 5.5vw, 25px));
}
.mq-volume-row { grid-template-columns: clamp(42px, 11.5vw, 54px) minmax(0,1fr) auto; }
.mq-volume-copy { gap: clamp(6px, .8vh, 9px); }
.mq-volume-value {
	min-width: 46px;
	text-align: right;
	font-size: clamp(.95rem, 3.8vw, 1.18rem);
	font-weight: 950;
	font-variant-numeric: tabular-nums;
	color: #153c7a;
}
.mq-view[data-view="reglages"] .mq-range {
	width: 100%;
	height: 18px;
	margin: 0;
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	cursor: pointer;
}
.mq-view[data-view="reglages"] .mq-range::-webkit-slider-runnable-track {
	height: 7px;
	border-radius: 999px;
	background: linear-gradient(90deg,#18c5cb 0 var(--range),#dfe7ef var(--range) 100%);
	box-shadow: inset 0 1px 2px rgba(21,60,122,.08);
}
.mq-view[data-view="reglages"] .mq-range::-webkit-slider-thumb {
	appearance: none;
	-webkit-appearance: none;
	width: 22px;
	height: 22px;
	margin-top: -7.5px;
	border: 0;
	border-radius: 50%;
	background: #19bdc8;
	box-shadow: 0 3px 7px rgba(15,163,180,.28);
}
.mq-view[data-view="reglages"] .mq-range::-moz-range-track {
	height: 7px;
	border-radius: 999px;
	background: #dfe7ef;
}
.mq-view[data-view="reglages"] .mq-range::-moz-range-progress {
	height: 7px;
	border-radius: 999px;
	background: #18c5cb;
}
.mq-view[data-view="reglages"] .mq-range::-moz-range-thumb {
	width: 22px;
	height: 22px;
	border: 0;
	border-radius: 50%;
	background: #19bdc8;
	box-shadow: 0 3px 7px rgba(15,163,180,.28);
}
.mq-theme-panel { padding: clamp(11px, 1.45vh, 15px) clamp(10px, 2.8vw, 15px) clamp(10px, 1.4vh, 14px); }
.mq-theme-heading {
	display: grid;
	grid-template-columns: clamp(42px, 11.5vw, 54px) minmax(0,1fr);
	align-items: center;
	gap: clamp(10px, 2.8vw, 15px);
	margin-bottom: clamp(9px, 1.2vh, 13px);
}
.mq-theme-grid {
	display: grid;
	grid-template-columns: repeat(6,minmax(0,1fr));
	gap: clamp(4px, 1.3vw, 7px);
	align-items: stretch;
}
.mq-theme-option {
	position: relative;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: clamp(4px, .55vh, 6px);
	align-items: center;
	padding: clamp(3px, .8vw, 5px) clamp(2px, .55vw, 4px) clamp(6px, .75vh, 8px);
	border-radius: clamp(12px, 3.4vw, 17px);
	background: #fff;
	border: 2px solid #edf2f6;
	box-shadow: 0 4px 10px rgba(21,60,122,.09);
	transition: transform .18s var(--ressort), border-color .2s, box-shadow .2s;
}
.mq-theme-option:active { transform: scale(.96); }
.mq-theme-option.is-active {
	border-color: #16c4ce;
	box-shadow: 0 0 0 2px rgba(22,196,206,.16), 0 6px 14px rgba(15,163,180,.17);
}
.mq-theme-option.is-active::after {
	content: "";
	position: absolute;
	top: -7px;
	right: -5px;
	width: clamp(20px, 5.4vw, 26px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: #16c4ce url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") center/58% no-repeat;
	box-shadow: 0 4px 9px rgba(15,163,180,.30);
	z-index: 3;
}
.mq-theme-image {
	width: 100%;
	aspect-ratio: 4/5;
	border-radius: clamp(8px, 2.3vw, 12px);
	overflow: hidden;
	background: #dcecf7;
}
.mq-theme-image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.mq-theme-option strong {
	max-width: 100%;
	font-size: clamp(.54rem, 2.1vw, .72rem);
	font-weight: 900;
	line-height: 1;
	color: #153c7a;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.mq-reset-row { min-height: clamp(70px, 9.4vh, 86px); }
.mq-danger-icon { color: #ef4545; background: linear-gradient(145deg,#fff8f8,#ffeaea); }
.mq-reset-button {
	min-width: clamp(74px, 19vw, 94px);
	min-height: 38px;
	padding: 7px 13px !important;
	border: 2px solid var(--mq-error) !important;
	border-radius: 999px;
	color: var(--mq-error) !important;
	background: var(--mq-surface-raised) !important;
	font-size: clamp(.76rem, 2.9vw, .94rem) !important;
	font-weight: 900 !important;
}
.mq-settings-foot {
	display: grid;
	grid-template-columns: 1fr minmax(150px,1.45fr) 1fr;
	align-items: center;
	gap: 8px;
	padding: 0 3px 2px;
}
.mq-settings-foot > small {
	grid-column: 1;
	font-size: clamp(.63rem, 2.35vw, .78rem);
	font-weight: 850;
	color: #153c7a;
	white-space: nowrap;
}
.mq-settings-back {
	grid-column: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 11px;
	min-height: clamp(48px, 6.4vh, 58px);
	padding: 9px 22px !important;
	border-radius: 999px;
	background: var(--mq-surface-raised) !important;
	box-shadow: var(--mq-shadow-soft) !important;
	font-size: clamp(1rem, 3.9vw, 1.25rem) !important;
	font-weight: 950 !important;
	color: var(--mq-text) !important;
}
.mq-settings-back svg { width: 22px; height: 22px; stroke-width: 2.8; }

@media (max-height: 720px) {
	.mq-settings-head .mq-title { font-size: 1.45rem; }
	.mq-settings-row { min-height: 58px; padding-block: 7px; }
	.mq-settings-copy strong { font-size: .9rem; }
	.mq-settings-copy small { font-size: .64rem; }
	.mq-settings-icon { width: 38px; }
	.mq-theme-panel { padding-block: 8px; }
	.mq-theme-heading { margin-bottom: 7px; }
	.mq-settings-foot { grid-template-columns: .9fr 1.35fr .9fr; }
	.mq-settings-back { min-height: 44px; }
}
@media (max-width: 350px) {
	.mq-settings-row { grid-template-columns: 38px minmax(0,1fr) auto; gap: 8px; padding-inline: 10px; }
	.mq-settings-icon { width: 36px; }
	.mq-settings-copy small { font-size: .61rem; }
	.mq-theme-option { border-width: 1.5px; padding-inline: 1px; }
	.mq-theme-option strong { font-size: .5rem; }
	.mq-reset-button { min-width: 66px; padding-inline: 9px !important; }
}

/* =========================================================================
   MemoQuest 6.4.0 — légende premium sur chaque carte retournée
   ========================================================================= */
.mq-board .mq-front,
.mq-board[data-category="animaux"] .mq-front {
  padding: 0;
  gap: 0;
  background: #0d4565;
  overflow: hidden;
}
.mq-board .mq-front img,
.mq-board[data-category="animaux"] .mq-front img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  filter: none;
}
.mq-board .mq-front > .mq-card-name,
.mq-board[data-category="animaux"] .mq-front > .mq-card-name,
.mq-card-preview-surface > .mq-card-name {
  position: absolute;
  z-index: 3;
  left: 4%;
  right: 4%;
  bottom: 4%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 17%;
  max-height: 39%;
  padding: clamp(2px, .42vmin, 5px) clamp(3px, .65vmin, 7px);
  border: 1px solid rgba(255,255,255,.34);
  border-radius: clamp(5px, 1.1vmin, 10px);
  background: linear-gradient(180deg, rgba(4,25,49,.54), rgba(4,25,49,.86));
  color: #fff;
  font-size: clamp(6px, 1.32vmin, 12px);
  font-weight: 950;
  line-height: 1.04;
  letter-spacing: -.018em;
  text-align: center;
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
  overflow-wrap: anywhere;
  text-shadow: 0 1px 2px rgba(0,0,0,.95), 0 0 5px rgba(0,0,0,.58);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 2px 7px rgba(0,0,0,.24);
}
.mq-board .mq-card-name.is-long,
.mq-card-preview-surface .mq-card-name.is-long { font-size: clamp(5.5px, 1.12vmin, 10px); }
.mq-board .mq-card-name.is-very-long,
.mq-card-preview-surface .mq-card-name.is-very-long { font-size: clamp(5px, .98vmin, 9px); line-height: 1; }
.mq-card-preview-surface img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mq-card-preview-surface .mq-card-fallback { display:none; }
.mq-card-preview-surface.is-image-error .mq-card-fallback { display:flex; }

/* =========================================================================
   MemoQuest 6.4.1 — nom de carte léger et lisible
   Suppression du bandeau sombre : texte directement sur l'image avec une
   ombre discrète, sans masquer le visuel de la carte.
   ========================================================================= */
.mq-board .mq-front > .mq-card-name,
.mq-board[data-category="animaux"] .mq-front > .mq-card-name,
.mq-card-preview-surface > .mq-card-name {
  left: 5%;
  right: 5%;
  bottom: 4%;
  min-height: 0;
  max-height: 31%;
  padding: 0 1px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #fff;
  font-size: clamp(6.5px, 1.38vmin, 12px);
  font-weight: 950;
  line-height: 1.06;
  letter-spacing: -.014em;
  text-shadow: 0 1px 2px rgba(0,0,0,.82), 0 0 2px rgba(0,0,0,.45);
}
.mq-board .mq-card-name.is-long,
.mq-card-preview-surface .mq-card-name.is-long {
  font-size: clamp(6px, 1.2vmin, 10.5px);
}
.mq-board .mq-card-name.is-very-long,
.mq-card-preview-surface .mq-card-name.is-very-long {
  font-size: clamp(5.5px, 1.06vmin, 9.5px);
  line-height: 1.02;
}

/* Audio 6.5.0 — ligne musique intégrée sans modifier la hiérarchie visuelle. */
@media (max-height: 700px) {
  .mq-settings-list { gap: clamp(6px, .8vh, 9px); }
  .mq-settings-row[data-toggle="music"] { min-height: 62px; }
}

/* =========================================================================
   MemoQuest 6.5.2 — volumes audio indépendants
   ========================================================================= */
.mq-view[data-view="reglages"] .mq-audio-volume-row {
  min-height: clamp(62px, 8.3vh, 76px);
  transition: opacity .2s var(--ease), filter .2s var(--ease);
}
.mq-view[data-view="reglages"] .mq-audio-volume-row.is-disabled {
  opacity: .55;
  filter: saturate(.45);
}
.mq-view[data-view="reglages"] .mq-audio-volume-row.is-disabled .mq-range {
  cursor: not-allowed;
}
@media (max-height: 720px) {
  .mq-view[data-view="reglages"] .mq-audio-volume-row { min-height: 54px; }
}

/* =========================================================================
   MULTIJOUEUR EN LIGNE 6.6.1 — parcours premium stabilisé
   ========================================================================= */
.mq-view[data-view="online"] {
	gap: clamp(7px, 1.05vh, 12px);
	overflow: hidden;
}
.mq-online-head {
	flex: 0 0 auto;
	display: grid;
	grid-template-columns: clamp(44px, 11vw, 56px) minmax(0, 1fr);
	align-items: center;
	gap: clamp(9px, 2.5vw, 15px);
	padding: 2px 4px 0;
}
.mq-online-head .mq-setup-back { grid-area: auto; }
.mq-online-head .mq-title { margin: 2px 0 0; font-size: clamp(1.48rem, 6.2vw, 2.15rem); line-height: 1.02; }
.mq-online-center { flex: 1 1 auto; min-height: 0; display: flex; align-items: center; justify-content: center; }
.mq-online-hub,
.mq-online-form { flex: 1 1 auto; min-height: 0; display: grid; align-content: center; gap: clamp(9px, 1.25vh, 14px); padding: 2px 3px; }

.mq-online-resume { min-height:76px;grid-template-columns:44px minmax(0,1fr) 23px;border-color:rgba(22,196,206,.48);background:linear-gradient(100deg,#f1fffc,#fff); }
.mq-online-resume > span { width:42px; }

.mq-online-age-card,
.mq-online-form-card,
.mq-waiting-card,
.mq-room-preview,
.mq-launch-error {
	width:100%;
	padding:clamp(17px,3vh,28px) clamp(15px,4.2vw,27px);
	border-radius:clamp(24px,6.2vw,33px);
	background:rgba(255,255,255,.975);
	border:2px solid rgba(235,245,250,.98);
	box-shadow:0 15px 34px rgba(21,60,122,.135),inset 0 1px 0 #fff;
}
.mq-online-age-card { display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(10px,1.5vh,15px); }
.mq-online-age-card h3 { margin:0;font-size:clamp(1.22rem,5.1vw,1.66rem);font-weight:950;color:#153c7a; }
.mq-online-age-card p { margin:0;color:#55719c;font-size:clamp(.75rem,2.9vw,.93rem);max-width:36rem; }
.mq-online-hero-icon { width:clamp(66px,18vw,86px);aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;background:var(--degrade);border:4px solid #fff;box-shadow:0 10px 22px rgba(21,60,122,.2),0 0 0 3px rgba(22,196,206,.15); }
.mq-online-hero-icon svg { width:48%;height:48%;stroke-width:2.3; }
.mq-dob-field { width:min(100%,380px);display:grid;gap:7px;text-align:left; }
.mq-dob-field > span,.mq-premium-field > span,.mq-code-field > span { color:#55719c;font-size:.74rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase; }
.mq-dob-field input,
.mq-premium-field input,
.mq-premium-field select {
	width:100%;height:clamp(51px,7vh,61px);border:2px solid #dceaf4;border-radius:17px;background:#f8fcff;color:#153c7a;
	padding:0 15px;font:900 clamp(.98rem,3.9vw,1.22rem)/1 ui-rounded,"SF Pro Rounded",system-ui,sans-serif;outline:0;
	box-shadow:inset 0 2px 4px rgba(21,60,122,.04);transition:border-color .2s,box-shadow .2s,background .2s;
}
.mq-dob-field input { text-align:center;letter-spacing:.16em;font-size:clamp(1.32rem,5.8vw,1.8rem); }
.mq-dob-field input:focus,.mq-premium-field input:focus,.mq-premium-field select:focus { border-color:#16c4ce;background:#fff;box-shadow:0 0 0 4px rgba(22,196,206,.13); }
.mq-form-error { min-height:18px;margin:0;color:#d63f4f;font-size:.74rem;font-weight:850;text-align:center; }

.mq-online-form-card { display:grid;gap:clamp(11px,1.55vh,15px);align-content:center; }
.mq-online-form-card > .mq-online-hero-icon { margin:0 auto 2px; }
.mq-online-form-card.is-compact { padding-block:clamp(13px,1.9vh,20px);gap:10px; }
.mq-premium-field { min-width:0;display:grid;gap:6px;text-align:left; }
.mq-premium-field select { appearance:none;background-image:linear-gradient(45deg,transparent 50%,#6681a7 50%),linear-gradient(135deg,#6681a7 50%,transparent 50%);background-position:calc(100% - 18px) 48%,calc(100% - 12px) 48%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:36px;font-size:clamp(.86rem,3.3vw,1.03rem); }
.mq-online-name-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.mq-privacy-check { display:grid;grid-template-columns:28px minmax(0,1fr);align-items:center;gap:10px;color:#55719c;font-size:clamp(.71rem,2.7vw,.87rem);line-height:1.25;cursor:pointer; }
.mq-privacy-check input { position:absolute;opacity:0;pointer-events:none; }
.mq-privacy-check i { width:27px;height:27px;border-radius:9px;border:2px solid #cfe0ed;background:#f7fbfe;color:transparent;display:flex;align-items:center;justify-content:center;transition:.2s; }
.mq-privacy-check i svg { width:18px;height:18px;stroke-width:3; }
.mq-privacy-check input:checked + i { background:#16c4ce;border-color:#16c4ce;color:#fff;box-shadow:0 5px 12px rgba(22,196,206,.25); }
.mq-privacy-check a { color:#0e91ad;text-decoration:underline;text-underline-offset:2px; }

/* Un seul véritable champ numérique pilote les six cases visuelles. Cette
   architecture évite les sauts de focus constatés sur les claviers Android. */
.mq-code-field { display:grid;gap:8px; }
.mq-code-entry { position:relative;min-height:clamp(54px,7.4vh,65px); }
.mq-code-input { position:absolute;inset:0;width:100%;height:100%;z-index:2;opacity:.015;color:transparent;background:transparent;border:0;outline:0;caret-color:transparent;font-size:16px; }
.mq-code-cells { position:absolute;inset:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(5px,1.45vw,9px);pointer-events:none; }
.mq-code-cells i { min-width:0;display:flex;align-items:center;justify-content:center;border:2px solid #dceaf4;border-radius:14px;background:#f8fcff;color:#153c7a;font:950 clamp(1.32rem,5.8vw,1.78rem)/1 ui-rounded,system-ui;box-shadow:inset 0 2px 4px rgba(21,60,122,.035);transition:border-color .16s,box-shadow .16s,transform .16s,background .16s; }
.mq-code-cells i.is-filled { background:#fff;border-color:#bcdce9; }
.mq-code-cells i.is-active { border-color:#16c4ce;box-shadow:0 0 0 3px rgba(22,196,206,.13);transform:translateY(-1px); }
.mq-btn.is-loading::before { content:"";width:18px;height:18px;border-radius:50%;border:3px solid rgba(255,255,255,.45);border-top-color:#fff;animation:mq-spin .75s linear infinite; }
@keyframes mq-spin { to { transform:rotate(360deg); } }

/* Recherche / salle d’attente */
.mq-waiting-card { text-align:center;display:flex;flex-direction:column;align-items:center;gap:clamp(11px,1.7vh,18px);overflow:hidden; }
.mq-waiting-card.is-premium { background:linear-gradient(155deg,rgba(255,255,255,.99),rgba(247,253,255,.97)); }
.mq-search-scene { position:relative;width:min(100%,430px);height:clamp(150px,22vh,205px);display:grid;grid-template-columns:1fr clamp(78px,22vw,110px) 1fr;align-items:center;gap:7px; }
.mq-search-scene::before { content:"";position:absolute;left:14%;right:14%;top:50%;height:2px;background:linear-gradient(90deg,transparent,#88e6e3,#fff,#91b7f6,transparent);filter:drop-shadow(0 0 8px rgba(22,196,206,.65));animation:mq-search-beam 1.7s ease-in-out infinite; }
@keyframes mq-search-beam { 0%,100%{opacity:.35;transform:scaleX(.72)} 50%{opacity:1;transform:scaleX(1)} }
.mq-search-player { position:relative;z-index:2;display:grid;justify-items:center;gap:7px; }
.mq-search-player > span { width:clamp(58px,16vw,78px);aspect-ratio:1;border-radius:24px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:clamp(1.45rem,6vw,2.1rem);font-weight:950;background:linear-gradient(145deg,#53ddd6,#1d8fd0);border:4px solid #fff;box-shadow:0 11px 24px rgba(21,60,122,.18); }
.mq-search-player > span img { width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit; }
.mq-search-player.is-guest > span { color:#84a0bd;background:linear-gradient(145deg,#f4f9fc,#dceaf3);animation:mq-guest-pulse 1.9s ease-in-out infinite; }
@keyframes mq-guest-pulse { 50%{transform:translateY(-4px);box-shadow:0 14px 30px rgba(22,196,206,.22)} }
.mq-search-player small { max-width:110px;color:#365a88;font-size:.72rem;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.mq-search-core { position:relative;z-index:3;width:clamp(78px,22vw,110px);aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#32d7d3,#247fd3);color:#fff;border:5px solid rgba(255,255,255,.95);box-shadow:0 16px 32px rgba(21,60,122,.22),0 0 0 8px rgba(22,196,206,.08); }
.mq-search-core b { width:48%;height:48%;display:flex;align-items:center;justify-content:center; }
.mq-search-core b svg { width:100%;height:100%;stroke-width:2; }
.mq-search-core i { position:absolute;inset:-10px;border-radius:50%;border:2px solid rgba(22,196,206,.35);animation:mq-orbit 2.2s linear infinite; }
.mq-search-core i:nth-child(2){inset:-20px;border-style:dashed;animation-duration:3.2s;animation-direction:reverse}.mq-search-core i:nth-child(3){inset:8px;border-color:rgba(255,255,255,.42);animation-duration:1.55s}
.mq-search-core em { position:absolute;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 12px #fff;animation:mq-scan-dot 1.5s linear infinite; }
@keyframes mq-orbit { to { transform:rotate(360deg); } }
@keyframes mq-scan-dot { from{transform:rotate(0deg) translateX(52px)} to{transform:rotate(360deg) translateX(52px)} }
.mq-search-card { position:absolute;width:28px;height:38px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#43dcd7,#2385d4);color:#fff;border:2px solid #fff;box-shadow:0 7px 16px rgba(21,60,122,.18);font-size:.8rem; }
.mq-search-card.c1{left:24%;top:13%;animation:mq-card-float 2.5s ease-in-out infinite}.mq-search-card.c2{right:22%;bottom:12%;animation:mq-card-float 2.5s ease-in-out .7s infinite}.mq-search-card.c3{left:50%;bottom:1%;animation:mq-card-float 2.5s ease-in-out 1.3s infinite}
@keyframes mq-card-float { 50%{transform:translateY(-9px) rotate(5deg)} }
.mq-wait-status { width:min(100%,420px);display:grid;grid-template-columns:13px minmax(0,1fr);align-items:center;gap:10px;text-align:left;padding:10px 14px;border-radius:18px;background:linear-gradient(110deg,#effffc,#f3f8ff);border:1.5px solid rgba(22,196,206,.22); }
.mq-live-dot { width:10px;height:10px;border-radius:50%;background:#39d58a;box-shadow:0 0 0 5px rgba(57,213,138,.12);animation:mq-live 1.35s ease-in-out infinite; }
@keyframes mq-live { 50%{box-shadow:0 0 0 9px rgba(57,213,138,0);transform:scale(.88)} }
.mq-wait-status div { display:grid;gap:2px; }
.mq-wait-status strong { color:#153c7a;font-size:.82rem;font-weight:950; }
.mq-wait-status small { color:#6681a7;font-size:.69rem;font-weight:750; }
.mq-room-code { width:min(100%,400px);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:7px;padding:12px 14px;border-radius:21px;background:linear-gradient(120deg,#effffc,#f5f9ff);border:2px solid rgba(22,196,206,.32); }
.mq-room-code small { grid-column:1/-1;text-transform:uppercase;letter-spacing:.12em;color:#0fa3b4;font-size:.66rem;font-weight:950; }
.mq-room-code strong { font-size:clamp(1.95rem,8.7vw,2.9rem);letter-spacing:.15em;color:#153c7a;font-variant-numeric:tabular-nums; }
.mq-room-code button { display:flex;align-items:center;gap:6px;color:#0fa3b4;background:#fff;border-radius:999px;padding:9px 12px;box-shadow:0 4px 10px rgba(21,60,122,.09);font-weight:900; }
.mq-room-code button svg { width:17px;height:17px; }
.mq-wait-help { margin:0;color:#6681a7;max-width:34rem;font-size:clamp(.7rem,2.65vw,.88rem);line-height:1.3; }
.mq-room-summary { display:flex;flex-wrap:wrap;justify-content:center;gap:7px; }
.mq-room-summary span { display:flex;align-items:center;gap:5px;padding:7px 11px;border-radius:999px;background:#eef7fd;color:#3f628f;font-size:.72rem;font-weight:900; }
.mq-room-summary span i { width:14px;height:14px;display:flex; }
.mq-room-summary span i svg { width:100%;height:100%;stroke-width:2.2; }
.mq-room-summary span b { font:inherit; }
.mq-room-summary.is-detailed { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%; }
.mq-room-summary.is-detailed span { justify-content:flex-start;border-radius:16px;padding:11px 12px;background:linear-gradient(130deg,#f3fbff,#f0f6fb); }

/* Confirmation de la configuration */
.mq-room-preview { display:flex;flex-direction:column;align-items:center;gap:clamp(10px,1.5vh,16px);overflow:hidden; }
.mq-room-preview-hero { display:grid;justify-items:center;text-align:center;gap:4px; }
.mq-room-preview-hero > span { width:62px;aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;background:var(--degrade);border:4px solid #fff;box-shadow:0 10px 20px rgba(21,60,122,.18); }
.mq-room-preview-hero > span svg { width:34px;height:34px; }
.mq-room-preview-hero small { color:#0fa3b4;font-weight:900;text-transform:uppercase;letter-spacing:.1em;font-size:.62rem; }
.mq-room-preview-hero h3 { margin:0;color:#153c7a;font-size:clamp(1.35rem,5.5vw,1.85rem);font-weight:950; }
.mq-room-preview-hero p { margin:0;color:#6681a7;font-size:.78rem; }
.mq-preview-players { width:100%;display:grid;gap:7px; }
.mq-preview-players > div { display:grid;grid-template-columns:43px minmax(0,1fr) auto;align-items:center;gap:9px;padding:8px 10px;border-radius:17px;background:#f4f9fd;border:1px solid #e4eff6;text-align:left; }
.mq-preview-players i { width:41px;aspect-ratio:1;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(145deg,#52dcd6,#218fd0);font-style:normal;font-weight:950; }
.mq-preview-players i img { width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit; }
.mq-preview-players span { display:grid;gap:1px;min-width:0; }
.mq-preview-players small { color:#7890ac;font-size:.59rem;text-transform:uppercase;font-weight:900;letter-spacing:.05em; }
.mq-preview-players strong { color:#153c7a;font-size:.84rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.mq-preview-players b { padding:5px 8px;border-radius:999px;background:#e4fbf1;color:#1c9a68;font-size:.62rem;font-weight:950; }
.mq-preview-players b.is-pending { background:#fff4df;color:#c47e15; }
.mq-ready-button { width:100%; }
.mq-ready-wait { width:100%;display:flex;align-items:center;justify-content:center;gap:9px;padding:12px;border-radius:18px;background:#effafc;color:#28658a; }
.mq-ready-wait span { width:18px;height:18px;border-radius:50%;border:3px solid #bfe7ea;border-top-color:#16c4ce;animation:mq-spin .75s linear infinite; }
.mq-ready-wait strong { font-size:.75rem; }

/* Rencontre VS */
.mq-match-screen { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(17px,3vh,28px);padding:clamp(18px,4vw,34px);overflow:hidden; }
.mq-match-screen::before { content:"";position:absolute;width:125%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.72),rgba(124,225,235,.12) 43%,transparent 69%);animation:mq-arena-breathe 2.1s ease-in-out infinite; }
@keyframes mq-arena-breathe { 50%{transform:scale(1.07);opacity:.76} }
.mq-match-stars { position:absolute;inset:0;pointer-events:none; }
.mq-match-stars i { position:absolute;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 10px rgba(22,196,206,.8);animation:mq-star-twinkle 1.7s ease-in-out infinite; }
.mq-match-stars i:nth-child(1){left:12%;top:18%}.mq-match-stars i:nth-child(2){left:81%;top:22%;animation-delay:.3s}.mq-match-stars i:nth-child(3){left:22%;top:72%;animation-delay:.7s}.mq-match-stars i:nth-child(4){left:72%;top:78%;animation-delay:1s}.mq-match-stars i:nth-child(5){left:46%;top:12%;animation-delay:.5s}.mq-match-stars i:nth-child(6){left:53%;bottom:10%;animation-delay:1.2s}
@keyframes mq-star-twinkle { 50%{transform:scale(2);opacity:.25} }
.mq-match-title { position:relative;z-index:3;display:grid;justify-items:center;gap:4px;text-align:center;animation:mq-match-title .55s ease both; }
.mq-match-title small { color:#0ea3b3;font-size:.64rem;letter-spacing:.14em;font-weight:950; }
.mq-match-title strong { color:#153c7a;font-size:clamp(1.15rem,4.8vw,1.6rem);font-weight:950; }
@keyframes mq-match-title { from{opacity:0;transform:translateY(-16px)} }
.mq-match-arena { position:relative;z-index:2;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(7px,2.2vw,18px); }
.mq-match-player { display:flex;flex-direction:column;align-items:center;gap:7px;opacity:0; }
.mq-match-player.is-a { animation:mq-player-left .95s var(--sortie) .12s forwards; }
.mq-match-player.is-b { animation:mq-player-right .95s var(--sortie) .12s forwards; }
@keyframes mq-player-left { from { opacity:0;transform:translateX(-110px) scale(.72) rotate(-7deg); } 70%{transform:translateX(7px) scale(1.03)} to { opacity:1;transform:none; } }
@keyframes mq-player-right { from { opacity:0;transform:translateX(110px) scale(.72) rotate(7deg); } 70%{transform:translateX(-7px) scale(1.03)} to { opacity:1;transform:none; } }
.mq-match-player em { padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.8);color:#6d85a5;font-size:.56rem;font-style:normal;font-weight:950;text-transform:uppercase;letter-spacing:.06em; }
.mq-match-player > span { position:relative;width:clamp(86px,25vw,136px);aspect-ratio:1;border-radius:30%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#54dfd6,#208bd4);color:#fff;border:6px solid #fff;box-shadow:0 19px 38px rgba(21,60,122,.22),0 0 0 6px rgba(22,196,206,.1); }
.mq-match-player.is-b > span { background:linear-gradient(145deg,#829fff,#554bd5);box-shadow:0 19px 38px rgba(54,61,142,.22),0 0 0 6px rgba(103,90,222,.1); }
.mq-match-player > span::after { content:"";position:absolute;inset:9px;border-radius:24%;border:1.5px solid rgba(255,255,255,.34); }
.mq-match-player > span img { width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit; }
.mq-match-player span b { font-size:clamp(2rem,9vw,3.8rem);font-weight:950; }
.mq-match-player strong { max-width:34vw;text-align:center;font-size:clamp(.9rem,3.8vw,1.28rem);color:#153c7a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.mq-match-player > small { color:#2ca278;font-size:.62rem;font-weight:900; }
.mq-match-vs { position:relative;display:flex;flex-direction:column;align-items:center;gap:8px; }
.mq-match-vs i { position:absolute;width:clamp(114px,34vw,180px);height:5px;top:38%;left:50%;transform:translate(-50%,-50%) scaleX(0);border-radius:99px;background:linear-gradient(90deg,#16c4ce,#fff,#675ade);box-shadow:0 0 18px rgba(255,255,255,.9);animation:mq-vs-line .72s ease .78s forwards; }
@keyframes mq-vs-line { to { transform:translate(-50%,-50%) scaleX(1); } }
.mq-match-vs b { position:relative;display:flex;align-items:center;justify-content:center;width:clamp(61px,16vw,82px);aspect-ratio:1;border-radius:50%;background:linear-gradient(145deg,#fff,#eff8ff);color:#153c7a;border:4px solid #fff;font-size:clamp(1.25rem,5.6vw,1.9rem);box-shadow:0 11px 27px rgba(21,60,122,.2);animation:mq-vs-pop .58s var(--ressort) .78s both; }
@keyframes mq-vs-pop { from { opacity:0;transform:scale(.12) rotate(-25deg); } }
.mq-match-vs small { max-width:96px;color:#0fa3b4;font-size:.57rem;text-transform:uppercase;letter-spacing:.075em;text-align:center;font-weight:950; }
.mq-match-progress { position:relative;z-index:3;width:min(86%,380px);display:grid;gap:6px;justify-items:center; }
.mq-match-progress::before { content:"";width:100%;height:7px;border-radius:99px;background:rgba(255,255,255,.72);box-shadow:inset 0 1px 3px rgba(21,60,122,.1); }
.mq-match-progress i { position:absolute;left:0;top:0;width:0;height:7px;border-radius:99px;background:linear-gradient(90deg,#22cfba,#4a9ee9,#725ce1);animation:mq-match-load 2.55s ease .2s forwards; }
@keyframes mq-match-load { to{width:100%} }
.mq-match-progress span { color:#55719c;font-size:.68rem;font-weight:850; }

/* Préparation et erreur : aucun écran blanc n’est possible. */
.mq-online-preparing { flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,1.7vh,17px);text-align:center;padding:10px; }
.mq-prepare-mark { position:relative;width:clamp(92px,25vw,124px);aspect-ratio:1;border-radius:32%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#45ddd6,#288bd6);color:#fff;border:5px solid #fff;box-shadow:0 16px 34px rgba(21,60,122,.2); }
.mq-prepare-mark span { width:45%;height:45%;display:flex; }
.mq-prepare-mark span svg { width:100%;height:100%; }
.mq-prepare-mark i { position:absolute;inset:-11px;border-radius:38%;border:2px solid rgba(22,196,206,.3);animation:mq-prepare-ring 1.8s linear infinite; }.mq-prepare-mark i:last-child{inset:-22px;border-style:dashed;animation-direction:reverse;animation-duration:2.7s}
@keyframes mq-prepare-ring { to{transform:rotate(360deg)} }
.mq-online-preparing h2 { margin:0;color:#153c7a;font-size:clamp(1.45rem,6vw,2rem);font-weight:950; }
.mq-online-preparing > p:not(.mq-eyebrow) { margin:0;color:#6681a7;font-size:.8rem;font-weight:750; }
.mq-prepare-bar { width:min(80%,360px);height:8px;border-radius:99px;background:rgba(255,255,255,.72);overflow:hidden;box-shadow:inset 0 1px 3px rgba(21,60,122,.1); }
.mq-prepare-bar i { display:block;width:42%;height:100%;border-radius:99px;background:linear-gradient(90deg,#21d2bd,#438fdf);animation:mq-prepare-scan 1.25s ease-in-out infinite; }
@keyframes mq-prepare-scan { 0%{transform:translateX(-110%)} 100%{transform:translateX(280%)} }
.mq-launch-error { display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px; }
.mq-launch-error > span { width:66px;aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff1f2;color:#d94757; }
.mq-launch-error > span svg { width:34px;height:34px;stroke-width:2.3; }
.mq-launch-error h3 { margin:0;color:#153c7a;font-size:1.25rem;font-weight:950; }
.mq-launch-error p { margin:0;color:#6681a7;font-size:.8rem;line-height:1.35; }
.mq-launch-error > div { width:100%;display:grid;gap:8px; }

.mq-online-result { display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;text-align:center; }
.mq-online-result div { padding:16px 8px;border-radius:20px;background:#f3f9fd;display:grid;gap:4px; }
.mq-online-result small { color:#55719c;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.mq-online-result strong { color:#153c7a;font-size:2rem;font-variant-numeric:tabular-nums; }
.mq-online-result b { color:#16c4ce;font-size:1.15rem; }
.mq-game-action.is-disabled { opacity:.34;pointer-events:none; }
.mq-card.is-sending { transform:scale(.97);filter:brightness(1.04); }

/* Quatrième choix dans l’étape Comment jouer. */
.mq-setup-grid.is-experience { grid-template-rows:repeat(4,minmax(80px,1fr)); }

@media (max-width:350px) {
	.mq-online-name-grid { grid-template-columns:1fr; }
	
	
	.mq-code-cells { gap:4px; }
	.mq-room-code strong { letter-spacing:.09em; }
	.mq-search-scene { grid-template-columns:1fr 72px 1fr; }
	.mq-search-core { width:72px; }
	.mq-search-player > span { width:54px;border-radius:18px; }
	.mq-match-player > span { border-width:4px;border-radius:25%; }
	.mq-match-player strong { font-size:.78rem; }
	.mq-match-vs b { width:52px; }
}

@media (max-width:480px), (max-height:700px) {
	.mq-view[data-view="online"] { gap:5px; }
	.mq-online-head { grid-template-columns:38px minmax(0,1fr);gap:7px;padding-top:0; }
	.mq-online-head .mq-setup-back { width:38px;height:38px;border-radius:12px; }
	.mq-online-head .mq-eyebrow { font-size:.55rem;margin:0 0 2px; }
	.mq-online-head .mq-title { font-size:1.17rem; }
	.mq-online-form,.mq-online-hub { align-content:start;overflow-y:auto;overscroll-behavior:contain;padding:1px 3px 4px;scrollbar-width:none; }
	.mq-online-form::-webkit-scrollbar,.mq-online-hub::-webkit-scrollbar { display:none; }
	
	
	.mq-online-age-card,.mq-online-form-card,.mq-waiting-card,.mq-room-preview,.mq-launch-error { padding:9px 11px;gap:7px;border-radius:20px; }
	.mq-online-hero-icon { width:50px; }
	.mq-dob-field input,.mq-premium-field input,.mq-premium-field select { height:35px;border-radius:11px;font-size:.75rem;padding-inline:10px; }
	.mq-online-form-card.is-compact { padding:7px 9px;gap:5px;border-radius:20px; }
	.mq-premium-field { gap:3px; }
	.mq-premium-field > span,.mq-code-field > span { font-size:.56rem; }
	.mq-online-name-grid { gap:5px; }
	.mq-code-entry { min-height:37px; }
	.mq-code-cells i { border-radius:10px;font-size:1rem; }
	.mq-privacy-check { grid-template-columns:21px minmax(0,1fr);gap:6px;font-size:.57rem; }
	.mq-privacy-check i { width:20px;height:20px;border-radius:6px; }
	.mq-privacy-check i svg { width:13px;height:13px; }
	.mq-setup-foot .mq-btn { min-height:42px;font-size:.88rem; }
	.mq-form-error { min-height:9px;font-size:.57rem; }
	.mq-search-scene { height:112px; }
	.mq-search-core { width:66px; }
	.mq-search-player > span { width:48px;border-width:3px;border-radius:16px;font-size:1.25rem; }
	.mq-search-player small { font-size:.56rem; }
	.mq-search-card { display:none; }
	.mq-wait-status { padding:7px 10px; }
	.mq-room-code { padding:8px 10px;border-radius:16px; }
	.mq-room-code strong { font-size:1.65rem; }
	.mq-room-code button { padding:7px 9px;font-size:.65rem; }
	.mq-room-summary span { padding:5px 8px;font-size:.59rem; }
	.mq-wait-help { font-size:.58rem; }
	.mq-room-preview-hero > span { width:48px; }
	.mq-room-preview-hero h3 { font-size:1.1rem; }
	.mq-room-preview-hero p { font-size:.61rem; }
	.mq-room-summary.is-detailed span { padding:7px 8px; }
	.mq-preview-players > div { padding:5px 7px;grid-template-columns:34px minmax(0,1fr) auto; }
	.mq-preview-players i { width:32px;border-radius:10px; }
	.mq-match-screen { gap:11px;padding:12px; }
	.mq-match-title strong { font-size:1rem; }
	.mq-match-player > span { width:72px;border-width:4px; }
	.mq-match-player strong { font-size:.72rem; }
	.mq-match-player em,.mq-match-player > small { font-size:.49rem; }
	.mq-match-vs b { width:50px;font-size:1.05rem; }
	.mq-match-vs small { font-size:.45rem; }
	.mq-online-preparing { gap:8px; }
	.mq-prepare-mark { width:72px;border-radius:24%; }
	.mq-online-preparing h2 { font-size:1.25rem; }
	.mq-setup-grid.is-experience { grid-template-rows:repeat(4,minmax(67px,1fr));gap:6px; }
	
	
	
}

@media (max-width:350px), (max-width:480px), (max-height:700px) {
	
	
}

/* ======================================================================
   MemoQuest 6.7.0 — classement compétitif et trophées de Recherche rapide
   ====================================================================== */
.mq-competitive-card {
	position:relative;display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:12px;
	min-height:102px;padding:13px 14px;border-radius:25px;overflow:hidden;
	background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(238,249,255,.97));
	border:1px solid rgba(93,187,222,.23);box-shadow:0 14px 30px rgba(31,74,132,.12),inset 0 1px 0 rgba(255,255,255,.88);
}
.mq-competitive-card::before { content:"";position:absolute;width:150px;height:150px;right:-66px;top:-88px;border-radius:50%;background:radial-gradient(circle,rgba(255,209,82,.22),rgba(255,209,82,0) 68%);pointer-events:none; }
.mq-competitive-card::after { content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.52) 43%,transparent 62%);transform:translateX(-130%);animation:mq-trophy-sheen 5.4s ease-in-out infinite;pointer-events:none; }
@keyframes mq-trophy-sheen { 0%,68%{transform:translateX(-130%)} 86%,100%{transform:translateX(130%)} }
.mq-trophy-orb { position:relative;z-index:1;width:58px;aspect-ratio:1;border-radius:19px;display:grid;place-items:center;color:#fff7d6;background:linear-gradient(145deg,#ffd95f,#ee9d21);border:3px solid #fff;box-shadow:0 10px 20px rgba(211,142,20,.24),0 0 0 5px rgba(255,193,44,.1); }
.mq-trophy-orb svg { width:31px;height:31px;stroke-width:1.9;filter:drop-shadow(0 2px 3px rgba(112,62,0,.22)); }
.mq-trophy-orb i { position:absolute;inset:-7px;border-radius:23px;border:1.5px solid rgba(255,190,29,.28);animation:mq-trophy-orbit 3.8s linear infinite; }
@keyframes mq-trophy-orbit { to{transform:rotate(360deg)} }
.mq-competitive-copy { position:relative;z-index:1;min-width:0;display:grid;gap:2px; }
.mq-competitive-copy > small { color:#13a9b6;font-size:.56rem;font-weight:950;letter-spacing:.085em; }
.mq-competitive-copy > strong { color:#153c7a;font-size:clamp(1.05rem,4.25vw,1.35rem);font-weight:950;line-height:1.05;font-variant-numeric:tabular-nums; }
.mq-competitive-copy > strong b { font-size:1.12em; }
.mq-competitive-copy p { margin:1px 0 0;color:#617da6;font-size:.65rem;font-weight:780; }
.mq-competitive-copy p em { color:#155a96;font-style:normal;font-weight:950; }
.mq-competitive-copy > span { color:#6f86a6;font-size:.55rem;font-weight:760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mq-trophy-progress { height:6px;margin:3px 0 1px;border-radius:99px;overflow:hidden;background:#dcecf5;box-shadow:inset 0 1px 2px rgba(26,72,126,.1); }
.mq-trophy-progress i { display:block;width:var(--p,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#18c9ba,#2b9dd7,#f4bf39);box-shadow:0 0 9px rgba(31,180,194,.3);transition:width .72s cubic-bezier(.2,.8,.2,1); }
.mq-grid-badge { position:relative;z-index:1;min-width:54px;padding:9px 8px;border-radius:16px;text-align:center;color:#fff;background:linear-gradient(145deg,#184f94,#1fb7c0);border:2px solid rgba(255,255,255,.84);box-shadow:0 8px 16px rgba(30,98,159,.2);font-size:.78rem;font-weight:950;white-space:nowrap; }
.mq-competitive-card.is-compact { min-height:84px;padding:10px 11px;grid-template-columns:48px minmax(0,1fr) auto;gap:9px;border-radius:21px;background:linear-gradient(135deg,#f7fdff,#eaf7fd);box-shadow:inset 0 0 0 1px rgba(48,167,198,.08); }
.mq-competitive-card.is-compact .mq-trophy-orb { width:48px;border-radius:16px; }
.mq-competitive-card.is-compact .mq-trophy-orb svg { width:25px;height:25px; }
.mq-competitive-card.is-compact .mq-grid-badge { min-width:49px;padding:8px 6px;font-size:.7rem;border-radius:14px; }
.mq-competitive-card.is-compact .mq-competitive-copy > strong { font-size:.98rem; }
.mq-quick-rule { margin:0;padding:8px 10px;border-radius:13px;background:rgba(26,168,186,.08);color:#55759b;font-size:.62rem;line-height:1.3;font-weight:750;text-align:center; }

.mq-search-player > b { display:inline-flex;align-items:center;justify-content:center;gap:3px;max-width:100%;padding:4px 7px;border-radius:99px;color:#8a650b;background:#fff7dc;border:1px solid rgba(233,180,45,.26);font-size:.54rem;font-weight:950;text-decoration:none;white-space:nowrap; }
.mq-search-player > b svg { width:11px;height:11px;stroke-width:2.1; }
.mq-match-player > u { display:inline-flex;align-items:center;gap:3px;padding:4px 7px;border-radius:99px;background:rgba(255,244,198,.9);color:#8e6606;font-size:.54rem;font-weight:950;text-decoration:none;box-shadow:0 3px 9px rgba(146,101,5,.1); }
.mq-match-player > u svg { width:11px;height:11px; }

.mq-trophy-result { position:relative;margin-top:12px;padding:15px 14px 13px;border-radius:24px;display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;overflow:hidden;background:linear-gradient(135deg,#f8fdff,#eaf8fc);border:1px solid rgba(31,172,191,.2);box-shadow:0 15px 28px rgba(25,78,133,.11); }
.mq-trophy-result::before { content:"";position:absolute;inset:auto -45px -70px auto;width:145px;height:145px;border-radius:50%;background:radial-gradient(circle,rgba(47,200,189,.2),transparent 67%); }
.mq-trophy-result.is-win { background:linear-gradient(135deg,#fffdf5,#effcf9);border-color:rgba(239,179,40,.28); }
.mq-trophy-result.is-loss { background:linear-gradient(135deg,#fffafa,#f2f7fd);border-color:rgba(210,91,111,.18); }
.mq-trophy-result-orb { position:relative;width:64px;aspect-ratio:1;border-radius:21px;display:grid;place-items:center;color:white;background:linear-gradient(145deg,#ffd65a,#e99b1c);border:3px solid #fff;box-shadow:0 12px 24px rgba(199,126,12,.23);animation:mq-trophy-result-pop .62s cubic-bezier(.18,1.28,.35,1) both; }
.mq-trophy-result.is-loss .mq-trophy-result-orb { background:linear-gradient(145deg,#7897c4,#38598d);box-shadow:0 12px 24px rgba(43,78,128,.2); }
@keyframes mq-trophy-result-pop { from{opacity:0;transform:scale(.3) rotate(-18deg)} }
.mq-trophy-result-orb svg { width:34px;height:34px;filter:drop-shadow(0 2px 3px rgba(86,47,0,.2)); }
.mq-trophy-result-orb i { position:absolute;width:6px;height:6px;border-radius:50%;background:#ffd24f;box-shadow:22px -15px 0 #24c8ba,-20px -18px 0 #5a8fe2,20px 19px 0 #ff8b71,-23px 17px 0 #f4c44c;animation:mq-trophy-spark 1.25s ease-in-out infinite alternate; }
.mq-trophy-result-orb i:last-child { transform:rotate(45deg) scale(.72);animation-delay:.35s; }
@keyframes mq-trophy-spark { to{transform:rotate(35deg) scale(1.14)} }
.mq-trophy-result > div:nth-child(2) { min-width:0;display:grid;align-content:center;gap:1px; }
.mq-trophy-result > div:nth-child(2) small { color:#199fac;font-size:.56rem;font-weight:950;letter-spacing:.08em; }
.mq-trophy-result > div:nth-child(2) strong { color:#153c7a;font-size:2.05rem;line-height:1;font-weight:1000;font-variant-numeric:tabular-nums; }
.mq-trophy-result.is-loss > div:nth-child(2) strong { color:#395f92; }
.mq-trophy-result > div:nth-child(2) p { margin:2px 0 0;color:#627c9f;font-size:.66rem;font-weight:760; }
.mq-trophy-result > div:nth-child(2) p b { color:#153c7a;font-variant-numeric:tabular-nums; }
.mq-result-progress { grid-column:1/-1;height:7px;border-radius:99px;overflow:hidden;background:#dbeaf3; }
.mq-result-progress i { display:block;width:var(--p,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#1cc7b9,#3997d8,#f0bd3c);animation:mq-result-fill .95s cubic-bezier(.2,.8,.2,1) .2s both;transform-origin:left; }
@keyframes mq-result-fill { from{transform:scaleX(0)} }
.mq-trophy-result > span { grid-column:1/-1;color:#627c9f;font-size:.62rem;font-weight:780;text-align:center; }
.mq-trophy-result > span b { color:#174f8e;font-weight:950; }
.mq-format-unlocked { grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 10px;border-radius:14px;background:linear-gradient(90deg,#ddfbf5,#fff8d9);color:#176b76;font-style:normal;font-size:.66rem;font-weight:900;animation:mq-format-arrive .65s cubic-bezier(.18,1.15,.36,1) .45s both; }
.mq-format-unlocked svg { width:18px;height:18px;color:#12b99f; }
.mq-format-unlocked b { color:#155a96; }
@keyframes mq-format-arrive { from{opacity:0;transform:translateY(12px) scale(.96)} }

[data-motion="calme"] .mq-competitive-card::after,[data-motion="calme"] .mq-trophy-orb i,[data-motion="calme"] .mq-trophy-result-orb,[data-motion="calme"] .mq-trophy-result-orb i,[data-motion="calme"] .mq-result-progress i,[data-motion="calme"] .mq-format-unlocked { animation:none!important; }

@media (max-width:350px) {
	.mq-competitive-card { grid-template-columns:49px minmax(0,1fr) auto;gap:8px;padding:10px;min-height:88px;border-radius:21px; }
	.mq-trophy-orb { width:49px;border-radius:16px; }
	.mq-trophy-orb svg { width:25px;height:25px; }
	.mq-grid-badge { min-width:46px;padding:7px 5px;font-size:.65rem;border-radius:13px; }
	.mq-competitive-copy > strong { font-size:.9rem; }
	.mq-competitive-copy > span,.mq-competitive-copy p { font-size:.52rem; }
	.mq-trophy-result { grid-template-columns:55px minmax(0,1fr);gap:9px;padding:12px 11px;border-radius:20px; }
	.mq-trophy-result-orb { width:55px;border-radius:18px; }
	.mq-trophy-result > div:nth-child(2) strong { font-size:1.75rem; }
}

@media (max-width:480px), (max-height:700px) {
	.mq-competitive-card { min-height:78px;padding:8px 10px;border-radius:19px;grid-template-columns:44px minmax(0,1fr) auto;gap:8px; }
	.mq-trophy-orb { width:44px;border-radius:14px;border-width:2px; }
	.mq-trophy-orb svg { width:23px;height:23px; }
	.mq-grid-badge { min-width:45px;padding:6px 5px;border-radius:12px;font-size:.63rem; }
	.mq-competitive-copy > small { font-size:.46rem; }
	.mq-competitive-copy > strong { font-size:.86rem; }
	.mq-competitive-copy p,.mq-competitive-copy > span { font-size:.48rem; }
	.mq-trophy-progress { height:5px;margin:2px 0 0; }
	.mq-competitive-card.is-compact { min-height:70px; }
	.mq-quick-rule { padding:6px 8px;font-size:.54rem; }
}

/* =========================================================================
   MemoQuest 6.7.1 — résultat multijoueur personnel
   Chaque appareil affiche uniquement la performance de son propre joueur.
   ========================================================================= */
.mq-personal-result-layer {
	background:
		radial-gradient(circle at 50% 10%, rgba(82,221,227,.28), transparent 34%),
		linear-gradient(180deg, rgba(20,64,123,.30), rgba(20,64,123,.18));
}
.mq-personal-result-layer .mq-sheet {
	width:min(470px,100%);
	gap:10px;
	padding:clamp(12px,2.2vmin,20px);
	border:1px solid rgba(255,255,255,.9);
	background:linear-gradient(170deg,rgba(255,255,255,.99),rgba(247,253,255,.98));
	box-shadow:0 24px 58px rgba(21,60,122,.34),0 0 0 1px rgba(30,199,202,.08);
}
.mq-personal-result-layer .mq-sheet-body { gap:0; }

.mq-personal-result-head {
	position:relative;
	display:grid;
	grid-template-columns:64px minmax(0,1fr);
	align-items:center;
	gap:12px;
	padding:4px 3px 2px;
}
.mq-personal-result-head::after {
	content:"";
	position:absolute;
	left:76px;right:0;bottom:-4px;height:1px;
	background:linear-gradient(90deg,rgba(27,198,194,.38),transparent);
}
.mq-personal-result-seal {
	position:relative;
	width:64px;aspect-ratio:1;
	display:grid;place-items:center;
	border-radius:22px;
	color:#fff;
	background:linear-gradient(145deg,#1cd0c2,#168bd4);
	border:3px solid #fff;
	box-shadow:0 12px 28px rgba(29,153,188,.27),0 0 0 5px rgba(42,202,202,.10);
	animation:mq-personal-seal-in .65s cubic-bezier(.16,1.32,.35,1) both;
}
.mq-personal-result-head.is-win .mq-personal-result-seal {
	color:#fff7d6;
	background:linear-gradient(145deg,#ffd95d,#e79a18);
	box-shadow:0 12px 28px rgba(207,137,22,.28),0 0 0 5px rgba(255,194,45,.12);
}
.mq-personal-result-head.is-loss .mq-personal-result-seal {
	background:linear-gradient(145deg,#7898c6,#355887);
	box-shadow:0 12px 28px rgba(48,82,131,.23),0 0 0 5px rgba(71,109,163,.10);
}
.mq-personal-result-seal svg { width:34px;height:34px;filter:drop-shadow(0 2px 3px rgba(18,48,89,.22)); }
.mq-personal-result-seal i {
	position:absolute;inset:-8px;border-radius:27px;
	border:1.5px solid rgba(38,199,200,.28);
	animation:mq-personal-orbit 4.4s linear infinite;
}
.mq-personal-result-head.is-win .mq-personal-result-seal i { border-color:rgba(239,174,31,.34); }
@keyframes mq-personal-seal-in { from{opacity:0;transform:scale(.35) rotate(-18deg)} }
@keyframes mq-personal-orbit { to{transform:rotate(360deg)} }
.mq-personal-result-head > div { min-width:0; }
.mq-personal-result-head small {
	display:block;margin-bottom:1px;
	color:#18aeb6;font-size:.58rem;font-weight:1000;letter-spacing:.13em;
}
.mq-personal-result-head.is-win small { color:#c98b17; }
.mq-personal-result-head.is-loss small { color:#607fa9; }
.mq-personal-result-head h3 {
	margin:0;color:#153c7a;font-size:clamp(1.45rem,5.8vw,2rem);line-height:1;font-weight:1000;
}
.mq-personal-result-head p {
	margin:5px 0 0;color:#637c9e;font-size:.69rem;line-height:1.32;font-weight:740;
}

.mq-personal-result-card {
	position:relative;
	isolation:isolate;
	overflow:hidden;
	padding:14px;
	border-radius:27px;
	background:
		radial-gradient(circle at 90% 4%,rgba(45,208,201,.15),transparent 31%),
		linear-gradient(155deg,#fbfeff,#eff9fc);
	border:1px solid rgba(29,178,193,.20);
	box-shadow:0 16px 32px rgba(23,72,125,.12),inset 0 1px 0 rgba(255,255,255,.95);
	animation:mq-personal-card-in .58s cubic-bezier(.2,.9,.25,1) .08s both;
}
.mq-personal-result-card::before {
	content:"";position:absolute;z-index:-1;width:190px;height:190px;border-radius:50%;right:-90px;top:-104px;
	background:radial-gradient(circle,rgba(38,206,197,.20),transparent 67%);
}
.mq-personal-result-card.is-win {
	background:radial-gradient(circle at 88% 4%,rgba(255,202,66,.17),transparent 31%),linear-gradient(155deg,#fffefa,#effcf8);
	border-color:rgba(224,167,35,.24);
}
.mq-personal-result-card.is-loss {
	background:radial-gradient(circle at 88% 4%,rgba(103,139,188,.16),transparent 31%),linear-gradient(155deg,#fbfdff,#f1f6fc);
	border-color:rgba(89,125,175,.18);
}
@keyframes mq-personal-card-in { from{opacity:0;transform:translateY(18px) scale(.97)} }

.mq-personal-player { display:flex;align-items:center;gap:10px;padding-bottom:10px;border-bottom:1px solid rgba(73,117,162,.12); }
.mq-personal-avatar {
	width:43px;aspect-ratio:1;display:grid;place-items:center;flex:0 0 auto;border-radius:15px;
	color:#fff;font-size:1.28rem;font-weight:1000;
	background:linear-gradient(145deg,#18c9c0,#168bcf);
	border:2px solid #fff;box-shadow:0 8px 18px rgba(30,142,180,.22);
}
.mq-personal-result-card.is-win .mq-personal-avatar { background:linear-gradient(145deg,#22cda8,#159f7e); }
.mq-personal-player div { min-width:0; }
.mq-personal-player small { display:block;color:#6b82a0;font-size:.52rem;font-weight:950;letter-spacing:.11em; }
.mq-personal-player strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#173d79;font-size:1rem;font-weight:1000; }

.mq-personal-score {
	display:grid;grid-template-columns:1fr auto;align-items:end;
	padding:12px 4px 8px;
}
.mq-personal-score small { grid-column:1/-1;color:#67809f;font-size:.56rem;font-weight:950;letter-spacing:.10em; }
.mq-personal-score strong {
	color:#153c7a;font-size:clamp(2.65rem,12vw,4rem);line-height:.9;font-weight:1000;font-variant-numeric:tabular-nums;
	text-shadow:0 5px 16px rgba(28,80,137,.12);
}
.mq-personal-result-card.is-win .mq-personal-score strong { color:#119878; }
.mq-personal-result-card.is-loss .mq-personal-score strong { color:#426993; }
.mq-personal-score span { padding-bottom:4px;color:#6c84a2;font-size:.68rem;font-weight:850; }

.mq-personal-rating {
	display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3px 8px;
	padding:9px 10px;border-radius:18px;
	background:rgba(255,255,255,.74);border:1px solid rgba(51,126,172,.12);
}
.mq-personal-rating > span { color:#587497;font-size:.66rem;font-weight:850; }
.mq-personal-rating > b { color:#174a84;font-size:.68rem;font-weight:950; }
.mq-personal-stars { display:flex;justify-content:flex-end;align-items:center;gap:1px; }
.mq-personal-stars .mq-etoile-geant { width:20px;height:20px; }
.mq-personal-stars .mq-etoile.is-lit { animation:mq-star-in .55s var(--ressort) both; }

.mq-personal-stats { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px; }
.mq-personal-stats > div {
	min-width:0;padding:10px;border-radius:18px;
	display:grid;grid-template-columns:34px minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px;
	background:rgba(255,255,255,.78);border:1px solid rgba(58,127,169,.12);
}
.mq-personal-stats > div > span {
	grid-row:1/3;width:34px;aspect-ratio:1;border-radius:12px;display:grid;place-items:center;
	color:#1e9cb7;background:linear-gradient(145deg,#eaf9fb,#dff0fa);
}
.mq-personal-stats > div:last-child > span { color:#ed8d24;background:linear-gradient(145deg,#fff6e9,#ffead2); }
.mq-personal-stats svg { width:19px;height:19px; }
.mq-personal-stats small { color:#6a809d;font-size:.55rem;font-weight:850;line-height:1.1; }
.mq-personal-stats strong { color:#153c7a;font-size:1.05rem;font-weight:1000;line-height:1.05; }
.mq-personal-stats strong em { color:#6d82a0;font-size:.53rem;font-style:normal;font-weight:800; }

.mq-personal-trophies {
	position:relative;overflow:hidden;
	display:grid;grid-template-columns:52px minmax(0,1fr);gap:9px;
	margin-top:8px;padding:10px;border-radius:20px;
	background:linear-gradient(135deg,#f9fdff,#eaf8fc);border:1px solid rgba(35,171,188,.17);
}
.mq-personal-trophies.is-win { background:linear-gradient(135deg,#fffdf6,#eefcf8);border-color:rgba(227,168,31,.24); }
.mq-personal-trophies.is-loss { background:linear-gradient(135deg,#fffafa,#f1f6fc);border-color:rgba(103,126,164,.16); }
.mq-personal-trophies.is-private { align-items:center;background:linear-gradient(135deg,#f8fbfe,#eef5fa); }
.mq-personal-trophy-icon {
	position:relative;grid-row:1/3;width:52px;aspect-ratio:1;border-radius:17px;display:grid;place-items:center;
	color:#fff;background:linear-gradient(145deg,#ffd55a,#e7971b);border:2px solid #fff;box-shadow:0 8px 18px rgba(196,127,18,.21);
}
.mq-personal-trophies.is-loss .mq-personal-trophy-icon { background:linear-gradient(145deg,#7695c0,#395a88);box-shadow:0 8px 18px rgba(48,79,122,.18); }
.mq-personal-trophies.is-private .mq-personal-trophy-icon { background:linear-gradient(145deg,#2dcac1,#218fc4);box-shadow:0 8px 18px rgba(30,139,178,.18); }
.mq-personal-trophy-icon svg { width:28px;height:28px; }
.mq-personal-trophy-icon i { position:absolute;width:5px;height:5px;border-radius:50%;background:#ffd354;box-shadow:17px -11px 0 #2ccbbb,-16px -13px 0 #6499dc,15px 15px 0 #ff8b71;animation:mq-personal-spark 1.2s ease-in-out infinite alternate; }
@keyframes mq-personal-spark { to{transform:rotate(38deg) scale(1.13)} }
.mq-personal-trophies > div { min-width:0;display:grid;align-content:center; }
.mq-personal-trophies small { color:#199ba9;font-size:.51rem;font-weight:1000;letter-spacing:.09em; }
.mq-personal-trophies strong { color:#153c7a;font-size:1.75rem;line-height:1;font-weight:1000;font-variant-numeric:tabular-nums; }
.mq-personal-trophies.is-loss strong { color:#42658f; }
.mq-personal-trophies.is-private strong { font-size:1.05rem; }
.mq-personal-trophies p { margin:2px 0 0;color:#6a809d;font-size:.58rem;font-weight:750; }
.mq-personal-trophies p b { color:#164783; }
.mq-personal-trophy-progress { grid-column:1/-1;height:6px;border-radius:99px;overflow:hidden;background:#dceaf3; }
.mq-personal-trophy-progress i { display:block;width:var(--p,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#1bc7b9,#3a96d7,#f0bd3d);transform-origin:left;animation:mq-personal-fill 1s cubic-bezier(.2,.8,.2,1) .25s both; }
@keyframes mq-personal-fill { from{transform:scaleX(0)} }
.mq-personal-trophies > span:not(.mq-personal-trophy-icon) { grid-column:1/-1;color:#6a809d;font-size:.57rem;font-weight:800;text-align:center; }
.mq-personal-trophies > span b { color:#174c86; }
.mq-personal-trophies > em {
	grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:5px;padding:7px 8px;border-radius:13px;
	color:#118e77;background:#e2faf3;font-size:.58rem;font-style:normal;animation:mq-personal-unlock .7s cubic-bezier(.2,1.2,.3,1) .5s both;
}
.mq-personal-trophies > em svg { width:16px;height:16px; }
@keyframes mq-personal-unlock { from{opacity:0;transform:scale(.75)} }

.mq-personal-result-layer .mq-sheet > div:last-child { gap:7px!important; }
.mq-result-find {
	position:relative;overflow:hidden;min-height:50px;
	box-shadow:0 11px 24px rgba(19,160,187,.24),inset 0 1px 0 rgba(255,255,255,.35);
}
.mq-result-find::after {
	content:"";position:absolute;inset:-40% auto -40% -35%;width:34%;transform:skewX(-18deg);
	background:linear-gradient(90deg,transparent,rgba(255,255,255,.43),transparent);
	animation:mq-result-button-sheen 3.8s ease-in-out infinite;
}
@keyframes mq-result-button-sheen { 0%,65%{left:-40%} 88%,100%{left:125%} }
.mq-result-find svg:first-child { width:22px;height:22px; }
.mq-result-home {
	min-height:46px;color:#17447f;background:linear-gradient(180deg,#fff,#edf6fc);
	border:1px solid rgba(44,106,160,.18);box-shadow:0 8px 18px rgba(33,82,130,.10);
}
.mq-result-home svg { width:20px;height:20px; }

[data-motion="calme"] .mq-personal-result-seal,
[data-motion="calme"] .mq-personal-result-seal i,
[data-motion="calme"] .mq-personal-result-card,
[data-motion="calme"] .mq-personal-trophy-icon i,
[data-motion="calme"] .mq-personal-trophy-progress i,
[data-motion="calme"] .mq-personal-trophies > em,
[data-motion="calme"] .mq-result-find::after { animation:none!important; }

@media (max-width:370px), (max-height:690px) {
	.mq-personal-result-layer .mq-sheet { gap:7px;padding:10px;border-radius:23px; }
	.mq-personal-result-head { grid-template-columns:52px minmax(0,1fr);gap:9px; }
	.mq-personal-result-seal { width:52px;border-radius:17px; }
	.mq-personal-result-seal svg { width:28px;height:28px; }
	.mq-personal-result-head::after { left:61px; }
	.mq-personal-result-head h3 { font-size:1.42rem; }
	.mq-personal-result-head p { font-size:.61rem;margin-top:3px; }
	.mq-personal-result-card { padding:10px;border-radius:22px; }
	.mq-personal-player { padding-bottom:7px; }
	.mq-personal-avatar { width:37px;border-radius:12px;font-size:1.05rem; }
	.mq-personal-score { padding:8px 3px 5px; }
	.mq-personal-score strong { font-size:2.45rem; }
	.mq-personal-rating { padding:7px 8px;border-radius:15px; }
	.mq-personal-stars .mq-etoile-geant { width:17px;height:17px; }
	.mq-personal-stats { gap:6px;margin-top:6px; }
	.mq-personal-stats > div { padding:7px;grid-template-columns:29px minmax(0,1fr);column-gap:6px;border-radius:15px; }
	.mq-personal-stats > div > span { width:29px;border-radius:10px; }
	.mq-personal-stats strong { font-size:.92rem; }
	.mq-personal-trophies { grid-template-columns:43px minmax(0,1fr);gap:7px;margin-top:6px;padding:8px;border-radius:17px; }
	.mq-personal-trophy-icon { width:43px;border-radius:14px; }
	.mq-personal-trophy-icon svg { width:23px;height:23px; }
	.mq-personal-trophies strong { font-size:1.45rem; }
	.mq-result-find { min-height:45px; }
	.mq-result-home { min-height:42px; }
}

/* =========================================================================
   MemoQuest 6.19.0 — couche Android locale et sécurisation multijoueur
   L'écran de résultat est une vraie vue, jamais une surcouche dépendante du
   plateau. Cela élimine les fins de match figées après la dernière paire.
   ========================================================================= */
.mq-view[data-view="online"] .mq-personal-result-page {
	width:min(520px,100%);
	margin:0 auto;
	padding:clamp(10px,2.4vmin,20px) var(--pad) calc(var(--pad) + env(safe-area-inset-bottom));
	display:grid;
	gap:10px;
	min-height:100%;
	align-content:center;
	animation:mq-result-page-in .46s var(--ressort);
}
@keyframes mq-result-page-in {
	from { opacity:0; transform:translateY(18px) scale(.975); }
}
.mq-view[data-view="online"] .mq-personal-result-page::before {
	content:"";
	position:absolute;
	inset:0;
	pointer-events:none;
	background:
		radial-gradient(circle at 50% 10%,rgba(66,217,224,.22),transparent 31%),
		radial-gradient(circle at 85% 82%,rgba(255,215,106,.18),transparent 28%);
}
.mq-view[data-view="online"] .mq-personal-result-page > * { position:relative; z-index:1; }
.mq-personal-result-actions {
	display:grid;
	gap:8px;
	padding:0 2px;
}
.mq-personal-result-actions .mq-btn {
	min-height:52px;
	border-radius:20px;
	font-weight:900;
	letter-spacing:-.02em;
	box-shadow:0 12px 24px rgba(21,60,122,.16);
}
.mq-personal-result-actions .mq-result-find {
	background:linear-gradient(135deg,#16cfc1,#168ddd);
	box-shadow:0 14px 30px rgba(17,170,199,.28),inset 0 1px 0 rgba(255,255,255,.55);
}
.mq-personal-result-actions .mq-result-home {
	background:rgba(255,255,255,.93);
	color:#173f77;
	border:1px solid rgba(108,157,202,.25);
}
.mq-result-fallback .mq-personal-result-card { text-align:center; }
[data-motion="calme"] .mq-view[data-view="online"] .mq-personal-result-page { animation:none; }
@media (max-width:480px), (max-height:700px) {
	.mq-view[data-view="online"] .mq-personal-result-page { align-content:start;gap:7px;padding-top:8px; }
	.mq-personal-result-actions .mq-btn { min-height:46px; }
}

/* =========================================================================
   MemoQuest 6.19.0 — écrans de résultat premium compacts sans bloc supérieur
   Recherche rapide : trophées. IA : pièces. Salle privée : aucun trophée.
   ========================================================================= */
.mq-shell[data-result-screen] .mq-app {
	gap:0;
	padding:0;
	background:
		radial-gradient(circle at 50% -10%,rgba(255,255,255,.92),transparent 35%),
		linear-gradient(180deg,#49c9f4 0%,#a7e8fb 31%,#e8faff 70%,#f7fcff 100%);
}
.mq-shell[data-result-screen] .mq-top,
.mq-shell[data-result-screen] .mq-nav,
.mq-shell[data-result-screen] .mq-ambiance { display:none!important; }
.mq-shell[data-result-screen] .mq-stage { min-height:100%; }
.mq-shell[data-result-screen] .mq-view.is-active {
	overflow-x:hidden;
	overflow-y:auto;
	overscroll-behavior:contain;
	-webkit-overflow-scrolling:touch;
}
.mq-shell[data-result-screen="solo"] .mq-view.is-active { overflow-y:hidden; }
.mq-final-result-page {
	--result-accent:#18bfc8;
	--result-accent-2:#208fe7;
	--result-deep:#123c7d;
	--result-soft:#eaf9ff;
	position:relative;
	isolation:isolate;
	width:min(620px,100%);
	min-height:100%;
	margin:0 auto;
	padding:max(10px,env(safe-area-inset-top)) clamp(10px,2.4vw,16px) max(12px,env(safe-area-inset-bottom));
	display:grid;
	gap:clamp(6px,.9vh,10px);
	align-content:start;
	color:var(--result-deep);
	font-variant-numeric:tabular-nums;
	background:
		radial-gradient(circle at 50% 2%,rgba(255,255,255,.98),transparent 23%),
		radial-gradient(circle at 10% 25%,rgba(0,195,217,.16),transparent 22%),
		radial-gradient(circle at 90% 34%,rgba(37,137,245,.14),transparent 24%),
		linear-gradient(180deg,rgba(75,200,244,.94),rgba(184,238,252,.97) 34%,rgba(237,250,255,.99) 76%,#f9fdff);
}
.mq-final-result-page.is-loss {
	--result-accent:#f04f63;
	--result-accent-2:#e22d4d;
	--result-soft:#fff0f3;
}
.mq-final-result-page.is-draw {
	--result-accent:#875fd8;
	--result-accent-2:#5d7de2;
	--result-soft:#f3efff;
}
.mq-final-result-page::before {
	content:"";
	position:absolute;z-index:-2;inset:0;
	background:
		repeating-linear-gradient(112deg,transparent 0 8%,rgba(255,255,255,.15) 8.3%,transparent 8.8% 16%),
		radial-gradient(ellipse at 50% 8%,rgba(255,255,255,.86),transparent 32%);
	pointer-events:none;
}
.mq-final-result-page::after {
	content:"";
	position:absolute;z-index:-1;left:5%;right:5%;top:7%;height:34%;
	border-radius:50%;
	background:radial-gradient(ellipse,rgba(255,255,255,.66),transparent 70%);
	filter:blur(22px);
	pointer-events:none;
}
.mq-final-particles { position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:6; }
.mq-final-particles i {
	--x:calc((var(--i) * 43 + 11) % 97);
	position:absolute;
	left:calc(var(--x) * 1%);
	top:calc(1% + ((var(--i) * 29) % 48) * 1%);
	width:clamp(5px,1.6vw,10px);height:clamp(8px,2.2vw,15px);
	border-radius:2px;
	background:hsl(calc(185 + (var(--i) * 29)),82%,56%);
	box-shadow:0 0 12px rgba(255,255,255,.9);
	transform:rotate(calc(var(--i) * 31deg));
	animation:mq-final-float calc(4.2s + var(--i) * .13s) ease-in-out infinite alternate;
	opacity:.86;
}
.mq-final-result-page.is-loss .mq-final-particles i:nth-child(3n+1) { background:#ff4864; }
.mq-final-result-page.is-loss .mq-final-particles i:nth-child(3n+2) { background:#ff7a83; }
@keyframes mq-final-float { to{transform:translate3d(7px,18px,0) rotate(calc(var(--i) * 31deg + 110deg));opacity:.38} }

@keyframes mq-final-rays { to{transform:rotate(360deg)} }
@keyframes mq-final-emblem-in { from{opacity:0;transform:translate(-50%,-42%) scale(.32) rotate(-18deg)} }

.mq-final-reward {
	position:relative;z-index:2;overflow:hidden;
	display:grid;grid-template-columns:clamp(52px,13vw,74px) minmax(0,1fr) clamp(56px,15vw,90px);align-items:center;gap:clamp(8px,2vw,14px);
	padding:clamp(10px,2.1vw,14px);
	border-radius:clamp(25px,5vw,38px);
	background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(244,252,255,.97));
	border:1px solid rgba(255,255,255,.98);
	box-shadow:0 18px 38px rgba(30,86,146,.14),inset 0 1px 0 #fff;
}
.mq-final-reward.is-trophies-loss,.mq-final-reward.is-coins-zero { background:linear-gradient(145deg,#fffdfd,#fff1f4);border-color:rgba(255,94,117,.22); }
.mq-final-reward.is-private { grid-template-columns:clamp(58px,15vw,88px) minmax(0,1fr);background:linear-gradient(145deg,#fff,#edfaff); }
.mq-final-reward.is-private .mq-final-reward-art { display:none; }
.mq-final-reward-icon { position:relative;width:100%;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;color:#fff6cf;background:linear-gradient(145deg,#ffda55,#ed9c16);border:4px solid #fff;box-shadow:0 10px 24px rgba(210,142,24,.25),0 0 0 5px rgba(255,201,48,.12); }
.mq-final-reward.is-trophies-loss .mq-final-reward-icon,.mq-final-reward.is-coins-zero .mq-final-reward-icon { color:#fff;background:linear-gradient(145deg,#ff7180,#e83354);box-shadow:0 10px 24px rgba(207,49,78,.22),0 0 0 5px rgba(255,79,106,.1); }
.mq-final-reward.is-private .mq-final-reward-icon { background:linear-gradient(145deg,#31d1ce,#2a82e6);box-shadow:0 10px 24px rgba(33,126,195,.23),0 0 0 5px rgba(49,200,222,.11); }
.mq-final-reward-icon svg { width:52%;height:52%; }
.mq-final-reward-icon i { position:absolute;inset:-9px;border:1px solid rgba(255,196,52,.44);border-radius:50%;animation:mq-final-pulse 1.8s ease-in-out infinite; }
@keyframes mq-final-pulse { 50%{transform:scale(1.08);opacity:.35} }
.mq-final-reward-copy { min-width:0;display:grid;align-content:center; }
.mq-final-reward-copy small { color:#13a4b3;font-size:clamp(.58rem,2.5vw,.8rem);font-weight:1000;letter-spacing:.09em; }
.mq-final-reward.is-trophies-loss small,.mq-final-reward.is-coins-zero small { color:#df3855; }
.mq-final-reward-copy strong { margin-top:2px;color:#123a7a;font-size:clamp(1.05rem,4.5vw,1.7rem);line-height:1.02;font-weight:1000;letter-spacing:-.035em; }
.mq-final-reward.is-trophies-loss .mq-final-reward-copy strong,.mq-final-reward.is-coins-zero .mq-final-reward-copy strong { color:#df2f4d; }
.mq-final-reward-copy p { margin:5px 0 0;color:#58739a;font-size:clamp(.61rem,2.7vw,.86rem);line-height:1.28;font-weight:700; }
.mq-final-reward-total,.mq-final-reward-format { margin-top:4px;color:#55739a;font-size:clamp(.54rem,2.25vw,.7rem);font-weight:800; }
.mq-final-reward-total b,.mq-final-reward-format b { color:#153e7d; }
.mq-final-reward-art { position:relative;width:100%;height:58px; }
.mq-final-reward-art i { position:absolute;bottom:6px;width:38px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 28%,#fff5aa 0 8%,#ffd143 10% 54%,#e69a18 56% 68%,#ffc12e 70%);border:3px solid #fff0a1;box-shadow:0 5px 12px rgba(177,111,12,.25); }
.mq-final-reward-art i::before { content:"★";position:absolute;inset:0;display:grid;place-items:center;color:#fff5b7;font-size:1.1rem;text-shadow:0 2px 2px rgba(161,100,15,.3); }
.mq-final-reward-art i:nth-child(1){left:3%;bottom:5px}.mq-final-reward-art i:nth-child(2){left:30%;bottom:24px}.mq-final-reward-art i:nth-child(3){right:2%;bottom:8px}
.mq-final-reward.is-trophies-loss .mq-final-reward-art i,.mq-final-reward.is-coins-zero .mq-final-reward-art i { background:radial-gradient(circle at 35% 28%,#ffc3c9 0 8%,#ff6678 10% 54%,#dc294b 56% 68%,#f34a65 70%);border-color:#ffb4bd; }

.mq-final-actions { position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.9fr);gap:clamp(8px,1.7vw,12px);padding-bottom:1px; }
.mq-final-actions .mq-btn { min-height:clamp(44px,5.8vh,54px);border-radius:clamp(20px,4vw,30px);display:flex;align-items:center;justify-content:center;gap:10px;font-size:clamp(.68rem,2.6vw,.84rem);font-weight:950;box-shadow:0 14px 28px rgba(28,91,159,.17); }
.mq-final-actions svg { width:clamp(18px,4.4vw,25px);height:clamp(18px,4.4vw,25px); }
.mq-final-replay { color:#fff!important;background:linear-gradient(135deg,#16cdd0 0%,#1ba5e5 52%,#326be5 100%)!important;border:1px solid rgba(255,255,255,.72)!important;box-shadow:0 7px 0 #126ab9,0 15px 30px rgba(23,117,196,.29),inset 0 1px 0 rgba(255,255,255,.56)!important; }
.mq-final-result-page.is-loss .mq-final-replay { background:linear-gradient(135deg,#ff5b6d,#ea3157)!important;box-shadow:0 7px 0 #b92243,0 15px 30px rgba(211,45,76,.25),inset 0 1px 0 rgba(255,255,255,.5)!important; }
.mq-final-home { color:#173e7b!important;background:rgba(255,255,255,.96)!important;border:1px solid rgba(96,151,207,.23)!important; }

@media (min-width:700px) {
	.mq-final-result-page { padding-inline:28px; }
	
}
@media (max-width:390px) {
	.mq-final-result-page { padding-inline:10px;gap:8px; }
	
	
	
	
	.mq-final-reward { grid-template-columns:52px minmax(0,1fr) 57px;gap:8px;padding:11px;border-radius:23px; }
	.mq-final-reward-art { height:58px; }
	.mq-final-reward-art i { width:34px; }
	
	
	
	
	
	
	
	.mq-final-actions { grid-template-columns:minmax(0,1.25fr) minmax(0,.8fr);gap:7px; }
}
@media (max-height:760px) and (min-width:360px) {
	.mq-final-result-page { gap:7px;padding-top:max(18px,env(safe-area-inset-top)); }
	
	
	
	
	
	
	.mq-final-reward { padding:9px 12px; }
	
	
	
	.mq-final-actions .mq-btn { min-height:48px; }
}

/* =========================================================================
   MemoQuest 6.19.0 — résultat compact, scroll fiable et revanche privée
   ========================================================================= */
.mq-shell[data-result-screen] .mq-stage,
.mq-shell[data-result-screen] .mq-view.is-active {
	height:100%;
	min-height:0;
}
.mq-shell[data-result-screen] .mq-view.is-active {
	display:block;
	overflow-y:auto!important;
	overflow-x:hidden!important;
	scrollbar-width:thin;
	scrollbar-color:rgba(34,128,195,.36) transparent;
	padding:0!important;
}
.mq-shell[data-result-screen] .mq-view.is-active::-webkit-scrollbar { width:5px; }
.mq-shell[data-result-screen] .mq-view.is-active::-webkit-scrollbar-thumb { background:rgba(34,128,195,.34);border-radius:99px; }
.mq-final-result-page { font-size:14px; padding-bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px)); }
.mq-final-actions.is-single { grid-template-columns:1fr; }
.mq-final-actions.is-single .mq-final-replay { width:100%; }
.mq-final-replay.is-waiting { filter:saturate(.72);opacity:.82; }
.mq-final-replay.is-loading::after,.mq-rematch-launch.is-loading::after,.mq-rematch-accept.is-loading::after {
	content:"";width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:mq-rematch-spin .7s linear infinite;
}
@keyframes mq-rematch-spin { to{transform:rotate(360deg)} }
.mq-rematch-status {
	position:relative;z-index:4;display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;gap:10px;
	padding:10px 12px;border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(236,249,255,.96));
	border:1px solid rgba(47,151,205,.19);box-shadow:0 12px 25px rgba(29,87,143,.12);
}
.mq-rematch-status[hidden] { display:none!important; }
.mq-rematch-status > span { width:38px;aspect-ratio:1;border-radius:15px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#20c8c5,#2584e3);box-shadow:0 7px 16px rgba(31,132,199,.2); }
.mq-rematch-status > span svg { width:24px;height:24px; }
.mq-rematch-status strong { display:block;color:#153c7a;font-size:.82rem;font-weight:950; }
.mq-rematch-status small { display:block;margin-top:2px;color:#617b9f;font-size:.64rem;line-height:1.25;font-weight:720; }
.mq-rematch-status.is-declined > span { background:linear-gradient(145deg,#ff6f7e,#dc3452); }
.mq-rematch-status.is-accepted > span { background:linear-gradient(145deg,#42d39f,#149b78); }
.mq-rematch-dialog-layer { position:fixed;z-index:80;inset:0;padding:max(18px,env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom));display:grid;place-items:center;background:rgba(16,48,91,.42);animation:mq-rematch-layer-in .22s ease-out; }
@keyframes mq-rematch-layer-in { from{opacity:0} }
.mq-rematch-dialog { width:min(430px,100%);padding:24px 18px 18px;border-radius:30px;text-align:center;background:linear-gradient(160deg,#fff,#eefaff);border:2px solid rgba(255,255,255,.98);box-shadow:0 28px 70px rgba(17,55,105,.34);animation:mq-rematch-dialog-in .42s cubic-bezier(.18,1.25,.35,1); }
@keyframes mq-rematch-dialog-in { from{opacity:0;transform:translateY(24px) scale(.91)} }
.mq-rematch-dialog-icon { position:relative;width:70px;aspect-ratio:1;margin:-54px auto 12px;border-radius:24px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#20d0c6,#247fe4);border:4px solid #fff;box-shadow:0 13px 30px rgba(28,132,199,.29); }
.mq-rematch-dialog-icon svg { width:34px;height:34px; }
.mq-rematch-dialog-icon i { position:absolute;inset:-9px;border:1px solid rgba(40,188,210,.34);border-radius:30px;animation:mq-personal-orbit 4s linear infinite; }
.mq-rematch-dialog > small { color:#12a5b5;font-size:.58rem;font-weight:1000;letter-spacing:.12em; }
.mq-rematch-dialog h3 { margin:5px 0 0;color:#153c7a;font-size:1.1rem;line-height:1.05;font-weight:1000; }
.mq-rematch-dialog p { margin:8px auto 16px;max-width:330px;color:#5c769b;font-size:.72rem;line-height:1.35;font-weight:720; }
.mq-rematch-dialog > div { display:grid;grid-template-columns:1.2fr .8fr;gap:8px; }
.mq-rematch-dialog .mq-btn { min-height:48px;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:.75rem;font-weight:950; }
.mq-rematch-accept { color:#fff!important;background:linear-gradient(135deg,#19c9c1,#2584e4)!important;box-shadow:0 10px 22px rgba(28,133,198,.24)!important; }
.mq-rematch-decline { color:#5f7899!important;background:#eef5fa!important;border:1px solid rgba(75,124,171,.16)!important; }
.mq-rematch-config { position:relative;z-index:4;padding:14px;border-radius:24px;background:linear-gradient(150deg,rgba(255,255,255,.99),rgba(239,250,255,.98));border:1px solid rgba(255,255,255,.98);box-shadow:0 14px 30px rgba(27,83,139,.14); }
.mq-rematch-config header { display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:9px;margin-bottom:6px; }
.mq-rematch-config header > span { width:44px;aspect-ratio:1;border-radius:15px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#20c9c3,#2683e4); }
.mq-rematch-config header svg { width:23px;height:23px; }
.mq-rematch-config header small { display:block;color:#12a5b5;font-size:.52rem;font-weight:1000;letter-spacing:.1em; }
.mq-rematch-config header strong { display:block;color:#153c7a;font-size:.84rem;font-weight:1000; }
.mq-rematch-fields { display:grid;grid-template-columns:1.15fr .85fr .95fr;gap:8px; }
.mq-rematch-fields .mq-premium-field { gap:4px; }
.mq-rematch-fields .mq-premium-field > span { font-size:.56rem; }
.mq-rematch-fields .mq-premium-field select { min-height:43px;padding:8px 28px 8px 9px;border-radius:13px;font-size:.68rem; }
.mq-rematch-launch { width:100%;min-height:48px;margin-top:10px;border-radius:17px!important;display:flex!important;align-items:center;justify-content:center;gap:8px;color:#fff!important;background:linear-gradient(135deg,#19c9c1,#2584e4)!important;box-shadow:0 10px 22px rgba(28,133,198,.22)!important;font-size:.76rem!important;font-weight:950!important; }
.mq-rematch-config > p { min-height:1.2em;margin:6px 2px 0;color:#db3954;font-size:.62rem;font-weight:780;text-align:center; }
.mq-quick-restart { width:min(430px,100%);margin:auto;padding:24px 18px;border-radius:30px;text-align:center;background:rgba(255,255,255,.95);border:1px solid rgba(255,255,255,.98);box-shadow:0 20px 48px rgba(28,85,145,.17); }
.mq-quick-restart > span { position:relative;width:72px;aspect-ratio:1;margin:0 auto 12px;border-radius:24px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#20cec5,#2780e2);border:4px solid #fff;box-shadow:0 13px 28px rgba(30,135,199,.27); }
.mq-quick-restart > span svg { width:35px;height:35px; }
.mq-quick-restart > span i { position:absolute;inset:-10px;border-radius:30px;border:1px solid rgba(29,181,206,.32);animation:mq-personal-orbit 4s linear infinite; }
.mq-quick-restart h3 { margin:0;color:#153c7a;font-size:1.2rem;font-weight:1000; }
.mq-quick-restart p { margin:6px 0 14px;color:#607a9e;font-size:.72rem;font-weight:720; }
@media (max-width:430px) {
	.mq-final-result-page { font-size:13px; }
	.mq-rematch-fields { grid-template-columns:1fr 1fr; }
	.mq-rematch-fields label:first-child { grid-column:1/-1; }
}
@media (max-height:690px) {
	.mq-final-result-page { font-size:12.5px;gap:6px; }
	
	
	
	.mq-final-reward { padding-block:8px; }
	
	
}

/* =========================================================================
   MemoQuest 6.19.0 — résultat SOLO compact sans en-tête, ajusté sans scroll
   ========================================================================= */
.mq-solo-result-page {
	--solo-deep:#123f83;
	--solo-teal:#0fb7c2;
	--solo-blue:#1478eb;
	min-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
	gap:clamp(8px,1vh,12px);
	padding-inline:clamp(10px,2.8vw,18px);
	padding-top:max(14px,env(safe-area-inset-top));
	padding-bottom:max(14px,env(safe-area-inset-bottom));
	grid-template-rows:auto auto auto 1fr auto;
	background:
		radial-gradient(circle at 50% 1%,rgba(255,255,255,.98),transparent 24%),
		radial-gradient(circle at 8% 30%,rgba(29,201,214,.19),transparent 25%),
		radial-gradient(circle at 92% 45%,rgba(28,123,235,.15),transparent 26%),
		linear-gradient(180deg,#4ccaf4 0%,#aeeafb 34%,#edfaff 76%,#fbfdff 100%);
}
.mq-solo-result-page .mq-final-particles i { width:5px;height:5px;border-radius:50%;background:#fff;opacity:.42;box-shadow:0 0 12px #fff; }
.mq-solo-hero {
	display:none;
	position:relative;z-index:2;
	min-height:clamp(215px,29vh,292px);
	padding:clamp(72px,9vh,94px) clamp(14px,3vw,24px) clamp(20px,2.8vh,30px);
	display:flex;align-items:flex-end;justify-content:center;
	border-radius:clamp(31px,6vw,47px);
	background:linear-gradient(155deg,rgba(255,255,255,.995),rgba(246,252,255,.975));
	border:1px solid rgba(255,255,255,.99);
	box-shadow:0 22px 54px rgba(31,91,153,.18),inset 0 1px 0 #fff;
	overflow:visible;
}

.mq-solo-score-card {
	position:relative;z-index:2;overflow:visible;
	min-height:clamp(238px,31vh,305px);
	padding:clamp(38px,4.5vh,52px) clamp(12px,3vw,24px) clamp(12px,2vh,18px);
	display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
	border-radius:clamp(28px,5.4vw,42px);
	background:
		radial-gradient(circle at 15% 5%,rgba(100,255,237,.25),transparent 34%),
		linear-gradient(135deg,#17c8cd 0%,#199de6 50%,#176ae8 100%);
	border:4px solid rgba(255,255,255,.93);
	box-shadow:0 19px 44px rgba(21,91,179,.25),inset 0 0 0 2px rgba(36,230,226,.24),inset 0 2px 0 rgba(255,255,255,.45);
	color:#fff;
}
.mq-solo-score-card::after {
	content:"★";position:absolute;right:3%;top:17%;font-size:clamp(100px,28vw,178px);line-height:1;color:rgba(255,255,255,.12);transform:rotate(-4deg);pointer-events:none;
}
.mq-solo-winner {
	position:absolute;z-index:3;left:50%;top:0;transform:translate(-50%,-38%);
	min-width:clamp(190px,49vw,280px);min-height:clamp(46px,6vh,59px);
	padding:8px 20px;display:flex;align-items:center;justify-content:center;gap:9px;
	border-radius:999px;color:#fff;font-size:clamp(.72rem,3vw,1rem);font-weight:1000;letter-spacing:.035em;
	background:linear-gradient(145deg,#16d0c4,#0aa9ca 55%,#178de5);
	border:4px solid #fff;box-shadow:0 12px 26px rgba(10,123,185,.31),inset 0 1px 0 rgba(255,255,255,.55);
}
.mq-solo-winner svg { width:clamp(21px,5.5vw,29px);height:clamp(21px,5.5vw,29px);color:#ffd33e;filter:drop-shadow(0 2px 3px rgba(135,93,8,.24)); }
.mq-solo-score-copy { position:relative;z-index:2;display:grid;justify-items:center;text-align:center;line-height:1; }
.mq-solo-score-copy small { color:#fff;font-size:clamp(.92rem,3.7vw,1.25rem);font-weight:950; }
.mq-solo-score-copy strong { margin-top:5px;color:#fff;font-size:clamp(3.9rem,17vw,6rem);line-height:.82;font-weight:1000;letter-spacing:-.075em;text-shadow:0 8px 18px rgba(14,75,169,.19);font-variant-numeric:tabular-nums; }
.mq-solo-score-copy span { margin-top:6px;color:#fff;font-size:clamp(.86rem,3.3vw,1.12rem);font-weight:950; }
.mq-solo-rating {
	position:relative;z-index:2;width:min(88%,510px);margin-top:auto;padding:clamp(10px,1.6vh,16px) clamp(12px,3vw,23px);
	display:grid;justify-items:center;gap:6px;text-align:center;
	border-radius:clamp(22px,4.5vw,34px);background:linear-gradient(150deg,#fff,#f5fbff);border:1px solid rgba(255,255,255,.99);
	box-shadow:0 14px 31px rgba(11,72,156,.19),inset 0 1px 0 #fff;
}
.mq-solo-rating > strong { color:#1360c8;font-size:clamp(.69rem,2.9vw,.92rem);font-weight:1000; }
.mq-solo-stars { display:flex;align-items:center;justify-content:center;gap:clamp(2px,.8vw,6px); }
.mq-solo-stars .mq-etoile-geant { width:clamp(25px,6.6vw,39px);height:clamp(25px,6.6vw,39px);filter:drop-shadow(0 5px 5px rgba(185,112,3,.25)); }
.mq-solo-rating > b { color:#1762cc;font-size:clamp(1.05rem,4vw,1.45rem);line-height:1;font-weight:1000; }
.mq-solo-stats {
	position:relative;z-index:2;padding:clamp(12px,2.3vw,18px) clamp(12px,3vw,24px) clamp(10px,2vw,16px);
	border-radius:clamp(28px,5vw,40px);background:linear-gradient(150deg,rgba(255,255,255,.995),rgba(247,252,255,.985));
	border:1px solid rgba(255,255,255,.99);box-shadow:0 18px 40px rgba(31,86,145,.15),inset 0 1px 0 #fff;
}
.mq-solo-stats > header { display:grid;place-items:center;margin-bottom:4px;text-align:center; }
.mq-solo-stats > header strong { position:relative;padding-inline:20px;color:#0da5b6;font-size:clamp(.75rem,3.25vw,1.06rem);font-weight:1000;letter-spacing:.055em; }
.mq-solo-stats > header strong::before,.mq-solo-stats > header strong::after { content:"";position:absolute;top:50%;width:clamp(28px,9vw,75px);height:1px;background:linear-gradient(90deg,transparent,rgba(57,129,195,.28)); }
.mq-solo-stats > header strong::before { right:100%; }
.mq-solo-stats > header strong::after { left:100%;transform:scaleX(-1); }
.mq-solo-stats-list {
	width:min(100%,520px);margin:0 auto;padding:clamp(6px,1vw,10px) clamp(10px,2.4vw,18px);
	border-radius:clamp(20px,4vw,30px);background:linear-gradient(150deg,rgba(255,255,255,.94),rgba(247,252,255,.86));
	border:1px solid rgba(74,145,207,.16);box-shadow:inset 0 1px 0 #fff;
}
.mq-solo-stat-row {
	width:100%;min-height:clamp(31px,4.2vh,40px);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;
	padding:4px clamp(4px,1.8vw,11px);border-bottom:1px solid rgba(55,121,184,.15);font-variant-numeric:tabular-nums;
}
.mq-solo-stat-row:last-child { border-bottom:0; }
.mq-solo-stat-label { min-width:0;display:grid;grid-template-columns:clamp(25px,6vw,34px) minmax(0,1fr);align-items:center;gap:clamp(8px,2.4vw,15px);color:#153e7d; }
.mq-solo-stat-label svg { width:clamp(20px,4.8vw,26px);height:clamp(20px,4.8vw,26px);color:#5d8fd3;stroke-width:1.9; }
.mq-solo-stat-label em { overflow:hidden;text-overflow:ellipsis;color:#17417e;font-size:clamp(.64rem,2.55vw,.82rem);font-style:normal;font-weight:850;white-space:nowrap; }
.mq-solo-stat-row > b { min-width:clamp(50px,14vw,76px);color:#0aa7b4;font-size:clamp(.78rem,3vw,.98rem);font-weight:1000;text-align:right; }
.mq-solo-result-page .mq-final-actions { margin-top:0; }
@media (max-width:390px) {
	.mq-solo-hero { min-height:205px;padding-bottom:18px; }
	.mq-solo-score-card { min-height:300px;padding-inline:9px; }
	.mq-solo-rating { width:92%; }
	.mq-solo-stats { padding-inline:9px; }
	.mq-solo-stat-label { grid-template-columns:24px minmax(0,1fr);gap:8px; }
	.mq-solo-stat-row > b { min-width:54px; }
}
@media (max-width:480px), (max-height:700px) {
	.mq-solo-result-page { gap:6px; }
	.mq-solo-score-card { min-height:228px;padding-top:36px;padding-bottom:8px; }
	.mq-solo-score-copy strong { font-size:3.7rem; }
	.mq-solo-rating { padding-block:8px; }
	.mq-solo-stat-row { min-height:30px; }
}
[data-motion="calme"] .mq-solo-score-card,.mq-shell[data-motion="calme"] .mq-solo-winner { animation:none!important; }

@media (max-height:760px) {
	.mq-final-result-page { gap:5px; padding-top:max(8px,env(safe-area-inset-top)); padding-bottom:max(10px,env(safe-area-inset-bottom)); }
	
	.mq-final-reward { padding:8px 10px; }
	
	
	
	
	.mq-final-actions .mq-btn { min-height:42px; }
}

/* Récapitulatif premium affiché une seule fois après la première victoire du niveau 100. */
.mq-adventure-summary {
	position:relative;z-index:3;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(12px,3vw,20px);
	padding:clamp(13px,3vw,20px);border-radius:clamp(24px,5vw,36px);overflow:hidden;
	background:linear-gradient(135deg,rgba(19,71,163,.98),rgba(22,159,195,.96) 58%,rgba(54,211,190,.96));
	border:1px solid rgba(255,255,255,.72);box-shadow:0 18px 42px rgba(11,72,143,.25),inset 0 1px 0 rgba(255,255,255,.38);color:#fff;
}
.mq-adventure-summary::after { content:"";position:absolute;inset:-50% -10% auto 42%;height:180%;background:radial-gradient(circle,rgba(255,255,255,.25),transparent 62%);pointer-events:none; }
.mq-adventure-emblem { position:relative;display:grid;place-items:center;width:clamp(62px,16vw,88px);aspect-ratio:1;border-radius:28%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.38);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 12px 24px rgba(7,55,124,.18); }
.mq-adventure-emblem svg { width:52%;height:52%;color:#fff;filter:drop-shadow(0 4px 8px rgba(0,46,107,.25)); }
.mq-adventure-emblem i { position:absolute;inset:-5px;border-radius:31%;border:2px solid rgba(255,218,74,.88);animation:mqAdventurePulse 1.8s ease-in-out infinite; }
.mq-adventure-summary > div { min-width:0;position:relative;z-index:2;display:grid;gap:4px; }
.mq-adventure-summary small { font-size:clamp(.6rem,2.4vw,.78rem);font-weight:1000;letter-spacing:.09em;color:#dffcff; }
.mq-adventure-summary strong { font-size:clamp(1.18rem,4.7vw,1.8rem);line-height:1.05;font-weight:1000; }
.mq-adventure-summary p { margin:0;font-size:clamp(.7rem,2.8vw,.9rem);line-height:1.35;font-weight:700;color:rgba(255,255,255,.9); }
.mq-adventure-stats { display:flex;flex-wrap:wrap;gap:6px;margin-top:4px; }
.mq-adventure-stats b { padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);font-size:clamp(.58rem,2.2vw,.73rem);font-weight:950;white-space:nowrap; }
.mq-final-result-page.is-story-finale { animation:mqFinaleReveal .7s cubic-bezier(.2,.9,.25,1) both; }
@keyframes mqAdventurePulse { 0%,100%{transform:scale(.98);opacity:.62} 50%{transform:scale(1.08);opacity:1} }
@keyframes mqFinaleReveal { from{opacity:0;transform:scale(.97)} to{opacity:1;transform:scale(1)} }
[data-motion="calme"] .mq-adventure-emblem i,.mq-shell[data-motion="calme"] .mq-adventure-emblem i,[data-motion="calme"] .mq-final-result-page.is-story-finale,[data-motion="calme"] .mq-final-particles i,[data-motion="calme"] .mq-final-reward-icon i { animation:none!important; }
@media (max-width:390px) { .mq-adventure-summary { grid-template-columns:54px minmax(0,1fr);gap:10px;padding:12px; } .mq-adventure-emblem { width:54px; } }

/* =========================================================================
   MemoQuest 6.19.0 — tableau de bord Profil joueur
   Écran réel, données dynamiques, structure flexible avec défilement interne.
   ========================================================================= */
.mq-shell[data-screen="profil"] {
	--profile-border: rgba(255,255,255,.92);
	--profile-line: #dfe9f4;
	background:
		radial-gradient(circle at 12% 21%, rgba(255,255,255,.42) 0 1.4px, transparent 2.6px),
		radial-gradient(circle at 88% 28%, rgba(255,255,255,.52) 0 1.2px, transparent 2.5px),
		linear-gradient(180deg, #27bbed 0%, #7bd8f5 24%, #d9f1fb 50%, #f2f8f0 72%, #fff0d1 100%);
	background-size: 136px 136px, 184px 184px, auto;
}
.mq-shell[data-screen="profil"] .mq-app {
	gap: clamp(8px, 1.2vh, 13px);
	padding:
		max(clamp(10px, 1.7vh, 18px), env(safe-area-inset-top))
		clamp(10px, 2.8vw, 22px)
		max(clamp(9px, 1.4vh, 16px), env(safe-area-inset-bottom));
}
.mq-shell[data-screen="profil"] .mq-top {
	min-height: 0;
	height: clamp(66px, 9.1vh, 88px);
	padding: clamp(7px, 1vh, 10px) clamp(9px, 2.2vw, 16px);
	gap: clamp(5px, 1.45vw, 11px);
	border: 1px solid var(--profile-border);
	border-radius: clamp(25px, 7vw, 37px);
	background: rgba(255,255,255,.97);
	box-shadow: inset 0 1px 0 #fff, 0 7px 20px rgba(21,60,122,.15);
}
.mq-shell[data-screen="profil"] .mq-avatar {
	overflow:visible; padding:0; background:#fff;
	width: clamp(47px, 6.35vh, 59px);
	height: clamp(47px, 6.35vh, 59px);
	font-size: clamp(1.16rem, 3.1vh, 1.62rem);
	border-width: 3px;
	box-shadow: 0 0 0 3px rgba(22,196,206,.23), inset 0 1px 0 rgba(255,255,255,.35);
	transition: transform .18s var(--ressort), box-shadow .2s;
}
.mq-shell[data-screen="profil"] .mq-avatar > img { width:100%; height:100%; display:block; border-radius:50%; object-fit:cover; }
.mq-shell[data-screen="profil"] .mq-avatar.is-on {
	transform: scale(1.04);
	box-shadow: 0 0 0 5px rgba(255,255,255,.72), 0 0 0 8px rgba(22,196,206,.30), 0 8px 15px rgba(21,60,122,.18);
}
.mq-shell[data-screen="profil"] .mq-avatar b {
	right: -5px; bottom: -4px;
	min-width: clamp(21px, 2.8vh, 26px); height: clamp(21px, 2.8vh, 26px);
	font-size: clamp(.64rem, 1.4vh, .78rem); border-width: 2px;
}
.mq-shell[data-screen="profil"] .mq-profil-info { justify-content:center; gap:0; min-width:40px; }
.mq-shell[data-screen="profil"] .mq-profil-info strong { display:none; }
.mq-shell[data-screen="profil"] .mq-xp { height:clamp(8px,1.2vh,11px); background:#e5edf5; box-shadow:inset 0 1px 2px rgba(21,60,122,.08); }
.mq-shell[data-screen="profil"] .mq-xp i { background:linear-gradient(90deg,#16b8c7,#34d0bd); }
.mq-shell[data-screen="profil"] .mq-chip { gap:clamp(5px,1.2vw,9px); padding:0; background:transparent; font-size:clamp(.95rem,2.35vh,1.25rem); }
.mq-shell[data-screen="profil"] .mq-chip .mq-coin { width:clamp(34px,4.75vh,44px); height:clamp(34px,4.75vh,44px); box-shadow:0 3px 0 #d98816,0 6px 12px rgba(232,149,28,.26),inset 0 2px 0 rgba(255,255,255,.5); }
.mq-shell[data-screen="profil"] .mq-chip .mq-coin svg { width:45%; height:45%; }
.mq-shell[data-screen="profil"] .mq-chip b { min-width:1.55em; text-align:center; }
.mq-shell[data-screen="profil"] .mq-chip .mq-plus { width:clamp(32px,4.35vh,40px); height:clamp(32px,4.35vh,40px); font-size:clamp(1.1rem,2.55vh,1.42rem); box-shadow:0 4px 10px rgba(15,163,180,.24),inset 0 1px 0 rgba(255,255,255,.45); }
.mq-shell[data-screen="profil"] .mq-icon-btn { width:clamp(36px,4.7vh,44px); height:clamp(36px,4.7vh,44px); background:transparent; box-shadow:none; }
.mq-shell[data-screen="profil"] .mq-icon-btn svg { width:66%; height:66%; stroke-width:2.45; }

.mq-shell[data-screen="profil"] .mq-view[data-view="profil"] { gap:0; overflow:hidden; }
.mq-profile-screen { height:100%; min-height:0; display:flex; flex-direction:column; gap:clamp(7px,1vh,11px); }
.mq-profile-heading { flex:0 0 auto; display:grid; grid-template-columns:42px 1fr 42px; align-items:center; min-height:clamp(42px,5.7vh,54px); }
.mq-profile-heading button { width:clamp(36px,4.7vh,44px); height:clamp(36px,4.7vh,44px); border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.94); color:var(--encre); box-shadow:var(--ombre); }
.mq-profile-heading button svg { width:48%; height:48%; stroke-width:2.6; }
.mq-profile-heading h1 { margin:0; text-align:center; color:var(--encre); font-size:clamp(1.35rem,3vh,2rem); line-height:1; font-weight:950; letter-spacing:-.035em; text-shadow:0 1px 0 rgba(255,255,255,.5); }
.mq-profile-scroll { flex:1 1 auto; min-height:0; overflow:auto; padding:1px 2px 8px; scrollbar-width:none; overscroll-behavior:contain; }
.mq-profile-scroll::-webkit-scrollbar { display:none; }
.mq-profile-content { width:min(100%,760px); margin-inline:auto; display:flex; flex-direction:column; gap:clamp(8px,1.15vh,12px); padding-bottom:2px; }

.mq-profile-identity,
.mq-profile-panel,
.mq-profile-metric {
	border:1px solid var(--profile-border);
	background:rgba(255,255,255,.97);
	box-shadow:inset 0 1px 0 #fff,0 6px 17px rgba(21,60,122,.11);
}
.mq-profile-identity { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:clamp(10px,2.6vw,20px); padding:clamp(11px,1.7vh,18px); border-radius:clamp(21px,5.3vw,30px); }
.mq-profile-avatar-large { position:relative; width:clamp(76px,11.3vh,104px); height:clamp(76px,11.3vh,104px); flex:0 0 auto; border-radius:50%; padding:4px; background:#fff; box-shadow:0 0 0 3px rgba(22,196,206,.24),0 8px 18px rgba(21,60,122,.17); }
.mq-profile-avatar-large > img { display:block; width:100%; height:100%; border-radius:50%; object-fit:cover; }
.mq-profile-avatar-large > button { position:absolute; right:-3px; bottom:-2px; width:clamp(29px,4vh,37px); height:clamp(29px,4vh,37px); display:flex; align-items:center; justify-content:center; border-radius:50%; color:#fff; background:var(--degrade); border:3px solid #fff; box-shadow:0 4px 9px rgba(15,163,180,.28); }
.mq-profile-avatar-large > button svg { width:49%; height:49%; stroke-width:2.5; }
.mq-profile-identity-copy { min-width:0; }
.mq-profile-identity-copy h2 { margin:0; color:var(--encre); font-size:clamp(1.18rem,2.8vh,1.75rem); line-height:1.04; font-weight:950; letter-spacing:-.035em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mq-profile-identity-copy > p { margin:4px 0 7px; color:#8093b2; font-size:clamp(.68rem,1.55vh,.9rem); font-weight:800; }
.mq-profile-level-line { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:5px; }
.mq-profile-level-line > b { padding:4px 10px; border-radius:999px; color:#fff; background:linear-gradient(100deg,var(--turq),var(--bleu)); box-shadow:0 3px 8px rgba(15,163,180,.22); font-size:clamp(.67rem,1.55vh,.88rem); white-space:nowrap; }
.mq-profile-level-line > span { color:#7d8fae; font-size:clamp(.64rem,1.4vh,.82rem); white-space:nowrap; }
.mq-profile-level-line > span strong { color:var(--turq-2); }
.mq-profile-xp { display:block; height:clamp(7px,1vh,10px); overflow:hidden; border-radius:999px; background:#e5edf5; box-shadow:inset 0 1px 2px rgba(21,60,122,.08); }
.mq-profile-xp i { display:block; width:var(--p); height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--turq),#34d0bd); transition:width .5s var(--sortie); }
.mq-profile-edit { min-width:clamp(82px,19vw,126px); height:clamp(38px,5.1vh,48px); padding:0 13px!important; display:flex; align-items:center; justify-content:center; gap:6px; border:2px solid var(--mq-border-active)!important; border-radius:999px; color:var(--mq-accent-strong)!important; background:var(--mq-surface-raised)!important; box-shadow:0 4px 11px rgba(21,60,122,.08); font-size:clamp(.7rem,1.55vh,.9rem)!important; font-weight:900!important; }
.mq-profile-edit svg { width:18px; height:18px; stroke-width:2.4; }

.mq-profile-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(6px,1.7vw,10px); }
.mq-profile-metric { min-width:0; min-height:clamp(66px,8.7vh,84px); padding:clamp(8px,1.25vh,12px) clamp(7px,1.6vw,11px); border-radius:clamp(17px,4.3vw,24px); display:flex; align-items:center; gap:clamp(6px,1.3vw,10px); }
.mq-profile-metric > span { width:clamp(34px,4.8vh,45px); height:clamp(34px,4.8vh,45px); flex:0 0 auto; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--past-ciel); color:var(--bleu); }
.mq-profile-metric > span svg { width:54%; height:54%; stroke-width:2.2; }
.mq-profile-metric.is-coins > span { color:#805100; background:radial-gradient(circle at 34% 28%,#ffe78f,#ffc02e 54%,#e8951c); box-shadow:0 3px 7px rgba(232,149,28,.25); }
.mq-profile-metric.is-trophies > span { color:#d99b00; background:#fff3ca; }
.mq-profile-metric.is-stars > span { color:#eba900; background:#fff3ca; }
.mq-profile-metric.is-streak > span { color:#43bd3a; background:#e8fae8; }
.mq-profile-metric > div { min-width:0; }
.mq-profile-metric small { display:block; margin-bottom:1px; color:#7f91af; font-size:clamp(.57rem,1.28vh,.75rem); white-space:nowrap; }
.mq-profile-metric strong { display:block; color:var(--encre); font-size:clamp(.9rem,2.1vh,1.24rem); line-height:1; font-weight:950; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums; }

.mq-profile-columns { display:grid; grid-template-columns:1.04fr .96fr; gap:clamp(8px,2vw,12px); align-items:stretch; }
.mq-profile-panel { min-width:0; padding:clamp(10px,1.45vh,14px); border-radius:clamp(20px,4.8vw,27px); }
.mq-profile-panel > h3 { margin:0 0 clamp(7px,1vh,10px); display:flex; align-items:center; gap:7px; color:var(--encre); font-size:clamp(.79rem,1.75vh,1rem); font-weight:950; }
.mq-profile-panel > h3 svg { width:19px; height:19px; color:#63acec; stroke-width:2.4; }
.mq-profile-panel-body { display:grid; gap:5px; }
.mq-profile-progress-row { display:grid; grid-template-columns:31px minmax(0,1fr); align-items:center; gap:7px; padding:5px 7px; border:1px solid #e3ebf4; border-radius:12px; background:#fbfdff; }
.mq-profile-row-icon { width:27px; height:27px; border-radius:9px; display:flex; align-items:center; justify-content:center; color:#46aee6; background:#eaf7ff; }
.mq-profile-row-icon svg { width:61%; height:61%; stroke-width:2.2; }
.mq-profile-progress-row:nth-child(2) .mq-profile-row-icon { color:#58c95c; background:#ecfaed; }
.mq-profile-progress-row:nth-child(3) .mq-profile-row-icon { color:#8f5ddd; background:#f2ebff; }
.mq-profile-progress-row:nth-child(4) .mq-profile-row-icon { color:#398fd4; background:#e7f3ff; }
.mq-profile-progress-row > div { min-width:0; }
.mq-profile-progress-row p { margin:0 0 4px; display:flex; align-items:baseline; justify-content:space-between; gap:6px; min-width:0; color:var(--encre); font-size:clamp(.57rem,1.22vh,.72rem); }
.mq-profile-progress-row p span { min-width:0; white-space:normal; line-height:1.08; }
.mq-profile-progress-row p b { flex:0 0 auto; color:var(--turq-2); font-size:clamp(.56rem,1.18vh,.7rem); font-variant-numeric:tabular-nums; white-space:nowrap; }
.mq-profile-meter { display:block; height:5px; border-radius:999px; background:#e6edf5; overflow:hidden; }
.mq-profile-meter i { display:block; width:var(--p); height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--turq),#32cbb0); }
.mq-profile-performance dl { margin:0; display:grid; }
.mq-profile-performance dl > div { min-height:clamp(30px,4vh,38px); display:flex; align-items:center; justify-content:space-between; gap:8px; border-bottom:1px solid var(--profile-line); }
.mq-profile-performance dl > div:last-child { border-bottom:0; }
.mq-profile-performance dt { min-width:0; color:var(--encre); font-size:clamp(.61rem,1.35vh,.78rem); font-weight:800; }
.mq-profile-performance dd { margin:0; color:var(--turq-2); font-size:clamp(.72rem,1.65vh,.95rem); font-weight:950; font-variant-numeric:tabular-nums; white-space:nowrap; }

.mq-profile-success { padding-bottom:clamp(11px,1.5vh,15px); }
.mq-profile-achievements { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(5px,1.4vw,10px); }
.mq-profile-achievement { min-width:0; display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center; }
.mq-profile-achievement > span { width:clamp(49px,7.2vh,67px); height:clamp(55px,7.9vh,74px); display:flex; align-items:center; justify-content:center; color:#fff; clip-path:polygon(50% 0,91% 17%,91% 69%,50% 100%,9% 69%,9% 17%); background:linear-gradient(145deg,#13ac91,#087c72); border:4px solid #edbe42; filter:drop-shadow(0 4px 4px rgba(21,60,122,.16)); }
.mq-profile-achievement > span svg { width:45%; height:45%; stroke-width:2.4; }
.mq-profile-achievement.is-five > span { background:linear-gradient(145deg,#9d4dd8,#6337a5); border-color:#f0a349; color:#ffe05a; }
.mq-profile-achievement.is-explorer > span { background:linear-gradient(145deg,#18aebf,#116d92); border-color:#eaa83d; color:#fff4bc; }
.mq-profile-achievement.is-guardian > span { background:linear-gradient(145deg,#2a9dc8,#164b86); border-color:#ffd34d; }
.mq-profile-achievement.is-locked { opacity:.58; filter:grayscale(.78); }
.mq-profile-achievement.is-locked > span { background:linear-gradient(145deg,#8e99a7,#596576); border-color:#a8b0ba; }
.mq-profile-achievement small { color:var(--encre); font-size:clamp(.54rem,1.2vh,.72rem); line-height:1.12; font-weight:800; }

.mq-profile-preferences > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.mq-profile-preferences article { min-width:0; display:grid; grid-template-columns:34px minmax(0,1fr); grid-template-rows:auto auto; column-gap:7px; align-items:center; padding:8px; border:1px solid #dce7f2; border-radius:13px; background:#fbfdff; }
.mq-profile-preferences article > span { grid-row:1 / 3; width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; background:linear-gradient(145deg,#68cbed,#388fde); }
.mq-profile-preferences article > span svg { width:55%; height:55%; stroke-width:2.2; }
.mq-profile-preferences small { min-width:0; color:#7f91af; font-size:clamp(.52rem,1.1vh,.67rem); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mq-profile-preferences strong { min-width:0; color:var(--encre); font-size:clamp(.65rem,1.4vh,.84rem); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.mq-profile-actions { flex:0 0 auto; width:min(86%,650px); margin-inline:auto; display:grid; gap:clamp(6px,.8vh,8px); }
.mq-profile-actions .mq-btn { min-height:clamp(43px,5.7vh,54px); border-radius:999px; font-size:clamp(.78rem,1.8vh,1.02rem); }
.mq-profile-actions .mq-btn-primary { display:flex; align-items:center; justify-content:center; gap:8px; box-shadow:0 5px 0 #1767b8,0 10px 18px rgba(21,60,122,.18); }
.mq-profile-actions .mq-btn-primary svg { width:20px; height:20px; }
.mq-profile-actions .mq-btn-ghost { min-height:clamp(39px,5vh,48px); background:rgba(255,255,255,.95); border:2px solid var(--turq); color:var(--turq-2); }

.mq-profile-field { display:grid; gap:6px; color:var(--encre); font-weight:900; }
.mq-profile-field input { width:100%; height:48px; padding:0 14px; border:2px solid #d8e6f2; border-radius:14px; color:var(--encre); background:#f8fbfe; font:inherit; outline:0; }
.mq-profile-field input:focus { border-color:var(--turq); box-shadow:0 0 0 4px rgba(22,196,206,.12); }
.mq-profile-field small { color:var(--encre-2); font-size:.72rem; }
.mq-profile-sheet-avatar { padding:2px; border-radius:50%; }
.mq-profile-sheet-avatar img { width:100%; height:100%; border-radius:50%; object-fit:cover; }

.mq-avatar-picker { display:grid; gap:9px; }
.mq-avatar-picker-title { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
.mq-avatar-picker-title h4 { margin:1px 0 0; color:var(--encre); font-size:1rem; line-height:1; font-weight:950; }
.mq-avatar-picker-title > span { min-width:72px; height:34px; padding:0 10px; display:flex; align-items:center; justify-content:center; gap:5px; border-radius:999px; color:#704800; background:linear-gradient(145deg,#fff6d0,#ffd756); box-shadow:inset 0 1px 0 #fff,0 4px 10px rgba(217,139,20,.15); font-weight:950; }
.mq-avatar-picker-title > span svg { width:17px; height:17px; }
.mq-avatar-picker-note { margin:0; color:#6d82a3; font-size:.7rem; line-height:1.35; font-weight:750; }
.mq-avatar-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.mq-avatar-option { position:relative; min-width:0; min-height:88px; padding:7px; display:grid; grid-template-columns:68px minmax(0,1fr); align-items:center; gap:7px; border:2px solid #e1eaf3; border-radius:18px; background:linear-gradient(145deg,#fff,#f6faff); box-shadow:0 4px 12px rgba(21,60,122,.08); text-align:left; transition:transform .16s var(--ressort),border-color .18s,box-shadow .18s; overflow:hidden; }
.mq-avatar-option:active { transform:scale(.975); }
.mq-avatar-option.is-selected { border-color:#12bdc8; box-shadow:0 0 0 3px rgba(18,189,200,.14),0 7px 16px rgba(21,60,122,.12); background:linear-gradient(145deg,#f7ffff,#e9fbfc); }
.mq-avatar-option.is-locked { background:linear-gradient(145deg,#fbfcfe,#eff3f7); }
.mq-avatar-option-art { position:relative; width:68px; height:68px; border-radius:50%; padding:2px; background:#fff; box-shadow:0 0 0 2px rgba(26,190,201,.2),0 5px 12px rgba(21,60,122,.13); }
.mq-avatar-option-art img { width:100%; height:100%; display:block; border-radius:50%; object-fit:cover; }
.mq-avatar-option-art i { position:absolute; right:-2px; bottom:-2px; width:23px; height:23px; display:flex; align-items:center; justify-content:center; border-radius:50%; color:#fff; background:linear-gradient(145deg,#15c8c4,#188ce0); border:2px solid #fff; box-shadow:0 3px 7px rgba(21,60,122,.19); }
.mq-avatar-option.is-locked .mq-avatar-option-art i { background:linear-gradient(145deg,#6c7d92,#425268); }
.mq-avatar-option-art i svg { width:52%; height:52%; stroke-width:2.6; }
.mq-avatar-option-copy { min-width:0; display:grid; gap:4px; }
.mq-avatar-option-copy strong { min-width:0; color:var(--encre); font-size:.78rem; font-weight:950; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mq-avatar-option-copy small { min-width:0; display:flex; align-items:center; gap:4px; color:#7488a8; font-size:.62rem; font-weight:850; white-space:nowrap; }
.mq-avatar-option.is-selected small { color:#0b9ba8; }
.mq-avatar-option-copy small svg { width:15px; height:15px; color:#d08a00; }
.mq-avatar-option-copy small b { color:#8a5b00; }
.mq-avatar-purchase-summary { display:grid; grid-template-columns:104px minmax(0,1fr); align-items:center; gap:13px; padding:12px; border-radius:20px; background:linear-gradient(145deg,#f1fdff,#edf5fb); border:1px solid #d9eaf3; }
.mq-avatar-purchase-summary > img { width:104px; height:104px; border-radius:50%; object-fit:cover; filter:drop-shadow(0 8px 12px rgba(21,60,122,.18)); }
.mq-avatar-purchase-summary p { margin:0 0 7px; color:var(--encre); font-size:.86rem; line-height:1.3; font-weight:850; }
.mq-avatar-purchase-summary strong { display:flex; align-items:center; gap:5px; color:#8a5b00; font-size:1rem; }
.mq-avatar-purchase-summary strong svg { width:19px; height:19px; }
.mq-avatar-purchase-summary small { display:block; margin-top:4px; color:#7386a3; font-size:.68rem; font-weight:750; }
@media (min-width:560px) { .mq-avatar-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:370px) { .mq-avatar-option { grid-template-columns:58px minmax(0,1fr); min-height:76px; padding:6px; } .mq-avatar-option-art { width:58px; height:58px; } .mq-avatar-option-copy strong { font-size:.7rem; } .mq-avatar-option-copy small { font-size:.56rem; } }

.mq-profile-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mq-profile-detail-grid .mq-profile-metric { min-height:70px; box-shadow:none; border-color:#e1eaf4; background:#f9fcff; }

@media (min-width: 600px) {
	.mq-profile-content { width:min(100%,760px); }
	.mq-profile-actions { width:min(78%,620px); }
}
@media (max-width: 390px) {
	.mq-profile-identity { grid-template-columns:auto minmax(0,1fr); }
	.mq-profile-edit { grid-column:1 / 3; width:100%; height:36px; }
	.mq-profile-metric { flex-direction:column; justify-content:center; text-align:center; gap:4px; padding-inline:4px; }
	.mq-profile-metric > span { width:32px; height:32px; }
	.mq-profile-metric small { font-size:.52rem; }
	.mq-profile-columns { grid-template-columns:1fr; }
	.mq-profile-preferences article { grid-template-columns:29px minmax(0,1fr); padding:6px; }
	.mq-profile-preferences article > span { width:28px; height:28px; }
}
@media (max-height: 760px) {
	.mq-shell[data-screen="profil"] .mq-app { gap:6px; padding-top:max(7px,env(safe-area-inset-top)); padding-bottom:max(7px,env(safe-area-inset-bottom)); }
	.mq-shell[data-screen="profil"] .mq-top { height:58px; }
	.mq-shell[data-screen="profil"] .mq-avatar { width:42px; height:42px; font-size:1rem; }
	.mq-shell[data-screen="profil"] .mq-avatar b { min-width:19px; height:19px; }
	.mq-shell[data-screen="profil"] .mq-chip .mq-coin { width:29px; height:29px; }
	.mq-shell[data-screen="profil"] .mq-chip .mq-plus { width:28px; height:28px; }
	.mq-shell[data-screen="profil"] .mq-icon-btn { width:31px; height:31px; }
	.mq-profile-heading { min-height:37px; }
	.mq-profile-identity { padding:9px; }
	.mq-profile-avatar-large { width:68px; height:68px; }
	.mq-profile-metric { min-height:59px; }
	.mq-profile-panel { padding:9px; }
}

/* Ajustement de densité mobile : reproduit les proportions de la maquette 9:16
   sans masquer les libellés ni imposer un second écran. */
@media (max-width: 500px) {
	.mq-profile-screen { gap:6px; }
	.mq-profile-heading { min-height:38px; grid-template-columns:36px 1fr 36px; }
	.mq-profile-heading button { width:34px; height:34px; }
	.mq-profile-heading h1 { font-size:1.35rem; }
	.mq-profile-content { gap:7px; }
	.mq-profile-identity { min-height:99px; grid-template-columns:76px minmax(0,1fr) 84px; gap:8px; padding:8px 10px; border-radius:22px; }
	.mq-profile-avatar-large { width:72px; height:72px; padding:3px; }
	.mq-profile-avatar-large > button { width:28px; height:28px; border-width:2px; }
	.mq-profile-identity-copy h2 { font-size:1.12rem; }
	.mq-profile-identity-copy > p { margin:2px 0 4px; font-size:.62rem; }
	.mq-profile-level-line { gap:4px; margin-bottom:3px; }
	.mq-profile-level-line > b { padding:3px 7px; font-size:.59rem; }
	.mq-profile-level-line > span { font-size:.56rem; }
	.mq-profile-xp { height:6px; }
	.mq-profile-edit { min-width:0; width:84px; height:34px; padding:0 8px!important; gap:4px; font-size:.64rem!important; }
	.mq-profile-edit svg { width:14px; height:14px; }

	.mq-profile-metrics { gap:5px; }
	.mq-profile-metric { min-height:61px; padding:5px 3px; border-radius:17px; flex-direction:column; justify-content:center; text-align:center; gap:2px; }
	.mq-profile-metric > span { width:28px; height:28px; }
	.mq-profile-metric small { margin:0; font-size:.51rem; line-height:1; }
	.mq-profile-metric strong { font-size:.82rem; line-height:1; max-width:100%; }

	.mq-profile-columns { gap:7px; }
	.mq-profile-panel { padding:8px; border-radius:19px; }
	.mq-profile-panel > h3 { margin-bottom:5px; gap:5px; font-size:.74rem; }
	.mq-profile-panel > h3 svg { width:16px; height:16px; }
	.mq-profile-panel-body { gap:3px; }
	.mq-profile-progress-row { grid-template-columns:24px minmax(0,1fr); gap:5px; padding:3px 5px; border-radius:9px; }
	.mq-profile-row-icon { width:22px; height:22px; border-radius:7px; }
	.mq-profile-progress-row p { margin-bottom:2px; font-size:.48rem; }
	.mq-profile-progress-row p b { font-size:.47rem; }
	.mq-profile-meter { height:4px; }
	.mq-profile-performance dl > div { min-height:25px; }
	.mq-profile-performance dt { font-size:.53rem; }
	.mq-profile-performance dd { font-size:.65rem; }

	.mq-profile-success { padding-bottom:8px; }
	.mq-profile-achievements { gap:3px; }
	.mq-profile-achievement { gap:3px; }
	.mq-profile-achievement > span { width:42px; height:47px; border-width:3px; }
	.mq-profile-achievement small { font-size:.47rem; line-height:1.05; }

	.mq-profile-preferences > div { gap:4px; }
	.mq-profile-preferences article { grid-template-columns:25px minmax(0,1fr); column-gap:4px; padding:5px; border-radius:10px; }
	.mq-profile-preferences article > span { width:24px; height:24px; }
	.mq-profile-preferences small { font-size:.43rem; }
	.mq-profile-preferences strong { font-size:.56rem; }

	.mq-profile-actions { width:86%; gap:5px; }
	.mq-profile-actions .mq-btn { min-height:39px; font-size:.72rem; }
	.mq-profile-actions .mq-btn-ghost { min-height:35px; }
}

/* Calibration finale sur téléphone 9:16 : exploite l’espace disponible pour
   garder les statistiques lisibles tout en laissant les actions stables. */
@media (min-width: 391px) and (max-width: 500px) and (min-height: 800px) {
	.mq-profile-identity { min-height:108px; grid-template-columns:82px minmax(0,1fr) 88px; padding:10px 11px; }
	.mq-profile-avatar-large { width:78px; height:78px; }
	.mq-profile-identity-copy h2 { font-size:1.2rem; }
	.mq-profile-identity-copy > p { font-size:.66rem; }
	.mq-profile-edit { width:88px; height:36px; font-size:.68rem!important; }
	.mq-profile-metric { min-height:68px; }
	.mq-profile-metric > span { width:31px; height:31px; }
	.mq-profile-metric small { font-size:.55rem; }
	.mq-profile-metric strong { font-size:.9rem; }
	.mq-profile-panel { padding:9px; }
	.mq-profile-panel > h3 { font-size:.79rem; margin-bottom:6px; }
	.mq-profile-progress-row { grid-template-columns:27px minmax(0,1fr); padding:4px 6px; }
	.mq-profile-row-icon { width:25px; height:25px; }
	.mq-profile-progress-row p { font-size:.52rem; margin-bottom:3px; }
	.mq-profile-progress-row p b { font-size:.51rem; }
	.mq-profile-performance dl > div { min-height:29px; }
	.mq-profile-performance dt { font-size:.57rem; }
	.mq-profile-performance dd { font-size:.7rem; }
	.mq-profile-achievement > span { width:49px; height:55px; }
	.mq-profile-achievement small { font-size:.51rem; }
	.mq-profile-preferences article { padding:7px; grid-template-columns:29px minmax(0,1fr); }
	.mq-profile-preferences article > span { width:28px; height:28px; }
	.mq-profile-preferences small { font-size:.47rem; }
	.mq-profile-preferences strong { font-size:.62rem; }
}

/* ------------------------------------------------------------------
   MemoQuest 6.19.0 — Code promo premium, isolé en bas de la Boutique
   ------------------------------------------------------------------ */
.mq-promo-card {
	position:relative;isolation:isolate;overflow:hidden;display:grid;gap:13px;padding:16px;border-radius:26px;
	background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(236,251,255,.96));
	border:1px solid rgba(73,205,224,.3);box-shadow:0 14px 34px rgba(12,72,139,.14),inset 0 1px 0 #fff;
}
.mq-promo-aura { pointer-events:none;position:absolute;z-index:-2;inset:-55%;background:conic-gradient(from 20deg,transparent,rgba(32,211,218,.22),transparent 30%,rgba(69,139,242,.18),transparent 62%,rgba(255,197,63,.18),transparent);animation:mq-promo-aura 14s linear infinite; }
.mq-promo-shine { pointer-events:none;position:absolute;z-index:-1;top:-80%;left:-35%;width:48%;height:260%;transform:rotate(22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);animation:mq-promo-shine 6.5s ease-in-out infinite; }
.mq-promo-head { position:relative;z-index:1;display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:12px; }
.mq-promo-focus { width:100%;text-align:left;cursor:text;border-radius:18px;touch-action:manipulation; }
.mq-promo-focus:active { transform:none; }
.mq-promo-icon { width:58px;aspect-ratio:1;display:grid;place-items:center;border-radius:19px;color:#fff;background:linear-gradient(145deg,#20d6d8,#2d83e8);border:3px solid #fff;box-shadow:0 9px 20px rgba(24,135,201,.24),0 0 0 4px rgba(34,205,218,.09); }
.mq-promo-icon svg { width:31px;height:31px; }
.mq-promo-head h3 { margin:0;color:#123c80;font-size:1.2rem;line-height:1;font-weight:1000;letter-spacing:-.035em; }
.mq-promo-head small { display:block;margin-top:5px;color:#627c9f;font-size:.73rem;line-height:1.3;font-weight:750; }
.mq-promo-form { position:relative;z-index:1;display:grid;gap:7px; }
.mq-promo-form > label { color:#24558b;font-size:.69rem;font-weight:950;letter-spacing:.08em;text-transform:uppercase; }
.mq-promo-entry { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px; }
.mq-promo-entry input { position:relative;z-index:2;pointer-events:auto;touch-action:auto;-webkit-user-select:text;user-select:text;caret-color:#123d80;min-width:0;height:52px;padding:0 15px;border-radius:17px;border:2px solid #d5e7ef;background:rgba(255,255,255,.94);color:#123d80;font:1000 1.05rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.18em;text-align:center;outline:none;box-shadow:inset 0 2px 7px rgba(17,72,126,.05);transition:border-color .2s,box-shadow .2s,transform .2s; }
.mq-promo-entry input::placeholder { color:#a7b9cb;letter-spacing:.15em; }
.mq-promo-entry input:focus { border-color:#26cbd5;box-shadow:0 0 0 4px rgba(38,203,213,.12),inset 0 2px 7px rgba(17,72,126,.04); }
.mq-promo-entry button { position:relative;z-index:2;pointer-events:auto;touch-action:manipulation;min-width:116px;height:52px;display:flex;align-items:center;justify-content:center;gap:7px;padding:0 15px;border:0;border-radius:17px;color:#fff;background:linear-gradient(145deg,#20d6d1,#267fe6);font-family:inherit;font-size:.83rem;line-height:1;font-weight:950;box-shadow:0 9px 19px rgba(29,131,202,.24),inset 0 1px 0 rgba(255,255,255,.42);cursor:pointer;transition:transform .16s,filter .16s; }
.mq-promo-entry button:active { transform:scale(.97); }
.mq-promo-entry button svg { width:21px;height:21px; }
.mq-promo-form > small { color:#7286a2;font-size:.66rem;font-weight:750; }
.mq-promo-card.is-error { animation:mq-promo-error .42s ease both; }
.mq-promo-card.is-error .mq-promo-entry input { border-color:#f15a70;box-shadow:0 0 0 4px rgba(241,90,112,.1); }
.mq-promo-card.is-error .mq-promo-form > small { color:#dd3f58; }
.mq-promo-card.is-used { background:linear-gradient(145deg,#f7fffb,#ebfbf5);border-color:rgba(54,194,115,.25); }
.mq-promo-card.is-used .mq-promo-icon { background:linear-gradient(145deg,#62ea7b,#1aa655); }
.mq-promo-used { position:relative;z-index:1;display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;column-gap:10px;padding:11px 12px;border-radius:18px;background:rgba(255,255,255,.8);border:1px solid rgba(44,178,104,.18); }
.mq-promo-used > span { grid-row:1/3;width:38px;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;color:#fff;background:linear-gradient(145deg,#5de977,#1ba958);box-shadow:0 5px 12px rgba(25,155,81,.2); }
.mq-promo-used svg { width:23px;height:23px; }
.mq-promo-used strong { color:#177544;font-size:.87rem;font-weight:950; }
.mq-promo-used small { color:#5d8a73;font-size:.66rem;font-weight:750; }
.mq-promo-celebration { position:absolute;z-index:9999;inset:0;display:grid;place-items:center;padding:22px;opacity:0;pointer-events:none;transition:opacity .34s ease; }
.mq-promo-celebration.is-on { opacity:1;pointer-events:auto; }
.mq-promo-backdrop { position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(12,134,194,.36),rgba(3,21,61,.72));saturate(1.1);saturate(1.1); }
.mq-promo-reward { position:relative;z-index:3;width:min(88vw,360px);display:grid;justify-items:center;overflow:hidden;padding:28px 24px 22px;border-radius:34px;background:linear-gradient(155deg,#fff,#edfcff 58%,#e7f7ff);border:1px solid rgba(255,255,255,.9);box-shadow:0 30px 80px rgba(0,32,93,.36),inset 0 1px 0 #fff;transform:translateY(28px) scale(.82);opacity:0; }
.mq-promo-celebration.is-on .mq-promo-reward { animation:mq-promo-reward-in .78s cubic-bezier(.18,1.25,.28,1) forwards; }
.mq-promo-reward-rays { position:absolute;inset:-60%;z-index:-1;background:repeating-conic-gradient(from 0deg,rgba(34,210,215,.18) 0 7deg,transparent 7deg 18deg);animation:mq-promo-aura 12s linear infinite; }
.mq-promo-reward-coin { width:94px;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;color:#fff3a2;background:radial-gradient(circle at 35% 28%,#fff3a2 0 8%,#ffd34d 12% 52%,#e89d18 55% 70%,#ffc12e 72%);border:6px solid #fff6bb;box-shadow:0 0 0 7px rgba(255,203,53,.13),0 14px 30px rgba(188,118,14,.28),inset 0 2px 5px rgba(255,255,255,.65);animation:mq-promo-coin-float 1.4s ease-in-out infinite alternate; }
.mq-promo-reward-coin svg { width:52px;height:52px; }
.mq-promo-reward p { margin:16px 0 1px;color:#17a9b4;font-size:.7rem;font-weight:1000;letter-spacing:.12em; }
.mq-promo-reward > strong { color:#113d81;font-size:clamp(2.4rem,13vw,4rem);line-height:1;font-weight:1000;letter-spacing:-.055em;text-shadow:0 2px 0 #fff; }
.mq-promo-reward h3 { margin:1px 0 8px;color:#123d80;font-size:1.12rem;font-weight:950; }
.mq-promo-reward small { color:#627d9e;font-size:.76rem;font-weight:800; }
.mq-promo-reward small b { color:#123d80; }
.mq-promo-reward button { margin-top:18px;min-width:160px;height:46px;border:0;border-radius:16px;color:#fff;background:linear-gradient(145deg,#22d4d1,#287fe4);font-family:inherit;font-size:.88rem;line-height:1;font-weight:950;box-shadow:0 9px 20px rgba(29,129,198,.23);cursor:pointer; }
.mq-promo-particle { position:absolute;z-index:2;left:50%;top:50%;width:12px;aspect-ratio:1;border-radius:50%;opacity:0;background:radial-gradient(circle at 34% 28%,#fff8b3,#ffd03d 55%,#e89916 58%);box-shadow:0 0 10px rgba(255,216,72,.8);transform:translate(-50%,-50%) rotate(var(--a)) translateY(0) scale(.2); }
.mq-promo-celebration.is-on .mq-promo-particle { animation:mq-promo-particle 1.25s cubic-bezier(.16,.8,.2,1) calc(var(--i) * 17ms) both; }
@keyframes mq-promo-aura { to { transform:rotate(360deg); } }
@keyframes mq-promo-shine { 0%,55% { transform:translateX(-80%) rotate(22deg);opacity:0 } 66% { opacity:.8 } 85%,100% { transform:translateX(340%) rotate(22deg);opacity:0 } }
@keyframes mq-promo-error { 0%,100%{transform:translateX(0)} 22%{transform:translateX(-7px)} 44%{transform:translateX(6px)} 66%{transform:translateX(-4px)} 84%{transform:translateX(2px)} }
@keyframes mq-promo-reward-in { 0%{opacity:0;transform:translateY(28px) scale(.82)} 70%{opacity:1;transform:translateY(-5px) scale(1.03)} 100%{opacity:1;transform:translateY(0) scale(1)} }
@keyframes mq-promo-coin-float { to { transform:translateY(-6px) rotate(3deg) } }
@keyframes mq-promo-particle { 0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--a)) translateY(0) scale(.2)} 18%{opacity:1} 100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(1)} }
[data-motion="calme"] .mq-promo-aura,[data-motion="calme"] .mq-promo-shine,[data-motion="calme"] .mq-promo-reward-rays,[data-motion="calme"] .mq-promo-reward-coin,[data-motion="calme"] .mq-promo-particle { animation:none!important; }
@media (max-width:390px) { .mq-promo-card{padding:14px;border-radius:23px}.mq-promo-entry{grid-template-columns:minmax(0,1fr) 104px}.mq-promo-entry button{min-width:104px;padding-inline:10px}.mq-promo-entry button span{font-size:.75rem} }

/* =========================================================================
   THÈME GRENAT 6.26.0 — calme, premium et strictement isolé
   Aucun sélecteur de ce bloc n'agit hors data-skin="grenat".
   ========================================================================= */
.mq-shell[data-skin="grenat"] {
  --ciel-1:#4a2029; --ciel-2:#642d39; --ciel-3:#4c202a; --ciel-4:#36161e; --sable:#241015;
  --blanc:#fff8f3; --encre:#4a1720; --encre-2:#7d5960; --encre-3:#ae8d90;
  --turq:#a92f4d; --turq-2:#7e2138; --bleu:#9d2b48; --bleu-2:#681a2d;
  --degrade:linear-gradient(112deg,#b33b59 0%,#8d263f 54%,#671a2d 100%);
  --past-menthe:#f8ece7; --past-bleu:#f7e9e5; --past-lilas:#f3e4e7;
  --past-creme:#fff5ed; --past-rose:#f9e6e7; --past-ciel:#faefeb;
  --ombre:0 2px 4px rgba(55,15,24,.05),0 8px 20px rgba(55,15,24,.14);
  --ombre-forte:0 5px 12px rgba(42,10,17,.10),0 18px 42px rgba(42,10,17,.22);
  --mq-grenat-ivory:#fff8f3; --mq-grenat-ivory-2:#f7eae4;
  --mq-grenat-wine:#6a1c30; --mq-grenat-ruby:#9d2b48; --mq-grenat-rose:#c45a70;
  --mq-grenat-champagne:#d9ae7d; --mq-grenat-line:#e7c7a9; --mq-grenat-ink:#481620;
  background:
    radial-gradient(ellipse at 50% -8%,rgba(218,116,132,.24) 0%,rgba(133,45,63,.10) 35%,transparent 62%),
    radial-gradient(ellipse at 50% 54%,rgba(126,48,62,.18) 0%,transparent 58%),
    linear-gradient(180deg,#4a2029 0%,#5a2733 31%,#431b25 68%,#281118 100%);
}

.mq-ambiance > .mq-grenat-shards { display:none; }
.mq-ambiance > .mq-night-moon,
.mq-ambiance > .mq-night-stars,
.mq-ambiance > .mq-night-constellations,
.mq-ambiance > .mq-night-haze { display:none; }
.mq-shell[data-skin="grenat"] .mq-ambiance {
  contain:strict;
  background:
    radial-gradient(circle at 50% 14%,rgba(255,213,202,.08),transparent 35%),
    linear-gradient(180deg,rgba(255,255,255,.015),rgba(24,5,10,.18));
}
.mq-shell[data-skin="grenat"] .mq-ambiance::before {
  content:""; position:absolute; inset:-12%; opacity:.30; pointer-events:none;
  background:
    radial-gradient(circle at 12% 20%,rgba(255,210,198,.42) 0 1px,transparent 2px),
    radial-gradient(circle at 80% 26%,rgba(255,210,198,.34) 0 1.2px,transparent 2.2px),
    radial-gradient(circle at 24% 70%,rgba(233,139,154,.31) 0 1px,transparent 2px),
    radial-gradient(circle at 70% 78%,rgba(255,210,198,.30) 0 1.3px,transparent 2.4px),
    radial-gradient(circle at 48% 45%,rgba(255,225,208,.24) 0 1px,transparent 2px);
  background-size:180px 170px,230px 210px,260px 240px,310px 280px,360px 330px;
  animation:mq-grenat-dust 24s linear infinite;
  will-change:transform;
}
.mq-shell[data-skin="grenat"] .mq-ambiance::after {
  content:""; position:absolute; inset:auto 0 0; height:25%; opacity:.25; pointer-events:none;
  background:
    linear-gradient(180deg,transparent,rgba(25,7,12,.32)),
    radial-gradient(ellipse at 12% 100%,rgba(158,48,73,.38),transparent 34%),
    radial-gradient(ellipse at 88% 100%,rgba(158,48,73,.34),transparent 36%);
}
.mq-shell[data-skin="grenat"] .mq-ambiance i { border-radius:50%; }
.mq-shell[data-skin="grenat"] .mq-ambiance i:nth-child(1) {
  width:78%;height:35%;left:11%;top:-5%;
  background:linear-gradient(103deg,transparent 12%,rgba(255,224,211,.12) 36%,transparent 54%),linear-gradient(77deg,transparent 28%,rgba(255,217,207,.08) 46%,transparent 63%);
  filter:blur(8px);transform-origin:50% 0;animation:mq-grenat-rays 15s ease-in-out infinite alternate;
}
.mq-shell[data-skin="grenat"] .mq-ambiance i:nth-child(2) {
  width:58vmax;height:58vmax;right:-24vmax;top:20vmax;
  background:radial-gradient(circle,rgba(196,77,99,.13),transparent 64%);
  animation:mq-grenat-orb 28s ease-in-out infinite alternate;
}
.mq-shell[data-skin="grenat"] .mq-ambiance i:nth-child(3) {
  width:52vmax;height:42vmax;left:-20vmax;bottom:-12vmax;
  background:radial-gradient(ellipse,rgba(220,132,135,.10),transparent 65%);
  animation:mq-grenat-orb-b 34s ease-in-out infinite alternate;
}
.mq-shell[data-skin="grenat"] .mq-ambiance > .mq-grenat-shards {
  display:block;position:absolute;pointer-events:none;z-index:1;opacity:.16;will-change:transform;
  background-repeat:no-repeat;background-size:contain;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 340 220'%3E%3Cg fill='none' stroke='%23efb6ad' stroke-width='1.2' opacity='.9'%3E%3Cpath d='M24 198 67 101l39 97Z'/%3E%3Cpath d='m67 101-8 55 47 42M24 198l35-42 8-55'/%3E%3Cpath d='M244 196 283 120l35 76Z'/%3E%3Cpath d='m283 120-6 44 41 32M244 196l33-32 6-44'/%3E%3Cpath d='M151 210 177 156l24 54Z'/%3E%3C/g%3E%3C/svg%3E");
}
.mq-shell[data-skin="grenat"] .mq-grenat-shards-a { width:clamp(180px,42vw,420px);aspect-ratio:340/220;left:-5%;bottom:-1%;animation:mq-grenat-shards-a 18s ease-in-out infinite alternate; }
.mq-shell[data-skin="grenat"] .mq-grenat-shards-b { width:clamp(155px,34vw,360px);aspect-ratio:340/220;right:-7%;bottom:4%;transform:scaleX(-1);animation:mq-grenat-shards-b 22s ease-in-out infinite alternate; }
@keyframes mq-grenat-dust { to { transform:translate3d(0,-35px,0); } }
@keyframes mq-grenat-rays { to { transform:skewX(4deg) scaleX(1.08);opacity:.72; } }
@keyframes mq-grenat-orb { to { transform:translate3d(-7vmax,-4vmax,0) scale(1.1); } }
@keyframes mq-grenat-orb-b { to { transform:translate3d(6vmax,-3vmax,0) scale(1.08); } }
@keyframes mq-grenat-shards-a { to { transform:translate3d(1.5vmax,-1vmax,0);opacity:.21; } }
@keyframes mq-grenat-shards-b { to { transform:translate3d(-1.5vmax,-.7vmax,0) scaleX(-1);opacity:.20; } }

/* Bandeau et navigation */
.mq-shell[data-skin="grenat"] .mq-top,
.mq-shell[data-skin="grenat"] .mq-nav {
  background:linear-gradient(160deg,rgba(255,250,246,.98),rgba(247,234,228,.97));
  border:1px solid rgba(225,187,151,.75);
  box-shadow:inset 0 1px 0 #fff,0 12px 30px rgba(36,7,14,.18);
}
.mq-shell[data-skin="grenat"] .mq-top { color:var(--mq-grenat-ink); }
.mq-shell[data-skin="grenat"] .mq-avatar { background:linear-gradient(145deg,#fff7f0,#ead3c7);border-color:#fff7ef;box-shadow:0 0 0 2px rgba(216,169,124,.58),0 6px 16px rgba(79,16,29,.16); }
.mq-shell[data-skin="grenat"] .mq-avatar b { background:linear-gradient(145deg,#b13b58,#7b1f35);border-color:#fff7ef; }
.mq-shell[data-skin="grenat"] .mq-xp { background:#eaded8; }
.mq-shell[data-skin="grenat"] .mq-xp i { background:linear-gradient(90deg,#8d263f,#c55c70); }
.mq-shell[data-skin="grenat"] .mq-chip,
.mq-shell[data-skin="grenat"] .mq-icon-btn { background:rgba(255,250,246,.72);color:var(--mq-grenat-wine); }
.mq-shell[data-skin="grenat"] .mq-chip .mq-plus { background:linear-gradient(145deg,#b33a57,#7b1f35); }
.mq-shell[data-skin="grenat"] .mq-icon-btn:active,
.mq-shell[data-skin="grenat"] .mq-chip:active { background:#f3ded8; }
.mq-shell[data-skin="grenat"] .mq-nav button { color:#a27e79; }
.mq-shell[data-skin="grenat"] .mq-nav button.is-on { color:#8d263f;background:linear-gradient(180deg,#f9e9e6,#f3dcd8); }
.mq-shell[data-skin="grenat"] .mq-nav button.is-on::after { background:#a82f4d; }

/* En-têtes sur le fond sombre */
.mq-shell[data-skin="grenat"] .mq-view[data-view="boutique"] > div:first-child .mq-title,
.mq-shell[data-skin="grenat"] .mq-view[data-view="boutique"] > div:first-child .mq-lede,
.mq-shell[data-skin="grenat"] .mq-settings-head .mq-title,
.mq-shell[data-skin="grenat"] .mq-online-head .mq-title,
.mq-shell[data-skin="grenat"] .mq-setup-copy .mq-title,
.mq-shell[data-skin="grenat"] .mq-histoire-titre,
.mq-shell[data-skin="grenat"] .mq-profile-heading h1 { color:#fff5ee;text-shadow:0 2px 12px rgba(26,4,10,.30); }
.mq-shell[data-skin="grenat"] .mq-view[data-view="boutique"] > div:first-child .mq-lede,
.mq-shell[data-skin="grenat"] .mq-online-head .mq-eyebrow,
.mq-shell[data-skin="grenat"] .mq-settings-head .mq-eyebrow,
.mq-shell[data-skin="grenat"] .mq-setup-copy .mq-eyebrow { color:#e8b5aa; }
.mq-shell[data-skin="grenat"] .mq-degrade-texte { background:linear-gradient(100deg,#fff6ef,#f3d1c8 55%,#e4ac9d);-webkit-background-clip:text;background-clip:text;color:transparent; }

/* Accueil apaisé */
.mq-shell[data-skin="grenat"] .mq-wordmark span { color:#d8a27f; }
.mq-shell[data-skin="grenat"] .mq-wordmark b { color:#fff3ea; }

.mq-shell[data-skin="grenat"] .mq-demo-card { border-color:#f4d1bd;background:linear-gradient(155deg,#8f2a45,#571a2a);box-shadow:0 9px 24px rgba(32,5,11,.25); }
.mq-shell[data-skin="grenat"] .mq-demo-seal { background:linear-gradient(145deg,#c36b73,#7f263b);border-color:#fff3e9;box-shadow:0 5px 16px rgba(57,10,19,.28); }

.mq-shell[data-skin="grenat"] .mq-btn-primary,
.mq-shell[data-skin="grenat"] .mq-play {
  color:#fff8f2;background-color:#8d263f;background-image:linear-gradient(112deg,#b33b59,#8d263f 56%,#671a2d);
  border:1px solid rgba(232,184,143,.72);box-shadow:0 4px 0 #5d1728,0 10px 24px rgba(46,8,16,.30);text-shadow:0 1px 2px rgba(36,5,11,.28);
}
.mq-shell[data-skin="grenat"] .mq-btn-primary:active { box-shadow:0 1px 0 #5d1728; }
.mq-shell[data-skin="grenat"] .mq-btn-ghost,
.mq-shell[data-skin="grenat"] .mq-foot .mq-btn { background:rgba(255,249,245,.94);color:#672033;border:1px solid rgba(226,190,161,.72); }

/* Boutique, code promo et réglages */
.mq-shell[data-skin="grenat"] .mq-view[data-view="boutique"] .mq-scroll,
.mq-shell[data-skin="grenat"] .mq-settings-scroll { scrollbar-color:rgba(220,174,143,.55) transparent; }
.mq-shell[data-skin="grenat"] .mq-opt.is-on,
.mq-shell[data-skin="grenat"] .mq-theme-option.is-active { border-color:#b23a56;box-shadow:0 0 0 3px rgba(177,55,82,.14),0 10px 26px rgba(61,12,22,.16); }
.mq-shell[data-skin="grenat"] .mq-skin-grenat {
  --a:#7d2438 !important;--b:#3d151f !important;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,217,196,.28),transparent 28%),
    linear-gradient(145deg,#8c2c45,#561c2c 58%,#2f1118) !important;
}
.mq-shell[data-skin="grenat"] .mq-skin-grenat::after { content:"◇";color:#e8bd90;text-shadow:0 2px 6px rgba(47,7,14,.32); }
.mq-shell[data-skin="grenat"] .mq-promo-card,
.mq-shell[data-skin="grenat"] .mq-theme-panel,
.mq-shell[data-skin="grenat"] .mq-settings-row,
.mq-shell[data-skin="grenat"] .mq-reset-row {
  background:linear-gradient(155deg,rgba(255,250,246,.99),rgba(247,235,229,.98));
  border:1px solid rgba(225,190,160,.72);box-shadow:0 9px 24px rgba(48,9,17,.13);
}
.mq-shell[data-skin="grenat"] .mq-promo-icon,
.mq-shell[data-skin="grenat"] .mq-settings-icon { background:linear-gradient(145deg,#f7e7e2,#ead2cc);color:#982d48; }
.mq-shell[data-skin="grenat"] .mq-promo-entry,
.mq-shell[data-skin="grenat"] .mq-input,
.mq-shell[data-skin="grenat"] .mq-premium-field { background:#fffaf7;border-color:#dfc3b4;color:#4a1720; }
.mq-shell[data-skin="grenat"] .mq-range { --range-color:#a62f4c; }
.mq-shell[data-skin="grenat"] .mq-switch { background:#e3d4cf; }
.mq-shell[data-skin="grenat"] .mq-view[data-view="reglages"] .mq-settings-row[aria-pressed="true"] .mq-switch { background:linear-gradient(105deg,#bd5268,#8d263f); }
.mq-shell[data-skin="grenat"] .mq-settings-back { background:linear-gradient(155deg,#fff9f5,#f2e2dc);border:1px solid rgba(226,190,161,.72);color:#5b1a2a; }

/* Profil */
.mq-shell[data-skin="grenat"] .mq-profile-heading button { background:rgba(255,248,243,.92);color:#6d2032;border:1px solid rgba(225,188,156,.72); }
.mq-shell[data-skin="grenat"] .mq-profile-identity,
.mq-shell[data-skin="grenat"] .mq-profile-metric,
.mq-shell[data-skin="grenat"] .mq-profile-panel,
.mq-shell[data-skin="grenat"] .mq-avatar-picker {
  background:linear-gradient(155deg,rgba(255,250,246,.99),rgba(247,235,229,.98));
  border:1px solid rgba(225,190,160,.72);box-shadow:0 10px 28px rgba(45,8,15,.14);
}
.mq-shell[data-skin="grenat"] .mq-profile-actions {
  background:transparent;
  border:0;
  box-shadow:none;
}
.mq-shell[data-skin="grenat"] .mq-profile-avatar-large { box-shadow:0 0 0 3px #f6ddcd,0 0 0 5px #b23a56,0 11px 26px rgba(50,9,17,.20); }
.mq-shell[data-skin="grenat"] .mq-profile-meter,
.mq-shell[data-skin="grenat"] .mq-profile-xp { background:#eadbd5; }
.mq-shell[data-skin="grenat"] .mq-profile-meter i,
.mq-shell[data-skin="grenat"] .mq-profile-xp i { background:linear-gradient(90deg,#8d263f,#c35c70); }
.mq-shell[data-skin="grenat"] .mq-profile-edit { background:linear-gradient(110deg,#a5324e,#7a2035);color:#fff7f1;border-color:#dfae7b; }
.mq-shell[data-skin="grenat"] .mq-avatar-option.is-selected { border-color:#b23a56;box-shadow:0 0 0 3px rgba(178,58,86,.16),0 10px 24px rgba(61,12,22,.16); }

/* Multijoueur */
.mq-shell[data-skin="grenat"] .mq-online-head .mq-setup-back { background:rgba(255,248,243,.92);color:#6f2033;border:1px solid rgba(225,188,156,.7); }

.mq-shell[data-skin="grenat"] .mq-online-hero-icon,
.mq-shell[data-skin="grenat"] .mq-competitive-card > span:first-child { background:linear-gradient(145deg,#a93853,#721d32);color:#fff8f0;border-color:#e1b27f; }

/* Plateau et cartes */
.mq-shell[data-skin="grenat"] .mq-board-wrap { isolation:isolate;border-radius:clamp(14px,2.5vmin,24px); }
.mq-shell[data-skin="grenat"] .mq-board-wrap::before {
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:radial-gradient(ellipse at 50% 45%,rgba(129,44,58,.22),rgba(35,8,14,.08) 70%,transparent 100%);
}
.mq-shell[data-skin="grenat"] .mq-score-chip,
.mq-shell[data-skin="grenat"] .mq-game-action {
  background:linear-gradient(155deg,rgba(255,250,246,.96),rgba(244,230,224,.95)) !important;
  border-color:rgba(224,188,155,.72);box-shadow:0 4px 14px rgba(40,7,14,.18);
}
.mq-shell[data-skin="grenat"] .mq-score-chip small,
.mq-shell[data-skin="grenat"] .mq-score-chip strong,
.mq-shell[data-skin="grenat"] .mq-game-action svg { color:#551927; }
.mq-shell[data-skin="grenat"] .mq-score-chip.is-turn { border-color:#c79654;background:linear-gradient(155deg,#fffaf5,#f5e6dd)!important;box-shadow:0 0 0 2px rgba(199,150,84,.16),0 6px 18px rgba(55,10,20,.18); }
.mq-shell[data-skin="grenat"] .mq-turn-dot { background:#b23b57;box-shadow:0 0 0 3px rgba(178,59,87,.14),0 0 8px rgba(178,59,87,.65); }
.mq-shell[data-skin="grenat"] .mq-card { border-radius:clamp(9px,2vmin,18px); }
.mq-shell[data-skin="grenat"] .mq-face { border-color:#e8c49e; }
.mq-shell[data-skin="grenat"] .mq-back {
  background:
    radial-gradient(circle at 26% 16%,rgba(255,244,232,.24),transparent 24%),
    radial-gradient(circle at 74% 82%,rgba(255,205,168,.09),transparent 28%),
    linear-gradient(152deg,#a63a55 0%,#812b43 42%,#5c1d31 76%,#471625 100%);
  box-shadow:inset 0 0 0 1px rgba(255,245,232,.18),inset 0 -10px 18px rgba(35,7,15,.18),0 6px 14px rgba(30,6,13,.22);
}
.mq-shell[data-skin="grenat"] .mq-back::before {
  inset:0;background:no-repeat center/48% auto url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23e8bd8e' stroke-width='2.2' stroke-linejoin='round'%3E%3Cpath d='M32 8 50 25 32 56 14 25Z'/%3E%3Cpath d='m14 25 18 8 18-8M32 8v25M22 17l10 16 10-16M32 33v23'/%3E%3C/g%3E%3C/svg%3E");
  filter:drop-shadow(0 3px 5px rgba(30,5,12,.26));opacity:.98;
}
.mq-shell[data-skin="grenat"] .mq-back::after {
  content:"";position:absolute;inset:2px;border-radius:inherit;pointer-events:none;opacity:.38;
  background:linear-gradient(112deg,transparent 0 36%,rgba(255,244,231,.42) 48%,transparent 60% 100%);transform:translateX(-120%);
}
.mq-shell[data-skin="grenat"] .mq-card.is-open .mq-back::after { animation:mq-grenat-card-shimmer .72s ease-out; }
.mq-shell[data-skin="grenat"] .mq-front {
  background:linear-gradient(165deg,#fffaf6 0%,#f3e5df 100%);box-shadow:0 4px 10px rgba(42,7,15,.20);color:#4a1720;
}
.mq-shell[data-skin="grenat"] .mq-board[data-category="animaux"] .mq-front { background:#3b151e; }
.mq-shell[data-skin="grenat"] .mq-front .mq-card-name { color:#fff9f4; text-shadow:0 1px 2px rgba(0,0,0,.92),0 0 4px rgba(0,0,0,.52); }
.mq-shell[data-skin="grenat"] .mq-view[data-view="histoire"] .mq-degrade-texte { background:none; -webkit-background-clip:border-box; background-clip:border-box; color:#fff4ed; text-shadow:0 2px 12px rgba(18,2,7,.32); }
.mq-shell[data-skin="grenat"] .mq-view[data-view="histoire"] .mq-histoire-titre .mq-title,
.mq-shell[data-skin="grenat"] .mq-view[data-view="histoire"] .mq-histoire-titre .mq-eyebrow,
.mq-shell[data-skin="grenat"] .mq-view[data-view="histoire"] .mq-jalon-txt strong { color:#fff6f0; text-shadow:0 2px 10px rgba(18,2,7,.26); }
.mq-shell[data-skin="grenat"] .mq-view[data-view="histoire"] .mq-jalon.is-locked .mq-jalon-txt strong { color:rgba(255,246,240,.72); }
.mq-shell[data-skin="grenat"] .mq-card.is-done .mq-front { background:linear-gradient(165deg,#fff8f0,#f4e4d8); }
.mq-shell[data-skin="grenat"] .mq-card.is-done .mq-face { border-color:#dfb36f;box-shadow:0 0 0 2px rgba(219,167,99,.15),0 0 20px rgba(221,157,106,.32); }
.mq-shell[data-skin="grenat"] .mq-card.is-done .mq-front::before {
  content:"";position:absolute;inset:-15%;border-radius:50%;pointer-events:none;
  border:2px solid rgba(224,174,111,.55);animation:mq-grenat-match-ring .85s ease-out both;
}
.mq-shell[data-skin="grenat"] .mq-card.is-wrong .mq-face { border-color:#d8787d;box-shadow:0 0 0 2px rgba(201,80,91,.13),0 4px 12px rgba(42,7,15,.22); }
.mq-shell[data-skin="grenat"] .mq-card.is-hint .mq-back { animation:mq-grenat-hint .72s ease-in-out 3; }
.mq-card-preview-layer[data-skin="grenat"] .mq-card-preview-surface { border-color:#e7c39d;background:linear-gradient(152deg,#a63a55 0%,#812b43 42%,#5c1d31 76%,#471625 100%);box-shadow:0 18px 40px rgba(36,5,12,.32),0 0 0 3px rgba(207,143,103,.18); }
@keyframes mq-grenat-card-shimmer { from { transform:translateX(-120%); } to { transform:translateX(120%); } }
@keyframes mq-grenat-match-ring { 0% { opacity:0;transform:scale(.75); } 30% { opacity:.8; } 100% { opacity:0;transform:scale(1.2); } }
@keyframes mq-grenat-hint { 50% { filter:brightness(1.25) saturate(1.08);box-shadow:0 0 0 3px rgba(226,175,113,.28),0 0 18px rgba(226,175,113,.40); } }

/* Résultats */
.mq-shell[data-skin="grenat"] .mq-final-result-page,
.mq-shell[data-skin="grenat"] .mq-solo-result-page { background:linear-gradient(180deg,rgba(72,23,34,.88),rgba(38,10,17,.94)); }

.mq-shell[data-skin="grenat"] .mq-final-replay,
.mq-shell[data-skin="grenat"] .mq-final-home { border-color:rgba(226,190,158,.75); }
.mq-shell[data-skin="grenat"] .mq-solo-score-card {
  background:
    radial-gradient(circle at 18% 10%,rgba(255,243,234,.72),transparent 28%),
    linear-gradient(160deg,#fffaf6 0%,#f7ece6 54%,#f2e1da 100%);
  color:#521824;
  box-shadow:0 20px 42px rgba(43,8,17,.22),inset 0 0 0 2px rgba(225,190,156,.20),inset 0 1px 0 rgba(255,255,255,.72);
}
.mq-shell[data-skin="grenat"] .mq-solo-score-card::after { color:rgba(151,59,83,.08); }
.mq-shell[data-skin="grenat"] .mq-solo-score-copy small { color:#8f3450; text-shadow:none; }
.mq-shell[data-skin="grenat"] .mq-solo-score-copy strong {
  color:#5a1a2a;
  text-shadow:0 8px 18px rgba(119,37,59,.12);
}
.mq-shell[data-skin="grenat"] .mq-solo-score-copy span { color:#9c6b45; text-shadow:none; }
.mq-shell[data-skin="grenat"] .mq-solo-rating {
  background:linear-gradient(150deg,#fffdfa,#fbf1eb);
  border-color:rgba(230,196,165,.85);
  box-shadow:0 14px 28px rgba(47,9,18,.10),inset 0 1px 0 #fff;
}
.mq-shell[data-skin="grenat"] .mq-solo-rating > strong,
.mq-shell[data-skin="grenat"] .mq-stars-value { color:#6f2033; }

/* Réduction de mouvement : aucune animation décorative continue. */
.mq-shell[data-skin="grenat"][data-motion="calme"] .mq-ambiance::before,
.mq-shell[data-skin="grenat"][data-motion="calme"] .mq-ambiance i,
.mq-shell[data-skin="grenat"][data-motion="calme"] .mq-grenat-shards,
.mq-shell[data-skin="grenat"][data-motion="calme"] .mq-card.is-open .mq-back::after,
.mq-shell[data-skin="grenat"][data-motion="calme"] .mq-card.is-done .mq-front::before { animation:none; }
@media (prefers-reduced-motion:reduce) {
  .mq-shell[data-skin="grenat"] .mq-ambiance::before,
  .mq-shell[data-skin="grenat"] .mq-ambiance i,
  .mq-shell[data-skin="grenat"] .mq-grenat-shards,
  .mq-shell[data-skin="grenat"] .mq-card.is-open .mq-back::after,
  .mq-shell[data-skin="grenat"] .mq-card.is-done .mq-front::before { animation:none; }
}

/* Mise en place Grenat : sélection cohérente sans héritage turquoise. */
.mq-shell[data-skin="grenat"] .mq-view[data-view="miseEnPlace"] .mq-setup-steps i {
  background:rgba(119,41,57,.16);
  box-shadow:inset 0 1px 2px rgba(69,16,27,.10);
}
.mq-shell[data-skin="grenat"] .mq-view[data-view="miseEnPlace"] .mq-setup-steps i.is-on {
  background:linear-gradient(100deg,#b84c64,#81243a);
  box-shadow:0 2px 8px rgba(129,36,58,.24);
}
.mq-shell[data-skin="grenat"] .mq-view[data-view="miseEnPlace"] .mq-carreau[aria-checked="true"] {
  background:linear-gradient(145deg,#fffaf7 0%,#f3e3dd 100%);
  border-color:#aa3550;
  box-shadow:inset 0 2px 2px #fff,0 0 0 2px rgba(170,53,80,.18),0 12px 27px rgba(83,18,34,.18);
}
.mq-shell[data-skin="grenat"] .mq-view[data-view="miseEnPlace"] .mq-carreau[aria-checked="true"]::after {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E"),
    radial-gradient(circle at 34% 24%,#d97d90 0%,#aa3550 48%,#711e32 100%);
  border-color:#fff8f1;
  box-shadow:0 6px 14px rgba(83,18,34,.24),0 0 0 3px rgba(170,53,80,.13);
}

.mq-shell[data-skin="grenat"] .mq-view[data-view="miseEnPlace"] .mq-mini-grille {
  background:linear-gradient(145deg,#fffaf7,#f0dfd8);
  box-shadow:inset 0 2px 2px #fff,0 5px 12px rgba(74,16,28,.10);
}
.mq-shell[data-skin="grenat"] .mq-view[data-view="miseEnPlace"] .mq-mini-grille i {
  background:linear-gradient(145deg,#c75d72,#8b273f);
  box-shadow:inset 0 1px 0 rgba(255,242,233,.55);
}

/* =========================================================================
   THÈME ARDOISE 6.26.0 — minéral, premium, animé et strictement isolé
   Tous les sélecteurs restent limités à data-skin="ardoise".
   ========================================================================= */
.mq-shell[data-skin="ardoise"] {
  --ciel-1:#111b23; --ciel-2:#182630; --ciel-3:#1d2a34; --ciel-4:#111a21; --sable:#0b1218;
  --blanc:#1d2a34; --encre:#f4f8fb; --encre-2:#b7c4cf; --encre-3:#748795;
  --turq:#58dfe9; --turq-2:#29b8c8; --bleu:#4fb6db; --bleu-2:#2488ac;
  --degrade:linear-gradient(110deg,#6debf1 0%,#45cddd 48%,#2a91b5 100%);
  --past-menthe:#1a2a31; --past-bleu:#1b2935; --past-lilas:#222a38;
  --past-creme:#242b31; --past-rose:#27252d; --past-ciel:#172832;
  --ombre:0 2px 4px rgba(0,0,0,.12),0 8px 20px rgba(0,0,0,.28);
  --ombre-forte:0 5px 12px rgba(0,0,0,.18),0 18px 42px rgba(0,0,0,.42);
  --mq-slate-deep:#0b1319; --mq-slate:#17232c; --mq-slate-2:#22313b;
  --mq-slate-panel:rgba(28,42,52,.94); --mq-slate-panel-2:rgba(18,29,37,.96);
  --mq-slate-line:rgba(176,201,216,.34); --mq-slate-silver:#d7e1e8;
  --mq-slate-cyan:#61e4ee; --mq-slate-cyan-deep:#2695b2;
  background:
    radial-gradient(ellipse at 48% -10%,rgba(119,178,199,.18) 0%,rgba(41,76,92,.08) 34%,transparent 63%),
    radial-gradient(ellipse at 50% 56%,rgba(57,97,112,.12) 0%,transparent 62%),
    linear-gradient(180deg,#101a22 0%,#17242d 32%,#111c24 69%,#091117 100%);
}

.mq-shell[data-skin="ardoise"] .mq-ambiance {
  contain:strict;
  background:
    linear-gradient(180deg,rgba(255,255,255,.015),rgba(0,0,0,.18)),
    radial-gradient(circle at 50% 18%,rgba(103,210,224,.05),transparent 34%);
}
.mq-shell[data-skin="ardoise"] .mq-ambiance::before {
  content:"";position:absolute;inset:-10%;pointer-events:none;opacity:.32;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 1400'%3E%3Cg fill='none' stroke='%239db2bf' stroke-width='1.15' opacity='.46'%3E%3Cpath d='M84 0l44 128-28 109 93 94-48 126 92 113-42 150 109 119-65 147 89 122-40 212'/%3E%3Cpath d='M806 0l-52 136 31 112-103 86 57 128-84 109 35 149-105 123 61 143-88 126 42 288'/%3E%3Cpath d='M334 0l21 156-47 123 61 128-32 145 57 126-30 165 58 140-39 166 37 251'/%3E%3Cpath d='M565 0l-18 180 42 111-57 130 31 143-51 136 29 156-51 143 37 159-32 242'/%3E%3Cpath d='M0 374l163 38 115-54 122 66 127-40 136 58 126-35 111 45'/%3E%3Cpath d='M0 980l172-42 113 56 126-62 120 44 134-53 117 47 118-38'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(circle at 16% 18%,rgba(124,227,237,.35) 0 1px,transparent 2px),
    radial-gradient(circle at 79% 28%,rgba(124,227,237,.25) 0 1px,transparent 2px),
    radial-gradient(circle at 64% 72%,rgba(124,227,237,.20) 0 1px,transparent 2px);
  background-size:100% 100%,220px 210px,260px 240px,310px 290px;
  animation:mq-ardoise-drift 28s linear infinite;
  will-change:transform;
}
.mq-shell[data-skin="ardoise"] .mq-ambiance::after {
  content:"";position:absolute;inset:auto 0 0;height:28%;pointer-events:none;opacity:.35;
  background:
    linear-gradient(180deg,transparent,rgba(1,8,12,.54)),
    radial-gradient(ellipse at 18% 100%,rgba(75,140,156,.15),transparent 36%),
    radial-gradient(ellipse at 82% 100%,rgba(75,140,156,.13),transparent 38%);
}
.mq-shell[data-skin="ardoise"] .mq-ambiance i { border-radius:0; }
.mq-shell[data-skin="ardoise"] .mq-ambiance i:nth-child(1) {
  width:76%;height:40%;left:12%;top:-5%;
  background:linear-gradient(105deg,transparent 15%,rgba(150,230,238,.10) 37%,transparent 56%),linear-gradient(75deg,transparent 28%,rgba(118,198,213,.08) 47%,transparent 64%);
  filter:blur(7px);transform-origin:50% 0;animation:mq-ardoise-rays 18s ease-in-out infinite alternate;
}
.mq-shell[data-skin="ardoise"] .mq-ambiance i:nth-child(2) {
  width:56vmax;height:56vmax;right:-24vmax;top:18vmax;
  background:radial-gradient(circle,rgba(62,145,166,.11),transparent 65%);
  animation:mq-ardoise-orb-a 32s ease-in-out infinite alternate;
}
.mq-shell[data-skin="ardoise"] .mq-ambiance i:nth-child(3) {
  width:52vmax;height:40vmax;left:-20vmax;bottom:-10vmax;
  background:radial-gradient(ellipse,rgba(64,125,142,.10),transparent 66%);
  animation:mq-ardoise-orb-b 38s ease-in-out infinite alternate;
}
@keyframes mq-ardoise-drift { to { transform:translate3d(0,-26px,0); } }
@keyframes mq-ardoise-rays { to { transform:skewX(3deg) scaleX(1.06);opacity:.72; } }
@keyframes mq-ardoise-orb-a { to { transform:translate3d(-6vmax,-4vmax,0) scale(1.08); } }
@keyframes mq-ardoise-orb-b { to { transform:translate3d(5vmax,-3vmax,0) scale(1.06); } }

/* Bandeau supérieur et navigation */
.mq-shell[data-skin="ardoise"] .mq-top,
.mq-shell[data-skin="ardoise"] .mq-nav {
  background:linear-gradient(155deg,rgba(38,54,65,.97),rgba(21,33,42,.98));
  border:1px solid rgba(176,201,216,.30);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 12px 30px rgba(0,0,0,.35);
  color:#f3f8fb;
}
.mq-shell[data-skin="ardoise"] .mq-avatar { background:linear-gradient(145deg,#2a3a45,#111b22);border-color:#b9ccd7;box-shadow:0 0 0 2px rgba(91,219,229,.28),0 6px 16px rgba(0,0,0,.30); }
.mq-shell[data-skin="ardoise"] .mq-avatar b { background:linear-gradient(145deg,#496373,#263845);border-color:#d5e2e8; }
.mq-shell[data-skin="ardoise"] .mq-xp { background:#34444f; }
.mq-shell[data-skin="ardoise"] .mq-xp i { background:linear-gradient(90deg,#65e8ef,#2ea7bd); }
.mq-shell[data-skin="ardoise"] .mq-chip,
.mq-shell[data-skin="ardoise"] .mq-icon-btn { background:rgba(255,255,255,.055);color:#f6fafc;border:1px solid rgba(195,216,227,.20); }
.mq-shell[data-skin="ardoise"] .mq-chip .mq-plus { background:linear-gradient(145deg,#42c9d6,#247f9e);color:#071219; }
.mq-shell[data-skin="ardoise"] .mq-icon-btn:active,
.mq-shell[data-skin="ardoise"] .mq-chip:active { background:rgba(95,218,230,.13); }
.mq-shell[data-skin="ardoise"] .mq-nav button { color:#899ba8; }
.mq-shell[data-skin="ardoise"] .mq-nav button.is-on { color:#63e1eb;background:linear-gradient(180deg,rgba(82,201,213,.13),rgba(47,119,138,.08)); }
.mq-shell[data-skin="ardoise"] .mq-nav button.is-on::after { background:#58dfe9;box-shadow:0 0 12px rgba(88,223,233,.60); }

/* En-têtes et identité */
.mq-shell[data-skin="ardoise"] .mq-title,
.mq-shell[data-skin="ardoise"] .mq-histoire-titre,
.mq-shell[data-skin="ardoise"] .mq-profile-heading h1 { color:#f6f9fb;text-shadow:0 2px 12px rgba(0,0,0,.35); }
.mq-shell[data-skin="ardoise"] .mq-eyebrow { color:#67dce7; }

.mq-shell[data-skin="ardoise"] .mq-degrade-texte { background:linear-gradient(100deg,#f7fbfd 0%,#bcebf0 55%,#67dce7 100%);-webkit-background-clip:text;background-clip:text;color:transparent; }
.mq-shell[data-skin="ardoise"] .mq-wordmark span { color:#62d8e3; }
.mq-shell[data-skin="ardoise"] .mq-wordmark b { color:#f4f8fa; }
.mq-shell[data-skin="ardoise"] .mq-demo-card { border-color:#a8c0cc;background:linear-gradient(155deg,#2d3d47,#111b22);box-shadow:0 9px 24px rgba(0,0,0,.35); }
.mq-shell[data-skin="ardoise"] .mq-demo-seal { background:linear-gradient(145deg,#58d8e3,#267f99);border-color:#d8f4f6;color:#081319;box-shadow:0 5px 16px rgba(0,0,0,.35); }

.mq-shell[data-skin="ardoise"] .mq-btn-primary,
.mq-shell[data-skin="ardoise"] .mq-play {
  background:linear-gradient(110deg,#65e8ef 0%,#42cbd8 48%,#2c96b3 100%);
  color:#07151c;box-shadow:0 4px 0 #1b708b,0 10px 22px rgba(34,160,181,.34);
}
.mq-shell[data-skin="ardoise"] .mq-btn-ghost,
.mq-shell[data-skin="ardoise"] .mq-foot .mq-btn,
.mq-shell[data-skin="ardoise"] .mq-settings-back,
.mq-shell[data-skin="ardoise"] .mq-profile-heading button,
.mq-shell[data-skin="ardoise"] .mq-online-head .mq-setup-back {
  background:linear-gradient(155deg,rgba(37,53,64,.96),rgba(21,32,41,.98));
  color:#eaf1f5;border:1px solid rgba(180,202,214,.30);
}
.mq-shell[data-skin="ardoise"] .mq-opt.is-on,
.mq-shell[data-skin="ardoise"] .mq-theme-option.is-active,
.mq-shell[data-skin="ardoise"] .mq-carreau[aria-checked="true"] {
  border-color:#6ce5ee;box-shadow:0 0 0 3px rgba(88,223,233,.16),0 0 24px rgba(88,223,233,.22),0 10px 26px rgba(0,0,0,.32);
}
.mq-shell[data-skin="ardoise"] .mq-view[data-view="miseEnPlace"] .mq-carreau[aria-checked="true"] {
  background:linear-gradient(145deg,#ffffff 0%,#eef6f8 100%);
  color:#0d1820;
  border-color:#72e4ec;
  box-shadow:0 0 0 3px rgba(88,223,233,.18),0 0 24px rgba(88,223,233,.22),0 12px 28px rgba(0,0,0,.30);
}

.mq-shell[data-skin="ardoise"] .mq-view[data-view="miseEnPlace"] .mq-setup-steps i { background:rgba(129,157,172,.16); }
.mq-shell[data-skin="ardoise"] .mq-view[data-view="miseEnPlace"] .mq-setup-steps i.is-on { background:linear-gradient(90deg,#65e8ef,#2b98b4);box-shadow:0 2px 9px rgba(77,214,226,.32); }
.mq-shell[data-skin="ardoise"] .mq-skin-ardoise { background:linear-gradient(152deg,#344550 0%,#202f38 50%,#111a20 100%);border-color:#b9ccd6; }
.mq-shell[data-skin="ardoise"] .mq-skin-ardoise::before { background:no-repeat center/52% auto url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%236ce5ee' stroke-width='2.1'%3E%3Cpath d='M32 8 49 32 32 56 15 32Z'/%3E%3Cpath d='M15 32h34M32 8v48M21 22l11 10 11-10M21 42l11-10 11 10'/%3E%3C/g%3E%3C/svg%3E"); }

/* En-têtes Ardoise : le contenu garde sa hauteur naturelle et ne chevauche jamais la liste. */
.mq-shell[data-skin="ardoise"] .mq-view[data-view="boutique"] {
  gap:clamp(10px,1.25vh,14px);
}
.mq-shell[data-skin="ardoise"] .mq-view[data-view="boutique"] > div:first-child {
  flex:0 0 auto;
  min-height:max-content;
  overflow:visible;
  padding:2px 4px 4px;
}
.mq-shell[data-skin="ardoise"] .mq-view[data-view="boutique"] > div:first-child .mq-title {
  line-height:1.04;
}
.mq-shell[data-skin="ardoise"] .mq-view[data-view="boutique"] > div:first-child .mq-lede {
  margin-top:6px;
  color:#c2ced6;
  line-height:1.35;
  overflow:visible;
}
.mq-shell[data-skin="ardoise"] .mq-view[data-view="boutique"] .mq-scroll {
  padding-top:2px;
}
.mq-shell[data-skin="ardoise"] .mq-settings-head {
  flex:0 0 auto;
  min-height:max-content;
  overflow:visible;
  padding-bottom:4px;
}
.mq-shell[data-skin="ardoise"] .mq-settings-head .mq-title {
  line-height:1.04;
}

/* Champs, curseurs et interrupteurs */
.mq-shell[data-skin="ardoise"] .mq-promo-entry,
.mq-shell[data-skin="ardoise"] .mq-input,
.mq-shell[data-skin="ardoise"] .mq-premium-field {
  background:#111b22;border-color:#445966;color:#f5f8fa;box-shadow:inset 0 1px 4px rgba(0,0,0,.34);
}
.mq-shell[data-skin="ardoise"] .mq-range { --range-color:#5bdce7; }
.mq-shell[data-skin="ardoise"] .mq-switch { background:#3c4d58; }
.mq-shell[data-skin="ardoise"] .mq-view[data-view="reglages"] .mq-settings-row[aria-pressed="true"] .mq-switch { background:linear-gradient(105deg,#69e7ee,#2d94b1); }
.mq-shell[data-skin="ardoise"] .mq-reset-button { color:#ff9aa3;border-color:rgba(255,125,137,.55); }
.mq-shell[data-skin="ardoise"] .mq-profile-meter,
.mq-shell[data-skin="ardoise"] .mq-profile-xp { background:#33444f; }
.mq-shell[data-skin="ardoise"] .mq-profile-meter i,
.mq-shell[data-skin="ardoise"] .mq-profile-xp i { background:linear-gradient(90deg,#67e8ef,#2d9bb5); }
.mq-shell[data-skin="ardoise"] .mq-profile-avatar-large { box-shadow:0 0 0 3px #2a3b46,0 0 0 5px #65dce7,0 11px 26px rgba(0,0,0,.30); }
.mq-shell[data-skin="ardoise"] .mq-profile-edit { background:linear-gradient(110deg,#5ddce6,#2b8ea9);color:#07151b;border-color:#c9e9ed; }
.mq-shell[data-skin="ardoise"] .mq-avatar-option.is-selected { border-color:#63e0e9;box-shadow:0 0 0 3px rgba(88,223,233,.16),0 10px 24px rgba(0,0,0,.28); }

/* Mode Histoire */
.mq-shell[data-skin="ardoise"] .mq-view[data-view="histoire"] .mq-degrade-texte { background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#f6f9fb;text-shadow:0 2px 12px rgba(0,0,0,.35); }
.mq-shell[data-skin="ardoise"] .mq-view[data-view="histoire"] .mq-histoire-titre .mq-title,
.mq-shell[data-skin="ardoise"] .mq-view[data-view="histoire"] .mq-histoire-titre .mq-eyebrow,
.mq-shell[data-skin="ardoise"] .mq-view[data-view="histoire"] .mq-jalon-txt strong { color:#f6f9fb;text-shadow:0 2px 10px rgba(0,0,0,.30); }
.mq-shell[data-skin="ardoise"] .mq-view[data-view="histoire"] .mq-jalon.is-locked .mq-jalon-txt strong { color:rgba(235,243,247,.55); }
.mq-shell[data-skin="ardoise"] .mq-histoire-total { background:linear-gradient(155deg,#263742,#14212a);color:#f1f5f7;border:1px solid rgba(178,201,214,.28); }
.mq-shell[data-skin="ardoise"] .mq-chapter b { background:#344650;color:#dce7ed; }
.mq-shell[data-skin="ardoise"] .mq-chapter small { color:#a8b7c2; }
.mq-shell[data-skin="ardoise"] .mq-chapter[aria-current="true"] { border-color:#65e5ee;box-shadow:0 0 0 3px rgba(88,223,233,.14),0 10px 24px rgba(0,0,0,.28); }
.mq-shell[data-skin="ardoise"] .mq-chapter[aria-current="true"] b { background:linear-gradient(145deg,#64e3eb,#2b95af);color:#07151b; }
.mq-shell[data-skin="ardoise"] .mq-chapter[aria-current="true"] small { color:#67e0e9; }
.mq-shell[data-skin="ardoise"] .mq-jalon-pastille { background:linear-gradient(145deg,#334650,#17242d);border-color:#c5d5de;color:#f3f7f9;box-shadow:0 6px 16px rgba(0,0,0,.30); }
.mq-shell[data-skin="ardoise"] .mq-jalon.is-open .mq-jalon-pastille { background:linear-gradient(145deg,#5fe1ea,#2d96b1);color:#07151b;box-shadow:0 0 0 3px rgba(88,223,233,.16),0 0 22px rgba(88,223,233,.34); }
.mq-shell[data-skin="ardoise"] .mq-jalon.is-done .mq-jalon-pastille { background:linear-gradient(145deg,#74dbb2,#2e9f73); }
.mq-shell[data-skin="ardoise"] .mq-jalon.is-boss .mq-jalon-pastille { background:linear-gradient(145deg,#ffd96c,#c48a22);color:#4a3200; }
.mq-shell[data-skin="ardoise"] .mq-chemin::before { background:repeating-linear-gradient(180deg,rgba(173,198,212,.25) 0 7px,transparent 7px 16px); }
.mq-shell[data-skin="ardoise"] .mq-chemin-trace { background:linear-gradient(180deg,#68e5ed,#2b94af);box-shadow:0 0 12px rgba(88,223,233,.55); }
.mq-shell[data-skin="ardoise"] .mq-tag { background:#18262f;color:#f1f5f7;border:1px solid rgba(176,201,215,.20); }
.mq-shell[data-skin="ardoise"] .mq-tag svg { color:#5fdce6; }

/* Plateau et cartes */
.mq-shell[data-skin="ardoise"] .mq-board-wrap { isolation:isolate;border-radius:clamp(14px,2.5vmin,24px); }
.mq-shell[data-skin="ardoise"] .mq-board-wrap::before {
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:radial-gradient(ellipse at 50% 45%,rgba(58,115,132,.15),rgba(3,10,14,.15) 72%,transparent 100%);
}
.mq-shell[data-skin="ardoise"] .mq-score-chip,
.mq-shell[data-skin="ardoise"] .mq-game-action {
  background:linear-gradient(155deg,rgba(37,52,62,.96),rgba(18,29,37,.98)) !important;
  border-color:rgba(181,203,214,.32);box-shadow:0 4px 14px rgba(0,0,0,.30);
}
.mq-shell[data-skin="ardoise"] .mq-score-chip small,
.mq-shell[data-skin="ardoise"] .mq-score-chip strong,
.mq-shell[data-skin="ardoise"] .mq-game-action svg { color:#f2f6f8; }
.mq-shell[data-skin="ardoise"] .mq-score-chip.is-turn { border-color:#6de4ec;background:linear-gradient(155deg,#2e4551,#172730)!important;box-shadow:0 0 0 2px rgba(88,223,233,.16),0 0 18px rgba(88,223,233,.24); }
.mq-shell[data-skin="ardoise"] .mq-turn-dot { background:#63e0e9;box-shadow:0 0 0 3px rgba(88,223,233,.14),0 0 10px rgba(88,223,233,.75); }
.mq-shell[data-skin="ardoise"] .mq-card { border-radius:clamp(9px,2vmin,18px); }
.mq-shell[data-skin="ardoise"] .mq-face { border-color:#aebfca; }
.mq-shell[data-skin="ardoise"] .mq-back {
  background:
    radial-gradient(circle at 26% 16%,rgba(255,255,255,.10),transparent 24%),
    radial-gradient(circle at 74% 82%,rgba(78,211,224,.06),transparent 28%),
    linear-gradient(152deg,#344650 0%,#23333d 44%,#17232b 76%,#0d151b 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10),inset 0 -10px 18px rgba(0,0,0,.24),0 6px 14px rgba(0,0,0,.30);
}
.mq-shell[data-skin="ardoise"] .mq-back::before {
  inset:0;background:no-repeat center/48% auto url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%236ce5ee' stroke-width='2.1' stroke-linejoin='round'%3E%3Cpath d='M32 8 49 32 32 56 15 32Z'/%3E%3Cpath d='M15 32h34M32 8v48M21 22l11 10 11-10M21 42l11-10 11 10'/%3E%3Ccircle cx='32' cy='32' r='3.3' fill='%236ce5ee'/%3E%3C/g%3E%3C/svg%3E");
  filter:drop-shadow(0 0 7px rgba(88,223,233,.28));opacity:.96;
}
.mq-shell[data-skin="ardoise"] .mq-back::after {
  content:"";position:absolute;inset:2px;border-radius:inherit;pointer-events:none;opacity:.34;
  background:linear-gradient(112deg,transparent 0 36%,rgba(210,245,248,.28) 48%,transparent 60% 100%);transform:translateX(-120%);
}
.mq-shell[data-skin="ardoise"] .mq-card.is-open .mq-back::after { animation:mq-ardoise-card-shimmer .72s ease-out; }
.mq-shell[data-skin="ardoise"] .mq-front { background:linear-gradient(165deg,#243640 0%,#111d24 100%);box-shadow:0 4px 10px rgba(0,0,0,.28);color:#f4f7f9; }
.mq-shell[data-skin="ardoise"] .mq-board[data-category="animaux"] .mq-front { background:#0f1b22; }
.mq-shell[data-skin="ardoise"] .mq-front .mq-card-name { color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.95),0 0 5px rgba(0,0,0,.62); }
.mq-shell[data-skin="ardoise"] .mq-card.is-done .mq-front { background:linear-gradient(165deg,#263e45,#13272e); }
.mq-shell[data-skin="ardoise"] .mq-card.is-done .mq-face { border-color:#6de4ec;box-shadow:0 0 0 2px rgba(88,223,233,.17),0 0 22px rgba(88,223,233,.38); }
.mq-shell[data-skin="ardoise"] .mq-card.is-done .mq-front::before {
  content:"";position:absolute;inset:-15%;border-radius:50%;pointer-events:none;border:2px solid rgba(98,226,235,.65);animation:mq-ardoise-match-ring .85s ease-out both;
}
.mq-shell[data-skin="ardoise"] .mq-card.is-wrong .mq-face { border-color:#ff7f8c;box-shadow:0 0 0 2px rgba(255,92,109,.15),0 4px 12px rgba(0,0,0,.28); }
.mq-shell[data-skin="ardoise"] .mq-card.is-hint .mq-back { animation:mq-ardoise-hint .72s ease-in-out 3; }
.mq-card-preview-layer[data-skin="ardoise"] .mq-card-preview-surface { border-color:#b6c8d2;background:linear-gradient(152deg,#344650 0%,#23333d 44%,#17232b 76%,#0d151b 100%);box-shadow:0 18px 40px rgba(0,0,0,.44),0 0 0 3px rgba(88,223,233,.14); }
@keyframes mq-ardoise-card-shimmer { from { transform:translateX(-120%); } to { transform:translateX(120%); } }
@keyframes mq-ardoise-match-ring { 0% { opacity:0;transform:scale(.75); } 30% { opacity:.82; } 100% { opacity:0;transform:scale(1.2); } }
@keyframes mq-ardoise-hint { 50% { filter:brightness(1.2) saturate(1.08);box-shadow:0 0 0 3px rgba(88,223,233,.26),0 0 20px rgba(88,223,233,.42); } }

/* Résultats */
.mq-shell[data-skin="ardoise"] .mq-final-result-page,
.mq-shell[data-skin="ardoise"] .mq-solo-result-page { background:linear-gradient(180deg,rgba(17,27,35,.94),rgba(6,12,17,.98)); }

.mq-shell[data-skin="ardoise"] .mq-solo-score-card::after { color:rgba(107,226,235,.08); }

.mq-shell[data-skin="ardoise"] .mq-final-replay {
  background:linear-gradient(155deg,#334752 0%,#1d2c35 58%,#121d24 100%)!important;
  color:#f7fafb!important;
  border-color:#8198a5!important;
  box-shadow:0 5px 0 #0b141a,0 14px 28px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.12)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.36);
}
.mq-shell[data-skin="ardoise"] .mq-final-replay:active {
  box-shadow:0 2px 0 #0b141a,0 8px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.mq-shell[data-skin="ardoise"] .mq-final-home {
  background:linear-gradient(155deg,#2a3c47,#15232c)!important;
  color:#f5f8fa!important;
  border-color:#617783!important;
}

/* Mouvement réduit */
.mq-shell[data-skin="ardoise"][data-motion="calme"] .mq-ambiance::before,
.mq-shell[data-skin="ardoise"][data-motion="calme"] .mq-ambiance i,
.mq-shell[data-skin="ardoise"][data-motion="calme"] .mq-card.is-open .mq-back::after,
.mq-shell[data-skin="ardoise"][data-motion="calme"] .mq-card.is-done .mq-front::before { animation:none; }
@media (prefers-reduced-motion:reduce) {
  .mq-shell[data-skin="ardoise"] .mq-ambiance::before,
  .mq-shell[data-skin="ardoise"] .mq-ambiance i,
  .mq-shell[data-skin="ardoise"] .mq-card.is-open .mq-back::after,
  .mq-shell[data-skin="ardoise"] .mq-card.is-done .mq-front::before { animation:none; }
}
.mq-shell[data-skin="ardoise"] .mq-theme-panel .mq-settings-copy strong { color:#f5f8fa; }
.mq-shell[data-skin="ardoise"] .mq-theme-panel .mq-settings-copy small { color:#aebcc7; }
.mq-shell[data-skin="ardoise"] .mq-jalon.is-locked { opacity:.74; }
.mq-shell[data-skin="ardoise"] .mq-view[data-view="histoire"] .mq-jalon.is-locked .mq-jalon-txt strong { color:rgba(242,247,249,.78); }
.mq-shell[data-skin="ardoise"] .mq-view[data-view="histoire"] .mq-jalon.is-locked .mq-jalon-etoiles { opacity:.72; }

/* =========================================================================
   THÈME NUIT 6.26.0 — premium stable, lisible et strictement isolé
   Aucun mouvement de grande couche : animations limitées aux petits décors.
   ========================================================================= */
.mq-shell[data-skin="nuit"] {
  --night-bg-0:#070b14;
  --night-bg-1:#0b1220;
  --night-bg-2:#111b2c;
  --night-panel:#121c2c;
  --night-panel-2:#172338;
  --night-line:#35455f;
  --night-line-soft:#26354c;
  --night-text:#f4f7fb;
  --night-muted:#b7c2d5;
  --night-subtle:#8492aa;
  --night-cyan:#83dcf6;
  --night-indigo:#7587ef;
  --night-gold:#f4c96b;
  --night-selected:#f7f9fc;
  --night-selected-text:#121a28;
  color-scheme:dark;
  color:var(--night-text);
  background:
    radial-gradient(circle at 50% -14%,rgba(118,143,239,.16) 0%,transparent 42%),
    radial-gradient(circle at 92% 16%,rgba(91,207,241,.08) 0%,transparent 26%),
    linear-gradient(180deg,var(--night-bg-0) 0%,var(--night-bg-1) 30%,#0d1626 62%,#080d17 100%);
}

/* ---------- Décor stable ---------- */
.mq-shell[data-skin="nuit"] .mq-ambiance {
  contain:paint;
  background:none;
}
.mq-shell[data-skin="nuit"] .mq-ambiance i {
  animation:none!important;
  transform:none!important;
  will-change:auto;
  filter:none;
  border-radius:50%;
}
.mq-shell[data-skin="nuit"] .mq-ambiance i:nth-child(1) {
  width:44vmax;height:44vmax;right:-18vmax;top:-20vmax;left:auto;
  background:radial-gradient(circle,rgba(126,150,238,.13) 0%,transparent 68%);
}
.mq-shell[data-skin="nuit"] .mq-ambiance i:nth-child(2) {
  width:34vmax;height:34vmax;left:-16vmax;top:28%;right:auto;
  background:radial-gradient(circle,rgba(93,214,242,.07) 0%,transparent 70%);
}
.mq-shell[data-skin="nuit"] .mq-ambiance i:nth-child(3) {
  width:48vmax;height:26vmax;left:25%;bottom:-14vmax;top:auto;
  background:radial-gradient(ellipse,rgba(111,129,225,.09) 0%,transparent 72%);
}
.mq-shell[data-skin="nuit"] .mq-ambiance::before {
  content:"";position:absolute;inset:0;opacity:.78;
  background:
    radial-gradient(circle at 8% 12%,rgba(255,255,255,.92) 0 1px,transparent 1.7px),
    radial-gradient(circle at 19% 20%,rgba(155,224,248,.80) 0 1px,transparent 1.8px),
    radial-gradient(circle at 29% 8%,rgba(255,255,255,.76) 0 1.1px,transparent 1.8px),
    radial-gradient(circle at 43% 16%,rgba(148,213,245,.74) 0 1px,transparent 1.8px),
    radial-gradient(circle at 58% 8%,rgba(255,255,255,.86) 0 1px,transparent 1.7px),
    radial-gradient(circle at 72% 18%,rgba(160,226,250,.75) 0 1.1px,transparent 1.9px),
    radial-gradient(circle at 86% 10%,rgba(255,255,255,.84) 0 1px,transparent 1.7px),
    radial-gradient(circle at 94% 29%,rgba(142,218,246,.72) 0 1px,transparent 1.8px),
    radial-gradient(circle at 14% 42%,rgba(255,255,255,.56) 0 1px,transparent 1.7px),
    radial-gradient(circle at 38% 37%,rgba(144,220,247,.56) 0 1px,transparent 1.7px),
    radial-gradient(circle at 66% 43%,rgba(255,255,255,.58) 0 1px,transparent 1.7px),
    radial-gradient(circle at 82% 51%,rgba(138,214,243,.52) 0 1px,transparent 1.7px);
  animation:mq-night-v2-twinkle 9s ease-in-out infinite alternate;
  will-change:opacity;
}
.mq-shell[data-skin="nuit"] .mq-ambiance::after {
  content:"";position:absolute;inset:auto 0 0;height:32%;opacity:.48;
  background:
    linear-gradient(180deg,transparent 0%,rgba(7,12,22,.28) 44%,rgba(4,7,13,.72) 100%),
    radial-gradient(ellipse at 22% 76%,rgba(109,219,244,.10) 0%,transparent 38%),
    radial-gradient(ellipse at 78% 82%,rgba(120,137,234,.10) 0%,transparent 42%);
  animation:mq-night-v2-breathe 12s ease-in-out infinite alternate;
  will-change:opacity;
}
.mq-shell[data-skin="nuit"] .mq-ambiance > .mq-night-moon,
.mq-shell[data-skin="nuit"] .mq-ambiance > .mq-night-stars,
.mq-shell[data-skin="nuit"] .mq-ambiance > .mq-night-constellations,
.mq-shell[data-skin="nuit"] .mq-ambiance > .mq-night-haze {
  display:block;position:absolute;pointer-events:none;transform:none!important;filter:none;
}
.mq-shell[data-skin="nuit"] .mq-night-moon {
  width:clamp(78px,14vw,132px);aspect-ratio:1;right:6%;top:8%;border-radius:50%;opacity:.78;
  background:radial-gradient(circle at 34% 30%,#fff 0%,#edf6ff 34%,#bdcdef 67%,rgba(120,139,202,.18) 100%);
  box-shadow:0 0 24px rgba(180,224,255,.20),0 0 52px rgba(111,127,224,.12);
  animation:mq-night-v2-moon 11s ease-in-out infinite alternate;
  will-change:opacity,box-shadow;
}
.mq-shell[data-skin="nuit"] .mq-night-stars {
  inset:0;opacity:.20;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 800'%3E%3Cg fill='none' stroke='%239fdfff' stroke-width='1.2' opacity='.55'%3E%3Cpath d='M170 170 240 140 310 180 388 150'/%3E%3Cpath d='M700 120 770 166 842 140 910 190'/%3E%3Cpath d='M860 350 940 320 1020 354 1092 316'/%3E%3C/g%3E%3Cg fill='%23eaf9ff'%3E%3Ccircle cx='170' cy='170' r='2.4'/%3E%3Ccircle cx='240' cy='140' r='2.2'/%3E%3Ccircle cx='310' cy='180' r='2.2'/%3E%3Ccircle cx='388' cy='150' r='2.3'/%3E%3Ccircle cx='700' cy='120' r='2.3'/%3E%3Ccircle cx='770' cy='166' r='2.2'/%3E%3Ccircle cx='842' cy='140' r='2.2'/%3E%3Ccircle cx='910' cy='190' r='2.3'/%3E%3Ccircle cx='860' cy='350' r='2.2'/%3E%3Ccircle cx='940' cy='320' r='2.3'/%3E%3Ccircle cx='1020' cy='354' r='2.2'/%3E%3Ccircle cx='1092' cy='316' r='2.3'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat;
}
.mq-shell[data-skin="nuit"] .mq-night-constellations {
  right:4%;bottom:7%;width:min(38vw,310px);height:min(17vw,118px);opacity:.13;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 140'%3E%3Cg fill='none' stroke='%23ace9ff' stroke-width='1.2'%3E%3Cpath d='M18 104 62 62 114 88 170 34 226 72 286 24 334 50'/%3E%3C/g%3E%3Cg fill='%23effcff'%3E%3Ccircle cx='18' cy='104' r='2.5'/%3E%3Ccircle cx='62' cy='62' r='2.5'/%3E%3Ccircle cx='114' cy='88' r='2.3'/%3E%3Ccircle cx='170' cy='34' r='2.7'/%3E%3Ccircle cx='226' cy='72' r='2.4'/%3E%3Ccircle cx='286' cy='24' r='2.6'/%3E%3Ccircle cx='334' cy='50' r='2.4'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
}
.mq-shell[data-skin="nuit"] .mq-night-haze { inset:auto 0 0;height:24%;opacity:.24;background:linear-gradient(180deg,transparent,rgba(84,107,191,.12));animation:mq-night-v2-breathe 13s ease-in-out infinite alternate;will-change:opacity; }
@keyframes mq-night-v2-twinkle { from{opacity:.62} to{opacity:.86} }
@keyframes mq-night-v2-breathe { from{opacity:.34} to{opacity:.52} }
@keyframes mq-night-v2-moon { from{opacity:.70;box-shadow:0 0 20px rgba(180,224,255,.16),0 0 44px rgba(111,127,224,.10)} to{opacity:.84;box-shadow:0 0 28px rgba(180,224,255,.24),0 0 58px rgba(111,127,224,.14)} }

/* ---------- Barre haute et navigation ---------- */
.mq-shell[data-skin="nuit"] .mq-top,
.mq-shell[data-skin="nuit"] .mq-nav {
  background:linear-gradient(160deg,#131d2e 0%,#0b1321 100%);
  border:1px solid var(--night-line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 12px 28px rgba(0,0,0,.32);
  backdrop-filter:none;-webkit-backdrop-filter:none;
  color:var(--night-text);
}
.mq-shell[data-skin="nuit"] .mq-avatar { background:#101a2a;border-color:#d9e7f5;box-shadow:0 0 0 2px rgba(131,220,246,.14),0 6px 16px rgba(0,0,0,.30); }
.mq-shell[data-skin="nuit"] .mq-avatar b { background:linear-gradient(145deg,#6272dd,#364391);border-color:#f7fbff;color:#fff; }
.mq-shell[data-skin="nuit"] .mq-xp { background:#26344b; }
.mq-shell[data-skin="nuit"] .mq-xp i { background:linear-gradient(90deg,var(--night-cyan),var(--night-indigo)); }
.mq-shell[data-skin="nuit"] .mq-chip,
.mq-shell[data-skin="nuit"] .mq-icon-btn { background:#172338;color:var(--night-text);border:1px solid var(--night-line);box-shadow:none; }
.mq-shell[data-skin="nuit"] .mq-chip .mq-plus { background:linear-gradient(145deg,#92e6fa,#6d7de8);color:#0a1020;box-shadow:0 6px 14px rgba(69,86,181,.23); }
.mq-shell[data-skin="nuit"] .mq-nav button { color:#8e9bb1; }
.mq-shell[data-skin="nuit"] .mq-nav button.is-on { color:var(--night-cyan);background:#17243a;box-shadow:none; }
.mq-shell[data-skin="nuit"] .mq-nav button.is-on::after { background:var(--night-cyan);box-shadow:0 0 10px rgba(131,220,246,.45); }

/* ---------- Typographie ---------- */
.mq-shell[data-skin="nuit"] .mq-title,
.mq-shell[data-skin="nuit"] .mq-histoire-titre,
.mq-shell[data-skin="nuit"] .mq-online-head .mq-title,
.mq-shell[data-skin="nuit"] .mq-setup-copy .mq-title,
.mq-shell[data-skin="nuit"] .mq-profile-heading h1 { color:var(--night-text);text-shadow:0 3px 12px rgba(0,0,0,.34); }
.mq-shell[data-skin="nuit"] .mq-eyebrow,
.mq-shell[data-skin="nuit"] .mq-online-head .mq-eyebrow,
.mq-shell[data-skin="nuit"] .mq-settings-head .mq-eyebrow,
.mq-shell[data-skin="nuit"] .mq-setup-copy .mq-eyebrow,
.mq-shell[data-skin="nuit"] .mq-view[data-view="boutique"] > div:first-child .mq-eyebrow { color:var(--night-cyan); }

.mq-shell[data-skin="nuit"] .mq-degrade-texte { background:linear-gradient(100deg,#fff 0%,#ccecff 52%,#8edff6 100%);-webkit-background-clip:text;background-clip:text;color:transparent; }
.mq-shell[data-skin="nuit"] .mq-wordmark span { color:var(--night-cyan); }
.mq-shell[data-skin="nuit"] .mq-wordmark b { color:var(--night-text); }

.mq-shell[data-skin="nuit"] .mq-carreau[aria-checked="true"]::after { border-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E"),linear-gradient(145deg,#8be2f7,#6979e4);box-shadow:0 5px 12px rgba(56,75,167,.22); }

/* ---------- Boutons ---------- */
.mq-shell[data-skin="nuit"] .mq-btn-primary,
.mq-shell[data-skin="nuit"] .mq-play { background:linear-gradient(110deg,#91e5f9 0%,#79cdec 32%,#7486ed 70%,#5868cc 100%);color:#09111f;box-shadow:0 4px 0 #33418e,0 11px 24px rgba(47,62,145,.26); }
.mq-shell[data-skin="nuit"] .mq-btn-primary:active,
.mq-shell[data-skin="nuit"] .mq-play:active { transform:none!important;box-shadow:0 2px 0 #33418e,0 7px 17px rgba(47,62,145,.22); }
.mq-shell[data-skin="nuit"] .mq-btn-ghost,
.mq-shell[data-skin="nuit"] .mq-foot .mq-btn,
.mq-shell[data-skin="nuit"] .mq-settings-back,
.mq-shell[data-skin="nuit"] .mq-profile-heading button,
.mq-shell[data-skin="nuit"] .mq-online-head .mq-setup-back { background:#121d2e;color:var(--night-text);border:1px solid var(--night-line);box-shadow:none; }

/* ---------- Boutique, Réglages, Profil ---------- */
.mq-shell[data-skin="nuit"] .mq-view[data-view="boutique"],
.mq-shell[data-skin="nuit"] .mq-view[data-view="reglages"] { gap:clamp(10px,1.25vh,14px); }
.mq-shell[data-skin="nuit"] .mq-view[data-view="boutique"] > div:first-child,
.mq-shell[data-skin="nuit"] .mq-settings-head { flex:0 0 auto;min-height:max-content;overflow:visible;padding:2px 4px 5px; }
.mq-shell[data-skin="nuit"] .mq-view[data-view="boutique"] > div:first-child .mq-lede,
.mq-shell[data-skin="nuit"] .mq-settings-head .mq-lede { margin-top:6px;max-width:36ch; }
.mq-shell[data-skin="nuit"] .mq-promo-entry,
.mq-shell[data-skin="nuit"] .mq-input,
.mq-shell[data-skin="nuit"] .mq-premium-field { background:#0d1727;border-color:#3a4b67;color:var(--night-text); }
.mq-shell[data-skin="nuit"] .mq-promo-entry::placeholder,
.mq-shell[data-skin="nuit"] .mq-input::placeholder { color:#7e8ca5; }
.mq-shell[data-skin="nuit"] .mq-switch { background:#2d3b59; }
.mq-shell[data-skin="nuit"] .mq-settings-row[aria-pressed="true"] .mq-switch { background:linear-gradient(105deg,#86def5,#6e7fe8); }
.mq-shell[data-skin="nuit"] .mq-profile-actions { background:#101a2a;border-color:var(--night-line); }
.mq-shell[data-skin="nuit"] .mq-profile-avatar-large { box-shadow:0 0 0 3px #dce9f6,0 0 0 5px #5869d3,0 12px 24px rgba(0,0,0,.28); }
.mq-shell[data-skin="nuit"] .mq-profile-meter,
.mq-shell[data-skin="nuit"] .mq-profile-xp { background:#27354c; }
.mq-shell[data-skin="nuit"] .mq-profile-meter i,
.mq-shell[data-skin="nuit"] .mq-profile-xp i { background:linear-gradient(90deg,var(--night-cyan),var(--night-indigo)); }

/* ---------- Histoire et multijoueur ---------- */
.mq-shell[data-skin="nuit"] .mq-jalon-txt strong { color:var(--night-text);text-shadow:0 2px 8px rgba(0,0,0,.28); }
.mq-shell[data-skin="nuit"] .mq-jalon.is-locked { opacity:.74; }
.mq-shell[data-skin="nuit"] .mq-jalon.is-locked .mq-jalon-txt strong { color:#aab6ca; }
.mq-shell[data-skin="nuit"] .mq-jalon.on,
.mq-shell[data-skin="nuit"] .mq-jalon.is-current { box-shadow:0 0 0 4px rgba(131,220,246,.13),0 12px 26px rgba(0,0,0,.26); }
.mq-shell[data-skin="nuit"] .mq-trophy-progress,
.mq-shell[data-skin="nuit"] .mq-result-progress { background:#25344a; }
.mq-shell[data-skin="nuit"] .mq-trophy-progress i,
.mq-shell[data-skin="nuit"] .mq-result-progress i { background:linear-gradient(90deg,var(--night-cyan),var(--night-indigo)); }

/* ---------- Plateau ---------- */
.mq-shell[data-skin="nuit"] .mq-board-wrap { isolation:isolate;border-radius:clamp(14px,2.5vmin,24px); }
.mq-shell[data-skin="nuit"] .mq-board-wrap::before { content:"";position:absolute;inset:-1%;border-radius:inherit;pointer-events:none;background:linear-gradient(160deg,rgba(255,255,255,.04),transparent 30%,rgba(131,220,246,.035));border:1px solid rgba(157,183,221,.12);box-shadow:0 16px 34px rgba(0,0,0,.24); }
.mq-shell[data-skin="nuit"] .mq-score-chip,
.mq-shell[data-skin="nuit"] .mq-game-action { background:#111c2d;border-color:var(--night-line);box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 6px 14px rgba(0,0,0,.24); }
.mq-shell[data-skin="nuit"] .mq-score-chip small,
.mq-shell[data-skin="nuit"] .mq-score-chip strong,
.mq-shell[data-skin="nuit"] .mq-game-action svg { color:var(--night-text); }
.mq-shell[data-skin="nuit"] .mq-score-chip.is-turn { background:linear-gradient(145deg,#fbfdff,#eaf0f8)!important;border-color:var(--night-cyan);box-shadow:0 0 0 2px rgba(131,220,246,.12),0 8px 18px rgba(0,0,0,.20); }
.mq-shell[data-skin="nuit"] .mq-score-chip.is-turn small,
.mq-shell[data-skin="nuit"] .mq-score-chip.is-turn strong { color:#142036; }
.mq-shell[data-skin="nuit"] .mq-turn-dot { background:var(--night-cyan);box-shadow:0 0 0 3px rgba(131,220,246,.12),0 0 8px rgba(131,220,246,.48); }
.mq-shell[data-skin="nuit"] .mq-card { border-radius:clamp(10px,2vmin,18px);backface-visibility:hidden; }

.mq-shell[data-skin="nuit"] .mq-back {
	background:
		radial-gradient(circle at 22% 18%, rgba(152,214,255,.14) 0 2%, transparent 2.6%),
		radial-gradient(circle at 76% 23%, rgba(255,255,255,.16) 0 1.3%, transparent 1.9%),
		radial-gradient(circle at 61% 72%, rgba(140,196,255,.12) 0 1.6%, transparent 2.2%),
		radial-gradient(circle at 31% 67%, rgba(255,255,255,.10) 0 1.1%, transparent 1.8%),
		linear-gradient(165deg,#15233a 0%,#0d1830 52%,#0a1326 100%);
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), inset 0 -12px 20px rgba(0,0,0,.20), 0 6px 14px rgba(0,0,0,.28);
}
.mq-shell[data-skin="nuit"] .mq-back::before {
	content:"";
	position:absolute;
	inset:0;
	background:
		no-repeat center / 30% auto url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120' fill='none'%3E%3Cg opacity='0.88' stroke='%23eaf7ff' stroke-width='4.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M60 18 68 44 94 52 68 60 60 86 52 60 26 52 52 44 60 18Z'/%3E%3Cpath d='M90 24 92.8 33.2 102 36 92.8 38.8 90 48 87.2 38.8 78 36 87.2 33.2 90 24Z' opacity='.8'/%3E%3Cpath d='M31 71 34 80 43 83 34 86 31 95 28 86 19 83 28 80 31 71Z' opacity='.72'/%3E%3C/g%3E%3C/svg%3E"),
		radial-gradient(circle at 18% 26%, rgba(255,255,255,.38) 0 1.1%, transparent 1.6%),
		radial-gradient(circle at 82% 30%, rgba(186,231,255,.34) 0 1.2%, transparent 1.8%),
		radial-gradient(circle at 74% 78%, rgba(255,255,255,.28) 0 1%, transparent 1.7%),
		radial-gradient(circle at 22% 80%, rgba(160,212,255,.26) 0 1.1%, transparent 1.7%);
	filter: drop-shadow(0 0 8px rgba(122,199,255,.18));
	opacity:.92;
}
.mq-shell[data-skin="nuit"] .mq-game-action,
.mq-shell[data-skin="nuit"] .mq-game-actions .mq-game-action,
.mq-shell[data-skin="nuit"] button[data-restart],
.mq-shell[data-skin="nuit"] button[data-quit] {
	background:linear-gradient(180deg,#17253b 0%,#0f1a2d 100%) !important;
	border:1px solid rgba(163,185,214,.28) !important;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 18px rgba(0,0,0,.28) !important;
}
.mq-shell[data-skin="nuit"] .mq-game-action svg,
.mq-shell[data-skin="nuit"] .mq-game-actions .mq-game-action svg,
.mq-shell[data-skin="nuit"] button[data-restart] svg,
.mq-shell[data-skin="nuit"] button[data-quit] svg {
	color:#eff5ff !important;
	filter:drop-shadow(0 1px 4px rgba(131,220,246,.18));
}
.mq-shell[data-skin="nuit"] .mq-game-action:active,
.mq-shell[data-skin="nuit"] button[data-restart]:active,
.mq-shell[data-skin="nuit"] button[data-quit]:active {
	background:linear-gradient(180deg,#0f1a2d 0%,#0b1424 100%) !important;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 4px 10px rgba(0,0,0,.24) !important;
}

.mq-shell[data-skin="nuit"] .mq-face { backface-visibility:hidden; }
.mq-shell[data-skin="nuit"] .mq-back { background:linear-gradient(160deg,#1a2740 0%,#111a2d 52%,#0a111e 100%);border-color:#c8d8eb;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 4px 10px rgba(0,0,0,.26); }
.mq-shell[data-skin="nuit"] .mq-back::before { content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(145deg,rgba(255,255,255,.065),transparent 34%,transparent 68%,rgba(131,220,246,.055)); }
.mq-shell[data-skin="nuit"] .mq-back::after { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%2393def3' stroke-width='2.1'%3E%3Cpath d='M20 40c0-10 8-18 18-18 2 0 5 0 7 1-3 1-7 5-7 11 0 7 6 13 13 13 1 0 2 0 3-.3-3.3 5-9 8.3-15 8.3-10.5 0-19-8.4-19-18Z'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3Ccircle cx='45' cy='15' r='1.6'/%3E%3Ccircle cx='48' cy='30' r='1.6'/%3E%3C/g%3E%3C/svg%3E");opacity:.94; }
.mq-shell[data-skin="nuit"] .mq-card.is-open .mq-back::after { animation:mq-night-v2-card-shimmer .65s ease-out; }
.mq-shell[data-skin="nuit"] .mq-front { background:#111b2b;box-shadow:0 4px 10px rgba(0,0,0,.26);color:var(--night-text); }
.mq-shell[data-skin="nuit"] .mq-front .mq-card-name { color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.96),0 0 5px rgba(0,0,0,.58); }
.mq-shell[data-skin="nuit"] .mq-card.is-done .mq-face { border-color:var(--night-cyan);box-shadow:0 0 0 2px rgba(131,220,246,.13),0 0 16px rgba(105,124,225,.28); }
.mq-shell[data-skin="nuit"] .mq-card.is-done .mq-front::before { content:"";position:absolute;inset:-10%;border-radius:50%;pointer-events:none;border:2px solid rgba(131,220,246,.52);animation:mq-night-v2-match .72s ease-out both; }
.mq-shell[data-skin="nuit"] .mq-card.is-wrong .mq-face { border-color:#f48699;box-shadow:0 0 0 2px rgba(244,134,153,.14),0 4px 10px rgba(0,0,0,.24); }
.mq-shell[data-skin="nuit"] .mq-card.is-hint .mq-back { animation:mq-night-v2-hint .62s ease-in-out 3; }
.mq-card-preview-layer[data-skin="nuit"] .mq-card-preview-surface { border-color:#d0deef;background:linear-gradient(155deg,#1a2740,#0b1322);box-shadow:0 16px 34px rgba(0,0,0,.40),0 0 0 3px rgba(131,220,246,.10); }
@keyframes mq-night-v2-card-shimmer { from{opacity:.70} to{opacity:.94} }
@keyframes mq-night-v2-match { 0%{opacity:0;transform:scale(.84)} 35%{opacity:.74} 100%{opacity:0;transform:scale(1.14)} }
@keyframes mq-night-v2-hint { 50%{box-shadow:0 0 0 3px rgba(131,220,246,.18),0 0 16px rgba(111,128,228,.28)} }

/* ---------- Modales pédagogiques ---------- */
.mq-shell[data-skin="nuit"] .mq-sheet-layer { background:rgba(2,5,11,.72);backdrop-filter:none;-webkit-backdrop-filter:none; }
.mq-shell[data-skin="nuit"] .mq-sheet { background:linear-gradient(155deg,#172338,#0e1727);border:1px solid var(--night-line);box-shadow:0 18px 42px rgba(0,0,0,.48); }
.mq-shell[data-skin="nuit"] .mq-sheet-thumb { background:#1b2940;color:var(--night-cyan); }
.mq-shell[data-skin="nuit"] .mq-question { color:var(--night-text); }
.mq-shell[data-skin="nuit"] .mq-fact { color:var(--night-muted); }
.mq-shell[data-skin="nuit"] .mq-fact strong { color:var(--night-cyan);background:#172a40; }
.mq-shell[data-skin="nuit"] .mq-answer { background:#111c2e;border-color:#34455f;color:var(--night-text);transform:none!important; }
.mq-shell[data-skin="nuit"] .mq-answer b { background:#1d2b43;color:var(--night-cyan);box-shadow:none; }
.mq-shell[data-skin="nuit"] .mq-answer.is-right,
.mq-shell[data-skin="nuit"] .mq-verdict.is-right { background:#10291f;border-color:#45bf80;color:#eefcf5; }
.mq-shell[data-skin="nuit"] .mq-answer.is-wrong,
.mq-shell[data-skin="nuit"] .mq-verdict.is-wrong { background:#321722;border-color:#ef7189;color:#fff2f5; }
.mq-shell[data-skin="nuit"] .mq-verdict p { color:var(--night-muted); }
.mq-shell[data-skin="nuit"] .mq-hintbar { color:var(--night-muted); }

/* ---------- Résultats ---------- */
.mq-shell[data-skin="nuit"] .mq-final-result-page,
.mq-shell[data-skin="nuit"] .mq-solo-result-page { background:linear-gradient(180deg,#0a101d,#060a12); }

.mq-shell[data-skin="nuit"] .mq-solo-score-card::after { color:rgba(131,220,246,.06); }

.mq-shell[data-skin="nuit"] .mq-final-replay { background:linear-gradient(155deg,#24334f,#111a2d)!important;color:var(--night-text)!important;border-color:#95aac8!important;box-shadow:0 4px 0 #070d17,0 12px 24px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.07)!important; }
.mq-shell[data-skin="nuit"] .mq-final-replay:active { transform:none!important;box-shadow:0 2px 0 #070d17,0 7px 16px rgba(0,0,0,.26)!important; }
.mq-shell[data-skin="nuit"] .mq-final-home { background:#152135!important;color:var(--night-text)!important;border-color:#607492!important; }

/* ---------- Réduction des animations ---------- */
.mq-shell[data-skin="nuit"][data-motion="calme"] .mq-ambiance::before,
.mq-shell[data-skin="nuit"][data-motion="calme"] .mq-ambiance::after,
.mq-shell[data-skin="nuit"][data-motion="calme"] .mq-night-moon,
.mq-shell[data-skin="nuit"][data-motion="calme"] .mq-night-haze,
.mq-shell[data-skin="nuit"][data-motion="calme"] .mq-card.is-open .mq-back::after,
.mq-shell[data-skin="nuit"][data-motion="calme"] .mq-card.is-done .mq-front::before { animation:none; }
@media (prefers-reduced-motion:reduce) {
  .mq-shell[data-skin="nuit"] .mq-ambiance::before,
  .mq-shell[data-skin="nuit"] .mq-ambiance::after,
  .mq-shell[data-skin="nuit"] .mq-night-moon,
  .mq-shell[data-skin="nuit"] .mq-night-haze,
  .mq-shell[data-skin="nuit"] .mq-card.is-open .mq-back::after,
  .mq-shell[data-skin="nuit"] .mq-card.is-done .mq-front::before { animation:none; }
}

/* ---------- Correctifs finaux de contraste Nuit V2 ---------- */
.mq-shell[data-skin="nuit"] .mq-settings-copy strong,
.mq-shell[data-skin="nuit"] .mq-theme-panel .mq-settings-copy strong { color:var(--night-text); }
.mq-shell[data-skin="nuit"] .mq-settings-copy small,
.mq-shell[data-skin="nuit"] .mq-theme-panel .mq-settings-copy small { color:var(--night-muted); }
.mq-shell[data-skin="nuit"] .mq-histoire-total {
  background:#162238;
  color:var(--night-gold);
  border:1px solid var(--night-line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 7px 16px rgba(0,0,0,.22);
}
.mq-shell[data-skin="nuit"] .mq-chapter b { color:var(--night-text); }
.mq-shell[data-skin="nuit"] .mq-chapter small { color:var(--night-muted); }
.mq-shell[data-skin="nuit"] .mq-chapter.is-locked b,
.mq-shell[data-skin="nuit"] .mq-chapter.is-locked small { color:#8794aa; }
.mq-shell[data-skin="nuit"] .mq-tag {
  background:#edf3fa;
  color:#18243a;
  border:1px solid #d2dfed;
}
.mq-shell[data-skin="nuit"] .mq-tag svg { color:#327ea1; }
.mq-shell[data-skin="nuit"] .mq-ready { color:#8de5fa; }
.mq-shell[data-skin="nuit"] .mq-price { color:#f1bc58; }

/* =========================================================================
   MemoQuest 6.26.9 — outils et paramètres intégrés à la partie
   ========================================================================= */
.mq-gamebar { grid-template-columns:clamp(58px,15vw,82px) minmax(126px,1fr) clamp(58px,15vw,82px);gap:clamp(4px,1.3vw,7px); }
.mq-game-actions { gap:clamp(4px,1.5vw,8px); }
.mq-game-action { width:clamp(35px,10.4vw,40px);height:clamp(35px,10.4vw,40px);flex:0 0 clamp(35px,10.4vw,40px); }
.mq-game-action.is-tip { color:#b47b00; }
.mq-game-action.is-tip svg { color:currentColor;filter:drop-shadow(0 2px 4px rgba(243,181,30,.22)); }
.mq-score-chip.is-solo .mq-turn-dot { display:none; }
.mq-score-chip.is-solo strong { font-size:.85rem; }

.mq-game-sheet-layer { z-index:42; }
.mq-game-sheet-layer .mq-sheet { width:min(520px,100%);max-height:min(100%,760px); }
.mq-game-panel-title { font-size:clamp(1.08rem,4.5vw,1.3rem)!important; }
.mq-game-sheet-layer .mq-sheet-thumb { width:54px;height:54px; }
.mq-game-sheet-layer .mq-sheet-thumb svg { width:30px;height:30px; }
.mq-game-note { margin:0;padding:9px 11px;border-radius:13px;background:rgba(32,137,218,.09);color:var(--encre-2);font-size:.67rem;line-height:1.4;font-weight:780;text-align:center; }

.mq-privacy-panel { display:grid;gap:10px; }
.mq-privacy-panel p { margin:0;color:var(--encre-2);font-size:.78rem;line-height:1.52;font-weight:720; }
.mq-privacy-link { display:flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:10px 14px;border-radius:16px;background:linear-gradient(135deg,var(--bleu),#22bfc2);color:#fff!important;text-decoration:none!important;font-size:.76rem;font-weight:900;box-shadow:0 8px 18px rgba(32,137,218,.22); }
.mq-privacy-link svg { width:21px;height:21px; }

.mq-tip-thumb { color:#d59200!important;background:linear-gradient(155deg,#fff8d5,#ffe8a1)!important; }
.mq-tip-stage { display:grid;gap:10px;min-height:238px; }
.mq-tip-card { position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;padding:16px 14px;border-radius:22px;overflow:hidden;background:linear-gradient(145deg,#fffdf4,#eff9ff);border:1px solid rgba(35,139,207,.15);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 24px rgba(21,60,122,.1); }
.mq-tip-card::after { content:"";position:absolute;width:130px;height:130px;right:-58px;bottom:-74px;border-radius:50%;background:radial-gradient(circle,rgba(255,197,47,.2),transparent 68%);pointer-events:none; }
.mq-tip-number { position:relative;z-index:1;width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#ffd758,#eaa51f);color:#553800;font-size:1rem;font-weight:1000;box-shadow:0 7px 14px rgba(194,130,7,.2); }
.mq-tip-card > div { position:relative;z-index:1;display:grid;align-content:start;gap:5px;min-width:0; }
.mq-tip-card small { color:#169daa;font-size:.52rem;font-weight:1000;letter-spacing:.08em; }
.mq-tip-card h4 { margin:0;color:var(--encre);font-size:1rem;line-height:1.15;font-weight:1000; }
.mq-tip-card p { margin:0;color:var(--encre-2);font-size:.76rem;line-height:1.5;font-weight:750; }
.mq-tip-dots { display:flex;justify-content:center;align-items:center;gap:3px;min-height:10px;overflow:hidden; }
.mq-tip-dots i { width:4px;height:4px;border-radius:99px;background:rgba(84,112,151,.25);transition:width .2s,background .2s; }
.mq-tip-dots i.is-on { width:15px;background:#20adb7; }
.mq-tip-navigation { display:grid;grid-template-columns:1fr 1fr;gap:8px; }
.mq-tip-navigation .mq-btn { min-width:0;padding-inline:9px;font-size:.72rem; }
.mq-tip-resume { background:transparent!important;color:var(--encre-2)!important;box-shadow:none!important;min-height:40px!important; }

.mq-game-settings { display:grid;gap:8px; }
.mq-online-safety-entry .mq-settings-open { margin-left:auto; }
.mq-online-safety { display:grid;gap:10px; }
.mq-online-safety > p { margin:0;color:var(--encre-2);font-size:.75rem;line-height:1.45;font-weight:720; }
.mq-online-safety-reasons { display:grid;gap:7px; }
.mq-online-safety-reasons button { width:100%;display:grid;gap:3px;padding:11px 12px;border:1px solid rgba(61,142,199,.17);border-radius:15px;background:#f4f9fd;color:var(--encre);text-align:left; }
.mq-online-safety-reasons button strong { font-size:.74rem;font-weight:950; }
.mq-online-safety-reasons button small { color:var(--encre-2);font-size:.59rem;line-height:1.3;font-weight:720; }
.mq-online-safety-reasons button:disabled { opacity:.55; }
.mq-online-block { color:#a43145; }
.mq-online-safety-preview { font-size:.66rem; }
.mq-game-setting-row,.mq-game-volume-row { width:100%;min-height:58px;display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 10px;border-radius:17px;background:#f4f9fd;border:1px solid rgba(61,142,199,.13);color:var(--encre);text-align:left; }
.mq-game-setting-row > span,.mq-game-volume-row > span,.mq-game-rules > span { width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#eaf8ff,#d9edf9);color:var(--bleu); }
.mq-game-setting-row svg,.mq-game-volume-row svg,.mq-game-rules svg { width:21px;height:21px; }
.mq-game-setting-row > b,.mq-game-volume-row > b { min-width:0;display:grid;gap:3px;font-weight:inherit; }
.mq-game-setting-row strong,.mq-game-volume-row strong { font-size:.76rem;font-weight:950; }
.mq-game-setting-row small { color:var(--encre-2);font-size:.58rem;line-height:1.25;font-weight:720; }
.mq-game-switch { width:42px;height:24px;border-radius:99px;padding:3px;background:#c9d7e3;transition:background .2s; }
.mq-game-switch u { display:block;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(21,60,122,.22);transition:transform .2s var(--ressort); }
.mq-game-setting-row[aria-pressed="true"] .mq-game-switch { background:linear-gradient(90deg,#1dbab8,#278ddc); }
.mq-game-setting-row[aria-pressed="true"] .mq-game-switch u { transform:translateX(18px); }
.mq-game-volume-row b input { width:100%;height:18px;margin:0;accent-color:#20aeb7;background:transparent; }
.mq-game-volume-row em { min-width:34px;color:var(--encre-2);font-size:.63rem;font-style:normal;font-weight:900;text-align:right; }
.mq-game-volume-row.is-disabled { opacity:.48; }
.mq-game-rules { display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;padding:11px;border-radius:17px;background:linear-gradient(145deg,#f7fbff,#eef7fa);border:1px solid rgba(38,171,181,.15); }
.mq-game-rules > div { min-width:0; }
.mq-game-rules strong { color:var(--encre);font-size:.72rem;font-weight:950; }
.mq-game-rules p { margin:3px 0 0;color:var(--encre-2);font-size:.61rem;line-height:1.38;font-weight:730; }
.mq-game-danger-actions { display:grid;grid-template-columns:1fr 1fr;gap:8px; }
.mq-game-danger-actions .mq-btn { min-width:0;padding-inline:8px;font-size:.7rem; }
.mq-game-quit { color:#fff!important;background:linear-gradient(145deg,#e85858,#bb343f)!important;box-shadow:0 5px 0 #8e2530,0 10px 18px rgba(158,41,54,.2)!important; }

.mq-shell[data-skin="nuit"] .mq-tip-card,.mq-shell[data-skin="ardoise"] .mq-tip-card { background:linear-gradient(145deg,rgba(31,47,72,.98),rgba(16,27,43,.98));border-color:rgba(125,205,231,.2); }
.mq-shell[data-skin="nuit"] .mq-tip-card h4,.mq-shell[data-skin="nuit"] .mq-tip-card p,.mq-shell[data-skin="ardoise"] .mq-tip-card h4,.mq-shell[data-skin="ardoise"] .mq-tip-card p { color:#eef6fb; }
.mq-shell[data-skin="nuit"] .mq-game-setting-row,.mq-shell[data-skin="nuit"] .mq-game-volume-row,.mq-shell[data-skin="nuit"] .mq-game-rules,.mq-shell[data-skin="ardoise"] .mq-game-setting-row,.mq-shell[data-skin="ardoise"] .mq-game-volume-row,.mq-shell[data-skin="ardoise"] .mq-game-rules { background:rgba(24,39,58,.92);border-color:rgba(125,205,231,.16);color:#eef6fb; }
.mq-shell[data-skin="nuit"] .mq-game-setting-row small,.mq-shell[data-skin="nuit"] .mq-game-volume-row em,.mq-shell[data-skin="nuit"] .mq-game-rules p,.mq-shell[data-skin="ardoise"] .mq-game-setting-row small,.mq-shell[data-skin="ardoise"] .mq-game-volume-row em,.mq-shell[data-skin="ardoise"] .mq-game-rules p { color:#aebed0; }
.mq-shell[data-skin="nuit"] .mq-game-rules strong,.mq-shell[data-skin="ardoise"] .mq-game-rules strong { color:#eef6fb; }

@media (max-width:370px) {
  .mq-gamebar { grid-template-columns:56px minmax(114px,1fr) 56px;gap:3px;padding-inline:0; }
  .mq-game-actions { gap:3px; }
  .mq-game-action { width:35px;height:35px;flex-basis:35px;border-radius:11px!important; }
  .mq-game-action svg { width:18px;height:18px; }
  .mq-score-chip { height:39px;border-radius:11px; }
  .mq-tip-card { grid-template-columns:36px minmax(0,1fr);padding:13px 11px; }
  .mq-tip-number { width:36px;height:36px;border-radius:12px; }
}
@media (max-width:480px), (max-height:700px) {
  .mq-game-sheet-layer .mq-sheet { gap:8px;padding:11px; }
  .mq-game-sheet-layer .mq-sheet-thumb { width:44px;height:44px; }
  .mq-tip-stage { min-height:190px; }
  .mq-tip-card { padding:11px; }
  .mq-tip-card p { font-size:.68rem;line-height:1.38; }
  .mq-game-setting-row,.mq-game-volume-row { min-height:49px;padding:6px 8px; }
  .mq-game-setting-row > span,.mq-game-volume-row > span,.mq-game-rules > span { width:34px;height:34px; }
  .mq-game-setting-row small { display:none; }
}
/* =========================================================================
   MEMOQUEST 6.26.0 — SYSTÈME VISUEL SÉMANTIQUE MULTI-THÈMES
   Source de vérité pour couleurs, typographies, surfaces et états.
   Les décors historiques restent décoratifs ; les composants consomment
   désormais exclusivement les jetons sémantiques ci-dessous.
   ========================================================================= */
.mq-shell[data-skin] {
  --mq-bg: #eaf8fb;
  --mq-bg-2: #d8f0f5;
  --mq-surface: #ffffff;
  --mq-surface-raised: #f7fcfd;
  --mq-surface-soft: #eaf6f8;
  --mq-surface-selected: #dff4f5;
  --mq-text: #123c4f;
  --mq-text-secondary: #365f70;
  --mq-text-muted: #5b7885;
  --mq-text-on-light: #123c4f;
  --mq-text-on-dark: #ffffff;
  --mq-accent: #087f8c;
  --mq-accent-strong: #096e7d;
  --mq-accent-2: #176db5;
  --mq-border: #c9e2e7;
  --mq-border-active: #087f8c;
  --mq-success: #247a36;
  --mq-error: #bd2f3f;
  --mq-warning: #8a5700;
  --mq-locked: #6b7780;
  --mq-shadow: 0 10px 28px rgba(18,60,79,.14);
  --mq-shadow-soft: 0 4px 14px rgba(18,60,79,.10);
  --mq-glow: 0 0 0 3px rgba(8,127,140,.16);
  --mq-button-bg: linear-gradient(135deg,#0a8993,#176db5);
  --mq-button-edge: #075d6b;
  --mq-button-text: #ffffff;
  --mq-font-body: ui-rounded,"SF Pro Rounded","Segoe UI Variable Display","Trebuchet MS",Verdana,system-ui,sans-serif;
  --mq-font-display: var(--mq-font-body);
  --mq-space-1: 4px;
  --mq-space-2: 8px;
  --mq-space-3: 12px;
  --mq-space-4: 16px;
  --mq-space-5: 22px;
  --mq-control-min: 44px;

  /* Compatibilité avec les composants historiques. */
  --blanc: var(--mq-surface);
  --encre: var(--mq-text);
  --encre-2: var(--mq-text-secondary);
  --encre-3: var(--mq-text-muted);
  --turq: var(--mq-accent);
  --turq-2: var(--mq-accent);
  --bleu: var(--mq-accent-2);
  --bleu-2: var(--mq-accent-strong);
  --degrade: var(--mq-button-bg);
  --ombre: var(--mq-shadow-soft);
  --ombre-forte: var(--mq-shadow);
  color: var(--mq-text);
  font-family: var(--mq-font-body);
}

.mq-shell[data-skin="jade"] {
  --mq-bg:#e9f8f4; --mq-bg-2:#d1eee8;
  --mq-surface:#ffffff; --mq-surface-raised:#f7fcfb; --mq-surface-soft:#e3f4f1; --mq-surface-selected:#d8f1ec;
  --mq-text:#143f4c; --mq-text-secondary:#345d67; --mq-text-muted:#587781;
  --mq-text-on-light:#143f4c; --mq-text-on-dark:#ffffff;
  --mq-accent:#087f8c; --mq-accent-strong:#096e7d; --mq-accent-2:#176db5;
  --mq-border:#c6e2df; --mq-border-active:#087f8c;
  --mq-success:#25783a; --mq-error:#bb3042; --mq-warning:#865700; --mq-locked:#687880;
  --mq-shadow:0 12px 30px rgba(17,73,81,.15); --mq-shadow-soft:0 5px 15px rgba(17,73,81,.10);
  --mq-glow:0 0 0 3px rgba(8,127,140,.17);
  --mq-button-bg:linear-gradient(135deg,#087f8c,#176db5); --mq-button-edge:#075d6b;
  color-scheme:light;
}
.mq-shell[data-skin="ocean"] {
  --mq-bg:#063d62; --mq-bg-2:#07577b;
  --mq-surface:#f8fdff; --mq-surface-raised:#ffffff; --mq-surface-soft:#e7f5f8; --mq-surface-selected:#d7f0f3;
  --mq-text:#082f49; --mq-text-secondary:#31566a; --mq-text-muted:#587485;
  --mq-text-on-light:#082f49; --mq-text-on-dark:#ffffff;
  --mq-accent:#056b83; --mq-accent-strong:#05596f; --mq-accent-2:#145ea8;
  --mq-border:#b8dce5; --mq-border-active:#056b83;
  --mq-success:#1d7438; --mq-error:#b42d3e; --mq-warning:#845400; --mq-locked:#627681;
  --mq-shadow:0 14px 34px rgba(0,39,67,.24); --mq-shadow-soft:0 6px 18px rgba(0,45,74,.17);
  --mq-glow:0 0 0 3px rgba(5,107,131,.18);
  --mq-button-bg:linear-gradient(135deg,#056b83,#145ea8); --mq-button-edge:#04475d;
  color-scheme:light;
}
.mq-shell[data-skin="grenat"] {
  --mq-bg:#3d111d; --mq-bg-2:#5c1b2c;
  --mq-surface:#fffaf5; --mq-surface-raised:#ffffff; --mq-surface-soft:#f8eae6; --mq-surface-selected:#f3ded8;
  --mq-text:#4a1726; --mq-text-secondary:#693748; --mq-text-muted:#785b64;
  --mq-text-on-light:#4a1726; --mq-text-on-dark:#fff9ed;
  --mq-accent:#8c2040; --mq-accent-strong:#741832; --mq-accent-2:#a26235;
  --mq-border:#e2c7c5; --mq-border-active:#8c2040;
  --mq-success:#33703e; --mq-error:#a92036; --mq-warning:#7a4d00; --mq-locked:#74666a;
  --mq-shadow:0 14px 34px rgba(55,10,25,.22); --mq-shadow-soft:0 6px 18px rgba(55,10,25,.14);
  --mq-glow:0 0 0 3px rgba(140,32,64,.17);
  --mq-button-bg:linear-gradient(135deg,#9c2947,#741832); --mq-button-edge:#581023;
  --mq-font-display:ui-serif,Georgia,Cambria,"Times New Roman",serif;
  color-scheme:light;
}
.mq-shell[data-skin="ardoise"] {
  --mq-bg:#111b21; --mq-bg-2:#1c2b33;
  --mq-surface:#1b2930; --mq-surface-raised:#24353d; --mq-surface-soft:#2c3d45; --mq-surface-selected:#314b53;
  --mq-text:#f1f6f8; --mq-text-secondary:#c8d5da; --mq-text-muted:#a7b8bf;
  --mq-text-on-light:#17242b; --mq-text-on-dark:#f1f6f8;
  --mq-accent:#65d6df; --mq-accent-strong:#39b8c5; --mq-accent-2:#82a8ff;
  --mq-border:#48606a; --mq-border-active:#65d6df;
  --mq-success:#72d38b; --mq-error:#ff8795; --mq-warning:#ffd173; --mq-locked:#87979d;
  --mq-shadow:0 14px 34px rgba(0,0,0,.32); --mq-shadow-soft:0 5px 17px rgba(0,0,0,.23);
  --mq-glow:0 0 0 3px rgba(101,214,223,.18);
  --mq-button-bg:linear-gradient(135deg,#247d89,#485fb4); --mq-button-edge:#1d6873;
  color-scheme:dark;
}
.mq-shell[data-skin="ambre"] {
  --mq-bg:#f5d5a1; --mq-bg-2:#ffe8c7;
  --mq-surface:#fffaf1; --mq-surface-raised:#ffffff; --mq-surface-soft:#f8ead7; --mq-surface-selected:#f5dfc0;
  --mq-text:#4a2b12; --mq-text-secondary:#68472d; --mq-text-muted:#7b624e;
  --mq-text-on-light:#4a2b12; --mq-text-on-dark:#fffaf1;
  --mq-accent:#934309; --mq-accent-strong:#7c3505; --mq-accent-2:#7d5420;
  --mq-border:#dec39d; --mq-border-active:#934309;
  --mq-success:#32713a; --mq-error:#ad2c38; --mq-warning:#704600; --mq-locked:#766b60;
  --mq-shadow:0 13px 31px rgba(95,54,13,.18); --mq-shadow-soft:0 5px 16px rgba(95,54,13,.12);
  --mq-glow:0 0 0 3px rgba(147,67,9,.16);
  --mq-button-bg:linear-gradient(135deg,#a84d0a,#7c3505); --mq-button-edge:#642904;
  color-scheme:light;
}
.mq-shell[data-skin="nuit"] {
  --mq-bg:#070d1c; --mq-bg-2:#101a31;
  --mq-surface:#131d34; --mq-surface-raised:#1b2844; --mq-surface-soft:#202e4b; --mq-surface-selected:#26395b;
  --mq-text:#f5f7ff; --mq-text-secondary:#c9d1e8; --mq-text-muted:#a8b3d1;
  --mq-text-on-light:#17213b; --mq-text-on-dark:#f5f7ff;
  --mq-accent:#80d7ff; --mq-accent-strong:#52b9e7; --mq-accent-2:#9a9dff;
  --mq-border:#415176; --mq-border-active:#80d7ff;
  --mq-success:#78d893; --mq-error:#ff8a9b; --mq-warning:#ffd47f; --mq-locked:#8591ad;
  --mq-shadow:0 15px 38px rgba(0,0,0,.38); --mq-shadow-soft:0 6px 19px rgba(0,0,0,.26);
  --mq-glow:0 0 0 3px rgba(128,215,255,.19);
  --mq-button-bg:linear-gradient(135deg,#357ba6,#555fc0); --mq-button-edge:#2c5777;
  color-scheme:dark;
}

/* Fond et hiérarchie typographique. */
.mq-shell[data-skin] { background-color:var(--mq-bg); }
.mq-shell[data-skin] .mq-title,
.mq-shell[data-skin] h1,
.mq-shell[data-skin] h2,
.mq-shell[data-skin] h3 { color:var(--mq-text); font-family:var(--mq-font-display); line-height:1.12; overflow-wrap:anywhere; }
.mq-shell[data-skin] .mq-degrade-texte {
  background:none; -webkit-background-clip:border-box; background-clip:border-box; color:var(--mq-text);
}
.mq-shell[data-skin] .mq-eyebrow { color:var(--mq-accent); font-size:max(.72rem,11px); line-height:1.25; }
.mq-shell[data-skin] .mq-lede,
.mq-shell[data-skin] .mq-fact { color:var(--mq-text-secondary); font-size:max(.8rem,12px); line-height:1.42; }
.mq-shell[data-skin] small { line-height:1.32; }
.mq-shell[data-skin] :focus-visible { outline-color:var(--mq-border-active); box-shadow:var(--mq-glow); }

/* Boutons et états interactifs. */
.mq-shell[data-skin] .mq-btn { background:var(--mq-surface-raised); color:var(--mq-text); border:1px solid var(--mq-border); }
.mq-shell[data-skin] .mq-btn-primary,
.mq-shell[data-skin] .mq-play,
.mq-shell[data-skin] .mq-promo-entry button,
.mq-shell[data-skin] .mq-promo-reward button {
  color:var(--mq-button-text); background-color:var(--mq-accent-strong); background-image:var(--mq-button-bg);
  border-color:transparent; box-shadow:0 4px 0 var(--mq-button-edge),var(--mq-shadow-soft); text-shadow:0 1px 2px rgba(0,0,0,.22);
}
.mq-shell[data-skin] .mq-btn-primary:active { box-shadow:0 1px 0 var(--mq-button-edge); }
.mq-shell[data-skin] .mq-btn-ghost { color:var(--mq-text-secondary); background:var(--mq-surface-soft); border-color:var(--mq-border); }

.mq-shell[data-skin] [disabled],
.mq-shell[data-skin] .is-disabled,
.mq-shell[data-skin] .is-locked { opacity:.58; color:var(--mq-locked); filter:none; }
.mq-shell[data-skin] .is-error { border-color:var(--mq-error); }
.mq-shell[data-skin] .is-success,
.mq-shell[data-skin] .mq-ready { color:var(--mq-success); }
.mq-shell[data-skin] .mq-price { color:var(--mq-warning); }

/* En-tête, navigation et icônes. */
.mq-shell[data-skin] .mq-top,
.mq-shell[data-skin] .mq-nav { background:color-mix(in srgb,var(--mq-surface) 94%,transparent); border:1px solid var(--mq-border); }
.mq-shell[data-skin] .mq-icon-btn { color:var(--mq-accent); background:var(--mq-surface-soft); border:1px solid var(--mq-border); }
.mq-shell[data-skin] .mq-chip { background:var(--mq-surface-soft); color:var(--mq-text); border-color:var(--mq-border); }
.mq-shell[data-skin] .mq-nav button { color:var(--mq-text-secondary); }
.mq-shell[data-skin] .mq-nav button.is-on { color:var(--mq-accent-strong); }

/* Réglages : tête respirante, liste stable et états lisibles. */
.mq-shell[data-skin] .mq-view[data-view="reglages"] { gap:clamp(10px,1.4vh,16px); }
.mq-shell[data-skin] .mq-settings-head,
.mq-shell[data-skin] .mq-screen-head { display:grid; gap:5px; padding:clamp(8px,1.2vh,13px) clamp(8px,2vw,14px) 2px; }
.mq-shell[data-skin] .mq-settings-head .mq-eyebrow { margin:0; color:var(--mq-accent); }
.mq-shell[data-skin] .mq-settings-head .mq-title { margin:0; color:var(--mq-text); font-size:clamp(1.55rem,6.3vw,2.05rem); }
.mq-shell[data-skin] .mq-settings-head .mq-lede { max-width:44rem; margin:0; }
.mq-shell[data-skin] .mq-settings-scroll { padding:2px 4px 10px; }
.mq-shell[data-skin] .mq-settings-list { gap:clamp(9px,1.1vh,13px); }
.mq-shell[data-skin] .mq-settings-row,
.mq-shell[data-skin] .mq-theme-panel { background:var(--mq-surface); border-color:var(--mq-border); box-shadow:var(--mq-shadow-soft); }
.mq-shell[data-skin] .mq-settings-copy strong,
.mq-shell[data-skin] .mq-theme-option strong { color:var(--mq-text); }
.mq-shell[data-skin] .mq-settings-copy small { color:var(--mq-text-secondary); font-size:max(.72rem,11px); }
.mq-shell[data-skin] .mq-volume-value { color:var(--mq-accent-strong); }
.mq-shell[data-skin] .mq-theme-option { background:var(--mq-surface-raised); color:var(--mq-text); border-color:var(--mq-border); }
.mq-shell[data-skin] .mq-switch { background:var(--mq-surface-soft); border:1px solid var(--mq-border); }
.mq-shell[data-skin] .mq-switch i { background:var(--mq-surface-raised); }
.mq-shell[data-skin] [aria-pressed="true"] .mq-switch { background:var(--mq-accent); }
.mq-shell[data-skin] .mq-range { color:var(--mq-accent); }
.mq-shell[data-skin] .mq-settings-foot { padding-top:3px; }
.mq-shell[data-skin] .mq-settings-foot>small { color:var(--mq-text-muted); }
.mq-shell[data-skin] .mq-settings-back { color:var(--mq-button-text); background:var(--mq-button-bg); box-shadow:var(--mq-shadow-soft); }
.mq-shell[data-skin] .mq-reset-button { color:var(--mq-error); background:color-mix(in srgb,var(--mq-error) 10%,var(--mq-surface)); border:1px solid color-mix(in srgb,var(--mq-error) 30%,var(--mq-border)); }

/* Boutique : séparation stable entre l'en-tête, le cadeau et les catalogues. */
.mq-shell[data-skin] .mq-view[data-view="boutique"] { gap:clamp(10px,1.4vh,16px); }
.mq-shell[data-skin] .mq-shop-scroll { padding:2px 4px 10px; }
.mq-shell[data-skin] .mq-shop-stack { display:grid; gap:clamp(14px,1.9vh,20px); align-content:start; }
.mq-shell[data-skin] .mq-shop-section { display:grid; gap:9px; }
.mq-shell[data-skin] .mq-section-eyebrow { margin:0; }
.mq-shell[data-skin] [data-gift] { border:1px solid var(--mq-border-active); background:linear-gradient(135deg,var(--mq-surface-raised),var(--mq-surface-selected)); }
.mq-shell[data-skin] .mq-opt { background:var(--mq-surface); border-color:var(--mq-border); }

/* Code promotionnel adapté aux six thèmes. */
.mq-shell[data-skin] .mq-promo-card { background:linear-gradient(145deg,var(--mq-surface-raised),var(--mq-surface-soft)); border-color:var(--mq-border); }
.mq-shell[data-skin] .mq-promo-icon { color:var(--mq-button-text); background:var(--mq-button-bg); border-color:var(--mq-surface-raised); }
.mq-shell[data-skin] .mq-promo-head h3,
.mq-shell[data-skin] .mq-promo-form>label,
.mq-shell[data-skin] .mq-promo-reward h3,
.mq-shell[data-skin] .mq-promo-reward>strong,
.mq-shell[data-skin] .mq-promo-reward small b { color:var(--mq-text); }
.mq-shell[data-skin] .mq-promo-head small,
.mq-shell[data-skin] .mq-promo-form>small,
.mq-shell[data-skin] .mq-promo-reward small { color:var(--mq-text-secondary); }
.mq-shell[data-skin] .mq-promo-entry input { color:var(--mq-text); background:var(--mq-surface-raised); border-color:var(--mq-border); caret-color:var(--mq-accent); }
.mq-shell[data-skin] .mq-promo-entry input::placeholder { color:var(--mq-text-muted); }
.mq-shell[data-skin] .mq-promo-entry input:focus { border-color:var(--mq-border-active); box-shadow:var(--mq-glow); }
.mq-shell[data-skin] .mq-promo-reward { background:linear-gradient(155deg,var(--mq-surface-raised),var(--mq-surface-soft)); border-color:var(--mq-border); }

/* Profil, Histoire, multijoueur et résultats. */
.mq-shell[data-skin] .mq-profile-identity-copy h2 { color:var(--mq-text); line-height:1.14; }
.mq-shell[data-skin] .mq-profile-identity-copy>p,
.mq-shell[data-skin] .mq-profile-metric small,
.mq-shell[data-skin] .mq-profile-panel p,
.mq-shell[data-skin] .mq-profile-panel dt { color:var(--mq-text-secondary); }
.mq-shell[data-skin] .mq-profile-edit { color:var(--mq-accent-strong); background:var(--mq-surface-soft); border-color:var(--mq-border); }
.mq-shell[data-skin] .mq-story-title,
.mq-shell[data-skin] .mq-profile-identity-copy h2 { white-space:normal; overflow:visible; text-overflow:clip; min-height:1.2em; }

.mq-shell[data-skin] :is(.mq-dob-field input,.mq-premium-field input,.mq-premium-field select,.mq-code-field input) { background:var(--mq-surface-raised); color:var(--mq-text); border-color:var(--mq-border); }
.mq-shell[data-skin] :is(.mq-dob-field input,.mq-premium-field input,.mq-premium-field select,.mq-code-field input):focus { border-color:var(--mq-border-active); box-shadow:var(--mq-glow); }
.mq-shell[data-skin] .mq-result-grid>div { background:var(--mq-surface-soft); }
.mq-shell[data-skin] .mq-result-grid small { color:var(--mq-text-secondary); }
.mq-shell[data-skin] .mq-result-grid strong,
.mq-shell[data-skin] .mq-personal-score strong,
.mq-shell[data-skin] .mq-personal-stats strong,
.mq-shell[data-skin] .mq-personal-trophies strong { color:var(--mq-accent-strong); }

/* Plateau, barre de partie, cartes et états. */
.mq-shell[data-skin] .mq-gamebar,
.mq-shell[data-skin] .mq-score-chip { color:var(--mq-text); }
.mq-shell[data-skin] .mq-score-chip { background:var(--mq-surface); border-color:var(--mq-border); box-shadow:var(--mq-shadow-soft); }
.mq-shell[data-skin] .mq-score-chip.is-turn { border-color:var(--mq-border-active); box-shadow:var(--mq-glow),var(--mq-shadow-soft); }
.mq-shell[data-skin] .mq-game-action { color:var(--mq-accent); background:var(--mq-surface); border-color:var(--mq-border); }
.mq-shell[data-skin] .mq-game-action svg { color:currentColor; filter:none; }
.mq-shell[data-skin] .mq-front { color:var(--mq-text-on-light); }
.mq-shell[data-skin] .mq-front .mq-card-name { color:var(--mq-text-on-light); background:rgba(255,255,255,.91); text-shadow:none; }
.mq-shell[data-skin] .mq-card.is-wrong .mq-face { border-color:var(--mq-error); }
.mq-shell[data-skin] .mq-card.is-done .mq-face { border-color:var(--mq-success); }
.mq-shell[data-skin] .mq-answer,
.mq-shell[data-skin] .mq-quiz-option,
.mq-shell[data-skin] .mq-vf-option { background:var(--mq-surface); color:var(--mq-text); border-color:var(--mq-border); }
.mq-shell[data-skin] .mq-answer.is-correct,
.mq-shell[data-skin] .mq-quiz-option.is-correct,
.mq-shell[data-skin] .mq-vf-option.is-correct { border-color:var(--mq-success); background:color-mix(in srgb,var(--mq-success) 12%,var(--mq-surface)); }
.mq-shell[data-skin] .mq-answer.is-wrong,
.mq-shell[data-skin] .mq-quiz-option.is-wrong,
.mq-shell[data-skin] .mq-vf-option.is-wrong { border-color:var(--mq-error); background:color-mix(in srgb,var(--mq-error) 10%,var(--mq-surface)); }

/* Modales et panneau Astuces/Paramètres en partie. */
.mq-shell[data-skin] :is(.mq-sheet,.mq-game-sheet,.mq-privacy-panel,.mq-tips-card) { color:var(--mq-text); background:var(--mq-surface); border:1px solid var(--mq-border); }
.mq-shell[data-skin] :is(.mq-sheet,.mq-game-sheet,.mq-privacy-panel,.mq-tips-card) :is(h2,h3,strong) { color:var(--mq-text); }
.mq-shell[data-skin] :is(.mq-sheet,.mq-game-sheet,.mq-privacy-panel,.mq-tips-card) :is(p,small) { color:var(--mq-text-secondary); }
.mq-shell[data-skin] .mq-sheet-actions { display:grid; gap:8px; }

/* Responsive et petites hauteurs. */
@media (max-width:500px) {
  .mq-shell[data-skin] { font-size:clamp(13px,3.35vw,16px); }
  .mq-shell[data-skin] .mq-title { letter-spacing:-.025em; }
  .mq-shell[data-skin] .mq-settings-row { min-height:64px; }
  .mq-shell[data-skin] .mq-settings-copy strong { font-size:clamp(.94rem,3.75vw,1.14rem); }
  .mq-shell[data-skin] .mq-settings-copy small { font-size:clamp(.72rem,2.7vw,.84rem); }
  .mq-shell[data-skin] .mq-online-choice small,
  .mq-shell[data-skin] .mq-online-resume small { font-size:clamp(.72rem,2.75vw,.86rem); }
}
@media (max-height:720px) {
  .mq-shell[data-skin] .mq-screen-head,
  .mq-shell[data-skin] .mq-settings-head { padding-top:4px; gap:2px; }
  .mq-shell[data-skin] .mq-settings-list,
  .mq-shell[data-skin] .mq-shop-stack { gap:8px; }
  .mq-shell[data-skin] .mq-settings-row { min-height:58px; padding-block:7px; }
}
@media (prefers-reduced-motion:reduce) {
  .mq-shell[data-skin] *, .mq-shell[data-skin] *::before, .mq-shell[data-skin] *::after { scroll-behavior:auto!important; }
}
/* =========================================================================
   MEMOQUEST 6.26.0 — FINITIONS QA VISUELLE
   Résultats, textes compacts, contrôles tactiles et longues dénominations.
   ========================================================================= */
.mq-shell[data-skin] .mq-sheet-title { font-size:clamp(1.12rem,4.4vw,1.3rem); }
.mq-shell[data-skin] .mq-mission-tete strong { white-space:normal; overflow:visible; text-overflow:clip; line-height:1.22; }

.mq-shell[data-skin] :is(.mq-profile-edit,.mq-reset-button,.mq-chip,.mq-icon-btn,.mq-game-action) { min-width:40px; min-height:40px; }
.mq-shell[data-skin] .mq-range { min-height:28px; touch-action:pan-x; }

/* Résultats : même système de surface et de texte que le thème actif. */
.mq-shell[data-skin] .mq-final-result-page { color:var(--mq-text); }

.mq-shell[data-skin] .mq-final-home { color:var(--mq-text)!important; background:var(--mq-surface-raised)!important; border-color:var(--mq-border)!important; }
.mq-shell[data-skin] .mq-final-replay { color:var(--mq-button-text)!important; background:var(--mq-button-bg)!important; border-color:transparent!important; box-shadow:0 5px 0 var(--mq-button-edge),var(--mq-shadow-soft)!important; }

/* Les formulaires et mentions en ligne héritent du thème, jamais du bleu Lagon. */
.mq-shell[data-skin] :is(.mq-privacy-check,.mq-quick-rule,.mq-competitive-copy p,.mq-competitive-copy>span,
  .mq-match-progress span,.mq-rematch-status,.mq-online-form-note) { color:var(--mq-text-secondary); }
.mq-shell[data-skin] :is(.mq-competitive-copy>strong,.mq-trophy-result>div:nth-child(2) strong,
  .mq-trophy-result>div:nth-child(2) p b,.mq-rematch-status strong,.mq-room-code strong) { color:var(--mq-text); }

/* En-têtes posés directement sur le décor : couleur distincte des surfaces. */
.mq-shell[data-skin] {
  --mq-screen-text:var(--mq-text);
  --mq-screen-secondary:var(--mq-text-secondary);
  --mq-screen-accent:var(--mq-accent);
}
.mq-shell[data-skin="jade"] { --mq-screen-text:#123c4f; --mq-screen-secondary:#365f70; --mq-screen-accent:#087f8c; }
.mq-shell[data-skin="ocean"] { --mq-screen-text:#082f49; --mq-screen-secondary:#214e62; --mq-screen-accent:#05596f; }
.mq-shell[data-skin="grenat"] { --mq-screen-text:#fff5ed; --mq-screen-secondary:#f0d5ce; --mq-screen-accent:#efbd82; }
.mq-shell[data-skin="ardoise"] { --mq-screen-text:#f1f6f8; --mq-screen-secondary:#c8d5da; --mq-screen-accent:#65d6df; }
.mq-shell[data-skin="ambre"] { --mq-screen-text:#4a2b12; --mq-screen-secondary:#68472d; --mq-screen-accent:#7c3505; }
.mq-shell[data-skin="nuit"] { --mq-screen-text:#f5f7ff; --mq-screen-secondary:#c9d1e8; --mq-screen-accent:#80d7ff; }
.mq-shell[data-skin] :is(.mq-screen-head,.mq-settings-head,.mq-histoire-titre,.mq-setup-copy) .mq-title { color:var(--mq-screen-text); }
.mq-shell[data-skin] :is(.mq-screen-head,.mq-settings-head,.mq-histoire-titre,.mq-setup-copy) .mq-lede { color:var(--mq-screen-secondary); }
.mq-shell[data-skin] :is(.mq-screen-head,.mq-settings-head,.mq-histoire-titre,.mq-setup-copy) .mq-eyebrow { color:var(--mq-screen-accent); }
.mq-shell[data-skin] .mq-shop-head { flex:0 0 auto; min-height:clamp(82px,10.8vh,102px); padding-bottom:10px; }
.mq-shell[data-skin] .mq-shop-head .mq-lede { padding-bottom:2px; }
@media (max-height:720px) {
  .mq-shell[data-skin] .mq-shop-head { min-height:72px; padding-bottom:6px; }
}

/* ------------------------------------------------------------------
   MemoQuest 6.26.9 — réactions premium : quota 5 + cooldown 3:30
   ------------------------------------------------------------------ */
.mq-game-action.is-reaction svg{width:20px;height:20px}
.mq-game-action.is-reaction{position:relative;background:linear-gradient(145deg,var(--mq-surface,#fff),color-mix(in srgb,var(--mq-accent,#38c4a4) 18%,var(--mq-surface,#fff)));border-color:color-mix(in srgb,var(--mq-accent,#38c4a4) 38%,transparent);box-shadow:0 8px 20px rgba(12,45,39,.13)}
.mq-game-action.is-reaction.is-cooldown::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;right:4px;top:4px;background:#ffb74d;box-shadow:0 0 0 3px color-mix(in srgb,#ffb74d 20%,transparent)}

.mq-game-popover-layer{position:absolute;inset:0;z-index:42;pointer-events:auto;background:transparent}
.mq-game-popover{position:absolute;width:min(296px,calc(100% - 20px));padding:9px;border-radius:19px;background:color-mix(in srgb,var(--mq-surface,#fff) 96%,transparent);color:var(--mq-text,#173c35);border:1px solid color-mix(in srgb,var(--mq-border,rgba(76,117,108,.18)) 86%,transparent);box-shadow:0 18px 42px rgba(8,28,24,.24),inset 0 1px 0 rgba(255,255,255,.35);transform:translateY(-4px) scale(.97);transform-origin:50% 0;opacity:0;transition:transform .16s cubic-bezier(.2,.85,.2,1),opacity .14s ease}
.mq-game-popover-layer.is-open .mq-game-popover{transform:translateY(0) scale(1);opacity:1}
.mq-reaction-popover{display:grid;gap:7px}
.mq-reaction-popover-head{min-height:29px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4px}
.mq-reaction-popover-head strong{font-size:.9rem;letter-spacing:.01em;color:var(--mq-text,#173c35);white-space:nowrap}
.mq-reaction-quota{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:0}
.mq-reaction-quota-label{font-size:.62rem;font-weight:850;line-height:1;white-space:nowrap;color:var(--mq-text-secondary,#607973)}
.mq-reaction-quota-dots{display:flex;gap:3px}
.mq-reaction-quota-dots i{width:5px;height:5px;border-radius:50%;background:color-mix(in srgb,var(--mq-text-secondary,#607973) 18%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mq-border,#80958f) 50%,transparent)}
.mq-reaction-quota-dots i.is-on{background:var(--mq-accent,#38c4a4);box-shadow:0 0 0 2px color-mix(in srgb,var(--mq-accent,#38c4a4) 13%,transparent)}

.mq-reaction-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.mq-reaction-tile{min-width:0;height:68px;padding:5px 2px 5px;border:1px solid color-mix(in srgb,var(--mq-border,rgba(76,117,108,.18)) 90%,transparent);border-radius:15px;background:color-mix(in srgb,var(--mq-surface,#fff) 91%,var(--mq-accent,#38c4a4) 9%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;overflow:hidden;box-shadow:0 5px 14px rgba(12,44,38,.07);transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,opacity .14s ease}
.mq-reaction-tile:hover,.mq-reaction-tile:focus-visible{transform:translateY(-2px) scale(1.02);border-color:color-mix(in srgb,var(--mq-accent,#38c4a4) 48%,transparent);box-shadow:0 9px 18px rgba(12,44,38,.13)}
.mq-reaction-tile:active{transform:scale(.96)}
.mq-reaction-tile.is-sending{opacity:.62}
.mq-reaction-tile.is-cooldown,.mq-reaction-tile:disabled{opacity:.42;filter:saturate(.55);transform:none;cursor:not-allowed}
.mq-reaction-tile strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-align:center;font-size:.58rem;line-height:1.03;font-weight:850;color:var(--mq-text,#173c35)}
.mq-reaction-art{width:40px;height:40px;display:grid;place-items:center;filter:drop-shadow(0 5px 7px rgba(21,35,32,.12))}
.mq-reaction-glyph{display:block;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:33px;line-height:1;transform-origin:50% 58%;will-change:transform,filter}
.mq-reaction-tile:hover .mq-reaction-laugh,.mq-reaction-bubble .mq-reaction-laugh{animation:mqEmojiLaugh .58s ease-in-out infinite}
.mq-reaction-tile:hover .mq-reaction-clap,.mq-reaction-bubble .mq-reaction-clap{animation:mqEmojiClap .5s ease-in-out infinite}
.mq-reaction-tile:hover .mq-reaction-wow,.mq-reaction-bubble .mq-reaction-wow{animation:mqEmojiWow .72s cubic-bezier(.2,.8,.2,1) infinite}
.mq-reaction-tile:hover .mq-reaction-fire,.mq-reaction-bubble .mq-reaction-fire{animation:mqEmojiFire .46s ease-in-out infinite alternate}
.mq-reaction-tile:hover .mq-reaction-luck,.mq-reaction-bubble .mq-reaction-luck{animation:mqEmojiLuck .72s ease-in-out infinite}
.mq-reaction-tile:hover .mq-reaction-gg,.mq-reaction-bubble .mq-reaction-gg{animation:mqEmojiGG .9s ease-in-out infinite}
.mq-reaction-tile:hover .mq-reaction-oops,.mq-reaction-bubble .mq-reaction-oops{animation:mqEmojiOops .8s ease-in-out infinite}
.mq-reaction-tile:hover .mq-reaction-star,.mq-reaction-bubble .mq-reaction-star{animation:mqEmojiStar .72s ease-in-out infinite}

.mq-reaction-visibility{height:32px;width:100%;display:flex;align-items:center;justify-content:center;gap:7px;padding:0 10px;border-radius:12px;border:0;background:color-mix(in srgb,var(--mq-text,#173c35) 6%,transparent);color:var(--mq-text-secondary,#607973);font-weight:800}
.mq-reaction-visibility svg{width:16px;height:16px}.mq-reaction-visibility span{font-size:.64rem;line-height:1}

/* Notification reçue/envoyée : compacte, en haut, jamais sur les cartes. */
.mq-reaction-burst{position:absolute;top:48px;z-index:10;pointer-events:none;opacity:0;transform:translateY(7px) scale(.86);animation:mqReactionIn .2s cubic-bezier(.2,.9,.2,1.12) forwards}
.mq-reaction-burst.is-left{left:2px}.mq-reaction-burst.is-right{right:2px}.mq-reaction-burst.is-leaving{animation:mqReactionOut .22s ease forwards}
.mq-reaction-bubble{position:relative;display:flex;align-items:center;gap:7px;min-width:128px;max-width:174px;padding:6px 9px 6px 6px;border-radius:18px;background:color-mix(in srgb,var(--mq-surface,#fff) 92%,transparent);border:1px solid color-mix(in srgb,var(--mq-accent,#38c4a4) 24%,var(--mq-border,transparent));box-shadow:0 12px 24px rgba(7,28,24,.19);}
.mq-reaction-bubble-art{width:46px;height:46px;display:grid;place-items:center;flex:0 0 auto}
.mq-reaction-bubble .mq-reaction-glyph{font-size:39px}
.mq-reaction-bubble-copy{display:flex;flex-direction:column;min-width:0;gap:2px}
.mq-reaction-bubble b{font-size:.71rem;line-height:1.05;font-weight:900;color:var(--mq-text,#173c35);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mq-reaction-bubble small{font-size:.58rem;line-height:1.05;font-weight:800;color:var(--mq-text-secondary,#607973);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mq-reaction-spark{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--mq-accent,#38c4a4);opacity:.85;animation:mqSpark .9s ease-out infinite}
.mq-reaction-spark.s1{left:7px;top:6px;animation-delay:.03s}.mq-reaction-spark.s2{right:8px;top:5px;animation-delay:.25s}

@keyframes mqEmojiLaugh{0%,100%{transform:rotate(0) translateY(0)}25%{transform:rotate(-7deg) translateY(-2px)}50%{transform:rotate(7deg) translateY(1px)}75%{transform:rotate(-4deg) translateY(-1px)}}
@keyframes mqEmojiClap{0%,100%{transform:scale(1) rotate(0)}45%{transform:scale(1.16) rotate(-6deg)}60%{transform:scale(.94) rotate(5deg)}}
@keyframes mqEmojiWow{0%,100%{transform:scale(1)}42%{transform:scale(1.18)}60%{transform:scale(.96)}}
@keyframes mqEmojiFire{from{transform:translateY(1px) scale(.96) rotate(-2deg);filter:saturate(1)}to{transform:translateY(-3px) scale(1.08) rotate(2deg);filter:saturate(1.18)}}
@keyframes mqEmojiLuck{0%,100%{transform:rotate(0) translateY(0)}30%{transform:rotate(-9deg) translateY(-2px)}60%{transform:rotate(7deg) translateY(0)}}
@keyframes mqEmojiGG{0%,100%{transform:translateX(0) rotate(0)}40%{transform:translateX(2px) rotate(3deg)}70%{transform:translateX(-1px) rotate(-2deg)}}
@keyframes mqEmojiOops{0%,100%{transform:rotate(0) translateY(0)}45%{transform:rotate(-7deg) translateY(1px)}65%{transform:rotate(4deg) translateY(-1px)}}
@keyframes mqEmojiStar{0%,100%{transform:scale(1) rotate(0)}40%{transform:scale(1.13) rotate(-4deg);filter:brightness(1.04)}70%{transform:scale(.97) rotate(4deg)}}
@keyframes mqReactionIn{from{opacity:0;transform:translateY(7px) scale(.86)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes mqReactionOut{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-8px) scale(.92)}}
@keyframes mqSpark{0%{opacity:0;transform:scale(.4)}35%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:translateY(-8px) scale(.2)}}
[data-motion="calme"] .mq-reaction-glyph,[data-motion="calme"] .mq-reaction-burst,[data-motion="calme"] .mq-reaction-spark{animation:none!important}
@media(max-width:390px){
 .mq-game-popover{width:min(286px,calc(100% - 14px));padding:8px;border-radius:18px}
 .mq-reaction-grid{gap:5px}.mq-reaction-tile{height:65px;border-radius:13px}.mq-reaction-art{width:38px;height:38px}.mq-reaction-glyph{font-size:31px}.mq-reaction-tile strong{font-size:.56rem}.mq-reaction-visibility{height:31px}
 .mq-reaction-quota-label{font-size:.58rem}.mq-reaction-quota-dots{gap:2px}.mq-reaction-quota-dots i{width:4px;height:4px}
 .mq-reaction-burst{top:45px}.mq-reaction-bubble{min-width:118px;max-width:158px;padding:5px 8px 5px 5px}.mq-reaction-bubble-art{width:42px;height:42px}.mq-reaction-bubble .mq-reaction-glyph{font-size:36px}
}

@keyframes mqHomeCardLeftIn{0%{opacity:0;transform:translate(-155%,-150%) rotate(-27deg) scale(.72)}68%{opacity:1;transform:translate(-92%,-50%) rotate(-10deg) scale(1.035)}100%{opacity:1;transform:translate(-91%,-49%) rotate(-8.5deg) scale(1)}}
@keyframes mqHomeCardRightIn{0%{opacity:0;transform:translate(55%,-150%) rotate(27deg) scale(.72)}68%{opacity:1;transform:translate(-8%,-50%) rotate(10deg) scale(1.035)}100%{opacity:1;transform:translate(-9%,-49%) rotate(8.5deg) scale(1)}}
@keyframes mqHomeCardCenterIn{0%{opacity:0;transform:translate(-50%,-55%) scale(.42);filter:blur(1.2px)}58%{opacity:1;transform:translate(-50%,-50%) scale(1.07);filter:blur(0)}100%{opacity:1;transform:translate(-50%,-49%) scale(1)}}
@keyframes mqHomeCardLeftIdle{from{transform:translate(-91%,-49%) rotate(-8.5deg)}to{transform:translate(-91%,-52%) rotate(-7.6deg)}}
@keyframes mqHomeCardRightIdle{from{transform:translate(-9%,-49%) rotate(8.5deg)}to{transform:translate(-9%,-52%) rotate(7.6deg)}}
@keyframes mqHomeCardCenterIdle{from{transform:translate(-50%,-49%) scale(1)}to{transform:translate(-50%,-52%) scale(1.012)}}
@keyframes mqHomeWordIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-height:760px){
  
  
}
@media(max-height:660px){
  
  
}
@media(prefers-reduced-motion:reduce){
  
  
  
  
}

/* =========================================================================
   MemoQuest 6.26.9 — Phase 2 : cibles tactiles et bandeau étroit
   Corrections additives limitées afin de préserver les géométries du jeu.
   ========================================================================= */
.mq-icon-btn,
.mq-game-action,
.mq-reaction-launch,
.mq-settings-close,
.mq-panel-close {
    min-width: 44px;
    min-height: 44px;
}
.mq-game-action { width:44px; height:44px; flex-basis:44px; }

@media (max-width: 370px) {
    .mq-shell[data-screen="miseEnPlace"] .mq-top {
        min-height: 58px;
        padding-inline: 8px;
        gap: 4px;
        border-radius: 22px;
    }
    .mq-shell[data-screen="miseEnPlace"] .mq-avatar {
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
    }
    .mq-shell[data-screen="miseEnPlace"] .mq-profil-info { display:none; }
    .mq-shell[data-screen="miseEnPlace"] .mq-chip { gap:3px; margin-left:auto; }
    .mq-shell[data-screen="miseEnPlace"] .mq-chip .mq-coin { width:32px; height:32px; }
    .mq-shell[data-screen="miseEnPlace"] .mq-chip .mq-plus { width:32px; height:32px; }
    .mq-shell[data-screen="miseEnPlace"] .mq-icon-btn {
        width:44px;
        height:44px;
        flex:0 0 44px;
    }
}
@media (max-width: 330px) {
    .mq-shell[data-screen="miseEnPlace"] .mq-chip .mq-plus { display:none; }
    .mq-shell[data-screen="miseEnPlace"] .mq-chip .mq-coin { width:28px; height:28px; }
    .mq-shell[data-screen="miseEnPlace"] .mq-chip { padding-inline:5px; }
    .mq-shell[data-screen="miseEnPlace"] .mq-top { gap:3px; padding-inline:6px; }
}

/* =========================================================================
   MemoQuest 6.27.6 — Design system ciblé : wordmark, univers, thèmes,
   légendes de cartes. Ce bloc est la couche canonique de ces composants.
   ========================================================================= */

/* Wordmark : une paire de couleurs explicitement définie pour chaque thème. */
.mq-shell[data-skin="jade"] {
  --mq-wordmark-memo:#078d9b;
  --mq-wordmark-quest:#123f69;
  --mq-wordmark-shadow:0 1px 0 rgba(255,255,255,.30),0 3px 9px rgba(18,63,105,.12);
}
.mq-shell[data-skin="ocean"] {
  --mq-wordmark-memo:#057d98;
  --mq-wordmark-quest:#083f66;
  --mq-wordmark-shadow:0 1px 0 rgba(255,255,255,.28),0 3px 9px rgba(4,55,91,.14);
}
.mq-shell[data-skin="ardoise"] {
  --mq-wordmark-memo:#69e1e9;
  --mq-wordmark-quest:#f5f9fb;
  --mq-wordmark-shadow:0 2px 10px rgba(0,0,0,.42),0 0 14px rgba(105,225,233,.10);
}
.mq-shell[data-skin="grenat"] {
  --mq-wordmark-memo:#ffc0cb;
  --mq-wordmark-quest:#fff6f1;
  --mq-wordmark-shadow:0 2px 10px rgba(47,7,17,.42),0 0 13px rgba(255,192,203,.10);
}
.mq-shell[data-skin="ambre"] {
  --mq-wordmark-memo:#9b430a;
  --mq-wordmark-quest:#4d2b10;
  --mq-wordmark-shadow:0 1px 0 rgba(255,255,255,.24),0 3px 9px rgba(98,44,8,.12);
}
.mq-shell[data-skin="nuit"] {
  --mq-wordmark-memo:#82ddff;
  --mq-wordmark-quest:#f5f7ff;
  --mq-wordmark-shadow:0 2px 11px rgba(0,0,0,.50),0 0 16px rgba(128,215,255,.12);
}

/* Les mêmes nouveaux visuels horizontaux sont aussi utilisés dans la boutique. */
.mq-view[data-view="boutique"] .mq-opt figure {
  height:clamp(58px,13.5vw,82px);
  padding:0;
  border-radius:clamp(13px,3.3vw,18px);
  background:var(--mq-surface-soft,#dcecf7);
}
.mq-view[data-view="boutique"] .mq-opt figure img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

/* Boutique et Paramètres partagent désormais le même composant visuel de thème,
   la même image, le même ordre et le même état Actif/Utiliser/Prix. */
.mq-theme-grid-unified {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(7px,2vw,10px);
}
.mq-theme-unified {
  min-height:0;
  padding:5px 5px 7px;
  gap:5px;
}
.mq-theme-unified .mq-theme-image {
  width:100%;
  aspect-ratio:16/10;
  border-radius:clamp(9px,2.3vw,13px);
}
.mq-theme-unified .mq-theme-copy {
  width:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
}
.mq-theme-unified .mq-theme-copy strong {
  max-width:100%;
  font-size:clamp(.68rem,2.8vw,.86rem);
  line-height:1.05;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mq-theme-unified .mq-theme-copy small {
  max-width:100%;
  min-height:1.15em;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  font-size:clamp(.55rem,2.25vw,.72rem);
  line-height:1.08;
  font-weight:850;
  white-space:nowrap;
  color:var(--mq-text-secondary,#55719c);
}
.mq-theme-unified .mq-theme-copy small svg {
  width:11px;
  height:11px;
}
.mq-theme-unified .mq-theme-copy small.is-active { color:var(--mq-success,#15956f); }
.mq-theme-unified .mq-theme-copy small.is-locked { color:var(--mq-warning,#8b6200); }
.mq-view[data-view="boutique"] .mq-shop-theme-option {
  background:var(--mq-surface-raised);
  border-color:var(--mq-border);
  box-shadow:var(--mq-shadow-soft);
}

/* Libellés des cartes : aucun fond blanc, une seule ligne, taille ajustée
   dynamiquement par fitCardNames() quand le plateau devient très dense. */
.mq-shell[data-skin] .mq-board .mq-front > .mq-card-name,
.mq-shell[data-skin] .mq-board[data-category="animaux"] .mq-front > .mq-card-name,
.mq-card-preview-surface > .mq-card-name {
  left:4%;
  right:4%;
  bottom:3.5%;
  min-height:0;
  max-height:none;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent !important;
  box-shadow:none;
  color:#fff !important;
  font-family:"Arial Narrow","Roboto Condensed","Segoe UI",system-ui,sans-serif;
  font-size:clamp(5.2px,1.20vmin,10px);
  font-weight:900;
  line-height:1;
  letter-spacing:-.025em;
  white-space:nowrap !important;
  overflow:visible;
  overflow-wrap:normal;
  word-break:normal;
  text-overflow:clip;
  text-shadow:0 1px 2px rgba(0,0,0,.94),0 0 4px rgba(0,0,0,.58);
}
.mq-shell[data-skin] .mq-board .mq-card-name.is-long,
.mq-card-preview-surface .mq-card-name.is-long {
  font-size:clamp(4.6px,1.02vmin,8.7px);
  letter-spacing:-.035em;
}
.mq-shell[data-skin] .mq-board .mq-card-name.is-very-long,
.mq-card-preview-surface .mq-card-name.is-very-long {
  font-size:clamp(4px,.90vmin,7.6px);
  letter-spacing:-.045em;
}

/* Sur très faible hauteur, l'icône peut disparaître du panneau d'information
   mais jamais recouvrir l'image : priorité au contenu et au toucher. */
@media (max-width:480px), (max-height:700px) {
  .mq-view[data-view="miseEnPlace"] .mq-category-card {
    grid-template-rows:minmax(0,1fr) minmax(30px,27%);
  }
  .mq-view[data-view="miseEnPlace"] .mq-category-info { padding:3px 4px; }
  .mq-view[data-view="miseEnPlace"] .mq-category-medallion { display:none; }
  .mq-view[data-view="miseEnPlace"] .mq-category-title-row strong { max-width:100%;font-size:.66rem; }
  .mq-view[data-view="miseEnPlace"] .mq-category-info small { font-size:.56rem; }
}

/* =========================================================================
   MEMOQUEST 6.27.6 — ACTIVITÉS PREMIUM + QUI SUIS-JE ?
   Source de vérité unique pour Quiz et Vrai/Faux.
   Une seule surface modale, couleurs sémantiques, états accessibles et
   animations bornées. Aucun décor du thème n'est dupliqué dans la fenêtre.
   ========================================================================= */
.mq-shell[data-skin] {
  --mq-activity-overlay: color-mix(in srgb,var(--mq-bg) 54%,rgba(5,16,28,.42));
  --mq-activity-surface: var(--mq-surface);
  --mq-activity-soft: var(--mq-surface-soft);
  --mq-activity-border: var(--mq-border);
  --mq-activity-accent: var(--mq-accent);
  --mq-activity-accent-soft: color-mix(in srgb,var(--mq-accent) 11%,var(--mq-surface));
  --mq-activity-shadow: 0 24px 58px color-mix(in srgb,var(--mq-bg) 30%,rgba(0,0,0,.24));
  --mq-vf-true:#238a49;
  --mq-vf-true-soft:#e9f8ee;
  --mq-vf-true-text:#0f5f2d;
  --mq-vf-false:#d84552;
  --mq-vf-false-soft:#fff0f1;
  --mq-vf-false-text:#a22431;
}
.mq-shell[data-skin="ocean"] {
  --mq-activity-accent:#087c9b; --mq-activity-accent-soft:#e3f5f8;
  --mq-vf-true:#1f8247; --mq-vf-true-soft:#e8f7ed; --mq-vf-true-text:#115c31;
  --mq-vf-false:#cc4050; --mq-vf-false-soft:#fff0f2; --mq-vf-false-text:#9d2837;
}
.mq-shell[data-skin="grenat"] {
  --mq-activity-accent:#8c2040; --mq-activity-accent-soft:#f8e9eb;
  --mq-vf-true:#347a46; --mq-vf-true-soft:#edf7ef; --mq-vf-true-text:#245f34;
  --mq-vf-false:#b7253b; --mq-vf-false-soft:#fcebed; --mq-vf-false-text:#8f182c;
}
.mq-shell[data-skin="ambre"] {
  --mq-activity-accent:#934309; --mq-activity-accent-soft:#f8ead7;
  --mq-vf-true:#397c43; --mq-vf-true-soft:#edf7ee; --mq-vf-true-text:#285f31;
  --mq-vf-false:#b7353e; --mq-vf-false-soft:#fceded; --mq-vf-false-text:#92252e;
}
.mq-shell[data-skin="ardoise"] {
  --mq-activity-overlay:rgba(4,10,14,.70); --mq-activity-surface:#1b2930; --mq-activity-soft:#24353d;
  --mq-activity-border:#48606a; --mq-activity-accent:#65d6df; --mq-activity-accent-soft:#243d43;
  --mq-activity-shadow:0 26px 64px rgba(0,0,0,.46);
  --mq-vf-true:#68d58a; --mq-vf-true-soft:#19392a; --mq-vf-true-text:#dcffe8;
  --mq-vf-false:#ff8192; --mq-vf-false-soft:#44232a; --mq-vf-false-text:#fff0f3;
}
.mq-shell[data-skin="nuit"] {
  --mq-activity-overlay:rgba(2,6,16,.76); --mq-activity-surface:#131d34; --mq-activity-soft:#1b2844;
  --mq-activity-border:#415176; --mq-activity-accent:#80d7ff; --mq-activity-accent-soft:#1c3350;
  --mq-activity-shadow:0 28px 68px rgba(0,0,0,.52);
  --mq-vf-true:#72db94; --mq-vf-true-soft:#16352a; --mq-vf-true-text:#e4ffec;
  --mq-vf-false:#ff8798; --mq-vf-false-soft:#40232e; --mq-vf-false-text:#fff0f4;
}

.mq-shell[data-skin] .mq-activity-layer {
  background:var(--mq-activity-overlay);
  /* Hotfix 6.27.6 : pas de backdrop-filter sur le panneau pédagogique.
     Dans Android WebView, le flou oblige le GPU à re-rastériser le plateau animé
     pendant l'ouverture et peut produire un bref scintillement / frame drop. */
  backdrop-filter:none; -webkit-backdrop-filter:none;
  animation:none;
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
}
.mq-shell[data-skin] .mq-activity-sheet {
  width:min(500px,100%); max-height:min(700px,100%);
  gap:clamp(10px,1.5vh,14px); padding:clamp(15px,2.4vmin,22px);
  border:1px solid var(--mq-activity-border); border-radius:clamp(20px,4vmin,30px);
  background:var(--mq-activity-surface); color:var(--mq-text);
  box-shadow:var(--mq-activity-shadow);
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
  contain:paint; will-change:transform,opacity;
  animation:mq-activity-enter .22s cubic-bezier(.2,.82,.2,1) both;
}
.mq-shell[data-skin] .mq-activity-sheet > div:first-child {
  padding-bottom:10px; border-bottom:1px solid var(--mq-activity-border);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-sheet-head { gap:10px; }
.mq-shell[data-skin] .mq-activity-sheet .mq-sheet-thumb {
  width:54px; height:54px; padding:6px; border-radius:16px;
  background:var(--mq-activity-accent-soft); color:var(--mq-activity-accent);
  border:1px solid color-mix(in srgb,var(--mq-activity-accent) 26%,var(--mq-activity-border));
  box-shadow:none;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-eyebrow {
  margin:0 0 2px; color:var(--mq-activity-accent); font-size:clamp(.68rem,2.6vw,.78rem);
  letter-spacing:.08em; text-transform:uppercase; font-weight:900;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-sheet-title {
  margin:0; color:var(--mq-text); font-size:clamp(1.08rem,4.4vw,1.4rem); line-height:1.08;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-sheet-body { gap:clamp(10px,1.5vh,14px); overflow-x:hidden; }
.mq-online-challenge-timer {
  width:min(100%,420px); margin-inline:auto; padding:7px 9px 6px;
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:5px 10px;
  border:1px solid color-mix(in srgb,var(--mq-activity-accent) 32%,var(--mq-activity-border)); border-radius:14px;
  background:color-mix(in srgb,var(--mq-activity-accent-soft) 72%,var(--mq-activity-surface)); color:var(--mq-text);
  transition:border-color .2s ease,background .2s ease,color .2s ease;
}
.mq-online-challenge-timer > span { min-width:0; display:flex; align-items:center; gap:6px; font-size:.72rem; font-weight:850; }
.mq-online-challenge-timer > span svg { width:16px; height:16px; flex:0 0 16px; color:var(--mq-activity-accent); }
.mq-online-challenge-timer > strong { min-width:42px; text-align:right; color:var(--mq-activity-accent); font-size:.86rem; font-weight:950; font-variant-numeric:tabular-nums; }
.mq-online-challenge-timer > i { grid-column:1 / -1; height:3px; overflow:hidden; border-radius:999px; background:color-mix(in srgb,var(--mq-activity-border) 62%,transparent); }
.mq-online-challenge-timer > i > u { display:block; width:var(--mq-challenge-left,100%); height:100%; border-radius:inherit; background:var(--mq-activity-accent); transition:width .10s linear,background .2s ease; }
.mq-online-challenge-timer.is-urgent { border-color:color-mix(in srgb,#d84552 62%,var(--mq-activity-border)); background:color-mix(in srgb,#fff0f1 52%,var(--mq-activity-surface)); }
.mq-online-challenge-timer.is-urgent > strong,.mq-online-challenge-timer.is-expired > strong { color:#c52f3d; }
.mq-online-challenge-timer.is-urgent > i > u,.mq-online-challenge-timer.is-expired > i > u { background:#d84552; }
.mq-online-challenge-timer.is-expired > span b::after { content:" · temps écoulé"; }
.mq-shell[data-skin] .mq-question-card {
  padding:clamp(13px,3.4vw,18px); border-radius:18px;
  background:var(--mq-activity-soft); border:1px solid var(--mq-activity-border);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-question {
  margin:0; color:var(--mq-text); font-size:clamp(.98rem,3.8vw,1.16rem); line-height:1.34;
  letter-spacing:-.012em; font-weight:850; text-align:center; overflow-wrap:normal; word-break:normal;
}

.mq-shell[data-skin] .mq-activity-sheet .mq-answers { gap:9px; }
.mq-shell[data-skin] .mq-activity-sheet .mq-answer {
  min-height:52px; margin:0; padding:10px 12px; gap:10px;
  border:1.5px solid var(--mq-activity-border); border-radius:16px;
  background:var(--mq-surface-raised); color:var(--mq-text); box-shadow:none;
  font-size:clamp(.82rem,3.15vw,.98rem); font-weight:800; line-height:1.22;
  transition:transform .16s cubic-bezier(.2,.8,.2,1),border-color .18s ease,background .18s ease,box-shadow .18s ease,opacity .18s ease;
  touch-action:manipulation;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-answer:not(:disabled):hover {
  border-color:var(--mq-border-active); background:var(--mq-activity-accent-soft);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-answer:not(:disabled):active { transform:scale(.985); }
.mq-shell[data-skin] .mq-activity-sheet .mq-answer:focus-visible { outline:3px solid color-mix(in srgb,var(--mq-activity-accent) 34%,transparent); outline-offset:2px; }
.mq-shell[data-skin] .mq-activity-sheet .mq-answer:disabled { cursor:default; }
.mq-shell[data-skin] .mq-activity-sheet .mq-answer b {
  width:32px; height:32px; border-radius:11px; flex:0 0 32px;
  background:var(--mq-activity-accent-soft); color:var(--mq-activity-accent);
  border:1px solid color-mix(in srgb,var(--mq-activity-accent) 22%,var(--mq-activity-border));
  box-shadow:none; font-size:.78rem; font-weight:950;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-answer > span { min-width:0; }
.mq-shell[data-skin] .mq-activity-sheet .mq-answer.is-muted { opacity:.42; }
.mq-shell[data-skin] .mq-activity-sheet .mq-answer.is-right {
  opacity:1; border-color:var(--mq-vf-true); background:var(--mq-vf-true-soft); color:var(--mq-vf-true-text);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--mq-vf-true) 15%,transparent);
  animation:mq-answer-correct .48s cubic-bezier(.2,.88,.25,1);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-answer.is-right b {
  border-color:var(--mq-vf-true); background:var(--mq-vf-true); color:#fff;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-answer.is-wrong {
  opacity:1; border-color:var(--mq-vf-false); background:var(--mq-vf-false-soft); color:var(--mq-vf-false-text);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--mq-vf-false) 13%,transparent);
  animation:mq-answer-wrong .42s ease-out;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-answer.is-wrong b {
  border-color:var(--mq-vf-false); background:var(--mq-vf-false); color:#fff;
}

/* Vrai/Faux : vert et rouge restent sémantiques dans tous les thèmes. */
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answers { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer {
  min-height:64px; justify-content:center; text-align:center; padding:10px;
  font-size:clamp(.94rem,3.8vw,1.08rem); font-weight:950;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer b { width:36px; height:36px; flex-basis:36px; border-radius:50%; font-size:1.1rem; }
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-true {
  border-color:color-mix(in srgb,var(--mq-vf-true) 58%,var(--mq-activity-border));
  background:var(--mq-vf-true-soft); color:var(--mq-vf-true-text);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-true b { color:#fff; background:var(--mq-vf-true); border-color:var(--mq-vf-true); }
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-false {
  border-color:color-mix(in srgb,var(--mq-vf-false) 58%,var(--mq-activity-border));
  background:var(--mq-vf-false-soft); color:var(--mq-vf-false-text);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-false b { color:#fff; background:var(--mq-vf-false); border-color:var(--mq-vf-false); }
/* Le sens Vrai/Faux conserve sa couleur. Le résultat est indiqué par un anneau + pictogramme,
   ce qui évite de transformer visuellement « Faux » en bouton vert lorsqu'il est correct. */
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-right {
  opacity:1; background:inherit; color:inherit;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--mq-success) 40%,transparent),0 8px 20px color-mix(in srgb,var(--mq-success) 12%,transparent);
  animation:mq-answer-correct .48s cubic-bezier(.2,.88,.25,1); position:relative;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-wrong {
  opacity:1; background:inherit; color:inherit;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--mq-error) 38%,transparent);
  animation:mq-answer-wrong .42s ease-out; position:relative;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-right::after,
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-wrong::after {
  position:absolute; right:7px; top:7px; width:20px; height:20px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:.68rem; font-weight:950;
  box-shadow:0 2px 7px rgba(0,0,0,.18);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-right::after { content:"✓"; background:var(--mq-success); }
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-wrong::after { content:"!"; background:var(--mq-error); }
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-true.is-right b,
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-true.is-wrong b { background:var(--mq-vf-true); border-color:var(--mq-vf-true); }
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-false.is-right b,
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer.is-false.is-wrong b { background:var(--mq-vf-false); border-color:var(--mq-vf-false); }
.mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer:not(:disabled):hover { transform:translateY(-1px); }

/* Quiz : une seule hiérarchie visuelle, accent du thème uniquement. */
.mq-shell[data-skin] .mq-activity-sheet .mq-quiz-answer { position:relative; padding-right:36px; }
.mq-shell[data-skin] .mq-activity-sheet .mq-quiz-answer::after {
  content:"›"; position:absolute; right:13px; top:50%; transform:translateY(-52%);
  color:var(--mq-text-muted); font-size:1.35rem; font-weight:500; opacity:.75;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-quiz-answer.is-right::after { content:"✓"; color:var(--mq-vf-true); font-weight:950; }
.mq-shell[data-skin] .mq-activity-sheet .mq-quiz-answer.is-wrong::after { content:"×"; color:var(--mq-vf-false); font-weight:950; }

/* Verdict : compact, lisible, sans seconde fenêtre superposée. */
.mq-shell[data-skin] .mq-activity-sheet .mq-verdict {
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px;
  padding:12px 13px; border-radius:17px; border:1.5px solid; box-shadow:none;
  animation:mq-verdict-enter .34s cubic-bezier(.2,.84,.2,1);
}
.mq-shell[data-skin] .mq-activity-sheet .mq-verdict.is-right { background:var(--mq-vf-true-soft); border-color:var(--mq-vf-true); color:var(--mq-vf-true-text); }
.mq-shell[data-skin] .mq-activity-sheet .mq-verdict.is-wrong { background:var(--mq-vf-false-soft); border-color:var(--mq-vf-false); color:var(--mq-vf-false-text); }
.mq-shell[data-skin] .mq-verdict-main { min-width:0; display:flex; align-items:flex-start; gap:10px; }
.mq-shell[data-skin] .mq-verdict-icon {
  width:34px; height:34px; flex:0 0 34px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; color:#fff; font-size:1.12rem; font-weight:950;
}
.mq-shell[data-skin] .mq-verdict.is-right .mq-verdict-icon { background:var(--mq-vf-true); }
.mq-shell[data-skin] .mq-verdict.is-wrong .mq-verdict-icon { background:var(--mq-vf-false); }
.mq-shell[data-skin] .mq-verdict-copy { min-width:0; }
.mq-shell[data-skin] .mq-activity-sheet .mq-verdict strong { display:block; margin:0 0 2px; color:currentColor; font-size:.96rem; font-weight:950; }
.mq-shell[data-skin] .mq-activity-sheet .mq-verdict p { margin:0; color:currentColor; opacity:.84; font-size:clamp(.72rem,2.8vw,.83rem); line-height:1.36; font-weight:700; }
.mq-shell[data-skin] .mq-activity-sheet .mq-verdict-score {
  white-space:nowrap; padding:6px 9px; border-radius:999px; background:color-mix(in srgb,currentColor 9%,transparent);
  color:currentColor; font-size:.76rem; font-weight:950; font-variant-numeric:tabular-nums;
}
.mq-shell[data-skin] .mq-activity-sheet .mq-sheet-actions { padding-top:0; }
.mq-shell[data-skin] .mq-activity-sheet .mq-activity-continue { min-height:48px; width:100%; border-radius:15px; }

@keyframes mq-activity-enter {
  from { opacity:0; transform:translate3d(0,8px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
.mq-shell[data-skin] .mq-activity-sheet.is-entry-settled { will-change:auto; }
@keyframes mq-answer-correct { 0%{transform:scale(.985)} 45%{transform:scale(1.025)} 100%{transform:scale(1)} }
@keyframes mq-answer-wrong { 0%,100%{transform:translateX(0)} 28%{transform:translateX(-5px)} 54%{transform:translateX(4px)} 76%{transform:translateX(-2px)} }
@keyframes mq-verdict-enter { from { opacity:0; transform:translateY(8px) scale(.985); } to { opacity:1; transform:none; } }

@media (max-width:380px) {
  .mq-shell[data-skin] .mq-activity-sheet { padding:13px; border-radius:22px; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-vf-answers { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer { min-height:58px; gap:7px; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer b { width:32px; height:32px; flex-basis:32px; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-answer { min-height:48px; padding:9px 10px; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-verdict { grid-template-columns:1fr; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-verdict-score { justify-self:start; }
}
@media (max-height:620px) {
  .mq-shell[data-skin] .mq-activity-sheet { gap:8px; padding:11px 13px; }
  .mq-shell[data-skin] .mq-activity-sheet > div:first-child { padding-bottom:7px; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-sheet-thumb { width:44px; height:44px; border-radius:13px; }
  .mq-shell[data-skin] .mq-question-card { padding:10px 12px; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-answer { min-height:44px; padding-block:7px; }
  .mq-shell[data-skin] .mq-activity-sheet .mq-vf-answer { min-height:52px; }
}
.mq-shell[data-motion="calme"] .mq-activity-layer *,
.mq-shell[data-motion="calme"] .mq-activity-layer *::before,
.mq-shell[data-motion="calme"] .mq-activity-layer *::after { animation:none!important; transition-duration:0s!important; }
@media (prefers-reduced-motion:reduce) {
  .mq-shell[data-skin] .mq-activity-layer *,
  .mq-shell[data-skin] .mq-activity-layer *::before,
  .mq-shell[data-skin] .mq-activity-layer *::after { animation:none!important; transition-duration:0s!important; }
}

/* =========================================================================
   MEMOQUEST 6.28.4 — QUI SUIS-JE ? V5 + DÉMARRAGE WORDPRESS FIABILISÉ
   Refonte visuelle complète inspirée du mockup validé.
   Pas de blur animé : transform/opacity uniquement pour Android WebView.
   ========================================================================= */
.mq-shell[data-skin] {
  --mq-who-screen:color-mix(in srgb,var(--mq-bg) 93%,#dff3f0 7%);
  --mq-who-panel:#f8fcfb;
  --mq-who-panel-2:#edf8f6;
  --mq-who-ink:#123f4a;
  --mq-who-muted:#52727a;
  --mq-who-metal:#c9a85d;
  --mq-who-metal-hi:#f2dfa4;
  --mq-who-metal-lo:#9b7936;
  --mq-who-accent:#168b99;
  --mq-who-accent-2:#35c2c8;
  --mq-who-back:radial-gradient(circle at 30% 16%,rgba(125,255,247,.38),transparent 28%),linear-gradient(158deg,#1da5ae 0%,#0f7082 56%,#084a5b 100%);
  --mq-who-mark:#f8e5a7;
  --mq-who-card-frame:#d9c07b;
  --mq-who-answer-surface:#fbfdfb;
  --mq-who-answer-label:#fbfaf4;
  --mq-who-rune:rgba(25,139,153,.18);
  --mq-who-shadow:rgba(9,56,65,.18);
}
.mq-shell[data-skin="ocean"] { --mq-who-screen:#062c47; --mq-who-panel:#082f49; --mq-who-panel-2:#0c3b57; --mq-who-ink:#f2fbff; --mq-who-muted:#b9d7e5; --mq-who-metal:#d4b76e; --mq-who-metal-hi:#fff0b9; --mq-who-metal-lo:#9a7533; --mq-who-accent:#38c6dc; --mq-who-accent-2:#4fe5da; --mq-who-back:radial-gradient(circle at 28% 14%,rgba(150,255,255,.28),transparent 26%),linear-gradient(158deg,#11b9c7 0%,#087ca7 52%,#054d84 100%); --mq-who-answer-surface:#0d415c; --mq-who-answer-label:#0a334d; --mq-who-rune:rgba(88,230,230,.17); --mq-who-shadow:rgba(0,7,18,.42); }
.mq-shell[data-skin="ardoise"] { --mq-who-screen:#0d171d; --mq-who-panel:#17242b; --mq-who-panel-2:#1e3038; --mq-who-ink:#eff9fb; --mq-who-muted:#abc2c9; --mq-who-metal:#86c7cf; --mq-who-metal-hi:#d3f4f6; --mq-who-metal-lo:#477f86; --mq-who-accent:#53d5df; --mq-who-accent-2:#76edf0; --mq-who-back:linear-gradient(158deg,#334851 0%,#20333c 56%,#101c23 100%); --mq-who-answer-surface:#21343d; --mq-who-answer-label:#1a2b33; --mq-who-rune:rgba(95,225,234,.14); --mq-who-shadow:rgba(0,0,0,.44); }
.mq-shell[data-skin="grenat"] { --mq-who-screen:#32101b; --mq-who-panel:#461827; --mq-who-panel-2:#552032; --mq-who-ink:#fff4ec; --mq-who-muted:#e8c8c4; --mq-who-metal:#d5ad6a; --mq-who-metal-hi:#ffe1a8; --mq-who-metal-lo:#8d6533; --mq-who-accent:#e6a6b5; --mq-who-accent-2:#f1c4a4; --mq-who-back:radial-gradient(circle at 28% 14%,rgba(255,231,198,.20),transparent 25%),linear-gradient(158deg,#9d3b55 0%,#72273f 52%,#4a172a 100%); --mq-who-answer-surface:#5b2236; --mq-who-answer-label:#481829; --mq-who-rune:rgba(238,185,172,.15); --mq-who-shadow:rgba(14,1,6,.46); }
.mq-shell[data-skin="ambre"] { --mq-who-screen:#4b2614; --mq-who-panel:#fff7e7; --mq-who-panel-2:#ffedc9; --mq-who-ink:#542c18; --mq-who-muted:#8b6248; --mq-who-metal:#bc7a27; --mq-who-metal-hi:#ffe4a2; --mq-who-metal-lo:#75420e; --mq-who-accent:#d96c23; --mq-who-accent-2:#f1aa3d; --mq-who-back:radial-gradient(circle at 30% 15%,rgba(255,255,220,.30),transparent 24%),linear-gradient(158deg,#f2a33d 0%,#d86b1d 54%,#963d0d 100%); --mq-who-answer-surface:#fff8e9; --mq-who-answer-label:#fff1d2; --mq-who-rune:rgba(201,119,33,.17); --mq-who-shadow:rgba(80,35,7,.22); }
.mq-shell[data-skin="nuit"] { --mq-who-screen:#070d19; --mq-who-panel:#0e1727; --mq-who-panel-2:#131f33; --mq-who-ink:#f5f9ff; --mq-who-muted:#b7c5dd; --mq-who-metal:#d3b366; --mq-who-metal-hi:#ffedac; --mq-who-metal-lo:#85682a; --mq-who-accent:#5dcbe6; --mq-who-accent-2:#91e2f2; --mq-who-back:radial-gradient(circle at 30% 15%,rgba(111,214,244,.18),transparent 24%),linear-gradient(158deg,#1a3151 0%,#111f36 56%,#09111f 100%); --mq-who-answer-surface:#16253c; --mq-who-answer-label:#101c30; --mq-who-rune:rgba(112,220,241,.14); --mq-who-shadow:rgba(0,0,0,.52); }

.mq-shell[data-skin] .mq-who-layer { background:var(--mq-who-screen)!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }
.mq-shell[data-skin] .mq-activity-sheet[data-activity-mode="quisuisje"] {
  width:min(520px,calc(100% - 18px)); max-height:min(820px,calc(100% - 18px)); overflow:hidden;
  padding:clamp(12px,2.1vmin,18px); gap:8px; border:1px solid color-mix(in srgb,var(--mq-who-accent) 34%,var(--mq-who-metal) 22%);
  border-radius:clamp(26px,6vw,38px); background:linear-gradient(180deg,var(--mq-who-panel),var(--mq-who-panel-2));
  box-shadow:0 22px 48px var(--mq-who-shadow),inset 0 1px 0 rgba(255,255,255,.46),inset 0 0 0 1px color-mix(in srgb,var(--mq-who-metal) 18%,transparent);
  color:var(--mq-who-ink); isolation:isolate;
}
.mq-shell[data-skin] .mq-activity-sheet[data-activity-mode="quisuisje"]::before {
  content:""; position:absolute; inset:8px; border-radius:inherit; pointer-events:none; z-index:-1;
  border:1px solid color-mix(in srgb,var(--mq-who-metal) 22%,transparent);
  background:radial-gradient(circle at 50% 34%,color-mix(in srgb,var(--mq-who-accent-2) 7%,transparent),transparent 36%);
}
.mq-shell[data-skin] .mq-activity-sheet[data-activity-mode="quisuisje"] > div:first-child { text-align:center; padding:0 0 4px; }
.mq-shell[data-skin] .mq-activity-sheet[data-activity-mode="quisuisje"] .mq-sheet-body { overflow:visible; padding:0; }
.mq-shell[data-skin] .mq-activity-sheet[data-activity-mode="quisuisje"] .mq-sheet-actions { display:none; }

.mq-who-heading { display:flex; flex-direction:column; align-items:center; gap:3px; position:relative; padding-top:2px; }
.mq-who-crown { width:33px; height:33px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:-3px; color:var(--mq-who-metal-lo); background:linear-gradient(145deg,var(--mq-who-metal-hi),#fff,var(--mq-who-metal)); border:1px solid var(--mq-who-metal); box-shadow:0 5px 12px color-mix(in srgb,var(--mq-who-metal) 25%,transparent); font-size:.94rem; }
.mq-who-badge { display:inline-flex; align-items:center; justify-content:center; min-height:30px; padding:5px 17px; border-radius:12px; background:linear-gradient(180deg,color-mix(in srgb,var(--mq-who-accent) 94%,#fff 6%),color-mix(in srgb,var(--mq-who-accent) 78%,#001 22%)); color:#fff; border:1px solid var(--mq-who-metal); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 4px 10px color-mix(in srgb,var(--mq-who-shadow) 65%,transparent); font-size:.62rem; font-weight:950; letter-spacing:.16em; text-transform:uppercase; }
.mq-who-badge::before,.mq-who-badge::after { content:"✦"; color:var(--mq-who-metal-hi); font-size:.52rem; margin-inline:6px; }
.mq-who-heading .mq-sheet-title { margin:2px 0 0; color:var(--mq-who-ink); font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.72rem,8.6vw,2.55rem); line-height:1; font-weight:800; letter-spacing:-.035em; text-shadow:0 2px 0 color-mix(in srgb,#fff 44%,transparent); }
.mq-shell[data-skin="ocean"] .mq-who-heading .mq-sheet-title,.mq-shell[data-skin="ardoise"] .mq-who-heading .mq-sheet-title,.mq-shell[data-skin="grenat"] .mq-who-heading .mq-sheet-title,.mq-shell[data-skin="nuit"] .mq-who-heading .mq-sheet-title { text-shadow:0 2px 12px color-mix(in srgb,var(--mq-who-accent) 18%,transparent); }
.mq-who-divider { display:block; width:min(230px,62vw); height:8px; margin-top:2px; position:relative; }
.mq-who-divider::before { content:""; position:absolute; left:0; right:0; top:3px; height:1px; background:linear-gradient(90deg,transparent,var(--mq-who-metal),transparent); }
.mq-who-divider::after { content:"◆"; position:absolute; left:50%; top:-4px; transform:translateX(-50%); color:var(--mq-who-metal); font-size:.58rem; }

.mq-who-stage { position:relative; display:flex; flex-direction:column; align-items:center; gap:clamp(8px,1.2vh,13px); min-height:0; width:100%; }
.mq-who-v5 .mq-online-challenge-timer { width:min(100%,310px); padding:5px 8px 5px; border-color:color-mix(in srgb,var(--mq-who-metal) 42%,var(--mq-who-accent)); background:color-mix(in srgb,var(--mq-who-panel) 90%,var(--mq-who-accent) 10%); color:var(--mq-who-ink); border-radius:13px; }
.mq-who-v5 .mq-online-challenge-timer > span { color:var(--mq-who-muted); font-size:.66rem; }
.mq-who-v5 .mq-online-challenge-timer > span svg,.mq-who-v5 .mq-online-challenge-timer > strong { color:var(--mq-who-accent); }
.mq-who-v5 .mq-online-challenge-timer > i { background:color-mix(in srgb,var(--mq-who-metal) 25%,transparent); }
.mq-who-v5 .mq-online-challenge-timer > i > u { background:linear-gradient(90deg,var(--mq-who-accent),var(--mq-who-metal)); }
.mq-who-stage-rune { position:absolute; left:50%; bottom:clamp(90px,16vh,150px); width:min(94%,420px); aspect-ratio:2.3; transform:translateX(-50%); pointer-events:none; opacity:.72; background:radial-gradient(ellipse at center,transparent 0 32%,var(--mq-who-rune) 33% 34%,transparent 35% 44%,var(--mq-who-rune) 45% 46%,transparent 47%),linear-gradient(90deg,transparent 4%,var(--mq-who-rune) 50%,transparent 96%); mask-image:linear-gradient(to bottom,transparent,black 25%,black 75%,transparent); }

.mq-who-mystery-wrap { position:relative; display:flex; align-items:center; justify-content:center; width:100%; min-height:clamp(160px,26vh,224px); }
.mq-who-card { width:clamp(126px,38vw,172px); aspect-ratio:3/4; perspective:1100px; position:relative; z-index:5; flex:0 0 auto; border-radius:18px; box-shadow:0 14px 28px var(--mq-who-shadow),0 0 0 4px color-mix(in srgb,var(--mq-who-metal) 20%,transparent); transform:translate3d(0,0,0) scale(1); transform-origin:center; transition:transform .42s cubic-bezier(.2,.82,.2,1),opacity .2s ease; animation:mq-who-card-breathe 3.8s ease-in-out infinite; }
@keyframes mq-who-card-breathe { 0%,100%{transform:translate3d(0,0,0)} 50%{transform:translate3d(0,-3px,0)} }
.mq-who-card-inner { position:absolute; inset:0; transform-style:preserve-3d; -webkit-transform-style:preserve-3d; transition:transform .58s cubic-bezier(.17,.86,.22,1); }
.mq-who-card.is-revealed .mq-who-card-inner { transform:rotateY(180deg); }
.mq-who-face { position:absolute; inset:0; overflow:hidden; border-radius:inherit; backface-visibility:hidden; -webkit-backface-visibility:hidden; border:2px solid var(--mq-who-card-frame); }
.mq-who-back { display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--mq-who-back); color:var(--mq-who-mark); box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--mq-who-metal-hi) 12%,transparent),inset 0 -18px 28px rgba(0,0,0,.20); }
.mq-who-back::before { content:""; position:absolute; inset:9px; border-radius:14px; border:1px solid color-mix(in srgb,var(--mq-who-metal-hi) 72%,transparent); background:radial-gradient(circle at 50% 45%,transparent 0 31%,color-mix(in srgb,var(--mq-who-metal-hi) 20%,transparent) 32% 33%,transparent 34% 47%,color-mix(in srgb,var(--mq-who-metal-hi) 12%,transparent) 48% 49%,transparent 50%); }
.mq-who-back::after { content:"✦"; position:absolute; left:50%; top:11px; transform:translateX(-50%); color:var(--mq-who-metal-hi); font-size:.68rem; text-shadow:0 0 10px currentColor; }
.mq-who-question { position:relative; z-index:2; width:62%; aspect-ratio:1; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--mq-who-mark); font-family:Georgia,serif; font-size:clamp(4rem,16vw,6.2rem); line-height:1; font-weight:800; background:radial-gradient(circle,color-mix(in srgb,#001 15%,transparent),transparent 67%); border:1px solid color-mix(in srgb,var(--mq-who-metal-hi) 58%,transparent); box-shadow:0 0 0 8px color-mix(in srgb,var(--mq-who-metal-hi) 6%,transparent),0 6px 18px rgba(0,0,0,.18); text-shadow:0 4px 12px rgba(0,0,0,.28); }
.mq-who-back > small { display:none; }
.mq-who-front { transform:rotateY(180deg); display:flex; flex-direction:column; background:var(--mq-who-answer-surface); border-color:var(--mq-who-card-frame); }
.mq-who-front img { width:100%; flex:1 1 auto; min-height:0; object-fit:cover; display:block; }
.mq-who-front strong { flex:0 0 auto; min-height:30px; padding:6px 6px 7px; display:flex; align-items:center; justify-content:center; background:var(--mq-who-answer-label); color:var(--mq-who-ink); font-family:Georgia,serif; font-size:clamp(.68rem,2.6vw,.86rem); font-weight:800; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-top:1px solid color-mix(in srgb,var(--mq-who-metal) 55%,transparent); }

.mq-who-judge { position:absolute; top:50%; width:44px; height:70px; margin-top:-35px; border-radius:22px; display:flex; align-items:center; justify-content:center; opacity:.13; font-size:1.9rem; font-weight:1000; border:1px solid currentColor; transition:opacity .18s ease,transform .28s cubic-bezier(.2,.9,.2,1),box-shadow .28s ease; }
.mq-who-judge-ok { left:max(4px,calc(50% - 142px)); color:var(--mq-vf-true); transform:translateX(-6px) scale(.88); }
.mq-who-judge-no { right:max(4px,calc(50% - 142px)); color:var(--mq-vf-false); transform:translateX(6px) scale(.88); }
.mq-who-layer.is-match-right .mq-who-judge-ok { opacity:1; transform:none; box-shadow:0 0 0 8px color-mix(in srgb,var(--mq-vf-true) 8%,transparent),0 0 25px color-mix(in srgb,var(--mq-vf-true) 30%,transparent); }
.mq-who-layer.is-match-wrong .mq-who-judge-no { opacity:1; transform:none; box-shadow:0 0 0 8px color-mix(in srgb,var(--mq-vf-false) 8%,transparent),0 0 25px color-mix(in srgb,var(--mq-vf-false) 30%,transparent); }

.mq-who-speech { position:relative; width:min(100%,430px); padding:clamp(12px,2.2vh,18px) clamp(20px,5vw,34px); border-radius:20px; background:linear-gradient(180deg,color-mix(in srgb,var(--mq-who-panel) 90%,#fff 10%),var(--mq-who-panel)); border:1px solid color-mix(in srgb,var(--mq-who-metal) 65%,var(--mq-who-accent) 35%); box-shadow:0 9px 18px color-mix(in srgb,var(--mq-who-shadow) 55%,transparent),inset 0 0 0 1px color-mix(in srgb,#fff 38%,transparent); }
.mq-who-speech::before { content:""; position:absolute; left:50%; top:-10px; width:18px; height:18px; transform:translateX(-50%) rotate(45deg); background:var(--mq-who-panel); border-left:1px solid color-mix(in srgb,var(--mq-who-metal) 65%,var(--mq-who-accent) 35%); border-top:1px solid color-mix(in srgb,var(--mq-who-metal) 65%,var(--mq-who-accent) 35%); }
.mq-who-speech::after { content:"✦"; position:absolute; left:50%; bottom:-8px; transform:translateX(-50%); color:var(--mq-who-metal); font-size:.62rem; background:var(--mq-who-panel); padding:0 5px; }
.mq-who-speech-quote { position:absolute; left:12px; top:6px; color:color-mix(in srgb,var(--mq-who-metal) 62%,transparent); font:700 2rem/1 Georgia,serif; }
.mq-who-speech p { position:relative; z-index:1; margin:0; color:var(--mq-who-ink); font-size:clamp(.85rem,3.45vw,1.08rem); line-height:1.32; font-weight:850; text-align:center; text-wrap:balance; }

.mq-who-answers { position:relative; z-index:3; width:100%; max-width:440px; display:grid; gap:clamp(7px,2vw,11px); align-items:start; justify-content:center; }
.mq-who-answers[data-count="1"] { grid-template-columns:minmax(0,120px); max-width:120px; }
.mq-who-answers[data-count="2"] { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:250px; }
.mq-who-answers[data-count="3"] { grid-template-columns:repeat(3,minmax(0,1fr)); }
.mq-who-answers[data-count="4"] { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:306px; }
.mq-who-answers[data-count="5"] { grid-template-columns:repeat(6,minmax(0,1fr)); max-width:342px; }
.mq-who-answers[data-count="5"] .mq-who-answer { grid-column:span 2; }
.mq-who-answers[data-count="5"] .mq-who-answer:nth-child(4) { grid-column:2 / span 2; }
.mq-who-answers[data-count="5"] .mq-who-answer:nth-child(5) { grid-column:4 / span 2; }
.mq-who-answer { min-width:0; min-height:44px; padding:0; border:0; background:transparent; color:inherit; border-radius:18px; touch-action:manipulation; position:relative; z-index:3; transform:translate3d(0,0,0) scale(1); transform-origin:center; transition:transform .42s cubic-bezier(.2,.82,.2,1),opacity .2s ease,filter .2s ease; animation:mq-who-choice-enter .38s cubic-bezier(.18,.82,.25,1) both; animation-delay:calc(var(--who-choice-index,0) * 38ms); }
@keyframes mq-who-choice-enter { from{opacity:0;transform:translate3d(0,10px,0) scale(.96)} to{opacity:1;transform:translate3d(0,0,0) scale(1)} }
.mq-who-answer:focus-visible { outline:3px solid color-mix(in srgb,var(--mq-who-accent) 48%,transparent); outline-offset:4px; }
.mq-who-answer:not(:disabled):active { transform:translateY(2px) scale(.975); }
.mq-who-choice-card { position:relative; display:flex; flex-direction:column; width:100%; aspect-ratio:3/4; overflow:visible; border-radius:18px; border:1px solid var(--mq-who-card-frame); background:var(--mq-who-answer-surface); box-shadow:0 9px 18px var(--mq-who-shadow),inset 0 0 0 3px color-mix(in srgb,#fff 34%,transparent); }
.mq-who-choice-card::before { content:""; position:absolute; inset:4px; z-index:4; pointer-events:none; border-radius:14px; border:1px solid color-mix(in srgb,var(--mq-who-metal-hi) 35%,transparent); }
.mq-who-choice-image { flex:1 1 auto; min-height:0; overflow:hidden; border-radius:16px 16px 0 0; background:color-mix(in srgb,var(--mq-who-accent) 12%,var(--mq-who-panel)); }
.mq-who-choice-image img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .28s ease; }
.mq-who-answer:not(:disabled):active .mq-who-choice-image img { transform:scale(1.025); }
.mq-who-choice-fallback { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--mq-who-accent); font-size:2rem; font-weight:950; }
.mq-who-choice-name { flex:0 0 auto; width:100%; min-height:31px; padding:6px 5px 8px; display:flex; align-items:center; justify-content:center; background:var(--mq-who-answer-label); color:var(--mq-who-ink); font-family:Georgia,serif; font-size:clamp(.60rem,2.55vw,.82rem); line-height:1; font-weight:800; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:clip; border-top:1px solid color-mix(in srgb,var(--mq-who-metal) 50%,transparent); border-radius:0 0 16px 16px; }
.mq-who-choice-gem { position:absolute; z-index:6; bottom:-7px; left:50%; width:18px; height:18px; transform:translateX(-50%); border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(145deg,var(--mq-who-metal-hi),var(--mq-who-metal)); color:var(--mq-who-metal-lo); border:1px solid color-mix(in srgb,var(--mq-who-metal-lo) 55%,transparent); font-size:.48rem; box-shadow:0 3px 7px var(--mq-who-shadow); }
.mq-who-answer:not(:disabled):hover .mq-who-choice-card { border-color:color-mix(in srgb,var(--mq-who-accent) 44%,var(--mq-who-card-frame)); box-shadow:0 12px 24px var(--mq-who-shadow),0 0 0 2px color-mix(in srgb,var(--mq-who-accent) 10%,transparent); }

.mq-who-progress { position:relative; z-index:3; width:min(100%,390px); display:grid; grid-template-columns:auto 1fr; align-items:center; gap:9px; min-height:28px; color:var(--mq-who-muted); }
.mq-who-progress b { min-width:48px; height:28px; padding:0 10px; border-radius:999px; display:flex; align-items:center; justify-content:center; color:var(--mq-who-ink); font:800 .72rem/1 Georgia,serif; background:color-mix(in srgb,var(--mq-who-panel) 88%,var(--mq-who-accent) 12%); border:1px solid color-mix(in srgb,var(--mq-who-metal) 58%,transparent); }
.mq-who-progress > span { height:8px; display:flex; align-items:center; justify-content:space-around; gap:4px; border-radius:999px; padding:0 5px; background:linear-gradient(90deg,color-mix(in srgb,var(--mq-who-accent) 16%,transparent),color-mix(in srgb,var(--mq-who-metal) 15%,transparent)); border:1px solid color-mix(in srgb,var(--mq-who-metal) 32%,transparent); }
.mq-who-progress i { width:7px; height:7px; transform:rotate(45deg); border-radius:2px; background:color-mix(in srgb,var(--mq-who-muted) 32%,transparent); box-shadow:0 0 0 1px color-mix(in srgb,var(--mq-who-metal) 22%,transparent); }
.mq-who-progress i.is-on { background:var(--mq-who-metal-hi); box-shadow:0 0 10px color-mix(in srgb,var(--mq-who-metal-hi) 56%,transparent); }
.mq-who-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* Matching premium : l'arène reste visible pour que ✓/× ne soit jamais masqué par l'opacité du parent. */
.mq-who-match-arena { position:absolute; left:50%; top:45%; width:min(94%,370px); height:210px; transform:translate(-50%,-50%); z-index:12; pointer-events:none; opacity:1; }
.mq-who-match-beam { position:absolute; left:50%; top:50%; width:74%; height:2px; transform:translate(-50%,-50%) scaleX(.2); opacity:0; background:linear-gradient(90deg,transparent,var(--mq-who-metal-hi),transparent); transition:opacity .18s ease,transform .34s ease; }
.mq-who-match-sign { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(.55); width:68px; height:68px; border-radius:50%; display:flex; align-items:center; justify-content:center; opacity:0; color:#fff; font-size:2.6rem; font-weight:1000; border:2px solid color-mix(in srgb,#fff 68%,transparent); box-shadow:0 10px 24px rgba(0,0,0,.24); transition:opacity .16s ease,transform .30s cubic-bezier(.2,1,.2,1),box-shadow .30s ease; }
.mq-who-match-sign::before,.mq-who-match-sign::after { content:""; position:absolute; inset:-9px; border-radius:50%; border:1px solid currentColor; opacity:.34; }
.mq-who-match-sign::after { inset:-18px; opacity:.16; }
.mq-who-layer.is-resolving .mq-who-heading,.mq-who-layer.is-resolving .mq-who-speech,.mq-who-layer.is-resolving .mq-who-progress,.mq-who-layer.is-resolving .mq-who-judge,.mq-who-layer.is-resolving .mq-who-answer:not(.is-selected-choice) { opacity:0; pointer-events:none; transition:opacity .20s ease; }
.mq-who-layer.is-resolving .mq-who-answer { animation:none; }
.mq-who-layer.is-resolving .mq-who-answer.is-selected-choice,.mq-who-layer.is-resolving .mq-who-card.is-match-card { z-index:20; animation:none; }
.mq-who-layer.is-match-arrived .mq-who-card.is-match-card { transform:translate3d(var(--who-match-x),var(--who-match-y),0) scale(var(--who-match-scale)); }
.mq-who-layer.is-match-arrived .mq-who-answer.is-match-choice { transform:translate3d(var(--who-match-x),var(--who-match-y),0) scale(var(--who-match-scale)); }
.mq-who-layer.is-match-arrived .mq-who-match-beam { opacity:.9; transform:translate(-50%,-50%) scaleX(1); }
.mq-who-layer.is-match-right .mq-who-match-sign,.mq-who-layer.is-match-wrong .mq-who-match-sign { opacity:1; transform:translate(-50%,-50%) scale(1); animation:mq-who-sign-pop .38s cubic-bezier(.2,1.18,.28,1); }
@keyframes mq-who-sign-pop { 0%{transform:translate(-50%,-50%) scale(.5)} 72%{transform:translate(-50%,-50%) scale(1.12)} 100%{transform:translate(-50%,-50%) scale(1)} }
.mq-who-layer.is-match-right .mq-who-match-sign { background:var(--mq-vf-true); box-shadow:0 0 0 9px color-mix(in srgb,var(--mq-vf-true) 12%,transparent),0 0 34px color-mix(in srgb,var(--mq-vf-true) 55%,transparent),0 10px 24px rgba(0,0,0,.24); }
.mq-who-layer.is-match-wrong .mq-who-match-sign { background:var(--mq-vf-false); box-shadow:0 0 0 9px color-mix(in srgb,var(--mq-vf-false) 11%,transparent),0 0 34px color-mix(in srgb,var(--mq-vf-false) 50%,transparent),0 10px 24px rgba(0,0,0,.24); }
.mq-who-layer.is-match-right .mq-who-answer.is-selected-choice .mq-who-choice-card { border-color:var(--mq-vf-true); box-shadow:0 0 0 4px color-mix(in srgb,var(--mq-vf-true) 16%,transparent),0 12px 28px rgba(0,0,0,.20); }
.mq-who-layer.is-match-right .mq-who-card.is-match-card .mq-who-face { border-color:var(--mq-vf-true); }
.mq-who-layer.is-match-wrong .mq-who-answer.is-selected-choice .mq-who-choice-card { border-color:var(--mq-vf-false); box-shadow:0 0 0 4px color-mix(in srgb,var(--mq-vf-false) 14%,transparent),0 12px 28px rgba(0,0,0,.20); animation:mq-who-v3-recoil .36s ease-out; }
.mq-who-layer.is-match-wrong .mq-who-card.is-match-card { animation:mq-who-v3-recoil .36s ease-out; }
@keyframes mq-who-v3-recoil { 0%,100%{translate:0 0} 28%{translate:-4px 0} 58%{translate:4px 0} 80%{translate:-1px 0} }
.mq-who-layer.is-match-right .mq-who-card.is-success { filter:drop-shadow(0 0 14px color-mix(in srgb,var(--mq-vf-true) 38%,transparent)); }

@media (max-width:360px) {
  .mq-shell[data-skin] .mq-activity-sheet[data-activity-mode="quisuisje"] { width:calc(100% - 12px); padding:10px; border-radius:25px; }
  .mq-who-crown { width:27px; height:27px; }
  .mq-who-badge { min-height:25px; padding:4px 12px; font-size:.55rem; }
  .mq-who-heading .mq-sheet-title { font-size:1.48rem; }
  .mq-who-mystery-wrap { min-height:147px; }
  .mq-who-card { width:110px; }
  .mq-who-judge { width:36px; height:58px; font-size:1.5rem; }
  .mq-who-judge-ok { left:8px; }.mq-who-judge-no { right:8px; }
  .mq-who-speech { padding:10px 16px; border-radius:16px; }
  .mq-who-speech p { font-size:.80rem; }
  .mq-who-answers { gap:6px; }
  .mq-who-answers[data-count="3"] { max-width:292px; }
  .mq-who-answers[data-count="4"] { max-width:252px; }
  .mq-who-answers[data-count="5"] { max-width:274px; gap:5px; }
  .mq-who-choice-name { min-height:25px; padding:5px 3px 7px; }
  .mq-who-progress { min-height:24px; }
  .mq-who-progress b { height:24px; min-width:44px; }
  .mq-who-match-arena { width:96%; height:178px; top:43%; }
  .mq-who-match-sign { width:60px; height:60px; font-size:2.25rem; }
}
@media (max-height:620px) {
  .mq-shell[data-skin] .mq-activity-sheet[data-activity-mode="quisuisje"] { max-height:calc(100% - 10px); padding:7px 9px; gap:3px; }
  .mq-who-crown { display:none; }
  .mq-who-badge { min-height:21px; padding:3px 9px; font-size:.49rem; }
  .mq-who-heading .mq-sheet-title { font-size:1.22rem; }
  .mq-who-divider { height:5px; margin:0; }
  .mq-who-stage { gap:5px; }
  .mq-who-mystery-wrap { min-height:109px; }
  .mq-who-card { width:82px; }
  .mq-who-back > small { display:none; }
  .mq-who-question { font-size:3.1rem; }
  .mq-who-judge { display:none; }
  .mq-who-speech { padding:7px 12px; border-radius:14px; }
  .mq-who-speech p { font-size:.69rem; line-height:1.22; }
  .mq-who-answers[data-count="3"] { max-width:258px; }
  .mq-who-answers[data-count="4"] { max-width:226px; }
  .mq-who-answers[data-count="5"] { max-width:236px; gap:4px; }
  .mq-who-choice-name { min-height:20px; padding:3px 2px 5px; font-size:.51rem; }
  .mq-who-choice-gem { width:14px; height:14px; bottom:-5px; font-size:.36rem; }
  .mq-who-progress { min-height:20px; gap:5px; }
  .mq-who-progress b { height:20px; min-width:38px; padding:0 7px; font-size:.62rem; }
  .mq-who-progress > span { height:6px; }
  .mq-who-progress i { width:5px; height:5px; }
  .mq-who-match-arena { top:42%; height:135px; }
}
.mq-shell[data-motion="calme"] .mq-who-layer *, .mq-shell[data-motion="calme"] .mq-who-layer *::before, .mq-shell[data-motion="calme"] .mq-who-layer *::after { animation:none!important; transition-duration:0s!important; }
@media (prefers-reduced-motion:reduce) { .mq-who-layer *, .mq-who-layer *::before, .mq-who-layer *::after { animation:none!important; transition-duration:0s!important; } }

/* Qui suis-je ? V4 — progression 1/5 + cadeau dynamique. */
.mq-who-v4 .mq-who-card,.mq-who-v4 .mq-who-choice-card { border-radius:18px; }
.mq-who-v4 .mq-who-face { border-radius:18px; }
.mq-who-v4 .mq-who-back::before { border-radius:14px; inset:4px; }
.mq-who-v4 .mq-who-mystery-wrap { min-height:clamp(158px,25vh,220px); }
.mq-who-v4 .mq-who-progress { width:min(100%,410px); grid-template-columns:auto minmax(0,1fr); gap:8px; }
.mq-who-v4 .mq-who-progress-track { position:relative; min-width:0; height:30px; padding:0 46px 0 10px; display:grid; grid-template-columns:repeat(5,1fr); align-items:center; gap:0; border-radius:999px; background:linear-gradient(90deg,color-mix(in srgb,var(--mq-who-accent) 13%,transparent),color-mix(in srgb,var(--mq-who-metal) 18%,transparent)); border:1px solid color-mix(in srgb,var(--mq-who-metal) 38%,transparent); box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 45%,transparent); }
.mq-who-v4 .mq-who-progress-track::before { content:""; position:absolute; left:14px; right:48px; top:50%; height:2px; transform:translateY(-50%); background:linear-gradient(90deg,color-mix(in srgb,var(--mq-who-accent) 42%,transparent),color-mix(in srgb,var(--mq-who-metal) 42%,transparent)); }
.mq-who-v4 .mq-who-progress-track > i { position:relative; z-index:2; justify-self:center; width:9px; height:9px; border-radius:50%; transform:none; background:color-mix(in srgb,var(--mq-who-muted) 26%,var(--mq-who-panel)); border:1px solid color-mix(in srgb,var(--mq-who-metal) 42%,transparent); transition:transform .24s ease,background .24s ease,box-shadow .24s ease; }
.mq-who-v4 .mq-who-progress-track > i.is-current { transform:scale(1.34); background:var(--mq-who-metal-hi); box-shadow:0 0 0 5px color-mix(in srgb,var(--mq-who-metal-hi) 14%,transparent),0 0 13px color-mix(in srgb,var(--mq-who-metal-hi) 60%,transparent); }
.mq-who-v4 .mq-who-progress-track > i.is-done { background:var(--mq-who-accent-2); box-shadow:0 0 9px color-mix(in srgb,var(--mq-who-accent-2) 50%,transparent); }
.mq-who-gift { position:absolute; z-index:4; right:-3px; top:50%; width:44px; height:44px; transform:translateY(-50%); border-radius:14px; display:flex; align-items:center; justify-content:center; border:1px solid var(--mq-who-metal); box-shadow:0 7px 15px var(--mq-who-shadow),inset 0 1px 0 rgba(255,255,255,.52); transition:background .24s ease,filter .24s ease,transform .24s ease; }
.mq-who-gift-icon { width:26px; height:26px; display:flex; align-items:center; justify-content:center; }
.mq-who-gift-icon svg { width:100%; height:100%; }
.mq-who-gift small { position:absolute; right:-3px; bottom:-12px; min-width:48px; padding:2px 5px; border-radius:999px; display:flex; gap:3px; justify-content:center; align-items:center; background:var(--mq-who-panel); color:var(--mq-who-ink); border:1px solid color-mix(in srgb,var(--mq-who-metal) 45%,transparent); font:800 .48rem/1 system-ui,sans-serif; white-space:nowrap; }
.mq-who-gift small em { font-style:normal; color:var(--mq-who-accent); }
.mq-who-gift.is-perfect { background:linear-gradient(145deg,#fff5b9,#e7b849 60%,#b77912); color:#5d3b00; box-shadow:0 0 0 5px rgba(255,213,74,.11),0 7px 17px rgba(117,75,0,.28); }
.mq-who-gift.is-gold { background:linear-gradient(145deg,#e7fff8,#55d4bf 60%,#158c83); color:#064d4a; }
.mq-who-gift.is-silver { background:linear-gradient(145deg,#f6fbff,#b7cbd6 60%,#718d9c); color:#254352; }
.mq-who-gift.is-bronze { background:linear-gradient(145deg,#ffe5bf,#c98547 60%,#80451d); color:#4b260d; }
.mq-who-gift.is-mini { background:linear-gradient(145deg,#f2eee8,#b8a99c 65%,#766a61); color:#403a36; filter:saturate(.72); }

.mq-who-series-reward { position:absolute; inset:0; z-index:60; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:24px; border-radius:22px; opacity:0; pointer-events:none; transform:scale(.94); background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--mq-who-metal-hi) 25%,transparent),transparent 45%),linear-gradient(180deg,color-mix(in srgb,var(--mq-who-panel) 97%,transparent),color-mix(in srgb,var(--mq-who-panel-2) 97%,transparent)); transition:opacity .26s ease,transform .38s cubic-bezier(.2,1,.2,1); text-align:center; }
.mq-who-layer.is-series-reward .mq-who-series-reward { opacity:1; transform:scale(1); pointer-events:auto; }
.mq-who-layer.is-series-reward .mq-who-stage > :not(.mq-who-series-reward) { opacity:0!important; transition:opacity .18s ease; }
.mq-who-reward-rays { position:absolute; width:210px; height:210px; border-radius:50%; background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--mq-who-metal-hi) 22%,transparent) 0 7deg,transparent 7deg 18deg); mask-image:radial-gradient(circle,black 0 48%,transparent 72%); animation:mq-who-reward-spin 8s linear infinite; }
@keyframes mq-who-reward-spin { to { transform:rotate(360deg); } }
.mq-who-reward-gift { position:relative; z-index:2; width:88px; height:88px; border-radius:28px; display:flex; align-items:center; justify-content:center; color:var(--mq-who-metal-lo); background:linear-gradient(145deg,var(--mq-who-metal-hi),#fff8d4 46%,var(--mq-who-metal)); border:2px solid var(--mq-who-metal); box-shadow:0 0 0 9px color-mix(in srgb,var(--mq-who-metal-hi) 13%,transparent),0 18px 35px var(--mq-who-shadow); animation:mq-who-gift-open .65s cubic-bezier(.2,1.25,.25,1) both; }
.mq-who-reward-gift svg { width:50px; height:50px; }
@keyframes mq-who-gift-open { 0%{transform:translateY(16px) scale(.72) rotate(-7deg);opacity:0} 65%{transform:translateY(-4px) scale(1.08) rotate(3deg);opacity:1} 100%{transform:none;opacity:1} }
.mq-who-series-reward > small { position:relative; z-index:2; font-size:.62rem; font-weight:950; letter-spacing:.16em; color:var(--mq-who-accent); }
.mq-who-series-reward > strong { position:relative; z-index:2; color:var(--mq-who-ink); font:900 clamp(1.2rem,5vw,1.65rem)/1.05 Georgia,serif; }
.mq-who-series-reward > div { position:relative; z-index:2; display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.mq-who-series-reward > div b { min-height:38px; padding:8px 13px; border-radius:14px; display:flex; gap:5px; align-items:center; background:color-mix(in srgb,var(--mq-who-panel) 82%,var(--mq-who-accent) 18%); color:var(--mq-who-ink); border:1px solid color-mix(in srgb,var(--mq-who-metal) 50%,transparent); box-shadow:0 7px 16px var(--mq-who-shadow); }
.mq-who-series-reward > div svg { width:18px; height:18px; }
.mq-who-series-reward.is-perfect .mq-who-reward-gift { box-shadow:0 0 0 10px rgba(255,221,94,.16),0 0 38px rgba(255,201,39,.42),0 18px 35px var(--mq-who-shadow); }
.mq-who-series-reward.is-mini .mq-who-reward-gift { filter:saturate(.68); }
.mq-who-answer.is-eliminated { opacity:0!important; transform:scale(.82)!important; }
.mq-who-answer.is-auto-correct .mq-who-choice-card { border-color:var(--mq-vf-true); }

@media (max-height:620px) {
  .mq-who-v4 .mq-who-gift { width:36px; height:36px; border-radius:11px; }
  .mq-who-v4 .mq-who-gift-icon { width:21px; height:21px; }
  .mq-who-v4 .mq-who-gift small { display:none; }
  .mq-who-v4 .mq-who-progress-track { height:24px; padding-right:38px; }
}

/* ======================================================================
   QUI SUIS-JE ? V5 — carte mystère = carte candidate, cadeau non révélé
   ====================================================================== */
.mq-who-v5 .mq-who-card {
  width:var(--mq-who-mystery-w,120px);
  height:var(--mq-who-mystery-h,160px);
  aspect-ratio:auto;
  border-radius:18px;
  animation:mq-who-card-breathe 3.8s ease-in-out infinite;
}
.mq-who-v5 .mq-who-face,.mq-who-v5 .mq-who-choice-card { border-radius:18px; }
.mq-who-v5:not(.is-card-size-synced) .mq-who-card { opacity:0; }
.mq-who-v5.is-card-size-synced .mq-who-card { opacity:1; }
.mq-who-v5 .mq-who-back::before { inset:4px; border-radius:14px; }
.mq-who-v5 .mq-who-mystery-wrap { min-height:172px; transition:min-height .18s ease; }

/* La progression ne révèle ni le palier, ni les pièces, ni les points. */
.mq-who-v5 .mq-who-progress { width:min(100%,410px); grid-template-columns:auto minmax(0,1fr); gap:8px; }
.mq-who-v5 .mq-who-progress-track {
  position:relative; min-width:0; height:30px; padding:0 42px 0 10px;
  display:grid; grid-template-columns:repeat(5,1fr); align-items:center; gap:0;
  border-radius:999px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--mq-who-accent) 10%,transparent),color-mix(in srgb,var(--mq-who-metal) 14%,transparent));
  border:1px solid color-mix(in srgb,var(--mq-who-metal) 34%,transparent);
  box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 42%,transparent);
}
.mq-who-v5 .mq-who-progress-track::before {
  content:""; position:absolute; left:14px; right:44px; top:50%; height:2px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,color-mix(in srgb,var(--mq-who-accent) 40%,transparent),color-mix(in srgb,var(--mq-who-metal) 38%,transparent));
}
.mq-who-v5 .mq-who-progress-track > i {
  position:relative; z-index:2; justify-self:center; width:9px; height:9px; border-radius:50%;
  background:color-mix(in srgb,var(--mq-who-muted) 25%,var(--mq-who-panel));
  border:1px solid color-mix(in srgb,var(--mq-who-metal) 40%,transparent);
  transition:transform .24s ease,background .24s ease,box-shadow .24s ease;
}
.mq-who-v5 .mq-who-progress-track > i.is-current {
  transform:scale(1.34); background:var(--mq-who-metal-hi);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--mq-who-metal-hi) 13%,transparent),0 0 13px color-mix(in srgb,var(--mq-who-metal-hi) 55%,transparent);
}
.mq-who-v5 .mq-who-progress-track > i.is-done { background:var(--mq-who-accent-2); box-shadow:0 0 9px color-mix(in srgb,var(--mq-who-accent-2) 48%,transparent); }

.mq-who-v5 .mq-who-gift {
  position:absolute; z-index:4; right:-2px; top:50%; width:40px; height:40px;
  display:flex; align-items:center; justify-content:center; border-radius:13px;
  color:var(--mq-who-metal-lo); background:linear-gradient(145deg,var(--mq-who-panel),var(--mq-who-panel-2));
  border:1px solid color-mix(in srgb,var(--mq-who-metal) 48%,transparent);
  box-shadow:0 6px 14px color-mix(in srgb,var(--mq-who-shadow) 62%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 45%,transparent);
  transform:translateY(-50%) scale(.78); opacity:0; pointer-events:none;
  transition:opacity .24s ease,transform .32s cubic-bezier(.2,1,.2,1),filter .24s ease,box-shadow .28s ease;
}
.mq-who-v5 .mq-who-gift-icon { width:23px; height:23px; display:flex; align-items:center; justify-content:center; }
.mq-who-v5 .mq-who-gift-icon svg { width:100%; height:100%; }
.mq-who-v5 .mq-who-gift-lock {
  position:absolute; z-index:2; width:12px; height:12px; right:-3px; top:-4px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:.42rem; color:var(--mq-who-metal-lo);
  background:var(--mq-who-metal-hi); border:1px solid var(--mq-who-metal); box-shadow:0 2px 5px var(--mq-who-shadow);
}
.mq-who-v5 .mq-who-gift.is-locked { opacity:.64; transform:translateY(-50%) scale(.84); filter:saturate(.38); }
.mq-who-v5 .mq-who-gift.is-near { opacity:.84; transform:translateY(-50%) scale(.92); filter:saturate(.62); }
.mq-who-v5 .mq-who-gift.is-ready {
  opacity:1; transform:translateY(-50%) scale(1); filter:none;
  color:var(--mq-who-metal-lo); background:linear-gradient(145deg,var(--mq-who-metal-hi),#fff9df 48%,var(--mq-who-metal));
  box-shadow:0 0 0 6px color-mix(in srgb,var(--mq-who-metal-hi) 12%,transparent),0 7px 18px color-mix(in srgb,var(--mq-who-metal) 30%,transparent);
  animation:mq-who-gift-ready 1.45s ease-in-out infinite;
}
@keyframes mq-who-gift-ready { 0%,100%{transform:translateY(-50%) scale(1)} 50%{transform:translateY(-54%) scale(1.06)} }

/* La valeur réelle n'existe visuellement qu'après le cinquième défi. */
.mq-who-v5 .mq-who-series-reward { border-radius:24px; }
.mq-who-v5 .mq-who-reward-gift {
  width:92px; height:92px; border-radius:28px;
  animation:mq-who-v5-gift-reveal .72s cubic-bezier(.16,1.25,.25,1) both;
}
@keyframes mq-who-v5-gift-reveal {
  0%{transform:translateY(18px) scale(.55) rotate(-8deg);opacity:0}
  58%{transform:translateY(-7px) scale(1.12) rotate(4deg);opacity:1}
  100%{transform:none;opacity:1}
}
.mq-who-v5 .mq-who-series-reward > div b { min-width:120px; justify-content:center; }
.mq-who-reward-note { position:relative; z-index:2; margin:0; color:var(--mq-who-muted); font-size:.68rem; font-weight:750; }

@media (max-width:360px) {
  .mq-who-v5 .mq-who-progress-track { height:26px; padding-right:36px; }
  .mq-who-v5 .mq-who-gift { width:34px; height:34px; border-radius:11px; }
  .mq-who-v5 .mq-who-gift-icon { width:20px; height:20px; }
}
@media (max-height:620px) {
  .mq-who-v5 .mq-who-mystery-wrap { min-height:116px; }
  .mq-who-v5 .mq-who-progress-track { height:22px; padding-right:34px; }
  .mq-who-v5 .mq-who-gift { width:31px; height:31px; border-radius:10px; }
  .mq-who-v5 .mq-who-gift-icon { width:18px; height:18px; }
}

/* =========================================================================
   MEMOQUEST 6.28.4 — CONTRAT RESPONSIVE SMARTPHONE
   Les proportions compactes ne dépendent plus uniquement de la hauteur du
   viewport. Une WebView plein écran et Chrome avec barre d’adresse doivent
   rendre la même interface pour une largeur smartphone <= 480 CSS px.
   ========================================================================= */

/* ================================================================
   MEMOQUEST 6.28.4 — ROUTE DES TROPHÉES / ASCENSION COMPÉTITIVE
   Clone fonctionnel du design validé. Présentation uniquement :
   aucun barème de trophées ou de matchmaking n'est modifié.
   ================================================================ */
.mq-competitive-card[data-competitive-card]{cursor:pointer;outline:none;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease,border-color .2s ease}
.mq-competitive-card[data-competitive-card]:active{transform:scale(.988)}
.mq-competitive-card[data-competitive-card]:focus-visible{box-shadow:0 0 0 3px rgba(31,180,194,.2),0 15px 28px rgba(25,78,133,.12)}
.mq-trophy-road-open{overflow:hidden!important}

/* Couche plein écran : on ne déplace jamais le viewport du jeu. */
.mq-trophy-route-layer,.mq-tier-promotion-layer{position:absolute;inset:0;z-index:1250;display:flex;align-items:stretch;justify-content:center;background:rgba(236,250,253,.98);opacity:1;transition:opacity .24s ease}
.mq-trophy-route-layer.is-closing,.mq-tier-promotion-layer.is-closing{opacity:0;pointer-events:none}
.mq-trophy-route{position:relative;width:min(100%,520px);height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden;background:
 radial-gradient(circle at 85% 6%,rgba(84,201,238,.18),transparent 27%),
 radial-gradient(circle at 7% 94%,rgba(247,196,71,.12),transparent 28%),
 linear-gradient(180deg,#f5fcff 0%,#edf9fb 52%,#fbfdfc 100%);color:#153f58}
.mq-trophy-route:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 0 42%,rgba(255,255,255,.52) 48%,transparent 54%);transform:translateX(-120%);animation:mq-route-sheen 1.2s ease .2s both}
@keyframes mq-route-sheen{to{transform:translateX(120%)}}

/* En-tête identique au mockup validé. */
.mq-trophy-route-head{position:relative;z-index:5;display:grid;grid-template-columns:46px 1fr 46px;align-items:center;padding:12px 16px 9px;min-height:70px}
.mq-trophy-route-head button{width:44px;height:44px;border:1px solid rgba(25,93,125,.08);border-radius:15px;display:grid;place-items:center;color:#14455d;background:rgba(255,255,255,.9);box-shadow:0 8px 20px rgba(27,84,111,.1);-webkit-tap-highlight-color:transparent}
.mq-trophy-route-head button:active{transform:scale(.95)}
.mq-trophy-route-head button svg{width:24px;height:24px;stroke-width:2.2}
.mq-trophy-route-head>div{text-align:center;min-width:0}
.mq-trophy-route-head h2{margin:0;color:#123f59;font-size:1.27rem;line-height:1.05;font-weight:1000;letter-spacing:-.035em}
.mq-trophy-route-head p{margin:4px 0 0;color:#6d8aa2;font-size:.64rem;line-height:1;font-weight:820}.mq-trophy-route-head p span{color:#21aee0}

/* Résumé 3 colonnes. */
.mq-trophy-summary{position:relative;z-index:3;margin:0 16px 10px;padding:12px 10px 10px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;border-radius:24px;background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.96);box-shadow:0 13px 30px rgba(31,92,118,.1),inset 0 1px 0 #fff}
.mq-trophy-summary-cell{min-width:0;display:grid;grid-template-columns:42px 1fr;gap:7px;align-items:center;padding:0 8px;position:relative}
.mq-trophy-summary-cell+ .mq-trophy-summary-cell:before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:1px;background:#e4eef2}
.mq-trophy-summary-cell>span{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(33,110,143,.07)}
.mq-trophy-summary-cell>span svg{width:21px;height:21px}
.mq-trophy-summary-cell.is-trophies>span{color:#eba91d;background:#fff8e5;box-shadow:0 5px 12px rgba(224,162,35,.12)}
.mq-trophy-summary-cell.is-grid>span{background:#f2f9fd}
.mq-trophy-summary-cell.is-next>span{background:#f0fbf2}
.mq-trophy-summary-cell p{min-width:0;margin:0;color:#67839a;font-size:.49rem;line-height:1.12;font-weight:780;white-space:normal}
.mq-trophy-summary-cell p strong{display:block;margin-top:3px;color:#153f58;font-size:.93rem;line-height:1;font-weight:1000;white-space:nowrap;font-variant-numeric:tabular-nums}
.mq-trophy-summary-cell.is-trophies p strong{font-size:1.12rem}.mq-trophy-summary-cell.is-next p strong{color:#269a63;font-size:.66rem;line-height:1.1}
.mq-trophy-summary-cell p strong b{font:inherit}
.mq-trophy-grid-icon{display:grid!important;grid-template-columns:repeat(2,7px);grid-template-rows:repeat(2,7px);gap:2px;place-content:center;color:#258dce}
.mq-trophy-grid-icon i{display:block;width:7px;height:7px;border-radius:2px;background:currentColor;box-shadow:inset 0 1px 0 rgba(255,255,255,.28)}
.mq-target-icon{position:relative;display:block;width:20px;height:20px;border:3px solid #4cb962;border-radius:50%}
.mq-target-icon:before,.mq-target-icon:after{content:"";position:absolute;background:#4cb962;border-radius:2px}.mq-target-icon:before{left:50%;top:-6px;bottom:-6px;width:2px;transform:translateX(-50%)}.mq-target-icon:after{top:50%;left:-6px;right:-6px;height:2px;transform:translateY(-50%)}
.mq-target-icon{box-shadow:inset 0 0 0 4px rgba(76,185,98,.14)}
.mq-trophy-next-line{grid-column:1/-1;margin-top:10px;min-height:37px;padding:7px 10px;display:flex;align-items:center;justify-content:center;gap:7px;border-radius:14px;background:linear-gradient(180deg,#f7fbfd,#f0f8fb);border:1px solid #e6f0f4;color:#67839a}
.mq-trophy-next-line>svg{width:17px;height:17px;color:#5daddb;transform:rotate(-90deg)}
.mq-trophy-next-line p{margin:0;font-size:.57rem;font-weight:760}.mq-trophy-next-line p b,.mq-trophy-next-line p strong{color:#179eae;font-weight:1000}

/* Barre de progression globale. */
.mq-trophy-overall{position:relative;z-index:3;margin:0 18px 8px}
.mq-trophy-overall>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mq-trophy-overall>div:first-child span{color:#64849a;font-size:.58rem;font-weight:900}.mq-trophy-overall>div:first-child b{color:#1399a8;font-size:.66rem;font-weight:1000}
.mq-trophy-overall-bar{height:7px;margin-top:6px;border-radius:99px;overflow:hidden;background:#dcecf0;box-shadow:inset 0 1px 2px rgba(22,77,105,.08)}
.mq-trophy-overall-bar i{display:block;width:var(--road-overall,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#11afb6,#20b8c4,#2099d2);box-shadow:0 0 10px rgba(32,176,190,.28);transform-origin:left;animation:mq-route-progress .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes mq-route-progress{from{transform:scaleX(0)}}
.mq-trophy-overall>p{margin:4px 0 0;color:#718ba0;font-size:.52rem;font-weight:760}.mq-trophy-overall>p b{color:#1495a5;font-size:1.08em}

/* Route : 9 paliers, visibilité par défaut pour éviter tout écran vide. */
.mq-trophy-road-scroll{position:relative;z-index:2;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:7px 14px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.mq-trophy-road-scroll::-webkit-scrollbar{display:none}
.mq-trophy-road-track{position:absolute;left:112px;top:27px;bottom:27px;width:3px;border-radius:99px;background:#d6e8ed;overflow:hidden;pointer-events:none}
.mq-trophy-road-track>span{position:absolute;inset:0}.mq-trophy-road-track>span i{position:absolute;left:0;right:0;bottom:0;height:var(--road-progress,0%);border-radius:99px;background:linear-gradient(0deg,#21c7b8,#27a9cd,#f3bd36);box-shadow:0 0 9px rgba(30,181,187,.34);transform-origin:bottom;animation:mq-route-climb 1s cubic-bezier(.2,.8,.2,1) both}
@keyframes mq-route-climb{from{transform:scaleY(0)}}
.mq-trophy-stage{position:relative;display:grid;grid-template-columns:87px 18px minmax(0,1fr);align-items:center;gap:8px;min-height:48px;margin:0 0 6px;opacity:1;transform:none;transition:transform .36s cubic-bezier(.2,.8,.2,1),opacity .28s ease}
.mq-trophy-route-layer:not(.is-ready) .mq-trophy-stage{opacity:.78;transform:translateY(5px)}
.mq-trophy-threshold{height:43px;padding:0 9px;border-radius:13px;display:flex;align-items:center;justify-content:flex-start;gap:6px;color:#8099ad;background:rgba(255,255,255,.84);border:1px solid rgba(44,108,140,.08);box-shadow:0 5px 12px rgba(30,79,107,.07);font-variant-numeric:tabular-nums}
.mq-trophy-threshold svg{width:16px;height:16px;flex:0 0 auto}.mq-trophy-threshold b{font-size:.67rem;font-weight:1000;white-space:nowrap}
.mq-trophy-stage-dot{position:relative;z-index:3;width:15px;height:15px;border:3px solid #eff9fb;border-radius:50%;display:grid;place-items:center;background:#bdd9e5;box-shadow:0 0 0 1px #9fc7d8}
.mq-trophy-stage-dot svg{width:10px;height:10px;color:white;stroke-width:2.4}
.mq-trophy-format{height:46px;min-width:0;padding:0 11px;display:grid;grid-template-columns:31px minmax(0,1fr) auto;align-items:center;gap:8px;border-radius:14px;background:rgba(255,255,255,.84);border:1px solid rgba(35,100,132,.07);box-shadow:0 5px 12px rgba(27,78,105,.06)}
.mq-trophy-format .mq-trophy-grid-icon{width:30px;height:30px;border-radius:10px;background:#f1f7fb;color:#7a98b3}.mq-trophy-format strong{color:#6e8ba6;font-size:.78rem;line-height:1;font-weight:1000;white-space:nowrap}
.mq-trophy-state{display:flex;align-items:center;gap:4px;justify-content:flex-end;white-space:nowrap;font-size:.45rem;font-weight:1000;letter-spacing:.015em}.mq-trophy-state svg{width:14px;height:14px}
.mq-trophy-state.is-locked{color:#9aaab8}.mq-trophy-state.is-done{color:#41ad7a}.mq-trophy-state.is-current{padding:5px 7px;border-radius:9px;color:white;background:linear-gradient(135deg,#1ab7c3,#23c7b0);box-shadow:0 6px 12px rgba(26,176,183,.2)}
.mq-trophy-stage.is-done .mq-trophy-threshold{color:#45aa7c;background:linear-gradient(180deg,#f7fffb,#eefbf6)}.mq-trophy-stage.is-done .mq-trophy-stage-dot{background:#5bc893;box-shadow:0 0 0 1px #50bb88}.mq-trophy-stage.is-done .mq-trophy-format strong{color:#587c91}
.mq-trophy-stage.is-current .mq-trophy-threshold{color:#11a6ae;border-color:rgba(18,177,184,.34);background:linear-gradient(180deg,#f9ffff,#eafafb);box-shadow:0 7px 17px rgba(21,169,177,.15),0 0 0 2px rgba(30,200,202,.05)}
.mq-trophy-stage.is-current .mq-trophy-stage-dot{background:#1bc3c1;box-shadow:0 0 0 1px #0aa6ad,0 0 0 5px rgba(26,193,194,.11);animation:mq-current-dot 1.7s ease-in-out infinite}
@keyframes mq-current-dot{50%{box-shadow:0 0 0 1px #0aa6ad,0 0 0 9px rgba(26,193,194,.035)}}
.mq-trophy-stage.is-current .mq-trophy-format{border-color:#1bcad0;background:linear-gradient(135deg,#fbffff,#ebfbfb);box-shadow:0 8px 18px rgba(20,169,180,.13),0 0 0 1px rgba(29,208,210,.17)}
.mq-trophy-stage.is-current .mq-trophy-format .mq-trophy-grid-icon{color:#2098cf;background:#effbfe}.mq-trophy-stage.is-current .mq-trophy-format strong{color:#1599aa;font-size:.84rem}
.mq-trophy-stage.is-future{filter:saturate(.75)}

/* Message pédagogique en bas. */
.mq-trophy-route-tip{position:relative;z-index:5;margin:3px 16px 12px;min-height:58px;padding:9px 11px;display:grid;grid-template-columns:38px 1fr;align-items:center;gap:10px;border-radius:18px;background:rgba(248,253,255,.9);border:1px solid rgba(40,139,168,.12);box-shadow:0 8px 20px rgba(31,83,108,.06)}
.mq-trophy-route-tip>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#24c6bc,#259bd3);box-shadow:0 7px 15px rgba(27,153,188,.18)}.mq-trophy-route-tip svg{width:20px;height:20px}
.mq-trophy-route-tip p{margin:0;color:#71899d;font-size:.5rem;line-height:1.27;font-weight:720}.mq-trophy-route-tip b{color:#1b5069;font-size:1.06em;font-weight:1000}

/* ================================================================
   PALIER FRANCHI — écran de célébration premium
   ================================================================ */
.mq-tier-promotion-layer{z-index:1350;align-items:center;padding:12px;background:radial-gradient(circle at 50% 26%,rgba(233,249,255,.96),rgba(231,245,248,.99) 68%)}
.mq-tier-promotion{position:relative;width:min(100%,430px);max-height:96%;overflow:auto;padding:22px 16px 14px;border-radius:29px;text-align:center;background:
 radial-gradient(circle at 50% 25%,rgba(255,223,100,.25),transparent 28%),
 linear-gradient(180deg,#f8fdff,#effafd 55%,#f9fdfc);border:1px solid rgba(255,255,255,.94);box-shadow:0 24px 70px rgba(28,77,103,.2);opacity:1;transform:none;scrollbar-width:none}
.mq-tier-promotion::-webkit-scrollbar{display:none}
.mq-tier-promotion-layer:not(.is-ready) .mq-tier-promotion{opacity:.72;transform:translateY(8px) scale(.985)}
.mq-tier-promotion-layer.is-ready .mq-tier-promotion{transition:opacity .28s ease,transform .55s cubic-bezier(.16,1.15,.3,1)}
.mq-tier-promotion>small{position:relative;z-index:3;display:block;color:#1499a9;font-size:.64rem;letter-spacing:.08em;font-weight:1000}
.mq-tier-promotion>h2{position:relative;z-index:3;margin:4px auto 10px;max-width:340px;color:#123e58;font-size:1.18rem;line-height:1.08;font-weight:1000;letter-spacing:-.03em}
.mq-promotion-rays{position:absolute;left:50%;top:112px;width:235px;height:235px;transform:translate(-50%,-50%);opacity:.48;animation:mq-rays-spin 14s linear infinite;pointer-events:none}.mq-promotion-rays i{position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,200,42,.32) 0 3deg,transparent 3deg 22deg)}
@keyframes mq-rays-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.mq-promotion-cup{position:relative;z-index:2;margin:4px auto 10px;width:86px;height:86px;border-radius:29px;display:grid;place-items:center;color:#fff7d5;background:linear-gradient(145deg,#ffd95f,#eaa019);border:4px solid #fff;box-shadow:0 16px 34px rgba(200,130,20,.27),0 0 0 9px rgba(255,199,52,.11);animation:mq-promotion-pop .65s cubic-bezier(.14,1.32,.25,1) both}.mq-promotion-cup svg{width:46px;height:46px;stroke-width:1.7}
@keyframes mq-promotion-pop{from{transform:translateY(32px) scale(.45) rotate(-10deg);opacity:.15}}
.mq-promotion-cup i{position:absolute;width:6px;height:6px;border-radius:50%;background:#ffd74d;box-shadow:38px -10px 0 #35c8bb,-36px -15px 0 #56a3e4,31px 28px 0 #ff987c,-33px 26px 0 #f8c445;animation:mq-prom-spark .85s ease-in-out infinite alternate}.mq-promotion-cup i+i{transform:rotate(45deg) scale(.72);animation-delay:.22s}@keyframes mq-prom-spark{to{transform:rotate(28deg) scale(1.12)}}
.mq-tier-confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}.mq-confetti-piece{--hue:calc(var(--i)*28deg);position:absolute;left:calc(4% + var(--i)*5.2%);top:-14px;width:6px;height:11px;border-radius:2px;background:hsl(var(--hue) 72% 60%);opacity:.8;transform:rotate(calc(var(--i)*19deg));animation:mq-confetti-fall 2.8s ease-in-out calc(var(--i)*-.12s) infinite}
.mq-confetti-piece:nth-child(3n){width:8px;height:5px;background:#f2bd3d}.mq-confetti-piece:nth-child(3n+1){background:#30b9d2}.mq-confetti-piece:nth-child(3n+2){background:#54c59c}
@keyframes mq-confetti-fall{0%{transform:translateY(-15px) rotate(0deg);opacity:0}12%{opacity:.85}100%{transform:translateY(280px) rotate(300deg);opacity:0}}
.mq-promotion-shift{position:relative;z-index:3;margin:8px auto 10px;display:grid;grid-template-columns:1fr 28px 1fr;gap:7px;align-items:center;max-width:310px}
.mq-promotion-shift article{position:relative;min-height:64px;padding:9px 6px;border-radius:17px;display:flex;align-items:center;justify-content:center;gap:7px;background:rgba(255,255,255,.84);border:1px solid rgba(39,103,135,.08);box-shadow:0 8px 18px rgba(30,77,104,.07)}
.mq-promotion-shift article .mq-trophy-grid-icon{width:31px;height:31px;border-radius:10px;background:#f0f7fb;color:#2a94d3}.mq-promotion-shift article strong{color:#1a4963;font-size:.78rem;font-weight:1000}.mq-promotion-shift>em{color:#17b9b3;font-style:normal}.mq-promotion-shift>em svg{width:22px;height:22px;stroke-width:2.4}
.mq-promotion-shift article.is-new{border-color:#24c8ce;background:linear-gradient(135deg,#fbffff,#ebfbfa);box-shadow:0 8px 20px rgba(27,185,191,.16),0 0 0 2px rgba(40,210,211,.06);animation:mq-new-format 1.35s ease-in-out infinite alternate}.mq-promotion-shift article.is-new strong{color:#149eaa}.mq-promotion-shift article.is-new>b{position:absolute;right:7px;bottom:-7px;padding:3px 6px;border-radius:7px;color:white;background:#19b7c1;font-size:.38rem;font-weight:1000}
@keyframes mq-new-format{to{box-shadow:0 10px 25px rgba(27,185,191,.22),0 0 0 4px rgba(40,210,211,.045)}}
.mq-promotion-details{position:relative;z-index:3;margin:6px 0 10px;padding:2px 11px;border-radius:21px;text-align:left;background:rgba(255,255,255,.9);border:1px solid rgba(38,100,132,.07);box-shadow:0 10px 22px rgba(31,83,108,.07)}
.mq-promotion-details>div{min-height:58px;display:grid;grid-template-columns:38px 1fr;gap:9px;align-items:center;padding:7px 0}.mq-promotion-details>div+div{border-top:1px solid #e8f0f3}
.mq-promotion-details>div>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center}.mq-promotion-details>div>span svg{width:19px;height:19px}.mq-promotion-details .is-gold{color:#df9f16;background:#fff7df}.mq-promotion-details .is-blue{background:#eef8fd}.mq-promotion-details .is-green{background:#f0faf2}
.mq-mini-grid{display:block;width:18px;height:18px;background:linear-gradient(#2799d4 0 0) 0 0/8px 8px no-repeat,linear-gradient(#2799d4 0 0) 100% 0/8px 8px no-repeat,linear-gradient(#2799d4 0 0) 0 100%/8px 8px no-repeat,linear-gradient(#2799d4 0 0) 100% 100%/8px 8px no-repeat}
.mq-promotion-details p{margin:0;color:#6e899d;font-size:.52rem;line-height:1.2;font-weight:740}.mq-promotion-details p strong{display:block;color:#1b4d66;font-size:.66rem;font-weight:1000}.mq-promotion-details p strong b{color:#13a2af}.mq-promotion-details p small{display:block;margin-top:2px;font-size:.48rem;font-weight:720}.mq-promotion-details p>strong+span{display:block;margin-top:1px}.mq-promotion-details .is-green+.mq-target-icon{transform:scale(.8)}
.mq-promotion-primary,.mq-promotion-secondary{position:relative;z-index:3;width:100%;min-height:45px;border-radius:14px;font-size:.69rem;font-weight:1000;-webkit-tap-highlight-color:transparent}
.mq-promotion-primary{border:0;color:white;background:linear-gradient(135deg,#21bfc1,#199bc8);box-shadow:0 11px 22px rgba(24,154,184,.2)}.mq-promotion-secondary{margin-top:7px;border:1px solid rgba(51,107,137,.11);color:#52738c;background:rgba(255,255,255,.82)}
.mq-promotion-primary:active,.mq-promotion-secondary:active{transform:scale(.985)}

/* Thèmes. */
.mq-shell[data-skin="grenat"] .mq-trophy-route,.mq-shell[data-skin="grenat"] .mq-tier-promotion{background:linear-gradient(180deg,#fff9f7,#f8eeee 58%,#fffaf3)}
.mq-shell[data-skin="ardoise"] .mq-trophy-route,.mq-shell[data-skin="ardoise"] .mq-tier-promotion{background:linear-gradient(180deg,#f9fbfc,#ebf1f4 58%,#f8fbfb)}
.mq-shell[data-skin="nuit"] .mq-trophy-route,.mq-shell[data-skin="nuit"] .mq-tier-promotion{background:linear-gradient(180deg,#172439,#101c2e 58%,#142136);color:#edf6ff}.mq-shell[data-skin="nuit"] :is(.mq-trophy-route-head h2,.mq-trophy-summary-cell p strong,.mq-trophy-format strong,.mq-tier-promotion>h2,.mq-promotion-details p strong){color:#edf6ff}.mq-shell[data-skin="nuit"] :is(.mq-trophy-summary,.mq-trophy-threshold,.mq-trophy-format,.mq-trophy-route-tip,.mq-promotion-shift article,.mq-promotion-details){background:rgba(25,40,61,.88);border-color:#33485f}.mq-shell[data-skin="nuit"] :is(.mq-trophy-summary-cell p,.mq-trophy-overall>p,.mq-trophy-route-tip p,.mq-promotion-details p){color:#9fb1c5}

/* Accessibilité / animation calme. */
[data-motion="calme"] :is(.mq-trophy-route:before,.mq-trophy-overall-bar i,.mq-trophy-road-track i,.mq-trophy-stage.is-current .mq-trophy-stage-dot,.mq-promotion-rays,.mq-promotion-cup,.mq-promotion-cup i,.mq-confetti-piece,.mq-promotion-shift article.is-new){animation:none!important}
@media (prefers-reduced-motion:reduce){.mq-trophy-route:before,.mq-trophy-overall-bar i,.mq-trophy-road-track i,.mq-trophy-stage.is-current .mq-trophy-stage-dot,.mq-promotion-rays,.mq-promotion-cup,.mq-promotion-cup i,.mq-confetti-piece,.mq-promotion-shift article.is-new{animation:none!important}}

/* Contrat smartphone : mêmes proportions dans Chrome et dans la WebView. */
@media (max-width:480px), (max-height:700px){
 .mq-trophy-route-head{min-height:62px;padding:9px 13px 7px;grid-template-columns:42px 1fr 42px}.mq-trophy-route-head button{width:40px;height:40px;border-radius:13px}.mq-trophy-route-head h2{font-size:1.14rem}.mq-trophy-route-head p{font-size:.57rem}
 .mq-trophy-summary{margin:0 13px 8px;padding:9px 7px 8px;border-radius:20px}.mq-trophy-summary-cell{grid-template-columns:34px 1fr;gap:5px;padding:0 5px}.mq-trophy-summary-cell>span{width:33px;height:33px}.mq-trophy-summary-cell>span svg{width:18px;height:18px}.mq-trophy-summary-cell p{font-size:.43rem}.mq-trophy-summary-cell p strong{font-size:.78rem}.mq-trophy-summary-cell.is-trophies p strong{font-size:.98rem}.mq-trophy-summary-cell.is-next p strong{font-size:.57rem}.mq-trophy-grid-icon{grid-template-columns:repeat(2,6px);grid-template-rows:repeat(2,6px);gap:2px}.mq-trophy-grid-icon i{width:6px;height:6px}.mq-target-icon{width:17px;height:17px;border-width:2px}.mq-trophy-next-line{margin-top:8px;min-height:32px;padding:5px 7px;border-radius:12px}.mq-trophy-next-line p{font-size:.49rem}
 .mq-trophy-overall{margin:0 15px 6px}.mq-trophy-overall>div:first-child span{font-size:.51rem}.mq-trophy-overall>div:first-child b{font-size:.59rem}.mq-trophy-overall-bar{height:6px;margin-top:5px}.mq-trophy-overall>p{font-size:.46rem}
 .mq-trophy-road-scroll{padding:5px 11px 7px}.mq-trophy-road-track{left:98px;top:25px;bottom:25px}.mq-trophy-stage{grid-template-columns:76px 17px minmax(0,1fr);gap:6px;min-height:44px;margin-bottom:5px}.mq-trophy-threshold{height:39px;padding:0 7px;border-radius:12px;gap:5px}.mq-trophy-threshold svg{width:14px;height:14px}.mq-trophy-threshold b{font-size:.6rem}.mq-trophy-stage-dot{width:13px;height:13px;border-width:3px}.mq-trophy-format{height:41px;padding:0 8px;grid-template-columns:27px minmax(0,1fr) auto;gap:6px;border-radius:12px}.mq-trophy-format .mq-trophy-grid-icon{width:27px;height:27px;border-radius:9px}.mq-trophy-format strong{font-size:.69rem}.mq-trophy-stage.is-current .mq-trophy-format strong{font-size:.74rem}.mq-trophy-state{font-size:.39rem}.mq-trophy-state.is-current{padding:4px 6px}.mq-trophy-state svg{width:12px;height:12px}
 .mq-trophy-route-tip{margin:2px 13px 8px;min-height:50px;padding:7px 9px;grid-template-columns:33px 1fr;gap:8px;border-radius:15px}.mq-trophy-route-tip>span{width:33px;height:33px;border-radius:10px}.mq-trophy-route-tip svg{width:17px;height:17px}.mq-trophy-route-tip p{font-size:.44rem}
 .mq-tier-promotion-layer{padding:9px}.mq-tier-promotion{padding:18px 13px 12px;border-radius:25px}.mq-tier-promotion>small{font-size:.56rem}.mq-tier-promotion>h2{font-size:1.02rem;margin-bottom:8px}.mq-promotion-cup{width:72px;height:72px;border-radius:24px}.mq-promotion-cup svg{width:38px;height:38px}.mq-promotion-rays{top:98px;width:205px;height:205px}.mq-promotion-shift{grid-template-columns:1fr 24px 1fr;max-width:280px}.mq-promotion-shift article{min-height:57px;border-radius:15px}.mq-promotion-shift article strong{font-size:.7rem}.mq-promotion-details>div{min-height:52px;grid-template-columns:34px 1fr}.mq-promotion-details>div>span{width:32px;height:32px}.mq-promotion-details p{font-size:.47rem}.mq-promotion-details p strong{font-size:.59rem}.mq-promotion-primary,.mq-promotion-secondary{min-height:42px;font-size:.63rem}
}

/* =========================================================================
   MEMOQUEST 6.28.7 — PATCH VISUEL ARDOISE + NUIT
   Portée volontairement limitée aux thèmes concernés.
   Aucun comportement de jeu, score, économie ou réseau n'est modifié.
   ========================================================================= */

/* --- ARDOISE : calme visuel, suppression des scintillements/reflets lourds --- */
.mq-shell[data-skin="ardoise"] .mq-ambiance::before {
  opacity:.16;
  animation:none!important;
  transform:none!important;
  will-change:auto;
}
.mq-shell[data-skin="ardoise"] .mq-ambiance i {
  animation:none!important;
  transform:none!important;
  will-change:auto;
  opacity:.58;
}
.mq-shell[data-skin="ardoise"] .mq-ambiance i:nth-child(1) {
  background:linear-gradient(105deg,transparent 18%,rgba(150,230,238,.055) 38%,transparent 57%),linear-gradient(75deg,transparent 31%,rgba(118,198,213,.045) 48%,transparent 65%);
  filter:blur(8px);
}
.mq-shell[data-skin="ardoise"] .mq-ambiance i:nth-child(2) {
  background:radial-gradient(circle,rgba(62,145,166,.065),transparent 66%);
}
.mq-shell[data-skin="ardoise"] .mq-ambiance i:nth-child(3) {
  background:radial-gradient(ellipse,rgba(64,125,142,.055),transparent 67%);
}

.mq-shell[data-skin="ardoise"] .mq-card.is-open .mq-back::after,
.mq-shell[data-skin="ardoise"] .mq-card.is-done .mq-front::before {
  animation-duration:.95s;
}

/* --- NUIT : surfaces de choix réellement sombres et typographie blanche --- */
.mq-shell[data-skin="nuit"] {
  --night-selected:#142238;
  --night-selected-text:#ffffff;
}

.mq-shell[data-skin="nuit"] .mq-carreau[aria-checked="true"]::before {
  background:linear-gradient(180deg,rgba(255,255,255,.065),transparent 23%)!important;
  opacity:.32!important;
}

.mq-shell[data-skin="nuit"] .mq-carreau[aria-checked="true"]::after {
  width:clamp(34px,9.5vw,46px);
  top:clamp(9px,1.25vh,12px);
  right:clamp(9px,2vw,12px);
  border:2px solid rgba(236,249,255,.90)!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E"),linear-gradient(145deg,#69d3ef,#6575df)!important;
  box-shadow:0 4px 10px rgba(0,0,0,.26)!important;
}

/* Champs Nuit : noir propre, texte blanc, reflet minimal. */
.mq-shell[data-skin="nuit"] :is(.mq-promo-entry,.mq-input,.mq-premium-field,input[type="text"],input[type="number"],select,textarea) {
  background:#080f1b!important;
  color:#fff!important;
  border-color:#344963!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 5px 12px rgba(0,0,0,.18)!important;
}
.mq-shell[data-skin="nuit"] :is(.mq-promo-entry,.mq-input,.mq-premium-field,input,textarea)::placeholder {
  color:#8290a8!important;
  opacity:1;
}

/* Dos des cartes Nuit : emblème lune premium réellement rendu. */
.mq-shell[data-skin="nuit"] .mq-back {
  background:
    radial-gradient(circle at 50% 42%,rgba(87,142,205,.10),transparent 42%),
    linear-gradient(160deg,#182740 0%,#101b30 54%,#091321 100%)!important;
  border-color:#9fb6cf!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),inset 0 -12px 22px rgba(0,0,0,.20),0 5px 12px rgba(0,0,0,.28)!important;
}
.mq-shell[data-skin="nuit"] .mq-back::before {
  content:""!important;
  position:absolute!important;
  inset:0!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 20% 22%,rgba(255,255,255,.28) 0 1px,transparent 1.6px),
    radial-gradient(circle at 78% 29%,rgba(156,226,250,.24) 0 1px,transparent 1.7px),
    radial-gradient(circle at 73% 78%,rgba(255,255,255,.20) 0 1px,transparent 1.6px),
    linear-gradient(145deg,rgba(255,255,255,.035),transparent 30%,transparent 74%,rgba(131,220,246,.035))!important;
  filter:none!important;
  opacity:1!important;
}
.mq-shell[data-skin="nuit"] .mq-back::after {
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:36%!important;
  aspect-ratio:1!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%!important;
  pointer-events:none!important;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Ccircle cx='48' cy='48' r='38' stroke='%235c7697' stroke-width='1.5' opacity='.42'/%3E%3Cpath d='M61.5 23.5c-12 4.3-20.5 15.7-20.5 29.1 0 11.8 6.6 22 16.3 27.2-2.9.9-6 1.4-9.2 1.4-17.4 0-31.5-14.1-31.5-31.5S30.7 18.2 48.1 18.2c4.8 0 9.3 1.1 13.4 3v2.3Z' fill='%23dff6ff' opacity='.94'/%3E%3Cpath d='m69 29 2.2 6.8L78 38l-6.8 2.2L69 47l-2.2-6.8L60 38l6.8-2.2L69 29Z' fill='%2388def5'/%3E%3Ccircle cx='72' cy='59' r='2.5' fill='%23eefcff'/%3E%3Ccircle cx='25' cy='28' r='1.8' fill='%239edff3'/%3E%3C/svg%3E")!important;
  opacity:.96!important;
  filter:drop-shadow(0 0 7px rgba(112,202,239,.24))!important;
}
.mq-shell[data-skin="nuit"] .mq-card.is-open .mq-back::after {
  animation:mq-night-premium-emblem .62s ease-out!important;
}
@keyframes mq-night-premium-emblem {
  0% { opacity:.66; transform:translate(-50%,-50%) scale(.92); }
  100% { opacity:.96; transform:translate(-50%,-50%) scale(1); }
}
@media (prefers-reduced-motion:reduce) {
  .mq-shell[data-skin="nuit"] .mq-card.is-open .mq-back::after { animation:none!important; }
}

/* ======================================================================
   MEMOQUEST 6.28.12 — GUIDE ÉVÉNEMENTIEL / MOTION PREMIUM
   Aucun voile ni fond. Entrée/sortie uniquement sur le visuel transparent.
   ====================================================================== */
@keyframes mq-guide-enter-premium {
  0%   { opacity:0; transform:translate(-50%,30px) scale(.90);  }
  52%  { opacity:1; transform:translate(-50%,-5px) scale(1.026);  }
  76%  { opacity:1; transform:translate(-50%,2px) scale(.995); }
  100% { opacity:1; transform:translate(-50%,0) scale(1);  }
}
@keyframes mq-guide-enter-celebration {
  0%   { opacity:0; transform:translate(-50%,34px) scale(.82) rotate(-1.2deg);  }
  45%  { opacity:1; transform:translate(-50%,-7px) scale(1.045) rotate(.5deg);  }
  68%  { transform:translate(-50%,3px) scale(.988) rotate(-.2deg); }
  84%  { transform:translate(-50%,-1px) scale(1.01) rotate(0); }
  100% { opacity:1; transform:translate(-50%,0) scale(1) rotate(0);  }
}
@keyframes mq-guide-enter-soft {
  0%   { opacity:0; transform:translate(-50%,18px) scale(.95);  }
  62%  { opacity:1; transform:translate(-50%,-2px) scale(1.012);  }
  100% { opacity:1; transform:translate(-50%,0) scale(1);  }
}
@keyframes mq-guide-switch-out {
  0%   { opacity:1; transform:translate(-50%,0) scale(1);  }
  100% { opacity:0; transform:translate(-50%,10px) scale(.965);  }
}
@keyframes mq-guide-exit-premium {
  0%   { opacity:1; transform:translate(-50%,0) scale(1);  }
  24%  { opacity:1; transform:translate(-50%,-3px) scale(1.012); }
  100% { opacity:0; transform:translate(-50%,18px) scale(.94);  }
}
.mq-onboarding-layer {
  position:absolute;
  inset:0;
  z-index:38;
  pointer-events:none;
  overflow:hidden;
  background:transparent!important;
  opacity:1;
  -webkit-tap-highlight-color:transparent;
}
.mq-onboarding-art {
  position:absolute;
  z-index:1;
  left:50%;
  bottom:max(0px,env(safe-area-inset-bottom));
  display:block;
  width:min(103vw,940px);
  height:auto;
  max-height:min(43vh,505px);
  object-fit:contain;
  object-position:center bottom;
  opacity:0;
  transform:translate(-50%,30px) scale(.90);
  transform-origin:center bottom;
  /* aucun filtre : blur/drop-shadow animés sur une image de 940 px provoquaient des saccades en pleine partie */
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
  will-change:transform,opacity;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.mq-onboarding-art.is-ready {
  animation:mq-guide-enter-premium .56s cubic-bezier(.16,.84,.24,1) both;
}
/* Les combos rares reçoivent un mouvement plus spectaculaire, mais court. */
.mq-onboarding-layer[data-guide-event="combo3"] .mq-onboarding-art.is-ready,
.mq-onboarding-layer[data-guide-event="combo4"] .mq-onboarding-art.is-ready,
.mq-onboarding-layer[data-guide-event="combo5"] .mq-onboarding-art.is-ready,
.mq-onboarding-layer[data-guide-event="combo6"] .mq-onboarding-art.is-ready {
  animation-name:mq-guide-enter-celebration;
  animation-duration:.66s;
}
/* Erreur et rupture de combo : mouvement plus doux, sans effet de victoire. */
.mq-onboarding-layer[data-guide-event="firstMiss"] .mq-onboarding-art.is-ready,
.mq-onboarding-layer[data-guide-event="comboBreak"] .mq-onboarding-art.is-ready {
  animation-name:mq-guide-enter-soft;
  animation-duration:.46s;
}
.mq-onboarding-art.is-changing-out {
  animation:mq-guide-switch-out .19s cubic-bezier(.4,0,.7,1) both!important;
}
.mq-onboarding-layer.is-leaving .mq-onboarding-art {
  animation:mq-guide-exit-premium .30s cubic-bezier(.4,0,.7,1) both!important;
}
/* Les deux instructions d'action restent légèrement plus grandes. */
.mq-onboarding-layer[data-guide-event="start"] .mq-onboarding-art,
.mq-onboarding-layer[data-guide-event="firstCard"] .mq-onboarding-art {
  width:min(106vw,970px);
  max-height:min(45vh,525px);
}
/* Plus la série devient rare, plus le visuel gagne légèrement en présence. */
.mq-onboarding-layer[data-guide-event="combo4"] .mq-onboarding-art,
.mq-onboarding-layer[data-guide-event="combo5"] .mq-onboarding-art,
.mq-onboarding-layer[data-guide-event="combo6"] .mq-onboarding-art {
  width:min(105vw,965px);
  max-height:min(44vh,520px);
}
.mq-shell[data-motion="calme"] .mq-onboarding-art,
.mq-shell[data-motion="calme"] .mq-onboarding-art.is-ready,
.mq-shell[data-motion="calme"] .mq-onboarding-art.is-changing-out,
.mq-shell[data-motion="calme"] .mq-onboarding-layer.is-leaving .mq-onboarding-art {
  animation:none!important;
  opacity:1;
  transform:translate(-50%,0) scale(1);
  filter:drop-shadow(0 9px 18px rgba(5,31,58,.12));
}
@media (prefers-reduced-motion:reduce) {
  .mq-onboarding-art,
  .mq-onboarding-art.is-ready,
  .mq-onboarding-art.is-changing-out,
  .mq-onboarding-layer.is-leaving .mq-onboarding-art {
    animation:none!important;
    opacity:1;
    transform:translate(-50%,0) scale(1);
    filter:drop-shadow(0 9px 18px rgba(5,31,58,.12));
  }
}
@media (max-height:700px) {
  .mq-onboarding-art { width:min(101vw,790px);max-height:min(38vh,355px); }
  .mq-onboarding-layer[data-guide-event="start"] .mq-onboarding-art,
  .mq-onboarding-layer[data-guide-event="firstCard"] .mq-onboarding-art { width:min(104vw,820px);max-height:min(40vh,375px); }
}
@media (min-width:800px) {
  .mq-onboarding-art { width:min(78vw,960px);max-height:min(44vh,540px); }
  .mq-onboarding-layer[data-guide-event="start"] .mq-onboarding-art,
  .mq-onboarding-layer[data-guide-event="firstCard"] .mq-onboarding-art { width:min(82vw,990px); }
}

/* MEMOQUEST 6.28.12 — CLAVIER / DATE DE NAISSANCE
   Le clavier Android ne doit jamais masquer le champ actif. La WebView est
   redimensionnée nativement; cette règle fournit un fallback scrollable pour
   les claviers OEM et les grands panneaux de suggestions. */
.mq-view[data-view="online"].is-dob-ime .mq-online-center {
  align-items:flex-start;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:6px 3px 12px;
  scrollbar-width:none;
}
.mq-view[data-view="online"].is-dob-ime .mq-online-center::-webkit-scrollbar { display:none; }
.mq-view[data-view="online"].is-dob-ime .mq-online-age-card {
  flex:0 0 auto;
  margin:0 auto;
  scroll-margin-block:14px;
}
.mq-view[data-view="online"].is-dob-ime .mq-dob-field input { scroll-margin-block:18px; }
@media (max-height:700px) {
  .mq-view[data-view="online"].is-dob-ime .mq-online-head { padding-top:0; }
  .mq-view[data-view="online"].is-dob-ime .mq-online-age-card { padding-block:8px;gap:6px; }
  .mq-view[data-view="online"].is-dob-ime .mq-online-age-card p { line-height:1.18; }
}

/* Les photos Nourriture restent la mémoire principale de la carte : plein
   cadre 3:4, aucun filtre, seulement un voile très léger sous le libellé. */
.mq-board[data-category="nourriture"] .mq-front { padding:0;gap:0;background:#2a1710; }
.mq-board[data-category="nourriture"] .mq-front img { position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;filter:none; }
.mq-board[data-category="nourriture"] .mq-front::after {
  content:"";position:absolute;z-index:2;left:0;right:0;bottom:0;height:20%;pointer-events:none;
  background:linear-gradient(180deg,rgba(22,9,3,0),rgba(22,9,3,.42));
}
.mq-board[data-category="nourriture"] .mq-front > .mq-card-name { z-index:3; }

@media (max-width:480px), (max-height:700px) {
  
  
  
  
}

/* =========================================================================
   IMPACT SYSTEM — animations de partie à six paliers (6.28.18)
   Une couche d'effets au-dessus du plateau ; transform/opacity uniquement ;
   palette par thème via variables ; mode calme et reduced-motion respectés.
   ========================================================================= */
.mq-shell {
	--fx-1: var(--turq); --fx-2: var(--bleu); --fx-glow: rgba(46, 134, 224, .55);
	--fx-hot-1: #ffc02e; --fx-hot-2: #ff6a2e; --fx-hot-glow: rgba(255, 138, 61, .6); --fx-ink: #153c7a;
	--fx-conf-a: #ffe08a; --fx-conf-b: #16c4ce; --fx-conf-c: #2e86e0; --fx-conf-d: #ffffff;
	--fx-seg-off: rgba(21, 60, 122, .14);
}
.mq-shell[data-skin="jade"]    { --fx-1:#4fd1b0; --fx-2:#087f8c; --fx-glow:rgba(8,127,140,.5);  --fx-hot-1:#ffd66b; --fx-hot-2:#12b09a; --fx-hot-glow:rgba(79,209,176,.7); --fx-ink:#123c4f; --fx-conf-a:#fff3b0; --fx-conf-b:#7ff0cf; --fx-conf-c:#087f8c; --fx-conf-d:#ffffff; }
.mq-shell[data-skin="ocean"]   { --fx-1:#7ff4ff; --fx-2:#0fa3b4; --fx-glow:rgba(22,196,206,.6);  --fx-hot-1:#e6ffff; --fx-hot-2:#16c4ce; --fx-hot-glow:rgba(127,244,255,.7); --fx-ink:#05596f; --fx-conf-a:#e6ffff; --fx-conf-b:#7ff4ff; --fx-conf-c:#16c4ce; --fx-conf-d:#ffffff; --fx-seg-off:rgba(255,255,255,.16); }
.mq-shell[data-skin="ambre"]   { --fx-1:#ffb457; --fx-2:#c9550c; --fx-glow:rgba(242,113,28,.55); --fx-hot-1:#ffe08a; --fx-hot-2:#ff6a1c; --fx-hot-glow:rgba(255,120,20,.65); --fx-ink:#7c3505; --fx-conf-a:#ffe08a; --fx-conf-b:#ff9d3d; --fx-conf-c:#c9550c; --fx-conf-d:#fff7ea; }
.mq-shell[data-skin="nuit"]    { --fx-1:#83dcf6; --fx-2:#7587ef; --fx-glow:rgba(131,220,246,.55); --fx-hot-1:#c6f0ff; --fx-hot-2:#7587ef; --fx-hot-glow:rgba(117,135,239,.7); --fx-ink:#0a1020; --fx-conf-a:#c6f0ff; --fx-conf-b:#83dcf6; --fx-conf-c:#7587ef; --fx-conf-d:#ffffff; --fx-seg-off:rgba(255,255,255,.14); }
.mq-shell[data-skin="grenat"]  { --fx-1:#efbd82; --fx-2:#c9505b; --fx-glow:rgba(239,189,130,.55); --fx-hot-1:#ffe6c4; --fx-hot-2:#ff5c6b; --fx-hot-glow:rgba(255,120,120,.65); --fx-ink:#3a0812; --fx-conf-a:#ffe6c4; --fx-conf-b:#efbd82; --fx-conf-c:#ff5c6b; --fx-conf-d:#fff5ed; --fx-seg-off:rgba(255,255,255,.14); }
.mq-shell[data-skin="ardoise"] { --fx-1:#65d6df; --fx-2:#3a9fb0; --fx-glow:rgba(101,214,223,.55); --fx-hot-1:#e0fdff; --fx-hot-2:#65d6df; --fx-hot-glow:rgba(101,214,223,.7); --fx-ink:#0f161b; --fx-conf-a:#e0fdff; --fx-conf-b:#65d6df; --fx-conf-c:#3a9fb0; --fx-conf-d:#ffffff; --fx-seg-off:rgba(255,255,255,.14); }

/* ---- jauge de série sous la barre de jeu ---- */
.mq-view[data-view="plateau"] { --mq-heat: 0; }
.mq-impact-bar {
	display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px;
	min-height: 22px; padding: 2px 5px 0;
}
.mq-impact-badge {
	display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 20px; padding: 0 8px;
	border-radius: 999px; font-size: .66rem; font-weight: 950; letter-spacing: -.01em; white-space: nowrap; color: #fff;
	text-shadow: 0 1px 0 rgba(0, 0, 0, .28), 0 0 6px rgba(0, 0, 0, .18);
	background: linear-gradient(120deg, var(--fx-1), var(--fx-2)); box-shadow: 0 3px 10px var(--fx-glow);
	opacity: 0; transform: scale(.6); transition: opacity .25s, transform .35s var(--ressort), background .3s;
}
.mq-impact-badge:empty { visibility: hidden; }
.mq-impact-badge.is-on { opacity: 1; transform: scale(1); }
.mq-impact-bar[data-tier="4"] .mq-impact-badge, .mq-impact-bar[data-tier="5"] .mq-impact-badge, .mq-impact-bar[data-tier="6"] .mq-impact-badge {
	background: linear-gradient(120deg, var(--fx-hot-1), var(--fx-hot-2)); box-shadow: 0 3px 12px var(--fx-hot-glow);
	animation: mq-fx-burn 1.1s ease-in-out infinite;
}
@keyframes mq-fx-burn { 50% { filter: brightness(1.25); } }
.mq-impact-badge.is-pulse { animation: mq-fx-badge-pulse .5s var(--ressort); }
@keyframes mq-fx-badge-pulse { 40% { transform: scale(1.22); } }
.mq-impact-badge.is-break { animation: mq-fx-badge-break .55s var(--ease) forwards; background: linear-gradient(120deg, #ff8f86, var(--rouge)); }
@keyframes mq-fx-badge-break {
	20% { transform: scale(1.15) rotate(-6deg); }
	45% { transform: scale(1.05) rotate(5deg); opacity: 1; }
	100% { transform: scale(.4) translateY(10px) rotate(-14deg); opacity: 0; }
}
.mq-impact-meter { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 3px; min-width: 0; }
.mq-impact-meter i { display: block; height: 5px; border-radius: 999px; background: var(--fx-seg-off); position: relative; overflow: hidden; }
.mq-impact-meter i::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit;
	background: linear-gradient(90deg, var(--fx-1), var(--fx-2));
	transform: scaleX(0); transform-origin: left; transition: transform .4s var(--sortie);
}
.mq-impact-meter i.is-on::after { transform: scaleX(1); }
.mq-impact-meter i.is-hot::after { background: linear-gradient(90deg, var(--fx-hot-1), var(--fx-hot-2)); box-shadow: 0 0 8px var(--fx-hot-glow); }
.mq-impact-meter i.is-next::after { transform: scaleX(1); opacity: .35; animation: mq-fx-next 1s ease-in-out infinite; }
@keyframes mq-fx-next { 50% { opacity: .7; } }
.mq-impact-next { font-size: .6rem; font-weight: 950; color: var(--encre-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Écrans courts : la jauge s'aplatit pour ne rien retirer aux cartes (cible tactile ≥ 44 px conservée). */
@media (max-height: 700px) {
	.mq-impact-bar { min-height: 13px; padding: 0 5px; gap: 6px; }
	.mq-impact-badge { height: 13px; min-width: 24px; padding: 0 6px; font-size: .52rem; }
	.mq-impact-meter i { height: 3px; }
	.mq-impact-next { font-size: .52rem; }
}
@media (max-width: 340px) { .mq-impact-next { display: none; } .mq-impact-bar { grid-template-columns: auto minmax(0, 1fr); } }
/* Très petits téléphones (≤ 600 px de haut) : la jauge disparaît pour rendre chaque pixel aux cartes ; le reste de l'Impact System est conservé. */
@media (max-height: 600px) { .mq-impact-bar { display: none; } }
.mq-impact-next em { font-style: normal; color: var(--encre); }
.mq-shell[data-skin] .mq-impact-next { color: var(--mq-screen-secondary, var(--encre-2)); }
.mq-shell[data-skin] .mq-impact-next em { color: var(--mq-screen-text, var(--encre)); }

/* ---- chips de score ---- */
.mq-score-chip.is-hot { box-shadow: 0 2px 9px rgba(21,60,122,.11), 0 0 0 2px var(--fx-hot-1), 0 0 18px var(--fx-hot-glow); }
.mq-score-chip.is-bump { animation: mq-fx-chip-bump .5s var(--ressort); }
@keyframes mq-fx-chip-bump { 35% { transform: scale(1.14); } }
.mq-score-chip.is-hit { animation: mq-fx-chip-hit .45s var(--ease); }
@keyframes mq-fx-chip-hit { 25% { transform: translateX(-3px); } 55% { transform: translateX(3px); } }

/* ---- couches d'ambiance dans le cadre du plateau ---- */
.mq-fx-aura {
	position: absolute; inset: -10%; pointer-events: none; z-index: 0; border-radius: inherit;
	opacity: var(--mq-heat); transition: opacity .6s;
	background: radial-gradient(ellipse at 50% 40%, transparent 40%, var(--fx-hot-glow) 100%);
	animation: mq-fx-aura 2.6s ease-in-out infinite;
}
@keyframes mq-fx-aura { 50% { transform: scale(1.04); } }
.mq-fx-heat {
	position: absolute; inset: 0; pointer-events: none; z-index: 0; border-radius: inherit;
	opacity: var(--mq-heat); transition: opacity .45s;
	box-shadow: inset 0 0 0 2px var(--fx-hot-1), inset 0 0 30px 6px var(--fx-hot-glow);
}
.mq-fx-flash {
	position: absolute; inset: 0; pointer-events: none; z-index: 5; border-radius: inherit; opacity: 0;
	background: radial-gradient(circle at 50% 45%, var(--fx-hot-glow), transparent 62%);
}
.mq-fx-flash.is-on { animation: mq-fx-flash .55s var(--sortie); }
@keyframes mq-fx-flash { 12% { opacity: 1; } 100% { opacity: 0; } }
.mq-fx-miss { position: absolute; inset: 0; pointer-events: none; z-index: 5; border-radius: inherit; opacity: 0; box-shadow: inset 0 0 40px 10px rgba(240, 68, 56, .45); }
.mq-fx-miss.is-on { animation: mq-fx-miss .6s var(--sortie); }
@keyframes mq-fx-miss { 15% { opacity: 1; } 100% { opacity: 0; } }
.mq-fx-layer { position: absolute; inset: 0; pointer-events: none; z-index: 6; }

/* ---- tremblement du plateau (×4+) ---- */
.mq-board.is-shake-1 { animation: mq-fx-shake .42s var(--ease); --amp: 2px; }
.mq-board.is-shake-2 { animation: mq-fx-shake .48s var(--ease); --amp: 4px; }
.mq-board.is-shake-3 { animation: mq-fx-shake .55s var(--ease); --amp: 6px; }
@keyframes mq-fx-shake {
	15% { transform: translate(var(--amp), calc(var(--amp) * -.6)); }
	35% { transform: translate(calc(var(--amp) * -1), calc(var(--amp) * .5)); }
	55% { transform: translate(calc(var(--amp) * .7), calc(var(--amp) * .4)); }
	75% { transform: translate(calc(var(--amp) * -.5), calc(var(--amp) * -.3)); }
}

/* ---- gain à paliers ---- */
.mq-fx-gain {
	position: absolute; left: 0; top: 0; transform: translate(-50%, -50%);
	font-weight: 950; letter-spacing: -.045em; line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums;
	color: #fff; -webkit-text-stroke: 2px var(--fx-ink); paint-order: stroke fill;
	text-shadow: 0 3px 0 var(--fx-ink), 0 10px 22px var(--fx-glow), 0 0 18px var(--fx-1);
	animation: mq-fx-gain 1.15s var(--sortie) forwards; --dy: -46px;
}
.mq-fx-gain.is-t1 { font-size: clamp(22px, 7vmin, 32px); }
.mq-fx-gain.is-t2 { font-size: clamp(26px, 8.5vmin, 38px); --dy: -54px; }
.mq-fx-gain.is-t3 { font-size: clamp(30px, 10vmin, 46px); --dy: -62px; color: var(--fx-hot-1); text-shadow: 0 3px 0 var(--fx-ink), 0 10px 22px var(--fx-hot-glow), 0 0 20px var(--fx-hot-2); }
.mq-fx-gain.is-t4 { font-size: clamp(34px, 11.5vmin, 54px); --dy: -70px; }
.mq-fx-gain.is-t5 { font-size: clamp(38px, 13vmin, 60px); --dy: -76px; }
.mq-fx-gain.is-t6 { font-size: clamp(44px, 15vmin, 68px); --dy: -84px; }
.mq-fx-gain.is-t4, .mq-fx-gain.is-t5, .mq-fx-gain.is-t6 { color: var(--fx-hot-1); -webkit-text-stroke: 3px var(--fx-ink); text-shadow: 0 4px 0 var(--fx-ink), 0 12px 26px var(--fx-hot-glow), 0 0 26px var(--fx-hot-2); }
@keyframes mq-fx-gain {
	0% { opacity: 0; transform: translate(-50%, -50%) translateY(14px) scale(.35); }
	14% { opacity: 1; transform: translate(-50%, -50%) translateY(-10px) scale(1.28); }
	26% { transform: translate(-50%, -50%) translateY(-14px) scale(1); }
	70% { opacity: 1; transform: translate(-50%, -50%) translateY(calc(var(--dy) * .6)) scale(1); }
	100% { opacity: 0; transform: translate(-50%, -50%) translateY(var(--dy)) scale(.9); }
}
@keyframes mq-fx-calm {
	0% { opacity: 0; transform: translate(-50%, -50%) translateY(6px); }
	20% { opacity: 1; transform: translate(-50%, -50%); }
	100% { opacity: 0; transform: translate(-50%, -50%) translateY(-20px); }
}
.mq-fx-fly {
	position: absolute; left: 0; top: 0; font-weight: 950; color: #fff; font-size: 15px; padding: 3px 9px; border-radius: 999px;
	background: linear-gradient(120deg, var(--fx-1), var(--fx-2)); box-shadow: 0 4px 12px var(--fx-glow); will-change: transform, opacity;
}
.mq-fx-fly.is-hot { background: linear-gradient(120deg, var(--fx-hot-1), var(--fx-hot-2)); box-shadow: 0 4px 12px var(--fx-hot-glow); }
.mq-fx-fly.is-ghost { padding: 0; width: 10px; height: 10px; border-radius: 50%; opacity: .7; }

/* ---- scellement : balayage lumineux synchrone sur les deux cartes ---- */
.mq-fx-sweep {
	position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); border-radius: clamp(9px, 2vmin, 18px); overflow: hidden;
	pointer-events: none;
}
.mq-fx-sweep::before {
	content: ""; position: absolute; inset: -40%;
	background: linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, .85) 50%, transparent 60%);
	transform: translateX(-70%); animation: mq-fx-sweep .7s var(--ease) .12s forwards;
}
@keyframes mq-fx-sweep { to { transform: translateX(70%); } }
.mq-fx-sweep.is-hot::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 3px var(--fx-hot-1); opacity: 0; animation: mq-fx-rim .9s var(--ease) .1s; }
@keyframes mq-fx-rim { 30% { opacity: 1; } 100% { opacity: 0; } }

/* ---- anneaux, particules, rayons, étincelles ---- */
.mq-fx-ring { position: absolute; left: 0; top: 0; width: 24px; height: 24px; margin: -12px 0 0 -12px; border-radius: 50%; border: 4px solid var(--fx-1); animation: mq-fx-ring .74s var(--sortie) forwards; will-change: transform, opacity; }
.mq-fx-ring.is-hot { border-color: var(--fx-hot-1); }
.mq-fx-ring.is-b { animation-delay: .12s; }
@keyframes mq-fx-ring { 0% { opacity: .9; transform: scale(.4); } 100% { opacity: 0; transform: scale(9); } }
.mq-fx-dot {
	position: absolute; left: 0; top: 0; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%;
	background: radial-gradient(circle at 40% 35%, #fff, var(--fx-1)); box-shadow: 0 0 10px var(--fx-glow);
	animation: mq-fx-dot .78s var(--sortie) forwards; will-change: transform, opacity;
}
.mq-fx-dot.is-hot { background: radial-gradient(circle at 40% 35%, #fff, var(--fx-hot-2)); box-shadow: 0 0 12px var(--fx-hot-glow); }
@keyframes mq-fx-dot {
	0% { opacity: 1; transform: rotate(calc(var(--a) * 1deg)) translateY(0) scale(1.3); }
	100% { opacity: 0; transform: rotate(calc(var(--a) * 1deg)) translateY(calc(var(--d) * -1px)) scale(.2); }
}
.mq-fx-rays {
	position: absolute; left: 0; top: 0; width: 260px; height: 260px; margin: -130px 0 0 -130px; border-radius: 50%;
	background: repeating-conic-gradient(from 0deg, var(--fx-hot-1) 0 5deg, transparent 5deg 24deg);
	-webkit-mask: radial-gradient(circle, #000 18%, transparent 66%); mask: radial-gradient(circle, #000 18%, transparent 66%);
	opacity: 0; animation: mq-fx-rays .8s var(--sortie) forwards; will-change: transform, opacity;
}
@keyframes mq-fx-rays { 0% { opacity: 0; transform: scale(.3); } 20% { opacity: .95; } 100% { opacity: 0; transform: scale(1.25) rotate(28deg); } }
.mq-fx-ember {
	position: absolute; left: 0; top: 0; width: 5px; height: 12px; margin: -6px 0 0 -2px; border-radius: 3px;
	background: linear-gradient(180deg, #fff, var(--fx-hot-2)); opacity: 0;
	animation: mq-fx-ember var(--dur) ease-out var(--delay) forwards; will-change: transform, opacity;
}
@keyframes mq-fx-ember { 15% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--dx), -140px) scale(.3) rotate(120deg); } }

/* ---- bannière combo ---- */
.mq-fx-combo {
	position: absolute; left: 50%; top: 44%; width: 100%; transform: translate(-50%, -50%);
	font-weight: 950; letter-spacing: -.05em; line-height: .95; text-align: center; white-space: nowrap;
	font-size: clamp(28px, 9vmin, 50px); color: #fff; -webkit-text-stroke: 2.5px var(--fx-ink); paint-order: stroke fill;
	text-shadow: 0 4px 0 var(--fx-ink), 0 12px 26px var(--fx-glow), 0 0 22px var(--fx-1);
	animation: mq-fx-combo 1.15s var(--sortie) forwards;
}
.mq-fx-combo small { display: block; font-size: .34em; letter-spacing: .12em; font-weight: 900; margin-top: 6px; color: #fff; -webkit-text-stroke: 1px var(--fx-ink); text-shadow: 0 2px 0 var(--fx-ink); }
.mq-fx-combo.is-hot { font-size: clamp(34px, 11.5vmin, 62px); color: var(--fx-hot-1); -webkit-text-stroke: 3px var(--fx-ink); text-shadow: 0 4px 0 var(--fx-ink), 0 14px 30px var(--fx-hot-glow), 0 0 28px var(--fx-hot-2); }
@keyframes mq-fx-combo {
	0% { opacity: 0; transform: translate(-50%, -50%) scale(.3) rotate(-8deg); letter-spacing: .2em; }
	18% { opacity: 1; transform: translate(-50%, -50%) scale(1.18) rotate(2deg); letter-spacing: -.05em; }
	32% { transform: translate(-50%, -50%) scale(1) rotate(0); }
	74% { opacity: 1; transform: translate(-50%, -50%) scale(1.02); }
	100% { opacity: 0; transform: translate(-50%, -70%) scale(.94); }
}

/* ---- malus ---- */
.mq-fx-malus {
	position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); font-weight: 950; font-size: clamp(18px, 6vmin, 26px);
	color: #fff; -webkit-text-stroke: 1.5px #a3231a; filter: drop-shadow(0 4px 10px rgba(240, 68, 56, .5));
	animation: mq-fx-malus .95s var(--ease) forwards;
}
@keyframes mq-fx-malus {
	0% { opacity: 0; transform: translate(-50%, -50%) translateY(-6px) scale(.6); }
	15% { opacity: 1; transform: translate(-50%, -50%) scale(1.1); }
	100% { opacity: 0; transform: translate(-50%, -50%) translateY(38px) scale(.9); }
}

/* ---- Impact System : le bouton « Refaire une partie » reçoit un reflet
   périodique qui invite à relancer, sans transformer le bouton (le retour
   tactile :active reste intact). Coupé en mode calme et reduced-motion. ---- */
.mq-final-replay { position: relative; overflow: hidden; }
.mq-final-replay:not(.is-loading):not(.is-waiting)::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
	background: linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, .42) 50%, transparent 60%);
	transform: translateX(-120%); will-change: transform;
	animation: mq-fx-cta-sheen 2.4s ease-in-out 1.2s infinite;
}
@keyframes mq-fx-cta-sheen { 40%, 100% { transform: translateX(120%); } }
.mq-shell[data-motion="calme"] .mq-final-replay::before { animation: none; display: none; }
@media (prefers-reduced-motion: reduce) { .mq-shell .mq-final-replay::before { animation: none; display: none; } }

/* =========================================================================
   ÉCRAN DE RÉSULTAT DE DUEL — chorégraphie premium (6.28.23)
   ========================================================================= */
.mq-res-page { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(6px, 1.1vh, 10px); align-content: start; padding-top: 6px !important; }
.mq-res-page > * { min-width: 0; }
.mq-res-page { --res-win: #1f9d55; --res-win-2: #5fd48a; --res-loss: #e5484d; --res-loss-2: #ff8a8f; --res-accent: #2e86e0; --res-accent-2: #16c4ce; --res-glow: rgba(46, 134, 224, .45); }
.mq-res-rays { position: absolute; inset: 0; pointer-events: none; z-index: 0; opacity: 0; overflow: hidden; background-size: 260% 260%; background-position: 50% 0; transform: rotate(-8deg) scale(.9); background-image: conic-gradient(from 200deg at 50% 20%, transparent 0 35%, rgba(255, 255, 255, .22) 40%, transparent 45%, transparent 55%, rgba(255, 255, 255, .16) 60%, transparent 65%); }
.mq-res-page.is-on .mq-res-rays { animation: mq-res-rays 3.2s var(--ease) .1s forwards; }
@keyframes mq-res-rays { 20% { opacity: 1; } 100% { opacity: 0; transform: rotate(10deg) scale(1.15); } }
.mq-res-page.is-loss .mq-res-rays { background-image: conic-gradient(from 200deg at 50% 20%, transparent 0 35%, rgba(255, 255, 255, .12) 40%, transparent 45%); }
}
.mq-res-dust { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.mq-res-page.is-loss .mq-res-dust::before, .mq-res-page.is-loss .mq-res-dust::after { content: ""; position: absolute; left: 12%; top: 110%; width: 5px; height: 5px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .95), rgba(255, 255, 255, 0) 70%); animation: mq-res-dust 12s linear infinite; }
.mq-res-page.is-loss .mq-res-dust::after { left: 78%; width: 4px; height: 4px; animation-duration: 15s; animation-delay: -6s; }
@keyframes mq-res-dust { 10% { opacity: .8; } 90% { opacity: .4; } 100% { transform: translateY(-140vh); opacity: 0; } }

/* titre mot à mot */
.mq-res-head { position: relative; z-index: 1; text-align: center; padding: 0 4px; }
.mq-res-title { margin: 0; font-size: clamp(19px, 5.6vw, 26px); font-weight: 950; letter-spacing: -.03em; line-height: 1.05; color: var(--result-deep); }
.mq-res-word { display: inline-block; opacity: 0; transform: translateY(18px) rotate(2deg); filter: blur(4px); }
.mq-res-page.is-on .mq-res-word { animation: mq-res-word .6s var(--sortie) forwards; animation-delay: calc(var(--i) * 70ms + 120ms); }
@keyframes mq-res-word { to { opacity: 1; transform: none; filter: none; } }
.mq-res-page.is-on .mq-res-subtitle { margin: 4px 0 0; font-size: clamp(.62rem, 2.7vw, .74rem); font-weight: 700; color: #58739a; line-height: 1.3; opacity: 0; }
.mq-res-page.is-on .mq-res-subtitle { animation: mq-res-fade-up .6s var(--sortie) .9s forwards; }
@keyframes mq-res-fade-up { to { opacity: 1; transform: none; } }

/* cartes */
.mq-res-card { position: relative; z-index: 1; background: rgba(255, 255, 255, .92); border: 1px solid rgba(255, 255, 255, .85); border-radius: clamp(20px, 5vw, 26px); box-shadow: 0 10px 30px rgba(21, 60, 122, .12); opacity: 0; transform: translateY(24px) scale(.97); }
.mq-res-page.is-on .mq-res-card { animation: mq-res-card-in .7s var(--sortie) forwards; animation-delay: var(--t, 0s); }
@keyframes mq-res-card-in { to { opacity: 1; transform: none; } }
.mq-res-reward-wrap { background: none; border: 0; box-shadow: none; }
.mq-res-actions-wrap { background: none; border: 0; box-shadow: none; }

/* arène */
.mq-res-arena { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr); align-items: center; gap: 6px; padding-top: 12px; }
.mq-res-side { position: relative; background: rgba(255, 255, 255, .92); border: 1px solid rgba(255, 255, 255, .85); border-radius: clamp(18px, 5vw, 24px); padding: 16px 8px 12px; text-align: center; box-shadow: 0 10px 30px rgba(21, 60, 122, .12); overflow: visible; opacity: 0; transition: filter .6s, box-shadow .6s; }
.mq-res-side.is-player { transform: translateX(-30px); }
.mq-res-side.is-opponent { transform: translateX(30px); }
.mq-res-page.is-on .mq-res-side { animation: mq-res-side-in .75s var(--sortie) forwards; animation-delay: calc(.35s + var(--i) * .12s); }
@keyframes mq-res-side-in { to { opacity: 1; transform: none; } }
.mq-res-side em { display: block; font-style: normal; font-size: clamp(.8rem, 3.4vw, .95rem); font-weight: 900; color: #3f6084; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mq-res-side small { display: block; font-size: clamp(.56rem, 2.4vw, .66rem); letter-spacing: .14em; font-weight: 950; color: #3f6084; margin-top: 2px; }
.mq-res-bgstar { position: absolute; right: 8%; bottom: 6%; width: 46%; opacity: .08; pointer-events: none; color: var(--result-deep); }
.mq-res-page.is-on .mq-res-side.is-winner { box-shadow: 0 10px 30px rgba(21, 60, 122, .12), 0 0 0 3px var(--res-win-2), 0 0 34px rgba(95, 212, 138, .45); }
.mq-res-page.is-on .mq-res-side.is-loser { filter: saturate(.75) brightness(.97); }
.mq-res-page.is-draw.is-on .mq-res-side { box-shadow: 0 10px 30px rgba(21, 60, 122, .12), 0 0 0 3px var(--res-accent-2); }
.mq-res-badge { position: absolute; left: 50%; top: -14px; transform: translate(-50%, -30px) scale(.4); opacity: 0; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; color: #fff; font-size: clamp(.62rem, 2.8vw, .74rem); font-weight: 950; letter-spacing: .06em; white-space: nowrap; background: linear-gradient(120deg, var(--res-win-2), var(--res-win)); box-shadow: 0 8px 18px rgba(31, 157, 85, .45); z-index: 2; }
.mq-res-badge svg { width: 15px; height: 15px; }
.mq-res-badge.is-on { animation: mq-res-badge .7s cubic-bezier(.22, 1.6, .36, 1) forwards; }
@keyframes mq-res-badge { to { opacity: 1; transform: translate(-50%, 0) scale(1); } }
.mq-res-badge::after { content: ""; position: absolute; inset: -6px; border-radius: inherit; border: 2px solid var(--res-win-2); opacity: 0; }
.mq-res-badge.is-on::after { animation: mq-res-ring .8s var(--sortie) .55s; }
@keyframes mq-res-ring { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(1.7); } }
.mq-res-vs { position: relative; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; font-weight: 950; color: var(--result-deep); background: rgba(255, 255, 255, .92); border: 3px solid rgba(22, 196, 206, .45); box-shadow: 0 8px 20px rgba(21, 60, 122, .18); opacity: 0; transform: scale(.3) rotate(-30deg); z-index: 1; }
.mq-res-page.is-on .mq-res-vs { animation: mq-res-pop-in .8s cubic-bezier(.22, 1.6, .36, 1) .5s forwards; }
@keyframes mq-res-pop-in { to { opacity: 1; transform: none; } }
.mq-res-vs::before { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--res-accent-2); opacity: 0; }
.mq-res-page.is-on .mq-res-vs::before { animation: mq-res-ring 1s var(--sortie) 1.1s; }

/* odomètre */
.mq-res-odo { display: inline-flex; height: 1em; line-height: 1; font-size: clamp(36px, 11vw, 50px); font-weight: 950; letter-spacing: -.05em; overflow: hidden; font-variant-numeric: tabular-nums; margin: 4px 0 2px; color: var(--result-deep); }
.mq-res-col { position: relative; height: 1em; width: .62em; overflow: hidden; }
.mq-res-col i { position: absolute; left: 0; top: 0; width: 100%; display: grid; font-style: normal; transform: translateY(0); transition: transform var(--dur, 1.3s) var(--ease); }
.mq-res-col i b { display: block; height: 1em; text-align: center; }
.mq-res-side.is-winner .mq-res-odo { color: var(--res-win); }

/* notes */
.mq-res-ratings { display: grid; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr); align-items: start; padding: 10px 6px 8px; gap: 4px; }
.mq-res-rating-col { text-align: center; display: grid; gap: 3px; justify-items: center; min-width: 0; width: 100%; container-type: inline-size; }
.mq-res-rating-col h4 { margin: 0; font-size: clamp(.68rem, 3vw, .78rem); font-weight: 900; color: var(--result-deep); line-height: 1.15; overflow-wrap: anywhere; }
/* les étoiles se dimensionnent d'après la largeur réelle de leur colonne : 4 × 17 % + 20 % + 4 × 1,5 % = 94 % → centrées, jamais en dépassement */
.mq-res-stars { display: flex; gap: 1.5cqi; align-items: center; justify-content: center; padding: 4px 0 7px; overflow: visible; width: 100%; max-width: 100%; }
.mq-res-stars .mq-etoile-geant { width: 17cqi; height: 17cqi; max-width: 34px; max-height: 34px; filter: none; }
.mq-res-stars .mq-etoile-geant:nth-child(2) { width: 17cqi; height: 17cqi; max-width: 34px; max-height: 34px; }
.mq-res-stars .mq-etoile-geant:nth-child(3) { width: 20cqi; height: 20cqi; max-width: 40px; max-height: 40px; }
@supports not (width: 1cqi) { .mq-res-stars .mq-etoile-geant, .mq-res-stars .mq-etoile-geant:nth-child(2) { width: clamp(20px, 5.4vw, 30px); height: clamp(20px, 5.4vw, 30px); } .mq-res-stars .mq-etoile-geant:nth-child(3) { width: clamp(24px, 6.4vw, 36px); height: clamp(24px, 6.4vw, 36px); } .mq-res-stars { gap: 2px; } }
.mq-res-note { font-size: clamp(1rem, 4.4vw, 1.2rem); font-weight: 950; letter-spacing: -.02em; color: var(--result-deep); opacity: 0; transform: scale(.6); }
.mq-res-note.is-on { animation: mq-res-pop-in .55s cubic-bezier(.22, 1.6, .36, 1) forwards; }
.mq-res-eff { display: grid; justify-items: center; gap: 5px; align-self: center; }
.mq-res-medal { width: 42px; height: 42px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; background: radial-gradient(circle at 35% 30%, #2fb4c8, #0f6d84); box-shadow: 0 8px 20px rgba(21, 60, 122, .3); opacity: 0; transform: scale(.3); }
.mq-res-medal svg { width: 24px; height: 24px; }
.mq-res-page.is-on .mq-res-medal { animation: mq-res-pop-in .8s cubic-bezier(.22, 1.6, .36, 1) 1.75s forwards; }
.mq-res-eff small { font-size: .5rem; letter-spacing: .08em; font-weight: 950; color: #3f6084; text-align: center; line-height: 1.2; }

/* récompense : compacte (détail sur deux lignes) et la pièce tourne */
.mq-res-page .mq-final-reward { padding: 9px 12px; grid-template-columns: clamp(46px, 11vw, 60px) minmax(0, 1fr) clamp(46px, 12vw, 70px); gap: 10px; border-radius: clamp(18px, 5vw, 24px); }
.mq-res-page .mq-final-reward-copy p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 3px; }
.mq-res-page .mq-final-reward-art { height: 46px; } .mq-res-page .mq-final-reward-art i { width: 30px; }
.mq-res-page .mq-final-reward-icon { transform-style: preserve-3d; }
.mq-res-page .mq-final-reward.is-spin .mq-final-reward-icon { animation: mq-res-coin 1.4s var(--ease) both; }
@keyframes mq-res-coin { 0% { transform: rotateY(0); } 60% { transform: rotateY(540deg); } 100% { transform: rotateY(720deg); } }

/* comparaison */
.mq-res-compare { padding: 10px 12px 6px; }
.mq-res-compare header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
.mq-res-compare header strong { font-size: clamp(.68rem, 3vw, .8rem); letter-spacing: .14em; color: var(--res-accent); font-weight: 950; }
.mq-res-compare header b { font-size: clamp(.68rem, 3vw, .8rem); font-weight: 900; color: var(--result-deep); }
.mq-res-cols { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; font-size: clamp(.54rem, 2.3vw, .62rem); letter-spacing: .1em; font-weight: 950; color: #3f6084; padding: 2px 0 1px; }
.mq-res-cols span:nth-child(2) { text-align: center; } .mq-res-cols span:last-child { text-align: right; }
.mq-res-row { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; align-items: center; gap: 8px; padding: 5px 0; border-top: 1px solid rgba(21, 60, 122, .08); opacity: 0; transform: translateX(-14px); }
.mq-res-row.is-on { animation: mq-res-row-in .5s var(--sortie) forwards; }
@keyframes mq-res-row-in { to { opacity: 1; transform: none; } }
.mq-res-row b { font-size: clamp(.84rem, 3.5vw, .95rem); font-weight: 950; font-variant-numeric: tabular-nums; color: var(--result-deep); }
.mq-res-row b:last-child { text-align: right; }
.mq-res-row b.is-best { color: var(--res-win); } .mq-res-row b.is-worst { color: var(--res-loss); }
.mq-res-mid { display: grid; gap: 2px; text-align: center; font-size: clamp(.6rem, 2.6vw, .68rem); line-height: 1.15; font-weight: 800; color: #3f6084; }
.mq-res-mid span { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.mq-res-mid span svg { width: 14px; height: 14px; color: #6a8fc0; }
.mq-res-bar { position: relative; height: 4px; border-radius: 999px; background: rgba(21, 60, 122, .1); overflow: hidden; }
.mq-res-bar i, .mq-res-bar u { position: absolute; top: 0; bottom: 0; border-radius: inherit; width: 0; transition: width .9s var(--sortie); }
.mq-res-bar i { left: 50%; transform-origin: left; background: linear-gradient(90deg, var(--res-accent-2), var(--res-accent)); transform: scaleX(-1); }
.mq-res-bar u { left: 50%; background: linear-gradient(90deg, var(--res-loss-2), var(--res-loss)); }
.mq-res-row.is-on .mq-res-bar i { width: var(--l); } .mq-res-row.is-on .mq-res-bar u { width: var(--r); }
.mq-res-bar u.is-win { background: linear-gradient(90deg, var(--res-win-2), var(--res-win)); }

/* actions : le bouton respire une fois la séquence posée */
.mq-res-page.is-settled .mq-final-replay:not(.is-waiting):not(.is-loading) { animation: mq-res-cta 2.2s ease-in-out .3s infinite; }
@keyframes mq-res-cta { 50% { transform: scale(1.02); } }
.mq-res-page.is-loss.is-settled .mq-final-replay:not(.is-waiting):not(.is-loading) { animation: mq-res-cta-loss 2.2s ease-in-out .3s infinite; }
@keyframes mq-res-cta-loss { 50% { transform: scale(1.02); } }

/* mode calme : tout est posé d'emblée */
.mq-shell[data-motion="calme"] .mq-res-page .mq-res-word, .mq-shell[data-motion="calme"] .mq-res-page .mq-res-subtitle,
.mq-shell[data-motion="calme"] .mq-res-page .mq-res-card, .mq-shell[data-motion="calme"] .mq-res-page .mq-res-side, .mq-shell[data-motion="calme"] .mq-res-page .mq-res-vs,
.mq-shell[data-motion="calme"] .mq-res-page .mq-res-medal, .mq-shell[data-motion="calme"] .mq-res-page .mq-res-note, .mq-shell[data-motion="calme"] .mq-res-page .mq-res-row { opacity: 1; transform: none; filter: none; animation: none !important; }
.mq-shell[data-motion="calme"] .mq-res-page .mq-res-rays, .mq-shell[data-motion="calme"] .mq-res-page .mq-res-dust { display: none; }
.mq-shell[data-motion="calme"] .mq-res-page .mq-final-reward-icon, .mq-shell[data-motion="calme"] .mq-res-page .mq-final-replay { animation: none !important; }
.mq-shell[data-motion="calme"] .mq-res-page .mq-res-row .mq-res-bar i { width: var(--l); } .mq-shell[data-motion="calme"] .mq-res-page .mq-res-row .mq-res-bar u { width: var(--r); }
@media (prefers-reduced-motion: reduce) { .mq-res-page .mq-res-rays, .mq-res-page .mq-res-dust { display: none; } }
@media (max-width: 360px) { .mq-res-ratings { grid-template-columns: minmax(0, 1fr) 58px minmax(0, 1fr); } .mq-res-medal { width: 40px; height: 40px; } .mq-res-arena { grid-template-columns: minmax(0, 1fr) 50px minmax(0, 1fr); } .mq-res-vs { width: 50px; height: 50px; font-size: .95rem; } }

/* =========================================================================
   CARROUSEL DES UNIVERS — choix de catégorie (6.28.25)
   GPU uniquement : transform/opacity, aucun filtre en direct, ombres
   pré-calculées dans les images, trois cartes dessinées à la fois.
   ========================================================================= */
/* Les étapes en carrousel (modes, univers) passent devant leur ciel décoratif. */
.mq-view[data-view="miseEnPlace"] > .mq-setup-head.is-centered,
.mq-view[data-view="miseEnPlace"] > .mq-univers,
.mq-view[data-view="miseEnPlace"] > .mq-univers ~ .mq-setup-foot { position: relative; z-index: 1; }
/* en-tête centré : le bouton retour et le compteur restent aux bords */
/* En-tête des carrousels : Retour | titre centré | compteur, sur une seule ligne (même spécificité que la règle « structure verticale »). */
/* colonnes latérales symétriques (1fr chacune) : le titre est centré au pixel, quelle que soit la largeur du compteur */
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-centered { grid-template-columns: minmax(clamp(46px, 12vw, 56px), 1fr) auto minmax(clamp(46px, 12vw, 56px), 1fr); grid-template-areas: "back copy counter" "steps steps steps"; align-items: center; column-gap: clamp(6px, 1.8vw, 12px); row-gap: clamp(8px, 1.4vh, 14px); flex: 0 0 auto; }
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-centered .mq-setup-back { grid-area: back; align-self: center; justify-self: start; margin: 0; }
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-centered .mq-setup-copy { grid-area: copy; align-self: center; text-align: center; padding: 0 6px; margin: 0; min-width: 0; }
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-centered .mq-setup-steps { grid-area: steps; margin: 0; }
.mq-setup-head.is-centered .mq-setup-copy .mq-eyebrow { margin: 0 0 1px; font-size: clamp(.58rem, 2.5vw, .68rem); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-centered .mq-setup-copy .mq-title { margin: 0; font-size: clamp(1.15rem, 5.4vw, 1.9rem); line-height: 1.05; white-space: nowrap; }
@media (max-width: 340px) { .mq-view[data-view="miseEnPlace"] .mq-setup-head.is-centered .mq-setup-copy .mq-title { font-size: 1.05rem; } .mq-view[data-view="miseEnPlace"] .mq-setup-head.is-centered .mq-setup-copy { padding: 0 2px; } .mq-univers-counter { padding: 0 9px; font-size: .8rem; } }
.mq-setup-head.is-centered .mq-setup-copy .mq-eyebrow { letter-spacing: .28em; }
.mq-setup-head.is-centered .mq-setup-copy .mq-title { position: relative; display: inline-block; text-shadow: 0 2px 0 rgba(255, 255, 255, .7); }
.mq-setup-head.is-centered .mq-setup-copy .mq-title::after { content: ""; display: block; height: 4px; width: 44%; margin: 7px auto 0; border-radius: 999px; background: linear-gradient(90deg, var(--c1, var(--turq)), var(--c2, var(--bleu))); transition: background .6s; }
.mq-univers-counter { grid-area: counter; align-self: center; justify-self: end; height: clamp(40px, 10vw, 46px); padding: 0 12px; border-radius: 14px; background: rgba(255, 255, 255, .92); box-shadow: 0 6px 16px rgba(21, 60, 122, .12); display: flex; align-items: center; gap: 4px; font-weight: 950; font-size: .88rem; font-variant-numeric: tabular-nums; color: var(--encre); }
.mq-univers-counter b { color: var(--bleu); }

/* ---- fond vivant ---- */
.mq-univers-sky { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; border-radius: inherit; }
.mq-univers-aura { position: absolute; inset: 0; opacity: 0; transition: opacity .9s var(--ease); background: radial-gradient(ellipse 70% 45% at 50% 38%, var(--a1, transparent) 0%, transparent 100%), radial-gradient(ellipse 80% 40% at 50% 78%, var(--a2, transparent) 0%, transparent 100%); }
.mq-univers-aura.is-on { opacity: .7; }
.mq-univers-layer { position: absolute; top: -5%; bottom: -5%; left: 0; width: 200%; will-change: transform; contain: strict; }
.mq-univers-layer.is-blobs i { position: absolute; border-radius: 50%; background: radial-gradient(circle at 40% 35%, rgba(255, 255, 255, .5), rgba(255, 255, 255, .04) 60%, transparent 70%); }
.mq-univers-layer.is-rings i { position: absolute; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .32); }
.mq-univers-layer.is-rings b { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: radial-gradient(circle, #fff 0 30%, rgba(255, 255, 255, .35) 55%, transparent 75%); opacity: .7; }
.mq-univers-twinkle { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: radial-gradient(circle, #fff 0 30%, rgba(255, 255, 255, .35) 55%, transparent 75%); animation: mq-univers-twinkle var(--d, 3s) ease-in-out var(--r, 0s) infinite; }
@keyframes mq-univers-twinkle { 0%, 100% { opacity: .15; } 50% { opacity: .9; } }
.mq-univers-streak { position: absolute; top: 0; bottom: 0; width: 36%; left: -40%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); transform: skewX(-18deg); opacity: 0; }
.mq-univers-streak.is-go { animation: mq-univers-streak .7s var(--ease); }
.mq-univers-streak.is-back { animation: mq-univers-streak-back .7s var(--ease); }
@keyframes mq-univers-streak { 0% { left: -40%; opacity: 0; } 20% { opacity: .9; } 100% { left: 110%; opacity: 0; } }
@keyframes mq-univers-streak-back { 0% { left: 110%; opacity: 0; } 20% { opacity: .9; } 100% { left: -40%; opacity: 0; } }

/* ---- scène ---- */
.mq-univers { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.mq-univers-stage { position: relative; flex: 1 1 auto; min-height: 0; perspective: 1100px; perspective-origin: 50% 35%; cursor: grab; user-select: none; -webkit-user-select: none; touch-action: pan-y; --card-w: 300px; }
.mq-univers-stage.is-drag { cursor: grabbing; }
.mq-univers-card { position: absolute; left: 50%; top: 50%; width: var(--card-w); height: calc(var(--card-w) / .82); margin-left: calc(var(--card-w) / -2); margin-top: calc(var(--card-w) / -.82 / 2 + 7%); border-radius: 30px; transform-style: preserve-3d; will-change: transform, opacity; visibility: hidden; }
.mq-univers-card.is-near { visibility: visible; }
.mq-univers-body { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(165deg, rgba(255, 255, 255, .97), rgba(255, 255, 255, .84)); border: 1px solid rgba(255, 255, 255, .9); box-shadow: 0 26px 50px rgba(21, 60, 122, .22), inset 0 1px 0 #fff; overflow: hidden; }
.mq-univers-body::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 18%, var(--c1) 0%, transparent 58%); opacity: .5; }
.mq-univers-sheen { position: absolute; inset: -40%; background: linear-gradient(115deg, transparent 42%, rgba(255, 255, 255, .6) 50%, transparent 58%); transform: translateX(-80%); pointer-events: none; display: none; }
.mq-univers-card.is-enter .mq-univers-sheen { display: block; animation: mq-univers-sheen 1.3s var(--ease) .25s both; }
@keyframes mq-univers-sheen { to { transform: translateX(80%); } }
.mq-univers-dim { position: absolute; inset: 0; border-radius: inherit; background: rgba(120, 150, 190, .28); opacity: 0; pointer-events: none; }
.mq-univers-art { position: absolute; left: 50%; top: -27%; width: 112%; aspect-ratio: 1; margin-left: -56%; transform: translateZ(70px); pointer-events: none; }
.mq-univers-art img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mq-univers-card.is-active .mq-univers-art img { animation: mq-univers-float 3.4s ease-in-out infinite; }
@keyframes mq-univers-float { 50% { transform: translateY(-8px); } }
.mq-univers-card.is-enter .mq-univers-art img { animation: mq-univers-pop .85s cubic-bezier(.22, 1.5, .36, 1) both, mq-univers-float 3.4s ease-in-out .85s infinite; }
@keyframes mq-univers-pop { 0% { transform: translateY(46px) scale(.6); opacity: 0; } 60% { opacity: 1; } 100% { transform: translateY(0) scale(1); opacity: 1; } }
.mq-univers-floor { position: absolute; left: 50%; top: 55%; width: 56%; height: 9%; margin-left: -28%; border-radius: 50%; background: radial-gradient(ellipse, rgba(20, 40, 80, .26), transparent 70%); }
.mq-univers-card.is-active .mq-univers-floor { animation: mq-univers-floor 3.4s ease-in-out infinite; }
@keyframes mq-univers-floor { 50% { transform: scale(.86); opacity: .7; } }
.mq-univers-ring { position: absolute; left: 50%; top: 34%; width: 60%; aspect-ratio: 1; margin-left: -30%; border-radius: 50%; border: 3px solid var(--c2); opacity: 0; pointer-events: none; display: none; }
.mq-univers-card.is-enter .mq-univers-ring { display: block; animation: mq-univers-ring .9s var(--sortie) .1s; }
@keyframes mq-univers-ring { 0% { opacity: .9; transform: scale(.5); } 100% { opacity: 0; transform: scale(1.8); } }
.mq-univers-meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 12px clamp(12px, 3.6vw, 20px); text-align: center; }
.mq-univers-name { display: block; font-size: clamp(20px, 6.2vw, 30px); font-weight: 950; letter-spacing: -.03em; line-height: 1; color: var(--encre); }
.mq-univers-name { opacity: 0; transform: translateY(10px); }
.mq-univers-card.is-active .mq-univers-name { animation: mq-univers-ch .5s var(--sortie) .12s forwards; }
@keyframes mq-univers-ch { to { opacity: 1; transform: none; } }
.mq-univers-sub { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 6px 12px; border-radius: 999px; font-size: .8rem; font-weight: 900; color: var(--encre-2); background: rgba(21, 60, 122, .07); opacity: 0; transform: translateY(8px); }
.mq-univers-card.is-active .mq-univers-sub { animation: mq-univers-ch .5s var(--sortie) .45s forwards; }
.mq-univers-sub svg { width: 16px; height: 16px; }
.mq-univers-sub.is-locked { color: #9a6a12; background: rgba(255, 192, 46, .2); }
.mq-univers-pill { display: inline-flex; align-items: center; gap: 6px; margin: 8px 0 0; padding: 6px 12px; border-radius: 999px; font-size: .74rem; font-weight: 900; color: #fff; background: linear-gradient(120deg, var(--c1), var(--c2)); box-shadow: 0 6px 14px rgba(21, 60, 122, .18); opacity: 0; transform: translateY(8px); }
.mq-univers-pill svg { width: 14px; height: 14px; }
.mq-univers-card.is-active .mq-univers-pill { animation: mq-univers-ch .5s var(--sortie) .52s forwards; }
.mq-univers-card.has-pill .mq-univers-sub { display: block; margin-top: 6px; background: none; padding: 0; font-size: clamp(.8rem, 3.3vw, .92rem); }
.mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-pill { opacity: 1; transform: none; animation: none !important; }
.mq-univers-tag { position: absolute; left: -6px; top: 22%; z-index: 3; padding: 6px 10px; border-radius: 999px; font-size: .64rem; letter-spacing: .12em; font-weight: 950; color: #fff; background: linear-gradient(120deg, #ff9d3d, #e8531c); box-shadow: 0 6px 14px rgba(232, 83, 28, .35); transform: translateZ(80px) rotate(-6deg); }
.mq-univers-lock { position: absolute; right: -4px; top: 22%; z-index: 3; width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, .92); color: #9a6a12; box-shadow: 0 6px 14px rgba(21, 60, 122, .15); transform: translateZ(80px); }
.mq-univers-lock svg { width: 18px; height: 18px; }
.mq-univers-card.is-shake .mq-univers-body { animation: mq-univers-shake .5s var(--ease); }
@keyframes mq-univers-shake { 20% { transform: translateX(-7px) rotate(-1.5deg); } 40% { transform: translateX(7px) rotate(1.5deg); } 60% { transform: translateX(-5px); } 80% { transform: translateX(4px); } }
.mq-univers-arrow { position: absolute; top: 50%; z-index: 3; width: 42px; height: 42px; margin-top: -21px; border-radius: 50%; background: rgba(255, 255, 255, .9); color: var(--encre); box-shadow: 0 8px 20px rgba(21, 60, 122, .16); display: flex; align-items: center; justify-content: center; opacity: .9; }
.mq-univers-arrow svg { width: 20px; height: 20px; }
.mq-univers-arrow.is-prev { left: 4px; } .mq-univers-arrow.is-next { right: 4px; }
.mq-univers-dots { flex: 0 0 auto; display: flex; justify-content: center; gap: 6px; padding: 4px 0 6px; }
.mq-univers-dots i { width: 8px; height: 8px; border-radius: 999px; background: rgba(21, 60, 122, .18); transition: width .35s var(--sortie), background .35s; }
.mq-univers-dots i.is-on { width: 26px; background: linear-gradient(90deg, var(--c1, var(--turq)), var(--c2, var(--bleu))); }
/* bouton : libellé qui bascule, état verrouillé ambré */
.mq-setup-foot .mq-btn [data-next-label].is-swap { display: inline-block; animation: mq-univers-swap .35s var(--sortie); }
@keyframes mq-univers-swap { 0% { opacity: 0; transform: translateY(8px); } 100% { opacity: 1; transform: none; } }
.mq-setup-foot .mq-btn.is-unlock { color: #fff; background: linear-gradient(105deg, #e8951c, #c9550c) !important; box-shadow: 0 5px 0 #7a3d00, 0 12px 25px rgba(201, 85, 12, .31), inset 0 2px 0 rgba(255, 255, 255, .4) !important; }
/* mode calme : tout posé, aucun décor animé */
.mq-shell[data-motion="calme"] .mq-univers-layer, .mq-shell[data-motion="calme"] .mq-univers-twinkle, .mq-shell[data-motion="calme"] .mq-univers-streak { display: none; }
.mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-name, .mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-sub { opacity: 1; transform: none; animation: none !important; }
.mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-art img, .mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-floor, .mq-shell[data-motion="calme"] .mq-univers-sheen, .mq-shell[data-motion="calme"] .mq-univers-ring { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .mq-univers-layer, .mq-univers-twinkle, .mq-univers-streak { display: none; } }
/* ---- carrousel des adversaires : suffixe de nom, jauge de danger, statistiques, liseré ---- */
.mq-univers-name em { font-style: normal; font-weight: 900; font-size: .62em; color: var(--encre-2); letter-spacing: -.01em; }
.mq-univers-danger { display: inline-flex; gap: 4px; margin-top: 6px; opacity: 0; transform: translateY(8px); }
.mq-univers-danger i { width: 18px; height: 6px; border-radius: 999px; background: rgba(21, 60, 122, .14); }
.mq-univers-danger i.is-on { background: linear-gradient(90deg, var(--c1), var(--c2)); }
.mq-univers-card.is-active .mq-univers-danger { animation: mq-univers-ch .5s var(--sortie) .26s forwards; }
.mq-univers-stats { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 8px; align-items: center; width: 78%; margin: 8px auto 0; font-size: .6rem; font-weight: 900; color: var(--encre-2); letter-spacing: .04em; text-transform: uppercase; text-align: left; opacity: 0; transform: translateY(8px); }
.mq-univers-card.is-active .mq-univers-stats { animation: mq-univers-ch .5s var(--sortie) .34s forwards; }
.mq-univers-stats b { display: block; height: 5px; border-radius: 999px; background: rgba(21, 60, 122, .1); overflow: hidden; }
.mq-univers-stats b i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--c1), var(--c2)); transition: width .9s var(--sortie) .35s; }
.mq-univers-card.is-active .mq-univers-stats b i { width: var(--w); }
.mq-univers-card.has-stats .mq-univers-meta { padding-bottom: clamp(10px, 3vw, 16px); }
.mq-univers-card.has-stats .mq-univers-sub { margin-top: 6px; }
.mq-univers-rim { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; box-shadow: inset 0 0 0 2px var(--c2), inset 0 0 26px var(--c2); }
.mq-univers-card.is-danger-high.is-active .mq-univers-rim { opacity: .3; }
.mq-univers-card.is-danger-max.is-active .mq-univers-rim { animation: mq-univers-rim 1.8s ease-in-out infinite; }
@keyframes mq-univers-rim { 0%, 100% { opacity: .3; } 50% { opacity: .9; } }
.mq-univers-streak { background: linear-gradient(90deg, transparent, var(--streak, rgba(255, 255, 255, .55)), transparent); }
.mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-danger, .mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-stats { opacity: 1; transform: none; animation: none !important; }
.mq-shell[data-motion="calme"] .mq-univers-card .mq-univers-stats b i { width: var(--w); }
.mq-shell[data-motion="calme"] .mq-univers-rim { animation: none !important; }
/* cartes à statistiques (adversaires) : illustration plus haute et un peu plus petite pour ne jamais couvrir le nom */
.mq-univers-card.has-stats .mq-univers-art { top: -30%; width: 86%; margin-left: -43%; }
.mq-univers-card.has-stats .mq-univers-stats { margin-top: 6px; }
.mq-univers-card.has-stats .mq-univers-pill { margin-top: 6px; }

/* =========================================================================
   EN-TÊTE COMPACT (étapes Format et Mode) — titre centré sur la ligne du bouton Retour
   ========================================================================= */
/* spécificité alignée sur la règle « structure verticale » (.mq-view[data-view] .mq-setup-head) qu'elle remplace */
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-inline {
	grid-template-columns: clamp(46px, 12vw, 56px) minmax(0, 1fr) clamp(46px, 12vw, 56px);
	grid-template-areas: "back copy spacer" "steps steps steps";
	align-items: center;
	row-gap: clamp(8px, 1.4vh, 14px);
	flex: 0 0 auto;
}
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-inline .mq-setup-back { grid-area: back; align-self: center; margin: 0; }
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-inline .mq-setup-copy { grid-area: copy; align-self: center; text-align: center; padding: 0; margin: 0; min-width: 0; }
.mq-setup-head.is-inline .mq-setup-copy .mq-eyebrow { margin: 0 0 1px; font-size: clamp(.6rem, 2.6vw, .7rem); letter-spacing: .26em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mq-setup-head.is-inline .mq-setup-copy .mq-title { position: relative; display: inline-block; margin: 0; font-size: clamp(1.45rem, 6.6vw, 2rem); line-height: 1.05; white-space: nowrap; text-shadow: 0 2px 0 rgba(255, 255, 255, .7); }
.mq-setup-head.is-inline .mq-setup-copy .mq-title::after { content: ""; display: block; height: 4px; width: 44%; margin: 6px auto 0; border-radius: 999px; background: linear-gradient(90deg, var(--turq), var(--bleu)); }
.mq-view[data-view="miseEnPlace"] .mq-setup-head.is-inline .mq-setup-steps { grid-area: steps; margin: 0; }
@media (max-width: 340px) { .mq-setup-head.is-inline .mq-setup-copy .mq-title { font-size: 1.35rem; } }
/* modes de contenu : le sous-titre est une phrase (hint) → deux lignes maximum, taille réduite */
.mq-univers-card.has-pill .mq-univers-sub { white-space: normal; line-height: 1.25; font-size: clamp(.72rem, 3vw, .82rem); max-width: 92%; margin-left: auto; margin-right: auto; display: block; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

/* =========================================================================
   ACCUEIL (6.28.38) — l'ouverture du jeu : deux cartes qui s'aimantent dans un éclair,
   paire révélée, validation + titre, lumière, JOUER, ligne de chargement. Transform/opacité uniquement.
   ========================================================================= */
.mq-view[data-view="accueil"] { position: absolute; display: flex; flex-direction: column; gap: 0; overflow: hidden; min-width: 0; }
.mq-view[data-view="accueil"] > * { position: relative; z-index: 1; min-width: 0; max-width: 100%; }
.mq-shell[data-screen="accueil"] .mq-view[data-view="accueil"] { overflow: hidden; gap: clamp(6px, 1vh, 12px); }
.mq-view[data-view="accueil"] > .mq-h2-play { flex: 0 0 auto; }

/* lumière : soleil haut, voile blanc qui s'allume à la validation, éclat au point de rencontre */
.mq-h2-light { position: absolute !important; inset: -30% 0 0 0; z-index: 0 !important; pointer-events: none; overflow: hidden; }
.mq-h2-light i { position: absolute; display: block; }
.mq-h2-sun { left: 50%; top: 0; width: 170vw; height: 60vh; transform: translateX(-50%); background: radial-gradient(ellipse at 50% 35%, rgba(255,255,255,.7) 0%, rgba(255,255,255,.18) 42%, transparent 70%); }
.mq-h2-lift { inset: 0; background: #fff; opacity: 0; }
.mq-h2-flash { inset: 0; background: #fff; opacity: 0; }
.mq-h2-burst { left: 50%; top: 58%; width: 140vmax; height: 140vmax; margin: -70vmax 0 0 -70vmax; border-radius: 50%; opacity: 0; transform: scale(0);
	background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(255,255,255,.9) 12%, rgba(190,246,250,.55) 26%, rgba(22,196,206,.18) 42%, transparent 60%); }
.mq-shell[data-skin="nuit"] .mq-h2-sun, .mq-shell[data-skin="ardoise"] .mq-h2-sun { opacity: .35; }
.mq-shell[data-skin="nuit"] .mq-h2-lift, .mq-shell[data-skin="ardoise"] .mq-h2-lift { background: #9fd8ff; }

/* la scène : cartes + titre forment un groupe centré dans l'espace libre */
.mq-h2-stage { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }
.mq-h2-scene { position: relative; width: 100%; height: calc(min(34vw, 148px) / .72 + clamp(28px, 7vh, 60px)); perspective: 1100px; perspective-origin: 50% 50%; }
.mq-h2-slot { position: absolute; left: 50%; top: 50%; width: min(34vw, 148px); aspect-ratio: .72; margin-left: calc(min(34vw, 148px) / -2); transform: translateY(-50%); transform-style: preserve-3d; }
.mq-h2-card { position: absolute; inset: 0; will-change: transform; opacity: 0; }
.mq-h2-wob { position: absolute; inset: 0; }
.mq-h2-flip { position: absolute; inset: 0; transform-style: preserve-3d; will-change: transform; }
.mq-h2-face { position: absolute; inset: 0; border-radius: 14% / 10%; backface-visibility: hidden; -webkit-backface-visibility: hidden; box-shadow: 0 26px 48px rgba(21,60,122,.28), 0 4px 10px rgba(21,60,122,.12); }
.mq-h2-back { background: linear-gradient(165deg, #6be4dc 0%, #37b9ea 50%, #2e86e0 100%); border: 4px solid #fff; overflow: hidden; }
.mq-h2-back::before { content: ""; position: absolute; inset: 13%; border-radius: 50%; border: 2px solid rgba(255,255,255,.34); }
.mq-h2-back svg { position: absolute; inset: 0; margin: auto; width: 46%; height: 46%; fill: #fff; filter: drop-shadow(0 3px 0 rgba(21,60,122,.26)); }
.mq-h2-front { transform: rotateY(180deg); background: #fff; padding: 4%; visibility: hidden; }
.mq-h2-front img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 11% / 8%; }
.mq-h2-front b { position: absolute; left: 4%; right: 4%; bottom: 4%; padding: 22% 8% 8%; border-radius: 0 0 11% 11% / 0 0 20% 20%; text-align: center; color: #fff; font-size: clamp(.72rem, 3.2vw, .86rem); font-weight: 900; letter-spacing: .01em; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: linear-gradient(180deg, rgba(9,32,68,0), rgba(9,32,68,.72)); }
.mq-h2-front::after { content: ""; position: absolute; inset: 4%; border-radius: 11% / 8%; box-shadow: inset 0 0 0 3px rgba(127,227,182,.95), inset 0 0 24px rgba(79,209,176,.35); opacity: 0; transition: opacity .4s; }
/* double sécurité : au-delà de 90°, la face avant prend le relais même si backface-visibility est ignoré */
.mq-h2-slot.is-shown .mq-h2-front { visibility: visible; }
.mq-h2-slot.is-shown .mq-h2-back { visibility: hidden; }
.mq-h2-slot.is-paired .mq-h2-front::after { opacity: 1; }
.mq-h2-spark { position: absolute; left: 50%; top: 50%; width: 26%; aspect-ratio: 1; margin: -13% 0 0 -13%; border-radius: 50%; z-index: 2; opacity: 0; transform: scale(.2);
	background: radial-gradient(circle, #fff 0%, rgba(190,250,250,.9) 30%, rgba(39,217,220,.5) 55%, transparent 72%); }
/* l'éclair : tracé SVG (cœur blanc + halo turquoise) dessiné par stroke-dashoffset, hors ramifications */
.mq-h2-bolt { position: absolute; left: 50%; top: 50%; width: 62%; height: 128%; margin: -64% 0 0 -31%; z-index: 7; pointer-events: none; overflow: visible; }
.mq-h2-bolt path { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: 0; }
.mq-h2-bolt-glow { stroke: rgba(39,217,220,.75); stroke-width: 9; }
.mq-h2-bolt-core { stroke: #fff; stroke-width: 3; }
.mq-h2-bolt .is-branch .mq-h2-bolt-glow { stroke-width: 6; }
.mq-h2-bolt .is-branch .mq-h2-bolt-core { stroke-width: 2; }
.mq-h2-seal { position: absolute; left: 50%; top: 50%; width: 34%; aspect-ratio: 1; margin: -17% 0 0 -17%; border-radius: 50%; z-index: 9; display: flex; align-items: center; justify-content: center; opacity: 0; transform: scale(0);
	background: linear-gradient(145deg, #7fe3b6, #1f9d55); box-shadow: 0 12px 28px rgba(31,157,85,.45), inset 0 3px 0 rgba(255,255,255,.55), 0 0 0 4px #fff; }
.mq-h2-seal svg { width: 56%; height: 56%; }
.mq-h2-ring { position: absolute; left: 50%; top: 50%; width: 90%; aspect-ratio: 1; margin: -45% 0 0 -45%; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 2px rgba(39,217,220,.5), inset 0 0 0 2px rgba(39,217,220,.5); opacity: 0; transform: scale(.3); z-index: 8; }
.mq-h2-shard { position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; margin: -6px; border-radius: 3px; background: #fff; box-shadow: 0 0 12px 2px rgba(255,255,255,.9), 0 0 22px rgba(39,217,220,.7); opacity: 0; z-index: 8; }

/* la fiche de la carte, au-dessus des cartes, flèche vers elles */
.mq-h2-tip { position: absolute; left: 50%; bottom: calc(100% + 16px); width: min(88vw, 360px); margin-left: calc(min(88vw, 360px) / -2); z-index: 12; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; align-items: start; text-align: left; padding: 11px 13px 12px; border-radius: 20px; color: var(--mq-text, var(--encre));
	background: linear-gradient(180deg, var(--mq-surface, #fff), var(--mq-surface-raised, #f6fbfe)); box-shadow: 0 16px 36px rgba(21,60,122,.20), 0 2px 6px rgba(21,60,122,.08), inset 0 1px 0 rgba(255,255,255,.9), 0 0 0 1.5px rgba(31,157,85,.32);
	opacity: 0; transform: translateY(10px) scale(.96); transform-origin: 50% 100%; }
.mq-h2-tip.is-on { animation: mq-h2-tip .5s cubic-bezier(.22,1.45,.36,1) forwards; }
@keyframes mq-h2-tip { from { opacity: 0; transform: translateY(10px) scale(.96); } to { opacity: 1; transform: none; } }
.mq-h2-tip[hidden] { display: none; }
.mq-h2-tip-arrow { position: absolute; left: 50%; bottom: -9px; width: 18px; height: 18px; margin-left: -9px; background: var(--mq-surface-raised, #f6fbfe); transform: rotate(45deg); border-radius: 3px; box-shadow: 2px 2px 0 0 rgba(31,157,85,.32); }
.mq-h2-tip-ic { width: 36px; height: 36px; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(145deg, #ffd27a, #e08a2b); box-shadow: 0 6px 14px rgba(224,138,43,.35); }
.mq-h2-tip-ic svg { width: 20px; height: 20px; stroke-width: 2.4; }
.mq-h2-tip-copy { min-width: 0; }
.mq-h2-tip-copy small { display: flex; justify-content: space-between; gap: 8px; font-size: .56rem; letter-spacing: .16em; font-weight: 950; color: #1f9d55; text-transform: uppercase; }
.mq-h2-tip-copy small em { font-style: normal; letter-spacing: .04em; color: var(--mq-text-muted, var(--encre-3)); }
.mq-h2-tip-copy b { display: block; margin-top: 2px; font-size: .9rem; font-weight: 950; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mq-h2-tip-copy p { margin: 3px 0 0; font-size: clamp(.76rem, 3.2vw, .84rem); font-weight: 800; line-height: 1.3; color: var(--mq-text, var(--encre)); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.mq-h2-tip-copy p strong { font-weight: 950; color: #e8531c; background: linear-gradient(transparent 60%, rgba(255,192,46,.35) 60%); padding: 0 2px; border-radius: 3px; }
.mq-shell[data-skin="nuit"] .mq-h2-tip-copy p strong, .mq-shell[data-skin="ardoise"] .mq-h2-tip-copy p strong { color: #ffb36b; background: linear-gradient(transparent 60%, rgba(255,192,46,.22) 60%); }

/* le titre, sous les cartes */
.mq-h2-brand { width: 100%; text-align: center; margin-top: clamp(4px, 1.6vh, 16px); }
.mq-h2-brand h1 { margin: 0; display: block; text-align: center; font-size: clamp(2.5rem, 12.4vw, 3.7rem); font-weight: 800; letter-spacing: -.04em; line-height: 1; white-space: nowrap; max-width: 100%; overflow: hidden; }
.mq-h2-brand h1 span { display: inline-block; opacity: 0; will-change: transform, opacity; text-shadow: 0 3px 0 rgba(255,255,255,.85), 0 14px 30px rgba(21,60,122,.14); }
.mq-h2-brand h1 .is-m { color: var(--turq-2); }
.mq-h2-brand h1 .is-q { color: var(--encre); }
.mq-shell[data-skin="nuit"] .mq-h2-brand h1 span, .mq-shell[data-skin="ardoise"] .mq-h2-brand h1 span { text-shadow: 0 2px 0 rgba(0,0,0,.25), 0 14px 30px rgba(0,0,0,.3); }
.mq-h2-brand p { margin: 8px 0 0; font-size: clamp(.8rem, 3.4vw, .9rem); font-weight: 600; letter-spacing: .02em; color: var(--encre-2); opacity: 0; }

/* JOUER : blanc nacré, liseré turquoise → bleu, pastille dégradée à gauche, mot centré */
.mq-h2-play { position: relative; flex: 0 0 auto; height: clamp(62px, 8.4vh, 72px); border-radius: 28px; display: flex; align-items: center; justify-content: center; overflow: hidden; color: var(--mq-text, var(--encre)); opacity: 0; margin-bottom: clamp(2px, .6vh, 6px);
	background: linear-gradient(180deg, var(--mq-surface, #fff) 0%, var(--mq-surface-raised, #f6fbfe) 100%);
	box-shadow: 0 18px 40px rgba(21,60,122,.20), 0 3px 8px rgba(21,60,122,.08), inset 0 1px 0 rgba(255,255,255,.9), inset 0 -3px 0 rgba(21,60,122,.05); }
.mq-h2-play::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; pointer-events: none; background: linear-gradient(120deg, rgba(22,196,206,.6), rgba(255,255,255,0) 45%, rgba(46,134,224,.5));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.mq-h2-play::after { content: ""; position: absolute; inset: -40%; background: linear-gradient(112deg, transparent 44%, rgba(22,196,206,.13) 50%, transparent 56%); transform: translateX(-70%); animation: mq-h2-sheen 5.2s var(--ease) 4.6s infinite; }
@keyframes mq-h2-sheen { 22%, 100% { transform: translateX(80%); } }
.mq-h2-play:active { transform: scale(.978); }
.mq-h2-play-ic { position: absolute; left: 12px; top: 50%; width: 46px; height: 46px; margin-top: -23px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--degrade); box-shadow: 0 8px 18px rgba(22,140,200,.42), inset 0 -3px 0 rgba(15,60,120,.22), inset 0 2px 0 rgba(255,255,255,.35); }
.mq-h2-play-ic svg { width: 20px; height: 20px; fill: #fff; margin-left: 3px; }
.mq-h2-play-t { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.mq-h2-play-t > span { font-size: clamp(1.3rem, 5.6vw, 1.5rem); font-weight: 900; letter-spacing: .08em; background: linear-gradient(100deg, #0fa3b4 0%, #2e86e0 60%, #1f6ac0 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.mq-h2-play-t small { margin-top: 4px; font-size: .66rem; font-weight: 700; color: var(--mq-text-secondary, var(--encre-2)); letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 62vw; }
.mq-shell[data-skin="nuit"] .mq-h2-play-t > span, .mq-shell[data-skin="ardoise"] .mq-h2-play-t > span { background: linear-gradient(100deg, #83dcf6, #7587ef); -webkit-background-clip: text; background-clip: text; }

/* JOUER en attente du chargement */
.mq-h2-play.is-waiting { pointer-events: none; }
.mq-h2-play.is-waiting .mq-h2-play-ic { background: linear-gradient(180deg, #cfe0ee, #b9cde0); box-shadow: none; }
.mq-h2-play.is-waiting .mq-h2-play-t > span { background: linear-gradient(100deg, #9db3cc, #8aa3bf); -webkit-background-clip: text; background-clip: text; }

/* ligne de chargement de l'ouverture : en bas, pourcentage réel, disparaît une fois prête */
.mq-h2-loader { position: absolute; left: clamp(18px, 5vw, 28px); right: clamp(18px, 5vw, 28px); bottom: calc(env(safe-area-inset-bottom) + clamp(14px, 2.2vh, 22px)); z-index: 6; display: flex; flex-direction: column; gap: 7px; pointer-events: none; transition: opacity .5s var(--ease), transform .5s var(--ease); }
.mq-h2-loader.is-done { opacity: 0; transform: translateY(8px); }
.mq-h2-loader-txt { display: flex; justify-content: space-between; align-items: baseline; font-size: .68rem; font-weight: 800; letter-spacing: .04em; color: var(--mq-text-secondary, var(--encre-2)); }
.mq-h2-loader-txt b { font-size: .8rem; font-weight: 900; color: var(--mq-text, var(--encre)); font-variant-numeric: tabular-nums; min-width: 3.2em; text-align: right; }
.mq-h2-loader-bar { display: block; height: 6px; border-radius: 99px; background: rgba(255,255,255,.7); box-shadow: inset 0 1px 2px rgba(21,60,122,.14), 0 1px 0 rgba(255,255,255,.8); overflow: hidden; }
.mq-h2-loader-bar i { display: block; height: 100%; width: 100%; border-radius: inherit; background: linear-gradient(90deg, #27d9dc, #2e86e0); transform-origin: 0 50%; transform: scaleX(0); will-change: transform; }
.mq-shell[data-skin="nuit"] .mq-h2-loader-bar, .mq-shell[data-skin="ardoise"] .mq-h2-loader-bar { background: rgba(255,255,255,.18); }

/* pendant la séquence complète, l'en-tête et la navigation attendent, puis se posent */
.mq-shell .mq-top, .mq-shell .mq-nav { transition: opacity .56s var(--sortie), transform .56s var(--sortie); }
.mq-shell.is-home-intro .mq-top { opacity: 0; transform: translateY(-14px); pointer-events: none; }
.mq-shell.is-home-intro .mq-nav { opacity: 0; transform: translateY(22px); pointer-events: none; }

/* entrée douce partagée (utilisée aussi par le hub Arène) */
@keyframes mq-hb-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* mode calme : ni secousse ni reflet, la paire est simplement en place */
.mq-shell[data-motion="calme"] .mq-h2-play::after { animation: none; }
@media (max-height: 660px) { .mq-h2-brand p { display: none; } }

/* ---------- En-tête nacré sur l'accueil (mêmes commandes : profil, pièces → boutique, coffre, réglages) ---------- */
.mq-shell[data-screen="accueil"] .mq-top { height: auto; min-height: 0; padding: 2px 0; gap: 10px; border: 0; border-radius: 0; background: transparent; box-shadow: none; min-width: 0; }
.mq-shell[data-screen="accueil"] .mq-avatar { width: clamp(46px, 6.2vh, 54px); height: clamp(46px, 6.2vh, 54px); padding: 3px; border: 0; background: var(--mq-surface, #fff); box-shadow: 0 8px 20px rgba(21,60,122,.16), 0 1px 3px rgba(21,60,122,.08); }
.mq-shell[data-screen="accueil"] .mq-avatar::before { content: ""; position: absolute; inset: 0; border-radius: 50%; padding: 2px; background: linear-gradient(135deg, #27d9dc, #2e86e0); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.mq-shell[data-screen="accueil"] .mq-avatar b { right: -6px; bottom: -4px; min-width: 22px; height: 22px; padding: 0 5px; font-size: .64rem; font-weight: 900; background: var(--degrade); border: 2.5px solid #fff; box-shadow: 0 4px 10px rgba(46,134,224,.35); }
.mq-shell[data-screen="accueil"] .mq-profil-info { justify-content: center; gap: 4px; min-width: 0; flex: 1 1 0; }
.mq-shell[data-screen="accueil"] .mq-profil-info strong { display: block; font-size: clamp(.74rem, 3.2vw, .84rem); font-weight: 900; letter-spacing: -.01em; color: var(--mq-text, var(--encre)); text-shadow: 0 1px 0 rgba(255,255,255,.6); }
.mq-shell[data-skin="nuit"][data-screen="accueil"] .mq-profil-info strong, .mq-shell[data-skin="ardoise"][data-screen="accueil"] .mq-profil-info strong { text-shadow: none; }
.mq-shell[data-screen="accueil"] .mq-xp { height: 7px; max-width: 132px; border-radius: 99px; background: rgba(255,255,255,.8); box-shadow: inset 0 1px 2px rgba(21,60,122,.14); }
.mq-shell[data-screen="accueil"] .mq-xp i { position: relative; overflow: hidden; background: linear-gradient(90deg, #27d9dc, #2e86e0); }
.mq-shell[data-screen="accueil"] .mq-xp i::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); transform: translateX(-100%); animation: mq-h2-xp 3.6s var(--ease) 4.8s infinite; }
@keyframes mq-h2-xp { 35%, 100% { transform: translateX(100%); } }
.mq-shell[data-screen="accueil"] .mq-chip { height: clamp(40px, 5.4vh, 44px); gap: 6px; padding: 0 5px 0 6px; border-radius: 99px; font-size: clamp(.86rem, 3.8vw, .96rem); font-weight: 900; color: var(--mq-text, var(--encre)); background: linear-gradient(180deg, var(--mq-surface, #fff), var(--mq-surface-raised, #f6fbfe)); border: 0; box-shadow: 0 10px 24px rgba(21,60,122,.16), 0 1px 3px rgba(21,60,122,.08), inset 0 1px 0 rgba(255,255,255,.9); position: relative; }
.mq-shell[data-screen="accueil"] .mq-chip::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; pointer-events: none; background: linear-gradient(120deg, rgba(255,192,46,.7), rgba(255,255,255,0) 45%, rgba(232,149,28,.45)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.mq-shell[data-screen="accueil"] .mq-chip .mq-coin { width: 30px; height: 30px; background: radial-gradient(circle at 36% 30%, #fff1b8 0%, #ffd24a 34%, #ffc02e 58%, #e8951c 100%); box-shadow: 0 3px 0 #b8650a, 0 6px 12px rgba(232,149,28,.35), inset 0 1px 0 rgba(255,255,255,.7); color: #b25f05; }
.mq-shell[data-screen="accueil"] .mq-chip .mq-coin svg { width: 50%; height: 50%; stroke-width: 3; }
.mq-shell[data-screen="accueil"] .mq-chip b { min-width: 2.4em; text-align: center; font-variant-numeric: tabular-nums; }
.mq-shell[data-screen="accueil"] .mq-chip .mq-plus { width: 30px; height: 30px; font-size: 1.1rem; background: var(--degrade); box-shadow: 0 5px 12px rgba(46,134,224,.38), inset 0 -2px 0 rgba(15,60,120,.22), inset 0 1px 0 rgba(255,255,255,.4); }
.mq-shell[data-screen="accueil"] .mq-icon-btn { width: clamp(40px, 5.4vh, 44px); height: clamp(40px, 5.4vh, 44px); border-radius: 50%; border: 0; color: var(--mq-text-secondary, var(--encre-2)); background: linear-gradient(180deg, var(--mq-surface, #fff), var(--mq-surface-raised, #f6fbfe)); box-shadow: 0 10px 24px rgba(21,60,122,.14), inset 0 1px 0 rgba(255,255,255,.9); }
.mq-shell[data-screen="accueil"] .mq-icon-btn svg { width: 19px; height: 19px; stroke-width: 2.5; }
.mq-shell[data-screen="accueil"] .mq-coffre { color: var(--or-2); }
.mq-shell[data-screen="accueil"] .mq-coffre.is-pret::after { top: -2px; right: -2px; }
@media (max-width: 360px) { .mq-shell[data-screen="accueil"] .mq-profil-info strong { display: none; } .mq-shell[data-screen="accueil"] .mq-top { gap: 8px; } }

/* =========================================================================
   HUB MULTIJOUEUR « ARÈNE » (6.28.32)
   ========================================================================= */
.mq-arena-hub { display: grid; gap: 10px; align-content: start; }
.mq-arena { position: relative; border-radius: 30px; padding: 16px 16px 14px; color: #fff; overflow: hidden; background: linear-gradient(160deg, #1f7d8a 0%, #2e86e0 55%, #3b5fd6 100%); box-shadow: 0 20px 44px rgba(31, 106, 192, .35), inset 0 1px 0 rgba(255, 255, 255, .35); opacity: 0; transform: translateY(18px); cursor: pointer; }
.mq-view[data-view="online"].is-on .mq-arena { animation: mq-hb-in .7s var(--sortie) .05s forwards; }
.mq-arena::before { content: ""; position: absolute; inset: -40% -20% auto -20%; height: 120%; background: radial-gradient(ellipse at 30% 20%, rgba(255, 255, 255, .28), transparent 55%); pointer-events: none; }
.mq-arena-sheen { position: absolute; inset: -40% auto -40% -35%; width: 34%; transform: skewX(-18deg); background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .28), transparent); animation: mq-arena-sheen 4.2s ease-in-out 1.4s infinite; }
@keyframes mq-arena-sheen { 35%, 100% { transform: translateX(430%) skewX(-18deg); } }
.mq-arena-eyebrow { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: .62rem; letter-spacing: .22em; font-weight: 950; text-transform: uppercase; opacity: .92; white-space: nowrap; }
.mq-arena-live { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .18); font-size: .58rem; letter-spacing: .08em; }
.mq-arena-live i { width: 8px; height: 8px; border-radius: 50%; background: #7dff9a; animation: mq-arena-live 1.8s ease-out infinite; }
@keyframes mq-arena-live { 0% { box-shadow: 0 0 0 0 rgba(125, 255, 154, .6); } 100% { box-shadow: 0 0 0 9px rgba(125, 255, 154, 0); } }
.mq-arena-main { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: center; margin-top: 12px; }
.mq-arena-body { min-width: 0; color: #fff; }
.mq-arena-medal { position: relative; width: 84px; height: 84px; flex: 0 0 auto; display: block; color: #7a4306; }
.mq-arena-medal .mq-arena-disc { position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffe9a3, #f5a11c 60%, #c9760d); box-shadow: 0 12px 26px rgba(201, 118, 13, .45), inset 0 -6px 12px rgba(120, 60, 0, .25), inset 0 3px 6px rgba(255, 255, 255, .55); }
.mq-arena-medal .mq-arena-ring { position: absolute; inset: -6px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .55); }
.mq-arena-medal .mq-arena-glow { position: absolute; inset: -30%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 220, 120, .55), transparent 65%); opacity: 0; }
.mq-arena-medal > svg { position: absolute; inset: 0; margin: auto; width: 42px; height: 42px; }
.mq-view[data-view="online"].is-on .mq-arena-medal { animation: mq-arena-float 3.6s ease-in-out infinite; }
.mq-view[data-view="online"].is-on .mq-arena-medal .mq-arena-glow { animation: mq-arena-glow 3.6s ease-in-out infinite; }
@keyframes mq-arena-float { 50% { transform: translateY(-6px); } }
@keyframes mq-arena-glow { 50% { opacity: 1; } }
.mq-arena-trophies { display: flex; align-items: baseline; gap: 8px; line-height: 1; }
.mq-arena-trophies strong { font-size: clamp(38px, 11vw, 50px); font-weight: 950; letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.mq-arena-trophies small { font-size: .95rem; font-weight: 900; opacity: .9; }
.mq-arena-format { margin: 6px 0 0; font-size: .8rem; font-weight: 800; opacity: .95; }
.mq-arena-format em { display: inline-flex; align-items: center; margin-left: 6px; padding: 3px 10px; border-radius: 999px; background: #fff; color: #1f6ac0; font-style: normal; font-weight: 950; font-size: .8rem; }
.mq-arena-ladder { margin-top: 10px; display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; font-size: .7rem; font-weight: 900; }
.mq-arena-ladder > span { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 999px; background: rgba(255, 255, 255, .14); }
.mq-arena-ladder > span.is-next { background: rgba(255, 255, 255, .24); }
.mq-arena-bar { height: 10px; border-radius: 999px; background: rgba(255, 255, 255, .22); overflow: hidden; position: relative; margin: 0; }
.mq-arena-bar i { display: block; height: 100%; width: var(--p, 0%); border-radius: inherit; background: linear-gradient(90deg, #ffe08a, #ffc02e); box-shadow: 0 0 12px rgba(255, 192, 46, .7); transition: width 1.4s var(--sortie) .6s; }
.mq-arena-hint { display: block; margin-top: 8px; font-size: .72rem; font-weight: 800; opacity: .9; }
/* actions */
.mq-arena-act { position: relative; display: grid; grid-template-columns: 60px 1fr 32px; align-items: center; gap: 12px; padding: 12px 12px 12px 12px; border-radius: 24px; text-align: left; color: var(--encre); background: linear-gradient(165deg, rgba(255, 255, 255, .97), rgba(255, 255, 255, .86)); border: 1px solid rgba(255, 255, 255, .9); box-shadow: 0 12px 30px rgba(21, 60, 122, .12); overflow: hidden; opacity: 0; transform: translateY(18px); transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
.mq-view[data-view="online"].is-on .mq-arena-act { animation: mq-hb-in .7s var(--sortie) forwards; }
.mq-view[data-view="online"].is-on .mq-arena-act:nth-of-type(1) { animation-delay: .18s; } .mq-view[data-view="online"].is-on .mq-arena-act:nth-of-type(2) { animation-delay: .28s; } .mq-view[data-view="online"].is-on .mq-arena-act:nth-of-type(3) { animation-delay: .38s; } .mq-view[data-view="online"].is-on .mq-arena-act:nth-of-type(4) { animation-delay: .48s; }
.mq-arena-act:active { transform: scale(.985) !important; }
.mq-arena-act::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 0% 50%, var(--tint) 0%, transparent 55%); opacity: .6; pointer-events: none; }
.mq-arena-ic { position: relative; width: 60px; height: 60px; border-radius: 19px; display: flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(145deg, var(--a), var(--b)); box-shadow: 0 10px 22px var(--glow), inset 0 1px 0 rgba(255, 255, 255, .5); }
.mq-arena-ic svg { width: 28px; height: 28px; }
.mq-arena-copy { min-width: 0; }
.mq-arena-copy strong { display: block; font-size: clamp(1rem, 4.4vw, 1.2rem); font-weight: 950; letter-spacing: -.025em; line-height: 1.1; }
.mq-arena-copy small { display: block; margin-top: 3px; font-size: .76rem; font-weight: 800; color: var(--encre-2); line-height: 1.25; }
.mq-arena-chev { width: 32px; height: 32px; border-radius: 50%; background: rgba(21, 60, 122, .06); display: flex; align-items: center; justify-content: center; color: var(--encre-2); }
.mq-arena-chev svg { width: 18px; height: 18px; }
.mq-arena-act.is-quick { --a: #5ad7e6; --b: #1f7d8a; --glow: rgba(31, 125, 138, .35); --tint: rgba(90, 215, 230, .45); }
.mq-arena-act.is-create { --a: #6f8cff; --b: #3b5fd6; --glow: rgba(59, 95, 214, .35); --tint: rgba(111, 140, 255, .4); }
.mq-arena-act.is-join { --a: #5fe0a8; --b: #1f9d55; --glow: rgba(31, 157, 85, .35); --tint: rgba(95, 224, 168, .4); }
.mq-arena-act.is-resume { --a: #ffd27a; --b: #e08a2b; --glow: rgba(224, 138, 43, .35); --tint: rgba(255, 210, 122, .45); }
.mq-shell[data-motion="calme"] .mq-view[data-view="online"] .mq-arena, .mq-shell[data-motion="calme"] .mq-view[data-view="online"] .mq-arena-act { opacity: 1; transform: none; animation: none !important; }
.mq-shell[data-motion="calme"] .mq-arena-sheen, .mq-shell[data-motion="calme"] .mq-arena-medal, .mq-shell[data-motion="calme"] .mq-arena-medal .mq-arena-glow, .mq-shell[data-motion="calme"] .mq-arena-live i { animation: none !important; }

/* =========================================================================
   FLUIDITÉ (6.28.35) — rien ne s'anime hors champ
   ========================================================================= */
/* Les vues cachées gardent leurs animations en pause : une seule vue vivante à la fois. */
.mq-view:not(.is-active), .mq-view:not(.is-active) * { animation-play-state: paused !important; }
/* Feuille, dialogue ou route des trophées ouverts : la vue en dessous et le décor s'immobilisent. */
.mq-shell.has-sheet .mq-view *, .mq-shell.has-sheet .mq-ambiance i, .mq-shell.has-sheet .mq-ambiance::before, .mq-shell.has-sheet .mq-ambiance::after { animation-play-state: paused !important; }

/* =========================================================================
   TOURNOIS EN DIRECT (6.29.0) — case du hub, écrans Tournois / Création /
   Vestiaire / Tirage / Tableau / Interlude / Tour terminé / Podium.
   ========================================================================= */
.mq-arena-act.is-tournament { --a: #ffd45a; --b: #e8951c; --glow: rgba(232, 149, 28, .38); --tint: rgba(255, 212, 90, .45); }
.mq-view[data-view="online"].is-on .mq-arena-act:nth-of-type(4) { animation-delay: .42s; }
.mq-arena-badge { position: absolute; right: 12px; top: 10px; font-size: .58rem; font-weight: 950; letter-spacing: .1em; text-transform: uppercase; padding: 4px 9px; border-radius: 99px; color: #fff; background: linear-gradient(105deg, #ff6f91, #f04438); box-shadow: 0 6px 14px rgba(240, 68, 56, .35); z-index: 1; }
.mq-arena-act.is-tournament .mq-arena-copy { padding-right: 6px; }
.mq-arena-act.is-tournament .mq-arena-copy strong::after { content: "🏆"; margin-left: 6px; font-size: .9em; }

/* cartes et textes communs */
.mq-btn.is-ghost { background: rgba(31, 157, 85, .14) !important; color: #1f9d55 !important; box-shadow: none !important; }

/* mes stats + mes tournois */

/* création : sélecteurs */

/* vestiaire */

/* tirage au sort */

/* tableau */

/* interlude aller / retour et tour terminé */

/* podium et récompenses */

/* fin de manche dans un tournoi */
@media (max-width: 360px) { .mq-tn-seats { gap: 6px; } .mq-tn-seat b { font-size: .58rem; } .mq-tn-stats b { font-size: .9rem; } }

/* ---------- Tournois V2 : héros, création par tuiles, rail d'univers, résumé collant ---------- */
@keyframes mq-h2-pulse { 70% { box-shadow: 0 0 0 7px rgba(76, 201, 63, 0); } 100% { box-shadow: 0 0 0 0 rgba(76, 201, 63, 0); } }

/* création */
@media (max-width: 360px) { .mq-tn-tiles.is-2 { grid-template-columns: 1fr; } .mq-tn-tile.is-size strong { font-size: 1.4rem; } }

/* =========================================================================
   TOURNOIS (6.30.0) — présentation portée depuis la maquette « Tournois Premium »
   (préfixe .mq-tp), élimination et championnat.
   ========================================================================= */
.mq-view[data-view="online"] > .mq-tp { flex: 1 1 auto; min-height: 0; }
.mq-tp { display: flex; flex-direction: column; height: 100%; min-height: 0; position: relative; color: var(--mq-text, var(--encre)); font-size: 15px; }
.mq-tp * { box-sizing: border-box; }
.mq-tp h2 { font-size: 30px; letter-spacing: -1.2px; line-height: 1.05; margin: 8px 0 10px; font-weight: 950; }
.mq-tp h3 { font-size: 15px; margin: 0 0 8px; font-weight: 900; }
.mq-tp p { margin: 0 0 8px; line-height: 1.45; font-weight: 700; }
.mq-tp button { border: 0; background: none; color: inherit; font: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.mq-tp button:disabled { cursor: default; opacity: .45; }
.mq-tp button:active:not(:disabled) { transform: scale(.97); }
.mq-tp input { font: inherit; }
.mq-tp .mq-tp-ic { width: 21px; height: 21px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; display: block; }
.mq-tp-back { width: 36px; height: 36px; border-radius: 50%; background: var(--mq-surface, #fff); display: grid; place-items: center; border: 1px solid var(--mq-border, rgba(21,60,122,.12)); flex-shrink: 0; }
.mq-tp-screen-head h1 { flex: 1; margin: 0; font-size: 19px; font-weight: 950; letter-spacing: -.6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mq-tp-scroll::-webkit-scrollbar { display: none; }
.mq-tp-scroll { scrollbar-width: none; }
.mq-tp-identity { display: grid; gap: 10px; }
.mq-tp-identity .mq-form-error:empty { display: none; }
.mq-tp-choices.mq-tp-five { grid-template-columns: repeat(5, 1fr); gap: 6px; }
.mq-tp-choices.mq-tp-five .mq-tp-choice { padding: 12px 4px; align-items: center; text-align: center; }
.mq-tp-choices.mq-tp-five .mq-tp-choice small { font-size: 9px; }
.mq-tp-avatar-empty { display: inline-block; width: 46px; height: 46px; border-radius: 50%; background: var(--mq-surface-raised, #f1f5f9); border: 2px dashed var(--mq-border, #cbd5e1); }
.mq-tp-bracket-match .mq-tp-avatar-empty { width: 20px; height: 20px; border-width: 1px; }
.mq-tp-seat.mq-tp-me .mq-tp-avatar { box-shadow: 0 0 0 3px #16c4ce; }
.mq-tp-training { color: #a45912 !important; }
.mq-tp-standings { padding: 8px 10px 12px; }
.mq-tp-standings-head, .mq-tp-standings-row { display: grid; grid-template-columns: 22px 1fr 26px 26px 26px 56px 34px; align-items: center; gap: 4px; padding: 8px 6px; font-size: 12px; font-weight: 800; }
.mq-tp-standings-head { color: var(--mq-text-secondary); font-size: 10px; letter-spacing: 1px; text-transform: uppercase; border-bottom: 1px solid var(--mq-border); }
.mq-tp-standings-row { border-radius: 12px; }
.mq-tp-standings-row.mq-tp-mine { background: rgba(22, 196, 206, .12); }
.mq-tp-standings-row.mq-tp-first .mq-tp-rank { background: var(--gold); color: #3a2200; }
.mq-tp-standings-row span { text-align: center; }
.mq-tp-standings-row .mq-tp-rank { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--mq-surface-raised); font-size: 11px; }
.mq-tp-standings-row .mq-tp-who { display: flex; align-items: center; gap: 6px; text-align: left; min-width: 0; }
.mq-tp-standings-row .mq-tp-who .mq-tp-avatar { width: 26px; height: 26px; }
.mq-tp-standings-row .mq-tp-who strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mq-tp-standings-row .mq-tp-diff { color: var(--mq-text-secondary); font-variant-numeric: tabular-nums; }
.mq-tp-standings-row .mq-tp-pts { font-size: 14px; font-weight: 950; color: var(--accent); }
.mq-tp-record-card .mq-tp-mini-stats { margin: 0; }
.mq-tp-sheet-backdrop { position: absolute; inset: 0; z-index: 20; background: rgba(8, 23, 44, .45); display: flex; align-items: flex-end; }
.mq-tp-sheet { width: 100%; max-height: 82%; overflow-y: auto; }
.mq-tp-round-button { width: 36px; height: 36px; border-radius: 50%; background: var(--mq-surface); display: grid; place-items: center; border: 1px solid var(--mq-border); }
.mq-tp .mq-tp-count-ring strong[data-tn-until] { font-variant-numeric: tabular-nums; }
.mq-shell[data-motion="calme"] .mq-tp * , .mq-shell[data-motion="calme"] .mq-tp *::before, .mq-shell[data-motion="calme"] .mq-tp *::after { animation: none !important; transition: none !important; }
.mq-tp-ic{width:21px;height:21px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mq-tp{--hero:#e6f8ef;--accent:#087c80;--gold:linear-gradient(115deg,#ffe58b,#ffc02e 60%,#efa22e);--ease:cubic-bezier(.32,.72,.24,1)}
.mq-shell[data-skin="ocean"] .mq-tp{--mq-bg:#ddecf8;--hero:#b5eaf5;--mq-surface-raised:#eff9ff;--mq-border:#caddf0;--accent:#1d669c}
.mq-shell[data-skin="ambre"] .mq-tp{--mq-bg:#fff4df;--hero:#ffe1a5;--mq-surface-raised:#fff9ee;--mq-border:#f0dec0;--accent:#a45912}
.mq-shell[data-skin="nuit"] .mq-tp{--mq-bg:#0b1422;--hero:#203b49;--mq-surface:#18283a;--mq-surface-raised:#20344a;--mq-text:#eff6ff;--mq-text-secondary:#aec3da;--mq-border:#34485d;--accent:#81e0d3}
.mq-shell[data-skin="nuit"] .mq-tp .mq-tp-hero{background:radial-gradient(ellipse at 70% 20%,#3c5147,transparent 70%),linear-gradient(140deg,#243c3e,#162c3c)}
.mq-tp-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:6px 20px 24px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b7d7d7 transparent}
.mq-tp-screen-head{display:flex;align-items:center;gap:9px;padding:5px 20px 12px;flex-shrink:0}
.mq-tp-screen-head h1{margin:0;font-size:23px;letter-spacing:-.8px;font-weight:950;flex:1}
.mq-tp-screen-head .mq-tp-back{padding:6px;background:none}
.mq-tp-tag{display:inline-flex;align-items:center;gap:5px;border-radius:30px;padding:6px 9px;font-size:10px;font-weight:900;letter-spacing:.4px;white-space:nowrap;background:var(--mq-surface-raised);color:var(--accent);border:1px solid var(--mq-border)}
.mq-tp-tag.mq-tp-gold{background:#fff0c5;color:#865006;border-color:#f5d68b}
.mq-tp-dot{height:6px;width:6px;border-radius:50%;background:#36b968;box-shadow:0 0 0 3px #36b96819;animation:tp-blink 2s infinite}
.mq-tp-eyebrow{font-size:10px;letter-spacing:1.8px;text-transform:uppercase;font-weight:950;color:var(--accent);margin:0 0 9px}
.mq-tp-muted{color:var(--mq-text-secondary)}
.mq-tp-row{display:flex;align-items:center;gap:10px}
.mq-tp-between{justify-content:space-between}
.mq-tp-stack{display:grid;gap:12px}
.mq-tp-section-label{display:flex;align-items:center;justify-content:space-between;margin:23px 0 12px}
.mq-tp-section-label h3{margin:0;font-size:16px}
.mq-tp-section-label small{font-size:10px;color:var(--mq-text-secondary);font-weight:800}
.mq-tp-hero{position:relative;overflow:hidden;border-radius:28px;border:1px solid #fff9;background:radial-gradient(ellipse at 80% 30%,#ffedb5a6,transparent 65%),linear-gradient(125deg,#e2faf2,#f6fbef);padding:23px 21px 0;box-shadow:0 12px 30px #153c7a12}
.mq-tp-hero .mq-tp-eyebrow{position:relative;z-index:2}
.mq-tp-hero h2{font-size:30px;max-width:188px;position:relative;z-index:2;line-height:1.04}
.mq-tp-hero h2 em{font-style:normal;color:var(--accent)}
.mq-tp-hero p{max-width:192px;position:relative;z-index:2;margin-bottom:16px;font-weight:600}
.mq-tp-hero .mq-tp-prize{display:inline-flex;gap:6px;align-items:center;color:#8e590f;background:#fff7db;border:1px solid #efd69d;padding:7px 10px;border-radius:9px;font-size:11px;font-weight:900;position:relative;z-index:2}
.mq-tp-prize .mq-tp-ic{width:16px;height:16px}
.mq-tp-hero-art{position:absolute;right:-8px;top:43px;width:154px;height:172px;pointer-events:none}
.mq-tp-halo{position:absolute;inset:9%;border:1px solid #d8be6b66;border-radius:50%;animation:tp-orbit 30s linear infinite}
.mq-tp-halo:before, .mq-tp-halo:after{content:'';position:absolute;border:1px solid #d8be6b44;border-radius:50%;inset:10px}
.mq-tp-halo:after{inset:23px}
.mq-tp-halo i{position:absolute;width:7px;height:7px;background:#edb529;border-radius:50%;top:0;left:60%}
.mq-tp-cup{width:100%;height:100%;filter:drop-shadow(0 15px 8px #80540b26);animation:tp-float 5s var(--ease) infinite}
.mq-tp-spark{position:absolute;font-size:20px;color:#c68e1d;animation:tp-twinkle 3s infinite}
.mq-tp-spark.mq-tp-a{top:6px;right:40px}
.mq-tp-spark.mq-tp-b{bottom:27px;left:24px;animation-delay:1s}
.mq-tp-hero-foot{border-top:1px solid #8db8a52f;display:flex;justify-content:space-between;margin-top:22px;padding:13px 0;position:relative;z-index:2}
.mq-tp-hero-foot span{font-size:10px;font-weight:800;color:var(--mq-text-secondary);display:flex;align-items:center;gap:4px}
.mq-tp-hero-foot b{color:var(--mq-text);font-size:14px}
.mq-tp-hero-foot .mq-tp-ic{width:15px;height:15px}
.mq-tp-primary{padding:15px 18px;border-radius:16px;display:flex;align-items:center;justify-content:center;gap:10px;background:var(--degrade);color:white;font-size:14px;font-weight:900;box-shadow:0 5px 0 #1874aa,0 10px 24px #279ac22b;min-height:48px;position:relative;overflow:hidden}
.mq-tp-primary:after{content:'';position:absolute;inset:-30% auto -30% -70%;width:35%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,#ffffff40,transparent);animation:tp-shine 6s ease-in-out infinite;pointer-events:none}
.mq-tp-primary.mq-tp-gold{background:var(--gold);color:#634315;box-shadow:0 4px 0 #ca881d,0 10px 20px #c68c1f23}
.mq-tp-primary.mq-tp-full{width:100%;margin-top:15px}
.mq-tp-secondary{display:flex;align-items:center;justify-content:center;gap:7px;min-height:43px;padding:10px 14px;border-radius:13px;background:var(--mq-surface-raised);color:var(--mq-text);border:1px solid var(--mq-border);font-size:12px;font-weight:850}
.mq-tp-text-button{display:flex;align-items:center;gap:5px;background:none;font-size:11px;font-weight:850;color:var(--accent);padding:7px 0}
.mq-tp-text-button .mq-tp-ic{width:14px;height:14px}
.mq-tp-card{padding:16px;border-radius:22px;background:var(--mq-surface);border:1px solid var(--mq-border);box-shadow:0 6px 18px #153c7a05}
.mq-tp-resume{display:flex;align-items:center;gap:10px;border:1px solid #e7c668;background:var(--mq-surface);padding:13px;border-radius:18px;position:relative}
.mq-tp-resume:before{content:'';position:absolute;inset:8px auto 8px 0;width:3px;background:#edb829;border-radius:0 3px 3px 0}
.mq-tp-resume .mq-tp-symbol{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#fff1c9;color:#a06a13}
.mq-tp-resume strong{font-size:12px;display:block}
.mq-tp-resume small{font-size:10px;display:block;color:var(--mq-text-secondary);margin-top:4px}
.mq-tp-resume .mq-tp-text-button{margin-left:auto}
.mq-tp-code-entry{display:flex;gap:8px;align-items:center}
.mq-tp-code-entry input{min-width:0;width:100%;border:1px solid var(--mq-border);border-radius:12px;padding:12px;background:var(--mq-surface-raised);color:var(--mq-text);letter-spacing:4px;font-size:17px;font-weight:800}
.mq-tp-code-entry button{width:43px;min-height:43px;flex-shrink:0}
.mq-tp-error{color:#c13c50;font-size:11px;min-height:0;margin:7px 0 0}
.mq-tp-public-card{display:flex;align-items:center;gap:12px;padding:14px;background:var(--mq-surface);border-radius:19px;border:1px solid var(--mq-border)}
.mq-tp-public-card .mq-tp-copy{flex:1;min-width:0}
.mq-tp-public-card strong{font-size:12px;display:block}
.mq-tp-public-card small{font-size:10px;display:block;color:var(--mq-text-secondary);line-height:1.5;margin-top:3px}
.mq-tp-public-card .mq-tp-secondary{padding:9px 10px;font-size:10px;min-height:39px;color:var(--accent)}
.mq-tp-avatar{width:42px;height:42px;object-fit:cover;border-radius:50%;border:2px solid var(--mq-surface);box-shadow:0 3px 10px #153c7a1f;background:#cbdad9;flex-shrink:0}
.mq-tp-meter{height:4px;border-radius:5px;background:var(--mq-border);overflow:hidden;margin:8px 0 4px}
.mq-tp-meter i{display:block;height:100%;background:var(--degrade);border-radius:5px;transform-origin:left;animation:tp-grow .8s var(--sortie) both}
.mq-tp-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}
.mq-tp-mini-stats div{text-align:center;padding:13px 4px;background:var(--mq-surface);border:1px solid var(--mq-border);border-radius:16px}
.mq-tp-mini-stats strong{font-size:19px;font-weight:950;display:block}
.mq-tp-mini-stats small{font-size:10px;color:var(--mq-text-secondary)}
.mq-tp-enter{animation:tp-enter .55s var(--sortie) both}
.mq-tp-stagger>*{animation:tp-enter .55s var(--sortie) both}
.mq-tp-stagger>*:nth-child(2){animation-delay:.07s}
.mq-tp-stagger>*:nth-child(3){animation-delay:.14s}
.mq-tp-stagger>*:nth-child(4){animation-delay:.21s}
.mq-tp-stagger>*:nth-child(5){animation-delay:.28s}
.mq-tp-stagger>*:nth-child(6){animation-delay:.35s}
.mq-tp-foot{padding:12px 20px 15px;background:var(--mq-surface);border-top:1px solid var(--mq-border);flex-shrink:0}
.mq-tp-foot p{font-size:10px;text-align:center;margin:0 0 9px;color:var(--mq-text-secondary)}
.mq-tp-foot .mq-tp-primary{width:100%}
.mq-tp-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.mq-tp-choices.mq-tp-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.mq-tp-choice{min-width:0;position:relative;text-align:left;padding:16px 12px;border-radius:17px;border:1.5px solid var(--mq-border);background:var(--mq-surface);display:flex;flex-direction:column;gap:7px;transition:transform .2s var(--ease);font-weight:850}
.mq-tp-choice .mq-tp-ic{color:var(--mq-text-secondary);height:23px;width:23px}
.mq-tp-choice strong{font-size:12px}
.mq-tp-choice small{font-size:10px;line-height:1.4;color:var(--mq-text-secondary);font-weight:600}
.mq-tp-choice .mq-tp-big{font-size:30px;letter-spacing:-1px}
.mq-tp-choice.mq-tp-selected{border-color:#1babac;background:var(--mq-surface-raised);box-shadow:0 0 0 2px #1babac15}
.mq-tp-choice.mq-tp-selected:after{content:'✓';position:absolute;top:8px;right:8px;width:17px;height:17px;display:grid;place-items:center;background:#119397;color:white;border-radius:50%;font-size:10px}
.mq-tp-choice.mq-tp-selected .mq-tp-ic{color:var(--accent)}
.mq-tp-rail{display:flex;gap:9px;overflow-x:auto;padding:3px 2px 8px;scrollbar-width:thin}
.mq-tp-universe{min-width:100px;width:100px;padding:6px;align-items:center;flex-shrink:0}
.mq-tp-universe img{width:85px;height:62px;object-fit:contain}
.mq-tp-universe strong{font-size:10px}
.mq-tp-toggle{width:100%;background:var(--mq-surface);border:1px solid var(--mq-border);border-radius:17px;padding:15px;margin-top:12px;display:flex;align-items:center;justify-content:space-between;text-align:left}
.mq-tp-toggle strong{font-size:12px}
.mq-tp-toggle small{display:block;color:var(--mq-text-secondary);font-size:10px;margin-top:4px}
.mq-tp-switch{height:25px;width:44px;background:var(--mq-border);border-radius:20px;padding:3px;flex-shrink:0}
.mq-tp-switch:after{content:'';display:block;width:19px;height:19px;border-radius:50%;background:white;transition:transform .2s}
.mq-tp-toggle[aria-checked=true] .mq-tp-switch{background:#1cac98}
.mq-tp-toggle[aria-checked=true] .mq-tp-switch:after{transform:translateX(19px)}
.mq-tp-name-input{width:100%;padding:12px 0 4px;background:none;color:var(--mq-text);font-size:20px;font-weight:900;border:0;border-bottom:1px solid var(--mq-border)}
.mq-tp-lobby-title{text-align:center;margin-top:10px}
.mq-tp-lobby-title h2{font-size:26px}
.mq-tp-lobby-code{display:flex;align-items:center;gap:8px;justify-content:center;margin:12px 0 22px}
.mq-tp-lobby-code button{background:var(--mq-surface);border:1px dashed #9eb9bb;border-radius:10px;padding:9px 14px;font-weight:900;letter-spacing:3px;display:flex;align-items:center;gap:14px}
.mq-tp-lobby-code .mq-tp-ic{width:16px;height:16px;letter-spacing:0}
.mq-tp-seats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px 7px}
.mq-tp-seat{text-align:center;position:relative;min-width:0;padding:6px 0}
.mq-tp-seat .mq-tp-avatar{width:54px;height:54px;border:3px solid var(--mq-surface)}
.mq-tp-seat.mq-tp-ready .mq-tp-avatar{border-color:#67c98e}
.mq-tp-seat .mq-tp-photo{position:relative;display:inline-block}
.mq-tp-seat .mq-tp-check{position:absolute;right:-1px;bottom:3px;border:2px solid var(--mq-surface);border-radius:50%;height:18px;width:18px;display:grid;place-items:center;background:#2dae65;color:white;font-size:10px}
.mq-tp-seat strong{display:block;font-size:11px;margin:6px 0 2px;overflow:hidden;text-overflow:ellipsis}
.mq-tp-seat small{display:block;font-size:8px;color:var(--mq-text-secondary)}
.mq-tp-empty-seat{width:54px;height:54px;border:1.5px dashed #acc3c6;border-radius:50%;margin:auto;display:grid;place-items:center;color:#9cb3bd;font-size:21px}
.mq-tp-lobby-status{display:flex;align-items:center;gap:12px;margin:22px 0 0;padding:14px;border-radius:17px;background:var(--mq-surface-raised)}
.mq-tp-lobby-status p{margin:0;font-size:11px}
.mq-tp-lobby-status .mq-tp-ic{color:var(--accent)}
.mq-tp-round-progress{display:flex;gap:4px;justify-content:center;margin:18px 0}
.mq-tp-round-progress i{width:20px;height:4px;border-radius:3px;background:var(--mq-border)}
.mq-tp-round-progress .mq-tp-on{background:#1fa9ad}
.mq-tp-center{text-align:center}
.mq-tp-count-ring{height:175px;width:175px;margin:22px auto;position:relative;display:grid;place-items:center;border-radius:50%;border:1px solid var(--mq-border);background:var(--mq-surface);box-shadow:0 0 0 12px var(--mq-surface-raised),0 20px 40px #153c7a17}
.mq-tp-count-ring:before{content:'';position:absolute;inset:-6px;border-radius:50%;border:4px solid transparent;border-top-color:#e5b130;border-right-color:#1eb6b9;animation:tp-orbit 2s linear infinite}
.mq-tp-count-ring strong{display:block;font-size:62px;letter-spacing:-4px;font-weight:950;line-height:1.1}
.mq-tp-count-ring small{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--mq-text-secondary)}
.mq-tp-overlap{display:flex;justify-content:center;margin:19px 0}
.mq-tp-overlap .mq-tp-avatar{margin-left:-8px;width:35px;height:35px}
.mq-tp-overlap .mq-tp-avatar:first-child{margin-left:0}
.mq-tp-draw-stage{height:256px;position:relative;display:grid;place-items:center;margin:8px 0}
.mq-tp-draw-stage .mq-tp-cup{width:170px;height:170px}
.mq-tp-orbit-avatars{position:absolute;width:235px;height:235px;border:1px dashed var(--mq-border);border-radius:50%;animation:tp-orbit 16s linear infinite}
.mq-tp-orbit-avatars img{position:absolute;width:46px;height:46px;left:calc(50% - 23px);top:calc(50% - 23px);transform:rotate(var(--angle)) translateY(-116px) rotate(calc(-1 * var(--angle)));border:3px solid var(--mq-surface)}
.mq-tp-round-tabs{display:flex;gap:6px;overflow-x:auto;margin:3px 0 16px;scrollbar-width:none}
.mq-tp-round-tabs button{white-space:nowrap;background:var(--mq-surface);padding:9px 12px;border:1px solid var(--mq-border);border-radius:20px;font-size:10px;font-weight:900}
.mq-tp-round-tabs button.mq-tp-active{color:var(--mq-bg);background:var(--mq-text);border-color:var(--mq-text)}
.mq-tp-match-card{border:1px solid var(--mq-border);border-radius:20px;background:var(--mq-surface);padding:15px;margin-bottom:12px}
.mq-tp-match-card.mq-tp-mine{border:1.5px solid #d8b65a;box-shadow:0 6px 22px #bc942919}
.mq-tp-match-head{display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.7px;color:var(--mq-text-secondary);margin-bottom:13px}
.mq-tp-versus{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px}
.mq-tp-contender{text-align:center;min-width:0}
.mq-tp-contender .mq-tp-avatar{width:49px;height:49px}
.mq-tp-contender strong{display:block;font-size:12px;margin-top:5px}
.mq-tp-contender.mq-tp-won strong{color:var(--accent)}
.mq-tp-contender.mq-tp-lost{opacity:.55}
.mq-tp-score{text-align:center;font-size:28px;letter-spacing:-1px;font-weight:950;font-variant-numeric:tabular-nums}
.mq-tp-score small{display:block;font-size:8px;letter-spacing:1px;font-weight:700;color:var(--mq-text-secondary);margin-top:4px;text-transform:uppercase}
.mq-tp-match-detail{text-align:center;font-size:9px;color:var(--mq-text-secondary);border-top:1px solid var(--mq-border);padding-top:10px;margin-top:12px;line-height:1.9}
.mq-tp-match-card .mq-tp-primary{margin-top:13px;min-height:40px;padding:11px;font-size:12px;box-shadow:0 3px 0 #1874aa}
.mq-tp-bracket{display:flex;gap:12px;overflow-x:auto;padding:0 0 14px;align-items:center;scrollbar-width:thin}
.mq-tp-bracket-col{min-width:174px;flex:0 0 174px;display:grid;gap:9px}
.mq-tp-bracket-col>small{font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:1px}
.mq-tp-bracket-match{background:var(--mq-surface);border:1px solid var(--mq-border);border-radius:12px;padding:10px;font-size:10px}
.mq-tp-bracket-match.mq-tp-mine{border-color:#d7b259}
.mq-tp-bracket-match div{display:flex;justify-content:space-between;padding:5px 0}
.mq-tp-bracket-match .mq-tp-winner{color:var(--accent);font-weight:900}
.mq-tp-bracket-match .mq-tp-eliminated{opacity:.5}
.mq-tp-bracket-match .mq-tp-avatar{width:20px;height:20px;vertical-align:middle;margin-right:5px}
.mq-tp-bracket-match span{display:flex;align-items:center}
.mq-tp-mode-switch{display:flex;gap:5px}
.mq-tp-mode-switch button{background:var(--mq-surface);border:1px solid var(--mq-border);border-radius:9px;padding:7px 9px;font-size:10px}
.mq-tp-mode-switch .mq-tp-active{background:var(--mq-text);color:var(--mq-bg)}
.mq-tp-duel-score{display:flex;justify-content:space-between;align-items:center;background:var(--mq-surface);border:1px solid var(--mq-border);border-radius:20px;padding:12px 15px}
.mq-tp-duel-score .mq-tp-avatar{width:36px;height:36px}
.mq-tp-duel-score strong{font-size:12px}
.mq-tp-duel-score b{font-size:22px;letter-spacing:-1px;display:block}
.mq-tp-duel-score small{font-size:9px;color:var(--mq-text-secondary)}
.mq-tp-duel-score .mq-tp-right{text-align:right}
.mq-tp-turn-pill{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;font-weight:900;color:var(--accent);padding:14px 0}
.mq-tp-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;perspective:1000px}
.mq-tp-memory{aspect-ratio:1/1.07;position:relative;background:none;border-radius:12px;padding:0;transform-style:preserve-3d;transition:transform .5s var(--ressort);box-shadow:0 4px 0 #2c889a,0 7px 12px #153c7a0d}
.mq-tp-memory>span{position:absolute;inset:0;border-radius:12px;display:grid;place-items:center;backface-visibility:hidden}
.mq-tp-memory .mq-tp-front{background:linear-gradient(135deg,#35cbd0,#2489b2);border:2px solid #ffffffa0;overflow:hidden}
.mq-tp-memory .mq-tp-front:before{content:'';position:absolute;inset:6px;border-radius:7px;border:1px solid #ffffff40}
.mq-tp-memory .mq-tp-front .mq-tp-ic{color:#ffffff9c;width:30px;height:30px;transform:rotate(-10deg)}
.mq-tp-memory .mq-tp-face{background:var(--mq-surface);border:2px solid #cde5dd;transform:rotateY(180deg);font-size:28px}
.mq-tp-memory.mq-tp-revealed, .mq-tp-memory.mq-tp-matched{transform:rotateY(180deg)}
.mq-tp-memory.mq-tp-matched{box-shadow:0 3px 0 #69b793}
.mq-tp-memory.mq-tp-matched .mq-tp-face{border-color:#52c994;background:#effbf5}
.mq-tp-duel-tip{font-size:10px;text-align:center;color:var(--mq-text-secondary);margin:14px 0 0}
.mq-tp-interlude-avatar{display:flex;align-items:center;justify-content:center;gap:20px;margin:28px 0}
.mq-tp-interlude-avatar .mq-tp-avatar{height:74px;width:74px;border:4px solid #e6c16c}
.mq-tp-interlude-avatar .mq-tp-ic{width:32px;height:32px;color:var(--accent)}
.mq-tp-result-mark{display:grid;place-items:center;margin:20px auto 17px;width:68px;height:68px;border-radius:23px;background:var(--gold);color:#875b13;box-shadow:0 9px 24px #c99b2826;animation:tp-stamp .8s var(--ressort) both}
.mq-tp-result-mark .mq-tp-ic{width:36px;height:36px}
.mq-tp-points-table{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;text-align:center;font-size:11px;margin:10px 0}
.mq-tp-points-table .mq-tp-muted{font-size:9px}
.mq-tp-points-table b{font-size:17px}
.mq-tp-total-row{display:flex;justify-content:space-between;padding-top:13px;border-top:1px solid var(--mq-border);font-size:12px;font-weight:900}
.mq-tp-total-row strong{color:var(--accent)}
.mq-tp-qualifier{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--mq-border);font-size:12px}
.mq-tp-qualifier:last-child{border:0}
.mq-tp-qualifier small{display:block;color:var(--mq-text-secondary);font-size:10px}
.mq-tp-qualifier>.mq-tp-ic{margin-left:auto;color:var(--accent)}
.mq-tp-qualifier .mq-tp-avatar{height:36px;width:36px}
.mq-tp-podium-scene{position:relative;text-align:center;overflow:hidden;padding:6px 0 0}
.mq-tp-podium-scene h2{font-size:37px;letter-spacing:-1.5px;margin-bottom:7px}
.mq-tp-podium-scene .mq-tp-eyebrow{color:var(--accent)}
.mq-tp-podium{display:flex;align-items:flex-end;justify-content:center;height:258px;padding:0 5px;margin-top:3px;gap:6px}
.mq-tp-podium-place{width:31%;position:relative;animation:tp-podium 1.1s var(--sortie) both;transform-origin:bottom}
.mq-tp-podium-place:nth-child(1){animation-delay:.2s}
.mq-tp-podium-place:nth-child(3){animation-delay:.4s}
.mq-tp-podium-place .mq-tp-avatar{width:56px;height:56px;border:3px solid #dbe5eb;display:block;margin:0 auto 6px}
.mq-tp-podium-place.mq-tp-champion .mq-tp-avatar{width:76px;height:76px;border:4px solid #ffc02e;box-shadow:0 0 0 7px #ffcd3c22,0 0 40px #ffc02e46}
.mq-tp-podium-place strong{font-size:11px;display:block;margin-bottom:9px}
.mq-tp-step{border-radius:15px 15px 0 0;border:1px solid #c7d3df;background:linear-gradient(120deg,#edf4fa,#bbcfdd);height:85px;display:grid;place-items:center;color:#506c89;font-size:38px;font-weight:950;box-shadow:inset 0 2px 0 #fff9}
.mq-tp-champion .mq-tp-step{height:119px;border-color:#e6b643;background:linear-gradient(125deg,#fff0b7,#ffce52 55%,#eda931);color:#97620d;font-size:50px}
.mq-tp-bronze .mq-tp-step{height:65px;border-color:#dfb08b;background:linear-gradient(120deg,#f5ddc7,#d79c73);color:#955a33}
.mq-tp-crown{color:#e8af29;position:absolute;top:-29px;left:calc(50% - 17px);font-size:27px;animation:tp-float 3s infinite}
.mq-tp-reward-card{position:relative;border:1px solid #ddbd69;border-radius:20px;background:var(--mq-surface);padding:16px;margin-top:16px;text-align:center}
.mq-tp-reward-title{font-size:12px;font-weight:900;display:flex;align-items:center;gap:7px;justify-content:center}
.mq-tp-reward-title .mq-tp-ic{color:#bf8a19}
.mq-tp-reward-values{display:grid;grid-template-columns:1fr 1fr;margin:16px 0 0;gap:8px}
.mq-tp-reward-values b{font-size:25px;letter-spacing:-1px}
.mq-tp-reward-values small{display:block;font-size:10px;color:var(--mq-text-secondary);margin-top:3px}
.mq-tp-reward-values>div+div{border-left:1px solid var(--mq-border)}
.mq-tp-confetti-layer{position:absolute;inset:0;pointer-events:none;z-index:8;overflow:hidden}
.mq-tp-confetti-layer i{position:absolute;left:var(--x);top:-15px;width:7px;height:12px;background:var(--c);animation:tp-confetti var(--d) var(--delay) ease-in both}
.mq-tp-share-row{display:flex;gap:8px;margin-top:13px}
.mq-tp-share-row button{flex:1}
.mq-tp-share-row .mq-tp-primary{box-shadow:0 3px 0 #1874aa;font-size:12px}
.mq-tp-hub-tile{width:100%;text-align:left;margin:14px 0;padding:22px;border:1px solid #dbb352;border-radius:24px;background:var(--gold);color:#67470f;box-shadow:0 5px 0 #ce9a2c,0 15px 35px #b8972e20;position:relative;overflow:hidden}
.mq-tp-hub-tile h2{font-size:27px;margin:16px 0 6px}
.mq-tp-hub-tile p{font-size:12px;margin:0;max-width:220px}
.mq-tp-hub-tile>.mq-tp-ic{position:absolute;right:25px;top:33px;width:60px;height:60px;transform:rotate(12deg)}
.mq-tp-hub-tile .mq-tp-tag{background:#fff7d9;color:#765415;border-color:#e3c16d}
.mq-tp-hub-tile:after{content:'';position:absolute;width:150px;height:200%;background:#fff3;right:-70px;top:-50%;transform:rotate(25deg)}
.mq-tp-sheet-backdrop{position:absolute;inset:0;z-index:20;background:#051b3b70;display:flex;align-items:flex-end;padding:12px}
.mq-tp-sheet{width:100%;max-height:90%;overflow-y:auto;padding:21px;border:1px solid var(--mq-border);border-radius:26px;background:var(--mq-surface);box-shadow:0 20px 60px #0003;animation:tp-enter .4s var(--sortie)}
.mq-tp-sheet h2{font-size:24px}
.mq-tp-sheet .mq-tp-choices{gap:7px}
.mq-tp-sheet .mq-tp-choice{padding:11px;font-size:11px}
.mq-tp-sheet .mq-tp-section-label{margin:19px 0 10px}
.mq-tp-sheet .mq-tp-palette{height:20px;width:100%;border-radius:6px}
.mq-tp-toast{position:absolute;bottom:88px;left:20px;right:20px;text-align:center;z-index:40;background:var(--mq-text);color:var(--mq-bg);padding:13px 15px;border-radius:15px;font-size:12px;box-shadow:0 8px 30px #0002;animation:tp-enter .3s var(--sortie);pointer-events:none}
.mq-tp-help-content p{font-size:12px}
.mq-tp-small-note{font-size:10px;color:var(--mq-text-secondary);text-align:center;margin:16px 0 0}
.mq-tp-no-margin{margin:0}
.mq-tp-badge-seal{height:65px;width:65px;margin:0 auto 13px;border-radius:50%;display:grid;place-items:center;background:var(--gold);border:4px double #fff1ba;color:#8e611a;box-shadow:0 4px 18px #d2aa3333;animation:tp-stamp .9s var(--ressort)}
.mq-tp-badge-seal .mq-tp-ic{height:34px;width:34px}
@keyframes tp-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes tp-float{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-8px) rotate(3deg)}}
@keyframes tp-orbit{to{transform:rotate(360deg)}}
@keyframes tp-twinkle{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
@keyframes tp-blink{50%{opacity:.45}}
@keyframes tp-shine{0%,65%{transform:translateX(0) skewX(-20deg)}100%{transform:translateX(600%) skewX(-20deg)}}
@keyframes tp-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes tp-podium{from{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}
@keyframes tp-stamp{0%{opacity:0;transform:scale(2) rotate(-20deg)}65%{opacity:1;transform:scale(.9) rotate(3deg)}100%{transform:scale(1) rotate(0)}}
@keyframes tp-confetti{0%{opacity:0;transform:translateY(0) rotate(0)}10%{opacity:1}100%{opacity:0;transform:translateY(700px) rotate(700deg)}}
.mq-shell[data-motion="calme"] .mq-tp *, .mq-shell[data-motion="calme"] .mq-tp *:before, .mq-shell[data-motion="calme"] .mq-tp *:after{animation:none!important;transition:none!important}
.mq-shell[data-motion="calme"] .mq-tp .mq-tp-confetti-layer{display:none}
@media(prefers-reduced-motion:reduce){.mq-tp *, .mq-tp *:before, .mq-tp *:after{animation:none!important;transition:none!important}.mq-tp-confetti-layer{display:none}}
@media(min-width:700px){.mq-tp{height:min(930px,96dvh);margin:2dvh auto;border:1px solid #fff9;border-radius:32px}}
@media(max-width:374px){.mq-tp-scroll{padding-left:16px;padding-right:16px}.mq-tp-screen-head{padding-left:16px;padding-right:16px}.mq-tp-hero{padding:20px 17px 0}.mq-tp-hero h2{font-size:28px;max-width:176px}.mq-tp-hero-art{width:133px;right:-9px;top:44px}.mq-tp-hero p{max-width:177px;font-size:11px}.mq-tp-hero-foot span{font-size:9px}.mq-tp-hero-foot b{font-size:12px}.mq-tp-choice{padding:14px 10px}.mq-tp-podium-scene h2{font-size:33px}.mq-tp-seat .mq-tp-avatar, .mq-tp-empty-seat{width:49px;height:49px}}

/* =========================================================================
   TOURNOIS 6.30.1 — plein écran, rails horizontaux, tuiles homogènes.
   Ce bloc corrige les défauts relevés : double en-tête, murs de tuiles,
   coches sur le texte, textes non centrés, fonds qui se superposent.
   ========================================================================= */

/* --- plein écran : la barre du jeu disparaît, la section prend toute la hauteur --- */
.mq-shell.is-tp-full .mq-top { display: none !important; }
.mq-shell.is-tp-full .mq-stage { padding-top: calc(env(safe-area-inset-top) + 6px); }
.mq-shell.is-tp-full .mq-view[data-view="online"] { gap: 0; }
.mq-tp { background: linear-gradient(180deg, var(--mq-bg, #eef8f0) 0%, var(--mq-surface-raised, #f6fbfe) 46%, var(--mq-bg, #eef8f0) 100%); border-radius: 26px; overflow: hidden; }
.mq-shell[data-skin="nuit"] .mq-tp, .mq-shell[data-skin="ardoise"] .mq-tp { background: linear-gradient(180deg, rgba(11,20,34,.9), rgba(24,40,58,.9)); }

/* --- en-tête de section : un seul, compact, aligné --- */
.mq-tp-screen-head { padding: 10px 16px 8px; gap: 10px; }
.mq-tp-screen-head h1 { font-size: 20px; }
.mq-tp-scroll { padding: 2px 16px 18px; }
.mq-tp-foot { padding: 10px 16px calc(env(safe-area-inset-bottom) + 12px); background: var(--mq-surface, #fff); border-top: 1px solid var(--mq-border, rgba(21,60,122,.08)); }
.mq-tp-foot p { margin: 0 0 8px; font-size: 12px; line-height: 1.45; font-weight: 800; color: var(--mq-text-secondary); text-align: center; }
.mq-tp-foot p b { color: var(--mq-text); }

/* --- titres de section dans la charte du jeu --- */
.mq-tp-section-label { margin: 18px 0 8px; align-items: baseline; }
.mq-tp-section-label h3 { font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--turq-2); font-weight: 950; }
.mq-tp-section-label small { font-size: 11px; font-weight: 900; color: var(--mq-text); }

/* --- rails horizontaux : cartes de taille fixe, défilement magnétique --- */
.mq-tp-rail { display: flex; gap: 10px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; margin: 0 -16px; padding: 2px 16px 10px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.mq-tp-rail::-webkit-scrollbar { display: none; }
.mq-tp-rail > .mq-tp-choice { scroll-snap-align: center; flex: 0 0 auto; }
.mq-tp-rail-wide > .mq-tp-choice { width: 200px; height: 132px; }
.mq-tp-rail-mid > .mq-tp-choice { width: 124px; height: 116px; }
.mq-tp-rail-small > .mq-tp-choice { width: 104px; height: 116px; }
.mq-tp-rail > .mq-tp-universe { width: 116px; height: 148px; }

/* --- tuiles : fond blanc dans tous les états, coche dans un coin réservé --- */
.mq-tp-choice { display: flex; flex-direction: column; gap: 4px; padding: 12px; border-radius: 20px; text-align: left; overflow: hidden;
	background: var(--mq-surface, #fff); border: 2px solid var(--mq-border, rgba(21,60,122,.1));
	box-shadow: 0 8px 20px rgba(21,60,122,.08); transition: transform .2s var(--ressort), border-color .2s, box-shadow .2s; }
.mq-tp-choice-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: 24px; }
.mq-tp-choice-top > i:first-child { display: block; width: 23px; height: 23px; }
.mq-tp-choice .mq-tp-ic { width: 23px; height: 23px; color: var(--turq-2); }
.mq-tp-choice-mark { width: 21px; height: 21px; flex: 0 0 auto; border-radius: 50%; background: var(--mq-surface-raised, #eef4fb); border: 1.5px solid var(--mq-border, rgba(21,60,122,.14)); transition: background .2s, border-color .2s; }
.mq-tp-choice strong { display: block; font-size: 13px; font-weight: 950; letter-spacing: -.2px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mq-tp-choice small { display: -webkit-box; font-size: 10.5px; line-height: 1.35; font-weight: 700; color: var(--mq-text-secondary); -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mq-tp-choice .mq-tp-big { display: block; font-size: 34px; line-height: 1; letter-spacing: -2px; font-weight: 950; text-align: center; margin-top: 2px; }
.mq-tp-choice .mq-tp-mid { display: block; font-size: 19px; line-height: 1.1; letter-spacing: -.5px; font-weight: 950; text-align: center; margin-top: 4px; }
.mq-tp-choice.mq-tp-tile-size small, .mq-tp-choice.mq-tp-tile-grid small { text-align: center; -webkit-line-clamp: 1; }
.mq-tp-choice.mq-tp-tile-size strong, .mq-tp-choice.mq-tp-tile-grid strong { text-align: center; }
.mq-tp-choice.mq-tp-tile-mode { align-items: center; text-align: center; }
.mq-tp-choice.mq-tp-tile-mode .mq-tp-choice-top { width: 100%; }
.mq-tp-choice.mq-tp-tile-mode strong { white-space: normal; font-size: 12px; }
.mq-tp-choice:active:not(:disabled) { transform: scale(.96); }
.mq-tp-choice.mq-tp-selected { border-color: var(--turq); background: var(--mq-surface, #fff); box-shadow: 0 12px 26px rgba(22,196,206,.24); transform: translateY(-2px); }
.mq-tp-choice.mq-tp-selected:after { content: none; }
.mq-tp-choice.mq-tp-selected .mq-tp-choice-mark { background-color: #2e86e0; border-color: #2e86e0;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5l4.5 4.5L19 7.5'/></svg>"), linear-gradient(105deg, #16c4ce, #2e86e0);
	background-size: 62% 62%, 100% 100%; background-position: center; background-repeat: no-repeat; box-shadow: 0 4px 10px rgba(46,134,224,.32); }
.mq-tp-choice.mq-tp-selected .mq-tp-ic { color: var(--bleu-2); }
.mq-tp-universe { padding: 8px; }
.mq-tp-universe .mq-tp-choice-top { min-height: 21px; }
.mq-tp-universe img { width: 100%; height: 74px; object-fit: cover; border-radius: 14px; margin: 2px 0 6px; background: var(--mq-surface-raised); }
.mq-tp-universe strong { font-size: 12px; text-align: center; width: 100%; }

/* --- carte du nom, interrupteur, identité --- */
.mq-tp-name-card { display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
.mq-tp-name-ic { width: 46px; height: 46px; flex: 0 0 auto; border-radius: 16px; display: grid; place-items: center; color: #fff; background: var(--gold, linear-gradient(115deg,#ffe58b,#ffc02e 60%,#efa22e)); box-shadow: 0 8px 18px rgba(232,149,28,.32); }
.mq-tp-name-ic .mq-tp-ic { width: 24px; height: 24px; }
.mq-tp-name-field { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.mq-tp-name-field > span { font-size: 10px; letter-spacing: 1.4px; text-transform: uppercase; font-weight: 950; color: var(--mq-text-secondary); }
.mq-tp-name-input { padding: 4px 0 3px; font-size: 18px; border-bottom-color: transparent; }
.mq-tp-toggle { border-radius: 20px; padding: 13px 14px; margin-top: 14px; border: 2px solid var(--mq-border, rgba(21,60,122,.1)); box-shadow: 0 8px 20px rgba(21,60,122,.08); }
.mq-tp-toggle[aria-checked="true"] { border-color: var(--turq); }
.mq-tp-identity { margin-top: 14px; display: grid; gap: 8px; }
.mq-tp-identity .mq-form-error:empty { display: none; }

/* --- boutons : texte centré au pixel, icône hors du flux --- */
.mq-tp-primary, .mq-tp-secondary, .mq-tp-text-button { position: relative; }
.mq-tp-primary { min-height: 56px; padding: 0 52px; border-radius: 20px; display: flex; align-items: center; justify-content: center; gap: 0; font-size: 15.5px; letter-spacing: .2px; text-align: center; }
.mq-tp-primary > .mq-tp-ic { position: absolute; right: 18px; top: 50%; margin-top: -11px; }
.mq-tp-primary > .mq-tp-ic:first-child { right: auto; left: 18px; }
.mq-tp-primary.mq-tp-full { margin-top: 12px; }
.mq-tp-secondary { min-height: 44px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-align: center; }
.mq-tp-text-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.mq-tp-back { border-radius: 14px; }

/* --- listes et cartes : marges homogènes, plus de bandes --- */
.mq-tp-card { padding: 14px; border-radius: 22px; box-shadow: 0 8px 22px rgba(21,60,122,.07); }
.mq-tp-public-card, .mq-tp-resume, .mq-tp-lobby-status, .mq-tp-match-card, .mq-tp-reward-card { border-radius: 20px; }
.mq-tp-hero { border-radius: 24px; }
@media (max-width: 360px) {
	.mq-tp-rail-wide > .mq-tp-choice { width: 176px; }
	.mq-tp-scroll, .mq-tp-screen-head, .mq-tp-foot { padding-left: 13px; padding-right: 13px; }
	.mq-tp-rail { margin: 0 -13px; padding-left: 13px; padding-right: 13px; }
}

/* =========================================================================
   TOURNOIS 6.30.3 — DESIGN V2 PREMIUM COMPACT
   Objectifs : densité mobile, hiérarchie nette, CTA 44–48 px, thèmes complets,
   zéro débordement à 360 px, animations GPU légères et mode Calme respecté.
   ========================================================================= */

/* --- bouton Tournois du hub multijoueur : cohérent avec les autres actions --- */
.mq-arena-act.is-tournament {
	grid-template-columns: 52px minmax(0,1fr) 28px;
	gap: 10px;
	min-height: 72px;
	padding: 10px 10px;
	border-radius: 20px;
	border-color: rgba(255,255,255,.88);
	background:
		radial-gradient(circle at 8% 50%, rgba(255,220,120,.23), transparent 38%),
		linear-gradient(165deg, rgba(255,255,255,.98), rgba(255,250,238,.92));
	box-shadow: 0 8px 22px rgba(94,64,12,.10), 0 1px 0 rgba(255,255,255,.72) inset;
}
.mq-arena-act.is-tournament .mq-arena-ic {
	width: 52px; height: 52px; border-radius: 16px;
	box-shadow: 0 7px 18px var(--glow), inset 0 1px 0 rgba(255,255,255,.5);
}
.mq-arena-act.is-tournament .mq-arena-ic svg { width: 25px; height: 25px; }
.mq-arena-act.is-tournament .mq-arena-copy { padding-right: 42px; }
.mq-arena-act.is-tournament .mq-arena-copy strong { font-size: 1rem; }
.mq-arena-act.is-tournament .mq-arena-copy strong::after { content: none; }
.mq-arena-act.is-tournament .mq-arena-copy small { font-size: .70rem; line-height: 1.28; }
.mq-arena-act.is-tournament .mq-arena-chev { width: 28px; height: 28px; }
.mq-arena-act.is-tournament .mq-arena-chev svg { width: 16px; height: 16px; }
.mq-arena-act.is-tournament .mq-arena-badge {
	top: 8px; right: 40px; padding: 3px 7px; font-size: .50rem;
	letter-spacing: .08em; box-shadow: none;
	background: linear-gradient(105deg,#f09a2a,#d46b24);
}

/* --- palette et matériaux V2 --- */
.mq-tp-v2 {
	--tp-a: #13b8b4;
	--tp-b: #2f7edb;
	--tp-gold: #e9b544;
	--tp-gold-2: #c7861f;
	--tp-panel: rgba(255,255,255,.92);
	--tp-panel-2: rgba(246,251,252,.92);
	--tp-line: rgba(28,77,105,.11);
	--tp-soft: rgba(18,184,180,.10);
	--tp-shadow: 0 7px 22px rgba(21,60,122,.08);
	--tp-shadow-strong: 0 12px 32px rgba(21,60,122,.13);
	--tp-accent-grad: linear-gradient(105deg,var(--tp-a),var(--tp-b));
	--tp-gold-grad: linear-gradient(110deg,#ffe9a0 0%,#f3c45b 42%,#df9d2c 100%);
	position: relative;
	isolation: isolate;
	border-radius: 24px;
	background:
		radial-gradient(circle at 92% -8%, rgba(255,255,255,.72), transparent 27%),
		linear-gradient(180deg, rgba(240,250,248,.96), rgba(246,249,252,.96) 52%, rgba(238,247,246,.98));
	box-shadow: 0 16px 46px rgba(17,57,91,.10);
}
.mq-tp-v2::before {
	content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
	background:
		radial-gradient(circle at 18% 14%, color-mix(in srgb, var(--tp-a) 11%, transparent), transparent 25%),
		radial-gradient(circle at 85% 36%, color-mix(in srgb, var(--tp-b) 8%, transparent), transparent 28%);
}
.mq-shell[data-skin="ocean"] .mq-tp-v2 {
	--tp-a:#25cce6; --tp-b:#2874d7; --tp-gold:#f2c65e; --tp-gold-2:#b98424;
	--tp-panel:rgba(244,252,255,.93); --tp-panel-2:rgba(230,246,252,.91); --tp-line:rgba(18,93,137,.16); --tp-soft:rgba(37,204,230,.12);
	background:radial-gradient(circle at 85% 0%,rgba(126,231,244,.26),transparent 29%),linear-gradient(180deg,#e7f8fc 0%,#dff0f7 52%,#d2e6f1 100%);
}
.mq-shell[data-skin="ambre"] .mq-tp-v2 {
	--tp-a:#f39a24; --tp-b:#dd6528; --tp-gold:#efb94f; --tp-gold-2:#bd7120;
	--tp-panel:rgba(255,252,244,.94); --tp-panel-2:rgba(255,245,226,.92); --tp-line:rgba(139,77,18,.14); --tp-soft:rgba(243,154,36,.11);
	background:radial-gradient(circle at 88% 2%,rgba(255,199,92,.25),transparent 31%),linear-gradient(180deg,#fff8ea 0%,#fff2dc 54%,#fbe8c8 100%);
}
.mq-shell[data-skin="grenat"] .mq-tp-v2 {
	--tp-a:#b64260; --tp-b:#7c2941; --tp-gold:#d8a55f; --tp-gold-2:#a66a2e;
	--tp-panel:rgba(255,249,246,.94); --tp-panel-2:rgba(250,237,234,.92); --tp-line:rgba(113,31,51,.14); --tp-soft:rgba(182,66,96,.10);
	background:radial-gradient(circle at 88% 1%,rgba(220,156,158,.22),transparent 31%),linear-gradient(180deg,#fff8f5 0%,#f9ece9 54%,#f2ddda 100%);
}
.mq-shell[data-skin="ardoise"] .mq-tp-v2 {
	--tp-a:#6fa3b1; --tp-b:#566a88; --tp-gold:#d7ae68; --tp-gold-2:#9f7741;
	--tp-panel:rgba(245,248,250,.95); --tp-panel-2:rgba(232,238,243,.93); --tp-line:rgba(60,75,95,.17); --tp-soft:rgba(91,123,139,.11);
	background:radial-gradient(circle at 90% 0%,rgba(182,203,214,.15),transparent 32%),linear-gradient(180deg,#edf2f4 0%,#e3e9ed 54%,#d8e0e5 100%);
}
.mq-shell[data-skin="nuit"] .mq-tp-v2 {
	--tp-a:#67d9e4; --tp-b:#7b87f0; --tp-gold:#e9bd62; --tp-gold-2:#a77a2d;
	--tp-panel:rgba(24,40,58,.94); --tp-panel-2:rgba(31,51,72,.94); --tp-line:rgba(173,204,226,.16); --tp-soft:rgba(103,217,228,.11);
	--tp-shadow:0 7px 22px rgba(0,0,0,.18); --tp-shadow-strong:0 14px 34px rgba(0,0,0,.24);
	background:radial-gradient(circle at 84% -4%,rgba(89,112,204,.23),transparent 31%),linear-gradient(180deg,#101c2b 0%,#142436 52%,#0d1928 100%);
}
.mq-shell[data-skin="jade"] .mq-tp-v2 {
	--tp-a:#17b9a6; --tp-b:#2f7edb; --tp-gold:#e8b84d; --tp-gold-2:#bb7f21;
}

/* --- structure compacte et safe-area --- */
.mq-tp-v2 .mq-tp-screen-head {
	min-height: 48px; padding: 7px 14px 7px; gap: 9px;
	border-bottom: 1px solid transparent;
}
.mq-tp-v2 .mq-tp-screen-head h1 { font-size: 18px; letter-spacing: -.45px; }
.mq-tp-v2 .mq-tp-back {
	width: 34px; height: 34px; border-radius: 12px; padding: 0;
	background: var(--tp-panel); border: 1px solid var(--tp-line); box-shadow: 0 4px 12px rgba(21,60,122,.06);
}
.mq-tp-v2 .mq-tp-back .mq-tp-ic { width: 18px; height: 18px; }
.mq-tp-v2 .mq-tp-tag {
	min-height: 25px; padding: 4px 8px; border-radius: 999px;
	font-size: 9px; letter-spacing: .55px; background: var(--tp-panel-2); border-color: var(--tp-line);
}
.mq-tp-v2 .mq-tp-tag.mq-tp-gold { background: color-mix(in srgb,var(--tp-gold) 18%,var(--tp-panel)); color: var(--tp-gold-2); border-color: color-mix(in srgb,var(--tp-gold) 35%,transparent); }
.mq-tp-v2 .mq-tp-scroll {
	padding: 4px 14px 16px; scroll-padding: 14px; scrollbar-width:none;
}
.mq-tp-v2 .mq-tp-scroll::-webkit-scrollbar { display:none; }
.mq-tp-v2 .mq-tp-foot {
	padding: 8px 14px calc(env(safe-area-inset-bottom) + 9px);
	background: color-mix(in srgb,var(--tp-panel) 94%,transparent);
	border-top: 1px solid var(--tp-line); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.mq-tp-v2 .mq-tp-foot p { margin: 0 0 6px; font-size: 10px; line-height: 1.35; font-weight: 760; }
.mq-tp-v2 .mq-tp-section-label { margin: 16px 0 7px; }
.mq-tp-v2 .mq-tp-section-label h3 { font-size: 10px; letter-spacing: 1.35px; color: var(--tp-a); }
.mq-tp-v2 .mq-tp-section-label small { font-size: 10px; }

/* --- hero : moins haut, plus éditorial --- */
.mq-tp-v2 .mq-tp-hero {
	min-height: 214px; padding: 18px 17px 0; border-radius: 21px;
	background:
		radial-gradient(circle at 77% 32%, color-mix(in srgb,var(--tp-gold) 22%,transparent), transparent 35%),
		linear-gradient(138deg,var(--tp-panel),var(--tp-panel-2));
	border: 1px solid color-mix(in srgb,var(--tp-line) 78%,#fff 22%); box-shadow: var(--tp-shadow);
}
.mq-tp-v2 .mq-tp-hero .mq-tp-eyebrow { margin-bottom: 6px; font-size: 9px; color: var(--tp-a); }
.mq-tp-v2 .mq-tp-hero h2 { max-width: 175px; font-size: 25px; line-height: 1.02; letter-spacing: -1px; margin: 0 0 8px; }
.mq-tp-v2 .mq-tp-hero h2 em { color: var(--tp-a); }
.mq-tp-v2 .mq-tp-hero p { max-width: 170px; margin: 0 0 10px; font-size: 10.5px; line-height: 1.35; }
.mq-tp-v2 .mq-tp-prize { padding: 6px 9px; border-radius: 9px; font-size: 10px; background: color-mix(in srgb,var(--tp-gold) 14%,var(--tp-panel)); border-color: color-mix(in srgb,var(--tp-gold) 34%,transparent); color: var(--tp-gold-2); }
.mq-tp-v2 .mq-tp-hero-art { width: 126px; height: 143px; right: -2px; top: 43px; }
.mq-tp-v2 .mq-tp-cup { filter: drop-shadow(0 12px 8px rgba(128,84,11,.16)); }
.mq-tp-v2 .mq-tp-hero-foot { margin-top: 15px; padding: 10px 0; gap: 8px; }
.mq-tp-v2 .mq-tp-hero-foot span { font-size: 9px; }
.mq-tp-v2 .mq-tp-hero-foot b { font-size: 12px; }

/* --- CTA : taille tactile pro, sans effet "gros bouton de jeu" --- */
.mq-tp-v2 .mq-tp-primary {
	min-height: 46px; height: auto; padding: 0 44px; border-radius: 14px;
	font-size: 13px; letter-spacing: .05px; font-weight: 900;
	background: var(--tp-accent-grad); box-shadow: 0 7px 18px color-mix(in srgb,var(--tp-b) 18%,transparent), inset 0 1px 0 rgba(255,255,255,.28);
	transform: translateZ(0);
}
.mq-tp-v2 .mq-tp-primary.mq-tp-gold {
	background: var(--tp-gold-grad); color: #5f430f;
	box-shadow: 0 7px 18px color-mix(in srgb,var(--tp-gold-2) 18%,transparent), inset 0 1px 0 rgba(255,255,255,.38);
}
.mq-tp-v2 .mq-tp-primary > .mq-tp-ic { right: 14px; width: 18px; height:18px; margin-top:-9px; }
.mq-tp-v2 .mq-tp-primary > .mq-tp-ic:first-child { left: 14px; right:auto; }
.mq-tp-v2 .mq-tp-primary.mq-tp-full { margin-top: 10px; }
.mq-tp-v2 .mq-tp-primary:active:not(:disabled) { transform: translateY(1px) scale(.988); box-shadow: 0 4px 12px color-mix(in srgb,var(--tp-b) 14%,transparent); }
.mq-tp-v2 .mq-tp-primary:disabled { opacity:.48; filter:saturate(.55); box-shadow:none; }
.mq-tp-v2 .mq-tp-primary:after { width:24%; opacity:.65; animation-duration:7.5s; }
.mq-tp-v2 .mq-tp-secondary {
	min-height: 40px; padding: 0 12px; border-radius: 12px; font-size: 10.5px;
	background: var(--tp-panel-2); border-color: var(--tp-line); box-shadow:none;
}
.mq-tp-v2 .mq-tp-text-button { min-height: 34px; padding: 4px 2px; font-size: 10.5px; color:var(--tp-a); }

/* --- cartes et sélecteurs : densité + sélection premium --- */
.mq-tp-v2 .mq-tp-card,
.mq-tp-v2 .mq-tp-public-card,
.mq-tp-v2 .mq-tp-resume,
.mq-tp-v2 .mq-tp-match-card,
.mq-tp-v2 .mq-tp-reward-card,
.mq-tp-v2 .mq-tp-lobby-status,
.mq-tp-v2 .mq-tp-duel-score {
	background: var(--tp-panel); border-color: var(--tp-line); box-shadow: var(--tp-shadow);
}
.mq-tp-v2 .mq-tp-card { padding: 12px; border-radius: 17px; }
.mq-tp-v2 .mq-tp-public-card { gap: 10px; padding: 11px; border-radius: 16px; }
.mq-tp-v2 .mq-tp-public-card .mq-tp-avatar { width: 38px; height: 38px; }
.mq-tp-v2 .mq-tp-public-card strong { font-size: 11.5px; }
.mq-tp-v2 .mq-tp-public-card small { font-size: 9px; line-height: 1.4; }
.mq-tp-v2 .mq-tp-meter { margin: 6px 0 3px; }
.mq-tp-v2 .mq-tp-meter i { background: var(--tp-accent-grad); }

.mq-tp-v2 .mq-tp-rail { gap: 8px; margin: 0 -14px; padding: 2px 14px 8px; scroll-padding:14px; }
.mq-tp-v2 .mq-tp-rail-wide > .mq-tp-choice { width: 166px; height: 104px; }
.mq-tp-v2 .mq-tp-rail-mid > .mq-tp-choice { width: 108px; height: 98px; }
.mq-tp-v2 .mq-tp-rail-small > .mq-tp-choice { width: 88px; height: 92px; }
.mq-tp-v2 .mq-tp-rail > .mq-tp-universe { width: 104px; height: 128px; }
.mq-tp-v2 .mq-tp-choice {
	gap: 3px; padding: 10px; border-radius: 15px; border-width:1px;
	background: var(--tp-panel); border-color: var(--tp-line); box-shadow: 0 5px 15px rgba(21,60,122,.055);
	transition: transform .18s var(--ressort), border-color .18s, box-shadow .18s, background .18s;
}
.mq-tp-v2 .mq-tp-choice-top { min-height: 20px; }
.mq-tp-v2 .mq-tp-choice .mq-tp-ic { width: 20px; height: 20px; color: var(--tp-a); }
.mq-tp-v2 .mq-tp-choice-mark { width: 18px; height: 18px; background:var(--tp-panel-2); border-color:var(--tp-line); }
.mq-tp-v2 .mq-tp-choice strong { font-size: 11.5px; line-height: 1.18; }
.mq-tp-v2 .mq-tp-choice small { font-size: 9px; line-height: 1.3; -webkit-line-clamp:2; }
.mq-tp-v2 .mq-tp-choice .mq-tp-big { font-size: 28px; letter-spacing:-1.4px; }
.mq-tp-v2 .mq-tp-choice .mq-tp-mid { font-size: 16px; }
.mq-tp-v2 .mq-tp-choice.mq-tp-selected {
	border-color: color-mix(in srgb,var(--tp-a) 82%,#fff 18%);
	background: linear-gradient(155deg,var(--tp-panel),color-mix(in srgb,var(--tp-a) 8%,var(--tp-panel)));
	box-shadow: 0 8px 20px color-mix(in srgb,var(--tp-a) 14%,transparent), inset 0 0 0 1px color-mix(in srgb,var(--tp-a) 10%,transparent);
	transform: translateY(-1px);
}
.mq-tp-v2 .mq-tp-choice.mq-tp-selected .mq-tp-choice-mark {
	background-color: var(--tp-a); border-color:var(--tp-a); box-shadow:0 3px 9px color-mix(in srgb,var(--tp-a) 24%,transparent);
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5l4.5 4.5L19 7.5'/></svg>");
	background-size:60%; background-position:center; background-repeat:no-repeat;
}
.mq-tp-v2 .mq-tp-universe img { height: 61px; border-radius: 11px; margin: 1px 0 4px; }
.mq-tp-v2 .mq-tp-universe strong { font-size: 10px; }

/* --- création : nom, switch, identité --- */
.mq-tp-v2 .mq-tp-name-card { gap: 10px; padding: 10px 12px; }
.mq-tp-v2 .mq-tp-name-ic { width: 40px; height:40px; border-radius:13px; background:var(--tp-gold-grad); box-shadow:0 6px 15px rgba(167,108,26,.16); }
.mq-tp-v2 .mq-tp-name-ic .mq-tp-ic { width:21px; height:21px; }
.mq-tp-v2 .mq-tp-name-field > span { font-size:9px; letter-spacing:1.1px; }
.mq-tp-v2 .mq-tp-name-input { font-size:16px; padding:2px 0; }
.mq-tp-v2 .mq-tp-toggle { padding: 11px 12px; margin-top: 12px; border-radius:15px; border-width:1px; background:var(--tp-panel); border-color:var(--tp-line); box-shadow:var(--tp-shadow); }
.mq-tp-v2 .mq-tp-toggle strong { font-size:11.5px; }
.mq-tp-v2 .mq-tp-toggle small { font-size:9px; margin-top:2px; }
.mq-tp-v2 .mq-tp-switch { width:40px; height:23px; padding:3px; }
.mq-tp-v2 .mq-tp-switch:after { width:17px; height:17px; }
.mq-tp-v2 .mq-tp-toggle[aria-checked=true] .mq-tp-switch { background:var(--tp-accent-grad); }
.mq-tp-v2 .mq-tp-toggle[aria-checked=true] .mq-tp-switch:after { transform:translateX(17px); }
.mq-tp-v2 .mq-tp-identity { margin-top:12px; gap:7px; }

/* --- vestiaire / match / tableau --- */
.mq-tp-v2 .mq-tp-lobby-title h2 { font-size:22px; }
.mq-tp-v2 .mq-tp-lobby-code { margin:9px 0 16px; }
.mq-tp-v2 .mq-tp-lobby-code button { padding:7px 11px; border-radius:9px; }
.mq-tp-v2 .mq-tp-seats { gap:10px 6px; }
.mq-tp-v2 .mq-tp-seat .mq-tp-avatar,
.mq-tp-v2 .mq-tp-empty-seat { width:48px; height:48px; }
.mq-tp-v2 .mq-tp-seat strong { font-size:10px; margin-top:4px; }
.mq-tp-v2 .mq-tp-lobby-status { padding:11px; border-radius:15px; }
.mq-tp-v2 .mq-tp-count-ring { width:148px; height:148px; margin:17px auto; box-shadow:0 0 0 9px var(--tp-panel-2),var(--tp-shadow-strong); }
.mq-tp-v2 .mq-tp-count-ring:before { border-top-color:var(--tp-gold); border-right-color:var(--tp-a); }
.mq-tp-v2 .mq-tp-count-ring strong { font-size:52px; }
.mq-tp-v2 .mq-tp-draw-stage { height:220px; }
.mq-tp-v2 .mq-tp-draw-stage .mq-tp-cup { width:145px; height:145px; }
.mq-tp-v2 .mq-tp-orbit-avatars { width:205px; height:205px; }
.mq-tp-v2 .mq-tp-orbit-avatars img { width:40px; height:40px; left:calc(50% - 20px); top:calc(50% - 20px); transform:rotate(var(--angle)) translateY(-101px) rotate(calc(-1 * var(--angle))); }
.mq-tp-v2 .mq-tp-round-tabs { margin-bottom:12px; }
.mq-tp-v2 .mq-tp-round-tabs button { padding:7px 10px; font-size:9px; border-color:var(--tp-line); background:var(--tp-panel); }
.mq-tp-v2 .mq-tp-match-card { padding:12px; margin-bottom:9px; border-radius:16px; }
.mq-tp-v2 .mq-tp-match-card.mq-tp-mine { border-color:color-mix(in srgb,var(--tp-gold) 70%,transparent); box-shadow:0 7px 20px color-mix(in srgb,var(--tp-gold) 12%,transparent); }
.mq-tp-v2 .mq-tp-versus { gap:8px; }
.mq-tp-v2 .mq-tp-contender .mq-tp-avatar { width:44px; height:44px; }
.mq-tp-v2 .mq-tp-score { font-size:24px; }
.mq-tp-v2 .mq-tp-match-card .mq-tp-primary { min-height:40px; font-size:11.5px; margin-top:10px; }
.mq-tp-v2 .mq-tp-bracket-col { min-width:158px; flex-basis:158px; }
.mq-tp-v2 .mq-tp-bracket-match { border-radius:11px; padding:8px; background:var(--tp-panel); border-color:var(--tp-line); }
.mq-tp-v2 .mq-tp-standings { padding:6px 7px 9px; }
.mq-tp-v2 .mq-tp-standings-head,.mq-tp-v2 .mq-tp-standings-row { grid-template-columns:20px 1fr 24px 24px 24px 48px 30px; gap:3px; padding:7px 4px; font-size:10px; }
.mq-tp-v2 .mq-tp-standings-head { font-size:8px; }
.mq-tp-v2 .mq-tp-standings-row.mq-tp-mine { background:var(--tp-soft); }
.mq-tp-v2 .mq-tp-standings-row .mq-tp-pts { color:var(--tp-a); }

/* --- résultats / podium : premium mais plus contenu --- */
.mq-tp-v2 .mq-tp-result-mark { width:60px; height:60px; border-radius:19px; margin:16px auto 13px; background:var(--tp-gold-grad); }
.mq-tp-v2 .mq-tp-podium-scene h2 { font-size:31px; }
.mq-tp-v2 .mq-tp-podium { height:226px; }
.mq-tp-v2 .mq-tp-podium-place .mq-tp-avatar { width:50px; height:50px; }
.mq-tp-v2 .mq-tp-podium-place.mq-tp-champion .mq-tp-avatar { width:66px; height:66px; border-color:var(--tp-gold); box-shadow:0 0 0 5px color-mix(in srgb,var(--tp-gold) 18%,transparent),0 0 30px color-mix(in srgb,var(--tp-gold) 25%,transparent); }
.mq-tp-v2 .mq-tp-step { height:72px; border-radius:13px 13px 0 0; font-size:33px; }
.mq-tp-v2 .mq-tp-champion .mq-tp-step { height:102px; font-size:44px; }
.mq-tp-v2 .mq-tp-bronze .mq-tp-step { height:56px; }
.mq-tp-v2 .mq-tp-reward-card { padding:13px; border-radius:16px; margin-top:12px; }
.mq-tp-v2 .mq-tp-reward-values { margin-top:12px; }
.mq-tp-v2 .mq-tp-reward-values b { font-size:22px; }
.mq-tp-v2 .mq-tp-sheet-backdrop { padding:8px; background:rgba(5,18,34,.56); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
.mq-tp-v2 .mq-tp-sheet { padding:17px; border-radius:20px; background:var(--tp-panel); border-color:var(--tp-line); }
.mq-tp-v2 .mq-tp-sheet h2 { font-size:20px; }

/* --- animations V2 : uniquement transform + opacité, très courtes --- */
.mq-tp-v2.mq-tp { animation:tp-v2-shell .34s var(--sortie) both; }
.mq-tp-v2 .mq-tp-card,
.mq-tp-v2 .mq-tp-public-card,
.mq-tp-v2 .mq-tp-choice { will-change:auto; }
.mq-tp-v2 .mq-tp-choice.mq-tp-selected { animation:tp-v2-select .28s var(--ressort) both; }
.mq-tp-v2 .mq-tp-primary:not(:disabled) { transition:transform .16s var(--ease),box-shadow .16s ease,filter .16s ease; }
@keyframes tp-v2-shell { from{opacity:.35;transform:translateY(5px)} to{opacity:1;transform:none} }
@keyframes tp-v2-select { 0%{transform:scale(.975)} 100%{transform:translateY(-1px) scale(1)} }

/* --- téléphone étroit : priorité à la lisibilité et au scroll --- */
@media (max-width:374px) {
	.mq-arena-act.is-tournament { grid-template-columns:48px minmax(0,1fr) 26px; min-height:68px; padding:9px; gap:8px; }
	.mq-arena-act.is-tournament .mq-arena-ic { width:48px;height:48px;border-radius:15px; }
	.mq-arena-act.is-tournament .mq-arena-copy { padding-right:34px; }
	.mq-arena-act.is-tournament .mq-arena-copy small { font-size:.66rem; }
	.mq-arena-act.is-tournament .mq-arena-badge { right:34px; font-size:.46rem; }
	.mq-tp-v2 .mq-tp-scroll,.mq-tp-v2 .mq-tp-screen-head,.mq-tp-v2 .mq-tp-foot { padding-left:12px; padding-right:12px; }
	.mq-tp-v2 .mq-tp-rail { margin-left:-12px; margin-right:-12px; padding-left:12px; padding-right:12px; }
	.mq-tp-v2 .mq-tp-rail-wide > .mq-tp-choice { width:154px; }
	.mq-tp-v2 .mq-tp-rail-mid > .mq-tp-choice { width:102px; }
	.mq-tp-v2 .mq-tp-hero { min-height:205px; padding-left:15px; }
	.mq-tp-v2 .mq-tp-hero h2 { font-size:23px; max-width:160px; }
	.mq-tp-v2 .mq-tp-hero-art { width:116px; height:132px; }
	.mq-tp-v2 .mq-tp-primary { min-height:45px; font-size:12.5px; }
	.mq-tp-v2 .mq-tp-seats { grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px 4px; }
	.mq-tp-v2 .mq-tp-seat .mq-tp-avatar,.mq-tp-v2 .mq-tp-empty-seat { width:44px;height:44px; }
}

/* --- grands écrans : ne jamais étirer une interface pensée téléphone --- */
@media (min-width:700px) {
	.mq-tp-v2 { width:min(100%,560px); height:min(900px,96dvh); margin:2dvh auto; border-radius:28px; }
	.mq-tp-v2 .mq-tp-rail-wide > .mq-tp-choice { width:176px; }
}

/* Calme / reduced motion restent prioritaires */
.mq-shell[data-motion="calme"] .mq-tp-v2,
.mq-shell[data-motion="calme"] .mq-tp-v2 *,
.mq-shell[data-motion="calme"] .mq-tp-v2 *::before,
.mq-shell[data-motion="calme"] .mq-tp-v2 *::after { animation:none!important; transition:none!important; }
@media (prefers-reduced-motion:reduce) {
	.mq-tp-v2,.mq-tp-v2 *,.mq-tp-v2 *::before,.mq-tp-v2 *::after { animation:none!important; transition:none!important; }
}


/* =========================================================================
   ACCUEIL 6.30.3 / 2.1.5-v78 — FOND PLEIN ÉCRAN SANS CADRE + MOTION POLISH
   Correction du rectangle semi-transparent visible sur certains thèmes.
   La couche photo locale à la vue centrale est supprimée : l'atmosphère est
   désormais calculée sur toute la surface de .mq-shell, sans bord perceptible.
   ========================================================================= */
.mq-shell[data-screen="accueil"] {
  --home-v78-glow-a:rgba(255,255,255,.24);
  --home-v78-glow-b:rgba(30,201,207,.18);
  --home-v78-glow-c:rgba(46,134,224,.13);
}
.mq-shell[data-screen="accueil"][data-skin="jade"] {
  --home-v78-glow-a:rgba(255,255,255,.32); --home-v78-glow-b:rgba(80,239,211,.24); --home-v78-glow-c:rgba(60,167,234,.18);
}
.mq-shell[data-screen="accueil"][data-skin="ocean"] {
  --home-v78-glow-a:rgba(172,246,255,.18); --home-v78-glow-b:rgba(31,214,216,.20); --home-v78-glow-c:rgba(50,111,234,.24);
}
.mq-shell[data-screen="accueil"][data-skin="ardoise"] {
  --home-v78-glow-a:rgba(221,237,244,.11); --home-v78-glow-b:rgba(126,161,181,.12); --home-v78-glow-c:rgba(61,82,99,.18);
}
.mq-shell[data-screen="accueil"][data-skin="grenat"] {
  --home-v78-glow-a:rgba(255,227,211,.13); --home-v78-glow-b:rgba(213,91,111,.17); --home-v78-glow-c:rgba(120,28,56,.22);
}
.mq-shell[data-screen="accueil"][data-skin="ambre"] {
  --home-v78-glow-a:rgba(255,247,207,.25); --home-v78-glow-b:rgba(255,188,70,.22); --home-v78-glow-c:rgba(238,104,22,.15);
}
.mq-shell[data-screen="accueil"][data-skin="nuit"] {
  --home-v78-glow-a:rgba(167,225,255,.12); --home-v78-glow-b:rgba(91,126,255,.17); --home-v78-glow-c:rgba(30,59,131,.22);
}

/* Une seule atmosphère continue, attachée au viewport complet du jeu. */
.mq-shell[data-screen="accueil"]::before {
  content:"";
  position:absolute;
  inset:-12%;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse 74% 42% at 50% 13%,var(--home-v78-glow-a),transparent 72%),
    radial-gradient(ellipse 62% 48% at 8% 66%,var(--home-v78-glow-b),transparent 74%),
    radial-gradient(ellipse 66% 50% at 94% 58%,var(--home-v78-glow-c),transparent 75%);
  opacity:.92;
  transform:translate3d(0,0,0) scale(1.025);
  transform-origin:center;
  animation:mq-home-v78-atmosphere 17s cubic-bezier(.45,0,.25,1) infinite alternate;
  will-change:transform,opacity;
}
@keyframes mq-home-v78-atmosphere {
  from { transform:translate3d(-1.2%,.2%,0) scale(1.025); opacity:.82; }
  to   { transform:translate3d(1.4%,-1.1%,0) scale(1.065); opacity:1; }
}

/* Le calque qui créait le grand rectangle transparent n'est plus rendu. */
.mq-shell[data-screen="accueil"] .mq-home-sky::after { content:none !important; display:none !important; background:none !important; animation:none !important; }
.mq-shell[data-screen="accueil"] .mq-home-aurora { display:none !important; }

/* Grenat : suppression totale des carrés/losanges translucides.
   Ils sont remplacés par de petites poussières rubis organiques. */
.mq-shell[data-screen="accueil"][data-skin="grenat"] .mq-home-theme-scene i {
  width:6px !important;
  height:6px !important;
  border:0 !important;
  border-radius:50% !important;
  background:radial-gradient(circle,#ffe5d3 0 20%,#e5a083 32%,rgba(202,77,103,.38) 58%,transparent 72%) !important;
  box-shadow:0 0 10px rgba(229,160,131,.34),0 0 20px rgba(180,54,81,.18) !important;
  transform:none !important;
  opacity:0;
  animation:mq-home-v78-ruby-dust 7.8s ease-in-out infinite !important;
}
.mq-shell[data-screen="accueil"][data-skin="grenat"] .mq-home-theme-scene i:nth-child(1){left:9%;top:22%;animation-delay:-1s!important}
.mq-shell[data-screen="accueil"][data-skin="grenat"] .mq-home-theme-scene i:nth-child(2){right:11%;top:18%;width:4px!important;height:4px!important;animation-delay:-3.2s!important}
.mq-shell[data-screen="accueil"][data-skin="grenat"] .mq-home-theme-scene i:nth-child(3){right:8%;top:61%;width:8px!important;height:8px!important;animation-delay:-5.1s!important}
.mq-shell[data-screen="accueil"][data-skin="grenat"] .mq-home-theme-scene i:nth-child(4){left:14%;top:69%;width:4px!important;height:4px!important;animation-delay:-6.4s!important}
.mq-shell[data-screen="accueil"][data-skin="grenat"] .mq-home-theme-scene i:nth-child(5){left:67%;top:34%;width:5px!important;height:5px!important;display:block!important;animation-delay:-2.3s!important}
.mq-shell[data-screen="accueil"][data-skin="grenat"] .mq-home-theme-scene i:nth-child(6){left:34%;top:14%;width:3px!important;height:3px!important;display:block!important;animation-delay:-4.4s!important}
@keyframes mq-home-v78-ruby-dust {
  0%,100% { opacity:.08; transform:translate3d(0,10px,0) scale(.62) !important; }
  48% { opacity:.74; transform:translate3d(5px,-16px,0) scale(1.18) !important; }
}

/* Chorégraphie d'accueil plus posée : entrée sans rebond excessif, ouverture
   progressive de la paire, respiration plus longue et disparition propre. */
.mq-view[data-view="accueil"].is-on .mq-hb-slot { animation:mq-hb-slot-in .48s ease-out forwards; }
.mq-view[data-view="accueil"].is-on .mq-hb-slot.is-l { animation:mq-hb-slot-in .48s ease-out .12s forwards,mq-hb-front 12.4s step-end 1.15s infinite,mq-hb-cycle 12.4s linear 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-slot.is-r { animation:mq-hb-slot-in .48s ease-out .20s forwards,mq-hb-front 12.4s step-end 1.15s infinite,mq-hb-cycle 12.4s linear 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-slot.is-c { animation:mq-hb-slot-in .48s ease-out .04s forwards,mq-hb-backz 12.4s step-end 1.15s infinite,mq-hb-cycle 12.4s linear 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-card.is-l { animation:mq-hb-v78-fan-l .82s cubic-bezier(.16,1,.3,1) .12s forwards,mq-hb-v78-pair-l 12.4s cubic-bezier(.42,0,.2,1) 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-card.is-c { animation:mq-hb-v78-fan-c .82s cubic-bezier(.16,1,.3,1) .04s forwards,mq-hb-v78-pair-c 12.4s cubic-bezier(.42,0,.2,1) 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-card.is-r { animation:mq-hb-v78-fan-r .82s cubic-bezier(.16,1,.3,1) .20s forwards,mq-hb-v78-pair-r 12.4s cubic-bezier(.42,0,.2,1) 1.15s infinite; }
@keyframes mq-hb-v78-fan-l { from{opacity:.15;transform:translate3d(-4%,52px,0) rotate(-4deg) scale(.72)} to{opacity:1;transform:translateX(-46%) translateY(6%) rotate(-15deg) scale(.95)} }
@keyframes mq-hb-v78-fan-c { from{opacity:.15;transform:translate3d(0,48px,0) scale(.72)} to{opacity:1;transform:translateY(-4%) scale(1.055)} }
@keyframes mq-hb-v78-fan-r { from{opacity:.15;transform:translate3d(4%,52px,0) rotate(4deg) scale(.72)} to{opacity:1;transform:translateX(46%) translateY(6%) rotate(15deg) scale(.95)} }
@keyframes mq-hb-v78-pair-l {
  0%,14% { transform:translateX(-46%) translateY(6%) rotate(-15deg) scale(.95) translateZ(0) rotateY(0); }
  27%,84% { transform:translateX(-54%) translateY(0) rotate(0) scale(.985) translateZ(60px) rotateY(180deg); }
  92%,100% { transform:translateX(-46%) translateY(6%) rotate(-15deg) scale(.95) translateZ(0) rotateY(0); }
}
@keyframes mq-hb-v78-pair-r {
  0%,14% { transform:translateX(46%) translateY(6%) rotate(15deg) scale(.95) translateZ(0) rotateY(0); }
  27%,84% { transform:translateX(54%) translateY(0) rotate(0) scale(.985) translateZ(60px) rotateY(-180deg); }
  92%,100% { transform:translateX(46%) translateY(6%) rotate(15deg) scale(.95) translateZ(0) rotateY(0); }
}
@keyframes mq-hb-v78-pair-c {
  0%,14% { transform:translateY(-4%) scale(1.055) translateZ(0); }
  27%,84% { transform:translateY(-20%) scale(.80) translateZ(-36px); }
  92%,100% { transform:translateY(-4%) scale(1.055) translateZ(0); }
}
@keyframes mq-hb-cycle { 0%,84%{opacity:1} 89%,95%{opacity:0} 100%{opacity:1} }
@keyframes mq-hb-front { 0%,14%{z-index:2} 15%,90%{z-index:4} 91%,100%{z-index:2} }
@keyframes mq-hb-backz { 0%,14%{z-index:3} 15%,90%{z-index:1} 91%,100%{z-index:3} }
.mq-view[data-view="accueil"].is-on .mq-hb-front::after { animation:mq-hb-seal 12.4s linear 1.15s infinite; }
@keyframes mq-hb-seal { 0%,27%{opacity:0} 32%,82%{opacity:1} 88%,100%{opacity:0} }
.mq-view[data-view="accueil"].is-on .mq-hb-match { animation:mq-hb-match 12.4s cubic-bezier(.16,1,.3,1) 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-match::before { animation:mq-hb-match-ring 12.4s ease-out 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-match i { animation:mq-hb-msp 12.4s ease-out 1.15s infinite; }
.mq-view[data-view="accueil"].is-on .mq-hb-tip { animation:mq-hb-tip 12.4s cubic-bezier(.2,.8,.2,1) 1.15s infinite; }
@keyframes mq-hb-tip { 0%,34%{opacity:0;transform:translateX(-50%) translateY(8px) scale(.975)} 40%,82%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)} 88%,100%{opacity:0;transform:translateX(-50%) translateY(4px) scale(.99)} }
.mq-view[data-view="accueil"].is-on .mq-home-play { animation:mq-hb-cta-in .72s cubic-bezier(.16,1,.3,1) 1.05s forwards,mq-hb-v78-cta-breathe 3.6s ease-in-out 2.3s infinite; }
@keyframes mq-hb-v78-cta-breathe { 50%{transform:translateY(-1px) scale(1.012);filter:brightness(1.025)} }

/* Le fond animé et les nouvelles poussières obéissent toujours au mode Calme. */
.mq-shell[data-motion="calme"][data-screen="accueil"]::before,
.mq-shell[data-motion="calme"][data-screen="accueil"] .mq-home-theme-scene i { animation:none !important; }
.mq-shell[data-motion="calme"][data-screen="accueil"]::before { transform:none; opacity:.88; }

@media (prefers-reduced-motion: reduce) {
  .mq-shell[data-screen="accueil"]::before { animation:none !important; transform:none !important; }
}

/* =========================================================================
   ACCUEIL 6.30.3 — CORRECTIF CADRE TRANSPARENT / FX PLEIN ÉCRAN
   L'éclair et la lueur de validation ne sont plus bornés à la zone centrale.
   ========================================================================= */
.mq-shell[data-screen="accueil"] .mq-h2-light {
  position:fixed !important;
  inset:0 !important;
  width:auto !important;
  height:auto !important;
  overflow:hidden;
  pointer-events:none;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
.mq-shell[data-screen="accueil"] .mq-h2-lift,
.mq-shell[data-screen="accueil"] .mq-h2-flash { inset:0 !important; border-radius:0 !important; }