/* ============================================================
   DualStar · 灵动胶囊通知（v561 原创高级功能）
   韩系低饱和黑白灰 · 极简
   ============================================================ */
.ds-capsule-root {
  position: fixed;
  top: calc(var(--safe-area-top, env(safe-area-inset-top, 0px)) + 10px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 999999;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  pointer-events: none;
  width: max-content;
  max-width: calc(100vw - 32px);
}

/* —— 通知胶囊：墨黑（浅色模式）/ 白（深色模式） —— */
.ds-capsule {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 11px 18px;
  border-radius: 999px;
  background: linear-gradient(180deg, #2E2E2E 0%, #1C1C1C 100%);
  color: #F5F5F5;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.3px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    0 10px 28px rgba(0, 0, 0, 0.30);
  cursor: pointer;
  opacity: 0;
  transform: translateY(-14px) scale(0.94);
  transition: opacity 0.32s var(--ease-out), transform 0.32s var(--ease-out);
  max-width: calc(100vw - 32px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ds-capsule.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.ds-capsule-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  flex-shrink: 0;
}
.ds-capsule-icon svg { width: 13px; height: 13px; }
.ds-capsule-text {
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 深色模式：白底黑字 */
:root[data-theme="dark"] .ds-capsule {
  background: linear-gradient(180deg, #FFFFFF 0%, #E8E8E8 100%);
  color: #1A1A1A;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 10px 28px rgba(0, 0, 0, 0.45);
}
:root[data-theme="dark"] .ds-capsule-icon {
  background: rgba(0, 0, 0, 0.08);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ds-capsule {
    background: linear-gradient(180deg, #FFFFFF 0%, #E8E8E8 100%);
    color: #1A1A1A;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.9),
      0 10px 28px rgba(0, 0, 0, 0.45);
  }
  :root:not([data-theme="light"]) .ds-capsule-icon {
    background: rgba(0, 0, 0, 0.08);
  }
}

/* —— 每日摘要卡片：白底细边框（浅色）/ 深灰玻璃（深色） —— */
.ds-capsule-daily {
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.96);
  color: #1A1A1A;
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 14px 36px rgba(0, 0, 0, 0.12);
  padding: 14px 16px;
  width: 300px;
  max-width: calc(100vw - 36px);
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  white-space: normal;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
.ds-daily-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.ds-daily-title {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.4px;
  color: #1A1A1A;
}
.ds-daily-close {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: #999;
  cursor: pointer;
  transition: background var(--dur-fast), color var(--dur-fast);
}
.ds-daily-close:hover { background: #F0F0F0; color: #333; }
.ds-daily-rows {
  display: flex;
  flex-direction: column;
  margin-top: 6px;
}
.ds-daily-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 6px;
  border-radius: 12px;
  cursor: pointer;
  transition: background var(--dur-fast);
}
.ds-daily-row:hover { background: #F5F5F5; }
.ds-daily-icon {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  background: #F0F0F0;
  color: #333;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  flex-shrink: 0;
}
.ds-daily-label {
  font-size: 11px;
  color: #999;
  letter-spacing: 1px;
  flex-shrink: 0;
  width: 40px;
}
.ds-daily-text {
  font-size: 12.5px;
  color: #333;
  letter-spacing: 0.2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 深色模式摘要卡片 */
:root[data-theme="dark"] .ds-capsule-daily {
  background: rgba(42, 42, 46, 0.96);
  color: #E8E8E8;
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 14px 36px rgba(0, 0, 0, 0.45);
}
:root[data-theme="dark"] .ds-daily-head { border-bottom-color: rgba(255, 255, 255, 0.08); }
:root[data-theme="dark"] .ds-daily-title { color: #E8E8E8; }
:root[data-theme="dark"] .ds-daily-close { color: #888; }
:root[data-theme="dark"] .ds-daily-close:hover { background: rgba(255, 255, 255, 0.1); color: #fff; }
:root[data-theme="dark"] .ds-daily-row:hover { background: rgba(255, 255, 255, 0.07); }
:root[data-theme="dark"] .ds-daily-icon { background: rgba(255, 255, 255, 0.1); color: #E8E8E8; }
:root[data-theme="dark"] .ds-daily-label { color: #8A8A8A; }
:root[data-theme="dark"] .ds-daily-text { color: #CFCFCF; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ds-capsule-daily {
    background: rgba(42, 42, 46, 0.96);
    color: #E8E8E8;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.08),
      0 14px 36px rgba(0, 0, 0, 0.45);
  }
  :root:not([data-theme="light"]) .ds-daily-head { border-bottom-color: rgba(255, 255, 255, 0.08); }
  :root:not([data-theme="light"]) .ds-daily-title { color: #E8E8E8; }
  :root:not([data-theme="light"]) .ds-daily-close { color: #888; }
  :root:not([data-theme="light"]) .ds-daily-close:hover { background: rgba(255, 255, 255, 0.1); color: #fff; }
  :root:not([data-theme="light"]) .ds-daily-row:hover { background: rgba(255, 255, 255, 0.07); }
  :root:not([data-theme="light"]) .ds-daily-icon { background: rgba(255, 255, 255, 0.1); color: #E8E8E8; }
  :root:not([data-theme="light"]) .ds-daily-label { color: #8A8A8A; }
  :root:not([data-theme="light"]) .ds-daily-text { color: #CFCFCF; }
}

/* 触屏：胶囊略收窄 */
@media (max-width: 768px) {
  .ds-capsule-daily { width: 300px; }
}