:root{--ink:#080b0b;--panel:#0d1212;--panel2:#121918;--line:rgba(255,255,255,.11);--paper:#edf2ec;--muted:#7f8c87;--gold:#f6c643;--cyan:#70e6dc}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.5}button,input,select{font:inherit}:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.skip-link{position:fixed;top:.5rem;left:.5rem;transform:translateY(-160%);z-index:20;padding:.7rem 1rem;background:var(--cyan);color:var(--ink);font-weight:900}.skip-link:focus{transform:none}
.community-shell{min-height:100svh;display:grid;grid-template-columns:72px 250px minmax(0,1fr) 240px;background:#0a0e0e}.server-rail{padding:12px 0;display:flex;flex-direction:column;align-items:center;gap:10px;background:#060909;border-right:1px solid var(--line)}.server-logo,.server-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:#151c1b;color:#9aa6a1;text-decoration:none;font-weight:950;transition:.15s ease}.server-logo img{width:42px;height:42px;object-fit:contain}.server-icon:hover,.server-icon.active{border-radius:10px;background:var(--gold);color:var(--ink)}.rail-divider{width:32px;height:1px;background:var(--line)}
.channel-rail{min-height:100svh;display:flex;flex-direction:column;background:#0c1110;border-right:1px solid var(--line)}.server-name{height:64px;padding:0 1.1rem;display:flex;justify-content:center;flex-direction:column;border-bottom:1px solid var(--line)}.server-name span{font-size:.78rem;font-weight:950;letter-spacing:.08em}.server-name small{color:var(--gold);font-size:.52rem;font-weight:900;letter-spacing:.14em}.channel-rail nav{padding:1rem .55rem;flex:1}.channel-rail nav p,.member-rail>p{margin:1.1rem .65rem .45rem;color:#65716c;font-size:.55rem;font-weight:900;letter-spacing:.13em}.channel{width:100%;min-height:38px;padding:.45rem .65rem;display:flex;align-items:center;gap:.65rem;border:0;border-radius:4px;background:transparent;color:#8f9b96;text-decoration:none;text-align:left;cursor:pointer}.channel span{color:#59655f;font-size:1.1rem}.channel:hover,.channel.active{background:#18201e;color:white}.channel.active span{color:var(--cyan)}.identity-card{height:64px;padding:.65rem;display:grid;grid-template-columns:36px 1fr 28px;align-items:center;gap:.6rem;background:#080b0b}.identity-avatar{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:var(--gold);color:var(--ink);font-weight:950}.identity-card div{display:grid}.identity-card b{font-size:.72rem}.identity-card small{color:#65716c;font-size:.48rem}.identity-card button{border:0;background:transparent;color:#76827d;cursor:pointer}
.lobby-main{min-width:0;background-image:linear-gradient(rgba(112,230,220,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(112,230,220,.025) 1px,transparent 1px);background-size:44px 44px}.channel-header{height:64px;padding:0 1.4rem;display:flex;align-items:center;gap:1rem;border-bottom:1px solid var(--line);background:rgba(10,14,14,.92)}.channel-header div{display:flex;gap:.6rem;font-weight:900}.channel-header div b{color:#59655f}.channel-header p{margin:0;padding-left:1rem;border-left:1px solid var(--line);color:#78847f;font-size:.68rem}.channel-header a{margin-left:auto;color:var(--cyan);font-size:.65rem;font-weight:900;text-decoration:none;text-transform:uppercase}.channel-view{width:min(100%,1040px);margin:auto;padding:clamp(2rem,5vw,5rem)}.welcome-panel{padding-bottom:2.5rem;border-bottom:1px solid var(--line)}.eyebrow,.panel-heading small{color:var(--cyan);font-size:.59rem;font-weight:950;letter-spacing:.14em}.welcome-panel h1{margin:.7rem 0 1rem;font-family:Impact,sans-serif;font-size:clamp(4.3rem,9vw,8.5rem);line-height:.9;letter-spacing:-.03em}.welcome-panel h1 span{color:transparent;-webkit-text-stroke:2px var(--gold)}.welcome-panel p{max-width:760px;color:#95a19c}
.room-builder,.templates,.active-room{margin-top:1.25rem;padding:clamp(1.2rem,2.5vw,2rem);border:1px solid var(--line);background:rgba(10,14,14,.91)}.panel-heading{display:flex;justify-content:space-between;align-items:start;gap:1rem;margin-bottom:1.2rem}.panel-heading h2{margin:.25rem 0 0;font-size:1.2rem}.panel-heading>span:not(.status-pill){color:#65716c;font-size:.6rem}.status-pill{padding:.3rem .45rem;border:1px solid rgba(246,198,67,.35);color:var(--gold);font-size:.54rem;font-weight:900;letter-spacing:.1em}.status-pill.ready{border-color:rgba(112,230,220,.35);color:var(--cyan)}.room-builder form{display:grid;grid-template-columns:1.25fr 1fr .65fr auto;align-items:end;gap:.7rem}.room-builder label,dialog label{display:grid;gap:.4rem;color:#77847e;font-size:.58rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.room-builder input,.room-builder select,dialog input{height:48px;padding:0 .8rem;border:1px solid var(--line);border-radius:0;background:#111817;color:white}.primary-action,.secondary-action{min-height:48px;padding:.7rem 1rem;border:1px solid;font-size:.65rem;font-weight:950;letter-spacing:.1em;text-decoration:none;text-transform:uppercase;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.65rem}.primary-action{border-color:var(--gold);background:var(--gold);color:var(--ink)}.secondary-action{border-color:var(--line);background:transparent;color:white}.template-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.template-grid button{min-height:110px;padding:1rem;display:grid;grid-template-columns:28px 1fr;gap:.2rem .7rem;border:1px solid var(--line);background:#101615;color:white;text-align:left;cursor:pointer}.template-grid button:hover{border-color:var(--cyan);background:#141d1b}.template-grid span{grid-row:1/3;color:var(--cyan);font-size:.6rem}.template-grid strong{font-size:.84rem}.template-grid small{color:#718078;font-size:.65rem}.room-code{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem;background:#070a0a}.room-code div{display:grid}.room-code small{color:#65716c;font-size:.52rem;font-weight:900;letter-spacing:.12em}.room-code strong{color:var(--gold);font-size:1.45rem;letter-spacing:.08em}.room-code button{padding:.6rem .8rem;border:1px solid var(--line);background:transparent;color:var(--cyan);font-size:.6rem;font-weight:900;cursor:pointer}.seat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-top:.8rem}.seat{min-height:82px;padding:.8rem;border:1px solid var(--line);display:grid;align-content:center;gap:.2rem}.seat b{font-size:.7rem}.seat small{color:#65716c;font-size:.55rem}.seat.you{border-color:rgba(112,230,220,.4);background:rgba(112,230,220,.05)}.seat.you b{color:var(--cyan)}.room-note{padding:.8rem 1rem;border-left:2px solid var(--gold);background:rgba(246,198,67,.045);color:#7c8983;font-size:.68rem}.room-note b{color:var(--gold)}.room-actions{display:flex;gap:.7rem;margin-top:1rem}
.member-rail{padding:.8rem;background:#0b0f0f;border-left:1px solid var(--line)}.member-rail>a,.status-card{padding:.65rem;display:grid;grid-template-columns:32px 1fr;align-items:center;gap:.6rem;color:white;text-decoration:none}.member-rail>a>span{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#17201e;color:var(--cyan);font-size:.7rem;font-weight:900}.member-rail>a div,.status-card div{display:grid}.member-rail b{font-size:.68rem}.member-rail small{color:#65716c;font-size:.55rem}.status-card i{width:10px;height:10px;margin-left:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px rgba(246,198,67,.5)}.honesty-note{margin-top:2rem;padding:1rem;border:1px solid var(--line);display:grid;gap:.4rem}.honesty-note b{color:var(--gold);font-size:.65rem;text-transform:uppercase}.honesty-note span{color:#718078;font-size:.64rem}
dialog{width:min(520px,calc(100% - 2rem));padding:0;border:1px solid rgba(112,230,220,.35);background:#0c1110;color:white}dialog::backdrop{background:rgba(0,0,0,.8);backdrop-filter:blur(5px)}dialog form{padding:2rem;display:grid;gap:1rem}dialog h2{margin:0;font-family:Impact,sans-serif;font-size:2.5rem;text-transform:uppercase}dialog small{color:var(--cyan);font-weight:900;letter-spacing:.12em}.dialog-close{position:absolute;right:.8rem;top:.8rem;border:0;background:transparent;color:white;font-size:1.4rem}
@media(max-width:1180px){.community-shell{grid-template-columns:64px 230px minmax(0,1fr)}.member-rail{display:none}.room-builder form{grid-template-columns:1fr 1fr}.seat-grid{grid-template-columns:1fr 1fr}}
@media(max-width:780px){.community-shell{grid-template-columns:58px minmax(0,1fr)}.channel-rail{display:none}.server-rail{position:sticky;top:0;height:100svh}.channel-header{height:auto;min-height:62px;flex-wrap:wrap;padding:.7rem 1rem}.channel-header p{display:none}.channel-view{padding:2rem 1rem}.room-builder form{grid-template-columns:1fr}.template-grid{grid-template-columns:1fr}.welcome-panel h1{font-size:clamp(4rem,20vw,6.8rem)}.room-actions{display:grid}.seat-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.seat-grid{grid-template-columns:1fr}.room-code{align-items:flex-start;flex-direction:column}}
.room-browser{margin-top:1.25rem;padding:clamp(1.2rem,2.5vw,2rem);border:1px solid var(--line);background:rgba(10,14,14,.91)}
.status-card.live i{background:var(--cyan);box-shadow:0 0 12px rgba(112,230,220,.65)}.status-card.offline i{background:#69756f;box-shadow:none}
.refresh-rooms{padding:.35rem .55rem;border:1px solid var(--line);background:transparent;color:var(--cyan);font-size:.55rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}.room-list-message{margin:-.45rem 0 1rem;color:#738079;font-size:.68rem}.live-room-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.live-room-card{min-height:108px;padding:1rem;display:grid;align-content:center;gap:.18rem;border:1px solid var(--line);background:#0c1211;color:white;text-align:left;cursor:pointer}.live-room-card:hover{border-color:var(--cyan);background:#111a18}.live-room-card>span{color:var(--cyan);font-size:.54rem;font-weight:950;letter-spacing:.11em}.live-room-card>span i{display:inline-block;width:6px;height:6px;margin-right:.42rem;border-radius:50%;background:var(--cyan);box-shadow:0 0 9px rgba(112,230,220,.65)}.live-room-card strong{font-size:.86rem}.live-room-card small{color:#6f7c76;font-size:.61rem}.empty-room-list{min-height:106px;padding:1rem;display:grid;align-content:center;gap:.25rem;border:1px dashed var(--line);color:#8d9994}.empty-room-list b{font-size:.75rem}.empty-room-list span{color:#65716c;font-size:.64rem}
@media(max-width:780px){.live-room-grid{grid-template-columns:1fr}}
h1,h2,h3{text-wrap:balance;overflow-wrap:normal;word-break:normal}p,li{text-wrap:pretty}
@media(max-width:780px){.welcome-panel h1{font-size:clamp(3.8rem,17vw,6rem)}}