.page--catalogue {
  max-width: 1040px;
  padding-top: 10px;
}

.catalogue-breadcrumbs {
  margin: 0 0 12px;
  color: var(--color-text-muted);
  font-size: 0.86rem;
}

.catalogue-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.catalogue-breadcrumbs li:not(:last-child)::after {
  margin-inline-start: 0.5rem;
  color: var(--color-text-subtle);
  content: "›";
}

.catalogue-breadcrumbs a {
  color: var(--color-text-brand);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.18em;
}

.catalogue-breadcrumbs a:hover {
  color: var(--color-primary-700);
}

.catalogue-breadcrumbs a:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 3px;
}

.catalogue-intro {
  margin-bottom: 22px;
}

/* Catalogue shell mirrors the reader filters panel: parchment field, gold
   hairline, single dark-green rule on top. */
.catalogue-section {
  padding: 0;
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  border-radius: 0;
  background: var(--color-bg-surface-muted);
  box-shadow: none;
}

.catalogue-section-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 16px;
  padding: 11px 16px 10px;
}

.catalogue-section-heading h2,
.catalogue-section-heading p {
  margin: 0;
}

.catalogue-section-heading h2 {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-text-brand);
}

.catalogue-section-heading p {
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
}

.catalogue-list {
  position: relative;
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--color-bg-surface);
}

.catalogue-list-authors {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.catalogue-list li {
  min-width: 0;
  border-top: 1px solid var(--color-border-muted);
}

.catalogue-list-authors li:nth-child(odd) {
  border-inline-end: 1px solid var(--color-border-muted);
}

/* Close the column rule when an odd author count leaves the last cell empty. */
.catalogue-list-authors:has(> li:last-child:nth-child(odd))::after {
  content: "";
  border-top: 1px solid var(--color-border-muted);
}

.catalogue-list a {
  display: flex;
  min-height: 46px;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 16px;
  color: var(--color-text-brand);
  text-decoration: none;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
}

.catalogue-list a:hover {
  background: var(--color-primary-tint-subtle);
  color: var(--color-primary-900);
}

.catalogue-list a:hover .catalogue-item-title {
  text-decoration: underline;
  text-decoration-thickness: 0.07em;
  text-underline-offset: 0.18em;
}

.catalogue-list a:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: -2px;
  background: var(--color-primary-tint-subtle);
}

.catalogue-item-title {
  min-width: 0;
  font-size: 0.97rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.catalogue-item-meta {
  flex: 0 0 auto;
  min-width: 5.25rem;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.5;
  text-align: end;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* Work titles run long, so they get the full row width and no trailing meta. */
.catalogue-list-works a {
  justify-content: flex-start;
}

@media (prefers-reduced-motion: reduce) {
  .catalogue-list a {
    transition: none;
  }
}

@media (max-width: 640px) {
  .catalogue-section-heading {
    padding: 10px 12px 9px;
  }

  .catalogue-list-authors {
    grid-template-columns: minmax(0, 1fr);
  }

  .catalogue-list-authors li:nth-child(odd) {
    border-inline-end: 0;
  }

  .catalogue-list-authors:has(> li:last-child:nth-child(odd))::after {
    display: none;
  }

  .catalogue-list a {
    padding-inline: 12px;
  }

  .catalogue-item-meta {
    min-width: 4.75rem;
  }
}
@font-face {
  font-family: "NAU5";
  src: local("New Athena Unicode"), local("NAU5"),
    url("/fonts/new-athena-unicode/new-athena-unicode-regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "NAU5";
  src: local("New Athena Unicode Italic"),
    url("/fonts/new-athena-unicode/new-athena-unicode-italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "NAU5";
  src: local("New Athena Unicode Bold"),
    url("/fonts/new-athena-unicode/new-athena-unicode-bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "NAU5";
  src: local("New Athena Unicode Bold Italic"),
    url("/fonts/new-athena-unicode/new-athena-unicode-bold-italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}

/* Gentium (SIL, OFL-1.1) — self-hosted webfont. */
@font-face {
  font-family: "Gentium";
  src: local("Gentium"), local("Gentium Plus"),
    url("/fonts/gentium/Gentium-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Gentium";
  src: local("Gentium Italic"), local("Gentium Plus Italic"),
    url("/fonts/gentium/Gentium-Italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Gentium";
  src: local("Gentium Bold"), local("Gentium Plus Bold"),
    url("/fonts/gentium/Gentium-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Gentium";
  src: local("Gentium Bold Italic"), local("Gentium Plus Bold Italic"),
    url("/fonts/gentium/Gentium-BoldItalic.woff2") format("woff2");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}

/* Kadmos U (D. Mastronarde / APA). Self-host included so reading view can
   request it; license-aware administrators may swap to local() only. */
@font-face {
  font-family: "Kadmos U";
  src: local("Kadmos U"), local("KadmosU"),
    url("/fonts/kadmos/KadmosU.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

/* GFS Didot (Greek Font Society, OFL). */
@font-face {
  font-family: "GFS Didot";
  src: local("GFS Didot"), local("GFSDidot"),
    url("/fonts/gfs-didot/GFSDidot.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "GFS Didot";
  src: local("GFS Didot Italic"), local("GFSDidotItalic"),
    url("/fonts/gfs-didot/GFSDidotItalic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "GFS Didot";
  src: local("GFS Didot Bold"), local("GFSDidotBold"),
    url("/fonts/gfs-didot/GFSDidotBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "GFS Didot";
  src: local("GFS Didot Bold Italic"), local("GFSDidotBoldItalic"),
    url("/fonts/gfs-didot/GFSDidotBoldItalic.woff2") format("woff2");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}

/* Hide the text caret site-wide so reading content does not show the
   blinking cursor when users click or double-click on text. The caret is
   restored explicitly on real input controls and editable surfaces below. */
html,
body {
  caret-color: transparent;
}

input,
textarea,
select,
[contenteditable="true"],
[contenteditable=""] {
  caret-color: auto;
}

:root,
[data-theme="modern"] {
  color-scheme: light;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  /* Primitive palette tokens for the current modern burgundy/parchment theme. */
  --search-highlight-bg: rgba(201, 149, 72, 0.3);
  --search-highlight-text: #2a2018;
  --search-highlight-border: rgba(154, 122, 54, 0.6);
  --primitive-burgundy-950: #6f0808;
  --primitive-burgundy-900: #7d1212;
  --primitive-burgundy-800: #8f1717;
  --primitive-burgundy-700: #9d272b;
  --primitive-burgundy-600: #a83236;

  --primitive-parchment-50: #fffefb;
  --primitive-parchment-100: #fffaf0;
  --primitive-parchment-150: #fcfbf5;
  --primitive-parchment-200: #f8f2e0;
  --primitive-parchment-250: #f4ead7;
  --primitive-parchment-300: #e6dcc0;
  --primitive-parchment-400: #d8c892;
  --primitive-parchment-500: #cdbb7c;

  --primitive-gold-400: #c7b88d;
  --primitive-gold-500: #bda869;
  --primitive-gold-600: #9a7a36;

  --primitive-border-100: #ddd4be;
  --primitive-border-200: #dccfab;
  --primitive-border-300: #d7ccb0;
  --primitive-border-400: #c7b88d;

  --primitive-ink-950: #1a1410;
  --primitive-ink-900: #2a2018;
  --primitive-ink-800: #3a2e22;
  --primitive-ink-700: #4e4234;
  --primitive-ink-600: #655748;
  --primitive-ink-500: #857562;

  --primitive-success-700: #31511e;
  --primitive-success-600: #507438;
  --primitive-success-bg: #edf5e6;
  --primitive-success-border: #9ab37c;

  --primitive-warning-700: #6f4700;
  --primitive-warning-600: #9a5a18;
  --primitive-warning-bg: #fff4d6;
  --primitive-warning-border: #b98c2f;

  --primitive-danger-800: #7d1212;
  --primitive-danger-700: #8f1717;
  --primitive-danger-bg: #fff8f5;
  --primitive-danger-bg-hover: #fff1ed;
  --primitive-danger-border: #c28b83;

  --theme-header-text-ivory: #f3ecdb;
  --theme-header-text-ivory-muted: #e7dbc0;
  --theme-header-border-dark: #641414;
  --theme-notice-success-bg: #f4f8ef;
  --theme-notice-success-border: #d5dfc5;
  --theme-notice-success-text: #2f4f24;
  --theme-notice-error-bg: #fff6f3;
  --theme-notice-error-border: #e7c5bf;
  --theme-notice-warning-bg: #fff8ea;
  --theme-notice-warning-border: #ead7ad;
  --theme-notice-warning-text: #68420e;
  --theme-notice-info-border: #e4d5bd;
  --theme-action-primary-bg-hover: #861f23;
  --theme-action-primary-text: #ffffff;
  --theme-action-secondary-border-hover: #b59658;
  --theme-action-danger-border-hover: #b85f54;
  --theme-badge-muted-bg: #f3eedb;
  --theme-badge-muted-border: #d8cfb6;
  --theme-badge-muted-text: #79694f;
  --theme-bg-page: #faf6f0;
  --theme-bg-surface-raised: #fffaf5;
  --theme-border-hover: #b59b68;
  --theme-border-control: #d8c49a;
  --theme-border-control-active: #c7a967;
  --theme-focus-ring: rgba(157, 39, 43, 0.22);
  --theme-focus-ring-subtle: rgba(157, 39, 43, 0.12);
  --theme-focus-ring-medium: rgba(157, 39, 43, 0.28);
  --theme-focus-ring-strong: rgba(157, 39, 43, 0.32);
  --theme-focus-ring-header: rgba(157, 39, 43, 0.6);
  --theme-primary-tint-subtle: rgba(157, 39, 43, 0.06);
  --theme-overlay: rgba(47, 36, 24, 0.48);
  --theme-shadow: rgba(47, 36, 24, 0.12);
  --theme-shadow-strong: rgba(47, 36, 24, 0.22);
  --theme-control-bg-soft: #fffaf5;
  --theme-control-bg-hover: #f5efe6;
  --theme-control-bg-active: #efe8dc;
  --theme-control-bg-disabled: #ebe4d8;
  --theme-control-text-emphasis: #4b2b18;
  --theme-control-text-active: #5f1f1f;
  --theme-terminal-bg: #111827;
  --theme-terminal-text: #e5e7eb;
  --theme-terminal-border: #1f2937;
}

[data-theme="byzantine"] {
  color-scheme: light;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  --search-highlight-bg: rgba(169, 146, 85, 0.32);
  --search-highlight-text: #1f1812;
  --search-highlight-border: rgba(155, 122, 54, 0.55);
  --primitive-burgundy-950: #1f3028;
  --primitive-burgundy-900: #24382f;
  --primitive-burgundy-800: #2f4a3c;
  --primitive-burgundy-700: #3f5f4d;
  --primitive-burgundy-600: #4f745f;

  --primitive-parchment-50: #fffdf7;
  --primitive-parchment-100: #f7f3ea;
  --primitive-parchment-150: #f3eee3;
  --primitive-parchment-200: #f2ead7;
  --primitive-parchment-250: #eadfca;
  --primitive-parchment-300: #e8ddbf;
  --primitive-parchment-400: #d6c48d;
  --primitive-parchment-500: #c3ad68;

  --primitive-gold-400: #b99f68;
  --primitive-gold-500: #a99255;
  --primitive-gold-600: #9b7a36;

  --primitive-border-100: #e4d8bf;
  --primitive-border-200: #d8c9aa;
  --primitive-border-300: #cdbd9b;
  --primitive-border-400: #b99f68;

  --primitive-ink-950: #1f1812;
  --primitive-ink-900: #2b2118;
  --primitive-ink-800: #3b2d20;
  --primitive-ink-700: #4f4032;
  --primitive-ink-600: #665a4a;
  --primitive-ink-500: #847869;

  --primitive-success-700: #24382f;
  --primitive-success-600: #2f4a3c;
  --primitive-success-bg: #e8efe8;
  --primitive-success-border: #8aa38d;

  --primitive-warning-700: #6c4a16;
  --primitive-warning-600: #9b6b24;
  --primitive-warning-bg: #f6edd2;
  --primitive-warning-border: #b99f68;

  --primitive-danger-800: #7a2626;
  --primitive-danger-700: #8f2f2f;
  --primitive-danger-bg: #fff8f5;
  --primitive-danger-bg-hover: #fff1ed;
  --primitive-danger-border: #c28b83;

  --theme-header-text-ivory: #f4eddb;
  --theme-header-text-ivory-muted: #e5d7ba;
  --theme-header-border-dark: #1b2a23;
  --theme-notice-success-bg: #eef5ee;
  --theme-notice-success-border: #cbdccf;
  --theme-notice-success-text: #24382f;
  --theme-notice-error-bg: #fff6f3;
  --theme-notice-error-border: #e7c5bf;
  --theme-notice-warning-bg: #f8f1dc;
  --theme-notice-warning-border: #ddc88e;
  --theme-notice-warning-text: #5d431b;
  --theme-notice-info-border: #d9c7a5;
  --theme-action-primary-bg-hover: #314d3e;
  --theme-action-primary-text: #ffffff;
  --theme-action-secondary-border-hover: #a99255;
  --theme-action-danger-border-hover: #b85f54;
  --theme-badge-muted-bg: #eee6d6;
  --theme-badge-muted-border: #d4c5a5;
  --theme-badge-muted-text: #6d604f;
  --theme-bg-page: #f5f0e6;
  --theme-bg-surface-raised: #fffdf7;
  --theme-border-hover: #a99255;
  --theme-border-control: #cdbd9b;
  --theme-border-control-active: #b99f68;
  --theme-focus-ring: rgba(63, 95, 77, 0.22);
  --theme-focus-ring-subtle: rgba(63, 95, 77, 0.12);
  --theme-focus-ring-medium: rgba(63, 95, 77, 0.28);
  --theme-focus-ring-strong: rgba(63, 95, 77, 0.32);
  --theme-focus-ring-header: rgba(63, 95, 77, 0.6);
  --theme-primary-tint-subtle: rgba(63, 95, 77, 0.07);
  --theme-overlay: rgba(31, 48, 40, 0.48);
  --theme-shadow: rgba(43, 33, 24, 0.12);
  --theme-shadow-strong: rgba(43, 33, 24, 0.22);
  --theme-control-bg-soft: #fffdf7;
  --theme-control-bg-hover: #f0ebe0;
  --theme-control-bg-active: #ebe4d4;
  --theme-control-bg-disabled: #e8e2d6;
  --theme-control-text-emphasis: #3b2d20;
  --theme-control-text-active: #283d32;
  --theme-terminal-bg: #111827;
  --theme-terminal-text: #e5e7eb;
  --theme-terminal-border: #1f2937;
}

[data-theme="deep-plum"] {
  color-scheme: light;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  --search-highlight-bg: rgba(180, 140, 90, 0.34);
  --search-highlight-text: #2b1928;
  --search-highlight-border: rgba(140, 100, 60, 0.5);
  --primitive-burgundy-950: #2b1928;
  --primitive-burgundy-900: #352032;
  --primitive-burgundy-800: #4a2c45;
  --primitive-burgundy-700: #5e3a58;
  --primitive-burgundy-600: #73506d;

  --primitive-parchment-50: #fffdf8;
  --primitive-parchment-100: #f7f1e8;
  --primitive-parchment-150: #f3ede3;
  --primitive-parchment-200: #f3ecdc;
  --primitive-parchment-250: #eadfca;
  --primitive-parchment-300: #e8dcc2;
  --primitive-parchment-400: #d4c38f;
  --primitive-parchment-500: #bfa767;

  --primitive-gold-400: #b99b66;
  --primitive-gold-500: #aa8f58;
  --primitive-gold-600: #9a7b42;

  --primitive-border-100: #e3d5c1;
  --primitive-border-200: #d7c5a8;
  --primitive-border-300: #ccb892;
  --primitive-border-400: #b99b66;

  --primitive-ink-950: #1a1618;
  --primitive-ink-900: #242022;
  --primitive-ink-800: #32282c;
  --primitive-ink-700: #4a3f44;
  --primitive-ink-600: #62585c;
  --primitive-ink-500: #7d7377;

  --primitive-success-700: #31511e;
  --primitive-success-600: #496c3d;
  --primitive-success-bg: #edf4e8;
  --primitive-success-border: #9ab37c;

  --primitive-warning-700: #6f4700;
  --primitive-warning-600: #9a6c28;
  --primitive-warning-bg: #fff4d6;
  --primitive-warning-border: #b98c2f;

  --primitive-danger-800: #7a2626;
  --primitive-danger-700: #8d2e2e;
  --primitive-danger-bg: #fff8f5;
  --primitive-danger-bg-hover: #fff1ed;
  --primitive-danger-border: #c28b83;

  --theme-header-text-ivory: #f5ecdd;
  --theme-header-text-ivory-muted: #e6d8c2;
  --theme-header-border-dark: #241420;
  --theme-notice-success-bg: #f0f6ec;
  --theme-notice-success-border: #d3dfc7;
  --theme-notice-success-text: #2f4f24;
  --theme-notice-error-bg: #fff6f3;
  --theme-notice-error-border: #e7c5bf;
  --theme-notice-warning-bg: #fff8ea;
  --theme-notice-warning-border: #ead7ad;
  --theme-notice-warning-text: #68420e;
  --theme-notice-info-border: #dfcfc0;
  --theme-action-primary-bg-hover: #4c2f47;
  --theme-action-primary-text: #ffffff;
  --theme-action-secondary-border-hover: #aa8f58;
  --theme-action-danger-border-hover: #b85f54;
  --theme-badge-muted-bg: #eee5d7;
  --theme-badge-muted-border: #d6c5aa;
  --theme-badge-muted-text: #6d5c5f;
  --theme-bg-page: #f7f5f3;
  --theme-bg-surface-raised: #faf9f7;
  --theme-border-hover: #aa8f58;
  --theme-border-control: #ccb892;
  --theme-border-control-active: #b99b66;
  --theme-focus-ring: rgba(94, 58, 88, 0.22);
  --theme-focus-ring-subtle: rgba(94, 58, 88, 0.12);
  --theme-focus-ring-medium: rgba(94, 58, 88, 0.28);
  --theme-focus-ring-strong: rgba(94, 58, 88, 0.32);
  --theme-focus-ring-header: rgba(94, 58, 88, 0.6);
  --theme-primary-tint-subtle: rgba(94, 58, 88, 0.07);
  --theme-overlay: rgba(43, 25, 40, 0.48);
  --theme-shadow: rgba(43, 32, 36, 0.12);
  --theme-shadow-strong: rgba(43, 32, 36, 0.22);
  --theme-control-bg-soft: #faf9f7;
  --theme-control-bg-hover: #f0ebe6;
  --theme-control-bg-active: #ebe4dc;
  --theme-control-bg-disabled: #e8e2da;
  --theme-control-text-emphasis: #3b2a31;
  --theme-control-text-active: #4a2c45;
  --theme-terminal-bg: #111827;
  --theme-terminal-text: #e5e7eb;
  --theme-terminal-border: #1f2937;
}

[data-theme="liturgical"] {
  color-scheme: light;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  --search-highlight-bg: rgba(201, 149, 88, 0.28);
  --search-highlight-text: #2b1b15;
  --search-highlight-border: rgba(170, 120, 60, 0.5);
  --primitive-burgundy-950: #4f1420;
  --primitive-burgundy-900: #6E1E2D;
  --primitive-burgundy-800: #7f2a39;
  --primitive-burgundy-700: #923a48;
  --primitive-burgundy-600: #a64f5b;

  --primitive-parchment-50: #fffdf8;
  --primitive-parchment-100: #F5EFE0;
  --primitive-parchment-150: #f1e8d5;
  --primitive-parchment-200: #eadfc8;
  --primitive-parchment-250: #e1d4ba;
  --primitive-parchment-300: #d8c8aa;
  --primitive-parchment-400: #cbb68d;
  --primitive-parchment-500: #B89B5E;

  --primitive-gold-400: #B89B5E;
  --primitive-gold-500: #a98b4f;
  --primitive-gold-600: #92743d;

  --primitive-border-100: #e5d8bf;
  --primitive-border-200: #d8c7a8;
  --primitive-border-300: #c9b58e;
  --primitive-border-400: #B89B5E;

  --primitive-ink-950: #1e1a14;
  --primitive-ink-900: #2e2418;
  --primitive-ink-800: #3d3124;
  --primitive-ink-700: #524436;
  --primitive-ink-600: #6a5c4c;
  --primitive-ink-500: #877864;

  --primitive-success-700: #31511e;
  --primitive-success-600: #507438;
  --primitive-success-bg: #edf5e6;
  --primitive-success-border: #9ab37c;

  --primitive-warning-700: #6f4700;
  --primitive-warning-600: #9a6c28;
  --primitive-warning-bg: #fff4d6;
  --primitive-warning-border: #B89B5E;

  --primitive-danger-800: #6E1E2D;
  --primitive-danger-700: #8d2e2e;
  --primitive-danger-bg: #fff8f5;
  --primitive-danger-bg-hover: #fff1ed;
  --primitive-danger-border: #c28b83;

  --theme-header-text-ivory: #f8efdd;
  --theme-header-text-ivory-muted: #ead8ba;
  --theme-header-border-dark: #4f1420;
  --theme-notice-success-bg: #edf5e6;
  --theme-notice-success-border: #d4dfc5;
  --theme-notice-success-text: #31511e;
  --theme-notice-error-bg: #fff6f3;
  --theme-notice-error-border: #e7c5bf;
  --theme-notice-warning-bg: #fff4d6;
  --theme-notice-warning-border: #e0c57f;
  --theme-notice-warning-text: #6f4700;
  --theme-notice-info-border: #d8c7a8;
  --theme-action-primary-bg-hover: #7f2a39;
  --theme-action-primary-text: #ffffff;
  --theme-action-secondary-border-hover: #a98b4f;
  --theme-action-danger-border-hover: #b85f54;
  --theme-badge-muted-bg: #f1e8d5;
  --theme-badge-muted-border: #d8c7a8;
  --theme-badge-muted-text: #75624b;
  --theme-bg-page: #f8f4ec;
  --theme-bg-surface-raised: #fffdf8;
  --theme-border-hover: #a98b4f;
  --theme-border-control: #c9b58e;
  --theme-border-control-active: #B89B5E;
  --theme-focus-ring: rgba(146, 58, 72, 0.22);
  --theme-focus-ring-subtle: rgba(146, 58, 72, 0.12);
  --theme-focus-ring-medium: rgba(146, 58, 72, 0.28);
  --theme-focus-ring-strong: rgba(146, 58, 72, 0.32);
  --theme-focus-ring-header: rgba(146, 58, 72, 0.6);
  --theme-primary-tint-subtle: rgba(146, 58, 72, 0.07);
  --theme-overlay: rgba(30, 27, 24, 0.48);
  --theme-shadow: rgba(59, 42, 26, 0.12);
  --theme-shadow-strong: rgba(59, 42, 26, 0.22);
  --theme-control-bg-soft: #fffdf8;
  --theme-control-bg-hover: #f0e8d8;
  --theme-control-bg-active: #ebe2d0;
  --theme-control-bg-disabled: #e8e0d0;
  --theme-control-text-emphasis: #3d3124;
  --theme-control-text-active: #6E1E2D;
  --theme-terminal-bg: #111827;
  --theme-terminal-text: #e5e7eb;
  --theme-terminal-border: #1f2937;
}

[data-theme="monastic"] {
  color-scheme: light;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  --search-highlight-bg: rgba(160, 140, 80, 0.3);
  --search-highlight-text: #2f3f33;
  --search-highlight-border: rgba(120, 100, 55, 0.5);
  --primitive-burgundy-950: #2f3f33;
  --primitive-burgundy-900: #3F5A45;
  --primitive-burgundy-800: #4c6a52;
  --primitive-burgundy-700: #5d7b63;
  --primitive-burgundy-600: #6f8d74;

  --primitive-parchment-50: #fffdf8;
  --primitive-parchment-100: #F6F1E7;
  --primitive-parchment-150: #f0e8dc;
  --primitive-parchment-200: #e8dece;
  --primitive-parchment-250: #dfd2bf;
  --primitive-parchment-300: #d5c5ae;
  --primitive-parchment-400: #c4ae8d;
  --primitive-parchment-500: #B58B4A;

  --primitive-gold-400: #B58B4A;
  --primitive-gold-500: #a47c3e;
  --primitive-gold-600: #8d6934;

  --primitive-border-100: #e4ddd2;
  --primitive-border-200: #d8cfc2;
  --primitive-border-300: #c8bdb0;
  --primitive-border-400: #B58B4A;

  --primitive-ink-950: #1f1812;
  --primitive-ink-900: #2c2318;
  --primitive-ink-800: #3d3126;
  --primitive-ink-700: #52483c;
  --primitive-ink-600: #6a6054;
  --primitive-ink-500: #857b70;

  --primitive-success-700: #2f3f33;
  --primitive-success-600: #3F5A45;
  --primitive-success-bg: #e9efe8;
  --primitive-success-border: #94a88f;

  --primitive-warning-700: #6d4a18;
  --primitive-warning-600: #8d6934;
  --primitive-warning-bg: #f5ecd8;
  --primitive-warning-border: #B58B4A;

  --primitive-danger-800: #7a2626;
  --primitive-danger-700: #8f2f2f;
  --primitive-danger-bg: #fff8f5;
  --primitive-danger-bg-hover: #fff1ed;
  --primitive-danger-border: #c28b83;

  --theme-header-text-ivory: #f7efdf;
  --theme-header-text-ivory-muted: #e4d6bd;
  --theme-header-border-dark: #2f3f33;
  --theme-notice-success-bg: #e9efe8;
  --theme-notice-success-border: #c7d5c2;
  --theme-notice-success-text: #2f3f33;
  --theme-notice-error-bg: #fff6f3;
  --theme-notice-error-border: #e7c5bf;
  --theme-notice-warning-bg: #f5ecd8;
  --theme-notice-warning-border: #d8bd82;
  --theme-notice-warning-text: #6d4a18;
  --theme-notice-info-border: #d3c4b0;
  --theme-action-primary-bg-hover: #4c6a52;
  --theme-action-primary-text: #ffffff;
  --theme-action-secondary-border-hover: #a47c3e;
  --theme-action-danger-border-hover: #b85f54;
  --theme-badge-muted-bg: #f0e8dc;
  --theme-badge-muted-border: #d3c4b0;
  --theme-badge-muted-text: #7b6653;
  --theme-bg-page: #f4f2ec;
  --theme-bg-surface-raised: #faf8f4;
  --theme-border-hover: #a47c3e;
  --theme-border-control: #c0ae95;
  --theme-border-control-active: #B58B4A;
  --theme-focus-ring: rgba(93, 123, 99, 0.22);
  --theme-focus-ring-subtle: rgba(93, 123, 99, 0.12);
  --theme-focus-ring-medium: rgba(93, 123, 99, 0.28);
  --theme-focus-ring-strong: rgba(93, 123, 99, 0.32);
  --theme-focus-ring-header: rgba(93, 123, 99, 0.6);
  --theme-primary-tint-subtle: rgba(93, 123, 99, 0.07);
  --theme-overlay: rgba(38, 27, 19, 0.48);
  --theme-shadow: rgba(61, 44, 32, 0.12);
  --theme-shadow-strong: rgba(61, 44, 32, 0.22);
  --theme-control-bg-soft: #faf8f4;
  --theme-control-bg-hover: #ede8de;
  --theme-control-bg-active: #e6e0d4;
  --theme-control-bg-disabled: #e4ded4;
  --theme-control-text-emphasis: #3d3126;
  --theme-control-text-active: #3F5A45;
  --theme-terminal-bg: #111827;
  --theme-terminal-text: #e5e7eb;
  --theme-terminal-border: #1f2937;
}

[data-theme="patriarchal"] {
  color-scheme: light;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  --search-highlight-bg: rgba(232, 184, 64, 0.35);
  --search-highlight-text: #1a1018;
  --search-highlight-border: rgba(200, 150, 40, 0.6);
  --primitive-burgundy-950: #2f1633;
  --primitive-burgundy-900: #4B254F;
  --primitive-burgundy-800: #5d3261;
  --primitive-burgundy-700: #704173;
  --primitive-burgundy-600: #86568a;

  --primitive-parchment-50: #fffdf8;
  --primitive-parchment-100: #EFE1BD;
  --primitive-parchment-150: #ead8ac;
  --primitive-parchment-200: #e3cd98;
  --primitive-parchment-250: #dac082;
  --primitive-parchment-300: #d0b26c;
  --primitive-parchment-400: #C6A14A;
  --primitive-parchment-500: #b88f35;

  --primitive-gold-400: #C6A14A;
  --primitive-gold-500: #b88f35;
  --primitive-gold-600: #9e7628;

  --primitive-border-100: #e4d5b4;
  --primitive-border-200: #d5c092;
  --primitive-border-300: #C6A14A;
  --primitive-border-400: #b88f35;

  --primitive-ink-950: #1a1816;
  --primitive-ink-900: #242220;
  --primitive-ink-800: #2e2c28;
  --primitive-ink-700: #45423c;
  --primitive-ink-600: #5e5a54;
  --primitive-ink-500: #78746c;

  --primitive-success-700: #31511e;
  --primitive-success-600: #496c3d;
  --primitive-success-bg: #edf4e8;
  --primitive-success-border: #9ab37c;

  --primitive-warning-700: #6f4700;
  --primitive-warning-600: #9e7628;
  --primitive-warning-bg: #fff4d6;
  --primitive-warning-border: #C6A14A;

  --primitive-danger-800: #7a2626;
  --primitive-danger-700: #8d2e2e;
  --primitive-danger-bg: #fff8f5;
  --primitive-danger-bg-hover: #fff1ed;
  --primitive-danger-border: #c28b83;

  --theme-header-text-ivory: #f8edcc;
  --theme-header-text-ivory-muted: #e6d09b;
  --theme-header-border-dark: #2f1633;
  --theme-notice-success-bg: #edf4e8;
  --theme-notice-success-border: #d3dfc7;
  --theme-notice-success-text: #31511e;
  --theme-notice-error-bg: #fff6f3;
  --theme-notice-error-border: #e7c5bf;
  --theme-notice-warning-bg: #fff4d6;
  --theme-notice-warning-border: #e3c376;
  --theme-notice-warning-text: #6f4700;
  --theme-notice-info-border: #d5c092;
  --theme-action-primary-bg-hover: #5d3261;
  --theme-action-primary-text: #ffffff;
  --theme-action-secondary-border-hover: #b88f35;
  --theme-action-danger-border-hover: #b85f54;
  --theme-badge-muted-bg: #ead8ac;
  --theme-badge-muted-border: #d5c092;
  --theme-badge-muted-text: #4e5c75;
  --theme-bg-page: #f2ead6;
  --theme-bg-surface-raised: #faf6ec;
  --theme-border-hover: #b88f35;
  --theme-border-control: #C6A14A;
  --theme-border-control-active: #b88f35;
  --theme-focus-ring: rgba(112, 65, 115, 0.22);
  --theme-focus-ring-subtle: rgba(112, 65, 115, 0.12);
  --theme-focus-ring-medium: rgba(112, 65, 115, 0.28);
  --theme-focus-ring-strong: rgba(112, 65, 115, 0.32);
  --theme-focus-ring-header: rgba(112, 65, 115, 0.6);
  --theme-primary-tint-subtle: rgba(112, 65, 115, 0.07);
  --theme-overlay: rgba(27, 28, 32, 0.48);
  --theme-shadow: rgba(43, 43, 43, 0.12);
  --theme-shadow-strong: rgba(43, 43, 43, 0.22);
  --theme-control-bg-soft: #faf6ec;
  --theme-control-bg-hover: #ebe0c4;
  --theme-control-bg-active: #e4d8b8;
  --theme-control-bg-disabled: #e0d4b4;
  --theme-control-text-emphasis: #2e2c28;
  --theme-control-text-active: #4B254F;
  --theme-terminal-bg: #111827;
  --theme-terminal-text: #e5e7eb;
  --theme-terminal-border: #1f2937;
}

:root,
[data-theme="modern"],
[data-theme="byzantine"],
[data-theme="deep-plum"],
[data-theme="liturgical"],
[data-theme="monastic"],
[data-theme="patriarchal"] {
  /* Lexical search match highlight (overridden per reading theme below). */
  --search-highlight-bg: rgba(201, 149, 72, 0.28);
  --search-highlight-text: var(--primitive-ink-950);
  --search-highlight-border: rgba(154, 122, 54, 0.55);

  /* Compatibility variables retained for existing component styles. */
  --header-burgundy-900: var(--primitive-burgundy-900);
  --header-burgundy-800: var(--primitive-burgundy-800);
  --header-burgundy-700: var(--primitive-burgundy-700);
  --header-parchment-100: var(--primitive-parchment-300);
  --header-parchment-200: var(--primitive-parchment-400);
  --header-parchment-300: var(--primitive-parchment-500);
  --header-text-ivory: var(--theme-header-text-ivory);
  --header-text-ivory-muted: var(--theme-header-text-ivory-muted);
  --header-text-dark: var(--primitive-ink-900);
  --header-border-dark: var(--theme-header-border-dark);
  --header-border-light: var(--primitive-gold-500);
  --header-focus: var(--primitive-burgundy-700);
  --notice-bg: var(--primitive-parchment-100);
  --notice-border: var(--primitive-border-200);
  --notice-text: var(--primitive-ink-800);
  --notice-muted: var(--primitive-ink-600);
  --notice-success: var(--theme-notice-success-accent, var(--reading-link));
  --notice-success-bg: var(--theme-notice-success-bg);
  --notice-success-border: var(--theme-notice-success-border);
  --notice-success-text: var(--theme-notice-success-text);
  --notice-success-link: var(--theme-notice-success-link, var(--reading-link));
  --notice-error: var(--theme-notice-error-accent, var(--primitive-danger-700));
  --notice-error-bg: var(--theme-notice-error-bg);
  --notice-error-border: var(--theme-notice-error-border);
  --notice-error-text: var(--theme-notice-error-text, var(--primitive-burgundy-950));
  --notice-error-link: var(--theme-notice-error-link, var(--reading-link));
  --notice-warning: var(--theme-notice-warning-accent, var(--primitive-warning-600));
  --notice-warning-bg: var(--theme-notice-warning-bg);
  --notice-warning-border: var(--theme-notice-warning-border);
  --notice-warning-text: var(--theme-notice-warning-text);
  --notice-warning-link: var(--theme-notice-warning-link, var(--reading-link));
  --notice-info: var(--theme-notice-info-accent, var(--reading-link));
  --notice-info-bg: var(--theme-notice-info-bg, var(--notice-bg));
  --notice-info-border: var(--theme-notice-info-border);
  --notice-info-text: var(--theme-notice-info-text, var(--notice-text));
  --notice-info-link: var(--theme-notice-info-link, var(--reading-link));
  --action-primary-bg: var(--primitive-burgundy-700);
  --action-primary-bg-hover: var(--theme-action-primary-bg-hover);
  --action-primary-border: var(--primitive-burgundy-700);
  --action-primary-text: var(--theme-action-primary-text);
  --action-secondary-bg: var(--theme-action-secondary-bg, var(--primitive-parchment-200));
  --action-secondary-bg-hover: var(--theme-action-secondary-bg-hover, var(--primitive-parchment-250));
  --action-secondary-bg-active: var(--color-control-bg-active);
  --action-secondary-border: var(--theme-action-secondary-border, var(--primitive-gold-400));
  --action-secondary-border-hover: var(--theme-action-secondary-border-hover, var(--action-secondary-border));
  --action-secondary-text: var(--theme-action-secondary-text, var(--primitive-ink-900));
  --action-danger-bg: var(--primitive-danger-bg);
  --action-danger-bg-hover: var(--primitive-danger-bg-hover);
  --action-danger-border: var(--primitive-danger-border);
  --action-danger-border-hover: var(--theme-action-danger-border-hover);
  --action-danger-text: var(--primitive-danger-800);
  --action-danger-text-hover: var(--primitive-burgundy-950);
  --badge-bg: var(--primitive-parchment-200);
  --badge-border: var(--primitive-border-300);
  --badge-text: var(--primitive-ink-900);
  --badge-success-bg: var(--notice-success-bg);
  --badge-success-border: var(--notice-success-border);
  --badge-success-text: var(--notice-success-text);
  --badge-warning-bg: var(--notice-warning-bg);
  --badge-warning-border: var(--notice-warning-border);
  --badge-warning-text: var(--notice-warning-text);
  --badge-muted-bg: var(--theme-badge-muted-bg);
  --badge-muted-border: var(--theme-badge-muted-border);
  --badge-muted-text: var(--theme-badge-muted-text);

  /* Semantic color tokens for future theme palettes. */
  --color-primary-950: var(--primitive-burgundy-950);
  --color-primary-900: var(--header-burgundy-900);
  --color-primary-800: var(--header-burgundy-800);
  --color-primary-700: var(--header-burgundy-700);
  --color-primary-600: var(--primitive-burgundy-600);

  --color-accent-100: var(--header-parchment-100);
  --color-accent-200: var(--header-parchment-200);
  --color-accent-300: var(--header-parchment-300);
  --color-accent-gold: var(--primitive-gold-600);

  --color-bg-page: var(--theme-bg-page);
  --color-bg-surface: var(--primitive-parchment-50);
  --color-bg-surface-muted: var(--primitive-parchment-100);
  --color-bg-surface-raised: var(--theme-bg-surface-raised);

  --color-text: var(--notice-text);
  --color-text-strong: var(--header-text-dark);
  --color-text-muted: var(--notice-muted);
  --color-text-subtle: var(--primitive-ink-500);
  --color-text-inverse: var(--header-text-ivory);
  --color-text-inverse-muted: var(--header-text-ivory-muted);
  --color-text-brand: var(--header-burgundy-900);

  --color-border: var(--notice-border);
  --color-border-muted: var(--primitive-border-100);
  --color-border-strong: var(--action-secondary-border);
  --color-border-hover: var(--theme-border-hover);
  --color-border-brand: var(--header-burgundy-700);
  --color-border-control: var(--theme-border-control);
  --color-border-control-active: var(--theme-border-control-active);

  --color-focus: var(--header-focus);
  --color-focus-ring: var(--theme-focus-ring);
  --color-focus-ring-subtle: var(--theme-focus-ring-subtle);
  --color-focus-ring-medium: var(--theme-focus-ring-medium);
  --color-focus-ring-strong: var(--theme-focus-ring-strong);
  --color-focus-ring-header: var(--theme-focus-ring-header);
  --color-primary-tint-subtle: var(--theme-primary-tint-subtle);

  /* Site chrome — global header + primary navigation (theme-safe). */
  --site-header-bg: var(--color-primary-900);
  --site-header-bg-accent: var(--color-primary-800);
  --site-header-text: var(--color-text-inverse);
  --site-header-muted: var(--color-text-inverse-muted);
  --site-header-border: var(--header-border-dark);
  --site-header-divider: var(--header-border-dark);
  --site-nav-bg: var(--color-accent-100);
  --site-nav-text: var(--color-text-strong);
  --site-nav-muted: var(--color-text-muted);
  --site-nav-logout: var(--color-text);
  --site-nav-hover-bg: var(--color-primary-tint-subtle);
  --site-nav-hover-text: var(--color-primary-900);
  --site-nav-active-text: var(--color-primary-900);
  --site-nav-active-bg: var(--color-primary-tint-subtle);
  --site-nav-active-indicator: var(--color-primary-700);
  --site-nav-active-indicator-thickness: 1.5px;
  --site-nav-border: var(--color-border-muted);
  --site-nav-focus: var(--color-focus);
  --site-nav-account-divider: var(--color-border-muted);
  --site-nav-panel-bg: var(--color-bg-surface);
  --site-nav-toggle-bg: var(--color-bg-surface-muted);
  --site-nav-toggle-border: var(--color-border-muted);
  --site-nav-toggle-icon: var(--color-primary-900);

  /* Site chrome — global footer (theme-safe). */
  --site-footer-bg: var(--color-bg-surface-muted);
  --site-footer-fg: var(--color-text);
  --site-footer-muted: var(--color-text-muted);
  --site-footer-heading: var(--color-text-brand);
  --site-footer-link: var(--color-text-brand);
  --site-footer-link-hover: var(--color-primary-700);
  --site-footer-border: var(--color-border-muted);
  --site-footer-trust-bg: var(--color-control-bg-soft);
  --site-footer-focus: var(--color-focus-ring-strong);
  --site-footer-copyright: var(--color-text-subtle);

  --color-success: var(--notice-success);
  --color-success-bg: var(--notice-success-bg);
  --color-success-border: var(--notice-success-border);
  --color-success-text: var(--notice-success-text);

  --color-warning: var(--notice-warning);
  --color-warning-bg: var(--notice-warning-bg);
  --color-warning-border: var(--notice-warning-border);
  --color-warning-text: var(--notice-warning-text);

  --color-danger: var(--notice-error);
  --color-danger-bg: var(--action-danger-bg);
  --color-danger-bg-hover: var(--action-danger-bg-hover);
  --color-danger-border: var(--action-danger-border);
  --color-danger-text: var(--action-danger-text);

  --color-info: var(--notice-info);

  --color-overlay: var(--theme-overlay);
  --color-shadow: var(--theme-shadow);
  --color-shadow-strong: var(--theme-shadow-strong);

  --color-control-bg: var(--primitive-parchment-50);
  --color-control-bg-soft: var(--theme-control-bg-soft);
  --color-control-bg-muted: var(--primitive-parchment-100);
  --color-control-bg-hover: var(--theme-control-bg-hover);
  --color-control-bg-active: var(--theme-control-bg-active);
  --color-control-bg-disabled: var(--theme-control-bg-disabled);
  --color-control-text: var(--color-text-strong);
  --color-control-text-muted: var(--primitive-ink-600);
  --color-control-text-emphasis: var(--theme-control-text-emphasis);
  --color-control-text-active: var(--theme-control-text-active);
  --color-control-border: var(--color-border-control);
  --color-control-border-hover: var(--color-border-hover);

  --action-disabled-bg: var(--color-control-bg-disabled);
  --action-disabled-text: var(--color-control-text-muted);
  --action-disabled-border: var(--color-border-muted);

  --color-terminal-bg: var(--theme-terminal-bg);
  --color-terminal-text: var(--theme-terminal-text);
  --color-terminal-border: var(--theme-terminal-border);

  /* Reading-first semantic tokens (aliases over primitives/theme slots). */
  --reading-page-bg: var(--theme-bg-page);
  --reading-surface-bg: var(--primitive-parchment-50);
  --reading-surface-muted-bg: var(--primitive-parchment-100);
  --reading-text-strong: var(--primitive-ink-950);
  --reading-text: var(--primitive-ink-900);
  --reading-title: var(--primitive-burgundy-900);
  --reading-translation: var(--primitive-ink-700);
  --reading-muted: var(--primitive-ink-600);
  --reading-link: var(--primitive-burgundy-800);
  --reading-border: var(--primitive-border-100);
  --reading-progress-track: var(--primitive-parchment-300);
  --reading-selection-bg: var(--theme-primary-tint-subtle);
  --reading-selection-text: var(--primitive-ink-950);
}

/* Per-preset reading palettes and harmonized chrome (injected into styles.css). */

/* --- modern · Καθαρό (clean light) --- */
[data-theme="modern"] {
  color-scheme: light;
  --theme-bg-page: #fbfaf7;
  --theme-bg-surface-raised: #ffffff;
  --theme-control-bg-soft: #ffffff;
  --theme-control-bg-hover: #f4f1ea;
  --theme-control-bg-active: #ece8df;
  --theme-control-bg-disabled: #e8e4db;
  --primitive-parchment-50: #ffffff;
  --primitive-parchment-100: #f4f1ea;
  --primitive-parchment-150: #ece8df;
  --primitive-parchment-200: #e4dfd4;
  --primitive-parchment-250: #dbd5c9;
  --primitive-parchment-300: #d2cbbf;
  --primitive-border-100: #ddd6ca;
  --primitive-border-200: #cfc6b8;
  --primitive-border-300: #c0b6a6;
  --primitive-ink-950: #1c1814;
  --primitive-ink-900: #302922;
  --primitive-ink-800: #3d352c;
  --primitive-ink-700: #5f554a;
  --primitive-ink-600: #756a5e;
  --primitive-ink-500: #8f8578;
  --primitive-burgundy-950: #5a1412;
  --primitive-burgundy-900: #6f1d1b;
  --primitive-burgundy-800: #7f2a27;
  --primitive-burgundy-700: #8f3a36;
  --primitive-burgundy-600: #a04a45;
  --primitive-gold-400: #b8a67a;
  --primitive-gold-500: #a99562;
  --primitive-gold-600: #8f7d4a;
  --theme-header-border-dark: #5a1412;
  --theme-header-text-ivory: #f8f4ee;
  --theme-header-text-ivory-muted: #e8dfd0;
  --theme-badge-muted-bg: #f0ebe2;
  --theme-badge-muted-border: #d8d0c2;
  --theme-badge-muted-text: #5f554a;
  --theme-notice-success-bg: #e6edf2;
  --theme-notice-success-border: #b8c8cc;
  --theme-notice-success-text: #2a4538;
  --theme-notice-success-accent: #4a7058;
  --theme-notice-success-link: #355745;
  --theme-notice-info-bg: #eef1f4;
  --theme-notice-info-text: #302922;
  --theme-notice-info-border: #c8d0d8;
  --theme-notice-info-accent: #6f1d1b;
  --theme-notice-info-link: #7f2a27;
  --theme-notice-error-bg: #fdf3f0;
  --theme-notice-error-border: #d8b8b0;
  --theme-notice-error-text: #5a1412;
  --theme-notice-error-accent: #8f3a36;
  --theme-notice-error-link: #7f2a27;
  --theme-notice-warning-bg: #faf4e6;
  --theme-notice-warning-border: #dcc998;
  --theme-notice-warning-text: #5c4218;
  --theme-notice-warning-accent: #9a6c28;
  --theme-notice-warning-link: #7a5020;
  --theme-focus-ring: rgba(111, 29, 27, 0.22);
  --theme-focus-ring-subtle: rgba(111, 29, 27, 0.1);
  --theme-focus-ring-medium: rgba(111, 29, 27, 0.28);
  --theme-focus-ring-strong: rgba(111, 29, 27, 0.34);
  --theme-focus-ring-header: rgba(111, 29, 27, 0.55);
  --theme-primary-tint-subtle: rgba(111, 29, 27, 0.07);
  --theme-shadow: rgba(28, 24, 20, 0.1);
  --theme-shadow-strong: rgba(28, 24, 20, 0.18);
  --reading-page-bg: #fbfaf7;
  --reading-surface-bg: #ffffff;
  --reading-surface-muted-bg: #f4f1ea;
  --reading-text-strong: #1c1814;
  --reading-text: #302922;
  --reading-translation: #5f554a;
  --reading-title: #6f1d1b;
  --reading-muted: #756a5e;
  --reading-link: #7f2a27;
  --reading-border: #ddd6ca;
  --reading-progress-track: #d2cbbf;
  --reading-selection-bg: rgba(111, 29, 27, 0.14);
  --reading-selection-text: #1c1814;
}

/* --- byzantine · Περγαμηνή (warm parchment) --- */
[data-theme="byzantine"] {
  color-scheme: light;
  --theme-bg-page: #e9d7ad;
  --theme-bg-surface-raised: #f2e3bf;
  --theme-control-bg-soft: #f2e3bf;
  --theme-control-bg-hover: #e8d5a8;
  --theme-control-bg-active: #ddc797;
  --theme-control-bg-disabled: #d4be8a;
  --primitive-parchment-50: #f2e3bf;
  --primitive-parchment-100: #ddc797;
  --primitive-parchment-150: #d4be8a;
  --primitive-parchment-200: #c9ad78;
  --primitive-parchment-250: #bf9f68;
  --primitive-parchment-300: #b59258;
  --primitive-border-100: #c4a86e;
  --primitive-border-200: #b89a5e;
  --primitive-border-300: #a88a4e;
  --primitive-ink-950: #2a1b10;
  --primitive-ink-900: #3b2819;
  --primitive-ink-800: #4a3422;
  --primitive-ink-700: #66503a;
  --primitive-ink-600: #7a6248;
  --primitive-ink-500: #907658;
  --primitive-burgundy-950: #1f3028;
  --primitive-burgundy-900: #2a4538;
  --primitive-burgundy-800: #355745;
  --primitive-burgundy-700: #426856;
  --primitive-burgundy-600: #4f7a66;
  --primitive-gold-400: #c4a052;
  --primitive-gold-500: #b08e42;
  --primitive-gold-600: #967636;
  --theme-header-border-dark: #1f3028;
  --theme-header-text-ivory: #f5ead0;
  --theme-header-text-ivory-muted: #e6d4ad;
  --theme-badge-muted-bg: #d4be8a;
  --theme-badge-muted-border: #b89a5e;
  --theme-badge-muted-text: #4a3422;
  --theme-notice-success-bg: #d4cdb0;
  --theme-notice-success-border: #a89560;
  --theme-notice-success-text: #2a4538;
  --theme-notice-success-accent: #426856;
  --theme-notice-success-link: #355745;
  --theme-notice-info-bg: #e0d5b8;
  --theme-notice-info-text: #3b2819;
  --theme-notice-info-border: #b89a5e;
  --theme-notice-info-accent: #2a4538;
  --theme-notice-info-link: #355745;
  --theme-notice-error-bg: #f8ece6;
  --theme-notice-error-border: #c8a898;
  --theme-notice-error-text: #4a2824;
  --theme-notice-error-accent: #6c403a;
  --theme-notice-error-link: #5b342f;
  --theme-notice-warning-bg: #f0e0b8;
  --theme-notice-warning-border: #c4a052;
  --theme-notice-warning-text: #5c4218;
  --theme-notice-warning-accent: #967636;
  --theme-notice-warning-link: #7a5020;
  --theme-focus-ring: rgba(53, 87, 69, 0.24);
  --theme-focus-ring-subtle: rgba(53, 87, 69, 0.12);
  --theme-focus-ring-medium: rgba(53, 87, 69, 0.3);
  --theme-focus-ring-strong: rgba(53, 87, 69, 0.36);
  --theme-focus-ring-header: rgba(53, 87, 69, 0.55);
  --theme-primary-tint-subtle: rgba(53, 87, 69, 0.1);
  --theme-shadow: rgba(42, 27, 16, 0.14);
  --theme-shadow-strong: rgba(42, 27, 16, 0.22);
  --reading-page-bg: #e9d7ad;
  --reading-surface-bg: #f2e3bf;
  --reading-surface-muted-bg: #ddc797;
  --reading-text-strong: #2a1b10;
  --reading-text: #3b2819;
  --reading-translation: #66503a;
  --reading-title: #4f3420;
  --reading-muted: #7a6248;
  --reading-link: #355745;
  --reading-border: #c4a86e;
  --reading-progress-track: #b59258;
  --reading-selection-bg: rgba(79, 52, 32, 0.18);
  --reading-selection-text: #2a1b10;
}

/* --- deep-plum · Σέπια (warm sepia) --- */
[data-theme="deep-plum"] {
  color-scheme: light;
  --theme-bg-page: #d8c6a2;
  --theme-bg-surface-raised: #e6d5b2;
  --theme-control-bg-soft: #e6d5b2;
  --theme-control-bg-hover: #dbc498;
  --theme-control-bg-active: #cfb98e;
  --theme-control-bg-disabled: #c4ae82;
  --primitive-parchment-50: #e6d5b2;
  --primitive-parchment-100: #cfb98e;
  --primitive-parchment-150: #c4ae82;
  --primitive-parchment-200: #b8a074;
  --primitive-parchment-250: #ad9368;
  --primitive-parchment-300: #a2875c;
  --primitive-border-100: #b59a6e;
  --primitive-border-200: #a88e62;
  --primitive-border-300: #9a8056;
  --primitive-ink-950: #2b2118;
  --primitive-ink-900: #403226;
  --primitive-ink-800: #4f3f30;
  --primitive-ink-700: #6b5745;
  --primitive-ink-600: #7f6a56;
  --primitive-ink-500: #948068;
  --primitive-burgundy-950: #4a2824;
  --primitive-burgundy-900: #5b342f;
  --primitive-burgundy-800: #6c403a;
  --primitive-burgundy-700: #7d4c44;
  --primitive-burgundy-600: #8e584e;
  --primitive-gold-400: #a88a52;
  --primitive-gold-500: #967848;
  --primitive-gold-600: #82663c;
  --theme-header-border-dark: #4a2824;
  --theme-header-text-ivory: #f2e6d0;
  --theme-header-text-ivory-muted: #e0cfb0;
  --theme-badge-muted-bg: #c4ae82;
  --theme-badge-muted-border: #a88e62;
  --theme-badge-muted-text: #4f3f30;
  --theme-notice-success-bg: #cfc4a8;
  --theme-notice-success-border: #9a8868;
  --theme-notice-success-text: #3a4a2e;
  --theme-notice-success-accent: #5a6848;
  --theme-notice-success-link: #6c403a;
  --theme-notice-info-bg: #d8c6a2;
  --theme-notice-info-text: #403226;
  --theme-notice-info-border: #a88e62;
  --theme-notice-info-accent: #5b342f;
  --theme-notice-info-link: #6c403a;
  --theme-notice-error-bg: #f4e8e2;
  --theme-notice-error-border: #c8a090;
  --theme-notice-error-text: #4a2824;
  --theme-notice-error-accent: #7d4c44;
  --theme-notice-error-link: #6c403a;
  --theme-notice-warning-bg: #e8d8a8;
  --theme-notice-warning-border: #a88a52;
  --theme-notice-warning-text: #5a4018;
  --theme-notice-warning-accent: #82663c;
  --theme-notice-warning-link: #6c5030;
  --theme-focus-ring: rgba(91, 52, 47, 0.24);
  --theme-focus-ring-subtle: rgba(91, 52, 47, 0.12);
  --theme-focus-ring-medium: rgba(91, 52, 47, 0.3);
  --theme-focus-ring-strong: rgba(91, 52, 47, 0.36);
  --theme-focus-ring-header: rgba(91, 52, 47, 0.55);
  --theme-primary-tint-subtle: rgba(91, 52, 47, 0.1);
  --theme-shadow: rgba(43, 33, 24, 0.14);
  --theme-shadow-strong: rgba(43, 33, 24, 0.22);
  --reading-page-bg: #d8c6a2;
  --reading-surface-bg: #e6d5b2;
  --reading-surface-muted-bg: #cfb98e;
  --reading-text-strong: #2b2118;
  --reading-text: #403226;
  --reading-translation: #6b5745;
  --reading-title: #5b342f;
  --reading-muted: #7f6a56;
  --reading-link: #6c403a;
  --reading-border: #b59a6e;
  --reading-progress-track: #a2875c;
  --reading-selection-bg: rgba(91, 52, 47, 0.18);
  --reading-selection-text: #2b2118;
}

/* --- liturgical · Σκούρο χειρόγραφο (dark brown manuscript) --- */
[data-theme="liturgical"] {
  color-scheme: dark;
  --theme-bg-page: #2b1b15;
  --theme-bg-surface-raised: #34231c;
  --theme-control-bg-soft: #34231c;
  --theme-control-bg-hover: #3c2a22;
  --search-highlight-bg: rgba(221, 178, 124, 0.34);
  --search-highlight-text: #f0e4d6;
  --search-highlight-border: rgba(232, 196, 146, 0.65);
  --theme-control-bg-active: #443228;
  --theme-control-bg-disabled: #3a2820;
  --primitive-parchment-50: #34231c;
  --primitive-parchment-100: #3c2a22;
  --primitive-parchment-150: #443228;
  --primitive-parchment-200: #4c3a2e;
  --primitive-parchment-250: #544234;
  --primitive-parchment-300: #5c4a3a;
  --primitive-border-100: #5a4034;
  --primitive-border-200: #654838;
  --primitive-border-300: #70503c;
  --primitive-ink-950: #f0e4d6;
  --primitive-ink-900: #e2d3c4;
  --primitive-ink-800: #d4c4b4;
  --primitive-ink-700: #c8b5a5;
  --primitive-ink-600: #aa9587;
  --primitive-ink-500: #8f7d70;
  --primitive-burgundy-950: #c99558;
  --primitive-burgundy-900: #ddb27c;
  --primitive-burgundy-800: #e8c492;
  --primitive-burgundy-700: #f2d2ad;
  --primitive-burgundy-600: #f5ddb8;
  --primitive-gold-400: #c99558;
  --primitive-gold-500: #ddb27c;
  --primitive-gold-600: #e8c492;
  --theme-header-border-dark: #1a100c;
  --theme-header-text-ivory: #f0e4d6;
  --theme-header-text-ivory-muted: #c8b5a5;
  --theme-badge-muted-bg: #3c2a22;
  --theme-badge-muted-border: #5a4034;
  --theme-badge-muted-text: #c8b5a5;
  --theme-notice-success-bg: #2e3a28;
  --theme-notice-success-border: #4a5c42;
  --theme-notice-success-text: #c8d8bc;
  --theme-notice-success-accent: #7a9870;
  --theme-notice-success-link: #ddb27c;
  --theme-notice-info-bg: #34231c;
  --theme-notice-info-text: #e2d3c4;
  --theme-notice-info-border: #5a4034;
  --theme-notice-info-accent: #f2d2ad;
  --theme-notice-info-link: #ddb27c;
  --theme-notice-error-bg: #3a2420;
  --theme-notice-error-border: #6a4038;
  --theme-notice-error-text: #f0d0c8;
  --theme-notice-error-accent: #c89080;
  --theme-notice-error-link: #e8c492;
  --theme-notice-warning-bg: #3a3020;
  --theme-notice-warning-border: #70503c;
  --theme-notice-warning-text: #e8d0a0;
  --theme-notice-warning-accent: #c99558;
  --theme-notice-warning-link: #ddb27c;
  --theme-action-primary-bg-hover: #e8c492;
  --theme-action-primary-text: #2b1b15;
  --theme-action-secondary-bg: #3c2a22;
  --theme-action-secondary-bg-hover: #443228;
  --theme-action-secondary-border: #70503c;
  --theme-action-secondary-text: #e2d3c4;
  --theme-border-control: var(--primitive-border-100);
  --theme-border-control-active: var(--primitive-border-300);
  --theme-control-text-emphasis: var(--primitive-ink-900);
  --theme-control-text-active: var(--primitive-burgundy-900);
  --theme-action-danger-bg: #3a2420;
  --theme-action-danger-bg-hover: #442c26;
  --theme-focus-ring: rgba(242, 210, 173, 0.28);
  --theme-focus-ring-subtle: rgba(242, 210, 173, 0.14);
  --theme-focus-ring-medium: rgba(242, 210, 173, 0.34);
  --theme-focus-ring-strong: rgba(242, 210, 173, 0.42);
  --theme-focus-ring-header: rgba(242, 210, 173, 0.55);
  --theme-primary-tint-subtle: rgba(242, 210, 173, 0.1);
  --theme-shadow: rgba(0, 0, 0, 0.32);
  --theme-shadow-strong: rgba(0, 0, 0, 0.48);
  --theme-overlay: rgba(0, 0, 0, 0.62);
  --reading-page-bg: #2b1b15;
  --reading-surface-bg: #34231c;
  --reading-surface-muted-bg: #3c2a22;
  --reading-text-strong: #f0e4d6;
  --reading-text: #e2d3c4;
  --reading-translation: #c8b5a5;
  --reading-title: #f2d2ad;
  --reading-muted: #aa9587;
  --reading-link: #ddb27c;
  --reading-border: #5a4034;
  --reading-progress-track: #4c3a2e;
  --reading-selection-bg: #70432d;
  --reading-selection-text: #fff7ed;
  --site-header-bg: var(--reading-page-bg);
  --site-header-bg-accent: var(--reading-surface-muted-bg);
  --site-header-text: var(--reading-text-strong);
  --site-header-muted: var(--reading-translation);
  --site-header-border: var(--reading-border);
  --site-header-divider: var(--reading-border);
  --site-nav-bg: var(--reading-surface-bg);
  --site-nav-text: var(--reading-text);
  --site-nav-muted: var(--reading-muted);
  --site-nav-logout: var(--reading-text);
  --site-nav-hover-bg: var(--theme-primary-tint-subtle);
  --site-nav-hover-text: var(--reading-title);
  --site-nav-active-text: var(--reading-title);
  --site-nav-active-bg: var(--theme-control-bg-hover);
  --site-nav-active-indicator: var(--reading-link);
  --site-nav-border: var(--reading-border);
  --site-nav-focus: var(--reading-link);
  --site-nav-account-divider: var(--reading-border);
  --site-nav-panel-bg: var(--reading-surface-bg);
  --site-nav-toggle-bg: var(--reading-surface-muted-bg);
  --site-nav-toggle-border: var(--reading-border);
  --site-nav-toggle-icon: var(--reading-text-strong);
  --site-footer-bg: var(--reading-surface-muted-bg);
  --site-footer-fg: var(--reading-text);
  --site-footer-muted: var(--reading-muted);
  --site-footer-heading: var(--reading-title);
  --site-footer-link: var(--reading-link);
  --site-footer-link-hover: var(--reading-title);
  --site-footer-border: var(--reading-border);
  --site-footer-trust-bg: var(--reading-surface-bg);
  --site-footer-focus: var(--reading-link);
  --site-footer-copyright: var(--reading-translation);
}

/* --- monastic · Μοναστηριακό (calm open default) --- */
[data-theme="monastic"] {
  color-scheme: light;
  --theme-bg-page: #eef1ea;
  --theme-bg-surface-raised: #f6f8f4;
  --theme-control-bg-soft: #f6f8f4;
  --theme-control-bg-hover: #e6ebe2;
  --theme-control-bg-active: #dde3d8;
  --theme-control-bg-disabled: #d4dace;
  --primitive-parchment-50: #f6f8f4;
  --primitive-parchment-100: #e6ebe2;
  --primitive-parchment-150: #dde3d8;
  --primitive-parchment-200: #d4dace;
  --primitive-parchment-250: #cbd1c4;
  --primitive-parchment-300: #c2c8ba;
  --primitive-border-100: #c8cec0;
  --primitive-border-200: #b8c0b0;
  --primitive-border-300: #a8b2a0;
  --primitive-ink-950: #222018;
  --primitive-ink-900: #342c22;
  --primitive-ink-800: #443a2e;
  --primitive-ink-700: #5c5244;
  --primitive-ink-600: #726858;
  --primitive-ink-500: #8a8070;
  --primitive-burgundy-950: #2a3d30;
  --primitive-burgundy-900: #3f5a45;
  --primitive-burgundy-800: #4c6a52;
  --primitive-burgundy-700: #5a7860;
  --primitive-burgundy-600: #68866e;
  --primitive-gold-400: #a89058;
  --primitive-gold-500: #967e48;
  --primitive-gold-600: #826c3c;
  --theme-header-border-dark: #2a3d30;
  --theme-header-text-ivory: #f2f0e8;
  --theme-header-text-ivory-muted: #d8d4c8;
  --theme-badge-muted-bg: #dde3d8;
  --theme-badge-muted-border: #b8c0b0;
  --theme-badge-muted-text: #5c5244;
  --theme-notice-success-bg: #dde8d8;
  --theme-notice-success-border: #a8b898;
  --theme-notice-success-text: #2a3d30;
  --theme-notice-success-accent: #4c6a52;
  --theme-notice-success-link: #3f5a45;
  --theme-notice-info-bg: #e6ebe2;
  --theme-notice-info-text: #342c22;
  --theme-notice-info-border: #b8c0b0;
  --theme-notice-info-accent: #3f5a45;
  --theme-notice-info-link: #4c6a52;
  --theme-notice-error-bg: #f6eeea;
  --theme-notice-error-border: #c8b0a8;
  --theme-notice-error-text: #4a2824;
  --theme-notice-error-accent: #7a5048;
  --theme-notice-error-link: #5b342f;
  --theme-notice-warning-bg: #ebe4d4;
  --theme-notice-warning-border: #a89058;
  --theme-notice-warning-text: #5a4818;
  --theme-notice-warning-accent: #82663c;
  --theme-notice-warning-link: #6c5030;
  --theme-focus-ring: rgba(63, 90, 69, 0.22);
  --theme-focus-ring-subtle: rgba(63, 90, 69, 0.1);
  --theme-focus-ring-medium: rgba(63, 90, 69, 0.28);
  --theme-focus-ring-strong: rgba(63, 90, 69, 0.34);
  --theme-focus-ring-header: rgba(63, 90, 69, 0.55);
  --theme-primary-tint-subtle: rgba(63, 90, 69, 0.08);
  --theme-shadow: rgba(34, 32, 24, 0.1);
  --theme-shadow-strong: rgba(34, 32, 24, 0.18);
  --reading-page-bg: #eef1ea;
  --reading-surface-bg: #f6f8f4;
  --reading-surface-muted-bg: #e6ebe2;
  --reading-text-strong: #222018;
  --reading-text: #342c22;
  --reading-translation: #5c5244;
  --reading-title: #3f5a45;
  --reading-muted: #726858;
  --reading-link: #4c6a52;
  --reading-border: #c8cec0;
  --reading-progress-track: #c2c8ba;
  --reading-selection-bg: rgba(63, 90, 69, 0.14);
  --reading-selection-text: #222018;
}

/* --- patriarchal · Υψηλή αντίθεση (max contrast dark) --- */
[data-theme="patriarchal"] {
  color-scheme: dark;
  --theme-bg-page: #090909;
  --theme-bg-surface-raised: #111111;
  --theme-control-bg-soft: #111111;
  --theme-control-bg-hover: #191919;
  --search-highlight-bg: rgba(255, 211, 122, 0.28);
  --search-highlight-text: #ffffff;
  --search-highlight-border: rgba(255, 200, 74, 0.75);
  --theme-control-bg-active: #1f1f1f;
  --theme-control-bg-disabled: #151515;
  --primitive-parchment-50: #111111;
  --primitive-parchment-100: #191919;
  --primitive-parchment-150: #1f1f1f;
  --primitive-parchment-200: #252525;
  --primitive-parchment-250: #2b2b2b;
  --primitive-parchment-300: #313131;
  --primitive-border-100: #545454;
  --primitive-border-200: #5e5e5e;
  --primitive-border-300: #686868;
  --primitive-ink-950: #ffffff;
  --primitive-ink-900: #f2f2f2;
  --primitive-ink-800: #e4e4e4;
  --primitive-ink-700: #d0d0d0;
  --primitive-ink-600: #b8b8b8;
  --primitive-ink-500: #9a9a9a;
  --primitive-burgundy-950: #e8b840;
  --primitive-burgundy-900: #ffd37a;
  --primitive-burgundy-800: #ffcf63;
  --primitive-burgundy-700: #ffc84a;
  --primitive-burgundy-600: #f5b830;
  --primitive-gold-400: #ffcf63;
  --primitive-gold-500: #ffd37a;
  --primitive-gold-600: #e8b840;
  --theme-header-border-dark: #000000;
  --theme-header-text-ivory: #ffffff;
  --theme-header-text-ivory-muted: #d0d0d0;
  --theme-badge-muted-bg: #191919;
  --theme-badge-muted-border: #545454;
  --theme-badge-muted-text: #d0d0d0;
  --theme-notice-success-bg: #141a14;
  --theme-notice-success-border: #3a503a;
  --theme-notice-success-text: #b8e0b8;
  --theme-notice-success-accent: #6a986a;
  --theme-notice-success-link: #ffd37a;
  --theme-notice-info-bg: #111111;
  --theme-notice-info-text: #f2f2f2;
  --theme-notice-info-border: #545454;
  --theme-notice-info-accent: #ffd37a;
  --theme-notice-info-link: #ffcf63;
  --theme-notice-error-bg: #1a1010;
  --theme-notice-error-border: #5a2828;
  --theme-notice-error-text: #ffb8b8;
  --theme-notice-error-accent: #ff8080;
  --theme-notice-error-link: #ffd37a;
  --theme-notice-warning-bg: #1a1810;
  --theme-notice-warning-border: #5a4820;
  --theme-notice-warning-text: #ffd37a;
  --theme-notice-warning-accent: #ffc84a;
  --theme-notice-warning-link: #ffcf63;
  --theme-action-primary-bg-hover: #ffc84a;
  --theme-action-primary-text: #090909;
  --theme-action-secondary-bg: #191919;
  --theme-action-secondary-bg-hover: #1f1f1f;
  --theme-action-secondary-border: #686868;
  --theme-action-secondary-text: #f2f2f2;
  --theme-border-control: var(--primitive-border-100);
  --theme-border-control-active: var(--primitive-border-300);
  --theme-control-text-emphasis: var(--primitive-ink-900);
  --theme-control-text-active: var(--primitive-burgundy-900);
  --theme-action-danger-bg: #1a1010;
  --theme-action-danger-bg-hover: #221414;
  --theme-focus-ring: rgba(255, 211, 122, 0.36);
  --theme-focus-ring-subtle: rgba(255, 211, 122, 0.16);
  --theme-focus-ring-medium: rgba(255, 211, 122, 0.42);
  --theme-focus-ring-strong: rgba(255, 211, 122, 0.5);
  --theme-focus-ring-header: rgba(255, 211, 122, 0.6);
  --theme-primary-tint-subtle: rgba(255, 211, 122, 0.1);
  --theme-shadow: rgba(0, 0, 0, 0.5);
  --theme-shadow-strong: rgba(0, 0, 0, 0.72);
  --theme-overlay: rgba(0, 0, 0, 0.8);
  --reading-page-bg: #090909;
  --reading-surface-bg: #111111;
  --reading-surface-muted-bg: #191919;
  --reading-text-strong: #ffffff;
  --reading-text: #f2f2f2;
  --reading-translation: #d0d0d0;
  --reading-title: #ffd37a;
  --reading-muted: #b8b8b8;
  --reading-link: #ffcf63;
  --reading-border: #545454;
  --reading-progress-track: #313131;
  --reading-selection-bg: #f1c45a;
  --reading-selection-text: #000000;
  --site-header-bg: var(--reading-page-bg);
  --site-header-bg-accent: var(--reading-surface-muted-bg);
  --site-header-text: var(--reading-text-strong);
  --site-header-muted: var(--reading-translation);
  --site-header-border: var(--reading-border);
  --site-header-divider: var(--reading-border);
  --site-nav-bg: var(--reading-surface-bg);
  --site-nav-text: var(--reading-text);
  --site-nav-muted: var(--reading-muted);
  --site-nav-logout: var(--reading-text);
  --site-nav-hover-bg: var(--theme-control-bg-hover);
  --site-nav-hover-text: var(--reading-title);
  --site-nav-active-text: var(--reading-title);
  --site-nav-active-bg: var(--theme-control-bg-active);
  --site-nav-active-indicator: var(--reading-link);
  --site-nav-active-indicator-thickness: 2.5px;
  --site-nav-border: var(--reading-border);
  --site-nav-focus: var(--reading-link);
  --site-nav-account-divider: var(--reading-border);
  --site-nav-panel-bg: var(--reading-surface-bg);
  --site-nav-toggle-bg: var(--reading-surface-muted-bg);
  --site-nav-toggle-border: var(--reading-border);
  --site-nav-toggle-icon: var(--reading-text-strong);
  --site-footer-bg: var(--reading-surface-muted-bg);
  --site-footer-fg: var(--reading-text);
  --site-footer-muted: var(--reading-muted);
  --site-footer-heading: var(--reading-title);
  --site-footer-link: var(--reading-link);
  --site-footer-link-hover: var(--reading-title);
  --site-footer-border: var(--reading-border);
  --site-footer-trust-bg: var(--reading-surface-bg);
  --site-footer-focus: var(--reading-link);
  --site-footer-copyright: var(--reading-translation);
}

/* Το «Νυχτερινό» (#141414) δεν αντιστοιχίζεται σε ξεχωριστό key·
   το monastic παραμένει ανοιχτό default (Μοναστηριακό). */

/* Dark theme chrome fixes */
[data-theme="liturgical"] .profile-card,
[data-theme="patriarchal"] .profile-card,
[data-theme="liturgical"] .profile-theme-tile,
[data-theme="patriarchal"] .profile-theme-tile,
[data-theme="liturgical"] .profile-font-tile,
[data-theme="patriarchal"] .profile-font-tile {
  background: var(--reading-surface-bg);
  border-color: var(--reading-border);
  color: var(--reading-text);
  box-shadow: 0 4px 14px var(--theme-shadow);
}

[data-theme="liturgical"] .profile-theme-tile:hover,
[data-theme="patriarchal"] .profile-theme-tile:hover,
[data-theme="liturgical"] .profile-font-tile:hover,
[data-theme="patriarchal"] .profile-font-tile:hover {
  background: var(--reading-surface-muted-bg);
  border-color: var(--reading-link);
}

[data-theme="liturgical"] input,
[data-theme="liturgical"] textarea,
[data-theme="liturgical"] select,
[data-theme="patriarchal"] input,
[data-theme="patriarchal"] textarea,
[data-theme="patriarchal"] select {
  background: var(--reading-surface-muted-bg);
  border-color: var(--reading-border);
  color: var(--reading-text-strong);
}

[data-theme="liturgical"] .search-field input:not([type="checkbox"]):not(:disabled),
[data-theme="liturgical"] .search-field select:not(:disabled),
[data-theme="patriarchal"] .search-field input:not([type="checkbox"]):not(:disabled),
[data-theme="patriarchal"] .search-field select:not(:disabled) {
  background: var(--reading-surface-muted-bg);
  border-color: var(--reading-border);
  color: var(--reading-text-strong);
}

[data-theme="liturgical"] .reader-library-drawer-panel,
[data-theme="patriarchal"] .reader-library-drawer-panel,
[data-theme="liturgical"] .reader-confirm-modal-dialog,
[data-theme="patriarchal"] .reader-confirm-modal-dialog,
[data-theme="liturgical"] .reader-download-modal-dialog,
[data-theme="patriarchal"] .reader-download-modal-dialog {
  background: var(--reading-surface-bg);
  border-color: var(--reading-border);
  color: var(--reading-text);
}

[data-theme="liturgical"] .result-card,
[data-theme="liturgical"] .result-item,
[data-theme="patriarchal"] .result-card,
[data-theme="patriarchal"] .result-item,
[data-theme="liturgical"] .reader-filters-panel,
[data-theme="patriarchal"] .reader-filters-panel,
[data-theme="liturgical"] .reader-work-header-card,
[data-theme="patriarchal"] .reader-work-header-card,
[data-theme="liturgical"] .app-notice:not(.app-notice--success):not(.app-notice--error):not(.app-notice--warning):not(.app-notice--info):not(.success):not(.error):not(.warning):not(.info),
[data-theme="patriarchal"] .app-notice:not(.app-notice--success):not(.app-notice--error):not(.app-notice--warning):not(.app-notice--info):not(.success):not(.error):not(.warning):not(.info) {
  background: var(--reading-surface-bg);
  border-color: var(--reading-border);
  color: var(--reading-text);
}

[data-theme="liturgical"] .result-card:hover,
[data-theme="liturgical"] .result-item:hover,
[data-theme="patriarchal"] .result-card:hover,
[data-theme="patriarchal"] .result-item:hover {
  background: var(--reading-surface-muted-bg);
  border-color: var(--reading-link);
}

[data-theme="liturgical"] .reader-toolbar-actions-menu,
[data-theme="patriarchal"] .reader-toolbar-actions-menu {
  background: var(--reading-surface-bg);
  border-color: var(--reading-border);
}

[data-theme="liturgical"] .profile-theme-tile.is-selected,
[data-theme="liturgical"] .profile-theme-tile[aria-pressed="true"],
[data-theme="patriarchal"] .profile-theme-tile.is-selected,
[data-theme="patriarchal"] .profile-theme-tile[aria-pressed="true"] {
  background: var(--reading-surface-muted-bg);
  border-color: var(--reading-link);
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

body {
  margin: 0;
  background: var(--reading-page-bg);
  color: var(--reading-text);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

::selection {
  background: var(--reading-selection-bg);
  color: var(--reading-selection-text);
}

/* Push the global footer to the bottom on short pages. */
body > main {
  flex: 1 0 auto;
  width: 100%;
}

/* ---------- Unified notices ---------- */

.app-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid var(--notice-border);
  border-left: 3px solid var(--notice-info);
  border-radius: 6px;
  background: var(--notice-bg);
  color: var(--notice-text);
  font-size: 0.9rem;
  line-height: 1.52;
  box-shadow: none;
}

.app-notice:empty,
.app-notice[hidden] {
  display: none !important;
}

.app-notice-icon {
  flex: 0 0 auto;
  display: inline-grid;
  width: 1.25rem;
  height: 1.25rem;
  place-items: center;
  border-radius: 999px;
  color: currentColor;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1;
}

.app-notice-content {
  min-width: 0;
}

.app-notice-content > :first-child {
  margin-top: 0;
}

.app-notice-content > :last-child {
  margin-bottom: 0;
}

.app-notice--success {
  border-color: var(--notice-success-border);
  border-left-color: var(--notice-success);
  background: var(--notice-success-bg);
  color: var(--notice-success-text);
}

.app-notice.success,
.app-notice.is-success {
  border-color: var(--notice-success-border);
  border-left-color: var(--notice-success);
  background: var(--notice-success-bg);
  color: var(--notice-success-text);
}

.app-notice--error {
  border-color: var(--notice-error-border);
  border-left-color: var(--notice-error);
  background: var(--notice-error-bg);
  color: var(--notice-error-text);
}

.app-notice.error,
.app-notice.is-error {
  border-color: var(--notice-error-border);
  border-left-color: var(--notice-error);
  background: var(--notice-error-bg);
  color: var(--notice-error-text);
}

.app-notice--warning {
  border-color: var(--notice-warning-border);
  border-left-color: var(--notice-warning);
  background: var(--notice-warning-bg);
  color: var(--notice-warning-text);
}

.app-notice.warning,
.app-notice.is-warning {
  border-color: var(--notice-warning-border);
  border-left-color: var(--notice-warning);
  background: var(--notice-warning-bg);
  color: var(--notice-warning-text);
}

.app-notice--info {
  border-color: var(--notice-info-border);
  border-left-color: var(--notice-info);
  background: var(--notice-info-bg);
  color: var(--notice-info-text);
}

.app-notice.info,
.app-notice.is-info {
  border-color: var(--notice-info-border);
  border-left-color: var(--notice-info);
  background: var(--notice-info-bg);
  color: var(--notice-info-text);
}

.app-notice a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.14em;
}

.app-notice--success a,
.app-notice.success a,
.app-notice.is-success a {
  color: var(--notice-success-link);
}

.app-notice--error a,
.app-notice.error a,
.app-notice.is-error a {
  color: var(--notice-error-link);
}

.app-notice--warning a,
.app-notice.warning a,
.app-notice.is-warning a {
  color: var(--notice-warning-link);
}

.app-notice--info a,
.app-notice.info a,
.app-notice.is-info a {
  color: var(--notice-info-link);
}

.app-notice a:focus-visible,
.app-notice button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.app-notice--compact {
  margin-bottom: 10px;
  padding: 8px 10px;
  font-size: 0.86rem;
}

/* ---------- Shared actions and badges ---------- */

button,
[type="button"],
[type="submit"],
[type="reset"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  font: inherit;
}

input,
select,
textarea {
  font: inherit;
}

.secondary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  border: 1px solid var(--action-secondary-border);
  border-radius: 4px;
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  padding: 7px 12px;
  font: inherit;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease;
}

.secondary-button:hover:not(:disabled):not([aria-disabled="true"]) {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.secondary-button:active:not(:disabled):not([aria-disabled="true"]) {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-active);
}

.secondary-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.secondary-button:disabled,
.secondary-button[aria-disabled="true"] {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.ui-action,
.admin-action-button,
.admin-refresh-button,
.admin-pagination-button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  border: 1px solid var(--action-primary-border);
  border-radius: 999px;
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  padding: 7px 12px;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.ui-action:hover,
.admin-action-button:hover,
.admin-refresh-button:hover,
.admin-pagination-button:hover {
  border-color: var(--action-primary-bg-hover);
  background: var(--action-primary-bg-hover);
}

.ui-action--secondary,
.admin-action-button.secondary,
.admin-refresh-button.secondary,
.admin-pagination-button {
  border-color: var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
}

.ui-action--secondary:hover,
.admin-action-button.secondary:hover,
.admin-refresh-button.secondary:hover,
.admin-pagination-button:hover {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.ui-action--danger,
.admin-action-button.danger {
  border-color: var(--action-danger-border);
  background: var(--action-danger-bg);
  color: var(--action-danger-text);
}

.ui-action--danger:hover,
.admin-action-button.danger:hover {
  border-color: var(--action-danger-border-hover);
  background: var(--action-danger-bg-hover);
  color: var(--action-danger-text-hover);
}

.ui-action:disabled,
.admin-action-button:disabled,
.admin-refresh-button:disabled,
.admin-pagination-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.ui-action:focus-visible,
.admin-action-button:focus-visible,
.admin-refresh-button:focus-visible,
.admin-pagination-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.ui-badge,
.admin-pill {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  border: 1px solid var(--badge-border);
  border-radius: 999px;
  background: var(--badge-bg);
  color: var(--badge-text);
  padding: 2px 8px;
  font-size: 0.79rem;
  font-weight: 800;
  line-height: 1.2;
}

.ui-badge--success,
.admin-pill.yes {
  border-color: var(--badge-success-border);
  background: var(--badge-success-bg);
  color: var(--badge-success-text);
}

.ui-badge--warning,
.admin-pill.admin {
  border-color: var(--badge-warning-border);
  background: var(--badge-warning-bg);
  color: var(--badge-warning-text);
}

.ui-badge--muted,
.admin-pill.no {
  border-color: var(--badge-muted-border);
  background: var(--badge-muted-bg);
  color: var(--badge-muted-text);
}

@media (max-width: 640px) {
  .app-notice {
    gap: 8px;
    padding: 9px 10px;
    font-size: 0.86rem;
  }
}

.page {
  width: 100%;
  box-sizing: border-box;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px 48px;
}

.site-header {
  margin: 0 0 12px;
  border: 0;
  border-bottom: 1px solid var(--site-nav-border);
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
}

.site-header__inner {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

.site-header__identity {
  display: block;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  background: var(--site-header-bg);
  border-bottom: 0;
  transition: background-color 120ms ease, filter 120ms ease;
}

.site-header__identity:hover {
  filter: brightness(1.03);
}

.site-header__identity:focus-visible {
  outline: 2px solid var(--color-focus-ring-header);
  outline-offset: -2px;
}

.site-header__identity .site-header__inner {
  padding-top: 9px;
  padding-bottom: 7px;
}

.site-header__brand {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}

.site-header__logo {
  flex: 0 0 auto;
  width: 27px;
  height: 27px;
  margin-top: 0.1em;
  color: var(--site-header-text);
}

.site-header__brand-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.site-header__title {
  margin: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.05rem, 1.45vw, 1.26rem);
  line-height: 1.22;
  letter-spacing: 0.008em;
  color: var(--site-header-text);
  font-weight: 700;
}

.site-header__subtitle {
  margin: 0;
  max-width: min(96ch, 100%);
  color: var(--site-header-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.77rem;
  font-weight: 400;
  line-height: 1.32;
  letter-spacing: 0.01em;
}

@media (min-width: 1280px) {
  .site-header__subtitle {
    white-space: nowrap;
    max-width: none;
  }
}

.site-header__nav {
  position: relative;
  background: var(--site-nav-bg);
  border: 0;
  box-shadow: none;
}

.site-header__nav .site-header__inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 6px;
  min-height: 40px;
}

.site-header-nav-toggle {
  display: none;
  position: absolute;
  top: 4px;
  right: 12px;
  width: 44px;
  height: 44px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 1px solid var(--site-nav-toggle-border);
  background: var(--site-nav-toggle-bg);
  border-radius: 4px;
  box-shadow: none;
  cursor: pointer;
  z-index: 30;
  transition:
    background-color 120ms ease,
    border-color 120ms ease;
}

.site-header-nav-toggle:hover {
  border-color: var(--color-focus-ring-medium);
  background: var(--color-control-bg-hover);
}

.site-header-nav-toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring-header);
  outline-offset: 2px;
}

.site-header-nav-toggle-bar {
  display: block;
  width: 18px;
  height: 1.5px;
  background: var(--site-nav-toggle-icon);
  border-radius: 1px;
  transition: transform 140ms ease, opacity 140ms ease;
}

body.site-nav-open .site-header-nav-toggle-bar:nth-child(1) {
  transform: translateY(6.5px) rotate(45deg);
}

body.site-nav-open .site-header-nav-toggle-bar:nth-child(2) {
  opacity: 0;
}

body.site-nav-open .site-header-nav-toggle-bar:nth-child(3) {
  transform: translateY(-6.5px) rotate(-45deg);
}

.site-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  color: var(--site-nav-text);
  text-decoration: none;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.84rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  padding: 6px 12px 8px;
  border: 0;
  border-radius: 0;
  background: transparent;
  transition:
    background-color 120ms ease,
    color 120ms ease;
}

.site-nav__link::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 3px;
  height: var(--site-nav-active-indicator-thickness, 1.5px);
  border-radius: 1px;
  background: transparent;
  opacity: 0;
  transition:
    background-color 120ms ease,
    opacity 120ms ease;
}

.site-nav__link:hover {
  background: var(--site-nav-hover-bg);
  color: var(--site-nav-hover-text);
}

.site-nav__link.active,
.site-nav__link[aria-current="page"] {
  color: var(--site-nav-active-text);
  background: var(--site-nav-active-bg);
  font-weight: 700;
}

.site-nav__link.active::after,
.site-nav__link[aria-current="page"]::after {
  background: var(--site-nav-active-indicator);
  opacity: 1;
}

.site-nav__link:focus-visible {
  outline: 2px solid var(--site-nav-focus);
  outline-offset: 2px;
}

/* ==========================================================================
   Home page (αρχική σελίδα) — εισαγωγική πύλη βιβλιοθήκης
   ========================================================================== */

.home-page {
  max-width: 1120px;
}

.home-page > section {
  margin-top: 40px;
}

.home-page > section:first-child {
  margin-top: 24px;
}

/* --- Hero --- */
.home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 32px;
  align-items: center;
  background: var(--color-control-bg-soft);
  border: 1px solid var(--color-border-control);
  border-left: 4px solid var(--color-border-brand);
  padding: 32px 34px;
}

.home-hero-content {
  min-width: 0;
}

.home-hero-title {
  margin: 0 0 16px;
  max-width: 24ch;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 2.1rem;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.005em;
  color: var(--header-burgundy-900);
}

.home-hero-text {
  margin: 0;
  max-width: 60ch;
  color: var(--header-text-dark);
  line-height: 1.7;
  font-size: 1.02rem;
}

.home-hero-media {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 210px;
  padding: 18px;
  background: var(--color-control-bg-muted);
  border: 1px solid var(--color-border-muted);
}

.home-hero-media-art {
  width: 100%;
  max-width: 280px;
  height: auto;
  color: var(--header-burgundy-800);
}

/* --- Corpus statistics --- */
.home-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.home-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 3px solid var(--header-burgundy-800);
  padding: 20px 16px 18px;
}

.home-stat-icon {
  width: 30px;
  height: 30px;
  color: var(--header-burgundy-800);
}

.home-stat-number {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.7rem;
  line-height: 1.15;
  font-weight: 700;
  color: var(--header-burgundy-900);
}

.home-stat-label {
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: 1.4;
}

@media (max-width: 860px) {
  .home-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .home-stats-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.home-hero-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  margin-top: 24px;
  margin-bottom: 8px;
}

.home-hero-actions-secondary {
  display: flex;
  flex-flow: row wrap;
  gap: 16px;
}

/* --- Action buttons --- */
.home-action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 20px;
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  border-radius: 0;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color 120ms ease, border-color 120ms ease,
    color 120ms ease;
}

.home-action-button-primary {
  background: var(--header-burgundy-800);
  border-color: var(--header-border-dark);
  color: var(--header-text-ivory);
}

.home-action-button-primary:hover,
.home-action-button-primary:focus {
  background: var(--header-burgundy-900);
}

.home-hero-actions .home-action-button-primary {
  padding: 12px 26px;
  font-size: 1.02rem;
  box-shadow: 0 2px 6px var(--color-shadow);
}

.home-action-button-secondary {
  background: var(--color-bg-surface);
  border-color: var(--action-secondary-border);
  color: var(--header-burgundy-900);
}

.home-action-button-secondary:hover,
.home-action-button-secondary:focus {
  background: var(--action-secondary-bg-hover);
  border-color: var(--header-burgundy-700);
}

.home-hero-actions .home-action-button-secondary {
  background: transparent;
  border-color: var(--header-burgundy-800);
  color: var(--header-burgundy-900);
}

.home-hero-actions .home-action-button-secondary:hover,
.home-hero-actions .home-action-button-secondary:focus {
  background: var(--color-primary-tint-subtle);
  border-color: var(--header-burgundy-900);
}

.home-action-button:focus-visible {
  outline: 2px solid var(--header-focus);
  outline-offset: 2px;
}

/* --- Sections --- */
.home-section-title {
  margin: 0 0 20px;
  padding: 0 0 8px;
  border-bottom: 2px solid var(--header-parchment-300);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.5rem;
  line-height: 1.25;
  font-weight: 700;
  color: var(--header-burgundy-900);
}

/* --- Card grid --- */
.home-card-grid {
  display: grid;
  gap: 18px;
}

.home-card-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-card-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-card {
  display: flex;
  flex-direction: column;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 3px solid var(--header-burgundy-800);
  border-radius: 0;
  padding: 18px 18px 16px;
}

.home-card--compact {
  border-top-width: 1px;
}

.home-card--span-full {
  grid-column: 1 / -1;
}

.home-card--reading {
  flex-direction: row;
  align-items: stretch;
  gap: 18px;
}

.home-card--reading .home-card-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.home-reading-themes {
  flex: 0 1 min(340px, 44%);
  min-width: 0;
  align-self: center;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 12px 12px 8px;
  border: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
}

.home-reading-themes-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding-bottom: 10px;
}

.home-reading-theme-swatch {
  min-width: 0;
  display: flex;
}

.home-reading-theme-page {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 3px;
  min-height: 80px;
  padding: 8px 7px;
  border: 1px solid var(--home-theme-preview-border);
  background: var(--home-theme-preview-page-bg);
}

.home-reading-theme-accent {
  display: block;
  width: 100%;
  max-width: 24px;
  height: 2px;
  border-radius: 999px;
  background: var(--home-theme-preview-accent);
}

.home-reading-theme-title {
  display: block;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.44rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--home-theme-preview-title);
}

.home-reading-theme-line {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: "Gentium", "Noto Serif", Georgia, "Times New Roman", serif;
  font-size: 0.58rem;
  line-height: 1.34;
  color: var(--home-theme-preview-text);
}

.home-reading-theme-line--strong {
  font-size: 0.62rem;
  color: var(--home-theme-preview-text-strong);
}

.home-reading-theme-line--muted {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.52rem;
  line-height: 1.3;
  color: var(--home-theme-preview-translation);
}

.home-reading-theme-swatch--modern {
  --home-theme-preview-page-bg: #fbfaf7;
  --home-theme-preview-border: #ddd6ca;
  --home-theme-preview-title: #6f1d1b;
  --home-theme-preview-text-strong: #1c1814;
  --home-theme-preview-text: #302922;
  --home-theme-preview-translation: #5f554a;
  --home-theme-preview-accent: #7f2a27;
}

.home-reading-theme-swatch--byzantine {
  --home-theme-preview-page-bg: #e9d7ad;
  --home-theme-preview-border: #c4a86e;
  --home-theme-preview-title: #4f3420;
  --home-theme-preview-text-strong: #2a1b10;
  --home-theme-preview-text: #3b2819;
  --home-theme-preview-translation: #66503a;
  --home-theme-preview-accent: #355745;
}

.home-reading-theme-swatch--liturgical {
  --home-theme-preview-page-bg: #2b1b15;
  --home-theme-preview-border: #5a4034;
  --home-theme-preview-title: #f2d2ad;
  --home-theme-preview-text-strong: #f0e4d6;
  --home-theme-preview-text: #e2d3c4;
  --home-theme-preview-translation: #c8b5a5;
  --home-theme-preview-accent: #ddb27c;
}

.home-reading-type-hint {
  margin: 0;
  padding: 9px 6px 3px;
  border-top: 1px solid var(--color-border-muted);
  text-align: center;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.68rem;
  line-height: 1.3;
  letter-spacing: 0.14em;
  color: var(--color-text-muted);
}

.home-card-icon {
  width: 32px;
  height: 32px;
  margin-bottom: 10px;
  color: var(--header-burgundy-800);
}

.home-card-title {
  margin: 0 0 10px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.2rem;
  line-height: 1.25;
  font-weight: 700;
  color: var(--header-burgundy-900);
}

.home-card-text {
  margin: 0;
  color: var(--header-text-dark);
  line-height: 1.62;
  font-size: 0.96rem;
}

.home-card-note {
  margin: 12px 0 0;
  padding: 8px 10px;
  border-left: 3px solid var(--color-border-brand);
  background: var(--color-control-bg-hover);
  color: var(--color-text);
  font-size: 0.92rem;
  line-height: 1.5;
}

.home-card-actions {
  margin-top: auto;
  padding-top: 18px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* --- Featured section (full-width banner) --- */
.home-featured {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 46px 16px;
  background: var(--color-control-bg-soft);
  border-top: 1px solid var(--color-border-muted);
  border-bottom: 1px solid var(--color-border-muted);
}

.home-featured-inner {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.home-featured .home-section-title {
  font-size: 1.65rem;
  color: var(--color-text-brand);
  padding: 0;
  margin: 0 0 16px;
  border-bottom: 0;
}

.home-featured-text {
  margin: 0 auto 14px;
  max-width: 70ch;
  color: var(--header-text-dark);
  line-height: 1.7;
  font-size: 1rem;
}

.home-featured-actions {
  margin-top: 24px;
  display: flex;
  justify-content: center;
}

/* keep full-bleed banner from creating horizontal scroll on the home page */
body:has(.home-page) {
  overflow-x: hidden;
}

/* --- Global site footer (navigation + trust + colophon) --- */
.site-footer {
  flex-shrink: 0;
  margin-top: 28px;
  border-top: 1px solid var(--site-footer-border);
  background: var(--site-footer-bg);
  color: var(--site-footer-fg);
}

.site-footer__inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 16px 18px 10px;
}

.site-footer__top {
  display: grid;
  /* Brand ~42% / navigation ~58% — brand compact, nav cohesive */
  grid-template-columns: minmax(15rem, 0.72fr) minmax(0, 1fr);
  gap: clamp(1.1rem, 2vw, 1.75rem);
  align-items: start;
}

.site-footer__brand {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 10px;
  align-items: start;
  min-width: 0;
}

.site-footer__brand-icon {
  display: inline-grid;
  width: 22px;
  height: 22px;
  margin-top: 2px;
  place-items: center;
  color: var(--site-footer-heading);
}

.site-footer__brand-icon svg {
  width: 18px;
  height: 18px;
}

.site-footer__brand-text {
  min-width: 0;
}

.site-footer__brand-title {
  margin: 0 0 6px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(0.9rem, 1.02vw, 1rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.32;
  color: var(--site-footer-heading);
  text-wrap: balance;
  overflow-wrap: break-word;
  hyphens: manual;
}

.site-footer__brand-copy {
  margin: 0;
  max-width: 28em;
  color: var(--site-footer-muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.site-footer__nav {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  column-gap: clamp(1.35rem, 2vw, 1.85rem);
  row-gap: 0.45rem;
  width: max-content;
  max-width: 100%;
  min-width: 0;
  align-items: start;
  justify-self: start;
}

.site-footer__nav-group {
  min-width: 0;
}

.site-footer__nav-heading {
  margin: 0 0 7px;
  color: var(--site-footer-heading);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.3;
  text-transform: none;
}

.site-footer__nav-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer__nav-list li + li {
  margin-top: 5px;
}

.site-footer__nav-link {
  display: inline-block;
  padding: 1px 0;
  color: var(--site-footer-link);
  font-size: 0.82rem;
  font-weight: 500;
  line-height: 1.38;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

@media (min-width: 1100px) {
  .site-footer__nav-link {
    white-space: nowrap;
  }
}

.site-footer__nav-link:hover {
  color: var(--site-footer-link-hover);
  text-decoration-color: currentColor;
}

.site-footer__nav-link:focus-visible {
  color: var(--site-footer-link-hover);
  text-decoration-color: currentColor;
  outline: 2px solid var(--site-footer-focus);
  outline-offset: 2px;
  border-radius: 3px;
}

.site-footer__nav-link[aria-current="page"] {
  color: var(--site-footer-link-hover);
  font-weight: 600;
  text-decoration-color: currentColor;
}

.site-footer__nav-group--account .site-footer__nav-link[data-profile-tab="ai"] {
  white-space: nowrap;
}

.site-footer__nav-group--account[hidden] {
  display: none;
}

.site-footer__trust {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem clamp(1rem, 1.6vw, 1.35rem);
  margin-top: 12px;
  padding: 8px 0 0;
  border-top: 1px solid var(--site-footer-border);
  background: transparent;
}

.site-footer__trust-item {
  min-width: 0;
}

.site-footer__trust-title {
  margin: 0 0 3px;
  color: var(--site-footer-heading);
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.3;
}

.site-footer__trust-copy {
  margin: 0;
  color: var(--site-footer-muted);
  font-size: 0.8rem;
  line-height: 1.4;
}

.site-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  align-items: center;
  justify-content: flex-start;
  margin-top: 12px;
  padding-top: 10px;
  padding-bottom: 4px;
  border-top: 1px solid var(--site-footer-border);
}

.site-footer__copyright {
  margin: 0;
  color: var(--site-footer-muted);
  font-size: 0.8rem;
  line-height: 1.4;
}

.site-footer__contact {
  margin: 0;
  color: var(--site-footer-muted);
  font-size: 0.8rem;
  line-height: 1.4;
}

.site-footer__contact-link {
  color: var(--site-footer-link);
  text-decoration: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.site-footer__contact-link:hover {
  color: var(--site-footer-link-hover);
  text-decoration-color: currentColor;
}

.site-footer__contact-link:focus-visible {
  color: var(--site-footer-link-hover);
  text-decoration-color: currentColor;
  outline: 2px solid var(--site-footer-focus);
  outline-offset: 3px;
  border-radius: 3px;
}

.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer__legal a {
  color: var(--site-footer-link);
  font-size: 0.76rem;
  line-height: 1.4;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.site-footer__legal a:hover {
  color: var(--site-footer-link-hover);
  text-decoration-color: currentColor;
}

.site-footer__legal a:focus-visible {
  color: var(--site-footer-link-hover);
  text-decoration-color: currentColor;
  outline: 2px solid var(--site-footer-focus);
  outline-offset: 3px;
  border-radius: 3px;
}

@media (max-width: 1100px) {
  .site-footer__top {
    grid-template-columns: minmax(14rem, 0.7fr) minmax(0, 1fr);
    gap: 1.1rem 1.35rem;
  }

  .site-footer__nav {
    column-gap: 1.35rem;
  }
}

@media (max-width: 900px) {
  .site-footer__top {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .site-footer__nav {
    width: 100%;
    max-width: 34rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 1.15rem;
  }
}

@media (max-width: 760px) {
  .home-card-grid--two,
  .home-card-grid--three {
    grid-template-columns: minmax(0, 1fr);
  }

  .home-card--reading {
    flex-direction: column;
  }

  .home-reading-themes {
    flex: 1 1 auto;
    width: 100%;
    align-self: stretch;
    padding: 10px 10px 6px;
  }

  .home-reading-themes-grid {
    gap: 8px;
    padding-bottom: 8px;
  }

  .home-reading-theme-page {
    min-height: 74px;
    padding: 7px 6px;
  }

  .home-reading-theme-line {
    font-size: clamp(0.52rem, 2.9vw, 0.58rem);
  }

  .home-reading-theme-line--strong {
    font-size: clamp(0.54rem, 3.1vw, 0.62rem);
  }

  .home-reading-theme-line--muted {
    font-size: clamp(0.5rem, 2.7vw, 0.56rem);
  }

  .home-reading-type-hint {
    padding: 8px 4px 2px;
    font-size: 0.66rem;
    letter-spacing: 0.12em;
  }

  .home-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    padding: 22px 18px;
  }

  .home-hero-title {
    font-size: 1.6rem;
    max-width: none;
  }

  .home-hero-media {
    min-height: 160px;
  }

  .home-hero-actions {
    align-items: stretch;
  }

  .home-hero-actions-secondary {
    flex-direction: column;
  }

  .home-hero-actions .home-action-button {
    width: 100%;
  }

  .home-featured {
    padding: 34px 16px;
  }

  .site-footer {
    margin-top: 12px;
  }

  .site-footer__inner {
    padding: 14px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  }

  .site-footer__top {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .site-footer__brand {
    column-gap: 8px;
  }

  .site-footer__brand-icon {
    width: 20px;
    height: 20px;
    margin-top: 2px;
  }

  .site-footer__brand-icon svg {
    width: 16px;
    height: 16px;
  }

  .site-footer__brand-title {
    margin-bottom: 5px;
    font-size: 0.88rem;
    line-height: 1.3;
    text-wrap: balance;
  }

  .site-footer__brand-copy {
    font-size: 0.8rem;
    line-height: 1.42;
    max-width: none;
  }

  /* Two columns: Library | Search+Account (account nested in right column) */
  .site-footer__nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto auto;
    width: 100%;
    max-width: none;
    column-gap: 1rem;
    row-gap: 0.35rem;
    align-items: start;
  }

  .site-footer__nav-group:nth-child(1) {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .site-footer__nav-group:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .site-footer__nav-group--account {
    grid-column: 2;
    grid-row: 2;
    margin-top: 0.65rem;
  }

  .site-footer__nav-group--account .site-footer__nav-link[data-profile-tab="ai"] {
    white-space: normal;
  }

  .site-footer__nav-heading {
    margin-bottom: 7px;
    font-size: 0.76rem;
    color: var(--site-footer-heading);
  }

  .site-footer__nav-link {
    font-size: 0.82rem;
    line-height: 1.4;
    padding: 1px 0;
    white-space: normal;
  }

  .site-footer__nav-list li + li {
    margin-top: 5px;
  }

  .site-footer__trust {
    grid-template-columns: minmax(0, 1fr);
    gap: 11px;
    margin-top: 12px;
    padding: 10px 0 0;
  }

  .site-footer__trust-item + .site-footer__trust-item {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  .site-footer__trust-title {
    margin-bottom: 3px;
    font-size: 0.82rem;
    font-weight: 600;
  }

  .site-footer__trust-copy {
    font-size: 0.8rem;
    line-height: 1.42;
    color: var(--site-footer-muted);
  }

  .site-footer__bottom {
    margin-top: 12px;
    padding-top: 12px;
    padding-bottom: 2px;
    gap: 4px;
  }

  .site-footer__copyright {
    color: var(--site-footer-muted);
    font-size: 0.78rem;
    line-height: 1.4;
  }

  .site-footer__contact {
    color: var(--site-footer-muted);
    font-size: 0.78rem;
    line-height: 1.4;
  }
}

/* Narrowest widths: keep two columns unless overflow risk is high */
@media (max-width: 300px) {
  .site-footer__nav {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    gap: 0.75rem;
  }

  .site-footer__nav-group:nth-child(1),
  .site-footer__nav-group:nth-child(2),
  .site-footer__nav-group--account {
    grid-column: auto;
    grid-row: auto;
    margin-top: 0;
  }

  .site-footer__nav-group--account {
    margin-top: 0.15rem;
  }

  .site-footer__brand-title {
    font-size: 0.86rem;
  }
}

.search-panel {
  margin-top: 18px;
  background: var(--color-control-bg-disabled);
  border: 1px solid var(--color-border-muted);
  border-radius: 6px;
  padding: 10px;
}

body[data-search-page="simple"] .search-main-panel,
body[data-search-page="advanced"] .search-main-panel,
.search-stage.search-main-panel {
  position: relative;
  background: transparent;
  border: 0;
  border-top: 0;
  border-radius: 0;
  box-shadow: none;
  padding: var(--search-space-xs, 6px) 0 var(--search-space-2xs, 4px);
  min-height: 0;
  height: auto;
}

.page--search {
  --search-content-max-width: 880px;
  --search-space-2xs: 4px;
  --search-space-xs: 6px;
  --search-space-sm: 10px;
  --search-space-md: 14px;
  --search-space-lg: 18px;
  --search-control-height: 36px;
  --search-shell-radius: 10px;
  --search-control-radius: 7px;
  --search-shell-shadow: 0 2px 10px var(--color-shadow);
  --search-shell-shadow-focus:
    0 0 0 3px var(--color-focus-ring-subtle),
    0 2px 12px var(--color-shadow);
  --search-filters-bg: color-mix(
    in srgb,
    var(--color-bg-surface-muted) 70%,
    var(--color-bg-page) 30%
  );
  --search-filters-border: color-mix(
    in srgb,
    var(--color-border-muted) 75%,
    transparent
  );
  --search-filters-radius: 8px;
  --search-filters-padding: 16px 18px;
  --search-filters-gap: 12px;
  --search-filters-section-gap: 20px;
  --search-filters-label-gap: 6px;
  --search-filters-offset: 12px;
  padding-bottom: 32px;
}

.page--search,
.page--search .search-column,
.page--search .search-form--compose,
.page--search .search-stage {
  overflow: visible;
}

.search-column {
  width: 100%;
  max-width: var(--search-content-max-width, 880px);
  margin-inline: auto;
  min-width: 0;
}

.page--search .search-compose,
.page--search .search-options-group,
.page--search .search-options,
.page--search .search-options-panel {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.search-intro-block {
  display: grid;
  gap: 5px;
  margin: 0 0 var(--search-space-lg, 18px);
  padding: 0;
  border: 0;
  max-width: none;
  width: 100%;
  text-align: left;
  justify-items: start;
}

.page--search .search-intro-block {
  text-align: left;
  margin-bottom: 20px;
}

.search-intro__title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
  max-width: 100%;
  /* Match title size so badge `em` stays proportional */
  font-size: clamp(1.28rem, 2vw, 1.55rem);
}

.search-intro__title-row .search-intro-title {
  display: block;
  font-size: 1em;
}

.search-intro-title {
  margin: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.28rem, 2vw, 1.55rem);
  line-height: 1.22;
  color: var(--color-text-brand);
  font-weight: 700;
}

.search-intro-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 0;
  padding: 0.14em 0.5em;
  border: 1px solid var(--color-border-muted);
  border-radius: 999px;
  background: var(--color-bg-surface-muted);
  color: var(--color-text-muted);
  font-family: inherit;
  font-size: 0.62em;
  font-weight: 650;
  letter-spacing: 0.04em;
  line-height: 1;
  user-select: none;
  pointer-events: none;
}

.search-intro__title-row .search-intro-badge {
  transform: translateY(2px);
}

.search-intro-subtitle {
  margin: 0;
  max-width: 42rem;
  color: var(--color-text-muted);
  font-size: 0.94rem;
  font-weight: 450;
  line-height: 1.4;
}

button.search-intro__info-button,
.search-intro__info-button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  margin: 0;
  margin-inline-start: 0.28rem;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  vertical-align: middle;
  transform: translateY(-1px);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

/* Invisible expanded hit area without pushing text away */
button.search-intro__info-button::before,
.search-intro__info-button::before {
  content: "";
  position: absolute;
  inset: -5px;
}

.search-intro__info-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  line-height: 0;
}

.search-intro__info-icon svg [stroke] {
  stroke: var(--color-text-muted);
}

.search-intro__info-icon svg [fill] {
  fill: var(--color-text-muted);
}

button.search-intro__info-button:hover,
.search-intro__info-button:hover {
  background: var(--color-bg-surface-muted);
  border-color: var(--color-border-muted);
}

button.search-intro__info-button:hover .search-intro__info-icon svg [stroke],
.search-intro__info-button:hover .search-intro__info-icon svg [stroke],
button.search-intro__info-button:focus-visible .search-intro__info-icon svg [stroke],
.search-intro__info-button:focus-visible .search-intro__info-icon svg [stroke],
button.search-intro__info-button[aria-expanded="true"] .search-intro__info-icon svg [stroke],
.search-intro__info-button[aria-expanded="true"] .search-intro__info-icon svg [stroke] {
  stroke: var(--color-text-strong);
}

button.search-intro__info-button:hover .search-intro__info-icon svg [fill],
.search-intro__info-button:hover .search-intro__info-icon svg [fill],
button.search-intro__info-button:focus-visible .search-intro__info-icon svg [fill],
.search-intro__info-button:focus-visible .search-intro__info-icon svg [fill],
button.search-intro__info-button[aria-expanded="true"] .search-intro__info-icon svg [fill],
.search-intro__info-button[aria-expanded="true"] .search-intro__info-icon svg [fill] {
  fill: var(--color-text-strong);
}

button.search-intro__info-button:focus-visible,
.search-intro__info-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

button.search-intro__info-button[aria-expanded="true"],
.search-intro__info-button[aria-expanded="true"] {
  background: var(--color-control-bg-active);
  border-color: var(--color-border-control-active);
}

@media (prefers-reduced-motion: reduce) {
  button.search-intro__info-button,
  .search-intro__info-button {
    transition: none;
  }
}

.search-intro-popover {
  box-sizing: border-box;
  z-index: 60;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: 9px;
  background: var(--color-bg-surface);
  box-shadow: 0 8px 24px var(--color-shadow);
  color: var(--color-text);
  font-size: 0.84rem;
  font-weight: 400;
  line-height: 1.5;
}

.search-intro-popover[hidden] {
  display: none !important;
}

.search-intro-popover__text {
  margin: 0;
  color: inherit;
  font: inherit;
  line-height: inherit;
}

.search-intro-popover__heading {
  margin: 0 0 8px;
  color: var(--color-text-strong);
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.3;
}

.search-intro-popover__section {
  margin: 0;
}

.search-intro-popover__section + .search-intro-popover__section {
  margin-top: 8px;
}

.search-intro-popover__section-title {
  display: block;
  margin: 0 0 2px;
  color: var(--color-text-strong);
  font-weight: 650;
}

.search-intro-popover__arrow {
  display: none;
}

/* Desktop / tablet: floating anchored bubble */
.search-intro-popover.search-intro-popover--fixed {
  position: fixed;
  max-width: min(360px, calc(100vw - 24px));
}

.search-intro-popover.search-intro-popover--fixed .search-intro-popover__arrow {
  display: block;
  position: absolute;
  top: -5px;
  left: var(--arrow-left, 50%);
  width: 10px;
  height: 10px;
  transform: translateX(-50%) rotate(45deg);
  border-top: 1px solid var(--color-border-muted);
  border-left: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
  pointer-events: none;
}

/* Mobile: compact full-width contextual panel in document flow */
@media (max-width: 600px) {
  .search-intro-popover,
  .search-intro-popover.search-intro-popover--mobile {
    position: static;
    width: 100%;
    max-width: none;
    margin-top: 8px;
    box-shadow: none;
  }

  .search-intro-popover .search-intro-popover__arrow,
  .search-intro-popover.search-intro-popover--mobile .search-intro-popover__arrow {
    display: none;
  }

  button.search-intro__info-button,
  .search-intro__info-button {
    width: 30px;
    height: 30px;
    margin-block: 0;
  }

  button.search-intro__info-button::before,
  .search-intro__info-button::before {
    inset: -7px;
  }
}

.search-intro-text {
  margin: 0;
  color: inherit;
  line-height: inherit;
  font-size: inherit;
  font-weight: inherit;
  text-align: left;
}

.search-form--compose {
  display: grid;
  gap: var(--search-space-md, 14px);
  width: 100%;
  min-width: 0;
}

.search-compose {
  display: grid;
  gap: 0;
  width: 100%;
  min-width: 0;
}

.search-compose__shell,
.search-query-shell {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0 var(--search-space-xs, 6px);
  width: 100%;
  min-width: 0;
  min-height: 56px;
  padding: 4px 6px 4px 14px;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--search-shell-radius, 10px);
  background: var(--color-bg-surface);
  box-shadow: var(--search-shell-shadow, 0 2px 10px var(--color-shadow));
  box-sizing: border-box;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease;
}

.search-compose__shell--multiline {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.search-compose__shell:focus-within,
.search-query-shell:focus-within {
  border-color: var(--color-focus);
  box-shadow: var(--search-shell-shadow-focus);
}

.search-compose__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-muted);
  margin: 0;
  line-height: 0;
}

.search-compose__shell--multiline .search-compose__icon {
  display: none;
}

.search-compose__field,
.search-compose #queryInput,
.search-query-main {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  margin: 0;
  padding: 10px 8px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--color-text-strong);
  font: inherit;
  font-size: 1.05rem;
  line-height: 1.4;
  box-shadow: none;
  outline: 0;
}

.search-compose__field-wrap {
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: 100%;
  min-width: 0;
}

.search-compose__field--textarea,
.search-compose textarea#queryInput,
.search-compose__field-wrap .search-compose__field--textarea,
.search-compose__field-wrap textarea#queryInput {
  flex: 0 0 auto;
  width: 100%;
  min-height: 92px;
  max-height: none;
  max-width: 100%;
  resize: none;
  padding: 12px 14px 12px;
  font-size: 1.02rem;
  line-height: 1.45;
  box-sizing: border-box;
}

/* Padding only when the mic button is actually mounted (supported browsers). */
.search-compose__field-wrap--has-mic .search-compose__field--textarea,
.search-compose__field-wrap--has-mic textarea#queryInput,
.search-compose__field-wrap:has(.search-compose__mic) .search-compose__field--textarea,
.search-compose__field-wrap:has(.search-compose__mic) textarea#queryInput {
  padding-inline-end: 48px;
}

.search-compose__mic-root {
  display: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.search-compose__mic-root:not(:empty),
.search-compose__mic-root--mounted {
  display: inline-flex;
}

.search-compose__mic-root--overlay {
  position: absolute;
  top: 8px;
  inset-inline-end: 8px;
  z-index: 1;
}

.search-compose__mic-root--overlay:empty {
  display: none;
}

.search-compose__mic {
  appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.search-compose__mic:hover {
  border-color: var(--color-border-muted);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
}

.search-compose__mic:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.search-compose__mic.is-listening,
.search-compose__mic[aria-pressed="true"] {
  border-color: var(--color-border);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
}

.search-compose__mic-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  line-height: 0;
}

.search-compose__mic-icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.search-compose__mic-listening {
  position: absolute;
  top: 5px;
  inset-inline-end: 5px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-text-brand);
  opacity: 0;
  pointer-events: none;
}

.search-compose__mic.is-listening .search-compose__mic-listening,
.search-compose__mic[aria-pressed="true"] .search-compose__mic-listening {
  opacity: 1;
}

.search-compose__field::placeholder,
.search-compose #queryInput::placeholder {
  color: var(--color-text-subtle);
  opacity: 1;
}

.search-compose__field:focus,
.search-compose__field:focus-visible,
.search-compose #queryInput:focus,
.search-compose #queryInput:focus-visible {
  outline: 0;
  box-shadow: none;
  background: transparent;
}

.search-compose__actions,
.search-query-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  flex: 0 0 auto;
  min-width: 0;
}

.search-compose__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--search-space-sm, 10px) var(--search-space-md, 14px);
  width: 100%;
  margin: 0;
  padding: 8px 10px 8px 12px;
  border-top: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface-muted);
  box-sizing: border-box;
}

.search-compose__footer-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
  min-width: 0;
}

.search-compose__synthesis {
  display: grid;
  gap: 2px;
  justify-items: start;
  min-width: 0;
  flex: 1 1 220px;
  max-width: 100%;
}

.search-compose__synthesis-help {
  margin: 0;
  padding-left: 2.55rem;
  color: var(--color-text-muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

.search-compose__submit,
.search-query-submit {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 42px;
  height: 42px;
  margin: 0;
  padding: 0 14px;
  border: 0;
  border-radius: calc(var(--search-shell-radius, 10px) - 2px);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.15s ease;
}

.search-compose__submit:hover:not(:disabled) {
  background: var(--action-primary-bg-hover);
}

.search-compose__submit:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

.search-compose__submit:disabled {
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
}

.search-compose__submit-arrow {
  display: inline-flex;
  align-items: center;
  font-size: 1.05rem;
  line-height: 1;
  transform: translateY(-0.5px);
}

.search-compose__clear,
.search-query-clear {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  margin: 0;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-muted);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 560;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition:
    color 0.15s ease,
    background-color 0.15s ease;
}

.search-compose__clear:hover:not(:disabled) {
  color: var(--color-text-strong);
  background: var(--color-bg-surface-muted);
}

.search-compose__clear:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

.search-compose__clear:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.search-compose__clear[hidden] {
  display: inline-flex !important;
  visibility: hidden;
  pointer-events: none;
}

.search-options-group {
  display: grid;
  gap: 0;
  width: 100%;
  min-width: 0;
  margin-top: 0;
  overflow: visible;
  position: relative;
}

.search-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--search-space-xs, 6px);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: visible;
  position: relative;
  z-index: 2;
}

body[data-search-page="advanced"] .search-options {
  border-top: 0;
}

.search-options__item {
  min-width: 0;
}

.search-options__corpus {
  flex: 0 1 180px;
  max-width: 100%;
  min-width: 0;
  position: relative;
  z-index: 1;
}

.search-options__corpus:has(.search-multiselect.is-open) {
  z-index: 4;
}

.search-options-group:has(.search-multiselect.is-open) .search-options {
  z-index: 4;
}

.search-options-group:has(.search-multiselect.is-open) .search-options-panel {
  z-index: 1;
}

.search-options__corpus-head {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 4px;
}

.search-options__control,
.search-options .search-multiselect-toggle {
  width: 100%;
  min-height: var(--search-control-height, 36px);
  height: var(--search-control-height, 36px);
  box-sizing: border-box;
  border-radius: var(--search-control-radius, 7px);
  background: var(--color-bg-surface);
  font-size: 0.84rem;
}

.search-options__toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 0 1 auto;
  min-height: var(--search-control-height, 36px);
  height: var(--search-control-height, 36px);
  margin: 0;
  padding: 0 11px;
  border: 1px solid var(--color-border-control);
  border-radius: var(--search-control-radius, 7px);
  background: var(--color-bg-surface);
  color: var(--color-text);
  font: inherit;
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.25;
  cursor: pointer;
  white-space: nowrap;
  box-sizing: border-box;
}

.search-options__toggle::after {
  content: "";
  width: 10px;
  height: 7px;
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px 7px;
  transition: transform 0.15s ease;
}

.search-options__toggle[aria-expanded="true"] {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.search-options__toggle[aria-expanded="true"]::after {
  transform: rotate(180deg);
}

.search-options__toggle:hover {
  border-color: var(--color-border-control-active);
}

.search-options__toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

/* Compact limit: label + bordered select (not segmented control) */
.search-options__limit {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  min-height: var(--search-control-height, 36px);
  height: var(--search-control-height, 36px);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--color-text);
  box-sizing: border-box;
  overflow: visible;
}

.search-options__limit-prefix {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--color-text-muted);
  white-space: nowrap;
}

.search-options__limit-select,
.search-form .search-options__limit-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  flex: 0 0 auto;
  width: auto;
  min-width: 4.25rem;
  height: var(--search-control-height, 36px);
  min-height: var(--search-control-height, 36px);
  margin: 0;
  padding: 0 1.85rem 0 0.7rem;
  border: 1px solid var(--color-border-control);
  border-radius: var(--search-control-radius, 7px);
  background-color: var(--color-bg-surface);
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: right 0.55rem center;
  background-size: 10px 7px;
  box-shadow: none;
  color: var(--color-text-strong);
  font: inherit;
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1.2;
  cursor: pointer;
  box-sizing: border-box;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.search-options__limit-select::-ms-expand {
  display: none;
}

.search-options__limit:hover .search-options__limit-select,
.search-form .search-options__limit:hover .search-options__limit-select {
  border-color: var(--color-border-control-active);
}

.search-options__limit:focus-within .search-options__limit-select,
.search-form .search-options__limit:focus-within .search-options__limit-select {
  border-color: var(--color-focus);
  box-shadow: 0 0 0 3px var(--color-focus-ring-subtle);
  outline: 0;
}

.search-options__limit-select:hover:not(:disabled),
.search-form .search-options__limit-select:hover:not(:disabled) {
  background-color: var(--color-bg-surface);
}

.search-options__limit-select:focus,
.search-options__limit-select:focus-visible,
.search-form .search-options__limit-select:focus,
.search-form .search-options__limit-select:focus-visible {
  outline: 0;
}

.search-options-panel {
  width: 100%;
  margin: var(--search-filters-offset, 10px) 0 0;
  padding: var(--search-filters-padding, 16px 18px);
  border: 1px solid var(--search-filters-border, var(--color-border-muted));
  border-radius: var(--search-filters-radius, 8px);
  background: var(--search-filters-bg, var(--color-bg-surface-muted));
  box-shadow: none;
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  overflow: visible;
}

.search-options-panel[hidden] {
  display: none !important;
}

.search-options-panel:not([hidden]) {
  animation: search-filters-panel-in 0.16s ease;
}

@keyframes search-filters-panel-in {
  from {
    opacity: 0;
    transform: translateY(-3px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .search-options-panel:not([hidden]) {
    animation: none;
  }
}

.search-options-panel__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--search-filters-gap, 12px) var(--search-space-md, 14px);
  align-content: start;
}

.search-options-panel__advanced {
  grid-column: 1 / -1;
  margin-top: 2px;
}

/* Lexical: compact secondary surface — no section chrome */
body[data-search-page="simple"] .search-options-panel {
  padding: 14px 16px;
}

body[data-search-page="simple"] .search-options-panel .search-field > label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-text-muted);
  font-family: inherit;
}

body[data-search-page="simple"] .search-options-panel .search-field {
  gap: var(--search-filters-label-gap, 6px);
}

/* Soften nested chrome inside expanded filters */
.search-options-panel .search-collapsible-advanced__grid {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  gap: var(--search-filters-section-gap, 22px);
}

.search-options-panel .search-advanced-group {
  gap: var(--search-filters-gap, 12px);
}

.search-options-panel .search-advanced-group + .search-advanced-group {
  padding-top: var(--search-filters-section-gap, 22px);
  border-top: 1px solid var(--color-border-muted);
}

.search-options-panel .search-advanced-group-title {
  margin: 0;
  color: var(--color-text-muted);
  font-family: inherit;
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: normal;
  line-height: 1.3;
  text-transform: none;
}

.search-options-panel .search-advanced-group-grid {
  gap: var(--search-filters-gap, 12px) var(--search-space-md, 14px);
}

.search-options-panel .search-field > label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-text);
  font-family: inherit;
}

.search-options-panel .search-field {
  gap: var(--search-filters-label-gap, 6px);
}

.search-options-panel .search-field-help {
  margin: 2px 0 0;
  color: var(--color-text-muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

.search-options-panel .search-multiselect-toggle {
  box-sizing: border-box;
  min-height: 40px;
  height: 40px;
  border-radius: var(--search-control-radius, 7px);
  border-color: var(--color-border-muted);
  background: var(--color-bg-surface);
  line-height: 1.35;
  overflow: visible;
}

.search-options-panel .search-field select,
.search-form .search-options-panel .search-field select {
  box-sizing: border-box;
  min-height: 44px;
  height: 44px;
  padding: 0 34px 0 12px;
  line-height: 42px;
  border-radius: var(--search-control-radius, 7px);
  border-color: var(--color-border-muted);
  background-color: var(--color-bg-surface);
  overflow: visible;
  vertical-align: middle;
}

.search-options-panel .search-field select:focus,
.search-options-panel .search-field select:focus-visible,
.search-options-panel .search-multiselect-toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
  border-color: var(--color-focus);
}

.search-options-panel .search-field select:disabled,
.search-options-panel .search-multiselect-toggle:disabled {
  opacity: 0.72;
  color: var(--color-text-muted);
  background: var(--color-bg-surface-muted);
  border-color: var(--color-border-muted);
  cursor: not-allowed;
}

.search-options-panel .search-answer-advanced-toggle {
  margin-top: 0;
}

/* Keep base .search-main-panel for non-search pages that reuse the class */
.search-panel.search-main-panel:not(.search-stage) {
  position: relative;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--header-burgundy-800);
  border-radius: 4px;
  box-shadow: 0 4px 14px var(--color-shadow);
  padding: 18px 18px 16px;
}

body[data-search-page="simple"] .search-advanced-only {
  display: none !important;
}

.advanced-search-lock-overlay {
  position: absolute;
  inset: 0;
  z-index: 12;
  display: grid;
  place-items: end center;
  width: 100%;
  border: 0;
  background: var(--color-primary-tint-subtle);
  color: var(--color-text-brand);
  cursor: pointer;
  padding: 0 14px 14px;
  text-align: center;
}

.advanced-search-lock-overlay[hidden] {
  display: none;
}

.advanced-search-lock-overlay span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid var(--action-secondary-border);
  background: var(--color-bg-surface);
  color: var(--color-text-brand);
  font-weight: 600;
  box-shadow: 0 8px 18px var(--color-shadow);
}

.semantic-access-notice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 16px 26px;
  align-items: center;
  margin: 14px 0 14px;
  padding: 17px 18px;
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-border-brand);
  border-radius: 8px;
  background: var(--color-bg-surface);
  color: var(--color-text);
  box-shadow: 0 3px 14px var(--color-shadow);
}

.semantic-access-notice[hidden] {
  display: none;
}

.semantic-access-notice__content {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.semantic-access-notice__eyebrow {
  margin: 0;
  color: var(--color-text-brand);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.2;
  text-transform: uppercase;
}

.semantic-access-notice h2 {
  margin: 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.12rem, 2vw, 1.32rem);
  font-weight: 800;
  line-height: 1.24;
}

.semantic-access-notice p {
  margin: 0;
  color: var(--color-text-muted);
  max-width: 82ch;
  font-size: 0.92rem;
  line-height: 1.55;
}

.semantic-access-notice__actions {
  display: flex;
  align-self: center;
  justify-content: flex-end;
  min-width: max-content;
}

.semantic-access-notice__actions button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border: 1px solid var(--action-primary-border);
  border-radius: 999px;
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  padding: 8px 15px;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.semantic-access-notice__actions button:hover {
  border-color: var(--action-primary-bg-hover);
  background: var(--action-primary-bg-hover);
}

.semantic-access-notice__actions button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.semantic-preview-locked-region {
  position: relative;
  display: block;
}

.semantic-preview-locked-region__header {
  display: none;
}

body.search-advanced-locked .semantic-preview-locked-region {
  margin-top: 6px;
  padding: 8px 0 0;
  border-top: 1px solid var(--color-focus-ring-subtle);
  background: transparent;
  overflow: visible;
}

body.search-advanced-locked .semantic-preview-locked-region::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      var(--color-bg-page) 0%,
      transparent 12%,
      transparent 86%,
      var(--color-bg-page) 100%
    ),
    linear-gradient(
      90deg,
      var(--color-bg-page) 0%,
      transparent 5%,
      transparent 95%,
      var(--color-bg-page) 100%
    );
  opacity: 0.22;
}

body.search-advanced-locked .semantic-preview-locked-region__header {
  position: relative;
  z-index: 3;
  display: grid;
  gap: 3px;
  margin: 0 0 8px;
  padding: 0 2px 8px;
  border-bottom: 1px solid var(--color-focus-ring-subtle);
}

.semantic-preview-locked-region__eyebrow {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.2;
  text-transform: uppercase;
}

.semantic-preview-locked-region__header h2 {
  margin: 0;
  color: var(--color-text);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(0.96rem, 1.55vw, 1.08rem);
  font-weight: 700;
  line-height: 1.28;
}

.semantic-preview-locked-region__header p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.42;
}

body.search-advanced-locked .semantic-preview-locked-region > .search-answer,
body.search-advanced-locked .semantic-preview-locked-region > .results-section {
  position: relative;
  z-index: 1;
}

body.search-advanced-locked .semantic-preview-locked-region > .search-answer {
  margin-top: 0;
}

body.search-advanced-locked .semantic-preview-locked-region .result-card,
body.search-advanced-locked .semantic-preview-locked-region .result-item {
  border-left-color: var(--color-border-muted);
}

@media (max-width: 860px) {
  .semantic-access-notice {
    grid-template-columns: 1fr;
  }

  .semantic-access-notice__actions {
    justify-content: flex-start;
    min-width: 0;
  }
}

.advanced-unlock-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 18px;
}

.advanced-unlock-modal[hidden] {
  display: none;
}

.advanced-unlock-modal__backdrop {
  position: absolute;
  inset: 0;
  background: var(--color-overlay);
}

.advanced-unlock-modal__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 480px);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-strong);
  padding: 18px 18px 16px;
  box-shadow: 0 18px 42px var(--color-shadow-strong);
}

.advanced-unlock-modal__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 32px;
  min-height: 32px;
  border: 0;
  background: transparent;
  color: var(--color-text-brand);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
}

.advanced-unlock-modal__eyebrow {
  margin: 0 34px 8px 0;
  color: var(--color-text-brand);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.advanced-unlock-modal h2 {
  margin: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.22rem;
  line-height: 1.25;
  color: var(--color-text-brand);
}

.advanced-unlock-modal p {
  margin: 10px 0 0;
  line-height: 1.55;
}

.advanced-unlock-modal__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.advanced-unlock-modal__actions button {
  border: 1px solid var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  border-radius: 0;
  font-size: 0.88rem;
  padding: 7px 11px;
  cursor: pointer;
}

.advanced-unlock-modal__actions button:hover {
  border-color: var(--action-primary-bg-hover);
  background: var(--action-primary-bg-hover);
}

.advanced-unlock-modal__actions .secondary-button:not(:disabled) {
  border-color: var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
}

.advanced-unlock-modal__actions .secondary-button:hover:not(:disabled) {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}


:root,
[data-theme="modern"] {
  --search-chevron-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M2 2l4 4 4-4' fill='none' stroke='%234e4234' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

[data-theme="byzantine"] {
  --search-chevron-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M2 2l4 4 4-4' fill='none' stroke='%234f4032' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

[data-theme="deep-plum"] {
  --search-chevron-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M2 2l4 4 4-4' fill='none' stroke='%234a3f44' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

[data-theme="liturgical"] {
  --search-chevron-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M2 2l4 4 4-4' fill='none' stroke='%23d4c4b4' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

[data-theme="monastic"] {
  --search-chevron-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M2 2l4 4 4-4' fill='none' stroke='%2352483c' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

[data-theme="patriarchal"] {
  --search-chevron-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M2 2l4 4 4-4' fill='none' stroke='%23f2f2f2' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.search-form {
  display: grid;
  gap: 16px;
}

.search-primary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 14px 16px;
  padding: 6px 0 2px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body[data-search-page="advanced"] .search-primary-grid {
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
}

body[data-search-page="simple"] .search-primary-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.search-field {
  display: grid;
  grid-template-rows: auto auto;
  gap: 6px;
  align-content: start;
}

.search-primary-grid > .search-field {
  grid-template-rows: 24px auto;
}

.search-primary-grid > .search-field > label:not(.search-answer-toggle),
.search-primary-grid > .search-field > .search-source-label-row,
.search-primary-grid > .search-field > .search-answer-field-label {
  height: 24px;
  min-height: 0;
  display: flex;
  align-items: center;
  margin: 0;
  line-height: 1.25;
  overflow: visible;
}

.search-primary-grid > .search-field > .search-source-label-row {
  align-items: center;
  justify-content: space-between;
}

.search-field-wide {
  grid-column: 1 / -1;
  padding: 0 0 4px;
  border: 0;
  background: transparent;
}

.search-field > label {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-text);
}

.search-source-label-row,
.filter-label-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.search-source-label-row > label,
.filter-label-row > label {
  min-width: 0;
  margin-bottom: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-text);
}

.search-source-advanced-filter,
.inline-advanced-filter {
  position: relative;
  flex: 0 0 auto;
}

.search-source-advanced-filter summary,
.inline-advanced-filter summary {
  margin: 0;
}

.search-source-advanced-filter .work-genuineness-field,
.inline-advanced-filter .work-genuineness-field {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 30;
  width: max-content;
  min-width: 230px;
}

.search-source-advanced-filter .work-genuineness-options,
.inline-advanced-filter .work-genuineness-options {
  flex-direction: column;
  align-items: flex-start;
  height: auto;
  min-height: 0;
  gap: 8px;
  padding: 10px 12px;
  border-color: rgba(199, 184, 141, 0.68);
  border-radius: 5px;
  background: var(--color-bg-surface);
  box-shadow: 0 8px 18px rgba(47, 36, 24, 0.1);
}

.search-field input:not([type="checkbox"]),
.search-field select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--color-border-strong);
  border-radius: 4px;
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  padding: 9px 11px;
  font: inherit;
  color-scheme: inherit;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease;
}

.search-field input:not([type="checkbox"]):focus,
.search-field select:focus,
.search-multiselect-toggle:focus {
  border-color: var(--color-focus);
  box-shadow: 0 0 0 3px var(--color-focus-ring-subtle);
  outline: 0;
}

.search-field input:not([type="checkbox"]):disabled,
.search-field select:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.search-query-row {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 0;
}

.search-query-row #queryInput {
  min-width: 0;
  min-height: 50px;
  font-size: 1rem;
  background: var(--color-bg-surface);
}

.search-query-row #queryInput::placeholder {
  color: var(--color-text-subtle);
}

.search-query-row #queryInput:not(:placeholder-shown) {
  background: var(--color-primary-tint-subtle);
}

.search-query-row #queryInput:-webkit-autofill,
.search-query-row #queryInput:-webkit-autofill:hover,
.search-query-row #queryInput:-webkit-autofill:focus,
.search-query-row #queryInput:-webkit-autofill:active {
  -webkit-text-fill-color: var(--color-text-strong);
  caret-color: var(--color-text-strong);
  -webkit-box-shadow: 0 0 0 1000px var(--color-primary-tint-subtle) inset;
  box-shadow: 0 0 0 1000px var(--color-primary-tint-subtle) inset;
}

.search-field .search-result-limit-select {
  width: 92px;
  min-width: 92px;
  text-align: center;
  font-variant-numeric: tabular-nums;
  padding-left: 8px;
  padding-right: 8px;
}

.search-multiselect {
  position: relative;
  min-width: 0;
}

.search-multiselect-toggle {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border: 1px solid var(--color-border-strong);
  border-radius: 4px;
  background: var(--color-bg-surface);
  color: var(--color-control-text);
  padding: 9px 11px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
  cursor: pointer;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease;
}

.search-multiselect-toggle:hover:not(:disabled) {
  border-color: var(--color-border-hover);
  background: var(--color-bg-surface-muted);
}

.search-multiselect-summary {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-multiselect-caret {
  position: relative;
  width: 12px;
  height: 8px;
  color: transparent;
  font-size: 0;
  flex: 0 0 auto;
  transform: translateY(1px);
  transition: transform 0.15s ease;
}

.search-multiselect-caret::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 8px;
}

.search-multiselect.is-open .search-multiselect-caret,
.search-multiselect-toggle[aria-expanded="true"] .search-multiselect-caret {
  transform: translateY(1px) rotate(180deg);
}

.search-multiselect-menu {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  right: 0;
  z-index: 20;
  border: 1px solid var(--color-border-strong);
  border-radius: 8px;
  background: var(--color-bg-surface);
  box-shadow: 0 10px 28px var(--color-shadow);
  max-height: min(280px, 45vh);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 6px;
}

/* Options-toolbar corpus menu: anchored popover above filters panel */
.search-options .search-multiselect {
  position: relative;
  overflow: visible;
}

.search-options .search-multiselect.is-open {
  z-index: 5;
}

.search-options .search-multiselect-menu {
  right: auto;
  width: max(100%, 280px);
  min-width: 100%;
  max-width: min(320px, calc(100vw - 32px));
  z-index: 6;
  max-height: min(300px, 50vh);
}

.search-multiselect-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 5px 4px;
  color: var(--color-text-strong);
  cursor: pointer;
}

.search-multiselect-option > span {
  min-width: 0;
  flex: 1 1 auto;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.search-multiselect-option:hover {
  background: var(--color-control-bg-hover);
}

.search-multiselect-empty {
  margin: 0;
  padding: 6px 4px;
  color: var(--primitive-ink-700);
  font-size: 0.84rem;
}

.search-multiselect-group-header {
  margin: 8px 0 2px;
  padding: 2px 4px;
  color: var(--color-text-brand);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.search-multiselect-search-wrap + .search-multiselect-group-header {
  margin-top: 2px;
}

.search-multiselect-search-wrap {
  position: sticky;
  top: 0;
  z-index: 2;
  margin: -6px -6px 6px;
  padding: 6px;
  border-bottom: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
}

.search-multiselect-search-input {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--color-border-strong);
  border-radius: 0;
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  padding: 6px 8px;
}

.search-multiselect-search-input:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 1px;
}

.backlinks-main-panel {
  padding-bottom: 14px;
}

.page--backlinks .search-stage.backlinks-main-panel {
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.page--backlinks .search-column {
  display: grid;
  gap: 16px;
  align-content: start;
}

.page--backlinks .search-intro-block {
  margin-bottom: 8px;
}

.backlinks-verse-stage {
  display: grid;
  gap: 0;
  min-width: 0;
  margin-top: 4px;
}

/* Compact landing / change-verse picker */
.backlinks-verse-picker.scripture-locator-panel {
  margin: 0;
  padding: 14px 14px 12px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--search-control-radius, 7px);
  background: var(--color-bg-surface);
  box-shadow: none;
  min-width: 0;
}

.backlinks-verse-picker__title {
  margin: 0 0 4px;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.02rem;
  font-weight: 650;
  line-height: 1.3;
}

.backlinks-verse-picker__guide {
  margin: 0 0 12px;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  line-height: 1.4;
}

.backlinks-verse-picker__guide[hidden] {
  display: none !important;
}

.backlinks-verse-picker__flow,
.page--backlinks .scripture-locator-flow {
  margin: 0;
}

.backlinks-verse-picker__grid,
.page--backlinks .scripture-locator-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(9.5rem, 1fr)) auto;
  gap: 8px 10px;
  align-items: end;
  min-width: 0;
}

.backlinks-verse-picker .reader-filter-field {
  margin: 0;
  min-width: 0;
}

.backlinks-verse-picker .reader-filter-field label {
  display: block;
  margin: 0 0 4px;
  color: var(--color-text-muted);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.25;
}

.backlinks-verse-picker .scripture-locator-select,
.backlinks-verse-picker .reader-filter-field select {
  width: 100%;
  min-height: 40px;
  height: 40px;
  padding: 6px 10px;
  border: 1px solid var(--color-border-control, var(--color-border-strong));
  border-radius: var(--search-control-radius, 7px);
  background: var(--color-bg-surface);
  color: var(--color-control-text, var(--color-text-strong));
  box-sizing: border-box;
}

.backlinks-verse-picker .scripture-locator-select:disabled,
.backlinks-verse-picker .reader-filter-field select:disabled {
  color: var(--color-text-muted);
  border-color: var(--color-border-muted);
  background: var(--color-control-bg-disabled, var(--color-bg-surface-muted));
  opacity: 1;
  cursor: not-allowed;
}

.backlinks-verse-picker__submit,
.page--backlinks .scripture-locator-actions {
  margin: 0;
  min-width: 0;
}

.backlinks-verse-picker .scripture-locator-submit,
.page--backlinks .scripture-locator-submit {
  width: auto;
  min-height: 40px;
  height: 40px;
  padding: 0 14px;
  white-space: nowrap;
  border-radius: var(--search-control-radius, 7px);
}

.page--backlinks .scripture-locator-status,
.page--backlinks .scripture-locator-invalid-notice {
  margin: 8px 0 0;
}

.page--backlinks .scripture-locator-body[hidden] {
  display: none !important;
}

/* When the locator body is collapsed, hide the whole picker shell so its
   border/padding do not leave an empty rounded bar under the selected verse. */
#backlinksLocatorSection:has(> #backlinksLocatorBody[hidden]),
#backlinksLocatorSection[hidden] {
  display: none !important;
}

/* Unified compact selected-verse panel */
.backlinks-verse-selected {
  margin: 0;
  min-width: 0;
}

.backlinks-verse-selected[hidden] {
  display: none !important;
}

.backlinks-verse-selected:has(#backlinksLocatorChangeWrap[hidden]) {
  display: none !important;
}

.backlinks-verse-selected__shell {
  display: grid;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 12px 14px 13px;
  border: 1px solid var(--color-border-strong);
  border-top: 3px solid var(--color-primary-800);
  border-radius: 0;
  background: var(--color-bg-surface-muted);
  box-sizing: border-box;
}

.backlinks-verse-selected__top {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-start;
  gap: 6px 16px;
  min-width: 0;
}

.backlinks-verse-selected__ref,
.backlinks-verse-reference {
  margin: 0;
  min-width: 0;
  flex: 0 1 auto;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.02rem;
  font-weight: 650;
  line-height: 1.3;
  color: var(--reading-title, var(--color-text-strong));
  overflow-wrap: anywhere;
}

.backlinks-verse-selected__action {
  margin: 0;
  flex: 0 0 auto;
}

.backlinks-verse-selected__change,
.page--backlinks .scripture-locator-change-toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  margin: 0;
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: var(--search-control-radius, 7px);
  background: transparent;
  color: var(--color-text-brand);
  font: inherit;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.25;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
}

.backlinks-verse-selected__change:hover,
.page--backlinks .scripture-locator-change-toggle:hover {
  background: var(--color-control-bg-soft, var(--color-bg-surface-muted));
  border-color: var(--color-border-muted);
}

.backlinks-verse-selected__change:focus-visible,
.page--backlinks .scripture-locator-change-toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium, var(--color-focus));
  outline-offset: 2px;
}

.backlinks-verse-selected__change-arrow {
  font-weight: 500;
  opacity: 0.85;
}

.backlinks-verse-selected__text,
.backlinks-verse-excerpt {
  margin: 0;
  padding: 2px 0 2px 14px;
  border: 0;
  border-left: 3px solid var(--reading-link, var(--color-border));
  background: transparent;
  box-shadow: none;
  color: var(--reading-text-strong, var(--color-text-strong));
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: var(--reading-original-size, 1.05rem);
  line-height: var(--reading-original-line-height, 1.65);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: normal;
}

.backlinks-verse-selected__text[hidden],
.backlinks-verse-excerpt[hidden] {
  display: none !important;
}

.backlinks-status {
  margin: 0;
  min-height: 0;
}

.backlinks-status:empty,
.backlinks-status[hidden] {
  display: none !important;
}

.page--backlinks[aria-busy="true"] .backlinks-status:not([hidden]):not(:empty) {
  margin: 0;
  padding: 8px 0;
  border: 0;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.9rem;
}

/* Compact filter toolbar */
.backlinks-filters-toolbar {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 11px 14px 13px;
  border: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface-muted);
  position: relative;
  z-index: 3;
}

.backlinks-filters-toolbar[hidden] {
  display: none !important;
}

.backlinks-filters-toolbar__label {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.3;
}

.backlinks-filters-row.search-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.backlinks-filters-row .backlinks-filter-field {
  display: block;
  margin: 0;
  min-width: 0;
  flex: 1 1 150px;
  max-width: 240px;
}

.backlinks-filters-row .search-multiselect {
  width: 100%;
  min-width: 0;
}

.backlinks-filters-row .search-multiselect-toggle {
  width: 100%;
  min-height: var(--search-control-height, 36px);
  height: var(--search-control-height, 36px);
  box-sizing: border-box;
}

.backlinks-advanced-toggle.is-active,
.backlinks-advanced-toggle.is-expanded {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.backlinks-advanced-disclosure {
  margin: 8px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--search-control-radius, 7px);
  background: var(--color-bg-surface);
  box-shadow: var(--search-shell-shadow, 0 2px 10px var(--color-shadow));
  max-width: 100%;
}

.backlinks-advanced-disclosure[hidden] {
  display: none !important;
}

.backlinks-filter-advanced,
.backlinks-advanced-disclosure .work-genuineness-field {
  position: static;
  width: 100%;
  min-width: 0;
  margin: 0;
}

.backlinks-advanced-clear {
  margin-top: 10px;
  min-height: 36px;
}

.backlinks-advanced-clear[hidden] {
  display: none !important;
}

/* Synthesis launcher — secondary to primary results */
.backlinks-synthesis-launcher {
  position: relative;
  margin: 0;
  padding: 10px 2px;
  border: 0;
  border-block: 1px solid var(--color-border-muted);
  background: transparent;
  z-index: 2;
}

.backlinks-synthesis-launcher[hidden] {
  display: none !important;
}

.backlinks-synthesis-launcher__main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  min-width: 0;
}

.backlinks-synthesis-launcher.is-compact .backlinks-synthesis-launcher__main {
  align-items: center;
}

.backlinks-synthesis-launcher__copy {
  display: grid;
  gap: 3px;
  min-width: 0;
  flex: 1 1 180px;
}

.backlinks-synthesis-launcher__title {
  margin: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-text-strong);
}

.backlinks-synthesis-launcher.is-compact .backlinks-synthesis-launcher__title {
  font-size: 0.92rem;
  font-weight: 600;
}

.backlinks-synthesis-launcher__help {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: 1.4;
}

.backlinks-synthesis-launcher__help[hidden] {
  display: none !important;
}

.backlinks-synthesis-launcher__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
  min-width: 0;
}

.backlinks-synthesis-options-toggle,
.backlinks-synthesis-collapse-toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--color-border-control, var(--color-border-muted));
  border-radius: var(--search-control-radius, 7px);
  background: var(--color-bg-surface);
  color: var(--color-text-muted);
  cursor: pointer;
  box-sizing: border-box;
}

.backlinks-synthesis-options-toggle:hover,
.backlinks-synthesis-collapse-toggle:hover {
  border-color: var(--color-border-control-active, var(--color-border));
  background: var(--color-control-bg-soft, var(--color-bg-surface-muted));
  color: var(--color-text-strong);
}

.backlinks-synthesis-options-toggle:focus-visible,
.backlinks-synthesis-collapse-toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium, var(--color-focus));
  outline-offset: 2px;
}

.backlinks-synthesis-options-toggle.is-expanded,
.backlinks-synthesis-options-toggle[aria-expanded="true"] {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.backlinks-synthesis-collapse-toggle.is-collapsed .backlinks-synthesis-collapse-toggle__icon {
  transform: rotate(180deg);
}

.backlinks-synthesis-options-toggle__icon,
.backlinks-synthesis-collapse-toggle__icon {
  display: inline-flex;
  line-height: 0;
  transition: transform 0.15s ease;
}

.backlinks-synthesis-options-toggle__icon svg,
.backlinks-synthesis-collapse-toggle__icon svg {
  display: block;
}

.backlinks-synthesis-collapse-toggle[hidden] {
  display: none !important;
}

.backlinks-summary-button,
.backlinks-synthesis-launcher__primary {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid var(--action-primary-border, var(--color-focus-ring-header));
  background: var(--action-primary-bg, var(--color-primary-tint-subtle));
  color: var(--action-primary-text, var(--color-text-brand));
  font-family: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 8px 12px;
  min-height: 40px;
  border-radius: var(--search-control-radius, 7px);
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  max-width: 100%;
  white-space: normal;
}

.backlinks-synthesis-launcher.is-compact .backlinks-summary-button {
  border-color: var(--action-secondary-border, var(--color-border-muted));
  background: var(--action-secondary-bg, var(--color-bg-surface));
  color: var(--action-secondary-text, var(--color-text-strong));
}

.backlinks-summary-button:hover:not(:disabled),
.backlinks-synthesis-launcher__primary:hover:not(:disabled) {
  border-color: var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
}

.backlinks-synthesis-launcher.is-compact .backlinks-summary-button:hover:not(:disabled) {
  border-color: var(--action-secondary-border-hover, var(--color-border));
  background: var(--action-secondary-bg-hover, var(--color-control-bg-soft));
  color: var(--action-secondary-text, var(--color-text-strong));
}

.backlinks-summary-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong, var(--color-focus));
  outline-offset: 2px;
}

.backlinks-summary-button:disabled {
  border-color: var(--badge-muted-border, var(--color-border-muted));
  background: var(--badge-muted-bg, var(--color-control-bg-disabled));
  color: var(--color-text-subtle);
  cursor: not-allowed;
}

.backlinks-summary-button.is-loading {
  cursor: wait;
}

.backlinks-actions-row,
.backlinks-synthesis-options {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
  margin: 8px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: var(--search-control-radius, 7px);
  background: var(--color-bg-surface);
  box-shadow: none;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  width: min(100%, 34rem);
  max-width: 100%;
  z-index: 6;
  box-sizing: border-box;
}

.backlinks-actions-row[hidden],
.backlinks-synthesis-options[hidden] {
  display: none !important;
}

.backlinks-range-field {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 6px 8px;
  min-width: 0;
  flex: 1 1 0%;
}

.backlinks-range-pair {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px 8px;
  min-width: 0;
}

.backlinks-range-field-label {
  font-size: 0.84rem;
  color: var(--color-text-muted);
  font-weight: 600;
  white-space: nowrap;
}

.backlinks-range-select {
  min-width: 4.5rem;
  max-width: 100%;
  min-height: 36px;
  padding: 4px 8px;
  border: 1px solid var(--color-border-control, var(--color-border-strong));
  background: var(--color-bg-surface-raised, var(--color-bg-surface));
  color: var(--color-text-strong);
  font-size: 0.9rem;
  font-family: inherit;
  border-radius: var(--search-control-radius, 7px);
  box-sizing: border-box;
}

.backlinks-range-select:disabled {
  background: var(--color-control-bg-disabled);
  color: var(--color-text-subtle);
  cursor: not-allowed;
}

.backlinks-range-separator {
  color: var(--color-text-subtle);
  font-weight: 600;
  align-self: center;
  padding-bottom: 2px;
}

.backlinks-range-divider {
  display: inline-block;
  width: 1px;
  height: 22px;
  margin: 0 4px;
  background: var(--color-border-muted);
  align-self: center;
}

.backlinks-summary-gate {
  margin: 8px 0 0;
  font-size: 0.8rem;
  color: var(--color-text-brand);
  max-width: 42rem;
  line-height: 1.4;
}

.backlinks-summary-gate[hidden] {
  display: none;
}

.backlinks-summary-section {
  margin: 0 0 14px;
}

.backlinks-empty-card {
  display: grid;
  gap: 12px;
  margin: 8px 0 0;
  padding: 14px 0;
  border: 0;
  border-top: 1px solid var(--color-border-muted);
  border-radius: 0;
  background: transparent;
  color: var(--color-text-muted);
}

.backlinks-empty-card[hidden] {
  display: none !important;
}

.backlinks-empty-card__message {
  margin: 0;
  line-height: 1.45;
  color: var(--color-text);
}

.backlinks-clear-filters-button {
  justify-self: start;
  min-height: 40px;
}

.backlinks-results-summary {
  display: grid;
  gap: 6px;
  margin: 0;
  min-width: 0;
  width: 100%;
}

.backlinks-results-authors {
  margin: 2px 0 0;
  min-width: 0;
  width: 100%;
}

.backlinks-results-authors[hidden] {
  display: none !important;
}

.backlinks-results-authors__list {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  width: 100%;
  margin: 0;
  padding: 0;
  column-gap: 0;
  row-gap: 0.35em;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: 1.55;
  list-style: none;
  overflow-wrap: anywhere;
}

.backlinks-results-authors__list .search-answer-sources__item,
.backlinks-results-authors__list .search-answer-sources__separator {
  display: inline;
}

.backlinks-results-authors__list a {
  color: var(--color-text-brand);
  text-decoration: none;
  font-weight: 500;
}

.backlinks-results-authors__list a:hover,
.backlinks-results-authors__list a:focus-visible {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.backlinks-results-authors__list a:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium, var(--color-focus));
  outline-offset: 2px;
  border-radius: 2px;
}

.backlinks-results-summary__context {
  margin: 0;
  color: var(--color-text-subtle, var(--color-text-muted));
  font-size: 0.86rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.backlinks-results-summary__context[hidden] {
  display: none !important;
}

.backlinks-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin: 0 0 10px;
}

@media (max-width: 1100px) {
  .backlinks-verse-picker__grid,
  .page--backlinks .scripture-locator-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .backlinks-verse-picker__submit,
  .page--backlinks .scripture-locator-actions {
    grid-column: 1 / -1;
  }

  .backlinks-verse-picker .scripture-locator-submit,
  .page--backlinks .scripture-locator-submit {
    width: 100%;
  }
}

@media (max-width: 920px) {
  .backlinks-filters-row .backlinks-filter-field {
    flex: 1 1 calc(50% - 8px);
    max-width: none;
  }
}

@media (max-width: 720px) {
  .backlinks-verse-selected__top {
    flex-wrap: wrap;
    align-items: center;
  }

  .backlinks-verse-selected__change,
  .page--backlinks .scripture-locator-change-toggle {
    min-height: 40px;
  }

  .backlinks-verse-picker__grid,
  .page--backlinks .scripture-locator-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .backlinks-verse-picker__submit,
  .page--backlinks .scripture-locator-actions {
    grid-column: 1 / -1;
  }

  .backlinks-verse-picker .scripture-locator-submit,
  .page--backlinks .scripture-locator-submit {
    width: 100%;
  }

  .backlinks-filters-row.search-options {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
  }

  .backlinks-filters-row .backlinks-filter-field,
  .backlinks-advanced-toggle {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
  }

  .backlinks-advanced-toggle,
  .backlinks-filters-row .search-multiselect-toggle {
    min-height: 44px;
    height: auto;
  }

  .backlinks-synthesis-launcher__main {
    flex-direction: column;
    align-items: stretch;
  }

  .backlinks-synthesis-launcher__actions {
    width: 100%;
    flex-wrap: nowrap;
  }

  .backlinks-summary-button {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    min-height: 44px;
    justify-content: center;
  }

  .backlinks-synthesis-options-toggle,
  .backlinks-synthesis-collapse-toggle {
    flex: 0 0 auto;
    width: 2.75rem;
    min-width: 2.75rem;
    min-height: 44px;
  }

  .backlinks-actions-row,
  .backlinks-synthesis-options {
    position: static;
    width: 100%;
    right: auto;
    top: auto;
  }

  .backlinks-actions-row,
  .backlinks-synthesis-options,
  .backlinks-range-field {
    flex-direction: column;
    align-items: stretch;
  }

  .backlinks-range-field {
    flex-direction: column;
    align-items: stretch;
  }

  .backlinks-range-pair {
    width: 100%;
    justify-content: space-between;
  }

  .backlinks-range-select {
    min-width: 5rem;
  }

  .backlinks-range-divider,
  .backlinks-range-separator {
    display: none;
  }

  .backlinks-summary-gate {
    max-width: none;
  }
}

/* Scripture backlinks — mobile / narrow viewports (≤48rem). */
@media (max-width: 48rem) {
  .backlinks-main-panel {
    padding: 12px 0 14px;
  }

  .backlinks-verse-selected__text,
  .backlinks-verse-excerpt {
    padding-left: 12px;
  }

  .backlinks-results-header__top {
    gap: 8px;
  }

  .backlinks-results-summary__context {
    margin-top: 4px;
    overflow-wrap: anywhere;
  }

  .backlinks-results-panel {
    padding: 0;
    min-width: 0;
  }

  .backlinks-results-list {
    padding-left: 0;
  }

  .backlinks-result-item,
  .backlinks-result-card,
  .result-card.backlinks-result-card {
    min-width: 0;
    max-width: 100%;
  }

  .backlinks-result-title-row,
  .backlinks-result-link,
  .backlinks-result-work,
  .backlinks-result-snippet,
  .backlinks-result-meta,
  .page--backlinks .search-result-original-text,
  .page--backlinks .search-result-author,
  .page--backlinks .search-result-work,
  .page--backlinks .search-result__title-line,
  .page--backlinks .search-result-work-line,
  .page--patristic-references .search-result-original-text,
  .page--patristic-references .search-result-author,
  .page--patristic-references .search-result-work,
  .page--patristic-references .search-result__title-line {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .backlinks-result-translation-panel:not([hidden]),
  .backlinks-result-details-panel:not([hidden]),
  .page--backlinks .search-result-translation-panel:not([hidden]),
  .page--backlinks .search-result-details-panel:not([hidden]) {
    overflow: visible;
    max-width: 100%;
  }

  .backlinks-result-details-panel .search-result-detail-row,
  .backlinks-result-details-panel .search-result-detail-row dd,
  .page--backlinks .search-result-details-panel .search-result-detail-row,
  .page--backlinks .search-result-details-panel .search-result-detail-row dd {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

@media (max-width: 23.4375rem) {
  .backlinks-range-pair {
    flex-wrap: wrap;
  }

  .backlinks-range-field-label {
    white-space: normal;
  }
}

@media (max-width: 360px) {
  .backlinks-verse-picker__grid,
  .page--backlinks .scripture-locator-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  .backlinks-verse-selected__top {
    flex-wrap: wrap;
    align-items: baseline;
  }

  .backlinks-verse-selected__change,
  .page--backlinks .scripture-locator-change-toggle {
    min-height: 44px;
  }

  .backlinks-filters-row .backlinks-filter-field {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
  }

  .backlinks-synthesis-launcher__actions {
    width: 100%;
  }

  .backlinks-summary-button {
    flex: 1 1 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .backlinks-summary-button,
  .backlinks-verse-selected__change,
  .page--backlinks .scripture-locator-change-toggle,
  .backlinks-synthesis-options-toggle,
  .backlinks-synthesis-collapse-toggle,
  .backlinks-synthesis-collapse-toggle__icon,
  .page--backlinks .backlinks-result-card.result-card,
  .page--patristic-references .backlinks-result-card.result-card {
    transition: none;
  }
}


.backlinks-whole-corpus-heading {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-text-brand);
  line-height: 1.2;
}

.advanced-filter-details {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
}

.advanced-filter-details summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  justify-self: start;
  width: auto;
  min-height: 28px;
  margin: 0;
  padding: 4px 9px;
  border: 1px solid var(--color-border-control);
  border-radius: 4px;
  background: var(--color-control-bg-soft);
  color: var(--primitive-ink-700);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.35;
  cursor: pointer;
  box-sizing: border-box;
  list-style: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.advanced-filter-details summary::-webkit-details-marker {
  display: none;
}

.advanced-filter-details summary::after {
  content: "";
  width: 12px;
  height: 8px;
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 8px;
  flex: 0 0 auto;
  transform: translateY(1px);
  transition: transform 0.15s ease;
}

.advanced-filter-details[open] summary {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.advanced-filter-details[open] summary::after {
  transform: translateY(1px) rotate(180deg);
}

.advanced-filter-details summary:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

.advanced-filter-details summary:hover {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.work-genuineness-field {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
}

.work-genuineness-heading {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-text-brand);
  line-height: 1.2;
}

.work-genuineness-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 18px;
  height: 36px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--color-border-strong);
  border-radius: 0;
  background: var(--color-bg-surface);
  box-sizing: border-box;
  line-height: 1;
}

.work-genuineness-options:focus-within {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  border-color: var(--color-focus);
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.work-genuineness-option,
.search-field .work-genuineness-option,
.reader-filter-field .work-genuineness-option {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  color: var(--color-text-strong);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.01em;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}

.work-genuineness-option input[type="checkbox"],
.search-field .work-genuineness-option input[type="checkbox"],
.reader-filter-field .work-genuineness-option input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 1px;
  margin: 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}

.work-genuineness-option span {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
}

.work-genuineness-option span::before {
  content: "";
  width: 13px;
  height: 13px;
  margin-right: 6px;
  border: 1px solid #bcae86;
  background: #ffffff;
  box-sizing: border-box;
  flex: 0 0 auto;
}

.work-genuineness-option input[type="checkbox"]:checked + span::before {
  border-color: var(--color-focus);
  background: var(--color-bg-surface);
}

.work-genuineness-option input[type="checkbox"]:checked + span::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 50%;
  width: 4px;
  height: 8px;
  border: solid var(--color-focus);
  border-width: 0 2px 2px 0;
  transform: translateY(-58%) rotate(45deg);
}

.work-genuineness-option input[type="checkbox"]:focus-visible + span::before {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

.work-genuineness-option:hover {
  color: var(--color-text-brand);
}

@media (max-width: 720px) {
  .semantic-access-notice {
    grid-template-columns: 1fr;
    gap: 13px;
    margin: 12px 0 14px;
    padding: 14px 13px;
  }

  .semantic-access-notice p {
    font-size: 0.86rem;
    line-height: 1.48;
  }

  .semantic-access-notice__actions {
    justify-content: stretch;
    min-width: 0;
  }

  .semantic-access-notice__actions button {
    width: 100%;
  }

  body.search-advanced-locked .semantic-preview-locked-region {
    margin-top: 4px;
    padding-top: 7px;
  }

  body.search-advanced-locked .semantic-preview-locked-region::after {
    opacity: 0.16;
  }

  body.search-advanced-locked .semantic-preview-locked-region__header {
    margin-bottom: 7px;
    padding-bottom: 7px;
  }

  .semantic-preview-locked-region__header p {
    font-size: 0.8rem;
    line-height: 1.38;
  }

  .work-genuineness-options {
    flex-direction: column;
    align-items: flex-start;
    height: auto;
    padding: 6px 10px;
    gap: 6px;
    line-height: 1.35;
  }

  .work-genuineness-option {
    line-height: 1.35;
  }
}

.backlinks-whole-corpus-control {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 36px;
  margin: 0;
  padding: 6px 10px;
  border: 1px solid var(--color-border-strong);
  border-radius: 0;
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  cursor: pointer;
  box-sizing: border-box;
}

.backlinks-whole-corpus-control:hover {
  background: var(--color-control-bg-hover);
}

.backlinks-whole-corpus-control:focus-within {
  outline: 2px solid var(--color-focus);
  outline-offset: 1px;
}

.backlinks-whole-corpus-control__text {
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.01em;
}

.backlinks-author-search-wrap {
  position: sticky;
  top: 0;
  z-index: 2;
  margin: -6px -6px 6px;
  padding: 6px;
  border-bottom: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
}

.backlinks-author-search-input {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--color-border-strong);
  border-radius: 0;
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  padding: 6px 8px;
}

.backlinks-author-search-input:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 1px;
}

.backlinks-results-panel {
  padding: 0;
  margin-top: 8px;
  border-top: 0;
  min-width: 0;
}

.page--backlinks .backlinks-summary-section,
.page--backlinks .backlinks-results-panel > .search-column {
  width: 100%;
  max-width: var(--search-content-max-width, 880px);
  margin-inline: auto;
}

.page--backlinks .backlinks-summary-section {
  margin-top: 12px;
  margin-bottom: 14px;
}

.backlinks-results-header {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 11px 14px 12px;
  min-width: 0;
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  background: var(--color-bg-surface-muted);
  box-shadow: none;
}

.backlinks-results-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  border: 0;
  background: transparent;
}

.backlinks-results-header__title {
  margin: 0;
  min-width: 0;
  flex: 0 1 auto;
  width: fit-content;
  max-width: 100%;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.backlinks-results-header__actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  margin-left: auto;
}

.backlinks-results-header__summary {
  min-width: 0;
  width: 100%;
}

.backlinks-results-title {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.3;
  min-width: 0;
  overflow-wrap: anywhere;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0;
  appearance: none;
  border-radius: 0;
}

.backlinks-results-title__main {
  font: inherit;
  color: inherit;
}

.backlinks-results-title__reference {
  font-family: inherit;
  font-size: 0.92em;
  font-weight: 600;
  line-height: inherit;
  color: var(--color-text-muted);
  white-space: normal;
  overflow-wrap: anywhere;
}

.backlinks-results-title__reference[hidden] {
  display: none !important;
}

/* Programmatic/a11y focus must not look like an input control. */
.backlinks-results-title:focus {
  outline: none;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0;
}

.backlinks-results-title:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium, var(--color-focus));
  outline-offset: 4px;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0;
}

.backlinks-results-stats {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.backlinks-results-stats[hidden] {
  display: none !important;
}

.results-export-actions-host {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}

.results-export-actions-host[hidden] {
  display: none !important;
}

.result-count-note {
  margin: 0 0 12px;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.backlinks-results-list {
  margin: 10px 0 0;
  padding-left: 0;
  display: grid;
  gap: 10px;
  list-style: none;
  min-width: 0;
}

.backlinks-result-item {
  margin: 0;
  min-width: 0;
}

.backlinks-result-verse-group {
  margin: 0;
  padding: 10px 0 0;
  list-style: none;
}

.backlinks-result-verse-group:first-child {
  padding-top: 2px;
}

.backlinks-result-verse-heading {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.95rem;
  font-weight: 650;
  line-height: 1.35;
}

.backlinks-result-verse-heading__link,
.backlinks-result-verse-heading__link:visited {
  color: var(--color-text-brand);
  text-decoration: none;
}

.backlinks-result-verse-heading__link:hover {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.backlinks-result-verse-heading__link:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium, var(--color-focus));
  outline-offset: 3px;
  border-radius: 2px;
}

.page--backlinks .backlinks-result-card.result-card,
.page--patristic-references .backlinks-result-card.result-card {
  padding: 13px 15px 12px;
  border: 1px solid var(--color-border-muted);
  border-inline-start: 2px solid var(--color-accent-gold);
  border-radius: 0;
  background: var(--color-bg-surface);
  box-shadow: none;
}

.page--backlinks .backlinks-result-card.result-card:hover,
.page--patristic-references .backlinks-result-card.result-card:hover {
  border-color: var(--color-border);
  border-inline-start-color: var(--color-accent-gold);
  background: var(--color-bg-surface-raised);
  box-shadow: none;
}

.page--backlinks .backlinks-result-snippet,
.page--patristic-references .backlinks-result-snippet {
  font-size: 1.02rem;
  line-height: 1.72;
  text-wrap: pretty;
}

.page--backlinks .backlinks-result-actions,
.page--patristic-references .backlinks-result-actions {
  padding-top: 1px;
}

.page--backlinks .backlinks-result-actions .result-action,
.page--backlinks .backlinks-result-actions .search-result-action,
.page--patristic-references .backlinks-result-actions .result-action,
.page--patristic-references .backlinks-result-actions .search-result-action {
  min-height: 34px;
  border-radius: 3px;
}

.page--backlinks .search-result__copy,
.page--backlinks .results-export-actions__button,
.page--patristic-references .search-result__copy {
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  border-radius: 3px;
  background: var(--color-bg-surface);
}

.backlinks-result-title-row,
.backlinks-result-number,
.search-result__title-line .backlinks-result-number {
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.search-result__title-line .backlinks-result-number {
  display: inline-grid;
  place-items: center;
  flex: 0 0 1.65rem;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 999px;
  background: var(--color-primary-tint-subtle);
  color: var(--color-primary-800);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

.backlinks-result-link,
.backlinks-result-link:visited,
.page--backlinks .search-result-author-link,
.page--backlinks .search-result-author-link:visited,
.page--patristic-references .search-result-author-link,
.page--patristic-references .search-result-author-link:visited {
  color: var(--color-text-brand);
  text-decoration: none;
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
}

.backlinks-result-link:hover,
.backlinks-result-link:focus-visible,
.page--backlinks .search-result-author-link:hover,
.page--backlinks .search-result-author-link:focus-visible,
.page--patristic-references .search-result-author-link:hover,
.page--patristic-references .search-result-author-link:focus-visible {
  color: var(--color-text-brand);
  text-decoration: underline;
  text-decoration-thickness: 0.07em;
  text-underline-offset: 0.18em;
}

.search-multiselect.is-open .search-multiselect-toggle {
  border-color: var(--color-focus);
}

.search-multiselect.is-disabled .search-multiselect-toggle,
.search-multiselect-toggle:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.search-multiselect-toggle:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 1px;
}

.search-field-help {
  margin: 2px 0 0;
  color: var(--primitive-ink-700);
  font-size: 0.83rem;
  line-height: 1.48;
}

.search-answer-field {
  padding: 0 0 0 10px;
  border: 0;
  border-left: 1px solid var(--color-focus-ring-subtle);
  border-radius: 0;
  background: transparent;
}

.search-answer-toggle {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  margin: 1px 0 0;
  min-height: 38px;
  padding: 5px 6px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.25;
  cursor: pointer;
}

.search-answer-toggle:hover,
.search-answer-toggle:focus-within {
  background: rgba(255, 250, 240, 0.65);
}

.search-answer-footer-option {
  position: relative;
  display: grid;
  gap: 3px;
  align-content: center;
  min-height: 40px;
  color: var(--color-text-strong);
}

.search-answer-toggle-compact {
  min-height: 32px;
  margin: 0;
  padding: 3px 6px;
  font-size: 0.86rem;
  white-space: nowrap;
}

.search-answer-footer-help {
  display: none;
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.search-field input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 0;
  padding: 0;
  flex: 0 0 auto;
  accent-color: var(--color-focus);
}

.search-answer-field-label {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-text);
}

.search-answer-field .search-field-help {
  margin-top: 3px;
  color: var(--color-text-muted);
  font-size: 0.8rem;
  line-height: 1.42;
}

.search-answer-presentation-field {
  align-content: start;
}

.search-answer-advanced-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  justify-self: start;
  width: auto;
  min-height: 28px;
  margin: 8px 0 0;
  padding: 4px 9px;
  border: 1px solid var(--color-border-control);
  border-radius: 4px;
  background: var(--color-control-bg-soft);
  color: var(--color-control-text);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.35;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.search-answer-advanced-toggle:hover {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.search-answer-advanced-toggle:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.search-answer-advanced-toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

.search-answer-advanced-caret {
  position: relative;
  width: 12px;
  height: 8px;
  color: transparent;
  font-size: 0;
  line-height: 0;
  flex: 0 0 auto;
  transform: translateY(1px);
  transition: transform 0.15s ease;
}

.search-answer-advanced-caret::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 8px;
}

.search-answer-advanced-toggle[aria-expanded="true"] .search-answer-advanced-caret {
  transform: translateY(1px) rotate(180deg);
}

.search-answer-advanced-toggle[aria-expanded="true"] {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.search-answer-advanced-options {
  display: grid;
  gap: 10px;
  margin-top: 8px;
  padding: 10px 11px;
  border: 0;
  border-top: 1px solid rgba(215, 204, 176, 0.62);
  border-radius: 0;
  background: transparent;
}

.search-answer-advanced-options[hidden] {
  display: none;
}

.search-answer-thinking-field {
  margin-top: 0;
}

.search-answer-thinking-field select {
  max-width: 100%;
}

.llm-gated-control {
  position: relative;
}

.llm-gated-control.llm-gated-disabled {
  cursor: help;
}

.llm-gate-help {
  position: absolute;
  z-index: 20;
  left: 0;
  right: 0;
  top: calc(100% - 2px);
  padding: 10px 12px;
  border: 1px solid #bda869;
  border-radius: 8px;
  background: #fff8e5;
  box-shadow: 0 10px 22px rgba(47, 36, 24, 0.18);
  color: #3f2f1d;
  font-size: 0.88rem;
  line-height: 1.45;
}

.llm-gate-help a {
  color: var(--color-text-brand);
  font-weight: 700;
}

/*
 * Desktop account group: same surface as the nav bar.
 * Separation = right-aligned cluster + short divider (not a full-height panel).
 */
.member-panel {
  align-self: center;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-inline-start: auto;
  margin-left: auto;
  min-height: 0;
  padding: 0;
  padding-inline-start: 0.95rem;
  border: 0;
  border-inline-start: 1px solid var(--site-nav-account-divider);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--site-nav-text);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
}

.member-panel:not(:has(.member-account-button, button:not([hidden]))) {
  border-inline-start: 0;
  padding-inline-start: 0;
}

.member-account-button {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--site-nav-text);
  padding: 4px 11px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  box-sizing: border-box;
  transition:
    background-color 120ms ease,
    color 120ms ease;
}

.member-account-button:hover {
  border-color: transparent;
  background: var(--site-nav-hover-bg);
  color: var(--site-nav-hover-text);
  text-decoration: none;
}

.member-account-button.active,
.member-account-button[aria-current="page"] {
  border-color: transparent;
  background: var(--site-nav-active-bg);
  color: var(--site-nav-active-text);
  font-weight: 700;
  box-shadow: inset 0 calc(-1 * var(--site-nav-active-indicator-thickness, 1.5px)) 0 var(--site-nav-active-indicator);
}

.member-account-button:focus-visible,
.member-actions button:focus-visible {
  outline: 2px solid var(--site-nav-focus);
  outline-offset: 2px;
}

.member-actions {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

.member-actions button {
  min-height: 36px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--site-nav-logout);
  padding: 4px 11px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.76rem;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background-color 120ms ease,
    color 120ms ease;
}

.member-actions button:hover {
  border-color: transparent;
  background: var(--site-nav-hover-bg);
  color: var(--site-nav-hover-text);
  text-decoration: none;
}

.member-actions button:focus-visible {
  outline: 2px solid var(--site-nav-focus);
  outline-offset: 2px;
}

.member-actions button#memberLoginButton {
  display: inline-grid;
  width: 19px;
  height: 19px;
  place-items: center;
  border: 1px solid #4b5563;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #f8fafc 0%, #6b7280 55%, #374151 100%);
  color: #fff;
  font-family: Inter, system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}

.member-actions button#memberLoginButton[hidden] {
  display: none;
}

.profile-panel {
  background: var(--color-bg-surface-raised);
  border: 1px solid var(--color-border);
  border-top: 4px solid var(--color-primary-800);
  border-radius: 2px;
  padding: 16px;
}

/* ---------- Profile hero ---------- */

.profile-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px 18px;
  padding: 14px 16px 18px;
  margin: -16px -16px 18px;
  background: linear-gradient(180deg, var(--color-bg-surface-muted) 0%, var(--color-control-bg-active) 100%);
  border-bottom: 1px solid var(--color-border-strong);
}

.profile-hero-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--color-primary-800) 0%, var(--color-primary-950) 100%);
  color: var(--color-text-inverse);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px var(--color-shadow-strong);
  text-transform: uppercase;
}

.profile-hero[data-state="guest"] .profile-hero-avatar {
  background: linear-gradient(180deg, var(--color-border-strong) 0%, var(--color-border-hover) 100%);
  color: var(--color-text-strong);
}

.profile-hero[data-state="guest"] {
  grid-template-columns: minmax(0, 1fr);
}

.profile-hero[data-state="loading"] {
  grid-template-columns: minmax(0, 1fr);
}

.profile-hero[data-state="guest"] .profile-hero-avatar {
  display: none;
}

.profile-hero[data-state="loading"] .profile-hero-avatar {
  display: none;
}

.profile-hero-identity {
  min-width: 0;
}

.profile-hero-title {
  margin: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.32rem;
  line-height: 1.2;
  color: var(--color-text-brand);
}

.profile-hero-subtitle {
  margin: 4px 0 0;
  color: var(--color-text-muted);
  font-size: 0.92rem;
}

.profile-hero-email {
  margin: 4px 0 0;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  word-break: break-all;
}

.profile-hero-email[hidden] {
  display: none;
}

.profile-hero-pills {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.profile-hero-pills[hidden] {
  display: none;
}

@media (max-width: 720px) {
  .profile-hero {
    gap: 10px 14px;
  }
}

/* Old profile-header layout still rendered when JS targets these classes; keep legacy rules harmless. */
.profile-header {
  display: none;
}

.profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.profile-actions button {
  border: 1px solid var(--action-primary-border);
  border-radius: 6px;
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  padding: 8px 10px;
  cursor: pointer;
}

.profile-actions button.secondary {
  background: var(--color-bg-surface-raised);
  color: var(--color-text-brand);
}

.profile-admin-maintenance-actions {
  justify-content: flex-start;
  gap: 10px;
}

.profile-admin-open-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 14px;
  border: 1px solid var(--action-primary-border);
  border-radius: 9px;
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  font: inherit;
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.profile-admin-open-link:hover {
  border-color: var(--action-primary-bg-hover);
  background: var(--action-primary-bg-hover);
  color: var(--action-primary-text);
  text-decoration: none;
}

.profile-admin-open-link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

.profile-admin-maintenance-actions .secondary {
  border: 1px solid var(--action-secondary-border);
  background: var(--action-secondary-bg, var(--color-bg-surface-raised));
  color: var(--action-secondary-text, var(--color-text-brand));
}

.profile-admin-maintenance-actions .secondary:hover {
  border-color: var(--action-secondary-border-hover, var(--action-secondary-border));
  background: var(--action-secondary-bg-hover, var(--color-control-bg-hover));
}

.profile-status {
  min-height: 0;
  margin: 0 0 12px;
}

.profile-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

@media (min-width: 768px) {
  .profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ---------- Profile tabs ---------- */

.profile-guest-panel {
  display: grid;
  gap: 14px;
}

.profile-guest-panel[hidden] {
  display: none;
}

.profile-member-panel {
  display: block;
}

.profile-member-panel[hidden] {
  display: none;
}

.profile-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  border-bottom: 1px solid var(--color-border-strong);
  margin-bottom: 14px;
  scroll-margin-top: 5.5rem;
}

.profile-tab {
  appearance: none;
  border: 1px solid transparent;
  border-bottom: 0;
  background: transparent;
  color: var(--color-text-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.95rem;
  font-weight: 600;
  padding: 8px 14px;
  cursor: pointer;
  border-radius: 6px 6px 0 0;
}

.profile-tab:hover {
  background: var(--color-primary-tint-subtle);
}

.profile-tab.is-active {
  background: var(--color-bg-surface);
  border-color: var(--color-border-strong);
  color: var(--color-text-brand);
  position: relative;
  top: 1px;
}

.profile-tab:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.profile-tab-panel {
  display: none;
  animation: profile-panel-fade-in 160ms ease-out;
}

.profile-tab-panel.is-active {
  display: block;
}

.profile-tab-panel[hidden] {
  display: none !important;
}

@keyframes profile-panel-fade-in {
  from { opacity: 0; transform: translateY(2px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .profile-tab-panel {
    animation: none;
  }
}

@media (max-width: 720px) {
  .profile-tabs {
    flex-direction: column;
    border-bottom: 0;
    gap: 0;
    margin-bottom: 0;
  }

  .profile-tab {
    text-align: left;
    border-radius: 0;
    border: 0;
    border-top: 1px solid var(--color-border-strong);
    padding: 12px 14px;
    position: static;
    background: var(--color-bg-surface);
  }

  .profile-tab:first-child {
    border-top: 0;
  }

  .profile-tab.is-active {
    background: var(--color-control-bg-active);
    color: var(--color-text-brand);
    top: 0;
  }

  .profile-tab.is-active::after {
    content: "▾";
    float: right;
    font-size: 0.78rem;
    color: var(--color-text-brand);
  }

  .profile-tab-panel.is-active {
    border-top: 0;
    border-bottom: 1px solid var(--color-border-strong);
    background: var(--color-bg-surface-muted);
    padding: 12px 14px;
  }
}

/* ---------- Profile status pills ---------- */

.profile-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  letter-spacing: 0.01em;
  border: 1px solid transparent;
  white-space: nowrap;
}

.profile-status-pill[data-variant="success"] {
  background: var(--color-success-bg);
  color: var(--color-success-text);
  border-color: var(--color-success-border);
}

.profile-status-pill[data-variant="warning"] {
  background: var(--color-warning-bg);
  color: var(--color-warning-text);
  border-color: var(--color-warning-border);
}

.profile-status-pill[data-variant="muted"] {
  background: var(--badge-muted-bg);
  color: var(--badge-muted-text);
  border-color: var(--badge-muted-border);
}

.profile-status-pill[data-variant="info"] {
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
  border-color: var(--color-border-muted);
}

.profile-card-titlebar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.profile-card-titlebar .profile-card-title {
  margin: 0;
}

.profile-card-title {
  margin: 0 0 10px;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.05rem;
}

/* ---------- API key collapsed state ---------- */

.profile-api-key-saved {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin: 6px 0 12px;
}

.profile-api-key-saved[hidden] {
  display: none;
}

.profile-api-key-delete-link {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-text-brand);
  text-decoration: underline;
  cursor: pointer;
  font-size: 0.85rem;
  padding: 4px 0;
}

.admin-key-clear-link {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-text-brand);
  text-decoration: underline;
  cursor: pointer;
  font-size: 0.8rem;
  padding: 2px 0;
  align-self: flex-start;
}

.admin-key-clear-link:hover {
  color: var(--color-danger-text);
}

.admin-key-clear-link[hidden] {
  display: none;
}

.profile-api-key-delete-link:hover {
  color: var(--color-danger-text);
}

.profile-api-key-form[hidden] {
  display: none;
}

/* ---------- Usage progress bar ---------- */

.profile-usage-progress {
  position: relative;
  height: 14px;
  background: var(--badge-muted-bg);
  border: 1px solid var(--color-border-strong);
  border-radius: 999px;
  overflow: hidden;
  margin: 4px 0 10px;
}

.profile-usage-progress-fill {
  position: absolute;
  inset: 0;
  width: 0%;
  background: linear-gradient(90deg, var(--color-primary-800) 0%, var(--color-accent-gold) 100%);
  transition: width 220ms ease;
}

.profile-usage-progress[data-variant="warning"] .profile-usage-progress-fill {
  background: linear-gradient(90deg, var(--color-warning) 0%, var(--color-warning-border) 100%);
}

.profile-usage-progress[data-variant="danger"] .profile-usage-progress-fill {
  background: linear-gradient(90deg, var(--color-danger) 0%, var(--color-primary-600) 100%);
}

@media (prefers-reduced-motion: reduce) {
  .profile-usage-progress-fill {
    transition: none;
  }
}

/* ---------- Profile font picker (refined) ---------- */

.profile-font-picker {
  border: 0;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.profile-font-status {
  min-height: 0;
  margin: 4px 0 12px;
  font-size: 0.85rem;
}

.profile-font-tile {
  position: relative;
  display: flex;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  cursor: pointer;
  transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
  min-height: 96px;
}

.profile-font-tile .profile-font-check {
  position: absolute;
  top: 8px;
  right: 10px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--color-primary-800);
  color: var(--color-text-inverse);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.78rem;
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 120ms ease, transform 120ms ease;
}

.profile-font-tile.is-selected .profile-font-check,
.profile-font-tile:has(input[type="radio"]:checked) .profile-font-check {
  opacity: 1;
  transform: scale(1);
}

@media (max-width: 520px) {
  .profile-font-picker {
    grid-template-columns: 1fr;
  }
}

.profile-card {
  border: 1px solid var(--color-border-muted);
  border-radius: 8px;
  background: var(--color-bg-surface);
  padding: 12px;
}

.profile-card-wide {
  grid-column: 1 / -1;
}

.profile-card h3 {
  margin: 0 0 10px;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
}

.profile-details {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px 0;
  margin: 0;
}

.profile-details dt {
  color: var(--color-text-muted);
  font-weight: 700;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-top: 12px;
}

.profile-details dt:first-of-type {
  margin-top: 0;
}

.profile-details dd {
  margin: 0 0 10px;
  color: var(--color-text-strong);
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 1rem;
  line-height: 1.45;
}

.profile-details dd:last-of-type {
  margin-bottom: 0;
}

@media (min-width: 520px) {
  .profile-details {
    grid-template-columns: minmax(140px, 34%) 1fr;
    gap: 8px 14px;
    align-items: baseline;
  }

  .profile-details dt {
    margin-top: 0;
    font-size: 0.85rem;
    text-transform: none;
    letter-spacing: normal;
  }

  .profile-details dd {
    margin: 0;
  }
}

.profile-usage-total {
  margin: 0 0 10px;
  color: var(--color-text-strong);
  font-weight: 700;
}

.profile-usage-breakdown {
  display: grid;
  gap: 8px;
}

.profile-usage-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--color-border-muted);
  padding-bottom: 6px;
}

.profile-usage-quota {
  margin: 0 0 14px;
  color: var(--color-text-muted);
  font-size: 0.95rem;
  line-height: 1.45;
}

.profile-usage-subtitle {
  margin: 16px 0 8px;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-text);
}

.profile-usage-detail {
  margin-bottom: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.profile-usage-empty {
  margin: 0 0 8px;
  color: var(--color-text-muted);
  font-size: 0.9rem;
}

.profile-usage-totals {
  margin: 10px 0 0;
  font-size: 0.9rem;
  color: var(--color-text);
}

.profile-usage-table {
  width: 100%;
  min-width: 260px;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.profile-usage-table th,
.profile-usage-table td {
  text-align: left;
  padding: 6px 8px;
  border-bottom: 1px solid var(--color-border-muted);
}

.profile-usage-table th {
  color: var(--color-text-muted);
  font-weight: 700;
}

.profile-usage-table td:nth-child(2),
.profile-usage-table td:nth-child(3),
.profile-usage-table td:nth-child(4) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.profile-help {
  margin: 0 0 12px;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.profile-api-key-callout {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-control-bg-soft);
}

.profile-api-key-callout-title {
  margin: 0 0 8px;
  font-weight: 700;
  color: var(--color-text);
  font-size: 0.95rem;
}

.profile-api-key-callout-body {
  margin: 0 0 12px;
  color: var(--color-text-muted);
  font-size: 0.92rem;
  line-height: 1.45;
}

.profile-api-key-callout-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 4px;
}

.profile-api-key-callout-link {
  display: inline-block;
  border: 1px solid var(--action-primary-border);
  border-radius: 6px;
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  padding: 8px 10px;
  font-size: 0.95rem;
  text-decoration: none;
  cursor: pointer;
  line-height: 1.3;
}

.profile-api-key-callout-link:hover,
.profile-api-key-callout-link:visited {
  color: var(--action-primary-text);
  text-decoration: none;
}

.profile-api-key-callout-link:hover {
  filter: brightness(1.05);
}

.profile-api-key-instructions {
  display: block;
  width: 100%;
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--color-border-muted);
  box-sizing: border-box;
}

.profile-card .profile-api-key-instructions-summary,
.profile-api-key-instructions-summary {
  cursor: pointer;
  color: var(--color-text-muted);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 0.85rem;
  font-weight: 500;
  padding: 4px 0;
  line-height: 1.4;
}

.profile-api-key-instructions-summary:hover {
  color: var(--color-text-brand);
}

.profile-api-key-instructions[open] > .profile-api-key-instructions-summary {
  color: var(--color-text-brand);
  font-weight: 600;
}

.profile-api-key-instructions-panel {
  padding: 8px 0 0 0.65rem;
  border-left: 2px solid var(--color-border-muted);
  margin: 8px 0 0;
}

.profile-api-key-instructions-title {
  margin: 0 0 8px;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-text);
}

.profile-api-key-instructions-text {
  margin-bottom: 8px;
}

.profile-api-key-instructions-text:last-child {
  margin-bottom: 0;
}

.profile-technical-details {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--color-border-muted);
}

.profile-technical-details > summary {
  cursor: pointer;
  color: var(--color-text-muted);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 0.85rem;
  font-weight: 500;
  padding: 4px 0;
  line-height: 1.4;
}

.profile-technical-details > summary:hover {
  color: var(--color-text-brand);
}

.profile-technical-details[open] > summary {
  color: var(--color-text-brand);
  font-weight: 600;
}

.search-advanced-section {
  margin-top: 2px;
  border: 1px solid var(--color-border);
  background: var(--color-bg-surface);
  padding: 10px;
}

.search-advanced-title {
  margin: 0 0 8px;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.96rem;
}

.search-grid-advanced {
  margin: 0;
}

.search-grid {
  display: grid;
  grid-template-columns:
    max-content minmax(220px, 1fr)
    max-content minmax(180px, 1fr)
    max-content minmax(180px, 1fr);
  align-items: center;
  gap: 8px 12px;
}

.reader-search-grid {
  grid-template-columns:
    max-content minmax(220px, 1fr)
    max-content minmax(180px, 1fr)
    max-content minmax(180px, 1fr)
    max-content minmax(130px, 0.8fr);
}

.search-grid input:not([type="checkbox"]),
.search-grid select {
  width: 100%;
  border: 1px solid var(--color-border-muted);
  border-radius: 6px;
  background: var(--color-bg-surface-raised);
  color: var(--color-control-text);
  padding: 6px 8px;
  min-height: 34px;
}

.search-grid input:not([type="checkbox"]):disabled,
.search-grid select:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.search-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
  flex-wrap: wrap;
  margin-top: 2px;
  padding-top: 16px;
  border-top: 1px solid var(--color-border-muted);
}

.search-actions #searchButton {
  margin-left: auto;
}

.search-actions button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border: 1px solid var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  border-radius: 4px;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 0.52rem 1rem;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.search-actions button:hover {
  background: var(--action-primary-bg-hover);
  border-color: var(--action-primary-bg-hover);
}

.search-actions button:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.search-actions .secondary-button:not(:disabled) {
  border-color: var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
}

.search-actions .secondary-button:hover:not(:disabled) {
  background: var(--action-secondary-bg-hover);
  border-color: var(--action-secondary-border-hover);
}

.search-main-panel .search-actions button:not(:disabled) {
  border-color: var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  border-radius: 4px;
}

.search-main-panel .search-actions button:hover:not(:disabled) {
  border-color: var(--action-primary-bg-hover);
  background: var(--action-primary-bg-hover);
}

.search-main-panel .search-actions .secondary-button:not(:disabled) {
  border-color: var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
}

.search-main-panel .search-actions .secondary-button:hover:not(:disabled) {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.reader-filters-panel {
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  border-radius: 0;
  padding: 12px 12px 10px;
  box-shadow: none;
  overflow: visible;
}

/* Page identity above the filters panel — same search-intro-* language as other main pages */
.page--reader {
  padding-top: 10px;
}

.page--reader .reader-page-intro.search-intro-block {
  margin-bottom: 22px;
}

.reader-catalog-quicksearch {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.reader-catalog-quicksearch__label {
  margin: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--color-text-brand);
  line-height: 1.3;
}

.reader-catalog-quicksearch__label > label {
  font: inherit;
  color: inherit;
  cursor: pointer;
}

.reader-catalog-quicksearch__hint {
  margin: 0 0 4px;
  font-size: 0.82rem;
  line-height: 1.35;
  color: var(--color-text-muted);
}

.reader-catalog-quicksearch__control {
  position: relative;
  min-width: 0;
  z-index: 4;
}

.reader-catalog-quicksearch__control:has(.reader-catalog-quicksearch__menu:not([hidden])) {
  z-index: 81;
}

.reader-catalog-quicksearch__input {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--color-border-strong);
  border-radius: 4px;
  background: var(--color-bg-surface);
  color: var(--color-control-text);
  padding: 9px 12px;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--color-bg-surface-raised) 55%, transparent);
}

/* Extra end padding only when the shared mic is actually mounted. */
.reader-catalog-quicksearch__control--has-mic .reader-catalog-quicksearch__input,
.reader-catalog-quicksearch__control:has(.search-compose__mic) .reader-catalog-quicksearch__input {
  padding-inline-end: 48px;
}

.reader-catalog-quicksearch__control > .search-compose__mic-root--overlay {
  top: 3px;
  inset-inline-end: 6px;
  z-index: 2;
}

.reader-catalog-quicksearch__input:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  border-color: var(--color-focus);
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.reader-catalog-quicksearch__input:disabled {
  background: var(--color-control-bg-disabled);
  color: var(--color-text-muted);
  cursor: not-allowed;
}

.reader-catalog-quicksearch__menu {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  right: 0;
  z-index: 40;
  max-height: min(320px, 50vh);
  max-width: min(100%, calc(100vw - 24px));
  overflow: auto;
  overscroll-behavior: contain;
}

.reader-catalog-quicksearch__option {
  display: grid;
  gap: 2px;
  width: 100%;
  min-height: 40px;
  border: 0;
  background: transparent;
  color: var(--color-text-strong);
  font: inherit;
  text-align: left;
  padding: 8px 6px;
  cursor: pointer;
}

.reader-catalog-quicksearch__option:hover,
.reader-catalog-quicksearch__option.is-active,
.reader-catalog-quicksearch__option[aria-selected="true"] {
  background: var(--color-control-bg-hover);
}

.reader-catalog-quicksearch__option-label {
  color: var(--color-text-strong);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.reader-catalog-quicksearch__option-secondary {
  color: var(--color-text-muted);
  font-size: 0.8rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.reader-catalog-quicksearch__group-header {
  margin: 8px 0 2px;
  padding: 2px 4px;
  color: var(--color-text-brand);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.reader-catalog-quicksearch__status {
  margin: 0;
  font-size: 0.84rem;
  color: var(--color-text-muted);
}

.reader-catalog-quicksearch__status[data-variant="error"] {
  color: var(--color-text-strong);
}

.reader-catalog-quicksearch__retry {
  justify-self: start;
  min-height: 34px;
  padding: 6px 10px;
}

.reader-catalog-quicksearch__separator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 12px 0 10px;
  color: var(--color-text-subtle);
  font-size: 0.76rem;
  font-weight: 500;
  letter-spacing: 0.01em;
}

.reader-catalog-quicksearch__separator::before,
.reader-catalog-quicksearch__separator::after {
  content: "";
  width: 2.75rem;
  height: 1px;
  flex: 0 0 auto;
  background: var(--color-border-muted);
}

.reader-catalog-quicksearch__separator > span {
  white-space: nowrap;
}

.reader-filters-panel .search-form {
  gap: 0;
}

.reader-filters-analytical {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.reader-top-grid,
.reader-branch-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.reader-top-grid {
  grid-template-columns: minmax(0, 1fr);
}

.reader-branch-grid {
  border: 1px solid var(--color-border-muted);
  border-radius: 0;
  background: var(--color-bg-surface);
  padding: 10px;
}

.reader-top-grid > .reader-filter-field,
.reader-branch-grid > .reader-filter-field {
  display: grid;
  grid-template-rows: 24px auto;
  gap: 6px;
  align-content: start;
  min-width: 0;
}

.reader-filter-field label {
  display: block;
  margin-bottom: 6px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--color-text-brand);
}

.reader-filter-field .filter-label-row > label {
  margin-bottom: 0;
}

.reader-top-grid > .reader-filter-field > label,
.reader-branch-grid > .reader-filter-field > label,
.reader-branch-grid > .reader-filter-field > .filter-label-row {
  height: 24px;
  min-height: 0;
  display: flex;
  align-items: center;
  margin: 0;
  line-height: 1.25;
  overflow: visible;
}

.reader-branch-grid > .reader-filter-field > .filter-label-row {
  justify-content: space-between;
}

/* Reader author field: label + Σύνθετα φίλτρα on one row (desktop), stacked on mobile */
.reader-branch-grid > .reader-filter-field--with-advanced {
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: 24px auto;
  grid-template-areas:
    "label advanced"
    "control control";
  column-gap: 12px;
  row-gap: 6px;
}

.reader-filter-field--with-advanced > label {
  grid-area: label;
}

.reader-filter-field--with-advanced > .inline-advanced-filter {
  grid-area: advanced;
  justify-self: end;
  align-self: center;
  width: auto;
  max-width: 100%;
  min-width: 0;
}

.reader-filter-field--with-advanced > .reader-native-select-hidden,
.reader-filter-field--with-advanced > .search-multiselect {
  grid-area: control;
}

.reader-filter-field select {
  width: 100%;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--color-border-strong);
  border-radius: 0;
  background: var(--color-bg-surface);
  color: var(--color-control-text);
}

.reader-filter-field select:disabled {
  color: var(--action-disabled-text);
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  cursor: not-allowed;
  opacity: 1;
}

.reader-filter-field select:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  border-color: var(--color-focus);
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.reader-native-select-hidden {
  display: none !important;
}

.reader-filter-field .search-multiselect-option {
  width: 100%;
  min-height: 36px;
  border: 0;
  background: transparent;
  font: inherit;
  text-align: left;
  align-items: center;
  padding: 8px 6px;
}

.reader-filter-field .search-multiselect {
  overflow: visible;
}

/* Keep open filter menus above sticky .reader-utility (z-index: 70). */
.reader-filters-panel:has(.search-multiselect.is-open),
.reader-filters-panel:has(.reader-catalog-quicksearch__menu:not([hidden])) {
  position: relative;
  z-index: 80;
}

.reader-filter-field:has(.search-multiselect.is-open) {
  position: relative;
  z-index: 1;
}

.reader-filter-field .search-multiselect.is-open {
  z-index: 1;
}

.reader-filter-field .search-multiselect-menu {
  z-index: 81;
  max-width: min(100%, calc(100vw - 24px));
}

.reader-filter-field .search-multiselect-option[aria-selected="true"] {
  background: var(--color-control-bg-hover);
}

.reader-search-actions {
  margin-top: 0;
  padding-top: 8px;
  border-top: 1px solid var(--color-border-muted);
  gap: 0.5rem;
}

.reader-search-actions button {
  min-height: 36px;
  font-size: 0.86rem;
  padding: 0.4rem 0.95rem;
}

.reader-search-actions button:not(:disabled) {
  border-color: var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  border-radius: 0;
  cursor: pointer;
}

.reader-search-actions button:hover:not(:disabled) {
  border-color: var(--action-primary-bg-hover);
  background: var(--action-primary-bg-hover);
}

.reader-search-actions button:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  pointer-events: none;
  opacity: 1;
}

.reader-search-actions button:disabled:hover {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
}

.reader-search-actions .secondary-button:not(:disabled) {
  border-color: var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
}

.reader-search-actions .secondary-button:hover:not(:disabled) {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.reader-search-actions button:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.meta {
  margin-top: 10px;
}

.permission-note {
  margin-bottom: 4px;
  font-size: 0.87rem;
  color: var(--color-text-muted);
}

.status-message {
  min-height: 0;
  font-size: 0.9rem;
}

.search-loading-panel {
  margin-top: 14px;
  margin-bottom: 14px;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  border-radius: 0;
  padding: 12px 14px 11px;
}

.search-loading-indicator {
  display: flex;
  align-items: center;
  gap: 9px;
}

.search-loading-spinner {
  width: 17px;
  height: 17px;
  border: 2px solid var(--color-border-strong);
  border-top-color: var(--color-primary-700);
  border-radius: 50%;
  animation: search-loading-spin 0.9s linear infinite;
}

.search-loading-title {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.98rem;
  line-height: 1.35;
}

.search-loading-text {
  margin: 6px 0 0;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  line-height: 1.46;
}

@keyframes search-loading-spin {
  to {
    transform: rotate(360deg);
  }
}

.search-answer {
  margin-top: 14px;
  margin-bottom: 14px;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  border-radius: 0;
  padding: 14px 14px 12px;
}

.search-answer-header {
  border-bottom: 1px solid var(--color-border-muted);
  padding-bottom: 9px;
}

.search-answer__header-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.search-answer__header-top .search-answer-title {
  flex: 1 1 auto;
  min-width: 0;
}

.search-answer__actions-host {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
}

.synthesis-actions {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
}

.synthesis-actions__item {
  position: relative;
  display: inline-flex;
}

.synthesis-actions__button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--color-border-muted);
  border-radius: 5px;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.synthesis-actions__button:hover {
  border-color: var(--color-border);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
}

.synthesis-actions__button:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.synthesis-actions__button:disabled,
.synthesis-actions__button[aria-busy="true"] {
  opacity: 0.65;
  cursor: wait;
}

.synthesis-actions__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.synthesis-actions__icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.synthesis-actions__menu {
  position: fixed;
  z-index: 80;
  min-width: 12.5rem;
  max-width: min(18rem, calc(100vw - 24px));
  margin: 0;
  padding: 4px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: var(--color-bg-surface);
  box-shadow: 0 8px 24px var(--color-shadow);
}

.synthesis-actions__popover {
  position: fixed;
  z-index: 90;
  box-sizing: border-box;
  width: min(290px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: var(--color-bg-surface);
  box-shadow: 0 8px 24px var(--color-shadow);
  color: var(--color-text);
}

.synthesis-actions__menu[hidden],
.synthesis-actions__popover[hidden] {
  display: none !important;
}

.synthesis-actions__menu-item {
  appearance: none;
  display: block;
  width: 100%;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--color-text);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
}

.synthesis-actions__menu-item:hover,
.synthesis-actions__menu-item:focus-visible {
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
  outline: none;
}

.synthesis-actions__popover-section {
  margin: 0;
  min-width: 0;
}

.synthesis-actions__popover-heading {
  margin: 0 0 8px;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.3;
}

.synthesis-actions__popover-divider {
  height: 0;
  margin: 10px 0;
  border: 0;
  border-top: 1px solid var(--color-border-muted);
}

.synthesis-actions__popover-list {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  column-gap: 12px;
  row-gap: 6px;
  align-items: start;
  margin: 0;
  padding: 0;
  color: var(--color-text);
  font-size: 0.82rem;
  line-height: 1.35;
}

.synthesis-actions__popover-list dt {
  margin: 0;
  color: var(--color-text-muted);
  font-weight: 500;
  min-width: 0;
}

.synthesis-actions__popover-list dd {
  margin: 0;
  min-width: 0;
  text-align: right;
  justify-self: stretch;
  color: var(--color-text-strong);
  font-weight: 600;
}

.synthesis-actions__popover-value--model {
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: manual;
}

.synthesis-actions__popover-value--tokens {
  white-space: nowrap;
}

.search-answer-title {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.03rem, 1.5vw, 1.22rem);
  line-height: 1.3;
}

.search-answer-subtitle {
  margin: 6px 0 0;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  line-height: 1.45;
  white-space: pre-line;
}

.search-answer-sources {
  min-width: 0;
  margin-top: 7px;
}

.search-answer-sources[hidden] {
  display: none;
}

.search-answer-sources__title {
  margin: 0 0 4px;
  color: var(--color-text);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.4;
}

.search-answer-sources__groups {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.search-answer-sources__group {
  min-width: 0;
}

.search-answer-sources__group-title {
  margin: 0 0 1px;
  color: var(--color-text-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1.35;
}

.search-answer-sources__list {
  display: inline;
  margin: 0;
  padding: 0;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.5;
  list-style: none;
  overflow-wrap: anywhere;
}

.search-answer-sources__list li,
.search-answer-sources__item,
.search-answer-sources__separator {
  display: inline;
}

.search-answer-sources__separator {
  color: var(--color-text-subtle);
  white-space: pre-wrap;
}

.search-answer-sources__list a {
  color: var(--color-text-brand);
  font-weight: 500;
  text-decoration: none;
}

.search-answer-sources__list a:hover,
.search-answer-sources__list a:focus-visible {
  color: var(--color-link-hover);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.search-answer-sources__list a:focus-visible {
  border-radius: 2px;
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

.search-answer-body {
  margin-top: 10px;
  position: relative;
}

.search-answer-controls {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.search-answer-copy-button {
  border: 1px solid var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  border-radius: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.84rem;
  padding: 5px 9px;
  cursor: pointer;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

.search-answer-copy-button:hover {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.search-answer-copy-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.search-answer-copy-button:disabled {
  border-color: var(--badge-muted-border);
  background: var(--badge-muted-bg);
  color: var(--color-text-subtle);
  cursor: not-allowed;
}

.search-answer-copy-button.search-answer-copy-success {
  border-color: var(--color-success-border);
  background: var(--color-success-bg);
  color: var(--color-success-text);
}

.search-answer-copy-button.search-answer-copy-error {
  border-color: var(--color-danger-border);
  background: var(--color-danger-bg);
  color: var(--color-danger-text);
}

.search-answer-text {
  margin: 0;
  line-height: 1.7;
  font-size: 0.98rem;
  color: var(--color-text-strong);
}

.search-answer-text > *:first-child {
  margin-top: 0;
}

.search-answer-text > *:last-child {
  margin-bottom: 0;
}

.search-answer-text p {
  margin: 0 0 0.9rem;
}

.search-answer-text ul,
.search-answer-text ol {
  margin: 0.1rem 0 0.95rem 1.25rem;
  padding: 0;
}

.search-answer-text li + li {
  margin-top: 0.45rem;
}

.search-answer-text h2,
.search-answer-text h3,
.search-answer-text h4 {
  margin: 1rem 0 0.55rem;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  line-height: 1.36;
}

.search-answer-text h2 {
  font-size: 1rem;
}

.search-answer-text h3,
.search-answer-text h4 {
  font-size: 0.95rem;
}

.search-answer-text code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9em;
}

.search-answer-technical-details {
  margin: 10px 0 0;
  width: fit-content;
  max-width: 100%;
}

.search-answer-technical-details[hidden] {
  display: none;
}

.search-answer-technical-details > summary {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  max-width: 100%;
  min-height: 0;
  border: 1px solid var(--color-border-muted);
  border-radius: 3px;
  background: transparent;
  padding: 4px 8px;
  color: var(--color-text-muted);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 0.84rem;
  font-weight: 500;
  line-height: 1.3;
  list-style: none;
  cursor: pointer;
}

.search-answer-technical-details > summary::-webkit-details-marker {
  display: none;
}

.search-answer-technical-details > summary::after {
  content: "";
  width: 9px;
  height: 6px;
  background-image: var(--search-chevron-icon);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 9px 6px;
  opacity: 0.75;
  flex: 0 0 auto;
  transition: transform 120ms ease;
}

.search-answer-technical-details[open] > summary::after {
  transform: rotate(180deg);
}

.search-answer-technical-details > summary:hover {
  border-color: var(--color-border-control);
  background: var(--color-bg-surface);
  color: var(--color-text);
}

.search-answer-technical-details > summary:hover::after {
  opacity: 1;
}

.search-answer-technical-details > summary:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
}

.search-answer-technical-details__list {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 3px 10px;
  margin: 6px 0 0;
  color: var(--color-text-muted);
  font-size: 0.8rem;
  line-height: 1.35;
}

.search-answer-technical-details__list dt {
  margin: 0;
  font-weight: 500;
}

.search-answer-technical-details__list dd {
  margin: 0;
}

.search-answer-meta {
  margin: 10px 0 0;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.search-answer-meta[hidden] {
  display: none;
}

.search-answer-note {
  margin: 8px 0 0;
  padding-top: 8px;
  border-top: 1px dashed var(--color-border-muted);
  color: var(--color-text-muted);
  font-size: 0.81rem;
  line-height: 1.46;
}

.citation-group {
  display: inline-block;
  white-space: nowrap;
  max-width: 100%;
}

.citation-reference {
  display: inline-block;
}

.answer-cite-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35em;
  margin: 0 0.04em;
  padding: 0 0.2em;
  border: 1px solid var(--color-accent-300);
  background: var(--badge-bg);
  color: var(--color-text-brand);
  font-weight: 600;
  text-decoration: none;
  font-size: 0.82em;
  line-height: 1.2;
  vertical-align: baseline;
}

.answer-cite-link:hover,
.answer-cite-link:focus-visible,
.citation-reference--open > .answer-cite-link {
  border-color: var(--color-border-brand);
  background: var(--color-control-bg-active);
  color: var(--color-text-brand);
}

.answer-cite-link:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
}

.citation-tooltip {
  position: fixed;
  z-index: 120;
  box-sizing: border-box;
  display: none;
  width: min(22.5rem, calc(100vw - 16px));
  max-width: min(22.5rem, calc(100vw - 16px));
  max-height: calc(100vh - 16px);
  gap: 4px;
  padding: 12px 14px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-text);
  box-shadow: 0 8px 24px var(--color-shadow-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.86rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
}

.citation-reference--open > .citation-tooltip {
  display: grid;
}

.citation-tooltip__number {
  color: var(--color-text-muted);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.citation-tooltip__author {
  color: var(--color-text-brand);
  font-size: 0.94rem;
  line-height: 1.35;
}

.citation-tooltip__work {
  color: var(--color-text-strong);
  font-weight: 600;
}

.citation-tooltip__location {
  color: var(--color-text-muted);
  font-size: 0.8rem;
}

.citation-tooltip__excerpt {
  margin-top: 3px;
  padding-top: 7px;
  border-top: 1px solid var(--color-border-muted);
  color: var(--color-text-muted);
  font-size: 0.81rem;
  line-height: 1.5;
}

.citation-tooltip__action {
  justify-self: start;
  margin-top: 4px;
  color: var(--color-text-brand);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 0.79rem;
  font-weight: 700;
  text-underline-offset: 2px;
}

.citation-tooltip__action:hover {
  color: var(--color-link-hover);
}

.citation-tooltip__action:focus-visible {
  border-radius: 2px;
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

.work-header {
  margin-top: 10px;
}

#readerWorkHeader:empty,
#readerChunksContainer:empty {
  display: none;
}

.reader-work-header-card {
  background: var(--reading-surface-muted-bg);
  border: 1px solid var(--reading-border);
  border-top: 3px solid var(--reading-link);
  border-radius: 0;
  padding: 8px 12px 7px;
}

.reader-work-header-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.reader-work-header-main {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.reader-work-header-section-title {
  margin: 1px 0 0;
  color: var(--reading-title);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.32;
}

.reader-work-header-section-description {
  margin: 0;
  color: var(--reading-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.88rem;
  line-height: 1.38;
}

/* ---------- Library drawer ---------- */

:root {
  --reader-floating-toggle-right: 0px;
  --reader-floating-toggle-base-bottom: 22vh;
  --reader-library-toggle-bottom: var(--reader-floating-toggle-base-bottom);
  --reader-floating-control-gap: 12px;
  --visible-footer-height: 0px;
  --reader-floating-toggle-effective-bottom: var(--reader-floating-toggle-base-bottom);
}

.reader-library-drawer-toggle {
  position: fixed;
  right: calc(var(--reader-floating-toggle-right, 0px) + env(safe-area-inset-right, 0px));
  bottom: calc(
    var(--reader-floating-toggle-effective-bottom, var(--reader-floating-toggle-base-bottom)) +
      env(safe-area-inset-bottom, 0px)
  );
  z-index: 60;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 56px;
  padding: 0;
  border: 1px solid var(--color-border-strong);
  border-right: 0;
  border-radius: 8px 0 0 8px;
  background: var(--color-bg-surface);
  color: var(--color-primary-800);
  cursor: pointer;
  box-shadow: -1px 2px 6px var(--color-shadow-strong);
  transition: background-color 120ms ease, transform 120ms ease;
}

.reader-library-drawer-toggle:hover {
  background: var(--color-control-bg-active);
  transform: translateX(-2px);
}

.reader-library-drawer-toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-library-drawer-toggle[hidden] {
  display: none;
}

.reader-library-drawer-toggle-icon {
  line-height: 1;
  display: block;
}

.reader-back-to-top-button {
  position: fixed;
  right: calc(var(--reader-floating-toggle-right, 0px) + env(safe-area-inset-right, 0px));
  bottom: calc(
    var(--reader-floating-toggle-effective-bottom, var(--reader-floating-toggle-base-bottom)) +
      env(safe-area-inset-bottom, 0px) + 64px
  );
  z-index: 59;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 46px;
  padding: 0;
  border: 1px solid var(--color-primary-950);
  border-right: 0;
  border-radius: 8px 0 0 8px;
  background: linear-gradient(180deg, var(--color-primary-800) 0%, var(--color-primary-950) 100%);
  color: var(--color-text-inverse);
  font-size: 1.02rem;
  line-height: 1;
  box-shadow: -1px 2px 6px var(--color-shadow-strong);
  cursor: pointer;
  opacity: 0;
  transform: translateX(8px);
  pointer-events: none;
  transition:
    opacity 150ms ease,
    transform 150ms ease,
    filter 140ms ease,
    box-shadow 140ms ease;
}

.reader-back-to-top-button.is-visible {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}

.reader-back-to-top-button:hover {
  filter: brightness(1.08);
  box-shadow: -2px 4px 10px var(--color-shadow-strong);
}

.reader-back-to-top-button:focus-visible {
  outline: 2px solid var(--color-text-inverse);
  outline-offset: 2px;
}

.reader-library-drawer {
  position: fixed;
  inset: 0;
  z-index: 80;
  pointer-events: none;
}

.reader-library-drawer[hidden] {
  display: none;
}

.reader-library-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: var(--color-overlay);
  opacity: 0;
  transition: opacity 200ms ease;
  pointer-events: none;
}

.reader-library-drawer.is-open .reader-library-drawer-backdrop {
  opacity: 1;
  pointer-events: auto;
}


.reader-library-drawer-panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(460px, 92vw);
  background: var(--color-bg-surface);
  border-left: 1px solid var(--color-border-muted);
  box-shadow: -8px 0 24px var(--color-shadow-strong);
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  transform: translateX(100%);
  transition: transform 220ms ease;
  pointer-events: auto;
}

.reader-library-drawer.is-open .reader-library-drawer-panel {
  transform: translateX(0);
}

.reader-library-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 12px;
  padding-top: max(14px, env(safe-area-inset-top, 0px));
  border-bottom: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
  flex: 0 0 auto;
}

.reader-library-drawer-title {
  margin: 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.12rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--color-text-strong);
  line-height: 1.25;
}

.reader-library-drawer-close {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  flex: 0 0 auto;
  transition:
    color 0.15s ease,
    background-color 0.15s ease;
}

.reader-library-drawer-close-icon {
  font-size: 1.45rem;
  line-height: 1;
}

.reader-library-drawer-close:hover {
  color: var(--color-text-strong);
  background: var(--color-primary-tint-subtle);
}

.reader-library-drawer-close:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-library-drawer-tabs {
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 0 12px;
  border-bottom: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
  flex: 0 0 auto;
  overflow: hidden;
}

.reader-library-drawer-tab {
  appearance: none;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--color-text-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.84rem;
  font-weight: 500;
  line-height: 1.25;
  padding: 12px 8px 10px;
  min-height: 44px;
  cursor: pointer;
  border-radius: 0;
  white-space: normal;
  text-align: center;
  flex: 1 1 0;
  min-width: 0;
  transition:
    color 0.15s ease,
    border-color 0.15s ease,
    background-color 0.15s ease;
}

.reader-library-drawer-tab:hover {
  color: var(--color-text-strong);
  background: var(--color-primary-tint-subtle);
}

.reader-library-drawer-tab.is-active {
  color: var(--color-text-strong);
  font-weight: 700;
  border-bottom-color: var(--color-border-brand);
  background: transparent;
  margin-bottom: 0;
}

.reader-library-drawer-tab:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: -2px;
}

.reader-library-drawer-toolbar {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 16px 12px;
  border-bottom: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface-muted);
  flex: 0 0 auto;
}

.reader-library-drawer-toolbar-row {
  display: grid;
  gap: 8px;
  align-items: end;
}

.reader-library-drawer-toolbar-filters {
  grid-template-columns: 1fr 1fr;
}

.reader-library-drawer-toolbar-search {
  grid-template-columns: minmax(0, 1fr) auto;
}

.reader-library-drawer-filter-field {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.reader-library-drawer-filter-label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--color-text-muted);
}

.reader-library-drawer-filter-field input,
.reader-library-drawer-filter-field select {
  border: 1px solid var(--color-border-muted);
  border-radius: 6px;
  padding: 7px 10px;
  font-size: 0.86rem;
  line-height: 1.2;
  min-height: 36px;
  background: var(--color-bg-surface);
  min-width: 0;
  width: 100%;
  color: var(--color-control-text);
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease;
}

.reader-library-drawer-filter-field input:focus-visible,
.reader-library-drawer-filter-field select:focus-visible {
  border-color: var(--color-focus);
  box-shadow: 0 0 0 3px var(--color-focus-ring-subtle);
  outline: 0;
}

.reader-library-drawer-filter-field input:disabled,
.reader-library-drawer-filter-field select:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.reader-library-drawer-search-field {
  min-width: 0;
}

.reader-library-drawer-clear {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  font-weight: 600;
  padding: 8px 6px;
  min-height: 36px;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
  border-radius: 6px;
  white-space: nowrap;
}

.reader-library-drawer-clear:hover {
  color: var(--color-primary-800);
}

.reader-library-drawer-clear:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-library-drawer-clear[hidden] {
  display: none;
}

.reader-library-drawer-status {
  margin: 0;
  padding: 8px 16px;
  font-size: 0.84rem;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  flex: 0 0 auto;
  color: var(--color-text);
  background: var(--color-bg-surface-muted);
  border-bottom: 1px solid var(--color-border-muted);
}

.reader-library-drawer-status[hidden] {
  display: none;
}

.reader-library-drawer-status.is-error {
  color: var(--color-danger-text);
  background: var(--color-danger-bg);
}

.reader-library-drawer-status-retry {
  appearance: none;
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  font-size: 0.8rem;
  font-weight: 600;
  padding: 4px 10px;
  min-height: 32px;
  border-radius: 6px;
  cursor: pointer;
}

.reader-library-drawer-status-retry:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-library-drawer-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 8px 0 16px;
  background: var(--color-bg-surface);
}

.reader-library-drawer-empty {
  margin: 28px 20px;
  padding: 0;
  text-align: left;
  color: var(--color-text-muted);
  background: transparent;
  border: 0;
}

.reader-library-drawer-empty-title {
  margin: 0 0 6px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-text-strong);
  line-height: 1.35;
}

.reader-library-drawer-empty-text {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--color-text-muted);
  max-width: 32ch;
}

.reader-library-drawer-loading {
  display: grid;
  gap: 0;
  padding: 4px 0;
}

.reader-library-drawer-loading[hidden] {
  display: none;
}

.reader-library-drawer-skeleton {
  height: 72px;
  margin: 0 16px;
  border-radius: 8px;
  background: linear-gradient(
    90deg,
    var(--color-bg-surface-muted) 0%,
    var(--color-bg-surface-raised, var(--color-bg-surface)) 50%,
    var(--color-bg-surface-muted) 100%
  );
  background-size: 200% 100%;
  animation: reader-library-skeleton 1.2s ease-in-out infinite;
  opacity: 0.7;
}

.reader-library-drawer-skeleton + .reader-library-drawer-skeleton {
  margin-top: 8px;
}

@keyframes reader-library-skeleton {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .reader-library-drawer-skeleton {
    animation: none;
  }
}

.reader-library-drawer-items {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0;
}

.reader-library-drawer-item {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 0 2px;
  border: 0;
  border-bottom: 1px solid var(--color-border-muted);
  background: transparent;
  padding: 0;
  transition: background-color 0.15s ease;
}

.reader-library-drawer-item:hover,
.reader-library-drawer-item:focus-within {
  background: var(--color-primary-tint-subtle);
}

.reader-library-drawer-item-body {
  min-width: 0;
  display: grid;
}

.reader-library-drawer-item-main {
  display: grid;
  gap: 5px;
  padding: 12px 4px 12px 16px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  border-radius: 0;
}

.reader-library-drawer-item-main:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: -2px;
}

.reader-library-drawer-item-title {
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-text-strong);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.reader-library-drawer-item-meta-line {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0 6px;
  font-size: 0.8rem;
  line-height: 1.35;
  color: var(--color-text-muted);
}

.reader-library-drawer-item-date,
.reader-library-drawer-item-locator,
.reader-library-drawer-item-meta-sep {
  color: inherit;
}

.reader-library-drawer-item-excerpt {
  margin: 2px 0 0;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--reading-text-strong, var(--color-text));
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: none;
}

.reader-library-drawer-item.is-bookmarks .reader-library-drawer-item-excerpt {
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.reader-library-drawer-item-note {
  margin: 0 8px 10px 16px;
  border-left: 2px solid var(--reading-border, var(--color-border-brand));
  padding: 2px 0 2px 10px;
  background: transparent;
}

.reader-library-drawer-item-note-body {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--reading-translation, var(--color-text));
  white-space: pre-wrap;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.reader-library-drawer-item-note-body a {
  color: var(--reading-link, var(--color-primary-800));
  text-decoration: underline;
}

.reader-library-drawer-item-trailing {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  padding: 4px 8px 4px 4px;
  flex: 0 0 auto;
  width: 92px;
}

.reader-library-drawer-item-affordance {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  min-height: 44px;
  color: var(--color-text-subtle);
  font-size: 1.15rem;
  line-height: 1;
  pointer-events: none;
  user-select: none;
}

.reader-library-drawer-item-overflow {
  position: relative;
  flex: 0 0 auto;
}

.reader-library-drawer-item-menu-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition:
    color 0.15s ease,
    background-color 0.15s ease;
}

.reader-library-drawer-item-menu-button:hover,
.reader-library-drawer-item-menu-button[aria-expanded="true"] {
  color: var(--color-text-strong);
  background: var(--color-bg-surface-muted);
}

.reader-library-drawer-item-menu-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-library-drawer-item-menu {
  position: absolute;
  top: calc(100% - 4px);
  right: 0;
  z-index: 5;
  min-width: 148px;
  padding: 4px;
  border: 1px solid var(--color-border-strong);
  border-radius: 8px;
  background: var(--color-bg-surface);
  box-shadow: 0 8px 20px var(--color-shadow-strong);
}

.reader-library-drawer-item-menu[hidden] {
  display: none;
}

.reader-library-drawer-item-delete {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-danger-text);
  font-size: 0.86rem;
  font-weight: 600;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  min-height: 40px;
  border-radius: 6px;
  cursor: pointer;
}

.reader-library-drawer-item-delete:hover,
.reader-library-drawer-item-delete:focus-visible {
  background: var(--color-danger-bg);
}

.reader-library-drawer-item-delete:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 1px;
}

[data-theme="patriarchal"] .reader-library-drawer-item-menu {
  border-color: var(--color-border-strong);
  border-width: 2px;
}

.reader-library-drawer-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 10px 16px;
  padding-bottom: max(10px, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
  flex: 0 0 auto;
}

.reader-library-drawer-page-button {
  appearance: none;
  border: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
  color: var(--color-text);
  min-width: 44px;
  min-height: 36px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.95rem;
}

.reader-library-drawer-page-button:hover:not(:disabled) {
  background: var(--color-primary-tint-subtle);
}

.reader-library-drawer-page-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-library-drawer-page-button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.reader-library-drawer-page-info {
  font-size: 0.8rem;
  color: var(--color-text-muted);
}

body.reader-library-drawer-open {
  overflow: hidden;
}

[data-theme="patriarchal"] .reader-library-drawer-tab.is-active {
  border-bottom-width: 3px;
}

[data-theme="patriarchal"] .reader-library-drawer-item {
  border-bottom-color: var(--color-border-strong);
}

/* ---------- Confirm modal ---------- */

.reader-confirm-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  pointer-events: auto;
}

.reader-confirm-modal[hidden] {
  display: none;
}

.reader-confirm-modal-backdrop {
  position: absolute;
  inset: 0;
  background: var(--color-overlay);
  backdrop-filter: blur(2px);
  animation: reader-confirm-fade-in 140ms ease-out;
}

.reader-confirm-modal-dialog {
  position: relative;
  max-width: 420px;
  width: 100%;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  padding: 18px 20px 16px;
  box-shadow: 0 16px 40px var(--color-shadow-strong);
  animation: reader-confirm-pop-in 160ms ease-out;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
}

.reader-confirm-modal-title {
  margin: 0 0 8px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.05rem;
  color: var(--color-primary-800);
  font-weight: 700;
}

.reader-confirm-modal-message {
  margin: 0 0 16px;
  font-size: 0.95rem;
  line-height: 1.45;
  color: var(--color-text-strong);
}

.reader-confirm-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.reader-confirm-modal-cancel,
.reader-confirm-modal-confirm {
  appearance: none;
  border-radius: 0;
  padding: 7px 14px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  min-width: 88px;
  line-height: 1.2;
}

.reader-confirm-modal-cancel {
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  border: 1px solid var(--action-secondary-border);
}

.reader-confirm-modal-cancel:hover {
  background: var(--action-secondary-bg-hover);
  border-color: var(--action-secondary-border-hover);
}

.reader-confirm-modal-confirm {
  background: linear-gradient(180deg, var(--color-primary-800) 0%, var(--color-primary-950) 100%);
  color: var(--color-text-inverse);
  border: 1px solid var(--color-primary-950);
}

.reader-confirm-modal-confirm:hover {
  background: linear-gradient(180deg, var(--color-primary-700) 0%, var(--color-primary-900) 100%);
}

.reader-confirm-modal-cancel:focus-visible,
.reader-confirm-modal-confirm:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-download-modal {
  position: fixed;
  inset: 0;
  z-index: 201;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.reader-download-modal[hidden] {
  display: none;
}

.reader-download-modal-backdrop {
  position: absolute;
  inset: 0;
  background: var(--color-overlay);
  backdrop-filter: blur(2px);
  animation: reader-confirm-fade-in 140ms ease-out;
}

.reader-download-modal-dialog {
  position: relative;
  max-width: 440px;
  width: 100%;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  padding: 18px 20px 16px;
  box-shadow: 0 16px 40px var(--color-shadow-strong);
  animation: reader-confirm-pop-in 160ms ease-out;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
}

.reader-download-modal-title {
  margin: 0 0 6px;
  font-size: 1.05rem;
  color: var(--color-primary-800);
  font-weight: 700;
}

.reader-download-modal-subtitle,
.reader-download-status {
  margin: 0 0 14px;
  font-size: 0.92rem;
  line-height: 1.45;
}

.reader-download-field {
  display: grid;
  gap: 6px;
  margin: 0 0 12px;
  color: var(--color-text-strong);
  font-size: 0.92rem;
  font-weight: 600;
}

.reader-download-field select {
  width: 100%;
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  padding: 9px 10px;
  font: inherit;
}

.reader-download-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.reader-download-button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0.45rem 0.9rem;
  border-radius: 4px;
  font: inherit;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.reader-download-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.reader-download-button-primary {
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  border: 1px solid var(--action-primary-border);
}

.reader-download-button-primary:hover:not(:disabled) {
  background: var(--action-primary-bg-hover);
  border-color: var(--action-primary-bg-hover);
}

.reader-download-button-secondary {
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  border: 1px solid var(--color-border-control);
}

.reader-download-button-secondary:hover:not(:disabled) {
  background: var(--action-secondary-bg-hover);
}

.reader-download-button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

@keyframes reader-confirm-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes reader-confirm-pop-in {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes site-header-nav-open {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .reader-confirm-modal-backdrop,
  .reader-confirm-modal-dialog,
  .site-header__nav.is-open .site-header__inner {
    animation: none;
  }

  .site-header__identity,
  .site-header-nav-toggle,
  .site-header-nav-toggle-bar,
  .site-nav__link,
  .site-nav__link::after,
  .member-account-button,
  .member-actions button,
  .reader-library-drawer-toggle,
  .reader-back-to-top-button {
    transition: none;
  }
}

@media (max-width: 720px) {
  :root {
    --reader-floating-toggle-base-bottom: 16vh;
    --reader-library-toggle-bottom: var(--reader-floating-toggle-base-bottom);
  }

  .reader-library-drawer-toggle {
    width: 36px;
    height: 52px;
  }

  .reader-library-drawer-toggle-icon {
    width: 20px;
    height: 20px;
  }

  .reader-back-to-top-button {
    width: 36px;
    height: 44px;
    bottom: calc(
      var(--reader-floating-toggle-effective-bottom, var(--reader-floating-toggle-base-bottom)) +
        env(safe-area-inset-bottom, 0px) + 58px
    );
    font-size: 0.95rem;
  }

  .reader-library-drawer-panel {
    width: 100vw;
  }

  .reader-library-drawer-header {
    padding-left: max(14px, env(safe-area-inset-left, 0px));
    padding-right: max(14px, env(safe-area-inset-right, 0px));
  }

  .reader-library-drawer-tabs {
    padding-left: max(8px, env(safe-area-inset-left, 0px));
    padding-right: max(8px, env(safe-area-inset-right, 0px));
  }

  .reader-library-drawer-tab {
    font-size: 0.8rem;
    padding: 12px 4px 10px;
  }

  .reader-library-drawer-toolbar {
    padding-left: max(14px, env(safe-area-inset-left, 0px));
    padding-right: max(14px, env(safe-area-inset-right, 0px));
  }

  .reader-library-drawer-toolbar-filters {
    grid-template-columns: 1fr;
  }

  .reader-library-drawer-toolbar-search {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .reader-library-drawer-item-main {
    padding-left: max(14px, env(safe-area-inset-left, 0px));
  }

  .reader-library-drawer-item-note {
    margin-left: max(14px, env(safe-area-inset-left, 0px));
  }

  .reader-library-drawer-item-trailing {
    padding-right: max(6px, env(safe-area-inset-right, 0px));
    width: 88px;
  }
}

@media (max-width: 360px) {
  .reader-library-drawer-tabs {
    padding-left: max(4px, env(safe-area-inset-left, 0px));
    padding-right: max(4px, env(safe-area-inset-right, 0px));
  }

  .reader-library-drawer-tab {
    font-size: 0.76rem;
    padding: 11px 2px 9px;
  }

  .reader-library-drawer-toolbar-search {
    grid-template-columns: 1fr;
  }

  .reader-library-drawer-clear {
    justify-self: start;
  }
}

.reader-history-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.reader-history-detail-modal[hidden] {
  display: none;
}

.reader-history-detail-modal-backdrop {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--color-text) 42%, transparent);
}

.reader-history-detail-modal-dialog {
  position: relative;
  z-index: 1;
  width: min(920px, 100%);
  max-height: min(92vh, 960px);
  display: flex;
  flex-direction: column;
  background: var(--color-bg-surface);
  color: var(--color-text);
  border: 1px solid var(--color-border-strong);
  border-radius: 12px;
  box-shadow: 0 18px 48px color-mix(in srgb, var(--color-text) 24%, transparent);
  overflow: hidden;
}

.reader-history-detail-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface-raised);
  position: sticky;
  top: 0;
  z-index: 2;
}

.reader-history-detail-modal-heading {
  min-width: 0;
  flex: 1;
}

.reader-history-detail-modal-title {
  margin: 0;
  font-size: 1.05rem;
  color: var(--color-primary-800);
}

.reader-history-detail-modal-question {
  margin: 6px 0 0;
  font-size: 0.95rem;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.reader-history-detail-modal-date {
  margin: 4px 0 0;
  font-size: 0.8rem;
  color: var(--color-text-muted);
}

.reader-history-detail-modal-close {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  padding: 2px 6px;
}

.reader-history-detail-modal-close:hover,
.reader-history-detail-modal-close:focus-visible {
  color: var(--color-primary-800);
}

.reader-history-detail-modal-status {
  margin: 0;
  padding: 8px 16px;
}

.reader-history-detail-modal-body {
  overflow: auto;
  padding: 12px 16px 20px;
  -webkit-overflow-scrolling: touch;
}

.reader-history-detail-modal-body .search-answer {
  margin: 0;
}

.reader-history-detail-modal-body .search-answer-history-date {
  margin: 0 0 8px;
  font-size: 0.85rem;
  color: var(--color-text-muted);
}

body.reader-history-detail-open {
  overflow: hidden;
}

@media (max-width: 720px) {
  .reader-history-detail-modal {
    padding: 0;
    align-items: stretch;
  }

  .reader-history-detail-modal-dialog {
    width: 100vw;
    max-width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
    border: 0;
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .reader-history-detail-modal-header {
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
  }

  .reader-history-detail-modal-body {
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
  }
}

.reader-work-header-kicker {
  margin: 0;
  color: var(--reading-title);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.2;
}

.reader-work-header-title {
  margin: 0;
  color: var(--reading-title);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.05rem, 1.45vw, 1.24rem);
  line-height: 1.28;
}

.reader-work-header-author-line,
.reader-work-header-meta-line {
  margin: 7px 0 0;
  line-height: 1.45;
}

.reader-work-header-label {
  color: var(--reading-link);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.82rem;
  font-weight: 600;
  margin-right: 6px;
}

.reader-work-header-author {
  color: var(--reading-text-strong);
  font-size: 0.93rem;
}

.reader-work-header-meta {
  color: var(--reading-muted);
  font-size: 0.89rem;
}

.reader-work-header-count-badge {
  margin: 0;
  white-space: nowrap;
  border: 1px solid var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.82rem;
  line-height: 1.25;
  padding: 5px 8px;
}

.reader-work-header-details {
  margin-top: 5px;
  border-top: 1px solid var(--color-border-muted);
  padding-top: 3px;
}

.reader-work-header-details > summary {
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  min-height: 24px;
  display: inline-flex;
  align-items: center;
}

.reader-work-header-details > summary::-webkit-details-marker {
  display: none;
}

.reader-work-header-details-list {
  margin: 8px 0 0;
  display: grid;
  gap: 6px;
}

.reader-work-header-detail-row {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(130px, max-content) 1fr;
  gap: 8px;
  align-items: baseline;
}

.reader-work-header-detail-row dt {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.8rem;
}

.reader-work-header-detail-row dd {
  margin: 0;
  color: var(--color-text-strong);
  font-size: 0.87rem;
  line-height: 1.45;
  word-break: break-word;
}

.reader-work-header-author {
  margin: 3px 0 0;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  line-height: 1.4;
}

.reader-work-header-author-link {
  color: inherit;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.18em;
}

.reader-work-header-author-link:hover {
  color: var(--color-text-brand);
}

.reader-work-header-author-link:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 3px;
}

.source-path {
  margin: 4px 0 0;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  word-break: break-word;
}

.results-section {
  margin-top: 20px;
}

.results-header {
  margin: 0 0 10px;
}

.results-heading-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
}

.results-title {
  margin: 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.12rem;
  font-weight: 700;
  line-height: 1.3;
}

.results-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.results-subtitle {
  margin: 4px 0 0;
  color: var(--color-text-muted);
  font-size: 0.9rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.results-section .chunks {
  margin-top: 0;
}

.chunks {
  margin-top: 14px;
  display: grid;
  gap: 12px;
  /* Earlier chunks are progressively prepended above the reading position and
     we compensate the scroll manually (restoreScrollAnchorAfterPrepend). Opt
     out of the browser's native scroll anchoring so the two do not both adjust
     the scroll position and cause a jump. */
  overflow-anchor: none;
}

.chunk-card {
  background: var(--color-bg-surface-raised);
  border: 1px solid var(--color-border-muted);
  border-radius: 10px;
  padding: 12px;
}

.chunk-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.chunk-id {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
    monospace;
  font-size: 0.78rem;
  color: var(--color-info);
}

.checkbox-label {
  font-size: 0.86rem;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.checkbox-label.search-answer-toggle {
  display: flex;
  width: 100%;
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  align-items: center;
  gap: 7px;
  box-sizing: border-box;
  padding: 0 9px;
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1;
}

.checkbox-label.search-answer-toggle input[type="checkbox"] {
  width: 15px;
  height: 15px;
  min-height: 15px;
}

.checkbox-label.search-answer-toggle.search-answer-switch {
  position: relative;
  width: auto;
  min-width: 0;
  padding: 3px 6px;
  gap: 9px;
}

.checkbox-label.search-answer-toggle.search-answer-switch input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 1px;
  margin: 0;
  opacity: 0;
}

.search-answer-switch-track {
  position: relative;
  flex: 0 0 34px;
  width: 34px;
  height: 18px;
  border: 1px solid var(--color-border-strong);
  border-radius: 999px;
  background: var(--badge-muted-bg);
  box-sizing: border-box;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.search-answer-switch-track::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--color-text-muted);
  box-shadow: 0 1px 2px var(--color-shadow-strong);
  transition:
    background-color 0.15s ease,
    transform 0.15s ease;
}

.search-answer-switch input[type="checkbox"]:checked + .search-answer-switch-track {
  border-color: var(--color-primary-700);
  background: var(--color-primary-700);
}

.search-answer-switch input[type="checkbox"]:checked + .search-answer-switch-track::after {
  background: var(--color-bg-surface-raised);
  transform: translateX(16px);
}

.search-answer-switch input[type="checkbox"]:focus-visible + .search-answer-switch-track {
  box-shadow: 0 0 0 3px var(--color-focus-ring);
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.search-answer-switch:hover .search-answer-switch-track {
  border-color: var(--color-border-hover);
}

.search-answer-switch input[type="checkbox"]:checked:enabled + .search-answer-switch-track {
  border-color: var(--action-primary-bg-hover);
}

.search-answer-switch input[type="checkbox"]:disabled + .search-answer-switch-track,
.search-answer-switch input[type="checkbox"]:disabled ~ .search-answer-switch-label {
  opacity: 1;
}

.search-answer-switch input[type="checkbox"]:disabled + .search-answer-switch-track {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
}

.search-answer-switch input[type="checkbox"]:disabled + .search-answer-switch-track::after {
  background: var(--action-disabled-text);
}

.search-answer-switch input[type="checkbox"]:disabled ~ .search-answer-switch-label {
  color: var(--action-disabled-text);
}

.search-answer-switch-label {
  color: var(--color-text);
  white-space: nowrap;
}

.result-card,
.result-item {
  background: var(--color-bg-surface);
  border: 1px solid var(--color-border-muted);
  border-left: 2px solid var(--color-border);
  border-radius: 7px;
  box-shadow: 0 1px 0 var(--color-shadow);
  padding: 13px 15px 12px;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.result-card:hover,
.result-item:hover {
  border-color: var(--color-border);
  border-left-color: var(--color-border-hover);
  background: var(--color-bg-surface-raised);
  box-shadow: 0 2px 8px var(--color-shadow);
}

.result-card-header,
.result-meta,
.search-result-head {
  display: grid;
  gap: 4px;
}

.search-result__text-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
}

.search-result__text-header-meta {
  min-width: 0;
  margin-block: 0;
}

.search-result__title-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.45rem;
  margin: 0;
  margin-block: 0;
  min-width: 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.35;
}

.search-result__number,
.backlinks-result-number {
  flex: 0 0 auto;
  color: var(--color-text-subtle);
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.search-result__title-sep {
  flex: 0 0 auto;
  color: var(--color-text-subtle);
  font-weight: 500;
}

.search-result-alternate-panel {
  display: flow-root;
}

.search-result-alternate-panel > .search-result__copy,
.search-result-alternate-panel > .search-result-alternate-copy {
  float: right;
  margin-block-start: 0;
  margin-inline-start: 0.75rem;
  margin-block-end: 0.5rem;
}

.search-result-alternate-panel .search-result-alternate-text,
.search-result-alternate-panel .search-result-translation-text {
  margin: 0;
  padding: 0;
}

.search-result-alternate-panel .search-result-alternate-text > :first-child,
.search-result-alternate-panel .search-result-translation-text > :first-child {
  margin-block-start: 0;
}

.search-result-alternate-panel .search-result-alternate-text > :last-child,
.search-result-alternate-panel .search-result-translation-text > :last-child {
  margin-block-end: 0;
}

.search-result__copy {
  appearance: none;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--color-border-muted);
  border-radius: 5px;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.search-result__copy:hover {
  border-color: var(--color-border);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
}

.search-result__copy:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.search-result__copy:active {
  transform: translateY(1px);
}

.search-result__copy-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.search-result__copy-icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.result-card-title {
  margin: 0;
  margin-block: 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.35;
}

.result-author,
.search-result-author {
  margin: 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.34;
}

.search-result__title-line .search-result-author,
.search-result__title-line .search-result-author-link {
  margin: 0;
  min-width: 0;
  color: var(--color-text-strong);
  font-family: inherit;
  font-size: inherit;
  font-weight: 700;
  line-height: inherit;
  overflow-wrap: anywhere;
  white-space: normal;
}

.search-result__title-line .search-result-work {
  min-width: 0;
  color: var(--color-text);
  font-family: inherit;
  font-size: inherit;
  font-weight: 500;
  line-height: inherit;
  overflow-wrap: anywhere;
  white-space: normal;
}

.result-card-meta,
.result-work,
.search-result-work-line,
.search-result-locator {
  margin: 0;
  color: var(--color-text-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.82rem;
  font-weight: 500;
  line-height: 1.45;
}

.search-result-work-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 6px;
}

.search-result-locator::before {
  content: "·";
  margin-right: 6px;
  color: var(--color-text-subtle);
}

.search-result-locator[hidden] {
  display: none;
}

.search-result__number[hidden],
.search-result__title-sep[hidden] {
  display: none;
}

.result-card-body,
.result-excerpt,
.search-result-passage {
  margin-top: 10px;
  border-top: 1px solid var(--color-border-muted);
  padding-top: 10px;
}

.search-result-original-text,
.backlinks-result-snippet {
  margin: 0;
  white-space: pre-wrap;
  color: var(--reading-text-strong);
  font-family: "NAU5", "Noto Serif", Georgia, "Times New Roman", serif;
  font-size: var(--reading-original-size);
  line-height: var(--reading-original-line-height);
}

.lexical-match-highlight {
  background: var(--search-highlight-bg);
  color: var(--search-highlight-text);
  box-shadow: inset 0 -1px 0 var(--search-highlight-border);
  border-radius: 0.12em;
  padding-inline: 0.08em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.ancient-text {
  color: var(--reading-text-strong);
}

.result-card-actions,
.result-actions,
.search-result-actions {
  margin-top: 11px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 7px;
}

.result-action,
.search-result-action {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 31px;
  border: 1px solid var(--color-border-muted);
  border-radius: 5px;
  background: var(--color-bg-surface);
  color: var(--action-secondary-text);
  text-decoration: none;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.81rem;
  font-weight: 600;
  line-height: 1.25;
  padding: 5px 9px;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease;
}

.result-action--primary {
  border-color: var(--color-border);
  background: var(--color-primary-tint-subtle);
  color: var(--color-text-brand);
}

.result-action--secondary {
  border-color: var(--color-border-muted);
  background: var(--color-bg-surface);
  color: var(--color-text-muted);
}

.result-action--tertiary {
  border-color: var(--color-border-muted);
  background: transparent;
  color: var(--color-text-muted);
}

.result-action--tertiary[aria-expanded="true"] {
  border-color: var(--color-border-hover);
  background: var(--action-secondary-bg);
}

.result-action:hover,
.search-result-action:hover {
  border-color: var(--color-border);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
}

.result-action--primary:hover {
  border-color: var(--color-primary-700);
  background: var(--color-primary-tint-subtle);
  color: var(--color-text-brand);
}

.result-action:focus-visible,
.search-result-action:focus-visible,
.backlinks-result-link:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.result-action:active,
.search-result-action:active {
  transform: translateY(1px);
}

.result-card-details,
.result-inline-panel,
.search-result-translation-panel,
.search-result-details-panel {
  margin-top: 9px;
  border: 1px solid var(--reading-border);
  border-radius: 5px;
  background: var(--reading-surface-muted-bg);
  padding: 9px 10px;
}

.result-card-details,
.search-result-details-panel {
  background: var(--color-bg-surface-muted);
}

.result-card-details-title,
.search-result-panel-title {
  margin: 0;
  color: var(--color-text-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.search-result-translation-text {
  margin: 7px 0 0;
  white-space: pre-wrap;
  color: var(--reading-translation);
  font-size: var(--reading-translation-size);
  line-height: var(--reading-translation-line-height);
  word-break: break-word;
  overflow-wrap: anywhere;
}

.search-result-alternate-text--original {
  color: var(--reading-text);
}

/* Expanded translation panels must show the full text (no preview clamp). */
.search-result-translation-panel:not([hidden]),
.backlinks-result-translation-panel:not([hidden]),
.reader-translation-wrap:not([hidden]) {
  overflow: visible;
  max-height: none;
  height: auto;
}

.search-result-translation-panel:not([hidden]) .search-result-translation-text,
.backlinks-result-translation-panel:not([hidden]) .search-result-translation-text,
.reader-translation-wrap:not([hidden]) .reader-translation-text,
.reader-scripture-preview-text--translation:not([hidden]) {
  display: block;
  overflow: visible;
  max-height: none;
  height: auto;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  -webkit-box-orient: unset;
  text-overflow: clip;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.result-card-details-grid,
.search-result-details-list {
  margin: 6px 0 0;
  display: grid;
  gap: 7px;
}

.search-result-detail-row {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(96px, max-content) 1fr;
  gap: 7px;
  align-items: baseline;
}

.search-result-detail-row dt {
  margin: 0;
  color: var(--color-text-subtle);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.78rem;
  font-weight: 600;
}

.search-result-detail-row dd {
  margin: 0;
  color: var(--color-text);
  font-size: 0.86rem;
  line-height: 1.45;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.search-result-detail-cite,
.search-result-detail-reference,
.search-result-detail-chunk-id,
.search-result-detail-internal-id {
  color: var(--color-text-muted);
  font-size: 0.84rem;
  line-height: 1.48;
}

.reader-container {
  margin-top: 10px;
  display: grid;
  gap: 8px;
  background: var(--reading-page-bg);
}

.reader-utility {
  /* Permanently sticky so the browser pins the bar natively when it reaches
     the top. Toggling between static and sticky in JS per scroll frame caused
     a visible snap/jump at the threshold. */
  position: sticky;
  top: 0;
  z-index: 70;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 16px;
  background: linear-gradient(180deg, var(--reading-surface-bg) 0%, var(--reading-surface-muted-bg) 100%);
  border: 1px solid var(--reading-border);
  border-top: 3px solid var(--reading-link);
  border-bottom: 1px solid var(--reading-border);
  margin-bottom: 6px;
  padding: 6px 10px 5px;
}

/* The class now only reveals the contextual title once the bar is pinned;
   positioning is handled by .reader-utility above. */
.reader-utility--sticky-visible {
  margin-bottom: 8px;
}

.reader-toolbar-main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.reader-toolbar-title {
  /* Keep the title in the layout permanently (only toggle its visibility) so
     revealing it when the bar sticks does NOT change the bar height. Otherwise
     the extra line pushes the progress bar down/up at the scroll threshold,
     which reads as the progress bar "appearing and disappearing" while
     scrolling (very visible on mobile). */
  visibility: hidden;
  margin: 0;
  color: var(--reading-title);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.32;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.reader-utility--sticky-visible .reader-toolbar-title {
  visibility: visible;
}

.reader-controls {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px 14px;
  justify-self: end;
  padding-left: 8px;
  border-left: 0;
}

.reader-controls-nav-group,
.reader-controls-translation-group {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.reader-controls-nav-group:empty,
.reader-controls-nav-group:not(:has(> :not([hidden]))) {
  display: none;
}

.reader-controls-label {
  margin: 0;
  color: var(--reading-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.78rem;
  line-height: 1.2;
  letter-spacing: 0.015em;
}

.reader-control-label-desktop {
  display: inline;
}

.reader-control-label-mobile {
  display: none;
}

.reader-controls .secondary-button:not(:disabled) {
  min-height: 30px;
  border-color: var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  border-radius: 0;
  padding: 4px 9px;
  font-size: 0.78rem;
  line-height: 1.2;
  white-space: nowrap;
}

.reader-controls .secondary-button:hover:not(:disabled) {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.reader-controls .secondary-button:focus-visible:not(:disabled) {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.reader-section-nav-button[hidden] {
  display: none;
}

.reader-legacy-translation-control[hidden] {
  display: none;
}

.reader-text-view-button {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 4px 9px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.reader-translation-switch {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  color: var(--color-text);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
}

.reader-translation-switch input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
}

.reader-translation-switch-track {
  position: relative;
  flex: 0 0 32px;
  width: 32px;
  height: 16px;
  border: 1px solid var(--color-border-strong);
  border-radius: 999px;
  background: var(--badge-muted-bg);
  box-sizing: border-box;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.reader-translation-switch-track::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--color-text-muted);
  box-shadow: 0 1px 2px var(--color-shadow-strong);
  transition:
    background-color 0.15s ease,
    transform 0.15s ease;
}

.reader-translation-switch input[type="checkbox"]:checked + .reader-translation-switch-track {
  border-color: var(--color-primary-700);
  background: var(--color-primary-700);
}

.reader-translation-switch input[type="checkbox"]:checked + .reader-translation-switch-track::after {
  background: var(--color-bg-surface-raised);
  transform: translateX(16px);
}

.reader-translation-switch:hover .reader-translation-switch-track {
  border-color: var(--color-border-hover);
}

.reader-translation-switch input[type="checkbox"]:focus-visible + .reader-translation-switch-track {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px var(--color-focus-ring);
}

.reader-translation-switch input[type="checkbox"]:disabled + .reader-translation-switch-track,
.reader-translation-switch input[type="checkbox"]:disabled ~ .reader-translation-switch-label {
  opacity: 0.6;
  cursor: not-allowed;
}

.reader-progress {
  width: min(360px, 100%);
  display: grid;
  gap: 3px;
}

.reader-progress-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
}

.reader-progress-label {
  margin: 0;
  color: var(--reading-muted);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.3;
}

.reader-progress-backlinks {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 24px;
  padding: 2px 8px;
  border: 1px solid var(--reading-border);
  background: var(--reading-surface-muted-bg);
  color: var(--reading-link);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1.4;
  border-radius: 4px;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease;
}

.reader-progress-backlinks:hover,
.reader-progress-backlinks:focus-visible {
  background: var(--color-control-bg-active);
  border-color: var(--color-border-hover);
  color: var(--color-text-brand);
}

.reader-progress-backlinks:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.reader-progress-backlinks:active {
  transform: translateY(1px);
}

.reader-progress-backlinks[hidden] {
  display: none;
}

.reader-toolbar-actions {
  position: relative;
  flex: 0 0 auto;
}

.reader-toolbar-actions-trigger {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  min-width: 0;
  border: 1px solid var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  border-radius: 4px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 4px 9px;
  cursor: pointer;
}

.reader-toolbar-actions-trigger:hover {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.reader-toolbar-actions-trigger:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.reader-toolbar-actions-trigger:disabled {
  border-color: var(--action-disabled-border);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  cursor: not-allowed;
  opacity: 1;
}

.reader-toolbar-actions-trigger-caret {
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  transform: translateY(1px);
  transition: transform 0.15s ease;
}

.reader-toolbar-actions-trigger[aria-expanded="true"] .reader-toolbar-actions-trigger-caret {
  transform: translateY(1px) rotate(180deg);
}

.reader-toolbar-actions-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  min-width: 206px;
  z-index: 40;
  display: grid;
  gap: 2px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-control-bg-soft);
  box-shadow: 0 10px 22px var(--color-shadow);
  padding: 4px;
}

.reader-toolbar-menu-action {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--color-text-strong);
  font-size: 0.82rem;
  line-height: 1.3;
  text-align: left;
  padding: 7px 8px;
  cursor: pointer;
}

.reader-toolbar-menu-action:hover,
.reader-toolbar-menu-action:focus-visible {
  background: var(--color-control-bg-hover);
}

.reader-toolbar-menu-action.is-active {
  background: var(--color-control-bg-active);
}

.reader-progress-track {
  position: relative;
  height: 4px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--reading-progress-track) 82%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--reading-border) 36%, transparent);
  overflow: hidden;
}

.reader-progress-fill {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--reading-link) 0%, var(--color-primary-600) 100%);
  transition: width 180ms ease;
}

/* Reading typography presets (size + line-height) apply via semantic CSS
   variables on body; profile previews use their own scoped preview sizes. */
body {
  --reading-original-size: 1.125rem;
  --reading-translation-size: 1.0125rem;
  --reading-original-line-height: 1.82;
  --reading-translation-line-height: 1.82;
}

body.reader-text-size-small {
  --reading-original-size: 1rem;
  --reading-translation-size: 0.9rem;
}

body.reader-text-size-normal {
  --reading-original-size: 1.125rem;
  --reading-translation-size: 1.0125rem;
}

body.reader-text-size-large {
  --reading-original-size: 1.375rem;
  --reading-translation-size: 1.2375rem;
}

body.reader-text-size-xlarge {
  --reading-original-size: 1.75rem;
  --reading-translation-size: 1.575rem;
}

body.reader-text-size-maximum {
  --reading-original-size: 2.84rem;
  --reading-translation-size: 2.56rem;
}

.profile-reading-size-preview--small {
  --profile-preview-size: var(--profile-preview-size-small);
}

.profile-reading-size-preview--normal {
  --profile-preview-size: var(--profile-preview-size-normal);
}

.profile-reading-size-preview--large {
  --profile-preview-size: var(--profile-preview-size-large);
}

.profile-reading-size-preview--xlarge {
  --profile-preview-size: var(--profile-preview-size-xlarge);
}

.profile-reading-size-preview--maximum {
  --profile-preview-size: var(--profile-preview-size-maximum);
}

body.reader-line-height-compact,
.profile-reading-line-height-preview--compact {
  --reading-original-line-height: 1.58;
  --reading-translation-line-height: 1.58;
}

body.reader-line-height-normal,
.profile-reading-line-height-preview--normal {
  --reading-original-line-height: 1.82;
  --reading-translation-line-height: 1.82;
}

body.reader-line-height-relaxed,
.profile-reading-line-height-preview--relaxed {
  --reading-original-line-height: 2;
  --reading-translation-line-height: 2;
}

.reader-original-text,
.ancient-text,
.search-result-original-text,
.backlinks-verse-excerpt,
.backlinks-result-snippet,
.reader-scripture-preview-text,
.reader-library-drawer-item-excerpt,
.reader-library-drawer-item-note-body {
  font-size: var(--reading-original-size);
  line-height: var(--reading-original-line-height);
}

.reader-translation-text,
.search-result-translation-text {
  font-size: var(--reading-translation-size);
  line-height: var(--reading-translation-line-height);
}

.reader-original-text,
.ancient-text,
.search-result-original-text,
.backlinks-verse-excerpt,
.backlinks-result-snippet,
.reader-scripture-preview-text,
.reader-library-drawer-item-excerpt,
.reader-library-drawer-item-note-body,
.reader-translation-text,
.search-result-translation-text,
.profile-reading-preview-text {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Reader font preference body classes apply site-wide to every dynamic
   ancient/translation text surface (reader, search results, advanced search,
   scripture backlinks, scripture preview, library drawer item bodies). UI
   chrome (menu, labels, buttons) is intentionally left untouched. */
body.reader-font-gentium .reader-original-text,
body.reader-font-gentium .reader-translation-text,
body.reader-font-gentium .ancient-text,
body.reader-font-gentium .search-result-original-text,
body.reader-font-gentium .search-result-translation-text,
body.reader-font-gentium .reader-scripture-preview-text,
body.reader-font-gentium .reader-library-drawer-item-excerpt,
body.reader-font-gentium .reader-library-drawer-item-note-body,
body.reader-font-gentium .backlinks-verse-excerpt,
body.reader-font-gentium .backlinks-result-snippet,
body.reader-font-gentium .profile-reading-preview-text {
  font-family: "Gentium", "Noto Serif", Georgia, "Times New Roman", serif;
}

body.reader-font-gfs-didot .reader-original-text,
body.reader-font-gfs-didot .reader-translation-text,
body.reader-font-gfs-didot .ancient-text,
body.reader-font-gfs-didot .search-result-original-text,
body.reader-font-gfs-didot .search-result-translation-text,
body.reader-font-gfs-didot .reader-scripture-preview-text,
body.reader-font-gfs-didot .reader-library-drawer-item-excerpt,
body.reader-font-gfs-didot .reader-library-drawer-item-note-body,
body.reader-font-gfs-didot .backlinks-verse-excerpt,
body.reader-font-gfs-didot .backlinks-result-snippet,
body.reader-font-gfs-didot .profile-reading-preview-text {
  font-family: "GFS Didot", "Gentium", "Noto Serif", Georgia, "Times New Roman", serif;
}

body.reader-font-nau .reader-original-text,
body.reader-font-nau .reader-translation-text,
body.reader-font-nau .ancient-text,
body.reader-font-nau .search-result-original-text,
body.reader-font-nau .search-result-translation-text,
body.reader-font-nau .reader-scripture-preview-text,
body.reader-font-nau .reader-library-drawer-item-excerpt,
body.reader-font-nau .reader-library-drawer-item-note-body,
body.reader-font-nau .backlinks-verse-excerpt,
body.reader-font-nau .backlinks-result-snippet,
body.reader-font-nau .profile-reading-preview-text {
  font-family: "NAU5", "Gentium", "Noto Serif", Georgia, "Times New Roman", serif;
}

body.reader-font-kadmos .reader-original-text,
body.reader-font-kadmos .reader-translation-text,
body.reader-font-kadmos .ancient-text,
body.reader-font-kadmos .search-result-original-text,
body.reader-font-kadmos .search-result-translation-text,
body.reader-font-kadmos .reader-scripture-preview-text,
body.reader-font-kadmos .reader-library-drawer-item-excerpt,
body.reader-font-kadmos .reader-library-drawer-item-note-body,
body.reader-font-kadmos .backlinks-verse-excerpt,
body.reader-font-kadmos .backlinks-result-snippet,
body.reader-font-kadmos .profile-reading-preview-text {
  font-family: "Kadmos U", "Gentium", "Noto Serif", Georgia, "Times New Roman", serif;
}

/* ---------- Profile font picker ---------- */

.profile-font-picker {
  border: 0;
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: 10px;
}

.profile-font-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px 14px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  cursor: pointer;
  transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.profile-font-tile:hover {
  border-color: var(--color-border-brand);
  background: var(--color-control-bg-active);
}

.profile-font-tile input[type="radio"] {
  position: absolute;
  opacity: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  margin: 0;
}

.profile-font-tile input[type="radio"]:focus-visible ~ .profile-font-sample {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.profile-font-tile.is-selected,
.profile-font-tile:has(input[type="radio"]:checked) {
  border-color: var(--color-primary-800);
  box-shadow: 0 0 0 2px var(--color-focus-ring);
  background: var(--color-control-bg-active);
}

.profile-font-sample {
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-text-strong);
  white-space: normal;
}

.profile-font-sample--gentium {
  font-family: "Gentium", "Noto Serif", serif;
}

.profile-font-sample--gfs-didot {
  font-family: "GFS Didot", "Gentium", "Noto Serif", serif;
}

.profile-font-sample--nau {
  font-family: "NAU5", "Gentium", "Noto Serif", serif;
}

.profile-font-sample--kadmos {
  font-family: "Kadmos U", "Gentium", "Noto Serif", serif;
}

.profile-reading-control-label {
  display: block;
  margin: 0 0 8px;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 600;
}

.profile-font-picker > .profile-reading-control-label {
  grid-column: 1 / -1;
}

.profile-reading-preview-fieldset {
  border: 0;
  margin: 16px 0 0;
  padding: 0;
  --profile-preview-size-small: 1rem;
  --profile-preview-size-normal: 1.125rem;
  --profile-preview-size-large: 1.375rem;
  --profile-preview-size-xlarge: 1.75rem;
  --profile-preview-size-maximum: 2.25rem;
  --profile-preview-line-height-size: 1rem;
}

.profile-text-view-picker {
  margin-top: 4px;
}

.profile-text-view-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.profile-text-view-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
  min-height: 92px;
  padding: 12px 14px 14px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-text);
  cursor: pointer;
  transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.profile-text-view-tile input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.profile-text-view-check {
  position: absolute;
  top: 10px;
  right: 10px;
  display: none;
  color: var(--color-primary-800);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
}

.profile-text-view-tile.is-selected .profile-text-view-check,
.profile-text-view-tile:has(input[type="radio"]:checked) .profile-text-view-check {
  display: inline;
}

.profile-text-view-tile.is-selected,
.profile-text-view-tile:has(input[type="radio"]:checked) {
  border-color: var(--color-primary-700);
  box-shadow: 0 0 0 1px var(--color-primary-700);
  background: var(--color-bg-elevated, var(--color-bg-surface));
}

.profile-text-view-tile:hover {
  border-color: var(--color-primary-600);
}

.profile-text-view-tile input[type="radio"]:focus-visible ~ .profile-text-view-name {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.profile-text-view-name {
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.3;
  padding-right: 1.1rem;
}

.profile-text-view-description {
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--color-text-muted);
}

.profile-text-view-status {
  margin: 0 0 10px;
}

@media (max-width: 640px) {
  .profile-text-view-grid {
    grid-template-columns: 1fr;
  }
}

.profile-reading-preview-grid {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.profile-reading-preview-grid--size {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.profile-reading-preview-grid--size-five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.profile-reading-preview-grid--line-height {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.profile-reading-line-height-preview-scope {
  min-width: 0;
}

.profile-reading-preview-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
  min-width: 0;
  min-height: 84px;
  padding: 9px 10px 10px;
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-text);
  cursor: pointer;
  transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.profile-reading-preview-tile input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.profile-reading-preview-check {
  position: absolute;
  top: 7px;
  right: 8px;
  display: none;
  color: var(--color-primary-800);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
}

.profile-reading-preview-tile.is-selected .profile-reading-preview-check {
  display: inline-flex;
}

.profile-reading-preview-tile.is-selected {
  border-color: var(--color-primary-800);
  background: var(--color-control-bg-active);
  box-shadow: inset 0 0 0 1px var(--color-primary-800);
}

.profile-reading-preview-label {
  min-width: 0;
  padding-right: 14px;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.2;
}

.profile-reading-preview-text {
  margin: 0;
  color: var(--reading-text-strong);
  min-width: 0;
}

.profile-reading-size-sample {
  font-size: var(--profile-preview-size);
  line-height: 1.3;
  white-space: normal;
  overflow: visible;
  overflow-wrap: break-word;
}

.profile-reading-line-height-sample {
  display: grid;
  gap: 0;
  font-size: var(--profile-preview-line-height-size);
  line-height: var(--reading-original-line-height);
  white-space: normal;
  overflow: visible;
}

.profile-reading-line-height-sample > span {
  display: block;
}

.profile-reading-preview-tile:hover {
  border-color: var(--color-primary-700);
  background: var(--color-control-bg-hover);
}

.profile-reading-preview-tile input[type="radio"]:focus-visible ~ .profile-reading-preview-check,
.profile-reading-preview-tile input[type="radio"]:focus-visible ~ .profile-reading-preview-label {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

@media (max-width: 980px) {
  .profile-reading-preview-grid--size {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .profile-reading-preview-grid--size-five {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .profile-reading-preview-grid--line-height {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .profile-reading-preview-fieldset {
    --profile-preview-size-small: 0.875rem;
    --profile-preview-size-normal: 1rem;
    --profile-preview-size-large: 1.25rem;
    --profile-preview-size-xlarge: 1.5625rem;
    --profile-preview-size-maximum: 2rem;
    --profile-preview-line-height-size: 1rem;
  }

  .profile-reading-preview-grid--size-five,
  .profile-reading-preview-grid--line-height {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .profile-reading-preview-grid--size-five > [data-size="maximum"] {
    grid-column: 1 / -1;
  }
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

#readerChunksContainer.chunks {
  margin-top: 0;
  display: grid;
  gap: 0;
  background: transparent;
  border: 0;
  padding: 0;
  overflow-x: hidden;
}

.reader-edifying-toc,
.reader-related-edifying {
  width: min(100%, var(--content-max-width));
  margin: 24px auto 0;
  padding: 18px 20px;
  color: var(--color-text);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.reader-edifying-toc h2,
.reader-related-edifying h2 {
  margin: 0 0 12px;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.1rem;
}

.reader-edifying-toc ol,
.reader-related-edifying ul {
  margin: 0;
  padding-inline-start: 1.4rem;
}

.reader-edifying-toc li + li,
.reader-related-edifying li + li {
  margin-top: 7px;
}

.reader-edifying-toc a,
.reader-related-edifying a {
  color: var(--color-text-brand);
  overflow-wrap: anywhere;
  text-underline-offset: 0.18em;
}

.reader-edifying-toc a:focus-visible,
.reader-related-edifying a:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 3px;
}

.reader-chunk-card {
  position: relative;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0 0 0 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  transition: border-color 140ms ease;
  /* Leave room for the sticky utility bar when scrolling a chunk into view
     via deep-link / library bookmark, so the top of the card is not hidden
     under the toolbar. */
  scroll-margin-top: 120px;
}

.reader-chunk-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  border-radius: 1px;
  background: transparent;
}

.reader-chunk-card + .reader-chunk-card {
  margin-top: 0;
  padding-top: 14px;
  border-top: 0;
}

.reader-chapter-separator {
  margin: 12px 0 4px;
  font-size: 0.76rem;
  color: var(--reading-title);
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.reader-chunk-card--active,
.reader-target-chunk {
  border-color: transparent;
}

.reader-chunk-card--active::before,
.reader-target-chunk::before {
  background: transparent;
}

.reader-chunk-card:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-text-chunk {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.reader-verse-line {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 0.45rem;
  align-items: start;
}

.reader-verse-line--numbered {
  grid-template-columns: max-content minmax(0, 1fr) auto;
  column-gap: 0.4em;
  align-items: baseline;
}

.reader-original-text,
.reader-translation-text {
  margin: 0;
  white-space: pre-wrap;
  letter-spacing: 0.01em;
}

.reader-original-text {
  color: var(--reading-text-strong);
  display: block;
  margin: 0;
  padding: 2px 0;
  border-radius: 4px;
  cursor: pointer;
}

.reader-chunk-card--active .reader-original-text,
.reader-target-chunk .reader-original-text {
  background: transparent;
}

.reader-verse-number {
  font-size: 0.74rem;
  color: var(--reading-link);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.01em;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.reader-text-chunk {
  position: relative;
}

.reader-verse-line-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

.reader-chunk-note-indicator {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  padding: 2px 4px;
  margin: 0;
  cursor: pointer;
  color: var(--color-accent-gold);
  border-radius: 3px;
  line-height: 0;
  transition: color 0.15s ease-out, background 0.15s ease-out;
}

.reader-chunk-note-indicator:hover,
.reader-chunk-note-indicator:focus-visible {
  color: var(--color-text-brand);
  background: var(--color-control-bg-hover);
  outline: none;
}

.reader-chunk-note-indicator:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-chunk-note-indicator svg {
  display: block;
}

.reader-chunk-note-wrap {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 60;
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 14px 36px 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-bg-surface-muted);
  box-shadow:
    0 14px 32px var(--color-shadow-strong),
    0 4px 10px var(--color-shadow);
  animation: reader-note-popup 160ms ease-out;
  max-width: 720px;
}

@keyframes reader-note-popup {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.reader-chunk-note-close {
  position: absolute;
  top: 6px;
  right: 6px;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  font-size: 1.1rem;
  color: var(--color-text-muted);
  cursor: pointer;
  padding: 2px 8px;
  line-height: 1;
  border-radius: 50%;
}

.reader-chunk-note-close:hover {
  background: var(--color-primary-tint-subtle);
  color: var(--color-text-strong);
}

.reader-chunk-note-close:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.reader-chunk-note-label {
  margin: 0;
  font-size: 0.8rem;
  color: var(--color-text-muted);
}

.reader-chunk-note-input {
  width: 100%;
  min-height: 68px;
  resize: vertical;
  border: 1px solid var(--color-border);
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  padding: 8px;
  font-size: 0.9rem;
  line-height: 1.5;
}

.reader-chunk-note-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.reader-chunk-note-status {
  flex: 1 1 auto;
  font-size: 0.78rem;
  color: var(--notice-muted);
  min-height: 1.1em;
}

.reader-chunk-note-status.error {
  color: var(--notice-error-text);
}

.reader-chunk-note-save,
.reader-chunk-note-delete {
  flex: 0 0 auto;
  min-height: 28px;
  padding: 4px 10px;
  font-size: 0.78rem;
  line-height: 1.2;
  border-radius: 0;
  border: 1px solid var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  cursor: pointer;
}

.reader-chunk-note-save:hover,
.reader-chunk-note-delete:hover {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.reader-chunk-note-delete {
  color: var(--color-danger-text);
  border-color: var(--color-danger-border);
}

.reader-signed-out-cta {
  margin-top: 6px;
  padding: 6px 10px;
  border: 1px dashed var(--color-border-strong);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.35;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.reader-signed-out-cta-text {
  flex: 1 1 auto;
}

.reader-signed-out-cta-link {
  color: var(--color-primary-800);
  font-weight: 600;
  text-decoration: underline;
}

.reader-toolbar-actions-trigger[aria-disabled="true"],
.reader-toolbar-menu-action[aria-disabled="true"] {
  opacity: 0.55;
}

.reader-translation-wrap {
  margin-top: 1px;
  border-left: 2px solid var(--reading-border);
  background: var(--reading-surface-muted-bg);
  border-radius: 0;
  padding: 9px 11px;
  color: var(--reading-translation);
}

.reader-chunk-card--expanded .reader-translation-wrap {
  animation: reader-translation-reveal 180ms ease-out;
}

@keyframes reader-translation-reveal {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.reader-translation-text {
  margin-top: 0;
  color: var(--reading-translation);
}

.reader-original-text--translation {
  color: var(--reading-translation);
  font-size: var(--reading-translation-size);
  line-height: var(--reading-translation-line-height);
}

.reader-translation-text--original {
  color: var(--reading-text-strong);
  font-size: var(--reading-original-size);
  line-height: var(--reading-original-line-height);
}

.reader-translation-line {
  display: block;
}

.reader-translation-line--numbered {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 0.4em;
  align-items: baseline;
}

.reader-verse-number--translation {
  color: var(--reading-link);
}

@media (min-width: 980px) {
  .reader-chunk-card--expanded {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.92fr);
    column-gap: 18px;
    align-items: start;
  }

  .reader-chunk-card--expanded .reader-translation-wrap {
    align-self: start;
    margin-top: 0;
  }

}

@media (min-width: 721px) {
  .reader-controls-label,
  .reader-control-label-mobile {
    display: none;
  }
}

@media (max-width: 720px) {
  .reader-utility {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 6px;
    padding: 6px 9px;
  }

  .reader-utility--sticky-visible {
    top: 0;
  }

  .reader-toolbar-title {
    font-size: 0.8rem;
    line-height: 1.28;
  }

  .reader-controls {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: center;
    gap: 6px 8px;
    padding: 6px 0 0;
    border-left: 0;
    border-top: 1px solid var(--reading-border);
    background: transparent;
  }

  .reader-controls-nav-group {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
  }

  .reader-controls-nav-group .reader-section-nav-button {
    flex: 1 1 calc(50% - 4px);
    min-width: 0;
    justify-content: center;
  }

  .reader-controls-translation-group {
    display: flex;
    flex: 1 1 100%;
    flex-wrap: wrap;
    width: 100%;
    min-width: 0;
    gap: 6px;
  }

  .reader-text-view-button {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 36px;
    padding: 4px 8px;
    font-size: 0.81rem;
    font-weight: 500;
  }

  .reader-translation-switch {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
    justify-content: space-between;
    color: var(--reading-text);
    white-space: nowrap;
    font-size: 0.81rem;
    font-weight: 500;
    min-height: 36px;
    margin-top: 0;
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid var(--reading-border);
    background: var(--reading-surface-bg);
  }

  .reader-progress {
    width: 100%;
    min-width: 0;
    gap: 4px;
  }

  .reader-progress-row {
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px;
  }

  .reader-progress-backlinks {
    box-sizing: border-box;
    min-height: 32px;
    max-width: 100%;
    padding: 5px 8px;
    border-color: var(--reading-border);
    background: var(--reading-surface-muted-bg);
    color: var(--reading-link);
    font-size: 0.82rem;
    line-height: 1.2;
  }

  .reader-toolbar-actions {
    flex: 1 1 auto;
    max-width: 100%;
    min-width: 0;
  }

  .reader-toolbar-actions-trigger {
    box-sizing: border-box;
    min-height: 36px;
    width: auto;
    max-width: 100%;
    justify-content: center;
    font-size: 0.82rem;
    padding: 5px 8px;
    border-color: var(--action-secondary-border);
    background: var(--action-secondary-bg);
    color: var(--action-secondary-text);
    white-space: nowrap;
  }

  .reader-controls--scripture > .reader-progress-backlinks {
    flex: 0 1 auto;
    align-self: center;
    justify-content: center;
    white-space: nowrap;
  }

  .reader-controls--scripture .reader-toolbar-actions-trigger {
    text-align: center;
  }

  .reader-controls:not(.reader-controls--scripture) .reader-toolbar-actions {
    width: 100%;
  }

  .reader-controls:not(.reader-controls--scripture) .reader-toolbar-actions-trigger {
    width: 100%;
    justify-content: space-between;
  }

  @media (max-width: 380px) {
    .reader-controls--scripture > .reader-progress-backlinks,
    .reader-controls--scripture .reader-toolbar-actions {
      flex: 1 1 100%;
    }

    .reader-controls--scripture > .reader-progress-backlinks {
      width: fit-content;
      white-space: normal;
    }

    .reader-controls--scripture .reader-toolbar-actions-trigger {
      width: 100%;
      justify-content: space-between;
    }
  }

  .reader-toolbar-actions-menu {
    left: 0;
    right: auto;
    min-width: min(206px, 70vw);
    max-width: calc(100vw - 24px);
    padding: 5px;
    gap: 3px;
  }

  .reader-toolbar-menu-action {
    padding: 9px 10px;
    font-size: 0.9rem;
    line-height: 1.3;
  }

  .reader-chunk-card + .reader-chunk-card {
    margin-top: 12px;
    padding-top: 12px;
  }

  .reader-controls-label {
    display: block;
    flex-basis: 100%;
  }

  .reader-control-label-desktop {
    display: none;
  }

  .reader-control-label-mobile {
    display: inline;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reader-progress-fill,
  .reader-chunk-card,
  .reader-original-text,
  .reader-chunk-card--expanded .reader-translation-wrap,
  .reader-back-to-top-button,
  .reader-chunk-note-wrap {
    transition: none;
    animation: none;
  }
}

.reader-scripture-refs {
  margin-top: 8px;
  color: var(--color-text-muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.reader-scripture-label {
  font-weight: 700;
  margin-right: 4px;
}

.reader-scripture-list {
  display: inline;
}

.reader-scripture-ref,
.reader-scripture-ref:visited {
  color: var(--color-text-muted);
  text-decoration: none;
  border-bottom: 1px dotted var(--color-focus-ring-strong);
  cursor: pointer;
}

.reader-scripture-ref:hover,
.reader-scripture-ref:focus {
  color: var(--color-text-strong);
  border-bottom-color: var(--color-focus-ring-header);
}

.reader-inline-scripture-ref,
.reader-inline-scripture-ref:visited {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px dotted var(--color-focus-ring-strong);
  cursor: pointer;
  background: transparent;
  border-radius: 0;
  padding: 0;
}

.reader-inline-scripture-ref:hover,
.reader-inline-scripture-ref:focus {
  color: inherit;
  background: var(--color-primary-tint-subtle);
  border-bottom-color: var(--color-focus-ring-header);
}

.reader-scripture-backlinks {
  margin-top: 8px;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: 1.4;
}

.reader-scripture-backlinks-label {
  font-weight: 700;
  margin-right: 4px;
}

.reader-scripture-backlinks-list {
  display: inline;
}

.reader-scripture-backlink,
.reader-scripture-backlink:visited {
  color: var(--color-text-brand);
  text-decoration: none;
}

.reader-scripture-backlink:hover,
.reader-scripture-backlink:focus {
  color: var(--color-text-brand);
}

.reader-scripture-backlink-empty,
.reader-scripture-backlink-error,
.reader-scripture-backlink-loading {
  color: var(--color-text-muted);
}

.reader-scripture-backlink-error {
  color: var(--color-danger-text);
}

body.reader-scripture-preview-open {
  overflow: hidden;
}

.reader-scripture-preview-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 18px;
}

.reader-scripture-preview-modal[hidden] {
  display: none;
}

.reader-scripture-preview-backdrop {
  position: absolute;
  inset: 0;
  background: var(--color-overlay);
}

.reader-scripture-preview-dialog {
  position: relative;
  width: min(980px, 100%);
  max-height: calc(100vh - 36px);
  overflow: auto;
  background: var(--color-bg-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-800);
  border-radius: 3px;
  box-shadow: 0 20px 45px var(--color-shadow-strong);
  padding: 18px 20px 18px;
}

.reader-scripture-preview-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.reader-scripture-preview-heading {
  min-width: 0;
}

.reader-scripture-preview-title {
  margin: 0;
  color: var(--color-primary-800);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.25;
}

.reader-scripture-preview-source {
  display: inline-flex;
  align-items: center;
  margin: 8px 0 0;
  padding: 3px 8px;
  border: 1px solid var(--color-border-control);
  border-radius: 999px;
  background: var(--color-bg-surface-muted);
  color: var(--color-text-muted);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
}

.reader-scripture-preview-source[hidden] {
  display: none;
}

.reader-scripture-preview-close {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--action-secondary-border);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
  border-radius: 3px;
  width: 30px;
  height: 30px;
  padding: 0;
  line-height: 1;
  font-size: 1.1rem;
  cursor: pointer;
  flex: 0 0 auto;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.reader-scripture-preview-close:hover {
  border-color: var(--color-border-brand);
  background: var(--action-secondary-bg-hover);
  color: var(--color-primary-700);
}

.reader-scripture-preview-close:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.reader-scripture-preview-body {
  display: block;
}

.reader-scripture-preview-section-label {
  margin: 0 0 7px;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.reader-scripture-preview-section {
  border: 1px solid var(--color-border-muted);
  border-radius: 4px;
  background: var(--color-bg-surface-muted);
  padding: 16px 18px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.reader-scripture-preview-section--clickable {
  cursor: pointer;
  transition: background-color 120ms ease;
}

.reader-scripture-preview-section--clickable:hover {
  background: var(--color-control-bg-hover);
}

.reader-scripture-preview-section--clickable:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.reader-scripture-preview-text {
  margin: 0;
  white-space: pre-wrap;
  color: var(--color-text-strong);
}

.reader-scripture-preview-text--translation {
  margin-top: 14px;
  border-top: 1px solid var(--color-border-muted);
  border-left: 2px solid var(--color-primary-700);
  background: var(--color-control-bg-hover);
  padding: 12px 0 0 12px;
}

.reader-scripture-preview-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--color-border-muted);
}

.reader-scripture-preview-action-help {
  flex: 1 1 240px;
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.35;
  text-align: right;
}

.reader-scripture-preview-primary {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  border-radius: 4px;
  min-height: 36px;
  padding: 0.45rem 0.95rem;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.reader-scripture-preview-primary:hover {
  border-color: var(--action-primary-bg-hover);
  background: var(--action-primary-bg-hover);
}

.reader-scripture-preview-primary:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.empty-state {
  color: var(--color-text-muted);
}

@media (max-width: 850px) {
  .search-primary-grid {
    grid-template-columns: 1fr;
  }

  .search-field-wide {
    grid-column: auto;
  }

  .search-field .search-result-limit-select {
    width: 78px;
    min-width: 78px;
  }

  .search-intro-text {
    font-size: 0.92rem;
  }

  .search-answer {
    padding: 12px 12px 11px;
  }

  .search-answer-title {
    font-size: 1rem;
  }

  .search-answer-text {
    font-size: 0.95rem;
  }

  .search-grid {
    grid-template-columns: 1fr;
  }

  .reader-work-header-card {
    padding: 12px 14px 11px;
  }

  .reader-work-header-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

@media (max-width: 520px) {
  .site-header__title {
    font-size: clamp(0.98rem, 4.4vw, 1.08rem);
    line-height: 1.25;
  }

  .site-header__subtitle {
    font-size: 0.66rem;
    line-height: 1.38;
    max-width: none;
  }

  .site-header__logo {
    width: 22px;
    height: 22px;
  }

  .site-header__brand {
    gap: 0.55rem;
  }

  .llm-gate-help {
    position: static;
    margin-top: 8px;
    box-shadow: none;
  }

  .search-intro-title {
    font-size: 1.22rem;
  }

  .search-intro__title-row {
    font-size: 1.22rem;
  }
}

@media (max-width: 1024px) {
  /*
   * Unified mobile header row: brand | close/toggle.
   * Toggle lives as a sibling of identity (not absolute in the nav strip),
   * so the old empty white close row never appears.
   */
  .site-header {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    column-gap: 0.75rem;
    width: 100%;
    max-width: 100vw;
    background: var(--site-header-bg);
  }

  .site-header__identity {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    background: transparent;
  }

  .site-header__identity .site-header__inner {
    padding-top: 8px;
    padding-bottom: 7px;
    padding-right: 0;
    max-width: none;
  }

  .site-header__brand {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.65rem;
    min-width: 0;
  }

  .site-header__brand-text {
    min-width: 0;
    gap: 0.28rem;
  }

  .site-header__title {
    font-size: clamp(1.02rem, 3.8vw, 1.16rem);
    line-height: 1.24;
  }

  .site-header__subtitle {
    font-size: 0.72rem;
    line-height: 1.35;
    max-width: none;
  }

  .site-header__logo {
    width: 24px;
    height: 24px;
    margin-top: 0.15em;
  }

  .site-header-nav-toggle {
    display: inline-flex;
    position: static;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    margin: 8px 12px 0 0;
    z-index: 40;
    background: transparent;
    border-color: var(--site-header-muted);
  }

  .site-header-nav-toggle:hover {
    background: var(--site-header-bg-accent);
    border-color: var(--site-header-text);
  }

  .site-header-nav-toggle:focus-visible {
    outline: 2px solid var(--color-focus-ring-header);
    outline-offset: 2px;
  }

  .site-header-nav-toggle-bar {
    background: var(--site-header-text);
  }

  .site-header__nav {
    grid-column: 1 / -1;
    grid-row: 2;
    position: relative;
    min-height: 0;
    padding: 0;
    background: transparent;
  }

  .site-header__nav .site-header__inner {
    display: none;
    width: 100%;
    min-height: 0;
    padding: 0;
    border-top: 1px solid var(--site-nav-border);
    background: var(--site-nav-panel-bg);
    box-shadow: none;
    gap: 0;
  }

  .site-header__nav.is-open .site-header__inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    max-height: min(70vh, 32rem);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    border-top: 1px solid var(--site-nav-border);
    background: var(--site-nav-panel-bg);
    animation: site-header-nav-open 160ms ease-out;
  }

  .site-nav__link {
    display: flex;
    flex: 0 0 auto;
    width: 100%;
    min-height: 44px;
    align-items: center;
    border: 0;
    border-top: 1px solid var(--site-nav-border);
    border-radius: 0;
    padding: 10px 16px 10px 18px;
    background: transparent;
    color: var(--site-nav-text);
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.3;
    text-align: left;
    box-sizing: border-box;
  }

  .site-nav__link::after {
    display: none;
  }

  .site-nav__link:hover {
    background: var(--site-nav-hover-bg);
    color: var(--site-nav-hover-text);
  }

  .site-nav__link.active,
  .site-nav__link[aria-current="page"] {
    border-left: 3px solid var(--site-nav-active-indicator);
    background: var(--site-nav-active-bg);
    color: var(--site-nav-active-text);
    font-weight: 700;
    padding-left: 15px;
  }

  .site-nav__link:first-child {
    border-top: 0;
  }

  .member-panel {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    width: 100%;
    align-self: stretch;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    margin: 8px 0 0;
    min-height: 0;
    padding: 4px 0 8px;
    border: 0;
    border-top: 1px solid var(--site-nav-account-divider);
    border-left: 0;
    border-inline-start: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    box-sizing: border-box;
  }

  .member-actions {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: stretch;
    gap: 0;
  }

  .member-account-button,
  .member-actions button {
    display: flex;
    width: 100%;
    min-height: 44px;
    align-items: center;
    justify-content: flex-start;
    padding: 10px 16px 10px 18px;
    font-size: 0.88rem;
    line-height: 1.25;
    text-align: left;
    box-sizing: border-box;
  }

  .member-account-button {
    color: var(--site-nav-text);
    font-weight: 600;
    border-top: 0;
  }

  .member-actions button {
    color: var(--site-nav-logout);
    background: transparent;
    border: 0;
    border-top: 1px solid var(--site-nav-border);
    font-weight: 600;
  }

  .member-account-button.active,
  .member-account-button[aria-current="page"] {
    box-shadow: none;
    border-left: 3px solid var(--site-nav-active-indicator);
    padding-left: 15px;
    background: var(--site-nav-active-bg);
    color: var(--site-nav-active-text);
  }

  .site-nav__link:focus-visible,
  .member-account-button:focus-visible,
  .member-actions button:focus-visible {
    outline: 2px solid var(--site-nav-focus);
    outline-offset: -3px;
  }
}

/* Open drawer: on wider mobile/tablet, leave backdrop beside the panel. */
@media (max-width: 1024px) and (min-width: 27rem) {
  body.site-nav-open .site-header {
    width: min(100%, 26rem);
    max-width: 100vw;
  }
}

body.site-nav-open {
  overflow: hidden;
}

.site-header-nav-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 25;
  border: 0;
  padding: 0;
  margin: 0;
  background: var(--color-overlay);
  cursor: pointer;
}

body.site-nav-open .site-header-nav-backdrop {
  display: block;
}

body.site-nav-open .site-header {
  position: relative;
  z-index: 30;
}

/* ---------- Profile AI settings ---------- */

.profile-ai-section {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid var(--color-border-muted);
  border-radius: 12px;
  background:
    linear-gradient(180deg, var(--color-bg-surface-muted), var(--color-bg-surface));
  box-shadow: 0 10px 24px var(--color-shadow);
}

.profile-ai-section + .profile-ai-section {
  margin-top: 20px;
}

.profile-ai-section .profile-card-title {
  color: var(--color-text-brand);
  font-size: 1.02rem;
}

.profile-ai-section .profile-help {
  margin-bottom: 14px;
}

.profile-api-key-form {
  display: grid;
  grid-template-columns: minmax(170px, 0.34fr) minmax(0, 1fr);
  gap: 10px 14px;
  align-items: center;
}

.profile-api-key-form label {
  margin: 0;
  color: var(--color-text);
  font-size: 0.9rem;
  font-weight: 800;
}

.profile-api-key-form input,
.profile-api-key-form select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--color-border);
  border-radius: 9px;
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  padding: 9px 11px;
  font: inherit;
  box-shadow: inset 0 1px 2px var(--color-shadow);
}

.profile-api-key-form select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--color-text-brand) 50%),
    linear-gradient(135deg, var(--color-text-brand) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 18px,
    calc(100% - 12px) 18px;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 34px;
}

.profile-api-key-form input:focus,
.profile-api-key-form select:focus {
  border-color: var(--color-focus);
  outline: 3px solid var(--color-focus-ring);
}

.profile-api-key-form input::placeholder {
  color: var(--color-text-subtle);
}

.profile-api-key-form .profile-details {
  grid-column: 1 / -1;
  margin: 4px 0 2px;
  padding: 12px 14px;
  border: 1px solid var(--color-border-muted);
  border-radius: 10px;
  background: var(--color-bg-surface-muted);
}

.profile-api-key-form .profile-usage-quota {
  grid-column: 1 / -1;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--color-danger-border);
  border-radius: 8px;
  background: var(--color-danger-bg);
  color: var(--color-danger-text);
  font-weight: 700;
}

.profile-api-key-actions {
  grid-column: 1 / -1;
  justify-content: flex-start;
  align-items: center;
  margin-top: 4px;
}

.profile-api-key-actions button {
  border-radius: 9px;
  min-height: 40px;
  padding: 9px 14px;
}

.profile-api-key-actions .profile-api-key-delete-link {
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-danger-text);
  text-decoration: none;
}

.profile-api-key-actions .profile-api-key-delete-link:hover {
  background: var(--color-danger-bg-hover);
  border-color: var(--color-danger-border);
}

@media (max-width: 720px) {
  .profile-ai-section {
    padding: 14px;
  }

  .profile-api-key-form {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .profile-api-key-form label {
    margin-top: 4px;
  }

  .profile-admin-maintenance-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .profile-admin-open-link,
  .profile-admin-maintenance-actions button {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
  }
}

/* Hard override for the AI settings tab: keep every control readable and
   prevent inherited/global form rules from collapsing labels and inputs inline. */
.profile-ai-section .profile-api-key-form {
  display: block !important;
}

.profile-ai-section .profile-api-key-form > label {
  display: block !important;
  margin: 14px 0 6px !important;
  color: var(--color-text-strong);
  font-size: 0.92rem;
  font-weight: 800;
}

.profile-ai-section .profile-api-key-form > input,
.profile-ai-section .profile-api-key-form > select {
  display: block !important;
  width: 100% !important;
  min-height: 44px;
  margin: 0 0 12px !important;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background-color: var(--color-bg-surface);
  color: var(--color-text-strong);
  padding: 10px 12px;
  font: inherit;
}

.profile-ai-section .profile-api-key-form > select {
  cursor: pointer;
}

.profile-ai-section .profile-card-titlebar {
  margin-bottom: 8px;
}

.profile-ai-section .profile-details {
  margin: 12px 0 14px !important;
}

.profile-ai-section .profile-actions {
  margin-top: 14px;
  display: flex;
  gap: 10px;
}

.profile-ai-section .profile-actions button {
  min-height: 42px;
  border-radius: 10px;
}

.profile-ai-section .profile-api-key-delete-link {
  padding: 9px 14px;
}

/* ---------- Profile account/settings polish ---------- */

.profile-panel {
  background: var(--color-bg-surface);
  border-color: var(--color-border);
  border-top: 3px solid var(--color-primary-800);
  border-radius: 14px;
  padding: 18px;
  box-shadow: 0 6px 18px var(--color-shadow);
}

.profile-hero {
  align-items: center;
  gap: 14px 18px;
  padding: 15px 16px 17px;
  margin: -18px -18px 18px;
  background:
    linear-gradient(180deg, var(--color-bg-surface-muted), var(--color-control-bg-active));
  border-bottom-color: var(--color-border-strong);
}

.profile-hero-avatar {
  width: 54px;
  height: 54px;
  border: 1px solid var(--color-primary-tint-subtle);
  box-shadow:
    inset 0 0 0 1px var(--color-bg-surface),
    0 1px 4px var(--color-shadow);
}

.profile-hero-title {
  font-size: clamp(1.12rem, 1.8vw, 1.32rem);
}

.profile-hero-subtitle,
.profile-hero-email {
  color: var(--color-text-muted);
  line-height: 1.5;
}

.profile-hero-pills {
  margin-top: 10px;
  gap: 7px;
}

.profile-status-pill {
  min-height: 25px;
  padding: 3px 10px;
  border-color: var(--color-border-strong);
  background: var(--color-bg-surface-muted);
  color: var(--color-text-muted);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 0.76rem;
  font-weight: 650;
  letter-spacing: 0.01em;
}

.profile-status-pill[data-variant="success"] {
  background: var(--color-success-bg);
  color: var(--color-success-text);
  border-color: var(--color-success-border);
}

.profile-status-pill[data-variant="info"] {
  background: var(--color-bg-surface-muted);
  color: var(--color-text-brand);
  border-color: var(--color-border-muted);
}

.profile-status-pill[data-variant="muted"] {
  background: var(--badge-muted-bg);
  color: var(--badge-muted-text);
  border-color: var(--badge-muted-border);
}

.profile-tabs {
  gap: 18px;
  margin: 0 0 18px;
  padding: 0 2px;
  border-bottom: 1px solid var(--color-border-strong);
  overflow: visible;
}

.profile-tab {
  position: relative;
  min-height: 42px;
  border: 0;
  border-radius: 0;
  padding: 7px 0 11px;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.92rem;
  font-weight: 650;
  white-space: nowrap;
}

.profile-tab:hover {
  background: transparent;
  color: var(--color-text-brand);
}

.profile-tab::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  border-radius: 999px;
  background: transparent;
  transform: scaleX(0.42);
  opacity: 0;
  transition:
    opacity 120ms ease,
    transform 120ms ease,
    background-color 120ms ease;
}

.profile-tab.is-active {
  top: 0;
  border: 0;
  background: transparent;
  color: var(--color-text-brand);
}

.profile-tab.is-active::after {
  background: linear-gradient(90deg, var(--color-primary-800) 0%, var(--color-accent-gold) 100%);
  opacity: 1;
  transform: scaleX(1);
}

.profile-tab:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 3px;
}

.profile-card {
  border-color: var(--color-border);
  border-radius: 14px;
  background: var(--color-bg-surface);
  padding: 16px;
  box-shadow: 0 5px 14px var(--color-shadow);
}

.profile-card-title,
.profile-card h3 {
  color: var(--color-text-brand);
  letter-spacing: 0.005em;
}

.profile-help {
  color: var(--color-text-muted);
  line-height: 1.58;
}

.profile-guest-panel {
  display: grid;
  max-width: 980px;
  margin: 0 auto;
  gap: 16px;
}

.profile-panel:has(> .profile-guest-panel:not([hidden])) {
  border: 0;
  background: transparent;
  box-shadow: none;
  max-width: 980px;
  margin: 0 auto;
  padding: 0;
}

body > main.page:has(.profile-panel > .profile-guest-panel:not([hidden])) {
  padding-bottom: 22px;
}

body > main.page:has(.profile-panel > .profile-guest-panel:not([hidden])) + .site-footer {
  margin-top: 28px;
}

.profile-panel:has(> .profile-guest-panel:not([hidden])) .profile-hero {
  margin: 0 0 12px;
  padding: 0 2px 10px;
  border: 0;
  border-bottom: 1px solid var(--color-border-muted);
  background: transparent;
}

#profileAuthCard {
  order: 1;
  grid-column: auto;
  padding: 20px 22px;
  border-color: var(--color-border);
  box-shadow: 0 4px 12px var(--color-shadow);
}

.profile-auth-intro-panel {
  order: 2;
  align-self: start;
  border: 1px solid var(--color-border-muted);
  border-radius: 12px;
  background: transparent;
  color: var(--color-text);
  padding: 13px 14px;
}

.profile-auth-intro-panel h3 {
  margin: 0 0 6px;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.94rem;
}

.profile-auth-intro-panel p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: 1.45;
}

.profile-auth-benefits {
  display: grid;
  gap: 8px;
  margin: 11px 0 0;
}

.profile-auth-benefits div {
  padding-top: 8px;
  border-top: 1px solid var(--color-focus-ring-subtle);
}

.profile-auth-benefits dt {
  margin: 0 0 2px;
  color: var(--color-text-brand);
  font-size: 0.86rem;
  font-weight: 650;
}

.profile-auth-benefits dd {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.82rem;
  line-height: 1.38;
}

@media (min-width: 820px) {
  .profile-guest-panel {
    grid-template-columns: minmax(280px, 320px) minmax(560px, 620px);
    align-items: start;
    justify-content: center;
    gap: 20px;
  }

  #profileAuthCard {
    order: 2;
  }

  .profile-auth-intro-panel {
    order: 1;
    position: sticky;
    top: 18px;
  }
}

.profile-auth-mode-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-bottom: 12px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--color-border-muted);
  border-radius: 0;
  background: transparent;
}

.profile-auth-mode-switch[hidden] {
  display: none;
}

.profile-auth-mode-button {
  appearance: none;
  min-height: 32px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--color-text);
  cursor: pointer;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 4px 8px 7px;
}

.profile-auth-mode-button:hover {
  color: var(--color-text-brand);
  background: var(--color-bg-surface-muted);
}

.profile-auth-mode-button.is-active {
  border-bottom-color: var(--action-secondary-border);
  background: transparent;
  color: var(--color-text-brand);
  box-shadow: none;
}

.profile-auth-mode-button:focus-visible,
.profile-auth-secondary button:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.profile-auth-form {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.profile-auth-field {
  display: grid;
  gap: 6px;
}

.profile-auth-field[hidden] {
  display: none;
}

.profile-auth-field label {
  color: var(--color-text);
  font-weight: 700;
}

.profile-auth-field input {
  width: 100%;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid var(--color-border-control);
  border-radius: 8px;
  background: var(--color-bg-surface-raised);
  color: var(--color-text);
  padding: 9px 11px;
  font: inherit;
}

.profile-auth-field input:focus {
  border-color: var(--color-focus);
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 0;
}

.profile-auth-field input::placeholder {
  color: var(--color-text-subtle);
}

.profile-auth-password-control {
  position: relative;
}

.profile-auth-password-control input {
  padding-right: 82px;
}

.profile-auth-password-toggle {
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  min-height: 26px;
  border: 0;
  border-left: 1px solid var(--color-border-muted);
  border-radius: 0;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 500;
  padding: 2px 4px 2px 8px;
  white-space: nowrap;
}

.profile-auth-password-toggle:hover {
  color: var(--color-text);
  text-decoration: underline;
}

.profile-auth-password-toggle:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 1px;
}

.profile-auth-field-error {
  margin: 0;
  color: var(--notice-error-text);
  font-size: 0.88rem;
  line-height: 1.45;
}

.profile-auth-field-error[hidden] {
  display: none;
}

.profile-actions.profile-auth-actions {
  justify-content: flex-start;
  gap: 8px;
  margin-top: 1px;
}

.profile-actions.profile-auth-actions button {
  min-height: 42px;
  padding: 9px 16px;
}

.profile-actions.profile-auth-actions button[hidden] {
  display: none;
}

.profile-actions.profile-auth-actions button.secondary {
  border-color: var(--action-secondary-border);
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
}

.profile-actions.profile-auth-actions button.secondary:hover {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.profile-auth-secondary {
  display: grid;
  gap: 4px;
  margin-top: -6px;
  padding-top: 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
}

.profile-auth-secondary[hidden] {
  display: none;
}

.profile-auth-secondary p,
.profile-auth-helper {
  margin: 0;
}

.profile-auth-secondary p[hidden],
.profile-auth-helper[hidden] {
  display: none;
}

.profile-auth-secondary button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  font: inherit;
  font-weight: 500;
  padding: 0;
  text-decoration: none;
  text-underline-offset: 3px;
}

.profile-auth-secondary button:hover {
  color: var(--color-text-brand);
  text-decoration: underline;
}

.profile-auth-secondary button:focus-visible {
  color: var(--color-text-brand);
  text-decoration: underline;
}

.profile-auth-helper {
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: 1.42;
  margin-top: -7px;
}

.profile-details {
  gap: 8px 0;
}

.profile-details dt {
  color: var(--color-text-subtle);
  font-weight: 650;
}

.profile-details dd {
  color: var(--color-text-strong);
}

.profile-theme-picker {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap: 14px;
}

.profile-theme-tile {
  appearance: none;
  position: relative;
  display: flex;
  min-height: 148px;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 6px;
  border: 1px solid var(--color-border-muted);
  border-radius: 13px;
  background: var(--color-bg-surface);
  box-shadow: 0 4px 12px var(--color-shadow);
  color: var(--color-text);
  cursor: pointer;
  font: inherit;
  padding: 10px 40px 10px 12px;
  text-align: left;
}

.profile-theme-tile:hover {
  border-color: var(--color-border-hover);
  background: var(--color-bg-surface-muted);
}

.profile-theme-tile:focus-visible {
  border-color: var(--color-focus);
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

.profile-theme-tile.is-selected,
.profile-theme-tile[aria-pressed="true"] {
  border-color: var(--color-focus-ring-strong);
  background: var(--color-control-bg-active);
  box-shadow:
    inset 0 0 0 1px var(--color-primary-tint-subtle),
    0 5px 14px var(--color-shadow);
}

.profile-theme-check {
  position: absolute;
  top: 10px;
  right: 12px;
  display: inline-flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-focus-ring);
  border-radius: 999px;
  background: var(--color-bg-surface-muted);
  box-shadow: 0 1px 3px var(--color-shadow);
  color: var(--color-primary-800);
  font-size: 0.74rem;
  font-weight: 800;
  opacity: 0;
}

.profile-theme-tile.is-selected .profile-theme-check,
.profile-theme-tile[aria-pressed="true"] .profile-theme-check {
  opacity: 1;
}

.profile-theme-name {
  display: block;
  max-width: calc(100% - 28px);
  color: var(--color-text-brand);
  font-size: 0.84rem;
  font-weight: 750;
  letter-spacing: 0.01em;
  line-height: 1.2;
}

.profile-theme-reading-preview {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: center;
  gap: 3px;
  min-height: 78px;
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--preview-border, var(--reading-border));
  border-radius: 8px;
  background: var(--preview-page-bg, var(--reading-page-bg));
}

.profile-theme-preview-title {
  display: block;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--preview-title, var(--reading-title));
}

.profile-theme-preview-original {
  display: block;
  font-family: "Gentium", "Noto Serif", Georgia, "Times New Roman", serif;
  font-size: 0.74rem;
  line-height: 1.32;
  color: var(--preview-text-strong, var(--reading-text-strong));
}

.profile-theme-preview-body {
  display: block;
  font-family: "Gentium", "Noto Serif", Georgia, "Times New Roman", serif;
  font-size: 0.7rem;
  line-height: 1.28;
  color: var(--preview-text, var(--reading-text));
}

.profile-theme-preview-translation {
  display: block;
  margin-top: 1px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.66rem;
  line-height: 1.26;
  color: var(--preview-translation, var(--reading-translation));
}

.profile-theme-preview-accent {
  display: block;
  width: 28px;
  height: 3px;
  margin-top: 4px;
  border-radius: 999px;
  background: var(--preview-accent, var(--reading-link));
}

.profile-theme-tile[data-theme-value="modern"] {
  --preview-page-bg: #fbfaf7;
  --preview-border: #ddd6ca;
  --preview-title: #6f1d1b;
  --preview-text-strong: #1c1814;
  --preview-text: #302922;
  --preview-translation: #5f554a;
  --preview-accent: #7f2a27;
}

.profile-theme-tile[data-theme-value="byzantine"] {
  --preview-page-bg: #e9d7ad;
  --preview-border: #c4a86e;
  --preview-title: #4f3420;
  --preview-text-strong: #2a1b10;
  --preview-text: #3b2819;
  --preview-translation: #66503a;
  --preview-accent: #355745;
}

.profile-theme-tile[data-theme-value="deep-plum"] {
  --preview-page-bg: #d8c6a2;
  --preview-border: #b59a6e;
  --preview-title: #5b342f;
  --preview-text-strong: #2b2118;
  --preview-text: #403226;
  --preview-translation: #6b5745;
  --preview-accent: #6c403a;
}

.profile-theme-tile[data-theme-value="liturgical"] {
  --preview-page-bg: #2b1b15;
  --preview-border: #5a4034;
  --preview-title: #f2d2ad;
  --preview-text-strong: #f0e4d6;
  --preview-text: #e2d3c4;
  --preview-translation: #c8b5a5;
  --preview-accent: #ddb27c;
}

.profile-theme-tile[data-theme-value="monastic"] {
  --preview-page-bg: #eef1ea;
  --preview-border: #c8cec0;
  --preview-title: #3f5a45;
  --preview-text-strong: #222018;
  --preview-text: #342c22;
  --preview-translation: #5c5244;
  --preview-accent: #4c6a52;
}

.profile-theme-tile[data-theme-value="patriarchal"] {
  --preview-page-bg: #090909;
  --preview-border: #545454;
  --preview-title: #ffd37a;
  --preview-text-strong: #ffffff;
  --preview-text: #f2f2f2;
  --preview-translation: #d0d0d0;
  --preview-accent: #ffcf63;
}

.profile-theme-status:empty {
  display: none;
}

.profile-font-picker {
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 12px;
}

.profile-font-tile {
  min-height: 132px;
  border-color: var(--color-border-muted);
  border-radius: 13px;
  background: var(--color-bg-surface);
  padding: 14px 16px 16px;
  gap: 8px;
  justify-content: flex-start;
  box-shadow: 0 4px 12px var(--color-shadow);
}

.profile-font-tile:hover {
  border-color: var(--color-border-hover);
  background: var(--color-bg-surface-muted);
}

.profile-font-tile.is-selected,
.profile-font-tile:has(input[type="radio"]:checked) {
  border-color: var(--color-focus-ring-strong);
  background: var(--color-control-bg-active);
  box-shadow:
    inset 0 0 0 1px var(--color-primary-tint-subtle),
    0 5px 14px var(--color-shadow);
}

.profile-font-tile .profile-font-check {
  top: 10px;
  right: 12px;
  width: 20px;
  height: 20px;
  border: 1px solid var(--color-focus-ring);
  background: var(--color-bg-surface-muted);
  color: var(--color-primary-800);
  font-size: 0.74rem;
  box-shadow: 0 1px 3px var(--color-shadow);
}

.profile-font-name {
  display: block;
  max-width: calc(100% - 30px);
  color: var(--color-text-muted);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.25;
  text-transform: uppercase;
}

.profile-font-sample {
  color: var(--color-text-strong);
  font-size: 1.03rem;
  line-height: 1.58;
  flex: 1 1 auto;
}

.profile-ai-section {
  margin-top: 18px;
  padding: 16px 0 2px;
  border: 0;
  border-top: 1px solid var(--color-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.profile-ai-section + .profile-ai-section {
  margin-top: 22px;
}

.profile-ai-section .profile-card-titlebar {
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px 12px;
}

.profile-ai-section .profile-card-title {
  font-size: 1.02rem;
}

.profile-ai-section .profile-help {
  margin-bottom: 14px;
  max-width: 72ch;
}

.profile-admin-override-notice {
  margin: 0 0 14px;
}

.profile-admin-override-notice[hidden] {
  display: none;
}

.profile-admin-override-notice strong {
  color: var(--color-text-brand);
  font-weight: 750;
}

.profile-ai-section .profile-api-key-form > label {
  margin: 12px 0 5px !important;
  color: var(--color-text);
  font-size: 0.86rem;
  font-weight: 700;
}

.profile-ai-section .profile-api-key-form > input,
.profile-ai-section .profile-api-key-form > select {
  min-height: 42px;
  margin-bottom: 11px !important;
  border-color: var(--color-border);
  border-radius: 6px;
  background-color: var(--color-bg-surface);
  box-shadow: inset 0 1px 1px var(--color-shadow);
}

.profile-api-key-form select,
.profile-ai-section .profile-api-key-form > select {
  appearance: none;
  background-image: var(--search-chevron-icon);
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 12px 8px;
  padding-right: 34px;
}

.profile-api-key-form input:focus,
.profile-api-key-form select:focus,
.profile-ai-section .profile-api-key-form > input:focus,
.profile-ai-section .profile-api-key-form > select:focus {
  border-color: var(--color-focus);
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 1px;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.profile-technical-eyebrow {
  margin: 10px 0 6px;
  color: var(--color-text-subtle);
  font-size: 0.76rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.profile-ai-section .profile-details.profile-vector-details {
  margin: 0 0 15px !important;
  padding: 8px 0 10px;
  border: 0;
  border-top: 1px solid var(--color-border-muted);
  border-bottom: 1px solid var(--color-border-muted);
  border-radius: 0;
  background: transparent;
}

.profile-ai-section .profile-vector-details dt {
  color: var(--color-text-subtle);
  font-size: 0.8rem;
}

.profile-ai-section .profile-vector-details dd {
  color: var(--color-text-strong);
  font-size: 0.9rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.profile-api-key-form .profile-usage-quota.error {
  padding: 10px 12px;
  border-color: var(--color-danger-border);
  background: var(--color-danger-bg);
  color: var(--color-danger-text);
  font-weight: 650;
}

.profile-ai-section .profile-actions {
  gap: 9px;
  margin-top: 12px;
}

.profile-actions button,
.profile-ai-section .profile-actions button {
  min-height: 40px;
  border-radius: 6px;
  font-weight: 650;
  padding: 8px 14px;
}

.profile-api-key-actions .profile-api-key-delete-link,
.profile-ai-section .profile-api-key-delete-link {
  border-color: var(--color-border);
  background: var(--color-bg-surface);
  color: var(--color-danger-text);
}

.profile-api-key-actions .profile-api-key-delete-link:hover,
.profile-ai-section .profile-api-key-delete-link:hover {
  border-color: var(--color-danger-border);
  background: var(--color-danger-bg-hover);
  color: var(--color-danger-text);
}

.profile-ai-page-help {
  max-width: 72ch;
}

.profile-ai-feature-card {
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: var(--color-bg-surface);
  padding: 16px;
  box-shadow: 0 3px 10px var(--color-shadow);
}

.profile-ai-section.profile-ai-feature-card {
  border-top: 1px solid var(--color-border);
}

.profile-ai-section .profile-card-titlebar .profile-help {
  margin: 4px 0 0;
}

.profile-ai-status-message {
  margin-top: 12px;
  margin-bottom: 10px;
}

.profile-ai-personal-access,
.profile-ai-provider-advanced {
  margin-top: 12px;
  border-top: 1px solid var(--color-border-muted);
  padding-top: 10px;
}

.profile-ai-personal-access > summary,
.profile-ai-provider-advanced > summary {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  border: 1px solid var(--color-border-control);
  border-radius: 999px;
  background: var(--color-bg-surface);
  padding: 5px 11px;
  cursor: pointer;
  color: var(--color-text-brand);
  font-weight: 700;
}

.profile-ai-personal-access > summary:focus-visible,
.profile-ai-provider-advanced > summary:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.profile-ai-personal-access[open] > summary,
.profile-ai-provider-advanced[open] > summary {
  background: var(--color-control-bg-active);
  border-color: var(--color-border-control-active);
}

.profile-ai-simple-form {
  margin-top: 10px;
}

.profile-ai-field,
.profile-ai-default-fields,
.profile-ai-advanced-fields {
  display: block;
}

.profile-ai-field {
  margin: 0 0 11px;
}

.profile-ai-field label {
  display: block;
  margin: 0 0 5px;
  color: var(--color-text);
  font-size: 0.86rem;
  font-weight: 700;
}

.profile-ai-field input,
.profile-ai-field select {
  display: block;
  width: 100%;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid var(--color-border-control);
  border-radius: 8px;
  background: var(--color-bg-surface-raised);
  color: var(--color-text);
  padding: 9px 11px;
  font: inherit;
  box-shadow: inset 0 1px 1px var(--color-shadow);
}

.profile-ai-field select {
  appearance: none;
  background-image: var(--search-chevron-icon);
  background-position: right 11px center;
  background-repeat: no-repeat;
  background-size: 12px 8px;
  padding-right: 34px;
}

.profile-ai-field input:focus,
.profile-ai-field select:focus {
  border-color: var(--color-focus);
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 0;
  box-shadow: 0 0 0 2px var(--color-focus-ring-subtle);
}

.profile-ai-no-key-message {
  margin: 0 0 10px;
  color: var(--color-text-muted);
  font-size: 0.9rem;
}

.profile-ai-advanced-section {
  box-shadow: none;
  background: var(--color-bg-surface-muted);
}

.profile-ai-advanced-section .profile-technical-details {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.profile-ai-advanced-section .profile-vector-details dt {
  font-family: inherit;
}

.profile-usage-progress {
  height: 10px;
  margin: 8px 0 12px;
  border-color: var(--color-border-muted);
  background: var(--badge-muted-bg);
  box-shadow: inset 0 1px 2px var(--color-shadow);
}

.profile-usage-progress-fill {
  border-radius: inherit;
  background: linear-gradient(90deg, var(--color-primary-800) 0%, var(--color-accent-gold) 100%);
}

.profile-usage-progress[data-variant="warning"] .profile-usage-progress-fill {
  background: linear-gradient(90deg, var(--color-warning) 0%, var(--color-warning-border) 100%);
}

.profile-usage-progress[data-variant="danger"] .profile-usage-progress-fill {
  background: linear-gradient(90deg, var(--color-danger) 0%, var(--color-primary-600) 100%);
}

.profile-usage-quota {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin-bottom: 12px;
  color: var(--color-text-muted);
  font-size: 0.92rem;
}

.profile-usage-metric-label {
  flex: 0 0 100%;
  color: var(--color-text-subtle);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.profile-usage-metric-value {
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.04rem, 1.6vw, 1.24rem);
  font-weight: 700;
  line-height: 1.25;
}

.profile-usage-metric-percent {
  color: var(--color-text-brand);
  font-size: 0.92rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}

.profile-usage-metric-note {
  flex: 0 0 100%;
  color: var(--color-text-subtle);
  font-size: 0.86rem;
  line-height: 1.45;
}

.profile-technical-details {
  border-top-color: var(--color-border-muted);
  padding-top: 14px;
}

.profile-technical-details > summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  border: 1px solid var(--color-border-control);
  border-radius: 4px;
  background: var(--color-bg-surface);
  padding: 5px 10px;
  color: var(--color-text-muted);
  font-weight: 650;
  list-style: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.profile-technical-details > summary::-webkit-details-marker {
  display: none;
}

.profile-technical-details > summary::after {
  content: "";
  width: 12px;
  height: 8px;
  background-image: var(--search-chevron-icon);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px 8px;
  flex: 0 0 auto;
  transition: transform 120ms ease;
}

.profile-technical-details[open] > summary::after {
  transform: rotate(180deg);
}

.profile-technical-details > summary:hover {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.profile-technical-details > summary:focus-visible {
  outline: 2px solid var(--color-focus-ring-strong);
  outline-offset: 2px;
}

.profile-usage-table {
  min-width: 420px;
  border-collapse: collapse;
}

.profile-usage-table th,
.profile-usage-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--color-border-muted);
}

.profile-usage-table th {
  color: var(--color-text-subtle);
  font-size: 0.78rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  background: var(--color-bg-surface-muted);
}

.profile-usage-table th:nth-child(2),
.profile-usage-table th:nth-child(3),
.profile-usage-table th:nth-child(4) {
  text-align: right;
}

.profile-usage-table tbody tr:hover {
  background: var(--color-bg-surface-muted);
}

.profile-usage-table td:first-child,
.profile-usage-model {
  color: var(--color-text-strong);
  overflow-wrap: anywhere;
}

.profile-usage-table td:nth-child(2),
.profile-usage-table td:nth-child(3),
.profile-usage-table td:nth-child(4),
.profile-usage-number {
  color: var(--color-text);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 720px) {
  .profile-panel {
    padding: 14px;
    border-radius: 12px;
  }

  .profile-hero {
    grid-template-columns: 1fr;
    margin: -14px -14px 14px;
    padding: 14px;
  }

  .profile-hero-avatar {
    width: 48px;
    height: 48px;
  }

  .profile-tabs {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin: 0 0 14px;
    padding-bottom: 1px;
    border-bottom: 1px solid var(--color-border-strong);
  }

  .profile-tab {
    flex: 0 1 auto;
    min-height: 36px;
    border: 0;
    padding: 6px 0 9px;
    background: transparent;
    text-align: left;
  }

  .profile-tab:first-child {
    border-top: 0;
  }

  .profile-tab.is-active {
    background: transparent;
  }

  .profile-tab.is-active::after {
    content: "";
    float: none;
    font-size: inherit;
  }

  .profile-tab-panel.is-active {
    border: 0;
    background: transparent;
    padding: 0;
  }

  .profile-card {
    padding: 14px;
  }

  #profileAuthCard {
    padding: 16px;
  }

  body > main.page:has(.profile-panel > .profile-guest-panel:not([hidden])) {
    padding-bottom: 16px;
  }

  body > main.page:has(.profile-panel > .profile-guest-panel:not([hidden])) + .site-footer {
    margin-top: 20px;
  }

  .profile-auth-intro-panel {
    padding: 12px;
    border-radius: 12px;
  }

  .profile-auth-benefits {
    gap: 7px;
    margin-top: 9px;
  }

  .profile-auth-benefits div {
    padding-top: 7px;
  }

  .profile-auth-mode-switch {
    border-radius: 0;
  }

  .profile-auth-mode-button {
    border-radius: 0;
  }

  .profile-actions.profile-auth-actions {
    align-items: stretch;
  }

  .profile-actions.profile-auth-actions button {
    width: 100%;
  }

  .profile-font-picker {
    grid-template-columns: 1fr;
  }

  .profile-font-tile {
    min-height: 118px;
  }

  .profile-ai-section {
    padding-top: 14px;
  }

  .profile-ai-section .profile-card-titlebar {
    align-items: flex-start;
  }

  .profile-ai-section .profile-actions {
    align-items: stretch;
  }

  .profile-ai-section .profile-actions button {
    width: 100%;
  }

  .profile-usage-table {
    min-width: 380px;
  }
}

@media (max-width: 720px) {
  .results-section {
    margin-top: 16px;
  }

  .results-header {
    margin-bottom: 8px;
  }

  .results-title {
    font-size: 1.02rem;
  }

  .results-subtitle {
    font-size: 0.84rem;
  }

  .search-answer {
    padding: 11px 11px 10px;
  }

  .search-answer-subtitle,
  .search-answer-meta,
  .search-answer-note {
    font-size: 0.8rem;
  }

  .reader-work-header-title {
    font-size: 1.02rem;
  }

  .reader-work-header-detail-row {
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .result-card,
  .result-item,
  .search-result-card {
    padding: 10px 11px;
  }

  .backlinks-results-panel {
    padding: 0;
  }

  .backlinks-results-list {
    padding-left: 0;
    gap: 12px;
  }

  .backlinks-result-title-row {
    gap: 6px;
  }

  .result-card-actions,
  .result-actions,
  .search-result-actions {
    align-items: stretch;
    gap: 5px;
  }

  .result-action,
  .search-result-action {
    flex: 1 1 auto;
    min-width: min(100%, 124px);
    min-height: 34px;
    padding: 5px 8px;
  }

  .result-action--primary,
  .search-result-open-link,
  .backlinks-result-open-link {
    border-color: var(--color-border);
    background: var(--color-primary-tint-subtle);
    flex-basis: auto;
  }

  .search-result-detail-row dd {
    overflow-wrap: anywhere;
  }

  .search-result-detail-row {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

.admin-main-panel {
  display: grid;
  gap: 14px;
}

.admin-status {
  margin: 0;
  min-height: 0;
}

.admin-dialog {
  max-width: min(520px, 96vw);
  padding: 0;
  border: 1px solid var(--color-border-strong);
  border-radius: 10px;
  box-shadow: 0 16px 40px var(--color-shadow-strong);
}

.admin-dialog::backdrop {
  background: var(--color-overlay);
}

.admin-dialog-form {
  padding: 18px 20px 16px;
}

.admin-dialog-title {
  margin: 0 0 8px;
  font-size: 1.1rem;
  color: var(--color-text-brand);
}

.admin-dialog-intro {
  margin: 0 0 14px;
  font-size: 0.9rem;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.admin-dialog-checkboxes {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}

.admin-dialog-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.92rem;
  color: var(--color-text-strong);
}

.admin-dialog-quota-label {
  display: block;
  margin: 0 0 6px;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--color-text-muted);
}

.admin-dialog-quota-input {
  width: 100%;
  max-width: 280px;
  margin-bottom: 14px;
  padding: 6px 10px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
}

.admin-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.admin-member-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-card {
  background: var(--color-bg-surface-raised);
  border: 1px solid var(--color-border-muted);
  border-radius: 10px;
  padding: 14px;
}

.admin-card__title {
  margin: 0 0 10px;
  font-size: 1.02rem;
  color: var(--color-text-strong);
}

.admin-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.admin-form-grid label {
  font-size: 0.9rem;
  color: var(--color-text-muted);
  font-weight: 600;
}

.admin-form-grid input,
.admin-form-grid select {
  min-width: 0;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 0.92rem;
  color: var(--color-text-strong);
  background: var(--color-bg-surface-raised);
}

.admin-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
}

.admin-checkbox input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
}

.admin-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-start;
}

.admin-actions button,
.admin-jobs-header button {
  border: 1px solid var(--color-terminal-border);
  border-radius: 8px;
  background: var(--color-terminal-border);
  color: var(--color-terminal-text);
  padding: 8px 12px;
  font-size: 0.9rem;
  cursor: pointer;
}

.admin-actions button:hover,
.admin-jobs-header button:hover {
  background: var(--color-terminal-bg);
  border-color: var(--color-terminal-bg);
}

.admin-output {
  margin: 12px 0 0;
  background: var(--color-terminal-bg);
  color: var(--color-terminal-text);
  border-radius: 8px;
  border: 1px solid var(--color-terminal-border);
  padding: 10px;
  max-height: 360px;
  overflow: auto;
  font-size: 0.84rem;
  line-height: 1.4;
}

.admin-token-hint {
  grid-column: 1 / -1;
  margin: 0;
  padding: 8px 10px;
  border: 1px dashed var(--color-border);
  border-radius: 8px;
  background: var(--color-bg-surface-muted);
  color: var(--color-text-muted);
  font-size: 0.88rem;
}

.admin-token-hint code {
  font-size: 0.82rem;
}

.admin-jobs-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.admin-jobs-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--color-border-muted);
  border-radius: 8px;
  overflow: hidden;
}

.admin-jobs-table th,
.admin-jobs-table td {
  border-bottom: 1px solid var(--color-border-muted);
  padding: 8px 10px;
  text-align: left;
  font-size: 0.86rem;
  vertical-align: top;
}

.admin-jobs-table th {
  background: var(--color-bg-surface-muted);
  color: var(--color-text-strong);
  font-weight: 600;
}

.admin-jobs-table tbody tr:last-child td {
  border-bottom: 0;
}

.admin-jobs-empty {
  color: var(--color-text-subtle);
  font-style: italic;
}

@media (max-width: 900px) {
  .admin-form-grid {
    grid-template-columns: 1fr;
  }

  .admin-actions,
  .admin-token-hint {
    grid-column: 1 / -1;
  }

  .admin-jobs-table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}

/* ---------- Admin page ---------- */

.admin-shell {
  max-width: 1200px;
}

.admin-hero {
  display: grid;
  gap: 8px;
  margin: 22px 0 18px;
  padding: 22px;
  border: 1px solid var(--color-border-brand);
  border-radius: 18px;
  background: linear-gradient(180deg, var(--color-control-bg-soft) 0%, var(--color-control-bg-active) 100%);
  box-shadow: 0 12px 32px var(--color-shadow);
}

.admin-eyebrow {
  margin: 0;
  color: var(--color-accent-gold);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.admin-title {
  margin: 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.55rem, 3vw, 2.25rem);
}

.admin-subtitle {
  margin: 0;
  max-width: 760px;
  color: var(--color-text-muted);
  line-height: 1.5;
}

.admin-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 14px;
}

.admin-search-label {
  display: grid;
  gap: 6px;
  min-width: min(420px, 100%);
  color: var(--color-text-strong);
  font-weight: 700;
}

.admin-search-input,
.admin-page-size {
  border: 1px solid var(--color-border-strong);
  border-radius: 12px;
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  min-height: 40px;
  padding: 8px 10px;
  font: inherit;
  box-shadow: inset 0 1px 0 var(--color-bg-surface-raised);
}

.admin-status {
  margin: 0 0 10px;
  min-height: 1.4em;
}

.admin-card {
  border: 1px solid var(--color-border-strong);
  border-radius: 16px;
  background: var(--color-bg-surface);
  overflow: auto;
  box-shadow: 0 10px 28px var(--color-shadow);
}

.admin-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
}

.admin-table th,
.admin-table td {
  border-bottom: 1px solid var(--color-border-muted);
  padding: 9px 10px;
  text-align: left;
  vertical-align: top;
}

.admin-table th {
  background: var(--action-secondary-bg);
  color: var(--color-control-text-emphasis);
  font-size: 0.76rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.admin-table tbody tr:hover {
  background: var(--color-bg-surface-muted);
}

.admin-sort-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
  font: inherit;
  font-weight: 800;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
}

.admin-sort-button::after {
  content: "↕";
  color: var(--color-text-subtle);
  font-size: 0.72rem;
}

.admin-sort-button[aria-sort="ascending"]::after {
  content: "↑";
  color: var(--color-text-brand);
}

.admin-sort-button[aria-sort="descending"]::after {
  content: "↓";
  color: var(--color-text-brand);
}

.admin-user-email {
  color: var(--color-text-strong);
  font-weight: 700;
}

.admin-user-name,
.admin-muted {
  color: var(--color-text-muted);
  font-size: 0.88rem;
}

.admin-ai-stack {
  display: grid;
  gap: 4px;
  min-width: 180px;
  line-height: 1.32;
}

.admin-ai-line {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}

.admin-ai-line-label {
  color: var(--color-text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.admin-ai-detail {
  margin: -1px 0 0;
  font-size: 0.83rem;
  line-height: 1.25;
}

.admin-key-hint {
  display: block;
  margin-top: 4px;
  color: var(--color-text-muted);
  font-size: 0.82rem;
}

.admin-actions-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.admin-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

.admin-pagination-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.admin-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 18px;
}

.admin-modal[hidden] {
  display: none;
}

.admin-modal-backdrop {
  position: absolute;
  inset: 0;
  background: var(--color-overlay);
}

.admin-modal-dialog {
  position: relative;
  width: min(520px, 100%);
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--color-border-strong);
  border-top: 4px solid var(--color-primary-900);
  border-radius: 18px;
  background: var(--color-bg-surface);
  padding: 18px;
  color: var(--color-text-strong);
  box-shadow: 0 24px 70px var(--color-shadow-strong);
}

.admin-modal-dialog.admin-ai-dialog {
  width: min(760px, 100%);
  display: grid;
  gap: 14px;
}

.admin-modal-title {
  margin: 0 0 6px;
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.25rem;
}

.admin-modal-subtitle {
  margin: 0 0 14px;
  color: var(--color-text-muted);
}

.admin-modal-identity {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: -4px 0 2px;
  color: var(--color-text-muted);
}

.admin-ai-card {
  border: 1px solid var(--color-border-muted);
  border-radius: 16px;
  background: var(--color-bg-surface-muted);
  padding: 14px;
  display: grid;
  gap: 10px;
}

.admin-ai-card-title {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.05rem;
}

.admin-ai-card-help {
  margin: -4px 0 4px;
  color: var(--color-text-muted);
  font-size: 0.9rem;
  line-height: 1.4;
}

.admin-ai-toprow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  border: 1px solid var(--color-border-muted);
  border-radius: 10px;
  background: var(--color-bg-surface);
}

.admin-ai-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.admin-ai-fields[hidden] {
  display: none;
}

.admin-ai-fields .admin-quota-label {
  margin-top: 0;
}

.admin-ai-muted-box {
  padding: 10px 12px;
  border: 1px dashed var(--color-border-strong);
  border-radius: 10px;
  background: var(--color-bg-surface);
  color: var(--color-text-muted);
  font-size: 0.9rem;
  line-height: 1.4;
}

.admin-ai-muted-box[hidden] {
  display: none;
}

.admin-key-state-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.admin-key-state {
  padding: 9px 10px;
  border: 1px solid var(--color-border-muted);
  border-radius: 12px;
  background: var(--color-bg-surface);
  display: grid;
  gap: 4px;
}

.admin-key-state-label {
  color: var(--color-text-muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.admin-ai-quota {
  border-top: 1px solid var(--color-border-muted);
  padding-top: 10px;
}

.admin-ai-subheading {
  margin: 0 0 8px;
  font-size: 0.92rem;
  color: var(--color-text-strong);
  font-weight: 800;
}

.admin-vector-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.admin-vector-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--color-border-muted);
  border-radius: 10px;
  background: var(--color-bg-surface);
}

.admin-vector-row-title {
  font-weight: 800;
  color: var(--color-text-strong);
}

.admin-vector-row-meta {
  margin-top: 2px;
  color: var(--color-text-muted);
  font-size: 0.82rem;
}

.admin-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.admin-dims-badge {
  border: 1px solid var(--badge-border);
  border-radius: 999px;
  padding: 2px 7px;
  background: var(--badge-bg);
  color: var(--primitive-ink-700);
  font-size: 0.78rem;
  white-space: nowrap;
}

.admin-profile-info {
  display: grid;
  grid-template-columns: minmax(150px, 0.38fr) minmax(0, 1fr);
  gap: 6px 12px;
  padding: 10px 12px;
  border: 1px solid var(--color-border-muted);
  border-radius: 10px;
  background: var(--color-bg-surface);
  font-size: 0.88rem;
}

.admin-profile-info dt {
  color: var(--color-text-muted);
  font-weight: 800;
}

.admin-profile-info dd {
  margin: 0;
  color: var(--color-text-strong);
}

.admin-strong-warning {
  padding: 10px 12px;
  border: 1px solid var(--color-danger-border);
  border-radius: 10px;
  background: var(--color-danger-bg-hover);
  color: var(--color-danger-text);
  font-weight: 700;
}

.admin-strong-warning[hidden] {
  display: none;
}

.admin-quota-label {
  display: grid;
  gap: 6px;
  margin-top: 14px;
  font-weight: 700;
}

.admin-quota-input {
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  min-height: 40px;
  padding: 8px 10px;
  font: inherit;
}

.admin-modal-actions {
  position: sticky;
  bottom: -18px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 8px -18px -18px;
  padding: 12px 18px;
  border-top: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
  backdrop-filter: blur(8px);
}

.admin-conversions {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 16px;
  border: 1px solid var(--color-border-strong);
  border-radius: 16px;
  background: var(--color-bg-surface);
  box-shadow: 0 10px 28px var(--color-shadow);
}

.admin-conversions-title {
  margin: 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.2rem;
}

.admin-conversions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}

.admin-conversions-field {
  display: grid;
  gap: 6px;
  color: var(--color-text-strong);
  font-weight: 700;
}

.admin-conversions-field input[type="text"] {
  border: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  min-height: 40px;
  padding: 8px 10px;
  font: inherit;
}

.admin-checkbox-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  color: var(--color-text-strong);
  font-weight: 600;
}

.admin-conversions-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.admin-conversions-actions a {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid var(--color-border-strong);
  border-radius: 999px;
  background: var(--color-bg-surface);
  color: var(--color-text-brand);
  font-weight: 800;
  text-decoration: none;
}

.admin-conversions-actions a:hover {
  border-color: var(--color-border-brand);
  background: var(--color-danger-bg);
}

.admin-conversion-jobs {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.admin-conversion-job {
  border: 1px solid var(--color-border-muted);
  padding: 10px;
  background: var(--primitive-parchment-150);
}

.admin-conversion-job pre {
  white-space: pre-wrap;
  margin: 8px 0 0;
  max-height: 220px;
  overflow: auto;
  font-size: 0.82rem;
}

@media (max-width: 720px) {
  .admin-ai-fields,
  .admin-profile-info,
  .admin-key-state-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .admin-toolbar {
    align-items: stretch;
  }

  .admin-search-label,
  .admin-refresh-button {
    width: 100%;
  }

  .admin-modal {
    padding: 10px;
  }
}

/* Admin users page refinements: restrained Material-inspired surfaces. */
.admin-shell {
  max-width: 1180px;
}

.admin-hero {
  gap: 7px;
  margin: 22px 0 16px;
  padding: 24px 26px;
  border: 1px solid var(--color-border-muted);
  border-top: 3px solid var(--color-border-brand);
  border-radius: 14px;
  background: var(--color-bg-surface);
  box-shadow: 0 8px 22px var(--color-shadow);
}

.admin-eyebrow,
.admin-section-eyebrow {
  margin: 0;
  color: var(--color-text-brand);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.admin-title {
  font-size: clamp(1.55rem, 2.7vw, 2.08rem);
  letter-spacing: -0.01em;
}

.admin-subtitle {
  max-width: 720px;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.admin-section-card,
.admin-card {
  border: 1px solid var(--color-border-muted);
  border-radius: 14px;
  background: var(--color-bg-surface);
  box-shadow: 0 6px 18px var(--color-shadow);
}

.admin-section-card__header,
.admin-table-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.admin-conversions {
  gap: 15px;
  margin: 0 0 14px;
  padding: 16px;
  border-color: var(--color-border-muted);
  box-shadow: 0 4px 14px var(--color-shadow);
}

.admin-conversions-title,
.admin-card__title {
  margin: 3px 0 0;
  color: var(--color-text-strong);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.12rem;
  line-height: 1.25;
}

.admin-conversions-grid {
  grid-template-columns: minmax(230px, 1.3fr) minmax(160px, 0.8fr) minmax(150px, 0.7fr) minmax(240px, 1.2fr);
  gap: 12px;
}

.admin-conversions-field {
  gap: 7px;
  min-width: 0;
  color: var(--color-text-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.admin-fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}

.admin-fieldset legend {
  margin: 0 0 7px;
  padding: 0;
  color: var(--color-text-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.admin-conversions-field input[type="text"],
.admin-search-input,
.admin-page-size {
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-bg-surface);
  color: var(--color-text-strong);
  min-height: 38px;
  padding: 8px 10px;
  font: inherit;
  box-shadow: none;
}

.admin-conversions-field input[type="text"]:focus,
.admin-search-input:focus,
.admin-page-size:focus {
  border-color: var(--color-focus);
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 1px;
}

.admin-checkbox-row {
  gap: 7px 12px;
}

.admin-check-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--color-text);
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1.35;
}

.admin-check-option input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--color-primary-700);
}

.admin-overwrite-option {
  width: fit-content;
  color: var(--color-text-muted);
}

.admin-conversions-actions {
  justify-content: space-between;
  gap: 10px 14px;
  padding-top: 2px;
}

.admin-conversions-action-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.admin-conversions-actions a,
.admin-manifest-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid var(--action-secondary-border);
  border-radius: 999px;
  background: var(--action-secondary-bg);
  color: var(--action-secondary-text);
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
}

.admin-conversions-actions a:hover,
.admin-manifest-link:hover {
  border-color: var(--action-secondary-border-hover);
  background: var(--action-secondary-bg-hover);
}

.admin-conversion-job {
  border-radius: 10px;
  background: var(--color-bg-surface-muted);
}

.admin-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  align-items: end;
  gap: 12px;
  margin: 0 0 14px;
  padding: 12px 14px;
}

.admin-toolbar-left,
.admin-toolbar-right {
  display: flex;
  align-items: end;
  gap: 10px;
}

.admin-toolbar-left {
  min-width: 0;
  flex-wrap: wrap;
}

.admin-toolbar-right {
  justify-content: flex-end;
}

.admin-search-label {
  min-width: min(360px, 100%);
  color: var(--color-text-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.admin-page-size-label {
  min-width: 110px;
}

.admin-toolbar-count {
  margin: 0 0 8px;
  white-space: nowrap;
}

.admin-status {
  margin: 0;
  min-height: 0;
}

.admin-users-card {
  overflow: hidden;
}

.admin-table-header {
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--color-border-muted);
  background: var(--color-bg-surface);
}

.admin-table-header .admin-status {
  max-width: min(420px, 100%);
}

.admin-table-scroll {
  overflow-x: auto;
  max-width: 100%;
}

.admin-table-scroll:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: -2px;
}

.admin-table {
  width: 100%;
  min-width: 1040px;
  border-collapse: separate;
  border-spacing: 0;
}

.admin-table th,
.admin-table td {
  border-bottom: 1px solid var(--color-border-muted);
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}

.admin-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--color-bg-surface-muted);
  color: var(--color-text-muted);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-table tbody tr:last-child td {
  border-bottom: 0;
}

.admin-table tbody tr:hover {
  background: var(--color-control-bg-hover);
}

.admin-table tbody tr.is-disabled {
  background: var(--color-bg-surface-muted);
}

.admin-sort-button:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 3px;
}

.admin-user-stack {
  display: grid;
  gap: 5px;
  min-width: 180px;
}

.admin-user-email {
  color: var(--color-text-strong);
  font-weight: 800;
  line-height: 1.25;
}

.admin-user-name,
.admin-muted {
  color: var(--color-text-muted);
  font-size: 0.84rem;
}

.admin-ai-stack {
  gap: 6px;
  min-width: 170px;
  line-height: 1.35;
}

.admin-ai-line {
  gap: 6px;
}

.admin-ai-line-label {
  color: var(--color-text-muted);
  font-size: 0.74rem;
  font-weight: 800;
}

.admin-ai-detail,
.admin-profile-value,
.admin-quota-value,
.admin-date-value {
  color: var(--color-text);
  font-size: 0.84rem;
}

.admin-profile-value {
  overflow-wrap: anywhere;
}

.admin-chip,
.admin-pill {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 21px;
  border: 1px solid var(--badge-border);
  border-radius: 999px;
  background: var(--badge-bg);
  color: var(--badge-text);
  padding: 2px 7px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1.2;
}

.admin-chip--success,
.admin-pill.yes {
  border-color: var(--badge-success-border);
  background: var(--badge-success-bg);
  color: var(--badge-success-text);
}

.admin-chip--warning,
.admin-pill.admin {
  border-color: var(--badge-warning-border);
  background: var(--badge-warning-bg);
  color: var(--badge-warning-text);
}

.admin-chip--danger {
  border-color: var(--color-danger-border);
  background: var(--color-danger-bg);
  color: var(--color-danger-text);
}

.admin-chip--info {
  border-color: var(--color-border);
  background: var(--color-control-bg-soft);
  color: var(--color-text-brand);
}

.admin-chip--muted,
.admin-pill.no {
  border-color: var(--badge-muted-border);
  background: var(--badge-muted-bg);
  color: var(--badge-muted-text);
}

.admin-actions-cell {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  min-width: 130px;
}

.admin-actions-cell .admin-action-button {
  width: 100%;
}

.admin-actions-cell .admin-action-button.danger {
  border-color: var(--color-danger-border);
  background: var(--color-bg-surface);
}

.admin-actions-cell .admin-action-button.danger:hover {
  background: var(--action-danger-bg-hover);
}

.admin-empty-cell {
  padding: 42px 16px !important;
}

.admin-empty-state {
  display: grid;
  place-items: center;
  min-height: 90px;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.admin-pagination {
  justify-content: flex-end;
  margin: 12px 0 36px;
}

.admin-pagination-controls {
  padding: 4px;
  border: 1px solid var(--color-border-muted);
  border-radius: 999px;
  background: var(--color-bg-surface);
}

@media (max-width: 980px) {
  .admin-conversions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-toolbar {
    grid-template-columns: 1fr;
  }

  .admin-toolbar-right {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .admin-hero {
    padding: 18px;
  }

  .admin-conversions-grid,
  .admin-toolbar-left,
  .admin-toolbar-right {
    grid-template-columns: 1fr;
  }

  .admin-conversions-grid {
    display: grid;
  }

  .admin-conversions-actions,
  .admin-conversions-action-group,
  .admin-toolbar-left,
  .admin-toolbar-right {
    align-items: stretch;
  }

  .admin-conversions-actions > *,
  .admin-conversions-action-group > *,
  .admin-search-label,
  .admin-page-size-label,
  .admin-refresh-button {
    width: 100%;
  }

  .admin-toolbar-count {
    margin: 0;
  }

  .admin-table-header {
    display: grid;
  }

  .admin-table-scroll {
    overflow-x: visible;
  }

  .admin-table {
    min-width: 0;
  }

  .admin-table thead {
    display: none;
  }

  .admin-table,
  .admin-table tbody,
  .admin-table tr,
  .admin-table td {
    display: block;
    width: 100%;
  }

  .admin-table tbody {
    display: grid;
    gap: 12px;
    padding: 12px;
    background: var(--color-bg-surface-muted);
  }

  .admin-table tr {
    border: 1px solid var(--color-border-muted);
    border-radius: 12px;
    background: var(--color-bg-surface);
    box-shadow: 0 3px 10px var(--color-shadow);
    overflow: hidden;
  }

  .admin-table td {
    display: grid;
    grid-template-columns: minmax(120px, 0.38fr) minmax(0, 1fr);
    gap: 10px;
    border-bottom: 1px solid var(--color-border-muted);
    padding: 10px 12px;
  }

  .admin-table td::before {
    content: attr(data-label);
    color: var(--color-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
  }

  .admin-table td:last-child {
    border-bottom: 0;
  }

  .admin-actions-cell {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-empty-cell {
    display: block !important;
  }

  .admin-empty-cell::before {
    content: none !important;
  }
}

@media (max-width: 520px) {
  .admin-table td {
    grid-template-columns: 1fr;
  }

  .admin-actions-cell {
    grid-template-columns: 1fr;
  }
}

.search-intro-suitability {
  display: inline-flex;
  max-width: 100%;
  margin: 10px 0 0;
  padding: 7px 11px;
  border: 1px solid var(--color-border-muted);
  border-left: 3px solid var(--color-border-brand);
  border-radius: 4px;
  background: var(--color-bg-surface-muted);
  color: var(--color-text);
  font-size: 0.88rem;
  line-height: 1.5;
}

.search-result-limit-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0;
  min-height: 40px;
  padding: 0;
}

.search-result-limit-label {
  font-size: 0.8rem;
  color: var(--primitive-ink-700);
  line-height: 1.2;
  white-space: nowrap;
  font-weight: 600;
}

.result-count-control {
  border: 1px solid var(--color-border-strong);
  border-radius: 4px;
  background: var(--color-bg-surface);
  overflow: hidden;
  box-sizing: border-box;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease;
}

.result-count-control:hover {
  border-color: var(--color-border-hover);
  background: var(--color-bg-surface-muted);
}

.result-count-control:focus-within {
  border-color: var(--color-focus);
  box-shadow: 0 0 0 3px var(--color-focus-ring-subtle);
}

.result-count-label {
  display: inline-flex;
  align-items: center;
  align-self: stretch;
  padding: 0 10px;
  border-right: 1px solid var(--color-control-border);
  background: var(--color-control-bg-muted);
  color: var(--color-control-text);
  font-size: 0.82rem;
}

.search-form select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--color-border-strong);
  border-radius: 4px;
  background-color: var(--color-bg-surface);
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: right 11px center;
  background-size: 12px 8px;
  color: var(--color-text-strong);
  padding: 9px 34px 9px 11px;
  font: inherit;
  line-height: 1.25;
  cursor: pointer;
  box-shadow: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease;
}

.search-form select:hover:not(:disabled) {
  border-color: var(--color-border-hover);
  background-color: var(--color-bg-surface-muted);
}

.search-form select:focus,
.search-form select:focus-visible {
  border-color: var(--color-focus);
  box-shadow: 0 0 0 3px var(--color-focus-ring-subtle);
  outline: 0;
}

.search-form select:disabled {
  background-color: var(--color-control-bg-disabled);
  color: var(--color-text-subtle);
  cursor: not-allowed;
  opacity: 1;
}

.search-result-limit-select {
  width: auto;
  min-width: 76px;
  min-height: 40px;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  padding: 8px 32px 8px 12px;
  background-position: right 10px center;
  font-variant-numeric: tabular-nums;
}

.result-count-control .search-result-limit-select:hover:not(:disabled),
.result-count-control .search-result-limit-select:focus,
.result-count-control .search-result-limit-select:focus-visible {
  background-color: transparent;
  box-shadow: none;
}

.search-field select,
.search-grid select,
.reader-filter-field select,
.reader-library-drawer-filter-field select,
.admin-form-grid select,
.backlinks-range-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px 8px;
  padding-right: 34px;
}

select option {
  background-color: var(--color-control-bg);
  color: var(--color-control-text);
}

.search-collapsible-advanced {
  display: grid;
  gap: 8px;
  margin-top: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  align-self: end;
}

body[data-search-page="advanced"] .search-collapsible-advanced {
  grid-column: auto;
}

body[data-search-page="advanced"] .search-collapsible-advanced[open] {
  grid-column: 1 / -1;
  align-self: stretch;
  margin-top: 2px;
}

.search-collapsible-advanced > .search-collapsible-advanced__summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  justify-self: start;
  width: auto;
  min-width: 0;
  min-height: 34px;
  margin: 0;
  padding: 6px 14px;
  border: 1px solid var(--color-border-control);
  border-radius: 4px;
  background: var(--color-bg-surface-muted);
  color: var(--primitive-ink-700);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
  list-style: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease;
}

.search-collapsible-advanced > .search-collapsible-advanced__summary::-webkit-details-marker {
  display: none;
}

.search-collapsible-advanced > .search-collapsible-advanced__summary::after {
  content: "";
  width: 12px;
  height: 8px;
  background-image: var(--search-chevron-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 8px;
  flex: 0 0 auto;
  transform: translateY(1px);
  transition: transform 0.15s ease;
}

.search-collapsible-advanced[open] > .search-collapsible-advanced__summary {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.search-collapsible-advanced[open] > .search-collapsible-advanced__summary::after {
  transform: translateY(1px) rotate(180deg);
}

.search-collapsible-advanced > .search-collapsible-advanced__summary:focus-visible {
  outline: 2px solid var(--color-focus-ring-medium);
  outline-offset: 2px;
}

.search-collapsible-advanced > .search-collapsible-advanced__summary:hover {
  border-color: var(--color-border-control-active);
  background: var(--color-control-bg-active);
  color: var(--color-control-text-active);
}

.search-collapsible-advanced__grid {
  display: grid;
  gap: var(--search-space-md, 14px);
  margin-top: var(--search-space-xs, 8px);
  padding-top: var(--search-space-sm, 12px);
  border-top: 1px solid var(--color-border-muted);
}

.search-advanced-group {
  display: grid;
  gap: var(--search-space-sm, 10px);
}

.search-advanced-group + .search-advanced-group {
  padding-top: var(--search-space-sm, 12px);
  border-top: 1px solid var(--color-border-muted);
}

.search-advanced-group-title {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.25;
}

.search-advanced-group-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--search-space-sm, 12px) var(--search-space-md, 14px);
}

.search-advanced-group--model {
  justify-items: start;
}

@media (max-width: 720px) {
  .search-primary-grid > .search-field {
    grid-template-rows: auto auto;
  }

  .search-primary-grid > .search-field > label:not(.search-answer-toggle),
  .search-primary-grid > .search-field > .search-source-label-row,
  .search-primary-grid > .search-field > .search-answer-field-label {
    height: auto;
    min-height: 22px;
  }

  .reader-top-grid > .reader-filter-field,
  .reader-branch-grid > .reader-filter-field {
    grid-template-rows: auto auto;
  }

  .reader-top-grid > .reader-filter-field > label,
  .reader-branch-grid > .reader-filter-field > label,
  .reader-branch-grid > .reader-filter-field > .filter-label-row {
    height: auto;
    min-height: 22px;
  }

  .reader-top-grid,
  .reader-branch-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .reader-filters-analytical {
    gap: 8px;
  }

  .reader-search-actions {
    justify-content: stretch;
    align-items: stretch;
  }

  .reader-search-actions button {
    flex: 1 1 calc(50% - 0.25rem);
    min-width: 0;
  }

  .reader-branch-grid > .reader-filter-field--with-advanced {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    grid-template-areas:
      "label"
      "control"
      "advanced";
    row-gap: 6px;
    margin-bottom: 4px;
  }

  .reader-filter-field--with-advanced > .inline-advanced-filter {
    position: static;
    float: none;
    width: 100%;
    justify-self: stretch;
    align-self: stretch;
    margin-block: 6px 0;
  }

  .reader-filter-field--with-advanced > .inline-advanced-filter > summary {
    width: 100%;
    display: flex;
    justify-content: center;
    min-height: 36px;
    box-sizing: border-box;
  }

  .reader-filter-field--with-advanced > .inline-advanced-filter .work-genuineness-field {
    position: static;
    width: 100%;
    min-width: 0;
    margin-top: 8px;
  }

  .search-collapsible-advanced__grid {
    grid-template-columns: 1fr;
  }

  .search-advanced-group-grid {
    grid-template-columns: 1fr;
  }

  .search-collapsible-advanced > .search-collapsible-advanced__summary {
    width: 100%;
    min-width: 0;
  }

  .search-result-limit-wrap {
    justify-content: space-between;
    min-width: 0;
    width: 100%;
    padding-right: 0;
  }

  .search-result-limit-label {
    font-size: 0.78rem;
  }

  .search-query-row {
    grid-template-columns: 1fr;
  }

  .search-result-limit-select {
    width: auto;
    min-width: 0;
  }

  .search-actions {
    align-items: stretch;
  }

  .search-actions button {
    flex: 1 1 160px;
  }
}

@media (max-width: 760px) {
  body[data-search-page="simple"] .search-main-panel,
  body[data-search-page="advanced"] .search-main-panel,
  .search-stage.search-main-panel {
    padding: 4px 0 0;
  }

  .search-intro-block {
    margin-bottom: 18px;
  }

  .page--search .search-intro-block {
    text-align: left;
  }

  .search-intro-subtitle {
    font-size: 0.9rem;
  }

  .search-intro__info-button {
    width: 30px;
    height: 30px;
    margin-block: 0;
  }

  .search-intro__info-button::before {
    inset: -7px;
  }

  .search-compose__shell {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    min-height: 0;
    padding: 8px 10px 10px;
    gap: 8px;
  }

  .search-compose__icon {
    grid-row: 1;
    grid-column: 1;
    align-self: center;
    margin-right: 0;
  }

  .search-compose__field,
  .search-compose #queryInput {
    grid-row: 1;
    grid-column: 2;
    min-height: 44px;
    font-size: 1rem;
    padding: 10px 4px;
  }

  .search-compose__actions {
    grid-row: 2;
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    width: 100%;
  }

  /* Lexical: keep mic on the field row; submit full-width below. */
  .search-compose--lexical .search-compose__actions {
    display: contents;
  }

  .search-compose--lexical .search-compose__mic-root:not(:empty),
  .search-compose--lexical .search-compose__mic-root--mounted {
    grid-row: 1;
    grid-column: 3;
    align-self: center;
    justify-self: end;
  }

  .search-compose--lexical .search-compose__mic {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
  }

  .search-compose--lexical .search-compose__submit {
    grid-row: 2;
    grid-column: 1 / -1;
    width: 100%;
    min-height: 44px;
  }

  .search-compose--lexical .search-compose__clear {
    grid-row: 3;
    grid-column: 1 / -1;
    order: unset;
    width: 100%;
    min-height: 36px;
    justify-content: center;
  }

  .search-compose__submit {
    width: 100%;
    min-height: 44px;
  }

  .search-compose__clear {
    order: 2;
    width: 100%;
    min-height: 36px;
    justify-content: center;
  }

  .search-compose__shell--multiline {
    display: flex;
    flex-direction: column;
    padding: 0;
    gap: 0;
  }

  .search-compose__shell--multiline .search-compose__field--textarea,
  .search-compose__shell--multiline textarea#queryInput,
  .search-compose__shell--multiline .search-compose__field-wrap .search-compose__field--textarea {
    min-height: 88px;
    padding: 12px 12px 10px;
  }

  .search-compose__shell--multiline .search-compose__field-wrap--has-mic .search-compose__field--textarea,
  .search-compose__shell--multiline .search-compose__field-wrap:has(.search-compose__mic) textarea#queryInput {
    padding-inline-end: 48px;
  }

  .search-compose__mic-root--overlay {
    top: 8px;
    inset-inline-end: 8px;
  }

  .search-compose__footer {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 10px;
  }

  .search-compose__synthesis {
    flex: none;
    width: 100%;
  }

  .search-compose__synthesis-help {
    padding-left: 2.55rem;
  }

  .search-compose__footer-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    width: 100%;
    margin-left: 0;
  }

  .search-compose__footer-actions .search-compose__clear {
    order: 2;
  }

  .search-options-group {
    margin-top: 10px;
  }

  .search-options {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: stretch;
    gap: 6px;
  }

  .search-options__corpus,
  .search-options__toggle,
  .search-options__limit {
    width: 100%;
    max-width: none;
    flex: none;
    box-sizing: border-box;
  }

  .search-options__limit-select,
  .search-form .search-options__limit-select {
    flex: 1 1 auto;
    width: auto;
    min-width: 4.25rem;
    max-width: 100%;
  }

  .search-options .search-multiselect-menu {
    left: 0;
    right: 0;
    width: auto;
    min-width: 0;
    max-width: none;
    max-height: min(260px, 42vh);
  }

  .search-options__toggle {
    justify-content: space-between;
  }

  .search-options-panel {
    margin-top: var(--search-filters-offset, 10px);
    padding: 14px 14px;
  }

  body[data-search-page="simple"] .search-options-panel {
    padding: 12px 14px;
  }

  .search-options-panel__grid,
  .search-advanced-group-grid,
  .search-options-panel .search-collapsible-advanced__grid {
    grid-template-columns: 1fr;
  }

  .search-options-panel .search-advanced-group + .search-advanced-group {
    padding-top: 18px;
  }

  body[data-search-page="simple"] .search-primary-grid,
  body[data-search-page="advanced"] .search-primary-grid,
  .search-primary-grid {
    grid-template-columns: 1fr;
  }

  .search-source-advanced-filter,
  .inline-advanced-filter {
    width: 100%;
  }

  .advanced-filter-details summary {
    width: 100%;
    justify-content: center;
  }

  .search-source-advanced-filter .work-genuineness-field,
  .inline-advanced-filter .work-genuineness-field {
    position: static;
    width: 100%;
    min-width: 0;
    margin-top: 8px;
  }

  .search-multiselect,
  .search-multiselect-toggle,
  .search-field,
  .search-field input:not([type="checkbox"]),
  .search-field select {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .search-answer-advanced-toggle {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 520px) {
  .search-compose__submit-label {
    font-size: 0.9rem;
  }
}

.page--patristic-references {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  padding: 10px 20px 48px;
}

.page--patristic-references .catalogue-breadcrumbs {
  margin-bottom: 12px;
}

.page--patristic-references a,
.page--patristic-references a:visited {
  color: var(--color-text-brand);
}

.page--patristic-references a:hover {
  color: var(--color-primary-700);
  text-decoration-thickness: 0.07em;
  text-underline-offset: 0.18em;
}

.page--patristic-references a.result-action:hover {
  color: var(--color-text-brand);
  text-decoration: none;
}

.page--patristic-references a:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
  border-radius: 2px;
}

.patristic-references-intro {
  margin: 0;
  border-top: 3px solid var(--color-primary-800);
  border-bottom: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface-muted);
}

.patristic-references-hero,
.patristic-references-verse {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.patristic-references-hero {
  padding: 14px 18px 8px;
}

.patristic-references-verse {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 4px 18px;
  padding: 0 18px 13px;
}

.patristic-references-hero h1 {
  margin: 0;
  max-width: 46rem;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: clamp(1.35rem, 2.2vw, 1.75rem);
  line-height: 1.25;
}

.patristic-references-count {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 10px;
  margin: 7px 0 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: 1.4;
}

.patristic-references-count strong {
  color: var(--color-text);
  font-weight: 600;
}

.patristic-references-verse blockquote {
  flex: 1 1 34rem;
  margin: 3px 0;
  padding-inline-start: 12px;
  border-inline-start: 2px solid var(--color-accent-gold);
  font-family: "NAU5", "Noto Serif", Georgia, serif;
  font-size: 1.03rem;
  line-height: 1.58;
  color: var(--reading-text-strong, var(--color-text));
}

.patristic-references-chapter-link {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  font-size: 0.86rem;
  font-weight: 600;
}

.patristic-references-results {
  min-width: 0;
  margin-top: 18px;
}

.patristic-references-list-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 20px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--color-border-strong);
}

.patristic-references-list-heading__identity {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 5px 12px;
}

.patristic-references-list-heading h2,
.patristic-references-list-heading p,
.patristic-references-list-heading .patristic-references-pagination {
  margin: 0;
}

.patristic-references-list-heading h2 {
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.08rem;
  line-height: 1.3;
}

.patristic-references-list-heading p {
  color: var(--color-text-muted);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
}

.patristic-references-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 14px;
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  font-variant-numeric: tabular-nums;
}

.patristic-references-pagination a,
.reader-verse-patristic-link {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  color: var(--color-text-brand);
  font-weight: 650;
}

.patristic-references-pagination a {
  padding: 2px 3px;
  text-decoration: underline;
  text-decoration-color: var(--color-border-strong);
  text-underline-offset: 0.18em;
}

.patristic-references-pagination a:hover {
  text-decoration-color: currentColor;
}

.patristic-references-pagination--bottom {
  justify-content: flex-end;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--color-border-strong);
}

.patristic-references-list {
  display: grid;
  gap: 10px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  min-width: 0;
}

.patristic-reference-item {
  margin: 0;
  min-width: 0;
}

.page--patristic-references .search-result__title-line .search-result-work:hover,
.page--patristic-references
  .search-result__title-line
  .search-result-work:focus-visible {
  color: var(--color-text-brand);
  text-decoration: underline;
  text-decoration-thickness: 0.07em;
  text-underline-offset: 0.18em;
}

/* Translation / details panels are <details> so they keep working without JS,
   while looking and behaving like the utility's toggle buttons. */
.patristic-reference-panel {
  margin: 0;
  min-width: 0;
}

.patristic-reference-toggle {
  list-style: none;
}

.patristic-reference-toggle::-webkit-details-marker {
  display: none;
}

.patristic-reference-panel[open] {
  flex: 1 0 100%;
}

.patristic-reference-panel[open] .patristic-reference-toggle {
  border-color: var(--color-border-hover);
  background: var(--action-secondary-bg);
}

.patristic-reference-card__note {
  margin: 8px 0 0;
  color: var(--color-text-muted);
  font-size: 0.82rem;
}

.reader-verse-patristic-link {
  flex: 0 0 auto;
  margin-inline-start: 12px;
  font-size: 0.86rem;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .page--patristic-references {
    width: 100%;
    padding: 8px 10px 40px;
  }

  .patristic-references-hero,
  .patristic-references-verse {
    padding-inline: 12px;
  }

  .patristic-references-list-heading {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .patristic-references-pagination {
    justify-content: flex-start;
    gap: 8px 12px;
    font-size: 0.85rem;
  }

  .reader-verse-patristic-link {
    display: inline-block;
    margin: 8px 0 0;
  }

  .patristic-references-pagination--bottom {
    justify-content: flex-end;
  }
}

/* Editorial public pages: /technology, /en, /en/technology */
.page--editorial {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  padding: 10px 20px 48px;
}

.page--editorial a,
.page--editorial a:visited {
  color: var(--color-text-brand);
  text-decoration-thickness: 0.07em;
  text-underline-offset: 0.18em;
}

.page--editorial a:hover {
  color: var(--color-primary-700);
}

.page--editorial a:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
  border-radius: 2px;
}

.page--editorial .editorial-intro {
  margin: 0 0 22px;
  padding: 14px 18px 16px;
  border-top: 3px solid var(--color-primary-800);
  border-bottom: 1px solid var(--color-border-strong);
  background: var(--color-bg-surface-muted);
}

.editorial-kicker {
  margin: 0 0 6px;
  color: var(--color-accent-gold);
  font-size: 0.78rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  line-height: 1.35;
}

.page--editorial .search-intro-title {
  max-width: 46rem;
}

.page--editorial .search-intro-subtitle {
  margin-top: 8px;
  max-width: 48rem;
  color: var(--color-text);
  font-size: 1rem;
  line-height: 1.62;
}

.editorial-section {
  margin: 0 0 26px;
}

.editorial-section-title {
  margin: 0 0 10px;
  padding: 0 0 7px;
  border-bottom: 1px solid var(--color-border-strong);
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 1.05rem;
  font-weight: 650;
  line-height: 1.3;
}

.editorial-section > p {
  margin: 0;
  max-width: 48rem;
  color: var(--color-text);
  font-size: 0.98rem;
  line-height: 1.65;
}

.editorial-section > p + p {
  margin-top: 10px;
}

.editorial-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--color-border-muted);
}

.editorial-steps > li {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
  margin: 0;
  padding: 11px 4px 12px 12px;
  border-bottom: 1px solid var(--color-border-muted);
  border-inline-start: 1px solid var(--color-accent-gold);
}

.editorial-steps h3,
.editorial-pair h3 {
  margin: 0;
  color: var(--color-text-brand);
  font-family: "Noto Serif", "Times New Roman", Georgia, serif;
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.35;
}

.editorial-steps p,
.editorial-pair p {
  margin: 0;
  color: var(--color-text);
  font-size: 0.96rem;
  line-height: 1.62;
}

.editorial-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 28px;
}

.editorial-pair > article {
  min-width: 0;
  padding: 2px 0 4px 12px;
  border-inline-start: 1px solid var(--color-accent-gold);
}

.editorial-pair h3 {
  margin-bottom: 6px;
}

@media (max-width: 640px) {
  .page--editorial {
    padding: 8px 10px 40px;
  }

  .page--editorial .editorial-intro {
    padding: 12px 12px 14px;
  }

  .editorial-pair {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}