/* Comic edition: the globe is the main panel. */
:root{--yellow:#ffe445;--paper:#fff9e8;--black:#20201d}
body{background:var(--paper);color:var(--black);background-image:radial-gradient(#20201d14 .8px,transparent .8px);background-size:8px 8px}
.demo-bar{border-bottom:2px solid var(--black);font-size:9px}header{max-width:1600px;padding:22px 4%}.logo b{color:var(--black)}.logo-coin{border:2px solid var(--black);box-shadow:3px 3px 0 var(--black)}nav a{color:var(--black);font-weight:700}.lang{color:var(--black);border:2px solid var(--black);background:white;box-shadow:2px 2px 0 var(--black)}
.hero{max-width:1600px;padding:8px 4% 30px}.orbit-label{color:var(--black);font-size:9px}.orbit-label i{background:var(--black)}.hero-copy{display:flex;align-items:center;justify-content:space-between;gap:24px}.hero h1{font-size:clamp(38px,4.6vw,68px);letter-spacing:-3px;line-height:1;margin:18px 0 25px;transform:rotate(-2deg);font-weight:700}.hero h1 br{display:none}.hero h1 em{color:var(--black);background:var(--yellow);box-shadow:4px 4px 0 var(--black);padding:0 12px;display:inline-block;border:2px solid var(--black);margin-left:10px}.hero-copy>p{font-size:13px;color:#535349;line-height:1.6;margin:0;max-width:280px}
.stage{height:660px;margin:0;border:3px solid var(--black);border-radius:18px;background:#dcefe8;box-shadow:7px 7px 0 var(--black);isolation:isolate; background-image:radial-gradient(#265e4a1c 1px,transparent 1px);background-size:7px 7px}
#globe{left:0;top:0;width:76%;height:630px;z-index:1;filter:drop-shadow(9px 12px 0 #1b3c3330)}.letter{right:24px;top:75px;width:265px;padding:24px 22px 18px;transform:rotate(3deg);border:3px solid var(--black);border-radius:5px;box-shadow:6px 6px 0 var(--black)}.tape{background:#ffe445d9;border:1px solid #20201d55;width:85px}.paper-kicker{font-size:8px}.letter h2{font-size:44px;letter-spacing:-2px;margin:18px 0 14px}.letter p{font-size:11px;line-height:1.6}.signature{font-size:10px;line-height:1.5;max-width:160px;margin-bottom:18px}.letter-mascot{top:138px;right:-16px;width:91px;height:125px}.letter .pay{font-size:11px;padding:13px 10px}.pay{border:2px solid var(--black);border-radius:4px;box-shadow:4px 4px 0 var(--black)}.qr-section{margin-top:14px;padding-top:12px}.qr-section p{font-size:9px}.letter>small{font-size:8px}.planet-note{display:block;left:28px;top:95px;background:white;color:var(--black);padding:12px 17px;border:2px solid var(--black);border-radius:50%;font-weight:700;box-shadow:3px 3px 0 var(--black);z-index:2}.globe-label{left:22px;bottom:auto;top:22px;transform:none;color:#33483d;letter-spacing:1.3px;font-size:9px;font-weight:700}.treasure{left:64%;bottom:70px;transform:rotate(-7deg) scale(.85);transform-origin:bottom center}.treasure-caption{color:var(--black);background:var(--yellow);border:2px solid var(--black);padding:6px;font-size:8px}.spark{color:#ce8200}.chest-box,.chest-lid{outline:2px solid var(--black)}.live-pill{left:22px;bottom:22px;background:white;color:var(--black);border:2px solid var(--black);box-shadow:3px 3px 0 var(--black);border-radius:5px;font-weight:700}.live-dot{background:#218867}.show-controls{left:auto;right:24px;top:auto;bottom:22px;align-items:end}.show-controls button{background:var(--yellow);border:2px solid var(--black);color:var(--black);box-shadow:3px 3px 0 var(--black);border-radius:5px;font-weight:700}.show-controls span{color:#38463e;font-size:7px}.coin-dot{width:10px;height:10px;font-size:7px;line-height:8px;border:1px solid #4d3e16;box-shadow:1px 1px 0 #20201d}.map-marker{grid-template-columns:repeat(3,10px)}.map-tooltip{border:2px solid var(--black)}
.goal{border:2px solid var(--black);background:white;box-shadow:5px 5px 0 var(--black);border-radius:8px;margin-top:24px;padding:22px 28px;gap:24px}.label,.demo-caption,.goal-right>small{color:#626356}.goal strong{font-size:48px;margin:0}.goal strong small{color:var(--black);font-size:32px}.goal-right>span{color:#626356}.goal-right>b{font-size:17px}.progress{border:1px solid var(--black);background:#ebe9db;margin:10px 0 5px}.progress>div{min-width:8px}.why{border-top:3px solid var(--black);border-bottom:3px solid var(--black);background:var(--yellow);padding-top:60px;padding-bottom:60px}.why h2 em{color:var(--black);background:white}.why details{border-color:#20201d55}.takeaway{color:var(--black)}.takeaway .eyebrow,.mascot-placeholder b{color:var(--black)}.takeaway p,.takeaway small{color:#55574c}.sticker{border:3px solid var(--black);box-shadow:6px 6px 0 var(--black)}footer{border-top:3px solid var(--black);background:var(--black);color:var(--paper)}footer .logo{color:var(--yellow)}dialog{border:3px solid var(--black);border-radius:6px}
@media(max-width:1100px) and (min-width:701px){.hero-copy>p{display:none}#globe{width:73%}.letter{width:235px;right:18px;top:90px}.letter h2{font-size:38px}.stage{height:600px}#globe{height:570px}.treasure{left:58%;bottom:70px}}
@media(max-width:700px){header{padding:18px 5%}nav a{display:none}.hero{padding:10px 4% 25px}.orbit-label{font-size:7px}.hero-copy{display:block}.hero h1{font-size:36px;letter-spacing:-1.8px;margin:17px 0 14px}.hero h1 br{display:block}.hero h1 em{margin:5px 0 0;padding:2px 9px}.hero-copy>p{font-size:11px;line-height:1.5;margin-bottom:18px;max-width:none}.hero-copy>p br{display:none}.stage{height:auto;padding-top:415px;padding-bottom:72px;border-radius:12px;box-shadow:4px 4px 0 var(--black)}#globe{left:0;top:25px;width:100%;height:350px}.globe-label{top:14px;left:14px;font-size:7px;letter-spacing:.5px}.planet-note{left:10px;top:55px;font-size:8px;padding:8px 10px}.treasure{left:auto;right:10px;top:290px;bottom:auto;transform:rotate(-7deg) scale(.52);transform-origin:top right}.treasure-caption{display:none}.show-controls{top:360px;bottom:auto;left:14px;right:auto;align-items:start;gap:5px}.show-controls button{font-size:10px;padding:10px 12px}.show-controls span{font-size:6px}.letter{position:relative;top:auto;right:auto;width:calc(100% - 36px);max-width:none;margin:8px 18px 12px;padding:20px;transform:rotate(-1deg);box-shadow:4px 4px 0 var(--black)}.letter h2{font-size:36px;line-height:1;margin:14px 0}.letter h2 br{display:none}.letter p{font-size:11px;padding-right:74px}.letter-mascot{right:7px;top:60px;width:85px;height:115px}.signature{max-width:220px;padding-right:40px;font-size:9px;margin-bottom:14px}.letter .pay{font-size:12px;padding:13px}.qr-section{display:none}.live-pill{left:14px;bottom:16px;max-width:calc(100% - 28px);font-size:9px;padding:10px 12px;gap:6px}.map-marker{transform:translate(-50%,-50%) scale(.9)}.goal{grid-template-columns:1fr 1fr;padding:18px 14px;gap:12px;margin-top:18px}.label{font-size:7px;letter-spacing:.4px}.goal strong{font-size:37px}.goal strong small{font-size:24px}.demo-caption{font-size:6px;letter-spacing:.2px;line-height:1.6}.goal-right>span{font-size:7px;line-height:1.4}.goal-right>b{font-size:12px}.goal-right>small{font-size:8px}.why{padding:40px 6%}.why h2{font-size:40px}.takeaway{padding:40px 6%}.takeaway h2{font-size:36px}}
.flight-coin,.mascot-coin{position:absolute;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#ffe445;border:3px solid #63491b;color:#332715;font:bold 21px Arial;box-shadow:2px 3px 0 #20201d55;pointer-events:none;z-index:8;will-change:transform,left,top}.mascot-coin{position:fixed;z-index:150}.mascot-button{border:0;background:transparent;padding:0;cursor:pointer;pointer-events:auto;touch-action:manipulation;-webkit-appearance:none;appearance:none;overflow:visible}.mascot-image{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.comic-large.mascot-button{position:relative}.mascot-button:active .mascot-image{transform:rotate(-5deg)}.mascot-bubble{position:absolute;bottom:90%;right:-8px;width:145px;padding:10px;background:white;border:2px solid #20201d;border-radius:14px 14px 0 14px;box-shadow:3px 3px 0 #20201d;color:#20201d;font:bold 11px/1.4 Arial;transform:rotate(5deg);z-index:12;pointer-events:none}.mascot-button::after{content:'Tipp mich!';position:absolute;right:0;bottom:-5px;background:#ffe445;border:1px solid #20201d;border-radius:8px;padding:3px 6px;color:#20201d;font:bold 8px Arial;transform:rotate(6deg);pointer-events:none}.mascot-button.is-flipping::after{visibility:hidden}
/* A welcoming, interactive mascot beside the opening headline. */
.hero-copy{gap:18px;min-height:150px}.hero-copy h1{font-size:clamp(38px,4.1vw,60px)}.hero-mascot{position:relative;flex:0 0 110px;width:110px;height:145px;align-self:end;order:3;margin-bottom:12px;transform:rotate(4deg);pointer-events:auto;z-index:4}.hero-mascot .mascot-bubble{bottom:60%;right:85%;transform:rotate(-4deg)}.hero-copy>p{font-size:12px;max-width:220px}.hero-mascot::after{right:1px;bottom:0}
@media(max-width:1100px) and (min-width:701px){.hero-copy h1{font-size:clamp(36px,4.8vw,50px)}.hero-mascot{flex-basis:100px;width:100px;height:135px}}
@media(max-width:700px){.hero-copy{position:relative;min-height:0;padding-top:1px}.hero-copy h1{font-size:clamp(30px,8vw,42px);margin-right:90px;letter-spacing:-1.8px;margin-bottom:20px}.hero-copy h1 em{margin-top:5px;white-space:nowrap;padding:2px 5px}.hero-mascot{position:absolute;right:-1px;top:0;width:90px;height:120px;margin:0}.hero-mascot .mascot-bubble{width:120px;font-size:10px;right:75%;bottom:50%}.hero-copy>p{max-width:none;font-size:11px;margin-bottom:18px}.hero-mascot::after{font-size:7px;bottom:0;right:4px}}
@media(max-width:365px){.hero-copy h1{font-size:27px;margin-right:75px}.hero-mascot{width:76px;height:105px}}
.amount-picker{border:0;padding:0;margin:24px 0 18px;min-width:0}.amount-picker legend{font-weight:700;font-size:13px;margin-bottom:12px}.amount-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.amount-options button{border:2px solid var(--black);border-radius:5px;min-height:44px;background:white;color:var(--black);font-weight:700;font-size:13px;padding:8px}.amount-options button[aria-pressed=true]{background:var(--yellow);box-shadow:2px 2px 0 var(--black)}.amount-options button:last-child{grid-column:1/-1}.custom-amount[hidden]{display:none}.custom-amount input{width:100%;background:white;color:var(--black);border:2px solid var(--black);border-radius:4px;padding:12px;font:inherit;font-size:18px;margin-top:8px}.custom-amount small{margin-top:6px;font-size:10px}.amount-picker .amount-note{font-size:11px;margin-bottom:0;color:#545449}.amount-coin{width:60px;height:40px;border-radius:50%;font-size:13px;white-space:nowrap}#payment-dialog{max-height:calc(100dvh - 32px);overflow-y:auto}
footer .admin-link{font-size:11px;border:1px solid #777763;padding:7px 12px;border-radius:4px;color:var(--yellow)}
/* An actual chest: hinged lid, dark opening, individual coins, then a coin bath. */
.treasure{width:190px;left:62%;transform:rotate(-4deg) scale(.85)}.chest{position:relative;width:190px;height:170px;filter:drop-shadow(3px 5px 0 #20201d22)}.chest-lid{position:absolute;top:49px;left:0;width:190px;height:60px;border:0;border-radius:0;background:none;outline:0;transform-origin:20% 90%;transform:translateY(0) rotate(0);transition:transform .65s ease;z-index:7}.chest-mouth{position:absolute;left:8px;top:86px;width:174px;height:30px;border:3px solid #20201d;border-radius:50%;background:#422b1c;z-index:1}.chest-front{position:absolute;left:0;top:98px;width:190px;height:76px;z-index:5}.coin-pile{position:absolute;left:15px;right:auto;bottom:70px;width:160px;height:85px;background:none;border:0;transition:none;z-index:4}.chest-coin{position:absolute;display:grid;place-items:center;width:27px;height:18px;border:2px solid #6e4d19;border-radius:50%;background:#ffd762;color:#80571e;font:bold 12px/1 Georgia,serif;box-shadow:inset 0 0 0 2px #ffed9a,1px 2px 0 #b78123;pointer-events:none}.treasure[data-phase=closed] .coin-pile,.treasure[data-phase=closed] .bather-crop{visibility:hidden}.treasure[data-phase=ajar] .chest-lid{transform:translateY(-17px) rotate(-7deg);z-index:2}.treasure[data-phase=open] .chest-lid,.treasure[data-phase=bathing] .chest-lid{transform:translateY(-49px) rotate(-14deg);z-index:2}.bather-crop{position:absolute;width:225px;height:195px;left:-17px;bottom:68px;overflow:hidden;pointer-events:none;z-index:3}.bather-rise{position:absolute;bottom:-5px;left:17px;width:190px;height:193px;transform:translateY(200px);opacity:0;transition:transform 1s cubic-bezier(.2,.8,.3,1),opacity .6s}.chest-bather{width:100%;height:100%;object-fit:contain;object-position:bottom}.treasure[data-phase=bathing] .bather-rise{transform:translateY(0);opacity:1}.treasure.bath-playing .chest-bather{animation:coin-bath-bob 1s ease-in-out 4}.bath-bubble{position:absolute;left:-15px;top:-125px;max-width:180px;padding:9px 12px;border:2px solid #20201d;border-radius:18px 18px 0 18px;background:white;color:#20201d;font:bold 12px/1.3 Arial;box-shadow:3px 3px 0 #20201d;transform:rotate(-5deg) scale(.5);opacity:0;transition:transform .4s .7s,opacity .4s .7s;z-index:9;pointer-events:none}.treasure[data-phase=bathing] .bath-bubble{transform:rotate(-5deg) scale(1);opacity:1}.bath-splash{left:83px;top:65px;z-index:8;opacity:0;animation:coin-bath-splash 1.5s ease-out forwards}.chest-replay{position:absolute;inset:-35px 0 0;width:100%;height:200px;background:transparent;border:0;z-index:10;cursor:pointer;touch-action:manipulation}.chest-replay[hidden]{display:none}.chest-story-note{display:block;text-align:center;font-size:7px;letter-spacing:1px;color:#3b5045;margin-top:6px}.treasure-caption{margin-top:10px}.treasure .spark{opacity:0;transition:opacity .4s}.treasure[data-phase=bathing] .spark,.treasure.is-filling .spark{opacity:1}.treasure .s1{top:45px;left:-15px}.treasure .s2{top:0;right:-10px}
@keyframes coin-bath-bob{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(7px) rotate(-5deg)}75%{transform:translateY(3px) rotate(5deg)}}
@keyframes coin-bath-splash{0%{opacity:0;transform:translate(0,10px) rotate(0)}15%{opacity:1}55%{opacity:1;transform:translate(var(--throw-x),var(--throw-y)) rotate(220deg)}100%{opacity:0;transform:translate(var(--throw-x),35px) rotate(440deg)}}
@media(max-width:1100px) and (min-width:701px){.treasure{left:57%;bottom:70px}}
@media(max-width:700px){.treasure{left:auto;right:8px;top:257px;bottom:auto;transform:rotate(-4deg) scale(.65);transform-origin:top right}.treasure-caption{display:none}.chest-story-note{font-size:8px;margin-top:4px}.bath-bubble{left:-8px;top:-120px;font-size:13px;width:170px}.bather-crop{height:185px}.bather-rise{height:183px}}
@media(prefers-reduced-motion:reduce){.treasure .chest-lid,.treasure .bather-rise,.treasure .bath-bubble{transition:none}.treasure .chest-bather,.treasure .bath-splash{animation:none}.treasure.user-motion .chest-lid{transition:transform .65s ease!important}.treasure.user-motion .bather-rise{transition:transform 1s ease,opacity .6s!important}.treasure.user-motion .bath-bubble{transition:transform .4s .7s,opacity .4s .7s!important}.treasure.user-motion.bath-playing .chest-bather{animation:coin-bath-bob 1s ease-in-out 4}.treasure.user-motion .bath-splash{animation:coin-bath-splash 1.5s ease-out forwards}}
.chest-spill{position:absolute;top:159px;left:-8px;width:215px;height:40px;z-index:6;pointer-events:none;opacity:0;transform:translateY(-20px);transition:opacity .5s .8s,transform .7s .8s}.treasure[data-phase=bathing] .chest-spill{opacity:1;transform:translateY(0)}
.treasure-caption{position:relative;z-index:6}.treasure[data-phase=bathing] .treasure-caption{margin-top:20px}
@media(prefers-reduced-motion:reduce){.chest-spill{transition:none}.treasure.user-motion .chest-spill{transition:opacity .5s .8s,transform .7s .8s!important}}
/* Keep the cap badge clear of the finale speech bubble. */
.bath-bubble{top:-155px;left:-22px}
@media(max-width:700px){.bath-bubble{top:-150px;left:-15px}}
.show-controls #live-mode{font-size:9px;background:white;box-shadow:none;padding:7px 10px;max-width:250px;line-height:1.4}.show-controls #live-mode.offline{color:#72633b}.live-presenter{position:absolute;left:14px;top:170px;width:125px;z-index:7;pointer-events:none}.live-presenter[hidden],.live-country-ring[hidden],.live-map-arrow[hidden]{display:none}.live-presenter img{display:block;width:125px;height:155px;object-fit:contain;transform:rotate(-5deg)}.live-speech{position:absolute;left:0;bottom:145px;width:210px;padding:13px;background:white;color:#20201d;border:3px solid #20201d;border-radius:15px 15px 15px 0;box-shadow:4px 4px 0 #20201d;font-size:13px;font-weight:700;line-height:1.4;transform:rotate(-3deg)}.live-country-ring{position:absolute;width:44px;height:44px;border:4px solid #20201d;box-shadow:0 0 0 6px #ffe445aa,inset 0 0 0 4px #ffe445;border-radius:50%;transform:translate(-50%,-50%);z-index:3;pointer-events:none}.live-map-arrow{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}.live-presenter~.treasure{z-index:4}@media(max-width:700px){.show-controls{top:365px;gap:4px;max-width:205px}.show-controls #live-mode{font-size:8px;padding:6px 8px;max-width:190px}.show-controls>span{display:none}.stage{padding-top:440px}.live-presenter{left:8px;top:95px;width:75px}.live-presenter img{width:75px;height:100px}.live-speech{bottom:95px;width:175px;padding:9px;font-size:10px;border-width:2px;box-shadow:2px 2px 0 #20201d}.live-country-ring{width:32px;height:32px;border-width:3px}}
.stage.live-announcing .planet-note{visibility:hidden}
/* A little hands-up dance when a coin actually reaches the chest. */
.hero-dance-frame{position:absolute;left:-14%;top:-24%;width:128%;height:128%;pointer-events:none;opacity:0;visibility:hidden;transform-origin:50% 85%}.hero-dance-image{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.hero-party-bubble{position:absolute;right:85%;top:8px;width:145px;padding:9px 12px;border:2px solid #20201d;border-radius:16px 16px 0 16px;box-shadow:3px 3px 0 #20201d;background:#ffe445;color:#20201d;font:bold 12px/1.3 Arial;transform:rotate(-6deg);opacity:0;visibility:hidden;pointer-events:none}.hero-party-confetti{position:absolute;inset:0;pointer-events:none;opacity:0;visibility:hidden}.hero-party-confetti i{position:absolute;left:50%;top:35%;color:#bd7b06;text-shadow:1px 1px #fff8dc;font:bold 22px Georgia;font-style:normal;opacity:0}.hero-party>.mascot-image{opacity:0}.hero-party .hero-dance-frame,.hero-party .hero-party-bubble,.hero-party .hero-party-confetti{opacity:1;visibility:visible}.hero-party::after{visibility:hidden}.hero-party.hero-party-motion .hero-dance-frame{animation:hero-money-dance .58s ease-in-out 6}.hero-party.hero-party-motion .hero-party-confetti i{animation:hero-money-confetti 1.3s ease-out 2;animation-delay:var(--party-delay)}
@keyframes hero-money-dance{0%,100%{transform:translate(0,0) rotate(0)}20%{transform:translate(-5px,-8px) rotate(-7deg)}50%{transform:translate(0,-2px) rotate(0)}75%{transform:translate(5px,-9px) rotate(7deg)}}
@keyframes hero-money-confetti{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.6)}20%{opacity:1}70%{opacity:1;transform:translate(var(--party-x),-60px) rotate(170deg) scale(1)}100%{opacity:0;transform:translate(var(--party-x),-20px) rotate(260deg) scale(.6)}}
@media(max-width:700px){.hero-party-bubble{right:84%;top:18px;width:115px;font-size:10px;padding:8px}.hero-party-confetti i{font-size:17px}.hero-dance-frame{left:-14%;top:-20%;width:128%;height:124%}}
/* Globe controls keep horizontal dragging separate from vertical page scrolling. */
#globe,.map-marker{touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none}.globe-rotate{position:absolute;top:13px;left:24px;z-index:6;width:44px;height:44px;display:grid;place-items:center;border:2px solid #20201d;background:#fff9e8;color:#20201d;border-radius:50%;font:bold 20px Arial;box-shadow:2px 2px 0 #20201d;touch-action:manipulation}.globe-label{left:83px;top:28px}.mobile-pay{display:none}
@media(max-width:700px){html{scroll-behavior:auto}.demo-bar{font-size:0;padding:5px 10px;line-height:1.2}.demo-bar span{display:none}.demo-bar::after{content:'DEMO · Kein echtes Geld';font-size:9px;letter-spacing:.5px}html[lang=en] .demo-bar::after{content:'DEMO · No real money'}header{padding:9px 4%;min-height:50px;align-items:center}.logo{font-size:15px;letter-spacing:-.6px}.logo-coin{left:91px;width:30px;height:30px;font-size:21px}.lang{min-width:48px;min-height:40px;padding:7px 10px}.hero{padding:0 4% 20px}.orbit-label{display:none}.hero-copy{min-height:76px;padding:0 75px 0 0}.hero-copy h1{font-size:27px;line-height:1.04;letter-spacing:-1.4px;margin:7px 0 5px;transform:rotate(-1deg)}.hero h1 em{padding:2px 6px;margin-top:4px;box-shadow:3px 3px 0 #20201d}.hero-copy>p{display:none}.hero-mascot{width:65px;height:82px;right:3px;top:-2px}.hero-mascot::after{font-size:6px;padding:2px 4px;bottom:-2px}.hero-party-bubble{font-size:9px;width:105px;right:85%}.mobile-pay{display:flex;position:sticky;top:8px;z-index:20;min-height:48px;padding:11px 15px;font-size:14px;margin:9px 0 12px;box-shadow:3px 3px 0 #20201d}.mobile-pay span{font-size:20px}.stage{--globe-h:clamp(250px,calc(100svh - 300px),330px);height:calc(var(--globe-h) + 112px);padding:0;margin:0;scroll-margin-top:72px;border-radius:12px}#globe{top:24px;height:var(--globe-h);width:100%;left:0;filter:drop-shadow(4px 6px 0 #1b3c3322)}.globe-rotate{top:7px;left:auto;right:8px;width:44px;height:44px;font-size:17px;box-shadow:1px 2px 0 #20201d}.globe-label{left:10px;top:15px;max-width:calc(100% - 70px);font-size:7px;line-height:1.4;letter-spacing:.3px}.planet-note{display:none}.treasure{top:calc(var(--globe-h) - 95px);right:7px;transform:rotate(-4deg) scale(.55)}.chest-story-note{display:none}.show-controls{top:auto;bottom:44px;left:10px;right:10px;max-width:none;flex-direction:row;align-items:center;justify-content:space-between;gap:7px}.show-controls #demo-show{min-height:42px;padding:8px 10px;font-size:10px}.show-controls #live-mode{min-height:42px;padding:6px 8px;max-width:157px;font-size:7.5px;background:#fffdf2}.live-pill{top:auto;bottom:9px;left:10px;right:10px;max-width:none;width:auto;min-height:25px;padding:5px 8px;font-size:8px;line-height:1.4;box-shadow:1px 2px 0 #20201d}.goal{margin-top:15px;padding:13px 12px;gap:10px}.goal strong{font-size:30px}.goal strong small{font-size:22px}.goal-right>span{font-size:6px}.goal-right>b{font-size:11px}.progress{margin:7px 0 4px}.goal-right>small{font-size:7px}.letter{position:relative;top:auto;right:auto;width:100%;max-width:none;margin:23px 0 10px;padding:22px;transform:rotate(-1deg);box-shadow:4px 4px 0 #20201d}.letter-mascot{right:9px;top:54px}.live-presenter{left:5px;top:105px;width:68px}.live-presenter img{width:68px;height:92px}.live-speech{left:0;bottom:88px;width:169px;font-size:10px}.live-map-arrow{z-index:3}#payment-dialog{padding:24px 22px}#payment-dialog h2{font-size:34px;margin:13px 0}#payment-dialog>p{font-size:12px;margin:8px 0}.amount-picker{margin:17px 0 12px}#payment-dialog label[for=country]{margin-top:14px}#payment-dialog select{margin-bottom:15px}#payment-dialog>small{font-size:9px;margin-top:12px}.toast{bottom:max(14px,env(safe-area-inset-bottom));font-size:11px;padding:11px 14px}}
@media(max-width:365px){.hero-copy h1{font-size:24px}.hero-copy{padding-right:67px;min-height:70px}.hero-mascot{width:59px;height:76px}.show-controls #demo-show{font-size:9px;padding:8px}.show-controls #live-mode{font-size:7px;max-width:142px}.mobile-pay{font-size:13px}.globe-label{font-size:6px}}
/* Readable copy, including secondary labels and comic speech. */
.hero-copy>p,.letter>p,.why-answer>p,.takeaway p{font-size:16px;line-height:1.55}.label,.demo-caption,.goal-right>span,.goal-right>small,.letter>small,.signature,.takeaway small,footer>small{font-size:13px;line-height:1.5;color:#414238}.mascot-bubble,.hero-party-bubble,.live-speech{font-size:15px;line-height:1.4}.map-tooltip{font-size:14px}.globe-label{font-size:11px}.show-controls button,.show-controls #live-mode,.live-pill{font-size:13px}.amount-picker legend,.amount-picker .amount-note,#payment-dialog label,#payment-dialog>small{font-size:14px;line-height:1.45}#payment-dialog select{font-size:16px;min-height:46px}#payment-dialog>p{font-size:16px}.bath-bubble{font-size:16px;width:190px;max-width:190px}.hero-mascot::after{font-size:11px}
@media(max-width:700px){.demo-bar::after{font-size:12px}.hero-copy h1{margin-right:0}.hero-mascot::after{font-size:10px}.hero-party-bubble,.hero-mascot .mascot-bubble{font-size:14px;width:158px}.globe-label{font-size:11px;max-width:calc(100% - 70px)}.stage{height:calc(var(--globe-h) + 135px)}.show-controls{bottom:62px;gap:8px}.show-controls #demo-show{font-size:13px;min-height:46px;padding:8px}.show-controls #live-mode{font-size:12px;min-height:46px;max-width:145px;padding:6px}.live-pill{font-size:12px;min-height:42px;padding:6px 8px}.goal{grid-template-columns:1fr;gap:10px}.goal-right>span,.goal-right>small,.label,.demo-caption{font-size:13px}.goal-right>b{font-size:16px}.goal strong{font-size:36px}.letter>p,.letter .signature{padding-right:68px;font-size:16px}.letter>small{font-size:13px}.letter .pay,.mobile-pay{font-size:16px}.letter-mascot{top:92px}.live-speech{font-size:14px;width:205px}.treasure .bath-bubble{transform:rotate(-5deg) scale(1.55);transform-origin:bottom right;font-size:14px;width:175px;left:-10px;top:-150px}.treasure:not([data-phase=bathing]) .bath-bubble{opacity:0}#payment-dialog>p{font-size:16px}#payment-dialog>small{font-size:14px}.toast{font-size:14px}.why p,.why details p,.why details summary,.takeaway p{font-size:16px;line-height:1.55}footer>small{color:#e9e4cb;font-size:13px}.hero .mascot-bubble{right:75%}}
/* The chest is scaled down on phones: compensate its speech text explicitly. */
@media(max-width:700px){
.treasure[data-phase=bathing] .bath-bubble{font-size:30px;line-height:1.3;width:360px;max-width:360px;padding:16px 20px;left:-170px;top:-235px;transform:rotate(-4deg) scale(1);transform-origin:bottom right;border-width:4px}
.live-speech,.hero-party-bubble,.hero-mascot .mascot-bubble,.mascot-bubble{font-size:16px;line-height:1.4}
.hero-mascot .mascot-bubble,.hero-party-bubble{width:190px}
.show-controls #demo-show,.show-controls #live-mode{font-size:14px}
.live-pill,.label,.demo-caption,.goal-right>span,.goal-right>small,.letter>small,.takeaway small,footer>small{font-size:14px;line-height:1.5}
#payment-dialog label,.amount-picker legend,.amount-picker .amount-note,#payment-dialog>small,#amount-help{font-size:16px;line-height:1.45}
.hero-mascot::after,.mascot-button::after{font-size:12px}
}
@media(max-width:700px){.stage{height:calc(var(--globe-h) + 155px)}.show-controls{bottom:82px}.live-pill{min-height:56px}}
/* Tablet: reserve the map panel for globe, chest and its controls. */
@media(min-width:701px) and (max-width:1366px){
header{padding:10px 4%;min-height:62px}nav{gap:18px}nav a{font-size:14px}.lang{min-height:44px;min-width:54px;font-size:14px}.demo-bar{padding:6px 12px;font-size:11px}
.hero{padding:0 4% 25px}.orbit-label{display:none}.hero-copy{position:relative;min-height:100px;padding:4px 105px 4px 0;gap:0}.hero-copy h1{font-size:clamp(30px,3.8vw,48px);line-height:1.1;letter-spacing:-1.8px;margin:9px 0 12px}.hero h1 em{margin-left:8px;padding:2px 8px}.hero-copy>p{display:none}.hero-mascot{position:absolute;right:5px;top:0;width:80px;height:100px;margin:0}.hero-mascot::after{font-size:11px}.hero-party-bubble{font-size:16px;width:200px}
.mobile-pay{display:flex;position:sticky;top:8px;z-index:20;min-height:48px;padding:10px 18px;font-size:17px;margin:5px 0 14px;box-shadow:3px 3px 0 #20201d}
.stage{--tablet-globe:clamp(380px,calc(100svh - 350px),620px);height:calc(var(--tablet-globe) + 140px);padding:0;margin:0;scroll-margin-top:72px}#globe{top:30px;left:0;width:100%;height:var(--tablet-globe)}.globe-rotate{top:12px;right:14px;left:auto}.globe-label{top:23px;left:18px;max-width:calc(100% - 95px);font-size:12px}.planet-note{display:none}
.treasure{left:auto;right:28px;top:auto;bottom:130px;transform:rotate(-4deg) scale(.8);transform-origin:bottom right}.treasure-caption,.chest-story-note{display:none}.treasure[data-phase=bathing] .bath-bubble{font-size:22px;width:255px;max-width:255px;left:-60px;top:-190px;transform:rotate(-4deg) scale(1)}
.show-controls{top:auto;bottom:78px;left:18px;right:18px;max-width:none;flex-direction:row;justify-content:space-between;align-items:center;gap:15px}.show-controls button,.show-controls #live-mode{min-height:46px;font-size:15px;max-width:none}.show-controls>span{display:none}.live-pill{bottom:15px;left:18px;right:18px;max-width:none;min-height:46px;font-size:15px;padding:10px 14px}
.letter{position:relative;inset:auto;width:100%;max-width:none;transform:none;margin:24px 0 12px;padding:25px 30px;box-shadow:5px 5px 0 #20201d}.letter h2{font-size:38px;margin:12px 0}.letter h2 br{display:none}.letter>p{font-size:17px;padding-right:140px}.letter .signature{font-size:15px;max-width:none;padding-right:140px}.letter-mascot{right:22px;top:65px;width:110px;height:145px}.letter .pay{font-size:17px}.letter>small{font-size:14px}.qr-section{display:none}.goal{margin-top:20px}.live-presenter{left:18px;top:140px}.live-speech{font-size:16px}
}
@media(min-width:701px) and (max-width:1366px) and (orientation:landscape){
header{min-height:54px;padding-top:7px;padding-bottom:7px}.hero-copy{min-height:73px;padding-right:80px}.hero-copy h1{font-size:34px;margin:8px 0}.hero-mascot{width:61px;height:76px}.hero-mascot::after{font-size:10px}.mobile-pay{margin-top:2px;margin-bottom:10px;min-height:44px;padding:8px 16px}.stage{--tablet-globe:clamp(220px,calc(100svh - 365px),430px)}.treasure{transform:rotate(-4deg) scale(.65)}.treasure[data-phase=bathing] .bath-bubble{font-size:26px;width:300px;max-width:300px;left:-105px;top:-210px}.live-presenter{top:110px;width:85px}.live-presenter img{width:85px;height:105px}.live-speech{bottom:105px}
}
/* Give the comic cast a little more presence without scaling their text. */
.hero-mascot{flex-basis:130px;width:130px;height:170px}.hero-copy{min-height:175px}
.letter-mascot{width:110px;height:150px}.letter>p{padding-right:70px}
.bather-crop{width:265px;height:230px;left:-37px}.bather-rise{left:17px;width:230px;height:230px}
.bath-bubble{top:-185px}
.live-presenter,.live-presenter img{width:145px}.live-presenter img{height:180px}.live-speech{bottom:170px}
.comic-large{max-width:260px;height:330px}
@media(max-width:700px){
.hero-copy{min-height:100px;padding-right:92px}.hero-mascot{width:80px;height:102px;right:0;top:-2px}.hero-copy h1{font-size:26px}.hero-mascot::after{font-size:11px}
.letter-mascot{width:102px;height:138px;right:5px;top:92px}.letter>p,.letter .signature{padding-right:88px}
.bather-crop{height:225px}.bather-rise{height:225px}
.treasure[data-phase=bathing] .bath-bubble{top:-265px}
.live-presenter,.live-presenter img{width:84px}.live-presenter img{height:114px}.live-speech{bottom:108px}
.comic-large{width:120px;height:165px;max-width:42%}
}
@media(max-width:365px){.hero-mascot{width:70px;height:90px}.hero-copy{min-height:90px;padding-right:80px}.hero-copy h1{font-size:23px}}
@media(min-width:701px) and (max-width:1366px){
.hero-copy{min-height:120px;padding-right:120px}.hero-mascot{width:96px;height:120px}.letter-mascot{width:130px;height:172px}.letter>p,.letter .signature{padding-right:160px}
.treasure[data-phase=bathing] .bath-bubble{top:-220px}
.live-presenter,.live-presenter img{width:145px}.live-presenter img{height:180px}.live-speech{bottom:170px}
}
@media(min-width:701px) and (max-width:1366px) and (orientation:landscape){
.hero-copy{min-height:94px;padding-right:95px}.hero-mascot{width:76px;height:94px}
.stage{--tablet-globe:clamp(220px,calc(100svh - 385px),410px)}
.treasure[data-phase=bathing] .bath-bubble{top:-240px}
.live-presenter,.live-presenter img{width:104px}.live-presenter img{height:130px}.live-speech{bottom:125px}
}