body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;background:var(--color-bg);color:var(--color-text);min-height:100vh}
#app{padding:16px;max-width:960px;margin:0 auto}
.panel{background:var(--color-card);border-radius:12px;padding:20px;margin-bottom:16px;box-shadow:0 2px 12px rgba(0,0,0,.06)}
.form-input{width:100%;padding:12px;border:1px solid var(--color-border);border-radius:8px;margin:8px 0 16px}
.btn-primary,.btn-secondary{padding:12px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;margin:4px}
.btn-primary{background:var(--color-primary);color:#fff}
.btn-secondary{background:transparent;border:1px solid var(--color-border);color:var(--color-text)}
.hidden{display:none!important}
.home-hero{text-align:center;padding:48px 16px}
.home-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.home-hint{font-size:12px;color:var(--color-muted);margin-top:24px}
.room-code{font-size:32px;color:var(--color-primary);letter-spacing:4px}
.room-qr{max-width:200px;margin:12px auto;display:block}
.control-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.quiz-stage{padding:16px}
.quiz-stem{font-size:22px;margin:12px 0}
.quiz-progress{font-size:13px;color:var(--color-muted)}
.answer-btn{display:flex;align-items:center;gap:12px;width:100%;padding:16px;margin:8px 0;border:none;border-radius:12px;cursor:pointer;text-align:left;color:#fff;font-size:16px}
.answer-btn.color-A{background:var(--answer-red)}
.answer-btn.color-B{background:var(--answer-blue)}
.answer-btn.color-C{background:var(--answer-yellow);color:#333}
.answer-btn.color-D{background:var(--answer-green)}
.answer-btn.color-T{background:var(--answer-blue)}
.answer-btn.color-F{background:var(--answer-red)}
.answer-btn.selected{outline:3px solid #fff;transform:scale(1.02)}
#options-wrap.disabled{pointer-events:none;opacity:.7}
.reveal-panel{margin-top:20px;padding:16px;border-radius:12px;text-align:center}
.reveal-panel.correct{background:#E8F8F0}
.reveal-panel.wrong{background:#FFEBEE}
.score-pop{font-size:24px;font-weight:700;color:var(--color-primary)}
.wait-screen{text-align:center;padding:48px}
.leaderboard-list{list-style:none;padding:0}
.rank-item{display:flex;gap:8px;padding:8px 0;border-bottom:1px solid var(--color-border)}
.r136-toast{position:fixed;bottom:calc(var(--contact-footer-h) + 16px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:rgba(0,0,0,.85);color:#fff;padding:10px 18px;border-radius:999px;z-index:999}
#confetti-canvas{position:fixed;inset:0;pointer-events:none;z-index:998}
body.has-contact-footer{padding-bottom:calc(var(--contact-footer-h) + env(safe-area-inset-bottom))}
body.has-contact-footer .zw-root .zw-fab{bottom:calc(var(--contact-footer-h) + 12px + env(safe-area-inset-bottom))}
.contact-footer{
  position:fixed;left:0;right:0;bottom:0;z-index:110;
  padding:16px 16px calc(16px + env(safe-area-inset-bottom));
  background:#1a1a1a;color:#fff;text-align:center
}
.contact-footer__btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:8px}
.contact-footer__cta,.contact-footer__btn{padding:8px 16px;border-radius:999px;font-size:13px;text-decoration:none;border:none;cursor:pointer}
.contact-footer__cta{background:var(--color-primary);color:#fff}
.contact-footer__btn{background:#333;color:#fff}
.contact-footer__brand{font-size:11px;opacity:.7;margin:0}
.dash-grid{display:grid;gap:16px}
.dash-grid.threecol{grid-template-columns:1fr}
@media(min-width:768px){.dash-grid.threecol{grid-template-columns:1fr 1fr 1fr}}