@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:600;src:url(/kata-ceria/assets/fredoka-latin-600-normal-C4zohCW5.woff2)format("woff2"),url(/kata-ceria/assets/fredoka-latin-600-normal-CcrEjrB4.woff)format("woff")}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#fff4e0;--surface:#fff;--ink:#3a2747;--ink-2:#6a5a78;--line:#ecdcbf;--shade:#e6d2b0;--aksen:#ff6b6b;--aksen-d:#c93c3c;--go:#2fb36b;--go-d:#1d8a4e;--merah:#ff6b6b;--merah-d:#c93c3c;--biru:#4dabf7;--biru-d:#1c6fb8;--kuning:#ffd23f;--kuning-d:#b98a00;--hijau:#5bd18b;--hijau-d:#1f8f55;--ungu:#b07cf0;--ungu-d:#7444b8;--oranye:#ff9f40;--oranye-d:#c4620b;--radius:22px;--keping:78px;--font:"Fredoka", ui-rounded, "Nunito", system-ui, sans-serif;--pantul:cubic-bezier(.34, 1.56, .64, 1)}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--ink);font-family:var(--font);-webkit-tap-highlight-color:transparent;margin:0;font-weight:500}body{background:radial-gradient(120% 60% at 50% -10%, #fffaf0 0%, transparent 60%), var(--bg);overscroll-behavior:none;min-height:100dvh}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0}button:focus-visible{outline:4px solid var(--biru-d);outline-offset:3px}a:focus-visible{outline:4px solid var(--biru-d);outline-offset:3px}svg{display:block}[hidden]{display:none!important}.k-merah{--c:var(--merah);--d:var(--merah-d)}.k-biru{--c:var(--biru);--d:var(--biru-d)}.k-kuning{--c:var(--kuning);--d:var(--kuning-d)}.k-hijau{--c:var(--hijau);--d:var(--hijau-d)}.k-ungu{--c:var(--ungu);--d:var(--ungu-d)}.k-oranye{--c:var(--oranye);--d:var(--oranye-d)}.layar{max-width:760px;min-height:100dvh;padding:max(12px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));flex-direction:column;margin:0 auto;display:flex}.icon-btn,.tema-kartu,.mode-btn,.lanjut,.galeri-item{background:var(--surface);border-radius:var(--radius);box-shadow:0 5px 0 var(--shade), 0 10px 22px #50340a12;transition:transform .12s ease-out,box-shadow .12s ease-out,background-color .15s}:-webkit-any(.icon-btn,.tema-kartu,.mode-btn,.lanjut,.galeri-item):active:not(:disabled){box-shadow:0 1px 0 var(--shade), 0 3px 8px #50340a12;transform:translateY(4px)scale(.98)}:is(.icon-btn,.tema-kartu,.mode-btn,.lanjut,.galeri-item):active:not(:disabled){box-shadow:0 1px 0 var(--shade), 0 3px 8px #50340a12;transform:translateY(4px)scale(.98)}@media (hover:hover){:-webkit-any(.icon-btn,.tema-kartu,.mode-btn,.galeri-item):hover{background:#fffdf8}:is(.icon-btn,.tema-kartu,.mode-btn,.galeri-item):hover{background:#fffdf8}}.icon-btn{flex:none;place-items:center;width:64px;height:64px;display:grid}.icon-btn svg{width:32px;height:32px}.sound-btn .off,[data-sound=off] .sound-btn .on{display:none}[data-sound=off] .sound-btn .off{color:var(--ink-2);display:block}.ubin-baris{gap:6px;display:inline-flex}.ubin{background:var(--c);color:#fff;letter-spacing:.02em;min-width:52px;height:52px;box-shadow:inset 0 -5px 0 var(--d);text-shadow:0 2px 0 var(--d);border-radius:14px;place-items:center;padding:0 8px;font-size:26px;font-weight:700;display:grid}.ubin-baris.kecil .ubin{min-width:36px;height:44px;padding:0 4px;font-size:22px}.menu{gap:18px}.menu-atas{justify-content:space-between;align-items:center;gap:12px;display:flex}.logo{align-items:center;gap:10px;margin:0;font-size:0;display:flex}.logo .ubin:first-child{transform:rotate(-6deg)}.logo .ubin:nth-child(2){transform:rotate(5deg)translateY(2px)}.logo-ceria{letter-spacing:-.02em;color:var(--aksen);text-shadow:0 3px #ffd0c4;font-size:clamp(32px,9vw,46px);font-weight:700;line-height:1.1}.tema-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.tema-kartu{flex-direction:column;align-items:center;gap:6px;min-height:150px;padding:14px 10px 12px;display:flex}.tema-gambar{aspect-ratio:1;background:var(--tc);width:min(118px,30vw);transition:transform .3s var(--pantul);border-radius:50%;place-items:center;display:grid}.tema-gambar svg{width:88%;height:88%}.tema-kartu:active .tema-gambar{transform:scale(1.06)rotate(-4deg)}.tema-nama{color:var(--ink-2);font-size:17px;font-weight:600}.t-hewan{--tc:#ffe8c2}.t-makanan{--tc:#ffe0e4}.t-rumah{--tc:#d9f5ef}.t-sekolah{--tc:#e3edff}.mode-pilih{grid-template-columns:1fr 1fr;gap:14px;display:grid}.mode-btn{border:4px solid #0000;place-items:center;min-height:84px;padding:10px;display:grid}.mode-btn .ubin{min-width:46px;height:46px;font-size:22px}.mode-btn .ubin-baris.kecil .ubin{min-width:30px;height:40px;font-size:19px}.mode-btn[aria-pressed=false]{opacity:.55}.mode-btn[aria-pressed=false] .ubin{filter:saturate(.4)}.mode-btn[aria-pressed=true]{border-color:var(--go);box-shadow:0 5px 0 var(--go-d), 0 10px 22px #1d8a4e2e}.menu-kaki{color:var(--ink-2);flex-direction:column;align-items:center;gap:6px;margin-top:auto;padding-top:8px;display:flex}.guru-link{color:var(--ink-2);text-underline-offset:4px;padding:12px 8px;font-weight:600}.bar{justify-content:space-between;align-items:center;gap:10px;display:flex}.titik{flex-wrap:wrap;justify-content:center;gap:6px;margin:0;padding:0;list-style:none;display:flex}.titik li{background:var(--line);width:12px;height:12px;transition:background-color .3s, transform .3s var(--pantul);border-radius:50%}.titik li.kini{background:var(--kuning);transform:scale(1.25)}.titik li.sudah{background:var(--go)}.main{gap:10px;height:100dvh;min-height:560px}.panggung{flex-direction:column;align-items:center;gap:12px;display:flex}.gambar{aspect-ratio:1;background:var(--surface);width:clamp(128px,26dvh,230px);box-shadow:0 6px 0 var(--shade);border-radius:28px;place-items:center;display:grid;position:relative}.gambar svg{width:90%;height:90%;transition:filter .4s,opacity .4s}.gambar:disabled{cursor:default}.gambar.siluet svg{filter:brightness(0);opacity:.1}.gambar.muncul svg{animation:muncul .7s var(--pantul)}@keyframes muncul{0%{transform:scale(.5)rotate(-8deg)}to{transform:none}}.slot-baris{justify-content:center;gap:14px;max-width:100%;display:flex}.grup{gap:8px;display:flex}.mode-huruf .slot-baris{gap:10px}.mode-huruf .grup{gap:3px}.slot{width:var(--keping);height:calc(var(--keping) + 10px);transition:transform .2s var(--pantul), border-color .2s, background-color .2s;background:#ffffff8c;border:4px dashed #d8c39f;border-radius:20px;place-items:center;display:grid;position:relative}.slot .bayang{font-size:calc(var(--keping) * .36);color:#d8c39f;pointer-events:none;font-weight:700}.slot-baris.siap .slot:not(.terisi),.slot.dekat{border-color:var(--go);background:#eafbf1}.slot.dekat{transform:scale(1.08)}.slot.terisi{background:0 0;border-color:#0000}.slot.terisi .bayang{display:none}.slot.dibaca{transform:translateY(-10px)scale(1.12)}.slot-baris.utuh .slot{animation:utuh .6s var(--pantul) both}.slot-baris.utuh .slot:nth-child(2){animation-delay:50ms}.slot-baris.utuh .slot:nth-child(3){animation-delay:.1s}@keyframes utuh{50%{transform:translateY(-8px)}}.kalimat{color:var(--ink-2);text-align:center;margin:0;font-size:18px;font-weight:600;animation:.4s ease-out naik}@keyframes naik{0%{opacity:0;transform:translateY(8px)}}.arena{touch-action:none;background:radial-gradient(circle at 20% 30%,#fff9ee 0 30px,#0000 31px),radial-gradient(circle at 80% 70%,#fff9ee 0 44px,#0000 45px),#fdebcb;border-radius:28px;flex:1;min-height:190px;position:relative}.keping{width:var(--keping);height:var(--keping);touch-action:none;z-index:1;will-change:transform;position:absolute}.keping-tubuh{background:var(--c);box-shadow:inset 0 -7px 0 var(--d), 0 6px 12px #3a274729;transform-origin:50% 90%;border-radius:46% 54% 44% 56%/52% 48%;place-items:center;padding-top:14px;animation:2.4s ease-in-out infinite goyang;display:grid;position:absolute;top:0;bottom:0;left:0;right:0}.keping:nth-child(2n) .keping-tubuh{animation-duration:2.9s;animation-delay:-.6s}.keping:nth-child(3n) .keping-tubuh{animation-duration:2.1s;animation-delay:-1.2s}@keyframes goyang{0%,to{transform:rotate(-4deg)scaleY(1)}50%{transform:rotate(4deg)scaleY(.95)}}.keping-mata{background:radial-gradient(circle at 20%,#fff 0 22%,#0000 24%),radial-gradient(circle at 80%,#fff 0 22%,#0000 24%);width:34%;height:16%;position:absolute;top:16%;left:50%;transform:translate(-50%)}.keping-mata:before,.keping-mata:after{content:"";aspect-ratio:1;background:var(--ink);border-radius:50%;width:18%;animation:4s infinite kedip;position:absolute;top:28%}.keping-mata:before{left:13%}.keping-mata:after{right:13%}@keyframes kedip{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}.keping-teks{font-size:calc(var(--keping) * .34);color:#fff;text-shadow:0 2px 0 var(--d);letter-spacing:.01em;font-weight:700;line-height:1}.keping.dipegang,.keping.diseret{z-index:5}.keping.dipegang .keping-tubuh{animation:.35s ease-in-out infinite geli}@keyframes geli{0%,to{transform:rotate(-7deg)scale(1.06)}50%{transform:rotate(7deg)scale(1.06)}}.keping.dipilih .keping-tubuh{box-shadow:inset 0 -7px 0 var(--d), 0 0 0 5px #fff, 0 0 0 9px var(--go);animation:.6s ease-in-out infinite geli}.keping.pulang{transition:transform .5s var(--pantul)}.keping.mantul .keping-tubuh{animation:.6s ease-out mantul}@keyframes mantul{25%{transform:scale(1.12,.86)}50%{transform:scale(.94,1.08)rotate(-6deg)}75%{transform:scale(1.03,.97)rotate(4deg)}}.keping.terpasang{cursor:default;width:auto;height:auto;position:absolute;top:-4px;bottom:-4px;left:-4px;right:-4px}.keping.terpasang .keping-tubuh{border-radius:20px;animation:none}.keping.meluncur{transition:transform .35s cubic-bezier(.22,1,.36,1)}.slot-baris.utuh .keping-tubuh,.slot.dibaca .keping-tubuh{box-shadow:inset 0 -7px 0 var(--d), 0 0 0 4px #fff, 0 8px 16px #3a274733}.mode-huruf{--keping:66px}.mode-huruf .slot{width:clamp(44px,16.6667vw - 10.6667px,66px);height:80px}.mode-huruf .slot .bayang,.mode-huruf .keping.terpasang .keping-teks{font-size:24px}.lanjut{background:var(--go);color:#fff;width:88px;height:88px;box-shadow:0 6px 0 var(--go-d), 0 12px 24px #1d8a4e47;z-index:6;animation:lanjut-masuk .5s var(--pantul), denyut 1.6s ease-in-out .6s infinite;border-radius:50%;place-items:center;display:grid;position:absolute;bottom:14px;right:14px}.lanjut svg{width:44px;height:44px}.lanjut:active{box-shadow:0 1px 0 var(--go-d)}.lanjut.statis{position:static}@keyframes lanjut-masuk{0%{transform:scale(0)}}@keyframes denyut{50%{transform:scale(1.07)}}.gambar.bereaksi svg,.galeri-item.bereaksi svg{animation:var(--anim) both}.r-lompat{--anim:lompat .9s var(--pantul)}.r-pantul{--anim:pantul 1s ease-out}.r-goyang{--anim:goyang-gambar .9s ease-in-out}.r-putar{--anim:putar .9s var(--pantul)}.r-angguk{--anim:angguk .9s ease-in-out}@keyframes lompat{30%{transform:translateY(-30%)scale(.95,1.08)}60%{transform:translateY(0)scale(1.1,.88)}80%{transform:translateY(-6%)}}@keyframes pantul{20%{transform:translateY(-28%)}40%{transform:translateY(0)scale(1.12,.86)}60%{transform:translateY(-12%)}80%{transform:translateY(0)scale(1.05,.95)}}@keyframes goyang-gambar{20%{transform:rotate(-10deg)}40%{transform:rotate(9deg)}60%{transform:rotate(-6deg)}80%{transform:rotate(3deg)}}@keyframes putar{60%{transform:rotate(370deg)scale(1.1)}to{transform:rotate(360deg)}}@keyframes angguk{25%{transform:translateY(4%)rotate(4deg)scale(1.04,.96)}50%{transform:translateY(-4%)rotate(-3deg)}75%{transform:translateY(3%)scale(1.03,.97)}}.bereaksi .ekor{transform-box:fill-box;transform-origin:0;animation:.25s ease-in-out 4 alternate kibas}.bereaksi .roda{transform-box:fill-box;transform-origin:50%;animation:.9s ease-out putar-roda}.bereaksi .tentakel.t0{transform-box:fill-box;transform-origin:50% 0;animation:.3s ease-in-out 3 alternate kibas}.bereaksi .tentakel.t1{transform-box:fill-box;transform-origin:50% 0;animation:.3s ease-in-out .15s 3 alternate kibas}.bereaksi .mata{transform-box:fill-box;transform-origin:50%;animation:.9s kedip-gambar}@keyframes kibas{to{transform:rotate(14deg)}}@keyframes putar-roda{to{transform:rotate(720deg)}}@keyframes kedip-gambar{10%,30%{transform:scaleY(.1)}20%{transform:none}}.tamat{align-items:stretch;gap:14px;position:relative;overflow:hidden}.tamat-judul{text-align:center;letter-spacing:-.02em;color:var(--aksen);text-shadow:0 4px #ffd0c4;animation:muncul .7s var(--pantul);margin:0;font-size:52px;font-weight:700;line-height:1.1}.galeri{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px;display:grid}.galeri-item{color:var(--ink-2);flex-direction:column;align-items:center;padding:8px 6px 10px;font-size:17px;font-weight:700;display:flex}.galeri-item svg{aspect-ratio:1;width:100%}.tamat-aksi{justify-content:center;padding:8px 0 12px;display:flex}.hore{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.hore span{background:var(--merah);border-radius:4px;width:14px;height:18px;animation:2.6s linear forwards jatuh;position:absolute;top:-20px}.hore span:nth-child(3n){background:var(--kuning)}.hore span:nth-child(3n+1){background:var(--biru)}.hore span:nth-child(4n){background:var(--hijau)}.hore span:first-child{animation-delay:0s;left:6%}.hore span:nth-child(2){animation-delay:.3s;left:14%}.hore span:nth-child(3){animation-delay:.1s;left:23%}.hore span:nth-child(4){animation-delay:.5s;left:31%}.hore span:nth-child(5){animation-delay:.2s;left:40%}.hore span:nth-child(6){animation-delay:.6s;left:48%}.hore span:nth-child(7){animation-delay:.15s;left:57%}.hore span:nth-child(8){animation-delay:.45s;left:65%}.hore span:nth-child(9){animation-delay:50ms;left:73%}.hore span:nth-child(10){animation-delay:.35s;left:81%}.hore span:nth-child(11){animation-delay:.25s;left:89%}.hore span:nth-child(12){animation-delay:.55s;left:95%}@keyframes jatuh{to{transform:translateY(105dvh)rotate(540deg)}}@media (orientation:landscape) and (min-width:820px){.main{grid-template-rows:auto 1fr;grid-template-columns:minmax(320px,1fr) 1.2fr;column-gap:22px;max-width:1180px;display:grid}.main .bar{grid-column:1/-1}.main .panggung{justify-content:center;gap:20px}.main .gambar{width:clamp(180px,34dvh,280px)}.main{--keping:92px}.main.mode-huruf{--keping:74px}.mode-huruf .slot{width:66px}.menu{max-width:980px}.tema-grid{grid-template-columns:repeat(4,1fr)}.tema-gambar{width:150px}.mode-pilih{width:100%;max-width:620px;margin:0 auto}.tamat{max-width:980px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}