/* ============================================================
   Noble Imprint Resources: the redesign (v2), app 2.0 look
   Collective-Shared plans/2026-10-10-sites-family-nav-and-resources-redesign.md §5.
   Loaded ONLY by the v2 templates (partials/v2/header.ejs), after style.css, so
   today's site is untouched. Everything here is scoped to html.nc2.
   Tokens = the canvas "Style sheet" board (values from the app's app_colors.dart).
   ============================================================ */

/* ----- 1. Tokens: light ----- */
html.nc2 {
  /* Color */
  --nc2-gold: #DA9F28;          /* primary actions, the nav marker */
  --nc2-gold-deep: #835F16;     /* links, counts */
  --nc2-gold-wash: #F8ECD3;     /* Pre-Release pill */
  --nc2-on-gold: #1A1712;       /* text on a gold fill. White on #DA9F28 is ~2.3:1, so it isn't used */
  --nc2-navy: #3A5C92;          /* "you are here" */
  --nc2-blue-wash: #EDF1F8;     /* Preview pill, avatar */
  --nc2-page: #FFFFFF;
  --nc2-card: #FFFFFF;
  --nc2-ink: #111111;           /* titles */
  --nc2-text-2: #6B6B6B;        /* secondary text. The board's #7A7A7A is 4.3:1 on white; this is 5.3:1 */
  --nc2-icon: #8A8A8A;          /* idle nav icons (not text) */
  --nc2-hairline: #ECECEC;
  --nc2-bar-line: #E0E0E0;      /* header + bottom bar line */
  --nc2-field: #F2F2F2;         /* search field, segmented track */
  --nc2-focus: #3A5C92;

  /* Type */
  --nc2-font-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --nc2-font-title: 'Lora', Georgia, 'Times New Roman', serif;
  --nc2-fs-page-title: 34px;    /* Lora 600; 23px on phones */
  --nc2-fs-card-title: 18px;    /* Lora 600 */
  --nc2-fs-row-title: 16px;     /* Inter 600 */
  --nc2-fs-secondary: 13px;     /* Inter 400 */
  --nc2-fs-label: 11px;         /* Inter 700, +1px tracking, caps */

  /* Shape */
  --nc2-r-card: 14px;
  --nc2-r-hero: 18px;
  --nc2-r-pill: 999px;
  --nc2-r-field: 12px;
  --nc2-r-cover: 5px;
  --nc2-shadow-card: 0 6px 18px rgba(0, 0, 0, 0.06);

  /* Shell */
  --nc2-header-h: 64px;
  --nc2-header-h-phone: 48px;
  --nc2-content-max: 1160px;

  /* Today's content inside the v2 shell (R1 → R8): its sizes follow the new header, and its
     heading/serif families use the self-hosted fonts (DM Sans / DM Serif aren't loaded here). */
  --header-height: var(--nc2-header-h);
  --font-heading: var(--nc2-font-ui);
  --font-serif: var(--nc2-font-title);

  color-scheme: light;
  background: var(--nc2-page);
}

/* ----- 1b. Tokens: dark (the reader's theme setting puts .nc-dark on <html>) ----- */
html.nc2.nc-dark {
  --nc2-gold: #E1B151;
  --nc2-gold-deep: #E1B151;
  --nc2-gold-wash: #3D3322;
  --nc2-on-gold: #1A1712;
  --nc2-navy: #B6C7E2;
  --nc2-blue-wash: #26303F;
  --nc2-page: #151413;
  --nc2-card: #1F1E1C;
  --nc2-ink: #E8E3D9;
  --nc2-text-2: #B9B3A8;
  --nc2-icon: #9C9891;
  --nc2-hairline: #2E2D2A;
  --nc2-bar-line: #3A3936;
  --nc2-field: #26231F;
  --nc2-focus: #B6C7E2;
  color-scheme: dark;
}

@media (max-width: 620px) {
  html.nc2 { --header-height: var(--nc2-header-h-phone); }
}

/* DM Sans / DM Serif Display are named literally in style.css. On v2 pages they resolve to the
   self-hosted Inter / Lora (latin; other scripts fall back per glyph). Transitional: R9 removes it
   with the old stylesheet. */
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(/static/fonts/inter-var-latin.woff2?v=1) format('woff2'); }
@font-face { font-family: 'DM Serif Display'; font-style: normal; font-weight: 400; font-display: swap; src: url(/static/fonts/lora-var-latin.woff2?v=1) format('woff2'); }

/* ----- 2. Page ----- */
html.nc2 body {
  background: var(--nc2-page);
  color: var(--nc2-ink);
  font-family: var(--nc2-font-ui);
}
html.nc2 :focus-visible { outline: 2px solid var(--nc2-focus); outline-offset: 2px; }

.nc2-skip {
  position: absolute; left: 12px; top: -60px; z-index: 300;
  padding: 10px 16px; border-radius: var(--nc2-r-field);
  background: var(--nc2-ink); color: var(--nc2-page);
  font: 600 14px/1.2 var(--nc2-font-ui);
}
.nc2-skip:focus { top: 8px; }

/* ----- 3. Header (R2: Desktop boards + https://claude.ai/artifact/LrhQ7YVTRzmqXpjUFgwo2J) -----
   ≥1280  logo · Home · Library · Bible · Notebook · [search field] · gear · account | family mark
   1024+  the same with a search icon (the field doesn't fit), which opens a search card
   <1024  logo · search · account | mark, and the bottom bar (section 7); ≤620 48 px, knot left, logo right */
.nc2-header {
  position: sticky; top: 0; z-index: 100;
  height: var(--nc2-header-h);
  box-sizing: border-box;
  display: flex; align-items: center; gap: 16px;
  padding: 0 24px 0 40px;
  background: var(--nc2-page);
  border-bottom: 1px solid var(--nc2-bar-line);
}
.nc2-header__logo { display: flex; align-items: center; flex-shrink: 0; min-height: 44px; }
.nc2-header__logo img { display: block; width: 88px; height: 28px; }
.nc2-header__logo .nc2-logo--dark { display: none; }
html.nc2.nc-dark .nc2-header__logo .nc2-logo--light { display: none; }
html.nc2.nc-dark .nc2-header__logo .nc2-logo--dark { display: block; }
.nc2-header__spacer { flex: 1 1 0; min-width: 0; }
.nc2-header__divider { width: 1px; height: 26px; background: var(--nc2-bar-line); flex-shrink: 0; }
/* The family mark's slot is reserved before the kit mounts (no shift): desktop ≈ 190 × 44. */
.nc2-header__fam { display: flex; align-items: center; justify-content: flex-end; min-width: 190px; height: 44px; flex-shrink: 0; }

.nc2-ico { display: block; flex-shrink: 0; }
.nc2-ico .nc2-ico__fill { fill: none; }

/* Main nav: the app's bar laid flat. Gold 3 px marker on the header line, navy current item. */
.nc2-nav { display: flex; align-items: stretch; align-self: stretch; gap: 2px; margin-left: 12px; }
.nc2-nav__item {
  position: relative;
  display: flex; align-items: center; gap: 8px;
  padding: 0 14px;
  font: 500 14.5px/1 var(--nc2-font-ui);
  color: var(--nc2-text-2);
  text-decoration: none;
  white-space: nowrap;
}
.nc2-nav__item .nc2-ico { color: var(--nc2-icon); }
.nc2-nav__item:hover { color: var(--nc2-ink); }
.nc2-nav__item:hover .nc2-ico { color: var(--nc2-ink); }
.nc2-nav__item[aria-current="page"] { color: var(--nc2-navy); font-weight: 700; }
.nc2-nav__item[aria-current="page"] .nc2-ico { color: var(--nc2-navy); }
.nc2-nav__item[aria-current="page"] .nc2-ico__fill { fill: var(--nc2-blue-wash); }
.nc2-nav__item[aria-current="page"]::after {
  content: ''; position: absolute; left: 50%; bottom: -1px;
  width: 28px; height: 3px; margin-left: -14px;
  border-radius: 2px 2px 0 0; background: var(--nc2-gold);
}
.nc2-nav__item:focus-visible { outline-offset: -4px; border-radius: 10px; }

/* Icon buttons: gear, the search icon (narrow widths), the account button. 44 px targets. */
.nc2-iconbtn, .nc2-acct {
  width: 44px; height: 44px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; border: 0; border-radius: 12px;
  background: transparent; color: var(--nc2-text-2);
  cursor: pointer;
}
.nc2-iconbtn:hover, .nc2-acct:hover { background: var(--nc2-field); color: var(--nc2-ink); }
.nc2-acct { border-radius: 22px; }
.nc2-acct--in:hover { background: transparent; }
.nc2-avatar {
  width: 36px; height: 36px; border-radius: 18px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  object-fit: cover;
  background: var(--nc2-blue-wash); color: var(--nc2-navy);
  font: 600 15px/1 var(--nc2-font-title);
}
.nc2-acct[aria-expanded="true"] .nc2-avatar { box-shadow: 0 0 0 2px var(--nc2-page), 0 0 0 4px var(--nc2-navy); }
.nc2-search-open { display: none; }

/* Search field (≥1280 in the header) */
.nc2-search { position: relative; flex-shrink: 0; margin: 0; }
.nc2-search__bar { display: flex; align-items: center; gap: 8px; }
.nc2-search__field {
  width: 280px; height: 40px; box-sizing: border-box;
  display: flex; align-items: center; gap: 8px;
  padding: 0 12px;
  background: var(--nc2-field); border-radius: var(--nc2-r-field);
  color: var(--nc2-text-2);
  transition: width .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.nc2-search__field:focus-within { background: var(--nc2-page); box-shadow: inset 0 0 0 2px var(--nc2-focus); }
@media (min-width: 1440px) { .nc2-search__field:focus-within { width: 360px; } } /* below that the header row has no room to grow */
.nc2-search__field input {
  flex: 1 1 0; min-width: 0; height: 100%;
  border: 0; outline: 0; padding: 0; margin: 0;
  background: transparent; color: var(--nc2-ink);
  font: 400 14.5px var(--nc2-font-ui);
  -webkit-appearance: none; appearance: none;
}
.nc2-search__field input:focus-visible { outline: none; } /* the field draws the ring */
.nc2-search__field input::placeholder { color: var(--nc2-text-2); opacity: 1; }
.nc2-search__field input::-webkit-search-decoration { -webkit-appearance: none; }
.nc2-search__cancel {
  display: none; height: 44px; padding: 0 8px; border: 0; background: transparent; cursor: pointer;
  font: 600 14.5px/1 var(--nc2-font-ui); color: var(--nc2-navy);
}

@media (max-width: 1279px) {
  .nc2-nav__item { padding: 0 10px; }
  .nc2-search { display: none; }
  .nc2-search-open { display: inline-flex; }
}
@media (max-width: 1023px) {
  .nc2-nav, .nc2-header .nc2-gear { display: none; }
  .nc2-header { gap: 4px; padding: 0 16px 0 24px; }
}
@media (max-width: 620px) {
  /* Phone: knot ▾ on the left, the logo on the right (Mobile web boards). */
  .nc2-header { height: var(--nc2-header-h-phone); gap: 2px; padding: 0 12px 0 6px; }
  .nc2-header__fam { order: -1; min-width: 41px; justify-content: flex-start; }
  .nc2-header__divider { display: none; }
  .nc2-header__logo { order: 3; margin-left: 6px; }
  .nc2-header__logo img { width: 75px; height: 24px; }
  .nc2-avatar { width: 30px; height: 30px; border-radius: 15px; font-size: 13px; }
}

/* ----- 4. Footer: the site's own lines, then the Noble Collective family bar ----- */
.nc2-footer { margin-top: auto; background: var(--nc2-page); }
.nc2-footer__site {
  border-top: 1px solid var(--nc2-hairline);
  padding: 32px 24px 28px;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  text-align: center;
  font: 400 12.5px/1.6 var(--nc2-font-ui);
  color: var(--nc2-text-2);
}
.nc2-footer__site p { margin: 0; }
.nc2-footer__site a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.nc2-footer__site a:hover { color: var(--nc2-ink); }
.nc2-footer__small { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 14px; font-size: 12px; }
.nc2-footer__eleven img { display: inline-block; height: 12px; width: auto; vertical-align: -1px; margin: 0 4px; }
html.nc2.nc-dark .nc2-footer__eleven img { filter: invert(1); }
/* Reserved for the kit's charcoal bar (it sizes itself; this stops a jump while the script loads). */
.nc2-footer__fam { min-height: 82px; background: #525050; }
@media (max-width: 620px) { .nc2-footer__fam { min-height: 180px; } }

/* ----- 5. Search results (js/v2-shell.js): the shared Library search, five rows + "Show all" ----- */
.nc2-search__panel {
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 210;
  width: min(460px, calc(100vw - 32px)); box-sizing: border-box;
  padding: 8px;
  background: var(--nc2-card);
  border: 1px solid var(--nc2-bar-line); border-radius: 16px;
  box-shadow: 0 16px 40px rgba(17, 17, 17, 0.14);
  font-family: var(--nc2-font-ui);
}
.nc2-search__panel[hidden] { display: none; }
.nc2-search__head { margin: 0; padding: 8px 10px 10px; font: 600 12.5px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-search__head:empty { display: none; }
.nc2-search__list { list-style: none; margin: 0; padding: 0; }
.nc2-search__row {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 8px 10px; border-radius: 10px;
  color: var(--nc2-ink); text-decoration: none;
}
.nc2-search__row[aria-selected="true"] { background: var(--nc2-field); }
.nc2-search__row:hover { background: var(--nc2-field); color: var(--nc2-ink); }
.nc2-search__cover {
  width: 34px; height: 52px; flex-shrink: 0; display: block;
  border-radius: 3px; object-fit: cover;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
  background: var(--nc2-hairline);
}
.nc2-search__body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.nc2-search__title { font: 600 14.5px/1.3 var(--nc2-font-ui); }
.nc2-search__path { font: 400 12.5px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-search__chip {
  align-self: flex-start; margin-top: 2px;
  padding: 3px 9px; border-radius: var(--nc2-r-pill);
  background: var(--nc2-gold-wash); color: #6E4F12;
  font: 600 11.5px/1.3 var(--nc2-font-ui);
}
html.nc2.nc-dark .nc2-search__chip { color: var(--nc2-gold); }
.nc2-pill {
  display: inline-block; padding: 1px 7px; border-radius: var(--nc2-r-pill); vertical-align: 1px;
  background: var(--nc2-gold-wash); color: #6E4F12; font: 600 10.5px/1.5 var(--nc2-font-ui);
}
.nc2-pill--preview { background: var(--nc2-blue-wash); color: var(--nc2-navy); }
html.nc2.nc-dark .nc2-pill { color: var(--nc2-gold); }
html.nc2.nc-dark .nc2-pill--preview { color: var(--nc2-navy); }
.nc2-search__empty { margin: 0; padding: 0 10px 8px; font: 400 13px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-search__empty[hidden], .nc2-search__all[hidden] { display: none; }
.nc2-search__all {
  display: flex; align-items: center; justify-content: space-between;
  height: 44px; margin-top: 6px; padding: 0 10px;
  border-top: 1px solid var(--nc2-hairline);
  font: 600 14px/1 var(--nc2-font-ui); color: var(--nc2-gold-deep); text-decoration: none;
}
.nc2-search__all::after { content: '›'; font-size: 20px; line-height: 1; }
.nc2-search__keys { margin: 0; padding: 4px 10px 6px; font: 400 12px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }

/* Opened from the icon (<1280): a search card under the header; full screen on phones. */
.nc2-search.is-open {
  display: flex; flex-direction: column;
  position: fixed; z-index: 400;
  top: 8px; left: 50%; transform: translateX(-50%);
  width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 16px); box-sizing: border-box;
  padding: 8px;
  background: var(--nc2-card);
  border: 1px solid var(--nc2-bar-line); border-radius: 16px;
  box-shadow: 0 16px 40px rgba(17, 17, 17, 0.18);
}
.nc2-search.is-open .nc2-search__field { flex: 1 1 0; width: auto; }
.nc2-search.is-open .nc2-search__cancel { display: inline-block; }
.nc2-search.is-open .nc2-search__panel {
  position: static; width: auto; margin-top: 4px; padding: 0;
  border: 0; box-shadow: none; overflow-y: auto;
}
.nc2-search.is-open .nc2-search__keys { display: none; }
/* The header is its own stacking layer (sticky, z 100): lift it over the scrim while its search is open. */
html.nc2-search-is-open .nc2-header { z-index: 400; }
html.nc2-search-is-open body::after {
  content: ''; position: fixed; inset: 0; z-index: 390; background: rgba(17, 17, 17, 0.38);
}
@media (max-width: 620px) {
  .nc2-search.is-open {
    top: 0; left: 0; right: 0; bottom: 0; transform: none;
    width: auto; max-height: none;
    padding: 8px 8px 0 12px; border: 0; border-radius: 0; box-shadow: none;
  }
  .nc2-search.is-open .nc2-search__field input { font-size: 16px; } /* iOS doesn't zoom at 16 px */
  .nc2-search.is-open .nc2-search__panel { flex: 1 1 auto; padding: 4px 4px 24px 0; }
  .nc2-search.is-open .nc2-search__row { padding: 10px 4px; border-radius: 0; border-bottom: 1px solid var(--nc2-hairline); }
  html.nc2-search-is-open { overflow: hidden; }
}

/* ----- 6. The account menu (reader-userdata-entry.js toggleAccountMenuV2) ----- */
html.nc2 .nc-menu { font-family: var(--nc2-font-ui); }
.nc2-acct-menu.nc-menu {
  width: 300px; box-sizing: border-box; padding: 8px;
  background: var(--nc2-card); color: var(--nc2-ink);
  border: 1px solid var(--nc2-bar-line); border-radius: 16px;
  box-shadow: 0 16px 40px rgba(17, 17, 17, 0.14);
  max-height: calc(100vh - 80px); overflow-y: auto;
}
.nc2-acct-menu:focus { outline: none; }
.nc2-acct-menu .nc-acct__head { gap: 12px; margin: 0; padding: 10px 10px 12px; border-bottom: 1px solid var(--nc2-hairline); }
.nc2-acct-menu .nc-acct__head .nc2-avatar { width: 40px; height: 40px; border-radius: 20px; font-size: 17px; }
.nc2-acct-menu .nc-acct__name { font: 600 15px/1.25 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-acct-menu .nc-acct__email { font: 400 12.5px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-acct-menu .nc-acct__link {
  display: flex; align-items: center; gap: 12px;
  min-height: 44px; padding: 0 10px; margin: 0;
  border-radius: 10px;
  font: 500 14px/1.2 var(--nc2-font-ui); color: var(--nc2-ink); text-decoration: none;
}
.nc2-acct-menu > .nc-acct__link:first-of-type { margin-top: 6px; }
.nc2-acct-menu .nc-acct__link:hover { background: var(--nc2-field); }
.nc2-acct-menu .nc-acct__ico { color: var(--nc2-text-2); }
.nc2-acct-menu .nc-acct__ico svg { width: 20px; height: 20px; }
.nc2-acct-menu__label { padding: 12px 10px 4px; font: 700 11px/1 var(--nc2-font-ui); letter-spacing: 1px; text-transform: uppercase; color: var(--nc2-text-2); }
.nc2-acct-menu__note { margin: 0; padding: 2px 10px 8px 42px; font: 400 12px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-acct-menu .nc-acct__accounts { margin: 4px 0 0; padding: 4px 10px 0; border-top: 1px solid var(--nc2-hairline); }
.nc2-acct-menu .nc-acct__data { margin: 4px 0 0; padding: 4px 0 0; border-top: 1px solid var(--nc2-hairline); }
.nc2-acct-menu .nc-acct__data-sum {
  display: flex; align-items: center; min-height: 44px; padding: 0 10px; border-radius: 10px;
  opacity: 1; font: 500 14px/1.2 var(--nc2-font-ui); color: var(--nc2-ink);
}
.nc2-acct-menu .nc-acct__data-sum::after { content: '▾'; margin-left: auto; color: var(--nc2-text-2); font-size: 12px; }
.nc2-acct-menu .nc-acct__data[open] .nc-acct__data-sum::after { content: '▴'; }
.nc2-acct-menu .nc-acct__data-sum:hover { background: var(--nc2-field); }
.nc2-acct-menu .nc-acct__link--danger { color: #B3261E; }
html.nc2.nc-dark .nc2-acct-menu .nc-acct__link--danger { color: #F2B8B5; }
.nc2-acct-menu__signout.nc-btn {
  display: block; width: calc(100% - 8px); height: 42px; margin: 8px 4px 4px;
  border: 1px solid var(--nc2-bar-line); border-radius: var(--nc2-r-pill);
  background: var(--nc2-card); color: var(--nc2-ink);
  font: 600 14px/1 var(--nc2-font-ui); cursor: pointer;
}
.nc2-acct-menu__signout.nc-btn:hover { background: var(--nc2-field); }
/* Below 1024 px: a bottom sheet over a scrim (Phone · header + account sheet board). */
.nc2-acct-menu--sheet.nc-menu {
  left: 0 !important; right: 0; top: auto !important; bottom: 0;
  width: auto; max-height: 85vh;
  padding: 8px 12px calc(24px + env(safe-area-inset-bottom, 0px));
  border-radius: 22px 22px 0 0; border-bottom: 0;
  box-shadow: 0 -8px 30px rgba(17, 17, 17, 0.18);
}
.nc2-acct-menu__grabber { width: 36px; height: 4px; margin: 2px auto 6px; border-radius: 2px; background: var(--nc2-bar-line); }
.nc2-scrim { position: fixed; inset: 0; z-index: 8999; background: rgba(17, 17, 17, 0.38); }

/* ----- 7. The bottom bar (<1024 px; Mobile web boards): Home · Library · Bible · Notebook · Settings ----- */
.nc2-tabbar { display: none; }
@media (max-width: 1023px) {
  html.nc2 { --nc2-tabbar-h: 65px; } /* 4 + 56 + 4 + the 1 px line */
  html.nc2 body { padding-bottom: calc(var(--nc2-tabbar-h) + env(safe-area-inset-bottom, 0px)); }
  .nc2-tabbar {
    display: flex;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
    padding: 4px 4px calc(4px + env(safe-area-inset-bottom, 0px));
    background: var(--nc2-page);
    border-top: 1px solid var(--nc2-bar-line);
    transition: transform .25s ease;
  }
  .nc2-tabbar.is-hidden { transform: translateY(calc(100% + 2px)); }
  .nc2-tabbar__item {
    position: relative; flex: 1 1 0; min-width: 0; height: 56px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    padding: 0; border: 0; background: transparent; cursor: pointer;
    color: var(--nc2-icon); text-decoration: none;
  }
  .nc2-tabbar__label { font: 500 11px/1 var(--nc2-font-ui); color: var(--nc2-text-2); }
  .nc2-tabbar__item[aria-current="page"] { color: var(--nc2-navy); }
  .nc2-tabbar__item[aria-current="page"] .nc2-ico__fill { fill: var(--nc2-blue-wash); }
  .nc2-tabbar__item[aria-current="page"] .nc2-tabbar__label { color: var(--nc2-navy); font-weight: 700; }
  .nc2-tabbar__item[aria-current="page"]::before {
    content: ''; position: absolute; top: -5px; left: 50%;
    width: 24px; height: 3px; margin-left: -12px;
    border-radius: 0 0 2px 2px; background: var(--nc2-gold);
  }
  .nc2-tabbar__item:focus-visible { outline-offset: -4px; border-radius: 12px; }
  /* The audio player owns the bottom edge; the headphone button sits above the bar. */
  html.nc2 .audio-fab { bottom: calc(var(--nc2-tabbar-h) + 14px + env(safe-area-inset-bottom, 0px)); transition: bottom .25s ease, transform .2s, background .2s; }
  html.nc2.nc2-tabbar-hidden .audio-fab { bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
}
@media (prefers-reduced-motion: reduce) { .nc2-tabbar, .nc2-rbar { transition: none !important; } }

/* ----- 8. Home dashboard (R3; main canvas Desktop "Home · signed in" (Main) / "Home · signed out" + Mobile web Home) -----
   ≥1024  [Continue · Also reading | Partner · Resource of the day · Notebook] (signed in)
          [Resource of the day | Partner · Sign in] (signed out), then Explore the library, The Bible (the library itself: /library, R4)
   <1024  one column in the Mobile web boards' order */
html.nc2 .main.nc2-home {
  flex: 1 1 auto; width: 100%; max-width: var(--nc2-content-max); box-sizing: border-box;
  margin: 0 auto; padding: 40px 32px 72px;
  display: flex; flex-direction: column; gap: 28px;
  font-family: var(--nc2-font-ui); color: var(--nc2-ink);
}
.nc2-home p { margin: 0; }
.nc2-dash { display: flex; flex-direction: column; gap: 28px; }
.nc2-home__intro { display: flex; flex-direction: column; gap: 8px; }
.nc2-home__title { margin: 0; font: 600 var(--nc2-fs-page-title)/1.2 var(--nc2-font-title); color: var(--nc2-ink); letter-spacing: 0; }
.nc2-home__title--hero { font-size: 40px; line-height: 1.15; }
.nc2-home__sub { font: 400 16px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }

.nc2-dash__grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; align-items: start; }
.nc2-dash__main, .nc2-dash__side { display: flex; flex-direction: column; gap: 24px; min-width: 0; }

.nc2-label {
  margin: 0; font: 700 var(--nc2-fs-label)/1 var(--nc2-font-ui); letter-spacing: 1px; text-transform: uppercase;
  color: var(--nc2-text-2);
}
.nc2-card {
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card);
  padding: 18px; display: flex; flex-direction: column; gap: 14px; min-width: 0;
}
.nc2-card--hero { border-radius: var(--nc2-r-hero); padding: 28px; gap: 18px; box-shadow: var(--nc2-shadow-card); }
.nc2-card__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.nc2-card__date { font: 400 12px/1 var(--nc2-font-ui); color: var(--nc2-text-2); white-space: nowrap; }

/* Buttons: 44 px pills. Gold = the primary action, dark ink on gold (8:1; white on #DA9F28 is ~2.3:1). */
.nc2-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 44px; padding: 0 22px; box-sizing: border-box;
  border-radius: var(--nc2-r-pill); border: 1px solid transparent;
  font: 600 14px/1.2 var(--nc2-font-ui); text-decoration: none; white-space: nowrap; cursor: pointer;
}
.nc2-btn--gold { background: var(--nc2-gold); color: var(--nc2-on-gold); }
.nc2-btn--gold:hover { background: #C88F1E; color: var(--nc2-on-gold); }
html.nc2.nc-dark .nc2-btn--gold:hover { background: #EBC06A; }
.nc2-btn--ghost { background: var(--nc2-card); border-color: var(--nc2-hairline); color: var(--nc2-ink); }
.nc2-btn--ghost:hover { background: var(--nc2-field); color: var(--nc2-ink); }
.nc2-btn--ghost .nc2-ico { color: var(--nc2-text-2); }
.nc2-btn--dark { background: var(--nc2-ink); color: var(--nc2-page); }
.nc2-btn--dark:hover { color: var(--nc2-page); opacity: .88; }
.nc2-btn--wide { padding: 0 30px; }
.nc2-btn--block { width: 100%; }
.nc2-acts { display: flex; flex-wrap: wrap; gap: 10px; }
.nc2-acts--split > .nc2-btn { flex: 1 1 0; min-width: 0; padding: 0 12px; }

.nc2-cover {
  display: block; flex-shrink: 0; object-fit: cover; background: var(--nc2-hairline);
  border-radius: var(--nc2-r-cover); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.nc2-cover--hero { width: 140px; height: 210px; border-radius: 6px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.16); }
.nc2-cover--lg { width: 120px; height: 180px; border-radius: 6px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.16); }
.nc2-cover--sm { width: 64px; height: 96px; }
.nc2-cover--xs { width: 40px; height: 60px; border-radius: 4px; box-shadow: none; }
.nc2-cover--tile { display: flex; align-items: center; justify-content: center; background: var(--nc2-navy); color: #fff; box-shadow: none; }
html.nc2.nc-dark .nc2-cover--tile { color: #151413; }

/* Cover | text, then the buttons: beside the text on desktop, under both on phones (no duplicate links). */
.nc2-media { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 24px; align-items: start; }
.nc2-media > .nc2-cover { grid-row: 1 / span 3; }
.nc2-media > :not(.nc2-cover) { grid-column: 2; }
.nc2-media__text { min-width: 0; display: flex; flex-direction: column; gap: 6px; padding-top: 4px; }
.nc2-media > .nc2-acts { margin-top: 18px; }
.nc2-media--side { column-gap: 14px; }
.nc2-media--side > .nc2-cover { grid-row: 1; }
.nc2-media--side .nc2-media__text { gap: 4px; padding-top: 0; }
.nc2-media--side > .nc2-acts { grid-column: 1 / -1; margin-top: 14px; }

/* Continue reading (filled by reader-userdata/home-v2.js) */
.nc2-continue__title { font: 600 24px/1.25 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-continue__book { font: 400 15px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-progress { height: 6px; max-width: 420px; margin-top: 14px; border-radius: 3px; background: var(--nc2-hairline); overflow: hidden; }
.nc2-progress > i { display: block; height: 100%; background: var(--nc2-gold); }
.nc2-continue__where { display: flex; align-items: center; gap: 6px; margin-top: 6px !important; font: 400 12.5px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-continue__where::before { content: ''; width: 6px; height: 6px; border-radius: 3px; background: #89A4D0; flex-shrink: 0; }
.nc2-continue__empty { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.nc2-continue__empty-title { font: 600 18px/1.3 var(--nc2-font-ui); }
.nc2-continue__empty-text { font: 400 14px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); max-width: 46ch; }
.nc2-skel .nc2-cover { box-shadow: none; }
.nc2-skel { display: flex; gap: 24px; }
.nc2-skel__lines { flex: 1 1 auto; display: flex; flex-direction: column; gap: 12px; padding-top: 6px; }
.nc2-skel__lines i { display: block; height: 14px; border-radius: 7px; background: var(--nc2-field); }
.nc2-skel__lines i:nth-child(1) { width: 40%; height: 22px; }
.nc2-skel__lines i:nth-child(2) { width: 55%; }
.nc2-skel__lines i:nth-child(3) { width: 70%; margin-top: 18px; }

/* Also reading */
.nc2-also { display: flex; flex-direction: column; gap: 12px; }
.nc2-also[hidden] { display: none; }
.nc2-also__list { list-style: none; margin: 0; padding: 4px 18px; border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card); background: var(--nc2-card); }
.nc2-also__row { display: flex; align-items: center; gap: 10px; padding: 12px 0; }
.nc2-also__row + .nc2-also__row { border-top: 1px solid var(--nc2-hairline); }
.nc2-also__main { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 14px; color: var(--nc2-ink); text-decoration: none; min-height: 44px; }
.nc2-also__main:hover .nc2-also__title { text-decoration: underline; text-underline-offset: 2px; }
.nc2-also__text { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.nc2-also__title { font: 600 15px/1.3 var(--nc2-font-ui); }
.nc2-also__line { font: 400 13px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-also__open { min-height: 36px; padding: 0 16px; font-size: 13px; }
.nc2-roundbtn {
  position: relative; width: 44px; height: 44px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 22px; color: var(--nc2-text-2); text-decoration: none;
}
.nc2-roundbtn::before { content: ''; position: absolute; width: 36px; height: 36px; border-radius: 18px; border: 1px solid var(--nc2-hairline); box-sizing: border-box; }
.nc2-roundbtn:hover { color: var(--nc2-ink); }
.nc2-roundbtn:hover::before { background: var(--nc2-field); }
.nc2-roundbtn .nc2-ico { position: relative; }

/* Partner with us (siteConfig/home) */
.nc2-partner {
  display: flex; align-items: center; flex-wrap: wrap; gap: 14px; padding: 18px;
  border: 1px solid var(--nc2-gold-wash); border-radius: 16px;
  background: linear-gradient(135deg, #FBF5E9 0%, var(--nc2-card) 70%);
}
html.nc2.nc-dark .nc2-partner { background: linear-gradient(135deg, #2A251C 0%, var(--nc2-card) 70%); }
.nc2-partner__icon { width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--nc2-gold); color: var(--nc2-on-gold); }
.nc2-partner__text { flex: 1 1 160px; min-width: 0; }
.nc2-partner__title { margin: 0; font: 600 17px/1.25 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-home .nc2-partner__body { margin-top: 3px; font: 400 13px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-partner .nc2-btn { padding: 0 18px; }

/* Resource of the day */
.nc2-rotd__title { font: 600 15.5px/1.3 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-rotd--hero .nc2-rotd__title { font-size: 26px; line-height: 1.25; }
.nc2-rotd__book { font: 400 13px/1.35 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-rotd--hero .nc2-rotd__book { font-size: 15px; line-height: 1.4; }
.nc2-rotd__sub { font: italic 400 12.5px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-rotd--hero .nc2-rotd__sub { font-size: 14px; }
.nc2-rotd--hero .nc2-media > .nc2-acts { margin-top: 22px; }
.nc2-home .nc2-rotd__note { margin-top: 10px; font: 400 12.5px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }

/* From your notebook */
.nc2-notebook { display: flex; flex-direction: column; gap: 10px; }
.nc2-notebook[hidden] { display: none; }
.nc2-notebook__card { display: flex; flex-direction: column; gap: 10px; color: var(--nc2-ink); text-decoration: none; }
.nc2-notebook__card:hover { border-color: var(--nc2-bar-line); color: var(--nc2-ink); }
.nc2-notebook__ref { font: 600 13px/1.2 var(--nc2-font-ui); letter-spacing: .2px; color: var(--nc2-gold-deep); }
.nc2-quote { margin: 0; padding: 6px 10px; border-left: 3px solid #E2B84A; background: #FBF3DA; font: 400 15.5px/1.55 var(--nc2-font-title); color: #111111; }
html.nc2.nc-dark .nc2-quote { background: #3A321F; color: var(--nc2-ink); }
.nc2-notebook__body { font: 400 14px/1.5 var(--nc2-font-ui); }
.nc2-notebook__meta { font: 400 12px/1.2 var(--nc2-font-ui); color: var(--nc2-text-2); }

/* Sign-in card (signed out): the shared kit's compact panel replaces the no-JS link */
.nc2-signin { gap: 10px; padding: 20px; }
.nc2-signin__title { margin: 0; font: 600 16px/1.3 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-signin__text { font: 400 13.5px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-signin > .nc2-btn { margin-top: 6px; }
/* Once mounted, the kit's panel IS the card (its Google + Apple buttons, the shared fine print): the
   section drops its own chrome and the panel takes the board's sizes. */
html.nc2 .nc2-signin--kit { padding: 0; border: 0; background: transparent; box-shadow: none; }
html.nc2 .nc2-signin--kit .ncsi {
  max-width: none; padding: 20px; box-sizing: border-box;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card); box-shadow: none;
}
html.nc2 .nc2-signin--kit .ncsi .ncsi-title { margin: 0 0 8px; font: 600 16px/1.3 var(--nc2-font-ui); letter-spacing: 0; color: var(--nc2-ink); }
html.nc2 .nc2-signin--kit .ncsi .ncsi-benefit { margin: 0 0 14px; font-size: 13.5px; line-height: 1.45; color: var(--nc2-text-2); }
html.nc2 .nc2-signin--kit .ncsi-btn { min-height: 44px; padding: 0 44px; border-radius: var(--nc2-r-pill); font: 600 14px/1.2 var(--nc2-font-ui); }
html.nc2 .nc2-signin--kit .ncsi .ncsi-fine { margin-top: 14px; padding-top: 12px; font-size: 12px; color: var(--nc2-text-2); }

/* Explore the library */
.nc2-explore { display: flex; flex-direction: column; gap: 14px; margin-top: 8px; }
.nc2-sechead { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.nc2-more { display: inline-flex; align-items: center; gap: 3px; min-height: 44px; margin: -14px 0; font: 600 13px/1 var(--nc2-font-ui); color: var(--nc2-gold-deep); text-decoration: none; }
.nc2-more:hover { color: var(--nc2-ink); text-decoration: underline; }
.nc2-series-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.nc2-series {
  display: flex; gap: 14px; padding: 14px 14px 12px; min-width: 0;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.05); color: var(--nc2-ink); text-decoration: none;
}
.nc2-series:hover { border-color: var(--nc2-bar-line); color: var(--nc2-ink); }
.nc2-series__stack { position: relative; width: 96px; height: 96px; flex-shrink: 0; }
.nc2-series__stack img { position: absolute; object-fit: cover; display: block; background: var(--nc2-hairline); }
.nc2-series__stack img:nth-child(1) { left: 22px; top: 6px; width: 54px; height: 84px; border-radius: 5px; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.22); z-index: 2; }
.nc2-series__stack img:nth-child(2) { left: 4px; top: 12px; width: 48px; height: 74px; border-radius: 4px; transform: rotate(-7deg); z-index: 1; }
.nc2-series__stack img:nth-child(3) { left: 44px; top: 12px; width: 48px; height: 74px; border-radius: 4px; transform: rotate(7deg); z-index: 1; }
.nc2-series__text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 5px; padding-top: 2px; }
.nc2-series__title { font: 600 var(--nc2-fs-card-title)/1.25 var(--nc2-font-title); }
.nc2-series__sub { font: 400 13px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-series__count { margin-top: 2px; font: 600 12px/1.2 var(--nc2-font-ui); color: var(--nc2-gold-deep); }
.nc2-browse { display: none; }

/* The Bible (signed out) */
.nc2-bibles { display: flex; flex-direction: column; gap: 12px; }
.nc2-bible-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.nc2-bible { display: flex; align-items: center; gap: 14px; padding: 14px; border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card); background: var(--nc2-card); color: var(--nc2-ink); text-decoration: none; }
.nc2-bible:hover { border-color: var(--nc2-bar-line); color: var(--nc2-ink); }
.nc2-bible__cover { width: 44px; height: 66px; flex-shrink: 0; border-radius: 4px; object-fit: cover; display: block; }
.nc2-bible__cover--tile { display: flex; align-items: center; justify-content: center; background: var(--nc2-navy); color: #fff; }
.nc2-bible__text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.nc2-bible__title { font: 600 15px/1.3 var(--nc2-font-ui); }
.nc2-bible__audio { display: inline-flex; align-items: center; gap: 4px; font: 500 12px/1 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bible__chev { color: var(--nc2-icon); }

@media (max-width: 1023px) {
  html.nc2 .main.nc2-home { padding: 24px 24px 40px; gap: 22px; }
  .nc2-dash { gap: 18px; }
  /* One column in the Mobile web boards' order (signed in: Continue, Partner, Also reading, Resource of the
     day, Notebook). The two columns dissolve; each card is a direct item of the column. */
  .nc2-dash__grid { display: flex; flex-direction: column; align-items: stretch; gap: 14px; }
  .nc2-dash__main, .nc2-dash__side { display: contents; }
  .nc2-continue, .nc2-rotd.nc2-rotd--hero { order: 1; }
  .nc2-partner { order: 2; }
  .nc2-also { order: 3; }
  .nc2-rotd { order: 4; }
  .nc2-notebook { order: 5; }
  .nc2-signin { order: 6; }
}
@media (max-width: 620px) {
  html.nc2 .main.nc2-home { padding: 8px 16px 32px; }
  .nc2-home__title, .nc2-home__title--hero { font-size: 23px; line-height: 1.25; }
  .nc2-home__intro { gap: 4px; }
  .nc2-home__sub { font-size: 13px; line-height: 1.4; }
  .nc2-card { padding: 14px; gap: 12px; }
  .nc2-card--hero { padding: 16px; gap: 10px; }
  .nc2-media { column-gap: 12px; grid-template-rows: auto; }
  .nc2-media > .nc2-cover { grid-row: 1; }
  .nc2-media > .nc2-acts { grid-column: 1 / -1; margin-top: 12px; }
  .nc2-media > .nc2-rotd__note { display: none; }
  .nc2-media__text { gap: 3px; padding-top: 0; }
  .nc2-skel { gap: 12px; }
  .nc2-cover--lg, .nc2-cover--hero { width: 64px; height: 90px; border-radius: 5px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); }
  .nc2-cover--sm { width: 46px; height: 64px; }
  .nc2-continue__title, .nc2-rotd--hero .nc2-rotd__title { font-size: 16px; }
  .nc2-continue__book, .nc2-rotd--hero .nc2-rotd__book { font-size: 13px; }
  .nc2-rotd--hero .nc2-rotd__sub { font-size: 12px; }
  .nc2-progress { height: 5px; margin-top: 6px; }
  .nc2-continue__where { font-size: 11.5px; }
  /* Phone: the buttons sit under the cover + text, side by side (Mobile web boards). */
  .nc2-acts > .nc2-btn { flex: 1 1 0; min-width: 0; padding: 0 12px; font-size: 13.5px; }
  .nc2-also__list { padding: 0; border: 0; background: transparent; border-radius: 0; }
  .nc2-also__row { padding: 6px 0; }
  .nc2-also__title { font-size: 14px; }
  .nc2-also__line { font-size: 12px; }
  .nc2-cover--xs { width: 36px; height: 50px; }
  .nc2-also .nc2-roundbtn { display: none; }
  .nc2-partner { padding: 14px; gap: 12px; flex-wrap: nowrap; }
  .nc2-partner__title { font-size: 16px; }
  .nc2-partner .nc2-btn { padding: 0 14px; }
  .nc2-series-grid, .nc2-bible-grid { grid-template-columns: minmax(0, 1fr); }
  .nc2-series__sub { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .nc2-explore--in .nc2-series-grid, .nc2-explore--in .nc2-sechead { display: none; }
  .nc2-explore--in { margin-top: 0; }
  .nc2-browse {
    display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px;
    border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card);
    font: 600 14px/1 var(--nc2-font-ui); color: var(--nc2-gold-deep); text-decoration: none;
  }
}

/* ----- 9. Library, series + collection pages, book page (R4; boards "Library · Books" / "Library · Series" /
   "Series page", the Mobile web Library + Series boards, book page https://claude.ai/artifact/4fcMiuT2n2G5jBmxEXLg8G) ----- */
html.nc2 .main.nc2-page {
  flex: 1 1 auto; width: 100%; max-width: var(--nc2-content-max); box-sizing: border-box;
  margin: 0 auto; padding: 40px 32px 72px;
  display: flex; flex-direction: column; gap: 20px;
  font-family: var(--nc2-font-ui); color: var(--nc2-ink);
}
.nc2-page p { margin: 0; }
.nc2-page__title { margin: 0; font: 600 var(--nc2-fs-page-title)/1.2 var(--nc2-font-title); color: var(--nc2-ink); letter-spacing: 0; }
.nc2-page__title--lg { font-size: 38px; line-height: 1.15; }
html.nc2 .main.nc2-seriespage, html.nc2 .main.nc2-bookpage { padding-top: 24px; gap: 8px; }

/* Back link (‹ Library / ‹ series): navy, 44 px tall. The board's #6F8CBF is 3.4:1 on white, so navy (7:1). */
.nc2-back {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 2px; min-height: 44px; margin-left: -6px; padding-right: 8px;
  font: 600 15px/1.2 var(--nc2-font-ui); color: var(--nc2-navy); text-decoration: none;
}
.nc2-back:hover { color: var(--nc2-navy); text-decoration: underline; text-underline-offset: 3px; }

/* Toolbar: search · Books | Series */
.nc2-libbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
html.nc2 .nc2-libsearch2 { flex: 1 1 320px; max-width: 460px; margin: 0; }
.nc2-field {
  height: 44px; box-sizing: border-box; display: flex; align-items: center; gap: 8px; padding: 0 6px 0 12px;
  background: var(--nc2-field); border-radius: var(--nc2-r-field); color: var(--nc2-text-2);
}
.nc2-field:focus-within { background: var(--nc2-page); box-shadow: inset 0 0 0 2px var(--nc2-focus); }
.nc2-field input {
  flex: 1 1 0; min-width: 0; height: 100%; border: 0; outline: 0; padding: 0; margin: 0;
  background: transparent; color: var(--nc2-ink); font: 400 15px var(--nc2-font-ui);
  -webkit-appearance: none; appearance: none;
}
.nc2-field input:focus-visible { outline: none; }
.nc2-field input::placeholder { color: var(--nc2-text-2); opacity: 1; }
.nc2-field input::-webkit-search-decoration, .nc2-field input::-webkit-search-cancel-button { -webkit-appearance: none; }
.nc2-field__clear { height: 36px; padding: 0 10px; border: 0; border-radius: 9px; background: transparent; cursor: pointer; font: 600 13px/1 var(--nc2-font-ui); color: var(--nc2-navy); }
.nc2-field__clear[hidden] { display: none; }
.nc2-seg { height: 44px; box-sizing: border-box; display: inline-flex; gap: 2px; padding: 4px; background: var(--nc2-field); border-radius: var(--nc2-r-field); flex-shrink: 0; }
.nc2-seg__item {
  display: inline-flex; align-items: center; height: 36px; padding: 0 16px; border-radius: 9px;
  font: 500 13px/1 var(--nc2-font-ui); color: var(--nc2-text-2); text-decoration: none;
}
.nc2-seg__item:hover { color: var(--nc2-ink); }
.nc2-seg__item[aria-current="page"] { background: var(--nc2-card); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); font-weight: 600; color: var(--nc2-ink); }
.nc2-seg__item:focus-visible { outline-offset: 0; }

/* Count + Sort */
.nc2-libmeta { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; }
.nc2-libmeta__count { font: 500 12.5px/1 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-sort { position: relative; }
.nc2-sort__btn {
  display: inline-flex; align-items: center; gap: 5px; height: 44px; padding: 0 8px; border: 0; border-radius: 10px;
  background: transparent; cursor: pointer; font: 500 13px/1 var(--nc2-font-ui); color: var(--nc2-text-2);
}
.nc2-sort__btn:hover { background: var(--nc2-field); }
.nc2-sort__now { font-weight: 600; color: var(--nc2-ink); }
.nc2-sort__menu {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 50; min-width: 180px; margin: 0; padding: 6px; list-style: none;
  background: var(--nc2-card); border: 1px solid var(--nc2-bar-line); border-radius: 14px; box-shadow: 0 12px 30px rgba(17, 17, 17, 0.14);
}
.nc2-sort__menu[hidden] { display: none; }
.nc2-sort__opt {
  display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 0 12px; border-radius: 9px;
  font: 500 14px/1 var(--nc2-font-ui); color: var(--nc2-ink); text-decoration: none;
}
.nc2-sort__opt:hover, .nc2-sort__opt:focus-visible { background: var(--nc2-field); color: var(--nc2-ink); }
.nc2-sort__opt[aria-current="true"] { font-weight: 700; color: var(--nc2-navy); }
.nc2-sort__opt[aria-current="true"]::after { content: '✓'; }

/* Which view / sort shows (js/library-v2.js flips data-view / data-sort on <main>) */
.nc2-library[data-view="books"] [data-nc2-pane="series"],
.nc2-library[data-view="series"] [data-nc2-pane="books"],
.nc2-library[data-sort="az"] [data-nc2-sorted="series"],
.nc2-library[data-sort="series"] [data-nc2-sorted="az"],
.nc2-library.is-lib-searching .nc2-libpane { display: none; }
html.nc2 .nc2-libresults { max-width: 760px; margin: 0; }
html.nc2 .nc2-libresults .nc-libresults__title { color: var(--nc2-ink); font-family: var(--nc2-font-ui); }
html.nc2 .nc2-libresults .nc-libresults__path, html.nc2 .nc2-libresults .nc-libresults__empty { color: var(--nc2-text-2); font-family: var(--nc2-font-ui); }

/* Book rows: two columns on desktop, one on phones (catalog_book_row.dart) */
.nc2-rows {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(440px, 1fr)); column-gap: 40px;
  border-top: 1px solid var(--nc2-hairline);
}
.nc2-rowgroups .nc2-rows { border-top: 0; }
.nc2-row { display: flex; align-items: stretch; gap: 16px; min-width: 0; color: var(--nc2-ink); text-decoration: none; }
.nc2-row:hover { color: var(--nc2-ink); }
.nc2-row:hover .nc2-row__title { text-decoration: underline; text-underline-offset: 2px; }
.nc2-row:focus-visible { outline-offset: -2px; border-radius: 6px; }
.nc2-row__cover {
  width: 64px; height: 96px; margin: 12px 0; flex-shrink: 0; display: block; object-fit: cover;
  border-radius: var(--nc2-r-cover); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); background: var(--nc2-hairline);
}
.nc2-row__cover--none { display: flex; align-items: center; justify-content: center; background: var(--nc2-navy); color: #fff; box-shadow: none; }
html.nc2.nc-dark .nc2-row__cover--none { color: #151413; }
.nc2-row__body { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 8px; padding-right: 4px; border-bottom: 1px solid var(--nc2-hairline); }
.nc2-row__text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 4px; padding: 8px 0; }
.nc2-row__title { font: 600 var(--nc2-fs-row-title)/1.25 var(--nc2-font-ui); }
.nc2-row__sub { font: 400 var(--nc2-fs-secondary)/1.35 var(--nc2-font-ui); color: var(--nc2-text-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nc2-row__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin-top: 3px; font: 500 12px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-row__meta .nc2-pill { padding: 3px 8px; font-size: 10.5px; line-height: 1.2; }
.nc2-row__audio { display: inline-flex; align-items: center; gap: 4px; }
.nc2-row__chev { color: var(--nc2-icon); display: flex; }
.nc2-rowgroup { margin: 18px 0 0; padding-bottom: 4px; font: 700 var(--nc2-fs-label)/1.3 var(--nc2-font-ui); letter-spacing: 1px; color: var(--nc2-text-2); border-bottom: 1px solid var(--nc2-hairline); }
.nc2-rowgroup:first-child { margin-top: 4px; }
.nc2-rowgroup__sub { font-weight: 600; }

/* Series view: larger cards (board "Library · Series") */
.nc2-series-grid--lg { grid-template-columns: repeat(auto-fill, minmax(440px, 1fr)); margin-top: 4px; }
.nc2-series--lg { gap: 18px; padding: 18px 18px 16px; }
.nc2-series--lg .nc2-series__stack { width: 120px; height: 120px; }
.nc2-series--lg .nc2-series__stack img:nth-child(1) { left: 27px; top: 6px; width: 68px; height: 105px; }
.nc2-series--lg .nc2-series__stack img:nth-child(2) { left: 5px; top: 15px; width: 60px; height: 92px; }
.nc2-series--lg .nc2-series__stack img:nth-child(3) { left: 55px; top: 15px; width: 60px; height: 92px; }
.nc2-series--lg .nc2-series__title { font-size: 20px; }
.nc2-series--lg .nc2-series__sub { font-size: 14px; line-height: 1.45; }
.nc2-series__chev { display: none; }
.nc2-series--lg .nc2-series__chev { display: flex; align-self: center; color: var(--nc2-icon); }

/* Series + collection page head: label, title, subtitle, count | collection chips */
.nc2-pagehead { display: flex; gap: 32px; align-items: flex-end; flex-wrap: wrap; padding: 8px 0 28px; border-bottom: 1px solid var(--nc2-hairline); }
.nc2-pagehead__text { flex: 1 1 480px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.nc2-pagehead__sub { max-width: 620px; font: 400 16px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-pagehead__count { margin-top: 4px !important; font: 600 13px/1.2 var(--nc2-font-ui); color: var(--nc2-gold-deep); }
.nc2-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.nc2-chip {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: var(--nc2-r-pill);
  background: var(--nc2-field); font: 600 13px/1 var(--nc2-font-ui); color: var(--nc2-ink); text-decoration: none;
}
.nc2-chip:hover { background: var(--nc2-hairline); color: var(--nc2-ink); }
.nc2-rows--page { border-top: 0; }
.nc2-group { display: flex; flex-direction: column; padding-top: 28px; scroll-margin-top: calc(var(--nc2-header-h) + 12px); }
.nc2-group__head { display: flex; align-items: baseline; gap: 6px 12px; flex-wrap: wrap; padding-bottom: 6px; }
.nc2-group__title { margin: 0; font: 600 22px/1.25 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-group__sub { font: 400 14px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-group__count { font: 600 12px/1.2 var(--nc2-font-ui); color: var(--nc2-gold-deep); }
.nc2-groupcards { display: none; }

/* Book page */
.nc2-bookhero { display: flex; gap: 40px; align-items: flex-start; flex-wrap: wrap; padding: 12px 0 32px; border-bottom: 1px solid var(--nc2-hairline); }
.nc2-bookhero__cover {
  width: 168px; height: 252px; flex-shrink: 0; display: block; object-fit: cover;
  border-radius: 8px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18); background: var(--nc2-hairline);
}
.nc2-bookhero__cover--none { display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; text-align: center; background: var(--nc2-navy); color: #fff; font: 600 18px/1.3 var(--nc2-font-title); }
html.nc2.nc-dark .nc2-bookhero__cover--none { color: #151413; }
.nc2-bookhero__text { flex: 1 1 480px; min-width: 0; display: flex; flex-direction: column; gap: 10px; padding-top: 6px; }
.nc2-bookhero__sub { font: 400 17px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bookhero__author { font: 400 14px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bookhero__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin-top: 2px !important; font: 500 13px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bookhero__meta .nc2-pill { padding: 4px 9px; font-size: 11px; line-height: 1.2; }
.nc2-bookhero__audio { display: inline-flex; align-items: center; gap: 5px; }
.nc2-bookact { margin-top: 14px; max-width: 620px; }
.nc2-bookact.is-pending { visibility: hidden; min-height: 82px; }
.nc2-bookcont { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 16px; padding: 16px 18px; box-shadow: var(--nc2-shadow-card); }
.nc2-bookcont__text { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.nc2-bookcont__label { color: var(--nc2-navy); }
.nc2-bookcont__title { font: 600 17px/1.3 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-bookcont__where { font: 400 13px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-contents { max-width: 760px; width: 100%; display: flex; flex-direction: column; padding-top: 28px; }
.nc2-contents__head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; padding-bottom: 8px; }
.nc2-bcon { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--nc2-hairline); }
.nc2-bcon__item { border-bottom: 1px solid var(--nc2-hairline); }
.nc2-bcon__row { min-height: 60px; box-sizing: border-box; display: flex; align-items: center; gap: 16px; padding: 8px 4px; color: var(--nc2-ink); text-decoration: none; }
.nc2-bcon__row:hover { color: var(--nc2-ink); }
.nc2-bcon__row:hover .nc2-bcon__title { text-decoration: underline; text-underline-offset: 2px; }
.nc2-bcon__row:focus-visible { outline-offset: -2px; border-radius: 6px; }
.nc2-bcon__num {
  width: 32px; height: 32px; border-radius: 16px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  background: var(--nc2-field); font: 600 14px/1 var(--nc2-font-ui); color: var(--nc2-ink);
}
.nc2-bcon__num--none { background: transparent; }
.nc2-bcon__body { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.nc2-bcon__title { font: 500 16px/1.3 var(--nc2-font-ui); }
.nc2-bcon__here { font: 600 12px/1.3 var(--nc2-font-ui); color: var(--nc2-navy); }
.nc2-bcon__row.is-here .nc2-bcon__title { font-weight: 600; }
.nc2-bcon__row.is-here .nc2-bcon__num { background: var(--nc2-navy); color: var(--nc2-page); }
.nc2-bcon__min { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; font: 500 13px/1 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bcon__chev { display: flex; color: var(--nc2-icon); }
html.nc2 .nc2-bcon__sugg { flex-shrink: 0; }

@media (max-width: 1023px) {
  html.nc2 .main.nc2-page { padding: 24px 24px 40px; }
  html.nc2 .main.nc2-seriespage, html.nc2 .main.nc2-bookpage { padding-top: 12px; }
}
@media (max-width: 767px) {
  /* Phones: collections become cards that open /series/<slug>/<collection> (Mobile web Series page board). */
  .nc2-chips, .nc2-groups { display: none; }
  .nc2-groupcards { display: flex; flex-direction: column; gap: 12px; padding-top: 16px; }
  .nc2-rows { grid-template-columns: minmax(0, 1fr); }
  .nc2-series-grid--lg { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
  html.nc2 .main.nc2-page { padding: 8px 16px 32px; gap: 10px; }
  html.nc2 .main.nc2-library .nc2-page__title { font-size: 23px; line-height: 1.25; }
  .nc2-page__title--lg { font-size: 26px; line-height: 1.2; }
  .nc2-libbar { flex-wrap: nowrap; gap: 8px; }
  html.nc2 .nc2-libsearch2 { flex: 1 1 0; min-width: 0; max-width: none; }
  .nc2-field input { font-size: 16px; } /* iOS zooms into a field under 16 px */
  .nc2-seg__item { padding: 0 12px; }
  .nc2-libmeta { min-height: 36px; }
  .nc2-row { gap: 14px; }
  .nc2-row__cover { width: 56px; height: 84px; margin: 10px 0; }
  .nc2-series--lg { gap: 14px; padding: 14px 14px 12px; }
  .nc2-series--lg .nc2-series__stack { width: 96px; height: 96px; }
  .nc2-series--lg .nc2-series__stack img:nth-child(1) { left: 22px; top: 6px; width: 54px; height: 84px; }
  .nc2-series--lg .nc2-series__stack img:nth-child(2) { left: 4px; top: 12px; width: 48px; height: 74px; }
  .nc2-series--lg .nc2-series__stack img:nth-child(3) { left: 44px; top: 12px; width: 48px; height: 74px; }
  .nc2-series--lg .nc2-series__title { font-size: 17px; }
  .nc2-series--lg .nc2-series__sub { font-size: 13px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .nc2-pagehead { padding: 4px 0 18px; gap: 8px; }
  .nc2-pagehead__text { gap: 6px; }
  .nc2-pagehead__sub { font-size: 14px; }
  /* Book page: cover centred over the text, buttons side by side (board M-book) */
  .nc2-bookhero { flex-direction: column; align-items: center; gap: 10px; padding: 4px 0 18px; text-align: center; }
  .nc2-bookhero__cover { width: 112px; height: 168px; border-radius: 7px; }
  .nc2-bookhero__text { flex: 0 1 auto; width: 100%; align-items: center; gap: 8px; padding-top: 0; }
  .nc2-bookhero__sub { font-size: 15px; }
  .nc2-bookhero__meta { justify-content: center; font-size: 12.5px; }
  .nc2-bookact { width: 100%; margin-top: 8px; }
  .nc2-bookcont { text-align: left; padding: 14px; }
  .nc2-bookcont .nc2-acts { width: 100%; }
  .nc2-contents { padding-top: 16px; }
  .nc2-group__title { font-size: 19px; }
  .nc2-bcon__row { min-height: 52px; gap: 12px; padding: 6px 0; }
  .nc2-bcon__num { width: 28px; height: 28px; border-radius: 14px; font-size: 13px; }
  .nc2-bcon__title { font-size: 15px; }
  .nc2-bcon__min { font-size: 12.5px; }
  .nc2-bcon__min .nc2-ico { display: none; }
}

/* ----- 10. /settings (R5; main canvas Desktop + Mobile web "Settings"; sub-pages, dialogs, signed out
   https://claude.ai/artifact/UA7No7F3Yz5tcGat64sbQH). The app's accordion: chip · title · summary · chevron,
   the open section on a warm wash. ----- */
.nc2-gear { position: relative; }
.nc2-gear[aria-current="page"] { color: var(--nc2-navy); }
.nc2-gear[aria-current="page"]::after {
  content: ''; position: absolute; left: 50%; bottom: -10px; width: 28px; height: 3px; margin-left: -14px;
  border-radius: 2px 2px 0 0; background: var(--nc2-gold);
}
/* --nc2-track-ink: unchosen options on the warm track (#6B6B6B there is 4.3:1; the board's #5E5A52 is 5.6:1). */
html.nc2 { --nc2-wash: #FBF7EE; --nc2-wash-line: #E3D6BA; --nc2-wash-rule: #EADFC8; --nc2-track: #EEE7D8; --nc2-track-ink: #5E5A52; --nc2-danger: #B3261E; }
html.nc2.nc-dark { --nc2-wash: #24211C; --nc2-wash-line: #3D3627; --nc2-wash-rule: #3A3428; --nc2-track: #2E2A23; --nc2-track-ink: #C9C3B8; --nc2-danger: #F2B8B5; }

html.nc2 .main.nc2-settings { max-width: 760px; gap: 14px; }
.nc2-settings.is-pending [data-when],
.nc2-settings.is-in [data-when="out"],
.nc2-settings.is-out [data-when="in"] { display: none !important; }
.nc2-settings .nc2-page__title { margin-bottom: 6px; }

.nc2-profile {
  display: flex; align-items: center; gap: 16px; padding: 18px;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-hero); box-shadow: var(--nc2-shadow-card);
}
.nc2-profile__avatar {
  width: 56px; height: 56px; border-radius: 28px; flex-shrink: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  background: var(--nc2-blue-wash); color: var(--nc2-navy); font: 600 24px/1 var(--nc2-font-title);
}
.nc2-profile__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nc2-profile__text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.nc2-profile__name { font: 600 19px/1.25 var(--nc2-font-title); color: var(--nc2-ink); overflow-wrap: anywhere; }
.nc2-profile__email { font: 400 13.5px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); overflow-wrap: anywhere; }
.nc2-profile__email:empty, .nc2-profile__how:empty { display: none; }
.nc2-profile__how { font: 500 12px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-profile__edit[hidden] { display: none; }

.nc2-setsignin {
  display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 20px;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-hero); box-shadow: var(--nc2-shadow-card);
}
.nc2-setsignin__title { margin: 0; font: 600 18px/1.3 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-setsignin__text { font: 400 13.5px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
/* Once mounted, the kit's compact panel is the card (as on Home). */
html.nc2 .nc2-setsignin.is-kit { padding: 0; border: 0; background: transparent; box-shadow: none; display: block; }
html.nc2 .nc2-setsignin .ncsi {
  max-width: none; padding: 20px; box-sizing: border-box;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-hero); box-shadow: var(--nc2-shadow-card);
}
html.nc2 .nc2-setsignin .ncsi .ncsi-title { margin: 0 0 6px; font: 600 18px/1.3 var(--nc2-font-title); letter-spacing: 0; color: var(--nc2-ink); }
html.nc2 .nc2-setsignin .ncsi .ncsi-benefit { margin: 0 0 14px; font-size: 13.5px; line-height: 1.45; color: var(--nc2-text-2); }
html.nc2 .nc2-setsignin .ncsi-btn { min-height: 44px; border-radius: var(--nc2-r-pill); font: 600 14px/1.2 var(--nc2-font-ui); }
html.nc2 .nc2-setsignin .ncsi .ncsi-fine { margin-top: 14px; padding-top: 12px; font-size: 12px; color: var(--nc2-text-2); }

/* Accordion */
.nc2-acc { border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card); background: var(--nc2-card); overflow: hidden; }
.nc2-acc.is-open { border-color: var(--nc2-wash-line); background: var(--nc2-wash); box-shadow: 0 4px 14px rgba(131, 95, 22, 0.10); }
.nc2-acc__h { margin: 0; font: inherit; }
.nc2-acc__btn {
  width: 100%; min-height: 68px; box-sizing: border-box; display: flex; align-items: center; gap: 14px; padding: 14px;
  border: 0; background: transparent; text-align: left; cursor: pointer; color: var(--nc2-ink); font: inherit;
}
.nc2-acc__btn:focus-visible { outline-offset: -3px; border-radius: var(--nc2-r-card); }
.nc2-acc__chip {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  font: 700 15px/1 var(--nc2-font-title);
}
.nc2-acc__chip--gold { background: var(--nc2-gold-wash); color: var(--nc2-gold-deep); }
.nc2-acc__chip--blue { background: var(--nc2-blue-wash); color: var(--nc2-navy); }
.nc2-acc__chip--grey { background: var(--nc2-field); color: var(--nc2-navy); font-size: 16px; font-weight: 600; }
.nc2-acc__text { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.nc2-acc__title { font: 600 15.5px/1.3 var(--nc2-font-ui); }
.nc2-acc__sum { font: 400 12.5px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); min-height: 1.4em; }
.nc2-acc__chev { display: flex; color: var(--nc2-icon); transition: transform .2s ease; }
.nc2-acc.is-open .nc2-acc__chev { transform: rotate(180deg); color: var(--nc2-gold-deep); }
@media (prefers-reduced-motion: reduce) { .nc2-acc__chev { transition: none; } }
.nc2-acc__body { padding: 0 14px 16px; display: flex; flex-direction: column; }
.nc2-acc__body[hidden] { display: none; }

/* Rows */
.nc2-setrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 0; border-top: 1px solid var(--nc2-wash-rule); }
.nc2-setrow__text { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.nc2-setrow__label { font: 500 15px/1.3 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-setrow__hint { font: 400 12.5px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-setrow__hint--below { margin: -4px 0 4px !important; }

.nc2-seg--set { height: 40px; padding: 3px; border-radius: 10px; background: var(--nc2-track); flex-wrap: nowrap; }
html.nc2 .nc2-seg--set .nc2-seg__item {
  height: 34px; padding: 0 14px; border: 0; border-radius: 8px; background: transparent; cursor: pointer;
  font: 500 13px/1 var(--nc2-font-ui); color: var(--nc2-track-ink);
}
html.nc2 .nc2-seg--set .nc2-seg__item[aria-pressed="true"] { background: var(--nc2-card); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); font-weight: 600; color: var(--nc2-ink); }
html.nc2 .nc2-seg--set .nc2-seg__item:focus-visible { outline-offset: 0; }
html.nc2 .nc2-seg--set .nc2-seg__item--a { width: 52px; padding: 0; }
html.nc2 .nc2-seg--set .nc2-seg__item--sm { font-size: 12px; }
html.nc2 .nc2-seg--set .nc2-seg__item--base { font-size: 14px; }
html.nc2 .nc2-seg--set .nc2-seg__item--lg { font-size: 16.5px; }
html.nc2 .nc2-seg--set .nc2-seg__item--xl { font-size: 20px; }
html.nc2 .nc2-seg--set .nc2-seg__item--serif { font-family: var(--nc2-font-title); }
.nc2-set-preview {
  margin-top: 6px !important; padding: 14px 16px; border: 1px solid var(--nc2-wash-rule); border-radius: 10px; background: var(--nc2-card);
  font-family: var(--font-reading, var(--nc2-font-ui)); font-size: calc(16px * var(--nc-font-scale, 1)); line-height: 1.6; color: var(--nc2-ink);
}

/* The sync switch (a real role="switch" button). On = deep gold (5.6:1 on the wash; the board's #DA9F28 is ~2:1). */
.nc2-switch {
  position: relative; width: 51px; height: 31px; flex-shrink: 0; padding: 0; border: 0; border-radius: 16px; cursor: pointer;
  background: #767676; transition: background .15s ease;
}
.nc2-switch[aria-checked="true"] { background: var(--nc2-gold-deep); }
html.nc2.nc-dark .nc2-switch { background: #8A857C; }
html.nc2.nc-dark .nc2-switch[aria-checked="true"] { background: var(--nc2-gold); }
.nc2-switch__knob {
  position: absolute; left: 2px; top: 2px; width: 27px; height: 27px; border-radius: 14px; background: #FFFFFF;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); transition: transform .15s ease;
}
.nc2-switch[aria-checked="true"] .nc2-switch__knob { transform: translateX(20px); }
@media (prefers-reduced-motion: reduce) { .nc2-switch, .nc2-switch__knob { transition: none; } }
.nc2-setrow--switch { flex-wrap: nowrap; }

/* Link / action rows (Sign-in methods, Privacy & data, Sign out, the sub-pages' rows) */
.nc2-setlink {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 52px; box-sizing: border-box;
  padding: 6px 0; border: 0; border-top: 1px solid var(--nc2-wash-rule); background: transparent; text-align: left; cursor: pointer;
  color: var(--nc2-ink); text-decoration: none; font: 500 15px/1.3 var(--nc2-font-ui);
}
.nc2-setlink:hover { color: var(--nc2-ink); }
.nc2-setlink:hover .nc2-setrow__label { text-decoration: underline; text-underline-offset: 3px; }
.nc2-setlink:focus-visible { outline-offset: -2px; border-radius: 6px; }
.nc2-setlink__chev { display: flex; color: var(--nc2-icon); }
.nc2-setlink__ext { color: var(--nc2-text-2); font-size: 15px; }
.nc2-setlink--danger { font-weight: 600; color: var(--nc2-danger); }
.nc2-setlink--danger:hover { color: var(--nc2-danger); text-decoration: underline; text-underline-offset: 3px; }
.nc2-set-note { margin-top: 8px !important; text-align: center; font: 400 12.5px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-set-note:empty { display: none; }

/* Sub-pages */
.nc2-set-hint { font: 400 14px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-setbox { border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card); background: var(--nc2-card); padding: 0 16px; overflow: hidden; }
.nc2-setbox > .nc2-setlink:first-child { border-top: 0; }
.nc2-setbox > .nc2-setlink { border-top-color: var(--nc2-hairline); }
html.nc2 .nc2-setaccounts .ncsi-card { max-width: none; width: 100%; margin: 0; }
.nc2-set-status { font: 500 14px/1.5 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-set-status:empty { display: none; }

/* Dialogs (native <dialog>: the app's confirm, the sync question, Edit name) */
.nc2-dialog {
  width: calc(100% - 40px); max-width: 420px; box-sizing: border-box; padding: 22px 20px 16px; margin: auto;
  border: 0; border-radius: var(--nc2-r-hero); background: var(--nc2-card); color: var(--nc2-ink);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.25); font-family: var(--nc2-font-ui);
}
.nc2-dialog::backdrop { background: rgba(17, 17, 17, 0.45); }
.nc2-dialog--fallback { position: fixed; inset: 0; z-index: 400; height: fit-content; }
.nc2-dialog__title { margin: 0 0 10px; font: 600 20px/1.3 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-dialog__body { margin: 0 0 6px; font: 400 14.5px/1.5 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-dialog__acts { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.nc2-dialog__stack { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.nc2-dialog__stack .nc2-btn { white-space: normal; text-align: center; }
.nc2-dialog__form { display: flex; flex-direction: column; gap: 8px; }
.nc2-dialog__label { font: 500 14px/1.3 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-dialog__input {
  height: 44px; box-sizing: border-box; padding: 0 12px; border: 1px solid var(--nc2-bar-line); border-radius: var(--nc2-r-field);
  background: var(--nc2-page); color: var(--nc2-ink); font: 400 16px var(--nc2-font-ui);
}
.nc2-btn--danger { background: #B3261E; color: #FFFFFF; }
.nc2-btn--danger:hover { background: #8C1D17; color: #FFFFFF; }
.nc2-btn--navy { background: #3A5C92; color: #FFFFFF; }
.nc2-btn--navy:hover { background: #2B4570; color: #FFFFFF; }
.nc2-btn--outline { background: transparent; border-color: var(--nc2-navy); color: var(--nc2-navy); }
.nc2-btn--outline:hover { background: var(--nc2-blue-wash); color: var(--nc2-navy); }
.nc2-btn--text { background: transparent; color: var(--nc2-navy); padding: 0 12px; }
.nc2-btn--text:hover { background: var(--nc2-field); color: var(--nc2-navy); }

@media (max-width: 620px) {
  html.nc2 .main.nc2-settings { gap: 12px; }
  .nc2-settings .nc2-page__title { font-size: 26px; margin-bottom: 0; }
  .nc2-profile { padding: 16px; gap: 14px; }
  .nc2-profile__avatar { width: 52px; height: 52px; font-size: 22px; }
  .nc2-profile__name { font-size: 18px; }
  .nc2-acc__btn { padding: 12px; gap: 12px; min-height: 60px; }
  .nc2-acc__chip { width: 36px; height: 36px; font-size: 14px; }
  .nc2-acc__body { padding: 0 12px 14px; }
  html.nc2 .nc2-seg--set .nc2-seg__item { padding: 0 12px; }
  html.nc2 .nc2-seg--set .nc2-seg__item--a { width: 46px; padding: 0; }
}

/* ----- 11. The reader shell (R6; boards https://claude.ai/artifact/BX2tutDWZ5R5SfM1JAZcAj + the page-numbers canvas +
   the main canvas's Desktop/Mobile "Reader"). Session + Bible pages (html.nc2-reading): the contents sidebar
   (a sheet below 1024 px), the 56 px reader bar, the app's player. Today's reading content is untouched: only
   the shell around it is styled here. ----- */
html.nc2 {
  --nc2-navy-deep: #274372;       /* the player's play button + icons (the app's) */
  --nc2-on-navy: #FFFFFF;
  --nc2-progress-track: #E6E6E6;
  --nc2-pressed: #FFFFFF;         /* a chosen option on the grey segmented track */
}
html.nc2.nc-dark {
  --nc2-navy-deep: #B6C7E2;
  --nc2-on-navy: #151413;
  --nc2-progress-track: #3A3936;
  --nc2-pressed: #3A3936;
}

html.nc2-reading .layout { align-items: flex-start; background: var(--nc2-page); }
html.nc2 .nc2-reader__main { flex: 1 1 auto; min-width: 0; padding: 0 32px 120px; background: var(--nc2-page); }
html.nc2 .nc2-reader__main .reading-content,
html.nc2 .nc2-reader__main .edit-toolbar { max-width: 680px; margin-left: auto; margin-right: auto; }
html.nc2 .nc2-reader__main .reading-content { padding-top: 28px; }
html.nc2.nc2-audio-open .nc2-reader__main { padding-bottom: 200px; } /* the last line clears the player */
/* A section link lands below the sticky header + reader bar. */
html.nc2-reading .session-content [id] { scroll-margin-top: calc(var(--nc2-header-h) + 72px); }
/* The player's own button is in the reader bar (Listen); the floating one stays in the DOM for its data. */
html.nc2-reading .audio-fab { display: none !important; }
/* Editing: the editor takes the width (editor.js hides .reading-top = the reader bar). */
html.nc2 .layout:has(.main--editing) .nc2-toc { display: none !important; }

/* R6b (Steve's "A + T1", rethink canvas https://claude.ai/artifact/VAjif16YkQ9B7RuWKKMpbk): on desktop the text starts
   64 px after the contents (left, as today's site had it), and there is no reader bar — Listen · Aa · Notebook
   sit at the top of the contents (.nc2-toc__tools). Phones/tablets keep the bar (the title opens the sheet). */
@media (min-width: 1024px) {
  html.nc2 .nc2-reader__main { padding-left: 64px; }
  html.nc2 .nc2-reader__main .reading-content,
  html.nc2 .nc2-reader__main .edit-toolbar { margin-left: 0; margin-right: auto; }
  html.nc2 .nc2-reader__main .reading-content { padding-top: 40px; }
  html.nc2 .nc2-rbar { display: none; }
  html.nc2-reading .session-content [id] { scroll-margin-top: calc(var(--nc2-header-h) + 16px); }
  html.nc2 .nc2-toc__tools { display: flex; }
}
.nc2-toc__tools { display: none; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.nc2-tool {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px 0 10px; box-sizing: border-box;
  border: 1px solid var(--nc2-bar-line); border-radius: var(--nc2-r-pill); background: var(--nc2-page); color: var(--nc2-ink);
  font: 600 13.5px/1 var(--nc2-font-ui); cursor: pointer;
}
.nc2-tool[hidden] { display: none; }
.nc2-tool:hover { background: var(--nc2-field); }
.nc2-tool .nc2-ico { color: var(--nc2-text-2); }
.nc2-tool--listen .nc2-ico { color: var(--nc2-navy-deep); }
.nc2-tool--listen[aria-pressed="true"] { background: var(--nc2-blue-wash); border-color: transparent; }
.nc2-tool[aria-busy="true"] { opacity: .6; }
.nc2-tool[aria-expanded="true"] { background: var(--nc2-field); }
/* The Notebook is open (annotations W5; board D5's pressed "Notebook"). */
.nc2-tool[data-nc2-notebook][aria-pressed="true"] { background: var(--nc2-gold-wash); border-color: var(--nc2-gold); }
.nc2-rbar__btn[data-nc2-notebook][aria-pressed="true"] { background: var(--nc2-gold-wash); }
/* A wide desktop makes room for the Notebook panel (440 px) so the text isn't under it; narrower, it overlays. */
@media (min-width: 1366px) { html.nc2.nc-nb-open .nc2-reader__main { padding-right: 464px; } }
.nc2-tool__aa { font: 600 15px/1 var(--nc2-font-title); }

/* Contents (desktop: the sticky sidebar) */
.nc2-toc { display: none; box-sizing: border-box; background: var(--nc2-page); font-family: var(--nc2-font-ui); text-align: left; }
@media (min-width: 1024px) {
  .nc2-toc {
    display: block; position: sticky; top: var(--nc2-header-h); align-self: flex-start;
    flex: 0 0 300px; width: 300px; height: calc(100vh - var(--nc2-header-h)); overflow-y: auto; overscroll-behavior: contain;
    padding: 16px 20px 40px; border-right: 1px solid var(--nc2-hairline);
  }
  .nc2-toc__sheethead { display: none; }
  .nc2-toc-scrim { display: none; }
}
.nc2-toc__back {
  display: inline-flex; align-items: center; gap: 2px; min-height: 44px; margin-left: -4px;
  font: 600 14px/1 var(--nc2-font-ui); color: var(--nc2-navy); text-decoration: none;
}
.nc2-toc__back:hover { text-decoration: underline; }
.nc2-toc__book { display: flex; flex-direction: column; gap: 3px; margin: 2px 0 14px; }
.nc2-toc__title { font: 600 20px/1.25 var(--nc2-font-title); color: var(--nc2-ink); text-decoration: none; }
a.nc2-toc__title:hover { text-decoration: underline; }
.nc2-toc__line { font: 400 12.5px/1.35 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-toc__field {
  display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; box-sizing: border-box;
  border: 1px solid var(--nc2-bar-line); border-radius: var(--nc2-r-field); background: var(--nc2-page); color: var(--nc2-icon);
}
.nc2-toc__field:focus-within { border-color: var(--nc2-focus); box-shadow: 0 0 0 1px var(--nc2-focus); }
.nc2-toc__field input {
  flex: 1 1 0; min-width: 0; height: 100%; border: 0; outline: none; background: transparent; -webkit-appearance: none; appearance: none;
  font: 400 13.5px/1 var(--nc2-font-ui); color: var(--nc2-ink);
}
.nc2-toc__field input::placeholder { color: var(--nc2-text-2); opacity: 1; }
html.nc2 .nc2-toc__field input:focus-visible { outline: none; }
.nc2-toc__label { margin: 18px 0 6px; font: 700 11px/1 var(--nc2-font-ui); letter-spacing: 1px; text-transform: uppercase; color: var(--nc2-text-2); }
.nc2-toc__list { display: flex; flex-direction: column; }
.nc2-toc__row {
  display: flex; flex-direction: column; justify-content: center; gap: 2px; min-height: 40px; box-sizing: border-box;
  padding: 6px 8px; border-radius: 8px; text-decoration: none; text-align: left; align-items: stretch;
  font: 600 14px/1.3 var(--nc2-font-ui); color: var(--nc2-ink);
}
.nc2-toc__row--section { font-weight: 400; font-size: 13.5px; color: var(--nc2-text-2); min-height: 36px; padding: 6px 8px 6px 10px; }
.nc2-toc__row--l3 { font-weight: 400; font-size: 12.5px; color: var(--nc2-text-2); min-height: 32px; }
.nc2-toc__row:hover { background: var(--nc2-field); }
.nc2-toc__row[hidden] { display: none; }
.nc2-toc__row.is-reading { background: var(--nc2-blue-wash); color: var(--nc2-navy); font-weight: 600; }
/* R6b: the folding outline (the app's navigator: _pulldown_session_tile.dart). A session = its title (the part as a
   small overline over the name) + a chevron; its sections hang below; sub-headings off a thin guide line. */
.nc2-toc__sess { padding: 4px 0; border-top: 1px solid var(--nc2-hairline); }
.nc2-toc__sess:first-child { border-top: 0; }
.nc2-toc__sess[hidden], .nc2-toc__sec[hidden], .nc2-toc__group[hidden] { display: none; }
.nc2-toc__head { display: flex; align-items: center; gap: 2px; }
.nc2-toc__head > .nc2-toc__row { flex: 1 1 auto; min-width: 0; }
.nc2-toc__row--session { min-height: 48px; }
.nc2-toc__over { font: 700 10.5px/1.2 var(--nc2-font-ui); letter-spacing: .8px; text-transform: uppercase; color: var(--nc2-text-2); }
/* Steve's "C" (2026-10-13, https://claude.ai/artifact/A2hUcswYyzR7FKpzw9hYRJ): session names in Lora, the sections
   regular grey, so the two levels read apart. */
.nc2-toc__name { font: 600 16px/1.3 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-toc__row--session.is-current .nc2-toc__over,
.nc2-toc__row--session.is-current .nc2-toc__name { color: var(--nc2-navy); }
.nc2-toc__fold {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0;
  border: 0; border-radius: 18px; background: transparent; color: var(--nc2-text-2); cursor: pointer;
}
.nc2-toc__fold--sec { width: 32px; height: 32px; border-radius: 16px; }
.nc2-toc__fold:hover { background: var(--nc2-field); color: var(--nc2-ink); }
.nc2-toc__fold .nc2-ico { transition: transform 150ms ease; }
.nc2-toc__fold[aria-expanded="true"] .nc2-ico { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .nc2-toc__fold .nc2-ico { transition: none; } }
.nc2-toc__group { padding: 0 0 6px; }
.nc2-toc__group--sub { margin: 0 0 4px 14px; padding: 0 0 0 8px; border-left: 2px solid var(--nc2-hairline); }
.nc2-toc__none { margin: 8px; font: 400 13px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-toc__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.nc2-toc__chapter {
  display: flex; align-items: center; justify-content: center; height: 40px; border-radius: 8px;
  background: var(--nc2-field); color: var(--nc2-ink); text-decoration: none; font: 500 13px/1 var(--nc2-font-ui); font-variant-numeric: tabular-nums;
}
.nc2-toc__chapter:hover { background: var(--nc2-bar-line); }
.nc2-toc__chapter.is-current { background: var(--nc2-navy); color: var(--nc2-page); font-weight: 700; }

/* The reader bar: sticky under the header (desktop); the top bar while reading (phones). */
.nc2-rbar { position: sticky; top: var(--nc2-header-h); z-index: 90; margin: 0 -32px; padding: 0 32px; background: var(--nc2-page); }
html.nc2 .nc2-rbar.reading-top { margin-bottom: 0; }
.nc2-rbar__inner {
  display: flex; align-items: center; gap: 6px; max-width: 680px; height: 56px; margin: 0 auto;
  border-bottom: 1px solid var(--nc2-hairline); font-family: var(--nc2-font-ui);
}
.nc2-rbar__back { display: none; }
.nc2-rbar__title {
  display: inline-flex; align-items: center; gap: 4px; flex: 0 1 auto; min-width: 0; max-width: min(340px, 60%);
  height: 36px; padding: 0 10px 0 12px; border: 0; border-radius: var(--nc2-r-pill); cursor: pointer;
  background: var(--nc2-field); color: var(--nc2-ink); font: 600 14px/1 var(--nc2-font-ui);
}
.nc2-rbar__title > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nc2-rbar__title .nc2-ico { color: var(--nc2-text-2); }
.nc2-rbar__title[aria-expanded="true"] { background: var(--nc2-blue-wash); }
.nc2-rbar__section { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 13px/1.2 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-rbar__spacer { flex: 1 1 0; }
.nc2-rbar__btn {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; padding: 0;
  border: 0; border-radius: 22px; background: transparent; color: var(--nc2-text-2); cursor: pointer;
}
.nc2-rbar__btn[hidden] { display: none; }
.nc2-rbar__btn:hover { background: var(--nc2-field); }
.nc2-rbar__listen { color: var(--nc2-navy-deep); }
.nc2-rbar__listen[aria-pressed="true"] { background: var(--nc2-blue-wash); }
.nc2-rbar__listen[aria-busy="true"] { opacity: .6; }
.nc2-rbar__aa span { font: 600 15px/1 var(--nc2-font-title); }
.nc2-rbar__aa[aria-expanded="true"] { background: var(--nc2-field); color: var(--nc2-ink); }

@media (max-width: 1023px) {
  /* Reading: the site header scrolls away and the reader bar stays (Mobile web "Reader" board). */
  html.nc2-reading .nc2-header { position: relative; }
  html.nc2 .nc2-reader__main { padding: 0 16px 120px; }
  html.nc2 .nc2-reader__main .reading-content { padding-top: 20px; }
  html.nc2-reading .session-content [id] { scroll-margin-top: 64px; }
  .nc2-rbar { top: 0; margin: 0 -16px; padding: 0 4px; border-bottom: 1px solid var(--nc2-bar-line); }
  .nc2-rbar__inner { height: 48px; max-width: none; gap: 0; border-bottom: 0; }
  .nc2-rbar__back { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; color: var(--nc2-ink); }
  .nc2-rbar__title { height: 34px; margin: 0 auto; max-width: none; }
  .nc2-rbar__section, .nc2-rbar__spacer { display: none; }
  .nc2-rbar__aa { color: var(--nc2-ink); }
  /* R6c: a tap on the page hides the bars (js/v2-shell.js). Still in the tab order: focus brings them back. */
  .nc2-rbar { transition: transform .25s ease, opacity .25s ease; }
  html.nc2-chrome-hidden .nc2-rbar { transform: translateY(calc(-100% - 2px)); opacity: 0; pointer-events: none; }

  /* Contents: a sheet from the top (M-contents), over a scrim. */
  html.nc2-toc-open .nc2-toc {
    display: block; position: fixed; top: 0; left: 0; right: 0; z-index: 9100; max-height: 85vh; overflow-y: auto; overscroll-behavior: contain;
    padding: 0 16px 16px; border-radius: 0 0 18px 18px; box-shadow: 0 10px 30px rgba(17, 17, 17, 0.18);
  }
  html.nc2-toc-open body { overflow: hidden; }
  .nc2-toc__sheethead {
    position: sticky; top: 0; z-index: 1; display: flex; align-items: center; height: 48px; margin: 0 -16px 8px; padding: 0 4px 0 48px;
    background: var(--nc2-page); border-bottom: 1px solid var(--nc2-bar-line);
  }
  .nc2-toc__sheettitle {
    display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; height: 34px; margin: 0 auto; padding: 0 10px 0 12px;
    border: 0; border-radius: var(--nc2-r-pill); background: var(--nc2-blue-wash); color: var(--nc2-ink); font: 600 14px/1 var(--nc2-font-ui); cursor: pointer;
  }
  .nc2-toc__sheettitle > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nc2-toc__close { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: 22px; background: transparent; color: var(--nc2-ink); cursor: pointer; }
  .nc2-toc__field { height: 44px; }
  .nc2-toc__field input { font-size: 16px; } /* iOS zooms into a field under 16 px */
  .nc2-toc__row { min-height: 44px; }
  .nc2-toc__row--session { min-height: 52px; }
  .nc2-toc__fold, .nc2-toc__fold--sec { width: 44px; height: 44px; border-radius: 22px; }
  .nc2-toc__chapter { height: 44px; }
  .nc2-toc-scrim { position: fixed; inset: 0; z-index: 9050; background: rgba(17, 17, 17, 0.38); }
}

/* The player (the app's): a floating card on desktop, docked at the bottom on phones. The expanded panel is
   after the bar in the DOM (Tab order) and drawn above it (column-reverse). */
.nc2-player {
  position: fixed; z-index: 120; left: 50%; bottom: 24px; transform: translateX(-50%);
  width: calc(100% - 32px); max-width: 640px; box-sizing: border-box;
  display: flex; flex-direction: column-reverse;
  background: var(--nc2-card); color: var(--nc2-ink); font-family: var(--nc2-font-ui);
  border: 1px solid var(--nc2-bar-line); border-radius: 32px; box-shadow: 0 -4px 24px rgba(29, 46, 73, 0.16);
}
.nc2-player.is-expanded { border-radius: 24px; }
.nc2-player__bar { display: flex; align-items: center; gap: 4px; padding: 8px 10px 8px 8px; }
.nc2-player__play {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; padding: 0;
  border: 0; border-radius: 22px; background: var(--nc2-navy-deep); color: var(--nc2-on-navy); cursor: pointer;
}
.nc2-player__info { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 4px; padding: 0 4px 0 6px; }
.nc2-player__line { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.nc2-player__title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 700 14px/1.2 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-player__time { flex-shrink: 0; white-space: nowrap; font: 500 12px/1 var(--nc2-font-ui); color: var(--nc2-text-2); font-variant-numeric: tabular-nums; }
.nc2-player__track { position: relative; display: flex; align-items: center; height: 16px; }
.nc2-player .audio-scrubber-container { flex: 1 1 auto; width: 100%; height: 16px; }
.nc2-player__scrubber {
  --p: 0%;
  width: 100%; height: 16px; margin: 0; padding: 0; background: transparent; cursor: pointer;
  -webkit-appearance: none; appearance: none;
}
.nc2-player__scrubber::-webkit-slider-runnable-track {
  height: 4px; border-radius: 2px;
  background: linear-gradient(to right, var(--nc2-gold) var(--p), var(--nc2-progress-track) var(--p));
}
.nc2-player__scrubber::-moz-range-track { height: 4px; border-radius: 2px; background: var(--nc2-progress-track); }
.nc2-player__scrubber::-moz-range-progress { height: 4px; border-radius: 2px; background: var(--nc2-gold); }
.nc2-player__scrubber::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 12px; height: 12px; margin-top: -4px; border: 0; border-radius: 50%;
  background: var(--nc2-gold); opacity: 0; transition: opacity .15s;
}
.nc2-player__scrubber::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 50%; background: var(--nc2-gold); opacity: 0; }
.nc2-player__scrubber:hover::-webkit-slider-thumb, .nc2-player__scrubber:focus-visible::-webkit-slider-thumb { opacity: 1; }
.nc2-player__scrubber:hover::-moz-range-thumb, .nc2-player__scrubber:focus-visible::-moz-range-thumb { opacity: 1; }
.nc2-player .scrubber-h2-marker { height: 8px; background: #9AA9C2; }
.nc2-player .scrubber-h2-marker:hover { height: 12px; background: var(--nc2-navy); }
.nc2-player__btn {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; padding: 0;
  border: 0; border-radius: 22px; background: transparent; color: var(--nc2-navy-deep); cursor: pointer;
}
.nc2-player__btn:hover { background: var(--nc2-field); }
.nc2-player__more { color: var(--nc2-text-2); }
.nc2-player__more .nc2-ico { transition: transform .2s; }
.nc2-player__more[aria-expanded="true"] .nc2-ico { transform: rotate(180deg); }
.nc2-player__extra {
  display: none; flex-direction: column; gap: 14px; max-height: 60vh; overflow-y: auto;
  padding: 18px 20px 14px; border-bottom: 1px solid var(--nc2-hairline);
}
.nc2-player.is-expanded .nc2-player__extra { display: flex; }
.nc2-player__head { display: flex; align-items: flex-start; gap: 12px; }
.nc2-player__now { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.nc2-player__eyebrow { font: 700 11px/1 var(--nc2-font-ui); letter-spacing: 1px; text-transform: uppercase; color: var(--nc2-text-2); }
.nc2-player__nowtitle { font: 600 18px/1.3 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-player__sub { font: 400 13px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-player__close {
  display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; height: 40px; padding: 0 14px;
  border: 1px solid var(--nc2-bar-line); border-radius: var(--nc2-r-pill); background: var(--nc2-card); color: var(--nc2-ink);
  font: 500 13px/1 var(--nc2-font-ui); cursor: pointer;
}
.nc2-player__close:hover { background: var(--nc2-field); }
.nc2-player__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px solid var(--nc2-hairline); }
.nc2-player__label { font: 500 14px/1.3 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-player__speed {
  height: 40px; padding: 0 12px; border: 0; border-radius: 10px; background: var(--nc2-field); color: var(--nc2-ink);
  font: 600 14px/1 var(--nc2-font-ui); font-variant-numeric: tabular-nums; cursor: pointer;
}
.nc2-player__loop { display: flex; flex-direction: column; gap: 10px; padding-top: 12px; border-top: 1px solid var(--nc2-hairline); }
.nc2-player__loophead { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.nc2-player__range { font: 600 13px/1.3 var(--nc2-font-ui); color: var(--nc2-gold-deep); }
.nc2-player__loopbtns { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.nc2-loop-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 64px; height: 44px; padding: 0 14px;
  border: 1.5px solid var(--nc2-bar-line); border-radius: 12px; background: var(--nc2-card); color: var(--nc2-ink);
  font: 700 15px/1 var(--nc2-font-ui); cursor: pointer;
}
.nc2-loop-btn:hover:not(:disabled) { background: var(--nc2-field); }
.nc2-loop-btn.is-set { border-color: var(--nc2-navy); background: var(--nc2-blue-wash); color: var(--nc2-navy); }
.nc2-loop-btn.is-set[data-verse]::after { content: '·\00a0' attr(data-verse); margin-left: -2px; }
.nc2-loop-btn--repeat { font-weight: 600; }
.nc2-loop-btn--repeat[aria-pressed="true"] { border-color: var(--nc2-navy-deep); background: var(--nc2-navy-deep); color: var(--nc2-on-navy); }
.nc2-loop-btn:disabled { opacity: .45; cursor: default; }
.nc2-loop-btn--clear { min-width: 44px; width: 44px; padding: 0; }
.nc2-loop-btn[hidden] { display: none; }
.nc2-player__hint { margin: 0; font: 400 12.5px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
/* "Jump to audio location" (audio-player.js): a pill above the player. */
html.nc2-reading .audio-jump-link {
  bottom: 104px; z-index: 121; padding: 10px 16px; border: 1px solid var(--nc2-bar-line); border-radius: var(--nc2-r-pill);
  background: var(--nc2-card); color: var(--nc2-navy); font: 600 13px/1 var(--nc2-font-ui); box-shadow: 0 4px 14px rgba(29, 46, 73, 0.14);
}
html.nc2-reading:has(.nc2-player.is-expanded) .audio-jump-link { display: none !important; }
@media (max-width: 1023px) {
  .nc2-player {
    left: 0; right: 0; bottom: 0; transform: none; width: auto; max-width: none;
    border-width: 1px 0 0; border-radius: 24px 24px 0 0; padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .nc2-player.is-expanded { border-radius: 24px 24px 0 0; }
  .nc2-player__bar { padding: 10px 8px 12px 10px; gap: 0; }
  .nc2-player__extra { padding: 14px 18px 12px; }
  .nc2-player__loopbtns .nc2-loop-btn { flex: 1 1 0; min-width: 0; }
  .nc2-player__loopbtns .nc2-loop-btn--repeat { flex-grow: 1.4; }
  .nc2-player__loopbtns .nc2-loop-btn--clear { flex: 0 0 44px; }
  html.nc2-reading .audio-jump-link { bottom: 96px; }
}
@media (prefers-reduced-motion: reduce) { .nc2-player__more .nc2-ico, .nc2-player__scrubber::-webkit-slider-thumb { transition: none; } }

/* The Aa menu (settings.js toggleReadingMenu): a popover on desktop, a bottom sheet below 1024 px. */
.nc-menu.nc2-aa {
  width: 340px; box-sizing: border-box; padding: 4px 16px 4px; border: 1px solid var(--nc2-hairline); border-radius: 14px;
  background: var(--nc2-card); color: var(--nc2-ink); box-shadow: 0 12px 32px rgba(29, 46, 73, 0.16); font-family: var(--nc2-font-ui);
}
.nc2-aa .nc-menu__row { padding: 12px 0; border-top: 1px solid var(--nc2-hairline); gap: 10px; flex-wrap: wrap; }
.nc2-aa .nc-menu__row:first-child, .nc2-aa .nc2-aa__head + .nc-menu__row { border-top: 0; }
.nc2-aa .nc-menu__label { font: 500 14px/1.3 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-aa .nc-seg { gap: 2px; padding: 3px; border-radius: 10px; background: var(--nc2-field); }
.nc2-aa .nc-seg__btn {
  min-width: 40px; height: 32px; padding: 0 10px; border-radius: 8px; background: transparent; color: var(--nc2-track-ink);
  font: 500 12.5px/1 var(--nc2-font-ui);
}
.nc2-aa .nc-seg__btn:hover { background: transparent; color: var(--nc2-ink); }
html.nc2 .nc2-aa .nc-seg__btn[aria-pressed="true"] { background: var(--nc2-pressed); color: var(--nc2-ink); font-weight: 600; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); }
.nc2-aa .nc-seg__btn.nc2-aa__a1 { font-size: 11.5px; }
.nc2-aa .nc-seg__btn.nc2-aa__a2 { font-size: 13.5px; }
.nc2-aa .nc-seg__btn.nc2-aa__a3 { font-size: 16px; }
.nc2-aa .nc-seg__btn.nc2-aa__a4 { font-size: 19px; }
.nc2-aa .nc-seg__btn.nc2-aa__serif { font-family: var(--nc2-font-title); }
.nc2-aa__all {
  display: flex; align-items: center; justify-content: space-between; min-height: 44px; border-top: 1px solid var(--nc2-hairline);
  font: 500 14px/1.3 var(--nc2-font-ui); color: var(--nc2-navy); text-decoration: none;
}
.nc2-aa__all:hover { text-decoration: underline; }
.nc-menu.nc2-aa--sheet {
  left: 0 !important; right: 0; top: auto !important; bottom: 0; width: auto; max-height: 85vh; overflow-y: auto;
  padding: 8px 20px calc(20px + env(safe-area-inset-bottom, 0px)); border-width: 0; border-radius: 22px 22px 0 0;
  box-shadow: 0 -10px 30px rgba(17, 17, 17, 0.18);
}
.nc2-aa__grabber { width: 36px; height: 4px; margin: 2px auto 8px; border-radius: 2px; background: var(--nc2-bar-line); }
.nc2-aa__head { display: flex; align-items: center; justify-content: space-between; }
.nc2-aa__title { margin: 0; font: 600 17px/1.3 var(--nc2-font-title); color: var(--nc2-ink); }
.nc2-aa__close { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-right: -12px; border: 0; border-radius: 22px; background: transparent; color: var(--nc2-ink); cursor: pointer; }
.nc2-aa--sheet .nc-seg__btn { height: 36px; min-width: 44px; font-size: 13px; }
.nc2-toc__line a { color: inherit; text-decoration: none; }
.nc2-toc__line a:hover { color: var(--nc2-navy); text-decoration: underline; }

/* ----- R7: print page numbers (design record §6.3; page-numbers canvas https://claude.ai/artifact/1NiZcjMyokJCtvTrXRp9qr,
   "The divider" spec + Main / D-aa-menu / D-goto-nudge / M-navigator / M-aa-sheet). The dividers are EMPTY data-nc-skip
   elements (src/server/print-pages.js): "PAGE 41" is generated content, never selected, copied or read by the
   anchors / narration. Hidden unless html.nc-print-pages (settings.js, from the shared printPages). ----- */
.nc-page, .nc-page-hy { display: none; }
html.nc2.nc-print-pages .session-content .nc-page {
  display: flex; align-items: center; gap: 10px; width: 100%; box-sizing: border-box;
  margin: 1.25rem 0 0; text-indent: 0; text-align: left; font-style: normal; line-height: 1;
}
/* Above a heading the divider takes the heading's top space and sits just over its first line. */
html.nc2.nc-print-pages .session-content div.nc-page:has(+ :is(h1, h2, h3)) { margin-top: 2rem; }
html.nc2.nc-print-pages .session-content div.nc-page + * { margin-top: 10px !important; }
/* Inside a paragraph: the line before ends early (ragged), the same paragraph goes on below (no indent, no gap). */
html.nc2.nc-print-pages .session-content .nc-page--in {
  margin: calc(9px * var(--nc-font-scale, 1)) 0 calc(8px * var(--nc-font-scale, 1));
}
html.nc2.nc-print-pages .session-content .nc-page::before,
html.nc2.nc-print-pages .session-content .nc-page::after { content: ""; flex: 1 1 0; min-width: 12px; height: 1px; background: var(--nc2-bar-line); }
html.nc2 .nc-page__label::after { content: "PAGE " attr(data-page); }
/* The board's #7A7A7A is 4.3:1 on white: the secondary text token (#6B6B6B, 5.3:1; dark #B9B3A8) instead. */
html.nc2 .nc-page__label {
  flex: 0 0 auto; font: 500 calc(11px * var(--nc-font-scale, 1))/1 'Poppins', var(--nc2-font-ui); letter-spacing: 0.14em;
  text-transform: uppercase; font-variant-numeric: tabular-nums; color: var(--nc2-text-2); white-space: nowrap;
}
/* A word split across pages: the hyphen is drawn, never in the text. */
html.nc2.nc-print-pages .session-content .nc-page-hy { display: inline; }
html.nc2.nc-print-pages .session-content .nc-page-hy::after { content: "-"; }
/* Go to page (numbers on) lands the divider under the reader bar. */
html.nc2-reading .session-content .nc-page[id] { scroll-margin-top: calc(var(--nc2-header-h) + 72px); }

/* The CONTENTS line + its quiet "Page numbers" mini switch (the app's Search panel caption). */
.nc2-toc__labelrow { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 12px 0 2px; }
.nc2-toc__labelrow .nc2-toc__label { margin: 0; }
.nc2-pp-switch {
  display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 2px; border: 0; background: transparent; cursor: pointer;
  font: 500 12px/1 var(--nc2-font-ui); color: var(--nc2-text-2);
}
.nc2-pp-switch__track { position: relative; display: block; width: 30px; height: 18px; border-radius: 9px; background: #767676; transition: background .15s ease; }
.nc2-pp-switch__knob {
  position: absolute; left: 2px; top: 2px; width: 14px; height: 14px; border-radius: 7px; background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); transition: transform .15s ease;
}
html.nc-print-pages .nc2-pp-switch__track { background: var(--nc2-gold-deep); }
html.nc-print-pages .nc2-pp-switch__knob { transform: translateX(12px); }
html.nc2.nc-dark .nc2-pp-switch__track { background: #8A857C; }
html.nc2.nc-dark.nc-print-pages .nc2-pp-switch__track { background: var(--nc2-gold); }
.nc2-pp-switch:focus-visible { outline: 2px solid var(--nc2-focus); outline-offset: 2px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { .nc2-pp-switch__track, .nc2-pp-switch__knob { transition: none; } }
/* Each row's "p. N" while page numbers are on (generated: the row's text, which Find reads, stays its title). */
.nc2-toc__page { display: none; }
.nc2-toc__page::after { content: "p. " attr(data-page); }
html.nc2.nc-print-pages .nc2-toc__row:has(> .nc2-toc__page) { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 8px; align-items: center; }
html.nc2.nc-print-pages .nc2-toc__row > .nc2-toc__over,
html.nc2.nc-print-pages .nc2-toc__row > .nc2-toc__name { grid-column: 1; } /* R6b: a session's overline over its name */
html.nc2.nc-print-pages .nc2-toc__row > .nc2-toc__page {
  display: block; grid-column: 2; grid-row: 1 / span 2;
  font: 500 12px/1 var(--nc2-font-ui); font-variant-numeric: tabular-nums; color: var(--nc2-gold-deep);
}
/* The gold "Go to page 41 · Print edition · Session 1" row above the matches. */
.nc2-pp-goto-slot { margin: 10px 0 2px; }
.nc2-pp-goto-slot[hidden] { display: none; }
.nc2-pp-goto {
  display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 10px; box-sizing: border-box; border-radius: 10px;
  background: var(--nc2-gold-wash); color: var(--nc2-ink); text-decoration: none;
}
.nc2-pp-goto svg { flex: 0 0 auto; color: var(--nc2-gold-deep); }
.nc2-pp-goto:hover { box-shadow: inset 0 0 0 1px var(--nc2-gold); }
.nc2-pp-goto__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nc2-pp-goto__title { font: 600 13.5px/1.2 var(--nc2-font-ui); }
.nc2-pp-goto__sub { font: 400 11.5px/1.25 var(--nc2-font-ui); color: #5F5A52; }
html.nc2.nc-dark .nc2-pp-goto__sub { color: #CFC8BB; }

/* The Aa menu's Page numbers row (label + line, a switch on the right). */
.nc2-aa .nc2-aa__switchrow { flex-wrap: nowrap; }
.nc2-aa__switchrow .nc-menu__label { display: flex; flex-direction: column; gap: 3px; cursor: pointer; }
.nc2-aa__switchline { font: 400 12px/1.4 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc-menu.nc2-aa .nc2-switch { width: 44px; height: 26px; border-radius: 13px; }
.nc-menu.nc2-aa .nc2-switch .nc2-switch__knob { width: 22px; height: 22px; border-radius: 11px; }
.nc-menu.nc2-aa .nc2-switch[aria-checked="true"] .nc2-switch__knob { transform: translateX(18px); }
.nc-menu.nc2-aa.nc2-aa--sheet .nc2-switch { width: 51px; height: 31px; border-radius: 16px; }
.nc-menu.nc2-aa.nc2-aa--sheet .nc2-switch .nc2-switch__knob { width: 27px; height: 27px; border-radius: 14px; }
.nc-menu.nc2-aa.nc2-aa--sheet .nc2-switch[aria-checked="true"] .nc2-switch__knob { transform: translateX(20px); }
.nc2-aa .nc2-switch:focus-visible { outline: 2px solid var(--nc2-focus); outline-offset: 2px; }

/* The one-time nudge after Go to page with page numbers off: a dark banner above the player, and a soft gold wash
   over the page's first words (the app's #F3D9A4 / dark #6B5326), drawn as overlays (the text is never touched). */
.nc2-pp-nudge {
  position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 1200;
  display: flex; align-items: center; gap: 4px; width: calc(100% - 32px); max-width: 640px; box-sizing: border-box;
  padding: 6px 6px 6px 18px; border-radius: 14px; background: #2A2724; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  font-family: var(--nc2-font-ui);
}
.nc2-pp-nudge__text { flex: 1 1 auto; min-width: 0; font: 400 14px/1.35 var(--nc2-font-ui); color: #F2EEE6; }
.nc2-pp-nudge__show {
  flex: 0 0 auto; min-height: 44px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; cursor: pointer;
  font: 600 13px/1 var(--nc2-font-ui); letter-spacing: 0.5px; color: #E8B95A;
}
.nc2-pp-nudge__close {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: 10px;
  background: transparent; color: #D8D2C6; cursor: pointer;
}
.nc2-pp-nudge button:hover { background: rgba(255, 255, 255, 0.08); }
.nc2-pp-nudge button:focus-visible { outline: 2px solid #E8B95A; outline-offset: 1px; }
@media (max-width: 480px) {
  .nc2-pp-nudge { flex-wrap: wrap; row-gap: 0; padding: 4px 4px 2px 16px; }
  .nc2-pp-nudge__text { flex-basis: calc(100% - 52px); }
  .nc2-pp-nudge__show { order: 3; margin-left: -12px; min-height: 40px; }
  .nc2-pp-nudge__close { order: 2; }
}
/* Behind the text, like a highlight: the layer sits inside .session-content (made its own stacking context) at z-index -1. */
html.nc2 .session-content { isolation: isolate; }
.nc2-pp-wash { position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: -1; pointer-events: none; }
.nc2-pp-wash__rect { position: absolute; border-radius: 3px; background: #F3D9A4; transition: opacity .4s ease; }
html.nc-dark .nc2-pp-wash__rect { background: #6B5326; }
.nc2-pp-wash.is-fading .nc2-pp-wash__rect { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .nc2-pp-wash__rect { transition: none; } }
/* annotations.js reads a selection across a divider with the dividers hidden for a moment (the same quote as off). */
html.nc2.nc-print-pages.nc-print-pages-measure .session-content .nc-page,
html.nc2.nc-print-pages.nc-print-pages-measure .session-content .nc-page-hy { display: none !important; }

/* ----- 12. R8: the Notebook, /sign-in, the Bible landing + book list, the error pages (boards
   https://claude.ai/artifact/1iw2mJ5Ad3pusDezYYBmuH) ----- */
.nc2-nbpage__intro, .nc2-biblepage__intro { display: flex; flex-direction: column; gap: 6px; }
.nc2-page .nc2-nbpage__sub, .nc2-page .nc2-biblepage__sub { font: 400 15px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); max-width: 62ch; }
html.nc2 .main.nc2-nbpage { max-width: 944px; }

/* Who is signed in is known only once Firebase has restored the sign-in (notebook-v2.js): nothing flashes. */
.nc2-nbpage.is-pending [data-when="out"],
.nc2-nbpage.is-in [data-when="out"],
.nc2-nbpage.is-out [data-when="in"] { display: none !important; }
.nc2-nbsignin {
  max-width: 480px; padding: 20px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-hero); box-shadow: var(--nc2-shadow-card);
}
.nc2-nbsignin__title { margin: 0; font: 600 18px/1.3 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-page .nc2-nbsignin__text { font: 400 14px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
html.nc2 .nc2-nbsignin.is-kit { padding: 0; border: 0; background: transparent; box-shadow: none; display: block; }
html.nc2 .nc2-nbsignin .ncsi {
  max-width: none; padding: 20px; box-sizing: border-box;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-hero); box-shadow: var(--nc2-shadow-card);
}
html.nc2 .nc2-nbsignin .ncsi .ncsi-title { margin: 0 0 6px; font: 600 18px/1.3 var(--nc2-font-ui); letter-spacing: 0; color: var(--nc2-ink); }
html.nc2 .nc2-nbsignin .ncsi .ncsi-benefit { margin: 0 0 14px; font-size: 14px; line-height: 1.45; color: var(--nc2-text-2); }
html.nc2 .nc2-nbsignin .ncsi-btn { min-height: 44px; border-radius: var(--nc2-r-pill); font: 600 14px/1.2 var(--nc2-font-ui); }

.nc2-nb { display: flex; flex-direction: column; gap: 14px; min-height: 220px; }
.nc2-nb__skel { display: flex; flex-direction: column; gap: 12px; }
.nc2-nb__skel i { display: block; height: 72px; border-radius: var(--nc2-r-card); background: var(--nc2-field); }
.nc2-nb__bar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.nc2-nb__search { flex: 1 1 260px; }
/* Annotations W7 (board D7): the in-reader Notebook's tabs — All · Notes · Highlights · Answers · Bookmarks, the count
   under each label; a phone (<700 px): pills that scroll sideways, the count after the label. */
.nc2-nb__tabs { flex: 0 1 460px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; padding: 3px; border-radius: var(--nc2-r-field); background: var(--nc2-field); }
.nc2-nb__tab {
  height: 46px; min-width: 0; padding: 0 4px; border: 0; border-radius: 9px; background: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; font-family: var(--nc2-font-ui); color: var(--nc2-text-2);
}
.nc2-nb__tablabel { font-size: 13px; font-weight: 500; line-height: 1.2; color: var(--nc2-text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.nc2-nb__tabcount { font-size: 11px; line-height: 1.2; color: var(--nc2-text-2); font-variant-numeric: tabular-nums; }
.nc2-nb__tab:hover .nc2-nb__tablabel { color: var(--nc2-ink); }
.nc2-nb__tab[aria-selected="true"] { background: var(--nc2-card); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); }
.nc2-nb__tab[aria-selected="true"] .nc2-nb__tablabel { font-weight: 600; color: var(--nc2-ink); }
.nc2-nb__tab[aria-selected="true"] .nc2-nb__tabcount { font-weight: 600; color: var(--nc2-gold-deep); }
html.nc2 .nc2-nb__tab:focus-visible { outline-offset: 0; }
.nc2-nb__export { padding: 0 16px; }
.nc2-nb__export:disabled { opacity: .55; cursor: default; }
.nc2-page .nc2-nb__summary { min-height: 16px; font: 500 13px/1.2 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-nb__list { display: flex; flex-direction: column; gap: 12px; }
.nc2-page .nc2-nb__empty { padding: 28px 20px; border: 1px dashed var(--nc2-bar-line); border-radius: var(--nc2-r-card); font: 400 15px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); text-align: center; }
.nc2-nbgroup { border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-card); background: var(--nc2-card); overflow: hidden; }
.nc2-nbgroup__h { margin: 0; font: inherit; }
.nc2-nbgroup__btn {
  width: 100%; min-height: 72px; padding: 12px 18px; border: 0; background: transparent; cursor: pointer;
  display: flex; align-items: center; gap: 14px; text-align: left; color: var(--nc2-ink); font: inherit;
}
.nc2-nbgroup__btn:hover { background: var(--nc2-field); }
.nc2-nbgroup__tile { font: 600 9.5px/1.1 var(--nc2-font-title); text-align: center; }
.nc2-nbgroup__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.nc2-nbgroup__title { font: 600 16px/1.25 var(--nc2-font-ui); }
.nc2-nbgroup__count { font: 400 13px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-nbgroup__chev { display: inline-flex; color: var(--nc2-text-2); transition: transform .15s ease; }
.nc2-nbgroup__btn[aria-expanded="true"] .nc2-nbgroup__chev { transform: rotate(180deg); }
.nc2-nbgroup__body { border-top: 1px solid var(--nc2-hairline); padding: 4px 18px 12px; }
.nc2-nbgroup__body[hidden] { display: none; }
.nc2-nbgroup__body:not([hidden]) { display: flex; flex-direction: column; gap: 10px; padding: 14px 18px 12px; }
/* Inside a book: a fold card per session (the Bible: per book), the newest-active one open. */
.nc2-nbsess { border: 1px solid var(--nc2-hairline); border-radius: 14px; background: var(--nc2-card); overflow: hidden; }
.nc2-nbsess__head {
  width: 100%; min-height: 50px; padding: 8px 16px; border: 0; background: none; cursor: pointer; text-align: left;
  display: flex; align-items: center; gap: 8px; font-family: var(--nc2-font-ui); color: var(--nc2-ink);
}
.nc2-nbsess__head:hover { background: var(--nc2-field); }
.nc2-nbsess__label { flex: 1 1 auto; min-width: 0; font-size: 15px; font-weight: 600; line-height: 1.3; }
.nc2-nbsess__count { flex-shrink: 0; font-size: 12.5px; font-weight: 600; color: var(--nc2-gold-deep); }
.nc2-nbsess__chev { display: inline-flex; color: var(--nc2-text-2); transition: transform .15s ease; }
.nc2-nbsess__head[aria-expanded="true"] .nc2-nbsess__chev { transform: rotate(180deg); }
.nc2-nbsess__rows[hidden] { display: none; }
.nc2-nbsess__kind { padding: 12px 16px 0; }
.nc2-nbrow { display: flex; flex-direction: column; gap: 6px; padding: 12px 16px; border-top: 1px solid var(--nc2-hairline); }
.nc2-nbsess__rows > .nc2-nbrow:first-child, .nc2-nbsess__kind + .nc2-nbrow { border-top: 0; }
.nc2-nbsess__rows > .nc2-nbrow:first-child { padding-top: 2px; }
.nc2-nbrow__link { display: flex; flex-direction: column; gap: 8px; color: var(--nc2-ink); text-decoration: none; border-radius: 6px; }
.nc2-nbrow__link:hover .nc2-nbrow__hl, .nc2-nbrow__link:hover .nc2-nbrow__bmtext { text-decoration: underline; text-decoration-color: var(--nc2-hairline); text-underline-offset: 4px; }
.nc2-nbrow__clamp { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.nc2-nbrow__clamp2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nc2-nbrow__hl { font: 400 16.5px/1.6 var(--nc2-font-title); color: var(--nc2-ink); overflow-wrap: anywhere; }
.nc2-nbrow__wash { border-radius: 2px; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.nc2-nbrow__wash--amber { background: var(--nc-amber-wash, #fef3c7); }
.nc2-nbrow__wash--sky { background: var(--nc-sky-wash, #e0f2fe); }
.nc2-nbrow__wash--rose { background: var(--nc-rose-wash, #ffe4e6); }
.nc2-nbrow__wash--emerald { background: var(--nc-emerald-wash, #d1fae5); }
.nc2-nbrow__wash--note { background: var(--nc-note-wash, #FBF5E9); }
.nc2-nbrow__quote { font: italic 400 14.5px/1.55 var(--nc2-font-title); color: var(--nc2-text-2); overflow-wrap: anywhere; }
.nc2-nbrow__note, .nc2-nbrow__answer {
  padding: 10px 12px; border: 1px solid #E3D6BA; border-radius: 10px; background: var(--nc2-card);
  font: 400 16px/1.55 var(--nc2-font-title); color: var(--nc2-ink); white-space: pre-wrap; overflow-wrap: anywhere;
}
.nc2-nbrow__q { font: 600 14px/1.4 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-nbrow--bookmark .nc2-nbrow__link { flex-direction: row; align-items: flex-start; gap: 10px; }
.nc2-nbrow__bmicon { display: inline-flex; flex-shrink: 0; padding-top: 2px; color: var(--nc2-gold-deep); }
.nc2-nbrow__bmtext { font: 400 15px/1.55 var(--nc2-font-title); color: var(--nc2-ink); overflow-wrap: anywhere; }
.nc2-nbrow__foot { display: flex; align-items: center; gap: 6px; min-height: 20px; }
.nc2-nbrow__spacer { flex: 1 1 auto; }
.nc2-nbrow__more { height: 30px; padding: 0; border: 0; background: none; cursor: pointer; font: 600 13px/1 var(--nc2-font-ui); color: var(--nc2-gold-deep); }
.nc2-nbrow__more[hidden] { display: none; }
.nc2-nbrow__meta { font: 400 12.5px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); text-align: right; }
.nc2-nbgroup__open { align-self: flex-start; min-height: 40px; display: inline-flex; align-items: center; font: 600 14px/1.2 var(--nc2-font-ui); color: var(--nc2-gold-deep); text-decoration: none; }
.nc2-nbgroup__open:hover { text-decoration: underline; }
html.nc2.nc-dark .nc2-nbrow__note, html.nc2.nc-dark .nc2-nbrow__answer { border-color: #5C4D2E; }
@media (max-width: 699px) {
  .nc2-nb__tabs { order: 3; flex: 1 1 100%; display: flex; gap: 6px; padding: 0 16px; margin: 0 -16px; border-radius: 0; background: transparent; overflow-x: auto; scrollbar-width: none; }
  .nc2-nb__tabs::-webkit-scrollbar { display: none; }
  .nc2-nb__tab { flex-shrink: 0; flex-direction: row; gap: 6px; height: 36px; padding: 0 14px; border: 1px solid var(--nc2-bar-line); border-radius: var(--nc2-r-pill); }
  .nc2-nb__tablabel, .nc2-nb__tabcount { font-size: 13.5px; overflow: visible; }
  .nc2-nb__tab[aria-selected="true"] { background: var(--nc2-navy); border-color: var(--nc2-navy); box-shadow: none; }
  .nc2-nb__tab[aria-selected="true"] .nc2-nb__tablabel, .nc2-nb__tab[aria-selected="true"] .nc2-nb__tabcount { color: var(--nc2-page); }
  /* Focus (W8): inside the pill (the row scrolls, which clips a ring outside it); the page colour on the navy pill. */
  html.nc2 .nc2-nb__tab:focus-visible { outline-offset: -4px; }
  .nc2-nb__tab[aria-selected="true"]:focus-visible { outline-color: var(--nc2-page); }
  .nc2-nbgroup__body:not([hidden]) { padding: 10px 10px 8px; gap: 8px; }
  .nc2-nbsess__head { padding: 8px 12px; }
  .nc2-nbrow { padding: 12px; }
  .nc2-nbsess__kind { padding: 12px 12px 0; }
  .nc2-nbrow__hl { font-size: 16px; }
}

/* /sign-in */
html.nc2 .main.nc2-signpage { padding-top: 56px; }
.nc2-signpage__grid { display: flex; flex-wrap: wrap; gap: 56px; align-items: flex-start; max-width: 1080px; width: 100%; margin: 0 auto; }
.nc2-signpage__hero { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.nc2-signpage__title { margin: 0; font: 600 40px/1.15 var(--nc2-font-title); color: var(--nc2-ink); letter-spacing: 0; }
.nc2-page .nc2-signpage__lede { font: 400 17px/1.55 var(--nc2-font-ui); color: var(--nc2-ink); max-width: 56ch; }
.nc2-signpage__list { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.nc2-signpage__item { display: flex; gap: 14px; align-items: flex-start; }
.nc2-signpage__ico { width: 40px; height: 40px; flex-shrink: 0; border-radius: 12px; background: var(--nc2-gold-wash); color: var(--nc2-gold-deep); display: flex; align-items: center; justify-content: center; }
.nc2-signpage__text { display: flex; flex-direction: column; gap: 2px; font: 400 14px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-signpage__text b { font: 600 15px/1.35 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-signpage__apps { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.nc2-store {
  display: inline-flex; flex-direction: column; justify-content: center; min-height: 44px; padding: 0 16px; box-sizing: border-box;
  border-radius: 10px; background: #111111; color: #FFFFFF; text-decoration: none; font: 400 10.5px/1.15 var(--nc2-font-ui);
}
.nc2-store b { font: 600 15px/1.2 var(--nc2-font-ui); }
.nc2-store:hover { background: #333333; color: #FFFFFF; }
html.nc2.nc-dark .nc2-store { background: #E8E3D9; color: #151413; }
html.nc2.nc-dark .nc2-store:hover { background: #FFFFFF; color: #151413; }
.nc2-signpage__panel { flex: 0 1 420px; min-width: min(300px, 100%); min-height: 300px; }
.nc2-page .nc2-signpage__noscript { font: 400 14px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }
html.nc2 .nc2-signpage__panel .ncsi {
  max-width: none; box-sizing: border-box; padding: 28px;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-hero); box-shadow: 0 8px 28px rgba(29, 46, 73, 0.10);
}
html.nc2.nc-dark .nc2-signpage__panel .ncsi { box-shadow: 0 8px 28px rgba(0, 0, 0, 0.4); }
html.nc2 .nc2-signpage__panel .ncsi-btn { min-height: 48px; border-radius: 12px; font: 600 15px/1.2 var(--nc2-font-ui); }

/* /bible: the translations */
.nc2-bcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: 20px; }
.nc2-bcard {
  display: flex; gap: 20px; padding: 22px; min-width: 0;
  background: var(--nc2-card); border: 1px solid var(--nc2-hairline); border-radius: var(--nc2-r-hero);
  box-shadow: 0 2px 10px rgba(29, 46, 73, 0.05); color: var(--nc2-ink); text-decoration: none;
}
.nc2-bcard:hover { border-color: var(--nc2-bar-line); color: var(--nc2-ink); }
.nc2-bcard:hover .nc2-bcard__title { text-decoration: underline; text-underline-offset: 3px; }
.nc2-bcard__cover { width: 96px; height: 144px; border-radius: 6px; font: 600 13px/1 var(--nc2-font-ui); letter-spacing: 1px; }
.nc2-bcard__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.nc2-bcard__mine { display: none; font: 600 10.5px/1 var(--nc2-font-ui); color: var(--nc2-navy); background: var(--nc2-blue-wash); border-radius: var(--nc2-r-pill); padding: 4px 8px; }
.nc2-bcard.is-mine .nc2-bcard__mine { display: inline-block; }
.nc2-bcard__title { font: 600 20px/1.25 var(--nc2-font-title); }
.nc2-bcard__desc { font: 400 14px/1.45 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bcard__meta { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 2px; font: 500 13px/1.2 var(--nc2-font-ui); color: var(--nc2-gold-deep); }
.nc2-bcard__dot { width: 3px; height: 3px; border-radius: 2px; background: var(--nc2-text-2); }
.nc2-bcard__audio { display: inline-flex; align-items: center; gap: 4px; }
.nc2-bcard__open { margin-top: auto; min-height: 40px; padding: 0 20px; pointer-events: none; }
.nc2-bcard.is-mine .nc2-bcard__open { background: var(--nc2-gold); border-color: transparent; color: var(--nc2-on-gold); }
.nc2-page .nc2-biblepage__note { font: 400 13.5px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-biblepage__note a { color: var(--nc2-gold-deep); text-decoration: underline; text-underline-offset: 2px; }

/* /bible/:tx: a translation's books */
html.nc2 .main.nc2-bbooks { padding-top: 24px; gap: 18px; }
.nc2-bbooks__head { display: flex; flex-wrap: wrap; gap: 22px; align-items: flex-end; }
.nc2-bbooks__head > .nc2-cover--tile { font: 600 11px/1 var(--nc2-font-ui); letter-spacing: 1px; }
.nc2-bbooks__text { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.nc2-bbooks__title { margin: 0; font: 600 var(--nc2-fs-page-title)/1.2 var(--nc2-font-title); color: var(--nc2-ink); letter-spacing: 0; }
.nc2-page .nc2-bbooks__desc { font: 400 15px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bbooks__tools { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.nc2-bbooks__find { flex: 0 1 420px; min-width: 0; width: 100%; }
.nc2-bbooks__jump { display: none; gap: 8px; }
.nc2-bbooks__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; align-items: start; }
.nc2-bbooks__col[hidden] { display: none; }
.nc2-bbooks__label { margin-bottom: 6px; scroll-margin-top: calc(var(--nc2-header-h) + 16px); }
.nc2-bbooks__list { list-style: none; margin: 0; padding: 0; }
.nc2-bbooks__list li[hidden] { display: none; }
.nc2-bbook {
  min-height: 46px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--nc2-hairline);
  color: var(--nc2-ink); text-decoration: none;
}
.nc2-bbook:hover .nc2-bbook__name { text-decoration: underline; text-underline-offset: 3px; }
.nc2-bbook__name { flex: 1 1 auto; font: 500 15px/1.2 var(--nc2-font-ui); }
.nc2-bbook__ch { font: 400 13px/1.2 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bbook .nc2-ico { color: var(--nc2-icon); }
.nc2-page .nc2-bbooks__none { font: 400 15px/1.5 var(--nc2-font-ui); color: var(--nc2-text-2); }
.nc2-bbooks__none[hidden] { display: none; }

/* Error pages */
html.nc2 .main.nc2-error { padding: 96px 32px; align-items: center; }
.nc2-error__box { width: 100%; max-width: 560px; display: flex; flex-direction: column; gap: 16px; }
.nc2-error__title { margin: 0; font: 600 var(--nc2-fs-page-title)/1.2 var(--nc2-font-title); color: var(--nc2-ink); letter-spacing: 0; }
.nc2-page .nc2-error__body { font: 400 16px/1.55 var(--nc2-font-ui); color: var(--nc2-ink); }
.nc2-error__search { display: flex; gap: 8px; margin-top: 8px; }
.nc2-error__search .nc2-field { flex: 1 1 auto; height: 48px; }
.nc2-error__search .nc2-btn { min-height: 48px; }
.nc2-error__acts { margin-top: 8px; }

@media (max-width: 1023px) {
  .nc2-bbooks__jump { display: flex; }
  .nc2-bbooks__cols { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .nc2-bbooks__label { scroll-margin-top: calc(var(--nc2-header-h-phone) + 16px); }
}
@media (max-width: 620px) {
  html.nc2 .main.nc2-signpage { padding-top: 16px; }
  .nc2-signpage__grid { flex-direction: column-reverse; gap: 28px; }
  .nc2-signpage__panel { flex-basis: auto; width: 100%; min-height: 260px; }
  html.nc2 .nc2-signpage__panel .ncsi { padding: 20px; }
  .nc2-signpage__title { font-size: 23px; line-height: 1.25; }
  .nc2-page .nc2-signpage__lede { font-size: 15px; }
  .nc2-bcards { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .nc2-bcard { padding: 14px; gap: 14px; border-radius: 16px; }
  .nc2-bcard__cover { width: 56px; height: 84px; border-radius: 5px; font-size: 10px; }
  .nc2-bcard__title { font-size: 17px; }
  .nc2-bcard__desc, .nc2-bcard__open { display: none; }
  html.nc2 .main.nc2-bbooks { padding-top: 8px; gap: 12px; }
  .nc2-bbooks__head { gap: 12px; align-items: center; }
  .nc2-bbooks__head > .nc2-cover { width: 44px; height: 66px; }
  .nc2-bbooks__text { flex: 1 1 0; }
  .nc2-bbooks__title { font-size: 21px; }
  .nc2-page .nc2-bbooks__desc { display: none; }
  .nc2-bbooks__head > .nc2-seg { flex: 1 1 100%; }
  .nc2-bbooks__head > .nc2-seg .nc2-seg__item { flex: 1 1 0; justify-content: center; }
  .nc2-bbooks__find { flex-basis: 100%; }
  html.nc2 .main.nc2-error { padding: 48px 16px; align-items: stretch; }
  .nc2-error__title { font-size: 26px; }
  .nc2-error__acts { flex-direction: column; }
  .nc2-error__acts .nc2-btn { width: 100%; }
  /* The Notebook (its tabs turn into pills under 700 px: "Annotations W7" above). */
  .nc2-nb__bar { gap: 8px; }
  .nc2-nb__search { flex: 1 1 0; }
  .nc2-nb__export { width: 44px; padding: 0; }
  .nc2-nb__export-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .nc2-nbgroup__btn { min-height: 64px; padding: 10px 14px; gap: 12px; }
  .nc2-nbgroup__btn .nc2-cover--xs { width: 32px; height: 48px; }
  .nc2-nbgroup__title { font-size: 15px; }
}
.nc2-signpage__title, .nc2-error__title, .nc2-bbooks__title { text-wrap: balance; }

/* R8 performance pass (no layout shift on load): while Firebase restores the sign-in (is-pending = no server session,
   so most likely signed out) the signed-out card keeps its place, hidden, at the kit panel's height; when it appears
   (or the kit replaces the fallback) nothing below moves. Apple sign-in adds a button row. */
.nc2-settings.is-pending [data-nc2-set-signin], .nc2-nbpage.is-pending [data-nc2-nb-signin] { display: flex !important; visibility: hidden; }
[data-nc2-set-signin]:not(.is-kit), [data-nc2-nb-signin]:not(.is-kit) { box-sizing: border-box; min-height: 214px; }
.nc2-kit-apple [data-nc2-set-signin]:not(.is-kit), .nc2-kit-apple [data-nc2-nb-signin]:not(.is-kit) { min-height: 268px; }
@media (max-width: 620px) {
  [data-nc2-set-signin]:not(.is-kit), [data-nc2-nb-signin]:not(.is-kit) { min-height: 233px; }
  .nc2-kit-apple [data-nc2-set-signin]:not(.is-kit), .nc2-kit-apple [data-nc2-nb-signin]:not(.is-kit) { min-height: 287px; }
}
/* The kit's page panel mounts after the bundle loads: its place is kept at its height (on phones it sits above the hero). */
.nc2-signpage__panel { min-height: 410px; }
.nc2-kit-apple .nc2-signpage__panel { min-height: 468px; }
@media (max-width: 620px) {
  .nc2-signpage__panel { min-height: 389px; }
  .nc2-kit-apple .nc2-signpage__panel { min-height: 447px; }
}

/* ----- Descriptions (plans/2026-10-13-summaries-in-place-proposal.md; partials/v2/page-desc.ejs, js/desc-v2.js): a
   series' / collection's / book's summary in its page header, closed at 5 lines (a series page's inline collection:
   3) with Read more. Renders only with SUMMARIES on, so these rules match nothing otherwise. ----- */
html.nc2 { --nc2-desc-ink: #262626; }
html.nc2.nc-dark { --nc2-desc-ink: #DDD7CC; }
.nc2-desc { --nc2-desc-lines: 5; display: flex; flex-direction: column; align-items: flex-start; max-width: 720px; margin-top: 6px; text-align: left; scroll-margin-top: calc(var(--nc2-header-h) + 16px); }
.nc2-desc--group { --nc2-desc-lines: 3; margin: 2px 0 8px; }
.nc2-desc__text { font: 400 17px/1.65 var(--nc2-font-title); color: var(--nc2-desc-ink); }
.nc2-desc--group .nc2-desc__text { font-size: 16px; }
.nc2-page .nc2-desc__text p { margin: 0; }
.nc2-page .nc2-desc__text p + p { margin-top: 0.8em; }
.nc2-desc.is-clamped:not(.is-open) .nc2-desc__text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--nc2-desc-lines); line-clamp: var(--nc2-desc-lines); overflow: hidden; }
.nc2-desc__text .bible-ref { color: var(--nc2-gold-deep); border-bottom: 1px dotted currentColor; text-decoration: none; }
.nc2-desc__text .bible-ref:hover { color: var(--nc2-ink); }
.nc2-desc__more { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0; margin-bottom: -10px; border: 0; background: none; color: var(--nc2-navy); font: 600 14px/1 var(--nc2-font-ui); cursor: pointer; }
.nc2-desc__more[hidden] { display: none; }
.nc2-desc__more:hover span { text-decoration: underline; text-underline-offset: 3px; }
.nc2-desc__more .nc2-ico { transition: transform 0.2s; }
.nc2-desc.is-open .nc2-desc__more .nc2-ico { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .nc2-desc__more .nc2-ico { transition: none; } }
.nc2-bookhero__text .nc2-desc { margin-top: 16px; }
.nc2-pagehead:has(.nc2-desc) .nc2-chips { flex-basis: 100%; } /* the chips go under the description */
@media (max-width: 620px) {
  .nc2-bookhero__text .nc2-desc { margin-top: 12px; align-self: stretch; }
  .nc2-desc__text { font-size: 16.5px; }
}

/* The reader's "About this book" (P6 "C"): a quiet last line of the contents, after the book's back matter. */
.nc2-toc__about { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 14px 0 6px; border-top: 1px solid var(--nc2-hairline); font: 500 13px/1.3 var(--nc2-font-ui); color: var(--nc2-text-2); text-decoration: none; }
.nc2-toc__about:hover { color: var(--nc2-ink); text-decoration: underline; text-underline-offset: 3px; }
/* The navy "i", filled (Steve, 2026-10-13): white italic Lora "i" on the navy disc (dark: the light navy, dark "i"). */
.nc2-toc__aboutdot { display: inline-grid; place-items: center; flex: none; width: 18px; height: 18px; border-radius: 50%; background: var(--nc2-navy); color: var(--nc2-page); font: italic 600 12.5px/1 var(--nc2-font-title); text-decoration: none; user-select: none; }