
:root{--paper:#f5f0e7;--card:#fffdf8;--ink:#171717;--muted:#6d685f;--border:#1f1f1f;--yellow:#f1c84b;--green:#6e916e;--red:#d7654f;--blue:#82b7c5;--pink:#e1a5ad;--purple:#9d7fc0;--shadow:7px 7px 0 #1f1f1f}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}.wrap{width:min(1180px,calc(100% - 32px));margin:auto}a{color:inherit;text-decoration:none}.notice{border-bottom:2px solid var(--border);background:#fff9d8;text-align:center;padding:10px 16px;font-size:14px;font-weight:700}
header{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-bottom:2px solid var(--border);gap:16px}.logo{font-size:28px;font-weight:900;letter-spacing:-.055em}.nav{display:flex;align-items:center;gap:15px;font-weight:800;font-size:14px;flex-wrap:wrap}.nav a:hover{text-decoration:underline}.account{display:flex;align-items:center;gap:9px}.avatar{width:38px;height:38px;border:2px solid var(--border);border-radius:50%;object-fit:cover;background:#ddd}.pill,.btn{border:2px solid var(--border);background:var(--card);padding:11px 15px;font:inherit;font-weight:900;cursor:pointer}.btn.primary{background:var(--ink);color:#fff;box-shadow:4px 4px 0 var(--yellow)}.btn:hover{transform:translate(-2px,-2px)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.hero{padding:64px 0 52px}.eyebrow{text-transform:uppercase;font-size:13px;font-weight:900;letter-spacing:.12em}.hero h1,.page-title{font-size:clamp(54px,9vw,110px);line-height:.88;letter-spacing:-.075em;margin:12px 0 24px;max-width:960px}.hero p{font-size:18px;line-height:1.65;color:var(--muted);max-width:760px}.section-head{border-top:2px solid var(--border);padding-top:32px;margin:0 0 24px;display:flex;justify-content:space-between;align-items:end;gap:20px}.section-head h2{font-size:clamp(38px,5vw,64px);line-height:.95;letter-spacing:-.06em;margin:0}.section-head p{color:var(--muted);max-width:480px;line-height:1.55}
.panel{background:var(--card);border:2px solid var(--border);box-shadow:var(--shadow);padding:24px;margin-bottom:70px}.wallet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.stat{border:2px solid var(--border);padding:18px;background:#fff}.stat strong{display:block;font-size:30px}.stat span{color:var(--muted);font-weight:700}
.case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-bottom:30px}.case{background:var(--card);border:2px solid var(--border);padding:0;text-align:left;transition:.18s}.case:hover{transform:translate(-3px,-3px);box-shadow:var(--shadow)}.case-art{height:270px;border-bottom:2px solid var(--border);display:grid;place-items:center}.case.coin-case .case-art{background:#f8dda2}.case.collectible .case-art{background:#dfead8}.cube{width:135px;height:135px;display:grid;grid-template-columns:repeat(5,1fr);gap:3px;transform:rotate(-7deg)}.cube i{border:2px solid var(--border);background:var(--yellow)}.case.collectible .cube i{background:var(--green)}.case-copy{padding:22px}.case-copy h3{font-size:32px;letter-spacing:-.04em;margin:8px 0}.case-copy p{color:var(--muted);line-height:1.55}.case-meta{display:flex;justify-content:space-between;border-top:1px solid #aaa298;padding-top:14px;font-weight:900}.case-actions{display:flex;gap:10px;margin-top:17px;flex-wrap:wrap}
.rare-feed{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:74px}.rare-card{border:2px solid var(--border);background:var(--card);padding:16px}.rare-card strong{display:block;margin-bottom:4px}.rare-card small{color:var(--muted)}
.modal{position:fixed;inset:0;background:rgba(20,18,15,.74);z-index:50;display:none;place-items:center;padding:20px}.modal.show{display:grid}.modal-box{width:min(860px,100%);max-height:90vh;overflow:auto;background:var(--paper);border:3px solid var(--border);box-shadow:12px 12px 0 rgba(0,0,0,.7);padding:28px;position:relative}.close-x{position:absolute;right:14px;top:10px;border:0;background:none;font-size:28px;font-weight:900;cursor:pointer;z-index:6}
.reel-window{position:relative;overflow:hidden;border:3px solid var(--border);background:#eee8de;padding:22px 0;margin:26px 0 20px}.reel-window:before,.reel-window:after{content:"";position:absolute;top:0;bottom:0;width:80px;z-index:3;pointer-events:none}.reel-window:before{left:0;background:linear-gradient(90deg,#eee8de,transparent)}.reel-window:after{right:0;background:linear-gradient(-90deg,#eee8de,transparent)}.reel-pointer{position:absolute;left:50%;top:0;bottom:0;width:4px;background:var(--red);transform:translateX(-50%);z-index:5}.reel-pointer:before,.reel-pointer:after{content:"";position:absolute;left:50%;transform:translateX(-50%);border-left:11px solid transparent;border-right:11px solid transparent}.reel-pointer:before{top:0;border-top:16px solid var(--red)}.reel-pointer:after{bottom:0;border-bottom:16px solid var(--red)}.reward-reel{display:flex;gap:12px;width:max-content;will-change:transform}.reel-item{width:150px;min-width:150px;height:135px;border:2px solid var(--border);background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px;font-weight:900;box-shadow:4px 4px 0 rgba(0,0,0,.15)}.reel-icon{font-size:32px;margin-bottom:9px;width:56px;height:56px;display:grid;place-items:center;border-radius:14px;border:2px solid transparent}.reel-item small{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-top:6px}
.win-reveal{display:none;text-align:center;border:3px solid var(--border);background:#fff9d8;padding:24px;position:relative;overflow:hidden}.win-reveal.show{display:block;animation:winPop .45s ease}.win-reveal .big-icon{font-size:76px;animation:bounce .8s ease}.win-reveal.legendary{background:linear-gradient(135deg,#fff9d8,#f3d5ff)}.confetti{position:absolute;inset:0;pointer-events:none}.confetti span{position:absolute;width:12px;height:12px;animation:fall 1.5s ease-out forwards}
.contents-list{display:grid;gap:10px}.contents-row{display:grid;grid-template-columns:50px 1fr auto;gap:12px;align-items:center;border:2px solid var(--border);background:var(--card);padding:13px}.contents-icon{font-size:28px}.rarity-common{color:#666}.rarity-uncommon{color:#3d7b5a}.rarity-rare{color:#3975a5}.rarity-epic{color:#8d4eb0}.rarity-legendary{color:#c58a00}
.inventory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:70px}.item-card{border:2px solid var(--border);background:var(--card);padding:20px}.item-card.equipped{box-shadow:var(--shadow);background:#fff9d8}.item-icon{font-size:54px}.item-card h3{margin:8px 0}.item-card p{color:var(--muted)}.badge{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--border);padding:4px 7px;background:#fff;font-size:12px;font-weight:900}
.table{width:100%;border-collapse:collapse;background:var(--card);border:2px solid var(--border);margin-bottom:65px}.table th,.table td{padding:15px;border-bottom:1px solid #aaa298;text-align:left}.table th{background:#fff9d8;text-transform:uppercase;font-size:12px;letter-spacing:.08em}.rank{font-size:25px;font-weight:900}.person{display:flex;align-items:center;gap:10px;font-weight:900}.leader-avatar{width:42px;height:42px;border:2px solid var(--border);border-radius:50%;object-fit:cover;background:#ddd}.points{text-align:right!important;font-weight:900}.countdown{font-size:clamp(34px,5vw,62px);font-weight:900;letter-spacing:-.05em}
.game-panel{background:var(--card);border:2px solid var(--border);box-shadow:var(--shadow);padding:24px;margin-bottom:70px}.room-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.room{border:2px solid var(--border);background:#fff;padding:16px}.room strong{display:block;font-size:20px}.flip-stage{text-align:center}.flip-stage>.coin{width:150px;height:150px;border-radius:50%;border:6px solid var(--border);display:grid;place-items:center;font-size:66px;margin:30px auto;background:var(--yellow);transform-style:preserve-3d}.flip-stage>.coin.flipping{animation:coinflip 2.6s cubic-bezier(.2,.8,.2,1)}.winner-banner{display:none;border:3px solid var(--border);background:#fff9d8;padding:22px;text-align:center}.winner-banner.show{display:block;animation:winPop .45s ease}
.hand{display:grid;grid-template-columns:100px 1fr 55px;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid #777}.cards{display:flex;gap:8px;flex-wrap:wrap}.playing-card{width:52px;height:74px;border:2px solid var(--border);background:#fff;display:grid;place-items:center;font-size:20px;font-weight:900}.playing-card.red{color:#b33d31}.playing-card.back{background:var(--blue);color:transparent}.score{border:2px solid var(--border);background:#fff;padding:9px;text-align:center;font-weight:900}
.history{display:grid;gap:10px}.history-row{display:grid;grid-template-columns:1fr auto;gap:12px;border-bottom:1px solid #aaa;padding:10px 0}
@keyframes coinflip{0%{transform:rotateY(0) translateY(0)}35%{transform:rotateY(900deg) translateY(-120px) scale(1.15)}70%{transform:rotateY(1800deg) translateY(-35px)}100%{transform:rotateY(2520deg) translateY(0)}}@keyframes winPop{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:scale(1)}}@keyframes bounce{0%{transform:scale(.3) rotate(-15deg)}60%{transform:scale(1.25) rotate(7deg)}100%{transform:scale(1)}}@keyframes fall{0%{transform:translateY(-30px) rotate(0);opacity:1}100%{transform:translateY(420px) rotate(540deg);opacity:0}}
footer{border-top:2px solid var(--border);padding:28px 0 45px;color:var(--muted);font-size:13px}
.hidden{display:none!important}
@media(max-width:900px){.case-grid,.rare-feed,.inventory-grid,.room-grid,.wallet-grid{grid-template-columns:1fr}.nav a:not(.keep){display:none}.section-head{flex-direction:column;align-items:start}.account .user-name{display:none}.table th:nth-child(3),.table td:nth-child(3){display:none}}
@media(max-width:600px){.reel-item{width:122px;min-width:122px;height:120px}.reel-window:before,.reel-window:after{width:42px}.modal-box{padding:18px}.hand{grid-template-columns:70px 1fr 45px}}

/* Stability fixes */
.case-grid{align-items:stretch}
.case{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.case-art{flex:0 0 auto}
.case-copy{display:flex;flex-direction:column;min-width:0}
.case-copy small{font-size:12px!important;line-height:1.3}
.case-copy h3{font-size:32px!important;line-height:1.05!important;overflow-wrap:anywhere}
.case-copy p{font-size:16px!important;line-height:1.55!important;min-height:72px;max-width:100%;overflow-wrap:anywhere}
.case-meta{margin-top:auto}
.case-actions{margin-top:16px}
.case-actions .btn{white-space:nowrap}

.room small{display:block;margin-top:8px;color:var(--muted)}
.room .room-timer{font-weight:900;color:var(--red)}
.room.expiring{background:#fff1ec}

.game-result-overlay{
  position:fixed;inset:0;display:none;place-items:center;
  background:rgba(20,18,15,.66);z-index:70;padding:20px
}
.game-result-overlay.show{display:grid}
.game-result-card{
  width:min(540px,100%);border:3px solid var(--border);padding:34px;
  text-align:center;box-shadow:12px 12px 0 rgba(0,0,0,.65);
  animation:winPop .35s ease
}
.game-result-card.win{background:#dff2df}
.game-result-card.lose{background:#f6d8d3}
.game-result-card.push{background:#fff2c8}
.game-result-card .result-icon{font-size:82px;animation:bounce .7s ease}
.game-result-card h2{font-size:48px;letter-spacing:-.05em;margin:8px 0}
.game-result-card p{font-size:18px}
.game-result-card.win{box-shadow:12px 12px 0 #4f7f54}
.game-result-card.lose{box-shadow:12px 12px 0 #a8483c}
.game-result-card.push{box-shadow:12px 12px 0 #b68e1d}

.coinflip-stage{
  position:relative;min-height:360px;display:grid;place-items:center
}
.coinflip-track{
  width:min(620px,100%);height:190px;border:3px solid var(--border);
  background:linear-gradient(90deg,#dfead8 0 50%,#f8dda2 50% 100%);
  position:relative;overflow:hidden
}
.coinflip-marker{
  position:absolute;left:50%;top:0;bottom:0;width:4px;background:var(--red);
  transform:translateX(-50%);z-index:4
}
.flip-coin{
  position:absolute;left:50%;top:50%;width:130px;height:130px;border-radius:50%;
  border:5px solid var(--border);display:grid;place-items:center;font-size:56px;
  transform:translate(-50%,-50%);background:var(--yellow);
  box-shadow:8px 8px 0 rgba(0,0,0,.2)
}
.flip-coin.animate-flower{animation:flipFlower 2.6s cubic-bezier(.18,.75,.15,1) forwards}
.flip-coin.animate-sun{animation:flipSun 2.6s cubic-bezier(.18,.75,.15,1) forwards}
@keyframes flipFlower{
  0%{transform:translate(-50%,-50%) rotateY(0) scale(1)}
  35%{transform:translate(-50%,-120%) rotateY(900deg) scale(1.18)}
  75%{transform:translate(-50%,-55%) rotateY(1800deg) scale(1.05)}
  100%{transform:translate(-50%,-50%) rotateY(2160deg) scale(1)}
}
@keyframes flipSun{
  0%{transform:translate(-50%,-50%) rotateY(0) scale(1)}
  35%{transform:translate(-50%,-120%) rotateY(990deg) scale(1.18)}
  75%{transform:translate(-50%,-55%) rotateY(1890deg) scale(1.05)}
  100%{transform:translate(-50%,-50%) rotateY(2340deg) scale(1)}
}

/* Navigation and profile consistency */
header{display:grid;grid-template-columns:auto 1fr auto;align-items:center}
.nav{justify-self:center;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.nav a{order:initial!important}
.account-profile-link{display:flex;align-items:center;gap:9px;text-decoration:none}
.account-profile-link:hover .user-name{text-decoration:underline}
.account{justify-self:end}

/* Subtle leaderboard header */
.leader-topline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  border-top:2px solid var(--border);
  border-bottom:2px solid var(--border);
  padding:16px 0;
  margin-bottom:42px;
}
.leader-topline > div{
  display:flex;
  align-items:baseline;
  gap:14px;
  flex-wrap:wrap;
}
.leader-topline p{
  margin:0;
  color:var(--muted);
  font-size:14px;
}
.countdown-inline{
  font-size:22px;
  letter-spacing:-.02em;
}

/* Compact prizes */
.compact-prizes-section{
  border-top:2px solid var(--border);
  padding:18px 0 40px;
}
.compact-prizes-title{
  font-size:18px;
  font-weight:900;
  margin-bottom:12px;
}
.compact-prizes{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.compact-prizes span{
  border:2px solid var(--border);
  background:var(--card);
  padding:9px 12px;
  font-size:13px;
}
.compact-prizes strong{margin-right:5px}

/* Keep header stable across all pages */
@media(max-width:900px){
  header{grid-template-columns:auto auto}
  .nav{
    grid-column:1 / -1;
    grid-row:2;
    justify-self:start;
    width:100%;
    padding-top:12px;
  }
  .nav a{display:inline!important}
  .account{justify-self:end}
}
@media(max-width:600px){
  .leader-topline{align-items:flex-start;flex-direction:column}
  .countdown-inline{font-size:19px}
}

.nav a.active-nav{
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:4px;
}

/* Final polish */
.leaderboard-heading-row{
  display:flex;justify-content:space-between;align-items:end;gap:20px;
  border-top:2px solid var(--border);padding-top:28px;margin-bottom:22px
}
.leaderboard-heading-row h2{margin:0;font-size:clamp(38px,5vw,64px);letter-spacing:-.06em}
.leaderboard-timer{text-align:right;font-size:13px;color:var(--muted)}
.leaderboard-timer strong{display:block;font-size:18px;color:var(--ink);margin-top:3px}
.leader-topline{display:none!important}
.compact-prizes-section{border-top:1px solid var(--border);padding-top:14px}
.compact-prizes-title{font-size:15px}
.compact-prizes span{font-size:12px;padding:7px 9px;border-width:1px}

.preset-avatar{
  width:42px;height:42px;border:2px solid var(--border);border-radius:50%;
  display:grid;place-items:center;background:#fff9d8;font-size:22px
}
.preset-avatar.large{width:82px;height:82px;font-size:42px}
.item-card .avatar-preview{margin:8px 0}

.simple-flip-wrap{text-align:center;padding:18px 0}
.simple-flip-coin{
  width:150px;height:150px;border-radius:50%;border:6px solid var(--border);
  display:grid;place-items:center;margin:28px auto;font-size:66px;background:var(--yellow);
  box-shadow:8px 8px 0 rgba(0,0,0,.18);transform-style:preserve-3d
}
.simple-flip-coin.flipping{animation:simpleFlip 2.2s cubic-bezier(.2,.75,.2,1)}
@keyframes simpleFlip{
  0%{transform:rotateY(0) scale(1)}
  40%{transform:rotateY(900deg) scale(1.2)}
  75%{transform:rotateY(1620deg) scale(1.08)}
  100%{transform:rotateY(2160deg) scale(1)}
}
.coinflip-stage,.coinflip-track,.coinflip-marker,.flip-coin{display:none!important}

.bj-toast{
  position:fixed;right:24px;bottom:24px;z-index:80;
  min-width:280px;max-width:380px;border:2px solid var(--border);
  padding:16px 18px;box-shadow:6px 6px 0 rgba(0,0,0,.25);
  opacity:0;transform:translateY(18px);pointer-events:none;
  transition:.25s ease
}
.bj-toast.show{opacity:1;transform:translateY(0)}
.bj-toast.win{background:#dff2df;border-color:#4f7f54}
.bj-toast.lose{background:#f6d8d3;border-color:#a8483c}
.bj-toast.push{background:#fff2c8;border-color:#b68e1d}
.bj-toast strong{display:block;font-size:20px;margin-bottom:3px}
.game-result-overlay{display:none!important}

@media(max-width:700px){
  .leaderboard-heading-row{align-items:flex-start;flex-direction:column}
  .leaderboard-timer{text-align:left}
}

/* Bilingual + case layout correction */
.header-tools{display:flex;align-items:center;gap:12px;justify-self:end}
.lang-switch{display:flex;border:2px solid var(--border);background:var(--card)}
.lang-btn{border:0;background:transparent;padding:8px 10px;font-weight:900;cursor:pointer}
.lang-btn.active{background:var(--ink);color:#fff}

.case-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.case{display:flex!important;flex-direction:column!important;min-width:0!important;height:100%}
.case-art{height:270px!important;display:grid!important;place-items:center!important;overflow:hidden!important}
.case-copy{display:flex!important;flex-direction:column!important;flex:1!important;padding:22px!important}
.case-copy p{min-height:74px!important}
.case-meta{margin-top:auto!important}
.case-actions{display:flex!important;gap:10px!important;flex-wrap:wrap!important}

.case-symbol{
  width:150px;height:150px;border-radius:50%;
  border:5px solid var(--border);display:grid;place-items:center;
  font-size:84px;font-weight:900;box-shadow:10px 10px 0 rgba(0,0,0,.18)
}
.coin-symbol{background:#f1c84b}
.collectible-symbol{background:#6e916e;color:#fff;border-radius:20px;transform:rotate(-6deg)}

@media(max-width:900px){
  .case-grid{grid-template-columns:1fr}
  .header-tools{grid-column:2;grid-row:1}
}

/* True two-sided coinflip */
.simple-flip-coin{
  position:relative;
  transform-style:preserve-3d;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.coin-face{
  position:absolute;
  inset:0;
  border-radius:50%;
  border:6px solid var(--border);
  display:grid;
  place-items:center;
  font-size:66px;
  backface-visibility:hidden;
  box-shadow:8px 8px 0 rgba(0,0,0,.18);
}
.coin-front{
  background:#dfead8;
  transform:rotateY(0deg);
}
.coin-back{
  background:#f8dda2;
  transform:rotateY(180deg);
}
.simple-flip-coin.flipping-flower{
  animation:flipToFlower 2.4s cubic-bezier(.18,.76,.18,1) forwards;
}
.simple-flip-coin.flipping-sun{
  animation:flipToSun 2.4s cubic-bezier(.18,.76,.18,1) forwards;
}
@keyframes flipToFlower{
  0%{transform:rotateY(0deg) translateY(0) scale(1)}
  35%{transform:rotateY(900deg) translateY(-90px) scale(1.16)}
  70%{transform:rotateY(1800deg) translateY(-25px) scale(1.05)}
  100%{transform:rotateY(2160deg) translateY(0) scale(1)}
}
@keyframes flipToSun{
  0%{transform:rotateY(0deg) translateY(0) scale(1)}
  35%{transform:rotateY(990deg) translateY(-90px) scale(1.16)}
  70%{transform:rotateY(1890deg) translateY(-25px) scale(1.05)}
  100%{transform:rotateY(2340deg) translateY(0) scale(1)}
}

/* Final verified card isolation */
.case.coin-case{width:auto!important;height:100%!important;margin:0!important;border-radius:0!important;font-size:inherit!important;background:var(--card)!important;transform:none}
.case.coin-case:hover{transform:translate(-3px,-3px)!important}

/* ============================================================
   linebck craft-site visual system — community edition
   ============================================================ */
:root{
  --paper:#FFFBF2;
  --card:#fffef9;
  --ink:#2C3527;
  --muted:#687164;
  --border:rgba(55,101,47,.26);
  --yellow:#FBF2C8;
  --green:#37652F;
  --green-dark:#274A22;
  --red:#D6452F;
  --blue:#CBDCF6;
  --pink:#F8DCDC;
  --purple:#E6DCF4;
  --mint:#DCEBCE;
  --soil:#6B4F3A;
  --panel:#f7f4ea;
  --track:#e8ecdf;
  --gridline:rgba(55,101,47,.05);
  --shadow:5px 5px 0 rgba(55,101,47,.13);
  --pixel:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji","Segoe UI Symbol","Android Emoji",EmojiSymbols;
  --body:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji","Segoe UI Symbol","Android Emoji",EmojiSymbols;
}
*{box-sizing:border-box}
html{background:var(--paper)}
body{
  background-color:var(--paper);
  background-image:
    linear-gradient(rgba(55,101,47,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(55,101,47,.035) 1px,transparent 1px);
  background-size:26px 26px;
  color:var(--ink);
  font-family:var(--body);
  line-height:1.6;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0 0 auto 0;
  height:12px;
  z-index:60;
  pointer-events:none;
  background:linear-gradient(90deg,var(--mint) 0 20%,var(--blue) 20% 40%,var(--yellow) 40% 60%,var(--pink) 60% 80%,var(--purple) 80%);
}
.wrap{width:min(1080px,calc(100% - 44px));margin:auto}
a{color:inherit}
.notice{
  margin-top:12px;
  border:0;
  border-bottom:2px solid var(--border);
  background:rgba(251,242,200,.82);
  color:var(--soil);
  text-align:center;
  padding:10px 18px;
  font-family:var(--pixel);
  font-size:.72rem;
  line-height:1.45;
  font-weight:700;
}
header{
  position:relative;
  padding:19px 0 17px;
  border-bottom:2px solid var(--border);
  gap:18px;
}
.logo{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--green-dark);
  font-family:var(--pixel);
  font-size:1.16rem;
  font-weight:900;
  letter-spacing:.01em;
}
.logo::before{
  content:"";
  width:29px;
  height:29px;
  flex:0 0 29px;
  background:url('/img/tulip.png') center/contain no-repeat;
  image-rendering:pixelated;
}
.nav{gap:5px;font-family:var(--pixel);font-size:.67rem;font-weight:700}
.nav a{
  padding:7px 9px;
  border-radius:8px;
  color:var(--green-dark);
  transition:background .12s,transform .12s;
}
.nav a:hover{background:var(--mint);text-decoration:none;transform:translateY(-1px)}
.nav a.active-nav,.active-nav{background:var(--mint);color:var(--green-dark);text-decoration:none}
.header-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.lang-switch{
  display:inline-flex;
  align-items:center;
  gap:1px;
  padding:2px;
  border:1.5px solid var(--border);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  box-shadow:2px 2px 0 rgba(55,101,47,.08);
}
.lang-btn{
  min-width:0;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#6b7466;
  padding:4px 7px;
  font-family:var(--pixel);
  font-size:.56rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
}
.lang-btn:hover{transform:none;background:rgba(55,101,47,.08)}
.lang-btn.active{background:var(--green);color:#fff}
.account{gap:8px;font-size:.82rem}
.avatar{width:35px;height:35px;border:2px solid var(--green);box-shadow:2px 2px 0 var(--border)}
.pill,.btn,select,input{
  border:2px solid var(--green-dark);
  border-radius:9px;
  font:inherit;
}
.pill{background:#fff;padding:10px 13px}
.btn{
  background:#fff;
  color:var(--green-dark);
  padding:11px 15px;
  font-family:var(--pixel);
  font-size:.68rem;
  font-weight:700;
  box-shadow:3px 3px 0 var(--border);
  transition:transform .12s,box-shadow .12s;
}
.btn.primary{background:var(--red);color:#fff;border-color:#9C2E1D;box-shadow:4px 4px 0 rgba(156,46,29,.28)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--border)}
.btn.primary:hover{box-shadow:6px 6px 0 rgba(156,46,29,.28)}
.hero{padding:58px 0 46px}
.eyebrow{
  display:inline-block;
  width:auto;
  padding:6px 11px;
  border:2px solid rgba(107,79,58,.22);
  border-radius:7px;
  background:var(--yellow);
  color:var(--soil);
  font-family:var(--pixel);
  font-size:.64rem;
  font-weight:700;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.hero h1,.page-title{
  max-width:880px;
  margin:17px 0 20px;
  color:var(--green-dark);
  font-family:var(--pixel);
  font-size:clamp(2.2rem,6vw,4.8rem);
  line-height:1.05;
  letter-spacing:-.045em;
}
.hero p{max-width:720px;color:var(--ink);font-size:1.04rem;line-height:1.68}
.section-head{
  border-top:2px solid var(--border);
  padding-top:28px;
  margin-bottom:22px;
  align-items:flex-start;
}
.section-head h2,.leaderboard-heading-row h2{
  color:var(--green-dark);
  font-family:var(--pixel);
  font-size:clamp(1.35rem,3.2vw,2.05rem);
  line-height:1.2;
  letter-spacing:-.025em;
}
.section-head p{color:var(--muted);font-size:.96rem}
.panel,.game-panel{
  background:rgba(255,255,255,.92);
  border:2.5px solid var(--border);
  border-radius:15px;
  box-shadow:var(--shadow);
  padding:24px;
}
.wallet-grid{gap:14px}
.stat{
  border:2px solid var(--border);
  border-radius:11px;
  background:var(--paper);
  padding:18px;
}
.stat strong{color:var(--green-dark);font-family:var(--pixel);font-size:1.65rem}
.stat span{color:var(--muted);font-size:.83rem}
.case-grid{gap:22px}
.case{
  overflow:hidden;
  border:2.5px solid var(--border)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:4px 4px 0 rgba(55,101,47,.10);
}
.case:hover{transform:translate(-3px,-3px)!important;box-shadow:7px 7px 0 rgba(55,101,47,.14)!important}
.case-art{height:235px;border-bottom:2px solid var(--border)}
.case.coin-case .case-art{background:var(--yellow)}
.case.collectible .case-art{background:var(--purple)}
.case-symbol{font-family:var(--pixel);color:var(--green-dark);filter:drop-shadow(6px 7px 0 rgba(55,101,47,.13))}
.case-copy{padding:23px}
.case-copy small{color:var(--soil);font-family:var(--pixel);font-size:.61rem}
.case-copy h3{color:var(--green-dark);font-family:var(--pixel);font-size:1.45rem;letter-spacing:-.025em}
.case-copy p{color:var(--muted)}
.case-meta span{border:1.5px solid var(--border);border-radius:999px;background:var(--paper);font-family:var(--pixel);font-size:.56rem}
.rare-feed,.inventory-grid,.room-grid,.history{gap:14px}
.rare-card,.inventory-card,.room-card,.history-item,.leaderboard-card{
  border:2px solid var(--border);
  border-radius:12px;
  background:#fff;
  box-shadow:3px 3px 0 rgba(55,101,47,.08);
}
.table{overflow:hidden;border:2px solid var(--border);border-radius:13px;background:#fff;box-shadow:var(--shadow)}
.table th{background:var(--mint);color:var(--green-dark);font-family:var(--pixel);font-size:.62rem}
.table td,.table th{border-color:var(--border)}
.leaderboard-timer,.compact-prizes{border-color:var(--border);border-radius:10px;background:var(--yellow)}
.modal{background:rgba(39,74,34,.48);backdrop-filter:blur(4px)}
.modal-box{
  border:2.5px solid var(--green-dark);
  border-radius:16px;
  background:var(--paper);
  box-shadow:10px 10px 0 rgba(39,74,34,.3);
}
.close-x{border-color:var(--green-dark);border-radius:8px;color:var(--green-dark)}
.reel-window,.contents-list,.hand{border-color:var(--border);border-radius:12px;background:#fff}
footer{
  margin-top:64px;
  border-top:2px solid var(--border);
  padding:28px 0 40px;
  color:var(--muted);
  font-family:var(--pixel);
  font-size:.64rem;
}

@media(max-width:900px){
  header{display:grid;grid-template-columns:1fr auto;align-items:center}
  .nav{grid-column:1/-1;order:3;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px;scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a{white-space:nowrap}
  .header-tools{grid-column:2}
  .case-grid{grid-template-columns:1fr}
  .wallet-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:700px){
  .wrap{width:min(100% - 36px,1080px)}
  .notice{padding:9px 18px;font-size:.62rem}
  header{padding:14px 0 12px;gap:11px}
  .logo{font-size:1rem}.logo::before{width:25px;height:25px;flex-basis:25px}
  .header-tools{gap:7px}.account{font-size:.75rem}
  .avatar{width:31px;height:31px}
  .lang-switch{padding:1px}.lang-btn{padding:4px 6px;font-size:.5rem}
  .nav{margin-inline:-4px;padding-inline:4px;gap:2px}
  .nav a{font-size:.58rem;padding:7px 8px}
  .hero{padding:40px 0 34px}
  .eyebrow{font-size:.57rem;padding:5px 9px}
  .hero h1,.page-title{font-size:clamp(2rem,12vw,3.05rem);margin:14px 0 16px;overflow-wrap:anywhere}
  .hero p{font-size:.96rem}
  .section-head{display:block;padding-top:24px}.section-head p{margin-top:10px}
  .wallet-grid{grid-template-columns:1fr}
  .panel,.game-panel{padding:18px;border-radius:13px}
  .case-art{height:190px}.case-copy{padding:19px}.case-copy h3{font-size:1.22rem}
  .case-actions{display:grid;grid-template-columns:1fr;gap:9px}.case-actions .btn{width:100%}
  .btn{font-size:.62rem;padding:11px 12px}
  .inventory-grid,.room-grid{grid-template-columns:1fr}
  .table{display:block;overflow-x:auto}
  .leaderboard-heading-row{display:block}.leaderboard-timer{margin-top:12px}
  .compact-prizes{display:grid;gap:8px}
  .modal{padding:14px}.modal-box{width:min(100%,560px);padding:20px}
  footer{margin-top:46px;padding-bottom:32px}
}
@media(max-width:420px){
  .wrap{width:min(100% - 32px,1080px)}
  .header-tools{max-width:155px}
  .account .pill{padding:7px 9px;font-size:.67rem}
  .hero h1,.page-title{font-size:clamp(1.85rem,11.5vw,2.65rem)}
  .case-art{height:165px}
  .case-symbol{font-size:4.4rem}
  .stat strong{font-size:1.45rem}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* 2026-07 polish: clearer case values, calmer leaderboard, darker blackjack table */
.case-meta{gap:12px;align-items:center}
.case-meta span{padding:7px 11px!important;font-size:.68rem!important;line-height:1.2!important;background:#fff!important;border:2px solid var(--border)!important}
.leaderboard-timer{background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;color:var(--muted)!important}
.compact-prizes{background:transparent!important;border:0!important;border-radius:0!important;padding:0!important}
.compact-prizes span{background:#fff!important;border:2px solid var(--border)!important;border-radius:8px!important;padding:10px 13px!important;font-size:.78rem!important}
/* Calmer game surfaces: light sage for Coinflip, muted felt for Blackjack */
.coinflip-page .game-panel{
  background:#e8efe3!important;
  border-color:#b8c9b3!important;
  box-shadow:6px 6px 0 rgba(55,101,47,.12)!important;
  color:var(--ink)!important;
}
.coinflip-page .game-panel .pill{background:#fffef9!important;color:var(--ink)!important}

.blackjack-page .game-panel{
  background:#71816f!important;
  border-color:#536450!important;
  box-shadow:7px 7px 0 rgba(64,80,61,.18)!important;
  color:#fff!important;
}
.blackjack-page .game-panel .hand{background:rgba(255,255,255,.10)!important;border:1px solid rgba(255,255,255,.28)!important;border-radius:12px!important;padding:18px!important;margin-bottom:14px!important}
.blackjack-page .game-panel .playing-card{background:#fffef9!important;border-color:#435141!important;color:#17251a!important;box-shadow:3px 4px 0 rgba(0,0,0,.17)!important}
.blackjack-page .game-panel .playing-card.red{color:#bd392e!important}
.blackjack-page .game-panel .playing-card.back{background:#dce6f5!important}
.blackjack-page .game-panel .score{background:#fffef9!important;border-color:#435141!important;color:#17251a!important;border-radius:8px!important}
.blackjack-page .game-panel .pill{background:#fffef9!important;color:#17251a!important}
.blackjack-page .game-panel #message{color:#fff!important}
.profile-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
#history{max-height:none;overflow:visible}
@media(max-width:800px){.profile-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.profile-stats{grid-template-columns:1fr}}

/* Admin dashboard */
.admin-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:22px 0 34px}
.admin-metric{background:#fff;border:2px solid var(--border);border-radius:13px;padding:18px;box-shadow:var(--shadow)}
.admin-metric span{display:block;color:var(--muted);font-size:.78rem;font-family:var(--pixel)}
.admin-metric strong{display:block;font-size:1.8rem;color:var(--green-dark);margin-top:5px}
.admin-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 18px}
.admin-toolbar input{flex:1;min-width:220px}
.admin-table-wrap{overflow:auto;background:#fff;border:2px solid var(--border);border-radius:13px;box-shadow:var(--shadow)}
.admin-table{width:100%;border-collapse:collapse;min-width:940px}
.admin-table th,.admin-table td{padding:12px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle}
.admin-table th{font-family:var(--pixel);font-size:.66rem;background:var(--mint);color:var(--green-dark)}
.admin-user{display:flex;align-items:center;gap:10px}.admin-user img{width:38px;height:38px;border-radius:50%;border:2px solid var(--border);object-fit:cover;background:#eee}
.admin-actions{display:flex;gap:6px;flex-wrap:wrap}.admin-actions button{padding:7px 9px;font-size:.74rem}
.admin-drawer{position:fixed;inset:0 0 0 auto;width:min(520px,100%);background:var(--paper);border-left:3px solid var(--border);z-index:100;padding:24px;overflow:auto;box-shadow:-10px 0 30px rgba(0,0,0,.16);transform:translateX(105%);transition:.2s ease}
.admin-drawer.open{transform:translateX(0)}
.admin-drawer-head{display:flex;justify-content:space-between;align-items:start;gap:12px}.admin-drawer h2{font-family:var(--pixel);font-size:1.35rem}.admin-form{background:#fff;border:2px solid var(--border);border-radius:12px;padding:16px;margin-top:16px}.admin-form-row{display:grid;grid-template-columns:1fr auto;gap:9px;align-items:end}.admin-history{display:grid;gap:8px;margin-top:10px}.admin-history div{background:#fff;border:1px solid var(--border);border-radius:8px;padding:9px;font-size:.82rem}
@media(max-width:900px){.admin-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.admin-grid{grid-template-columns:1fr}.compact-prizes{display:grid!important}.compact-prizes span{width:100%}.case-meta span{font-size:.63rem!important}.game-panel{padding:14px!important}.game-panel .hand{grid-template-columns:64px 1fr 44px!important;padding:12px!important}.admin-drawer{padding:18px}}

/* Monthly rounds, podium and Hall of Fame */
.podium-row td{font-weight:700}
.podium-1 td{background:rgba(251,242,200,.62)}
.podium-2 td{background:rgba(220,235,206,.52)}
.podium-3 td{background:rgba(248,220,220,.46)}
.podium-row .rank{font-size:1.25rem}
.leaderboard-timer strong.expired{color:var(--poppy)}
.previous-winners{margin-top:38px;padding:24px;background:rgba(220,235,206,.38);border:2px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}
.winner-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.winner-card{position:relative;display:grid;justify-items:center;gap:7px;text-align:center;background:#fff;border:2px solid var(--border);border-radius:14px;padding:20px 14px;box-shadow:4px 4px 0 rgba(55,101,47,.1)}
.winner-card strong{font-family:var(--pixel);font-size:.8rem;color:var(--green-dark)}
.winner-card>span:last-child{font-weight:700;color:var(--muted)}
.winner-rank{font-size:1.7rem}
.winner-avatar{width:58px;height:58px;border-radius:50%;object-fit:cover;border:3px solid var(--border);background:#fff}
.preset-avatar.big{font-size:2.5rem}
.winner-1{border-color:#d7b84b}.winner-2{border-color:#aab5b0}.winner-3{border-color:#c68f70}
.winner-cards.compact .winner-card{padding:14px 10px}
.admin-round-panel{margin:0 0 38px;padding:22px;background:rgba(203,220,246,.28);border:2px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}
.admin-round-panel .section-head{padding-top:0}
.admin-round-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:18px}
.admin-round-actions button:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.4)}
.admin-round-history{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:16px;padding:12px 14px;background:#fff;border:1px solid var(--border);border-radius:10px}
@media(max-width:700px){.winner-cards{grid-template-columns:1fr}.previous-winners,.admin-round-panel{padding:18px}.admin-round-panel .leaderboard-timer{margin-top:14px}.admin-round-history{display:grid}}

/* Community landing */
.community-landing{min-height:100vh;display:flex;flex-direction:column;background:var(--paper)}
.landing-strip{height:12px;display:flex}.landing-strip span{flex:1}.landing-strip span:nth-child(1){background:#dcebcf}.landing-strip span:nth-child(2){background:#cbdcf6}.landing-strip span:nth-child(3){background:#fbf2c8}.landing-strip span:nth-child(4){background:#f8dcdc}.landing-strip span:nth-child(5){background:#e6dcf4}
.landing-shell{width:min(980px,100%);margin:auto;padding:24px}
.landing-topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px}
.landing-card{position:relative;text-align:center;background:#fff;border:2px solid rgba(55,101,47,.22);border-radius:24px;padding:clamp(34px,7vw,76px) clamp(22px,7vw,82px);box-shadow:8px 8px 0 rgba(55,101,47,.11);overflow:hidden}
.landing-card h1{max-width:780px;margin:12px auto 18px}.landing-card>p{max-width:610px;margin:0 auto 26px}.landing-flower{width:100px;height:auto;margin:0 auto 18px;image-rendering:pixelated;filter:drop-shadow(5px 6px 0 rgba(55,101,47,.12))}.twitch-login{min-width:min(360px,100%);font-size:1rem;padding:16px 24px}.landing-note{font-size:.86rem;color:#687164;margin-top:18px!important}.social-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:28px;padding-top:24px;border-top:1px solid rgba(55,101,47,.15)}.social-row a{font-weight:700}
.winner-badges{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.winner-badge{background:#fff;border:2px solid rgba(55,101,47,.18);border-radius:14px;padding:16px;display:flex;align-items:center;gap:12px}.winner-badge .medal{font-size:2rem}.winner-badge small{display:block;color:#687164}
.prize-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:800}.prize-pending{background:#fbf2c8;color:#6b4f3a}.prize-delivered{background:#dcebcf;color:#274a22}
@media(max-width:600px){.landing-shell{padding:18px}.landing-topbar{margin-bottom:20px}.landing-card{border-radius:18px;padding:34px 20px}.landing-flower{width:78px}.social-row{gap:12px 16px}.twitch-login{min-width:0;width:100%}}

/* 2026 live leaderboard podium */
.leaderboard-hero{padding-bottom:34px}
.podium-section{border-top:2px solid var(--border);padding-top:28px}
.podium-topline{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:26px}
.podium-topline h2{font-size:clamp(30px,4vw,50px);margin:4px 0 0;letter-spacing:-.05em}
.podium-topline small{display:block;margin-top:5px;color:var(--muted)}
.live-podium{display:grid;grid-template-columns:1fr 1.14fr 1fr;align-items:end;gap:14px;min-height:390px;padding:18px 12px 0;background:linear-gradient(180deg,rgba(203,220,246,.18),rgba(251,242,200,.28));border:2px solid var(--border);border-radius:22px 22px 8px 8px;overflow:hidden}
.podium-slot{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:0;transition:transform .35s ease}
.podium-slot:hover{transform:translateY(-5px)}
.podium-person{width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;padding:0 8px 14px}
.podium-user-avatar{width:78px;height:78px;border-radius:50%;object-fit:cover;border:4px solid var(--green);background:#fff;box-shadow:5px 5px 0 rgba(44,53,39,.18)}
.place-1 .podium-user-avatar{width:100px;height:100px;border-color:#c99a17}
.place-2 .podium-user-avatar{border-color:#8a98a5}
.place-3 .podium-user-avatar{border-color:#a96b38}
.podium-person strong{font-size:clamp(17px,2vw,25px);max-width:100%;overflow:hidden;text-overflow:ellipsis}
.podium-person>span{font-size:13px;color:var(--muted)}
.podium-person>b{font-size:18px}
.podium-person small{font-size:11px;line-height:1.35;min-height:30px;color:var(--green-dark)}
.podium-crown{font-size:32px;margin-bottom:6px;filter:drop-shadow(2px 3px 0 rgba(0,0,0,.1))}
.place-1 .podium-crown{font-size:46px}
.podium-block{width:100%;height:112px;display:flex;flex-direction:column;justify-content:center;align-items:center;border:3px solid var(--border);border-bottom:0;background:#e6d6c2;box-shadow:7px 0 0 rgba(44,53,39,.09)}
.place-1 .podium-block{height:176px;background:#f7dc70}
.place-2 .podium-block{height:132px;background:#d9e1e5}
.place-3 .podium-block{height:94px;background:#ddb28c}
.podium-block strong{font-size:46px;line-height:1}.podium-block span{font-size:11px;font-weight:900;letter-spacing:.16em}
.podium-empty{padding:38px 0;color:var(--muted)}
.rank-ticker{display:flex;gap:10px;overflow-x:auto;padding:12px 0 4px;scrollbar-width:thin}
.ticker-entry{min-width:240px;display:flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--card);padding:8px 10px;border-radius:999px;white-space:nowrap}
.ticker-rank{font-weight:900}.ticker-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;border:1px solid var(--border)}
.ticker-entry>span:last-child{margin-left:auto;color:var(--muted);font-size:12px}.rank-move{font-size:11px}.rank-move.up{color:#277a35}.rank-move.down{color:#b0372a}.rank-move.same{color:#a49a84}
.prize-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0 54px}
.prize-card{display:flex;flex-direction:column;gap:6px;border:2px solid var(--border);padding:17px;background:var(--card);box-shadow:5px 5px 0 rgba(44,53,39,.08)}
.prize-first{background:#fff4c2}.prize-second{background:#eef2f3}.prize-third{background:#f4dfcd}.prize-place{font-size:11px;font-weight:900;letter-spacing:.13em}.prize-card strong{font-size:17px}.prize-card>span:last-child{font-size:13px;color:var(--muted)}
.live-dot{display:flex;align-items:center;gap:7px;font-weight:900}.live-dot i{width:10px;height:10px;border-radius:50%;background:#3d9b4d;box-shadow:0 0 0 5px rgba(61,155,77,.14);animation:livePulse 1.6s infinite}@keyframes livePulse{50%{box-shadow:0 0 0 9px rgba(61,155,77,0)}}
.admin-reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.admin-reward-grid .btn{white-space:normal}
@media(max-width:760px){.podium-topline{align-items:flex-start;flex-direction:column}.live-podium{grid-template-columns:1fr;align-items:stretch;min-height:0;padding:12px}.podium-slot{display:grid;grid-template-columns:52px 1fr;align-items:center;border:2px solid var(--border);background:var(--card);padding:10px}.place-1{order:1}.place-2{order:2}.place-3{order:3}.podium-crown{grid-row:1 / 3;margin:0}.podium-person{padding:0;align-items:flex-start;text-align:left}.podium-user-avatar,.place-1 .podium-user-avatar{width:54px;height:54px}.podium-block{display:none}.prize-showcase{grid-template-columns:1fr}.admin-reward-grid{grid-template-columns:1fr}}


/* XP and community levels · collection-road style */
.level-card{margin-top:22px;padding:22px;background:#fffdf7;border:2px solid var(--border);border-radius:14px;box-shadow:5px 5px 0 rgba(44,53,39,.08)}
.level-overview{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:18px;align-items:stretch}
.level-copy{padding:18px;border:1.5px solid var(--border);background:var(--paper);box-shadow:3px 3px 0 rgba(55,101,47,.06)}
.level-kicker,.reward-roadmap-head>span{font-family:var(--pixel);font-size:.61rem;letter-spacing:.13em;color:var(--green-dark)}
.level-title-row,.level-meta{display:flex;align-items:center;justify-content:space-between;gap:16px}
.level-title-row h2{margin:8px 0 0;font-size:clamp(1.45rem,3vw,2.1rem)}
.level-title-row>strong{font-family:var(--pixel);font-size:.75rem;color:var(--green-dark);border:1.5px solid var(--border);background:var(--yellow);padding:7px 9px;box-shadow:2px 2px 0 rgba(55,101,47,.1)}
.level-track{position:relative;height:15px;margin:22px 0 10px;padding:2px;background:#fff;border:1.5px solid var(--border);overflow:hidden}
.level-track:after{content:"";position:absolute;inset:2px;background:repeating-linear-gradient(90deg,transparent 0 23px,rgba(55,101,47,.13) 23px 24px);pointer-events:none}
.level-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),#d6b94d);transition:width .45s ease}
.level-meta{font-size:.8rem;color:var(--muted)}
.next-level-reward{display:grid;grid-template-columns:118px 1fr;align-items:center;gap:16px;padding:14px;background:var(--yellow);border:1.5px solid var(--border);box-shadow:3px 3px 0 rgba(55,101,47,.08)}
.reward-preview-art{position:relative;aspect-ratio:1;background:#fff;border:1.5px solid var(--border);padding:8px;overflow:hidden}
.reward-preview-art img{display:block;width:100%;height:100%;object-fit:contain}
.reward-lock{position:absolute;right:7px;bottom:7px;width:25px;height:20px;background:var(--green-dark);border:3px solid #fff;box-shadow:0 0 0 1.5px var(--green-dark)}
.reward-lock:before{content:"";position:absolute;left:4px;top:-13px;width:11px;height:13px;border:3px solid var(--green-dark);border-bottom:0;border-radius:8px 8px 0 0;background:transparent}
.reward-preview-copy{display:grid;gap:5px;min-width:0}
.reward-preview-copy span{font-family:var(--pixel);font-size:.55rem;letter-spacing:.1em;color:var(--soil)}
.reward-preview-copy strong{font-size:1rem;line-height:1.25;color:var(--green-dark)}
.reward-preview-copy small{color:var(--muted);font-weight:700}
.reward-roadmap-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:24px 0 13px;padding-top:18px;border-top:1px dashed var(--border)}
.reward-roadmap-head small{color:var(--muted);text-align:right}
.reward-roadmap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.reward-step{position:relative;display:grid;align-content:start;gap:5px;min-width:0;padding:12px;background:#fff;border:1.5px solid var(--border);box-shadow:3px 3px 0 rgba(55,101,47,.06);overflow:hidden}
.reward-step-line{position:absolute;left:0;right:0;top:0;height:5px;background:var(--border)}
.reward-step.next{background:#fff9db;border-color:#b99f39;transform:translateY(-3px);box-shadow:4px 6px 0 rgba(185,159,57,.14)}
.reward-step.next .reward-step-line{background:#d6b94d}
.reward-step.unlocked{background:#eff7e9}.reward-step.unlocked .reward-step-line{background:var(--green)}
.reward-step.locked{filter:saturate(.5);opacity:.72}
.reward-step-art{aspect-ratio:1;margin:4px 0 3px;background:var(--paper);border:1px solid rgba(55,101,47,.18);padding:7px}
.reward-step-art img{width:100%;height:100%;display:block;object-fit:contain}
.reward-level{font-family:var(--pixel);font-size:.55rem;letter-spacing:.08em;color:var(--green-dark)}
.reward-step strong{font-size:.86rem;line-height:1.25;color:var(--green-dark)}
.reward-step small{font-size:.72rem;color:var(--muted)}
.reward-step b{justify-self:start;margin-top:4px;padding:4px 6px;border:1px solid var(--border);background:var(--paper);font-family:var(--pixel);font-size:.48rem;letter-spacing:.04em;color:var(--green-dark)}
.reward-step.next b{background:var(--yellow)}.reward-step.unlocked b{background:var(--mint)}
@media(max-width:820px){.level-overview{grid-template-columns:1fr}.reward-roadmap{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.level-card{padding:15px}.level-title-row,.level-meta,.reward-roadmap-head{align-items:flex-start;flex-direction:column;gap:7px}.next-level-reward{grid-template-columns:92px 1fr}.reward-roadmap{grid-template-columns:1fr 1fr}.reward-roadmap-head small{text-align:left}}
@media(max-width:390px){.next-level-reward{grid-template-columns:1fr}.reward-preview-art{width:96px}.reward-roadmap{grid-template-columns:1fr}}


/* Profile identity with Twitch picture */
.profile-hero{padding-bottom:46px}
.profile-identity{display:flex;align-items:center;gap:28px;margin-top:18px}
.profile-identity-copy{min-width:0}
.profile-identity .profile-identity-copy h1{margin:0 0 14px}
.profile-identity .profile-identity-copy p{margin:0}
.profile-avatar-wrap{position:relative;flex:0 0 auto;width:132px;height:132px}
.profile-avatar-image{width:100%;height:100%;display:block;object-fit:cover;border:3px solid var(--border);border-radius:22px;background:var(--card);box-shadow:8px 8px 0 #d9c76d}
.profile-avatar-collectible{position:absolute;right:-10px;bottom:-10px;width:48px;height:48px;display:grid;place-items:center;border:2px solid var(--border);border-radius:50%;background:#fff9d8;font-size:25px;box-shadow:3px 3px 0 rgba(31,31,31,.2)}
.profile-avatar-collectible[hidden]{display:none}
@media(max-width:700px){.profile-identity{gap:18px}.profile-avatar-wrap{width:92px;height:92px}.profile-avatar-image{border-radius:17px;box-shadow:5px 5px 0 #d9c76d}.profile-avatar-collectible{width:38px;height:38px;font-size:20px;right:-7px;bottom:-7px}}
@media(max-width:430px){.profile-identity{align-items:flex-start}.profile-avatar-wrap{width:76px;height:76px}.profile-identity .profile-identity-copy h1{font-size:clamp(2rem,12vw,3rem)}}

/* Profile polish: identity tags, balanced stats and trophy cabinet */
.profile-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.profile-tag{display:inline-flex;align-items:center;min-height:30px;padding:6px 10px;border:1.5px solid var(--border);background:var(--paper);box-shadow:2px 2px 0 rgba(55,101,47,.09);font-family:var(--pixel);font-size:.55rem;letter-spacing:.07em;color:var(--green-dark)}
.profile-title-tag{background:var(--yellow)}
.profile-hero+.panel .wallet-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.trophy-cabinet{margin-top:24px;padding-top:22px;border-top:1px dashed var(--border)}
.trophy-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:14px}
.trophy-head h2{margin:6px 0 0}
.trophy-head p{max-width:430px;margin:0;text-align:right;color:var(--muted)}
.trophy-grid{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:14px}
.trophy-feature,.winner-trophy-panel{padding:16px;border:1.5px solid var(--border);background:var(--paper);box-shadow:3px 3px 0 rgba(55,101,47,.07)}
.trophy-label{display:block;margin-bottom:12px;font-family:var(--pixel);font-size:.55rem;letter-spacing:.1em;color:var(--green-dark)}
.showcase-badge{display:grid;grid-template-columns:112px 1fr;align-items:center;gap:18px;min-height:132px}
.showcase-badge-art{display:grid;place-items:center;width:112px;height:112px;border:1.5px solid var(--border);background:#fff9d8;font-size:58px;overflow:hidden}
.showcase-badge h3{margin:0 0 9px;font-size:1.25rem}
.empty-trophy{min-height:132px;display:grid;place-items:center;align-content:center;gap:8px;border:1.5px dashed var(--border);background:#fff;text-align:center;color:var(--muted)}
.empty-trophy>span{display:grid;place-items:center;width:42px;height:42px;border:1.5px solid var(--border);font-size:28px;color:var(--green-dark)}
.empty-trophy p{margin:0}
.winner-badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.winner-badge{display:grid;grid-template-columns:58px 1fr;align-items:center;gap:11px;padding:10px;border:1px solid var(--border);background:#fff}
.winner-badge .medal{width:58px;height:58px;display:grid;place-items:center;align-content:center;border:2px solid var(--green-dark);background:var(--yellow);line-height:1;box-shadow:2px 2px 0 rgba(55,101,47,.1)}
.winner-badge .medal b{font-size:1.25rem}.winner-badge .medal small{margin-top:3px;font-family:var(--pixel);font-size:.38rem;letter-spacing:.06em}
.winner-badge.rank-2 .medal{background:#e9edef}.winner-badge.rank-3 .medal{background:#ecd2b8}
.winner-badge>div{min-width:0}.winner-badge strong{display:block;overflow:hidden;text-overflow:ellipsis}.winner-badge>div small{color:var(--muted)}
@media(max-width:900px){.profile-hero+.panel .wallet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.trophy-grid{grid-template-columns:1fr}.trophy-head{align-items:flex-start;flex-direction:column;gap:8px}.trophy-head p{text-align:left}}
@media(max-width:560px){.profile-hero+.panel .wallet-grid{grid-template-columns:1fr 1fr}.showcase-badge{grid-template-columns:82px 1fr}.showcase-badge-art{width:82px;height:82px;font-size:43px}.winner-badges{grid-template-columns:1fr}}

/* Trophy chest redesign */
.trophy-cabinet{margin-top:30px;padding-top:24px;border-top:1px dashed var(--border)}
.trophy-chest{position:relative;margin-top:22px;padding-top:82px;filter:drop-shadow(0 15px 12px rgba(52,34,20,.18))}
.trophy-chest-lid{position:absolute;z-index:3;top:0;left:3%;width:94%;height:112px;border:3px solid #432d20;border-radius:18px 18px 8px 8px;background:linear-gradient(180deg,#5b3b24 0 12%,#87552f 13% 22%,#5b341e 23% 68%,#3b2419 69% 100%);box-shadow:inset 0 7px 0 rgba(255,220,150,.18),inset 0 -10px 18px rgba(20,10,5,.4);transform:perspective(700px) rotateX(-23deg);transform-origin:bottom center}
.trophy-chest-lid:before,.trophy-chest-front:before{content:"";position:absolute;inset:12px;border:2px solid rgba(219,158,79,.48);border-radius:10px;box-shadow:inset 0 0 0 4px rgba(56,30,16,.25)}
.trophy-lid-plate{position:absolute;left:50%;bottom:19px;transform:translateX(-50%);padding:7px 14px;border:2px solid #342016;background:linear-gradient(#d1a65d,#8c642f);box-shadow:inset 0 1px #f3d99d;font-family:var(--pixel);font-size:.48rem;letter-spacing:.13em;color:#2b1d13;white-space:nowrap}
.trophy-hinge{position:absolute;bottom:-6px;width:62px;height:18px;border:2px solid #2d1d13;background:repeating-linear-gradient(90deg,#8e6639 0 9px,#c19957 9px 17px);box-shadow:0 3px 0 rgba(30,16,8,.35)}
.trophy-hinge-left{left:15%}.trophy-hinge-right{right:15%}
.trophy-chest-inner{position:relative;z-index:2;border:4px solid #3d281b;border-bottom:0;border-radius:12px 12px 0 0;background:#392318;padding:18px 20px 8px;box-shadow:inset 0 8px 18px rgba(0,0,0,.5)}
.trophy-velvet{position:relative;min-height:270px;padding:28px;border:3px solid #6f251f;border-radius:7px 7px 0 0;background:radial-gradient(circle at 50% 0,rgba(255,155,104,.17),transparent 40%),linear-gradient(140deg,#6d1818,#9a2b24 48%,#5f1517);box-shadow:inset 0 0 35px rgba(20,0,0,.65),inset 0 4px 0 rgba(255,190,140,.12);display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);gap:20px;overflow:hidden}
.trophy-velvet:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background-image:repeating-linear-gradient(112deg,transparent 0 11px,rgba(255,255,255,.13) 12px,transparent 14px)}
.trophy-feature,.winner-trophy-panel{position:relative;z-index:1;padding:17px;border:1px solid rgba(255,221,157,.38);background:rgba(44,8,8,.38);box-shadow:inset 0 0 18px rgba(0,0,0,.25),0 3px 0 rgba(38,10,7,.45)}
.trophy-label{color:#f5dca0;text-shadow:0 1px 0 #2d0908}
.showcase-badge{grid-template-columns:132px 1fr;min-height:152px;color:#fff4df}
.showcase-pedestal{position:relative;width:132px;padding-bottom:25px}
.showcase-badge-art{position:relative;z-index:2;width:118px;height:118px;margin:auto;border:3px solid #d1ad63;border-radius:50%;background:radial-gradient(circle,#fff6d5 0 53%,#d8b66b 54% 61%,#53321c 62%);box-shadow:0 8px 15px rgba(0,0,0,.35),inset 0 0 14px rgba(255,255,255,.7);font-size:58px}
.showcase-pedestal:after{content:"";position:absolute;left:11px;right:11px;bottom:15px;height:27px;border:2px solid #2b1a11;background:linear-gradient(#ad793c,#67401f);clip-path:polygon(12% 0,88% 0,100% 100%,0 100%)}
.pedestal-plaque{position:absolute;z-index:3;left:50%;bottom:7px;transform:translateX(-50%);padding:4px 9px;border:1px solid #312014;background:#ddb967;color:#2d1b10;font-family:var(--pixel);font-size:.37rem;letter-spacing:.08em}
.showcase-badge-copy h3{color:#fff6dc}.showcase-badge-copy .badge{box-shadow:0 2px 0 rgba(0,0,0,.2)}
.empty-trophy{min-height:148px;border-color:rgba(255,221,157,.5);background:rgba(30,5,5,.3);color:#f1dbbd}
.empty-trophy-socket{width:86px;height:86px;border-radius:50%;border:2px dashed #d5b77c;background:radial-gradient(circle,rgba(255,255,255,.05),rgba(0,0,0,.2));box-shadow:inset 0 0 15px rgba(0,0,0,.45)}
.winner-badges{grid-template-columns:repeat(2,minmax(0,1fr))}
.winner-badge{border-color:rgba(255,221,157,.35);background:rgba(255,246,218,.93);box-shadow:0 4px 0 rgba(35,8,7,.28)}
.winner-badge .medal{position:relative;border-color:#3f2917;border-radius:50%;box-shadow:0 4px 0 rgba(35,14,7,.3),inset 0 0 0 4px rgba(255,255,255,.25)}
.medal-ribbon{position:absolute;z-index:-1;top:-10px;left:10px;width:34px;height:25px;background:linear-gradient(90deg,#315d33 0 42%,#e8d47b 43% 57%,#315d33 58%);clip-path:polygon(0 0,100% 0,84% 100%,50% 75%,16% 100%)}
.trophy-empty-slots{position:absolute;z-index:0;right:22px;bottom:15px;display:flex;gap:13px;opacity:.2}
.trophy-empty-slots span{width:47px;height:47px;border:2px dashed #efd69b;border-radius:50%}
.trophy-chest-front{position:relative;z-index:4;height:91px;border:4px solid #382318;border-radius:0 0 15px 15px;background:linear-gradient(180deg,#704426,#4d2d1c 55%,#352117);box-shadow:inset 0 8px 0 rgba(211,147,73,.18),inset 0 -12px 20px rgba(20,10,5,.4)}
.trophy-lock{position:absolute;z-index:2;left:50%;top:15px;width:46px;height:46px;transform:translateX(-50%);border:3px solid #302014;border-radius:5px 5px 12px 12px;background:linear-gradient(#d1a658,#88632d);box-shadow:inset 0 3px #f2da9b,0 4px 0 rgba(25,13,7,.35)}
.trophy-lock:before{content:"";position:absolute;left:50%;top:13px;width:9px;height:16px;transform:translateX(-50%);border-radius:50% 50% 3px 3px;background:#352319}
.trophy-corner{position:absolute;top:-4px;width:66px;height:95px;border:3px solid #2f1c12;background:linear-gradient(90deg,#926437,#d2a65d 50%,#73502b)}
.trophy-corner-left{left:20px}.trophy-corner-right{right:20px}
@media(max-width:900px){.trophy-velvet{grid-template-columns:1fr}.trophy-chest{padding-top:68px}.trophy-chest-lid{height:94px}}
@media(max-width:560px){.trophy-velvet{padding:16px}.showcase-badge{grid-template-columns:1fr;text-align:center}.showcase-pedestal{margin:auto}.trophy-chest-inner{padding:12px 12px 5px}.trophy-corner{width:38px}.trophy-lid-plate{font-size:.36rem}.winner-badges{grid-template-columns:1fr}}

/* Profile expansion: achievements, full level road and activity goals */
.reward-roadmap{grid-auto-flow:column;grid-auto-columns:minmax(190px,1fr);grid-template-columns:none;overflow-x:auto;padding:2px 2px 16px;scroll-snap-type:x proximity;scrollbar-color:var(--border) transparent}
.reward-step{scroll-snap-align:start;min-width:190px}
.achievement-shelf{position:relative;z-index:1;grid-column:1/-1;margin-top:4px;padding:18px;border:1px solid rgba(255,221,157,.38);background:rgba(38,7,7,.4);box-shadow:inset 0 0 18px rgba(0,0,0,.25),0 3px 0 rgba(38,10,7,.45)}
.achievement-shelf-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}
.achievement-shelf-head .trophy-label{margin:0}.achievement-shelf-head strong{font-family:var(--pixel);font-size:.55rem;color:#f5dca0}
.achievement-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.achievement-card{display:grid;grid-template-columns:58px 1fr;gap:10px;align-items:center;min-width:0;padding:10px;border:1px solid rgba(255,221,157,.34);background:rgba(255,248,224,.94);box-shadow:0 4px 0 rgba(35,8,7,.28)}
.achievement-card.locked{filter:saturate(.45);opacity:.72}
.achievement-icon{width:58px;height:58px;display:grid;place-items:center;border:2px solid #5b3b24;border-radius:9px;background:#fff7d9;overflow:hidden}
.achievement-icon img{width:100%;height:100%;object-fit:cover}.achievement-copy{min-width:0}
.achievement-copy>span{display:block;margin-bottom:3px;font-family:var(--pixel);font-size:.38rem;letter-spacing:.07em;color:var(--green-dark)}
.achievement-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.92rem;color:var(--green-dark)}
.achievement-copy small{display:block;min-height:29px;margin-top:2px;color:#675b4b;font-size:.72rem;line-height:1.25}
.achievement-copy b{display:block;margin-top:4px;font-family:var(--pixel);font-size:.38rem;color:var(--green-dark)}
.achievement-progress{height:6px;margin-top:7px;border:1px solid var(--border);background:#fff}
.achievement-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--green),#d4b73e)}
.profile-progress-board{margin-top:28px;padding:22px;border:1.5px solid var(--border);background:var(--paper);box-shadow:5px 5px 0 rgba(55,101,47,.08)}
.progress-board-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:16px}
.progress-board-head h2{margin:5px 0 0}.progress-board-head p{max-width:470px;margin:0;text-align:right;color:var(--muted)}
.goal-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.goal-card{padding:14px;border:1px solid var(--border);background:#fff}
.goal-card>div:first-child{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.goal-card span{font-family:var(--pixel);font-size:.48rem;letter-spacing:.05em}.goal-card strong{font-size:.9rem}
.goal-track{height:10px;margin-top:12px;border:1px solid var(--border);background:repeating-linear-gradient(90deg,#fff 0 18px,#edf1e8 18px 19px)}
.goal-track i{display:block;height:100%;background:linear-gradient(90deg,var(--green),#d4b73e)}.goal-card>small{display:block;margin-top:6px;text-align:right;color:var(--muted)}
.history-row strong.positive{color:var(--green-dark)}.history-row strong.negative{color:#9d2b22}
@media(max-width:1050px){.achievement-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.goal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.progress-board-head{align-items:flex-start;flex-direction:column;gap:8px}.progress-board-head p{text-align:left}.achievement-grid{grid-template-columns:1fr}.goal-grid{grid-template-columns:1fr 1fr}.achievement-shelf{padding:12px}}
@media(max-width:480px){.goal-grid{grid-template-columns:1fr}.achievement-card{grid-template-columns:50px 1fr}.achievement-icon{width:50px;height:50px}}


/* Profile agenda step 2: readable goals and achievement controls */
.achievement-shelf-head>div:first-child{display:flex;align-items:center;gap:12px;min-width:0}
.achievement-filters{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.achievement-filter{min-height:32px;padding:7px 10px;border:1px solid rgba(255,221,157,.5);border-radius:5px;background:rgba(255,248,224,.08);color:#f9e8b8;font-family:var(--pixel);font-size:.38rem;letter-spacing:.04em;box-shadow:none}
.achievement-filter:hover,.achievement-filter.active{background:#f8e6aa;color:#382315;border-color:#f8e6aa;transform:none}
.achievement-empty{grid-column:1/-1;margin:0;padding:24px;border:1px dashed rgba(255,221,157,.45);color:#f9e8b8;text-align:center}

.profile-progress-board{padding:26px;background:linear-gradient(180deg,#fffdf7 0%,#fbf6e9 100%)}
.progress-board-head h2{font-size:2rem;line-height:1.05;color:var(--green-dark)}
.progress-board-head p{font-size:.98rem;line-height:1.5;color:#5f665a}
.goal-summary{display:grid;grid-template-columns:1fr 1.45fr;gap:12px;margin:0 0 14px}
.goal-summary>div{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--border);background:#eef3e9}
.goal-summary span{font-family:var(--pixel);font-size:.52rem;letter-spacing:.07em;color:#52644d}
.goal-summary strong{justify-self:end;font-size:1.05rem;color:var(--green-dark)}
.goal-summary small{grid-column:2;justify-self:end;margin-top:2px;color:#5f665a;font-weight:700}
.goal-grid{gap:14px}
.goal-card{position:relative;min-height:158px;padding:18px;border:2px solid #b8c7ae;background:#fffef9;box-shadow:4px 4px 0 rgba(55,101,47,.08);overflow:hidden}
.goal-card:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--green)}
.goal-card.complete{background:#f1f6e9;border-color:#8da879}
.goal-card.complete:before{background:#d4b73e}
.goal-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.goal-card-top>div{min-width:0}
.goal-card .goal-card-top span{display:block;font-family:var(--pixel);font-size:.62rem;line-height:1.5;letter-spacing:.055em;color:#31462e;text-transform:none}
.goal-card-top small{display:block;margin-top:6px;color:#687166;font-size:.78rem;font-weight:700}
.goal-card .goal-card-top strong{flex:0 0 auto;font-size:1.35rem;line-height:1;color:#1f3f22;white-space:nowrap}
.goal-card .goal-card-top strong em{font-size:.76rem;font-style:normal;color:#697267;font-weight:700}
.goal-track{height:14px;margin-top:28px;border:1px solid #9faf99;background:repeating-linear-gradient(90deg,#fff 0 19px,#e5ebdf 19px 20px);box-shadow:inset 0 1px 2px rgba(27,55,28,.12)}
.goal-track i{background:linear-gradient(90deg,#356d35 0%,#7c933c 58%,#d5b93e 100%)}
.goal-card-foot{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:10px;color:#536052;font-size:.82rem;font-weight:700}
.goal-card-foot b{font-size:1rem;color:#29472a}
@media(max-width:700px){.achievement-shelf-head{align-items:flex-start;flex-direction:column}.achievement-filters{justify-content:flex-start}.goal-summary{grid-template-columns:1fr}.goal-summary strong,.goal-summary small{justify-self:start}.goal-summary>div{grid-template-columns:1fr}.goal-summary small{grid-column:1}.progress-board-head h2{font-size:1.65rem}}
@media(max-width:480px){.profile-progress-board{padding:16px}.goal-card{min-height:145px;padding:15px}.goal-card .goal-card-top span{font-size:.55rem}.goal-card .goal-card-top strong{font-size:1.1rem}}


/* Profile cosmetics and leaderboard banners */
.profile-customizer{margin:28px 0;padding:24px;border:1.5px solid var(--border);background:#fffdf7;box-shadow:5px 5px 0 rgba(55,101,47,.08)}
.customizer-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:18px}.customizer-head h2{margin:5px 0 0;font-size:2rem}.customizer-head p{max-width:500px;margin:0;text-align:right;color:var(--muted)}
.customizer-layout{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(0,1.5fr);gap:22px}.style-preview{min-height:330px;padding:22px;border:2px solid #aebda5;background:#f7f0dd;display:flex;align-items:flex-end;overflow:hidden;position:relative;box-shadow:inset 0 0 0 8px rgba(255,255,255,.45)}
.style-preview:before{content:"";position:absolute;inset:0;opacity:.9}.style-preview.banner-paper:before{background:linear-gradient(135deg,transparent 0 58%,rgba(69,103,57,.12) 58%),repeating-linear-gradient(0deg,transparent 0 23px,rgba(56,90,48,.08) 24px)}.style-preview.banner-daisy:before{background:radial-gradient(circle at 15% 24%,#f2d764 0 7px,#fff6c7 8px 18px,transparent 19px),radial-gradient(circle at 78% 17%,#f2d764 0 6px,#fff6c7 7px 16px,transparent 17px),linear-gradient(160deg,#dfeccf,#f8efc4)}.style-preview.banner-veteran:before{background:linear-gradient(130deg,rgba(239,205,101,.25),transparent 35%),repeating-linear-gradient(135deg,#263d2c 0 18px,#31533a 18px 36px)}.style-preview.banner-legend:before{background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.8),transparent 20%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337);animation:legend-shift 7s ease-in-out infinite alternate;background-size:160% 160%}@keyframes legend-shift{to{background-position:100% 100%}}
.style-preview-banner{position:relative;z-index:1;width:100%;display:flex;justify-content:space-between;align-items:center;padding:16px;border:1px solid rgba(50,75,42,.45);background:rgba(255,252,238,.9);backdrop-filter:blur(3px)}.style-preview-person{display:flex;gap:13px;align-items:center}.style-preview-person img{width:72px;height:72px;object-fit:cover;background:#fff}.style-preview-person strong,.style-preview-person span{display:block}.style-preview-person strong{font-size:1.35rem}.style-preview-person span{color:var(--muted)}.style-preview-banner>b{font-family:var(--pixel);font-size:.54rem}
.style-preview.frame-sprout .style-preview-person img{outline:5px solid #4e7f43;box-shadow:0 0 0 9px #dce9ca}.style-preview.frame-collector .style-preview-person img{outline:5px double #826f48;box-shadow:0 0 0 9px #efe0ad}.style-preview.frame-legend .style-preview-person img{outline:5px solid #d1a63f;box-shadow:0 0 0 9px #fff0a8,0 0 24px #e8c14e}
.cosmetic-picker{display:grid;gap:18px}.cosmetic-picker-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px}.cosmetic-picker-head>strong{font-size:1.05rem}.cosmetic-picker-head>span{color:var(--muted);font-weight:700}.cosmetic-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.cosmetic-option{min-height:126px;padding:9px;border:1px solid #b5c3ad;background:#fffdf7;color:var(--green-dark);box-shadow:none;text-align:left}.cosmetic-option:hover:not(:disabled){transform:translateY(-2px)}.cosmetic-option.selected{border:2px solid #356d35;background:#f1f6e9}.cosmetic-option.locked{opacity:.48;filter:grayscale(.8);cursor:not-allowed}.cosmetic-option strong,.cosmetic-option small{display:block}.cosmetic-option strong{margin-top:7px;font-size:.78rem;line-height:1.2}.cosmetic-option small{margin-top:4px;color:#667061;font-size:.68rem}.cosmetic-swatch{height:52px;display:block;position:relative;border:1px solid #aab9a2;background:#f4edda;overflow:hidden}.cosmetic-swatch i{position:absolute;inset:10px 24%;border:4px solid transparent;background:#e8e9e1}.frame-sprout i{border-color:#4e7f43;box-shadow:0 0 0 4px #dce9ca}.frame-collector i{border:5px double #826f48;box-shadow:0 0 0 4px #efe0ad}.frame-legend i{border-color:#d1a63f;box-shadow:0 0 0 4px #fff0a8}.banner-daisy{background:radial-gradient(circle at 25% 50%,#e0b931 0 5px,#fff2b6 6px 13px,transparent 14px),#dfeccf}.banner-veteran{background:repeating-linear-gradient(135deg,#263d2c 0 12px,#31533a 12px 24px)}.banner-legend{background:linear-gradient(135deg,#294d31,#d1a63f,#315b3b)}.cosmetic-message{min-height:20px;margin:0;color:#3c6338;font-weight:700}
.profile-avatar-wrap[data-frame="sprout"]{outline:5px solid #4e7f43;box-shadow:0 0 0 9px #dce9ca}.profile-avatar-wrap[data-frame="collector"]{outline:5px double #826f48;box-shadow:0 0 0 9px #efe0ad}.profile-avatar-wrap[data-frame="legend"]{outline:5px solid #d1a63f;box-shadow:0 0 0 9px #fff0a8,0 0 22px rgba(209,166,63,.7)}
.profile-hero[data-banner="daisy"]{background:radial-gradient(circle at 75% 30%,#e0b931 0 6px,#fff2b6 7px 16px,transparent 17px),linear-gradient(135deg,transparent,#edf4dd)}.profile-hero[data-banner="veteran"]{background:linear-gradient(110deg,transparent 0 55%,rgba(39,72,45,.13) 55%),repeating-linear-gradient(135deg,transparent 0 22px,rgba(39,72,45,.04) 22px 44px)}.profile-hero[data-banner="legend"]{background:linear-gradient(110deg,transparent 0 45%,rgba(209,166,63,.22)),radial-gradient(circle at 80% 25%,rgba(255,229,117,.35),transparent 28%)}
.podium-slot.banner-daisy,.table tr.banner-daisy{background-image:linear-gradient(90deg,rgba(237,244,221,.75),rgba(255,248,204,.75))}.podium-slot.banner-veteran,.table tr.banner-veteran{background-image:linear-gradient(90deg,rgba(40,69,45,.15),transparent)}.podium-slot.banner-legend,.table tr.banner-legend{background-image:linear-gradient(90deg,rgba(209,166,63,.28),rgba(49,91,59,.12))}.podium-slot.frame-sprout .podium-user-avatar{outline:4px solid #4e7f43}.podium-slot.frame-collector .podium-user-avatar{outline:5px double #826f48}.podium-slot.frame-legend .podium-user-avatar{outline:4px solid #d1a63f;box-shadow:0 0 14px #d1a63f}
@media(max-width:1000px){.customizer-layout{grid-template-columns:1fr}.style-preview{min-height:250px}.cosmetic-options{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.customizer-head{align-items:flex-start;flex-direction:column}.customizer-head p{text-align:left}.profile-customizer{padding:16px}.style-preview-banner{align-items:flex-start;gap:12px}.style-preview-person img{width:58px;height:58px}.cosmetic-options{grid-template-columns:1fr 1fr}}


/* Collectible inventory/profile visibility fix */
.collection-shelf{margin-top:22px;padding-top:18px;border-top:1px dashed rgba(255,245,220,.35)}
.profile-collection{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:12px}
.profile-collectible{position:relative;display:flex;align-items:center;gap:12px;min-height:74px;padding:12px;border:1px solid rgba(255,235,205,.32);background:rgba(40,8,8,.28);box-shadow:inset 0 0 20px rgba(0,0,0,.18)}
.profile-collectible.equipped{border-color:#e3c95a;box-shadow:inset 0 0 20px rgba(227,201,90,.12)}
.profile-collectible .collectible-icon,.profile-collectible .preset-avatar{display:grid;place-items:center;width:48px;height:48px;font-size:30px;background:#fff8e8;border:2px solid #d7c8a0;border-radius:8px;flex:0 0 auto}
.profile-collectible strong{display:block;color:#fff6dc;font-size:14px}.profile-collectible small{display:block;color:#d9cdb8;margin-top:4px;text-transform:capitalize}
.collection-equipped{position:absolute;right:8px;top:8px;padding:3px 6px;background:#e8d66f;color:#203d20;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.collection-empty{color:#e5d8c2;margin:0}
@media(max-width:720px){.profile-collection{grid-template-columns:1fr}}

/* Equip / unequip controls */
.item-card .btn.danger{background:#fff4e8;border-color:#9a5b43;color:#713a2b}.item-card .btn.danger:hover{background:#f6ded0}
.profile-collectible-copy{min-width:0;flex:1}.collection-action{flex:0 0 auto;border:1px solid #dbc78f;background:#fff8dc;color:#244b25;padding:7px 10px;font:800 10px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;box-shadow:2px 2px 0 rgba(31,66,34,.18)}.collection-action:hover{transform:translateY(-1px)}.collection-action.unequip{border-color:#d8a58e;background:#f8e4d7;color:#713a2b}.showcase-unequip{margin-top:13px;border:1px solid #d1ad63;background:#fff3d3;color:#4b2d1a;padding:8px 13px;font:800 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;box-shadow:2px 2px 0 rgba(0,0,0,.25)}.showcase-unequip:hover{background:#ffe8aa}
@media(max-width:560px){.profile-collectible{align-items:flex-start;flex-wrap:wrap}.collection-action{width:100%;margin-top:4px}.showcase-unequip{width:100%}}


/* Case shelf expansion: illustrated cases and level-50 vault */
.case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.case.legendary-case{grid-column:1/-1;background:linear-gradient(135deg,#fff9dc 0%,#f2e5ba 46%,#e7d3a0 100%);border-color:#8d6d26;position:relative;overflow:hidden}
.case.legendary-case .case-art{background:radial-gradient(circle at 50% 40%,#fff4b6 0 18%,#2b402c 19% 68%,#17261b 69%);min-height:310px}
.case.legendary-case .case-copy{background:linear-gradient(90deg,rgba(255,250,224,.98),rgba(248,237,194,.98))}
.case-art{position:relative}
.case-art-image{display:block;width:min(82%,420px);height:min(86%,300px);object-fit:contain;filter:drop-shadow(8px 12px 0 rgba(36,75,37,.14));transition:transform .22s ease}
.case:hover .case-art-image{transform:translateY(-5px) rotate(-1deg)}
.case-level-seal{position:absolute;right:18px;top:18px;padding:9px 11px;border:2px solid #f5d873;background:#203b25;color:#fff4bd;font:800 .62rem/1 var(--pixel);letter-spacing:.08em;box-shadow:4px 4px 0 #8d6d26}
.reward-image,.reel-reward-image,.contents-reward-image,.win-reward-image,.collectible-image{display:block;width:100%;height:100%;object-fit:contain}
.reel-reward-image{width:68px;height:68px;margin:auto}
.contents-reward-image{width:54px;height:54px}
.win-reward-image{width:112px;height:112px;margin:auto;filter:drop-shadow(5px 7px 0 rgba(36,75,37,.16))}
.collectible-image{padding:5px;box-sizing:border-box}
.reward-fallback{display:grid;place-items:center;width:100%;height:100%;font-size:2.25rem;line-height:1}
.case.legendary-case .case-meta span{border-color:#8d6d26!important;background:#fff5c5!important;color:#3d3217}
@media(min-width:901px){.case.legendary-case{display:grid;grid-template-columns:minmax(320px,.82fr) 1.18fr}.case.legendary-case .case-art{height:auto;border-bottom:0;border-right:2px solid #8d6d26}.case.legendary-case .case-copy{padding:34px}.case.legendary-case .case-copy p{min-height:0}}
@media(max-width:900px){.case-grid{grid-template-columns:1fr}.case.legendary-case{grid-column:auto}}


/* Case shelf polish */
.case-grid{gap:24px!important;align-items:stretch!important}
.case{overflow:hidden;border-radius:22px!important;box-shadow:6px 6px 0 rgba(54,94,49,.12)!important}
.case:hover{transform:translate(-2px,-3px)!important}
.case-copy{display:flex;flex-direction:column;gap:10px}
.case-copy p{max-width:56ch}
.case-art{position:relative;isolation:isolate;overflow:hidden;cursor:pointer;padding:22px 18px 12px!important}
.case-art:before{content:"";position:absolute;inset:auto -12% -36% -12%;height:70%;border-radius:50%;opacity:.7;z-index:0}
.case.coin-case .case-art{background:linear-gradient(180deg,#f7e7a8 0%,#efdc8a 52%,#e8d06f 100%)!important}
.case.coin-case .case-art:before{background:radial-gradient(circle at 50% 35%,rgba(255,246,191,.98) 0 24%,rgba(255,227,112,.6) 25%,rgba(241,200,74,.08) 56%,transparent 70%)}
.case.collectible .case-art{background:linear-gradient(180deg,#dce8d4 0%,#ccdcc3 56%,#bed0b4 100%)!important}
.case.collectible .case-art:before{background:radial-gradient(circle at 50% 38%,rgba(249,245,214,.92) 0 22%,rgba(222,236,210,.65) 24%,rgba(176,201,166,.18) 56%,transparent 72%)}
.case.legendary-case .case-art{background:linear-gradient(180deg,#2f204f 0%,#3b2964 40%,#221535 100%)!important;min-height:280px!important}
.case.legendary-case .case-art:before{background:radial-gradient(circle at 50% 34%,rgba(255,241,177,.98) 0 18%,rgba(166,136,255,.30) 32%,rgba(50,32,84,.08) 62%,transparent 74%)}
.case-art-image{position:relative;z-index:1;width:min(72%,310px)!important;height:auto!important;max-height:205px!important;object-fit:contain!important;filter:drop-shadow(0 14px 18px rgba(33,44,23,.18))!important}
.case.legendary-case .case-art-image{width:min(74%,330px)!important;max-height:230px!important}
.case:hover .case-art-image{transform:translateY(-3px) scale(1.01)!important}
.case-preview-hint{position:absolute;right:16px;bottom:14px;z-index:2;padding:7px 10px;border:2px solid rgba(54,94,49,.45);border-radius:999px;background:rgba(255,252,241,.92);font-family:var(--pixel);font-size:.58rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text);box-shadow:3px 3px 0 rgba(54,94,49,.1)}
.case.legendary-case .case-preview-hint{border-color:rgba(214,183,91,.68);background:rgba(255,247,215,.94);color:#3c2a12}
.case-level-seal{z-index:2}
.case-meta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.case-meta span{display:inline-flex;align-items:center;justify-content:center;min-height:36px}
.contents-row{grid-template-columns:60px 1fr auto!important;padding:14px 16px!important;border-radius:14px;background:linear-gradient(180deg,#fffef9 0%,#faf5e6 100%)!important}
.contents-icon{display:grid;place-items:center;width:60px;height:60px;border:2px solid var(--border);border-radius:14px;background:#fff!important}
.contents-reward-image{width:42px!important;height:42px!important}
#contentsMeta{font-size:.98rem;line-height:1.5;color:var(--muted);margin-bottom:16px}
@media(max-width:900px){.case-art-image{width:min(76%,270px)!important;max-height:180px!important}.case.legendary-case .case-art{min-height:220px!important}}
@media(max-width:560px){.case-art{padding:18px 12px 10px!important}.case-preview-hint{right:10px;bottom:10px;font-size:.5rem;padding:6px 8px}.contents-row{grid-template-columns:50px 1fr auto!important;gap:10px!important}.contents-icon{width:50px;height:50px}}


/* Leaderboard showcase v2 */
.my-rank-card{position:relative;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:26px;margin:0 0 34px;padding:22px 26px;border:2px solid var(--border);border-radius:20px;overflow:hidden;background:#fffdf5;box-shadow:7px 7px 0 rgba(54,94,49,.12)}
.my-rank-card:before,.podium-slot:before,.leaderboard-table tr:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.78;z-index:0}
.my-rank-card>*{position:relative;z-index:1}.my-rank-copy{display:grid;gap:3px}.my-rank-copy>span{font-family:var(--pixel);font-size:.62rem;letter-spacing:.11em;text-transform:uppercase}.my-rank-copy>strong{font-size:2.5rem;line-height:1}.my-rank-copy>small{color:var(--muted)}
.my-rank-person{display:flex;align-items:center;gap:12px;min-width:230px}.my-rank-person>div{display:grid}.my-rank-person span{color:var(--muted);font-size:.84rem}.my-rank-avatar{width:54px;height:54px;border-radius:16px;object-fit:cover;border:3px solid var(--border);background:#fff}.my-rank-card>b{font-size:1.3rem;white-space:nowrap}
.podium-topline p{max-width:620px;color:var(--muted);margin:8px 0 0}.live-podium{min-height:470px!important;padding:26px 18px 0!important;background:linear-gradient(180deg,#f8f4e8,#eee6cd)!important;border-radius:26px 26px 10px 10px!important}
.podium-slot{position:relative;overflow:hidden;border:2px solid var(--border);border-bottom:0;border-radius:20px 20px 0 0;background:#fffdf6;box-shadow:6px 0 0 rgba(44,53,39,.08)}.podium-slot>*{position:relative;z-index:1}.podium-slot.is-me{outline:4px solid rgba(214,181,69,.72);outline-offset:-5px}
.podium-banner-top{width:100%;display:flex;justify-content:space-between;align-items:center;padding:10px 13px;font-family:var(--pixel);font-size:.58rem;letter-spacing:.08em}.podium-place-label,.podium-level{padding:6px 8px;border:1px solid rgba(36,75,37,.38);border-radius:999px;background:rgba(255,253,245,.82)}
.podium-crown{font-family:var(--pixel);font-size:1rem!important;letter-spacing:.12em;margin:12px 0 2px!important;padding:7px 11px;border:2px solid var(--border);background:#fff8cf;filter:none!important}
.podium-person{padding:8px 14px 18px!important}.podium-avatar-stack{position:relative;margin-bottom:5px}.leaderboard-badge.large{position:absolute;right:-9px;bottom:-5px;display:grid;place-items:center;width:36px;height:36px;border:3px solid #fff;border-radius:50%;background:#fff1b8;font-size:20px;box-shadow:2px 3px 0 rgba(0,0,0,.16)}
.podium-title{font-family:var(--pixel);font-size:.62rem!important;letter-spacing:.06em;color:var(--green-dark)!important}.podium-status{font-size:.74rem!important}.podium-person>b{margin-top:5px;font-size:1.18rem!important}.podium-person small{font-size:.72rem!important;min-height:34px!important}
.podium-block{border-width:2px!important;box-shadow:none!important}.place-1 .podium-block{height:162px!important}.place-2 .podium-block{height:122px!important}.place-3 .podium-block{height:92px!important}.podium-block strong{font-family:var(--pixel);font-size:2rem!important}.podium-block span{font-size:.6rem!important}
.rank-ticker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.ticker-entry{position:relative;overflow:hidden;display:grid;grid-template-columns:auto auto 1fr auto auto;align-items:center;gap:9px;padding:10px 12px;border:2px solid var(--border);border-radius:14px;background:#fff}.ticker-entry>div{display:grid}.ticker-entry small{font-size:.68rem;color:var(--muted)}.ticker-avatar{width:32px;height:32px;border-radius:9px;object-fit:cover}.ticker-rank{font-family:var(--pixel);font-size:.65rem}
.leaderboard-table-wrap{border:2px solid var(--border);border-radius:20px;overflow:hidden;background:#fff;box-shadow:7px 7px 0 rgba(54,94,49,.1)}.leaderboard-table{margin:0!important;border:0!important}.leaderboard-table tr{position:relative}.leaderboard-table td,.leaderboard-table th{position:relative;z-index:1}.leaderboard-table tbody tr{transition:transform .15s ease,box-shadow .15s ease}.leaderboard-table tbody tr:hover{transform:translateX(4px);box-shadow:inset 5px 0 0 var(--green)}.leaderboard-table .current-user-row{outline:3px solid #d7b846;outline-offset:-3px}.leaderboard-table .rank{width:92px}.rank-number{font-family:var(--pixel);font-size:.82rem;display:inline-block;min-width:30px}.leaderboard-person{gap:13px!important}.leader-avatar{width:48px!important;height:48px!important;border-radius:14px!important;object-fit:cover;border:2px solid var(--border);background:#fff}.leaderboard-name{display:grid;gap:3px}.leaderboard-name>strong{font-size:1rem}.leaderboard-name>small{font-size:.72rem;color:var(--muted);font-family:var(--pixel);letter-spacing:.03em}.leaderboard-badge{display:inline-grid;place-items:center;vertical-align:middle}.status-pill{display:inline-flex;padding:7px 10px;border:1px solid #a8bba0;border-radius:999px;background:rgba(255,255,255,.76);font-size:.78rem;font-weight:700}.leaderboard-table .points{display:grid;justify-items:end;gap:1px}.leaderboard-table .points strong{font-size:1rem}.leaderboard-table .points small{font-size:.65rem;color:var(--muted)}
.banner-paper:before{background:repeating-linear-gradient(0deg,transparent 0 22px,rgba(56,90,48,.055) 23px),linear-gradient(135deg,#fffdf6,#f5edd9)}
.banner-garden:before{background:radial-gradient(circle at 12% 22%,#f2d85d 0 5px,#fff4bb 6px 13px,transparent 14px),radial-gradient(circle at 86% 74%,#ed9d78 0 4px,#fff0c6 5px 12px,transparent 13px),linear-gradient(145deg,#dfeccd,#f8efc7)}
.banner-sprout:before{background:linear-gradient(115deg,transparent 0 18%,rgba(255,255,255,.46) 18% 22%,transparent 22% 65%),repeating-linear-gradient(135deg,#d8e7c9 0 16px,#ecf2dc 16px 32px)}
.banner-daisy:before{background:radial-gradient(circle at 18% 28%,#e0b931 0 5px,#fff2b6 6px 14px,transparent 15px),radial-gradient(circle at 80% 18%,#e0b931 0 5px,#fff2b6 6px 14px,transparent 15px),linear-gradient(150deg,#dfeccf,#fff0b6)}
.banner-veteran:before{background:linear-gradient(130deg,rgba(239,205,101,.24),transparent 35%),repeating-linear-gradient(135deg,#263d2c 0 18px,#31533a 18px 36px)}
.banner-legend:before{background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.75),transparent 20%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337);background-size:160% 160%;animation:legend-shift 7s ease-in-out infinite alternate}
.banner-veteran,.banner-legend{color:#fff}.banner-veteran .podium-title,.banner-legend .podium-title,.banner-veteran .podium-status,.banner-legend .podium-status,.banner-veteran .leaderboard-name small,.banner-legend .leaderboard-name small{color:rgba(255,255,255,.82)!important}.banner-veteran .status-pill,.banner-legend .status-pill{color:#203622;background:rgba(255,255,255,.9)}
.cosmetic-swatch.banner-garden{background:radial-gradient(circle at 22% 35%,#f2d85d 0 4px,#fff4bb 5px 11px,transparent 12px),linear-gradient(145deg,#dfeccd,#f8efc7)}.cosmetic-swatch.banner-sprout{background:repeating-linear-gradient(135deg,#d8e7c9 0 10px,#ecf2dc 10px 20px)}
@media(max-width:900px){.my-rank-card{grid-template-columns:1fr auto}.my-rank-person{grid-column:1/-1;grid-row:2}.rank-ticker{grid-template-columns:1fr}.live-podium{min-height:0!important}.leaderboard-table-wrap{overflow-x:auto}.leaderboard-table{min-width:720px}}
@media(max-width:760px){.podium-slot{border:2px solid var(--border)!important;border-radius:16px!important}.podium-banner-top{grid-column:1/-1}.podium-avatar-stack{margin:0}.podium-person{display:grid!important;grid-template-columns:auto 1fr!important;justify-items:start!important;text-align:left!important;column-gap:12px!important}.podium-person strong,.podium-title,.podium-status,.podium-person>b,.podium-person small{grid-column:2}.podium-avatar-stack{grid-row:1/6}.my-rank-card{grid-template-columns:1fr;padding:18px}.my-rank-card>b{justify-self:start}.my-rank-person{grid-column:auto;grid-row:auto}}


/* Follow-up: readable cosmetic cards, previewable locked case, neutral leaderboard table */
.cosmetic-options{grid-template-columns:repeat(3,minmax(150px,1fr))!important;gap:12px!important}
.cosmetic-option{min-width:0!important;min-height:142px!important;display:flex!important;flex-direction:column!important;gap:9px!important;overflow:hidden!important}
.cosmetic-option-copy{display:block;min-width:0;width:100%}
.cosmetic-option strong{display:block!important;margin:0!important;font-size:.82rem!important;line-height:1.3!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
.cosmetic-option small{display:block!important;margin-top:5px!important;font-size:.69rem!important}
.cosmetic-swatch{flex:0 0 58px;width:100%!important}
@media(max-width:780px){.cosmetic-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:480px){.cosmetic-options{grid-template-columns:1fr!important}}

.case.legendary-case.case-locked{filter:none;opacity:1}
.case.legendary-case.case-locked .case-art-image{filter:grayscale(.38) brightness(.82) drop-shadow(0 14px 18px rgba(18,14,30,.25))!important}
.case-lock-overlay{position:absolute;z-index:3;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;padding:26px;background:linear-gradient(180deg,rgba(24,14,43,.18),rgba(24,14,43,.68));color:#fff;pointer-events:none}
.case-lock-overlay[hidden]{display:none!important}
.case-lock-overlay .case-lock-icon{font-size:2rem;filter:drop-shadow(0 3px 0 rgba(0,0,0,.25))}
.case-lock-overlay strong{font-family:var(--pixel);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}
.case-lock-overlay small{max-width:430px;font-size:.88rem;line-height:1.45;color:rgba(255,255,255,.88)}
.case-locked .case-preview-hint{z-index:4}
.case-locked .openCase:disabled{opacity:.7;cursor:not-allowed;background:#6d6675!important;border-color:#3b3246!important}

.leaderboard-table tbody tr{background:#fffdf7!important;background-image:none!important}
.leaderboard-table tbody tr:nth-child(even){background:#fbf7eb!important}
.leaderboard-table tbody tr.podium-1{background:#fff7d7!important}
.leaderboard-table tbody tr.podium-2{background:#f1f3ee!important}
.leaderboard-table tbody tr.podium-3{background:#f8e7df!important}
.leaderboard-table tbody tr.current-user-row{box-shadow:inset 3px 0 0 #3a6b38}
.leaderboard-entry-banner{position:relative;isolation:isolate;overflow:hidden;border-radius:12px;padding:9px 12px;min-height:62px;border:1px solid transparent}
.leaderboard-entry-banner:before{content:"";position:absolute;inset:0;z-index:-1;opacity:0}
.leaderboard-entry-banner.banner-paper{padding-left:0;background:transparent}
.leaderboard-entry-banner.banner-paper:before{display:none}
.leaderboard-entry-banner:not(.banner-paper){border-color:rgba(54,94,49,.28);box-shadow:3px 3px 0 rgba(54,94,49,.08)}
.leaderboard-entry-banner:not(.banner-paper):before{opacity:1}
.leaderboard-entry-banner.banner-veteran,.leaderboard-entry-banner.banner-legend{color:#fff}
.leaderboard-entry-banner.banner-veteran .leaderboard-name small,.leaderboard-entry-banner.banner-legend .leaderboard-name small{color:rgba(255,255,255,.84)!important}
.leaderboard-entry-banner.banner-garden:before{background:radial-gradient(circle at 12% 22%,#f2d85d 0 5px,#fff4bb 6px 13px,transparent 14px),radial-gradient(circle at 86% 74%,#ed9d78 0 4px,#fff0c6 5px 12px,transparent 13px),linear-gradient(145deg,#dfeccd,#f8efc7)}
.leaderboard-entry-banner.banner-sprout:before{background:linear-gradient(115deg,transparent 0 18%,rgba(255,255,255,.46) 18% 22%,transparent 22% 65%),repeating-linear-gradient(135deg,#d8e7c9 0 16px,#ecf2dc 16px 32px)}
.leaderboard-entry-banner.banner-daisy:before{background:radial-gradient(circle at 18% 28%,#e0b931 0 5px,#fff2b6 6px 14px,transparent 15px),radial-gradient(circle at 80% 18%,#e0b931 0 5px,#fff2b6 6px 14px,transparent 15px),linear-gradient(150deg,#dfeccf,#fff0b6)}
.leaderboard-entry-banner.banner-veteran:before{background:linear-gradient(130deg,rgba(239,205,101,.24),transparent 35%),repeating-linear-gradient(135deg,#263d2c 0 18px,#31533a 18px 36px)}
.leaderboard-entry-banner.banner-legend:before{background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.75),transparent 20%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337);background-size:160% 160%;animation:legend-shift 7s ease-in-out infinite alternate}


/* Leaderboard neutral rows + monthly trend */
.leaderboard-table tbody tr{background:#fffdf7!important;background-image:none!important}
.leaderboard-table tbody tr:nth-child(even){background:#faf7ed!important}
.leaderboard-table tbody tr.podium-1{background:#fff5cf!important}
.leaderboard-table tbody tr.podium-2{background:#edf1e8!important}
.leaderboard-table tbody tr.podium-3{background:#f7e4df!important}
.leaderboard-table tbody tr[class*="banner-"]:not(.banner-paper):not(.podium-1):not(.podium-2):not(.podium-3){position:relative}
.leaderboard-table tbody tr.banner-garden:not(.podium-1):not(.podium-2):not(.podium-3){background:linear-gradient(90deg,#f8f5dc,#e5efd9)!important}
.leaderboard-table tbody tr.banner-sprout:not(.podium-1):not(.podium-2):not(.podium-3){background:repeating-linear-gradient(135deg,#f7faef 0 18px,#eaf1df 18px 36px)!important}
.leaderboard-table tbody tr.banner-daisy:not(.podium-1):not(.podium-2):not(.podium-3){background:linear-gradient(90deg,#f1f6e6,#fff6cf)!important}
.leaderboard-table tbody tr.banner-veteran:not(.podium-1):not(.podium-2):not(.podium-3){background:linear-gradient(90deg,#304938,#416049)!important;color:#fff}
.leaderboard-table tbody tr.banner-legend:not(.podium-1):not(.podium-2):not(.podium-3){background:linear-gradient(90deg,#294d31,#c69b40,#31583a)!important;color:#fff}
.leaderboard-table td.points{min-width:190px;position:relative;padding-bottom:9px!important}
.monthly-trend{width:112px;height:24px;margin:4px 0 0 auto;display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px;font-family:var(--pixel);font-size:.52rem;line-height:1}
.monthly-trend svg{width:72px;height:22px;overflow:visible}
.monthly-trend polyline{fill:none;stroke:currentColor;stroke-width:2.3;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.monthly-trend.positive{color:#357c42}.monthly-trend.negative{color:#c54b38}
.monthly-trend span{min-width:42px;text-align:right;white-space:nowrap}
.leaderboard-table tbody tr.banner-veteran .monthly-trend,.leaderboard-table tbody tr.banner-legend .monthly-trend{color:#fff1a8}
.cosmetic-message:empty{display:none}
@media(max-width:700px){.leaderboard-table td.points{min-width:140px}.monthly-trend{width:95px}.monthly-trend svg{width:55px}.monthly-trend span{font-size:.46rem}}


/* Dark leaderboard + collectible animated cosmetics */
.leaderboard-table-shell,.leaderboard-table-wrap{background:#141714!important;border-color:#202820!important}
.table thead,.table thead tr,.table thead th{background:#121512!important;color:#f5efda!important;border-color:#313b31!important}
.table tbody tr{background:#fffdf7!important;color:#1f2c20}
.table tbody tr:not(.podium-row) td{background:transparent!important}
.table tbody tr.podium-1{background:#fff3bd!important}.table tbody tr.podium-2{background:#eceee8!important}.table tbody tr.podium-3{background:#f5ddd5!important}
.table tbody tr.current-user-row{outline:2px solid #d4ad38;outline-offset:-2px}
.table tbody tr[class*="banner-"] .leaderboard-person{position:relative;overflow:hidden;border-radius:14px;padding:9px 13px;isolation:isolate}
.table tbody tr[class*="banner-"] .leaderboard-person:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.92}
.table tbody tr.banner-paper .leaderboard-person:before{background:linear-gradient(135deg,#fffdf5,#eee5cf)}
.table tbody tr.banner-garden .leaderboard-person:before{background:radial-gradient(circle at 9% 28%,#f4d74d 0 5px,transparent 6px),linear-gradient(135deg,#e3efcc,#fff1bc)}
.table tbody tr.banner-sprout .leaderboard-person:before{background:repeating-linear-gradient(135deg,#d8e8ca 0 12px,#eef4df 12px 24px)}
.table tbody tr.banner-daisy .leaderboard-person:before{background:radial-gradient(circle at 88% 25%,#e3bc2e 0 5px,#fff4bd 6px 13px,transparent 14px),linear-gradient(135deg,#e4efd3,#fff0af)}
.table tbody tr.banner-sunset .leaderboard-person:before,.banner-sunset:before{background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e 100%);background-size:180% 180%;animation:bannerFlow 7s ease-in-out infinite alternate}
.table tbody tr.banner-night .leaderboard-person:before,.banner-night:before{background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),radial-gradient(circle at 75% 65%,#cdd8ff 0 2px,transparent 3px),linear-gradient(135deg,#10162c,#313466 55%,#17162f);background-size:auto,auto,180% 180%;animation:nightDrift 9s linear infinite}
.table tbody tr.banner-aurora .leaderboard-person:before,.banner-aurora:before{background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d);background-size:260% 260%;animation:auroraMove 6s ease-in-out infinite alternate}
.table tbody tr.banner-veteran .leaderboard-person:before{background:repeating-linear-gradient(135deg,#263d2c 0 15px,#31533a 15px 30px)}
.table tbody tr.banner-legend .leaderboard-person:before{background:linear-gradient(120deg,#23462e,#e3b641,#31563b);background-size:220% 220%;animation:bannerFlow 7s ease-in-out infinite alternate}
.table tbody tr.banner-sunset .leaderboard-name,.table tbody tr.banner-night .leaderboard-name,.table tbody tr.banner-aurora .leaderboard-name,.table tbody tr.banner-veteran .leaderboard-name,.table tbody tr.banner-legend .leaderboard-name{color:#fff}.table tbody tr.banner-sunset .leaderboard-name small,.table tbody tr.banner-night .leaderboard-name small,.table tbody tr.banner-aurora .leaderboard-name small{color:rgba(255,255,255,.82)!important}
@keyframes bannerFlow{to{background-position:100% 65%}}@keyframes nightDrift{to{background-position:80px -30px,-70px 40px,100% 100%}}@keyframes auroraMove{to{background-position:100% 100%}}
.cosmetic-swatch.banner-sunset{background:linear-gradient(115deg,#44265d,#e46d6d,#ffd36e);background-size:180% 180%;animation:bannerFlow 5s ease-in-out infinite alternate}
.cosmetic-swatch.banner-night{background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),linear-gradient(135deg,#10162c,#313466)}
.cosmetic-swatch.banner-aurora{background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d);background-size:240% 240%;animation:auroraMove 5s ease-in-out infinite alternate}
.frame-moss i{border:5px solid #4f7b48;box-shadow:0 0 0 4px #b7d28c,inset 0 0 0 3px #24492b}.frame-neon i{border:4px solid #d85cff;box-shadow:0 0 8px #7cf6ff,0 0 16px #d85cff;animation:neonPulse 1.8s ease-in-out infinite alternate}@keyframes neonPulse{to{filter:hue-rotate(60deg);box-shadow:0 0 15px #7cf6ff,0 0 28px #d85cff}}
.profile-avatar-wrap[data-frame="moss"] .profile-avatar-image,.podium-slot.frame-moss .podium-user-avatar{outline:5px solid #4f7b48;box-shadow:0 0 0 5px #b7d28c}.profile-avatar-wrap[data-frame="neon"] .profile-avatar-image,.podium-slot.frame-neon .podium-user-avatar{outline:4px solid #d85cff;box-shadow:0 0 12px #7cf6ff,0 0 24px #d85cff;animation:neonPulse 1.8s ease-in-out infinite alternate}
.profile-hero[data-banner="sunset"],.style-preview.banner-sunset:before{background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e);background-size:180% 180%;animation:bannerFlow 7s ease-in-out infinite alternate}.profile-hero[data-banner="night"],.style-preview.banner-night:before{background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),linear-gradient(135deg,#10162c,#313466)}.profile-hero[data-banner="aurora"],.style-preview.banner-aurora:before{background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d);background-size:260% 260%;animation:auroraMove 6s ease-in-out infinite alternate}
.cosmetic-inventory-icon{font-size:2rem}.cosmetic-inventory-icon.banner-sunset{background:linear-gradient(115deg,#44265d,#e46d6d,#ffd36e)}.cosmetic-inventory-icon.banner-night{background:linear-gradient(135deg,#10162c,#313466)}.cosmetic-inventory-icon.banner-aurora{background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6)}
@media(max-width:700px),(prefers-reduced-motion:reduce){.banner-sunset:before,.banner-night:before,.banner-aurora:before,.banner-legend:before,.cosmetic-swatch,.profile-hero,.profile-avatar-image{animation:none!important}.table tbody tr.banner-sunset .leaderboard-person:before{background:linear-gradient(115deg,#56306d,#d66f76,#f5c968)}.table tbody tr.banner-night .leaderboard-person:before{background:linear-gradient(135deg,#131a32,#363967)}.table tbody tr.banner-aurora .leaderboard-person:before{background:linear-gradient(120deg,#18393d,#4aa997,#735cc0)}}


/* Admin dashboard v2 */
.admin-body{background:var(--paper)}.admin-wrap{max-width:1240px}.admin-hero{display:grid;grid-template-columns:1fr minmax(300px,420px);gap:28px;align-items:end;margin:42px 0 28px}.admin-hero h1{font-size:clamp(2.4rem,6vw,4.8rem);margin:8px 0}.admin-hero p{max-width:680px;color:var(--muted);font-size:1.05rem}.admin-health{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:16px 18px;border:2px solid var(--border);border-radius:18px;background:#f1f7e9;box-shadow:5px 5px 0 rgba(42,76,35,.12)}.admin-health.disconnected{background:#fff1e7}.admin-health-dot{width:12px;height:12px;border-radius:50%;background:#3fa45b;box-shadow:0 0 0 5px rgba(63,164,91,.12)}.admin-health.disconnected .admin-health-dot{background:#d15b3d}.admin-health strong,.admin-health small{display:block}.admin-health small{color:var(--muted);margin-top:3px}.admin-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-bottom:26px}.admin-metric.modern{min-height:126px;padding:17px;border:2px solid var(--border);border-radius:18px;background:#fffdf6;display:flex;flex-direction:column;justify-content:space-between;box-shadow:4px 4px 0 rgba(42,76,35,.08)}.admin-metric.modern span{font-family:var(--pixel);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.admin-metric.modern strong{font-size:1.65rem;line-height:1.05}.admin-metric.modern small{color:var(--muted)}.admin-command-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:20px;margin-bottom:36px}.admin-command-card{border:2px solid var(--border);border-radius:22px;background:#fffdf7;padding:22px;box-shadow:7px 7px 0 rgba(42,76,35,.1)}.section-head.compact{margin-bottom:14px}.admin-status-list{display:grid;gap:10px;margin:18px 0}.admin-status-list>div{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #d5ddce}.admin-status-list b.ok{color:#2e783e}.admin-status-list b.warn{color:#b56a2e}.admin-inline-actions{display:flex;gap:10px;flex-wrap:wrap}.btn.wide{width:100%;margin-top:12px}.admin-users-section{margin-bottom:70px}.admin-result-count{min-width:58px;height:58px;border-radius:18px;background:var(--green-dark);color:#fff;display:grid;place-items:center;font-size:1.25rem;font-weight:900}.admin-toolbar.modern{display:grid;grid-template-columns:minmax(260px,1fr) repeat(3,minmax(150px,.3fr));gap:10px;margin-bottom:14px}.admin-search{display:flex;align-items:center;gap:10px;border:2px solid var(--border);border-radius:14px;background:#fff;padding:0 13px}.admin-search input{width:100%;border:0;background:transparent;padding:13px 0;font:inherit;outline:0}.admin-table.upgraded{border-collapse:separate;border-spacing:0}.admin-table.upgraded th{background:#18251c;color:#f8f0d2}.admin-table.upgraded td{background:#fffdf8;border-bottom:1px solid #d7dece}.admin-table.upgraded tr:hover td{background:#f5f8ee}.admin-table.upgraded td>b,.admin-table.upgraded td>small{display:block}.admin-table.upgraded td>small,.admin-user small{color:var(--muted);margin-top:4px}.admin-user img{width:48px;height:48px;border-radius:13px;object-fit:cover}.admin-cosmetic-chip{display:inline-block;margin:2px 4px 2px 0;padding:5px 7px;border:1px solid #b8c5b1;border-radius:999px;background:#f2f5eb;font-size:.72rem}.admin-drawer.upgraded{width:min(620px,100vw);padding:0;background:#f8f5e9}.admin-drawer-head{position:sticky;top:0;z-index:3;background:#f8f5e9;padding:22px;border-bottom:2px solid var(--border)}.admin-drawer-user{display:flex;gap:14px;align-items:center}.admin-drawer-user>img{width:70px;height:70px;border-radius:18px;object-fit:cover;border:2px solid var(--border)}.admin-user-snapshot{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:18px 22px}.admin-user-snapshot>div{padding:12px;border:1px solid #bdc8b6;border-radius:13px;background:#fff}.admin-user-snapshot span,.admin-user-snapshot strong{display:block}.admin-user-snapshot span{font-size:.72rem;color:var(--muted)}.admin-user-snapshot strong{font-size:1.1rem;margin-top:4px}.admin-drawer-tabs{display:flex;gap:4px;padding:0 22px;border-bottom:1px solid #c7d1c0;overflow:auto}.admin-drawer-tabs button{border:0;background:transparent;padding:12px 14px;font-weight:800;white-space:nowrap}.admin-drawer-tabs button.active{color:#244b25;border-bottom:3px solid #356d35}.admin-tab-panel{display:none;padding:18px 22px}.admin-tab-panel.active{display:block}.admin-form{border:1px solid #c2cdbb;border-radius:16px;background:#fffdf8;padding:16px;margin-bottom:12px}.admin-form h3{margin-top:0}.admin-quick-buttons{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.admin-quick-buttons button{border:1px solid #aebca7;border-radius:999px;background:#f1f5eb;padding:7px 10px;font-weight:800}.admin-inventory-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.admin-inventory-item{display:flex;gap:10px;align-items:center;border:1px solid #c4cebE;border-radius:13px;padding:10px;background:#fff}.admin-inventory-item>span{font-size:1.6rem}.admin-inventory-item strong,.admin-inventory-item small{display:block}.admin-inventory-item small{color:var(--muted)}.admin-appearance-preview{position:relative;overflow:hidden;display:flex;align-items:center;gap:13px;min-height:100px;padding:18px;border:2px solid var(--border);border-radius:16px;background:#f2ecd8}.admin-appearance-preview:before{content:"";position:absolute;inset:0;opacity:.8}.admin-appearance-preview>*{position:relative;z-index:1}.admin-appearance-preview img{width:64px;height:64px;border-radius:15px;object-fit:cover}.admin-appearance-preview strong,.admin-appearance-preview small{display:block}.admin-history>div{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid #d7dece}.admin-history span{color:var(--muted);text-align:right}.admin-danger{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:12px 22px 28px;padding:16px;border:2px solid #a43d2d;border-radius:16px;background:#fff0e9}.admin-danger strong,.admin-danger small{display:block}.btn.danger{border-color:#8f2f25;background:#b94332;color:#fff}.admin-toast{position:fixed;right:20px;bottom:20px;transform:translateY(120px);opacity:0;padding:12px 16px;border-radius:12px;background:#244b25;color:#fff;transition:.2s;z-index:10}.admin-toast.show{transform:translateY(0);opacity:1}.admin-toast.bad{background:#a63d2d}
.admin-mods-section{margin-bottom:36px}.admin-mod-add{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.admin-mod-add input{flex:1;min-width:220px;border:2px solid var(--border);border-radius:14px;background:#fff;padding:12px 14px;font:inherit;outline:0}.admin-mod-list{display:grid;gap:8px}.admin-mod-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #c2cdbb;border-radius:13px;background:#fffdf8;padding:11px 14px}.admin-mod-row strong,.admin-mod-row small{display:block}.admin-mod-row small{color:var(--muted);font-size:.72rem;margin-top:2px}.admin-mod-toggle{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 22px 8px;padding:12px 15px;border:1px solid #bdc8b6;border-radius:14px;background:#fff}.admin-mod-toggle strong{color:#b56a2e}.admin-mod-toggle strong.ok{color:#2e783e}
@media(max-width:1080px){.admin-metrics{grid-template-columns:repeat(3,1fr)}.admin-command-grid{grid-template-columns:1fr}.admin-toolbar.modern{grid-template-columns:1fr 1fr}.admin-search{grid-column:1/-1}}
@media(max-width:700px){.admin-hero{grid-template-columns:1fr}.admin-metrics{grid-template-columns:repeat(2,1fr)}.admin-toolbar.modern{grid-template-columns:1fr}.admin-search{grid-column:auto}.admin-table.upgraded th:nth-child(4),.admin-table.upgraded td:nth-child(4),.admin-table.upgraded th:nth-child(6),.admin-table.upgraded td:nth-child(6){display:none}.admin-user-snapshot{grid-template-columns:repeat(2,1fr)}.admin-inventory-preview{grid-template-columns:1fr}.admin-drawer-head{align-items:flex-start}.admin-health{grid-template-columns:auto 1fr}.admin-health .btn{grid-column:1/-1}}


/* Navigation cleanup: Inventory remains reachable from the profile trophy collection. */

/* Rare drops with visible reward and user icons */
.rare-card{display:grid!important;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:14px;min-height:104px;border-radius:16px!important;overflow:hidden;position:relative}
.rare-card:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:#6d925d}
.rare-card.rarity-epic:before{background:#9a5ac1}.rare-card.rarity-legendary:before{background:#d4a62e}
.rare-drop-visual{position:relative;width:64px;height:64px;display:grid;place-items:center;border:2px solid var(--border);border-radius:16px;background:#fff9df}
.rare-reward-icon{font-size:31px;line-height:1;filter:drop-shadow(2px 3px 0 rgba(45,70,38,.12))}
.rare-user-avatar{position:absolute;right:-8px;bottom:-8px;width:28px;height:28px;object-fit:cover;border:2px solid var(--border);border-radius:50%;background:#fff}
.rare-avatar-fallback{display:grid;place-items:center;font-family:var(--pixel);font-size:.56rem}
.rare-drop-copy{min-width:0}.rare-drop-copy strong{line-height:1.35;margin:0 0 6px!important}.rare-drop-copy small{display:block;white-space:normal}

/* Profile banner stays static and subtle; animation is reserved for the podium. */
.profile-hero[data-banner],.style-preview:before,.cosmetic-swatch{animation:none!important;background-position:50% 50%!important}
.profile-hero[data-banner="sunset"]{background:linear-gradient(115deg,#5e456e 0%,#c97b79 52%,#e8c979 100%)!important}
.profile-hero[data-banner="night"]{background:radial-gradient(circle at 82% 25%,rgba(255,245,168,.6) 0 3px,transparent 4px),linear-gradient(135deg,#20263e,#454872)!important}
.profile-hero[data-banner="aurora"]{background:linear-gradient(120deg,#235056,#5fb5a2 48%,#7768b5 100%)!important}
.profile-hero[data-banner="legend"]{background:linear-gradient(125deg,#294d31,#aa8947 52%,#365e42)!important}
.profile-hero[data-banner="sunset"],.profile-hero[data-banner="night"],.profile-hero[data-banner="aurora"],.profile-hero[data-banner="legend"]{color:#fff}.profile-hero[data-banner="sunset"] #profileIntro,.profile-hero[data-banner="night"] #profileIntro,.profile-hero[data-banner="aurora"] #profileIntro,.profile-hero[data-banner="legend"] #profileIntro{color:rgba(255,255,255,.82)}

/* Leaderboard table: all banner effects are static and contained to the person card. */
.table tbody tr:before,.table tbody tr:after{animation:none!important}
.table tbody tr .leaderboard-person:before{animation:none!important;background-position:50% 50%!important}
.table tbody tr.banner-sunset .leaderboard-person:before{background:linear-gradient(115deg,#5e456e,#c97b79 52%,#e8c979)!important}
.table tbody tr.banner-night .leaderboard-person:before{background:linear-gradient(135deg,#20263e,#454872)!important}
.table tbody tr.banner-aurora .leaderboard-person:before{background:linear-gradient(120deg,#235056,#5fb5a2 48%,#7768b5)!important}
.table tbody tr.banner-legend .leaderboard-person:before{background:linear-gradient(125deg,#294d31,#aa8947 52%,#365e42)!important}

/* Rebuilt podium: clearer hierarchy, proper heights and podium-only slow motion. */
#podium.podium{display:grid!important;grid-template-columns:1fr 1.12fr 1fr;align-items:end;gap:14px;padding:26px 20px 0!important;background:linear-gradient(180deg,#faf7e9 0%,#f1ecd9 100%);border:2px solid var(--border);border-radius:24px;box-shadow:9px 10px 0 rgba(48,76,40,.13);overflow:hidden}
.podium-slot{position:relative;isolation:isolate;display:flex!important;flex-direction:column;justify-content:flex-end;min-width:0;padding:0!important;border:2px solid var(--border)!important;border-radius:20px 20px 0 0!important;background:#fffdf6!important;overflow:hidden;box-shadow:5px 0 0 rgba(45,70,38,.08)!important;color:var(--text)!important}
.podium-slot.place-1{min-height:510px;order:2;border-color:#a98423!important}.podium-slot.place-2{min-height:450px;order:1}.podium-slot.place-3{min-height:410px;order:3}
.podium-banner-layer{position:absolute;z-index:-1;inset:0 0 116px;opacity:.95;background:#f7f2df}
.podium-slot.banner-paper .podium-banner-layer{background:repeating-linear-gradient(0deg,transparent 0 22px,rgba(56,90,48,.055) 23px),linear-gradient(135deg,#fffdf6,#f5edd9)}
.podium-slot.banner-garden .podium-banner-layer{background:radial-gradient(circle at 12% 22%,#f2d85d 0 5px,#fff4bb 6px 13px,transparent 14px),radial-gradient(circle at 86% 74%,#ed9d78 0 4px,#fff0c6 5px 12px,transparent 13px),linear-gradient(145deg,#dfeccd,#f8efc7)}
.podium-slot.banner-sprout .podium-banner-layer{background:repeating-linear-gradient(135deg,#d8e7c9 0 16px,#ecf2dc 16px 32px)}
.podium-slot.banner-daisy .podium-banner-layer{background:radial-gradient(circle at 18% 28%,#e0b931 0 5px,#fff2b6 6px 14px,transparent 15px),radial-gradient(circle at 80% 18%,#e0b931 0 5px,#fff2b6 6px 14px,transparent 15px),linear-gradient(150deg,#dfeccf,#fff0b6)}
.podium-slot.banner-veteran .podium-banner-layer{background:linear-gradient(130deg,rgba(239,205,101,.24),transparent 35%),repeating-linear-gradient(135deg,#263d2c 0 18px,#31533a 18px 36px)}
.podium-slot.banner-sunset .podium-banner-layer{background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e);background-size:220% 220%;animation:podiumBannerDrift 18s ease-in-out infinite alternate}
.podium-slot.banner-night .podium-banner-layer{background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),radial-gradient(circle at 72% 16%,#fff 0 1px,transparent 2px),linear-gradient(135deg,#10162c,#313466);background-size:100% 100%;animation:podiumNightGlow 20s ease-in-out infinite alternate}
.podium-slot.banner-aurora .podium-banner-layer{background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d);background-size:320% 320%;animation:podiumBannerDrift 22s ease-in-out infinite alternate}
.podium-slot.banner-legend .podium-banner-layer{background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.75),transparent 20%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337);background-size:240% 240%;animation:podiumBannerDrift 24s ease-in-out infinite alternate}
@keyframes podiumBannerDrift{from{background-position:0% 45%}to{background-position:100% 55%}}@keyframes podiumNightGlow{from{filter:brightness(.92)}to{filter:brightness(1.12)}}
.podium-topline{position:absolute;z-index:2;top:14px;left:14px;right:14px;display:flex;justify-content:space-between;gap:8px}
.podium-rank-chip,.podium-level-chip{padding:7px 9px;border:1px solid rgba(36,75,37,.42);border-radius:999px;background:rgba(255,253,244,.9);font-family:var(--pixel);font-size:.56rem;color:#263f27}
.podium-medal{position:relative;z-index:2;align-self:center;margin-top:62px;width:60px;height:60px;display:grid;place-items:center;border:3px solid var(--border);border-radius:50%;background:#fff9cf;font-family:var(--pixel);font-size:.8rem;box-shadow:0 7px 0 rgba(42,68,37,.14)}
.place-1 .podium-medal{width:70px;height:70px;background:#f6d866;border-color:#98751f}.place-2 .podium-medal{background:#dce2e5}.place-3 .podium-medal{background:#ddb087}
.podium-person{position:relative;z-index:2;display:flex!important;flex-direction:column;align-items:center;text-align:center;padding:18px 18px 24px!important;gap:7px;color:inherit!important}
.podium-avatar-stack{position:relative;margin:0 0 5px}.podium-user-avatar{width:104px!important;height:104px!important;border-radius:22px!important;object-fit:cover;background:#fff;border:5px solid #fff;box-shadow:0 0 0 3px var(--border),0 10px 20px rgba(30,50,28,.18)}.place-1 .podium-user-avatar{width:120px!important;height:120px!important}
.podium-identity{display:grid;gap:3px}.podium-identity>strong{font-size:1.75rem;line-height:1.05}.place-1 .podium-identity>strong{font-size:2rem}.podium-title,.podium-status{font-size:.86rem;color:var(--muted)!important}.podium-score{display:flex;align-items:baseline;gap:6px;margin-top:8px}.podium-score b{font-size:1.5rem}.podium-score span{font-size:.75rem;color:var(--muted)}
.podium-prize{min-height:40px;margin-top:4px;padding:8px 12px;border:1px solid rgba(43,72,38,.28);border-radius:12px;background:rgba(255,253,244,.78);font-weight:800;font-size:.78rem}
.podium-base{position:relative;z-index:3;height:116px;display:grid;place-items:center;align-content:center;border-top:2px solid var(--border);background:#dfe4e6}.place-1 .podium-base{background:#f4d964}.place-3 .podium-base{background:#dcb087}.podium-base strong{font-size:2.2rem;line-height:1}.podium-base span{font-family:var(--pixel);font-size:.58rem;letter-spacing:.12em;margin-top:7px}
.podium-slot.is-me{box-shadow:inset 0 0 0 3px #d5b33b,5px 0 0 rgba(45,70,38,.08)!important}

@media(max-width:860px){#podium.podium{grid-template-columns:1fr;padding:16px!important}.podium-slot,.podium-slot.place-1,.podium-slot.place-2,.podium-slot.place-3{order:initial;min-height:0;border-radius:18px!important}.podium-banner-layer{inset:0 0 82px}.podium-topline{position:relative;top:auto;left:auto;right:auto;margin:12px 12px 0}.podium-medal{position:absolute;right:18px;top:62px;margin:0;width:50px;height:50px}.podium-person{display:grid!important;grid-template-columns:88px 1fr;justify-items:start;text-align:left;padding:14px 18px 20px!important}.podium-avatar-stack{grid-row:1/5}.podium-user-avatar,.place-1 .podium-user-avatar{width:82px!important;height:82px!important}.podium-identity,.podium-score,.podium-prize{grid-column:2}.podium-prize{text-align:left}.podium-base{height:82px}}
@media(max-width:700px),(prefers-reduced-motion:reduce){.podium-banner-layer{animation:none!important}}


/* Compatibility fixes for the earlier podium design. */
.podium-section{position:relative;isolation:isolate;z-index:0;overflow:visible}
.podium-section-head{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:22px;pointer-events:auto}
.podium-section-head>div:first-child{max-width:720px}
.podium-section-head .leaderboard-timer{flex:0 0 auto}
.podium-card-topline{position:absolute;z-index:3;top:14px;left:14px;right:14px;display:flex;justify-content:space-between;gap:8px;pointer-events:none}
.podium-card-topline .podium-rank-chip,.podium-card-topline .podium-level-chip{padding:7px 9px;border:1px solid rgba(36,75,37,.42);border-radius:999px;background:rgba(255,253,244,.9);font-family:var(--pixel);font-size:.56rem;color:#263f27}
/* Keep the earlier static podium visuals and prevent loop restarts. */
#podium .podium-banner-layer,#podium .podium-user-avatar{animation:none!important;background-position:50% 50%!important}
@media(max-width:760px){.podium-section-head{align-items:flex-start;flex-direction:column}.podium-card-topline{position:relative;top:auto;left:auto;right:auto;margin:12px 12px 0}}


/* Earlier compact podium visual — keeps the later render/navigation fixes. */
#podium.live-podium{
  display:grid!important;
  grid-template-columns:1fr 1.08fr 1fr!important;
  align-items:end!important;
  gap:16px!important;
  min-height:430px!important;
  padding:52px 20px 0!important;
  overflow:visible!important;
  background:linear-gradient(180deg,#fbf8ed 0%,#f1ecd9 100%)!important;
  border:2px solid var(--border)!important;
  border-radius:24px!important;
  box-shadow:9px 10px 0 rgba(48,76,40,.12)!important;
}
#podium.live-podium .podium-slot{
  position:relative!important;
  isolation:isolate!important;
  min-height:360px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  overflow:hidden!important;
  padding:0!important;
  border:2px solid var(--border)!important;
  border-radius:20px 20px 0 0!important;
  background:#fffdf6!important;
  color:var(--text)!important;
  box-shadow:5px 0 0 rgba(45,70,38,.08)!important;
  transform:none!important;
}
#podium.live-podium .podium-slot.place-1{
  min-height:410px!important;
  order:2!important;
  transform:translateY(-34px)!important;
  border-color:#a98423!important;
}
#podium.live-podium .podium-slot.place-2{order:1!important;min-height:360px!important}
#podium.live-podium .podium-slot.place-3{order:3!important;min-height:335px!important}
#podium.live-podium .podium-banner-layer{
  position:absolute!important;
  z-index:0!important;
  inset:0 0 auto 0!important;
  height:126px!important;
  opacity:.92!important;
  animation:none!important;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 70%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,#000 0%,#000 70%,transparent 100%)!important;
}
#podium.live-podium .podium-card-topline{
  position:absolute!important;
  z-index:3!important;
  top:12px!important;
  left:12px!important;
  right:12px!important;
  display:flex!important;
  justify-content:space-between!important;
}
#podium.live-podium .podium-medal{
  position:relative!important;
  z-index:2!important;
  width:54px!important;
  height:54px!important;
  margin:46px auto 0!important;
  display:grid!important;
  place-items:center!important;
  border:3px solid var(--border)!important;
  border-radius:50%!important;
  background:#fff9cf!important;
  font-family:var(--pixel)!important;
  font-size:.72rem!important;
  box-shadow:0 6px 0 rgba(42,68,37,.13)!important;
}
#podium.live-podium .place-1 .podium-medal{width:62px!important;height:62px!important;background:#f6d866!important;border-color:#98751f!important}
#podium.live-podium .place-2 .podium-medal{background:#dce2e5!important}
#podium.live-podium .place-3 .podium-medal{background:#ddb087!important}
#podium.live-podium .podium-person{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
  gap:5px!important;
  padding:14px 16px 20px!important;
  color:var(--text)!important;
}
#podium.live-podium .podium-user-avatar{
  width:82px!important;
  height:82px!important;
  border-radius:20px!important;
  object-fit:cover!important;
  border:4px solid #fff!important;
  box-shadow:0 0 0 3px var(--border),0 8px 16px rgba(30,50,28,.16)!important;
}
#podium.live-podium .place-1 .podium-user-avatar{width:96px!important;height:96px!important}
#podium.live-podium .podium-identity{display:grid!important;gap:2px!important}
#podium.live-podium .podium-identity>strong{font-size:1.45rem!important;line-height:1.05!important}
#podium.live-podium .place-1 .podium-identity>strong{font-size:1.62rem!important}
#podium.live-podium .podium-title,#podium.live-podium .podium-status{font-size:.76rem!important;color:var(--muted)!important}
#podium.live-podium .podium-score{display:flex!important;gap:5px!important;align-items:baseline!important;margin-top:7px!important}
#podium.live-podium .podium-score b{font-size:1.28rem!important}
#podium.live-podium .podium-prize{
  min-height:34px!important;
  margin-top:5px!important;
  padding:7px 10px!important;
  border:1px solid rgba(43,72,38,.28)!important;
  border-radius:11px!important;
  background:rgba(255,253,244,.92)!important;
  font-size:.7rem!important;
}
#podium.live-podium .podium-base{
  position:relative!important;
  z-index:3!important;
  height:70px!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  border-top:2px solid var(--border)!important;
  background:#dfe4e6!important;
}
#podium.live-podium .place-1 .podium-base{height:106px!important;background:#f4d964!important}
#podium.live-podium .place-2 .podium-base{height:78px!important;background:#dce2e5!important}
#podium.live-podium .place-3 .podium-base{height:58px!important;background:#dcb087!important}
#podium.live-podium .podium-base strong{font-size:1.75rem!important;line-height:1!important}
#podium.live-podium .podium-base span{font-family:var(--pixel)!important;font-size:.5rem!important;letter-spacing:.12em!important;margin-top:4px!important}

/* Profile hero readability and spacing. */
.profile-hero{
  padding:54px 64px 58px!important;
  overflow:hidden!important;
}
.profile-hero .eyebrow{position:relative!important;z-index:2!important}
.profile-identity{
  position:relative!important;
  z-index:2!important;
  width:max-content!important;
  max-width:min(760px,100%)!important;
  margin:26px 0 0!important;
  padding:22px 30px!important;
  gap:28px!important;
  border:2px solid rgba(255,255,255,.72)!important;
  border-radius:24px!important;
  background:rgba(255,253,244,.88)!important;
  box-shadow:8px 9px 0 rgba(31,55,30,.15)!important;
  backdrop-filter:blur(5px)!important;
}
.profile-avatar-wrap{margin-left:0!important}
.profile-identity-copy h1,#profileName{
  color:#203d24!important;
  text-shadow:none!important;
}
.profile-identity-copy #profileIntro{color:#536153!important}
.profile-tags .profile-tag{background:#fffaf0!important;color:#28482a!important;border-color:rgba(42,76,35,.34)!important}
.profile-hero[data-banner="sunset"] .profile-identity,
.profile-hero[data-banner="night"] .profile-identity,
.profile-hero[data-banner="aurora"] .profile-identity,
.profile-hero[data-banner="legend"] .profile-identity{
  background:rgba(255,253,244,.91)!important;
  color:#203d24!important;
}

@media(max-width:860px){
  #podium.live-podium{grid-template-columns:1fr!important;min-height:0!important;padding:16px!important;overflow:hidden!important}
  #podium.live-podium .podium-slot,
  #podium.live-podium .podium-slot.place-1,
  #podium.live-podium .podium-slot.place-2,
  #podium.live-podium .podium-slot.place-3{order:initial!important;min-height:0!important;transform:none!important;border-radius:18px!important}
  #podium.live-podium .podium-banner-layer{height:100%!important;opacity:.24!important;mask-image:none!important;-webkit-mask-image:none!important}
  #podium.live-podium .podium-base,#podium.live-podium .place-1 .podium-base,#podium.live-podium .place-2 .podium-base,#podium.live-podium .place-3 .podium-base{height:68px!important}
  .profile-hero{padding:34px 24px 40px!important}
  .profile-identity{width:100%!important;padding:18px 20px!important}
}
@media(max-width:560px){
  .profile-hero{padding:28px 16px 34px!important}
  .profile-identity{align-items:center!important;gap:16px!important;padding:16px!important;border-radius:18px!important}
}


/* Distinct starter banners and live wallet updates. */
.profile-hero[data-banner="paper"]{background:linear-gradient(90deg,rgba(46,83,43,.08) 1px,transparent 1px),linear-gradient(rgba(46,83,43,.08) 1px,transparent 1px),linear-gradient(145deg,#fffdf5 0%,#f1ead7 100%)!important;background-size:28px 28px,28px 28px,auto!important}
.profile-hero[data-banner="garden"]{background:radial-gradient(circle at 12% 23%,#f0ce42 0 8px,#fff2a9 9px 24px,transparent 25px),radial-gradient(circle at 88% 74%,#ef8d68 0 7px,#ffe4a7 8px 22px,transparent 23px),radial-gradient(ellipse at 72% 20%,rgba(255,255,255,.42),transparent 34%),linear-gradient(135deg,#cfe2b9 0%,#e8efc9 48%,#f3dba7 100%)!important}
.profile-hero[data-banner="sprout"]{background:repeating-linear-gradient(135deg,#c9ddb5 0 26px,#e6efd4 26px 52px)!important}
.style-preview.banner-paper:before,.cosmetic-swatch.banner-paper{background:linear-gradient(90deg,rgba(46,83,43,.1) 1px,transparent 1px),linear-gradient(rgba(46,83,43,.1) 1px,transparent 1px),linear-gradient(145deg,#fffdf5,#efe6ce)!important;background-size:14px 14px,14px 14px,auto!important}
.style-preview.banner-garden:before,.cosmetic-swatch.banner-garden{background:radial-gradient(circle at 17% 30%,#f0ce42 0 5px,#fff2a9 6px 14px,transparent 15px),radial-gradient(circle at 82% 72%,#ef8d68 0 4px,#ffe4a7 5px 13px,transparent 14px),linear-gradient(135deg,#cfe2b9,#f3dba7)!important}
.style-preview.banner-sprout:before,.cosmetic-swatch.banner-sprout{background:repeating-linear-gradient(135deg,#c9ddb5 0 14px,#e6efd4 14px 28px)!important}
.live-pixel-pill{position:relative;overflow:hidden;min-width:92px;justify-content:center;font-variant-numeric:tabular-nums}.live-pixel-number{display:inline-block;min-width:4.3ch;text-align:right;font-variant-numeric:tabular-nums}


/* Larger desktop navigation */
@media (min-width:901px){
  header{padding:22px 0!important;gap:22px!important}
  .nav{gap:8px!important;font-size:.76rem!important}
  .nav a{padding:11px 14px!important;border-radius:10px!important;line-height:1.1!important}
  .logo{font-size:1.8rem!important}
}

/* Restore calm animated profile banners on desktop only. */
@media (min-width:701px) and (prefers-reduced-motion:no-preference){
  .profile-hero[data-banner="sunset"]{
    background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e)!important;
    background-size:220% 220%!important;
    animation:profileBannerFlow 18s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="aurora"]{
    background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d)!important;
    background-size:300% 300%!important;
    animation:profileBannerFlow 22s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="legend"]{
    background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.62),transparent 22%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337)!important;
    background-size:240% 240%!important;
    animation:profileBannerFlow 24s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="night"]{
    background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),radial-gradient(circle at 72% 16%,#fff 0 1px,transparent 2px),linear-gradient(135deg,#10162c,#313466)!important;
    animation:profileNightPulse 20s ease-in-out infinite alternate!important;
  }
}
@keyframes profileBannerFlow{from{background-position:0% 45%}to{background-position:100% 55%}}
@keyframes profileNightPulse{from{filter:brightness(.94)}to{filter:brightness(1.08)}}

/* Real podium: compact winner cards placed above stepped blocks. */
#podium.live-podium{
  display:grid!important;
  grid-template-columns:1fr 1.08fr 1fr!important;
  align-items:end!important;
  gap:18px!important;
  min-height:560px!important;
  padding:30px 24px 0!important;
  background:linear-gradient(180deg,#fbf8ec 0%,#f0ead7 100%)!important;
  border:2px solid var(--border)!important;
  border-radius:24px!important;
  box-shadow:9px 10px 0 rgba(48,76,40,.13)!important;
  overflow:hidden!important;
}
#podium.live-podium .podium-slot{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  color:var(--text)!important;
}
#podium.live-podium .podium-slot.place-1{order:2!important}
#podium.live-podium .podium-slot.place-2{order:1!important}
#podium.live-podium .podium-slot.place-3{order:3!important}

#podium.live-podium .podium-banner-layer{
  position:absolute!important;
  z-index:0!important;
  left:8px!important;
  right:8px!important;
  top:0!important;
  bottom:auto!important;
  height:330px!important;
  border:2px solid var(--border)!important;
  border-radius:22px!important;
  opacity:1!important;
  overflow:hidden!important;
  animation:none!important;
  box-shadow:6px 7px 0 rgba(43,69,38,.1)!important;
}
#podium.live-podium .place-1 .podium-banner-layer{height:360px!important;border-color:#a98423!important}
#podium.live-podium .place-2 .podium-banner-layer{height:325px!important}
#podium.live-podium .place-3 .podium-banner-layer{height:305px!important}

#podium.live-podium .podium-card-topline{
  position:absolute!important;
  z-index:4!important;
  top:16px!important;
  left:24px!important;
  right:24px!important;
  display:flex!important;
  justify-content:space-between!important;
  pointer-events:none!important;
}
#podium.live-podium .podium-medal{
  position:relative!important;
  z-index:3!important;
  align-self:center!important;
  margin:42px 0 8px!important;
  width:58px!important;
  height:58px!important;
  display:grid!important;
  place-items:center!important;
  border:3px solid var(--border)!important;
  border-radius:50%!important;
  background:#fff9cf!important;
  box-shadow:0 7px 0 rgba(42,68,37,.14)!important;
}
#podium.live-podium .place-1 .podium-medal{width:70px!important;height:70px!important;background:#f6d866!important;border-color:#98751f!important}
#podium.live-podium .place-2 .podium-medal{background:#dce2e5!important}
#podium.live-podium .place-3 .podium-medal{background:#ddb087!important}

#podium.live-podium .podium-person{
  position:relative!important;
  z-index:3!important;
  width:calc(100% - 34px)!important;
  min-height:230px!important;
  margin:0 auto 18px!important;
  padding:16px 16px 18px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  border:1px solid rgba(45,72,39,.28)!important;
  border-radius:18px!important;
  background:rgba(255,253,244,.9)!important;
  backdrop-filter:blur(5px)!important;
  box-shadow:0 8px 18px rgba(32,51,29,.12)!important;
  text-align:center!important;
  color:var(--text)!important;
}
#podium.live-podium .place-1 .podium-person{min-height:250px!important}
#podium.live-podium .podium-user-avatar{width:88px!important;height:88px!important;border-radius:20px!important}
#podium.live-podium .place-1 .podium-user-avatar{width:105px!important;height:105px!important}
#podium.live-podium .podium-identity>strong{font-size:1.45rem!important}
#podium.live-podium .place-1 .podium-identity>strong{font-size:1.7rem!important}
#podium.live-podium .podium-title,#podium.live-podium .podium-status{color:var(--muted)!important}
#podium.live-podium .podium-score b{font-size:1.3rem!important}
#podium.live-podium .podium-prize{min-height:38px!important;background:#fffdf5!important}

#podium.live-podium .podium-base{
  position:relative!important;
  z-index:5!important;
  width:100%!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  border:2px solid var(--border)!important;
  border-bottom:0!important;
  border-radius:14px 14px 0 0!important;
  box-shadow:inset 0 10px 0 rgba(255,255,255,.2)!important;
}
#podium.live-podium .place-1 .podium-base{height:170px!important;background:linear-gradient(180deg,#f5dc70,#dfbd3e)!important;border-color:#9b7820!important}
#podium.live-podium .place-2 .podium-base{height:120px!important;background:linear-gradient(180deg,#e5eaec,#c9d1d5)!important}
#podium.live-podium .place-3 .podium-base{height:88px!important;background:linear-gradient(180deg,#e3b78f,#c99061)!important}
#podium.live-podium .podium-base strong{font-size:2.3rem!important;line-height:1!important}
#podium.live-podium .podium-base span{margin-top:7px!important}

#podium.live-podium .podium-slot.is-me .podium-person{outline:3px solid rgba(213,179,59,.72)!important;outline-offset:2px!important}

@media(max-width:860px){
  #podium.live-podium{grid-template-columns:1fr!important;min-height:0!important;padding:16px!important}
  #podium.live-podium .podium-slot.place-1,
  #podium.live-podium .podium-slot.place-2,
  #podium.live-podium .podium-slot.place-3{order:initial!important}
  #podium.live-podium .podium-banner-layer{position:absolute!important;height:100%!important;inset:0!important;border-radius:18px!important}
  #podium.live-podium .podium-card-topline{top:13px!important;left:14px!important;right:14px!important}
  #podium.live-podium .podium-medal{position:absolute!important;right:18px!important;top:56px!important;margin:0!important;width:48px!important;height:48px!important}
  #podium.live-podium .podium-person,#podium.live-podium .place-1 .podium-person{width:100%!important;min-height:0!important;margin:0!important;padding:74px 78px 20px 18px!important;align-items:flex-start!important;text-align:left!important;background:rgba(255,253,244,.9)!important}
  #podium.live-podium .podium-base,#podium.live-podium .place-1 .podium-base,#podium.live-podium .place-2 .podium-base,#podium.live-podium .place-3 .podium-base{height:72px!important;border-radius:0 0 18px 18px!important;border-bottom:2px solid var(--border)!important}
}

/* Live pixel counter feedback */
.live-pixel-number{display:inline-block;min-width:ch;transition:transform .18s ease}
.live-pixel-pill{font-variant-numeric:tabular-nums}


/* Final podium repair: stable card/base separation and restored calm banner motion. */
#podium.live-podium{
  grid-template-columns:1fr 1.08fr 1fr!important;
  align-items:end!important;
  gap:18px!important;
  min-height:540px!important;
  padding:28px 24px 0!important;
  overflow:hidden!important;
}
#podium.live-podium .podium-slot{
  --podium-base-h:92px;
  --podium-card-h:350px;
  display:grid!important;
  grid-template-rows:var(--podium-card-h) var(--podium-base-h)!important;
  align-self:end!important;
  min-height:0!important;
  overflow:visible!important;
}
#podium.live-podium .podium-slot.place-1{--podium-card-h:385px;--podium-base-h:148px;order:2!important}
#podium.live-podium .podium-slot.place-2{--podium-card-h:350px;--podium-base-h:112px;order:1!important}
#podium.live-podium .podium-slot.place-3{--podium-card-h:330px;--podium-base-h:82px;order:3!important}

#podium.live-podium .podium-banner-layer{
  z-index:0!important;
  inset:0 8px auto 8px!important;
  width:auto!important;
  height:var(--podium-card-h)!important;
  border-radius:22px 22px 16px 16px!important;
  overflow:hidden!important;
  box-shadow:6px 7px 0 rgba(43,69,38,.10)!important;
}
#podium.live-podium .podium-card-topline{grid-row:1!important;align-self:start!important}
#podium.live-podium .podium-medal{
  grid-row:1!important;
  align-self:start!important;
  justify-self:center!important;
  margin:52px 0 0!important;
}
#podium.live-podium .podium-person{
  grid-row:1!important;
  align-self:end!important;
  justify-self:center!important;
  width:calc(100% - 34px)!important;
  min-height:230px!important;
  max-height:250px!important;
  margin:0 auto 18px!important;
  padding:16px 16px 18px!important;
  border-radius:18px!important;
  overflow:hidden!important;
}
#podium.live-podium .place-1 .podium-person{min-height:248px!important;max-height:268px!important}
#podium.live-podium .podium-base{
  grid-row:2!important;
  align-self:stretch!important;
  height:auto!important;
  min-height:0!important;
  border-radius:14px 14px 0 0!important;
}
#podium.live-podium .place-1 .podium-base,
#podium.live-podium .place-2 .podium-base,
#podium.live-podium .place-3 .podium-base{height:auto!important}

/* Calm animations: visible on profile and podium, never on table rows. */
@keyframes linebckBannerDrift{0%{background-position:0% 50%}100%{background-position:100% 50%}}
@keyframes linebckNightGlow{0%{filter:brightness(.94)}100%{filter:brightness(1.08)}}
@media (min-width:701px) and (prefers-reduced-motion:no-preference){
  .profile-hero[data-banner="sunset"],
  #podium.live-podium .podium-slot.banner-sunset .podium-banner-layer{
    background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e)!important;
    background-size:220% 220%!important;
    animation:linebckBannerDrift 18s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="aurora"],
  #podium.live-podium .podium-slot.banner-aurora .podium-banner-layer{
    background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d)!important;
    background-size:300% 300%!important;
    animation:linebckBannerDrift 22s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="legend"],
  #podium.live-podium .podium-slot.banner-legend .podium-banner-layer{
    background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.62),transparent 22%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337)!important;
    background-size:240% 240%!important;
    animation:linebckBannerDrift 24s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="night"],
  #podium.live-podium .podium-slot.banner-night .podium-banner-layer{
    background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),radial-gradient(circle at 72% 16%,#fff 0 1px,transparent 2px),linear-gradient(135deg,#10162c,#313466)!important;
    animation:linebckNightGlow 20s ease-in-out infinite alternate!important;
  }
}
.leaderboard-table .leaderboard-entry-banner,
.leaderboard-table .leaderboard-person:before,
.my-rank-card,
.ticker-entry{animation:none!important}

@media(max-width:860px){
  #podium.live-podium{grid-template-columns:1fr!important;min-height:0!important;padding:16px!important}
  #podium.live-podium .podium-slot,
  #podium.live-podium .podium-slot.place-1,
  #podium.live-podium .podium-slot.place-2,
  #podium.live-podium .podium-slot.place-3{
    --podium-card-h:auto;
    --podium-base-h:70px;
    display:grid!important;
    grid-template-rows:auto 70px!important;
    order:initial!important;
  }
  #podium.live-podium .podium-banner-layer{inset:0!important;height:100%!important;border-radius:18px!important}
  #podium.live-podium .podium-person,
  #podium.live-podium .place-1 .podium-person{grid-row:1!important;width:100%!important;min-height:0!important;max-height:none!important;margin:0!important;padding:74px 78px 20px 18px!important}
  #podium.live-podium .podium-base{grid-row:2!important;height:70px!important;border-radius:0 0 18px 18px!important}
}


/* FINAL PODIUM RESET — single authoritative layout */
#podium.live-podium{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1.08fr) minmax(0,1fr)!important;
  align-items:end!important;
  gap:18px!important;
  min-height:0!important;
  padding:28px 26px 0!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#faf7ec 0%,#efe9d8 100%)!important;
  border:2px solid var(--border)!important;
  border-radius:24px!important;
  box-shadow:9px 10px 0 rgba(48,76,40,.12)!important;
}
#podium.live-podium .podium-slot{
  --base-h:92px;
  position:relative!important;
  isolation:isolate!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  min-width:0!important;
  min-height:430px!important;
  padding:0!important;
  margin:0!important;
  transform:none!important;
  border:2px solid var(--border)!important;
  border-bottom:0!important;
  border-radius:20px 20px 0 0!important;
  background:#fffdf7!important;
  box-shadow:5px 0 0 rgba(45,70,38,.07)!important;
  overflow:hidden!important;
  color:var(--text)!important;
}
#podium.live-podium .podium-slot.place-1{order:2!important;min-height:510px!important;--base-h:142px;border-color:#a98423!important}
#podium.live-podium .podium-slot.place-2{order:1!important;min-height:455px!important;--base-h:110px}
#podium.live-podium .podium-slot.place-3{order:3!important;min-height:420px!important;--base-h:82px}
#podium.live-podium .podium-banner-layer{
  position:absolute!important;
  inset:0 0 var(--base-h) 0!important;
  width:auto!important;
  height:auto!important;
  z-index:0!important;
  opacity:.58!important;
  border:0!important;
  border-radius:0!important;
  mask-image:linear-gradient(to bottom,#000 0%,#000 68%,transparent 100%)!important;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 68%,transparent 100%)!important;
  animation:none!important;
  pointer-events:none!important;
}
#podium.live-podium .podium-card-topline{
  position:absolute!important;
  top:14px!important;left:14px!important;right:14px!important;
  z-index:4!important;
  display:flex!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin:0!important;
  pointer-events:none!important;
}
#podium.live-podium .podium-medal{
  position:relative!important;
  z-index:2!important;
  align-self:center!important;
  flex:0 0 auto!important;
  width:58px!important;height:58px!important;
  margin:54px 0 10px!important;
  display:grid!important;place-items:center!important;
  border:3px solid var(--border)!important;
  border-radius:50%!important;
  background:#fff9cf!important;
  box-shadow:0 7px 0 rgba(42,68,37,.14)!important;
  font-family:var(--pixel)!important;
  font-size:.76rem!important;
}
#podium.live-podium .place-1 .podium-medal{width:68px!important;height:68px!important;margin-top:50px!important;background:#f6d866!important;border-color:#98751f!important}
#podium.live-podium .place-2 .podium-medal{background:#dce2e5!important}
#podium.live-podium .place-3 .podium-medal{background:#ddb087!important}
#podium.live-podium .podium-person{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  flex:1 1 auto!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  width:calc(100% - 28px)!important;
  min-height:0!important;
  max-height:none!important;
  margin:0 14px 16px!important;
  padding:18px 16px 20px!important;
  border:1px solid rgba(42,70,37,.22)!important;
  border-radius:16px!important;
  background:rgba(255,253,246,.92)!important;
  box-shadow:0 8px 18px rgba(38,56,34,.08)!important;
  text-align:center!important;
  gap:7px!important;
  color:var(--text)!important;
}
#podium.live-podium .podium-avatar-stack{position:relative!important;margin:0 0 6px!important}
#podium.live-podium .podium-user-avatar{width:88px!important;height:88px!important;border-radius:20px!important;object-fit:cover!important;background:#fff!important;border:5px solid #fff!important;box-shadow:0 0 0 3px var(--border),0 9px 18px rgba(30,50,28,.16)!important}
#podium.live-podium .place-1 .podium-user-avatar{width:104px!important;height:104px!important}
#podium.live-podium .podium-identity{display:grid!important;gap:3px!important}
#podium.live-podium .podium-identity>strong{font-size:1.45rem!important;line-height:1.05!important}
#podium.live-podium .place-1 .podium-identity>strong{font-size:1.7rem!important}
#podium.live-podium .podium-title,#podium.live-podium .podium-status{font-size:.78rem!important;color:var(--muted)!important}
#podium.live-podium .podium-score{display:flex!important;align-items:baseline!important;gap:5px!important;margin-top:7px!important}
#podium.live-podium .podium-score b{font-size:1.32rem!important}
#podium.live-podium .podium-score span{font-size:.74rem!important;color:var(--muted)!important}
#podium.live-podium .podium-prize{min-height:38px!important;margin-top:5px!important;padding:8px 12px!important;border:1px solid rgba(43,72,38,.25)!important;border-radius:12px!important;background:#fffdf5!important;font-size:.76rem!important;font-weight:800!important}
#podium.live-podium .podium-base{
  position:relative!important;
  z-index:3!important;
  flex:0 0 var(--base-h)!important;
  width:100%!important;
  height:var(--base-h)!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  margin:0!important;
  border:0!important;
  border-top:2px solid var(--border)!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:#dce2e5!important;
}
#podium.live-podium .place-1 .podium-base{background:#f4d964!important}
#podium.live-podium .place-3 .podium-base{background:#dcb087!important}
#podium.live-podium .podium-base strong{font-size:2.15rem!important;line-height:1!important}
#podium.live-podium .podium-base span{margin-top:6px!important;font-family:var(--pixel)!important;font-size:.54rem!important;letter-spacing:.12em!important}
#podium.live-podium .podium-slot.is-me{outline:3px solid rgba(213,179,59,.72)!important;outline-offset:-4px!important}

@media(max-width:860px){
  #podium.live-podium{grid-template-columns:1fr!important;padding:16px!important;gap:12px!important}
  #podium.live-podium .podium-slot,#podium.live-podium .podium-slot.place-1,#podium.live-podium .podium-slot.place-2,#podium.live-podium .podium-slot.place-3{order:initial!important;min-height:0!important;--base-h:68px;border:2px solid var(--border)!important;border-radius:18px!important}
  #podium.live-podium .podium-banner-layer{inset:0!important;opacity:.22!important;mask-image:none!important;-webkit-mask-image:none!important}
  #podium.live-podium .podium-card-topline{position:relative!important;top:auto!important;left:auto!important;right:auto!important;margin:12px 12px 0!important}
  #podium.live-podium .podium-medal,#podium.live-podium .place-1 .podium-medal{position:absolute!important;right:18px!important;top:58px!important;width:48px!important;height:48px!important;margin:0!important}
  #podium.live-podium .podium-person{width:calc(100% - 28px)!important;margin:12px 14px 14px!important;padding:18px 74px 18px 18px!important;align-items:flex-start!important;text-align:left!important}
  #podium.live-podium .podium-avatar-stack{align-self:flex-start!important}
  #podium.live-podium .podium-user-avatar,#podium.live-podium .place-1 .podium-user-avatar{width:78px!important;height:78px!important}
  #podium.live-podium .podium-base{height:68px!important;flex-basis:68px!important;border-radius:0 0 16px 16px!important}
}


/* TRUE PODIUM v1 - isolated from all legacy podium CSS */
.true-podium{
  display:grid;
  grid-template-columns:1fr 1.08fr 1fr;
  align-items:end;
  gap:18px;
  min-height:500px;
  padding:34px 22px 0;
  border:2px solid var(--border);
  border-radius:26px;
  background:linear-gradient(180deg,#fbf8ec 0%,#f0ead5 100%);
  box-shadow:9px 10px 0 rgba(48,76,40,.12);
  overflow:hidden;
}
.true-podium-slot{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-end;
  min-width:0;
  background:transparent;
  border:0;
  box-shadow:none;
  overflow:visible;
  color:var(--text);
}
.true-podium-slot.place-1{order:2;min-height:455px}
.true-podium-slot.place-2{order:1;min-height:405px}
.true-podium-slot.place-3{order:3;min-height:370px}
.true-podium-banner{
  position:absolute;
  top:0;
  left:8%;
  right:8%;
  height:150px;
  z-index:0;
  border-radius:22px;
  opacity:.92;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,#000 0 72%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0 72%,transparent 100%);
}
.true-podium-slot.banner-paper .true-podium-banner{background:repeating-linear-gradient(0deg,transparent 0 22px,rgba(56,90,48,.055) 23px),linear-gradient(135deg,#fffdf6,#f5edd9)}
.true-podium-slot.banner-garden .true-podium-banner{background:radial-gradient(circle at 12% 22%,#f2d85d 0 5px,#fff4bb 6px 13px,transparent 14px),radial-gradient(circle at 86% 74%,#ed9d78 0 4px,#fff0c6 5px 12px,transparent 13px),linear-gradient(145deg,#dfeccd,#f8efc7)}
.true-podium-slot.banner-sprout .true-podium-banner{background:repeating-linear-gradient(135deg,#d8e7c9 0 16px,#ecf2dc 16px 32px)}
.true-podium-slot.banner-daisy .true-podium-banner{background:radial-gradient(circle at 18% 28%,#e0b931 0 5px,#fff2b6 6px 14px,transparent 15px),linear-gradient(150deg,#dfeccf,#fff0b6)}
.true-podium-slot.banner-veteran .true-podium-banner{background:repeating-linear-gradient(135deg,#263d2c 0 18px,#31533a 18px 36px)}
.true-podium-slot.banner-sunset .true-podium-banner{background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e)}
.true-podium-slot.banner-night .true-podium-banner{background:linear-gradient(135deg,#10162c,#313466)}
.true-podium-slot.banner-aurora .true-podium-banner{background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d)}
.true-podium-slot.banner-legend .true-podium-banner{background:linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337)}
.true-podium-topline{
  position:absolute;
  top:14px;
  left:11%;
  right:11%;
  z-index:4;
  display:flex;
  justify-content:space-between;
  pointer-events:none;
}
.true-podium-chip{
  padding:7px 9px;
  border:1px solid rgba(36,75,37,.36);
  border-radius:999px;
  background:rgba(255,253,245,.94);
  font-family:var(--pixel);
  font-size:.56rem;
}
.true-podium-medal{
  position:relative;
  z-index:3;
  align-self:center;
  width:58px;
  height:58px;
  margin-top:44px;
  display:grid;
  place-items:center;
  border:3px solid var(--border);
  border-radius:50%;
  background:#fff9cf;
  font-family:var(--pixel);
  font-size:.76rem;
  box-shadow:0 7px 0 rgba(42,68,37,.14);
}
.place-1 .true-podium-medal{width:68px;height:68px;background:#f6d866;border-color:#98751f}
.place-2 .true-podium-medal{background:#dce2e5}
.place-3 .true-podium-medal{background:#ddb087}
.true-podium-person{
  position:relative;
  z-index:3;
  width:min(84%,300px);
  margin:12px auto 16px;
  padding:16px 16px 14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:5px;
  text-align:center;
  background:rgba(255,253,247,.96);
  border:2px solid rgba(51,75,44,.22);
  border-radius:20px;
  box-shadow:0 9px 18px rgba(35,52,33,.1);
}
.place-1 .true-podium-person{width:min(86%,320px);padding-top:18px}
.true-podium-avatar{position:relative;margin-bottom:4px}
.true-podium .podium-user-avatar{width:76px!important;height:76px!important;border-radius:18px!important;object-fit:cover!important;border:4px solid #fff!important;box-shadow:0 0 0 3px var(--border),0 8px 16px rgba(30,50,28,.14)!important}
.true-podium .place-1 .podium-user-avatar{width:90px!important;height:90px!important}
.true-podium .leaderboard-badge.large{right:-8px!important;bottom:-6px!important;width:34px!important;height:34px!important}
.true-podium-identity{display:grid;gap:2px}
.true-podium-identity>strong{font-size:1.2rem;line-height:1.05}
.place-1 .true-podium-identity>strong{font-size:1.4rem}
.true-podium-title,.true-podium-status{font-size:.75rem;color:var(--muted)}
.true-podium-score{display:flex;align-items:baseline;gap:5px;margin-top:7px;flex-wrap:wrap;max-width:100%}
.true-podium-score b{font-size:1.12rem}
.place-1 .true-podium-score b{font-size:1.3rem}
.true-podium-score span{font-size:.7rem;color:var(--muted)}
.true-podium-prize{margin-top:5px;padding:7px 10px;border:1px solid rgba(43,72,38,.22);border-radius:11px;background:#fffdf5;font-size:.69rem;font-weight:800}
.true-podium-base{
  width:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  border:2px solid var(--border);
  border-bottom:0;
  border-radius:18px 18px 0 0;
}
.place-1 .true-podium-base{height:145px;background:#f4d964;border-color:#9b7820}
.place-2 .true-podium-base{height:105px;background:#dfe6ea}
.place-3 .true-podium-base{height:78px;background:#ddb08c}
.true-podium-base strong{font-size:2rem;line-height:1}
.true-podium-base span{margin-top:6px;font-family:var(--pixel);font-size:.52rem;letter-spacing:.12em}
.true-podium-slot.is-me .true-podium-person{outline:3px solid rgba(213,179,59,.62);outline-offset:2px}
.true-podium-empty{position:relative;z-index:2;margin:auto;text-align:center;color:var(--muted)}
@media(max-width:860px){
  .true-podium{grid-template-columns:1fr;min-height:0;padding:16px;gap:12px}
  .true-podium-slot,.true-podium-slot.place-1,.true-podium-slot.place-2,.true-podium-slot.place-3{order:initial;min-height:0}
  .true-podium-banner{left:0;right:0;height:62%;opacity:.55;-webkit-mask-image:linear-gradient(to bottom,#000 0 55%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0 55%,transparent 100%)}
  .true-podium-topline{left:14px;right:14px}
  .true-podium-medal,.place-1 .true-podium-medal{position:absolute;right:18px;top:52px;margin:0;width:48px;height:48px}
  .true-podium-person,.place-1 .true-podium-person{width:calc(100% - 28px);margin:70px auto 12px;padding:16px 70px 16px 16px;align-items:flex-start;text-align:left}
  .true-podium .podium-user-avatar,.true-podium .place-1 .podium-user-avatar{width:72px!important;height:72px!important}
  .place-1 .true-podium-base,.place-2 .true-podium-base,.place-3 .true-podium-base{height:68px}
}


/* Restore calm banner motion on profile and true podium only. */
@keyframes linebckBannerDrift{
  0%{background-position:0% 50%}
  100%{background-position:100% 50%}
}
@keyframes linebckNightPulse{
  0%{background-position:0 0,0 0,0% 50%;filter:brightness(.92)}
  100%{background-position:70px -28px,-55px 38px,100% 50%;filter:brightness(1.08)}
}
@keyframes linebckAuroraFlow{
  0%{background-position:0% 45%}
  100%{background-position:100% 55%}
}

@media (min-width:701px) and (prefers-reduced-motion:no-preference){
  .profile-hero[data-banner="sunset"]{
    background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e)!important;
    background-size:220% 220%!important;
    animation:linebckBannerDrift 18s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="aurora"]{
    background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d)!important;
    background-size:320% 320%!important;
    animation:linebckAuroraFlow 22s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="legend"]{
    background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.75),transparent 20%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337)!important;
    background-size:180% 180%,260% 260%!important;
    animation:linebckBannerDrift 24s ease-in-out infinite alternate!important;
  }
  .profile-hero[data-banner="night"]{
    background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),radial-gradient(circle at 75% 65%,#cdd8ff 0 2px,transparent 3px),linear-gradient(135deg,#10162c,#313466 55%,#17162f)!important;
    background-size:auto,auto,220% 220%!important;
    animation:linebckNightPulse 20s ease-in-out infinite alternate!important;
  }

  .true-podium-slot.banner-sunset .true-podium-banner{
    background:linear-gradient(115deg,#44265d,#e46d6d 48%,#ffd36e)!important;
    background-size:220% 220%!important;
    animation:linebckBannerDrift 18s ease-in-out infinite alternate!important;
  }
  .true-podium-slot.banner-aurora .true-podium-banner{
    background:linear-gradient(120deg,#122d31,#43c6ac,#7656d6,#f1b36d)!important;
    background-size:320% 320%!important;
    animation:linebckAuroraFlow 22s ease-in-out infinite alternate!important;
  }
  .true-podium-slot.banner-legend .true-podium-banner{
    background:radial-gradient(circle at 20% 20%,rgba(255,244,159,.75),transparent 20%),linear-gradient(135deg,#294d31,#c89e43 50%,#2d5337)!important;
    background-size:180% 180%,260% 260%!important;
    animation:linebckBannerDrift 24s ease-in-out infinite alternate!important;
  }
  .true-podium-slot.banner-night .true-podium-banner{
    background:radial-gradient(circle at 20% 30%,#fff5a8 0 2px,transparent 3px),radial-gradient(circle at 75% 65%,#cdd8ff 0 2px,transparent 3px),linear-gradient(135deg,#10162c,#313466 55%,#17162f)!important;
    background-size:auto,auto,220% 220%!important;
    animation:linebckNightPulse 20s ease-in-out infinite alternate!important;
  }
}

@media (max-width:700px),(prefers-reduced-motion:reduce){
  .profile-hero,
  .true-podium-banner{animation:none!important;background-position:50% 50%!important}
}


/* Visible animated light layer for profile and true podium banners. */
@keyframes linebckVisibleSweep{
  0%{transform:translate3d(-38%,0,0) rotate(-8deg)}
  100%{transform:translate3d(38%,0,0) rotate(-8deg)}
}
@keyframes linebckVisibleAurora{
  0%{transform:translate3d(-28%,-8%,0) scale(1.05) rotate(-5deg)}
  100%{transform:translate3d(28%,8%,0) scale(1.12) rotate(5deg)}
}
@keyframes linebckVisibleNight{
  0%{transform:translate3d(-18px,-8px,0);opacity:.38}
  100%{transform:translate3d(22px,12px,0);opacity:.72}
}

.profile-hero[data-banner="sunset"],
.profile-hero[data-banner="aurora"],
.profile-hero[data-banner="night"],
.profile-hero[data-banner="legend"],
.true-podium-slot.banner-sunset .true-podium-banner,
.true-podium-slot.banner-aurora .true-podium-banner,
.true-podium-slot.banner-night .true-podium-banner,
.true-podium-slot.banner-legend .true-podium-banner{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.profile-hero[data-banner="sunset"]>*,
.profile-hero[data-banner="aurora"]>*,
.profile-hero[data-banner="night"]>*,
.profile-hero[data-banner="legend"]>*{
  position:relative;
  z-index:2;
}

.profile-hero[data-banner="sunset"]::before,
.profile-hero[data-banner="aurora"]::before,
.profile-hero[data-banner="night"]::before,
.profile-hero[data-banner="legend"]::before,
.true-podium-slot.banner-sunset .true-podium-banner::before,
.true-podium-slot.banner-aurora .true-podium-banner::before,
.true-podium-slot.banner-night .true-podium-banner::before,
.true-podium-slot.banner-legend .true-podium-banner::before{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  inset:-35% -42%!important;
  pointer-events:none!important;
  opacity:.62!important;
  will-change:transform!important;
}

.profile-hero[data-banner="sunset"]::before,
.true-podium-slot.banner-sunset .true-podium-banner::before{
  background:linear-gradient(100deg,transparent 25%,rgba(255,241,164,.48) 42%,rgba(255,255,255,.72) 50%,rgba(255,195,129,.34) 58%,transparent 75%)!important;
  animation:linebckVisibleSweep 9s ease-in-out infinite alternate!important;
}
.profile-hero[data-banner="aurora"]::before,
.true-podium-slot.banner-aurora .true-podium-banner::before{
  background:radial-gradient(ellipse at center,rgba(133,255,224,.68) 0%,rgba(157,125,255,.45) 36%,rgba(255,188,111,.22) 55%,transparent 72%)!important;
  animation:linebckVisibleAurora 11s ease-in-out infinite alternate!important;
}
.profile-hero[data-banner="legend"]::before,
.true-podium-slot.banner-legend .true-podium-banner::before{
  background:linear-gradient(105deg,transparent 22%,rgba(255,235,129,.25) 38%,rgba(255,252,206,.72) 50%,rgba(217,167,55,.28) 62%,transparent 78%)!important;
  animation:linebckVisibleSweep 12s ease-in-out infinite alternate!important;
}
.profile-hero[data-banner="night"]::before,
.true-podium-slot.banner-night .true-podium-banner::before{
  inset:-12%!important;
  background:
    radial-gradient(circle at 18% 24%,rgba(255,250,177,.95) 0 2px,transparent 3px),
    radial-gradient(circle at 70% 18%,rgba(215,225,255,.85) 0 1.5px,transparent 2.5px),
    radial-gradient(circle at 42% 72%,rgba(255,255,255,.75) 0 1px,transparent 2px),
    radial-gradient(circle at 88% 62%,rgba(183,211,255,.82) 0 1.5px,transparent 2.5px)!important;
  background-size:150px 120px,190px 145px,125px 105px,210px 160px!important;
  animation:linebckVisibleNight 8s ease-in-out infinite alternate!important;
}

/* Keep only small-screen banners static; desktop always animates as selected. */
@media(max-width:700px){
  .profile-hero[data-banner="sunset"]::before,
  .profile-hero[data-banner="aurora"]::before,
  .profile-hero[data-banner="night"]::before,
  .profile-hero[data-banner="legend"]::before,
  .true-podium-slot.banner-sunset .true-podium-banner::before,
  .true-podium-slot.banner-aurora .true-podium-banner::before,
  .true-podium-slot.banner-night .true-podium-banner::before,
  .true-podium-slot.banner-legend .true-podium-banner::before{
    animation:none!important;
    transform:none!important;
  }
}


/* Banner alignment fix for true podium: keep the animated banner anchored behind each winner card. */
.true-podium-slot{
  overflow:hidden;
  border-radius:22px 22px 0 0;
}
.true-podium-banner{
  top:8px!important;
  left:10px!important;
  right:10px!important;
  border-radius:20px!important;
  opacity:.55!important;
  z-index:0!important;
  -webkit-mask-image:linear-gradient(to bottom,#000 0 38%,rgba(0,0,0,.35) 68%,transparent 100%)!important;
  mask-image:linear-gradient(to bottom,#000 0 38%,rgba(0,0,0,.35) 68%,transparent 100%)!important;
}
/* the person block (avatar + name) must sit above its own banner */
.true-podium-person{position:relative;z-index:2}
.true-podium-medal{position:relative;z-index:3}
.true-podium-slot.place-1 .true-podium-banner{height:242px!important}
.true-podium-slot.place-2 .true-podium-banner{height:214px!important}
.true-podium-slot.place-3 .true-podium-banner{height:204px!important}
.true-podium-topline{
  top:26px!important;
  left:28px!important;
  right:28px!important;
}
.true-podium-medal{
  margin-top:58px!important;
}
.true-podium-person{
  margin-top:10px!important;
}
@media(max-width:860px){
  .true-podium-slot{overflow:visible}
  .true-podium-banner{
    top:0!important;
    left:0!important;
    right:0!important;
    height:100%!important;
    border-radius:18px!important;
    opacity:.22!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  .true-podium-topline{top:14px!important;left:14px!important;right:14px!important}
  .true-podium-medal{margin-top:0!important}
  .true-podium-person{margin-top:70px!important}
}



/* Garden Clash playable prototype */
.clash-hero{display:flex;justify-content:space-between;align-items:end;gap:24px}.clash-wallet{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:10px}.clash-wallet>div{padding:14px 18px;border:2px solid var(--border);background:var(--card);box-shadow:4px 5px 0 rgba(48,76,40,.12)}.clash-wallet strong,.clash-wallet span{display:block}.clash-wallet strong{font-size:1.35rem}.clash-wallet span{font-size:.72rem;color:var(--muted);margin-top:3px}.clash-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:18px;margin:26px 0 70px}.clash-panel,.side-card{border:2px solid var(--border);background:var(--card);box-shadow:var(--shadow)}.clash-panel{padding:22px}.clash-sidebar{display:grid;align-content:start;gap:14px}.side-card{padding:18px}.fighter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.fighter-card{appearance:none;text-align:left;padding:15px;border:2px solid var(--border);background:var(--cream);color:var(--text);cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;border-radius:16px;transition:.18s ease}.fighter-card:hover{transform:translateY(-3px)}.fighter-card.selected{border-color:#7656d6;box-shadow:0 0 0 3px rgba(118,86,214,.18)}.fighter-card-icon{font-size:2.2rem}.fighter-card strong,.fighter-card small{display:block}.fighter-card small{color:var(--muted);margin-top:3px}.fighter-card em{font-style:normal;font-size:.72rem}.fighter-card p{grid-column:1/-1;margin:0;font-size:.75rem;color:var(--muted)}.battle-board{margin-top:22px;display:grid;grid-template-columns:1fr 180px 1fr;gap:18px;align-items:center;padding:24px;border:2px solid var(--border);border-radius:22px;background:radial-gradient(circle at 50% 30%,rgba(118,86,214,.15),transparent 35%),linear-gradient(135deg,rgba(35,91,51,.12),rgba(118,86,214,.1))}.combatant{text-align:center;padding:18px;border:1px solid rgba(43,72,38,.22);background:rgba(255,253,247,.9);border-radius:18px}.combatant-label,.round-counter{font-family:var(--pixel);font-size:.58rem;letter-spacing:.1em}.fighter-portrait{font-size:4.4rem;line-height:1;margin:12px}.combatant h3{margin:7px 0}.hp-line{height:11px;border-radius:20px;background:rgba(44,53,39,.15);overflow:hidden;margin:13px 0 7px}.hp-line span{display:block;height:100%;width:100%;background:linear-gradient(90deg,#4d9a5f,#87c56f);transition:width .35s ease}.battle-center{text-align:center}.versus{font-family:var(--pixel);font-size:1.25rem;margin:20px 0}.battle-center p{font-size:.78rem;color:var(--muted)}.action-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.clash-action{padding:17px;border:2px solid var(--border);border-radius:15px;background:var(--card);color:var(--text);cursor:pointer;transition:.18s ease}.clash-action:hover{transform:translateY(-3px);box-shadow:4px 5px 0 rgba(48,76,40,.14)}.clash-action span,.clash-action strong,.clash-action small{display:block}.clash-action span{font-size:1.8rem}.clash-action strong{margin:7px 0}.clash-action small{color:var(--muted)}.clash-action.attack:hover{border-color:#c25b50}.clash-action.defend:hover{border-color:#4b779b}.clash-action.special:hover{border-color:#8b65b8}.combat-log{display:grid;gap:8px;max-height:300px;overflow:auto;margin-top:12px}.combat-log p{margin:0;padding:9px;border-left:3px solid var(--border);background:rgba(255,255,255,.35);font-size:.74rem}.reward-rule{display:flex;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid rgba(44,53,39,.14);font-size:.76rem}.reward-rule span{font-weight:800;color:var(--green-dark)}.counter-guide{display:grid;grid-template-columns:1fr auto 1fr;gap:7px;align-items:center;padding:8px 0;font-size:.72rem}.counter-guide b{color:var(--muted)}.battle-result{text-align:center;margin-top:18px;padding:22px;border:2px solid var(--border);border-radius:18px;background:linear-gradient(135deg,rgba(245,217,100,.2),rgba(118,86,214,.12))}.result-icon{font-size:3rem}.battle-result h2{margin:5px}.reward-row{display:flex;justify-content:center;gap:10px;margin:15px}.reward-row span{padding:8px 12px;border:1px solid var(--border);background:var(--card);font-weight:800;border-radius:999px}.muted{color:var(--muted);font-size:.75rem}.theme-night .combatant{background:rgba(13,20,22,.9)}.theme-night .fighter-card,.theme-night .clash-action{background:#11191b}.theme-night .combat-log p{background:rgba(255,255,255,.035)}
@media(max-width:980px){.clash-layout{grid-template-columns:1fr}.clash-sidebar{grid-template-columns:repeat(3,1fr)}.battle-board{grid-template-columns:1fr 130px 1fr}}
@media(max-width:760px){.clash-hero{align-items:stretch;flex-direction:column}.clash-wallet{width:100%}.fighter-grid,.action-grid,.clash-sidebar{grid-template-columns:1fr}.battle-board{grid-template-columns:1fr}.battle-center{order:-1}.fighter-card{grid-template-columns:auto 1fr auto}.combatant{padding:14px}.fighter-portrait{font-size:3rem}}


/* Garden Clash Loadout Prototype v2 */
.clash-v2-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;margin:26px 0 70px}.clash-lab-panel{min-width:0}.training-case-row{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;margin:14px 0 12px;padding:16px;border:2px solid var(--border);border-radius:18px;background:linear-gradient(135deg,rgba(118,86,214,.11),rgba(245,217,100,.14))}.training-case-visual{font-size:3.1rem}.training-case-row p{margin:5px 0 0;color:var(--muted);font-size:.76rem}.case-drop{margin:10px 0 18px;padding:13px 16px;border:2px solid var(--border);border-radius:14px;font-weight:800;background:var(--cream);animation:winPop .35s ease}.drop-rare{border-color:#4c83a8}.drop-epic{border-color:#8b65b8}.drop-legendary{border-color:#c99a17}.loadout-builder{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;margin:20px 0}.compact-fighters{margin-top:8px}.compact-fighters .fighter-card{grid-template-columns:auto 1fr}.compact-fighters .fighter-card em{display:none}.loadout-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:8px}.loadout-slot{min-height:155px;padding:13px 10px;border:2px dashed rgba(65,82,54,.35);border-radius:16px;background:rgba(255,255,255,.28);text-align:center}.loadout-slot small,.loadout-slot strong,.loadout-slot p{display:block}.loadout-slot>span{display:block;font-size:2rem;margin:8px}.loadout-slot small{text-transform:uppercase;font-family:var(--pixel);font-size:.5rem}.loadout-slot p{font-size:.66rem;color:var(--muted);margin:6px 0}.inventory-head{display:flex;justify-content:space-between;align-items:end;gap:16px;margin:22px 0 10px}.inventory-head h3{margin:0}.inventory-head span{font-size:.72rem;color:var(--muted)}.item-inventory{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.inventory-item{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:13px;border:2px solid var(--border);border-radius:16px;background:var(--cream)}.inventory-item-icon{font-size:2rem}.inventory-item strong,.inventory-item p,.rarity-label{display:block}.inventory-item p{font-size:.68rem;color:var(--muted);margin:5px 0}.inventory-item .btn{grid-column:1/-1;width:100%;padding:9px}.inventory-item.locked{opacity:.45;filter:grayscale(.7)}.rarity-label{font-family:var(--pixel);font-size:.48rem;text-transform:uppercase;color:var(--muted);margin-bottom:4px}.rarity-rare{border-color:rgba(76,131,168,.55)}.rarity-epic{border-color:rgba(139,101,184,.6)}.rarity-legendary{border-color:rgba(201,154,23,.68);background:linear-gradient(135deg,var(--cream),rgba(247,220,112,.18))}.battle-head{margin-top:30px;padding-top:24px;border-top:2px solid var(--border)}.intent-card{display:grid;grid-template-columns:auto auto 1fr;gap:13px;align-items:center;margin:12px 0 -5px;padding:14px 18px;border:2px solid #b66a58;border-radius:16px;background:linear-gradient(135deg,rgba(194,91,80,.12),rgba(245,217,100,.08))}.intent-label{grid-column:1/-1;font-family:var(--pixel);font-size:.52rem;letter-spacing:.08em}.intent-card>strong{font-size:2rem}.intent-card b,.intent-card small{display:block}.intent-card small{color:var(--muted);margin-top:3px}.battle-board-v2{margin-top:14px}.status-row{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:10px}.status-row span{padding:5px 8px;border:1px solid rgba(43,72,38,.2);border-radius:999px;font-size:.68rem;background:rgba(255,255,255,.48)}.action-grid-v2{grid-template-columns:repeat(4,1fr)}.clash-action.charge:hover{border-color:#d0a632}.clash-action:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.active-item-row{display:flex;justify-content:center;margin-top:12px}.active-item-button{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;min-width:250px;padding:11px 15px;border:2px solid #8b65b8;border-radius:15px;background:linear-gradient(135deg,rgba(118,86,214,.15),var(--card));color:var(--text);cursor:pointer;text-align:left}.active-item-button>span{grid-row:1/3;font-size:1.8rem}.active-item-button strong,.active-item-button small{display:block}.active-item-button small{color:var(--muted)}.active-item-button:disabled{opacity:.5}.build-summary{display:grid;gap:8px;margin-top:12px}.build-summary>div{display:grid;grid-template-columns:auto 1fr;gap:9px;padding:9px;border:1px solid rgba(43,72,38,.18);border-radius:12px}.build-summary>div>span{font-size:1.5rem}.build-summary p,.build-summary small{display:block;margin:0}.build-summary small{color:var(--muted);margin-top:3px}.theme-night .training-case-row,.theme-night .intent-card,.theme-night .inventory-item,.theme-night .loadout-slot{background-color:#11191b}.theme-night .status-row span{background:rgba(255,255,255,.04)}
@media(max-width:1100px){.clash-v2-layout{grid-template-columns:1fr}.clash-sidebar{grid-template-columns:repeat(3,1fr)}.item-inventory{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.loadout-builder{grid-template-columns:1fr}.action-grid-v2{grid-template-columns:repeat(2,1fr)}.training-case-row{grid-template-columns:auto 1fr}.training-case-row .btn{grid-column:1/-1}.loadout-slots{grid-template-columns:1fr}.item-inventory,.clash-sidebar{grid-template-columns:1fr}}

/* Garden Clash Auto-Battle v3 */
.auto-clash-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}.auto-setup-panel,.auto-arena-panel{margin-bottom:18px}.auto-setup-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;margin-bottom:18px}.stance-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.stance-card{padding:14px;border:2px solid var(--border);border-radius:14px;background:var(--card);text-align:left;cursor:pointer}.stance-card strong,.stance-card small{display:block}.stance-card small{margin-top:5px;color:var(--muted)}.stance-card.selected{outline:3px solid #7c5bd6;background:#f3edff}.auto-arena{position:relative;min-height:430px;overflow:hidden;border:2px solid var(--border);border-radius:22px;background:linear-gradient(#171d35 0 62%,#273d2d 62%);isolation:isolate}.arena-sky{position:absolute;inset:0 0 38%;background:radial-gradient(circle at 50% 15%,rgba(148,109,255,.35),transparent 32%),linear-gradient(180deg,#11182d,#28385d)}.arena-ground{position:absolute;inset:62% 0 0;background:radial-gradient(ellipse at center,#4f704d,#263e2d 68%);border-top:3px solid rgba(255,255,255,.12)}.arena-side{position:absolute;bottom:38px;width:38%;z-index:3}.arena-player{left:5%}.arena-enemy{right:5%;text-align:right}.arena-name{display:flex;justify-content:space-between;color:#fff;text-shadow:0 2px 3px #000}.arena-name span{font-size:.75rem;opacity:.8}.arena-hp{height:14px;margin:8px 0;border:2px solid rgba(255,255,255,.8);border-radius:999px;background:#1a2030;overflow:hidden}.arena-hp span{display:block;height:100%;width:100%;background:linear-gradient(90deg,#5cc66d,#a8e36e);transition:width .25s}.arena-status{display:flex;gap:8px;min-height:26px;color:#fff;font-size:.75rem}.arena-enemy .arena-status{justify-content:flex-end}.battle-sprite{font-size:112px;line-height:1;filter:drop-shadow(0 18px 12px rgba(0,0,0,.38));transform-origin:50% 100%;will-change:transform}.battle-sprite.enemy{transform:scaleX(-1)}.arena-center{position:absolute;left:50%;top:22%;transform:translateX(-50%);z-index:4;text-align:center;color:#fff}.battle-countdown{font-family:var(--pixel);font-size:1rem;letter-spacing:.12em}.battle-timer{margin-top:8px;font-size:1.7rem;font-weight:900}.battle-fx{position:absolute;inset:0;z-index:8;display:grid;place-items:center;pointer-events:none}.battle-fx>div{font-family:var(--pixel);font-size:3rem;color:#fff;text-shadow:0 4px 0 #000;animation:fxPop .52s ease both}.fx-slash:before{content:"";display:block;width:180px;height:18px;background:linear-gradient(90deg,transparent,#fff,transparent);transform:rotate(-22deg);box-shadow:0 0 25px #b8e6ff}.fx-burst{filter:drop-shadow(0 0 22px #bd8cff)}.fx-shield{filter:drop-shadow(0 0 18px #79c9ff)}.fx-heal{color:#8ff2a4!important}.fx-crit{color:#ffe36c!important}.fx-finish{font-size:2.2rem!important;color:#ffe36c!important}.battle-event-strip{margin-top:12px;padding:13px 16px;border:2px solid var(--border);border-radius:14px;background:var(--card);font-weight:700;text-align:center}.auto-controls{display:flex;justify-content:center;gap:10px;margin-top:12px}.battle-start-btn{min-width:170px}.attack-anim{animation:spriteAttack .34s ease}.enemy.attack-anim{animation:spriteAttackEnemy .34s ease}.hit-anim{animation:spriteHit .3s ease}.skill-anim{animation:spriteSkill .55s ease}.ko-anim{animation:spriteKo .75s ease forwards}@keyframes spriteAttack{50%{transform:translateX(95px) scale(1.08)}}@keyframes spriteAttackEnemy{50%{transform:scaleX(-1) translateX(95px) scale(1.08)}}@keyframes spriteHit{35%{transform:translateX(-18px) rotate(-7deg);filter:brightness(2) drop-shadow(0 0 18px #ff7777)}}@keyframes spriteSkill{35%{transform:translateY(-25px) scale(1.22);filter:drop-shadow(0 0 28px #c596ff)}}@keyframes spriteKo{to{transform:translateY(40px) rotate(70deg) scale(.75);opacity:.3}}@keyframes fxPop{0%{transform:scale(.4);opacity:0}45%{transform:scale(1.18);opacity:1}100%{transform:scale(1);opacity:0}}@media(max-width:980px){.auto-clash-layout{grid-template-columns:1fr}.clash-sidebar{display:grid;grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.auto-setup-grid,.stance-grid{grid-template-columns:1fr}.clash-sidebar{grid-template-columns:1fr}.auto-arena{min-height:360px}.battle-sprite{font-size:76px}.arena-side{width:43%}.arena-player{left:3%}.arena-enemy{right:3%}.arena-name{font-size:.8rem;display:block}.arena-name span{display:block}.battle-fx>div{font-size:2rem}}


/* Garden Clash V4: large central battle, separated modes and simplified overview. */
.clash-v4{display:grid;gap:18px;margin-bottom:70px}.mode-switch{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.mode-card{display:flex;align-items:center;gap:16px;padding:18px;border:2px solid var(--border);border-radius:18px;background:var(--card);color:var(--text);text-align:left;cursor:pointer}.mode-card>span{font-size:2rem}.mode-card b,.mode-card small{display:block}.mode-card small{color:var(--muted);margin-top:4px}.mode-card.selected{outline:3px solid #7656d6;background:linear-gradient(135deg,rgba(118,86,214,.12),rgba(72,158,112,.09))}.prep-panel{padding:22px}.prep-summary{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:18px}.prep-summary>.label,.prep-summary .label{font-family:var(--pixel);font-size:.58rem}.compact-fighters .fighter-card{grid-template-columns:auto 1fr}.compact-fighters .fighter-card em{display:none}.loadout-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.loadout-slot{padding:13px;border:2px dashed var(--border);border-radius:14px;text-align:center;background:var(--cream)}.loadout-slot span,.loadout-slot strong,.loadout-slot small{display:block}.loadout-slot span{font-size:1.7rem;margin:5px}.mode-config{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:end;margin-top:22px;padding-top:20px;border-top:2px solid var(--border)}.enemy-picker,.dungeon-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.enemy-card,.dungeon-card{padding:13px;border:2px solid var(--border);border-radius:14px;background:var(--card);color:var(--text);cursor:pointer}.enemy-card span,.enemy-card b,.enemy-card small{display:block}.enemy-card span{font-size:2rem}.enemy-card small,.dungeon-card small{color:var(--muted)}.enemy-card.selected,.dungeon-card.selected{outline:3px solid #7656d6}.dungeon-card{display:flex;gap:12px;align-items:center;text-align:left}.dungeon-card>span{font-size:2rem}.giant-start{min-width:210px;min-height:58px}.battle-stage-panel{padding:22px}.battle-stage-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}.stage-meta{display:flex;align-items:center;gap:12px}.clash6-arena{min-height:620px}.clash6-arena .arena-side{bottom:62px}.clash6-arena .arena-player{left:8%}.clash6-arena .arena-enemy{right:8%}.clash6-arena .arena-center{top:14%}.projectile-layer{position:absolute;inset:0;z-index:7;pointer-events:none}.battle-projectile{position:absolute;top:54%;font-size:2.5rem;filter:drop-shadow(0 0 12px #fff)}.battle-projectile.from-player{left:23%;animation:projectileRight .6s ease both}.battle-projectile.from-enemy{right:23%;animation:projectileLeft .6s ease both}.clash-v4-lower{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px}.item-inventory{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.inventory-item{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:14px;border:2px solid var(--border);border-radius:15px;background:var(--card)}.inventory-item button{grid-column:1/-1}.inventory-item-icon{font-size:2rem}.rarity-label{font-family:var(--pixel);font-size:.52rem}.inventory-item strong,.inventory-item p{display:block}.inventory-item p{font-size:.72rem;color:var(--muted)}.locked{opacity:.45}
.clash6-arena .battle-sprite{transform-origin:50% 96%;transition:filter .12s}
/* Mirror the artwork, not the animated element, so keyframes stay
   variable-free and work on older Chrome builds. */
.clash6-arena .battle-sprite.enemy>svg{transform:scaleX(-1)}

@keyframes v4Lunge{0%{transform:translate(0,0)}18%{transform:translate(-18px,0) scale(.96,1.04)}44%{transform:translate(132px,-10px) rotate(-9deg) scale(1.08)}60%{transform:translate(96px,0) rotate(3deg)}100%{transform:translate(0,0)}}
@keyframes v4Dash{0%{transform:translate(0,0);filter:blur(0)}22%{transform:translate(-26px,0)}44%{transform:translate(150px,0) scale(1.06);filter:blur(3px)}66%{transform:translate(70px,0);filter:blur(0)}100%{transform:translate(0,0)}}
@keyframes v4Slam{0%{transform:translate(0,0)}26%{transform:translate(30px,-70px) rotate(-16deg)}44%{transform:translate(110px,-52px) rotate(-8deg)}58%{transform:translate(122px,14px) rotate(14deg) scale(1.1,.88)}72%{transform:translate(100px,0) rotate(4deg)}100%{transform:translate(0,0)}}
@keyframes v4Uppercut{0%{transform:translate(0,0)}24%{transform:translate(0,22px) scale(.9,1.1)}54%{transform:translate(84px,-96px) rotate(-24deg) scale(1.1)}76%{transform:translate(50px,10px)}100%{transform:translate(0,0)}}
@keyframes v4Flurry{0%,100%{transform:translate(0,0)}14%{transform:translate(112px,-8px)}28%{transform:translate(58px,6px)}42%{transform:translate(126px,-14px)}56%{transform:translate(64px,4px)}72%{transform:translate(118px,-6px)}86%{transform:translate(40px,0)}}
@keyframes v4Spin{0%{transform:rotate(0) translate(0,0)}20%{transform:rotate(0) translate(-14px,0)}52%{transform:rotate(180deg) translate(104px,-30px) scale(1.1)}76%{transform:rotate(360deg) translate(62px,0)}100%{transform:rotate(360deg) translate(0,0)}}
@keyframes v4Jump{0%{transform:translate(0,0) scale(1,1)}16%{transform:translate(0,16px) scale(1.14,.84)}48%{transform:translate(74px,-104px) scale(.9,1.14)}74%{transform:translate(124px,18px) scale(1.18,.82)}88%{transform:translate(86px,0) scale(1,1)}100%{transform:translate(0,0)}}
@keyframes v4Cast{0%{transform:scale(1);filter:brightness(1)}30%{transform:translateY(18px) scale(.9);filter:brightness(1.5)}58%{transform:translateY(-42px) scale(1.24);filter:brightness(2.1) drop-shadow(0 0 40px #b994ff)}80%{transform:translateY(-6px) scale(1.06)}100%{transform:scale(1);filter:brightness(1)}}
@keyframes v4Hit{0%{transform:translate(0,0);filter:brightness(1)}18%{transform:translate(-30px,0) rotate(-8deg);filter:brightness(2.6) saturate(.3) drop-shadow(0 0 22px #ff7d7d)}44%{transform:translate(10px,0) rotate(2deg)}70%{transform:translate(-8px,0)}100%{transform:translate(0,0);filter:brightness(1)}}
@keyframes v4HeavyHit{0%{transform:translate(0,0);filter:brightness(1)}10%{transform:translate(-52px,-14px) rotate(-15deg) scale(.92);filter:brightness(3.2) saturate(0)}26%{transform:translate(-30px,8px) rotate(7deg)}44%{transform:translate(-44px,0) rotate(-5deg);filter:brightness(1.4)}64%{transform:translate(-16px,0) rotate(2deg)}82%{transform:translate(-6px,0)}100%{transform:translate(0,0);filter:brightness(1)}}
@keyframes v4Block{0%,100%{transform:translate(0,0)}20%,60%{transform:translate(-12px,0) scale(.94,1.06);filter:brightness(1.6)}40%,80%{transform:translate(6px,0)}}
@keyframes v4Ko{0%{transform:rotate(0) translate(0,0) scale(1);opacity:1;filter:grayscale(0)}18%{transform:rotate(-35deg) translate(-40px,-70px) scale(1.05);opacity:1;filter:grayscale(.3)}45%{transform:rotate(-160deg) translate(-160px,-40px) scale(.85);opacity:.9;filter:grayscale(.7)}100%{transform:rotate(-320deg) translate(-420px,140px) scale(.35);opacity:0;filter:grayscale(1)}}}
.anim-lunge{animation:v4Lunge .44s cubic-bezier(.3,1.5,.4,1)}
.anim-dash{animation:v4Dash .42s cubic-bezier(.2,.9,.2,1)}
.anim-slam{animation:v4Slam .62s cubic-bezier(.35,1.4,.5,1)}
.anim-uppercut{animation:v4Uppercut .54s cubic-bezier(.25,1.6,.45,1)}
.anim-flurry{animation:v4Flurry .66s linear}
.anim-spin{animation:v4Spin .64s cubic-bezier(.35,1.15,.45,1)}
.anim-jump{animation:v4Jump .62s cubic-bezier(.3,1.35,.4,1)}
.anim-cast{animation:v4Cast .7s ease-out}
.anim-hit{animation:v4Hit .34s ease-out}
.anim-heavy-hit{animation:v4HeavyHit .56s cubic-bezier(.2,1.2,.3,1)}
.anim-block{animation:v4Block .38s ease-out}
.anim-ko{animation:v4Ko 1.1s cubic-bezier(.3,.1,.4,1) forwards}
@keyframes v4Shake{0%,100%{transform:translate(0,0)}18%{transform:translate(-8px,4px)}36%{transform:translate(7px,-4px)}54%{transform:translate(-5px,-2px)}78%{transform:translate(4px,3px)}}
.clash6-arena.shake{animation:v4Shake .3s ease-out}
.clash6-arena.shake-hard{animation:v4Shake .42s ease-out 1.4}
.battle-fx .fx-ring{width:170px;height:170px;border-radius:50%;border:5px solid rgba(255,255,255,.85);font-size:0!important;text-shadow:none!important;animation:v4Ring .45s ease-out forwards!important}
@keyframes v4Ring{0%{opacity:.9;transform:scale(.15)}100%{opacity:0;transform:scale(1.9)}}
.battle-fx .fx-dmg{position:absolute;top:34%;font-family:var(--pixel);font-size:1.5rem!important;color:#fff;text-shadow:0 3px 0 #000;animation:v4Float .9s ease-out forwards!important}
.battle-fx .fx-dmg.crit{font-size:2.2rem!important;color:#ffe36c!important}
@keyframes v4Float{0%{opacity:0;transform:translateY(14px) scale(.7)}25%{opacity:1;transform:translateY(-8px) scale(1.1)}100%{opacity:0;transform:translateY(-70px) scale(1)}}
.clash6-arena .arena-hp span{transition:width .3s cubic-bezier(.2,.9,.3,1)}
@keyframes v4HpFlash{0%,100%{filter:none}40%{filter:brightness(2.3)}}
.clash6-arena .arena-hp.flash{animation:v4HpFlash .3s ease-out}
@keyframes projectileRight{0%{opacity:0;left:23%;transform:translateY(0) scale(.5) rotate(0)}12%{opacity:1}100%{opacity:1;left:70%;transform:translateY(-22px) scale(1.35) rotate(340deg)}}
@keyframes projectileLeft{0%{opacity:0;right:23%;transform:translateY(0) scale(.5) rotate(0)}12%{opacity:1}100%{opacity:1;right:70%;transform:translateY(-22px) scale(1.35) rotate(-340deg)}}
.battle-projectile.from-player{animation:projectileRight .54s cubic-bezier(.3,.1,.6,1) both}
.battle-projectile.from-enemy{animation:projectileLeft .54s cubic-bezier(.3,.1,.6,1) both}
.fx-slash:before{content:"";display:block;width:230px;height:14px;border-radius:99px;background:linear-gradient(90deg,transparent,#fff 40%,#ffe9a8,transparent);transform:rotate(-28deg);box-shadow:0 0 30px #b8e6ff;animation:v4Slash .34s ease-out forwards}
@keyframes v4Slash{0%{opacity:0;transform:rotate(-28deg) scaleX(.15)}30%{opacity:1;transform:rotate(-28deg) scaleX(1.15)}100%{opacity:0;transform:rotate(-28deg) scaleX(1.5) scaleY(.3)}}
@media(prefers-reduced-motion:reduce){.clash6-arena .battle-sprite,.battle-fx>div,.battle-projectile,.clash6-arena{animation-duration:.01ms!important}}
@media(max-width:980px){.prep-summary,.clash-v4-lower{grid-template-columns:1fr}.mode-config{grid-template-columns:1fr}.giant-start{width:100%}.clash6-arena{min-height:500px}.item-inventory{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.mode-switch,.enemy-picker,.dungeon-picker,.item-inventory,.loadout-slots{grid-template-columns:1fr}.battle-stage-head{align-items:flex-start;gap:12px}.clash6-arena{min-height:410px}.clash6-arena .arena-side{width:43%;bottom:42px}.prep-summary{grid-template-columns:1fr}}

/* ============================================================
   Garden Clash production UI v6
   ============================================================ */
.garden-clash-page .wrap{width:min(1240px,calc(100% - 40px))}
.clash6-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:end;padding:48px 0 30px}
.clash6-hero h1{margin:13px 0 14px;font-family:var(--pixel);font-size:clamp(2.25rem,5.6vw,4.75rem);line-height:1.02;letter-spacing:-.055em;color:var(--green-dark)}
.clash6-hero p{max-width:780px;margin:0;color:var(--muted);font-size:1.02rem}
.clash6-wallet{display:grid;grid-template-columns:repeat(3,minmax(105px,1fr));gap:9px}
.clash6-wallet>div{padding:13px 15px;border:2px solid var(--border);border-radius:13px;background:#fff;box-shadow:3px 3px 0 rgba(55,101,47,.09)}
.clash6-wallet span,.clash6-wallet strong{display:block}.clash6-wallet span{font-family:var(--pixel);font-size:.53rem;color:var(--muted)}.clash6-wallet strong{margin-top:4px;font-size:1.3rem;color:var(--green-dark)}
.clash6-shell{display:grid;gap:16px}.clash6-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.clash6-mode{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;text-align:left;padding:15px;border:2px solid var(--border);border-radius:14px;background:#fff;color:var(--ink);cursor:pointer}.clash6-mode>span{grid-row:1/3;font-size:1.8rem}.clash6-mode b,.clash6-mode small{display:block}.clash6-mode small{color:var(--muted)}.clash6-mode.selected{border-color:#7c5bc5;background:#f0e9fb;box-shadow:4px 4px 0 rgba(124,91,197,.17)}
.clash6-grid{display:grid;grid-template-columns:minmax(340px,.72fr) minmax(0,1.28fr);gap:16px;align-items:start}.clash6-card{border:2px solid var(--border);border-radius:18px;background:rgba(255,255,255,.94);box-shadow:5px 5px 0 rgba(55,101,47,.09);padding:20px}.clash6-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}.clash6-card-head h2{margin:5px 0 0;font-family:var(--pixel);font-size:1.35rem;color:var(--green-dark)}.clash6-kicker{font-family:var(--pixel);font-size:.54rem;letter-spacing:.1em;color:var(--soil)}

/* ==================== GARDEN CLASH · CHARACTER (SVG RIG) ==================== */
/* Emoji are decorative badges on a real proportioned skeleton, not the body itself. */
.clash6-character-preview{position:relative;isolation:isolate;width:min(268px,86%);aspect-ratio:4/5;margin:4px auto 16px;border:2px solid var(--border);border-radius:20px;background:radial-gradient(ellipse at 50% 30%,#fffdf0 0 30%,#e8f1dc 31% 62%,#cbdfc0 63%);overflow:hidden;box-shadow:inset 0 -20px 26px rgba(57,91,50,.13)}
.clash6-character-preview:after{content:"";position:absolute;left:12%;right:12%;bottom:7%;height:14px;border-radius:50%;background:radial-gradient(ellipse,rgba(35,54,31,.28),transparent 70%)}

/* The rig itself. aspect-ratio locks proportions at every size. */
.gc-rig{position:relative;width:100%;height:100%;display:grid;place-items:center}
.gc-rig svg{width:100%;height:100%;overflow:visible;display:block}
.gc-rig .gc-svg-root{transform-origin:50% 88%}

/* Emoji badges positioned by the SVG's own coordinate system via foreignObject */
.gc-badge{display:grid;place-items:center;line-height:1;user-select:none;filter:drop-shadow(0 2px 3px rgba(35,54,31,.3))}

/* Twitch avatar head */
.gc-head-img{width:100%;height:100%;object-fit:cover}
.gc-head-fallback{display:grid;place-items:center;width:100%;height:100%;font-size:34px;line-height:1}

.clash6-aura{position:absolute;left:50%;top:44%;width:74%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:0;border-radius:50%;background:radial-gradient(circle,rgba(239,208,83,.3),transparent 66%);animation:clash6Aura 2.6s ease-in-out infinite alternate;pointer-events:none}
@keyframes clash6Aura{to{transform:translate(-50%,-50%) scale(1.09);opacity:.55}}

/* Live stat readout under the builder preview */
.gc-statbars{display:grid;gap:6px;margin:0 auto 16px;width:min(268px,86%)}
.gc-statbar{display:grid;grid-template-columns:64px 1fr 42px;gap:8px;align-items:center;font-size:.72rem}
.gc-statbar>b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gc-statbar>i{min-width:40px}
.gc-statbar>b{font-family:var(--pixel);font-size:.5rem;letter-spacing:.06em;color:var(--muted);font-weight:400}
.gc-statbar>i{display:block;height:9px;border-radius:999px;background:rgba(55,101,47,.14);overflow:hidden;position:relative}
.gc-statbar>i:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--v,50%);border-radius:999px;background:linear-gradient(90deg,#5acb68,#b7db4c);transition:width .35s cubic-bezier(.2,.9,.3,1)}
.gc-statbar.neg>i:after{background:linear-gradient(90deg,#e0913f,#e6b95c)}
.gc-statbar.pos>i:after{background:linear-gradient(90deg,#4d8a3e,#7bc25a)}
.gc-statbar>em{font-style:normal;font-weight:800;text-align:right;color:var(--green-dark);font-size:.72rem}

/* ==================== BUILDER (tighter, clearer) ==================== */
.clash6-builder-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:14px;padding:4px;border:1px solid var(--border);border-radius:11px;background:var(--paper)}
.clash6-builder-tabs button{padding:9px 6px;border:0;border-radius:8px;background:transparent;font-weight:800;font-size:.82rem;color:var(--muted);cursor:pointer;transition:background .15s,color .15s}
.clash6-builder-tabs button:hover{color:var(--green-dark)}
.clash6-builder-tabs button.active{background:var(--green);color:#fff;box-shadow:0 2px 0 rgba(39,74,34,.35)}
.clash6-builder-panel{display:grid;gap:15px}
.clash6-selector>span{display:block;margin-bottom:7px;font-family:var(--pixel);font-size:.52rem;letter-spacing:.08em;color:var(--muted)}
.clash6-option-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}

/* Part option: icon + name + the actual stat effect, so the tradeoff is visible */
.clash6-part-option{position:relative;min-width:0;padding:9px 6px 8px;border:1px solid var(--border);border-radius:11px;background:#fff;cursor:pointer;text-align:center;transition:transform .12s,border-color .12s,box-shadow .12s}
.clash6-part-option:hover{transform:translateY(-2px);border-color:#a98fd6;box-shadow:0 3px 0 rgba(124,91,197,.18)}
.clash6-part-option span,.clash6-part-option b,.clash6-part-option i{display:block}
.clash6-part-option span{font-size:1.55rem;line-height:1.1}
.clash6-part-option b{margin-top:3px;font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clash6-part-option i{margin-top:3px;font-style:normal;font-size:.58rem;line-height:1.25;color:var(--muted)}
.clash6-part-option.selected{border:2px solid #7c5bc5;background:#f4efff;box-shadow:0 3px 0 rgba(124,91,197,.22)}
.clash6-part-option.is-core:before{content:"KERN";position:absolute;top:-7px;left:50%;transform:translateX(-50%);padding:1px 6px;border-radius:999px;background:#d5b84c;color:#3c2f06;font-family:var(--pixel);font-size:.44rem;letter-spacing:.08em;white-space:nowrap}

.clash6-core-box{display:grid;gap:11px;padding:13px;border:2px solid #d5b84c;border-radius:13px;background:linear-gradient(#fffceb,#fff5cf)}
.clash6-core-box strong,.clash6-core-box small{display:block}
.clash6-core-box strong{font-size:1rem;color:var(--green-dark)}
.clash6-core-box small{margin-top:3px;color:var(--soil)}
.clash6-core-hint{font-size:.7rem;color:var(--soil);opacity:.85}
.clash6-core-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.clash6-core-choices button{display:grid;gap:2px;place-items:center;padding:8px 4px;border:1px solid rgba(120,95,25,.3);border-radius:10px;background:#fff;cursor:pointer;transition:transform .12s}
.clash6-core-choices button:hover{transform:translateY(-2px)}
.clash6-core-choices span{font-size:1.35rem;line-height:1}
.clash6-core-choices small{font-size:.6rem;color:var(--muted)}
.clash6-core-choices button.selected{border:2px solid #c9a52f;background:#fff3c4;box-shadow:0 3px 0 rgba(180,148,42,.3)}

/* Items */
.clash6-loadout{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.clash6-loadout-slot{padding:10px 8px;text-align:center;border:1px solid var(--border);border-radius:11px;background:var(--paper)}
.clash6-loadout-slot small,.clash6-loadout-slot strong{display:block}
.clash6-loadout-slot small{font-family:var(--pixel);font-size:.46rem;letter-spacing:.06em;color:var(--muted)}
.clash6-loadout-slot span{display:block;font-size:1.7rem;line-height:1.2;margin:2px 0}
.clash6-loadout-slot strong{font-size:.7rem;line-height:1.2}
.clash6-inventory{display:grid;gap:7px}
.clash6-inv-group{display:grid;gap:6px}
.clash6-inv-group>span{font-family:var(--pixel);font-size:.48rem;letter-spacing:.08em;color:var(--muted)}
.clash6-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 11px;border:1px solid var(--border);border-radius:11px;background:#fff;text-align:left;cursor:pointer;transition:transform .12s,border-color .12s}
.clash6-item:hover{transform:translateX(2px);border-color:var(--green)}
.clash6-item>span{font-size:1.6rem;line-height:1}
.clash6-item b,.clash6-item small{display:block}
.clash6-item small{margin-top:2px;color:var(--muted);font-size:.68rem;line-height:1.3}
.clash6-item:after{content:"";width:16px;height:16px;border:2px solid var(--border);border-radius:50%}
.clash6-item.selected{border:2px solid var(--green);background:#f0f7ea}
.clash6-item.selected:after{content:"✓";display:grid;place-items:center;border-color:var(--green);background:var(--green);color:#fff;font-size:.7rem;font-weight:900}

.clash6-stance-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.clash6-stance{padding:12px;border:1px solid var(--border);border-radius:11px;background:#fff;text-align:left;cursor:pointer;transition:transform .12s}
.clash6-stance:hover{transform:translateY(-2px)}
.clash6-stance b,.clash6-stance small{display:block}
.clash6-stance small{margin-top:4px;color:var(--muted);font-size:.7rem;line-height:1.3}
.clash6-stance.selected{border:2px solid #7c5bc5;background:#f4efff;box-shadow:0 3px 0 rgba(124,91,197,.2)}

/* ==================== ARENA ==================== */
.clash6-arena-actions{display:flex;gap:8px}

/* Opponent / dungeon pickers — only the active mode's strip is ever shown */
.clash6-opponent-strip,.clash6-dungeons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.clash6-arena-card [hidden]{display:none!important}
.clash6-opponent,.clash6-dungeon{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;padding:10px;border:1px solid var(--border);border-radius:12px;background:#fff;text-align:left;cursor:pointer;transition:transform .12s,border-color .12s}
.clash6-opponent:hover,.clash6-dungeon:hover{transform:translateY(-2px);border-color:#a98fd6}
.clash6-opponent>span,.clash6-dungeon>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--paper);font-size:1.25rem;overflow:hidden}
.clash6-opponent>span img{width:100%;height:100%;object-fit:cover}
.clash6-opponent b,.clash6-opponent small,.clash6-dungeon b,.clash6-dungeon small{display:block}
.clash6-opponent small,.clash6-dungeon small{color:var(--muted);font-size:.68rem}
.clash6-opponent.selected,.clash6-dungeon.selected{border:2px solid #7c5bc5;background:#f4efff;box-shadow:0 3px 0 rgba(124,91,197,.2)}
.clash6-friendly{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;margin-bottom:12px;padding:13px;border:1px solid var(--border);border-radius:13px;background:var(--paper)}
.clash6-friendly label{display:grid;gap:5px;font-weight:800;font-size:.82rem}
.clash6-friendly input{padding:10px;border:1px solid var(--border);border-radius:9px;background:#fff}
.clash6-friendly small{grid-column:1/-1;color:var(--muted);font-size:.7rem}

.clash6-arena{position:relative;min-height:460px;overflow:hidden;border:2px solid #35513a;border-radius:18px;background:linear-gradient(#91c4d7 0 55%,#4b7049 56%);display:grid;grid-template-columns:1fr minmax(76px,.34fr) 1fr;align-items:end}
.clash6-arena-sky{position:absolute;inset:0 0 42% 0;background:radial-gradient(circle at 50% 20%,#fff6b8 0 4.5%,rgba(255,246,184,.35) 5% 9%,transparent 10%),linear-gradient(#79b0ca,#dbe9cf)}
.clash6-arena-ground{position:absolute;inset:58% 0 0;background:linear-gradient(#537c4f,#24462a);border-top:4px solid rgba(255,255,255,.28)}
.clash6-arena-ground:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 2px,transparent 2px 46px)}

/* Fighter column: name/HP pinned top, rig anchored to the ground line */
.clash6-fighter{position:relative;z-index:4;display:grid;grid-template-rows:auto 1fr;justify-items:center;min-width:0;padding:14px 16px 20px}
.clash6-hud{grid-row:1;width:100%}
.clash6-fighter-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;color:#fff;text-shadow:0 2px 3px #17321c}
.clash6-fighter-head strong{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clash6-enemy-side .clash6-fighter-head{flex-direction:row-reverse}
.clash6-fighter-head span{font-size:.72rem;opacity:.85;white-space:nowrap}
.clash6-fighter .arena-hp{margin:7px 0 5px;width:100%;height:15px;border:2px solid rgba(255,255,255,.9);border-radius:999px;background:#20301f;overflow:hidden;box-shadow:0 2px 5px rgba(0,0,0,.25)}
.clash6-fighter .arena-hp span{display:block;height:100%;width:100%;background:linear-gradient(90deg,#5acb68,#b7db4c);transition:width .3s cubic-bezier(.2,.9,.3,1)}
.clash6-fighter .arena-hp.low span{background:linear-gradient(90deg,#d94f3d,#e8934a)}
.clash6-fighter .arena-status{display:flex;min-height:18px;gap:6px;color:#fff;font-size:.7rem;font-weight:700;text-shadow:0 1px 2px #17321c}
.clash6-enemy-side .arena-status{justify-content:flex-end}

/* the fighting rig */
.clash6-composite{grid-row:2;align-self:end;position:relative;width:min(230px,94%);aspect-ratio:4/5;transform-origin:50% 88%}

.clash6-center{position:relative;z-index:5;align-self:center;display:grid;gap:2px;justify-items:center;text-align:center;color:#fff;text-shadow:0 2px 4px #17321c}
.clash6-center .battle-countdown{font-family:var(--pixel);font-size:.82rem;letter-spacing:.08em}
.clash6-center .battle-timer{font-size:1.9rem;font-weight:900;line-height:1}
.clash6-center>span{font-size:.7rem;opacity:.9}

/* ==================== LOWER ==================== */
.clash6-lower{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}
.clash6-history{display:grid;gap:0}
.clash6-history-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:10px 2px;border-bottom:1px solid var(--border)}
.clash6-history-row:last-child{border-bottom:0}
.clash6-history-row>span{padding:2px 8px;border-radius:999px;background:var(--paper);font-family:var(--pixel);font-size:.46rem;letter-spacing:.06em;color:var(--muted)}
.clash6-history-row small{color:var(--muted);font-size:.72rem}
.clash6-history-row em{font-style:normal;font-weight:900;font-size:.8rem}
.positive{color:#2f7436}.negative{color:#ac3d31}
.combat-log p{margin:0;padding:6px 0;border-bottom:1px solid rgba(55,101,47,.12);font-size:.78rem;line-height:1.35}
.combat-log p:first-child{color:var(--green-dark);font-weight:800}

@media(max-width:1000px){
 .clash6-grid{grid-template-columns:1fr}.clash6-builder{order:2}.clash6-arena-card{order:1}
 .clash6-arena{min-height:420px}
}
@media(max-width:760px){
 .clash6-hero{grid-template-columns:1fr}.clash6-wallet{grid-template-columns:repeat(3,1fr)}
 .clash6-modes{grid-template-columns:1fr}.clash6-lower{grid-template-columns:1fr}
 .clash6-opponent-strip,.clash6-dungeons{grid-template-columns:1fr}
 .clash6-arena{min-height:360px;grid-template-columns:1fr 68px 1fr}
 .clash6-composite{width:min(170px,96%)}
 .clash6-core-choices{grid-template-columns:repeat(3,1fr)}
 .clash6-friendly{grid-template-columns:1fr}
}
@media(max-width:520px){
 .garden-clash-page .wrap{width:min(100% - 24px,1240px)}
 .clash6-card{padding:14px}.clash6-card-head{flex-direction:column}
 .clash6-arena-actions{width:100%}.clash6-arena-actions .btn{flex:1}
 .clash6-wallet{grid-template-columns:1fr}
 .clash6-arena{min-height:320px;grid-template-columns:1fr 52px 1fr}
 .clash6-fighter{padding:8px 8px 14px}
 
 .clash6-fighter-head strong{font-size:.78rem}
 .clash6-fighter .arena-hp{height:12px}
 .clash6-fighter .arena-status{font-size:.62rem}
 .clash6-composite{width:min(128px,98%)}
 .clash6-center .battle-timer{font-size:1.3rem}
 .clash6-option-row{grid-template-columns:1fr}
 .clash6-part-option{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;text-align:left;padding:9px}
 .clash6-part-option b,.clash6-part-option i{margin:0}
 .clash6-part-option.is-core:before{left:auto;right:8px;transform:none}
 .clash6-loadout{grid-template-columns:1fr}
 .clash6-stance-grid{grid-template-columns:1fr}
 .clash6-history-row{grid-template-columns:1fr auto}
 .clash6-history-row small{grid-column:1/-1}
}



/* Garden Clash V8: icon-free modular anatomy, joint motion and live arena. */
.gc-badge{display:none!important}
.gc-rig .gc-body,.gc-rig .gc-head,.gc-rig .gc-arm,.gc-rig .gc-leg{transform-box:fill-box;will-change:transform}
.gc-rig .gc-head{transform-origin:center bottom}
.gc-rig .gc-body{transform-origin:center 80%}
.gc-rig .gc-arm-left,.gc-rig .gc-arm-right{transform-origin:center 12%}
.gc-rig .gc-leg-left,.gc-rig .gc-leg-right{transform-origin:center 10%}
.clash6-composite:not([class*="anim-"]) .gc-arm-left{animation:gcIdleArmL 1.8s ease-in-out infinite alternate}
.clash6-composite:not([class*="anim-"]) .gc-arm-right{animation:gcIdleArmR 1.8s ease-in-out infinite alternate}
.clash6-composite:not([class*="anim-"]) .gc-body{animation:gcIdleBody 1.4s ease-in-out infinite alternate}
@keyframes gcIdleArmL{to{transform:rotate(4deg)}}@keyframes gcIdleArmR{to{transform:rotate(-4deg)}}@keyframes gcIdleBody{to{transform:translateY(-2px) scaleY(1.01)}}

/* Whole-rig travel plus independently moving joints. */
.anim-lunge .gc-svg-root{animation:gcTravelStrike .52s cubic-bezier(.2,.9,.2,1)}
.anim-lunge .gc-arm-right{animation:gcPunchArm .52s ease}
.anim-dash .gc-svg-root{animation:gcDash .48s cubic-bezier(.1,.9,.2,1)}
.anim-dash .gc-leg-left{animation:gcRunLegL .48s ease}.anim-dash .gc-leg-right{animation:gcRunLegR .48s ease}
.anim-slam .gc-svg-root{animation:gcSlam .65s cubic-bezier(.2,.8,.25,1)}
.anim-slam .gc-arm-left,.anim-slam .gc-arm-right{animation:gcRaiseArms .65s ease}
.anim-uppercut .gc-svg-root{animation:gcUppercut .58s ease}.anim-uppercut .gc-arm-right{animation:gcUpperArm .58s ease}
.anim-flurry .gc-svg-root{animation:gcFlurryBody .68s ease}.anim-flurry .gc-arm-left{animation:gcFlurryL .68s linear}.anim-flurry .gc-arm-right{animation:gcFlurryR .68s linear}
.anim-spin .gc-svg-root{animation:gcSpin .72s cubic-bezier(.35,.05,.25,1)}
.anim-jump .gc-svg-root{animation:gcJump .72s cubic-bezier(.2,.8,.2,1)}.anim-jump .gc-leg-left,.anim-jump .gc-leg-right{animation:gcTuck .72s ease}
.anim-cast .gc-body{animation:gcCastBody .72s ease}.anim-cast .gc-arm-left,.anim-cast .gc-arm-right{animation:gcCastArms .72s ease}
.anim-hit .gc-svg-root{animation:gcHit .38s ease}.anim-hit .gc-head{animation:gcHeadWhip .38s ease}
.anim-heavy-hit .gc-svg-root{animation:gcHeavyHit .58s ease}.anim-heavy-hit .gc-arm-left,.anim-heavy-hit .gc-arm-right{animation:gcLooseArms .58s ease}
.anim-block .gc-arm-left,.anim-block .gc-arm-right{animation:gcBlockArms .48s ease}.anim-block .gc-body{animation:gcBrace .48s ease}
.anim-knockdown .gc-svg-root{animation:gcKnockdown .72s cubic-bezier(.3,.05,.7,1) forwards}.anim-knockdown .gc-arm-left,.anim-knockdown .gc-arm-right{animation:gcRagdollArms .72s ease}.anim-knockdown .gc-leg-left,.anim-knockdown .gc-leg-right{animation:gcRagdollLegs .72s ease}
.anim-recover .gc-svg-root{animation:gcRecover .58s ease forwards}
.anim-ko .gc-svg-root{animation:gcKoRagdoll .92s cubic-bezier(.4,.05,.7,1) forwards}.anim-ko .gc-arm-left,.anim-ko .gc-arm-right{animation:gcRagdollArms .92s ease forwards}.anim-ko .gc-leg-left,.anim-ko .gc-leg-right{animation:gcRagdollLegs .92s ease forwards}

.clash6-enemy-side .anim-lunge .gc-svg-root{animation-name:gcTravelStrikeEnemy}.clash6-enemy-side .anim-dash .gc-svg-root{animation-name:gcDashEnemy}.clash6-enemy-side .anim-uppercut .gc-svg-root{animation-name:gcUppercutEnemy}
@keyframes gcTravelStrike{0%,100%{transform:translateX(0)}48%{transform:translateX(96px) rotate(5deg) scale(1.04)}}
@keyframes gcTravelStrikeEnemy{0%,100%{transform:translateX(0)}48%{transform:translateX(-96px) rotate(-5deg) scale(1.04)}}
@keyframes gcPunchArm{15%{transform:rotate(-35deg)}52%{transform:rotate(68deg) scaleY(1.18)}100%{transform:rotate(0)}}
@keyframes gcDash{0%,100%{transform:translateX(0)}35%{transform:translateX(120px) skewX(-8deg)}65%{transform:translateX(84px)}}
@keyframes gcDashEnemy{0%,100%{transform:translateX(0)}35%{transform:translateX(-120px) skewX(8deg)}65%{transform:translateX(-84px)}}
@keyframes gcRunLegL{0%,100%{transform:rotate(0)}35%{transform:rotate(28deg)}65%{transform:rotate(-20deg)}}@keyframes gcRunLegR{0%,100%{transform:rotate(0)}35%{transform:rotate(-28deg)}65%{transform:rotate(20deg)}}
@keyframes gcSlam{0%,100%{transform:translateY(0)}35%{transform:translateY(-42px) scale(.96,1.05)}68%{transform:translateY(5px) scale(1.08,.9)}}
@keyframes gcRaiseArms{30%{transform:rotate(145deg)}68%{transform:rotate(-28deg)}}
@keyframes gcUppercut{0%,100%{transform:translate(0,0)}45%{transform:translate(88px,-25px) rotate(-8deg)}}@keyframes gcUppercutEnemy{0%,100%{transform:translate(0,0)}45%{transform:translate(-88px,-25px) rotate(8deg)}}@keyframes gcUpperArm{45%{transform:rotate(-145deg) scaleY(1.16)}}
@keyframes gcFlurryBody{25%{transform:translateX(72px) rotate(-4deg)}50%{transform:translateX(88px) rotate(5deg)}75%{transform:translateX(70px) rotate(-3deg)}}@keyframes gcFlurryL{25%,75%{transform:rotate(75deg)}50%{transform:rotate(-35deg)}}@keyframes gcFlurryR{25%,75%{transform:rotate(-35deg)}50%{transform:rotate(75deg)}}
@keyframes gcSpin{45%{transform:translateX(70px) rotate(360deg) scale(1.08)}}
@keyframes gcJump{0%,100%{transform:translateY(0)}42%{transform:translateY(-92px) rotate(8deg)}70%{transform:translateX(70px) translateY(-30px)}}@keyframes gcTuck{42%{transform:rotate(35deg)}}
@keyframes gcCastBody{45%{transform:scale(1.08) translateY(-8px);filter:drop-shadow(0 0 15px #d7a6ff)}}@keyframes gcCastArms{45%{transform:rotate(120deg)}}
@keyframes gcHit{35%{transform:translateX(-20px) rotate(-10deg) scale(.96,1.04);filter:brightness(1.8)}}@keyframes gcHeadWhip{35%{transform:rotate(-24deg) translateX(-4px)}}
@keyframes gcHeavyHit{35%{transform:translateX(-44px) rotate(-23deg) scale(.9,1.06);filter:brightness(2)}}@keyframes gcLooseArms{35%{transform:rotate(50deg)}}
@keyframes gcBlockArms{40%{transform:rotate(105deg)}}@keyframes gcBrace{40%{transform:scale(.96,1.04) translateY(3px)}}
@keyframes gcKnockdown{0%{transform:translate(0,0) rotate(0)}55%{transform:translate(-48px,44px) rotate(-78deg)}100%{transform:translate(-56px,66px) rotate(-92deg) scale(.92)}}
@keyframes gcRecover{0%{transform:translate(-56px,66px) rotate(-92deg) scale(.92)}65%{transform:translate(-8px,-8px) rotate(10deg)}100%{transform:none}}
@keyframes gcKoRagdoll{0%{transform:none}55%{transform:translate(-58px,50px) rotate(-88deg)}100%{transform:translate(-72px,76px) rotate(-103deg) scale(.82);opacity:.55}}
@keyframes gcRagdollArms{45%,100%{transform:rotate(120deg)}}@keyframes gcRagdollLegs{45%,100%{transform:rotate(-24deg)}}

.clash6-live-box{margin-bottom:12px;padding:12px;border:2px solid rgba(46,133,72,.35);border-radius:14px;background:linear-gradient(135deg,#f1f8ec,#eef5ff)}
.clash6-live-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.clash6-live-head>div{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:8px}.clash6-live-head small{grid-column:2;color:var(--muted)}
.live-pulse{width:10px;height:10px;border-radius:50%;background:#36b85c;box-shadow:0 0 0 0 rgba(54,184,92,.45);animation:gcLivePulse 1.5s infinite}@keyframes gcLivePulse{70%{box-shadow:0 0 0 9px rgba(54,184,92,0)}}
.clash6-live-empty{grid-column:1/-1;margin:0;padding:15px;border:1px dashed var(--border);border-radius:10px;color:var(--muted);text-align:center}
@media(max-width:760px){.clash6-live-head{align-items:flex-start;flex-direction:column}.clash6-live-head .btn{width:100%}}


/* Garden Clash V9: five-minute lobby arena */
.clash6-lobby-box{margin-bottom:18px;padding:16px;border:2px solid var(--border);border-radius:16px;background:rgba(255,255,255,.78)}
.clash6-lobby-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.clash6-lobby-head>div:first-child{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:9px}.clash6-lobby-head small{grid-column:2;color:var(--muted)}
.clash6-lobby-actions{display:flex;gap:8px;flex-wrap:wrap}.clash6-own-lobby{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:14px;padding:14px;border:2px solid #d1ad45;border-radius:13px;background:#fff6cf}.clash6-own-lobby>div{display:grid}.clash6-own-lobby span,.clash6-own-lobby small{font-size:.72rem;color:var(--muted)}.clash6-own-lobby strong{font-family:var(--pixel);font-size:1.15rem;letter-spacing:.08em}
.clash6-lobby-list{display:grid;gap:9px;margin-top:14px}.clash6-lobby-row{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:12px;padding:11px;border:1px solid var(--border);border-radius:12px;background:#fff}.clash6-lobby-row b,.clash6-lobby-row small{display:block}.clash6-lobby-row small{color:var(--muted)}.clash6-lobby-avatar{width:48px;height:48px;display:grid;place-items:center;border:2px solid var(--border);border-radius:50%;overflow:hidden;background:var(--yellow);font-size:25px}.clash6-lobby-avatar img{width:100%;height:100%;object-fit:cover}
@media(max-width:720px){.clash6-lobby-head,.clash6-own-lobby{align-items:stretch;flex-direction:column}.clash6-lobby-actions{display:grid}.clash6-lobby-row{grid-template-columns:42px 1fr}.clash6-lobby-row .btn{grid-column:1/-1;width:100%}.clash6-lobby-avatar{width:42px;height:42px}}

/* V9 repair marker */
.garden-clash-page{--garden-clash-build:"v9-repair2";}

/* Garden Clash rank chip in the leaderboard.
   Had no CSS at all, so it inherited the bold table type and shouted.
   Deliberately quieter than .status-pill: normal weight, small caps-ish
   tracking, tier colour only on the dot and a hairline tint. */
.gc-rank-cell{white-space:nowrap}
.gc-rank-pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 9px;
  border:1px solid color-mix(in srgb,var(--rank-color,#7c8b74) 38%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--rank-color,#7c8b74) 9%,rgba(255,255,255,.72));
  color:#2b3a2a;
  font-size:.72rem;font-weight:600;letter-spacing:.01em;line-height:1.35;
}
.gc-rank-dot{
  width:7px;height:7px;flex:0 0 auto;border-radius:50%;
  background:var(--rank-color,#7c8b74);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--rank-color,#7c8b74) 22%,transparent);
}
/* Fallback for browsers without color-mix() */
@supports not (background:color-mix(in srgb,red 10%,white)){
  .gc-rank-pill{background:rgba(255,255,255,.8);border-color:#b9c7b1}
}
body[data-theme="night"] .gc-rank-pill{
  background:color-mix(in srgb,var(--rank-color,#7c8b74) 16%,rgba(24,34,24,.6));
  color:#e7f0e3;border-color:color-mix(in srgb,var(--rank-color,#7c8b74) 46%,transparent);
}
@media(max-width:760px){
  .gc-rank-pill{padding:3px 7px;font-size:.66rem;gap:5px}
  .gc-rank-dot{width:6px;height:6px}
}

/* ---- Garden Clash: knockdown / recover + livelier hit feedback ----
   anim-knockdown and anim-recover were referenced by strike() but had
   no keyframes, so heavy hits silently did nothing. */
@keyframes v4Knockdown{
  0%{transform:translate(0,0) rotate(0);filter:brightness(1)}
  12%{transform:translate(-46px,-18px) rotate(-16deg);filter:brightness(3) saturate(.2)}
  34%{transform:translate(-58px,10px) rotate(-52deg)}
  55%{transform:translate(-62px,26px) rotate(-78deg) scale(.97)}
  75%{transform:translate(-60px,22px) rotate(-72deg)}
  100%{transform:translate(-58px,26px) rotate(-76deg)}
}
.anim-knockdown{animation:v4Knockdown .58s cubic-bezier(.25,1.1,.35,1) forwards}

@keyframes v4Recover{
  0%{transform:translate(-58px,26px) rotate(-76deg)}
  45%{transform:translate(-26px,8px) rotate(-28deg)}
  75%{transform:translate(-6px,-6px) rotate(8deg) scale(1.04)}
  100%{transform:translate(0,0) rotate(0) scale(1)}
}
.anim-recover{animation:v4Recover .52s cubic-bezier(.3,1.4,.4,1) forwards}

/* Skill wind-up glow so casts read as charged rather than instant */
@keyframes v4Charge{
  0%{filter:brightness(1) drop-shadow(0 0 0 rgba(185,148,255,0))}
  60%{filter:brightness(1.35) drop-shadow(0 0 22px rgba(185,148,255,.85))}
  100%{filter:brightness(1) drop-shadow(0 0 0 rgba(185,148,255,0))}
}
.anim-cast{animation:v4Cast .7s ease-out,v4Charge .7s ease-out}

/* Landing dust when a heavy blow connects */
@keyframes v4Dust{
  0%{opacity:0;transform:translateY(6px) scaleX(.4)}
  30%{opacity:.75;transform:translateY(0) scaleX(1)}
  100%{opacity:0;transform:translateY(-6px) scaleX(1.7)}
}
.battle-fx .fx-dust{
  position:absolute;bottom:14%;width:120px;height:14px;border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.75),transparent 70%);
  animation:v4Dust .5s ease-out forwards!important;
}

/* The arena tints briefly on the decisive blow */
@keyframes v4Flare{0%,100%{box-shadow:inset 0 0 0 rgba(0,0,0,0)}40%{box-shadow:inset 0 0 90px var(--flare,rgba(255,255,255,.45))}}
.clash6-arena.flare-win{--flare:rgba(150,255,170,.5);animation:v4Flare .5s ease-out}
.clash6-arena.flare-loss{--flare:rgba(255,140,120,.5);animation:v4Flare .5s ease-out}

/* Icon glyphs must always resolve through a colour-emoji font. Without this
   the page font (Consolas/monospace especially) has no emoji coverage and
   Windows falls back to a mono symbol face or a blank box. */
.gc-emoji,.clash6-part-option>span,.clash6-item>span,.clash6-loadout-slot span,.gc-badge{
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji","Segoe UI Symbol",sans-serif;
  font-variant-emoji:emoji;
}

/* ---- Profile hero: readable text on dark banners ----
   The previous version enumerated banner names and used the wrong ancestor
   class, so it never applied. profile.js now tags the hero with
   data-tone="dark", covering every dark banner including future ones. */
.profile-v2-hero{position:relative;isolation:isolate}
.profile-v2-hero>*{position:relative;z-index:2}
.profile-v2-hero[data-tone="dark"]:before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;
  background:linear-gradient(100deg,rgba(12,20,14,.58) 0 46%,rgba(12,20,14,.20) 76%,transparent);
}
.profile-v2-hero[data-tone="dark"],
.profile-v2-hero[data-tone="dark"] h1,
.profile-v2-hero[data-tone="dark"] .eyebrow,
.profile-v2-hero[data-tone="dark"] p,
.profile-v2-hero[data-tone="dark"] small{color:#fff}
.profile-v2-hero[data-tone="dark"] h1{text-shadow:0 2px 12px rgba(0,0,0,.6),0 1px 2px rgba(0,0,0,.75)}
.profile-v2-hero[data-tone="dark"] .eyebrow,
.profile-v2-hero[data-tone="dark"] p,
.profile-v2-hero[data-tone="dark"] small{
  color:rgba(255,255,255,.93);text-shadow:0 1px 6px rgba(0,0,0,.55);
}
/* the rating badge is its own light card: keep it above the scrim and opaque */
.profile-v2-hero .profile-v2-rank{z-index:3;position:relative}
.profile-v2-hero[data-tone="dark"] .profile-v2-rank,
.profile-v2-hero[data-tone="dark"] .profile-v2-rank *{color:var(--ink);text-shadow:none}

/* ---- CS2-crate-style rarity tinting for reward squares ----
   Rarity was only shown as small coloured text; the icon square itself
   stayed neutral white regardless of tier, so nothing signalled how
   valuable a pull was at a glance. Each tier now gets a distinct tinted
   background + border, escalating in saturation, with a soft glow on
   legendary -- matching the crate-opening visual language players
   already recognise from CS2. */
.contents-icon.rarity-common,.reel-icon.rarity-common{background:linear-gradient(160deg,#f4f4f2,#e3e3e0)!important;border-color:#b9b9b3!important}
.contents-icon.rarity-uncommon,.reel-icon.rarity-uncommon{background:linear-gradient(160deg,#eaf7ee,#c9ecd3)!important;border-color:#4f9a68!important}
.contents-icon.rarity-rare,.reel-icon.rarity-rare{background:linear-gradient(160deg,#e9f2fb,#bfdcf3)!important;border-color:#3d7fb8!important}
.contents-icon.rarity-epic,.reel-icon.rarity-epic{background:linear-gradient(160deg,#f2e9fb,#d9bdf0)!important;border-color:#8d4eb0!important}
.contents-icon.rarity-legendary,.reel-icon.rarity-legendary{
  background:linear-gradient(160deg,#fff6da,#f7d772)!important;border-color:#c58a00!important;
  box-shadow:0 0 14px rgba(197,138,0,.45);
}
.reel-item.rarity-legendary{background:linear-gradient(180deg,#fffef4,#fbedbd)!important}
.reel-item.rarity-epic{background:linear-gradient(180deg,#fdfaff,#f4e9fb)!important}
.reel-item.rarity-rare{background:linear-gradient(180deg,#f9fcff,#eaf3fb)!important}

.win-reveal .big-icon{transition:filter .2s}
.win-reveal.rarity-uncommon .big-icon{filter:drop-shadow(0 0 10px rgba(79,154,104,.55))}
.win-reveal.rarity-rare .big-icon{filter:drop-shadow(0 0 12px rgba(61,127,184,.55))}
.win-reveal.rarity-epic .big-icon{filter:drop-shadow(0 0 14px rgba(141,78,176,.6))}
.win-reveal.rarity-legendary .big-icon{filter:drop-shadow(0 0 18px rgba(197,138,0,.7))}

/* ---- Simplified rare-drop card: item + finder only ---- */
.rare-card-icon{
  width:72px;height:72px;display:grid;place-items:center;font-size:34px;
  border-right:2px solid var(--border);background:rgba(255,255,255,.5);
}
.rare-card.rarity-rare .rare-card-icon{background:linear-gradient(160deg,#e9f2fb,#bfdcf3)}
.rare-card.rarity-epic .rare-card-icon{background:linear-gradient(160deg,#f2e9fb,#d9bdf0)}
.rare-card.rarity-legendary .rare-card-icon{background:linear-gradient(160deg,#fff6da,#f7d772);box-shadow:0 0 14px rgba(197,138,0,.4) inset}
.rare-card>div{padding-right:12px;min-width:0}
.rare-card strong{font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rare-card small{display:block;margin-top:2px}

/* ---- Onboarding intro (first login only) ---- */
.onboard-box{max-width:420px}
.onboard-list{list-style:none;margin:14px 0;padding:0;display:grid;gap:10px}
.onboard-list li{padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:rgba(255,255,255,.55);font-size:.92rem;line-height:1.4}
#onboardStart{width:100%;margin-top:6px}

/* ---- Skill charge bar ----
   Skill charge was a real combat mechanic (fills every hit, empowers the
   next attack at 100%) but had no visible indicator, so testers had no way
   to tell what "Skill" actually did or when it would trigger. Mirrors the
   HP bar's sizing, thinner and in a distinct blue/violet so it never reads
   as a second health bar. */
.arena-skill{
  height:7px;margin:0 0 6px;width:100%;
  border:2px solid rgba(255,255,255,.7);border-radius:999px;
  background:#20202f;overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,.2);
}
.arena-skill span{
  display:block;height:100%;width:0%;
  background:linear-gradient(90deg,#5b6fe0,#b98af0);
  transition:width .25s cubic-bezier(.2,.9,.3,1);
}
.arena-skill.ready span{
  background:linear-gradient(90deg,#7c5cff,#e2a9ff);
  box-shadow:0 0 8px rgba(160,120,255,.75);
}

/* ---- Case open-count corner ticker ----
   Shows a live "opened worldwide" tally plus the current player's personal
   count for that case, in the top-right corner of the case art. */
.case{position:relative}
.case-open-ticker{
  position:absolute;top:10px;right:10px;z-index:3;
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 9px;border-radius:999px;
  background:rgba(20,26,18,.72);color:#fff;
  font-family:var(--pixel);font-size:.56rem;white-space:nowrap;
  backdrop-filter:blur(2px);
}
@media(max-width:480px){
  .case-open-ticker{font-size:.5rem;padding:4px 7px;top:7px;right:7px}
}

/* ---- Mystery items: hidden until owned ----
   0.0001%-drop items in each case must look like an unsolved mystery to
   everyone except the person who has actually pulled one: solid black tile,
   white question marks, no name/effect leaked anywhere they can appear
   (case contents list, the spinning reel). */
.contents-icon.rarity-mystery,.reel-icon.rarity-mystery{
  background:#0c0c10!important;border-color:#000!important;color:#fff;
  font-size:0;position:relative;
}
/* An absolutely-positioned, flex-centered overlay guarantees true centering
   regardless of the tile's own display mode -- the previous plain :before
   just flowed inline and drifted off-center for a 3-character string. */
.contents-icon.rarity-mystery:before,.reel-icon.rarity-mystery:before{
  content:"???";
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:1rem;font-family:var(--pixel);letter-spacing:.05em;color:#fff;line-height:1;
}
.mystery-hidden .contents-heading strong,.mystery-hidden .reward-type{color:#7a7a86!important}
.mystery-hidden{opacity:.92}

/* ---- Mystery items: the big reveal when YOU are the one who pulled it ---- */
.win-reveal.rarity-mystery{--flare:transparent}
.win-reveal.rarity-mystery .big-icon{
  filter:drop-shadow(0 0 24px rgba(255,255,255,.9)) drop-shadow(0 0 40px rgba(120,180,255,.6));
  animation:gcMysteryPulse 1.4s ease-in-out infinite;
}
@keyframes gcMysteryPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}

/* ---- Leaderboard sort toggle: one board, two rankings ---- */
.lb-sort-toggle{display:inline-flex;gap:4px;margin-top:14px;padding:4px;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.6)}
.lb-sort-btn{
  border:none;background:transparent;padding:8px 16px;border-radius:999px;
  font-family:var(--pixel);font-size:.72rem;color:var(--muted);cursor:pointer;transition:.15s;
}
.lb-sort-btn:hover{color:var(--green-dark)}
.lb-sort-btn.active{background:var(--green-dark);color:#fff}

/* ---- "Coming soon" case placeholders ---- */
.case-tba{opacity:.75}
.case-art-tba{display:grid;place-items:center;background:repeating-linear-gradient(135deg,#eee,#eee 12px,#e4e4e4 12px,#e4e4e4 24px)!important}
.case-tba-icon{font-size:3rem;filter:grayscale(1) opacity(.6)}
.case-tba h3{color:var(--muted)}

/* ---- Leaderboard badge showcase (replaces the Twitch-status column) ---- */
.lb-badge-row{display:flex;gap:6px;align-items:center}
.lb-badge-chip{
  width:30px;height:30px;display:grid;place-items:center;font-size:1rem;
  border:2px solid var(--border);border-radius:8px;background:#fff;
}
.lb-badge-empty{font-size:.72rem;color:var(--muted)}

/* ---- Active core vs merely-selected body parts ----
   .is-core was computed correctly in JS but had no matching CSS rule at
   all, so an active core looked pixel-identical to the other two selected
   (but stat-irrelevant) parts -- testers genuinely could not tell them
   apart. The core part now gets a distinct gold treatment and an explicit
   badge; a plain cosmetic selection stays the calmer purple. */
.clash6-part-option.selected{border:2px solid #b9aee0;background:#faf8ff;box-shadow:none}
.clash6-part-option.is-core{
  border:3px solid #c58a00!important;
  background:linear-gradient(160deg,#fffaf0,#fdedc4)!important;
  box-shadow:0 0 0 3px rgba(197,138,0,.18),0 3px 0 rgba(197,138,0,.3)!important;
  position:relative;
}
.clash6-core-badge{
  position:absolute;top:-10px;left:50%;transform:translateX(-50%);
  background:#c58a00;color:#fff;font-family:var(--pixel);font-size:.52rem;
  padding:3px 8px;border-radius:999px;white-space:nowrap;
  box-shadow:0 2px 4px rgba(0,0,0,.25);
}

/* ---- Daily login streak banner ---- */
.streak-banner{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px 20px;border:2px solid var(--border);border-radius:16px;
  background:linear-gradient(135deg,#fff6e0,#ffe9c2);margin:18px 0;
}
.streak-copy{display:flex;align-items:center;gap:12px}
.streak-flame{font-size:1.8rem}
.streak-copy strong{display:block;font-size:1rem}
.streak-copy small{color:var(--muted)}
.streak-copy-win strong{color:#3d7b3d}

/* ===== SANDBOX COMBAT CSS (1:1, Selektoren auf echtes DOM gemappt) ===== */
/* =====================================================================
   RAGDOLL RIG ANIMATIONS
   Instead of moving the whole figure as a block, we animate individual
   body parts: the striking arm rotates around its shoulder (and drags the
   held weapon with it), the torso leans into the blow, and the defender's
   whole body recoils — torso twists, arms flail, head snaps.

   Shoulder pivots (in the 200x250 viewBox):
     right shoulder ≈ (128,92)   left shoulder ≈ (72,92)
   Weapon is mounted on the main (right) hand and shares the right-shoulder
   pivot, so .gc-arm-right and .ia-main animate identically to stay glued.
   ===================================================================== */

/* per-part transform origins so limbs rotate about the shoulder/neck */
.gc-arm-right{transform-origin:128px 92px}
.gc-arm-left {transform-origin:72px 92px}
.ia-main{transform-origin:128px 92px}
.ia-off{transform-origin:72px 92px}
.gc-body{transform-origin:100px 120px}
.gc-head{transform-origin:100px 66px}
.gc-legs{transform-origin:100px 150px}
.gc-svg-root{transform-origin:50% 96%}
/* smooth default so idle→pose transitions aren't instant */
.gc-arm-right,.gc-arm-left,.ia-main,.ia-off,.gc-body,.gc-head{transition:transform .08s linear}

/* subtle idle breathing so fighters feel alive at rest */
.battle-sprite:not([class*="anim-"]) .gc-body{animation:idleBreath 3.2s ease-in-out infinite}
.battle-sprite:not([class*="anim-"]) .gc-arm-right,
.battle-sprite:not([class*="anim-"]) .gc-arm-left{animation:idleSway 3.2s ease-in-out infinite}
@keyframes idleBreath{0%,100%{transform:translateY(0) scaleY(1)}50%{transform:translateY(-1.5px) scaleY(1.012)}}
@keyframes idleSway{0%,100%{transform:rotate(0)}50%{transform:rotate(1.5deg)}}

/* running: whole rig bobs + legs pump + arms pump (opposite phase) */
.battle-sprite.running .gc-svg-root{animation:runBob .3s ease-in-out infinite}
.battle-sprite.running .gc-legs{animation:runLegs .3s ease-in-out infinite}
.battle-sprite.running .gc-arm-right{animation:runArmA .3s ease-in-out infinite}
.battle-sprite.running .gc-arm-left{animation:runArmB .3s ease-in-out infinite}
.battle-sprite.running .ia-main{animation:runArmA .3s ease-in-out infinite}
@keyframes runBob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes runLegs{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes runArmA{0%,100%{transform:rotate(14deg)}50%{transform:rotate(-14deg)}}
@keyframes runArmB{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}}

/* =====================================================================
   WINDUP — the anticipation: arm cocks BACK, body coils away
   ===================================================================== */
.battle-sprite.anim-windup .gc-arm-right,.battle-sprite.anim-windup .ia-main{animation:cockBack .22s ease-out forwards}
.battle-sprite.anim-windup .gc-body{animation:coil .22s ease-out forwards}
@keyframes cockBack{to{transform:rotate(-52deg)}}
@keyframes coil{to{transform:rotate(-6deg) translateX(-4px)}}

/* =====================================================================
   MELEE SWINGS — arm whips forward around the shoulder; body drives in.
   The weapon (.ia-main) matches the arm exactly.
   ===================================================================== */
.battle-sprite.anim-slash-r .gc-arm-right,.battle-sprite.anim-slash-r .ia-main{animation:armSlash .4s cubic-bezier(.3,.9,.25,1)}
.battle-sprite.anim-slash-r .gc-body{animation:bodyDrive .4s cubic-bezier(.3,.9,.25,1)}
@keyframes armSlash{0%{transform:rotate(-52deg)}45%{transform:rotate(64deg)}70%{transform:rotate(48deg)}100%{transform:rotate(0)}}
@keyframes bodyDrive{0%{transform:rotate(-6deg)}45%{transform:rotate(10deg) translateX(6px)}100%{transform:none}}

.battle-sprite.anim-spin-slash .gc-svg-root{animation:spinWhole .6s cubic-bezier(.3,.85,.2,1)}
.battle-sprite.anim-spin-slash .gc-arm-right,.battle-sprite.anim-spin-slash .ia-main{animation:armSlash .6s cubic-bezier(.3,.9,.25,1)}
@keyframes spinWhole{0%{transform:rotate(0)}55%{transform:rotate(345deg) scale(1.06)}100%{transform:rotate(360deg)}}

.battle-sprite.anim-stab .gc-arm-right,.battle-sprite.anim-stab .ia-main{animation:armStab .28s ease}
.battle-sprite.anim-stab .gc-body{animation:bodyLunge .28s ease}
@keyframes armStab{0%{transform:rotate(-20deg) translateX(0)}45%{transform:rotate(6deg) translateX(16px)}100%{transform:none}}
@keyframes bodyLunge{0%{transform:none}45%{transform:translateX(12px)}100%{transform:none}}

.battle-sprite.anim-flurry-stab .gc-arm-right,.battle-sprite.anim-flurry-stab .ia-main{animation:armFlurry .5s linear}
@keyframes armFlurry{0%,100%{transform:rotate(-14deg) translateX(0)}20%{transform:rotate(4deg) translateX(15px)}40%{transform:rotate(-8deg) translateX(4px)}60%{transform:rotate(6deg) translateX(17px)}80%{transform:rotate(-6deg) translateX(6px)}}

.battle-sprite.anim-overhead .gc-arm-right,.battle-sprite.anim-overhead .ia-main{animation:armOverhead .5s cubic-bezier(.3,.9,.2,1)}
.battle-sprite.anim-overhead .gc-body{animation:bodyDrive .5s cubic-bezier(.3,.9,.2,1)}
@keyframes armOverhead{0%{transform:rotate(-96deg)}45%{transform:rotate(58deg)}70%{transform:rotate(44deg)}100%{transform:rotate(0)}}

.battle-sprite.anim-groundslam .gc-svg-root{animation:slamJump .62s cubic-bezier(.3,.9,.2,1)}
.battle-sprite.anim-groundslam .gc-arm-right,.battle-sprite.anim-groundslam .ia-main{animation:armOverhead .62s cubic-bezier(.3,.9,.2,1)}
@keyframes slamJump{0%{transform:translateY(0)}25%{transform:translateY(-30px)}50%{transform:translateY(8px)}62%{transform:translateY(0)}100%{transform:none}}

/* =====================================================================
   RANGED — draw/cast: both arms bring the weapon up, torso steadies
   ===================================================================== */
.battle-sprite.anim-cast-lob .gc-arm-right,.battle-sprite.anim-cast-lob .ia-main{animation:castLob .5s ease}
.battle-sprite.anim-cast-lob .gc-arm-left{animation:supportRaise .5s ease}
@keyframes castLob{0%{transform:rotate(0)}40%{transform:rotate(-40deg) translateY(-6px)}100%{transform:none}}
@keyframes supportRaise{0%{transform:none}40%{transform:rotate(20deg)}100%{transform:none}}

.battle-sprite.anim-cast-bolt .gc-arm-right,.battle-sprite.anim-cast-bolt .ia-main{animation:castBolt .42s ease}
@keyframes castBolt{0%{transform:rotate(0)}35%{transform:rotate(28deg) translateX(8px)}100%{transform:none}}

.battle-sprite.anim-cast-big .gc-arm-right,.battle-sprite.anim-cast-big .ia-main{animation:castBig .6s ease}
.battle-sprite.anim-cast-big .gc-arm-left{animation:supportRaise .6s ease}
.battle-sprite.anim-cast-big .gc-body{animation:castRear .6s ease}
@keyframes castBig{0%{transform:none}30%{transform:rotate(-30deg) translateY(-10px) scale(1.05)}65%{transform:rotate(6deg)}100%{transform:none}}
@keyframes castRear{0%,100%{transform:none}30%{transform:rotate(-4deg) translateY(-4px)}}

.battle-sprite.anim-draw-bow .gc-arm-right,.battle-sprite.anim-draw-bow .ia-main{animation:drawArrow .5s ease}
.battle-sprite.anim-draw-bow .gc-arm-left{animation:bowHold .5s ease}
@keyframes drawArrow{0%{transform:rotate(0)}50%{transform:rotate(-14deg) translateX(-10px)}70%{transform:rotate(2deg) translateX(4px)}100%{transform:none}}
@keyframes bowHold{0%{transform:none}50%{transform:rotate(6deg) translateX(6px)}100%{transform:none}}

/* =====================================================================
   REACTIONS — the DEFENDER shows the hit with the whole ragdoll:
   torso twists away, both arms flail, head snaps, figure slides back.
   ===================================================================== */
.battle-sprite.anim-hit .gc-svg-root{animation:recoilShove .34s cubic-bezier(.2,.8,.3,1)}
.battle-sprite.anim-hit .gc-body{animation:torsoTwist .34s ease}
.battle-sprite.anim-hit .gc-head{animation:headSnap .34s ease}
.battle-sprite.anim-hit .gc-arm-left{animation:flailA .34s ease}
.battle-sprite.anim-hit .gc-arm-right{animation:flailB .34s ease}
@keyframes recoilShove{0%{transform:translateX(0)}30%{transform:translateX(-14px)}100%{transform:none}}
@keyframes torsoTwist{0%{transform:none;filter:none}25%{transform:rotate(-8deg);filter:brightness(1.7) sepia(.4) hue-rotate(-30deg)}100%{transform:none;filter:none}}
@keyframes headSnap{0%{transform:none}30%{transform:rotate(-16deg) translateX(-3px)}100%{transform:none}}
@keyframes flailA{0%{transform:none}30%{transform:rotate(-38deg)}100%{transform:none}}
@keyframes flailB{0%{transform:none}30%{transform:rotate(30deg)}100%{transform:none}}

.battle-sprite.anim-heavy-hit .gc-svg-root{animation:recoilShoveHard .46s cubic-bezier(.2,.8,.3,1)}
.battle-sprite.anim-heavy-hit .gc-body{animation:torsoTwistHard .46s ease}
.battle-sprite.anim-heavy-hit .gc-head{animation:headSnapHard .46s ease}
.battle-sprite.anim-heavy-hit .gc-arm-left{animation:flailAHard .46s ease}
.battle-sprite.anim-heavy-hit .gc-arm-right{animation:flailBHard .46s ease}
@keyframes recoilShoveHard{0%{transform:translateX(0) rotate(0)}25%{transform:translateX(-30px) rotate(-6deg)}60%{transform:translateX(8px) rotate(2deg)}100%{transform:none}}
@keyframes torsoTwistHard{0%{transform:none;filter:none}22%{transform:rotate(-15deg) scaleY(.96);filter:brightness(2.1) sepia(.5) hue-rotate(-30deg)}60%{transform:rotate(5deg)}100%{transform:none;filter:none}}
@keyframes headSnapHard{0%{transform:none}25%{transform:rotate(-30deg) translateX(-6px)}60%{transform:rotate(8deg)}100%{transform:none}}
@keyframes flailAHard{0%{transform:none}25%{transform:rotate(-64deg)}100%{transform:none}}
@keyframes flailBHard{0%{transform:none}25%{transform:rotate(52deg)}100%{transform:none}}

/* knockdown — full ragdoll collapse backwards */
.battle-sprite.anim-knockdown .gc-svg-root{animation:ragdollDown .7s cubic-bezier(.3,.7,.2,1) forwards}
.battle-sprite.anim-knockdown .gc-arm-left{animation:limpA .7s ease forwards}
.battle-sprite.anim-knockdown .gc-arm-right{animation:limpB .7s ease forwards}
.battle-sprite.anim-knockdown .gc-head{animation:headLoll .7s ease forwards}
@keyframes ragdollDown{0%{transform:none}35%{transform:translateX(-26px) rotate(-30deg)}100%{transform:translateX(-40px) rotate(-72deg) translateY(20px)}}
@keyframes limpA{to{transform:rotate(-80deg)}}
@keyframes limpB{to{transform:rotate(70deg)}}
@keyframes headLoll{to{transform:rotate(-34deg)}}

.battle-sprite.anim-recover .gc-svg-root{animation:standUp .5s ease}
.battle-sprite.anim-recover .gc-arm-left,.battle-sprite.anim-recover .gc-arm-right,.battle-sprite.anim-recover .gc-head{animation:limbsReset .5s ease}
@keyframes standUp{0%{transform:translateX(-40px) rotate(-72deg) translateY(20px)}100%{transform:none}}
@keyframes limbsReset{0%{transform:rotate(-40deg)}100%{transform:none}}

.battle-sprite.anim-stunned .gc-head{animation:stunWobble .5s ease-in-out infinite}
.battle-sprite.anim-stunned .gc-body{animation:stunSway .5s ease-in-out infinite}
@keyframes stunWobble{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
@keyframes stunSway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}

/* KO — the loser ragdolls flat */
.battle-sprite.anim-ko .gc-svg-root{animation:koFall .85s forwards cubic-bezier(.3,.7,.2,1)}
.battle-sprite.anim-ko .gc-arm-left{animation:limpA .85s ease forwards}
.battle-sprite.anim-ko .gc-arm-right{animation:limpB .85s ease forwards}
.battle-sprite.anim-ko .gc-head{animation:headLoll .85s ease forwards}
@keyframes koFall{0%{transform:none;opacity:1}45%{transform:rotate(-84deg) translateY(26px)}100%{transform:rotate(-90deg) translateY(40px);opacity:.6;filter:grayscale(.6)}}

/* impact tints on the defender's body */
.battle-sprite.impact-slash .gc-body{animation:iSlash .4s}
@keyframes iSlash{0%{filter:none}25%{filter:drop-shadow(0 0 6px #ff6b6b) brightness(1.4)}100%{filter:none}}
.battle-sprite.impact-crush .gc-svg-root{animation:iCrush .5s}
@keyframes iCrush{0%{transform:scaleY(1)}30%{transform:scaleY(.84) scaleX(1.1)}60%{transform:scaleY(1.03)}100%{transform:none}}
.battle-sprite.impact-pierce .gc-body{animation:iPierce .35s}
@keyframes iPierce{0%{filter:none}30%{filter:drop-shadow(0 0 6px #bcd0ff) brightness(1.5)}100%{filter:none}}
.battle-sprite.impact-spore .gc-body,.battle-sprite.impact-bloom .gc-body{animation:iGlow .45s}
@keyframes iGlow{0%{filter:none}30%{filter:brightness(1.3) saturate(1.4)}100%{filter:none}}

/* status tints on the body */
.battle-sprite.tint-heal .gc-body{animation:tHeal .6s}@keyframes tHeal{0%,100%{filter:none}50%{filter:drop-shadow(0 0 8px #8be07a) brightness(1.2)}}
.battle-sprite.tint-frost .gc-body{filter:drop-shadow(0 0 6px #9fdcff) hue-rotate(-12deg) brightness(1.05)}
.battle-sprite.tint-burn .gc-body{animation:tBurn .5s}@keyframes tBurn{0%,100%{filter:none}50%{filter:drop-shadow(0 0 7px #ff8a4a) brightness(1.2)}}

/* PROJECTILES */
.projectile-layer{position:absolute;inset:0;pointer-events:none;z-index:3}
.proj{position:absolute;margin-left:-14px;width:28px;height:28px}
.proj-arrow{width:34px;height:8px;margin-top:-4px;background:linear-gradient(90deg,#dfe7f5,#8ba0c9);border-radius:2px;box-shadow:0 0 8px #bcd0ff;transform:scaleX(var(--dir,1))}
.proj-arrow::after{content:"";position:absolute;right:-2px;top:-3px;border:7px solid transparent;border-left-color:#eef4ff}
.proj-bloom{border-radius:50%;background:radial-gradient(circle,#fff2c4,#ffb3d0 60%,transparent);box-shadow:0 0 14px #ffd36b;animation:projPulse .3s ease-in-out infinite}
.proj-spore{border-radius:50%;background:radial-gradient(circle,#e6d6ff,#b28ad6 60%,transparent);box-shadow:0 0 14px #c39cff;animation:projSpin .5s linear infinite}
@keyframes projPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
@keyframes projSpin{to{transform:rotate(360deg)}}

/* ITEM EFFECT ANIMATIONS */
.battle-fx{position:absolute;inset:0;pointer-events:none;z-index:5}
.efx{position:absolute;margin-left:-40px;bottom:70px;width:80px;height:120px}
.efx-bleed-slash{bottom:120px;width:70px;height:70px;margin-left:-35px;border:4px solid transparent;border-top-color:#ff4d4d;border-right-color:#c0281f;border-radius:50%;opacity:0;animation:bleedSweep .6s ease forwards;animation-delay:calc(var(--i)*.09s);filter:drop-shadow(0 0 5px #ff2b2b)}
@keyframes bleedSweep{0%{opacity:0;transform:rotate(calc(var(--i)*40deg - 60deg)) scale(.3)}40%{opacity:1;transform:rotate(calc(var(--i)*40deg - 10deg)) scale(1)}100%{opacity:0;transform:rotate(calc(var(--i)*40deg + 20deg)) scale(1.3)}}
.efx-shield{bottom:60px;width:120px;height:150px;margin-left:-60px;background:conic-gradient(from 0deg,rgba(139,212,122,0),rgba(139,212,122,.35),rgba(139,212,122,0));border:2px solid rgba(139,212,122,.85);border-radius:14px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);opacity:0;transform:scale(.6);animation:shieldUp .9s cubic-bezier(.3,.9,.2,1) forwards;box-shadow:inset 0 0 20px rgba(139,212,122,.5)}
@keyframes shieldUp{0%{opacity:0;transform:scale(.6)}25%{opacity:.95;transform:scale(1.05)}70%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.08)}}
.efx-heal-mote{bottom:70px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:radial-gradient(circle,#d8ffcf,#6fd85a);box-shadow:0 0 8px #8be07a;opacity:0;animation:healRise 1s ease-out forwards;animation-delay:var(--d)}
@keyframes healRise{0%{opacity:0;transform:translateY(10px) scale(.5)}25%{opacity:1}100%{opacity:0;transform:translateY(-90px) scale(1.1)}}
.efx-frost{bottom:90px;width:110px;height:110px;margin-left:-55px;border-radius:50%;background:radial-gradient(circle,rgba(200,240,255,.5),transparent 62%);opacity:0;animation:frostBurst .9s ease forwards}
.efx-frost::before,.efx-frost::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,transparent 46%,#cdeeff 47%,#cdeeff 53%,transparent 54%),linear-gradient(60deg,transparent 46%,#a9e0ff 47%,#a9e0ff 53%,transparent 54%),linear-gradient(120deg,transparent 46%,#cdeeff 47%,#cdeeff 53%,transparent 54%);filter:drop-shadow(0 0 4px #9fdcff);animation:frostSpin 1.1s ease}
@keyframes frostBurst{0%{opacity:0;transform:scale(.3)}40%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.25)}}
@keyframes frostSpin{0%{transform:rotate(0) scale(.4)}100%{transform:rotate(40deg) scale(1)}}
.efx-flame{bottom:70px;width:16px;height:34px;margin-left:-8px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:linear-gradient(#fff0a8,#ff8a3a 55%,#e8481d);box-shadow:0 0 10px #ff7a2a;opacity:0;transform-origin:bottom;animation:flameUp .9s ease forwards;animation-delay:var(--d)}
@keyframes flameUp{0%{opacity:0;transform:translateY(6px) scaleY(.4)}30%{opacity:1;transform:translateY(-6px) scaleY(1.1)}70%{opacity:.9;transform:translateY(-30px) scaleY(.9) scaleX(.8)}100%{opacity:0;transform:translateY(-60px) scaleY(.5) scaleX(.5)}}
.efx-bolt{bottom:70px;width:40px;height:170px;margin-left:-20px;background:linear-gradient(#fff6b0,#ffe36b);opacity:0;clip-path:polygon(55% 0,25% 48%,50% 48%,20% 100%,80% 42%,52% 42%,80% 0);filter:drop-shadow(0 0 10px #ffe36b);animation:boltStrike .5s steps(2) forwards}
@keyframes boltStrike{0%{opacity:0;transform:scaleY(.2)}20%{opacity:1;transform:scaleY(1)}60%{opacity:1}70%{opacity:.3}80%{opacity:1}100%{opacity:0}}
.efx-spore{bottom:80px;width:100px;height:100px;margin-left:-50px;border-radius:50%;background:radial-gradient(circle,rgba(200,168,236,.75),rgba(140,110,180,.3) 60%,transparent);opacity:0;animation:sporePuff 1s ease forwards;filter:blur(1px)}
@keyframes sporePuff{0%{opacity:0;transform:scale(.3)}40%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}
.efx-stun{bottom:180px;width:70px;height:40px;margin-left:-35px}
.efx-stun::before,.efx-stun::after{content:"★";position:absolute;top:0;font-size:16px;color:#ffe36b;filter:drop-shadow(0 0 4px #ffca55);animation:starOrbit 1s linear}
.efx-stun::before{left:0}.efx-stun::after{right:0;animation-delay:.5s}
@keyframes starOrbit{0%{transform:translateX(0) translateY(0);opacity:0}20%{opacity:1}50%{transform:translateX(35px) translateY(-10px)}100%{transform:translateX(70px) translateY(0);opacity:0}}
.efx-charge{bottom:80px;width:120px;height:120px;margin-left:-60px;border-radius:50%;border:3px solid rgba(160,120,255,.9);opacity:0;animation:chargeRing .8s ease forwards;box-shadow:0 0 20px rgba(160,120,255,.6)}
@keyframes chargeRing{0%{opacity:0;transform:scale(.3)}35%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.6)}}

/* FLOATING TEXT */
.fx-dmg{position:absolute;bottom:150px;margin-left:-20px;font-family:var(--fs-display);font-weight:700;font-size:24px;color:#fff;text-shadow:0 2px 6px #000;animation:dmgUp 1s forwards}
.fx-dmg.crit{color:#ffd76a;font-size:32px}
@keyframes dmgUp{0%{transform:translateY(0);opacity:0}20%{opacity:1}100%{transform:translateY(-56px);opacity:0}}
.fx{position:absolute;bottom:160px;margin-left:-40px;width:80px;text-align:center;font-family:var(--fs-display);font-weight:700;font-size:15px}
.fx-count{font-size:26px;color:#fff;animation:pop .5s forwards}
.fx-heal{color:#8be07a;font-size:20px;animation:floatUp 1s forwards}
.fx-dot,.fx-dot-fire{font-size:14px;animation:floatUp .8s forwards}
.fx-dot-poison{font-size:14px;animation:floatUp .8s forwards}
.fx-heal-small{font-size:13px;color:#4d8a3e;font-weight:800;animation:floatUp .8s forwards}
.fx-tag{font-family:var(--pixel);font-size:8px;letter-spacing:.03em;padding:4px 7px;border-radius:6px;animation:tagPop .9s forwards;width:auto;margin-left:-34px;border:1px solid rgba(0,0,0,.15);box-shadow:0 2px 0 rgba(0,0,0,.12)}
.crit-tag{background:#ffe9a8;color:#8a5a00}.bleed-tag{background:#ffd4d4;color:#a33}
.shield-tag{background:#d4f0c4;color:#2f6a2a}.frost-tag{background:#d4eefb;color:#2f7db0}
.burn-tag{background:#ffd8b8;color:#b85a1a}.storm-tag{background:#fff0b8;color:#8a6a00}
.spore-tag{background:#e8d8f4;color:#6a3a9a}.dodge-tag{background:#e8e4d4;color:#7a7060}
.pierce-tag{background:#d4e0f4;color:#2f5a9a}.reflect-tag{background:#d4f0e0;color:#2a7a5a}
.poison-tag{background:#dcecc0;color:#4a6a1a}.exec-tag{background:#ffcaca;color:#8a1a1a}
.phoenix-tag{background:#ffe0b0;color:#b8641a}
@keyframes floatUp{0%{transform:translateY(10px);opacity:0}25%{opacity:1}100%{transform:translateY(-46px);opacity:0}}
@keyframes pop{0%{transform:scale(.4);opacity:0}30%{transform:scale(1.15);opacity:1}100%{transform:scale(1.4);opacity:0}}
@keyframes tagPop{0%{transform:translateY(8px) scale(.7);opacity:0}20%{transform:none;opacity:1}75%{opacity:1}100%{transform:translateY(-22px);opacity:0}}

.center{position:absolute;top:14px;left:50%;transform:translateX(-50%);text-align:center;z-index:6}
.count{font-family:var(--pixel);font-size:26px;color:#fff;text-shadow:0 2px 0 #37652f,0 0 16px rgba(255,255,255,.6)}

/* result overlay — paper look like the real site */
.result{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  z-index:8;text-align:center;background:rgba(247,245,235,.96);backdrop-filter:blur(10px) saturate(1.1);
  opacity:0;transform:scale(1.05);transition:opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.result.show{opacity:1;transform:none}
.result.is-win{background:radial-gradient(circle at 50% 35%,rgba(255,244,155,.92),rgba(224,243,212,.9))}
.result.is-loss{background:radial-gradient(circle at 50% 35%,rgba(255,235,220,.93),rgba(231,222,232,.9))}
.result .icon{font-size:58px;animation:pop .6s}
.result h2{font-family:var(--pixel);font-size:30px;margin-top:10px;color:var(--green-dark);text-shadow:2px 2px 0 #fff}
.result.is-loss h2{color:#a33}

.arena.shake{animation:sh .4s}.arena.shake-hard{animation:shh .45s}
@keyframes sh{0%,100%{transform:none}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@keyframes shh{0%,100%{transform:none}20%{transform:translate(-9px,3px)}50%{transform:translate(8px,-2px)}80%{transform:translate(-5px,2px)}}
.arena.freeze *{animation-play-state:paused!important}

.ia-skill-flash{animation:iaFlash .55s ease}
@keyframes iaFlash{0%{filter:none}30%{filter:drop-shadow(0 0 6px #fff) drop-shadow(0 0 12px var(--gold-soft)) brightness(1.4)}100%{filter:none}}
.ia-float{animation:iaFloat 3s ease-in-out infinite}@keyframes iaFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.ia-bloom-halo{animation:iaHalo 2.4s ease-in-out infinite}@keyframes iaHalo{0%,100%{opacity:.35}50%{opacity:.8}}
.ia-float-inner{animation:iaFloat 3s ease-in-out infinite}

/* ---------- controls (paper cards) ---------- */
.bottom{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.btn{font-family:var(--pixel);font-size:10px;border:2px solid var(--border);background:var(--paper2);color:var(--soil);
  border-radius:12px;padding:12px 16px;cursor:pointer;box-shadow:0 3px 0 rgba(120,140,90,.3);transition:transform .08s}
.btn:hover{border-color:var(--green)}.btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(120,140,90,.3)}
.btn.primary{background:linear-gradient(#7fce5f,#4d8a3e);color:#fff;border-color:var(--green-dark);text-shadow:0 1px 0 rgba(0,0,0,.25);box-shadow:0 4px 0 #2c5023}
.btn.gold{background:linear-gradient(#ffe36c,#f5c400);color:#4b3810;border-color:var(--gold);box-shadow:0 4px 0 #b48a18}
.btn:disabled{opacity:.5;cursor:default}
.speed{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--soil);font-weight:700;margin-left:auto}
.speed span:first-child{font-family:var(--pixel);font-size:8px}
.speed input{width:120px;accent-color:var(--green)}

.controls{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.card{background:var(--paper2);border:2px solid var(--border);border-radius:16px;padding:16px;box-shadow:0 4px 0 rgba(120,140,90,.18)}
.card h3{font-family:var(--pixel);font-size:11px;color:var(--green-dark);margin-bottom:14px}
.card.enemy{border-color:#d8b0a0}.card.enemy h3{color:var(--red)}
.row{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.row label{flex:0 0 62px;font-size:12px;color:var(--soil);font-weight:700}
select{flex:1;background:#fff;color:var(--ink);border:2px solid var(--border-soft);border-radius:10px;padding:8px 9px;font-size:13px;font-family:var(--body);font-weight:600;cursor:pointer}
select:focus{outline:2px solid var(--green);outline-offset:1px}
optgroup{font-family:var(--body);font-weight:800;color:var(--muted)}
.info{font-size:11.5px;color:var(--soil);margin:-2px 0 9px 70px;min-height:15px;line-height:1.4}
.rar{display:inline-block;font-family:var(--pixel);font-size:7px;padding:2px 5px;border-radius:5px;color:#fff;margin-right:4px;vertical-align:middle}
.rar-common{background:var(--r-common)}.rar-uncommon{background:var(--r-uncommon)}.rar-rare{background:var(--r-rare)}
.rar-epic{background:var(--r-epic)}.rar-legendary{background:var(--r-legendary)}
.statline{font-size:12px;color:var(--green-dark);font-weight:700;margin-top:10px;border-top:2px dashed var(--border-soft);padding-top:10px;line-height:1.5}
.card.enemy .statline{color:#a33}

.previews{margin-top:18px}
.previews h3{font-family:var(--pixel);font-size:9px;color:var(--muted);margin-bottom:9px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:2px solid var(--border-soft);background:var(--paper2);border-radius:99px;padding:6px 12px;font-size:12px;font-weight:700;color:var(--soil);cursor:pointer}
.chip:hover{border-color:var(--gold)}
.log{margin-top:16px;background:var(--paper2);border:2px solid var(--border);border-radius:14px;padding:13px 15px;min-height:58px;box-shadow:0 3px 0 rgba(120,140,90,.15)}
.log p{margin:0 0 3px;font-size:13px;color:var(--muted)}.log p:first-child{color:var(--ink);font-weight:700}
.note{font-size:12.5px;color:var(--muted);margin-top:22px;border-top:2px dashed var(--border-soft);padding-top:14px;line-height:1.6}
.note code{background:var(--green-soft);padding:1px 5px;border-radius:5px;font-size:12px;color:var(--green-dark)}
@media(max-width:760px){.controls{grid-template-columns:1fr}.fighter{width:150px;margin-left:-75px}.battle-sprite{width:150px;height:188px}.hud{width:140px}}

/* ---------- enhanced item-effect particles ---------- */
.efx-drop{position:absolute;bottom:130px;width:6px;height:9px;margin-left:-3px;border-radius:0 0 50% 50%/0 0 60% 60%;
  background:linear-gradient(#ff5a5a,#b01e1e);opacity:0;animation:dropFall .8s ease-in forwards;animation-delay:var(--dd)}
@keyframes dropFall{0%{opacity:0;transform:translate(0,0) scale(.6)}20%{opacity:1}100%{opacity:0;transform:translate(var(--dx),70px) scale(1)}}
.efx-poison-cloud{filter:hue-rotate(55deg) blur(1px)}
.efx-bubble{position:absolute;bottom:100px;width:10px;height:10px;margin-left:-5px;border-radius:50%;
  background:radial-gradient(circle,#dcf0b0,#7fa040);opacity:0;animation:bubbleRise 1.1s ease-out forwards;animation-delay:var(--dd)}
@keyframes bubbleRise{0%{opacity:0;transform:translateY(10px) scale(.4)}30%{opacity:.9}100%{opacity:0;transform:translateY(-70px) scale(1.1)}}
.efx-shard{position:absolute;bottom:130px;width:5px;height:26px;margin-left:-2.5px;transform-origin:bottom;
  background:linear-gradient(#eaf8ff,#8fd0f0);box-shadow:0 0 5px #bfe8ff;opacity:0;
  animation:shardOut .8s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:var(--dd);transform:rotate(var(--a)) scaleY(0)}
@keyframes shardOut{0%{opacity:0;transform:rotate(var(--a)) scaleY(0)}40%{opacity:1;transform:rotate(var(--a)) scaleY(1)}100%{opacity:0;transform:rotate(var(--a)) scaleY(.9) translateY(-10px)}}
.efx-flame{--fs:1}
.efx-flame{transform:scale(var(--fs))}
.efx-ember{position:absolute;bottom:80px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;
  background:radial-gradient(#fff0a8,#ff6a1a);box-shadow:0 0 6px #ff8a2a;opacity:0;
  animation:emberFly 1s ease-out forwards;animation-delay:var(--dd)}
@keyframes emberFly{0%{opacity:0;transform:translate(0,0)}25%{opacity:1}100%{opacity:0;transform:translate(var(--dx),-75px)}}
.efx-flash{position:absolute;inset:0;background:rgba(255,244,180,.55);opacity:0;animation:flashPop .3s ease forwards}
@keyframes flashPop{0%{opacity:0}15%{opacity:1}100%{opacity:0}}
.efx-spark{position:absolute;bottom:150px;width:4px;height:4px;margin-left:-2px;border-radius:50%;
  background:#fff3b0;box-shadow:0 0 6px #ffd76a;opacity:0;animation:sparkFly .5s ease-out forwards}
@keyframes sparkFly{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
.efx-hitring{position:absolute;bottom:150px;width:40px;height:40px;margin-left:-20px;border-radius:50%;
  border:3px solid rgba(255,255,255,.9);opacity:0;animation:hitRing .4s ease-out forwards}
.efx-hitring.big{width:64px;height:64px;margin-left:-32px;border-width:4px;border-color:rgba(255,230,150,.95)}
@keyframes hitRing{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(1.5)}}
.efx-ring{position:absolute;bottom:110px;width:80px;height:80px;margin-left:-40px;border-radius:50%;
  border:3px solid var(--rc,#fff);opacity:0;animation:hitRing .5s ease-out forwards}

/* Kampf-Positionierung: Sprites dürfen sich zum Gegner bewegen ohne das Grid zu sprengen */
.clash6-arena{overflow:hidden}
.clash6-arena .clash6-fighter{will-change:transform}
.battle-sprite.running{filter:drop-shadow(0 10px 8px rgba(0,0,0,.3))}


/* ===== Community Social-Leiste (socials.js) — auf allen App-Seiten ===== */
.community-socials{max-width:1100px;margin:44px auto 26px;padding:0 20px}
.socials-block{margin-top:0;padding-top:24px;border-top:1px dashed var(--border,rgba(0,0,0,.15));text-align:center}
.socials-lead{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#687164);margin-bottom:14px;font-weight:800}
.socials{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.soc{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:700;font-size:.9rem;color:var(--ink,#2b2b2b);background:var(--card,#fff);border:2px solid var(--border,#d8d2be);border-radius:10px;padding:9px 14px;box-shadow:3px 3px 0 var(--border,#d8d2be);transition:transform .12s,box-shadow .12s}
.soc:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--border,#d8d2be)}
.soc-ic{width:18px;height:18px;flex:none;display:block}
.soc-icon{display:inline-grid;place-items:center;width:37px;height:37px;background:var(--card,#fff);border:2px solid var(--border,#d8d2be);border-radius:9px;box-shadow:2px 2px 0 var(--border,#d8d2be);transition:transform .12s,box-shadow .12s}
.soc-icon:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--border,#d8d2be)}
.soc-icon .soc-ic{width:19px;height:19px}
