@import url('https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&display=swap');
.music-settings{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:18px;padding:10px 0;color:#c7c9b3;font-size:12px}.music-settings label{display:flex;align-items:center;gap:12px}.music-settings input{width:120px;min-height:32px;accent-color:#d4b16f}.music-settings small{font-size:10px;letter-spacing:0}
:root{font-family:system-ui,sans-serif;color:#eee3c9;background:#10272e;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#32545a,#10272e 80%);min-height:100dvh}button,select{font:inherit}button{cursor:pointer;touch-action:manipulation;min-height:48px;border:1px solid #b99861;border-radius:5px;background:#e8d3a6;color:#302719;font-weight:700;padding:12px 16px;box-shadow:0 3px 0 #5b482e}button:hover{filter:brightness(1.08)}button:active{transform:translateY(2px);box-shadow:none}button:disabled{opacity:.45;cursor:default}button:focus-visible{outline:3px solid #68d9d1;outline-offset:3px}main{max-width:1040px;margin:auto;padding:25px 28px}header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}small{font-size:10px;letter-spacing:2px;color:#b9bdac}h1{font-family:'Gowun Batang',serif;font-size:29px;margin:5px 0}h2{font-family:'Gowun Batang',serif;font-size:23px;margin:6px 0 10px}p{font-size:14px;line-height:1.65;margin:7px 0 14px}.subtle,footer button{background:transparent;color:#cfceb7;box-shadow:none;border-color:#57685e;font-size:12px}.status{display:flex;gap:16px;align-items:center;border:1px solid #52635b;background:#182f35;padding:12px 16px;border-radius:5px 5px 0 0;font-size:13px}.status strong{margin-left:auto;color:#f3c876}.world{position:relative;overflow:hidden;border:1px solid #8b7851;border-top:0;background:#73a6a6}canvas{display:block;width:100%;max-height:540px;object-fit:contain;image-rendering:pixelated;background:#183b47}.place{position:absolute;top:15px;left:17px;font-size:9px;letter-spacing:2px;background:#172b31e8;padding:9px 13px;border-left:2px solid #d9b06b}.place b{display:block;font-size:13px;letter-spacing:1px;margin-top:4px}.story{padding:20px 0 14px}.story>span{font-size:11px;letter-spacing:2px;color:#e4b974}.story p{color:#d0d2bd}#inventory{display:flex;gap:8px;flex-wrap:wrap;font-size:12px}#inventory span{padding:6px 10px;background:#29424a;border-radius:4px;color:#e1d6bb}nav{display:flex;gap:6px;border-bottom:1px solid #5c6a5e;margin-bottom:15px}nav button{flex:1;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;color:#adbcbb;box-shadow:none;padding:10px 3px;font-size:13px}nav button.active{color:#f5daaa;border-bottom-color:#e0bc78}#panel{min-height:140px;background:#1b343b;border:1px solid #536055;padding:20px;border-radius:5px}.choices{display:flex;gap:10px;flex-wrap:wrap}.choices button{flex:1;min-width:120px}.hint{font-size:12px;color:#b9c3b9}.badge{color:#ebbb77;font-size:12px}.primary{background:#cfaa65}.meter{height:34px;background:#17262b;border:2px solid #c3a572;position:relative;margin:18px 0}.target{position:absolute;left:30%;width:40%;height:100%;background:#77985a}.needle{position:absolute;width:5px;height:40px;top:-5px;background:#fff1cc;box-shadow:0 0 8px #fff}.bake-button{width:100%;min-height:74px;font-size:20px}progress{width:100%;accent-color:#d4b16f;height:12px}#float{position:absolute;left:50%;bottom:24%;transform:translateX(-50%);pointer-events:none;font-weight:bold;color:#fff4c7;text-shadow:0 2px 2px #302419;font-size:20px;white-space:nowrap}footer{font-size:10px;color:#9aafa9;display:flex;align-items:center;gap:12px;margin-top:16px;flex-wrap:wrap}footer button{min-height:36px;padding:5px 10px}dialog{background:#1d363c;color:#eee3c9;border:1px solid #c5a86d;border-radius:8px;max-width:340px}dialog::backdrop{background:#0009}.receipt{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid #485b54;font-size:14px}.success{color:#a9d9ad}.endcard{border-left:3px solid #c5a566;padding-left:15px;margin:20px 0 0}@media(min-width:760px){main{display:grid;grid-template-columns:1.35fr 1fr;column-gap:28px}header,.status,footer{grid-column:1/-1}.world{grid-column:1;grid-row:3/6;align-self:start}.story{grid-column:2;padding-top:10px}nav{grid-column:2}#panel{grid-column:2}.world canvas{height:auto;max-height:none;object-fit:contain}.place{top:18px}.status{margin-bottom:18px;border-radius:4px}}@media(max-width:500px){main{padding:16px 14px 24px}header{margin-bottom:14px}h1{font-size:23px}small{font-size:8px;letter-spacing:1.4px}header button{padding:7px;min-height:38px;font-size:10px}.status{font-size:12px;gap:8px;padding:10px}h2{font-size:21px}.story{padding:16px 0 12px}#panel{padding:15px}.world canvas{height:auto;object-fit:contain}.place{top:10px;left:10px}.choices button{font-size:13px;padding:12px 8px}.story p{margin-bottom:10px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
/* Bakery life: characters and timing scenes */
.status{flex-wrap:wrap}.receipt{gap:16px}.receipt b{text-align:right}.choices{margin:12px 0}nav{flex-wrap:wrap}nav button{min-width:54px}select{display:block;width:100%;padding:12px;margin:8px 0 14px;background:#142d34;color:#f1e1bf;border:1px solid #9b8b6b;border-radius:5px}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.avatar-grid button{display:flex;align-items:center;flex-direction:column;gap:8px;padding:12px 4px}.avatar-grid .selected{outline:3px solid #80b7ad;outline-offset:2px}.avatar-icon{display:block;width:38px;height:58px;position:relative}.avatar-icon i{position:absolute;top:13px;left:9px;width:21px;height:19px;background:var(--skin);border-top:5px solid var(--hair)}.avatar-icon i:before{content:'';position:absolute;top:-15px;left:-3px;width:27px;height:12px;background:#f4e9cd;border-radius:5px 5px 0 0}.avatar-icon b{position:absolute;top:32px;left:4px;width:31px;height:22px;background:var(--coat);border-bottom:5px solid #44372d}.avatar-icon b:after{content:'';position:absolute;top:0;left:10px;width:12px;height:16px;background:#e9ddba}.mini-scene{height:204px;position:relative;overflow:hidden;background:linear-gradient(#314c50 65%,#a78254 65%,#705032);border:1px solid #a38c62;border-radius:9px;margin:16px 0}.mini-target{position:absolute;left:50%;top:91px;transform:translateX(-50%);width:76px;height:70px}.dough-ball{height:55px;width:76px;border-radius:48% 48% 35% 35%;background:#edd6a1;box-shadow:inset -8px -9px #c5a578,0 5px #5e483b}.dough-ball i{position:absolute;top:17px;width:5px;height:15px;background:#c6aa7a;transform:rotate(30deg)}.dough-ball i:nth-child(1){left:20px}.dough-ball i:nth-child(2){left:36px}.dough-ball i:nth-child(3){left:52px}.moving-tool{position:absolute;top:14px;width:70px;height:70px;transform:translateX(-50%);filter:drop-shadow(2px 3px 0 #263334)}.moving-tool svg{width:100%;height:100%}.mini-caption{position:absolute;bottom:10px;width:100%;text-align:center;font-size:12px;color:#fff1d1}.mini-oven{width:76px;height:69px;background:#a57151;border:7px solid #79533f;border-radius:24px 24px 3px 3px;box-shadow:0 5px #523a30}.flame{background:#332b27;color:#ffb351;font-size:43px;text-align:center;height:55px;border-radius:18px 18px 0 0}.hit .moving-tool{animation:strike .3s ease}.hit .dough-ball{animation:squish .3s ease}.hit .flame{animation:stoke .45s ease}.miss{box-shadow:inset 0 0 0 2px #bf8066}@keyframes strike{50%{top:68px;rotate:-8deg}}@keyframes squish{50%{transform:scale(1.12,.7)}}@keyframes stoke{50%{color:#fff1a4;filter:drop-shadow(0 0 14px #ffad41);transform:scale(1.15)}}#float{max-width:94%;white-space:normal;text-align:center;font-size:16px}dialog{width:min(92vw,420px);max-width:420px}dialog button{margin:4px}button .avatar-icon{pointer-events:none}
@media(prefers-reduced-motion:reduce){.hit .moving-tool,.hit .dough-ball,.hit .flame{animation:none}}
.schedule{max-height:240px;overflow:auto;margin:10px 0}.schedule table{width:100%;border-collapse:collapse;font-size:12px}.schedule th,.schedule td{padding:8px 5px;text-align:right;border-bottom:1px solid #4b625d}summary{cursor:pointer;padding:14px 0;color:#ecd3a3}.miss .moving-tool{animation:strike .3s ease}@media(prefers-reduced-motion:reduce){.miss .moving-tool{animation:none}}

/* Tools face their targets. The first frame responds immediately to pointerdown. */
.moving-tool svg{transform:rotate(180deg)}
.dough.hit .moving-tool,.dough.miss .moving-tool{animation:punch-once 280ms linear 1}
.oven.hit .moving-tool,.oven.miss .moving-tool{transform-origin:50% 10%;animation:fan-once 280ms linear 1}
@keyframes punch-once{0%,18%{top:54px}45%{top:40px}100%{top:14px}}
@keyframes fan-once{0%{rotate:-28deg}40%{rotate:28deg}100%{rotate:0deg}}
@media(prefers-reduced-motion:reduce){.dough.hit .moving-tool,.dough.miss .moving-tool,.oven.hit .moving-tool,.oven.miss .moving-tool{animation-duration:120ms}}
.supply-compare{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:15px 0}.supply-compare>div{padding:12px;border:1px solid #697d6d;border-radius:6px;background:#213f43}.supply-compare strong{font-size:13px;color:#f1d29c}.supply-compare p{font-size:12px;margin:7px 0 0}

.balances{margin-left:auto;display:flex;gap:16px;flex-wrap:wrap}.status .balances strong{margin:0;white-space:nowrap}.balances #savings{color:#a9d9ad}
.house-candle{position:absolute;pointer-events:none;image-rendering:pixelated;object-fit:contain}.house-candle{width:10%;left:13%;top:56.3%;filter:drop-shadow(0 0 6px #efad6355)}
.world img[hidden]{display:none}.flame{overflow:hidden}.flame img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
@media(max-width:500px){.balances{width:100%;justify-content:space-between;border-top:1px solid #43554f;padding-top:8px;gap:8px}.status .balances strong{font-size:13px}}

.flame img{transform:scale(5);transform-origin:49% 50%}

/* Kenney's unmodified CC0 border and layered pixel sprites. */
#panel,dialog{border:9px solid transparent;border-image:url('assets/panel-border.png') 12 stretch;background:#1b343b;background-clip:padding-box}
.asset-icon{display:inline-block;flex-shrink:0;image-rendering:pixelated;background-repeat:no-repeat;vertical-align:middle}
.hero-icon{display:inline-block;position:relative;width:48px;height:48px;flex-shrink:0}.hero-icon .asset-icon{position:absolute;left:0;top:0}
.outfit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.outfit-grid button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px}.outfit-grid small{color:#51462f;letter-spacing:0;font-size:11px}.outfit-grid .selected{outline:2px solid #99c9b0;opacity:.85}
#inventory span{display:flex;align-items:center;gap:5px}#inventory .asset-icon{padding:0;background-color:transparent}
.rain-effect{position:absolute;inset:0;overflow:hidden;pointer-events:none}.rain-effect[hidden]{display:none}.rain-effect i{position:absolute;top:-8%;width:1px;height:10px;background:#c5e0e8;opacity:.4;animation:rain-down 1s linear infinite}@keyframes rain-down{from{top:-8%}to{top:108%}}.place,#float{z-index:2}#weather{color:#b7d5d1;font-size:12px;white-space:nowrap}
@media(prefers-reduced-motion:reduce){.rain-effect{display:none}}

#inventory .bread-icon{padding:0;background-color:transparent;display:inline-block;width:38px;height:12px;background:url('assets/food.png') -167.96px -12.92px / 206.04px auto no-repeat;image-rendering:pixelated;flex-shrink:0}
#inventory .flour-icon{display:inline-grid;place-items:center;width:24px;height:28px;padding:0;border-radius:5px 5px 7px 7px;background:#c9b388;border-top:4px solid #ae8b61;color:#6e5539;font-size:10px}
#inventory .dough-icon{display:inline-block;width:30px;height:22px;padding:0;border-radius:50%;background:#e5ce99;box-shadow:inset -3px -4px #b99764}

.hero-icon.chef:after{content:"";position:absolute;left:14px;top:0;width:21px;height:8px;background:#f2e5c8;box-shadow:0 -5px 0 -1px #f2e5c8;pointer-events:none}

.ingredient-icon{object-fit:contain;image-rendering:pixelated;flex-shrink:0}.ingredient-tray{display:flex;gap:16px;flex-wrap:wrap;margin:12px 0}.ingredient-tray>span{display:flex;align-items:center;gap:4px;font-size:13px}.hero-icon.chef:before{content:"";position:absolute;z-index:1;left:16px;top:23px;width:17px;height:18px;background:#f2e5c8;border-bottom:2px solid #baaa86;pointer-events:none}

.tool-card{padding:14px;margin:12px 0;border:1px solid #a38c62;border-radius:8px;background:#263d40}.aim-guide{position:absolute;top:82px;height:85px;border:1px dashed #e7d6a780;border-radius:12px;background:#ead8ab0d}.dough.equipped .moving-tool svg path:first-child{fill:#ad784a}.oven.equipped .moving-tool svg path:first-child{fill:#d6af54}

.hero-icon.pajamas:after{content:"";position:absolute;left:13px;top:23px;width:24px;height:20px;background:repeating-linear-gradient(#a9bdcb 0 4px,#e9e1ce 4px 6px);pointer-events:none}

#day-end{padding:12px 16px;border:1px solid #a38c62;border-radius:10px;margin:12px 0;background:#263d40;display:flex;align-items:center;gap:12px;flex-wrap:wrap}#day-end[hidden]{display:none}#day-end small{flex:1;min-width:180px;color:#dfd1b4}

#inventory[hidden]{display:none}
@media(min-width:760px){#day-end{grid-column:2}}

.trade-map{display:flex;justify-content:space-between;align-items:center;padding:24px 10px;background:repeating-linear-gradient(0deg,#285768 0 12px,#326777 12px 14px);border:2px solid #bba574;border-radius:10px;font-size:12px}.trade-ship{font-size:36px}

.recipe-grid,.mix-grid,.shelf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.loaf-art{width:64px;height:56px;display:block;margin:auto;image-rendering:pixelated}.recipe-card{display:flex;flex-direction:column;align-items:center;padding:8px;gap:3px;min-width:0;background:#304a4b;color:#f5e3bd;border-color:#647b70;box-shadow:none}.recipe-card span,.recipe-card small{font-size:11px;letter-spacing:0;color:inherit}.recipe-card.chosen{border:2px solid #efc375;background:#46625b}.recipe-info{padding:10px 0}.pantry{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.material-badge{display:flex;align-items:center;gap:4px;padding:6px 8px;border:1px solid #5d766b;border-radius:7px;background:#263f43;font-size:12px}.material-badge b{color:#f5d59b}.material-badge em{font-style:normal;font-size:11px}.material-badge.missing{border:2px solid #ed9689;color:#ffd0c2;background:#593e40}.missing-text{color:#ffc0ac}.mix-card{padding:8px;background:#263f43;border-radius:8px;text-align:center;font-size:12px}.stepper{display:flex;align-items:center;justify-content:space-between;gap:4px;margin-top:6px}.stepper button{padding:4px;min-width:44px;min-height:44px}.oven-tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;background:#15282c;border:5px solid #7f6954;border-radius:8px;padding:8px;margin-top:12px}.oven-slot{border-radius:5px;background:#4b4037;min-height:40px;display:grid;place-items:center}.oven-slot .loaf-art{width:44px;height:38px}.oven-slot.empty{color:#9b8770}.shelf-grid>div{text-align:center;background:#304647;padding:8px;border-bottom:4px solid #937350;border-radius:5px}.shelf-grid b,.shelf-grid span{display:block;font-size:12px}#panel details{margin:12px 0}#panel summary{cursor:pointer;padding:10px 0;font-size:13px}#panel .choices{margin-top:10px}@media(max-width:380px){.material-badge{padding:4px;font-size:11px}.recipe-card span{font-size:10px}}
