:root{color:#20372f;font-synthesis:none;text-rendering:optimizelegibility;--green:#43a874;--green-dark:#247454;--cream:#fff8e7;--purple:#6c63d8;background:#fff8e7;font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}body{min-width:320px;min-height:100vh}h1,p{margin-top:0}h1{letter-spacing:-.025em;font-family:ui-rounded,Arial Rounded MT Bold,system-ui,sans-serif;line-height:.96}.start-screen,.completion-screen{min-height:100svh;padding:max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));background:radial-gradient(circle at 12% 85%, #58cc8b26 0 100px, transparent 101px), radial-gradient(circle at 88% 12%, #ffca3a33 0 140px, transparent 141px), var(--cream);place-items:center;display:grid;position:relative;overflow:hidden}.start-card,.completion-card{z-index:2;text-align:center;width:min(610px,100%);position:relative}.logo-dino{background:var(--green);color:#fff;border:5px solid #fff;border-radius:50% 50% 46% 54%;place-items:center;width:70px;height:70px;margin:0 auto 12px;font:800 42px/1 ui-rounded,Arial Rounded MT Bold,sans-serif;display:grid;transform:rotate(-5deg);box-shadow:0 7px #247454,0 10px 24px #24745433}.eyebrow{color:var(--green-dark);letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px;font-size:13px;font-weight:800}.start-card h1,.completion-card h1{margin-bottom:12px;font-size:clamp(42px,7vw,68px)}.start-card h1 span,.completion-card h1 span{color:var(--green)}.intro{color:#66766f;max-width:470px;margin:0 auto 24px;font-size:16px}.layout-picker{border:0;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 14px;padding:0;display:grid}.layout-picker legend{width:100%;margin-bottom:10px;font-weight:800}.choice-card{color:#20372f;text-align:left;cursor:pointer;background:#ffffffd9;border:3px solid #e9e5d9;border-radius:20px;align-items:center;gap:13px;min-height:102px;padding:12px;transition:transform .15s,border-color .15s,box-shadow .15s;display:flex}.choice-card:hover{transform:translateY(-2px)}.choice-card.selected{border-color:var(--green);box-shadow:0 5px #43a8742e}.choice-card strong,.choice-card small{display:block}.choice-card strong{font-size:16px}.choice-card small{color:#74827c;margin-top:2px;font-size:11px;line-height:1.25}.choice-preview{background:#bde2ec;border-radius:12px;flex:none;width:68px;height:62px;position:relative;overflow:hidden}.choice-preview i,.choice-preview b{border-radius:50% 50% 40% 40%;width:25px;height:35px;position:absolute;bottom:8px}.choice-preview i{background:#f3c6a5;left:9px}.choice-preview b{background:var(--green);right:8px}.stack-preview i{bottom:30px;left:20px;transform:scale(.82)}.stack-preview b{bottom:5px;right:21px;transform:scale(.86)}.stack-preview:after{content:"";background:#fff;height:2px;position:absolute;inset:50% 0 auto}.sound-toggle{cursor:pointer;justify-content:space-between;align-items:center;min-height:50px;padding:0 8px;font-weight:800;display:flex}.sound-toggle>span>span{width:28px;height:28px;color:var(--purple);background:#e7e4ff;border-radius:50%;place-items:center;margin-right:7px;display:inline-grid}.sound-toggle input{opacity:0;pointer-events:none;position:absolute}.sound-toggle i{background:#d6d9d6;border-radius:20px;width:50px;height:29px;transition:background .2s;position:relative}.sound-toggle i:after{content:"";background:#fff;border-radius:50%;width:23px;height:23px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 2px 5px #0003}.sound-toggle input:checked+i{background:var(--green)}.sound-toggle input:checked+i:after{transform:translate(21px)}.primary-button{background:var(--green);width:100%;min-height:62px;box-shadow:0 7px 0 var(--green-dark);color:#fff;cursor:pointer;border:0;border-radius:18px;padding:12px 22px;font-family:ui-rounded,Arial Rounded MT Bold,sans-serif;font-size:22px;font-weight:800;transition:transform .1s,box-shadow .1s}.primary-button:active{box-shadow:0 2px 0 var(--green-dark);transform:translateY(5px)}.privacy-note{color:#8b948f;margin:18px 0 0;font-size:11px}.cloud{background:#ffffffad;border-radius:50px;width:180px;height:55px;position:absolute}.cloud:before,.cloud:after{content:"";background:inherit;border-radius:50%;position:absolute;bottom:0}.cloud:before{width:76px;height:76px;left:28px}.cloud:after{width:58px;height:58px;right:20px}.cloud-one{top:15%;left:-40px}.cloud-two{bottom:18%;right:-60px;transform:scale(.75)}.session-screen{background:#20372f;width:100%;height:100svh;position:relative;overflow:hidden}.session-topbar{z-index:10;height:88px;padding:max(14px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 8px max(18px, env(safe-area-inset-left));background:linear-gradient(#10271fbf,#0000);grid-template-columns:52px minmax(220px,460px) 52px;justify-content:center;align-items:center;gap:18px;display:grid;position:absolute;top:0;left:0;right:0}.round-button{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#17322aa6;border:2px solid #ffffffb3;border-radius:50%;place-items:center;width:50px;height:50px;font-size:22px;font-weight:800;display:grid}.exit-button{font-size:34px;font-weight:500}.progress-wrap{color:#fff;grid-template-rows:1fr 1fr;grid-template-columns:1fr auto;align-items:center;column-gap:10px;display:grid}.progress-track{background:#0003;border:3px solid #fffc;border-radius:20px;grid-row:1/3;height:18px;overflow:hidden}.progress-track span{border-radius:inherit;background:#ffca3a;height:100%;transition:width .4s linear;display:block}.progress-wrap strong{font:800 23px/1 ui-rounded,Arial Rounded MT Bold,sans-serif}.progress-wrap small{text-transform:uppercase;font-size:9px;font-weight:800}.mirror-stage{width:100%;height:100%;display:flex;position:relative}.camera-panel,.dino-panel{position:relative;overflow:hidden}.camera-mirror{background:#29483d;width:100%;height:100%;position:relative}.camera-mirror video{object-fit:cover;width:100%;height:100%;display:block;transform:scaleX(-1)}.camera-status{color:#fff;text-align:center;background:#29483d;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:25px;display:flex;position:absolute;inset:0}.camera-status strong{font:800 28px ui-rounded,Arial Rounded MT Bold,sans-serif}.camera-status span:not(.spinner){max-width:340px}.spinner{border:5px solid #ffffff40;border-top-color:#fff;border-radius:50%;width:45px;height:45px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.layout-side-by-side .camera-panel,.layout-side-by-side .dino-panel{width:50%;height:100%}.layout-side-by-side .dino-panel{background:linear-gradient(#c6edf2,#f7dc9f);border-left:5px solid #fff;place-items:center;padding:75px 5% 100px;display:grid}.layout-together .camera-panel{width:100%;height:100%}.layout-together .dino-panel{z-index:2;filter:drop-shadow(0 8px 5px #00000040);align-items:end;width:min(43vw,440px);height:min(77vh,680px);display:grid;position:absolute;bottom:60px;right:2%}.dino-background{pointer-events:none;background:radial-gradient(circle at 50% 54%,#ffffff80 0 120px,#ffffff2e 121px 210px,#0000 211px),linear-gradient(90deg,#fff3 1px,#0000 1px) 0 0/74px 74px,linear-gradient(#ffffff2e 1px,#0000 1px) 0 0/74px 74px;position:absolute;inset:0;overflow:hidden}.dino-background:after{content:"";background:radial-gradient(#ffca3a42,#0000 68%);border-radius:50% 50% 0 0;height:28%;position:absolute;inset:auto 10% -9%}.tile-shine{background:#ffffff1f;border-radius:35px;width:130px;height:130px;position:absolute;transform:rotate(12deg)}.tile-shine-one{top:16%;left:12%}.tile-shine-two{bottom:21%;right:8%;transform:rotate(-15deg)scale(1.25)}.background-bubble{width:var(--bubble-size);height:var(--bubble-size);left:var(--bubble-left);animation:background-bubble var(--bubble-duration) linear infinite;animation-delay:var(--bubble-delay);background:radial-gradient(circle at 32% 28%,#ffffffd9,#ffffff24 42%,#4ebeda24);border:2px solid #ffffffb8;border-radius:50%;position:absolute;bottom:-12%}.bubble-one{--bubble-size:24px;--bubble-left:16%;--bubble-duration:9s;--bubble-delay:-1s}.bubble-two{--bubble-size:38px;--bubble-left:76%;--bubble-duration:12s;--bubble-delay:-5s}.bubble-three{--bubble-size:18px;--bubble-left:59%;--bubble-duration:8s;--bubble-delay:-3s}.bubble-four{--bubble-size:30px;--bubble-left:32%;--bubble-duration:11s;--bubble-delay:-7s}.zone-stars{z-index:4;top:max(86px, calc(env(safe-area-inset-top) + 70px));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffa8;border:2px solid #ffffffc7;border-radius:999px;gap:8px;padding:7px 12px;display:flex;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #235a4824}.zone-stars span{color:#24745438;text-shadow:0 2px #fff9;font-size:clamp(20px,3vw,31px);line-height:1;transition:color .25s,transform .25s;transform:scale(.9)}.zone-stars span.filled{color:#ffca3a;filter:drop-shadow(0 2px #d89d16);animation:.35s ease-out both star-pop;transform:scale(1.1)rotate(-4deg)}.zone-burst{z-index:4;pointer-events:none;height:120px;position:absolute;inset:38% 18% auto}.zone-burst i{color:#ffdf45;opacity:0;font-size:clamp(20px,3vw,40px);font-style:normal;animation:.8s ease-out both zone-burst;position:absolute;top:50%;left:50%}.zone-burst i:first-child{--burst-x:-84px;--burst-y:-30px;animation-delay:30ms}.zone-burst i:nth-child(2){--burst-x:70px;--burst-y:-46px;animation-delay:80ms}.zone-burst i:nth-child(3){--burst-x:-50px;--burst-y:48px;animation-delay:.13s}.zone-burst i:nth-child(4){--burst-x:88px;--burst-y:36px;animation-delay:.18s}.zone-burst i:nth-child(5){--burst-x:0;--burst-y:-72px;animation-delay:.23s}.dino-guide{z-index:2;width:100%;max-width:470px;margin:auto;animation:.42s ease-out both dino-zone-pop,2.6s ease-in-out .42s infinite dino-bounce;position:relative}.dino-guide svg{width:100%;display:block;overflow:visible}.dino-idle{transform-box:fill-box;transform-origin:50% 78%;animation:2.9s ease-in-out infinite dino-breathe}.dino-head-group{transform-box:fill-box;transform-origin:50% 74%;animation:3.6s ease-in-out infinite head-attention}.dino-shadow{fill:#20372f33}.dino-body,.dino-head,.dino-tail{fill:#58cc8b;stroke:#247454;stroke-width:5px;stroke-linejoin:round}.dino-snout{fill:#8add9f;stroke:#247454;stroke-width:4px;stroke-linejoin:round}.dino-belly{fill:#b5efbb;stroke:#24745433;stroke-width:2px}.dino-spikes{fill:none;stroke:#ffca3a;stroke-width:11px;stroke-linecap:round;stroke-linejoin:round}.dino-cheek{fill:#f18c85;opacity:.62}.left-cheek{opacity:.42}.eye-white{fill:#fff;stroke:#247454;stroke-width:3px}.eye{fill:#20372f}.eye-shine{fill:#fff}.dino-eye{transform-box:fill-box;transform-origin:50%;animation:4.8s infinite blink}.right-eye{animation-delay:40ms}.pupil{transform-box:fill-box;transform-origin:50%;transform:translate(calc(var(--eye-x) * 1px), calc(var(--eye-y) * 1px));transition:transform .28s}.brow{fill:none;stroke:#247454;stroke-width:5px;stroke-linecap:round}.nostril{fill:#247454}.mouth{fill:#5b2833;stroke:#247454;stroke-width:4px}.tongue{fill:#ed7380}.mouth-gap{fill:none;stroke:#3b1822;stroke-width:5px;stroke-linecap:round;opacity:.75}.tooth{fill:#fffdf6;stroke:#ded9c9;stroke-width:1.5px;transition:fill .25s,filter .25s}.active-tooth{fill:#ffeb62;stroke:#ffca3a;filter:drop-shadow(0 0 7px #fff)drop-shadow(0 0 7px #ffca3a);animation:.55s ease-in-out infinite alternate tooth-glow}.arm{fill:none;stroke:#247454;stroke-width:24px;stroke-linecap:round}.back-arm{opacity:.9}.front-arm{transform-box:fill-box;transform-origin:10% 10%;animation:.7s ease-in-out infinite alternate arm-follow}.leg{fill:none;stroke:#247454;stroke-width:17px;stroke-linecap:round}.brush-handle{fill:#6c63d8;stroke:#423b9d;stroke-width:2px}.brush-head{fill:#fff;stroke:#423b9d;stroke-width:2px}.bristles{fill:none;stroke:#4bb8e9;stroke-width:2.5px;stroke-linecap:round}.brush-foam circle{fill:#ffffffeb;stroke:#9de8f2;stroke-width:1.4px;animation:.9s ease-in-out infinite alternate foam-pop}.brush-foam circle:nth-child(2){animation-delay:.16s}.brush-foam circle:nth-child(3){animation-delay:.3s}.brush-foam circle:nth-child(4){animation-delay:.45s}.dino-hand{fill:#58cc8b;stroke:#247454;stroke-width:4px}.brush-position{transition:transform .35s}.brush-wiggle{transform-box:fill-box;transform-origin:top;animation:.52s cubic-bezier(.45,0,.35,1) infinite alternate brush}.sparkles i{color:#ffdf45;font-size:clamp(20px,3vw,38px);font-style:normal;animation:1.1s ease-in-out infinite sparkle;position:absolute}.sparkles i:first-child{top:37%;left:18%}.sparkles i:nth-child(2){animation-delay:.35s;top:43%;right:12%}.sparkles i:nth-child(3){animation-delay:.7s;top:27%;right:21%}.instruction-bubble{z-index:5;min-width:300px;left:50%;bottom:max(22px, env(safe-area-inset-bottom));text-align:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffffeb;border:3px solid #fffc;border-radius:22px;padding:12px 38px;position:absolute;transform:translate(-50%);box-shadow:0 8px 30px #0003}.instruction-bubble span,.instruction-bubble small{display:block}.instruction-bubble span{color:var(--green-dark);font:800 clamp(22px,3vw,32px)/1.1 ui-rounded,Arial Rounded MT Bold,sans-serif}.instruction-bubble small{color:#6e7a75;margin-top:2px;font-weight:700}.session-finale .progress-track span{background:#ff8d3a}.session-finale.layout-side-by-side .dino-panel{background:linear-gradient(#ffe1a9,#ffe77a)}.session-finale .dino-background{background:radial-gradient(circle at 50% 54%,#ffffffb8 0 135px,#ffe25f3d 136px 240px,#0000 241px),linear-gradient(90deg,#ffffff3d 1px,#0000 1px) 0 0/74px 74px,linear-gradient(#ffffff38 1px,#0000 1px) 0 0/74px 74px}.session-finale .sparkles i,.session-finale .background-bubble{animation-duration:.75s}.session-finale .brush-wiggle{animation-duration:.34s}.session-finale .instruction-bubble{border-color:#ffca3ae6;box-shadow:0 8px 34px #ff8d3a47}.session-paused .dino-guide,.session-paused .dino-idle,.session-paused .dino-head-group,.session-paused .dino-eye,.session-paused .front-arm,.session-paused .brush-wiggle,.session-paused .brush-foam circle,.session-paused .active-tooth,.session-paused .sparkles i,.session-paused .background-bubble{animation-play-state:paused}.session-paused .mirror-stage:after{content:"";z-index:3;pointer-events:none;background:#14262038;position:absolute;inset:0}@keyframes background-bubble{0%{opacity:0;transform:translateY(0)translate(0)scale(.7)}12%{opacity:.7}to{opacity:0;transform:translateY(-120vh)translate(24px)scale(1.15)}}@keyframes star-pop{0%{transform:scale(.3)rotate(-22deg)}70%{transform:scale(1.26)rotate(6deg)}to{transform:scale(1.1)rotate(-4deg)}}@keyframes zone-burst{0%{opacity:0;transform:translate(-50%,-50%)scale(.35)rotate(0)}30%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--burst-x)), calc(-50% + var(--burst-y))) scale(1.25) rotate(35deg)}}@keyframes foam-pop{0%{opacity:.45;transform:translateY(2px)scale(.82)}to{opacity:1;transform:translateY(-2px)scale(1.08)}}@keyframes brush{0%{transform:translate(-8px,-1px)rotate(-4deg)}55%{transform:translate(2px,1px)rotate(1deg)}to{transform:translate(9px,-1px)rotate(5deg)}}@keyframes arm-follow{0%{transform:rotate(-2deg)}to{transform:rotate(3deg)}}@keyframes dino-zone-pop{0%{transform:translateY(5px)scale(.97)rotate(-1.5deg)}60%{transform:translateY(-6px)scale(1.02)rotate(.7deg)}to{transform:translateY(0)scale(1)rotate(0)}}@keyframes dino-bounce{0%,to{transform:translateY(0)rotate(-.35deg)}50%{transform:translateY(-4px)rotate(.35deg)}}@keyframes dino-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.015,.99)}}@keyframes head-attention{0%,to{transform:rotate(0)}45%{transform:rotate(-1.2deg)}70%{transform:rotate(.8deg)}}@keyframes blink{0%,7%,9%,55%,57%,to{transform:scaleY(1)}8%,56%{transform:scaleY(.08)}}@keyframes tooth-glow{to{fill:#fff4a7}}@keyframes sparkle{0%,to{opacity:.25;transform:scale(.6)rotate(0)}50%{opacity:1;transform:scale(1.2)rotate(25deg)}}.completion-screen{background:radial-gradient(circle,#fffef7 0 25%,#e2f5dd 70%,#c6ead5 100%)}.completion-card{width:min(530px,100%)}.completion-card>p:not(.eyebrow){color:#65736d;font-size:18px}.completion-card .primary-button{max-width:360px;margin-top:14px}.medal{background:#fff3b5;border:9px solid #ffca3a;border-radius:50%;place-items:center;width:130px;height:130px;margin:0 auto 20px;animation:.55s cubic-bezier(.2,1.6,.4,1) medal-in;display:grid;box-shadow:0 8px #d99e17,0 15px 35px #d99e1740}.medal span{color:#ffb20d;font-size:76px;line-height:1}.text-button{color:var(--green-dark);cursor:pointer;text-underline-offset:4px;background:0 0;border:0;margin:24px auto 0;font-weight:800;text-decoration:underline;display:block}.confetti{pointer-events:none;position:absolute;inset:0;overflow:hidden}.confetti i{width:11px;height:20px;top:-30px;left:var(--left);background:var(--color);animation:confetti-fall var(--duration) var(--delay) linear infinite;position:absolute}@keyframes confetti-fall{to{transform:translateY(110vh)rotate(720deg)}}@keyframes medal-in{0%{opacity:0;transform:scale(.3)rotate(-25deg)}}@media (width<=700px){.start-screen{align-items:start;overflow:auto}.layout-picker{grid-template-columns:1fr}.choice-card{min-height:82px}.start-card h1{font-size:43px}.logo-dino{width:55px;height:55px;font-size:34px}.session-topbar{grid-template-columns:46px 1fr 46px;gap:8px}.round-button{width:44px;height:44px}.layout-side-by-side .mirror-stage{flex-direction:column}.layout-side-by-side .camera-panel,.layout-side-by-side .dino-panel{width:100%;height:50%}.layout-side-by-side .dino-panel{border-top:4px solid #fff;border-left:0;padding:20px 10% 88px}.layout-side-by-side .dino-guide{max-width:min(420px,78vw,32vh)}.layout-side-by-side .zone-stars{top:10px}.layout-together .dino-panel{width:55vw;bottom:75px;right:0}.layout-together .zone-stars{top:-14px}.instruction-bubble{width:calc(100% - 32px);min-width:0;padding:10px 16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}