/* Public landing only: never change the authenticated game's global selectors. */
.wmm-landing { --wl-red:#c40018; --wl-ink:#211e28; --wl-muted:#65616f; background:#fff; color:var(--wl-ink); font:16px/1.65 Arial,Helvetica,sans-serif; overflow:clip; text-align:left; }
.wmm-landing *, .wmm-landing *::before, .wmm-landing *::after { box-sizing:border-box; }
.wmm-landing h1,.wmm-landing h2,.wmm-landing h3,.wmm-landing p { padding:0; margin:0; color:inherit; font-family:inherit; text-shadow:none; }
.wmm-landing a { color:inherit; text-decoration:none; }
.wmm-landing button { font:inherit; cursor:pointer; }
.wmm-landing :focus-visible { outline:3px solid #285cc9; outline-offset:5px; }
.wmm-landing [tabindex="-1"]:focus { outline:none; }
.wl-wrap { width:min(1200px,calc(100% - 80px)); margin:auto; }
.wl-header { background:rgba(255,255,255,.96); border-bottom:1px solid #eeeaf0; }
.wl-nav { display:flex; align-items:center; gap:36px; min-height:100px; }
.wl-brand { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.wl-brand img { display:block; object-fit:contain; }
.wl-brand span { font-size:11px; letter-spacing:3px; font-weight:800; border-left:1px solid #dad7dd; padding-left:12px; }
.wl-links { display:flex; gap:26px; margin-left:auto; }
.wl-links button { border:0; background:none; padding:10px 0; color:#56515e; font-size:14px; font-weight:600; }
.wl-links button:hover,.wl-login:hover { color:var(--wl-red); }
.wl-nav-actions { display:flex; align-items:center; gap:24px; font-size:14px; font-weight:700; }
.wl-theme-toggle { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; flex-shrink:0; border:1px solid #ded8e5; border-radius:50%; background:transparent; color:inherit; }
.wl-theme-toggle:hover { background:#eee9f2; }
.wmm-landing .wl-button { display:inline-flex; justify-content:center; align-items:center; gap:22px; min-height:54px; padding:14px 24px; background:var(--wl-red); color:white; border:1px solid var(--wl-red); border-radius:8px; font-size:14px; font-weight:700; box-shadow:0 8px 22px #c4001818; transition:background .15s,transform .15s; }
.wmm-landing .wl-button:hover { background:#9c0013; transform:translateY(-2px); }
.wmm-landing .wl-button-small { min-height:43px; padding:9px 16px; font-size:12px; gap:12px; }
.wl-hero { background:radial-gradient(ellipse at 90% 38%,#ede8ff 0,transparent 56%),linear-gradient(120deg,#fff 18%,#fff9f7 100%); padding:64px 0 60px; }
.wl-hero-grid { display:grid; grid-template-columns:1.12fr 1fr; gap:56px; align-items:center; }
.wmm-landing .wl-eyebrow { color:var(--wl-red); font-size:11px; letter-spacing:2px; font-weight:800; margin-bottom:22px; }
.wl-eyebrow > span { display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--wl-red); margin-right:8px; }
.wmm-landing h1 { font-size:clamp(40px,4.5vw,64px); line-height:1.06; letter-spacing:-3px; font-weight:800; }
.wmm-landing h1 em { color:var(--wl-red); font-style:normal; }
.wmm-landing .wl-lead { margin-top:28px; font-size:20px; font-weight:700; }
.wmm-landing .wl-intro { max-width:500px; margin-top:12px; color:var(--wl-muted); font-size:16px; line-height:1.8; }
.wl-actions { display:flex; flex-wrap:wrap; gap:20px; align-items:center; margin-top:30px; }
.wmm-landing .wl-text-button { display:inline-flex; align-items:center; gap:14px; border:0; background:none; padding:8px 0; color:var(--wl-ink); font-size:14px; font-weight:700; }
.wmm-landing .wl-text-button:hover { color:var(--wl-red); }
.wmm-landing .wl-note { color:#77717d; font-size:11px; margin-top:22px; }
.wl-hero-art { position:relative; height:540px; padding:0 35px 0 24px; }
.wl-hero-character { height:100%; border-radius:150px 150px 24px 24px; overflow:hidden; background:#282631; box-shadow:0 24px 70px #4b35572a; position:relative; }
.wl-hero-character img { height:100%; width:100%; object-fit:cover; object-position:center 35%; display:block; }
.wl-art-caption { position:absolute; left:0; bottom:28px; background:#ffffffed; border:1px solid white; backdrop-filter:blur(12px); padding:18px 25px; border-radius:12px; box-shadow:0 8px 40px #251c281a; font-size:9px; font-weight:700; letter-spacing:1.5px; }
.wl-art-caption strong { display:block; font-size:23px; letter-spacing:-.5px; margin-top:3px; }
.wl-caption-dot { width:6px; height:6px; display:inline-block; background:var(--wl-red); border-radius:50%; margin-right:5px; }
.wl-mini-card { position:absolute; top:34px; right:0; display:flex; align-items:center; gap:12px; padding:15px 18px; border-radius:12px; background:#fff; box-shadow:0 8px 35px #34204120; }
.wl-mini-card .fa { color:#a56e0b; font-size:25px; }
.wl-mini-card div { font-size:8px; color:#777; letter-spacing:1px; }
.wl-mini-card strong { display:block; color:var(--wl-ink); font-size:13px; letter-spacing:0; }
.wl-values { display:grid; grid-template-columns:repeat(4,1fr); padding:26px 0; border-bottom:1px solid #ebe8ed; }
.wl-values span { text-align:center; border-right:1px solid #ebe8ed; font-size:12px; font-weight:700; }
.wl-values span:last-child { border:0; }
.wl-values b { color:#bc9b9e; font-size:10px; margin-right:12px; }
.wl-section { padding:90px 0; scroll-margin-top:24px; }
.wl-section-head { text-align:center; max-width:680px; margin:0 auto 42px; }
.wmm-landing h2 { font-size:clamp(32px,3.3vw,46px); line-height:1.14; letter-spacing:-1.8px; font-weight:750; }
.wmm-landing h2 span { color:#8b8593; }
.wl-section-head > p:last-child { margin-top:20px; color:var(--wl-muted); }
.wl-head-left { text-align:left; max-width:640px; margin-left:0; }
.wl-product { background:linear-gradient(180deg,#fff 20%,#f8f6fc 100%); }
.wl-devices { position:relative; max-width:980px; margin:auto; padding:0 85px 20px 0; }
.wl-desktop { background:#fff; border:1px solid #ded8e5; border-radius:12px; overflow:hidden; box-shadow:0 22px 55px #33204d1f; margin:0; }
.wl-window-bar { display:flex; align-items:center; gap:5px; height:32px; background:#faf9fb; border-bottom:1px solid #e6e2e9; padding:0 12px; }
.wl-window-bar i { width:5px; height:5px; border-radius:50%; background:#d4cbd9; }
.wl-window-bar span { font-size:8px; color:#73687a; margin:auto; letter-spacing:1px; }
.wl-desktop img { display:block; width:100%; height:auto; }
.wl-phone { position:absolute; right:0; bottom:0; width:18%; margin:0; border:6px solid #25232b; border-radius:25px; background:#25232b; box-shadow:0 12px 35px #201b3338; overflow:hidden; }
.wl-phone img { width:100%; height:auto; display:block; }
.wmm-landing .wl-product-caption { text-align:center; font-size:11px; color:#77717d; margin-top:26px; }
.wl-feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.wl-feature { padding:30px; background:#fcfbfd; border:1px solid #eae5ed; border-radius:14px; }
.wl-feature-icon { font-size:21px; color:var(--wl-red); background:#f9e9ec; border-radius:12px; padding:13px; margin-bottom:25px; }
.wmm-landing h3 { font-size:18px; line-height:1.35; font-weight:700; letter-spacing:-.35px; }
.wl-feature p { margin-top:14px; color:var(--wl-muted); font-size:14px; }
.wl-steps { padding:0; margin:0; list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.wl-steps li { position:relative; border-top:1px solid #e2dce6; padding-top:25px; }
.wl-step-number { color:var(--wl-red); font-size:30px; font-weight:700; display:block; margin-bottom:20px; letter-spacing:-1px; }
.wl-steps p { font-size:14px; color:var(--wl-muted); margin-top:12px; }
.wl-world { background:#f6f3f8; }
.wl-world-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; }
.wl-world p:not(.wl-eyebrow) { color:var(--wl-muted); margin-top:22px; }
.wl-world .wl-text-button { margin-top:22px; }
.wl-world-cards { display:grid; gap:14px; }
.wl-world-cards > div { display:grid; grid-template-columns:58px 1fr; column-gap:20px; align-items:center; padding:22px; border-radius:14px; background:white; border:1px solid #e9e2eb; box-shadow:0 8px 20px #25112a05; }
.wl-world-cards > div:nth-child(2) { margin-left:35px; }
.wl-world-cards .fa,.wl-world-cards img { grid-row:span 2; }
.wl-world-cards .fa { font-size:27px; color:#a27787; text-align:center; }
.wl-world-cards img { object-fit:contain; }
.wl-world-cards strong { font-size:17px; }
.wl-world-cards small { font-size:12px; color:var(--wl-muted); }
.wl-mascots { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.wl-mascot { border:1px solid #e9e4eb; border-radius:15px; overflow:hidden; background:#fff; }
.wl-mascot-image { position:relative; aspect-ratio:1; overflow:hidden; background:#f6f3ee; }
.wl-mascot-image img { display:block; width:100%; height:100%; object-fit:contain; }
.wl-mascot-text { padding:21px 18px 23px; }
.wmm-landing .wl-mascot-role { font-size:10px; color:var(--wl-red); line-height:1.4; min-height:28px; font-weight:700; }
.wl-mascot h3 { margin-top:6px; }
.wl-mascot-text > p:last-child { color:var(--wl-muted); font-size:12px; margin-top:10px; }
.wl-final { text-align:center; padding:80px 0; color:white; background:linear-gradient(90deg,#14101cf0,#17101cdc),url('../assets/landing/brand/wmm-arena-approved.webp') center 45%/cover; }
.wl-final .wl-eyebrow { color:#ff9aa4; }
.wl-final h2 { font-size:clamp(36px,4vw,54px); }
.wl-final p:not(.wl-eyebrow) { color:#d6cfdd; margin:20px 0 28px; }
.wmm-landing .wl-final-login { display:block; color:#d6cfdd; font-size:12px; margin-top:20px; }
.wl-footer { padding:42px 0; background:#fcfbfd; }
.wl-footer-grid { display:flex; align-items:center; gap:35px; justify-content:space-between; flex-wrap:wrap; }
.wl-footer p { font-size:11px; color:var(--wl-muted); margin-top:10px; }
.wl-footer nav { display:flex; flex-wrap:wrap; gap:25px; font-size:12px; }
.wl-footer small { font-size:10px; color:var(--wl-muted); }
.wl-skip { position:absolute; left:12px; top:-100px; z-index:10; background:#fff; padding:12px 20px; }
.wl-skip:focus { top:12px; }
.wmm-landing.wl-dark { --wl-ink:#f5f0f6; --wl-muted:#b7afbf; background:#100e13; color:var(--wl-ink); }
.wl-dark .wl-header { background:#100e13; border-color:#332b37; }
.wl-dark .wl-hero { background:linear-gradient(90deg,#100c14f5,#160b17b8),url('../assets/landing/brand/wmm-arena-approved.webp') center/cover; }
.wl-dark .wl-links button { color:#cbc1ce; }
.wl-dark .wl-eyebrow,.wl-dark h1 em,.wl-dark .wl-step-number,.wl-dark .wl-mascot-role { color:#ff6478; }
.wl-dark .wl-hero-character { border:1px solid #48303b; box-shadow:0 20px 70px #0008; }
.wl-dark .wl-art-caption,.wl-dark .wl-mini-card { background:#201a26f5; border-color:#463b4b; }
.wl-dark .wl-mini-card div,.wl-dark .wl-note,.wl-dark .wl-product-caption { color:#b7afbf; }
.wl-dark .wl-mini-card .fa { color:#edc16a; }
.wl-dark .wl-values,.wl-dark .wl-values span,.wl-dark .wl-steps li { border-color:#342c3b; }
.wl-dark .wl-values b { color:#c39da7; }
.wl-dark .wl-product { background:linear-gradient(#100e13,#1b141f); }
.wl-dark h2 span { color:#b1a5bb; }
.wl-dark .wl-feature,.wl-dark .wl-world-cards > div,.wl-dark .wl-mascot { background:#1b161f; border-color:#392f41; }
.wl-dark .wl-feature-icon { background:#351921; color:#ff8191; }
.wl-dark .wl-world { background:#17121c; }
.wl-dark .wl-footer { background:#100d14; border-top:1px solid #302835; }
.wl-dark .wl-theme-toggle { border-color:#53455b; }
.wl-dark .wl-theme-toggle:hover { background:#352b3c; }
.wl-dark .wl-skip { background:#211b28; }
.wl-dark .wl-world-cards .fa { color:#db9fb4; }
@media (max-width:1000px) {
    .wl-wrap { width:calc(100% - 48px); }
    .wl-links { display:none; }
    .wl-nav-actions { margin-left:auto; }
    .wl-hero-grid { gap:24px; }
    .wl-hero-art { height:470px; padding:0 12px; }
    .wl-hero h1 { font-size:46px; letter-spacing:-2px; }
    .wl-mascots { grid-template-columns:repeat(2,1fr); gap:24px; }
    .wl-world-grid { gap:45px; }
    .wl-steps { grid-template-columns:repeat(2,1fr); }
    .wl-feature-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:650px) {
    .wl-wrap { width:calc(100% - 36px); }
    .wl-nav { min-height:78px; gap:14px; }
    .wl-brand img { width:72px; height:44px; }
    .wl-brand span { display:none; }
    .wl-nav-actions { gap:11px; font-size:12px; }
    .wl-theme-toggle { width:32px; height:32px; }
    .wmm-landing .wl-button-small { font-size:11px; padding:9px 11px; gap:7px; min-height:40px; }
    .wl-hero { padding:38px 0 32px; }
    .wl-hero-grid { grid-template-columns:1fr; gap:35px; }
    .wl-hero h1 { font-size:46px; letter-spacing:-2px; }
    .wmm-landing .wl-eyebrow { font-size:9px; letter-spacing:1.6px; margin-bottom:18px; }
    .wmm-landing .wl-lead { font-size:18px; margin-top:24px; }
    .wmm-landing .wl-intro { font-size:14px; line-height:1.7; }
    .wl-actions { gap:16px; margin-top:24px; }
    .wmm-landing .wl-button { font-size:13px; padding:12px 17px; gap:12px; }
    .wmm-landing .wl-text-button { font-size:12px; gap:8px; }
    .wl-hero-art { height:430px; max-width:360px; width:100%; margin:auto; padding:0 20px; }
    .wl-art-caption { bottom:18px; }
    .wl-values { grid-template-columns:repeat(2,1fr); row-gap:14px; padding:22px 0; }
    .wl-values span { font-size:10px; }
    .wl-values span:nth-child(2) { border:0; }
    .wl-section { padding:56px 0; }
    .wmm-landing h2 { font-size:32px; letter-spacing:-1.2px; }
    .wl-section-head { margin-bottom:28px; }
    .wl-section-head > p:last-child { font-size:14px; margin-top:16px; }
    .wl-devices { padding:0 32px 20px 0; }
    .wl-phone { width:27%; border-width:3px; border-radius:13px; }
    .wl-window-bar { height:20px; padding:0 6px; }
    .wl-window-bar span { font-size:5px; }
    .wl-product-caption { max-width:260px; margin-left:auto!important; margin-right:auto!important; }
    .wl-feature-grid { grid-template-columns:1fr; gap:12px; }
    .wl-feature { padding:22px; }
    .wl-feature-icon { margin-bottom:18px; }
    .wl-steps { gap:25px 20px; }
    .wl-steps h3 { font-size:16px; }
    .wl-steps p { font-size:12px; }
    .wl-world-grid { grid-template-columns:1fr; gap:30px; }
    .wl-world p:not(.wl-eyebrow) { font-size:14px; }
    .wl-world-cards > div { padding:17px; gap:12px; }
    .wl-world-cards > div:nth-child(2) { margin-left:20px; }
    .wl-mascots { gap:14px; }
    .wl-mascot-text { padding:16px 12px; }
    .wl-mascot h3 { font-size:16px; }
    .wmm-landing .wl-mascot-role { font-size:9px; min-height:38px; }
    .wl-mascot-text > p:last-child { font-size:11px; }
    .wl-final { padding:55px 0; }
    .wl-final p:not(.wl-eyebrow) { font-size:14px; }
    .wl-footer-grid { gap:24px; }
    .wl-footer nav { gap:20px; }
}
/* Approved full-body scenes: no cropping, captions outside the artwork. */
.wl-carousel { height:auto!important; padding:0 10px 52px; }
.wl-carousel .wl-hero-character { border-radius:24px; height:auto; }
.wl-hero-character .wl-arena-scene { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.wl-stage-glow { position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at 50% 42%,#fff3,transparent 65%),linear-gradient(0deg,#0e0812b3,transparent 60%); }
.wl-carousel .wl-slide { position:relative; display:block; padding:0; }
.wl-hero-character .wl-slide-scene { display:block; width:100%; height:auto; object-fit:contain; }
.wl-hero-character .wl-slide-portrait { display:block; flex-shrink:0; width:68%; height:auto; aspect-ratio:1; object-fit:contain; border:3px solid #ffffffb3; border-radius:22px; box-shadow:0 10px 40px #0007; background:#f6f3ee; }
.wl-carousel .wl-slide-caption { text-align:center; color:white; margin:0; padding:14px 12px 16px; width:100%; background:#19131f; text-shadow:none; }
.wl-slide-caption span { font-size:10px; font-weight:700; letter-spacing:1px; color:#f0d4d9; }
.wl-slide-caption strong { display:block; font-size:26px; line-height:1.3; margin-top:3px; }
.wmm-landing .wl-slide-caption p { font-size:12px; margin-top:5px; color:#f8edf5; }
.wl-carousel-controls { position:absolute; bottom:0; left:10px; right:10px; display:flex; align-items:center; justify-content:center; gap:10px; }
.wl-carousel-controls button { width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; padding:0; background:transparent; border:1px solid #ded5e3; color:var(--wl-ink); border-radius:50%; font-size:23px; }
.wl-carousel-controls .fa { font-size:11px; }
.wl-carousel-controls button:hover { background:#c400181a; }
.wl-slide-dots { display:flex; }
.wl-slide-dots button { width:30px; border:0; }
.wl-slide-dots span { display:block; width:7px; height:7px; border-radius:50%; background:#9b909f; }
.wl-slide-dots [aria-pressed="true"] span { width:19px; border-radius:8px; background:var(--wl-red); }
.wl-dark .wl-carousel-controls button { border-color:#524359; }
.wl-dark .wl-slide-dots [aria-pressed="true"] span { background:#ff6478; }
.wl-laptop { margin:0; position:relative; padding:0 28px 20px; }
.wl-laptop .wl-desktop { border:2px solid #55535d; border-radius:16px 16px 3px 3px; background:#18171d; padding:0 10px; box-shadow:0 16px 40px #201b332b; }
.wl-laptop-camera { height:20px; display:flex; align-items:center; justify-content:center; }
.wl-laptop-camera::after { content:''; display:block; width:4px; height:4px; border-radius:50%; background:#505265; }
.wl-laptop-screen { aspect-ratio:16/10; overflow:auto; background:#fff; }
/* Crop the 47px browser chrome from the 955px-wide source; preserve the game UI. */
.wl-laptop-screen img { display:block; width:100%; height:auto; margin-top:-4.921466%; }
.wl-laptop-chin { height:22px; text-align:center; font-size:7px; line-height:22px; letter-spacing:1.7px; color:#ccc5d1; }
.wl-laptop-base { position:absolute; bottom:6px; left:0; right:0; height:17px; background:linear-gradient(#e8e9ed,#a1a2ad 60%,#747580); border-radius:2px 2px 45% 45%; box-shadow:0 15px 18px #201b332a; }
.wl-laptop-base span { display:block; width:17%; height:5px; margin:auto; border-radius:0 0 9px 9px; background:#787b88; }
.wl-devices { padding:0 80px 20px 0; }
.wl-phone { width:20%; bottom:0; right:0; z-index:1; }
@media(max-width:1000px) { .wl-carousel { height:515px; } .wl-hero-character .wl-slide-portrait { width:82%; } }
@media(max-width:650px) {
    .wl-carousel { height:445px; padding:0 0 48px; }
    .wl-hero-character .wl-slide-portrait { width:68%; }
    .wl-slide { padding:15px 20px 20px; }
    .wl-slide-caption { margin-top:10px; }
    .wl-slide-caption strong { font-size:22px; }
    .wl-slide-caption span { font-size:9px; }
    .wmm-landing .wl-slide-caption p { font-size:10px; }
    .wl-laptop { padding:0 12px 14px; }
    .wl-laptop .wl-desktop { padding:0 5px; border-radius:9px 9px 2px 2px; border-width:1px; }
    .wl-laptop-camera { height:10px; }
    .wl-laptop-chin { height:12px; line-height:12px; font-size:4px; }
    .wl-laptop-base { bottom:5px; height:10px; }
    .wl-laptop-base span { height:3px; }
    .wl-devices { padding:0 33px 20px 0; }
    .wl-phone { width:25%; }
}
@media (prefers-reduced-motion:reduce) { .wmm-landing *, .wmm-landing *::before, .wmm-landing *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }