:root{--bg:#050505;--panel:#0c0c0c;--line:#2b2b2b;--text:#f5f5f5;--muted:#999;--white:#fff;--accent-color:#ff5a9a;--achievement-color:#ff5a9a;--click-color:#ff5a9a;--particle-color:#ff5a9a}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}body{min-height:100vh;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:34px 34px}a{color:#fff}.topbar{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:16px 22px;border-bottom:1px solid var(--line);background:#070707}.brand{font-weight:900;letter-spacing:.12em}.account{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.tiny-btn,.account a{border:1px solid #555;background:#0a0a0a;color:#fff;padding:8px 10px;text-decoration:none;cursor:pointer}.game{display:grid;grid-template-columns:minmax(190px,.75fr) minmax(300px,1.35fr) minmax(270px,1fr);gap:18px;padding:18px;max-width:1400px;margin:auto}.panel{border:1px solid var(--line);background:rgba(10,10,10,.92);padding:18px}.stats h2,.shop h2{font-size:14px;letter-spacing:.14em;margin:0 0 16px}.stat{display:flex;justify-content:space-between;border-bottom:1px dashed #242424;padding:10px 0;color:var(--muted)}.stat b{color:#fff}.center{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:620px;overflow:hidden}.count{font-size:clamp(32px,5vw,70px);font-weight:900;word-break:break-word}.sub{color:var(--muted);margin:8px 0 30px}.hex{width:min(300px,70vw);aspect-ratio:1;clip-path:polygon(25% 6.7%,75% 6.7%,100% 50%,75% 93.3%,25% 93.3%,0 50%);border:0;background:#f4f4f4;color:#050505;font-size:72px;font-weight:900;cursor:pointer;transition:transform .08s,filter .15s;filter:drop-shadow(0 0 0 rgba(255,255,255,0));touch-action:manipulation}.hex:hover{filter:drop-shadow(0 0 18px rgba(255,255,255,.4))}.hex:active{transform:scale(.94)}.click-zone{position:relative}.float{position:absolute;pointer-events:none;font-weight:900;animation:fly .7s ease-out forwards}@keyframes fly{to{transform:translateY(-70px);opacity:0}}.shop-list{display:grid;gap:10px}.upgrade{width:100%;text-align:left;border:1px solid #333;background:#080808;color:#fff;padding:12px;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:5px}.upgrade:hover:not(:disabled){border-color:#fff;box-shadow:0 0 14px rgba(255,255,255,.12)}.upgrade:disabled{opacity:.45;cursor:not-allowed}.upgrade small{color:var(--muted)}.upgrade .owned{grid-row:1/3;grid-column:2;align-self:center;font-size:22px}.save-note{font-size:12px;color:#666;margin-top:16px}.prestige-btn{margin-top:15px;width:100%;border:1px solid #777;background:#111;color:#fff;padding:12px;cursor:pointer}.auth-body{display:grid;place-items:center;padding:22px}.auth-card,.leader-card{width:min(520px,100%);border:1px solid #333;background:#090909;padding:28px}.auth-card h1,.leader-card h1{letter-spacing:.12em}.auth-card form{display:grid;gap:14px}.auth-card label{display:grid;gap:7px;color:#aaa}.auth-card input{background:#050505;color:#fff;border:1px solid #444;padding:13px;font:inherit}.auth-card button{background:#fff;color:#000;border:0;padding:13px;font:inherit;font-weight:900;cursor:pointer}.error{border:1px solid #733;padding:10px;margin-bottom:14px}.back{text-decoration:none;color:#aaa}.leader-list{display:grid}.leader-list>div{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid #222}.leader-list span{color:#999;text-align:right}@media(max-width:920px){.game{grid-template-columns:1fr}.center{min-height:auto;order:-1}.stats,.shop{min-height:0}.hex{width:min(260px,70vw)}.topbar{align-items:flex-start}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.save-now{margin-top:8px;width:100%;border:1px solid #444;background:#080808;color:#fff;padding:11px;cursor:pointer}.save-now:hover:not(:disabled){border-color:#fff}.save-now:disabled{opacity:.45;cursor:not-allowed}.upgrade.cant-afford{opacity:.58}.upgrade.cant-afford:hover{opacity:.8;border-color:#777}.save-note[data-kind="ok"]{color:#8f8}.save-note[data-kind="error"]{color:#f88}.save-note[data-kind="warn"]{color:#fc8}.save-note[data-kind="pending"]{color:#aaa}

.guest-login-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.82);backdrop-filter:blur(4px)}.guest-login-modal.show{display:flex}.guest-login-card{position:relative;width:min(470px,100%);border:1px solid #666;background:#090909;padding:28px;box-shadow:0 0 35px rgba(255,255,255,.08)}.guest-login-kicker{font-size:12px;letter-spacing:.16em;color:#999;margin-bottom:10px}.guest-login-card h2{margin:0 35px 10px 0;font-size:25px;letter-spacing:.08em}.guest-login-card p{color:#aaa;line-height:1.6;margin:0 0 22px}.guest-login-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.guest-login-actions a{display:flex;align-items:center;justify-content:center;min-height:46px;text-decoration:none;font-weight:900;text-align:center}.guest-login-primary{background:#fff;color:#000!important;border:1px solid #fff}.guest-login-secondary{background:#080808;color:#fff;border:1px solid #555}.guest-login-close{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#aaa;font-size:30px;line-height:1;cursor:pointer;padding:4px 8px}.guest-login-close:hover{color:#fff}@media(max-width:520px){.guest-login-actions{grid-template-columns:1fr}.guest-login-card{padding:24px 18px}.guest-login-card h2{font-size:21px}}

/* v7: prestige profiles, global event, click core, achievements */
.eventbar{display:flex;justify-content:center;gap:12px;align-items:center;padding:8px 14px;border-bottom:1px solid #2b2b2b;background:#0a0a0a;color:#aaa;font-size:12px;letter-spacing:.08em}.eventbar.active{color:#fff;border-color:#ff3b7a;box-shadow:inset 0 -1px 0 rgba(255,59,122,.5)}.eventbar.active b{color:#ff6fa1;text-shadow:0 0 12px rgba(255,59,122,.75)}
.player-name{display:inline-flex;gap:6px;align-items:center;font-weight:900}.player-name i{font-style:normal}.rank-0{color:#fff}.rank-1{color:#ff72ad}.rank-2{color:#a95cff}.rank-3{color:#ff3b3b}.rank-4,.rank-5,.rank-6{background:linear-gradient(90deg,#fff,#ff72ad,#a95cff,#ff3b3b);-webkit-background-clip:text;background-clip:text;color:transparent}.rank-5,.rank-6{filter:drop-shadow(0 0 5px rgba(255,70,160,.7))}.rank-6{background-size:250% 100%;animation:nameflow 2.8s linear infinite;filter:drop-shadow(0 0 8px rgba(255,50,80,.85))}@keyframes nameflow{to{background-position:250% 0}}
.click-upgrade{margin-bottom:10px}.achievements{margin-top:22px;padding-top:16px;border-top:1px solid #222}.achievement-list{display:grid;gap:7px;max-height:300px;overflow:auto;padding-right:4px}.achievement{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:start;border:1px solid #242424;padding:9px;background:#080808}.achievement b{display:block;font-size:11px;letter-spacing:.05em}.achievement small{display:block;color:#666;font-size:10px;margin-top:2px;line-height:1.35}.achievement.locked{opacity:.38;filter:grayscale(1)}.achievement.unlocked{border-color:#63314d;box-shadow:inset 2px 0 0 #ff5a9a}.achievement.unlocked .ach-icon{color:#ff5a9a;text-shadow:0 0 8px rgba(255,90,154,.55)}
@media(max-width:920px){.eventbar{flex-wrap:wrap;text-align:center}.achievement-list{max-height:none}}
@media(prefers-reduced-motion:reduce){.rank-6{animation:none}}

/* Secret hourly boost only reveals itself while active. */
.eventbar.secret{font-weight:800;letter-spacing:.08em;animation:secretPulse 1s steps(2,end) infinite}
@keyframes secretPulse{50%{filter:brightness(1.65)}}
@media (prefers-reduced-motion:reduce){.eventbar.secret{animation:none}}

/* v9: leaderboard prestige-name rendering fix */
.leader-list .player-name{color:inherit}
.leader-list .player-name .name-text{display:inline-block;font-weight:900}
.leader-list .rank-0 .name-text{color:#fff}
.leader-list .rank-1 .name-text{color:#ff72ad}
.leader-list .rank-2 .name-text{color:#a95cff}
.leader-list .rank-3 .name-text{color:#ff3b3b}
.leader-list .rank-4 .name-text,
.leader-list .rank-5 .name-text,
.leader-list .rank-6 .name-text{
  background:linear-gradient(90deg,#fff,#ff72ad,#a95cff,#ff3b3b);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}
.leader-list .rank-5 .name-text,
.leader-list .rank-6 .name-text{
  filter:drop-shadow(0 0 5px rgba(255,70,160,.7));
}
.leader-list .rank-6 .name-text{
  background-size:250% 100%;
  animation:nameflow 2.8s linear infinite;
  filter:drop-shadow(0 0 8px rgba(255,50,80,.85));
}
.leader-list .player-name i{color:#fff;-webkit-text-fill-color:currentColor}

/* v10: expanded prestige color ladder
   P1-4 pink, P5-8 purple, P9-12 red, P13+ gold.
   tier 1 solid, tier 2 color/white gradient, tier 3 glow, tier 4 animated glow. */
.player-name .name-text{display:inline-block;font-weight:900}
.player-name.prestige-white .name-text{color:#fff;-webkit-text-fill-color:#fff}

/* Solid */
.player-name.prestige-pink.tier-1 .name-text{color:#ff72ad;-webkit-text-fill-color:#ff72ad}
.player-name.prestige-purple.tier-1 .name-text{color:#a95cff;-webkit-text-fill-color:#a95cff}
.player-name.prestige-red.tier-1 .name-text{color:#ff3b3b;-webkit-text-fill-color:#ff3b3b}
.player-name.prestige-gold.tier-1 .name-text{color:#ffd45a;-webkit-text-fill-color:#ffd45a}

/* Color -> white gradient */
.player-name.tier-2 .name-text{
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.player-name.prestige-pink.tier-2 .name-text{background-image:linear-gradient(90deg,#ff72ad,#fff,#ff72ad)}
.player-name.prestige-purple.tier-2 .name-text{background-image:linear-gradient(90deg,#a95cff,#fff,#a95cff)}
.player-name.prestige-red.tier-2 .name-text{background-image:linear-gradient(90deg,#ff3b3b,#fff,#ff3b3b)}
.player-name.prestige-gold.tier-2 .name-text{background-image:linear-gradient(90deg,#ffd45a,#fff,#ffd45a)}

/* Glowing solid */
.player-name.prestige-pink.tier-3 .name-text{color:#ff72ad;-webkit-text-fill-color:#ff72ad;text-shadow:0 0 5px #ff72ad,0 0 12px #ff72ad}
.player-name.prestige-purple.tier-3 .name-text{color:#a95cff;-webkit-text-fill-color:#a95cff;text-shadow:0 0 5px #a95cff,0 0 12px #a95cff}
.player-name.prestige-red.tier-3 .name-text{color:#ff3b3b;-webkit-text-fill-color:#ff3b3b;text-shadow:0 0 5px #ff3b3b,0 0 12px #ff3b3b}
.player-name.prestige-gold.tier-3 .name-text{color:#ffd45a;-webkit-text-fill-color:#ffd45a;text-shadow:0 0 5px #ffd45a,0 0 12px #ffd45a}

/* Animated glowing gradient */
.player-name.tier-4 .name-text{
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  background-size:250% 100%;
  animation:prestigeFlow 2.2s linear infinite,prestigePulse 1.25s ease-in-out infinite alternate;
}
.player-name.prestige-pink.tier-4 .name-text{background-image:linear-gradient(90deg,#ff72ad,#fff,#ff72ad,#ff3f93);filter:drop-shadow(0 0 6px #ff72ad)}
.player-name.prestige-purple.tier-4 .name-text{background-image:linear-gradient(90deg,#a95cff,#fff,#a95cff,#7135ff);filter:drop-shadow(0 0 6px #a95cff)}
.player-name.prestige-red.tier-4 .name-text{background-image:linear-gradient(90deg,#ff3b3b,#fff,#ff3b3b,#b90000);filter:drop-shadow(0 0 6px #ff3b3b)}
.player-name.prestige-gold.tier-4 .name-text{background-image:linear-gradient(90deg,#ffd45a,#fff,#ffd45a,#ff9d00);filter:drop-shadow(0 0 7px #ffd45a)}

@keyframes prestigeFlow{to{background-position:250% 0}}
@keyframes prestigePulse{from{filter:brightness(1) drop-shadow(0 0 3px currentColor)}to{filter:brightness(1.35) drop-shadow(0 0 9px currentColor)}}
@media(prefers-reduced-motion:reduce){.player-name.tier-4 .name-text{animation:none}}

/* v12: one-time upgrade shelf + achievement production bonus */
.store-info{min-height:72px;border:1px solid #383838;background:#070707;padding:10px 12px;margin-bottom:9px;display:grid;gap:5px}
.store-info b{font-size:12px;letter-spacing:.07em}.store-info span{font-size:10px;color:#8b8b8b;line-height:1.35}
.store-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-bottom:20px}
.store-card{min-width:0;aspect-ratio:1;border:1px solid #3b3b3b;background:#0b0b0b;color:#fff;padding:5px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:inherit}
.store-card:hover:not(:disabled),.store-card:focus-visible{border-color:#fff;box-shadow:0 0 12px rgba(255,255,255,.14);outline:none}.store-card .store-icon{font-size:15px;font-weight:900}.store-card small{font-size:8px;color:#8d8d8d;max-width:100%;overflow:hidden;text-overflow:ellipsis}.store-card.locked{opacity:.27;filter:grayscale(1);cursor:not-allowed}.store-card.owned{border-color:#75405d;background:#10090d;color:#ff75ad;opacity:.75}.store-card.cant-afford{opacity:.55}.store-empty{grid-column:1/-1;color:#666;font-size:10px}
.building-title{padding-top:16px;border-top:1px solid #242424}.ach-head{display:flex;justify-content:space-between;gap:8px;align-items:start}.ach-head h2{margin-bottom:10px}.ach-head span{font-size:9px;color:#ff75ad;text-align:right;line-height:1.35;text-shadow:0 0 8px rgba(255,117,173,.25)}
@media(max-width:1100px) and (min-width:921px){.store-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:420px){.store-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}.store-card small{display:none}}


/* v14: visually center the clicker in the middle column and move it upward */
@media (min-width: 921px){
  .game{align-items:start}
  .center{
    min-height:720px;
    justify-content:flex-start;
    padding-top:110px;
  }
  .center .count{margin-top:0}
  .center .sub{margin-bottom:24px}
  .center .click-zone{margin-top:0}
}


/* v15: claimable achievement prestige/mastery tracks */
.achievement{
  width:100%;
  color:#fff;
  text-align:left;
  font:inherit;
}
.achievement:disabled{cursor:default}
.achievement.claimable{
  cursor:pointer;
  opacity:1;
  border-color:#b84c82;
  box-shadow:inset 3px 0 0 #ff5a9a,0 0 10px rgba(255,90,154,.08);
}
.achievement.claimable:hover{
  border-color:#ff72ad;
  background:#10090d;
}
.achievement.claimable .ach-icon{
  color:#ff72ad;
  text-shadow:0 0 10px rgba(255,90,154,.85);
}
.achievement.claimed{opacity:.72}
.achievement .ach-bonus{color:#bcbcbc;margin-top:4px}
.achievement.claimable .ach-bonus{color:#ff72ad}
.achievement-list{max-height:410px}


/* v19: floating click feedback matches achievement pink */
.float{color:#ff5a9a!important;text-shadow:0 0 8px rgba(255,90,154,.72)}

/* v19: in-game prestige confirmation */
.prestige-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.82);backdrop-filter:blur(3px)}
.prestige-modal.show{display:flex}
.prestige-card{width:min(520px,100%);border:1px solid #4a4a4a;background:#080808;padding:24px;box-shadow:0 0 30px rgba(255,90,154,.08)}
.prestige-kicker{color:#ff5a9a;font-size:11px;font-weight:900;letter-spacing:.14em;margin-bottom:8px}
.prestige-card h2{margin:0 0 10px;font-size:24px;letter-spacing:.06em}
.prestige-copy{color:#999;font-size:12px;line-height:1.55;margin:0 0 18px}
.prestige-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.prestige-grid>div,.prestige-reward{border:1px solid #2d2d2d;background:#050505;padding:13px}
.prestige-grid b,.prestige-reward b{display:block;color:#ff5a9a;font-size:11px;letter-spacing:.12em;margin-bottom:7px}
.prestige-grid span,.prestige-reward span{display:block;color:#bbb;font-size:11px;line-height:1.7}
.prestige-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.prestige-actions button{min-height:44px;border:1px solid #444;background:#090909;color:#fff;font:inherit;font-weight:900;cursor:pointer}
.prestige-actions button:hover{border-color:#fff}
.prestige-actions .prestige-confirm{border-color:#8d315e;color:#ff72ad}
.prestige-actions .prestige-confirm:hover{border-color:#ff72ad;box-shadow:0 0 14px rgba(255,90,154,.18)}
.prestige-actions button:disabled{opacity:.55;cursor:wait}
@media(max-width:520px){.prestige-grid{grid-template-columns:1fr}}


/* v20: achievement-ready notification + Prestige Tier */
.ach-head h2{
  display:flex;
  align-items:center;
  gap:7px;
}
.ach-notify{
  display:inline-grid;
  place-items:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border:1px solid #ff5a9a;
  border-radius:999px;
  color:#ff5a9a;
  background:#13070d;
  font-size:10px;
  line-height:1;
  font-weight:900;
  box-shadow:0 0 6px rgba(255,90,154,.85),0 0 15px rgba(255,90,154,.38);
  animation:achievementNotifyPulse 1.15s ease-in-out infinite alternate;
}
.ach-notify[hidden]{display:none!important}
@keyframes achievementNotifyPulse{
  from{filter:brightness(1);transform:scale(1)}
  to{filter:brightness(1.35);transform:scale(1.08)}
}

.nav-tab{
  appearance:none;
  border:1px solid #333;
  background:#070707;
  color:#fff;
  font:inherit;
  padding:9px 11px;
  cursor:pointer;
}
.nav-tab:hover{border-color:#ff5a9a;color:#ff5a9a}
.nav-tab span{
  display:inline-grid;
  place-items:center;
  min-width:17px;
  height:17px;
  margin-left:5px;
  padding:0 4px;
  border:1px solid #ff5a9a;
  color:#ff5a9a;
  font-size:10px;
  box-shadow:0 0 8px rgba(255,90,154,.3);
}

.prestige-tier-modal .tier-card{
  width:min(720px,calc(100% - 30px));
  position:relative;
}
.prestige-modal-close{
  position:absolute;
  right:14px;
  top:12px;
  width:34px;
  height:34px;
  border:1px solid #444;
  background:#080808;
  color:#fff;
  cursor:pointer;
  font-size:20px;
}
.tier-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.tier-title-row h2{margin:8px 0 12px}
.token-bank{
  display:flex;
  align-items:baseline;
  gap:6px;
  border:1px solid #ff5a9a;
  padding:8px 12px;
  color:#ff5a9a;
  box-shadow:0 0 12px rgba(255,90,154,.18);
}
.token-bank b{font-size:22px}
.token-bank span{font-size:11px;letter-spacing:.1em}
.prestige-tier-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin-top:16px;
}
.prestige-tier-upgrade{
  min-width:0;
  min-height:82px;
  border:1px solid #333;
  background:#080808;
  color:#fff;
  padding:12px;
  text-align:left;
  cursor:pointer;
}
.prestige-tier-upgrade.available{
  border-color:#8f3b65;
  box-shadow:inset 2px 0 0 #ff5a9a;
}
.prestige-tier-upgrade.available:hover{
  border-color:#ff5a9a;
  background:#10080c;
}
.prestige-tier-upgrade.locked{opacity:.48;cursor:not-allowed}
.prestige-tier-upgrade.owned{
  border-color:#ff5a9a;
  color:#ff72ad;
  opacity:.78;
  cursor:default;
}
.tier-upgrade-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.tier-upgrade-top b{font-size:12px;letter-spacing:.05em}
.tier-upgrade-top strong{white-space:nowrap;color:#ff5a9a;font-size:11px}
.prestige-tier-upgrade small{
  display:block;
  margin-top:8px;
  color:#888;
  line-height:1.4;
}
.tier-foot{
  margin-top:14px;
  color:#666;
  font-size:10px;
  letter-spacing:.05em;
}
@media(max-width:620px){
  .prestige-tier-grid{grid-template-columns:1fr}
  .tier-title-row{align-items:flex-start;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  .ach-notify{animation:none}
}


/* v23: account customization */
.topbar,.eventbar,.game{position:relative;z-index:2}
.file-particles{
  position:fixed;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
  color:var(--particle-color);
}
.file-particle{
  position:absolute;
  bottom:-35px;
  width:var(--particle-size);
  height:calc(var(--particle-size) * 1.22);
  display:grid;
  place-items:center;
  border:1px solid currentColor;
  color:var(--particle-color);
  font-size:calc(var(--particle-size) * .48);
  font-weight:900;
  opacity:.16;
  box-shadow:0 0 8px color-mix(in srgb,var(--particle-color) 32%,transparent);
  animation:fileParticleRise var(--particle-duration) linear var(--particle-delay) infinite;
}
.file-particle::after{
  content:"";
  position:absolute;
  top:-1px;
  right:-1px;
  width:35%;
  height:35%;
  border-left:1px solid currentColor;
  border-bottom:1px solid currentColor;
  background:#050505;
}
@keyframes fileParticleRise{
  0%{transform:translate(0,45px) rotate(0deg);opacity:0}
  10%{opacity:.16}
  85%{opacity:.13}
  100%{transform:translate(var(--particle-drift),-1050px) rotate(28deg);opacity:0}
}

/* Achievement theme color */
.achievement.unlocked{
  border-color:var(--achievement-color)!important;
  box-shadow:inset 2px 0 0 var(--achievement-color)!important;
}
.achievement.unlocked .ach-icon,
.achievement.claimable .ach-icon,
.achievement.claimable .ach-bonus,
.ach-head [data-ach-bonus]{
  color:var(--achievement-color)!important;
  text-shadow:0 0 8px color-mix(in srgb,var(--achievement-color) 60%,transparent)!important;
}
.achievement.claimable{
  border-color:var(--achievement-color)!important;
  box-shadow:inset 3px 0 0 var(--achievement-color),0 0 10px color-mix(in srgb,var(--achievement-color) 16%,transparent)!important;
}
.achievement.claimable:hover{border-color:var(--achievement-color)!important}
.ach-notify{
  border-color:var(--achievement-color)!important;
  color:var(--achievement-color)!important;
  box-shadow:0 0 6px color-mix(in srgb,var(--achievement-color) 85%,transparent),0 0 15px color-mix(in srgb,var(--achievement-color) 38%,transparent)!important;
}

/* Floating click reward color */
.float{
  color:var(--click-color)!important;
  text-shadow:0 0 8px color-mix(in srgb,var(--click-color) 72%,transparent)!important;
}

/* Custom clickable file image */
.hex.custom-file-image{
  background-image:linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,.12)),var(--custom-file-image)!important;
  background-size:cover!important;
  background-position:center!important;
  color:#fff!important;
  text-shadow:0 2px 5px #000,0 0 14px rgba(0,0,0,.9);
}

/* Settings modal */
.settings-card{
  width:min(610px,calc(100% - 30px));
  position:relative;
}
.settings-colors{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
  margin:16px 0;
}
.settings-colors label{
  display:grid;
  gap:8px;
  border:1px solid #292929;
  background:#060606;
  padding:11px;
  color:#aaa;
  font-size:10px;
  letter-spacing:.06em;
}
.settings-colors input[type="color"]{
  width:100%;
  height:42px;
  border:1px solid #444;
  padding:3px;
  background:#050505;
  cursor:pointer;
}
.settings-colors button,
.settings-actions button{
  min-height:42px;
  border:1px solid #444;
  background:#090909;
  color:#fff;
  font:inherit;
  font-size:11px;
  cursor:pointer;
}
.settings-colors button{
  grid-column:1/-1;
  border-color:var(--achievement-color);
}
.settings-upload{
  border-top:1px solid #292929;
  padding-top:16px;
}
.settings-upload>div:first-child{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
}
.settings-upload b{font-size:12px;letter-spacing:.08em}
.settings-upload small{color:var(--achievement-color)}
.settings-upload p{color:#777;font-size:11px;line-height:1.5}
.settings-upload input[type="file"]{
  display:block;
  width:100%;
  border:1px solid #333;
  background:#050505;
  color:#aaa;
  padding:10px;
  font:inherit;
  font-size:11px;
}
.settings-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:9px;
}
.settings-actions button:first-child{border-color:var(--achievement-color)}
.settings-actions button:disabled{opacity:.4;cursor:not-allowed}
.upload-progress{min-height:18px;margin-top:8px;color:#888;font-size:10px}

@media(max-width:560px){
  .settings-colors{grid-template-columns:1fr}
  .settings-actions{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .file-particle{animation:none;bottom:auto;top:var(--particle-static-top,30%)}
}


/* v24: click streak / Flow State */
.flow-state{
  width:min(520px,100%);
  margin:0 auto 20px;
  padding:10px 12px;
  border:1px solid #262626;
  background:rgba(5,5,5,.9);
  text-align:left;
  transition:border-color .2s,box-shadow .2s;
}
.flow-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  font-size:10px;
  letter-spacing:.08em;
}
.flow-top b{color:#aaa}
.flow-top span{color:#666}
.flow-track{
  height:4px;
  margin-top:8px;
  background:#151515;
  overflow:hidden;
}
.flow-track span{
  display:block;
  width:0;
  height:100%;
  background:var(--click-color);
  box-shadow:0 0 10px color-mix(in srgb,var(--click-color) 70%,transparent);
  transition:width .18s linear;
}
.flow-state.active{
  border-color:var(--click-color);
  box-shadow:0 0 14px color-mix(in srgb,var(--click-color) 18%,transparent),inset 2px 0 0 var(--click-color);
}
.flow-state.active .flow-top b,
.flow-state.active .flow-top span{
  color:var(--click-color);
  text-shadow:0 0 8px color-mix(in srgb,var(--click-color) 65%,transparent);
}

/* v24: lightweight global chat below the clicker */
.global-chat{
  width:min(560px,100%);
  margin:22px auto 0;
  border-top:1px solid #292929;
  padding-top:14px;
  text-align:left;
}
.chat-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
  color:#aaa;
  font-size:10px;
  letter-spacing:.09em;
}
.chat-head b{color:#fff}
.chat-head span{color:#666}
.chat-messages{
  height:190px;
  overflow-y:auto;
  border:1px solid #292929;
  background:rgba(4,4,4,.92);
  padding:8px 10px;
  scrollbar-color:#555 #0b0b0b;
}
.chat-row{
  display:grid;
  grid-template-columns:minmax(90px,auto) 1fr;
  gap:9px;
  align-items:start;
  padding:6px 0;
  border-bottom:1px solid #151515;
  font-size:10px;
  line-height:1.4;
}
.chat-row:last-child{border-bottom:0}
.chat-name{
  white-space:nowrap;
  justify-self:start;
}
.chat-name i{font-size:9px}
.chat-message{
  min-width:0;
  color:#bbb;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.chat-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:7px;
  margin-top:7px;
}
.chat-form input{
  min-width:0;
  height:38px;
  border:1px solid #333;
  background:#050505;
  color:#fff;
  padding:0 10px;
  font:inherit;
  font-size:11px;
}
.chat-form input:focus{
  outline:1px solid var(--achievement-color);
  border-color:var(--achievement-color);
}
.chat-form button{
  min-width:70px;
  border:1px solid #444;
  background:#090909;
  color:#fff;
  font:inherit;
  font-size:10px;
  cursor:pointer;
}
.chat-form button:hover:not(:disabled){
  border-color:var(--achievement-color);
  color:var(--achievement-color);
}
.chat-form button:disabled,.chat-form input:disabled{opacity:.42;cursor:not-allowed}
.chat-login-note{
  display:block;
  margin-top:6px;
  color:#666;
  font-size:9px;
}

@media(max-width:520px){
  .chat-row{grid-template-columns:1fr;gap:2px}
  .chat-messages{height:220px}
}
@media(prefers-reduced-motion:reduce){
  .flow-track span{transition:none}
}

/* v26 safe visual-only Prestige Tree + public profiles */
.prestige-tree-grid{position:relative;display:grid!important;grid-template-columns:repeat(5,minmax(105px,1fr))!important;grid-template-rows:repeat(9,auto);gap:34px 14px!important;padding:12px 4px 18px;overflow-x:auto;align-items:start}
.prestige-tree-wires{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:visible}
.tree-wire{stroke:#333;stroke-width:2;vector-effect:non-scaling-stroke}
.tree-wire.active{stroke:var(--achievement-color);filter:drop-shadow(0 0 4px color-mix(in srgb,var(--achievement-color) 60%,transparent))}
.tree-node{position:relative;z-index:1;min-height:102px}.tier-card{width:min(920px,calc(100% - 26px))!important}
.profile-link{border:0;background:transparent;padding:0;font:inherit;cursor:pointer;text-decoration:none}.profile-link:hover .name-text{text-decoration:underline;text-underline-offset:3px}.chat-name.profile-link{border:0;background:transparent;padding:0}
.player-profile-card{position:relative;width:min(650px,calc(100% - 28px))}.profile-title{font-size:22px!important;margin:8px 0 15px!important}
.public-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:12px 0 18px}.public-stats>div{border:1px solid #292929;background:#060606;padding:9px;min-width:0}.public-stats span{display:block;color:#666;font-size:8px;letter-spacing:.08em}.public-stats b{display:block;margin-top:4px;color:#fff;font-size:12px;overflow-wrap:anywhere}
.profile-section{border-top:1px solid #292929;padding-top:12px;margin-top:12px}.profile-section>b{display:block;margin-bottom:8px;color:var(--achievement-color);font-size:10px;letter-spacing:.08em}.profile-chip-grid{display:flex;flex-wrap:wrap;gap:6px;color:#777;font-size:9px}.profile-chip-grid span{border:1px solid #2b2b2b;background:#070707;color:#aaa;padding:6px 8px}
@media(max-width:700px){.prestige-tree-grid{min-width:680px}.public-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* v27: account-wide accent color.
   Achievement/click/particle colors remain independent. */
.store-card.owned{
  border-color:var(--accent-color);
  background:color-mix(in srgb,var(--accent-color) 7%,#080808);
  color:var(--accent-color);
}
.store-card:hover:not(:disabled),.store-card:focus-visible{
  border-color:var(--accent-color);
  box-shadow:0 0 12px color-mix(in srgb,var(--accent-color) 20%,transparent);
}
.nav-tab:hover{
  border-color:var(--accent-color);
  color:var(--accent-color);
}
.nav-tab span{
  border-color:var(--accent-color);
  color:var(--accent-color);
  box-shadow:0 0 8px color-mix(in srgb,var(--accent-color) 30%,transparent);
}
.prestige-kicker,
.prestige-grid b,
.prestige-reward b,
.tier-upgrade-top strong,
.profile-section>b{
  color:var(--accent-color);
}
.token-bank{
  border-color:var(--accent-color);
  color:var(--accent-color);
  box-shadow:0 0 12px color-mix(in srgb,var(--accent-color) 18%,transparent);
}
.prestige-tier-upgrade.available{
  border-color:color-mix(in srgb,var(--accent-color) 62%,#333);
  box-shadow:inset 2px 0 0 var(--accent-color);
}
.prestige-tier-upgrade.available:hover{
  border-color:var(--accent-color);
  background:color-mix(in srgb,var(--accent-color) 6%,#080808);
}
.prestige-tier-upgrade.owned{
  border-color:var(--accent-color);
  color:var(--accent-color);
}
.tree-wire.active{
  stroke:var(--accent-color);
  filter:drop-shadow(0 0 4px color-mix(in srgb,var(--accent-color) 60%,transparent));
}
.settings-colors label:first-child{
  border-color:color-mix(in srgb,var(--accent-color) 45%,#333);
}


/* v28: Prestige Tree viewport/layout fix
   Visual-only: no save, database, upgrade, stats, or settings logic changes. */
.prestige-tier-modal{
  align-items:flex-start;
  overflow-y:auto;
  overflow-x:hidden;
  padding:28px 18px;
}
.prestige-tier-modal .tier-card{
  width:min(1040px,calc(100% - 12px))!important;
  max-height:none;
  margin:auto;
  padding:24px 26px 30px;
}
.prestige-tier-modal .prestige-modal-close{
  position:sticky;
  top:0;
  z-index:20;
  float:right;
  margin:-8px -8px 0 12px;
}
.prestige-tree-grid{
  width:100%;
  min-width:820px;
  grid-template-columns:repeat(5,minmax(130px,1fr))!important;
  grid-template-rows:repeat(9,minmax(112px,auto))!important;
  column-gap:26px!important;
  row-gap:38px!important;
  padding:22px 14px 56px!important;
  margin-top:12px;
  overflow:visible!important;
}
.tree-node{
  align-self:start;
  width:100%;
  min-height:104px;
  padding:12px!important;
}
.prestige-tree-wires{
  overflow:visible;
}
.tree-wire{
  stroke-width:1.5;
}
.tree-wire.active{
  stroke-width:2;
}
.tier-foot{
  position:relative;
  z-index:3;
  margin-top:4px;
  padding-top:12px;
  border-top:1px solid #222;
}
@media(max-width:900px){
  .prestige-tier-modal{padding:14px 8px}
  .prestige-tier-modal .tier-card{
    width:100%!important;
    padding:18px 14px 24px;
  }
  .prestige-tree-grid{
    min-width:760px;
    grid-template-columns:repeat(5,minmax(120px,1fr))!important;
    column-gap:18px!important;
  }
}


/* v31: online presence and public voice room */
.online-panel,.public-call{
  margin-top:13px;
  border:1px solid #292929;
  background:rgba(4,4,4,.94);
  padding:10px;
}
.online-head,.call-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
  font-size:9px;
  letter-spacing:.08em;
}
.online-head b,.call-head b{color:#fff}
.online-head span,.call-head>span,.call-head small{color:#666}
.call-head>div{display:grid;gap:3px}
.online-users,.call-users{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  min-height:25px;
  align-items:center;
  color:#666;
  font-size:9px;
}
.online-user{
  border:1px solid #292929!important;
  background:#070707!important;
  padding:5px 7px!important;
}
.online-user:hover{border-color:var(--accent-color)!important}
.online-guests{
  border:1px solid #232323;
  padding:5px 7px;
  color:#777;
}
.call-user{
  border:1px solid #292929;
  background:#070707;
  padding:5px 7px;
}
.call-actions{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  margin-top:10px;
}
.call-actions button{
  min-height:36px;
  border:1px solid #383838;
  background:#080808;
  color:#fff;
  font:inherit;
  font-size:9px;
  cursor:pointer;
}
.call-actions button:hover:not(:disabled){
  border-color:var(--accent-color);
  color:var(--accent-color);
}
.call-actions button:disabled{opacity:.35;cursor:not-allowed}
.call-note{
  display:block;
  margin-top:8px;
  color:#555;
  font-size:8px;
  line-height:1.45;
}
@media(max-width:520px){
  .call-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* v32: call device selectors inside Settings */
.call-device-settings{
  border-top:1px solid #292929;
  margin-top:14px;
  padding-top:14px;
}
.call-device-label{
  display:grid;
  gap:6px;
  margin-top:10px;
}
.call-device-label>span{
  color:#777;
  font-size:9px;
  letter-spacing:.08em;
}
.call-device-label select{
  width:100%;
  min-height:40px;
  border:1px solid #353535;
  background:#060606;
  color:#fff;
  padding:0 9px;
  font:inherit;
  font-size:10px;
}
.call-device-label select:focus{
  outline:1px solid var(--accent-color);
  border-color:var(--accent-color);
}
.call-device-label select:disabled{opacity:.45}
.call-audio-sink audio{
  position:absolute;
  width:1px;
  height:1px;
  opacity:.001;
  pointer-events:none;
}


/* === MULTI LEADERBOARDS === */
.leaderboard-page{align-items:flex-start;justify-content:center;padding:36px 18px 70px}
.leaderboards-shell{width:min(1500px,100%);margin:0 auto}
.leaderboards-top{display:flex;align-items:flex-start;gap:22px;margin-bottom:22px}
.leaderboards-top .back{flex:0 0 auto;margin-top:8px}
.leaderboards-kicker{font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.14em;color:var(--accent-color,#ff5a9a);margin-bottom:5px}
.leaderboards-top h1{margin:0;color:#fff;font-size:clamp(28px,4vw,46px);letter-spacing:.04em}
.leaderboards-top p{margin:5px 0 0;color:#777;font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.leaderboards-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
.leader-board-panel{min-width:0;background:#070707;border:1px solid #242424;box-shadow:0 12px 34px rgba(0,0,0,.22)}
.leader-board-main{border-color:var(--accent-color,#ff5a9a);box-shadow:0 0 28px color-mix(in srgb,var(--accent-color,#ff5a9a) 14%,transparent)}
.leader-board-head{min-height:78px;padding:13px 14px;border-bottom:1px solid #222;display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.leader-board-head small{display:block;color:var(--accent-color,#ff5a9a);font:700 9px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;margin-bottom:5px}
.leader-board-head h2{margin:0;color:#fff;font:800 15px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em}
.leader-board-head>span{color:#666;text-align:right;font:10px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;max-width:110px}
.leader-board-list{height:470px;max-height:470px;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable}
.leader-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:47px;padding:7px 11px;border-bottom:1px solid #171717}
.leader-row:last-child{border-bottom:0}.leader-row:hover{background:#0c0c0c}
.leader-rank{color:#555;font:700 11px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.leader-row .profile-link{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;font-size:12px}
.leader-row strong{color:#ddd;white-space:nowrap;text-align:right;font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.leader-top-0{background:color-mix(in srgb,var(--accent-color,#ff5a9a) 7%,#070707)}
.leader-top-0 .leader-rank{color:var(--accent-color,#ff5a9a)}
.leader-top-0 strong{color:#fff}
.leader-top-1 .leader-rank,.leader-top-2 .leader-rank{color:#aaa}
.leader-empty{padding:18px;color:#666;font:11px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
@media(max-width:1050px){
  .leaderboards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .leader-board-main{order:-1}
}
@media(max-width:680px){
  .leaderboard-page{padding:20px 10px 50px}
  .leaderboards-top{display:block}
  .leaderboards-top .back{display:inline-block;margin:0 0 15px}
  .leaderboards-grid{grid-template-columns:1fr}
  .leader-board-main{order:-1}
  .leader-board-list{height:470px;max-height:470px}
}


/* === BANDZ // POLISHED SCROLLBARS === */
:root{scrollbar-color:#555 #0a0a0a;scrollbar-width:thin}
.leader-board-list,.achievement-list,.tf-admin-panel,.chat-messages,.online-users,.call-users,.prestige-tier-grid{
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--accent-color,#ff5a9a) 55%,#555) #090909;
}
.leader-board-list::-webkit-scrollbar,
.achievement-list::-webkit-scrollbar,
.tf-admin-panel::-webkit-scrollbar,
.chat-messages::-webkit-scrollbar,
.online-users::-webkit-scrollbar,
.call-users::-webkit-scrollbar,
.prestige-tier-grid::-webkit-scrollbar{width:7px;height:7px}
.leader-board-list::-webkit-scrollbar-track,
.achievement-list::-webkit-scrollbar-track,
.tf-admin-panel::-webkit-scrollbar-track,
.chat-messages::-webkit-scrollbar-track,
.online-users::-webkit-scrollbar-track,
.call-users::-webkit-scrollbar-track,
.prestige-tier-grid::-webkit-scrollbar-track{
  background:#090909;
  border-left:1px solid #181818;
}
.leader-board-list::-webkit-scrollbar-thumb,
.achievement-list::-webkit-scrollbar-thumb,
.tf-admin-panel::-webkit-scrollbar-thumb,
.chat-messages::-webkit-scrollbar-thumb,
.online-users::-webkit-scrollbar-thumb,
.call-users::-webkit-scrollbar-thumb,
.prestige-tier-grid::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--accent-color,#ff5a9a) 58%,#444);
  border:2px solid #090909;
  border-radius:999px;
  min-height:38px;
}
.leader-board-list::-webkit-scrollbar-thumb:hover,
.achievement-list::-webkit-scrollbar-thumb:hover,
.tf-admin-panel::-webkit-scrollbar-thumb:hover,
.chat-messages::-webkit-scrollbar-thumb:hover,
.online-users::-webkit-scrollbar-thumb:hover,
.call-users::-webkit-scrollbar-thumb:hover,
.prestige-tier-grid::-webkit-scrollbar-thumb:hover{
  background:var(--accent-color,#ff5a9a);
  box-shadow:0 0 8px var(--accent-color,#ff5a9a);
}
.leader-board-list::-webkit-scrollbar-corner,
.achievement-list::-webkit-scrollbar-corner,
.tf-admin-panel::-webkit-scrollbar-corner{background:#090909}


/* === PUBLIC PROFILE FILE PREVIEW + LIVE LEADERBOARD === */
.public-file-preview{
  width:132px;
  height:96px;
  margin:8px 0 14px;
  border:1px solid #333;
  background:#050505;
  display:grid;
  place-items:center;
  overflow:hidden;
  box-shadow:inset 0 0 18px rgba(255,255,255,.02);
}
.public-file-preview img{
  width:100%;
  height:100%;
  object-fit:contain;
  image-rendering:auto;
}
.public-file-preview span{
  font-size:46px;
  font-weight:900;
  color:#fff;
  text-shadow:0 0 16px rgba(255,255,255,.18);
}
.leader-profile-button{
  appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font:inherit;
  text-align:left;
  cursor:pointer;
  min-width:0;
}
.leader-profile-button:hover .name-text{text-decoration:underline}
[data-leader-sync]{
  color:var(--accent-color,#ff5a9a);
  font-weight:800;
}


/* === PRESTIGE ICON FIX ===
   Prestige symbols stay white; only the username receives prestige color/effects. */
.player-name > i,
.leader-profile-button > i,
.chat-name > i,
.online-user > i,
.profile-title > i{
  color:#fff !important;
  background:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  -webkit-text-fill-color:#fff !important;
  filter:none !important;
  text-shadow:0 0 5px rgba(255,255,255,.22);
  opacity:1 !important;
  flex:0 0 auto;
  min-width:12px;
  text-align:center;
}


/* === PUBLIC PROFILE THEMES + CUSTOM FALLING PARTICLES === */
.player-profile-modal .player-profile-card{
  border-color:var(--accent-color,#ff5a9a);
  box-shadow:0 0 34px color-mix(in srgb,var(--accent-color,#ff5a9a) 18%,transparent);
  overflow:hidden;
  isolation:isolate;
}
.player-profile-card > :not(.public-profile-particles){
  position:relative;
  z-index:2;
}
.player-profile-modal .prestige-kicker{
  color:var(--accent-color,#ff5a9a);
}
.player-profile-modal .public-file-preview{
  border-color:color-mix(in srgb,var(--click-color,#ff5a9a) 65%,#333);
  box-shadow:0 0 16px color-mix(in srgb,var(--click-color,#ff5a9a) 12%,transparent);
}
.player-profile-modal .profile-section{
  border-top-color:color-mix(in srgb,var(--accent-color,#ff5a9a) 30%,#292929);
}
.player-profile-modal .profile-section:first-of-type>b{
  color:var(--achievement-color,#ff5a9a);
}
.player-profile-modal .profile-chip-grid span{
  border-color:color-mix(in srgb,var(--accent-color,#ff5a9a) 28%,#2b2b2b);
  background:rgba(7,7,7,.88);
}
.player-profile-modal .public-stats>div{
  border-color:color-mix(in srgb,var(--accent-color,#ff5a9a) 22%,#292929);
  background:rgba(6,6,6,.91);
}
.public-profile-particles{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  opacity:.24;
}
.public-profile-particles::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom,rgba(5,5,5,.05),rgba(5,5,5,.28));
  pointer-events:none;
}
.public-profile-particles img{
  position:absolute;
  top:-70px;
  width:var(--pp-size,28px);
  height:var(--pp-size,28px);
  object-fit:contain;
  pointer-events:none;
  user-select:none;
  opacity:.9;
  filter:drop-shadow(0 0 5px var(--particle-color,#ff5a9a));
  animation:publicProfileFall var(--pp-duration,12s) linear var(--pp-delay,0s) infinite;
}
@keyframes publicProfileFall{
  0%{transform:translate3d(0,-80px,0) rotate(0deg);opacity:0}
  10%{opacity:.9}
  90%{opacity:.72}
  100%{transform:translate3d(var(--pp-drift,0px),720px,0) rotate(360deg);opacity:0}
}
@media(prefers-reduced-motion:reduce){
  .public-profile-particles img{animation:none;top:auto;bottom:8%;opacity:.18}
}


/* === RESPONSIVE UI / MOBILE SCALING PASS === */
html{overflow-x:hidden}
body{overflow-x:hidden}
button,input,select,textarea{max-width:100%}
img,video{max-width:100%}

/* Modal sizing: keep a safe viewport gutter on desktop and mobile. */
.prestige-modal{
  padding:clamp(10px,2.2vw,24px);
  overflow-y:auto;
  overflow-x:hidden;
}
.prestige-card,
.settings-card,
.player-profile-card{
  width:min(760px,calc(100vw - 28px))!important;
  max-width:100%;
  max-height:calc(100dvh - 28px);
  overflow-y:auto;
  overflow-x:hidden;
  margin:auto;
}
.settings-card{width:min(860px,calc(100vw - 28px))!important}

/* Settings content should wrap instead of compressing. */
.settings-colors{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
.settings-colors label{
  min-width:0;
  width:100%;
}
.settings-colors button[type="submit"]{
  grid-column:1/-1;
  width:100%;
}
.settings-upload{
  min-width:0;
  overflow:hidden;
}
.settings-upload input[type="file"]{
  display:block;
  width:100%;
  min-width:0;
}
.settings-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
}
.settings-actions button{
  min-width:0;
  width:100%;
  white-space:normal;
}
.call-device-settings select,
.call-device-label select{
  width:100%;
  min-width:0;
  text-overflow:ellipsis;
}
.call-device-settings .settings-actions{
  grid-template-columns:minmax(0,1fr)!important;
}

/* Public profile layout. */
.player-profile-card{
  padding:clamp(18px,3vw,28px)!important;
}
.public-file-preview{
  max-width:100%;
}
.public-stats{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.profile-chip-grid{
  max-width:100%;
}
.profile-chip-grid span{
  max-width:100%;
  overflow-wrap:anywhere;
}

/* Leaderboard layout remains 3 columns where possible, gracefully collapses. */
.leaderboards-shell{padding-inline:clamp(0px,1vw,10px)}
.leader-board-panel{min-width:0}
.leader-row{
  grid-template-columns:38px minmax(0,1fr) minmax(80px,auto);
}
.leader-row strong{
  max-width:160px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.leader-profile-button .name-text{
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Main game panels and social UI. */
.game>*{min-width:0}
.global-chat,.online-panel,.public-call{width:100%;min-width:0}
.chat-form{grid-template-columns:minmax(0,1fr) auto}
.chat-form input{min-width:0}
.call-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.call-actions button{min-width:0;white-space:normal}

/* Admin panel should never spill off-screen. */
.tf-admin-panel{
  max-width:calc(100vw - 20px)!important;
  right:10px!important;
  bottom:10px!important;
}
.tf-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.tf-admin-btn,.tf-admin-auto{white-space:normal}

/* Prestige tree viewport: horizontal scrolling on narrow screens, without squashing nodes. */
.prestige-tier-modal .tier-card{
  width:min(1040px,calc(100vw - 20px))!important;
  padding:clamp(14px,2.5vw,26px)!important;
}
.prestige-tree-grid{
  overflow:visible!important;
}
.prestige-tree-wrap,
.prestige-tier-viewport{
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}

/* Tablet */
@media(max-width:900px){
  .settings-card{width:min(700px,calc(100vw - 20px))!important}
  .settings-colors{grid-template-columns:1fr 1fr!important}
  .public-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .leaderboards-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .game{
    padding:12px!important;
    gap:12px!important;
  }
}

/* Mobile */
@media(max-width:620px){
  body{font-size:14px}
  .topbar{
    padding:12px!important;
    gap:10px!important;
  }
  .brand{font-size:13px}
  .account{
    width:100%;
    gap:6px!important;
  }
  .account a,.nav-tab,.tiny-btn{
    padding:7px 8px!important;
    font-size:11px;
  }

  .game{
    grid-template-columns:1fr!important;
    padding:8px!important;
    gap:9px!important;
  }
  .panel{padding:12px!important}
  .center{min-height:auto!important}
  .count{font-size:clamp(30px,12vw,54px)!important}
  .hex{width:min(240px,76vw)!important}

  .prestige-modal{padding:6px!important}
  .prestige-card,
  .settings-card,
  .player-profile-card{
    width:calc(100vw - 12px)!important;
    max-height:calc(100dvh - 12px)!important;
    padding:15px!important;
  }
  .prestige-modal-close{
    top:7px!important;
    right:7px!important;
  }

  .settings-colors{
    grid-template-columns:1fr!important;
  }
  .settings-colors button[type="submit"]{grid-column:auto}
  .settings-actions{
    grid-template-columns:1fr!important;
  }
  .settings-upload{
    padding-top:14px!important;
    margin-top:14px!important;
  }
  .settings-upload input[type="file"]{
    font-size:12px;
  }
  .call-device-label select{
    font-size:12px;
    padding:10px!important;
  }

  .public-file-preview{
    width:108px!important;
    height:82px!important;
  }
  .public-stats{
    grid-template-columns:1fr 1fr!important;
  }
  .profile-chip-grid{
    gap:5px!important;
  }
  .profile-chip-grid span{
    font-size:8px!important;
    padding:5px 6px!important;
  }

  .leaderboards-top{
    display:block!important;
  }
  .leaderboards-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .leader-board-main{order:-1}
  .leader-board-list{
    height:445px!important;
    max-height:445px!important;
  }
  .leader-row{
    grid-template-columns:34px minmax(0,1fr) minmax(64px,auto)!important;
    padding:7px 8px!important;
    gap:5px!important;
  }
  .leader-row strong{
    max-width:100px;
    font-size:10px!important;
  }
  .leader-profile-button{
    font-size:11px!important;
  }

  .chat-form{
    grid-template-columns:1fr!important;
  }
  .chat-form button{width:100%}
  .call-actions{
    grid-template-columns:1fr 1fr!important;
  }

  .tf-admin-panel{
    width:calc(100vw - 12px)!important;
    max-height:calc(100dvh - 12px)!important;
    right:6px!important;
    bottom:6px!important;
  }
  .tf-admin-grid{
    grid-template-columns:1fr 1fr!important;
  }

  .prestige-tier-modal .tier-card{
    width:calc(100vw - 12px)!important;
    padding:14px!important;
  }
  .prestige-tree-grid{
    min-width:720px!important;
  }
}

/* Very small phones */
@media(max-width:390px){
  .public-stats{grid-template-columns:1fr!important}
  .tf-admin-grid{grid-template-columns:1fr!important}
  .call-actions{grid-template-columns:1fr!important}
  .leader-row{
    grid-template-columns:30px minmax(0,1fr)!important;
  }
  .leader-row strong{
    grid-column:2;
    justify-self:start;
    max-width:100%;
  }
}


/* === ITEMS / FOLDER ARCHIVE === */
.items-card{
  width:min(920px,calc(100vw - 28px))!important;
  max-height:calc(100dvh - 28px);
  overflow:auto;
}
.items-equipped{
  border:1px solid #292929;
  background:#060606;
  color:#aaa;
  padding:10px 12px;
  margin:12px 0;
  font-size:10px;
  letter-spacing:.05em;
}
.items-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin:12px 0;
}
.items-tabs button{
  min-height:42px;
  border:1px solid #333;
  background:#080808;
  color:#888;
  font:800 11px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  cursor:pointer;
}
.items-tabs button.active{
  color:#fff;
  border-color:var(--accent-color,#ff5a9a);
  box-shadow:inset 0 -2px 0 var(--accent-color,#ff5a9a);
}
.items-store-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.folder-store-card{
  border:1px solid #2b2b2b;
  background:#060606;
  padding:13px;
  min-width:0;
}
.folder-store-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.folder-store-head b{font-size:13px;color:#fff;letter-spacing:.05em}
.folder-store-head p{font-size:10px;color:#777;line-height:1.45;margin:6px 0 0}
.folder-store-head strong{
  color:var(--accent-color,#ff5a9a);
  font-size:10px;
  white-space:nowrap;
  border:1px solid color-mix(in srgb,var(--accent-color,#ff5a9a) 45%,#333);
  padding:5px 7px;
}
.folder-odds{margin:12px 0;border-top:1px solid #1d1d1d}
.folder-odds>div{
  display:grid;
  grid-template-columns:minmax(0,1fr) 70px minmax(100px,auto);
  gap:7px;
  padding:6px 0;
  border-bottom:1px solid #151515;
  font-size:9px;
}
.folder-odds span:nth-child(1){color:#ddd}
.folder-odds span:nth-child(2){color:#888;text-align:right}
.folder-odds span:nth-child(3){color:#aaa;text-align:right}
.folder-odds>div:last-child span:nth-child(1),
.folder-odds>div:last-child span:nth-child(2){
  color:#f3ff45;
  text-shadow:0 0 8px rgba(243,255,69,.35);
}
.folder-store-foot small{display:block;color:#777;font-size:9px;line-height:1.45;margin-bottom:8px}
.folder-store-foot button{
  width:100%;
  min-height:42px;
  border:1px solid var(--accent-color,#ff5a9a);
  background:#090909;
  color:#fff;
  font:800 10px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  cursor:pointer;
}
.folder-store-foot button:disabled{opacity:.45;cursor:wait}
.folder-result{
  margin:10px 0;
  border:1px solid var(--accent-color,#ff5a9a);
  padding:12px;
  text-align:center;
  background:color-mix(in srgb,var(--accent-color,#ff5a9a) 6%,#060606);
}
.folder-result small,.folder-result b,.folder-result span{display:block}
.folder-result small{font-size:9px;color:#888;letter-spacing:.12em}
.folder-result b{font-size:20px;margin:5px 0;color:#fff}
.folder-result span{font-size:10px;color:var(--accent-color,#ff5a9a)}
.folder-result.shiny{
  animation:itemShinyPulse 1.2s ease-in-out infinite alternate;
  border-color:#fff;
  box-shadow:0 0 22px color-mix(in srgb,var(--accent-color,#ff5a9a) 35%,transparent);
}
.items-bag-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.bag-item{
  border:1px solid #292929;
  background:#060606;
  padding:10px;
  min-width:0;
}
.bag-item.equipped{
  border-color:var(--accent-color,#ff5a9a);
  box-shadow:inset 2px 0 0 var(--accent-color,#ff5a9a);
}
.bag-item.shiny{
  box-shadow:0 0 14px rgba(255,255,255,.08);
}
.bag-item-top{display:flex;justify-content:space-between;gap:6px;align-items:flex-start}
.bag-item-top b{font-size:10px;overflow-wrap:anywhere}
.bag-item-top small{font-size:8px;color:#666}
.bag-item-boost{display:block;margin:8px 0;color:#aaa;font-size:9px}
.bag-item button{
  width:100%;
  min-height:32px;
  border:1px solid #333;
  background:#090909;
  color:#fff;
  font:800 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  cursor:pointer;
}
.bag-item button:disabled{color:var(--accent-color,#ff5a9a);border-color:var(--accent-color,#ff5a9a);cursor:default}
.items-empty{padding:24px;border:1px dashed #2b2b2b;text-align:center;color:#666;font-size:10px}

/* Equipped border is a real visual frame around the clickable file. */
.click-zone{
  isolation:isolate;
}
.click-zone::before{
  content:"";
  position:absolute;
  inset:-8px;
  z-index:0;
  clip-path:polygon(25% 6.7%,75% 6.7%,100% 50%,75% 93.3%,25% 93.3%,0 50%);
  background:transparent;
  pointer-events:none;
}
.click-zone[class*="item-border-"]::before{
  background:var(--item-border-color,#fff);
  filter:drop-shadow(0 0 8px var(--item-border-color,#fff));
}
.click-zone .hex{position:relative;z-index:1}
.item-border-diamond::before{filter:drop-shadow(0 0 12px #9be9ff) brightness(1.2)!important}
.item-border-earth::before{filter:drop-shadow(0 0 13px #78a85a)!important}
.item-border-water::before{filter:drop-shadow(0 0 16px #45a9ff)!important}
.item-border-fire::before{filter:drop-shadow(0 0 18px #ff5a36) brightness(1.22)!important}
.item-border-wind::before{filter:drop-shadow(0 0 19px #dffcff) brightness(1.3)!important}
.item-border-electricity::before{
  filter:drop-shadow(0 0 22px #f3ff45) brightness(1.45)!important;
  animation:electricBorder .55s steps(2,end) infinite;
}
.item-shiny-border::before{
  background:linear-gradient(120deg,#fff,#ff6eb4,#67ddff,#fff,#ffe45d)!important;
  background-size:250% 250%!important;
  animation:itemShinyBorder 1.5s linear infinite;
  filter:drop-shadow(0 0 18px rgba(255,255,255,.9))!important;
}
.click-language-badge{
  position:absolute;
  z-index:3;
  top:50%;
  left:calc(50% + 38px);
  transform:translateY(-50%);
  font-size:clamp(9px,1vw,13px);
  line-height:1;
  padding:4px 5px;
  border:1px solid rgba(0,0,0,.55);
  background:rgba(0,0,0,.68);
  color:#fff;
  letter-spacing:.06em;
  text-shadow:none;
  pointer-events:none;
}
.click-language-badge.shiny{
  border-color:#fff;
  box-shadow:0 0 10px rgba(255,255,255,.65);
  animation:itemShinyPulse .9s ease-in-out infinite alternate;
}
@keyframes itemShinyPulse{to{filter:brightness(1.45)}}
@keyframes itemShinyBorder{to{background-position:250% 250%}}
@keyframes electricBorder{
  0%{transform:translate(0,0)}
  50%{transform:translate(1px,-1px)}
  100%{transform:translate(-1px,1px)}
}

@media(max-width:760px){
  .items-store-list{grid-template-columns:1fr}
  .items-bag-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .folder-odds>div{grid-template-columns:minmax(0,1fr) 58px minmax(90px,auto)}
}
@media(max-width:440px){
  .items-card{width:calc(100vw - 12px)!important;padding:14px!important}
  .items-bag-list{grid-template-columns:1fr}
  .folder-store-head{display:block}
  .folder-store-head strong{display:inline-block;margin-top:8px}
  .folder-odds>div{grid-template-columns:minmax(0,1fr) 50px;gap:5px}
  .folder-odds span:nth-child(3){grid-column:1/-1;text-align:left}
  .click-language-badge{left:calc(50% + 30px);font-size:9px}
}


/* === MY BAG SEARCH / RARITY SYSTEM === */
.bag-tools{
  display:grid;
  grid-template-columns:minmax(180px,1.6fr) repeat(3,minmax(120px,.7fr)) auto;
  gap:7px;
  align-items:center;
  margin:0 0 10px;
}
.bag-tools input,
.bag-tools select{
  width:100%;
  min-width:0;
  min-height:38px;
  border:1px solid #303030;
  background:#060606;
  color:#ddd;
  padding:8px 9px;
  font:700 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.bag-tools input:focus,
.bag-tools select:focus{
  outline:1px solid var(--accent-color,#ff5a9a);
  border-color:var(--accent-color,#ff5a9a);
}
.bag-tools [data-bag-count]{
  color:#777;
  font-size:9px;
  white-space:nowrap;
  text-align:right;
}

/* Rarity palette */
.bag-item{position:relative;overflow:hidden}
.bag-item::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:var(--rarity-color,#777);
}
.bag-item.rarity-common{--rarity-color:#a7a7a7;border-color:#353535}
.bag-item.rarity-uncommon{--rarity-color:#65d46e;border-color:#27462a}
.bag-item.rarity-rare{--rarity-color:#4b9dff;border-color:#244d7c}
.bag-item.rarity-epic{--rarity-color:#a85cff;border-color:#55307f}
.bag-item.rarity-legendary{--rarity-color:#ff9d2e;border-color:#7d4b1f}
.bag-item.rarity-mythic{--rarity-color:#ff3f72;border-color:#8c2443}
.bag-item .bag-item-top b{color:var(--rarity-color,#fff)}
.bag-item .bag-item-top small{
  color:color-mix(in srgb,var(--rarity-color,#aaa) 70%,#888);
}
.bag-item-odds{
  display:block;
  margin:-3px 0 8px;
  color:#666;
  font-size:8px;
  letter-spacing:.06em;
}
.bag-item.equipped{
  border-color:var(--rarity-color,var(--accent-color,#ff5a9a));
  box-shadow:inset 2px 0 0 var(--rarity-color,var(--accent-color,#ff5a9a));
}

/* Stronger SHINY treatment */
.bag-item.shiny{
  border-color:#fff;
  background:
    linear-gradient(115deg,
      rgba(255,255,255,.02) 0%,
      rgba(255,255,255,.02) 35%,
      rgba(255,255,255,.19) 48%,
      rgba(255,255,255,.02) 62%,
      rgba(255,255,255,.02) 100%),
    #060606;
  background-size:260% 100%;
  animation:bagShinySweep 2.1s linear infinite;
  box-shadow:
    0 0 12px color-mix(in srgb,var(--rarity-color,#fff) 45%,transparent),
    inset 0 0 14px rgba(255,255,255,.04);
}
.bag-item.shiny::after{
  content:"✦";
  position:absolute;
  right:8px;
  top:6px;
  color:#fff;
  font-size:11px;
  text-shadow:
    0 0 5px #fff,
    0 0 10px var(--rarity-color,#fff);
  animation:bagShinyStar .85s ease-in-out infinite alternate;
  pointer-events:none;
}
.bag-item.shiny .bag-item-top b{
  background:linear-gradient(90deg,#fff,var(--rarity-color,#fff),#fff);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:bagShinyText 1.7s linear infinite;
}
@keyframes bagShinySweep{to{background-position:-260% 0}}
@keyframes bagShinyStar{to{transform:scale(1.25) rotate(12deg);filter:brightness(1.4)}}
@keyframes bagShinyText{to{background-position:220% 0}}

@media(max-width:900px){
  .bag-tools{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .bag-tools [data-bag-count]{text-align:left}
}
@media(max-width:520px){
  .bag-tools{
    grid-template-columns:1fr;
  }
  .bag-tools input,.bag-tools select{font-size:12px;min-height:42px}
}
@media(prefers-reduced-motion:reduce){
  .bag-item.shiny,
  .bag-item.shiny .bag-item-top b,
  .bag-item.shiny::after{animation:none!important}
}


/* === CLICK LABEL + PRESTIGE TIER MOBILE FIX === */
.click-file-label{
  margin:14px 0 26px!important;
  line-height:1.2;
  position:relative;
  z-index:3;
  flex:0 0 auto;
}
.click-zone{
  margin-bottom:0!important;
}

/* On phones the tree becomes a readable vertical upgrade path instead of
   forcing the desktop 5-column canvas into a tiny viewport. */
@media(max-width:620px){
  .prestige-tier-modal{
    padding:6px!important;
    overflow-x:hidden!important;
    align-items:flex-start!important;
  }
  .prestige-tier-modal .tier-card{
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    margin:0 auto!important;
    padding:14px 12px 20px!important;
    overflow-x:hidden!important;
  }
  .prestige-tier-modal .prestige-modal-close{
    position:sticky!important;
    top:0!important;
    z-index:30!important;
    float:right!important;
    margin:-4px -2px 4px 10px!important;
  }
  .tier-title-row{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding-right:42px;
  }
  .tier-title-row h2{
    margin:4px 0 0!important;
    font-size:20px!important;
  }
  .token-bank{
    width:100%;
    justify-content:space-between;
    padding:8px 10px!important;
  }

  .prestige-tree-grid{
    display:grid!important;
    width:100%!important;
    min-width:0!important;
    grid-template-columns:1fr!important;
    grid-template-rows:none!important;
    gap:8px!important;
    padding:10px 0 16px!important;
    margin:8px 0 0!important;
    overflow:visible!important;
  }
  .prestige-tree-grid .tree-node,
  .prestige-tier-upgrade.tree-node{
    grid-column:1!important;
    grid-row:auto!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:11px!important;
  }
  .prestige-tree-wires{
    display:none!important;
  }
  .tier-upgrade-top{
    gap:8px!important;
  }
  .tier-upgrade-top b{
    font-size:11px!important;
    line-height:1.25;
  }
  .tier-upgrade-top strong{
    font-size:10px!important;
  }
  .prestige-tier-upgrade small{
    font-size:9px!important;
    line-height:1.45!important;
    margin-top:6px!important;
  }
  .tier-foot{
    margin-top:6px!important;
    padding-top:10px!important;
    font-size:9px!important;
  }

  .click-file-label{
    margin:10px 0 20px!important;
  }
}

/* === ELEMENTAL BORDER PARTICLES === */
.elemental-border-particles{
  position:absolute;
  inset:-18%;
  z-index:4;
  pointer-events:none;
  overflow:visible;
  color:var(--item-border-color,#fff);
}
.elemental-border-particles span{
  --ep-angle:0deg;
  --ep-distance:55%;
  position:absolute;
  left:50%;
  top:50%;
  width:18px;
  height:18px;
  margin:-9px;
  display:grid;
  place-items:center;
  font:900 13px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color:currentColor;
  opacity:0;
  text-shadow:0 0 6px currentColor;
  transform:
    rotate(var(--ep-angle))
    translateX(var(--ep-distance))
    rotate(calc(var(--ep-angle) * -1));
  animation:elementalOrbit var(--ep-duration,2.2s) ease-in-out var(--ep-delay,0s) infinite;
}
.elemental-earth span{
  color:#78a85a;
  text-shadow:0 0 6px #78a85a;
}
.elemental-water span{
  color:#45a9ff;
  text-shadow:0 0 7px #45a9ff;
}
.elemental-fire span{
  color:#ff5a36;
  text-shadow:0 0 8px #ff5a36;
}
.elemental-wind span{
  color:#dffcff;
  text-shadow:0 0 8px #dffcff;
}
.elemental-electricity span{
  color:#f3ff45;
  text-shadow:0 0 5px #fff,0 0 10px #f3ff45;
  animation-name:elementalElectric;
  animation-timing-function:steps(3,end);
}
.elemental-border-particles.shiny span{
  filter:brightness(1.45);
  text-shadow:0 0 5px #fff,0 0 12px currentColor;
}
@keyframes elementalOrbit{
  0%,100%{
    opacity:0;
    transform:rotate(var(--ep-angle)) translateX(calc(var(--ep-distance) * .83)) rotate(calc(var(--ep-angle) * -1)) scale(.65);
  }
  28%{opacity:.85}
  55%{
    opacity:.95;
    transform:rotate(calc(var(--ep-angle) + 9deg)) translateX(var(--ep-distance)) rotate(calc((var(--ep-angle) + 9deg) * -1)) scale(1);
  }
  82%{opacity:.35}
}
@keyframes elementalElectric{
  0%,100%{opacity:.15;transform:rotate(var(--ep-angle)) translateX(calc(var(--ep-distance) * .85)) scale(.8)}
  30%{opacity:1;transform:rotate(calc(var(--ep-angle) + 6deg)) translateX(var(--ep-distance)) scale(1.25)}
  55%{opacity:.35}
  72%{opacity:1;transform:rotate(calc(var(--ep-angle) - 5deg)) translateX(calc(var(--ep-distance) * 1.06)) scale(.95)}
}
@media(max-width:620px){
  .elemental-border-particles{inset:-13%}
  .elemental-border-particles span{font-size:10px;width:14px;height:14px;margin:-7px}
}
@media(prefers-reduced-motion:reduce){
  .elemental-border-particles span{animation:none!important;opacity:.45}
}


/* === FLOATING CLICK AMOUNT FIX === */
.click-zone{
  position:relative;
  overflow:visible!important;
}
.click-zone .float{
  position:absolute!important;
  z-index:20!important;
  pointer-events:none!important;
  isolation:isolate;
  text-shadow:0 1px 3px #000,0 0 7px #000;
}
.click-zone .hex{z-index:1}
.click-language-badge{z-index:5}
.elemental-border-particles{z-index:4}


/* === ULTRA-RARE BORDER TIERS + STORE RARITY LABELS === */

/* Store odds now show NAME | RARITY | CHANCE | BOOST */
.folder-odds>div{
  grid-template-columns:minmax(0,1fr) 84px 72px minmax(100px,auto)!important;
  align-items:center;
}
.folder-odds .store-rarity{
  justify-self:start;
  min-width:70px;
  padding:3px 5px;
  border:1px solid currentColor;
  text-align:center!important;
  font-size:7px;
  letter-spacing:.06em;
  line-height:1.1;
}
.folder-odds>div span:nth-child(3){color:#888;text-align:right}
.folder-odds>div span:nth-child(4){color:#aaa;text-align:right}

/* Shared rarity colors used in Store + My Bag */
.rarity-common{--rarity-color:#a7a7a7!important;color:#a7a7a7}
.rarity-uncommon{--rarity-color:#65d46e!important;color:#65d46e}
.rarity-rare{--rarity-color:#4b9dff!important;color:#4b9dff}
.rarity-epic{--rarity-color:#a85cff!important;color:#a85cff}
.rarity-legendary{--rarity-color:#ff9d2e!important;color:#ff9d2e}
.rarity-mythic{--rarity-color:#ff3f72!important;color:#ff3f72}
.rarity-relic{--rarity-color:#b875ff!important;color:#b875ff}
.rarity-ancient{--rarity-color:#42ff78!important;color:#42ff78}
.rarity-forbidden{--rarity-color:#ff3048!important;color:#ff3048}
.rarity-classified{--rarity-color:#ffffff!important;color:#ffffff}

/* My Bag top-end cards */
.bag-item.rarity-relic{border-color:#59337d}
.bag-item.rarity-ancient{border-color:#24753d}
.bag-item.rarity-forbidden{border-color:#8a1d31}
.bag-item.rarity-classified{
  border-color:#ddd;
  background:#040404;
}
.bag-item.rarity-classified::before{
  background:repeating-linear-gradient(180deg,#fff 0 3px,#111 3px 6px);
}
.bag-item.rarity-classified .bag-item-top b{
  letter-spacing:.12em;
}

/* Galactic — purple cosmic glow + star orbit */
.item-border-galactic::before{
  background:linear-gradient(135deg,#702bff,#d567ff,#3f6dff,#702bff)!important;
  background-size:220% 220%!important;
  filter:drop-shadow(0 0 16px #9d55ff) drop-shadow(0 0 28px rgba(87,81,255,.5))!important;
  animation:galacticBorder 2.6s linear infinite!important;
}
.elemental-galactic{
  color:#c989ff!important;
}
.elemental-galactic span{
  color:#d7a3ff!important;
  text-shadow:0 0 5px #fff,0 0 11px #a14cff,0 0 16px #4c67ff!important;
  animation-name:galacticParticle!important;
  font-size:11px!important;
}

/* Hex — green terminal / binary */
.item-border-hex::before{
  background:#42ff78!important;
  filter:drop-shadow(0 0 10px #42ff78) drop-shadow(0 0 18px rgba(32,255,102,.55))!important;
  animation:hexBorderPulse 1.05s steps(3,end) infinite!important;
}
.elemental-hex span{
  color:#45ff79!important;
  font-size:8px!important;
  letter-spacing:-2px;
  text-shadow:0 0 5px #45ff79,0 0 9px #0f2!important;
  animation-name:hexCodeRain!important;
}

/* Corrupted — red glitch / code cracking outward from center */
.item-border-corrupted::before{
  background:linear-gradient(90deg,#240007,#ff233f,#4d000c,#ff233f,#240007)!important;
  background-size:300% 100%!important;
  filter:drop-shadow(0 0 12px #ff233f) drop-shadow(4px 0 0 rgba(255,0,40,.26)) drop-shadow(-3px 0 0 rgba(85,0,255,.18))!important;
  animation:corruptBorder .5s steps(2,end) infinite!important;
}
.elemental-corrupted span{
  color:#ff334e!important;
  text-shadow:0 0 5px #ff334e,2px 0 0 #720019!important;
  animation-name:corruptCrack!important;
  font-size:9px!important;
}

/* CIA — classified black/white scan, redacted-document energy */
.item-border-cia::before{
  background:repeating-linear-gradient(90deg,#fff 0 9px,#202020 9px 14px,#fff 14px 17px)!important;
  filter:drop-shadow(0 0 8px rgba(255,255,255,.8))!important;
  animation:ciaBorderScan 1.5s linear infinite!important;
}
.elemental-cia span{
  color:#fff!important;
  background:#000;
  border:1px solid #fff;
  font-size:7px!important;
  width:21px!important;
  height:8px!important;
  overflow:hidden;
  text-indent:-1px;
  box-shadow:0 0 7px rgba(255,255,255,.45);
  animation-name:ciaParticle!important;
}
.item-border-cia .hex::after{
  content:"CLASSIFIED";
  position:absolute;
  left:50%;
  bottom:14%;
  transform:translateX(-50%) rotate(-4deg);
  z-index:6;
  padding:3px 5px;
  border:1px solid rgba(255,255,255,.7);
  background:rgba(0,0,0,.75);
  color:#fff;
  font:900 7px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.12em;
  pointer-events:none;
}

@keyframes galacticBorder{to{background-position:220% 220%}}
@keyframes galacticParticle{
  0%,100%{opacity:0;transform:rotate(var(--ep-angle)) translateX(calc(var(--ep-distance)*.78)) scale(.4)}
  40%{opacity:1}
  70%{transform:rotate(calc(var(--ep-angle) + 18deg)) translateX(calc(var(--ep-distance)*1.08)) scale(1.35);opacity:.75}
}
@keyframes hexBorderPulse{
  0%,100%{filter:drop-shadow(0 0 8px #42ff78)}
  50%{filter:drop-shadow(0 0 18px #42ff78) brightness(1.35)}
}
@keyframes hexCodeRain{
  0%{opacity:0;transform:rotate(var(--ep-angle)) translateX(calc(var(--ep-distance)*.72)) translateY(-10px)}
  30%{opacity:1}
  100%{opacity:0;transform:rotate(var(--ep-angle)) translateX(calc(var(--ep-distance)*1.1)) translateY(16px)}
}
@keyframes corruptBorder{
  0%{background-position:0 0;transform:translate(0)}
  33%{transform:translate(2px,-1px)}
  66%{transform:translate(-2px,1px)}
  100%{background-position:300% 0;transform:translate(0)}
}
@keyframes corruptCrack{
  0%{opacity:0;transform:rotate(var(--ep-angle)) translateX(8%) scale(.25)}
  22%{opacity:1}
  100%{opacity:0;transform:rotate(var(--ep-angle)) translateX(calc(var(--ep-distance)*1.12)) scale(1.2)}
}
@keyframes ciaBorderScan{
  to{background-position:120px 0}
}
@keyframes ciaParticle{
  0%,100%{opacity:0;transform:rotate(var(--ep-angle)) translateX(calc(var(--ep-distance)*.85)) scale(.8)}
  35%{opacity:.95}
  65%{opacity:.5;transform:rotate(calc(var(--ep-angle) + 4deg)) translateX(var(--ep-distance)) scale(1)}
}

@media(max-width:760px){
  .folder-odds>div{
    grid-template-columns:minmax(0,1fr) 76px 60px minmax(90px,auto)!important;
  }
}
@media(max-width:440px){
  .folder-odds>div{
    grid-template-columns:minmax(0,1fr) 72px!important;
  }
  .folder-odds>div span:nth-child(3),
  .folder-odds>div span:nth-child(4){
    grid-column:1/-1;
    text-align:left!important;
  }
}


/* === STORE RARITY BADGE COLOR FIX === */
.folder-odds .store-rarity{
  color:var(--rarity-color,#a7a7a7)!important;
  border-color:var(--rarity-color,#a7a7a7)!important;
  background:color-mix(in srgb,var(--rarity-color,#a7a7a7) 8%,#050505)!important;
  text-shadow:0 0 7px color-mix(in srgb,var(--rarity-color,#a7a7a7) 55%,transparent);
  box-shadow:inset 0 0 8px color-mix(in srgb,var(--rarity-color,#a7a7a7) 8%,transparent);
}
.folder-odds .store-rarity.rarity-common{--rarity-color:#a7a7a7}
.folder-odds .store-rarity.rarity-uncommon{--rarity-color:#65d46e}
.folder-odds .store-rarity.rarity-rare{--rarity-color:#4b9dff}
.folder-odds .store-rarity.rarity-epic{--rarity-color:#a85cff}
.folder-odds .store-rarity.rarity-legendary{--rarity-color:#ff9d2e}
.folder-odds .store-rarity.rarity-mythic{--rarity-color:#ff3f72}
.folder-odds .store-rarity.rarity-relic{--rarity-color:#b875ff}
.folder-odds .store-rarity.rarity-ancient{--rarity-color:#42ff78}
.folder-odds .store-rarity.rarity-forbidden{--rarity-color:#ff3048}
.folder-odds .store-rarity.rarity-classified{
  --rarity-color:#fff;
  background:repeating-linear-gradient(135deg,#050505 0 5px,#161616 5px 7px)!important;
  animation:classifiedBadgePulse 1.2s ease-in-out infinite alternate;
}
@keyframes classifiedBadgePulse{
  to{box-shadow:0 0 9px rgba(255,255,255,.32),inset 0 0 7px rgba(255,255,255,.1)}
}


/* === PUBLIC PROFILE RAREST ITEMS === */
.public-rarest-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.public-rarest-card{
  --rarity-color:#a7a7a7;
  position:relative;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--rarity-color) 62%,#333);
  background:color-mix(in srgb,var(--rarity-color) 5%,#060606);
  padding:10px;
  min-width:0;
  box-shadow:inset 3px 0 0 var(--rarity-color);
}
.public-rarest-card>small{
  display:block;
  color:#777;
  font-size:8px;
  letter-spacing:.08em;
  margin-bottom:6px;
}
.public-rarest-card>b{
  display:block;
  color:var(--rarity-color);
  font-size:11px;
  margin-bottom:5px;
  overflow-wrap:anywhere;
}
.public-rarest-card>span{
  display:block;
  color:#888;
  font-size:8px;
  margin-bottom:6px;
}
.public-rarest-card>strong{
  display:block;
  color:#ddd;
  font-size:9px;
}
.public-rarest-card.rarity-common{--rarity-color:#a7a7a7}
.public-rarest-card.rarity-uncommon{--rarity-color:#65d46e}
.public-rarest-card.rarity-rare{--rarity-color:#4b9dff}
.public-rarest-card.rarity-epic{--rarity-color:#a85cff}
.public-rarest-card.rarity-legendary{--rarity-color:#ff9d2e}
.public-rarest-card.rarity-mythic{--rarity-color:#ff3f72}
.public-rarest-card.rarity-relic{--rarity-color:#b875ff}
.public-rarest-card.rarity-ancient{--rarity-color:#42ff78}
.public-rarest-card.rarity-forbidden{--rarity-color:#ff3048}
.public-rarest-card.rarity-classified{--rarity-color:#fff}
.public-rarest-card.shiny{
  background:
    linear-gradient(115deg,transparent 0 34%,rgba(255,255,255,.16) 47%,transparent 60%),
    color-mix(in srgb,var(--rarity-color) 5%,#060606);
  background-size:240% 100%;
  animation:profileRarestShiny 2s linear infinite;
  box-shadow:
    inset 3px 0 0 var(--rarity-color),
    0 0 12px color-mix(in srgb,var(--rarity-color) 40%,transparent);
}
@keyframes profileRarestShiny{to{background-position:-240% 0}}
@media(max-width:520px){
  .public-rarest-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .public-rarest-card.shiny{animation:none}
}


/* === SECURE ITEM TRADING UI === */
.public-profile-actions{
  display:flex;
  gap:8px;
  margin:0 0 12px;
}
.public-profile-actions:empty{display:none}
.public-trade-button{
  min-height:36px;
  padding:8px 12px;
  border:1px solid var(--accent-color,#ff5a9a);
  background:#080808;
  color:#fff;
  font:800 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.06em;
  cursor:pointer;
}
.public-trade-button:hover:not(:disabled){
  color:var(--accent-color,#ff5a9a);
  box-shadow:0 0 12px color-mix(in srgb,var(--accent-color,#ff5a9a) 25%,transparent);
}
.public-trade-button:disabled{opacity:.45;cursor:wait}

.trade-incoming{
  position:fixed;
  left:14px;
  bottom:14px;
  z-index:12050;
  width:min(320px,calc(100vw - 28px));
  border:1px solid var(--accent-color,#ff5a9a);
  background:#070707;
  padding:12px;
  box-shadow:0 0 24px rgba(0,0,0,.7),0 0 16px color-mix(in srgb,var(--accent-color,#ff5a9a) 18%,transparent);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.trade-incoming>small{
  display:block;
  color:var(--accent-color,#ff5a9a);
  font-size:8px;
  letter-spacing:.12em;
}
.trade-incoming>b{
  display:block;
  margin-top:7px;
  color:#fff;
  font-size:13px;
}
.trade-incoming>span{
  display:block;
  color:#888;
  font-size:10px;
  margin:3px 0 10px;
}
.trade-incoming>div{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.trade-incoming button,
.trade-actions button,
.trade-item-card button{
  min-height:34px;
  border:1px solid #3b3b3b;
  background:#090909;
  color:#fff;
  font:800 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  cursor:pointer;
}
.trade-incoming button:first-child,
.trade-actions [data-trade-confirm]{
  border-color:var(--accent-color,#ff5a9a);
}
.trade-incoming button:disabled,
.trade-actions button:disabled,
.trade-item-card button:disabled{opacity:.4;cursor:not-allowed}

.trade-toast-host{
  position:fixed;
  left:14px;
  bottom:14px;
  z-index:12060;
  display:grid;
  gap:7px;
  width:min(340px,calc(100vw - 28px));
  pointer-events:none;
}
.trade-incoming~.trade-toast-host,
body:has(.trade-incoming) .trade-toast-host{bottom:128px}
.trade-toast{
  border:1px solid #333;
  background:#080808;
  color:#ddd;
  padding:10px 12px;
  font:10px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  box-shadow:0 8px 24px rgba(0,0,0,.55);
}
.trade-toast.success{border-color:#38724d;color:#a8ffbe}
.trade-toast.error{border-color:#77353b;color:#ffadb4}

.trade-card{
  width:min(980px,calc(100vw - 28px))!important;
  max-height:calc(100dvh - 28px);
  overflow:auto;
}
.trade-title-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}
.trade-title-row h2{margin:8px 0}
.trade-title-row>span{
  border:1px solid var(--accent-color,#ff5a9a);
  color:var(--accent-color,#ff5a9a);
  padding:5px 8px;
  font-size:8px;
}
.trade-countdown{
  margin:10px 0;
  border:1px solid #a4612d;
  background:#120b05;
  color:#ffbf76;
  padding:10px;
  text-align:center;
  font-size:11px;
  font-weight:900;
  letter-spacing:.07em;
}
.trade-offers{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:12px 0;
}
.trade-offers>section{
  min-width:0;
  border:1px solid #292929;
  background:#050505;
  padding:9px;
}
.trade-offers header{
  display:flex;
  justify-content:space-between;
  gap:8px;
  align-items:center;
  margin-bottom:7px;
}
.trade-offers header>b{font-size:10px}
.trade-offers header>span{font-size:8px;color:#777}
.trade-offers header>span.accepted{
  color:#8cffac;
  text-shadow:0 0 7px rgba(80,255,135,.3);
}
.trade-offer-list{
  display:grid;
  gap:6px;
  min-height:52px;
  color:#555;
  font-size:9px;
}
.trade-item-card{
  --rarity-color:#a7a7a7;
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:3px 8px;
  align-items:center;
  border:1px solid color-mix(in srgb,var(--rarity-color) 55%,#292929);
  background:color-mix(in srgb,var(--rarity-color) 4%,#070707);
  padding:8px 9px 8px 11px;
  box-shadow:inset 2px 0 0 var(--rarity-color);
}
.trade-item-card>b{
  min-width:0;
  color:var(--rarity-color);
  font-size:9px;
  overflow-wrap:anywhere;
}
.trade-item-card>small{
  min-width:0;
  color:#777;
  font-size:7px;
  grid-column:1;
}
.trade-item-card>button{
  grid-column:2;
  grid-row:1/3;
  min-width:58px;
  padding-inline:8px;
}
.trade-item-card.rarity-common{--rarity-color:#a7a7a7}
.trade-item-card.rarity-uncommon{--rarity-color:#65d46e}
.trade-item-card.rarity-rare{--rarity-color:#4b9dff}
.trade-item-card.rarity-epic{--rarity-color:#a85cff}
.trade-item-card.rarity-legendary{--rarity-color:#ff9d2e}
.trade-item-card.rarity-mythic{--rarity-color:#ff3f72}
.trade-item-card.rarity-relic{--rarity-color:#b875ff}
.trade-item-card.rarity-ancient{--rarity-color:#42ff78}
.trade-item-card.rarity-forbidden{--rarity-color:#ff3048}
.trade-item-card.rarity-classified{--rarity-color:#fff}
.trade-item-card.shiny{
  background:
    linear-gradient(110deg,transparent 0 35%,rgba(255,255,255,.16) 48%,transparent 61%),
    color-mix(in srgb,var(--rarity-color) 4%,#070707);
  background-size:240% 100%;
  animation:tradeShinySweep 2s linear infinite;
  box-shadow:inset 2px 0 0 var(--rarity-color),0 0 9px color-mix(in srgb,var(--rarity-color) 35%,transparent);
}
@keyframes tradeShinySweep{to{background-position:-240% 0}}

.trade-bag{
  border-top:1px solid #292929;
  padding-top:12px;
}
.trade-bag-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.trade-bag-head>b{font-size:10px}
.trade-bag-head input{
  width:min(310px,52%);
  min-height:35px;
  border:1px solid #333;
  background:#060606;
  color:#fff;
  padding:7px 9px;
  font:9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.trade-available{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  max-height:265px;
  overflow:auto;
  color:#555;
  font-size:9px;
}
.trade-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:12px;
}
.trade-actions button{min-height:42px}
.trade-actions [data-trade-cancel]{border-color:#663139;color:#ff9ba3}
.trade-security{
  display:block;
  margin-top:9px;
  color:#606060;
  font-size:8px;
  line-height:1.45;
}

@media(max-width:760px){
  .trade-card{width:calc(100vw - 12px)!important;max-height:calc(100dvh - 12px);padding:14px!important}
  .trade-offers{grid-template-columns:1fr}
  .trade-available{grid-template-columns:repeat(2,minmax(0,1fr));max-height:220px}
  .trade-bag-head{display:grid;grid-template-columns:1fr}
  .trade-bag-head input{width:100%;font-size:16px}
}
@media(max-width:430px){
  .trade-available{grid-template-columns:1fr}
  .trade-actions{grid-template-columns:1fr}
  .trade-incoming{left:6px;bottom:6px;width:calc(100vw - 12px)}
  .trade-toast-host{left:6px;bottom:6px;width:calc(100vw - 12px)}
}
@media(prefers-reduced-motion:reduce){
  .trade-item-card.shiny{animation:none}
}


/* === BAG 400/400 + LOCK / SELL === */
.bag-item.locked{
  outline:1px solid color-mix(in srgb,var(--rarity-color,#aaa) 55%,#444);
  outline-offset:-3px;
}
.bag-item-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
}
.bag-item-actions button{
  min-width:0;
  min-height:32px;
  padding:5px 4px;
  border:1px solid #333;
  background:#090909;
  color:#fff;
  font:800 8px/1.1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  cursor:pointer;
}
.bag-item-actions [data-lock-item][data-locked="1"]{
  border-color:var(--rarity-color,#fff);
  color:var(--rarity-color,#fff);
}
.bag-item-actions [data-sell-item]{
  border-color:#655121;
  color:#ffd97c;
}
.bag-item-actions button:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:520px){
  .bag-item-actions{grid-template-columns:1fr}
  .bag-item-actions button{min-height:38px;font-size:10px}
}


/* === BULK SELL + FULL STORAGE === */
.bag-sell-all{
  display:grid;
  grid-template-columns:auto minmax(150px,1fr) minmax(130px,.8fr) auto;
  gap:7px;
  align-items:center;
  margin:8px 0 10px;
  padding:9px;
  border:1px solid #352d1a;
  background:#080705;
}
.bag-sell-all>b{
  color:#ffd97c;
  font-size:9px;
  letter-spacing:.08em;
}
.bag-sell-all select{
  min-height:34px;
  border:1px solid #333;
  background:#070707;
  color:#ddd;
  padding:5px 7px;
  font:9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.bag-sell-all button{
  min-height:34px;
  border:1px solid #745e28;
  background:#0b0905;
  color:#ffd97c;
  padding:6px 10px;
  font:900 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  cursor:pointer;
}
.bag-sell-all button:hover:not(:disabled){border-color:#ffd97c}
.bag-sell-all button:disabled{opacity:.4;cursor:not-allowed}
.bag-sell-all small{
  grid-column:1/-1;
  color:#666;
  font-size:8px;
}
.folder-store-foot button:disabled{
  opacity:.55;
  cursor:not-allowed;
}
@media(max-width:700px){
  .bag-sell-all{grid-template-columns:1fr 1fr}
  .bag-sell-all>b,.bag-sell-all small{grid-column:1/-1}
}
@media(max-width:430px){
  .bag-sell-all{grid-template-columns:1fr}
  .bag-sell-all>b,.bag-sell-all small{grid-column:auto}
  .bag-sell-all select{font-size:16px}
}
/* v62 prestige color ladder */
.prestige-whitepink{color:#fff1f7!important;text-shadow:0 0 8px #ffb6d2}
.prestige-pink{color:#ff6aa7!important;text-shadow:0 0 9px #ff5a9a}
.prestige-darkpink{color:#c13b86!important;text-shadow:0 0 10px #8d2b70}
.prestige-purple{color:#a66cff!important;text-shadow:0 0 10px #793cff}
.prestige-purplered{color:#c94b78!important;text-shadow:0 0 10px #9d2858}
.prestige-red{color:#ff4747!important;text-shadow:0 0 10px #c90000}
.prestige-orange{color:#ff9a3c!important;text-shadow:0 0 10px #ff6a00}
.prestige-gold{color:#ffd85a!important;text-shadow:0 0 12px #ffb000}
.rainbow{animation:itemRainbow 2s linear infinite}.darkmatter{filter:drop-shadow(0 0 8px #7a45ff)}.omega{filter:drop-shadow(0 0 10px #ff4b18)}
@keyframes itemRainbow{0%{filter:hue-rotate(0deg) drop-shadow(0 0 7px currentColor)}100%{filter:hue-rotate(360deg) drop-shadow(0 0 7px currentColor)}}
.trade-files-row{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:end;margin:10px 0}.trade-files-row label{display:grid;gap:4px;font-size:11px}.trade-files-row input{background:#090909;color:#fff;border:1px solid #444;padding:8px;min-width:0}.trade-files-row span{text-align:right;font-size:12px;padding:8px 0}@media(max-width:650px){.trade-files-row{grid-template-columns:1fr}.trade-files-row span{text-align:left}}
.bag-item.rainbow,.folder-result.rainbow{animation:itemRainbow 2s linear infinite}.bag-item.darkmatter,.folder-result.darkmatter{box-shadow:0 0 18px rgba(110,55,255,.55),inset 0 0 16px rgba(0,0,0,.8)}.bag-item.omega,.folder-result.omega{box-shadow:0 0 20px rgba(255,75,24,.7),inset 0 0 16px rgba(120,0,0,.45)}
.item-rainbow-border .hex{animation:itemRainbow 2s linear infinite}.item-darkmatter-border .hex{filter:drop-shadow(0 0 14px #6d3cff) brightness(.8)}.item-omega-border .hex{filter:drop-shadow(0 0 16px #ff4b18) brightness(1.15)}


/* v63: prestige colors advance every four prestige levels.
   P1-4 light pink, P5-8 pink, P9-12 pink-purple, P13-16 purple,
   P17-20 purple-red, P21-24 red, P25-28 orange, P29+ gold. */
.player-name.prestige-whitepink .name-text{color:#ffd5e5;-webkit-text-fill-color:#ffd5e5;text-shadow:0 0 5px rgba(255,190,216,.6)}
.player-name.prestige-darkpink .name-text{color:#c64b9a;-webkit-text-fill-color:#c64b9a;text-shadow:0 0 7px rgba(198,75,154,.7)}
.player-name.prestige-purplered .name-text{color:#c74878;-webkit-text-fill-color:#c74878;text-shadow:0 0 7px rgba(199,72,120,.72)}
.player-name.prestige-orange .name-text{color:#ff963f;-webkit-text-fill-color:#ff963f;text-shadow:0 0 7px rgba(255,150,63,.75)}

.player-name.prestige-whitepink.tier-2 .name-text{background-image:linear-gradient(90deg,#ffd5e5,#fff,#ffd5e5)}
.player-name.prestige-darkpink.tier-2 .name-text{background-image:linear-gradient(90deg,#c64b9a,#f0b7db,#c64b9a)}
.player-name.prestige-purplered.tier-2 .name-text{background-image:linear-gradient(90deg,#c74878,#d58bb6,#c74878)}
.player-name.prestige-orange.tier-2 .name-text{background-image:linear-gradient(90deg,#ff963f,#ffd09f,#ff963f)}

.player-name.prestige-whitepink.tier-3 .name-text{color:#ffd5e5;-webkit-text-fill-color:#ffd5e5;text-shadow:0 0 5px #ffd5e5,0 0 12px #ffb8d2}
.player-name.prestige-darkpink.tier-3 .name-text{color:#c64b9a;-webkit-text-fill-color:#c64b9a;text-shadow:0 0 5px #c64b9a,0 0 12px #8e276d}
.player-name.prestige-purplered.tier-3 .name-text{color:#c74878;-webkit-text-fill-color:#c74878;text-shadow:0 0 5px #c74878,0 0 12px #8f244f}
.player-name.prestige-orange.tier-3 .name-text{color:#ff963f;-webkit-text-fill-color:#ff963f;text-shadow:0 0 5px #ff963f,0 0 12px #d85a00}

.player-name.prestige-whitepink.tier-4 .name-text{background-image:linear-gradient(90deg,#ffd5e5,#fff,#ffc3dc,#ffd5e5);filter:drop-shadow(0 0 6px #ffc3dc)}
.player-name.prestige-darkpink.tier-4 .name-text{background-image:linear-gradient(90deg,#c64b9a,#e590c7,#9f397f,#c64b9a);filter:drop-shadow(0 0 6px #c64b9a)}
.player-name.prestige-purplered.tier-4 .name-text{background-image:linear-gradient(90deg,#c74878,#df6f9a,#9e315f,#c74878);filter:drop-shadow(0 0 6px #c74878)}
.player-name.prestige-orange.tier-4 .name-text{background-image:linear-gradient(90deg,#ff963f,#ffc56f,#ef6d00,#ff963f);filter:drop-shadow(0 0 6px #ff963f)}
