/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@import "https://fonts.googleapis.com/css2?family=Itim&display=swap";@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,optgroup,select,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.start{inset-inline-start:var(--spacing)}}*{box-sizing:border-box}body,html{overscroll-behavior:none;min-height:100%;margin:0}button{font:inherit}body{color:#244d43;background:#e8ffe1;font-family:Itim,cursive}.app{background:#66c8f2 url(/game-background.png) 50%/cover no-repeat fixed;min-height:100vh;position:relative;overflow:hidden}.homeBg{background:#83d7ef url(/grammar-snake-front.png) 50%/100% 100% no-repeat}.app:not(.homeBg):after,.app:not(.homeBg)>.cloud,.homeBg:after,.homeBg>.cloud{display:none}.homeBg .home{width:100%;max-width:none;height:100vh;min-height:0;margin:0;padding:0;display:block}.homeBg .brand{display:none}.homeBg .levelCard{background:#fffdf8;border:0;border-radius:2.1vw;width:36.8%;height:57%;padding:2% 1.9%;position:absolute;top:18.7%;left:57.3%;box-shadow:0 12px #39725255,0 22px 35px #1f64404a}.homeBg .cardTitle h3{margin:2px 0 1vw;font-size:clamp(19px,1.65vw,30px)}.homeBg .cardTitle small{font-size:clamp(9px,.78vw,14px)}.homeBg .sound{width:clamp(34px,3vw,50px);height:clamp(34px,3vw,50px)}.homeBg .levels{gap:clamp(7px,.8vw,13px)}.homeBg .levels button{min-height:clamp(45px,5vw,72px);padding:clamp(6px,.75vw,12px)}.homeBg .levels button>span{font-size:clamp(19px,1.65vw,29px)}.homeBg .levels b{font-size:clamp(11px,.9vw,16px)}.homeBg .how{margin-top:clamp(8px,1.1vw,18px);padding:clamp(7px,.75vw,13px)}.homeBg .how span{font-size:clamp(9px,.73vw,13px)}.app:after{content:"";pointer-events:none;background:radial-gradient(at 10% 100%,#49ab58 0 36%,#0000 37%),radial-gradient(at 40% 110%,#6dc95d 0 40%,#0000 41%),radial-gradient(at 80% 100%,#43a957 0 38%,#0000 39%);height:110px;position:fixed;bottom:0;left:0;right:0}.cloud{opacity:.7;filter:brightness(4);z-index:0;font-size:70px;position:fixed}.c1{top:5%;left:7%}.c2{top:12%;right:7%;transform:scale(.7)}.home{z-index:1;grid-template-columns:.9fr 1.1fr;gap:45px;max-width:1120px;min-height:94vh;margin:auto;padding:38px 28px 110px;display:grid;position:relative}.brand,.home{align-items:center}.brand{gap:8px;display:flex}.mascot{filter:drop-shadow(0 12px 2px #23713d33);font-size:120px;animation:bob 2.2s ease-in-out infinite}.brand p{letter-spacing:3px;color:#238154;margin:0;font-size:14px}.brand h1{color:#174b41;text-shadow:0 3px #fff;margin:12px 0;font-size:62px;line-height:.86}.brand h1 b{color:#ef714b}.brand h2{color:#418778;font-size:23px;font-weight:400}.levelCard{background:#fffdf5;border:5px solid #fff;border-radius:28px;padding:24px;box-shadow:0 14px #368d6266,0 25px 40px #275d6340}.cardTitle{justify-content:space-between;align-items:center;display:flex}.cardTitle small,.qtop span{letter-spacing:1.5px;color:#ef805a}.cardTitle h3{margin:3px 0 14px;font-size:28px}.sound{background:#e8f9e6;border:0;border-radius:50%;width:48px;height:48px;font-size:22px}.levels{grid-template-columns:1fr 1fr;gap:11px;display:grid}.levels button{--accent:#5bc;text-align:left;border:2px solid var(--accent);align-items:center;gap:10px;display:flex}@supports (color:color-mix(in lab,red,red)){.levels button{border:2px solid color-mix(in srgb,var(--accent),white 50%)}}.levels button{background:var(--accent)}@supports (color:color-mix(in lab,red,red)){.levels button{background:color-mix(in srgb,var(--accent),white 87%)}}.levels button{color:#265045;border-radius:16px;padding:11px;transition:all .15s}.levels button:hover{box-shadow:0 5px 0 var(--accent);transform:translateY(-2px)}@supports (color:color-mix(in lab,red,red)){.levels button:hover{box-shadow:0 5px 0 color-mix(in srgb,var(--accent),white 35%)}}.levels button>span{font-size:27px}.levels small{color:#789288;font-size:10px;display:block}.levels b{font-size:15px;display:block}.levels i{color:var(--accent);margin-left:auto;font-style:normal}.how{color:#7c6430;background:#fff3c7;border-radius:14px;align-items:center;gap:12px;margin-top:17px;padding:13px 16px;display:flex}.how span{font-size:13px}.game{z-index:2;max-width:950px;margin:auto;padding:18px 20px 80px;position:relative}.game header{background:#fffef7;border:3px solid #fff;border-radius:20px;align-items:center;gap:12px;height:68px;margin-bottom:16px;padding:9px 15px;display:flex;box-shadow:0 7px #3a866d55}.game header button{color:#306e5f;background:#e8f7e5;border:0;border-radius:11px;padding:10px 13px}.game header>div:nth-child(2){margin-right:auto}.game header small{color:#ef7553;letter-spacing:1px;font-size:10px;display:block}.game header b{font-size:18px}.stat{gap:8px;display:flex}.stat span{background:#fff1b6;border-radius:11px;padding:8px 12px}.boardWrap{aspect-ratio:5/3;border:8px solid #fff8df;border-radius:22px;width:min(100%,720px);margin:auto;position:relative;overflow:hidden;box-shadow:0 10px #39835e,0 17px 28px #245d5a55}.boardWrap canvas{width:100%;height:100%;display:block}.pause{color:#fff;background:#184d4688;place-items:center;font-size:48px;display:grid;position:absolute;inset:0}.controls{text-align:center;width:190px;margin:16px auto 0;display:none}.controls button{color:#357d60;background:#fff;border:0;border-radius:12px;width:58px;height:48px;margin:2px;font-size:19px;box-shadow:0 5px #4b9e73}.controls button:active{transform:translateY(4px);box-shadow:0 1px #4b9e73}.hint{text-align:center;color:#33745f;margin:18px 0}.modal{z-index:10;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#164d477d;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.question{background:#fffdf5;border:6px solid #fff;border-radius:28px;width:min(620px,94vw);padding:25px;box-shadow:0 13px #2a735e,0 25px 50px #173e3e88}.qtop{justify-content:space-between;display:flex}.qtop b{background:#e9f8df;border-radius:10px;padding:5px 10px;font-size:13px}.question>p{text-align:center;color:#6a857a;margin:16px 0 5px}.question>h3{text-align:center;color:#224e45;margin:6px 0 22px;font-size:28px}.answers{grid-template-columns:1fr 1fr;gap:12px;display:grid}.answers button{text-align:left;color:#28574b;background:#fff;border:2px solid #c8e6d5;border-radius:14px;padding:13px;font-size:18px}.answers button:hover:not(:disabled){background:#efffeb;border-color:#64bd84}.answers i{background:#e4f4df;border-radius:8px;place-items:center;width:28px;height:28px;margin-right:9px;font-style:normal;display:inline-grid}.answers .correct{background:#d7f8d5;border-color:#51bd69}.answers .wrong{background:#ffe2dc;border-color:#ef755f}.feedback{text-align:center;border-radius:12px;margin-top:15px;padding:10px;font-size:18px}.good{color:#258045;background:#d8f7d2}.bad{color:#aa623a;background:#fff0d2}.resultCard{text-align:center;background:#fffdf5;border:6px solid #fff;border-radius:30px;width:min(430px,92vw);padding:28px;box-shadow:0 14px #2a735e}.celebrate{font-size:36px;animation:bob 1.2s infinite}.resultCard h2{color:#ef704c;margin:10px;font-size:38px}.resultCard p{color:#628177}.scoreBox{background:#e9f8df;border-radius:18px;margin:18px;padding:14px}.scoreBox small{letter-spacing:2px;display:block}.scoreBox>b{color:#2c9b59;font-size:52px;display:block}.scoreBox b i{color:#709084;font-size:21px}.scoreBox span{display:block}.resultCard button{border:0;border-radius:13px;width:100%;margin-top:9px;padding:12px}.primary{color:#fff;background:#4cc56b;box-shadow:0 5px #258748}.secondary{color:#39705e;background:#e9f3e5}footer{z-index:5;color:#fff;white-space:nowrap;background:#174e43cc;border:1px solid #ffffff80;border-radius:14px;justify-content:center;align-items:center;gap:10px;width:max-content;max-width:calc(100% - 24px);padding:5px 13px;font-size:13px;display:flex;position:fixed;bottom:8px;left:50%;transform:translate(-50%);box-shadow:0 4px 12px #174e4340}.ccLogo{background:url(/cc-by-nc-sa.webp) 50%/contain no-repeat;border-radius:3px;flex:0 0 92px;width:92px;height:33px;display:block}@keyframes bob{50%{transform:translateY(-9px)rotate(-2deg)}}@media (max-width:760px){.home{grid-template-columns:1fr;gap:5px;padding-top:16px}.brand{justify-content:center}.mascot{font-size:70px}.brand h1{font-size:40px}.brand h2{font-size:18px}.levelCard{padding:17px}.game{padding-top:8px}.controls{display:block}.hint{display:none}}@media (orientation:portrait) and (max-width:760px){.homeBg{background-position:43%;background-size:cover}.homeBg .levelCard{border-radius:22px;width:90%;height:auto;padding:16px;top:32%;left:5%}.homeBg .cardTitle h3{font-size:23px}.homeBg .levels button{min-height:51px}.homeBg .how span{font-size:10px}}@media (max-width:560px){footer{gap:6px;padding:4px 8px;font-size:10px}.ccLogo{flex-basis:70px;width:70px;height:25px}}@media (orientation:landscape) and (max-height:650px){.app:after,.cloud{display:none}.home{grid-template-columns:.8fr 1.2fr;gap:25px;min-height:100vh;padding:10px 24px 48px}.mascot{font-size:75px}.brand h1{font-size:42px}.brand h2{font-size:16px}.levelCard{padding:14px}.how,.levels button{padding:7px}.how{margin-top:8px}.game{grid-template-columns:1fr 170px;gap:10px;max-width:950px;padding:8px 8px 48px;display:grid}.game header{grid-column:1/3;height:54px;margin:0}.boardWrap{width:min(100%,700px)}.controls{align-self:center;width:170px;display:block}.hint{display:none}.question{padding:15px}.question>h3{margin:4px 0 12px}.answers button{padding:9px}footer{padding:3px 8px;font-size:10px;bottom:4px}.ccLogo{flex-basis:70px;width:70px;height:25px}}