/*
 * Bayon Library application styles
 * Single authoritative stylesheet for all Bayon-owned UI.
 * Third-party Bootstrap remains separately vendored under assets/vendor/.
 */

/* ========================================================================== 
   1. Design tokens
   ========================================================================== */
:root {
  --bayon-font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bayon-brand-50: #f5f2ff;
  --bayon-brand-100: #ebe5ff;
  --bayon-brand-300: #b9a4ff;
  --bayon-brand-500: #6846d6;
  --bayon-brand-600: #5637bd;
  --bayon-brand-700: #452c99;
  --bayon-gold-100: #fff6dd;
  --bayon-gold-400: #e9a83b;
  --bayon-navy-700: #1d3554;
  --bayon-navy-800: #142a45;
  --bayon-navy-900: #0d1d31;
  --bayon-neutral-0: #ffffff;
  --bayon-neutral-25: #fbfcfd;
  --bayon-neutral-50: #f7f8fa;
  --bayon-neutral-100: #eff1f4;
  --bayon-neutral-200: #dde1e7;
  --bayon-neutral-500: #6f7784;
  --bayon-neutral-700: #39414c;
  --bayon-neutral-900: #171c24;
  --bayon-success: #1f7a55;
  --bayon-warning: #9a6815;
  --bayon-danger: #b13f4a;
  --bayon-info: #326aa3;
  --bayon-page-bg: #f7f8fa;
  --bayon-surface: #ffffff;
  --bayon-surface-raised: #ffffff;
  --bayon-surface-soft: #f1f3f6;
  --bayon-surface-subtle: #fafbfc;
  --bayon-text: #1c2430;
  --bayon-text-muted: #6f7784;
  --bayon-border: rgba(28, 36, 48, 0.09);
  --bayon-border-strong: rgba(28, 36, 48, 0.15);
  --bayon-primary-bg: var(--bayon-brand-500);
  --bayon-primary-text: #ffffff;
  --bayon-primary-border: var(--bayon-brand-500);
  --bayon-primary-hover-bg: var(--bayon-brand-600);
  --bayon-primary-hover-text: #ffffff;
  --bayon-shadow-xs: 0 1px 2px rgba(20, 28, 40, 0.035);
  --bayon-shadow-sm: 0 4px 14px rgba(20, 28, 40, 0.045);
  --bayon-shadow-md: 0 16px 44px rgba(20, 28, 40, 0.08);
  --bayon-shadow-lg: 0 28px 70px rgba(20, 28, 40, 0.11);
  --bayon-radius-xs: 0.55rem;
  --bayon-radius-sm: 0.75rem;
  --bayon-radius-md: 1rem;
  --bayon-radius-lg: 1.35rem;
  --bayon-radius-xl: 1.75rem;
  --bayon-transition: 160ms ease;
}

[data-bs-theme="dark"] {
  --bayon-page-bg: #0e1622;
  --bayon-surface: #151f2d;
  --bayon-surface-raised: #192534;
  --bayon-surface-soft: #1d2a3a;
  --bayon-surface-subtle: #121c29;
  --bayon-text: #f2f5f8;
  --bayon-text-muted: #9da8b5;
  --bayon-border: rgba(255, 255, 255, 0.08);
  --bayon-border-strong: rgba(255, 255, 255, 0.14);
  --bayon-primary-bg: #284f7b;
  --bayon-primary-text: #ffb957;
  --bayon-primary-border: #35638f;
  --bayon-primary-hover-bg: #214469;
  --bayon-primary-hover-text: #ffc877;
  --bayon-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.18);
  --bayon-shadow-sm: 0 6px 18px rgba(0, 0, 0, 0.18);
  --bayon-shadow-md: 0 18px 50px rgba(0, 0, 0, 0.25);
  --bayon-shadow-lg: 0 30px 76px rgba(0, 0, 0, 0.32);
}

/* ========================================================================== 
   2. Base and shared components
   ========================================================================== */
html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  background: var(--bayon-page-bg);
  color: var(--bayon-text);
  font-family: var(--bayon-font-sans);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--bayon-brand-600); }
a:hover { color: var(--bayon-brand-700); }
[data-bs-theme="dark"] a { color: #aebfff; }
[data-bs-theme="dark"] a:hover { color: #cbd4ff; }

::selection { background: color-mix(in srgb, var(--bayon-primary-bg) 24%, transparent); }

/* Page shells are programmatically focusable for skip links; never draw a
   full-page browser outline when they receive pointer/programmatic focus. */
main[tabindex="-1"]:focus,
main[tabindex="-1"]:focus-visible {
  outline: 0 !important;
  box-shadow: none !important;
}

.form-control,
.form-select {
  min-height: 2.7rem;
  border-color: var(--bayon-border-strong);
  border-radius: var(--bayon-radius-sm);
  background-color: var(--bayon-surface);
  color: var(--bayon-text);
  box-shadow: none;
}
.form-control::placeholder { color: color-mix(in srgb, var(--bayon-text-muted) 78%, transparent); }
.form-control:focus,
.form-select:focus {
  border-color: color-mix(in srgb, var(--bayon-primary-bg) 68%, var(--bayon-border-strong));
  background-color: var(--bayon-surface);
  color: var(--bayon-text);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--bayon-primary-bg) 14%, transparent);
}

.btn { min-height: 2.55rem; border-radius: var(--bayon-radius-sm); font-weight: 700; }
.btn-sm { min-height: 2.15rem; }
.btn-lg { min-height: 3rem; }
.bayon-btn-primary,
.bayon-btn-secondary,
.bayon-btn-ghost,
.bayon-icon-button,
.bayon-profile-button,
.bayon-public-profile,
.bayon-action-row {
  transition: background-color var(--bayon-transition), border-color var(--bayon-transition), color var(--bayon-transition), box-shadow var(--bayon-transition), transform var(--bayon-transition);
}
.bayon-btn-primary {
  background: var(--bayon-primary-bg);
  border-color: var(--bayon-primary-border);
  color: var(--bayon-primary-text);
  box-shadow: var(--bayon-shadow-xs);
}
.bayon-btn-primary:hover,
.bayon-btn-primary:focus-visible {
  background: var(--bayon-primary-hover-bg);
  border-color: var(--bayon-primary-hover-bg);
  color: var(--bayon-primary-hover-text);
  transform: translateY(-1px);
}
.bayon-btn-primary:focus-visible { box-shadow: 0 0 0 0.22rem color-mix(in srgb, var(--bayon-primary-bg) 24%, transparent); }
.bayon-btn-secondary {
  background: var(--bayon-surface);
  border-color: var(--bayon-border-strong);
  color: var(--bayon-text);
  box-shadow: var(--bayon-shadow-xs);
}
.bayon-btn-secondary:hover,
.bayon-btn-secondary:focus-visible,
.bayon-btn-ghost:hover,
.bayon-btn-ghost:focus-visible {
  background: var(--bayon-surface-soft);
  border-color: var(--bayon-border-strong);
  color: var(--bayon-text);
}
.bayon-btn-ghost { border-color: transparent; background: transparent; color: var(--bayon-text-muted); }
.bayon-icon-button {
  width: 2.55rem;
  height: 2.55rem;
  min-height: 2.55rem;
  padding: 0;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--bayon-border);
  border-radius: var(--bayon-radius-sm);
  background: var(--bayon-surface);
  color: var(--bayon-text);
}
.bayon-icon-button:hover,
.bayon-icon-button:focus-visible { border-color: var(--bayon-border-strong); background: var(--bayon-surface-soft); color: var(--bayon-text); }

.bayon-eyebrow,
.bayon-section-kicker {
  color: var(--bayon-brand-600);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.095em;
  text-transform: uppercase;
}
[data-bs-theme="dark"] .bayon-eyebrow,
[data-bs-theme="dark"] .bayon-section-kicker { color: #b9c6ff; }

.bayon-status,
.bayon-meta-chip,
.bayon-date-chip,
.bayon-environment-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
}
.bayon-status { padding: 0.38rem 0.66rem; border: 1px solid transparent; background: var(--bayon-surface-soft); color: var(--bayon-text-muted); }
.bayon-status.is-success { background: color-mix(in srgb, var(--bayon-success) 11%, var(--bayon-surface)); border-color: color-mix(in srgb, var(--bayon-success) 20%, transparent); color: var(--bayon-success); }
.bayon-status.is-warning { background: color-mix(in srgb, var(--bayon-warning) 11%, var(--bayon-surface)); border-color: color-mix(in srgb, var(--bayon-warning) 20%, transparent); color: var(--bayon-warning); }
.bayon-status.is-danger { background: color-mix(in srgb, var(--bayon-danger) 11%, var(--bayon-surface)); border-color: color-mix(in srgb, var(--bayon-danger) 20%, transparent); color: var(--bayon-danger); }
.bayon-status.is-info { background: color-mix(in srgb, var(--bayon-info) 11%, var(--bayon-surface)); color: var(--bayon-info); }
.bayon-meta-chip { padding: 0.4rem 0.68rem; background: var(--bayon-surface-soft); color: var(--bayon-text-muted); }
.bayon-date-chip { padding: 0.65rem 0.85rem; border: 1px solid var(--bayon-border); background: var(--bayon-surface); color: var(--bayon-text-muted); }

.bayon-alert { border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); box-shadow: var(--bayon-shadow-xs); }
.bayon-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; }
.bayon-table-meta { color: var(--bayon-text-muted); font-size: 0.76rem; }

.bayon-account-menu {
  min-width: 14rem;
  border: 1px solid var(--bayon-border);
  border-radius: var(--bayon-radius-md);
  background: var(--bayon-surface-raised);
  box-shadow: var(--bayon-shadow-md);
}
.bayon-account-menu .dropdown-divider { border-color: var(--bayon-border); }
.bayon-account-menu .dropdown-item { color: var(--bayon-text); }
.bayon-account-menu .dropdown-item:hover,
.bayon-account-menu .dropdown-item:focus { background: var(--bayon-surface-soft); color: var(--bayon-text); }

/* ========================================================================== 
   3. Public application shell
   ========================================================================== */
.bayon-public-body { background: var(--bayon-page-bg); }
.bayon-shell { width: min(100% - 2rem, 1220px); margin-inline: auto; }
.bayon-navbar {
  border-bottom: 1px solid var(--bayon-border);
  background: color-mix(in srgb, var(--bayon-page-bg) 90%, transparent);
  backdrop-filter: blur(18px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--bayon-surface) 50%, transparent);
}
.bayon-public-brand { display: inline-flex; align-items: center; gap: 0.72rem; color: var(--bayon-text) !important; }
.bayon-brand-mark {
  width: 2.45rem;
  height: 2.45rem;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  border-radius: 0.82rem;
  background: linear-gradient(145deg, var(--bayon-brand-500), var(--bayon-brand-700));
  color: #fff;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--bayon-brand-500) 24%, transparent);
  font-weight: 850;
  letter-spacing: -0.04em;
}
.bayon-brand-mark-sm { width: 2rem; height: 2rem; border-radius: 0.65rem; font-size: 0.8rem; }
.bayon-brand-copy { display: grid; line-height: 1.05; }
.bayon-brand-copy strong { font-size: 0.94rem; }
.bayon-brand-copy small { margin-top: 0.28rem; color: var(--bayon-text-muted); font-size: 0.65rem; font-weight: 600; }
.bayon-navbar-toggler { border-color: var(--bayon-border-strong); border-radius: var(--bayon-radius-sm); }
.bayon-public-nav-link { margin-inline: 0.08rem; padding: 0.58rem 0.78rem !important; border-radius: var(--bayon-radius-sm); color: var(--bayon-text-muted); font-size: 0.87rem; font-weight: 700; }
.bayon-public-nav-link:hover { background: var(--bayon-surface-soft); color: var(--bayon-text); }
.bayon-public-nav-link.is-active { background: color-mix(in srgb, var(--bayon-brand-500) 9%, var(--bayon-surface)); color: var(--bayon-brand-600); }
[data-bs-theme="dark"] .bayon-public-nav-link.is-active { color: #c7d1ff; }
.bayon-public-profile { min-height: 2.7rem; display: flex; align-items: center; gap: 0.65rem; padding: 0.3rem 0.55rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-sm); background: var(--bayon-surface); color: var(--bayon-text); }
.bayon-public-profile:hover { background: var(--bayon-surface-soft); color: var(--bayon-text); }
.bayon-public-profile strong,
.bayon-public-profile small { display: block; line-height: 1.15; }
.bayon-public-profile strong { font-size: 0.78rem; }
.bayon-public-profile small { max-width: 11rem; margin-top: 0.16rem; overflow: hidden; color: var(--bayon-text-muted); font-size: 0.65rem; text-overflow: ellipsis; }
.bayon-avatar { width: 2rem; height: 2rem; flex: 0 0 auto; display: inline-grid; place-items: center; border-radius: 0.65rem; background: color-mix(in srgb, var(--bayon-brand-500) 13%, var(--bayon-surface)); color: var(--bayon-brand-600); font-size: 0.7rem; font-weight: 850; }
[data-bs-theme="dark"] .bayon-avatar { color: #c7d1ff; }


/* Public shared sections */
.bayon-public-section { padding: clamp(3rem, 6vw, 5.5rem) 0; }
.bayon-public-section-soft { border-block: 1px solid var(--bayon-border); background: var(--bayon-surface-subtle); }
.bayon-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; margin-bottom: 2rem; }
.bayon-section-heading h2 { margin: 0; font-size: clamp(1.8rem, 4vw, 2.65rem); letter-spacing: -0.04em; font-weight: 800; }
.bayon-section-heading p { max-width: 38rem; margin: 0.45rem 0 0; color: var(--bayon-text-muted); }


.bayon-title-card { display: grid; grid-template-columns: 10.25rem minmax(0, 1fr); min-height: 15.5rem; overflow: hidden; border: 0; border-radius: var(--bayon-radius-lg); background: transparent; box-shadow: var(--bayon-shadow-xs); transition: transform var(--bayon-transition), box-shadow var(--bayon-transition); }
.bayon-title-card:hover { transform: translateY(-2px); box-shadow: var(--bayon-shadow-sm); }
.bayon-title-cover { position: relative; z-index: 1; display: grid; place-items: center; min-height: 100%; overflow: hidden; border-radius: var(--bayon-radius-lg) 0 0 var(--bayon-radius-lg); background: linear-gradient(165deg, #243e62, #172a44); color: #fff !important; text-decoration: none; }
.bayon-title-cover::after { content: ""; position: absolute; width: 6rem; height: 6rem; right: -2.5rem; bottom: -2rem; border: 1px solid rgba(255,255,255,0.15); border-radius: 50%; }
.bayon-title-cover.has-image::after { display:none; }
.bayon-title-cover.has-image {
  align-self:stretch;
  min-height:100%;
  line-height:0;
}
.bayon-title-cover.has-image img {
  position:absolute;
  inset:-1px;
  width:calc(100% + 2px);
  height:calc(100% + 2px);
  max-width:none;
  display:block;
  object-fit:cover;
  object-position:center;
  padding:0;
  background:transparent;
}
.bayon-title-cover > span { font-size: 2.5rem; font-weight: 850; opacity: 0.92; }
.bayon-title-cover > small { position: absolute; left: 0.7rem; bottom: 0.65rem; font-size: 0.65rem; font-weight: 800; opacity: 0.65; }
.bayon-title-card-body {
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:1.15rem 1.2rem;
  border:1px solid var(--bayon-border);
  border-left:0;
  border-radius:0 var(--bayon-radius-lg) var(--bayon-radius-lg) 0;
  background:var(--bayon-surface);
  transition:border-color var(--bayon-transition);
}
.bayon-title-card:hover .bayon-title-card-body { border-color:var(--bayon-border-strong); }
.bayon-title-card h2,
.bayon-title-card h3 {
  min-height:2.7em;
  margin:0;
  font-size:1rem;
  line-height:1.35;
}
.bayon-title-card h2 a,
.bayon-title-card h3 a {
  display:-webkit-box;
  overflow:hidden;
  color:var(--bayon-text);
  text-decoration:none;
  text-overflow:ellipsis;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
}
.bayon-title-card h2 a:hover,
.bayon-title-card h3 a:hover { color: var(--bayon-brand-600); }
.bayon-title-author { margin: 0.48rem 0 0; color: var(--bayon-text); font-size: 0.79rem; }
.bayon-title-meta { display: grid; gap: 0.32rem; margin-top: 0.78rem; color: var(--bayon-text-muted); font-size: 0.72rem; line-height: 1.45; }
.bayon-title-meta-row { min-width: 0; }
.bayon-title-meta-category { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bayon-title-meta-facts { display: flex; flex-wrap: wrap; gap: 0.35rem 0.6rem; }
.bayon-title-meta-facts span + span::before { content: "·"; margin-right: 0.6rem; }
.bayon-title-link { margin-top: auto; padding-top: 1rem; font-size: 0.76rem; font-weight: 750; text-decoration: none; }


/* Public catalog */
.bayon-catalog-hero { padding: 4rem 0 2rem; background: linear-gradient(180deg, color-mix(in srgb, var(--bayon-brand-500) 5%, var(--bayon-page-bg)), var(--bayon-page-bg)); }
.bayon-public-page-title { font-size: clamp(2.3rem, 5vw, 4rem); }
.bayon-catalog-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-lg); background: var(--bayon-surface); box-shadow: var(--bayon-shadow-xs); }
.bayon-catalog-summary > div { padding: 1rem; text-align: center; }
.bayon-catalog-summary > div + div { border-left: 1px solid var(--bayon-border); }
.bayon-catalog-summary strong,
.bayon-catalog-summary span { display: block; }
.bayon-catalog-summary strong { font-size: 1.25rem; letter-spacing: -0.03em; }
.bayon-catalog-summary span { margin-top: 0.25rem; color: var(--bayon-text-muted); font-size: 0.68rem; }
.bayon-catalog-search-panel { display: grid; grid-template-columns: minmax(15rem, 2fr) minmax(10rem, 0.8fr) minmax(9rem, 0.7fr) auto; gap: 0.65rem; padding: 0.75rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-lg); background: var(--bayon-surface); box-shadow: var(--bayon-shadow-md); }
.bayon-catalog-search-main { min-height: 2.7rem; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 0.5rem; padding: 0 0.75rem; border: 1px solid var(--bayon-border-strong); border-radius: var(--bayon-radius-sm); }
.bayon-catalog-search-main input { min-width: 0; border: 0; outline: 0; background: transparent; color: var(--bayon-text); }
.bayon-catalog-filter .form-select { height: 100%; }
.bayon-results-toolbar { min-height: 2.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--bayon-text-muted); font-size: 0.82rem; }
.bayon-results-toolbar strong { color: var(--bayon-text); }
.bayon-pagination-wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.pagination { --bs-pagination-bg: var(--bayon-surface); --bs-pagination-border-color: var(--bayon-border); --bs-pagination-color: var(--bayon-text-muted); --bs-pagination-hover-bg: var(--bayon-surface-soft); --bs-pagination-hover-border-color: var(--bayon-border-strong); --bs-pagination-hover-color: var(--bayon-text); --bs-pagination-active-bg: var(--bayon-primary-bg); --bs-pagination-active-border-color: var(--bayon-primary-border); }
.page-link { border-radius: 0.55rem !important; margin-inline: 0.12rem; }

.bayon-title-detail-section { padding-top: 2.5rem; }
.bayon-breadcrumb { display: flex; align-items: center; gap: 0.5rem; color: var(--bayon-text-muted); font-size: 0.78rem; }
.bayon-breadcrumb a { color: var(--bayon-text-muted); text-decoration: none; }
.bayon-breadcrumb a:hover { color: var(--bayon-text); }
.bayon-title-detail-card { overflow: hidden; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-xl); background: var(--bayon-surface); box-shadow: var(--bayon-shadow-sm); }
.bayon-title-detail-top { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: 2rem; padding: clamp(1.5rem, 4vw, 2.5rem); }
.bayon-title-detail-cover { min-height: 16rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2.5rem; padding: 1rem; border-radius: var(--bayon-radius-md); background: linear-gradient(155deg, #294b74, #142942); color: #fff; box-shadow: 0 18px 38px rgba(17, 31, 48, 0.18); text-align: center; }
.bayon-title-detail-cover.has-image {
  min-height:0;
  padding:0;
  aspect-ratio:2/3;
  overflow:hidden;
}
.bayon-title-detail-cover.has-image img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.bayon-title-detail-cover span { font-size: 4rem; font-weight: 850; }
.bayon-title-detail-cover small { font-size: 0.66rem; font-weight: 700; letter-spacing: 0.06em; opacity: 0.72; text-transform: uppercase; }
.bayon-title-detail-copy { min-width: 0; }
.bayon-title-detail-heading { margin: 0; font-size: clamp(2rem, 4.5vw, 3.4rem); letter-spacing: -0.045em; line-height: 1.03; font-weight: 825; }
.bayon-title-detail-subtitle { margin: 0.7rem 0 0; color: var(--bayon-text-muted); font-size: 1.04rem; }
.bayon-title-detail-author { margin: 1.3rem 0 0; color: var(--bayon-text-muted); }
.bayon-title-detail-author strong { color: var(--bayon-text); }
.bayon-title-detail-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; margin-top: 2rem; }
.bayon-title-detail-facts > div { padding: 0.85rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-sm); background: var(--bayon-surface-subtle); }
.bayon-title-detail-facts span,
.bayon-title-detail-facts strong { display: block; }
.bayon-title-detail-facts span { color: var(--bayon-text-muted); font-size: 0.68rem; }
.bayon-title-detail-facts strong { margin-top: 0.2rem; font-size: 0.8rem; }
.bayon-title-description,
.bayon-title-metadata { padding: 1.5rem clamp(1.5rem, 4vw, 2.5rem); border-top: 1px solid var(--bayon-border); }
.bayon-title-description p { margin: 0.8rem 0 0; color: var(--bayon-text-muted); line-height: 1.75; }
.bayon-title-sidebar { display: grid; gap: 1rem; position: sticky; top: 6rem; }
.bayon-hold-card { background: linear-gradient(155deg, color-mix(in srgb, var(--bayon-brand-500) 6%, var(--bayon-surface)), var(--bayon-surface)); }
.bayon-hold-state { display: grid; gap: 0.45rem; padding: 0.9rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-sm); background: var(--bayon-surface-subtle); }
.bayon-hold-state .bayon-status { justify-self: start; }
.bayon-hold-state small { color: var(--bayon-text-muted); }
.bayon-copy-location-list { display: grid; }
.bayon-copy-location-item { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.9rem 1.1rem; border-top: 1px solid var(--bayon-border); }
.bayon-copy-location-item:first-child { border-top: 0; }
.bayon-copy-location-item strong,
.bayon-copy-location-item small { display: block; }
.bayon-copy-location-item strong { font-size: 0.82rem; }
.bayon-copy-location-item small { margin-top: 0.2rem; color: var(--bayon-text-muted); font-size: 0.72rem; }

/* ========================================================================== 
   4. Authentication and installer
   ========================================================================== */
.bayon-auth-body { min-height: 100vh; background: radial-gradient(circle at 15% 15%, color-mix(in srgb, var(--bayon-primary-bg) 13%, transparent), transparent 32rem), var(--bayon-page-bg); }
.bayon-auth-top-actions {
  position:fixed;
  top:1rem;
  right:1rem;
  z-index:1030;
  display:flex;
  align-items:center;
  gap:.5rem;
}
.bayon-auth-shell { min-height: 100vh; display: grid; place-items: center; padding: 4.75rem 1.5rem 1.5rem; outline: 0; }
.bayon-auth-shell:focus,
.bayon-auth-shell:focus-visible { outline: 0; box-shadow: none; }
.bayon-auth-card { width: min(100%, 31rem); padding: clamp(1.5rem, 5vw, 2.5rem); border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-xl); background: var(--bayon-surface); box-shadow: var(--bayon-shadow-md); }
.bayon-auth-card-wide { width: min(100%, 48rem); }
.bayon-auth-brand { display: flex; align-items: center; gap: 0.75rem; }
.bayon-auth-brand strong,
.bayon-auth-brand small { display: block; }
.bayon-auth-brand small { color: var(--bayon-text-muted); font-size: 0.82rem; }
.bayon-auth-input-wrap { position: relative; }
.bayon-auth-input-leading { padding-left: 3rem; }
.bayon-auth-input-trailing { padding-right: 3rem; }
.bayon-auth-field-icon,
.bayon-auth-password-toggle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
  display: inline-grid;
  place-items: center;
  color: var(--bayon-text-muted);
}
.bayon-auth-field-icon { left: 0.65rem; pointer-events: none; }
.bayon-auth-password-toggle {
  right: 0.55rem;
  border: 0;
  border-radius: 0.6rem;
  background: transparent;
  padding: 0;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  line-height: 1;
}
.bayon-auth-password-toggle:hover,
.bayon-auth-password-toggle:focus-visible { background: var(--bayon-surface-soft); color: var(--bayon-text); }
.bayon-auth-password-toggle:focus-visible { outline: 2px solid color-mix(in srgb, var(--bayon-primary-bg) 32%, transparent); outline-offset: 1px; }
.bayon-auth-field-icon svg,
.bayon-auth-password-toggle svg {
  display: block;
  width: 1.15rem;
  height: 1.15rem;
  max-width: 1.15rem;
  max-height: 1.15rem;
  flex: 0 0 1.15rem;
  fill: currentColor;
}
.bayon-auth-password-toggle .bayon-auth-eye-show,
.bayon-auth-password-toggle .bayon-auth-eye-hide { display: block; }
.bayon-auth-password-toggle .bayon-auth-eye-show[hidden],
.bayon-auth-password-toggle .bayon-auth-eye-hide[hidden] { display: none !important; }

.bayon-auth-field-icon,
.bayon-auth-password-toggle { overflow: hidden; }
.bayon-auth-field-icon svg,
.bayon-auth-password-toggle svg { pointer-events: none; }

.bayon-auth-inline-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  color: var(--bayon-text-muted);
  font-size: 0.84rem;
  line-height: 1.45;
  text-align: center;
}
.bayon-auth-inline-actions a {
  color: var(--bayon-brand-600);
  font-weight: 800;
  text-decoration: none;
  text-underline-offset: 0.16em;
}
[data-bs-theme="dark"] .bayon-auth-inline-actions a {
  color: #b7c2ff;
}
.bayon-auth-inline-actions a:hover {
  text-decoration: underline;
}
.bayon-auth-inline-actions a:focus-visible {
  border-radius: 0.25rem;
  outline: 2px solid color-mix(in srgb, var(--bayon-primary-bg) 34%, transparent);
  outline-offset: 3px;
}
.bayon-auth-inline-separator {
  color: var(--bayon-border-strong);
  font-size: 0.72rem;
  line-height: 1;
}
.bayon-auth-code { color: var(--bayon-primary-bg); font-weight: 850; font-size: clamp(3rem, 10vw, 5rem); letter-spacing: -0.06em; }
.bayon-requirements { display: grid; gap: 0.55rem; padding: 0.8rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); background: var(--bayon-surface-soft); }
.bayon-requirement-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.55rem 0.65rem; font-size: 0.86rem; }
.bayon-install-success { width: 4rem; height: 4rem; display: inline-grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--bayon-success) 14%, var(--bayon-surface)); color: var(--bayon-success); font-size: 1.75rem; font-weight: 850; }

/* ========================================================================== 
   5. Administration shell
   ========================================================================== */
.bayon-admin-body { background: var(--bayon-page-bg); color: var(--bayon-text); }
.bayon-admin-shell { min-height: 100vh; }
.bayon-admin-sidebar { --bs-offcanvas-width: 17.75rem; background: var(--bayon-surface); border-right: 1px solid var(--bayon-border); color: var(--bayon-text); }
.bayon-sidebar-mobile-header { border-bottom: 1px solid var(--bayon-border); }
.bayon-sidebar-inner { min-height: 100%; display: flex; flex-direction: column; padding: 1.15rem 0.9rem; }
.bayon-sidebar-brand { display: flex; align-items: center; gap: 0.75rem; padding: 0.45rem 0.55rem 1.35rem; color: var(--bayon-text) !important; }
.bayon-sidebar-brand > span:last-child { min-width: 0; display: grid; }
.bayon-sidebar-brand strong { overflow: hidden; font-size: 0.86rem; text-overflow: ellipsis; white-space: nowrap; }
.bayon-sidebar-brand small { margin-top: 0.12rem; color: var(--bayon-text-muted); font-size: 0.64rem; }
.bayon-sidebar-nav { display: grid; gap: 1.2rem; }
.bayon-nav-section { display: grid; gap: 0.22rem; }
.bayon-nav-label { padding: 0 0.7rem 0.35rem; color: var(--bayon-text-muted); font-size: 0.64rem; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }
.bayon-nav-link { display: flex; align-items: center; gap: 0.68rem; min-height: 2.55rem; padding: 0.5rem 0.65rem; border: 1px solid transparent; border-radius: var(--bayon-radius-sm); color: var(--bayon-text-muted) !important; font-size: 0.82rem; font-weight: 700; text-decoration: none; }
.bayon-nav-link:hover { background: var(--bayon-surface-soft); color: var(--bayon-text) !important; }
.bayon-nav-link.is-active { border-color: color-mix(in srgb, var(--bayon-brand-500) 14%, var(--bayon-border)); background: color-mix(in srgb, var(--bayon-brand-500) 8%, var(--bayon-surface)); color: var(--bayon-brand-600) !important; box-shadow: var(--bayon-shadow-xs); }
[data-bs-theme="dark"] .bayon-nav-link.is-active { color: #c5d0ff !important; }
.bayon-nav-icon { width: 1.65rem; height: 1.65rem; flex: 0 0 auto; display: inline-grid; place-items: center; border-radius: 0.55rem; background: var(--bayon-surface-soft); color: currentColor; }
.bayon-nav-icon svg { width: 1rem; height: 1rem; }
.bayon-nav-link.is-active .bayon-nav-icon { background: color-mix(in srgb, var(--bayon-brand-500) 13%, var(--bayon-surface)); }
.bayon-sidebar-footer { margin-top: auto; display: flex; align-items: end; justify-content: space-between; gap: 0.75rem; padding: 1rem 0.55rem 0; border-top: 1px solid var(--bayon-border); color: var(--bayon-text-muted); }
.bayon-sidebar-footer > div { display: grid; gap: 0.4rem; }
.bayon-sidebar-footer small { font-size: 0.62rem; }
.bayon-environment-badge { justify-self: start; padding: 0.32rem 0.55rem; border: 1px solid var(--bayon-border); background: var(--bayon-surface-soft); color: var(--bayon-text-muted); }
.bayon-sidebar-public-link { width: 2rem; height: 2rem; display: grid; place-items: center; border: 1px solid var(--bayon-border); border-radius: 0.65rem; color: var(--bayon-text-muted) !important; text-decoration: none; }
.bayon-sidebar-public-link:hover { background: var(--bayon-surface-soft); color: var(--bayon-text) !important; }
.bayon-admin-main { min-width: 0; }
.bayon-admin-topbar { position: sticky; top: 0; z-index: 1010; min-height: 4.7rem; display: grid; grid-template-columns: minmax(12rem, 1fr) minmax(14rem, 26rem) minmax(12rem, 1fr); align-items: center; gap: 1rem; padding: 0.72rem clamp(1rem, 2.5vw, 1.8rem); border-bottom: 1px solid var(--bayon-border); background: color-mix(in srgb, var(--bayon-page-bg) 88%, transparent); backdrop-filter: blur(18px); }
.bayon-topbar-leading { min-width: 0; }
.bayon-topbar-heading { min-width: 0; }
.bayon-topbar-context { overflow: hidden; color: var(--bayon-text-muted); font-size: 0.65rem; font-weight: 750; letter-spacing: 0.04em; text-overflow: ellipsis; white-space: nowrap; }
.bayon-topbar-context span { margin-inline: 0.3rem; opacity: 0.5; }
.bayon-topbar-title { margin-top: 0.1rem; font-size: 0.82rem; font-weight: 750; }
.bayon-admin-search { min-height: 2.55rem; display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.45rem; padding: 0 0.7rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-sm); background: var(--bayon-surface); box-shadow: var(--bayon-shadow-xs); }
.bayon-admin-search .form-control { min-height: 0; padding: 0; border: 0; background: transparent; box-shadow: none; font-size: 0.78rem; }
.bayon-admin-search kbd { padding: 0.2rem 0.4rem; border: 1px solid var(--bayon-border); border-radius: 0.35rem; background: var(--bayon-surface-soft); color: var(--bayon-text-muted); font-family: inherit; font-size: 0.62rem; font-weight: 750; }
.bayon-topbar-actions { justify-self: end; }
.bayon-profile-button { min-height: 2.7rem; display: flex; align-items: center; gap: 0.62rem; padding: 0.3rem 0.5rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-sm); background: var(--bayon-surface); color: var(--bayon-text); }
.bayon-profile-button:hover { background: var(--bayon-surface-soft); color: var(--bayon-text); }
.bayon-profile-button strong,
.bayon-profile-button small { display: block; line-height: 1.15; }
.bayon-profile-button strong { max-width: 10rem; overflow: hidden; font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; }
.bayon-profile-button small { margin-top: 0.16rem; color: var(--bayon-text-muted); font-size: 0.62rem; }
.bayon-admin-content { padding: clamp(1.25rem, 3vw, 2rem); }
.bayon-page-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.5rem; }
.bayon-page-title { font-size: clamp(1.85rem, 4vw, 2.65rem); letter-spacing: -0.04em; font-weight: 825; }
.bayon-page-description { max-width: 45rem; color: var(--bayon-text-muted); line-height: 1.6; }
.bayon-heading-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.55rem; }

.bayon-stat-card,
.bayon-panel,
.bayon-card { border: 1px solid var(--bayon-border); background: var(--bayon-surface); border-radius: var(--bayon-radius-md); box-shadow: var(--bayon-shadow-xs); }
.bayon-card { height: 100%; border-radius: var(--bayon-radius-lg); }
.bayon-card p { color: var(--bayon-text-muted); }
.bayon-stat-card { padding: 1.1rem; }
.bayon-stat-card-pro { position: relative; overflow: hidden; }
.bayon-stat-card-pro::after { content: ""; position: absolute; width: 4rem; height: 4rem; right: -2rem; bottom: -2rem; border: 1px solid color-mix(in srgb, var(--bayon-brand-500) 12%, transparent); border-radius: 50%; }
.bayon-stat-label { color: var(--bayon-text-muted); font-size: 0.72rem; font-weight: 700; }
.bayon-stat-index { color: var(--bayon-text-muted); font-size: 0.64rem; font-weight: 750; opacity: 0.6; }
.bayon-stat-value { margin-top: 0.58rem; font-size: clamp(1.65rem, 3.5vw, 2.1rem); line-height: 1; letter-spacing: -0.045em; font-weight: 825; }
.bayon-stat-text { font-size: clamp(1.15rem, 2.5vw, 1.55rem); }
.bayon-stat-meta { margin-top: 0.6rem; color: var(--bayon-text-muted); font-size: 0.7rem; }
.bayon-panel { overflow: hidden; }
.bayon-panel-header { min-height: 4.3rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.15rem; border-bottom: 1px solid var(--bayon-border); }
.bayon-panel-header h2 { letter-spacing: -0.015em; }
.bayon-panel-header p { color: var(--bayon-text-muted); font-size: 0.76rem; }
.bayon-panel-body { padding: 1.15rem; }

.bayon-attention-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; }
.bayon-attention-card { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.8rem; padding: 0.9rem 1rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); background: var(--bayon-surface); color: var(--bayon-text) !important; text-decoration: none; box-shadow: var(--bayon-shadow-xs); }
.bayon-attention-card:hover { transform: translateY(-1px); border-color: var(--bayon-border-strong); box-shadow: var(--bayon-shadow-sm); }
.bayon-attention-card strong,
.bayon-attention-card small { display: block; }
.bayon-attention-card strong { font-size: 0.82rem; }
.bayon-attention-card small { margin-top: 0.2rem; color: var(--bayon-text-muted); font-size: 0.68rem; }
.bayon-attention-icon { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 0.65rem; background: var(--bayon-surface-soft); color: var(--bayon-text-muted); font-size: 0.72rem; font-weight: 850; }
.bayon-attention-card.is-danger .bayon-attention-icon { background: color-mix(in srgb, var(--bayon-danger) 12%, var(--bayon-surface)); color: var(--bayon-danger); }
.bayon-attention-card.is-warning .bayon-attention-icon { background: color-mix(in srgb, var(--bayon-warning) 12%, var(--bayon-surface)); color: var(--bayon-warning); }
.bayon-attention-card.is-info .bayon-attention-icon { background: color-mix(in srgb, var(--bayon-info) 12%, var(--bayon-surface)); color: var(--bayon-info); }
.bayon-progress-row + .bayon-progress-row { margin-top: 1.35rem; }
.bayon-progress-row > div:first-child { margin-bottom: 0.5rem; font-size: 0.78rem; }
.bayon-progress-row .progress { height: 0.5rem; background: var(--bayon-surface-soft); }
.bayon-progress-row .progress-bar { width: 0; border-radius: 999px; background: var(--bayon-brand-500); transition: width 320ms ease; }
.bayon-progress-row .progress-bar.is-secondary { background: var(--bayon-info); }
.bayon-snapshot-list { display: grid; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); overflow: hidden; }
.bayon-snapshot-list > div { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.78rem 0.9rem; }
.bayon-snapshot-list > div + div { border-top: 1px solid var(--bayon-border); }
.bayon-snapshot-list span { color: var(--bayon-text-muted); font-size: 0.75rem; }
.bayon-snapshot-list strong { font-size: 0.82rem; }
.bayon-quick-actions { display: grid; gap: 0.6rem; }
.bayon-action-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.78rem 0.85rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-sm); background: transparent; color: var(--bayon-text) !important; text-align: left; text-decoration: none; }
.bayon-action-row:hover { background: var(--bayon-surface-soft); border-color: var(--bayon-border-strong); }
.bayon-action-row strong,
.bayon-action-row small { display: block; }
.bayon-action-row strong { font-size: 0.78rem; }
.bayon-action-row small { margin-top: 0.18rem; color: var(--bayon-text-muted); font-size: 0.67rem; }

.bayon-table { --bs-table-bg: transparent; --bs-table-color: var(--bayon-text); --bs-table-border-color: var(--bayon-border); }
.bayon-table th { padding: 0.75rem 1.05rem; border-bottom-width: 1px; background: var(--bayon-surface-subtle); color: var(--bayon-text-muted); font-size: 0.65rem; font-weight: 800; letter-spacing: 0.055em; text-transform: uppercase; white-space: nowrap; }
.bayon-table td { padding: 0.88rem 1.05rem; font-size: 0.8rem; vertical-align: middle; }
.bayon-table tbody tr:hover > * { background: color-mix(in srgb, var(--bayon-brand-500) 2.5%, transparent); }
.bayon-table strong { font-weight: 750; }

/* Account workspace */
.bayon-account-admin { width: 100%; }
.bayon-account-public { min-height: 55vh; }
.bayon-account-anchor { scroll-margin-top: 6rem; }
.bayon-account-hero { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.25rem 1.35rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-lg); background: linear-gradient(120deg, color-mix(in srgb, var(--bayon-brand-500) 7%, var(--bayon-surface)), var(--bayon-surface)); box-shadow: var(--bayon-shadow-xs); }
.bayon-account-identity { min-width: 0; display: flex; align-items: center; gap: 1rem; }
.bayon-member-mark { width: 3.5rem; height: 3.5rem; flex: 0 0 auto; display: grid; place-items: center; border-radius: 1rem; background: var(--bayon-brand-600); color: #fff; font-size: 1.25rem; font-weight: 850; box-shadow: 0 10px 24px color-mix(in srgb, var(--bayon-brand-500) 20%, transparent); }
.bayon-account-hero-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.5rem; }
.bayon-account-notice { display: inline-flex; gap: 0.35rem; padding: 0.55rem 0.7rem; border: 1px solid color-mix(in srgb, var(--bayon-success) 22%, var(--bayon-border)); border-radius: 999px; background: color-mix(in srgb, var(--bayon-success) 8%, var(--bayon-surface)); color: var(--bayon-success); font-size: 0.72rem; }
.bayon-account-notice.is-danger { border-color: color-mix(in srgb, var(--bayon-danger) 22%, var(--bayon-border)); background: color-mix(in srgb, var(--bayon-danger) 8%, var(--bayon-surface)); color: var(--bayon-danger); }
.bayon-reservation-stack { display: grid; gap: 0.7rem; }
.bayon-reservation-item { padding: 0.9rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-sm); background: var(--bayon-surface-subtle); }
.bayon-reservation-title { color: var(--bayon-text) !important; font-size: 0.82rem; font-weight: 750; text-decoration: none; }
.bayon-reservation-title:hover { color: var(--bayon-brand-600) !important; }
.bayon-reservation-meta { display: flex; flex-wrap: wrap; gap: 0.35rem 0.7rem; color: var(--bayon-text-muted); font-size: 0.68rem; }
.bayon-reservation-meta span + span::before { content: "·"; margin-right: 0.7rem; }

/* ========================================================================== 
   6. Catalog and forms
   ========================================================================== */
.bayon-catalog-toolbar { display: grid; grid-template-columns: minmax(14rem, 2fr) repeat(3, minmax(9rem, 1fr)) auto; gap: 0.75rem; align-items: end; }
.bayon-catalog-title { min-width: 16rem; }
.bayon-catalog-title strong { display: block; font-size: 0.86rem; }
.bayon-catalog-title small { display: block; margin-top: 0.2rem; color: var(--bayon-text-muted); }
.bayon-catalog-meta { color: var(--bayon-text-muted); font-size: 0.74rem; }
.bayon-catalog-count { min-width: 5.5rem; }
.bayon-catalog-count strong { display: block; font-size: 0.84rem; }
.bayon-catalog-count small { color: var(--bayon-text-muted); }
.bayon-form-section + .bayon-form-section { border-top: 1px solid var(--bayon-border); }
.bayon-form-section { padding: 1.15rem; }
.bayon-form-section-title { font-size: 0.78rem; font-weight: 800; letter-spacing: 0.045em; text-transform: uppercase; }
.bayon-form-help { color: var(--bayon-text-muted); font-size: 0.72rem; line-height: 1.5; }
.bayon-form-section .form-label { font-size: 0.72rem; font-weight: 750; }
.bayon-form-section textarea.form-control { min-height: 8rem; }
.bayon-copy-table input.form-control,
.bayon-copy-table select.form-select { min-width: 7.25rem; font-size: 0.76rem; }
.bayon-copy-table .bayon-copy-barcode { min-width: 9rem; }
.bayon-copy-table .bayon-copy-location { min-width: 9rem; }
.bayon-copy-table .bayon-copy-status { min-width: 8rem; }
.bayon-empty-catalog { padding: 3.5rem 1.25rem; text-align: center; color: var(--bayon-text-muted); }
.bayon-empty-state { display: grid; justify-items: center; gap: 0.35rem; padding: 2rem 1.2rem; color: var(--bayon-text-muted); text-align: center; }
.bayon-empty-state strong { color: var(--bayon-text); font-size: 0.85rem; }
.bayon-empty-state span { max-width: 28rem; font-size: 0.75rem; line-height: 1.5; }
.bayon-empty-state-large { min-height: 19rem; align-content: center; border: 1px dashed var(--bayon-border-strong); border-radius: var(--bayon-radius-lg); background: var(--bayon-surface); }
.bayon-empty-mark { width: 3.25rem; height: 3.25rem; display: grid; place-items: center; margin-bottom: 0.4rem; border-radius: 1rem; background: var(--bayon-surface-soft); font-size: 1.4rem; }
.bayon-stat-code { font-size: clamp(1rem, 2vw, 1.35rem); overflow-wrap: anywhere; }
.bayon-detail-list { display: grid; }
.bayon-detail-list > div { display: flex; align-items: start; justify-content: space-between; gap: 1rem; padding: 0.78rem 0; border-bottom: 1px solid var(--bayon-border); }
.bayon-detail-list > div:last-child { border-bottom: 0; }
.bayon-detail-list span { color: var(--bayon-text-muted); font-size: 0.75rem; }
.bayon-detail-list strong { max-width: 66%; text-align: right; font-size: 0.78rem; }

/* ========================================================================== 
   7. Library operations
   ========================================================================== */
.bayon-policy-grid { display: grid; grid-template-columns: minmax(11rem, 1.6fr) repeat(7, minmax(6rem, 0.8fr)) minmax(7rem, 0.9fr); gap: 0.75rem; padding: 1rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); background: var(--bayon-surface-soft); }
.bayon-reservation-policy-grid { grid-template-columns: minmax(13rem, 2fr) minmax(7rem, 0.7fr) minmax(7rem, 0.7fr) minmax(8rem, 0.8fr); }
.bayon-policy-summary { display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; align-items: center; padding: 1rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); }
.bayon-policy-summary span { color: var(--bayon-text-muted); font-size: 0.76rem; }
.bayon-danger-zone { border-color: color-mix(in srgb, var(--bayon-danger) 32%, var(--bayon-border)); }
.bayon-mini-metric { height: 100%; padding: 1rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); background: var(--bayon-surface-soft); }
.bayon-mini-metric span { display: block; margin-bottom: 0.35rem; color: var(--bayon-text-muted); font-size: 0.74rem; }
.bayon-mini-metric strong { display: block; overflow-wrap: anywhere; }
.bayon-receive-qty { width: 5.5rem; }
.bayon-receive-cost { width: 7rem; }

/* ========================================================================== 
   8. Reports and analytics
   ========================================================================== */
.bayon-report-card { min-height: 11.5rem; display: flex; flex-direction: column; gap: 0.7rem; padding: 1.2rem; border: 1px solid var(--bayon-border); border-radius: var(--bayon-radius-md); background: var(--bayon-surface); color: var(--bayon-text) !important; box-shadow: var(--bayon-shadow-xs); text-decoration: none; transition: transform var(--bayon-transition), border-color var(--bayon-transition), box-shadow var(--bayon-transition); }
.bayon-report-card:hover { transform: translateY(-2px); border-color: var(--bayon-border-strong); box-shadow: var(--bayon-shadow-sm); }
.bayon-report-card-kicker { color: var(--bayon-text-muted); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.bayon-report-card strong { font-size: 1.02rem; }
.bayon-report-card > span:not(.bayon-report-card-kicker):not(.bayon-report-card-link) { color: var(--bayon-text-muted); font-size: 0.8rem; line-height: 1.5; }
.bayon-report-card-link { margin-top: auto; display: flex; align-items: center; justify-content: space-between; color: var(--bayon-brand-600); font-size: 0.76rem; font-weight: 750; }
.bayon-report-trend { display: grid; gap: 0.85rem; }
.bayon-trend-row { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: 1rem; align-items: start; }
.bayon-trend-row time { padding-top: 0.15rem; color: var(--bayon-text-muted); font-size: 0.7rem; font-weight: 700; }
.bayon-trend-bars { display: grid; gap: 0.42rem; }
.bayon-trend-bars > div { display: grid; grid-template-columns: 3rem minmax(0, 1fr) 2.2rem; gap: 0.55rem; align-items: center; }
.bayon-trend-bars span,
.bayon-trend-bars b { font-size: 0.68rem; }
.bayon-trend-bars span { color: var(--bayon-text-muted); }
.bayon-trend-bars b { text-align: right; font-weight: 750; }
.bayon-trend-bars progress { width: 100%; height: 0.42rem; border: 0; border-radius: 999px; overflow: hidden; background: var(--bayon-surface-soft); appearance: none; }
.bayon-trend-bars progress::-webkit-progress-bar { background: var(--bayon-surface-soft); }
.bayon-trend-bars progress::-webkit-progress-value,
.bayon-trend-bars progress::-moz-progress-bar { background: var(--bayon-primary-bg); }
.bayon-report-print-meta { align-items: center; justify-content: space-between; gap: 2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--bayon-border); }
.bayon-report-print-meta > div { display: grid; gap: 0.2rem; }
.bayon-report-print-meta span { color: var(--bayon-text-muted); font-size: 0.76rem; }
.bayon-report-table td,
.bayon-report-table th { white-space: nowrap; }
.bayon-report-table td:nth-child(2),
.bayon-report-table td:nth-child(3) { white-space: normal; }

/* ========================================================================== 
   9. Staff, roles and settings
   ========================================================================== */
.bayon-role-badge { display: inline-flex; align-items: center; padding: 0.32rem 0.56rem; border: 1px solid var(--bayon-border); border-radius: 999px; background: var(--bayon-surface-soft); color: var(--bayon-text); font-size: 0.7rem; font-weight: 750; }
.bayon-permission-table th:not(:first-child),
.bayon-permission-table td:not(:first-child) { min-width: 8rem; text-align: center; }
.bayon-permission-mark { width: 1.8rem; height: 1.8rem; display: inline-grid; place-items: center; border: 1px solid var(--bayon-border); border-radius: 50%; background: var(--bayon-surface-soft); color: var(--bayon-text-muted); font-weight: 800; }
.bayon-permission-mark.is-on { border-color: color-mix(in srgb, var(--bayon-brand-500) 28%, var(--bayon-border)); background: color-mix(in srgb, var(--bayon-brand-500) 9%, var(--bayon-surface)); color: var(--bayon-brand-600); }
.bayon-security-list { display: grid; gap: 0.8rem; padding-left: 1.15rem; color: var(--bayon-text-muted); font-size: 0.82rem; }
.bayon-security-list li::marker { color: var(--bayon-brand-500); }

/* ========================================================================== 
   10. Responsive behavior
   ========================================================================== */
@media (min-width: 992px) {
  .bayon-admin-shell { display: grid; grid-template-columns: 17.75rem minmax(0, 1fr); }
  .bayon-admin-sidebar { position: sticky; top: 0; height: 100vh; visibility: visible !important; transform: none !important; }
}
@media (max-width: 1399.98px) {
  .bayon-policy-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .bayon-policy-title { grid-column: span 2; }
  .bayon-reservation-policy-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1199.98px) {
  .bayon-catalog-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bayon-catalog-toolbar .bayon-search-field { grid-column: 1 / -1; }
  .bayon-catalog-search-panel { grid-template-columns: minmax(12rem, 1.5fr) 1fr 1fr; }
  .bayon-catalog-search-panel > .btn { grid-column: 1 / -1; }
  .bayon-admin-topbar { grid-template-columns: minmax(10rem, 1fr) minmax(12rem, 22rem) auto; }
}
@media (max-width: 991.98px) {
  .bayon-navbar .navbar-collapse { padding: 0.8rem 0 0.25rem; border-top: 1px solid var(--bayon-border); margin-top: 0.8rem; }
  .bayon-public-profile { justify-content: flex-start; }
  .bayon-home-hero-grid { grid-template-columns: 1fr; }
  .bayon-home-overview { min-height: auto; }
  .bayon-title-sidebar { position: static; }
  .bayon-admin-topbar { grid-template-columns: minmax(0, 1fr) auto; }
  .bayon-admin-search { display: none !important; }
  .bayon-attention-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767.98px) {
  .bayon-shell { width: min(100% - 1.25rem, 1220px); }
  .bayon-page-heading,
  .bayon-section-heading { align-items: flex-start; flex-direction: column; }
  .bayon-heading-actions { width: 100%; justify-content: flex-start; }
  .bayon-heading-actions .btn { flex: 1 1 auto; }
  .bayon-home-capabilities { grid-template-columns: 1fr; gap: 0.75rem; }
  .bayon-home-service-grid { grid-template-columns: 1fr; }
  .bayon-home-section-heading { align-items: flex-start; flex-direction: column; }
  .bayon-title-card { grid-template-columns: 8.75rem minmax(0, 1fr); }
  .bayon-catalog-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bayon-catalog-search-panel { grid-template-columns: 1fr 1fr; }
  .bayon-catalog-search-main { grid-column: 1 / -1; }
  .bayon-catalog-search-panel > .btn { grid-column: 1 / -1; }
  .bayon-title-detail-top { grid-template-columns: 1fr; }
  .bayon-title-detail-cover { width: 10rem; min-height: 14rem; }
  .bayon-title-detail-facts { grid-template-columns: 1fr 1fr; }
  .bayon-account-hero { align-items: flex-start; flex-direction: column; }
  .bayon-account-hero-actions { justify-content: flex-start; }
  .bayon-attention-grid { grid-template-columns: 1fr; }
  .bayon-policy-grid,
  .bayon-reservation-policy-grid { grid-template-columns: 1fr 1fr; }
  .bayon-policy-title { grid-column: 1 / -1; }
  .bayon-detail-list > div { flex-direction: column; gap: 0.25rem; }
  .bayon-detail-list strong { max-width: 100%; text-align: left; }
  .bayon-trend-row { grid-template-columns: 1fr; gap: 0.35rem; }
  .bayon-report-card { min-height: 9.75rem; }
  .bayon-pagination-wrap { align-items: flex-start; flex-direction: column; }
  .bayon-permission-table th:not(:first-child),
  .bayon-permission-table td:not(:first-child) { min-width: 6.5rem; }
}
@media (max-width: 575.98px) {
  .bayon-home-hero { padding-top: 3.4rem; }
  .bayon-home-title { font-size: clamp(2.6rem, 13vw, 3.75rem); }
  .bayon-home-search { grid-template-columns: auto minmax(0, 1fr); padding: 0.55rem; }
  .bayon-home-search .btn { grid-column: 1 / -1; width: 100%; }
  .bayon-home-service { grid-template-columns: 1fr; }
  .bayon-catalog-toolbar { grid-template-columns: 1fr; }
  .bayon-catalog-toolbar .bayon-search-field { grid-column: auto; }
  .bayon-catalog-search-panel { grid-template-columns: 1fr; }
  .bayon-catalog-search-main,
  .bayon-catalog-search-panel > .btn { grid-column: auto; }
  .bayon-catalog-summary > div { padding: 0.75rem 0.4rem; }
  .bayon-catalog-summary strong { font-size: 1rem; }
  .bayon-title-card { grid-template-columns: 7.6rem minmax(0, 1fr); }
  .bayon-title-detail-facts { grid-template-columns: 1fr; }
  .bayon-account-identity { align-items: flex-start; }
  .bayon-member-mark { width: 3rem; height: 3rem; }
}
@media (max-width: 479.98px) {
  .bayon-policy-grid,
  .bayon-reservation-policy-grid { grid-template-columns: 1fr; }
  .bayon-policy-title { grid-column: auto; }
  .bayon-receive-qty,
  .bayon-receive-cost { width: 100%; }
}

/* ========================================================================== 
   11. Print reports
   ========================================================================== */
@media print {
  @page { size: landscape; margin: 12mm; }
  html,
  body { background: #fff !important; color: #111 !important; }
  .bayon-admin-sidebar,
  .bayon-admin-topbar,
  .d-print-none { display: none !important; }
  .bayon-admin-shell,
  .bayon-admin-main { display: block !important; min-height: auto !important; }
  .bayon-admin-content { padding: 0 !important; }
  .bayon-page-heading { margin-bottom: 1rem; }
  .bayon-page-title { font-size: 1.6rem !important; color: #111 !important; }
  .bayon-page-description,
  .text-muted,
  .bayon-stat-label,
  .bayon-stat-meta { color: #555 !important; }
  .bayon-panel,
  .bayon-stat-card { border-color: #d9d9d9 !important; box-shadow: none !important; background: #fff !important; break-inside: avoid; }
  .bayon-table { --bs-table-bg: #fff; --bs-table-color: #111; --bs-table-border-color: #ddd; font-size: 8pt; }
  .bayon-table th,
  .bayon-table td { padding: 0.35rem 0.45rem !important; color: #111 !important; }
  .bayon-status { border-color: #bbb !important; color: #111 !important; background: #fff !important; }
  .bayon-report-table-panel,
  .table-responsive { overflow: visible !important; }
}

/* ========================================================================== 
   12. Premium one-click installer
   ========================================================================== */
.bayon-installer-body {
  --bayon-installer-bg: #091322;
  --bayon-installer-sidebar: #0c1930;
  --bayon-installer-sidebar-2: #0a172b;
  --bayon-installer-workspace: #0b1627;
  --bayon-installer-panel: #101d30;
  --bayon-installer-panel-strong: #132238;
  --bayon-installer-border: rgba(155, 177, 211, 0.17);
  --bayon-installer-border-strong: rgba(155, 177, 211, 0.27);
  --bayon-installer-text: #f5f7fb;
  --bayon-installer-muted: #9eacc0;
  --bayon-installer-accent: #4f63ff;
  --bayon-installer-accent-2: #6a43ff;
  --bayon-installer-success: #20c984;
  min-height: 100vh;
  background: var(--bayon-installer-bg);
}
[data-bs-theme="light"] .bayon-installer-body {
  --bayon-installer-bg: #f4f6fb;
  --bayon-installer-sidebar: #16243b;
  --bayon-installer-sidebar-2: #122038;
  --bayon-installer-workspace: #f8faff;
  --bayon-installer-panel: #ffffff;
  --bayon-installer-panel-strong: #f7f9fd;
  --bayon-installer-border: rgba(27, 42, 64, 0.12);
  --bayon-installer-border-strong: rgba(27, 42, 64, 0.2);
  --bayon-installer-text: #152033;
  --bayon-installer-muted: #66758a;
  --bayon-installer-success: #168a62;
}
.bayon-modal-open { overflow: hidden; }
.bayon-installer-page { min-height: 100vh; }
.bayon-installer-frame {
  width: 100%;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 20rem minmax(0, 1fr);
  background: var(--bayon-installer-workspace);
  color: var(--bayon-installer-text);
}
.bayon-installer-sidebar {
  min-width: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 1.6rem 1.5rem 1.5rem;
  border-right: 1px solid rgba(255,255,255,0.075);
  background:
    radial-gradient(circle at 22% 2%, rgba(92, 72, 255, 0.16), transparent 18rem),
    linear-gradient(180deg, var(--bayon-installer-sidebar), var(--bayon-installer-sidebar-2));
  color: #fff;
}
.bayon-installer-sidebar-head {
  min-height: 4rem;
  display: flex;
  align-items: flex-start;
  padding: 0 0.45rem 1.35rem;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.bayon-installer-sidebar-head .bayon-auth-brand { display: flex; align-items: center; gap: 0.8rem; color: #fff; }
.bayon-installer-sidebar-head .bayon-auth-brand strong,
.bayon-installer-sidebar-head .bayon-auth-brand small { display: block; }
.bayon-installer-sidebar-head .bayon-auth-brand strong { font-size: 1.05rem; font-weight: 800; line-height: 1.2; }
.bayon-installer-sidebar-head .bayon-auth-brand small { margin-top: 0.2rem; color: #9facbf; font-size: 0.78rem; }
.bayon-installer-sidebar .bayon-brand-mark {
  width: 2.7rem;
  height: 2.7rem;
  border-radius: 0.8rem;
  background: linear-gradient(145deg, #6e48ff, #4734d1);
  box-shadow: 0 12px 28px rgba(91, 67, 255, 0.28);
}
.bayon-installer-steps { display: grid; gap: 0.55rem; padding-top: 1.4rem; }
.bayon-installer-step-item {
  display: grid;
  grid-template-columns: 2.7rem minmax(0, 1fr);
  align-items: center;
  gap: 0.8rem;
  min-height: 4.9rem;
  padding: 0.8rem 0.85rem;
  border: 1px solid transparent;
  border-radius: 0.9rem;
  color: #d8e1ee;
}
.bayon-installer-step-item.is-current {
  border-color: rgba(85, 111, 255, 0.18);
  background: linear-gradient(120deg, rgba(55, 92, 198, 0.27), rgba(63, 69, 168, 0.16));
  color: #fff;
}
.bayon-installer-step-item.is-complete { color: #fff; }
.bayon-installer-step-item.is-upcoming { color: #aab7c8; opacity: 0.92; }
.bayon-installer-step-number {
  width: 2.45rem;
  height: 2.45rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(155, 177, 211, 0.32);
  border-radius: 50%;
  background: rgba(8, 20, 37, 0.18);
  color: #dbe4f2;
  font-size: 0.85rem;
  font-weight: 850;
}
.bayon-installer-step-item.is-current .bayon-installer-step-number {
  border-color: #6e86ff;
  background: linear-gradient(145deg, #4669ff, #583cff);
  color: #fff;
  box-shadow: 0 0 0 3px rgba(79, 99, 255, 0.09);
}
.bayon-installer-step-item.is-complete .bayon-installer-step-number {
  border-color: rgba(32, 201, 132, 0.7);
  background: rgba(32, 201, 132, 0.13);
  color: #44e2a3;
}
.bayon-installer-step-copy { min-width: 0; display: grid; gap: 0.18rem; }
.bayon-installer-step-copy strong { color: inherit; font-size: 0.91rem; font-weight: 760; }
.bayon-installer-step-copy small { color: #96a7bd; font-size: 0.7rem; letter-spacing: 0.01em; }
.bayon-installer-sidebar-foot {
  display: grid;
  grid-template-columns: 2.3rem minmax(0,1fr);
  align-items: start;
  gap: 0.75rem;
  margin-top: auto;
  padding: 1.35rem 0.45rem 0;
  border-top: 1px solid rgba(255,255,255,0.1);
}
.bayon-installer-security-icon {
  width: 2.1rem;
  height: 2.1rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(82, 108, 255, 0.3);
  border-radius: 50%;
  background: rgba(58, 82, 207, 0.13);
  color: #7190ff;
}
.bayon-installer-sidebar-foot p { margin: 0; color: #91a2b9; font-size: 0.72rem; line-height: 1.6; }
.bayon-installer-workspace {
  min-width: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(circle at 44% 2%, rgba(74, 97, 205, 0.09), transparent 28rem),
    var(--bayon-installer-workspace);
}
.bayon-installer-topbar {
  min-height: 4.55rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 1.9rem;
  border-bottom: 1px solid var(--bayon-installer-border);
  background: color-mix(in srgb, var(--bayon-installer-workspace) 96%, transparent);
  backdrop-filter: blur(16px);
}
.bayon-installer-secure-state { display: flex; align-items: center; gap: 0.55rem; }
.bayon-installer-secure-state strong { font-size: 0.78rem; font-weight: 760; color: var(--bayon-installer-text); }
.bayon-installer-secure-dot { width: 0.58rem; height: 0.58rem; flex: 0 0 auto; border-radius: 50%; background: var(--bayon-installer-success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--bayon-installer-success) 8%, transparent); }
.bayon-installer-topbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 0.7rem; }
.bayon-installer-step-count { color: var(--bayon-installer-muted); font-size: 0.79rem; }
.bayon-installer-topbar-actions [data-language-switcher] { gap: 0.5rem !important; }
.bayon-installer-topbar-actions [data-language-switcher] .form-select {
  min-width: 10rem;
  min-height: 2.55rem;
  border-color: var(--bayon-installer-border-strong);
  background-color: color-mix(in srgb, var(--bayon-installer-panel) 82%, transparent);
  color: var(--bayon-installer-text);
  font-size: 0.78rem;
}
.bayon-installer-topbar-actions [data-language-switcher] .btn { min-height: 2.55rem; padding-inline: 1rem; border: 1px solid var(--bayon-installer-border); color: var(--bayon-installer-text); }
.bayon-installer-topbar-divider { width: 1px; height: 1.8rem; background: var(--bayon-installer-border); }
.bayon-installer-theme-toggle { border-color: var(--bayon-installer-border) !important; background: color-mix(in srgb, var(--bayon-installer-panel) 80%, transparent) !important; color: var(--bayon-installer-text) !important; }
.bayon-installer-content {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(2.5rem, 6vh, 5.2rem) clamp(1.5rem, 5vw, 5rem) 3rem;
}
.bayon-installer-step { width: min(100%, 52rem); margin-inline: auto; }
.bayon-installer-step-wide { width: min(100%, 66rem); }
.bayon-installer-step-finish { width: min(100%, 62rem); }
.bayon-installer-heading { margin-bottom: 2.1rem; }
.bayon-installer-heading h1,
.bayon-installer-complete-hero h1 {
  margin: 0.55rem 0 0.6rem;
  color: var(--bayon-installer-text);
  font-size: clamp(2.25rem, 4vw, 3.45rem);
  letter-spacing: -0.048em;
  line-height: 1.02;
  font-weight: 850;
}
.bayon-installer-heading p,
.bayon-installer-complete-hero p { max-width: 49rem; margin: 0; color: var(--bayon-installer-muted); font-size: 1rem; line-height: 1.65; }
.bayon-installer-body .bayon-eyebrow,
.bayon-installer-body .bayon-section-kicker { color: #7187ff; letter-spacing: 0.12em; }
.bayon-installer-body .form-label { margin-bottom: 0.42rem; color: var(--bayon-installer-text); font-size: 0.8rem; font-weight: 700; }
.bayon-installer-body .form-control,
.bayon-installer-body .form-select {
  min-height: 3rem;
  border-color: var(--bayon-installer-border-strong);
  border-radius: 0.75rem;
  background: color-mix(in srgb, var(--bayon-installer-panel) 87%, transparent);
  color: var(--bayon-installer-text);
}
.bayon-installer-body .form-control::placeholder { color: color-mix(in srgb, var(--bayon-installer-muted) 72%, transparent); }
.bayon-installer-body .form-control:focus,
.bayon-installer-body .form-select:focus { border-color: rgba(91, 111, 255, 0.65); background: var(--bayon-installer-panel); box-shadow: 0 0 0 0.2rem rgba(79,99,255,0.12); color: var(--bayon-installer-text); }
.bayon-installer-body .form-text { margin-top: 0.38rem; color: var(--bayon-installer-muted); font-size: 0.7rem; }
.bayon-installer-body .bayon-btn-primary {
  border-color: #536dff;
  background: linear-gradient(135deg, #4568ff, #5a3fff);
  color: #fff;
  box-shadow: 0 10px 28px rgba(65, 78, 220, 0.18);
}
.bayon-installer-body .bayon-btn-primary:hover,
.bayon-installer-body .bayon-btn-primary:focus-visible { border-color: #6c80ff; background: linear-gradient(135deg, #5577ff, #684cff); color: #fff; }
.bayon-installer-body .bayon-btn-secondary {
  border-color: var(--bayon-installer-border-strong);
  background: color-mix(in srgb, var(--bayon-installer-panel) 90%, transparent);
  color: var(--bayon-installer-text);
  box-shadow: none;
}
.bayon-installer-body .bayon-btn-secondary:hover,
.bayon-installer-body .bayon-btn-secondary:focus-visible { border-color: rgba(125, 146, 255, 0.4); background: var(--bayon-installer-panel-strong); color: var(--bayon-installer-text); }
.bayon-installer-body .bayon-alert { border-color: var(--bayon-installer-border); border-radius: 0.85rem; background: var(--bayon-installer-panel); color: var(--bayon-installer-text); box-shadow: none; }
.bayon-installer-primary-form { display: grid; gap: 1rem; }
.bayon-installer-field-block,
.bayon-terms-gate,
.bayon-terms-agreement,
.bayon-installer-info-card,
.bayon-installer-mode-card,
.bayon-installer-configuration-card,
.bayon-installer-health-card,
.bayon-installer-support-card {
  border: 1px solid var(--bayon-installer-border);
  background: color-mix(in srgb, var(--bayon-installer-panel) 88%, transparent);
}
.bayon-installer-field-block { padding: 1.2rem; border-radius: 0.9rem; }
.bayon-terms-gate {
  display: grid;
  grid-template-columns: 2.7rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.9rem;
  padding: 0.95rem 1.05rem;
  border-radius: 0.9rem;
}
.bayon-installer-panel-icon {
  width: 2.55rem;
  height: 2.55rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(77, 102, 255, 0.2);
  border-radius: 0.72rem;
  background: rgba(64, 87, 214, 0.13);
  color: #6d86ff;
  font-weight: 850;
}
.bayon-terms-gate-copy p { font-size: 0.76rem; line-height: 1.5; }
.bayon-terms-agreement {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1rem;
  border-radius: 0.82rem;
}
.bayon-terms-agreement .form-check-label { color: var(--bayon-installer-muted); font-size: 0.78rem; }
.bayon-terms-agreement-status { color: var(--bayon-installer-muted); font-size: 0.68rem; font-weight: 700; white-space: nowrap; }
.bayon-terms-agreement-status.is-accepted { color: var(--bayon-installer-success); }
.bayon-installer-primary-action { width: 100%; min-height: 3.2rem; display: flex; align-items: center; justify-content: center; gap: 0.7rem; }
.bayon-installer-inline-note { display: flex; align-items: center; justify-content: center; gap: 0.55rem; margin-top: 1rem; color: var(--bayon-installer-muted); font-size: 0.72rem; }
.bayon-installer-inline-note > span:first-child { color: #7187ff; font-size: 0.55rem; }
.bayon-installer-success-card {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 1.15rem;
  padding: 1.25rem;
  border: 1px solid rgba(32,201,132,0.3);
  border-radius: 0.95rem;
  background: rgba(32,201,132,0.07);
}
.bayon-install-success {
  width: 4rem;
  height: 4rem;
  display: inline-grid;
  place-items: center;
  border-radius: 1.15rem;
  background: linear-gradient(145deg, #25cb88, #11a86d);
  color: #fff;
  box-shadow: 0 15px 38px rgba(18, 174, 113, 0.2);
  font-size: 1.8rem;
  font-weight: 900;
}
.bayon-install-success.is-warning { background: linear-gradient(145deg, #d39b2e, #b27614); }
.bayon-installer-requirements {
  overflow: hidden;
  margin-bottom: 1rem;
  border: 1px solid var(--bayon-installer-border);
  border-radius: 0.9rem;
  background: color-mix(in srgb, var(--bayon-installer-panel) 85%, transparent);
}
.bayon-installer-requirement-row {
  display: grid;
  grid-template-columns: 1.7rem minmax(0,1fr) auto;
  align-items: center;
  gap: 0.9rem;
  min-height: 3.25rem;
  padding: 0.68rem 1rem;
  border-bottom: 1px solid var(--bayon-installer-border);
}
.bayon-installer-requirement-row:last-child { border-bottom: 0; }
.bayon-installer-check-icon {
  width: 1.45rem;
  height: 1.45rem;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  font-size: 0.7rem;
  font-weight: 900;
}
.bayon-installer-check-icon.is-success { background: rgba(32,201,132,0.15); color: #42e3a3; border: 1px solid rgba(32,201,132,0.35); }
.bayon-installer-check-icon.is-danger { background: rgba(213, 80, 94, 0.12); color: #ff8794; border: 1px solid rgba(213, 80, 94, 0.3); }
.bayon-installer-requirement-copy { min-width: 0; display: grid; grid-template-columns: minmax(9rem, 0.6fr) minmax(0, 1.4fr); align-items: center; gap: 1rem; }
.bayon-installer-requirement-copy strong { color: var(--bayon-installer-text); font-size: 0.81rem; }
.bayon-installer-requirement-copy small { color: var(--bayon-installer-muted); font-size: 0.72rem; line-height: 1.45; }
.bayon-installer-requirement-fix { grid-column: 1 / -1; color: #f4b664 !important; }
.bayon-installer-body .bayon-status { padding: 0.35rem 0.62rem; }
.bayon-installer-body .bayon-status.is-success { background: rgba(32,201,132,0.11); border-color: rgba(32,201,132,0.16); color: #45dda2; }
.bayon-installer-body .bayon-status.is-danger { background: rgba(213,80,94,0.11); border-color: rgba(213,80,94,0.16); color: #ff8a96; }
.bayon-installer-info-card {
  display: grid;
  grid-template-columns: 2.7rem minmax(0,1fr);
  align-items: center;
  gap: 0.9rem;
  padding: 0.95rem 1.05rem;
  border-radius: 0.9rem;
}
.bayon-installer-info-card strong { color: var(--bayon-installer-text); font-size: 0.8rem; }
.bayon-installer-info-card p { margin-top: 0.18rem !important; color: var(--bayon-installer-muted); font-size: 0.72rem; line-height: 1.5; }
.bayon-installer-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.7rem; margin-top: 1.3rem; }
.bayon-installer-actions-split { justify-content: space-between; }
.bayon-installer-next-button { min-width: 17rem; display: inline-flex; align-items: center; justify-content: center; gap: 0.65rem; }

/* Installer Step 3: explicit database method tabs */
.bayon-installer-database-choice { display: grid; gap: 1rem; }
.bayon-installer-database-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
  padding: 0.45rem;
  border: 1px solid var(--bayon-installer-border);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--bayon-installer-panel) 72%, transparent);
}
.bayon-installer-database-tab {
  width: 100%;
  display: grid;
  grid-template-columns: 2.3rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  min-height: 4.6rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid transparent;
  border-radius: 0.78rem;
  background: transparent;
  color: var(--bayon-installer-muted);
  text-align: left;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.bayon-installer-database-tab:hover {
  color: var(--bayon-installer-text);
  background: color-mix(in srgb, var(--bayon-installer-panel-strong) 76%, transparent);
}
.bayon-installer-database-tab:focus-visible {
  outline: 3px solid color-mix(in srgb, #6175ff 34%, transparent);
  outline-offset: 2px;
}
.bayon-installer-database-tab.is-active {
  border-color: rgba(91, 110, 255, 0.5);
  background: linear-gradient(135deg, rgba(65, 86, 210, 0.22), rgba(72, 53, 184, 0.16));
  color: var(--bayon-installer-text);
  box-shadow: inset 0 0 0 1px rgba(112, 129, 255, 0.08);
}
.bayon-installer-database-tab-icon {
  width: 2.25rem;
  height: 2.25rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(101, 122, 255, 0.3);
  border-radius: 0.7rem;
  background: rgba(74, 93, 226, 0.12);
  color: #7187ff;
  font-weight: 800;
}
.bayon-installer-database-tab.is-active .bayon-installer-database-tab-icon {
  border-color: rgba(111, 130, 255, 0.52);
  background: rgba(77, 96, 236, 0.24);
  color: #9aa8ff;
}
.bayon-installer-database-tab strong,
.bayon-installer-database-tab small { display: block; }
.bayon-installer-database-tab strong { color: inherit; font-size: 0.83rem; }
.bayon-installer-database-tab small { margin-top: 0.12rem; color: var(--bayon-installer-muted); font-size: 0.68rem; line-height: 1.4; }
.bayon-installer-database-tab-badge {
  padding: 0.28rem 0.48rem;
  border: 1px solid rgba(32, 201, 132, 0.18);
  border-radius: 999px;
  background: rgba(32, 201, 132, 0.1);
  color: #48dba1;
  font-size: 0.61rem;
  font-weight: 800;
  white-space: nowrap;
}
.bayon-installer-database-tab-badge.is-secondary {
  border-color: rgba(120, 137, 255, 0.18);
  background: rgba(100, 118, 255, 0.09);
  color: #9aa8ff;
}
.bayon-installer-database-panel {
  max-width: 52rem;
  width: 100%;
  margin: 0 auto;
}
.bayon-installer-database-panel[hidden] { display: none !important; }
.bayon-installer-database-warning {
  display: grid;
  grid-template-columns: 1.8rem minmax(0, 1fr);
  gap: 0.7rem;
  margin: -0.15rem 0 1rem;
  padding: 0.8rem 0.9rem;
  border: 1px solid rgba(244, 182, 100, 0.2);
  border-radius: 0.75rem;
  background: rgba(244, 182, 100, 0.07);
}
.bayon-installer-database-warning > span {
  width: 1.7rem;
  height: 1.7rem;
  display: inline-grid;
  place-items: center;
  border-radius: 0.5rem;
  background: rgba(244, 182, 100, 0.12);
  color: #f4b664;
  font-weight: 800;
}
.bayon-installer-database-warning strong,
.bayon-installer-database-warning small { display: block; }
.bayon-installer-database-warning strong { color: var(--bayon-installer-text); font-size: 0.72rem; }
.bayon-installer-database-warning small { margin-top: 0.15rem; color: var(--bayon-installer-muted); font-size: 0.66rem; line-height: 1.5; }

.bayon-installer-database-grid,
.bayon-installer-website-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.bayon-installer-mode-card,
.bayon-installer-configuration-card { padding: 1.2rem; border-radius: 0.95rem; }
.bayon-installer-mode-head { display: grid; grid-template-columns: 2.7rem minmax(0,1fr); align-items: start; gap: 0.85rem; margin-bottom: 1.25rem; }
.bayon-installer-mode-head h2 { color: var(--bayon-installer-text); }
.bayon-installer-mode-head p { margin: 0.25rem 0 0; color: var(--bayon-installer-muted); font-size: 0.72rem; line-height: 1.5; }
.bayon-installer-password-note {
  display: grid;
  grid-template-columns: 1.4rem minmax(0,1fr);
  gap: 0.6rem;
  align-items: start;
  padding: 0.8rem;
  border: 1px solid rgba(79,99,255,0.18);
  border-radius: 0.75rem;
  background: rgba(79,99,255,0.07);
}
.bayon-installer-password-note > span { color: #7187ff; }
.bayon-installer-password-note strong,
.bayon-installer-password-note small { display: block; }
.bayon-installer-password-note strong { color: var(--bayon-installer-text); font-size: 0.75rem; }
.bayon-installer-password-note small { margin-top: 0.15rem; color: var(--bayon-installer-muted); font-size: 0.68rem; line-height: 1.45; }
.bayon-installer-install-summary { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; margin-top: 1rem; padding: 0.85rem 1rem; border: 1px solid var(--bayon-installer-border); border-radius: 0.8rem; color: var(--bayon-installer-muted); font-size: 0.72rem; }
.bayon-installer-install-summary strong { color: var(--bayon-installer-text); }
.bayon-installer-complete-hero { display: grid; justify-items: center; text-align: center; margin-bottom: 1.35rem; }
.bayon-installer-complete-hero .bayon-install-success { margin-bottom: 0.85rem; }
.bayon-installer-complete-hero h1 { margin-top: 0.55rem; }
.bayon-installer-complete-hero p { max-width: 45rem; text-align: center; }
.bayon-installer-health-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0.45rem 0.6rem; }
.bayon-installer-health-card {
  min-height: 3.45rem;
  display: grid;
  grid-template-columns: 1.65rem minmax(0,1fr);
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  border-radius: 0.78rem;
}
.bayon-installer-health-card strong,
.bayon-installer-health-card small { display: block; }
.bayon-installer-health-card strong { color: var(--bayon-installer-text); font-size: 0.76rem; }
.bayon-installer-health-card small { margin-top: 0.13rem; color: var(--bayon-installer-muted); font-size: 0.66rem; }
.bayon-installer-lock-notice {
  display: grid;
  grid-template-columns: 1.7rem minmax(0,1fr);
  align-items: start;
  gap: 0.7rem;
  margin-top: 0.85rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(32,201,132,0.28);
  border-radius: 0.8rem;
  background: rgba(32,201,132,0.09);
  color: #5de2af;
}
.bayon-installer-lock-notice strong,
.bayon-installer-lock-notice small { display: block; }
.bayon-installer-lock-notice strong { font-size: 0.76rem; }
.bayon-installer-lock-notice small { margin-top: 0.15rem; color: color-mix(in srgb, var(--bayon-installer-muted) 92%, #4adea5 8%); font-size: 0.66rem; }
.bayon-installer-complete-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.55rem; margin: 0.9rem 0; }
.bayon-installer-support-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.8rem 1rem; border-radius: 0.8rem; }
.bayon-installer-support-card strong,
.bayon-installer-support-card small { display: block; }
.bayon-installer-support-card strong { color: var(--bayon-installer-text); font-size: 0.75rem; }
.bayon-installer-support-card small { max-width: 46rem; margin-top: 0.13rem; color: var(--bayon-installer-muted); font-size: 0.65rem; line-height: 1.45; }

/* Installation terms modal */
.bayon-terms-modal { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; padding: 1rem; }
.bayon-terms-modal[hidden] { display: none !important; }
.bayon-terms-backdrop { position: absolute; inset: 0; background: rgba(4, 10, 20, 0.82); backdrop-filter: blur(8px); }
.bayon-terms-dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 48rem);
  max-height: min(90vh, 48rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--bayon-installer-border-strong);
  border-radius: 1rem;
  background: var(--bayon-installer-panel);
  color: var(--bayon-installer-text);
  box-shadow: 0 32px 90px rgba(0,0,0,0.38);
}
.bayon-terms-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.35rem; border-bottom: 1px solid var(--bayon-installer-border); }
.bayon-terms-header p { max-width: 34rem; color: var(--bayon-installer-muted); font-size: 0.8rem; }
.bayon-terms-scroll { overflow-y: auto; overscroll-behavior: contain; padding: 0.4rem 1.35rem 1.35rem; outline: 0; }
.bayon-terms-section { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: 0.8rem; padding: 1.2rem 0; border-bottom: 1px solid var(--bayon-installer-border); }
.bayon-terms-index { width: 2.2rem; height: 2.2rem; display: grid; place-items: center; border-radius: 0.7rem; background: rgba(79,99,255,0.08); color: #8fa0ff; font-size: 0.65rem; font-weight: 850; }
.bayon-terms-section h3 { margin: 0 0 0.45rem; color: var(--bayon-installer-text); font-size: 0.92rem; }
.bayon-terms-section p { margin: 0; color: var(--bayon-installer-muted); font-size: 0.78rem; line-height: 1.65; }
.bayon-terms-link { display: inline-flex; margin-top: 0.65rem; font-size: 0.75rem; font-weight: 750; text-decoration: none; }
.bayon-terms-read-marker { display: flex; align-items: center; gap: 0.75rem; margin-top: 1.15rem; padding: 0.9rem; border: 1px solid rgba(32,201,132,0.22); border-radius: 0.8rem; background: rgba(32,201,132,0.06); }
.bayon-terms-read-marker > span { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: rgba(32,201,132,0.13); color: #42e3a3; font-weight: 850; }
.bayon-terms-read-marker strong,
.bayon-terms-read-marker small { display: block; }
.bayon-terms-read-marker strong { font-size: 0.78rem; }
.bayon-terms-read-marker small { margin-top: 0.15rem; color: var(--bayon-installer-muted); font-size: 0.68rem; }
.bayon-terms-footer { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.35rem; border-top: 1px solid var(--bayon-installer-border); background: color-mix(in srgb, var(--bayon-installer-panel-strong) 90%, transparent); }
.bayon-terms-progress { color: var(--bayon-installer-muted); font-size: 0.7rem; }
.bayon-terms-progress.is-ready { color: var(--bayon-installer-success); }

@media (max-width: 1199.98px) {
  .bayon-installer-frame { grid-template-columns: 17rem minmax(0,1fr); }
  .bayon-installer-content { padding-inline: 2.1rem; }
  .bayon-installer-database-grid,
  .bayon-installer-website-grid { grid-template-columns: 1fr; }
}
@media (max-width: 991.98px) {
  .bayon-installer-frame { grid-template-columns: 1fr; }
  .bayon-installer-sidebar { min-height: auto; border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .bayon-installer-sidebar-foot { display: none; }
  .bayon-installer-steps { grid-template-columns: repeat(5, minmax(0,1fr)); gap: 0.4rem; overflow-x: auto; }
  .bayon-installer-step-item { min-width: 9.5rem; min-height: 4.2rem; grid-template-columns: 2.3rem minmax(0,1fr); }
  .bayon-installer-workspace { min-height: auto; }
  .bayon-installer-content { padding-top: 2.5rem; }
}
@media (max-width: 767.98px) {
  .bayon-installer-sidebar { padding: 1rem; }
  .bayon-installer-sidebar-head { padding-inline: 0; }
  .bayon-installer-steps { grid-template-columns: 1fr; overflow: visible; }
  .bayon-installer-step-item.is-upcoming { display: none; }
  .bayon-installer-step-item { min-width: 0; }
  .bayon-installer-topbar { align-items: flex-start; flex-direction: column; padding: 0.85rem 1rem; }
  .bayon-installer-topbar-actions { width: 100%; flex-wrap: wrap; justify-content: flex-start; }
  .bayon-installer-topbar-divider { display: none; }
  .bayon-installer-topbar-actions [data-language-switcher] { width: 100%; flex-wrap: wrap; }
  .bayon-installer-topbar-actions [data-language-switcher] .form-select { flex: 1 1 12rem; min-width: 0; }
  .bayon-installer-content { padding: 2rem 1rem 2.4rem; }

  .bayon-installer-database-tabs { grid-template-columns: 1fr; }
  .bayon-installer-database-tab { grid-template-columns: 2.2rem minmax(0,1fr); }
  .bayon-installer-database-tab-badge { grid-column: 2; justify-self: start; }

  .bayon-installer-heading h1,
  .bayon-installer-complete-hero h1 { font-size: clamp(2rem, 10vw, 2.7rem); }
  .bayon-installer-requirement-row { grid-template-columns: 1.55rem minmax(0,1fr); align-items: start; }
  .bayon-installer-requirement-row > .bayon-status { grid-column: 2; justify-self: start; }
  .bayon-installer-requirement-copy { grid-template-columns: 1fr; gap: 0.18rem; }
  .bayon-terms-gate { grid-template-columns: 2.4rem minmax(0,1fr); }
  .bayon-terms-gate .btn { grid-column: 1 / -1; width: 100%; }
  .bayon-terms-agreement,
  .bayon-installer-actions-split,
  .bayon-installer-support-card { align-items: stretch; flex-direction: column; }
  .bayon-installer-next-button { width: 100%; min-width: 0; }
  .bayon-installer-health-grid { grid-template-columns: 1fr; }
  .bayon-installer-success-card { grid-template-columns: 1fr; }
  .bayon-installer-complete-actions .btn { flex: 1 1 100%; }
  .bayon-terms-footer { align-items: flex-start; flex-direction: column; }
  .bayon-terms-footer > div { width: 100%; margin-left: 0 !important; }
  .bayon-terms-footer .btn { flex: 1 1 0; }
}


/* ========================================================================== 
   15. White-label public library experience (v0.13)
   ========================================================================== */
.bayon-global-header { z-index: 1030; border-bottom: 1px solid var(--bayon-border); background: color-mix(in srgb, var(--bayon-page-bg) 92%, transparent); backdrop-filter: blur(18px); }
.bayon-global-nav { min-height: 4.25rem; display: flex; align-items: center; gap: 1rem; }
.bayon-global-brand { min-width: 0; display: inline-flex; align-items: center; gap: .7rem; color: var(--bayon-text)!important; text-decoration: none; }
.bayon-global-brand > span:last-child { min-width: 0; }
.bayon-global-brand strong,.bayon-global-brand small { display:block; max-width: 12rem; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.bayon-global-brand strong { font-size:.84rem; line-height:1.15; }
.bayon-global-brand small { margin-top:.14rem; color:var(--bayon-text-muted); font-size:.62rem; }
.bayon-global-logo,.bayon-footer-logo,.bayon-sidebar-logo { width:2.2rem; height:2.2rem; object-fit:contain; border-radius:.65rem; }
.bayon-mobile-menu-toggle { display:none; width:2.55rem; height:2.55rem; margin-left:auto; border:1px solid var(--bayon-border); border-radius:.75rem; background:var(--bayon-surface); color:var(--bayon-text); }
.bayon-mobile-menu-toggle svg,.bayon-global-search svg,.bayon-header-icon-button svg { fill:currentColor; }
.bayon-global-menu { min-width:0; flex:1 1 auto; display:flex!important; align-items:center; gap:1rem; }
.bayon-global-links { display:flex; align-items:center; gap:.15rem; }
.bayon-global-links a { padding:.55rem .7rem; border-radius:.65rem; color:var(--bayon-text-muted)!important; font-size:.78rem; font-weight:760; text-decoration:none; }
.bayon-global-links a:hover,.bayon-global-links a.is-active { background:var(--bayon-surface-soft); color:var(--bayon-text)!important; }
.bayon-global-search { min-width:10rem; max-width:27rem; flex:1 1 20rem; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:.45rem; min-height:2.6rem; padding:0 .7rem; border:1px solid var(--bayon-border); border-radius:.78rem; background:var(--bayon-surface); color:var(--bayon-text-muted); }
.bayon-global-search:focus-within { border-color:color-mix(in srgb,var(--bayon-brand-500) 48%,var(--bayon-border)); box-shadow:0 0 0 .18rem color-mix(in srgb,var(--bayon-brand-500) 10%,transparent); }
.bayon-global-search input { min-width:0; width:100%; border:0; outline:0; background:transparent; color:var(--bayon-text); font-size:.78rem; }
.bayon-global-actions { display:flex; align-items:center; gap:.45rem; margin-left:auto; }
.bayon-header-icon-button { width:2.55rem; height:2.55rem; display:inline-grid; place-items:center; border:1px solid var(--bayon-border); border-radius:.78rem; background:var(--bayon-surface); color:var(--bayon-text-muted); cursor:pointer; list-style:none; }
.bayon-header-icon-button::-webkit-details-marker { display:none; }
.bayon-header-icon-button:hover { border-color:var(--bayon-border-strong); color:var(--bayon-text); background:var(--bayon-surface-soft); }
.bayon-theme-button .bayon-theme-sun { display:none; }
[data-bs-theme="dark"] .bayon-theme-button .bayon-theme-moon { display:none; }
[data-bs-theme="dark"] .bayon-theme-button .bayon-theme-sun { display:block; }
.bayon-signin-button { min-height:2.55rem; display:inline-flex; align-items:center; padding-inline:1rem; font-size:.78rem; }
.bayon-account-trigger { min-height:2.55rem; display:flex; align-items:center; gap:.5rem; border:1px solid var(--bayon-border); border-radius:.8rem; background:var(--bayon-surface); color:var(--bayon-text); font-size:.75rem; font-weight:750; }

.bayon-language-menu { position:relative; }
.bayon-language-current-flag { font-size:.92rem; line-height:1; }
.bayon-language-trigger {
  width:auto;
  min-width:2.55rem;
  display:inline-flex;
  align-items:center;
  gap:.42rem;
  padding:0 .7rem;
}
.bayon-language-current-name {
  max-width:7.5rem;
  overflow:hidden;
  color:var(--bayon-text);
  font-size:.68rem;
  font-weight:780;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.bayon-language-chevron {
  flex:0 0 auto;
  fill:currentColor;
  transition:transform var(--bayon-transition);
}
.bayon-language-menu[open] .bayon-language-chevron { transform:rotate(180deg); }
.bayon-language-popover { position:absolute; top:calc(100% + .55rem); right:0; width:min(18rem,calc(100vw - 2rem)); padding:.55rem; border:1px solid var(--bayon-border); border-radius:.9rem; background:var(--bayon-surface); box-shadow:var(--bayon-shadow-lg); z-index:1080; }
.bayon-language-popover-title { padding:.45rem .6rem .55rem; color:var(--bayon-text-muted); font-size:.64rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.bayon-language-option { width:100%; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.7rem; padding:.65rem .6rem; border:0; border-radius:.65rem; background:transparent; color:var(--bayon-text); text-align:left; }
.bayon-language-option:hover,.bayon-language-option.is-active { background:var(--bayon-surface-soft); }
.bayon-public-body a:focus-visible,
.bayon-auth-body a:focus-visible,
.bayon-global-links a:focus-visible,
.bayon-language-option:focus-visible,
.bayon-segmented-tabs button:focus-visible,
.bayon-mobile-menu-toggle:focus-visible,
.bayon-account-trigger:focus-visible,
.bayon-header-icon-button:focus-visible {
  outline:2px solid color-mix(in srgb,var(--bayon-brand-500) 72%,transparent);
  outline-offset:3px;
}
.bayon-language-flag { font-size:1.05rem; }
.bayon-language-option strong,.bayon-language-option small { display:block; }
.bayon-language-option strong { font-size:.76rem; }
.bayon-language-option small { margin-top:.12rem; color:var(--bayon-text-muted); font-size:.65rem; }
.bayon-language-check { color:var(--bayon-success); font-weight:850; }


.bayon-public-kicker { display:inline-flex; align-items:center; gap:.5rem; color:var(--bayon-text-muted); font-size:.7rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.bayon-public-kicker > span { width:.42rem; height:.42rem; border-radius:50%; background:var(--bayon-success); }

/* Homepage 1 — Modern Slider */
.bayon-home-hero-slider { position:relative; min-height:clamp(30rem,48vw,39rem); overflow:hidden; background:#081321; }
.bayon-home-hero-stage,.bayon-home-hero-slide { position:absolute; inset:0; }
.bayon-home-hero-slide { opacity:0; visibility:hidden; transition:opacity .55s ease,visibility .55s ease; }
.bayon-home-hero-slide.is-active { opacity:1; visibility:visible; z-index:1; }
.bayon-home-hero-slide-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.bayon-home-hero-slide-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,14,28,.94) 0%,rgba(5,14,28,.78) 38%,rgba(5,14,28,.23) 72%,rgba(5,14,28,.12) 100%),linear-gradient(0deg,rgba(5,14,28,.28),transparent 45%); }
.bayon-home-hero-slide-shell { position:relative; z-index:2; min-height:clamp(30rem,48vw,39rem); display:flex; align-items:center; }
.bayon-home-hero-slide-copy { width:min(44rem,58%); padding:clamp(3.5rem,7vw,6rem) 0; color:#fff; }
.bayon-home-hero-slide-copy .bayon-public-kicker { color:rgba(231,238,249,.72); }
.bayon-home-hero-slide-copy h1 { max-width:42rem; margin:1rem 0 0; font-size:clamp(3.1rem,5.4vw,5.25rem); font-weight:880; letter-spacing:-.065em; line-height:.96; }
.bayon-home-hero-slide-copy h1 span { display:block; margin-top:.08em; color:#9cb5ff; }
.bayon-home-hero-slide-copy p { max-width:39rem; margin:1.35rem 0 0; color:rgba(231,238,249,.78); font-size:1rem; line-height:1.7; }
.bayon-home-hero-cta { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.55rem; }
.bayon-home-hero-ghost { border:1px solid rgba(255,255,255,.34); background:rgba(8,18,34,.34); color:#fff!important; backdrop-filter:blur(8px); }
.bayon-home-hero-ghost:hover,.bayon-home-hero-ghost:focus-visible { border-color:rgba(255,255,255,.56); background:rgba(8,18,34,.52); color:#fff!important; }
.bayon-home-hero-nav { position:absolute; top:50%; z-index:4; width:2.7rem; height:2.7rem; display:grid; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:50%; background:rgba(8,18,34,.46); color:#fff; transform:translateY(-50%); backdrop-filter:blur(8px); }
.bayon-home-hero-nav svg { fill:currentColor; }
.bayon-home-hero-nav.is-prev { left:1rem; }
.bayon-home-hero-nav.is-next { right:1rem; }
.bayon-home-hero-nav:hover,.bayon-home-hero-nav:focus-visible { background:rgba(8,18,34,.75); }
.bayon-home-hero-dots { position:absolute; left:50%; bottom:1.25rem; z-index:4; display:flex; gap:.4rem; transform:translateX(-50%); }
.bayon-home-hero-dots button { width:.45rem; height:.45rem; padding:0; border:0; border-radius:999px; background:rgba(255,255,255,.38); }
.bayon-home-hero-dots button.is-active { width:1.4rem; background:#a9bbff; }

/* Homepage 2 — Minimal Professional */
.bayon-home-hero-minimal { padding:clamp(3.25rem,6vw,5rem) 0; background:linear-gradient(180deg,var(--bayon-surface-subtle),var(--bayon-page-bg)); }
.bayon-home-hero-minimal-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(22rem,1.1fr); gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.bayon-home-hero-minimal-copy h1 { max-width:37rem; margin:1rem 0 0; font-size:clamp(3rem,5vw,4.8rem); font-weight:880; letter-spacing:-.065em; line-height:.96; }
.bayon-home-hero-minimal-copy h1 span { display:block; color:var(--bayon-brand-600); }
[data-bs-theme="dark"] .bayon-home-hero-minimal-copy h1 span { color:#a8b8ff; }
.bayon-home-hero-minimal-copy p { max-width:38rem; margin:1.25rem 0 0; color:var(--bayon-text-muted); font-size:1rem; line-height:1.72; }
.bayon-home-hero-minimal-media { position:relative; aspect-ratio:16/10; overflow:hidden; border:1px solid var(--bayon-border); border-radius:1.4rem; background:var(--bayon-surface); box-shadow:var(--bayon-shadow-lg); }
.bayon-home-hero-minimal-media img { width:100%; height:100%; object-fit:cover; }
.bayon-home-hero-minimal-note { position:absolute; left:1rem; right:1rem; bottom:1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.85rem 1rem; border:1px solid color-mix(in srgb,var(--bayon-border) 70%,transparent); border-radius:.9rem; background:color-mix(in srgb,var(--bayon-surface) 88%,transparent); backdrop-filter:blur(12px); }
.bayon-home-hero-minimal-note strong,.bayon-home-hero-minimal-note span { font-size:.72rem; }
.bayon-home-hero-minimal-note span { color:var(--bayon-text-muted); }

.bayon-home-section { padding:clamp(2.85rem,4.6vw,4.25rem) 0; }
#popular-categories,#featured-books { scroll-margin-top:6rem; }
.bayon-categories-section {
  padding-bottom: clamp(1.7rem, 2.7vw, 2.45rem);
}
.bayon-categories-section + .bayon-feature-books-section {
  padding-top: clamp(2.25rem, 3.7vw, 3.25rem);
}
.bayon-testimonials-section {
  padding-bottom: clamp(2rem, 3.1vw, 2.75rem);
}
.bayon-testimonials-section + .bayon-blog-section {
  padding-top: clamp(2.3rem, 3.7vw, 3.2rem);
}
.bayon-home-section-soft { border-block:1px solid var(--bayon-border); background:var(--bayon-surface-subtle); }
.bayon-home-heading { display:flex; align-items:end; justify-content:space-between; gap:1.5rem; margin-bottom:1.35rem; }
.bayon-home-heading h2 { margin:.35rem 0 0; font-size:clamp(1.8rem,3.5vw,2.75rem); font-weight:840; letter-spacing:-.05em; }
.bayon-home-heading p { max-width:45rem; margin:.55rem 0 0; color:var(--bayon-text-muted); line-height:1.65; }
.bayon-home-heading-link { color:var(--bayon-text-muted)!important; font-size:.78rem; font-weight:800; text-decoration:none; white-space:nowrap; }
.bayon-home-heading-link:hover { color:var(--bayon-text)!important; }
.bayon-home-empty { padding:2rem; border:1px dashed var(--bayon-border-strong); border-radius:1rem; text-align:center; color:var(--bayon-text-muted); }
.bayon-home-empty strong { display:block; color:var(--bayon-text); }
.bayon-home-empty p { margin:.4rem 0 0; }


.bayon-featured-category-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:.75rem; margin-bottom:1.35rem; }
.bayon-featured-category-card { --category-accent:#6d7cff; position:relative; min-width:0; min-height:8.15rem; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.55rem; padding:1rem .7rem; border:1px solid var(--bayon-border); border-radius:1rem; background:linear-gradient(155deg,color-mix(in srgb,var(--category-accent) 9%,var(--bayon-surface)),var(--bayon-surface)); color:var(--bayon-text); text-align:center; cursor:pointer; box-shadow:var(--bayon-shadow-xs); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.bayon-featured-category-card:nth-child(6n+2){--category-accent:#8b5cf6}.bayon-featured-category-card:nth-child(6n+3){--category-accent:#10b981}.bayon-featured-category-card:nth-child(6n+4){--category-accent:#f59e0b}.bayon-featured-category-card:nth-child(6n+5){--category-accent:#ec4899}.bayon-featured-category-card:nth-child(6n+6){--category-accent:#06b6d4}
.bayon-featured-category-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--category-accent) 34%,var(--bayon-border-strong)); box-shadow:0 14px 30px color-mix(in srgb,var(--category-accent) 10%,transparent); }
.bayon-featured-category-card:focus-visible { outline:2px solid color-mix(in srgb,var(--category-accent) 70%,transparent); outline-offset:3px; }
.bayon-featured-category-card.is-active { border-color:color-mix(in srgb,var(--category-accent) 58%,var(--bayon-border)); background:linear-gradient(155deg,color-mix(in srgb,var(--category-accent) 16%,var(--bayon-surface)),color-mix(in srgb,var(--category-accent) 4%,var(--bayon-surface))); box-shadow:0 14px 32px color-mix(in srgb,var(--category-accent) 12%,transparent); }
.bayon-featured-category-icon { width:3.15rem; height:3.15rem; display:inline-grid; place-items:center; border:1px solid color-mix(in srgb,var(--category-accent) 24%,var(--bayon-border)); border-radius:1rem; background:color-mix(in srgb,var(--category-accent) 14%,var(--bayon-surface-soft)); color:var(--category-accent); }
[data-bs-theme="dark"] .bayon-featured-category-icon { color:color-mix(in srgb,var(--category-accent) 62%,#fff); }
.bayon-featured-category-icon svg { width:1.45rem; height:1.45rem; fill:currentColor; }
.bayon-featured-category-copy { min-width:0; }
.bayon-featured-category-copy strong,.bayon-featured-category-copy small { display:block; }
.bayon-featured-category-copy strong { color:var(--bayon-text); font-size:.78rem; line-height:1.35; }
.bayon-featured-category-copy small { margin-top:.22rem; color:var(--bayon-text-muted); font-size:.61rem; font-weight:700; }
.bayon-home-template--minimal-professional .bayon-featured-category-card { min-height:7.6rem; background:var(--bayon-surface); }

[data-bs-theme="light"] .bayon-featured-category-card,
[data-bs-theme="light"] .bayon-feature-book,
[data-bs-theme="light"] .bayon-reader-card,
[data-bs-theme="light"] .bayon-author-card,
[data-bs-theme="light"] .bayon-testimonial-card,
[data-bs-theme="light"] .bayon-blog-card,
[data-bs-theme="light"] .bayon-live-leaderboard,
[data-bs-theme="light"] .bayon-author-leaderboard {
  box-shadow: 0 8px 24px rgba(22, 32, 52, .055);
}
[data-bs-theme="light"] .bayon-feature-book:hover,
[data-bs-theme="light"] .bayon-reader-card:hover,
[data-bs-theme="light"] .bayon-author-card:hover,
[data-bs-theme="light"] .bayon-blog-card:hover {
  box-shadow: 0 14px 34px rgba(22, 32, 52, .09);
}
[data-bs-theme="light"] .bayon-feature-book-availability.is-available {
  background: rgba(10, 74, 55, .94);
  border-color: rgba(29, 148, 105, .34);
  color: #e8fff5;
}
.bayon-featured-category-layout { margin-top:.25rem; }
.bayon-category-panel-head { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:.85rem; }
.bayon-category-panel-head h3 { margin:.22rem 0 0; font-size:1.05rem; font-weight:820; letter-spacing:-.02em; }
.bayon-category-panel-head > a { color:var(--bayon-text-muted)!important; font-size:.7rem; font-weight:800; text-decoration:none; white-space:nowrap; }
.bayon-category-panel-head > a:hover { color:var(--bayon-text)!important; }
.bayon-category-empty-state { min-height:10rem; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:1rem; padding:1.15rem; border:1px dashed var(--bayon-border-strong); border-radius:1rem; background:var(--bayon-surface-soft); }
.bayon-category-empty-state > span { width:3rem; height:3rem; display:grid; place-items:center; border-radius:.85rem; background:var(--bayon-surface); color:var(--bayon-text-muted); }
.bayon-category-empty-state > span svg { width:1.4rem; height:1.4rem; fill:currentColor; }
.bayon-category-empty-state strong,.bayon-category-empty-state p { display:block; }
.bayon-category-empty-state strong { font-size:.78rem; }
.bayon-category-empty-state p { margin:.2rem 0 0; color:var(--bayon-text-muted); font-size:.67rem; line-height:1.5; }
.bayon-category-empty-state > a { color:var(--bayon-brand-600)!important; font-size:.68rem; font-weight:800; text-decoration:none; white-space:nowrap; }
[data-bs-theme="dark"] .bayon-category-empty-state > a { color:#bcc8ff!important; }
.bayon-leader-empty { padding:1rem .15rem .25rem; color:var(--bayon-text-muted); text-align:center; }
.bayon-leader-empty strong { display:block; color:var(--bayon-text); font-size:.72rem; }
.bayon-leader-empty p { margin:.3rem 0 0; font-size:.63rem; line-height:1.5; }
.bayon-segmented-tabs { display:flex; gap:.4rem; overflow-x:auto; padding:.15rem 0 .75rem; scrollbar-width:none; }
.bayon-segmented-tabs::-webkit-scrollbar { display:none; }
.bayon-segmented-tabs button { flex:0 0 auto; min-height:2.55rem; display:inline-flex; align-items:center; gap:.55rem; padding:.5rem .75rem; border:1px solid var(--bayon-border); border-radius:.75rem; background:var(--bayon-surface); color:var(--bayon-text-muted); font-size:.75rem; font-weight:760; }
.bayon-segmented-tabs button.is-active { border-color:color-mix(in srgb,var(--bayon-brand-500) 35%,var(--bayon-border)); background:color-mix(in srgb,var(--bayon-brand-500) 9%,var(--bayon-surface)); color:var(--bayon-text); }
.bayon-category-layout,.bayon-author-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(18rem,22rem); gap:1rem; align-items:start; margin-top:.75rem; }
.bayon-book-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.9rem; }
.bayon-book-card { min-width:0; }
.bayon-book-cover,.bayon-feature-book-cover { position:relative; aspect-ratio:2/3; display:grid; place-items:center; overflow:hidden; border:1px solid var(--bayon-border); border-radius:.85rem; background:linear-gradient(145deg,color-mix(in srgb,var(--bayon-brand-500) 12%,#1b2d49),#172235); color:#fff!important; text-decoration:none; box-shadow:var(--bayon-shadow-xs); }
.bayon-book-cover img,.bayon-feature-book-cover img { width:100%; height:100%; object-fit:cover; }
.bayon-book-cover > span:not(.bayon-feature-book-availability),.bayon-feature-book-cover > span:not(.bayon-feature-book-availability) { font-size:2rem; font-weight:850; }
.bayon-book-cover > small { position:absolute; left:.45rem; bottom:.45rem; padding:.26rem .42rem; border-radius:.45rem; background:rgba(8,17,29,.78); color:#fff; font-size:.56rem; font-weight:800; }
.bayon-book-copy { padding:.65rem .12rem 0; }
.bayon-book-copy h3,.bayon-feature-book h3 { margin:0; font-size:.8rem; font-weight:780; line-height:1.4; }
.bayon-book-copy h3 a,.bayon-feature-book h3 a { color:var(--bayon-text); text-decoration:none; }
.bayon-book-copy p,.bayon-feature-book p { margin:.26rem 0 0; color:var(--bayon-text-muted); font-size:.67rem; line-height:1.45; }

.bayon-live-leaderboard,.bayon-author-leaderboard { overflow:hidden; border:1px solid var(--bayon-border); border-radius:1rem; background:var(--bayon-surface); box-shadow:var(--bayon-shadow-xs); }
.bayon-live-leaderboard-head { min-height:3.7rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem .9rem; border-bottom:1px solid var(--bayon-border); }
.bayon-live-leaderboard-head > div { display:flex; align-items:center; gap:.45rem; }
.bayon-live-leaderboard-head strong { font-size:.78rem; }
.bayon-live-leaderboard-head small { color:var(--bayon-text-muted); font-size:.62rem; }
.bayon-live-dot { width:.42rem; height:.42rem; border-radius:50%; background:var(--bayon-success); box-shadow:0 0 0 .2rem color-mix(in srgb,var(--bayon-success) 10%,transparent); }
.bayon-leader-list { list-style:none; margin:0; padding:0 .8rem; }
.bayon-leader-list li { min-height:3.85rem; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.65rem; border-bottom:1px solid var(--bayon-border); }
.bayon-leader-list li:last-child { border-bottom:0; }
.bayon-leader-list a { min-width:0; color:var(--bayon-text)!important; text-decoration:none; }
.bayon-leader-list strong,.bayon-leader-list small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bayon-leader-list strong { font-size:.69rem; }
.bayon-leader-list small { margin-top:.12rem; color:var(--bayon-text-muted); font-size:.6rem; }
.bayon-rank { color:var(--bayon-text-muted); font-size:.61rem; font-weight:850; }
.bayon-score { font-size:.68rem; font-weight:850; }

.bayon-feature-books-section {
  position: relative;
  overflow: hidden;
}
.bayon-feature-books-section::before {
  content: "";
  position: absolute;
  width: 34rem;
  height: 34rem;
  right: -20rem;
  top: -17rem;
  border: 1px solid color-mix(in srgb, var(--bayon-brand-500) 16%, transparent);
  border-radius: 50%;
  pointer-events: none;
}
.bayon-feature-books-heading {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.2rem;
}
.bayon-feature-books-heading h2 {
  max-width: 54rem;
  margin: .35rem 0 0;
  font-size: clamp(2rem, 4.2vw, 3.55rem);
  font-weight: 850;
  letter-spacing: -.055em;
  line-height: 1.02;
}
.bayon-feature-books-heading p {
  max-width: 45rem;
  margin: .72rem 0 0;
  color: var(--bayon-text-muted);
  font-size: .92rem;
  line-height: 1.65;
}
.bayon-feature-books-motto {
  flex: 0 0 auto;
  display: grid;
  gap: .12rem;
  padding-bottom: .35rem;
  color: var(--bayon-text-muted);
  font-size: .72rem;
  text-align: right;
}
.bayon-feature-books-motto strong {
  color: var(--bayon-text);
  font-size: .78rem;
  font-weight: 780;
}
.bayon-feature-books-motto::after {
  content: "";
  justify-self: end;
  width: 3rem;
  height: 2px;
  margin-top: .55rem;
  border-radius: 999px;
  background: var(--bayon-brand-500);
}

.bayon-feature-book-tabs {
  position: relative;
  z-index: 1;
  margin-bottom: 1rem;
}
.bayon-feature-book-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1rem;
}
.bayon-feature-book {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--bayon-border);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--bayon-surface) 94%, var(--bayon-brand-500) 2%);
  box-shadow: 0 8px 28px color-mix(in srgb, #07111f 8%, transparent);
  transition:
    transform var(--bayon-transition),
    border-color var(--bayon-transition),
    box-shadow var(--bayon-transition),
    background-color var(--bayon-transition);
}
.bayon-feature-book:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--bayon-brand-500) 28%, var(--bayon-border-strong));
  box-shadow: 0 18px 40px color-mix(in srgb, #07111f 18%, transparent);
}
.bayon-feature-book:focus-within {
  border-color: color-mix(in srgb, var(--bayon-brand-500) 46%, var(--bayon-border-strong));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--bayon-brand-500) 12%, transparent);
}
.bayon-feature-book-cover {
  position: relative;
  aspect-ratio: 2 / 2.94;
  margin: .72rem .72rem 0;
  border-color: color-mix(in srgb, var(--bayon-border-strong) 88%, transparent);
  border-radius: .78rem;
  box-shadow: 0 12px 28px color-mix(in srgb, #07111f 22%, transparent);
  transform: translateZ(0);
}
.bayon-feature-book-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 6%, transparent);
  pointer-events: none;
}
.bayon-feature-book-cover img {
  transition: transform 260ms ease, filter 260ms ease;
}
.bayon-feature-book:hover .bayon-feature-book-cover img {
  transform: scale(1.018);
  filter: saturate(1.03) contrast(1.01);
}
.bayon-feature-book-cover > .bayon-feature-book-availability {
  font-size:.59rem;
  font-weight:800;
}
.bayon-feature-book-availability {
  position: absolute;
  left: .55rem;
  bottom: .55rem;
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  max-width: calc(100% - 1.1rem);
  padding: .32rem .52rem;
  border: 1px solid color-mix(in srgb, #fff 12%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, #0b1724 84%, transparent);
  color: #dce8f5;
  box-shadow: 0 4px 14px color-mix(in srgb, #000 22%, transparent);
  backdrop-filter: blur(8px);
  font-size: .59rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.bayon-feature-book-availability > span {
  width: .42rem;
  height: .42rem;
  flex: 0 0 .42rem;
  border-radius: 50%;
  background: currentColor;
}
.bayon-feature-book-availability.is-available {
  border-color: color-mix(in srgb, var(--bayon-success) 28%, transparent);
  background: color-mix(in srgb, #09261d 88%, transparent);
  color: #71e4ae;
}
.bayon-feature-book-availability.is-unavailable {
  color: var(--bayon-text-muted);
}
.bayon-feature-book-copy {
  min-width: 0;
  padding: .82rem .82rem .9rem;
}
.bayon-feature-book-copy h3 {
  margin: 0;
  font-size: .82rem;
  font-weight: 780;
  line-height: 1.36;
  letter-spacing: -.012em;
}
.bayon-feature-book-copy h3 a {
  display: -webkit-box;
  overflow: hidden;
  color: var(--bayon-text);
  text-decoration: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.bayon-feature-book-copy h3 a:hover {
  color: var(--bayon-brand-600);
}
[data-bs-theme="dark"] .bayon-feature-book-copy h3 a:hover {
  color: #c3cdff;
}
.bayon-feature-book-copy p {
  overflow: hidden;
  margin: .36rem 0 0;
  color: var(--bayon-text-muted);
  font-size: .68rem;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}


.bayon-premium-section-heading {
  margin-bottom: 1.05rem;
}
.bayon-premium-section-heading h2 {
  margin: .3rem 0 0;
  font-size: clamp(1.8rem, 3.6vw, 3rem);
  font-weight: 840;
  letter-spacing: -.05em;
  line-height: 1.04;
}
.bayon-premium-section-heading p {
  max-width: 46rem;
  margin: .65rem 0 0;
  color: var(--bayon-text-muted);
  font-size: .88rem;
  line-height: 1.65;
}

/* Featured readers */
.bayon-reader-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .85rem;
  margin-top: .7rem;
}
.bayon-reader-grid .bayon-reader-card:nth-child(1){--reader-accent:#5668d8}.bayon-reader-grid .bayon-reader-card:nth-child(2){--reader-accent:#258c91}.bayon-reader-grid .bayon-reader-card:nth-child(3){--reader-accent:#8b5a9b}.bayon-reader-grid .bayon-reader-card:nth-child(4){--reader-accent:#3c7795}.bayon-reader-grid .bayon-reader-card:nth-child(5){--reader-accent:#71864f}.bayon-reader-grid .bayon-reader-card:nth-child(6){--reader-accent:#9b6349}
.bayon-reader-card {
  position: relative;
  min-width: 0;
  min-height: 13rem;
  overflow: hidden;
  padding: 1rem;
  border: 1px solid var(--bayon-border);
  border-radius: 1rem;
  background:
    linear-gradient(155deg,color-mix(in srgb,var(--reader-accent,#5668d8) 13%,var(--bayon-surface)),var(--bayon-surface) 68%),
    var(--bayon-surface);
  box-shadow: var(--bayon-shadow-xs);
  text-align: left;
  transition: transform var(--bayon-transition), border-color var(--bayon-transition), box-shadow var(--bayon-transition);
}
.bayon-reader-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--bayon-brand-500) 24%, var(--bayon-border-strong));
  box-shadow: var(--bayon-shadow-sm);
}
.bayon-reader-card-top {
  display: flex;
  justify-content: space-between;
  gap: .6rem;
  align-items: center;
}
.bayon-reader-rank,
.bayon-reader-score,
.bayon-reader-type {
  font-size: .58rem;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.bayon-reader-rank { color: var(--bayon-brand-600); }
[data-bs-theme="dark"] .bayon-reader-rank { color: #bdc9ff; }
.bayon-reader-score { color: var(--bayon-text-muted); }
.bayon-reader-avatar,
.bayon-author-avatar,
.bayon-testimonial-avatar {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--bayon-brand-500) 16%, var(--bayon-border));
  border-radius: 50%;
  background: color-mix(in srgb, var(--bayon-brand-500) 10%, var(--bayon-surface-soft));
  color: var(--bayon-brand-600);
  font-size: .9rem;
  font-weight: 850;
  box-shadow: inset 0 0 0 4px color-mix(in srgb, var(--bayon-brand-500) 3%, transparent);
}
.bayon-reader-avatar.has-image,
.bayon-author-avatar.has-image,
.bayon-testimonial-avatar.has-image {
  overflow:hidden;
  background:var(--bayon-surface-soft);
  box-shadow:
    inset 0 0 0 2px color-mix(in srgb,var(--bayon-brand-500) 8%,transparent),
    0 5px 14px color-mix(in srgb,#07101f 14%,transparent);
}
.bayon-reader-avatar.has-image img,
.bayon-author-avatar.has-image img,
.bayon-testimonial-avatar.has-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.bayon-reader-card .bayon-reader-avatar.has-image {
  width:3.7rem;
  height:3.7rem;
}
.bayon-author-card .bayon-author-avatar.has-image {
  width:3.35rem;
  height:3.35rem;
}
.bayon-testimonial-avatar.has-image {
  width:2.9rem;
  height:2.9rem;
}
[data-bs-theme="dark"] .bayon-reader-avatar,
[data-bs-theme="dark"] .bayon-author-avatar,
[data-bs-theme="dark"] .bayon-testimonial-avatar { color: #bdc9ff; }
.bayon-reader-card .bayon-reader-avatar { margin: 1rem 0 .8rem; }
.bayon-reader-type { color:color-mix(in srgb,var(--reader-accent,#5668d8) 54%,var(--bayon-text)); letter-spacing:.03em; text-transform:none; }
.bayon-reader-card h3 {
  margin: .2rem 0 0;
  font-size: .86rem;
  font-weight: 780;
}
.bayon-reader-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .35rem;
  margin-top: .85rem;
  padding-top: .75rem;
  border-top: 1px solid var(--bayon-border);
}
.bayon-reader-stats span {
  min-width: 0;
  color: var(--bayon-text-muted);
  font-size: .56rem;
  line-height: 1.25;
}
.bayon-reader-stats strong {
  display: block;
  margin-bottom: .18rem;
  color: var(--bayon-text);
  font-size: .73rem;
}

/* Featured authors + live leaderboard */
.bayon-author-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(17rem, 21rem);
  gap: 1.25rem;
  align-items: start;
  margin-top: .75rem;
}
.bayon-author-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
}
.bayon-author-card {
  min-width: 0;
  min-height: 14.5rem;
  display: flex;
  flex-direction: column;
  padding: 1rem;
  border: 1px solid var(--bayon-border);
  border-radius: 1rem;
  background: var(--bayon-surface);
  box-shadow: var(--bayon-shadow-xs);
  transition: transform var(--bayon-transition), border-color var(--bayon-transition), box-shadow var(--bayon-transition);
}
.bayon-author-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--bayon-brand-500) 24%, var(--bayon-border-strong));
  box-shadow: var(--bayon-shadow-sm);
}
.bayon-author-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}
.bayon-author-title-count {
  color: var(--bayon-brand-600);
  font-size: .58rem;
  font-weight: 850;
  text-transform: uppercase;
}
[data-bs-theme="dark"] .bayon-author-title-count { color: #bdc9ff; }
.bayon-author-card-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}
.bayon-author-card h3 {
  margin: .8rem 0 0;
  font-size: .9rem;
  font-weight: 790;
}
.bayon-author-role { display:block; margin-top:.22rem; color:var(--bayon-brand-600); font-size:.61rem; font-weight:780; line-height:1.35; }
[data-bs-theme="dark"] .bayon-author-role { color:#bdc9ff; }
.bayon-author-card p {
  display: -webkit-box;
  overflow: hidden;
  margin: .5rem 0 0;
  color: var(--bayon-text-muted);
  font-size: .67rem;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}
.bayon-author-mini-stats {
  display: flex;
  gap: .4rem;
  margin-top: auto;
  padding-top: .85rem;
}
.bayon-author-mini-stats span {
  padding: .3rem .46rem;
  border: 1px solid var(--bayon-border);
  border-radius: 999px;
  background: var(--bayon-surface-soft);
  color: var(--bayon-text-muted);
  font-size: .56rem;
  font-weight: 750;
}
.bayon-author-leaderboard {
  overflow: hidden;
  border: 1px solid var(--bayon-border);
  border-radius: 1rem;
  background: var(--bayon-surface);
  box-shadow: var(--bayon-shadow-xs);
}
.bayon-author-leaderboard .bayon-live-leaderboard-head {
  align-items: flex-end;
}
.bayon-author-leaderboard .bayon-live-leaderboard-head > div {
  display:block;
}
.bayon-author-leaderboard .bayon-live-leaderboard-head strong {
  display: block;
  margin-top: .2rem;
}
.bayon-author-leaderboard .bayon-author-rank-row {
  grid-template-columns:auto 2rem minmax(0,1fr) auto;
  gap:.55rem;
}
.bayon-author-rank-avatar {
  width:2rem;
  height:2rem;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--bayon-brand-500) 16%,var(--bayon-border));
  border-radius:50%;
  background:color-mix(in srgb,var(--bayon-brand-500) 9%,var(--bayon-surface-soft));
  color:var(--bayon-brand-600);
  font-size:.6rem;
  font-weight:850;
}
.bayon-author-rank-avatar.has-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.bayon-author-rank-copy {
  min-width:0;
}
.bayon-author-rank-copy strong,
.bayon-author-rank-copy small {
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Testimonials — arrowless carousel */
.bayon-testimonial-carousel {
  overflow: hidden;
}
.bayon-testimonial-track {
  display: flex;
  gap: 1rem;
  transition: transform .55s cubic-bezier(.2,.7,.2,1);
  will-change: transform;
}
.bayon-testimonial-card {
  position: relative;
  flex: 0 0 calc((100% - 5rem)/6);
  min-width: 0;
  min-height: 15rem;
  overflow: hidden;
  padding: 1.1rem;
  border: 1px solid var(--bayon-border);
  border-radius: 1rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--bayon-brand-500) 4%, var(--bayon-surface)), var(--bayon-surface));
  box-shadow: var(--bayon-shadow-xs);
}
.bayon-testimonial-card-head {
  display: flex;
  align-items: center;
  gap: .7rem;
}
.bayon-testimonial-card-head > div:last-child { min-width: 0; }
.bayon-testimonial-card-head strong {
  display:block;
  overflow:hidden;
  font-size:.72rem;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.bayon-testimonial-card-head span {
  display:-webkit-box;
  overflow:hidden;
  margin-top:.15rem;
  color:var(--bayon-text-muted);
  font-size:.6rem;
  line-height:1.35;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.bayon-testimonial-stars {
  margin-top: .8rem;
  color: #e6a629;
  font-size: .7rem;
  letter-spacing: .08em;
}
.bayon-testimonial-card blockquote {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  overflow: hidden;
  margin: .72rem 0 0;
  color: var(--bayon-text);
  font-size: .73rem;
  line-height: 1.65;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
}
.bayon-testimonial-quote {
  position: absolute;
  right: .8rem;
  bottom: -.9rem;
  color: color-mix(in srgb, var(--bayon-brand-500) 10%, transparent);
  font-family: Georgia, serif;
  font-size: 7rem;
  line-height: 1;
  pointer-events: none;
}
.bayon-testimonial-controls {
  min-height:2.2rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  margin-top:1rem;
}
.bayon-testimonial-dots {
  display: flex;
  justify-content: center;
  gap: .35rem;
  margin-top: 0;
}
.bayon-testimonial-toggle {
  min-height:2rem;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.3rem .55rem;
  border:1px solid var(--bayon-border);
  border-radius:999px;
  background:var(--bayon-surface);
  color:var(--bayon-text-muted);
  font-size:.6rem;
  font-weight:800;
  transition:border-color var(--bayon-transition),background var(--bayon-transition),color var(--bayon-transition);
}
.bayon-testimonial-toggle:hover,
.bayon-testimonial-toggle:focus-visible {
  border-color:var(--bayon-border-strong);
  background:var(--bayon-surface-soft);
  color:var(--bayon-text);
}
.bayon-testimonial-toggle:focus-visible {
  outline:2px solid color-mix(in srgb,var(--bayon-brand-500) 72%,transparent);
  outline-offset:2px;
}
.bayon-testimonial-toggle svg { fill:currentColor; }
.bayon-testimonial-play-icon { display:none; }
.bayon-testimonial-toggle.is-paused .bayon-testimonial-play-icon { display:block; }
.bayon-testimonial-toggle.is-paused .bayon-testimonial-pause-icon { display:none; }
.bayon-testimonial-dots span {
  width: .38rem;
  height: .38rem;
  border-radius: 50%;
  background: var(--bayon-border-strong);
  transition: width .2s ease, background .2s ease;
}
.bayon-testimonial-dots span.is-active {
  width: 1rem;
  border-radius: 999px;
  background: var(--bayon-brand-500);
}
.bayon-testimonial-dots span:only-child {
  width:1rem;
  background:color-mix(in srgb,var(--bayon-brand-500) 72%,var(--bayon-border-strong));
}

/* Blog — one responsive row only */
.bayon-blog-row {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .85rem;
}
.bayon-blog-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--bayon-border);
  border-radius: 1rem;
  background: var(--bayon-surface);
  box-shadow: var(--bayon-shadow-xs);
  transition: transform var(--bayon-transition), border-color var(--bayon-transition), box-shadow var(--bayon-transition);
}
.bayon-blog-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--bayon-brand-500) 24%, var(--bayon-border-strong));
  box-shadow: var(--bayon-shadow-sm);
}
.bayon-blog-image {
  aspect-ratio: 16/10;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--bayon-brand-500) 8%, var(--bayon-surface-soft)), var(--bayon-surface-soft));
  color: var(--bayon-text-muted)!important;
  text-decoration: none;
}
.bayon-blog-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position:center;
  transition: transform 260ms ease;
}
.bayon-blog-card:hover .bayon-blog-image img { transform: scale(1.025); }
.bayon-blog-image span {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border: 1px solid var(--bayon-border);
  border-radius: .9rem;
  background: var(--bayon-surface);
}
.bayon-blog-image svg {
  fill: currentColor;
}
.bayon-blog-copy {
  padding: .85rem;
}
.bayon-blog-label {
  color: var(--bayon-brand-600);
  font-size: .57rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08em;
}
[data-bs-theme="dark"] .bayon-blog-label { color: #bdc9ff; }
.bayon-blog-card h3 {
  margin: .38rem 0 0;
  font-size: .79rem;
  line-height: 1.42;
}
.bayon-blog-card h3 a {
  display: -webkit-box;
  overflow: hidden;
  color: var(--bayon-text);
  text-decoration: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.bayon-blog-card p {
  display: -webkit-box;
  overflow: hidden;
  margin: .45rem 0 0;
  color: var(--bayon-text-muted);
  font-size: .64rem;
  line-height: 1.52;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.bayon-blog-read {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  margin-top: .75rem;
  color: var(--bayon-text-muted)!important;
  font-size: .62rem;
  font-weight: 800;
  text-decoration: none;
}
.bayon-blog-read:hover { color: var(--bayon-text)!important; }

.bayon-global-footer { border-top:1px solid var(--bayon-border); background:var(--bayon-surface); }
.bayon-global-footer > .bayon-shell { padding-top:2.4rem; padding-bottom:1.25rem; }
.bayon-footer-brand-row { padding-bottom:1.6rem; }
.bayon-footer-brand { display:flex; align-items:flex-start; gap:.8rem; max-width:42rem; }
.bayon-footer-brand > div { min-width:0; }
.bayon-footer-brand strong { font-size:.86rem; }
.bayon-footer-brand p { max-width:38rem; margin:.35rem 0 0; color:var(--bayon-text-muted); font-size:.72rem; line-height:1.6; }
.bayon-footer-columns { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(14rem,100%),1fr)); gap:clamp(1rem,2vw,2rem); padding:1.5rem 0; border-block:1px solid var(--bayon-border); }
.bayon-footer-columns h2 { margin:0 0 .75rem; color:var(--bayon-text); font-size:.7rem; font-weight:850; text-transform:uppercase; letter-spacing:.07em; }
.bayon-footer-columns ul { list-style:none; margin:0; padding:0; display:grid; gap:.55rem; }
.bayon-footer-columns a,.bayon-footer-bottom a { color:var(--bayon-text-muted)!important; font-size:.68rem; text-decoration:none; }
.bayon-footer-columns a:hover,.bayon-footer-bottom a:hover { color:var(--bayon-text)!important; }
.bayon-footer-bottom { min-height:3.6rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:1rem; color:var(--bayon-text-muted); font-size:.64rem; }
.bayon-footer-bottom-actions { margin-left:auto; display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:1rem; }
.bayon-footer-bottom-links { display:flex; flex-wrap:wrap; gap:.8rem; }
.bayon-footer-social { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.42rem; }
.bayon-footer-social a { width:2rem; height:2rem; display:grid; place-items:center; flex:0 0 auto; border:1px solid var(--bayon-border); border-radius:50%; background:var(--bayon-surface-soft); color:var(--bayon-text-muted)!important; box-shadow:var(--bayon-shadow-xs); transition:transform var(--bayon-transition),border-color var(--bayon-transition),background var(--bayon-transition),color var(--bayon-transition); }
.bayon-footer-social a:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--bayon-brand-500) 42%,var(--bayon-border)); background:color-mix(in srgb,var(--bayon-brand-500) 8%,var(--bayon-surface)); color:var(--bayon-brand-600)!important; }
.bayon-footer-social a:focus-visible { outline:2px solid var(--bayon-brand-500); outline-offset:2px; }
.bayon-footer-social svg { width:.95rem; height:.95rem; display:block; }

.bayon-home-layout-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.bayon-home-layout-option { position:relative; display:block; cursor:pointer; }
.bayon-home-layout-option > input { position:absolute; opacity:0; pointer-events:none; }
.bayon-home-layout-card { position:relative; min-height:15rem; display:flex; flex-direction:column; gap:.35rem; padding:1rem; border:1px solid var(--bayon-border); border-radius:1rem; background:var(--bayon-surface-soft); box-shadow:var(--bayon-shadow-xs); transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.bayon-home-layout-option:hover .bayon-home-layout-card { transform:translateY(-2px); border-color:var(--bayon-border-strong); box-shadow:var(--bayon-shadow-sm); }
.bayon-home-layout-option > input:checked + .bayon-home-layout-card { border-color:color-mix(in srgb,var(--bayon-brand-500) 58%,var(--bayon-border)); box-shadow:0 0 0 3px color-mix(in srgb,var(--bayon-brand-500) 10%,transparent),var(--bayon-shadow-sm); }
.bayon-home-layout-option > input:focus-visible + .bayon-home-layout-card { outline:2px solid var(--bayon-brand-500); outline-offset:3px; }
.bayon-home-layout-card strong { margin-top:.45rem; font-size:.88rem; }
.bayon-home-layout-card small { color:var(--bayon-text-muted); font-size:.69rem; line-height:1.5; }
.bayon-home-layout-card em { position:absolute; top:.75rem; right:.75rem; padding:.25rem .45rem; border-radius:999px; background:color-mix(in srgb,var(--bayon-brand-500) 10%,var(--bayon-surface)); color:var(--bayon-brand-600); font-size:.55rem; font-style:normal; font-weight:850; }
.bayon-home-layout-preview { position:relative; height:8rem; overflow:hidden; border:1px solid var(--bayon-border); border-radius:.8rem; background:var(--bayon-surface); }
.bayon-home-layout-preview i { position:absolute; display:block; border-radius:.4rem; }
.bayon-home-layout-preview.is-slider { background:linear-gradient(120deg,#0b1830 0 45%,#243d68 45% 100%); }
.bayon-home-layout-preview.is-slider i:nth-child(1){left:.7rem;top:1.1rem;width:40%;height:.7rem;background:#dfe7ff}.bayon-home-layout-preview.is-slider i:nth-child(2){left:.7rem;top:2.2rem;width:29%;height:.7rem;background:#8aa5ff}.bayon-home-layout-preview.is-slider i:nth-child(3){right:1rem;top:1rem;width:36%;height:6rem;border-radius:999px 1rem 1rem 999px;background:linear-gradient(145deg,#5b6fd7,#2e5a85)}
.bayon-home-layout-preview.is-minimal { background:linear-gradient(90deg,var(--bayon-surface) 0 48%,color-mix(in srgb,var(--bayon-brand-500) 8%,var(--bayon-surface-soft)) 48% 100%); }
.bayon-home-layout-preview.is-minimal i:nth-child(1){left:.8rem;top:1.2rem;width:32%;height:.6rem;background:var(--bayon-text)}.bayon-home-layout-preview.is-minimal i:nth-child(2){left:.8rem;top:2.2rem;width:26%;height:.55rem;background:var(--bayon-brand-500)}.bayon-home-layout-preview.is-minimal i:nth-child(3){right:.8rem;top:.8rem;width:42%;height:6.3rem;background:linear-gradient(145deg,#9aa8bc,#dfe6ef)}

.bayon-toggle-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.bayon-setting-toggle { min-height:4.7rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem; border:1px solid var(--bayon-border); border-radius:.9rem; background:var(--bayon-surface-soft); }
.bayon-setting-toggle strong,.bayon-setting-toggle small { display:block; }
.bayon-setting-toggle strong { font-size:.78rem; }
.bayon-setting-toggle small { margin-top:.18rem; color:var(--bayon-text-muted); font-size:.65rem; line-height:1.4; }
.bayon-switch { display:flex; align-items:center; gap:.45rem; flex:0 0 auto; cursor:pointer; }
.bayon-switch input { position:absolute; opacity:0; pointer-events:none; }
.bayon-switch > span { position:relative; width:2.35rem; height:1.35rem; border:1px solid var(--bayon-border-strong); border-radius:999px; background:var(--bayon-surface); transition:.2s ease; }
.bayon-switch > span::after { content:""; position:absolute; width:.88rem; height:.88rem; left:.2rem; top:.18rem; border-radius:50%; background:var(--bayon-text-muted); transition:.2s ease; }
.bayon-switch input:checked + span { border-color:color-mix(in srgb,var(--bayon-success) 55%,var(--bayon-border)); background:color-mix(in srgb,var(--bayon-success) 15%,var(--bayon-surface)); }
.bayon-switch input:checked + span::after { transform:translateX(.95rem); background:var(--bayon-success); }
.bayon-switch input:focus-visible + span { outline:2px solid var(--bayon-brand-500); outline-offset:2px; }
.bayon-switch em { min-width:1.65rem; color:var(--bayon-text-muted); font-size:0; font-style:normal; font-weight:800; text-align:left; }
.bayon-switch em::before { content:"Off"; font-size:.63rem; }
.bayon-switch input:checked ~ em::before { content:"On"; color:var(--bayon-success); }
.bayon-content-slot { position:relative; height:100%; padding:1rem; border:1px solid var(--bayon-border); border-radius:.9rem; background:var(--bayon-surface-soft); }
.bayon-content-slot-number { position:absolute; top:.75rem; right:.8rem; color:var(--bayon-text-muted); font-size:.58rem; font-weight:850; letter-spacing:.08em; }

@media (max-width:1199.98px) {
  .bayon-home-hero-slide-copy { width:min(42rem,65%); }
  .bayon-global-nav { flex-wrap:wrap; padding-block:.55rem; }
  .bayon-mobile-menu-toggle { display:inline-grid; place-items:center; }
  .bayon-global-menu.collapse:not(.show) { display:none!important; }
  .bayon-global-menu { flex-basis:100%; display:grid!important; grid-template-columns:auto minmax(14rem,1fr) auto; padding:.45rem 0 .25rem; }
  .bayon-featured-category-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .bayon-book-grid,.bayon-feature-book-grid,.bayon-reader-grid,.bayon-blog-row { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .bayon-author-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .bayon-feature-books-heading { align-items: flex-start; }
  .bayon-testimonial-card { flex-basis:calc((100% - 3rem)/4); }
}
@media (max-width:991.98px) {
  .bayon-home-hero-slide-copy { width:min(38rem,78%); }
  .bayon-home-hero-minimal-grid { grid-template-columns:1fr; }
  .bayon-home-layout-grid { grid-template-columns:1fr; }
  .bayon-categories-section { padding-bottom:2rem; }
  .bayon-categories-section + .bayon-feature-books-section { padding-top:2.4rem; }
  .bayon-testimonials-section { padding-bottom:2.15rem; }
  .bayon-testimonials-section + .bayon-blog-section { padding-top:2.45rem; }
  .bayon-category-layout,.bayon-author-layout { gap:1rem; }
  .bayon-global-menu { grid-template-columns:1fr auto; }
  .bayon-global-links { grid-column:1/-1; order:1; }
  .bayon-global-search { order:2; max-width:none; }
  .bayon-global-actions { order:3; }
  .bayon-featured-category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bayon-category-layout,.bayon-author-layout { grid-template-columns:1fr; }
  .bayon-book-grid,.bayon-feature-book-grid,.bayon-reader-grid,.bayon-blog-row { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bayon-author-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bayon-testimonial-card { flex-basis:calc((100% - 2rem)/3); }
  .bayon-footer-columns { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:767.98px) {
  .bayon-home-hero-slider,.bayon-home-hero-slide-shell { min-height:31rem; }
  .bayon-home-hero-slide-copy { width:100%; padding:5.5rem 0 4.5rem; }
  .bayon-home-hero-slide-copy h1 { font-size:clamp(2.7rem,12vw,4rem); }
  .bayon-home-hero-nav { display:none; }
  .bayon-home-hero-minimal { padding-top:3rem; }
  .bayon-home-hero-minimal-copy h1 { font-size:clamp(2.7rem,12vw,4rem); }
  .bayon-auth-top-actions { top:.75rem; right:.75rem; }
  .bayon-auth-shell { padding:4.4rem .8rem 1rem; }
  .bayon-home-section { padding:2.35rem 0; }
  .bayon-categories-section { padding-bottom:1.8rem; }
  .bayon-categories-section + .bayon-feature-books-section,
  .bayon-testimonials-section + .bayon-blog-section { padding-top:2rem; }
  .bayon-testimonials-section { padding-bottom:1.8rem; }
  .bayon-language-current-name,.bayon-language-chevron { display:none; }
  .bayon-language-trigger { width:2.55rem; padding:0; justify-content:center; }
  .bayon-global-menu { grid-template-columns:1fr; }
  .bayon-global-links,.bayon-global-search,.bayon-global-actions { grid-column:1; width:100%; }
  .bayon-global-actions { justify-content:flex-end; }
  .bayon-global-search { flex-basis:auto; }
  .bayon-home-heading { align-items:flex-start; flex-direction:column; }
  .bayon-featured-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bayon-featured-category-card { min-height:7rem; padding:.8rem .55rem; }
  .bayon-category-empty-state { grid-template-columns:auto minmax(0,1fr); }
  .bayon-category-empty-state > a { grid-column:2; }
  .bayon-book-grid,.bayon-feature-book-grid,.bayon-reader-grid,.bayon-blog-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bayon-feature-books-heading { display: block; }
  .bayon-feature-books-motto { display: none; }
  .bayon-feature-book-grid { gap: .72rem; }
  .bayon-feature-book-cover { margin: .55rem .55rem 0; border-radius: .7rem; }
  .bayon-feature-book-copy { padding: .68rem .62rem .72rem; }
  .bayon-feature-book-copy h3 { font-size: .76rem; }
  .bayon-author-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bayon-testimonial-card { flex-basis:calc((100% - 1rem)/2); }
  .bayon-toggle-grid { grid-template-columns:1fr; }
  .bayon-footer-bottom { align-items:flex-start; flex-direction:column; }
  .bayon-footer-bottom-actions { width:100%; margin-left:0; justify-content:space-between; }
}
@media (max-width:479.98px) {
  .bayon-home-hero-slide-overlay { background:linear-gradient(90deg,rgba(5,14,28,.93),rgba(5,14,28,.56)); }
  .bayon-home-hero-cta .btn { width:100%; }
  .bayon-footer-columns { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem .8rem; }
  .bayon-footer-columns h2 { font-size:.62rem; }
  .bayon-footer-columns a { overflow-wrap:anywhere; }
  .bayon-footer-bottom-actions { align-items:flex-start; flex-direction:column; gap:.75rem; }
  .bayon-footer-social { justify-content:flex-start; }
  .bayon-global-brand small { display:none; }
  .bayon-global-links { justify-content:space-between; }
  .bayon-global-links a { flex:1 1 auto; text-align:center; }
  .bayon-testimonial-card { flex-basis:100%; }
}
@media (prefers-reduced-motion: reduce) {
  .bayon-home-hero-slide { transition:none; }
  .bayon-testimonial-track { transition:none; }
  .bayon-testimonial-toggle { display:none!important; }
}

/* ==========================================================================
   24. Global header management (v0.15.6)
   ========================================================================== */
.bayon-global-logo {
  width:2.45rem;
  height:2.45rem;
  flex:0 0 auto;
  border-radius:.78rem;
  object-fit:contain;
}
.bayon-global-brand-copy { min-width:0; }
.bayon-global-brand-copy strong,
.bayon-global-brand-copy small {
  display:block;
  max-width:12rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.bayon-global-brand-copy strong { font-size:.84rem; line-height:1.15; }
.bayon-global-brand-copy small { margin-top:.14rem; color:var(--bayon-text-muted); font-size:.62rem; }

.bayon-global-links a {
  display:inline-flex;
  align-items:center;
  gap:.38rem;
}
.bayon-nav-icon { flex:0 0 auto; fill:currentColor; }

.bayon-header-icon-button {
  border:0;
  background:transparent;
  box-shadow:none;
}
.bayon-header-icon-button:hover {
  border-color:transparent;
  background:var(--bayon-surface-soft);
}
.bayon-language-trigger {
  min-width:2.55rem;
  width:auto;
  padding:0 .45rem;
  justify-content:center;
}
.bayon-language-current-flag { font-size:1rem; }
.bayon-language-current-name { margin-left:.18rem; }
.bayon-language-popover {
  top:calc(100% + .4rem);
  width:min(13.5rem,calc(100vw - 1.25rem));
  max-height:min(23rem,calc(100vh - 5.5rem));
  overflow:auto;
  padding:.35rem;
  border-radius:.78rem;
}
.bayon-language-popover-title { padding:.3rem .42rem .4rem; font-size:.57rem; }
.bayon-language-option {
  gap:.5rem;
  min-height:2.35rem;
  padding:.4rem .42rem;
  border-radius:.55rem;
}
.bayon-language-flag { font-size:.92rem; }
.bayon-language-option strong { font-size:.7rem; }
.bayon-language-option small { margin-top:.06rem; font-size:.58rem; }

.bayon-mobile-search-menu { position:relative; display:none; }
.bayon-mobile-search-menu > summary { list-style:none; }
.bayon-mobile-search-menu > summary::-webkit-details-marker { display:none; }
.bayon-mobile-search-popover {
  position:absolute;
  top:calc(100% + .45rem);
  right:0;
  z-index:1080;
  width:min(22rem,calc(100vw - 1.25rem));
  padding:.5rem;
  border:1px solid var(--bayon-border);
  border-radius:.78rem;
  background:var(--bayon-surface);
  box-shadow:var(--bayon-shadow-lg);
}
.bayon-mobile-search-popover form {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:.45rem;
  min-height:2.55rem;
  padding:0 .65rem;
  border:1px solid var(--bayon-border);
  border-radius:.68rem;
  background:var(--bayon-surface-soft);
  color:var(--bayon-text-muted);
}
.bayon-mobile-search-popover svg { fill:currentColor; }
.bayon-mobile-search-popover input {
  min-width:0;
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  color:var(--bayon-text);
}

.bayon-signin-icon { display:none; fill:currentColor; }

.bayon-header-admin-preview {
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:.8rem .9rem;
  border:1px solid var(--bayon-border);
  border-radius:.85rem;
  background:var(--bayon-surface-soft);
}
.bayon-header-admin-logo {
  width:3rem;
  height:3rem;
  object-fit:contain;
  border-radius:.8rem;
}
.bayon-header-admin-preview strong,
.bayon-header-admin-preview small { display:block; }
.bayon-header-admin-preview small { margin-top:.15rem; color:var(--bayon-text-muted); font-size:.72rem; }

@media (max-width:1199.98px) {
  .bayon-global-header.is-compact-mobile .bayon-global-nav {
    min-height:4rem;
    flex-wrap:nowrap;
    gap:.3rem;
    padding-block:.4rem;
  }
  .bayon-global-header.is-compact-mobile .bayon-global-brand {
    flex:0 0 auto;
    gap:0;
  }
  .bayon-global-header.is-compact-mobile .bayon-global-brand-copy { display:none; }
  .bayon-global-header.is-compact-mobile .bayon-global-logo {
    width:2.45rem;
    height:2.45rem;
  }
  .bayon-global-header.is-compact-mobile .bayon-mobile-menu-toggle { display:none!important; }
  .bayon-global-header.is-compact-mobile .bayon-global-menu.collapse:not(.show),
  .bayon-global-header.is-compact-mobile .bayon-global-menu {
    min-width:0;
    flex:1 1 auto;
    flex-basis:auto;
    display:flex!important;
    align-items:center;
    gap:.18rem;
    padding:0;
  }
  .bayon-global-header.is-compact-mobile .bayon-global-links {
    display:flex;
    align-items:center;
    gap:.05rem;
    grid-column:auto;
    order:0;
    flex:0 0 auto;
  }
  .bayon-global-header.is-compact-mobile .bayon-global-links a {
    width:2.45rem;
    height:2.45rem;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    padding:0;
    border-radius:.68rem;
  }
  .bayon-global-header.is-compact-mobile .bayon-global-links .bayon-nav-label { display:none; }
  .bayon-global-header.is-compact-mobile .bayon-global-search { display:none; }
  .bayon-global-header.is-compact-mobile .bayon-global-actions {
    width:auto;
    flex:0 0 auto;
    order:0;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.05rem;
    margin-left:auto;
  }
  .bayon-global-header.is-compact-mobile .bayon-mobile-search-menu { display:block; }
  .bayon-global-header.is-compact-mobile .bayon-language-current-name { display:none; }
  .bayon-global-header.is-compact-mobile .bayon-language-trigger {
    width:2.45rem;
    height:2.45rem;
    padding:0;
  }
  .bayon-global-header.is-compact-mobile .bayon-header-icon-button {
    width:2.45rem;
    height:2.45rem;
  }
  .bayon-global-header.is-compact-mobile .bayon-signin-button {
    width:2.45rem;
    height:2.45rem;
    min-height:2.45rem;
    display:grid;
    place-items:center;
    padding:0;
    border-radius:.72rem;
  }
  .bayon-global-header.is-compact-mobile .bayon-signin-icon { display:block; }
  .bayon-global-header.is-compact-mobile .bayon-signin-label { display:none; }
  .bayon-global-header.is-compact-mobile .bayon-account-trigger {
    width:2.45rem;
    height:2.45rem;
    min-height:2.45rem;
    justify-content:center;
    padding:0;
    border:0;
    background:transparent;
  }
  .bayon-global-header.is-compact-mobile .bayon-account-trigger::after { display:none; }
}

@media (max-width:575.98px) {
  .bayon-global-header.is-compact-mobile .bayon-global-nav { gap:.12rem; }
  .bayon-global-header.is-compact-mobile .bayon-global-logo,
  .bayon-global-header.is-compact-mobile .bayon-global-links a,
  .bayon-global-header.is-compact-mobile .bayon-language-trigger,
  .bayon-global-header.is-compact-mobile .bayon-header-icon-button,
  .bayon-global-header.is-compact-mobile .bayon-signin-button,
  .bayon-global-header.is-compact-mobile .bayon-account-trigger {
    width:2.3rem;
    height:2.3rem;
    min-height:2.3rem;
  }
  .bayon-global-header.is-compact-mobile .bayon-global-actions { gap:0; }
}

/* ==========================================================================
   25. Compact header action visibility fix (v0.15.7)
   ========================================================================== */
@media (max-width:1199.98px) {
  .bayon-global-header.is-compact-mobile .bayon-global-menu {
    width:auto;
    max-width:none;
    min-width:0;
    overflow:visible;
  }

  /* Override the legacy mobile width:100% rule that pushed actions off-screen. */
  .bayon-global-header.is-compact-mobile .bayon-global-links {
    width:auto;
    min-width:0;
    flex:0 0 auto;
  }

  .bayon-global-header.is-compact-mobile .bayon-global-actions {
    width:auto;
    min-width:max-content;
    max-width:none;
    flex:0 0 auto;
    display:flex!important;
    visibility:visible;
    overflow:visible;
    margin-left:auto;
    white-space:nowrap;
  }

  .bayon-global-header.is-compact-mobile .bayon-mobile-search-menu {
    display:block!important;
    flex:0 0 auto;
    order:1;
  }

  .bayon-global-header.is-compact-mobile .bayon-language-menu {
    display:block!important;
    flex:0 0 auto;
    order:2;
  }

  .bayon-global-header.is-compact-mobile .bayon-theme-button {
    display:inline-grid!important;
    flex:0 0 auto;
    order:3;
  }

  .bayon-global-header.is-compact-mobile .bayon-signin-button,
  .bayon-global-header.is-compact-mobile .bayon-global-actions > .dropdown {
    flex:0 0 auto;
    order:4;
  }

  .bayon-global-header.is-compact-mobile .bayon-signin-button {
    display:grid!important;
  }

  .bayon-global-header.is-compact-mobile .bayon-signin-icon {
    display:block!important;
    width:1.08rem;
    height:1.08rem;
  }

  .bayon-global-header.is-compact-mobile .bayon-signin-label {
    display:none!important;
  }
}

@media (max-width:575.98px) {
  .bayon-global-header.is-compact-mobile .bayon-shell {
    padding-left:.65rem;
    padding-right:.65rem;
  }

  .bayon-global-header.is-compact-mobile .bayon-global-menu {
    gap:.08rem;
  }

  .bayon-global-header.is-compact-mobile .bayon-global-links {
    gap:0;
  }

  .bayon-global-header.is-compact-mobile .bayon-global-actions {
    gap:0;
  }
}