.break-mark{display:grid;grid-template-columns:repeat(2,10px);gap:3px}.break-mark i{width:10px;height:10px;background:#91c7dc;border:1px solid #17263a}.break-mark i:nth-child(2){background:#b8d957}.break-mark i:nth-child(3){background:#ee6557}.break-mark i:nth-child(4){background:#f9e2a7}
/* Homepage-style navigation for the social and player pages. */
.hub-header-frame{width:100%;max-width:1360px;margin:0 auto;padding:0 48px}
.hub-topbar{min-height:102px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;border-bottom:3px solid var(--ink,#17263a);color:var(--ink,#17263a);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:normal}
.hub-topbar .main-nav{display:flex;align-items:center;gap:4px;min-width:0}
.hub-topbar .main-nav a{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:16px 12px;color:var(--ink-soft,#526273);font-size:14px;font-weight:800;text-decoration:none;white-space:nowrap}
.hub-topbar .main-nav a:hover,.hub-topbar .main-nav a[aria-current="page"]{color:var(--ink,#17263a)}
.hub-topbar .main-nav a[aria-current="page"]::after{content:"";position:absolute;right:12px;bottom:0;left:12px;height:4px;background:var(--coral,#ee6557)}
.hub-topbar .brand{justify-self:center;min-width:0;max-width:100%}
.hub-topbar .brand>.br-brand__image{display:block;width:204px;height:auto;max-width:100%;object-fit:contain}
.hub-topbar .account{justify-self:end;display:flex;align-items:center;gap:12px;min-width:0}
.hub-topbar .login{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;color:var(--ink,#17263a);font-size:14px;font-weight:800;text-decoration:none;white-space:nowrap}
.hub-topbar .avatar{display:grid;place-items:center;width:44px;height:44px;flex:none;border:2px solid var(--ink,#17263a);background:var(--blue,#91c7dc);box-shadow:2px 2px 0 var(--ink,#17263a);color:var(--ink,#17263a);font:900 15px ui-monospace,monospace;text-decoration:none}
.hub-topbar a:focus-visible{outline:3px solid var(--coral,#ee6557);outline-offset:4px}
@media(max-width:1050px){.hub-header-frame{padding-right:28px;padding-left:28px}.hub-topbar{gap:12px}.hub-topbar .main-nav a{padding:15px 8px;font-size:13px}.hub-topbar .main-nav a[aria-current="page"]::after{right:8px;left:8px}}
@media(max-width:900px){.hub-topbar .brand>.br-brand__image{width:176px}}
@media(max-width:820px){.hub-topbar{min-height:90px;padding-top:12px;gap:10px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}.hub-topbar .main-nav{grid-column:1/-1;grid-row:2;justify-content:center}.hub-topbar .brand{grid-column:2;grid-row:1}.hub-topbar .account{grid-column:3;grid-row:1}}
@media(max-width:650px){.hub-topbar .brand>.br-brand__image{width:138px}}
@media(max-width:540px){.hub-header-frame{padding-right:18px;padding-left:18px}.hub-topbar{gap:7px 5px}.hub-topbar .main-nav{gap:22px}.hub-topbar .main-nav a{padding:13px 5px;font-size:12px}.hub-topbar .account{gap:7px}.hub-topbar .login{font-size:11px}}
@media(max-width:480px){.hub-topbar{grid-template-columns:minmax(0,1fr) auto}.hub-topbar .brand{grid-column:1;justify-self:start}.hub-topbar .account{grid-column:2}}
@media(forced-colors:active){.hub-topbar .main-nav a[aria-current="page"]::after{background:LinkText}}

/* Five primary destinations retain comfortable hit targets on narrow headers. */
@media(max-width:1100px){.topbar{padding-top:12px;gap:8px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}.topbar .main-nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:8px}.topbar .brand{grid-column:2;grid-row:1}.topbar .account{grid-column:3;grid-row:1}}
@media(max-width:540px){.topbar .main-nav{gap:6px}.topbar .main-nav a{padding:13px 4px;font-size:11px}}
@media(max-width:480px){.topbar{grid-template-columns:minmax(0,1fr) auto}.topbar .brand{grid-column:1;justify-self:start}.topbar .account{grid-column:2}}

@media(max-width:540px){.topbar .main-nav{gap:2px}.topbar .main-nav a{padding-left:3px;padding-right:3px}}
.topbar .main-nav a{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
