/* Header commun : toutes les vues reprennent désormais la partie haute de l'accueil. */
.home-v2-menu { display: block; grid-area: 1 / 1; justify-self: start; }
.topbar > .today-pill { display: none; }
.topbar { grid-template-columns: 44px minmax(0, 1fr) auto; height: calc(56px + env(safe-area-inset-top)); padding-top: env(safe-area-inset-top); }
body.discover-home-v2-active .discover-hub-tab { min-height: 44px; padding-block: 0; }
.topbar-actions { grid-area: 1 / 3; gap: 6px; }
.topbar .brand { position: static; grid-area: 1 / 2; transform: none; }
body.map-active .topbar { background: rgba(255, 255, 255, .92); }
.topbar-actions > .popover-wrap { display: grid; place-items: center; min-width: 44px; min-height: 44px; }
.topbar #notificationButton { width: 44px; height: 44px; min-width: 44px; padding: 0; border: 0; background: transparent; box-shadow: none; }
.topbar #notificationButton > svg { width: 16px; height: 16px; }
.topbar #notificationButton .notification-dot { right: 5px; bottom: 5px; min-width: 15px; height: 15px; padding-inline: 3px; font-size: 9px; }
.topbar #profileButton { width: 34px; height: 34px; min-width: 34px; }
/* Le visuel est compact, mais la zone tactile reste de 44 × 44 px. */
.topbar #profileButton::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; }
.topbar #profileButton .avatar-status { width: 8px; height: 8px; }
.topbar :is(#notificationButton, #profileButton):focus-visible { outline: 3px solid var(--blue-dark); outline-offset: 3px; }
.home-v2-menu { width: 44px; height: 44px; padding: 11px; color: var(--ink); background: transparent; border-radius: 14px; }
.home-v2-menu svg { width: 22px; height: 22px; stroke-width: 1.35; }
.home-v2-menu:focus-visible, .modules-drawer button:focus-visible { outline: 3px solid #713bdb; outline-offset: 2px; }
html:has(#modulesDrawer[open]), body:has(#modulesDrawer[open]) { overflow: hidden; }
.modules-drawer { position: fixed; inset: 0 auto 0 0; box-sizing: border-box; width: min(322px, calc(100vw - 48px)); max-width: none; height: 100%; height: 100dvh; max-height: none; margin: 0; padding: calc(28px + env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom)); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; border: 1px solid #e0e4ed; border-left: 0; border-radius: 0 22px 22px 0; color: #091f60; background: #fff; box-shadow: 12px 0 32px #101a3b30; }
.modules-drawer[open] { animation: modules-enter .22s ease-out; }
.modules-drawer::backdrop { background: #111a3659; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.modules-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; }
.modules-heading h2 { flex: 1 1 auto; max-width: 100%; margin: 0; font-size: 1.65rem; font-weight: 700; line-height: 1.3; letter-spacing: -.055em; outline: none; overflow-wrap: anywhere; }
.modules-heading p { flex: 0 0 100%; margin: 0; color: #6c7caf; font-size: 1rem; line-height: 1.3125; letter-spacing: -.025em; }
.modules-weather { display: flex; align-items: center; justify-content: center; gap: 8px; min-width: 85px; min-height: 44px; padding: 5px 10px; border: 1px solid #ffdb98; border-radius: 24px; color: #091f60; background: #fff; }
.modules-weather > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff1d7; }
.modules-weather svg { width: 25px; height: 25px; }
.modules-weather strong { font-size: 1.125rem; line-height: 1; font-weight: 800; }
.modules-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 4.5rem), 1fr)); row-gap: 12px; min-height: 113px; margin-top: 18px; padding: 10px 0; border: 1px solid #e3ddff; border-radius: 12px; background: #f5f2ff; }
.modules-stats > div { display: flex; flex-direction: column; align-items: center; text-align: center; }
.modules-stats > div + div { border-left: 1px solid #ded6ff; }
.modules-stats svg { width: 31px; height: 31px; }
.modules-stats strong { margin-top: 4px; font-size: 1.875rem; font-weight: 800; line-height: 1.08; font-variant-numeric: tabular-nums; }
.modules-stats span { color: #5b6fa5; font-size: .875rem; line-height: 1; }
.modules-amber { color: #ffa000; }.modules-purple { color: #7b3fff; }.modules-mint { color: #00bf9c; }
.modules-stats.is-premium-locked { position: relative; opacity: .76; }
.modules-stats.is-premium-locked::after { content: "lock"; position: absolute; top: 8px; right: 8px; color: #6479b0; font: 400 18px/1 "Material Symbols Rounded"; }
.modules-premium-callout { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 4px 10px; margin-top: 16px; padding: 13px; border: 1px solid #ddd5ff; border-radius: 14px; background: #f7f4ff; }
.modules-premium-icon { display: grid; grid-row: 1 / span 2; width: 42px; height: 42px; place-items: center; border-radius: 12px; color: #5d4a9d; background: #e9e3ff; font-size: 24px; }
.modules-premium-callout h3 { margin: 0; font-family: "Poppins", sans-serif; font-size: 1rem; line-height: 1.2; }
.modules-premium-callout p { margin: 2px 0 0; color: #6c7caf; font-size: .78rem; line-height: 1.3; }
.modules-premium-callout button { grid-column: 1 / -1; min-height: 42px; margin-top: 8px; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #f52886, #e82278); font-size: .9rem; font-weight: 900; box-shadow: 0 8px 18px rgba(232,34,120,.18); }
.modules-nav { display: grid; gap: 10px; margin-top: 22px; }
.modules-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 6.75rem), 1fr)); gap: 8px 12px; }
.module-tile { --module-color: #7c43ff; --module-bg: #f0efff; --module-border: #d9dfff; --module-icon-bg: #e6e0ff; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-width: 0; min-height: 103px; padding: 12px 8px 10px; border: 1px solid var(--module-border); border-radius: 13px; color: #091f60; background: var(--module-bg); font-size: 1rem; font-weight: 800; line-height: 1.2; text-align: center; transition: filter .15s; }
.module-tile:hover { filter: brightness(.97); }
.module-tile.is-premium-locked { filter: saturate(.82); }
.module-tile.is-premium-locked:hover { filter: saturate(.82) brightness(.98); }
.module-tile.is-premium-locked::after { content: "lock"; position: absolute; top: 9px; right: 9px; color: #52689f; font: 400 18px/1 "Material Symbols Rounded"; }
.module-tile--pink { --module-color: #ff087c; --module-bg: #fdf0f5; --module-border: #ffdaea; --module-icon-bg: #fce0ed; }
.module-tile--amber { --module-color: #ffa000; --module-bg: #fff6e7; --module-border: #ffebc5; --module-icon-bg: #ffedcf; }
.module-tile--mint { --module-color: #00bf9c; --module-bg: #eafaf6; --module-border: #caf2e9; --module-icon-bg: #d7f5ec; }
.module-tile--blue { --module-color: #1876ff; --module-bg: #ebf3ff; --module-border: #d1e4ff; --module-icon-bg: #d6e6ff; }
.module-tile--lilac { --module-bg: #f5f1ff; --module-border: #e5dcff; --module-icon-bg: #eae1ff; }
.module-icon { display: grid; place-items: center; width: 64px; height: 51px; flex-shrink: 0; border-radius: 15px; color: var(--module-color); background: var(--module-icon-bg); }
.module-icon svg { width: 42px; height: 42px; stroke-width: 2; }
.module-tile--wide { flex-direction: row; justify-content: flex-start; min-height: 70px; gap: 18px; padding: 9px 15px; font-size: 1.25rem; text-align: left; }
.module-tile--wide .module-icon { width: 63px; height: 50px; background: transparent; }
.module-tile--wide .module-icon svg { width: 49px; height: 44px; }
.module-chevron { width: 21px; height: 21px; flex-shrink: 0; margin-left: auto; color: #6479b0; }
.module-tile--wide.module-tile--amber { min-height: 75px; }
.modules-footer { margin: 31px 0 0; color: #6c7caf; font-size: .875rem; line-height: 1.5; text-align: center; letter-spacing: -.025em; }
.modules-close { position: absolute; top: 4px; left: 16px; display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 12px; border-radius: 12px; background: #fff; transform: translateY(-150%); }
.modules-close:focus-visible { transform: none; z-index: 1; }
.modules-drawer [hidden] { display: none !important; }
@keyframes modules-enter { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@media (max-width: 359px) {
  .modules-drawer { padding-inline: 12px; }
  .modules-heading h2 { font-size: 1.4rem; }
  .modules-heading p { font-size: .875rem; }
  .modules-weather { min-width: 72px; gap: 5px; padding-inline: 7px; }
  .modules-grid { gap: 8px; }
  .module-tile--wide { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) { .modules-drawer[open] { animation: none; }.module-tile { transition: none; } }

/* Hub Jeux : reprend le langage graphique du panneau Mes modules. */
body.games-active { color: #091f60; background: #fff; }
body.games-active .bottom-nav, body.games-active .support-widget { display: none !important; }
body.games-active .app-shell { width: min(100%, 1240px); min-height: 100dvh; padding: 0 16px calc(44px + env(safe-area-inset-bottom)); }
.games-view { width: min(100%, 520px); margin: 0 auto; padding-top: 20px; }
.games-page { width: 100%; margin: 0 auto; }
.games-header { margin-bottom: 18px; }
.games-modules-back { display: inline-flex; min-height: 34px; align-items: center; gap: 7px; margin: 0 0 11px; padding: 3px 4px 3px 0; color: #566ba3; background: transparent; font-size: 1rem; font-weight: 600; }
.games-modules-back svg { width: 18px; height: 18px; stroke-width: 1.65; }
.games-title-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.games-title-row > div { min-width: 0; }
.games-title-row h1 { margin: 0; color: #091f60; font-size: clamp(2.25rem, 9vw, 2.75rem); font-weight: 800; line-height: 1; letter-spacing: -.055em; }
.games-title-row p { margin: 5px 0 0; color: #6677aa; font-size: 1.12rem; line-height: 1.25; letter-spacing: -.025em; }
.games-weather { display: flex; min-width: 103px; min-height: 47px; flex: 0 0 auto; align-items: center; justify-content: center; gap: 10px; padding: 5px 12px 5px 7px; border: 1px solid #ffda8c; border-radius: 999px; color: #091f60; background: #fff; }
.games-weather > span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; background: #fff1d7; }
.games-weather svg { width: 27px; height: 27px; }
.games-weather strong { font-size: 1.3rem; font-weight: 800; line-height: 1; }
.games-list { display: grid; gap: 11px; }
.games-card { --game-color: #ff087c; --game-bg: #fff1f6; --game-border: #ffd4e5; --game-icon-bg: #ffe1ed; display: grid; min-height: 103px; grid-template-columns: 80px minmax(0, 1fr) 21px; align-items: center; gap: 17px; padding: 13px 17px 13px 14px; border: 1px solid var(--game-border); border-radius: 13px; color: #091f60; background: var(--game-bg); text-align: left; transition: filter .16s ease, transform .16s ease, box-shadow .16s ease; }
.games-card:hover { filter: brightness(.985); box-shadow: 0 10px 24px rgba(28,46,94,.08); transform: translateY(-1px); }
.games-card:active { transform: translateY(0) scale(.993); }
.games-card--match { --game-color: #00bc91; --game-bg: #edfbf8; --game-border: #c7f0e6; --game-icon-bg: #d9f7ef; }
.games-card--divination { --game-color: #7434eb; --game-bg: #f4f1ff; --game-border: #e1d8ff; --game-icon-bg: #e9e1ff; }
.games-card--quiz { --game-color: #0875f5; --game-bg: #edf5ff; --game-border: #cfe2ff; --game-icon-bg: #dbeaff; }
.games-card--challenge { --game-color: #ff9e00; --game-bg: #fff8e9; --game-border: #ffe2ae; --game-icon-bg: #fff0cf; }
.games-card-icon { display: grid; width: 80px; height: 76px; place-items: center; border-radius: 13px; color: var(--game-color); background: var(--game-icon-bg); }
.games-card-icon svg { width: 56px; height: 56px; stroke-width: 2.5; }
.games-card-icon img { display: block; width: 56px; height: 56px; object-fit: contain; }
.games-card-copy { display: grid; min-width: 0; gap: 4px; }
.games-card-copy strong { color: #091f60; font-family: "Poppins", sans-serif; font-size: 1.22rem; font-weight: 800; line-height: 1.12; letter-spacing: -.035em; }
.games-card-copy small { color: #6677aa; font-size: .96rem; line-height: 1.25; letter-spacing: -.018em; }
.games-card-chevron { width: 19px; height: 19px; color: #6479b0; stroke-width: 2; }
.games-footer { margin: 22px 0 0; color: #6677aa; font-size: .88rem; line-height: 1.4; text-align: center; }
html[data-theme="dark"] body.games-active { background: #0e1518; }
html[data-theme="dark"] .games-title-row h1, html[data-theme="dark"] .games-card-copy strong { color: #eef5f5; }
html[data-theme="dark"] .games-modules-back, html[data-theme="dark"] .games-title-row p, html[data-theme="dark"] .games-card-copy small, html[data-theme="dark"] .games-footer { color: #aebbc9; }
html[data-theme="dark"] .games-weather { color: #eef5f5; border-color: #6c5525; background: #172125; }
html[data-theme="dark"] .games-weather > span { background: #362f20; }
html[data-theme="dark"] .games-card { --game-bg: #172125; --game-border: #2b393d; }
html[data-theme="dark"] .games-card-icon { background: color-mix(in srgb, var(--game-color) 16%, #172125); }
html[data-theme="dark"] .modules-premium-callout { border-color: #4c426b; background: #242033; }
html[data-theme="dark"] .modules-premium-icon { color: #c1b3ff; background: #352d50; }
html[data-theme="dark"] .modules-premium-callout p { color: #aebbc9; }
@media (max-width: 420px) {
  body.games-active .app-shell { padding-inline: 16px; }
  .games-view { padding-top: calc(17px + env(safe-area-inset-top)); }
  .games-title-row { gap: 10px; }
  .games-title-row h1 { font-size: 2.35rem; }
  .games-title-row p { font-size: 1.05rem; }
  .games-weather { min-width: 98px; min-height: 45px; gap: 8px; padding-right: 10px; }
  .games-weather strong { font-size: 1.22rem; }
  .games-card { min-height: 102px; grid-template-columns: 80px minmax(0, 1fr) 18px; gap: 16px; padding-inline: 14px 15px; }
  .games-card-copy strong { font-size: 1.18rem; }
  .games-card-copy small { font-size: .92rem; }
}
@media (max-width: 350px) {
  .games-title-row p { font-size: .94rem; }
  .games-weather { min-width: 88px; padding-inline: 6px 9px; }
  .games-card { grid-template-columns: 67px minmax(0, 1fr) 16px; gap: 12px; }
  .games-card-icon { width: 67px; height: 68px; }
  .games-card-icon :is(svg, img) { width: 49px; height: 49px; }
  .games-card-copy strong { font-size: 1.06rem; }
  .games-card-copy small { font-size: .82rem; }
}
@media (prefers-reduced-motion: reduce) { .games-card { transition: none; } }

/* Le défi : jeu minute en cinq manches. */
body.challenge-active { color: #091f60; background: #fff; }
body.challenge-active .bottom-nav, body.challenge-active .support-widget { display: none !important; }
body.challenge-active .app-shell { width: min(100%, 1240px); min-height: 100dvh; padding: 0 16px calc(30px + env(safe-area-inset-bottom)); }
.challenge-view { width: min(100%, 520px); margin: 0 auto; padding: 20px 0 34px; }
.challenge-shell { display: grid; gap: 16px; }
.challenge-header { display: grid; justify-items: start; }
.challenge-back { display: inline-flex; min-height: 34px; align-items: center; gap: 7px; margin: 0 0 12px; padding: 3px 4px 3px 0; color: #566ba3; background: transparent; font-size: 1rem; font-weight: 650; }
.challenge-back svg { width: 18px; height: 18px; stroke-width: 1.65; }
.challenge-title-row { display: flex; align-items: center; gap: 11px; }
.challenge-title-row h1 { margin: 0; color: #091f60; font-size: clamp(2.35rem, 9vw, 2.8rem); font-weight: 850; line-height: 1; letter-spacing: -.055em; }
.challenge-title-row > :is(svg, img) { display: block; width: 54px; height: 54px; color: #ff9e00; }
.challenge-header > p { margin: 4px 0 0; color: #6677aa; font-size: 1.12rem; line-height: 1.2; }
.challenge-progress { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 17px; min-height: 57px; padding: 10px 16px; border: 1px solid #e4e8f2; border-radius: 13px; background: linear-gradient(135deg, #fff, #f8f9fd); }
.challenge-progress strong { color: #566ba3; font-size: 1rem; white-space: nowrap; }
.challenge-progress > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.challenge-progress > div span { height: 12px; border-radius: 999px; background: #e2e6f0; transition: background .2s ease, transform .2s ease; }
.challenge-progress > div span.is-active, .challenge-progress > div span.is-complete { background: #ff9e00; }
.challenge-progress > div span.is-active { transform: scaleY(1.12); }
.challenge-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.challenge-meta > span { display: flex; min-width: 0; min-height: 56px; align-items: center; justify-content: center; gap: 8px; padding: 8px; border: 1px solid #ddd8ff; border-radius: 13px; color: #566ba3; background: #f4f1ff; font-size: .9rem; font-weight: 700; text-align: center; }
.challenge-meta > span:nth-child(2) { border-color: #c8efe6; background: #edfbf8; }
.challenge-meta > span:nth-child(3) { border-color: #cfe3ff; background: #edf5ff; }
.challenge-meta .material-symbols-rounded { color: #8d75df; font-size: 27px; font-variation-settings: "FILL" 0, "wght" 450; }
.challenge-meta > span:nth-child(2) .material-symbols-rounded { color: #18b994; }
.challenge-meta > span:nth-child(3) .material-symbols-rounded { color: #0875f5; }
.challenge-card { position: relative; overflow: hidden; border: 1px solid #ffd486; border-radius: 17px; background: linear-gradient(160deg, #fffaf0, #fff 55%, #fff9ed); }
.challenge-visual { position: relative; height: 250px; overflow: hidden; background: radial-gradient(circle at 50% 15%, #fff 0 18%, transparent 48%), linear-gradient(180deg, #fffaf0, #fff3cf); }
.challenge-visual::after { position: absolute; right: -8%; bottom: -49px; left: -8%; height: 105px; border-radius: 50% 50% 0 0; background: #ffe5a9; content: ""; opacity: .72; }
.challenge-visual img { position: absolute; z-index: 2; left: 50%; bottom: -9px; width: min(92%, 455px); height: 245px; object-fit: contain; object-position: center bottom; transform: translateX(-50%); filter: drop-shadow(0 12px 14px rgba(121,75,11,.08)); }
.challenge-sun { position: absolute; right: 28px; top: 24px; width: 44px; height: 44px; border-radius: 50%; background: #ffd668; box-shadow: 0 0 0 13px rgba(255,214,104,.14); }
.challenge-visual :is(i,b,em) { position: absolute; z-index: 3; width: 22px; height: 4px; border-radius: 999px; background: #ff9e00; transform: rotate(58deg); }
.challenge-visual i { left: 12%; top: 44%; }
.challenge-visual b { right: 12%; top: 39%; transform: rotate(-55deg); }
.challenge-visual em { right: 18%; top: 24%; transform: rotate(-78deg); }
.challenge-content { position: relative; z-index: 4; display: grid; justify-items: center; padding: 18px 16px 20px; text-align: center; }
.challenge-kind { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 5px; color: #b66b00; font-size: .7rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.challenge-kind .material-symbols-rounded { font-size: 17px; }
.challenge-content h2 { margin: 0; color: #091f60; font-size: clamp(1.65rem, 7vw, 2rem); line-height: 1.08; letter-spacing: -.045em; }
.challenge-content > p:not(.challenge-note) { max-width: 390px; margin: 5px 0 14px; color: #6677aa; font-size: 1rem; line-height: 1.35; }
.challenge-timer { display: inline-flex; min-width: 202px; min-height: 72px; align-items: center; justify-content: center; gap: 16px; margin-bottom: 13px; padding: 8px 22px; border: 2px solid #ff9e00; border-radius: 999px; color: #091f60; background: #fff; }
.challenge-timer .material-symbols-rounded { color: #ff9e00; font-size: 38px; font-variation-settings: "FILL" 0, "wght" 500; }
.challenge-timer strong { font: 850 2rem/1 "Poppins", sans-serif; font-variant-numeric: tabular-nums; }
.challenge-start, .challenge-next { display: inline-flex; width: 100%; min-height: 58px; align-items: center; justify-content: center; gap: 11px; border-radius: 14px; font-size: 1rem; font-weight: 900; }
.challenge-start { color: #091f60; background: linear-gradient(135deg, #ffae00, #ff9800); box-shadow: 0 10px 22px rgba(255,158,0,.2); }
.challenge-start .material-symbols-rounded { font-size: 29px; font-variation-settings: "FILL" 1; }
.challenge-start.is-running { color: #fff; background: linear-gradient(135deg, #0875f5, #536de8); }
.challenge-start.is-complete { color: #fff; background: linear-gradient(135deg, #18b994, #39a96f); }
.challenge-next { min-height: 54px; margin-top: 10px; border: 2px solid #ff9e00; color: #091f60; background: #fff; }
.challenge-next .material-symbols-rounded { color: #ff9e00; font-size: 25px; }
.challenge-note { margin: 12px 0 0; color: #6677aa; font-size: .82rem; }
.challenge-confetti { position: absolute; z-index: 8; inset: 0; overflow: hidden; pointer-events: none; }
.challenge-confetti i { position: absolute; left: calc(12% + var(--confetti-x, 0%)); top: 42%; width: 9px; height: 18px; border-radius: 3px; background: #ff9e00; opacity: 0; }
.challenge-confetti i:nth-child(2) { --confetti-x: 14%; background: #eb7198; }
.challenge-confetti i:nth-child(3) { --confetti-x: 29%; background: #24b9cf; }
.challenge-confetti i:nth-child(4) { --confetti-x: 47%; background: #8d75df; }
.challenge-confetti i:nth-child(5) { --confetti-x: 62%; background: #29be63; }
.challenge-confetti i:nth-child(6) { --confetti-x: 75%; background: #0875f5; }
.challenge-card.is-complete .challenge-confetti i { animation: challenge-confetti-pop 1.25s ease-out both; }
.challenge-card.is-complete .challenge-confetti i:nth-child(even) { animation-delay: .08s; }
@keyframes challenge-confetti-pop { 0% { opacity: 1; transform: translateY(80px) rotate(0); } 75% { opacity: 1; } 100% { opacity: 0; transform: translateY(-260px) rotate(460deg); } }
html[data-theme="dark"] body.challenge-active { background: #0e1518; }
html[data-theme="dark"] :is(.challenge-title-row h1, .challenge-content h2, .challenge-timer, .challenge-start, .challenge-next) { color: #eef5f5; }
html[data-theme="dark"] :is(.challenge-progress, .challenge-card, .challenge-timer, .challenge-next) { border-color: #5b4724; background: #172125; }
html[data-theme="dark"] .challenge-visual { background: linear-gradient(180deg, #30291d, #25251c); }
html[data-theme="dark"] .challenge-meta > span { color: #c0cbe8; border-color: #354248; background: #172125; }
@media (max-width: 420px) {
  body.challenge-active .app-shell { padding-inline: 15px; }
  .challenge-view { padding-top: calc(17px + env(safe-area-inset-top)); }
  .challenge-shell { gap: 13px; }
  .challenge-title-row h1 { font-size: 2.35rem; }
  .challenge-header > p { font-size: 1.02rem; }
  .challenge-progress { gap: 11px; min-height: 54px; padding: 9px 12px; }
  .challenge-progress strong { font-size: .86rem; }
  .challenge-progress > div { gap: 5px; }
  .challenge-progress > div span { height: 10px; }
  .challenge-meta { gap: 7px; }
  .challenge-meta > span { min-height: 52px; gap: 5px; padding: 6px 4px; font-size: .75rem; }
  .challenge-meta .material-symbols-rounded { font-size: 23px; }
  .challenge-visual { height: 220px; }
  .challenge-visual img { height: 215px; }
  .challenge-content { padding: 15px 14px 18px; }
  .challenge-timer { min-width: 190px; min-height: 66px; }
  .challenge-start { min-height: 55px; }
}
@media (prefers-reduced-motion: reduce) { .challenge-card.is-complete .challenge-confetti i { animation: none; } }

#discoverHomeV2 .home-v2-lead { gap: 8px; min-width: 0; }
.home-v2-show-more { display: inline-flex; align-items: center; justify-content: center; justify-self: center; gap: 10px; min-height: 44px; padding: 10px 24px; border-radius: 24px; color: #fff; background: #e56f94; font: inherit; font-weight: 800; }
.home-v2-show-more:hover { background: #a43760; }
.home-v2-show-more svg { width: 18px; height: 18px; transform: rotate(90deg); }
.home-v2-show-more:focus-visible { outline: 3px solid var(--blue-dark); outline-offset: 3px; }
.home-v2-more-content { display: grid; min-width: 0; gap: inherit; }
.home-v2-more-content:focus { outline: none; }
/* Moments : réduire les vignettes et les blancs, sans réduire les noms. */
#discoverHomeV2:has(> #homeV2Moments:not([hidden])) { padding-top: 8px; }
#homeV2Moments { gap: 4px; margin-bottom: -7px; }
#homeV2Moments .home-v2-section-heading h2 { margin: 0; font-size: 1rem; line-height: 1.25; }
#homeV2Moments .home-v2-story-rail { padding-block: 1px 3px; }
#homeV2Moments .home-v2-story { width: 70px; flex-basis: 70px; gap: 2px; }
#homeV2Moments .home-v2-story > span { width: 56px; height: 56px; }
#homeV2Moments .home-v2-story strong { font-size: .75rem; line-height: 1.2; }
#homeV2Moments .home-v2-story--add > span { box-shadow: inset 0 0 0 3px #ffdbe8; }
#homeV2Moments .home-v2-story--add b { font-size: 1.6rem; }
@media (max-width: 640px) {
  #homeV2Moments .home-v2-section-heading h2 { font-size: .875rem; }
  #homeV2Moments .home-v2-story { width: 62px; flex-basis: 62px; }
  #homeV2Moments .home-v2-story > span { width: 44px; height: 44px; }
  #homeV2Moments .home-v2-story-media-type { right: 1px; bottom: 1px; width: 16px; height: 16px; font-size: 10px; }
}
.home-v2-carousel { min-width: 0; }
#homeV2Spotlight { aspect-ratio: auto; width: 100%; height: clamp(240px, 28vw, 300px); min-height: 0; max-height: 300px; overflow: hidden; border-radius: 26px; cursor: default; box-shadow: none; }
#homeV2Spotlight:hover { transform: none; box-shadow: none; }
#homeV2Spotlight::after { inset: 0; background: linear-gradient(0deg, rgba(14,35,43,.91), rgba(14,35,43,.28) 65%, rgba(14,35,43,.06)); }
#homeV2Spotlight .home-v2-spotlight-track, #homeV2Spotlight .home-v2-spotlight-slide, #homeV2Spotlight .home-v2-spotlight-slide img { width: 100%; height: 100%; }
#homeV2Spotlight .home-v2-spotlight-slide img { object-fit: cover; }
#homeV2Spotlight .home-v2-spotlight-label { top: 18px; left: 20px; max-width: calc(100% - 96px); min-height: 36px; padding: 7px 13px; gap: 7px; overflow: hidden; font-size: .875rem; color: #a43760; background: #fff0f4; text-overflow: ellipsis; white-space: nowrap; }
#homeV2Spotlight .home-v2-spotlight-label svg { width: 23px; height: 23px; flex-shrink: 0; }
.home-v2-spotlight-favorite { position: absolute; z-index: 4; top: 16px; right: 18px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: #20343d; background: #fff; }
.home-v2-spotlight-favorite.is-favorite { color: #b43b65; }
.home-v2-spotlight-favorite.is-favorite svg { fill: currentColor; }
#homeV2Spotlight .home-v2-spotlight-copy { position: absolute; inset: 0; z-index: 3; display: grid; align-content: end; justify-items: start; box-sizing: border-box; height: 100%; min-height: 0; overflow: hidden; padding: 112px clamp(20px, 4vw, 44px) 18px; pointer-events: none; }
#homeV2SpotlightTitle { display: -webkit-box; max-width: 28ch; max-height: 2.26em; margin: 0; overflow: hidden; font-size: clamp(1.35rem, 2.5vw, 1.9rem); line-height: 1.13; letter-spacing: -.035em; overflow-wrap: anywhere; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#homeV2Spotlight .home-v2-spotlight-copy > p { display: flex; width: 100%; min-width: 0; flex-wrap: nowrap; gap: 5px; margin: 6px 0 8px; overflow: hidden; font-size: clamp(.875rem, 1.4vw, 1rem); white-space: nowrap; }
#homeV2Spotlight .home-v2-rating-star { width: 20px; height: 20px; color: var(--sun); fill: var(--sun); }
.home-v2-discover-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 38px; padding: 6px 20px; border-radius: 24px; color: #fff; background: #e56f94; font-size: .9375rem; font-weight: 900; line-height: 1.2; pointer-events: auto; }
.home-v2-discover-button:hover { background: #a43760; }
.home-v2-carousel-controls { position: relative; display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 44px 0 0; }
#homeV2SpotlightDots { position: static; display: flex; flex-wrap: wrap; justify-content: center; transform: none; padding: 0; background: none; backdrop-filter: none; }
#homeV2SpotlightDots .home-v2-spotlight-dot { width: 44px; height: 44px; flex: 0 0 44px; }
#homeV2SpotlightDots .home-v2-spotlight-dot::before { width: 9px; height: 9px; background: #ced8dd; box-shadow: none; transform: none; }
#homeV2SpotlightDots .home-v2-spotlight-dot.is-active::before { width: 27px; border-radius: 10px; background: var(--rose); }
.home-v2-carousel-pause { position: absolute; right: 0; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--ink-soft); background: transparent; font-size: 1rem; }
.home-v2-carousel :is(button):focus-visible { outline: 3px solid var(--blue-dark); outline-offset: 3px; }
#homeV2Spotlight button:focus-visible { outline-color: #fff; }

#discoverHomeV2 .home-v2-welcome-card { gap: 8px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#discoverHomeV2 .home-v2-welcome-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.home-v2-location-link { display: flex; align-items: center; min-width: 0; min-height: 44px; gap: 9px; padding: 0; color: var(--ink); background: transparent; font-size: 1rem; font-weight: 800; text-align: left; }
.home-v2-location-link > svg:first-child { width: 25px; height: 28px; flex: 0 0 25px; color: #e56f94; }
.home-v2-location-link > span { overflow-wrap: anywhere; }
.home-v2-chevron-down { width: 16px; height: 16px; flex: 0 0 16px; transform: rotate(90deg); }
#homeV2Weather { display: flex; flex: 0 0 auto; align-items: center; gap: 7px; min-height: 44px; padding: 5px 12px 5px 7px; border: 1px solid #ebdcac; border-radius: 24px; color: var(--ink); background: #fffbf0; font-size: 1.15rem; }
#homeV2Weather svg { width: 30px; height: 30px; }
.home-v2-welcome-heading h1 { margin: 0; color: var(--ink); font-size: clamp(1.6rem, 5.2vw, 2.5rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.08; }
.home-v2-welcome-heading h1 em { color: #e56f94; font-style: normal; }
.home-v2-welcome-heading p { margin: 4px 0 0; color: var(--ink-soft); font-size: clamp(1rem, 2.6vw, 1.2rem); line-height: 1.3; }
#homeV2SearchForm { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 1rem; }
.home-v2-search-field { display: grid; grid-template-columns: 24px minmax(0, 1fr) 44px; align-items: center; gap: 10px; padding: 4px 4px 4px 12px; border: 1px solid var(--line); border-radius: 17px; }
#homeV2SearchForm:focus-within { border-color: var(--line); box-shadow: none; }
#homeV2SearchForm .home-v2-search-icon { color: #73858c; width: 24px; height: 24px; }
#homeV2SearchInput { min-height: 44px; font-size: 1rem; }
#homeV2SearchInput:focus-visible { outline: 2px solid var(--blue-dark); outline-offset: 2px; border-radius: 3px; }
#homeV2SearchForm .home-v2-search-field > button { width: 44px; height: 44px; border-radius: 13px; background: #e56f94; color: #fff; box-shadow: none; }
#homeV2SearchForm .home-v2-search-field > button svg { width: 26px; height: 26px; }
.home-v2-quick-filters { grid-column: 1 / -1; display: grid; grid-template-columns: 1.1fr 1.15fr 1fr; gap: 10px; }
.home-v2-quick-filters label { position: relative; display: flex; align-items: center; gap: 7px; min-width: 0; min-height: 48px; padding: 0 10px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: #fff; }
.home-v2-quick-filters label > svg { flex-shrink: 0; width: 22px; height: 22px; pointer-events: none; }
.home-v2-quick-filters label > .home-v2-chevron-down { width: 13px; height: 13px; position: absolute; right: 8px; }
.home-v2-quick-filters select { flex: 1; min-width: 0; width: 100%; min-height: 46px; padding: 0 17px 0 0; border: 0; border-radius: 0; appearance: none; background: transparent; color: inherit; font: inherit; font-size: .8rem !important; font-weight: 800; text-align: center; text-align-last: center; cursor: pointer; text-overflow: ellipsis; }
.home-v2-quick-filters label:focus-within { outline: 3px solid var(--blue-dark); outline-offset: 2px; }
.home-v2-quick-filters select:focus { outline: none; }
.home-v2-location-link:focus-visible, #homeV2Weather:focus-visible { outline: 3px solid var(--blue-dark); outline-offset: 3px; border-radius: 12px; }
#homeV2CategoryPills { display: flex; gap: 10px; margin: 0; padding: 3px 2px 10px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; overscroll-behavior-inline: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
#homeV2CategoryPills::-webkit-scrollbar { display: none; }
#homeV2CategoryPills .home-v2-pill { flex: 0 0 108px; flex-direction: column; min-width: 108px; min-height: 92px; padding: 12px 7px; gap: 8px; border-radius: 18px; border: 1px solid var(--line); font-size: 1rem; line-height: 1.2; font-weight: 800; scroll-snap-align: start; }
#homeV2CategoryPills .home-v2-pill > span { overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; }
#homeV2CategoryPills svg { width: 32px; height: 32px; stroke-width: 1.8; }
#homeV2CategoryPills .home-v2-pill--pink { color: #a43760; border-color: #f1c8d6; background: #fff0f4; }
#homeV2CategoryPills .home-v2-pill--green { color: #2b775d; border-color: #c6e6d6; background: #eaf8ef; }
#homeV2CategoryPills .home-v2-pill--purple { color: #7450a5; border-color: #e0d5f3; background: #f3eeff; }
#homeV2CategoryPills .home-v2-pill--yellow { color: #966613; border-color: #f0e0b6; background: #fff7e6; }
#homeV2CategoryPills .home-v2-pill--blue { color: #356b9c; border-color: #cbdff2; background: #edf6ff; }
#homeV2CategoryPills .home-v2-pill--coral { color: #a64f5d; border-color: #f1ccd1; background: #fff1f2; }
#homeV2MatchBanner { position: relative; isolation: isolate; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; grid-template-rows: 1fr; aspect-ratio: auto; align-items: center; gap: 10px; min-height: 88px; padding: 12px 14px; overflow: hidden; border: 1px solid #ddd0f7; border-radius: 20px; background: #f8f3ff; box-shadow: none; }
#homeV2MatchBanner::before { position: absolute; z-index: -1; inset: 0; background: linear-gradient(112deg, transparent 0 56%, rgba(221, 208, 249, .28) 56% 72%, transparent 72%); content: ""; }
#homeV2MatchBanner::after { display: none; }
#homeV2MatchBanner:hover { border-color: #d7c6f5; box-shadow: none; transform: none; }
#homeV2MatchBanner .home-v2-match-copy { min-width: 0; grid-column: 2; grid-row: 1; padding: 0; }
#homeV2MatchBanner .home-v2-match-copy strong { display: block; color: var(--ink); font-size: .96rem; font-weight: 900; line-height: 1.15; letter-spacing: -.025em; white-space: nowrap; }
#homeV2MatchBanner .home-v2-match-copy > span { display: block; margin-top: 4px; color: #526276; font-size: .78rem; font-weight: 700; line-height: 1.25; white-space: nowrap; }
#homeV2MatchBanner .home-v2-match-visual { position: static; grid-column: 1; grid-row: 1; min-height: 0; width: 34px; height: 34px; transform: none; }
#homeV2MatchBanner .home-v2-match-visual svg { width: 34px; height: 34px; color: #8060be; }
#homeV2MatchBanner .home-v2-match-cta { position: static; grid-column: 3; grid-row: 1; min-width: 122px; min-height: 46px; display: flex; align-items: center; justify-content: center; padding: 0 14px; border-radius: 999px; color: #52396f; background: #dfd2f3; box-shadow: none; font-size: .82rem; font-weight: 900; line-height: 1; white-space: nowrap; text-align: center; }

@media (min-width: 901px) {
  #discoverHomeV2 .home-v2-lead { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; gap: 32px; }
  #homeV2Spotlight { height: 300px; min-height: 300px; max-height: 300px; }
  #homeV2CategoryPills { gap: 14px; }
  #homeV2CategoryPills .home-v2-pill { flex-basis: 148px; min-width: 148px; min-height: 94px; flex-direction: row; gap: 12px; }
}
@media (max-width: 640px) {
  #discoverHomeV2 { padding-top: 12px; }
  /* Le défilement horizontal découpe aussi l'ombre sur l'axe vertical.
     Réserver sa zone de fondu sans repousser le bloc suivant. */
  .home-v2-nearby .home-v2-idea-rail { padding-bottom: 80px; margin-bottom: -68px; }
  #homeV2Carousel { margin-inline: -15px; }
  #homeV2Spotlight { height: 200px; min-height: 200px; max-height: 200px; border-radius: 0; }
  .home-v2-carousel-controls { margin-inline: 15px; }
  #homeV2Spotlight .home-v2-spotlight-copy { padding: 100px 16px 10px; }
  #homeV2SpotlightTitle { max-height: 1.13em; font-size: clamp(1.15rem, 4.8vw, 1.3rem); -webkit-line-clamp: 1; }
  #homeV2Spotlight .home-v2-spotlight-copy > p { margin: 4px 0 6px; line-height: 1.25; }
  #homeV2Spotlight .home-v2-spotlight-label { top: 8px; left: 16px; min-height: 30px; padding: 4px 10px; font-size: .75rem; }
  #homeV2Spotlight .home-v2-spotlight-label svg { width: 18px; height: 18px; }
  #homeV2Spotlight .home-v2-spotlight-favorite { top: 6px; right: 10px; }
  #homeV2MatchBanner { padding: 12px 14px; gap: 10px; grid-template-columns: 34px minmax(0, 1fr) auto; }
  #homeV2MatchBanner .home-v2-match-visual svg { width: 34px; height: 34px; }
  #homeV2MatchBanner .home-v2-match-cta { max-width: none; padding: 0 14px; }
}
/* Accueil membre sur téléphone : carrousel bord à bord et commandes compactes. */
@media (max-width: 640px) {
  body.discover-home-v2-active:not(.contributor-access) #discoverHomeV2 { padding-top: 0; }
  body.discover-home-v2-active:not(.contributor-access) .home-v2-carousel-controls { min-height: 32px; }
  body.discover-home-v2-active:not(.contributor-access) #homeV2SpotlightDots .home-v2-spotlight-dot,
  body.discover-home-v2-active:not(.contributor-access) .home-v2-carousel-pause { height: 32px; }
}
@media (max-width: 380px) {
  .home-v2-quick-filters { gap: 6px; }
  .home-v2-quick-filters label { padding-inline: 6px; gap: 4px; }
  .home-v2-quick-filters label > svg:first-child { width: 17px; height: 17px; }
  .home-v2-quick-filters select { font-size: .8125rem; }
  #homeV2CategoryPills { gap: 7px; }
  #homeV2CategoryPills .home-v2-pill { min-height: 84px; font-size: .875rem; border-radius: 15px; }
  #homeV2MatchBanner { grid-template-columns: 29px minmax(0, 1fr) auto; gap: 7px; padding: 10px; }
  #homeV2MatchBanner .home-v2-match-visual { width: 29px; height: 29px; }
  #homeV2MatchBanner .home-v2-match-visual svg { width: 29px; height: 29px; }
  #homeV2MatchBanner .home-v2-match-copy strong { font-size: .82rem; }
  #homeV2MatchBanner .home-v2-match-copy > span { font-size: .69rem; }
  #homeV2MatchBanner .home-v2-match-cta { grid-column: 3; grid-row: 1; min-width: 104px; min-height: 40px; padding: 0 10px; font-size: .72rem; }
  .home-v2-location-link { font-size: .9375rem; gap: 6px; }
  #homeV2Weather { padding-inline: 6px; gap: 4px; }
  .topbar { gap: 6px; }
  .topbar .brand { gap: 5px; }
  .topbar .brand-name { display: inline; font-size: 1rem; white-space: nowrap; }
  .topbar .brand-mark { width: 30px; }
}
@media (max-width: 480px) {
  .home-v2-quick-filters label { gap: 4px; min-height: 48px; padding: 0 7px; border-radius: 13px; }
  .home-v2-quick-filters label > svg:first-child { position: static; width: 16px; height: 16px; flex: 0 0 16px; }
  .home-v2-quick-filters label > .home-v2-chevron-down { top: 50%; right: 6px; width: 12px; height: 12px; transform: translateY(-50%) rotate(90deg); }
  .home-v2-quick-filters select { flex: 1 1 auto; min-height: 46px; padding: 0 15px 0 0; font-size: .75rem; white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
  #homeV2Spotlight .home-v2-spotlight-track { scroll-behavior: auto; }
  #homeV2Spotlight img, #homeV2CategoryPills button { transition: none; }
}
html[data-theme="dark"] .home-v2-quick-filters, html[data-theme="dark"] .home-v2-quick-filters label { background: #172125; }
html[data-theme="dark"] .home-v2-welcome-heading h1 em { color: #f0a9c0; }
html[data-theme="dark"] #homeV2MatchBanner { background: #2c2539; border-color: #514461; }
html[data-theme="dark"] #homeV2Weather { color: #f4d36c; background: #302b1f; border-color: #685b30; }
html[data-theme="dark"] body.discover-home-v2-active:has(.discover-view.view--active),
html[data-theme="dark"] body.discover-home-v2-active:has(.discover-view.view--active) :is(.app-shell, .discover-view, .discover-home-panel, .discover-home-v2) { background: #172125; }
html[data-theme="dark"] body.map-active .topbar { background: rgba(14, 21, 24, .92); }
