.page-poems .poem-block {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(1.75rem, 3vw, 2.5rem) clamp(3.25rem, 7vw, 4.5rem);
  border: 1px solid #bdad8e;
  border-radius: 2px;
  color: #28231c;
  background-color: #e7ddca;
  background-image:
    url('../images/ornaments/chechen-vertical-border.svg?v=2'),
    url('../images/ornaments/chechen-vertical-border.svg?v=2'),
    radial-gradient(ellipse at 13% 6%, rgba(255, 250, 235, .74), transparent 42%),
    radial-gradient(ellipse at 92% 76%, rgba(164, 123, 66, .13), transparent 48%),
    linear-gradient(125deg, #e1d2b7, #eee5d3 49%, #e3d6c0);
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  background-position: left center, right center, 13% 6%, 92% 76%, center;
  background-size:
    clamp(3rem, 5vw, 3.6rem) 100%,
    clamp(3rem, 5vw, 3.6rem) 100%,
    100% 100%,
    100% 100%,
    100% 100%;
  box-shadow: inset 0 0 0 5px rgba(255, 250, 235, .2), 0 12px 30px rgba(18, 16, 12, .16);
  transition: color .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.page-poems .poem-block::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  content: '';
  opacity: .1;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grain)' opacity='.25'/%3E%3C/svg%3E");
}

.page-poems .poem-block > * {
  position: relative;
  z-index: 1;
}

.page-poems .poem-block.is-dark {
  border-color: #5c4d39;
  color: #eee7db;
  background-color: #24231f;
  background-image:
    url('../images/ornaments/chechen-vertical-border.svg?v=2'),
    url('../images/ornaments/chechen-vertical-border.svg?v=2'),
    radial-gradient(ellipse at 82% 3%, rgba(190, 147, 78, .16), transparent 38%),
    radial-gradient(ellipse at 8% 92%, rgba(111, 88, 55, .2), transparent 44%),
    linear-gradient(128deg, #1d1e1b, #292820 52%, #1d1e1b);
  box-shadow: inset 0 0 0 5px rgba(255, 255, 255, .025), 0 16px 42px rgba(0, 0, 0, .3);
}

.page-poems .poem-block.is-dark::before {
  opacity: .075;
  mix-blend-mode: screen;
}

.page-poems .poem-block__header {
  position: relative;
  z-index: 1;
  margin-bottom: 1.8rem;
  padding-top: 0;
}

.page-poems .poem-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-height: 44px;
  margin: 0 auto .8rem;
  padding: .45rem .75rem;
  border: 1px solid rgba(105, 79, 46, .48);
  border-radius: 2px;
  background: rgba(255, 251, 241, .44);
  color: #4e3c28;
  font: 500 .76rem/1.2 system-ui, sans-serif;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}

.page-poems .poem-theme-toggle:hover {
  border-color: #927143;
  background: rgba(255, 252, 244, .76);
}

.page-poems .poem-theme-toggle:focus-visible {
  outline: 2px solid #8a6b3d;
  outline-offset: 3px;
}

.page-poems .poem-theme-toggle__icon {
  color: #896b3d;
  font-size: 1rem;
  line-height: 1;
}

.page-poems .poem-block.is-dark .poem-theme-toggle {
  border-color: rgba(211, 177, 122, .48);
  background: rgba(15, 16, 14, .28);
  color: #eadfc9;
}

.page-poems .poem-block.is-dark .poem-theme-toggle:hover {
  border-color: #d1b17f;
  background: rgba(228, 204, 157, .1);
}

.page-poems .poem-block.is-dark .poem-theme-toggle:focus-visible {
  outline-color: #d1b17f;
}

.page-poems .poem-block.is-dark .poem-theme-toggle__icon {
  color: #e8cc98;
}

.page-poems .poem-block__num {
  color: #745a36;
}

.page-poems .poem-block.is-dark .poem-block__num,
.page-poems .poem-block.is-dark .poem-block__title {
  color: #efe6d6;
}

.page-poems .poem-block.is-dark .poem-block__year {
  color: #c4b69e;
}

.page-poems .poem-body {
  max-width: 34rem;
}

.page-poems .poem-stanza {
  margin-bottom: 1.75rem;
  color: #28231c;
  font-family: 'Crimson Pro', Georgia, serif;
  font-size: calc(clamp(1.28rem, 1.7vw, 1.42rem) * var(--reading-scale, 1));
  font-weight: 500;
  line-height: 1.9;
  letter-spacing: .006em;
}

.page-poems .poem-refrain {
  margin-bottom: 1.75rem;
  padding: .95rem 1.1rem;
  border-left: 2px solid #9a7848;
  background: rgba(121, 96, 57, .09);
  box-shadow: 0 4px 14px rgba(62, 47, 27, .055);
  color: #484031;
  font-family: 'Crimson Pro', Georgia, serif;
  font-size: calc(clamp(1.16rem, 1.55vw, 1.3rem) * var(--reading-scale, 1));
  font-weight: 500;
  line-height: 1.85;
}

.page-poems .poem-block.is-dark .poem-stanza {
  color: #eee7db;
}

.page-poems .poem-block.is-dark .poem-refrain {
  border-left-color: #d1b17f;
  background: rgba(230, 214, 184, .07);
  box-shadow: inset 0 0 0 1px rgba(222, 199, 159, .035);
  color: #ded3c0;
}

.page-poems .poem-block.is-dark .poem-date {
  color: #c4b69e;
}

.page-poems .poem-block.is-dark .poem-permalink {
  color: #e0c18a;
}

@media (max-width: 900px) {
  .page-poems .poem-block {
    padding: 1.4rem clamp(3rem, 10vw, 3.8rem);
    background-size: 3rem 100%, 3rem 100%, 100% 100%, 100% 100%, 100% 100%;
  }

  .page-poems .poem-block__header {
    margin-bottom: 1.25rem;
    padding-top: 0;
  }

  .page-poems .poem-body {
    max-width: none;
  }

  .page-poems .poem-stanza,
  .page-poems .poem-refrain {
    font-size: calc(clamp(1.24rem, 4vw, 1.42rem) * var(--reading-scale, 1));
    line-height: 1.88;
  }
}

@media (max-width: 480px) {
  .page-poems .poem-block {
    padding-inline: 2.85rem;
    background-size: 2.7rem 100%, 2.7rem 100%, 100% 100%, 100% 100%, 100% 100%;
  }

  .page-poems .poem-theme-toggle {
    padding-inline: .55rem;
    font-size: .72rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-poems .poem-block,
  .page-poems .poem-theme-toggle {
    transition: none;
  }
}