/* Wereld: rugzak (Peuteropvang) */
body:has(.d-world-rugzak) { --t-orange: #FFE2CC; --t-yellow: #FFF0C4; --t-blue: #DCE6F5; --t-green: #E2EED6; }
body:has(.d-world-rugzak) .d-section.has-vlak-groen-background-color,
body:has(.d-world-rugzak) .d-section.has-vlak-blauw-background-color { background: #FFF4D8 !important; }
.d-world-rugzak { background: radial-gradient(circle at 84% 88%, #FFE2B8 0, transparent 38%), linear-gradient(180deg, #FFF0C6, #FFFAEC) !important; }
.d-world-rugzak .d-play-title mark { color: #D2581C !important; }
body:has(.d-world-rugzak) main .d-section { position: relative; }
body:has(.d-world-rugzak) main .d-section + .d-section::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 24'%3E%3Cpath d='M0 2 H 18 V 8 L 9 22 L 0 8 Z' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M0 8 L 9 22 L 18 8 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M5.5 16.5 L 9 22 L 12.5 16.5 Z' fill='%231E2B45'/%3E%3Cpath d='M18 2 H 36 V 8 L 27 22 L 18 8 Z' fill='%238EAAD5' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M18 8 L 27 22 L 36 8 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M23.5 16.5 L 27 22 L 30.5 16.5 Z' fill='%231E2B45'/%3E%3Cpath d='M36 2 H 54 V 8 L 45 22 L 36 8 Z' fill='%23729A47' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M36 8 L 45 22 L 54 8 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M41.5 16.5 L 45 22 L 48.5 16.5 Z' fill='%231E2B45'/%3E%3Cpath d='M54 2 H 72 V 8 L 63 22 L 54 8 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M54 8 L 63 22 L 72 8 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M59.5 16.5 L 63 22 L 66.5 16.5 Z' fill='%231E2B45'/%3E%3C/svg%3E") left center / 72px 24px repeat-x; z-index: 2; pointer-events: none; }

.d-scene-rugzak { position: absolute !important; inset: 0; height: auto !important; }
.d-rugzak-hoofd { width: 200px; height: 230px; right: 5%; bottom: 14px; z-index: 2; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 230'%3E %3Cpath d='M70 60 C 70 30 130 30 130 60' stroke='%231E2B45' stroke-width='12' fill='none' stroke-linecap='round'/%3E %3Cpath d='M70 60 C 70 30 130 30 130 60' stroke='%23C95A1E' stroke-width='6' fill='none' stroke-linecap='round'/%3E %3Cg transform='rotate(-14 78 70)'%3E %3Crect x='71' y='28' width='14' height='42' fill='%23FFC94D' stroke='%231E2B45' stroke-width='2.5'/%3E %3Cpath d='M71 28 L 78 12 L 85 28 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M75.4 18 L 78 12 L 80.6 18 Z' fill='%231E2B45'/%3E%3C/g%3E%3Cg transform='rotate(2 100 66)'%3E %3Crect x='93' y='14' width='14' height='52' fill='%238EAAD5' stroke='%231E2B45' stroke-width='2.5'/%3E %3Cpath d='M93 14 L 100 -2 L 107 14 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M97.4 4 L 100 -2 L 102.6 4 Z' fill='%231E2B45'/%3E%3C/g%3E%3Cg transform='rotate(16 122 70)'%3E %3Crect x='115' y='32' width='14' height='38' fill='%23729A47' stroke='%231E2B45' stroke-width='2.5'/%3E %3Cpath d='M115 32 L 122 16 L 129 32 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M119.4 22 L 122 16 L 124.6 22 Z' fill='%231E2B45'/%3E%3C/g%3E %3Cpath d='M36 92 C 36 66 56 56 100 56 C 144 56 164 66 164 92 V 196 C 164 214 152 222 134 222 H 66 C 48 222 36 214 36 196 Z' fill='%23F07A2B' stroke='%231E2B45' stroke-width='3'/%3E %3Cpath d='M36 96 C 60 110 140 110 164 96' stroke='%231E2B45' stroke-width='3' fill='none'/%3E %3Cpath d='M36 96 C 60 110 140 110 164 96 V 118 C 140 132 60 132 36 118 Z' fill='%23D9662A'/%3E %3Cpath d='M58 150 H 142 V 196 C 142 206 136 210 128 210 H 72 C 64 210 58 206 58 196 Z' fill='%23EC8B48' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E %3Cpath d='M58 162 H 142' stroke='%231E2B45' stroke-width='2.5'/%3E %3Crect x='92' y='156' width='16' height='14' rx='4' fill='%23FFC94D' stroke='%231E2B45' stroke-width='2.5'/%3E %3Ccircle cx='80' cy='132' r='9' fill='%23fff'/%3E%3Ccircle cx='120' cy='132' r='9' fill='%23fff'/%3E %3Ccircle cx='82' cy='134' r='5' fill='%231E2B45'/%3E%3Ccircle cx='122' cy='134' r='5' fill='%231E2B45'/%3E%3Ccircle cx='83.6' cy='132.4' r='1.7' fill='%23fff'/%3E%3Ccircle cx='123.6' cy='132.4' r='1.7' fill='%23fff'/%3E %3Cpath d='M92 144 Q 101 151 110 144' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E %3Ccircle cx='68' cy='146' r='6' fill='%23F49AB4' opacity='.7'/%3E%3Ccircle cx='134' cy='146' r='6' fill='%23F49AB4' opacity='.7'/%3E %3Cpath d='M36 120 C 22 122 18 140 24 150' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='24' cy='154' r='7' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2.5'/%3E %3Cpath d='M164 120 C 178 112 186 98 182 88' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='181' cy='84' r='7' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2.5'/%3E %3C/svg%3E") !important; transform-origin: 50% 100%; }
.d-rugzak-schaduw { width: 140px; height: 20px; right: calc(5% + 30px); bottom: 6px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 20'%3E%3Cellipse cx='70' cy='10' rx='66' ry='8' fill='%231E2B45' opacity='.14'/%3E%3C/svg%3E") !important; }
.d-rugzak-bel { width: 80px; height: 86px; right: calc(5% + 230px); bottom: 190px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 96'%3E %3Cpath d='M45 0 V 8' stroke='%231E2B45' stroke-width='3'/%3E %3Crect x='38' y='6' width='14' height='10' rx='4' fill='%23EC8B48' stroke='%231E2B45' stroke-width='2.5'/%3E %3Cpath d='M45 14 C 22 14 18 36 18 54 C 18 66 12 70 8 74 H 82 C 78 70 72 66 72 54 C 72 36 68 14 45 14 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E %3Cpath d='M30 30 C 26 40 26 50 27 58' stroke='%23FFE59A' stroke-width='5' fill='none' stroke-linecap='round'/%3E %3Crect x='4' y='72' width='82' height='10' rx='5' fill='%23EC8B48' stroke='%231E2B45' stroke-width='3'/%3E %3Ccircle cx='45' cy='88' r='7' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2.5'/%3E %3C/svg%3E") !important; transform-origin: 50% 4px; }
.d-rugzak-beugel { width: 110px; height: 40px; right: calc(5% + 264px); bottom: 250px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 40'%3E%3Crect x='2' y='4' width='14' height='34' rx='4' fill='%23EC8B48' stroke='%231E2B45' stroke-width='2.5'/%3E%3Cpath d='M16 14 H 104' stroke='%238A5A3B' stroke-width='8' stroke-linecap='round'/%3E%3Ccircle cx='9' cy='12' r='2' fill='%231E2B45'/%3E%3Ccircle cx='9' cy='30' r='2' fill='%231E2B45'/%3E%3C/svg%3E") !important; }
.d-rugzak-geluid { width: 46px; height: 46px; right: calc(5% + 196px); bottom: 240px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cg stroke='%23F07A2B' stroke-width='4' fill='none' stroke-linecap='round'%3E%3Cpath d='M10 20 C 20 22 26 14 28 6'/%3E%3Cpath d='M14 34 C 28 34 38 26 42 14'/%3E%3Cpath d='M22 50 C 38 50 50 40 54 26'/%3E%3C/g%3E%3C/svg%3E") !important; opacity: 0; }
.d-rugzak-potlood { width: 24px; height: 72px; left: 47%; top: 14%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 90'%3E%3Cg transform='rotate(0 15 88)'%3E %3Crect x='8' y='28' width='14' height='60' fill='%23F49AB4' stroke='%231E2B45' stroke-width='2.5'/%3E %3Cpath d='M8 28 L 15 12 L 22 28 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M12.4 18 L 15 12 L 17.6 18 Z' fill='%231E2B45'/%3E%3C/g%3E%3C/svg%3E") !important; }
.d-peek-rugzak::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 100'%3E %3Crect x='11' y='34' width='28' height='70' fill='%238EAAD5' stroke='%231E2B45' stroke-width='3'/%3E %3Cpath d='M11 34 L 25 4 L 39 34 Z' fill='%23F6D3A1' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E %3Cpath d='M19 17 L 25 4 L 31 17 Z' fill='%231E2B45'/%3E %3Ccircle cx='20' cy='52' r='3.5' fill='%231E2B45'/%3E%3Ccircle cx='30' cy='52' r='3.5' fill='%231E2B45'/%3E%3Ccircle cx='21.2' cy='50.8' r='1.2' fill='%23fff'/%3E%3Ccircle cx='31.2' cy='50.8' r='1.2' fill='%23fff'/%3E %3Cpath d='M21 60 Q 25 64 29 60' stroke='%231E2B45' stroke-width='2.2' fill='none' stroke-linecap='round'/%3E %3Ccircle cx='16' cy='59' r='3' fill='%23F49AB4' opacity='.7'/%3E%3Ccircle cx='34' cy='59' r='3' fill='%23F49AB4' opacity='.7'/%3E %3C/svg%3E"); width: 44px; height: 88px; top: -62px; left: 14%; }

/* Animaties: rugzak huppelt (met schaduw), schoolbel rinkelt af en toe, potlood dwarrelt */
.d-rugzak-hoofd { animation: d-rugzak-hup 1.6s cubic-bezier(.4,0,.6,1) infinite; }
@keyframes d-rugzak-hup { 0%, 100% { transform: scale(1.06, .92); } 15% { transform: scale(.96, 1.05) translateY(-6px); } 45% { transform: translateY(-46px) rotate(-4deg); } 75% { transform: translateY(-4px) rotate(2deg); } 88% { transform: scale(1.06, .92); } }
.d-rugzak-schaduw { animation: d-rugzak-schaduw 1.6s cubic-bezier(.4,0,.6,1) infinite; }
@keyframes d-rugzak-schaduw { 45% { transform: scale(.65); opacity: .5; } }
.d-rugzak-bel { animation: d-rugzak-rinkel 4s ease-in-out 1s infinite; }
@keyframes d-rugzak-rinkel { 0%, 40%, 100% { transform: rotate(0); } 5% { transform: rotate(18deg); } 10% { transform: rotate(-16deg); } 15% { transform: rotate(14deg); } 20% { transform: rotate(-10deg); } 25% { transform: rotate(7deg); } 30% { transform: rotate(-4deg); } }
.d-rugzak-geluid { animation: d-rugzak-geluid 4s ease-out 1s infinite; }
@keyframes d-rugzak-geluid { 0%, 35%, 100% { opacity: 0; transform: scale(.6); } 6%, 25% { opacity: 1; transform: scale(1); } }
.d-rugzak-potlood { animation: d-rugzak-dwarrel 7s ease-in-out infinite; }
@keyframes d-rugzak-dwarrel { 0%, 100% { transform: rotate(-20deg) translateY(0); } 50% { transform: rotate(25deg) translateY(18px); } }
@media (prefers-reduced-motion: reduce) { .d-scene-rugzak > * { animation: none !important; } }

@media (max-width: 781px) {
	.d-scene-rugzak { transform: scale(.55); transform-origin: right bottom; }
	.d-rugzak-potlood { display: none; }
	.d-rugzak-geluid { right: calc(5% + 170px); }
	.d-peek-rugzak::before { width: 36px; height: 72px; top: -50px; }
}