/*
 * Vue Night
 * A restrained Vue-inspired dark layer for Icarus. Kept outside node_modules so
 * the theme can still be upgraded without carrying local edits.
 */
:root {
  --qd-bg: #101820;
  --qd-bg-soft: #16222d;
  --qd-surface: #1d2a36;
  --qd-surface-raised: #243545;
  --qd-border: rgba(66, 184, 131, 0.14);
  --qd-border-strong: rgba(66, 184, 131, 0.24);
  --qd-text: #edf7f2;
  --qd-text-soft: #cfddd7;
  --qd-muted: #9caeaa;
  --qd-accent: #42b883;
  --qd-accent-strong: #6ee7ae;
  --qd-accent-warm: #7dd3fc;
  --qd-shadow: 0 18px 45px rgba(4, 13, 22, 0.34);
}

html {
  background: var(--qd-bg);
}

body {
  color: var(--qd-text);
  background:
    radial-gradient(circle at 18% 0%, rgba(66, 184, 131, 0.13), transparent 34rem),
    radial-gradient(circle at 88% 10%, rgba(53, 73, 94, 0.3), transparent 28rem),
    linear-gradient(180deg, #111d27 0%, var(--qd-bg) 22rem);
}

body,
button,
input,
select,
textarea {
  color: var(--qd-text);
}

a,
.link-muted,
.content a {
  color: var(--qd-accent);
}

a:hover,
.link-muted:hover,
.content a:hover {
  color: var(--qd-accent-strong);
}

.navbar-main {
  background: rgba(16, 24, 32, 0.92);
  border-bottom: 1px solid var(--qd-border);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(14px);
}

.navbar-main .navbar-brand,
.navbar-main .navbar-menu,
.navbar-main .navbar-start,
.navbar-main .navbar-end {
  background: transparent;
}

.navbar-main .navbar-menu {
  background: rgba(16, 24, 32, 0.96);
}

.navbar-main .navbar-item,
.navbar-main .navbar-link {
  color: var(--qd-text-soft);
}

.navbar-main .navbar-item:hover,
.navbar-main .navbar-link:hover,
.navbar-main .navbar-item.is-active {
  color: var(--qd-text);
  background: transparent;
}

.navbar-main .navbar-item.is-active {
  box-shadow: inset 0 -2px 0 var(--qd-accent);
}

.section {
  background: transparent;
}

.card,
.widget,
.searchbox .searchbox-container,
.modal-card,
.navbar-dropdown {
  color: var(--qd-text);
  background: color-mix(in srgb, var(--qd-surface) 92%, transparent);
  border: 1px solid var(--qd-border);
  box-shadow: var(--qd-shadow);
}

.card {
  border-radius: 10px;
}

.card-content {
  color: var(--qd-text);
}

.title,
.subtitle,
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6,
.menu-label {
  color: var(--qd-text);
}

.article-meta,
.article-meta a,
.date,
.heading,
.menu-list a,
.content,
.content p,
.content li,
.footer,
.footer a {
  color: var(--qd-text-soft);
}

.article-meta {
  border-bottom-color: var(--qd-border);
  overflow-x: visible !important;
}

.article-meta.level.is-mobile {
  align-items: flex-start;
  max-width: 100%;
}

.article-meta .level-left {
  min-width: 0;
  max-width: 100%;
  flex-shrink: 1;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
}

.article-meta .level-item {
  min-width: 0;
  margin-right: 0;
  white-space: normal;
}

@media (max-width: 768px) {
  .article-meta.level.is-mobile,
  .article-meta .level-left {
    display: block;
  }

  .article-meta .level-item {
    display: inline;
    margin-right: 0.75rem;
    line-height: 1.8;
  }
}

.article .content strong,
.content strong {
  color: var(--qd-text);
}

.content blockquote {
  color: var(--qd-text-soft);
  background: rgba(142, 201, 189, 0.07);
  border-left-color: var(--qd-accent);
}

.content hr {
  background-color: var(--qd-border);
}

.menu-list a {
  border-radius: 8px;
}

.menu-list a:hover {
  color: var(--qd-text);
  background: rgba(142, 201, 189, 0.1);
}

.tag:not(body) {
  color: var(--qd-text);
  background: rgba(142, 201, 189, 0.14);
  border: 1px solid rgba(142, 201, 189, 0.18);
}

.tags.has-addons .tag:first-child {
  background: rgba(142, 201, 189, 0.18);
}

.tags.has-addons .tag:last-child {
  color: #151716;
  background: var(--qd-accent);
}

.button.is-primary,
.button.is-primary:focus,
.button.is-primary:hover {
  color: #151716;
  background: var(--qd-accent);
  border-color: var(--qd-accent);
}

.button.is-transparent {
  color: var(--qd-text-soft);
}

.button.is-transparent:hover,
.button.is-transparent:focus {
  color: var(--qd-accent);
  background: rgba(142, 201, 189, 0.1);
}

.input,
.textarea {
  color: var(--qd-text);
  background: var(--qd-bg-soft);
  border-color: var(--qd-border-strong);
}

.input::placeholder,
.textarea::placeholder {
  color: var(--qd-muted);
}

.input:focus,
.textarea:focus {
  border-color: var(--qd-accent);
  box-shadow: 0 0 0 0.125em rgba(142, 201, 189, 0.18);
}

.content code,
code {
  color: #f1d7a1;
  background: rgba(208, 173, 114, 0.12);
}

pre,
.highlight,
.hljs {
  background: #141513 !important;
  border-color: var(--qd-border);
}

.highlight table,
.highlight tr,
.highlight td {
  background: transparent !important;
}

.footer {
  background: var(--qd-bg-soft);
  border-top: 1px solid var(--qd-border);
}

.navbar-logo img,
.footer-logo img {
  width: auto;
  height: 34px;
  filter: none;
  opacity: 1;
}

.avatar {
  filter: none;
  /* background: var(--qd-bg-soft);
  border: 1px solid var(--qd-border-strong); */
}

.level-item .title,
.widget .title {
  color: var(--qd-text);
}

.column-right-shadow {
  background: linear-gradient(90deg, rgba(23, 23, 22, 0), rgba(23, 23, 22, 0.88));
}

::selection {
  color: #151716;
  background: var(--qd-accent);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---------------------------------
 *   CJK typography · 中文排版优化
 *   1) 补全中文字体栈：Noto Sans SC (webfont) → PingFang (mac/iOS)
 *      → 雅黑 (Windows) → 思源/Noto (Linux/Android)，告别系统兜底
 *   2) 正文/标题行高从 Bulma 默认 ~1.6 抬到 1.85，中英混排不挤
 *   3) 代码补 CJK 等宽回退，中文注释不致错位
 * --------------------------------- */
:root {
  --qd-font-base: Ubuntu, Roboto, 'Open Sans', 'Noto Sans SC',
    'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
    'Source Han Sans SC', 'Noto Sans CJK SC', system-ui, sans-serif;
  --qd-font-code: 'Source Code Pro', 'JetBrains Mono',
    'Noto Sans Mono CJK SC', Consolas, 'Microsoft YaHei', monospace;
}

body,
button,
input,
select,
textarea,
.navbar-item,
.menu-list a,
.card-content,
.article-meta,
.footer,
.title,
.subtitle,
.menu-label {
  font-family: var(--qd-font-base);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.article .content {
  font-family: var(--qd-font-base);
  font-size: 1.1rem;
  line-height: 1.85;
  word-break: break-word;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.article .content p,
.article .content li,
.article .content dd,
.article .content dt {
  line-height: 1.85;
}

.article .content blockquote {
  line-height: 1.8;
}

.article .content h1,
.article .content h2,
.article .content h3,
.article .content h4,
.article .content h5,
.article .content h6 {
  font-family: var(--qd-font-base);
  line-height: 1.4;
}

.article .content h1,
.article > .title {
  color: var(--qd-accent-strong) !important;
  text-shadow: 0 0 30px rgba(110, 231, 174, 0.35);
}

.article .content h2 {
  color: var(--qd-accent-strong) !important;
  text-shadow: 0 0 24px rgba(110, 231, 174, 0.25);
}

.article .content h3 {
  color: var(--qd-accent) !important;
}

.content code,
.content pre,
.highlight,
.hljs {
  font-family: var(--qd-font-code);
}

@media (min-width: 769px) {
  .article .content,
  .article .content p,
  .article .content li {
    line-height: 1.9;
  }
}