:root{--red:#fa233b;--red-light:#fff1f3;--ink:#161618;--muted:#86868b;--line:#e7e7ec;--card-radius:12px;--gap:14px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:#f5f5f7;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #fa233b66;outline-offset:4px}[hidden]{display:none!important}svg{display:block}button{border:0}body:has(dialog[open]){overflow:hidden}
.workspace{min-height:100svh;display:grid;grid-template-columns:220px 430px;gap:76px;justify-content:center;align-items:start;padding:48px 30px 64px}.preview-tools{position:sticky;top:64px;padding-top:25px}.edition{display:flex;align-items:center;gap:8px;font-size:11px;color:#8b8b91;letter-spacing:1px}.edition i{width:6px;height:6px;border-radius:50%;background:var(--red)}.edition span{margin-left:auto;font-variant-numeric:tabular-nums}.preview-tools h1{font-size:30px;line-height:1.4;letter-spacing:-1px;margin:28px 0 10px;font-weight:650}.preview-tools>p{color:var(--muted);font-size:13px;line-height:1.9}.preview-tools nav{display:grid;gap:5px;margin-top:32px}.preview-tools nav button{display:flex;align-items:center;gap:16px;padding:14px;border-radius:10px;background:transparent;text-align:left;font-size:13px;color:#77777e}.preview-tools nav button.active{background:#fff;color:var(--ink);box-shadow:0 4px 14px #24242b04}.preview-tools nav span{font-size:10px;color:#aaaab1;font-variant-numeric:tabular-nums}.preview-tools nav b{font-weight:400;margin-left:auto;color:#b4b4bb}.preview-tools nav .active b{color:var(--red)}.preview-note{border-top:1px solid #dedee5;padding-top:22px;margin-top:28px;font-size:11px!important;line-height:1.9!important}.reset-preview{padding:7px 0;background:none;font-size:11px;color:#8d8d95}.round-control{margin:22px 0 0}.round-control label{display:block;font-size:11px;color:var(--muted);margin:0 0 10px}.round-control select{width:100%;background:#fff;border:1px solid var(--line);padding:10px;border-radius:8px;color:#5f5f66;font-size:12px}
.app-shell{width:430px;min-height:830px;background:#fff;border:1px solid #ededf1;box-shadow:0 16px 50px #26263b09;border-radius:28px;position:relative;overflow:clip}.app-header{height:74px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{font-weight:650;font-size:16px;letter-spacing:-.3px;white-space:nowrap}.icon-button{width:30px;height:36px;display:grid;place-items:center;background:transparent;border-radius:6px;padding:4px;font-size:25px}.icon-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.app-header .icon-button:last-child{color:#9999a2}body[data-view=home] #back{visibility:hidden;width:0;padding:0}body[data-view=home] .brand{margin-right:auto}
.screen{padding:0 24px 28px;animation:appear .2s ease}.progress{height:4px;background:#eeeef2;border-radius:4px;overflow:hidden;margin:0 2px}.progress i{display:block;height:100%;background:var(--red);border-radius:inherit;transition:width .3s}.match-heading{text-align:center;margin:28px 0 24px}.match-heading h2{font-size:29px;font-weight:700;letter-spacing:-.7px;margin:0;line-height:1.3}.set-label{display:block;margin-top:6px;font-size:20px;line-height:1.3;color:#86868b;font-weight:500}.match-heading p{font-size:14px;color:#9999a0;margin:8px 0 0;line-height:1.5}.song-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}.song-card{position:relative;display:block;width:100%;min-width:0;padding:0;background:#fff;text-align:left;border:1px solid #e0e0e6;border-radius:var(--card-radius);overflow:hidden;transition:box-shadow .15s,border-color .15s,transform .15s}.song-card:hover{box-shadow:0 4px 16px #21212808}.song-card:active{transform:scale(.985)}.song-card[aria-pressed=true]{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}.cover-wrap{display:block;aspect-ratio:1;width:100%;overflow:hidden;background:#f6f6f8}.cover-wrap img{width:100%;height:100%;object-fit:cover;display:block}.song-info{display:block;padding:11px 12px 13px;min-height:71px}.song-code{display:block;font-size:13px;line-height:1.35;color:#93939d;font-variant-numeric:tabular-nums}.song-title{display:block;font-size:17px;font-weight:650;letter-spacing:-.3px;line-height:1.4;margin-top:3px;overflow-wrap:anywhere}.check{position:absolute;top:9px;right:9px;width:28px;height:28px;display:grid;place-items:center;background:var(--red);border:1px solid #ffffff88;box-shadow:0 1px 5px #ff173b22;border-radius:50%;color:#fff;opacity:0;transform:scale(.85);transition:opacity .15s,transform .15s}.check svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.song-card[aria-pressed=true] .check{opacity:1;transform:scale(1)}.match-footer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);align-items:center;border-top:1px solid var(--line);padding-top:17px;margin-top:24px}.selection-count{font-size:14px;color:#86868b;white-space:nowrap}.selection-count b{font-size:23px;color:var(--red);font-weight:500;margin-left:9px;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.primary{min-height:50px;padding:0 17px;color:#fff;background:linear-gradient(115deg,#ff4867,#ff2048);border-radius:999px;font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:12px;transition:opacity .15s,transform .15s}.primary:hover{filter:brightness(.98)}.primary:active{transform:scale(.985)}.primary:disabled{opacity:.35}.primary svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.match-footer .primary{width:100%;font-size:14px;gap:9px;min-height:49px}.match-footer .primary svg{width:19px}.quiet-action{display:block;margin:16px auto 0;padding:6px 12px;background:none;color:#a1a1aa;font-size:11px}.battle-screen{min-height:750px;display:flex;flex-direction:column}.battle-screen .match-heading{margin-top:30px}.battle-screen .song-grid{margin-top:75px;margin-bottom:25px}.battle-screen .match-footer{margin-top:auto}.battle-screen .quiet-action{margin-top:12px}.battle-stage-picker{display:none}
.home-screen{padding-top:0}.album-wall{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;aspect-ratio:1.12;overflow:hidden;margin:0 -24px 25px;perspective:800px;background:#f2f2f5}.album-tile{position:relative;transform-style:preserve-3d;animation:album-flip 16s infinite;animation-delay:var(--delay)}.album-face{position:absolute;inset:0;backface-visibility:hidden}.album-face.back{transform:rotateY(180deg)}.album-face img{width:100%;height:100%;object-fit:cover;display:block}.album-wall:after{content:"";position:absolute;inset:0;box-shadow:inset 0 -14px 24px -20px #1a1a2a20;pointer-events:none}.home-title{font-size:29px;line-height:1.45;letter-spacing:-1.1px;font-weight:700;text-align:center;white-space:nowrap;margin:17px -7px 24px}.home-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 28px;text-align:center;align-items:center}.home-stats div+div{border-left:1px solid var(--line)}.home-stats b{font-size:24px;font-weight:600;letter-spacing:-.7px}.home-stats span{font-size:12px;color:#777781;margin-left:3px}.home-screen>.primary{width:100%;min-height:54px;font-size:17px}.friend-button{display:flex;align-items:center;justify-content:center;gap:9px;background:none;color:#8b8b95;font-size:14px;margin:15px auto 0;padding:12px 15px}.friend-button svg{height:15px;width:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.home-foot{font-size:10px;color:#b0b0b8;text-align:center;margin-top:17px;letter-spacing:.5px}
.champion-screen{text-align:center}.champion-screen>h2{font-size:29px;letter-spacing:-.7px;margin:25px 0 21px}.poster{padding:0 12px 20px}.champion-cover{width:272px;max-width:100%;aspect-ratio:1;object-fit:cover;display:block;margin:0 auto;border-radius:10px;box-shadow:0 5px 20px #2121280a}.poster h3{font-size:30px;letter-spacing:-.7px;margin:22px 0 7px;line-height:1.3}.champion-meta{font-size:13px;color:#96969f;margin:0}.winner-label{font-size:21px;color:var(--red);font-weight:650;display:flex;justify-content:center;gap:18px;align-items:center;margin:24px 0}.winner-label span{font-family:Georgia,serif;font-size:30px;font-weight:400;line-height:1;transform:rotate(-13deg)}.winner-label span:last-child{transform:rotate(13deg)}.review{border-top:1px solid var(--line);margin:0;padding:20px 0 12px;font-size:13px;line-height:1.8;color:#92929c}.report-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:25px 0 0}.secondary{border:1px solid #dedee5;background:#fff;color:#93939d;border-radius:999px;min-height:49px;font-size:14px;font-weight:550}.report-actions .primary{font-size:14px}.page-menu{position:absolute;top:62px;right:18px;z-index:4;background:#fffffff5;border:1px solid var(--line);border-radius:15px;box-shadow:0 12px 45px #1d1d3524;width:190px;padding:9px;backdrop-filter:blur(16px)}.menu-label{color:#9b9ba4;font-size:10px;padding:9px 12px}.page-menu button{width:100%;text-align:left;background:transparent;border-radius:8px;padding:12px;font-size:13px;display:flex;justify-content:space-between}.page-menu button:hover{background:#f5f5f8}.page-menu span{color:#aaa}.toast{position:fixed;z-index:10;bottom:24px;left:50%;transform:translateX(-50%);padding:13px 20px;border:1px solid #e7e7ec;background:#fffffff5;backdrop-filter:blur(16px);border-radius:14px;box-shadow:0 5px 30px #1d1d3520;font-size:13px;line-height:1.6;max-width:90vw;width:max-content}.dialog-top{display:flex;align-items:center;justify-content:space-between}.dialog-top h2{font-size:21px;margin:0}dialog{border:1px solid #e7e7ed;border-radius:21px;padding:26px;width:min(350px,calc(100% - 40px));color:var(--ink);box-shadow:0 20px 80px #1a1a3022}dialog::backdrop{background:#1a1a2c35;backdrop-filter:blur(4px)}dialog p{font-size:13px;line-height:1.9;color:var(--muted);margin:18px 0 25px}dialog .primary{width:100%;font-size:14px}
@keyframes album-flip{0%,22%{transform:rotateY(0)}27%,72%{transform:rotateY(180deg)}77%,100%{transform:rotateY(360deg)}}@keyframes appear{from{opacity:.5;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){:root{background:#fff}.workspace{display:block;padding:0}.preview-tools{display:none}.app-shell{width:min(100%,430px);border:0;border-radius:0;box-shadow:none;min-height:100svh;margin:0 auto}.app-header{height:68px}.screen{padding-bottom:max(28px,env(safe-area-inset-bottom))}.battle-screen{min-height:calc(100svh - 68px)}.home-title{font-size:28px}.home-foot{margin-bottom:15px}.champion-screen{padding-bottom:30px}.battle-stage-picker{display:block;margin:12px auto 0;background:none;border:0;color:#aaa;font-size:11px;padding:6px}.battle-screen .song-grid{margin-top:58px}.battle-screen .match-footer{margin-top:auto}.match-heading{margin-top:24px;margin-bottom:22px}.match-heading h2{font-size:27px}.song-title{font-size:17px}}
@media(max-width:360px){:root{--gap:12px}.app-header{padding:0 20px}.screen{padding-left:20px;padding-right:20px}.album-wall{margin-left:-20px;margin-right:-20px}.brand{font-size:15px}.song-info{padding:9px 10px 11px;min-height:65px}.song-title{font-size:16px}.song-code{font-size:12px}.home-title{font-size:24px}.match-heading{margin:20px 0}.match-heading h2{font-size:25px}.match-footer .primary{font-size:13px;padding:0 11px}.selection-count b{font-size:21px}.champion-cover{width:245px}.home-stats span{font-size:11px}.home-stats b{font-size:22px}.battle-screen .song-grid{margin-top:44px}.champion-screen>h2{margin-top:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Match the button to the cover itself, excluding the card border. */
.match-footer .primary{width:calc(100% - 2px);justify-self:end}

/* Home revision: artwork runs all the way to the top; title below the wall. */
body[data-view=home] .app-header{position:absolute;top:10px;right:12px;width:36px;height:36px;padding:0;z-index:3;justify-content:flex-end}
body[data-view=home] .app-header .brand,body[data-view=home] #back{display:none}
body[data-view=home] .app-header #menu{width:34px;height:34px;background:#ffffffcc;backdrop-filter:blur(12px);border:1px solid #ffffff88;border-radius:50%;color:#65656e}
.home-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.home-stats b{font-size:23px}.home-stats span{font-size:11px;margin-left:3px}
@media(max-width:360px){.home-stats b{font-size:21px}.home-stats span{font-size:10px;margin-left:2px}}
.album-wall{aspect-ratio:1;grid-template-rows:repeat(5,minmax(0,1fr));gap:0;background:#d5d5d9}
.album-tile{aspect-ratio:1;min-width:0;min-height:0}
.album-face{overflow:hidden}
.album-face img{transform:scale(var(--art-scale,1));transform-origin:center;object-fit:cover}

/* Home identity and introduction supplied by the user. */
.home-branding{text-align:center;margin:26px 0 21px}
.home-eyebrow{font-size:9px;line-height:1.5;letter-spacing:1.5px;font-weight:550;color:#9c9ca5;margin:0 0 9px}
.home-wordmark{font-size:40px;line-height:1.1;font-weight:750;letter-spacing:-1.4px;margin:0}
.home-wordmark span{display:block;font-size:25px;line-height:1.45;font-weight:650;letter-spacing:1px;margin-top:6px}
.home-branding .home-title{display:inline-block;font-size:12px;line-height:1.5;letter-spacing:.3px;font-weight:500;color:#8c8c96;background:#f4f4f7;border-radius:99px;padding:5px 13px;margin:9px 0 0;white-space:normal}
.home-introduction{text-align:center;border-top:1px solid var(--line);padding-top:19px;margin:0 0 25px}
.home-introduction h2{font-size:17px;line-height:1.6;letter-spacing:-.4px;font-weight:650;margin:0}
.home-introduction p{font-size:12px;line-height:1.8;color:#9696a0;letter-spacing:.2px;margin:8px 0 0}
@media(max-width:360px){.home-wordmark{font-size:35px}.home-wordmark span{font-size:23px}.home-eyebrow{font-size:8px;letter-spacing:1px}.home-introduction h2{font-size:15px}.home-introduction p{font-size:11px}}
/* Chosen homepage: centered brand identity with a custom poster wordmark. */
.brand-home-identity{margin:27px 0 25px;text-align:center}
.brand-home-identity h1{margin:0 0 9px;font-size:14px;line-height:1.5;font-weight:550;letter-spacing:2px;color:#777781}
.soda-wordmark{display:block;width:100%;height:auto;overflow:visible}
.brand-home-stats{margin-bottom:25px}
.home-stats .stat-value{display:inline-block;line-height:1;height:1em;vertical-align:-3px;letter-spacing:0;font-variant-numeric:tabular-nums}
.stat-value>span{display:inline-flex;gap:0;font:inherit;color:inherit;margin:0}
.home-stats .digit-window{display:block;margin:0;width:.62em;height:1em;overflow:hidden;font:inherit;color:inherit}
.home-stats .digit-reel{display:block;margin:0;line-height:1;font:inherit;color:inherit;transform:translate3d(0,var(--roll-end),0)}
.digit-reel i{display:block;height:1em;line-height:1;font-style:normal;font-weight:inherit}
.digit-reel.is-rolling{animation:home-stat-roll 2s cubic-bezier(.12,.65,.24,1) both}
@keyframes home-stat-roll{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,var(--roll-end),0)}}
.brand-home-footer{margin:21px 0 0;font-size:11px;line-height:1.85;color:#a0a0aa;letter-spacing:.3px}
@media(max-width:360px){.brand-home-identity{margin:24px 0 23px}.brand-home-identity h1{font-size:12px;letter-spacing:1.5px}.brand-home-footer{font-size:10px}}

.brand-home-slogan{margin:4px 0 0;font-size:11px;line-height:1.8;letter-spacing:0;color:#a0a0aa;white-space:nowrap}
@media(max-width:360px){.brand-home-slogan{font-size:10px}}

/* Slogan follows the four statistics, before the start button. */
.brand-home-stats{margin-bottom:0}
.brand-home-slogan{margin:12px 0 22px;text-align:center}

/* Show four full rows plus the bottom half of the first row. */
.album-wall-viewport{position:relative;aspect-ratio:10/9;overflow:hidden;margin:0 -24px 25px;background:#d5d5d9}
.album-wall-viewport .album-wall{width:100%;aspect-ratio:1;margin:0;transform:translateY(-10%)}
@media(max-width:360px){.album-wall-viewport{margin-left:-20px;margin-right:-20px}}
/* Stage pages: a centered two-line identity and a quieter, inset card grid. */
body:not([data-view=home]) .app-header{display:grid;grid-template-columns:30px minmax(0,1fr) 30px;height:86px}
body:not([data-view=home]) .brand{display:flex;flex-direction:column;align-items:center;justify-self:center;gap:4px;letter-spacing:0}
body:not([data-view=home]) .brand .soda-wordmark{width:122px;height:auto}
.brand-subtitle{font-size:10px;line-height:1.5;font-weight:500;letter-spacing:.6px;color:#777781}
.match-heading,.battle-screen .match-heading{text-align:left;margin:25px 8px 24px}
.match-heading h2{font-size:31px;letter-spacing:-.7px}
.match-heading p{font-size:13px;line-height:1.6;margin-top:7px}
.group-screen .song-grid,.battle-screen .song-grid,.group-screen .match-footer,.battle-screen .match-footer{margin-left:8px;margin-right:8px}
@media(max-width:760px){.battle-screen{min-height:calc(100svh - 86px)}}
@media(max-width:360px){.match-heading h2{font-size:28px}.match-heading p{font-size:12px}}

/* The Chinese subtitle determines the header identity width. */
body:not([data-view=home]) .brand{position:relative;display:block;width:max-content;padding-top:22px;text-align:center}
body:not([data-view=home]) .brand .soda-wordmark{position:absolute;top:0;left:0;width:100%;height:auto}
body:not([data-view=home]) .brand-subtitle{display:block}

/* Stage identity: horizontal wordmark, divider, and full Chinese name. */
body:not([data-view=home]) .brand{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:9px;padding:0;width:max-content}
body:not([data-view=home]) .brand .soda-wordmark{position:static;width:82px;height:auto;flex:0 0 82px}
body:not([data-view=home]) .brand-subtitle{display:flex;align-items:center;gap:9px;font-size:11px;letter-spacing:0;line-height:1.5}
body:not([data-view=home]) .brand-subtitle:before{content:"";width:1px;height:13px;background:#d4d4dc;flex:0 0 1px}
@media(max-width:360px){body:not([data-view=home]) .brand{gap:7px}body:not([data-view=home]) .brand .soda-wordmark{width:74px;flex-basis:74px}body:not([data-view=home]) .brand-subtitle{font-size:10px;gap:7px}}

/* Tighten card metadata without resizing the square artwork. */
.song-info{padding:7px 10px 8px;min-height:0}
.song-code{line-height:1.25}
.song-title{line-height:1.3;margin-top:2px}
body:not([data-view=home]) .brand-subtitle{font-weight:700}

/* One step larger stage branding, keeping its horizontal arrangement. */
body:not([data-view=home]) .brand .soda-wordmark{width:90px;flex-basis:90px}
body:not([data-view=home]) .brand-subtitle{font-size:12px}
@media(max-width:360px){body:not([data-view=home]) .brand .soda-wordmark{width:82px;flex-basis:82px}body:not([data-view=home]) .brand-subtitle{font-size:11px}}

.selection-count b{font-size:inherit;letter-spacing:0}

/* Final-only study: two albums share a cinematic, color-lit stage. */
body[data-final=true] .app-shell{background:#101014;border-color:#26262e;box-shadow:0 22px 75px #17172226}
body[data-final=true] .app-header{position:relative;z-index:2}
body[data-final=true] .app-header .icon-button{color:#d9d7dc}
body[data-final=true] .brand-subtitle{color:#e4e0e4}
body[data-final=true] .brand-subtitle:before{background:#ffffff30}
.final-screen{min-height:744px;position:static;color:#f8f6f3;animation:none}
.final-screen>*:not(.final-backdrop){position:relative;z-index:1}
.final-backdrop{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#101014}
.final-backdrop>img{position:absolute;top:0;width:90%;height:88%;object-fit:cover;filter:blur(55px) saturate(.95) brightness(.65);opacity:.6;transition:opacity .7s ease;animation:final-ambient 22s ease-in-out infinite alternate}
.final-glow-left{left:-33%;transform:rotate(-12deg) scale(1.12)}
.final-glow-right{right:-33%;transform:rotate(12deg) scale(1.12);animation-delay:-11s!important}
.final-backdrop[data-focus=left] .final-glow-left,.final-backdrop[data-focus=right] .final-glow-right{opacity:.95}
.final-backdrop[data-focus=left] .final-glow-right,.final-backdrop[data-focus=right] .final-glow-left{opacity:.23}
.final-shade{position:absolute;inset:0;background:linear-gradient(180deg,#10101466 0%,#10101430 35%,#10101488 70%,#101014 100%),linear-gradient(90deg,transparent 30%,#10101466 50%,transparent 70%)}
.final-center-line{position:absolute;left:50%;width:1px;top:25%;bottom:18%;background:linear-gradient(180deg,transparent,#ffffff14,transparent)}
.final-screen .progress{background:#ffffff10}
.final-screen .progress i{background:linear-gradient(90deg,#ff264c,#ffa5ad);box-shadow:0 0 12px #ff426155}
.final-screen .match-heading{margin:30px 8px 0;isolation:isolate}
.final-screen .match-heading h2{font-size:36px;line-height:1.3;letter-spacing:1px;color:#fff8f3}
.final-screen .match-heading p{color:#b5aeb6;font-size:12px;letter-spacing:.3px;margin-top:9px}
.final-watermark{position:absolute;right:-4px;top:-7px;z-index:-1;font-family:Impact,"Arial Black",sans-serif;font-size:88px;letter-spacing:-2px;line-height:1;color:#ffffff05;pointer-events:none}
.final-duel{flex:1;display:flex;flex-direction:column;justify-content:center;margin:22px 8px 40px}
.final-versus{display:flex;align-items:center;justify-content:center;gap:13px;margin:0 0 22px;font-size:10px;line-height:1;font-weight:500;font-style:italic;letter-spacing:2px;color:#c3b8bd}
.final-versus span{width:32px;height:1px;background:linear-gradient(90deg,transparent,#ffffff38)}
.final-versus span:last-child{transform:rotate(180deg)}
.final-screen .song-grid{width:100%;margin:0}
.final-screen .song-card{background:transparent;border-color:transparent;overflow:visible;box-shadow:none;color:#f8f6f3;transition:opacity .5s,filter .5s,transform .2s}
.final-screen .song-card[aria-pressed=true]{border-color:transparent;box-shadow:none}
.final-screen .cover-wrap{border-radius:10px;background:#1b1a20;box-shadow:0 18px 38px #00000060,0 0 0 1px #ffffff20;transition:box-shadow .5s}
.final-screen .song-card[aria-pressed=true] .cover-wrap{box-shadow:0 0 0 2px #ff4665,0 0 35px #ff31552b,0 20px 40px #00000070}
.final-duel.has-choice .song-card[aria-pressed=false]{opacity:.53;filter:saturate(.6)}
.final-screen .song-info{text-align:center;padding:13px 2px 0;min-height:64px}
.final-screen .song-code{font-size:11px;color:#b7aeb6;letter-spacing:1px;line-height:1.3}
.final-screen .song-title{font-size:18px;line-height:1.35;font-weight:600;letter-spacing:-.3px;margin-top:5px;color:#fff7f4}
.final-screen .check{top:8px;right:8px;width:25px;height:25px;box-shadow:0 2px 12px #00000040}
.final-screen .match-footer{margin-top:auto;border-color:#ffffff18;padding-top:20px}
.final-screen .selection-count{color:#b8b0b9}
.final-screen .selection-count b{color:#ff8798}
.final-screen .primary{background:linear-gradient(110deg,#ff4c68,#fa2347);box-shadow:0 7px 28px #ff24482b}
.final-screen .primary:disabled{background:#ffffff12;box-shadow:none;color:#b4aeb6;opacity:.6}
body[data-final=true] .page-menu{background:#24222bf5;border-color:#ffffff20;color:#f2edf2}
body[data-final=true] .page-menu button:hover{background:#ffffff0b}
@keyframes final-ambient{from{translate:0 -1.5%}to{translate:0 2.5%}}
@media(max-width:760px){.final-screen{min-height:calc(100svh - 86px)}}
@media(max-width:360px){.final-screen .match-heading h2{font-size:32px}.final-screen .match-heading p{font-size:11px}.final-watermark{font-size:76px}.final-screen .song-title{font-size:16px}.final-screen .song-info{min-height:60px}.final-versus{margin-bottom:18px}}

/* The first three stages use the same compact 4-song layout. */
.battle-screen.quad-screen{display:block;min-height:0}
.battle-screen.quad-screen .song-grid{margin-top:0;margin-bottom:0}
.battle-screen.quad-screen .match-footer{margin-top:24px}
.progress i.set-progress-moving{animation:set-progress-step .4s ease-out both}
@keyframes set-progress-step{from{width:var(--set-progress-from)}to{width:var(--set-progress-to)}}

/* Final entrance: overlapping title, then covers, then song information. */
.final-screen .final-heading{display:grid;place-items:center;position:relative;height:132px;margin:25px 8px 0;text-align:center;isolation:isolate}
.final-heading .final-watermark{position:absolute;left:50%;top:50%;right:auto;transform:translate(-50%,-50%);z-index:0;font-size:100px;line-height:1;letter-spacing:7px;white-space:nowrap;color:#e9e0dd;opacity:.14;width:max-content}
.final-screen .final-heading h2{position:relative;z-index:1;font-family:"Kaiti SC","STKaiti","KaiTi","Songti SC",serif;font-size:100px;line-height:1;font-weight:900;letter-spacing:10px;text-indent:10px;transform:skewX(-5deg);color:#fff5e9;text-shadow:0 5px 30px #00000040;margin:0}
.final-screen .song-card:nth-child(1) .cover-wrap{animation:final-album-left .9s cubic-bezier(.16,1,.3,1) both}
.final-screen .song-card:nth-child(2) .cover-wrap{animation:final-album-right .9s cubic-bezier(.16,1,.3,1) both}
.final-screen .song-info,.final-screen .final-versus{animation:final-song-emerge .55s ease-out .95s both}
@keyframes final-album-left{from{opacity:0;transform:translate3d(calc(-100% - 56px),0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes final-album-right{from{opacity:0;transform:translate3d(calc(100% + 56px),0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes final-song-emerge{from{opacity:0;transform:translate3d(0,7px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(max-width:360px){.final-screen .final-heading{height:116px;margin-top:22px}.final-heading .final-watermark,.final-screen .final-heading h2{font-size:84px}}

/* Chinese identities share the SODA CUP poster treatment. */
.stage-cn-wordmark{display:block;width:108px;height:auto;overflow:visible}
.final-screen .final-heading h2{display:flex;align-items:center;justify-content:center;font-size:0;letter-spacing:0;text-indent:0;transform:none;text-shadow:none;line-height:1}
.final-cn-wordmark{display:block;width:250px;height:auto;overflow:visible;filter:drop-shadow(0 5px 15px #00000035)}
@media(max-width:360px){.stage-cn-wordmark{width:98px}.final-cn-wordmark{width:216px}}

/* Equal scale for both header identities. */
body:not([data-view=home]) .brand .soda-wordmark,body:not([data-view=home]) .brand .stage-cn-wordmark{width:auto;height:18px;flex:0 0 auto}
.final-title-artwork{display:block;width:280px;max-width:100%;height:auto;overflow:hidden}
.final-light-band{animation:final-title-light 1.5s cubic-bezier(.4,0,.3,1) .25s both}
@keyframes final-title-light{0%{transform:translateX(0);opacity:0}8%{opacity:1}92%{opacity:1}100%{transform:translateX(430px);opacity:0}}
@media(max-width:360px){body:not([data-view=home]) .brand .soda-wordmark,body:not([data-view=home]) .brand .stage-cn-wordmark{height:15px}.final-title-artwork{width:250px}}

/* Center the song choices themselves, independently of the VS label. */
.final-duel{display:flex;justify-content:center;align-items:center;margin:0 8px}
.final-matchup{position:relative;width:100%}
.final-matchup .final-versus{position:absolute;left:0;right:0;bottom:calc(100% + 22px);margin:0}
.brand-home-identity h1{display:flex;align-items:center;justify-content:center;font-size:18px;line-height:1;letter-spacing:0}
.home-cn-wordmark{display:block;height:1.222222em;width:auto;overflow:visible}
@media(max-width:360px){.brand-home-identity h1{font-size:16px}.final-matchup .final-versus{bottom:calc(100% + 18px)}}

/* Final-only requested controls; retain the previous visual design and song center. */
.final-screen{padding-bottom:98px}
.final-actions{position:absolute;left:0;right:0;top:calc(100% + 28px);display:flex;justify-content:center}
.final-actions .primary{width:calc((100% - var(--gap))/2 - 2px);min-height:49px;font-size:14px;padding:0 12px}
@media(max-width:760px){.final-screen{padding-bottom:calc(max(28px,env(safe-area-inset-bottom)) + 70px)}}

/* Requested homepage type adjustment: Chinese +4px, English rendered type -8px. */
.brand-home-identity h1{font-size:22px}
.brand-home-identity>.soda-wordmark{width:calc(100% - 44.444444px);margin-left:auto;margin-right:auto}
@media(max-width:360px){.brand-home-identity h1{font-size:20px}}

/* Remove source-image framing within song choices while preserving square proportions. */
.song-card .cover-wrap img{transform:scale(var(--song-cover-scale,1));transform-origin:center;border:0;padding:0}

/* Playable draft: the original layout now carries an actual tournament. */
.tournament-sidebar nav button:disabled{opacity:.36;cursor:default}
.tournament-sidebar nav button b{font-size:11px;white-space:nowrap}
.tournament-sidebar .preview-note{line-height:1.85!important}
.resume-status{text-align:center;color:#9b959b;font-size:11px;margin:10px 0 0}
.home-screen .friend-button{margin-top:10px;margin-bottom:0}
.home-screen .quiet-action{margin-top:0;padding-top:0}
.save-status{text-align:center;font-size:10px;letter-spacing:.1px;color:#b1aab0;margin:12px 0 0}
.previous-set{display:block;margin:14px auto 0;background:none;color:#a39ba2;font-size:11px;padding:7px 14px}
.previous-set:disabled{opacity:.3;cursor:default}
.quad-screen .save-status,.group-screen .save-status{margin-top:1px}
.selection-count,.selection-count b{font-size:14px}
.selection-count b{font-weight:600;letter-spacing:0;margin-left:7px}
.duel-layout{position:relative;margin:auto 0;isolation:isolate}
.duel-layout .song-grid{margin-top:20px;margin-bottom:25px}
.duel-screen>.match-footer{margin-top:24px}
.duel-screen .save-status{margin-top:2px}
.final-screen .save-status{position:absolute!important;bottom:15px;left:0;right:0;color:#aaa0ab;font-size:9px}
.final-screen .final-duel{margin-top:18px}
.cover-wrap{position:relative}
.card-aura{position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:0}
.form-error:empty{display:none}.form-error{color:#da2548!important;margin:10px 0!important;line-height:1.5!important}
.field-label{font-size:11px;color:#8d858d;display:block;margin-bottom:8px}
textarea{width:100%;resize:vertical;min-height:96px;border:1px solid #ddd7dd;border-radius:11px;background:#faf8fa;color:#272127;font:12px/1.6 ui-monospace,monospace;padding:12px;margin:0 0 16px}
textarea:focus{outline:2px solid #fa233b66;outline-offset:1px}
.replace-note{font-size:11px!important;margin:0 0 15px!important;line-height:1.6!important}
.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dialog-actions .primary,.dialog-actions .secondary{width:auto;font-size:13px;padding:0 12px}
.tension-vs{position:absolute;left:0;right:0;top:-17px;text-align:center;font-family:Impact,"Arial Black",sans-serif;font-size:13px;letter-spacing:3px;color:#c2b7bd;font-style:italic}
/* Quarterfinal: precise red accents and a more decisive selection. */
.quarter-screen .match-heading h2{display:inline-block;position:relative}
.quarter-screen .match-heading h2:after{content:"";display:block;width:31px;height:3px;background:#fa233b;margin-top:11px;animation:quarter-mark .65s ease-out both}
.quarter-screen .song-card{transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s,box-shadow .35s}
.quarter-screen .song-card .cover-wrap:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#ffffff66 50%,transparent 65%);transform:translateX(-150%);animation:quarter-glint 1.2s ease .2s both;pointer-events:none}
.quarter-screen .song-card:nth-child(2) .cover-wrap:after{animation-delay:.35s}
.quarter-screen .song-card[aria-pressed=true]{transform:translateY(-5px);box-shadow:0 11px 30px #fa233b1a,0 0 0 1px #fa233b}
.has-selection .quarter-screen .song-card[aria-pressed=false]{opacity:.64}
.quarter-screen .tension-vs{color:#c08794}
@keyframes quarter-mark{from{width:0}to{width:31px}}
@keyframes quarter-glint{to{transform:translateX(150%)}}
/* Semifinal: the surrounding room darkens, leaving two pools of light. */
body[data-intensity=semi] .app-shell{background:#151018;border-color:#302232}
body[data-intensity=semi] .app-header{position:relative;z-index:2}
body[data-intensity=semi] .app-header .icon-button{color:#c8baca}
body[data-intensity=semi] .brand-subtitle:before{background:#ffffff30}
body[data-intensity=semi] .page-menu{background:#29202df5;border-color:#ffffff20;color:#f5eff6}
.semifinal-screen{color:#fff;position:static;animation:none}
.semifinal-screen>*:not(.semi-backdrop){position:relative;z-index:1}
.semi-backdrop{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 57%,#69293c40,transparent 64%);overflow:hidden;pointer-events:none}
.semi-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#15101899,transparent 35%,#151018 100%)}
.semi-backdrop i{position:absolute;top:-10%;width:74%;height:90%;left:-3%;transform-origin:50% 0;transform:rotate(-16deg);clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);background:linear-gradient(180deg,#ff8dac42,transparent);filter:blur(6px);animation:semi-breathe 5s ease-in-out infinite alternate}
.semi-backdrop i:nth-child(2){left:29%;transform:rotate(16deg);background:linear-gradient(180deg,#bfb1ff36,transparent);animation-delay:-2.5s}
.semifinal-screen .progress{background:#ffffff0c}.semifinal-screen .progress i{background:linear-gradient(90deg,#ff3159,#f8a9c1)}
.semifinal-screen .match-heading p{color:#af9eaf}
.semifinal-screen .song-card{background:#251b28;border-color:#ffffff18;color:#fff;transition:opacity .4s,transform .4s,box-shadow .4s}
.semifinal-screen .song-card .cover-wrap{border-radius:11px 11px 0 0;animation:semi-cover-enter 1.1s cubic-bezier(.16,1,.3,1) both}
.semifinal-screen .song-card:nth-child(2) .cover-wrap{animation-delay:.12s}
.semifinal-screen .song-code{color:#b8a7b9}.semifinal-screen .song-title{color:#f8f2f9}
.semifinal-screen .song-card[aria-pressed=true]{box-shadow:0 0 0 1px #ff456f,0 0 35px #ff3b6a36;transform:translateY(-6px);border-color:#ff456f}
.semifinal-screen .song-card[aria-pressed=true] .card-aura{opacity:1;box-shadow:inset 0 0 30px #ffbadb22;animation:semi-selected 2.4s ease-in-out infinite alternate}
.has-selection .semifinal-screen .song-card[aria-pressed=false]{opacity:.42;filter:saturate(.5)}
.semifinal-screen .match-footer{border-color:#ffffff14}
.semifinal-screen .tension-vs{color:#d5a3b8;text-shadow:0 0 17px #ff76a9aa}
.semifinal-screen .selection-count,.semifinal-screen .previous-set,.semifinal-screen .save-status{color:#b5a2b5}
.semifinal-screen .selection-count b{color:#ff7a9e}
@keyframes semi-breathe{from{opacity:.45}to{opacity:.95}}
@keyframes semi-cover-enter{from{opacity:0;transform:translateY(24px) scale(.94);filter:brightness(.5)}to{opacity:1;transform:none;filter:brightness(1)}}
@keyframes semi-selected{to{box-shadow:inset 0 0 38px #ffbadb38}}
/* Final: sweeping arena beams, then a spotlight follows the selected record. */
.arena-beams{position:absolute;inset:0;overflow:hidden;mix-blend-mode:screen;opacity:.8;transition:opacity .9s}
.arena-beams i{position:absolute;top:-16%;left:7%;width:78%;height:115%;transform-origin:50% 0;clip-path:polygon(48% 0,52% 0,100% 100%,0 100%);background:linear-gradient(180deg,#f1e5ff66 0%,#f4d4ff16 60%,transparent);animation:arena-sweep 8s ease-in-out infinite alternate}
.arena-beams i:nth-child(2){left:-20%;background:linear-gradient(180deg,#ff97d25c,#ffe7dc0f 70%,transparent);animation-delay:-4s;animation-direction:alternate-reverse}
.arena-beams i:nth-child(3){left:42%;width:52%;background:linear-gradient(180deg,#8bddff77,#ded8ff0c 75%,transparent);animation-duration:10s;animation-delay:-6s}
.arena-dust{position:absolute;inset:16% 0 0;background-image:radial-gradient(circle,#fff9 .7px,transparent 1.2px),radial-gradient(circle,#ffc7d477 .6px,transparent 1px);background-size:67px 89px,109px 73px;opacity:.22;mask-image:linear-gradient(transparent,#000,transparent);animation:dust-drift 18s linear infinite}
.final-backdrop:after{content:"";position:absolute;top:10%;bottom:-8%;left:-25%;width:85%;background:radial-gradient(ellipse at 50% 55%,#fff3d334,#ffb7dc12 44%,transparent 69%);opacity:0;transform:translateX(0);transition:opacity 1s,transform 1s;pointer-events:none;mix-blend-mode:screen}
.final-backdrop[data-focus=left]:after{opacity:1;transform:translateX(0)}
.final-backdrop[data-focus=right]:after{opacity:1;transform:translateX(78%)}
.final-backdrop[data-focus]:not([data-focus=none]) .arena-beams{opacity:.38}
.final-screen .cover-wrap{transition:box-shadow .7s,filter .7s;animation-duration:1.25s!important}
.final-screen .song-card[aria-pressed=true] .cover-wrap{box-shadow:0 0 0 2px #ffc3b9,0 0 45px #ff7ba050,0 0 100px #ffe6b02b,0 22px 50px #0008;filter:brightness(1.14)}
.final-duel.has-choice .song-card[aria-pressed=false]{opacity:.28;filter:saturate(.3) brightness(.65)}
.final-title-artwork{filter:drop-shadow(0 0 25px #e5c4ff22)}
@keyframes arena-sweep{from{transform:rotate(-29deg);opacity:.5}to{transform:rotate(26deg);opacity:1}}
@keyframes dust-drift{to{background-position:20px -150px,-30px -120px}}
/* The result is saved before the coronation. All decoration stays behind the controls. */
.crown-ceremony{position:absolute;inset:0;z-index:20;min-height:830px;overflow:hidden;background:#080a0e;display:flex;flex-direction:column;padding:28px 28px 24px;color:#fff8e7;isolation:isolate;--gold:#e8c88b;--ceremony-ease:cubic-bezier(.16,1,.3,1)}
.crown-ceremony:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 46%,#b9813030,transparent 56%),linear-gradient(180deg,#080a0e22 40%,#080a0e 92%)}
.crown-ceremony:after{content:"";position:absolute;inset:12px;border:1px solid #ecd39b19;pointer-events:none;z-index:3}
.crown-atmosphere{position:absolute;inset:0;z-index:-2;overflow:hidden;opacity:.18;animation:ceremony-fade 3s ease both}
.crown-atmosphere img{width:100%;height:100%;object-fit:cover;filter:blur(65px) saturate(.65);transform:scale(1.3)}
.ceremony-top{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0}
.ceremony-top>span{font-size:17px;font-weight:850;font-style:italic;letter-spacing:-.6px;color:#f2dfb8}
.ceremony-top small{display:block;margin-top:5px;font-size:7px;font-weight:400;font-style:normal;letter-spacing:2px;color:#a4977d}
.ceremony-top button{display:flex;align-items:center;gap:5px;min-height:36px;padding:8px 0 8px 10px;background:none;font-size:10px;color:#c3b79f}
.ceremony-top svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.crown-beams{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;animation:ceremony-fade 1.5s .1s both}
.crown-beams i{position:absolute;top:-30%;left:50%;width:48%;height:115%;transform-origin:50% 0;background:linear-gradient(180deg,#ffe9b42e,transparent 85%);clip-path:polygon(48% 0,52% 0,100% 100%,0 100%);mix-blend-mode:screen;animation:coronation-beam 9s ease-in-out infinite alternate;--from:-37deg;--to:24deg;--shift:-80%}
.crown-beams i:nth-child(2){--from:37deg;--to:-24deg;--shift:-20%;animation-delay:-2s;opacity:.6}
.crown-beams i:nth-child(3){--from:-12deg;--to:32deg;--shift:-50%;animation-duration:12s;animation-delay:-5s;opacity:.5;width:25%}
.crown-beams i:nth-child(4){--from:15deg;--to:-32deg;--shift:-50%;animation-duration:11s;animation-delay:-3s;opacity:.45;width:25%}
.crown-reveal{position:relative;display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;width:100%;text-align:center;padding:22px 0 26px;z-index:1}
.crown-heading{animation:coronation-rise 1.3s .4s var(--ceremony-ease) both}
.crown-heading>p{font-size:9px;letter-spacing:5px;color:#cbb78c;margin:0 0 12px;padding-left:5px}
.crown-heading h2{font-size:43px;line-height:1.2;font-weight:650;letter-spacing:7px;margin:0;padding-left:7px;color:#f5ddb0;background:linear-gradient(120deg,#a17939 0%,#ffefd0 35%,#d0aa64 55%,#fff3d4 72%,#aa7936);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.crown-heading-line{display:block;width:124px;height:1px;margin:20px auto 0;background:linear-gradient(90deg,transparent,#dfc187,transparent);position:relative}
.crown-heading-line:after{content:"";position:absolute;left:calc(50% - 2px);top:-2px;width:5px;height:5px;transform:rotate(45deg);background:#e5c98f;box-shadow:0 0 12px #eacb92}
.crown-hero{position:relative;width:min(58vw,236px);aspect-ratio:1;margin:42px 0 45px;flex-shrink:0;perspective:900px}
.crown-halo{position:absolute;inset:-39px;pointer-events:none;animation:coronation-halo 1.8s .7s var(--ceremony-ease) both}
.crown-halo:before{content:"";position:absolute;inset:-30px;border-radius:50%;background:radial-gradient(circle,#d7aa4b00 32%,#eac06d24 48%,#d7aa4b00 69%);animation:coronation-breathe 5s 3s ease-in-out infinite alternate}
.crown-halo i{position:absolute;inset:0;border-radius:50%;border:1px solid #dec48a38}
.crown-halo i:first-child{border-color:#dec48a18;border-top-color:#f4d58c;border-bottom-color:#f4d58c;animation:coronation-orbit 24s linear infinite}
.crown-halo i:nth-child(2){inset:11px;border-style:dashed;border-color:#dec48a25;animation:coronation-orbit 50s linear reverse infinite}
.crown-halo i:nth-child(3){inset:-8px;border:0;background:conic-gradient(from 0deg,transparent 0deg,#e7c88a0c 8deg,transparent 16deg,#e7c88a17 24deg,transparent 32deg);mask-image:radial-gradient(circle,transparent 57%,#000 59%,transparent 70%);-webkit-mask-image:radial-gradient(circle,transparent 57%,#000 59%,transparent 70%);animation:coronation-orbit 45s linear infinite}
.crown-portrait{position:relative;width:100%;height:100%;overflow:hidden;padding:5px;border:1px solid #e4c7879c;background:#171713;box-shadow:0 22px 55px #000a,0 0 60px #dbb76b20;animation:coronation-cover 1.8s 1s var(--ceremony-ease) both}
.crown-portrait:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#fff1cd55 47%,transparent 64%);transform:translateX(-160%);animation:coronation-shine 1.5s 2.1s ease-out both;pointer-events:none}
.crown-portrait img{display:block;width:100%;height:100%;object-fit:cover}
.crown-seal{position:absolute;bottom:-17px;left:calc(50% - 22px);width:44px;height:36px;display:grid;place-items:center;background:#15130e;border:1px solid #b48b48;box-shadow:0 3px 16px #0008;animation:coronation-rise 1s 2s var(--ceremony-ease) both}
.crown-seal svg{width:23px;height:19px;fill:#e2bd75;stroke:#e2bd75;stroke-width:1.3;stroke-linejoin:round}
.crown-song{width:100%;animation:coronation-rise 1.4s 1.9s var(--ceremony-ease) both}
.crown-song h3{font-size:29px;font-weight:650;line-height:1.35;letter-spacing:1px;margin:0;text-wrap:balance;overflow-wrap:anywhere;color:#fff9ee;text-shadow:0 2px 24px #eac58530}
.crown-song h3.long-title{font-size:21px;letter-spacing:0}
.crown-summary{font-size:12px;letter-spacing:.4px;color:#c7bba2;margin:14px 0 0;line-height:1.9}
.ceremony-footer{position:relative;z-index:4;flex-shrink:0;width:100%;margin-top:32px;text-align:center;animation:coronation-rise 1s 3s var(--ceremony-ease) both}
.ceremony-skip{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;min-height:54px;width:100%;padding:14px 18px;border:1px solid #f7e5ba88;border-radius:3px;background:linear-gradient(110deg,#b58d4f,#f1d6a1 48%,#c8a56b);box-shadow:0 4px 28px #d5ab591c,inset 0 1px #fff2d3aa;color:#302414;font-size:13px;font-weight:600;letter-spacing:.3px;transition:filter .2s,box-shadow .2s}
.ceremony-skip:hover{filter:brightness(1.08);box-shadow:0 4px 34px #d5ab593b}
.ceremony-skip:active{filter:brightness(.95)}
.ceremony-skip svg{height:19px;width:19px;fill:none;stroke:currentColor;stroke-width:1.5}
.crown-confetti,.crown-stars{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.crown-confetti i{position:absolute;left:var(--x);top:-4%;width:4px;height:9px;background:var(--h);opacity:0;animation:coronation-confetti var(--fall) var(--d) cubic-bezier(.2,.5,.5,1) both}
.crown-confetti i:nth-child(3n){width:3px;height:3px;border-radius:50%}.crown-confetti i:nth-child(4n){width:2px;height:13px}
.crown-stars{z-index:0;opacity:.65}
.crown-stars i{position:absolute;left:var(--x);top:var(--y);width:2px;height:2px;border-radius:50%;background:#ffe7ad;box-shadow:0 0 8px #f7d790;animation:coronation-star 4s var(--d) ease-in-out infinite}
.crown-burst{position:absolute;inset:0;pointer-events:none;z-index:-1}
.crown-burst i{position:absolute;top:50%;left:50%;width:2px;height:var(--length);background:linear-gradient(#ffe6a9,transparent);transform-origin:50% 0;opacity:0;animation:coronation-burst 1.7s var(--d) ease-out both}
@keyframes ceremony-fade{from{opacity:0}}
@keyframes coronation-rise{from{opacity:0;transform:translateY(17px)}to{opacity:1;transform:translateY(0)}}
@keyframes coronation-cover{0%{opacity:0;transform:translateY(40px) rotateX(14deg) scale(.8)}100%{opacity:1;transform:translateY(0) rotateX(0) scale(1)}}
@keyframes coronation-halo{from{opacity:0;transform:scale(.55) rotate(-50deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes coronation-orbit{to{transform:rotate(360deg)}}
@keyframes coronation-breathe{from{opacity:.55;transform:scale(.98)}to{opacity:1;transform:scale(1.06)}}
@keyframes coronation-beam{from{transform:translateX(var(--shift)) rotate(var(--from))}to{transform:translateX(var(--shift)) rotate(var(--to))}}
@keyframes coronation-shine{to{transform:translateX(160%)}}
@keyframes coronation-confetti{0%{opacity:0;transform:translate3d(0,0,0) rotate(var(--r))}6%{opacity:.9}80%{opacity:.8}100%{opacity:0;transform:translate3d(var(--drift),1000px,0) rotate(calc(var(--r) + 640deg)) rotateY(260deg)}}
@keyframes coronation-star{0%,100%{opacity:.15;transform:scale(.6)}50%{opacity:.85;transform:scale(1.3)}}
@keyframes coronation-burst{0%{opacity:0;transform:rotate(var(--a)) translateY(-80px) scaleY(.4)}15%{opacity:.9}100%{opacity:0;transform:rotate(var(--a)) translateY(-280px) scaleY(.05)}}
@media(max-width:760px){.duel-screen:not(.final-screen){min-height:calc(100svh - 86px)}.duel-layout{margin:auto 0}.final-screen{min-height:max(650px,calc(100svh - 86px))}.crown-ceremony{position:fixed;inset:0;max-width:430px;margin:auto}.save-status{font-size:9px}.song-title{font-size:16px}}
@media(max-width:360px){.brand{max-width:100%}body:not([data-view=home]) .brand{gap:6px}body:not([data-view=home]) .brand-subtitle{gap:6px}.final-screen{min-height:max(620px,calc(100svh - 86px))}.dialog-actions{gap:7px}.dialog-actions .primary,.dialog-actions .secondary{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.arena-dust,.crown-confetti{display:none}.arena-beams i{transform:rotate(0);opacity:.3}.crown-reveal{opacity:1;filter:none;transform:none}}

/* Direct stage inspection is separate from the player's saved tournament. */
.view-mode-switch{display:flex;border:1px solid #ded9df;border-radius:10px;padding:3px;margin:20px 0 18px;gap:3px}
.view-mode-switch button{flex:1;min-width:0;padding:8px 6px;border-radius:7px;background:none;color:#928994;font-size:12px}
.view-mode-switch button.active{background:#fff;color:#fa233b;box-shadow:0 2px 10px #23142708}
#preview-toolbar{position:relative;z-index:4;display:flex;align-items:center;gap:7px;margin:0 16px 13px;padding:9px 10px;background:#fff1f4;border:1px solid #f9dbe4;border-radius:9px;color:#a72c4b}
#preview-toolbar b{font-size:11px;white-space:nowrap;font-weight:600}
#preview-toolbar select{font:11px -apple-system,"PingFang SC",sans-serif;background:#fff;border:1px solid #e8d6de;color:#54464f;border-radius:5px;height:28px;min-width:0;padding:0 4px}
#preview-stage{flex:1;width:100px}#preview-set{width:67px}
#preview-exit{font-size:11px;background:none;padding:5px 0;color:#a72c4b;white-space:nowrap}
body[data-preview=true][data-view=home] .app-header{position:relative;top:auto;right:auto;width:100%;height:49px;padding:0 18px}
body[data-preview=true] #page-menu [data-action=export],body[data-preview=true] #page-menu [data-action=import],body[data-preview=true] #page-menu [data-action=new],body[data-preview=true] .resume-status,body[data-preview=true] #another{display:none}
body[data-preview=true][data-intensity=semi] #preview-toolbar,body[data-preview=true][data-intensity=final] #preview-toolbar{background:#2b202c;border-color:#704356;color:#efbed0}
body[data-preview=true][data-intensity=semi] #preview-toolbar select,body[data-preview=true][data-intensity=final] #preview-toolbar select{background:#1e1721;color:#f1e9f0;border-color:#655364}
body[data-preview=true][data-intensity=semi] #preview-exit,body[data-preview=true][data-intensity=final] #preview-exit{color:#efbed0}
/* Align the actual visible wordmarks around a centered divider. */
body:not([data-view=home]) .brand{display:flex;align-items:center;justify-content:center;gap:9px;padding:0}
body:not([data-view=home]) .brand .soda-wordmark{height:18px;width:auto;flex:0 0 auto;align-self:center}
body:not([data-view=home]) .brand .stage-cn-wordmark{height:17px;width:auto;flex:0 0 auto;align-self:center}
body:not([data-view=home]) .brand-subtitle{display:flex;align-items:center;gap:0;line-height:1;padding:0}
body:not([data-view=home]) .brand-subtitle:before{display:none}
.brand-divider{display:block;height:18px;width:1px;background:#d4d4dc;flex:0 0 1px;align-self:center}
body[data-final=true] .brand-divider,body[data-intensity=semi] .brand-divider{background:#ffffff40}
/* A card has one square artwork region and a fixed one-line information region. */
.song-card{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:start;min-width:0;vertical-align:top}
.song-card .cover-wrap{position:relative;display:block;width:100%;aspect-ratio:1;flex:0 0 auto;overflow:hidden;padding:0}
.song-card .cover-wrap>img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center;max-width:none;transform:translate(var(--song-cover-x,0%),var(--song-cover-y,0%)) scale(var(--song-cover-scale,1));transform-origin:center;border:0;padding:0}
.song-card .song-info{display:block;box-sizing:border-box;flex:0 0 64px;min-height:64px;height:64px;padding:10px 12px 11px;width:100%;overflow:hidden}
.song-card .song-code{font-size:13px;line-height:16px}
.song-card .song-title{display:block;white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important;overflow:hidden;text-overflow:clip;line-height:24px;height:24px;min-width:0;margin-top:3px;font-size:17px}
.final-screen .song-card .song-info{height:64px;min-height:64px;flex-basis:64px;padding:13px 2px 0}
.final-screen .song-card .song-title{font-size:18px;line-height:25px;height:25px;margin-top:5px}
@media(max-width:760px){.song-card .song-title{font-size:16px}}
@media(max-width:360px){body:not([data-view=home]) .brand{gap:7px}body:not([data-view=home]) .brand .soda-wordmark{height:15px}body:not([data-view=home]) .brand .stage-cn-wordmark{height:14px}.brand-divider{height:15px}.song-card .song-info{padding-left:10px;padding-right:10px}.final-screen .song-card .song-info{padding-left:2px;padding-right:2px}#preview-toolbar{margin-left:12px;margin-right:12px;padding:8px;gap:5px}#preview-toolbar b{font-size:10px}#preview-set{width:62px}}


/* Late-round stage identity and a shared matchup slot. */
.duel-screen .match-heading:not(.final-heading){display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:156px;margin:12px 8px 20px}
.duel-screen .match-heading:not(.final-heading) h2{font-size:34px;line-height:1.3}
.duel-screen .match-heading:not(.final-heading) p{font-size:15px;margin-top:11px}
.quarter-screen .match-heading h2:after{margin:11px auto 0}
.duel-screen{display:flex;flex-direction:column;min-height:744px;padding-bottom:28px}
.duel-screen .duel-layout{margin:35px 8px auto;width:auto;flex:none}
.duel-screen .duel-layout .song-grid{margin:0;width:100%}
.duel-screen .match-footer{margin-top:30px}
.final-screen .final-heading{height:156px;margin:12px 8px 20px}
.final-screen .final-duel{margin:35px 8px auto}
.final-screen .final-versus{bottom:calc(100% + 20px)}
.final-screen .final-actions{top:calc(100% + 30px)}
.final-screen .song-card{border:1px solid transparent}
.reference-metal-title{width:224px;max-width:100%;overflow:visible;filter:none;mix-blend-mode:screen}
.reference-form{transform-box:fill-box;transform-origin:center;animation:reference-form 1.35s cubic-bezier(.2,.7,.2,1) .4s both}
.reference-art{animation:reference-breathe 8s ease-in-out 1.8s infinite alternate}
.reference-gather{stroke-dasharray:1;stroke-dashoffset:0;animation:reference-gather 1.3s ease-out both}
.reference-gather.second{animation-delay:.15s}
.reference-ribbons{animation:reference-ribbon-rest 1s ease-out 1.4s both}
.reference-shine{animation:reference-shine 8s ease-in-out 1.6s infinite}
@keyframes reference-form{from{opacity:0;transform:scaleX(.02)}35%{opacity:.7}to{opacity:1;transform:scaleX(1)}}
@keyframes reference-gather{from{stroke-dashoffset:1;opacity:0}15%{opacity:1}to{stroke-dashoffset:0;opacity:.9}}
@keyframes reference-ribbon-rest{to{opacity:.15}}
@keyframes reference-breathe{from{filter:brightness(.97)}to{filter:brightness(1.08)}}
@keyframes reference-shine{0%{translate:0 0;opacity:0}8%{opacity:1}42%{translate:1500px 0;opacity:.6}48%,100%{translate:1500px 0;opacity:0}}
/* Reuse the quarterfinal's exact cover glint in both later rounds. */
.semifinal-screen .cover-wrap:after,.final-screen .cover-wrap:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#ffffff66 50%,transparent 65%);transform:translateX(-150%);animation:quarter-glint 1.2s ease 1.3s both;pointer-events:none}
.semifinal-screen .song-card:nth-child(2) .cover-wrap:after,.final-screen .song-card:nth-child(2) .cover-wrap:after{animation-delay:1.45s}
@media(max-width:760px){.duel-screen,.duel-screen:not(.final-screen),.final-screen{min-height:max(650px,calc(100svh - 86px))}}
@media(max-width:360px){.duel-screen .match-heading:not(.final-heading) h2{font-size:31px}.duel-screen .match-heading:not(.final-heading) p{font-size:14px}.reference-metal-title{width:203px}}

.entry-options{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#f5f3f5;border:1px solid #ece8ec;border-radius:12px;padding:4px;margin:0 0 14px}
.entry-options button{background:transparent;border-radius:8px;padding:11px 4px;font-size:12px;color:#918891}
.entry-options button[aria-pressed=true]{color:#b03250;background:#fff;box-shadow:0 2px 8px #3320380b;font-weight:600}
.final-screen .final-heading{isolation:auto;z-index:auto}.final-screen .final-heading h2{z-index:auto}.final-backdrop .final-shade{background:linear-gradient(180deg,#101014d9 0%,#101014aa 35%,#10101488 70%,#101014 100%)}

/* Restore the original white / dark stages; tint the former pink gradient a soft warm blush. */
/* Retain the requested warm spotlights, integrated final title, and lower final choices. */
.semi-backdrop i{background:linear-gradient(180deg,#fff4d64d,#f2e5bd0d 75%,transparent);animation:none}
.semi-backdrop i:nth-child(2){background:linear-gradient(180deg,#eee7cf42,#e1d5ba0c 75%,transparent);animation:none}
.arena-beams i{background:linear-gradient(180deg,#fff2ce73,#f3e4b51c 60%,transparent)}
.arena-beams i:nth-child(2){background:linear-gradient(180deg,#ffe4a65e,#f4deb212 70%,transparent)}
.arena-beams i:nth-child(3){background:linear-gradient(180deg,#f3f4d96b,#e2e9c712 75%,transparent)}
.final-backdrop:after{background:radial-gradient(ellipse at 50% 55%,#fff3c747,#f3e1b419 44%,transparent 69%)}
.final-screen .song-card[aria-pressed=true] .cover-wrap{box-shadow:0 0 0 2px #efdfad,0 0 45px #f3dd9550,0 0 100px #edf3cb26,0 22px 50px #0008}
.reference-metal-title{mix-blend-mode:normal;filter:drop-shadow(0 0 16px #f8e9b714)}
.reference-art{animation:none}
.final-screen .final-duel{margin-top:clamp(72px,12svh,108px)}

/* One continuous stage: 1 / 2 / 3 / 5 warm spotlights. */
body[data-stage="3"] .app-shell,body[data-stage="4"] .app-shell,body[data-stage="5"]:not([data-view=opening]) .app-shell,body[data-stage="6"] .app-shell{background:#101014;border-color:#29292f}
body[data-stage="3"] .app-header,body[data-stage="4"] .app-header{position:relative;z-index:2}
body[data-stage="3"] .app-header .icon-button,body[data-stage="4"] .app-header .icon-button{color:#dedbd6}
body[data-stage="3"] .brand-divider,body[data-stage="4"] .brand-divider{background:#ffffff40}
.quarter-screen{position:static;color:#f8f5ef;animation:none}
.quarter-screen>*:not(.tension-backdrop){position:relative;z-index:1}
.quarter-screen .match-heading p{color:#bdb8ae}
.quarter-screen .song-card{background:#24242b;border-color:#ffffff22;color:#f8f5ef}
.quarter-screen .song-code{color:#b4b0a8}.quarter-screen .song-title{color:#f8f5ef}
.quarter-screen .progress{background:#ffffff13}
.quarter-screen .match-footer{border-color:#ffffff19}
.quarter-screen .selection-count,.quarter-screen .previous-set,.quarter-screen .save-status{color:#bbb6ae}
.quarter-screen .tension-vs{color:#d6ccb8}
.tension-backdrop{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.tension-backdrop:after,.semi-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#10101433,transparent 40%,#101014bb 100%);pointer-events:none}
.tension-backdrop i{position:absolute;top:-10%;left:14%;width:72%;height:106%;transform-origin:50% 0;clip-path:polygon(49% 0,51% 0,100% 100%,0 100%);background:linear-gradient(180deg,#fff5da70,#f3e5bd20 66%,transparent);filter:blur(5px)}
body[data-stage="4"] .tension-backdrop i{left:0;width:66%;transform:rotate(-13deg);background:linear-gradient(180deg,#fff5d978,#f3e5bd22 70%,transparent)}
body[data-stage="4"] .tension-backdrop i:nth-child(2){left:34%;transform:rotate(13deg);background:linear-gradient(180deg,#ffeac16b,#f5dfb51a 70%,transparent)}
.semi-backdrop{background:none}
.semi-backdrop i{top:-10%;height:106%;width:64%;left:0;transform:rotate(-20deg);background:linear-gradient(180deg,#fff4d680,#f2e5bd26 70%,transparent);animation:none}
.semi-backdrop i:nth-child(2){left:36%;transform:rotate(20deg);background:linear-gradient(180deg,#ffe9bc78,#f3dfb322 70%,transparent)}
.semi-backdrop i:nth-child(3){left:22%;width:56%;transform:rotate(0);background:linear-gradient(180deg,#fff8e572,#f6edce22 70%,transparent)}
.semifinal-screen .song-card{background:#24242b}.semifinal-screen .match-heading p{color:#bdb8ae}
.arena-beams{opacity:.92}
.arena-beams i{background:linear-gradient(180deg,#fff3d68c,#f4e5ba29 65%,transparent)}
.arena-beams i:nth-child(2){background:linear-gradient(180deg,#ffe5ac85,#f3d9a622 70%,transparent)}
.arena-beams i:nth-child(3){background:linear-gradient(180deg,#fff9e882,#f2ecd025 70%,transparent)}
.arena-beams i:nth-child(4){left:-8%;width:64%;background:linear-gradient(180deg,#fff3d67d,#f4e5ba22 70%,transparent);animation-duration:11s;animation-delay:-3s;animation-direction:alternate-reverse}
.arena-beams i:nth-child(5){left:36%;width:70%;background:linear-gradient(180deg,#ffe8b780,#f2deb622 70%,transparent);animation-duration:9s;animation-delay:-7s}
.final-backdrop>img{opacity:.2;filter:blur(55px) saturate(.35) brightness(.4)}
body[data-preview=true][data-stage="3"] #preview-toolbar,body[data-preview=true][data-stage="4"] #preview-toolbar{background:#29262a;border-color:#6c6259;color:#e5dbcd}
body[data-preview=true][data-stage="3"] #preview-toolbar select,body[data-preview=true][data-stage="4"] #preview-toolbar select{background:#1e1d22;border-color:#665e55;color:#eee7da}
body[data-preview=true][data-stage="3"] #preview-exit,body[data-preview=true][data-stage="4"] #preview-exit{color:#e5dbcd}
body[data-stage="3"] .page-menu,body[data-stage="4"] .page-menu{background:#29262af5;border-color:#ffffff20;color:#eee7da}

/* Sweep every stage's spotlights; individual rotation preserves their resting angles. */
.tension-backdrop i:nth-child(n){animation:stage-spot-sweep 14s ease-in-out infinite alternate}
body[data-stage="4"] .tension-backdrop i:nth-child(n){animation-duration:11s}
.tension-backdrop i:nth-child(2){animation-delay:-5.5s;animation-direction:alternate-reverse}
.semi-backdrop i:nth-child(n){animation:stage-spot-sweep 8s ease-in-out infinite alternate}
.semi-backdrop i:nth-child(2){animation-delay:-4s;animation-direction:alternate-reverse}
.semi-backdrop i:nth-child(3){animation-duration:10s;animation-delay:-7s}
@keyframes stage-spot-sweep{from{rotate:-10deg;opacity:.72}to{rotate:10deg;opacity:1}}
body[data-preview=true]:is([data-stage="3"],[data-stage="4"],[data-stage="5"],[data-stage="6"]) #preview-toolbar{background:#29262a;border-color:#6c6259;color:#e5dbcd}
body[data-preview=true]:is([data-stage="3"],[data-stage="4"],[data-stage="5"],[data-stage="6"]) #preview-toolbar select{background:#1e1d22;border-color:#665e55;color:#eee7da}
body[data-preview=true]:is([data-stage="3"],[data-stage="4"],[data-stage="5"],[data-stage="6"]) #preview-exit{color:#e5dbcd}

/* The single play-in spotlight aims at the selected album, with a soft live pulse. */
body[data-stage="3"] .tension-backdrop i{transition:rotate .75s cubic-bezier(.22,.7,.25,1),width .75s,left .75s}
body[data-stage="3"] .tension-backdrop[data-focus="left"] i,body[data-stage="3"] .tension-backdrop[data-focus="right"] i{left:30%;width:40%;animation:chosen-spot-breathe 3s ease-in-out infinite alternate;background:linear-gradient(180deg,#fff5da99,#f3e5bd40 66%,transparent)}
@keyframes chosen-spot-breathe{from{opacity:.82}to{opacity:1}}
/* V2: stage premieres, an intentional reveal, and collectible match reports. */
.review-nav{display:block;margin-top:16px;font-size:12px;color:#8b7377}.page-menu>a{display:block;font-size:13px;padding:12px}
.stage-opening{position:relative;isolation:isolate;min-height:700px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:185px 28px 62px;background:radial-gradient(ellipse at 50% 45%,#fcebed70,transparent 62%)}
.opening-orbit{position:absolute;inset:0;z-index:-1;overflow:hidden;opacity:.32;mask-image:linear-gradient(#0009,transparent 48%)}
.opening-orbit img{position:absolute;top:calc(20px + (var(--i) / 4) * 60px);left:calc(-38px + var(--i) * 63px);width:96px;aspect-ratio:1;object-fit:cover;transform:rotate(calc(-18deg + var(--i) * 5deg));animation:opening-records 1.3s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * .05s);box-shadow:0 15px 30px #0002}
.opening-hero{width:100%;position:relative}.opening-hero h2{font-size:64px;line-height:1.25;letter-spacing:-3px;margin:0;font-weight:850;white-space:nowrap;animation:opening-title .9s cubic-bezier(.2,.8,.2,1) both}.opening-hero h2.opening-long-title{font-size:49px;letter-spacing:-2px}.opening-scale{display:flex;align-items:baseline;justify-content:center;gap:17px;font-size:32px;letter-spacing:-1px;font-variant-numeric:tabular-nums;margin-top:24px}.opening-number{display:inline-flex;align-items:baseline;gap:5px}.opening-number b{font-weight:450;line-height:1.2}.opening-number small{font-size:10px;letter-spacing:0;color:#ab9696;font-weight:400}.opening-arrow{font-size:21px;color:#c6a2a8;letter-spacing:0;align-self:center}.opening-rules{color:#a18d90;font-size:11px;line-height:1.8;letter-spacing:.3px;margin:14px 0 0}.stage-opening>.primary{min-width:220px;margin-top:55px;font-size:14px;min-height:48px}
.opening-dark{background:radial-gradient(ellipse at 50% 35%,#71623b33,transparent 60%);color:#f9f3e7}.opening-dark .opening-orbit{opacity:.4}.opening-dark .opening-rules,.opening-dark .opening-number small{color:#aa9c85}.opening-dark .opening-arrow{color:#86795c}
@keyframes opening-title{from{opacity:0;transform:translateY(25px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}@keyframes opening-records{from{opacity:0;translate:0 -80px}to{opacity:1;translate:0 0}}
body:has(.crown-ceremony) .app-header{visibility:hidden}
.champion-screen{padding-top:16px}.champion-heading{text-align:left;margin:14px 0 24px}.champion-heading>span{font-size:10px;letter-spacing:3px;color:#aa9592}.champion-heading h2{font-size:26px;letter-spacing:-1px;margin:10px 0}.poster-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:0 0 16px}.poster-choices button{padding:11px 2px;border-radius:8px;background:#f4f3f0;color:#78746e;font-size:11px;white-space:nowrap}.poster-choices small{display:block;font-size:9px;margin-bottom:4px;letter-spacing:1px;opacity:.6}.poster-choices button[aria-pressed=true]{color:#bd283c;background:#fff0f0;box-shadow:inset 0 0 0 1px #eec6ca}.champion-poster{display:block;width:100%;height:auto;aspect-ratio:3/4;background:#f4f1ea;box-shadow:0 12px 40px #24202412}.poster-gallery-link{display:inline-block;margin:20px auto;font-size:12px;color:#997e80}.personal-report{text-align:left;margin-top:34px;border-top:1px solid #eee8e3;padding-top:32px}.report-kicker{font-size:10px;letter-spacing:2px;color:#b49a91}.personal-report h3{font-size:22px;margin:12px 0 18px;letter-spacing:-.6px}.report-story{font-size:14px;line-height:1.9;color:#85746d}.report-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:25px 0}.report-four img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.report-four b{display:block;font-size:11px;font-weight:550;margin:9px 0 6px;line-height:1.5;overflow-wrap:anywhere}.report-four span{font-size:9px;color:#ac9690}.report-highlight{padding:18px;background:#f7f4ee;border-radius:8px}.report-highlight>span{display:block;font-size:10px;color:#a28c75;margin-bottom:7px}.report-highlight b{font-size:15px;font-weight:600}.report-highlight p{font-size:11px;color:#978b79;line-height:1.7;margin:8px 0 0}.report-path{margin-top:24px;font-size:13px;color:#8d6e70}.report-path summary{padding:12px 0;cursor:pointer}.report-path ol{padding-left:20px}.report-path li{padding:12px 0;color:#252329}.report-path li span{display:block;font-size:11px;line-height:1.7;color:#94888b;margin-top:8px}.upset-note{font-size:11px;line-height:1.8;color:#a18b88;margin:20px 0}.report-copy{width:100%;font-size:12px;color:#8f7975}.stats-submit{border-top:1px solid #eee5e1;padding-top:25px;margin-top:30px;text-align:center}.stats-submit>.primary{width:100%;font-size:13px}.stats-submit p{font-size:11px;color:#a18b88;line-height:1.8}.stats-submit>a{display:inline-block;margin:12px auto 0;color:#b16d76;font-size:12px}
#preview-opening{font:11px -apple-system,"PingFang SC",sans-serif;background:none;color:inherit;white-space:nowrap;padding:5px 2px}
@media(max-width:760px){.stage-opening{min-height:calc(100svh - 85px)}.stage-opening h2{font-size:54px}body[data-view=reveal] .app-header,body[data-view=reveal] #preview-toolbar{display:none}.crown-ceremony{position:relative;inset:auto;height:100svh;min-height:680px;padding-top:max(25px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}}
@media(max-width:760px) and (max-height:740px){.crown-ceremony{min-height:620px;padding:22px 25px 20px}.crown-reveal{padding:16px 0 21px}.crown-heading h2{font-size:36px}.crown-heading>p{margin-bottom:8px;font-size:8px}.crown-heading-line{margin-top:13px}.crown-hero{width:min(54vw,203px);margin:29px 0 34px}.crown-halo{inset:-26px}.crown-song h3{font-size:25px}.crown-song h3.long-title{font-size:18px}.crown-summary{margin-top:12px;font-size:11px}.ceremony-skip{min-height:50px}.ceremony-footer{margin-top:25px}}
@media(max-width:360px){#preview-toolbar{flex-wrap:wrap}#preview-toolbar b{flex-basis:45px}.stage-opening h2{font-size:48px}.opening-scale{font-size:29px;gap:12px}.opening-hero h2.opening-long-title{font-size:42px}.champion-heading h2{font-size:23px}.report-four{gap:7px}.report-four b{font-size:10px}.ceremony-skip{font-size:12px}}
@media(prefers-reduced-motion:reduce){.opening-orbit img,.stage-opening h2{animation:none}.ceremony-skip{animation:none}}
@media(prefers-reduced-motion:reduce){.crown-confetti,.crown-burst,.crown-portrait:after{display:none}.crown-stars i{opacity:.4}.crown-beams i{transform:translateX(-80%) rotate(-20deg);opacity:.5}.crown-beams i:nth-child(even){transform:translateX(-20%) rotate(20deg)}.crown-halo,.crown-heading,.crown-song,.crown-portrait,.crown-seal,.ceremony-footer{opacity:1;transform:none}}

@media(max-width:760px){.stage-opening{padding-top:165px;padding-bottom:50px;min-height:calc(100svh - 85px)}.opening-hero h2{font-size:60px}.opening-hero h2.opening-long-title{font-size:47px}}
@media(max-width:360px){.stage-opening{padding-left:20px;padding-right:20px;padding-top:145px;padding-bottom:38px}.opening-hero h2{font-size:54px}.opening-hero h2.opening-long-title{font-size:42px}.stage-opening>.primary{margin-top:43px;min-width:210px}}
@media(max-height:650px) and (max-width:760px){.stage-opening{padding-top:125px;padding-bottom:34px;min-height:calc(100svh - 85px)}.stage-opening>.primary{margin-top:36px}}

/* Two pen gestures: underline the field, lift, then circle the qualifiers. */
.opening-numeral{position:relative;display:inline-block;isolation:isolate}.opening-numeral>b{position:relative;z-index:1}.opening-handline,.opening-handcircle{position:absolute;display:block;overflow:visible;pointer-events:none;z-index:2;fill:none;color:var(--red)}.opening-handline{width:calc(100% + 10px);height:12px;left:-5px;bottom:-10px;transform:rotate(-2deg)}.opening-handcircle{width:calc(100% + 28px);height:calc(100% + 20px);left:-14px;top:-11px;transform:rotate(-6deg)}.opening-handline path,.opening-handcircle path{stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1}.opening-handline path{animation:opening-pen-line .82s cubic-bezier(.28,.05,.38,.9) 1s both}.opening-handcircle path{animation:opening-pen-circle 1.22s cubic-bezier(.2,.06,.36,.95) 2.03s both}.opening-number{gap:9px}.opening-scale{gap:23px;margin-top:26px}.opening-rules{margin-top:25px}@keyframes opening-pen-line{0%{stroke-dashoffset:1}85%{stroke-dashoffset:.06}100%{stroke-dashoffset:0}}@keyframes opening-pen-circle{0%{stroke-dashoffset:1}35%{stroke-dashoffset:.7}77%{stroke-dashoffset:.19}100%{stroke-dashoffset:0}}
@media(max-width:360px){.opening-scale{gap:20px}.opening-number{gap:8px}}
@media(prefers-reduced-motion:reduce){.opening-handline path,.opening-handcircle path{animation:none;stroke-dashoffset:0}}

.opening-to{margin-left:6px;margin-right:8px}
/* Each draw rotates six distinct pen signatures across the numbered premieres. */
.opening-handline{transform:rotate(var(--pen-line-angle,-2deg))}.opening-handcircle{transform:rotate(var(--pen-circle-angle,-6deg))}.opening-handline path,.opening-handcircle path{stroke-width:var(--pen-width,2.1)}.opening-handline path{animation-duration:var(--pen-line-time,.82s)}.opening-handcircle path{animation-duration:var(--pen-circle-time,1.22s);animation-delay:var(--pen-circle-delay,2.03s)}
/* The final opens directly onto the real song choices. */
.final-screen,.semifinal-screen{position:relative;isolation:isolate}.final-screen>.final-curtain,.semifinal-screen>.final-curtain{position:absolute;inset:0;z-index:30;overflow:hidden;pointer-events:auto;animation:final-curtain-clear .16s linear 2.02s both}
.curtain-panel{position:absolute;top:0;bottom:-8%;width:50.5%;background:linear-gradient(90deg,#0b0b0f 0%,#15141a 19%,#211e25 36%,#14131a 55%,#1c1921 76%,#0d0c12 100%);box-shadow:inset -18px 0 40px #0003;will-change:transform;animation-duration:2s;animation-delay:.18s;animation-timing-function:cubic-bezier(.5,.02,.2,1);animation-fill-mode:both;transform-origin:top center}.curtain-left{left:0;border-right:1px solid #ccb27c25;animation-name:final-curtain-left}.curtain-right{right:0;border-left:1px solid #ccb27c25;animation-name:final-curtain-right;background:linear-gradient(270deg,#0b0b0f 0%,#15141a 19%,#211e25 36%,#14131a 55%,#1c1921 76%,#0d0c12 100%);box-shadow:inset 18px 0 40px #0003}.curtain-center-glow{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 49.7%,#d7ba7b33 50%,transparent 50.3%);mix-blend-mode:screen;animation:curtain-soft-light 1.8s ease .12s both}
@keyframes final-curtain-left{0%{transform:translateX(0) skewY(0)}100%{transform:translateX(-103%) skewY(-.7deg)}}@keyframes final-curtain-right{0%{transform:translateX(0) skewY(0)}100%{transform:translateX(103%) skewY(.7deg)}}@keyframes final-curtain-clear{from{opacity:1}to{opacity:0}}@keyframes curtain-soft-light{0%{opacity:0}20%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.final-screen>.final-curtain,.semifinal-screen>.final-curtain{display:none;animation:none}.curtain-panel,.curtain-center-glow{animation:none}}
body[data-view=opening][data-stage="5"] #preview-toolbar{background:#fff6f7;color:#9c4f60;border-color:#f5ccd6}body[data-view=opening][data-stage="5"] #preview-toolbar select{background:#fff;color:#5c5153;border-color:#e9d7dc}body[data-view=opening][data-stage="5"] #preview-exit{color:#9c4f60}

/* One line per tab; the taller numerals face each other at the center. */
.home-screen .entry-options{--entry-red:#b03250;position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:5px;margin:0 0 16px;border:1px solid #ece8ec;border-radius:16px;background:#f5f3f5}
.home-screen .entry-options button{display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:1fr;align-items:center;column-gap:8px;min-width:0;min-height:0;padding:8px 9px;text-align:left;border:0;border-radius:12px;background:transparent;color:#a39ca1;font-weight:400;box-shadow:none;transition:color .18s,background .18s}
.home-screen .entry-options button[aria-pressed=true]{background:#fff;color:var(--entry-red);box-shadow:0 2px 8px #33203804}
.entry-digits{display:flex;grid-column:1;grid-row:1;align-self:center;justify-self:center;align-items:center;justify-content:center;width:48px;height:34px;color:inherit}.entry-digits svg{display:block;width:auto;height:100%;max-width:100%;overflow:visible}
.entry-name{grid-column:2;grid-row:1;align-self:end;padding-bottom:1px;font-size:14px;line-height:1;font-weight:400;white-space:nowrap;color:inherit}
.entry-name strong{font-weight:700}
.home-screen #entry-128{grid-template-columns:minmax(0,1fr) 48px;text-align:right}
#entry-128 .entry-digits{grid-column:2}
#entry-128 .entry-name{grid-column:1}
.home-screen .entry-options button[aria-pressed=false] .entry-digits,.home-screen .entry-options button[aria-pressed=false] .entry-name{color:#a39ca1}
.home-screen>.primary{font-size:16px;font-weight:500;letter-spacing:.7px}
.home-screen .friend-button{min-height:35px;margin:15px auto 0;padding:7px 14px;color:#8e8790}
.home-data-link{display:flex;justify-content:center;align-items:center;width:fit-content;margin:1px auto 0;padding:7px 14px;color:#8e8790}
.home-data-link:hover{color:var(--red)}
.home-screen .friend-button,.home-data-link{font-size:12px;font-weight:400;gap:10px;letter-spacing:.7px;line-height:1.7}
.home-screen .friend-button span,.home-data-link span{font-size:13px;font-weight:400}
@media(max-width:360px){.home-screen .entry-options button{grid-template-columns:44px minmax(0,1fr);column-gap:5px;padding:7px 5px;min-height:0}.home-screen #entry-128{grid-template-columns:minmax(0,1fr) 44px}.entry-digits{width:44px;height:31px}.entry-name{font-size:12px}}

.home-secondary-links{display:flex;justify-content:center;align-items:center;gap:25px;margin:17px 0 0}
.home-screen .home-secondary-links .friend-button,.home-screen .home-secondary-links .home-data-link{margin:0;padding:8px 0;min-height:35px;width:auto;white-space:nowrap}
@media(max-width:360px){.home-secondary-links{gap:18px}.home-screen .home-secondary-links .friend-button,.home-screen .home-secondary-links .home-data-link{font-size:11px;gap:6px}}

