/* UltFans shared header nav (wave7). One chip set on every page. */
header.bar .bar-meta.ufnav{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;min-width:0}
header.bar .bar-meta.ufnav>.chip{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:5px;height:28px;padding:0 11px;margin:0;border:1px solid rgba(76,219,255,.45);border-radius:999px;background:transparent;color:#fff;font-family:inherit;font-size:10px;font-weight:500;line-height:1;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;text-decoration:none;flex:none;vertical-align:middle;transition:border-color .15s,background .15s}
header.bar .bar-meta.ufnav>a.chip:hover,header.bar .bar-meta.ufnav>a.chip:focus-visible{border-color:#4cdbff;background:rgba(76,219,255,.08);outline:none}
header.bar .bar-meta.ufnav>a.chip[aria-current="page"]{border-color:#ff2d95}
header.bar .bar-meta.ufnav>span.chip{border-color:rgba(247,242,234,.16);color:rgba(247,242,234,.55)}
header.bar .bar-meta.ufnav .uf-lk{display:block;width:9px;height:10px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 10'%3E%3Cpath d='M2 4V3a2.5 2.5 0 0 1 5 0v1h.5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-5a.5.5 0 0 1 .5-.5zm1 0h3V3a1.5 1.5 0 0 0-3 0z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 10'%3E%3Cpath d='M2 4V3a2.5 2.5 0 0 1 5 0v1h.5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-5a.5.5 0 0 1 .5-.5zm1 0h3V3a1.5 1.5 0 0 0-3 0z'/%3E%3C/svg%3E") center/contain no-repeat}
@media (max-width:900px){
  header.bar{gap:8px}
  header.bar .mark{flex:none}
  header.bar .bar-meta.ufnav{flex:1;justify-content:flex-start;gap:5px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x proximity;padding-right:12px;margin-left:auto}
  header.bar .bar-meta.ufnav::-webkit-scrollbar{display:none}
  header.bar .bar-meta.ufnav>.chip{height:24px;padding:0 8px;font-size:8.5px;letter-spacing:.04em;gap:4px;scroll-snap-align:start}
  header.bar .bar-meta.ufnav .uf-lk{width:8px;height:9px}
  header.bar .bar-meta.ufnav.can-r{-webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 36px),transparent 100%);mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 36px),transparent 100%)}
  header.bar .bar-meta.ufnav.can-l{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 28px,#000 100%);mask-image:linear-gradient(to right,transparent 0,#000 28px,#000 100%)}
  header.bar .bar-meta.ufnav.can-l.can-r{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 28px,#000 calc(100% - 36px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 28px,#000 calc(100% - 36px),transparent 100%)}
}

/* one shared lock icon, site-wide (same glyph as the nav chips); size follows the text: font-size on the parent */
.uf-lock{display:inline-block;width:.8em;height:.9em;vertical-align:-.08em;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 10'%3E%3Cpath d='M2 4V3a2.5 2.5 0 0 1 5 0v1h.5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-5a.5.5 0 0 1 .5-.5zm1 0h3V3a1.5 1.5 0 0 0-3 0z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 10'%3E%3Cpath d='M2 4V3a2.5 2.5 0 0 1 5 0v1h.5a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-5a.5.5 0 0 1 .5-.5zm1 0h3V3a1.5 1.5 0 0 0-3 0z'/%3E%3C/svg%3E") center/contain no-repeat}

/* v9: every nav chip uses the brand gradient outline (same as the selected category chip on /premium);
   placeholders (span.chip) keep the shape, dimmed; current page = gradient tint + glow. Emojis come from data-em (uf-nav.js) */
header.bar .bar-meta.ufnav>.chip{border:1px solid transparent;background:linear-gradient(#111116,#111116) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;color:#f7f2ea;transition:box-shadow .2s,background .2s}
header.bar .bar-meta.ufnav>a.chip:hover,header.bar .bar-meta.ufnav>a.chip:focus-visible,header.bar .bar-meta.ufnav>button.chip:hover{border-color:transparent;background:linear-gradient(#18181f,#18181f) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;box-shadow:0 4px 18px -10px rgba(76,219,255,.7);outline:none}
header.bar .bar-meta.ufnav>a.chip:focus-visible{box-shadow:0 0 0 2px rgba(76,219,255,.55)}
header.bar .bar-meta.ufnav>a.chip[aria-current="page"]{border-color:transparent;background:linear-gradient(90deg,rgba(76,219,255,.22),rgba(185,162,255,.22),rgba(255,45,149,.22)) padding-box,linear-gradient(#111116,#111116) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;box-shadow:0 6px 22px -10px rgba(185,162,255,.75);font-weight:700}
header.bar .bar-meta.ufnav>span.chip{border-color:transparent;color:rgba(247,242,234,.55);opacity:.6}
header.bar .bar-meta.ufnav>.chip[data-em]::before{content:attr(data-em);font-size:1.25em;line-height:1;letter-spacing:0;text-transform:none}

/* shared tool chip (same look as the nav chips): gradient outline, emoji first, shared lock icon last */
.uf-chip{box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;flex:none;height:30px;padding:0 12px;border:1px solid transparent;border-radius:999px;background:linear-gradient(#111116,#111116) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;color:#f7f2ea;font:600 12px/1 var(--ui,Inter,system-ui,sans-serif);letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;transition:box-shadow .2s,background .2s}
.uf-chip:hover,.uf-chip:focus-visible{background:linear-gradient(#18181f,#18181f) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;box-shadow:0 4px 18px -10px rgba(76,219,255,.7);outline:none}
.uf-chip:focus-visible{box-shadow:0 0 0 2px rgba(76,219,255,.55)}
.uf-chip[aria-current="true"],.uf-chip[aria-current="page"]{background:linear-gradient(90deg,rgba(76,219,255,.22),rgba(185,162,255,.22),rgba(255,45,149,.22)) padding-box,linear-gradient(#111116,#111116) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;box-shadow:0 6px 22px -10px rgba(185,162,255,.75)}
.uf-chip .uf-lock{opacity:.85}
.uf-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 12px}
.uf-chips>b{font:600 10.5px/1 var(--ui,Inter,system-ui,sans-serif);letter-spacing:.14em;text-transform:uppercase;color:#b9a2ff;margin-right:4px}
@media (max-width:560px){.uf-chip{height:28px;padding:0 10px;font-size:11.5px;gap:5px}.uf-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px}.uf-chips::-webkit-scrollbar{display:none}}

/* v10: one button language site-wide (the /premium category-chip feel).
   chips/secondary: grey at rest -> brand gradient outline + glow on hover -> tinted gradient when selected.
   primary CTAs (Hold 500K, Connect wallet, Play): stay solid, same lift + glow on hover. */
:root{--uf-g:linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95);--uf-gt:linear-gradient(90deg,rgba(76,219,255,.2),rgba(185,162,255,.2),rgba(255,45,149,.2))}
html body .uf-chip,html body header.bar .bar-meta.ufnav>a.chip,html body .seg button,html body .tabs button,html body .demos button,html body .qp,html body .subnav a,html body .secnav a,html body .row button,html body .lbtabs button,html body .mute,html body .btn.ghost,html body .hbtn.ghost,html body .ctrls button{box-sizing:border-box;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#f7f2ea;cursor:pointer;text-decoration:none;transition:background .2s,border-color .2s,box-shadow .2s,color .2s,transform .2s}
html body .uf-chip,html body .seg button,html body .tabs button,html body .demos button,html body .subnav a,html body .secnav a,html body .row button,html body .lbtabs button,html body .mute{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 12px;margin:0;border-radius:999px;font-family:inherit;font-size:12px;font-weight:600;line-height:1;letter-spacing:0;white-space:nowrap}
html body .uf-chip:hover,html body header.bar .bar-meta.ufnav>a.chip:hover,html body .seg button:hover,html body .tabs button:hover,html body .demos button:hover,html body .qp:hover,html body .subnav a:hover,html body .secnav a:hover,html body .row button:hover,html body .lbtabs button:hover,html body .mute:hover,html body .btn.ghost:hover,html body .hbtn.ghost:hover,html body .ctrls button:hover,
html body .uf-chip:focus-visible,html body header.bar .bar-meta.ufnav>a.chip:focus-visible,html body .seg button:focus-visible,html body .tabs button:focus-visible,html body .qp:focus-visible,html body .btn.ghost:focus-visible{border-color:transparent;background:linear-gradient(#141419,#141419) padding-box,var(--uf-g) border-box;color:#fff;box-shadow:0 4px 18px -10px rgba(76,219,255,.75);outline:none}
html body .uf-chip[aria-current],html body header.bar .bar-meta.ufnav>a.chip[aria-current="page"],html body .seg button[aria-pressed="true"],html body .tabs button[aria-pressed="true"],html body .qp[aria-pressed="true"],html body .secnav a.on,html body .row button.on,html body .lbtabs button.on,html body .mute[aria-pressed="true"]{border-color:transparent;background:var(--uf-gt) padding-box,linear-gradient(#111116,#111116) padding-box,var(--uf-g) border-box;color:#fff;font-weight:700;box-shadow:0 6px 22px -10px rgba(185,162,255,.75)}
html body .seg button[aria-pressed="true"] span{color:#08080a;background:linear-gradient(90deg,#4cdbff,#b9a2ff)}
html body .seg button:disabled,html body .tabs button:disabled,html body .demos button:disabled,html body .qp:disabled{opacity:.45;cursor:not-allowed;background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.08);box-shadow:none}
html body header.bar .bar-meta.ufnav>span.chip{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}
html body .cta,html body .btn:not(.ghost),html body .hbtn:not(.ghost),html body .arcplay-go,html body .ufg-go,html body .ufg-wc,html body .dl{transition:transform .2s,box-shadow .2s,filter .2s,background .2s}
html body .cta:hover,html body .btn:not(.ghost):hover,html body .hbtn:not(.ghost):hover,html body .arcplay-go:hover,html body .ufg-go:hover,html body .ufg-wc:hover,html body .dl:hover,html body .cta:focus-visible,html body .btn:not(.ghost):focus-visible{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 8px 26px -10px rgba(76,219,255,.7),0 10px 30px -14px rgba(255,45,149,.65);outline:none}
html body .btn:disabled,html body .btn:disabled:hover{transform:none;box-shadow:none;filter:none}
@media (max-width:560px){html body .uf-chip,html body .seg button,html body .tabs button,html body .demos button,html body .subnav a,html body .secnav a,html body .row button,html body .lbtabs button,html body .mute{height:28px;padding:0 10px;font-size:11.5px}}
@media (prefers-reduced-motion:reduce){html body .cta:hover,html body .btn:hover,html body .hbtn:hover,html body .arcplay-go:hover{transform:none}}
html body .seg{gap:4px;border:0;max-width:100%}
html body .seg button{flex:none}
/* v11: other info popups share the ⓘ popover look */
html body .tip{box-sizing:border-box;max-width:min(420px,calc(100vw - 16px));padding:10px 14px 11px;border-radius:12px;border:1px solid rgba(76,219,255,.35);background:#0d0d11;color:#d8d2c9;font:400 12px/1.45 system-ui,-apple-system,sans-serif;box-shadow:0 12px 32px rgba(0,0,0,.6)}

/* v13: mobile layout guards. Chip/toggle groups stay one row of whole chips; tables scroll sideways inside their card. */
html body .pick{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
html body .pick>.qp,html body .pick>button{flex:none;width:auto;white-space:nowrap}
html body .plist .qp{white-space:normal}
html body .tw{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
html body .tw>table{min-width:100%}
html body .uf-chips,html body .bar-meta.ufnav{max-width:100%;min-width:0}
html body .tw th,html body .tw td:not(.l){white-space:nowrap}
@media (max-width:560px){html body .tw>table{width:max-content}html body .tw td.l{white-space:nowrap}html body .tw td .note,html body .tw td p{white-space:normal;min-width:180px}}
/* v14 chip rows: wrap on desktop/tablet, swipe row on phones */
@media (min-width:561px){html body .strip,html body .tabs,html body .secnav,html body .subnav,html body .seg,html body .uf-chips{flex-wrap:wrap;overflow:visible;row-gap:6px}}
@media (min-width:561px) and (pointer:fine){header.bar .bar-meta.ufnav,header.bar .bar-meta{flex-wrap:wrap;overflow:visible;row-gap:5px}}

/* v15: slim shared footer (site directory + quiet 🐞 Report a bug link) + bug modal */
.uf-foot{display:block;clear:both;margin:28px 0 0;border-top:1px solid rgba(247,242,234,.08);background:transparent;font-family:var(--ui,Inter,system-ui,sans-serif)}
.uf-foot-in{box-sizing:border-box;max-width:1180px;margin:0 auto;padding:14px 18px 22px;display:flex;align-items:center;gap:6px 16px;flex-wrap:wrap}
.uf-foot-mk{font:400 15px/1 Impact,"Arial Narrow",sans-serif;letter-spacing:.01em;text-decoration:none;background:linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95);-webkit-background-clip:text;background-clip:text;color:transparent}
.uf-foot ul{display:flex;flex-wrap:wrap;gap:2px 14px;margin:0;padding:0;list-style:none;flex:1;min-width:0}
.uf-foot li{margin:0;padding:0}
.uf-foot ul a{color:rgba(247,242,234,.55);font-size:12px;line-height:24px;text-decoration:none;transition:color .15s}
.uf-foot ul a:hover,.uf-foot ul a:focus-visible{color:#4cdbff;outline:none}
.uf-foot ul a[aria-current="page"]{color:#f7f2ea}
.uf-foot-bug{flex:none;margin:0;padding:0 2px;border:0;background:none;color:rgba(247,242,234,.45);font:12px/24px var(--ui,Inter,system-ui,sans-serif);cursor:pointer;transition:color .15s}
.uf-foot-bug:hover,.uf-foot-bug:focus-visible{color:#ff2d95;outline:none;text-decoration:underline;text-underline-offset:3px}
@media (max-width:560px){.uf-foot-in{padding:12px 16px calc(18px + env(safe-area-inset-bottom));gap:8px 12px}.uf-foot ul{flex-basis:100%;order:2;gap:0 14px}.uf-foot-bug{margin-left:auto}.uf-foot ul a,.uf-foot-bug{line-height:30px}}
html.ufb-on{overflow:hidden}
.ufb-wrap{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(3,3,5,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-family:var(--ui,Inter,system-ui,sans-serif)}
.ufb-wrap[hidden]{display:none}
.ufb{position:relative;box-sizing:border-box;width:100%;max-width:440px;max-height:calc(100dvh - 32px);overflow:auto;padding:20px 20px 18px;border:1px solid transparent;border-radius:20px;background:linear-gradient(#0c0c0f,#0c0c0f) padding-box,linear-gradient(135deg,rgba(76,219,255,.6),rgba(185,162,255,.35),rgba(255,45,149,.6)) border-box;color:#f7f2ea;box-shadow:0 30px 80px -30px rgba(255,45,149,.45),0 20px 60px -30px rgba(76,219,255,.45);font-size:14px;line-height:1.45;text-align:left}
.ufb h2{margin:0 26px 14px 0;font:400 24px/1.1 Impact,"Arial Narrow",sans-serif;letter-spacing:.01em;text-transform:none;color:#f7f2ea}
.ufb h2 span{background:linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95);-webkit-background-clip:text;background-clip:text;color:transparent}
.ufb-x{position:absolute;top:10px;right:10px;width:32px;height:32px;border:1px solid rgba(247,242,234,.14);border-radius:999px;background:rgba(255,255,255,.04);color:#f7f2ea;font-size:20px;line-height:1;cursor:pointer;padding:0}
.ufb-x:hover,.ufb-x:focus-visible{border-color:#ff2d95;outline:none}
.ufb label{display:block;margin:0 0 5px;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#b9a2ff}
.ufb label i{font-style:normal;color:#ff2d95}.ufb label em{font-style:normal;text-transform:none;letter-spacing:0;font-weight:400;color:#8f897f;margin-left:4px}
.ufb textarea,.ufb input:not([type=file]){box-sizing:border-box;display:block;width:100%;margin:0;padding:10px 12px;border:1px solid rgba(247,242,234,.16);border-radius:12px;background:#111116;color:#f7f2ea;font-size:16px;line-height:1.4;font-family:inherit;resize:vertical}
.ufb textarea{min-height:96px;max-height:40vh}
.ufb textarea:focus,.ufb input:focus{outline:none;border-color:#4cdbff;box-shadow:0 0 0 3px rgba(76,219,255,.15)}
.ufb ::placeholder{color:#6f6a63}
.ufb-n{display:flex;justify-content:flex-end;margin:3px 0 10px;font-size:11px;color:#8f897f;font-variant-numeric:tabular-nums}
.ufb .ufb-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}
.ufb-sh{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 0}
.ufb label.ufb-pick{display:inline-flex;align-items:center;height:30px;padding:0 12px;margin:0;border:1px solid rgba(247,242,234,.16);border-radius:999px;background:rgba(255,255,255,.04);color:#f7f2ea;font-size:12px;font-weight:600;letter-spacing:0;text-transform:none;cursor:pointer;transition:box-shadow .2s,background .2s}
.ufb label.ufb-pick:hover,.ufb label.ufb-pick:focus-within{border-color:transparent;background:linear-gradient(#18181f,#18181f) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;box-shadow:0 4px 18px -10px rgba(76,219,255,.7)}
.ufb-sn{font-size:11.5px;color:#8f897f}
.ufb-fine{margin:12px 0 0;font-size:11.5px;color:#8f897f}
.ufb-err{margin:10px 0 0;padding:8px 10px;border-radius:10px;background:rgba(255,45,149,.1);border:1px solid rgba(255,45,149,.35);color:#ff8ab8;font-size:13px}
.ufb-err[hidden],.ufb-ok[hidden],.ufb-f[hidden]{display:none}
.ufb-act{display:flex;justify-content:flex-end;margin-top:14px}
.ufb-go{border:0;border-radius:999px;padding:11px 22px;background:#ff2d95;color:#14040c;font-family:inherit;font-weight:700;font-size:14px;line-height:1;cursor:pointer;transition:transform .2s,box-shadow .2s,filter .2s}
.ufb-go:hover:not(:disabled),.ufb-go:focus-visible{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 8px 26px -10px rgba(76,219,255,.7),0 10px 30px -14px rgba(255,45,149,.65);outline:none}
.ufb-go:disabled{opacity:.6;cursor:wait}
.ufb-ok{text-align:center;padding:10px 0 4px}.ufb-ok h2{margin:6px 0 6px}.ufb-ok p{margin:0 0 16px;color:#d8d2c9}
/* v21 Bug or feedback toggle: fixed-height row, tip floats (no layout jump) */
.ufb-k{position:relative;display:flex;align-items:center;gap:6px;margin:0 0 14px;min-height:30px}
.ufb-k .uf-chip{cursor:pointer;font-family:inherit}
.ufb-i{width:22px;height:22px;padding:0;margin-left:2px;border:0;border-radius:999px;background:none;color:#8f897f;font-size:15px;line-height:22px;cursor:pointer}
.ufb-i:hover,.ufb-i:focus-visible,.ufb-i[aria-expanded=true]{color:#4cdbff;outline:none}
.ufb .ufb-tip{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:3;max-width:none}
.ufb .ufb-tip[hidden]{display:none}
.ufb-bug{font-size:42px;line-height:1;filter:drop-shadow(0 6px 18px rgba(255,45,149,.5))}
@media (max-width:560px){.ufb-wrap{align-items:flex-end;padding:0}.ufb{max-width:none;border-radius:20px 20px 0 0;max-height:92dvh;padding:18px 16px calc(16px + env(safe-area-inset-bottom))}.ufb h2{font-size:22px}.ufb-go{width:100%;padding:13px}.ufb-act{display:block}}

/* single site-wide disclaimer (uf-nav.js) */
.uf-disc{margin:10px auto 0;padding:0 16px 22px;max-width:760px;text-align:center;font-size:12px;line-height:1.5;color:var(--muted,#9a9aa3)}
/* v17 Sign in chip (outside the swipe scroller so it never scrolls away) */
header.bar .ufs{position:relative;flex:0 0 auto;margin-left:8px;display:flex;align-items:center}
header.bar .ufs .uf-chip{white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center;gap:5px;font:inherit}
.ufs-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:60;min-width:150px;background:#0e0e12;border:1px solid rgba(76,219,255,.35);border-radius:12px;padding:8px;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.ufs-a{font:12px ui-monospace,monospace;color:#9aa;padding:2px 6px 8px}
.ufs-out{width:100%;text-align:left;background:none;border:0;color:#ff2d95;font:inherit;font-size:13px;padding:6px;border-radius:8px;cursor:pointer}.ufs-out:hover{background:rgba(255,45,149,.1)}
.ufs-wrap{position:fixed;inset:0;z-index:9000;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;padding:16px}.ufs-wrap[hidden]{display:none}
.ufs-box{position:relative;width:100%;max-width:520px;max-height:92vh;overflow:auto;border-radius:16px}
.ufs-box .ufb-x{position:absolute;top:8px;right:10px;z-index:2;background:none;border:0;color:#fff;font-size:24px;cursor:pointer}
@media (max-width:560px){header.bar .ufs{margin-left:4px}header.bar .ufs .ufs-t{display:none}header.bar .ufs .uf-chip{padding-left:9px;padding-right:9px}}

/* v18: mobile nav › scroll hint, static footer fallback, game back chip, home X chip */
/* v21: › badge removed; end spacer so the last chip clears the edge fade */
header.bar .bar-meta.ufnav::after{content:"";flex:0 0 40px;height:1px}
footer.uf-dfoot{padding:18px 0 0;margin:0;background:none;border:0}
footer.uf-dfoot .uf-disc{padding-bottom:22px}
a.uf-chip.uf-back{text-decoration:none;margin:0 0 10px}
.hero .uf-x{margin:14px 0 0}
.uf-x .uf-chip{text-decoration:none}
/* v19 css: sign-in modal works on pages without the gate palette (home, pfp): define it here, both connect buttons identical bordered */
.ufs-wrap{--cyan:#4cdbff;--pink:#ff2d95;--cream:#f7f2ea;--muted:#a59fb0;--lav:#b9a2ff;--line:rgba(255,255,255,.1);--ui:Inter,system-ui,sans-serif}
.ufs-wrap .ufg button.ufg-go,.ufs-wrap .ufg button.ufg-wc{background:rgba(5,5,6,.72);color:#f7f2ea;border:1px solid rgba(76,219,255,.55);border-radius:12px;padding:12px 20px;font:600 14px Inter,system-ui,sans-serif;opacity:1;cursor:pointer;position:relative;z-index:3}
.ufs-wrap .ufg button.ufg-go:hover,.ufs-wrap .ufg button.ufg-wc:hover{border-color:#4cdbff;color:#4cdbff}

/* v20: Premium nav chip. Expensive gold, slow shine sweep (off for reduced motion), same chip size. Lit on /premium. */
html body header.bar .bar-meta.ufnav>a.chip.uf-prem{position:relative;overflow:hidden;isolation:isolate;border:1px solid transparent;color:#2b1a00;font-weight:800;text-shadow:0 1px 0 rgba(255,244,200,.55);
  background:linear-gradient(135deg,#8a5a0b 0%,#e9b949 22%,#fff1b8 42%,#f2c94c 58%,#b07817 82%,#6e4508 100%) padding-box,linear-gradient(135deg,#fff6cf,#c8901d 40%,#fff1b0 60%,#8a5a0b) border-box;
  box-shadow:0 0 0 1px rgba(255,214,102,.18),0 6px 20px -8px rgba(242,185,60,.75),inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(90,55,0,.45)}
html body header.bar .bar-meta.ufnav>a.chip.uf-prem .uf-lk{background:#3a2400}
html body header.bar .bar-meta.ufnav>a.chip.uf-prem::after{content:"";position:absolute;top:-30%;bottom:-30%;left:-60%;width:45%;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,transparent 0,rgba(255,255,255,0) 20%,rgba(255,255,255,.85) 50%,rgba(255,255,255,0) 80%,transparent 100%);transform:skewX(-20deg);animation:ufPremShine 5.5s cubic-bezier(.4,0,.2,1) infinite}
@keyframes ufPremShine{0%,62%{left:-60%}100%{left:130%}}
html body header.bar .bar-meta.ufnav>a.chip.uf-prem:hover,html body header.bar .bar-meta.ufnav>a.chip.uf-prem:focus-visible{color:#1f1200;filter:brightness(1.08) saturate(1.1);box-shadow:0 0 0 1px rgba(255,214,102,.45),0 8px 26px -8px rgba(255,200,70,.95),inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(90,55,0,.45);outline:none}
html body header.bar .bar-meta.ufnav>a.chip.uf-prem:focus-visible{box-shadow:0 0 0 2px #fff1b8,0 0 0 4px rgba(200,144,29,.7)}
html body header.bar .bar-meta.ufnav>a.chip.uf-prem[aria-current="page"]{border-color:transparent;font-weight:900;
  background:linear-gradient(135deg,#a8700f 0%,#f5cf62 22%,#fff7d6 42%,#ffd866 58%,#c98d1f 82%,#7d500a 100%) padding-box,linear-gradient(135deg,#fffbe6,#ffd04a 50%,#fffbe6) border-box;
  box-shadow:0 0 0 2px rgba(255,216,102,.55),0 0 22px -2px rgba(255,200,70,.9),inset 0 1px 0 rgba(255,255,255,.7),inset 0 -1px 0 rgba(90,55,0,.4)}
@media (prefers-reduced-motion:reduce){html body header.bar .bar-meta.ufnav>a.chip.uf-prem::after{animation:none;left:auto;right:8%;width:30%;opacity:.35}}

/* v22: round UF logo before the wordmark (size reserved by width/height + CSS, so no jump) */
header.bar .mark{position:relative;display:inline-block;padding-left:1.85em;background-origin:content-box!important;line-height:1.6em}
header.bar .mark .uf-mk{position:absolute;left:0;top:50%;width:1.6em;height:1.6em;margin-top:-.8em;border-radius:50%;display:block;-webkit-text-fill-color:initial}
/* v22: ~44px touch targets on phones without growing the chips or the header */
@media (max-width:900px){
  header.bar .bar-meta.ufnav{padding-top:10px;padding-bottom:10px;margin-top:-10px;margin-bottom:-10px}
  html body header.bar .bar-meta.ufnav>.chip{position:relative}
  html body header.bar .bar-meta.ufnav>a.chip:not(.uf-prem)::after,html body header.bar .bar-meta.ufnav>button.chip::after{content:"";position:absolute;left:-2px;right:-2px;top:-10px;bottom:-10px}
  header.bar .mark::after{content:"";position:absolute;left:-6px;right:-6px;top:50%;height:44px;margin-top:-22px}
}
/* v23: round UF logo before the footer wordmark, same mark as the nav (size reserved, no jump) */
.uf-foot-mk{position:relative;display:inline-block;padding-left:1.85em;line-height:1.6em;background-origin:content-box}
.uf-foot-mk .uf-mk{position:absolute;left:0;top:50%;width:1.6em;height:1.6em;margin-top:-.8em;border-radius:50%;display:block;-webkit-text-fill-color:initial}
@media (max-width:900px){.uf-foot-mk::after{content:"";position:absolute;left:-6px;right:-6px;top:50%;height:44px;margin-top:-22px}}

/* site-wide card glow (matches /feed v2): blue → lavender → pink gradient border + soft static glow; no size/layout change */
html body :is(.c,.card,.panel,.side,.stage,#stage,.tw,.pos,.hm,.hl-c,.tgx,.tiles>.tile):not(:is(.c,.card,.panel,.side,.tw,.pos,.tgx) *):not(.wall *),html body .ca:is(.ca,#uf-ring-spec):has(>.ca-slot):where(:not(:is(.c,.card,.panel,.side,.tw,.pos,.tgx) *):not(.wall *)){position:relative;border-color:transparent!important;isolation:isolate;box-shadow:0 0 0 1px rgba(185,162,255,.06),0 10px 34px -12px rgba(185,162,255,.30),0 4px 22px -14px rgba(76,219,255,.28)}
html body :is(.c,.card,.panel,.side,.stage,#stage,.tw,.pos,.hm,.hl-c,.tgx,.tiles>.tile):not(:is(.c,.card,.panel,.side,.tw,.pos,.tgx) *):not(.wall *)::before,html body .ca:is(.ca,#uf-ring-spec):has(>.ca-slot):where(:not(:is(.c,.card,.panel,.side,.tw,.pos,.tgx) *):not(.wall *))::before{content:"";position:absolute;inset:0;padding:1.5px;border-radius:inherit;background:linear-gradient(120deg,#4cdbff,#b9a2ff 50%,#ff2d95);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:0;opacity:1}
html body #whc .uwx{box-shadow:none}html body #whc .uwx::before{display:none}
/* v38 2026-10-18: iPhone Safari drew a second square cornered ring inside cards. WebKit ignores the "not inside a card" test when :has sits in the same selector, so the .ca rule above is its own selector with that test wrapped in :where, and swipe tables inside cards never get a ring. */
html body :is(.c,.card,.panel) .tw::before{content:none!important}
/* info popups always on top (fix 2026-10-14): the glow cards are stacking contexts, so the card (and the child holding the open ⓘ) is lifted above its siblings while a popup is open */
html body :is(.tip,.ttp,.sbpop){z-index:9994!important;}
html body .tip{background:#0d0d11!important;opacity:1}
html body :is(.c,.card,.panel,.side,.stage,#stage,.tw,.pos,.hm,.hl-c,.tgx,.tiles>.tile):has([aria-expanded="true"]){z-index:9990}
html body :is(.c,.card,.panel,.side,.stage,#stage,.tw,.pos,.hm,.hl-c,.tgx,.tiles>.tile) >:is(:has([aria-expanded="true"]),[aria-expanded="true"]){z-index:9991!important}
html body .ca:is(.ca,#uf-ring-spec):has(>.ca-slot) >:is(:has([aria-expanded="true"]),[aria-expanded="true"]){z-index:9991!important}
html body .uf-pill:has(>[aria-expanded="true"]){z-index:9992!important}
html body .uf-pill .more{background:#0d0d11;opacity:1}
/* ⓘ popups: details.mi opens as a floating panel (same look as the freshness ⓘ), never inline (2026-10-14) */
html body details.mi[open]>summary::after{content:none!important}
html body details.mi>.ufi-p{position:fixed!important;z-index:9994!important;box-sizing:border-box!important;width:min(420px,calc(100vw - 16px))!important;max-width:none!important;max-height:min(70vh,calc(100dvh - 80px))!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;margin:0!important;padding:10px 14px 11px!important;border-radius:12px!important;border:1px solid rgba(76,219,255,.35)!important;background:#0d0d11!important;color:#d8d2c9!important;font:400 12px/1.45 system-ui,-apple-system,sans-serif!important;font-style:normal!important;white-space:normal!important;text-align:left!important;box-shadow:0 12px 32px rgba(0,0,0,.6)!important;scrollbar-width:thin}
html body details.mi>.ufi-p>*{margin:0 0 6px!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;color:inherit!important;font:inherit!important;max-width:none!important;position:static!important}
html body details.mi>.ufi-p>:last-child{margin-bottom:0!important}
html body details.mi>.ufi-p a{color:#4cdbff}
html body details.mi[open]{flex-basis:auto!important}
/* freshness pill always top-right of its card (page "card child" rules must not pull .abs pills into the flow) */
html body .uf-pill.abs{position:absolute!important;top:8px!important;right:8px!important;left:auto!important;bottom:auto!important;margin:0!important}
/* the sticky nav always stays above cards and every popup (raised cards are z 9990-9992, popups 9994-9995) */
html body header.bar{z-index:9996!important}
/* several "More info" in one card sit in one row (wraps on mobile) */
html body .ufi-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;margin-top:6px}
html body .ufi-row>details.mi{margin:0!important;flex:none}

/* v32: ⓘ hit area is only the label itself (never the whole row) */
html body details.mi>summary{display:inline-flex!important;width:auto!important;max-width:100%}
html body details.mi{width:fit-content;max-width:100%}
/* v33: tall ⓘ popups scroll; JS place() caps to room below nav */

/* v37 iOS scroll paint fix 2026-10-17: the iPhone home screen app painted the page black while scrolling, only fixed layers showed.
   Phones and tablets only, desktop is untouched. Same look, far cheaper for WebKit to paint. */
/* 0. Premium chip shine moves with transform instead of left: same path and timing, but no page layout on every frame on every page */
@media (prefers-reduced-motion:no-preference){html body header.bar .bar-meta.ufnav>a.chip.uf-prem::after{animation-name:ufPremShine2}}
@keyframes ufPremShine2{0%,62%{transform:translateX(0) skewX(-20deg)}100%{transform:translateX(422.22%) skewX(-20deg)}}
@media (hover:none) and (pointer:coarse){
/* 1. card glow border without a CSS mask: the ring is the pseudo's own 1.5px border filled by the gradient via background-clip:border-area
   (Safari 18.2+). Same place, width, corners and gradient as before. Older browsers keep the mask version above. */
@supports (background-clip:border-area){
html body :is(.c,.card,.panel,.side,.stage,#stage,.tw,.pos,.hm,.hl-c,.tgx,.tiles>.tile):not(:is(.c,.card,.panel,.side,.tw,.pos,.tgx) *):not(.wall *)::before,html body .ca:is(.ca,#uf-ring-spec):has(>.ca-slot):where(:not(:is(.c,.card,.panel,.side,.tw,.pos,.tgx) *):not(.wall *))::before,html body .wall .card::before{-webkit-mask:none;mask:none;padding:0;border:1.5px solid transparent;background:linear-gradient(120deg,#4cdbff,#b9a2ff 50%,#ff2d95);background-origin:border-box;background-clip:border-area}
}
/* 2. no backdrop blur on phones: blur over a scrolling page is a known WebKit cause of the whole scroller going blank. Solid tint instead. */
html body *,html body *::before,html body *::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
/* the homepage keeps its see-through header over the hero art */
html body:not(:has(>.grain)) header.bar{background:linear-gradient(rgba(5,5,6,.98),rgba(5,5,6,.94))!important}
/* 3. decorative animations rest while a finger or momentum scroll is moving the page (uf-nav.js sets the class), so WebKit spends that time painting new tiles */
/* v44: only repainting endless loops rest, uf-nav.js tags them uf-h, uf-hb or uf-ha. Reveals and transform or opacity loops keep running while you scroll. Old pause-all stays as the fallback */
html.uf-scr:not(.uf-scr2) *,html.uf-scr:not(.uf-scr2) *::before,html.uf-scr:not(.uf-scr2) *::after{animation-play-state:paused!important}
html.uf-scr.uf-scr2 .uf-h,html.uf-scr.uf-scr2 .uf-hb::before,html.uf-scr.uf-scr2 .uf-ha::after{animation-play-state:paused!important}
}

/* batch1020: sign-in sheet close. 44px, clearly visible and above the gate content, which sits at z-index 2 */
.ufs-box .ufb-x{top:10px;right:10px;z-index:30;width:44px;height:44px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid rgba(247,242,234,.4);border-radius:999px;background:rgba(5,5,6,.9);color:#f7f2ea;font-size:26px;line-height:1;cursor:pointer}
.ufs-box .ufb-x:hover,.ufs-box .ufb-x:focus-visible{border-color:#ff2d95;color:#fff;outline:none;box-shadow:0 0 0 2px rgba(255,45,149,.35)}
.ufs-wrap{cursor:pointer}.ufs-box{cursor:auto}
/* batch1020b: the X logo in nav chips draws at 14px. The inline 1em style made it 10px, where it read as a plain letter x */
header.bar a.chip[data-uf="x"] .uf-xi{width:14px!important;height:14px!important;vertical-align:-3px!important}
/* share buttons that are flex boxes drop the space after the logo, so give it a margin */
a.hbtn>.uf-xi,a.btn>.uf-xi,button.hbtn>.uf-xi{margin-right:.45em}
.uf-xi{width:1em;height:1em;fill:currentColor;flex:none}

/* freebeta: one switch, html.uf-beta, set by uf-nav.js from /site/config freeBeta. Paywall copy stays in the page for when it goes off */
html:not(.uf-beta) [data-beta-show]{display:none!important}
html.uf-beta [data-beta-hide]{display:none!important}
html.uf-beta header.bar .uf-lk{display:none}
.uf-beta-tag{display:inline-flex;align-items:center;box-sizing:border-box;height:20px;padding:0 8px;border:1px solid transparent;border-radius:999px;background:linear-gradient(#0b0b10,#0b0b10) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;color:#f7f2ea;font:700 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;vertical-align:middle;flex:none}
header.bar .uf-bt-nav{height:16px;padding:0 6px;font-size:8px;margin-left:6px}
@media (max-width:899px){header.bar .uf-bt-nav{display:none}}

/* navfix 2026-10-20 (v42): one header on every page, set here only. Pages no longer style the bar, the logo or the nav chips themselves.
   Desktop: one row, logo, nav chips, Sign in. Phones: two rows, logo and Sign in on top, then every nav chip in the desktop order as one swipe row.
   No backdrop blur, masks or will-change on phones. */
html body header.bar{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:10px;box-sizing:border-box;min-height:60px;margin:0;padding:16px 18px;border:0;background:linear-gradient(to bottom,rgba(5,5,6,.8),rgba(5,5,6,0))}
@media (min-width:561px) and (pointer:fine){html body header.bar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}
html body header.bar .mark{flex:none;font-family:var(--black,"Archivo Black"),"Archivo Black",Inter,system-ui,sans-serif;font-size:14px;font-weight:400;letter-spacing:-.04em;text-decoration:none;background:linear-gradient(90deg,#4cdbff 0%,#b9a2ff 50%,#ff2d95 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:ufMarkLive 2.6s ease-in-out infinite}
@keyframes ufMarkLive{0%,100%{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 6px rgba(255,45,149,.75)) drop-shadow(0 0 12px rgba(76,219,255,.55))}}
@media (prefers-reduced-motion:reduce){html body header.bar .mark{animation:none}}
html body header.bar .bar-meta.ufnav>.chip{white-space:nowrap;flex:none;text-transform:uppercase}
html body header.bar .bar-meta.ufnav>[data-uf="ca"]{text-transform:none}
/* no masks anywhere in the nav; the swipe hint is a plain gradient overlay instead */
html body header.bar .bar-meta.ufnav,html body header.bar .bar-meta.ufnav.can-l,html body header.bar .bar-meta.ufnav.can-r,html body header.bar .bar-meta.ufnav.can-l.can-r{-webkit-mask-image:none;mask-image:none}
/* one free beta notice: the Premium chip tag shows at every width, and steps aside whenever the site banner is up (uf-clear.js) */
@media (max-width:899px){html body header.bar .uf-bt-nav{display:inline-flex}}
@media (max-width:560px),(hover:none) and (pointer:coarse){
  html body header.bar{-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(rgba(5,5,6,.98),rgba(5,5,6,.94))}
  html body:has(>.grain) header.bar{background:linear-gradient(to bottom,rgba(5,5,6,.92),rgba(5,5,6,.55))}
}
@media (max-width:560px){
  html body header.bar{flex-wrap:wrap;row-gap:6px;column-gap:8px;padding:10px 12px 6px}
  html body header.bar .mark{order:0}
  html body header.bar .ufs{order:1;margin-left:auto}
  html body header.bar .ufs .ufs-t{display:inline}
  html body header.bar .ufs .uf-chip{padding-left:11px;padding-right:11px}
  html body header.bar .bar-meta.ufnav{order:2;flex:1 0 100%;width:100%;max-width:none;margin:-10px 0 -10px;padding-right:0}
}

/* gradfix 2026-10-20 (v43): brand gradient text for page titles and big section headers.
   Opt-in only: add class="uf-grad" to the heading. Wrap any emoji in span.uf-ic so it keeps its own colours.
   Not for 12px label h2s, kickers or stat labels. No glow, and nothing here uses blur, masks or will-change. */
.uf-grad{color:#b9a2ff}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  html body .uf-grad{width:fit-content;max-width:100%;padding-bottom:.1em;background:linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;text-shadow:none;filter:none}
  html body .uf-grad :not(.uf-ic){background:none;-webkit-text-fill-color:inherit;text-shadow:none}
  html body .uf-grad .uf-ic{color:#fff;-webkit-text-fill-color:#fff;background:none}
}
/* visitor-fixpack: on phones CA and Buy $FANS stay pinned at the left of the swipe row on every page, the other chips scroll under them. Solid colors only, no blur or masks */
@media (max-width:560px){
html body header.bar .bar-meta.ufnav>[data-uf="ca"]{position:sticky;left:0;z-index:3;background-color:#0b0b0f;box-shadow:-14px 0 0 #050506}
html body header.bar .bar-meta.ufnav>.uf-buy{position:sticky;left:var(--ufca-w,0px);z-index:3;box-shadow:calc(-1 * var(--ufgap,6px)) 0 0 #050506,var(--ufgap,6px) 0 0 #050506}
}
/* navchips: phones put small CA and BUY chips in the header row beside Sign in; the chip row below is page links only and scrolls as one. Desktop unchanged. */
header.bar .ufq{display:none}
@media (max-width:560px){
  html body header.bar .bar-meta.ufnav>[data-uf="ca"],html body header.bar .bar-meta.ufnav>.uf-buy,html body header.bar .bar-meta.ufnav>[data-uf="x"]{display:none!important}
  html body header.bar .ufq{order:1;margin-left:auto;display:flex;align-items:center;gap:6px;flex:none}
  html body header.bar .ufq[hidden]{display:none}
  html body header.bar .ufq~.ufs{margin-left:0}
  html body header.bar .ufq .ufq-c{position:relative;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:4px;height:28px;margin:0;padding:0 9px;border-radius:999px;font:700 12px/1 Inter,system-ui,sans-serif;letter-spacing:.04em;white-space:nowrap;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  html body header.bar .ufq .ufq-c::after{content:"";position:absolute;left:-3px;right:-3px;top:-8px;bottom:-8px}
  html body header.bar .ufq .ufq-ca{min-width:50px;border:1px solid transparent;background:linear-gradient(#111116,#111116) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;color:#f7f2ea}
  html body header.bar .ufq .ufq-ca.on{color:#4cdbff;min-width:72px}
  html body header.bar .ufq .ufq-i{width:13px;height:13px;flex:none}
  html body header.bar .ufq .ufq-ca.on .ufq-i{display:none}
  html body header.bar .ufq .ufq-x{width:28px;padding:0;border:1px solid transparent;background:linear-gradient(#111116,#111116) padding-box,linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95) border-box;color:#f7f2ea}
  html body header.bar .ufq .ufq-x svg{width:13px;height:13px;flex:none}
  html body header.bar .ufq .ufq-buy{border:1px solid transparent;background:linear-gradient(90deg,#4cdbff,#b9a2ff,#ff2d95);color:#050506}
  html body header.bar .ufq .ufq-c:focus-visible{outline:2px solid #4cdbff;outline-offset:2px}
  html body header.bar .ufq .ufq-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  html body header.bar .ufq~.ufs .uf-chip{height:28px;padding-left:10px;padding-right:10px;font-size:12px}
}
@media (max-width:380px){
  html body header.bar .ufq~.ufs .ufs-me .ufs-t{display:none}
  html body header.bar .ufq{gap:5px}
}
@media (max-width:340px){html body header.bar .ufq~.ufs .ufs-in .ufs-t{display:none}}
/* navcenter-1029 */
/* desktop header: the chip row is centered on the page. Two flexible spacers sit either side of the chips; the left one starts --ufnav-k wider to make up for Search + Sign in being wider than the logo, and gives that width up first when room runs short, so the row slides left instead of hitting Search. Wrapped rows center too. Chip sizes unchanged */
@media (min-width:901px){
 html body header.bar{justify-content:flex-start}
 html body header.bar>*{order:4}
 html body header.bar>.mark{order:0}
 html body header.bar>.bar-meta.ufnav{order:2;justify-content:center;flex-shrink:.001}
 html body header.bar .bar-meta.ufnav::after{content:none}
 html body header.bar::before,html body header.bar::after{content:"";order:1;flex:1 1 0;min-width:0;height:1px}
 html body header.bar::before{flex:1 1000 var(--ufnav-k,180px)}
 html body header.bar::after{order:3}
}
/* gradient-filled chips: paint the gradient under the 1px transparent border too, so the rounded ends are solid. The inline background shorthand left origin at padding-box, which tiled a sliver of the opposite end color into the border ring */
html body a.uf-buy,html body header.bar .ufq .ufq-buy{background-origin:border-box!important;background-clip:border-box!important}
/* footer directory centered: logo, links and Bug or feedback flow as one centered row, wrapping centered on narrow widths */
.uf-foot-in{justify-content:center;text-align:center;column-gap:14px}
.uf-foot ul{display:contents}
.uf-foot-bug{margin:0}
@media (max-width:560px){.uf-foot-in{column-gap:14px}.uf-foot-bug{margin:0}}
/* gradedge-1029: gradient-filled buttons and selected chips paint their gradient under the 1px transparent border too, so the rounded ends are solid. Only background-origin changes, so layered padding-box/border-box outline styles and all sizes stay as they are */
html body a.demo-buy,html body .lsx-chips button,html body .tgx .tgx-go,html body a.pg-buy,html body .uff-r.on,html body .acm{background-origin:border-box!important}
/* gradedge-1029: nav CA chip is dark at rest like the other nav chips, and lights up the same way on hover or keyboard focus */
html body header.bar .bar-meta.ufnav>button.chip[data-uf="ca"]{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#f7f2ea;transition:background .2s,border-color .2s,box-shadow .2s,color .2s}
html body header.bar .bar-meta.ufnav>button.chip[data-uf="ca"]:hover,html body header.bar .bar-meta.ufnav>button.chip[data-uf="ca"]:focus-visible{border-color:transparent;background:linear-gradient(#141419,#141419) padding-box,var(--uf-g) border-box;color:#fff;box-shadow:0 4px 18px -10px rgba(76,219,255,.75);outline:none}
/* gradedge-1029: /curves/ buttons light up on hover like the rest of the site. Outline chips go grey to gradient outline + glow; gradient buttons get the lift + glow */
html body button.chip.lsx-cp{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
html body .qbtn,html body .qch,html body .lsx-chips button,html body button.chip.lsx-cp,html body .qbuy,html body a.demo-buy{transition:background .2s,border-color .2s,box-shadow .2s,color .2s,transform .2s,filter .2s}
html body .qbtn:hover,html body .qbtn:focus-visible,html body .qch:not([aria-pressed=true]):hover,html body .qch:not([aria-pressed=true]):focus-visible,html body .lsx-chips button:not([aria-pressed=true]):hover,html body .lsx-chips button:not([aria-pressed=true]):focus-visible,html body button.chip.lsx-cp:hover,html body button.chip.lsx-cp:focus-visible{border-color:transparent;background:linear-gradient(#141419,#141419) padding-box,var(--uf-g) border-box;color:#fff;box-shadow:0 4px 18px -10px rgba(76,219,255,.75);outline:none}
html body .qch[aria-pressed=true]:hover,html body .qch[aria-pressed=true]:focus-visible{box-shadow:0 6px 22px -10px rgba(185,162,255,.75);color:#fff;outline:none}
html body .qbuy:hover,html body .qbuy:focus-visible,html body .lsx-chips button[aria-pressed=true]:hover,html body .lsx-chips button[aria-pressed=true]:focus-visible,html body a.demo-buy:hover,html body a.demo-buy:focus-visible,html body .tgx .tgx-go:hover,html body .tgx .tgx-go:focus-visible,html body a.pg-buy:hover,html body a.pg-buy:focus-visible{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 8px 26px -10px rgba(76,219,255,.7),0 10px 30px -14px rgba(255,45,149,.65);outline:none}
@media (prefers-reduced-motion:reduce){html body .qbuy:hover,html body .lsx-chips button:hover,html body a.demo-buy:hover,html body .tgx .tgx-go:hover,html body a.pg-buy:hover{transform:none}}
/* hoverall-1029: every remaining button lights up on hover or keyboard focus with the site chip treatment. Rest looks, sizes and layout are unchanged */
html body .uf-pill button.i,html body #ufsc>summary,html body .plan-more>summary,html body a.arcplay-th,html body #grid button.tile,html body a.tile,html body a.hm{transition:background .2s,border-color .2s,box-shadow .2s,color .2s,filter .2s}
html body #ufsc>summary:hover,html body #ufsc>summary:focus-visible,html body .plan-more>summary:hover,html body .plan-more>summary:focus-visible{border-color:transparent;background:linear-gradient(#141419,#141419) padding-box,var(--uf-g) border-box;background-origin:border-box;color:#fff;box-shadow:0 4px 18px -10px rgba(76,219,255,.75);outline:none}
html body .uf-pill button.i:hover,html body .uf-pill button.i:focus-visible{color:#4cdbff;background:rgba(76,219,255,.1);box-shadow:0 0 0 1px rgba(76,219,255,.45),0 4px 18px -8px rgba(76,219,255,.75);outline:none}
html body .uf-pill button.i[aria-expanded=true]{color:#4cdbff}
html body :is(.seg,.tabs,.lbtabs,.row,.ctl,.cnts,.xctl) button:is([aria-pressed=true],.on):hover,html body :is(.seg,.tabs,.lbtabs,.row,.ctl,.cnts,.xctl) button:is([aria-pressed=true],.on):focus-visible,html body .uf-chip:is([aria-current=true],[aria-current=page],.on):hover,html body .uf-chip:is([aria-current=true],[aria-current=page],.on):focus-visible{color:#fff;box-shadow:0 6px 24px -8px rgba(185,162,255,.95),0 4px 18px -10px rgba(76,219,255,.8);outline:none}
html body a.tile:hover,html body a.tile:focus-visible,html body a.hm:hover,html body a.hm:focus-visible{box-shadow:0 0 0 1px rgba(185,162,255,.2),0 14px 40px -12px rgba(185,162,255,.6),0 6px 26px -10px rgba(76,219,255,.6)!important;outline:none}
html body a.arcplay-th:hover,html body a.arcplay-th:focus-visible{filter:brightness(1.06);box-shadow:0 0 0 1px rgba(185,162,255,.55),0 8px 26px -10px rgba(76,219,255,.7),0 10px 30px -14px rgba(255,45,149,.65);outline:none}
html body #grid button.tile:not(.on):hover,html body #grid button.tile:not(.on):focus-visible{border-color:#b9a2ff;box-shadow:0 0 0 1px rgba(185,162,255,.45),0 6px 20px -10px rgba(76,219,255,.7);outline:none}
/* navfix-1031: small laptops, 901 to 1439px, signed in or out, banner open or closed. The chip row stays on one tidy row: chips tighten first,
   then the CA chip shows just "CA", the Free beta pill and the Ctrl K hint step aside, then chip emojis and the Search word go.
   If a row still runs long it scrolls sideways with an edge fade instead of wrapping one chip onto a second row. Phones are untouched. */
@media (min-width:901px) and (max-width:1439px){
  html body header.bar{column-gap:8px;padding-left:16px;padding-right:16px}
  html body header.bar .bar-meta.ufnav{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;gap:6px;row-gap:0;padding-top:8px;padding-bottom:8px;margin-top:-8px;margin-bottom:-8px}
  html body header.bar .bar-meta.ufnav::-webkit-scrollbar{display:none}
  html body header.bar .bar-meta.ufnav>.chip{padding-left:9px;padding-right:9px;gap:4px}
  html body header.bar .bar-meta.ufnav.can-r{-webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 32px),transparent 100%);mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 32px),transparent 100%)}
  html body header.bar .bar-meta.ufnav.can-l{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 100%);mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 100%)}
  html body header.bar .bar-meta.ufnav.can-l.can-r{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 32px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 32px),transparent 100%)}
  html body header.bar .ufsx-btn{margin-left:0;flex:none}
  html body header.bar .ufs{margin-left:6px}
}
@media (min-width:901px) and (max-width:1359px){
  html body header.bar .bar-meta.ufnav .uf-ca-a{display:none}
  html body header.bar .uf-bt-nav{display:none}
  html body header.bar .ufsx-btn kbd{display:none}
}
@media (min-width:901px) and (max-width:1099px){
  html body header.bar .bar-meta.ufnav>.chip[data-em]::before{content:none}
  html body header.bar .ufsx-btn{width:32px;padding:0;justify-content:center}
  html body header.bar .ufsx-btn .t{display:none}
}
