@charset "UTF-8";.bottom[data-v-7f88cbd9] {
    height: 7rem
}
.update-modal[data-v-74df8de5] .n-dialog {
  border-radius: 1.25rem;
  overflow: hidden;
}
.update-body[data-v-74df8de5] h1 {
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}
.update-body[data-v-74df8de5] h2 {
  font-size: 1.125rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}
.update-body[data-v-74df8de5] h3 {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.update-body[data-v-74df8de5] p {
  margin-bottom: 0.75rem;
  line-height: 1.625;
}
.update-body[data-v-74df8de5] ul {
  list-style-type: disc;
  list-style-position: inside;
  margin-bottom: 0.75rem;
}
.update-body[data-v-74df8de5] ol {
  list-style-type: decimal;
  list-style-position: inside;
  margin-bottom: 0.75rem;
}
.update-body[data-v-74df8de5] li {
  margin-bottom: 0.5rem;
  line-height: 1.625;
}
.update-body[data-v-74df8de5] code {
  padding: 0.125rem 0.375rem;
  border-radius: 0.375rem;
  font-size: 0.8125rem;
  background-color: rgb(245 245 245);
}
.dark .update-body[data-v-74df8de5] code {
  background-color: rgb(64 64 64);
}
.update-body[data-v-74df8de5] pre {
  padding: 0.75rem;
  border-radius: 0.75rem;
  overflow-x: auto;
  margin-bottom: 0.75rem;
  background-color: rgb(245 245 245);
}
.dark .update-body[data-v-74df8de5] pre {
  background-color: rgb(64 64 64);
}
.update-body[data-v-74df8de5] pre code {
  background-color: transparent;
  padding: 0;
}
.update-body[data-v-74df8de5] blockquote {
  padding-left: 1rem;
  border-left: 0.25rem solid rgb(229 229 229);
  margin-bottom: 0.75rem;
  color: rgb(115 115 115);
}
.dark .update-body[data-v-74df8de5] blockquote {
  border-left-color: rgb(82 82 82);
  color: rgb(163 163 163);
}
.update-body[data-v-74df8de5] a {
  color: rgb(var(--primary-color));
  text-decoration: underline;
}
.update-body[data-v-74df8de5] a:hover {
  opacity: 0.85;
}
.update-body[data-v-74df8de5] hr {
  margin: 1rem 0;
  border: 0;
  border-top: 1px solid rgb(229 229 229);
}
.dark .update-body[data-v-74df8de5] hr {
  border-top-color: rgb(82 82 82);
}
.update-body[data-v-74df8de5] table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 0.75rem;
}
.update-body[data-v-74df8de5] th,
.update-body[data-v-74df8de5] td {
  border: 1px solid rgb(229 229 229);
  padding: 0.5rem 0.75rem;
  text-align: left;
}
.dark .update-body[data-v-74df8de5] th,
.dark .update-body[data-v-74df8de5] td {
  border-color: rgb(82 82 82);
}
.update-body[data-v-74df8de5] th {
  background-color: rgb(245 245 245);
}
.dark .update-body[data-v-74df8de5] th {
  background-color: rgb(64 64 64);
}
.sleep-timer-countdown[data-v-068a344a] {
  position: fixed;
  top: 28px;
  left: 50%;
  display: flex;
  --tw-translate-x: -50%;
  --tw-translate-y: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  cursor: pointer;
  align-items: center;
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}.sleep-timer-countdown[data-v-068a344a]:hover {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}.sleep-timer-countdown[data-v-068a344a] {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
  z-index: 9998;
  min-width: 80px;
  text-align: center;
  animation: fadeInDown-068a344a 0.3s ease-out;
  -webkit-app-region: no-drag;
}
@keyframes fadeInDown-068a344a {
from {
    transform: translate(-50%, -150%);
    opacity: 0;
}
to {
    transform: translate(-50%, -100%);
    opacity: 1;
}
}
.sleep-timer-countdown span[data-v-068a344a] {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.5px;
  font-weight: 500;
}
.app-menu[data-v-2e308a18]{
  width: 100px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}
.app-menu-list[data-v-2e308a18] {
  max-height: calc(100vh - 120px); /* 为header预留空间，防止菜单项被遮挡 */
  overflow-y: auto;
  overflow-x: hidden;
  /* 自定义滚动条样式 - 默认隐藏，悬停时显示 */
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  padding-bottom: 20px;
  transition: scrollbar-color 0.3s ease;
}
.app-menu-list[data-v-2e308a18]::-webkit-scrollbar {
  width: 4px;
}
.app-menu-list[data-v-2e308a18]::-webkit-scrollbar-track {
  background: transparent;
}
.app-menu-list[data-v-2e308a18]::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: 2px;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}
.app-menu-list[data-v-2e308a18] {
  /* 悬停时显示滚动条 */
}
.app-menu-list[data-v-2e308a18]:hover {
  scrollbar-color: rgba(156, 163, 175, 0.5) transparent;
}
.app-menu-list[data-v-2e308a18]:hover::-webkit-scrollbar-thumb {
  background-color: rgba(156, 163, 175, 0.5);
}
.app-menu-list[data-v-2e308a18]:hover::-webkit-scrollbar-thumb:hover {
  background-color: rgba(156, 163, 175, 0.7);
}
.app-menu-expanded[data-v-2e308a18]{
  width: 160px;
}
.app-menu-expanded .app-menu-item[data-v-2e308a18]{
  margin-right: 1rem;
  border-radius: 0.25rem;
}
.app-menu-expanded .app-menu-item[data-v-2e308a18]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.app-menu-expanded .app-menu-item[data-v-2e308a18]:hover:is(.dark *){
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
}
.app-menu-item-link[data-v-2e308a18],
.app-menu-header[data-v-2e308a18]{
  margin-left: 0.5rem;
  display: flex;
  width: 200px;
  align-items: center;
  overflow: hidden;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.app-menu-header[data-v-2e308a18]{
  margin-left: 0.25rem;
}
.app-menu-item-link[data-v-2e308a18]{
  margin-bottom: 1.5rem;
  margin-top: 1.5rem;
}
.app-menu-item-icon[data-v-2e308a18]{
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}
.app-menu-item-icon[data-v-2e308a18]:is(.dark *){
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.app-menu-item-icon[data-v-2e308a18]:hover{
  --tw-scale-x: 1.05 !important;
  --tw-scale-y: 1.05 !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
  --tw-text-opacity: 1 !important;
  color: rgb(34 197 94 / var(--tw-text-opacity, 1)) !important;
}
.mobile .app-menu[data-v-2e308a18] {
  max-width: 100%;
  width: 100vw;
  position: relative;
  bottom: 0;
  left: 0;
  z-index: 99999;
  border-style: none;
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.mobile .app-menu[data-v-2e308a18]:is(.dark *){
  --tw-border-opacity: 1;
  border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.mobile .app-menu-header[data-v-2e308a18] {
  display: none;
}
.mobile .app-menu-list[data-v-2e308a18]{
  display: flex;
  justify-content: space-between;
  padding-left: 1rem;
  padding-right: 1rem;
  max-height: none !important; /* 移动端不限制高度 */
  overflow: visible !important; /* 移动端不需要滚动 */
}
.mobile .app-menu-item-link[data-v-2e308a18]{
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  width: auto !important;
  margin-top: 8px;
  margin-bottom: 8px;
}
.mobile .app-menu-expanded[data-v-2e308a18]{
  width: 100%;
}
/* ── Tab track ───────────────────────────────────────── */
.tabs-track[data-v-f303c6b6] {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 34px;
  background: #f3f4f6;
  border-radius: 9999px;
  padding: 3px;
  gap: 0;
  box-sizing: border-box;
}
.dark .tabs-track[data-v-f303c6b6] {
  background: #1f2937;
}
.tab-slider-bg[data-v-f303c6b6] {
  position: absolute;
  top: 3px;
  left: 0;
  height: calc(100% - 6px);
  border-radius: 9999px;
  background: #22c55e;
  box-shadow: 0 1px 6px rgba(34, 197, 94, 0.35);
  transition:
    transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1),
    width 0.28s cubic-bezier(0.34, 1.4, 0.64, 1);
  pointer-events: none;
  z-index: 0;
}
.tab-btn[data-v-f303c6b6] {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 13px;
  border-radius: 9999px;
  font-size: 12.5px;
  font-weight: 600;
  border: none;
  background: transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.2s;
}
.tab-btn--on[data-v-f303c6b6] {
  color: #fff;
}
.tab-btn--off[data-v-f303c6b6] {
  color: #6b7280;
}
.dark .tab-btn--off[data-v-f303c6b6] {
  color: #9ca3af;
}
.tab-btn--off[data-v-f303c6b6]:hover {
  color: #111827;
}
.dark .tab-btn--off[data-v-f303c6b6]:hover {
  color: #f9fafb;
}

/* ── Back button ─────────────────────────────────────── */
.back-btn[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: transparent;
  color: #6b7280;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.15s;
}
.dark .back-btn[data-v-f303c6b6] {
  border-color: #374151;
  color: #9ca3af;
}
.back-btn[data-v-f303c6b6]:hover {
  color: #22c55e;
  border-color: #22c55e;
}

/* ── Search wrap ─────────────────────────────────────── */
.search-wrap[data-v-f303c6b6] {
  transition:
    flex 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    max-width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.search-wrap--idle[data-v-f303c6b6] {
  flex: 0 0 240px;
  max-width: 240px;
}
.search-wrap--open[data-v-f303c6b6] {
  flex: 1 1 0%;
  max-width: 9999px;
}
.search-inner[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 10px;
  border-radius: 9999px;
  border: 1.5px solid #e5e7eb;
  background: #f9fafb;
  transition:
    border-color 0.2s,
    background 0.2s,
    box-shadow 0.2s;
}
.dark .search-inner[data-v-f303c6b6] {
  border-color: #374151;
  background: #111827;
}
.search-inner--focus[data-v-f303c6b6] {
  border-color: #22c55e;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.1);
}
.dark .search-inner--focus[data-v-f303c6b6] {
  background: #0a0a0a;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.12);
}
.search-icon-glyph[data-v-f303c6b6] {
  font-size: 14px;
  color: #9ca3af;
  flex-shrink: 0;
  transition: color 0.2s;
}
.search-inner--focus .search-icon-glyph[data-v-f303c6b6] {
  color: #22c55e;
}
.search-input[data-v-f303c6b6] {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font-size: 13px;
  color: #111827;
}
.dark .search-input[data-v-f303c6b6] {
  color: #f3f4f6;
}
.search-input[data-v-f303c6b6]::-moz-placeholder {
  color: #9ca3af;
}
.search-input[data-v-f303c6b6]::placeholder {
  color: #9ca3af;
}
.type-chip[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 2px 7px;
  border-radius: 6px;
  background: #f3f4f6;
  font-size: 11px;
  font-weight: 500;
  color: #6b7280;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background 0.15s,
    color 0.15s;
  flex-shrink: 0;
}
.dark .type-chip[data-v-f303c6b6] {
  background: #1f2937;
  color: #9ca3af;
}
.type-chip[data-v-f303c6b6]:hover {
  background: #dcfce7;
  color: #16a34a;
}
.dark .type-chip[data-v-f303c6b6]:hover {
  background: rgba(34, 197, 94, 0.1);
  color: #22c55e;
}

/* ── Action buttons ──────────────────────────────────── */
.action-btn[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: transparent;
  color: #6b7280;
  font-size: 15px;
  cursor: pointer;
  transition: all 0.15s;
}
.dark .action-btn[data-v-f303c6b6] {
  border-color: #374151;
  color: #9ca3af;
}
.action-btn[data-v-f303c6b6]:hover {
  color: #22c55e;
  border-color: #bbf7d0;
  background: #f0fdf4;
}
.dark .action-btn[data-v-f303c6b6]:hover {
  border-color: #166534;
  background: rgba(34, 197, 94, 0.08);
  color: #22c55e;
}
.action-btn.intelligence-active[data-v-f303c6b6] {
  color: #ec4899;
  border-color: #fbcfe8;
  background: #fdf2f8;
}
.dark .action-btn.intelligence-active[data-v-f303c6b6] {
  color: #ec4899;
  border-color: #831843;
  background: rgba(236, 72, 153, 0.1);
}

/* ── User button ─────────────────────────────────────── */
.user-btn[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 2px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: transparent;
  cursor: pointer;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.dark .user-btn[data-v-f303c6b6] {
  border-color: #374151;
}
.user-btn[data-v-f303c6b6]:hover {
  border-color: #22c55e;
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.12);
}
.login-label[data-v-f303c6b6] {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  padding: 0 8px;
}
.dark .login-label[data-v-f303c6b6] {
  color: #9ca3af;
}

/* ── User menu ───────────────────────────────────────── */
.user-menu[data-v-f303c6b6] {
  min-width: 220px;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #f3f4f6;
  box-shadow:
    0 4px 20px rgba(0, 0, 0, 0.1),
    0 1px 4px rgba(0, 0, 0, 0.05);
}
.dark .user-menu[data-v-f303c6b6] {
  background: #111827;
  border-color: #1f2937;
}
.user-menu-top[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 14px 10px;
  cursor: pointer;
  transition: background 0.15s;
}
.user-menu-top[data-v-f303c6b6]:hover {
  background: #f9fafb;
}
.dark .user-menu-top[data-v-f303c6b6]:hover {
  background: #1f2937;
}
.user-name[data-v-f303c6b6] {
  font-size: 13px;
  font-weight: 600;
  color: #111827;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dark .user-name[data-v-f303c6b6] {
  color: #f3f4f6;
}
.menu-sep[data-v-f303c6b6] {
  height: 1px;
  background: #f3f4f6;
  margin: 2px 0;
}
.dark .menu-sep[data-v-f303c6b6] {
  background: #1f2937;
}
.menu-list[data-v-f303c6b6] {
  padding: 3px 0 5px;
}
.menu-row[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 14px;
  font-size: 13px;
  color: #374151;
  cursor: pointer;
  transition: background 0.12s;
}
.dark .menu-row[data-v-f303c6b6] {
  color: #d1d5db;
}
.menu-row[data-v-f303c6b6]:hover {
  background: #f9fafb;
}
.dark .menu-row[data-v-f303c6b6]:hover {
  background: #1f2937;
}
.menu-row i[data-v-f303c6b6] {
  font-size: 15px;
  color: #9ca3af;
  flex-shrink: 0;
  width: 16px;
  text-align: center;
}
.zoom-ctrl[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  gap: 3px;
}
.zoom-btn[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  border: none;
  background: #f3f4f6;
  color: #6b7280;
  font-size: 10px;
  cursor: pointer;
  transition: all 0.12s;
}
.zoom-btn[data-v-f303c6b6]:hover {
  background: #dcfce7;
  color: #16a34a;
}
.zoom-val[data-v-f303c6b6] {
  font-size: 11px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 4px;
  background: #f3f4f6;
  color: #6b7280;
  cursor: pointer;
  transition: all 0.12s;
}
.zoom-val--100[data-v-f303c6b6] {
  background: #dcfce7;
  color: #16a34a;
}
.ver-chip[data-v-f303c6b6] {
  font-size: 11px;
  font-weight: 500;
  padding: 1px 6px;
  border-radius: 5px;
  background: #f3f4f6;
  color: #6b7280;
}
.dark .ver-chip[data-v-f303c6b6] {
  background: #1f2937;
  color: #9ca3af;
}

/* ── Suggestions ─────────────────────────────────────── */
.suggestions-box[data-v-f303c6b6] {
  background: #fff;
}
.dark .suggestions-box[data-v-f303c6b6] {
  background: #111827;
}
.suggest-row[data-v-f303c6b6] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  font-size: 13px;
  color: #374151;
  cursor: pointer;
  transition: background 0.1s;
}
.dark .suggest-row[data-v-f303c6b6] {
  color: #d1d5db;
}
.suggest-row[data-v-f303c6b6]:hover,
.suggest-row--hi[data-v-f303c6b6] {
  background: #f0fdf4;
  color: #16a34a;
}
.dark .suggest-row[data-v-f303c6b6]:hover,
.dark .suggest-row--hi[data-v-f303c6b6] {
  background: rgba(34, 197, 94, 0.06);
  color: #22c55e;
}
.suggest-icon[data-v-f303c6b6] {
  font-size: 13px;
  color: #9ca3af;
  flex-shrink: 0;
}
.suggest-loading[data-v-f303c6b6] {
  display: flex;
  justify-content: center;
  padding: 12px;
}

/* ── Nav page title ──────────────────────────────────── */
.nav-page-title[data-v-f303c6b6] {
  font-size: 15px;
  font-weight: 700;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 280px;
  letter-spacing: -0.01em;
}
.dark .nav-page-title[data-v-f303c6b6] {
  color: #f9fafb;
}

/* ── Transitions ─────────────────────────────────────── */
.tab-slide-enter-active[data-v-f303c6b6],
.tab-slide-leave-active[data-v-f303c6b6] {
  transition:
    opacity 0.2s ease,
    transform 0.2s ease;
}
.tab-slide-enter-from[data-v-f303c6b6],
.tab-slide-leave-to[data-v-f303c6b6] {
  opacity: 0;
  transform: translateX(-8px);
}
.nav-title-enter-active[data-v-f303c6b6] {
  transition:
    opacity 0.22s ease,
    transform 0.22s ease;
}
.nav-title-leave-active[data-v-f303c6b6] {
  transition:
    opacity 0.18s ease,
    transform 0.18s ease;
}
.nav-title-enter-from[data-v-f303c6b6] {
  opacity: 0;
  transform: translateY(8px);
}
.nav-title-leave-to[data-v-f303c6b6] {
  opacity: 0;
  transform: translateY(-8px);
}
#title-bar[data-v-3295871c] {
  -webkit-app-region: drag;
  z-index: 3000;
}
#buttons[data-v-3295871c] {
  -webkit-app-region: no-drag;
}.mobile-header[data-v-5382da8e] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}.mobile-header[data-v-5382da8e]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}.mobile-header[data-v-5382da8e] {
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));
}.mobile-header[data-v-5382da8e]:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(31 41 55 / var(--tw-border-opacity, 1));
}.mobile-header[data-v-5382da8e] {
  min-height: 56px;
}
.mobile-header.safe-area-top[data-v-5382da8e] {
  padding-top: calc(var(--safe-area-inset-top, 0px) + 16px);
}
.header-left[data-v-5382da8e] {
  display: flex;
  align-items: center;
  min-width: 80px;
}
.header-logo[data-v-5382da8e] {
  display: flex;
  align-items: center;
}
.header-logo .logo-text[data-v-5382da8e] {
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
}
.header-title[data-v-5382da8e] {
  flex: 1 1 0%;
  text-align: center;
}
.header-title span[data-v-5382da8e] {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.header-title span[data-v-5382da8e]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.header-right[data-v-5382da8e] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 80px;
  justify-content: flex-end;
}
.header-btn[data-v-5382da8e] {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  width: 2.5rem;
  border-radius: 9999px;
  font-size: 1.25rem;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}
.header-btn[data-v-5382da8e]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(209 213 219 / var(--tw-text-opacity, 1));
}
.header-btn[data-v-5382da8e]:active {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.header-btn[data-v-5382da8e]:active:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
}
.header-btn[data-v-5382da8e] {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}.mobile-layout[data-v-c3f124d0] {
  display: flex;
  height: 100vh;
  width: 100vw;
  flex-direction: column;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1))
}.mobile-layout[data-v-c3f124d0]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1))
}.mobile-layout[data-v-c3f124d0] {
  overflow: hidden;
  position: relative
}
.mobile-content[data-v-c3f124d0] {
  flex: 1 1 0%;
  overflow: auto
}
.mobile-page[data-v-c3f124d0] {
  height: 100%
}
.mobile-bottom-menu[data-v-c3f124d0] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1))
}
.mobile-bottom-menu[data-v-c3f124d0]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1))
}
.mobile-bottom-menu[data-v-c3f124d0] {
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1))
}
.mobile-bottom-menu[data-v-c3f124d0]:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(31 41 55 / var(--tw-border-opacity, 1))
}
.mobile-menu[data-v-c3f124d0] {
  width: 100%
}.layout-page[data-v-84319f6b] {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.layout-page[data-v-84319f6b]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.layout-main[data-v-84319f6b] {
  position: relative;
  height: 100%;
  width: 100%;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.layout-main[data-v-84319f6b]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.layout-main-page[data-v-84319f6b] {
  display: flex;
  height: 100%;
}
.menu[data-v-84319f6b] {
  height: 100%;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.menu[data-v-84319f6b]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.main[data-v-84319f6b] {
  display: flex;
  flex: 1 1 0%;
  flex-direction: column;
  overflow: hidden;
}
.main-content[data-v-84319f6b] {
  flex: 1 1 0%;
  overflow: hidden;
}
.main-page[data-v-84319f6b] {
  height: 100%;
}
.mobile .main-content[data-v-84319f6b] {
  height: calc(100vh - 130px);
  overflow: auto;
  display: block;
  flex: none;
  position: relative;
}
.mobile .mobile-content[data-v-84319f6b] {
  height: calc(100vh - 75px);
  position: relative;
}[data-v-f26a8695] .n-dropdown-menu {
    min-width: 240px;
    overflow: hidden;
    border-radius: 0.5rem;
    border-width: 1px
}
[data-v-f26a8695] .n-dropdown-menu:is(.dark *) {
    --tw-border-opacity: 1;
    border-color: rgb(31 41 55 / var(--tw-border-opacity, 1))
}
[data-v-f26a8695] .n-dropdown-menu .n-dropdown-option {
    height: 2.25rem;
    font-size: 0.875rem;
    line-height: 1.25rem
}
[data-v-f26a8695] .n-dropdown-menu .n-dropdown-option:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1))
}
[data-v-f26a8695] .n-dropdown-menu .n-dropdown-option:hover:is(.dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1))
}
[data-v-f26a8695] .n-dropdown-menu .n-dropdown-option .n-dropdown-option-body {
    height: 100%
}
[data-v-f26a8695] .n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__prefix {
    display: flex;
    width: 2rem;
    align-items: center;
    justify-content: center
}
[data-v-f26a8695] .n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__prefix .iconfont {
    font-size: 1rem;
    line-height: 1.5rem
}
[data-v-f26a8695] .n-dropdown-menu .n-dropdown-divider {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem
}
[data-v-f26a8695] .n-dropdown-option-body--render {
    padding: 0px
}.song-item[data-v-eef9fe6a] {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  align-items: center;
  border-radius: 0.75rem;
  background-color: transparent;
  padding: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}.song-item[data-v-eef9fe6a]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-ellipsis[data-v-eef9fe6a] {
  width: 100%;
}.compact-song-item[data-v-9fb7b757] {
  margin-bottom: 0.25rem;
  height: 3rem;
  border-radius: 0.75rem;
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));
  padding: 0.5rem;
}
.compact-song-item[data-v-9fb7b757]:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(31 41 55 / var(--tw-border-opacity, 1));
}
.compact-song-item[data-v-9fb7b757]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}
.compact-song-item[data-v-9fb7b757]:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}
.compact-song-item:hover .opacity-0[data-v-9fb7b757] {
  opacity: 1;
}
.compact-song-item .song-item-index[data-v-9fb7b757] {
  width: 2rem;
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-index[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-select[data-v-9fb7b757] {
  margin-right: 0.75rem;
  cursor: pointer;
}
.compact-song-item .song-item-content-compact[data-v-9fb7b757] {
  display: flex;
  flex: 1 1 0%;
  align-items: center;
  gap: 0.5rem;
}
.compact-song-item .song-item-content-compact-wrapper[data-v-9fb7b757] {
  display: flex;
  min-width: 0px;
  flex: 2;
  align-items: center;
  gap: 0.5rem;
}
.compact-song-item .song-item-content-compact-title[data-v-9fb7b757] {
  display: flex;
  min-width: 0px;
  flex: 2.5;
  cursor: pointer;
  align-items: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-content-compact-title[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-content-compact-artist[data-v-9fb7b757] {
  display: flex;
  min-width: 0px;
  flex: 1.5;
  align-items: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-content-compact-artist[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-content-compact-album[data-v-9fb7b757] {
  display: flex;
  min-width: 0px;
  flex: 1.5;
  align-items: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-content-compact-album[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-content-compact-duration[data-v-9fb7b757] {
  display: flex;
  width: 3.5rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-content-compact-duration[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact[data-v-9fb7b757] {
  display: flex;
  min-width: 160px;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  border-style: none;
  background-color: transparent;
}
.compact-song-item .song-item-operating-compact .song-item-operating-like[data-v-9fb7b757],
.compact-song-item .song-item-operating-compact .song-item-operating-play[data-v-9fb7b757],
.compact-song-item .song-item-operating-compact .song-item-operating-menu[data-v-9fb7b757] {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}
.compact-song-item .song-item-operating-compact .song-item-operating-play[data-v-9fb7b757] {
  display: flex;
  height: 1.75rem;
  width: 1.75rem;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-play[data-v-9fb7b757]:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-play[data-v-9fb7b757]:hover, .compact-song-item .song-item-operating-compact .song-item-operating-play.bg-green-600[data-v-9fb7b757] {
  --tw-border-opacity: 1;
  border-color: rgb(34 197 94 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-play .iconfont[data-v-9fb7b757] {
  font-size: 1rem;
  line-height: 1.5rem;
}
.compact-song-item .song-item-operating-compact .song-item-operating-like[data-v-9fb7b757] {
  margin-right: 0.25rem;
  margin-left: 0px;
  cursor: pointer;
}
.compact-song-item .song-item-operating-compact .song-item-operating-like .iconfont[data-v-9fb7b757] {
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.compact-song-item .song-item-operating-compact .song-item-operating-like .iconfont[data-v-9fb7b757]:hover {
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-like .iconfont[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-like .like-active[data-v-9fb7b757] {
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-like .like-active[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-menu[data-v-9fb7b757] {
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.compact-song-item .song-item-operating-compact .song-item-operating-menu .iconfont[data-v-9fb7b757] {
  font-size: 1.25rem;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.compact-song-item .song-item-operating-compact .song-item-operating-menu .iconfont[data-v-9fb7b757]:hover {
  --tw-text-opacity: 1;
  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .song-item-operating-menu .iconfont[data-v-9fb7b757]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.compact-song-item .song-item-operating-compact .opacity-0[data-v-9fb7b757] {
  opacity: 0;
}
[data-v-9fb7b757] .text-ellipsis {
  width: 100%;
}.list-song-item[data-v-2eb47d0b] {
  padding: 0.5rem; /* p-2 */
  border-radius: 0.75rem; /* rounded-xl */
  margin-bottom: 0.5rem; /* mb-2 */
  border-width: 1px;
  border-color: rgb(229, 231, 235); /* border-gray-200 */
}
.list-song-item[data-v-2eb47d0b]:hover {
  background-color: rgb(249, 250, 251); /* bg-gray-50 */
}
.list-song-item .song-item-img[data-v-2eb47d0b] {
  width: 2.5rem; /* w-10 */
  height: 2.5rem; /* h-10 */
  border-radius: 0.75rem; /* rounded-xl */
  margin-right: 0.75rem; /* mr-3 */
}
.list-song-item .song-item-content[data-v-2eb47d0b] {
  display: flex;
  align-items: center;
  flex: 1;
}
.list-song-item .song-item-content-wrapper[data-v-2eb47d0b] {
  display: flex;
  align-items: center;
  flex: 1;
  font-size: 0.875rem; /* text-sm */
  line-height: 1.25rem;
}
.list-song-item .song-item-content-title[data-v-2eb47d0b] {
  flex-shrink: 0;
  max-width: 45%;
  color: rgb(17, 24, 39); /* text-gray-900 */
}
.list-song-item .song-item-content-divider[data-v-2eb47d0b] {
  margin-left: 0.5rem; /* mx-2 */
  margin-right: 0.5rem;
  color: rgb(107, 114, 128); /* text-gray-500 */
}
.list-song-item .song-item-content-name[data-v-2eb47d0b] {
  flex: 1;
  min-width: 0;
  color: rgb(107, 114, 128); /* text-gray-500 */
}
.list-song-item .song-item-operating-list[data-v-2eb47d0b] {
  display: flex;
  align-items: center;
  gap: 0.5rem; /* gap-2 */
}
.list-song-item .song-item-operating-list-like[data-v-2eb47d0b] {
  cursor: pointer;
  transition-property: transform;
  transition-duration: 0.15s;
}
.list-song-item .song-item-operating-list-like[data-v-2eb47d0b]:hover {
  transform: scale(1.1); /* hover:scale-110 */
}
.list-song-item .song-item-operating-list-like .iconfont[data-v-2eb47d0b] {
  font-size: 1rem;
  color: rgb(107, 114, 128); /* text-gray-500 */
}
.list-song-item .song-item-operating-list-like .iconfont[data-v-2eb47d0b]:hover {
  color: rgb(239, 68, 68); /* hover:text-red-500 */
}
.list-song-item .song-item-operating-list-like .like-active[data-v-2eb47d0b] {
  color: rgb(239, 68, 68) !important;
}
.list-song-item .song-item-operating-list-play[data-v-2eb47d0b] {
  width: 1.75rem; /* w-7 */
  height: 1.75rem; /* h-7 */
  cursor: pointer;
  transition-property: transform;
  transition-duration: 0.15s;
  border-radius: 9999px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.list-song-item .song-item-operating-list-play[data-v-2eb47d0b]:hover {
  transform: scale(1.1); /* hover:scale-110 */
}
.list-song-item .song-item-operating-list-play .iconfont[data-v-2eb47d0b] {
  font-size: 1rem; /* text-base */
}
.list-song-item .song-item-operating-list-play.bg-green-600[data-v-2eb47d0b] {
  background-color: rgb(34, 197, 94);
  color: white;
}

/* dark mode */
.dark .list-song-item[data-v-2eb47d0b] {
  border-color: rgb(31, 41, 55); /* dark:border-gray-800 */
}
.dark .list-song-item[data-v-2eb47d0b]:hover {
  background-color: rgb(31, 41, 55); /* dark:bg-gray-800 */
}
.dark .list-song-item .song-item-content-title[data-v-2eb47d0b] {
  color: white;
}
.dark .list-song-item .song-item-content-divider[data-v-2eb47d0b], .dark .list-song-item .song-item-content-name[data-v-2eb47d0b] {
  color: rgb(156, 163, 175); /* dark:text-gray-400 */
}
.dark .list-song-item .song-item-operating-list-like .iconfont[data-v-2eb47d0b] {
  color: rgb(156, 163, 175); /* dark:text-gray-400 */
}.mini-song-item[data-v-d2386aeb] {
  padding: 0.5rem; /* p-2 */
  border-radius: 0.75rem; /* rounded-xl */
}
.mini-song-item[data-v-d2386aeb]:hover {
  background-color: rgb(249, 250, 251); /* bg-gray-50 */
}
.mini-song-item .song-item-img[data-v-d2386aeb] {
  width: 2.5rem; /* w-10 */
  height: 2.5rem; /* h-10 */
  margin-right: 0.5rem; /* mr-2 */
  border-radius: 0.75rem; /* rounded-xl */
}
.mini-song-item .song-item-content[data-v-d2386aeb] {
  flex: 1;
}
.mini-song-item .song-item-content-title[data-v-d2386aeb] {
  font-size: 0.875rem; /* text-sm */
  line-height: 1.25rem;
  color: rgb(17, 24, 39); /* text-gray-900 */
}
.mini-song-item .song-item-content-name[data-v-d2386aeb] {
  font-size: 0.75rem; /* text-xs */
  line-height: 1rem;
  color: rgb(107, 114, 128); /* text-gray-500 */
}
.mini-song-item .song-item-operating[data-v-d2386aeb] {
  display: flex;
  align-items: center;
  border-radius: 9999px; /* rounded-full */
  margin-left: 1rem; /* ml-4 */
  padding-left: 0.5rem; /* pl-2 */
  border-width: 1px;
  border-color: rgb(229, 231, 235); /* border-gray-200 */
  background-color: #fff; /* bg-light fallback */
}
.mini-song-item .song-item-operating .iconfont[data-v-d2386aeb] {
  font-size: 1rem; /* text-base */
}
.mini-song-item .song-item-operating-like[data-v-d2386aeb] {
  margin-right: 0.25rem; /* mr-1 */
  margin-left: 0.25rem; /* ml-1 */
  cursor: pointer;
}
.mini-song-item .song-item-operating-like .icon-likefill[data-v-d2386aeb] {
  font-size: 1rem;
  transition-property: color;
  transition-duration: 0.15s;
  color: rgb(107, 114, 128); /* text-gray-500 */
}
.mini-song-item .song-item-operating-like .icon-likefill[data-v-d2386aeb]:hover {
  color: rgb(239, 68, 68); /* hover:text-red-500 */
}
.mini-song-item .song-item-operating-like .like-active[data-v-d2386aeb] {
  color: rgb(239, 68, 68) !important; /* text-red-500 */
}
.mini-song-item .song-item-operating-play[data-v-d2386aeb] {
  cursor: pointer;
  border-radius: 9999px; /* rounded-full */
  width: 2rem; /* w-8 */
  height: 2rem; /* h-8 */
  display: flex;
  justify-content: center;
  align-items: center;
  transition-property: all;
  transition-duration: 0.15s;
  border-width: 1px;
  border-color: rgb(229, 231, 235); /* border-gray-200 */
  color: rgb(17, 24, 39); /* text-gray-900 */
}
.mini-song-item .song-item-operating-play[data-v-d2386aeb]:hover, .mini-song-item .song-item-operating-play.bg-green-600[data-v-d2386aeb] {
  background-color: rgb(34, 197, 94); /* bg-green-500 = #22c55e */
  border-color: rgb(34, 197, 94);
  color: white;
}

/* dark mode */
.dark .mini-song-item[data-v-d2386aeb]:hover {
  background-color: rgb(31, 41, 55); /* dark:bg-gray-800 */
}
.dark .mini-song-item .song-item-content-title[data-v-d2386aeb] {
  color: white;
}
.dark .mini-song-item .song-item-content-name[data-v-d2386aeb] {
  color: rgb(156, 163, 175); /* dark:text-gray-400 */
}
.dark .mini-song-item .song-item-operating[data-v-d2386aeb] {
  border-color: rgb(55, 65, 81); /* dark:border-gray-700 */
  background-color: black; /* dark:bg-black */
}
.dark .mini-song-item .song-item-operating-like .icon-likefill[data-v-d2386aeb] {
  color: rgb(156, 163, 175); /* dark:text-gray-400 */
}
.dark .mini-song-item .song-item-operating-play[data-v-d2386aeb] {
  border-color: rgb(55, 65, 81); /* dark:border-gray-700 */
  color: white; /* dark:text-white */
}.standard-song-item[data-v-e3110e98]:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(248 249 250 / var(--tw-bg-opacity, 1))
}
.standard-song-item[data-v-e3110e98]:hover:is(.dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1))
}
.standard-song-item .song-item-img[data-v-e3110e98] {
    margin-right: 1rem;
    height: 3rem;
    width: 3rem;
    border-radius: 0.75rem
}
.standard-song-item .song-item-content[data-v-e3110e98] {
    flex: 1 1 0%
}
.standard-song-item .song-item-content-title[data-v-e3110e98] {
    font-size: 1rem;
    line-height: 1.5rem;
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-content-title[data-v-e3110e98]:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-content-name[data-v-e3110e98] {
    font-size: 0.75rem;
    line-height: 1rem;
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-content-name[data-v-e3110e98]:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating[data-v-e3110e98] {
    margin-left: 1rem;
    display: flex;
    align-items: center;
    border-radius: 9999px;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1))
}
.standard-song-item .song-item-operating[data-v-e3110e98]:is(.dark *) {
    --tw-border-opacity: 1;
    border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1))
}
.standard-song-item .song-item-operating .iconfont[data-v-e3110e98] {
    font-size: 1.25rem;
    line-height: 1.75rem
}
.standard-song-item .song-item-operating .icon-likefill[data-v-e3110e98] {
    font-size: 1.25rem;
    line-height: 1.75rem;
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms
}
.standard-song-item .song-item-operating .icon-likefill[data-v-e3110e98]:hover {
    --tw-text-opacity: 1;
    color: rgb(239 68 68 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating .icon-likefill[data-v-e3110e98]:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating-like[data-v-e3110e98] {
    margin-right: 0.5rem;
    margin-left: 1rem;
    cursor: pointer;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms
}
.standard-song-item .song-item-operating-next[data-v-e3110e98] {
    margin-right: 0.5rem;
    cursor: pointer;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms
}
.standard-song-item .song-item-operating-next .iconfont[data-v-e3110e98] {
    font-size: 1.25rem;
    line-height: 1.75rem;
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms
}
.standard-song-item .song-item-operating-next .iconfont[data-v-e3110e98]:hover {
    --tw-text-opacity: 1;
    color: rgb(34 197 94 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating-next .iconfont[data-v-e3110e98]:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating .like-active[data-v-e3110e98] {
    --tw-text-opacity: 1;
    color: rgb(239 68 68 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating .like-active[data-v-e3110e98]:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(239 68 68 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating-play[data-v-e3110e98] {
    display: flex;
    height: 2.5rem;
    width: 2.5rem;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms
}
.standard-song-item .song-item-operating-play[data-v-e3110e98]:is(.dark *) {
    --tw-border-opacity: 1;
    border-color: rgb(55 65 81 / var(--tw-border-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-operating-play[data-v-e3110e98]:hover, .standard-song-item .song-item-operating-play.bg-green-600[data-v-e3110e98] {
    --tw-border-opacity: 1;
    border-color: rgb(34 197 94 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1))
}
.standard-song-item .song-item-select[data-v-e3110e98] {
    margin-right: 0.75rem;
    cursor: pointer
}.mini-play-bar[data-v-38deb3bf] {
  display: flex;
  width: 100%;
  flex-direction: column;
  background-color: rgb(233 236 239 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.6;
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}.mini-play-bar[data-v-38deb3bf]:is(.dark *) {
  background-color: rgb(45 45 45 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.6;
}.mini-play-bar[data-v-38deb3bf] {
  height: 64px;
  border-radius: 8px;
  position: relative;
}
.mini-play-bar.mini-mode[data-v-38deb3bf] {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  -webkit-app-region: drag;
}
.mini-play-bar.mini-mode .mini-bar-container[data-v-38deb3bf] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.mini-play-bar.mini-mode .song-info[data-v-38deb3bf] {
  width: 120px;
}
.mini-play-bar.mini-mode .song-info .song-title[data-v-38deb3bf] {
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
}
.mini-play-bar.mini-mode .song-info .song-artist[data-v-38deb3bf] {
  font-size: 0.75rem;
  line-height: 1rem;
  opacity: 0.5;
}
.mini-play-bar.mini-mode .function-buttons[data-v-38deb3bf] {
  -webkit-app-region: no-drag;
  margin-left: 0.25rem;
}
.mini-play-bar.mini-mode .function-buttons[data-v-38deb3bf] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.mini-play-bar.mini-mode .function-buttons .function-button[data-v-38deb3bf] {
  width: 28px;
  height: 28px;
}
.mini-play-bar.mini-mode .function-buttons .function-button .iconfont[data-v-38deb3bf] {
  font-size: 1rem;
  line-height: 1.5rem;
}
.mini-play-bar.mini-mode .control-buttons[data-v-38deb3bf] {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.mini-play-bar.mini-mode .control-buttons[data-v-38deb3bf] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.125rem * var(--tw-space-x-reverse));
  margin-left: calc(0.125rem * calc(1 - var(--tw-space-x-reverse)));
}
.mini-play-bar.mini-mode .control-buttons[data-v-38deb3bf] {
  -webkit-app-region: no-drag;
}
.mini-play-bar.mini-mode .control-buttons .control-button[data-v-38deb3bf] {
  width: 28px;
  height: 28px;
}
.mini-play-bar.mini-mode .control-buttons .control-button .iconfont[data-v-38deb3bf] {
  font-size: 1rem;
  line-height: 1.5rem;
}
.mini-play-bar.mini-mode .close-button[data-v-38deb3bf] {
  -webkit-app-region: no-drag;
  width: 28px;
  height: 28px;
}
.mini-play-bar.mini-mode .album-cover[data-v-38deb3bf] {
  margin-right: 0.5rem;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  -webkit-app-region: no-drag;
}
.mini-play-bar.mini-mode .progress-bar[data-v-38deb3bf] {
  height: 3px !important;
  transform: scaleY(0.67);
}
.mini-play-bar.mini-mode .progress-bar[data-v-38deb3bf]:hover {
  transform: scaleY(1);
}
.mini-bar-container[data-v-38deb3bf] {
  position: relative;
  display: flex;
  height: 100%;
  align-items: center;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.album-cover[data-v-38deb3bf] {
  margin-right: 0.75rem;
  flex-shrink: 0;
  cursor: pointer;
  width: 40px;
  height: 40px;
}
.album-cover .cover-img[data-v-38deb3bf] {
  pointer-events: none;
  height: 100%;
  width: 100%;
  border-radius: 0.375rem;
  -o-object-fit: cover;
     object-fit: cover;
}
.song-info[data-v-38deb3bf] {
  margin-right: 1rem;
  display: flex;
  min-width: 0px;
  flex-shrink: 1;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  width: 200px;
}
.song-info .song-title[data-v-38deb3bf] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  color: var(--text-color-1, #000);
}
.song-info .song-artist[data-v-38deb3bf] {
  margin-top: 0.125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.75rem;
  line-height: 1rem;
  opacity: 0.6;
  color: var(--text-color-2, #666);
}
.control-buttons[data-v-38deb3bf] {
  margin-left: 1rem;
  margin-right: 1rem;
  display: flex;
  align-items: center;
}
.control-buttons[data-v-38deb3bf] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.control-button[data-v-38deb3bf] {
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border-width: 0px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}
.control-button[data-v-38deb3bf]:hover {
  --tw-text-opacity: 1;
  color: rgb(31 41 55 / var(--tw-text-opacity, 1));
}
.control-button[data-v-38deb3bf]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.control-button[data-v-38deb3bf]:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(229 231 235 / var(--tw-text-opacity, 1));
}
.control-button[data-v-38deb3bf] {
  width: 32px;
  height: 32px;
}
.control-button[data-v-38deb3bf]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.control-button[data-v-38deb3bf]:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(61 61 61 / var(--tw-bg-opacity, 1));
}
.control-button.play[data-v-38deb3bf] {
  --tw-bg-opacity: 1;
  background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.control-button.play[data-v-38deb3bf]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(22 101 52 / var(--tw-bg-opacity, 1));
}
.control-button .iconfont[data-v-38deb3bf] {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.function-buttons[data-v-38deb3bf] {
  margin-left: auto;
  display: flex;
  align-items: center;
}
.function-buttons[data-v-38deb3bf] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.function-button[data-v-38deb3bf] {
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border-width: 0px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}
.function-button[data-v-38deb3bf]:hover {
  --tw-text-opacity: 1;
  color: rgb(31 41 55 / var(--tw-text-opacity, 1));
}
.function-button[data-v-38deb3bf]:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.function-button[data-v-38deb3bf]:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(229 231 235 / var(--tw-text-opacity, 1));
}
.function-button[data-v-38deb3bf] {
  width: 32px;
  height: 32px;
}
.function-button[data-v-38deb3bf]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.function-button[data-v-38deb3bf]:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(61 61 61 / var(--tw-bg-opacity, 1));
}
.function-button[data-v-38deb3bf]:hover {
  color: var(--text-color-1, #000);
}
.function-button .iconfont[data-v-38deb3bf] {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.close-button[data-v-38deb3bf] {
  margin-left: 0.5rem;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border-width: 0px;
  background-color: transparent;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  width: 32px;
  height: 32px;
  color: var(--text-color-2, #666);
}
.close-button[data-v-38deb3bf]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.close-button[data-v-38deb3bf]:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(61 61 61 / var(--tw-bg-opacity, 1));
}
.close-button[data-v-38deb3bf]:hover {
  color: var(--text-color-1, #000);
}
.progress-bar[data-v-38deb3bf] {
  position: relative;
  width: 100%;
  cursor: pointer;
  height: 4px;
  transform: scaleY(0.5);
  transform-origin: bottom center;
  transition: transform 0.2s ease;
}
.progress-bar[data-v-38deb3bf]:hover {
  transform: scaleY(1);
}
.progress-track[data-v-38deb3bf] {
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 0px;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  height: 4px;
  background: rgba(0, 0, 0, 0.1);
}
.dark .progress-track[data-v-38deb3bf] {
  background: rgba(255, 255, 255, 0.15);
}
.progress-fill[data-v-38deb3bf] {
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 4px;
  background: var(--primary-color, #18a058);
  transition: background-color 0.2s ease;
}
.like-active[data-v-38deb3bf] {
  --tw-text-opacity: 1 !important;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1)) !important;
}
.like-active[data-v-38deb3bf]:hover {
  --tw-text-opacity: 1 !important;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1)) !important;
}
.volume-slider-wrapper[data-v-38deb3bf] {
  border-radius: 0.75rem;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.9;
  padding: 0.5rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.volume-slider-wrapper[data-v-38deb3bf]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
}
.volume-slider-wrapper[data-v-38deb3bf] {
  height: 160px;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider {
  --n-rail-height: 4px;
  --n-rail-color: #e5e7eb;
  --n-rail-color-dark: #374151;
  --n-fill-color: #22c55e;
  --n-handle-size: 12px;
  --n-handle-color: #22c55e;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider.n-slider--vertical {
  height: 100%;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider.n-slider--vertical .n-slider-rail {
  width: 4px;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider.n-slider--vertical:hover .n-slider-rail {
  width: 6px;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider.n-slider--vertical:hover .n-slider-handle {
  width: 14px;
  height: 14px;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider .n-slider-rail {
  overflow: hidden;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)) !important;
  --tw-bg-opacity: 0.1 !important;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider .n-slider-rail:is(.dark *) {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(61 61 61 / var(--tw-bg-opacity, 1)) !important;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider .n-slider-handle {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  opacity: 0;
}
.volume-slider-wrapper[data-v-38deb3bf] .n-slider:hover .n-slider-handle {
  opacity: 1;
}
.playlist-container[data-v-38deb3bf] {
  position: fixed;
  left: 0px;
  right: 0px;
  overflow: hidden;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.playlist-container[data-v-38deb3bf]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
}
.playlist-container[data-v-38deb3bf] {
  top: 64px;
  height: 330px;
  max-height: 330px;
}
.playlist-container.mini-mode-list[data-v-38deb3bf] {
  width: 340px;
  --tw-bg-opacity: 0.9;
}
.playlist-container.mini-mode-list[data-v-38deb3bf]:is(.dark *) {
  --tw-bg-opacity: 0.9;
}
.music-play-list-content[data-v-38deb3bf] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.music-play-list-content .delete-btn[data-v-38deb3bf] {
  cursor: pointer;
  border-radius: 9999px;
  padding: 0.5rem;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}
.music-play-list-content .delete-btn[data-v-38deb3bf]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}
.music-play-list-content .delete-btn[data-v-38deb3bf]:hover:is(.dark *) {
  background-color: rgb(127 29 29 / 0.2);
}
.music-play-list-content .delete-btn .iconfont[data-v-38deb3bf] {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.fade-enter-active[data-v-38deb3bf],
.fade-leave-active[data-v-38deb3bf] {
  transition: opacity 0.3s ease;
}
.fade-enter-from[data-v-38deb3bf],
.fade-leave-to[data-v-38deb3bf] {
  opacity: 0;
}
.playlist-scrollbar[data-v-38deb3bf] {
  height: 100%;
}
.playlist-items[data-v-38deb3bf] {
  padding: 4px 0;
}
.dark .song-info .song-title[data-v-38deb3bf] {
  color: var(--text-color-1, #fff);
}
.dark .song-info .song-artist[data-v-38deb3bf] {
  color: var(--text-color-2, #fff);
}
[data-v-38deb3bf] .n-popover {
  background-color: transparent !important;
}.mini-layout[data-v-23207610] {
    height: 100%;
    width: 100%;
    background-color: transparent
}