@font-face{font-family:"Press Start";src:url("../Fonts/pressstart2p-webfont.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}
:root{--sky:#5c94fc;--ink:#181808;--cream:#fce0a8;--gold:#f8b800;--brick:#c84c0c}
[hidden]{display:none!important}
button{cursor:pointer}
button:disabled{cursor:default}
button:focus-visible,[role=button]:focus-visible{outline:4px solid white;outline-offset:5px}
/* The intro autofocus should not put a white rectangle around Start on iPad.
   Keep a high-contrast keyboard focus indicator inside the themed button. */
#quest-start:focus{outline:none}
#quest-start,#quest-start:focus,#quest-start:focus-visible{-webkit-appearance:none;appearance:none;text-decoration:none!important}
#quest-start:focus-visible{background:#a8f038}
.quest-intro,.quest-bank,.quest-sound,.quest-message,.investment-overlay{font-family:"Press Start",monospace}
.quest-intro{position:fixed;z-index:100;top:28%;left:50%;transform:translateX(-50%);width:min(720px,92vw);text-align:center;color:white;text-shadow:3px 3px var(--ink)}
.pixel-kicker{font-size:11px;line-height:1.8;letter-spacing:1px}
.quest-intro h1{font-size:clamp(16px,2.1vw,27px);line-height:1.6;margin:20px 0}
.quest-intro p:not(.pixel-kicker){font-size:11px;line-height:2}
.quest-intro .coin-rate{margin:24px 0}
.pixel-button{display:inline-block;border:4px solid var(--ink);border-radius:0;box-shadow:inset 4px 4px #b8f878,inset -4px -4px #006800,4px 4px 0 var(--ink);background:#80d010;color:var(--ink);padding:19px 23px;font:12px/1.6 "Press Start",monospace;text-shadow:none}
.pixel-button:hover{background:#a8f038;transform:translateY(-2px)}
.pixel-button:active{transform:translate(3px,3px);box-shadow:inset 3px 3px #006800}
.pixel-button:disabled{background:#b8b8a0;box-shadow:inset 4px 4px #e0e0c0,inset -4px -4px #787868,4px 4px 0 var(--ink);color:#505040;transform:none}
.pixel-button.secondary{background:var(--cream);box-shadow:inset 4px 4px #fff,inset -4px -4px #b88040,4px 4px 0 var(--ink);font-size:10px}
.pixel-coin{display:inline-block;width:20px;height:28px;vertical-align:middle;background:url("coin.svg") center/contain no-repeat;image-rendering:pixelated}
.quest-intro .desktop-help,.quest-intro .touch-help{font-size:8px;line-height:2.2;margin-top:26px}
.touch-help{display:none}
.touch-device .touch-help{display:block}.touch-device .desktop-help{display:none}
.quest-intro .desktop-help,.quest-intro .touch-help{position:relative;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto;background:var(--sky);box-shadow:0 0 0 6px var(--sky)}
.quest-bank{position:fixed;right:24px;top:85px;z-index:60;text-align:right;font-size:14px;color:#fff;text-shadow:2px 2px #181808}
.quest-bank small{display:block;font-size:7px;margin-top:10px;line-height:1.7}
.quest-sound{position:fixed;right:22px;top:145px;z-index:1100;border:0;background:transparent;font-size:8px;color:#fff;text-shadow:2px 2px #181808;padding:12px}
.quest-message{position:fixed;z-index:800;left:0;right:0;top:35%;text-align:center;font-size:20px;text-shadow:3px 3px #181808;line-height:2}
body:not(.quest-playing) .touch-controls,.investment-open .touch-controls,.investment-open #game-brand,.investment-open .quest-bank{display:none!important}
.quest-game-over #game-brand,.quest-game-over .quest-sound,.quest-game-over .quest-bank{display:none!important}
.touch-control--run{display:none}.touch-control--down{width:56px;height:50px;font-size:20px}
#dataDisplay{font-size:clamp(10px,1.4vw,21px)!important;text-shadow:2px 2px #181808}
.investment-overlay{position:fixed;inset:0;z-index:1000;background:var(--sky);overflow:auto;color:var(--ink);isolation:isolate}
.investment-open .quest-sound{top:12px;right:8px}
.investment-logo{position:absolute;z-index:3;top:8px;left:max(14px,env(safe-area-inset-left));width:198px;height:auto;image-rendering:pixelated;pointer-events:none;user-select:none}
.jiffy-brand{display:block;flex-shrink:0;image-rendering:pixelated;pointer-events:none;user-select:none}
.survey-header .jiffy-brand{width:132px;max-height:none;height:auto}
@media(max-width:620px){.survey-header .jiffy-brand{width:118px}}
@media(max-height:520px){.survey-header .jiffy-brand{width:97px}}
.bonus-content{position:relative;z-index:2;max-width:1120px;margin:0 auto;padding:28px 30px 120px;box-sizing:border-box;text-align:center}
.bonus-content>.pixel-kicker{color:#fff;text-shadow:2px 2px var(--ink);margin:4px 0 10px}
.bonus-content>h1{font-size:clamp(20px,3vw,36px);line-height:1.6;color:#fff;text-shadow:4px 4px var(--ink);margin:12px 0}
.bonus-explainer{font-size:11px;line-height:1.8;color:#fff;text-shadow:2px 2px var(--ink);margin:0 0 15px}
.bonus-layout{display:grid;grid-template-columns:minmax(0,620px) minmax(260px,330px);gap:40px;align-items:center;text-align:left;justify-content:center}
.wheel-wrap{width:100%;max-width:620px;justify-self:center;filter:drop-shadow(6px 7px 0 #0004)}
.pixel-wheel{width:100%;display:block;overflow:visible}
.wheel-sector path{stroke:var(--ink);stroke-width:5;stroke-linejoin:round;transition:filter .12s;shape-rendering:geometricPrecision}
.wheel-sector.drop-target path{filter:brightness(1.17);stroke:#fff;stroke-width:7}
.wheel-rim{fill:none;stroke:var(--ink);stroke-width:5;pointer-events:none;shape-rendering:geometricPrecision}
.wheel-sector text{fill:#181808;font:12px "Press Start",monospace;pointer-events:none}
.wheel-sector .sector-amount{font-size:11px;font-weight:bold}
.wheel-hub{fill:var(--sky);stroke:var(--ink);stroke-width:5;shape-rendering:geometricPrecision;pointer-events:none}
.wheel-hub-icon{pointer-events:none;image-rendering:pixelated}
.placed-bag{cursor:grab;touch-action:none}.placed-bag text{font:16px "Press Start",monospace;pointer-events:none}
.coin-bank h2{font-size:12px;line-height:1.8;margin:0;color:#fff;text-shadow:2px 2px var(--ink)}
.bank-total{font-size:30px;line-height:1.5;color:#fff;text-shadow:3px 3px var(--ink);margin:10px 0}
.bank-instruction{font-size:9px;line-height:2;margin:14px 0 22px;color:#fff;text-shadow:2px 2px #304878}
.coin-bags{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.coin-bag{position:relative;display:flex;flex-direction:column;gap:9px;align-items:center;min-height:128px;padding:6px;background:transparent;color:white;border:0;border-radius:0;box-shadow:none;font:12px "Press Start",monospace;touch-action:none;text-shadow:2px 2px #181808;cursor:grab}
.coin-bag:active,.placed-bag:active{cursor:grabbing}
.investment-coin{width:50px;height:70px;image-rendering:pixelated;pointer-events:none;filter:drop-shadow(3px 4px #0005)}
.coin-bag strong{font-size:14px;white-space:nowrap}.coin-bag small{font-size:6px;line-height:1.8;text-align:center;min-height:22px}
.coin-bag:focus-visible{outline:none;transform:none}
.coin-bag:focus-visible strong{text-decoration:underline;text-underline-offset:5px}
.coin-bag.is-placed{background:transparent}.coin-bag.is-placed .investment-coin{opacity:.65}.coin-bag:hover .investment-coin{transform:translateY(-4px)}
.wheel-coin{image-rendering:pixelated;pointer-events:none}.placed-bag:focus-visible{outline:none}.placed-bag:focus-visible .wheel-coin,.placed-bag:hover .wheel-coin{filter:drop-shadow(2px 0 white) drop-shadow(-2px 0 white)}
#investment-finish{width:100%;font-size:10px;padding:16px 10px;margin-top:22px}
.bonus-scenery{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.brick-ground{position:absolute;left:0;right:0;bottom:0;height:52px;border-top:5px solid var(--ink);background-color:var(--brick);background-image:linear-gradient(335deg,transparent 90%,#fce0a8 90%),linear-gradient(155deg,transparent 90%,#fce0a8 90%),linear-gradient(90deg,#181808 3px,transparent 3px),linear-gradient(#181808 3px,transparent 3px);background-size:64px 26px}
.pixel-cloud{position:absolute;width:96px;height:72px;image-rendering:pixelated}
.cloud-one{left:2%;top:18%}.cloud-two{right:2%;top:18%}
.pixel-hill{position:absolute;bottom:52px;left:7%;width:220px;height:95px;background:#80d010;clip-path:polygon(0 100%,0 88%,8% 88%,8% 72%,16% 72%,16% 54%,24% 54%,24% 38%,32% 38%,32% 22%,40% 22%,40% 8%,48% 8%,48% 0,56% 0,56% 8%,64% 8%,64% 22%,72% 22%,72% 38%,80% 38%,80% 54%,88% 54%,88% 72%,96% 72%,96% 88%,100% 88%,100% 100%)}
.bonus-mario{position:absolute;bottom:52px;left:33%;width:48px;height:48px;image-rendering:pixelated}
.pixel-pipe{position:absolute;bottom:52px;right:11%;height:66px;width:58px;background:linear-gradient(90deg,#007800 8%,#b8f818 8%,#b8f818 20%,#00a800 20%,#00a800 70%,#007800 70%,#007800 85%,#005800 85%);border:4px solid #181808;box-sizing:border-box}
.pixel-pipe:before{content:"";position:absolute;left:-10px;top:-12px;right:-10px;height:22px;background:inherit;border:4px solid #181808}
.bag-ghost{position:fixed;z-index:2000;pointer-events:none;transform:translate(-50%,-50%);display:none;align-items:center;gap:8px;flex-direction:column;background:transparent;color:white;padding:0;border:0;box-shadow:none;text-shadow:2px 2px #181808;font:12px "Press Start",monospace}.bag-ghost.is-dragging{display:flex}.bag-ghost img{width:50px;height:70px;image-rendering:pixelated;filter:drop-shadow(3px 4px #0005)}
.result-content{max-width:820px;padding-top:65px}.result-content>p{font-size:10px;line-height:2.4;color:#fff;text-shadow:2px 2px #304878}
.priority-flag{margin:35px 0 28px;border:4px solid #181808;box-shadow:inset 4px 4px #fce0a8,6px 6px #0005;background:#c84c0c;color:#fff;padding:24px 16px}
.priority-flag span{font-size:8px;color:#fce0a8;line-height:2}.priority-flag h2{font-size:18px;line-height:1.8;margin:12px 0 0}
.investment-results{max-width:640px;margin:0 auto 28px;color:#fff;font-size:10px;text-shadow:2px 2px #304878}
.investment-results>div{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:3px dashed #d8e8ff77;line-height:1.8}.investment-results strong{white-space:nowrap}
.result-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}.result-content .save-status{font-size:8px;margin-top:25px}
@media(max-width:900px){.bonus-content{padding:30px 18px 115px}.bonus-layout{gap:20px;grid-template-columns:minmax(0,1.5fr) minmax(240px,1fr)}.bank-total{font-size:23px}.coin-bags{gap:10px}.coin-bag strong{font-size:12px}.bonus-content>.pixel-kicker{font-size:8px}.bonus-explainer{font-size:9px}.bonus-content>h1{margin:10px 0}.quest-bank{top:77px;right:16px}.quest-sound{top:127px}}
@media(max-width:620px){.quest-intro{top:27%}.quest-intro h1{font-size:15px}.quest-intro p:not(.pixel-kicker){font-size:9px}.quest-intro .desktop-help,.quest-intro .touch-help{font-size:6px}.game-brand strong{font-size:20px}.quest-bank{font-size:10px;top:150px}.quest-bank small{font-size:6px}.quest-sound{top:195px;right:12px}.bonus-content{padding:42px 12px 130px}.bonus-layout{display:flex;flex-direction:column;gap:16px}.wheel-wrap{max-width:430px}.coin-bank{width:min(390px,100%)}.coin-bank h2,.bank-total{text-align:center}.bank-total{font-size:24px;margin:5px 0}.bank-instruction{text-align:center;font-size:8px}.coin-bag{min-height:80px}.coin-bag strong{font-size:16px}.coin-bag small{font-size:7px}.bonus-explainer{font-size:8px;line-height:2}.investment-hint{text-align:center}.result-content{padding-top:60px}.result-content>p{font-size:8px}.priority-flag h2{font-size:13px}.investment-results{font-size:8px}.result-buttons{flex-direction:column;align-items:stretch}.touch-control{width:60px!important;height:58px!important}.touch-control--down{width:45px!important}.touch-control--action{width:72px!important;height:72px!important}}
@media(max-height:650px) and (min-width:621px){.quest-intro{top:24%}.quest-intro h1{margin:10px 0;font-size:18px}.quest-intro .coin-rate{margin:10px 0}.quest-intro .desktop-help,.quest-intro .touch-help{margin:12px 0;font-size:7px}.quest-intro p:not(.pixel-kicker){font-size:9px}.pixel-button{padding:13px 20px}.bonus-content{max-width:930px;padding-top:18px}.bonus-content>h1{font-size:23px;margin:4px 0}.bonus-explainer{margin-bottom:5px}.bonus-layout{grid-template-columns:minmax(0,460px) 280px;gap:30px}.bank-total{font-size:24px}.bank-instruction{font-size:8px;margin:8px 0 14px}.coin-bag{min-height:72px;padding:9px}.coin-bag strong{font-size:12px}#investment-status{margin:15px 0 8px;font-size:8px;min-height:32px}.investment-hint{margin-top:12px;font-size:6px}.bonus-scenery .brick-ground{height:30px}.bonus-mario,.pixel-pipe,.pixel-hill{bottom:30px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media(min-width:901px) and (max-height:800px){
 .bonus-content{max-width:1000px;padding-top:18px;padding-bottom:90px}
 .bonus-content>h1{font-size:28px;margin:4px 0}.bonus-explainer{margin-bottom:8px}
 .bonus-layout{grid-template-columns:minmax(0,480px) 300px;gap:36px}.wheel-wrap{max-width:480px}
 .coin-bag{min-height:108px;padding:3px}.investment-coin{width:40px;height:56px}
 .bank-total{font-size:24px;margin:6px 0}.bank-instruction{margin:8px 0 14px}
 #investment-status{margin:12px 0 8px;min-height:32px}.investment-hint{margin-top:12px}
}
.investment-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important;min-height:0!important}
@media(max-width:620px){.bonus-scenery .pixel-cloud{display:none}}
@media(max-width:760px){.investment-logo{width:150px;top:8px;left:max(12px,env(safe-area-inset-left))}.investment-overlay .bonus-content{padding-top:76px}}
/* Keep the coins and wheel together on narrow screens: no scrolling back and
   forth between the money and the investment targets. */
@media(max-width:620px),(min-width:621px) and (max-width:900px) and (orientation:portrait){
 .bonus-layout{display:flex;flex-direction:column;gap:12px}
 .coin-bank{display:contents}.coin-bank h2,.bank-total{display:none}
 .bank-instruction{order:0;font-size:8px;margin:0;text-align:center}
 .coin-bags{order:1;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;max-width:540px;gap:8px;margin:7px 0}
 .coin-bag{gap:6px;justify-items:center;min-height:96px;padding:4px}
 .coin-bag .investment-coin{width:30px;height:42px}.coin-bag.is-selected:before{top:18px;left:4px;font-size:7px}
 .coin-bag .pixel-coin{display:none}.coin-bag strong{font-size:10px}.coin-bag small{font-size:5px;text-align:center;min-height:16px;line-height:1.7;overflow-wrap:anywhere}
 .wheel-wrap{order:2;max-width:480px}
 #investment-status{order:3;min-height:0;font-size:8px;text-align:center;margin:0;width:100%}
 #investment-finish{order:4;max-width:480px;margin:4px 0}
 .investment-hint{order:5;text-align:center;margin:4px 0;font-size:6px}
}
