.replay-workspace{margin-top:24px;min-width:0}.replay-upload{padding:22px 28px;margin-bottom:18px}.replay-upload h2{margin:0 0 14px}.replay-upload .dropzone[aria-disabled="true"]{cursor:progress}.replay-screen{position:relative;container-type:inline-size;aspect-ratio:16/9;overflow:hidden;border:1px solid #4b3c61;border-radius:20px;background:radial-gradient(ellipse at 50% 80%,#30203f,#100d19 70%);display:grid;place-items:center}.replay-screen video{width:100%;height:100%;object-fit:contain}.replay-media-status{max-width:540px;padding:28px;text-align:center;color:#c5b8d5;font-size:15px;line-height:1.7}.replay-media-status strong{display:block;color:#f1e6fc;font-size:23px;margin-bottom:12px}#rp-match-overlay{position:absolute;left:20px;right:20px;top:18px;display:flex;justify-content:space-between;gap:15px;color:#d8cff1;font-variant-numeric:tabular-nums}#rp-grade{font-weight:800;color:#f5b5ed}#rp-chart{position:absolute;bottom:20px;left:20px;right:20px;text-align:center;font-size:clamp(20px,3vw,38px);letter-spacing:8px;color:#b4f7ed}.replay-controls{display:flex;align-items:center;gap:14px;margin:18px 0}.replay-controls input{flex:1;min-width:30px;accent-color:#d59bef}.replay-controls select{width:76px;margin:0;padding:8px}.replay-controls #rp-time{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:13px}.replay-track{position:relative;height:108px;border:1px solid #594565;border-radius:12px;overflow:hidden;background:#2c1c38}#rp-zones{position:absolute;inset:20px 0}.replay-zone{position:absolute;top:0;bottom:0}.replay-ball{position:absolute;top:50%;width:15px;height:15px;border:2px solid #fff;background:#79e4ca;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 8px #7eeacc55}.replay-hit{position:absolute;bottom:0;color:#ff91df;transform:translateX(-50%);font-size:24px;line-height:25px}.replay-bottom{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:22px 4px}.replay-keyboard{display:flex;gap:clamp(30px,8vw,130px)}.replay-key-group{display:flex;flex-direction:column;align-items:center;gap:5px}.replay-key-row{display:flex;gap:5px}.replay-key{width:47px;height:47px;border:1px solid #705586;border-radius:9px;background:#171121;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#d7c8ee;transition:background .04s}.replay-key.active{background:#b47bd5;color:#fff;box-shadow:0 0 13px #a774c677}@media(max-width:640px){.replay-upload{padding:16px}.replay-bottom{flex-direction:column;align-items:flex-start}.replay-keyboard{justify-content:space-around;width:100%}.replay-key{width:40px;height:42px}.replay-controls{gap:7px}.replay-controls #rp-time{font-size:11px}.replay-media-status{font-size:12px;padding:16px}.replay-media-status strong{font-size:17px}.replay-track{height:90px}}

#rp-scene { position:absolute; inset:0; width:100%; height:100%; }

#rp-match-overlay { bottom:0; pointer-events:none; }
#rp-grade { position:absolute; left:0; right:0; bottom:90px; text-align:center; font-size:clamp(22px,3vw,38px); text-shadow:0 2px 8px #000; }
#rp-song { align-self:flex-start; }
#rp-audio-status { align-self:flex-start; margin-left:auto; font-size:12px; }

#rp-finish-bands{position:absolute;inset:20px 0;pointer-events:none}
.replay-finish-band{position:absolute;top:0;bottom:0;box-sizing:border-box;border:2px solid #fff;box-shadow:inset 0 0 0 1px #1e152a;background:#ffffff18}


.replay-live-score,.replay-game-hud{position:absolute;pointer-events:none}
.replay-live-score{top:5%;right:3%;font-size:clamp(21px,4vw,54px);font-weight:900;font-style:italic;color:#ffc56f;text-shadow:1px 2px #532900,0 0 5px #000;-webkit-text-stroke:1px #39220c}
.replay-standings{width:100%;display:grid;gap:.35cqw;margin-top:auto;flex:none}
.replay-rank{display:flex;justify-content:space-between;gap:.3cqw;padding:.45cqw .5cqw;border:1px solid #ffffff3d;background:#170f1bc7;font-size:clamp(7px,1.25cqw,14px)}
.replay-rank span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:pre}.replay-rank strong{color:#ffe38c}
.replay-game-hud{left:50%;top:49.5%;width:37%;transform:translateX(-50%);text-align:center}
#rp-grade{position:static;display:block;min-height:1.2em;margin:0 0 clamp(8px,3vw,28px);font-size:clamp(16px,3.4vw,42px);line-height:1.15;text-shadow:0 2px 2px #12151f,0 0 4px #111}
#rp-grade[data-grade="2"]{color:#9df967}#rp-grade[data-grade="1"],#rp-grade[data-grade="0"]{color:#ffe26b}#rp-grade[data-grade="3"]{color:#99f6ff}
.replay-game-line{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4%;margin-bottom:.55cqw}
#rp-level{font-size:clamp(9px,1.4vw,16px);font-weight:800;text-shadow:0 2px 3px #000}
.replay-game-beat{position:relative;width:49%;height:1.55cqw;border:1px solid #aa9ca9;border-radius:16px;background:#14121c;box-shadow:inset 0 1px 4px #000}
.replay-game-window{position:absolute;inset:1px 9% 1px 58%;border-radius:10px;background:linear-gradient(90deg,transparent,#65d6eebb 55%,transparent)}
#rp-game-ball{position:absolute;top:50%;width:1.25cqw;aspect-ratio:1;border:1px solid #fff;background:#f35239;box-shadow:0 0 3px #fff;border-radius:100%;transform:translate(-50%,-50%)}
#rp-chart{position:static;display:flex;align-items:center;justify-content:center;gap:3px;min-height:1.55em;border:2px solid #b6ac9cb0;border-radius:100px;background:#131019aa;padding:2px 6px;letter-spacing:normal;box-shadow:inset 0 0 4px #000}
.replay-step{display:grid;place-items:center;width:clamp(15px,3vw,37px);aspect-ratio:1;border-radius:50%;border:1px solid #c1ebfc;background:linear-gradient(#78baf1,#145692 58%,#153c75);color:#fff;text-shadow:0 1px 2px #1b3160;font:bold clamp(13px,2.4vw,28px)/1 sans-serif}
.replay-step.completed{border-color:#e4ffb7;background:linear-gradient(#c5eb74,#5a8d19 58%,#354c0e)}
#rp-sfx[aria-pressed="true"]{outline:1px solid #d8b5f1}
@media(max-width:640px){.replay-controls{flex-wrap:wrap}}

.replay-screen:is([data-stage="2"],[data-stage="7"]){aspect-ratio:4/3;max-width:1024px;margin-inline:auto}

/* Audition HUD sprites decoded from the installed ACV archives. */
#rp-player{--replay-scene-height:clamp(140px,54dvh,650px);scroll-margin-top:0}
#rp-player .replay-screen{width:min(100%,calc(var(--replay-scene-height)*16/9));margin-inline:auto}
#rp-player .replay-screen:is([data-stage="2"],[data-stage="7"]){width:min(100%,calc(var(--replay-scene-height)*4/3))}
#rp-player:fullscreen{--replay-scene-height:clamp(130px,65dvh,850px);padding:8px 14px;background:#141021;overflow:auto}
#rp-player .replay-controls{margin:7px 0;gap:7px}
#rp-player .replay-controls .button{padding:6px 10px;min-height:34px}
#rp-player .replay-track{height:72px}
#rp-player #rp-zones,#rp-player #rp-finish-bands{inset:8px 0 12px}
#rp-player .replay-ball{width:11px;height:11px;top:46%}
#rp-player .replay-hit{font-size:13px;line-height:13px}

#rp-player .replay-bottom{padding:4px 0;gap:12px;flex-direction:row;align-items:center}

#rp-player .replay-keyboard{gap:12px;width:auto;flex:none}
#rp-player .replay-key-group,#rp-player .replay-key-row{gap:4px}
#rp-player .replay-key{width:clamp(26px,13cqi,54px);height:auto;aspect-ratio:1;font-size:clamp(16px,6cqi,25px);line-height:1}

.replay-step{position:relative}
.replay-step img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.replay-step .note-hit{opacity:0}
.replay-step.completed .note-base{filter:hue-rotate(165deg) brightness(1.2)}
.replay-step.completed.note-4k .note-base{filter:hue-rotate(250deg) brightness(1.2)}
.replay-step.completed.hit-ready .note-base{visibility:hidden}
.replay-step.completed.hit-ready .note-hit{opacity:1}
.replay-step .note-press-frame{
 position:absolute;inset:-32.05%;pointer-events:none;
 background-repeat:no-repeat;background-size:800% 900%;
 background-position:var(--note-column,0%) var(--note-row);
}
.replay-step.completed.note-reverse .note-base{transform:rotate(180deg)}
.replay-step.completed.note-reverse .note-text{transform:none}
.replay-step .note-text{width:100%;height:100%;display:grid;place-items:center;border-radius:50%;font-size:.85em;color:#fff;background:linear-gradient(#65a8f6,#16569d)}
.replay-step.note-reverse .note-text{background:linear-gradient(#fa7879,#a31932)}
.replay-step.completed .note-text{background:linear-gradient(#ffc34d,#a94d0a);filter:none}
.replay-step.completed.note-4k .note-text{background:linear-gradient(#bde85e,#4d7e12);filter:none}
#rp-chart{border:0;background:url(/assets/replay-hud/key1.png) left center/50% 100% no-repeat,url(/assets/replay-hud/key2.png) right center/50% 100% no-repeat;box-shadow:none;min-height:0;padding:3px 7px}
.replay-step,.replay-step.completed{border:0;background:none;box-shadow:none;width:3.2cqw;flex-shrink:1}
.replay-game-beat{background:url(/assets/replay-hud/judge-slot.png) center/100% 100% no-repeat;border:0;box-shadow:none}
#rp-game-ball{background:url(/assets/replay-hud/ball.png) center/contain no-repeat;border:0;box-shadow:none}
#rp-level{display:flex;align-items:center;gap:3px}
#rp-level img{height:1.55cqw;width:auto}
#rp-grade{display:flex;align-items:center;justify-content:center;gap:2px;height:4.7cqw;min-height:0;margin:0 0 5.5cqw}
#rp-grade img{height:65%;width:auto;max-width:64%;object-fit:contain}
#rp-grade > img{height:100%}
.replay-grade-combo{position:relative;isolation:isolate;display:flex;align-items:flex-end;gap:2px;height:86%;align-self:flex-end;margin-bottom:2px}
#rp-grade .replay-grade-combo img{height:100%;max-width:none}
#rp-grade .replay-grade-combo .replay-combo-times{height:44%;align-self:center}
#rp-grade .replay-grade-combo .replay-combo-burst{position:absolute;right:0;top:50%;height:190%;transform:translate(38%,-50%);z-index:-1}
.replay-game-window{
 /* Native ghost target x=632, relative to the visible slot x=508. */
 inset:50% auto auto 70.06%;width:37.85%;height:50%;
 transform:translate(-50%,-50%);background:url(/assets/replay-hud/beat-pulse.png) center/100% 100% no-repeat
}
.replay-game-beat{overflow:hidden}
.replay-live-score{display:flex;align-items:flex-end;gap:1px}
.replay-live-score img{height:3.8cqw;width:auto}
.replay-live-score img[src$="comma.png"]{height:1.25cqw}
.replay-rank{background:#170f1bc7 url(/assets/replay-hud/score-lead.png) center/100% 100% no-repeat}
@media(max-width:640px){#rp-player{--replay-scene-height:48dvh}#rp-player .replay-controls{flex-wrap:nowrap}#rp-player .replay-controls select{width:48px}#rp-player .replay-controls .button{padding:5px 7px;font-size:11px}#rp-player .replay-bottom{gap:6px}#rp-player .replay-keyboard{gap:6px}}


.replay-rank strong{flex:none}
#rp-audio-status{position:absolute;left:0;top:18px;margin:0;font-size:10px}
#rp-player:not([hidden]){
 --replay-scene-height:clamp(140px,54dvh,650px);
 display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;
}
#rp-player:fullscreen:not([hidden]){
 --replay-scene-height:clamp(140px,calc(100dvh - 275px),850px);
 align-content:center;
}
#rp-player .replay-controls,
#rp-player .replay-inspector{width:min(100%,1024px)}
#rp-player .replay-inspector{
 display:grid;grid-template-columns:minmax(0,1fr);gap:6px;
 padding:12px clamp(10px,2vw,18px);
 background:#22192f;border:1px solid #4b3c61;border-radius:12px;
}
#rp-player .replay-track{height:52px}
#rp-player .replay-bottom{justify-content:center;padding:0}
#rp-player .replay-key{width:clamp(26px,7cqi,40px)}
#rp-player .replay-results{display:flex;justify-content:center;gap:18px;margin:0;padding:2px 0}
#rp-player .replay-key svg{width:58%;height:58%}
@media(max-height:760px){
 #rp-player:not([hidden]){--replay-scene-height:clamp(110px,calc(100dvh - 250px),48dvh)}
 #rp-player:fullscreen:not([hidden]){align-content:start}
 #rp-player .replay-key{width:clamp(26px,7cqi,32px)}
 #rp-player .replay-inspector{padding-block:8px}
 #rp-player .replay-track{height:40px}
}

#rp-chart:empty{visibility:hidden}
#rp-chance{position:absolute;top:100%;right:0;display:flex;align-items:center;justify-content:flex-end;gap:2px}
#rp-chance img{height:2.2cqw;width:auto;object-fit:contain}
#rp-chance img:last-child{height:1.65cqw}

.replay-inspector{container-type:inline-size}
.replay-results{color:#d8c8e5;font-size:clamp(15px,4.5cqi,19px);line-height:1.5}
.replay-results strong{color:#fff}

/* Scoreboard names use DotumChe in the original HUD. */
.replay-standings{
 font-family:DotumChe,Dotum,Arial,sans-serif;line-height:1.1
}
.replay-rank{
 position:relative;display:grid;grid-template-columns:3.35cqw minmax(0,1fr);
 grid-template-rows:1.35cqw 1.9cqw;align-items:center;justify-items:end;
 padding:0 .24cqw 0 0;gap:0;color:#d5d6e0;border:1px solid #8194b080;
 background:linear-gradient(#192536c9 40%,#101728d9 40%);
 text-shadow:0 1px 2px #000;min-height:0;
}
.replay-rank .replay-rank-portrait{
 grid-area:1/1/3/2;align-self:stretch;justify-self:stretch;
 border-right:1px solid #8194b080;background:#59718d47;
}
.replay-rank span{
 grid-area:1/2;max-width:100%;text-align:right;font-size:clamp(5px,1.03cqw,13px);
 font-weight:bold;line-height:1;
}
.replay-rank .replay-rank-score{grid-area:2/2}
.replay-rank-score,.replay-team-totals strong{display:flex;align-items:flex-end;gap:.05cqw}
.replay-rank-score img{height:clamp(7px,1.67cqw,20px);width:auto}
.replay-rank-score img[src$="comma.png"]{height:clamp(4px,1.03cqw,12px)}
.replay-rank-place{
 position:absolute;right:calc(100% + .5cqw);top:50%;transform:translateY(-50%);
 height:clamp(8px,2.15cqw,24px);width:auto
}
.replay-team-score{
 position:absolute;top:3%;left:50%;width:42%;transform:translateX(-50%);
 pointer-events:none;text-align:center
}
.replay-team-totals{
 display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.6cqw
}
.replay-team-totals > img{height:clamp(10px,2.7cqw,30px);width:auto}
.replay-team-totals strong img{height:clamp(13px,3.6cqw,40px);width:auto}
.replay-team-totals strong img[src$="comma.png"]{height:clamp(7px,1.8cqw,20px)}
.replay-team-red{justify-content:flex-end}
.replay-team-bar{
 display:grid;grid-template-columns:12% 1fr 12%;align-items:center;gap:1.2%;
 position:relative;height:3cqw;margin-top:.35cqw;padding:0 2.5%;
 background:url(/assets/replay-hud/fam-gauge-bar-11.png) left center/50% 100% no-repeat,
            url(/assets/replay-hud/fam-gauge-bar-12.png) right center/50% 100% no-repeat;
 font-size:1.77cqw;font-weight:900;line-height:1;text-shadow:0 1px 2px #161521;
}
#rp-fam-red-delta{color:#ffd0ca}
#rp-fam-blue-delta{color:#a6eaff}
.replay-fam-track{
 position:relative;height:.92cqw;border-radius:999px;
 background:linear-gradient(180deg,#ffffff80,transparent 50%),
   linear-gradient(90deg,#be0f19 var(--red-share,50%),#1c69c0 var(--red-share,50%));
 box-shadow:0 1px 2px #171018
}
.replay-fam-track::before,.replay-fam-track::after{
 content:'';position:absolute;width:1.25cqw;height:1.25cqw;top:50%;
 transform:translateY(-50%);background:center/contain no-repeat
}
.replay-fam-track::before{left:-.35cqw;background-image:url(/assets/replay-hud/fam-gauge-red-star.png)}
.replay-fam-track::after{right:-.35cqw;background-image:url(/assets/replay-hud/fam-gauge-blue-star.png)}
.replay-fam-track span{
 position:absolute;z-index:1;left:var(--red-share,50%);top:50%;
 width:1.9cqw;aspect-ratio:1;transform:translate(-50%,-50%);
 background:url(/assets/replay-hud/fam-gauge-center-ball.png) center/contain no-repeat
}
.replay-ace,.replay-countdown{
 position:absolute;pointer-events:none
}
.replay-ace{
 top:9%;width:13%;height:15%;
 background:center/100% 100% no-repeat;
 font:bold 1.07cqw/1 DotumChe,Dotum,Arial,sans-serif;color:#fff;
 text-shadow:0 1px 2px #141625
}
.replay-ace.red{left:13%;background-image:url(/assets/replay-hud/fam-team-bar-r.png)}
.replay-ace.blue{right:13%;background-image:url(/assets/replay-hud/fam-team-bar-b.png)}
/* The 134 x 123 sprite has three 107 x 9 tracks at y=33, 65 and 97. */
.replay-ace > div{position:absolute;left:9.7%;width:79.85%;height:26.02%;top:12.2%;text-align:center}
.replay-ace > div:nth-child(2){top:38.21%}
.replay-ace > div:nth-child(3){top:64.23%}
.replay-ace span{display:block;height:56.25%;align-content:center;overflow:hidden;text-overflow:ellipsis;white-space:pre}
.replay-ace i{
 position:absolute;left:0;top:56.25%;width:var(--ace-fill);height:28.125%;
 border-radius:999px;background:linear-gradient(#fff9,#e02b59 45%)
}
.replay-ace.blue i{background:linear-gradient(#fff9,#3896ee 45%)}
.replay-ace.red i.ace-leader{background:#f6ca32 url(/assets/replay-hud/fam-ace-leader-red.png) center/100% 100% no-repeat}
.replay-ace.blue i.ace-leader{background:#97ce17 url(/assets/replay-hud/fam-ace-leader-blue.png) center/100% 100% no-repeat}
.replay-right-hud{
 position:absolute;top:17%;right:1%;bottom:1.5%;width:clamp(55px,13.5cqw,160px);
 display:flex;flex-direction:column;gap:.8cqw;pointer-events:none
}
.replay-crazy-gauge{
 align-self:center;width:43%;height:46%;min-height:0;flex-shrink:1;
 display:grid;grid-template-rows:12% 74% 14%;place-items:center;
 background:url(/assets/replay-hud/crazy-gauge-bar.png) center/100% 100% no-repeat;
 font:bold italic 1.4cqw/1 Arial,sans-serif
}
.replay-crazy-level{color:#f348de;text-shadow:0 1px 2px #03020c}
.replay-crazy-bonus{align-self:start;color:#49bfff;text-shadow:0 1px 2px #03020c}
.replay-crazy-fill{
 display:grid;grid-template-rows:repeat(5,minmax(0,1fr));place-items:center;position:relative;width:65%;height:100%;overflow:hidden;
 background:url(/assets/replay-hud/crazy-gaugeline-b.png) center/100% 100% no-repeat
}
.replay-crazy-fill::before{
 content:'';position:absolute;inset:0;
 clip-path:inset(calc(100% - var(--crazy-progress,0%)) 0 0);
 background:url(/assets/replay-hud/crazy-gaugeline-y.png) center/100% 100% no-repeat
}
.replay-crazy-fill span{
 z-index:1;color:#16243a;
 font-size:2.4cqw;font-weight:900;
 text-shadow:0 1px 1px #ffea7f70
}
.replay-countdown{
 top:38%;left:50%;transform:translate(-50%,-50%);width:26%;z-index:2
}
.replay-countdown.count-number{width:9%}
.replay-countdown img{display:block;width:100%;height:auto}
#rp-level.special-move img{height:auto;width:12cqw;max-height:2.35cqw;object-fit:contain}
