:root{--sky:#e4effb;--sky-deep:#cfe1f5;--accent:#f7ce68;--accent-shadow:#e3b449;--ink:#232a31;--ink-soft:#5b666f;--paper:#fff;--focus:#2f6fbf;--radius:28px;--tap:56px;color:var(--ink);background:var(--sky);font-family:"Baloo 2",system-ui,sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{background:var(--sky);overscroll-behavior:none;-webkit-tap-highlight-color:transparent;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.icon-btn{width:var(--tap);height:var(--tap);background:var(--paper);box-shadow:0 3px 0 var(--sky-deep);border:none;border-radius:50%;place-items:center;transition:transform .12s;display:grid}.icon-btn:hover{transform:translateY(-2px)}.icon-btn:active{box-shadow:none;transform:translateY(1px)}.icon-btn svg{width:28px;height:28px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.answers{grid-template-columns:repeat(3,1fr);gap:clamp(10px,2vw,16px);width:min(960px,100%);display:grid}@media (width>=900px){.answers{grid-template-columns:repeat(6,1fr)}}.answer{--slot:#d6d2c8;border-radius:var(--radius);background:var(--slot);border:4px solid #0000;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:clamp(64px,12dvh,116px);padding:10px 6px;transition:transform .12s,opacity .2s;display:flex;position:relative;box-shadow:0 5px #232a3124}.answer[data-slot="0"]{--slot:#f9d77e}.answer[data-slot="1"]{--slot:#9cc2df}.answer[data-slot="2"]{--slot:#f0a197}.answer[data-slot="3"]{--slot:#9fd6be}.answer[data-slot="4"]{--slot:#c3aee0}.answer[data-slot="5"]{--slot:#d6d2c8}.answer:not(:disabled):hover{transform:translateY(-3px)}.answer:not(:disabled):active{box-shadow:none;transform:translateY(2px)}.answer:disabled{cursor:default}.answers:has(.is-right) .answer:not(.is-right,.is-wrong){opacity:.45}.answer-shape{color:#232a318c;width:clamp(26px,5vw,34px);height:clamp(26px,5vw,34px)}.answer-label{text-align:center;font-size:clamp(17px,2.6vw,22px);font-weight:600;line-height:1.1}.answer-mark{width:40px;height:40px;color:var(--paper);border-radius:50%;place-items:center;display:grid;position:absolute;top:-14px;right:-10px;box-shadow:0 3px #232a3133}.answer-mark svg{width:26px;height:26px}.answer.is-right{border-color:var(--ink);animation:.5s nod}.answer.is-right .answer-mark{background:#2e7d4f}.answer.is-wrong{border-color:var(--ink);border-style:dashed;animation:.4s shake}.answer.is-wrong .answer-mark{background:#b3261e}@keyframes nod{50%{transform:translateY(-10px)}}@keyframes shake{25%{transform:translate(-7px)}75%{transform:translate(7px)}}.face-stage{width:100%;height:100%;position:relative}.face-img{object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;transition:opacity var(--face-fade) ease-in-out;position:absolute;inset:0}.has-neutral .face-expression,.has-neutral.is-expressed .face-neutral{opacity:0}.has-neutral.is-expressed .face-expression{opacity:1}.streak{background:var(--paper);box-shadow:0 3px 0 var(--sky-deep);border-radius:999px;flex-wrap:wrap;justify-content:center;gap:clamp(2px,1vw,6px);padding:8px clamp(10px,3vw,14px);display:flex}.star{width:clamp(20px,6vw,36px);height:clamp(20px,6vw,36px);color:var(--sky-deep);transition:color .25s,transform .25s}.star.lit{color:var(--accent);filter:drop-shadow(0 2px 0 var(--accent-shadow));transform:scale(1.12)}.help{background:var(--paper);width:min(720px,100% - 32px);max-height:calc(100dvh - 32px);color:var(--ink);border:none;border-radius:36px;margin:auto;padding:72px 24px 32px}.help::backdrop{background:#232a3173}.help-close{background:var(--sky);box-shadow:none;position:absolute;top:16px;right:16px}.help-steps{grid-template-columns:repeat(3,1fr);gap:16px;list-style:none;display:grid}.help-step{flex-direction:column;align-items:center;gap:10px;display:flex;position:relative}.help-art{aspect-ratio:1;background:var(--sky);border-radius:28px;place-items:center;width:100%;max-width:180px;padding:16%;display:grid}.help-art svg{width:100%;height:100%}.help-star{color:var(--accent);filter:drop-shadow(0 4px 0 var(--accent-shadow))}.help-number{background:var(--ink);width:40px;height:40px;color:var(--paper);border-radius:50%;place-items:center;font-size:22px;font-weight:700;display:grid;position:absolute;top:-12px;left:-4px}.help-word{font-size:24px;font-weight:700}@media (width<=480px){.help-steps{grid-template-columns:1fr;justify-items:center}.help-art{max-width:140px}}.lang{justify-self:end;position:relative}.lang-current{height:var(--tap);min-width:var(--tap);background:var(--paper);box-shadow:0 3px 0 var(--sky-deep);border:none;border-radius:999px;padding:0 18px;font-size:20px;font-weight:700}.lang-list{top:calc(var(--tap) + 8px);z-index:20;background:var(--paper);border-radius:20px;min-width:190px;padding:8px;list-style:none;position:absolute;right:0;box-shadow:0 8px 24px #232a3129}.lang-list button{text-align:left;background:0 0;border:none;border-radius:14px;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px 12px;font-size:18px;font-weight:500;display:flex}.lang-list button:hover,.lang-list button[aria-current=true]{background:var(--sky)}.lang-list button[aria-current=true]{font-weight:700}.lang-code{min-width:2.2em;font-weight:700}.join-step{flex-direction:column;align-items:center;gap:clamp(12px,3dvh,24px);width:min(560px,100%);margin:auto;display:flex}.icon-grid{grid-template-columns:repeat(4,1fr);gap:clamp(8px,2vw,14px);width:100%;display:grid}@media (aspect-ratio>=4/3) and (height<=700px){.join-step{width:min(760px,100%)}.icon-grid{grid-template-columns:repeat(6,1fr)}}.icon-tile{aspect-ratio:1;background:var(--paper);box-shadow:0 4px 0 var(--sky-deep);border:4px solid #0000;border-radius:22px;place-items:center;padding:14%;transition:transform .12s,opacity .2s;display:grid}.icon-tile svg{width:100%;height:100%}.icon-tile:not(:disabled):hover{transform:translateY(-3px)}.icon-tile:not(:disabled):active{box-shadow:none;transform:translateY(2px)}.icon-tile:disabled{cursor:default;opacity:.5}.icon-tile[aria-checked=true]{border-color:var(--ink);background:#fdf1cf;transform:translateY(-3px)}.icon-grid.is-busy{animation:.8s ease-in-out infinite alternate breathe}.name-row{gap:12px;width:100%;display:flex}.name-input{background:var(--paper);min-width:0;height:64px;box-shadow:0 3px 0 var(--sky-deep);font:inherit;color:var(--ink);border:4px solid #0000;border-radius:999px;flex:1;padding:0 20px;font-size:24px;font-weight:600}.name-input::placeholder{color:var(--ink-soft);opacity:.7}.name-input:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.name-input[aria-invalid=true]{border-style:dashed;border-color:#b3261e}.go-btn,.erase-btn{flex:none;width:64px;height:64px}.go-btn{background:var(--accent);box-shadow:0 4px 0 var(--accent-shadow)}.go-btn svg,.erase-btn svg{width:32px;height:32px}.go-btn:disabled,.erase-btn:disabled{cursor:default;opacity:.4;transform:none}.code-row{align-items:center;gap:12px;width:100%;display:flex}.code-field{flex:1;position:relative}.code-slots{grid-template-columns:repeat(5,1fr);gap:clamp(6px,1.5vw,10px);display:grid}.code-slot{aspect-ratio:1;border:3px dashed var(--ink-soft);border-radius:18px;place-items:center;padding:12%;display:grid}.code-slot.is-filled{background:var(--paper);border:3px solid #0000;animation:.25s ease-out pop}.code-slot svg{width:100%;height:100%}.code-slots.is-shaking{animation:.4s shake}.join-error{background:var(--paper);text-align:center;border-radius:999px;align-items:center;gap:10px;padding:10px 20px;font-size:clamp(18px,2.6vw,22px);font-weight:600;display:flex}.join-error-mark{width:32px;height:32px;color:var(--paper);background:#b3261e;border-radius:8px;flex:none;place-items:center;padding:4px;display:grid}.join-error-mark svg{width:100%;height:100%}.code-error{width:fit-content;max-width:100%;height:fit-content;box-shadow:0 3px 0 var(--sky-deep);margin:auto;animation:.25s ease-out pop;position:absolute;inset:0}.lobby{flex-direction:column;align-items:center;gap:clamp(16px,3dvh,28px);width:min(760px,100%);margin:auto;display:flex}.lobby-me{flex-direction:column;align-items:center;gap:8px;display:flex}.lobby-me-icon{background:var(--paper);width:clamp(120px,26dvh,200px);height:clamp(120px,26dvh,200px);box-shadow:0 6px 0 var(--sky-deep);border-radius:40px;padding:20px;animation:2.4s ease-in-out infinite bob}.lobby-me-name{font-size:clamp(26px,4vw,36px);font-weight:700}.lobby-players{flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;display:flex}.lobby-player{background:var(--paper);border-radius:999px;align-items:center;gap:8px;padding:6px 16px 6px 6px;font-size:20px;font-weight:600;animation:.3s ease-out pop;display:flex}.lobby-player svg{width:40px;height:40px}.waiting{color:var(--ink-soft);align-items:baseline;font-size:clamp(20px,3vw,26px);font-weight:600;display:flex}.waiting-dots:after{content:"";text-align:left;width:1.5em;animation:1.4s steps(4,end) infinite dots;display:inline-block}@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}@keyframes bob{50%{transform:translateY(-8px)}}.round-waiting{background:var(--paper);white-space:nowrap;border-radius:999px;padding:6px 20px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.room-code{background:var(--paper);box-shadow:0 3px 0 var(--sky-deep);border-radius:999px;gap:4px;padding:6px 12px;display:flex}.room-code svg{width:clamp(24px,6vw,34px);height:clamp(24px,6vw,34px)}.finished{text-align:center;flex-direction:column;align-items:center;gap:20px;margin:auto;display:flex}.finished-star{width:clamp(120px,30dvh,220px);height:clamp(120px,30dvh,220px);color:var(--accent);filter:drop-shadow(0 6px 0 var(--accent-shadow));animation:.5s ease-out pop,2.4s ease-in-out .5s infinite bob}.finished p{font-size:clamp(32px,6vw,48px);font-weight:700}.finished-score{border-radius:24px;max-width:min(560px,100%)}.home-btn{background:var(--accent);width:80px;height:80px;box-shadow:0 4px 0 var(--accent-shadow)}.home-btn svg{width:40px;height:40px}.room-main{min-height:0;padding:8px max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));display:flex;overflow-y:auto}.app{background:var(--sky);grid-template-rows:auto minmax(0,1fr) auto;height:100dvh;display:grid;overflow:hidden}.topbar{padding:max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 8px max(16px, env(safe-area-inset-left));grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;display:grid}.topbar-start{justify-self:start;gap:8px;display:flex}.face-area{min-height:0;padding:8px max(16px, env(safe-area-inset-right)) 8px max(16px, env(safe-area-inset-left));place-items:center;display:grid;position:relative}.answer-bar{padding:8px max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));justify-content:center;display:flex}.face-loading{aspect-ratio:500/640;background:var(--sky);border-radius:50%;height:70%;animation:1.4s ease-in-out infinite alternate breathe}@keyframes breathe{to{opacity:.4}}.notice{text-align:center;color:var(--ink-soft);flex-direction:column;align-items:center;gap:16px;display:flex}.notice>svg{width:clamp(96px,20dvh,150px);height:clamp(96px,20dvh,150px)}.notice p{color:var(--ink);font-size:clamp(20px,3vw,26px);font-weight:600}.retry-btn{background:var(--accent);width:72px;height:72px;box-shadow:0 4px 0 var(--accent-shadow);color:var(--ink)}.retry-btn svg{width:36px;height:36px}.verdict{top:8px;right:max(16px, env(safe-area-inset-right));pointer-events:none;position:absolute}.verdict-mark{border:5px solid var(--paper);width:80px;height:80px;color:var(--paper);place-items:center;animation:.35s ease-out pop;display:grid}.verdict-mark svg{width:48px;height:48px}.verdict-mark.is-right{background:#2e7d4f;border-radius:50%}.verdict-mark.is-wrong{background:#b3261e;border-radius:18px}@keyframes pop{0%{opacity:0;transform:scale(.4)}}@media (width<=360px){:root{--tap:48px}}