.day-night-screen{--night-wash:#16224aa3;--night-ink:#2c3a63;--moonlight:#fff1b8;--day-cream:#fbf1cf;--muted:#5d6f66}.day-night-forest__night{z-index:1;opacity:0;background:var(--night-wash);pointer-events:none;transition:opacity .6s;position:absolute;inset:0}.day-night-forest__night>svg{width:100%;height:55%;position:absolute;inset:0 0 45%}.day-night-forest[data-time=night] .day-night-forest__night{opacity:1}.day-night-forest[data-complete=true] .day-night-forest__night{opacity:1;right:50%}.day-night-forest[data-complete=true]:after{z-index:2;content:"";background:#ffffffd9;width:4px;position:absolute;top:0;bottom:0;left:calc(50% - 2px)}.day-night-forest__sky{z-index:2;top:calc(max(12px, var(--screen-safe-top,env(safe-area-inset-top))) + 62px);width:46px;height:46px;position:absolute}.day-night-forest__sky>svg{width:100%;height:100%}.day-night-forest__sky--night{left:18px}.day-night-forest__sky--day{right:18px}.day-night-flower{z-index:2;aspect-ratio:1;pointer-events:none;width:clamp(40px,13%,72px);transition:filter .6s;position:absolute;translate:-50% -50%}.day-night-flower>svg{width:100%;height:100%;display:block}.day-night-flower--1{top:80.9%;left:64.6%}.day-night-flower--2{width:clamp(46px,15%,84px);top:82.6%;left:76.9%}.day-night-flower--3{top:80%;left:89.7%}.day-night-forest[data-time=night]:not([data-complete=true]) .day-night-flower{filter:brightness(.6)saturate(.5)}.day-night-resident{z-index:3;aspect-ratio:1;pointer-events:none;width:clamp(56px,19%,100px);position:absolute;translate:-50% -50%}.day-night-resident>svg{width:100%;height:100%;transition:filter .6s,opacity .6s;display:block}.day-night-resident--bat-night{width:clamp(54px,18%,96px);top:27%;left:47%}.day-night-resident--bee-day{width:clamp(46px,15%,80px);top:75.1%;left:76.9%}.day-night-resident--butterfly-day{width:clamp(50px,16%,88px);top:62.9%;left:57.4%}.day-night-resident[data-awake=false]>svg{filter:saturate(.35)brightness(.7);opacity:.85}.day-night-resident--bat-night[data-awake=false]>svg{rotate:180deg}.day-night-forest[data-time=night] .day-night-resident[data-awake=true]>svg,.day-night-forest[data-complete=true] :is(.day-night-resident--owl-night,.day-night-resident--bat-night)>svg{filter:drop-shadow(0 0 6px #fff1b88c)}.day-night-resident[data-arrived=true]{animation:.62s cubic-bezier(.3,1.5,.5,1) both habitat-hop-home}.day-night-resident[data-missed=true]{animation:.3s ease-out both habitat-pop}.day-night-resident__check{color:#fff;background:var(--habitat-canopy);border:2px solid #fff;border-radius:50%;place-items:center;width:24px;height:24px;font-size:14px;font-weight:800;display:grid;position:absolute;top:0;right:0}.day-night-resident__sleep{color:#3a4a3f;font:800 18px/1 var(--habitat-display);text-shadow:0 1px 2px #00000040;position:absolute;top:-12px;right:-14px}.day-night-resident__sleep>span:first-child{vertical-align:6px;font-size:14px}.day-night-resident__sleep>span:last-child{vertical-align:12px;font-size:11px}.day-night-forest[data-time=night] .day-night-resident__sleep{color:var(--moonlight)}.day-night-resident__thanks{border:2px solid var(--habitat-ink);width:max-content;max-width:200px;color:var(--habitat-ink);box-shadow:0 4px 0 color-mix(in srgb, var(--habitat-ink) 18%, transparent);background:#fff;border-radius:16px;padding:7px 12px;font-size:17px;font-weight:800;line-height:1.35;animation:.26s ease-out .24s both habitat-pop;position:absolute;bottom:92%;left:70%}.day-night-resident--bat-night .day-night-resident__thanks{top:96%;bottom:auto;left:50%;translate:-50%}:is(.day-night-resident--bee-day,.day-night-resident--butterfly-day) .day-night-resident__thanks{left:auto;right:62%}.day-night-sky{z-index:7;top:calc(max(12px, var(--screen-safe-top,env(safe-area-inset-top))) + 58px);width:92px;height:92px;box-shadow:0 5px 0 color-mix(in srgb, var(--habitat-ink) 20%, transparent);cursor:pointer;border:3px solid #fffffff2;border-radius:50%;place-items:center;padding:0;transition:box-shadow .2s,scale .2s,border-color .2s;display:grid;position:absolute}.day-night-sky:disabled{cursor:default;opacity:1}.day-night-sky--night{background:#2c3a63eb;left:18px}.day-night-sky--day{background:#fff8d6eb;right:18px}.day-night-sky>svg{width:64%;height:64%}.day-night-sky__label{font:800 17px/1.3 var(--habitat-display);white-space:nowrap;box-shadow:0 3px 0 color-mix(in srgb, var(--habitat-ink) 15%, transparent);border:2px solid;border-radius:999px;padding:3px 12px;display:none;position:absolute;top:calc(100% + 8px);left:50%;translate:-50%}.day-night-sky--night .day-night-sky__label{border-color:var(--moonlight);color:var(--moonlight);background:var(--night-ink)}.day-night-sky--day .day-night-sky__label{color:var(--habitat-ink);background:var(--day-cream);border-color:#e8a92e}.day-night-sky:is([data-dragging=true],[data-hinted=true],:focus-visible) .day-night-sky__label{display:block}.day-night-sky[data-dragging=true]:not([data-drop=true]){border-style:dashed}.day-night-sky[data-drop=true]{border-color:var(--habitat-sun);box-shadow:0 0 0 8px color-mix(in srgb, var(--habitat-sun) 45%, transparent), 0 0 30px color-mix(in srgb, var(--habitat-sun) 80%, transparent);scale:1.08}.day-night-sky[data-hinted=true]{border-color:var(--habitat-sun);animation:1.4s ease-in-out infinite habitat-look-here}.day-night-sky[data-missed=true]{border-color:var(--habitat-miss);animation:.48s ease-in-out both habitat-miss-shake}.day-night-sky__check{color:#fff;background:var(--habitat-canopy);border:2px solid #fff;border-radius:50%;place-items:center;width:26px;height:26px;font-size:15px;font-weight:800;display:grid;position:absolute;top:-4px;right:-4px}.day-night-practice-note{top:calc(max(12px, var(--screen-safe-top,env(safe-area-inset-top))) + 64px);gap:3px;width:min(158px,100% - 236px);padding:9px 40px 9px 12px}.day-night-practice-note>strong{font-size:18px}.day-night-practice-note>strong>svg:first-child{width:30px;height:30px}.day-night-practice-note .habitat-practice-question{width:30px;height:30px;font-size:18px;top:14px;right:8px}.day-night-practice-note__time{border-radius:8px;align-items:center;gap:4px;width:fit-content;padding:1px 8px;font-size:16px;font-weight:750;display:inline-flex}.day-night-practice-note__time[data-time=night]{color:var(--moonlight);background:var(--night-ink)}.day-night-practice-note__time[data-time=day]{background:var(--day-cream)}.day-night-practice-note__time[data-time=unknown]{color:#8a7a5a;padding-inline:0}.day-night-sky-picture{width:70px;height:70px}.day-night-done-sheet h2:focus{outline:none}.day-night-done-sheet__lead{color:var(--muted);margin:-4px 0 2px;font-size:17px;line-height:1.45}.day-night-done-sheet__lead[data-evidence=true]{color:var(--habitat-ink);font-weight:700}.day-night-done-columns{grid-template-columns:1fr 1fr;gap:10px;display:grid}.day-night-done-column{background:#dfe3f1;border:1px solid #b9c0dd;border-radius:16px;min-width:0;padding:10px 10px 6px}.day-night-done-column[data-time=day]{background:var(--day-cream);border-color:#ecd48a}.day-night-done-column>h3{font:800 18px/1.3 var(--habitat-display);align-items:center;gap:5px;margin:0 0 4px;display:flex}.day-night-done-column>ul{gap:4px;margin:0;padding:0;list-style:none;display:grid}.day-night-done-column li>:is(div,button){box-sizing:border-box;width:100%;min-height:48px;color:inherit;font:inherit;text-align:left;background:0 0;border:0;align-items:center;gap:8px;padding:4px 0;display:flex}.day-night-done-column li>button{border:2px solid color-mix(in srgb, var(--habitat-ink) 18%, transparent);cursor:pointer;background:#fff9;border-radius:12px;padding:4px 6px}.day-night-done-column li>button[aria-pressed=true]{border-color:var(--habitat-canopy);background:#dcebd1}.day-night-done-column li>button[data-hinted=true]{box-shadow:0 0 0 3px color-mix(in srgb, var(--habitat-sun) 70%, transparent)}.day-night-done-column li svg{flex:none;width:42px;height:42px}.day-night-done-column li strong{font-size:17px;line-height:1.3;display:block}.day-night-done-column li span>span{color:var(--muted);font-size:14px;line-height:1.35;display:block}.day-night-done-sheet>.habitat-explore-confirm:disabled{cursor:default;background:#a9bdb2;box-shadow:0 4px #8aa396}@media (width>=700px){.day-night-sky{width:104px;height:104px}.day-night-sky--night{left:calc(20% - 52px)}.day-night-sky--day{right:calc(20% - 52px)}.day-night-practice-note{width:180px}.day-night-forest__sky--night{left:calc(20% - 23px)}.day-night-forest__sky--day{right:calc(20% - 23px)}}@media (width<=370px){.day-night-sky{width:78px;height:78px}.day-night-sky--night{left:12px}.day-night-sky--day{right:12px}.day-night-practice-note{top:calc(max(12px, var(--screen-safe-top,env(safe-area-inset-top))) + 150px);width:170px}}@media (height<=700px) and (orientation:portrait){.day-night-sky{width:80px;height:80px}.day-night-done-sheet__lead{font-size:15px}.day-night-done-column li>:is(div,button){min-height:44px;padding-block:2px}.day-night-done-column li svg{width:36px;height:36px}}@media (orientation:landscape) and (height<=540px){.day-night-sky{top:calc(max(12px, var(--screen-safe-top,env(safe-area-inset-top))) + 56px);width:74px;height:74px}.day-night-practice-note{top:12px}.day-night-done-sheet__lead{display:none}.day-night-done-column{padding:6px 8px 4px}.day-night-done-column>h3{font-size:16px}.day-night-done-column li>:is(div,button){min-height:44px;padding-block:1px}.day-night-done-column li svg{width:32px;height:32px}.day-night-done-column li span>span{display:none}}.observation-record{color:#293f31;text-align:center;background:#fcf9e6;border:1px solid #a5b791;border-radius:16px;flex-direction:column;align-items:center;gap:8px;padding:12px;display:flex}.observation-record>svg{flex-shrink:0;width:100px;height:100px}.observation-record>strong{font-size:22px}.observation-record>p{margin:0;font-size:18px;line-height:1.4}.observation-record__time{color:#383d25;background:#ebca72;border-radius:8px;align-self:flex-start;padding:4px 10px;font-size:18px;font-weight:700}.observation-record[data-record-time=night] .observation-record__time{color:#fff1b7;background:#214654}.observation-record.is-compact{gap:4px;padding:8px}.observation-record.is-compact>svg{width:clamp(48px,23cqh,90px);height:clamp(48px,23cqh,90px)}.observation-record.is-compact>strong{font-size:18px}.day-night-record-pages{gap:12px;display:grid}.day-night-result-records{gap:8px;max-width:100%;display:flex;overflow-x:auto}.day-night-result-records .observation-record{flex:1;min-width:115px}.day-night-result-records .observation-record>svg{width:64px;height:64px}.day-night-result .play-result-art{flex:none;height:90px;min-height:0;max-height:90px}.day-night-result .play-result-art svg{width:90px;height:90px;max-height:100%}.day-night-result .play-result-notes{flex:1;min-height:0;max-height:none}.day-night-result>.text-button{flex-shrink:0;min-height:48px}@media (height<=660px) and (orientation:portrait){.day-night-result .play-result-art{height:48px;max-height:48px}.day-night-result .play-result-art svg{width:48px;height:48px}.day-night-result h1{font-size:23px}.day-night-result{gap:6px}.day-night-result .play-result-art{display:none}.day-night-result .play-replay-preview{gap:6px;padding:8px}.day-night-result .play-replay-preview>span{display:none}.day-night-result .play-replay-preview strong{font-size:18px;line-height:1.3}.day-night-result .play-replay-preview .primary-button{min-height:48px;padding:8px;font-size:20px}.day-night-result .play-result-actions a{min-height:48px;padding:8px;font-size:16px}.day-night-result>.text-button{font-size:18px}}.reduce-motion .observation-record{transition:none!important;animation:none!important}.day-night-art{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.day-night-screen[data-day-night-age]{--response-time:.45s}.day-night-screen[data-day-night-age=toddler]{--response-time:.55s}.day-night-screen[data-day-night-age=school]{--response-time:.35s}.day-night-painted{pointer-events:none;background-repeat:no-repeat;background-size:200% 100%;transition:opacity .8s;position:absolute;inset:0}.day-night-painted--day{background-position:0}.day-night-painted--night{opacity:0;background-position:100%}.day-night-forest[data-time=night] .day-night-painted--night{opacity:1}.day-night-forest[data-complete=true] .day-night-painted--night{opacity:1;clip-path:inset(0 50% 0 0)}.day-night-screen .habitat-animal-slots>li>.day-night-art{opacity:.4;filter:grayscale(.9);width:32px;height:32px}.day-night-screen .habitat-animal-slots>li:is([aria-current=step],[data-recorded=true])>.day-night-art{opacity:1;filter:none}.day-night-screen .habitat-stage__animal{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:160px;height:150px}.day-night-screen[data-day-night-age=toddler] .habitat-stage__animal{width:180px;height:170px}.day-night-screen .habitat-stage__animal:active>.day-night-art{scale:.98}.day-night-screen .habitat-stage__animal:is([data-dragging=true],[data-returning=true],[data-placed=true]){visibility:hidden}.day-night-screen .habitat-stage__queue>.day-night-art{width:40px;height:40px}.day-night-screen .habitat-stage__queue{gap:0;right:8px}.day-night-screen .habitat-practice-note strong>.day-night-art{width:30px;height:30px}.day-night-sky>.day-night-art{width:76%;height:76%}.day-night-screen .day-night-sky[data-drop=true]{border-style:dashed;border-color:#fffce9;scale:1.04;box-shadow:0 0 0 5px #5f736660}.day-night-screen .day-night-sky[data-missed=true]{animation:none}.day-night-resident--owl-night{top:34%;left:25%}.day-night-resident--bat-night{top:43%;left:68%}.day-night-resident--bee-day{top:76%;left:26%}.day-night-resident--butterfly-day{top:69%;left:76%}.day-night-forest[data-complete=true] .day-night-resident--owl-night{top:31%;left:24%}.day-night-forest[data-complete=true] .day-night-resident--bat-night{top:62%;left:23%}.day-night-forest[data-complete=true] .day-night-resident--bee-day{top:76%;left:72%}.day-night-forest[data-complete=true] .day-night-resident--butterfly-day{top:45%;left:78%}.day-night-resident-touch{pointer-events:auto;cursor:pointer;background:0 0;border:0;border-radius:50%;width:100%;height:100%;padding:0;display:block}.day-night-resident-touch:focus-visible,.day-night-detail:focus-visible{outline-offset:3px;outline:3px solid #f1c965}.day-night-screen[data-flying=owl-night] [data-day-night-resident=owl-night],.day-night-screen[data-flying=bat-night] [data-day-night-resident=bat-night],.day-night-screen[data-flying=bee-day] [data-day-night-resident=bee-day],.day-night-screen[data-flying=butterfly-day] [data-day-night-resident=butterfly-day]{visibility:hidden}.day-night-screen .day-night-resident[data-arrived=true]{animation:1.1s ease-out both day-night-arrive}.day-night-screen[data-day-night-age=toddler] .day-night-resident[data-arrived=true]{animation-duration:1.2s}.day-night-resident__thanks{white-space:normal;max-width:min(180px,46vw)}.day-night-resident--bee-day .day-night-resident__thanks{left:45%;right:auto}.day-night-screen .day-night-art[data-pose=greet]{animation:day-night-greet var(--response-time,.45s) ease-out}.day-night-flight,.day-night-return{z-index:49;pointer-events:none;position:fixed;translate:-50% -50%}.day-night-screen .habitat-drag-ghost{transform:translate(-50%,-70%)rotate(0)}.day-night-next{z-index:8;white-space:nowrap;position:absolute;bottom:32px;left:50%;translate:-50%}.day-night-detail{z-index:2;aspect-ratio:1;cursor:pointer;background:0 0;border:0;width:18%;padding:0;position:absolute}.day-night-detail--flower{top:76%;left:10%}.day-night-detail--leaf{top:69%;right:6%}.day-night-detail>span{transform-origin:50% 95%;width:100%;height:100%;display:block}.day-night-detail [data-active=true]{animation:.75s ease-in-out day-night-leaf}.day-night-forest[data-time=night] .day-night-detail{filter:brightness(.7)saturate(.7)}.day-night-done-column li .day-night-art{flex:none;width:42px;height:42px}.observation-record>.day-night-art{width:100px;height:100px}.observation-record.is-compact>.day-night-art{width:64px;height:64px}.play-result-art>.day-night-art{width:90px;height:90px}.picture-next-target>.day-night-art{width:60px;height:60px}@keyframes day-night-greet{0%,to{transform:rotate(0)}40%{transform:rotate(-4deg)translateY(-3px)}}@keyframes day-night-arrive{0%{transform:translateY(-8px)scale(.96)}65%{transform:translateY(2px)scale(1)}to{transform:none}}@keyframes day-night-leaf{0%,to{rotate:0deg}35%{rotate:7deg}70%{rotate:-3deg}}@media (width<=370px){.day-night-screen .habitat-stage__queue{bottom:16px}.day-night-screen .habitat-stage__queue>.day-night-art{width:28px;height:28px}}@media (orientation:landscape) and (height<=540px){.day-night-screen .habitat-stage__animal,.day-night-screen[data-day-night-age=toddler] .habitat-stage__animal{width:110px;height:100px}.day-night-screen .habitat-stage__queue{bottom:15px;left:auto;right:8px}.day-night-next{font-size:17px;bottom:16px;left:25%}}@media (prefers-reduced-motion:reduce){.day-night-screen *,.day-night-art{transition:none!important;animation:none!important}}@media (orientation:landscape) and (height<=540px){.day-night-screen .day-night-sky--night{left:5%;right:auto}.day-night-screen .day-night-sky--day{left:32%;right:auto}.day-night-screen .day-night-practice-note{top:8px;left:72%}.day-night-screen .day-night-next{left:72%}}.day-night-screen .day-night-detail--flower{top:62%}.day-night-screen .day-night-detail--leaf{top:56%}.day-night-screen .habitat-stage{background:#b5ce87;transition:background-color .8s}.day-night-screen[data-time=night] .habitat-stage{background:#334d69}.day-night-screen .habitat-stage__demo-path,.day-night-screen[data-complete=true] .habitat-stage{display:none}@media (orientation:landscape) and (height<=540px){.day-night-screen.habitat-explore-screen[data-layout=stage]>.habitat-landscape{width:45%;inset:0 auto 0 0}.day-night-screen .habitat-stage{height:100%;top:0;left:45%}.day-night-screen .habitat-stage__bubble{width:auto;inset:78px 6% auto}.day-night-screen .habitat-stage__animal,.day-night-screen[data-day-night-age=toddler] .habitat-stage__animal{width:150px;height:140px;bottom:20px}.day-night-screen .habitat-stage__queue{bottom:25px}.day-night-screen .habitat-stage__think{bottom:174px}.day-night-screen .habitat-stage__demo{left:calc(50% + 25px)}.day-night-screen .habitat-done-sheet{left:45%}.day-night-screen .day-night-practice-note{z-index:8;width:190px;top:72px;left:72%}.day-night-screen[data-variant=b] .habitat-stage__bubble{display:none}}.day-night-screen .habitat-stage__animal:not([data-dragging=true])>[data-pose=idle]{animation:7s ease-in-out 1s infinite day-night-breathe}.day-night-screen [data-day-night-resident=owl-night][data-arrived=true]{animation-name:day-night-owl-settle}.day-night-screen [data-day-night-resident=bat-night][data-arrived=true]{animation-name:day-night-bat-turn}.day-night-screen [data-day-night-resident=bee-day][data-arrived=true]{animation-name:day-night-bee-visit}.day-night-screen [data-day-night-resident=butterfly-day][data-arrived=true]{animation-name:day-night-butterfly-settle}:is(.day-night-forest:has([data-day-night-resident=bee-day][data-arrived=true]) .day-night-detail--flower>span,.day-night-forest:has([data-day-night-resident=butterfly-day][data-arrived=true]) .day-night-detail--leaf>span){animation:1.1s ease-in-out day-night-leaf}@keyframes day-night-breathe{0%,65%,to{transform:translateY(0)}78%,91%{transform:translateY(-2px)}}@keyframes day-night-owl-settle{0%{transform:translateY(-6px)rotate(-3deg)}65%{transform:translateY(2px)rotate(1deg)}to{transform:none}}@keyframes day-night-bat-turn{0%{transform:translate(-7px)rotate(-7deg)}70%{transform:translate(3px)rotate(3deg)}to{transform:none}}@keyframes day-night-bee-visit{0%{transform:translateY(-6px)rotate(-4deg)}65%{transform:translateY(3px)rotate(3deg)}to{transform:none}}@keyframes day-night-butterfly-settle{0%{transform:translate(-4px,-8px)rotate(-5deg)}65%{transform:translateY(-2px)rotate(2deg)}to{transform:none}}