/* ============================================================

   cognitive.css · 认知可访问性

   阅读辅助 / 渐进式披露 / 减少选项

   ============================================================ */



/* 阅读进度条 */

.reading-progress {

  position: fixed;

  top: 0; left: 0;

  height: 3px;

  width: 0;

  background: var(--color-primary-500);

  z-index: var(--z-fixed);

  transition: width var(--duration-fast) var(--ease-out);

}



/* 预计阅读时间 */

.reading-time {

  display: inline-flex;

  align-items: center;

  gap: 4px;

  font-size: var(--text-sm);

  color: var(--color-text-tertiary);

}



/* 目录导航（桌面端sticky） */

.toc-nav {

  position: sticky;

  top: 80px;

  max-height: calc(100vh - 100px);

  overflow-y: auto;

  padding: var(--rhythm-normal);

  background: var(--color-surface);

  border-radius: var(--radius-md);

  font-size: var(--text-sm);

}

.toc-nav h4 { margin-top: 0; margin-bottom: var(--rhythm-normal); font-size: var(--text-base); }

.toc-nav ul { list-style: none; padding: 0; margin: 0; }

.toc-nav li { margin-bottom: var(--space-2); }

.toc-nav a { color: var(--color-text-secondary); display: block; padding: 4px 0; }

.toc-nav a.active { color: var(--color-primary-600); font-weight: var(--font-medium); }



@media (max-width: 768px) {

  .toc-nav {

    position: static;

    max-height: none;

    margin-bottom: var(--rhythm-normal);

  }

  .toc-nav details summary { cursor: pointer; font-weight: var(--font-medium); }

}



/* 回到顶部按钮 */

.back-to-top {

  position: fixed;

  right: 20px; bottom: 20px;

  width: 48px; height: 48px;

  border-radius: 50%;

  background: var(--color-primary-500);

  color: #fff;

  border: none;

  cursor: pointer;

  font-size: 1.25rem;

  display: none;

  align-items: center;

  justify-content: center;

  box-shadow: var(--shadow-lg);

  z-index: var(--z-fixed);

  transition: opacity var(--duration-normal) var(--ease-out);

}

.back-to-top.visible { display: flex; }

.back-to-top:hover { background: var(--color-primary-600); }

@media (max-width: 768px) { .back-to-top { width: 44px; height: 44px; right: 12px; bottom: 12px; } }



/* 章节锚点 */

.section-anchor {

  opacity: 0;

  margin-left: var(--space-2);

  color: var(--color-text-tertiary);

  text-decoration: none;

  transition: opacity var(--duration-fast) var(--ease-out);

}

h2:hover .section-anchor,

h3:hover .section-anchor { opacity: 1; }



/* 渐进式披露 */

.progressive-disclosure {

  padding: var(--rhythm-normal);

  background: var(--color-surface);

  border-radius: var(--radius-md);

  margin: var(--rhythm-normal) 0;

}

.progressive-disclosure details { margin-top: var(--rhythm-normal); }

.progressive-disclosure summary {

  cursor: pointer;

  font-weight: var(--font-medium);

  color: var(--color-primary-600);

  padding: var(--space-2) 0;

}



/* 减少选项：折叠 */

.collapse-group details { border-bottom: 1px solid var(--color-border); padding: var(--rhythm-normal) 0; }

.collapse-group summary { cursor: pointer; font-weight: var(--font-medium); }