@media (max-width:760px){.cmo .sm__names{scrollbar-width:none;flex-wrap:nowrap;gap:0 22px;margin-inline:-16px;padding-inline:16px;overflow-x:auto}.cmo .sm__names::-webkit-scrollbar{display:none}.cmo .sm__name{white-space:nowrap;flex:none}}
.cor{isolation:isolate;--dim:grayscale(.8) contrast(.8) brightness(.98);--dim-opacity:.38;--halo:#96641e38;--glow:#f0c88c38;--riser-top:#78543033;--spot:#ffeecd8c;width:100%;position:relative}:root[data-theme=dark] .cor,.cor--full{--dim:brightness(.42) saturate(.65);--dim-opacity:1;--halo:#e2b45247;--glow:#ffd6962e;--riser-top:#96683c42;--spot:#ffd69614}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .cor{--dim:brightness(.42) saturate(.65);--dim-opacity:1;--halo:#e2b45247;--glow:#ffd6962e;--riser-top:#96683c42;--spot:#ffd69614}}.cor--full{width:min(100cqw, calc(114cqh / var(--ar)))}@media (max-height:820px){.cor--full{width:min(100cqw, calc(104cqh / var(--ar)))}}@media (min-aspect-ratio:4/3){.cor--full{translate:0 -6cqh}}.cor__g{margin:0;position:absolute}.cor__g img{width:100%;height:100%;filter:var(--dim) contrast(calc(.75 + .25 * var(--d,1)));opacity:var(--dim-opacity);-webkit-user-drag:none;transition:filter .35s,opacity .35s;display:block}.cor__g:before{content:"";background:radial-gradient(closest-side, var(--glow), transparent);opacity:0;pointer-events:none;transition:opacity .35s;position:absolute;inset:-30% -8% 0}.cor__g.is-on img{opacity:1;filter:brightness(calc(.9 + .06 * var(--v,0))) saturate(.82) sepia(.1) contrast(calc(.82 + .12 * var(--d,1))) drop-shadow(0 0 5px var(--halo))}.cor__g.is-on:before{opacity:calc(.3 + .35 * var(--v,0))}.cor__g.is-out{opacity:.25}.cor__g.is-out img{filter:grayscale(1) var(--dim)}.cor__plate{z-index:30;white-space:nowrap;font:600 clamp(9px, .9vw, 13px)/1.15 var(--body);color:var(--ink);background:color-mix(in oklab, var(--paper-2) 92%, transparent);border:1px solid var(--rule);opacity:.75;cursor:pointer;border-radius:999px;padding:2px 9px;transition:background .3s,color .3s,border-color .3s,opacity .3s;position:absolute;transform:translate(-50%,-50%);box-shadow:0 1px 2px #15121a1f}.cor__plate.is-out{opacity:.35}.cor__plate.is-on{opacity:1;color:var(--paper-2);background:var(--ink);border-color:var(--ink)}.cor__plate:hover,.cor__plate.is-picked{opacity:1;border-color:var(--gold)}.cor.has-tip{z-index:5}.cor__hit{z-index:1;cursor:pointer;background:0 0;border:0;border-radius:12px;padding:0;position:absolute;inset:0}.cor__hit:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.cor__g:is(:hover,.is-picked) img{opacity:1}.cor__tip{z-index:40;text-align:left;background:var(--paper-2);border:1px solid var(--rule);width:min(320px,100vw - 16px);box-shadow:var(--shadow-pop);border-radius:3px;padding:14px 16px 15px;position:absolute}.cor__tip-title{font:italic 500 21px/1.15 var(--display);color:var(--ink);margin:0 24px 6px 0}.cor__tip-text{color:var(--ink-2);margin:0;font-size:14.5px;line-height:1.5}.cor__tip-text+.cor__tip-text{border-top:1px solid var(--rule);margin-top:8px;padding-top:8px}.cor__tip-x{width:30px;height:30px;color:var(--ink-3);cursor:pointer;background:0 0;border:0;border-radius:50%;padding:0;font-size:20px;line-height:1;position:absolute;top:6px;right:6px}.cor__tip-x:hover{color:var(--ink);background:color-mix(in oklab, var(--ink) 6%, transparent)}.cor--full .cor__tip{background:#1d1915;border-color:#efe9dc2e;box-shadow:0 12px 40px #0009}.cor--full .cor__tip-title{color:#f3efe2}.cor--full .cor__tip-text{color:#efe9dcc7;border-color:#efe9dc24}.cor--full .cor__tip-x{color:#efe9dc99}.cor--full .cor__tip-x:hover{color:#f3efe2;background:#efe9dc14}@media (max-width:760px){.cor__plate{padding:1px 5px;font-size:8px}}@media (prefers-reduced-motion:reduce){.cor__g img,.cor__g:before,.cor__plate{transition:none}}.cor__riser{pointer-events:none;background:radial-gradient(ellipse 50% 92% at 50% 100%, var(--riser-top), transparent 100%);filter:blur(3px);display:block;position:absolute}.cor--full .cor__plate{color:#efe9dc;background:#14100cbf;border-color:#efe9dc33}.cor--full .cor__plate.is-on{color:#14110d;background:#ece2cc;border-color:#ece2cc}.cor__light{z-index:0;pointer-events:none;background:radial-gradient(ellipse 50% 55% at 50% 42%, var(--spot), transparent 70%);display:block;position:absolute;inset:-6% 10% 10%}@media (max-width:760px),(max-aspect-ratio:4/3){.cor{--tall:1.6;--big:1.34;aspect-ratio:1 / calc(var(--ar) * var(--tall))!important}.cor__g img{object-fit:contain;object-position:50% 100%;transform:scale(var(--big));transform-origin:50% 100%}.cor--full{width:min(100cqw, calc(100cqh / (var(--ar) * var(--tall))))}.cor__plate{padding:2px 6px;font-size:9.5px}}@media (max-aspect-ratio:4/3){.cor--full{--tall:1.8;--big:1.4;width:min(110cqw, calc(100cqh / (var(--ar) * var(--tall))));transform:translate(-4.5%)}.cor--full .cor__plate{padding:2px 8px;font-size:clamp(10px,2.5vw,13px)}}
.pk{--pk-rh:#b8862a;--pk-lh:#9a3444;--pk-white:#ece6d8;--pk-black:#1b1916;--pk-edge:#00000047;width:100%;position:relative}.pk__canvas{width:100%;height:100%;display:block;position:relative}.pk__keys3d{width:100%;height:0;display:block;position:absolute;bottom:0;left:0}.pk--rise{height:clamp(170px,18vw,230px)}.pk--fall{height:100%}@media (prefers-reduced-motion:reduce){.pk{--pk-motion:0}}.pk--sky{height:100%}:root[data-theme=dark] .pk{--pk-rh:#e2b452;--pk-lh:#e07a8a}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .pk{--pk-rh:#e2b452;--pk-lh:#e07a8a}}.pk__floor{height:calc(var(--pk-h3,0px) * .55);pointer-events:none;background:radial-gradient(48% 22% at 50% 88%,#1e140a6b,#0000 75%),radial-gradient(56% 60% at 50% 80%,#3c281433,#0000 72%);position:absolute;bottom:-10px;left:4%;right:4%}:root[data-theme=dark] .pk__floor{background:radial-gradient(48% 22% at 50% 88%,#0009,#0000 75%),radial-gradient(56% 60% at 50% 80%,#e2b4521a,#0000 72%)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .pk__floor{background:radial-gradient(48% 22% at 50% 88%,#0009,#0000 75%),radial-gradient(56% 60% at 50% 80%,#e2b4521a,#0000 72%)}}
.cst{background:var(--paper);border-radius:4px;overflow:hidden}.cst__hall{background:radial-gradient(72% 90% at 50% 100%, color-mix(in oklab, var(--gold) 14%, transparent), transparent 60%), var(--paper);padding:clamp(18px,3vw,34px) clamp(12px,3vw,32px) 10px;position:relative}.cst__piano{margin-top:-8px;position:relative}.cst__piano .pk--rise{pointer-events:none;max-width:900px;height:clamp(180px,17vw,215px);margin-inline:auto}.cst__piano .pk--rise .pk__canvas{-webkit-mask-image:linear-gradient(#0000,#000 38%);mask-image:linear-gradient(#0000,#000 38%)}.cst__pianoname{z-index:1;font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-size:11px;transition:color .25s;position:absolute;top:0;left:0}.cst__piano.is-on .cst__pianoname{color:var(--gold)}.cst__fullbtn{z-index:2;width:36px;height:36px;color:var(--ink-2);background:color-mix(in oklab, var(--paper) 70%, transparent);border:1px solid color-mix(in oklab, var(--ink) 18%, transparent);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:10px;right:max(0px,50% - 450px)}.cst__fullbtn:hover{color:var(--gold);border-color:var(--gold)}.cst__full{z-index:2147483000;color:#efe9dc;background:radial-gradient(120% 70% at 50% 62%,#1a1714,#0b0a09 70%);grid-template-rows:minmax(0,1fr) clamp(230px,33vh,420px);display:grid;position:fixed;inset:0}.cst__fullhall{grid-area:1/1;place-items:start center;min-height:0;margin:clamp(110px,17vh,190px) clamp(16px,4vw,56px) 0;display:grid;container-type:size}.cst__fullkeys{grid-area:2/1;min-height:0;padding:0 clamp(16px,5vw,96px) clamp(10px,2.4vh,28px)}.cst__fullkeys>.pk{max-width:min(1180px,125vh);height:100%;margin-inline:auto}.cst__fullkeys .pk__canvas{-webkit-mask-image:linear-gradient(#0000 20%,#000 52%);mask-image:linear-gradient(#0000 20%,#000 52%)}.cst__fulltop{pointer-events:none;grid-area:1/1;align-self:start;max-width:28vw;padding:clamp(16px,3vw,36px) 0 0 clamp(16px,4vw,56px)}.cst__fulltitle{white-space:nowrap}@media (max-aspect-ratio:4/3){.cst__fulltop{max-width:none;padding-top:72px;padding-right:clamp(16px,4vw,56px)}.cst__fullhall{margin-top:110px;margin-inline:8px;overflow:visible}.cst__fulltitle{white-space:normal;letter-spacing:.1em;font-size:clamp(9.5px,2.6vw,12px)}.cst__full{grid-template-rows:minmax(0,1fr) clamp(200px,30vh,320px)}}.cst__fulltitle{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#c9a35c;margin:0 0 14px;font-size:12px}.cst__fullbar{background:#0a0e1a8c;border:1px solid #efe9dc2e;border-radius:999px;grid-area:1/1;place-self:start end;align-items:center;gap:14px;margin:clamp(12px,2vw,20px);padding:6px;font-size:13px;display:flex}.cst__play,.cst__exit{font:inherit;color:inherit;cursor:pointer;background:0 0;border:1px solid #efe9dc4d;border-radius:999px;place-items:center;width:40px;height:40px;padding:0;display:grid}.cst__play:hover,.cst__exit:hover{color:#c9a35c;border-color:#c9a35c}.cst__time{font-variant-numeric:tabular-nums;opacity:.8}.cst__prog{cursor:pointer;touch-action:none;width:clamp(120px,22vw,320px);height:22px;position:relative}.cst__prog:before{content:"";background:#efe9dc40;border-radius:1px;height:2px;margin-top:-1px;position:absolute;top:50%;left:0;right:0}.cst__prog span{height:2px;width:var(--p,0%);background:#c9a35c;border-radius:1px;margin-top:-1px;transition:width .25s linear;position:absolute;top:50%;left:0}.cst__prog:after{content:"";top:50%;left:var(--p,0%);opacity:0;background:#c9a35c;border-radius:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;transition:opacity .18s;position:absolute}.cst__prog:is(:hover,:focus-visible,.is-seeking):after{opacity:1}.cst__prog.is-seeking span{transition:none}.cst__prog:focus-visible{outline-offset:4px;border-radius:4px;outline:2px solid #c9a35c}html.cst-full-open{overflow:hidden}@media (max-width:760px){.cst__fullbtn{top:4px;right:8px}.cst__prog{flex:1;width:auto;min-width:40px}.cst__fullbar{justify-self:stretch}}@media (prefers-reduced-motion:reduce){.cst__prog span{transition:none}}.cst__hall>.cor{width:min(100%, calc((100vh - 430px) / var(--ar)));margin-inline:auto}@media (max-width:760px){.cst__hall{padding-inline:0;overflow:hidden}.cst__hall>.cor{width:116%;margin-top:18px;margin-left:-8%}.cst__hall .cor__plate:not(.is-on){opacity:0}.cst__hall .cor__plate{padding:1px 5px;font-size:9px}.cst__piano{margin-top:4px;padding-inline:8px}.cst__pianoname{top:0;left:8px}.cst__piano .pk--rise{height:150px}.cst__piano{margin-top:0}}.cst{--pk-rh:#b8862a;--pk-lh:#9a3444}:root[data-theme=dark] .cst,.cst__full,.cst__full .pk{--pk-rh:#e2b452;--pk-lh:#e07a8a}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .cst{--pk-rh:#e2b452;--pk-lh:#e07a8a}}