/* Shared additive mobile resilience layer. Existing page structures and content remain intact. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-width: 0; }
img, svg, video, canvas { height: auto; }
.editorial-expansion { padding-top: 4rem; border-top: 1px solid rgba(118,38,49,.18); }
.editorial-expansion > h2 { font: 500 clamp(2.4rem,5vw,4.5rem)/1.05 Georgia,serif; color: #762631; max-width: 850px; margin: .75rem 0 1.25rem; }
.blog-footer p { margin: .35rem 0; }
.blog-footer p:nth-of-type(3) { font-size: .72rem; color: #d7aeb4; letter-spacing: .04em; }
:where(a, button, input, select, textarea, summary, [role="button"]):focus-visible {
  outline: 3px solid #c58b2a;
  outline-offset: 3px;
}
@media (max-width: 760px) {
  html { scroll-padding-top: 78px; overflow-x: clip; }
  body { width: 100%; max-width: 100%; overflow-x: clip; padding-bottom: env(safe-area-inset-bottom); }
  main, section, article, header, footer, nav, aside, form, fieldset { min-width: 0; }
  .section-shell, .shell, .container, .wrap, .inner, .threshold-inner {
    width: min(100% - 2rem, 1180px) !important;
    max-width: 100% !important;
    margin-inline: auto !important;
  }
  .site-header, .blog-header, .reader-nav, .book-nav, body > header {
    max-width: 100vw;
  }
  body > header { flex-wrap: wrap; gap: .65rem; padding-inline: 1rem !important; }
  body > header nav { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
  body > header nav a { flex: 0 0 auto; white-space: nowrap; }
  .site-header { min-height: 70px; height: auto; padding-block: .65rem; }
  .site-header nav.open { max-height: calc(100dvh - 70px); overflow-y: auto; overscroll-behavior: contain; }
  .brand { min-width: 0; max-width: calc(100% - 72px); }
  .brand > span:last-child { min-width: 0; }
  .brand strong, .brand small { overflow-wrap: normal; }

  /* Keep the complete journal artwork inside the mobile canvas. */
  .hero { min-height: auto !important; padding-top: 2.25rem !important; padding-bottom: 3rem !important; gap: 1.5rem !important; }
  .hero-copy { min-width: 0; }
  .hero-art { min-height: 0 !important; padding: 1.5rem 0 2.5rem !important; overflow: visible; isolation: isolate; }
  .hero-art img, .hero-art .live-journal-cover {
    width: min(82vw, 360px) !important;
    max-width: calc(100vw - 3rem) !important;
    height: auto !important;
    margin: 0 auto !important;
    transform: none !important;
  }
  .hero-art .book-shadow { width: min(78vw, 340px) !important; height: 88% !important; max-width: calc(100vw - 3.5rem); transform: rotate(-2deg) !important; }
  .hero-art .orbit { max-width: calc(100vw - 2rem); max-height: calc(100vw - 2rem); }

  img, picture, video, canvas, iframe { max-width: 100% !important; }
  img { object-position: center; }
  h1 { font-size: clamp(2.4rem, 12vw, 3.5rem) !important; }
  h2 { font-size: clamp(2rem, 9vw, 3rem); }
  p, li, label, summary, td, th { overflow-wrap: anywhere; }
  a, button { overflow-wrap: break-word; }
  pre, code { max-width: 100%; overflow-x: auto; }

  .hero-actions, .actions, .shelf-actions, .facilitator-actions, .conversion-actions, .portal-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .75rem !important;
    width: 100%;
  }
  .hero-actions > *, .actions > *, .shelf-actions > *, .facilitator-actions > *, .conversion-actions > *, .portal-actions > * {
    width: 100% !important;
    max-width: 100%;
  }
  .reader-controls { display: flex !important; flex-wrap: wrap; gap: .45rem; width: auto; }
  .reader-controls button { flex: 0 0 auto; }
  a.button, button, [role="button"], input, select, textarea, summary { min-height: 44px; }
  input, select, textarea { max-width: 100%; font-size: 16px !important; }
  textarea { min-height: 150px; }

  .grid, .book-grid, .resource-grid, .feature-grid, .faith-grid, .portal-library-grid, .portal-resource-grid,
  .editorial-grid, .rotation-grid, .timeline, .principles, .pathways, .standards-grid, .digital-benefits,
  .shelf-grid, .shelf-current, .journal-app, .interest-form, .gather-grid, .may-header, .intro-grid,
  .faith-reader-path, .feature, .article-layout, .open-door, .access-path-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .resource-hero, .resource-search, .download-grid, .use-grid, .personal-export {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .feature, .faith-reader-path { gap: 1.5rem !important; }
  .feature img, .faith-reader-path img { width: 100%; max-height: 70dvh; object-fit: cover; }
  .book-card, .portal-library-grid article, .resource-grid article { min-height: 0 !important; }
  .prompt-list, .toc { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
  .prompt-button, .toc a { flex: 0 0 auto; }
  .facts, .format-row, .reader-meta, .chapter-nav { display: flex; flex-wrap: wrap; gap: .5rem; }
  .cover, .cover img, .book-cover, .book-cover img { max-width: 100% !important; height: auto !important; }
  table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  dialog, .policy-panel, .reader-dialog {
    width: calc(100vw - 1rem) !important;
    max-width: calc(100vw - 1rem) !important;
    max-height: calc(100dvh - 1rem) !important;
    margin: auto !important;
    overflow: auto !important;
  }
  .reader-toolbar { position: sticky; top: 0; z-index: 3; }
  .reader-page, .chapter, .article-body, .offline-article { max-width: 100%; padding-inline: 1rem !important; }

  /* Editorial pages remain easy to scan and operate with one hand. */
  .blog-header {
    height: auto !important;
    min-height: 0 !important;
    align-items: center !important;
    gap: .7rem;
    padding: .75rem 1rem calc(.75rem + env(safe-area-inset-top)) !important;
  }
  .blog-header .blog-brand {
    flex: 1 0 100%;
    max-width: 100% !important;
    text-align: center;
  }
  .blog-header nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    flex: 1 1 100%;
    width: 100%;
    max-width: 100% !important;
    gap: .4rem !important;
    overflow: visible !important;
    padding: 0;
    text-align: center !important;
  }
  .blog-header nav a {
    min-width: 0;
    width: 100%;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .55rem .7rem;
    border: 1px solid rgba(118,38,49,.16);
    background: rgba(255,255,255,.78);
    white-space: normal !important;
    line-height: 1.25;
  }
  .blog-header nav a:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .article-hero, .blog-index-hero { padding: 3.5rem 1rem !important; }
  .article-hero h1, .blog-index-hero h1 { font-size: clamp(2.45rem, 12vw, 4rem) !important; overflow-wrap: break-word; }
  .article-dek { font-size: 1rem; }
  .article-layout { width: min(100% - 1.25rem, 1120px) !important; gap: 1.5rem !important; }
  .article-body { font-size: 1.02rem !important; line-height: 1.7; }
  .article-body h2 { scroll-margin-top: 9rem; }
  .answer-box, .practice-box, .article-cta { margin-inline: 0 !important; padding: 1.25rem !important; }
  .toc {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
    gap: .45rem;
    overflow: visible !important;
    padding: 1rem !important;
  }
  .toc strong { display: block !important; width: 100%; }
  .toc a {
    display: flex !important;
    min-width: 0;
    width: 100%;
    min-height: 44px;
    align-items: center;
    margin: 0 !important;
    padding: .65rem .75rem;
    border: 1px solid rgba(118,38,49,.16);
    background: #fff;
    white-space: normal !important;
    line-height: 1.35;
  }
  .blog-index, .related { width: min(100% - 1.25rem, 1120px) !important; margin-block: 3rem !important; }
  .post-card { min-height: 0 !important; padding: 1.25rem !important; }
  .editorial-expansion { padding-top: 2rem; border-top: 1px solid rgba(118,38,49,.18); }
  iframe { width: 100% !important; }
  audio { width: 100%; max-width: 100%; }
  .catalogue-actions, .catalogue-grid, .package-grid { grid-template-columns: minmax(0, 1fr) !important; }

  /* The settings control follows the document on mobile, so it cannot cover a CTA. */
  .spark-cookie-settings {
    position: static !important;
    display: flex;
    width: max-content;
    max-width: calc(100% - 2rem);
    min-height: 44px;
    margin: 1rem auto calc(1rem + env(safe-area-inset-bottom)) !important;
    align-items: center;
    justify-content: center;
  }
  .spark-cookie-settings[hidden] { display: none !important; }
  .spark-cookie-banner { max-width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); overflow: auto; }
  .spark-cookie-actions { position: sticky; bottom: 0; background: rgba(255,250,248,.98); }
  .mobile-portal-nav { bottom: calc(.45rem + env(safe-area-inset-bottom)); }
  .portal-body .spark-cookie-settings {
    position: fixed !important;
    z-index: 95;
    right: 1rem;
    bottom: calc(5.35rem + env(safe-area-inset-bottom)) !important;
    width: auto;
    max-width: calc(100vw - 2rem);
    min-height: 42px;
    margin: 0 !important;
    padding: .65rem .9rem;
    border-radius: 999px;
    background: #fffaf7;
    box-shadow: 0 10px 30px rgba(45,16,22,.16);
    font-size: .68rem;
  }
  .portal-body .spark-cookie-settings[hidden] { display: none !important; }
}

@media (max-width: 390px) {
  .brand-mark { width: 36px; height: 36px; flex: 0 0 36px; }
  .brand strong { font-size: .76rem; }
  .brand small { font-size: .46rem; letter-spacing: .18em; }
  .hero-art img, .hero-art .live-journal-cover { width: min(86vw, 330px) !important; }
  .quote-stage { grid-template-columns: 38px minmax(0,1fr) 38px !important; }
}

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

/* Complete responsive application pass: public, reader, portal, community, and admin surfaces. */
:where(.reader-workspace, .messages-shell, .community-layout, .portal-journal, .formation-grid, .faith-reading-workspace, .catalogue-grid, .download-grid, .table-wrap) {
  min-width: 0;
}
:where(.table-wrap, .admin-table, .legal-shell table) { max-width: 100%; }

@media (max-width: 1024px) {
  :where(.portal-hero, .faith-reading-hero, .formation-transfer, .professional-calling-entry, .bvl-library-feature, .bvl-shelf-entry) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  :where(.portal-hero, .faith-reading-hero, .formation-transfer) > img {
    width: min(100%, 620px) !important;
    min-height: 0 !important;
    max-height: 72dvh;
    margin-inline: auto;
  }
  :where(.formation-overview, .faith-reading-paths, .portal-weeks, .portal-resource-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .reader-header, .messages-header, .resource-header, .group-nav, .community-top, .catalogue-header {
    padding-left: max(1rem, env(safe-area-inset-left)) !important;
    padding-right: max(1rem, env(safe-area-inset-right)) !important;
  }
}

@media (max-width: 760px) {
  :root { --mobile-control-bar: calc(76px + env(safe-area-inset-bottom)); }
  html, body { min-width: 320px; }
  :where(main, section, article, aside, form, fieldset, div) { min-width: 0; }

  :where(.portal-header, .messages-header, .resource-header, .group-nav, .community-top, .catalogue-header, .reader-header) {
    padding-top: max(.65rem, env(safe-area-inset-top)) !important;
  }
  :where(.portal-heading, .section-heading, .group-section-head, .formation-heading, .conversation-head, .card-head, .top) { max-width: 100%; }
  :where(.formation-overview, .faith-reading-paths, .portal-weeks, .portal-resource-grid, .status-patterns, .community-grid, .group-feature-grid, .group-flow-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  :where(.formation-form, .review-row, .feedback-layout, .feedback-two, .group-form, .group-form fieldset, .spec-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  :where(.formation-form .full, .group-form label, .group-form fieldset > *, .feedback-two > *) { grid-column: auto !important; }
  :where(.form-actions, .guardian-actions, .group-form-actions, .community-toolbar, .composer-actions, .conversation-tools, .direct-setup > div) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    gap: .65rem !important;
  }
  :where(.form-actions, .guardian-actions, .group-form-actions, .community-toolbar, .composer-actions, .conversation-tools, .direct-setup > div) > * {
    width: 100% !important;
    max-width: 100%;
  }
  :where(.table-wrap, .admin-table, .legal-shell table) {
    display: block !important;
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  :where(.table-wrap table, .admin-table) { min-width: 680px; }
  :where(.legal-shell table) { min-width: 560px; }

  .messages-body { padding-bottom: var(--mobile-control-bar); }
  .messages-body .messages-shell { min-height: calc(100dvh - 66px - var(--mobile-control-bar)); }
  .messages-body .channel-sidebar { bottom: var(--mobile-control-bar) !important; }
  .messages-body .composer {
    bottom: var(--mobile-control-bar) !important;
    margin-bottom: 0;
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
  }
  .messages-header { min-height: 66px; height: auto !important; gap: .55rem; }
  .messages-brand { min-width: 0; gap: .55rem; }
  .messages-brand > span:last-child { min-width: 0; }
  .messages-brand strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .messages-header-actions { flex: 0 0 auto; }
  .conversation { width: 100%; padding: 1rem; }
  .message { max-width: 100%; }
  .message-head, .message-actions, .composer-meta, .reply-banner { min-width: 0; flex-wrap: wrap; }
  .message-actions button { min-height: 44px; }

  .group-community-shell { padding-bottom: var(--mobile-control-bar); }
  .community-top { align-items: stretch !important; flex-direction: column; }
  .community-top > div { display: grid; grid-template-columns: 1fr; gap: .55rem; }
  .community-top .group-button { width: 100%; }
  .community-sidebar nav {
    display: flex !important;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding-bottom: .45rem;
  }
  .community-sidebar nav > * { flex: 0 0 auto; }
  .community-card header { flex-direction: column; }
  .group-nav { flex-wrap: wrap; }
  .group-nav-links {
    order: 3;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
  .group-nav-links a { flex: 0 0 auto; white-space: nowrap; }

  .portal-journal aside, .formation-tabs, .prompt-list {
    display: flex !important;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }
  .portal-journal aside button, .formation-tabs button, .prompt-list > * { flex: 0 0 auto; min-height: 48px; }
  .portal-journal article { padding: 1.25rem !important; }
  .portal-journal textarea { min-height: 42dvh; }
  .analytics-chart { max-width: 100%; overflow-x: auto; padding-bottom: 2rem; }
  .analytics-chart .chart-bar { min-width: 42px; }

  .top, .card-head, .formation-record header {
    display: flex !important;
    flex-direction: column;
    align-items: stretch !important;
    gap: .8rem !important;
  }
  .top .signout, .card-head .open, .formation-record header button { width: 100%; }
  .details { grid-template-columns: minmax(0, 1fr) !important; }
  .files a, .message a, .card a { overflow-wrap: anywhere; }

  .catalogue-card dl { grid-template-columns: minmax(0, 1fr) !important; }
  .visual-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .hero-mosaic, .package-images { max-width: 100%; }

  /* The illustrated flipbook keeps one complete page and every control inside the iPhone viewport. */
  .flipbook-body { overflow: hidden !important; padding: 0 !important; }
  .flipbook-body .reader-header {
    min-height: calc(60px + env(safe-area-inset-top));
    height: auto !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    flex-wrap: nowrap !important;
    padding: max(.55rem, env(safe-area-inset-top)) max(.55rem, env(safe-area-inset-right)) .55rem max(.55rem, env(safe-area-inset-left)) !important;
  }
  .flipbook-body .reader-brand { min-width: 0; width: auto; }
  .flipbook-body .reader-brand > span { min-width: 0; }
  .flipbook-body .reader-brand strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .flipbook-body .reader-header nav { min-width: 0; overflow: visible; }
  .flipbook-body .reader-header nav a { min-height: 44px; display: inline-flex; align-items: center; }
  .flipbook-body .reader-workspace {
    height: calc(100dvh - 60px - env(safe-area-inset-top));
    min-height: 0;
    grid-template-rows: minmax(0, 1fr) auto;
  }
  .flipbook-body .book-stage { min-height: 0; overflow: hidden; touch-action: pan-y; }
  .flipbook-body .book-frame { max-height: 100%; }
  .flipbook-body .page-leaf {
    width: min(92vw, calc((100dvh - 60px - env(safe-area-inset-top) - 108px - env(safe-area-inset-bottom)) * .6654));
    max-height: calc(100dvh - 60px - env(safe-area-inset-top) - 108px - env(safe-area-inset-bottom));
  }
  .flipbook-body .reader-controls {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center;
    width: 100%;
    gap: .45rem !important;
    padding: .5rem max(.5rem, env(safe-area-inset-right)) max(.5rem, env(safe-area-inset-bottom)) max(.5rem, env(safe-area-inset-left));
  }
  .flipbook-body .progress-track { grid-column: 1 / -1; grid-row: 1; width: 100%; }
  .flipbook-body .page-controls { grid-column: 1; grid-row: 2; min-width: 0; }
  .flipbook-body .view-controls { grid-column: 2; grid-row: 2; min-width: 0; }
  .flipbook-body .reader-controls button { min-width: 44px; min-height: 44px; }
  .flipbook-body .edge-control { min-width: 48px; min-height: 76px; }
  .flipbook-body .thumbnail-dialog {
    width: calc(100vw - 1rem) !important;
    height: calc(100dvh - 1rem) !important;
    max-height: calc(100dvh - 1rem) !important;
  }
  .flipbook-body .thumbnail-dialog header { padding-top: max(1rem, env(safe-area-inset-top)); }
}

@media (max-width: 430px) {
  .visual-shelf { grid-template-columns: minmax(0, 1fr) !important; }
  .visual-shelf figcaption { min-height: 0 !important; }
  .flipbook-body .reader-brand small { display: none; }
  .flipbook-body .reader-header nav a { padding-inline: .55rem; font-size: .56rem; }
  .flipbook-body .thumbnail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-height: 520px) and (orientation: landscape) {
  .flipbook-body .reader-header { min-height: 52px; padding-block: .3rem !important; }
  .flipbook-body .reader-workspace { height: calc(100dvh - 52px); }
  .flipbook-body .page-leaf { width: min(60vw, calc((100dvh - 112px) * .6654)); }
  .flipbook-body .reader-controls { padding-block: .3rem; }
  .flipbook-body .reader-controls button { min-height: 40px; }
}