:root{--asphalt:#14171a;--concrete:#23282b;--bone:#d7d2c4;--lichen:#8b9a6b;--sodium:#d9a441;--rust:#b2573a;--display:"Avenir Next Condensed", "DIN Condensed", "Roboto Condensed", "Arial Narrow", sans-serif;--body:"Avenir Next", "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box}html,body,#app{height:100%;margin:0}body{background:var(--asphalt);color:var(--bone);font:15px/1.5 var(--body);overflow:hidden}#app canvas{width:100%;height:100%;display:block;position:fixed;inset:0}[hidden]{display:none!important}.join{z-index:10;background:#1d2120;grid-template-rows:1fr auto;grid-template-columns:minmax(0,520px) 1fr minmax(0,340px);column-gap:32px;padding:72px clamp(20px,5vw,72px) clamp(20px,5vw,72px);display:grid;position:fixed;inset:0;overflow:hidden auto}.join-art{pointer-events:none;background:var(--art) var(--focus,center) / cover no-repeat;position:fixed;inset:0;overflow:hidden}.join-art:after{content:"";background:linear-gradient(90deg,#0d0f0fd1 0%,#0d0f0f73 32%,#0000 56%),linear-gradient(#0000 64%,#0d0f0fcc 100%),linear-gradient(#0d0f0f73 0%,#0000 16%);position:absolute;inset:0}.join-main:before{content:"";z-index:-1;pointer-events:none;-webkit-backdrop-filter:blur(7px);position:absolute;inset:-40px -56px -24px;-webkit-mask-image:radial-gradient(closest-side,#000 55%,#0000);mask-image:radial-gradient(closest-side,#000 55%,#0000)}.join-main{grid-area:1/1/3;align-self:end;justify-items:start;display:grid;position:relative}.join-title{font:800 clamp(84px, 13vw, 168px) / .8 var(--display);letter-spacing:-.02em;text-transform:uppercase;color:var(--bone);text-shadow:0 4px 30px #0009;margin:0 0 0 -.04em}.join-title span{letter-spacing:.32em;color:var(--sodium);margin:0 0 .04em .06em;font-size:.24em;font-weight:600;display:block}.join-hook{color:#d7d2c4d1;text-shadow:0 1px 6px #000c;max-width:38ch;margin:18px 0 30px;font-size:16px}.join-form,.join-return{width:min(100%,460px)}.join label{color:#d7d2c4d9;margin-bottom:8px;font-size:14px;display:block}.join-row{gap:8px;display:flex}.join input,.join button,.join select{font:inherit;border-radius:2px}.join-row input{min-width:0;height:52px;color:var(--bone);background:#0c0e10c7;border:1px solid #d7d2c447;flex:1;padding:0 16px;font-size:17px}.join-row input::placeholder{color:#d7d2c459}.join-enter,.join-continue{color:#17140d;background:var(--sodium);cursor:pointer;border:0;height:52px;padding:0 26px;font-size:16px;font-weight:700;box-shadow:0 6px 28px #d9a44140}.join-enter:hover,.join-continue:hover{background:#e8b65a}.join-enter:disabled,.join-continue:disabled{color:#2a251b;box-shadow:none;cursor:progress;background:#6b5b3a}.join-continue{text-align:left;width:100%;font-size:18px}.join-continue b{font-weight:800}.join-link{color:#d7d2c4cc;text-underline-offset:3px;cursor:pointer;background:0 0;border:0;margin-top:10px;padding:4px 0;text-decoration:underline}.join-link:hover{color:var(--bone)}.join-forget{color:#d7d2c499;max-width:46ch;margin:10px 0 0;font-size:13px}.join :focus-visible{outline:2px solid var(--bone);outline-offset:3px}.join-status{min-height:1.5em;color:var(--sodium);margin:12px 0 0;font-size:14px}.join-error{border-left:3px solid var(--rust);color:#f1c7b6;background:#3c140cd1;width:min(100%,460px);margin-top:6px;padding:10px 14px}.join-error p{margin:0}.join-reload{background:var(--bone);color:#17140d;cursor:pointer;border:0;height:34px;margin-top:8px;padding:0 14px;font-weight:600}.join-device{color:#d7d2c4b3;max-width:40ch;margin:16px 0 0;font-size:13px;display:none}.join-info{color:#d7d2c4c7;text-shadow:0 1px 4px #000000e6;grid-area:2/3;align-self:end;font-size:13px;position:relative}.join-info p{margin:0 0 6px}.join-server{color:var(--bone);align-items:baseline;gap:9px;display:flex}.join-server i{background:#6d716c;border-radius:50%;flex:none;width:8px;height:8px;translate:0 -1px}.join-server[data-state=up] i{background:var(--lichen);box-shadow:0 0 8px var(--lichen)}.join-server[data-state=full] i{background:var(--sodium)}.join-server[data-state=down] i{background:var(--rust)}.join-sky{padding-left:17px}.join-emission{color:#ffd9cf;background:#5a120ad9;border-left:3px solid #ff6a45;padding:6px 10px}.join-controls{border-top:1px solid #d7d2c42e;margin-top:10px;padding-top:8px}.join-controls summary{cursor:pointer;color:var(--bone);width:max-content}.join-controls dl{background:#0c0e10d1;grid-template-columns:auto auto;gap:4px 14px;margin:10px 0 8px;padding:12px 14px;display:grid}.join-controls dt{color:#d7d2c4b3}.join-controls dd{flex-wrap:wrap;gap:4px;margin:0;display:flex}.join kbd{min-width:20px;font:600 12px/18px var(--body);text-align:center;color:var(--bone);background:#d7d2c41f;border:1px solid #d7d2c440;border-radius:3px;padding:0 5px}.join-controls>p{color:#d7d2c48c;font-size:12px}.join-gear{z-index:2;height:34px;color:var(--bone);cursor:pointer;background:#0c0e1099;border:1px solid #d7d2c438;align-items:center;gap:7px;padding:0 12px;font-size:13px;display:flex;position:fixed;top:18px;right:20px}.join-gear svg{fill:currentColor;width:16px;height:16px}.join-gear:hover,.join-gear[aria-expanded=true]{background:#0c0e10e6}.join-settings{z-index:2;background:#101314f5;border:1px solid #d7d2c433;gap:10px;width:290px;padding:14px 16px;font-size:13px;display:grid;position:fixed;top:60px;right:20px}.join-settings label{grid-template-columns:78px 1fr 30px;align-items:center;gap:10px;margin:0;display:grid}.join-settings output{text-align:right;color:#d7d2c4b3}.join-settings input[type=range]{accent-color:var(--sodium)}.join-settings select{height:30px;color:var(--bone);background:#22282a;border:1px solid #d7d2c440;grid-column:2/4}@media (max-width:1000px){.join{grid-template-rows:1fr auto auto;grid-template-columns:minmax(0,1fr);row-gap:28px}.join-main{grid-row:2}.join-info{grid-area:3/1;max-width:460px}.join-art:after{background:linear-gradient(#0000 15%,#0d0f0fb3 50%,#0d0f0ff2 100%),linear-gradient(#0d0f0f80 0%,#0000 18%)}}@media (pointer:coarse),(max-width:700px){.join-device{display:block}}@media (max-width:520px){.join-row{flex-direction:column}.join-row input{flex:none}.join-enter{width:100%}.join-gear span{display:none}}@media (prefers-reduced-motion:reduce){.hint{transition:none}}