/* ==========================================================
   CRITTERS · styles for critters.js
   ========================================================== */

/* ---------- Caterpillar progress bar ---------- */
.progress-wrap .progress-track{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)} /* keep for screen readers' sake, hide visually */
.cat-track{position:relative;height:40px;margin-top:.35rem;display:flex;align-items:flex-end;gap:2px;min-width:250px}
.cat-leaf{position:absolute;left:0;right:0;bottom:2px;height:8px;border-radius:8px;background:linear-gradient(180deg,transparent 40%,rgba(226,240,196,.85) 40% 58%,transparent 58%),repeating-linear-gradient(115deg,transparent 0 13px,rgba(70,110,40,.22) 13px 14px),linear-gradient(90deg,#8fbf5a,#6fa53f);box-shadow:inset 0 -2px 0 rgba(0,0,0,.12)}
.cat-leaf::after{content:"";position:absolute;right:-6px;top:-5px;width:18px;height:18px;border-radius:0 70% 0 70%;background:linear-gradient(135deg,transparent 46%,rgba(226,240,196,.8) 46% 54%,transparent 54%),#7fb04e;transform:rotate(10deg)}
.caterpillar{position:relative;display:flex;align-items:flex-end;padding-left:2px;margin-bottom:6px;animation:inch 1.8s ease-in-out infinite}
.cat-segs{display:flex;align-items:flex-end}
/* monarch caterpillar: each segment has yellow, black, white, black bands, a proleg underneath, and the tail carries the back pair of filaments */
.cat-segs b{position:relative;display:block;width:20px;height:20px;margin-right:-4px;border-radius:50%;background:radial-gradient(circle at 36% 26%,rgba(255,255,255,.5),rgba(255,255,255,0) 42%),radial-gradient(circle at 50% 125%,rgba(0,0,0,.4),rgba(0,0,0,0) 62%),linear-gradient(90deg,#f2cf3a 0 30%,#1f1d1a 30% 42%,#f6f2e2 42% 56%,#1f1d1a 56% 68%,#f2cf3a 68%);box-shadow:inset 0 -2px 0 rgba(0,0,0,.14);transform:translateY(calc((var(--h) - 78) * .3px))}
.cat-segs b::after{content:"";position:absolute;left:7px;bottom:-3px;width:6px;height:5px;border-radius:40% 40% 50% 50%;background:linear-gradient(#f4efdf 0 40%,#2a2a24 40%)}
.cat-segs b:first-child::before{content:"";position:absolute;left:4px;top:-8px;width:2px;height:10px;border-radius:2px;background:#1f1d1a;transform:rotate(-28deg);box-shadow:4px 1px 0 #1f1d1a}
.cat-segs b.new{animation:segPop .5s cubic-bezier(.2,1.6,.4,1)}
.cat-head{position:relative;width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 35% 26%,rgba(255,255,255,.35),rgba(255,255,255,0) 36%),radial-gradient(ellipse 80% 70% at 50% 105%,transparent 44%,#f6f2e2 45% 52%,transparent 53%),radial-gradient(ellipse 90% 80% at 50% 105%,transparent 60%,#f2cf3a 61% 72%,transparent 73%),radial-gradient(ellipse 100% 95% at 50% 105%,transparent 80%,#f2cf3a 81% 90%,transparent 91%),#1f1d1a;margin-left:0;z-index:1}
.cat-head::before,.cat-head::after{content:"";position:absolute;top:-10px;width:2px;height:12px;background:#1f1d1a;border-radius:2px}
.cat-head::before{left:7px;transform:rotate(-18deg)}
.cat-head::after{right:7px;transform:rotate(18deg)}
.cat-head i{position:absolute;right:5px;top:11px;width:3px;height:3px;border-radius:50%;background:#f6f2e2;box-shadow:-9px 0 0 #f6f2e2}
.cat-head i::before{content:"";position:absolute;left:-19px;bottom:-11px;width:14px;height:5px;background:radial-gradient(circle at 20% 50%,#1f1d1a 1.5px,transparent 2px),radial-gradient(circle at 55% 50%,#1f1d1a 1.5px,transparent 2px),radial-gradient(circle at 90% 50%,#1f1d1a 1.5px,transparent 2px)}
.cat-butterfly{position:absolute;left:0;bottom:6px;width:40px;height:36px;opacity:0;pointer-events:none}
.cat-track.done .caterpillar{opacity:0}
.cat-track.done .cat-butterfly{opacity:1;left:40px;animation:flutterIdle 2.4s ease-in-out infinite}
.cat-track.emerge .cat-butterfly{animation:emerge 2.2s ease-out forwards,flutterIdle 2.4s ease-in-out 2.2s infinite}
.cat-butterfly .bf-wing{transform-origin:32px 28px;animation:wingFlap .35s ease-in-out infinite alternate}
.cat-note{display:block;margin-top:.15rem;font:500 .82rem/1.2 var(--read);color:#5f6a45;text-transform:none;letter-spacing:0}
@keyframes inch{0%,100%{transform:translateX(0)}50%{transform:translateX(4px) scaleX(.97)}}
@keyframes segPop{from{transform:scale(.2)}to{transform:scale(1)}}
@keyframes wingFlap{from{transform:scaleX(1)}to{transform:scaleX(.45)}}
@keyframes flutterIdle{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-6px) rotate(4deg)}}
@keyframes emerge{0%{transform:scale(.2);opacity:0}20%{transform:scale(1.2);opacity:1}60%{transform:translate(60px,-60px) rotate(12deg)}100%{transform:translate(0,0)}}

/* ---------- Growing plant (leaf stamps) ---------- */
.grow-plant{display:inline-block;width:52px;height:70px;flex:none}
.grow-plant svg{width:100%;height:100%;overflow:visible}
.grow-plant [class^="p-"]{transform-box:fill-box;transform-origin:50% 100%;transition:transform .5s cubic-bezier(.2,1.5,.4,1),opacity .4s}
.grow-plant .p-stem{stroke-dasharray:50;stroke-dashoffset:50;transition:stroke-dashoffset .8s ease}
.grow-plant .p-l1,.grow-plant .p-l2,.grow-plant .p-l3,.grow-plant .p-bud,.grow-plant .p-flower{transform:scale(0);opacity:0}
.grow-plant[data-stage="1"] .p-seed{transform:scale(1.2)}
.grow-plant[data-stage="2"] .p-stem{stroke-dashoffset:34}
.grow-plant[data-stage="2"] .p-l1{transform:scale(.8);opacity:1}
.grow-plant[data-stage="3"] .p-stem{stroke-dashoffset:18}
.grow-plant[data-stage="3"] :is(.p-l1,.p-l2){transform:scale(1);opacity:1}
.grow-plant[data-stage="4"] .p-stem,.grow-plant[data-stage="5"] .p-stem{stroke-dashoffset:0}
.grow-plant[data-stage="4"] :is(.p-l1,.p-l2,.p-l3,.p-bud){transform:scale(1);opacity:1}
.grow-plant[data-stage="5"] :is(.p-l1,.p-l2,.p-l3){transform:scale(1);opacity:1}
.grow-plant[data-stage="5"] .p-flower{transform:scale(1);opacity:1;animation:bloomSway 3s ease-in-out infinite}
.grow-plant.bump{animation:plantBump .6s ease}
.plant-stage{display:block;font:500 .78rem/1.2 var(--read);color:var(--leaf);margin-top:.15rem}
@keyframes plantBump{30%{transform:scale(1.15) rotate(-4deg)}60%{transform:scale(.97) rotate(3deg)}}
@keyframes bloomSway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}

/* ---------- Ladybug back-to-top ---------- */
.ladybug-top{position:fixed;right:clamp(12px,3vw,28px);bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:45;width:62px;height:62px;padding:4px;border:0;border-radius:50%;background:#fffaf0;box-shadow:0 6px 18px rgba(40,50,30,.25);cursor:pointer;opacity:0;transform:translateY(20px) scale(.8);pointer-events:none;transition:opacity .3s,transform .3s}
.ladybug-top.show{opacity:1;transform:none;pointer-events:auto}
.ladybug-top svg{width:100%;height:100%;overflow:visible}
.ladybug-top:hover svg{animation:lbWiggle .5s ease}
.ladybug-top .lb-wing{transform-box:fill-box;transition:transform .3s}
.ladybug-top .lb-hind{opacity:0;transform-box:fill-box;transform-origin:50% 0;transform:scaleX(.3);transition:opacity .25s,transform .3s}
.ladybug-top.fly .lb-hind{opacity:1;transform:none}
.ladybug-top .lb-left{transform-origin:100% 0}
.ladybug-top .lb-right{transform-origin:0 0}
.ladybug-top.fly .lb-left{transform:rotate(28deg)}
.ladybug-top.fly .lb-right{transform:rotate(-28deg)}
.ladybug-top.fly{animation:lbFly 1.4s ease-in forwards}
.lb-tip{position:absolute;right:70px;top:50%;transform:translateY(-50%);white-space:nowrap;background:var(--forest);color:#fff8e6;border-radius:999px;padding:.35rem .7rem;font:600 .78rem/1 var(--display);opacity:0;pointer-events:none;transition:opacity .2s}
.ladybug-top:hover .lb-tip,.ladybug-top:focus-visible .lb-tip{opacity:1}
@keyframes lbWiggle{25%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}}
@keyframes lbFly{0%{transform:none}25%{transform:translateY(-10px) rotate(-8deg)}100%{transform:translateY(-110vh) rotate(12deg);opacity:0}}

/* ---------- Critter Spotter ---------- */
.critter{position:absolute;z-index:4;width:54px;height:46px;padding:0;border:0;background:none;cursor:pointer;filter:drop-shadow(0 3px 3px rgba(40,40,20,.25));transition:transform .2s}
.critter svg{width:100%;height:100%;overflow:visible}
.critter:hover{transform:scale(1.15) rotate(-6deg)}
.critter:focus-visible{outline:3px solid var(--clay-yellow);outline-offset:4px;border-radius:12px}
.critter.found::after{content:"✓";position:absolute;right:-4px;top:-6px;width:18px;height:18px;border-radius:50%;background:var(--leaf);color:#fff;font:700 11px/18px var(--display);text-align:center}
.critter.boing{animation:boing .7s cubic-bezier(.2,1.6,.4,1)}
.pos-bl{left:clamp(6px,2vw,24px);bottom:10px}
.pos-br{right:clamp(10px,2vw,30px);bottom:-14px}
.pos-tr{right:clamp(8px,3vw,40px);top:14px}
.critter-bee{animation:beeHover 3s ease-in-out infinite}
.critter-bee .bee-wings{transform-origin:32px 22px;animation:buzz .08s linear infinite alternate}
.critter-butterfly .bf-wing{transform-origin:32px 28px;animation:wingFlap .5s ease-in-out infinite alternate}
.critter-snail{animation:snailSlide 14s ease-in-out infinite alternate}
.critter-worm .worm-body{transform-origin:14px 46px;animation:wormWiggle 1.6s ease-in-out infinite alternate}
.critter-caterpillar .cat-body{animation:inch 1.6s ease-in-out infinite}
.pos-march{bottom:6px;left:0;width:48px;height:30px;animation:march 38s linear infinite}
.pos-march .ant-legs{transform-origin:0 26px;animation:antLegs .25s linear infinite alternate}
.pos-march .ant-legs-far{animation-delay:-.25s}
.critter-ant:hover{animation-play-state:paused}
@keyframes boing{0%{transform:scale(1)}30%{transform:scale(1.35) rotate(-10deg)}60%{transform:scale(.9) rotate(6deg)}100%{transform:scale(1)}}
@keyframes buzz{from{transform:scaleY(1)}to{transform:scaleY(.6)}}
@keyframes beeHover{0%,100%{transform:translate(0,0)}25%{transform:translate(-10px,-6px)}50%{transform:translate(-4px,6px)}75%{transform:translate(6px,-3px)}}
@keyframes snailSlide{from{transform:translateX(0)}to{transform:translateX(60px)}}
@keyframes wormWiggle{from{transform:translateY(0)}to{transform:translateY(-3px) skewX(-4deg)}}
@keyframes march{from{left:-60px}to{left:calc(100% + 10px)}}
@keyframes antLegs{from{transform:skewX(-8deg)}to{transform:skewX(8deg)}}
.spotter-chip{position:fixed;left:clamp(12px,3vw,28px);bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:45;display:flex;align-items:center;gap:.45rem;padding:.55rem .9rem;border-radius:999px;background:#fffaf0;border:2px solid var(--leaf);box-shadow:0 6px 18px rgba(40,50,30,.2);font:600 .9rem/1 var(--display);color:var(--forest);opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .3s,transform .3s}
.spotter-chip.show{opacity:1;transform:none}
.spotter-chip.all{background:#f2f6e3}
.spotter-chip.flash{animation:chipFlash .7s ease}
@keyframes chipFlash{40%{transform:scale(1.12)}}
.spotter-hint{margin:.7rem auto 0!important;max-width:44ch;font-size:.95rem!important;color:#4b5a40}

/* ---------- Firefly on the hint button ---------- */
#hintButton{position:relative;gap:.5rem}
.firefly{display:inline-block;width:24px;height:24px;margin:-4px 0}
.firefly svg{width:100%;height:100%;overflow:visible}
.firefly .ff-glow{animation:glow 1.8s ease-in-out infinite}
#hintButton:hover .firefly{animation:ffFloat .9s ease-in-out infinite alternate}
@keyframes glow{0%,100%{opacity:.15}50%{opacity:.8}}
@keyframes ffFloat{from{transform:translateY(0)}to{transform:translateY(-4px) rotate(8deg)}}

/* ---------- Cleanup pass: lighter repeats ---------- */
.pack-link{display:inline-block;margin-top:.5rem;color:var(--wood);font:600 .9rem/1.3 var(--display);text-decoration:none}
.pack-link:hover{text-decoration:underline}
.patch-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:.6rem;max-width:760px}
.patch-product{padding:.5rem;background:transparent;border:0;box-shadow:none}
.patch-product img{width:72px;height:72px}
.patch-product h3{font-size:.78rem;line-height:1.2}
.meet-copy .yt-inline{margin-top:.6rem}
.meet-photo img{object-position:center 35%}

/* ---------- Night-time footer (nightscape.js) ---------- */
.night-footer{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(440px,46vw,540px);padding-bottom:clamp(110px,12vw,140px)!important;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:clamp(2.5rem,6vw,4rem)!important;background:#0f1d3a}
.nightscape{position:absolute;inset:0;z-index:-1;display:block;pointer-events:none}
.night-footer>*:not(canvas){position:relative;z-index:1}
.night-footer img{background:rgba(255,248,230,.94);padding:.4rem .6rem;border-radius:14px;box-shadow:0 0 30px rgba(255,244,200,.25)}
.night-footer p{color:#f4ecd6;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.night-footer .footer-links a{color:#fff4c8}
.night-footer .goodnight{font:600 1.25rem/1.2 var(--display);color:#fff4c8;margin-top:.2rem}

/* ---------- Sun / Moon switch ---------- */
.sky-toggle{position:relative;flex:none;width:68px;height:34px;padding:0;border:2px solid #cdb88a;border-radius:999px;cursor:pointer;background:linear-gradient(180deg,#bfe2ec,#e6f2e8);transition:background .5s,border-color .5s;overflow:hidden}
.sky-toggle[aria-checked="true"]{background:linear-gradient(180deg,#0f1d3a,#23405a);border-color:#3a557a}
.sky-icon{position:absolute;top:50%;width:20px;height:20px;transform:translateY(-50%);transition:opacity .4s,transform .5s}
.sky-icon svg{width:100%;height:100%;display:block}
.sky-sun{left:7px}
.sky-moon{right:7px}
.sky-knob{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fffaf0;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.sky-toggle[aria-checked="false"] .sky-knob{transform:translateX(34px)}
.sky-toggle[aria-checked="true"] .sky-knob{transform:translateX(0);background:#23405a;box-shadow:inset -5px -2px 0 #fff4c8,0 2px 6px rgba(0,0,0,.4)}
.sky-toggle[aria-checked="false"] .sky-sun{transform:translateY(-50%) rotate(0)}
.sky-toggle[aria-checked="true"] .sky-sun{opacity:.35;transform:translateY(-50%) rotate(-90deg)}
.sky-toggle[aria-checked="false"] .sky-moon{opacity:.45}
.sky-toggle:focus-visible{outline:3px solid var(--clay-yellow);outline-offset:3px}
.find-section .night-layer{position:absolute;inset:0;z-index:0;display:block;pointer-events:none;opacity:0;transition:opacity .8s ease}
.find-section .landscape{transition:opacity .8s ease}
.find-section.is-night .night-layer{opacity:1}
.find-section.is-night .landscape{opacity:0}
.find-section.is-night{background:#0f1d3a}
.find-section.is-night .find-heading h1,.find-section.is-night .find-heading p{color:#fff4c8;text-shadow:0 2px 12px rgba(5,10,30,.9)}
.find-section.is-night .find-heading .eyebrow{color:var(--clay-yellow);text-shadow:0 1px 8px rgba(5,10,30,1)}
.find-section.is-night .spotter-hint{color:#e8e2cf!important}
.find-section.is-night .scene{box-shadow:0 22px 60px rgba(0,0,10,.55),0 0 0 6px rgba(255,244,200,.25)}
@media(max-width:540px){.sky-toggle{width:58px;height:30px}.sky-knob{width:20px;height:20px}.sky-toggle[aria-checked="false"] .sky-knob{transform:translateX(28px)}.sky-icon{width:17px;height:17px}.sky-sun{left:6px}.sky-moon{right:6px}}
@media(prefers-reduced-motion:reduce){.sky-knob,.sky-icon,.find-section .night-layer,.find-section .landscape{transition:none}}

/* ---------- Underwater world behind the outdoor hunts (oceanscape.js) ---------- */
.under-sea{isolation:isolate;background:#1f6f8b!important;background-image:none!important}
.oceanscape{position:absolute;inset:0;z-index:-1;display:block;pointer-events:none}
.under-sea::before{content:"";position:absolute;left:0;right:0;top:-18px;height:20px;z-index:1;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 20'%3E%3Cpath d='M0 20V10 Q15 0 30 10 T60 10 T90 10 T120 10 V20z' fill='%238fd3dc'/%3E%3C/svg%3E") repeat-x bottom/120px 20px;pointer-events:none}
.under-sea .outside-heading h2{color:#fffaf0;text-shadow:0 2px 14px rgba(10,50,70,.6)}
.under-sea .outside-heading p:not(.eyebrow),.under-sea .outside-note{color:#eaf6f7;text-shadow:0 1px 8px rgba(10,50,70,.7)}
.under-sea .outside-heading .eyebrow{color:#fff1b8}
.under-sea .nb-teaser a{color:#fff1b8;border-bottom-color:rgba(255,241,184,.5)}
.under-sea .mission-card{box-shadow:0 6px 0 rgba(10,60,80,.35),0 10px 24px rgba(10,50,70,.25)}
.under-sea .stamp-counter{box-shadow:4px 5px 0 rgba(10,60,80,.35)}

@media(max-width:850px){
  .ladybug-top{bottom:calc(var(--tabbar-h) + 14px + env(safe-area-inset-bottom,0px));width:54px;height:54px}
  .spotter-chip{bottom:calc(var(--tabbar-h) + 18px + env(safe-area-inset-bottom,0px));font-size:.82rem}
  .lb-tip{display:none}
  .cat-track{min-width:0}
}
@media(prefers-reduced-motion:reduce){
  .caterpillar,.cat-butterfly,.cat-butterfly .bf-wing,.critter,.critter *,.firefly *,.grow-plant *{animation:none!important}
  .pos-march{left:40%}
}
.outside-section{overflow-x:clip}
.find-section.is-night .scene>img{filter:brightness(.84) saturate(.88)}
@media(max-width:850px){
  .toast{width:max-content;max-width:calc(100% - 32px);bottom:calc(var(--tabbar-h) + 84px + env(safe-area-inset-bottom,0px));border-radius:14px;line-height:1.4;text-align:center}
}
.field-guide-section{position:relative;overflow-x:clip}

.under-sea{padding-bottom:clamp(8rem,12vw,10rem)!important}
.under-sea .outside-note{position:relative;z-index:1}

/* ---------- Play & learn scenes on episode cards (adventures.js) ---------- */
.ep-play{margin:.7rem 0 .2rem;padding:.7rem .75rem .8rem;background:#fffdf6;border:2px solid #e0cfa6;border-radius:16px;box-shadow:0 4px 0 #e7d9b6}
.ep-play-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.45rem}
.ep-play-title{font:600 .78rem/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--rust)}
.ep-play-chip{font:600 .9rem/1 var(--display);color:#fff8e6;background:var(--forest);border-radius:999px;padding:.35rem .7rem;white-space:nowrap}
.ep-play-stage{position:relative;border-radius:12px;overflow:hidden;cursor:pointer;background:#e6efe0}
.ep-play-stage canvas{display:block;width:100%;height:170px}
.ep-meter{position:absolute;left:8px;right:8px;bottom:6px;height:5px;border-radius:5px;background:rgba(255,255,255,.55);overflow:hidden}
.ep-meter i{display:block;height:100%;width:0;background:var(--clay-orange);border-radius:5px;transition:width .4s}
.ep-play-wind .ep-meter i{background:linear-gradient(90deg,#8fbf5a,#eea52c,#e0612c,#7a3a8a)}
.ep-play-insects .ep-meter i{background:var(--clay-lavender)}
.ep-play-sun .ep-meter i{background:linear-gradient(90deg,#f0a060,#f7c24a,#f0a060)}
.ep-play-fact{margin:.55rem 0 .5rem!important;min-height:2.8em;font-size:.98rem;line-height:1.4;color:var(--ink)}
.ep-play-controls{display:flex}
.ep-play-btn{flex:1;min-height:46px;border:0;border-radius:12px;background:var(--leaf);color:#fff;font:600 1.02rem/1 var(--display);cursor:pointer;box-shadow:0 4px 0 #3f6a2a;transition:transform .12s,box-shadow .12s}
.ep-play-btn:hover{transform:translateY(-1px)}
.ep-play-btn:active{transform:translateY(3px);box-shadow:0 1px 0 #3f6a2a}
.ep-play-wind .ep-play-btn{background:#4f9fc4;box-shadow:0 4px 0 #2f6f8f}
.ep-play-wind .ep-play-btn:active{box-shadow:0 1px 0 #2f6f8f}
.ep-play-insects .ep-play-btn{background:var(--clay-lavender);box-shadow:0 4px 0 #6a5cb0}
.ep-play-insects .ep-play-btn:active{box-shadow:0 1px 0 #6a5cb0}
.sun-slider{flex:1;display:flex;align-items:center;gap:.6rem;font-size:1.3rem}
.sun-slider input{flex:1;accent-color:#eea52c;height:30px;cursor:pointer}
.episode-item .ep-play{margin-top:.9rem}
#playBox .ep-play{margin:0}
#playBox .ep-play-stage canvas{height:220px}

/* ---------- More landscapes (scenes.js) ---------- */
.has-scene{position:relative;isolation:isolate;overflow:hidden}
.scene-canvas{position:absolute;inset:0;z-index:-1;display:block;pointer-events:none}
.has-scene>*:not(.scene-canvas):not(.critter):not(.scene-chip-label){position:relative}
.scene-chip-label{position:absolute!important;left:50%;transform:translateX(-50%);bottom:12px;text-align:center;z-index:2;max-width:min(460px,calc(100% - 24px));padding:.45rem .85rem;border-radius:999px;background:rgba(255,250,236,.92);box-shadow:0 3px 10px rgba(40,50,30,.15);font:600 .86rem/1.3 var(--display);color:var(--forest)}
.scene-rain{padding-bottom:clamp(12.5rem,17vw,14.5rem)!important;background:#c3c9cc!important}
.scene-rain .shorts-heading h2,.scene-rain .shorts-heading p,.scene-rain .shorts-more{text-shadow:0 0 10px rgba(246,240,222,.9)}
.scene-seasons{background:#dfe8ef!important;background-image:none!important;padding-bottom:clamp(5.5rem,9vw,7.5rem)!important}
.scene-seasons .scene-chip-label{bottom:16px}
.scene-forest{background:#e8f0dc!important;padding-bottom:clamp(5rem,8vw,7rem)!important}
.scene-forest .guide-card,.scene-forest .printable-row,.scene-forest .notebook-banner{box-shadow:0 6px 16px rgba(60,70,40,.15)}
@media(max-width:600px){.scene-chip-label{left:12px;right:12px;transform:none;border-radius:14px;font-size:.8rem}}

/* ---------- Ant Town ---------- */
.ant-section{padding:clamp(3rem,6vw,5rem) clamp(1rem,5vw,5rem);background:#f3e8cf;border-top:6px solid #8cc152}
.ant-section>*{max-width:1100px;margin-inline:auto}
.ant-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.2rem 2rem;flex-wrap:wrap;margin-bottom:1rem}
.ant-head h2{font-size:clamp(1.9rem,4vw,3rem);line-height:1.05;margin:.2rem 0 .6rem;color:var(--forest)}
.ant-head p:not(.eyebrow){max-width:56ch;margin:0}
.ant-progress{display:grid;gap:.4rem;min-width:240px}
.ant-pct{font:600 1.05rem/1.2 var(--display);color:var(--wood)}
.ant-bar{height:14px;border-radius:10px;background:#e4d3aa;overflow:hidden;box-shadow:inset 0 2px 3px rgba(0,0,0,.12)}
.ant-bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(45deg,#8a6a3e 0 8px,#a67c4a 8px 16px);border-radius:10px;transition:width 1s}
.ant-stage{position:relative;border-radius:20px;overflow:hidden;border:4px solid #6b4a2e;box-shadow:0 12px 30px rgba(60,40,20,.25),inset 0 0 0 4px rgba(255,255,255,.15)}
.ant-stage canvas{display:block;width:100%;height:clamp(320px,42vw,470px)}
.ant-foot{display:grid;gap:.8rem;margin-top:1rem}
.ant-fact{margin:0;min-height:1.5em;font-size:1.05rem}
.ant-fact b{color:var(--wood)}
.ant-rooms{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.ant-rooms li{padding:.4rem .8rem;border-radius:999px;border:2px dashed #cdb88a;color:#9a8a6a;font:600 .88rem/1 var(--display);background:#fbf4e2}
.ant-rooms li span{opacity:.35}
.ant-rooms li.done{border-style:solid;border-color:#6b4a2e;color:#fff8e6;background:#6b4a2e}
.ant-rooms li.done span{opacity:1}
.has-scene>.scene-canvas{max-width:none!important;margin:0!important}
.outside-note a{color:#fff1b8;font-weight:700;white-space:nowrap}
.cert-link{display:inline-block;margin-top:.6rem;color:var(--forest);font-weight:700}

/* ---------- Placement audit: lighter floating widgets on phones ---------- */
@media(max-width:850px){
  .spotter-chip{font-size:0;gap:.3rem;padding:.4rem .6rem}
  .spotter-chip span,.spotter-chip b{font-size:.82rem}
  .ladybug-top{width:46px;height:46px;padding:3px}
  .scene-chip-label{left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:calc(100% - 150px);font-size:.76rem;border-radius:14px}
}

/* the earthworm pokes up over the top of the grown-ups contact card instead of sitting on the email address */
#contact{position:relative}
#contact .critter-worm.pos-bl{left:auto;right:22px;bottom:auto;top:-30px}
