/* --------------------------------------------------------------------------
   Dealsmaster 5.9 — reader-first edition

   This layer keeps the individual visual language of every guide, but gives
   the whole publication a calmer reading rhythm, dependable search cards,
   opaque night-mode surfaces and a genuinely stable phone layout.
   -------------------------------------------------------------------------- */

:root {
  --dm-reader-width: 70ch;
  --dm-reader-wide: 900px;
  --dm-reader-radius: 18px;
  --dm-reader-shadow: 0 18px 54px rgba(43, 34, 25, .09);
  --dm-reader-focus: #9a3f2c;
}

html { scroll-padding-top: 1.25rem; }

body.dm-reader-first {
  min-width: 0;
  font-size: 17px;
  line-height: 1.62;
}

body.dm-reader-first ::selection {
  color: #1c251f;
  background: #f1cf7a;
}

body.dm-reader-first :is(h1, h2, h3) {
  text-wrap: balance;
}

body.dm-reader-first :is(p, li, figcaption) {
  text-wrap: pretty;
}

body.dm-reader-first :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--dm-reader-focus) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(255, 248, 237, .94) !important;
}

.dm-reading-anchor {
  position: relative;
  top: -1rem;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* A quiet, always-correct progress line. It carries no controls and never
   competes with the article. */
.dm-page-progress {
  position: fixed;
  z-index: 100000;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  pointer-events: none;
  background: transparent;
}

.dm-page-progress span {
  display: block;
  width: var(--dm-page-progress, 0%);
  height: 100%;
  background: linear-gradient(90deg, #bd5a42, #deb85e 55%, #6f8773);
  box-shadow: 0 0 14px rgba(222, 184, 94, .34);
  transition: width 90ms linear;
}

/* --------------------------------------------------------------------------
   Masthead and navigation
   -------------------------------------------------------------------------- */

body.dm-reader-first .dm-site-header {
  isolation: isolate;
}

body.dm-reader-first .dm-site-header .dm-brand-row {
  min-width: 0;
}

body.dm-reader-first .dm-site-header .dm-brand-name {
  letter-spacing: -.045em;
}

body.dm-reader-first .dm-site-header .dm-brand-tagline {
  opacity: .84;
}

body.dm-reader-first .dm-site-header .dm-header-search .wp-block-search__inside-wrapper {
  overflow: visible;
}

body.dm-reader-first .dm-site-header .dm-header-search .wp-block-search__input {
  min-width: 0;
}

body.dm-reader-first .dm-search-assist {
  overflow: hidden;
  border-radius: 14px;
}

body.dm-reader-first .dm-search-assist a {
  min-height: 54px;
}

body.dm-reader-first .dm-context-trail__breadcrumbs [aria-current="page"] {
  max-width: 46ch;
}

/* --------------------------------------------------------------------------
   Search that feels like part of the publication
   -------------------------------------------------------------------------- */

body.search.dm-reader-first .dm-content-shell {
  width: min(1180px, calc(100% - 64px));
  margin-inline: auto;
}

body.search.dm-reader-first .dm-archive-header {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: end;
  margin: clamp(2.4rem, 7vw, 6rem) 0 clamp(2rem, 5vw, 4.5rem);
  padding: 0 0 clamp(1.8rem, 4vw, 3rem);
  border-bottom: 1px solid rgba(62, 54, 45, .2);
}

body.search.dm-reader-first .dm-archive-header .wp-block-query-title {
  max-width: 12ch;
  margin: .15rem 0 .7rem;
  font-size: clamp(3rem, 7vw, 6.7rem);
  line-height: .91;
  letter-spacing: -.06em;
}

body.search.dm-reader-first .dm-search-intro {
  max-width: 48ch;
  margin: 0;
  color: var(--dm-muted);
  font-size: 1rem;
}

body.search.dm-reader-first .dm-archive-header form.wp-block-search {
  width: 100%;
}

body.search.dm-reader-first .dm-archive-header .wp-block-search__inside-wrapper {
  min-height: 54px;
  padding: 5px;
  border: 1px solid rgba(54, 46, 38, .28);
  border-radius: 999px;
  background: #fffaf3;
}

body.search.dm-reader-first .dm-archive-header .wp-block-search__input {
  min-width: 0;
  padding-inline: 1rem;
  border: 0;
  color: #201d18;
  background: transparent;
}

body.search.dm-reader-first .dm-archive-header .wp-block-search__button {
  min-width: 104px;
  border: 0;
  border-radius: 999px;
  color: #201d18;
  background: #e6c675;
}

body.search.dm-reader-first .dm-query-grid .wp-block-post-template {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.2rem, 2.4vw, 2rem);
  margin: 0;
  padding: 0;
}

body.search.dm-reader-first .dm-query-grid .wp-block-post {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(65, 56, 47, .18);
  border-radius: var(--dm-reader-radius);
  background: #fffaf3;
  box-shadow: var(--dm-reader-shadow);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

body.search.dm-reader-first .dm-query-grid .wp-block-post:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 64px rgba(43, 34, 25, .14);
}

body.search.dm-reader-first .dm-query-grid .wp-block-post-featured-image {
  margin: 0;
  overflow: hidden;
  background: #e8dfd2;
}

body.search.dm-reader-first .dm-query-grid .wp-block-post-featured-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 420ms cubic-bezier(.2, .7, .2, 1);
}

body.search.dm-reader-first .dm-query-grid .wp-block-post:hover .wp-block-post-featured-image img {
  transform: scale(1.025);
}

body.search.dm-reader-first .dm-query-grid .dm-post-card-body {
  display: grid;
  gap: .65rem;
  padding: 1.25rem 1.3rem 1.45rem;
}

body.search.dm-reader-first .dm-query-grid .wp-block-post-terms,
body.search.dm-reader-first .dm-query-grid .wp-block-post-date {
  margin: 0;
  color: #7e3022;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.search.dm-reader-first .dm-query-grid .wp-block-post-title {
  margin: 0;
  font-size: clamp(1.55rem, 2.2vw, 2.1rem);
  line-height: 1.02;
}

body.search.dm-reader-first .dm-query-grid .wp-block-post-excerpt,
body.search.dm-reader-first .dm-query-grid .wp-block-post-excerpt p {
  margin: 0;
  color: #5d574f;
  font-size: .97rem;
  line-height: 1.55;
}

body.search.dm-reader-first .dm-query-grid .wp-block-read-more {
  display: inline-flex;
  width: fit-content;
  min-height: 40px;
  align-items: center;
  margin-top: .15rem;
  color: #5b251c;
  font-size: .85rem;
  font-weight: 760;
}

body.search.dm-reader-first .dm-pagination {
  margin-block: 3rem 5rem;
}

body.search.dm-reader-first .dm-empty-collection {
  border-radius: var(--dm-reader-radius);
}

/* --------------------------------------------------------------------------
   Long-form reading rhythm
   -------------------------------------------------------------------------- */

body.single-post.dm-reader-first .dm-article-opening {
  margin-top: clamp(2rem, 5vw, 5rem);
}

body.single-post.dm-reader-first .dm-article-title-group h1 {
  max-width: 14ch;
  letter-spacing: -.055em;
  text-wrap: balance;
}

body.single-post.dm-reader-first .dm-article-deck {
  max-width: 52ch;
  font-size: clamp(1.18rem, 1.7vw, 1.5rem);
  line-height: 1.52;
}

body.single-post.dm-reader-first .dm-article-meta {
  gap: .6rem 1rem;
  font-size: .82rem;
  letter-spacing: .025em;
}

body.single-post.dm-reader-first .dm-reading-layout {
  display: grid;
  width: min(1240px, calc(100% - 64px));
  grid-template-columns: minmax(250px, 300px) minmax(0, var(--dm-reader-wide));
  gap: clamp(2rem, 4.2vw, 4.5rem);
  align-items: start;
  justify-content: center;
  margin-inline: auto;
}

body.single-post.dm-reader-first .dm-guide-experience {
  position: sticky;
  top: 1rem;
  width: 100%;
  max-height: calc(100vh - 2rem);
  overflow: auto;
  overscroll-behavior: contain;
  border-radius: 14px;
  scrollbar-width: thin;
}

body.single-post.dm-reader-first .dm-guide-experience .dm-reader-actions {
  gap: .38rem;
}

body.single-post.dm-reader-first .dm-guide-experience .dm-reader-button {
  min-height: 42px;
}

body.single-post.dm-reader-first .dm-article-content {
  width: 100%;
  min-width: 0;
  max-width: var(--dm-reader-wide);
}

body.single-post.dm-reader-first .dm-article-content :is(p, li, dd) {
  font-size: clamp(1.03rem, 1.15vw, 1.12rem);
  line-height: 1.72;
}

body.single-post.dm-reader-first .dm-article-content :is(p, ul, ol, blockquote) {
  max-width: var(--dm-reader-width);
}

body.single-post.dm-reader-first .dm-article-content h2 {
  max-width: 18ch;
  margin-top: clamp(2rem, 5vw, 4.2rem);
  font-size: clamp(2.15rem, 4vw, 4.2rem);
  line-height: .98;
  letter-spacing: -.04em;
}

body.single-post.dm-reader-first .dm-article-content h3 {
  max-width: 28ch;
  margin-top: 2.25rem;
  font-size: clamp(1.45rem, 2.4vw, 2.25rem);
  line-height: 1.08;
}

body.single-post.dm-reader-first .dm-article-content :is(h2, h3)[id] {
  scroll-margin-top: 1.5rem;
}

body.single-post.dm-reader-first .dm-article-content a:not([class]) {
  font-weight: 650;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}

body.single-post.dm-reader-first .dm-article-content :is(figure, .wp-block-image) {
  margin-block: clamp(1.6rem, 4vw, 3.4rem);
}

body.single-post.dm-reader-first .dm-article-content img {
  border-radius: 10px;
}

body.single-post.dm-reader-first .dm-article-content figcaption {
  max-width: 66ch;
  margin: .7rem auto 0;
  font-size: .86rem;
  line-height: 1.48;
}

body.single-post.dm-reader-first .dm-article-content :is(table, .wp-block-table) {
  max-width: 100%;
}

body.single-post.dm-reader-first .dm-article-content .wp-block-table,
body.single-post.dm-reader-first .dm-article-content [role="region"]:has(> table) {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

body.single-post.dm-reader-first .dm-edition-chapter {
  min-width: 0;
}

body.single-post.dm-reader-first .dm-edition-chapter > :first-child {
  margin-top: 0;
}

body.single-post.dm-reader-first :is(.dm-callout, .dm-mid-route, .dm-note, .dm-boundary, .dm-alert) {
  border-radius: 12px;
}

body.single-post.dm-reader-first .dm-after-article {
  border-radius: var(--dm-reader-radius);
}

/* --------------------------------------------------------------------------
   Dark edition: opaque paper, confident type, visible controls
   -------------------------------------------------------------------------- */

html[data-dm-theme="dark"] body.dm-reader-first {
  --dm-reader-focus: #f2cf77;
  color: #f7eee3;
  background-color: #101713;
}

html[data-dm-theme="dark"] body.dm-reader-first :is(a, button, input, select, textarea, summary):focus-visible {
  box-shadow: 0 0 0 6px rgba(14, 23, 18, .96) !important;
}

html[data-dm-theme="dark"] body.search.dm-reader-first .dm-archive-header {
  border-color: rgba(247, 235, 219, .24);
}

html[data-dm-theme="dark"] body.search.dm-reader-first .dm-search-intro {
  color: #d5c8b9;
}

html[data-dm-theme="dark"] body.search.dm-reader-first .dm-archive-header .wp-block-search__inside-wrapper,
html[data-dm-theme="dark"] body.search.dm-reader-first .dm-query-grid .wp-block-post {
  border-color: rgba(247, 235, 219, .25);
  color: #f7eee3;
  background: #1a2720;
  box-shadow: 0 22px 62px rgba(0, 0, 0, .34);
}

html[data-dm-theme="dark"] body.search.dm-reader-first .dm-archive-header .wp-block-search__input {
  color: #f7eee3;
}

html[data-dm-theme="dark"] body.search.dm-reader-first .dm-query-grid .wp-block-post-title a,
html[data-dm-theme="dark"] body.search.dm-reader-first .dm-query-grid .wp-block-read-more {
  color: #f7eee3;
}

html[data-dm-theme="dark"] body.search.dm-reader-first .dm-query-grid .wp-block-post-excerpt,
html[data-dm-theme="dark"] body.search.dm-reader-first .dm-query-grid .wp-block-post-excerpt p {
  color: #d5c8b9;
}

html[data-dm-theme="dark"] body.search.dm-reader-first .dm-query-grid .wp-block-post-terms,
html[data-dm-theme="dark"] body.search.dm-reader-first .dm-query-grid .wp-block-post-date {
  color: #f1cf7a;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-guide-experience {
  border-color: rgba(247, 235, 219, .28) !important;
  color: #f7eee3 !important;
  background: #17241d !important;
  box-shadow: 0 24px 66px rgba(0, 0, 0, .36) !important;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-guide-experience :is(p, li, small, dd) {
  color: #d8cbbc !important;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-guide-experience :is(summary, dt, strong, a) {
  color: #fff6e9 !important;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-guide-experience :is(.dm-reader-button, .dm-unit-control button) {
  border-color: rgba(247, 235, 219, .3) !important;
  color: #f7eee3 !important;
  background: #25372d !important;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-article-content {
  color: #f7eee3;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-article-content :is(h2, h3, h4, strong) {
  color: #fff6e9;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-article-content :is(p, li, dd, td, figcaption) {
  color: #d8cbbc;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-article-content :is(a, .dm-read-link) {
  color: #f1cf7a;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-article-content :is(
  .dm-callout,
  .dm-mid-route,
  .dm-note,
  .dm-boundary,
  .dm-alert,
  .dm-checklist,
  .dm-sources,
  .dmtp-sources,
  .dm-edition-diagram,
  .dm-edition-board,
  .dm-edition-detail,
  .dm-saveable-plate
) {
  border-color: rgba(247, 235, 219, .25) !important;
  color: #f7eee3 !important;
  background-color: #1b2922 !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 16px 44px rgba(0, 0, 0, .24) !important;
}

html[data-dm-theme="dark"] body.single-post.dm-reader-first .dm-article-content :is(
  .dm-callout,
  .dm-mid-route,
  .dm-note,
  .dm-boundary,
  .dm-alert,
  .dm-checklist,
  .dm-sources,
  .dmtp-sources,
  .dm-edition-diagram,
  .dm-edition-board,
  .dm-edition-detail,
  .dm-saveable-plate
) :is(p, li, small, figcaption, dd) {
  color: #d8cbbc !important;
}

html[data-dm-theme="dark"] body.dm-reader-first .dm-site-footer {
  border-top: 1px solid rgba(247, 235, 219, .22);
}

/* --------------------------------------------------------------------------
   Phone: no overlaps, no slivers, no desktop-only reading furniture
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {
  body.search.dm-reader-first .dm-query-grid .wp-block-post-template {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.single-post.dm-reader-first .dm-reading-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  body.single-post.dm-reader-first .dm-guide-experience {
    position: static;
    max-height: none;
    overflow: visible;
  }
}

@media (max-width: 782px) {
  body.dm-reader-first {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    font-size: 16px;
  }

  body.dm-reader-first .dm-site-header .dm-brand-row {
    display: grid !important;
    width: min(100% - 28px, 1280px) !important;
    grid-template-columns: minmax(0, 1fr) 46px !important;
    gap: .6rem .75rem !important;
    padding: .7rem 0 .65rem !important;
  }

  body.dm-reader-first .dm-site-header .dm-brand-lockup {
    min-width: 0 !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.dm-reader-first .dm-site-header .dm-brand-signature {
    min-width: 0 !important;
  }

  body.dm-reader-first .dm-site-header .dm-brand-name {
    overflow: hidden;
    font-size: clamp(1.45rem, 7vw, 1.82rem) !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.dm-reader-first .dm-site-header .dm-header-desk {
    display: none !important;
  }

  body.dm-reader-first .dm-site-header .dm-brand-tools {
    display: contents !important;
    width: auto !important;
  }

  body.dm-reader-first .dm-site-header .dm-theme-toggle {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  body.dm-reader-first .dm-site-header form.dm-header-search,
  body.dm-reader-first .dm-site-header form.dm-header-search.is-open {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  body.dm-reader-first .dm-site-header form.dm-header-search .wp-block-search__inside-wrapper,
  body.dm-reader-first .dm-site-header form.dm-header-search.is-open .wp-block-search__inside-wrapper {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 3px 3px 3px .9rem !important;
    overflow: visible !important;
    border: 1px solid rgba(63, 54, 45, .24) !important;
    border-radius: 999px !important;
    background: #fffaf3 !important;
    box-shadow: 0 8px 26px rgba(42, 34, 26, .08) !important;
  }

  body.dm-reader-first .dm-site-header form.dm-header-search .wp-block-search__input,
  body.dm-reader-first .dm-site-header form.dm-header-search.is-open .wp-block-search__input {
    position: static !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    padding: .45rem .25rem !important;
    font-size: 16px !important;
    opacity: 1 !important;
    color: #201d18 !important;
    background: transparent !important;
    pointer-events: auto !important;
  }

  body.dm-reader-first .dm-site-header form.dm-header-search .wp-block-search__button {
    position: static !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    color: #201d18 !important;
    background: #e6c675 !important;
  }

  html[data-dm-theme="dark"] body.dm-reader-first .dm-site-header form.dm-header-search .wp-block-search__inside-wrapper,
  html[data-dm-theme="dark"] body.dm-reader-first .dm-site-header form.dm-header-search.is-open .wp-block-search__inside-wrapper {
    border-color: rgba(247, 235, 219, .27) !important;
    background: #1b2922 !important;
  }

  html[data-dm-theme="dark"] body.dm-reader-first .dm-site-header form.dm-header-search .wp-block-search__input {
    color: #f7eee3 !important;
  }

  body.dm-reader-first .dm-site-header .dm-search-assist {
    position: absolute;
    z-index: 4300;
    top: calc(100% + .45rem);
    right: 0;
    left: 0;
    width: 100%;
    max-height: min(62vh, 440px);
    overflow-y: auto;
  }

  body.dm-reader-first .dm-site-header .dm-brand-row {
    z-index: 7;
  }

  body.dm-reader-first .dm-site-header .dm-header-search-dismiss {
    display: none !important;
  }

  body.dm-reader-first .dm-context-trail {
    overflow: hidden;
  }

  body.dm-reader-first .dm-context-trail__inner {
    width: 100% !important;
    overflow-x: auto;
    padding-inline: 14px;
    scrollbar-width: none;
  }

  body.dm-reader-first .dm-context-trail__inner::-webkit-scrollbar {
    display: none;
  }

  body.dm-reader-first .dm-context-trail__breadcrumbs {
    min-width: max-content;
  }

  body.dm-reader-first .dm-context-trail__breadcrumbs [aria-current="page"] {
    max-width: min(54vw, 230px);
  }

  body.search.dm-reader-first .dm-content-shell {
    width: min(100% - 28px, 1180px);
  }

  body.search.dm-reader-first .dm-archive-header {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.4rem;
    margin-block: 2rem;
  }

  body.search.dm-reader-first .dm-archive-header .wp-block-query-title {
    max-width: 11ch;
    font-size: clamp(2.65rem, 13vw, 4.5rem);
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-template {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post {
    display: grid;
    grid-template-columns: minmax(112px, 36%) minmax(0, 1fr);
    border-radius: 14px;
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-featured-image,
  body.search.dm-reader-first .dm-query-grid .wp-block-post-featured-image a,
  body.search.dm-reader-first .dm-query-grid .wp-block-post-featured-image img {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100%;
    min-height: 190px;
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-featured-image a {
    display: block;
    overflow: hidden;
  }

  body.search.dm-reader-first .dm-query-grid .dm-post-card-body {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post:not(:has(.wp-block-post-featured-image)) .dm-post-card-body {
    width: 100% !important;
    grid-column: 1 / -1 !important;
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-featured-image img {
    aspect-ratio: auto;
  }

  body.search.dm-reader-first .dm-query-grid .dm-post-card-body {
    align-content: center;
    padding: 1rem;
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-title {
    font-size: clamp(1.35rem, 6.4vw, 1.8rem);
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-excerpt {
    display: none;
  }

  body.single-post.dm-reader-first .dm-article-opening {
    width: min(100% - 28px, 900px) !important;
    margin-top: 1.6rem;
  }

  body.single-post.dm-reader-first .dm-article-title-group h1 {
    max-width: 11.5ch;
    font-size: clamp(2.75rem, 12vw, 4.4rem) !important;
    line-height: .94 !important;
  }

  body.single-post.dm-reader-first .dm-article-hero,
  body.single-post.dm-reader-first .dm-article-hero img {
    width: 100%;
    max-width: 100%;
  }

  body.single-post.dm-reader-first .dm-article-hero img {
    height: auto !important;
    max-height: 520px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }

  body.single-post.dm-reader-first .dm-reading-layout {
    width: min(100% - 28px, 900px) !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1.25rem !important;
  }

  body.single-post.dm-reader-first .dm-guide-experience {
    position: static !important;
    inset: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 1rem !important;
    border-radius: 14px;
  }

  body.single-post.dm-reader-first .dm-guide-experience .dm-guide-nav:not([open]) > :not(summary),
  body.single-post.dm-reader-first .dm-guide-experience .dm-guide-context:not([open]) > :not(summary) {
    display: none !important;
  }

  body.single-post.dm-reader-first .dm-guide-experience .dm-guide-nav[open] > :not(summary),
  body.single-post.dm-reader-first .dm-guide-experience .dm-guide-context[open] > :not(summary) {
    display: block !important;
  }

  body.single-post.dm-reader-first .dm-guide-experience .dm-guide-nav ol {
    max-height: min(54vh, 390px);
    overflow-y: auto;
  }

  body.single-post.dm-reader-first .dm-article-content {
    width: 100%;
    max-width: 100%;
  }

  body.single-post.dm-reader-first .dm-article-content h2 {
    max-width: 13ch;
    font-size: clamp(2.05rem, 10.2vw, 3.35rem);
  }

  body.single-post.dm-reader-first .dm-article-content h3 {
    font-size: clamp(1.42rem, 7vw, 2rem);
  }

  body.single-post.dm-reader-first .dm-article-content :is(p, li, dd) {
    font-size: 1.02rem;
    line-height: 1.7;
  }

  body.single-post.dm-reader-first .dm-article-content :is(.dm-edition-chapter, .dm-edition-board, .dm-edition-diagram, .dm-edition-detail, .dm-saveable-plate) {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.single-post.dm-reader-first .dm-article-content .dm-edition-chapter {
    padding-inline: 0 !important;
  }

  body.single-post.dm-reader-first .dm-article-content :is(table, .wp-block-table table) {
    min-width: 620px;
  }

  /* Homepage visual rails: the image and its words are always two separate
     rows. This directly prevents the old caption/title overlap. */
  body.dm-reader-first .dm-field-notes__rail {
    grid-auto-columns: min(86vw, 340px) !important;
  }

  body.dm-reader-first .dm-field-note-card,
  body.dm-reader-first .dm-field-note-card figure {
    display: grid !important;
    min-width: 0 !important;
    grid-template-rows: auto auto !important;
  }

  body.dm-reader-first .dm-field-note-card figure > img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 430px !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
  }

  body.dm-reader-first .dm-field-note-card figcaption {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    min-width: 0 !important;
    min-height: 0 !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: .45rem .7rem !important;
    padding: 1rem !important;
    transform: none !important;
  }

  body.dm-reader-first .dm-field-note-card figcaption strong,
  body.dm-reader-first .dm-field-note-card figcaption p {
    position: static !important;
    min-width: 0 !important;
    margin: 0 !important;
    transform: none !important;
  }

  body.dm-reader-first .dm-field-note-card figcaption p {
    grid-column: 2 !important;
    font-size: .92rem !important;
    line-height: 1.5 !important;
  }

  body.dm-reader-first .dm-reset-lab__grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1rem !important;
  }

  body.dm-reader-first .dm-reset-lab__grid > * {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    grid-column: 1 !important;
    transform: none !important;
  }

  body.dm-reader-first .dm-reset-lab__result {
    min-height: 0 !important;
  }

  body.dm-reader-first .dm-guide-directory__header h1 {
    max-width: 9ch;
    font-size: clamp(3.15rem, 16vw, 4.35rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -.04em !important;
  }

  body.dm-reader-first .dm-guide-directory .dm-finder-footer {
    display: none !important;
  }

  body.dm-reader-first :is(.dm-story-routes__grid, .dm-next-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.dm-reader-first .dm-site-footer .dm-footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .35rem 1rem !important;
  }

  html body.dm-reader-first.dm-human-warmth .dm-site-footer .dm-footer-grid > nav:nth-child(n) {
    grid-column: auto !important;
    padding-block: .85rem !important;
    border-bottom: 1px solid rgba(247, 235, 219, .16);
  }

  html body.dm-reader-first.dm-human-warmth .dm-site-footer .dm-footer-grid > nav:nth-child(3),
  html body.dm-reader-first.dm-human-warmth .dm-site-footer .dm-footer-grid > nav.dm-footer-practical {
    grid-column: 1 / -1 !important;
  }

  html body.dm-reader-first.dm-human-warmth .dm-site-footer .dm-footer-grid > nav:nth-child(3) ul,
  html body.dm-reader-first.dm-human-warmth .dm-site-footer .dm-footer-grid > nav.dm-footer-practical ul {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .1rem .8rem !important;
  }
}

@media (max-width: 480px) {
  body.search.dm-reader-first .dm-query-grid .wp-block-post {
    grid-template-columns: minmax(104px, 34%) minmax(0, 1fr);
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-date,
  body.search.dm-reader-first .dm-query-grid .wp-block-read-more {
    display: none;
  }

  body.search.dm-reader-first .dm-query-grid .wp-block-post-title {
    font-size: 1.32rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dm-page-progress span,
  body.dm-reader-first .dm-query-grid .wp-block-post,
  body.dm-reader-first .dm-query-grid .wp-block-post img {
    transition: none !important;
  }
}

/* The earlier dark-mode layer used an extra html/body specificity step for
   the compact two-icon header. Keep this final phone rule equally specific so
   search remains a visible field in both colour schemes. */
@media (max-width: 782px) {
  html body.dm-reader-first.dm-human-warmth .dm-site-header .dm-brand-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 46px !important;
  }

  html body.dm-reader-first.dm-human-warmth .dm-site-header .dm-brand-row .dm-brand-tools {
    display: contents !important;
    width: auto !important;
    grid-template-columns: none !important;
  }

  html body.dm-reader-first.dm-human-warmth .dm-site-header .dm-brand-row form.dm-header-search,
  html[data-dm-theme="dark"] body.dm-reader-first.dm-human-warmth .dm-site-header .dm-brand-row form.dm-header-search {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }
}

@media print {
  .dm-page-progress,
  body.single-post.dm-reader-first .dm-guide-experience,
  body.single-post.dm-reader-first .dm-story-routes,
  body.single-post.dm-reader-first .dm-after-article,
  body.single-post.dm-reader-first .dm-site-header,
  body.single-post.dm-reader-first .dm-site-footer {
    display: none !important;
  }

  body.single-post.dm-reader-first .dm-reading-layout {
    display: block !important;
    width: 100% !important;
  }

  body.single-post.dm-reader-first .dm-article-content {
    max-width: none !important;
    color: #111 !important;
  }
}

/* DM 5.9.2 — calm left-side Explore drawer
   Keep the modal semantics and focus management from editorial-v13.js while
   moving only the physical panel. Discrete display/overlay transitions let
   the same motion play in reverse when the native dialog closes. */
@media (max-width: 782px) {
  .dm-nav-drawer {
    inset: 0 auto 0 0 !important;
    opacity: 0;
    transition:
      opacity 420ms cubic-bezier(.33, 1, .68, 1),
      display 560ms allow-discrete,
      overlay 560ms allow-discrete;
  }

  .dm-nav-drawer[open] {
    display: block;
    opacity: 1;
    animation: none !important;
  }

  .dm-nav-drawer::backdrop {
    background: rgba(20, 29, 24, 0);
    backdrop-filter: blur(0);
    transition:
      background-color 420ms ease,
      backdrop-filter 480ms ease,
      display 560ms allow-discrete,
      overlay 560ms allow-discrete;
  }

  .dm-nav-drawer[open]::backdrop {
    background: rgba(20, 29, 24, .48);
    backdrop-filter: blur(4px);
  }

  .dm-nav-drawer__backdrop {
    background: rgba(20, 29, 24, 0) !important;
    backdrop-filter: blur(0) !important;
    opacity: 0;
    transition: opacity 420ms ease, backdrop-filter 480ms ease !important;
  }

  .dm-nav-drawer[open] .dm-nav-drawer__backdrop {
    background: rgba(20, 29, 24, .48) !important;
    backdrop-filter: blur(4px) !important;
    opacity: 1;
  }

  .dm-nav-drawer__surface {
    margin-right: auto !important;
    margin-left: 0 !important;
    border-right: 1px solid rgba(23, 59, 49, .18) !important;
    border-left: 0 !important;
    opacity: .985;
    transform: translate3d(-102%, 0, 0);
    transform-origin: left center;
    transition:
      transform 560ms cubic-bezier(.22, 1, .36, 1),
      opacity 320ms ease !important;
    box-shadow: 24px 0 70px rgba(23, 27, 23, .22) !important;
    will-change: transform;
  }

  .dm-nav-drawer[open] .dm-nav-drawer__surface {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  @starting-style {
    .dm-nav-drawer[open] {
      opacity: 0;
    }

    .dm-nav-drawer[open]::backdrop {
      background: rgba(20, 29, 24, 0);
      backdrop-filter: blur(0);
    }

    .dm-nav-drawer[open] .dm-nav-drawer__backdrop {
      opacity: 0;
    }

    .dm-nav-drawer[open] .dm-nav-drawer__surface {
      opacity: .985;
      transform: translate3d(-102%, 0, 0);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .dm-nav-drawer,
  .dm-nav-drawer::backdrop,
  .dm-nav-drawer__backdrop,
  .dm-nav-drawer__surface {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}

/* DM 5.9.4 — quiet day/night dissolve
   Native View Transitions use a motionless cross-dissolve. The fallback uses
   a soft atmospheric wash to conceal the palette hand-off cleanly. */
::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: 820ms !important;
  animation-timing-function: cubic-bezier(.22, 1, .36, 1) !important;
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  animation-name: dm-theme-dissolve-out !important;
}

::view-transition-new(root) {
  animation-name: dm-theme-dissolve-in !important;
}

html.dm-theme-soft-switch {
  --dm-theme-soft-ease: cubic-bezier(.22, 1, .36, 1);
}

html.dm-theme-soft-switch[data-dm-theme-target="dark"] {
  --dm-theme-soft-wash:
    radial-gradient(circle at 82% 7%, rgba(239, 201, 109, .14), transparent 24rem),
    linear-gradient(145deg, #1a2821, #101713 72%);
}

html.dm-theme-soft-switch[data-dm-theme-target="light"] {
  --dm-theme-soft-wash:
    radial-gradient(circle at 82% 7%, rgba(217, 182, 90, .13), transparent 25rem),
    linear-gradient(145deg, #eee3d3, #faf6ef 72%);
}

html.dm-theme-soft-switch::after {
  position: fixed;
  z-index: 2147483000;
  inset: 0;
  background: var(--dm-theme-soft-wash);
  content: "";
  opacity: 0;
  pointer-events: none;
  animation: dm-theme-soft-wash 1020ms var(--dm-theme-soft-ease) both;
}

html.dm-theme-soft-switch .dm-theme-toggle svg,
html.dm-theme-soft-switch .dm-theme-toggle__moon,
html.dm-theme-soft-switch .dm-theme-toggle__sun,
html.dm-theme-soft-switch .dm-theme-toggle__ray {
  transition-duration: 760ms !important;
  transition-timing-function: var(--dm-theme-soft-ease) !important;
}

@keyframes dm-theme-dissolve-out {
  0% { opacity: 1; }
  42% { opacity: .94; }
  100% { opacity: 0; }
}

@keyframes dm-theme-dissolve-in {
  0% { opacity: 0; }
  28% { opacity: .1; }
  100% { opacity: 1; }
}

@keyframes dm-theme-soft-wash {
  0% { opacity: 0; }
  26% { opacity: .94; }
  40% { opacity: .9; }
  100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html.dm-theme-soft-switch::after {
    display: none !important;
    animation: none !important;
  }

  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none !important;
  }
}

/* DM 5.9.5 — continuous dark mobile Explore rail
   The rail already owns the full-width gradient. Avoid painting a second,
   narrower dark card on the button inside it. */
@media (max-width: 782px) {
  html[data-dm-theme="dark"] .dm-site-header .dm-nav-mobile-toggle {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* DM 5.9.6 — houseplant atlas dark-mode palette repair
   The DM50 publisher owns this bespoke guide, so it does not receive the
   legacy dm-article-edition body class used by the original dark adapters.
   Reconnect only the .dm-hp design system to its existing after-hours tokens. */
html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp {
  --dm-hp-forest: #27473a;
  --dm-hp-leaf: #91ad8b;
  --dm-hp-ochre: #d9a062;
  --dm-hp-paper: #142019;
  --dm-hp-card: #1d2a22;
  --dm-hp-ink: #f1e8dc;
  --dm-hp-line: rgba(239, 226, 210, .17);
  color: #f1e8dc !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp :is(
  .dm-hp__passport,
  .dm-hp__map,
  .dm-hp__log,
  .dm-hp__matrix-wrap,
  .dm-hp__water-route,
  .dm-hp__route li,
  .dm-hp__safety,
  .dm-hp__safety-grid section,
  .dm-hp__worked section,
  .dm-hp__change-log,
  .dm-hp__change-grid div,
  .dm-hp__next a
) {
  border-color: rgba(239, 226, 210, .18) !important;
  color: #f1e8dc !important;
  background: #1c2821 !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp :is(
  .dm-hp__passport,
  .dm-hp__light-figure
) {
  color: #f1e8dc !important;
  background: linear-gradient(140deg, #163126, #1d2d25) !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__room {
  border-color: rgba(239, 201, 109, .42) !important;
  background: #142119 !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__room span {
  border-color: rgba(239, 226, 210, .15) !important;
  color: #f1e8dc !important;
  background: #27372e !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__room :is(.dm-hp__window, .dm-hp__glass) {
  background: #284249 !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__room .dm-hp__door {
  background: #4b392b !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__room .dm-hp__point-a {
  background: #5b4d28 !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__room .dm-hp__point-b {
  background: #2c412f !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__room .dm-hp__point-c {
  background: #57382c !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp :is(.dm-hp__table th, .dm-hp__table caption) {
  color: #f1e8dc !important;
  background: #26382d !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__map-label {
  color: #efc96d !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__week-mark span {
  color: #efc96d !important;
  background: #1c2821 !important;
}

html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__week-mark span:nth-child(2),
html[data-dm-theme="dark"] body.single-post.dm50-guide .dm-article-content .dm-hp .dm-hp__week-mark span:nth-child(5) {
  color: #101713 !important;
  background: #efc96d !important;
}
