:root{--pink: #e05aa0;--pink-light: #f0a0c8;--coral: #e8645a;--coral-light: #f2a498;--gold: #e0b84a;--gold-light: #ecd48a;--green: #44c47a;--green-light: #8adcaa;--teal: #3abba5;--teal-light: #82d9ca;--blue: #4a8fd4;--blue-light: #8cbbe8;--cyan: #44d4e8;--cyan-light: #92e6f0;--lavender: #b088e0;--lavender-light: #d0b8ee;--purple: #8855cc;--purple-light: #b898e0;--cream: #eae0d0;--black: #08080e;--font-fancy: "Instrument Serif", serif;--font-body: "DM Sans", sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--black);color:var(--cream);font-family:var(--font-body)}#root{position:relative;max-width:430px;height:100dvh;margin:0 auto;overflow:hidden}p{font-family:var(--font-body);color:#ffffff59;text-align:center;letter-spacing:.15em;font-size:.75rem;font-weight:300;text-transform:uppercase}.screen{border:1px solid rgba(255,255,255,.1);width:100%;max-width:430px;height:100dvh;display:flex;flex-direction:column;align-items:center;margin:0 auto;padding:20px;gap:20px;position:relative;z-index:10;overflow:hidden}.screen-topbar{display:flex;justify-content:space-between;align-items:center;width:100%;flex-shrink:0}.screen-header{display:flex;flex-direction:column;align-items:center;width:90%;gap:10px;flex-shrink:0}.screen-footer{display:flex;flex-direction:column;align-items:center;width:90%;gap:18px;margin-top:auto;margin-bottom:18px;flex-shrink:0}.btn{width:100%;padding:18px;border-radius:9999px;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-family:var(--font-body);color:#ffffffb3;text-align:center;letter-spacing:.15em;font-size:.75rem;font-weight:300;text-transform:uppercase;transition:all .3s ease;cursor:pointer}.input{width:96%;padding:16px 20px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-family:var(--font-body);color:var(--cream);letter-spacing:.12em;font-size:.85rem;font-weight:300}.input::placeholder{color:#ffffff4d}.btn-back{display:flex;align-items:center;justify-content:center;width:45px;height:45px;padding-bottom:3px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;font-family:var(--font-body);color:var(--cream);font-size:2.5rem;font-weight:200;text-align:center;cursor:pointer}.screen-header h1{font-family:var(--font-fancy);color:var(--cream);text-align:center;font-size:2.75rem;letter-spacing:.01em}.screen-header h2{font-family:var(--font-body);color:#fff6;text-align:center;letter-spacing:.15em;font-size:.85rem;font-weight:300;text-transform:uppercase}.timer{position:relative;display:flex;align-items:center;justify-content:center;width:45px;height:45px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;font-family:var(--font-body);color:var(--cream);font-size:.65rem;font-weight:200;text-align:center}.timer svg{position:absolute;top:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.timer circle{fill:none;stroke:var(--cream);stroke-width:2;stroke-dasharray:125.6;stroke-dashoffset:0;animation:countdown var(--timer-duration) linear forwards}@keyframes countdown{0%{stroke-dashoffset:0}to{stroke-dashoffset:-125.6}}.timer.scoring{animation:pulse-scoring 1s ease-in-out infinite}.timer.scoring p{font-size:.8rem;letter-spacing:.15em}@keyframes pulse-scoring{0%,to{opacity:.4}50%{opacity:1}}.title-ring-group{position:relative;display:flex;align-items:center;justify-content:center;margin:auto 0}.title-ring-group .title-block{position:absolute;text-align:center}.title{font-family:var(--font-fancy);color:var(--cream);text-align:center;font-size:2.5rem;letter-spacing:.01em;margin-bottom:10px}.subtitle{font-family:var(--font-body);color:#ffffff59;text-align:center;letter-spacing:.15em;font-size:.75rem;font-weight:300;text-transform:uppercase}.players-joined{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;padding:22px;border-radius:20px;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;flex:1;min-height:0;overflow-y:auto}.avatar-wrapper{position:relative}.player-avatar{display:flex;align-items:center;justify-content:center;width:45px;height:45px;border-radius:50%;color:var(--black);font-size:1.25rem;font-weight:500;text-transform:uppercase}.avatar-picker{display:flex;justify-content:center;align-items:center;width:90%}.picker-arrow{font-family:var(--font-body);color:var(--cream);background:none;border:none;font-size:3rem;font-weight:200;text-align:center;cursor:pointer}.avatar-selected{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;color:var(--black);font-size:2rem;font-weight:500;text-transform:uppercase}.footer-buttons{display:flex;align-items:center;justify-content:center;gap:24px;width:100%}.btn-icon{background:none;color:inherit;border:none;padding:0;cursor:pointer}.footer-buttons .btn-icon{display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.icon{width:24px;height:24px;cursor:pointer;opacity:.8;transition:opacity .3s ease;background-color:transparent}.icon:hover{opacity:1}#qr-popover{padding:20px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--cream);margin:auto}#copy-popover{background:none;color:var(--cream);border:none;padding:0;margin:auto}.category-display{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;padding:20px;flex:1;min-height:0;overflow-y:auto}.category-display h1{font-family:var(--font-fancy);color:var(--cream);text-align:center;font-size:2.5rem;letter-spacing:.01em}.player-progress{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;max-width:80%;flex-shrink:0}.player-progress-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.player-progress-dot{width:16px;height:16px;border-radius:50%}.locked-in{justify-content:center}.locked-in-msg{font-family:var(--font-fancy);font-size:1.5rem;color:var(--cream);text-align:center;opacity:0;animation:fade-in .3s ease forwards}@keyframes fade-in{to{opacity:1}}.reveal .screen-header h1{font-size:3rem}.reveal .meld-indicator{color:var(--teal);font-size:.85rem;letter-spacing:.2em;text-transform:uppercase}.reveal-content{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;flex:1;min-height:0;overflow-y:auto}.reveal .my-guess{text-align:center;flex-shrink:0}.reveal .my-guess p{font-size:.85rem;color:var(--cream);opacity:.7;letter-spacing:.1em}.scatter-plot{width:100%;max-width:300px;flex-shrink:1;min-height:0}.game-end .screen-header h1{font-size:3rem}.history-table{width:90%;display:flex;flex-direction:column;gap:2px;flex:1;min-height:0;overflow-y:auto}.history-row{display:flex;justify-content:space-between;padding:8px 16px;border-radius:6px;background:#ffffff0a}.history-header{background:none;border-bottom:1px solid rgba(255,255,255,.1);border-radius:0}.history-header span{color:#fff6;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase}.history-row span{flex:1;text-align:center;font-family:var(--font-body);color:var(--cream);font-size:.85rem;letter-spacing:.05em}.history-meld{background:#3abba526;border:1px solid var(--teal)}.history-meld-cell{width:100%}.game-end .waiting-msg{color:#ffffff80;font-size:.85rem}.mood-picker{display:flex;flex-direction:column;align-items:center;gap:4px}.mood-current{display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:2rem;line-height:1;padding:0;cursor:pointer}.mood-label{font-family:var(--font-body);color:#ffffff4d;text-transform:uppercase;letter-spacing:.15em;font-size:.6rem;font-weight:300}.mood-options{display:flex;align-items:center;justify-content:space-evenly;gap:8px}.mood-option{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:none;background:none;font-size:2rem;line-height:1;padding:0;cursor:pointer}.avatar-mood{position:absolute;bottom:-4px;right:-4px;font-size:1.05rem}.avatar-selected+.avatar-mood{bottom:-2px;right:-2px;font-size:1.5rem}#instructions-popover{padding:24px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--cream);margin:auto;max-width:340px;text-align:center}.instructions-title{font-family:var(--font-fancy);color:var(--cream);font-size:1.5rem;letter-spacing:.01em;margin-bottom:12px}.instructions-body{font-family:var(--font-body);color:#fff9;font-size:.85rem;font-weight:300;line-height:1.5;text-transform:none;letter-spacing:.02em;margin-bottom:16px}.instructions-dots{display:flex;justify-content:center;gap:8px;margin-bottom:16px}.instructions-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#fff3;transition:background .3s ease}.instructions-dot.active{background:var(--cream)}.instructions-nav{display:flex;justify-content:space-between}.instructions-prev,.instructions-next{font-family:var(--font-body);color:#ffffffb3;letter-spacing:.15em;font-size:.75rem;font-weight:300;text-transform:uppercase;opacity:.8;transition:opacity .3s ease;cursor:pointer}.instructions-prev:hover,.instructions-next:hover{opacity:1}.blob-layer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;filter:blur(80px);opacity:.3}.blob{position:absolute;border-radius:50%}.b1{width:25vw;height:25vw;background:var(--pink);top:5%;left:-8%;animation:blob-f1 20s ease-in-out infinite}.b2{width:18vw;height:18vw;background:var(--teal);top:12%;right:-5%;animation:blob-f2 24s ease-in-out infinite}.b3{width:22vw;height:22vw;background:var(--pink);top:38%;left:5%;animation:blob-f3 22s ease-in-out infinite}.b4{width:25vw;height:25vw;background:var(--lavender);top:50%;right:-12%;animation:blob-f4 26s ease-in-out infinite}.b5{width:20vw;height:20vw;background:var(--coral);bottom:15%;left:15%;animation:blob-f5 19s ease-in-out infinite}.b6{width:18vw;height:18vw;background:var(--green);bottom:30%;right:10%;animation:blob-f6 21s ease-in-out infinite}.b7{width:20vw;height:20vw;background:var(--purple);top:25%;left:40%;animation:blob-f7 23s ease-in-out infinite}@keyframes blob-f1{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,50px) scale(1.15)}66%{transform:translate(-20px,70px) scale(.9)}}@keyframes blob-f2{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-50px,40px) scale(1.12)}}@keyframes blob-f3{0%,to{transform:translate(0) scale(1)}25%{transform:translate(40px,-30px) scale(1.1)}75%{transform:translate(-30px,40px) scale(.92)}}@keyframes blob-f4{0%,to{transform:translate(0) scale(1)}33%{transform:translate(-40px,30px) scale(1.08)}66%{transform:translate(20px,-40px) scale(.95)}}@keyframes blob-f5{0%,to{transform:translate(0) scale(1)}50%{transform:translate(50px,-60px) scale(1.2)}}@keyframes blob-f6{0%,to{transform:translate(0) scale(1)}40%{transform:translate(-30px,-40px) scale(1.1)}80%{transform:translate(20px,30px) scale(.9)}}@keyframes blob-f7{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-20px,50px) scale(1.15)}}.starfield{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.star{position:absolute;border-radius:50%;background:#ffffff80;animation:star-twinkle ease-in-out infinite}@keyframes star-twinkle{0%,to{opacity:.2}50%{opacity:1}}.nodes{position:absolute;top:0;left:0;width:100%;height:100%;z-index:3;pointer-events:none}.node{position:absolute;border-radius:50%;animation:node-drift linear infinite}@keyframes node-drift{0%{opacity:0;transform:translateY(30px) scale(.6)}10%{opacity:.8}90%{opacity:.5}to{opacity:0;transform:translateY(-100px) scale(1)}}@media(prefers-reduced-motion:reduce){.blob,.star,.node{animation:none!important}}.ring-container{width:340px;max-width:100%;max-height:340px;aspect-ratio:1;margin:auto 0;position:relative;flex-shrink:1;min-height:0}.ring{width:100%;max-width:100%;max-height:100%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.08);position:relative;margin:auto;animation:ring-rotate 60s linear infinite}@keyframes ring-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ring-mid-outer{position:absolute;top:7.5%;left:7.5%;width:85%;height:85%;border-radius:50%;border:1px solid rgba(255,255,255,.05);animation:ring-rotate 50s linear infinite reverse}.ring-inner{position:absolute;top:15%;left:15%;width:70%;height:70%;border-radius:50%;border:1px solid rgba(255,255,255,.08);animation:ring-rotate 45s linear infinite reverse}.ring-mid-inner{position:absolute;top:25%;left:25%;width:50%;height:50%;border-radius:50%;border:1px solid rgba(255,255,255,.05);animation:ring-rotate 35s linear infinite}.ring-node{position:absolute;border-radius:50%;box-shadow:0 0 12px currentColor}.ring-node-avatar{display:flex;align-items:center;justify-content:center;font-family:var(--font-body);font-size:.8rem;font-weight:500;color:var(--black)!important;letter-spacing:0}.ring-glow{position:absolute;width:60px;height:60px;top:50%;left:50%;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%);animation:pulse-glow 4s ease-in-out infinite}@keyframes pulse-glow{0%,to{opacity:.5;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.3)}}.ring-node-enter{animation:node-pop .4s cubic-bezier(.34,1.56,.64,1) both}@keyframes node-pop{0%{transform:scale(0)}to{transform:scale(1)}}.ring-node-avatar{overflow:visible}.ring-node-mood{position:absolute;bottom:-1px;right:-1px;font-size:.75rem;line-height:1;pointer-events:none}.ring-node-ready{box-shadow:0 0 20px currentColor,0 0 6px currentColor;transition:opacity .3s ease,box-shadow .3s ease}@media(prefers-reduced-motion:reduce){.ring,.ring-mid-outer,.ring-inner,.ring-mid-inner,.ring-glow,.ring-node-enter{animation:none!important}.ring-node-ready{transition:none!important}}