:root{--cos-hex:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 188' preserveAspectRatio='none'%3E%3Cpath d='M193.248 69.51C185.95 54.1634 177.44 39.4234 167.798 25.43L164.688 20.96C160.859 15.4049 155.841 10.7724 149.998 7.3994C144.155 4.02636 137.633 1.99743 130.908 1.46004L125.448 1.02004C108.508 -0.340012 91.4873 -0.340012 74.5479 1.02004L69.0879 1.46004C62.3625 1.99743 55.8413 4.02636 49.9981 7.3994C44.155 10.7724 39.1367 15.4049 35.3079 20.96L32.1979 25.47C22.5561 39.4634 14.0458 54.2034 6.74793 69.55L4.39793 74.49C1.50169 80.5829 0 87.2441 0 93.99C0 100.736 1.50169 107.397 4.39793 113.49L6.74793 118.43C14.0458 133.777 22.5561 148.517 32.1979 162.51L35.3079 167.02C39.1367 172.575 44.155 177.208 49.9981 180.581C55.8413 183.954 62.3625 185.983 69.0879 186.52L74.5479 186.96C91.4873 188.32 108.508 188.32 125.448 186.96L130.908 186.52C137.638 185.976 144.163 183.938 150.006 180.554C155.85 177.17 160.865 172.526 164.688 166.96L167.798 162.45C177.44 148.457 185.95 133.717 193.248 118.37L195.598 113.43C198.494 107.337 199.996 100.676 199.996 93.93C199.996 87.1841 198.494 80.5229 195.598 74.43L193.248 69.51Z'/%3E%3C/svg%3E")}.cos-avatar{--cos-r:999px;width:var(--size);height:var(--size);flex-shrink:0;place-items:center;display:inline-grid;position:relative}.cos-avatar[data-shape=rounded]{--cos-r:calc(var(--size) * .24)}.cos-avatar[data-shape=square]{--cos-r:max(4px, calc(var(--size) * .06))}.cos-avatar-img{border-radius:var(--cos-r);background:var(--raised);width:100%;height:100%;color:var(--ink-2);font-size:calc(var(--size) * .4);box-shadow:inset 0 0 0 1px var(--line-strong);place-items:center;font-weight:500;display:grid;overflow:hidden}.cos-avatar-img img{object-fit:cover;width:100%;height:100%}.cos-avatar[data-shape=hexagon] .cos-avatar-img{box-shadow:none;-webkit-mask:var(--cos-hex) center / 100% 100% no-repeat;-webkit-mask:var(--cos-hex) center / 100% 100% no-repeat;mask:var(--cos-hex) center / 100% 100% no-repeat;border-radius:0}.cos-frame{--fo:calc(var(--size) * .07);--fw:max(2px, calc(var(--size) * .03));inset:calc(var(--fo) * -1);padding:var(--fw);border-radius:calc(var(--cos-r) + var(--fo));background:var(--paint,transparent);pointer-events:none;position:absolute;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor,source-over;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.cos-avatar[data-shape=hexagon] .cos-frame{-webkit-mask:var(--cos-hex) center / calc(100% - 2 * var(--fw)) calc(100% - 2 * var(--fw)) no-repeat exclude, var(--cos-hex) center / 100% 100% no-repeat;-webkit-mask:var(--cos-hex) center / calc(100% - 2 * var(--fw)) calc(100% - 2 * var(--fw)) no-repeat exclude, var(--cos-hex) center / 100% 100% no-repeat;mask:var(--cos-hex) center / calc(100% - 2 * var(--fw)) calc(100% - 2 * var(--fw)) no-repeat exclude, var(--cos-hex) center / 100% 100% no-repeat;border-radius:0}.cos-frame-ring .cos-frame{--fo:calc(var(--size) * .065);--paint:var(--cos-ring,#fff)}.cos-frame-gold .cos-frame{--fw:max(2px, calc(var(--size) * .045));--paint:conic-gradient(from 210deg, #f8e7a2, #c99a2e, #fff1b8, #a87918, #f8e7a2)}.cos-frame-pulse .cos-frame{--fo:calc(var(--size) * .06);--paint:#c3a6ff}.cos-avatar.cos-frame-pulse{animation:2.4s ease-in-out infinite cos-pulse}@keyframes cos-pulse{0%,to{filter:drop-shadow(0 0 #c3a6ff00)}50%{filter:drop-shadow(0 0 calc(var(--size) * .06) #c3a6ffbf)}}.cos-frame-orbit .cos-frame{--fo:calc(var(--size) * .08);--paint:conic-gradient(from var(--cos-angle,0deg), transparent 0 70%, #9fd8ff 85%, #fff 100%);animation:2.8s linear infinite cos-spin}.cos-frame-spectrum .cos-frame{--fo:calc(var(--size) * .08);--fw:max(2px, calc(var(--size) * .045));--paint:conic-gradient(from var(--cos-angle,0deg), #ff3264, #ffa01e, #32c850, #28b4dc, #6446ff, #b428f0, #ff3264);animation:4s linear infinite cos-spin}.cos-frame-crosshair .cos-frame{--fo:calc(var(--size) * .14);background:linear-gradient(#fff,#fff) top/max(2px,6%) 18% no-repeat,linear-gradient(#fff,#fff) bottom/max(2px,6%) 18% no-repeat,linear-gradient(#fff,#fff) 0/18% max(2px,6%) no-repeat,linear-gradient(#fff,#fff) 100%/18% max(2px,6%) no-repeat;border-radius:0;padding:0;-webkit-mask:none;mask:none}@property --cos-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes cos-spin{to{--cos-angle:360deg}}.cos-nameplate{isolation:isolate;border-radius:8px;align-items:center;gap:8px;max-width:100%;display:inline-flex;position:relative}.cos-nameplate[class*=cos-nameplate-]{padding:3px 10px 3px 6px;overflow:hidden}.cos-nameplate[class*=cos-nameplate-]:before,.cos-nameplate[class*=cos-nameplate-]:after{content:"";z-index:-1;pointer-events:none;animation-play-state:paused;position:absolute;inset:0}.cos-nameplate[class*=cos-nameplate-]:before{background:linear-gradient(90deg, color-mix(in srgb, var(--np) 10%, transparent), color-mix(in srgb, var(--np) 26%, transparent))}.cos-nameplate[class*=cos-nameplate-]:after{left:28%;-webkit-mask:linear-gradient(90deg,#0000,#000 55%);mask:linear-gradient(90deg,#0000,#000 55%)}:is(a,button,li,.cos-nameplate):hover>.cos-nameplate:after,:is(a,button,li):hover .cos-nameplate:after,.cos-nameplate:hover:after{animation-play-state:running}.cos-nameplate.np-author{border-radius:9999px;gap:10px}.cos-nameplate.np-author[class*=cos-nameplate-]{padding:4px 16px 4px 4px}.cos-nameplate.np-row{gap:10px;min-height:44px;padding:6px 12px 6px 8px;display:flex}.cos-nameplate-slate{--np:#8d96a8}.cos-nameplate-slate:after{background:linear-gradient(105deg,#0000 35%,#ffffff38 45%,#0000 52%) -60% 0/220% 100% no-repeat,repeating-linear-gradient(115deg,#ffffff12 0 2px,#0000 2px 9px),linear-gradient(90deg,#2b2f38,#474e5c);animation:3.6s ease-in-out infinite cos-np-sweep}.cos-nameplate-sunset{--np:#ff7a30}.cos-nameplate-sunset:after{background:radial-gradient(circle at 72% 78%,#ffe0a3 0 10%,#ffb05ce6 14%,#0000 34%) 0 0/100% 100%,linear-gradient(#0000 62%,#46103cbf 62% 70%,#0000 70% 78%,#46103c99 78%) 0 0/100% 100%,linear-gradient(#ff4f8c,#ff7a30 55%,#ffb25c) 0 0/100% 100%;animation:5s ease-in-out infinite alternate cos-np-sun}.cos-nameplate-ocean{--np:#2a7bff}.cos-nameplate-ocean:after{background:radial-gradient(16px 8px at 50% 0,#aae6ff52 55%,#0000 60%) 0 58%/32px 14px repeat-x,radial-gradient(16px 8px at 50% 0,#78c8ff3d 55%,#0000 60%) 16px 86%/32px 14px repeat-x,linear-gradient(#0d2a6b,#1660d8 55%,#1eb9aa);animation:2.8s linear infinite cos-np-waves}.cos-nameplate-shimmer{--np:#b7a8ff}.cos-nameplate-shimmer:after{background:radial-gradient(1.5px 1.5px at 20% 30%,#fff,#0000),radial-gradient(1px 1px at 46% 72%,#fff,#0000),radial-gradient(2px 2px at 64% 26%,#fff,#0000),radial-gradient(1px 1px at 82% 60%,#fff,#0000),radial-gradient(1.5px 1.5px at 92% 22%,#fff,#0000),linear-gradient(100deg,#0000 30%,#ffffff59 45%,#0000 60%) -150% 0/220% 100% no-repeat,linear-gradient(90deg,#2b2450,#5b4bb8);animation:3.2s ease-in-out infinite cos-np-sweep}.cos-nameplate-spectrum{--np:#c46bff}.cos-nameplate-spectrum:after{filter:saturate(.9);background:linear-gradient(90deg,#ff3264,#ffa01e,#32c850,#28b4dc,#6446ff,#b428f0,#ff3264) 0 0/300% 100%;animation:6s linear infinite cos-flow}@keyframes cos-np-sweep{to{background-position:260% 0,0 0,0 0}}.cos-nameplate-shimmer:after{animation-name:cos-np-sparkle}@keyframes cos-np-sparkle{50%{opacity:.85}to{background-position:0 0,0 0,0 0,0 0,0 0,260% 0,0 0}}@keyframes cos-np-sun{to{background-position:0 -4px,0 0,0 0}}@keyframes cos-np-waves{to{background-position:32px 58%,-16px 86%,0 0}}@keyframes cos-flow{to{background-position:300% 0}}.cos-badge{vertical-align:middle;align-items:center;gap:6px;display:inline-flex}.cos-badge-glyph{background:color-mix(in srgb, var(--badge) 22%, transparent);color:var(--badge);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--badge) 45%, transparent);border-radius:6px;place-items:center;font-weight:600;line-height:1;display:grid}.cos-badge-sm .cos-badge-glyph{width:18px;height:18px;font-size:10px}.cos-badge-md .cos-badge-glyph{border-radius:9px;width:32px;height:32px;font-size:15px}.cos-badge-name{color:var(--ink-2);font-size:13px}.cos-level{width:var(--size);height:var(--size);box-shadow:inset 0 0 0 2px var(--tone);color:var(--ink);font-size:calc(var(--size) * .42);font-variant-numeric:tabular-nums;border-radius:999px;place-items:center;line-height:1;display:inline-grid}.cos-tag{height:20px;color:var(--ink-2);letter-spacing:.02em;vertical-align:middle;background:#ffffff14;border-radius:6px;align-items:center;gap:4px;padding:0 6px;font-size:11px;font-weight:600;display:inline-flex}.cos-tag-dot{background:var(--chroma-point);border-radius:2px;width:6px;height:6px}@media (prefers-reduced-motion:reduce){.cos-frame,.cos-avatar,.cos-nameplate:before,.cos-nameplate:after{animation:none!important}}.nav-avatar{transition:transform var(--duration-hover) var(--ease-out)}.nav-avatar:focus-visible{outline:2px solid var(--focus);outline-offset:2px}@media (hover:hover) and (pointer:fine){.nav-avatar:hover{transform:scale(1.06)}}.nav-avatar:active{transform:scale(.96)}.live-new{background:var(--solid);height:30px;color:var(--solid-ink);cursor:pointer;animation:live-in var(--duration-md) var(--ease-out);border-radius:999px;align-items:center;gap:6px;padding:0 14px;font-size:13px;font-weight:600;display:inline-flex}@keyframes live-in{0%{opacity:0;transform:translateY(-6px)}}@media (prefers-reduced-motion:reduce){.live-new{animation:none}}.profile-tab{height:44px;color:var(--muted);transition:color var(--duration-hover) var(--ease-out);flex-shrink:0;align-items:center;padding:0 14px;font-size:14.5px;font-weight:500;display:inline-flex;position:relative}.profile-tab:hover,.profile-tab[aria-current=page]{color:var(--ink)}.profile-tab[aria-current=page]:after{content:"";background:var(--ink);border-radius:2px;height:2px;position:absolute;inset:auto 14px -1px}.profile-tab:focus-visible{outline:2px solid var(--focus);outline-offset:-2px;border-radius:8px}.ach-medal{background:radial-gradient(circle at 35% 30%,#ffffff80,#0000 45%),conic-gradient(from 200deg,#f8e7a2,#c99a2e,#fff1b8,#a87918,#f8e7a2);border-radius:8px;flex:none;width:26px;height:26px;box-shadow:inset 0 0 0 1px #00000040}