html,body{margin:0;padding:0;overflow:hidden}html.cursor-hidden,html.cursor-hidden *{cursor:none!important}nav{background:#eee;display:flex}a{padding:10px;text-decoration:none;color:#000}a:hover{background-color:#a9a9a9}.active{background-color:#d3d3d3}.join-popup-backdrop{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:#000000b3}.join-popup{min-width:480px;padding:32px 48px;border:4px solid #00ffff;border-radius:16px;background:#1a1a2e;color:#fff;font-family:system-ui,sans-serif;text-align:center}.join-popup h2{margin:0 0 24px;font-size:36px}.join-list{margin:0;padding:0;list-style:none}.join-item{display:flex;gap:14px;align-items:center;justify-content:center;padding:8px 16px;font-size:28px;border-radius:8px}.join-item.selected{background:#ffffff1f;color:#0ff;font-weight:700}.join-item .dot{width:22px;height:22px;border-radius:50%;flex:0 0 auto}.color-row{display:flex;gap:16px;justify-content:center;margin:16px 0}.color-row .color-dot{width:44px;height:44px;border-radius:50%;border:4px solid transparent}.color-row .color-dot.selected{border-color:#fff;transform:scale(1.2)}.name-editor{display:flex;gap:8px;justify-content:center;margin:16px 0}.name-editor .name-char{width:44px;height:56px;line-height:56px;font-size:36px;font-family:monospace;background:#ffffff14;border-bottom:4px solid transparent}.name-editor .name-char.cursor{border-bottom-color:#0ff;color:#0ff}.popup-hint{margin-top:24px;font-size:18px;color:#999}