*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #fafaf8;--bg-2: #f0efe9;--bg-3: #e8e7e0;--text: #2c2c2a;--text-2: #888780;--text-3: #b5b4ae;--border: rgba(44,44,42,.12);--border-2: rgba(44,44,42,.07);--r-sm: 8px;--r-md: 12px;--r-lg: 16px;--r-xl: 20px;--r-pill: 999px;--c-black: #2c2c2a;--c-coral: #d85a30;--c-teal: #1d9e75;--c-purple: #7f77dd;--c-blue: #378add;--c-white: #ffffff;--av1-bg: #eeedfe;--av1-fg: #3c3489;--av2-bg: #e1f5ee;--av2-fg: #085041;--av3-bg: #faece7;--av3-fg: #712b13;--av4-bg: #fef4e1;--av4-fg: #7a4d00;--av5-bg: #e8f0fe;--av5-fg: #1a3a8f;--av6-bg: #fce8f3;--av6-fg: #7a1655}html,body{height:100%;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none}#root{height:100%;display:flex;flex-direction:column}.screen{flex:1;display:flex;flex-direction:column;min-height:0;max-width:480px;width:100%;margin:0 auto;padding:0 20px;padding-bottom:env(safe-area-inset-bottom,16px)}.title{font-size:13px;font-weight:500;color:var(--text-2);letter-spacing:.04em;text-transform:uppercase}.big-word{font-size:32px;font-weight:600;letter-spacing:-.03em;color:var(--text);line-height:1}.room-code{font-size:38px;font-weight:600;letter-spacing:.06em;color:var(--text);line-height:1}.btn{display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 20px;border-radius:var(--r-md);border:.5px solid var(--border);background:var(--bg);color:var(--text);font-size:15px;font-weight:500;font-family:inherit;cursor:pointer;transition:opacity .12s,transform .08s;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.btn:active{transform:scale(.97);opacity:.8}.btn-primary{background:var(--text);color:var(--bg);border-color:var(--text)}.btn-sm{min-height:40px;font-size:13px;padding:0 14px;border-radius:var(--r-sm)}.btn:disabled{opacity:.38;cursor:not-allowed;transform:none}.input{width:100%;min-height:52px;padding:0 16px;border-radius:var(--r-md);border:.5px solid var(--border);background:var(--bg);color:var(--text);font-size:16px;font-family:inherit;outline:none;transition:border-color .15s}.input::placeholder{color:var(--text-3)}.input:focus{border-color:#2c2c2a59}.pill{display:inline-flex;align-items:center;padding:4px 12px;border-radius:var(--r-pill);background:var(--bg-2);color:var(--text-2);font-size:12px;font-weight:500}.avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;flex-shrink:0}.divider{height:.5px;background:var(--border-2);margin:4px 0}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .25s ease both}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--text-2);border-radius:50%;animation:spin .7s linear infinite}