@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;800;900&display=swap";:root{font-family:Noto Sans JP,sans-serif;color:#fff;background:#063b83}*{box-sizing:border-box}body{margin:0;min-width:320px}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:4px solid #f2fb25;outline-offset:3px}.app,.screen{width:100vw;height:100dvh;min-height:550px;overflow:hidden}.screen{position:relative}.primary{border:0;border-radius:4px;background:#fff;color:#0759b6;font-weight:900}.primary:hover{background:#eff6ff}.eyebrow{font-size:clamp(13px,1.3vw,22px);font-weight:800;letter-spacing:.17em}header{height:9%;min-height:58px;padding:0 3.5%;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:3;font-size:clamp(16px,1.6vw,27px)}header button{border:0;background:none;font-weight:800;font-size:inherit}.home-screen,.selection-screen,.setup-screen,.results-screen,.settings-screen{background:#075cbd}.home-image{position:absolute;top:0;right:0;bottom:0;left:52%;background-size:cover;background-position:30% center}.blue-slab{position:absolute;top:0;right:46%;bottom:0;left:0;background:#075cbd;box-shadow:50px 0 75px #075cbd}.home-content{position:absolute;left:4%;top:31%;width:47%;z-index:2}.home-content h1{font-size:clamp(54px,7.4vw,138px);line-height:1.2;letter-spacing:-.06em;margin:1.5% 0 7%;font-weight:900}.big-action{width:100%;height:clamp(90px,15vh,150px);padding:0 6%;display:flex;align-items:center;justify-content:space-between;font-size:clamp(38px,5.4vw,86px)}.big-action span{font-weight:400}.home-actions{display:flex;gap:3%;margin-top:3%}.home-actions button{flex:1;height:clamp(75px,12vh,120px);background:transparent;border:4px solid #fff;border-radius:4px;font-weight:900;font-size:clamp(21px,3vw,50px)}.home-actions button:hover{background:#fff2}.pitch{position:absolute;top:0;left:0;right:0;height:19%;z-index:2;background:#0d58c535;overflow:hidden}.pitch-grid{position:absolute;top:12%;right:0;bottom:0;left:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(16.66% - 1px),#ffffff88 calc(16.66% - 1px),#ffffff88 16.66%)}.note{position:absolute;height:7%;min-height:7px;border:1px solid #f7ff9a;border-radius:3px;background:#edfb25;box-shadow:0 0 4px #f9ff88}.note.future{background:#253c5e;border-color:#bac7d7;box-shadow:none}.pitch.live{height:20%;background:#102d5544}.playhead{position:absolute;top:5%;left:70%;height:92%;width:3px;background:#ff9826;box-shadow:0 0 8px #ff9f29}.selection-screen:before,.setup-screen:before,.results-screen:before,.settings-screen:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 45%,#1b83df 0,#075cbd 63%,#064896)}.selection-body{height:81%;display:flex;gap:1%;align-items:stretch;justify-content:center;padding:0 1.5%;position:relative}.arrow{width:5%;border:0;background:none;font-size:clamp(60px,8vw,140px);font-weight:400}.rail{width:12%;display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;font-size:clamp(40px,5.5vw,100px);font-weight:900;letter-spacing:.12em;border-radius:4px}.purple{background:#844ac0}.orange{background:#e78220}.green{background:#35a458}.cyan{background:#20b1cf}.speech-card{width:40%;background:#fff;color:#0756af;border:7px solid #fff;display:flex;flex-direction:column;border-radius:4px}.card-image{height:47%;background-size:cover;background-position:center 56%}.card-copy{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.card-copy small{font-size:clamp(16px,1.7vw,28px);font-weight:800}.card-copy h2{font-size:clamp(34px,5.1vw,84px);font-weight:900;line-height:1.2;margin:0}.card-copy p{font-size:clamp(15px,1.9vw,30px);margin:0}.card-confirm{height:18%;border:0;background:#075cbd;font-size:clamp(34px,4.5vw,78px);font-weight:900}.card-confirm:hover{background:#044a99}.selection-screen footer{position:relative;text-align:center;font-size:clamp(14px,1.3vw,22px);padding-top:1%}.setup-image,.results-image{position:absolute;top:9%;bottom:0;left:0;width:58%;background-size:cover;background-position:30% center}.setup-panel,.results-panel{position:absolute;top:9%;right:0;bottom:0;width:42%;background:#075cbd;padding:3% 3.5%;display:flex;flex-direction:column}.setup-panel h2,.results-panel h2{font-size:clamp(40px,5vw,88px);font-weight:900;line-height:1.2;margin:1% 0 6%}.key-row{background:#fff;color:#0756b7;display:flex;align-items:center;justify-content:space-between;padding:2% 4%;font-size:clamp(27px,3vw,52px);font-weight:900}.stepper{display:flex;align-items:center;gap:1vw}.stepper button{width:clamp(50px,6vw,95px);height:clamp(50px,6vw,95px);border:0;background:#19b5df;font-size:1.4em;line-height:1}.stepper strong{min-width:2.2em;text-align:center}.mode-row{display:flex;gap:2%;margin:5% 0}.mode-row button{flex:1;min-height:75px;border:3px solid #fff;background:transparent;font-size:clamp(18px,2vw,31px);font-weight:800}.mode-row button.active{background:#fff;color:#0756b7}.setup-start{margin-top:auto;min-height:100px;font-size:clamp(32px,4vw,68px)}.loading-screen{background-color:#075cbd;background-size:cover;background-position:center}.loading-content{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;flex-direction:column}.loading-content h2{font-size:clamp(43px,6vw,100px);margin:1% 0 5%}.loading-content strong{font-size:clamp(45px,7vw,116px)}.loading-content p{font-size:clamp(18px,2vw,31px)}.load-track{width:min(54vw,840px);height:18px;border:2px solid #fff;margin-top:3%;background:#fff2}.load-track span{display:block;height:100%;background:#effb25;transition:width .1s}.performance-screen{background-size:cover;background-position:center}.performance-screen:after{content:"";position:absolute;top:52%;right:0;bottom:0;left:0;background:linear-gradient(transparent,#0008)}.performance-meta{position:absolute;top:21%;left:2%;right:2%;display:flex;justify-content:space-between;font-size:clamp(16px,1.6vw,28px);text-shadow:0 2px 5px #000}.lyrics{position:absolute;bottom:6%;left:4%;right:4%;z-index:1;font-size:clamp(42px,6.1vw,105px);font-weight:900;line-height:1.2;letter-spacing:.03em;text-shadow:-4px -4px #000,4px -4px #000,-4px 4px #000,4px 4px #000,0 7px 10px #000}.current-line{position:relative;white-space:nowrap;width:max-content;max-width:100%}.sung{position:absolute;inset:0 auto auto 0;white-space:nowrap;overflow:hidden;color:#ec0b13}.next-line{margin-left:22%;white-space:nowrap}.performance-buttons{position:absolute;right:2%;bottom:2%;z-index:2;display:flex;gap:10px;font-size:clamp(14px,1.2vw,22px);font-weight:800}.performance-buttons button{border:2px solid #fff;background:#064eaaad;padding:10px 18px}.live-key{display:flex;align-items:center;background:#064eaaad}.live-key span{padding:0 12px}.live-key button{border:0}.pause-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;background:#04244ddd;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:17px}.pause-layer h2{font-size:clamp(54px,7vw,115px);margin:0 0 2%}.pause-layer button{width:min(440px,80vw);min-height:65px;border:2px solid #fff;background:transparent;font-weight:900;font-size:clamp(24px,2.5vw,42px)}.pause-layer button.primary{background:#fff}.results-image{width:52%}.results-panel{width:48%}.results-panel h2{font-size:clamp(40px,4.5vw,78px);margin-bottom:2%}.score-box{border-top:2px solid #ffffff88;border-bottom:2px solid #ffffff88;display:flex;align-items:baseline;justify-content:space-between;padding:3% 0;font-weight:900}.score-box span{font-size:clamp(30px,3vw,54px)}.score-box strong{font-size:clamp(90px,12vw,215px);line-height:1}.score-box small{font-size:.28em}.score-box strong.no-score{font-size:clamp(34px,4vw,68px)}.results-panel p{font-size:clamp(17px,1.6vw,28px)}.result-actions{margin-top:auto;display:grid;grid-template-columns:1fr 1fr;gap:2%}.result-actions button{min-height:85px;border:2px solid #fff;background:transparent;font-size:clamp(20px,2.2vw,40px);font-weight:900}.result-actions button.primary{grid-column:1/-1;background:#fff;color:#0756b7}.settings-content{position:relative;width:min(750px,90%);margin:8% auto}.settings-content h2{font-size:clamp(50px,7vw,100px)}.settings-content>.primary{width:100%;margin-top:30px;padding:15px;font-size:40px}@media(max-width:900px){.rail{width:10%}.speech-card{width:48%}.home-content{width:55%}.home-image{top:0;right:0;bottom:0;left:45%}.blue-slab{right:40%}.setup-image,.results-image{width:48%}.setup-panel,.results-panel{width:52%}.lyrics{font-size:clamp(35px,5.5vw,70px);bottom:13%}}@media(max-width:600px){.app,.screen{min-height:100dvh}.home-image{top:0;right:0;bottom:0;left:0;opacity:.5;background-position:30%}.blue-slab{top:0;right:0;bottom:0;left:0;background:#075cbd88}.home-content{top:34%;left:5%;width:90%}.home-content h1{font-size:16vw}.big-action{height:100px}.home-actions button{font-size:22px;height:70px}.selection-body{height:78%;padding:4% 1%}.rail{display:none}.speech-card{width:78%}.arrow{width:10%}.card-image{height:45%}.card-copy h2{font-size:9vw}.card-copy p{font-size:4vw}.setup-image,.results-image{top:9%;right:0;bottom:45%;left:0;width:100%}.setup-panel,.results-panel{top:55%;width:100%;padding:5%}.setup-panel h2,.results-panel h2{font-size:9vw;margin:1% 0}.key-row{font-size:6vw;padding:1% 4%}.stepper button{width:50px;height:50px}.mode-row{margin:2% 0}.mode-row button{min-height:55px;font-size:4vw}.setup-start{min-height:70px}.results-panel{top:49%}.results-image{bottom:51%}.score-box strong{font-size:20vw}.result-actions button{min-height:60px}.performance-screen{background-position:35%}.pitch.live{height:21%}.performance-meta{top:22%}.lyrics{bottom:18%;font-size:8vw}.next-line{margin-left:8%}.performance-buttons{right:2%;bottom:2%}}.home-content{top:29%;width:50%}.home-content h1{font-size:clamp(42px,5.4vw,98px);white-space:nowrap;margin:1.5% 0 8%}@media(max-width:600px){.home-content{top:34%;width:90%}.home-content h1{font-size:9vw;white-space:nowrap}}.card-confirm{color:#fff}.performance-screen{background-size:145% auto;background-position:left center}@media(max-width:600px){.performance-screen{background-size:auto 100%;background-position:32% center}}.pitch-chart{position:absolute;inset:0 0 auto;height:20%;z-index:2;overflow:hidden;background:#082a59a6;border-bottom:1px solid #ffffff88}.pitch-chart .pitch-grid{position:absolute;top:7%;right:0;bottom:7%;left:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(16.66% - 1px),#ffffff6b calc(16.66% - 1px),#ffffff6b 16.66%)}.pitch-note{position:absolute;height:7%;min-height:8px;border:1px solid #d1d8e4;border-radius:3px;background:#263d59d9;box-shadow:0 1px 2px #0008;transition:background .16s,box-shadow .16s}.pitch-note.note-guide{background:#deec65;border-color:#f9ffa9;box-shadow:0 0 3px #e8f184}.pitch-note.note-missed{background:#263d59d9;border-color:#bdc7d7;box-shadow:none}.pitch-note.note-hit{background:#54f0a0;border-color:#b5ffdd;box-shadow:0 0 9px #5bffad}.pitch-playhead{position:absolute;top:4%;height:92%;width:3px;background:#ff9826;box-shadow:0 0 9px #ff9826}.input-pitch{position:absolute;width:15px;height:15px;border-radius:50%;background:#71dcff;border:2px solid #fff;box-shadow:0 0 10px #5ed8ff;transform:translate(-50%,-50%)}.pitch-page{position:absolute;right:1.5%;top:2%;font-size:clamp(15px,1.25vw,23px);font-weight:900;text-shadow:0 2px 3px #000}.pitch-decor{height:19%;background:#075cbd66}.pitch-decor .pitch-note{background:#ecfb29;border-color:#faff9a;box-shadow:0 0 6px #f9ff81}.selection-screen header{display:grid;grid-template-columns:1fr 1fr 1fr}.selection-screen header b{text-align:center}.selection-screen header button:last-child{text-align:right}.carousel-shell{position:relative;height:81%;display:flex;align-items:stretch;padding:0 1%;overflow:hidden}.carousel-stage{position:relative;flex:1;min-width:0;overflow:hidden}.carousel-arrow{width:5%;border:0;background:transparent;font-size:clamp(60px,8vw,140px);line-height:1;z-index:4}.carousel-arrow:disabled{opacity:.25;cursor:default}.carousel-card{position:absolute;top:0;bottom:0;width:12vw;transform:translate(-50%);border:4px solid #ffffffb8;border-radius:4px;overflow:hidden;transition:left .43s cubic-bezier(.2,.75,.2,1),width .43s cubic-bezier(.2,.75,.2,1),border-color .43s;cursor:pointer;box-shadow:0 14px 25px #04204c45}.carousel-card.active{width:40vw;max-width:690px;border:7px solid #fff;cursor:default;display:flex;flex-direction:column}.vertical-label{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:-.06em;font-size:clamp(27px,3.2vw,54px);font-weight:900;white-space:nowrap;height:100%;width:100%;display:flex;align-items:center;justify-content:center;padding:5%}.vertical-label.latin{text-orientation:mixed;letter-spacing:0;white-space:nowrap}.carousel-photo{height:46%;flex:none;background-size:cover;background-position:center 73%;background-color:#284b70}.carousel-photo.placeholder-image{display:grid;place-items:center;background:#173f78;color:#b6c9e0;font-size:clamp(30px,4vw,65px);font-weight:900}.carousel-copy{flex:1;background:#fff;color:#0758b7;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2%}.carousel-kicker{font-size:clamp(17px,1.7vw,27px);font-weight:900}.carousel-copy h2{font-size:clamp(44px,5vw,84px);line-height:1.2;margin:0;font-weight:900;white-space:nowrap}.carousel-copy p{font-size:clamp(19px,2vw,32px);margin:0;font-weight:800}.scene-line{font-size:clamp(15px,1.35vw,23px);font-weight:700;margin-top:1.5%}.carousel-actions{height:19%;display:flex;background:#fff;gap:1%;padding-top:1%}.carousel-actions button{flex:1;border:0;font-size:clamp(25px,2.6vw,45px);font-weight:900}.listen-button{background:#e8f0fa;color:#0758b7}.select-confirm{background:#0758b7;color:#fff}.select-confirm:hover{background:#03478f}.carousel-unavailable{background:#fff;color:#45617e;height:19%;display:grid;place-items:center;font-weight:900;font-size:clamp(22px,2.4vw,40px)}.selection-screen footer{position:relative;height:10%;padding-top:1%;text-align:center;font-size:clamp(16px,1.4vw,24px);font-weight:700}.loading-screen{background-position:center 64%}.load-track span{width:15%}.load-track.ready span{width:100%;transition:width 1.6s linear}.loading-content strong{min-height:1.35em;font-variant-numeric:tabular-nums}.loading-cancel{margin-top:2%;padding:12px 24px;border:2px solid #fff;background:#062c64aa;font-size:clamp(17px,1.8vw,28px);font-weight:800}.error-content{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;height:100%;gap:20px;text-align:center}.error-content h2{font-size:clamp(44px,6vw,96px);margin:0}.error-content p{font-size:clamp(23px,2.5vw,40px)}.error-content button{min-width:360px;min-height:75px;font-weight:900;font-size:clamp(23px,2.7vw,42px);border:2px solid #fff;background:transparent}.error-content button.primary{background:#fff}.performance-screen{background-size:cover;background-position:center 67%}.performance-screen:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#051e48a1;pointer-events:none}.performance-screen:after{background:linear-gradient(transparent,#000b)}.performance-meta{z-index:1}.lyrics{font-size:clamp(38px,5.2vw,84px);bottom:7%;line-height:1.23;letter-spacing:-.035em}.next-line{font-size:clamp(30px,3.7vw,62px);margin-left:13%;opacity:.96}.performance-buttons{align-items:center}.voice-indicator{padding:10px 18px;border:2px solid #fff;background:#153b67bf}.voice-indicator.active{border-color:#6fe8ff;color:#d9faff}.results-image{background-position:center 66%}@media(max-width:900px){.carousel-card.active{width:48vw}.carousel-card{width:13vw}.carousel-copy h2{font-size:5vw}.scene-line{font-size:1.5vw}.carousel-actions button{font-size:2.5vw}}@media(max-width:600px){.carousel-shell{height:79%}.carousel-arrow{width:11%;font-size:16vw}.carousel-card{width:20vw}.carousel-card.active{width:74vw}.vertical-label{font-size:6vw}.carousel-photo{height:43%}.carousel-copy h2{font-size:9vw}.carousel-copy p{font-size:4vw}.scene-line{font-size:3vw}.carousel-actions button{font-size:4vw}.performance-screen{background-size:auto 100%;background-position:50% center}.lyrics{font-size:7vw;bottom:17%}.next-line{font-size:5vw;margin-left:0}.performance-buttons{font-size:3vw}}.pitch-note.note-guide{background:#d9e863;border-color:#f0f9ae;box-shadow:0 0 3px #e8f184}.pitch-chart .pitch-note{height:4%;min-height:7px}.pitch-match{position:absolute;z-index:4;height:4%;min-height:7px;background:#fff400;border:1px solid #fff9a2;border-radius:2px;box-shadow:0 0 8px #fff400,0 0 16px #ffe400;pointer-events:none}.pitch-trace{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:5;overflow:visible;pointer-events:none}.pitch-trace polyline{fill:none;stroke:#54e5fa;stroke-width:.45;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 2px #1ac9ed)}.pitch-playhead{z-index:6}.guide-toggle{min-width:145px}.outro-badge{position:absolute;top:5%;right:4%;z-index:2;padding:.35em .85em;background:#092d64cc;border:2px solid #fff;font-size:clamp(24px,3vw,52px);font-weight:900}@media(max-width:600px){.performance-buttons{gap:4px}.performance-buttons button,.voice-indicator{padding:7px 8px}.guide-toggle{min-width:0}.pitch-trace polyline{stroke-width:.8}}.performance-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;pointer-events:none}.performance-screen.has-video:before{z-index:1;background:#06152555}.performance-screen.has-video:after{z-index:1}.performance-screen.has-video .performance-meta,.performance-screen.has-video .lyrics{z-index:3}.performance-screen.has-video .performance-buttons{z-index:4}.lyrics.intro{bottom:15%}.lyrics.intro .next-line{margin-left:0}.source-credit{position:absolute;right:3%;bottom:18%;color:#fff;font-size:clamp(13px,1.15vw,18px);text-decoration:underline;text-underline-offset:3px}.carousel-copy h2.japanese{font-size:clamp(29px,3.3vw,58px);letter-spacing:-.06em}.lyrics.japanese{bottom:14%}.lyrics.japanese .next-line{font-size:clamp(27px,3.1vw,52px)}.source-caption-mask{position:absolute;inset:20% auto 0 0;width:60%;z-index:2;background:linear-gradient(90deg,#10294a 0%,#10294a 80%,transparent 100%);pointer-events:none}.source-caption-mask:after{content:"";position:fixed;left:0;right:0;bottom:0;height:18%;background:#10294a}.broadcast-caption-cover{position:absolute;left:0;right:0;bottom:0;height:28%;z-index:2;background:linear-gradient(transparent 0%,#071d3bd9 28%,#071d3b 76%);pointer-events:none}@media(max-width:600px){.source-credit{right:4%;bottom:5%;font-size:10px;max-width:70%;text-align:right}}