.sf{height:calc(100vh - 45px);background:#000;display:flex;flex-direction:column;overflow:hidden;position:relative}.sf-collection-chip{position:absolute;top:.85rem;left:.85rem;z-index:30;display:inline-flex;align-items:center;gap:.45rem;padding:.35rem .65rem;font-size:.55rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-pink);background:#0000008c;border:1px solid rgba(255,77,106,.4);text-decoration:none;transition:background .15s ease,border-color .15s ease,color .15s ease}.sf-collection-chip:hover{background:#000000d9;border-color:var(--accent-pink)}.sf-collection-chip__dot{width:6px;height:6px;background:var(--accent-pink);box-shadow:0 0 6px var(--accent-pink)}.sf-collection-chip__name{color:var(--text);letter-spacing:.12em}.sf-collection-chip__sep{color:#ffffff59}.sf-collection-chip__exit{color:var(--muted);letter-spacing:.14em}.sf-collection-chip:hover .sf-collection-chip__exit{color:var(--accent-pink)}.sf__player{flex:1;display:flex;flex-direction:column;position:relative}.sf__video{flex:1;position:relative;background:#000;min-height:0;overflow:hidden}.sf__start-overlay{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#0009}.sf__start-btn{background:none;border:1px solid var(--accent);padding:1.5rem;cursor:pointer;transition:background .15s,box-shadow .15s}.sf__start-btn:hover{background:#00ffcc1a;box-shadow:0 0 30px #0fc3}.sf__video-inner,.sf__video>iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max(100%,177.78vh);height:max(100%,56.25vw);border:none}.sf__cover{position:absolute;inset:0;z-index:11;background:var(--bg);opacity:0;pointer-events:none;transition:opacity .24s cubic-bezier(.22,1,.36,1)}.sf__cover.active{opacity:1}.sf__cover--tuning:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0px,rgba(255,255,255,.035) 1px,transparent 1px,transparent 3px),repeating-linear-gradient(0deg,rgba(0,255,204,.02) 0px,rgba(0,255,204,.02) 7px,transparent 7px,transparent 23px);animation:sfTuningJitter .24s steps(3) infinite}.sf__cover--tuning:after{content:"";position:absolute;left:0;right:0;height:2px;background:#00ffcc40;animation:sfTuningSweep .9s cubic-bezier(.22,1,.36,1) infinite}@keyframes sfTuningJitter{0%{background-position:0 0,0 0}to{background-position:0 9px,0 -23px}}@keyframes sfTuningSweep{0%{top:-2%;opacity:.9}to{top:102%;opacity:.2}}.sf__tuning{position:absolute;left:1rem;bottom:1rem;z-index:2;display:none;font-size:.72rem;letter-spacing:.14em;color:var(--accent);opacity:.8}.sf__cover--tuning .sf__tuning{display:block}@media(prefers-reduced-motion:reduce){.sf__cover--tuning:before,.sf__cover--tuning:after{animation:none}}.sf-scoreboard[hidden]{display:none}.sf-scoreboard{position:absolute;top:.85rem;right:.85rem;z-index:30;display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .6rem;font-size:.68rem;letter-spacing:.12em;color:var(--muted);background:#0000008c;border:1px solid var(--border)}.sf-scoreboard__num{color:var(--accent);font-weight:700}.sf-scoreboard__num#sf-score-you{color:var(--accent-pink)}.sf-scoreboard__sep{opacity:.5}.sf-scoreboard--pulse{animation:sfScorePulse .6s cubic-bezier(.22,1,.36,1)}@keyframes sfScorePulse{0%{border-color:var(--accent);color:var(--text)}to{border-color:var(--border);color:var(--muted)}}@media(max-width:680px){.sf-scoreboard{top:.6rem;right:.6rem;font-size:.6rem}}.sf-meter{position:relative;display:flex;align-items:flex-end;gap:3px;width:23px;height:19px}.sf-meter__bar{width:5px;background:#ffffff38;transition:background .5s cubic-bezier(.22,1,.36,1),box-shadow .5s cubic-bezier(.22,1,.36,1)}.sf-meter__bar--1{height:8px}.sf-meter__bar--2{height:13px}.sf-meter__bar--3{height:18px}.sf__ctrl--energy[data-band=drift] .sf-meter__bar--1,.sf__ctrl--energy[data-band=groove] .sf-meter__bar--1,.sf__ctrl--energy[data-band=groove] .sf-meter__bar--2{background:var(--accent);box-shadow:0 0 5px #00ffcc80}.sf__ctrl--energy[data-band=peak] .sf-meter__bar{background:var(--accent-pink);box-shadow:0 0 6px #ff4d6a8c}.sf__ctrl--energy[data-band=peak] .sf-meter__bar--3{animation:sfMeterPin 1.4s cubic-bezier(.22,1,.36,1) infinite}@keyframes sfMeterPin{0%,55%,to{opacity:1}75%{opacity:.45}}@media(prefers-reduced-motion:reduce){.sf__ctrl--energy .sf-meter__bar{animation:none!important}}.sf__transition{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--accent);font-family:var(--font-display);font-weight:900;font-size:clamp(3rem,8vw,6rem);line-height:.9;text-transform:uppercase;letter-spacing:-.02em;text-shadow:0 0 40px currentColor;mix-blend-mode:screen;z-index:14;opacity:0;pointer-events:none;text-align:center;padding:0 1rem}.sf__transition.active{animation:sfTransitionIn .7s cubic-bezier(.22,1,.36,1)}@keyframes sfTransitionIn{0%{opacity:0;transform:scale(.7);letter-spacing:-.08em}18%{opacity:1;transform:scale(1.08);letter-spacing:-.02em}45%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}.sf__info{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;border-top:1px solid var(--border);background:var(--bg);gap:1rem}.sf__info-left{min-width:0;flex:1}.sf__info-artist{font-family:var(--font-display);font-weight:900;font-size:1.1rem;text-transform:uppercase;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sf__info-title{font-size:.7rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:.15rem}.sf__info-right{display:flex;align-items:center;gap:1rem;flex-shrink:0}.sf__info-time{font-size:.75rem;color:var(--accent)}.sf__info-link{font-size:.7rem;color:var(--accent-pink);text-decoration:none;border:1px solid var(--accent-pink);padding:.25rem .6rem;transition:all .15s ease}.sf__info-link:hover{background:var(--accent-pink);color:#000}.sf-timeline-wrap{background:var(--bg);border-top:1px solid var(--border);padding:.5rem 1.5rem .65rem;flex-shrink:0}.sf__segment-bar{position:absolute;top:0;left:0;height:3px;width:0%;background:linear-gradient(90deg,var(--accent-pink),var(--accent));z-index:12;pointer-events:none;transition:background .2s ease}.sf__segment-bar--running{animation-name:sfSegmentTick;animation-timing-function:linear;animation-fill-mode:forwards}.sf__segment-bar--paused{animation-play-state:paused}.sf__segment-bar--staying{width:100%;background:var(--accent);animation:none}@keyframes sfSegmentTick{0%{width:0%}to{width:100%}}@media(prefers-reduced-motion:reduce){.sf__segment-bar--running{animation:none;width:0%}}.sf__ctrl.sf__ctrl--spotify{opacity:0;pointer-events:none;color:#1db954;border-color:#1db95466;text-decoration:none;width:0;min-width:0;padding:0;border-width:0;margin:0 -.5rem;overflow:hidden;transition:opacity .16s cubic-bezier(.22,1,.36,1),width .22s cubic-bezier(.22,1,.36,1),margin .22s cubic-bezier(.22,1,.36,1),border-width .22s cubic-bezier(.22,1,.36,1),background .15s,border-color .15s}.sf__ctrl.sf__ctrl--spotify-active{opacity:1;pointer-events:auto;width:48px;border-width:1px;margin:0}.sf__ctrl--spotify:hover{background:#1db9541f;border-color:#1db954b3}.sf__overlay{display:none}.sf__shortcuts{background:#000000b3;border:1px solid var(--border);padding:.5rem .75rem;display:flex;flex-direction:column;gap:.3rem}.sf__shortcut{display:flex;align-items:center;gap:.75rem}.sf__shortcut--moment{cursor:pointer;transition:opacity .15s}.sf__shortcut--moment:hover{opacity:.7}.sf__shortcut-key{font-size:.6rem;color:var(--accent);min-width:3rem;letter-spacing:.05em}.sf__shortcut-action{font-size:.6rem;color:var(--text-muted)}.sf__shortcut--moment.flash .sf__shortcut-action{color:var(--accent-pink)}.sf__overlay-tooltip{position:absolute;bottom:100%;right:0;margin-bottom:.5rem;background:#000000d9;border:1px solid var(--border);padding:.3rem .6rem;white-space:nowrap;font-size:.6rem;color:var(--text-muted);opacity:0;transition:opacity .2s;pointer-events:none}.sf__overlay-tooltip.visible{opacity:1}.sf__action-flash{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.7);z-index:15;pointer-events:none;opacity:0;font-family:var(--font-display);font-weight:900;font-size:clamp(3rem,8vw,6rem);line-height:.9;letter-spacing:-.02em;text-shadow:0 0 40px currentColor;mix-blend-mode:screen;white-space:nowrap;display:flex;flex-direction:column;align-items:center;gap:.3rem}.sf__action-flash.active{animation:sfFlashIn .7s cubic-bezier(.22,1,.36,1)}.sf__action-flash.active--cyan,.sf__action-flash.active--auth{color:var(--accent)}.sf__action-flash.active--pink,.sf__action-flash.active--moment{color:var(--accent-pink)}.sf__action-flash.active--track{color:var(--accent);font-size:clamp(1.4rem,3vw,2.4rem);white-space:normal;max-width:80%;text-align:center;text-shadow:0 0 28px currentColor}.sf__flash-track{font-family:var(--font-mono);font-size:clamp(.7rem,1.5vw,1rem);font-weight:500;letter-spacing:.2em;color:var(--accent);text-shadow:none;opacity:.8;mix-blend-mode:normal}@keyframes sfFlashIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}45%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.95)}}.sf__swipe{display:none;position:absolute;inset:0;z-index:10;touch-action:pan-y}@media(pointer:coarse){.sf__swipe{display:block}}.sf__video.sf-swiping .sf__video-inner,.sf__video.sf-swiping>iframe{transform:translate(calc(-50% + var(--swipe-x, 0px)),-50%) rotate(var(--swipe-rot, 0deg));will-change:transform}.sf__video.sf-swipe-settle .sf__video-inner,.sf__video.sf-swipe-settle>iframe{transition:transform .32s cubic-bezier(.22,1,.36,1)}.sf__swipe-stamp{position:absolute;top:18%;padding:.45rem .85rem;border:1px solid currentColor;font-size:1rem;font-weight:700;letter-spacing:.2em;text-shadow:0 0 24px currentColor;opacity:0;pointer-events:none}.sf__swipe-stamp--skip{right:1.25rem;color:var(--accent-pink);transform:rotate(8deg)}.sf__swipe-stamp--stay{left:1.25rem;color:var(--accent);transform:rotate(-8deg)}@media(prefers-reduced-motion:reduce){.sf__video.sf-swipe-settle .sf__video-inner,.sf__video.sf-swipe-settle>iframe{transition:none}}.sf__fullscreen-btn{display:flex;flex-direction:column;gap:1px;position:absolute;top:3.5rem;right:1rem;z-index:15;width:40px;height:40px;background:#00000080;border:1px solid rgba(255,255,255,.15);color:var(--text);align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transform:translateZ(0)}.sf__fullscreen-btn:active{background:#ffffff1a;border-color:#ffffff4d}.sf__video.sf__video--fullscreen{position:fixed!important;inset:0!important;z-index:9999!important;width:100%!important;height:100%!important}.sf__controls{position:absolute;bottom:1.5rem;left:0;right:0;display:flex;justify-content:center;gap:1rem;z-index:15;pointer-events:none;opacity:1;transform:translateZ(0)}.sf__ctrl{pointer-events:auto;position:relative;width:48px;height:48px;background:#0000008c;border:1px solid rgba(255,255,255,.12);color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;transition:background .15s,border-color .15s,color .15s;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transform:translateZ(0)}.sf__ctrl-hint{font-size:.5rem;letter-spacing:.04em;color:var(--text-dim);opacity:.8;line-height:1;pointer-events:none}@media(max-width:680px){.sf__ctrl-hint{display:none}}.sf__ctrl:hover{background:#000000bf;border-color:#ffffff40}.sf__ctrl--play,.sf__ctrl--moment{color:var(--accent-pink);border-color:#ff4d6a4d}.sf__heart-fill{clip-path:inset(100% 0 0 0);opacity:.85;animation:heartFill 3.2s ease-in-out infinite;will-change:clip-path}@keyframes heartFill{0%,to{clip-path:inset(100% 0 0 0)}50%{clip-path:inset(50% 0 0 0)}}@media(prefers-reduced-motion:reduce){.sf__heart-fill{animation:none;clip-path:inset(100% 0 0 0)}}.sf__ctrl--stay,.sf__ctrl--skip{flex-direction:row;gap:.35rem;font-size:.7rem;letter-spacing:.08em;padding:0 .75rem;width:auto;border-color:var(--accent);color:var(--accent)}.sf__ctrl--stay:hover,.sf__ctrl--skip:hover{background:#00ffcc1a}.sf__ctrl--staying{background:var(--accent)!important;color:#000!important}.sf__ctrl--skip{border-color:var(--accent-pink);color:var(--accent-pink)}.sf__ctrl--skip:hover{background:#ff4d6a1a}.sf__video.sf__video--fullscreen .sf__fullscreen-btn{display:flex}.sf__video.sf__video--fullscreen .sf__controls{opacity:1;bottom:2.5rem}.sf-timeline-wrap--overlay{position:absolute;left:1rem;right:1rem;bottom:.5rem;z-index:14;background:transparent;border:none;padding:0}.sf-timeline-wrap--overlay .moments-timeline{margin:0;padding:0}.sf-timeline-wrap--overlay .moments-timeline__controls{display:none}@media(max-width:680px){.sf__controls{opacity:1;gap:.35rem;flex-wrap:wrap;row-gap:.5rem;padding:0 .5rem}.sf__ctrl{width:44px;height:44px}.sf__ctrl.sf__ctrl--spotify{margin:0 -.175rem}.sf__ctrl.sf__ctrl--spotify-active{width:44px;margin:0}.sf__ctrl--stay,.sf__ctrl--skip{padding:0 .4rem;font-size:.65rem}.sf__ctrl:active{background:#ffffff1a;border-color:#ffffff4d}.sf__ctrl--moment:active,.sf__ctrl--play:active{background:#ff4d6a26;border-color:var(--accent-pink)}.sf__info{flex-direction:column;align-items:flex-start;gap:.4rem;padding:.6rem 1rem}.sf__info-right{width:100%;justify-content:space-between}.sf-timeline-wrap{padding:.4rem .75rem .5rem}}