:root{--primary:#6C4CE6;--secondary:#FF6B6B;--success:#2ECC71;--error:#E74C3C;--dark-text:#2D2440}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body,html{margin:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;overscroll-behavior:none;overflow-x:hidden;width:100%}#app{min-height:100dvh;display:flex;flex-direction:column}.screen{flex:1;display:flex;flex-direction:column;min-height:100dvh;padding:20px;color:#fff;position:relative;overflow:hidden}.bg-names{background:linear-gradient(135deg,#7b2ff7,#f107a3)}.bg-category{background:linear-gradient(135deg,#11998e,#38ef7d)}.bg-difficulty{background:linear-gradient(135deg,#ff512f,#f09819)}.bg-winner{background:var(--primary)}.topbar{display:flex;align-items:center;justify-content:center;position:relative;height:48px;margin-bottom:8px}.back-btn{position:absolute;left:0;background:0 0;border:none;color:#fff;font-size:26px;padding:8px;cursor:pointer;line-height:1}.dots{display:flex;gap:6px}.dot{height:10px;width:10px;border-radius:6px;background:rgba(255,255,255,.5);transition:all .25s}.dot.active{width:28px;background:#fff}h1.title{font-size:30px;font-weight:800;margin:8px 0 4px;text-align:center}p.subtitle{font-size:16px;color:rgba(255,255,255,.85);text-align:center;margin:0 0 20px}.big-btn{width:100%;height:68px;border:none;border-radius:22px;font-size:21px;font-weight:800;color:#fff;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;transition:transform .1s;box-shadow:0 8px 16px rgba(0,0,0,.25)}.big-btn:active{transform:scale(.95)}.big-btn:disabled{background:rgba(255,255,255,.25)!important;box-shadow:none;cursor:not-allowed}.big-btn.green{background:var(--success)}.big-btn.coral{background:var(--secondary)}.big-btn.purple{background:var(--primary)}.bottom-slot{margin-top:auto;padding-top:16px}.name-input-row{display:flex;gap:10px;margin-bottom:18px;width:100%}.name-input{flex:1 1 auto;min-width:0;height:56px;border-radius:20px;border:none;padding:0 16px;font-size:18px;color:var(--dark-text);font-weight:600}.name-input::placeholder{color:#9a94ad;font-weight:400}.add-btn{flex:0 0 56px;width:56px;height:56px;border-radius:50%;border:none;background:#fff;color:#7b2ff7;font-size:26px;font-weight:700;cursor:pointer;flex-shrink:0}.add-btn:active{transform:scale(.9)}.player-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding-bottom:8px}.player-row{background:#fff;border-radius:18px;height:56px;display:flex;align-items:center;padding:0 16px;color:var(--dark-text);flex-shrink:0}.player-row .avatar{font-size:26px;margin-right:12px}.player-row .name{flex:1;font-size:17px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-row .remove{background:0 0;border:none;color:#aaa;font-size:20px;cursor:pointer;padding:6px}#reaction-float-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:998}.floating-reaction{position:absolute;bottom:90px;font-size:34px;animation:floatUp 2.6s ease-out forwards;text-align:center}.floating-reaction .who{display:block;font-size:11px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5);margin-top:-4px}@keyframes floatUp{0%{transform:translateY(0) scale(.5);opacity:0}12%{transform:translateY(-16px) scale(1.15);opacity:1}100%{transform:translateY(-240px) scale(1);opacity:0}}.reaction-bar{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:18px}.reaction-btn{width:42px;height:42px;border-radius:50%;border:none;background:rgba(255,255,255,.65);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center}.reaction-btn:active{transform:scale(.88)}.empty-hint{text-align:center;color:rgba(255,255,255,.8);margin-top:24px;font-size:16px}.link-btn{background:0 0;border:none;color:#fff;font-size:15px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer;display:block;margin:12px auto 0;padding:8px}.divider-row{display:flex;align-items:center;gap:12px;margin:16px 0}.divider-row .line{flex:1;height:1px;background:rgba(255,255,255,.35)}.divider-row .word{color:rgba(255,255,255,.85);font-size:13px;font-weight:700}.big-btn-outline{width:100%;height:68px;border-radius:22px;border:2px solid #fff;background:rgba(255,255,255,.12);color:#fff;font-size:19px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;transition:transform .1s}.big-btn-outline:active{transform:scale(.96)}.code-display{font-size:42px;font-weight:800;letter-spacing:8px;text-align:center;background:#fff;color:var(--dark-text);border-radius:18px;padding:16px 0}.error-text{color:#ffe1e1;background:rgba(231,76,60,.35);border-radius:12px;padding:10px 14px;font-size:14px;font-weight:600;margin:-6px 0 14px}.waiting-pulse{font-size:60px;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:.7}}.floating-shapes{position:absolute;inset:0;pointer-events:none;opacity:.35;z-index:0}.floating-shapes span{position:absolute;font-size:30px;animation:floaty 4s ease-in-out infinite}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}.surprise-card{background:#fff;color:var(--dark-text);border-radius:22px;padding:20px;text-align:center;margin-bottom:16px;cursor:pointer;border:4px solid transparent}.surprise-card.selected{border-color:#1abc9c}.surprise-card .emoji{font-size:34px;display:block;margin-bottom:6px}.surprise-card .label{font-size:18px;font-weight:700}.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;flex:1;overflow-y:auto;align-content:start}.category-card{border-radius:22px;aspect-ratio:1/0.95;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;border:4px solid transparent;cursor:pointer;box-shadow:0 6px 14px rgba(0,0,0,.25)}.category-card.selected{border-color:#fff;box-shadow:0 8px 20px rgba(0,0,0,.35)}.category-card .icon{font-size:40px}.category-card .label{font-size:18px;font-weight:800;margin-top:8px}.diff-row{display:flex;gap:14px;margin-bottom:28px}.diff-card{flex:1;background:#fff;color:var(--dark-text);border-radius:22px;padding:24px 0;text-align:center;border:4px solid transparent;cursor:pointer}.diff-card.selected{border-color:var(--primary)}.diff-card .emoji{font-size:40px;display:block}.diff-card .label{font-size:18px;font-weight:800;margin-top:8px}.points-row{display:flex;gap:10px;margin-bottom:8px}.point-chip{flex:1;background:rgba(255,255,255,.25);border-radius:18px;padding:18px 0;text-align:center;font-size:24px;font-weight:800;color:#fff;cursor:pointer}.point-chip.selected{background:#fff;color:#ff512f}.question-header{display:flex;align-items:center;margin-bottom:20px}.question-avatar{width:56px;height:56px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:30px;flex-shrink:0;margin-right:14px}.question-player-name{font-size:22px;font-weight:700;color:var(--dark-text)}.question-points{font-size:16px;color:#6b6478}.sudden-death-badge{background:var(--secondary);color:#fff;font-weight:700;font-size:16px;padding:8px 16px;border-radius:16px;display:inline-block;margin-bottom:14px;align-self:center}.timer-ring-wrap{width:84px;height:84px;position:relative;margin:0 auto 14px}.timer-ring{width:100%;height:100%;transform:rotate(-90deg)}.timer-ring-bg{fill:none;stroke:rgba(0,0,0,0.1);stroke-width:8}.timer-ring-fg{fill:none;stroke-width:8;stroke-linecap:round;stroke:#2ECC71}.timer-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:800;color:var(--dark-text)}@keyframes ringCountdown{0%{stroke-dashoffset:0;stroke:#2ECC71}55%{stroke:#F1C40F}80%{stroke:#E74C3C}100%{stroke-dashoffset:251.2;stroke:#E74C3C}}.question-card{background:#fff;color:var(--dark-text);border-radius:20px;padding:24px 20px;text-align:center;font-size:28px;font-weight:700;line-height:1.3;margin-bottom:22px}.option-btn{width:100%;min-height:60px;border-radius:18px;border:none;background:#f1eef9;color:var(--dark-text);font-size:19px;font-weight:600;margin-bottom:12px;padding:14px 18px;text-align:left;cursor:pointer}.option-btn.correct{background:var(--success);color:#fff}.option-btn.wrong{background:var(--error);color:#fff}.option-btn:disabled{cursor:default}.question-scroll{flex:1;overflow-y:auto}.center-msg{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;font-size:18px;color:var(--dark-text);padding:24px}.winner-avatar{font-size:80px;text-align:center;margin-top:40px}.winner-title{font-size:30px;font-weight:800;text-align:center;margin:12px 0 30px}.ranking{background:#fff;border-radius:20px;padding:16px;color:var(--dark-text)}.ranking-row{display:flex;justify-content:space-between;padding:8px 4px;font-size:17px}.ranking-row .name{font-weight:700}.ranking-row .score{color:#6b6478}#confetti-canvas{position:fixed;inset:0;pointer-events:none;z-index:999}