/* 시상식 무대 (플래시게임 톤) */
.aw { display: grid; gap: 12px; }
.st {
  position: relative; width: 100%; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 22px;
  container-type: size; user-select: none; -webkit-user-select: none; cursor: pointer;
  background: #1b1033; color: #fff; font-family: 'Black Han Sans', 'Noto Sans KR', sans-serif;
  box-shadow: 0 10px 40px rgb(30 10 60 / .35);
}
.st-wall {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 50% 10%, #5b2d9b 0%, transparent 60%),
    repeating-linear-gradient(90deg, rgb(255 255 255 / .03) 0 6cqw, transparent 6cqw 12cqw),
    linear-gradient(#2a1650, #160b2c 70%);
  transition: filter .6s;
}
.st.dim .st-wall, .st.dim .st-floor { filter: brightness(.35) saturate(.4); }
.st.night .st-wall { filter: brightness(.3) hue-rotate(40deg); }
.st.night .st-floor { filter: brightness(.4); }
.st-bulbs { position: absolute; top: 2.5cqh; left: 4%; right: 4%; display: flex; justify-content: space-between; }
.st-bulbs i { width: 2.4cqw; height: 2.4cqw; border-radius: 50%; background: #ffe066; box-shadow: 0 0 2cqw #ffcc00; animation: bulb 1s infinite alternate; }
.st-bulbs i:nth-child(odd) { animation-delay: .5s; }
@keyframes bulb { from { opacity: .35; } to { opacity: 1; } }
.st-banner {
  position: absolute; top: 6.5cqh; left: 50%; transform: translateX(-50%); white-space: nowrap;
  padding: 1.2cqw 4cqw; border-radius: 2cqw; background: linear-gradient(#ffd84d, #f5a300); color: #4a1d00;
  font-size: 4.2cqw; font-weight: 900; box-shadow: 0 1cqw 0 #a65f00; max-width: 92%; overflow: hidden; text-overflow: ellipsis;
}
.st-banner small { font-size: .7em; margin-right: 1cqw; opacity: .8; }
.st-floor {
  position: absolute; left: 0; right: 0; bottom: 0; height: 26cqh;
  background: linear-gradient(#7a3b1d, #4a2210); border-top: 1.2cqw solid #c46a2d;
  transition: filter .6s;
}
.st-floor::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 9cqw, rgb(0 0 0 / .12) 9cqw 9.4cqw); }
.st-spot {
  position: absolute; top: -5cqh; left: 50%; width: 44cqw; height: 110cqh; transform: translateX(-50%);
  background: linear-gradient(rgb(255 250 210 / .0), rgb(255 250 210 / .32));
  clip-path: polygon(42% 0, 58% 0, 100% 100%, 0 100%); pointer-events: none; opacity: 0;
  transition: left .14s ease-out, opacity .3s; mix-blend-mode: screen;
}
.st-title {
  position: absolute; top: 15cqh; left: 50%; transform: translateX(-50%); width: 92%; text-align: center; z-index: 3;
  text-shadow: 0 .8cqw 0 #000, 0 0 3cqw rgb(0 0 0 / .6);
}
.st-desc {
  position: absolute; left: 50%; top: 40cqh; transform: translate(-50%,-50%); z-index: 4; max-width: 84%; width: max-content;
  padding: 2.2cqw 5cqw; border-radius: 99cqw; background: rgb(255 255 255 / .94); color: #2a1650;
  font-family: 'Noto Sans KR', sans-serif; font-size: 4.6cqw; font-weight: 800; text-align: center; line-height: 1.35;
  box-shadow: 0 1.2cqw 0 rgb(0 0 0 / .35);
}
.st.captioned .ch { bottom: 27cqh; }
.tt-cat { font-size: 4.4cqw; color: #ffd84d; font-weight: 800; }
.tt-main { font-size: 9cqw; font-weight: 900; line-height: 1.15; letter-spacing: -.02em; }
.tt-main.win { font-size: 11cqw; color: #fff36b; }
.st.finale .tt-main { color: #fff36b; }

/* 캐릭터 */
.st-cast { position: absolute; inset: 0; z-index: 2; --u: 1cqw; }
.st-cast[data-n="4"] { --u: .84cqw; }
.st-cast[data-n="5"] { --u: .72cqw; }
.st-cast[data-n="6"] { --u: .62cqw; }
.st-cast[data-n="5"] .ch-name, .st-cast[data-n="6"] .ch-name { font-size: 3.4cqw; }
.ch.tagged .ch-tag { transform: translateX(-50%) scale(1); }
.ch-photo { position: absolute; left: 8%; top: 6%; width: 84%; aspect-ratio: 1; border-radius: 50%; background: center / cover no-repeat; box-shadow: 0 0 0 calc(.8 * var(--u)) rgb(255 255 255 / .9); }
.ch.has-photo .ch-eyes, .ch.has-photo .ch-mouth, .ch.has-photo .ch-init { display: none; }
.ch.has-photo .ch-body { height: calc(27 * var(--u)); }
.ch { position: absolute; bottom: 13cqh; left: 50%; width: calc(22 * var(--u)); transform: translateX(-50%); transition: left .5s cubic-bezier(.5,0,.3,1), bottom .4s ease, opacity .4s; }
.ch-body {
  position: relative; width: calc(22 * var(--u)); height: calc(25 * var(--u)); margin: 0 auto; border-radius: 50% 50% 42% 42% / 58% 58% 42% 42%;
  background: radial-gradient(circle at 35% 28%, rgb(255 255 255 / .45), transparent 40%), var(--c);
  box-shadow: inset calc(-1.5 * var(--u)) calc(-2 * var(--u)) 0 rgb(0 0 0 / .18), 0 calc(1.5 * var(--u)) 0 rgb(0 0 0 / .35);
  transform-origin: 50% 100%; transition: transform .4s, filter .4s;
}
.ch-eyes { position: absolute; top: 28%; left: 0; right: 0; display: flex; justify-content: center; gap: calc(4 * var(--u)); }
.ch-eyes i { width: calc(4.6 * var(--u)); height: calc(5.4 * var(--u)); border-radius: 50%; background: #fff; position: relative; }
.ch-eyes i::after { content: ''; position: absolute; width: calc(2.3 * var(--u)); height: calc(2.6 * var(--u)); border-radius: 50%; background: #111; left: calc(1.3 * var(--u)); top: calc(1.5 * var(--u)); transition: all .3s; }
.ch-mouth { position: absolute; top: 56%; left: 50%; width: calc(6 * var(--u)); height: calc(2.6 * var(--u)); transform: translateX(-50%); border: calc(.8 * var(--u)) solid #111; border-top: 0; border-radius: 0 0 calc(6 * var(--u)) calc(6 * var(--u)); transition: all .3s; }
.ch-init { position: absolute; bottom: 9%; left: 50%; transform: translateX(-50%); font-size: calc(4.6 * var(--u)); font-weight: 900; color: rgb(255 255 255 / .9); text-shadow: 0 calc(.4 * var(--u)) 0 rgb(0 0 0 / .3); }
.ch-prop { position: absolute; right: calc(-6 * var(--u)); top: 38%; font-size: calc(9 * var(--u)); }
.ch-name { margin-top: calc(2 * var(--u)); text-align: center; font-size: calc(3.8 * var(--u)); font-weight: 800; color: #fff; text-shadow: 0 calc(.5 * var(--u)) 0 #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-tag {
  position: absolute; bottom: calc(100% + 1cqw); left: 50%; transform: translateX(-50%) scale(0); white-space: nowrap;
  padding: .8cqw 2.2cqw; border-radius: 2cqw; background: #fff; color: #2a1650; font-size: 3.3cqw; font-weight: 800; transition: transform .25s;
}
.ch.happy .ch-mouth { width: calc(8 * var(--u)); height: calc(4.2 * var(--u)); background: #6b0f1a; }
.ch.happy .ch-eyes i::after { top: calc(1 * var(--u)); }
.ch.lose .ch-body { transform: rotate(-88deg) translate(-10%, 10%); filter: grayscale(.7) brightness(.7); }
.ch.lose .ch-mouth { border: calc(.8 * var(--u)) solid #111; border-bottom: 0; border-radius: calc(6 * var(--u)) calc(6 * var(--u)) 0 0; top: 62%; }
.ch.lose .ch-eyes i::after { width: calc(3 * var(--u)); height: calc(.7 * var(--u)); border-radius: 0; top: calc(2.4 * var(--u)); left: calc(.8 * var(--u)); }
.ch.off { opacity: 0; }
/* 수상자 발표 이후 2배속: 이동·자막 전환도 절반 */
.st.quick .ch { transition-duration: .25s, .2s, .2s; }
.st.quick .ch-body { transition-duration: .2s; }
.st.quick .st-spot { transition-duration: .07s, .15s; }
.ch.dimmed .ch-body { filter: grayscale(.6) brightness(.75); }
.ch.bowing .ch-body { transform: rotate(35deg); filter: none; }
.ch.bowing .ch-name { opacity: .7; }
.ch.laughing .ch-body { animation: wobble .18s infinite alternate; }
.ch.angry .ch-body { filter: saturate(2) hue-rotate(-20deg); animation: wobble .08s infinite alternate; }
.ch.eating .ch-mouth { width: calc(7 * var(--u)); height: calc(6 * var(--u)); border-radius: 50%; background: #6b0f1a; animation: chew .16s infinite alternate; }
.ch.crying .ch-mouth, .ch.teary .ch-mouth { border: calc(.8 * var(--u)) solid #111; border-bottom: 0; border-radius: calc(6 * var(--u)) calc(6 * var(--u)) 0 0; top: 60%; }
.ch.teary .ch-eyes i:first-child::before { content: '💧'; position: absolute; font-size: calc(3 * var(--u)); top: calc(5 * var(--u)); left: 0; }
.st.pink .st-wall { filter: hue-rotate(55deg) saturate(1.5) brightness(1.2); }
.ch.heart-eyes .ch-eyes i { background: none; }
.ch.heart-eyes .ch-eyes i::after { content: '❤️'; background: none; width: auto; height: auto; top: -.2em; left: -.05em; font-size: calc(5 * var(--u)); line-height: 1; }
.ch.glow .ch-eyes i { background: #ffe94a; box-shadow: 0 0 calc(3 * var(--u)) #ffe94a; }
.ch.pose .ch-prop { font-size: calc(9 * var(--u)); }
.ch.pose .ch-prop::after { content: '✌️'; }
.ch.ghosting { animation: float 1.6s infinite ease-in-out; }
.ch.ghosting .ch-body { opacity: .35; filter: grayscale(1) brightness(1.6); }
.ch.sleep .ch-eyes i::after { height: calc(.7 * var(--u)); border-radius: 0; top: calc(2.6 * var(--u)); }
.ch.woke .ch-eyes i::after { width: calc(1.4 * var(--u)); height: calc(1.4 * var(--u)); top: calc(1.8 * var(--u)); left: calc(1.6 * var(--u)); }
@keyframes wobble { from { transform: rotate(-6deg); } to { transform: rotate(6deg); } }
@keyframes chew { from { height: calc(2 * var(--u)); } to { height: calc(6 * var(--u)); } }
@keyframes float { 0%, 100% { margin-bottom: 0; } 50% { margin-bottom: 4cqw; } }
.crown { position: absolute; left: 50%; top: 0; font-size: calc(13 * var(--u)); transform: translate(-50%,-85%); }
.trophy { position: absolute; left: calc(-5 * var(--u)); top: 40%; font-size: calc(10 * var(--u)); filter: drop-shadow(0 calc(.6 * var(--u)) 0 rgb(0 0 0 / .4)); }

.st-speech {
  position: absolute; bottom: calc(100% + 3cqw); left: 50%; transform: translateX(-50%);
  width: max-content; max-width: 76cqw; max-height: 34cqh; overflow: hidden;
  padding: 2.4cqw 3.4cqw; border-radius: 3.4cqw; background: #fff; color: #1b1033;
  font-family: 'Noto Sans KR', sans-serif; font-size: 3.7cqw; font-weight: 700; line-height: 1.4; white-space: pre-line; z-index: 4;
  box-shadow: 0 1cqw 0 rgb(0 0 0 / .3);
}
.st-speech::after { content: ''; position: absolute; top: 100%; left: 50%; border: 2cqw solid transparent; border-top-color: #fff; transform: translateX(-50%); }
.st-speech.kakao { background: #fee500; }
/* 하단 자막 자리의 수상 소감 */
.st-speech.bottom { left: 4%; right: 13cqw; bottom: 2.5cqh; width: auto; max-width: none; max-height: 22cqh; transform: none; text-align: left; font-size: 3.9cqw; z-index: 6; }
.st-speech.bottom::after { display: none; }
.st-speech.high { bottom: calc(100% + 12cqw); }
.st-speech.kakao em { font-style: normal; color: #a37f00; font-size: .8em; margin-left: 1cqw; }

/* 효과 레이어 */
.st-fx { position: absolute; inset: 0; z-index: 5; pointer-events: none; overflow: hidden; }
.pt { position: absolute; line-height: 1; white-space: nowrap; will-change: transform; }
.pt.kk { color: #fff36b; font-weight: 900; text-shadow: 0 .5cqw 0 #b65c00; }
.pt.qq { color: #7fd1ff; font-weight: 900; text-shadow: 0 .5cqw 0 #0b4a85; }
.pt.confetti i { display: block; width: 1.6cqw; height: 2.6cqw; border-radius: .3cqw; }
.pt.bubble { padding: 1cqw 2.4cqw; border-radius: 3cqw; background: #fff; color: #1b1033; font-family: 'Noto Sans KR', sans-serif; font-weight: 900; box-shadow: 0 .8cqw 0 rgb(0 0 0 / .3); }
.pt.label { color: #fff; font-weight: 900; text-shadow: 0 .6cqw 0 #000; }
.pt.dots { color: #fff; letter-spacing: .4em; transform: translateX(-50%); }
.pt.star { color: #fffbe0; }
.pt.stamp { padding: 1cqw 3cqw; border: .8cqw solid #ff3355; color: #ff3355; background: rgb(255 255 255 / .9); border-radius: 2cqw; font-weight: 900; }
.pt.censorbar { background: #000; color: #fff; padding: 1cqw 4cqw; font-weight: 900; border-radius: .6cqw; transform-origin: center; }
.tumble { display: block; width: 9cqw; height: 9cqw; border-radius: 50%; border: .7cqw dashed #c9a46b; background: radial-gradient(circle, transparent 30%, rgb(201 164 107 / .5) 32%, transparent 60%); }
.st-crowd { position: absolute; left: 0; right: 0; bottom: 0; height: 12cqh; display: flex; justify-content: space-around; align-items: flex-end; }
.st-crowd i { width: 11cqw; height: 10cqh; border-radius: 50% 50% 0 0; background: #0d0619; animation: bob .3s infinite alternate; }
.st-crowd i:nth-child(odd) { animation-delay: .15s; height: 8cqh; }
@keyframes bob { to { transform: translateY(-1.5cqh); } }
.st-longbubble { position: absolute; top: 34cqh; left: 50%; transform: translateX(-50%); display: flex; gap: 0; width: 88cqw; }
.st-longbubble span { flex: 1; padding: 2.4cqw 0; background: #fff; color: #1b1033; font-family: 'Noto Sans KR', sans-serif; font-size: 2.6cqw; font-weight: 800; text-align: center; overflow: hidden; white-space: nowrap; }
.st-longbubble span:first-child { border-radius: 3cqw 0 0 3cqw; }
.st-longbubble span:last-child { border-radius: 0 3cqw 3cqw 0; }
.st-longbubble span.cut { border-left: .6cqw solid #ff3355; }
.st-paper { position: absolute; top: 12cqh; left: 50%; width: 62cqw; transform: translateX(-50%); height: 0; overflow: hidden; background: #fff8e1; border-radius: 1cqw; box-shadow: 0 0 0 1cqw #d9b77a; z-index: 1; }
.st-paper p { margin: 4cqw; display: grid; gap: 2cqw; }
.st-paper i { display: block; height: 1.4cqw; background: #8a7350; border-radius: 1cqw; opacity: .5; }
.st-water { position: absolute; left: 0; right: 0; bottom: 0; height: 0; background: linear-gradient(rgb(90 180 255 / .75), rgb(30 100 220 / .85)); border-top: 1cqw solid rgb(200 235 255 / .9); }
.st.speed::before { content: ''; position: absolute; inset: 0; z-index: 4; background: repeating-linear-gradient(0deg, transparent 0 3cqh, rgb(255 255 255 / .25) 3cqh 3.3cqh); animation: speed .1s infinite linear; }
@keyframes speed { to { transform: translateX(10cqw); } }

.st-flash { position: absolute; inset: 0; z-index: 8; opacity: 0; pointer-events: none; }
.st-curtain { position: absolute; top: 0; bottom: 0; width: 51%; z-index: 9; background: repeating-linear-gradient(90deg, #8f0d1f 0 4cqw, #b3172b 4cqw 7cqw, #7a0a1a 7cqw 9cqw); box-shadow: inset 0 -6cqh 6cqh rgb(0 0 0 / .4); }
.st-curtain { transition: transform .9s cubic-bezier(.6,0,.3,1); }
.st-curtain.l { left: 0; border-right: 1cqw solid #ffcc33; }
.st.open .st-curtain.l { transform: translateX(-92%); }
.st.open .st-curtain.r { transform: translateX(92%); }
.st-curtain.r { right: 0; border-left: 1cqw solid #ffcc33; }
.st-start { position: absolute; inset: 0; z-index: 10; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3cqw; text-align: center; cursor: default; }
.st-start-title { font-size: 7cqw; font-weight: 900; line-height: 1.25; text-shadow: 0 1cqw 0 #3a0010; padding: 4cqw 6cqw; border-radius: 4cqw; background: rgb(40 0 10 / .55); border: .8cqw solid #ffcc33; }
.st-start-title span { display: block; font-size: 14cqw; }
.st-start-title b { color: #ffe066; font-size: 1.2em; }
.st-start p { margin: 0; font-size: 4cqw; text-shadow: 0 .5cqw 0 #000; }
.st-start small { font-family: 'Noto Sans KR', sans-serif; font-size: 3.2cqw; opacity: .85; text-shadow: 0 .4cqw 0 #000; }
.st-go { border: 0; cursor: pointer; padding: 3.2cqw 9cqw; border-radius: 99cqw; background: linear-gradient(#ffe066, #ffb300); color: #4a1d00; font: 900 5.4cqw 'Black Han Sans', 'Noto Sans KR', sans-serif; box-shadow: 0 1.4cqw 0 #a65f00; animation: pulse 1s infinite alternate; }
.st-hint { position: absolute; bottom: 2.5cqh; left: 50%; transform: translateX(-50%); z-index: 6; font-family: 'Noto Sans KR', sans-serif; font-size: 3cqw; color: rgb(255 255 255 / .6); }
.st-mute { position: absolute; right: 2.5cqw; bottom: 2.5cqw; z-index: 11; width: 9cqw; height: 9cqw; border-radius: 50%; border: 0; background: rgb(0 0 0 / .45); font-size: 4.6cqw; cursor: pointer; }
@keyframes pulse { to { transform: scale(1.06); } }

/* 내비게이션 */
.aw-nav { display: grid; grid-template-columns: auto 1fr auto auto; gap: 6px; align-items: center; }
.aw-nav button { border: 1px solid var(--line); background: var(--surface); border-radius: 12px; padding: 10px 12px; cursor: pointer; font-weight: 700; }
.aw-nav button:disabled { opacity: .35; cursor: default; }
.aw-next { background: var(--brand) !important; color: var(--brand-ink); border: 0 !important; }
.aw-next.pulse { animation: pulse .6s infinite alternate; }
.aw-progress { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; justify-content: center; }
.aw-progress button { padding: 4px !important; border: 0 !important; background: none !important; font-size: 16px; opacity: .3; filter: grayscale(1); }
.aw-progress button.done { opacity: .75; filter: none; }
.aw-progress button.on { opacity: 1; filter: none; transform: scale(1.25); }

/* 상세 카드 (상장) */
.aw-detail { display: grid; gap: 10px; }
.awc {
  position: relative; padding: 22px 20px 18px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line);
  box-shadow: var(--shadow); overflow: hidden;
}
.awc::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--c, #ffb300); }
.awc-head { display: flex; gap: 12px; align-items: center; }
.awc-emoji.photo { position: relative; background: center / cover no-repeat; }
.awc-emoji.photo span { position: absolute; right: -8px; bottom: -8px; font-size: 26px; }
.awc-emoji { font-size: 40px; width: 60px; height: 60px; display: grid; place-items: center; border-radius: 18px; background: var(--surface-2); flex: none; }
.awc-title { font-size: 14px; font-weight: 800; color: var(--text-2); }
.awc-winner { font-size: 26px; font-weight: 900; letter-spacing: -.02em; line-height: 1.2; }
.awc-headline { margin-top: 16px; font-size: 30px; font-weight: 900; letter-spacing: -.03em; line-height: 1.2; }
.awc-sub { color: var(--text-2); font-size: 14px; margin-top: 4px; }
.awc-roast { margin: 14px 0 0; padding: 12px 14px; border-radius: 14px; background: var(--surface-2); font-size: 15px; }
.awc-sec { margin: 18px 0 8px; font-size: 13px; font-weight: 800; color: var(--text-2); }
.awc-chat { display: grid; gap: 6px; }
.awc-bubble { justify-self: start; max-width: 94%; padding: 8px 12px; border-radius: 4px 16px 16px 16px; background: var(--surface-2); font-size: 14.5px; white-space: pre-line; }
.awc-chat.chain .awc-bubble { padding: 5px 11px; }
.awc-chat.chain .awc-meta { display: none; }
.awc-chat.chain .awc-bubble:first-child .awc-meta { display: block; }
.awc-meta { display: block; font-size: 11.5px; font-weight: 700; color: var(--muted); margin-bottom: 2px; }
.awc-bubble em { display: block; font-style: normal; font-size: 12px; color: var(--series-2); font-weight: 700; margin-top: 3px; }
.censor { background: var(--text); color: var(--text); border-radius: 3px; padding: 0 2px; }
.awc-noms { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.awc-noms li { display: flex; justify-content: space-between; padding: 8px 12px; border-radius: 12px; background: var(--surface-2); font-size: 14px; }
.awc-noms li.gold { background: color-mix(in srgb, #ffcc00 22%, var(--surface)); font-weight: 800; }
.awc-speech { margin: 0; padding: 12px 14px; border-left: 4px solid var(--c, #ffb300); background: var(--surface-2); border-radius: 0 14px 14px 0; font-size: 15px; font-weight: 600; }
.awc-foot { margin-top: 16px; text-align: right; font-size: 11px; color: var(--muted); }
.awc-list { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 6px; }
.awc-list li { display: flex; justify-content: space-between; gap: 8px; padding: 9px 12px; border-radius: 12px; background: var(--surface-2); font-size: 14.5px; }
.awc-restart { margin-top: 2px; }