/* ArtyJx palette v2 — charcoal + cyan (approved by Arty 2026-10-14). Visual identity only. */
:root{
  --bg:#0e1116;--bg2:#0b0d11;
  --card:#171b22;--card2:#1f2530;--border:#2c3442;
  --primary:#3ef0ff;--purple:#b45cff;--pink:#ff4fd8;--gold:#ffd76a;
  --text:#ffffff;--muted:#b8c2d1;
  --ok:#1fd18a;--warn:#ff9f1c;--danger:#ff2d55;
  --grad-primary:linear-gradient(90deg,#b45cff,#3ef0ff);
}
@font-face{font-family:"Cairo";src:url(/fonts/Cairo.ttf) format("truetype");font-weight:200 1000;font-display:swap}
html,body{background:var(--bg);color:var(--text);font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif}
button,input,select,textarea,.btn{font-family:inherit}
button:not(.sec):not(.gbtn):not(.dbtn):not(.xbtn):not(.tbtn):not(.ytbtn):not(.kkbtn):not(.twbtn):not([data-lang-switch] *),.btn:not(.sec){background:var(--grad-primary);color:#0b0d11}
/* Logo hover glow (header) — gradient glow following logo colours cyan→blue→purple/indigo */
#siteHdr .hl{position:relative;isolation:isolate;display:inline-flex;align-items:center;padding:8px 12px;margin:-8px -12px;border-radius:14px;outline:none}
#siteHdr .hl::before{content:"";position:absolute;inset:4px 2px;z-index:-1;border-radius:999px;background:linear-gradient(90deg,#3ef0ff,#3b82ff 45%,#7c4dff 70%,#b45cff);filter:blur(14px);opacity:0;transition:opacity .25s ease;pointer-events:none}
#siteHdr .hl:hover::before,#siteHdr .hl:focus-visible::before{opacity:.55}
#siteHdr .hl img{transition:filter .25s ease}
#siteHdr .hl:hover img,#siteHdr .hl:focus-visible img{filter:drop-shadow(0 2px 6px #000a) drop-shadow(-3px 0 6px rgba(62,240,255,.55)) drop-shadow(3px 0 8px rgba(124,77,255,.55))}
#siteHdr .hl:focus-visible{box-shadow:0 0 0 2px rgba(62,240,255,.5)}
@media(prefers-reduced-motion:reduce){#siteHdr .hl img{transition:none}}
/* Button hover glow — all buttons (Arty 2026-10-14). Brand buttons keep their colours; glow only. */
:where(button,.btn,.btnx,.mb,.go,.pill,.coinpill,.sx-btn,.sx-chip,.sx-pf,.acs-cta,.hs a.hn,input[type=submit],input[type=button],a[role=button]){
  --glow:62,240,255;
  transition:box-shadow .22s ease,transform .18s ease,filter .22s ease,background-color .22s ease,border-color .22s ease}
:where(.gbtn,.dbtn,.xbtn,.tbtn,.ytbtn,.kkbtn,.twbtn){--glow:255,255,255;transition:box-shadow .22s ease,transform .18s ease,filter .22s ease}
:where(.sec,.pill,.sx-chip){--glow:180,92,255}
:where(.coinpill){--glow:255,215,106}
:is(button,.btn,.btnx,.mb,.go,.pill,.coinpill,.sx-btn,.sx-chip,.sx-pf,.acs-cta,.hs a.hn,.gbtn,.dbtn,.xbtn,.tbtn,.ytbtn,.kkbtn,.twbtn,input[type=submit],input[type=button],a[role=button]):not(:disabled):not([aria-disabled=true]):not(.disabled):is(:hover,:focus-visible){
  box-shadow:0 0 0 1px rgba(var(--glow),.55),-7px 0 14px rgba(var(--glow),.5),7px 0 14px rgba(var(--glow2,var(--glow)),.5),0 0 26px rgba(var(--glow2,var(--glow)),.25);
  filter:brightness(1.08);transform:translateY(-1px)}
:is(button,.btn,.btnx,.mb,.go,.sx-btn,.acs-cta,.gbtn,.dbtn,.xbtn,.tbtn,.ytbtn,.kkbtn,.twbtn,input[type=submit]):not(:disabled):is(:hover,:focus-visible).sec{box-shadow:0 0 0 1px rgba(255,79,216,.45),0 0 12px rgba(180,92,255,.5),0 0 26px rgba(255,79,216,.25)}
:is(button,.btn,.btnx,.mb,.go,.pill,.sx-btn,.sx-chip,.sx-pf,.acs-cta,.gbtn,.dbtn,.xbtn,.tbtn,.ytbtn,.kkbtn,.twbtn):focus-visible{outline:2px solid rgba(var(--glow),.8);outline-offset:2px}
:is(button,.btn,.btnx,.mb,.go,.sx-btn,.acs-cta,.gbtn,.dbtn,.xbtn,.tbtn,.ytbtn,.kkbtn,.twbtn):not(:disabled):active{transform:translateY(0);filter:brightness(.97)}
button:disabled,.btn.disabled,[aria-disabled=true]{box-shadow:none;transform:none;filter:none}
@media(prefers-reduced-motion:reduce){:is(button,.btn,.btnx,.mb,.go,.pill,.coinpill,.sx-btn,.sx-chip,.sx-pf,.acs-cta,.hs a.hn,.gbtn,.dbtn,.xbtn,.tbtn,.ytbtn,.kkbtn,.twbtn){transition:none!important;transform:none!important}}

/* Per-element colour-matched glow (Arty 2026-10-14): --glow = left/first colour, --glow2 = right/second colour (gradients). */
:where(button:not(.sec):not(.gbtn):not(.dbtn):not(.xbtn):not(.tbtn):not(.ytbtn):not(.kkbtn):not(.twbtn):not(.sx-btn):not(.sx-pf):not(.gsx-btn):not(.pwx),.btn:not(.sec),input[type=submit]){--glow:180,92,255;--glow2:62,240,255}
:where(.sec){--glow:180,92,255;--glow2:255,79,216}
:where(.sx-pf[data-p=youtube]){--glow:255,45,85;--glow2:255,45,85}
:where(.sx-pf[data-p=kick]){--glow:31,209,138;--glow2:31,209,138}
:where(.sx-pf[data-p=twitch]){--glow:180,92,255;--glow2:180,92,255}
:where(.sx-pf[data-p=tiktok]){--glow:255,255,255;--glow2:255,255,255}
:where(#beStreamer,.go){--glow:255,79,216;--glow2:255,79,216}
:where(.coinpill){--glow2:255,215,106}