:root{--ink:#05060f;--ink-2:#0b1030;--ink-3:#131a45;--panel:#0a102cd1;--line:#78a0ff47;--cyan:#46e8ff;--magenta:#ff3fa4;--gold:#ffd76a;--silver:#d9e4f2;--bronze:#e2915a;--hoya:#f04a34;--text:#eef3ff;--text-dim:#97a6cc;--font-display:"Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", system-ui, sans-serif;--font-lyric:"Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", "Shippori Mincho", serif;--stage-w:min(100vw, 480px);--radius:14px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--ink);margin:0;padding:0;overflow-x:hidden}body{font-family:var(--font-display);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer;font-family:inherit}:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}.app{max-width:480px;min-height:100dvh;padding-bottom:env(safe-area-inset-bottom);background:radial-gradient(120% 60% at 50% -10%, #46e8ff29, transparent 60%), radial-gradient(90% 45% at 15% 8%, #ff3fa424, transparent 65%), linear-gradient(180deg, var(--ink-2) 0%, var(--ink) 55%);margin:0 auto;position:relative;overflow-x:hidden}.screen{padding:14px 14px 96px}.screen--bare{padding-bottom:14px}.beams{pointer-events:none;height:320px;position:absolute;inset:0 0 auto;overflow:hidden;-webkit-mask-image:linear-gradient(#000 30%,#0000 100%);mask-image:linear-gradient(#000 30%,#0000 100%)}.beams span{transform-origin:top;filter:blur(9px);opacity:.45;width:22px;height:420px;position:absolute;top:-60px;left:50%}.beams span:first-child{background:linear-gradient(180deg, var(--cyan), transparent);transform:rotate(-34deg)}.beams span:nth-child(2){background:linear-gradient(180deg, var(--magenta), transparent);transform:rotate(-12deg)}.beams span:nth-child(3){background:linear-gradient(180deg, var(--gold), transparent);transform:rotate(12deg)}.beams span:nth-child(4){background:linear-gradient(180deg, var(--cyan), transparent);transform:rotate(34deg)}.brand{text-align:center;padding:22px 0 6px;position:relative}.brand__logo{letter-spacing:.06em;margin:0;font-size:clamp(30px,9.4vw,42px);font-weight:800;line-height:1.1}.brand__logo .c{color:#d9fbff;text-shadow:0 0 6px var(--cyan), 0 0 22px #46e8ffd9}.brand__logo .m{color:#ffe2f1;text-shadow:0 0 6px var(--magenta), 0 0 22px #ff3fa4d9}.brand__ribbon{letter-spacing:.18em;color:var(--gold);clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,8px 100%,0 50%);background:linear-gradient(#241a05,#0a0a16);border:1px solid #ffd76a8c;margin-top:10px;padding:5px 22px;font-size:14px;font-weight:700;display:inline-block}.brand__note{color:var(--text-dim);margin:10px 0 0;font-size:12px}.page-head{align-items:center;gap:10px;padding:8px 0 14px;display:flex}.page-head h2{letter-spacing:.06em;margin:0;font-size:19px}.back{border:1px solid var(--line);background:#ffffff0a;border-radius:50%;flex:none;width:38px;height:38px;font-size:17px;line-height:1}.rank-board{border-radius:var(--radius);border:1px solid var(--line);background:linear-gradient(#ffffff0d,#0000004d);gap:8px;padding:10px;display:grid}.rank-row{text-align:left;background:#030510b8;border:1px solid #ffffff1f;border-radius:10px;align-items:center;gap:8px;width:100%;padding:7px 8px;display:flex}.rank-row--1{border-color:var(--gold);box-shadow:0 0 0 1px #ffd76a4d,0 0 22px #ffd76a40}.rank-row--2{border-color:var(--silver);box-shadow:0 0 18px #d9e4f22e}.rank-row--3{border-color:var(--bronze);box-shadow:0 0 18px #e2915a33}.rank-badge{width:40px;height:34px;color:var(--text-dim);background:#ffffff0d;border-radius:8px;flex:none;place-items:center;font-size:15px;font-weight:800;display:grid}.rank-row--1 .rank-badge,.rank-row--2 .rank-badge,.rank-row--3 .rank-badge{width:52px;height:44px;font-size:22px}.rank-row--1 .rank-badge{color:#1a1200;background:linear-gradient(160deg, #ffe9a8, var(--gold) 45%, #b8860b)}.rank-row--2 .rank-badge{color:#14161c;background:linear-gradient(160deg, #fff, var(--silver) 45%, #8b97a8)}.rank-row--3 .rank-badge{color:#1a0d02;background:linear-gradient(160deg, #f6c79a, var(--bronze) 45%, #94531f)}.rank-title{letter-spacing:.02em;text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;font-size:17px;font-weight:700;overflow:hidden}.rank-nums{color:var(--text-dim);text-align:right;flex:none;font-size:10px;line-height:1.35}.flap{--flap-gap:3px;gap:var(--flap-gap);flex:auto;min-width:0;display:flex}.flap__cell{width:calc((100% - (var(--n) - 1) * var(--flap-gap)) / var(--n));aspect-ratio:5/6;font-size:max(9px, min(22px, calc((var(--stage-w) - 9.5rem) / var(--n) * .74)));color:#f2f5ff;background:linear-gradient(#23262f 0%,#171a22 49%,#0e1017 51%,#1c1f28 100%);border-radius:4px;place-items:center;font-weight:700;line-height:1;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff17}.flap__cell:after{content:"";background:#000000d9;height:1px;position:absolute;top:50%;left:0;right:0}.flap__char{transform-origin:50%;display:block}.flap__cell--spinning .flap__char{animation:90ms linear flap-turn}.rank-row--1 .flap__cell{color:#fff6d8}.rank-row--2 .flap__cell{color:#f4f8ff}.rank-row--3 .flap__cell{color:#ffe7d0}@keyframes flap-turn{0%{opacity:.55;transform:scaleY(.1)translateY(-22%)}to{opacity:1;transform:scaleY(1)translateY(0)}}.btn{letter-spacing:.08em;color:#050716;background:linear-gradient(100deg, var(--cyan), #b479ff 52%, var(--magenta));border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;width:100%;min-height:52px;padding:12px 16px;font-size:17px;font-weight:800;display:flex;box-shadow:0 0 24px #7882ff66}.btn--ghost{color:var(--text);border:1px solid var(--line);box-shadow:none;letter-spacing:.06em;background:#ffffff0d;font-weight:700}.btn--gold{color:#241a00;background:linear-gradient(100deg, #ffeaa8, var(--gold) 55%, #e0a63a);box-shadow:0 0 24px #ffd76a59}.btn--sm{min-height:42px;font-size:14px}.btn-row{grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;display:grid}.stack{gap:9px;margin-top:14px;display:grid}.search{border:1px solid var(--line);background:#030614cc;border-radius:999px;align-items:center;gap:8px;padding:10px 14px;display:flex}.search input{min-width:0;color:var(--text);background:0 0;border:0;flex:1;font-family:inherit;font-size:15px}.search input::placeholder{color:#6c7ba3}.search input:focus{outline:none}.count{color:var(--text-dim);margin:10px 2px 8px;font-size:12px}.song-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.song-card{text-align:left;border:1px solid var(--line);background:linear-gradient(#ffffff0d,#00000052);border-radius:12px;align-items:center;gap:10px;width:100%;padding:11px 12px;display:flex}.song-card__body{flex:1;min-width:0}.song-card__title{text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:700;overflow:hidden}.song-card__meta{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.chip{font-variant-numeric:tabular-nums;color:#b9f4ff;border:1px solid #46e8ff73;border-radius:6px;padding:2px 8px;font-size:11px}.chip--js{color:#ffc7e4;border-color:#ff3fa480}.empty{text-align:center;color:var(--text-dim);margin-top:28px;font-size:14px;line-height:1.8}.detail-title{letter-spacing:.03em;overflow-wrap:anywhere;margin:4px 0 2px;font-size:25px;font-weight:800;line-height:1.25}.provider-switch{grid-template-columns:1fr 1fr;gap:8px;margin:16px 0 12px;display:grid}.provider-switch button{border:1px solid var(--line);min-height:48px;color:var(--text-dim);letter-spacing:.1em;background:#ffffff0a;border-radius:999px;font-weight:800}.provider-switch button[aria-pressed=true]{color:#eaffff;border-color:var(--cyan);background:#46e8ff1f;box-shadow:0 0 18px #46e8ff4d}.provider-switch button[aria-pressed=true].is-js{color:#ffeaf5;border-color:var(--magenta);background:#ff3fa41f;box-shadow:0 0 18px #ff3fa44d}.number-panel{border-radius:var(--radius);border:1px solid var(--line);text-align:center;background:linear-gradient(#ffffff0f,#00000059);padding:18px 14px 16px}.number-panel__label{letter-spacing:.16em;color:var(--text-dim);font-size:12px}.number-panel__value{font-variant-numeric:tabular-nums;letter-spacing:.04em;color:#fffdf2;text-shadow:0 0 8px var(--gold), 0 0 26px #ffd76a99;margin:6px 0 4px;font-size:clamp(34px,12vw,50px);font-weight:800}.number-panel__hint{color:var(--text-dim);margin:8px 0 0;font-size:13px;line-height:1.6}.copy-state{min-height:18px;color:var(--cyan);margin-top:8px;font-size:12px}.fav-toggle{border:1px solid var(--line);background:#ffffff0a;border-radius:999px;flex:none;min-height:38px;margin-left:auto;padding:0 14px;font-size:13px;font-weight:700}.fav-toggle[aria-pressed=true]{color:var(--gold);background:#ffd76a1f;border-color:#ffd76a99}.lyric-doc{gap:18px;margin-top:6px;display:grid}.lyric-doc section{border:1px solid var(--line);background:#03061499;border-radius:12px;padding:14px}.lyric-doc h3{letter-spacing:.22em;color:var(--cyan);margin:0 0 10px;font-size:12px}.lyric-doc p{font-family:var(--font-lyric);overflow-wrap:anywhere;margin:0 0 6px;font-size:17px;line-height:1.85}.sep{width:.9em;display:inline-block}.stage{background:linear-gradient(#050916,#02030a 60%);flex-direction:column;min-height:100dvh;display:flex;position:relative}.stage__bar{padding:calc(env(safe-area-inset-top) + 8px) 12px 8px;color:var(--text-dim);border-bottom:1px solid #ffffff14;align-items:center;gap:8px;font-size:12px;display:flex}.stage__song{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:700;overflow:hidden}.stage__num{font-variant-numeric:tabular-nums;color:var(--gold);flex:none;margin-left:auto}.stage__progress{background:#ffffff14;height:4px}.stage__progress i{background:linear-gradient(90deg, var(--cyan), var(--magenta));height:100%;transition:width .14s ease-out;display:block}.stage__main{flex-direction:column;flex:1;justify-content:center;gap:22px;padding:20px 18px 8px;display:flex;position:relative}.stage__section{letter-spacing:.24em;color:var(--cyan);font-size:12px;position:absolute;top:10px;left:18px}.stage__counter{font-variant-numeric:tabular-nums;color:var(--text-dim);font-size:12px;position:absolute;top:10px;right:18px}.lyric-now{font-family:var(--font-lyric);color:#fff2f8;text-shadow:0 0 3px #000000e6, 0 0 12px var(--magenta), 0 0 34px #ff3fa48c;overflow-wrap:anywhere;font-size:clamp(28px,8.6vw,40px);font-weight:700;line-height:1.45}.lyric-next{font-family:var(--font-lyric);color:#e2eafa9e;text-shadow:0 0 3px #000000e6;overflow-wrap:anywhere;font-size:clamp(17px,5vw,23px);line-height:1.5}.lyric-next__label{font-family:var(--font-display);letter-spacing:.2em;color:var(--text-dim);margin-bottom:4px;font-size:11px;display:block}.lyric-end{text-align:center;font-family:var(--font-lyric);color:var(--gold);text-shadow:0 0 22px #ffd76a99;font-size:clamp(30px,9vw,42px);font-weight:700}.tap-zone{color:#0000;background:0 0;border:0;width:44%;font-size:0;position:absolute;top:0;bottom:0}.tap-zone--prev{left:0}.tap-zone--next{width:56%;right:0}.tap-zone:active{background:#ffffff0d}.stage__controls{z-index:2;padding:10px 12px calc(env(safe-area-inset-bottom) + 12px);background:#02030ae6;border-top:1px solid #ffffff14;grid-template-columns:1fr 1fr;gap:8px;display:grid;position:relative}.stage__controls .btn{min-height:58px}.stage__controls .sub{grid-column:span 2;grid-template-columns:repeat(3,1fr);gap:8px;display:grid}@media (orientation:landscape) and (height<=520px){.stage__main{padding:12px 16px 4px}.lyric-now{font-size:clamp(24px,5.4vh,34px)}.stage__controls .btn{min-height:46px}}.tabbar{z-index:5;width:100%;max-width:480px;padding:8px 6px calc(env(safe-area-inset-bottom) + 8px);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#030510f0;border-top:1px solid #ffffff1a;grid-template-columns:repeat(3,1fr);display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.tabbar button{color:var(--text-dim);letter-spacing:.05em;background:0 0;border:0;padding:6px 0;font-size:12px;font-weight:700}.tabbar button[aria-current=page]{color:var(--cyan);text-shadow:0 0 12px #46e8ffb3}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}