:root{color-scheme:dark;--black:#000;--white:#fff}html{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}body{margin:0;background-color:var(--black);display:flex;justify-content:center;align-items:center;height:100vh;font-family:"DM Sans",sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;font-size:100%;line-height:1.65}video{width:100%;height:100%;object-fit:cover}figure{margin:0}img{display:block;max-width:100%;height:auto;width:3rem}svg{display:inline-block;vertical-align:middle;width:2rem;height:2rem;fill:var(--white);stroke:var(--white)}button{vertical-align:middle;padding:0;border:0;background-color:transparent}.access-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.reels{position:fixed;inset:0;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:touch}.reel{position:relative;height:100dvh;scroll-snap-align:start;display:grid;place-items:center;background-color:var(--black)}@media(min-width:768px){.reel{aspect-ratio:9/16;height:auto;max-height:100dvh;margin:0 auto}.reel video{border-radius:1rem;overflow:hidden}}.overlay{position:absolute;inset:0;width:100%;height:100%;display:grid;grid-template-columns:9fr 1fr;justify-content:space-between;align-items:end;padding:1rem 0 1rem 1rem;gap:.5rem}.top{grid-column:span 4;align-self:start}.meta_sidebar{text-align:center}.title{display:inline-block;vertical-align:middle;width:calc(100% - 2.5rem);text-align:center;font-size:1.75rem;text-shadow:3px 3px 3px rgba(0,0,0,15%)}.author{display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;gap:.5rem}.author .figure{width:40px;max-width:100%;height:auto;aspect-ratio:1/1;overflow:hidden;border-radius:50%}.author img{width:100%;height:100%;object-fit:cover}.reel_author{font-size:1.1rem;font-weight:500;line-height:1}.reel_artist{opacity:70%}.musical_note{width:1rem;height:1rem}.reel_scroll{display:inline-block;vertical-align:middle;width:calc(100% - 2.5rem);overflow:hidden;white-space:nowrap;box-sizing:border-box}.reel_song{display:inline-block;padding-left:100%;margin:0;font-size:.9rem;animation:scroll 10s linear infinite}@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-100%)}}.caption p{font-size:1.1rem;margin:.25rem 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:300px}.like_comments{display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;gap:.5rem}.like_comments .figure{width:25px;max-width:100%;height:auto;aspect-ratio:1/1;overflow:hidden;border-radius:50%}.like_comments img{width:100%;height:auto;object-fit:cover}.like_comments p{opacity:80%;margin:.333rem 0}.meta_count-container{margin:1.5rem 0 .5rem}.cover_art .figure{width:40px;height:auto;aspect-ratio:1/1;overflow:hidden;border-radius:10px;margin:0 auto}.cover_art img{width:100%;height:100%;object-fit:cover}.toast-audio{width:5rem;height:5rem;position:absolute;top:50%;left:50%;padding:1.5rem;border-radius:50%;background:rgba(0,0,0,.33);opacity:0;scale:.9;translate:-50% -50%;transition:opacity 500ms,scale 500ms}.toast-audio svg{width:2rem;height:2rem}.toast-audio.show{opacity:1;scale:1}.heart_button path{fill:none;stroke:var(--white);stroke-width:30}.heart_button.liked path{fill:red;stroke:red}.heart-icon{width:4rem;height:4rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);fill:red;opacity:0;pointer-events:none;transition:opacity .3s ease-in-out}.heart-icon.liked{animation:heart-pop .6s ease-out forwards}@keyframes heart-pop{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}100%{transform:translate(300%,-50%) scale(1);opacity:0}}