/* NOXER V30 — Liquid Glass Music Hotbar. Isolated prefixed classes. */
#nx30Hotbar{
  --nx30-ink:#f5f6ff; --nx30-sub:#a5adbf; --nx30-glow:#ac94ff;
  position:fixed;z-index:48000;top:calc(env(safe-area-inset-top,0px) + 13px);left:50%;
  transform:translateX(-50%);width:min(580px,calc(100vw - 30px));
  color:var(--nx30-ink);font:500 13px/1.35 system-ui,-apple-system,'Segoe UI',sans-serif;
  pointer-events:none;isolation:isolate;
}
#nx30Hotbar *{box-sizing:border-box}
#nx30Hotbar button,#nx30Hotbar input,#nx30Hotbar textarea{font:inherit}
#nx30Hotbar button{cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent}
#nx30Hotbar svg{width:19px;height:19px;display:block;pointer-events:none}
#nx30Hotbar .nx30-island{
  pointer-events:auto;position:relative;width:100%;height:66px;display:flex;align-items:center;
  padding:0 10px 8px;gap:9px;overflow:hidden;border-radius:25px;
  background:linear-gradient(118deg,rgba(40,43,53,.69),rgba(12,14,23,.69) 44%,rgba(33,32,49,.72));
  backdrop-filter:blur(33px) saturate(190%) brightness(1.05);
  -webkit-backdrop-filter:blur(33px) saturate(190%) brightness(1.05);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(255,255,255,.06),
     0 13px 44px rgba(0,0,0,.5),0 0 42px rgba(128,98,255,.095);
  transition:width .45s cubic-bezier(.2,.75,.2,1),border-radius .45s cubic-bezier(.2,.75,.2,1),box-shadow .3s;
}
#nx30Hotbar .nx30-island::before{
  content:'';position:absolute;pointer-events:none;z-index:-1;width:62%;height:220%;left:-30%;top:-65%;
  border-radius:48%;background:radial-gradient(ellipse,rgba(187,165,255,.3),rgba(141,116,253,.045) 56%,transparent 70%);
  filter:blur(13px);animation:nx30-mercury 11s ease-in-out infinite alternate;
}
#nx30Hotbar .nx30-island::after{
  content:'';pointer-events:none;position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(125deg,rgba(255,255,255,.17),transparent 28%,transparent 68%,rgba(207,189,255,.1));
  opacity:.7;
}
#nx30Hotbar .nx30-cover,#nx30Hotbar .nx30-icon,#nx30Hotbar .nx30-round,#nx30Hotbar .nx30-lyrics-toggle{
  flex:none;display:grid;place-items:center;position:relative;z-index:1;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.075);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:transform .2s,background-color .2s,border-color .2s,box-shadow .2s;
}
#nx30Hotbar button:hover{background-color:rgba(255,255,255,.13);border-color:rgba(255,255,255,.28)}
#nx30Hotbar button:active{transform:scale(.93)}
#nx30Hotbar .nx30-cover{height:44px;width:44px;border-radius:15px;background:linear-gradient(145deg,rgba(158,129,248,.45),rgba(72,62,135,.2));border-color:rgba(200,184,255,.38);box-shadow:inset 0 1px 1px rgba(255,255,255,.18),0 0 24px rgba(155,107,254,.2)}
#nx30Hotbar .nx30-cover svg{width:22px;height:22px}
#nx30Hotbar.nx30-playing .nx30-cover{animation:nx30-music-breathe 2.4s ease-in-out infinite}
#nx30Hotbar .nx30-track{flex:1;min-width:0;z-index:1;cursor:pointer;display:flex;flex-direction:column;gap:3px}
#nx30Hotbar .nx30-track b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;letter-spacing:-.01em}
#nx30Hotbar .nx30-track small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--nx30-sub);font-size:11px}
#nx30Hotbar .nx30-clock{font-variant-numeric:tabular-nums;font-size:10px;color:#b8becb;white-space:nowrap;z-index:1}
#nx30Hotbar .nx30-controls{display:flex;gap:4px;align-items:center;z-index:1}
#nx30Hotbar .nx30-icon{height:32px;width:32px;border-radius:11px}
#nx30Hotbar .nx30-icon svg{width:16px;height:16px}
#nx30Hotbar .nx30-primary{width:35px;height:35px;border-radius:13px;background:rgba(244,241,255,.93);color:#15121f!important;box-shadow:0 3px 13px rgba(0,0,0,.25)}
#nx30Hotbar .nx30-primary:hover{background:#fff}
#nx30Hotbar .nx30-lyrics-toggle{padding:7px 10px;border-radius:12px;font-weight:700;font-size:11px;white-space:nowrap}
#nx30Hotbar .nx30-lyrics-toggle[aria-pressed='true']{background:rgba(172,147,250,.28);border-color:rgba(201,177,255,.66);color:#f2e9ff}
#nx30Hotbar .nx30-open{border-radius:12px}
#nx30Hotbar.nx30-list-open .nx30-open svg{transform:rotate(180deg)}
#nx30Hotbar .nx30-open svg{transition:transform .28s}
#nx30Hotbar .nx30-progress{height:4px;position:absolute;left:16px;right:16px;bottom:5px;z-index:2}
#nx30Hotbar .nx30-progress input[type='range']{-webkit-appearance:none;appearance:none;width:100%;height:4px;display:block;margin:0;border-radius:10px;outline:0;background:linear-gradient(90deg,#c6b2ff var(--nx30-progress,0%),rgba(255,255,255,.18) var(--nx30-progress,0%));cursor:pointer}
#nx30Hotbar .nx30-progress input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#ece6ff;border:0;width:8px;height:8px;border-radius:50%;opacity:0;transition:opacity .2s}
#nx30Hotbar .nx30-progress:hover input::-webkit-slider-thumb{opacity:1}
#nx30Hotbar .nx30-progress input::-moz-range-thumb{width:8px;height:8px;border:0;background:#ece6ff;border-radius:50%}
#nx30Hotbar .nx30-popover{
  pointer-events:none;opacity:0;visibility:hidden;transform:translateY(-9px) scale(.978);transform-origin:top center;
  position:absolute;top:calc(100% + 8px);left:0;width:100%;max-height:min(80vh,650px);overflow:auto;
  border:1px solid rgba(255,255,255,.21);border-radius:24px;
  background:linear-gradient(146deg,rgba(26,28,37,.91),rgba(10,12,21,.92));
  backdrop-filter:blur(35px) saturate(170%);-webkit-backdrop-filter:blur(35px) saturate(170%);
  box-shadow:0 25px 80px rgba(0,0,0,.6),inset 0 1px rgba(255,255,255,.16);
  padding:17px;display:grid;gap:14px;
  transition:opacity .27s,transform .34s cubic-bezier(.2,.75,.2,1),visibility .27s;
}
#nx30Hotbar.nx30-list-open .nx30-popover{pointer-events:auto;opacity:1;visibility:visible;transform:translateY(0) scale(1)}
#nx30Hotbar .nx30-popover header{display:flex;justify-content:space-between;align-items:center;gap:12px}
#nx30Hotbar .nx30-popover header div{display:flex;flex-direction:column;gap:3px}
#nx30Hotbar .nx30-popover header strong{font-size:17px;letter-spacing:-.03em}
#nx30Hotbar .nx30-popover header small{font-size:11px;color:var(--nx30-sub)}
#nx30Hotbar .nx30-round{height:29px;width:29px;border-radius:50%}
#nx30Hotbar .nx30-queue{display:grid;gap:4px;max-height:175px;overflow:auto;overscroll-behavior:contain}
#nx30Hotbar .nx30-queue-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:13px;border:1px solid transparent}
#nx30Hotbar .nx30-queue-row.is-current{background:rgba(179,154,255,.09);border-color:rgba(215,198,255,.13)}
#nx30Hotbar .nx30-row-play{display:grid;place-items:center;width:31px;height:31px;flex:none;border-radius:11px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08)}
#nx30Hotbar .nx30-row-meta{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}
#nx30Hotbar .nx30-row-meta b,#nx30Hotbar .nx30-row-meta small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#nx30Hotbar .nx30-row-meta b{font-size:12px}#nx30Hotbar .nx30-row-meta small{font-size:10px;color:var(--nx30-sub)}
#nx30Hotbar .nx30-row-remove{border:none;background:transparent;border-radius:9px;font-size:20px;padding:5px 9px;color:#a7a7b4}
#nx30Hotbar .nx30-empty{padding:10px 4px;color:var(--nx30-sub);margin:0;font-size:12px}
#nx30Hotbar .nx30-link-form{border-top:1px solid rgba(255,255,255,.085);padding-top:13px;display:grid;gap:8px}
#nx30Hotbar .nx30-link-form label{font-weight:700;color:#dce0ed;font-size:12px}
#nx30Hotbar .nx30-link-form input,#nx30Hotbar .nx30-lyrics-sheet textarea{
  width:100%;min-width:0;outline:0;border:1px solid rgba(255,255,255,.14);border-radius:12px;
  padding:10px 11px;background:rgba(0,0,0,.21);color:#f8f6ff;
}
#nx30Hotbar .nx30-link-form input:focus,#nx30Hotbar .nx30-lyrics-sheet textarea:focus{border-color:#b79eff;box-shadow:0 0 0 3px rgba(153,123,240,.15)}
#nx30Hotbar .nx30-form-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#nx30Hotbar .nx30-action{border:1px solid rgba(255,255,255,.3);background:linear-gradient(115deg,#ede9fa,#cfc8ed);color:#201d2c!important;border-radius:12px;padding:11px 14px;font-weight:800}
#nx30Hotbar .nx30-import-button{display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;border:1px dashed rgba(255,255,255,.23);border-radius:12px;padding:11px 14px;color:#e5e1f4;font-size:12px;transition:background .2s}
#nx30Hotbar .nx30-import-button:hover{background:rgba(255,255,255,.06)}
#nx30Hotbar .nx30-link-button{padding:9px 6px;background:transparent;border:0;color:#d4c7ff;text-align:center;font-size:12px}
#nx30Hotbar .nx30-note{color:#9197aa;font-size:10px;line-height:1.5;margin:0}
#nx30Hotbar .nx30-karaoke{
  pointer-events:none;visibility:hidden;opacity:0;transform:translateY(20px) scale(.96);
  position:fixed;top:min(52vh,420px);left:50%;translate:-50% 0;width:min(630px,calc(100vw - 26px));
  min-height:148px;padding:21px 26px 18px;text-align:center;
  border:1px solid rgba(255,255,255,.15);border-radius:28px;
  background:linear-gradient(130deg,rgba(24,22,36,.57),rgba(8,9,18,.54));
  backdrop-filter:blur(27px) saturate(145%);-webkit-backdrop-filter:blur(27px) saturate(145%);
  box-shadow:0 18px 50px rgba(0,0,0,.36);transition:opacity .3s,transform .4s cubic-bezier(.2,.75,.2,1),visibility .3s;
}
#nx30Hotbar.nx30-lyrics-on .nx30-karaoke{pointer-events:auto;visibility:visible;opacity:1;transform:translateY(0) scale(1)}
#nx30Hotbar .nx30-karaoke-top{display:flex;align-items:center;justify-content:space-between;font-size:9px;font-weight:800;letter-spacing:.19em;color:#b0a6d1}
#nx30Hotbar .nx30-karaoke-top button{border:0;background:transparent;border-radius:9px;width:30px;height:30px;display:grid;place-items:center}
#nx30Hotbar .nx30-lyric-prev,#nx30Hotbar .nx30-lyric-next{color:#9897ae;font-size:12px;min-height:13px;line-height:1.5}
#nx30Hotbar .nx30-lyric-current{min-height:50px;display:flex;align-items:center;justify-content:center;color:#f9f6ff;font-size:clamp(18px,2.8vw,27px);letter-spacing:-.02em;line-height:1.38;font-weight:750;text-shadow:0 0 35px rgba(183,157,255,.16);white-space:pre-wrap;overflow-wrap:anywhere}
#nx30Hotbar .nx30-lyric-current.nx30-line-enter{animation:nx30-line .34s ease both}
#nx30Hotbar.nx30-untimed .nx30-lyric-current{display:block;overflow:auto;max-height:40vh;text-align:left;white-space:pre-line;font-size:14px;font-weight:500;line-height:1.7}
#nx30Hotbar .nx30-lyric-import{margin-top:10px;padding:6px 12px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);border-radius:999px;font-size:11px}
#nx30Hotbar .nx30-lyrics-dialog[hidden]{display:none}
#nx30Hotbar .nx30-lyrics-dialog{pointer-events:auto;position:fixed;inset:0;width:100vw;height:100dvh;left:50%;translate:-50% 0;z-index:4;display:grid;place-items:center;opacity:0;transition:opacity .25s}
#nx30Hotbar .nx30-lyrics-dialog.is-open{opacity:1}
#nx30Hotbar .nx30-lyrics-scrim{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
#nx30Hotbar .nx30-lyrics-sheet{position:relative;width:min(490px,calc(100vw - 32px));display:grid;gap:14px;padding:22px;border:1px solid rgba(255,255,255,.2);background:linear-gradient(145deg,rgba(36,36,48,.96),rgba(14,14,22,.97));border-radius:25px;box-shadow:0 30px 90px rgba(0,0,0,.6)}
#nx30Hotbar .nx30-lyrics-sheet header{display:flex;align-items:center;justify-content:space-between}
#nx30Hotbar .nx30-lyrics-sheet h2{font-size:20px;margin:0}
#nx30Hotbar .nx30-lyrics-sheet header button{border:0;background:rgba(255,255,255,.06);border-radius:50%;height:31px;width:31px;display:grid;place-items:center}
#nx30Hotbar .nx30-lyrics-sheet p{font-size:12px;color:#adb0c3;line-height:1.6;margin:0}
#nx30Hotbar .nx30-lyrics-sheet code{color:#d4c5ff;background:rgba(255,255,255,.055);border-radius:5px;padding:2px 4px}
#nx30Hotbar .nx30-lyrics-sheet textarea{min-height:175px;resize:vertical;font-size:13px;line-height:1.6}
#nx30Hotbar .nx30-lyrics-sheet footer{display:flex;justify-content:space-between;gap:9px}
#nx30Hotbar .nx30-lyrics-sheet footer button{border:1px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(255,255,255,.08);padding:10px 14px;font-weight:700}
#nx30Hotbar .nx30-notice{pointer-events:none;position:absolute;left:50%;top:calc(100% + 18px);transform:translate(-50%,-10px);background:#191923;color:#e9e7ff;padding:9px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.16);min-width:140px;max-width:min(450px,90vw);font-size:11px;text-align:center;opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;box-shadow:0 10px 30px #0009}
#nx30Hotbar .nx30-notice.show{visibility:visible;opacity:1;transform:translate(-50%,0)}
@keyframes nx30-mercury{0%{transform:translateX(0) rotate(-20deg) scale(1)}50%{transform:translateX(115%) rotate(70deg) scale(1.2,.82)}100%{transform:translateX(195%) rotate(180deg) scale(.9,1.2)}}
@keyframes nx30-music-breathe{0%,100%{box-shadow:0 0 12px rgba(151,111,255,.2)}50%{box-shadow:0 0 30px rgba(151,111,255,.46)}}
@keyframes nx30-line{from{opacity:.35;transform:translateY(10px);filter:blur(7px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}

/* Follow V20 global Liquid Glass toggle. */
html[data-noxer-glass='off'] #nx30Hotbar .nx30-island,
html[data-noxer-glass='off'] #nx30Hotbar .nx30-popover,
html[data-noxer-glass='off'] #nx30Hotbar .nx30-karaoke,
html[data-noxer-glass='off'] #nx30Hotbar .nx30-lyrics-sheet{background:#171820!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:0 10px 30px rgba(0,0,0,.35)!important}
html[data-noxer-glass='off'] #nx30Hotbar .nx30-island::before,
html[data-noxer-glass='off'] #nx30Hotbar .nx30-island::after{display:none!important}
html[data-noxer-glass='off'] #nx30Hotbar :is(.nx30-cover,.nx30-icon,.nx30-round,.nx30-lyrics-toggle){backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#262833}
html[data-noxer-glass='off'] #nx30Hotbar .nx30-primary{background:#f0ecfc!important}
html[data-noxer-glass='off'] #nx30Hotbar .nx30-lyrics-scrim{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
@media(max-width:640px){
 #nx30Hotbar{top:calc(env(safe-area-inset-top,0px) + 6px);width:calc(100vw - 16px)}
 #nx30Hotbar .nx30-island{height:59px;gap:5px;border-radius:19px;padding:0 7px 6px}
 #nx30Hotbar .nx30-cover{height:37px;width:37px;border-radius:12px}
 #nx30Hotbar .nx30-cover svg{width:18px;height:18px}
 #nx30Hotbar .nx30-track b{font-size:12px}
 #nx30Hotbar .nx30-track small{font-size:10px}
 #nx30Hotbar .nx30-clock{display:none}
 #nx30Hotbar .nx30-controls{gap:1px}
 #nx30Hotbar .nx30-icon{width:29px;height:29px;border-radius:10px}
 #nx30Hotbar .nx30-primary{width:33px;height:33px}
 #nx30Hotbar .nx30-lyrics-toggle{padding:7px;font-size:10px}
 #nx30Hotbar .nx30-popover{border-radius:19px;padding:14px;max-height:78dvh}
 #nx30Hotbar .nx30-karaoke{top:41vh;padding:15px 18px}
}
@media(max-width:355px){#nx30Hotbar .nx30-controls #nx30Prev{display:none}#nx30Hotbar .nx30-lyrics-toggle{padding:5px}}
@media(prefers-reduced-motion:reduce){
 #nx30Hotbar .nx30-island::before,#nx30Hotbar.nx30-playing .nx30-cover{animation:none!important}
 #nx30Hotbar .nx30-island,#nx30Hotbar .nx30-popover,#nx30Hotbar .nx30-karaoke,
 #nx30Hotbar .nx30-lyric-current.nx30-line-enter,#nx30Hotbar button{transition:none!important;animation:none!important}
}
/* Tiny Dynamic Island until a track starts: doesn't cover NOXER navigation. */
#nx30Hotbar:not(.nx30-has-track):not(.nx30-list-open){width:min(232px,calc(100vw - 30px))}
#nx30Hotbar:not(.nx30-has-track):not(.nx30-list-open) .nx30-island{height:53px;padding-bottom:4px;border-radius:22px}
#nx30Hotbar:not(.nx30-has-track):not(.nx30-list-open) :is(.nx30-controls,.nx30-clock,.nx30-lyrics-toggle,.nx30-open,.nx30-progress){display:none}
#nx30Hotbar:not(.nx30-has-track):not(.nx30-list-open) .nx30-cover{width:38px;height:38px;border-radius:13px}
#nx30Hotbar:not(.nx30-has-track):not(.nx30-list-open) .nx30-track b{font-size:12px}
@media(max-width:640px){#nx30Hotbar:not(.nx30-has-track):not(.nx30-list-open){width:min(205px,calc(100vw - 24px))}}
