:root{--ink:#20384a;--yellow:#ffd85a;--mint:#88dbc0;--coral:#ff8d75;--blue:#72c8e9;--cream:#fff8e7;--shadow:0 8px 0 #2d4b561f, 0 13px 24px #3457601a}*{box-sizing:border-box}html{background:#eff9ef;min-height:100%}body{min-height:100vh;color:var(--ink);background:radial-gradient(circle at 12% 45%,#ffffffbf 0 34px,#0000 35px),radial-gradient(circle at 92% 55%,#ffffffb3 0 42px,#0000 43px),linear-gradient(#dff5fb 0 28%,#eff9ef 28% 100%);margin:0;font-family:Arial Rounded MT Bold,Trebuchet MS,system-ui,sans-serif;overflow-x:hidden}button{font:inherit;color:inherit}button:focus-visible{outline-offset:3px;outline:4px solid #3478c7}a{color:inherit}.hidden{display:none!important}.app{z-index:2;width:min(1180px,100% - 32px);margin:0 auto;padding:18px 0 50px;position:relative}.sky-decor{pointer-events:none;position:fixed;inset:0;overflow:hidden}.cloud{background:#fffc;border-radius:30px;width:100px;height:34px;position:absolute}.cloud:before,.cloud:after{content:"";background:inherit;border-radius:50%;position:absolute}.cloud:before{width:45px;height:45px;bottom:0;left:15px}.cloud:after{width:58px;height:58px;bottom:0;right:9px}.cloud-one{top:145px;left:5%}.cloud-two{top:210px;right:4%;transform:scale(.72)}.star{color:#fff;text-shadow:0 2px #0000000d;font-size:26px;position:absolute}.star-one{top:105px;right:17%;transform:rotate(15deg)}.star-two{font-size:18px;top:225px;left:15%}.topbar{min-height:96px;box-shadow:var(--shadow);background:#ffffffeb;border:3px solid #fff;border-radius:28px;grid-template-columns:1fr auto auto;align-items:center;gap:22px;padding:14px 20px;display:grid}.brand{align-items:center;gap:12px;min-width:0;display:flex}.rainbow{background:#fff3c9;border-radius:18px;place-items:center;width:58px;height:58px;font-size:42px;display:grid;transform:rotate(-4deg)}.eyebrow,.kicker{color:#e66f59;letter-spacing:.15em;margin:0;font-size:.68rem;font-weight:900}h1{letter-spacing:.04em;margin:0;font:700 clamp(1.35rem,2.5vw,2.1rem)/1 Arial Rounded MT Bold,Trebuchet MS,sans-serif}.stats{gap:10px;display:flex}.stat{text-align:center;background:#f4faf6;border-radius:16px;min-width:88px;padding:8px 13px}.stat span{color:#6e858c;letter-spacing:.08em;font-size:.62rem;display:block}.stat strong{font-family:Arial Rounded MT Bold,Trebuchet MS,sans-serif;font-size:1.2rem}.controls{gap:8px;display:flex}.round-button,.restart-button,.teacher-link{cursor:pointer;background:#f4f8f6;border:0;border-radius:16px;min-height:50px;padding:8px 12px;transition:all .15s;box-shadow:inset 0 0 0 2px #e0ede5}.teacher-link{place-items:center;font-size:1rem;text-decoration:none;display:grid}.teacher-link span{color:#71868b;font-size:.58rem;display:block}.round-button{min-width:52px;font-size:1.05rem}.round-button span{color:#71868b;font-size:.58rem;display:block}.round-button[aria-pressed=true]{background:#fff2ba;box-shadow:inset 0 0 0 2px #ffd75a}.restart-button{font-size:.82rem;font-weight:900}.round-button:hover,.restart-button:hover,.teacher-link:hover{transform:translateY(-2px)}.game-shell{background:#ffffff8c;border:3px solid #fffc;border-radius:34px;min-height:650px;margin-top:22px;padding:22px}.start-screen{place-items:center;min-height:600px;display:grid}.zoo-sign{text-align:center;width:min(760px,100%);box-shadow:var(--shadow);background:#fffdf6;border:4px solid #fff;border-radius:38px;padding:44px 52px 38px;position:relative}.mascot{background:#fff4c7;border:6px solid #fff;border-radius:50%;place-items:center;width:98px;height:98px;font-size:72px;display:grid;position:absolute;top:-50px;left:50%;transform:translate(-50%);box-shadow:0 7px 15px #46503c21}.zoo-sign .kicker{margin-top:18px}.zoo-sign h2{margin:10px 0;font:700 clamp(2rem,5vw,3.6rem)/.95 Arial Rounded MT Bold,Trebuchet MS,sans-serif}.zoo-sign h2 em{color:#ef7965;font-style:normal;-webkit-text-decoration:underline wavy #ffd457;text-decoration:underline wavy #ffd457;text-decoration-thickness:5px}.zoo-sign>p:not(.kicker){color:#667b82;max-width:510px;margin:18px auto 28px;line-height:1.5}.category-fieldset{margin-bottom:18px}.category-options{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;display:grid}.category{cursor:pointer;background:#f7faf7;border:2px solid #e2ebe5;border-radius:15px;min-width:0;min-height:78px;padding:8px 4px;transition:all .15s}.category>span{min-height:34px;font-size:1.75rem;line-height:1;display:block}.category b{letter-spacing:.04em;margin-top:6px;font-size:.65rem;display:block}.category:hover{transform:translateY(-2px)}.category.selected{background:#e7f8ff;border-color:#67bfe0;box-shadow:0 4px #4aa8ca}.class-panel{text-align:left;background:#f1faf6;border:2px solid #dbeee4;border-radius:18px;max-width:520px;margin:0 auto 22px;padding:13px 15px}.class-panel-heading{align-items:center;gap:9px;display:flex}.class-panel-heading>span:first-child{font-size:1.45rem}.class-panel-heading div{flex:1;min-width:0}.class-panel-heading b,.class-panel-heading small{display:block}.class-panel-heading b{letter-spacing:.08em;font-size:.75rem}.class-panel-heading small{color:#72868a;margin-top:2px;font:500 .68rem/1.3 Trebuchet MS,system-ui,sans-serif}.live-status{color:#197554;background:#d8f6e7;border-radius:999px;padding:5px 8px;font-size:.65rem}.class-fields{grid-template-columns:1fr 1fr;gap:9px;margin-top:10px;display:grid}.class-fields label span{color:#647a80;letter-spacing:.05em;margin:0 0 4px 4px;font-size:.63rem;display:block}.class-fields input{width:100%;min-height:40px;color:var(--ink);text-transform:none;background:#fff;border:2px solid #dbe8e2;border-radius:12px;padding:8px 11px;font:700 .88rem Trebuchet MS,system-ui,sans-serif}#classCode{text-transform:uppercase;letter-spacing:.1em}.class-fields input:focus{border-color:#40a8d1;outline:3px solid #40a8d133}.class-fields input:disabled{color:#668079;background:#e8f6ef}.class-error{text-align:center;font-size:.75rem;color:#bd4938!important;margin:8px 0 0!important}fieldset{border:0;margin:0;padding:0}legend{color:#71858b;letter-spacing:.12em;width:100%;margin-bottom:10px;font-size:.7rem}.difficulty-options{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.difficulty{cursor:pointer;background:#f7faf7;border:2px solid #e6ece6;border-radius:16px;padding:12px 8px;transition:all .15s}.difficulty b,.difficulty span{display:block}.difficulty b{font-family:Arial Rounded MT Bold,Trebuchet MS,sans-serif}.difficulty span{color:#7b8b8e;font-size:.7rem}.difficulty:hover{transform:translateY(-2px)}.difficulty.selected{background:#fff2bc;border-color:#f4c847;box-shadow:0 4px #e8ba35}.primary-button,.secondary-button{cursor:pointer;letter-spacing:.02em;border:0;border-radius:18px;padding:15px 24px;font-weight:900}.primary-button{background:var(--coral);color:#fff;box-shadow:0 6px #d96856}.secondary-button{background:#eef7f2;box-shadow:0 5px #cbded3}#startButton{min-width:220px;margin-top:24px;font-size:1.05rem}.game-screen{padding:4px 4px 12px}.round-heading{grid-template-columns:1fr auto;align-items:end;gap:4px 20px;padding:8px 8px 18px;display:grid}.round-heading>div:first-child{align-items:center;gap:8px;display:flex}.round-heading h2{margin:0;font:700 clamp(1.35rem,3vw,2rem) Arial Rounded MT Bold,Trebuchet MS,sans-serif}.round-heading p{color:#6d8589;margin:0}.leaf{font-size:1.6rem}.progress-track{background:#dfece4;border-radius:10px;grid-column:1/-1;height:10px;margin-top:10px;overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg,#74d6b5,#ffd75c);width:0;height:100%;transition:width .35s;display:block}.card-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;display:grid}.card{cursor:pointer;min-height:150px;box-shadow:var(--shadow);touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:#fff;border:3px solid #fff;border-radius:24px;place-items:center;padding:16px;transition:transform .16s,box-shadow .16s,opacity .28s;display:grid;position:relative}.card:hover{transform:translateY(-3px)}.card.word-card{background:linear-gradient(145deg,#fff,#fff8e9)}.card.image-card{background:linear-gradient(145deg,var(--card-tint),#fff)}.card.selected{box-shadow:0 0 0 5px #40a8d133, var(--shadow);border-color:#40a8d1;transform:scale(1.04)}.word-label{letter-spacing:.025em;overflow-wrap:anywhere;text-align:center;max-width:100%;font:700 clamp(.86rem,2vw,1.35rem)/1.05 Arial Rounded MT Bold,Trebuchet MS,sans-serif}.long-word .word-label{letter-spacing:0;font-size:clamp(.72rem,1.65vw,1.05rem)}.speak-button{cursor:pointer;color:#277ba0;background:#e8f7ff;border:0;border-radius:50%;place-items:center;width:38px;height:38px;font-size:1.05rem;display:grid;position:absolute;top:9px;right:9px}.speak-button:hover{background:#cef;transform:scale(1.08)}.animal-art{z-index:1;filter:drop-shadow(0 5px #33413217);font-size:clamp(3.6rem,7vw,5.8rem);line-height:1;position:relative}.animal-image{z-index:1;object-fit:contain;width:100%;height:112px;position:relative}.image-card:after{content:"";background:#66b78029;border-radius:50%;width:72%;height:25%;position:absolute;bottom:15px}.card.matched{opacity:0;pointer-events:none;transform:scale(.65)rotate(5deg)}.card.wrong{animation:.32s gentle-shake}@keyframes gentle-shake{25%{transform:translate(-6px)rotate(-1deg)}55%{transform:translate(6px)rotate(1deg)}80%{transform:translate(-3px)}}.celebration{z-index:20;pointer-events:none;position:fixed;inset:0;overflow:hidden}.spark{left:var(--x);top:var(--y);font-size:var(--size);animation:.8s ease-out forwards sparkle;position:absolute}@keyframes sparkle{0%{opacity:1;transform:translate(0)scale(.4)rotate(0)}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.2) rotate(180deg)}}.finish-dialog{text-align:center;width:min(540px,100% - 28px);color:var(--ink);background:#fffdf4;border:4px solid #fff;border-radius:34px;padding:30px;box-shadow:0 24px 80px #25464540}.finish-dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#335d5d6b}.finish-dialog h2{color:#ec755f;margin:3px 0;font:700 3rem Arial Rounded MT Bold,Trebuchet MS,sans-serif}.finish-dialog>p:not(.kicker){margin:0 0 18px;font-size:1.15rem}.finish-mascot{font-size:76px;display:block}.finish-stars{color:#f2c83f;letter-spacing:12px;font-size:28px}.finish-summary{justify-content:center;gap:14px;margin:18px 0 24px;display:flex}.finish-summary span{background:#f2f8f3;border-radius:14px;padding:10px 17px}.finish-actions{justify-content:center;gap:12px;display:flex}.teacher-dashboard{z-index:2;width:min(1260px,100% - 32px);margin:0 auto;padding:22px 0 60px;position:relative}.teacher-header{min-height:112px;box-shadow:var(--shadow);background:#fffffff0;border:3px solid #fff;border-radius:28px;align-items:center;gap:20px;padding:18px 24px;display:flex}.teacher-header>div{flex:1}.teacher-header h1{margin:2px 0;font-size:clamp(1.7rem,3vw,2.5rem)}.teacher-header p:last-child{color:#70858a;margin:0;font-size:.83rem}.teacher-mascot{background:#fff2bd;border-radius:22px;place-items:center;width:70px;height:70px;font-size:50px;display:grid}.back-link{color:#58727a;background:#edf6f1;border-radius:12px;align-self:flex-start;padding:9px 12px;font-size:.75rem;text-decoration:none}.teacher-welcome,.waiting-room{text-align:center;width:min(680px,100%);box-shadow:var(--shadow);background:#fffdf6;border:4px solid #fff;border-radius:34px;margin:34px auto 0;padding:46px 36px}.teacher-welcome-icon{font-size:74px}.teacher-welcome h2,.waiting-room h2{margin:7px 0;font-size:clamp(2rem,4vw,3.2rem)}.teacher-welcome>p:not(.kicker),.waiting-room p{color:#667b82;max-width:520px;margin:14px auto 25px;line-height:1.6}.teacher-welcome .primary-button{min-width:230px}.teacher-error{color:#a83f30;text-align:center;background:#ffe8e2;border:2px solid #ffcabb;border-radius:14px;padding:10px 14px}.room-banner{color:#24414a;box-shadow:var(--shadow);background:linear-gradient(135deg,#fff1b9,#fff9df);border:3px solid #fff;border-radius:25px;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;margin-top:22px;padding:18px 22px;display:grid}.room-banner>div:first-child{text-align:center;min-width:160px}.room-banner span,.room-banner small{letter-spacing:.1em;color:#72858a;font-size:.67rem;display:block}.room-banner strong{letter-spacing:.16em;margin-top:2px;font-size:2.2rem;display:block}.room-instructions b,.room-instructions small{display:block}.room-instructions small{letter-spacing:0;margin-top:5px}.room-banner button{cursor:pointer;background:#fff;border:0;border-radius:14px;padding:12px 16px;font-weight:900;box-shadow:0 4px #b6943140}.teacher-stats{grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0;display:grid}.teacher-stats div{text-align:center;background:#ffffffe6;border:3px solid #fff;border-radius:18px;padding:13px;box-shadow:0 6px #2d4b5614}.teacher-stats span{color:#6e858c;letter-spacing:.08em;font-size:.68rem;display:block}.teacher-stats strong{font-size:1.65rem}.waiting-animals{letter-spacing:10px;font-size:50px}.student-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.student-panel{box-shadow:var(--shadow);background:#fffdf8;border:4px solid #fff;border-radius:26px;padding:18px;transition:border-color .2s,box-shadow .2s;overflow:hidden}.student-panel.result-correct{box-shadow:0 0 0 5px #4abe8c1f,var(--shadow);border-color:#93ddc0}.student-panel.result-wrong{box-shadow:0 0 0 5px #ff79611f,var(--shadow);border-color:#ffb3a4}.student-panel>header{justify-content:space-between;align-items:center;gap:12px;display:flex}.student-panel>header>div{align-items:center;gap:8px;min-width:0;display:flex}.student-panel h2{text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:1.35rem;overflow:hidden}.presence{background:#aebcba;border-radius:50%;flex:none;width:11px;height:11px;box-shadow:0 0 0 4px #edf1f0}.presence.online{background:#35b978;box-shadow:0 0 0 4px #dff7eb}.student-state{color:#61777b;letter-spacing:.07em;background:#edf3f0;border-radius:999px;padding:6px 9px;font-size:.62rem}.state-playing{color:#146c89;background:#dff5ff}.state-finished{color:#8d6412;background:#fff0b7}.student-meta{justify-content:space-between;margin:13px 2px 8px;display:flex}.student-progress{background:#e2ede7;border-radius:10px;height:8px;overflow:hidden}.student-progress span{border-radius:inherit;background:linear-gradient(90deg,#74d6b5,#ffd75c);height:100%;transition:width .3s;display:block}.mini-board{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;min-height:145px;margin-top:13px;display:grid}.mini-board>p{color:#829397;text-align:center;grid-column:1/-1;align-self:center;margin:0}.mini-card{overflow-wrap:anywhere;text-align:center;background:#fff;border:2px solid #e9efeb;border-radius:11px;place-items:center;min-height:58px;padding:5px;font-size:.65rem;font-weight:900;transition:all .18s;display:grid;overflow:hidden}.mini-card.image{background:#f0f9f4;font-size:1.8rem}.mini-card.selected{border-color:#40a8d1;transform:scale(1.04);box-shadow:0 0 0 3px #40a8d12e}.mini-card.matched{opacity:.2;transform:scale(.85)}.student-panel footer{color:#567078;background:#f0f6f2;border-radius:12px;align-items:center;gap:8px;min-height:35px;margin-top:12px;padding:8px 10px;font-size:.78rem;display:flex}.result-dot{background:#aebcba;border-radius:50%;flex:none;width:10px;height:10px}.result-dot.result-correct{background:#35b978}.result-dot.result-wrong{background:#ef775f}@media (width<=820px){.topbar{grid-template-columns:1fr auto;gap:12px}.controls{grid-column:1/-1;justify-content:center}.card-grid,.category-options{grid-template-columns:repeat(3,minmax(0,1fr))}.student-grid{grid-template-columns:1fr}.room-banner{grid-template-columns:auto 1fr}.room-banner button{grid-column:1/-1}}@media (width<=560px){.app{width:min(100% - 18px,1180px);padding-top:9px}.topbar{border-radius:22px;padding:11px}.brand .eyebrow{display:none}.rainbow{width:48px;height:48px;font-size:34px}.stats{gap:5px}.stat{min-width:70px;padding:7px 8px}.restart-button span{display:none}.game-shell{border-radius:25px;min-height:580px;margin-top:12px;padding:10px}.start-screen{min-height:570px}.zoo-sign{border-radius:28px;padding:40px 17px 25px}.mascot{width:82px;height:82px;font-size:60px;top:-38px}.difficulty-options{gap:6px}.difficulty{padding:10px 3px}.category-options{grid-template-columns:repeat(2,minmax(0,1fr))}.category{min-height:68px}.category>span{min-height:28px;font-size:1.45rem}.round-heading{grid-template-columns:1fr;padding:8px 4px 14px}.round-heading p{font-size:.8rem}.progress-track{grid-column:1}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{border-radius:19px;min-height:128px;padding:10px}.animal-art{font-size:clamp(3.4rem,18vw,5rem)}.word-label{font-size:clamp(.78rem,4.3vw,1.08rem)}.long-word .word-label{font-size:clamp(.66rem,3.5vw,.9rem)}.speak-button{width:34px;height:34px;top:7px;right:7px}.finish-actions{flex-direction:column}.class-fields{grid-template-columns:1fr}.teacher-dashboard{width:min(100% - 18px,1260px);padding-top:9px}.teacher-header{border-radius:22px;gap:10px;padding:13px}.teacher-mascot{width:54px;height:54px;font-size:38px}.back-link{position:absolute;top:116px;left:8px}.room-banner{text-align:center;grid-template-columns:1fr;margin-top:56px}.room-banner button{grid-column:1}.teacher-stats{gap:6px}.teacher-stats div{padding:10px 4px}.mini-board{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}