*{box-sizing:border-box} :root{font-family:ui-rounded,'Arial Rounded MT Bold',Nunito,Arial,sans-serif;color:#102b66;font-weight:800;background:#d9f6ff}body{margin:0;overflow:hidden}button{font:inherit;cursor:pointer;touch-action:manipulation;color:inherit;border:5px solid #fff;border-radius:24px;background:#1299f4;box-shadow:0 4px 0 #c8e7ef,0 6px 12px #2674a51a;color:#fff;min-width:54px;min-height:54px;transition:transform .15s}button:hover{transform:translateY(-2px)}button:active{transform:translateY(2px)}button:focus-visible{outline:4px solid #122b65;outline-offset:3px}button:disabled{opacity:.5}#app{height:100dvh;padding:14px 20px;background:linear-gradient(155deg,#55dcff,#03aaff 52%,#0879ed)}header{display:flex;gap:12px;align-items:center;height:74px}header button{font-size:34px;width:66px;height:66px;flex-shrink:0}h1{font-size:clamp(18px,2.7vw,36px);margin:0 auto;background:white;border-radius:40px;padding:14px 26px;text-align:center;letter-spacing:.5px}#progress{background:white;border-radius:30px;padding:13px 20px;white-space:nowrap}#progress:empty{display:none}#menu{height:calc(100% - 74px);display:flex;flex-direction:column;justify-content:center;gap:18px;max-width:1200px;margin:auto}.intro{display:flex;justify-content:center;align-items:center;gap:16px}.intro img{width:100px;height:100px;object-fit:contain}.intro h2{font-size:clamp(23px,3vw,37px);margin:0 0 8px}.intro p{margin:0;font-weight:600}#difficulty{display:flex;gap:14px;justify-content:center}#difficulty button{padding:9px 22px;color:#123773;background:#e9f4ff}#difficulty button.active{background:#ffcf3c;box-shadow:0 4px #eab42b}#cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{padding:0 0 12px;border:7px solid white;background:white;color:#143974;overflow:hidden;border-radius:30px}.card img{width:100%;height:clamp(100px,19vh,190px);object-fit:cover;border-radius:21px}.card strong{display:block;font-size:clamp(16px,1.8vw,24px);margin:10px 0}.card small{font-size:13px;color:#557499}.card span{display:block;background:#159bf2;border-radius:18px;color:#fff;padding:9px;margin:12px 10px 0}.foot{text-align:center;font-size:14px;font-weight:600;margin:0}#play{height:calc(100% - 74px);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}#board{max-width:100%;min-height:0;width:auto;max-height:calc(100% - 92px);aspect-ratio:1400/760;touch-action:none}#toolbar{display:flex;gap:16px;align-items:center;height:84px;flex-shrink:0}#toolbar button{width:68px;height:68px;font-size:37px}#toolbar #test{background:#ffcb26;width:85px;height:78px;border-radius:28px}#moves{background:#fff;padding:10px 18px;border-radius:24px}#live{position:absolute;top:8px;left:50%;transform:translateX(-50%);background:#fff;border-radius:30px;padding:8px 20px;pointer-events:none;opacity:0;transition:opacity .2s;white-space:nowrap}#live.visible{opacity:1}dialog{border:8px solid white;border-radius:36px;background:#e8f8ff;color:#12316e;text-align:center;box-shadow:0 20px 80px #144c7266;padding:25px;max-width:90vw}dialog::backdrop{background:#16395d77}dialog img{height:140px;width:160px;object-fit:contain}dialog h2{font-size:30px;margin:5px}.stars{color:#ffbe18;font-size:48px;margin:10px}dialog button{display:block;width:100%;margin:12px 0;padding:10px}dialog #back{background:#e0f0ff;color:#154480;font-size:16px}[hidden]{display:none!important}@media(max-width:750px){#app{padding:8px}header{gap:5px;height:58px}header button{min-width:43px;width:45px;height:45px;min-height:43px;border-width:3px;border-radius:17px;font-size:25px}h1{padding:10px 12px;font-size:17px}#progress{padding:8px;font-size:12px}#menu{height:calc(100% - 58px);gap:10px}.intro img{width:65px;height:65px}.intro h2{font-size:22px}.intro p{font-size:12px}#difficulty{gap:5px}#difficulty button{padding:5px 9px;font-size:12px;min-height:45px}#cards{grid-template-columns:repeat(2,1fr);gap:10px;max-width:600px;align-self:center;width:100%}.card{border-width:4px;border-radius:20px;padding-bottom:5px}.card img{height:14vh}.card strong{font-size:17px;margin:5px}.card small{font-size:10px}.card span{margin:5px;padding:5px}.foot{font-size:10px}#play{height:calc(100% - 58px)}#toolbar{gap:8px;height:72px}#toolbar button{width:54px;height:54px;font-size:28px;min-width:48px}#toolbar #test{width:65px;height:60px}#board{max-height:calc(100% - 75px)}#moves{font-size:12px;padding:8px}}@media(max-height:550px){.intro{display:none}#menu{gap:8px}#cards{grid-template-columns:repeat(4,1fr)}.card img{height:23vh}.card strong{font-size:16px}.foot{display:none}#difficulty button{min-height:36px;padding:2px 15px}#toolbar{height:62px}#toolbar button{height:50px;width:56px;min-height:48px}#toolbar #test{height:58px}#board{max-height:calc(100% - 65px)}}
/* Approved Valebox arcade palette */
@font-face{font-family:Nunito;src:url('/fonts/manrope-800.ttf') format('truetype');font-weight:800;font-display:swap}#app{background:radial-gradient(ellipse at 8% 92%,#b4f4ff26 0 17%,transparent 17.2%),radial-gradient(ellipse at 96% 12%,#b4f4ff1f 0 21%,transparent 21.2%),linear-gradient(155deg,#55dcff,#03aaff 52%,#0879ed)}header{position:relative;z-index:1;background:linear-gradient(110deg,#007fff,#003bf5);border-bottom:3px solid #00d6ff;border-radius:24px;padding:4px 10px;height:80px;box-shadow:0 5px 0 #0069de}button{background:linear-gradient(#0d9cff 0%,#0061ff 55%,#003fe9 100%);border:3px solid #8becff;box-shadow:inset 0 3px 0 #fff9,inset 0 -4px 0 #0033bc,0 3px 0 #0344bb,0 0 0 2px #096df6;border-radius:23px;text-shadow:0 2px #084ca6}h1{background:none;color:white;letter-spacing:-1px;padding:4px 20px;font-size:clamp(19px,2.6vw,38px);text-shadow:0 3px #002590,2px 0 #002590,-2px 0 #002590;line-height:1.05}h1 span{color:#ffdf00}#progress{background:#004ad9;color:#fff;box-shadow:inset 0 2px #4acaff;font-size:18px}#exit{background:linear-gradient(#ff7298,#fa1655);box-shadow:inset 0 3px #ffbed9,inset 0 -4px #c60839,0 3px #003bc8}#menu{height:calc(100% - 80px)}.intro{background:#fffef4ed;border:4px solid #00c9ff;align-self:center;border-radius:30px;padding:8px 30px;box-shadow:0 5px #0063ce}.intro img{width:110px;height:110px}.intro h2{font-size:30px;color:#0648c2}#difficulty button{border-color:#fff;background:linear-gradient(#5ddcff,#0a93ff);color:#fff;text-shadow:0 2px #0052ae}#difficulty button.active{background:linear-gradient(#fff732,#ffbd00);color:#0636a5;box-shadow:inset 0 3px #fff8,inset 0 -4px #ec9600,0 3px #0056cb;text-shadow:0 1px white}.card{border:4px solid #00caff;background:#fff;box-shadow:0 6px #0062c7;text-shadow:none}.card strong{color:#0631a3}.card span{background:linear-gradient(#fff326,#ffbe00);color:#0631ad;border:2px solid #ffac00;box-shadow:inset 0 3px #fff9,0 3px #e79d00;font-size:20px}.card-art{height:clamp(100px,22vh,190px);position:relative;border-radius:22px;background:#68dcff;overflow:hidden;display:flex;align-items:center;justify-content:center}.art-0{background:url(assets/cover.webp) center 43%/170%}.art-0 i{display:none}.art-1{background:linear-gradient(#00cfff,#0951ed)}.mini-pipe{font:900 64px monospace;font-style:normal;line-height:.8;color:#c5fbff;text-shadow:5px 4px #004dbd;transform:rotate(-10deg);border:8px solid white;border-radius:20px;padding:10px}.art-2{background:repeating-linear-gradient(90deg,#d8edf4 0px,#d8edf4 49px,#b3d1e1 50px,#b3d1e1 52px)}.mini-car{position:absolute;width:42%;height:35%;background:#ffdf00;border:3px solid #f4a000;border-radius:13px;left:6%;top:30%;box-shadow:inset 0 4px #fff9}.mini-car:after{content:'';position:absolute;left:58%;top:15%;width:18%;height:70%;background:#7be8ff;border-radius:4px}.mini-car.c2{background:#ab58ff;border-color:#6029c9;transform:rotate(90deg);left:49%;top:22%}.mini-car.c3{background:#1ae95a;border-color:#0bac38;left:8%;top:72%}.art-3{background:linear-gradient(#126fff,#713bdf)}.mini-star{font-size:80px;font-style:normal;color:#fff32b;text-shadow:3px 4px #ff9d00;position:absolute;right:10%;top:2%}.mini-ray{position:absolute;width:60%;height:8px;background:#fff526;box-shadow:0 0 8px #ffff00;left:0;top:68%;transform:rotate(-20deg)}.mini-mirror{position:absolute;width:60px;height:14px;background:#def7ff;border:3px solid #064ed5;transform:rotate(-50deg);left:38%;top:55%;border-radius:9px}.foot{background:#fffdf1d9;align-self:center;padding:7px 20px;border-radius:20px;color:#0646a9}#play{height:calc(100% - 80px)}#toolbar{background:#ffffffed;padding:6px 18px;border:3px solid #00ceff;border-radius:30px;box-shadow:0 4px #0058d1;height:86px}#toolbar #test{background:linear-gradient(#fff528,#ffbf00);color:#0048e9;border-color:#fff3a0;box-shadow:inset 0 3px #fff9,inset 0 -4px #eda000,0 3px #ed9800}#toolbar #help{background:linear-gradient(#ac7eff,#7837ed)}dialog{border-color:#00cfff;box-shadow:0 0 0 5px #0060dd,0 20px 80px #003b8588}dialog button{padding:10px}.levels{max-width:540px;padding:22px 30px 30px}.levels h2{padding-right:30px}.levels .close{position:absolute;right:12px;top:10px;width:42px;height:42px;min-height:42px;min-width:42px;padding:0;font-size:27px;border-radius:16px}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.level-grid button{margin:0;width:86px;height:80px;font-size:30px;display:flex;flex-direction:column;align-items:center;justify-content:center}.level-grid small{color:#ffeb00;font-size:22px;line-height:1}.confetti{position:fixed;inset:0;pointer-events:none;z-index:99999;overflow:hidden}.confetti i{position:absolute;top:-20px;width:12px;height:20px;border-radius:3px;animation:fall 2.5s ease-in forwards}@keyframes fall{to{top:110%;rotate:620deg}}@media(max-width:750px){header{height:58px;border-radius:18px;padding:3px 5px}.intro{padding:4px 14px;border-width:3px}.intro img{width:65px;height:65px}.intro h2{font-size:21px}.card-art{height:14vh}#menu,#play{height:calc(100% - 58px)}#progress{font-size:12px}#toolbar{height:70px;padding:4px 10px}#difficulty button{font-size:12px;padding:5px 8px}.card span{font-size:16px}.level-grid button{width:62px;height:60px;font-size:23px}.level-grid{gap:10px}.levels{padding:18px}.mini-pipe{font-size:40px;border-width:4px}.mini-star{font-size:58px}}@media(max-height:550px){#toolbar{height:60px;padding:3px 14px}#toolbar button{min-width:46px;min-height:43px;width:50px;height:44px;font-size:27px}#toolbar #test{height:51px;width:66px}#board{max-height:calc(100% - 63px)}.card-art{height:22vh}.intro{display:none}.card strong{font-size:16px}#menu{gap:9px}}
header button svg{display:block;width:75%;height:75%;margin:auto}.intro p{color:#0c4aa5}#live{z-index:2}#moves:before{content:'↔ ';color:#0066e8}#moves{color:#0439a6;min-width:70px;text-align:center}
.game-title{display:block;width:240px;height:88px;object-fit:contain;margin:-7px 0 -10px;filter:drop-shadow(0 3px 0 #003ab9)}@media(max-width:750px){.game-title{width:155px;height:58px;margin:0}}@media(prefers-reduced-motion:reduce){button{transition:none}.confetti{display:none}}
.card-art{background-size:cover!important;background-position:center!important}.card-art i{display:none}
#adventure-pages{display:flex;justify-content:center;gap:12px}#adventure-pages button{font-size:14px;min-height:38px;padding:5px 18px;border-radius:17px}#adventure-pages button.active{background:linear-gradient(#bbff5b,#3bd519);color:#0044a8;text-shadow:none;border-color:#efffc1}#menu{gap:12px}.intro img{height:84px;width:84px}.intro h2{font-size:26px}.card-art{height:clamp(95px,20vh,175px)}#warehouse-controls{position:absolute;left:5%;bottom:14%;display:flex;align-items:center;gap:5px}#warehouse-controls>div{display:flex;flex-direction:column;gap:4px}#warehouse-controls button{width:55px;height:52px;min-height:48px;font-size:30px}.puzzle-demo{max-width:850px}.puzzle-demo img{width:min(700px,70vw);height:auto;max-height:55vh;object-fit:contain;border-radius:20px}.puzzle-demo p{font-size:26px}@media(max-width:750px){#adventure-pages{gap:5px}#adventure-pages button{font-size:11px;min-height:31px;padding:4px 9px}.intro img{width:52px;height:52px}.intro h2{font-size:19px}#menu{gap:8px}.card-art{height:12vh}.card strong{font-size:15px}#warehouse-controls{left:1%;bottom:17%}#warehouse-controls button{width:42px;min-width:40px;height:42px;min-height:40px;font-size:24px}.puzzle-demo p{font-size:18px}}@media(max-height:550px){#adventure-pages button{min-height:28px;font-size:12px;padding:1px 15px}#menu{gap:7px}.card-art{height:17vh}.card strong{margin:4px;font-size:15px}.card span{margin:5px 10px;padding:4px}.foot{display:none}}
/* Adventure cards — one continuous horizontal carousel. */
#adventure-carousel{position:relative;width:100%;min-height:0;flex-shrink:1;margin:0 auto;padding:0 44px}#cards{display:flex;flex-wrap:nowrap;gap:22px;width:100%;max-width:none;align-self:stretch;overflow-x:auto;overflow-y:hidden;padding:20px 8px 18px;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x;cursor:grab;scroll-padding-inline:8px}#cards::-webkit-scrollbar{display:none}#cards.dragging{cursor:grabbing;scroll-snap-type:none}#cards.dragging .card{pointer-events:none}#cards .adventure-card{--card-accent:#00ceff;flex:0 0 calc((100% - 44px)/3.18);min-width:0;position:relative;border:4px solid var(--card-accent);border-radius:36px 42px 31px 30px;padding:0;background:linear-gradient(#edffff,#fff 85%);box-shadow:inset 0 0 0 3px #fff,0 6px 0 #005bd8,0 9px 0 #00b9ef,0 12px 15px #0050a044;scroll-snap-align:start;overflow:visible;text-shadow:none;user-select:none;transition:transform .18s,filter .18s}#cards .adventure-card:hover{transform:translateY(-5px);filter:brightness(1.035)}#cards .adventure-card:active{transform:translateY(1px)}#cards .adventure-art{height:clamp(145px,25vh,245px);border-radius:30px 36px 0 0;background:#50ceff!important;overflow:hidden;position:relative;display:block}#cards .adventure-art:after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 4px 0 #eaffffcc,inset 0 0 0 3px #e1ffff70;pointer-events:none}#cards .adventure-art img{display:block;width:100%;height:100%;margin:0;border-radius:0;object-fit:cover;pointer-events:none}#cards .adventure-art .adventure-badge{display:flex;position:absolute;left:11px;top:10px;align-items:center;justify-content:center;width:39px;height:39px;background:linear-gradient(#fff,#e1f8ff);border:2px solid #00baff;border-radius:50%;font-size:23px;font-style:normal;box-shadow:0 3px #0059c777}#cards .adventure-title{position:relative;z-index:1;margin:-10px 10px 0;padding:9px 9px 11px;display:flex;align-items:center;justify-content:center;min-height:62px;border-radius:13px 17px 22px 18px;border:3px solid #32cfff;background:linear-gradient(#118cff,#0059f1 55%,#0039cc);box-shadow:inset 0 3px #8be3ff,0 4px #002d9a;color:#fff;text-shadow:0 2px #002e95;font-size:clamp(17px,1.65vw,25px);line-height:1.12;letter-spacing:-.5px}#cards .adventure-footer{height:77px;display:flex;align-items:center;gap:5px;justify-content:space-between;padding:5px 12px 11px}#cards .adventure-progress{font-size:clamp(10px,1.05vw,14px);color:#0754a6;border:2px solid #c4ebff;border-radius:22px;background:#eefaff;padding:7px 9px;white-space:nowrap}#cards .adventure-progress b{color:#ffb700;margin-right:2px}#cards .adventure-play{display:flex;align-items:center;justify-content:center;flex:0 0 63px;width:63px;height:63px;min-width:0;margin:0;padding:0 0 0 4px;border-radius:50%;font-size:31px;color:#0043b6;border:4px solid #fff9c5;background:radial-gradient(circle at 35% 25%,#fff75c,#ffd000 55%,#ffac00);box-shadow:inset 0 3px #fff9,0 0 0 3px #ffad00,0 4px 0 3px #cc8500;text-shadow:0 2px #ffff9d}#adventure-carousel .carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:52px;height:58px;min-width:0;min-height:0;border-radius:50%;font:800 52px/1 Arial;padding:0 0 6px;color:#fff;border:3px solid #d3ffff;background:linear-gradient(#169eff,#0040ec);box-shadow:0 0 0 3px #00caff,0 5px #0044bd}#adventure-carousel .previous{left:0}#adventure-carousel .next{right:0}#adventure-carousel .carousel-arrow:disabled{opacity:.35;cursor:default}#carousel-dots{display:flex;gap:10px;justify-content:center;align-items:center;min-height:22px;flex-shrink:0}#carousel-dots .carousel-dot{min-width:0;min-height:0;width:14px;height:14px;padding:0;border:2px solid #e5ffff;border-radius:50%;background:linear-gradient(#eaffff,#69d9ff);box-shadow:0 2px #0071c8;transition:transform .15s}#carousel-dots .carousel-dot[aria-current=true]{background:linear-gradient(#fffc55,#ffbf00);border-color:#fff79d;transform:scale(1.22)}#carousel-hint{margin:-3px 0 0;text-align:center;font-size:13px;color:#004ab6;background:#f1fdffdd;border-radius:20px;padding:5px 16px;align-self:center}#menu{max-width:1320px;gap:10px}#menu .foot{font-size:12px;padding:5px 16px}#menu .intro{padding:5px 25px}#menu .intro img{height:68px;width:68px}#menu .intro h2{font-size:25px;margin-bottom:4px}@media(max-width:1000px){#cards .adventure-card{flex-basis:calc((100% - 22px)/2.25)}#cards .adventure-title{font-size:19px}#cards .adventure-progress{font-size:11px}#cards .adventure-play{flex-basis:55px;width:55px;height:55px;font-size:26px}}@media(max-width:750px){#adventure-carousel{padding:0 28px}#cards{gap:17px;padding:14px 6px 16px}#cards .adventure-card{flex-basis:78%;border-radius:30px}#cards .adventure-art{height:clamp(140px,25vh,240px);border-radius:24px 24px 0 0}#cards .adventure-title{font-size:20px;min-height:58px}#cards .adventure-progress{font-size:11px}#cards .adventure-footer{height:70px}#adventure-carousel .carousel-arrow{width:37px;height:44px;font-size:38px}#carousel-hint{font-size:11px}#menu .intro img{width:48px;height:48px}#menu .intro h2{font-size:19px}#menu .intro{padding:3px 12px}#menu .foot{font-size:10px}#menu{gap:8px}#carousel-dots{gap:8px}#carousel-dots .carousel-dot{width:11px;height:11px}}@media(max-height:600px) and (min-width:751px){#menu .intro{display:none}#cards .adventure-art{height:clamp(85px,28vh,165px)}#cards .adventure-title{min-height:44px;font-size:18px;padding:6px}#cards .adventure-footer{height:62px}#cards .adventure-play{width:49px;height:49px;flex-basis:49px;font-size:25px}#menu .foot{display:none}#menu{gap:6px}#carousel-hint{display:none}}@media(max-height:500px) and (max-width:750px){#menu .intro{display:none}#cards .adventure-card{flex-basis:calc((100% - 17px)/2.25)}#cards .adventure-art{height:23vh;min-height:70px}#cards .adventure-title{font-size:15px;min-height:38px;padding:5px;margin:-8px 5px 0}#cards .adventure-footer{height:49px;padding:4px 9px 7px}#cards .adventure-play{width:37px;height:37px;flex-basis:37px;font-size:20px;border-width:3px}#cards .adventure-progress{font-size:8px;padding:4px}#cards .adventure-badge{display:none}#carousel-hint,#menu .foot{display:none}#menu{gap:4px}#cards{padding-top:8px;padding-bottom:13px}}@media(prefers-reduced-motion:reduce){#cards .adventure-card{transition:none}#carousel-dots .carousel-dot{transition:none}}
@media(min-width:751px) and (min-height:601px){#menu{gap:8px}#menu .intro img{width:60px;height:60px}#cards .adventure-art{height:clamp(115px,calc(100dvh - 625px),245px)}#cards .adventure-footer{height:68px}#cards .adventure-play{width:56px;height:56px;flex-basis:56px;font-size:28px}}
@media(max-width:750px) and (min-height:501px){#cards .adventure-art{height:clamp(105px,calc(100dvh - 540px),250px)}}

@media(max-width:750px) and (min-height:501px) and (max-height:650px){#menu .intro,#menu .foot,#carousel-hint{display:none}#cards .adventure-art{height:clamp(100px,calc(100dvh - 350px),170px)}}
.mechanic-demo{width:min(780px,92vw);padding:18px 22px}.mechanic-demo h2{font-size:26px}.mechanic-demo p{font-size:18px;margin:8px}.mechanic-preview{display:block;width:100%;max-height:52vh;object-fit:contain;border-radius:24px;background:#d7f2ff}.mechanic-demo>button{max-width:150px;margin:14px auto 0;background:linear-gradient(#fff238,#ffbc00);color:#0049c9;font-size:34px}.gear-tutorial{height:190px;display:flex;align-items:center;justify-content:center;gap:0}.gear-tutorial img{width:110px;height:110px;object-fit:contain;margin:0;animation:demo-rotate 4s linear infinite}.gear-tutorial img:nth-child(3){animation-direction:reverse}.demo-motor{background:#087cff;border:5px solid #72e7ff;border-radius:22px;color:#ffe429;font-size:65px;width:100px}.demo-light{font-size:80px;color:#ffc400;text-shadow:0 0 20px #ffee00;animation:demo-glow 2s infinite}.marble-tutorial{position:relative;height:240px;max-width:450px;margin:auto}.demo-chute{position:absolute;top:95px;left:50%;width:155px;height:18px;border:4px solid #ffc800;background:#0877fb;border-radius:10px;transform-origin:left center;transform:rotate(35deg)}.demo-chute.left{transform:rotate(145deg)}.demo-knob{position:absolute;top:78px;left:calc(50% - 28px);border:4px solid #80eaff;border-radius:50%;background:#0877ff;color:#ffde00;font-size:36px;width:60px;height:60px;animation:demo-knob 3s infinite}.demo-hand{position:absolute;left:55%;top:55px;font-size:40px;animation:demo-tap 3s infinite}.demo-marble{position:absolute;top:15px;left:calc(50% - 13px);width:28px;height:28px;border:3px solid white;border-radius:50%;background:radial-gradient(circle at 30% 20%,white,#00cbff 40%,#0071de);animation:demo-roll 3s infinite}.demo-cup{position:absolute;bottom:5px;left:13%;background:#00cfff;border:5px solid #ffe400;border-radius:6px 6px 20px 20px;width:65px;height:45px;font-size:25px;color:#fff}.demo-cup.wrong{left:auto;right:13%;background:#ff526e}@keyframes demo-rotate{to{transform:rotate(360deg)}}@keyframes demo-glow{50%{filter:brightness(1.5);transform:scale(1.08)}}@keyframes demo-tap{0%,30%,100%{transform:translateY(0)}20%{transform:translateY(12px)}}@keyframes demo-knob{0%,15%{transform:rotate(-80deg)}30%,100%{transform:rotate(0)}}@keyframes demo-roll{0%,28%{transform:translate(0,0);opacity:0}30%{transform:translate(0,0);opacity:1}48%{transform:translate(0,78px);opacity:1}84%{transform:translate(-120px,165px);opacity:1}100%{transform:translate(-120px,165px);opacity:0}}@media(prefers-reduced-motion:reduce){.gear-tutorial img,.demo-light,.demo-knob,.demo-hand,.demo-marble{animation:none}.demo-marble{transform:translate(-80px,130px)}}

.fallback-tutorial{padding:55px 20px;font-size:44px}

/* One continuous backdrop; puzzle canvases keep their surroundings transparent. */
#board{background:transparent}

/* Four adventures, all visible without horizontal navigation. */
#cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;overflow:visible;scroll-snap-type:none;touch-action:auto;cursor:default;padding:12px 5px 18px;width:100%;max-width:none}
#cards .adventure-card{width:100%;min-width:0;scroll-snap-align:none}
#cards .adventure-art{height:clamp(110px,24dvh,245px)}
#cards .adventure-progress{font-size:clamp(9px,.9vw,12px);padding:6px}
#cards .adventure-footer{padding-inline:10px;gap:4px}
#cards .adventure-play{width:52px;height:52px;flex-basis:52px;font-size:26px}
@media(max-width:750px) and (min-height:501px){#cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;padding:6px 4px 14px}#cards .adventure-art{height:clamp(65px,calc((100dvh - 430px)/2),160px)}#cards .adventure-title{font-size:16px;min-height:43px;margin:-8px 6px 0;padding:5px}#cards .adventure-footer{height:49px;padding:4px 8px 7px}#cards .adventure-play{width:35px;height:35px;flex-basis:35px;font-size:19px;border-width:3px}#cards .adventure-progress{font-size:9px;padding:4px}#cards .adventure-badge{width:28px;height:28px;font-size:17px}#menu .intro{flex-shrink:0}}
@media(max-height:600px) and (min-width:751px){#cards .adventure-art{height:clamp(65px,calc(100dvh - 310px),170px)}}
@media(max-height:500px) and (max-width:750px){#cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}#cards .adventure-art{height:clamp(55px,calc(100dvh - 230px),150px)}#cards .adventure-title{font-size:13px;min-height:38px}#cards .adventure-progress{font-size:8px;padding:3px}#cards .adventure-play{width:29px;height:29px;flex-basis:29px;font-size:15px}#cards .adventure-footer{padding-inline:5px}}

#result #back{text-shadow:none;color:#123c79;font-weight:800}