:root{--join-bg: #12151b;--join-panel: #1a1f29;--join-line: #2a3140;--join-text: #e8ebf1;--join-dim: #9aa3b5;--join-accent: #57a8ff;--join-warn: #ffb4a8;--join-field: #0f131a;color-scheme:dark}:root[data-theme=light]{--join-bg: #eef1f6;--join-panel: #ffffff;--join-line: #d5dbe6;--join-text: #1d2330;--join-dim: #5b6475;--join-accent: #1463de;--join-warn: #b3261e;--join-field: #f6f8fb;color-scheme:light}html{height:100%}.join-body{min-height:100%;margin:0;background:var(--join-bg);color:var(--join-text);font:17px/1.45 Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%}.join{box-sizing:border-box;display:grid;grid-template-rows:auto 1fr auto;justify-items:center;gap:18px;min-height:100vh;min-height:100dvh;padding:18px 16px 22px}.join-brand{color:var(--join-text);font-size:22px;font-weight:800;letter-spacing:.08em;text-decoration:none}.join-card{box-sizing:border-box;align-self:center;width:100%;max-width:460px;padding:14px;border:1px solid var(--join-line);border-radius:24px;background:var(--join-panel)}.join-hero{padding:22px 22px 24px;border-radius:16px;background:#1463de linear-gradient(135deg,#1463de,#0b2a66);color:#fff}.join-label{margin:0;color:#cfe0ff;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.join-title{margin:6px 0 0;font-size:clamp(30px,8.4vw,40px);font-weight:800;line-height:1.1;letter-spacing:-.01em;overflow-wrap:anywhere}.join-line{margin:8px 0 0;color:#cfe0ff;font-size:16px}.join-hero-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.join-chip{flex:0 0 auto;width:84px;height:84px;image-rendering:pixelated}.join-form,.join-actions{display:grid;gap:12px;padding:18px 8px 6px}.join-field-label{color:var(--join-dim);font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.join-code{box-sizing:border-box;width:100%;min-height:76px;padding:10px 14px;border:2px solid var(--join-line);border-radius:16px;background:var(--join-field);color:var(--join-text);font:700 clamp(30px,9vw,40px)/1.1 ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;letter-spacing:.16em;text-align:center;text-transform:uppercase}.join-code::placeholder{color:var(--join-dim);opacity:.45}.join-code:focus-visible{outline:3px solid var(--join-accent);outline-offset:2px;border-color:var(--join-accent)}.join-code[aria-invalid=true]{border-color:var(--join-warn)}.join-go,.join-way{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;min-height:64px;padding:12px 18px;border:0;border-radius:var(--btn-radius, 999px);background:#1463de;color:#fff;font-family:inherit;font-size:20px;font-weight:800;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;overflow-wrap:anywhere}.join-go:hover,.join-way:hover{background:#0f55c4}.join-go:focus-visible,.join-way:focus-visible,.join-small a:focus-visible,.join-foot a:focus-visible{outline:3px solid var(--join-accent);outline-offset:3px}.join-go[disabled]{opacity:.6;cursor:default}.join-way-plain{border:2px solid var(--join-line);background:transparent;color:var(--join-text)}.join-way-plain:hover{background:var(--join-field)}.join-way small{display:block;margin-top:2px;font-size:14px;font-weight:500;opacity:.85}.join-way>span{display:block}.join-message{min-height:1.45em;margin:0;color:var(--join-dim);font-size:16px;text-align:center}.join-message[data-kind=error]{color:var(--join-warn);font-weight:600}.join-small{margin:8px 8px 6px;font-size:15px;text-align:center}.join-small a,.join-foot a{color:var(--join-accent)}.join-foot{max-width:460px;margin:0;color:var(--join-dim);font-size:13px;text-align:center}.join-next{margin:16px 0 0;padding:0 8px;color:var(--join-dim);font-size:16px}.join-next b{color:var(--join-text)}@media(prefers-reduced-motion:no-preference){.join[data-screen=in] .join-card{animation:join-in .28s ease-out}@keyframes join-in{0%{transform:scale(.96);opacity:.4}to{transform:none;opacity:1}}}.join-nick{font:800 clamp(26px,7.4vw,34px)/1.15 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:0;text-transform:none}.join[data-screen=nickname] .join-hero{background:#1463de linear-gradient(135deg,#1463de,#6a2bd9)}@media(prefers-reduced-motion:no-preference){.join[data-screen=nickname] .join-card{animation:join-in .28s ease-out}}
