/* Zählwiese V49 · One premium illustrated world across EVERY game
   Uses the color language, original illustrations and wood framing from approved homepage.
   Gameplay layout, clickable controls, motion physics and touch events stay untouched. */
:root{
 --zw-wood-dark:#96623c;--zw-wood:#bf8250;--zw-wood-light:#fbe2a6;
 --zw-grass:#7bbd5b;--zw-sky:#76c6eb;--zw-cream:#fff1c9;
 --zw-border:#9a704d;--zw-shadow:#6b604751;--zw-honey:#f4c874;
 --zw-flower:#e994ab;
}
body:has(.main-content:not(.intro-content)) .device{
 background-color:#8ac66f!important;
 background-image:url('/gameworld-v49.webp')!important;
 background-size:100% 100%!important;
 background-position:center center!important;
 background-repeat:no-repeat!important;
}
body:has(.main-content:not(.intro-content)) .device:after{
 box-shadow:inset 0 0 65px #fff2a32a!important;pointer-events:none;
}
body:has(.main-content:not(.intro-content)) .app-header:not(.home-header){
 background:transparent!important;border:0!important;box-shadow:none!important;
 position:relative!important;z-index:6!important;
}
body:has(.main-content:not(.intro-content)) .app-header .brand{opacity:0!important;pointer-events:none!important;max-width:0!important;width:0!important;overflow:hidden!important}
body:has(.main-content:not(.intro-content)) .app-header .header-tools{width:100%!important;display:flex!important;justify-content:flex-start!important}
body:has(.main-content:not(.intro-content)) .zw-go-home{
 background:linear-gradient(170deg,#fff2c6,#edbc7c)!important;
 border:3px solid #a77446!important;border-radius:25px!important;
 color:#765136!important;min-width:116px!important;min-height:48px!important;
 box-shadow:inset 0 2px #fff5d8,1px 4px #855b3d8c,0 6px 11px #5f793b35!important;
 font-weight:950!important;letter-spacing:-.25px!important;
}
body:has(.main-content:not(.intro-content)) .zw-go-home:active{transform:translateY(3px)!important}
body:has(.main-content:not(.intro-content)) .main-content{color:#6e5137}
body:has(.main-content:not(.intro-content)) :is(.main-content h1,.main-content h2,.wood-heading){
 text-shadow:0 2px #fff5d7,0 0 7px #fff1cf8c;
}
body:has(.main-content:not(.intro-content)) :is(.main-content .instruction,.extra-page .extra-caption,.kitchen-subtitle,.drive-caption,.hunt-caption,.family-maze-instruction){
 color:#426b40!important;text-shadow:0 1px 1px #fff4d6,0 0 4px #fff5d7!important;font-weight:900!important;
}
/* Shared gold oak cards, soft inner light, distinct from the inexpensive old beige flat panels. */
body:has(.main-content:not(.intro-content)) :is(.progress .wood-heading,.extra-top .wood-heading,.kitchen-title.wood-heading){
 background:linear-gradient(155deg,#fff0bd 0%,#f8d99a 45%,#dea965 100%)!important;
 border:4px solid #ac7949!important;border-radius:18px!important;
 color:#7a4c2d!important;box-shadow:inset 0 0 0 2px #fff8d9,2px 5px #8a603d73,0 6px 15px #5b844d35!important;
 filter:none!important;
}
body:has(.main-content:not(.intro-content)) .progress-dot{
 background:#fff6d0!important;border:2px solid #bd9258!important;
 box-shadow:0 2px 0 #695d4773!important;
}
body:has(.main-content:not(.intro-content)) .progress-dot.done{background:#83cb73!important;border-color:#5f9c58!important}
body:has(.main-content:not(.intro-content)) .progress-dot.current{background:#ffce5b!important;border-color:#a67738!important;box-shadow:0 0 0 2px #fff2c1,0 3px 0 #866249!important}
body:has(.main-content:not(.intro-content)) .progress-track{filter:drop-shadow(0 1px 1px #fff9cf)}
/* Counting: rich forest-board and crisp illustrated number cards. */
body:has(.main-content .equation-area) .equation-area{
 border-color:#a97143!important;border-width:7px!important;border-radius:23px!important;
 background:radial-gradient(ellipse at 45% 25%,#2e755c,#174c44 76%,#123b35)!important;
 box-shadow:inset 0 0 0 3px #f1dba8,inset 0 0 22px #083e29a4,2px 6px 0 #845b3b8a,0 10px 18px #38673c4d!important;
}
body:has(.main-content .equation-area) .equation-area .eyebrow{color:#fff2c5!important;text-shadow:1px 2px #134b40!important}
body:has(.main-content .equation-area) .visual-board{gap:12px!important;margin-top:7px!important}
body:has(.main-content .equation-area) .count-card{
 background:linear-gradient(142deg,#fff8d7e8 5%,#f4e5beef 92%)!important;
 border:4px solid #af7e4e!important;border-radius:25px!important;
 box-shadow:inset 0 0 0 3px #fff8df,2px 6px 0 #816043a1,0 10px 20px #47734630!important;
 transform:none!important;
}
body:has(.main-content .equation-area) .count-card:nth-child(2){background:linear-gradient(142deg,#f2fbe5f2 0%,#d3e8bdf5 100%)!important}
body:has(.main-content .equation-area) .count-card .card-num{
 top:5px!important;left:9px!important;min-width:34px;height:34px;
 display:grid;place-items:center;color:#8c603d!important;font-size:22px!important;
 background:#fff6d5;border:2px solid #c79f64;border-radius:50%;
 box-shadow:0 2px #97775477;z-index:3;
}
body:has(.main-content .equation-area) .answer{
 background:linear-gradient(145deg,#fff3bc,#e9bf75)!important;
 border:4px solid #b2804f!important;border-radius:24px!important;
 box-shadow:inset 0 0 0 3px #fff9dd,2px 6px 0 #806346a1!important;
 color:#815131!important;transition:filter .15s,transform .15s!important;
}
body:has(.main-content .equation-area) .answer:nth-child(2){background:linear-gradient(145deg,#e3f4ca,#94cd80)!important;border-color:#7eac68!important}
body:has(.main-content .equation-area) .answer:nth-child(3){background:linear-gradient(145deg,#d9ecf7,#8dbde1)!important;border-color:#6699bd!important}
body:has(.main-content .equation-area) .answer:nth-child(4){background:linear-gradient(145deg,#ffe5e5,#e9a7b9)!important;border-color:#bf859a!important}
body:has(.main-content .equation-area) .answer:active{filter:brightness(1.08);transform:scale(.96) translateY(3px)!important}
body:has(.main-content .equation-area) .answer.wrong{background:#f5bec6!important;animation:wiggle .4s!important}
body:has(.main-content .equation-area) .result-visual{
 background:linear-gradient(#fff5d6ed,#e4f2cbee)!important;border:5px solid #a67d55!important;
 border-radius:26px!important;box-shadow:inset 0 0 0 2px #fffcdf,2px 5px #8b665f66!important;
}
body:has(.main-content .equation-area) .next-button,
body:has(.main-content:not(.intro-content)) :is(.zw-guide-start,.next-button,.big-button){
 background:linear-gradient(#f9e3a0,#f1bb63)!important;border:4px solid #aa784b!important;
 color:#6f4c31!important;border-radius:28px!important;box-shadow:inset 0 2px #fff7cd,2px 5px #92643a82!important;
}
/* Picture-first activities: picnic, feeding, baking and all round selectors. */
.extra-page .extra-scene,.kitchen-page .kitchen-scene{
 filter:drop-shadow(0 3px 3px #5c743d40);
}
.extra-page .picnic-basket-inner{
 background:linear-gradient(153deg,#fff1c7ed,#e1b879f5)!important;
 border:4px solid #a8794a!important;border-radius:24px!important;
 box-shadow:inset 0 0 0 3px #ffface,inset 0 4px #fff8dc!important;
}
.extra-page .picnic-basket-front{border-color:#95653f!important;box-shadow:inset 0 5px #f6cc9588,0 3px 3px #795d4869!important}
.extra-page .picnic-cloth{filter:saturate(1.14)}
.extra-page .feed-choice-grid :is(button,.feed-choice){filter:drop-shadow(0 3px 3px #6d693f50)}
.extra-page .feed-choice-grid :is(button,.feed-choice):active{transform:scale(.97)!important;filter:drop-shadow(0 1px 2px #77704c55)}
.extra-page .fruit-tray,.extra-page .food-picker,.extra-page .food-tray{
 background:linear-gradient(135deg,#fdf0c3df,#c7dfa5d9)!important;
 border:3px solid #ae814e!important;border-radius:25px!important;
 box-shadow:inset 0 2px #fff9dc,0 4px #90734e66!important;
}
.extra-page .fruit-piece,.extra-page .food-option,.extra-page .fruit-option,
.kitchen-page .ingredient-token,.kitchen-page .kitchen-round{
 filter:drop-shadow(0 2px 2px #795e3b5a)!important;
}
.kitchen-page .kitchen-round,.extra-page .feed-portrait{
 border:4px solid #d1a56d!important;border-radius:50%!important;
 box-shadow:0 0 0 2px #8d6246,0 4px #8c624a80!important;
}
.kitchen-page .kitchen-recipe-name{
 color:#754a2b!important;background:linear-gradient(#fff0b7,#dbad77)!important;
 border:2px solid #a37446!important;border-radius:12px!important;
 padding:4px 8px!important;text-shadow:0 1px #fff8d9!important;
 box-shadow:1px 3px #85644370!important;max-width:98%!important;
}
.kitchen-page .kitchen-recipe-button:focus-visible{outline:4px solid #ffde82;border-radius:22px}
.kitchen-page .kitchen-stage-card,.kitchen-page .kitchen-pan,.kitchen-page .kitchen-bowl{
 filter:drop-shadow(1px 4px 2px #766a4860);
}
/* Drawn connection board and crayons */
.connect-game .connect-board{
 background:linear-gradient(135deg,#fff5d3 10%,#f9e5ab 95%)!important;
 border:8px solid #b07b4c!important;border-radius:25px!important;
 box-shadow:inset 0 0 0 3px #fffcd9,inset 0 0 22px #ddab61aa,2px 6px 0 #855f41ac!important;
}
.connect-game .connect-colors{
 background:linear-gradient(135deg,#fff4d9ee,#e4eeceee)!important;
 border:3px solid #b58a5d!important;border-radius:21px!important;
 box-shadow:inset 0 2px #fff7df,0 4px #92744e73!important;
}
.connect-game .connect-crayon{background:linear-gradient(155deg,#fff8e4,var(--light))!important;border-color:#ae8b67!important;border-radius:13px!important}
.connect-game .connect-num{
 box-shadow:0 4px #80634575,inset 0 3px #fff8e5,0 0 0 2px #fff2d9!important;
}
/* Soap-bubble garden – bubbles remain truly translucent and must POP on touch */
.hunt-page .hunt-board{
 background:linear-gradient(155deg,#aee7f6da,#b9e4d2e9)!important;
 border:7px solid #ac814e!important;border-radius:28px!important;
 box-shadow:inset 0 0 0 3px #fffbd7,2px 6px #795e4088,0 9px 15px #53856a4c!important;
}
.hunt-page .hunt-number{box-shadow:inset -6px -7px 13px #6fb9d25e,inset 5px 6px 10px #ffffffd8,0 6px 8px #6489a174,0 0 0 2px #ffffff8f!important}
.hunt-page .hunt-prompt{background:linear-gradient(#fff4d2,#edc984)!important;border:3px solid #b88b59!important;border-radius:20px!important;box-shadow:1px 4px #8b684f83!important}
.hunt-page .hunt-progress>span{border-color:#d0a879!important}
/* Premium wood picture frame around all 30 illustrated maze worlds */
.family-maze-screen .family-maze-board{
 border-radius:27px!important;filter:drop-shadow(0 6px 4px #705d3f80)!important;
}
.family-maze-screen .family-maze-story{
 border:4px solid #b68555!important;border-radius:20px!important;
 box-shadow:inset 0 0 0 2px #fffbd8,2px 5px #8662429b!important;
}
.family-maze-screen .family-maze-heading h1,.hunt-page .hunt-title h1,.connect-game .connect-title h1,.drive-page .drive-heading h1{
 color:#6e4a2f!important;text-shadow:1px 2px #fff8de,0 0 6px #fff4d6b9!important;
}
/* Autoteppich is already an illustrated full city map: keep image and road snapping intact. */
.drive-photo-game #driveMap{border:6px solid #b78852!important;box-shadow:0 0 0 3px #ffecc2,0 6px 9px #866c4d77!important}
.drive-photo-game .drive-instruction{
 background:linear-gradient(130deg,#fff6d9,#f1e2b4)!important;
 border:3px solid #ae8353!important;border-radius:23px!important;
 box-shadow:inset 0 2px #fffbe5,1px 4px #99744d8c!important;
}
.drive-photo-game .drive-arrow{color:#a46f40!important}
.drive-photo-game .drive-again,.drive-photo-game .drive-next,
.connect-game .connect-secondary,.connect-game .connect-continue,
.family-maze-screen .family-maze-controls button{
 background:linear-gradient(#fff1c5,#e5b872)!important;
 border:3px solid #af814f!important;color:#77502f!important;
 border-radius:24px!important;box-shadow:inset 0 2px #fff9db,1px 4px #8662418c!important;
}
.drive-photo-game .drive-next,.connect-game .connect-continue{background:linear-gradient(#e0f2c0,#9cce82)!important;color:#50754c!important;border-color:#81a86b!important}
/* Parent coaching sheet: original book-paper colors, large controls and no plain white web-dialog. */
.zw-guide-overlay{background:#386b518a!important;backdrop-filter:blur(5px)!important;-webkit-backdrop-filter:blur(5px)!important}
.zw-guide-dialog{
 background:linear-gradient(150deg,#fff7d9,#ffedbd)!important;
 border:7px solid #ac7846!important;border-radius:30px!important;
 box-shadow:inset 0 0 0 3px #fffde8,0 13px 0 #71553b75,0 19px 24px #385d3d73!important;
}
.zw-guide-art{
 background:radial-gradient(circle,#fff8cf,#d2e8bb)!important;
 border:4px solid #dfb16e!important;box-shadow:0 3px #93704781!important;
}
.zw-guide-dialog h2{color:#8b5531!important;text-shadow:1px 2px #fff5db!important}
.zw-guide-dialog h3{color:#4b895b!important}
.zw-guide-dialog p{color:#664a36!important;font-weight:750!important}
.zw-guide-child{
 background:linear-gradient(#f7f8d7,#dfeebd)!important;
 border:3px solid #9cba73!important;border-radius:19px!important;color:#53804c!important;
}
.zw-guide-start{
 background:linear-gradient(#ffe5a1,#f1bd6d)!important;
 border:4px solid #a8784b!important;border-radius:28px!important;
 box-shadow:inset 0 2px #fff9dc,1px 5px #87613d88!important;
 color:#76502f!important;
}
.parent-panel{
 background:linear-gradient(#fff8df,#f3ddb0)!important;border:6px solid #aa7952!important;
 border-radius:28px!important;box-shadow:inset 0 0 0 3px #fff8d9,3px 7px #7c614ea3!important;
}
.parent-panel p{color:#684e39!important}.parent-panel h1{color:#7d5537!important}
.parent-panel :is(button,select){border-color:#b48751!important}
/* Keep the game readable on iPhone SE, Dynamic Island and rotated handsets. */
@media(max-width:360px){
 body:has(.main-content .equation-area) .count-card{border-width:3px!important}
 body:has(.main-content .equation-area) .answer{border-width:3px!important}
 .zw-guide-dialog{border-width:5px!important}
 .connect-game .connect-colors{border-width:2px!important}
}
@media(orientation:landscape) and (max-height:520px){
 body:has(.main-content:not(.intro-content)) .device{background-size:cover!important;background-position:center!important}
 body:has(.main-content .equation-area) .count-card{box-shadow:inset 0 0 0 2px #fff8df,1px 3px #81604380!important}
 .zw-guide-dialog{box-shadow:0 7px #78533b6b!important}
}
@media(prefers-reduced-motion:reduce){
 body:has(.main-content:not(.intro-content)) .main-content :is(.answer,.connect-num,.kitchen-round){transition:none!important}
}