/* Briarbound polish pass (September 2026)
   Loaded after the compiled rulebook stylesheet. Screen-only: printed
   rulebooks and 2-page references keep their original sizes and layout.
   No rule text, artwork, or game data is changed here. */

@media screen {
  /* ---------- Sticky bars: stop text showing through ---------- */
  .rulebook-topbar {
    background: rgba(25, 15, 11, 0.985);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }

  /* ---------- Readable contrast ---------- */
  /* "Continue in the Character Vault" / "Open the complete library" banners */
  .catalog-callout b {
    color: #fffaf0;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
  }
  .catalog-callout span {
    font-size: 10px;
  }
  .catalog-callout {
    transition: filter 0.2s ease, transform 0.2s ease;
  }
  .catalog-callout:hover {
    filter: brightness(1.08);
  }
  .catalog-callout:focus-visible {
    outline: 3px solid #f4d994;
    outline-offset: 3px;
  }
  /* Worked Tallowmere scene title sat dark-on-dark in the Guide chapters */
  .guide-chapter .example-block h3 {
    color: #f6ead0;
  }

  /* ---------- Tables: nothing cut off ---------- */
  .rules-grid > *,
  .rule-panel {
    min-width: 0;
  }
  /* The result table inside the half-width "NPC attacks" panel wraps instead
     of hiding its right-hand column behind a scroll. */
  .rule-panel .outcome-table {
    min-width: 0;
    width: 100%;
  }
  .outcome-table-wrap:focus-visible,
  .reach-table-wrap:focus-visible,
  .npc-table-wrap:focus-visible {
    outline: 3px solid #b9852d;
    outline-offset: 2px;
  }

  /* ---------- Comfortable reading sizes ---------- */
  .rule-panel p,
  .creation-steps p,
  .trial-flow p,
  .adventure-recipe p,
  .guide-principles p,
  .conflict-verbs p,
  .example-block p,
  .example-block p:last-child {
    font-size: 14px;
    line-height: 1.6;
  }
  .rule-panel > ul,
  .rule-panel > ol,
  .when-to-roll ul {
    font-size: 13.5px;
    line-height: 1.6;
  }
  .outcome-table td,
  .reach-table td,
  .npc-table td {
    font-size: 13px;
    line-height: 1.45;
  }
  .outcome-table th,
  .reach-table th,
  .npc-table th {
    font-size: 10px;
  }
  .glossary dd {
    font-size: 13px;
    line-height: 1.5;
  }
  .edition-line,
  .chapter-eyebrow,
  .panel-label {
    font-size: 10px;
  }
  .body-copy {
    font-size: 15px;
    max-width: 72ch;
  }
}

@media screen and (width <= 880px) {
  /* Chapter strip: solid backing so the page does not ghost through it */
  .rulebook-toc {
    background: rgba(29, 18, 12, 0.97);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
  .rulebook-toc > a {
    font-size: 12px;
  }
}

@media screen and (width <= 640px) {
  .print-rulebook,
  .vault-button,
  .discord-button {
    font-size: 11px;
  }
  /* Outcome tables fit the phone instead of scrolling sideways */
  .outcome-table {
    min-width: 0;
    width: 100%;
  }
  .outcome-table th,
  .outcome-table td {
    padding: 10px 9px;
  }
  .scene-card-grid {
    grid-template-columns: 1fr;
  }
}

/* ---------- Community policy & changelog ---------- */
@media screen {
  .info-page h2 {
    font-size: clamp(22px, 3.2vw, 28px);
    line-height: 1.2;
  }
  .info-card > h2:first-child {
    margin-top: 0;
  }
  .info-card ul {
    padding-left: 22px;
  }
  .info-card li {
    margin: 0 0 0.55em;
    padding-left: 4px;
  }
  .info-card li::marker {
    color: #c89b4d;
  }
  .release-group h3 {
    margin: 18px 0 8px;
    font-size: 15px;
    letter-spacing: 0.02em;
  }
  .info-nav a {
    padding: 10px 0;
  }
  .info-nav a:hover,
  .info-nav a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
  }
}
