/* Zaehlwiese V49 – Unified illustrated premium storyworld.
   Reuses the exact colors, warm wood, flowers and soft sunlight of the approved home artwork.
   All selectors exclude the full-image home to preserve its precise touch mapping. */
:root{
 --zw-wood:#c98b4d;--zw-wood-dark:#96633b;--zw-cream:#fff2cc;
 --zw-ink:#634829;--zw-grass:#67b25e;--zw-grass-dark:#428b51;
 --zw-sky:#9bdded;--zw-gold:#f2c667;--zw-shadow:#62492d50;
}
body:not(:has(.intro-content)){background:#a1dbb0!important}
body:not(:has(.intro-content)) .device{
 background-image:url('/gameworld-v49.webp')!important;
 background-size:100% 100%!important;
 background-repeat:no-repeat!important;
 background-color:#91ce8e!important;
}
body:not(:has(.intro-content)) .main-content{background:transparent!important}
body:not(:has(.intro-content)) .app-header{
 position:relative!important;z-index:20!important;
 background:transparent!important;box-shadow:none!important;
 border:0!important;min-height:0!important;
}
body:not(:has(.intro-content)) .app-header .zw-go-home{
 display:flex!important;align-items:center!important;justify-content:center!important;
 gap:4px!important;border:3px solid #fff1c6!important;
 border-radius:22px!important;background:linear-gradient(155deg,#fae1a2,#dfa45f)!important;
 box-shadow:inset 0 0 0 2px #a87146,0 5px 0 #76543b73,1px 6px 8px #423a2550!important;
 color:#674726!important;text-shadow:0 1px #fff8d5!important;
 font:900 clamp(14px,4.2vw,18px)/1.1 "Chalkboard SE","Marker Felt",system-ui,sans-serif!important;
 touch-action:manipulation!important;white-space:nowrap!important;min-height:48px!important;
 padding:7px 13px!important;
}
body:not(:has(.intro-content)) .app-header .zw-go-home svg{filter:drop-shadow(0 1px #fff9dc)}
body:not(:has(.intro-content)) h1,
body:not(:has(.intro-content)) h2{
 font-family:"Chalkboard SE","Marker Felt",system-ui,sans-serif!important;
 font-weight:900!important;
}
body:not(:has(.intro-content)) .main-content h1{
 color:#7a4e26!important;
 text-shadow:0 2px #fff9db,1px 3px #503d295e!important;
}
/* One family of illustrated chapter headers: rich wood-and-honey instead of pale boards. */
body:not(:has(.intro-content)) :is(.wood-heading,.extra-sign,.kitchen-title,.connect-title,.hunt-title,.drive-heading h1,.family-maze-heading h1){
 color:#7d4928!important;
 border:3px solid #f9e2a3!important;
 border-radius:16px!important;
 background:linear-gradient(178deg,#fff2c8 0%,#f4d49a 56%,#e4ad6f 100%)!important;
 box-shadow:inset 0 0 0 2px #b37a49,0 4px 0 #8d6845b0,0 7px 9px #514b3547!important;
 text-shadow:1px 2px 0 #fff7db!important;
 padding:5px 12px!important;
 width:fit-content!important;max-width:96%!important;
 min-height:40px!important;
 margin:2px auto 5px!important;
 line-height:1.1!important;
}
body:not(:has(.intro-content)) .progress>.wood-heading{width:min(100%,345px)!important;text-align:center}
body:not(:has(.intro-content)) :is(.extra-top,.kitchen-title,.connect-title,.hunt-title,.drive-heading,.family-maze-heading){position:relative!important}
body:not(:has(.intro-content)) :is(.extra-sign,.kitchen-title,.connect-title,.hunt-title,.drive-heading h1,.family-maze-heading h1){
 font-size:clamp(20px,6.3vw,29px)!important;
}
/* Glowing, colored chapter medallions use approved home icon artwork. */
body:not(:has(.intro-content)) .progress>.wood-heading::before,
body:not(:has(.intro-content)) .extra-sign::before,
body:not(:has(.intro-content)) .kitchen-title::before,
body:not(:has(.intro-content)) .connect-title::before,
body:not(:has(.intro-content)) .hunt-title::before,
body:not(:has(.intro-content)) .drive-heading h1::before,
body:not(:has(.intro-content)) .family-maze-heading h1::before{
 content:"";display:inline-block;vertical-align:middle;position:relative;
 width:36px;height:36px;border-radius:50%;
 margin:-3px 9px -3px -4px;
 background-color:#e5bb78;background-size:cover;background-position:center;
 border:2px solid #fff4d3;
 box-shadow:0 0 0 2px #a57447,1px 2px 2px #694c3057;
}
body:has(.extra-page.picnic-page) .extra-sign::before{background-image:url('/chapter-picnic-v49.webp')}
body:has(.feeding-page) .extra-sign::before{background-image:url('/chapter-feeding-v49.webp')}
body:has(.kitchen-page) .kitchen-title::before{background-image:url('/chapter-cooking-v49.webp')}
body:has(.connect-game) .connect-title::before{background-image:url('/chapter-connect-v49.webp')}
body:has(.hunt-page) .hunt-title::before{background-image:url('/chapter-hunt-v49.webp')}
body:has(.drive-photo-game) .drive-heading h1::before{background-image:url('/chapter-drive-v49.webp')}
body:has(.family-maze-screen) .family-maze-heading h1::before{background-image:url('/chapter-maze-v49.webp')}
body:has(.progress) .progress>.wood-heading::before{background-image:url('/chapter-animals-v49.webp')}
body:has(.progress) .progress>.wood-heading:first-child{background-color:#fbe7b8}
/* Golden seeds for all progress tracks. */
body:not(:has(.intro-content)) :is(.progress-dot,.hunt-progress-dot,.extra-progress>i,.family-maze-progress i){
 border-color:#fff3cf!important;
 box-shadow:0 1px 2px #78623b8c!important;
}
body:not(:has(.intro-content)) :is(.progress-dot.current,.hunt-progress-dot.is-next){
 background:#f6d167!important;box-shadow:0 0 0 3px #fff5c0,0 0 8px #f3dc7b!important
}
body:not(:has(.intro-content)) .progress-track{padding:4px!important;border-radius:20px!important;background:#fff6d67a!important}
body:not(:has(.intro-content)) :is(.counting-message,.kitchen-subtitle,.extra-subtitle,.kitchen-hint,.extra-selection-footer,.family-maze-instruction){
 color:#4d7e40!important;text-shadow:1px 1px #fff9d7,0 0 5px #fff5d0!important;
 font:900 clamp(15px,4.4vw,20px)/1.2 "Chalkboard SE","Marker Felt",system-ui,sans-serif!important;
}
/* Hand and animal counting: premium illustrated yellow-teal learning board. */
body:has(.equation-area) .equation-area{
 position:relative!important;
 background:linear-gradient(150deg,#f5dfa2,#dca160)!important;
 border:5px solid #fff0bd!important;
 box-shadow:inset 0 0 0 3px #98623c,0 5px 0 #75553da8,0 8px 14px #5f553f4b!important;
 border-radius:22px!important;max-width:min(100%,410px)!important;
 margin:6px auto 12px!important;padding:7px!important;
}
body:has(.equation-area) .equation{
 background:radial-gradient(ellipse at 30% 20%,#3c8d77,#246c5c 80%)!important;
 border:3px solid #a5d9c4!important;
 border-radius:14px!important;
 box-shadow:inset 0 1px 15px #144a3f7e!important;
}
body:has(.equation-area) .visual-board{gap:7px!important;padding:5px 7px!important}
body:has(.equation-area) .count-card{
 background:radial-gradient(ellipse at 50% 30%,#fff7d26b,#ffedb500 78%)!important;
 border-radius:26px!important;
 min-width:0!important;filter:drop-shadow(1px 3px 2px #7b6e3948)!important;
}
body:has(.equation-area) .card-num{
 background:linear-gradient(160deg,#fff3d2,#f7db9a)!important;
 border:2px solid #d1a467!important;
 box-shadow:1px 3px 2px #7a63463c!important;
 color:#8d5d39!important;
}
body:has(.equation-area) .answer-wrap{border-radius:24px!important;background:transparent!important}
body:has(.equation-area) .answers{gap:clamp(5px,1.8vw,11px)!important}
body:has(.equation-area) .answer{
 border:4px solid #fff4cc!important;
 box-shadow:0 0 0 2px #946b49,0 5px 0 #805a4c91!important;
 border-radius:26px!important;
 background-blend-mode:soft-light!important;
 min-width:0!important;
 transition:transform .16s cubic-bezier(.2,.8,.2,1),filter .16s!important;
}
body:has(.equation-area) .answer:active{transform:translateY(3px) scale(.96)!important}
body:has(.equation-area) .friend-peek-pair{pointer-events:none!important}
/* Fruit picnic, pet care: color, depth, warm illustrated recipe panels. */
.extra-page .extra-scene{
 border-radius:30px!important;
 background:radial-gradient(ellipse at 50% 80%,#f4f7b26b,#b5e3bb33 78%,transparent)!important;
}
.extra-page .extra-bubble,.extra-page .feed-bubble{
 border:4px solid #fff2c9!important;
 border-radius:24px!important;
 box-shadow:0 0 0 2px #b38053,0 5px 0 #8f6a4590!important;
 background:linear-gradient(150deg,#fff7dc,#f5dba3)!important;
 color:#805837!important;
}
.picnic-page .picnic-basket{filter:drop-shadow(0 8px 3px #5f774759)!important}
.picnic-page .picnic-basket-front{
 background:repeating-linear-gradient(0deg,#d9a161,#d9a161 13px,#bd844f 14px,#e4b779 28px)!important;
 border:4px solid #95603c!important;
 box-shadow:inset 0 5px 8px #fff0c180,0 6px 0 #7d5e4384!important;
}
.extra-page :is(.extra-food-tray,.feed-food-tray){
 background:linear-gradient(180deg,#fff1c8c7,#e9d3a4c7)!important;
 border:4px solid #fff5d0!important;
 box-shadow:0 0 0 2px #ae7a4e,0 5px 4px #614b3647!important;
 border-radius:24px!important;
}
.extra-page :is(.extra-food-choice,.extra-animal-round,.extra-next,.extra-back-choice){
 border-color:#fff3d1!important;
 box-shadow:0 0 0 2px #a57549,1px 4px 3px #6e55475e!important;
}
.extra-page .extra-food-choice:active{filter:brightness(1.15) saturate(1.3)!important;transform:translateY(2px) scale(.96)!important}
.feed-select .feed-choice-grid{gap:clamp(10px,3vw,22px)!important}
.feed-select .extra-animal-choice{filter:drop-shadow(0 5px 2px #6a664751)!important}
.feed-select .extra-animal-round{
 border:5px solid #ffefc7!important;
 background:radial-gradient(circle at 30% 28%,#fff7de,#c1e6c3)!important;
}
.feed-select .extra-animal-name{
 color:#694e34!important;text-shadow:1px 2px #fff3cd!important;
 font-size:clamp(16px,4.9vw,21px)!important
}
.feed-main-pet{filter:drop-shadow(1px 6px 3px #6b78488c)!important}
.feeding-page .feed-pet-drop{background:radial-gradient(ellipse at center,#fff6d14d,transparent 75%)!important}
/* Backstube: individually illustrated recipe tiles and warm baking station. */
.kitchen-page .kitchen-recipe-grid{gap:clamp(13px,4vw,24px)!important}
.kitchen-page .kitchen-recipe-button{
 background:linear-gradient(155deg,#fff7d9cb,#f6d8a0c2)!important;
 border:4px solid #fff2c8!important;
 box-shadow:0 0 0 2px #9e7044,0 5px 0 #786040a6!important;
 border-radius:25px!important;
 padding:10px 3px!important;
}
.kitchen-page .kitchen-recipe-button:active{transform:translateY(3px) scale(.97)!important}
.kitchen-page :is(.kitchen-circle,.kitchen-scene,.kitchen-bowl-zone){
 filter:drop-shadow(1px 5px 3px #85634555);
}
.kitchen-page :is(.kitchen-task,.kitchen-ingredients,.kitchen-action-prompt,.kitchen-recipe-name){
 color:#775538!important;text-shadow:1px 2px #fff8d9!important;
}
.kitchen-page :is(.kitchen-task,.kitchen-action-prompt){
 border:3px solid #fff2c8!important;border-radius:24px!important;
 background:linear-gradient(#fff4d2,#f5dba5)!important;
 box-shadow:0 3px #9c744c78!important;
}
/* Favorite-color drawing playground. No rule tying number color to the selected crayon. */
.connect-game .connect-board{
 background:radial-gradient(ellipse at 40% 30%,#fff9e3,#f9e7b7 94%)!important;
 border:8px solid #fff4cc!important;
 border-radius:32px!important;
 box-shadow:0 0 0 3px #ab7747,inset 0 0 0 2px #edd3a0,0 7px 0 #785a4191!important;
}
.connect-game .connect-num{
 box-shadow:inset 0 3px 5px #fff9eccc,0 4px 0 #735b4874!important;
 border:4px solid #fff5da!important;
}
.connect-game .connect-crayons{
 padding:6px!important;
 background:linear-gradient(#fff4d4e8,#eccea0ea)!important;
 border:4px solid #fff4cc!important;
 border-radius:24px!important;
 box-shadow:0 0 0 2px #a4774b,0 5px 2px #765a4080!important;
}
.connect-game .connect-crayon{
 border:3px solid #fff8d9!important;
 border-radius:12px!important;
 box-shadow:0 0 0 1px #a37a59,0 3px 1px #8d684b70!important;
}
.connect-game .connect-crayon[aria-pressed=true]{
 box-shadow:0 0 0 3px var(--ink),0 3px #5e553772!important;
 transform:translateY(-3px) scale(1.05)!important;
}
.connect-game .connect-secondary,.connect-game .connect-continue{
 border:4px solid #fff1cb!important;
 background:linear-gradient(150deg,#f6e0b4,#e7b77f)!important;
 box-shadow:0 0 0 2px #9b7247,0 4px 0 #916a4b79!important;
 border-radius:22px!important;
}
/* Soap bubbles float over a vibrant pond in the same meadow world. */
.hunt-page .hunt-board{
 background:radial-gradient(ellipse at 50% 15%,#b6eaf5,#74cfd0 68%,#78baac 100%)!important;
 border:8px solid #fff3c8!important;
 border-radius:31px!important;
 box-shadow:0 0 0 3px #a97b51,inset 0 5px 16px #fff5e5aa,0 6px 1px #74533a80!important;
}
.hunt-page .hunt-current-number{
 border:4px solid #fff2cf!important;background:linear-gradient(155deg,#ffedc0,#f3cf8f)!important;
 border-radius:24px!important;box-shadow:0 0 0 2px #ae8454,0 5px #906e4c77!important;
 color:#8f5999!important;
}
.hunt-page .hunt-number{
 border:3px solid #ffffffeb!important;
 box-shadow:inset -6px -7px 11px #7bbdd058,inset 5px 6px 12px #ffffff9e,0 5px 12px #376e8d80,0 0 0 1px #ffffff80!important;
}
/* Autoteppich: retain its approved detailed artwork, improve header/control framing. */
.drive-photo-game .drive-instruction{
 background:linear-gradient(160deg,#fff9e2,#e3eebf)!important;
 border:4px solid #fff1c9!important;
 box-shadow:0 0 0 2px #ad7c50,0 4px 0 #78583d85!important;
 border-radius:25px!important;
}
.drive-photo-game #driveMap{
 border:7px solid #fff2c7!important;
 box-shadow:0 0 0 3px #a77649,0 6px 10px #4d715254!important;
}
.drive-photo-game :is(.drive-again,.drive-next){
 border:4px solid #fff2cd!important;
 background:linear-gradient(155deg,#f2d9ab,#e3b579)!important;
 box-shadow:0 0 0 2px #a77b50,0 5px 0 #956b4b80!important;
}
.drive-photo-game .drive-next{
 background:linear-gradient(#d8efa6,#83c777)!important;
}
/* Thirty maze adventures in bright wood-and-meadow picturebook. */
.family-maze-screen .family-maze-story{
 border:5px solid #fff4d7!important;
 box-shadow:0 0 0 2px #ad774c,0 4px 0 #7e5d427c!important;
 border-radius:26px!important;
}
.family-maze-screen .family-maze-board{
 border-radius:32px!important;
 border:7px solid #ffefc7!important;
 box-shadow:0 0 0 3px #af7845,0 8px 0 #835b4086,0 10px 16px #463b2d3b!important;
 overflow:hidden!important;
}
.family-maze-screen .family-maze-svg{
 filter:saturate(1.24)!important;
}
.family-maze-screen .family-maze-controls button,
.family-maze-screen .family-maze-victory button{
 background:linear-gradient(150deg,#fff1c8,#deb67e)!important;
 border:4px solid #fff4cf!important;
 box-shadow:0 0 0 2px #a97b4e,0 4px 1px #7e61427d!important;
 border-radius:22px!important;
 min-height:45px!important;
}
.family-maze-screen .family-maze-victory{
 border:6px solid #ffefc0!important;
 background:linear-gradient(#fff8df,#f4d6a5)!important;
 box-shadow:0 0 0 3px #b67f50,0 8px 12px #7d5c475f!important;
}
/* Parent guide: visually part of the same premium children's-book. */
.zw-guide-overlay{background:#31673c8f!important;backdrop-filter:blur(7px)!important}
.zw-guide-dialog{
 border:8px solid #fff1c8!important;
 border-radius:35px!important;
 background:linear-gradient(160deg,#fff9df,#f9daa9)!important;
 box-shadow:0 0 0 4px #b37c45,0 12px 20px #384c2f84!important;
 color:#6d4d2d!important;
}
.zw-guide-art{
 border:4px solid #fff4d4!important;
 box-shadow:0 0 0 3px #b88a55,0 3px 2px #7a69475a!important;
 background:radial-gradient(#d4efa9,#7fc576)!important;
 width:113px!important;height:113px!important;
}
.zw-guide-dialog h2{color:#81512c!important;text-shadow:1px 2px #fff9d9!important}
.zw-guide-dialog h3{color:#4c8a4a!important}
.zw-guide-child{
 color:#4e7b44!important;border:3px solid #e8d69e!important;
 border-radius:21px!important;background:#e7f3ce!important;
}
.zw-guide-start{
 min-height:64px!important;
 border:4px solid #ffefc2!important;
 box-shadow:0 0 0 2px #4e965b,0 6px 0 #467e4f!important;
 background:linear-gradient(160deg,#dff3a9,#7bcc77)!important;
 font-weight:900!important;color:#35613f!important;
}
/* All result and replay panels use the same gold-rimmed storybook controls. */
body:not(:has(.intro-content)) :is(.next-button,.secondary-button,.big-button,.extra-next,.kitchen-play-again,.hunt-next){
 border:4px solid #fff1c6!important;
 border-radius:25px!important;
 box-shadow:0 0 0 2px #a8784a,0 5px 2px #735c3f78!important;
 text-shadow:1px 1px #fff8d9!important;
 touch-action:manipulation!important;
}
body:not(:has(.intro-content)) :is(button,.answer,.connect-num):focus-visible{
 outline:4px solid #f3d15c!important;outline-offset:3px!important;
}
/* Small mobile devices: keep the playable area unblocked and allow scrolling. */
@media(max-height:760px) and (orientation:portrait){
 body:not(:has(.intro-content)) :is(.wood-heading,.extra-sign,.kitchen-title,.connect-title,.hunt-title,.drive-heading h1,.family-maze-heading h1){min-height:33px!important;padding:3px 8px!important;font-size:clamp(18px,5.4vw,23px)!important}
 body:not(:has(.intro-content)) :is(.wood-heading,.extra-sign,.kitchen-title,.connect-title,.hunt-title,.drive-heading h1,.family-maze-heading h1)::before{width:25px!important;height:25px!important}
 .zw-guide-art{width:75px!important;height:75px!important}
 .connect-game .connect-board,.hunt-page .hunt-board,.family-maze-screen .family-maze-board{border-width:5px!important}
}
@media(orientation:landscape) and (max-height:530px){
 body:not(:has(.intro-content)) .device{background-image:url('/gameworld-v49.webp')!important;background-size:100% 100%!important}
 body:not(:has(.intro-content)) :is(.wood-heading,.extra-sign,.kitchen-title,.connect-title,.hunt-title,.drive-heading h1,.family-maze-heading h1){min-height:30px!important;padding:1px 5px!important;font-size:18px!important}
 body:not(:has(.intro-content)) :is(.wood-heading,.extra-sign,.kitchen-title,.connect-title,.hunt-title,.drive-heading h1,.family-maze-heading h1)::before{width:24px;height:24px}
}

/* Final art-direction fixes after mobile screenshots. */
.feed-select .extra-animal-round{
 border-radius:50%!important;
 background-image:radial-gradient(circle at 35% 28%,#fff2c9,#b4dfb0)!important;
 overflow:hidden!important;
 box-shadow:inset 0 0 0 3px #b7834d,0 5px 3px #684b3470!important;
}
.feed-select .extra-animal-choice:nth-child(even) .extra-animal-round{
 background-image:radial-gradient(circle at 35% 28%,#fff4d5,#ecbfac)!important;
}
body:not(:has(.intro-content)) :is(.connect-title,.hunt-title,.family-maze-heading h1){
 display:flex!important;flex-direction:row!important;align-items:center!important;
 justify-content:center!important;white-space:normal!important;gap:5px!important;
 padding:4px 8px!important;line-height:1.04!important;
 text-align:center!important;
}
body:not(:has(.intro-content)) :is(.connect-title,.hunt-title,.family-maze-heading h1)::before{
 flex-shrink:0!important;width:29px!important;height:29px!important;
 margin:0 5px 0 0!important;
}
body:not(:has(.intro-content)) .connect-title{font-size:clamp(20px,5.3vw,25px)!important}
body:not(:has(.intro-content)) .family-maze-heading h1{font-size:clamp(20px,5.3vw,25px)!important}
body:not(:has(.intro-content)) .extra-top .extra-sign{white-space:nowrap!important;max-width:100%!important}
body:not(:has(.intro-content)) .extra-page .extra-mascot{
 filter:drop-shadow(0 4px 2px #50693a4f)!important;
}
body:not(:has(.intro-content)) .family-maze-screen .family-maze-svg image{
 image-rendering:auto!important;
}