/* ══════════════════════════════════════════════════════════
   🌸 地球Online 状态栏美化 — 樱花粉流光主题 v3.0
   适配: Risu AI 移动端 + 桌面端
   功能: 流光边框 / Q弹点击 / 辉光反馈 / APP图标风格
   ══════════════════════════════════════════════════════════ */

/* ═══ 主题变量 ═══ */
:root {
  --sk-50: #fff5f7;
  --sk-100: #ffe4ec;
  --sk-200: #ffcad7;
  --sk-300: #ffa3ba;
  --sk-400: #ff7096;
  --sk-500: #ff4778;
  --sk-600: #e8306a;
  --sk-glow: rgba(255,145,185,0.55);
  --sk-glow-strong: rgba(255,71,120,0.75);
  --sk-glass: rgba(255,245,248,0.72);
  --sk-glass-border: rgba(255,192,215,0.45);
  --sk-text: #5c2d4a;
  --sk-text-sub: #9a6b84;
  --sk-shadow: 0 4px 24px rgba(255,150,190,0.18), 0 1.5px 6px rgba(255,100,150,0.10);
  --sk-radius: 18px;
  --sk-radius-sm: 12px;
  --sk-transition: cubic-bezier(0.34,1.56,0.64,1);
  --sk-spring: cubic-bezier(0.175,0.885,0.32,1.275);
}

/* ═══ 流光边框动画关键帧 ═══ */
@keyframes sakura-flow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes sakura-glow-pulse {
  0%, 100% { box-shadow: 0 0 8px var(--sk-glow), 0 0 0 transparent, var(--sk-shadow); }
  50% { box-shadow: 0 0 18px var(--sk-glow), 0 0 36px rgba(255,160,200,0.18), var(--sk-shadow); }
}

@keyframes sakura-shimmer {
  0% { opacity: 0.4; transform: translateX(-100%) rotate(25deg); }
  100% { opacity: 0; transform: translateX(200%) rotate(25deg); }
}

@keyframes bounce-in {
  0% { transform: scale(0.6) translateY(12px); opacity: 0; }
  50% { transform: scale(1.06) translateY(-3px); }
  75% { transform: scale(0.97) translateY(1px); }
  100% { transform: scale(1) translateY(0); opacity: 1; }
}

@keyframes icon-pop {
  0% { transform: scale(1); }
  30% { transform: scale(0.88); }
  60% { transform: scale(1.12); }
  80% { transform: scale(0.96); }
  100% { transform: scale(1); }
}

@keyframes petal-float {
  0% { transform: translateY(0) rotate(0deg); opacity: 0.7; }
  50% { transform: translateY(-8px) rotate(15deg); opacity: 1; }
  100% { transform: translateY(0) rotate(0deg); opacity: 0.7; }
}

@keyframes glow-ring {
  0% { box-shadow: 0 0 0 0 rgba(255,140,180,0.5); }
  70% { box-shadow: 0 0 0 10px rgba(255,140,180,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,140,180,0); }
}

@keyframes text-glow {
  0%, 100% { text-shadow: 0 0 4px rgba(255,150,190,0.3); }
  50% { text-shadow: 0 0 12px rgba(255,150,190,0.6), 0 0 24px rgba(255,120,165,0.2); }
}

/* ═══ 代码块 / 状态面板 — 基础样式 ═══ */
pre {
  position: relative;
  background: linear-gradient(
    145deg,
    rgba(255,245,248,0.88) 0%,
    rgba(255,230,240,0.82) 35%,
    rgba(255,220,235,0.78) 65%,
    rgba(255,240,248,0.85) 100%
  ) !important;
  border: 1.8px solid transparent !important;
  border-radius: var(--sk-radius) !important;
  padding: 20px 18px !important;
  margin: 14px 4px !important;
  box-shadow: var(--sk-shadow) !important;
  backdrop-filter: blur(16px) saturate(1.6) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.6) !important;
  overflow: hidden !important;
  transition: all 0.4s var(--sk-spring) !important;
  animation: bounce-in 0.6s var(--sk-spring) both,
             sakura-glow-pulse 4s ease-in-out infinite !important;
}

/* 流光边框 — 伪元素实现 */
pre::before {
  content: '' !important;
  position: absolute !important;
  inset: -2px !important;
  border-radius: calc(var(--sk-radius) + 2px) !important;
  background: linear-gradient(
    90deg,
    var(--sk-200),
    var(--sk-400),
    var(--sk-300),
    #ffb7d5,
    var(--sk-500),
    var(--sk-200),
    var(--sk-400)
  ) !important;
  background-size: 400% 100% !important;
  animation: sakura-flow 6s linear infinite !important;
  z-index: -1 !important;
  opacity: 0.85 !important;
  transition: opacity 0.3s ease !important;
}

/* 扫光效果 */
pre::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: -60% !important;
  width: 40% !important;
  height: 100% !important;
  background: linear-gradient(
    105deg,
    transparent 20%,
    rgba(255,255,255,0.25) 45%,
    rgba(255,220,240,0.35) 50%,
    rgba(255,255,255,0.25) 55%,
    transparent 80%
  ) !important;
  animation: sakura-shimmer 5s ease-in-out infinite !important;
  animation-delay: 1.5s !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* ═══ 代码块交互 — 点击Q弹 + 辉光 ═══ */
pre:hover {
  transform: translateY(-2px) scale(1.008) !important;
  box-shadow:
    0 0 14px var(--sk-glow),
    0 0 32px rgba(255,160,200,0.15),
    0 8px 32px rgba(255,150,190,0.20) !important;
}

pre:active {
  animation: icon-pop 0.5s var(--sk-spring) !important;
  box-shadow:
    0 0 22px var(--sk-glow-strong),
    0 0 44px rgba(255,120,170,0.3),
    0 2px 12px rgba(255,150,190,0.25) !important;
  border-color: var(--sk-400) !important;
  transform: scale(0.97) !important;
  transition: all 0.1s ease !important;
}

/* ═══ 代码块内部文字样式 ═══ */
pre code,
pre .hljs {
  color: var(--sk-text) !important;
  font-family: 'Cascadia Code', 'Fira Code', 'Source Han Sans', 'Noto Sans SC', monospace !important;
  font-size: 12.5px !important;
  line-height: 1.85 !important;
  letter-spacing: 0.02em !important;
  background: transparent !important;
  text-shadow: 0 0.5px 0 rgba(255,255,255,0.5) !important;
}

/* YAML 键名高亮 */
pre code .hljs-attr,
pre .hljs-attr {
  color: var(--sk-600) !important;
  font-weight: 600 !important;
  animation: text-glow 4s ease-in-out infinite !important;
}

/* YAML 字符串值 */
pre code .hljs-string,
pre .hljs-string {
  color: #d4527a !important;
}

/* YAML 数字 */
pre code .hljs-number,
pre .hljs-number {
  color: #e8457a !important;
  font-weight: 700 !important;
}

/* YAML 注释/节标题 */
pre code .hljs-comment,
pre .hljs-comment {
  color: var(--sk-text-sub) !important;
  font-style: italic !important;
  opacity: 0.85 !important;
}

/* YAML 布尔 / 关键词 */
pre code .hljs-literal,
pre .hljs-literal,
pre code .hljs-keyword,
pre .hljs-keyword {
  color: #ff5c8a !important;
  font-weight: 600 !important;
}

/* ═══ 状态面板标题行（含emoji的行）═══ */
pre code .hljs-section,
pre .hljs-section {
  color: var(--sk-500) !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  text-shadow: 0 0 8px rgba(255,71,120,0.25) !important;
}

/* ═══ APP图标风格 — 内联代码块 ═══ */
code:not(pre code) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  background: linear-gradient(
    135deg,
    rgba(255,240,245,0.92),
    rgba(255,222,235,0.88)
  ) !important;
  color: var(--sk-text) !important;
  border: 1.2px solid var(--sk-glass-border) !important;
  border-radius: 9px !important;
  padding: 2.5px 9px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  box-shadow:
    0 1.5px 6px rgba(255,160,200,0.15),
    inset 0 1px 0 rgba(255,255,255,0.6) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  transition: all 0.35s var(--sk-spring) !important;
  cursor: pointer !important;
  position: relative !important;
  overflow: hidden !important;
}

code:not(pre code)::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 9px !important;
  opacity: 0 !important;
  background: radial-gradient(
    circle at center,
    rgba(255,180,210,0.4),
    transparent 70%
  ) !important;
  transition: opacity 0.3s ease !important;
}

code:not(pre code):hover {
  transform: translateY(-1.5px) scale(1.04) !important;
  box-shadow:
    0 0 10px var(--sk-glow),
    0 4px 16px rgba(255,150,190,0.22),
    inset 0 1px 0 rgba(255,255,255,0.7) !important;
  border-color: var(--sk-300) !important;
}

code:not(pre code):hover::after {
  opacity: 1 !important;
}

code:not(pre code):active {
  transform: scale(0.92) !important;
  box-shadow:
    0 0 18px var(--sk-glow-strong),
    0 0 36px rgba(255,120,170,0.2) !important;
  transition: all 0.08s ease !important;
  animation: glow-ring 0.6s ease-out !important;
}

/* ═══ 引用块 — 内心独白风格 ═══ */
blockquote {
  position: relative !important;
  background: linear-gradient(
    135deg,
    rgba(255,242,248,0.75),
    rgba(255,230,242,0.65)
  ) !important;
  border-left: 3.5px solid var(--sk-400) !important;
  border-radius: 0 var(--sk-radius-sm) var(--sk-radius-sm) 0 !important;
  padding: 16px 20px 16px 22px !important;
  margin: 12px 6px !important;
  box-shadow:
    0 2px 14px rgba(255,150,190,0.12),
    inset 0 0 20px rgba(255,220,240,0.3) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  transition: all 0.4s var(--sk-spring) !important;
  animation: bounce-in 0.5s var(--sk-spring) both !important;
  overflow: hidden !important;
}

blockquote::before {
  content: '💭' !important;
  position: absolute !important;
  top: -4px !important;
  right: 10px !important;
  font-size: 22px !important;
  opacity: 0.5 !important;
  animation: petal-float 4s ease-in-out infinite !important;
  pointer-events: none !important;
}

blockquote::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 3.5px !important;
  height: 100% !important;
  background: linear-gradient(
    180deg,
    var(--sk-300),
    var(--sk-500),
    var(--sk-300)
  ) !important;
  background-size: 100% 200% !important;
  animation: sakura-flow 3s linear infinite !important;
  border-radius: 3px 0 0 3px !important;
}

blockquote:hover {
  transform: translateX(3px) !important;
  box-shadow:
    0 0 12px rgba(255,160,200,0.2),
    0 6px 24px rgba(255,150,190,0.15) !important;
  border-left-color: var(--sk-500) !important;
}

blockquote:active {
  transform: scale(0.985) translateX(1px) !important;
  transition: all 0.1s ease !important;
}

blockquote em, blockquote i {
  color: #8b4068 !important;
  font-style: italic !important;
}

/* ═══ Markdown 列表项 — 微型APP卡片风格 ═══ */
li {
  position: relative !important;
  padding: 4px 6px !important;
  margin: 3px 0 !important;
  border-radius: 8px !important;
  transition: all 0.3s var(--sk-spring) !important;
}

li:hover {
  background: rgba(255,230,242,0.4) !important;
  transform: translateX(4px) !important;
}

li:active {
  transform: translateX(2px) scale(0.98) !important;
  background: rgba(255,210,230,0.5) !important;
}

/* 列表标记美化 */
li::marker {
  color: var(--sk-400) !important;
  font-weight: bold !important;
}

/* ═══ 加粗文字 — 辉光强调 ═══ */
strong, b {
  color: var(--sk-600) !important;
  text-shadow: 0 0 6px rgba(255,150,190,0.25) !important;
  transition: text-shadow 0.3s ease !important;
}

strong:hover, b:hover {
  text-shadow: 0 0 14px rgba(255,130,175,0.45), 0 0 28px rgba(255,100,155,0.15) !important;
}

/* ═══ 斜体文字 ═══ */
em, i {
  color: #a04870 !important;
}

/* ═══ 分割线 — 樱花渐变 ═══ */
hr {
  border: none !important;
  height: 2px !important;
  background: linear-gradient(
    90deg,
    transparent,
    var(--sk-200),
    var(--sk-400),
    var(--sk-200),
    transparent
  ) !important;
  background-size: 200% 100% !important;
  animation: sakura-flow 4s linear infinite !important;
  margin: 20px 12px !important;
  border-radius: 2px !important;
  opacity: 0.7 !important;
}

/* ═══ 可选行动区块（Markdown编号列表在代码块外）═══ */
ol {
  counter-reset: sakura-counter !important;
}

ol > li {
  position: relative !important;
  background: linear-gradient(
    135deg,
    rgba(255,245,250,0.6),
    rgba(255,232,242,0.45)
  ) !important;
  border: 1px solid rgba(255,200,220,0.3) !important;
  border-radius: 12px !important;
  padding: 10px 14px 10px 16px !important;
  margin: 8px 4px !important;
  box-shadow: 0 2px 8px rgba(255,160,200,0.08) !important;
  transition: all 0.35s var(--sk-spring) !important;
  overflow: hidden !important;
}

ol > li::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 12px !important;
  background: radial-gradient(
    ellipse at 30% 50%,
    rgba(255,200,225,0.15),
    transparent 70%
  ) !important;
  pointer-events: none !important;
}

ol > li:hover {
  transform: translateY(-2px) translateX(3px) scale(1.01) !important;
  box-shadow:
    0 0 10px rgba(255,160,200,0.2),
    0 6px 20px rgba(255,150,190,0.12) !important;
  border-color: var(--sk-300) !important;
  background: linear-gradient(
    135deg,
    rgba(255,240,248,0.8),
    rgba(255,225,238,0.65)
  ) !important;
}

ol > li:active {
  transform: scale(0.97) !important;
  box-shadow:
    0 0 16px var(--sk-glow),
    0 0 32px rgba(255,140,185,0.12) !important;
  animation: glow-ring 0.5s ease-out !important;
  transition: all 0.08s ease !important;
}

/* ═══ 表格样式（如有）═══ */
table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border-radius: var(--sk-radius-sm) !important;
  overflow: hidden !important;
  box-shadow: var(--sk-shadow) !important;
  margin: 12px 4px !important;
  width: 100% !important;
}

th {
  background: linear-gradient(135deg, var(--sk-200), var(--sk-300)) !important;
  color: var(--sk-text) !important;
  font-weight: 700 !important;
  padding: 10px 14px !important;
  font-size: 12.5px !important;
  text-shadow: 0 0.5px 0 rgba(255,255,255,0.5) !important;
}

td {
  background: rgba(255,248,252,0.7) !important;
  color: var(--sk-text) !important;
  padding: 8px 14px !important;
  font-size: 12px !important;
  border-bottom: 1px solid rgba(255,210,228,0.3) !important;
  transition: background 0.2s ease !important;
}

tr:hover td {
  background: rgba(255,235,245,0.85) !important;
}

/* ═══ 滚动条美化 ═══ */
pre::-webkit-scrollbar {
  width: 5px !important;
  height: 5px !important;
}

pre::-webkit-scrollbar-track {
  background: rgba(255,230,242,0.3) !important;
  border-radius: 10px !important;
}

pre::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--sk-300), var(--sk-400)) !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255,255,255,0.3) !important;
}

pre::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, var(--sk-400), var(--sk-500)) !important;
}

/* ═══ 文字选中效果 ═══ */
::selection {
  background: rgba(255,160,200,0.35) !important;
  color: var(--sk-text) !important;
}

::-moz-selection {
  background: rgba(255,160,200,0.35) !important;
  color: var(--sk-text) !important;
}

/* ═══ 标题（h1-h6）— 装饰 ═══ */
h1, h2, h3, h4, h5, h6 {
  position: relative !important;
  color: var(--sk-text) !important;
  transition: all 0.3s ease !important;
}

h1::after, h2::after, h3::after {
  content: '🌸' !important;
  margin-left: 6px !important;
  font-size: 0.7em !important;
  opacity: 0.6 !important;
  animation: petal-float 3.5s ease-in-out infinite !important;
  display: inline-block !important;
}

/* ═══ 链接样式 ═══ */
a {
  color: var(--sk-500) !important;
  text-decoration: none !important;
  border-bottom: 1.5px dashed var(--sk-300) !important;
  transition: all 0.3s ease !important;
  position: relative !important;
}

a:hover {
  color: var(--sk-600) !important;
  border-bottom-color: var(--sk-500) !important;
  text-shadow: 0 0 8px rgba(255,140,180,0.3) !important;
}

a:active {
  transform: scale(0.96) !important;
}

/* ══════════════════════════════════════════
   📱 Risu AI 移动端适配
   ══════════════════════════════════════════ */

@media screen and (max-width: 768px) {
  pre {
    border-radius: 14px !important;
    padding: 16px 13px !important;
    margin: 10px 2px !important;
    font-size: 11px !important;
  }

  pre code,
  pre .hljs {
    font-size: 11px !important;
    line-height: 1.75 !important;
    word-break: break-all !important;
    white-space: pre-wrap !important;
    overflow-wrap: break-word !important;
  }

  pre::before {
    inset: -1.5px !important;
  }

  code:not(pre code) {
    font-size: 11px !important;
    padding: 2px 7px !important;
    border-radius: 7px !important;
  }

  blockquote {
    padding: 12px 14px 12px 18px !important;
    margin: 10px 3px !important;
    border-radius: 0 10px 10px 0 !important;
  }

  blockquote::before {
    font-size: 18px !important;
    top: -2px !important;
    right: 6px !important;
  }

  ol > li {
    padding: 8px 11px 8px 13px !important;
    margin: 6px 2px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
  }

  h1::after, h2::after, h3::after {
    font-size: 0.6em !important;
  }

  hr {
    margin: 14px 8px !important;
  }

  table {
    font-size: 11px !important;
  }

  th {
    padding: 7px 10px !important;
    font-size: 11.5px !important;
  }

  td {
    padding: 6px 10px !important;
    font-size: 11px !important;
  }
}

/* ═══ 超小屏幕（≤420px）进一步优化 ═══ */
@media screen and (max-width: 420px) {
  pre {
    border-radius: 12px !important;
    padding: 13px 10px !important;
    margin: 8px 1px !important;
  }

  pre code,
  pre .hljs {
    font-size: 10.5px !important;
    line-height: 1.7 !important;
  }

  blockquote {
    padding: 10px 12px 10px 16px !important;
    margin: 8px 2px !important;
  }

  ol > li {
    padding: 7px 9px !important;
    margin: 5px 1px !important;
    font-size: 12.5px !important;
  }

  code:not(pre code) {
    font-size: 10.5px !important;
    padding: 1.5px 6px !important;
  }
}

/* ═══ 横屏模式优化 ═══ */
@media screen and (orientation: landscape) and (max-height: 500px) {
  pre {
    padding: 14px 16px !important;
    margin: 8px 4px !important;
  }

  blockquote {
    padding: 10px 16px !important;
    margin: 8px 4px !important;
  }
}

/* ═══ 触摸设备优化 — 禁用hover延迟 ═══ */
@media (hover: none) and (pointer: coarse) {
  pre:hover {
    transform: none !important;
  }

  pre:active {
    transform: scale(0.975) !important;
    box-shadow:
      0 0 20px var(--sk-glow-strong),
      0 0 40px rgba(255,120,170,0.25) !important;
    transition: all 0.06s ease !important;
  }

  code:not(pre code):hover {
    transform: none !important;
  }

  code:not(pre code):active {
    transform: scale(0.9) !important;
    box-shadow: 0 0 16px var(--sk-glow-strong) !important;
    animation: glow-ring 0.4s ease-out !important;
    transition: all 0.06s ease !important;
  }

  ol > li:hover {
    transform: none !important;
  }

  ol > li:active {
    transform: scale(0.97) !important;
    background: rgba(255,220,238,0.6) !important;
    box-shadow: 0 0 14px var(--sk-glow) !important;
    transition: all 0.06s ease !important;
  }

  blockquote:hover {
    transform: none !important;
  }

  blockquote:active {
    transform: scale(0.985) !important;
    transition: all 0.06s ease !important;
  }

  li:hover {
    transform: none !important;
    background: transparent !important;
  }

  li:active {
    background: rgba(255,230,242,0.5) !important;
    transform: scale(0.98) !important;
  }
}

/* ═══ 暗色模式兼容（如果平台支持）═══ */
@media (prefers-color-scheme: dark) {
  :root {
    --sk-text: #f5d5e5;
    --sk-text-sub: #d4a5c0;
    --sk-glass: rgba(60,20,40,0.72);
    --sk-glass-border: rgba(180,80,120,0.35);
    --sk-shadow: 0 4px 24px rgba(120,40,70,0.25), 0 1.5px 6px rgba(100,30,60,0.15);
  }

  pre {
    background: linear-gradient(
      145deg,
      rgba(55,18,38,0.92) 0%,
      rgba(70,22,48,0.88) 35%,
      rgba(60,20,42,0.85) 65%,
      rgba(50,16,35,0.90) 100%
    ) !important;
  }

  pre code .hljs-attr,
  pre .hljs-attr {
    color: #ffb0cc !important;
  }

  pre code .hljs-string,
  pre .hljs-string {
    color: #ff8aaf !important;
  }

  pre code .hljs-number,
  pre .hljs-number {
    color: #ff7da5 !important;
  }

  pre code .hljs-comment,
  pre .hljs-comment {
    color: #c89ab2 !important;
  }

  pre code,
  pre .hljs {
    color: #f0d0e2 !important;
    text-shadow: 0 0.5px 0 rgba(0,0,0,0.3) !important;
  }

  blockquote {
    background: linear-gradient(
      135deg,
      rgba(60,20,40,0.7),
      rgba(50,15,35,0.6)
    ) !important;
  }

  blockquote em, blockquote i {
    color: #f0b0d0 !important;
  }

  code:not(pre code) {
    background: linear-gradient(
      135deg,
      rgba(70,25,48,0.85),
      rgba(55,18,38,0.8)
    ) !important;
    color: #f5d0e5 !important;
    border-color: rgba(160,70,110,0.35) !important;
  }

  ol > li {
    background: linear-gradient(
      135deg,
      rgba(55,18,38,0.5),
      rgba(45,14,32,0.35)
    ) !important;
    border-color: rgba(150,60,100,0.25) !important;
  }

  ol > li:hover {
    background: linear-gradient(
      135deg,
      rgba(70,25,48,0.65),
      rgba(55,18,38,0.5)
    ) !important;
  }

  td {
    background: rgba(50,16,35,0.6) !important;
    color: #f0d0e2 !important;
    border-bottom-color: rgba(140,55,95,0.25) !important;
  }

  tr:hover td {
    background: rgba(65,22,44,0.75) !important;
  }

  th {
    background: linear-gradient(135deg, rgba(100,35,65,0.8), rgba(120,42,78,0.8)) !important;
    color: #ffd5ea !important;
  }

  strong, b {
    color: #ffb5d5 !important;
  }

  em, i {
    color: #e8a0c5 !important;
  }

  hr {
    background: linear-gradient(
      90deg,
      transparent,
      rgba(180,70,120,0.4),
      rgba(220,90,150,0.6),
      rgba(180,70,120,0.4),
      transparent
    ) !important;
  }

  ::selection {
    background: rgba(200,80,130,0.4) !important;
    color: #fff !important;
  }
}

/* ═══ 减弱动画偏好（无障碍）═══ */
@media (prefers-reduced-motion: reduce) {
  pre,
  pre::before,
  pre::after,
  blockquote,
  blockquote::before,
  code:not(pre code),
  ol > li,
  li,
  hr,
  h1::after, h2::after, h3::after,
  pre code .hljs-attr, pre .hljs-attr,
  strong, b {
    animation: none !important;
    transition-duration: 0.01s !important;
  }
}