/* Fixed ambient foundation — the page itself is transparent; cards are glass. */
html:not([data-theme="dark"]):has(body.bible-v2),
html:not([data-theme="dark"]):has(body[data-page="home"]),
html:not([data-theme="dark"]):has(body .calendar-app),
html:not([data-theme="dark"]):has(body .intro){
  background:#d9e3da;
}

/* Free Bible reader: no colour sheet between Scripture and the fixed wall. */
html:not([data-theme="dark"]) body.bible-v2{background:transparent!important}
html:not([data-theme="dark"]) body.bible-v2 .ambient{
  z-index:0!important;
  background:
    radial-gradient(92% 64% at -8% 7%,rgba(255,255,252,.90),transparent 68%),
    radial-gradient(68% 56% at 105% 65%,rgba(112,151,123,.40),transparent 74%),
    radial-gradient(76% 46% at 43% 105%,rgba(213,200,232,.22),transparent 77%),
    #d6e1d7;
}
html:not([data-theme="dark"]) body.bible-v2 .ambient::before{
  inset:-13% -24%;width:auto;height:auto;border-radius:0;opacity:.50;
  background:
    repeating-linear-gradient(128deg,transparent 0 70px,rgba(40,61,47,.20) 71px 81px,transparent 82px 144px),
    linear-gradient(115deg,rgba(69,107,79,.26),transparent 58%);
  filter:blur(15px) saturate(.72);transform:rotate(-6deg) scale(1.08);
}
html:not([data-theme="dark"]) body.bible-v2 .ambient::after{
  inset:-12% -23%;width:auto;height:auto;border-radius:0;opacity:.53;
  background:
    radial-gradient(55% 6% at 90% 18%,rgba(32,65,45,.43) 0 37%,transparent 68%),
    radial-gradient(48% 5% at 81% 30%,rgba(32,65,45,.36) 0 37%,transparent 68%),
    radial-gradient(52% 7% at 95% 43%,rgba(32,65,45,.31) 0 37%,transparent 68%),
    radial-gradient(46% 6% at 78% 57%,rgba(32,65,45,.25) 0 37%,transparent 68%);
  filter:blur(18px) saturate(.68);transform:rotate(-6deg) scale(1.08);
}
html:not([data-theme="dark"]) body.bible-v2 .ambient i:nth-child(1){width:76vw;height:36vw;left:-26vw;top:63vh;background:rgba(48,88,62,.15);filter:blur(60px);opacity:.58}
html:not([data-theme="dark"]) body.bible-v2 .ambient i:nth-child(2){width:50vw;height:24vw;right:-14vw;top:11vh;background:rgba(174,202,154,.27);filter:blur(54px);opacity:.60}
html:not([data-theme="dark"]) body.bible-v2 .ambient i:nth-child(3){width:46vw;height:23vw;left:36vw;top:43vh;background:rgba(179,157,218,.16);filter:blur(58px);opacity:.52}
/* Only the reading column needs a stacking context. Never reposition the
   reader's viewport controls, backdrops, sheets or postcard root. */
html:not([data-theme="dark"]) body.bible-v2>.reader-v2{position:relative;z-index:1}
html:not([data-theme="dark"]) body.bible-v2 .reader-v2{background:transparent!important}
html:not([data-theme="dark"]) body.bible-v2 .reader-v2__header::before{display:none!important}
html:not([data-theme="dark"]) body.bible-v2 .reader-v2__header h1{text-shadow:0 1px 12px rgba(255,255,255,.48)}
html:not([data-theme="dark"]) body.bible-v2 .verse.selected{box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 8px 20px rgba(84,66,126,.10)!important}

/* Other primary tabs receive the same non-moving wall in quieter variations. */
html:not([data-theme="dark"]) body[data-page="home"],
html:not([data-theme="dark"]) body:has(.calendar-app),
html:not([data-theme="dark"]) body:has(.intro){background:transparent!important}
html:not([data-theme="dark"]) body[data-page="home"]::before,
html:not([data-theme="dark"]) body:has(.calendar-app)::before,
html:not([data-theme="dark"]) body:has(.intro)::before{
  content:"";position:fixed;z-index:0;inset:0;pointer-events:none;
  background:
    radial-gradient(92% 52% at 4% 6%,rgba(255,255,253,.92),transparent 68%),
    radial-gradient(70% 53% at 103% 61%,rgba(125,159,133,.36),transparent 74%),
    radial-gradient(76% 42% at 45% 104%,rgba(220,207,235,.18),transparent 76%),
    repeating-linear-gradient(128deg,transparent 0 104px,rgba(48,69,54,.08) 105px 113px,transparent 114px 182px),
    #d9e4da;
}
html:not([data-theme="dark"]) body[data-page="home"]::after,
html:not([data-theme="dark"]) body:has(.calendar-app)::after,
html:not([data-theme="dark"]) body:has(.intro)::after{
  content:"";position:fixed;z-index:0;inset:-10% -18%;pointer-events:none;opacity:.34;
  background:radial-gradient(53% 6% at 91% 18%,rgba(42,69,51,.37) 0 38%,transparent 69%),radial-gradient(48% 6% at 84% 33%,rgba(42,69,51,.29) 0 38%,transparent 69%),radial-gradient(51% 7% at 94% 50%,rgba(42,69,51,.21) 0 38%,transparent 69%);
  filter:blur(20px);transform:rotate(-6deg) scale(1.07);
}
html:not([data-theme="dark"]) body[data-page="home"]>.app,
html:not([data-theme="dark"]) body:has(.calendar-app)>.calendar-app,
html:not([data-theme="dark"]) body:has(.intro)>*{position:relative;z-index:1}

/* Today: remove the inherited photo layer; controls remain liquid glass. */
html:not([data-theme="dark"]) body[data-page="home"] .app{background:transparent!important}
html:not([data-theme="dark"]) body[data-page="home"] .scene{display:none!important}
html:not([data-theme="dark"]) body[data-page="home"] .brand b,
html:not([data-theme="dark"]) body[data-page="home"] .headline{color:#132520!important;text-shadow:none!important}
html:not([data-theme="dark"]) body[data-page="home"] .brand span{color:#63716d!important}
html:not([data-theme="dark"]) body[data-page="home"] .date-pill,
html:not([data-theme="dark"]) body[data-page="home"] .b27-date-button{color:#173a30!important;background:rgba(248,252,248,.48)!important;border-color:rgba(255,255,255,.72)!important;box-shadow:0 10px 26px rgba(38,71,52,.08)!important;-webkit-backdrop-filter:blur(22px) saturate(132%);backdrop-filter:blur(22px) saturate(132%)}
html:not([data-theme="dark"]) body[data-page="home"] .date-pill span,
html:not([data-theme="dark"]) body[data-page="home"] .b27-date-button span{color:#64736d!important}
html:not([data-theme="dark"]) body[data-page="home"] .reading-card{min-height:242px!important}
body[data-page="home"] .reading-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}
body[data-page="home"] .reading-actions a{display:flex;align-items:center;justify-content:center;gap:5px;min-height:39px;border:1px solid rgba(255,255,255,.76);border-radius:13px;background:rgba(255,255,255,.62);color:#22342e;font-size:12px;font-weight:700;box-shadow:inset 0 1px 0 rgba(255,255,255,.62);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
body[data-page="home"] .reading-actions a:first-child{background:rgba(255,255,255,.80)}
body[data-page="home"] .reading-actions span{font-size:16px;line-height:1}

/* Contacts should reveal the wall too, rather than a separate church photo. */
html:not([data-theme="dark"]) body:has(.intro) .app{background:transparent!important}
html:not([data-theme="dark"]) body:has(.intro) .hero{display:none!important}

/* 27.55 reader pass: the wall reaches the status area and stays completely
   still. The reader is only ink on that wall; glass is reserved for controls. */
html:not([data-theme="dark"]) body.bible-v2 .ambient{
  background:
    radial-gradient(94% 48% at 16% -8%,rgba(248,250,244,.46),transparent 69%),
    radial-gradient(68% 52% at 104% 64%,rgba(111,145,119,.28),transparent 74%),
    radial-gradient(72% 46% at 42% 106%,rgba(202,219,204,.26),transparent 78%),
    #d9e4da;
}
/* A broad, soft window frame and diagonal blind light — deliberately subtle,
   with no blurred colour veil behind the verse text. */
html:not([data-theme="dark"]) body.bible-v2 .ambient::before{
  inset:-18% -28%;
  opacity:.36;
  background:
    linear-gradient(116deg,transparent 0 42%,rgba(45,67,51,.17) 42.3% 43.4%,transparent 43.8% 100%),
    linear-gradient(116deg,transparent 0 61%,rgba(45,67,51,.12) 61.3% 62.1%,transparent 62.5% 100%),
    repeating-linear-gradient(126deg,transparent 0 88px,rgba(50,73,56,.16) 89px 97px,transparent 98px 176px);
  filter:blur(6px) saturate(.64);
  transform:rotate(-5deg) scale(1.06);
}
/* Long uneven botanical silhouettes, as a shadow cast on the same wall. */
html:not([data-theme="dark"]) body.bible-v2 .ambient::after{
  inset:-16% -24%;
  opacity:.39;
  background:
    radial-gradient(60% 5% at 100% 16%,rgba(34,66,45,.42) 0 34%,transparent 67%),
    radial-gradient(54% 5% at 88% 28%,rgba(34,66,45,.35) 0 35%,transparent 68%),
    radial-gradient(62% 6% at 100% 42%,rgba(34,66,45,.30) 0 33%,transparent 67%),
    radial-gradient(50% 5% at 83% 56%,rgba(34,66,45,.24) 0 34%,transparent 68%);
  filter:blur(10px) saturate(.68);
  transform:rotate(-8deg) scale(1.06);
}
html:not([data-theme="dark"]) body.bible-v2 .ambient i:nth-child(1){opacity:.30;filter:blur(44px)}
html:not([data-theme="dark"]) body.bible-v2 .ambient i:nth-child(2){opacity:.32;filter:blur(40px)}
html:not([data-theme="dark"]) body.bible-v2 .ambient i:nth-child(3){opacity:.16;filter:blur(44px)}

/* Sticky chapter title remains legible, but the fade has no rectangular edge. */
html:not([data-theme="dark"]) body.bible-v2 .reader-v2__header::before,
html:not([data-theme="dark"]) body.bible-v2 .reader-v2__header.is-scrolled::before{
  display:block!important;
  height:118px;
  background:linear-gradient(180deg,rgba(207,221,207,.97) 0%,rgba(207,221,207,.90) 42%,rgba(207,221,207,0) 100%)!important;
  opacity:1;
}

/* Navigation is an independent viewport layer: it never becomes part of the
   document flow or falls below the chapter, even with Safari's bottom bar. */
body.bible-v2 .nav-v2{
  position:fixed!important;
  z-index:45!important;
  left:50%!important;
  right:auto!important;
  bottom:max(10px,env(safe-area-inset-bottom))!important;
  transform:translateX(-50%)!important;
  background:linear-gradient(145deg,rgba(253,255,252,.76),rgba(238,246,239,.58))!important;
  border-color:rgba(255,255,255,.78)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 16px 36px rgba(41,67,49,.16)!important;
  -webkit-backdrop-filter:blur(26px) saturate(132%)!important;
  backdrop-filter:blur(26px) saturate(132%)!important;
}
html[data-theme="dark"] body.bible-v2 .nav-v2{
  background:linear-gradient(145deg,rgba(54,57,54,.78),rgba(35,38,36,.70))!important;
  border-color:rgba(255,255,255,.14)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 16px 36px rgba(0,0,0,.30)!important;
}
body.bible-v2 .reader-selector-v2{z-index:44!important}
body.bible-v2 .reader-more-v2{z-index:44!important}

/* 01 — Scripture itself has no intermediary surface.  Only deliberately
   selected verses and floating controls may carry material. */
html:not([data-theme="dark"]) body.bible-v2 .reader-v2,
html:not([data-theme="dark"]) body.bible-v2 .scripture-v2,
html:not([data-theme="dark"]) body.bible-v2 .scripture-v2 .verse:not(.selected){
  background:transparent!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
html:not([data-theme="dark"]) body.bible-v2 .reader-v2::before,
html:not([data-theme="dark"]) body.bible-v2 .reader-v2::after,
html:not([data-theme="dark"]) body.bible-v2 .scripture-v2::before,
html:not([data-theme="dark"]) body.bible-v2 .scripture-v2::after{content:none!important}

/* A little deeper and greener: the same fixed wall, with recognisable but
   low-contrast window and botanical shadow. */
html:not([data-theme="dark"]) body.bible-v2 .ambient{
  background:
    radial-gradient(96% 48% at 16% -8%,rgba(249,250,245,.30),transparent 68%),
    radial-gradient(72% 57% at 106% 63%,rgba(89,133,101,.38),transparent 75%),
    radial-gradient(72% 48% at 40% 106%,rgba(185,207,190,.33),transparent 78%),
    #cfddcf;
}
html:not([data-theme="dark"]) body.bible-v2 .ambient::before{
  opacity:.48;
  background:
    linear-gradient(116deg,transparent 0 40%,rgba(36,61,45,.19) 40.3% 41.7%,transparent 42.1% 100%),
    linear-gradient(116deg,transparent 0 60%,rgba(36,61,45,.15) 60.3% 61.3%,transparent 61.7% 100%),
    repeating-linear-gradient(126deg,transparent 0 84px,rgba(43,69,50,.18) 85px 94px,transparent 95px 166px);
  filter:blur(5px) saturate(.69);
}
html:not([data-theme="dark"]) body.bible-v2 .ambient::after{
  opacity:.51;
  background:
    radial-gradient(64% 5% at 100% 14%,rgba(24,59,38,.46) 0 34%,transparent 67%),
    radial-gradient(58% 5% at 87% 26%,rgba(24,59,38,.39) 0 35%,transparent 68%),
    radial-gradient(66% 6% at 100% 40%,rgba(24,59,38,.34) 0 33%,transparent 67%),
    radial-gradient(54% 5% at 82% 55%,rgba(24,59,38,.28) 0 34%,transparent 68%);
  filter:blur(8px) saturate(.72);
}

/* All reader controls share one stable vertical system above the nav. */
body.bible-v2 .nav-v2{bottom:calc(10px + env(safe-area-inset-bottom))!important}
body.bible-v2 .reader-selector-v2,
body.bible-v2 .verse-actions-v2{
  position:fixed!important;
  z-index:46!important;
  bottom:calc(var(--nav-h) + 26px + env(safe-area-inset-bottom))!important;
}
body.bible-v2 .reader-more-v2{
  position:fixed!important;
  z-index:46!important;
  bottom:calc(var(--nav-h) + var(--selector-h) + 38px + env(safe-area-inset-bottom))!important;
}

/* Controls must never inherit a transformed reader context.  In particular,
   Aa is a real, separate touch target on the right — not a clipped fragment
   at the edge of the viewport. */
body.bible-v2 .reader-more-v2{
  top:auto!important;
  left:auto!important;
  right:max(18px,calc((100vw - 670px)/2 + 16px))!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:50px!important;
  height:50px!important;
  transform:none!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  isolation:isolate;
  background:linear-gradient(145deg,rgba(253,255,252,.80),rgba(235,245,237,.61))!important;
}
body.bible-v2 .reader-selector-v2,
body.bible-v2 .verse-actions-v2,
body.bible-v2 .nav-v2{
  pointer-events:auto!important;
  touch-action:manipulation!important;
  isolation:isolate;
}
body.bible-v2 .reader-selector-v2 button,
body.bible-v2 .verse-actions-v2 button,
body.bible-v2 .nav-v2 a,
body.bible-v2 .reader-more-v2{cursor:pointer!important}
html[data-theme="dark"] body.bible-v2 .reader-more-v2{
  background:linear-gradient(145deg,rgba(58,61,58,.82),rgba(35,38,36,.72))!important;
}
/* Selection replaces, rather than overlaps, the normal controls. */
body.bible-v2 .reader-more-v2[aria-hidden="true"],
body.bible-v2 .reader-selector-v2[aria-hidden="true"]{
  display:none!important;
  pointer-events:none!important;
}

/* 04 — approved photographed wall texture is the sole stationary foundation.
   No transformed ancestor, scrolling colour veil or extra botanical layers. */
html:has(body.bible-v2),html:has(body[data-page="home"]),html:has(.calendar-app){background:#cbd8c9!important}
html[data-theme="dark"]:has(body.bible-v2),html[data-theme="dark"]:has(body[data-page="home"]),html[data-theme="dark"]:has(.calendar-app){background:#141716!important}
body.bible-v2,body[data-page="home"],body:has(.calendar-app){background:transparent!important}
body.bible-v2 .ambient,body[data-page="home"]::before,body:has(.calendar-app)::before{
  content:"";position:fixed!important;inset:0!important;z-index:0!important;
  width:auto!important;height:auto!important;border-radius:0!important;
  pointer-events:none!important;transform:none!important;opacity:1!important;
  background:#cbd8c9 url('/assets/ambient/bible-wall.webp') center center / cover no-repeat!important;
  filter:none!important;
}
body[data-page="home"]::before{background-image:url('/assets/ambient/today-wall.webp')!important}
body:has(.calendar-app)::before{background-image:url('/assets/ambient/calendar-wall.webp')!important}
body.bible-v2 .ambient::before,body.bible-v2 .ambient::after,
body.bible-v2 .ambient i,body[data-page="home"]::after,body:has(.calendar-app)::after{display:none!important}
html[data-theme="dark"] body.bible-v2 .ambient,
html[data-theme="dark"] body[data-page="home"]::before,
html[data-theme="dark"] body:has(.calendar-app)::before{filter:grayscale(.85) brightness(.14)!important}
body.bible-v2>.reader-v2,body[data-page="home"]>.app,body:has(.calendar-app)>.calendar-app{position:relative;z-index:1;background:transparent!important}
body[data-page="home"] .scene{display:none!important}
body[data-page="home"] .app::before,body[data-page="home"] .app::after{display:none!important}
body.bible-v2 .reader-v2,body.bible-v2 .scripture-v2,body.bible-v2 .verse:not(.selected){background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.bible-v2 .reader-v2__header,body.bible-v2 .reader-v2__header.is-scrolled{background:transparent!important;border:0!important;box-shadow:none!important}
/* A feathered optical blur ONLY while sticky; no colour strip behind title. */
html[data-theme] body.bible-v2 .reader-v2__header::before{display:none!important}
html[data-theme] body.bible-v2 .reader-v2__header.is-scrolled::before{
  display:block!important;inset:0 0 auto!important;height:100%!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  -webkit-backdrop-filter:blur(8px)!important;backdrop-filter:blur(8px)!important;
  -webkit-mask-image:linear-gradient(#000 0%,#000 48%,transparent 100%);
  mask-image:linear-gradient(#000 0%,#000 48%,transparent 100%);
}

/* Clear glass: restrained tint, light rim and inner optical edge.  Decorative
   highlights never intercept touch and never change existing control sizes. */
body.bible-v2{--clear-glass:rgba(248,252,248,.29);--glass-rim:rgba(255,255,255,.83);--glass-glint:rgba(255,255,255,.78)}
html[data-theme="dark"] body.bible-v2{--clear-glass:rgba(40,43,41,.40);--glass-rim:rgba(255,255,255,.27);--glass-glint:rgba(255,255,255,.26)}
html[data-theme] body.bible-v2 .nav-v2,html[data-theme] body.bible-v2 .reader-selector-v2,
html[data-theme] body.bible-v2 .reader-more-v2,html[data-theme] body.bible-v2 .verse-actions-v2{
  background:var(--clear-glass)!important;border:1px solid var(--glass-rim)!important;
  box-shadow:inset 0 1px 1px var(--glass-glint),inset 1px 0 1px rgba(255,255,255,.27),inset 0 -1px 2px rgba(73,91,77,.18),0 8px 24px rgba(24,40,30,.12)!important;
  -webkit-backdrop-filter:blur(10px) saturate(125%)!important;
  backdrop-filter:blur(10px) saturate(125%)!important;
}
body.bible-v2 .nav-v2::after,body.bible-v2 .reader-selector-v2::after,
body.bible-v2 .reader-more-v2::after,body.bible-v2 .verse-actions-v2::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(155deg,rgba(255,255,255,.24),transparent 24% 72%,rgba(255,255,255,.10));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.13);
}
body.bible-v2 .nav-v2 a,body.bible-v2 .reader-selector-v2 button,body.bible-v2 .verse-actions-v2 button{position:relative;z-index:1}
/* Shared nav must stay out of the body-child stacking rules above. */
body[data-page="home"]>.nav,body:has(.calendar-app)>.calendar-nav{
  position:fixed!important;z-index:45!important;
  background:rgba(248,252,248,.29)!important;border-color:rgba(255,255,255,.83)!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.78),inset 0 -1px 2px rgba(73,91,77,.18),0 8px 24px rgba(24,40,30,.12)!important;
  -webkit-backdrop-filter:blur(10px) saturate(125%)!important;backdrop-filter:blur(10px) saturate(125%)!important;
}
html[data-theme="dark"] body[data-page="home"]>.nav,html[data-theme="dark"] body:has(.calendar-app)>.calendar-nav{background:rgba(40,43,41,.40)!important;border-color:rgba(255,255,255,.27)!important}
html[data-theme] body.bible-v2 .settings-panel-v2{
  background:rgba(248,252,248,.58)!important;border-color:rgba(255,255,255,.83)!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.78),0 12px 32px rgba(24,40,30,.16)!important;
  -webkit-backdrop-filter:blur(14px) saturate(125%)!important;backdrop-filter:blur(14px) saturate(125%)!important;
}
html[data-theme="dark"] body.bible-v2 .settings-panel-v2{background:rgba(40,43,41,.64)!important;border-color:rgba(255,255,255,.27)!important}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body.bible-v2{--clear-glass:rgba(248,252,248,.88)}
  html[data-theme="dark"] body.bible-v2{--clear-glass:rgba(40,43,41,.92)}
}

/* 05 — soften only the fixed Bible wall, never the Scripture.  Blending into
   the existing html base reduces both the grain and the shadow contrast. */
html[data-theme] body.bible-v2 .ambient{opacity:.66!important}
/* Four existing touch targets share one capsule and one material. */
body.bible-v2 .reader-selector-v2{
  width:min(360px,calc(100vw - 36px))!important;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr) minmax(0,1.1fr) minmax(0,.9fr)!important;
}
html[data-theme] body.bible-v2 .reader-selector-v2 .reader-more-v2{
  position:relative!important;inset:auto!important;bottom:auto!important;
  width:100%!important;height:100%!important;min-width:0!important;
  transform:none!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  z-index:1!important;isolation:auto;
}
body.bible-v2 .reader-selector-v2 .reader-more-v2::after{content:none!important}

/* 06 — compact Bible capsule; calmer wall in LIGHT only. */
body.bible-v2 .reader-selector-v2{
  width:min(300px,calc(100vw - 36px))!important;
}
html:not([data-theme="dark"]) body.bible-v2 .ambient{opacity:.48!important}

/* 07 — narrower four-button capsule; tighter spacing between verses only. */
body.bible-v2 .reader-selector-v2{
  width:min(270px,calc(100vw - 36px))!important;
}
body.bible-v2 .scripture-v2 .verse{margin-bottom:10px}

/* 09 — four primary tabs: semantic colours and ONE centred SVG per item. */
html[data-theme] [data-b27-nav]{
  position:fixed!important;z-index:45!important;
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
html[data-theme] [data-b27-nav]>a{
  display:grid!important;grid-template-rows:32px 16px!important;
  align-items:center!important;justify-items:center!important;gap:2px!important;
  min-width:0!important;text-decoration:none!important;
}
html[data-theme] [data-b27-nav]>a>i{
  position:relative!important;display:flex!important;
  align-items:center!important;justify-content:center!important;
  width:34px!important;height:32px!important;margin:0!important;padding:0!important;
  font-size:0!important;line-height:1!important;
  transform:none!important;border-radius:12px!important;
  color:var(--nav-accent)!important;
}
html[data-theme] [data-b27-nav]>a>i::before,
html[data-theme] [data-b27-nav]>a>i::after{content:none!important;display:none!important}
html[data-theme] [data-b27-nav]>a>i>svg{
  display:block!important;position:static!important;width:22px!important;height:22px!important;
  margin:0!important;flex:none!important;transform:none!important;
  color:var(--nav-accent)!important;opacity:1!important;
}
html[data-theme] [data-b27-nav]>a>.nav-label{
  display:block!important;width:auto!important;height:auto!important;margin:0!important;
  padding:0!important;background:none!important;box-shadow:none!important;
  font-size:10px!important;line-height:16px!important;white-space:nowrap!important;
}
html[data-theme] [data-b27-nav]>.active>i{
  background:rgba(255,255,255,.82)!important;
  box-shadow:0 3px 10px rgba(28,45,35,.10)!important;
}
html[data-theme="dark"] [data-b27-nav]>.active>i{
  background:rgba(255,255,255,.13)!important;
}
[data-b27-nav]>[data-nav-item="today"]{--nav-accent:#f4c62b}
[data-b27-nav]>[data-nav-item="bible"]{--nav-accent:#8058d4}
[data-b27-nav]>[data-nav-item="calendar"]{--nav-accent:#ef4056}
[data-b27-nav]>[data-nav-item="contacts"]{--nav-accent:#84c83d}

/* 10 — the wall belongs to the root viewport, not to a safe-area content box.
   One fixed image only. Content safe-area padding remains untouched. */
html:has(body.bible-v2){--wall-image:url('/assets/ambient/bible-wall.webp');--wall-opacity:.48}
html:has(body[data-page="home"]){--wall-image:url('/assets/ambient/today-wall.webp');--wall-opacity:1}
html:has(body .calendar-app){--wall-image:url('/assets/ambient/calendar-wall.webp');--wall-opacity:1}
html:has(body.bible-v2),html:has(body[data-page="home"]),html:has(body .calendar-app){
  --wall-filter:none;
}
html[data-theme="dark"]:has(body.bible-v2){--wall-opacity:.66}
html[data-theme="dark"]:has(body.bible-v2),
html[data-theme="dark"]:has(body[data-page="home"]),
html[data-theme="dark"]:has(body .calendar-app){
  --wall-filter:grayscale(.85) brightness(.14);
}
html:has(body.bible-v2)::before,
html:has(body[data-page="home"])::before,
html:has(body .calendar-app)::before{
  content:"";position:fixed;z-index:0;pointer-events:none;
  top:calc(-24px - env(safe-area-inset-top,0px));
  right:0;left:0;bottom:calc(-24px - env(safe-area-inset-bottom,0px));
  background-image:var(--wall-image);background-position:center;background-size:cover;
  background-repeat:no-repeat;opacity:var(--wall-opacity);filter:var(--wall-filter);
}
/* Retire the previous image so it cannot start again below the status bar. */
html[data-theme] body.bible-v2 .ambient,
html[data-theme] body[data-page="home"]::before,
html[data-theme] body:has(.calendar-app)::before{display:none!important}
html[data-theme] body.bible-v2,
html[data-theme] body[data-page="home"],
html[data-theme] body:has(.calendar-app){background:transparent!important}
/* Contacts retains its existing design; only its fixed ambient extent changes. */
html[data-theme] body:has(.intro):not([data-page="home"])::before{
  top:calc(-24px - env(safe-area-inset-top,0px))!important;
  bottom:calc(-24px - env(safe-area-inset-bottom,0px))!important;
}

/* 12 — soften the wallpaper itself at Safari's native chrome boundary.
   No extra surface, layout change or scrolling background. The browser-owned
   status bar may remain a solid colour; this makes the webpage join that colour
   continuously. It does not make iOS render an image in the native status bar. */
html:has(body.bible-v2)::before,
html:has(body[data-page="home"])::before,
html:has(body .calendar-app)::before{
  -webkit-mask-image:linear-gradient(to bottom,
    transparent calc(24px + env(safe-area-inset-top,0px)),
    #000 calc(114px + env(safe-area-inset-top,0px)),
    #000 calc(100% - 114px - env(safe-area-inset-bottom,0px)),
    transparent calc(100% - 24px - env(safe-area-inset-bottom,0px)));
  mask-image:linear-gradient(to bottom,
    transparent calc(24px + env(safe-area-inset-top,0px)),
    #000 calc(114px + env(safe-area-inset-top,0px)),
    #000 calc(100% - 114px - env(safe-area-inset-bottom,0px)),
    transparent calc(100% - 24px - env(safe-area-inset-bottom,0px)));
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}