.join{display:flex;flex-direction:column;gap:20px;padding-top:8px}.join section{display:flex;flex-direction:column;gap:16px}.join h1{margin:0}.join label{font-weight:700}.join .code-input{font-family:var(--mono);letter-spacing:.15em;text-transform:lowercase}.join .saved{display:flex;flex-wrap:wrap;gap:8px}.join .saved button{background:var(--panel-2);border:1px solid var(--line);border-radius:999px;padding:9px 16px;color:var(--paper);font-weight:700;font-size:15px}.join .saved button:hover{border-color:var(--flash)}.join .tasks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.join .tasks li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--line)}.join .tasks li:first-child{border-top:0}.join .tasks .what{min-width:0}.join .tasks .what b{display:block}.join .tasks .what small{color:var(--muted);font-size:13px}.join .tasks .done{text-align:right;font-family:var(--mono);font-weight:700;white-space:nowrap}.join .tasks .done small{display:block;font-weight:500;color:var(--muted);font-size:12px}.join .tasks .play{flex:none}.join .live-banner{flex-direction:row;justify-content:space-between;align-items:center;border-color:var(--flash);background:color-mix(in srgb,var(--flash) 14%,var(--panel));color:var(--paper);text-decoration:none;animation:glow 1.6s ease-in-out infinite alternate}.join .live-banner b{display:block;font-size:18px}.join .live-banner small{color:var(--muted)}.join .live-banner .go{font-family:var(--display);font-weight:900;color:var(--flash)}@keyframes glow{to{box-shadow:0 0 24px -4px var(--flash)}}.join .goal,.join .tourney{gap:8px}.join .t-top{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:4px;font-size:14px}.join .t-top li span{margin-right:8px}.join .t-top li b{font-family:var(--mono);font-size:13px;color:var(--muted)}.join .t-top li.me{color:var(--flash);font-weight:700}.join .tourney .hint{font-size:12px}.join .goal-top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.join .goal-top span{font-family:var(--mono);font-weight:700;color:var(--flash)}.join .goal-bar{height:10px;border-radius:5px;background:var(--panel-2);overflow:hidden}.join .goal-bar i{display:block;height:100%;width:0;background:var(--flash);transition:width .6s}.join .goal-bar i.done{background:var(--good)}.join .practise{flex-direction:row;justify-content:space-between;align-items:center;color:var(--paper);text-decoration:none}.join .practise b{display:block}.join .practise small{color:var(--muted)}.join .practise .go{font-family:var(--display);font-weight:900;color:var(--flash);white-space:nowrap}.join .world{gap:10px}.join .world-map svg{display:block;width:100%;height:auto;border-radius:8px;background:#10162a}.join .world-map .land{fill:#2a3150;stroke:#10162a;stroke-width:.3}.join .world-map .not{fill:#3a4262;stroke:#10162a;stroke-width:.3}.join .world-map .got{fill:var(--good);stroke:#10162a;stroke-width:.3}.join .world-map .miss{fill:#ff9f43;stroke:#10162a;stroke-width:.3}.join .world-map .dot{stroke:#10162a;stroke-width:.6}.join .world-map .not.dot{display:none}.join .world .legend{margin:0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;font-size:13px;color:var(--muted)}.join .world .legend .k{width:12px;height:12px;border-radius:3px;display:inline-block}.join .world .legend .k.got{background:var(--good)}.join .world .legend .k.miss{background:#ff9f43}.join .world .legend .k.not{background:#3a4262}.join .world .regions{list-style:none;margin:0;padding:0;display:grid;gap:6px}.join .world .regions li{display:grid;grid-template-columns:90px 1fr auto;gap:10px;align-items:center;font-size:14px;font-weight:700}.join .world .regions i{height:8px;border-radius:4px;background:var(--panel-2);overflow:hidden;display:block}.join .world .regions i b{display:block;height:100%;background:var(--good)}.join .world .regions small{color:var(--muted);font-family:var(--mono)}.join .badges-head{display:flex;justify-content:space-between;align-items:baseline}.join .streak{font-weight:800}.join .badges{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}.join .badges li{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:10px 6px;border-radius:10px;background:var(--panel-2);font-size:13px;font-weight:700;line-height:1.2}.join .badges li .i{font-size:28px;line-height:1}.join .badges li small{color:var(--muted);font-weight:500;font-size:11px}.join .badges li .cert{margin-top:2px;background:none;border:0;padding:0;color:var(--flash);font:inherit;font-size:11px;font-weight:700;text-decoration:underline;cursor:pointer}.join .badges li.no{opacity:.4;filter:grayscale(1)}.join .avatar{display:inline-grid;place-items:center;width:1.25em;height:1.25em;border-radius:50%;background:var(--c, var(--panel-2));margin-right:.3em;font-size:.9em;font-style:normal;vertical-align:-.15em}.join .me-flag{height:.55em;margin-left:.3em;vertical-align:.1em;border-radius:2px}.join .shop .label.sub{margin:4px 0 0;font-size:12px}.join .shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}.join .shop-grid button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:10px;border:2px solid transparent;background:var(--panel-2);color:inherit;font:inherit;font-size:12px;font-weight:700;cursor:pointer}.join .shop-grid button .i{font-size:28px;line-height:1.1}.join .shop-grid.colours button .i{width:28px;height:28px;border-radius:50%;background:var(--c)}.join .shop-grid button[aria-pressed=true]{border-color:var(--flash)}.join .shop-grid button.locked{opacity:.45;cursor:default}.join .shop-grid button small{color:var(--muted);font-weight:600;font-size:11px}.join .shop .fav{display:flex;gap:10px;align-items:center;font-weight:700;flex-wrap:wrap}.join .shop .fav select{flex:1;min-width:160px}.join .homework{border-color:color-mix(in srgb,var(--flash) 50%,var(--line))}.join .tasks .due{font-weight:700;color:var(--flash)}.join .tasks .due.late{color:var(--bad)}.join .tasks .hw-acts{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none}.join .access summary{cursor:pointer;display:flex;gap:8px;align-items:baseline}.join .access[open]{gap:12px}.join .access .check{display:flex;gap:10px;align-items:flex-start;font-weight:700}.join .access .check input{width:20px;height:20px;margin-top:2px}.join .access .check small{display:block;color:var(--muted);font-weight:500;font-size:13px}.join .standing{margin:8px 0 0;font-family:var(--mono);font-size:14px;color:var(--flash)}