.mm{--mm-eye:#15172b;--mm-tongue:var(--red);--mm-blush:var(--pink);gap:var(--s3);width:100%;height:100%;padding:var(--s2) var(--gutter) calc(var(--s4) + env(safe-area-inset-bottom));-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;flex-direction:column;display:flex;position:relative;overflow:hidden}.mm[data-dense="1"]{padding-inline:var(--s2)}.mm-hud{width:min(100%, max(var(--board-w,100%), 320px));flex:none;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:6px;min-height:48px;margin-bottom:12px;display:grid}.mm-stat{min-height:44px;padding:0 var(--s3);border-radius:var(--r-pill);background:var(--surface);border:2px solid var(--line);box-shadow:0 var(--lip-sm) 0 var(--line);white-space:nowrap;align-items:center;gap:6px;display:inline-flex}.mm-stat__label{font-size:var(--t-sm);color:var(--ink-2);font-weight:700}.mm-stat__n{min-width:1.4ch;font-size:var(--t-xl);color:var(--ink);text-align:center;font-weight:700;line-height:1;display:inline-block}.mm-stat__n--bump{animation:mm-bump .26s var(--ease-bounce)}.mm-stat__of{font-size:var(--t-sm);color:var(--ink-3)}.mm-stat svg{color:var(--green);flex:none}.mm-status{min-width:0;max-width:100%;min-height:36px;padding:3px var(--s3);border-radius:var(--r-pill);font-family:var(--font-display);font-weight:var(--fw-display);font-synthesis:none;font-size:var(--t-md);text-align:center;color:var(--ink-2);justify-self:center;align-items:center;gap:6px;line-height:1.1;display:inline-flex}.mm-status svg{flex:none}.mm-status__t{text-align:start;word-break:keep-all;overflow-wrap:anywhere;min-width:0}.mm-status--match{background:var(--green);color:#fff;box-shadow:0 var(--lip-sm) 0 var(--green-lip);animation:mm-pop .32s var(--ease-bounce)}.mm-status--miss{background:var(--red-soft);color:var(--ink);animation:mm-pop .32s var(--ease-bounce)}.mm-status--miss svg{color:var(--red)}.mm-status--clear{background:var(--yellow);color:#15172b;box-shadow:0 var(--lip-sm) 0 var(--yellow-lip);animation:mm-pop .32s var(--ease-bounce)}.mm-stage{flex-direction:column;flex:1;align-items:center;min-height:0;display:flex;position:relative}.mm-stage:before,.mm-stage:after{content:"";flex:2 1 0}.mm-stage:after{flex-grow:3}.mm-grid{grid-template-columns:repeat(var(--cols), var(--cw));grid-auto-rows:var(--ch);gap:var(--gap);padding-bottom:var(--lip);--mm-r:min(22px, calc(var(--cw) * .2));flex:none;display:grid}.mm-card{width:var(--cw);height:var(--ch);border-radius:var(--mm-r);-webkit-tap-highlight-color:transparent;touch-action:manipulation;display:block;position:relative}.mm-card:focus:not(:focus-visible){outline:none}.mm-card:focus-visible,.mm-card.is-cursor{outline:4px solid var(--ink);outline-offset:3px;border-radius:var(--mm-r);z-index:2}.mm-card__inner{position:absolute;inset:0}.mm-card__back,.mm-card__face{border-radius:var(--mm-r);pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.mm-card__back{visibility:visible;transition:transform .2s var(--ease-bounce) .14s, visibility 0s linear 0s;transform:perspective(700px)rotateY(0)}.mm-card.is-up .mm-card__back{visibility:hidden;transition:transform .14s cubic-bezier(.55,0,1,.45),visibility 0s linear .14s;transform:perspective(700px)rotateY(90deg)}.mm-card__face{visibility:hidden;transition:transform .14s cubic-bezier(.55,0,1,.45),visibility 0s linear .14s;transform:perspective(700px)rotateY(-90deg)}.mm-card.is-up .mm-card__face{visibility:visible;transition:transform .2s var(--ease-bounce) .14s, visibility 0s linear 0s;transform:perspective(700px)rotateY(0)}.mm-card__back{background:repeating-linear-gradient(135deg, #ffffff14 0 9px, transparent 9px 18px), var(--dc);box-shadow:inset 0 0 0 3px #fff3, 0 var(--lip) 0 var(--dc-lip)}.mm-card__mark{aspect-ratio:1;width:min(56%,64px);box-shadow:0 3px 0 var(--dc-lip);background:#fff;border-radius:50%;place-items:center;display:grid}.mm-card__mark img{pointer-events:none;width:76%;height:76%}@media (hover:hover){.mm-card:not(.is-up):hover .mm-card__back{filter:brightness(1.08)}}.mm-card__face{background:color-mix(in srgb, var(--c) 16%, #fff);box-shadow:0 var(--lip) 0 color-mix(in srgb, var(--c-lip) 50%, #fff)}.mm-card.is-up:not(.is-matched):not(.is-miss) .mm-card__face{box-shadow:inset 0 0 0 3px var(--c), 0 var(--lip) 0 var(--c-lip)}.mm-card.is-matched .mm-card__face{box-shadow:inset 0 0 0 3px var(--green), 0 var(--lip-sm) 0 var(--green-lip)}.mm-card.is-miss .mm-card__face{box-shadow:inset 0 0 0 3px var(--red), 0 var(--lip) 0 var(--red-lip)}.mm-card__face[data-color=red]{--c:var(--d-speed);--c-lip:var(--d-speed-lip);--mm-blush:#ffffff80}.mm-card__face[data-color=blue]{--c:var(--d-memory);--c-lip:var(--d-memory-lip)}.mm-card__face[data-color=yellow]{--c:var(--d-focus);--c-lip:var(--d-focus-lip)}.mm-card__face[data-color=green]{--c:var(--d-math);--c-lip:var(--d-math-lip)}.mm-card__face[data-color=pink]{--c:var(--d-flex);--c-lip:var(--d-flex-lip);--mm-blush:#ffffff80}.mm-card__face[data-color=teal]{--c:var(--d-language);--c-lip:var(--d-language-lip)}.mm-critter{pointer-events:none;width:86%;height:86%;overflow:visible}.mm-critter__lip{fill:var(--c-lip);stroke:var(--c-lip);stroke-width:5px;stroke-linejoin:round}.mm-critter__body{fill:var(--c);stroke:var(--c);stroke-width:5px;stroke-linejoin:round}.mm-critter__blush{fill:var(--mm-blush)}.mm-critter[data-critter=fox] .mm-critter__blush{fill:var(--pink)}.mm-badge{z-index:1;width:clamp(22px, calc(var(--cw) * .3), 32px);aspect-ratio:1;color:#fff;border:3px solid var(--surface);animation:mm-pop .36s var(--ease-bounce) .18s both;border-radius:50%;place-items:center;display:grid;position:absolute;top:-7px;right:-7px}.mm-badge svg{width:72%;height:72%}.mm-badge--ok{background:var(--green)}.mm-badge--no{background:var(--red)}.mm-card.is-pop{animation:mm-hop .46s var(--ease-bounce) .16s}.mm-card.is-miss{animation:.38s ease-in-out .26s mm-wobble}.mm--clear .mm-card{animation:mm-hop .52s var(--ease-bounce) calc(var(--i) * 28ms) both}@keyframes mm-hop{40%{transform:translateY(-9px)scale(1.05)}70%{transform:translateY(1px)scale(.99)}}@keyframes mm-wobble{25%{transform:rotate(-4deg)}60%{transform:rotate(3deg)}85%{transform:rotate(-1deg)}}@keyframes mm-pop{0%{opacity:0;transform:scale(.5)}}@keyframes mm-bump{45%{transform:scale(1.3)}}.mm-clear{z-index:5;padding:var(--s4);background:color-mix(in srgb, var(--bg) 55%, transparent);cursor:pointer;place-items:center;display:grid;position:absolute;inset:0}.mm-clear__card{align-items:center;gap:var(--s1);max-width:320px;padding:var(--s4) var(--s6) var(--s5);border-radius:var(--r-xl);background:var(--surface);border:2px solid var(--line);box-shadow:0 var(--lip) 0 var(--line);text-align:center;animation:mm-pop .42s var(--ease-bounce);flex-direction:column;display:flex}.mm-clear__card .mascot{width:112px;height:112px;margin-top:calc(var(--s8) * -1)}.mm-clear__title{font-family:var(--font-display);font-weight:var(--fw-display);font-synthesis:none;font-size:var(--t-2xl);line-height:var(--lh-display)}.mm-clear__moves{font-size:var(--t-xl);color:var(--dc);font-weight:700}.mm-clear__skip{margin-top:var(--s2);font-size:var(--t-xs);color:var(--ink-3)}.mm-keys{text-align:center;font-size:var(--t-xs);color:var(--ink-3);margin:0;font-weight:600}@media (pointer:coarse){.mm-keys{display:none}}@media (width<=380px){.mm-hud{gap:var(--s1)}.mm-status{padding-inline:var(--s2);font-size:var(--t-sm)}}@media (height<=560px){.mm{gap:var(--s2);padding-top:var(--s1)}.mm-keys{display:none}}.mm--still .mm-card__back,.mm--still .mm-card__face{transition:none!important}.mm--still .mm-card,.mm--still .mm-badge,.mm--still .mm-status,.mm--still .mm-stat__n,.mm--still .mm-clear__card{animation:none!important}