/* ==========================================================================
   Userbars (lib/userbars.php): the plate a player's name sits on.
   .ub is the bar; <i> is the art; ::before darkens behind the name; .ub__n is the name; ::after is the gloss
   (and the moving light on bars that have one). Sizes: default 320 x 36, .ub--sm for lists, .ub--xs for chat.
   Photo bars (.ub-p) set --img; pattern bars (.ub-c .ub-p--<pattern>) are drawn from --ua and --ub.
   ========================================================================== */
.ub { --w: 320px; --h: 36px; --fs: 10px; --line: rgba(255, 255, 255, .18);
  position: relative; display: inline-grid; place-items: center; flex: none; width: var(--w); max-width: 100%; height: var(--h); overflow: hidden; isolation: isolate;
  vertical-align: middle; text-decoration: none; background: #111; border: 1px solid #000; border-radius: 0; box-shadow: inset 0 0 0 1px var(--line), 0 1px 4px rgba(0, 0, 0, .55); }
.ub--sm { --w: 232px; --h: 28px; --fs: 8px; }
.ub--xs { --w: 150px; --h: 20px; --fs: 6.5px; }
.ub > i { position: absolute; inset: 0; z-index: 1; }
.ub::before { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.ub::after { content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, .15), transparent 42%, transparent 62%, rgba(0, 0, 0, .34)); }
.ub .ub__n { position: relative; z-index: 3; max-width: calc(100% - 10px); overflow: hidden; white-space: nowrap; font: 400 var(--fs)/1.3 "Press Start 2P", ui-monospace, monospace; letter-spacing: .06em; text-transform: uppercase; color: #fff; }
.ub .ub__n { font-family: "Press Start 2P", ui-monospace, monospace !important; font-size: var(--fs) !important; text-transform: uppercase !important; }
.ub .ub__t { margin-right: .5em; font: inherit; font-weight: 400; color: #f6dc9a; }
.ub .ub__n.nfx .ub__t { color: inherit; }
.ub:is(.ub-p--news, .ub-p--tape, .ub-p--goldleaf, .ub-p--holo, .ub-p--scan, .ub-p--neon) .ub__t { color: inherit; opacity: .8; }
.ub .ub__n:not(.nfx) { text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0 2px 0 #000, 0 0 6px rgba(0, 0, 0, .9); }
.ub .ub__n.nfx { font-family: "Press Start 2P", ui-monospace, monospace !important; padding: 2px 0; }
.ub.ub--long .ub__n { letter-spacing: 0; font-size: calc(var(--fs) * .84) !important; }
a.ub:hover { filter: brightness(1.12); }
a.ub:hover .ub__n { color: #fff; }

/* how it was earned: the edge */
.ub-t--bronze { --line: #b87333; }
.ub-t--silver { --line: #d5dbe3; }
.ub-t--gold { --line: #f6dc9a; }
.ub-t--legendary { --line: #ffe9a8; box-shadow: inset 0 0 0 1px var(--line), 0 0 9px rgba(255, 200, 90, .6); }
.ub-t--gem { --line: #d9c2ff; box-shadow: inset 0 0 0 1px var(--line), 0 0 9px rgba(170, 120, 255, .5); }

/* a light that crosses the bar now and then, and a slow pulse */
.ub-fx--sweep::after { background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, .55) 50%, transparent 58%) 130% 0 / 260% 100% no-repeat, linear-gradient(180deg, rgba(255, 255, 255, .15), transparent 42%, transparent 62%, rgba(0, 0, 0, .34)); animation: ub-sweep 5s ease-in-out infinite; }
@keyframes ub-sweep { 0%, 60% { background-position: 130% 0, 0 0; } 90%, 100% { background-position: -30% 0, 0 0; } }
.ub-fx--pulse > i { animation: ub-pulse 2.6s ease-in-out infinite; }
@keyframes ub-pulse { 50% { filter: brightness(1.35) saturate(1.2); } }

/* name fonts */
.ub.ub-f--marker .ub__n:not(.nfx) { font-family: "Permanent Marker", cursive !important; font-size: calc(var(--fs) * 1.7) !important; letter-spacing: .03em; transform: rotate(-2deg); text-shadow: 2px 2px 0 #000, 0 0 8px rgba(0, 0, 0, .8); }
.ub.ub-f--stencil .ub__n:not(.nfx) { font-family: "Black Ops One", Impact, sans-serif !important; font-size: calc(var(--fs) * 1.55) !important; letter-spacing: .08em; }
.ub.ub-f--deco .ub__n:not(.nfx) { font-family: "Limelight", serif !important; font-size: calc(var(--fs) * 1.55) !important; }
.ub.ub-f--type .ub__n:not(.nfx) { font-family: "Special Elite", "Courier New", monospace !important; font-size: calc(var(--fs) * 1.5) !important; letter-spacing: .04em; }
.ub.ub-f--rye .ub__n:not(.nfx) { font-family: "Rye", serif !important; font-size: calc(var(--fs) * 1.5) !important; letter-spacing: .04em; }
.ub.ub-f--goth .ub__n:not(.nfx) { font-family: "UnifrakturMaguntia", serif !important; font-size: calc(var(--fs) * 1.8) !important; text-transform: none !important; }

/* ---------------------------------------------------------------- photo bars */
.ub-p > i { background-position: center; background-size: cover; background-repeat: no-repeat; }
.ub-o--plate::before { background: radial-gradient(ellipse 44% 140% at 50% 50%, rgba(0, 0, 0, .8), rgba(0, 0, 0, .32) 72%, transparent); }
.ub-o--ends > i { background-position: -8% center, 108% center; background-size: 62% auto, 62% auto; background-color: var(--ua); }
.ub-o--ends::before { background: linear-gradient(90deg, transparent 0 16%, color-mix(in srgb, var(--ua) 94%, transparent) 32% 68%, transparent 84%); }
.ub-o--left::before { background: linear-gradient(90deg, transparent 0 22%, color-mix(in srgb, var(--ua) 90%, transparent) 46%, var(--ua) 100%); }
.ub-o--right::before { background: linear-gradient(270deg, transparent 0 22%, color-mix(in srgb, var(--ua) 90%, transparent) 46%, var(--ua) 100%); }

/* ---------------------------------------------------------------- pattern bars */
.ub-c::before { background: radial-gradient(ellipse 40% 130% at 50% 50%, rgba(0, 0, 0, .34), transparent 75%); }
.ub-p--steel > i { background: radial-gradient(circle at 9px 50%, rgba(255, 255, 255, .45) 0 1.6px, rgba(0, 0, 0, .5) 2px 2.8px, transparent 3px), radial-gradient(circle at calc(100% - 9px) 50%, rgba(255, 255, 255, .45) 0 1.6px, rgba(0, 0, 0, .5) 2px 2.8px, transparent 3px),
  repeating-linear-gradient(90deg, rgba(255, 255, 255, .06) 0 1px, transparent 1px 3px), linear-gradient(180deg, var(--ua), var(--ub)); }
.ub-p--brick > i { background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .35)), repeating-linear-gradient(0deg, transparent 0 34%, var(--ub) 34% 40%), repeating-linear-gradient(90deg, transparent 0 26px, var(--ub) 26px 28px), var(--ua); background-size: 100% 100%, 100% 12px, 28px 100%, auto; }
.ub-p--brick > i::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, var(--ua) 0 26px, var(--ub) 26px 28px) 14px 0; -webkit-mask: repeating-linear-gradient(0deg, #000 0 10px, transparent 10px 24px); mask: repeating-linear-gradient(0deg, #000 0 10px, transparent 10px 24px); }
.ub-p--carbon > i { background: repeating-linear-gradient(45deg, rgba(255, 255, 255, .07) 0 2px, transparent 2px 4px), repeating-linear-gradient(-45deg, rgba(0, 0, 0, .45) 0 2px, transparent 2px 4px), linear-gradient(180deg, var(--ua), var(--ub)); }
.ub-p--pinstripe > i { background: repeating-linear-gradient(90deg, transparent 0 9px, color-mix(in srgb, var(--ub) 55%, transparent) 9px 10px), linear-gradient(180deg, var(--ua), color-mix(in srgb, var(--ua) 60%, #000)); }
.ub-p--felt > i { background: radial-gradient(ellipse 80% 160% at 50% -20%, var(--ua), var(--ub)); }
.ub-p--felt > i::after { content: ""; position: absolute; inset: 4px; border: 1px solid rgba(246, 220, 154, .55); }
.ub-p--wood > i { background: repeating-linear-gradient(88deg, rgba(0, 0, 0, .2) 0 2px, transparent 2px 9px), repeating-linear-gradient(92deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 13px), linear-gradient(180deg, var(--ua), var(--ub)); }
.ub-p--leather > i { background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, .08), transparent 40%), repeating-radial-gradient(circle at 70% 60%, rgba(0, 0, 0, .12) 0 1px, transparent 1px 3px), var(--ua); }
.ub-p--leather > i::after { content: ""; position: absolute; inset: 3px; border: 1px dashed var(--ub); opacity: .85; }
.ub-p--stripes > i { background: repeating-linear-gradient(-45deg, var(--ua) 0 11px, var(--ub) 11px 22px); }
.ub-p--stripes::before, .ub-p--checker::before, .ub-p--bars::before, .ub-p--flag::before, .ub-p--sunburst::before { background: linear-gradient(90deg, transparent 0 14%, rgba(10, 9, 8, .9) 30% 70%, transparent 86%); }
.ub-p--camo > i { background: radial-gradient(ellipse 22px 9px at 12% 30%, var(--ub) 98%, transparent), radial-gradient(ellipse 30px 10px at 34% 80%, color-mix(in srgb, var(--ua) 55%, #000) 98%, transparent), radial-gradient(ellipse 26px 11px at 58% 22%, var(--ub) 98%, transparent),
  radial-gradient(ellipse 34px 9px at 80% 70%, color-mix(in srgb, var(--ua) 55%, #000) 98%, transparent), radial-gradient(ellipse 18px 8px at 94% 20%, var(--ub) 98%, transparent), radial-gradient(ellipse 20px 7px at 48% 55%, color-mix(in srgb, var(--ua) 70%, #d8c9a0) 98%, transparent), var(--ua); }
.ub-p--velvet > i { background: linear-gradient(180deg, rgba(0, 0, 0, .45), transparent 30%), repeating-linear-gradient(90deg, var(--ub) 0, var(--ua) 9px, var(--ub) 18px); }
.ub-p--velvet > i::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: repeating-linear-gradient(90deg, #f6dc9a 0 3px, #8a6220 3px 6px); }
.ub-p--news > i { background: linear-gradient(90deg, transparent 0 20%, var(--ua) 30% 70%, transparent 80%), repeating-linear-gradient(0deg, transparent 0 4px, rgba(0, 0, 0, .28) 4px 5px), var(--ua); }
.ub-p--news::before { background: linear-gradient(180deg, var(--ub) 0 2px, transparent 2px calc(100% - 2px), var(--ub) calc(100% - 2px)); }
.ub.ub-p--news .ub__n:not(.nfx) { color: var(--ub); text-shadow: none; }
.ub-p--dots > i { background: linear-gradient(90deg, transparent, var(--ub) 50%, transparent), radial-gradient(var(--ua) 1.4px, transparent 1.7px) 0 0 / 6px 6px, var(--ub); }
.ub-p--plate > i { background: repeating-linear-gradient(45deg, rgba(255, 255, 255, .16) 0 2px, transparent 2px 9px), repeating-linear-gradient(-45deg, rgba(0, 0, 0, .28) 0 2px, transparent 2px 9px), linear-gradient(180deg, var(--ua), var(--ub)); }
.ub-p--bars > i { background: repeating-linear-gradient(90deg, var(--ua) 0 4px, color-mix(in srgb, var(--ua) 70%, #fff) 4px 5px, var(--ua) 5px 7px, var(--ub) 7px 20px); }
.ub-p--checker > i { background: repeating-conic-gradient(var(--ua) 0 25%, var(--ub) 0 50%) 0 0 / 12px 12px; }
.ub-p--scan > i { background: radial-gradient(ellipse 60% 140% at 50% 50%, color-mix(in srgb, var(--ua) 22%, transparent), transparent 70%), repeating-linear-gradient(0deg, color-mix(in srgb, var(--ua) 18%, transparent) 0 1px, transparent 1px 3px), var(--ub); }
.ub-p--scan::before { background: none; }
.ub.ub-p--scan .ub__n:not(.nfx) { color: var(--ua); text-shadow: 0 0 5px var(--ua), 1px 1px 0 #000; }
.ub-p--sunburst > i { background: repeating-conic-gradient(from 0deg at 50% 130%, var(--ua) 0 7deg, var(--ub) 7deg 14deg); }
.ub-p--flag > i { background: linear-gradient(90deg, var(--ua) 0 9%, #f1f1f1 9% 18%, var(--ub) 18% 27%, #14110e 27% 73%, var(--ua) 73% 82%, #f1f1f1 82% 91%, var(--ub) 91%); }
.ub-p--tape > i { background: linear-gradient(90deg, transparent 0 16%, var(--ua) 24% 76%, transparent 84%), repeating-linear-gradient(-45deg, var(--ua) 0 11px, var(--ub) 11px 22px); }
.ub-p--tape::before { background: none; }
.ub.ub-p--tape .ub__n:not(.nfx) { color: var(--ub); text-shadow: none; }
.ub-p--guilloche > i { background: repeating-radial-gradient(circle at 12% 50%, transparent 0 3px, rgba(255, 255, 255, .1) 3px 4px), repeating-radial-gradient(circle at 88% 50%, transparent 0 3px, rgba(255, 255, 255, .1) 3px 4px), linear-gradient(180deg, var(--ua), var(--ub)); }
.ub-p--guilloche > i::after { content: ""; position: absolute; inset: 3px; border: 1px double rgba(233, 225, 205, .5); }
.ub-p--goldleaf > i { background: repeating-linear-gradient(115deg, rgba(255, 255, 255, .12) 0 2px, transparent 2px 7px), linear-gradient(135deg, var(--ub), var(--ua) 28%, #fff8e0 46%, var(--ua) 62%, var(--ub)); }
.ub-p--goldleaf::before { background: none; }
.ub.ub-p--goldleaf .ub__n:not(.nfx) { color: #2a1a05; text-shadow: 0 1px 0 rgba(255, 255, 255, .55); }
.ub-p--gem > i { background: repeating-linear-gradient(60deg, rgba(255, 255, 255, .16) 0 6px, transparent 6px 18px), repeating-linear-gradient(-60deg, rgba(0, 0, 0, .24) 0 6px, transparent 6px 18px), linear-gradient(135deg, var(--ua), var(--ub)); }
.ub-p--blood > i { background: radial-gradient(ellipse 5px 62% at 9% 0, var(--ua) 98%, transparent), radial-gradient(ellipse 4px 88% at 21% 0, var(--ua) 98%, transparent), radial-gradient(ellipse 6px 48% at 36% 0, var(--ua) 98%, transparent), radial-gradient(ellipse 4px 70% at 63% 0, var(--ua) 98%, transparent),
  radial-gradient(ellipse 5px 92% at 78% 0, var(--ua) 98%, transparent), radial-gradient(ellipse 5px 55% at 92% 0, var(--ua) 98%, transparent), linear-gradient(180deg, var(--ua) 0 18%, transparent 18%), var(--ub); }
/* the ones that move */
.ub-p--neon > i { background: linear-gradient(90deg, transparent 0 5%, var(--ua) 5% 5.7%, transparent 5.7% 94.3%, var(--ub) 94.3% 95%, transparent 95%), radial-gradient(ellipse 30% 170% at 5% 50%, color-mix(in srgb, var(--ua) 55%, transparent), transparent 70%), radial-gradient(ellipse 30% 170% at 95% 50%, color-mix(in srgb, var(--ub) 55%, transparent), transparent 70%),
  repeating-linear-gradient(0deg, rgba(255, 255, 255, .03) 0 1px, transparent 1px 3px), #07040f; }
.ub-p--neon::before { left: 9%; right: 9%; top: 14%; bottom: 14%; border: 1.5px solid color-mix(in srgb, var(--ua) 70%, #fff); border-radius: 2px; background: none; box-shadow: 0 0 6px var(--ua), 0 0 13px color-mix(in srgb, var(--ua) 70%, transparent), inset 0 0 8px color-mix(in srgb, var(--ua) 50%, transparent); animation: ub-flick 5s infinite; }
.ub.ub-p--neon .ub__n:not(.nfx) { color: #f2ffff; text-shadow: 0 0 4px var(--ub), 0 0 10px var(--ub), 0 0 17px color-mix(in srgb, var(--ub) 80%, transparent), 1px 1px 0 rgba(0, 0, 0, .7); }
@keyframes ub-flick { 0%, 6%, 9%, 62%, 64%, 100% { opacity: 1; } 7%, 8%, 63% { opacity: .35; } }
.ub-p--holo > i { background: linear-gradient(110deg, #7df9ff, #ff7de9, #fff27d, #7dffb0, #7d9bff, #7df9ff) 0 0 / 300% 100%; animation: ub-slide 7s linear infinite; }
.ub-p--holo > i::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(60deg, rgba(255, 255, 255, .22) 0 2px, transparent 2px 9px); mix-blend-mode: overlay; }
.ub-p--holo::before { background: none; }
.ub.ub-p--holo .ub__n:not(.nfx) { color: #1b1030; text-shadow: 0 1px 0 rgba(255, 255, 255, .7); }
@keyframes ub-slide { to { background-position: -300% 0; } }
.ub-p--aurora > i { background: linear-gradient(115deg, #05111c, var(--ua), #05111c, var(--ub), #2de2ff, #05111c, var(--ua)) 0 0 / 400% 100%; animation: ub-slide 14s linear infinite; }
.ub-p--fire > i { background: radial-gradient(ellipse 9px 22px at 10% 100%, #ffd36b 60%, transparent), radial-gradient(ellipse 12px 30px at 27% 100%, #ffb627 60%, transparent), radial-gradient(ellipse 9px 20px at 45% 100%, #ffd36b 60%, transparent), radial-gradient(ellipse 13px 32px at 64% 100%, #ffb627 60%, transparent),
  radial-gradient(ellipse 10px 24px at 83% 100%, #ffd36b 60%, transparent), radial-gradient(ellipse 9px 18px at 96% 100%, #ffb627 60%, transparent), linear-gradient(0deg, var(--ua), var(--ub) 65%, #120202); background-size: 200% 100%; filter: blur(.6px) contrast(1.2); animation: ub-fire 1.5s ease-in-out infinite alternate; }
@keyframes ub-fire { to { background-position: -14% 0, 9% 0, -11% 0, 12% 0, -8% 0, 10% 0, 0 0; filter: blur(.6px) contrast(1.2) brightness(1.18); } }

@media (prefers-reduced-motion: reduce) { .ub, .ub *, .ub::before, .ub::after { animation: none !important; } }

/* ---------------------------------------------------------------- where they sit
   One size per kind of place, so bars line up: lists use .ub--sm, forum posts .ub--xs, chat lines a slim quiet strip.
   The bar always comes first and the crew tag after it, so every bar in a list starts at the same spot. */
.ub + .gtag { margin-left: 6px; }
.cy-name { align-items: center; }
.cy-name .ub { margin-right: 2px; }
.pcard__bar { margin: 6px 0 0; }
.fp__name .ub { margin-bottom: 3px; }
.fp__name .ub + .gtag { display: block; width: fit-content; margin: 2px auto 4px; }
.pg-row__who > .ub, .hq-mem__who > .ub { display: grid; margin-bottom: 4px; }
.podium__spot, .ft-man { grid-template-columns: minmax(0, 1fr); }
.podium__name, .ft-man__name { width: 100%; }
.ft-man__name { overflow: visible !important; }
.ft-man__name .ub + .gtag { display: block; width: fit-content; margin: 6px auto 0; font-size: 13px; }
.kl-target .ub { margin-bottom: 3px; }
/* chat: thin, no glow, nothing moving, so the talk stays the main thing */
.chat__who .ub { --w: 124px; --h: 16px; --fs: 6px; vertical-align: -3px; box-shadow: inset 0 0 0 1px var(--line); }
.chat__who .ub .ub__n { letter-spacing: .03em; }
.chat__who .ub, .chat__who .ub > i, .chat__who .ub::before, .chat__who .ub::after { animation: none !important; }
@media (max-width: 720px) {
  .fp__name .ub + .gtag { margin-left: 0; }
  .board .ub { --w: 104px; --h: 22px; --fs: 6px; }
  .podium__name .ub { --fs: 6.5px; }
  .ft-man__name .ub { --fs: 7.5px; }
}
@media (max-width: 420px) { .ub--sm { --w: 200px; } }

/* ---------------------------------------------------------------- the 2026 look: plated
   The 2008 look keeps the classic bars above. In the 2026 look every bar is a nameplate: two cut corners, a metal trim in
   the tier's colour, a gloss and a shadow for depth, a moving shine on gold, legendary and Jeweller bars, and bold
   lettering in place of the pixel font. Brad picked this over two flatter attempts ("flat rectangles didn't help"). */
body:not(.theme-legacy) .ub { --f26: 19px; --c: 9px; --m1: #8d939c; --m2: #3d4147; --m3: #c9ced6; border: 0; box-shadow: none; overflow: visible; isolation: isolate;
  background: linear-gradient(135deg, var(--m3), var(--m1) 28%, var(--m2) 52%, var(--m1) 74%, var(--m3));
  clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c));
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .6)); }
body:not(.theme-legacy) .ub--sm { --f26: 15.5px; --c: 7px; }
body:not(.theme-legacy) .ub--xs { --f26: 12px; --c: 5px; }
body:not(.theme-legacy) .ub-t--bronze { --m1: #b87333; --m2: #5a3413; --m3: #f0b27a; }
body:not(.theme-legacy) .ub-t--silver { --m1: #c3cad3; --m2: #68707b; --m3: #ffffff; }
body:not(.theme-legacy) .ub-t--gold { --m1: #e0b44c; --m2: #7a5410; --m3: #fff0b8; }
body:not(.theme-legacy) .ub-t--legendary { --m1: #ffd766; --m2: #b06a00; --m3: #fffbe0; }
body:not(.theme-legacy) .ub-t--gem { --m1: #b48cff; --m2: #4a2a9a; --m3: #f0e4ff; }
body:not(.theme-legacy) .ub > i, body:not(.theme-legacy) .ub::before, body:not(.theme-legacy) .ub::after { inset: 2px; clip-path: polygon(calc(var(--c) - 1px) 0, 100% 0, 100% calc(100% - var(--c) + 1px), calc(100% - var(--c) + 1px) 100%, 0 100%, 0 calc(var(--c) - 1px)); }
body:not(.theme-legacy) .ub > i { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .7); }
body:not(.theme-legacy) .ub::after { background: linear-gradient(180deg, rgba(255, 255, 255, .26), rgba(255, 255, 255, .05) 46%, transparent 50%, rgba(0, 0, 0, .38)); }
body:not(.theme-legacy) .ub-fx--sweep::after, body:not(.theme-legacy) .ub-t--gold::after, body:not(.theme-legacy) .ub-t--legendary::after, body:not(.theme-legacy) .ub-t--gem::after { background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, .5) 50%, transparent 58%) 130% 0 / 260% 100% no-repeat, linear-gradient(180deg, rgba(255, 255, 255, .26), rgba(255, 255, 255, .05) 46%, transparent 50%, rgba(0, 0, 0, .38)); animation: ub-sweep 6s ease-in-out infinite; }
body:not(.theme-legacy) .ub .ub__n { font-family: "Big Shoulders Display", "Oswald", Impact, sans-serif !important; font-size: var(--f26) !important; font-weight: 800; line-height: 1; letter-spacing: .07em; max-width: calc(100% - 22px); }
body:not(.theme-legacy) .ub .ub__n:not(.nfx) { color: #fff; -webkit-text-stroke: .5px rgba(0, 0, 0, .55); paint-order: stroke fill; text-shadow: 0 1px 0 #000, 0 2px 0 rgba(0, 0, 0, .55), 0 0 10px rgba(0, 0, 0, .8); }
body:not(.theme-legacy) .ub .ub__n.nfx { font-family: "Big Shoulders Display", "Oswald", Impact, sans-serif !important; }
body:not(.theme-legacy) .ub .ub__t { margin-right: .4em; font-size: .78em; letter-spacing: .08em; vertical-align: .08em; color: var(--m3); }
body:not(.theme-legacy) .ub.ub--long .ub__n { letter-spacing: .02em; font-size: calc(var(--f26) * .86) !important; }
body:not(.theme-legacy) .ub.ub-f--marker .ub__n:not(.nfx) { font-family: "Permanent Marker", cursive !important; font-size: calc(var(--f26) * .92) !important; font-weight: 400; -webkit-text-stroke: 0; }
body:not(.theme-legacy) .ub.ub-f--stencil .ub__n:not(.nfx) { font-family: "Black Ops One", Impact, sans-serif !important; font-size: calc(var(--f26) * .82) !important; font-weight: 400; }
body:not(.theme-legacy) .ub.ub-f--type .ub__n:not(.nfx) { font-family: "Special Elite", "Courier New", monospace !important; font-size: calc(var(--f26) * .8) !important; font-weight: 400; -webkit-text-stroke: 0; }
body:not(.theme-legacy) .ub.ub-f--rye .ub__n:not(.nfx) { font-family: "Rye", serif !important; font-size: calc(var(--f26) * .8) !important; font-weight: 400; }
body:not(.theme-legacy) .ub.ub-p--news .ub__n:not(.nfx), body:not(.theme-legacy) .ub.ub-p--tape .ub__n:not(.nfx) { color: var(--ub); text-shadow: none; -webkit-text-stroke: 0; }
body:not(.theme-legacy) .ub.ub-p--goldleaf .ub__n:not(.nfx) { color: #2a1a05; text-shadow: 0 1px 0 rgba(255, 255, 255, .5); -webkit-text-stroke: 0; }
body:not(.theme-legacy) .ub.ub-p--holo .ub__n:not(.nfx) { color: #1b1030; text-shadow: none; -webkit-text-stroke: 0; }
body:not(.theme-legacy) .ub.ub-p--scan .ub__n:not(.nfx) { color: var(--ua); text-shadow: 0 0 6px var(--ua), 0 1px 0 #000; }
body:not(.theme-legacy) .ub.ub-p--neon .ub__n:not(.nfx) { color: #f6ffff; text-shadow: 0 0 5px var(--ub), 0 0 12px var(--ub), 0 1px 0 rgba(0, 0, 0, .6); }
body:not(.theme-legacy) .ub-p--neon::before { inset: 14% 9%; clip-path: none; }
body:not(.theme-legacy) .chat__who .ub { --w: 132px; --h: 18px; --f26: 11.5px; --c: 5px; }
body:not(.theme-legacy) .ub:is(.ub-p--news, .ub-p--tape, .ub-p--goldleaf, .ub-p--holo, .ub-p--scan, .ub-p--neon) .ub__t { color: inherit; opacity: .8; }
body:not(.theme-legacy) a.ub:hover { filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .6)) brightness(1.12); }
@media (max-width: 720px) {
  body:not(.theme-legacy) .board .ub { --f26: 12px; --c: 5px; }
  body:not(.theme-legacy) .podium__name .ub, body:not(.theme-legacy) .ft-man__name .ub { --f26: 14px; }
}

/* New activity rows and the strip (lib/activity.php): the same thin bar as chat, every one the same width, nothing moving */
:is(.act, .actbar) .ub { --w: 124px; --h: 16px; --fs: 6px; box-shadow: inset 0 0 0 1px var(--line); }
:is(.act, .actbar) .ub .ub__n { letter-spacing: .03em; }
:is(.act, .actbar) .ub, :is(.act, .actbar) .ub > i, :is(.act, .actbar) .ub::before, :is(.act, .actbar) .ub::after { animation: none !important; }
body:not(.theme-legacy) :is(.act, .actbar) .ub { --w: 132px; --h: 18px; --f26: 11.5px; --c: 5px; filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .6)); }