/* Adventure club: warm paper, forest ink, and vivid windows into real games. */
@font-face { font-family: Bricolage; src: url('/assets/fonts/bricolage-latin.woff2') format('woff2'); font-weight: 400 800; font-display: swap; }
@font-face { font-family: 'DM Sans'; src: url('/assets/fonts/dm-sans-latin.woff2') format('woff2'); font-weight: 400 700; font-display: swap; }
:root { font-family: 'DM Sans', 'Avenir Next', sans-serif; }
button, select, input { font-family: inherit; }
h1, h2, h3, .mv-brand { font-family: Bricolage, 'Avenir Next', sans-serif; font-weight: 800; letter-spacing: -.035em; }
body.mv-home, body.mv-guide, body.mv-legal {
  color-scheme: light; --mv-bg: #f7f6ee; --mv-ink: #183b34; --mv-muted: #56685f;
  --mv-line: #d8dfd3; --mv-panel: #fffef8; --mv-panel-strong: #fffef8; --mv-accent: #205d49;
  background: #f7f6ee; color: var(--mv-ink);
}
html:has(body.mv-home, body.mv-guide, body.mv-legal) { background: #f7f6ee; }
.mv-legal .mv-retired-panel { background: #fffef8; border-color: #d5ddcf; }
.mv-home .mv-topbar, .mv-guide .mv-topbar, .mv-legal .mv-topbar { background: rgba(247,246,238,.95); backdrop-filter: blur(15px); padding-inline: max(24px, calc((100% - 1280px)/2)); min-height: 82px; }
.mv-brand { font-size: 1.5rem; letter-spacing: -.045em; gap: 12px; }
.mv-brand-mark { width: 37px; height: 37px; border: 0; border-radius: 12px 12px 12px 4px; box-shadow: none; background: #205d49; color: #fff5c5; transform: rotate(-7deg); font-size: 1.3rem; }
.mv-nav a { font-size: .88rem; font-weight: 600; }
.mv-home main { width: min(1280px, calc(100% - 64px)); }
.mv-home .mv-hero { min-height: 0; padding: 76px 0 64px; grid-template-columns: .95fr 1.05fr; gap: 64px; align-items: center; }
.mv-home .mv-kicker { margin: 0 0 18px; color: #2c6c52; font: 700 .72rem 'DM Sans', sans-serif; letter-spacing: .13em; line-height: 1.6; }
.mv-home .mv-hero .mv-kicker { display: flex; gap: 10px; align-items: center; }
.mv-home .mv-kicker > span { font-size: 28px; line-height: 1; color: #e7834d; }
.mv-home .mv-hero h1 { max-width: none; font-size: clamp(3rem, 5.7vw, 5.5rem); line-height: 1; letter-spacing: -.06em; }
.mv-home .mv-hero h1 em { font-style: normal; color: #2b7759; position: relative; white-space: nowrap; }
.mv-home .mv-hero h1 em::after { content: ''; display: block; position: absolute; inset: auto -6px -10px 0; height: 8px; border-top: 4px solid #ecab59; border-radius: 50%; transform: rotate(-3deg); }
.mv-home .mv-hero p:not(.mv-kicker) { max-width: 430px; margin-top: 30px; font-size: 1.07rem; line-height: 1.8; }
.mv-home .mv-hero-actions { gap: 10px; margin-top: 28px; }
.mv-home .mv-button { min-height: 54px; gap: 24px; border-radius: 13px; background: #205d49; color: #fffdf3; border-color: #205d49; padding: 14px 21px; font-weight: 700; font-size: .91rem; box-shadow: 0 4px 0 #153e31; transition: transform 180ms ease, box-shadow 180ms ease; }
.mv-home .mv-button:hover { transform: translateY(-2px); box-shadow: 0 6px 0 #153e31; filter: none; }
.mv-home .mv-button.secondary { color: #244b3d; border-color: #d4dccc; background: transparent; box-shadow: none; }
.mv-home .mv-button > span { font-size: 1.2rem; }
.mv-home .mv-hero-proof { font-size: .75rem; gap: 18px; margin-top: 27px; font-weight: 500; }
.mv-home .mv-orbit-board { min-height: 0; border: 1px solid #153d34; background: #183b34; border-radius: 24px; overflow: visible; box-shadow: 0 18px 0 -8px #d7e0cb, 0 30px 55px -35px #153e31; color: #fcfbea; transform: rotate(1deg); }
.mv-featured-top { display: flex; align-items: center; justify-content: space-between; min-height: 46px; padding: 9px 18px; gap: 8px; font-size: .63rem; letter-spacing: .02em; }
.mv-featured-top span { display: flex; gap: 8px; align-items: center; }
.mv-featured-top i { width: 6px; height: 6px; border-radius: 50%; background: #e9c766; }
.mv-featured-top button { min-height: 30px; background: none; border: 0; color: #d5e8d7; padding: 5px; font-size: .65rem; cursor: pointer; }
.mv-hero-preview { position: relative; margin: 0 9px; aspect-ratio: 16/10; overflow: hidden; border-radius: 14px; background: #17343d; }
.mv-hero-preview img, .mv-preview-video { width: 100%; height: 100%; display: block; object-fit: cover; }
.mv-preview-video { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity 300ms ease; }
.mv-preview-video.is-playing { opacity: 1; }
.mv-hero-sticker { position: absolute; z-index: 2; right: 12px; top: 14px; width: 94px; height: 94px; border-radius: 50%; display: grid; place-content: center; background: #ffe5a0; color: #34533e; text-align: center; font: 700 .8rem Bricolage, sans-serif; transform: rotate(9deg); box-shadow: 0 3px 12px #071f2b44; }
.mv-home .mv-orbit-caption { position: static; margin: 0; border: 0; border-radius: 0; padding: 19px 22px; background: none; backdrop-filter: none; gap: 20px; }
.mv-orbit-caption small { display: block; color: #b5d2b4; font-size: .56rem; letter-spacing: .16em; margin-bottom: 6px; }
.mv-home .mv-orbit-caption strong { font: 800 1.6rem Bricolage, sans-serif; margin-bottom: 4px; letter-spacing: -.035em; }
.mv-home .mv-orbit-caption span { color: #c4d8ca; font-size: .76rem; line-height: 1.45; display: block; }
.mv-featured-play { display: grid; flex-shrink: 0; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #e5eab9; color: #183b34; font-size: 24px; text-decoration: none; transition: transform 180ms ease; }
.mv-featured-play:hover { transform: rotate(10deg); }
.mv-home .mv-hero-tabs { position: static; background: #12332d; border-radius: 0 0 24px 24px; padding: 11px 14px; justify-content: space-between; gap: 6px; }
.mv-home .mv-hero-tabs button { flex: 1; min-height: 37px; border-color: transparent; border-radius: 10px; background: transparent; color: #c4d8ca; font: 600 .7rem 'DM Sans', sans-serif; padding: 8px 6px; }
.mv-home .mv-hero-tabs [aria-pressed='true'] { background: #eff2d4; color: #183b34; }
.mv-play-strip { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 0; border-top: 1px solid #d8dfd3; border-bottom: 1px solid #d8dfd3; font-size: .8rem; }
.mv-play-strip p { margin: 0; font-family: Bricolage, sans-serif; font-size: 1.04rem; }
.mv-play-strip span { color: #56685f; }
.mv-play-strip span::before { content: '✧'; color: #b86a33; margin-right: 10px; }
.mv-home #games { padding-top: 82px; }
.mv-home .mv-section-head { margin-bottom: 30px; align-items: end; gap: 60px; }
.mv-home .mv-section-head h2 { font-size: clamp(2.1rem, 3.5vw, 3.6rem); line-height: 1.06; letter-spacing: -.045em; }
.mv-home .mv-section-head p:not(.mv-kicker) { max-width: 380px; font-size: .91rem; line-height: 1.7; }
.mv-home .mv-section-head .mv-kicker { margin-bottom: 12px; }
.mv-home .mv-filters { gap: 8px; }
.mv-home .mv-filters button { min-height: 44px; border: 1px solid #d5ddcf; background: transparent; color: #506558; font: 600 .8rem 'DM Sans', sans-serif; padding: 10px 17px; }
.mv-home .mv-filters button:hover { background: #e8ecd9; }
.mv-home .mv-filters button[aria-pressed='true'] { background: #205d49; border-color: #205d49; color: #fffdf3; }
.mv-home .mv-filter-status { font-size: .73rem; margin: 18px 0 24px; color: #5a6b60; }
.mv-home .mv-game-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.mv-home .mv-game-card { min-height: 0; border-radius: 19px; border: 1px solid #d6dfd0; background: #fffef8; transition: transform 220ms ease, box-shadow 220ms ease; overflow: hidden; }
.mv-home .mv-game-card:hover, .mv-home .mv-game-card:focus-visible { transform: translateY(-5px); border-color: #9fb299; box-shadow: 0 12px 26px -15px #24553d66; }
.mv-preview-frame { position: relative; overflow: hidden; aspect-ratio: 16/10; margin: 7px 7px 0; border-radius: 13px; background: #12353c; }
.mv-home .mv-card-preview { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16/10; transition: transform 600ms cubic-bezier(.2,.7,.3,1); }
.mv-home .mv-game-card:hover .mv-card-preview { transform: scale(1.045); }
.mv-preview-label, .mv-card-completed { position: absolute; left: 12px; top: 12px; background: #102d2ae8; color: #eef6d9; border: 1px solid #ffffff33; border-radius: 8px; font-size: .61rem; font-weight: 600; padding: 6px 9px; backdrop-filter: blur(8px); }
.mv-preview-play { position: absolute; bottom: 12px; right: 12px; display: grid; place-items: center; width: 35px; height: 35px; border-radius: 50%; background: #faf7e8; color: #183b34; font-size: 21px; }
.mv-card-completed { display: none; top: auto; bottom: 12px; color: #d1f5a7; }
.mv-game-card.is-completed .mv-card-completed { display: block; }
.mv-home .mv-game-card.is-completed .mv-card-action::before { content: none; }
.mv-home .mv-card-body { padding: 20px 23px; }
.mv-home .mv-card-meta { display: flex; justify-content: space-between; margin-bottom: 9px; color: #65755e; font-size: .65rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.mv-home .mv-game-card h3 { color: #1f4435; font-size: 1.6rem; line-height: 1.1; letter-spacing: -.04em; }
.mv-home .mv-game-card p { margin-top: 9px; font-size: .84rem; line-height: 1.6; color: #56685f; }
.mv-home .mv-card-action { color: #205d49; padding: 15px 23px; font-size: .8rem; align-items: center; gap: 12px; }
.mv-home .mv-card-action > span:last-child { font-size: .65rem; font-weight: 400; color: #62745f; }
.mv-home .mv-reset-progress { color: #56685f; font-size: .7rem; margin-top: 8px; }
.mv-home .mv-explainer { margin-top: 32px; padding: 48px 0; }
.mv-home .mv-step-list { gap: 30px; border: 0; }
.mv-home .mv-step-list li { padding: 25px 0; border-top: 1px solid #ccd9c7; }
.mv-home .mv-step-list li > span { background: #e7edd5; color: #205d49; border: 0; border-radius: 12px; }
.mv-home .mv-step-list h3 { font-size: 1.3rem; }
.mv-home .mv-step-list p { font-size: .85rem; line-height: 1.7; }
.mv-home .mv-pathways { padding: 48px; background: #e9eddd; border: 0; border-radius: 22px; gap: 65px; }
.mv-home .mv-pathways h2 { font-size: clamp(2rem, 3vw, 3rem); line-height: 1.08; }
.mv-home .mv-pathways-copy > p:not(.mv-kicker) { font-size: .9rem; line-height: 1.8; }
.mv-home .mv-pathway-links a { border-color: #ccd7c0; background: transparent; border-radius: 0; padding: 16px 0; }
.mv-home .mv-pathway-links a:hover { background: none; transform: translateX(3px); }
.mv-home .mv-pathway-links strong { font: 700 1.1rem Bricolage, sans-serif; }
.mv-home .mv-pathway-links span { font-size: .8rem; }
.mv-home .mv-trust-band { background: #183b34; border: 0; border-radius: 22px; color: #f5f4dd; padding: 42px; }
.mv-home .mv-trust-band h2 { font-size: 2rem; }
.mv-home .mv-trust-band p, .mv-home .mv-trust-band li span { color: #c0d4c4; }
.mv-home .mv-trust-band li strong { color: #e6ecad; }
.mv-home .mv-faq h2 { font-size: 2.7rem; line-height: 1.05; }
.mv-home .mv-faq summary { font-weight: 600; }
.mv-home .mv-faq details { border-color: #ccd9c7; }
.mv-home .mv-footer { padding-inline: max(32px, calc((100% - 1280px)/2)); padding-block: 36px; }
.mv-home .mv-footer p, .mv-home .mv-footer small, .mv-home .mv-footer nav { font-size: .76rem; }

/* Keep the play surface cinematic; give its menus the same crafted typography. */
.mv-game { background: #102822; --mv-radius: 20px; --mv-panel: #16372f; --mv-panel-strong: #16372f; --mv-muted: #b2cabe; }
.mv-game .mv-topbar { background: #0e241feF; }
.mv-game .mv-brand-mark { background: #e9edc2; color: #163c2e; }
.mv-game .mv-permission-card { border-radius: 22px; background: #11382fed; border-color: #52755d; box-shadow: 0 24px 60px #02181066; }
.mv-game .mv-permission-card h1 { color: #f3f5d9; letter-spacing: -.045em; }
.mv-game .mv-permission-card p { color: #c1d6c9; }
.mv-game .mv-permission-tip { border-color: #507561; background: #214c3f; }
.mv-game .mv-round-options select, .mv-game .mv-camera-options select { background: #163e32; border-color: #547760; }
.mv-game .mv-panel { background: #15382e; border-color: #34594a; }
.mv-game .mv-permission.is-result .mv-permission-card { border-top: 3px solid #e2de8b; animation: mv-result-enter 650ms cubic-bezier(.2,.8,.2,1) both; }
@keyframes mv-result-enter { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

/* A presentation-only celebration. Game physics and scores are already stopped. */
.mv-finale { position: absolute; inset: 0; z-index: 7; display: grid; place-items: center; overflow: hidden; padding: 100px 20px 86px; background: radial-gradient(ellipse at center, #092c287a, #092c2812 75%); }
.mv-finale[hidden] { display: none; }
.mv-finale-message { position: relative; z-index: 2; text-align: center; max-width: 620px; color: #fffce6; text-shadow: 0 3px 14px #061d2c; animation: mv-finale-enter 800ms cubic-bezier(.15,.9,.2,1.2) both; }
.mv-finale-medal { position: relative; display: grid; place-items: center; margin: 0 auto 24px; width: 118px; height: 118px; border-radius: 50%; background: #183b34ed; box-shadow: 0 0 70px #ffe6a355, 0 10px 35px #06261f88; }
.mv-finale-medal > span { color: #ffe097; font-size: 58px; line-height: 1; animation: mv-medal-pop 1.3s cubic-bezier(.2,.7,.2,1) both; }
.mv-finale-medal svg { position: absolute; inset: -5px; width: calc(100% + 10px); height: calc(100% + 10px); transform: rotate(-90deg); }
.mv-finale-medal circle { fill: none; stroke: #ffe2a0; stroke-width: 2; stroke-dasharray: 346; stroke-dashoffset: 346; animation: mv-medal-ring 1.4s .2s ease forwards; }
.mv-finale-message > p:first-of-type { font-size: .68rem; font-weight: 700; letter-spacing: .22em; color: #ffe6a3; }
.mv-finale-message h2 { margin: 12px 0; font-size: clamp(1.8rem, 4vw, 3.6rem); line-height: 1.04; text-wrap: balance; }
.mv-finale-message #finale-copy { margin: 0 auto; font-size: .92rem; line-height: 1.6; max-width: 38ch; color: #e4f0dc; }
#skip-celebration { margin-top: 24px; min-height: 44px; border: 1px solid #daebca66; border-radius: 100px; background: #183b34d9; color: #f8f4d8; font-size: .8rem; padding: 10px 20px; cursor: pointer; }
#skip-celebration span { margin-left: 10px; }
.mv-finale-particles { position: absolute; inset: 0; pointer-events: none; }
.mv-finale-particles i { position: absolute; left: var(--x); top: -20px; width: var(--size); height: calc(var(--size)*1.6); border-radius: 3px; background: var(--color); opacity: 0; animation: mv-confetti 3.7s var(--delay) cubic-bezier(.15,.5,.5,1) both; }
.mv-finale-particles i:nth-child(3n) { border-radius: 50%; height: var(--size); }
.mv-finale-particles i:nth-child(4n) { clip-path: polygon(50% 0,61% 35%,100% 50%,61% 65%,50% 100%,39% 65%,0 50%,39% 35%); width: calc(var(--size)*2); height: calc(var(--size)*2); }
.mv-finale[data-kind='ocean'] .mv-finale-particles i { border-radius: 50%; height: var(--size); border: 1px solid #d7fcff; background: #91e5ee88; clip-path: none; }
.mv-finale[data-kind='forest'] .mv-finale-particles i { border-radius: 70% 0 70% 0; }
@keyframes mv-confetti { 0% { opacity: 0; transform: translate3d(0,0,0) rotate(0); } 10% { opacity: .95; } 85% { opacity: .9; } 100% { opacity: 0; transform: translate3d(var(--drift),100vh,0) rotate(var(--spin)); } }
@keyframes mv-finale-enter { from { opacity: 0; transform: translateY(24px) scale(.92); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes mv-medal-pop { 0% { transform: scale(.2) rotate(-25deg); opacity: 0; } 45% { transform: scale(1.12) rotate(6deg); opacity: 1; } 100% { transform: scale(1) rotate(0); } }
@keyframes mv-medal-ring { to { stroke-dashoffset: 0; } }
@media (min-width: 900px) and (prefers-reduced-motion: no-preference) { .mv-home .mv-hero > div:first-child { animation: mv-result-enter 700ms both; } .mv-home .mv-orbit-board { animation: mv-board-enter 900ms .1s both; } }
@keyframes mv-board-enter { from { opacity: 0; transform: translateY(24px) rotate(2deg); } to { opacity: 1; transform: translateY(0) rotate(1deg); } }
@media(max-width: 1050px) {
  .mv-home .mv-hero { gap: 35px; padding-top: 52px; }
  .mv-home .mv-game-grid { gap: 17px; }
  .mv-home .mv-card-body, .mv-home .mv-card-action { padding-inline: 17px; }
  .mv-play-strip { gap: 14px; flex-wrap: wrap; }
  .mv-home .mv-pathways { gap: 30px; padding: 32px; }
}
@media(max-width: 760px) {
  .mv-home main { width: calc(100% - 36px); }
  .mv-home .mv-topbar { min-height: 67px; padding: 13px 18px; }
  .mv-brand { font-size: 1.25rem; gap: 8px; }
  .mv-brand-mark { width: 30px; height: 30px; font-size: 1.1rem; border-radius: 9px; }
  .mv-home .mv-nav a { padding: 8px 7px; font-size: .73rem; }
  .mv-home .mv-nav a:nth-child(2) { display: none; }
  .mv-home .mv-hero { grid-template-columns: 1fr; gap: 38px; padding: 42px 0; }
  .mv-home .mv-hero h1 { font-size: clamp(3rem, 11vw, 4.5rem); }
  .mv-home .mv-hero p:not(.mv-kicker) { margin-top: 25px; font-size: .97rem; max-width: 36ch; }
  .mv-home .mv-kicker { font-size: .65rem; }
  .mv-home .mv-hero-actions { gap: 8px; }
  .mv-home .mv-button { min-height: 50px; padding: 13px 16px; gap: 16px; font-size: .8rem; }
  .mv-home .mv-hero-proof { gap: 13px; font-size: .65rem; }
  .mv-home .mv-orbit-board { transform: none; margin: 0 3px; border-radius: 19px; }
  .mv-hero-sticker { width: 76px; height: 76px; font-size: .68rem; }
  .mv-home .mv-orbit-caption { padding: 16px; }
  .mv-home .mv-orbit-caption strong { font-size: 1.5rem; }
  .mv-home .mv-orbit-caption span { font-size: .7rem; }
  .mv-featured-top { padding-inline: 15px; font-size: .58rem; }
  .mv-home .mv-hero-tabs { border-radius: 0 0 19px 19px; padding: 10px; }
  .mv-home .mv-hero-tabs button { font-size: .64rem; }
  .mv-play-strip { padding: 22px 2px; gap: 13px 20px; font-size: .68rem; }
  .mv-play-strip p { flex-basis: 100%; font-size: 1.05rem; }
  .mv-home #games { padding-top: 49px; }
  .mv-home .mv-section-head { display: grid; gap: 18px; margin-bottom: 25px; }
  .mv-home .mv-section-head p:not(.mv-kicker) { font-size: .86rem; }
  .mv-home .mv-game-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
  .mv-home .mv-card-body { padding: 15px 14px; }
  .mv-home .mv-game-card h3 { font-size: 1.25rem; }
  .mv-home .mv-game-card p { font-size: .76rem; }
  .mv-home .mv-card-meta { font-size: .55rem; gap: 4px; }
  .mv-home .mv-card-action { padding: 12px 14px; font-size: .74rem; }
  .mv-home .mv-card-action > span:last-child { display: none; }
  .mv-home .mv-filters button { padding: 10px 13px; font-size: .72rem; }
  .mv-home .mv-step-list { grid-template-columns: 1fr; gap: 0; }
  .mv-home .mv-step-list li { padding: 22px 0; }
  .mv-home .mv-pathways { grid-template-columns: 1fr; padding: 26px; }
  .mv-home .mv-trust-band { padding: 27px; gap: 24px; }
  .mv-home .mv-faq { gap: 24px; }
  .mv-home .mv-footer { padding: 30px 20px; }
  .mv-finale { padding: 100px 18px 82px; }
  .mv-finale-medal { width: 88px; height: 88px; margin-bottom: 16px; }
  .mv-finale-medal > span { font-size: 45px; }
  .mv-finale-message #finale-copy { font-size: .8rem; }
}
@media(max-width: 450px) {
  .mv-home .mv-game-grid { grid-template-columns: 1fr; gap: 20px; }
  .mv-home .mv-card-body { padding: 18px 20px; }
  .mv-home .mv-game-card h3 { font-size: 1.65rem; }
  .mv-home .mv-game-card p { font-size: .86rem; }
  .mv-home .mv-card-meta { font-size: .64rem; }
  .mv-home .mv-card-action { padding: 14px 20px; }
  .mv-home .mv-card-action > span:last-child { display: block; }
  .mv-home .mv-nav a { font-size: .68rem; padding-inline: 5px; }
}
@media(orientation:landscape) and (max-height:600px) {
  .mv-finale { padding: 86px 20px 68px; }
  .mv-finale-medal { width: 54px; height: 54px; margin: 0 auto 8px; }
  .mv-finale-medal > span { font-size: 29px; }
  .mv-finale-message h2 { font-size: 1.6rem; margin: 8px 0; }
  .mv-finale-message > p:first-of-type { font-size: .55rem; margin: 8px 0; }
  .mv-finale-message #finale-copy { font-size: .7rem; }
  #skip-celebration { margin-top: 10px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .mv-home *, .mv-finale *, .mv-game .mv-permission.is-result .mv-permission-card { animation: none !important; transition: none !important; }
  .mv-home .mv-game-card:hover, .mv-home .mv-button:hover { transform: none; }
  .mv-finale-particles { display: none; }
  .mv-finale-medal circle { stroke-dashoffset: 0; }
}
