:root{--ink:#293557;--lav:#68509c;--cream:#fff9ef;--gold:#ffda78;--teal:#198f99}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:Trebuchet MS,Arial,sans-serif}button,select{font:700 14px Trebuchet MS,sans-serif;min-height:44px;border:2px solid #ded3ed;border-radius:13px;background:#fffdf8;color:var(--ink);padding:9px 14px;cursor:pointer;box-shadow:0 3px 0 #ded3ed}button:active{translate:0 2px;box-shadow:none}button:focus-visible,select:focus-visible{outline:3px solid #f9b93d;outline-offset:2px}button:disabled{cursor:default;opacity:.6}[hidden]{display:none!important}.primary{background:var(--lav);color:white;border-color:var(--lav);box-shadow:0 4px 0 #443267}header{display:flex;justify-content:space-between;padding:22px 5%;background:#eee5ff}.hero{max-width:1150px;margin:auto;padding:35px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.hero>img{width:100%;border-radius:24px;box-shadow:0 8px 0 #dbcce9}h1{font-size:46px;line-height:1.1;margin:15px 0}p{line-height:1.7}small{letter-spacing:2px}#menu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1200px;margin:auto;padding:24px}.gamecard{padding:0;overflow:hidden;text-align:left;background:white;box-shadow:0 5px 0 #e8def2}.preview{position:relative;height:190px;background-size:cover;background-position:center;overflow:hidden}.preview img{position:absolute;height:90%;width:45%;object-fit:contain;bottom:0;left:0}.preview .preview-prop{left:42%;width:50%;height:74%;bottom:3%}.gamecard strong{display:block;padding:16px}.gamecard small{display:block;letter-spacing:0;font-weight:normal;margin-top:6px;font-size:13px}details,footer{max-width:1150px;margin:25px auto;padding:20px}body.playing{height:100dvh;overflow:hidden}#game{height:100dvh;max-width:1450px;margin:auto;padding:8px;display:flex;flex-direction:column;gap:7px}nav,.bar,.bottom{display:flex;align-items:center;gap:8px;flex-shrink:0}nav b{flex:1}#stars{white-space:nowrap;color:#977021;font-weight:bold}.bar{justify-content:center}.bar button,.bar select{font-size:12px;min-height:40px}#scene{position:relative;flex:1;min-height:0;aspect-ratio:16/9;width:100%;max-height:calc((100vw - 16px)*.5625);align-self:center;border:4px solid #e5d9f0;border-radius:23px;overflow:hidden;background:#c8d4f4;isolation:isolate;container-type:inline-size}#world{position:absolute;inset:0;background-size:100% 100%;background-position:center}.node{position:absolute}.art{width:100%;height:100%;object-fit:contain;pointer-events:none}.actor{z-index:3;transform-origin:50% 95%;animation:breathe 3.5s ease-in-out infinite;pointer-events:none;filter:drop-shadow(0 6px 2px #33214b30)}.actor.cheer{animation:cheer .7s ease-in-out 3}.actor.talk{animation:sway .7s ease-in-out 3}.object-art{width:90%;height:85%;object-fit:contain;pointer-events:none;mix-blend-mode:multiply;clip-path:inset(4% round 8%)}.scene-piece{padding:0;border:0;background:transparent;box-shadow:none;min-height:0;touch-action:none;z-index:7;display:flex;align-items:center;justify-content:center;transition:filter .15s,scale .15s}.scene-piece.selected,.tile.selected{filter:drop-shadow(0 0 5px #ffd139);outline:3px solid #ffd139;outline-offset:2px}.scene-piece.used{opacity:0;pointer-events:none}.destination{position:absolute;z-index:6;padding:0;min-height:0;border:0;background:transparent;box-shadow:none;display:flex;align-items:center;justify-content:center}.destination.ready{outline:3px solid #ffde74;outline-offset:1px;border-radius:15px}.destination.hinted{animation:hint 1s ease-in-out infinite}.destination .object-art{width:80%;height:80%}.label{background:#fff6e5;border:3px solid #dca86a;border-radius:12px;box-shadow:0 5px 0 #ad793d66;display:flex;align-items:center;justify-content:center;z-index:5;font-weight:bold;font-size:clamp(18px,3.5cqw,45px);letter-spacing:.08em;color:#2d3457}.picture-order{background:#fff7e9;border:5px solid #238e95;border-radius:18px;box-shadow:0 5px 0 #156b7166;z-index:4;display:flex;align-items:center;justify-content:center;flex-direction:column}.picture-order:before{content:'MAKE THIS';font-size:1.25cqw;letter-spacing:.15em;color:#426266;padding-top:4px}.picture-order img{flex:1;min-height:0}.bench{background:linear-gradient(#dfad76,#b77944);border:5px solid #edc190;border-radius:17px;box-shadow:0 8px 0 #905732;z-index:5;display:flex;align-items:center;justify-content:space-evenly;padding:3% 2%}.letter-place{position:relative;width:27%;height:90%;background:#fff1d7;border:2px solid #c49364;border-radius:12px;box-shadow:inset 0 4px 5px #ae76402f;font-size:clamp(22px,5cqw,66px);font-weight:bold;display:grid;place-items:center;z-index:6;padding:0;min-height:0}.letter-place:after{content:'•';position:absolute;bottom:-14%;font-size:2cqw;color:#795e91}.letter-place.filled{background:#f5d28d}.letter-place.hinted{outline:4px solid #ffdc78}.snowball{border-radius:50%;background:radial-gradient(circle at 36% 24%,#fff 35%,#e7f3ff 65%,#a8bfdb);box-shadow:inset -5px -6px 10px #93acca55,0 6px 3px #4d638e33;aspect-ratio:1}.snowball .object-art{width:82%;height:80%}.fish{background:linear-gradient(140deg,#fff4b7,#f3a34e);border:2px solid #ce8a4b;border-radius:50% 45% 45% 50%;box-shadow:0 5px 2px #06457455;animation:swim 3s ease-in-out infinite}.fish:after{content:'';position:absolute;left:-13%;top:25%;width:24%;height:50%;background:#f7bd6b;clip-path:polygon(100% 50%,0 0,0 100%);z-index:-1}.ice{background:linear-gradient(140deg,#b8e8ffeb,#dfedffdd 45%,#8ec7e7e8);border:3px solid #fff;border-radius:45% 40% 0 0;box-shadow:inset 0 5px 14px #fff9}.ice-hole{background:radial-gradient(ellipse at center,#12356b,#246996 65%,#a9ecff 70%,#fff 80%);border-radius:50%;box-shadow:0 6px 0 #567eaa55;z-index:2}.bucket{background:linear-gradient(110deg,#9ce5dc,#218d98);border:5px solid #40b8bb;border-top:12px solid #8ee6df;border-radius:10% 10% 28% 28%;box-shadow:0 6px 0 #135c7277;z-index:5}.bucket:after{content:'';position:absolute;inset:15% -10%;border:4px solid #e0d5ae;border-radius:30%;z-index:-1}.prop{z-index:4;pointer-events:none}.cable-wire{position:absolute;left:-5%;top:13%;width:110%;height:5px;background:#53546d;rotate:-5deg;box-shadow:0 3px 0 #a3a2af}.cable-group{z-index:5;transition:transform 2.5s ease-in-out}.cable-group.departed{transform:translate(110%,-70%) scale(.6)}.passenger-queue{position:absolute;left:29%;top:76%;width:66%;height:22%;border-top:4px solid #d1c2df;background:#c8bad966;border-radius:12px}.door{height:100%;width:100%;border:3px solid #f2cc8b;background:linear-gradient(90deg,#ee8d84,#ffbfa6 45%,#e88980);border-radius:48% 48% 3px 3px;transform-origin:0 50%;transition:transform 1s ease-in-out;box-shadow:inset -5px 0 0 #bc728966;position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;color:#fff9ef;font-size:4cqw}.door:after{content:'●';position:absolute;right:8%;top:60%;font-size:2cqw;color:#f6da88}.door.teal{background:linear-gradient(90deg,#28a2aa,#7adbd2,#229aab)}.door.gold{background:linear-gradient(90deg,#e6aa3f,#ffe28c,#e3ac4a)}.door.opened{transform:perspective(650px) rotateY(-100deg)}.arch{border-radius:48% 48% 0 0;perspective:650px}.fox{font-size:6cqw;position:absolute;inset:30% 5% 5%;display:grid;place-items:center}.key{background:linear-gradient(#ffe59d,#efbf64);border:3px solid #bd873b;border-radius:45% 45% 30% 30%;box-shadow:0 5px 0 #a27e4b55}.key:after{content:'';position:absolute;width:15%;height:29%;bottom:-25%;background:#e7b557;box-shadow:7px 4px 0 #e7b557;z-index:-1}.shelf-item{filter:drop-shadow(0 5px 2px #60432644)}.order-slip{font-size:clamp(14px,2.5cqw,28px);letter-spacing:.08em;flex-direction:column;gap:7px}.basket-target .object-art{width:23%;height:60%;align-self:center}.basket-target{justify-content:center;gap:1%}.globe-window{border-radius:50%;z-index:6}.globe-window .object-art{height:63%;width:65%;align-self:end;margin-bottom:6%}.machine{background:linear-gradient(120deg,#7bd4d9,#1d9da7);border:5px solid #c8f5f4;border-radius:25px;box-shadow:0 9px 0 #126d86, inset 0 0 0 5px #5692b688;z-index:4}.machine .bench{background:#bca5db;border-color:#d8c9f4;box-shadow:0 4px 0 #785b9b}.machine .letter-place{background:#fff8dd;border-color:#c5aed8}.machine .picture-order{border-color:#edc16b}.lever{position:absolute;right:-6%;top:40%;height:42%;width:12%;background:linear-gradient(90deg,#c1c5dd,#eff4ff,#8586b7);border:3px solid #dcb264;border-radius:20px;transform-origin:50% 100%;z-index:10;min-height:0;transition:rotate .5s}.lever:before{content:'';position:absolute;width:140%;aspect-ratio:1;background:radial-gradient(circle at 30% 25%,#ffb0ab,#e56a67 70%);border-radius:50%;left:-20%;top:-10%;box-shadow:0 3px 0 #8f4449}.lever.pulled{rotate:30deg}.gear{font-size:8cqw;color:#f5d088;text-shadow:0 4px 0 #9f7779;animation:gear 8s linear infinite}.globe-shake{animation:globe-shake .8s ease-in-out}.robot-lit{filter:drop-shadow(0 0 16px #ffdc78)}.robot-face{background:#fff5d0;border:4px solid #71bdbf;border-radius:24px;font-size:3cqw;display:grid;place-items:center;z-index:7;opacity:0}.powered .robot-face{opacity:1}.tunnel{background:linear-gradient(110deg,#c2adf0,#7d68b7);border:5px solid #e9e2ff;border-radius:48% 48% 5px 5px;box-shadow:0 8px 0 #756e97;z-index:4}.tunnel:before{content:'';position:absolute;inset:25% 13% 0;background:#2d3e66;border-radius:45% 45% 0 0;box-shadow:inset 0 10px 15px #172945}.tunnel:nth-child(2){background:#60c6c0}.tunnel:nth-child(3){background:#ee9a94}.tunnel-label{position:absolute;top:6%;left:12%;width:76%;height:22%;font-size:2.8cqw;background:#fff4df;border-radius:8px;display:grid;place-items:center;font-weight:bold;z-index:6}.tunnel .destination{inset:32% 15% 2%;width:70%;height:66%}.sledge{background:linear-gradient(#e9a363,#b47143);border-bottom:6px solid #754c43;border-radius:20%;padding-bottom:8px}.wheel-stand{background:linear-gradient(90deg,#d99641,#ffe09d,#d99544);clip-path:polygon(40% 0,60% 0,100% 100%,0 100%)}.wheel{position:absolute;border:9px solid #e4b35a;border-radius:50%;background:conic-gradient(#86d8ee 0deg 72deg,#98e5bd 72deg 144deg,#c8a5f0 144deg 216deg,#ffe598 216deg 288deg,#f8abc4 288deg 360deg);box-shadow:0 0 0 4px #fff4c1,inset 0 0 0 4px #f1c96f,0 9px 12px #69537155;z-index:5;aspect-ratio:1;transform:rotate(0deg);will-change:transform}.wheel:after{content:'';position:absolute;width:13%;height:13%;left:43.5%;top:43.5%;border-radius:50%;background:radial-gradient(#ffe7a0,#e9b557);box-shadow:0 3px 0 #a77c32}.wheel-sector{position:absolute;width:25%;height:25%;display:grid;place-items:center}.wheel-sector img{height:100%;width:100%}.pointer{position:absolute;z-index:8;width:0;height:0;border-left:1.7cqw solid transparent;border-right:1.7cqw solid transparent;border-top:4.5cqw solid #e46868;filter:drop-shadow(0 3px 0 #b74a4a)}.oven-baking{animation:oven .7s ease-in-out infinite}.flying{position:fixed;z-index:100;pointer-events:none;object-fit:contain;transition:transform .7s ease-in-out,opacity .7s;width:70px;height:70px;mix-blend-mode:multiply}.ghost{position:fixed;pointer-events:none;z-index:99;display:grid;place-items:center;width:65px;height:65px;background:#fff4cecc;border-radius:15px;font-size:38px;font-weight:bold;filter:drop-shadow(0 5px 4px #35476b66)}.ghost img{width:100%;height:100%;object-fit:contain}.destination .object-art.arrive{animation:pop .5s ease-out}#instruction{text-align:center;font-size:15px;font-weight:bold;flex-shrink:0;min-height:20px}#dock{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;flex-shrink:0}#dock:empty{display:none}.tile{min-width:50px;font-size:30px;padding:4px 13px;touch-action:none;border:3px solid #d2b38d;background:linear-gradient(#fff3d5,#edcf9f);box-shadow:0 4px 0 #b59471}.biscuit-tile{border-radius:35%;border:3px dashed #b7833e;background:radial-gradient(#ffdc97,#d7a457);color:#64462d}.bottom{justify-content:center;flex-wrap:wrap}#feedback{font-size:13px;min-height:18px}#celebration{position:absolute;z-index:25;top:6%;right:3%;max-width:60%;background:#fff8e9e8;border:3px solid #f4d276;border-radius:22px;padding:1% 3%;display:flex;align-items:center;gap:15px;color:#655098;font-size:clamp(15px,3cqw,34px);pointer-events:none}#celebration span{font-size:1.6em;color:#e7ac36;animation:pop .6s}#snow{position:absolute;inset:0;z-index:12;pointer-events:none;overflow:hidden}#snow i{position:absolute;top:-10%;color:white;opacity:.8;font-style:normal;font-size:1.5cqw;animation:snow 9s linear infinite}.shake{animation:wrong .35s}.hinted{outline:3px solid #ffd863;filter:drop-shadow(0 0 7px #ffd863)}@keyframes breathe{50%{transform:scaleY(1.015) rotate(.8deg)}}@keyframes sway{50%{transform:rotate(-3deg)}}@keyframes cheer{50%{transform:translateY(-6%) rotate(-4deg)}}@keyframes swim{50%{translate:5% -7%;rotate:3deg}}@keyframes gear{to{rotate:360deg}}@keyframes snow{to{translate:25px 700px;rotate:80deg}}@keyframes pop{from{transform:scale(.4);opacity:.1}65%{transform:scale(1.12)}}@keyframes hint{50%{filter:drop-shadow(0 0 8px #ffd863)}}@keyframes wrong{25%{translate:-4px}75%{translate:4px}}@keyframes oven{50%{filter:drop-shadow(0 0 20px #ffb348)}}@keyframes globe-shake{20%,60%{rotate:5deg}40%,80%{rotate:-5deg}}@media(max-width:700px){.hero{display:block;padding:15px}.hero h1{font-size:32px}#menu{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px}.preview{height:135px}.gamecard strong{font-size:13px;padding:10px}.gamecard small{font-size:11px}header span{display:none}#game{padding:5px;gap:7px;justify-content:center}nav{gap:5px}nav b{font-size:13px}button,select{font-size:12px;padding:8px;min-height:44px}.bar{gap:5px;flex-wrap:wrap}.bar button,.bar select{font-size:11px;padding:6px;min-height:38px}#voice,#musicToggle{min-height:32px}#scene{flex:0 0 auto;height:calc((100vw - 10px)*.625);max-height:calc((100vw - 10px)*.625);border-width:2px;border-radius:16px;aspect-ratio:1.6}.scene-piece,.destination{min-width:40px;min-height:40px}.letter-place{min-width:40px;min-height:40px}.tile{font-size:27px;min-width:44px;min-height:44px;padding:3px 9px}#instruction{font-size:12px;padding:0 5px;min-height:30px}#dock{gap:5px}.bottom{gap:7px}#feedback{flex-basis:100%;text-align:center;font-size:12px;min-height:30px;padding:0 8px}.bottom button{padding:9px 15px}.picture-order:before{font-size:2cqw}.label{border-width:2px}.bench{border-width:3px}.wheel{border-width:5px}.actor{animation-duration:4s}#stars{font-size:13px}}@media(max-height:500px) and (orientation:landscape){#game{display:grid;grid-template-columns:minmax(0,1fr) 200px;grid-template-rows:40px minmax(0,1fr) 55px;gap:5px}nav{grid-column:1/-1}.bar{grid-column:2;grid-row:2;align-content:start;justify-content:center}#scene{grid-column:1;grid-row:2 / 4;width:100%;height:100%;max-height:none;aspect-ratio:auto}#dock{grid-column:2;grid-row:2;align-self:center;margin-top:90px}.bottom{grid-column:2;grid-row:3;align-self:end}.bottom #feedback{display:none}#instruction{display:none}#voice,#musicToggle{display:none}.bar button,.bar select{min-height:32px}.tile{font-size:22px;min-width:35px;min-height:38px}#undo{display:none}nav button{min-height:34px;padding:5px 9px}nav b{font-size:14px}#action{min-height:42px;font-size:12px}#scene .scene-piece,#scene .destination{min-width:35px;min-height:35px}}@media(min-width:701px) and (max-height:850px){#game{gap:4px}.bar button,.bar select{min-height:34px;padding:6px 12px}.tile{min-height:44px;font-size:27px}.bottom button{min-height:40px;padding:6px 14px}}@media(prefers-reduced-motion:reduce){.actor,.fish,.gear,#snow i{animation:none!important}.cable-group,.door{transition-duration:.1s!important}}
/* Blend the full object layer into the rendered scenery, including its white cutout margin. */
.scene-piece:has(.object-art){mix-blend-mode:multiply}.destination:has(.object-art){mix-blend-mode:multiply}.picture-order .object-art{mix-blend-mode:multiply}.scene-piece:hover{scale:1.04}
#game:not([hidden]){justify-content:center}#world.powered .robot-face{opacity:1}
.driver{overflow:hidden;z-index:3}.driver img{height:auto;width:100%;object-position:top}.scene-piece.fish .object-art{height:83%}
.wheel-sector{mix-blend-mode:multiply}.actor .blink{position:absolute;inset:0;animation:blink 6s linear infinite;opacity:0}.driver .blink{height:auto}#scene[data-game="11"] .wheel-sector .object-art{clip-path:inset(6% round 12%)}@keyframes blink{0%,44%,47%,100%{opacity:0}44.1%,46.9%{opacity:1}}@media(prefers-reduced-motion:reduce){.actor .blink{display:none}}
.mallet{z-index:10;transform-origin:50% 90%;opacity:0;background:linear-gradient(90deg,#ba7844,#f0c18b,#ba7844);width:2%!important;border-radius:5px}.mallet i{position:absolute;top:0;left:-160%;width:420%;height:30%;background:linear-gradient(#f5c98b,#bc834e);border-radius:6px;box-shadow:0 3px 0 #8b623a}.making .mallet{opacity:1;animation:hammer .4s 3}.oven-door{border:4px solid #e8b95e;border-radius:9px;background:linear-gradient(130deg,#2f354d,#636274 40%,#2e344b);transform-origin:50% 100%;transition:transform .7s}.oven-baking .oven-door{transform:perspective(300px) rotateX(65deg)}.baking .letter-place{animation:bake-letters 1.4s forwards}.baking .letter-place:nth-child(2){--bx:-80%}.baking .letter-place:nth-child(3){--bx:-200%}@keyframes hammer{50%{rotate:40deg}}@keyframes bake-letters{to{transform:translate(var(--bx,20%),-170%) scale(.3);opacity:0}}.bench>.object-art{width:85%;height:100%}
.scene-piece.fish,.scene-piece.snowball,.scene-piece.key{mix-blend-mode:normal}.fish .object-art,.snowball .object-art,.key .object-art{mix-blend-mode:multiply}.baking .bench>.biscuit-tile{animation:pop .7s;min-height:0;font-size:5cqw;padding:0 5%;height:80%;display:grid;place-items:center}
.plough-group{z-index:5}.vehicle{position:absolute;inset:0;z-index:4}.plough-group .driver{z-index:3}.plough-group .destination{z-index:6}
.machine{background:url(media/machine.webp) center/100% 100% no-repeat;border:0;box-shadow:none;border-radius:0}.machine .bench{background:transparent;border:0;box-shadow:none;padding:0}.machine .letter-place{background:transparent;border:0;box-shadow:none}.machine .letter-place:after{display:none}.machine .machine-output{background:transparent;border:0;box-shadow:none}.machine .machine-output:before{display:none}.machine .lever{right:6%;top:61%;height:22%;width:4%;border:0;background:#d86660;box-shadow:2px 0 0 #a54b52}.globe-group{filter:drop-shadow(0 6px 3px #563e6330)}.globe-window:not(button){display:flex;align-items:center;justify-content:center;pointer-events:none}.globe-window:not(button) img{height:70%;width:70%;mix-blend-mode:multiply}
/* Gameplay uses genuine transparent sprites, not printed cards. */
.object-art,.scene-piece:has(.object-art),.destination:has(.object-art),.picture-order .object-art,.wheel-sector,.fish .object-art,.snowball .object-art,.key .object-art,.globe-window:not(button) img,.flying{mix-blend-mode:normal}.object-art,#scene[data-game="11"] .wheel-sector .object-art{clip-path:none}
.cable-hanger{background:linear-gradient(90deg,#53526c,#c8c6d4,#53526c);min-width:3px;z-index:-1;box-shadow:2px 0 0 #595b6d33}.cable-group.departed{transform:translate(140%,-12%) scale(.75)}.tunnel{background-image:linear-gradient(100deg,#ffffff55,transparent 35%,#28395844);box-shadow:inset 5px 0 0 #ffffff77,inset -6px 0 0 #46527744,0 8px 0 #756e97,4px 12px 8px #394d6f44}
.plough-group .driver{z-index:5}