.genre-container{width:100%;height:100dvh;display:grid;grid-template-rows:40px 1fr auto auto auto;background:#000;overflow:hidden;position:relative;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mic-transcript-bar{display:flex;align-items:center;gap:.6rem;padding:0 .75rem;height:36px;background:#ffffff08;border-top:1px solid rgba(255,255,255,.06);animation:transcript-in .2s ease-out;overflow:hidden}@keyframes transcript-in{0%{opacity:0;height:0}to{opacity:1;height:36px}}.mic-transcript-dest{font-family:SF Mono,monospace;font-size:.48rem;font-weight:700;letter-spacing:.3em;color:#d4a64fb3;flex-shrink:0}.mic-transcript-text{font-family:SF Mono,monospace;font-size:.7rem;color:#ffffffb3;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:italic}.mic-dest-toggle{background:none;border:1px solid rgba(255,255,255,.12);color:#ffffff59;font-family:SF Mono,monospace;font-size:.45rem;font-weight:700;letter-spacing:.2em;padding:.2rem .4rem;border-radius:3px;cursor:pointer;flex-shrink:0;transition:color .12s,border-color .12s}.mic-dest-toggle:hover{color:#d4a64fcc;border-color:#d4a64f4d}.top-bar{display:flex;align-items:center;gap:.6rem;padding:0 .75rem;background:#000;border-bottom:1px solid rgba(255,255,255,.04);z-index:10}.top-bar-logo-img{height:26px;width:26px;object-fit:cover;border-radius:4px;opacity:.85}.top-bar-title{font-family:SF Mono,monospace;font-size:.55rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:#fff3;flex:1}.top-bar-bpm{font-family:SF Mono,monospace;font-size:.6rem;font-weight:700;letter-spacing:.1em;color:#d4a64fbf}.ad-banner{display:flex;align-items:center;gap:.6rem;padding:0 .75rem;height:32px;background:#d4a64f0d;border-top:1px solid rgba(212,166,79,.12);animation:transcript-in .3s ease-out;flex-shrink:0}.ad-copy{font-family:SF Mono,monospace;font-size:.46rem;letter-spacing:.12em;color:#d4a64f73;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ad-subscribe-btn{background:#d4a64f1a;border:1px solid rgba(212,166,79,.4);color:#d4a64fd9;font-family:SF Mono,monospace;font-size:.45rem;font-weight:700;letter-spacing:.2em;padding:.2rem .6rem;border-radius:3px;cursor:pointer;flex-shrink:0;transition:background .12s,border-color .12s,color .12s}.ad-subscribe-btn:hover{background:#d4a64f33;border-color:#d4a64fb3;color:#d4a64f}.bottom-bar{display:flex;align-items:center;gap:.2rem;padding:0 .5rem;background:#000000f2;border-top:1px solid rgba(255,255,255,.05);z-index:10}.bbar-btn{background:none;border:none;color:#ffffff4d;font-family:SF Mono,monospace;font-size:.52rem;font-weight:700;letter-spacing:.18em;padding:.3rem .5rem;cursor:pointer;transition:color .12s}.bbar-btn:hover{color:#fff9}.bbar-btn--on{color:#d4a64fe6}.bbar-btn--shady{color:#d4a64f66}.bbar-btn--shady.bbar-btn--on{color:#d4a64fe6}.bbar-divider{width:1px;height:16px;background:#ffffff14;margin:0 .2rem}.bbar-btn--mic-live{color:#f44;animation:mic-pulse 1s ease-in-out infinite}.bbar-btn--dj{color:#d4a64f;letter-spacing:.22em;border:1px solid rgba(212,166,79,.35);border-radius:3px;padding:.22rem .7rem;text-shadow:0 0 8px rgba(212,166,79,.4)}.bbar-btn--dj:hover{color:#f0c070;border-color:#d4a64fb3;text-shadow:0 0 12px rgba(212,166,79,.7)}@keyframes mic-pulse{0%,to{opacity:1}50%{opacity:.5}}.hero-stage{position:relative;width:100%;height:clamp(220px,38vh,400px);overflow:hidden;border-bottom:1px solid rgba(255,140,60,.18);background:#03020d;flex-shrink:0}.hero-grid-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(rgba(255,145,95,.1) 1px,transparent 1px),repeating-linear-gradient(0deg,transparent 0 46px,rgba(255,140,78,.06) 47px 48px),repeating-linear-gradient(90deg,transparent 0 46px,rgba(255,140,78,.06) 47px 48px),radial-gradient(ellipse at center,rgba(255,130,70,.1),transparent 65%);background-size:8px 8px,48px 48px,48px 48px,100% 100%;pointer-events:none}.hs-screen{position:absolute;top:0;left:0;right:0;height:52px;display:flex;align-items:center;gap:0;z-index:10;pointer-events:none;background:#03020eb8;backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);border-bottom:1px solid rgba(255,140,60,.18);padding:0 1rem;overflow:hidden}.hs-left{display:flex;align-items:center;gap:8px;flex-shrink:0}.hs-logo{height:34px;width:34px;object-fit:cover;border-radius:4px;opacity:.92}.hs-bpm-block{display:flex;align-items:baseline;gap:4px;flex-shrink:0;min-width:72px}.hs-bpm-num{font-family:SF Mono,Fira Code,monospace;font-size:1.65rem;font-weight:700;color:#fff;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}.hs-bpm-label{font-family:SF Mono,Fira Code,monospace;font-size:.48rem;font-weight:700;color:#ff8c3cb3;letter-spacing:.22em;text-transform:uppercase}.hs-screen:before{display:none}.hs-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;padding:0 1rem}.hs-beats{display:flex;gap:6px;align-items:center}.hs-beat{width:32px;height:5px;border-radius:3px;background:#ffffff17;transition:background 90ms ease-out,box-shadow 90ms ease-out,transform 90ms ease-out}.hs-beat--down{background:#ff8c3a;box-shadow:0 0 14px 3px #ff8c3aa6;transform:scaleY(1.6);transform-origin:center;transition:none}.hs-beat--up{background:#fff9;box-shadow:0 0 8px #ffffff40;transform:scaleY(1.25);transform-origin:center;transition:none}.hs-tracks{display:flex;gap:1rem;align-items:center;max-width:100%;overflow:hidden}.hs-track-name{font-family:SF Mono,Fira Code,monospace;font-size:.48rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#ffffff73;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.hs-track-name--idle{color:#ff8c3c80;letter-spacing:.28em;max-width:none}.hs-right{display:flex;align-items:center;gap:6px;flex-shrink:0;min-width:60px;justify-content:flex-end}.hs-live-dot{width:6px;height:6px;border-radius:50%;background:#d4a64f;box-shadow:0 0 6px #d4a64fcc;animation:hs-pulse 1.8s ease-in-out infinite}@keyframes hs-pulse{0%,to{opacity:1}50%{opacity:.4}}.hs-live-label{font-family:SF Mono,Fira Code,monospace;font-size:.45rem;font-weight:700;letter-spacing:.22em;color:#d4a64fbf;text-transform:uppercase}.hs-ch-count{font-family:SF Mono,Fira Code,monospace;font-size:.52rem;font-weight:700;letter-spacing:.12em;color:#ffffff59;text-transform:uppercase;min-width:30px;text-align:right}.hs-shady-caption{position:absolute;top:52px;left:0;right:0;min-height:36px;display:flex;align-items:center;gap:10px;padding:6px 1rem;background:#ff64141a;border-bottom:1px solid rgba(255,140,60,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:9;pointer-events:none;animation:hs-caption-in .25s ease-out}@keyframes hs-caption-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.hs-shady-mark{font-family:SF Mono,Fira Code,monospace;font-size:.46rem;font-weight:700;letter-spacing:.22em;color:#ff8c3cd9;flex-shrink:0}.hs-shady-text{font-size:.78rem;font-weight:600;color:#ffd296f2;line-height:1.35;word-break:break-word}.hero-lips{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0}.hero-sphere{position:absolute;top:0;right:0;bottom:0;width:50%;z-index:1;pointer-events:auto}.hero-info{position:absolute;top:0;left:0;bottom:2.5rem;width:52%;z-index:2;display:flex;flex-direction:column;justify-content:center;padding-left:1.5rem;pointer-events:none}.hero-label{font-family:SF Mono,Fira Code,monospace;font-size:.5rem;text-transform:uppercase;letter-spacing:.32em;color:#ffa53c99;margin-bottom:.4rem;line-height:1}.hero-title{font-family:SF Mono,Fira Code,Fira Mono,ui-monospace,monospace;font-size:clamp(14px,2.4vw,22px);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#fff;line-height:1.2;margin:0}.hero-title--idle{color:#ffffff26}.hero-meta{display:flex;align-items:center;gap:.75rem;margin-top:.6rem}.hero-bpm{font-family:SF Mono,Fira Code,monospace;font-size:.625rem;letter-spacing:.14em;color:#d4a64fbf}.hero-deck{font-family:SF Mono,Fira Code,monospace;font-size:.52rem;letter-spacing:.06em;color:#ffffff59;margin-top:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90%}.hero-live-dot{width:6px;height:6px;border-radius:50%;background:#d4a64f;box-shadow:0 0 8px #d4a64fd9;animation:live-pulse 1.4s ease-in-out infinite}@keyframes live-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.8)}}.hero-live-text{font-family:SF Mono,Fira Code,monospace;font-size:.5rem;text-transform:uppercase;letter-spacing:.24em;color:#ffffff47}.hero-mode-badge{position:absolute;top:.6rem;right:.6rem;z-index:4;font-family:SF Mono,Fira Code,monospace;font-size:.44rem;text-transform:uppercase;letter-spacing:.26em;padding:.2rem .55rem;border-radius:4px;border:1px solid rgba(212,166,79,.22);background:#d4a64f0f;color:#d4a64f8c;pointer-events:none}.hero-mode-badge--club{border-color:#d946ef47;background:#d946ef1a;color:#f0abfcb3}.hero-mode-badge--vocal{border-color:#10b98147;background:#10b9811a;color:#6ee7b7b3}.hero-mode-strip{position:absolute;bottom:.5rem;left:1.25rem;z-index:4;display:flex;gap:.4rem;pointer-events:auto}.hero-mode-btn{background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:.5rem;padding:.2rem .6rem;font-family:SF Mono,Fira Code,monospace;font-size:.5rem;text-transform:uppercase;letter-spacing:.18em;color:#ffffff61;cursor:pointer;transition:all .15s ease}.hero-mode-btn:hover{border-color:#d4a64f40;color:#d4a64fa6;filter:brightness(1.08)}.hero-mode-btn--active{border-color:#d4a64f66;background:#d4a64f1a;color:#d4a64fd9}.hero-fade-bottom{position:absolute;inset-inline:0;bottom:0;height:3rem;-webkit-mask-image:linear-gradient(to bottom,transparent,black);mask-image:linear-gradient(to bottom,transparent,black);background:#000;pointer-events:none;z-index:3}.shady-screen-overlay{position:absolute;top:40px;left:0;right:0;height:clamp(160px,32vh,300px);z-index:20;pointer-events:none;overflow:hidden;animation:screen-in .4s ease-out}@keyframes screen-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.genre-grid{min-height:0;min-width:0}.grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:1px;background:#000;width:100%;height:100%}.genre-card{position:relative;background:#000;border:none;border-radius:0;cursor:pointer;overflow:hidden;padding:0}.genre-card:hover:not(:disabled){box-shadow:inset 0 0 0 1px #d4a64f4d}.genre-card.active{box-shadow:inset 0 0 0 1px #d4a64f8c,0 0 24px #d4a64f33}.speaker-image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:.92;filter:contrast(1.12) brightness(.88);pointer-events:none}.genre-card:hover:not(:disabled) .speaker-image{filter:contrast(1.15) brightness(.95)}.genre-card.active .speaker-image{will-change:transform,filter}.genre-content{position:absolute;bottom:0;left:0;right:0;padding:1.5rem .6rem .5rem;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,transparent 100%);z-index:2;opacity:0;transition:opacity .18s ease}.genre-card:hover .genre-content,.genre-card:focus-visible .genre-content,.genre-card.active .genre-content{opacity:1}.genre-card h3{font-family:SF Mono,Fira Code,monospace;font-size:clamp(.48rem,1.4vh,.68rem);font-weight:600;color:#ffffffd9;text-transform:uppercase;letter-spacing:.07em;line-height:1.2;margin:0}.genre-bpm-label{font-family:SF Mono,Fira Code,monospace;font-size:clamp(.42rem,1.2vh,.55rem);font-weight:600;color:#d4a64fbf;letter-spacing:.12em;margin:2px 0 0;line-height:1}.active-badge{position:absolute;top:.5rem;left:.5rem;width:6px;height:6px;border-radius:50%;background:#d4a64f;box-shadow:0 0 8px #d4a64fd9;animation:live-pulse 1.4s ease-in-out infinite;z-index:3}.chat-toggle-btn{position:fixed;bottom:1.5rem;right:1.5rem;z-index:200;background:#141414eb;border:1px solid rgba(255,215,0,.35);color:#ffd700d9;font-family:inherit;font-size:.7rem;font-weight:700;letter-spacing:.18em;padding:.5rem 1rem;border-radius:4px;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:border-color .16s,color .16s,box-shadow .16s}.chat-toggle-btn:hover,.chat-toggle-btn--open{border-color:#ffd70099;color:#ffd700e6;filter:brightness(1.1)}.hero-control-strip{position:absolute;bottom:1.2rem;left:1.2rem;display:flex;align-items:center;gap:.4rem;z-index:10}.ctrl-btn{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);color:#ffffff73;font-family:inherit;font-size:.6rem;font-weight:700;letter-spacing:.14em;padding:.3rem .65rem;border-radius:4px;cursor:pointer;transition:all .14s;white-space:nowrap}.ctrl-btn:hover{border-color:#ffffff4d;color:#fffc}.ctrl-btn--on{border-color:#ffffff80;color:#fff;background:#ffffff1a}.ctrl-btn--shady.ctrl-btn--on{border-color:#ffd70099;color:gold;background:#ffd70014}.ctrl-btn--shady.ctrl-btn--muted{color:#fff3}.ctrl-lock{margin-left:4px;font-size:.55rem}.ctrl-divider{width:1px;height:18px;background:#ffffff1f;margin:0 .2rem}.ctrl-chat{border-color:#fff3}.card-actions{position:absolute;bottom:clamp(.2rem,1vh,.4rem);right:clamp(.2rem,1vh,.4rem);display:flex;gap:.2rem;z-index:5}.card-btn{background:#000000a6;border:1px solid rgba(255,255,255,.15);border-radius:3px;color:#fff9;font-size:clamp(.45rem,1.2vh,.6rem);line-height:1;padding:clamp(2px,.5vh,4px) clamp(4px,.8vh,6px);cursor:pointer;transition:all .12s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.card-btn:hover{background:#000c;color:#fff;border-color:#fff6}.card-btn--fave:hover{color:#ff6b8a;border-color:#ff6b8a}.card-btn--skip:hover{color:gold;border-color:gold}.error-banner{display:flex;align-items:center;justify-content:space-between;padding:.3rem .75rem;background:#ff3c3c1f;border-bottom:1px solid rgba(255,60,60,.2);font-family:SF Mono,monospace;font-size:.52rem;color:#ff8c8ccc;z-index:20}.error-banner button{background:none;border:none;color:#ff8c8c80;font-size:1rem;cursor:pointer;padding:0 .2rem}.now-playing-bar{display:flex;align-items:center;gap:.5rem;padding:0 .75rem;height:32px;background:#d4a64f0f;border-top:1px solid rgba(212,166,79,.12)}.np-dot{width:5px;height:5px;border-radius:50%;background:#d4a64f;box-shadow:0 0 6px #d4a64f99;flex-shrink:0}.np-name{font-family:SF Mono,monospace;font-size:.55rem;font-weight:600;color:#ffffff8c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.loading-spinner{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000080;z-index:10}.loading-spinner:after{content:"";width:24px;height:24px;border:2px solid rgba(212,166,79,.3);border-top-color:#d4a64f;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.genre-card:active{transform:scale(.96);transition:transform 80ms ease-out}.genre-card{transition:transform .12s ease-out;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.ss-root{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:#000;color:#fff;overflow:hidden;font-family:SF Mono,JetBrains Mono,Fira Mono,monospace;padding-top:env(safe-area-inset-top,0);padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)}.ss-header{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.6rem .9rem;background:#060606;border-bottom:1px solid #1a1a1a;z-index:30}.ss-logo{display:flex;align-items:center;gap:.55rem}.ss-logo-img{width:28px;height:28px;object-fit:cover;border-radius:4px;opacity:.9}.ss-logo-text{display:flex;flex-direction:column;gap:0}.ss-logo-title{font-size:.78rem;font-weight:700;letter-spacing:.1em;color:#ffffffe6;line-height:1}.ss-logo-sub{font-size:.52rem;letter-spacing:.08em;color:#d4a64f8c;line-height:1.4;text-transform:uppercase}.ss-header-meters{flex:1;display:flex;align-items:center;gap:.4rem;min-width:0}.ss-master-meter{flex:1;height:4px;background:#111;border-radius:2px;overflow:hidden;max-width:80px}.ss-meter-bar{height:100%;border-radius:2px;transition:width 40ms linear}.ss-meter-bar[data-deck=A]{background:#d4a64f}.ss-meter-bar[data-deck=B]{background:#d4a64f73}.ss-bpm{font-size:.65rem;font-weight:700;letter-spacing:.06em;color:#d4a64fd9;white-space:nowrap}.ss-analyzing-dot{width:6px;height:6px;border-radius:50%;background:#d4a64f99;animation:ss-pulse 1.4s ease-in-out infinite;flex-shrink:0}@keyframes ss-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.7)}}.ss-header-actions{display:flex;align-items:center;gap:.4rem;flex-shrink:0}.ss-btn{background:transparent;border:1px solid rgba(255,255,255,.12);border-radius:3px;color:#fff9;cursor:pointer;font-size:.6rem;font-weight:700;letter-spacing:.08em;padding:.3rem .55rem;display:flex;align-items:center;gap:.35rem;font-family:inherit;transition:all .12s}.ss-btn:hover{border-color:#ffffff4d;color:#fff}.ss-btn--stop{border-color:#b4282880;color:#ff5050cc}.ss-btn--stop:hover{border-color:#ff5050b3;color:#ff5050;background:#b428281a}.ss-now-playing{flex-shrink:0;display:flex;align-items:stretch;gap:0;background:#080808;border-bottom:1px solid #151515;min-height:28px}.ss-deck-info{flex:1;display:flex;align-items:center;gap:.5rem;padding:.28rem .7rem;overflow:hidden}.ss-deck-info[data-deck=B]{border-left:1px solid #151515;opacity:.65}.ss-deck-label{font-size:.5rem;font-weight:700;letter-spacing:.1em;color:#d4a64fb3;background:#d4a64f14;border:1px solid rgba(212,166,79,.2);border-radius:2px;padding:.05rem .3rem;flex-shrink:0}.ss-deck-name{font-size:.58rem;color:#ffffffb3;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.ss-deck-bpm{font-size:.52rem;font-weight:700;color:#d4a64f80;flex-shrink:0;letter-spacing:.04em}.ss-error{flex-shrink:0;background:#a01414e6;color:#ffb4b4f2;font-size:.65rem;padding:.35rem .9rem;letter-spacing:.03em;border-bottom:1px solid rgba(255,80,80,.2)}.ss-toast{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000eb;border:1px solid rgba(212,166,79,.25);border-radius:4px;color:#d4a64fd9;font-size:.65rem;font-weight:600;padding:.5rem 1.1rem;letter-spacing:.08em;z-index:50;pointer-events:none}.ss-canvas{flex:1;min-height:0;overflow:hidden;background:#000;display:flex}.ss-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:1fr 1fr 1fr 1fr;gap:1px;background:#0f0f0f;padding:1px;flex:1}@media (max-width: 520px){.ss-grid{grid-template-columns:repeat(2,1fr)}}.ss-cell{position:relative;background:#050505;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:clamp(.15rem,.8vw,.3rem) clamp(.15rem,.9vw,.35rem);min-height:0;overflow:hidden;transition:background .1s;text-align:left}.ss-cell:hover{background:#0a0a0a}.ss-cell:hover .ss-cell-name{color:#ffffffd9}.ss-cell--active{background:#0b0800}.ss-cell--active .ss-cell-name{color:#d4a64ff2}.ss-cell-progress{position:absolute;bottom:0;left:0;height:2px;background:#d4a64f73;transition:width .3s;border-radius:0 1px 1px 0}.ss-cell-ch{position:absolute;top:clamp(.08rem,.4vw,.15rem);left:clamp(.1rem,.5vw,.2rem);font-size:clamp(.22rem,1vw,.38rem);font-weight:700;letter-spacing:.06em;color:#ffffff2e;line-height:1}.ss-cell--active .ss-cell-ch{color:#d4a64f59}.ss-cell-name{font-size:clamp(.35rem,1.5vw,.52rem);font-weight:700;letter-spacing:.04em;color:#ffffff80;text-transform:uppercase;line-height:1.2;position:relative;z-index:2;pointer-events:none}.ss-cell-decks{display:flex;gap:clamp(1px,.3vw,2px);margin-top:clamp(.06rem,.4vw,.15rem);position:relative;z-index:2}.ss-cell-deck-dot{width:clamp(3px,.8vw,5px);height:clamp(3px,.8vw,5px);border-radius:50%;background:#ffffff1a;border:1px solid rgba(255,255,255,.08)}.ss-cell-deck-dot--a{background:#d4a64fd9;border-color:#d4a64f80;box-shadow:0 0 5px #d4a64f66;animation:ss-pulse 1.2s ease-in-out infinite}.ss-cell-deck-dot--b{background:#d4a64f59;border-color:#d4a64f33;animation:ss-pulse 1.6s ease-in-out infinite .3s}.ss-cell-badge{position:absolute;top:clamp(.08rem,.4vw,.15rem);right:clamp(.1rem,.5vw,.2rem);font-size:clamp(.22rem,1vw,.38rem);font-weight:700;letter-spacing:.04em;border-radius:2px;padding:clamp(.02rem,.15vw,.04rem) clamp(.09rem,.5vw,.18rem);line-height:1.3}.ss-cell-badge--ready{background:#ffffff0a;color:#fff3;border:1px solid rgba(255,255,255,.07)}.ss-cell-badge--error{background:#b4141466;color:#ff6464cc;border:1px solid rgba(255,60,60,.2)}.ss-cell-levels{position:absolute;right:clamp(.1rem,.5vw,.2rem);bottom:clamp(.12rem,.6vw,.25rem);top:clamp(.5rem,2vw,1rem);display:flex;align-items:flex-end;gap:clamp(1px,.3vw,2px);z-index:2;pointer-events:none}.ss-cell-level{width:clamp(1.5px,.4vw,3px);border-radius:1px 1px 0 0;transition:height 50ms linear;min-height:1px}.ss-cell-level[data-deck=A]{background:#d4a64fcc}.ss-cell-level[data-deck=B]{background:#d4a64f59}.ss-cell--active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:#d4a64fb3}.admin-dashboard{position:fixed;top:0;left:0;right:0;bottom:0;background:#0a0a0a;color:#ccc;font-family:SF Mono,Menlo,Monaco,Courier New,monospace;display:flex;flex-direction:column;overflow:hidden;z-index:9999}.admin-header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:#111;border-bottom:1px solid #222;flex-shrink:0}.admin-title{font-size:14px;font-weight:700;color:#d4a64fe6;letter-spacing:2px}.admin-status-bar{display:flex;align-items:center;gap:12px;font-size:11px;color:#888}.status-dot{width:8px;height:8px;border-radius:4px;display:inline-block}.status-dot.green{background:#4caf50}.status-dot.red{background:#f44336}.bpm-badge{background:#d4a64f26;color:#d4a64fe6;padding:2px 8px;border-radius:3px;font-weight:700}.track-count{color:#666}.active-genre-label{color:#fff;font-weight:600}.strips-container{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:4px}.strips-container::-webkit-scrollbar{width:6px}.strips-container::-webkit-scrollbar-track{background:#111}.strips-container::-webkit-scrollbar-thumb{background:#333;border-radius:3px}.genre-strip{display:flex;align-items:center;gap:12px;padding:6px 12px;background:#141414;border-left:3px solid #333;border-radius:4px;cursor:pointer;transition:all .15s ease;-webkit-user-select:none;user-select:none;min-height:48px}.genre-strip:hover{background:#1a1a1a;border-left-width:4px}.genre-strip.active{background:#d4a64f14;border-left-width:4px}.genre-strip.loading{opacity:.6;pointer-events:none}.strip-label{width:200px;flex-shrink:0;display:flex;flex-direction:column;gap:2px}.strip-genre{font-size:12px;font-weight:600;letter-spacing:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.strip-meta{display:flex;gap:6px;font-size:9px;color:#666}.strip-bpm{background:#ffffff14;padding:1px 5px;border-radius:2px;font-weight:700;color:#d4a64fcc}.strip-key{background:#ffffff0d;padding:1px 5px;border-radius:2px;color:#888}.strip-tracks:before{content:"🎵 "}.strip-tracks{color:#555}.strip-waveform{flex:1;min-width:0;height:40px;border-radius:3px;overflow:hidden;background:#ffffff05}.strip-waveform canvas{width:100%;height:100%;display:block}.strip-controls{width:30px;flex-shrink:0;text-align:center;font-size:14px}.strip-playing{color:#4caf50;text-shadow:0 0 8px rgba(76,175,80,.5)}.strip-preview{color:#fff3}.strip-loading{display:flex;flex-direction:column;align-items:center;gap:4px}.strip-spinner{width:24px;height:24px;border:3px solid rgba(212,166,79,.15);border-top-color:#d4a64fe6;border-radius:50%;animation:spin .7s linear infinite}.strip-decoding{font-size:8px;color:#d4a64f99;letter-spacing:.5px;white-space:nowrap}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.strip-waveform.loading-overlay{position:relative}.strip-waveform .progress-bar{position:absolute;bottom:0;left:0;right:0;height:3px;background:#d4a64f4d;overflow:hidden}.strip-waveform .progress-bar:after{content:"";position:absolute;top:0;left:-30%;width:30%;height:100%;background:#d4a64fcc;animation:progress-slide 1.8s ease-in-out infinite}@keyframes progress-slide{0%{left:-30%}to{left:100%}}.dsp-banner{padding:12px 16px;background:#f443361a;border-bottom:1px solid rgba(244,67,54,.2);display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:#f44336;flex-shrink:0}.dsp-banner.ready{background:#4caf5014;border-color:#4caf5033;color:#4caf50}.dsp-banner .pulse{width:8px;height:8px;border-radius:4px;background:#f44336;animation:pulse-dot 1s ease-in-out infinite}.dsp-banner.ready .pulse{background:#4caf50;animation:none}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.6)}}:root{--sonic-base: #090a0f;--sonic-raised: #11131a;--sonic-gold: #d4a64f;--sonic-emerald: #10b981;--sonic-rose: #f43f5e;--sonic-fuchsia: #d946ef}*{margin:0;padding:0;box-sizing:border-box}body{font-family:SF Mono,Fira Code,ui-monospace,monospace;background:#000;color:#fff;-webkit-font-smoothing:antialiased;overflow:hidden}#root{width:100vw;height:100vh}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;background:#0a0a0a;font-family:SF Mono,Fira Code,Fira Mono,Cascadia Code,ui-monospace,Menlo,Consolas,monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#fff}#root{width:100%;height:100%;display:flex;justify-content:center;align-items:stretch;background:#000}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}