*,:before,:after{box-sizing:border-box}body{margin:0}.join{background:var(--bg);color:var(--fg);font-family:var(--font-mono);justify-content:center;align-items:center;padding:22px;display:flex;position:fixed;inset:0;overflow:auto}.join-bg{z-index:0;filter:saturate(1.05)contrast(1.05);background-image:linear-gradient(#22c7c70b 1px,#0000 1px),linear-gradient(90deg,#22c7c70b 1px,#0000 1px),radial-gradient(120% 90% at 50% 30%,#02080a80,#000000e6 80%),url(/art/world/overview.webp);background-position:0 0,0 0,50%,50%;background-repeat:repeat,repeat,no-repeat,no-repeat;background-size:52px 52px,52px 52px,cover,cover;position:absolute;inset:0}.join-scan{z-index:1;pointer-events:none;opacity:.5;background:repeating-linear-gradient(0deg,#0000 0 2px,#00000038 2px 3px);position:absolute;inset:0}.jc{z-index:2;border:2px solid var(--accent);opacity:.65;width:42px;height:42px;position:absolute}.jc.tl{border-bottom:0;border-right:0;top:12px;left:12px}.jc.tr{border-bottom:0;border-left:0;top:12px;right:12px}.jc.bl{border-top:0;border-right:0;bottom:12px;left:12px}.jc.br{border-top:0;border-left:0;bottom:12px;right:12px}.join-wrap{z-index:3;grid-template-columns:1.05fr .95fr;align-items:stretch;gap:18px;width:100%;max-width:940px;display:grid;position:relative}.join-brief{border:1px solid var(--border);box-shadow:inset 0 0 50px -20px var(--accent);background:linear-gradient(160deg,#040b0dd1,#0206088c);flex-direction:column;justify-content:center;gap:4px;padding:26px 24px;display:flex}.join-emblem{object-fit:contain;filter:drop-shadow(0 0 16px #000000b3);width:96px;height:96px}.join-title{font-size:var(--lg);letter-spacing:.12em;color:var(--gold);margin-top:12px;font-weight:700}.join-title b{color:var(--accent);font-weight:700}.join-sub{font-size:var(--xs);letter-spacing:.42em;color:var(--accent);margin:4px 0 14px}.hazard{border:1px solid var(--danger);background:repeating-linear-gradient(45deg,#e2222ee6 0 9px,#280406e6 9px 18px);margin-bottom:16px}.hazard span{text-align:center;font-size:var(--xs);letter-spacing:.1em;color:#fff;background:#060a0cc7;margin:3px;padding:6px 8px;font-weight:700;display:block}.brief{border-top:1px solid var(--border);padding-top:12px}.brief-h{font-size:var(--xs);letter-spacing:.14em;color:var(--fg-dim);margin-bottom:8px}.brief-h span{color:var(--accent)}.brow{font-size:var(--xs);border-bottom:1px solid var(--border);letter-spacing:.05em;justify-content:space-between;gap:12px;padding:4px 0;display:flex}.bk{color:var(--fg-dim)}.bv{color:var(--fg)}.bv.gold{color:var(--gold);font-weight:700}.bv.amber{color:var(--amber)}.bv.ok{color:var(--accent)}.brief-foot{color:var(--fg-dim);letter-spacing:.08em;margin-top:12px;font-size:9px}.join-card{border:1px solid var(--border);box-shadow:inset 0 0 40px -18px var(--accent), 0 14px 50px #0009;background:linear-gradient(#040b0df2,#020608e6);flex-direction:column;justify-content:center;padding:22px;display:flex}.join-state{font-size:var(--xs);letter-spacing:.1em;border:1px solid var(--border);text-align:center;margin-bottom:16px;padding:10px}.join-state.live{color:var(--accent);border-color:var(--accent);box-shadow:inset 0 0 24px -10px var(--accent)}.join-state.standby{color:var(--amber);border-color:var(--amber);box-shadow:inset 0 0 24px -12px var(--amber)}.join-state.ended{color:var(--danger);border-color:var(--danger);box-shadow:inset 0 0 24px -12px var(--danger)}.join-state b{font-size:var(--md);letter-spacing:.12em;margin-top:4px;display:block}.join-body.locked{opacity:.32;pointer-events:none;filter:grayscale(.7)}.join-or{color:var(--fg-dim);font-size:var(--xs);letter-spacing:.12em;align-items:center;gap:10px;margin:14px 0 10px;display:flex}.join-or:before,.join-or:after{content:"";background:var(--border);flex:1;height:1px}.join-in{border:1px solid var(--border);width:100%;color:var(--fg);font-family:inherit;font-size:var(--sm);text-transform:none;background:#0000008c;outline:none;margin-bottom:8px;padding:12px}.join-in:focus{border-color:var(--accent);box-shadow:0 0 14px -6px var(--accent)}.join-go{background:var(--accent);border:1px solid var(--accent);color:#00171a;width:100%;font-family:inherit;font-size:var(--sm);letter-spacing:.1em;cursor:pointer;margin-top:4px;padding:13px;font-weight:700;transition:all .14s}.join-go:hover{filter:brightness(1.12);box-shadow:0 0 20px -4px var(--accent)}.join-out{font-size:var(--xs);letter-spacing:.03em;min-height:16px;color:var(--accent);text-transform:none;margin-top:12px;line-height:1.6}.join-out.bad{color:var(--danger)}.join-out.wait{color:var(--amber)}.join-out.ok,.join-out a{color:var(--accent)}.join-out .jw{color:var(--amber)}.join-foot{color:var(--fg-dim);letter-spacing:.05em;border-top:1px solid var(--border);text-transform:none;margin-top:16px;padding-top:12px;font-size:9px;line-height:1.6}.join-demo{color:var(--fg-dim);letter-spacing:.08em;margin-top:10px;font-size:9px}.join-demo button{border:1px solid var(--border);color:var(--fg-dim);cursor:pointer;background:0 0;margin-left:3px;padding:3px 7px;font-family:inherit;font-size:9px}.join-demo button:hover{border-color:var(--accent);color:var(--accent)}@media (width<=760px){.join-bg{background-image:linear-gradient(#22c7c70b 1px,#0000 1px),linear-gradient(90deg,#22c7c70b 1px,#0000 1px),radial-gradient(120% 90% at 50% 30%,#02080a80,#000000e6 80%),url(/art/world/overview-mobile.webp)}.join{align-items:flex-start;padding:14px}.join-wrap{grid-template-columns:1fr;gap:12px;max-width:460px}.join-brief{text-align:center;align-items:center;padding:16px}.join-emblem{width:66px;height:66px}.join-title{margin-top:8px}.join-sub{margin:3px 0 12px}.hazard{width:100%;margin-bottom:0}.brief,.brief-foot{display:none}.jc{width:26px;height:26px}}@media (prefers-reduced-motion:no-preference){.join-brief{animation:.5s 50ms both surface-boot}.join-card{animation:.5s .16s both surface-boot}}@keyframes surface-boot{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.join-brief{position:relative}.join-daemon{pointer-events:none;filter:drop-shadow(0 3px 6px #000000a6);position:absolute;top:16px;right:16px}@media (width<=760px){.join-daemon{top:10px;right:10px}}.join-event-entry{border-top:1px solid var(--border);font-size:var(--xs);text-transform:none;overflow-wrap:anywhere;margin-top:16px;padding-top:12px;line-height:1.6}.join-event-entry b{color:var(--gold)}.join-event-entry a{color:var(--accent);padding:8px 0;display:block}.join-event-entry p{color:var(--fg-dim);margin:8px 0}