/* Shared toddler-sized presentation for Little Builders and Bubble Bath Friends. */
.toy-screen{position:fixed;inset:0;z-index:1;padding:calc(var(--floating-nav-height,80px) + 10px) 18px 14px!important;background:#e8eddf;color:#48675c;box-sizing:border-box;overflow:hidden}
.toy-screen[hidden]{display:none!important}#bath-screen{background:#e5efeb}
.toy-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(330px,.8fr);gap:18px;max-width:1600px;height:100%;margin:auto}
.toy-stage{position:relative;min-height:0;border-radius:30px;overflow:hidden;box-shadow:0 5px 0 #8eaa9226;background:#c9dfd4;touch-action:none}
.toy-canvas{display:block;width:100%;height:100%;touch-action:none}
.toy-heading{position:absolute;left:22px;right:22px;top:20px;pointer-events:none;z-index:2}
.toy-heading h1{font-size:clamp(23px,2.6vw,35px);color:#3d6659!important;margin:3px 0;text-shadow:0 1px #fff9}
.toy-kicker{font-size:10px;font-weight:900;letter-spacing:2px;color:#738f70}
.toy-panel{align-self:center;max-height:100%;overflow:auto;overscroll-behavior:contain;padding:20px;border:2px solid #fff;border-radius:28px;background:linear-gradient(140deg,#fffdf3,#f3ecdc);box-shadow:0 5px #c6b69628}
.toy-status{font-size:14px;line-height:1.4;min-height:40px;margin:0 0 12px;font-weight:800;color:#577965}
.toy-panel h2{font-size:19px;margin:14px 0 9px;color:#537363}
.toy-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.toy-project,.toy-animal{min-width:0;border:2px solid #e1dbc7;border-radius:18px;background:#fcf8ec;padding:5px;color:#5b7769;display:flex;flex-direction:column;align-items:center;justify-content:center;font:inherit;font-size:11px;font-weight:900;min-height:94px;touch-action:manipulation;cursor:pointer}
.toy-project img{width:90px;max-width:100%;height:62px;object-fit:contain}.toy-project[aria-pressed=true],.toy-animal[aria-pressed=true]{background:#dbeedc;border-color:#83b69a;box-shadow:0 3px #9abb9b}
.toy-pieces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.toy-piece{position:relative;min-width:0;min-height:115px;padding:7px;border:2px solid #e2dac6;border-radius:18px;background:radial-gradient(ellipse at 50% 20%,#fffefa,#efe6d5);color:#59776b;font:inherit;font-size:12px;font-weight:800;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;touch-action:pan-y;user-select:none;-webkit-user-select:none;box-shadow:0 3px #b1a48b20;cursor:pointer}
.toy-piece img{display:block;width:104px;max-width:100%;height:76px;object-fit:contain;pointer-events:auto;touch-action:none;-webkit-user-drag:none;-webkit-touch-callout:none}
.toy-piece[aria-pressed=true]{border-color:#74af96;background:#dfefdf;box-shadow:0 3px #9dbb9d}.toy-piece.is-dragging{opacity:.35;border-style:dashed}.toy-piece.is-done:after{content:'✓';position:absolute;top:5px;right:5px;color:#fff;background:#7ca58b;width:21px;line-height:21px;border-radius:50%;text-align:center}
.toy-piece:disabled{cursor:default}.toy-piece:disabled.is-done img{opacity:.6}
.toy-progress{display:flex;align-items:center;justify-content:center;gap:10px;color:#829078;font-weight:800;font-size:12px;margin-top:15px}.toy-progress>span:first-child{font-size:16px;color:#54785e}
.builders-target{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;min-height:48px;min-width:48px;border:3px dashed #fff9cf;background:#e9ffe03b;color:#fff9e2;border-radius:50%;font:inherit;font-size:34px;text-shadow:0 2px #71976d;box-shadow:0 0 0 8px #e2f9d02b;z-index:1;touch-action:manipulation}
.builders-target[hidden]{display:none}
.toy-animals{display:flex;gap:7px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:thin;scrollbar-color:#a1bfa8 #edf1e4;overscroll-behavior-x:contain;touch-action:pan-x}
.toy-animal{flex:0 0 76px;min-height:87px}.toy-animal img{height:58px;width:64px;object-fit:contain;pointer-events:none}
.toy-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.bath-zones{position:absolute;inset:0;pointer-events:none;z-index:1}.bath-zone{pointer-events:auto;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:46px;width:46px;border:2px dashed #f6ffe6a6;border-radius:50%;background:#fff8ce18;color:#fff9da;text-shadow:0 1px 3px #527e67;font-size:26px;touch-action:none}.bath-zone[hidden]{display:none}
.toy-error{position:absolute;inset:0;background:#f1eee3f2;display:grid;place-content:center;text-align:center;z-index:7;padding:25px}.toy-error[hidden]{display:none}.toy-error h2{font-size:24px;margin-bottom:10px}.toy-error p{font-size:14px;line-height:1.5;margin-bottom:15px}.toy-error button{min-height:48px;padding:10px 20px;border:2px solid #fff;background:#c8dfcc;border-radius:15px;font:inherit;font-weight:900;color:#537261}
.toy-finale-caption{display:none;position:absolute;z-index:3;bottom:16px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;text-align:center;background:#fff8e4eb;border:3px solid #fff;border-radius:23px;padding:11px 22px;color:#54785d;pointer-events:none;box-shadow:0 4px #76925b22}.toy-finale-caption strong{display:block;font-size:22px}.toy-finale-caption span{display:block;font-size:12px;margin-top:4px}
.toy-screen[data-complete=true] .toy-finale-caption{display:block}.toy-screen[data-complete=true] .toy-layout{grid-template-columns:1fr;grid-template-rows:1fr}.toy-screen[data-complete=true] .toy-panel{display:none}
#home-builders .tile-picture img,#home-bath .tile-picture img{width:100%;height:100%;object-fit:cover}
@media(max-width:950px) and (min-height:600px){.toy-screen{padding-left:12px!important;padding-right:12px!important}.toy-layout{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:12px}.toy-panel{padding:12px 16px;max-height:47vh}.toy-status{min-height:0;margin-bottom:8px;font-size:13px}.toy-project{min-height:78px}.toy-project img{height:45px}.toy-projects{max-width:550px;margin:auto}.toy-pieces{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.toy-piece{min-height:94px;padding:5px}.toy-piece img{height:56px}.toy-panel h2{font-size:17px;margin:10px 0 7px}.toy-progress{margin-top:9px}.toy-tools{grid-template-columns:repeat(4,minmax(0,1fr))}.toy-animals{padding-bottom:6px}.toy-animal{min-height:75px;flex-basis:70px}.toy-animal img{height:48px}}
@media(max-width:600px) and (min-height:600px){.toy-screen{padding:calc(var(--floating-nav-height,110px) + 6px) 8px 8px!important}.toy-layout{gap:8px}.toy-stage{border-radius:24px}.toy-panel{padding:10px 10px 9px;border-radius:23px;max-height:47vh}.toy-status{font-size:11px;margin-bottom:6px;line-height:1.35}.toy-projects{gap:5px}.toy-project{min-height:68px;font-size:10px;border-radius:14px}.toy-project img{height:36px}.toy-piece{min-height:83px;font-size:10px;border-radius:14px;padding:4px;gap:2px}.toy-piece img{height:49px;width:80px}.toy-pieces{gap:6px}.toy-panel h2{font-size:15px;margin:8px 0 5px}.toy-progress{font-size:10px;margin-top:7px}.toy-progress>span:first-child{font-size:13px}.toy-heading{left:14px;top:12px}.toy-heading h1{font-size:20px!important;max-width:220px}.toy-kicker{font-size:8px;letter-spacing:1.3px}.toy-finale-caption{padding:8px 14px;bottom:12px}.toy-finale-caption strong{font-size:20px}.toy-tools{gap:5px}.toy-animal{flex-basis:62px;min-height:70px;font-size:10px}.toy-animal img{height:45px;width:50px}.builders-target{width:54px;height:54px;font-size:30px}.bath-zone{height:44px;width:44px}}
@media(max-height:599px){.toy-screen{padding:calc(var(--floating-nav-height,60px) + 5px) 8px 8px!important}.toy-layout{grid-template-columns:minmax(0,1fr) minmax(315px,.9fr);gap:8px}.toy-panel{padding:10px}.toy-status{font-size:11px;min-height:0;margin-bottom:6px}.toy-projects{gap:5px}.toy-project{min-height:64px;font-size:10px;padding:3px}.toy-project img{height:34px}.toy-pieces{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.toy-piece{min-height:78px;padding:3px;font-size:10px}.toy-piece img{height:44px}.toy-panel h2{font-size:15px;margin:7px 0 5px}.toy-heading{top:10px;left:12px}.toy-heading h1{font-size:19px!important}.toy-kicker{display:none}.toy-progress{margin-top:7px}.toy-animal{min-height:70px;flex-basis:60px}.toy-animal img{height:44px;width:50px}.toy-tools{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.toy-tools .toy-piece{flex-direction:row;min-height:64px}.toy-tools .toy-piece img{width:55px;height:52px}.toy-finale-caption{bottom:8px;padding:7px 12px}.toy-finale-caption strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){.toy-screen *{scroll-behavior:auto!important}}

/* Builders: a colorful project shelf and a precise, bright next-piece socket. */
#builders-screen{background:linear-gradient(135deg,#88cbd1,#a0c683)}
#builders-screen .toy-panel{background:linear-gradient(145deg,#92cfca,#69b5bc);border-color:#d4f2df}
#builders-screen .toy-panel h2,#builders-screen .toy-status,#builders-screen .toy-progress{color:#234f60}
.builders-browse{display:flex;align-items:center;gap:8px;margin-bottom:6px}.builders-browse h2{flex:1;margin:0!important}.builders-browse button{width:44px;height:44px;min-width:44px;border:2px solid #ffedbf;border-radius:15px;background:#f1c76b;color:#674928;font-size:28px}
#builders-projects{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc((100% - 16px)/3);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:3px 2px 7px;max-width:none}
#builders-projects .toy-project{scroll-snap-align:start;background:#d7eee7;border-color:#a2d2ca;color:#304e66}
#builders-projects .toy-project[aria-pressed=true]{background:#ffe4a3;border-color:#f4bd4b;box-shadow:0 3px #c9a159}
#builders-pieces{grid-template-columns:repeat(3,minmax(0,1fr))}
#builders-pieces .toy-piece{background:#e5edf9;color:#3a5570;min-height:112px}#builders-pieces .toy-piece:nth-child(3n+2){background:#f9e3ed}#builders-pieces .toy-piece:nth-child(3n){background:#fff0bd}
#builders-pieces .toy-piece img{width:90px;height:70px}#builders-pieces .toy-piece[aria-pressed=true]{border:3px solid #f7bd36;background:#fff0a1;box-shadow:0 0 0 3px #ffdb6a66}
#builders-screen .builders-target{border:3px dashed #fff49d;border-radius:22px;background:#ffdf3b10;box-shadow:0 0 0 5px #ffd74635,0 0 24px #ffe25b60;display:grid;place-items:center;pointer-events:auto;font-size:34px;transition:width .15s,height .15s;animation:builder-socket 1.5s ease-in-out infinite}
#builders-screen .builders-target[hidden]{display:none}
.builders-target>span{display:block;background:#f5b938;color:#60442d;width:44px;height:44px;border:3px solid #fff0b4;border-radius:50%;font-size:29px;line-height:36px;text-shadow:none}
.builders-target small{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:nowrap;border:2px solid #fff1b5;border-radius:13px;padding:5px 9px;background:#f3c14f;color:#59412c;text-shadow:none;font:900 12px Nunito,sans-serif}
@keyframes builder-socket{50%{box-shadow:0 0 0 10px #ffd74618,0 0 28px #ffe25b70}}
.bath-toys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:10px}.bath-toys[hidden]{display:none}.bath-toys button{min-height:80px;padding:5px;border:3px solid transparent;background:#e4d5f4;border-radius:20px;display:grid;justify-items:center;color:#51436b;font:900 12px Nunito,sans-serif}.bath-toys img{width:64px;height:48px;object-fit:contain;touch-action:none}.bath-toys button[aria-pressed=true]{border-color:#e5ad36;background:#fff0b4}
.bath-give-toy{position:absolute;left:50%;bottom:15px;transform:translateX(-50%);z-index:3;min-height:50px;border:3px solid #fff0b9;border-radius:20px;padding:9px 18px;background:#f4ce74;color:#5a4260;font:900 15px Nunito,sans-serif;touch-action:manipulation}.bath-give-toy[hidden]{display:none}
#bath-screen .toy-panel{background:linear-gradient(135deg,#99d9de,#aab6e2);border-color:#dbf5ef}#bath-screen .toy-panel h2,#bath-screen .toy-status,#bath-screen .toy-progress{color:#334d72}
#bath-tools{grid-template-columns:repeat(3,minmax(0,1fr))}#bath-tools .toy-piece{min-height:108px;background:#e0ecfa;color:#425473}#bath-tools .toy-piece:nth-child(2n){background:#f4dce8}#bath-tools .toy-piece img{height:64px;width:82px}
@media(max-width:950px) and (min-height:600px){#builders-pieces .toy-piece{min-height:90px}#builders-pieces .toy-piece img{height:54px}#bath-tools .toy-piece{min-height:88px}#bath-tools .toy-piece img{height:48px}}
@media(max-width:600px),(max-height:599px){#builders-pieces .toy-piece{min-height:80px}#builders-pieces .toy-piece img{height:44px}#bath-tools .toy-piece{min-height:78px;font-size:11px}#bath-tools .toy-piece img{height:44px}.bath-toys button{min-height:65px}.bath-toys img{height:35px}.builders-target small{font-size:10px}}
@media(prefers-reduced-motion:reduce){#builders-screen .builders-target{animation:none;transition:none}}

.bath-give-toy{left:14px;transform:none}

#bath-stage .scene-palettes{left:10px;right:auto;bottom:10px}
.bath-give-toy{left:auto;right:14px;display:flex;align-items:center;gap:7px}.bath-give-toy[hidden]{display:none}.bath-give-toy img{height:32px;width:38px;object-fit:contain;pointer-events:none}