/* HTNS r73 — aligned login action tiles and smaller Songbook title; artwork is decorative only.
   New immutable filename intentionally bypasses older cache-first workers.
   Authentication, install availability and Songbook logic are not changed. */
html.htns-theme-v234.login-screen-active[data-theme="light"],
html.htns-theme-v234.login-screen-active[data-theme="light"] body,
html.htns-theme-v234.login-screen-active[data-theme="light"] body #app {
  background:#eaf5fd !important;
  background-image:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] {
  position:relative !important;
  inset:auto !important;
  isolation:isolate !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:0 !important;
  width:100% !important;
  height:100vh !important;
  height:100svh !important;
  min-height:100svh !important;
  max-height:100svh !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-sizing:border-box !important;
  background:#eaf5fd !important;
  background-image:none !important;
  color:#0d3267 !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior-y:contain !important;
  overflow-anchor:none !important;
  -webkit-overflow-scrolling:touch !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"].hidden { display:none !important; }
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]:not(.hidden) { display:flex !important; }
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::before, html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::after {content:none !important;display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] > .mark, html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] > #gTitle, html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] > #gSub, html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] > #gHint, html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #lblName {
  position:absolute !important; width:1px !important;height:1px !important;
  overflow:hidden !important;clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;white-space:nowrap !important;
  margin:0 !important;padding:0 !important;border:0 !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #lblName::before, html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #lblName::after {content:none !important;display:none !important;}
/* Only y=0..626 of the 850x1740 original is visible: logo/sky, never baked UI. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71 {
  display:block !important;position:relative !important;flex:0 0 auto !important;
  width:100% !important;aspect-ratio:850 / 626;
  margin:0 !important;padding:0 !important;overflow:hidden !important;
  background:#c3e0fa url('/htns-login-artwork-v302r71.jpg') center top / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel {
  box-sizing:border-box !important;position:relative !important;inset:auto !important;
  z-index:5 !important;display:flex !important;flex-direction:column !important;
  align-items:stretch !important;justify-content:flex-start !important;
  flex:0 0 auto !important;gap:12px !important;
  width:90.7% !important;max-width:none !important;
  height:auto !important;min-height:0 !important;max-height:none !important;
  margin:0 4.65% !important;padding:18px 14px 14px !important;
  border:1px solid #d6e5f2 !important;border-radius:24px !important;
  background:#fff !important;background-image:none !important;
  opacity:1 !important;transform:none !important;
  box-shadow:0 7px 22px rgba(23,70,107,.08) !important;
  overflow:visible !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel::before, html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel::after {content:none !important;display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-welcome-r71 {display:flex !important;flex-direction:column !important;gap:4px !important;margin:0 !important;padding:0 !important;text-align:center !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #htnsLoginWelcomeR71 {
  display:block !important;margin:0 !important;padding:0 !important;
  font:800 clamp(25px,6.8vw,33px)/1.12 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  color:#0b2e66 !important;-webkit-text-fill-color:#0b2e66 !important;
  letter-spacing:-.03em !important;text-shadow:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #htnsLoginHelpR71 {
  display:block !important;margin:0 !important;padding:0 !important;
  font:500 clamp(12px,3.3vw,16px)/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  color:#637994 !important;-webkit-text-fill-color:#637994 !important;
  letter-spacing:0 !important;opacity:1 !important;text-shadow:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel #nameWrap.login-select-wrap {
  position:relative !important;inset:auto !important;display:block !important;
  flex:0 0 auto !important;width:100% !important;max-width:none !important;min-width:0 !important;
  height:auto !important;min-height:0 !important;margin:0 !important;padding:0 !important;
  background:transparent !important;border:0 !important;box-shadow:none !important;
  overflow:visible !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #nameSelect {position:absolute !important;width:1px !important;height:1px !important;min-height:1px !important;opacity:0 !important;clip-path:inset(50%) !important;pointer-events:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger.login-member-trigger {
  box-sizing:border-box !important;position:relative !important;inset:auto !important;
  display:flex !important;align-items:center !important;justify-content:flex-start !important;
  width:100% !important;max-width:none !important;min-width:0 !important;
  height:54px !important;min-height:54px !important;max-height:none !important;
  gap:10px !important;margin:0 !important;padding:0 55px 0 13px !important;
  background:#fff !important;background-image:none !important;
  border:1.5px solid #83c3ef !important;border-radius:16px !important;
  box-shadow:none !important;color:#103563 !important;
  text-shadow:none !important;transform:none !important;
  font:750 16px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  text-align:left !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger::before {
  content:"" !important;display:block !important;
  position:static !important;inset:auto !important;margin:0 !important;
  width:27px !important;height:27px !important;flex:0 0 27px !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger::after {content:none !important;display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger .login-member-trigger-label {text-align:left !important;font:inherit !important;color:inherit !important;-webkit-text-fill-color:currentColor !important;flex:1 1 auto !important;min-width:0 !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger .login-member-trigger-arrow {
  display:grid !important;place-items:center !important;
  position:absolute !important;top:50% !important;right:7px !important;left:auto !important;
  width:38px !important;height:38px !important;min-width:0 !important;
  margin:0 !important;padding:0 !important;border:1px solid #b5dafa !important;border-radius:50% !important;
  box-sizing:border-box !important;box-shadow:0 3px 9px rgba(42,121,185,.09) !important;
  transform:translateY(-50%) !important;background:linear-gradient(180deg,#f8fbff 0%,#dcedfc 100%) !important;color:#247fc5 !important;font-size:0 !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger .login-member-trigger-arrow::after {content:"" !important;display:block !important;width:20px !important;height:20px !important;margin:0 !important;border:0 !important;transform:none !important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 9 7 7 7-7' fill='none' stroke='%23247fc5' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger[aria-expanded="true"] .login-member-trigger-arrow {transform:translateY(-50%) rotate(180deg) !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger:focus-visible {outline:2px solid #1a8acb !important;outline-offset:3px !important;}
/* Native state holder and the existing sorted picker/handlers remain intact. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberMenu {position:absolute !important;top:calc(100% + 8px) !important;left:0 !important;right:0 !important;width:100% !important;max-width:none !important;z-index:40 !important;background:#fff !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;border:1px solid #cfdfea !important;border-radius:17px !important;box-shadow:0 10px 28px rgba(22,55,92,.18) !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberMenu:not(.open) {display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberMenu.open {display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:3px !important;padding:8px !important;max-height:min(38svh,280px) !important;overflow-y:auto !important;overflow-x:hidden !important;overscroll-behavior:contain !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberMenu .login-member-option {box-sizing:border-box !important;min-width:0 !important;min-height:42px !important;width:100% !important;margin:0 !important;padding:9px 7px !important;border:0 !important;border-radius:10px !important;box-shadow:none !important;background:#fff !important;color:#174674 !important;font:650 13px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;white-space:normal !important;text-align:left !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberMenu .login-member-option[aria-selected="true"] {background:#e9f4ff !important;color:#096ba9 !important;}

/* r73: identical tile boxes and three fixed content tracks. Real DOM labels,
   not ::after copy, are authoritative in both languages. Existing IDs and
   click handlers remain intact. This scope outranks legacy button/label CSS. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions {
  --action-icon:27px;
  --action-title-row:14px;
  --action-note-row:14px;
  --action-gap:3px;
  position:relative !important;inset:auto !important;display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;grid-auto-rows:auto !important;
  align-items:stretch !important;flex:0 0 auto !important;gap:8px !important;
  width:100% !important;max-width:none !important;min-width:0 !important;
  height:auto !important;min-height:0 !important;max-height:none !important;
  margin:0 !important;padding:0 !important;border:0 !important;background:transparent !important;box-shadow:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions > .guest-language-row {display:contents !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) {
  box-sizing:border-box !important;position:relative !important;inset:auto !important;
  display:grid !important;grid-template-columns:minmax(0,1fr) !important;
  grid-template-rows:var(--action-icon) var(--action-title-row) var(--action-note-row) !important;
  align-content:center !important;align-items:center !important;justify-items:center !important;
  width:100% !important;max-width:none !important;min-width:0 !important;
  height:86px !important;min-height:86px !important;max-height:none !important;
  margin:0 !important;padding:10px 4px !important;gap:var(--action-gap) !important;
  border:1px solid #d5e8f4 !important;border-radius:16px !important;
  box-shadow:none !important;text-shadow:none !important;transform:none !important;
  overflow:hidden !important;text-align:center !important;opacity:1 !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #btnGuest {order:1 !important;background:#edf7ff !important;color:#196fa7 !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar {
  order:2 !important;display:flex !important;flex-direction:column !important;
  align-items:stretch !important;justify-content:center !important;
  background:#f2ebfc !important;border-color:#e4d8f5 !important;color:#7130bc !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #htnsSongbookOfflineEntry {order:3 !important;background:#eafaf2 !important;border-color:#d1eade !important;color:#118576 !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry)::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry)::after {content:none !important;display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar .lang-btn {
  box-sizing:border-box !important;position:static !important;inset:auto !important;display:none !important;
  grid-template-columns:minmax(0,1fr) !important;
  grid-template-rows:var(--action-icon) var(--action-title-row) var(--action-note-row) !important;
  align-content:center !important;align-items:center !important;justify-items:center !important;
  width:100% !important;height:100% !important;min-height:0 !important;max-height:none !important;
  min-width:0 !important;max-width:none !important;flex:1 1 auto !important;
  margin:0 !important;padding:0 !important;gap:var(--action-gap) !important;background:transparent !important;
  color:inherit !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;transform:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar .lang-btn.on {display:grid !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar .lang-btn::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar .lang-btn::after {content:none !important;display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #btnGuest #btnGuestLabel,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar .lang-btn .login-lang-label,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar .login-lang-chevron,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar > .login-lang-separator,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #htnsSongbookOfflineEntry > span:not(.htns-action-title-r71) {display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) > svg,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #langBar .lang-btn > .login-lang-icon {
  box-sizing:border-box !important;display:block !important;position:static !important;inset:auto !important;
  grid-row:1 !important;grid-column:1 !important;justify-self:center !important;align-self:center !important;
  width:var(--action-icon) !important;height:var(--action-icon) !important;min-width:var(--action-icon) !important;
  flex:0 0 var(--action-icon) !important;margin:0 !important;padding:0 !important;
  color:inherit !important;stroke:currentColor !important;filter:none !important;transform:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) .htns-action-title-r71 {
  box-sizing:border-box !important;display:block !important;position:static !important;inset:auto !important;
  grid-row:2 !important;grid-column:1 !important;justify-self:center !important;align-self:center !important;
  width:100% !important;height:var(--action-title-row) !important;min-width:0 !important;min-height:0 !important;
  margin:0 !important;padding:0 !important;overflow:visible !important;clip:auto !important;clip-path:none !important;
  border:0 !important;background:none !important;box-shadow:none !important;transform:none !important;
  color:inherit !important;-webkit-text-fill-color:currentColor !important;text-align:center !important;
  font:800 clamp(10px,2.8vw,13px)/var(--action-title-row) -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  text-transform:uppercase !important;letter-spacing:.025em !important;white-space:nowrap !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions #htnsSongbookOfflineEntry .htns-action-title-r71 {
  font-size:clamp(9.5px,2.65vw,12px) !important;
  font-weight:750 !important;letter-spacing:.015em !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) .htns-action-note-r71 {
  box-sizing:border-box !important;display:block !important;position:static !important;inset:auto !important;
  grid-row:3 !important;grid-column:1 !important;justify-self:center !important;align-self:center !important;
  width:100% !important;height:var(--action-note-row) !important;min-width:0 !important;min-height:0 !important;
  margin:0 !important;padding:0 !important;clip:auto !important;clip-path:none !important;overflow:visible !important;
  border:0 !important;background:none !important;box-shadow:none !important;transform:none !important;
  font:500 clamp(9px,2.4vw,11px)/var(--action-note-row) -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  color:#697f96 !important;-webkit-text-fill-color:#697f96 !important;text-align:center !important;
  text-transform:none !important;letter-spacing:0 !important;white-space:nowrap !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) :is(.htns-action-title-r71,.htns-action-note-r71)::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) :is(.htns-action-title-r71,.htns-action-note-r71)::after {content:none !important;display:none !important;}
@media (max-width:360px) {
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions {gap:6px !important;}
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) {height:80px !important;min-height:80px !important;padding:7px 3px !important;border-radius:14px !important;}
}

html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71 {display:flex !important;justify-content:center !important;align-items:center !important;margin:0 !important;padding:0 !important;width:100% !important;flex:0 0 auto !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71:has(#btnInstallApp.hidden) {display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71 #btnInstallApp.login-install-btn {
  box-sizing:border-box !important;position:relative !important;inset:auto !important;
  display:inline-flex !important;flex-direction:row !important;align-items:center !important;justify-content:center !important;
  width:auto !important;min-width:136px !important;max-width:100% !important;
  height:40px !important;min-height:40px !important;max-height:40px !important;
  margin:0 !important;padding:0 16px !important;gap:7px !important;
  border:1px solid #9accec !important;border-radius:999px !important;
  background:#f5fbff !important;background-image:none !important;
  color:#126fa9 !important;box-shadow:none !important;text-shadow:none !important;
  transform:none !important;z-index:auto !important;overflow:hidden !important;white-space:nowrap !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71 #btnInstallApp.hidden {display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71 #btnInstallApp > svg {display:block !important;position:static !important;width:16px !important;height:16px !important;min-width:16px !important;flex:0 0 16px !important;margin:0 !important;color:inherit !important;stroke:currentColor !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71 #btnInstallApp #btnInstallAppLabel {display:block !important;position:static !important;inset:auto !important;width:auto !important;height:auto !important;min-height:0 !important;padding:0 !important;margin:0 !important;clip:auto !important;clip-path:none !important;overflow:visible !important;white-space:nowrap !important;font:800 11px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;letter-spacing:.065em !important;text-transform:uppercase !important;color:inherit !important;-webkit-text-fill-color:currentColor !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71 #btnInstallApp::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-install-row-r71 #btnInstallApp::after {content:none !important;display:none !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #installBanner {position:relative !important;inset:auto !important;width:100% !important;margin:0 !important;}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #installBanner.hidden {display:none !important;}
/* Only y=1120..1740 is painted: corrected church sign + copyright, no caps slogan.
   The small sky overlay restores ONLY the reference's cursive inscription. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71 {
  position:relative !important;display:block !important;flex:0 0 auto !important;
  width:100% !important;aspect-ratio:850 / 620;
  margin:0 !important;padding:0 !important;border:0 !important;overflow:hidden !important;
  background:#cae2f8 url('/htns-login-artwork-v302r71.jpg') center bottom / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-cursive-r71 {
  position:absolute !important;inset:0 !important;display:block !important;pointer-events:none !important;
  background:url('/htns-login-cursive-v302r71.jpg') center bottom / 100% auto no-repeat !important;
  clip-path:polygon(62% 0,100% 0,100% 27%,62% 27%) !important;
}
@media (max-width:360px) {
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel {gap:10px !important;padding:16px 10px 12px !important;border-radius:21px !important;}
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions {gap:6px !important;}
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) {height:80px !important;min-height:80px !important;border-radius:14px !important;}
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger.login-member-trigger {font-size:14px !important;height:52px !important;min-height:52px !important;}
}
@media (prefers-reduced-motion:reduce) {html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] * {animation:none !important;transition:none !important;}}

html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71 {
  position:relative !important;display:block !important;flex:0 0 auto !important;
  z-index:2 !important;width:100% !important;margin:0 !important;padding:9px 0 0 !important;
  background:linear-gradient(180deg,#b9daf7,#d0e7f8) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71::before {
  content:"" !important;display:block !important;position:absolute !important;inset:0 !important;
  pointer-events:none !important;
  background:url('/htns-login-artwork-v302r71.jpg') center 50.24077% / 100% 352.22672% no-repeat !important;
  -webkit-mask-image:linear-gradient(to right,#000 0%,#000 4.65%,transparent 4.65%,transparent 95.35%,#000 95.35%,#000 100%),linear-gradient(to bottom,#000 0px,#000 33px,transparent 33px,transparent calc(100% - 24px),#000 calc(100% - 24px),#000 100%) !important;
  mask-image:linear-gradient(to right,#000 0%,#000 4.65%,transparent 4.65%,transparent 95.35%,#000 95.35%,#000 100%),linear-gradient(to bottom,#000 0px,#000 33px,transparent 33px,transparent calc(100% - 24px),#000 calc(100% - 24px),#000 100%) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginMemberTrigger::before {
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230979bf' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='3.5'/%3E%3Cpath d='M4.5 21v-1.2a7.5 7.5 0 0 1 15 0V21Z'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

/* HTNS r74 overrides — extend the hero artwork through the top header area and fully lock login-screen scrolling.
   Keeps r71 artwork and r73 button alignment while fitting the login screen inside a single viewport. */
html.htns-theme-v234.login-screen-active[data-theme="light"],
html.htns-theme-v234.login-screen-active[data-theme="light"] body,
html.htns-theme-v234.login-screen-active[data-theme="light"] body #app {
  height: var(--htns-login-vh, 100svh) !important;
  min-height: var(--htns-login-vh, 100svh) !important;
  max-height: var(--htns-login-vh, 100svh) !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  background: #c3e0fa url('/htns-login-artwork-v302r71.jpg') center top / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] {
  height: var(--htns-login-vh, 100svh) !important;
  min-height: var(--htns-login-vh, 100svh) !important;
  max-height: var(--htns-login-vh, 100svh) !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  -webkit-overflow-scrolling: auto !important;
  background: #c3e0fa url('/htns-login-artwork-v302r71.jpg') center top / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71 {
  flex: 0 0 auto !important;
  aspect-ratio: auto !important;
  height: clamp(216px, 31svh, 286px) !important;
  min-height: clamp(216px, 31svh, 286px) !important;
  max-height: clamp(216px, 31svh, 286px) !important;
  margin-top: calc(-1 * var(--htns-login-vvtop, 0px)) !important;
  padding-top: var(--htns-login-vvtop, 0px) !important;
  background-position: center top !important;
  background-size: 100% auto !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71 {
  flex: 0 0 auto !important;
  margin-top: -8px !important;
  padding: 4px 0 0 !important;
  background: linear-gradient(180deg, rgba(185,218,247,.98) 0%, #d0e7f8 36%, #d8edf9 100%) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel {
  gap: 10px !important;
  padding: 16px 14px 12px !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #htnsLoginWelcomeR71 {
  font-size: clamp(24px, 6.3vw, 31px) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #htnsLoginHelpR71 {
  font-size: clamp(12px, 3.1vw, 15px) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71 {
  flex: 1 1 auto !important;
  aspect-ratio: auto !important;
  min-height: clamp(170px, 23svh, 235px) !important;
  max-height: clamp(170px, 27svh, 255px) !important;
  margin-top: auto !important;
  background-position: center bottom !important;
  background-size: 100% auto !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-cursive-r71 {
  background-position: center bottom !important;
  background-size: 100% auto !important;
}
@media (max-width: 390px) {
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71 {
    height: clamp(204px, 29svh, 268px) !important;
    min-height: clamp(204px, 29svh, 268px) !important;
    max-height: clamp(204px, 29svh, 268px) !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel {
    gap: 9px !important;
    padding: 15px 12px 11px !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71 {
    min-height: clamp(158px, 22svh, 215px) !important;
    max-height: clamp(158px, 25svh, 230px) !important;
  }
}
@media (max-height: 760px) {
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71 {
    height: clamp(188px, 27svh, 236px) !important;
    min-height: clamp(188px, 27svh, 236px) !important;
    max-height: clamp(188px, 27svh, 236px) !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel {
    gap: 8px !important;
    padding: 14px 11px 10px !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry) {
    height: 78px !important;
    min-height: 78px !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71 {
    min-height: 146px !important;
    max-height: 210px !important;
  }
}

/* HTNS r76 — keep the login artwork out of the live-control zone.
   The previous r74 full-gate background exposed the baked legacy login buttons
   underneath the live panel. This revision paints artwork only in the top safe
   header/hero and the dedicated lower church scene. */
html.htns-theme-v234.login-screen-active[data-theme="light"],
html.htns-theme-v234.login-screen-active[data-theme="light"] body,
html.htns-theme-v234.login-screen-active[data-theme="light"] body #app,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] {
  background:#c3e0fa !important;
  background-image:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]{
  --htns-login-top-fill:max(env(safe-area-inset-top), var(--htns-login-vvtop, 0px));
}
/* Fill only the status/safe-area band with the top of the artwork. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  top:calc(-1 * var(--htns-login-top-fill)) !important;
  left:0 !important;
  right:0 !important;
  height:calc(var(--htns-login-top-fill) + 10px) !important;
  pointer-events:none !important;
  background:#c3e0fa url('/htns-login-artwork-v302r71.jpg') center top / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::after{
  content:none !important;
  display:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
  z-index:1 !important;
  margin-top:calc(-1 * var(--htns-login-top-fill)) !important;
  padding-top:var(--htns-login-top-fill) !important;
  height:calc(clamp(216px,31svh,286px) + var(--htns-login-top-fill)) !important;
  min-height:calc(clamp(216px,31svh,286px) + var(--htns-login-top-fill)) !important;
  max-height:calc(clamp(216px,31svh,286px) + var(--htns-login-top-fill)) !important;
  background:#c3e0fa url('/htns-login-artwork-v302r71.jpg') center top / 100% auto no-repeat !important;
}
/* The live-control stage may keep the side scenery mask, but never inherit a
   full-page background image. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71{
  background:linear-gradient(180deg,#b9daf7 0%,#d0e7f8 36%,#d8edf9 100%) !important;
  background-image:linear-gradient(180deg,#b9daf7 0%,#d0e7f8 36%,#d8edf9 100%) !important;
}
@media (max-width:390px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
    height:calc(clamp(204px,29svh,268px) + var(--htns-login-top-fill)) !important;
    min-height:calc(clamp(204px,29svh,268px) + var(--htns-login-top-fill)) !important;
    max-height:calc(clamp(204px,29svh,268px) + var(--htns-login-top-fill)) !important;
  }
}
@media (max-height:760px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
    height:calc(clamp(188px,27svh,236px) + var(--htns-login-top-fill)) !important;
    min-height:calc(clamp(188px,27svh,236px) + var(--htns-login-top-fill)) !important;
    max-height:calc(clamp(188px,27svh,236px) + var(--htns-login-top-fill)) !important;
  }
}


/* HTNS r79 — restore the continuous login artwork between the live card and the church scene,
   while keeping the baked legacy controls hidden and removing the leftover flat blue top band. */
html.htns-theme-v234.login-screen-active[data-theme="light"],
html.htns-theme-v234.login-screen-active[data-theme="light"] body,
html.htns-theme-v234.login-screen-active[data-theme="light"] body #app,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]{
  background:#c3e0fa url('/htns-login-artwork-v302r71.jpg') center top / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::before{
  content:none !important;
  display:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
  margin-top:calc(-1 * var(--htns-login-vvtop, 0px)) !important;
  padding-top:var(--htns-login-vvtop, 0px) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71{
  margin-top:-10px !important;
  padding-top:2px !important;
  padding-bottom:0 !important;
  overflow:visible !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel{
  position:relative !important;
  z-index:5 !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
  position:relative !important;
  z-index:1 !important;
  flex:0 0 auto !important;
  aspect-ratio:auto !important;
  margin-top:-112px !important;
  min-height:clamp(244px, 34svh, 330px) !important;
  max-height:none !important;
  background:#cae2f8 url('/htns-login-artwork-v302r71.jpg') center bottom / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #gHint{
  position:relative !important;
  z-index:2 !important;
  margin-top:-18px !important;
  padding-bottom:12px !important;
  color:#ffffff !important;
  text-shadow:0 2px 8px rgba(14,45,81,.35) !important;
}
@media (max-width:390px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
    margin-top:-98px !important;
    min-height:clamp(224px, 32svh, 305px) !important;
  }
}
@media (max-height:760px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
    margin-top:-90px !important;
    min-height:210px !important;
  }
}


/* HTNS r80 — one continuous login artwork, no duplicate church, transparent iOS status area.
   The gate owns one full-height artwork layer. The lower scene is only a transparent spacer/overlay,
   so the church cannot restart a second time. */
html.htns-theme-v234.login-screen-active[data-theme="light"],
html.htns-theme-v234.login-screen-active[data-theme="light"] body,
html.htns-theme-v234.login-screen-active[data-theme="light"] body #app,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]{
  background-color:#c3e0fa !important;
  background-image:url('/htns-login-artwork-v302r71.jpg') !important;
  background-position:center top !important;
  background-repeat:no-repeat !important;
  background-size:100% 100% !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::after{
  content:none !important;
  display:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
  position:relative !important;
  z-index:1 !important;
  margin-top:calc(-1 * var(--htns-login-vvtop, 0px)) !important;
  padding-top:var(--htns-login-vvtop, 0px) !important;
  background-color:transparent !important;
  background-image:none !important;
}
/* The live-control zone stays opaque enough to hide the baked controls in the artwork. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71{
  position:relative !important;
  z-index:3 !important;
  margin-top:-8px !important;
  padding:4px 0 0 !important;
  background:linear-gradient(180deg,rgba(185,218,247,.98) 0%,rgba(208,231,248,.98) 36%,rgba(216,237,249,.96) 100%) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71::before{
  opacity:.22 !important;
}
/* Critical r80 repair: never repaint the church in this lower block. Let the single gate artwork show through. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
  position:relative !important;
  z-index:1 !important;
  display:block !important;
  flex:0 0 auto !important;
  width:100% !important;
  aspect-ratio:850 / 620 !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  background-color:transparent !important;
  background-image:none !important;
}
/* Keep the requested cursive phrase only; the underlying church remains the single gate artwork. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-cursive-r71{
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:url('/htns-login-cursive-v302r71.jpg') center bottom / 100% auto no-repeat !important;
  clip-path:polygon(62% 0,100% 0,100% 29%,62% 29%) !important;
}
@media(max-width:390px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
    aspect-ratio:850 / 620 !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
  }
}
@media(max-height:760px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
    aspect-ratio:850 / 620 !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
  }
}


/* HTNS r81 — clean approved login composition.
   Uses dedicated decorative hero/scene crops so no baked login controls can overlap the live UI. */
html.htns-theme-v234.login-screen-active[data-theme="light"],
html.htns-theme-v234.login-screen-active[data-theme="light"] body,
html.htns-theme-v234.login-screen-active[data-theme="light"] body #app{
  background:#9fd6fb url('/htns-login-hero-r81.jpg') center top / 100% auto no-repeat !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]{
  --r81-safe-top:max(env(safe-area-inset-top), var(--htns-login-vvtop, 0px));
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  height:var(--htns-login-vh,100svh) !important;
  min-height:var(--htns-login-vh,100svh) !important;
  max-height:var(--htns-login-vh,100svh) !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
  background:#b9ddf8 !important;
  background-image:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::after{
  content:none !important;
  display:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
  position:relative !important;
  z-index:1 !important;
  display:block !important;
  flex:0 0 auto !important;
  width:100% !important;
  height:calc(clamp(340px,29svh,430px) + var(--r81-safe-top)) !important;
  min-height:calc(clamp(340px,29svh,430px) + var(--r81-safe-top)) !important;
  max-height:calc(clamp(340px,29svh,430px) + var(--r81-safe-top)) !important;
  margin-top:calc(-1 * var(--r81-safe-top)) !important;
  padding-top:var(--r81-safe-top) !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  background:#9fd6fb url('/htns-login-hero-r81.jpg') center top / 100% 100% no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71{
  position:relative !important;
  z-index:5 !important;
  display:block !important;
  flex:0 0 auto !important;
  width:100% !important;
  margin:-5px 0 0 !important;
  padding:0 !important;
  background:#b9ddf8 !important;
  background-image:none !important;
  overflow:visible !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71::after{
  content:none !important;
  display:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel{
  position:relative !important;
  z-index:6 !important;
  width:90.7% !important;
  margin:0 4.65% !important;
  background:#fff !important;
  background-image:none !important;
  box-shadow:0 7px 22px rgba(23,70,107,.08) !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
  position:relative !important;
  z-index:1 !important;
  display:block !important;
  flex:1 1 auto !important;
  width:100% !important;
  min-height:0 !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  background:#b9ddf8 url('/htns-login-scene-r81.jpg') center top / 100% 100% no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-cursive-r71{
  display:none !important;
  background:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #gHint{
  display:none !important;
}
@media(max-height:900px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
    height:calc(clamp(245px,27svh,320px) + var(--r81-safe-top)) !important;
    min-height:calc(clamp(245px,27svh,320px) + var(--r81-safe-top)) !important;
    max-height:calc(clamp(245px,27svh,320px) + var(--r81-safe-top)) !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel{
    gap:8px !important;
    padding:13px 11px 10px !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry){
    height:76px !important;
    min-height:76px !important;
  }
}

/* HTNS r82 — final login composition parity with the approved clean mockup.
   Use one clean hero, one clean side-scenery strip behind the live card, and one clean church scene.
   No baked login controls, duplicate card edges, or blurred filler remain visible. */
html.htns-theme-v234.login-screen-active[data-theme="light"],
html.htns-theme-v234.login-screen-active[data-theme="light"] body,
html.htns-theme-v234.login-screen-active[data-theme="light"] body #app{
  width:100% !important;
  height:100dvh !important;
  min-height:100dvh !important;
  max-height:100dvh !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
  background:#a2ccfb url('/htns-login-hero-r82.jpg') center top / 100% auto no-repeat !important;
}
html.htns-theme-v234.login-screen-active[data-theme="light"] body{
  position:fixed !important;
  inset:0 !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]{
  position:fixed !important;
  inset:0 !important;
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  height:100dvh !important;
  min-height:100dvh !important;
  max-height:100dvh !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
  background:#a2ccfb url('/htns-login-hero-r82.jpg') center top / 100% auto no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"]::after{
  content:none !important;
  display:none !important;
}
/* Hero begins at the physical top of the viewport so the real iPhone status icons sit on sky, not a flat bar. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
  position:relative !important;
  z-index:1 !important;
  display:block !important;
  flex:0 0 auto !important;
  width:100% !important;
  height:clamp(300px,34dvh,470px) !important;
  min-height:clamp(300px,34dvh,470px) !important;
  max-height:clamp(300px,34dvh,470px) !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#a2ccfb url('/htns-login-hero-r82.jpg') center top / 100% 100% no-repeat !important;
}
/* Side scenery behind the live white card comes from a clean edge-only strip, so no ghost buttons can leak around it. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71{
  position:relative !important;
  z-index:5 !important;
  display:block !important;
  flex:0 0 auto !important;
  width:100% !important;
  margin:-2px 0 0 !important;
  padding:0 !important;
  background:#cfe7fb url('/htns-login-mid-r82.jpg') center center / 100% 100% no-repeat !important;
  overflow:visible !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71::before,
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-panel-stage-r71::after{
  content:none !important;
  display:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel{
  position:relative !important;
  z-index:6 !important;
  width:90.7% !important;
  margin:0 4.65% !important;
  background:#fff !important;
  background-image:none !important;
  box-shadow:0 7px 22px rgba(23,70,107,.08) !important;
}
/* One clean lower scene only. Cursive is already composited into this asset; the old overlay span is disabled. */
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-scene-r71{
  position:relative !important;
  z-index:1 !important;
  display:block !important;
  flex:1 1 auto !important;
  width:100% !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  background:#cfe7fb url('/htns-login-scene-r82.jpg') center top / cover no-repeat !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-cursive-r71{
  display:none !important;
  background:none !important;
}
html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #gHint{
  display:none !important;
}
@media(max-width:430px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
    height:clamp(270px,32dvh,405px) !important;
    min-height:clamp(270px,32dvh,405px) !important;
    max-height:clamp(270px,32dvh,405px) !important;
  }
}
@media(max-height:900px){
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .htns-login-hero-r71{
    height:clamp(230px,29dvh,320px) !important;
    min-height:clamp(230px,29dvh,320px) !important;
    max-height:clamp(230px,29dvh,320px) !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] .panel{
    gap:8px !important;
    padding:13px 11px 10px !important;
  }
  html.htns-theme-v234[data-theme="light"] body #app #gate.gate[data-login-skin="r71"] #loginSecondaryActions.login-secondary-actions :is(#btnGuest,#langBar,#htnsSongbookOfflineEntry){
    height:76px !important;
    min-height:76px !important;
  }
}