/* REDX.BIO — styles */
.logo{display:block;margin:0 auto 6px;max-width:100%;height:auto;filter:drop-shadow(0 0 14px rgba(var(--rgb),.45))}
#site .logo{width:220px}
#brand .logo{width:150px;margin:0 0 4px}
:root{--bg:#050203;--fg:#f2d6d9;--mut:#a35a63;--red:#ff1a2e;--rgb:255,26,46;--dark:#5a0a13;--crgb:10,3,5;--surf:#0d0407;--drgb:110,10,22;--lt:255,179,186;--lbg:#fff4f5;--lfg:#2a0d11;--lmut:#8a4a52;--ldark:#e8b9bf}
*{box-sizing:border-box}[hidden]{display:none!important}
html,body{margin:0;min-height:100%}
body{background:var(--bg) center/cover fixed;color:var(--fg);font-family:"Courier New",Consolas,monospace}
canvas{position:fixed;inset:0;width:100%;height:100%;opacity:.5;z-index:0;pointer-events:none}
.wrap{position:relative;z-index:1;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.card{width:min(440px,100%);background:rgba(var(--crgb),.85);border:1px solid var(--red);box-shadow:0 0 30px rgba(var(--rgb),.35);padding:24px;text-align:center;transition:transform .12s ease-out}
.left{text-align:left;display:flex;flex-direction:column;gap:11px;margin:16px 0}
h1,h2{margin:0 0 6px;color:var(--red);text-shadow:0 0 14px rgba(var(--rgb),.8);letter-spacing:2px}
label{display:flex;flex-direction:column;gap:4px;color:var(--mut);font-size:13px}
input,textarea{font:inherit;background:var(--surf);border:1px solid var(--dark);color:var(--fg);padding:9px;width:100%}
input:focus,textarea:focus{outline:1px solid var(--red)}
input[type=color]{width:50px;height:32px;padding:2px}
input[type=file]::file-selector-button{font:inherit;margin-right:8px;padding:5px 10px;background:transparent;color:var(--red);border:1px solid var(--red);cursor:pointer}
button,.btn{font:inherit;cursor:pointer;background:rgba(var(--rgb),.06);color:var(--red);border:1px solid var(--red);padding:9px 14px;text-decoration:none;display:inline-block;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);transition:background .15s,color .15s,box-shadow .15s}
button:hover,.btn:hover,button:focus-visible{background:var(--red);color:#050203;box-shadow:0 0 18px var(--red);outline:0}
.pri{background:var(--red);color:#050203;font-weight:700}
.row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.msg{min-height:18px;color:var(--red);font-size:13px;margin:8px 0 0}
.lrow{display:grid;grid-template-columns:auto 1fr 1.4fr auto auto auto;gap:5px;margin-bottom:5px;align-items:stretch}.lrow.over{outline:1px dashed var(--red)}.lrow .hd{cursor:grab;color:var(--mut)}
.lrow button{padding:0 10px;clip-path:none}
#enter{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:var(--bg);color:var(--red);cursor:pointer;font-size:20px;text-shadow:0 0 10px var(--red)}
.avatar{width:110px;height:110px;margin:0 auto 14px;border:2px solid var(--red);border-radius:50%;overflow:hidden;box-shadow:0 0 22px rgba(var(--rgb),.6)}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.mut{color:var(--mut);font-size:13px}
#p_bio{min-height:22px;margin:10px 0 18px;font-size:14px}
#p_bio::before{content:"> ";color:var(--red)}#p_bio::after{content:"█";color:var(--red)}
.links{display:flex;flex-direction:column;gap:9px}
.links a{padding:11px;color:var(--fg);text-decoration:none;border:1px solid var(--dark);background:rgba(var(--rgb),.04);transition:.18s}
.links a::before{content:"[ ";color:var(--red)}.links a::after{content:" ]";color:var(--red)}
.links a:hover{background:var(--red);color:#050203;box-shadow:0 0 20px var(--red)}
.meta{display:flex;justify-content:space-between;margin-top:18px;font-size:12px;color:var(--mut)}

#profile{position:relative;overflow:hidden}
.glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(var(--rgb),.32),transparent 55%)}
#profile>*:not(.glare){position:relative}
label.rowl{flex-direction:row;align-items:center;justify-content:space-between}
input[type=range]{-webkit-appearance:none;appearance:none;height:22px;padding:0;background:transparent;border:0;cursor:pointer;--p:50%}
input[type=range]::-webkit-slider-runnable-track{height:4px;background:linear-gradient(90deg,var(--red) var(--p),var(--dark) var(--p));box-shadow:0 0 8px rgba(var(--rgb),.5)}
input[type=range]::-moz-range-track{height:4px;background:var(--dark)}
input[type=range]::-moz-range-progress{height:4px;background:var(--red)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-6px;background:var(--red);border:2px solid #050203;transform:rotate(45deg);box-shadow:0 0 12px var(--red)}
input[type=range]::-moz-range-thumb{width:12px;height:12px;background:var(--red);border:2px solid #050203;border-radius:0;transform:rotate(45deg)}
input[type=checkbox]{-webkit-appearance:none;appearance:none;width:44px;height:22px;padding:0;border:1px solid var(--red);background:var(--surf);position:relative;cursor:pointer;flex:none}
input[type=checkbox]::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;background:var(--mut);transition:transform .2s,background .2s}
input[type=checkbox]:checked{background:rgba(var(--rgb),.25);box-shadow:0 0 12px rgba(var(--rgb),.6)}
input[type=checkbox]:checked::after{transform:translateX(22px);background:var(--red);box-shadow:0 0 8px var(--red)}
input[type=color]{-webkit-appearance:none;appearance:none;border:1px solid var(--red);box-shadow:0 0 10px rgba(var(--rgb),.4);cursor:pointer}
input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:0}
.lkup{border:1px solid var(--red);background:rgba(var(--rgb),.08);padding:12px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;font-size:13px}.lkup b{color:var(--red)}.lkup span{color:var(--mut)}
.pv{display:flex;flex-direction:column;gap:6px;color:var(--mut);font-size:13px}
.pvrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pvimg{object-fit:cover;border:1px solid var(--red);background:var(--surf);box-shadow:0 0 10px rgba(var(--rgb),.35)}
.round{width:64px;height:64px;border-radius:50%}.wide{width:128px;height:64px}
#pv_music{width:100%;height:36px;color-scheme:dark}
.btn{cursor:pointer;font-size:13px}
select{font:inherit;background:var(--surf);border:1px solid var(--dark);color:var(--fg);padding:9px;width:100%}select:focus{outline:1px solid var(--red)}
.card{-webkit-backdrop-filter:blur(var(--cblur,4px));backdrop-filter:blur(var(--cblur,4px))}
#profile{background:rgba(var(--crgb),var(--cop,.85))}
.avatar.square{border-radius:0}.avatar.cut{border-radius:0;clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.links a{display:flex;align-items:center;justify-content:center;gap:10px}
.links.both a::before,.links.both a::after,.links.icon a::before,.links.icon a::after{content:none}
.links.icon{flex-direction:row;flex-wrap:wrap;justify-content:center}.links.icon a{width:52px;height:52px;padding:0}
.ic svg{width:22px;height:22px;display:block}
.nf-glitch{animation:gl 5s infinite}
@keyframes gl{0%,92%,100%{transform:none}93%{transform:translateX(-3px);text-shadow:3px 0 #0ff,-3px 0 var(--red)}95%{transform:translateX(3px);text-shadow:-3px 0 #0ff,3px 0 var(--red)}97%{transform:none}}
.nf-neon{color:#fff!important;text-shadow:0 0 4px #fff,0 0 12px var(--red),0 0 28px var(--red),0 0 50px var(--red)!important;animation:nn 3s infinite}
@keyframes nn{0%,18%,22%,60%,64%,100%{opacity:1}20%,62%{opacity:.55}}
.nf-rainbow{background:linear-gradient(90deg,#ff1a2e,#ff9d00,#ffe600,#2bff5a,#00c8ff,#a23bff,#ff1a2e);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:none!important;animation:rb 4s linear infinite}
@keyframes rb{to{background-position:200% 0}}
.nf-typewriter::after{content:"|";animation:bl 1s steps(2) infinite}@keyframes bl{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.nf-glitch,.nf-neon,.nf-rainbow{animation:none}}

.dash{width:min(1320px,100%);height:min(880px,calc(100vh - 32px));display:grid;grid-template-columns:200px minmax(0,1fr) 380px;text-align:left;background:rgba(var(--crgb),.9);border:1px solid var(--red);box-shadow:0 0 30px rgba(var(--rgb),.35);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.side{border-right:1px solid var(--dark);padding:20px 14px;display:flex;flex-direction:column;gap:20px}
.brand{color:var(--red);font-weight:700;letter-spacing:3px;font-size:18px;text-shadow:0 0 12px rgba(var(--rgb),.8)}
.tabs{display:flex;flex-direction:column;gap:6px}
.tabs button{clip-path:none;text-align:left;background:transparent;color:var(--mut);border-color:transparent}
.tabs button:hover{background:rgba(var(--rgb),.12);color:var(--fg);box-shadow:none}
.tabs button.on{color:var(--red);border-color:var(--dark);background:rgba(var(--rgb),.1);box-shadow:inset 3px 0 var(--red)}
.sidebot{margin-top:auto;display:flex;flex-direction:column;gap:8px}.sidebot .btn,.sidebot button{text-align:center;font-size:13px}
.main{display:flex;flex-direction:column;min-width:0;min-height:0}
.mhead{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;border-bottom:1px solid var(--dark)}.mhead h2{margin:0}
.panes{flex:1;overflow:auto;padding:22px}
.pane{display:none}.pane.on{display:block}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.box{border:1px solid var(--dark);background:rgba(var(--rgb),.03);padding:16px;display:flex;flex-direction:column;gap:14px}.box.full{grid-column:1/-1}
.box>h3{margin:0;color:var(--red);font-size:14px;letter-spacing:1px}
.main .msg{padding:0 22px 12px;margin:0}
.prev{border-left:1px solid var(--dark);display:flex;flex-direction:column;min-height:0}
.prevhead{display:flex;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--dark);color:var(--mut);font-size:13px}
.stage{flex:1;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:18px;background:var(--bg) radial-gradient(circle at 50% 30%,rgba(var(--rgb),.2),transparent 65%) center/cover}
#pr_card{position:relative;overflow:hidden;width:100%;max-width:340px;padding:20px;background:rgba(var(--crgb),var(--cop,.85))}
#pr_card>*:not(.glare){position:relative}
#pr_card h1{font-size:26px}#pr_card .avatar{width:96px;height:96px}
#pr_bio{min-height:22px;margin:10px 0 18px;font-size:14px}#pr_bio::before{content:"> ";color:var(--red)}#pr_bio::after{content:"█";color:var(--red)}
#pr_links a{pointer-events:none}
.bdgs{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:4px}
.bdg{border:1px solid var(--red);padding:2px 8px;font-size:12px;color:var(--fg);background:rgba(var(--rgb),.1)}.bdg b{color:var(--red);font-weight:400;margin-right:4px}
.blist{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.blist h4{grid-column:1/-1;margin:10px 0 0;color:var(--mut);font-size:13px;font-weight:400}
.bi{display:flex;gap:12px;border:1px solid var(--dark);padding:12px;opacity:.55}
.bi.on{opacity:1;border-color:var(--red);box-shadow:0 0 14px rgba(var(--rgb),.25)}
.bi .g{flex:none;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--dark);font-size:20px;color:var(--mut)}
.bi.on .g{border-color:var(--red);color:var(--red);text-shadow:0 0 10px var(--red)}
.bi b{display:block;color:var(--fg);font-size:14px}.bi small{display:block;color:var(--mut);font-size:12px;margin-top:3px;line-height:1.4}
.bi .st{color:var(--red)}.bar{height:4px;background:var(--dark);margin-top:6px}.bar i{display:block;height:100%;background:var(--red)}
.bi input[type=checkbox]{margin-left:auto;align-self:center}
.kpis{display:flex;gap:12px;flex-wrap:wrap}.kpi{flex:1;min-width:120px;border:1px solid var(--dark);padding:12px}.kpi b{display:block;font-size:26px;color:var(--red)}.kpi span{color:var(--mut);font-size:12px}
.days{display:flex;align-items:flex-end;gap:3px;height:130px}.days i{flex:1;background:var(--red);opacity:.85;box-shadow:0 0 6px rgba(var(--rgb),.5)}.dlab{display:flex;justify-content:space-between;color:var(--mut);font-size:11px}
.srow{display:grid;grid-template-columns:minmax(0,1fr) 90px 34px;gap:8px;align-items:center;font-size:13px;margin-bottom:6px}.srow span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.srow .bar{margin:0}.srow em{font-style:normal;color:var(--red);text-align:right}
*{scrollbar-width:thin;scrollbar-color:var(--red) var(--surf)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--surf)}::-webkit-scrollbar-thumb{background:var(--dark);border:1px solid var(--red)}::-webkit-scrollbar-thumb:hover{background:var(--red)}
.locked{opacity:.6}.trybar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:8px 12px;margin:8px 0;border:1px dashed var(--red);background:rgba(var(--rgb),.08);font-size:13px}.trybar button{clip-path:none}.ptag{font-style:normal;border:1px solid var(--red);color:var(--red);font-size:10px;padding:0 5px;margin-left:6px;vertical-align:middle}
.price{display:flex;align-items:baseline;gap:10px}.price b{font-size:34px;color:var(--red);text-shadow:0 0 12px rgba(var(--rgb),.6)}.price span{color:var(--mut);font-size:13px}
.perks{margin:0;padding-left:18px;line-height:1.9;font-size:14px}
.board{width:min(560px,100%)}
.lbrow{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 10px;border:1px solid var(--dark);margin-bottom:6px;text-decoration:none;color:var(--fg);background:rgba(var(--rgb),.03);text-align:left;transition:background .15s}
.lbrow:hover{background:rgba(var(--rgb),.16)}
.lbrow.t{border-color:var(--red);box-shadow:0 0 12px rgba(var(--rgb),.3)}
.lbrow b{color:var(--red)}.lbrow em{font-style:normal;color:var(--mut);font-size:12px}
.lbrow span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lbrow small{display:block;color:var(--mut);font-size:11px}
#lb_list{margin:14px 0;max-height:60vh;overflow:auto}
.sndw{position:fixed;z-index:15;display:flex;align-items:center;gap:8px;padding:6px 8px;background:rgba(var(--crgb),.8);border:1px solid var(--red);box-shadow:0 0 14px rgba(var(--rgb),.35);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.sndw.tl{top:12px;left:12px}.sndw.tr{top:12px;right:12px}.sndw.bl{bottom:12px;left:12px}.sndw.br{bottom:12px;right:12px}
.sndw button{clip-path:none;padding:4px 10px}.sndw input{width:90px}
.stage .sndw{position:absolute;z-index:2}
.plist{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.pset{clip-path:none;display:flex;flex-direction:column;gap:6px;text-align:left;padding:10px;background:rgba(255,255,255,.02);border:1px solid var(--dark);color:var(--fg);font-size:13px}
.pset .sw{height:34px;border:1px solid rgba(255,255,255,.12);display:block}
.pset small{color:var(--mut);font-size:11px;line-height:1.3}
.pset.on{border-color:var(--red);box-shadow:0 0 14px rgba(var(--rgb),.35)}
.pset.lk{opacity:.6}
.links.grid:not(.icon){display:grid;grid-template-columns:1fr 1fr}.links.big a{padding:18px 11px;font-size:16px}
@keyframes a-fade{from{opacity:0}to{opacity:1}}@keyframes a-slide{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes a-zoom{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}@keyframes a-flip{from{opacity:0;transform:perspective(700px) rotateY(90deg)}to{opacity:1;transform:none}}
@keyframes a-bounce{0%{opacity:0;transform:translateY(-120px)}55%{opacity:1;transform:translateY(12px)}75%{transform:translateY(-6px)}100%{transform:none}}
.an-fade{animation:a-fade .9s ease-out backwards}.an-slide{animation:a-slide .8s ease-out backwards}.an-zoom{animation:a-zoom .7s cubic-bezier(.2,1.4,.4,1) backwards}.an-flip{animation:a-flip .9s ease-out backwards}.an-bounce{animation:a-bounce 1s ease-out backwards}
@media (prefers-reduced-motion:reduce){.an-fade,.an-slide,.an-zoom,.an-flip,.an-bounce{animation:none}}
.embed{margin-top:14px}.embed iframe{width:100%;border:0;display:block;background:#000}.embed.yt iframe{aspect-ratio:16/9;height:auto}
.dcard{display:flex;gap:10px;align-items:center;border:1px solid var(--dark);padding:9px 12px;margin-top:12px;background:rgba(var(--rgb),.04);cursor:pointer;text-align:left;font-size:13px}
.dcard small{display:block;color:var(--mut);font-size:11px;margin-top:2px}.dot{flex:none;display:flex;width:26px;height:26px;color:var(--fg)}.dot svg{width:100%;height:100%;fill:currentColor}
.acts{display:flex;gap:8px;justify-content:center;margin-top:14px}.acts button{font-size:13px;padding:6px 12px}.acts button.on{background:var(--red);color:#050203}
.qrbox{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.qrbox canvas{background:#fff;padding:8px;width:140px;height:140px;image-rendering:pixelated}
.lookrow{display:flex;gap:8px;align-items:center;justify-content:space-between;border:1px solid var(--dark);padding:6px 10px;font-size:13px}
.stage.mob #pr_card{max-width:230px;font-size:12px}.stage.mob #pr_card h1{font-size:20px}
.lbtools{display:flex;gap:8px;margin:10px 0}.lbtools input,.lbtools select{padding:7px}
@media (max-width:1000px){.dash{grid-template-columns:1fr;height:auto}.side{border-right:0;border-bottom:1px solid var(--dark)}.tabs{flex-direction:row;flex-wrap:wrap}.sidebot{flex-direction:row;margin-top:0}.panes{overflow:visible}.grid{grid-template-columns:1fr}.prev{border-left:0;border-top:1px solid var(--dark)}.stage{min-height:480px}}

/* ===== card layouts ===== */
.clpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.clbtn{clip-path:none;padding:8px 6px 6px;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px}
.clbtn svg{width:100%;height:42px;display:block}.clbtn svg *{fill:currentColor}
.clbtn.on{background:var(--red);color:#050203}
.card[data-cl]>.avatar{grid-area:av}.card[data-cl]>h1{grid-area:nm}.card[data-cl]>.mut{grid-area:bg}
.card[data-cl]>:is(#p_bio,#pr_bio){grid-area:bio}.card[data-cl]>.links{grid-area:lk}.card[data-cl]>.dcard{grid-area:dc}
.card[data-cl]>.embed{grid-area:em}.card[data-cl]>.meta{grid-area:mt}.card[data-cl]>.acts{grid-area:ac}
.card[data-cl=left]{text-align:left}
.card[data-cl=left]>.avatar{margin:0 0 14px}.card[data-cl=left] .links.icon,.card[data-cl=left]>.acts{justify-content:flex-start}
.card[data-cl^=s],.card[data-cl=bn]{display:grid;text-align:left;column-gap:26px;align-items:start}
.card[data-cl^=s]>.avatar,.card[data-cl=bn]>.avatar{margin:0 0 14px}
.card[data-cl^=s]>h1,.card[data-cl=bn]>h1{margin:0 0 6px}
.card[data-cl^=s] .links.icon,.card[data-cl=bn] .links.icon,.card[data-cl^=s]>.acts,.card[data-cl=bn]>.acts{justify-content:flex-start}
.card[data-cl=sl]{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-rows:auto auto auto auto 1fr auto auto auto;grid-template-areas:"av lk" "nm lk" "bg lk" "bio lk" "dc lk" "em em" "mt mt" "ac ac"}
.card[data-cl=sr]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:auto auto auto auto 1fr auto auto auto;grid-template-areas:"lk av" "lk nm" "lk bg" "lk bio" "lk dc" "em em" "mt mt" "ac ac"}
.card[data-cl=bn]{grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto auto auto auto;grid-template-areas:"av nm" "av bg" "av bio" "av dc" "lk lk" "em em" "mt mt" "ac ac"}
.card[data-cl=bn]>.links{margin-top:14px}
.card[data-cl=sb]{grid-template-columns:auto minmax(0,1fr);grid-template-rows:repeat(7,auto) 1fr;grid-template-areas:"av nm" "av bg" "av bio" "av lk" "av dc" "av em" "av mt" "av ac"}
#profile[data-cl=sl],#profile[data-cl=sr]{width:min(780px,100%)}#profile[data-cl=bn]{width:min(680px,100%)}#profile[data-cl=sb]{width:min(620px,100%)}
#pr_card[data-cl=sl],#pr_card[data-cl=sr]{width:780px;max-width:none;zoom:.42}#pr_card[data-cl=bn]{width:680px;max-width:none;zoom:.48}#pr_card[data-cl=sb]{width:620px;max-width:none;zoom:.52}
@media (max-width:700px){.card[data-cl^=s],.card[data-cl=bn]{display:block;text-align:center}.card[data-cl^=s]>.avatar,.card[data-cl=bn]>.avatar{margin:0 auto 14px}#profile[data-cl]{width:min(440px,100%)}}
.stage.mob #pr_card[data-cl]{display:block;width:auto;zoom:1;text-align:center}.stage.mob #pr_card[data-cl]>.avatar{margin:0 auto 14px}

#celeb{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at center,rgba(var(--drgb),.94),rgba(var(--crgb),.98) 70%);opacity:0;transition:opacity .35s;text-align:center;overflow:hidden;padding:20px}
#celeb.on{opacity:1}
#celeb.shake{animation:cshake .5s}
#celeb canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#celeb .rays{position:absolute;width:170vmax;height:170vmax;background:repeating-conic-gradient(rgba(var(--rgb),.2) 0 5deg,transparent 5deg 15deg);animation:cspin 16s linear infinite,cfade 1.2s .7s both;-webkit-mask-image:radial-gradient(circle,#000 0,transparent 55%);mask-image:radial-gradient(circle,#000 0,transparent 55%)}
#celeb .flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;animation:cflash .9s .75s ease-out}
#celeb .ring{position:absolute;width:40px;height:40px;border:3px solid var(--red);border-radius:50%;opacity:0;animation:cring 1.7s .75s ease-out forwards}
#celeb .ring.r2{animation-delay:.95s}#celeb .ring.r3{animation-delay:1.15s}
#celeb .logo{position:relative;width:clamp(110px,22vmin,190px);filter:drop-shadow(0 0 22px var(--red)) drop-shadow(0 0 60px var(--red));animation:clogo 1s .6s cubic-bezier(.2,1.5,.4,1) both,cbeat 1.4s 1.7s ease-in-out infinite}
#celeb h2{position:relative;margin:14px 0 2px;font-size:clamp(26px,7vw,58px);letter-spacing:.2em;color:#fff;text-shadow:0 0 12px var(--red),0 0 44px var(--red);animation:cglitch .8s .85s both}
#celeb .who{position:relative;margin:0 0 14px;color:var(--red);font-size:clamp(16px,3.4vw,22px);text-shadow:0 0 10px var(--red);animation:cup .6s 1.3s both}
#celeb ul{position:relative;list-style:none;margin:0 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:640px}
#celeb li{padding:5px 12px;border:1px solid var(--red);border-radius:99px;font-size:13px;background:rgba(var(--rgb),.12);opacity:0;animation:cpill .45s cubic-bezier(.2,1.6,.4,1) forwards}
#celeb button{position:relative;animation:cup .6s 2.9s both}
@keyframes cspin{to{transform:rotate(360deg)}}
@keyframes cfade{from{opacity:0}to{opacity:1}}
@keyframes cflash{0%{opacity:.95}100%{opacity:0}}
@keyframes cring{0%{transform:scale(1);opacity:.9}100%{transform:scale(24);opacity:0}}
@keyframes clogo{0%{transform:scale(0) rotate(-25deg);opacity:0;filter:blur(14px)}100%{transform:scale(1) rotate(0);opacity:1}}
@keyframes cbeat{50%{transform:scale(1.08)}}
@keyframes cup{0%{opacity:0;transform:translateY(22px)}100%{opacity:1;transform:none}}
@keyframes cpill{0%{opacity:0;transform:scale(.3) translateY(20px)}100%{opacity:1;transform:none}}
@keyframes cshake{10%,50%,90%{transform:translate(-8px,4px)}30%,70%{transform:translate(8px,-4px)}}
@keyframes cglitch{0%{opacity:0}5%{opacity:1}10%{transform:translate(-7px,2px);clip-path:inset(20% 0 40% 0)}20%{transform:translate(7px,-2px);clip-path:inset(60% 0 10% 0)}30%{transform:translate(-4px,0);clip-path:inset(10% 0 70% 0)}45%,100%{opacity:1;transform:none;clip-path:inset(0)}}

/* ===== premium entry animations v3 (tunnel, cube, glitch, goofy, synth, jackpot) ===== */
#entfx{position:fixed;inset:0;z-index:9990;overflow:hidden;background:#050203;font-family:"Courier New",Consolas,monospace;color:#fff;cursor:pointer}
#entfx .stage{position:absolute;inset:0;perspective:1100px;display:flex;align-items:center;justify-content:center}
#entfx canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#entfx .eflash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;z-index:9}
#entfx .skip{position:absolute;bottom:14px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.2em;opacity:.35;z-index:9}
#entfx.open{opacity:0;transition:opacity .6s ease-in;pointer-events:none}
#entfx.open .stage{transform:scale(1.12);transition:transform .6s}
#entfx .lg{position:relative;z-index:2;width:clamp(100px,22vmin,190px);filter:drop-shadow(0 0 22px var(--red)) drop-shadow(0 0 60px var(--red))}
#entfx .tx{position:absolute;left:0;right:0;z-index:3;top:calc(50% + clamp(100px,25vmin,210px));text-align:center;letter-spacing:.38em;font-weight:900;font-size:clamp(14px,3.4vw,24px);text-shadow:0 0 12px var(--red),0 0 36px var(--red)}
#entfx .hid{opacity:0}
#entfx .pop{animation:epop .8s cubic-bezier(.2,1.5,.3,1) forwards}
@keyframes epop{from{opacity:0;transform:scale(5);filter:blur(18px)}to{opacity:1;transform:none}}
#entfx .chr{font:900 clamp(26px,7vw,56px)/1 Georgia,serif;letter-spacing:.3em;background:linear-gradient(#fff 15%,#ffd1d6 45%,var(--red) 52%,#4a0610 85%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px var(--red))}
/* cube */
#entfx .cube{position:relative;--s:clamp(120px,24vmin,220px);width:var(--s);height:var(--s);transform-style:preserve-3d}
#entfx .face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,rgba(var(--rgb),.4),rgba(10,0,2,.92));border:2px solid var(--red);box-shadow:inset 0 0 40px rgba(var(--rgb),.6),0 0 30px rgba(var(--rgb),.5);transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .9s}
#entfx .face img{width:60%;filter:drop-shadow(0 0 14px var(--red))}
/* glitch */
#entfx.k-glitch::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:8;background:repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0 1px,transparent 1px 3px)}
#entfx.k-glitch .lg{filter:drop-shadow(-6px 0 #0ff) drop-shadow(6px 0 #f0f) drop-shadow(0 0 30px var(--red))}
#entfx .term{position:absolute;left:5vw;top:6vh;margin:0;color:var(--red);font-size:clamp(11px,2.6vw,15px);text-shadow:0 0 8px var(--red);line-height:1.7}
/* goofy */
#entfx.k-goofy{background:radial-gradient(circle,rgba(var(--rgb),.4) 2px,transparent 3px) 0 0/22px 22px,#1a0408}
#entfx .burst{position:absolute;left:50%;top:50%;width:min(86vw,500px);aspect-ratio:1;transform:translate(-50%,-50%) scale(0);background:#ffe14d;clip-path:polygon(50% 0,61% 20%,82% 8%,78% 31%,100% 35%,84% 52%,98% 73%,76% 73%,76% 96%,56% 82%,40% 100%,35% 78%,12% 90%,20% 66%,0 55%,18% 41%,6% 18%,30% 24%,38% 2%);display:flex;justify-content:center;align-items:center;padding-top:44%;box-sizing:border-box;font:900 clamp(34px,10vw,70px) Impact,"Arial Black",sans-serif;color:#e8001a;-webkit-text-stroke:2px #000}
/* jackpot */
#entfx .coin{position:relative;--cs:clamp(150px,34vmin,300px);width:var(--cs);height:var(--cs);transform-style:preserve-3d;z-index:2}
#entfx .cl,#entfx .cf{position:absolute;inset:0;border-radius:50%}
#entfx .cf{display:flex;align-items:center;justify-content:center;backface-visibility:hidden;background:radial-gradient(circle at 35% 30%,#fff3b0,#ffd166 40%,#c8921a 75%,#8a5a00);box-shadow:inset 0 0 0 calc(var(--cs)*.06) #e0a526,inset 0 0 0 calc(var(--cs)*.085) #8a5a00;font:900 calc(var(--cs)*.6) Georgia,serif;color:#ff1a2e;-webkit-text-stroke:2px #8a0f1d}
#entfx .cf img{width:56%;filter:drop-shadow(0 3px 0 #8a5a00)}
#entfx .rays{position:absolute;width:170vmax;height:170vmax;left:50%;top:50%;margin:-85vmax 0 0 -85vmax;opacity:0;background:repeating-conic-gradient(rgba(255,209,102,.18) 0 6deg,transparent 6deg 18deg);-webkit-mask-image:radial-gradient(circle,#000,transparent 55%);mask-image:radial-gradient(circle,#000,transparent 55%);animation:cspin 18s linear infinite}
#entfx .tx.big{font:900 clamp(44px,13vw,110px)/1 Georgia,serif;letter-spacing:.04em;color:#ffd166;-webkit-text-stroke:3px #8a0f1d;text-shadow:0 6px 0 #8a0f1d,0 0 40px #ffb020,0 0 90px var(--red)}
#entfx .tx.big small{display:block;margin-top:10px;font:900 clamp(14px,3.4vw,22px) "Courier New",monospace;letter-spacing:.3em;color:#fff;-webkit-text-stroke:0;text-shadow:0 0 14px var(--red)}
.entreveal{animation:entrev 1s cubic-bezier(.2,.8,.2,1) both}
@keyframes entrev{0%{opacity:0;transform:scale(1.18);filter:blur(16px) brightness(2.5)}60%{opacity:1;filter:blur(2px) brightness(1.3)}100%{opacity:1;transform:none;filter:none}}
/* entry screen (before click) */
#enter{flex-direction:column;gap:26px;overflow:hidden;letter-spacing:.06em;animation:epulse 2.4s ease-in-out infinite}
#enter::before{content:"";width:96px;height:96px;background:url(/logo.png) center/contain no-repeat;filter:drop-shadow(0 0 18px var(--red));animation:efloat 3.2s ease-in-out infinite;position:relative;z-index:1}
#enter::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 45%,rgba(var(--rgb),.16),transparent 55%),repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 3px);animation:escan 6s linear infinite;background-size:100% 100%,100% 3px}
#enter:hover{letter-spacing:.14em;transition:letter-spacing .4s}
@keyframes epulse{50%{text-shadow:0 0 24px var(--red),0 0 52px var(--red)}}
@keyframes efloat{50%{transform:translateY(-8px) scale(1.05)}}
@keyframes escan{to{background-position:0 0,0 60px}}

.e404{font-size:clamp(70px,20vw,140px);margin:0;color:var(--red);text-shadow:0 0 24px var(--red);position:relative;animation:e4 2.4s infinite}
.e404::before,.e404::after{content:attr(data-x);position:absolute;left:0;right:0;opacity:.7}
.e404::before{color:#0ff;transform:translate(-3px,0);clip-path:inset(0 0 60% 0)}.e404::after{color:#f0f;transform:translate(3px,0);clip-path:inset(60% 0 0 0)}
@keyframes e4{0%,90%,100%{transform:none}92%{transform:translate(-5px,2px)}96%{transform:translate(5px,-2px)}}
#ui_bar{position:fixed;top:10px;right:10px;z-index:50;display:flex;gap:6px}
#ui_bar button,#ui_bar select{padding:5px 8px;font-size:13px}
body:has(#profile:not([hidden])) #ui_bar{display:none}
.tabs button[hidden]{display:none}
#toast{position:fixed;left:50%;bottom:26px;z-index:9998;transform:translate(-50%,30px);opacity:0;pointer-events:none;background:var(--bg);color:var(--fg);border:1px solid var(--red);box-shadow:0 0 18px rgba(var(--rgb),.5);padding:10px 16px;font-size:13px;text-align:center;max-width:90vw;transition:.3s}
#toast.on{opacity:1;transform:translate(-50%,0)}#toast small{display:block;color:var(--mut);font-size:11px;margin-top:3px;word-break:break-all}
#sharebtn{margin:0}
.rep{position:relative;display:block;margin:14px auto 0;background:none;border:0;color:var(--mut);font-size:11px;cursor:pointer;opacity:.6}.rep:hover{opacity:1}
.rprow{display:flex;gap:8px;align-items:center;justify-content:space-between;border:1px solid var(--dark);padding:8px 10px;margin-top:8px;flex-wrap:wrap}
html.light #editor,html.light #auth,html.light #board,html.light #notfound{--bg:var(--lbg);--fg:var(--lfg);--mut:var(--lmut);--dark:var(--ldark);background:var(--lbg);color:var(--lfg)}
html.light body:has(#editor:not([hidden])),html.light body:has(#auth:not([hidden])),html.light body:has(#board:not([hidden])),html.light body:has(#notfound:not([hidden])){background-color:var(--lbg)}
html.light .pri{color:#fff}
/* ===== v2 ===== */
@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes angr{to{--ang:360deg}}
@keyframes gshift{to{background-position:250% 0}}
@keyframes shn{to{left:130%}}
.fxf{position:relative}
.fxf::before{content:"";position:absolute;inset:-3px;padding:3px;pointer-events:none;background:conic-gradient(from var(--ang),var(--red),#fff 12%,var(--red) 25%,transparent 55%,var(--red));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:angr 3.5s linear infinite;filter:drop-shadow(0 0 6px var(--red))}
.fxg h1{background:linear-gradient(90deg,var(--red),#fff,rgb(var(--lt)),var(--red));background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;text-shadow:none!important;animation:gshift 4s linear infinite}
.fxs .bdg{position:relative;overflow:hidden}
.fxs .bdg::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-20deg);animation:shn 2.6s ease-in-out infinite}
.v2cd{font-variant-numeric:tabular-nums;color:var(--red);font-weight:700}
.v2off{border-color:var(--red);background:rgba(var(--rgb),.1)}.v2off s{color:var(--mut)}
.ckrow{display:flex;gap:8px;align-items:center;padding:5px 0;cursor:pointer;font-size:14px}.ckrow i{font-style:normal;color:var(--red);width:18px}.ckrow.d{color:var(--mut);text-decoration:line-through;cursor:default}
.v2pay{display:grid;grid-template-columns:1fr auto auto;gap:10px;padding:6px 0;border-bottom:1px solid var(--dark);font-size:13px}.v2pay small{color:var(--mut);word-break:break-all}
.v2ev{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--dark);font-size:13px}
.lbtools.v2f{flex-wrap:wrap;align-items:center}.lbtools.v2f label{flex-direction:row;align-items:center;gap:6px}.lbtools.v2f input[type=checkbox]{width:auto}
:is(#editor,#auth,#board) :is(button,.btn){position:relative;overflow:hidden;transition:transform .08s,background .15s,box-shadow .15s}
:is(#editor,#auth,#board) :is(button,.btn):active{transform:scale(.95)}
:is(#editor,#auth,#board) :is(button,.btn).rip::after{content:"";position:absolute;left:var(--rx);top:var(--ry);width:8px;height:8px;margin:-4px;border-radius:50%;background:rgba(255,255,255,.5);animation:rpl .55s ease-out forwards;pointer-events:none}
@keyframes rpl{to{transform:scale(28);opacity:0}}
.pane.on{animation:paneIn .28s ease-out}@keyframes paneIn{from{opacity:0;transform:translateY(6px)}}
#editor .pri:not(:disabled){animation:priP 2.8s ease-in-out infinite}@keyframes priP{50%{box-shadow:0 0 14px rgba(var(--rgb),.55)}}
@media(prefers-reduced-motion:reduce){.fxf::before,.fxg h1,.fxs .bdg::after,#editor .pri,.pane.on{animation:none!important}}
.claimbox{display:flex;align-items:center;background:var(--surf);border:1px solid var(--red);box-shadow:0 0 16px rgba(var(--rgb),.25)}.claimbox span{padding:0 0 0 12px;color:var(--mut);white-space:nowrap}.claimbox input{border:0;background:transparent;padding:12px 12px 12px 2px;font-size:16px;color:var(--fg);outline:0}.claimed{margin:14px 0 0;color:var(--fg)}.claimed b{color:var(--red)}#cl_go:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}
.wrap:has(#home:not([hidden])){align-items:flex-start;padding:0}#home{width:100%;max-width:1000px;margin:0 auto;padding:0 18px 30px;text-align:center}
.hnav{display:flex;justify-content:space-between;align-items:center;padding:14px 0}#hlogo .logo{width:90px;margin:0}.hnav .btn,.hnav button{font-size:13px;padding:7px 12px}
.hero{padding:clamp(30px,8vh,90px) 0 40px}.hbadge{display:inline-block;border:1px solid var(--dark);color:var(--mut);font-size:12px;padding:4px 12px;border-radius:20px;background:rgba(var(--crgb),.6)}
.hh{font-size:clamp(32px,7vw,64px);line-height:1.05;margin:18px 0 12px;letter-spacing:1px;color:var(--fg);text-shadow:none}.hh em{font-style:normal;color:var(--red);text-shadow:0 0 24px rgba(var(--rgb),.8)}
.hs{max-width:560px;margin:0 auto 26px;color:var(--mut);line-height:1.5}
.hclaim{display:flex;gap:8px;max-width:480px;margin:0 auto}.hclaim .claimbox{flex:1}.hclaim button{padding:0 22px}
#home .msg{text-align:center}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:10px 0 40px;text-align:left}
.fc{background:rgba(var(--crgb),.8);border:1px solid var(--dark);padding:16px;display:flex;flex-direction:column;gap:6px;transition:border-color .2s,box-shadow .2s}.fc:hover{border-color:var(--red);box-shadow:0 0 18px rgba(var(--rgb),.25)}.fc span{color:var(--mut);font-size:13px;line-height:1.4}
.hsec{color:var(--fg);letter-spacing:3px;text-transform:uppercase;font-size:14px;margin:0 0 14px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-bottom:10px}
.pc{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px;background:rgba(var(--crgb),.8);border:1px solid var(--dark);color:var(--fg);text-decoration:none;font-size:13px;transition:transform .15s,border-color .15s}.pc:hover{transform:translateY(-3px);border-color:var(--red);box-shadow:0 0 16px rgba(var(--rgb),.3)}
.pc i{width:56px;height:56px;border-radius:50%;border:1px solid var(--red);background:var(--surf) center/cover;display:flex;align-items:center;justify-content:center;font-style:normal;color:var(--red);font-size:22px;font-weight:700}.pc small{color:var(--mut)}
.hcta{margin:50px 0 20px;padding:34px 16px;border:1px dashed var(--red);background:rgba(var(--rgb),.06)}.hfoot{color:var(--mut);font-size:12px;margin-top:30px}.hfoot a{color:var(--red)}
@media(max-width:520px){.hclaim{flex-direction:column}.hclaim button{padding:11px}}
.ic{width:1.15em;height:1.15em;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em;margin-right:.45em;flex:none}.fc b .ic{width:1.3em;height:1.3em}
#bgv{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;pointer-events:none}
.tgrp{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--mut);margin:16px 0 4px 10px}.tgrp:first-child{margin-top:0}
.tabs button{display:flex;align-items:center}.tabs .ic{margin-right:.6em}#sharebtn,#view{display:none}
.dsec{cursor:pointer;display:flex;justify-content:space-between;padding:10px 12px;margin-bottom:12px;border:1px solid var(--dark);background:rgba(var(--rgb),.06);color:var(--red);letter-spacing:1px;font-size:14px;user-select:none}.dsec::after{content:'−'}.pane.collapsed .dsec::after{content:'+'}.pane.collapsed .grid{display:none}#t_look,#t_fx,#t_media{margin-bottom:22px}
.kpis3{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.kc{border:1px solid var(--dark);padding:16px;text-align:center;display:flex;flex-direction:column;gap:4px}.kc b{font-size:28px;color:var(--fg)}.kc span{color:var(--mut);font-size:12px}
.mhead{gap:12px}.lbar{display:flex;align-items:center;gap:6px;min-width:0}.lbar span{color:var(--mut);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lbar .btn,.lbar button{padding:6px 9px;clip-path:none;font-size:13px}.lbar .ic{margin:0}.lbar #pvopen .ic{margin-right:.4em}
.savebar{display:flex;align-items:center;gap:12px;padding:10px 22px;border-top:1px solid var(--dark);background:rgba(var(--crgb),.95)}.sdot{width:9px;height:9px;border-radius:50%;background:#3ddc84;flex:none}.sdot.on{background:#ffb020;box-shadow:0 0 8px #ffb020}#sstate{font-size:13px;color:var(--mut);white-space:nowrap}.savebar .msg{flex:1;min-width:0;padding:0;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobonly,#pvclose{display:none}
@media(max-width:1000px){.mobonly{display:inline-block}.dash{padding-bottom:64px;-webkit-backdrop-filter:none;backdrop-filter:none}.side{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:4px 6px;border:0;border-top:1px solid var(--red);background:rgba(var(--crgb),.98);flex-direction:row}.brand,.tgrp,.sidebot{display:none}.tabs{flex-wrap:nowrap;overflow-x:auto;width:100%;gap:2px}.tabs button{flex-direction:column;gap:2px;font-size:10px;padding:6px 10px;min-width:64px;justify-content:center}.tabs .ic{margin:0;width:1.4em;height:1.4em}.savebar{position:fixed;left:0;right:0;bottom:58px;z-index:39;padding:8px 12px}.panes{padding:14px 14px 70px}.mhead{padding:10px 14px;flex-wrap:wrap}.lbar span{max-width:34vw}.prev{display:none;position:fixed;inset:0;z-index:60;background:var(--bg);border:0}body.pvopen .prev{display:flex}#pvclose{display:inline-block}.prev .stage{min-height:0}}

.meta{flex-wrap:wrap;gap:4px 12px}
.tzline{flex:0 0 100%;margin-bottom:8px}
.tzline[hidden]{display:none}
.tzt{display:block;font-size:20px;letter-spacing:1px;color:var(--fg);text-shadow:0 0 12px rgba(var(--rgb),.6)}
.tzs{display:block;font-size:12px;color:var(--mut);margin-top:2px}
#tz_info{margin:2px 0 8px;font-size:12px}
#tz_detect{margin:4px 0 8px}

/* ===== avatar frames ===== */
@property --fa{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes fa{to{--fa:360deg}}@keyframes frr{to{transform:rotate(360deg)}}@keyframes fpl{50%{opacity:.45;transform:scale(1.04)}}@keyframes ffl{to{opacity:.7;transform:scale(1.03)}}@keyframes fgl{0%,88%,100%{transform:none}90%{transform:translate(-3px,1px)}94%{transform:translate(3px,-1px)}}@keyframes ftw{50%{opacity:.25;transform:translateX(-50%) scale(.6)}}@keyframes fbt{0%,100%{transform:scale(1)}15%{transform:scale(1.045)}30%{transform:scale(1)}45%{transform:scale(1.035)}}
.avatar.hasf{position:relative;overflow:visible;clip-path:none;border:0;box-shadow:none}
.avatar.hasf>img{border-radius:inherit}.avatar.cut.hasf>img{clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.frm{position:absolute;inset:-10%;pointer-events:none;z-index:2;filter:hue-rotate(var(--fh,0deg))}
.frm .fu,.frm .fb,.frm .fi{position:absolute;inset:0;display:block;border-radius:var(--fr,50%)}
.frm .fb{padding:var(--w,6px);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
.frm[data-o] .fi{animation:frr 9s linear infinite}
.frm[data-o] .fi::before,.frm[data-o] .fi::after{position:absolute;left:50%;line-height:1;font-size:var(--os,16px);color:var(--oc,#fff);text-shadow:0 0 8px var(--oc,#fff);transform:translateX(-50%)}
.frm[data-o] .fi::before{top:-9%}.frm[data-o] .fi::after{bottom:-9%}
/* ===== avatar frames v2: every frame uses --c1/--c2/--c3, so any colour can be picked ===== */
.frm .fb{padding:calc(var(--w,6px) * var(--fwk,1))}
.frm.ng .fu{box-shadow:none!important;filter:none!important}
.frm .shine{display:none}
/* shared glossy highlight for metallic frames */
:is([data-f=redx],[data-f=gold],[data-f=chrome],[data-f=pearl],[data-f=devil],[data-f=hearts]) .fb::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.65),transparent 32%,transparent 70%,rgba(255,255,255,.25))}

[data-f=redx]{--c1:#ff1a2e;--c2:#ff8a96;--c3:#5a0020}
[data-f=redx] .fb{background:linear-gradient(135deg,var(--c1),var(--c3) 50%,var(--c1))}[data-f=redx] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 60%,transparent)}
[data-f=redx] .fi::before,[data-f=redx] .fi::after{content:"";position:absolute;width:34%;height:8%;border-radius:3px;background:linear-gradient(90deg,var(--c3),var(--c1),var(--c2));transform:rotate(-38deg);box-shadow:0 0 12px var(--c1)}
[data-f=redx] .fi::before{left:-13%;bottom:8%}[data-f=redx] .fi::after{right:-13%;top:8%}

[data-f=spin]{--c1:#ff1a2e;--c2:#ffb000;--c3:#4a0016}
[data-f=spin] .fb{background:conic-gradient(from var(--fa),var(--c3),var(--c1) 40%,var(--c2) 50%,var(--c1) 60%,var(--c3) 100%);animation:fa 2.4s linear infinite}[data-f=spin] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 55%,transparent)}

[data-f=rainbow]{--c1:#ff3355;--c2:#33ddff;--c3:#ffdd00}
[data-f=rainbow] .fb{background:conic-gradient(from var(--fa),#f33,#f90,#fd0,#3f6,#0df,#46f,#c4f,#f33);animation:fa 2.5s linear infinite}[data-f=rainbow] .fu{box-shadow:0 0 18px #b46bff66}
.frm.cc[data-f=rainbow] .fb{background:conic-gradient(from var(--fa),var(--c1),var(--c2),var(--c3),var(--c2),var(--c1))}

[data-f=neon]{--c1:#ff2bd6;--c2:#00f0ff}
[data-f=neon] .fb{padding:calc(var(--w) * .45 * var(--fwk,1));background:var(--c2);box-shadow:0 0 0 1px #fff4}[data-f=neon] .fu{inset:-6%;border:2px solid var(--c1);box-shadow:0 0 14px var(--c1),inset 0 0 14px var(--c1);animation:fpl 2s ease-in-out infinite}
[data-f=neon] .fi{inset:-12%;border:1px solid color-mix(in srgb,var(--c2) 45%,transparent);border-radius:var(--fr,50%);animation:fpl 2s ease-in-out -1s infinite}

[data-f=fire]{--c1:#ffd000;--c2:#ff5a00;--c3:#c40000}
[data-f=fire] .fb{background:conic-gradient(from var(--fa),var(--c1),var(--c2),var(--c3),var(--c2),var(--c1));animation:fa 1.6s linear infinite}[data-f=fire] .fu{box-shadow:0 0 16px 4px color-mix(in srgb,var(--c2) 60%,transparent),0 -10px 34px 6px color-mix(in srgb,var(--c3) 35%,transparent);animation:ffl .15s steps(2) infinite alternate}

[data-f=ice]{--c1:#eafcff;--c2:#5ec8ff;--c3:#2a6dff;--oc:#dff7ff}
[data-f=ice] .fb{background:conic-gradient(from var(--fa),var(--c1),var(--c2),var(--c1) 40%,var(--c3),var(--c1));animation:fa 7s linear infinite}[data-f=ice] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c2) 60%,transparent)}[data-f=ice] .fi::before{content:"✦"}[data-f=ice] .fi::after{content:"✧"}

[data-f=aurora]{--c1:#2bffb0;--c2:#3a7bff;--c3:#b44bff}
[data-f=aurora] .fb{background:conic-gradient(from var(--fa),var(--c1),var(--c2),var(--c3),var(--c1));animation:fa 6s linear infinite}[data-f=aurora] .fu{box-shadow:0 0 22px color-mix(in srgb,var(--c2) 55%,transparent),0 0 10px color-mix(in srgb,var(--c1) 55%,transparent)}

[data-f=galaxy]{--c1:#7b3bff;--c2:#2a6bff;--c3:#1a0550;--oc:#e6d9ff}
[data-f=galaxy] .fb{background:radial-gradient(circle at 30% 20%,#fff 0 1px,transparent 1.5px) 0 0/9px 9px,conic-gradient(from var(--fa),var(--c3),var(--c1),var(--c2),var(--c1),var(--c3));animation:fa 8s linear infinite}[data-f=galaxy] .fu{box-shadow:0 0 20px color-mix(in srgb,var(--c1) 60%,transparent)}[data-f=galaxy] .fi::before{content:"★"}[data-f=galaxy] .fi::after{content:"✦"}

[data-f=glitch]{--c1:#ff1a2e;--c2:#00f0ff}
[data-f=glitch] .fb{background:var(--c1)}[data-f=glitch] .fu{inset:-3%;border:2px solid var(--c2);mix-blend-mode:screen;animation:fgl 2.2s steps(1) infinite}[data-f=glitch] .fi{inset:-2%;border:2px solid color-mix(in srgb,var(--c1) 45%,transparent);border-radius:var(--fr,50%);animation:fgl 2.2s steps(1) .3s infinite reverse}

[data-f=cyber]{--c1:#00f0ff;--c2:#0077ff}
[data-f=cyber] .fb{background:repeating-conic-gradient(from var(--fa),var(--c1) 0 12deg,transparent 12deg 18deg);animation:fa 6s linear infinite}[data-f=cyber] .fu{border:2px solid color-mix(in srgb,var(--c1) 35%,transparent);border-radius:var(--fr,50%);box-shadow:0 0 14px color-mix(in srgb,var(--c1) 40%,transparent)}[data-f=cyber] .fi{inset:7%;border:2px dashed color-mix(in srgb,var(--c2) 70%,transparent);border-radius:var(--fr,50%);animation:frr 12s linear infinite reverse}

[data-f=radar]{--c1:#00ff6a}
[data-f=radar] .fb{background:conic-gradient(from var(--fa),transparent 0deg,color-mix(in srgb,var(--c1) 20%,transparent) 200deg,var(--c1) 359deg,transparent 360deg);animation:fa 2.4s linear infinite}[data-f=radar] .fu{border:2px solid color-mix(in srgb,var(--c1) 35%,transparent);border-radius:var(--fr,50%);box-shadow:0 0 12px color-mix(in srgb,var(--c1) 30%,transparent)}

[data-f=gold]{--c1:#e6a800;--c2:#fff3a0;--c3:#8a5a00}
[data-f=gold] .fb{background:conic-gradient(from 200deg,var(--c2),var(--c1) 20%,var(--c3) 35%,var(--c2) 50%,var(--c1) 70%,var(--c3) 85%,var(--c2))}[data-f=gold] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 55%,transparent)}[data-f=gold] .fi{filter:drop-shadow(0 0 6px var(--c1))}
[data-f=gold] .fi::before{content:"";position:absolute;left:50%;top:-20%;width:44%;height:28%;transform:translateX(-50%);background:linear-gradient(var(--c2),var(--c1) 60%,var(--c3));clip-path:polygon(0 100%,0 25%,25% 60%,50% 0,75% 60%,100% 25%,100% 100%)}

[data-f=sakura]{--c1:#ff7fb2;--c2:#ffd1e6;--c3:#ffffff;--oc:#ffb3d1}
[data-f=sakura] .fb{background:conic-gradient(from var(--fa),var(--c2),var(--c1),var(--c3),var(--c1),var(--c2));animation:fa 9s linear infinite}[data-f=sakura] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 55%,transparent)}[data-f=sakura] .fi::before{content:"✿"}[data-f=sakura] .fi::after{content:"❀"}

[data-f=vapor]{--c1:#ff71ce;--c2:#b967ff;--c3:#01cdfe}
[data-f=vapor] .fb{background:linear-gradient(135deg,var(--c1),var(--c2) 45%,var(--c3))}[data-f=vapor] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c2) 60%,transparent),0 0 6px color-mix(in srgb,var(--c3) 55%,transparent)}

[data-f=toxic]{--c1:#c6ff00;--c3:#111111;--oc:#c6ff00}
[data-f=toxic] .fb{background:repeating-linear-gradient(45deg,var(--c1) 0 8px,var(--c3) 8px 16px);animation:fpl 1.6s ease-in-out infinite}[data-f=toxic] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 55%,transparent)}[data-f=toxic] .fi::before{content:"☢"}[data-f=toxic] .fi::after{content:"☣"}

[data-f=volt]{--c1:#ffd600;--c2:#fff6a0;--oc:#ffe94d}
[data-f=volt] .fb{background:conic-gradient(from var(--fa),var(--c2),var(--c1),#fff,var(--c1),var(--c2));animation:fa 1.4s linear infinite}[data-f=volt] .fu{box-shadow:0 0 18px var(--c1);animation:fgl 1.3s steps(1) infinite}[data-f=volt] .fi::before,[data-f=volt] .fi::after{content:"⚡"}

[data-f=blood]{--c1:#b0001f;--c2:#ff2b2b;--c3:#3d0008}
[data-f=blood] .fb{background:linear-gradient(var(--c1),var(--c3))}[data-f=blood] .fu{box-shadow:0 0 22px color-mix(in srgb,var(--c1) 80%,transparent),0 0 6px var(--c2);animation:fbt 1.2s ease-in-out infinite}
[data-f=blood] .fi::before,[data-f=blood] .fi::after{content:"";position:absolute;bottom:-12%;width:6%;border-radius:0 0 6px 6px;background:linear-gradient(var(--c1),var(--c2))}[data-f=blood] .fi::before{left:28%;height:16%}[data-f=blood] .fi::after{left:62%;height:11%}

[data-f=hearts]{--c1:#ff2d78;--c2:#ff8ab8;--oc:#ff4d8d}
[data-f=hearts] .fb{background:linear-gradient(135deg,var(--c2),var(--c1))}[data-f=hearts] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 55%,transparent)}[data-f=hearts] .fi::before,[data-f=hearts] .fi::after{content:"♥"}

[data-f=halo]{--c1:#ffd85a;--c2:#ffffff;--c3:#cfe9ff}
[data-f=halo] .fb{padding:calc(var(--w) * .4 * var(--fwk,1));background:linear-gradient(var(--c2),var(--c3))}[data-f=halo] .fu{box-shadow:0 0 22px color-mix(in srgb,var(--c3) 80%,transparent)}
[data-f=halo] .fi::before{content:"";position:absolute;left:50%;top:-20%;width:46%;height:14%;transform:translateX(-50%);border:calc(var(--w) * .6) solid var(--c1);border-radius:50%;box-shadow:0 0 12px var(--c1),inset 0 0 8px var(--c1)}

[data-f=devil]{--c1:#ff2b2b;--c3:#5a0010}
[data-f=devil] .fb{background:linear-gradient(135deg,var(--c1),var(--c3))}[data-f=devil] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 55%,transparent)}
[data-f=devil] .fi::before,[data-f=devil] .fi::after{content:"";position:absolute;top:-16%;width:20%;height:26%;background:linear-gradient(var(--c1),var(--c3));clip-path:polygon(0 100%,50% 0,100% 100%)}[data-f=devil] .fi::before{left:10%;transform:rotate(-18deg)}[data-f=devil] .fi::after{right:10%;transform:rotate(18deg)}

[data-f=cat]{--c1:var(--red);--c2:#ffb3c6}
[data-f=cat] .fb{background:var(--c1)}[data-f=cat] .fu{box-shadow:0 0 14px color-mix(in srgb,var(--c1) 60%,transparent)}
[data-f=cat] .fi::before,[data-f=cat] .fi::after{content:"";position:absolute;top:-14%;width:26%;height:30%;background:linear-gradient(var(--c1),var(--c1)) ,var(--c1)}[data-f=cat] .fi::before{left:6%;clip-path:polygon(0 100%,10% 0,100% 100%)}[data-f=cat] .fi::after{right:6%;clip-path:polygon(0 100%,90% 0,100% 100%)}

[data-f=arcade]{--c1:#ff1a2e;--c2:#2bff6a;--c3:#3a6bff}
[data-f=arcade] .fb{background:conic-gradient(from var(--fa),#ff1a2e 0 12.5%,#ff9a00 0 25%,#ffe600 0 37.5%,#2bff6a 0 50%,#00e5ff 0 62.5%,#3a6bff 0 75%,#b44bff 0 87.5%,#ff4dc4 0 100%);animation:fa 4s steps(8) infinite}
.frm.cc[data-f=arcade] .fb{background:conic-gradient(from var(--fa),var(--c1) 0 12.5%,var(--c2) 0 25%,var(--c3) 0 37.5%,var(--c1) 0 50%,var(--c2) 0 62.5%,var(--c3) 0 75%,var(--c1) 0 87.5%,var(--c2) 0 100%)}

[data-f=stars]{--c1:#ffd36a;--c2:#fff6c9;--oc:#fff1b0}
[data-f=stars] .fb{background:linear-gradient(135deg,var(--c2),var(--c1),var(--c2))}[data-f=stars] .fu{box-shadow:0 0 16px color-mix(in srgb,var(--c1) 65%,transparent)}[data-f=stars] .fi::before,[data-f=stars] .fi::after{content:"✦";animation:ftw 1.4s infinite}

/* --- new frames (white & silver by default) --- */
[data-f=chrome]{--c1:#ffffff;--c2:#c9d1da;--c3:#5f6873}
[data-f=chrome] .fb{background:conic-gradient(from var(--fa),var(--c1),var(--c3) 12%,var(--c2) 25%,var(--c1) 38%,var(--c3) 55%,var(--c2) 70%,var(--c1) 85%,var(--c3) 95%,var(--c1));animation:fa 6s linear infinite}[data-f=chrome] .fu{box-shadow:0 0 16px color-mix(in srgb,var(--c1) 45%,transparent),0 0 2px color-mix(in srgb,var(--c1) 80%,transparent)}

[data-f=pearl]{--c1:#ffffff;--c2:#f3e6ff;--c3:#dff4ff}
[data-f=pearl] .fb{background:conic-gradient(from var(--fa),#fff,#ffe3f3,#e3f0ff,#e9ffe9,#fff6dc,#fff);animation:fa 10s linear infinite}[data-f=pearl] .fu{box-shadow:0 0 20px rgba(255,255,255,.55),0 0 40px rgba(220,200,255,.35)}
.frm.cc[data-f=pearl] .fb{background:conic-gradient(from var(--fa),var(--c1),var(--c2),var(--c3),var(--c2),var(--c1))}

[data-f=diamond]{--c1:#ffffff;--c2:#d6e4f5;--c3:#8696aa;--oc:#ffffff}
[data-f=diamond] .fb{background:repeating-conic-gradient(from var(--fa),var(--c1) 0 6deg,var(--c3) 6deg 9deg,var(--c2) 9deg 15deg,var(--c1) 15deg 18deg);animation:fa 14s linear infinite}[data-f=diamond] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c1) 55%,transparent)}[data-f=diamond] .fi::before{content:"✦";animation:ftw 1.2s infinite}[data-f=diamond] .fi::after{content:"✧";animation:ftw 1.6s .4s infinite}

[data-f=angel]{--c1:#ffffff;--c2:#ffe9a8;--c3:#dfe9ff}
[data-f=angel] .fb{padding:calc(var(--w) * .45 * var(--fwk,1));background:linear-gradient(var(--c1),var(--c3))}[data-f=angel] .fu{box-shadow:0 0 24px color-mix(in srgb,var(--c1) 70%,transparent),0 0 50px color-mix(in srgb,var(--c3) 45%,transparent)}
[data-f=angel] .fi::before{content:"";position:absolute;left:50%;top:-20%;width:46%;height:14%;transform:translateX(-50%);border:calc(var(--w) * .55) solid var(--c2);border-radius:50%;box-shadow:0 0 14px var(--c2),inset 0 0 8px var(--c2)}
[data-f=angel] .fu::before,[data-f=angel] .fu::after{content:"";position:absolute;top:8%;width:46%;height:56%;
 background:repeating-linear-gradient(165deg,transparent 0 17%,rgba(120,140,180,.28) 17% 18.5%),linear-gradient(90deg,var(--c3),var(--c1) 60%,var(--c1));
 clip-path:polygon(100% 30%,78% 10%,52% 2%,24% 0,4% 6%,0 16%,14% 22%,3% 33%,20% 39%,9% 51%,28% 55%,20% 68%,40% 70%,38% 84%,58% 82%,66% 96%,82% 82%,100% 66%)}
[data-f=angel] .fu::before{left:-40%}[data-f=angel] .fu::after{right:-40%;transform:scaleX(-1)}
[data-f=frost]{--c1:#ffffff;--c2:#bfe8ff;--c3:#7fb6e6;--oc:#ffffff}
[data-f=frost] .fb{background:conic-gradient(from var(--fa),var(--c1),var(--c2),var(--c1) 35%,var(--c3) 55%,var(--c1) 75%,var(--c2));animation:fa 9s linear infinite}[data-f=frost] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c2) 70%,transparent)}[data-f=frost] .fi::before{content:"❄"}[data-f=frost] .fi::after{content:"❅"}

[data-f=duo]{--c1:#ffffff;--c2:#ffffff}
[data-f=duo] .fb{padding:calc(var(--w) * .35 * var(--fwk,1));background:var(--c1)}[data-f=duo] .fu{box-shadow:0 0 12px color-mix(in srgb,var(--c1) 35%,transparent)}
[data-f=duo] .fi{inset:-7%;border:calc(var(--w) * .25 * var(--fwk,1) + .5px) solid color-mix(in srgb,var(--c2) 70%,transparent);border-radius:var(--fr,50%)}

[data-f=moon]{--c1:#fff6c9;--c2:#8ab4ff}
[data-f=moon] .fb{padding:calc(var(--w) * .4 * var(--fwk,1));background:linear-gradient(200deg,var(--c1),var(--c2))}[data-f=moon] .fu{box-shadow:0 0 18px color-mix(in srgb,var(--c2) 55%,transparent)}
[data-f=moon] .fi::before{content:"";position:absolute;right:-4%;top:-6%;width:32%;height:32%;border-radius:50%;box-shadow:inset calc(var(--os) * -.55) calc(var(--os) * .2) 0 0 var(--c1);filter:drop-shadow(0 0 8px var(--c1));transform:rotate(-15deg)}
[data-f=moon] .fi::after{content:"✦";position:absolute;left:4%;top:6%;font-size:calc(var(--os) * .7);color:var(--c1);text-shadow:0 0 8px var(--c1);animation:ftw 2s infinite}

[data-f=orbit]{--c1:#ffffff;--c2:var(--red)}
[data-f=orbit] .fb{padding:calc(var(--w) * .3 * var(--fwk,1));background:color-mix(in srgb,var(--c1) 85%,transparent)}[data-f=orbit] .fu{box-shadow:0 0 10px color-mix(in srgb,var(--c1) 30%,transparent)}
[data-f=orbit] .fi{animation:frr 3.5s linear infinite}
[data-f=orbit] .fi::before,[data-f=orbit] .fi::after{content:"";position:absolute;left:50%;border-radius:50%;transform:translateX(-50%)}
[data-f=orbit] .fi::before{top:-3%;width:calc(var(--os) * .5);height:calc(var(--os) * .5);background:var(--c1);box-shadow:0 0 10px var(--c1),0 0 20px var(--c1)}
[data-f=orbit] .fi::after{bottom:-2%;width:calc(var(--os) * .32);height:calc(var(--os) * .32);background:var(--c2);box-shadow:0 0 10px var(--c2)}

/* colour picker under the frame list */
.fcpick{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:6px 0 4px}
.fcpick button{clip-path:none;width:28px;height:28px;padding:0;border-radius:50%;border:2px solid rgba(255,255,255,.18);box-shadow:none}
.fcpick button:hover{transform:scale(1.12);box-shadow:none}
.fcpick button.on{outline:2px solid var(--red);outline-offset:2px}
.fcpick .orig{background:conic-gradient(#ff1a2e,#ffb000,#2bff6a,#00c8ff,#b44bff,#ff1a2e)}
.fcpick label{position:relative;width:28px;height:28px;border-radius:50%;border:2px dashed rgba(255,255,255,.35);display:grid;place-items:center;cursor:pointer;color:var(--mut);font-size:16px}
.fcpick label input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.fcpick label.on{outline:2px solid var(--red);outline-offset:2px;border-style:solid}
.frpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px;margin:8px 0}.frpick button{clip-path:none;display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 2px 6px;font-size:10px;line-height:1.1}.frpick button.on{outline:2px solid var(--red);box-shadow:0 0 12px rgba(var(--rgb),.5)}.frpick .avatar{margin:0}
@media (prefers-reduced-motion:reduce){.frm,.frm *,.frm *::before,.frm *::after{animation:none!important}}
/* ===== avatar frames: room on the side for left/right card layouts ===== */
.card[data-cl=left]>.avatar.hasf,.card[data-cl=sl]>.avatar.hasf,.card[data-cl=bn]>.avatar.hasf,.card[data-cl=sb]>.avatar.hasf{margin-left:var(--fs,0)}
.card[data-cl=sr]>.avatar.hasf{margin-left:auto;margin-right:var(--fs,0)}
.pset.spc{border-color:#9b4dff;background:linear-gradient(160deg,rgba(155,77,255,.18),rgba(0,0,0,.2))}.pset.spc b::after{content:" ✦";color:#c08bff}

/* ===== shared: corners, width, name size, 3D depth, button styles ===== */
:is(#profile,#pr_card){border-radius:var(--crad,0)}
.card .links a{border-radius:var(--lrad,0)}
#profile:not([data-cl=sl]):not([data-cl=sr]):not([data-cl=bn]):not([data-cl=sb]){width:min(var(--cw,440px),100%)}
#pr_card:not([data-cl=sl]):not([data-cl=sr]):not([data-cl=bn]):not([data-cl=sb]){max-width:calc(var(--cw,440px) * .773)}
.stage.mob #pr_card{max-width:230px!important}
:is(#profile,#pr_card) h1{zoom:var(--nsz,1)}
:is(#profile,#pr_card)>.avatar{translate:calc(var(--px,0) * 14px) calc(var(--py,0) * 14px);transition:translate .15s ease-out}
:is(#profile,#pr_card)>h1{translate:calc(var(--px,0) * 8px) calc(var(--py,0) * 8px);transition:translate .15s ease-out}
:is(#profile,#pr_card)>.bdgs,:is(#profile,#pr_card)>.links{translate:calc(var(--px,0) * 4px) calc(var(--py,0) * 4px);transition:translate .15s ease-out}
.card .links:not(.ls-auto) a::before,.card .links:not(.ls-auto) a::after{content:none}
.card .links.ls-glass a{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);color:var(--fg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:none;clip-path:none;font-family:inherit;text-transform:none;letter-spacing:normal}
.card .links.ls-glass a:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.35);color:#fff;box-shadow:none}
.card .links.ls-solid a{background:var(--red);border:1px solid var(--red);color:#fff;box-shadow:0 6px 20px rgba(var(--rgb),.35);clip-path:none}
.card .links.ls-solid a:hover{filter:brightness(1.15);color:#fff;background:var(--red)}
.card .links.ls-outline a{background:transparent;border:1.5px solid var(--red);color:var(--fg);box-shadow:none;clip-path:none}
.card .links.ls-outline a:hover{background:var(--red);color:#fff}
.card .links.ls-minimal a{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.14);border-radius:0;box-shadow:none;color:var(--fg);clip-path:none}
.card .links.ls-minimal a:hover{background:transparent;color:var(--red);border-bottom-color:var(--red);box-shadow:none;transform:none}

/* ===== SKIN: terminal (CRT lines + corner brackets) ===== */
:is(#profile,#pr_card)[data-skin=terminal]::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);opacity:.45}
:is(#profile,#pr_card)[data-skin=terminal]::before{content:"";position:absolute;inset:7px;pointer-events:none;border-radius:inherit;opacity:.9;background:
 linear-gradient(var(--red),var(--red)) top left/16px 2px no-repeat,linear-gradient(var(--red),var(--red)) top left/2px 16px no-repeat,
 linear-gradient(var(--red),var(--red)) top right/16px 2px no-repeat,linear-gradient(var(--red),var(--red)) top right/2px 16px no-repeat,
 linear-gradient(var(--red),var(--red)) bottom left/16px 2px no-repeat,linear-gradient(var(--red),var(--red)) bottom left/2px 16px no-repeat,
 linear-gradient(var(--red),var(--red)) bottom right/16px 2px no-repeat,linear-gradient(var(--red),var(--red)) bottom right/2px 16px no-repeat}

/* ===== SKIN: sleek (modern glass) ===== */
:is(#profile,#pr_card)[data-skin=sleek]{border-radius:var(--crad,24px);border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 40%),rgba(12,12,16,var(--cop,.5));padding:30px 24px 22px;font-family:"Inter","Segoe UI",system-ui,sans-serif;box-shadow:0 24px 70px rgba(0,0,0,.55)}
:is(#profile,#pr_card)[data-skin=sleek]::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:conic-gradient(from var(--ang),transparent 0 55%,rgba(var(--rgb),.85) 75%,rgba(255,255,255,.5) 80%,transparent 90%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:angr 7s linear infinite}
[data-skin=sleek] .glare{background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.08),transparent 50%)}
[data-skin=sleek] h1{color:#fff;font-weight:800;letter-spacing:-.3px;font-size:30px;text-shadow:0 0 24px rgba(var(--rgb),.5);margin:6px 0 8px}
[data-skin=sleek] h1.nf-none{background:linear-gradient(180deg,#fff 35%,rgb(var(--lt)));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 16px rgba(var(--rgb),.45))}
[data-skin=sleek] .avatar{border:3px solid rgba(var(--rgb),.85);box-shadow:0 0 0 6px rgba(var(--rgb),.12),0 12px 44px rgba(var(--rgb),.45)}
[data-skin=sleek] .avatar.hasf{border:0;box-shadow:none}
[data-skin=sleek] :is(#p_bio,#pr_bio){color:rgba(255,255,255,.7);font-size:14.5px;line-height:1.5}
[data-skin=sleek] :is(#p_bio,#pr_bio)::before{content:none}
[data-skin=sleek] :is(#p_bio,#pr_bio)::after{content:"";display:inline-block;width:2px;height:1em;margin-left:3px;vertical-align:-.15em;background:var(--red);animation:bl 1s steps(2) infinite}
[data-skin=sleek] .links{gap:10px}
[data-skin=sleek] .links a{border-radius:var(--lrad,14px);border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045);color:#fff;font-weight:600;padding:12px 14px;transition:transform .18s,background .18s,border-color .18s,box-shadow .18s}
[data-skin=sleek] .links:not(.icon) a{justify-content:flex-start}
[data-skin=sleek] .links:not(.icon):not(.text) a .ic{display:grid;place-items:center;width:32px;height:32px;border-radius:calc(var(--lrad,14px) * .7);background:rgba(var(--rgb),.18);color:rgb(var(--lt));flex:none}
[data-skin=sleek] .links:not(.icon):not(.text) a .ic svg{width:17px;height:17px}
[data-skin=sleek] .links.ls-auto:not(.icon) a::after{content:"↗";margin-left:auto;opacity:.35;transition:opacity .18s,transform .18s}
[data-skin=sleek] .links.ls-auto:not(.icon) a::before{content:none}
[data-skin=sleek] .links.ls-auto:not(.icon) a:hover::after{opacity:1;transform:translate(2px,-2px)}
[data-skin=sleek] .links.text a{justify-content:center}
[data-skin=sleek] .links a:hover{transform:translateY(-2px);background:rgba(var(--rgb),.16);border-color:rgba(var(--rgb),.6);color:#fff;box-shadow:0 8px 26px rgba(var(--rgb),.3)}
[data-skin=sleek] .links.icon a{border-radius:50%;width:48px;height:48px;justify-content:center}
[data-skin=sleek] .bdg{border-radius:99px;border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.06);padding:3px 10px;font-size:11.5px}
[data-skin=sleek] .bdg b{color:rgb(var(--lt))}
[data-skin=sleek] .dcard{border-radius:var(--lrad,14px);border-color:rgba(255,255,255,.08);background:rgba(255,255,255,.04)}
[data-skin=sleek] .embed iframe{border-radius:var(--lrad,14px)}
[data-skin=sleek] .meta{justify-content:center;gap:8px;color:rgba(255,255,255,.6)}
[data-skin=sleek] .meta>span:not(:empty):not([hidden]){padding:4px 11px;border-radius:99px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
[data-skin=sleek] .meta b{color:#fff}
[data-skin=sleek] .tzt{color:#fff;text-shadow:none;font-weight:700}
[data-skin=sleek] .acts button{clip-path:none;border-radius:99px;border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#fff}
[data-skin=sleek] .acts button:hover,[data-skin=sleek] .acts button.on{background:var(--red);border-color:var(--red);color:#fff;box-shadow:none}
[data-skin=sleek] .rep{font-family:inherit}
body[data-skin=sleek] .wrap::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at center,transparent 25%,rgba(0,0,0,.7))}
body[data-skin=sleek] #enter{font-family:"Inter",system-ui,sans-serif;color:#fff;text-shadow:none;font-size:14px;letter-spacing:.35em;text-transform:uppercase;animation:skfade 2.4s ease-in-out infinite}
body[data-skin=sleek] #enter::after{background:radial-gradient(circle at 50% 45%,rgba(var(--rgb),.18),transparent 60%)}
body[data-skin=sleek] #enter::before{filter:drop-shadow(0 0 24px rgba(var(--rgb),.6))}
@keyframes skfade{50%{opacity:.55}}

/* ===== SKIN: spectre (special ghost theme) ===== */
:is(#profile,#pr_card)[data-skin=spectre]{--ecto:rgb(var(--lt));border-radius:var(--crad,28px);border:1px solid rgba(var(--rgb),.45);padding:34px 24px 24px;font-family:"Inter",system-ui,sans-serif;
 background:radial-gradient(120% 70% at 50% 0,rgba(var(--rgb),.32),transparent 60%),radial-gradient(90% 60% at 50% 110%,rgba(var(--rgb),.22),transparent 70%),rgba(14,6,26,var(--cop,.62));
 box-shadow:0 0 50px rgba(var(--rgb),.35),inset 0 0 40px rgba(var(--rgb),.18),0 30px 80px rgba(0,0,0,.6)}
[data-skin=spectre].card::before{content:"";position:absolute;left:0;right:0;top:0;height:46px;pointer-events:none;z-index:0;opacity:.85;
 background:radial-gradient(9px 22px at 12% 0,var(--ecto) 90%,transparent),radial-gradient(7px 30px at 27% 0,var(--ecto) 90%,transparent),radial-gradient(11px 16px at 41% 0,var(--ecto) 90%,transparent),radial-gradient(6px 36px at 58% 0,var(--ecto) 90%,transparent),radial-gradient(10px 20px at 73% 0,var(--ecto) 90%,transparent),radial-gradient(7px 28px at 88% 0,var(--ecto) 90%,transparent),linear-gradient(var(--ecto),var(--ecto)) top/100% 5px no-repeat;
 filter:drop-shadow(0 0 8px rgba(var(--rgb),.9));animation:spdrip 5s ease-in-out infinite;transform-origin:top}
[data-skin=spectre] .glare{background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(var(--lt),.18),transparent 55%)}
[data-skin=spectre] h1{font-family:"Creepster","Inter",cursive;font-weight:400;font-size:42px;letter-spacing:3px;color:#f1e6ff;text-shadow:0 0 12px rgba(var(--rgb),.9),0 0 34px rgba(var(--rgb),.7)}
#pr_card[data-skin=spectre] h1{font-size:34px}
[data-skin=spectre] .avatar{border:2px solid rgba(var(--lt),.7);box-shadow:0 0 30px rgba(var(--rgb),.8),0 0 70px rgba(var(--rgb),.4);animation:spfloat 4.5s ease-in-out infinite}
[data-skin=spectre] .avatar.hasf{border:0}
[data-skin=spectre] :is(#p_bio,#pr_bio){color:rgba(var(--lt),.95);font-style:italic}
[data-skin=spectre] :is(#p_bio,#pr_bio)::before{content:"☾ ";color:var(--red);font-style:normal}
[data-skin=spectre] :is(#p_bio,#pr_bio)::after{content:"";display:inline-block;width:2px;height:1em;margin-left:3px;vertical-align:-.15em;background:rgb(var(--lt));animation:bl 1s steps(2) infinite}
[data-skin=spectre] .links{gap:11px}
[data-skin=spectre] .links a{border-radius:var(--lrad,16px);border:1px solid rgba(var(--rgb),.5);color:#f1e6ff;background:linear-gradient(135deg,rgba(var(--rgb),.22),rgba(20,6,36,.55));box-shadow:inset 0 0 14px rgba(var(--rgb),.25);transition:background .2s,box-shadow .2s,border-color .2s}
[data-skin=spectre] .links a::before,[data-skin=spectre] .links a::after{content:none}
[data-skin=spectre] .links a:hover{background:linear-gradient(135deg,rgba(var(--rgb),.55),rgba(var(--rgb),.25));border-color:rgb(var(--lt));color:#fff;box-shadow:0 0 24px rgba(var(--rgb),.8),inset 0 0 18px rgba(var(--lt),.3);animation:spwob .5s ease-in-out}
[data-skin=spectre] .links.icon a{border-radius:50%;width:50px;height:50px}
[data-skin=spectre] .bdg{border-radius:99px;border-color:rgba(var(--rgb),.6);background:rgba(var(--rgb),.18);color:#f1e6ff}
[data-skin=spectre] .bdg b{color:rgb(var(--lt))}
[data-skin=spectre] .dcard{border-radius:16px;border-color:rgba(var(--rgb),.45);background:rgba(var(--rgb),.12)}
[data-skin=spectre] .embed iframe{border-radius:16px}
[data-skin=spectre] .meta{justify-content:center;gap:6px 16px;color:rgba(var(--lt),.75)}
[data-skin=spectre] .tzt{color:#f1e6ff}
[data-skin=spectre] .acts button{clip-path:none;border-radius:99px;border-color:rgba(var(--rgb),.6);background:rgba(var(--rgb),.15);color:#f1e6ff}
[data-skin=spectre] .acts button:hover,[data-skin=spectre] .acts button.on{background:var(--red);color:#fff;box-shadow:0 0 18px var(--red)}
body[data-skin=spectre] #enter{background:radial-gradient(circle at 50% 55%,rgba(var(--rgb),.35),var(--bg) 70%);font-family:"Creepster",cursive;font-size:30px;letter-spacing:.12em;color:#f1e6ff;text-shadow:0 0 14px var(--red),0 0 40px var(--red);animation:sphaunt 3.2s infinite}
body[data-skin=spectre] #enter::after{background:radial-gradient(circle at 30% 70%,rgba(var(--rgb),.25),transparent 40%),radial-gradient(circle at 75% 30%,rgba(var(--rgb),.2),transparent 45%);animation:spmist 9s ease-in-out infinite alternate}
body[data-skin=spectre] #enter::before{animation:spfloat 3.5s ease-in-out infinite;filter:drop-shadow(0 0 22px var(--red)) hue-rotate(0deg)}
.nf-haunt{animation:sphaunt 4s infinite}
@keyframes sphaunt{0%,100%{opacity:1;filter:none;transform:none}8%{opacity:.35;filter:blur(1.5px)}10%{opacity:1;filter:none}47%{transform:translateX(0)}48%{transform:translateX(-3px) skewX(-6deg);text-shadow:-3px 0 rgba(var(--lt),.9),3px 0 var(--red)}50%{transform:translateX(2px) skewX(4deg)}52%{transform:none}70%{opacity:.6}72%{opacity:1}}
@keyframes spfloat{50%{transform:translateY(-7px)}}
@keyframes spdrip{50%{transform:scaleY(1.25)}}
@keyframes spwob{25%{transform:translateX(-3px) rotate(-1deg)}50%{transform:translateX(3px) rotate(1deg)}75%{transform:translateX(-2px)}}
@keyframes spmist{to{transform:translate(4%,-3%) scale(1.08)}}
/* ===== SKIN: retro (vaporwave) ===== */
:is(#profile,#pr_card)[data-skin=retro]{border-radius:var(--crad,14px);border:0;padding:30px 24px 22px;font-family:"Inter",system-ui,sans-serif;background:radial-gradient(circle at 50% 0,rgba(var(--rgb),.35),transparent 55%),linear-gradient(180deg,rgba(38,8,58,var(--cop,.85)),rgba(8,10,40,var(--cop,.85)))}
:is(#profile,#pr_card)[data-skin=retro]::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;pointer-events:none;background:linear-gradient(135deg,var(--red),#01cdfe 50%,var(--red));background-size:200% 200%;animation:rtshift 6s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
:is(#profile,#pr_card)[data-skin=retro]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:38%;pointer-events:none;border-radius:inherit;opacity:.35;background:linear-gradient(transparent,rgba(1,205,254,.25)),repeating-linear-gradient(90deg,rgba(1,205,254,.35) 0 1px,transparent 1px 30px),repeating-linear-gradient(0deg,rgba(1,205,254,.35) 0 1px,transparent 1px 22px);-webkit-mask:linear-gradient(transparent,#000);mask:linear-gradient(transparent,#000)}
[data-skin=retro] h1{font-weight:800;font-style:italic;font-size:34px;letter-spacing:1px;font-family:"Inter",sans-serif}
[data-skin=retro] h1.nf-none{background:linear-gradient(180deg,#fff 0,#ffe3f6 40%,var(--red) 52%,#5a1a7a 56%,#01cdfe 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 3px 0 rgba(1,205,254,.6)) drop-shadow(0 0 14px rgba(var(--rgb),.6))}
[data-skin=retro] .avatar{border:3px solid #01cdfe;box-shadow:0 0 0 4px var(--red),0 0 34px rgba(var(--rgb),.7)}
[data-skin=retro] .avatar.hasf{border:0;box-shadow:none}
[data-skin=retro] :is(#p_bio,#pr_bio){color:#e6f7ff}
[data-skin=retro] :is(#p_bio,#pr_bio)::before{content:"✧ ";color:#01cdfe}
[data-skin=retro] :is(#p_bio,#pr_bio)::after{content:"▌";color:var(--red)}
[data-skin=retro] .links a{border-radius:var(--lrad,10px);border:1px solid rgba(1,205,254,.55);background:rgba(var(--rgb),.1);color:#fff;font-weight:600;letter-spacing:.5px}
[data-skin=retro] .links a::before,[data-skin=retro] .links a::after{content:none}
[data-skin=retro] .links a:hover{background:linear-gradient(90deg,var(--red),#01cdfe);border-color:transparent;color:#1a0026;box-shadow:0 0 22px rgba(var(--rgb),.6)}
[data-skin=retro] .links.icon a{border-radius:50%;width:50px;height:50px}
[data-skin=retro] .bdg{border-radius:6px;border-color:rgba(1,205,254,.5);background:rgba(var(--rgb),.15)}
[data-skin=retro] .bdg b{color:#01cdfe}
[data-skin=retro] .dcard{border-radius:var(--lrad,10px);border-color:rgba(1,205,254,.4)}
[data-skin=retro] .meta{justify-content:center;gap:6px 16px;color:#b9e9ff}
[data-skin=retro] .acts button{clip-path:none;border-radius:var(--lrad,10px);border-color:#01cdfe;color:#e6f7ff}
[data-skin=retro] .acts button:hover{background:linear-gradient(90deg,var(--red),#01cdfe);color:#1a0026}
body[data-skin=retro] #enter{font-family:"Inter",sans-serif;font-style:italic;font-weight:800;font-size:22px;letter-spacing:.15em;text-transform:uppercase;color:#fff;text-shadow:3px 3px 0 #01cdfe,0 0 26px var(--red)}
@keyframes rtshift{to{background-position:200% 200%}}

/* ===== SKIN: hud (cyberpunk) ===== */
:is(#profile,#pr_card)[data-skin=hud]{border-radius:0;border:2px solid transparent;padding:30px 24px 22px;font-family:"Orbitron","Segoe UI",sans-serif;clip-path:polygon(22px 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%,0 22px);
 background:linear-gradient(rgba(12,12,4,var(--cop,.88)),rgba(12,12,4,var(--cop,.88))) padding-box,linear-gradient(135deg,var(--red),rgba(var(--rgb),.15) 35%,rgba(var(--rgb),.15) 65%,var(--red)) border-box}
:is(#profile,#pr_card)[data-skin=hud]::before{content:"● SYS.ONLINE";position:absolute;top:8px;right:14px;font:700 9px "Orbitron",sans-serif;letter-spacing:2px;color:var(--red);opacity:.75;text-transform:uppercase;pointer-events:none}
:is(#profile,#pr_card)[data-skin=hud]::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 4px);opacity:.5}
[data-skin=hud] .glare{background:linear-gradient(transparent,rgba(var(--rgb),.14) 50%,transparent) 0 -90px/100% 90px no-repeat;animation:hudscan 3.5s linear infinite}
[data-skin=hud] h1{font-family:"Orbitron",sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:4px;font-size:26px;color:var(--red);text-shadow:0 0 12px rgba(var(--rgb),.7)}
[data-skin=hud] .avatar{border:2px solid var(--red);box-shadow:0 0 0 5px rgba(var(--rgb),.15),0 0 26px rgba(var(--rgb),.5)}
[data-skin=hud] .avatar.hasf{border:0;box-shadow:none}
[data-skin=hud] :is(#p_bio,#pr_bio){font-family:"Courier New",monospace;color:var(--fg)}
[data-skin=hud] :is(#p_bio,#pr_bio)::before{content:">> ";color:var(--red)}
[data-skin=hud] .links a{clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);border:0;border-left:4px solid var(--red);border-radius:0;background:rgba(var(--rgb),.08);color:var(--fg);font:700 12px "Orbitron",sans-serif;letter-spacing:2px;text-transform:uppercase;padding:14px}
[data-skin=hud] .links a::before,[data-skin=hud] .links a::after{content:none}
[data-skin=hud] .links a:hover{background:var(--red);color:#0b0b00;box-shadow:0 0 22px rgba(var(--rgb),.6)}
[data-skin=hud] .links.icon a{width:52px;height:52px;padding:0}
[data-skin=hud] .bdg{border-radius:0;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);font-family:"Orbitron",sans-serif;font-size:10px;letter-spacing:1px;text-transform:uppercase}
[data-skin=hud] .meta{font-family:"Orbitron",sans-serif;font-size:10px;letter-spacing:2px;text-transform:uppercase}
[data-skin=hud] .acts button{font-family:"Orbitron",sans-serif;font-size:11px;letter-spacing:2px;text-transform:uppercase}
body[data-skin=hud] #enter{font-family:"Orbitron",sans-serif;font-weight:700;letter-spacing:.3em;text-transform:uppercase;font-size:16px}
@keyframes hudscan{to{background-position:0 calc(100% + 90px)}}

/* ===== SKIN: luxe (gold) ===== */
:is(#profile,#pr_card)[data-skin=luxe]{border-radius:var(--crad,6px);border:1px solid rgba(var(--rgb),.65);padding:34px 28px 28px;background:radial-gradient(circle at 50% 0,rgba(var(--rgb),.16),transparent 60%),rgba(16,11,4,var(--cop,.88))}
:is(#profile,#pr_card)[data-skin=luxe]::before{content:"";position:absolute;inset:8px;border:1px solid rgba(var(--rgb),.35);border-radius:calc(var(--crad,6px) * .6);pointer-events:none}
:is(#profile,#pr_card)[data-skin=luxe]::after{content:"✦";position:absolute;left:50%;bottom:12px;transform:translateX(-50%);color:var(--red);font-size:12px;letter-spacing:10px;opacity:.8;pointer-events:none}
[data-skin=luxe] h1{font-family:"Playfair Display",Georgia,serif;font-weight:700;font-style:italic;font-size:36px;letter-spacing:.5px}
[data-skin=luxe] h1.nf-none{background:linear-gradient(180deg,#fff6d6 0,rgb(var(--lt)) 40%,var(--red) 62%,#7a4f00 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
[data-skin=luxe] .avatar{border:2px solid var(--red);box-shadow:0 0 0 5px rgba(16,11,4,1),0 0 0 6px rgba(var(--rgb),.55),0 0 34px rgba(var(--rgb),.35)}
[data-skin=luxe] .avatar.hasf{border:0;box-shadow:none}
[data-skin=luxe] .bdgs{border-top:1px solid rgba(var(--rgb),.3);padding-top:12px;margin-top:12px}
[data-skin=luxe] .bdg{border-radius:2px;border-color:rgba(var(--rgb),.45);background:transparent;font-family:"Playfair Display",serif;font-style:italic}
[data-skin=luxe] :is(#p_bio,#pr_bio){font-family:"Playfair Display",Georgia,serif;font-style:italic;color:rgba(var(--lt),.95)}
[data-skin=luxe] :is(#p_bio,#pr_bio)::before{content:"— ";color:var(--red)}
[data-skin=luxe] :is(#p_bio,#pr_bio)::after{content:" —";color:var(--red)}
[data-skin=luxe] .links a{border-radius:var(--lrad,2px);border:1px solid rgba(var(--rgb),.5);background:transparent;color:rgb(var(--lt));text-transform:uppercase;letter-spacing:.22em;font-size:12px;padding:14px;font-family:"Inter",sans-serif;font-weight:600}
[data-skin=luxe] .links a::before,[data-skin=luxe] .links a::after{content:none}
[data-skin=luxe] .links a:hover{background:var(--red);color:#1a1206;border-color:var(--red);box-shadow:0 0 22px rgba(var(--rgb),.45)}
[data-skin=luxe] .links.icon a{width:50px;height:50px;padding:0;border-radius:50%}
[data-skin=luxe] .meta{justify-content:center;gap:6px 18px;font-family:"Playfair Display",serif;font-style:italic;padding-bottom:16px}
[data-skin=luxe] .acts button{clip-path:none;border-radius:2px;letter-spacing:.15em;text-transform:uppercase;font-size:11px}
body[data-skin=luxe] #enter{font-family:"Playfair Display",serif;font-style:italic;font-size:26px;letter-spacing:.08em;text-shadow:0 0 20px var(--red)}

/* ===== SKIN: bubbly (cartoon) ===== */
:is(#profile,#pr_card)[data-skin=bubbly]{border-radius:var(--crad,26px);border:3px solid #0d0410;padding:30px 24px 24px;font-family:"Baloo 2","Trebuchet MS",sans-serif;background:radial-gradient(circle,rgba(255,255,255,.07) 2px,transparent 2.5px) 0 0/20px 20px,linear-gradient(160deg,rgba(var(--rgb),.35),rgba(30,8,40,var(--cop,.9)) 55%);box-shadow:8px 8px 0 #0d0410,0 0 0 3px rgba(var(--rgb),.6)!important}
[data-skin=bubbly] h1{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:40px;color:#fff;letter-spacing:0;text-shadow:3px 3px 0 var(--red),6px 6px 0 #0d0410;transform-origin:center bottom}
[data-skin=bubbly] h1.nf-none:hover{animation:bbjelly .6s}
[data-skin=bubbly] .avatar{border:3px solid #0d0410;box-shadow:6px 6px 0 var(--red)}
[data-skin=bubbly] .avatar.hasf{border:0;box-shadow:none}
[data-skin=bubbly] :is(#p_bio,#pr_bio){font-weight:600;font-size:16px}
[data-skin=bubbly] :is(#p_bio,#pr_bio)::before{content:"💬 "}
[data-skin=bubbly] :is(#p_bio,#pr_bio)::after{content:none}
[data-skin=bubbly] .links{gap:12px}
[data-skin=bubbly] .links a{border-radius:var(--lrad,16px);border:3px solid #0d0410;background:var(--red);color:#fff;font:800 17px "Baloo 2",sans-serif;box-shadow:0 5px 0 #0d0410;transition:transform .1s,box-shadow .1s;text-shadow:1px 1px 0 rgba(0,0,0,.35)}
[data-skin=bubbly] .links a::before,[data-skin=bubbly] .links a::after{content:none}
[data-skin=bubbly] .links a:hover{transform:translateY(-3px) rotate(-1deg);box-shadow:0 8px 0 #0d0410;background:var(--red);color:#fff}
[data-skin=bubbly] .links a:active{transform:translateY(3px);box-shadow:0 2px 0 #0d0410}
[data-skin=bubbly] .links.icon a{width:54px;height:54px;border-radius:50%}
[data-skin=bubbly] .bdg{border:2px solid #0d0410;border-radius:99px;background:#fff;color:#1a0a1f;font-weight:700;box-shadow:2px 2px 0 #0d0410}
[data-skin=bubbly] .bdg:nth-child(odd){transform:rotate(-3deg)}[data-skin=bubbly] .bdg:nth-child(even){transform:rotate(2deg)}
[data-skin=bubbly] .bdg b{color:var(--red)}
[data-skin=bubbly] .dcard{border:3px solid #0d0410;border-radius:var(--lrad,16px);box-shadow:4px 4px 0 #0d0410}
[data-skin=bubbly] .meta{justify-content:center;gap:6px 16px;font-weight:700}
[data-skin=bubbly] .acts button{clip-path:none;border:3px solid #0d0410;border-radius:99px;font-weight:800;box-shadow:0 4px 0 #0d0410}
body[data-skin=bubbly] #enter{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:28px;color:#fff;text-shadow:3px 3px 0 var(--red),5px 5px 0 #000;animation:bbbounce 1.2s ease-in-out infinite}
@keyframes bbjelly{25%{transform:scale(1.12,.88)}50%{transform:scale(.92,1.08)}75%{transform:scale(1.04,.96)}}
@keyframes bbbounce{50%{transform:translateY(-8px)}}

/* ===== SKIN: soft (pastel) ===== */
:is(#profile,#pr_card)[data-skin=soft]{border-radius:var(--crad,30px);border:1px solid rgba(255,255,255,.28);padding:30px 24px 24px;font-family:"Baloo 2","Trebuchet MS",sans-serif;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 50%),rgba(60,22,44,var(--cop,.6));box-shadow:0 20px 60px rgba(var(--rgb),.25)}
[data-skin=soft] .glare{background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.18),transparent 55%)}
[data-skin=soft] h1{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:36px;color:#fff;letter-spacing:0;text-shadow:0 0 20px rgba(var(--rgb),.85),0 2px 0 rgba(var(--rgb),.6)}
[data-skin=soft] h1::before,[data-skin=soft] h1:not(.nf-typewriter)::after{content:"✿";font-size:.55em;vertical-align:.25em;margin:0 8px;color:rgb(var(--lt));-webkit-text-fill-color:rgb(var(--lt))}
[data-skin=soft] .avatar{border:4px solid rgba(255,255,255,.85);box-shadow:0 0 0 8px rgba(var(--rgb),.2),0 10px 40px rgba(var(--rgb),.5);animation:spfloat 5s ease-in-out infinite}
[data-skin=soft] .avatar.hasf{border:0;box-shadow:none}
[data-skin=soft] :is(#p_bio,#pr_bio){color:#fff;font-weight:600}
[data-skin=soft] :is(#p_bio,#pr_bio)::before{content:"❀ ";color:rgb(var(--lt))}
[data-skin=soft] :is(#p_bio,#pr_bio)::after{content:"";display:inline-block;width:2px;height:1em;margin-left:3px;vertical-align:-.15em;background:rgb(var(--lt));animation:bl 1s steps(2) infinite}
[data-skin=soft] .links{gap:10px}
[data-skin=soft] .links a{border-radius:var(--lrad,99px);border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.13);color:#fff;font:700 15px "Baloo 2",sans-serif;transition:transform .2s,background .2s,box-shadow .2s}
[data-skin=soft] .links a::before,[data-skin=soft] .links a::after{content:none}
[data-skin=soft] .links a:hover{transform:scale(1.03);background:rgba(var(--rgb),.5);color:#fff;box-shadow:0 8px 24px rgba(var(--rgb),.45)}
[data-skin=soft] .links.icon a{width:50px;height:50px}
[data-skin=soft] .bdg{border-radius:99px;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.12);font-weight:700}
[data-skin=soft] .bdg b{color:rgb(var(--lt))}
[data-skin=soft] .dcard{border-radius:var(--lrad,20px);border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.1)}
[data-skin=soft] .embed iframe{border-radius:var(--lrad,20px)}
[data-skin=soft] .meta{justify-content:center;gap:6px 16px;color:rgba(255,255,255,.75);font-weight:600}
[data-skin=soft] .acts button{clip-path:none;border-radius:99px;border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:#fff;font-weight:700}
[data-skin=soft] .acts button:hover{background:var(--red);color:#fff}
body[data-skin=soft] #enter{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:24px;color:#fff;text-shadow:0 0 20px var(--red)}

/* ===== SKIN: hazard (toxic) ===== */
:is(#profile,#pr_card)[data-skin=hazard]{border-radius:var(--crad,8px);border:2px solid var(--red);padding:34px 24px 34px;background:radial-gradient(circle at 50% 30%,rgba(var(--rgb),.14),transparent 60%),rgba(4,14,4,var(--cop,.9))}
:is(#profile,#pr_card)[data-skin=hazard]::before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;border-radius:inherit;background:repeating-linear-gradient(45deg,var(--red) 0 12px,#0b0b0b 12px 24px) top/100% 10px no-repeat,repeating-linear-gradient(45deg,var(--red) 0 12px,#0b0b0b 12px 24px) bottom/100% 10px no-repeat;opacity:.9}
:is(#profile,#pr_card)[data-skin=hazard]::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 50px rgba(var(--rgb),.35);animation:hzpulse 2.6s ease-in-out infinite}
[data-skin=hazard] h1{font-family:"Courier New",monospace;font-weight:800;text-transform:uppercase;letter-spacing:3px;color:var(--red);text-shadow:0 0 10px var(--red),0 0 30px rgba(var(--rgb),.6)}
[data-skin=hazard] h1::before{content:"☢ ";-webkit-text-fill-color:var(--red)}
[data-skin=hazard] .avatar{border:3px dashed var(--red);box-shadow:0 0 30px rgba(var(--rgb),.6);animation:hzspin 18s linear infinite}
[data-skin=hazard] .avatar img{animation:hzspin 18s linear infinite reverse}
[data-skin=hazard] .avatar.hasf,[data-skin=hazard] .avatar.hasf img{border:0;animation:none}
[data-skin=hazard] :is(#p_bio,#pr_bio)::before{content:"☣ ";color:var(--red)}
[data-skin=hazard] .links a{border-radius:var(--lrad,4px);border:1px dashed rgba(var(--rgb),.7);background:rgba(var(--rgb),.07);color:rgb(var(--lt));text-transform:uppercase;letter-spacing:2px;font-size:13px}
[data-skin=hazard] .links a::before{content:"[ ";color:var(--red)}[data-skin=hazard] .links:not(.icon) a::after{content:" ]";color:var(--red)}[data-skin=hazard] .links.icon a::before{content:none}
[data-skin=hazard] .links a:hover{background:var(--red);color:#031003;border-style:solid;box-shadow:0 0 26px var(--red);animation:hzflick .3s steps(2) 2}
[data-skin=hazard] .bdg{border-style:dashed;border-radius:3px}
[data-skin=hazard] .meta{justify-content:center;gap:6px 16px;text-transform:uppercase;letter-spacing:2px}
body[data-skin=hazard] #enter{text-transform:uppercase;letter-spacing:.25em}
@keyframes hzpulse{50%{box-shadow:inset 0 0 90px rgba(var(--rgb),.6)}}
@keyframes hzspin{to{rotate:360deg}}
@keyframes hzflick{50%{opacity:.6}}

/* ===== name effects on every card style ===== */
/* plain colour per style when an effect is on (so effects never fight the style's own name look) */
[data-skin=retro] h1:not(.nf-none){color:#fff;text-shadow:3px 3px 0 #01cdfe,0 0 18px rgba(var(--rgb),.7)}
[data-skin=luxe] h1:not(.nf-none){color:rgb(var(--lt));text-shadow:0 0 14px rgba(var(--rgb),.5)}
[data-skin=sleek] h1:not(.nf-none){color:#fff}
/* glitch: RGB split + jitter, tinted by the style */
:is(#profile,#pr_card) h1.nf-glitch{animation:gl2 3.2s infinite}
@keyframes gl2{0%,86%,100%{transform:none;clip-path:none}87%{transform:translateX(-3px);text-shadow:3px 0 #0ff,-3px 0 var(--red);clip-path:inset(10% 0 45% 0)}89%{transform:translateX(3px);text-shadow:-3px 0 #0ff,3px 0 var(--red);clip-path:inset(55% 0 5% 0)}91%{transform:translateX(-1px);clip-path:none}93%{transform:translateX(2px) skewX(-8deg);text-shadow:2px 0 rgb(var(--lt)),-2px 0 var(--red)}95%{transform:none}}
/* neon: works on every style, keeps the style's font */
:is(#profile,#pr_card) h1.nf-neon{color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important;filter:none!important;text-shadow:0 0 4px #fff,0 0 12px var(--red),0 0 28px var(--red),0 0 52px var(--red)!important;animation:nn 3s infinite}
/* rainbow */
:is(#profile,#pr_card) h1.nf-rainbow{background:linear-gradient(90deg,#ff1a2e,#ff9d00,#ffe600,#2bff5a,#00c8ff,#a23bff,#ff1a2e)!important;background-size:7em 100%!important;background-repeat:repeat-x!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;text-shadow:none!important;filter:drop-shadow(0 0 10px rgba(255,255,255,.25))!important;animation:rb2 3s linear infinite}
@keyframes rb2{to{background-position:7em 0}}
/* haunted */
:is(#profile,#pr_card) h1.nf-haunt{animation:sphaunt 4s infinite}
/* typewriter: blinking caret in the style's colour */
:is(#profile,#pr_card) h1.nf-typewriter::after{content:"|";margin-left:2px;color:var(--red);-webkit-text-fill-color:var(--red);font-weight:400;animation:bl 1s steps(2) infinite}
[data-skin=sleek] h1.nf-typewriter::after,[data-skin=soft] h1.nf-typewriter::after{color:rgb(var(--lt));-webkit-text-fill-color:rgb(var(--lt))}
/* new effects */
:is(#profile,#pr_card) h1.nf-wave span{display:inline-block;animation:nfwave 1.6s ease-in-out infinite;animation-delay:calc(var(--i) * 70ms)}
@keyframes nfwave{0%,60%,100%{transform:none}30%{transform:translateY(-7px)}}
:is(#profile,#pr_card) h1.nf-shine{background-image:linear-gradient(105deg,rgba(255,255,255,0) 35%,#fff 50%,rgba(255,255,255,0) 65%),linear-gradient(90deg,var(--red),rgb(var(--lt)),var(--red));background-size:9em 100%,100% 100%;background-repeat:repeat-x,no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 12px rgba(var(--rgb),.55));animation:nfshine 2.4s linear infinite}
@keyframes nfshine{from{background-position:0 0,0 0}to{background-position:9em 0,0 0}}
:is(#profile,#pr_card) h1.nf-flicker{animation:nfflick 5s infinite}
@keyframes nfflick{0%,19%,21%,23%,55%,57%,100%{opacity:1;text-shadow:0 0 14px var(--red)}20%,22%,56%{opacity:.25;text-shadow:none}}
@media (prefers-reduced-motion:reduce){:is(#profile,#pr_card) h1,:is(#profile,#pr_card) h1 span{animation:none!important}}

/* ===== sound button, styled per card style ===== */
.sndw .eq{display:none;align-items:flex-end;gap:2px;height:14px;width:16px}
.sndw .eq i{flex:1;height:30%;background:currentColor;border-radius:1px}
.sndw.on .eq i{animation:eqb .9s ease-in-out infinite}
.sndw .eq i:nth-child(2){animation-delay:-.3s!important}.sndw .eq i:nth-child(3){animation-delay:-.6s!important}.sndw .eq i:nth-child(4){animation-delay:-.15s!important}
@keyframes eqb{0%,100%{height:25%}50%{height:100%}}
.sndw button svg{width:16px;height:16px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sndw button svg path:first-child{fill:currentColor}
/* terminal */
[data-skin=terminal] .sndw{border-radius:0;gap:10px;padding:5px 10px 5px 6px;font-family:"Courier New",monospace;color:var(--red)}
[data-skin=terminal] .sndw button{font:700 13px "Courier New",monospace;padding:3px 6px;background:transparent}
[data-skin=terminal] .sndw .eq{display:flex}[data-skin=terminal] .sndw .eq i{border-radius:0}
[data-skin=terminal] .sndw::after{content:"VOL";font-size:10px;letter-spacing:2px;opacity:.7}
/* shared modern look (sleek, spectre, soft, retro) */
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro]) .sndw{border-radius:99px!important;padding:5px 14px 5px 5px;gap:10px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro]) .sndw button{width:32px;height:32px;padding:0;display:grid;place-items:center;border-radius:50%!important;border:0;color:#fff}
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro],[data-skin=luxe],[data-skin=bubbly],[data-skin=hazard]) .sndw .eq{display:flex}
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro],[data-skin=luxe],[data-skin=bubbly]) .sndw input[type=range]{width:80px;height:16px}
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro],[data-skin=luxe],[data-skin=bubbly]) .sndw input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;box-shadow:none}
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro],[data-skin=luxe],[data-skin=bubbly]) .sndw input[type=range]::-webkit-slider-thumb{width:12px;height:12px;margin-top:-4px;border-radius:50%;transform:none;border:0;background:#fff;box-shadow:0 0 0 3px rgba(var(--rgb),.35)}
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro],[data-skin=luxe],[data-skin=bubbly]) .sndw input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;transform:none;border:0;background:#fff}
:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro],[data-skin=luxe],[data-skin=bubbly]) .sndw input[type=range]::-moz-range-track,:is([data-skin=sleek],[data-skin=spectre],[data-skin=soft],[data-skin=retro],[data-skin=luxe],[data-skin=bubbly]) .sndw input[type=range]::-moz-range-progress{height:4px;border-radius:4px}
/* sleek */
[data-skin=sleek] .sndw{background:rgba(18,18,24,.6);border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 30px rgba(0,0,0,.4);color:rgb(var(--lt))}
[data-skin=sleek] .sndw button{background:var(--red)}
[data-skin=sleek] .sndw button:hover{box-shadow:0 0 18px rgba(var(--rgb),.7);background:var(--red)}
[data-skin=sleek] .sndw input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,#fff var(--p),rgba(255,255,255,.15) var(--p))}
/* spectre */
[data-skin=spectre] .sndw{background:rgba(30,10,52,.65);border:1px solid rgba(var(--rgb),.6)!important;box-shadow:0 0 22px rgba(var(--rgb),.55);color:rgb(var(--lt));animation:spfloat 4s ease-in-out infinite}
[data-skin=spectre] .sndw button{background:radial-gradient(circle at 35% 30%,rgb(var(--lt)),var(--red));box-shadow:0 0 14px rgba(var(--rgb),.9)}
[data-skin=spectre] .sndw input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,rgb(var(--lt)) var(--p),rgba(var(--rgb),.25) var(--p))}
/* soft */
[data-skin=soft] .sndw{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);box-shadow:0 10px 30px rgba(var(--rgb),.3);color:#fff}
[data-skin=soft] .sndw button{background:rgba(255,255,255,.9);color:var(--red)}
[data-skin=soft] .sndw input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,#fff var(--p),rgba(255,255,255,.25) var(--p))}
/* retro */
[data-skin=retro] .sndw{border-radius:12px!important;background:linear-gradient(rgba(30,8,50,.85),rgba(30,8,50,.85)) padding-box,linear-gradient(90deg,var(--red),#01cdfe) border-box;border:2px solid transparent;color:#01cdfe}
[data-skin=retro] .sndw button{border-radius:8px!important;background:linear-gradient(135deg,var(--red),#01cdfe);color:#1a0026}
[data-skin=retro] .sndw input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,var(--red),#01cdfe var(--p),rgba(255,255,255,.15) var(--p))}
/* hud */
[data-skin=hud] .sndw{border-radius:0;border:0;border-left:4px solid var(--red);padding:6px 12px 6px 8px;background:rgba(12,12,4,.85);clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);font-family:"Orbitron",sans-serif;color:var(--red)}
[data-skin=hud] .sndw button{font:700 10px "Orbitron",sans-serif;letter-spacing:2px;padding:4px 8px;border:1px solid var(--red);background:rgba(var(--rgb),.1)}
[data-skin=hud] .sndw input[type=range]::-webkit-slider-runnable-track{height:8px;box-shadow:none;background:repeating-linear-gradient(90deg,transparent 0 6px,rgba(12,12,4,1) 6px 8px),linear-gradient(90deg,var(--red) var(--p),rgba(var(--rgb),.18) var(--p))}
[data-skin=hud] .sndw input[type=range]::-webkit-slider-thumb{width:6px;height:16px;margin-top:-4px;transform:none;border:0;background:#fff}
[data-skin=hud] .sndw input[type=range]::-moz-range-thumb{width:6px;height:16px;transform:none;border:0;background:#fff}
/* luxe */
[data-skin=luxe] .sndw{border-radius:3px;padding:5px 12px 5px 5px;gap:10px;background:rgba(16,11,4,.88);border:1px solid rgba(var(--rgb),.6);box-shadow:0 0 0 3px rgba(16,11,4,.88),0 0 0 4px rgba(var(--rgb),.3);color:var(--red)}
[data-skin=luxe] .sndw button{width:30px;height:30px;padding:0;display:grid;place-items:center;border-radius:50%;border:1px solid var(--red);background:transparent;color:var(--red)}
[data-skin=luxe] .sndw button:hover{background:var(--red);color:#1a1206}
[data-skin=luxe] .sndw input[type=range]::-webkit-slider-runnable-track{height:2px!important;background:linear-gradient(90deg,var(--red) var(--p),rgba(var(--rgb),.25) var(--p))}
[data-skin=luxe] .sndw input[type=range]::-webkit-slider-thumb{background:var(--red);margin-top:-5px;box-shadow:0 0 8px var(--red)}
/* bubbly */
[data-skin=bubbly] .sndw{border-radius:99px;padding:5px 14px 5px 5px;gap:10px;background:#fff;border:3px solid #0d0410;box-shadow:4px 4px 0 #0d0410;color:var(--red)}
[data-skin=bubbly] .sndw button{width:34px;height:34px;padding:0;display:grid;place-items:center;border-radius:50%;border:3px solid #0d0410;background:var(--red);color:#fff;box-shadow:0 3px 0 #0d0410}
[data-skin=bubbly] .sndw button:active{transform:translateY(2px);box-shadow:0 1px 0 #0d0410}
[data-skin=bubbly] .sndw input[type=range]::-webkit-slider-runnable-track{height:8px!important;border:2px solid #0d0410;background:linear-gradient(90deg,var(--red) var(--p),#f3e6f0 var(--p))}
[data-skin=bubbly] .sndw input[type=range]::-webkit-slider-thumb{width:16px;height:16px;margin-top:-6px;border:3px solid #0d0410;background:#fff;box-shadow:none}
/* hazard */
[data-skin=hazard] .sndw{border-radius:4px;border:2px dashed var(--red);padding:5px 10px 5px 6px;gap:10px;background:rgba(4,14,4,.9);color:var(--red);box-shadow:0 0 18px rgba(var(--rgb),.45);font-family:"Courier New",monospace}
[data-skin=hazard] .sndw button{width:30px;height:30px;padding:0;display:grid;place-items:center;border-radius:50%;background:repeating-linear-gradient(45deg,var(--red) 0 5px,#0b0b0b 5px 10px);color:#fff;border:2px solid var(--red)}
[data-skin=hazard] .sndw button svg{filter:drop-shadow(0 0 2px #000)}
/* the "animated card frame" extra effect works on every card style */
:is(#profile,#pr_card).fxf::before{content:"";position:absolute;inset:0;padding:3px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--ang),var(--red),#fff 12%,var(--red) 25%,transparent 55%,var(--red));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:angr 3.5s linear infinite;filter:drop-shadow(0 0 6px var(--red));opacity:1;font-size:0}
@media (prefers-reduced-motion:reduce){:is(#profile,#pr_card)[data-skin] *,:is(#profile,#pr_card)[data-skin]::before,:is(#profile,#pr_card)[data-skin]::after,body[data-skin] #enter{animation:none!important}}

@media (prefers-reduced-motion:reduce){[data-skin=spectre] *,[data-skin=spectre].card::before,.nf-haunt,body[data-skin] #enter{animation:none!important}}

/* inbox */
#inbtab[data-n]:not([data-n=""])::after{content:attr(data-n);margin-left:8px;background:var(--red);color:#fff;border-radius:9px;padding:0 6px;font-size:11px}.inbm{border:1px solid var(--dark);padding:8px 10px;margin-top:8px}.inbm.new{border-color:var(--red)}.mdb p{white-space:pre-line}