*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:#fff;min-height:100vh;color:#1f2937}.container{max-width:980px;margin:32px auto;padding:20px}h1{margin-bottom:32px;color:#1f2937;font-size:32px}.card{padding:24px;border-radius:12px;background:#fff}.intro-text{font-size:16px;line-height:1.6;color:#4b5563;margin-bottom:24px}.intro-text p{margin-bottom:12px}.intro-text ul{list-style-type:disc;padding-left:24px;margin:0}.intro-text li{margin-bottom:6px;color:#6b7280}.entrance-actions{display:flex;flex-direction:column;gap:16px}.join-group{display:flex;gap:12px;align-items:center}.join-group input{flex:1;max-width:300px}.room-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:24px}.room-header>div:first-child{font-size:20px;font-weight:600;color:#1f2937}.room-header code{background:#eef2ff;padding:4px 12px;border-radius:6px;font-family:Monaco,Courier New,monospace;color:#4f46e5;font-size:16px;font-weight:500}.share{display:flex;gap:8px;flex:1;max-width:500px}.share input{flex:1;min-width:200px}input{padding:10px 14px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;font-family:inherit;transition:all .2s ease;background:#fff;color:#1f2937}input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}input:read-only{background:#f9fafb;cursor:default}button{padding:10px 20px;border:none;border-radius:8px;font-size:14px;font-weight:500;font-family:inherit;cursor:pointer;transition:all .2s ease;background:#4f46e5;color:#fff}button:hover{background:#4338ca;transform:translateY(-1px);box-shadow:0 4px 8px #4f46e54d}button:active{transform:translateY(0);box-shadow:0 2px 4px #4f46e533}.controls{display:flex;gap:16px;margin-bottom:24px;align-items:flex-end;flex-wrap:wrap}.controls>div{display:flex;flex-direction:column;gap:6px}.controls label{font-size:13px;font-weight:500;color:#6b7280;text-transform:uppercase;letter-spacing:.5px}.controls>div:last-child{margin-left:auto;flex-direction:row;gap:8px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(65px,1fr));gap:10px;margin-top:24px}.card-grid .card{cursor:pointer;padding:16px 12px;text-align:center;border-radius:10px;border:2px solid #e5e7eb;background:#fff;font-size:18px;font-weight:600;color:#4b5563;transition:all .2s ease}.card-grid .card:hover{border-color:#a5b4fc;background:#eef2ff}.card-grid .card.selected{border-color:#4f46e5;background:#4f46e5;color:#fff;transform:scale(1.05);box-shadow:0 6px 16px #4f46e54d}.user-list{margin-top:24px}.user-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border:2px solid #f3f4f6;border-radius:10px;margin-bottom:10px;background:#fff;transition:all .2s ease}.user-item:hover{border-color:#e5e7eb;box-shadow:0 2px 6px #0000000d}.avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:14px;text-transform:uppercase;flex-shrink:0}.meta{flex:1;min-width:0}.name{font-weight:600;color:#1f2937;font-size:15px;margin-bottom:2px}.id{font-size:12px;color:#9ca3af;font-family:Monaco,Courier New,monospace}.vote.large{font-weight:700;font-size:24px;color:#4f46e5;min-width:40px;text-align:right}.small{font-size:12px;color:#6b7280}