@font-face{font-family:Sora;src:url('fonts/sora/Sora.ttf') format('truetype');font-weight:100 800;font-display:swap}
@font-face{font-family:Nunito;src:url('fonts/nunito/Nunito.ttf') format('truetype');font-weight:200 1000;font-display:swap}

/* A market dashboard with three distinct investment accents. */
.investing-mascot{display:none}
.ready-games .game-card.investing{border:2px solid #68c7ce;border-radius:22px;box-shadow:0 6px 0 #04212d;font-family:Nunito,Arial,sans-serif}
.ready-games .investing .game-copy{background:linear-gradient(135deg,#123f50,#071f2d);color:#e8f9f7}
.ready-games .investing .game-copy::before{height:5px;background:linear-gradient(90deg,#8ae5bb 0 34%,#70d6f5 34% 67%,#ffd38a 67%)}
.ready-games .investing .game-copy h2{font:700 clamp(27px,3vw,33px)/1.18 Sora,Arial,sans-serif;letter-spacing:-1px}
.ready-games .investing .game-copy small{color:#9fecc9;letter-spacing:1.5px}
.ready-games .investing .game-action{background:#9fecc9;color:#082d2d;border:1px solid #c9ffe8;border-radius:10px;box-shadow:0 4px 0 #397567;font:800 16px/1.4 Nunito,Arial,sans-serif}
.ready-games .investing .game-action:hover{background:#c9ffe8}
body[data-game="investing"]{font-family:Nunito,Arial,sans-serif;color:#e8f9f7;background:#061c29}
body[data-game="investing"]:not(.chase-active){background:linear-gradient(#061c29c9,#061c29f5 700px),url('investing-background.png') center top/cover fixed no-repeat}
body[data-game="investing"] main{max-width:1000px}
body[data-game="investing"] :is(h1,h2,h3){font-family:Sora,Arial,sans-serif;letter-spacing:-.035em}
body[data-game="investing"] :is(button,input,dialog){font-family:Nunito,Arial,sans-serif}
body[data-game="investing"] :is(.controller-title,.investing-heading){position:relative;isolation:isolate;min-height:290px;margin:24px 0 30px;padding:32px 40% 32px 28px;display:flex;flex-direction:column;justify-content:center;border:1px solid #548b9d;border-top:4px solid #8ae5bb;border-radius:22px;background:linear-gradient(100deg,#082936fa,#123c50c9),url('investing-background.png') center/cover;box-shadow:0 7px 0 #03131e}
body[data-game="investing"] .controller-title > :is(.game-art,.ui-icon){display:none}
body[data-game="investing"] :is(#game-title,.investing-heading h1){font:700 clamp(30px,4.5vw,48px)/1.15 Sora,Arial,sans-serif;color:#edfff7;letter-spacing:-1.5px;margin:12px 0;overflow-wrap:normal}
body[data-game="investing"] :is(.controller-title,.investing-heading) .eyebrow{color:#9fecc9;letter-spacing:2px}
body[data-game="investing"] .investing-heading > p:last-of-type{color:#c0dce5;font-size:16px;line-height:1.65}
body[data-game="investing"] .investing-mascot{display:block;position:absolute;right:0;bottom:0;width:40%;height:110%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 6px 10px #0006);pointer-events:none}
body[data-game="investing"] :is(.site-header,header){background:#071e2a;border-bottom:1px solid #487589}
body[data-game="investing"] :is(.game-sound-toggle,.sample-nav .back,.controller-bar>a){background:#143b4b;color:#d8fff0;border-color:#518c96}
body[data-game="investing"] .investing-game{background:#092836;border:1px solid #548798;border-top:4px solid #70d6f5;border-radius:22px;box-shadow:0 7px 0 #03131e;color:#e8f9f7;padding:24px}
body[data-game="investing"] .invest-intro{background:#123e4d;border:0;border-left:4px solid #8ae5bb;border-radius:0 12px 12px 0;padding:18px;color:#deeee9}
body[data-game="investing"] .invest-intro .eyebrow{color:#9fecc9;margin-bottom:8px}
body[data-game="investing"] .invest-hud{padding:24px 0;gap:14px;flex-wrap:wrap;color:#b9d9e2}
body[data-game="investing"] .invest-hud strong{font:700 clamp(28px,6vw,42px)/1.3 Sora,Arial,sans-serif;color:#a7f1c9;letter-spacing:-1px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
body[data-game="investing"] .invest-hud [data-round]{padding:8px 12px;border:1px solid #4b8290;border-radius:8px;background:#133b4c;color:#e4f8ff;font-weight:800}
body[data-game="investing"] .invest-token-count{background:#133b4c;color:#c9f3ff;border:1px solid #437c90;border-radius:10px}
body[data-game="investing"] .invest-asset{--asset-accent:#8ae5bb;background:#103644;border:1px solid #3d6776;border-top:4px solid var(--asset-accent);border-radius:14px;color:#d5e9ee;min-width:0}
body[data-game="investing"] .invest-asset:nth-child(2){--asset-accent:#70d6f5;border-top-color:var(--asset-accent)}
body[data-game="investing"] .invest-asset:nth-child(3){--asset-accent:#ffd38a;border-top-color:var(--asset-accent)}
body[data-game="investing"] .invest-asset h3{color:#f0fff9;font-size:18px;line-height:1.3;font-weight:600}
body[data-game="investing"] .invest-asset p{font-size:15px;line-height:1.5}
body[data-game="investing"] .invest-stepper button{background:var(--asset-accent);color:#082633;border:1px solid #fff5;border-radius:8px;box-shadow:0 3px 0 #020f17;min-width:44px;min-height:44px}
body[data-game="investing"] .invest-stepper strong{color:#fff;font-family:Sora,Arial,sans-serif;font-variant-numeric:tabular-nums}
body[data-game="investing"] .invest-asset .invest-share{color:var(--asset-accent);padding-top:10px;border-top:1px solid #497180;font-size:14px}
body[data-game="investing"] :is([data-lock],#market,.actions>button,.game-instructions-reopen,.game-instructions-listen,.game-instructions-dialog form button){background:#9fecc9;color:#082d2d;border:1px solid #c9ffe8;border-radius:10px;box-shadow:0 4px 0 #397567;padding:12px 18px;font:800 16px/1.4 Nunito,Arial,sans-serif}
body[data-game="investing"] :is([data-lock],#market,.actions>button,.game-instructions-reopen,.game-instructions-listen):hover:not(:disabled){background:#c9ffe8;color:#082d2d}
body[data-game="investing"] #sample-reset{background:#173d4e;border-color:#6395a2;color:#e8f9f7;box-shadow:0 4px 0 #03131e}
body[data-game="investing"] .invest-event{background:#163b40;border:1px solid #77ae99;border-left:5px solid #ffd38a;border-radius:12px;color:#e8f9f7}
body[data-game="investing"] .invest-event h3{color:#ffe0a4;margin-bottom:10px;font-size:24px}
body[data-game="investing"] .invest-rates{color:#a7f1c9;line-height:1.7}
body[data-game="investing"] .invest-history{border-top:1px solid #427181;padding-top:22px;color:#bed9e2}
body[data-game="investing"] .invest-history h3{color:#e8f9f7;font-size:21px}
body[data-game="investing"] .invest-history-row{background:#123947;border:1px solid #386878;border-radius:10px;color:#d9edf2;padding:14px;margin:10px 0}
body[data-game="investing"] .invest-history-row strong{color:#a7f1c9;font-variant-numeric:tabular-nums}
body[data-game="investing"] .investing-game [data-status]{color:#d6ecf1}
body[data-game="investing"] .investing-game [data-error]{color:#ffb8b5}
body[data-game="investing"] :is(.game-instructions,.game-instructions-dialog){background:#0e3040;color:#e8f9f7;border:1px solid #72a5ae;border-top:4px solid #8ae5bb;border-radius:18px;box-shadow:0 7px 0 #03131e}
body[data-game="investing"] .game-instructions p,body[data-game="investing"] dialog.has-game-instructions .game-instructions p{font-family:Nunito,Arial,sans-serif;color:#d6ecf1}
body[data-game="investing"] :is(button,a,input):focus-visible{outline:3px solid #ffd38a;outline-offset:4px}
@media(max-width:600px){
  body[data-game="investing"] :is(.controller-title,.investing-heading){padding:24px 20px 0;min-height:0;text-align:left}
  body[data-game="investing"] :is(#game-title,.investing-heading h1){font-size:32px;letter-spacing:-1px}
  body[data-game="investing"] .investing-mascot{position:relative;width:100%;height:220px;margin-top:8px}
  body[data-game="investing"] .investing-game{padding:16px}
  body[data-game="investing"] .invest-hud{padding:20px 0}
  body[data-game="investing"] .invest-asset h3{font-size:17px}
}
