/* Kids ABC & 123 Puzzles v1.0.0 */
.kidspuz-app{max-width:640px;margin:0 auto;font-family:'Nunito',system-ui,sans-serif;}
.kidspuz-app *{box-sizing:border-box;}

.kidspuz-frame{
	background:linear-gradient(170deg,#5B4BE8 0%,#7C3AED 45%,#A855F7 100%);
	border-radius:22px;
	padding:clamp(14px,3vw,26px);
	box-shadow:0 10px 30px rgba(0,0,0,.25);
}

.kidspuz-titlebar{display:flex;align-items:center;justify-content:center;gap:10px;}
.kidspuz-title{
	font-family:'Baloo 2',cursive;font-weight:800;
	font-size:clamp(1.4rem,4vw,2rem);color:#fff;
	text-shadow:0 3px 0 rgba(0,0,0,.18);
}
.kidspuz-star{font-size:clamp(1.1rem,3vw,1.6rem);}
.kidspuz-sub{
	text-align:center;color:rgba(255,255,255,.92);
	font-family:'Baloo 2',cursive;font-weight:600;
	font-size:clamp(.9rem,2.4vw,1.15rem);
	margin:2px 0 14px;
}

.kidspuz-stage{position:relative;}
.kidspuz-board{
	position:relative;width:100%;
	aspect-ratio:calc(var(--cols,5)) / calc(var(--rows,6));
	background:rgba(255,255,255,.08);
	border:3px solid rgba(255,255,255,.5);
	border-radius:16px;
	overflow:hidden;
}
.kidspuz-gridlines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}

.kidspuz-piece{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;}
.kidspuz-piece.kidspuz-dragging{cursor:grabbing;filter:drop-shadow(0 8px 10px rgba(0,0,0,.35));}
.kidspuz-placed{pointer-events:none;}
.kidspuz-pop{animation:kidspuz-pop .4s ease;}
@keyframes kidspuz-pop{0%{transform:scale(1.12);}60%{transform:scale(.97);}100%{transform:scale(1);}}

.kidspuz-traywrap{margin-top:14px;}
.kidspuz-traylabel{
	color:#fff;font-family:'Baloo 2',cursive;font-weight:700;
	font-size:.95rem;margin-bottom:6px;opacity:.9;
}
.kidspuz-tray{
	display:flex;flex-wrap:wrap;gap:6px;justify-content:center;
	background:rgba(0,0,0,.12);
	border-radius:14px;
	padding:10px;
	min-height:70px;
	max-height:230px;overflow-y:auto;
}
.kidspuz-trayslot{
	width:clamp(46px,10vw,64px);height:clamp(46px,10vw,64px);
	display:flex;align-items:center;justify-content:center;
}
.kidspuz-tray .kidspuz-piece{width:100%;height:100%;}

.kidspuz-nav{display:flex;justify-content:center;margin-top:14px;}
.kidspuz-btn{
	font-family:'Baloo 2',cursive;font-weight:700;
	font-size:1rem;color:#7C3AED;background:#fff;
	border:none;border-radius:999px;
	padding:9px 26px;cursor:pointer;
	box-shadow:0 4px 0 rgba(0,0,0,.18);
	transition:transform .1s ease;
}
.kidspuz-btn:hover{transform:translateY(-2px);}
.kidspuz-btn:active{transform:translateY(1px);box-shadow:0 2px 0 rgba(0,0,0,.18);}

.kidspuz-winbar{
	text-align:center;margin:14px 0 0;
	padding:16px;background:rgba(255,255,255,.16);
	border:3px solid rgba(255,255,255,.55);border-radius:18px;
}
.kidspuz-winstars{font-size:1.8rem;letter-spacing:4px;}
.kidspuz-wintext{
	font-family:'Baloo 2',cursive;font-weight:800;
	font-size:clamp(1.2rem,3.5vw,1.7rem);color:#FFD23F;
	text-shadow:0 2px 0 rgba(0,0,0,.2);margin:6px 0 12px;
}

.kidspuz-confwrap{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.kidspuz-confetti{
	position:absolute;top:-12px;width:10px;height:14px;border-radius:2px;
	animation:kidspuz-fall 2.6s linear forwards;
}
@keyframes kidspuz-fall{
	0%{transform:translateY(0) rotate(0);opacity:1;}
	100%{transform:translateY(560px) rotate(540deg);opacity:0;}
}

@media (prefers-reduced-motion:reduce){
	.kidspuz-pop,.kidspuz-confetti{animation:none;}
}

/* ===== pick screen ===== */
.kidspuz-picklabel{
	text-align:center;color:#fff;font-family:'Baloo 2',cursive;font-weight:800;
	font-size:clamp(1.1rem,3vw,1.5rem);margin:6px 0 16px;
	text-shadow:0 2px 0 rgba(0,0,0,.2);
}
.kidspuz-pickcards{
	display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,3vw,22px);
	max-width:460px;margin:0 auto;padding:8px 0 6px;
}
.kidspuz-pickcard{
	--pc:#FF4757;
	display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
	aspect-ratio:1/1;
	background:var(--pc);
	border:6px solid #fff;border-radius:26px;cursor:pointer;font-family:inherit;
	box-shadow:0 10px 0 rgba(0,0,0,.22),0 16px 30px rgba(0,0,0,.28);
	transition:transform .15s cubic-bezier(.34,1.56,.64,1);
}
.kidspuz-pickcard:hover,.kidspuz-pickcard:focus-visible{transform:translateY(-8px) scale(1.04) rotate(-2deg);outline:none;}
.kidspuz-pickbig{
	font-family:'Baloo 2',cursive;font-weight:800;
	font-size:clamp(2.4rem,10vw,4.2rem);color:#fff;line-height:1;
	text-shadow:0 4px 0 rgba(0,0,0,.22),0 2px 0 rgba(255,255,255,.35) inset;
}
.kidspuz-pickcap{
	font-family:'Baloo 2',cursive;font-weight:700;
	font-size:clamp(1rem,3vw,1.4rem);color:#fff;
	text-shadow:0 2px 0 rgba(0,0,0,.2);
}

/* back to menu */
.kidspuz-back{
	display:inline-block;margin-bottom:10px;padding:7px 16px;
	background:rgba(255,255,255,.16);color:#fff;
	border:2px solid rgba(255,255,255,.55);border-radius:999px;
	font-family:'Baloo 2',cursive;font-weight:700;font-size:.95rem;cursor:pointer;
}
.kidspuz-back:hover{background:rgba(255,255,255,.28);}