.ss{margin:28px 0 0;color:#fff}.ss[hidden]{display:none}.ss-head{margin-bottom:22px}.ss-eyebrow{margin:0 0 8px;font:700 11.5px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:#b9a1ff}.ss-title{margin:0 0 8px;font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-.03em;line-height:1.15;color:#fff}.ss-sub{margin:0;max-width:560px;font-size:14.5px;line-height:1.6;color:#b7acd0}.ss-note{margin:0 0 16px;padding:10px 14px;border-radius:12px;background:#3b0a1a;color:#fecaca;font-size:14px}.ss-note[hidden]{display:none}.ss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin:0;padding:0;list-style:none}.ss-card{all:unset;box-sizing:border-box;display:flex;flex-direction:column;width:100%;height:100%;padding:9px;border-radius:16px;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff17;transition:background-color .18s,border-color .18s,transform .18s,box-shadow .18s}.ss-card:hover,.ss-card:focus-visible{background:#ffffff17;border-color:#a78bfa88;transform:translateY(-2px);box-shadow:0 18px 30px -20px #000}.ss-card:focus-visible{outline:2px solid #c4b5fd;outline-offset:2px}.ss-card[disabled]{cursor:progress;opacity:.7}.ss-card[aria-busy=true]{opacity:1;border-color:#a78bfa}.ss-art{position:relative;aspect-ratio:16 / 9;overflow:hidden;border-radius:10px;background:linear-gradient(135deg,#3b1d7a,#7c3aed66)}.ss-art img{display:block;width:100%;height:100%;object-fit:cover}.ss-art.cover img.back{position:absolute;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);filter:blur(16px) saturate(1.2);opacity:.7}.ss-art.cover img.front{position:relative;width:auto;height:100%;margin:0 auto;aspect-ratio:1;border-radius:6px;box-shadow:0 6px 18px -6px #0008}.ss-time{position:absolute;right:7px;bottom:7px;padding:2px 6px;border-radius:6px;background:#0d0019cc;font:600 11px/1.5 var(--font-mono);color:#fff}.ss-go{position:absolute;inset:0;display:grid;place-items:center;background:#1a053399;font:700 13.5px var(--font-sans);color:#fff;opacity:0;transition:opacity .18s}.ss-card:hover .ss-go,.ss-card:focus-visible .ss-go,.ss-card[aria-busy=true] .ss-go{opacity:1}.ss-body{display:flex;flex:1;flex-direction:column;gap:3px;padding:10px 3px 3px}.ss-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:0;min-height:2.6em;font-size:14px;font-weight:700;line-height:1.3;color:#fff}.ss-by{margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;color:#b7acd0}.ss-foot{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:9px}.ss-why{padding:2px 8px;border-radius:999px;background:#7c3aed40;font:650 11px/1.5 var(--font-sans);color:#d9ccff}.ss-chord{padding:2px 6px;border-radius:6px;background:#ffffff14;font:700 11px/1.5 var(--font-mono);color:#e4dcf5}@media(max-width:640px){.ss{margin-top:24px}.ss-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ss-card{padding:7px}.ss-name{font-size:13px}}@media(prefers-reduced-motion:reduce){.ss-card{transition:none}.ss-card:hover,.ss-card:focus-visible{transform:none}}.rt{margin-top:16px;padding:14px 16px 12px;border-radius:12px;background:#f1eff5;color:var(--color-ink)}.rt[hidden]{display:none}.rt-q{margin:0 0 10px;font-size:14px;font-weight:500;line-height:1.45}.rt-stars{display:flex;gap:6px}.rt-star{display:grid;place-items:center;flex:1 1 0;max-width:44px;aspect-ratio:1;padding:0;border:0;border-radius:7px;background:#dddae3;cursor:pointer;transition:background-color .12s,transform .12s}.rt-star svg{width:62%;height:62%;fill:#fff;stroke:#fff;stroke-width:1.2;stroke-linejoin:round}.rt-star:hover{transform:translateY(-1px)}.rt-star:focus-visible{outline:2px solid var(--color-violet);outline-offset:2px}.rt-star[data-on="1"]{background:#ef4444}.rt-star[data-on="2"]{background:#f97316}.rt-star[data-on="3"]{background:#eab308}.rt-star[data-on="4"]{background:#84cc16}.rt-star[data-on="5"]{background:#22c55e}.rt-stars.is-busy{opacity:.6;pointer-events:none}.rt-label{margin:9px 0 0;font-size:13.5px;font-weight:650;color:var(--color-body)}.rt-more{margin-top:12px;padding-top:12px;border-top:1px solid #dddae3}.rt-more[hidden]{display:none}.rt-ask{display:block;margin-bottom:6px;font-size:13px;font-weight:600}.rt-ask span{font-weight:500;color:var(--color-mute)}.rt-more textarea{box-sizing:border-box;width:100%;padding:9px 11px;border:1px solid #cfcad9;border-radius:8px;background:#fff;font:400 13.5px/1.45 var(--font-sans);color:var(--color-ink);resize:vertical}.rt-more textarea:focus{outline:2px solid var(--color-violet);outline-offset:1px;border-color:transparent}.rt-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}.rt-count{font:500 11.5px var(--font-mono);color:var(--color-mute)}.rt-send{height:32px;padding:0 16px;border:0;border-radius:999px;background:var(--color-violet);color:#fff;font:650 13px var(--font-sans);cursor:pointer}.rt-send:hover{background:var(--color-violet-deep)}.rt-send:disabled{opacity:.6;cursor:default}.rt-error{margin:8px 0 0;font-size:13px;color:var(--color-error)}.rt-error[hidden]{display:none}.sd-rate{display:inline-flex;align-items:baseline;gap:5px}.sd-rate b{font-weight:800}.sd-rate i{font-style:normal;color:#f59e0b}.sd-rate span{font-weight:500;font-size:13px;color:var(--color-mute)}.sd-rate.is-none{font-weight:500;color:var(--color-mute)}@media(prefers-reduced-motion:reduce){.rt-star{transition:none}.rt-star:hover{transform:none}}.sm-card{position:relative;overflow:hidden;padding:20px 22px 18px;border-radius:20px;background:radial-gradient(120% 150% at 0% 0%,#2b1264,#170b33 46%,#0f0623);border:1px solid #ffffff17;box-shadow:0 30px 60px -34px #000c,inset 0 1px #ffffff14;color:#e4dcf5}.sm-card:before{content:"";position:absolute;top:-170px;right:-110px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,#7c3aed4d,transparent 66%);pointer-events:none;will-change:transform}.sm-card.is-live:before{animation:sm-drift 10s ease-in-out infinite alternate}.sm-card>*{position:relative}.sm-card[hidden]{display:none}.sm-head{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap}.sm-ttl{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.sm-head h2,.sp-block .sm-ttl h2{margin:0;font-size:18px;font-weight:700;letter-spacing:-.02em;color:#fff}.sm-pill{padding:3px 10px;border-radius:999px;background:#ffffff14;border:1px solid #ffffff1c;font:600 11px var(--font-mono);letter-spacing:.03em;color:#cdbdf5}.sm-pill.is-heard{background:#fcd34d22;border-color:#fcd34d55;color:#fde68a}.sm-seg{display:inline-flex;padding:3px;border-radius:999px;background:#ffffff12}.sm-seg button{height:28px;padding:0 13px;border:0;border-radius:999px;background:transparent;font:650 12px var(--font-sans);color:#c9bbf0;cursor:pointer;transition:background-color .15s,color .15s}.sm-seg button:hover{color:#fff}.sm-seg button.is-on{background:#fff;color:#1a0d33}.sm-label{margin:14px 0 0!important;font:600 12.5px var(--font-mono)!important;letter-spacing:.06em;color:#b9a8e8!important}.sm-tiles{display:grid;grid-template-columns:repeat(var(--cols, 8),minmax(0,60px));gap:8px;justify-content:start;margin:12px 0 16px;padding:4px 0 8px}.sm-tile{position:relative;overflow:hidden;aspect-ratio:1 / 1;display:grid;place-items:center;align-content:center;gap:4px;border-radius:14px;background:linear-gradient(160deg,#7e3ff1,#5421b8);border:1px solid #ffffff2b;box-shadow:inset 0 1px #ffffff3d,0 8px 16px -10px #5b21b6;color:#fff;transition:transform .24s cubic-bezier(.3,1.6,.5,1)}.sm-tile:before{content:"";position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}.sm-tile .sm-ar{display:grid;place-items:center;line-height:0}.sm-tile svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.sm-tile small{font:600 10.5px/1 var(--font-mono);color:#ffffffb3}.sm-tile.is-rest{background:#1a1037;border:1px dashed #ffffff1f;box-shadow:none;color:#6f5fa8}.sm-tile.is-rest small{color:#6f5fa8}.sm-tile.is-now{z-index:1;transform:translateY(-3px) scale(1.08);box-shadow:0 0 0 2px #fcd34d,0 0 14px #f59e0b88}.sm-tile.is-now:before{animation:sm-flash .3s ease-out}.sm-tile.is-rest.is-now{box-shadow:0 0 0 2px #fcd34d66}.sm-tile.is-rest.is-now:before{display:none}.sm-tile.is-now.is-down .sm-ar{animation:sm-down .45s ease-out}.sm-tile.is-now.is-up .sm-ar{animation:sm-up .45s ease-out}.sm-text{margin:0!important;font-size:14.5px!important;line-height:1.65!important;color:#d6cbef!important}.sm-text b,.sm-how b{color:#fff}.sm-how{margin-top:10px}.sm-how summary{display:inline-flex;align-items:center;gap:6px;font:650 13px var(--font-sans);color:#c7b5ff;cursor:pointer;list-style:none}.sm-how summary::-webkit-details-marker{display:none}.sm-how summary:after{content:"+";display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#ffffff14;font-size:14px;line-height:1;transition:transform .2s}.sm-how[open] summary:after{content:"–"}.sm-how>div{margin-top:8px;font-size:14px;line-height:1.7;color:#cbbfe8}.sm-how>div p{margin:0 0 8px!important;font-size:14px!important;line-height:1.7!important;color:#cbbfe8!important}.sm-note{margin:12px 0 0!important;font-size:12px!important;line-height:1.5;color:#8f81b8!important}@keyframes sm-flash{0%{opacity:.38}to{opacity:0}}@keyframes sm-down{0%{transform:translateY(-6px)}45%{transform:translateY(4px)}to{transform:translateY(0)}}@keyframes sm-up{0%{transform:translateY(6px)}45%{transform:translateY(-4px)}to{transform:translateY(0)}}@keyframes sm-drift{to{transform:translate(-36px,26px) scale(1.12)}}@media(max-width:640px){.sm-card{padding:16px 14px 14px;border-radius:18px}.sm-tiles{gap:6px}.sm-tile{border-radius:11px}.sm-tile svg{width:17px;height:17px}.sm-tile small{font-size:9.5px}}@media(prefers-reduced-motion:reduce){.sm-card:before,.sm-tile.is-now,.sm-tile.is-now:before,.sm-tile.is-now .sm-ar{animation:none!important}.sm-tile{transition:none}.sm-tile.is-now{transform:none}}html.perf-lite .sm-card:before,html.perf-lite .sm-tile.is-now:before,html.perf-lite .sm-tile.is-now .sm-ar{animation:none!important}html.perf-lite .sm-tile{transition:none}html.perf-lite .sm-tile.is-now{box-shadow:0 0 0 2px #fcd34d;transform:none}html.perf-lite .cr-track{transition-duration:.2s}html.perf-lite .cr-card{transition:none}html.perf-lite .ph{box-shadow:0 2px 6px #0d001f40}.tl-card{background:var(--color-canvas);border:1px solid var(--color-hairline);overflow:clip;box-shadow:0 1px 2px #0d001f0a,0 12px 32px -12px #5b21b62e}.tl-tabs{position:sticky;top:calc(72px + var(--ph-h, 190px) + 8px);z-index:25;padding:8px 10px;height:0;overflow:visible;pointer-events:none}.tl-tabs .tl-seg{pointer-events:auto;background:#ede9feeb;backdrop-filter:blur(6px);box-shadow:0 2px 8px -2px #0d001f40}.dg-bar{padding:10px 12px;display:flex;justify-content:flex-end;border-bottom:1px solid var(--color-hairline);background:var(--color-canvas-soft)}.tl-seg{display:inline-flex;gap:2px;padding:3px;border-radius:999px;background:var(--color-violet-soft)}.tl-tab{height:32px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:var(--color-violet-deep);font-size:13px;font-weight:600;cursor:pointer;transition:background-color .15s,color .15s,box-shadow .15s}.tl-tab:hover{color:var(--color-ink)}.tl-tab.is-active{background:var(--color-canvas);color:var(--color-ink);box-shadow:0 1px 3px #0d001f24}.tl-tab:focus-visible{outline:2px solid var(--color-violet);outline-offset:2px}.bs{--bw: 44px;--gap: 4px;--pad: 7px;position:relative;background:var(--color-canvas)}.bs-scroll{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--color-violet) var(--color-hairline);background:var(--color-hairline)}.bs-scroll::-webkit-scrollbar{height:10px}.bs-scroll::-webkit-scrollbar-track{background:var(--color-hairline)}.bs-scroll::-webkit-scrollbar-thumb{background:var(--color-violet);border-radius:5px;border:2px solid var(--color-hairline)}.bs-track{position:relative;display:flex;align-items:center;gap:var(--gap);width:max-content;padding:var(--pad) 10px;background:var(--color-canvas)}.bs-cell{position:relative;flex:0 0 var(--bw);width:var(--bw);height:var(--bw);box-sizing:border-box;display:grid;place-items:center;padding:0;border:1.5px solid #d9cdf0;border-radius:9px;background:#f6f2ff;color:var(--color-ink);font-size:18px;font-weight:700;line-height:1;white-space:nowrap;cursor:pointer}.bs-cell[data-len="3"]{font-size:15px}.bs-cell[data-len="4"]{font-size:13px}.bs-cell[data-len="5"]{font-size:11px}.bs-cell.has-chord{background:#fff;border-color:#bda9ea}.bs-cell.is-bar{margin-left:9px}.bs-cell.is-bar:before{content:"";position:absolute;left:-9px;top:calc(var(--pad) * -1);bottom:calc(var(--pad) * -1);width:3px;border-radius:2px;background:var(--color-body)}.bs-cell.is-rest{color:var(--color-mute);font-weight:400;font-family:Segoe UI Symbol,Noto Music,Apple Symbols,sans-serif}.bs-marker{position:absolute;top:var(--pad);left:0;width:var(--bw);height:var(--bw);box-sizing:border-box;display:grid;place-items:center;border-radius:9px;background:var(--color-ink);color:var(--color-canvas);font-size:18px;font-weight:700;line-height:1;white-space:nowrap;box-shadow:0 6px 14px -6px #0d001f99;z-index:3;pointer-events:none;transition-property:none}.bs-marker[data-len="3"]{font-size:15px}.bs-marker[data-len="4"]{font-size:13px}.bs-marker[data-len="5"]{font-size:11px}.bs-marker.is-rest{font-weight:400;font-family:Segoe UI Symbol,Noto Music,Apple Symbols,sans-serif}.bs.is-free .bs-marker{display:none}.bs.is-free .bs-cell.is-active{background:var(--color-ink);border-color:var(--color-ink);color:var(--color-canvas)}.cr{position:relative;overflow:hidden;padding:22px 0 18px;background:var(--color-canvas)}.cr-track{display:flex;align-items:center;width:max-content;will-change:transform;transition:transform .32s cubic-bezier(.3,.6,.2,1)}.cr-item{flex:0 0 auto;display:flex;justify-content:center;align-items:center;padding:0 28px;cursor:pointer}.cr-item.is-rest{padding:0 18px;font-size:38px;color:var(--color-ink)}.cr-card{transition:transform .32s cubic-bezier(.3,.6,.2,1);transform-origin:center}.cr-item.is-current .cr-card{transform:scale(1.3)}.is-locked{opacity:.4!important;cursor:not-allowed!important}.vc-label{display:flex;align-items:center;justify-content:center;gap:2px}.vc-arrow{display:grid;place-items:center;flex:none;width:22px;height:22px;padding:0;border:0;border-radius:50%;cursor:pointer;background:var(--color-violet-soft);color:var(--color-violet-deep);opacity:0;transition:opacity .15s,background-color .15s,color .15s}.vc:hover .vc-arrow,.cr-item:hover .vc-arrow,.vc:focus-within .vc-arrow,.vc-arrow:focus-visible{opacity:1}.vc-arrow:hover{background:var(--color-violet);color:#fff}.vc-arrow:focus-visible{outline:2px solid var(--color-violet);outline-offset:1px}.vc-dots{display:flex;justify-content:center;gap:4px;height:6px;margin-top:3px}.vc-dots span{width:5px;height:5px;border-radius:50%;background:var(--color-hairline-strong)}.vc-dots span.on{background:var(--color-violet)}@media(hover:none),(max-width:640px){.vc-arrow{opacity:1;width:26px;height:26px}}@media(prefers-reduced-motion:reduce){.vc-arrow{transition:none}}.cr-card>div{background:transparent!important;border:0!important;box-shadow:none!important}@media(max-width:520px){.dg-bar{padding-top:56px}.bs{--bw: 38px;--gap: 3px;--pad: 6px}.bs-cell,.bs-marker{font-size:16px}.bs-cell[data-len="3"],.bs-marker[data-len="3"]{font-size:13px}.bs-cell[data-len="4"],.bs-marker[data-len="4"]{font-size:11px}.bs-cell[data-len="5"],.bs-marker[data-len="5"]{font-size:9.5px}.cr-item{padding:0 20px}}@media(prefers-reduced-motion:reduce){.cr-track,.cr-item,.cr-card,.tl-tab{transition:none}}#player-state:not(.hidden){display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start;min-height:calc(100vh + 260px)}.pl-main{min-width:0}.pl-side{position:sticky;top:88px;max-height:calc(100vh - 104px);overflow-y:auto;scrollbar-width:thin;display:flex;flex-direction:column;gap:16px}.side-card{border-radius:16px;overflow:hidden;flex:0 0 auto}.video-card{aspect-ratio:16 / 9;background:#000}.video-card iframe{width:100%!important;height:100%!important;display:block}.inst-card{background:#0d0019;border:1px solid #7c3aed33;padding:12px}.details-card{background:var(--color-canvas);color:var(--color-ink);border:1px solid var(--color-hairline);padding:16px 18px}.sd-title{margin:0 0 12px;font-size:15px;font-weight:700}.sd-list{margin:0;display:grid;gap:10px}.sd-list>div{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:8px;font-size:14px}.sd-list dt{font:600 10px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--color-mute)}.sd-list dd{margin:0;font-weight:600}.sd-chips{display:flex;flex-wrap:wrap;gap:6px}.sd-chip{padding:3px 10px;border-radius:999px;background:var(--color-violet-soft);color:var(--color-violet-deep);font-size:13px;font-weight:700}.ph{position:sticky;top:72px;z-index:30;margin-bottom:16px;padding:14px 18px 8px;border-radius:14px;background:var(--color-canvas);color:var(--color-ink);border:1px solid var(--color-hairline);box-shadow:0 14px 34px -16px #0d001f8c}.ph-head{display:flex;align-items:flex-start;gap:12px}.ph-titles{min-width:0;flex:1 1 auto}.ph-title{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.ph-title h1{margin:0;font-size:22px;font-weight:700;line-height:1.2;letter-spacing:-.01em}.ph-by{font-size:14px;color:var(--color-mute)}.ph-sub{margin-top:3px;font-size:13px;color:var(--color-mute)}.ph-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}.hb.hb-head{width:32px;height:32px;background:var(--color-violet-soft);box-shadow:none}.hb.hb-head:hover{background:#fde7f3}.ph-share{flex:0 0 auto;height:32px;padding:0 14px;border:0;border-radius:999px;background:var(--color-violet-soft);color:var(--color-violet-deep);font-size:13px;font-weight:600;cursor:pointer}.ph-share:hover{background:#ddd2fb}.inst-soon{margin-left:4px;padding:1px 6px;border-radius:999px;background:#ffffff14;font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:#a89cc8}.ph-export{position:relative}.ph-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:40;display:grid;gap:2px;min-width:210px;padding:6px;border-radius:12px;background:var(--color-canvas);border:1px solid var(--color-hairline);box-shadow:0 18px 40px -14px #0d001f80}.ph-menu[hidden]{display:none}.ph-menu button{display:grid;gap:1px;padding:9px 12px;border:0;border-radius:8px;background:none;text-align:left;cursor:pointer;color:var(--color-ink)}.ph-menu button:hover{background:var(--color-violet-soft)}.ph-menu b{font-size:13.5px;font-weight:650}.ph-menu span{font-size:12px;color:var(--color-mute)}.ph.is-compact{padding-top:10px}.ph.is-compact .ph-sub{display:none}.ph.is-compact .ph-title h1{font-size:17px}.ph-controls{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:10px}.ph-tools{display:flex;overflow-x:auto;margin:10px -6px 0;padding-top:8px;border-top:1px solid var(--color-hairline);scrollbar-width:none}.ph-tool{padding:6px 14px;min-width:78px}.ph-tool+.ph-tool{border-left:1px solid var(--color-hairline)}.ph-tool-icon{font-size:16px;line-height:1;margin-bottom:4px}.ph-tool-label{margin-top:2px;font-size:9px;color:var(--color-mute);text-transform:uppercase;letter-spacing:.05em}.ph-note:before{content:" · "}.ph-note{color:var(--color-violet)}.tl-tab .short{display:none}.ph-tools::-webkit-scrollbar{display:none}.ph-btn,.ph-play{display:grid;place-items:center;border:0;border-radius:50%;cursor:pointer;transition:transform .12s,box-shadow .12s,background-color .12s}.ph-btn{width:40px;height:40px;background:var(--color-violet-soft);color:var(--color-violet-deep)}.ph-btn:hover{background:#ddd2fb}.ph-play{width:50px;height:50px;color:var(--color-on-accent);background:linear-gradient(135deg,var(--color-accent),var(--color-accent-deep));box-shadow:0 10px 20px -8px #f59e0bb3}.ph-play:hover{transform:scale(1.05)}.ph-btn:focus-visible,.ph-play:focus-visible,.ph-share:focus-visible,.pb:focus-visible,.gc:focus-visible,.gs-tag:focus-visible{outline:2px solid var(--color-violet);outline-offset:2px}.ph-track{min-width:0;display:flex;flex-direction:column;gap:8px}.ph-row{display:flex;align-items:center;gap:8px;font:600 13px var(--font-mono);color:var(--color-body)}.ph-row select{max-width:55%;padding:3px 10px;border:1px solid var(--color-hairline-strong);border-radius:8px;background:var(--color-canvas);color:var(--color-ink);font:600 12px/1.5 inherit;cursor:pointer}.pb{display:flex;align-items:center;gap:3px;height:14px;cursor:pointer;touch-action:none}.pb-seg{position:relative;height:6px;border-radius:3px;background:var(--color-hairline);overflow:hidden;transition:height .12s}.pb:hover .pb-seg,.pb:focus-visible .pb-seg{height:10px}.pb-fill{position:absolute;inset:0;transform:scaleX(0);transform-origin:left center;will-change:transform;background:linear-gradient(90deg,var(--color-violet),var(--color-violet-deep))}.ph-total{font:600 13px var(--font-mono);color:var(--color-mute)}.grid-panel{background:#e9e6f0}#chord-grid{padding:46px 10px 55vh}.gs{display:flex;margin-bottom:10px}.gs-tag{flex:0 0 22px;padding:8px 0;border:0;border-radius:0;color:var(--color-ink);cursor:pointer;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;font:600 11px/1 inherit;letter-spacing:.03em}.gs-tag:hover{filter:brightness(.95)}.grid-hide-tags .gs-tag{display:none}.gs-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}.gr{display:grid;grid-template-columns:repeat(var(--rb, 4),minmax(0,1fr));border-bottom:1px solid #e3deee}.gb{display:grid;grid-template-columns:repeat(var(--bpb, 4),minmax(0,1fr));background:#faf9fd}.gb+.gb{border-left:3px solid #4b4560}.gb.is-current{background:#f3f0fc}.gc{min-width:0;height:44px;display:flex;align-items:center;padding:0 3px 0 6px;border:0;border-left:1px solid #ece8f5;border-radius:0;background:transparent;color:var(--color-ink);font-weight:500;font-size:20px;text-align:left;white-space:nowrap;overflow:hidden;cursor:pointer;transition:background-color .12s,color .12s}.gb>.gc:first-child{border-left:0}.gc[data-len="3"]{font-size:17px}.gc[data-len="4"]{font-size:14px}.gc[data-len="5"]{font-size:12px}.gc[data-len="6"]{font-size:10.5px}.gc:hover{background:#ebe6fa}.gc.is-empty{background:transparent;cursor:default}.gc.is-rest{color:var(--color-mute);font-weight:400}.gc.is-active{background:#2d2a3a;color:#fff;border-radius:3px}.gc.is-silence{font-family:Segoe UI Symbol,Noto Music,Apple Symbols,sans-serif;font-size:22px;font-weight:400;color:var(--color-mute)}.sum-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:14px;padding:20px;justify-items:center}@media(max-width:1000px){#player-state:not(.hidden){grid-template-columns:minmax(0,1fr)}.pl-side{position:static;max-height:none;overflow:visible}.video-card{max-width:560px;width:100%}}@media(max-width:640px){#main-content{--main-top: 10px;--main-x: 10px}.ph{top:64px;margin-bottom:8px;padding:8px 10px 4px;border-radius:12px}.ph-head{align-items:center;gap:8px}.ph-title{display:block}.ph-title h1{font-size:15px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ph-by,.ph-sub{display:none}.ph-sub:has(.ph-note:not([hidden])){display:block;margin-top:1px;font-size:11px}.ph-sub:has(.ph-note:not([hidden])) .ph-sub-main{display:none}.ph-note:before{content:none}.ph-share{height:28px;padding:0 11px;font-size:12px}.ph-controls{gap:8px;margin-top:6px}.ph-btn{width:34px;height:34px}.ph-play{width:42px;height:42px}.ph-track{gap:5px}.ph-tools{margin:6px -2px 0;padding-top:4px}.ph-tool{padding:2px 9px;min-width:50px}.ph-tool-icon{font-size:14px;margin-bottom:1px}.ph-tool-label,.ph.is-compact .ph-tools{display:none}.tl-card{position:relative;border-radius:14px}.tl-tabs{position:static;height:auto;padding:8px 10px;pointer-events:auto}.tl-tabs .tl-seg{background:var(--color-violet-soft);box-shadow:none;backdrop-filter:none}.tl-tab{height:30px;padding:0 12px;font-size:12.5px}.tl-tab .full{display:none}.tl-tab .short{display:inline}.dg-bar{position:absolute;top:8px;right:10px;padding:0;border:0;background:transparent}.cr{padding:14px 0 12px}#chord-grid{padding:8px 6px 55vh}.gs{flex-direction:column;gap:0}.gs-tag{flex:0 0 auto;align-self:flex-start;padding:4px 12px;writing-mode:horizontal-tb;transform:none}.gr{grid-template-columns:repeat(var(--rbm, 2),minmax(0,1fr))}.gb:nth-child(odd){border-left:0}#chord-grid.wide-bars .gb{border-left:0}#chord-grid.wide-bars .gb+.gb{border-top:3px solid #4b4560}.gc{height:40px;padding:0 2px 0 4px;font-size:16px}.gc[data-len="3"]{font-size:13px}.gc[data-len="4"]{font-size:11.5px}.gc[data-len="5"]{font-size:10.5px}.gc[data-len="6"]{font-size:9.5px}}