/* เหรียญรางวัล + เวทีประกาศผลแบบวงล้อ (แสงตามคณะสีที่ได้รางวัล) */
.medal { --ms: 64px; --mg: color-mix(in srgb, var(--tc, #ff3d9a) 85%, transparent); position: relative; display: inline-block; width: var(--ms); height: calc(var(--ms) * 1.42); vertical-align: middle; }
.medal.xs { --ms: 1.35rem; height: var(--ms); }
.medal.sm { --ms: 42px; } .medal.md { --ms: 64px; } .medal.lg { --ms: 104px; }
.medal .rb { position: absolute; top: 0; width: 46%; height: 62%; z-index: 0; background: linear-gradient(180deg, color-mix(in srgb, var(--tc, #d32f2f) 92%, #fff), color-mix(in srgb, var(--tc, #d32f2f) 70%, #000)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }
.medal .rb1 { left: 10%; clip-path: polygon(0 0, 100% 0, 78% 100%, 40% 86%, 0 100%); transform: rotate(8deg); transform-origin: top; }
.medal .rb2 { right: 10%; clip-path: polygon(0 0, 100% 0, 100% 100%, 60% 86%, 22% 100%); transform: rotate(-8deg); transform-origin: top; filter: brightness(.82); }
.medal .disc { position: absolute; left: 0; bottom: 0; width: var(--ms); height: var(--ms); border-radius: 50%; z-index: 1; overflow: hidden; display: grid; place-items: center;
  background: radial-gradient(circle at 30% 25%, var(--hi), var(--mid) 42%, var(--lo) 78%, var(--dk));
  box-shadow: inset 0 0 0 calc(var(--ms) * .06) rgba(255,255,255,.4), inset 0 0 0 calc(var(--ms) * .115) rgba(0,0,0,.22), inset 0 calc(var(--ms) * -.09) calc(var(--ms) * .14) rgba(0,0,0,.35), 0 8px 16px -4px rgba(0,0,0,.55), 0 0 calc(var(--ms) * .55) var(--mg), 0 0 calc(var(--ms) * 1.1) calc(var(--ms) * -.1) var(--mg); }
.medal .disc::before { content: ""; position: absolute; inset: 17%; border-radius: 50%; border: calc(var(--ms) * .03) solid rgba(255,255,255,.55); background: radial-gradient(circle at 70% 75%, rgba(0,0,0,.18), transparent 60%); }
.medal .disc::after { content: ""; position: absolute; top: -20%; left: -70%; width: 45%; height: 140%; transform: rotate(22deg); background: linear-gradient(90deg, transparent, rgba(255,255,255,.75), transparent); animation: medalShine 3.6s ease-in-out infinite; }
.medal .disc b { position: relative; z-index: 1; font-family: 'Kanit', 'Noto Sans Thai', sans-serif; font-style: italic; font-weight: 700; font-size: calc(var(--ms) * .5); line-height: 1; color: var(--ink); text-shadow: 0 1px 0 rgba(255,255,255,.7), 0 -1px 0 rgba(0,0,0,.25); }
.medal.xs .disc::before { inset: 14%; } .medal.xs .disc { box-shadow: inset 0 0 0 1px rgba(255,255,255,.5), 0 2px 5px rgba(0,0,0,.4), 0 0 8px var(--mg); } .medal.xs .disc b { font-size: .8rem; }
.medal.xs .disc::after { display: none; }
.medal.m1 { --hi: #fffbe0; --mid: #f7c600; --lo: #c58a00; --dk: #7a5200; --ink: #7a4b00; }
.medal.m2 { --hi: #ffffff; --mid: #cfd6e4; --lo: #8b95aa; --dk: #566074; --ink: #3b4458; }
.medal.m3 { --hi: #ffe2c2; --mid: #d98a45; --lo: #9a5a22; --dk: #653511; --ink: #4a2308; }
.medal.lg .disc { animation: medalPulse 2.8s ease-in-out infinite; }
@keyframes medalShine { 0%, 55% { left: -70%; } 100% { left: 130%; } }
@keyframes medalPulse { 50% { box-shadow: inset 0 0 0 calc(var(--ms) * .06) rgba(255,255,255,.4), inset 0 0 0 calc(var(--ms) * .115) rgba(0,0,0,.22), 0 8px 16px -4px rgba(0,0,0,.55), 0 0 calc(var(--ms) * .9) var(--mg), 0 0 calc(var(--ms) * 1.6) var(--mg); } }
.medal-no { font-weight: 800; color: #9fb0ec; }

/* เวทีโพเดียม (ลายเดียวกับวงล้อ: พื้นกรมท่า แสงชมพู/ฟ้า อนุภาค พื้นสะท้อน) */
.ann-card.stage { position: relative; isolation: isolate; color: #fff; border: 1px solid rgba(255,255,255,.12);
  background: radial-gradient(ellipse 70% 40% at 50% 100%, rgba(255,61,154,.22), transparent 70%), radial-gradient(ellipse 60% 50% at 12% 0%, rgba(53,94,252,.38), transparent 70%), linear-gradient(180deg, #010d24 0%, #011A41 55%, #05122e 100%); box-shadow: 0 40px 80px -40px rgba(1,13,36,.95); }
.ann-card.stage::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .7;
  background-image: radial-gradient(2px 2px at 12% 22%, #fff, transparent), radial-gradient(1.5px 1.5px at 28% 68%, #ffb3d7, transparent), radial-gradient(2px 2px at 47% 14%, #fff, transparent), radial-gradient(1.5px 1.5px at 63% 52%, #bcd0ff, transparent), radial-gradient(2px 2px at 78% 24%, #ffd9a0, transparent), radial-gradient(1.5px 1.5px at 90% 70%, #fff, transparent), radial-gradient(1.5px 1.5px at 38% 40%, #fff, transparent);
  animation: stageTwinkle 4s ease-in-out infinite alternate; }
@keyframes stageTwinkle { from { opacity: .35; } to { opacity: .9; } }
.stage .ann-ch h2 { color: #fff; } .stage .ann-ch small { color: #b8c6f2; }
.stage .podium { perspective: 1200px; padding-top: 2.2rem; }
.stage .pod { --glow: color-mix(in srgb, var(--tc, #ff3d9a) 80%, transparent); z-index: 0; }
.stage .pod::before { content: ""; position: absolute; z-index: -1; top: -34px; left: -8%; right: -8%; bottom: 40px; clip-path: polygon(40% 0, 60% 0, 100% 100%, 0 100%); background: linear-gradient(180deg, color-mix(in srgb, var(--tc, #ff3d9a) 65%, transparent), transparent 85%); opacity: .38; animation: beam 3.4s ease-in-out infinite alternate; pointer-events: none; }
.stage .pod.p1::before { opacity: .6; top: -60px; }
@keyframes beam { from { opacity: .22; } to { opacity: .6; } }
.stage .pod-medal { animation: podFloat 3.2s ease-in-out infinite; filter: none; margin-bottom: .5rem; }
.stage .pod.p1 { filter: none; }
.stage .pod-name { color: #fff; font-size: 1.1rem; text-shadow: 0 0 14px var(--glow); }
.stage .pod-pts b { color: #fff; text-shadow: 0 0 22px var(--glow), 0 0 4px var(--glow); }
.stage .pod-pts small { color: #b8c6f2; }
.stage .pod-md { color: #c9d6ff; display: flex; gap: .55rem; align-items: center; justify-content: center; font-weight: 600; }
.stage .pod-md .medal { margin-right: .15rem; }
.stage .pod-step { position: relative; color: #fff; font-family: 'Kanit', sans-serif; font-style: italic; font-size: 1.6rem; font-weight: 700; border-top: 2px solid rgba(255,255,255,.55);
  background: linear-gradient(180deg, color-mix(in srgb, var(--tc, #ff3d9a) 85%, #fff 10%), color-mix(in srgb, var(--tc, #ff3d9a) 40%, #010d24)); box-shadow: 0 -14px 40px -8px var(--glow), inset 0 1px 0 rgba(255,255,255,.4); -webkit-box-reflect: below 3px linear-gradient(transparent 62%, rgba(255,255,255,.16)); }
.stage .pod-step::after { content: ""; position: absolute; left: 8%; right: 8%; bottom: -10px; height: 8px; border-radius: 50%; background: var(--tc, #ff3d9a); filter: blur(10px); opacity: .85; }
.stage .skp-dot { background: var(--tc, #ff3d9a); box-shadow: 0 0 10px var(--tc, #ff3d9a); }

/* ผลล่าสุด / ตารางอันดับ / ป้ายรางวัลหน้าแรก */
.lt li { align-items: center; }
.lt li .m { width: auto; display: inline-grid; }
.lt li:first-child { background: linear-gradient(90deg, color-mix(in srgb, var(--tc, #ff3d9a) 16%, #fff), transparent); border-radius: 12px; box-shadow: inset 3px 0 0 var(--tc, #ff3d9a); padding: .2rem .4rem; }
.sum-row .md b { display: inline-flex; align-items: center; gap: .25rem; }
.skp-awards .aw-m { display: inline-grid; }
.skp-awards li { box-shadow: 0 0 0 1px color-mix(in srgb, var(--tc, #ffffff) 45%, transparent), 0 4px 14px -6px var(--tc, rgba(0,0,0,.3)); }
.skp-awards li.aw1 .medal { --mg: color-mix(in srgb, var(--tc, #f7c600) 90%, transparent); }
@media (max-width: 575px) { .medal.lg { --ms: 76px; } .medal.md { --ms: 50px; } .stage .pod-step { font-size: 1.2rem; } }
@media (prefers-reduced-motion: reduce) { .medal .disc, .medal .disc::after, .stage .pod::before, .stage .pod-medal, .ann-card.stage::before { animation: none; } }