/* Crescendo Lumen — Bootstrap 5 theme overrides
   Rule: Bootstrap is the foundation. Lumen is the design language.
   Structure/behaviour from Bootstrap; personality from Crescendo Paper Reader. */

:root,
[data-bs-theme="light"] {
  --bs-body-font-family: "Source Sans 3", "Segoe UI", sans-serif;
  --bs-body-color: #2f2b26;
  --bs-body-bg: #f3ebe0;
  --bs-primary: #4a6354;
  --bs-primary-rgb: 74, 99, 84;
  --bs-secondary: #7a7368;
  --bs-secondary-rgb: 122, 115, 104;
  --bs-success: #4a6354;
  --bs-warning: #b7791f;
  --bs-danger: #8a4b3a;
  --bs-info: #5a6e7a;
  --bs-light: #faf6ee;
  --bs-dark: #2f2b26;
  --bs-border-color: #e0d5c4;
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-link-color: #4a6354;
  --bs-link-hover-color: #3a4f42;
  --bs-focus-ring-color: rgba(74, 99, 84, 0.35);
  --lumen-paper: #faf6ee;
  --lumen-sheet: #fbf7ef;
  --lumen-ink: #2f2b26;
  --lumen-muted: #7a7368;
  --lumen-line: #e0d5c4;
  --lumen-accent: #4a6354;
  --lumen-accent-soft: #e4eee7;
}

body.crescendo-lumen {
  color: var(--lumen-ink);
  background:
    radial-gradient(ellipse at 50% 0%, rgba(255, 255, 255, 0.5), transparent 42rem),
    radial-gradient(circle at 90% 10%, rgba(210, 190, 150, 0.18), transparent 28rem),
    linear-gradient(180deg, #f7f1e6 0%, #efe6d8 100%);
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
}

body.crescendo-lumen .font-display,
body.crescendo-lumen .navbar-brand,
body.crescendo-lumen .greeting-line,
body.crescendo-lumen h1,
body.crescendo-lumen h2,
body.crescendo-lumen h3,
body.crescendo-lumen .card-title,
body.crescendo-lumen .book-cover strong,
body.crescendo-lumen .collection-card strong {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
}

/* Room — Bootstrap navbar themed as paper chrome */
.crescendo-navbar {
  --bs-navbar-padding-y: 0.55rem;
  background: rgba(250, 246, 238, 0.94) !important;
  border-bottom: 1px solid var(--lumen-line);
  backdrop-filter: blur(10px);
}
.crescendo-navbar .navbar-brand {
  font-size: 1.65rem;
  color: var(--lumen-accent) !important;
  letter-spacing: 0.02em;
}
.crescendo-navbar .nav-link {
  font-weight: 600;
  color: var(--lumen-muted) !important;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.crescendo-navbar .nav-link.active,
.crescendo-navbar .nav-link[aria-current="page"] {
  color: var(--lumen-accent) !important;
  background: var(--lumen-accent-soft);
}
.crescendo-navbar .btn-identity {
  font-weight: 600;
  border-color: transparent;
  background: transparent;
}
.crescendo-navbar .identity-dot {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--lumen-accent);
  box-shadow: 0 0 0 3px rgba(74, 99, 84, 0.15);
  display: inline-block;
}

/* Workspace grid */
.workspace-app {
  height: calc(100vh - 3.75rem);
  height: calc(100dvh - 3.75rem);
  min-height: 0;
  overflow: hidden;
}
.bookshelf-pane {
  min-height: 0;
  height: 100%;
  overflow: auto;
  border-right: 1px solid var(--lumen-line);
  background: rgba(250, 246, 238, 0.72);
}
.reading-desk {
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: auto;
  padding: 1.25rem 1.5rem 2rem;
}
@media (min-width: 1400px) {
  .reading-desk { padding: 1.5rem 2.25rem 2.25rem; }
}

/* Offcanvas bookshelf below lg — Bootstrap owns show/hide; no custom drawer. */
.offcanvas.bookshelf-offcanvas {
  --bs-offcanvas-width: min(18.5rem, 86vw);
  --bs-offcanvas-bg: var(--lumen-sheet);
  --bs-offcanvas-border-color: var(--lumen-line);
  --bs-offcanvas-zindex: 1045;
}
body.crescendo-lumen .shelf-menu-toggle.navbar-toggler {
  border-color: var(--lumen-line);
  color: var(--lumen-ink);
}
body.crescendo-lumen .shelf-menu-toggle .navbar-toggler-icon {
  width: 1.35rem;
  height: 1.35rem;
}
@media (max-width: 991.98px) {
  .bookshelf-pane {
    width: 0 !important;
    max-width: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: visible;
    background: transparent !important;
  }
  .offcanvas.bookshelf-offcanvas {
    border-right: 1px solid var(--lumen-line);
  }
  .offcanvas.bookshelf-offcanvas .offcanvas-header {
    padding: 1rem 1rem 0.85rem;
  }
  .offcanvas.bookshelf-offcanvas .offcanvas-title {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 1.45rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: none;
    color: var(--lumen-ink);
  }
  .offcanvas.bookshelf-offcanvas .offcanvas-body {
    padding: 1rem 0.85rem 1.25rem;
  }
}
@media (min-width: 992px) {
  .offcanvas-lg.bookshelf-offcanvas {
    position: relative !important;
    transform: none !important;
    visibility: visible !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .offcanvas-lg.bookshelf-offcanvas .offcanvas-header { display: none; }
  .offcanvas-lg.bookshelf-offcanvas .offcanvas-body {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
    padding: 1.25rem 0.85rem 1.5rem;
    overflow: auto;
  }
}

.paper-rail-label {
  margin: 0 0 0.35rem 0.35rem;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lumen-muted);
}
.rail-collection-list { display: grid; gap: 0.2rem; }
.rail-collection {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  min-height: 44px;
  padding: 0.55rem 0.65rem;
  border: 0;
  background: transparent;
  color: var(--lumen-ink);
  font: inherit;
  font-size: 0.92rem;
  text-align: left;
  cursor: pointer;
}
.rail-collection[aria-pressed="true"] { background: rgba(63, 93, 74, 0.1); }
.rail-collection-count { color: var(--lumen-muted); font-size: 0.8rem; font-weight: 700; }

/* Paper cards on Bootstrap card */
.crescendo-lumen .card.paper-card,
.crescendo-lumen .paper-card.card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.35), transparent 40%), var(--lumen-sheet);
  border-color: var(--lumen-line);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65) inset, 0 10px 24px rgba(42, 42, 40, 0.07);
}
.crescendo-lumen .btn-primary {
  --bs-btn-bg: #4a6354;
  --bs-btn-border-color: #4a6354;
  --bs-btn-hover-bg: #3f5648;
  --bs-btn-hover-border-color: #3f5648;
  --bs-btn-active-bg: #35493d;
  --bs-btn-active-border-color: #35493d;
  min-height: 44px;
  font-weight: 600;
}
.crescendo-lumen .btn-outline-secondary,
.crescendo-lumen .btn-secondary {
  min-height: 44px;
  font-weight: 600;
}
.crescendo-lumen .form-control,
.crescendo-lumen .form-select {
  border-color: var(--lumen-line);
  background-color: #fffdf8;
  min-height: 2.75rem;
}
.crescendo-lumen .form-control:focus,
.crescendo-lumen .form-select:focus {
  border-color: var(--lumen-accent);
  box-shadow: 0 0 0 0.2rem rgba(74, 99, 84, 0.2);
}
.crescendo-lumen .modal-content {
  background: var(--lumen-sheet);
  border-color: var(--lumen-line);
  border-radius: 0;
}
.crescendo-lumen .modal-header,
.crescendo-lumen .modal-footer {
  border-color: var(--lumen-line);
}

.eyebrow {
  color: var(--lumen-accent);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-size: 0.72rem;
  font-weight: 700;
  margin: 0;
}
.greeting-line {
  margin: 0 0 0.35rem;
  color: var(--lumen-accent);
  font-size: clamp(1.35rem, 3vw, 1.85rem);
  font-style: italic;
  font-weight: 500;
}
.shelf-lede { color: var(--lumen-muted); line-height: 1.5; }
.shelf-screen { display: none; }
.shelf-screen.is-active { display: block; }
.shelf-topbar h1 {
  margin: 0.15rem 0 0.7rem;
  font-size: clamp(2.4rem, 8vw, 4.4rem);
  font-weight: 500;
  line-height: 0.92;
  letter-spacing: -0.02em;
}
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.collection-shelf,
.book-shelf,
.book-row,
.expression-shelf,
.artifact-shelf,
.edition-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 10.5rem), 1fr));
  gap: 1rem;
  width: 100%;
}
@media (min-width: 992px) {
  .collection-shelf, .book-shelf { grid-template-columns: repeat(auto-fill, minmax(9.25rem, 1fr)); }
  .book-row { grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); }
}
@media (min-width: 1400px) {
  .collection-shelf, .book-shelf { grid-template-columns: repeat(auto-fill, minmax(8.75rem, 1fr)); }
}

.shelf-folder,
.collection-card {
  position: relative;
  min-height: 9.5rem;
  padding: 1.15rem 1rem 1rem;
  border: 1px solid var(--lumen-line);
  background: linear-gradient(165deg, #fffdf8, var(--lumen-sheet));
  box-shadow: 0 8px 20px rgba(47, 43, 38, 0.05);
  text-align: left;
  color: inherit;
  font: inherit;
  cursor: pointer;
  width: 100%;
}
.collection-card[aria-pressed="true"] { outline: 2px solid var(--lumen-accent); outline-offset: 2px; }
.book-cover {
  position: relative;
  min-height: 11.5rem;
  padding: 1.15rem 1rem 1rem 1.25rem;
  border: 1px solid var(--lumen-line);
  background: linear-gradient(180deg, #fffdf9, #f4ebe0);
  box-shadow: 0 14px 28px rgba(47, 43, 38, 0.07);
  text-align: left;
  color: inherit;
  font: inherit;
  cursor: pointer;
  width: 100%;
}
.book-cover-spine {
  position: absolute; left: 0; top: 0; bottom: 0; width: 8px;
  background: linear-gradient(90deg, rgba(74, 99, 84, 0.35), rgba(74, 99, 84, 0.08));
}
.paper-icon { display: block; flex: 0 0 auto; opacity: 0.92; }
.paper-icon-invert { filter: invert(1) brightness(1.05); }

.library-counts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; margin: 0; }
@media (min-width: 768px) {
  .library-counts { grid-template-columns: repeat(4, 1fr); }
}
.library-counts > div { padding: 0.35rem 0; }
.library-counts dt {
  font-size: 0.7rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.1em; color: var(--lumen-muted);
}
.library-counts dd {
  margin: 0.35rem 0 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.55rem;
  font-weight: 500;
}
.type-counts { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.type-counts li {
  display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.35rem 0.65rem; border: 1px solid var(--lumen-line); background: rgba(255, 255, 255, 0.45);
  font-size: 0.78rem; font-weight: 700;
}
.badge.text-bg-crescendo,
.crescendo-lumen .badge {
  background: transparent !important;
  color: var(--lumen-accent) !important;
  font-weight: 600;
  border-radius: 0;
}
.badge.text-bg-crescendo::before,
#health-badge::before { content: "• "; color: var(--lumen-accent); }

.shelf-search-launch {
  display: flex; align-items: center; gap: 0.85rem; width: 100%;
  min-height: 3.6rem; padding: 1rem 1.15rem;
  border: 1px solid var(--lumen-line); background: var(--lumen-sheet);
  color: inherit; font: inherit; font-size: 1.15rem; font-weight: 600;
  cursor: pointer; text-align: left;
  box-shadow: 0 10px 28px rgba(47, 43, 38, 0.06);
}
.shelf-search-launch .paper-strip-end { margin-left: auto; opacity: 0.65; }

.continue-reading { width: 100%; }
.paper-empty { position: relative; text-align: center; padding: 2.5rem 1.5rem; }
.paper-empty-art { margin: 0.5rem auto; }
.paper-clip { position: absolute; top: -0.55rem; right: 1.1rem; transform: rotate(18deg); }
.paper-rail-clef { margin: auto 0.75rem 0.25rem; opacity: 0.28; width: 56px; height: 56px; }

.import-fab-mobile {
  position: fixed; right: 1rem; bottom: 1.25rem; z-index: 1030;
}
@media (min-width: 992px) {
  .import-fab-mobile { display: none !important; }
}

.sources-explorer-form .form-label { font-weight: 600; }
.sources-explorer-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: 1rem; }
.source-card { text-align: left; }
.work-uncertainty { color: #8a6a1f; font-weight: 700; }
.reading-page { width: 100%; }
.expression-card, .artifact-tile, .edition-tile {
  min-height: 7rem; border: 1px solid var(--lumen-line); background: #fffdf8;
  padding: 1rem; text-align: left; color: inherit; font: inherit; cursor: pointer; width: 100%;
}
.identity-instruments { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.identity-chip {
  display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.35rem 0.55rem; border: 1px solid var(--lumen-line); background: rgba(255, 255, 255, 0.5);
  font-size: 0.85rem; font-weight: 700;
}
.workspace-pane[hidden],
.paper-context { display: none !important; }
.context-list { margin: 0; padding-left: 1.1rem; }

/* Preserve prior adaptive contract strings for check.mjs continuity */
.crescendo-lumen-layout-contract {
  /* 15.5rem minmax(0, 1.4fr) 15.5rem */
  grid-template-columns: 15.5rem minmax(0, 1.4fr) 15.5rem;
}

/* ——— CRES-UX-012 Performance Mode ———
   Don't light up the stage. Illuminate only the music. */
.performance-mode-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 44px;
  padding: 0.4rem 0.65rem;
  color: var(--lumen-muted, var(--muted));
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  border: 0;
  background: transparent;
}
.performance-mode-toggle:hover,
.performance-mode-toggle:focus-visible {
  color: var(--lumen-accent, var(--accent));
}
.performance-mode-toggle .performance-mode-icon-off { display: none; }
.performance-mode-toggle .performance-mode-icon-on { display: inline-block; }
html.performance-mode .performance-mode-toggle .performance-mode-icon-on { display: none; }
html.performance-mode .performance-mode-toggle .performance-mode-icon-off { display: inline-block; }
html.performance-mode .performance-mode-toggle.is-active,
html.performance-mode .performance-mode-toggle[aria-pressed="true"] {
  color: #e8e8e8;
}

html.performance-mode,
html.performance-mode body,
body.performance-mode {
  --bs-body-color: #f0f0f0;
  --bs-body-bg: #000000;
  --bs-primary: #c8c8c8;
  --bs-primary-rgb: 200, 200, 200;
  --bs-secondary: #9a9a9a;
  --bs-border-color: #2a2a2a;
  --bs-link-color: #e0e0e0;
  --bs-link-hover-color: #ffffff;
  --lumen-paper: #000000;
  --lumen-sheet: #050505;
  --lumen-ink: #f2f2f2;
  --lumen-muted: #9a9a9a;
  --lumen-line: #2a2a2a;
  --lumen-accent: #d0d0d0;
  --ink: #f2f2f2;
  --muted: #9a9a9a;
  --sheet: #050505;
  --paper: #000000;
  --line: #2a2a2a;
  --accent: #d0d0d0;
  --accent-soft: #1a1a1a;
  color: #f2f2f2;
  background: #000000 !important;
  background-image: none !important;
}

html.performance-mode body.shelf-body,
html.performance-mode body.ereader-library,
html.performance-mode body.crescendo-lumen {
  background: #000000 !important;
  background-image: none !important;
}

html.performance-mode .room-chrome,
html.performance-mode .crescendo-navbar,
html.performance-mode .app-chrome {
  background: rgba(0, 0, 0, 0.92) !important;
  border-bottom-color: #1f1f1f !important;
  backdrop-filter: none;
  box-shadow: none !important;
}

html.performance-mode .bookshelf-pane,
html.performance-mode .music-shelf,
html.performance-mode .offcanvas.bookshelf-offcanvas {
  background: #050505 !important;
  border-color: #1f1f1f !important;
  box-shadow: none !important;
}

html.performance-mode .paper-card,
html.performance-mode .card,
html.performance-mode .modal-content,
html.performance-mode .shelf-search-launch,
html.performance-mode .expression-card,
html.performance-mode .artifact-tile,
html.performance-mode .edition-tile,
html.performance-mode .book-cover,
html.performance-mode .shelf-folder,
html.performance-mode .collection-card,
html.performance-mode .shelf-work-card,
html.performance-mode .work-card,
html.performance-mode .source-card {
  background: #0a0a0a !important;
  border-color: #2a2a2a !important;
  box-shadow: none !important;
  clip-path: none !important;
  background-image: none !important;
}

html.performance-mode .btn-primary,
html.performance-mode .touch-primary {
  background: #1c1c1c !important;
  border-color: #3a3a3a !important;
  color: #f2f2f2 !important;
  box-shadow: none !important;
}

html.performance-mode .btn-outline-secondary,
html.performance-mode .btn-secondary,
html.performance-mode .form-control,
html.performance-mode .form-select {
  background: #0a0a0a !important;
  border-color: #2a2a2a !important;
  color: #f2f2f2 !important;
  box-shadow: none !important;
}

html.performance-mode .paper-rail-clef,
html.performance-mode .paper-clip,
html.performance-mode .paper-empty-art {
  opacity: 0.2;
  filter: invert(1) brightness(1.4);
}

html.performance-mode .reading-desk,
html.performance-mode .paper-stage,
html.performance-mode .work-view,
html.performance-mode .reading-page,
html.performance-mode svg,
html.performance-mode .notation,
html.performance-mode .score-view {
  color: #ffffff;
}

html.performance-mode svg text,
html.performance-mode svg .note,
html.performance-mode svg path,
html.performance-mode svg line,
html.performance-mode svg rect {
  stroke: #ffffff;
  fill: #ffffff;
}

html.performance-mode .greeting-line,
html.performance-mode .eyebrow,
html.performance-mode .chrome-brand,
html.performance-mode .nav-link,
html.performance-mode .shelf-lede {
  color: #bdbdbd !important;
}

html.performance-mode .identity-dot {
  background: #c8c8c8;
  box-shadow: none;
}

html.performance-mode .badge,
html.performance-mode .alert {
  background: #111 !important;
  border-color: #2a2a2a !important;
  color: #e8e8e8 !important;
  box-shadow: none !important;
}

/* Reading chrome: fade away; interaction briefly restores. Toggle stays reachable. */
html.performance-mode.performance-chrome-idle .room-chrome {
  opacity: 0.12;
  transition: opacity 0.55s ease;
}
html.performance-mode.performance-chrome-idle .bookshelf-pane,
html.performance-mode.performance-chrome-idle .music-shelf:not(.show),
html.performance-mode.performance-chrome-idle .import-fab-mobile,
html.performance-mode.performance-chrome-idle .paper-import-mobile {
  opacity: 0.08;
  transition: opacity 0.55s ease;
}
html.performance-mode.performance-chrome-idle .shelf-topbar.ereader-opening {
  opacity: 0.35;
}
html.performance-mode.performance-chrome-idle .performance-mode-toggle {
  opacity: 0.55;
}
html.performance-mode .room-chrome,
html.performance-mode .bookshelf-pane,
html.performance-mode .shelf-topbar {
  transition: opacity 0.35s ease;
}

/* CRES-NAV-001 — dense Room navigation */
.room-nav-body { gap: 0.45rem !important; padding-top: 0.75rem; }
.room-nav-body .paper-rail-label { margin-bottom: 0.35rem; }
.room-primary-nav,
.room-saved-views {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.room-nav-section-label {
  margin: 0.85rem 0 0.2rem;
  font-size: 0.65rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--lumen-muted, #6a655c);
}
.room-nav-link {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.92rem;
  line-height: 1.2;
  padding: 0.32rem 0.45rem;
  border-radius: 0.35rem;
  text-decoration: none;
}
a.room-nav-link { color: inherit; }
.room-nav-link:hover,
.room-nav-link:focus-visible {
  background: rgba(255, 255, 255, 0.72);
  color: inherit;
}
.room-nav-link.is-active,
.room-nav-link[aria-current="page"] {
  background: #fff;
  font-weight: 600;
  box-shadow: inset 2px 0 0 var(--lumen-accent, #3f5d4a);
}
.room-saved-views .room-nav-link {
  font-size: 0.86rem;
  color: var(--lumen-muted, #6a655c);
}
.room-nav-rail .paper-import { margin-top: auto; }
body.workspace-shell .bookshelf-pane {
  --bookshelf-width: clamp(12.5rem, 14vw, 15.5rem);
}