.sf{height:calc(100vh - 45px);background:#000;display:flex;flex-direction:column;overflow:hidden}.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__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__channels{display:flex;gap:1px;overflow-x:auto;scrollbar-width:none;border-top:1px solid var(--border);background:var(--bg);padding:.4rem 1.5rem}.sf__channels::-webkit-scrollbar{display:none}.sf__channel{flex-shrink:0;background:none;border:1px solid var(--border);color:var(--muted);padding:.2rem .6rem;cursor:pointer;font-size:.6rem;letter-spacing:.04em;transition:all .15s;white-space:nowrap}.sf__channel:hover{border-color:var(--text-dim);color:var(--text-dim)}.sf__channel.active{border-color:var(--accent);color:var(--accent);background:#00ffcc0d}.sf__segments{display:flex;align-items:center;justify-content:flex-end;padding:.4rem 1.5rem;border-top:1px solid var(--border);background:var(--bg);gap:.35rem}.sf__dur-label{font-size:.65rem;color:var(--muted);margin-right:.25rem}.sf__dur{background:none;border:1px solid var(--border);color:var(--muted);padding:.25rem .5rem;cursor:pointer;font-size:.65rem;transition:all .15s ease}.sf__dur:hover{border-color:var(--text-dim);color:var(--text-dim)}.sf__dur.active{border-color:var(--accent);color:var(--accent)}.sf__progress-overlay{position:absolute;top:0;left:0;right:0;height:6px;z-index:10;background:#ffffff0f}.sf__progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-pink),var(--accent));width:0%;transition:width .08s linear}.sf__progress-moments{position:absolute;inset:0;z-index:1}.sf__progress-heart{position:absolute;top:50%;transform:translate(-50%,-50%);font-size:10px;line-height:1;filter:drop-shadow(0 0 3px rgba(255,77,106,.5));pointer-events:none}.sf__progress-heart--new{animation:sfHeartDrop .6s cubic-bezier(.34,1.56,.64,1) both}@keyframes sfHeartDrop{0%{opacity:0;transform:translate(-50%,-300%) scale(2)}50%{opacity:1;transform:translate(-50%,-40%) scale(1.2)}75%{transform:translate(-50%,-55%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.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__fullscreen-btn{display:flex;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}@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--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__channels{padding:.3rem .75rem}.sf__segments{justify-content:center;padding:.3rem 1rem}}