@font-face{font-family:'Lilita One';src:url('fonts/lilita-one/LilitaOne-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Nunito;src:url('fonts/nunito/Nunito.ttf') format('truetype');font-weight:200 1000;font-display:swap}
/* Shared shell overrides keep the farm palette on classroom and sample screens. */
body[data-game="budget-challenge"][data-game]{--connection-bg:#fff8eb;--connection-ink:#344e2d;--connection-border:#a7b784;--connection-dot:#48783c;--connection-font:Nunito,Arial,sans-serif;--connection-radius:12px;--connection-shadow:0 3px 0 #34462b;--player-color:#fff1c7;--player-shadow:0 3px 0 #34462b,0 0 12px #24351e;--player-font:'Lilita One',Arial,sans-serif}
body[data-page="play"][data-game="budget-challenge"] .controller-title{display:block;background:linear-gradient(100deg,#283e27df,#283e2788);border:1px solid #a7b784;border-bottom:5px solid #cbb16c;border-radius:22px}
body[data-page="play"][data-game="budget-challenge"] #game-title,body[data-game="budget-challenge"] .piggy-heading h1{color:#fff1c7;text-shadow:0 3px 0 #283720}
body[data-page="play"][data-game="budget-challenge"] .controller .controller-title .eyebrow{color:#efe6bd}
body[data-page="play"][data-game="budget-challenge"] .controller-title #game-art,body[data-page="play"][data-game="budget-challenge"] .controller-title>svg{display:none}
body[data-game="budget-challenge"] .piggy-heading{background:#283e27dd;border:1px solid #a7b784;border-radius:22px;margin-bottom:24px}
body[data-page="play"][data-game="budget-challenge"] .controller-bar>a,body[data-game="budget-challenge"] .site-header .game-sound-toggle,body[data-game="budget-challenge"] header .game-sound-toggle{background:#283e27;color:#fff8eb;border:2px solid #a7b784;box-shadow:0 3px 0 #192817;border-radius:12px}
body[data-game="budget-challenge"] .budget-game .invest-intro{background:linear-gradient(120deg,#344e2d,#526333);color:#fff8eb;border:1px solid #819756;border-bottom:5px solid #cbb16c;border-radius:16px}
body[data-game="budget-challenge"] .budget-game .invest-intro .eyebrow{color:#f7df9b}
body[data-game="budget-challenge"] .budget-game .invest-intro p{color:#fff8eb}
body[data-game="budget-challenge"] .budget-game .invest-stepper strong,body[data-game="budget-challenge"] .budget-game .invest-share{color:#344e2d}
body[data-game="budget-challenge"] .budget-game .invest-stepper button{border:1px solid #d5b67b;box-shadow:0 3px 0 #5d231c}
body[data-game="budget-challenge"] .budget-game button:disabled{background:#dedcc7;color:#676953;border-color:#b8bc97;box-shadow:none;opacity:.8;cursor:not-allowed}
body[data-game="budget-challenge"] .budget-game button:focus-visible,body[data-game="budget-challenge"] .actions button:focus-visible{outline:3px solid #344e2d;outline-offset:3px}
body[data-game="budget-challenge"] .budget-game .invest-history-row{background:#edf0df;border:1px solid #c4c69d;color:#34462b}
body[data-game="budget-challenge"] .budget-game .invest-history-row strong{color:#344e2d}
body[data-game="budget-challenge"] .budget-game [data-error]{color:#9b2924}
body[data-game="budget-challenge"] .game-instructions-reopen{background:#344e2d;color:#fff8eb;border-color:#a7b784;box-shadow:0 3px 0 #192817}
body[data-game="budget-challenge"] .game-instructions-reopen .fa-solid{color:#f7df9b}
body[data-game="budget-challenge"] .game-instructions,dialog.game-instructions-dialog[data-instructions-game="budget-challenge"] .game-instructions{background:#edf0df;border:1px solid #a7b784;color:#34462b}
body[data-game="budget-challenge"] .game-instructions h2,dialog.game-instructions-dialog[data-instructions-game="budget-challenge"] .game-instructions h2{color:#344e2d}
dialog.game-instructions-dialog[data-instructions-game="budget-challenge"]{border-top:6px solid #a3322b;box-shadow:0 18px 60px #19281777;scrollbar-color:#819756 #fff8eb}
dialog.game-instructions-dialog[data-instructions-game="budget-challenge"] .game-instructions p{color:#34462b}
body[data-game="budget-challenge"] .game-instructions-listen,dialog.game-instructions-dialog[data-instructions-game="budget-challenge"] :is(.game-instructions-listen,form button){background:#a3322b;color:#fff8eb;border:2px solid #d5b67b;box-shadow:0 3px 0 #5d231c;border-radius:12px}
dialog.game-instructions-dialog[data-instructions-game="budget-challenge"].has-game-instructions .game-instructions-close-bar .game-instructions-close{background:#edf0df;color:#344e2d;border:2px solid #819756;border-radius:12px}
/* Piggy Planner: a farm ledger with field green, barn red, wheat, and cream. */
.ready-games .game-card.budget{--card-border:#b5be89;--card-bg:#fff8eb;--card-ink:#34462b;--card-shadow:#42552c;border:2px solid #b5be89;border-radius:30px;font-family:Nunito,Arial,sans-serif}
.ready-games .budget .game-copy{background:linear-gradient(135deg,#fffaf0,#f1ecd3);color:#34462b}
.ready-games .budget .game-copy::before{height:8px;background:repeating-linear-gradient(90deg,#b5be89 0 18px,#fff8eb 18px 24px)}
.ready-games .budget h2{font:400 clamp(32px,3.5vw,40px)/1.05 'Lilita One',Arial,sans-serif;letter-spacing:0;color:#344e2d}
.ready-games .budget .game-copy small{color:#526333;font-weight:900;letter-spacing:1.3px}
.ready-games .budget .game-copy p{font:500 17px/1.55 Nunito,Arial,sans-serif}
.ready-games .budget .game-action{background:#a3322b;color:#fff8eb;border:2px solid #a3322b;border-radius:16px;box-shadow:0 4px 0 #ccae72;font:850 16px/1.35 Nunito,Arial,sans-serif}
.ready-games .budget:hover .game-action{background:#7f2521}
.ready-games .budget .game-art{background:#a9c5bd url('piggy-planner-farm.png') center 55%/cover no-repeat;border-bottom:4px solid #a3322b}
.ready-games .budget .piggy-art{position:relative;isolation:isolate;min-height:180px;padding:24px;overflow:hidden}
.ready-games .piggy-art .piggy-hero{position:absolute;left:14px;bottom:14px;font-size:48px;margin:0;filter:drop-shadow(0 5px 0 #42552c26);transform:rotate(-8deg)}
.ready-games .piggy-art .piggy-card-mascot{position:absolute;top:6px;left:50%;height:180%;width:auto;max-width:none;transform:translateX(-50%);object-fit:contain;filter:drop-shadow(0 6px 8px #a3322b33)}
.piggy-page-mascot{display:none}
body[data-game="budget-challenge"] :is(.controller-title,.piggy-heading){position:relative;min-height:230px;padding:24px 200px 24px 20px}
body[data-game="budget-challenge"] .piggy-page-mascot{display:block;position:absolute;right:12px;bottom:0;width:175px;height:225px;object-fit:contain;object-position:center bottom;pointer-events:none}
@media(max-width:560px){
 body[data-game="budget-challenge"] :is(.controller-title,.piggy-heading){padding:18px 120px 18px 14px;min-height:190px}
 body[data-game="budget-challenge"] .piggy-page-mascot{right:4px;width:110px;height:185px}
 .ready-games .piggy-art .piggy-stamp{font-size:9px;padding:7px;right:8px;bottom:12px}
}
.piggy-art .piggy-coins{position:absolute;left:22%;top:16%;font-size:36px;color:#ffe09a;transform:rotate(-12deg);text-shadow:0 3px 0 #aa703a}
.ready-games .piggy-art .piggy-stamp{position:absolute;right:12px;bottom:20px;margin:0;padding:10px 12px;background:#fff8eb;color:#a3322b;border:2px dashed #89995e;border-radius:50%;font:900 10px/1.4 Nunito,Arial,sans-serif;letter-spacing:.6px;text-align:center;transform:rotate(10deg);filter:none}
body[data-game="budget-challenge"],body[data-page="play"][data-game="budget-challenge"]{background-color:#35452c;background-image:linear-gradient(#19241688,#19241666),url('piggy-planner-farm.png');background-position:center;background-size:cover;background-repeat:no-repeat;background-attachment:fixed;color:#fff8eb;font-family:Nunito,Arial,sans-serif;min-height:100vh}
body[data-game="budget-challenge"] :is(h1,#game-title){font:400 clamp(36px,6vw,60px)/1.08 'Lilita One',Arial,sans-serif;letter-spacing:0;color:#fff1c7}
body[data-game="budget-challenge"] :is(main>p,.controller-title .eyebrow){color:#f4eccc}
body[data-game="budget-challenge"] .controller-title{background:transparent;border-color:#a7b784}
body[data-game="budget-challenge"] .budget-game{background:#fff8eb;color:#34462b;border:2px solid #b5be89;border-top:7px solid #b5be89;border-radius:24px;box-shadow:0 7px 0 #283720}
body[data-game="budget-challenge"] .budget-game .eyebrow{color:#526333}
body[data-game="budget-challenge"] .budget-game :is(h2,h3){font-family:'Lilita One',Arial,sans-serif;font-weight:400;letter-spacing:0;color:#a3322b}
body[data-game="budget-challenge"] .budget-game .invest-hud{padding:18px;background:#e5ead2;border:1px solid #afbd83;border-radius:18px;margin:18px 0}
body[data-game="budget-challenge"] .budget-game .invest-hud strong{font-family:'Lilita One',Arial,sans-serif;font-weight:400;color:#a3322b}
body[data-game="budget-challenge"] .budget-game .invest-token-count{background:#ffedb9;color:#624323;border:1px solid #e5c887;border-radius:12px}
body[data-game="budget-challenge"] .budget-game .invest-asset{border:2px solid #c4c69d;background:#fffdf6;box-shadow:0 4px 0 #e4d8b6}
body[data-game="budget-challenge"] .budget-game .invest-asset:nth-child(1){border-top:6px solid #839957}
body[data-game="budget-challenge"] .budget-game .invest-asset:nth-child(2){border-top:6px solid #d8b369}
body[data-game="budget-challenge"] .budget-game .invest-asset:nth-child(3){border-top:6px solid #4c743e;background:#edf1df}
body[data-game="budget-challenge"] .budget-game .invest-stepper button{background:#a3322b;color:#fff8eb;border-radius:12px;font-family:Nunito,Arial,sans-serif}
body[data-game="budget-challenge"] .budget-game .invest-stepper button:enabled:hover{background:#7f2521}
body[data-game="budget-challenge"] .budget-game [data-lock],body[data-game="budget-challenge"] .actions button{background:#a3322b;color:#fff8eb;border:2px solid #d5b67b;border-radius:14px;font-family:Nunito,Arial,sans-serif;font-weight:850;box-shadow:0 4px 0 #5d231c}
body[data-game="budget-challenge"] .budget-game button.button.primary[data-lock]{background:#a3322b;color:#fff8eb;border:2px solid #d5b67b;border-radius:14px;min-height:50px;box-shadow:0 4px 0 #5d231c;font:850 16px/1.4 Nunito,Arial,sans-serif}
body[data-game="budget-challenge"] .budget-game button.button.primary[data-lock]:hover:not(:disabled){background:#7f2521;color:#fff8eb;border-color:#e5c98f}
body[data-game="budget-challenge"] .budget-game button.button.primary[data-lock]:disabled{background:#dedcc7;color:#676953;border-color:#b8bc97;box-shadow:none;opacity:1}
body[data-game="budget-challenge"] .budget-game button.button.primary[data-lock]:focus-visible{outline:3px solid #344e2d;outline-offset:4px}
body[data-game="budget-challenge"] .budget-game .invest-event{background:#fff0cc;border:2px solid #dcb56f;color:#624323}
body[data-game="budget-challenge"] .budget-game .invest-history-row{border-color:#c9caa4}
body[data-game="budget-challenge"] .game-instructions-reopen{background:#a3322b;color:#fff8eb;border-color:#b5be89;box-shadow:0 4px 0 #283720;font-family:Nunito,Arial,sans-serif}
.game-instructions-dialog[data-instructions-game="budget-challenge"]{background:#fff8eb;color:#34462b;border:3px solid #b5be89;border-radius:24px}
.game-instructions-dialog[data-instructions-game="budget-challenge"]>h2{font:400 32px/1.15 'Lilita One',Arial,sans-serif;color:#a3322b}
.piggy-welcome-scene{position:relative;width:min(100%,320px);aspect-ratio:8/7;margin:0 auto 20px;isolation:isolate}
.piggy-welcome-scene .piggy-welcome-farm{position:absolute;left:0;top:2%;width:84%;height:96%;object-fit:contain;filter:drop-shadow(0 6px 6px #34462b22)}
.game-instructions-dialog[data-instructions-game="budget-challenge"] .piggy-welcome-scene .game-instructions-mascot{position:absolute;right:-1%;bottom:0;width:69%;height:91%;max-height:none;object-fit:contain;object-position:center bottom;margin:0;filter:drop-shadow(-5px 4px 4px #35253744)}
body[data-game="budget-challenge"] .game-instructions p,.game-instructions-dialog[data-instructions-game="budget-challenge"] .game-instructions p{font-family:Nunito,Arial,sans-serif}
.cards a[href="budget/index.html"]{background:#fff8eb;color:#34462b;border:2px solid #b5be89;font-family:Nunito,Arial,sans-serif}
.cards a[href="budget/index.html"] h2{font-family:'Lilita One',Arial,sans-serif;font-weight:400;color:#a3322b}
@media(max-width:400px){body[data-game="budget-challenge"] .budget-game .invest-hud{padding:12px;gap:8px}body[data-game="budget-challenge"] .budget-game .invest-hud>[data-points]{font-size:22px}.ready-games .piggy-art .piggy-hero{font-size:40px}}

/* Budget envelopes: compact allocation rows with a visible place for every $100. */
body[data-game="budget-challenge"] .budget-game .invest-assets{display:grid;grid-template-columns:1fr;gap:16px}
body[data-game="budget-challenge"] .budget-game .invest-asset.budget-envelope{--envelope-accent:#a3322b;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 24px;position:relative;text-align:left;padding:20px 24px;border:1px solid #c7be9a;border-left:6px solid var(--envelope-accent);border-radius:5px 18px 18px 5px;background:linear-gradient(135deg,#fffdf5,#f4edda);box-shadow:0 4px 0 #e1d8b9;overflow:hidden}
body[data-game="budget-challenge"] .budget-game .budget-envelope:nth-child(2){--envelope-accent:#927027}
body[data-game="budget-challenge"] .budget-game .budget-envelope:nth-child(3){--envelope-accent:#4c743e;background:linear-gradient(135deg,#f9fbed,#e8edd6)}
body[data-game="budget-challenge"] .budget-game .budget-envelope-heading{display:flex;align-items:center;gap:13px;min-width:0}
body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;font-size:26px;background:#fff8eb;border:1px dashed #c7be9a;border-radius:50%;grid-area:auto}
body[data-game="budget-challenge"] .budget-game .budget-envelope-tag{display:block;font:800 10px/1.4 Nunito,Arial,sans-serif;letter-spacing:1.4px;color:#657047}
body[data-game="budget-challenge"] .budget-game .budget-envelope h3{margin:2px 0 0;font:400 27px/1.1 'Lilita One',Arial,sans-serif;color:var(--envelope-accent)}
body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-share{grid-area:1/2;align-self:center;min-height:0;margin:0;font:400 32px/1.1 'Lilita One',Arial,sans-serif;color:#344e2d;font-variant-numeric:tabular-nums}
body[data-game="budget-challenge"] .budget-game .budget-envelope .budget-envelope-note{grid-column:1/-1;min-height:0;margin:0;font:500 14px/1.45 Nunito,Arial,sans-serif;color:#526044}
body[data-game="budget-challenge"] .budget-game .budget-token-slots{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;align-self:center;min-width:0;border-top:1px dashed #c7be9a;padding-top:14px}
body[data-game="budget-challenge"] .budget-game .budget-token-slots span{height:25px;border:1px dashed #b9b798;border-radius:3px;background:#fffdf580}
body[data-game="budget-challenge"] .budget-game .budget-token-slots span.filled{border:1px solid var(--envelope-accent);background:var(--envelope-accent);box-shadow:inset 0 0 0 3px #ffffff35}
body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-stepper{grid-column:2;grid-row:3;display:flex;gap:8px;margin:0;align-self:end;padding-top:12px}
body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-stepper button{width:42px;min-width:42px;height:42px;min-height:42px;border:1px solid #b4be92;border-radius:50%;background:#344e2d;color:#fff8eb;box-shadow:0 2px 0 #23361e;font-size:17px;padding:0}
body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-stepper button:enabled:hover{background:#526333}
body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-stepper button:disabled{background:#e4e2d1;color:#979a80;border-color:#cecfb7;opacity:1;box-shadow:none}
body[data-game="budget-challenge"] .budget-game .budget-token-label{min-width:58px;text-align:center;font:700 11px/1.2 Nunito,Arial,sans-serif;color:#657047}
body[data-game="budget-challenge"] .budget-game .budget-token-label strong{display:block;min-width:0;font:400 23px/1.1 'Lilita One',Arial,sans-serif;color:#344e2d}
@media(max-width:560px){
 body[data-game="budget-challenge"] .budget-game .invest-asset.budget-envelope{padding:16px 14px;gap:9px 10px}
 body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-share{font-size:27px}
 body[data-game="budget-challenge"] .budget-game .budget-envelope h3{font-size:24px}
 body[data-game="budget-challenge"] .budget-game .budget-token-slots{grid-column:1/-1;grid-row:3}
 body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-stepper{grid-column:1/-1;grid-row:4;justify-content:space-between;padding-top:3px}
 body[data-game="budget-challenge"] .budget-game .budget-envelope .invest-stepper button{width:46px;height:46px}
}
