:root{color-scheme:dark;font-family:system-ui,-apple-system,"PingFang SC","Microsoft Yahei",sans-serif;color:#edf2ff;background:#09111d;--muted:#8898ae;--line:#223044;--accent:#9b8bff}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 75% 30%,#27214840,transparent 55%);min-height:100vh}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);transition:background .18s,transform .18s}button:hover{background:#25304a}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}.shell{max-width:1220px;margin:auto;padding:0 32px}header{height:110px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{color:inherit;text-decoration:none;display:flex;align-items:center;gap:14px;font-weight:700;font-size:24px;letter-spacing:.2px}.brand small{display:block;font-size:11px;font-weight:400;letter-spacing:3px;color:var(--muted);margin-top:5px}.brand-icon{display:grid;place-items:center;width:47px;height:47px;background:linear-gradient(135deg,#8b7cf7,#50b7c5);border-radius:14px;font-size:40px;font-weight:400}.header-right{display:flex;gap:12px;align-items:center}.badge{border:1px solid var(--line);border-radius:30px;padding:9px 14px;font-size:12px;color:#becbdc;background:#131e2c}.quiet{padding:9px 12px;border-radius:9px;background:transparent;font-size:13px}.entry{display:grid;grid-template-columns:1.1fr 1fr;gap:65px;padding:85px 15px 0;align-items:center}.eyebrow{font-size:12px;letter-spacing:3px;color:#50d2d4;font-weight:700}.intro h1{font-size:clamp(32px,4.6vw,57px);line-height:1.35;letter-spacing:-2px;margin:22px 0}.intro h1 span{color:#ad9fff}.intro p{color:var(--muted);line-height:1.9;font-size:15px}.specs{display:flex;gap:10px;margin-top:26px}.specs span{padding:7px 13px;background:#142033;border:1px solid #25334a;border-radius:9px;font-size:12px;color:#b4c1d2}.join-card{background:linear-gradient(145deg,#142136,#101927);border:1px solid #2b374c;border-radius:23px;padding:32px;box-shadow:0 25px 80px #0003}.card-heading{font-size:12px;color:#acb9cb;display:flex;align-items:center;gap:8px}.live-dot{width:7px;height:7px;background:#728198;border-radius:50%;display:inline-block}.live-dot.open{background:#45d9a4;box-shadow:0 0 10px #45d9a460}h2{font-size:22px;margin:20px 0 8px}.muted{color:var(--muted);font-size:13px;line-height:1.8}.join-card label,form label{display:block;color:#c4cddb;font-size:13px;margin:25px 0 10px}input:not([type=range]),select{width:100%;border:1px solid #2b384e;background:#0b1422;color:#e5eaf2;border-radius:11px;padding:14px;min-width:0}.primary,.secondary{width:100%;padding:14px;border-radius:11px;margin-top:18px;font-weight:600}.primary{background:#8370f1;border-color:#9a89ff;color:white}.primary:hover{background:#9885ff}.secondary{background:#1a263a}.hint{color:#7889a0;font-size:11px;text-align:center;margin:20px 0 0}.notice{grid-column:1/-1;text-align:center;color:#7b8aa0;font-size:12px;line-height:1.8;margin-top:0}footer{text-align:center;font-size:11px;color:#516077;padding:40px 0;letter-spacing:1px}footer span{padding:0 8px}.room-heading{display:flex;align-items:center;justify-content:space-between;margin:38px 0 24px}.room-heading h1{font-size:30px;margin:10px 0}.member-panel{border:1px solid var(--line);border-radius:24px;background:linear-gradient(150deg,#122035,#0e1727);padding:28px 32px;min-height:380px}.panel-heading{display:flex;justify-content:space-between;align-items:center}.panel-heading h2{font-size:17px;margin:0}.members{display:grid;grid-template-columns:repeat(5,1fr);row-gap:32px;padding:38px 0 20px}.member{text-align:center;min-width:0}.avatar{height:68px;width:68px;display:grid;place-items:center;font-size:24px;margin:auto auto 12px;background:linear-gradient(135deg,#444a80,#5a326a);border:3px solid #58619a;border-radius:50%;transition:box-shadow .15s}.member.active .avatar{box-shadow:0 0 0 5px #46d9bc26;border-color:#58cfb6}.member .name{font-weight:600;font-size:13px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:0 10px}.member small{display:block;color:#71839c;font-size:11px;margin-top:6px}.empty .avatar{background:transparent;border:2px dashed #2a384f;color:#465975;font-size:26px}.empty .name{color:#60708a;font-weight:400}.network-bar{display:flex;justify-content:center;gap:25px;font-size:11px;color:#7f91ad;padding:20px 0;flex-wrap:wrap}.controls{display:flex;justify-content:center;gap:12px;margin:18px 0}.control{background:#152134;border-radius:15px;padding:13px 17px;min-width:120px;display:flex;align-items:center;gap:9px}.control span{font-size:20px}.control b{font-size:12px;font-weight:500}.control[aria-pressed=true]{border-color:#4f547f;background:#292b48}.control-wrap{position:relative}.popover{visibility:hidden;opacity:0;pointer-events:none;position:absolute;z-index:5;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(5px);width:295px;background:#172337;border:1px solid #39485f;border-radius:18px;padding:20px;box-shadow:0 15px 50px #0008;transition:opacity .15s,transform .15s}.popover:after{content:"";position:absolute;top:100%;height:14px;left:0;right:0}.control-wrap:hover .popover,.control-wrap:focus-within .popover{visibility:visible;opacity:1;pointer-events:auto;transform:translateX(-50%)}.popover h3{font-size:14px;margin:0 0 16px}.popover select{font-size:12px;padding:10px}.popover label{display:flex;justify-content:space-between;font-size:12px;margin:20px 0 12px;color:#c5cfdf}.popover output{color:#ad9fff}.popover input{width:100%;accent-color:#9683fc}.popover small{font-size:10px;line-height:1.6;color:#7d90ac;display:block;margin-top:10px}.danger{color:#eea4ac}.room-note{color:#64758e;text-align:center;font-size:11px}dialog{background:#142035;border:1px solid #3a4660;color:inherit;width:min(440px,calc(100% - 32px));padding:28px;border-radius:22px}dialog::backdrop{background:#040811ba;backdrop-filter:blur(8px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between}.dialog-heading h2{margin:0;font-size:20px}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);max-width:min(540px,90vw);padding:14px 22px;background:#23344c;border:1px solid #485873;border-radius:14px;box-shadow:0 5px 25px #0006;font-size:13px;z-index:20;line-height:1.7}@media(max-width:760px){.shell{padding:0 20px}header{height:90px}.brand{font-size:20px}.brand-icon{width:40px;height:40px;font-size:30px}.entry{grid-template-columns:1fr;gap:30px;padding:40px 0 0}.intro h1{font-size:36px}.intro p br{display:none}.intro p{font-size:13px}.join-card{padding:25px}.notice{text-align:left}.members{grid-template-columns:repeat(2,1fr);row-gap:30px}.member-panel{padding:24px 18px}.controls{gap:8px;flex-wrap:wrap}.control{min-width:unset;padding:14px 11px}.control b{font-size:11px}.popover{width:260px;left:0;transform:translateY(5px)}.control-wrap:hover .popover,.control-wrap:focus-within .popover{transform:translateY(0)}.control-wrap:nth-child(2) .popover{left:auto;right:-45px}.network-bar{gap:12px}.room-heading h1{font-size:25px}.badge{padding:8px 10px;font-size:11px}}
