*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;font-family:inherit;font-size:inherit;color:inherit;background-color:transparent;user-select:none}button:active{transform:translateY(2px)}input,select{font-family:inherit;font-size:inherit}.input-wrapper{@apply items-center gap-2;}[data-size=sm]>button{padding:.375rem .75rem;font-size:.875rem}[data-size=lg]>button{padding:.875rem 2rem;font-size:1.125rem}@layer utilities{.animate-fade-in{animation:fade-in .3s ease-out both}.animate-slide-up{animation:slide-up .35s ease-out both}.animate-pop{animation:pop .25s ease-out both}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes pop{0%{opacity:0;transform:scale(.9)}70%{transform:scale(1.03)}to{opacity:1;transform:scale(1)}}.label{gap:.375rem;align-items:baseline}.hidden{display:none!important}.pe-code-input{display:inline-flex;align-items:center;justify-content:center;gap:.375rem;flex-wrap:nowrap;max-width:100%}.pe-code-input .cell{width:3rem;flex:0 1 3rem;min-width:0;height:3.5rem;padding:0;text-align:center;font-size:1.5rem;font-weight:700;font-family:inherit}.pe-code-input .sep{display:inline-flex;align-items:center;justify-content:center;font-size:1.5rem;width:.5rem;user-select:none}.pe-tabs{display:inline-flex;gap:.25rem;padding:.25rem;border-radius:9999px;width:100%}.pe-tab{flex:1 1 0%;display:flex}.pe-tab>button{width:100%}:root{--pe-header-height: 65px}.pe-header{display:flex;align-items:center;justify-content:space-between;gap:.875rem;padding:.625rem 1rem;width:100%;height:var(--pe-header-height);flex-shrink:0;z-index:10}.pe-header__left,.pe-header__right{display:inline-flex;align-items:center;gap:.875rem}.pe-header__center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:42%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center}.pe-header__logo{height:2rem;width:auto;flex:none;display:inline-flex;align-items:center}.pe-header__logo img{height:100%;width:auto;display:block}.pe-room-pill{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .625rem;border-radius:9999px;font-size:.875rem}.pe-room-pill__dot{width:.5rem;height:.5rem;border-radius:9999px;flex:none}.pe-modal{display:flex;flex-direction:column;gap:1rem;width:calc(100vw - 2rem);max-width:460px;top:calc(50% + var(--pe-header-height) / 2);max-height:calc(100dvh - var(--pe-header-height) - 2rem);overflow-y:auto}.lobby-card{padding:1.5rem}.lobby-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.lobby-head__count{display:inline-flex;gap:.25rem;font-size:.875rem}.lobby-room{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;border-radius:.75rem}.lobby-room__copy{display:flex;flex-direction:column;gap:.125rem}.lobby-room__label{font-size:.75rem;letter-spacing:.04em;text-transform:uppercase}.lobby-room__code{font-size:1.5rem;font-weight:700}.lobby-slots{display:flex;flex-direction:column;gap:.5rem}.slot{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;border-radius:.625rem}.slot__avatar{width:2.25rem;height:2.25rem;border-radius:9999px;flex:none}.slot__body{display:flex;flex-direction:column;min-width:0}.slot__name{font-weight:600}.slot__meta{font-size:.8125rem;opacity:.7}.lobby-tip{font-size:.875rem;text-align:center;opacity:.7}.lobby-actions{display:flex;flex-direction:column;gap:.5rem}.lobby-start,.lobby-start>button{width:100%}.lobby-joining,.lobby-error{padding:1.5rem;text-align:center}.lobby-error>*+*{margin-top:1rem}.mk-toast{position:fixed;bottom:4.5rem;left:50%;transform:translate(-50%,8px);opacity:0;pointer-events:none;z-index:9999;max-width:calc(100vw - 2rem);transition:opacity .2s ease,transform .2s ease}.mk-toast--visible{opacity:1;transform:translate(-50%)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}@font-face{font-family:Metropolis;src:url(/fonts/metropolis-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Metropolis;src:url(/fonts/metropolis-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}:root{--mf-purple: #482e87;--mf-purple-deep: #170833;--mf-yellow: #ebbd37;--mf-lavender: #e5dbff;--mf-ink: #170833;--mf-muted: #9d92bd;--mf-tile-radius: 2.375rem;--mf-tile-pad: 1.5rem;--mf-marker: 3.5rem;--mf-marker-dot: .75rem;--mf-tile-gap: 1.375rem;--mf-font: "Metropolis", ui-rounded, "Segoe UI", system-ui, sans-serif;--mf-size-eyebrow: 1.5rem;--mf-size-question: 1.563rem;--mf-size-answer: 1.25rem;--mf-size-pip: 1rem}html,body{background:transparent;overscroll-behavior:none;color:#fff;font-family:var(--mf-font)}body.mf-standalone{background:linear-gradient(180deg,var(--mf-purple) 0%,var(--mf-purple-deep) 100%);background-attachment:fixed}html,body{height:auto;min-height:100%;overflow:visible}#mf-root{position:relative;width:100%}#gameCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.mf-frame{display:flex;flex-direction:column;align-items:center;gap:0;padding:2rem 1.5rem;max-width:65.625rem;margin:0 auto}.mf-hud{text-align:center}.mf-quiz{display:flex;flex-direction:column;align-items:center;gap:1.563rem;width:100%;text-align:center}.mf-quiz .quiz-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--mf-tile-gap);width:100%}.mf-quiz .quiz-opt>button{display:flex;align-items:center;justify-content:flex-start;gap:2.25rem;width:100%;min-height:5.813rem;padding:.5rem var(--mf-tile-pad);border:none;border-radius:var(--mf-tile-radius);background:var(--mf-lavender);color:var(--mf-ink);font-family:inherit;font-size:clamp(1rem,1.5vw,var(--mf-size-answer));font-weight:700;text-align:left;cursor:pointer;transition:transform .12s ease,filter .12s ease}.mf-quiz .quiz-opt__key{flex:none;position:relative;width:var(--mf-marker);height:var(--mf-marker);border-radius:999px;background:var(--mf-yellow);font-size:0;color:transparent}.mf-quiz .quiz-opt__key:after{content:"";position:absolute;inset:0;margin:auto;width:var(--mf-marker-dot);height:var(--mf-marker-dot);border-radius:999px;background:#fff}.mf-quiz .quiz-opt>button:hover{filter:brightness(1.04)}.mf-quiz .quiz-opt.is-chosen>button,.mf-quiz .quiz-opt>button:active{transform:scale(.985);filter:brightness(.96)}.mf-eyebrow{color:var(--mf-yellow);font-weight:700;font-size:clamp(1.125rem,1.7vw,var(--mf-size-eyebrow));line-height:1.1;letter-spacing:.04em;text-transform:uppercase}.mf-quiz .quiz-prompt{margin:0;font-size:clamp(1.25rem,2.2vw,var(--mf-size-question));font-weight:700;line-height:1.1;max-width:40ch;min-height:var(--mf-prompt-min-h, auto);display:flex;align-items:center;justify-content:center}.mf-pips{display:flex;gap:.625rem;align-items:flex-end;justify-content:center;width:100%;max-width:32.75rem;margin:0 auto;padding:4.5rem 0 0}.mf-pips .mk-pip{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;flex:0 1 3.25rem;min-width:0}.mf-pips .mk-pip--current{flex:0 1 16.938rem}.mf-pips .mk-pip__label{font-size:var(--mf-size-pip);font-weight:700;color:var(--mf-muted)}.mf-pips .mk-pip--current .mk-pip__label{color:#fff}.mf-pips .mk-pip__track{position:relative;width:100%;height:.5rem;border-radius:999px;background:#e2e2e2;overflow:hidden}.mf-pips .mk-pip__track:after{content:"";position:absolute;inset:0;width:var(--mk-pip-fill, 0%);border-radius:999px;background:var(--mf-yellow)}.mf-pips .mk-pip--done .mk-pip__track:after{background:var(--mf-yellow)}.mf-error{padding:3rem 1.5rem;text-align:center;color:#fff}.mf-error__hint{color:var(--mf-muted);font-size:.9rem}@media(max-width:768px){.mf-frame{padding:1.5rem 1rem}.mf-quiz .quiz-options{gap:.75rem}.mf-quiz .quiz-opt>button{min-height:4.5rem;padding:.5rem 1rem;gap:1rem;border-radius:2rem}.mf-quiz .quiz-opt__key{width:2.75rem;height:2.75rem}.mf-pips{padding-top:2.5rem}.mf-pips .mk-pip__label{font-size:.75rem}}@media(max-width:600px){.mf-quiz .quiz-options{grid-template-columns:1fr}.mf-pips{max-width:100%;gap:.375rem}.mf-pips .mk-pip,.mf-pips .mk-pip--current{flex:1 1 0}}@media(max-width:380px){.mf-pips .mk-pip__label{display:none}}