/*
  Visual system for “Відблиск у папороті”.
  The reading mechanics remain shared with the site, while this layer gives the
  story its own nocturnal, organic identity.
*/

.vidblysk-theme {
  --ink: #030907;
  --ink-soft: #07110d;
  --paper: #edf0e7;
  --muted: #89958a;
  --line: rgba(180, 205, 181, 0.13);
  --gold: #86ad78;
  --gold-light: #d5a064;
  --blue: #557d72;
  --serif: "Cormorant Garamond", Georgia, serif;
  background:
    radial-gradient(circle at 78% 8%, rgba(112, 147, 110, .08), transparent 32rem),
    #030907;
}

.vidblysk-theme::before {
  content: "";
  position: fixed;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(115deg, transparent 0 58%, rgba(213, 160, 100, .025) 58.2% 58.35%, transparent 58.55%),
    radial-gradient(circle at 8% 92%, rgba(67, 104, 78, .08), transparent 27rem);
}

.vidblysk-theme .noise { opacity: .07; mix-blend-mode: soft-light; }
.vidblysk-theme .cursor-glow {
  background: radial-gradient(circle, rgba(118, 164, 112, .09), rgba(210, 133, 77, .025) 38%, transparent 70%);
}

.vidblysk-theme .scroll-progress span,
.vidblysk-theme .reader-progress span {
  background: linear-gradient(90deg, #668f68, #d5a064);
  box-shadow: 0 0 1.2rem rgba(134, 173, 120, .35);
}

.vidblysk-theme .site-header.is-scrolled {
  background: rgba(3, 9, 7, .92);
  border-color: rgba(150, 184, 150, .12);
}

.vidblysk-theme .brand-mark {
  filter: drop-shadow(0 .35rem 1rem rgba(118, 164, 112, .18));
}

.vidblysk-theme .hero {
  min-height: 100svh;
  isolation: isolate;
  background:
    radial-gradient(circle at 14% 18%, rgba(135, 169, 145, .09), transparent 28rem),
    linear-gradient(120deg, #020705 0 48%, #07110d 100%);
}

.vidblysk-theme .hero::before {
  content: "";
  position: absolute;
  z-index: 2;
  left: clamp(1.2rem, 8vw, 9rem);
  top: 18%;
  width: 1px;
  height: 12vh;
  background: linear-gradient(transparent, rgba(134, 173, 120, .65), transparent);
}

.vidblysk-theme .hero::after {
  height: 46%;
  background: linear-gradient(transparent, #030907 92%);
}

.vidblysk-theme .hero-art {
  inset: 4% -5% 2% 44%;
  border-radius: 46% 0 0 34% / 27% 0 0 58%;
  background: #07110d;
  box-shadow: -2rem 2rem 8rem rgba(0, 0, 0, .55);
  transform: rotate(-1.5deg);
}

.vidblysk-theme .hero-visual {
  object-position: 55% 48%;
  filter: saturate(.9) brightness(.78) contrast(1.07);
  transform: scale(1.06) rotate(1.5deg);
}

.vidblysk-theme .hero-art::after {
  background:
    linear-gradient(90deg, #030907 0%, rgba(3, 9, 7, .82) 18%, transparent 58%),
    linear-gradient(0deg, #030907 0%, transparent 35%, rgba(3, 9, 7, .25) 100%);
}

.fern-shadow {
  position: absolute;
  z-index: 2;
  width: 26rem;
  height: 42rem;
  opacity: .2;
  filter: blur(.4px);
  transform-origin: bottom center;
}

.fern-shadow::before,
.fern-shadow::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
}

.fern-shadow::before {
  width: 2px;
  height: 100%;
  background: linear-gradient(transparent, rgba(155, 190, 151, .68));
  transform: rotate(17deg);
}

.fern-shadow::after {
  width: 19rem;
  height: 32rem;
  background: repeating-linear-gradient(153deg, transparent 0 1.15rem, rgba(144, 179, 139, .52) 1.2rem 1.33rem, transparent 1.38rem 2.45rem);
  clip-path: polygon(50% 0, 70% 25%, 94% 60%, 73% 100%, 49% 69%, 24% 100%, 8% 60%, 31% 25%);
  transform: translateX(-47%) rotate(13deg);
}

.fern-shadow--one { left: 3%; bottom: -16%; transform: rotate(-24deg); }
.fern-shadow--two { right: -6%; top: -12%; transform: rotate(154deg) scale(.82); opacity: .13; }

.forest-mist {
  position: absolute;
  z-index: 2;
  inset: 48% -10% 7%;
  background: linear-gradient(105deg, transparent, rgba(187, 210, 191, .13), transparent 62%);
  filter: blur(28px);
  transform: rotate(-7deg);
  animation: vidblyskMist 11s ease-in-out infinite alternate;
}

.ember {
  position: absolute;
  z-index: 3;
  width: .33rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #e5a15d;
  box-shadow: 0 0 1.3rem .35rem rgba(219, 130, 67, .48);
  animation: vidblyskEmber 5.8s ease-in-out infinite;
}

.ember--one { right: 28%; top: 34%; }
.ember--two { right: 17%; top: 58%; animation-delay: -2.6s; transform: scale(.7); }

@keyframes vidblyskMist {
  to { transform: translateX(-5%) rotate(-4deg); opacity: .6; }
}

@keyframes vidblyskEmber {
  50% { transform: translate(-1.1rem, -2.3rem) scale(.55); opacity: .35; }
}

.vidblysk-theme .hero-copy { max-width: 60rem; }
.vidblysk-theme h1 { font-weight: 500; letter-spacing: -.06em; }
.vidblysk-theme h1 em,
.vidblysk-theme h2 em { color: #d5a064; font-style: italic; }

.vidblysk-theme .hero h1 {
  font-size: clamp(4.3rem, 9.7vw, 10rem);
  line-height: .77;
  text-shadow: 0 1.2rem 4rem rgba(0, 0, 0, .65);
}

.vidblysk-theme .hero-lead {
  max-width: 34rem;
  color: rgba(230, 237, 226, .66);
}

.story-release-strip {
  width: min(100%, 31rem);
  margin: 0 0 1.4rem .5rem;
  padding: .9rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.4rem;
  border-top: 1px solid rgba(134, 173, 120, .22);
  border-bottom: 1px solid rgba(134, 173, 120, .22);
}

.story-release-strip span {
  color: rgba(230, 237, 226, .42);
  font-size: .58rem;
  letter-spacing: .17em;
  text-transform: uppercase;
}

.story-release-strip strong {
  color: #d5a064;
  font-family: var(--serif);
  font-size: 1rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.story-release-strip.is-live strong { color: #a9ca9e; }

.vidblysk-theme .button {
  border-color: rgba(134, 173, 120, .58);
  background: rgba(5, 17, 12, .28);
  backdrop-filter: blur(8px);
}

.vidblysk-theme .button:hover {
  color: #07100c;
  border-color: #d5a064;
  background: #d5a064;
}

.vidblysk-theme .eyebrow,
.vidblysk-theme .text-link span,
.vidblysk-theme .filter span,
.vidblysk-theme .gallery-position > span,
.vidblysk-theme .card-overlay > span {
  color: #8db280;
}

.vidblysk-theme .about {
  background:
    radial-gradient(circle at 90% 22%, rgba(74, 114, 82, .09), transparent 28rem),
    #030907;
}

.vidblysk-theme .about-title h2,
.vidblysk-theme .gallery h2,
.vidblysk-theme .quotes h2,
.vidblysk-theme .updates h2,
.vidblysk-theme .read-preview-copy h2 {
  font-weight: 500;
}

.vidblysk-theme .dropcap::first-letter { color: #d5a064; }
.vidblysk-theme blockquote span { color: #8db280; }

.vidblysk-theme .story-facts {
  border-color: rgba(141, 178, 128, .17);
  background: rgba(12, 27, 18, .22);
}

.vidblysk-theme .read-preview {
  background:
    radial-gradient(circle at 19% 53%, rgba(198, 119, 65, .14), transparent 25rem),
    linear-gradient(140deg, #07130e, #040906 62%, #130b07);
}

.vidblysk-theme .read-preview-art {
  border-radius: 44% 3% 34% 5% / 17% 3% 25% 7%;
  box-shadow: 0 3rem 8rem rgba(0, 0, 0, .62);
}

.vidblysk-theme .read-preview-art img {
  filter: saturate(.95) brightness(.72) contrast(1.08);
}

.vidblysk-theme .read-preview-art > span {
  width: 6.2rem;
  height: 6.2rem;
  border-radius: 50% 42% 52% 45%;
  border-color: rgba(213, 160, 100, .62);
  color: #d5a064;
}

.vidblysk-theme .gallery {
  background:
    linear-gradient(rgba(3, 9, 7, .88), rgba(3, 9, 7, .96)),
    radial-gradient(circle at 75% 30%, rgba(93, 136, 97, .15), transparent 30rem);
}

.vidblysk-theme .gallery-card {
  border-radius: 1.8rem .2rem 1.8rem .2rem;
  border-color: rgba(141, 178, 128, .15);
  background: #07110d;
}

.vidblysk-theme .gallery-card img {
  filter: saturate(.76) brightness(.66) hue-rotate(-4deg);
}

.vidblysk-theme .gallery-card::after {
  background: linear-gradient(180deg, transparent 30%, rgba(3, 9, 7, .92));
}

.vidblysk-theme .filter.is-active,
.vidblysk-theme .filter:hover {
  border-color: rgba(213, 160, 100, .72);
  color: #e8eee5;
  background: rgba(213, 160, 100, .07);
}

.vidblysk-theme .gallery-position i b { background: linear-gradient(90deg, #6f996f, #d5a064); }
.vidblysk-theme .gallery-navigation button:hover { border-color: #d5a064; color: #d5a064; }

.vidblysk-theme .quotes {
  background:
    radial-gradient(circle at 17% 13%, rgba(121, 159, 120, .1), transparent 29rem),
    #050c09;
}

.vidblysk-theme .quote-card {
  border: 1px solid rgba(145, 180, 144, .14);
  border-radius: .25rem 2rem .25rem 2rem;
  background: linear-gradient(145deg, #07140e, #10110b 66%, #160c08);
  box-shadow: 0 2rem 5rem rgba(0, 0, 0, .22);
}

.vidblysk-theme .quote-card--1 { background: linear-gradient(145deg, #07110d, #1c0e09); }
.vidblysk-theme .quote-card--2 { background: linear-gradient(145deg, #081410, #0b171b); }
.vidblysk-theme .quote-share:hover { color: #d5a064; }

.vidblysk-theme .updates {
  background:
    radial-gradient(circle at 85% 18%, rgba(211, 143, 87, .09), transparent 27rem),
    linear-gradient(120deg, #030907, #08120d);
}

.vidblysk-theme .update-link {
  border-color: rgba(134, 173, 120, .36);
}

.vidblysk-theme .update-link:hover {
  border-color: #d5a064;
  background: rgba(213, 160, 100, .08);
  color: #e9c393;
}

.vidblysk-theme .site-footer { background: #020604; }

/* Reader */
.vidblysk-theme .reader {
  --reader-bg: #06100c;
  --reader-text: #e1e8dd;
  --reader-muted: #869187;
  background:
    radial-gradient(circle at 80% 4%, rgba(91, 134, 94, .08), transparent 28rem),
    var(--reader-bg);
}

.vidblysk-theme .reader.is-paper {
  --reader-bg: #e7e2d5;
  --reader-text: #20271f;
  --reader-muted: #6f766e;
}

.vidblysk-theme .reader-bar {
  border-color: color-mix(in srgb, #8db280 17%, transparent);
  background: color-mix(in srgb, var(--reader-bg) 89%, transparent);
}

.vidblysk-theme .reader-cover-art,
.vidblysk-theme .static-reader-cover-art {
  inset: 2% -7rem 5% 25%;
  border-radius: 45% 0 0 38% / 25% 0 0 58%;
  background: #07110d;
}

.vidblysk-theme .reader-cover-art img,
.vidblysk-theme .static-reader-cover-art img {
  filter: saturate(.8) brightness(.62) contrast(1.08);
}

.vidblysk-theme .reader-cover-art::after,
.vidblysk-theme .static-reader-cover-art::after {
  background:
    linear-gradient(90deg, var(--cover-fade) 0%, color-mix(in srgb, var(--cover-fade) 92%, transparent) 22%, transparent 72%),
    linear-gradient(0deg, var(--cover-fade) 0%, transparent 42%, color-mix(in srgb, var(--cover-fade) 70%, transparent) 100%);
}

.vidblysk-theme .reader-cover h1 { font-weight: 500; line-height: .78; }
.vidblysk-theme .reader-community-count strong { color: #d5a064; }
.vidblysk-theme .reader-community-live i { background: #86ad78; box-shadow: 0 0 0 0 rgba(134, 173, 120, .45); }
.vidblysk-theme .reader-cover-mark { filter: drop-shadow(0 .7rem 2rem rgba(96, 147, 103, .24)); }

.vidblysk-theme .reader-content {
  font-family: Georgia, "Times New Roman", serif;
  text-rendering: optimizeLegibility;
}

.vidblysk-theme .reader-opening {
  color: color-mix(in srgb, var(--reader-text) 92%, #d5a064);
  font-family: var(--serif);
  font-size: 1.24em;
  line-height: 1.55;
}

.vidblysk-theme .reader-chat {
  --chat-bg: #07110d;
  --chat-surface: #152119;
  --chat-accent: #7aa36f;
  --chat-text: #eef2eb;
  position: relative;
  width: min(100%, 29rem);
  margin: 2.8rem auto 3.2rem;
  overflow: hidden;
  border: 1px solid rgba(157, 189, 153, .22);
  border-radius: 2rem;
  background:
    radial-gradient(circle at 90% 5%, rgba(122, 163, 111, .13), transparent 14rem),
    var(--chat-bg);
  box-shadow: 0 2rem 5rem rgba(0, 0, 0, .3);
  color: var(--chat-text);
  font-family: var(--sans);
  font-size: .82rem;
  line-height: 1.5;
}

.vidblysk-theme .reader-chat::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: .48rem;
  left: 50%;
  width: 4.4rem;
  height: .25rem;
  border-radius: 2rem;
  background: rgba(231, 237, 228, .16);
  transform: translateX(-50%);
}

.vidblysk-theme .reader-chat__top {
  min-height: 4.5rem;
  padding: 1.15rem 1.2rem .9rem;
  display: grid;
  grid-template-columns: 2rem 1fr 2rem;
  gap: .6rem;
  align-items: center;
  border-bottom: 1px solid rgba(226, 235, 224, .08);
  background: rgba(1, 7, 4, .4);
  text-align: center;
}

.vidblysk-theme .reader-chat__top i,
.vidblysk-theme .reader-chat__top b {
  color: rgba(238, 242, 235, .48);
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
}

.vidblysk-theme .reader-chat__top div {
  display: grid;
  gap: .05rem;
}

.vidblysk-theme .reader-chat__top strong {
  font-size: .76rem;
  font-weight: 600;
}

.vidblysk-theme .reader-chat__top small {
  color: rgba(238, 242, 235, .42);
  font-size: .52rem;
  letter-spacing: .04em;
}

.vidblysk-theme .reader-chat__body {
  min-height: 19rem;
  padding: 1.3rem 1rem 1.6rem;
  display: flex;
  flex-direction: column;
  gap: .8rem;
  background:
    linear-gradient(rgba(7, 17, 13, .88), rgba(7, 17, 13, .94)),
    radial-gradient(circle at 15% 20%, rgba(134, 173, 120, .11), transparent 12rem);
}

.vidblysk-theme .reader-chat__message {
  max-width: 84%;
  display: grid;
  gap: .2rem;
}

.vidblysk-theme .reader-chat__message > span {
  padding: 0 .65rem;
  color: rgba(213, 224, 209, .48);
  font-size: .48rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.vidblysk-theme .reader-chat__message p {
  margin: 0;
  padding: .68rem .82rem;
  border: 1px solid rgba(226, 235, 224, .06);
  border-radius: 1rem 1rem 1rem .22rem;
  background: var(--chat-surface);
  color: var(--chat-text);
  font-size: .78rem;
  line-height: 1.52;
}

.vidblysk-theme .reader-chat__message.is-outgoing {
  align-self: flex-end;
}

.vidblysk-theme .reader-chat__message.is-outgoing > span {
  text-align: right;
}

.vidblysk-theme .reader-chat__message.is-outgoing p {
  border-color: rgba(141, 178, 128, .2);
  border-radius: 1rem 1rem .22rem 1rem;
  background: linear-gradient(145deg, #496d43, #315137);
}

.vidblysk-theme .reader-chat__input {
  margin: .72rem .82rem .85rem;
  padding: .62rem .7rem .62rem .9rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid rgba(226, 235, 224, .09);
  border-radius: 2rem;
  background: rgba(238, 242, 235, .05);
  color: rgba(238, 242, 235, .34);
  font-size: .58rem;
}

.vidblysk-theme .reader-chat__input i {
  width: 1.45rem;
  height: 1.45rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--chat-accent);
  color: #07110d;
  font-style: normal;
}

.vidblysk-theme .reader-inline-alert,
.vidblysk-theme .reader-inline-status,
.vidblysk-theme .reader-sent-status {
  padding: .14rem .42rem;
  border-radius: .35rem;
  background: color-mix(in srgb, #86ad78 13%, transparent);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  color: color-mix(in srgb, var(--reader-text) 88%, #b8cfad);
  font-family: var(--sans);
  font-size: .78em;
  font-weight: 500;
  letter-spacing: .01em;
}

.vidblysk-theme .reader-sent-status {
  border: 1px solid color-mix(in srgb, #d5a064 35%, transparent);
  background: color-mix(in srgb, #d5a064 10%, transparent);
  color: color-mix(in srgb, var(--reader-text) 82%, #d5a064);
  text-transform: uppercase;
  letter-spacing: .08em;
}

.vidblysk-theme .story-ending {
  margin-top: 3.5rem !important;
  color: color-mix(in srgb, var(--reader-text) 80%, #b8cfad) !important;
  font-family: var(--serif);
  font-size: 1.15em;
  font-style: italic;
  text-align: center;
}

.vidblysk-theme .vidblysk-story-image {
  position: relative;
}

.vidblysk-theme .vidblysk-story-image img {
  height: auto;
  aspect-ratio: 3 / 2;
  border-radius: .2rem 1.8rem .2rem 1.8rem;
  object-fit: cover;
  filter: saturate(.88) brightness(.9) contrast(1.04);
  box-shadow: 0 2rem 5rem rgba(0, 0, 0, .34);
}

.vidblysk-theme .vidblysk-story-image figcaption {
  color: color-mix(in srgb, var(--reader-muted) 82%, #b8cfad);
  letter-spacing: .09em;
}

.vidblysk-theme .reader-chapter-head,
.vidblysk-theme .reader-chapter > p.dialogue {
  border-color: color-mix(in srgb, #86ad78 42%, transparent);
}

.vidblysk-theme .reader-chapter-kicker,
.vidblysk-theme .story-note,
.vidblysk-theme .scene-break,
.vidblysk-theme .short-line {
  color: #b8cfad;
}

.vidblysk-theme .reader-resume-anchor {
  background-image: linear-gradient(#d5a064, #d5a064);
}

.vidblysk-theme .wishes-experience {
  background:
    radial-gradient(circle at 84% 10%, rgba(213, 160, 100, .12), transparent 22rem),
    linear-gradient(145deg, #07130e, #040906);
}

.vidblysk-theme .wish-field {
  border-color: rgba(134, 173, 120, .18);
}

.vidblysk-theme .wish-field textarea:focus {
  border-color: rgba(213, 160, 100, .7);
  box-shadow: 0 0 0 3px rgba(213, 160, 100, .08);
}

.vidblysk-theme .wishes-download,
.vidblysk-theme .wishes-download:disabled {
  color: rgba(237, 240, 231, .76);
  border-color: rgba(213, 160, 100, .34);
  background: rgba(213, 160, 100, .09);
}

.vidblysk-theme .wishes-download:disabled {
  opacity: .62;
  cursor: not-allowed;
}

.vidblysk-theme .reader-afterglow {
  background:
    radial-gradient(circle at 12% 6%, rgba(123, 163, 118, .15), transparent 25rem),
    radial-gradient(circle at 90% 62%, rgba(208, 126, 70, .1), transparent 24rem),
    #06100c;
}

.vidblysk-theme .afterglow-symbol,
.vidblysk-theme .afterglow-reaction.is-selected strong,
.vidblysk-theme .reaction-total,
.vidblysk-theme .reaction-result-track i {
  color: #d5a064;
}

.vidblysk-theme .reaction-result-track i {
  background: linear-gradient(90deg, #6e996b, #d5a064);
}

.vidblysk-theme .story-prototype-credits {
  width: min(100%, 64rem);
  margin: clamp(5rem, 10vw, 8rem) auto 0;
  padding: clamp(2rem, 5vw, 4rem);
  border: 1px solid rgba(134, 173, 120, .17);
  background:
    radial-gradient(circle at 88% 8%, rgba(213, 160, 100, .1), transparent 19rem),
    linear-gradient(145deg, rgba(7, 19, 14, .96), rgba(3, 9, 6, .98));
  box-shadow: 0 2rem 5rem rgba(0, 0, 0, .22);
}

.vidblysk-theme .prototype-credits-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(15rem, .72fr);
  gap: clamp(1.2rem, 4vw, 3rem);
  align-items: start;
  margin-bottom: clamp(2rem, 5vw, 3.5rem);
}

.vidblysk-theme .prototype-credits-symbol {
  display: grid;
  place-items: center;
  width: 2.6rem;
  aspect-ratio: 1;
  border: 1px solid rgba(213, 160, 100, .38);
  color: #d5a064;
  font-size: .8rem;
  transform: rotate(45deg);
}

.vidblysk-theme .prototype-credits-symbol i {
  font-style: normal;
  transform: rotate(-45deg);
}

.vidblysk-theme .prototype-credits-heading h3 {
  margin: .75rem 0 0;
  color: var(--reader-text);
  font-family: var(--serif);
  font-size: clamp(2rem, 4.4vw, 3.65rem);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.035em;
}

.vidblysk-theme .prototype-credits-heading h3 em {
  color: #d5a064;
  font-weight: 400;
}

.vidblysk-theme .prototype-credits-heading > p {
  margin: 1.75rem 0 0;
  color: color-mix(in srgb, var(--reader-text) 56%, transparent);
  font-family: var(--sans);
  font-size: .78rem;
  line-height: 1.75;
}

.vidblysk-theme .prototype-credits-list {
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(134, 173, 120, .16);
  list-style: none;
}

.vidblysk-theme .prototype-credits-list li {
  border-bottom: 1px solid rgba(134, 173, 120, .13);
}

.vidblysk-theme .prototype-credits-list a {
  display: grid;
  grid-template-columns: 2.4rem minmax(10rem, .7fr) minmax(10rem, 1fr) auto;
  gap: clamp(.8rem, 2vw, 1.5rem);
  align-items: center;
  min-height: 6.2rem;
  color: inherit;
  transition: background .28s ease, padding .28s ease;
}

.vidblysk-theme .prototype-credits-list a:hover,
.vidblysk-theme .prototype-credits-list a:focus-visible {
  padding-inline: .85rem;
  background: rgba(213, 160, 100, .055);
}

.vidblysk-theme .prototype-credit-number {
  color: rgba(184, 207, 173, .42);
  font-family: var(--sans);
  font-size: .6rem;
  letter-spacing: .14em;
}

.vidblysk-theme .prototype-credit-person {
  display: flex;
  flex-direction: column;
  gap: .22rem;
}

.vidblysk-theme .prototype-credit-person small {
  color: #86ad78;
  font-family: var(--sans);
  font-size: .55rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.vidblysk-theme .prototype-credit-person strong {
  color: var(--reader-text);
  font-family: var(--serif);
  font-size: 1.55rem;
  font-weight: 400;
}

.vidblysk-theme .prototype-credit-handle {
  color: color-mix(in srgb, var(--reader-text) 55%, transparent);
  font-family: var(--sans);
  font-size: .7rem;
  letter-spacing: .035em;
  overflow-wrap: anywhere;
}

.vidblysk-theme .prototype-credits-list i {
  display: grid;
  place-items: center;
  width: 2.45rem;
  aspect-ratio: 1;
  border: 1px solid rgba(213, 160, 100, .28);
  color: #d5a064;
  font-style: normal;
  transition: border-color .25s ease, transform .25s ease;
}

.vidblysk-theme .prototype-credits-list a:hover i,
.vidblysk-theme .prototype-credits-list a:focus-visible i {
  border-color: rgba(213, 160, 100, .72);
  transform: translate(.15rem, -.15rem);
}

/* The discount certificate follows the forest palette. The saved PNG uses
   the same colors through STORY_CONFIG. */
.vidblysk-theme .reader-certificate { background: rgba(1, 5, 3, .9); }
.vidblysk-theme .certificate-sheet {
  background:
    radial-gradient(circle at 82% 8%, rgba(126, 169, 121, .15), transparent 20rem),
    radial-gradient(circle at 12% 88%, rgba(213, 160, 100, .08), transparent 22rem),
    #06100c;
}

.vidblysk-theme .certificate-sheet::before { border-color: rgba(142, 182, 123, .66); }
.vidblysk-theme .certificate-heading em,
.vidblysk-theme .certificate-ornament,
.vidblysk-theme .certificate-discount,
.vidblysk-theme .certificate-code-block strong { color: #d5a064; }
.vidblysk-theme .certificate-ornament i,
.vidblysk-theme .certificate-code-block { border-color: rgba(142, 182, 123, .48); }

.vidblysk-theme .lightbox {
  border-color: rgba(134, 173, 120, .22);
  background: #06100c;
}

.vidblysk-theme .toast {
  border-color: rgba(134, 173, 120, .55);
  background: #0b1710;
}

@media (max-width: 850px) {
  .vidblysk-theme .site-header nav { background: #030907; }
  .vidblysk-theme .hero { min-height: 52rem; }
  .vidblysk-theme .hero-art {
    inset: 0 -12% 17% 8%;
    border-radius: 0 0 42% 48% / 0 0 28% 22%;
    opacity: .82;
  }
  .vidblysk-theme .hero-art::after {
    background:
      linear-gradient(90deg, rgba(3, 9, 7, .7), transparent 68%),
      linear-gradient(0deg, #030907 0%, rgba(3, 9, 7, .82) 19%, transparent 69%);
  }
  .vidblysk-theme .hero h1 { font-size: clamp(4rem, 18.5vw, 7.5rem); }
  .vidblysk-theme .hero-copy { padding-bottom: 1rem; }
  .vidblysk-theme .fern-shadow--one { left: -12%; bottom: -24%; }
  .vidblysk-theme .read-preview-art { border-radius: 2rem .2rem 2rem .2rem; }
  .vidblysk-theme .reader-cover-art,
  .vidblysk-theme .static-reader-cover-art {
    inset: 3% -2.5rem 12% 12%;
    border-radius: 35% 0 0 28% / 18% 0 0 37%;
  }
  .vidblysk-theme .prototype-credits-heading {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .vidblysk-theme .prototype-credits-heading > p {
    grid-column: 2;
    max-width: 30rem;
    margin-top: 0;
  }
}

@media (max-width: 520px) {
  .vidblysk-theme .hero { min-height: 49rem; }
  .vidblysk-theme .hero h1 { line-height: .82; }
  .vidblysk-theme .hero-lead { margin-left: 0; }
  .story-release-strip { margin-left: 0; }
  .vidblysk-theme .hero-actions { margin-left: 0; }
  .vidblysk-theme .gallery-card { border-radius: 1.2rem .15rem 1.2rem .15rem; }
  .vidblysk-theme .quote-card { border-radius: .15rem 1.4rem .15rem 1.4rem; }
  .vidblysk-theme .reader-chat {
    width: calc(100% + 1rem);
    margin-left: -.5rem;
    border-radius: 1.45rem;
  }
  .vidblysk-theme .reader-chat__body { padding-inline: .72rem; }
  .vidblysk-theme .reader-chat__message { max-width: 89%; }
  .vidblysk-theme .vidblysk-story-image img { border-radius: .15rem 1rem .15rem 1rem; }
  .vidblysk-theme .story-prototype-credits {
    width: calc(100% + 1rem);
    margin-left: -.5rem;
    padding: 1.5rem;
  }
  .vidblysk-theme .prototype-credits-heading {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .vidblysk-theme .prototype-credits-heading > p { grid-column: auto; }
  .vidblysk-theme .prototype-credits-list a {
    grid-template-columns: 1.8rem minmax(0, 1fr) auto;
    min-height: 6.6rem;
  }
  .vidblysk-theme .prototype-credit-handle {
    grid-column: 2;
    margin-top: -.6rem;
  }
  .vidblysk-theme .prototype-credits-list i {
    grid-column: 3;
    grid-row: 1 / span 2;
  }
}

@media (prefers-reduced-motion: reduce) {
  .vidblysk-theme .forest-mist,
  .vidblysk-theme .ember { animation: none; }
}
