*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#000;--surface:#191919;--dim:#252525;--muted:#585858;--text:#ddd;--magenta:#ff2d6f;--cyan:#00e5ff;--lime:#39ff14;--yellow:#ffe600;--violet:#b84dff;--orange:#ff8c00;--font:"Departure Mono", monospace;--sp:.303vw;--sp-2:calc(var(--sp) * 2);--sp-3:calc(var(--sp) * 3);--sp-4:calc(var(--sp) * 4);--sp-5:calc(var(--sp) * 5);--sp-6:calc(var(--sp) * 6);--sp-8:calc(var(--sp) * 8);--sp-10:calc(var(--sp) * 10);--font-size:calc(var(--sp) * 9);--text-md:var(--font-size);--text-sm:calc(var(--font-size) - var(--sp));--text-xs:calc(var(--font-size) - var(--sp-2));--text-xxs:calc(var(--font-size) - var(--sp-3));--dot:var(--sp-2);--icon-sm:var(--sp-8);--icon-md:calc(var(--sp) * 12);--thumb:var(--sp-4);--panel-rule-w:clamp(2px, var(--sp-2), 4px);--mask-vol-muted:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2018%2020'%3E%3Cpath%20fill%3D'white'%20fill-rule%3D'evenodd'%20clip-rule%3D'evenodd'%20d%3D'M12%2014V16H16V14H18V6H16V14H12ZM12%2012H14V8H13.9632L12%209.9632V12Z'%2F%3E%3Cpath%20fill%3D'white'%20fill-rule%3D'evenodd'%20clip-rule%3D'evenodd'%20d%3D'M5.9632%2016H6V18H8V20H10V11.9632L5.9632%2016Z'%2F%3E%3Cpath%20fill%3D'white'%20fill-rule%3D'evenodd'%20clip-rule%3D'evenodd'%20d%3D'M0%2014H2.55635L0%2016.5563L1.41421%2017.9706L4%2015.3848L10%209.38477L16.9706%202.41421L15.5563%201L10%206.55635V0H8V2H6V4H4V6H0V14Z'%2F%3E%3C%2Fsvg%3E")}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);font-size:var(--font-size);line-height:1.5}::selection{background:var(--magenta);color:#fff}::-webkit-scrollbar{width:var(--sp-2)}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--dim)}::-webkit-scrollbar-thumb:hover{background:var(--muted)}button,.btn,.ctrl-btn,.btn-panel-header,.row-action,.row.clickable,.streams-toggle,.viz-overlay,.vol-label,.player-controls,.panel-header,.footer,.logo,.npl-title,.player-info,.elapsed-time{-webkit-user-select:none;user-select:none}.text-muted{color:var(--muted)}.text-magenta{color:var(--magenta)}.text-violet{color:var(--violet)}.text-sm{font-size:var(--text-sm)}.text-xs{font-size:var(--text-xs)}.text-xxs{font-size:var(--text-xxs)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}#auth-screen{background:var(--bg);z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#auth-screen.hidden{opacity:0;pointer-events:none}.auth-box{padding:calc(var(--sp) * 20);max-width:calc(var(--sp) * 170);text-align:center;gap:var(--sp-6);flex-direction:column;width:90%;display:flex}.auth-title{color:var(--magenta);line-height:0}.auth-sub{color:var(--muted);font-size:var(--text-sm)}.auth-field{display:flex}.input{box-sizing:border-box;background:var(--dim);min-width:0;color:var(--text);font-family:var(--font);font-size:var(--text-xxs);padding:var(--sp-3);border:none;outline:none}.input::placeholder{color:var(--muted)}.input:disabled{opacity:.5;cursor:not-allowed}.input--auth{background:var(--surface);width:100%;font-size:var(--text-md);padding:var(--sp-5);caret-color:var(--magenta);text-align:center}.auth-join-btn{justify-content:center;align-items:center;gap:var(--sp-3);display:inline-flex}.auth-spinner{box-sizing:border-box;width:var(--icon-sm);height:var(--icon-sm);border:calc(var(--panel-rule-w) + 1px) solid color-mix(in srgb, currentColor 28%, transparent);border-top-color:currentColor;border-radius:50%;flex-shrink:0;animation:.7s linear infinite auth-spin}@keyframes auth-spin{to{transform:rotate(360deg)}}.auth-error{color:var(--magenta);font-size:var(--text-xs);margin-top:var(--sp-6);min-height:1.5em}#app{scrollbar-gutter:stable;height:100vh;display:none;overflow-y:auto}#app.active{justify-content:center;display:flex}.shell{width:100%;min-height:100vh;padding:0 var(--sp-10);flex-direction:column;margin:0 auto;display:flex}.header{padding:var(--sp-8) 0;flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.logo{color:var(--magenta);height:var(--icon-sm);width:auto;line-height:0}.logo svg{height:var(--icon-sm);width:auto;display:block}.header-actions{align-items:center;gap:var(--sp-5);display:flex}.header-menu{align-items:center;display:inline-flex;position:relative}.header-menu.hidden{display:none}.header-icon-btn{color:var(--muted);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.header-icon-btn:hover{color:var(--text)}.header-icon-btn:active{color:var(--magenta)}.header-icon-btn:focus-visible{outline:2px solid var(--magenta);outline-offset:2px}.header-menu:hover .header-icon-btn,.header-menu:focus-within .header-icon-btn{color:var(--text)}.header-icon{image-rendering:pixelated;height:var(--icon-sm);width:var(--icon-sm);background:currentColor;font-style:normal;display:block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.header-icon-logout{-webkit-mask-image:url("data:image/svg+xml,%3Csvg width='16' height='20' viewBox='0 0 16 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 20H2V18H14V20ZM2 18H0V2H2V18ZM16 18H14V15H16V18ZM12 7H14V9H16V11H14V13H12V15H10V11H4V9H10V5H12V7ZM16 5H14V2H16V5ZM14 2H2V0H14V2Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg width='16' height='20' viewBox='0 0 16 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 20H2V18H14V20ZM2 18H0V2H2V18ZM16 18H14V15H16V18ZM12 7H14V9H16V11H14V13H12V15H10V11H4V9H10V5H12V7ZM16 5H14V2H16V5ZM14 2H2V0H14V2Z' fill='white'/%3E%3C/svg%3E")}.header-icon-btn:hover .header-icon-logout{-webkit-mask-image:url("data:image/svg+xml,%3Csvg width='16' height='20' viewBox='0 0 16 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 20H14V18H16V15V11H14V13H12V15H10V11H4V9H10V5H12V7H14V9H16V2H14V0H2V2H0V18H2V20Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg width='16' height='20' viewBox='0 0 16 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 20H14V18H16V15V11H14V13H12V15H10V11H4V9H10V5H12V7H14V9H16V2H14V0H2V2H0V18H2V20Z' fill='white'/%3E%3C/svg%3E")}.header-icon-admin{-webkit-mask-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 12V14H4V16H6V18H8V16H6V14H4V12H2Z' fill='white'/%3E%3Cpath d='M12 18H14V16H16V14H18V12H20V2H18V7H10V18H8V20H12V18Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 2H18V0H2V2H0V12H2V7H10V2Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 12V14H4V16H6V18H8V16H6V14H4V12H2Z' fill='white'/%3E%3Cpath d='M12 18H14V16H16V14H18V12H20V2H18V7H10V18H8V20H12V18Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 2H18V0H2V2H0V12H2V7H10V2Z' fill='white'/%3E%3C/svg%3E")}.header-icon-btn:hover .header-icon-admin,.header-menu:hover .header-icon-admin,.header-menu:focus-within .header-icon-admin{-webkit-mask-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14 16H16V14H18V12H20V2H18V0H2V2H0V12H2V14H4V16H6V18H8V20H12V18H14V16Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14 16H16V14H18V12H20V2H18V0H2V2H0V12H2V14H4V16H6V18H8V20H12V18H14V16Z' fill='white'/%3E%3C/svg%3E")}.header-tooltip{min-width:calc(var(--sp) * 70);background:var(--dim);z-index:20;flex-direction:column;display:none;position:absolute;top:100%;right:0}.header-menu:hover .header-tooltip,.header-menu:focus-within .header-tooltip{display:flex}.header-tooltip-item{box-sizing:border-box;background:var(--dim);width:100%;color:var(--muted);font-family:var(--font);font-size:var(--text-xxs);text-align:left;cursor:pointer;white-space:nowrap;padding:var(--sp-3) var(--sp-4);border:none}.header-tooltip-item:hover{color:var(--text)}.header-tooltip-item:active{color:var(--magenta)}.header-tooltip-item:focus-visible{outline:2px solid var(--magenta);outline-offset:-2px}.native-dialog{max-width:min(calc(100vw - var(--sp-8) * 2), calc(var(--sp) * 120));padding:var(--sp-6);border:var(--panel-rule-w) solid var(--muted);background:var(--surface);color:var(--text);font-family:inherit;font-size:var(--text-sm);box-shadow:0 var(--sp-2) var(--sp-10) #00000073;margin:auto;position:fixed;inset:0}.native-dialog::backdrop{background:color-mix(in srgb, var(--bg) 75%, transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.native-dialog-title{font-size:var(--text-md);color:var(--yellow);margin-bottom:var(--sp-3);font-weight:400}.native-dialog-body{font-size:var(--text-xs);color:var(--text);margin-bottom:var(--sp-6);line-height:1.45}.native-dialog-actions{justify-content:flex-end;gap:var(--sp-3);flex-wrap:wrap;align-items:center;display:flex}.btn,.btn-dialog{font-family:var(--font);font-size:var(--text-xxs);padding:var(--sp-2) var(--sp-4);cursor:pointer;background:var(--dim);color:var(--text);box-sizing:border-box;border:none}.panel .btn,.panel .btn-dialog{border:var(--panel-rule-w) solid var(--muted)}.btn:hover:not(:disabled),.btn-dialog:hover:not(:disabled){color:var(--text)}.panel .btn:hover:not(:disabled),.panel .btn-dialog:hover:not(:disabled){border-color:var(--text)}.btn:focus-visible,.btn-dialog:focus-visible{outline:2px solid var(--magenta);outline-offset:2px}.btn:disabled,.btn-dialog:disabled{opacity:.45;cursor:not-allowed}.btn-secondary,.btn-dialog-secondary{color:var(--muted)}.btn-secondary:hover:not(:disabled),.btn-dialog-secondary:hover:not(:disabled){color:var(--text)}.btn-danger,.btn-dialog-danger{background:color-mix(in srgb, var(--magenta) 22%, var(--dim));color:var(--magenta)}.panel .btn-danger,.panel .btn-dialog-danger{border:var(--panel-rule-w) solid var(--magenta)}.btn-danger:hover:not(:disabled),.btn-dialog-danger:hover:not(:disabled){color:#fff;background:var(--magenta)}.panel .btn-danger:hover:not(:disabled),.panel .btn-dialog-danger:hover:not(:disabled){border-color:var(--magenta)}.btn-primary,.btn-dialog-primary{background:color-mix(in srgb, var(--magenta) 22%, var(--dim));color:var(--magenta)}.btn-primary:hover:not(:disabled),.btn-dialog-primary:hover:not(:disabled){color:#fff;background:var(--magenta)}.panel .btn-primary,.panel .btn-dialog-primary{border:var(--panel-rule-w) solid var(--magenta)}.panel .btn-primary:hover:not(:disabled),.panel .btn-dialog-primary:hover:not(:disabled){border-color:var(--magenta)}.btn-nudge,.btn-dialog-nudge{background:color-mix(in srgb, var(--yellow) 20%, var(--dim));color:var(--yellow);font-weight:700}.panel .btn-nudge,.panel .btn-dialog-nudge{border:var(--panel-rule-w) solid color-mix(in srgb, var(--yellow) 65%, var(--muted))}.btn-nudge:hover:not(:disabled),.btn-dialog-nudge:hover:not(:disabled){color:var(--bg);background:var(--yellow)}.panel .btn-nudge:hover:not(:disabled),.panel .btn-dialog-nudge:hover:not(:disabled){border-color:var(--yellow)}.btn-icon{padding:var(--sp-2);min-width:calc(var(--sp) * 14);min-height:var(--icon-md);justify-content:center;align-items:center;line-height:1;display:inline-flex}.row-action.btn-icon{box-sizing:border-box;width:calc(var(--sp) * 8);height:calc(var(--sp) * 8);min-width:calc(var(--sp) * 8);min-height:calc(var(--sp) * 8);max-width:calc(var(--sp) * 8);max-height:calc(var(--sp) * 8);font-size:var(--text-xxs);padding:0}.btn-block{width:100%}.btn-wide{width:100%;padding:var(--sp-4) var(--sp-5);font-size:var(--text-xs)}.visualizer-wrap{aspect-ratio:3;width:100%;margin-bottom:var(--sp-6);background:#080808;position:relative;overflow:hidden}.visualizer-wrap canvas{cursor:pointer;width:100%;height:100%;display:block}.viz-overlay{cursor:pointer;z-index:2;background:#0a0a0ab3;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.viz-overlay.hidden{opacity:0;pointer-events:none}.viz-pointer{color:#fff;font-size:var(--text-sm);text-align:center;line-height:1.8}.viz-pointer:before{content:"";width:var(--icon-md);height:var(--icon-md);margin:0 auto var(--sp-4);image-rendering:pixelated;background:#fff;display:block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 2H10V8H12V6H14V8H16V10H18V8H20V10H22V18H20V20H18V22H6V20H4V18H2V16H0V12H2V10H4V14H6V8H4V2H6V0H8V2Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 2H10V8H12V6H14V8H16V10H18V8H20V10H22V18H20V20H18V22H6V20H4V18H2V16H0V12H2V10H4V14H6V8H4V2H6V0H8V2Z' fill='white'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.player-bar{z-index:1;align-items:flex-end;gap:0 var(--sp-6);padding:var(--sp-6);pointer-events:none;background:0 0;flex-wrap:wrap;display:flex;position:absolute;bottom:0;left:0;right:0}.player-info{flex-direction:column;flex:40%;gap:0;min-width:0;display:flex}.npl-title{height:calc(var(--sp) * 11);line-height:calc(var(--sp) * 11);font-size:var(--text-sm);color:var(--text);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.metadata-scroll{height:var(--icon-md);white-space:nowrap;align-items:center;display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 80%,#0000);mask-image:linear-gradient(90deg,#000 80%,#0000)}.metadata-text{font-size:var(--text-xxs);color:var(--muted);line-height:1.2;animation:3.5s linear infinite metadata-marquee;display:inline-block}.metadata-scroll:has(.metadata-text:empty){display:none}@keyframes metadata-marquee{0%,10%{transform:translate(0)}55%,to{transform:translateX(var(--scroll-distance,0))}}.elapsed-time{font-size:var(--text-xxs);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;margin-right:var(--sp-4)}.player-controls{pointer-events:auto;flex-shrink:0;align-items:center;display:flex}.ctrl-btn{color:var(--muted);font-family:var(--font);font-size:var(--text-md);width:calc(var(--sp) * 16);height:var(--icon-md);cursor:pointer;white-space:nowrap;background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex}.ctrl-btn:hover:not(:disabled){color:var(--text)}.ctrl-btn:active:not(:disabled){color:var(--magenta)}.ctrl-btn:disabled{color:var(--dim);cursor:default}.ctrl-btn.active{color:var(--magenta)}.ctrl-play{color:var(--magenta);font-size:var(--text-sm)}.ctrl-play:hover:not(:disabled){color:var(--text)}.ctrl-wrap{display:inline-flex;position:relative}.vote-toast{font-size:var(--text-xxs);color:var(--yellow);white-space:nowrap;pointer-events:none;opacity:0;margin-bottom:var(--sp);flex-direction:column;align-items:center;line-height:1;display:flex;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.vote-toast.visible{opacity:1;animation:1s ease-in-out infinite vote-bob}.vote-toast:after{content:"▼";line-height:1}@keyframes vote-bob{0%,to{transform:translate(-50%)translateY(0)}50%{transform:translateX(-50%) translateY(calc(var(--sp) * -2))}}.volume-control{align-items:center;gap:var(--sp-3);flex-shrink:0;display:flex}.volume-control:hover input[type=range]::-webkit-slider-thumb{background:var(--text)}.volume-control:hover input[type=range]::-moz-range-thumb{background:var(--text)}.vol-mute-btn{cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;margin:0;padding:0;display:inline-flex}.vol-mute-btn:focus-visible{outline:2px solid var(--magenta);outline-offset:2px}.vol-icon{width:var(--icon-sm);height:var(--icon-sm);margin-left:var(--sp-4);background:var(--muted);image-rendering:pixelated;font-style:normal;display:block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 20'%3E%3Cpath d='M10 20H8V18H6V16H8V4H6V2H8V0H10V20ZM6 16H4V14H6V16ZM16 16H12V14H16V16ZM4 8H2V12H4V14H0V6H4V8ZM18 14H16V6H18V14ZM14 12H12V8H14V12ZM6 6H4V4H6V6ZM16 6H12V4H16V6Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 20'%3E%3Cpath d='M10 20H8V18H6V16H8V4H6V2H8V0H10V20ZM6 16H4V14H6V16ZM16 16H12V14H16V16ZM4 8H2V12H4V14H0V6H4V8ZM18 14H16V6H18V14ZM14 12H12V8H14V12ZM6 6H4V4H6V6ZM16 6H12V4H16V6Z' fill='white'/%3E%3C/svg%3E");-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.volume-control:not(.is-muted):hover .vol-icon{background:var(--text);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 20'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 16V14H16V16H12ZM16 6H18V14H16V6ZM16 6H12V4H16V6ZM14 12H12V8H14V12Z' fill='white'/%3E%3Cpath d='M4 6H0V14H4V16H6V18H8V20H10V0H8V2H6V4H4V6Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 20'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 16V14H16V16H12ZM16 6H18V14H16V6ZM16 6H12V4H16V6ZM14 12H12V8H14V12Z' fill='white'/%3E%3Cpath d='M4 6H0V14H4V16H6V18H8V20H10V0H8V2H6V4H4V6Z' fill='white'/%3E%3C/svg%3E")}.volume-control.is-muted .vol-icon{opacity:.55;-webkit-mask-image:var(--mask-vol-muted);-webkit-mask-image:var(--mask-vol-muted);mask-image:var(--mask-vol-muted)}.volume-control.is-muted:hover .vol-icon{opacity:1;background:var(--text)}.vol-slider-wrap{align-items:center;display:inline-flex;position:relative}.vol-pct{font-size:var(--text-xxs);color:var(--text);white-space:nowrap;pointer-events:none;opacity:0;margin-bottom:var(--sp);position:absolute;bottom:100%;left:0;transform:translate(-50%)}.volume-control:hover .vol-pct{opacity:1}.volume-control input[type=range]{appearance:none;width:calc(var(--sp) * 24);height:var(--sp);background:var(--dim);cursor:pointer;outline:none}.volume-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:var(--thumb);height:var(--thumb);background:var(--muted);cursor:pointer}.volume-control input[type=range]::-webkit-slider-thumb:hover{background:var(--text)}.volume-control input[type=range]::-moz-range-thumb{width:var(--thumb);height:var(--thumb);background:var(--muted);cursor:pointer;border:none}.panels{gap:var(--sp-6);flex:1;grid-template-columns:1fr 1fr;min-width:0;display:grid}.panel{background:var(--surface);min-width:0;min-height:0;padding:var(--sp-6);flex-direction:column;display:flex;overflow:hidden}.panel-header{font-size:var(--text-xs);color:var(--text);padding-top:var(--sp-6);padding-bottom:var(--sp-6);margin-bottom:var(--sp-6);border-top:var(--panel-rule-w) dotted var(--dim);border-bottom:var(--panel-rule-w) solid var(--dim);flex-shrink:0;justify-content:space-between;align-items:baseline;display:flex}.panel>.panel-header:first-child{border-top:none;padding-top:0}.panel-header h2{font-size:inherit;margin:0;font-weight:400}.panel-header .panel-count{color:var(--muted)}.btn-panel-header{appearance:none;text-align:left;cursor:pointer;width:100%;font-family:var(--font);font-weight:400;line-height:inherit;background:0 0;border-left:none;border-right:none;padding-left:0;padding-right:0}.btn-panel-header:focus-visible{outline:2px solid var(--magenta);outline-offset:2px}.streams{margin-top:var(--sp-6);min-width:0}button.streams-header.panel-header{border-bottom:none;margin-bottom:0;padding-bottom:0}.streams:has(.streams-panel:not(.streams-collapsed)) button.streams-header.panel-header{border-bottom:var(--panel-rule-w) solid var(--dim);margin-bottom:var(--sp-6);padding-bottom:var(--sp-6)}.streams-header .streams-toggle-label{color:var(--muted);flex-shrink:0}.streams-header:hover .streams-toggle-label,.streams-header:focus-visible .streams-toggle-label{color:var(--text)}.streams-header:focus-visible{outline:2px solid var(--magenta);outline-offset:2px}.streams-panel{scrollbar-gutter:stable;max-height:calc(var(--sp) * 250);min-width:0}.streams-panel.streams-collapsed{max-height:0;overflow-y:hidden}.panel-body{scrollbar-gutter:stable;flex:1}.panel-body>ul,.streams-panel>ul{margin:0;padding:0;list-style:none}.row{align-items:center;gap:var(--sp-3);font-size:var(--text-xxs);color:var(--muted);display:flex;position:relative}.row.clickable{cursor:pointer}.row.clickable:hover{color:var(--text)}.row.active,.panel-lobby .row .row-label{color:var(--magenta)}.row-icon{box-sizing:border-box;text-align:center;font-style:normal}.row-icon--presence{justify-content:center;align-items:center;display:flex}.row-icon--presence:before{content:"";width:var(--dot);height:var(--dot);background:var(--lime);flex-shrink:0}.row-icon--presence.row-icon--disconnected:before{background:var(--muted)}.row.is-disconnected .row-label{color:var(--muted);font-style:italic}.row-label{flex:1;min-width:0}.panel-lobby .row>.row-label{align-items:center;gap:var(--sp-2);display:flex}.panel-lobby .row .row-name-score{align-items:center;gap:var(--sp-2);flex:1 1 0;min-width:0;display:flex}.panel-lobby .row .row-name-score .row-name-part-wrap{flex:0 auto;align-items:center;min-width:0;max-width:100%;display:inline-flex;position:relative;overflow:visible}.panel-lobby .row .row-name-score .row-name-part-wrap .row-name-part{z-index:1;text-overflow:ellipsis;white-space:nowrap;flex:0 auto;min-width:0;position:relative;overflow:hidden}.lobby-nudge-reticle{z-index:2;font-size:var(--text-xxs);color:var(--yellow);pointer-events:none;flex-direction:column;align-items:center;margin-bottom:0;line-height:1;animation:.4s linear 6 forwards nudge-chevron-blink;display:flex;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.lobby-nudge-reticle:after{content:"▼";line-height:.2}@keyframes nudge-chevron-blink{0%,to{opacity:1}50%{opacity:0}}.panel-lobby .row .row-name-score .row-score{flex-shrink:0;margin-left:0}.panel-lobby .row .row-name-score-fill{flex:1 1 0;min-width:0}.row-presence-badges{align-items:center;gap:var(--sp-2);margin-left:var(--sp-2);flex-shrink:0;display:inline-flex}.lobby-presence{width:max(14px, var(--sp-6));height:max(14px, var(--sp-6));background:var(--muted);image-rendering:pixelated;flex-shrink:0;font-style:normal;display:block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.panel-lobby .lobby-presence--muted{background:var(--cyan);-webkit-mask-image:var(--mask-vol-muted);-webkit-mask-image:var(--mask-vol-muted);mask-image:var(--mask-vol-muted)}.panel-lobby .lobby-presence--afk{background:var(--yellow);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M12 3V2h4v1h2v2h1v4h-1V6h-1V5h-2V4h-2v2H9V4H8V2H9V1h3v2h4v2h-2V3h-2ZM3 10V9h6v1H8v1H7v1H6v1H5v1H4v1H3v1H2v1H1v-2h1v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1v-1H3Z' fill='white'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M12 3V2h4v1h2v2h1v4h-1V6h-1V5h-2V4h-2v2H9V4H8V2H9V1h3v2h4v2h-2V3h-2ZM3 10V9h6v1H8v1H7v1H6v1H5v1H4v1H3v1H2v1H1v-2h1v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1v-1H3Z' fill='white'/%3E%3C/svg%3E")}.row-peer-actions{align-items:center;gap:var(--sp-2);flex-shrink:0;display:inline-flex}.row-action{opacity:0;flex-shrink:0}.row:hover .row-action{opacity:1}.row-tag{color:var(--muted);font-size:var(--text-xxs)}.row-score{color:var(--cyan);font-feature-settings:"sups" 1;position:relative}.score-pop{color:var(--cyan);font-size:var(--text-xxs);pointer-events:none;animation:2s ease-out forwards scorePopUp;position:absolute;top:0;left:0}.score-sparkle{color:var(--cyan);font-size:var(--text-xxs);pointer-events:none;animation:1s ease-out forwards scoreSparkle;position:absolute;top:0;left:0}@keyframes scorePopUp{0%{opacity:1;transform:translate(-50%)}70%{opacity:1}to{opacity:0;transform:translate(-50%, calc(var(--sp) * -7))}}@keyframes scoreSparkle{0%{opacity:.8;transform:translate(-50%)}60%{opacity:.4}to{opacity:0;transform:translate(calc(-50% + var(--sx,0px)), var(--sy,-10px))}}.queue-add{gap:var(--sp-2);padding-top:var(--sp-4);flex-shrink:0;display:flex}.queue-add .input{flex:1}.queue-add--stack{align-items:stretch;gap:var(--sp-3);flex-direction:column}.queue-add--stack .input,.queue-add--stack .btn-block{flex:none;width:100%}.empty-state{color:var(--muted);font-size:var(--text-xs)}.footer{padding:var(--sp-5) 0;font-size:var(--text-xxs);color:var(--muted);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.footer-version{flex-shrink:0}.footer-status{align-items:center;gap:var(--sp-3);color:var(--lime);display:flex}.footer-status .dot{width:var(--dot);height:var(--dot);background:currentColor;display:inline-block}.footer-status.loading{color:var(--cyan)}.footer-status.disconnected{color:var(--orange)}.footer-status.error{color:var(--magenta)}.footer-status.idle{color:var(--muted)}@media (width<=560px){:root{--sp:.45vw}.panels{grid-template-columns:1fr}.player-bar{padding:var(--sp-5)}.player-controls{justify-content:space-between;width:100%}}