/* Source: mobile-navigation.css */
/* Mobile header and navigation, aligned with the legacy Modown interaction. */
.mobile-navigation-backdrop {
  display: none;
}

.mobile-color-mode {
  display: none;
}

.primary-navigation .dafa-nav-icon {
  display: none;
}

@media (width < 1024px) {
  html.dafa-mobile-nav-open,
  body.dafa-mobile-nav-open {
    overflow: hidden;
    overscroll-behavior: none;
  }

  .site-header {
    z-index: 50;
    background: var(--dafa-surface);
    backdrop-filter: none;
  }

  .site-topbar {
    display: none;
  }

  .header-row {
    position: relative;
    min-height: 64px;
    grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1fr);
    gap: 0;
  }

  .site-branding {
    z-index: 2;
    min-width: 0;
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
  }

  .dafa-brand-svg__copy {
    display: none;
  }

  .dafa-brand-svg__svg {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
  }

  .menu-toggle {
    z-index: 63;
    display: inline-grid;
    width: 40px;
    height: 40px;
    grid-column: 1;
    grid-row: 1;
    place-items: center;
    justify-self: start;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--dafa-text);
    cursor: pointer;
  }

  .menu-toggle:hover,
  .menu-toggle:focus-visible,
  .menu-toggle[aria-expanded="true"] {
    background: var(--dafa-surface-muted);
  }

  .menu-toggle > span {
    position: relative;
    display: block;
    width: 22px;
    height: 16px;
    background: linear-gradient(currentColor, currentColor) center / 22px 2px no-repeat;
    font-size: 0;
  }

  .menu-toggle > span::before,
  .menu-toggle > span::after {
    position: absolute;
    left: 0;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    content: "";
    transition: top 0.2s ease, bottom 0.2s ease, transform 0.2s ease;
  }

  .menu-toggle > span::before {
    top: 0;
  }

  .menu-toggle > span::after {
    bottom: 0;
  }

  .menu-toggle[aria-expanded="true"] > span {
    background-size: 0 2px;
  }

  .menu-toggle[aria-expanded="true"] > span::before {
    top: 7px;
    transform: rotate(45deg);
  }

  .menu-toggle[aria-expanded="true"] > span::after {
    bottom: 7px;
    transform: rotate(-45deg);
  }

  .header-actions {
    position: relative;
    z-index: 3;
    display: flex;
    height: 64px;
    min-width: 0;
    grid-column: 1 / -1;
    grid-row: 1;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(18px, 4vw, 28px);
    pointer-events: none;
  }

  .header-actions > .header-search,
  .header-actions > .header-ai,
  .header-actions > .header-notice,
  .header-actions > .header-user,
  .header-actions > .header-login-link {
    pointer-events: auto;
  }

  .header-actions > .header-search {
    position: absolute;
    top: 10px;
    left: 42px;
  }

  .header-actions > .header-ai {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    padding: 0 2px;
    color: var(--dafa-accent-strong);
    font-size: 13px;
    cursor: pointer;
  }

  .header-actions > .header-vip {
    display: none;
  }

  .header-actions > .header-notice {
    margin: 0;
  }

  .header-actions > .header-user,
  .header-actions > .header-login-link {
    flex: 0 0 auto;
  }

  .header-actions .header-icon-btn {
    width: 36px;
    height: 36px;
  }

  .header-actions .header-search__toggle {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
  }

  .header-actions .header-user__avatar {
    width: 36px;
    height: 36px;
  }

  .header-actions .header-login-link {
    display: inline-flex;
    min-width: 36px;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border-radius: 999px;
    font-size: 13px;
  }

  .primary-navigation {
    position: fixed;
    z-index: 61;
    top: 0;
    right: auto;
    bottom: 0;
    left: 0;
    display: block;
    visibility: hidden;
    width: min(86vw, 320px);
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 12px max(20px, env(safe-area-inset-bottom, 0px));
    border: 0;
    border-right: 1px solid var(--dafa-border);
    border-radius: 0;
    background: var(--dafa-surface);
    background: color-mix(in srgb, var(--dafa-surface) 88%, var(--dafa-bg));
    box-shadow: 12px 0 36px rgb(23 26 33 / 0.16);
    opacity: 0;
    transform: translateX(-102%);
    transition: transform 0.22s ease, opacity 0.18s ease, visibility 0.22s;
    pointer-events: none;
  }

  .primary-navigation.is-open {
    visibility: visible;
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
  }

  .dafa-mobile-nav-open .site-branding,
  .dafa-mobile-nav-open .header-actions > * {
    visibility: hidden;
    pointer-events: none;
  }

  .dafa-mobile-nav-open .menu-toggle {
    position: fixed;
    top: calc(10px + env(safe-area-inset-top, 0px));
    left: min(calc(min(86vw, 320px) + 10px), calc(100vw - 50px));
    visibility: visible;
    border: 1px solid var(--dafa-border);
    background: var(--dafa-surface);
    box-shadow: 0 10px 28px rgb(18 22 28 / 0.2);
    pointer-events: auto;
  }

  .primary-navigation > ul {
    display: block;
    margin: 0;
    padding: 0;
    white-space: normal;
  }

  .mobile-color-mode {
    display: block;
    margin-top: 2px;
    padding: 10px 14px 14px;
    border: 1px solid var(--dafa-border);
    border-radius: 14px;
    background: var(--dafa-surface);
  }

  .mobile-color-mode__label {
    display: block;
    margin: 0 0 9px;
    color: var(--dafa-text-soft);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.4;
  }

  .mobile-color-mode__options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3px;
    padding: 3px;
    border: 1px solid var(--dafa-border);
    border-radius: 11px;
    background: var(--dafa-surface-muted);
  }

  .mobile-color-mode__option {
    appearance: none;
    display: inline-flex;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 7px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--dafa-text-soft);
    font: inherit;
    font-size: 12px;
    font-weight: 560;
    line-height: 1;
    cursor: pointer;
    transition: color 0.16s ease, border-color 0.16s ease, background-color 0.16s ease, transform 0.16s ease;
  }

  .mobile-color-mode__option svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .mobile-color-mode__option span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-color-mode__option:hover,
  .mobile-color-mode__option:focus-visible {
    background: color-mix(in srgb, var(--dafa-accent) 8%, transparent);
    color: var(--dafa-accent-strong);
  }

  .mobile-color-mode__option:focus-visible {
    outline: 2px solid var(--dafa-accent);
    outline-offset: -2px;
  }

  .mobile-color-mode__option:active {
    transform: scale(0.96);
  }

  .mobile-color-mode__option[aria-checked="true"] {
    border-color: color-mix(in srgb, var(--dafa-accent) 26%, var(--dafa-border));
    background: var(--dafa-accent-soft);
    color: var(--dafa-accent-strong);
    font-weight: 680;
  }

  .primary-navigation > ul > li {
    position: relative;
    margin: 0 0 10px;
    padding: 0 14px;
    border: 1px solid var(--dafa-border);
    border-radius: 14px;
    background: var(--dafa-surface);
    transition: border-color 0.18s ease, background-color 0.18s ease;
  }

  .primary-navigation > ul > li:hover,
  .primary-navigation > ul > li:focus-within,
  .primary-navigation > ul > .current-menu-item,
  .primary-navigation > ul > .current-menu-ancestor {
    border-color: color-mix(in srgb, var(--dafa-accent) 30%, var(--dafa-border));
  }

  .primary-navigation > ul > li > a {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 12px 46px 12px 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.35;
  }

  .primary-navigation .dafa-nav-icon {
    display: inline-grid;
    width: 20px;
    min-width: 20px;
    height: 20px;
    place-items: center;
    color: var(--dafa-muted);
    font-size: 19px;
    line-height: 1;
    transition: color 0.18s ease;
  }

  .primary-navigation > ul > li:hover > a .dafa-nav-icon,
  .primary-navigation > ul > li:focus-within > a .dafa-nav-icon,
  .primary-navigation > ul > .current-menu-item > a .dafa-nav-icon,
  .primary-navigation > ul > .current-menu-ancestor > a .dafa-nav-icon {
    color: var(--dafa-accent-strong);
  }

  .primary-navigation .dafa-nav-label {
    position: relative;
    display: inline-block;
    min-width: 0;
    line-height: 1.35;
  }

  .primary-navigation .dafa-nav-badge {
    top: -12px;
    right: -18px;
    min-height: 14px;
    margin: 0;
    padding: 2px 4px 1px;
    font-size: 9px;
    letter-spacing: 0.02em;
  }

  .primary-navigation .submenu-toggle {
    position: absolute;
    top: 1px;
    right: 1px;
    display: inline-grid;
    width: 44px;
    min-width: 44px;
    height: 54px;
    min-height: 54px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--dafa-muted);
    font-size: 0;
    cursor: pointer;
  }

  .primary-navigation .submenu-toggle::before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    border-right: 1.75px solid currentColor;
    border-bottom: 1.75px solid currentColor;
    content: "";
    transform: translate(-50%, calc(-50% - 2px)) rotate(45deg);
    transition: transform 0.18s ease;
  }

  .primary-navigation .submenu-toggle[aria-expanded="true"] {
    color: var(--dafa-accent);
  }

  .primary-navigation .submenu-toggle[aria-expanded="true"]::before {
    transform: translate(-50%, calc(-50% + 3px)) rotate(225deg);
  }

  .primary-navigation .submenu-toggle:hover,
  .primary-navigation .submenu-toggle:focus-visible {
    background: var(--dafa-surface-muted);
    color: var(--dafa-accent);
  }

  .primary-navigation .submenu-toggle:focus-visible {
    outline: 2px solid var(--dafa-accent);
    outline-offset: -2px;
  }

  .primary-navigation .submenu-toggle:active {
    transform: scale(0.97);
  }

  .primary-navigation .menu-item-has-children > .sub-menu,
  .primary-navigation .menu-item-has-children:hover > .sub-menu,
  .primary-navigation .menu-item-has-children:focus-within > .sub-menu {
    display: none;
  }

  .primary-navigation .menu-item-has-children.is-submenu-open > .sub-menu {
    display: block;
  }

  .primary-navigation .sub-menu {
    margin: 0 0 10px;
    padding: 0 0 6px 8px;
  }

  .primary-navigation .sub-menu li {
    position: relative;
  }

  .primary-navigation .sub-menu a {
    display: block;
    min-height: 40px;
    padding: 9px 38px 9px 10px;
    border-radius: 8px;
    color: var(--dafa-text);
    font-size: 14px;
    line-height: 1.5;
  }

  .primary-navigation .sub-menu a:hover,
  .primary-navigation .sub-menu a:focus-visible {
    background: var(--dafa-surface-muted);
    color: var(--dafa-accent);
  }

  .mobile-navigation-backdrop {
    position: fixed;
    z-index: 45;
    inset: 0;
    display: block;
    visibility: hidden;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgb(18 22 28 / 0.46);
    opacity: 0;
    transition: opacity 0.2s ease, visibility 0.2s;
    pointer-events: none;
  }

  .mobile-navigation-backdrop.is-visible {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }

  .header-search__panel,
  .header-notice__panel,
  .header-user__panel {
    position: fixed;
    z-index: 70;
    top: 72px;
    right: 14px;
    left: 14px;
    width: auto;
    min-width: 0;
    max-height: calc(100dvh - 88px);
    overflow-y: auto;
  }

  .header-search__panel {
    min-width: 0;
    padding: 16px;
  }

  .header-search__panel .scope-search {
    grid-template-columns: 86px minmax(0, 1fr) 48px;
  }

  .header-search__panel .scope-search__select {
    padding-inline: 12px 8px;
    font-size: 13px;
  }

  .header-search__panel .scope-search__field {
    padding-inline: 12px;
    font-size: 16px;
  }

  .header-search__panel .scope-search__submit {
    grid-column: auto;
    min-width: 48px;
    padding: 0;
    border-top: 0;
  }

  .header-search__heading {
    margin-bottom: 12px;
  }

  .header-search__close {
    min-width: 44px;
    min-height: 44px;
    margin-top: -10px;
  }

  .header-search__hint span {
    display: none;
  }

  .header-user__panel {
    width: auto;
  }

  body.admin-bar .primary-navigation {
    top: 32px;
  }

  body.admin-bar .header-search__panel,
  body.admin-bar .header-notice__panel,
  body.admin-bar .header-user__panel {
    top: 104px;
  }
}

@media (max-width: 782px) {
  body.admin-bar .primary-navigation {
    top: 46px;
  }

  body.admin-bar .header-search__panel,
  body.admin-bar .header-notice__panel,
  body.admin-bar .header-user__panel {
    top: 118px;
  }
}

@media (max-width: 479px) {
  .primary-navigation {
    width: min(92vw, 320px);
  }

  .dafa-mobile-nav-open .menu-toggle {
    left: min(calc(min(92vw, 320px) + 10px), calc(100vw - 50px));
  }

  .header-actions {
    gap: 4px;
  }
}

@media (max-width: 359px) {
  .header-row {
    width: min(calc(100% - 20px), var(--dafa-container));
  }

  .header-actions > .header-search {
    left: 38px;
  }

  .header-search__panel {
    right: 10px;
    left: 10px;
    padding-inline: 12px;
  }

  .header-search__panel .scope-search {
    grid-template-columns: 78px minmax(0, 1fr) 48px;
  }

  .header-search__panel .scope-search__select,
  .header-search__panel .scope-search__field {
    padding-inline: 10px;
  }

  .header-actions > .header-notice {
    margin-right: 0;
  }

  .header-actions > .header-ai {
    padding-inline: 0;
    font-size: 12px;
  }

  .header-actions .dafa-ai-icon {
    width: 14px;
    height: 14px;
    margin-right: 3px;
  }

  .header-actions .header-icon-btn,
  .header-actions .header-user__avatar,
  .header-actions .header-login-link {
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
  }

  .header-actions .header-search__toggle {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .primary-navigation,
  .mobile-navigation-backdrop,
  .menu-toggle > span::before,
  .menu-toggle > span::after,
  .primary-navigation .submenu-toggle::before,
  .primary-navigation > ul > li,
  .primary-navigation .dafa-nav-icon {
    transition: none;
  }

  .mobile-color-mode__option {
    transition: none;
  }
}

/* Source: polish.css */
/**
 * Dafa Theme — visual polish layer (additive only).
 *
 * Loaded last (after site.css / sidebar-v3.css / mobile-navigation.css).
 * Contains no layout changes: every rule refines texture, motion or state
 * styling on top of the existing design system. All colors derive from the
 * --dafa-* custom properties (via color-mix where a tint is needed), so both
 * day and night modes adapt automatically; motion rules are wrapped in
 * `@media (prefers-reduced-motion: no-preference)`.
 *
 * @package DafaTheme
 */

/* -------------------------------------------------------------------------
 * 1. Hero — layered brand gradients.
 * Two soft radial glows sit behind the hero copy (and behind the backdrop
 * imagery in the banner layout), adding depth without touching the layout.
 * The accent variable is brighter at night, so both modes stay balanced.
 * ------------------------------------------------------------------------- */
.home-hero {
  background:
    radial-gradient(58% 88% at 86% 8%, color-mix(in srgb, var(--dafa-accent) 9%, transparent) 0%, transparent 62%),
    radial-gradient(44% 70% at 6% 96%, color-mix(in srgb, var(--dafa-accent) 6%, transparent) 0%, transparent 66%),
    var(--dafa-surface);
}

/* -------------------------------------------------------------------------
 * 2. Hero — typography rhythm.
 * ------------------------------------------------------------------------- */
.home-hero__title {
  letter-spacing: -0.032em;
  line-height: 1.06;
}

.home-hero__description {
  line-height: 1.65;
}

/* -------------------------------------------------------------------------
 * 3. Hero — neutral submit feedback without colored elevation.
 * ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .home-hero-ai__submit,
  .home-hero .scope-search__submit {
    transition:
      transform 180ms cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 180ms cubic-bezier(0.22, 1, 0.36, 1),
      background-color 180ms ease;
  }

  .home-hero-ai__submit:hover,
  .home-hero .scope-search__submit:hover {
    transform: none;
    box-shadow: none;
  }

  .home-hero-ai__submit:active,
  .home-hero .scope-search__submit:active {
    transform: translateY(0);
    box-shadow: none;
  }

  .home-hero__quick-link {
    transition: color 180ms ease;
  }
}

.home-hero__quick-link:hover {
  color: var(--dafa-accent-strong);
}

.home-hero--banner.home-hero--overlay-dark .home-hero__quick-link:hover {
  color: #fff;
}

/* -------------------------------------------------------------------------
 * 4. Cards — unified hover lift, thumbnail zoom and title feedback.
 * One shared easing curve keeps every card motion consistent.
 * ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .entry-card {
    transition:
      transform 220ms cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 220ms cubic-bezier(0.22, 1, 0.36, 1),
      border-color 220ms ease;
  }

  .entry-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--dafa-shadow);
    border-color: color-mix(in srgb, var(--dafa-accent) 30%, var(--dafa-border));
  }

  .entry-card__media img {
    transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .entry-card:hover .entry-card__media img {
    transform: scale(1.045);
  }
}

.entry-card:hover .entry-card__title a {
  color: var(--dafa-accent-strong);
}

/* Dark mode: soften the resting border so card surfaces read as a distinct
 * layer above the page background instead of a hard outline. */
html.dafa-color-dark .entry-card,
body.dafa-color-dark .entry-card {
  border-color: color-mix(in srgb, var(--dafa-border) 82%, transparent);
}

html.dafa-color-dark .entry-card:hover,
body.dafa-color-dark .entry-card:hover {
  border-color: color-mix(in srgb, var(--dafa-accent) 38%, var(--dafa-border));
}

/* -------------------------------------------------------------------------
 * 5. Section headings — brand bar marker + tracking.
 * ------------------------------------------------------------------------- */
.section-heading h2 {
  position: relative;
  padding-left: 18px;
  letter-spacing: -0.02em;
}

.section-heading h2::before {
  position: absolute;
  top: 0.16em;
  bottom: 0.16em;
  left: 0;
  width: 3px;
  border-radius: 3px;
  background: var(--dafa-border);
  content: "";
}

.section-heading a {
  transition: color 180ms ease;
  color: var(--dafa-text-soft);
}

/* -------------------------------------------------------------------------
 * 6. Footer — link transitions and spacing rhythm.
 * ------------------------------------------------------------------------- */
.site-footer {
  padding-block: 56px 46px;
}

.footer-widgets {
  gap: 32px;
  margin-bottom: 40px;
}

.site-footer a {
  transition: color 180ms ease;
}

.footer-nav a:hover,
.footer-nav button:hover {
  color: var(--dafa-accent);
}

/* -------------------------------------------------------------------------
 * 7. Keyboard focus — reinforce the brand ring inside cards, where the
 * global outline can visually collide with the card border radius.
 * ------------------------------------------------------------------------- */
.entry-card__media:focus-visible,
.entry-card__title a:focus-visible {
  border-radius: 6px;
  outline-offset: 2px;
}

/* -------------------------------------------------------------------------
 * 8. Branded text selection.
 * ------------------------------------------------------------------------- */
::selection {
  background: var(--dafa-accent);
  color: var(--dafa-on-accent);
  text-shadow: none;
}

/* -------------------------------------------------------------------------
 * 9. Slim scrollbars (WebKit + Firefox). Colors come from the mode-aware
 * variables, so day/night both stay subtle; the thumb picks up the brand
 * accent on hover.
 * ------------------------------------------------------------------------- */
html {
  scrollbar-color: color-mix(in srgb, var(--dafa-text-soft) 42%, var(--dafa-surface)) transparent;
  scrollbar-width: thin;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  border: 2px solid var(--dafa-bg);
  border-radius: 8px;
  background: color-mix(in srgb, var(--dafa-text-soft) 38%, var(--dafa-surface));
}

::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--dafa-accent) 55%, var(--dafa-surface));
}

/* -------------------------------------------------------------------------
 * 10. Global control transitions — one shared timing for links, buttons and
 * form fields so every state change feels like the same product.
 * ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  a {
    transition: color 180ms ease;
  }

  .button,
  button,
  input[type="submit"] {
    transition:
      transform 180ms cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 180ms ease,
      background-color 180ms ease,
      border-color 180ms ease,
      color 180ms ease;
  }

  input:not([type]),
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="url"],
  input[type="tel"],
  input[type="password"],
  input[type="number"],
  select,
  textarea {
    transition:
      border-color 180ms ease,
      box-shadow 180ms ease,
      background-color 180ms ease;
  }
}

/* -------------------------------------------------------------------------
 * 11. Primary-nav inline SVG icons (replaced dashicons): keep the glyph
 * box aligned inside the 20px inline-grid slot from mobile-navigation.css.
 * ------------------------------------------------------------------------- */
.primary-navigation .dafa-nav-icon svg {
  display: block;
}

/* Source: polish-v2.css */
/**
 * Dafa Theme — visual polish layer, v2 (additive only).
 *
 * Loaded after polish.css. Every selector in this file was written against
 * DOM actually rendered by the theme templates (header.php / footer.php /
 * template-parts / inc/template-tags.php / inc/news-archive.php /
 * inc/breadcrumbs.php). Colors derive from the --dafa-* variables or the
 * theme's own ink/navy palette; motion is wrapped in
 * `@media (prefers-reduced-motion: no-preference)`.
 *
 * @package DafaTheme
 */

/* -------------------------------------------------------------------------
 * 1. Sticky header — scroll state.
 * site.css already makes .site-header sticky with backdrop blur (z-index 20,
 * admin-bar offsets handled). The topbar follows upward scrolling only;
 * shifting the sticky inset preserves the header's space in the document.
 * ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .site-header {
    transition:
      top 180ms ease,
      box-shadow 240ms ease,
      background-color 240ms ease;
  }
}

@media (min-width: 1024px) {
  .site-header.is-topbar-hidden {
    top: calc(0px - var(--dafa-topbar-height, 0px));
  }

  body.admin-bar .site-header.is-topbar-hidden {
    top: calc(32px - var(--dafa-topbar-height, 0px));
  }
}

.site-header.is-scrolled {
  box-shadow: 0 12px 32px -14px color-mix(in srgb, var(--dafa-text) 26%, transparent);
}

/* Slightly stronger transparency only where the blur stays enabled;
 * mobile-navigation.css deliberately drops backdrop-filter below 1024px. */
@media (min-width: 1024px) {
  .site-header.is-scrolled {
    background: color-mix(in srgb, var(--dafa-surface) 86%, transparent);
  }
}

/* -------------------------------------------------------------------------
 * 2. Footer — deep navy band in BOTH color modes.
 * The palette extends the theme's ink family (#172033 / #12161d); it is a
 * deliberate constant surface, so it stays dark in day mode as well.
 * Contrast: --dafa-footer-muted (#9aa5b4) on #11161f ≈ 7.5:1.
 * ------------------------------------------------------------------------- */
.site-footer {
  --dafa-footer-bg: #161c27;
  --dafa-footer-bg-deep: #10151f;
  --dafa-footer-ink: #e9edf3;
  --dafa-footer-muted: #9aa5b4;
  --dafa-footer-line: rgb(255 255 255 / 10%);

  position: relative;
  border-top: 0;
  background: linear-gradient(180deg, var(--dafa-footer-bg) 0%, var(--dafa-footer-bg-deep) 100%);
  color: var(--dafa-footer-muted);
}

.site-footer .widget {
  color: var(--dafa-footer-muted);
}

.site-footer .widget-title {
  margin-bottom: 14px;
  color: var(--dafa-footer-ink);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.site-footer a {
  color: var(--dafa-footer-ink);
}

.site-footer a:hover {
  color: #fff;
}

.site-footer .footer-nav a,
.site-footer .footer-nav button {
  color: var(--dafa-footer-ink);
}

.site-footer .footer-nav a:hover,
.site-footer .footer-nav button:hover {
  color: #fff;
}

/* Hot-tag chips: no fill; readable ink and a brand border on interaction.
 * Same selector specificity as site.css (0,3,1); this file loads later. */
.site-footer .wp-block-tag-cloud.is-style-outline a {
  border-color: var(--dafa-footer-line);
  background: transparent;
  color: var(--dafa-footer-ink);
}

.site-footer .wp-block-tag-cloud.is-style-outline a:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--dafa-accent) 70%, #fff);
  background: transparent;
  color: #fff;
}

/* Bottom row: separated copyright strip. */
.footer-row {
  margin-top: 8px;
  padding-top: 26px;
  border-top: 1px solid var(--dafa-footer-line);
}

.copyright {
  color: var(--dafa-footer-muted);
}

.copyright a {
  color: var(--dafa-footer-ink);
}

/* -------------------------------------------------------------------------
 * 3. Card typography refinement.
 * DOM: template-parts/content/card.php (.entry-card__media / __body /
 * __title / __excerpt / .entry-meta / .entry-card__badge / __filetype).
 * ------------------------------------------------------------------------- */
.entry-card__title {
  font-weight: 650;
  letter-spacing: -0.012em;
  line-height: 1.4;
}

.entry-card__excerpt {
  line-height: 1.62;
}

.entry-card__body > .entry-meta {
  gap: 6px 12px;
  font-size: 12.5px;
}

.entry-card__body > .entry-meta .entry-meta__metric-icon {
  width: 14px;
  height: 14px;
}

/* Badge chip: crisper small pill. */
.entry-card__badge {
  padding: 4px 10px;
  font-size: 11px;
  letter-spacing: 0.03em;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--dafa-badge-color, var(--dafa-accent)) 18%, transparent);
}

/* File-type chip (PDF/DOC/XLS/PPT/ZIP): tinted pill derived from its own
 * type color, so it stays correct in both modes. */
.entry-card__filetype {
  padding: 3px 7px;
  border-radius: 6px;
  background: color-mix(in srgb, currentColor 12%, transparent);
}

/* -------------------------------------------------------------------------
 * 4. Home section rhythm + "查看全部" micro-interaction.
 * Inter-section whitespace: 72px desktop (32+40), 40px mobile; the existing
 * hairline separator is kept but softened.
 * ------------------------------------------------------------------------- */
.home-stream {
  padding-block: 32px 40px;
  border-top-color: color-mix(in srgb, var(--dafa-border) 55%, transparent);
}

.home-stream:first-of-type {
  border-top: 0;
}

.section-heading {
  margin-bottom: 30px;
}

.section-heading a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 650;
  text-decoration: none;
}

.section-heading a::after {
  content: "→";
}

@media (prefers-reduced-motion: no-preference) {
  .section-heading a::after {
    transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .section-heading a:hover::after {
    transform: translateX(4px);
  }
}

@media (max-width: 782px) {
  .home-stream {
    padding-block: 20px;
  }
}

/* -------------------------------------------------------------------------
 * 5. Archive filters, hot-tag chips and stat cards.
 * DOM: inc/news-archive.php (.news-filter-form …), template-tags.php
 * (.resource-filters / .archive-subs__chip / .archive-stats__item).
 * ------------------------------------------------------------------------- */
.news-filter-form,
.resource-filters {
  box-shadow:
    0 1px 2px color-mix(in srgb, var(--dafa-text) 4%, transparent),
    0 10px 28px -18px color-mix(in srgb, var(--dafa-text) 14%, transparent);
}

@media (prefers-reduced-motion: no-preference) {
  .news-filter-select__toggle {
    transition: border-color 180ms ease, box-shadow 180ms ease;
  }
}

.news-filter-select__toggle:hover {
  border-color: color-mix(in srgb, var(--dafa-accent) 45%, var(--dafa-border));
}

/* Apply uses the neutral solid control; Reset remains a quiet outline. */
.news-filter-actions__apply {
  box-shadow: none;
}

/* Resource filter rows: pill hover/active states. */
.resource-filters__row a {
  border: 1px solid transparent;
}

@media (prefers-reduced-motion: no-preference) {
  .resource-filters__row a {
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
  }
}

.resource-filters__row a.is-active {
  border-color: color-mix(in srgb, var(--dafa-accent) 55%, var(--dafa-border));
  font-weight: 650;
}

/* Hot-tag chips in the archive hero. */
.archive-subs__chip {
  background: color-mix(in srgb, var(--dafa-bg) 55%, transparent);
}

@media (prefers-reduced-motion: no-preference) {
  .archive-subs__chip {
    transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1), border-color 160ms ease, color 160ms ease;
  }

  .archive-subs__chip:hover {
    transform: translateY(-1px);
  }
}

/* Stat cards: inset layering against the hero surface + tighter numerals. */
.archive-stats__item {
  background: var(--dafa-bg);
}

.archive-stats__item strong {
  font-weight: 760;
  letter-spacing: -0.01em;
}

.archive-stats__item span {
  letter-spacing: 0.04em;
}

/* -------------------------------------------------------------------------
 * 6. Single-entry typography (.entry-content) + resource purchase card.
 * ------------------------------------------------------------------------- */
.entry-content {
  line-height: 1.85;
}

.entry-content h2 {
  position: relative;
  margin-top: 2em;
  padding-left: 16px;
}

.entry-content h2::before {
  position: absolute;
  top: 0.2em;
  bottom: 0.2em;
  left: 0;
  width: 3px;
  border-radius: 3px;
  background: var(--dafa-border);
  content: "";
}

.entry-content h3 {
  margin-top: 1.7em;
}

/* Quiet quote surface, consistent with the reading column. */
.entry-content blockquote {
  padding: 18px 22px;
  border-left: 3px solid var(--dafa-border);
  border-radius: 0 var(--dafa-radius) var(--dafa-radius) 0;
  background: var(--dafa-surface-muted);
  color: var(--dafa-text);
}

/* Content imagery. */
.entry-content img {
  border-radius: calc(var(--dafa-radius) * 0.8);
}

.entry-content figure img,
.entry-content .wp-block-image img {
  box-shadow: var(--dafa-shadow);
}

/* Content links retain a consistent underline for readability. */
.entry-content a:not(.button):not(.wp-block-button__link) {
  text-decoration-line: underline;
  text-decoration-color: color-mix(in srgb, var(--dafa-accent) 40%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* Lists. */
.entry-content ul,
.entry-content ol {
  padding-inline-start: 1.5em;
}

.entry-content li::marker {
  color: var(--dafa-text-soft);
  font-weight: 700;
}

/* Tables: framed, striped, rounded. */
.entry-content table {
  border: 1px solid var(--dafa-border);
  border-radius: var(--dafa-radius);
}

.entry-content thead th {
  background: var(--dafa-surface-muted);
  font-weight: 700;
}

.entry-content tbody tr:nth-child(even) td {
  background: color-mix(in srgb, var(--dafa-surface-muted) 50%, transparent);
}

/* Resource purchase card (theme-owned classes only; the #erphpdown compat
 * rules in sidebar-v3.css are deliberately not touched). */
@media (prefers-reduced-motion: no-preference) {
  .sidebar .dafa-resource-card {
    transition: box-shadow 240ms cubic-bezier(0.22, 1, 0.36, 1), border-color 240ms ease;
  }

  .sidebar .dafa-resource-card:hover {
    box-shadow: var(--dafa-shadow);
  }
}

/* -------------------------------------------------------------------------
 * 7. Back-to-top floating button (created by polish-v2.js).
 * bottom: 88px keeps it clear of any bottom-right chat entry; z-index 40
 * stays below the mobile drawer (50) and the AI drawer (99991).
 * ------------------------------------------------------------------------- */
.dafa-back-to-top {
  position: fixed;
  right: 24px;
  bottom: 88px;
  z-index: 40;
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--dafa-border);
  border-radius: 999px;
  background: var(--dafa-surface);
  box-shadow: 0 4px 14px rgb(23 32 51 / 0.08);
  color: var(--dafa-text-soft);
  cursor: pointer;
  opacity: 0;
  transform: translateY(8px);
  visibility: hidden;
}

.dafa-back-to-top.is-visible {
  opacity: 1;
  transform: none;
  visibility: visible;
}

.dafa-back-to-top svg {
  width: 20px;
  height: 20px;
}

@media (prefers-reduced-motion: no-preference) {
  .dafa-back-to-top {
    transition:
      opacity 240ms ease,
      transform 240ms cubic-bezier(0.22, 1, 0.36, 1),
      visibility 240ms ease,
      background-color 160ms ease;
  }

  .dafa-back-to-top:hover {
    transform: translateY(-2px);
  }
}

.dafa-back-to-top:is(:hover, :focus-visible) {
  background: var(--dafa-accent) var(--dafa-button-hover-gradient);
  border-color: var(--dafa-accent);
  color: var(--dafa-on-accent);
}

@media (max-width: 782px) {
  .dafa-back-to-top {
    right: 16px;
    bottom: 76px;
    width: 40px;
    height: 40px;
  }
}

/* -------------------------------------------------------------------------
 * 8. Breadcrumbs refinement.
 * ------------------------------------------------------------------------- */
.dafa-breadcrumbs a {
  color: var(--dafa-text-soft);
  text-decoration: none;
}

.dafa-breadcrumbs a:hover {
  color: var(--dafa-accent-strong);
}

.dafa-breadcrumbs [aria-current="page"] {
  color: var(--dafa-text-soft);
  font-weight: 400;
}

/* Source: polish-v3.css */
/**
 * Dafa Theme — color discipline & hierarchy layer (additive, site-wide).
 *
 * Loaded after polish-v2. Goal: neutrals carry the interface; brand orange
 * is reserved for primary actions, current states and rare accents
 * (60-30-10). Every selector maps to markup verified in the theme source.
 *
 * @package DafaTheme
 */

/* =========================================================================
 * B1. Header nav badges → borderless text labels.
 * DOM: inc/navigation.php emits .dafa-nav-badge--exclusive / --vip / --ai
 * inside primary-nav links. site.css (570-602) gives each a saturated tint;
 * badges are pointer-events:none, so the hover tint is driven by the parent
 * link. Resting state is now identical across all three; the semantic color
 * only returns on hover of the parent menu item.
 * ========================================================================= */

.dafa-nav-badge {
  --dafa-nav-badge-ink: var(--dafa-text-soft);

  border: 0;
  background: transparent;
}

@media (prefers-reduced-motion: no-preference) {
  .dafa-nav-badge {
    transition: color 160ms ease;
  }
}

.primary-navigation a:hover .dafa-nav-badge--exclusive,
.primary-navigation a:focus-visible .dafa-nav-badge--exclusive {
  --dafa-nav-badge-ink: var(--dafa-accent-strong);
}

.primary-navigation a:hover .dafa-nav-badge--vip,
.primary-navigation a:focus-visible .dafa-nav-badge--vip {
  --dafa-nav-badge-ink: color-mix(in srgb, #8c6500 55%, var(--dafa-text));
}

.primary-navigation a:hover .dafa-nav-badge--ai,
.primary-navigation a:focus-visible .dafa-nav-badge--ai {
  --dafa-nav-badge-ink: color-mix(in srgb, #315f9f 55%, var(--dafa-text));
}

/* =========================================================================
 * B2. Control hierarchy.
 * Everyday actions use the neutral control tokens in site.css; download,
 * payment and membership acquisition keep their dedicated brand styles.
 * ========================================================================= */

.home-hero__quick-link {
  font-weight: 620;
}

/* =========================================================================
 * B3. Unified chip language.
 * One neutral pill spec (padding / radius / 1px border / 12.5px / soft ink)
 * for tag clouds, archive hot-tag chips and resource filter pills. Brand
 * color appears only on hover / active. Footer chips keep their dark-band
 * variant (higher-specificity rules in polish-v2.css win there).
 * ========================================================================= */

.archive-subs__chip,
.resource-filters__row a,
.wp-block-tag-cloud a {
  padding: 5px 12px;
  border: 1px solid var(--dafa-border);
  border-radius: 999px;
  background: transparent;
  color: var(--dafa-text-soft);
  font-size: 12.5px;
  line-height: 1.5;
}

.archive-subs__chip:is(:hover, :focus-visible):not([aria-disabled="true"]),
.resource-filters__row a:is(:hover, :focus-visible):not([aria-disabled="true"]),
.wp-block-tag-cloud a:is(:hover, :focus-visible):not([aria-disabled="true"]) {
  border-color: var(--dafa-accent);
  background: transparent;
  color: var(--dafa-accent-strong);
  text-decoration: none;
}

/* Selected choices remain unfilled; brand ink and a fine border identify the selection. */
.resource-filters__row a.is-active,
.archive-subs__chip.is-current {
  font-weight: 650;
  background: transparent;
  color: var(--dafa-accent-strong);
  border-color: var(--dafa-accent);
}

/* =========================================================================
 * B4. Semantic-color containment.
 * File-type chips (PDF/DOC/XLS…) keep their identity colors — they are
 * status semantics, not decoration. Their tinted backgrounds (polish-v2)
 * are further desaturated so they stop competing with the brand orange.
 * ========================================================================= */

.entry-card__filetype {
  background: color-mix(in srgb, currentColor 9%, transparent);
}

/* =========================================================================
 * B5. Type hierarchy ladder.
 * Desktop targets: page H1 40-44 / section H2 28-30 / card H3 20.
 * Hero display type is the deliberate exception and stays as-is.
 * ========================================================================= */

.archive-hero h1,
.archive-title,
.search-hero h1,
.vip-hero h1 {
  font-size: clamp(32px, 4vw, 44px);
  letter-spacing: -0.03em;
}

.section-heading h2 {
  font-size: clamp(24px, 2.6vw, 30px);
}

.entry-card__title {
  font-size: 20px;
}

/* Page subtitles step down clearly below the H1. */
.archive-description {
  color: var(--dafa-text-soft);
  font-size: 15px;
}

/* Breadcrumbs recede to wayfinding metadata. */
.dafa-breadcrumbs {
  color: var(--dafa-text-soft);
  font-size: 12.5px;
}

/* =========================================================================
 * Owner-requested removals (2026-09-03)
 * ========================================================================= */

/* Header VIP summary chip: drop the soft background + gradient, keep the
 * border-top rule and text color from site.css. Same specificity (0,3,0),
 * this file loads later. */
.header-actions .header-user__summary--vip[data-dafa-vip-tier] {
  background-color: transparent;
  background-image: none;
}

/* =========================================================================
 * Color-mode switcher relocated to the footer bottom bar.
 * The markup keeps its original classes (.mobile-color-mode*) so
 * color-mode.js keeps binding; these rules re-skin it for the dark footer
 * band and make it visible on every viewport (base rule hides it).
 * ========================================================================= */
.site-footer .mobile-color-mode {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.site-footer .mobile-color-mode__label {
  margin: 0;
  color: var(--dafa-footer-muted);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.site-footer .mobile-color-mode__options {
  display: inline-flex;
  gap: 2px;
  padding: 2px;
  border: 1px solid var(--dafa-footer-line);
  border-radius: 999px;
  background: rgb(255 255 255 / 6%);
}

.site-footer .mobile-color-mode__option {
  display: inline-flex;
  width: auto;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--dafa-footer-muted);
  font-size: 12px;
  font-weight: 560;
  cursor: pointer;
}

.site-footer .mobile-color-mode__option svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.site-footer .mobile-color-mode__option:hover,
.site-footer .mobile-color-mode__option:focus-visible {
  background: rgb(255 255 255 / 10%);
  color: #fff;
}

.site-footer .mobile-color-mode__option:focus-visible {
  outline: none;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.site-footer .mobile-color-mode__option[aria-checked="true"] {
  border-color: transparent;
  background: var(--dafa-footer-ink);
  color: #161c27;
  font-weight: 680;
}

.site-footer .mobile-color-mode__option:active {
  transform: none;
}

/* Footer bottom bar: nav + switcher + copyright on one row, wrapping
 * gracefully on small screens. */
.site-footer .footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px 20px;
}

@media (max-width: 640px) {
  .site-footer .footer-row {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Source: vip-brand.css */
/* =========================================================================
 * vip-brand.css — 全站会员体系统一视觉层 (2026-09-03)
 *
 * 背景: 站点原有的会员令牌系统 (site.css [data-dafa-vip-tier]) 为每个档位
 * 配了不同金属色 (体验=岩灰 / 包月=蓝 / 包季=绿 / 包年=铜 / 终身=玫红 /
 * 超级=紫)。这套彩虹金属色与全站「主色调克制」的方向冲突, 且与个人中心
 * 侧栏的金色徽章严重不一致 (站主截图指出: 页头皇冠=玫红 vs 侧栏=金色)。
 *
 * 决策: 全站会员身份统一为单一「香槟金」视觉语言。档位差异由文字标签
 * (体验VIP / 包月VIP / 包年VIP / 终身VIP) 承载, 视觉不再分色。
 * 金色锚定侧栏徽章已获认可的色板 (#f3d98b → #dfae4a, 墨色 #4a3505),
 * 与品牌橙红同属暖色系, 不产生第三种强调色。
 *
 * 机制: site.css 的基础块里 --dafa-vip-border / --dafa-vip-soft /
 * --dafa-vip-ink / --dafa-vip-panel 均由 --dafa-vip-accent 经 color-mix
 * 派生, 因此此处只需统一 accent / metal-high / metal-low / on-accent
 * 四个源令牌, 所有消费方 (页头皇冠 / 下拉身份卡 / 评论区徽章 / VIP 页
 * 定价卡 / 个人中心徽章) 自动跟随。本文件在 polish-v3 之后加载,
 * 同特异性下后者胜出, 无需 !important, 无需改动 site.css。
 *
 * 明暗双模式: 金色在两种模式下均可读, 暗色模式仅微调高光与墨色。
 * ========================================================================= */

/* -- 1. 统一令牌: 所有档位收敛为同一套香槟金 -------------------------- */

[data-dafa-vip-tier],
[data-dafa-vip-tier="day"],
[data-dafa-vip-tier="month"],
[data-dafa-vip-tier="quarter"],
[data-dafa-vip-tier="year"],
[data-dafa-vip-tier="life"],
[data-dafa-vip-tier="super"],
[data-dafa-vip-tier="category"] {
  --dafa-vip-accent: #d9a441;
  --dafa-vip-metal-high: #f3d98b;
  --dafa-vip-metal-low: #8a5f16;
  /* 深铜墨色取代原本的近白, 在金色徽章上对比更好、质感更高级 */
  --dafa-vip-on-accent: #43300a;
}

html.dafa-color-dark [data-dafa-vip-tier],
body.dafa-color-dark [data-dafa-vip-tier] {
  --dafa-vip-accent: #e0b054;
  --dafa-vip-metal-high: #f6e0a0;
  --dafa-vip-metal-low: #9a6d20;
  --dafa-vip-on-accent: #332507;
}

@media (prefers-color-scheme: dark) {
  html:not(.dafa-color-light) body:not(.dafa-color-light) [data-dafa-vip-tier] {
    --dafa-vip-accent: #e0b054;
    --dafa-vip-metal-high: #f6e0a0;
    --dafa-vip-metal-low: #9a6d20;
    --dafa-vip-on-accent: #332507;
  }
}

/* -- 2. 导航「VIP」徽章: 硬编码金 (#d6a52a, site.css) 对齐到统一令牌 --- */

.dafa-nav-badge--vip {
  --dafa-nav-badge-bg: color-mix(in srgb, var(--dafa-vip-accent) 22%, var(--dafa-surface));
  --dafa-nav-badge-ink: color-mix(in srgb, var(--dafa-vip-accent) 52%, var(--dafa-text));
}

/* -- 3. 徽章件质感统一: 皇冠/身份标签共用同一枚「奖章」渐变 ------------
 * 页头皇冠 (.header-user__crown)、下拉皇冠 (.header-user__identity-crown)、
 * 评论区徽章图标 (.comment-vip-badge__icon) 均已消费 --dafa-vip-medallion,
 * 令牌统一后自动一致; 此处仅微调皇冠投影, 让金色徽章在浅色头像上不飘。 */

.header-user__crown,
.header-user__identity-crown,
.comment-vip-badge__icon {
  box-shadow:
    inset 0 -1px 0 rgb(0 0 0 / 0.14),
    0 1px 3px rgb(58 40 6 / 0.28);
}

/* =========================================================================
 * /vip/ 定价页: 会员状态横幅 + 权益对比表 (2026-09-03)
 * 与个人中心三态 (最高级/续费/升级) 同一语义; 数据由模板实时读取
 * erphpdown 配置, 不与实际售卖漂移。
 * ========================================================================= */

/* -- 会员状态横幅 (仅登录会员可见) ------------------------------------- */

.vip-member-banner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin: 0 0 26px;
  padding: 12px 18px;
  border: 1px solid var(--dafa-vip-border);
  border-radius: 12px;
  background-color: var(--dafa-vip-soft);
  background-image: var(--dafa-vip-panel);
  color: var(--dafa-text);
  font-size: 13.5px;
  line-height: 1.6;
}

.vip-member-banner strong {
  color: var(--dafa-vip-ink);
  font-weight: 700;
}

.vip-member-banner__entitlement {
  color: var(--dafa-vip-ink);
  font-size: 12.5px;
}

.vip-member-banner__note {
  color: var(--dafa-text-soft);
}

.vip-member-banner__link {
  margin-left: auto;
  color: var(--dafa-accent-strong);
  font-weight: 600;
  text-decoration: none;
}

/* -- 权益对比表 ---------------------------------------------------------- */

.vip-compare {
  margin: 40px 0 8px;
}

.vip-compare > h2 {
  position: relative;
  margin: 0 0 18px;
  padding-left: 14px;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* 品牌竖条, 与首页区块标题同一语言 */
.vip-compare > h2::before {
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 0;
  width: 4px;
  border-radius: 2px;
  background: var(--dafa-accent);
  content: "";
}

.vip-compare__scroll {
  overflow-x: auto;
  border: 1px solid var(--dafa-border);
  border-radius: 14px;
  background: var(--dafa-surface);
  box-shadow: 0 12px 32px -18px rgb(23 32 51 / 0.18);
}

.vip-compare__scroll:focus-visible {
  outline: 2px solid var(--dafa-accent-strong);
  outline-offset: 3px;
}

.vip-compare__table {
  width: 100%;
  min-width: 620px;
  border-collapse: collapse;
  font-size: 13.5px;
}

.vip-compare__table th,
.vip-compare__table td {
  padding: 13px 18px;
  text-align: center;
}

.vip-compare__table thead th {
  border-bottom: 1px solid var(--dafa-border);
  background: var(--dafa-surface-muted);
  color: var(--dafa-text);
  font-size: 14px;
  font-weight: 700;
}

.vip-compare__table thead th:first-child {
  text-align: left;
}

.vip-compare__table tbody th {
  color: var(--dafa-text-soft);
  font-weight: 500;
  text-align: left;
  white-space: nowrap;
}

.vip-compare__table tbody tr + tr th,
.vip-compare__table tbody tr + tr td {
  border-top: 1px solid color-mix(in srgb, var(--dafa-border) 62%, transparent);
}

/* 包年列: 会员金高亮 + 顶部贯通到底 */
.vip-compare__table .is-featured {
  background: color-mix(in srgb, #d9a441 9%, transparent);
}

.vip-compare__table thead .is-featured {
  background: color-mix(in srgb, #d9a441 15%, var(--dafa-surface));
  color: color-mix(in srgb, #a87e24 68%, var(--dafa-text));
}

.vip-compare__flag {
  margin-left: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--dafa-accent);
  color: var(--dafa-on-accent);
  font-size: 10.5px;
  font-weight: 650;
  letter-spacing: 0.05em;
  vertical-align: 2px;
}

.vip-compare__table td strong {
  font-size: 16px;
  font-weight: 750;
}

.vip-compare__yes {
  color: color-mix(in srgb, #c1902c 55%, var(--dafa-text));
  font-weight: 650;
}

.vip-compare__yes::before {
  display: inline-block;
  width: 13px;
  height: 13px;
  margin-right: 5px;
  background: currentcolor;
  content: "";
  vertical-align: -2px;
  -webkit-mask: var(--dafa-icon-check) center / contain no-repeat;
  mask: var(--dafa-icon-check) center / contain no-repeat;
}

.vip-compare__price-row td {
  padding-top: 15px;
  padding-bottom: 15px;
}

.vip-compare__save {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--dafa-accent) 12%, var(--dafa-surface));
  color: var(--dafa-accent-strong);
  font-size: 11px;
  font-weight: 650;
}

@media (max-width: 640px) {
  .vip-compare {
    margin-top: 30px;
  }

  .vip-compare__table {
    min-width: 540px;
    font-size: 12.5px;
  }

  .vip-compare__table th,
  .vip-compare__table td {
    padding: 11px 12px;
  }

  .vip-member-banner__link {
    margin-left: 0;
  }
}

/* Source: public-form-controls.css */
/* Native autofill follows each site's field surface; normal field styling stays local. */
html body.dafa-theme :is(.comment-form input, .inbox-search input) { --dafa-autofill-fill: var(--dafa-bg); }
html body.dafa-theme .chuhai-vc__notify-setup input { --dafa-autofill-fill: #fff; --dafa-autofill-ink: var(--vc-ink); }
html body.dafa-color-dark .chuhai-vc__notify-setup input { --dafa-autofill-fill: var(--dafa-surface); }
html body.dafa-theme :is(.comment-form input, .scope-search__field, .home-hero-ai__field, .archive-hero__search input, .tool-library__search input, .links-directory__search-control input, .inbox-search input, .chuhai-vc__notify-setup input):is(:autofill, :-webkit-autofill) {
  background-clip: padding-box !important;
  -webkit-box-shadow: 0 0 0 1000px var(--dafa-autofill-fill, var(--dafa-surface)) inset !important;
  box-shadow: 0 0 0 1000px var(--dafa-autofill-fill, var(--dafa-surface)) inset !important;
  -webkit-text-fill-color: var(--dafa-autofill-ink, var(--dafa-text));
  caret-color: var(--dafa-autofill-ink, var(--dafa-text));
}

