html,body{min-width:100%;min-height:100%;margin:0;overflow:hidden;background:#211714}.singalong{--singalong-ivory: #fffaf2;--singalong-blush: #ead7d5;--singalong-gold: #d9b17d;--singalong-ink: #2f211d;position:fixed;inset:0;min-height:100svh;isolation:isolate;overflow:hidden;color:var(--singalong-ivory);background:#2d201c;font-family:Noto Sans TC,sans-serif}.singalong__art,.singalong__art img,.singalong__veil,.singalong__petals{position:absolute;inset:0;width:100%;height:100%}.singalong__art{z-index:-4}.singalong__art img{-o-object-fit:cover;object-fit:cover;-o-object-position:center 54%;object-position:center 54%;filter:saturate(.72) brightness(.58) contrast(1.06);transform:scale(1.015)}.singalong__veil{z-index:-3;background:radial-gradient(ellipse at center,#2217132e,#22171380 70%,#19110ecc),linear-gradient(180deg,#1b120fb8,#1f151261,#1f15127a 70%,#170f0dd6);backdrop-filter:blur(.12rem)}.singalong__petals{z-index:-2;opacity:.28;background:radial-gradient(ellipse at 14% 28%,rgba(255,228,224,.8) 0 .16rem,transparent .2rem),radial-gradient(ellipse at 82% 19%,rgba(255,228,224,.72) 0 .13rem,transparent .18rem),radial-gradient(ellipse at 73% 73%,rgba(255,235,226,.68) 0 .15rem,transparent .2rem),radial-gradient(ellipse at 28% 80%,rgba(255,235,226,.72) 0 .12rem,transparent .17rem);background-size:21rem 19rem,26rem 23rem,31rem 27rem,24rem 29rem}.singalong__topbar{position:absolute;top:0;right:0;left:0;z-index:3;min-height:5rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.5rem;padding:1.1rem clamp(1.25rem,3vw,3rem);color:#fffaf2c7;background:linear-gradient(180deg,rgba(23,15,13,.64),transparent);transition:opacity .26s ease,transform .26s ease}.singalong__topbar>p{display:flex;align-items:center;gap:.7rem;margin:0;font-size:clamp(.72rem,1vw,.9rem);letter-spacing:.12em;white-space:nowrap}.singalong__topbar>p strong{padding-left:.7rem;color:var(--singalong-gold);border-left:1px solid rgba(217,177,125,.5);font-family:"Noto Serif TC",serif;font-weight:600}.singalong__back,.singalong__fullscreen{min-height:2.75rem;display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .75rem;color:#fffaf2c7;border:1px solid rgba(255,250,242,.16);border-radius:999px;background:#24181447;font:inherit;font-size:.74rem;letter-spacing:.05em;text-decoration:none;cursor:pointer;backdrop-filter:blur(.7rem);transition:color .16s ease,border-color .16s ease,background-color .16s ease}.singalong__back{justify-self:start}.singalong__fullscreen{justify-self:end}.singalong__back:hover,.singalong__back:focus-visible,.singalong__fullscreen:hover,.singalong__fullscreen:focus-visible{color:#fff;border-color:#d9b17dad;background:#241814a3;outline:none}.singalong__back:focus-visible,.singalong__fullscreen:focus-visible,.singalong__play:focus-visible,.singalong__timeline input:focus-visible{box-shadow:0 0 0 3px #d9b17d59}.singalong__back svg,.singalong__fullscreen svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.singalong__fullscreen .is-exit,.singalong[data-fullscreen=true] .singalong__fullscreen .is-enter{display:none}.singalong[data-fullscreen=true] .singalong__fullscreen .is-exit{display:block}.singalong__stage{width:min(92vw,108rem);height:100%;display:grid;place-items:center;margin-inline:auto;padding:clamp(6rem,12vh,9rem) 0 clamp(7.5rem,15vh,10rem);text-align:center}.singalong__title,.singalong__lyrics{grid-area:1 / 1;width:100%;transition:opacity .46s ease,transform .46s cubic-bezier(.22,1,.36,1)}.singalong__title[data-visible=false],.singalong__lyrics[data-visible=false]{opacity:0;transform:translateY(-1.2rem) scale(.985);pointer-events:none}.singalong__title[data-visible=true],.singalong__lyrics[data-visible=true]{opacity:1;transform:none}.singalong__title p{margin:0;color:#fffaf2b8;font-size:clamp(.9rem,1.35vw,1.35rem);font-weight:500;letter-spacing:.28em}.singalong__title h1{margin:1.2rem 0 0;color:#fffdf9;font-family:"Noto Serif TC",serif;font-size:clamp(4rem,8.2vw,9rem);font-weight:600;line-height:1.08;letter-spacing:.12em;text-shadow:0 .18rem 1.3rem rgba(17,10,8,.66),0 0 4rem rgba(217,177,125,.2)}.singalong__title>span{display:inline-block;margin-top:1.55rem;padding-top:1.3rem;color:var(--singalong-gold);border-top:1px solid rgba(217,177,125,.55);font-family:"Noto Serif TC",serif;font-size:clamp(1.1rem,1.8vw,1.8rem);letter-spacing:.24em}.singalong__lyrics{display:grid;grid-template-rows:minmax(3rem,.7fr) minmax(8rem,auto) minmax(3rem,.7fr);align-items:center;gap:clamp(1rem,2.4vh,2rem)}.singalong__line{width:100%;margin:0;font-family:"Noto Serif TC",serif;text-wrap:balance}.singalong__line--previous,.singalong__line--next{color:#fffaf275;font-size:clamp(1.45rem,2.35vw,2.7rem);font-weight:500;line-height:1.35;letter-spacing:.06em;text-shadow:0 .15rem 1rem rgba(17,10,8,.72)}.singalong__current-wrap{position:relative;width:-moz-fit-content;width:fit-content;max-width:100%;justify-self:center;padding:.55rem clamp(1rem,2.5vw,2.5rem) 1.25rem}.singalong__line--current{color:#fffdf9;font-size:clamp(3.25rem,5.75vw,6.8rem);font-weight:700;line-height:1.22;letter-spacing:.06em;text-shadow:0 .2rem .65rem rgba(17,10,8,.92),0 0 2.2rem rgba(17,10,8,.68),0 0 4.5rem rgba(217,177,125,.22)}.singalong__line-progress{position:absolute;right:clamp(1rem,2.5vw,2.5rem);bottom:0;left:clamp(1rem,2.5vw,2.5rem);height:.16rem;overflow:hidden;border-radius:999px;background:#fffaf22e}.singalong__line-progress:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#c99054,#f3d3a6);box-shadow:0 0 1rem #d9b17d94;transform:scaleX(calc(var(--line-progress, 0%) / 100%));transform-origin:left}.singalong__controls{position:absolute;right:clamp(1.25rem,3vw,3rem);bottom:clamp(1.15rem,2.4vw,2.3rem);left:clamp(1.25rem,3vw,3rem);z-index:3;min-height:4.7rem;display:grid;grid-template-columns:auto minmax(16rem,1fr) auto;align-items:center;gap:clamp(1rem,2vw,1.75rem);padding:.75rem .9rem;border:1px solid rgba(255,250,242,.17);border-radius:1.15rem;background:#231713b8;box-shadow:0 1.25rem 4rem #110a0847;backdrop-filter:blur(1.1rem) saturate(110%);transition:opacity .26s ease,transform .26s ease}.singalong[data-controls-visible=false] [data-singalong-chrome]{opacity:0;transform:translateY(.75rem);pointer-events:none}.singalong[data-controls-visible=false] .singalong__topbar{transform:translateY(-.75rem)}.singalong__play{width:3.15rem;height:3.15rem;display:grid;place-items:center;padding:0;color:var(--singalong-ink);border:0;border-radius:50%;background:var(--singalong-ivory);cursor:pointer}.singalong__play:disabled{opacity:.45;cursor:not-allowed}.singalong__play svg{width:1.3rem;height:1.3rem;fill:currentColor;stroke:currentColor;stroke-width:2;stroke-linecap:round}.singalong__play .is-pause,.singalong[data-playing=true] .singalong__play .is-play{display:none}.singalong[data-playing=true] .singalong__play .is-pause{display:block}.singalong__timeline{min-width:0}.singalong__timeline input[type=range]{width:100%;height:1.7rem;display:block;margin:0;padding:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.singalong__timeline input[type=range]::-webkit-slider-runnable-track{height:.26rem;border-radius:999px;background:linear-gradient(90deg,var(--singalong-gold) 0 var(--audio-progress, 0%),rgba(255,250,242,.2) var(--audio-progress, 0%) 100%)}.singalong__timeline input[type=range]::-webkit-slider-thumb{width:.9rem;height:.9rem;margin-top:-.32rem;border:2px solid #fffaf2;border-radius:50%;background:var(--singalong-gold);box-shadow:0 .15rem .5rem #110a0873;-webkit-appearance:none;appearance:none}.singalong__timeline input[type=range]::-moz-range-track{height:.26rem;border-radius:999px;background:#fffaf233}.singalong__timeline input[type=range]::-moz-range-progress{height:.26rem;border-radius:999px;background:var(--singalong-gold)}.singalong__timeline input[type=range]::-moz-range-thumb{width:.9rem;height:.9rem;border:2px solid #fffaf2;border-radius:50%;background:var(--singalong-gold)}.singalong__timeline>div{display:flex;justify-content:space-between;gap:1rem;color:#fffaf2a3;font-size:.68rem;letter-spacing:.07em}.singalong__timeline output{font-family:Montserrat,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:0}.singalong__shortcuts{margin:0;color:#fffaf28a;font-size:.64rem;line-height:1.7;white-space:nowrap}.singalong__shortcuts kbd{color:#fffaf2c2;font-family:Montserrat,sans-serif;font-size:.6rem}@media(max-aspect-ratio:4 / 3){.singalong__stage{width:min(94vw,70rem)}.singalong__line--current{font-size:clamp(2.8rem,7.2vw,5.5rem)}}@media(max-width:760px){.singalong__art img{-o-object-position:58% center;object-position:58% center}.singalong__topbar{min-height:4rem;grid-template-columns:auto 1fr auto;gap:.5rem;padding:.65rem .75rem}.singalong__topbar>p{justify-content:center}.singalong__topbar>p span,.singalong__back span,.singalong__fullscreen span{display:none}.singalong__back,.singalong__fullscreen{width:2.65rem;height:2.65rem;justify-content:center;padding:0}.singalong__stage{width:calc(100% - 1.5rem);padding-block:5.2rem 7.5rem}.singalong__title p{font-size:.72rem;letter-spacing:.16em}.singalong__title h1{font-size:clamp(3.15rem,15vw,5.2rem);letter-spacing:.06em}.singalong__title>span{margin-top:1rem;padding-top:.9rem;font-size:1rem}.singalong__lyrics{grid-template-rows:minmax(2rem,.7fr) minmax(6rem,auto) minmax(2rem,.7fr);gap:.8rem}.singalong__line--previous,.singalong__line--next{font-size:clamp(1.05rem,4.8vw,1.35rem);line-height:1.5}.singalong__current-wrap{padding-inline:.25rem}.singalong__line--current{font-size:clamp(2.05rem,9.5vw,3.25rem);line-height:1.32;letter-spacing:.03em}.singalong__line-progress{right:.25rem;left:.25rem}.singalong__controls{right:.7rem;bottom:max(.7rem,env(safe-area-inset-bottom));left:.7rem;min-height:4.2rem;grid-template-columns:auto minmax(0,1fr);gap:.8rem;padding:.6rem .7rem;border-radius:.9rem}.singalong__play{width:2.85rem;height:2.85rem}.singalong__shortcuts{display:none}}@media(pointer:coarse){.singalong[data-controls-visible=false] [data-singalong-chrome]{opacity:1;transform:none;pointer-events:auto}}@media(prefers-reduced-motion:reduce){.singalong__title,.singalong__lyrics,.singalong__topbar,.singalong__controls{transition:none}}