/* Approved Merge Street toy-box board direction. */
:root{--toy-wood:#bd773c;--toy-dark:#61371f;--toy-cream:#fff0ce;--toy-plum:#785776}
body{background-blend-mode:normal!important}
#app{max-width:1420px!important;padding:16px 28px 30px!important;gap:12px!important}
.gamehead h1{font-size:38px!important;line-height:.92;padding:10px 18px;color:#ffd269;text-shadow:0 3px 1px #754020,2px 0 #754020,-2px 0 #754020;background:linear-gradient(#b87a44,#80502e);border:3px solid #e8b777;border-radius:22px 13px 24px 12px;box-shadow:0 5px 12px #40211566;transform:rotate(-2deg)}
.gamehead h1 span{display:block;font-size:.8em;color:#fff2d5;letter-spacing:.02em}
.gamehead #soundBtn,.gamehead #homeTop,.gamehead #helpTop{border-radius:50%;background:linear-gradient(#be834d,#794321);border:2px solid #f0bf79;color:#fff0d0;box-shadow:inset 0 2px 2px #ffe7b74d,0 4px 7px #46251266}
#app>.panel.top{background:linear-gradient(#b67b46,#704226);border:2px solid #e5b274;border-radius:18px;color:#fff1d0;padding:8px 15px!important;box-shadow:inset 0 2px 2px #ffe5ab55,0 4px 10px #361c2e55}
.panel.top .coins{font-size:27px!important;color:#fff3d2;text-shadow:0 2px 2px #62341a}
.panel.top .rate{color:#fff0cf}.zchip{color:#fff1d0;background:#643d25!important;border-color:#d5a565!important}
#app>.playfield{position:relative;background:linear-gradient(105deg,#cb8e50,#a76332 45%,#d49b59)!important;border:3px solid #ffe0a0;border-radius:24px;padding:18px!important;box-shadow:inset 0 0 0 5px #8c502b,inset 0 10px 8px #ffdc9c77,0 12px 26px #381d2b77;gap:12px 18px}
#board{background:#382538;padding:9px;gap:6px;border-radius:16px;border:3px solid #714127;box-shadow:inset 0 4px 10px #1e122677;overflow:visible}
#board .cell{border:2px solid #a17b9c;border-radius:13px;background:radial-gradient(ellipse at 50% 72%,#997690,#785575 80%);box-shadow:inset 0 3px 3px #d7b4d133,inset 0 -4px 5px #422a4933,0 2px 2px #24162c55;aspect-ratio:1.12}
#board .cell.has{background:radial-gradient(ellipse at 50% 73%,#b28c9b,#7b587a 80%);border-color:#b68ea9}
#board .cell:not(.locked):not(.has)::after{display:none}
#board .cell img{filter:drop-shadow(0 5px 3px #38213a77);margin-bottom:5px;max-height:96%;max-width:94%}
#board .cell.locked{background:#664963 url('art/toy-barrier.svg') center 46%/73% 73% no-repeat;border:2px solid #8d6a87;box-shadow:inset 0 3px 8px #38283d55;justify-content:flex-end;color:#fff1c3;opacity:1}
#board .cell.locked>svg{visibility:hidden}
#board .cell.locked.nextlock{border:3px solid #ffd36b;background-color:#947044;box-shadow:inset 0 2px 4px #ffe7a955,0 0 0 2px #754624}
#board .cell.locked.nextlock>span{position:relative;z-index:2;background:#704526;border:2px solid #f8c464;border-radius:9px;min-width:65%;padding:2px 7px;margin-bottom:3px;font:18px var(--display);text-align:center;line-height:1.1;color:#fff1c3}
#board .cell.hint{border-color:#ffe08a;box-shadow:inset 0 0 0 2px #ffd16a,0 0 12px #ffd16a88}
#board .cell.over{transform:scale(1.05);z-index:3}
.badge{background:#674229;border-color:#efc579;color:#fff4d3}
.playfield>.hatchery{background:linear-gradient(#a66a39,#c18a50);border:2px solid #e5b273;border-radius:14px;box-shadow:inset 0 3px 6px #5f351e66;padding:12px!important}
.hatchery .eggs{background:#704224;border-radius:12px;padding:8px;box-shadow:inset 0 4px 8px #42221788;justify-content:space-around}
.hatchery .egg{border-color:#7b4b2b;filter:drop-shadow(0 3px 2px #3f261c66)}
.hatchery .nextegg{color:#fff1d1}.hatchery .bar{background:#623c28}
.playfield>.shoprow .btn{border:2px solid #f2bc73;border-radius:16px;background:linear-gradient(#e9ad67,#b97435);color:#fff5de;text-shadow:0 2px 1px #87502d;box-shadow:inset 0 2px 3px #fff1c177,0 4px 6px #633f2c55;min-height:62px}
.playfield>.shoprow .btn.sharkbtn{background:linear-gradient(#8dd7ff,#348bd2);border-color:#d0eeff;text-shadow:0 2px 1px #285d95}
.playfield>.shoprow .btn small{color:#fff2cf}#trash{background:#784e37;color:#fff0d4;border-color:#e1ad76}
#orderStrip{background:#a66b3d;border:2px solid #e1aa6b;border-radius:15px;padding:9px!important;color:#fff3d9}
#orderStrip .otitle{font:25px var(--display);color:#fff1ce;text-shadow:0 2px 2px #593421;margin:0 0 10px}
#orderStrip .otitle small{display:none}
#orderStrip .orow{gap:10px}
#orderStrip .ocard{background:linear-gradient(#fff1d3,#f1d0a2);border:2px solid #be864c;border-radius:13px;padding:9px!important;box-shadow:inset 0 2px 2px #fff9e6,0 3px 6px #61382033;gap:7px}
#orderStrip .ohead{color:#613a25;font-size:12px;overflow:visible;white-space:normal}
#orderStrip .ohead>span{width:52px;height:60px;flex:0 0 52px;font-size:34px;display:grid;place-items:center}
#orderStrip .oskip{color:#79553c;background:#edd0a7;border-radius:50%;margin-left:auto}
#orderStrip .oslot{background:#ffefd0;border:1px solid #cf9f68;border-radius:9px;min-height:90px!important}
#orderStrip .ostage{color:#674124}#orderStrip .ocount{background:#fff6de;color:#8b4223;border-color:#d2a066}
#orderStrip .oreward{color:#7a451b;border-color:#dbb27b;justify-content:center;font-size:17px}
#orderStrip .ocoin-reward small{color:#754924}#orderStrip .oegg-reward{color:#684729}
#orderStrip .oslot.hint{background:#ffe8a3;border-color:#c1842b}
#orderStrip .ocard.ready{background:#fff0c4;border-color:#e4aa36}
#orderStrip .odeliver{background:#ffc85e;color:#663b1a;border-color:#c88a35}
#orderStrip .ocard.empty{color:#68472e;opacity:1}#orderStrip .ocard.empty small{color:#79563c}
.playfield>.evolution{background:#764d37;border:1px solid #d6a575;border-radius:12px}
.playfield>.evolution .gtoggle{color:#fff0d1}.playfield>.evolution .gtoggle small{color:#f4d9b8}
.playfield .upbtn{background:linear-gradient(#a97042,#78492e);border-color:#e1ae74;color:#fff2d6;box-shadow:inset 0 2px 2px #f9d39b33}
.playfield .upbtn small{color:#fff0b8}.playfield .upbtn.bought{background:linear-gradient(#69954d,#426934);border-color:#b4d77d}
@media(min-width:901px){
 #app>.playfield{grid-template-columns:minmax(0,1fr) 246px!important;grid-template-rows:auto auto auto auto auto}
 #board{grid-column:1!important;grid-row:1!important;align-self:start}
 .playfield>.hatchery{grid-column:1!important;grid-row:2!important}
 .playfield>.shoprow{grid-column:1!important;grid-row:3!important}
 .playfield>#orderStrip{grid-column:2!important;grid-row:1/4!important;align-self:stretch;margin:0!important}
 #orderStrip .orow{display:flex;flex-direction:column}
 #orderStrip .ocard{display:grid;grid-template-columns:1fr;gap:7px}
 #orderStrip .oslots{min-height:85px}
 .playfield>.evolution{grid-column:1!important;grid-row:4!important;margin:0!important}
 .playfield>#zoneGoal{grid-column:2!important;grid-row:4!important}
 .playfield>.upgraderow{grid-column:1/-1!important;grid-row:5!important;margin:0!important}
 .playfield>#threat{grid-column:1/-1!important;grid-row:6!important}
 .hatchery .egg{width:42px;flex-basis:42px;height:52px}
}
@media(max-width:900px){#app{padding:12px!important}.playfield{display:flex!important;flex-direction:column}#board{width:100%}.playfield>#orderStrip{width:100%}.playfield .hatchery,.playfield .shoprow{width:100%}#app>.playfield{padding:12px!important;border-radius:19px}#orderStrip .ohead>span{width:32px;flex-basis:32px;height:38px;font-size:25px}#orderStrip .ohead{font-size:10px}#orderStrip .ocard{padding:5px!important}#orderStrip .otitle{font-size:21px}}
@media(max-width:720px){#board{padding:5px;gap:4px}#board .cell{border-radius:9px}#board .cell.locked.nextlock>span{font-size:13px;padding:1px 4px}.gamehead h1{font-size:29px!important}.panel.top .coins{font-size:23px!important}#app>.playfield{padding:9px!important}.hatchery .eggs{padding:6px}.hatchery .egg{flex-basis:29px;width:29px;height:39px}.hatchery .nextegg{flex-basis:49px;width:49px}#orderStrip .oskip{width:23px;height:23px;flex-basis:23px}}
@media(prefers-reduced-motion:reduce){#board .cell{transition:none}.gamehead h1{transform:none}}

#orderStrip .customer-sofia,#orderStrip .customer-nonna,#orderStrip .customer-chef{background-image:url('art/toy-customers.webp');background-size:300% 100%;background-repeat:no-repeat;font-size:0!important;height:60px;width:60px;flex-basis:60px}
#orderStrip .customer-sofia{background-position:0 50%}#orderStrip .customer-nonna{background-position:50% 50%}#orderStrip .customer-chef{background-position:100% 50%}
@media(max-width:900px){#orderStrip .customer-sofia,#orderStrip .customer-nonna,#orderStrip .customer-chef{height:38px;width:38px;flex-basis:38px}}

@media(min-width:901px){#board .cell{aspect-ratio:1.4}#orderStrip .customer-face{width:48px;height:48px;flex-basis:48px}#orderStrip .ohead{min-height:48px}#orderStrip .oslot{min-height:72px!important}#orderStrip .oportrait{height:45px}#orderStrip .oportrait img{height:44px!important}#orderStrip .ocard{gap:5px}#orderStrip .oreward{padding-top:5px}}

/* Character egg sprites replace painted shells, preserving stale/cracked overlays. */
#eggs .egg.character-egg{background:none!important;border:0!important;border-radius:0;box-shadow:none!important;filter:drop-shadow(0 3px 2px #3f261c66);display:flex;align-items:center;justify-content:center;overflow:visible;isolation:isolate}
#eggs .egg.character-egg::after{display:none!important}
#eggs .character-egg img{width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
#eggs .egg.character-egg.stale1::before{z-index:2}
.playfield>.shoprow .has-egg-art{position:relative;padding-left:64px}
.has-egg-art::before{content:"";position:absolute;left:9px;top:50%;transform:translateY(-50%);width:48px;height:50px;background:var(--egg-art) center/contain no-repeat;pointer-events:none}
#orderStrip .order-egg-art{width:22px;height:25px;object-fit:contain}
@media(max-width:480px){.playfield>.shoprow .has-egg-art{padding-left:45px}.has-egg-art::before{left:5px;width:35px;height:42px}}
#eggs .egg.character-egg{width:80px!important;height:80px!important;flex:0 1 80px!important;min-width:38px;padding:0}
#eggs.big .egg.character-egg{width:62px!important;height:72px!important;flex-basis:62px!important;min-width:30px}
@media(max-width:480px){#eggs .egg.character-egg{width:46px!important;height:60px!important;flex-basis:46px!important;min-width:28px}#eggs.big .egg.character-egg{width:30px!important;height:46px!important;flex-basis:30px!important;min-width:18px}}
/* Keep gameplay first; branding and utility controls follow the playfield. */
#app>.gamehead{grid-column:1/-1!important;grid-row:3!important;margin-top:8px;order:20}
#app>.panel.top{grid-row:1!important;order:0}
#app>.playfield{grid-row:2!important;order:1}
#app>.dev{grid-row:4!important;order:21}
@media(max-width:720px){#app>.gamehead{margin-top:12px}}

/* Reserve the occupied egg height even when every tray slot is empty. */
.playfield>.hatchery .tray{height:96px;min-height:96px}
.playfield>.hatchery #eggs{height:96px;min-height:96px;align-items:center;box-sizing:border-box}
@media(max-width:480px){.playfield>.hatchery .tray,.playfield>.hatchery #eggs{height:72px;min-height:72px}}
@media(min-width:901px){
 #app>.playfield{grid-template-columns:minmax(0,1fr) 246px!important}
 .playfield>.evolution{grid-column:1!important;grid-row:4!important;align-self:center;min-width:0;margin:0!important}
 .playfield>.upgraderow{grid-column:2!important;grid-row:4!important;align-self:center;min-width:0;margin:0!important}
 .playfield>.upgraderow .uprow{gap:4px}
 .playfield>.upgraderow .upbtn{padding:6px 2px;border-radius:9px}
 .playfield>.upgraderow .upicon{font-size:21px}
 .playfield>.upgraderow .upbtn b{font-size:9px}
 .playfield>.upgraderow .upbtn small{font-size:9px}
 .playfield>#zoneGoal{grid-column:1/-1!important;grid-row:5!important}
}
/* Wide centred bakery-sign wordmark, with utility controls kept to the right. */
#app>.gamehead{position:relative;display:flex;justify-content:center;align-items:center;min-height:106px!important;padding:12px 160px}
.gamehead h1{display:block!important;transform:none!important;text-align:center;font-family:var(--display);font-size:48px!important;line-height:1.05!important;white-space:nowrap;letter-spacing:.015em;padding:13px 34px 17px;min-width:360px;max-width:100%;border:3px solid #f2c98a;border-radius:16px 16px 24px 24px;color:#fff0c6;background:linear-gradient(180deg,#bd874c 0%,#986031 45%,#754324 100%);box-shadow:inset 0 2px 2px #ffedb799,inset 0 -3px 2px #5c301e77,0 5px 13px #42252266;text-shadow:0 2px 0 #b46c25,0 4px 0 #60311f,0 6px 5px #3b202366}
.gamehead h1 span{display:inline!important;font-size:1em!important;color:#ffd56b;letter-spacing:inherit}
.gamehead>div{position:absolute;right:0;top:50%;transform:translateY(-50%)}
@media(max-width:720px){#app>.gamehead{padding:8px 0 64px;min-height:150px!important}.gamehead h1{font-size:38px!important;min-width:0;width:min(100%,390px);padding:12px 20px 16px}.gamehead>div{top:auto;right:auto;bottom:0;left:50%;transform:translateX(-50%)}}
@media(max-width:370px){.gamehead h1{font-size:32px!important}}

.gamehead h1{background:none!important;border:0!important;box-shadow:none!important;text-shadow:none!important;padding:0!important;min-width:0!important;width:390px;line-height:0!important}
.gamehead .game-wordmark{display:block;width:100%;height:auto;max-height:210px;object-fit:contain;filter:drop-shadow(0 5px 5px #35203355)}
#app>.gamehead{min-height:220px!important}
@media(max-width:720px){.gamehead h1{width:min(100%,360px)}#app>.gamehead{min-height:240px!important;padding-bottom:60px}}

/* The current zone's two five-form character families. */
#topGoal{flex:4 1 0;flex-direction:row;align-items:center;gap:8px;margin:0 12px}
.zone-collection{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;align-items:end;width:100%;min-width:0}
.collection-form{height:57px;display:flex;align-items:flex-end;justify-content:center;min-width:0;border-bottom:2px solid #c5955d;padding:3px 1px 4px}
.collection-form:nth-child(6){border-left:1px solid #ecc69588;padding-left:5px}
.collection-form img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 2px #45291666)}
.collection-form.undiscovered img{filter:brightness(0);opacity:.55}
.collection-form.discovered{border-bottom-color:#ffe19a}
@media(max-width:720px){.panel.top{flex-wrap:wrap}#topGoal{flex:1 1 100%;order:3;margin:4px 0 0}.collection-form{height:44px}.zone-collection{gap:3px}}

/* Keep the discovery strip centred in the space between the two status blocks. */
.panel.top>div:first-child{flex:0 0 auto!important}
.panel.top #topGoal{flex:1 1 auto!important;margin:0 20px;justify-content:center}
#topGoal .zone-collection{max-width:760px;margin-inline:auto}
.panel.top .rate{flex:0 0 84px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.egg-clock-wrap{display:flex;align-items:center;justify-content:center;gap:7px;font:18px var(--display);color:#fff0c6;min-width:80px;font-variant-numeric:tabular-nums}
.egg-clock{position:relative;display:block;flex:none;width:34px;height:34px;border:2px solid #ffdfa1;border-radius:50%;background:conic-gradient(#ffd36b calc(var(--remaining,1)*1turn),#71452e 0);box-shadow:0 2px 4px #4f2d2455}
.egg-clock::before{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff0cf}
.egg-clock::after{content:"";position:absolute;left:13px;top:13px;width:4px;height:4px;border-radius:50%;background:#76432c}
.clock-hand{position:absolute;left:14px;top:5px;width:2px;height:10px;background:#76432c;border-radius:2px;transform-origin:50% 10px;transform:rotate(var(--hand-angle,0deg))}
.clock-full .egg-clock{background:#d7ad68}.clock-full .clock-hand{transform:rotate(0deg)}
#clockTime{min-width:30px;text-align:left}
@media(max-width:720px){.panel.top #topGoal{flex:1 1 100%!important;margin:4px 0 0}.panel.top .rate{margin-left:auto;flex-basis:84px!important}}
@media(prefers-reduced-motion:reduce){.clock-hand{transform:rotate(0deg)}}
/* Selling is removed from the gameplay controls. */
#trash{display:none!important}

/* Character-specific egg shop: live pricing and explicit availability. */
.playfield>.shoprow{gap:14px;align-items:stretch}
.playfield>.shoprow .egg-shop-button{--shop-top:#d79849;--shop-bottom:#955023;--shop-edge:#ffd58a;position:relative;display:flex;align-items:center;justify-content:center;gap:12px;min-height:112px;padding:10px 18px!important;isolation:isolate;border:3px solid var(--shop-edge);border-radius:25px;background:linear-gradient(170deg,var(--shop-top),var(--shop-bottom));box-shadow:inset 0 3px 2px #fff1c688,inset 0 -5px 3px #61331e66,0 5px 7px #512d2a66;color:#fff3d7;text-shadow:0 2px 1px #59351e;opacity:1;filter:none;overflow:visible;min-width:0}
.egg-shop-button::before{display:none!important}
.egg-shop-button .shop-egg-picture{width:84px;height:100px;object-fit:contain;flex:0 1 84px;pointer-events:none;filter:drop-shadow(0 4px 3px #45282c66);transform:rotate(-7deg);margin-top:-13px;margin-bottom:-4px}
.egg-shop-copy{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0}
.egg-shop-title{font:26px var(--display);line-height:1.05;font-weight:400;text-align:center}
.egg-price{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:90px;padding:4px 14px;border:2px solid #fff0a6;border-radius:999px;background:linear-gradient(#ffe997,#f6b83b);box-shadow:0 3px 4px #633c2b44;color:#573019;font:25px var(--display);text-shadow:none;line-height:1}
.shop-coin{width:19px;height:19px;border-radius:50%;border:2px solid #bc7a20;background:#ffd358;box-shadow:inset 0 0 0 2px #fff2a2;flex:none}
.egg-shop-status{font:700 11px system-ui;color:#fff4d7;text-shadow:0 1px 2px #543c2c;text-align:center;line-height:1.3}
.playfield>.shoprow [data-egg-character="sharkolo"]{--shop-top:#4fbded;--shop-bottom:#1866ab;--shop-edge:#a8e5ff}
.playfield>.shoprow [data-egg-character="bagelino"]{--shop-top:#9c8ab3;--shop-bottom:#514c78;--shop-edge:#d5bcef}
.playfield>.shoprow [data-egg-character="panettona"]{--shop-top:#4f9a68;--shop-bottom:#215843;--shop-edge:#e9cf8a}
.playfield>.shoprow [data-egg-character="pizzacopter"]{--shop-top:#db7950;--shop-bottom:#963e2c;--shop-edge:#ffd39b}
.playfield>.shoprow [data-egg-character="calzonetto"]{--shop-top:#aaa34b;--shop-bottom:#596332;--shop-edge:#f5d98b}
.playfield>.shoprow .egg-shop-button:disabled{opacity:1;filter:saturate(.55);cursor:default;box-shadow:inset 0 3px 2px #fff1c655,inset 0 -4px 3px #61331e55,0 3px 5px #512d2a44}
.egg-shop-button[data-buy-state="full"] .egg-price{background:#e4c39a;border-color:#f3ddba;color:#68472b}
.egg-shop-button[data-buy-state="poor"] .egg-shop-status{color:#fff5df}
.playfield>.shoprow .egg-shop-button:not(:disabled):active{transform:translateY(3px) scale(.98)}
@media(max-width:720px){.playfield>.shoprow{gap:8px}.playfield>.shoprow .egg-shop-button{padding:9px 7px!important;gap:4px;min-height:106px;border-radius:18px}.egg-shop-button .shop-egg-picture{width:58px;height:80px;flex-basis:58px}.egg-shop-title{font-size:21px}.egg-price{font-size:21px;min-width:68px;padding:4px 9px}.egg-shop-status{font-size:10px}}
@media(max-width:420px){.egg-shop-button .shop-egg-picture{width:42px;height:64px;flex-basis:42px}.egg-shop-title{font-size:18px}.egg-price{font-size:19px}.egg-shop-status{font-size:9px}}

.panel.top .coin-income{grid-column:2;font:700 12px system-ui;color:#fff0c3;padding:3px 0;background:none;text-align:left;white-space:nowrap;cursor:help;text-decoration:underline dotted #eac18a;text-underline-offset:3px}
.coin-income:focus-visible{outline:2px solid #fff0c3;outline-offset:3px;border-radius:3px}
.clock-caption{font:700 10px system-ui;color:#fff0c3}

/* Illustrated location selector, separate from the coin balance. */
.panel.top .zchip{display:flex;align-items:center;gap:8px;grid-column:1/-1;margin:5px 0 0!important;padding:4px 9px 4px 4px!important;min-height:56px;min-width:216px;font-size:14px!important;border:2px solid #e5b274!important;border-radius:13px;background:linear-gradient(#89562f,#603b26)!important;box-shadow:inset 0 2px 2px #ffe3a633,0 3px 4px #48261c55;text-align:left;color:#fff1d0}
.zchip .zone-location-art{display:block;width:46px;height:46px;flex:none;object-fit:cover;border-radius:10px;filter:drop-shadow(0 2px 2px #38201866)}
.zone-location-copy{display:flex;flex:1;flex-direction:column;gap:1px;min-width:0;line-height:1.1}
.zone-location-copy small{font:800 9px system-ui;letter-spacing:.12em;color:#f8cf8c}
.zone-location-copy strong{font:18px var(--display);color:#fff1d0;text-shadow:0 2px 1px #45251c;white-space:nowrap}
.zone-location-arrow{width:22px;height:22px;flex:none;padding:3px;border-radius:50%;background:#4a2b1f66;color:#ffe0a0}
.panel.top .zchip:hover{border-color:#ffe7ad!important;filter:brightness(1.08)}
.panel.top .zchip:focus-visible{outline:3px solid #fff0bd;outline-offset:3px}
.panel.top .zchip:active{transform:translateY(1px)}
@media(max-width:720px){.panel.top .zchip{min-width:195px;min-height:50px;gap:6px}.zchip .zone-location-art{width:40px;height:40px}.zone-location-copy strong{font-size:16px}}