@import url('https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&family=Space+Mono:wght@400;700&display=swap');
:root{color-scheme:dark;--bg:#121b18;--panel:#1c2821;--gold:#edbb70;--cream:#f2e5c7;--dim:#aab49a;--pixel:'Silkscreen','Courier New',monospace;--body:'Space Mono','Courier New',monospace}*{box-sizing:border-box}body{margin:0;background:#080d0b;color:var(--cream);font-family:var(--body);font-size:16px}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:3px solid #ffe0a1;outline-offset:4px}button:disabled{cursor:wait;opacity:.6}[hidden]{display:none!important}#game{width:min(100%,480px);min-height:100svh;margin:auto;background:var(--bg);padding:env(safe-area-inset-top) 12px env(safe-area-inset-bottom);display:flex;flex-direction:column;align-items:center}header{height:65px;width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 4px;flex-shrink:0}.brand{font:bold 25px var(--pixel);color:var(--gold);letter-spacing:-1px}.brand span{font:10px var(--body);letter-spacing:1.7px;color:var(--dim);display:block;margin-top:4px}#restart{width:44px;height:44px;border:1px solid #566049;background:transparent;font-size:24px}#stage{width:min(100%,calc((100svh - 158px)*2/3));aspect-ratio:2/3;position:relative;overflow:hidden;isolation:isolate;container-type:inline-size;border:1px solid #566049;background:#152119;flex-shrink:0}#scene{width:100%;height:100%;object-fit:cover;display:block;image-rendering:pixelated}.shade{position:absolute;inset:0;box-shadow:inset 0 0 40px #0b110940;pointer-events:none}.shade:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,#10180d10 3px 4px);pointer-events:none}#intro{position:absolute;inset:0;padding:12%;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(0deg,#101c16f5,#101c1610 90%)}.eyebrow{font-size:11px;line-height:1.7;letter-spacing:1.8px;color:var(--gold)}h1{font:700 min(20vw,4rem)/1.05 var(--pixel);font-size:clamp(1rem,18cqw,5.5rem);letter-spacing:-.04em;width:100%;min-width:0;text-align:center;margin:18px auto 28px;text-shadow:4px 4px #735032}.primary{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;min-height:54px;padding:14px 18px;border:0;border-bottom:4px solid #92673b;background:var(--gold);color:#162016;font:16px var(--pixel);box-shadow:3px 3px #0005}.primary:active{transform:translateY(2px)}#chapter{position:absolute;left:12px;top:12px;background:#152016dd;padding:7px 9px;border-left:2px solid var(--gold);font-size:11px;letter-spacing:1px;pointer-events:none}footer{padding:16px 4px 12px;width:100%;max-width:420px;text-align:center;margin:auto 0}.small-label{color:var(--gold);font:11px var(--pixel);letter-spacing:1px}footer p{font-size:14px;line-height:1.5;margin:5px 0;color:var(--cream)}.hotspot{position:absolute;border:0;background:transparent;min-width:44px;min-height:44px;padding:0;display:grid;place-items:center}.marker{width:24px;height:24px;display:grid;place-items:center;border:2px solid var(--gold);background:#18221de6;box-shadow:0 0 0 4px #17231a55;color:var(--gold);font:20px monospace;animation:pulse 2s ease-in-out infinite}.hotspot:active .marker{background:var(--gold);color:var(--bg)}@keyframes pulse{50%{box-shadow:0 0 0 7px #edbb701f}}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#101b17e8;font:14px var(--pixel);z-index:8}dialog{color:var(--cream);background:var(--bg);border:2px solid var(--gold);box-shadow:5px 5px #0007;width:min(420px,calc(100vw - 28px));padding:22px;max-height:calc(100dvh - 32px);overflow:auto}dialog::backdrop{background:#06100abb;backdrop-filter:blur(2px)}.dialog-head{display:flex;justify-content:space-between;gap:12px;color:var(--gold);font:12px var(--pixel);border-bottom:1px solid #45523c;padding-bottom:13px}#message{white-space:pre-line;font-size:17px;line-height:1.65;margin:22px 0 26px;overflow-wrap:anywhere}#reward{width:130px;height:130px;object-fit:cover;image-rendering:pixelated;display:block;margin:22px auto 0;border:1px solid #59634a}#choices{display:grid;gap:12px}#choices button{background:var(--panel);border:1px solid #6b7858;border-left:4px solid var(--gold);padding:16px 14px;text-align:left;min-height:62px;font-size:17px;line-height:1.4}#choices button:active{background:#415137}#choices strong{color:var(--gold)}h2{font:22px/1.5 var(--pixel);text-align:center;font-weight:400;margin:16px 0 24px}.wheel-wrap{position:relative;width:min(270px,65vw);aspect-ratio:1;margin:24px auto}#wheel{position:absolute;inset:0;border-radius:50%;border:6px solid var(--gold);box-shadow:0 0 0 5px #43503a;background:repeating-conic-gradient(from -22.5deg,#edbb70 0deg 45deg,#38513d 45deg 90deg);transition:transform 3.7s cubic-bezier(.12,.72,.13,1)}#wheel span{position:absolute;left:calc(50% - 27px);top:calc(50% - 10px);width:54px;text-align:center;font:bold 17px var(--pixel);color:#17241c;transform:rotate(calc(var(--i)*45deg)) translateY(clamp(-88px,-22vw,-60px)) rotate(90deg)}#wheel span:nth-child(even){color:#ffedc3}.pointer{position:absolute;top:-24px;left:calc(50% - 16px);color:var(--cream);font-size:35px;z-index:2;text-shadow:2px 2px #000}.hub{position:absolute;inset:40%;display:grid;place-items:center;background:#162117;border:3px solid var(--gold);border-radius:50%;font-size:24px;color:var(--gold)}#wheel-status{text-align:center;color:var(--dim);font-size:14px;margin:20px 0}#wheel-dialog>.eyebrow{display:block;text-align:center}@media(min-width:600px){#game{border-left:1px solid #283a2c;border-right:1px solid #283a2c}}@media(max-height:550px){#stage{width:min(100%,260px)}#game{min-height:100svh}}@media(prefers-reduced-motion:reduce){.marker{animation:none}#wheel{transition-duration:.1s}}

#scene-action{margin-top:12px;font-size:13px;justify-content:center;line-height:1.5}body:has(#scene-action:not([hidden])) #stage{width:min(100%,calc((100svh - 220px)*2/3))}

#greeting{position:absolute;left:53%;top:28%;max-width:42%;padding:12px 15px;background:#fff0cf;border:3px solid #312c21;color:#252b20;font:bold 16px var(--pixel);box-shadow:3px 3px #171f18;pointer-events:none}#greeting:after{content:'';position:absolute;bottom:-14px;left:19px;width:16px;height:16px;background:#fff0cf;border-bottom:3px solid #312c21;border-right:3px solid #312c21;transform:skewY(35deg)}#departure{position:absolute;inset:0;background:#101a15;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center}#departure h2{color:var(--gold)}
#greeting{left:51%;top:35%}#greeting:after{left:65%}
#reward[src$="football.png"],#reward[src$="aquarium-broken.png"]{width:min(100%,240px);height:auto;aspect-ratio:1;object-fit:cover}

#dues-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none}#dues-person{position:absolute;width:110%;aspect-ratio:1;height:auto;left:-5%;bottom:-2%;background-image:url('assets/dues-people.png');background-size:400% 300%;background-repeat:no-repeat;image-rendering:pixelated;filter:drop-shadow(8px 6px 0 #0004)}#dues-hud{position:absolute;top:52px;left:12px;right:12px;display:flex;justify-content:space-between;gap:10px;font:14px var(--pixel);color:var(--gold)}#dues-hud span{background:#121b18ec;padding:9px;border:1px solid #667455}#dues-card{background:#1c2821;border:2px solid var(--gold);padding:12px;margin-top:8px;text-align:center}#dues-speech{white-space:pre-line;font-size:16px;line-height:1.4;margin:0 0 10px}#dues-speech:empty{display:none}#dues-button{justify-content:center;min-height:52px}#dues-gift{width:100px;height:100px;object-fit:cover;float:left;margin:0 12px 6px 0;image-rendering:pixelated}#dues-card:after{content:'';display:block;clear:both}body:has(#dues-card:not([hidden])) #stage{width:min(100%,calc((100svh - 280px)*2/3))}body:has(#dues-card:not([hidden])) footer{margin:0;padding-top:8px}#slap-hand{position:absolute;width:83%;height:auto;right:-5%;top:23%;z-index:3;image-rendering:pixelated;transform-origin:bottom right}#cash-pop{position:absolute;top:35%;left:0;width:100%;text-align:center;color:#ceff88;text-shadow:3px 3px #142215;font:bold 42px var(--pixel);z-index:4}.enter{animation:dues-enter .42s ease-out}.leave{animation:dues-leave .42s ease-in forwards}.recoil{animation:dues-recoil .4s ease-out}.slap{animation:dues-slap .58s ease-in-out}.cash-rise{animation:dues-cash 1.05s ease-out forwards}@keyframes dues-enter{from{transform:translateX(120%)}to{transform:translateX(0)}}@keyframes dues-leave{to{transform:translateX(-140%)}}@keyframes dues-recoil{20%{transform:translateX(-12%) rotate(-8deg)}100%{transform:none}}@keyframes dues-slap{0%{transform:translateX(130%) rotate(35deg)}35%{transform:translateX(-25%) rotate(-35deg)}100%{transform:translateX(140%) rotate(30deg)}}@keyframes dues-cash{0%{opacity:0;transform:translateY(30px) scale(.7)}20%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-70px)}}#reward[src$="calendar-25.png"],#reward[src$="money.png"]{width:min(100%,260px);height:auto;aspect-ratio:1;object-fit:cover}#continue{overflow-wrap:anywhere;line-height:1.4}@media(prefers-reduced-motion:reduce){.enter,.leave,.recoil,.slap,.cash-rise{animation-duration:.01s}}

#reward[src$="pandemic-news.png"]{width:100%;height:auto;aspect-ratio:1;object-fit:contain;border:0}#reward[src$="masks-gloves.png"]{width:min(100%,180px);height:auto;aspect-ratio:1;object-fit:contain}#ending{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding:6%;z-index:2}#ending-copy{background:#101c16ed;border:2px solid var(--gold);padding:18px;text-align:center;width:100%}#ending-text{font:16px/1.6 var(--body);margin:12px 0 0;overflow-wrap:anywhere}#ending.flag-ending{background:#101a15;justify-content:center;gap:8%}#spain-flag{width:100%;height:auto;box-shadow:5px 5px #0006}#ending.flag-ending #ending-text{font:clamp(16px,5cqw,23px)/1.6 var(--pixel);color:var(--gold)}#ending.room-ending{background:linear-gradient(transparent 35%,#101c1680)}#ending.room-ending #ending-copy{padding:12px}#ending.room-ending #ending-text{font-size:clamp(12px,3.9cqw,16px);line-height:1.5}@media(max-height:700px){#ending.room-ending #ending-text{font-size:12px}#ending-copy .eyebrow{font-size:10px}}