/* 提钱退休计划 - 全局扩展样式与字体缩放体系 */
@charset "UTF-8";

:root {
  --base-font-size: 15.5px;
}

html {
  font-size: var(--base-font-size);
}

/* 预设字号适配: 小 (13.5px) / 中 (默认 15.5px) / 大 (17.5px) */
html[data-font-size="small"] {
  --base-font-size: 13.5px;
}

html[data-font-size="medium"] {
  --base-font-size: 15.5px;
}

html[data-font-size="large"] {
  --base-font-size: 17.5px;
}

/* 动态缩放常用字阶，确保各层级阅读舒适度 */
html[data-font-size="large"] .text-xs {
  font-size: 0.875rem !important; /* ~15.3px */
  line-height: 1.45 !important;
}
html[data-font-size="large"] .text-\[11px\] {
  font-size: 0.8125rem !important; /* ~14.2px */
}
html[data-font-size="large"] .text-\[10px\] {
  font-size: 0.75rem !important; /* ~13.1px */
}
html[data-font-size="large"] .text-sm {
  font-size: 1rem !important; /* ~17.5px */
}

html[data-font-size="medium"] .text-xs {
  font-size: 0.8125rem !important; /* ~12.6px -> 13px */
  line-height: 1.4 !important;
}
html[data-font-size="medium"] .text-\[11px\] {
  font-size: 0.75rem !important; /* ~11.6px -> 12px */
}
html[data-font-size="medium"] .text-\[10px\] {
  font-size: 0.6875rem !important; /* ~10.7px -> 11px */
}

html[data-font-size="small"] .text-xs {
  font-size: 0.75rem !important;
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 18px;
  line-height: 1;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
}

.tabular-nums {
  font-variant-numeric: tabular-nums;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
  animation: fadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* VIP Glow & Frosted glass */
.vip-glow {
  box-shadow: 0 0 25px rgba(234, 179, 8, 0.25);
}

.glass-blur {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.glass-dark {
  background: rgba(15, 23, 42, 0.8);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

/* Drawer transitions */
.drawer-backdrop {
  transition: opacity 0.3s ease-in-out;
}

.drawer-panel {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Modal transitions */
.modal-backdrop {
  transition: opacity 0.2s ease-in-out;
}

/* Lightbox cursors and helpers */
.cursor-zoom-in {
  cursor: zoom-in;
}

.cursor-zoom-out {
  cursor: zoom-out;
}

#lightbox-modal {
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ==========================================================================
   Header Navigation Responsive Architecture & Anti-Wrap Rules
   ========================================================================== */
.nav-tab-link {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  position: relative;
}

/* 1. 方案 A：自适应图标模式 (Icon-Adaptive Mode - 推荐) */
/* 当屏幕宽度 <= 1260px 或 用户设置为【大字号】时生效：未激活项自动隐藏文字，仅显示图标；当前激活项保留文字高亮 */
body[data-nav-mode="icon"] .nav-tab-link:not(.tab-active) .nav-tab-text,
html[data-font-size="large"] body[data-nav-mode="icon"] .nav-tab-link:not(.tab-active) .nav-tab-text {
  display: none !important;
}

body[data-nav-mode="icon"] .nav-tab-link:not(.tab-active),
html[data-font-size="large"] body[data-nav-mode="icon"] .nav-tab-link:not(.tab-active) {
  padding-left: 0.65rem !important;
  padding-right: 0.65rem !important;
}

/* 紧凑图标模式下，HOT / VIP 文字徽章自适应为右上角精致指示小圆点 */
body[data-nav-mode="icon"] .nav-tab-link:not(.tab-active) .nav-tab-badge,
html[data-font-size="large"] body[data-nav-mode="icon"] .nav-tab-link:not(.tab-active) .nav-tab-badge {
  position: absolute !important;
  top: 5px !important;
  right: 5px !important;
  width: 7px !important;
  height: 7px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 9999px !important;
  font-size: 0 !important;
  border: 1.5px solid #ffffff !important;
}

/* 2. 方案 B：折叠更多下拉模式 (Collapse Mode) */
body[data-nav-mode="collapse"] #nav-tab-perks,
body[data-nav-mode="collapse"] #nav-tab-producthub,
body[data-nav-mode="collapse"] #nav-tab-podcasts {
  display: none !important;
}
body[data-nav-mode="collapse"] #nav-more-dropdown {
  display: block !important;
}

/* 移动端视口防横向滚动与溢出遮挡全局保护 */
html, body {
  max-width: 100vw;
  overflow-x: hidden;
}

/* 隐藏平滑水平滚动条 (保持触摸原生滑动) */
.scrollbar-none::-webkit-scrollbar {
  display: none !important;
}
.scrollbar-none {
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}