/* ============================================================
   สายลุยตัวจริง — PREMIUM FOREST CHAMPIONS
   ============================================================ */
#topTravelersPodium{
  position:relative;
  margin:2px 0 4px;
  overflow:hidden;
  border:1px solid rgba(244,210,116,.16);
  border-radius:24px;
  background:
    linear-gradient(180deg,rgba(3,11,16,.70),rgba(3,10,15,.94)),
    url('https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=1200&q=82')
    center 42% / cover no-repeat;
  box-shadow:
    0 18px 42px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.025);
  isolation:isolate;
}
#topTravelersPodium::before{
  content:"";
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(circle at 50% 38%,rgba(244,194,65,.13),transparent 25%),
    radial-gradient(circle at 15% 58%,rgba(148,163,184,.07),transparent 24%),
    radial-gradient(circle at 86% 61%,rgba(217,160,102,.07),transparent 24%);
}
#topTravelersPodium::after{
  content:"";
  position:absolute;
  left:10%;right:10%;bottom:-30px;height:70px;
  border-radius:50%;
  background:rgba(239,183,56,.12);
  filter:blur(28px);
  pointer-events:none;
  animation:tnhChampionFloorGlow 3.2s ease-in-out infinite;
}
@keyframes tnhChampionFloorGlow{
  0%,100%{opacity:.42;transform:scaleX(.84)}
  50%{opacity:.9;transform:scaleX(1.08)}
}

/* Header */
.tnh-champion-head{
  position:relative;
  z-index:3;
  padding:17px 16px 5px;
}
.tnh-champion-kicker{
  display:flex;
  align-items:center;
  gap:7px;
  color:#f2d27c;
  font-size:8px;
  font-weight:850;
  letter-spacing:1.15px;
}
.tnh-champion-kicker::before{
  content:"";
  width:19px;height:1px;
  background:linear-gradient(90deg,#f4c94e,transparent);
  box-shadow:0 0 8px rgba(244,201,78,.5);
}
.tnh-champion-title{
  margin:4px 0 0;
  font-size:23px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.5px;
  color:#fff;
}
.tnh-champion-title .gold{
  color:#f5c94f;
  text-shadow:0 0 18px rgba(245,201,79,.18);
}
.tnh-champion-sub{
  margin:6px 0 0;
  max-width:88%;
  color:#8fa3b3;
  font-size:9px;
  line-height:1.5;
}

/* floating light particles */
.tnh-champion-sparks{
  position:absolute;inset:0;z-index:1;
  overflow:hidden;pointer-events:none;
}
.tnh-champion-spark{
  position:absolute;
  width:4px;height:4px;border-radius:50%;
  background:#f8d76d;
  box-shadow:0 0 9px currentColor;
  opacity:0;
  animation:tnhChampionSpark 4.2s ease-in-out infinite;
}
.tnh-champion-spark:nth-child(1){left:10%;top:37%;animation-delay:.2s;color:#f8d76d}
.tnh-champion-spark:nth-child(2){left:23%;top:27%;animation-delay:1.4s;color:#7dd3fc}
.tnh-champion-spark:nth-child(3){left:40%;top:42%;animation-delay:2.3s;color:#f0abfc}
.tnh-champion-spark:nth-child(4){left:61%;top:25%;animation-delay:.8s;color:#fde68a}
.tnh-champion-spark:nth-child(5){left:76%;top:39%;animation-delay:2.9s;color:#67e8f9}
.tnh-champion-spark:nth-child(6){left:90%;top:30%;animation-delay:1.9s;color:#f9a8d4}
.tnh-champion-spark:nth-child(7){left:17%;top:66%;animation-delay:3.2s;color:#fde047}
.tnh-champion-spark:nth-child(8){left:82%;top:67%;animation-delay:.45s;color:#f4c94e}
@keyframes tnhChampionSpark{
  0%,100%{opacity:0;transform:translateY(8px) scale(.5)}
  30%{opacity:.95}
  65%{opacity:.55;transform:translateY(-16px) scale(1.15)}
}

/* Podium layout */
#topTravelersPodium .podium-row{
  position:relative;
  z-index:2;
  isolation:isolate;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:7px;
  min-height:265px;
  padding:43px 10px 0;
  overflow:visible;
  border-radius:0;
}
#topTravelersPodium .podium-row::before,
#topTravelersPodium .podium-row::after{
  display:none !important;
}
#topTravelersPodium .podium-slot{
  position:relative;
  flex:1;
  max-width:120px;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  z-index:2;
}
#topTravelersPodium .podium-1st{z-index:4}

/* Avatar ring */
#topTravelersPodium .podium-avatar{
  position:relative;
  overflow:visible;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:8px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,#12344a,#0ea5e9);
  transform:translateZ(0);
}
#topTravelersPodium .podium-avatar::before{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.10);
  opacity:.65;
}
#topTravelersPodium .podium-avatar::after{
  content:"";
  position:absolute;
  inset:-11px;
  border-radius:50%;
  border:1px dashed rgba(255,255,255,.08);
  animation:tnhChampionOrbit 9s linear infinite;
}
@keyframes tnhChampionOrbit{to{transform:rotate(360deg)}}

#topTravelersPodium .podium-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
  animation:tnhChampionAvatarFloat 3.4s ease-in-out infinite;
  transform-origin:center;
  will-change:transform;
}
@keyframes tnhChampionAvatarFloat{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-3px) scale(1.025)}
}
#topTravelersPodium .podium-avatar span:not(.podium-medal):not(.tnh-rank-crown){
  font-size:21px;
}

/* Rank 1 — crown fixed to the circular frame */
#topTravelersPodium .podium-1st .podium-avatar{
  width:91px;
  height:91px;
  border:3px solid #f5d66f;
  box-shadow:
    0 0 0 4px rgba(245,214,111,.08),
    0 0 24px rgba(245,201,79,.34),
    0 13px 25px rgba(0,0,0,.32);
  animation:tnhChampionRingPulse 2.4s ease-in-out infinite;
}
#topTravelersPodium .podium-1st .podium-avatar::before{
  border-color:rgba(255,224,119,.34);
  box-shadow:0 0 18px rgba(245,201,79,.20);
}
#topTravelersPodium .podium-1st .podium-avatar::after{
  border-color:rgba(245,201,79,.22);
}
@keyframes tnhChampionRingPulse{
  0%,100%{
    box-shadow:
      0 0 0 4px rgba(245,214,111,.06),
      0 0 20px rgba(245,201,79,.28),
      0 13px 25px rgba(0,0,0,.32)
  }
  50%{
    box-shadow:
      0 0 0 8px rgba(245,214,111,.025),
      0 0 34px rgba(245,201,79,.52),
      0 15px 28px rgba(0,0,0,.34)
  }
}
.tnh-rank-crown{
  position:absolute;
  z-index:8;
  left:50%;
  top:-34px;
  transform:translateX(-50%) rotate(-3deg);
  font-size:36px !important;
  line-height:1;
  filter:
    drop-shadow(0 3px 2px rgba(0,0,0,.45))
    drop-shadow(0 0 8px rgba(255,205,67,.60));
  transform-origin:50% 85%;
  animation:tnhChampionCrown 2.5s cubic-bezier(.18,.9,.22,1) infinite;
}
@keyframes tnhChampionCrown{
  0%,100%{transform:translateX(-50%) translateY(0) rotate(-5deg) scale(1)}
  38%{transform:translateX(-50%) translateY(-5px) rotate(4deg) scale(1.12)}
  55%{transform:translateX(-50%) translateY(-2px) rotate(-1deg) scale(1.04)}
}

/* crown shine */
.tnh-rank-crown::after{
  content:"";
  position:absolute;
  width:7px;height:7px;
  right:2px;top:0;
  border-radius:50%;
  background:#fff8c7;
  box-shadow:0 0 11px #fff1a6;
  animation:tnhCrownShine 1.8s ease-in-out infinite;
}
@keyframes tnhCrownShine{
  0%,100%{opacity:0;transform:scale(.2)}
  45%{opacity:1;transform:scale(1.15)}
  70%{opacity:0;transform:scale(.3)}
}

/* 2nd / 3rd rings */
#topTravelersPodium .podium-2nd .podium-avatar{
  width:69px;height:69px;
  border:3px solid #cbd5e1;
  box-shadow:0 0 16px rgba(203,213,225,.25),0 10px 22px rgba(0,0,0,.25);
}
#topTravelersPodium .podium-3rd .podium-avatar{
  width:69px;height:69px;
  border:3px solid #d89a5a;
  box-shadow:0 0 16px rgba(216,154,90,.25),0 10px 22px rgba(0,0,0,.25);
}

/* medal badge */
#topTravelersPodium .podium-medal{
  position:absolute;
  z-index:7;
  right:-7px;
  bottom:-5px;
  width:27px;height:27px;
  display:grid;place-items:center;
  border-radius:50%;
  background:rgba(5,13,20,.92);
  border:1px solid rgba(255,255,255,.16);
  font-size:17px;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.45));
  animation:tnhMedalPop 2.8s ease-in-out infinite;
}
#topTravelersPodium .podium-2nd .podium-medal{animation-delay:-.8s}
#topTravelersPodium .podium-3rd .podium-medal{animation-delay:-1.4s}
@keyframes tnhMedalPop{
  0%,100%{transform:scale(1) rotate(0)}
  45%{transform:scale(1.12) rotate(7deg)}
  60%{transform:scale(.98) rotate(-3deg)}
}

/* Names */
#topTravelersPodium .podium-name{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#f5f8fb;
  font-size:11.5px;
  font-weight:850;
  text-align:center;
  line-height:1.3;
}
#topTravelersPodium .podium-1st .podium-name{
  color:#fff7d8;
  font-size:13.5px;
  text-shadow:0 0 12px rgba(245,201,79,.18);
}
#topTravelersPodium .podium-count{
  margin:2px 0 8px;
  color:#8297a9;
  font-size:9.5px;
}
#topTravelersPodium .podium-1st .podium-count{color:#d8bd6e}

/* Podium stands — less toy-like */
#topTravelersPodium .podium-stand{
  position:relative;
  width:100%;
  overflow:hidden;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:9px;
  border-radius:14px 14px 0 0;
  color:rgba(5,12,17,.68);
  font-weight:950;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32);
}
#topTravelersPodium .podium-stand::before{
  content:"";
  position:absolute;
  left:-25%;top:-25%;
  width:40%;height:160%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.30),transparent);
  transform:skewX(-18deg);
  animation:tnhPodiumSweep 4.6s ease-in-out infinite;
}
@keyframes tnhPodiumSweep{
  0%,62%{left:-45%;opacity:0}
  72%{opacity:.7}
  100%{left:125%;opacity:0}
}
#topTravelersPodium .podium-1st .podium-stand{
  height:78px;
  background:linear-gradient(180deg,#f8df8a,#d3a322 62%,#9b7110);
  font-size:27px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    0 -5px 18px rgba(245,201,79,.10);
}
#topTravelersPodium .podium-2nd .podium-stand{
  height:55px;
  background:linear-gradient(180deg,#dbe4ed,#a9b7c7 65%,#758497);
  font-size:21px;
}
#topTravelersPodium .podium-3rd .podium-stand{
  height:43px;
  background:linear-gradient(180deg,#e4ae78,#bd7940 65%,#8c4f26);
  font-size:21px;
}

/* Champion footer */
.tnh-champion-foot{
  position:relative;
  z-index:4;
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 11px 11px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(4,13,20,.55);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.tnh-champion-foot-ico{
  width:32px;height:32px;flex:0 0 auto;
  display:grid;place-items:center;
  border:1px solid rgba(245,201,79,.14);
  border-radius:11px;
  background:rgba(245,201,79,.055);
  font-size:15px;
}
.tnh-champion-foot strong{
  display:block;color:#dce9f2;font-size:9.5px;
}
.tnh-champion-foot small{
  display:block;margin-top:2px;color:#647b8f;font-size:7.5px;
}

/* wow entrance when section is rendered */
#topTravelersPodium .podium-slot{
  animation:tnhChampionEnter .58s cubic-bezier(.18,.9,.22,1) both;
}
#topTravelersPodium .podium-2nd{animation-delay:.10s}
#topTravelersPodium .podium-1st{animation-delay:.22s}
#topTravelersPodium .podium-3rd{animation-delay:.34s}
@keyframes tnhChampionEnter{
  from{opacity:0;transform:translateY(22px) scale(.88)}
  70%{opacity:1;transform:translateY(-4px) scale(1.025)}
  to{opacity:1;transform:none}
}

@media(max-width:380px){
  #topTravelersPodium .podium-row{gap:5px;padding-left:7px;padding-right:7px}
  #topTravelersPodium .podium-1st .podium-avatar{width:82px;height:82px}
  #topTravelersPodium .podium-2nd .podium-avatar,
  #topTravelersPodium .podium-3rd .podium-avatar{width:62px;height:62px}
  .tnh-rank-crown{font-size:32px !important;top:-31px}
  .tnh-champion-title{font-size:21px}
}

@media(prefers-reduced-motion:reduce){
  #topTravelersPodium *,
  #topTravelersPodium *::before,
  #topTravelersPodium *::after{
    animation:none !important;
  }
}