.sb-daw{--s:.36;width:100%;max-width:calc(1440px * var(--s));height:calc(900px * var(--s));border:1px solid var(--border);background:#262626;border-radius:12px;margin-inline:auto;position:relative;overflow:hidden;box-shadow:0 40px 120px -30px #000000e6}@media(min-width:640px){.sb-daw{--s:.5}}@media(min-width:1024px){.sb-daw{--s:.42;width:calc(1440px * var(--s))}}@media(min-width:1280px){.sb-daw{--s:.56}}.sb-daw-stage{width:1440px;height:900px;transform:translate(-50%) scale(var(--s));transform-origin:50% 0;position:absolute;top:0;left:50%}.sb-daw-shot{-webkit-user-select:none;user-select:none;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.sb-daw-vignette{pointer-events:none;background:radial-gradient(60% 75%,#0a0a0c0d 30%,#0a0a0cb3),#0a0a0c2e;position:absolute;inset:0}.sb-ext{width:458px;height:718px;position:absolute;top:91px;left:491px;overflow:hidden}.sb-crate{--sb-bg:#0a0a0c;--sb-surface:#1a1a1c;--sb-border:#2a2a2c;--sb-border-hi:#3a3a3e;--sb-text:#e8e8e8;--sb-muted:#8a8a8e;--sb-accent:#3a9e6e;--sb-accent-bright:#4bcc88;--sb-purple:#9b92f0;--sb-blue:#38bdf8;background:var(--sb-bg);height:100%;color:var(--sb-text);text-align:left;-webkit-user-select:none;user-select:none;flex-direction:column;font-family:-apple-system,Segoe UI,system-ui,sans-serif;font-size:13px;display:flex;position:relative}.sb-crate *,.sb-crate :before,.sb-crate :after{box-sizing:border-box}.sb-crate button{cursor:pointer;font-family:inherit}.sb-crate svg{display:block}.sb-glow{pointer-events:none;z-index:0;background:radial-gradient(closest-side at 35%,#3a9e6e29,#0000),radial-gradient(closest-side at 55%,#9b92f021,#0000),radial-gradient(closest-side at 72%,#38bdf81c,#0000);width:620px;height:420px;position:absolute;top:30%;left:50%;transform:translate(-50%,-50%)}.sb-topbar{z-index:5;flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 14px 14px;display:flex;position:relative}.sb-topbar-left{align-items:center;gap:8px;display:flex}.sb-logo{width:auto;height:22px;display:block}.sb-wordmark{letter-spacing:-.3px;background:linear-gradient(135deg,#fff,#888);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:17px;font-weight:700}.sb-tabbar{gap:2px;display:flex}.sb-tab{color:var(--sb-muted);white-space:nowrap;border:1px solid #0000;border-radius:6px;padding:5px 8px;font-size:11px;font-weight:600}.sb-tab.active{background:var(--sb-surface);color:var(--sb-text);border-color:var(--sb-border)}.sb-acct{background:var(--sb-surface);border:1px solid var(--sb-border);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.sb-chip{background:linear-gradient(135deg,var(--sb-accent),var(--sb-purple));color:#07140d;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:7px;font-weight:800;display:flex}.sb-row2{z-index:5;flex-shrink:0;align-items:center;gap:6px;width:100%;padding:6px 10px 8px;display:flex;position:relative}.sb-arrows{flex-shrink:0;gap:5px;display:flex}.sb-arrows button{background:var(--sb-surface);border:1px solid var(--sb-border);width:30px;height:30px;color:var(--sb-muted);border-radius:50%;justify-content:center;align-items:center;padding:0;transition:color .15s,border-color .15s,opacity .15s;display:flex}.sb-arrows button:hover:not(:disabled){color:var(--sb-text);border-color:#3a9e6e80}.sb-arrows button:disabled{opacity:.4;cursor:default}.sb-arrows svg{width:15px;height:15px}.sb-search{border:1px solid var(--sb-border);min-width:0;height:30px;color:var(--sb-text);font:inherit;appearance:none;background:#0006;border-radius:8px;outline:none;flex:1 1 0;padding:0 11px;font-size:12px;transition:border-color .15s,box-shadow .15s}.sb-search::-webkit-search-cancel-button{display:none}.sb-search::placeholder{color:#5a5a5e}.sb-search:focus{border-color:#3a9e6e99;box-shadow:0 0 0 3px #3a9e6e1f}@media(pointer:coarse){.sb-search{font-size:16px}}.sb-sort{background:var(--sb-surface);border:1px solid var(--sb-border);height:30px;color:var(--sb-muted);white-space:nowrap;border-radius:8px;flex-shrink:0;align-items:center;gap:5px;padding:0 10px;font-size:11px;font-weight:600;display:flex}.sb-sort svg{width:11px;height:11px}.sb-carousel{z-index:1;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;flex:1;align-items:center;min-height:0;display:flex;position:relative;overflow:auto hidden}.sb-carousel::-webkit-scrollbar{display:none}.sb-slide{scroll-snap-align:center;scroll-snap-stop:always;flex:0 0 100%;justify-content:center;align-items:center;height:100%;padding:10px 60px 28px 24px;display:flex}.sb-cardwrap{width:100%;max-width:320px;height:360px;transition:transform .4s,opacity .4s;position:relative}.sb-slide:not(.active) .sb-cardwrap{opacity:.45;cursor:pointer;transform:scale(.92)}.sb-vinyl{z-index:0;background:linear-gradient(135deg,#141414,#000,#141414);border:1px solid #333;border-radius:50%;justify-content:center;align-items:center;width:250px;height:250px;transition:transform .5s cubic-bezier(.2,.8,.2,1);display:flex;position:absolute;top:50%;right:-36px;transform:translateY(-50%);box-shadow:0 12px 34px #000c,inset 0 0 12px #ffffff14}.sb-cardwrap:hover .sb-vinyl,.sb-slide.active .sb-vinyl{transform:translateY(-50%)translate(26px)rotate(8deg)}.sb-grooves{opacity:.8;mix-blend-mode:multiply;background:repeating-radial-gradient(#101010,#101010 2px,#1b1b1b,#101010 4px);border-radius:50%;position:absolute;inset:5px}.sb-reflection{pointer-events:none;background:conic-gradient(#0000,#ffffff1a 45deg,#0000 90deg 180deg,#ffffff1a 225deg,#0000 270deg);border-radius:50%;position:absolute;inset:0}.sb-vlabel{z-index:2;border:2px solid #000;border-radius:50%;justify-content:center;align-items:center;width:92px;height:92px;display:flex;position:relative;box-shadow:inset 0 0 12px #0009}.sb-spindle{z-index:3;background:#000;border-radius:50%;width:11px;height:11px}.sb-ltext{opacity:.85;animation:18s linear infinite sb-spin;position:absolute;inset:0}.sb-ltext svg{width:100%;height:100%}@keyframes sb-spin{to{transform:rotate(360deg)}}.sb-glass{z-index:10;background:linear-gradient(145deg,#222226db,#0e0e10eb);border:1px solid #ffffff0f;border-radius:16px;flex-direction:column;width:248px;padding:18px;display:flex;position:absolute;inset:0;overflow:hidden;box-shadow:0 20px 40px #0009,inset 0 1px #ffffff14}.sb-slide.active .sb-glass{-webkit-backdrop-filter:blur(10px)}.sb-ghead{align-items:center;gap:10px;display:flex}.sb-avatar{width:38px;height:38px;color:var(--sb-accent);background:#1a2e22;border:1px solid #3a9e6e4d;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex;overflow:hidden}.sb-avatar img{object-fit:cover;width:100%;height:100%}.sb-uname{color:#e0e0e0;font-size:13px;font-weight:500}.sb-badge{letter-spacing:.4px;white-space:nowrap;margin-top:1px;font-size:9px;font-weight:600}.sb-badge.trend{color:#f0b429}.sb-badge.time{color:var(--sb-muted)}.sb-play{background:var(--sb-accent);color:#07140d;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;margin:auto 0 8px;padding:0;transition:background .15s;display:flex}.sb-play:hover,.sb-play.playing{background:var(--sb-accent-bright)}.sb-play svg{width:18px;height:18px}.sb-title{color:#fff;margin:0;padding-bottom:10px;font-size:22px;font-weight:700;line-height:1.12}.sb-tags{flex-wrap:wrap;gap:4px;padding-bottom:10px;display:flex}.sb-tag{letter-spacing:.3px;background:#00000080;border-radius:3px;padding:1px 5px;font-size:7px;font-weight:700}.sb-tag.bpm{color:var(--sb-accent-bright);border:1px solid #3a9e6e4d}.sb-tag.key{color:var(--sb-purple);border:1px solid #9b92f04d}.sb-tag.genre{color:var(--sb-blue);border:1px solid #38bdf84d}.sb-foot{border-top:1px solid #ffffff1a;align-items:center;gap:6px;padding-top:10px;display:flex}.sb-foot-btn{border:1px solid var(--sb-border);color:var(--sb-muted);text-align:center;background:0 0;border-radius:6px;flex:1;padding:7px 0;font-size:10px;font-weight:700;text-decoration:none;transition:all .15s}.sb-foot-btn:hover{color:var(--sb-text);border-color:var(--sb-border-hi)}.sb-foot-btn.remix{background:var(--sb-accent);color:#07140d;border-color:var(--sb-accent)}.sb-foot-btn.remix:hover{background:var(--sb-accent-bright);border-color:var(--sb-accent-bright)}.sb-empty{text-align:center;color:var(--sb-muted);margin:auto;padding:60px 24px;line-height:1.6}.sb-fab{z-index:50;background:var(--sb-accent);color:#07140d;border-radius:20px;align-items:center;gap:6px;height:40px;padding:0 16px;font-size:12px;font-weight:700;text-decoration:none;transition:background .15s;display:flex;position:absolute;bottom:16px;right:16px;box-shadow:0 4px 16px #3a9e6e59}.sb-fab:hover{background:var(--sb-accent-bright)}.sb-fab svg{width:14px;height:14px}@media(prefers-reduced-motion:reduce){.sb-cardwrap,.sb-vinyl{transition:none}.sb-ltext{animation:none}}.sb-swipe-hint{left:50%;top:calc(410px * var(--s));z-index:5;color:#e8e8e8;white-space:nowrap;pointer-events:none;opacity:0;background:#0a0a0cdb;border:1px solid #ffffff1f;border-radius:999px;align-items:center;gap:8px;padding:8px 14px;font-size:12px;font-weight:600;transition:opacity .35s,translate .35s;display:flex;position:absolute;translate:-50% 6px;box-shadow:0 10px 30px #0000008c}.sb-swipe-hint.show{opacity:1;translate:-50%}.sb-swipe-hint svg{color:#4bcc88;width:13px;height:13px}.sb-swipe-hint.show .sb-hint-l{animation:1s ease-in-out infinite sb-hint-l}.sb-swipe-hint.show .sb-hint-r{animation:1s ease-in-out infinite sb-hint-r}@keyframes sb-hint-l{50%{translate:-3px}}@keyframes sb-hint-r{50%{translate:3px}}.sb-carousel.nudging .sb-slide.active .sb-cardwrap{animation:1.6s ease-in-out .15s sb-nudge}@keyframes sb-nudge{0%,40%,72%,to{translate:0}20%{translate:-46px}56%{translate:-22px}}@media(prefers-reduced-motion:reduce){.sb-carousel.nudging .sb-slide.active .sb-cardwrap,.sb-swipe-hint.show svg{animation:none}}.sb-marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000);mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000)}.sb-marquee-track{width:max-content;animation:30s linear infinite sb-marquee;display:flex}.sb-marquee:hover .sb-marquee-track,.sb-marquee:focus-within .sb-marquee-track{animation-play-state:paused}.sb-marquee-item{align-items:center;gap:10px;padding-right:44px;display:inline-flex}@keyframes sb-marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}@media(prefers-reduced-motion:reduce){.sb-marquee{overflow:visible;-webkit-mask-image:none;mask-image:none}.sb-marquee-track{flex-wrap:wrap;justify-content:center;width:auto;animation:none}.sb-marquee-item{padding-right:22px}.sb-marquee-item:nth-child(n+4){display:none}}@media(prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.reveal,.reveal-stagger>*,.reveal-zoom,.glow-breathe,.wave-draw,.scroll-drift{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view()}.reveal{animation-name:sm-rise;animation-range:entry 5% entry 85%}.reveal-stagger>*{animation-name:sm-rise;animation-range:entry 5% entry 80%}.reveal-stagger>:nth-child(2){animation-range:entry 15% entry 90%}.reveal-stagger>:nth-child(3){animation-range:entry 25%}.reveal-stagger>:nth-child(n+4){animation-range:entry 35% cover 30%}.reveal-zoom{animation-name:sm-zoom;animation-range:entry cover 35%}.glow-breathe{animation-name:sm-breathe;animation-range:cover}.wave-draw{transform-origin:50%;animation-name:sm-wave;animation-range:entry cover 40%}.scroll-drift{animation-name:sm-drift;animation-range:exit}}}@keyframes sm-rise{0%{opacity:0;translate:0 28px}to{opacity:1;translate:0}}@keyframes sm-zoom{0%{opacity:.25;translate:0 40px;scale:.93}to{opacity:1;translate:0;scale:1}}@keyframes sm-breathe{0%{opacity:.35;scale:.8}50%{opacity:1;scale:1.05}to{opacity:.35;scale:.9}}@keyframes sm-wave{0%{opacity:0;scale:.25 1}to{opacity:1;scale:1}}@keyframes sm-drift{0%{opacity:1;translate:0;scale:1}to{opacity:.55;translate:0 -48px;scale:.96}}