/* Diffractive Flora editorial art direction */
.workShell[data-work="diffractive-flora"]{
  --flora-black: #050505;
  --flora-ink: #0b0c09;
  --flora-paper: #f6f1df;
  --flora-mist: rgba(246, 241, 223, 0.72);
  --flora-muted: rgba(246, 241, 223, 0.64);
  --flora-line: rgba(246, 241, 223, 0.12);
  --flora-line-strong: rgba(246, 241, 223, 0.22);
  --flora-green: #143f26;
  --flora-green-bright: #20ff95;
  --flora-orange: #ff7a1a;
  --flora-pink: #ff4f9a;
  --flora-blue: #66c7ff;
  --flora-panel: rgba(246, 241, 223, 0.055);
  --flora-panel-strong: rgba(246, 241, 223, 0.105);
  --flora-width: min(1440px, 94vw);
  --flora-reading: min(1080px, 88vw);
  --shell-pad: 0px;
  --content-max: 100%;
  --content-narrow: 100%;
  position: relative;
  width: 100%;
  max-width: none;
  color: var(--flora-paper);
  background:
    linear-gradient(180deg, #030303 0%, #070806 44%, #020302 100%),
    repeating-linear-gradient(90deg, rgba(246, 241, 223, 0.045) 0 1px, transparent 1px clamp(78px, 8vw, 118px));
  overflow: clip;
}


.workShell[data-work="diffractive-flora"]::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(246, 241, 223, 0.06), transparent 12%, transparent 88%, rgba(246, 241, 223, 0.04)),
    repeating-linear-gradient(180deg, rgba(246, 241, 223, 0.026) 0 1px, transparent 1px clamp(88px, 9vw, 132px));
  opacity: 0.8;
}

.workShell[data-work="diffractive-flora"] .workArticle{
  gap: clamp(38px, 5.4vw, 86px);
  padding-bottom: clamp(72px, 10vw, 140px);
}

.workShell[data-work="diffractive-flora"] .workTopbar{
  position: absolute;
  inset: 0 0 auto 0;
  width: 100%;
  height: 0;
  margin: 0;
  padding: 0;
  z-index: 24;
  background: none;
  transform: none;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workTopMeta{
  display: none;
}

.workShell[data-work="diffractive-flora"] .workTopActions,
.workShell[data-work="diffractive-flora"] .workTopNav{
  position: fixed;
  top: 18px;
  z-index: 26;
  display: flex;
  align-items: center;
  gap: 14px;
  pointer-events: auto;
}

.workShell[data-work="diffractive-flora"] .workTopActions{
  left: clamp(18px, 2.6vw, 34px);
}

.workShell[data-work="diffractive-flora"] .workTopNav{
  right: clamp(18px, 2.6vw, 34px);
}

.workShell[data-work="diffractive-flora"] .workPager button,
.workShell[data-work="diffractive-flora"] .workTopNav button,
.workShell[data-work="diffractive-flora"] .close,
.workShell[data-work="diffractive-flora"] .workBack{
  color: var(--flora-paper);
  font-family: "Montserrat", "Didact Gothic", var(--sans);
}

.workShell[data-work="diffractive-flora"] .workTopActions .close,
.workShell[data-work="diffractive-flora"] .workTopNav button{
  padding: 11px 14px;
  border: 1px solid rgba(246, 241, 223, 0.18);
  border-radius: 999px;
  background: rgba(3, 3, 3, 0.62);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.34);
  transition:
    background 220ms var(--ease),
    border-color 220ms var(--ease),
    color 220ms var(--ease),
    transform 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workTopActions .close:hover,
.workShell[data-work="diffractive-flora"] .workTopNav button:hover{
  background: rgba(3, 3, 3, 0.86);
  border-color: rgba(32, 255, 149, 0.48);
  color: var(--flora-green-bright);
  transform: translateY(-1px);
}

.workShell[data-work="diffractive-flora"] .workScrollIndicator{
  background: rgba(246, 241, 223, 0.12);
}

.workShell[data-work="diffractive-flora"] .workScrollIndicator span{
  background: linear-gradient(180deg, var(--flora-green-bright) 0%, var(--flora-pink) 54%, var(--flora-orange) 100%);
}

.workShell[data-work="diffractive-flora"] .workHero{
  order: 1;
  width: 100vw;
  margin: 0 0 0 calc(50% - 50vw);
  min-height: clamp(660px, 100svh, 1040px);
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(246, 241, 223, 0.92) 0%, rgba(246, 241, 223, 0.26) 12%, rgba(5, 5, 5, 0) 34%),
    #050505;
}

.workShell[data-work="diffractive-flora"] .workHero::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(104deg, rgba(5, 5, 5, 0.84) 0%, rgba(5, 5, 5, 0.18) 42%, rgba(5, 5, 5, 0.72) 100%),
    linear-gradient(180deg, rgba(246, 241, 223, 0.22) 0%, rgba(5, 5, 5, 0.12) 20%, rgba(5, 5, 5, 0.82) 100%);
  box-shadow: inset 0 120px 90px rgba(246, 241, 223, 0.16);
}

.workShell[data-work="diffractive-flora"] .workHero::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: clamp(130px, 18vh, 230px);
  z-index: 2;
  background: linear-gradient(180deg, rgba(5, 5, 5, 0) 0%, rgba(5, 5, 5, 0.72) 58%, #050505 100%);
}

.workShell[data-work="diffractive-flora"] .workHero img{
  width: 100%;
  min-height: inherit;
  height: clamp(700px, 100svh, 1040px);
  object-fit: cover;
  object-position: center 38%;
  filter: saturate(1.18) contrast(1.08) brightness(0.82);
  transform: scale(1.04);
}

.workShell[data-work="diffractive-flora"] .workHero figcaption{
  display: none;
}

.workShell[data-work="diffractive-flora"] .workHeroGhost{
  position: absolute;
  right: clamp(20px, 4vw, 70px);
  top: clamp(92px, 11vw, 150px);
  z-index: 2;
  font: 700 clamp(68px, 16vw, 230px)/0.78 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(246, 241, 223, 0.06);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workHeroOverlay{
  inset: 0;
  z-index: 4;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 0.2fr);
  align-content: end;
  align-items: end;
  gap: clamp(22px, 3vw, 44px);
  padding: clamp(116px, 13vw, 160px) clamp(26px, 5vw, 78px) clamp(70px, 8vw, 112px);
  color: var(--flora-paper);
  box-sizing: border-box;
}

.workShell[data-work="diffractive-flora"] .workHeroOverlay .heroCopy{
  display: grid;
  gap: clamp(12px, 1.7vw, 20px);
  max-width: min(1380px, 92vw);
}

.workShell[data-work="diffractive-flora"] .workHeroOverlay .heroKicker{
  max-width: 31ch;
  font: 600 clamp(12px, 1.1vw, 16px)/1.28 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--flora-green-bright);
}

.workShell[data-work="diffractive-flora"] .workHeroOverlay .heroTitle{
  margin: 0;
  max-width: min(100%, 19.6ch);
  font: 700 clamp(50px, 6.9vw, 116px)/0.86 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.02em;
  text-transform: none;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  text-shadow:
    3px 0 0 rgba(255, 79, 154, 0.28),
    -3px 0 0 rgba(32, 255, 149, 0.18),
    0 16px 42px rgba(0, 0, 0, 0.58);
}

.workShell[data-work="diffractive-flora"] .workHeroOverlay .heroMeta{
  max-width: 38ch;
  padding-top: 14px;
  border-top: 1px solid rgba(246, 241, 223, 0.18);
  font: 500 clamp(13px, 1.18vw, 17px)/1.46 "Didact Gothic", "Montserrat", var(--sans);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(246, 241, 223, 0.86);
}

.workShell[data-work="diffractive-flora"] .workHeroOverlay .heroAside{
  justify-self: end;
  align-self: end;
  display: grid;
  gap: 8px;
  max-width: 18ch;
  margin-bottom: 12px;
  padding-left: 16px;
  border-left: 1px solid rgba(255, 122, 26, 0.54);
  font: 500 clamp(12px, 1.05vw, 14px)/1.42 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 122, 26, 0.96);
}

.workShell[data-work="diffractive-flora"] .workHeroRail{
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(16px, 2.5vw, 30px);
  z-index: 5;
  overflow: hidden;
  color: rgba(246, 241, 223, 0.52);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workHeroRailLoop{
  display: flex;
  width: max-content;
  gap: clamp(24px, 4vw, 64px);
  animation: floraRail 32s linear infinite;
}

.workShell[data-work="diffractive-flora"] .workHeroRailLoop span{
  font: 600 clamp(10px, 1.1vw, 14px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.28em;
  text-transform: uppercase;
  white-space: nowrap;
}

@keyframes floraRail{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

.workShell[data-work="diffractive-flora"] .workHeader{
  order: 2;
  position: relative;
  z-index: 4;
  width: var(--flora-width);
  max-width: none;
  margin: clamp(-62px, -7vh, -86px) auto 0;
  display: grid;
  grid-template-columns: minmax(180px, 0.22fr) minmax(0, 0.78fr);
  gap: clamp(18px, 3vw, 54px);
}

.workShell[data-work="diffractive-flora"] #workTitle,
.workShell[data-work="diffractive-flora"] .workSub{
  display: none;
}

.workShell[data-work="diffractive-flora"] .workStatement{
  margin: clamp(18px, 3vw, 34px) 0 0;
  max-width: 28ch;
  padding-left: 16px;
  position: relative;
  font: 600 11px/1.48 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(246, 241, 223, 0.66);
}

.workShell[data-work="diffractive-flora"] .workStatement::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.2em;
  bottom: 0.2em;
  width: 2px;
  background: linear-gradient(180deg, var(--flora-pink), var(--flora-green-bright));
}

.workShell[data-work="diffractive-flora"] .workLead{
  margin: 0;
  max-width: min(920px, 100%);
  white-space: normal;
  font: 400 clamp(34px, 4.6vw, 76px)/1.03 "Libre Baskerville", "EB Garamond", var(--serif);
  letter-spacing: 0;
  color: var(--flora-paper);
  text-wrap: balance;
}

.workShell[data-work="diffractive-flora"] .workLead .lead-line{
  display: block;
}

.workShell[data-work="diffractive-flora"] .workLead .lead-line.is-offset{
  margin-left: clamp(22px, 6vw, 110px);
}

.workShell[data-work="diffractive-flora"] .workLead .lead-line.is-tail{
  margin-left: clamp(4px, 2.6vw, 42px);
}

.workShell[data-work="diffractive-flora"] .workLead strong{
  color: var(--flora-orange);
  font-weight: 400;
}

.workShell[data-work="diffractive-flora"] .workGallery{
  order: 3;
  position: relative;
  z-index: 3;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(20px, 3.4vw, 56px);
  margin-top: 0;
  padding-top: clamp(12px, 2vw, 26px);
}

.workShell[data-work="diffractive-flora"] .workGallery::before{
  background: linear-gradient(180deg, rgba(5, 5, 5, 0) 0%, #050505 100%);
}

.workShell[data-work="diffractive-flora"] :is(
  .workItem img,
  .workThumb img,
  .workTriptych__media img,
  .workStrip__item img,
  .workItem.workVideo video
){
  border-radius: 0;
  border: 1px solid rgba(246, 241, 223, 0.12);
  box-shadow: 0 24px 72px rgba(0, 0, 0, 0.42);
  background: #000;
}

.workShell[data-work="diffractive-flora"] .workItem figcaption,
.workShell[data-work="diffractive-flora"] .workThumb figcaption,
.workShell[data-work="diffractive-flora"] .workStrip__item figcaption{
  color: rgba(246, 241, 223, 0.6);
}

.workShell[data-work="diffractive-flora"] .workTextCard,
.workShell[data-work="diffractive-flora"] .workTextPair .pairText,
.workShell[data-work="diffractive-flora"] .workGalleryBlock .blockHeader,
.workShell[data-work="diffractive-flora"] .workConstellationBlock .blockHeader,
.workShell[data-work="diffractive-flora"] .workCompareBlock .blockHeader{
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .workTextCard .textLabel,
.workShell[data-work="diffractive-flora"] .workGalleryBlock .blockMeta,
.workShell[data-work="diffractive-flora"] .workConstellationBlock .blockMeta,
.workShell[data-work="diffractive-flora"] .workCompareBlock .blockMeta{
  color: var(--flora-green-bright);
  opacity: 0.86;
}

.workShell[data-work="diffractive-flora"] .workTextCard .textTitle,
.workShell[data-work="diffractive-flora"] .workGalleryBlock .blockTitle,
.workShell[data-work="diffractive-flora"] .workConstellationBlock .blockTitle,
.workShell[data-work="diffractive-flora"] .workCompareBlock .blockTitle{
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .workTextCard.voice-first .textBody{
  color: rgba(246, 241, 223, 0.88);
}

.workShell[data-work="diffractive-flora"] .workTextCard.voice-third .textBody,
.workShell[data-work="diffractive-flora"] .workTextCard.is-compact .textBody{
  color: var(--flora-muted);
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-statement-landing{
  grid-column: 1 / -1;
  position: relative;
  width: var(--flora-width);
  max-width: var(--flora-width);
  min-height: clamp(820px, 96vh, 1180px);
  margin: 0 auto 0 max(calc((100vw - var(--flora-width)) / 2 - clamp(18px, 3vw, 54px)), 0px);
  padding: clamp(30px, 5vw, 84px);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: minmax(0, 1fr) minmax(34px, 0.1fr) auto;
  gap: clamp(14px, 1.7vw, 26px);
  align-items: center;
  border-top: 0;
  border-bottom: 0;
  background:
    radial-gradient(circle at 84% 18%, rgba(102, 199, 255, 0.10) 0 1px, transparent 1px 10px),
    linear-gradient(90deg, rgba(20, 63, 38, 0.72) 0, rgba(20, 63, 38, 0.26) 16%, transparent 16%),
    linear-gradient(180deg, rgba(246, 241, 223, 0.035), rgba(5, 5, 5, 0.02));
  box-shadow: 0 42px 90px rgba(0, 0, 0, 0.28);
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-statement-landing::before{
  content: "HERBARIUM";
  position: absolute;
  right: -0.18em;
  bottom: -0.16em;
  z-index: 0;
  font: 700 clamp(120px, 18vw, 290px)/0.78 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.02em;
  color: rgba(246, 241, 223, 0.045);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-statement-landing::after{
  content: "";
  position: absolute;
  inset: clamp(18px, 3vw, 44px);
  z-index: 0;
  border: 1px solid rgba(246, 241, 223, 0.035);
  background:
    linear-gradient(90deg, rgba(246, 241, 223, 0.05) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.036) 0 1px, transparent 1px) 0 0 / 100% 16.666%;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-statement-landing > *{
  position: relative;
  z-index: 1;
}

.workShell[data-work="diffractive-flora"] .flora-statement-copy{
  grid-column: 2 / span 5;
  grid-row: 1 / span 2;
  z-index: 3;
  align-self: center;
  max-width: none;
  background: transparent;
}

.workShell[data-work="diffractive-flora"] .flora-statement-copy .textLabel{
  width: max-content;
  padding-left: 14px;
  border-left: 2px solid var(--flora-green-bright);
  font: 700 10px/1.35 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--flora-green-bright);
}

.workShell[data-work="diffractive-flora"] .flora-statement-copy .textTitle{
  max-width: 17ch;
  margin: 0;
  font: 400 clamp(42px, 5.25vw, 100px)/0.88 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.02em;
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-statement-copy .textBody{
  max-width: 58ch;
  margin: 0;
  text-transform: none;
  letter-spacing: 0.01em;
  color: rgba(246, 241, 223, 0.82);
}

.workShell[data-work="diffractive-flora"] .flora-statement-copy .textBody:first-of-type{
  max-width: 39ch;
  font: 400 clamp(18px, 1.8vw, 28px)/1.28 "Libre Baskerville", "EB Garamond", var(--serif);
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-statement-specimen{
  grid-column: 1 / span 3;
  grid-row: 1 / span 2;
  align-self: end;
  width: min(420px, 100%);
  justify-self: start;
  opacity: 0.74;
  mix-blend-mode: screen;
  transform: translate(-7%, 10%);
}

.workShell[data-work="diffractive-flora"] .flora-statement-specimen img{
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border: 1px solid rgba(246, 241, 223, 0.14);
  filter: grayscale(1) contrast(1.24) brightness(0.9);
}

.workShell[data-work="diffractive-flora"] .flora-statement-vortex{
  grid-column: 7 / -1;
  grid-row: 1;
  z-index: 1;
  align-self: start;
  width: min(760px, 100%);
  justify-self: end;
  border: 0;
  background: #000;
  box-shadow: -28px 30px 0 rgba(255, 79, 154, 0.08), 0 24px 44px rgba(0, 0, 0, 0.42);
}

.workShell[data-work="diffractive-flora"] .flora-statement-vortex video{
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  filter: saturate(0.82) contrast(1.18);
}

.workShell[data-work="diffractive-flora"] .flora-statement-index{
  grid-column: 3 / -1;
  grid-row: 3;
  z-index: 4;
  align-self: end;
  justify-self: stretch;
  max-width: none;
  padding: clamp(12px, 1.4vw, 18px) clamp(14px, 1.8vw, 24px);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: clamp(12px, 1.8vw, 28px);
  align-items: center;
  border: 0;
  background:
    linear-gradient(90deg, rgba(102, 199, 255, 0.12), transparent 64%),
    rgba(5, 5, 5, 0.72);
  transform: translateY(clamp(24px, 3vw, 46px));
}

.workShell[data-work="diffractive-flora"] .flora-statement-index .textLabel{
  color: var(--flora-blue);
}

.workShell[data-work="diffractive-flora"] .flora-statement-index .textTitle{
  font: 700 clamp(11px, 1vw, 14px)/1.42 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-statement-index .textBody{
  display: inline-block;
  margin: 0;
  font: 700 10px/1.4 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(246, 241, 223, 0.62);
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-apparatus-section{
  grid-column: 1 / -1;
  width: var(--flora-width);
  max-width: var(--flora-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: clamp(12px, 1.6vw, 24px);
  align-items: end;
  min-height: clamp(520px, 72vh, 820px);
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-tall{
  grid-column: 1 / span 4;
  grid-row: 1 / span 2;
  align-self: stretch;
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-tall img{
  height: 100%;
  min-height: clamp(520px, 68vh, 760px);
  object-fit: cover;
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-copy{
  grid-column: 4 / span 4;
  grid-row: 1;
  z-index: 2;
  align-self: start;
  max-width: none;
  padding: clamp(18px, 2.6vw, 34px);
  background: rgba(5, 5, 5, 0.82);
  border: 1px solid rgba(255, 122, 26, 0.34);
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-copy .textLabel{
  color: var(--flora-orange);
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-copy .textTitle{
  max-width: 8ch;
  font: 400 clamp(34px, 4.3vw, 72px)/0.9 "Cinzel Decorative", "Bodoni Moda", var(--display);
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-copy .textBody{
  font: 400 clamp(17px, 1.5vw, 23px)/1.64 "EB Garamond", var(--serif);
  color: rgba(246, 241, 223, 0.84);
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-wide{
  grid-column: 7 / -1;
  grid-row: 1 / span 2;
  align-self: center;
}

.workShell[data-work="diffractive-flora"] .flora-apparatus-wide img{
  aspect-ratio: 16 / 10;
  height: auto;
  object-fit: cover;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-motion-register{
  grid-column: 1 / -1;
  position: relative;
  width: var(--flora-width);
  max-width: var(--flora-width);
  min-height: clamp(680px, 84vh, 980px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: minmax(0, 1fr);
  gap: clamp(12px, 1.7vw, 24px);
  align-items: center;
  padding: clamp(28px, 4.2vw, 70px);
  border: 0;
  background:
    radial-gradient(circle at 18% 16%, rgba(246, 241, 223, 0.16) 0 1px, transparent 1px 9px),
    linear-gradient(90deg, rgba(102, 199, 255, 0.10) 0 1px, transparent 1px) 0 0 / 12.5% 100%,
    linear-gradient(180deg, rgba(102, 199, 255, 0.07) 0 1px, transparent 1px) 0 0 / 100% 18%,
    linear-gradient(135deg, rgba(5, 5, 5, 0.5), rgba(116, 0, 19, 0.58));
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-motion-register::before{
  content: "MOTION";
  position: absolute;
  left: clamp(18px, 4vw, 58px);
  bottom: -0.14em;
  z-index: 0;
  font: 700 clamp(92px, 18vw, 260px)/0.78 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  color: rgba(102, 199, 255, 0.13);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-motion-register::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(circle at 74% 24%, rgba(246, 241, 223, 0.26) 0 1px, transparent 1px 9px),
    linear-gradient(90deg, transparent 0 58%, rgba(102, 199, 255, 0.08) 58% 59%, transparent 59%),
    linear-gradient(180deg, transparent 0 47%, rgba(102, 199, 255, 0.08) 47% 48%, transparent 48%);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-motion-register > *{
  position: relative;
  z-index: 1;
}

.workShell[data-work="diffractive-flora"] .flora-register-video{
  grid-column: 1 / span 6;
  grid-row: 1;
  align-self: stretch;
  width: 100%;
  justify-self: stretch;
  border: 0;
  background: #000;
  box-shadow: 22px 26px 0 rgba(246, 241, 223, 0.07);
}

.workShell[data-work="diffractive-flora"] .flora-register-video video{
  display: block;
  width: 100%;
  height: 100%;
  min-height: clamp(560px, 70vh, 820px);
  aspect-ratio: 4 / 5;
  object-fit: contain;
  filter: saturate(1.12) contrast(1.08);
}

.workShell[data-work="diffractive-flora"] .flora-register-negative{
  grid-column: 5 / span 4;
  grid-row: 1;
  align-self: start;
  justify-self: end;
  width: min(360px, 100%);
  transform: translate(clamp(14px, 2vw, 30px), clamp(24px, 5vh, 64px)) rotate(-2deg);
  mix-blend-mode: screen;
  opacity: 0.74;
}

.workShell[data-work="diffractive-flora"] .flora-register-negative img{
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border: 1px solid rgba(246, 241, 223, 0.14);
  filter: grayscale(1) contrast(1.34) brightness(0.88);
}

.workShell[data-work="diffractive-flora"] .flora-register-copy{
  grid-column: 7 / -1;
  grid-row: 1;
  z-index: 2;
  align-self: center;
  max-width: none;
  padding: clamp(18px, 2.4vw, 34px);
  border: 0;
  background: rgba(5, 5, 5, 0.68);
  box-shadow: -18px 0 0 rgba(102, 199, 255, 0.08);
}

.workShell[data-work="diffractive-flora"] .flora-register-copy .textLabel{
  color: var(--flora-blue);
}

.workShell[data-work="diffractive-flora"] .flora-register-copy .textTitle{
  max-width: 12ch;
  font: 400 clamp(28px, 3vw, 48px)/0.98 "Cinzel Decorative", "Bodoni Moda", var(--display);
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

.workShell[data-work="diffractive-flora"] .flora-register-copy .textBody{
  font: 400 clamp(15px, 1.22vw, 19px)/1.66 "EB Garamond", var(--serif);
  color: rgba(246, 241, 223, 0.76);
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section{
  grid-column: 1 / -1;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: clamp(620px, 82vh, 900px);
  display: grid;
  grid-template-columns: minmax(24px, 1fr) minmax(0, 0.52fr) minmax(0, 0.62fr) minmax(24px, 1fr);
  grid-template-rows: minmax(48px, 0.12fr) auto minmax(300px, auto) minmax(56px, 0.16fr);
  gap: clamp(14px, 2vw, 30px);
  align-items: center;
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] .flora-gesture-main{
  grid-column: 3 / 5;
  grid-row: 1 / -1;
  position: relative;
  height: 100%;
}

.workShell[data-work="diffractive-flora"] .flora-gesture-main::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.82) 0 22%, rgba(5, 5, 5, 0.42) 43%, transparent 68%),
    linear-gradient(180deg, rgba(5, 5, 5, 0.18), transparent 28%, rgba(5, 5, 5, 0.18));
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-gesture-main img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  filter: saturate(1.08) contrast(1.06) brightness(0.78);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-copy{
  grid-column: 2 / span 1;
  grid-row: 2;
  z-index: 4;
  max-width: none;
  padding: clamp(20px, 3vw, 44px);
  background: rgba(5, 5, 5, 0.93);
  border: 1px solid rgba(255, 79, 154, 0.34);
  box-shadow: 20px 20px 56px rgba(0, 0, 0, 0.42);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-copy .textLabel{
  color: var(--flora-pink);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-copy .textBody:first-of-type{
  font: 400 clamp(24px, 3.2vw, 48px)/1.12 "Libre Baskerville", "EB Garamond", var(--serif);
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-copy .textBody{
  font: 400 clamp(16px, 1.35vw, 21px)/1.68 "EB Garamond", var(--serif);
  color: rgba(246, 241, 223, 0.76);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-inset{
  grid-column: 2 / span 1;
  grid-row: 3;
  z-index: 3;
  justify-self: start;
  align-self: end;
  width: min(430px, 90%);
  margin-top: clamp(22px, 3vw, 42px);
  padding: 10px;
  background:
    linear-gradient(90deg, rgba(102, 199, 255, 0.16) 0 1px, transparent 1px) 0 0 / 12px 100%,
    radial-gradient(circle at 20% 22%, rgba(102, 199, 255, 0.18) 0 1px, transparent 1px 7px),
    rgba(4, 18, 24, 0.78);
  transform: none;
  box-shadow: 18px 20px 0 rgba(102, 199, 255, 0.10);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-inset::before{
  content: "SCAN DETAIL 02";
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 2;
  padding: 4px 10px;
  font: 800 10px/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.22em;
  color: #050505;
  background: var(--flora-blue);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-gesture-inset img{
  aspect-ratio: auto;
  height: auto;
  object-fit: contain;
  max-height: none;
  filter: saturate(1.22) contrast(1.22) brightness(1.05);
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate{
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate img{
  width: 100%;
  max-height: clamp(520px, 76vh, 860px);
  object-fit: cover;
  filter: saturate(1.18) contrast(1.08) brightness(0.76);
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate .imageOverlay{
  justify-content: flex-end;
  padding: clamp(34px, 6vw, 86px);
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.82) 0%, rgba(5, 5, 5, 0.36) 48%, rgba(5, 5, 5, 0.18) 100%),
    linear-gradient(180deg, rgba(5, 5, 5, 0.05) 0%, rgba(5, 5, 5, 0.78) 100%);
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate .overlayText{
  max-width: 11ch;
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate .overlaySub{
  color: var(--flora-orange);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .flora-temporal-spread{
  width: var(--flora-reading);
  max-width: var(--flora-reading);
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
  padding: clamp(22px, 4vw, 54px) 0;
  border-top: 1px solid var(--flora-line);
  border-bottom: 1px solid var(--flora-line);
}

.workShell[data-work="diffractive-flora"] .flora-temporal-spread .pairText:first-child{
  font: 400 clamp(24px, 3vw, 46px)/1.18 "Libre Baskerville", "EB Garamond", var(--serif);
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-temporal-spread .pairText{
  color: rgba(246, 241, 223, 0.76);
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-emergence-section{
  grid-column: 1 / -1;
  width: var(--flora-width);
  max-width: var(--flora-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(250px, 0.62fr) minmax(560px, 1.38fr);
  grid-template-rows: auto auto;
  gap: clamp(28px, 4vw, 62px);
  align-items: stretch;
  padding-top: clamp(18px, 3vw, 42px);
}

.workShell[data-work="diffractive-flora"] .flora-emergence-copy{
  grid-column: 1;
  grid-row: 1;
  transform: translateX(clamp(-92px, -5vw, -38px));
}

.workShell[data-work="diffractive-flora"] .flora-language-copy{
  grid-column: 1;
  grid-row: 2;
  transform: translateX(clamp(-92px, -5vw, -38px));
}

.workShell[data-work="diffractive-flora"] .flora-emergence-copy,
.workShell[data-work="diffractive-flora"] .flora-language-copy{
  max-width: none;
  padding-top: clamp(16px, 2vw, 26px);
  border-top: 1px solid var(--flora-line-strong);
}

.workShell[data-work="diffractive-flora"] .flora-emergence-copy .textLabel{
  color: var(--flora-green-bright);
}

.workShell[data-work="diffractive-flora"] .flora-language-copy .textLabel{
  color: var(--flora-orange);
}

.workShell[data-work="diffractive-flora"] .flora-emergence-copy .textBody:first-of-type{
  font: 400 clamp(21px, 2.15vw, 34px)/1.26 "Libre Baskerville", "EB Garamond", var(--serif);
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-emergence-copy .textBody,
.workShell[data-work="diffractive-flora"] .flora-language-copy .textBody{
  font: 400 clamp(15px, 1.15vw, 18px)/1.72 "EB Garamond", var(--serif);
  color: rgba(246, 241, 223, 0.76);
}

.workShell[data-work="diffractive-flora"] .flora-emergence-field{
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: stretch;
  height: 100%;
}

.workShell[data-work="diffractive-flora"] .flora-emergence-field img{
  height: 100%;
  min-height: 100%;
  object-fit: cover;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-process-index{
  grid-column: 1 / -1;
  position: relative;
  width: 100vw;
  max-width: none;
  margin: 0 calc(50% - 50vw);
  min-height: clamp(1560px, 198vh, 2380px);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
  padding: clamp(0px, 0.8vw, 18px) clamp(24px, 5.2vw, 86px) clamp(118px, 9vw, 172px);
  color: #ed241f;
  background:
    radial-gradient(ellipse at 64% 28%, rgba(224, 16, 27, 0.065), transparent 34%),
    radial-gradient(ellipse at 22% 86%, rgba(116, 8, 58, 0.07), transparent 46%),
    linear-gradient(104deg, rgba(64, 5, 34, 0.08) 0 10%, transparent 10% 49%, rgba(185, 16, 28, 0.034) 49% 58%, transparent 58%),
    repeating-linear-gradient(0deg, rgba(255, 206, 206, 0.014) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(255, 42, 54, 0.012) 0 1px, transparent 1px 92px),
    radial-gradient(circle at 18% 20%, rgba(237, 36, 31, 0.095) 0 1px, transparent 1px 18px),
    radial-gradient(circle at 84% 8%, rgba(237, 36, 31, 0.052) 0 1px, transparent 1px 22px),
    linear-gradient(142deg, #000 0%, #030103 58%, #000 100%);
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-process-index::before{
  content: "BECOMING";
  position: absolute;
  left: -0.15em;
  top: clamp(-220px, -11vw, -108px);
  z-index: 1;
  max-width: none;
  font: 900 clamp(410px, 47vw, 900px)/0.58 "Bodoni 72", "Bodoni Moda", "Libre Baskerville", var(--display);
  letter-spacing: 0;
  color: rgba(132, 8, 26, 0.17);
  opacity: 0.78;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-process-index::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 1500'%3E%3Cg fill='none' stroke='%23f51d28' stroke-linecap='round'%3E%3Cpath d='M-360 760 C-142 570 102 598 326 696 C612 822 710 558 944 518 C1188 476 1260 684 1720 490' stroke-width='28' opacity='.21'/%3E%3Cpath d='M-340 570 C-52 432 174 638 466 492 C792 328 1018 448 1688 528' stroke-width='14' opacity='.42'/%3E%3Cpath d='M-318 1010 C-34 1118 244 888 548 940 C812 984 922 752 1178 806 C1386 850 1470 1006 1688 944' stroke-width='13' opacity='.35'/%3E%3Cpath d='M-214 372 C126 246 368 184 640 258 C890 326 934 508 1172 512 C1360 516 1446 396 1654 438' stroke-width='8.5' opacity='.32'/%3E%3Cpath d='M-228 1260 C96 1308 372 1138 670 1198 C940 1252 1128 1282 1628 1178' stroke-width='10' opacity='.28'/%3E%3Cpath d='M-104 208 C142 122 394 150 654 192 C886 230 1008 128 1240 156 C1384 174 1476 226 1628 172' stroke-width='4.8' opacity='.34'/%3E%3Cpath d='M-306 884 C46 756 212 842 474 790 C764 732 842 918 1116 874 C1316 842 1480 748 1688 792' stroke-width='8.4' opacity='.4'/%3E%3Cpath d='M-190 660 C46 700 244 554 446 610 C672 672 752 546 968 620 C1186 696 1374 628 1642 600' stroke-width='5.8' opacity='.34'/%3E%3Cpath d='M828 154 C1010 222 1046 378 926 470 C804 564 728 426 842 326 C990 198 1300 288 1538 230' stroke-width='7.2' opacity='.42'/%3E%3Cpath d='M938 968 C1122 842 1340 904 1280 1034 C1218 1174 1002 1088 1106 940 C1194 814 1474 784 1682 850' stroke-width='6.6' opacity='.39'/%3E%3Cpath d='M-252 1150 C58 1050 260 1164 496 1110 C762 1050 882 1190 1148 1148 C1352 1116 1486 1018 1660 1062' stroke-width='5.4' opacity='.36'/%3E%3Cpath d='M-172 474 C82 508 258 378 484 434 C718 492 828 378 1038 430 C1226 476 1392 438 1608 400' stroke-width='4.8' opacity='.33'/%3E%3Cpath d='M-240 1342 C74 1216 312 1338 584 1260 C838 1188 990 1370 1248 1302 C1432 1254 1518 1192 1662 1226' stroke-width='4.8' opacity='.28'/%3E%3Cpath d='M-250 728 C12 826 244 686 470 760 C710 838 768 664 1016 732 C1218 788 1446 692 1664 724' stroke-width='4.2' opacity='.31'/%3E%3C/g%3E%3Cg fill='%23f51d28' opacity='.44'%3E%3Ccircle cx='664' cy='114' r='5'/%3E%3Ccircle cx='698' cy='114' r='5'/%3E%3Ccircle cx='732' cy='114' r='5'/%3E%3C/g%3E%3Cg stroke='%23f51d28' stroke-width='1.4' opacity='.42'%3E%3Cpath d='M58 108h166M292 108h94M1008 108h164M1046 1032h170M1224 1032h108M120 1110h138M298 1110h88M58 1188h128M1072 1190h172M82 272h126M265 272h92M1034 268h148M460 1360h240M748 1360h86M986 1346h180M1196 1346h94M78 1430h220M356 1430h120M1020 1422h182'/%3E%3C/g%3E%3C/svg%3E") center / 146% 136% no-repeat,
    repeating-linear-gradient(0deg, transparent 0 26px, rgba(255, 38, 50, 0.018) 26px 27px, transparent 27px 62px);
  opacity: 0.92;
  mix-blend-mode: screen;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index > *{
  position: relative;
  z-index: 2;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-image{
  position: absolute;
  inset: clamp(-260px, -12vw, -126px) -22vw clamp(-380px, -16vw, -190px) clamp(-26px, 0.4vw, 20px);
  z-index: 2;
  background: transparent;
  overflow: visible;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-image::before{
  content: "";
  position: absolute;
  inset: -10%;
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.9) 20%, rgba(0, 0, 0, 0.38) 49%, transparent 76%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.64), transparent 18%, transparent 74%, rgba(0, 0, 0, 0.76)),
    radial-gradient(ellipse at 28% 23%, rgba(0, 0, 0, 0.98), transparent 40%),
    radial-gradient(ellipse at 66% 86%, rgba(0, 0, 0, 0.2), transparent 46%);
  mix-blend-mode: multiply;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-image::after{
  content: "BECOMING";
  display: none;
  position: absolute;
  right: clamp(-220px, -14vw, -118px);
  bottom: -0.13em;
  z-index: 1;
  font: 900 clamp(190px, 25vw, 460px)/0.66 "Bodoni 72", "Bodoni Moda", "Libre Baskerville", var(--display);
  letter-spacing: 0;
  color: rgba(226, 28, 22, 0.15);
  transform: rotate(180deg);
  transform-origin: center;
  mix-blend-mode: screen;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-image img{
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: 54% 53%;
  filter: saturate(1.82) contrast(1.48) brightness(0.88);
  transform: scale(1.5) translate(9%, -2%);
  box-shadow: none;
  -webkit-mask-image: radial-gradient(ellipse at 54% 48%, #000 0 55%, rgba(0, 0, 0, 0.9) 69%, transparent 96%);
  mask-image: radial-gradient(ellipse at 54% 48%, #000 0 55%, rgba(0, 0, 0, 0.9) 69%, transparent 96%);
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy{
  grid-column: 1 / -1;
  grid-row: 1;
  z-index: 7;
  max-width: none;
  min-height: 100%;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto auto minmax(860px, 1fr) auto auto;
  gap: clamp(10px, 1.4vw, 22px);
  padding: 0;
  border: 0;
  background: transparent;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy::before,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy::after{
  position: absolute;
  z-index: 1;
  color: rgba(237, 36, 31, 0.48);
  font: 800 clamp(9.5px, 0.74vw, 13px)/1.22 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.24em;
  text-transform: uppercase;
  white-space: pre;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy::before{
  content: "FORM DEVELOPS THROUGH INSTABILITY      RESPONSE      ATTENTION             FRAMEWORK FOR ARTICULATION      OBJECTIVES / FEELINGS / FORCES        MATERIAL FOUNDATION\A PHOTOGRAPHY MOVES INTO NEW MEDIA        LIVING FIELD / TRANSLATION        ARCHIVE / PLATE / 01        FIELD / INDEX / 02        BODILY FOUNDATION\A SIMONDON / INGOLD / MEDIUM        INSTABILITY / RESPONSE / ATTENTION        ARTICULATION / OBJECTIVES / FEELINGS / FORCES";
  left: 0;
  right: 0;
  top: clamp(4px, 0.8vw, 12px);
  padding-top: clamp(8px, 0.9vw, 13px);
  border-top: 1px solid rgba(237, 36, 31, 0.2);
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy::after{
  content: "BECOMING";
  left: clamp(-28px, -1.4vw, 8px);
  right: auto;
  bottom: -0.08em;
  padding-top: 0;
  border-top: 0;
  font: 900 clamp(390px, 45vw, 900px)/0.58 "Bodoni 72", "Bodoni Moda", "Libre Baskerville", var(--display);
  letter-spacing: 0;
  color: rgba(204, 16, 16, 0.17);
  transform: rotate(180deg);
  transform-origin: center;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textLabel{
  grid-column: 2 / span 6;
  grid-row: 1;
  align-self: start;
  margin-top: clamp(70px, 5.6vw, 112px);
  color: rgba(214, 59, 133, 0.88);
  font: 800 clamp(11px, 1vw, 15px)/1.42 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.36em;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textLabel::after{
  content: "SIMONDON / INGOLD / MEDIUM\A FORM / INSTABILITY / RESPONSE / ATTENTION\A ARTICULATION / OBJECTIVES / FEELINGS / FORCES";
  display: block;
  width: 64ch;
  margin-top: clamp(10px, 1vw, 16px);
  color: rgba(237, 36, 31, 0.72);
  white-space: pre;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textTitle{
  grid-column: 1 / span 8;
  grid-row: 2 / span 2;
  align-self: start;
  position: relative;
  max-width: 7.2ch;
  margin: clamp(0px, 0.7vw, 14px) 0 0;
  font: 900 clamp(136px, 15.4vw, 318px)/0.58 "Bodoni 72", "Bodoni Moda", "Libre Baskerville", var(--display);
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: pre-line;
  color: rgba(230, 22, 16, 0.96);
  mix-blend-mode: normal;
  text-shadow: 0 18px 34px rgba(0, 0, 0, 0.45);
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textTitle::before{
  content: "";
  position: absolute;
  left: 0.02em;
  right: 0.5em;
  top: 0.99em;
  height: 1px;
  background: rgba(237, 36, 31, 0.38);
  transform: translateY(-50%);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody{
  max-width: 30ch;
  margin: 0;
  white-space: pre-line;
  font: 800 clamp(13.5px, 1.05vw, 18px)/1.65 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: rgba(222, 158, 158, 0.9);
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.7);
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody::first-line{
  color: rgba(236, 61, 132, 0.95);
  letter-spacing: 0.28em;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:first-of-type{
  grid-column: 2 / span 3;
  grid-row: 4;
  align-self: end;
  padding-top: clamp(10px, 1vw, 14px);
  border-top: 1px solid rgba(237, 36, 31, 0.22);
  color: rgba(234, 132, 148, 0.92);
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(2){
  grid-column: 8 / span 3;
  grid-row: 4;
  align-self: end;
  padding-top: clamp(10px, 1vw, 14px);
  border-top: 1px solid rgba(237, 36, 31, 0.22);
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(3){
  grid-column: 5 / span 5;
  grid-row: 5;
  align-self: end;
  justify-self: center;
  max-width: none;
  padding-top: 12px;
  border-top: 1px solid rgba(237, 36, 31, 0.22);
  color: rgba(214, 59, 133, 0.7);
  font-size: clamp(12.5px, 0.92vw, 15px);
  line-height: 1.55;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-detail{
  display: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-detail img{
  aspect-ratio: 1 / 1;
  object-fit: cover;
  filter: grayscale(1) contrast(1.15) brightness(0.82);
}

.workShell[data-work="diffractive-flora"] .flora-opening{
  width: var(--flora-reading);
  max-width: var(--flora-reading);
  display: grid;
  grid-template-columns: minmax(120px, 0.2fr) minmax(0, 0.8fr);
  gap: clamp(18px, 3vw, 46px);
  border-top: 1px solid var(--flora-line-strong);
  padding-top: clamp(24px, 4vw, 52px);
}

.workShell[data-work="diffractive-flora"] .flora-opening .textLabel{
  grid-column: 1;
  align-self: start;
  font: 600 10px/1.35 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.32em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .flora-opening .textBody{
  grid-column: 2;
  max-width: 70ch;
}

.workShell[data-work="diffractive-flora"] .flora-opening .textBody:first-of-type{
  font-size: clamp(19px, 1.7vw, 25px);
  line-height: 1.66;
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-opening-strip{
  width: var(--flora-width);
  max-width: var(--flora-width);
  grid-template-columns: 0.74fr 1.16fr 0.86fr;
  align-items: end;
  gap: clamp(14px, 2vw, 28px);
}

.workShell[data-work="diffractive-flora"] .flora-opening-strip .workStrip__item:nth-child(1){
  transform: translateY(clamp(18px, 3vw, 44px));
}

.workShell[data-work="diffractive-flora"] .flora-opening-strip .workStrip__item:nth-child(2) img{
  aspect-ratio: 5 / 7;
  object-fit: cover;
}

.workShell[data-work="diffractive-flora"] .flora-opening-strip .workStrip__item:nth-child(3){
  transform: translateY(clamp(-12px, -1.5vw, -22px));
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-primary-film-section{
  grid-column: 1 / -1;
  width: var(--flora-reading);
  max-width: var(--flora-reading);
  margin: clamp(-8px, -0.8vw, -2px) auto clamp(12px, 1.8vw, 28px);
  padding: clamp(18px, 2.4vw, 34px) 0 clamp(18px, 2.6vw, 38px);
  display: grid;
  grid-template-columns: minmax(260px, 0.58fr) minmax(280px, 0.42fr);
  gap: clamp(22px, 4.2vw, 70px);
  align-items: center;
  border-top: 1px solid rgba(246, 241, 223, 0.12);
  border-bottom: 1px solid rgba(246, 241, 223, 0.08);
}

.workShell[data-work="diffractive-flora"] .flora-primary-film{
  width: min(520px, 100%);
  max-width: min(520px, 100%);
  justify-self: end;
  position: relative;
}

.workShell[data-work="diffractive-flora"] .flora-primary-film::before{
  content: "";
  position: absolute;
  inset: clamp(12px, 1.4vw, 20px) clamp(-18px, -1.6vw, -10px) clamp(-18px, -1.8vw, -12px) clamp(16px, 1.8vw, 26px);
  border: 1px solid rgba(32, 255, 149, 0.18);
  background:
    linear-gradient(180deg, rgba(32, 255, 149, 0.06), rgba(255, 79, 154, 0.04)),
    rgba(246, 241, 223, 0.018);
  pointer-events: none;
  transform: translate(10px, 10px);
}

.workShell[data-work="diffractive-flora"] .flora-primary-film video{
  position: relative;
  z-index: 1;
  aspect-ratio: 4 / 5;
  max-height: min(62vh, 620px);
  object-fit: cover;
}

.workShell[data-work="diffractive-flora"] .flora-primary-film-copy{
  align-self: center;
  max-width: 34ch;
  padding: clamp(14px, 2vw, 24px) 0;
  background: transparent;
}

.workShell[data-work="diffractive-flora"] .flora-primary-film-copy .textLabel{
  width: max-content;
  padding-left: 12px;
  border-left: 2px solid var(--flora-orange);
  font: 700 10px/1.35 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--flora-orange);
}

.workShell[data-work="diffractive-flora"] .flora-primary-film-copy .textTitle{
  max-width: 13ch;
  margin: clamp(12px, 1.6vw, 18px) 0;
  font: 400 clamp(30px, 3.4vw, 54px)/0.94 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.02em;
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-primary-film-copy .textBody{
  margin: 0;
  font: 400 clamp(16px, 1.35vw, 19px)/1.62 "EB Garamond", var(--serif);
  color: var(--flora-muted);
}

.workShell[data-work="diffractive-flora"] .flora-primary-film-copy .textBody + .textBody{
  margin-top: 0.85em;
}

.workConstellationBlock,
.workCompareBlock{
  grid-column: 1 / -1;
  width: var(--flora-width);
  max-width: var(--flora-width);
  margin: 0 auto;
  display: grid;
  gap: clamp(16px, 2vw, 28px);
}

.workShell[data-work="diffractive-flora"] .workConstellationBlock .blockHeader,
.workShell[data-work="diffractive-flora"] .workCompareBlock .blockHeader,
.workShell[data-work="diffractive-flora"] .flora-specimen-field .blockHeader{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
  border-top: 1px solid var(--flora-line-strong);
  padding-top: clamp(18px, 3vw, 34px);
}

.workShell[data-work="diffractive-flora"] .workConstellationBlock .blockTitle,
.workShell[data-work="diffractive-flora"] .workCompareBlock .blockTitle,
.workShell[data-work="diffractive-flora"] .flora-specimen-field .blockTitle{
  font: 400 clamp(34px, 5.8vw, 88px)/0.92 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.02em;
}

.workShell[data-work="diffractive-flora"] .workConstellationBlock .blockMeta,
.workShell[data-work="diffractive-flora"] .workCompareBlock .blockMeta,
.workShell[data-work="diffractive-flora"] .flora-specimen-field .blockMeta{
  justify-self: end;
  max-width: 28ch;
  text-align: right;
  font: 600 10px/1.5 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation{
  width: 100vw;
  max-width: none;
  margin: clamp(16px, 2vw, 36px) calc(50% - 50vw) 0;
  gap: 0;
  padding: 0;
  overflow: clip;
}

.workShell[data-work="diffractive-flora"] .workConstellationMap{
  position: relative;
  width: 100vw;
  min-height: clamp(760px, 100svh, 1080px);
  margin: 0 auto;
  border: 0;
  background:
    linear-gradient(90deg, rgba(246, 241, 223, 0.09) 0 1px, transparent 1px) 50% 0 / 6.25vw 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.075) 0 1px, transparent 1px) 0 0 / 100% 12.5vh,
    #050505;
  overflow: hidden;
  isolation: isolate;
}

.workShell[data-work="diffractive-flora"] .workConstellationMap::before,
.workShell[data-work="diffractive-flora"] .workConstellationMap::after{
  content: "";
  position: absolute;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationMap::before{
  inset: clamp(70px, 8vw, 124px) clamp(54px, 6.2vw, 120px) clamp(70px, 8vw, 124px);
  z-index: 2;
  border: 1px solid rgba(246, 241, 223, 0.18);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationMap::after{
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 52% 48%, rgba(246, 241, 223, 0.16), transparent 18%),
    linear-gradient(90deg, rgba(5, 5, 5, 0.9), transparent 28%, transparent 70%, rgba(5, 5, 5, 0.82)),
    linear-gradient(180deg, rgba(5, 5, 5, 0.36), rgba(5, 5, 5, 0.18) 48%, rgba(5, 5, 5, 0.7));
}

.workShell[data-work="diffractive-flora"] .workConstellationBackdrop{
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] .workConstellationBackdrop img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 42%;
  border: 0;
  box-shadow: none;
  filter: grayscale(1) contrast(1.2) brightness(0.62);
  transform: scale(1.2);
  opacity: 0.62;
}

.workShell[data-work="diffractive-flora"] .workConstellationBackdrop figcaption{
  display: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationMapTop{
  position: absolute;
  inset: clamp(84px, 7.2vw, 124px) clamp(28px, 6vw, 128px) auto;
  z-index: 6;
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(260px, auto) minmax(120px, 1fr);
  align-items: start;
  gap: 18px;
  color: #fff;
  font-family: "Montserrat", "Didact Gothic", var(--sans);
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .workConstellationMapLabel{
  font: 800 clamp(12px, 1.1vw, 18px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] .workConstellationMapLabel.is-right{
  justify-self: end;
}

.workShell[data-work="diffractive-flora"] .workConstellationMapTitle{
  margin: 0;
  max-width: 14ch;
  justify-self: center;
  text-align: center;
  font: 900 clamp(28px, 3.2vw, 54px)/0.86 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] .workConstellationChaptersLabel{
  position: absolute;
  left: clamp(28px, 6vw, 128px);
  top: 60%;
  z-index: 6;
  font: 900 clamp(14px, 1.2vw, 20px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
  color: #fff;
}

.workShell[data-work="diffractive-flora"] .workConstellationNav{
  position: absolute;
  inset: 0;
  z-index: 8;
}

.workShell[data-work="diffractive-flora"] .workConstellationNode{
  --node-accent: var(--flora-green-bright);
  position: absolute;
  left: var(--node-x);
  top: var(--node-y);
  width: max-content;
  max-width: min(27vw, 330px);
  min-height: 0;
  display: grid;
  grid-template-columns: 14px minmax(118px, max-content);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 5px 12px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  transform: translate(-50%, -50%) translateZ(0);
  transform-origin: center;
  transition:
    color 220ms var(--ease),
    opacity 220ms var(--ease),
    transform 260ms var(--ease),
    filter 260ms var(--ease);
  outline: none;
  z-index: 3;
}

.workShell[data-work="diffractive-flora"] .workConstellationNode::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode::after{
  content: "";
  position: absolute;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationNode::before{
  left: 6px;
  top: 50%;
  width: clamp(42px, 7vw, 128px);
  height: 1px;
  background: color-mix(in oklab, var(--node-accent) 48%, transparent);
  opacity: 0.42;
  transform: translateY(-50%);
  transition: width 280ms var(--ease), opacity 220ms var(--ease), background 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode::after{
  left: 6px;
  top: 50%;
  width: 22px;
  height: 22px;
  border: 1px solid currentColor;
  opacity: 0;
  transform: translate(-50%, -50%) rotate(45deg);
  transition: opacity 220ms var(--ease), transform 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active{
  color: var(--node-accent);
  transform: translate(-50%, -50%) scale(1.1);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active::before{
  width: clamp(90px, 13vw, 220px);
  opacity: 0.9;
  background: linear-gradient(90deg, var(--node-accent), transparent);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active{
  filter: drop-shadow(0 0 12px color-mix(in oklab, var(--node-accent) 48%, transparent));
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active::after{
  opacity: 0.42;
  transform: translate(-50%, -50%) rotate(45deg) scale(1.18);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-wide:hover,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-wide:focus-visible{
  transform: translate(-50%, -50%) scale(1.16);
  filter: contrast(1.08);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall:hover,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall:focus-visible{
  transform: translate(-50%, -50%) rotate(-3deg) scale(1.14);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:hover,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:focus-visible{
  transform: translate(-50%, -50%) skew(-7deg, 0) scale(1.12);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-archive:hover,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-archive:focus-visible{
  transform: translate(-50%, -50%) scale(1.12);
}

.workShell[data-work="diffractive-flora"] .workConstellationPin{
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 12px;
  height: 12px;
  border: 0;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16);
  transition: box-shadow 260ms var(--ease), transform 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover .workConstellationPin,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible .workConstellationPin,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active .workConstellationPin{
  transform: scale(1.28);
  box-shadow:
    0 0 0 7px color-mix(in oklab, var(--node-accent) 18%, transparent),
    0 0 34px color-mix(in oklab, var(--node-accent) 58%, transparent);
}

.workShell[data-work="diffractive-flora"] .workConstellationIndex{
  grid-column: 2;
  grid-row: 1;
  max-width: 18ch;
  font: 900 clamp(12px, 1.05vw, 19px)/1.02 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-align: left;
  text-transform: uppercase;
  color: currentColor;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.55);
  transition: color 220ms var(--ease), text-shadow 220ms var(--ease), transform 260ms var(--ease), background 220ms var(--ease), padding 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationTitle{
  grid-column: 2;
  grid-row: 2;
  display: block;
  width: max-content;
  max-width: 14ch;
  padding-top: 4px;
  border-top: 1px solid color-mix(in oklab, var(--node-accent) 44%, transparent);
  font: 800 clamp(9px, 0.64vw, 11px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-align: left;
  text-transform: uppercase;
  color: color-mix(in oklab, var(--node-accent) 72%, #fff);
  transition: color 220ms var(--ease), border-color 220ms var(--ease), transform 260ms var(--ease), opacity 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover .workConstellationIndex,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible .workConstellationIndex,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active .workConstellationIndex{
  color: #fff;
  padding: 7px 10px;
  background:
    linear-gradient(90deg, color-mix(in oklab, var(--node-accent) 72%, transparent), rgba(5, 5, 5, 0.54));
  text-shadow:
    0 0 16px color-mix(in oklab, var(--node-accent) 82%, transparent),
    0 2px 16px rgba(0, 0, 0, 0.78);
  transform: translateX(4px);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover .workConstellationTitle,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible .workConstellationTitle,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active .workConstellationTitle{
  color: var(--flora-orange);
  border-color: var(--flora-orange);
  transform: translateX(4px);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreviewLayer{
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview{
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 260ms var(--ease), transform 300ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview::before{
  content: "";
  position: absolute;
  inset: clamp(86px, 9vw, 140px) clamp(48px, 7vw, 132px) clamp(76px, 8vw, 118px);
  border: 1px solid color-mix(in oklab, var(--node-accent) 42%, transparent);
  background:
    linear-gradient(90deg, color-mix(in oklab, var(--node-accent) 16%, transparent), transparent 42%),
    rgba(5, 5, 5, 0.28);
  opacity: 0;
  transform: scaleX(0.96);
  transition: opacity 260ms var(--ease), transform 300ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-hover{
  opacity: 1;
  transform: translateY(0);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-hover::before{
  opacity: 1;
  transform: scaleX(1);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreviewFigure{
  position: absolute;
  margin: 0;
  overflow: hidden;
  background: #000;
  border: 1px solid color-mix(in oklab, var(--node-accent) 36%, rgba(255, 255, 255, 0.18));
  box-shadow: 0 0 0 1px rgba(5, 5, 5, 0.62);
  transition:
    opacity 260ms var(--ease),
    transform 300ms var(--ease),
    filter 260ms var(--ease),
    box-shadow 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreviewFigure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  box-shadow: none;
  filter: grayscale(1) contrast(1.18);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-hover .workConstellationPreviewFigure{
  box-shadow:
    0 0 0 1px color-mix(in oklab, var(--node-accent) 48%, transparent),
    0 20px 80px rgba(0, 0, 0, 0.46);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-hover .workConstellationPreviewFigure img{
  filter: grayscale(0.58) saturate(1.2) contrast(1.18);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreviewFigure figcaption{
  display: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-wide .is-fragment-1{
  left: 13vw;
  bottom: 12vh;
  width: 30vw;
  height: 34vh;
  filter: grayscale(1);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-wide .is-fragment-2{
  left: 39vw;
  top: 20vh;
  width: 23vw;
  height: 26vh;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-tall .is-fragment-1{
  right: 10vw;
  top: 8vh;
  width: 34vw;
  height: 28vh;
  opacity: 0.9;
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-tall .is-fragment-2{
  left: 36vw;
  bottom: 13vh;
  width: 28vw;
  height: 34vh;
  mix-blend-mode: screen;
  filter: hue-rotate(24deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-drift .is-fragment-1{
  left: 25vw;
  top: 8vh;
  width: 24vw;
  height: 28vh;
  transform: rotate(-7deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-drift .is-fragment-2{
  right: 13vw;
  bottom: 10vh;
  width: 34vw;
  height: 25vh;
  filter: saturate(1.35) contrast(1.12);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-archive .is-fragment-1{
  right: 20vw;
  top: 16vh;
  width: 20vw;
  height: 22vh;
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-archive .is-fragment-2{
  right: 7vw;
  top: 34vh;
  width: 28vw;
  height: 24vh;
}

.workShell[data-work="diffractive-flora"] .workConstellationTape{
  position: absolute;
  z-index: 2;
  padding: 5px 12px;
  color: #050505;
  background: rgba(246, 241, 223, 0.82);
  font: 900 clamp(14px, 1.5vw, 26px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
  transform: rotate(-5deg);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-wide .workConstellationTape{
  left: 48vw;
  top: 42vh;
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-tall .workConstellationTape{
  right: 18vw;
  top: 30vh;
  transform: rotate(4deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-drift .workConstellationTape{
  left: 54vw;
  bottom: 30vh;
  transform: rotate(-2deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationPreview.is-archive .workConstellationTape{
  right: 9vw;
  bottom: 18vh;
  transform: rotate(3deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapters{
  width: 100vw;
  margin: 0;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter{
  display: none;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(760px, 100svh, 1100px);
  width: 100vw;
  grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.42fr) minmax(0, 0.52fr);
  gap: clamp(22px, 4vw, 76px);
  align-items: start;
  padding: clamp(92px, 10vw, 152px) clamp(28px, 7vw, 132px);
  border-top: 0;
  animation: floraConstellationChapterIn 420ms var(--ease) both;
  box-sizing: border-box;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.is-active{
  display: grid;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter::before,
.workShell[data-work="diffractive-flora"] .workConstellationChapter::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter::before{
  z-index: 0;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter::after{
  z-index: 1;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter > *{
  position: relative;
  z-index: 2;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterIntro,
.workShell[data-work="diffractive-flora"] .workConstellationChapterBody,
.workShell[data-work="diffractive-flora"] .workConstellationChapterNote{
  z-index: 5;
}

@keyframes floraConstellationChapterIn{
  from{
    opacity: 0;
    transform: translateY(26px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterIntro{
  display: grid;
  gap: clamp(16px, 2vw, 28px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterIndex{
  font: 800 clamp(13px, 1vw, 18px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--node-accent, var(--flora-green-bright));
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterTitle{
  margin: 0;
  max-width: 12ch;
  font: 900 clamp(58px, 8vw, 142px)/0.84 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--flora-paper);
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.58);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterLead{
  max-width: 42ch;
  margin: 0;
  font: 800 clamp(21px, 2.1vw, 38px)/1.12 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  color: rgba(246, 241, 223, 0.92);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterBody{
  display: grid;
  gap: 1.05em;
  max-width: 54ch;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterBody p{
  margin: 0;
  font: 400 clamp(17px, 1.55vw, 24px)/1.34 "Courier New", ui-monospace, monospace;
  color: rgba(246, 241, 223, 0.68);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterMedia{
  position: relative;
  z-index: 3;
  min-height: clamp(440px, 58vh, 680px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterMedia::before,
.workShell[data-work="diffractive-flora"] .workConstellationChapterMedia::after{
  content: "";
  position: absolute;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterFigure{
  position: absolute;
  z-index: 2;
  margin: 0;
  overflow: hidden;
  background: #000;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterFigure::before,
.workShell[data-work="diffractive-flora"] .workConstellationChapterFigure::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterFigure img{
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterFigure figcaption{
  display: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 0;
  width: 54%;
  height: 66%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterFigure:nth-child(2){
  right: 0;
  bottom: 0;
  width: 64%;
  height: 62%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapterNote{
  grid-column: 1 / -1;
  max-width: 62ch;
  margin-top: clamp(14px, 2vw, 28px);
  font: 800 clamp(12px, 1vw, 16px)/1.5 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(246, 241, 223, 0.46);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical{
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: repeat(12, minmax(42px, 1fr));
  align-items: stretch;
  min-height: clamp(980px, 138svh, 1580px);
  padding: clamp(52px, 5.5vw, 98px) clamp(42px, 6vw, 120px);
  color: #101820;
  background:
    linear-gradient(180deg, rgba(223, 231, 238, 0) 0 68%, rgba(223, 231, 238, 0.88) 78%, rgba(5, 5, 5, 0.78) 96%, #050505 100%),
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, 0.7) 0 1px, transparent 1px 9px),
    radial-gradient(circle at 82% 72%, rgba(255, 255, 255, 0.52) 0 1px, transparent 1px 12px),
    linear-gradient(90deg, rgba(20, 110, 255, 0.08) 0 1px, transparent 1px) 0 0 / 8.333vw 100%,
    linear-gradient(180deg, rgba(5, 5, 5, 0.06) 0 1px, transparent 1px) 0 0 / 100% 12.5vh,
    #dfe7ee;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical::before{
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.42) 0 22%, transparent 22% 27%, rgba(255, 255, 255, 0.22) 27% 72%, transparent 72% 76%, rgba(255, 255, 255, 0.32) 76% 100%),
    var(--chapter-img-1) -18% 4% / min(38vw, 520px) auto no-repeat,
    var(--chapter-img-1) 50% 0 / min(48vw, 700px) auto no-repeat,
    var(--chapter-img-1) 116% 3% / min(36vw, 500px) auto no-repeat,
    var(--chapter-img-2) 22% 78% / min(42vw, 620px) auto no-repeat,
    var(--chapter-img-2) 82% 72% / min(46vw, 680px) auto no-repeat;
  filter: grayscale(1) contrast(1.28) brightness(0.9);
  opacity: 0.72;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical::after{
  z-index: 1;
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(20, 112, 255, 0.88) 8% 58%, rgba(20, 112, 255, 0.38) 58% 84%, transparent 84%) 0 18% / 100% clamp(82px, 9vw, 150px) no-repeat,
    linear-gradient(90deg, rgba(20, 112, 255, 0.48), rgba(20, 112, 255, 0.08) 68%, transparent) 8% 58% / 58% 12% no-repeat,
    linear-gradient(90deg, transparent, rgba(20, 112, 255, 0.5), transparent) 60% 69% / 34% 10% no-repeat,
    linear-gradient(106deg, transparent 48%, rgba(255, 255, 255, 0.82) 49% 50%, transparent 51%) 4% -4% / 250px 420px no-repeat,
    linear-gradient(114deg, transparent 47%, rgba(255, 255, 255, 0.72) 48.4% 49.2%, transparent 50.6%) 35% -7% / 270px 500px no-repeat,
    linear-gradient(124deg, transparent 47%, rgba(255, 255, 255, 0.76) 48.8% 49.7%, transparent 51%) 76% -3% / 250px 500px no-repeat,
    linear-gradient(78deg, transparent 48%, rgba(255, 255, 255, 0.56) 49% 49.8%, transparent 51%) 11% 55% / 220px 380px no-repeat,
    radial-gradient(ellipse at 5% 54%, rgba(20, 112, 255, 0.38), transparent 20%),
    radial-gradient(ellipse at 75% 82%, rgba(20, 112, 255, 0.34), transparent 22%),
    radial-gradient(ellipse at 90% 48%, rgba(20, 112, 255, 0.2), transparent 18%),
    linear-gradient(0deg, rgba(255, 255, 255, 0.2), transparent 44%, rgba(255, 255, 255, 0.12));
  opacity: 0.94;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterIntro{
  grid-column: 3 / span 8;
  grid-row: 2 / span 3;
  align-self: center;
  justify-self: center;
  gap: clamp(12px, 1.1vw, 20px);
  max-width: min(1040px, 100%);
  padding: clamp(18px, 1.8vw, 32px) clamp(26px, 3.2vw, 62px) clamp(22px, 2vw, 38px);
  text-align: center;
  background:
    linear-gradient(90deg, rgba(8, 23, 58, 0) 0 8%, rgba(8, 23, 58, 0.58) 18% 82%, rgba(8, 23, 58, 0) 100%),
    linear-gradient(180deg, rgba(8, 23, 58, 0.5), rgba(8, 23, 58, 0.22));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(255, 255, 255, 0.15),
    0 18px 52px rgba(0, 24, 70, 0.2);
  backdrop-filter: blur(5px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterTitle{
  position: relative;
  max-width: 8.4ch;
  justify-self: center;
  margin: 0 0 clamp(6px, 0.6vw, 12px);
  font: 800 clamp(82px, 9vw, 164px)/0.74 "Bodoni Moda", "Cinzel Decorative", "Times New Roman", var(--display);
  letter-spacing: 0;
  text-transform: uppercase;
  color: #f2ff6f;
  -webkit-text-stroke: 1px rgba(242, 255, 111, 0.34);
  paint-order: stroke fill;
  text-shadow:
    0.035em 0.022em 0 rgba(5, 28, 86, 0.78),
    -0.018em 0.012em 0 rgba(20, 112, 255, 0.4),
    0 0 18px rgba(242, 255, 111, 0.24),
    0 14px 28px rgba(0, 26, 72, 0.44);
  transform: scaleX(0.7) scaleY(1.2);
  transform-origin: center;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterIndex{
  position: relative;
  z-index: 2;
  justify-self: center;
  color: rgba(255, 255, 255, 0.88);
  font-family: "Courier New", ui-monospace, monospace;
  font-size: clamp(11px, 0.9vw, 15px);
  letter-spacing: 0.03em;
  margin-bottom: clamp(4px, 0.6vw, 10px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterLead{
  max-width: 42ch;
  justify-self: center;
  margin-top: clamp(8px, 0.8vw, 16px);
  font: 800 clamp(11px, 0.96vw, 15px)/1.34 "Courier New", ui-monospace, monospace;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.92);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody{
  grid-column: 2 / span 10;
  grid-row: 6 / span 6;
  align-self: end;
  justify-self: start;
  position: relative;
  z-index: 7;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(14px, 1.2vw, 24px);
  width: min(1160px, 100%);
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody p:first-child::before{
  content: "SCAN FIELD 01";
  display: grid;
  place-items: center start;
  width: min(100%, 11.5em);
  max-width: 100%;
  min-height: clamp(44px, 4vw, 72px);
  margin: calc(clamp(24px, 2.35vw, 42px) * -1) 0 clamp(18px, 1.45vw, 26px) calc(clamp(24px, 2.7vw, 44px) * -1);
  padding: clamp(8px, 0.7vw, 12px) clamp(16px, 1.35vw, 24px);
  color: rgba(242, 255, 111, 0.94);
  background:
    linear-gradient(90deg, rgba(5, 20, 70, 0.94), rgba(6, 53, 150, 0.82)),
    radial-gradient(circle at 88% 25%, rgba(255, 255, 255, 0.22), transparent 28%);
  box-shadow:
    10px 10px 0 rgba(20, 112, 255, 0.2),
    inset 0 0 0 1px rgba(242, 255, 111, 0.32);
  font: 800 clamp(30px, 3.2vw, 62px)/0.78 "Bodoni Moda", "Cinzel Decorative", "Times New Roman", var(--display);
  letter-spacing: -0.015em;
  text-transform: uppercase;
  text-shadow:
    0.04em 0.025em 0 rgba(2, 14, 55, 0.88),
    -0.018em 0.012em 0 rgba(20, 112, 255, 0.62);
  transform: translate(-3%, -12%) scaleX(0.82) scaleY(1.14);
  transform-origin: left bottom;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody p{
  position: relative;
  grid-column: 1 / span 6;
  margin: 0;
  padding: clamp(24px, 2.35vw, 42px) clamp(24px, 2.7vw, 44px);
  border: 1px solid rgba(223, 231, 238, 0.28);
  background:
    linear-gradient(rgba(255, 255, 255, 0.1) 0 1px, transparent 1px) 0 0 / 100% clamp(34px, 2.6vw, 48px),
    radial-gradient(circle, rgba(255, 255, 255, 0.12) 0 1px, transparent 1.8px) 0 0 / 7px 7px,
    linear-gradient(116deg, rgba(26, 124, 255, 0.96), rgba(5, 75, 205, 0.93) 58%, rgba(3, 43, 132, 0.94)),
    rgba(20, 112, 255, 0.9);
  box-shadow:
    12px 12px 0 rgba(6, 23, 70, 0.18),
    -10px -10px 0 rgba(102, 199, 255, 0.14),
    0 22px 54px rgba(6, 23, 70, 0.22);
  font: 800 clamp(15px, 1.1vw, 20px)/1.4 "Courier New", ui-monospace, monospace;
  letter-spacing: -0.01em;
  color: rgba(255, 255, 255, 0.94);
  text-shadow: 0 1px 0 rgba(0, 18, 70, 0.38);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody p + p{
  grid-column: 7 / span 5;
  margin-top: clamp(118px, 10vw, 176px);
  margin-left: clamp(-36px, -2.6vw, -18px);
  padding-top: clamp(22px, 2.1vw, 36px);
  background:
    linear-gradient(rgba(255, 255, 255, 0.08) 0 1px, transparent 1px) 0 0 / 100% clamp(32px, 2.5vw, 44px),
    radial-gradient(circle, rgba(255, 255, 255, 0.1) 0 1px, transparent 1.8px) 0 0 / 7px 7px,
    radial-gradient(circle at 85% 22%, rgba(255, 255, 255, 0.16), transparent 24%),
    linear-gradient(112deg, rgba(10, 86, 214, 0.92), rgba(5, 40, 138, 0.96));
  box-shadow:
    -10px 10px 0 rgba(20, 112, 255, 0.18),
    10px -10px 0 rgba(223, 231, 238, 0.12),
    0 18px 44px rgba(6, 23, 70, 0.22);
  color: rgba(255, 255, 255, 0.88);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia{
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: repeat(10, minmax(42px, 1fr));
  gap: clamp(12px, 1.3vw, 20px);
  align-content: stretch;
  min-height: 0;
  opacity: 0.98;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia::before{
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, transparent 0 18%, rgba(20, 112, 255, 0.46) 18% 38%, transparent 38%) 0 38% / 100% 9% no-repeat,
    linear-gradient(90deg, transparent 0 48%, rgba(20, 112, 255, 0.42) 48% 70%, transparent 70%) 0 52% / 100% 12% no-repeat,
    linear-gradient(90deg, rgba(20, 112, 255, 0.24), rgba(20, 112, 255, 0.06)) 34% 47% / 30% 18% no-repeat,
    linear-gradient(90deg, rgba(20, 112, 255, 0.34), rgba(20, 112, 255, 0.1)) 61% 71% / 28% 15% no-repeat,
    linear-gradient(90deg, rgba(20, 112, 255, 0.2), rgba(20, 112, 255, 0.04)) 8% 18% / 72% 12% no-repeat,
    linear-gradient(90deg, rgba(20, 112, 255, 0.34), rgba(20, 112, 255, 0.1)) 13% 61% / 66% 16% no-repeat,
    linear-gradient(90deg, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.12)) 0 0 / 22% 43% no-repeat,
    linear-gradient(90deg, rgba(255, 255, 255, 0.36), rgba(255, 255, 255, 0.1)) 27% 0 / 46% 43% no-repeat,
    linear-gradient(90deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.1)) 78% 0 / 22% 43% no-repeat,
    linear-gradient(90deg, rgba(255, 255, 255, 0.24), transparent) 0 57% / 44% 34% no-repeat,
    linear-gradient(90deg, rgba(255, 255, 255, 0.22), transparent) 54% 57% / 46% 24% no-repeat,
    linear-gradient(90deg, rgba(20, 112, 255, 0.28), transparent 72%) 0 61% / 100% 28% no-repeat;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia::after{
  content: "";
  inset: 0;
  z-index: 4;
  background:
    linear-gradient(180deg, transparent 0 70%, rgba(223, 231, 238, 0.36) 78%, rgba(5, 5, 5, 0.84) 96%, #050505 100%),
    linear-gradient(90deg, transparent 0 22%, rgba(20, 112, 255, 0.34) 22% 49%, transparent 49%) 0 42% / 100% 6% no-repeat,
    linear-gradient(90deg, transparent 0 55%, rgba(20, 112, 255, 0.28) 55% 88%, transparent 88%) 0 63% / 100% 8% no-repeat,
    linear-gradient(90deg, transparent 0 11%, rgba(20, 112, 255, 0.56) 11% 83%, transparent 83%) 0 18% / 100% clamp(74px, 8.6vw, 134px) no-repeat,
    radial-gradient(ellipse at 6% 71%, rgba(20, 112, 255, 0.42), transparent 16%),
    radial-gradient(ellipse at 78% 74%, rgba(20, 112, 255, 0.32), transparent 20%),
    radial-gradient(circle, rgba(255, 255, 255, 0.3) 0 1px, transparent 1.8px) 0 0 / 6px 6px;
  mix-blend-mode: multiply;
  opacity: 0.9;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure{
  position: relative;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(232, 238, 244, 0.5);
  box-shadow: none;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure::before{
  background:
    radial-gradient(circle, rgba(16, 24, 32, 0.2) 0 1px, transparent 1.7px) 0 0 / 5px 5px,
    linear-gradient(90deg, rgba(20, 112, 255, 0.32), transparent 58%);
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure::after{
  background:
    linear-gradient(rgba(223, 231, 238, 0.42), rgba(223, 231, 238, 0.42)),
    linear-gradient(108deg, transparent 48%, rgba(255, 255, 255, 0.6) 49% 50%, transparent 51%),
    linear-gradient(78deg, transparent 49%, rgba(255, 255, 255, 0.42) 50% 50.8%, transparent 52%);
  mix-blend-mode: screen;
  opacity: 0.88;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(1){
  grid-column: 4 / span 5;
  grid-row: 1 / span 5;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(2){
  grid-column: 7 / span 5;
  grid-row: 6 / span 3;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(3){
  grid-column: 1 / span 5;
  grid-row: 5 / span 5;
  z-index: 3;
  transform: translate(-5%, 0);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(3)::before{
  background:
    radial-gradient(circle, rgba(255, 255, 255, 0.28) 0 1px, transparent 1.7px) 0 0 / 5px 5px,
    linear-gradient(90deg, rgba(20, 112, 255, 0.86), rgba(20, 112, 255, 0.28));
  mix-blend-mode: color;
  opacity: 0.92;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(3)::after{
  background:
    linear-gradient(90deg, rgba(20, 112, 255, 0.22), transparent 56%),
    linear-gradient(108deg, transparent 48%, rgba(255, 255, 255, 0.68) 49% 50%, transparent 51%);
  mix-blend-mode: screen;
  opacity: 0.9;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(4){
  grid-column: 8 / span 5;
  grid-row: 5 / span 6;
  z-index: 4;
  transform: translate(7%, 6%);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(4)::before{
  background:
    radial-gradient(circle, rgba(255, 255, 255, 0.2) 0 1px, transparent 1.7px) 0 0 / 5px 5px,
    linear-gradient(270deg, rgba(20, 112, 255, 0.72), rgba(20, 112, 255, 0.18));
  mix-blend-mode: color;
  opacity: 0.72;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(4)::after{
  background:
    linear-gradient(270deg, rgba(20, 112, 255, 0.12), transparent 58%),
    linear-gradient(72deg, transparent 48%, rgba(255, 255, 255, 0.66) 49% 50%, transparent 51%);
  mix-blend-mode: screen;
  opacity: 0.7;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure img{
  opacity: 0.86;
  filter: grayscale(1) contrast(1.12) brightness(1.08);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(3) img,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(4) img{
  opacity: 0.88;
  filter: grayscale(1) contrast(1.35) brightness(1.12) sepia(1) saturate(5) hue-rotate(176deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(4) img{
  opacity: 0.98;
  filter: grayscale(1) contrast(1.42) brightness(1.18) sepia(1) saturate(6.8) hue-rotate(176deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterNote{
  grid-column: 1 / span 1;
  grid-row: 6 / span 5;
  align-self: center;
  justify-self: start;
  z-index: 8;
  max-width: none;
  margin: 0;
  writing-mode: vertical-rl;
  transform: translateX(clamp(-54px, -3.4vw, -28px)) rotate(180deg);
  color: rgba(255, 79, 154, 0.98);
  font: 900 clamp(22px, 2.3vw, 42px)/0.96 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-shadow:
    0 0 1px rgba(5, 5, 5, 0.48),
    0 0 18px rgba(255, 79, 154, 0.42);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive{
  grid-template-columns: minmax(280px, 0.38fr) minmax(0, 0.62fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  color: #050505;
  background:
    linear-gradient(90deg, rgba(102, 199, 255, 0.1) 0 1px, transparent 1px) 0 0 / 9.09vw 100%,
    linear-gradient(180deg, rgba(5, 5, 5, 0.05) 0 1px, transparent 1px) 0 0 / 100% 12vh,
    #f8f7ef;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive::before{
  background:
    var(--chapter-img-1) 68% 45% / min(56vw, 900px) auto no-repeat,
    var(--chapter-img-2) 89% 68% / min(42vw, 680px) auto no-repeat;
  filter: saturate(0.42) contrast(1.2) brightness(1.18);
  opacity: 0.32;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive::after{
  background:
    radial-gradient(ellipse at 57% 40%, rgba(102, 199, 255, 0.42), transparent 26%),
    radial-gradient(ellipse at 63% 44%, rgba(255, 79, 154, 0.34), transparent 28%),
    radial-gradient(ellipse at 52% 54%, rgba(28, 255, 154, 0.22), transparent 22%),
    linear-gradient(90deg, transparent 0 68%, rgba(246, 241, 223, 0.72) 68% 100%);
  opacity: 0.86;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterLead,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
  color: #050505;
  text-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  grid-column: 1;
  grid-row: 1;
  align-self: start;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIndex{
  color: var(--flora-pink);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle{
  max-width: 8ch;
  font: 900 clamp(76px, 7.4vw, 142px)/0.82 "Montserrat", "Didact Gothic", var(--sans);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterLead{
  max-width: 30ch;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  grid-column: 1;
  grid-row: 2;
  align-self: end;
  max-width: 36ch;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  color: rgba(5, 5, 5, 0.66);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  grid-column: 2;
  grid-row: 1 / span 3;
  min-height: clamp(620px, 76vh, 900px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::after{
  inset: -4% -8% -2% -8%;
  z-index: 1;
  background: var(--chapter-img-1) 50% 48% / contain no-repeat;
  opacity: 0.48;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  filter: hue-rotate(150deg) saturate(2.4) contrast(1.12);
  transform: translate(-40px, 18px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::after{
  background-image: var(--chapter-img-2);
  filter: hue-rotate(300deg) saturate(2.1) contrast(1.16);
  transform: translate(38px, -26px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  background: transparent;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before{
  background: linear-gradient(90deg, rgba(102, 199, 255, 0.2), rgba(255, 79, 154, 0.18));
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 5%;
  top: 3%;
  width: 76%;
  height: 88%;
  opacity: 0.74;
  filter:
    drop-shadow(34px 0 0 rgba(102, 199, 255, 0.28))
    drop-shadow(-20px 18px 0 rgba(255, 79, 154, 0.2));
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  right: -2%;
  bottom: 8%;
  width: 74%;
  height: 68%;
  opacity: 0.62;
  filter:
    drop-shadow(-36px 0 0 rgba(255, 79, 154, 0.24))
    drop-shadow(24px -18px 0 rgba(28, 255, 154, 0.16));
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  filter: saturate(1.08) contrast(1.05) brightness(1.06);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
  width: max-content;
  max-width: 32ch;
  padding-top: 12px;
  border-top: 2px solid var(--flora-pink);
  color: rgba(5, 5, 5, 0.7);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process{
  grid-template-columns: minmax(270px, 0.34fr) minmax(0, 0.66fr);
  grid-template-rows: auto 1fr auto;
  background:
    linear-gradient(90deg, rgba(102, 199, 255, 0.12) 0 1px, transparent 1px) 0 0 / 7.142vw 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.08) 0 1px, transparent 1px) 0 0 / 100% 12.5vh,
    #050505;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process::before{
  background:
    radial-gradient(circle at 68% 38%, transparent 0 19%, rgba(102, 199, 255, 0.4) 19.1% 19.35%, transparent 19.55%),
    radial-gradient(circle at 68% 38%, transparent 0 31%, rgba(246, 241, 223, 0.24) 31.1% 31.35%, transparent 31.55%),
    linear-gradient(90deg, transparent 0 39%, rgba(246, 241, 223, 0.16) 39% 58%, transparent 58%),
    linear-gradient(180deg, transparent 0 52%, rgba(246, 241, 223, 0.14) 52% 72%, transparent 72%),
    var(--chapter-img-2) 78% 56% / min(48vw, 760px) auto no-repeat,
    var(--chapter-img-1) 58% 19% / min(34vw, 540px) auto no-repeat;
  filter: grayscale(0.72) contrast(1.32) saturate(0.88);
  opacity: 0.76;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process::after{
  inset: clamp(38px, 5vw, 82px);
  border: 1px solid rgba(102, 199, 255, 0.38);
  background:
    linear-gradient(90deg, rgba(255, 122, 26, 0.52) 0 4px, transparent 4px) 8% 0 / 100% 100% no-repeat,
    linear-gradient(180deg, rgba(246, 241, 223, 0.11) 0 1px, transparent 1px) 0 0 / 100% 20%,
    linear-gradient(90deg, rgba(246, 241, 223, 0.11) 0 1px, transparent 1px) 0 0 / 12.5% 100%;
  box-shadow:
    inset 0 0 0 1px rgba(255, 122, 26, 0.12),
    inset 24vw 0 0 rgba(5, 5, 5, 0.22);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterTitle{
  max-width: 8ch;
  color: var(--flora-paper);
  font: 400 clamp(64px, 6.8vw, 132px)/0.88 "Cinzel Decorative", "Bodoni Moda", var(--display);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterLead{
  max-width: 29ch;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterBody{
  max-width: 37ch;
  align-self: end;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterMedia{
  grid-column: 2;
  grid-row: 1 / span 3;
  display: grid;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  grid-template-rows: repeat(8, minmax(50px, 1fr));
  gap: clamp(8px, 0.9vw, 14px);
  min-height: clamp(620px, 78vh, 900px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterMedia::before{
  inset: 5% 2% 4% 0;
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(246, 241, 223, 0.88) 0 23%, transparent 23% 34%, rgba(5, 5, 5, 0.78) 34% 58%, transparent 58%),
    linear-gradient(180deg, transparent 0 21%, rgba(246, 241, 223, 0.8) 21% 48%, transparent 48% 66%, rgba(5, 5, 5, 0.86) 66% 100%);
  opacity: 0.22;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterMedia::after{
  inset: 0;
  z-index: 4;
  border: 1px solid rgba(246, 241, 223, 0.26);
  background:
    radial-gradient(circle at 63% 28%, transparent 0 22%, rgba(246, 241, 223, 0.7) 22.1% 22.3%, transparent 22.5%),
    radial-gradient(circle at 35% 72%, transparent 0 18%, rgba(102, 199, 255, 0.62) 18.1% 18.35%, transparent 18.55%),
    linear-gradient(90deg, rgba(246, 241, 223, 0.18) 0 1px, transparent 1px) 0 0 / 10% 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.14) 0 1px, transparent 1px) 0 0 / 100% 12.5%;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterFigure{
  position: relative;
  width: 100%;
  height: 100%;
  border: 1px solid rgba(246, 241, 223, 0.34);
  background: #000;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterFigure::before{
  background:
    radial-gradient(circle, rgba(246, 241, 223, 0.22) 0 1px, transparent 1.7px) 0 0 / 5px 5px,
    linear-gradient(120deg, transparent 0 62%, rgba(255, 122, 26, 0.22) 62% 100%);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterFigure:nth-child(1){
  grid-column: 1 / span 5;
  grid-row: 1 / span 6;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterFigure:nth-child(2){
  grid-column: 5 / span 6;
  grid-row: 3 / span 5;
  border-color: rgba(255, 122, 26, 0.58);
  box-shadow:
    -24px -24px 0 rgba(246, 241, 223, 0.1),
    18px 18px 0 rgba(102, 199, 255, 0.08);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterFigure img{
  filter: saturate(1.18) contrast(1.14);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium{
  grid-template-columns: minmax(300px, 0.42fr) minmax(0, 0.58fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  color: var(--flora-paper);
  background:
    radial-gradient(circle at 72% 18%, rgba(255, 79, 154, 0.24), transparent 20%),
    radial-gradient(circle at 24% 78%, rgba(102, 199, 255, 0.14), transparent 28%),
    #050505;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium::before{
  background:
    radial-gradient(circle, rgba(246, 241, 223, 0.36) 0 1px, transparent 1.8px) 0 0 / 6px 6px,
    linear-gradient(90deg, rgba(255, 79, 154, 0.22), transparent 34%, rgba(102, 199, 255, 0.12)),
    var(--chapter-img-1) -10% 20% / min(50vw, 780px) auto no-repeat,
    var(--chapter-img-2) 66% 50% / cover no-repeat;
  filter: grayscale(0.88) contrast(1.46) brightness(0.72);
  opacity: 0.68;
  mix-blend-mode: screen;
  transform: scale(1.08);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium::after{
  inset: clamp(86px, 10vw, 138px) clamp(24px, 7vw, 126px) auto;
  height: clamp(300px, 42vh, 520px);
  border: 1px solid rgba(102, 199, 255, 0.38);
  background:
    linear-gradient(90deg, rgba(255, 79, 154, 0.22), rgba(5, 5, 5, 0.74) 26%, rgba(5, 5, 5, 0.86) 74%, rgba(102, 199, 255, 0.16)),
    rgba(5, 5, 5, 0.74);
  box-shadow:
    -22px 22px 0 rgba(255, 79, 154, 0.18),
    26px -20px 0 rgba(102, 199, 255, 0.14),
    0 0 80px rgba(255, 79, 154, 0.14);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterTitle,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterLead,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterBody p,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterNote{
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterIntro{
  grid-column: 1;
  grid-row: 1;
  align-self: start;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterIndex{
  color: var(--flora-green-bright);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterTitle{
  max-width: 10ch;
  font-size: clamp(66px, 7vw, 132px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterLead{
  max-width: 33ch;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterBody{
  grid-column: 1;
  grid-row: 2;
  max-width: 38ch;
  padding: clamp(18px, 2vw, 28px);
  background: rgba(5, 5, 5, 0.58);
  border: 1px solid rgba(255, 79, 154, 0.22);
  backdrop-filter: blur(14px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterBody p{
  color: rgba(246, 241, 223, 0.72);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterMedia{
  grid-column: 2;
  grid-row: 1 / span 3;
  min-height: clamp(620px, 76vh, 900px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterMedia::before{
  inset: -8% -10% -6% -18%;
  z-index: 1;
  background:
    radial-gradient(circle, rgba(255, 79, 154, 0.52) 0 1px, transparent 1.9px) 0 0 / 7px 7px,
    var(--chapter-img-2) 50% 48% / cover no-repeat;
  filter: grayscale(1) contrast(1.7);
  opacity: 0.46;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterMedia::after{
  content: "scan / archive / specimen / time";
  left: -4%;
  bottom: 12%;
  z-index: 4;
  max-width: 28ch;
  color: rgba(255, 79, 154, 0.96);
  font: 800 clamp(11px, 1.05vw, 16px)/1.9 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterFigure:nth-child(1){
  left: -30%;
  top: -2%;
  width: 92%;
  height: 78%;
  opacity: 0.8;
  mix-blend-mode: screen;
  filter: drop-shadow(34px 10px 0 rgba(255, 79, 154, 0.24));
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterFigure:nth-child(2){
  right: -10%;
  bottom: -6%;
  width: 96%;
  height: 84%;
  border: 1px solid rgba(255, 79, 154, 0.34);
  box-shadow:
    -28px -24px 0 rgba(5, 5, 5, 0.58),
    18px 18px 0 rgba(102, 199, 255, 0.14);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterFigure::before{
  background:
    radial-gradient(circle, rgba(246, 241, 223, 0.34) 0 1px, transparent 1.8px) 0 0 / 5px 5px,
    linear-gradient(90deg, rgba(255, 79, 154, 0.28), transparent 48%);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterFigure img{
  filter: saturate(1.08) contrast(1.24) brightness(0.92);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterNote{
  width: max-content;
  max-width: 36ch;
  padding: 9px 12px;
  background: rgba(5, 5, 5, 0.62);
  border: 1px solid rgba(28, 255, 154, 0.42);
  color: rgba(28, 255, 154, 0.88);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.is-archive .workConstellationChapterLead{
  align-self: end;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.is-archive .workConstellationChapterMedia{
  min-height: clamp(620px, 76vh, 900px);
}

.workCompareGrid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(12px, 1.5vw, 22px);
}

.workComparePair{
  position: relative;
  display: grid;
  gap: 9px;
  outline: none;
}

.workComparePairStage{
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  border: 1px solid rgba(246, 241, 223, 0.12);
  background: #000;
}

.workComparePairStage::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  background:
    linear-gradient(90deg, rgba(255, 79, 154, 0.16), transparent 18%, transparent 78%, rgba(32, 255, 149, 0.14)),
    repeating-linear-gradient(180deg, rgba(246, 241, 223, 0.09) 0 1px, transparent 1px 9px);
  mix-blend-mode: screen;
  opacity: 0.32;
  pointer-events: none;
}

.workComparePairStage img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: none;
  box-shadow: none;
  transition: opacity 260ms var(--ease), transform 260ms var(--ease), filter 260ms var(--ease);
}

.workCompareOverlay{
  opacity: 0.48;
  mix-blend-mode: lighten;
  filter: grayscale(1) contrast(1.12);
  clip-path: inset(0 0 0 46%);
}

.workComparePair:hover .workCompareOverlay,
.workComparePair:focus-visible .workCompareOverlay{
  opacity: 0.82;
  transform: translateX(-3%);
  clip-path: inset(0 0 0 0);
}

.workComparePair:hover .workCompareBase,
.workComparePair:focus-visible .workCompareBase{
  transform: scale(1.03);
  filter: saturate(1.18) contrast(1.05);
}

.workComparePair figcaption{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: rgba(246, 241, 223, 0.58);
  font: 600 9px/1.4 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .flora-process-spread{
  width: var(--flora-reading);
  max-width: var(--flora-reading);
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  padding-top: clamp(20px, 3vw, 38px);
  border-top: 1px solid var(--flora-line);
}

.workShell[data-work="diffractive-flora"] .flora-process-spread .pairText:first-child{
  font: 400 clamp(25px, 3.2vw, 46px)/1.16 "Libre Baskerville", "EB Garamond", var(--serif);
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .flora-process-spread .pairText:last-child{
  font: 400 clamp(16px, 1.55vw, 22px)/1.72 "EB Garamond", var(--serif);
  color: var(--flora-muted);
}

.workShell[data-work="diffractive-flora"] .flora-motion-film video,
.workShell[data-work="diffractive-flora"] .flora-motion-gif img,
.workShell[data-work="diffractive-flora"] .flora-motion-gif video{
  width: 100%;
  aspect-ratio: 9 / 13;
  object-fit: cover;
}

.workShell[data-work="diffractive-flora"] .flora-motion-left,
.workShell[data-work="diffractive-flora"] .flora-motion-column,
.workShell[data-work="diffractive-flora"] .flora-motion-ascii{
  width: min(520px, 78%);
  justify-self: end;
}

.workShell[data-work="diffractive-flora"] .flora-motion-right,
.workShell[data-work="diffractive-flora"] .flora-motion-vortex,
.workShell[data-work="diffractive-flora"] .flora-motion-gif{
  width: min(520px, 78%);
  justify-self: start;
}

.workShell[data-work="diffractive-flora"] .flora-motion-softcross{
  width: min(900px, 90vw);
  max-width: min(900px, 90vw);
  justify-self: center;
}

.workShell[data-work="diffractive-flora"] .flora-motion-softcross video{
  aspect-ratio: 34 / 46.8;
  max-height: 86vh;
}

.workShell[data-work="diffractive-flora"] .flora-specimen-field{
  width: var(--flora-width);
  max-width: var(--flora-width);
  margin: clamp(12px, 3vw, 44px) auto 0;
}

.workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumbGrid{
  --cols: 5;
  gap: clamp(9px, 1.2vw, 16px);
  align-items: stretch;
}

.workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumb{
  overflow: hidden;
  background: #000;
}

.workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumb img{
  width: 100%;
  height: 100%;
  min-height: clamp(180px, 20vw, 300px);
  object-fit: cover;
  filter: saturate(1.08) contrast(1.05);
  transition: transform 260ms var(--ease), filter 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumb:hover img{
  transform: scale(1.04);
  filter: saturate(1.22) contrast(1.08);
}

.workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumb:nth-child(5n + 2),
.workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumb:nth-child(5n + 4){
  transform: translateY(clamp(8px, 1.2vw, 18px));
}

.workShell[data-work="diffractive-flora"] .flora-glossary{
  grid-column: 1 / -1;
  width: var(--flora-width);
  max-width: var(--flora-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--flora-line-strong);
  background: var(--flora-line-strong);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card{
  max-width: none;
  min-height: clamp(190px, 18vw, 260px);
  padding: clamp(18px, 2.2vw, 30px);
  background: rgba(5, 5, 5, 0.92);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textLabel{
  color: var(--flora-orange);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
  max-width: 12ch;
  font: 400 clamp(25px, 3.1vw, 46px)/0.96 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.02em;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
  margin-top: auto;
  font: 500 clamp(13px, 1.05vw, 16px)/1.62 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.08em;
  text-transform: none;
  color: rgba(246, 241, 223, 0.74);
}

.workShell[data-work="diffractive-flora"] .workEnd{
  width: var(--flora-width);
  margin: 0 auto;
  border-top-color: var(--flora-line);
}

.workShell[data-work="diffractive-flora"] .workSlide .slideBg img{
  filter: saturate(1.08) brightness(0.34) contrast(1.08);
  opacity: 0.38;
}

.workShell[data-work="diffractive-flora"] .workSlide .slideBg::before{
  background: linear-gradient(180deg, rgba(5, 5, 5, 0.28) 0%, rgba(5, 5, 5, 0.7) 100%);
}

.workShell[data-work="diffractive-flora"] .workSlide figure{
  border-radius: 0;
}

.workShell[data-work="diffractive-flora"] .workDots::after{
  background: linear-gradient(180deg, var(--flora-green-bright), var(--flora-pink));
}

@media (prefers-reduced-motion: reduce){
  .workShell[data-work="diffractive-flora"] .workHeroRailLoop{
    animation: none;
  }
}

@media (max-width: 1200px){
  .workShell[data-work="diffractive-flora"] .workConstellationChapter,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-tall,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-drift,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-archive,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium{
    grid-template-columns: minmax(0, 0.48fr) minmax(0, 0.52fr);
    gap: clamp(22px, 3.8vw, 46px);
    padding-inline: clamp(42px, 6vw, 84px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive{
    grid-template-columns: minmax(0, 0.54fr) minmax(0, 0.46fr);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium{
    grid-template-columns: minmax(0, 0.6fr) minmax(0, 0.4fr);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapterTitle,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-tall .workConstellationChapterTitle,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterTitle{
    max-width: 13ch;
    font-size: clamp(58px, 10vw, 112px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapterLead{
    max-width: 38ch;
    font-size: clamp(22px, 3vw, 32px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapterBody{
    max-width: 36ch;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterIntro{
    grid-column: 1;
    grid-row: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterMedia{
    grid-column: 2;
    grid-row: 1 / span 3;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-tall .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-drift .workConstellationChapterMedia{
    min-height: clamp(520px, 66vh, 720px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-archive .workConstellationChapterIntro{
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia{
    grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-template-rows: repeat(7, minmax(58px, 1fr));
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterMedia{
    grid-template-columns: repeat(10, minmax(0, 1fr));
    grid-template-rows: repeat(8, minmax(42px, 1fr));
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive::before{
    background:
      var(--chapter-img-1) 74% 43% / min(64vw, 720px) auto no-repeat,
      var(--chapter-img-2) 98% 64% / min(48vw, 560px) auto no-repeat;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium::after{
    inset: clamp(72px, 9vw, 110px) clamp(28px, 7vw, 84px) auto;
    height: clamp(260px, 34vh, 380px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical{
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-rows: repeat(12, minmax(36px, 1fr));
    padding: clamp(48px, 5vw, 76px) clamp(34px, 5vw, 70px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterIntro{
    grid-column: 3 / span 8;
    grid-row: 2 / span 3;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody{
    grid-column: 2 / span 10;
    grid-row: 6 / span 6;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia{
    grid-column: 1 / -1;
    grid-row: 1 / -1;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-rows: repeat(10, minmax(36px, 1fr));
    min-height: 0;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(1){
    grid-column: 4 / span 5;
    grid-row: 1 / span 5;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(2){
    grid-column: 7 / span 5;
    grid-row: 6 / span 3;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(3){
    grid-column: 1 / span 5;
    grid-row: 5 / span 5;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(4){
    grid-column: 8 / span 5;
    grid-row: 5 / span 6;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterNote{
    grid-column: 1 / span 1;
    grid-row: 6 / span 5;
    transform: translateX(clamp(-44px, -3vw, -22px)) rotate(180deg);
  }
}

@media (max-width: 1100px){
  .workShell[data-work="diffractive-flora"] .workComposite.flora-motion-register{
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .workShell[data-work="diffractive-flora"] .flora-register-video{
    grid-column: 1 / span 3;
  }

  .workShell[data-work="diffractive-flora"] .flora-register-negative{
    grid-column: 3 / span 3;
  }

  .workShell[data-work="diffractive-flora"] .flora-register-copy{
    grid-column: 4 / -1;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-emergence-section{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .workShell[data-work="diffractive-flora"] .flora-emergence-field{
    grid-column: 2;
    grid-row: 1;
  }

  .workShell[data-work="diffractive-flora"] .flora-language-copy{
    grid-column: 1 / -1;
    grid-row: 2;
    columns: 2;
    column-gap: clamp(20px, 3vw, 42px);
  }

  .workShell[data-work="diffractive-flora"] .flora-language-copy .textLabel,
  .workShell[data-work="diffractive-flora"] .flora-language-copy .textBody{
    break-inside: avoid;
  }

  .workCompareGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumbGrid{
    --cols: 3;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .workHero{
    min-height: clamp(620px, 92svh, 820px);
  }

  .workShell[data-work="diffractive-flora"] .workHero img{
    height: clamp(640px, 92svh, 820px);
    object-position: 44% 42%;
  }

  .workShell[data-work="diffractive-flora"] .workHeroOverlay{
    grid-template-columns: 1fr;
    padding: 112px 24px 72px;
  }

  .workShell[data-work="diffractive-flora"] .workHeroOverlay .heroCopy{
    max-width: 100%;
  }

  .workShell[data-work="diffractive-flora"] .workHeroOverlay .heroTitle{
    max-width: 100%;
    font-size: clamp(22px, 6.6vw, 58px);
    line-height: 0.94;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
  }

  .workShell[data-work="diffractive-flora"] .workHeroOverlay .heroAside{
    justify-self: start;
    max-width: 28ch;
    margin: 0;
  }

  .workShell[data-work="diffractive-flora"] .workHeroGhost{
    top: auto;
    bottom: 128px;
    right: 18px;
    font-size: clamp(72px, 26vw, 128px);
  }

  .workShell[data-work="diffractive-flora"] .workHeader{
    width: min(92vw, 720px);
    grid-template-columns: 1fr;
    margin-top: clamp(-42px, -5vh, -58px);
  }

  .workShell[data-work="diffractive-flora"] .workLead{
    font-size: clamp(30px, 8vw, 54px);
  }

  .workShell[data-work="diffractive-flora"] .workLead .lead-line.is-offset,
  .workShell[data-work="diffractive-flora"] .workLead .lead-line.is-tail{
    margin-left: 0;
  }

  .workShell[data-work="diffractive-flora"] .flora-opening{
    width: min(92vw, 720px);
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .flora-opening .textLabel,
  .workShell[data-work="diffractive-flora"] .flora-opening .textBody{
    grid-column: 1;
  }

  .workShell[data-work="diffractive-flora"] .flora-opening-strip{
    width: min(92vw, 720px);
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .flora-opening-strip .workStrip__item{
    transform: none !important;
  }

  .workConstellationBlock,
  .workCompareBlock,
  .workShell[data-work="diffractive-flora"] .flora-statement-landing,
  .workShell[data-work="diffractive-flora"] .workComposite.flora-motion-register,
  .workShell[data-work="diffractive-flora"] .workComposite.flora-apparatus-section,
  .workShell[data-work="diffractive-flora"] .workComposite.flora-emergence-section,
  .workShell[data-work="diffractive-flora"] .flora-specimen-field,
  .workShell[data-work="diffractive-flora"] .flora-temporal-spread,
  .workShell[data-work="diffractive-flora"] .workComposite.flora-primary-film-section,
  .workShell[data-work="diffractive-flora"] .flora-process-spread,
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    width: min(92vw, 720px);
    max-width: min(92vw, 720px);
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-statement-landing{
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    padding: clamp(20px, 6vw, 34px);
  }

  .workShell[data-work="diffractive-flora"] .flora-statement-copy,
  .workShell[data-work="diffractive-flora"] .flora-statement-specimen,
  .workShell[data-work="diffractive-flora"] .flora-statement-vortex,
  .workShell[data-work="diffractive-flora"] .flora-statement-index{
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    justify-self: stretch;
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-statement-copy .textTitle{
    max-width: 12ch;
    font-size: clamp(38px, 12vw, 72px);
  }

  .workShell[data-work="diffractive-flora"] .flora-statement-specimen{
    opacity: 0.9;
    mix-blend-mode: normal;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-apparatus-section{
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .flora-apparatus-tall,
  .workShell[data-work="diffractive-flora"] .flora-apparatus-copy,
  .workShell[data-work="diffractive-flora"] .flora-apparatus-wide{
    grid-column: 1;
    grid-row: auto;
  }

  .workShell[data-work="diffractive-flora"] .flora-apparatus-tall img{
    min-height: 0;
    aspect-ratio: 4 / 5;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-motion-register{
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .workShell[data-work="diffractive-flora"] .flora-register-video,
  .workShell[data-work="diffractive-flora"] .flora-register-negative,
  .workShell[data-work="diffractive-flora"] .flora-register-copy{
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-register-video video{
    min-height: 0;
    height: auto;
    aspect-ratio: 4 / 5;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-process-index{
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    min-height: clamp(1240px, 178svh, 1680px);
    padding: clamp(18px, 4vw, 42px) clamp(18px, 6vw, 42px) clamp(92px, 16vw, 132px);
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-image{
    position: absolute;
    inset: clamp(-58px, -8vw, -18px) -58vw clamp(-84px, -10vw, -28px) -32vw;
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-image img{
    min-height: 0;
    object-position: 55% 51%;
    transform: scale(1.42) translate(18%, -1%);
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy{
    grid-column: 1 / -1;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    grid-template-rows: auto auto minmax(620px, 1fr) auto auto;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textLabel{
    grid-column: 1 / span 5;
    margin-top: clamp(28px, 7vw, 58px);
    font-size: clamp(10px, 2.6vw, 13px);
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textTitle{
    grid-column: 1 / -1;
    grid-row: 2 / span 2;
    margin-top: clamp(16px, 4vw, 42px);
    font-size: clamp(88px, 22.5vw, 172px);
    line-height: 0.64;
    max-width: 7.3ch;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy::after{
    font-size: clamp(210px, 48vw, 380px);
    left: clamp(-18px, -2vw, 16px);
    bottom: -0.1em;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody{
    font-size: clamp(11px, 2.75vw, 14px);
    line-height: 1.68;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:first-of-type{
    grid-column: 1 / span 3;
    grid-row: 4;
    max-width: 24ch;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(2){
    grid-column: 4 / span 3;
    grid-row: 4;
    max-width: 24ch;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(3){
    grid-column: 1 / -1;
    grid-row: 5;
    justify-self: stretch;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-detail{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-primary-film-section{
    grid-template-columns: 1fr;
    gap: clamp(16px, 5vw, 28px);
    padding-top: clamp(18px, 5vw, 28px);
  }

  .workShell[data-work="diffractive-flora"] .flora-primary-film{
    width: min(440px, 100%);
    justify-self: start;
  }

  .workShell[data-work="diffractive-flora"] .flora-primary-film video{
    max-height: none;
    aspect-ratio: 4 / 5;
  }

  .workShell[data-work="diffractive-flora"] .flora-primary-film-copy{
    max-width: 42ch;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section{
    width: min(92vw, 720px);
    margin: 0 auto;
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    overflow: visible;
  }

  .workShell[data-work="diffractive-flora"] .flora-gesture-copy,
  .workShell[data-work="diffractive-flora"] .flora-gesture-main,
  .workShell[data-work="diffractive-flora"] .flora-gesture-inset{
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-gesture-main img{
    height: auto;
    aspect-ratio: 4 / 5;
  }

  .workShell[data-work="diffractive-flora"] .flora-trace-plate{
    width: 100vw;
  }

  .workShell[data-work="diffractive-flora"] .flora-temporal-spread,
  .workShell[data-work="diffractive-flora"] .workComposite.flora-emergence-section{
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .flora-language-copy{
    grid-column: auto;
    columns: auto;
  }

  .workShell[data-work="diffractive-flora"] .flora-emergence-copy,
  .workShell[data-work="diffractive-flora"] .flora-emergence-field,
  .workShell[data-work="diffractive-flora"] .flora-language-copy{
    grid-column: 1;
    grid-row: auto;
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-emergence-field img{
    min-height: 0;
    aspect-ratio: 4 / 5;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation{
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-top: 0;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationMap{
    width: 100vw;
    min-height: clamp(720px, 100svh, 920px);
    display: block;
    padding: 0;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationMap::before,
  .workShell[data-work="diffractive-flora"] .workConstellationMap::after{
    content: "";
  }

  .workShell[data-work="diffractive-flora"] .workConstellationMap::before{
    inset: clamp(78px, 14vw, 112px) clamp(22px, 6vw, 56px) clamp(54px, 10vw, 82px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationBackdrop img{
    transform: scale(1.34);
    object-position: 52% 46%;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationMapTop{
    inset: clamp(82px, 14vw, 112px) clamp(20px, 5vw, 40px) auto;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 8px;
    text-align: center;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationMapLabel,
  .workShell[data-work="diffractive-flora"] .workConstellationMapLabel.is-right{
    justify-self: center;
    font-size: 12px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationMapTitle{
    max-width: 13ch;
    font-size: clamp(30px, 9vw, 48px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChaptersLabel{
    left: clamp(22px, 6vw, 42px);
    top: 52%;
    font-size: 13px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationNode,
  .workShell[data-work="diffractive-flora"] .workConstellationNode.is-active{
    position: absolute;
    left: var(--node-x);
    top: var(--node-y);
    width: auto;
    max-width: 38vw;
    grid-template-columns: 12px minmax(86px, 1fr);
    gap: 4px 8px;
    transform: translate(-50%, -50%);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationNode:hover,
  .workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible{
    transform: translate(-50%, -50%) scale(1.08);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPin{
    width: 10px;
    height: 10px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationIndex{
    max-width: 13ch;
    font-size: clamp(11px, 3.1vw, 16px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationTitle{
    max-width: 12ch;
    font-size: clamp(8px, 2vw, 10px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreviewFigure{
    min-width: 88px;
    min-height: 96px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-wide .is-fragment-1{
    left: 8vw;
    bottom: 12vh;
    width: 34vw;
    height: 20vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-wide .is-fragment-2{
    left: 47vw;
    top: 28vh;
    width: 28vw;
    height: 16vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-tall .is-fragment-1{
    right: 8vw;
    top: 22vh;
    width: 35vw;
    height: 16vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-tall .is-fragment-2{
    left: 30vw;
    bottom: 13vh;
    width: 28vw;
    height: 20vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-drift .is-fragment-1{
    left: 15vw;
    top: 19vh;
    width: 25vw;
    height: 18vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-drift .is-fragment-2{
    right: 8vw;
    bottom: 13vh;
    width: 38vw;
    height: 16vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-archive .is-fragment-1{
    right: 12vw;
    top: 26vh;
    width: 26vw;
    height: 14vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-archive .is-fragment-2{
    right: 18vw;
    top: 46vh;
    width: 34vw;
    height: 14vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationTape{
    font-size: clamp(12px, 4.2vw, 18px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-wide .workConstellationTape,
  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-tall .workConstellationTape,
  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-drift .workConstellationTape,
  .workShell[data-work="diffractive-flora"] .workConstellationPreview.is-archive .workConstellationTape{
    right: 8vw;
    left: auto;
    top: auto;
    bottom: 26vh;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapters{
    width: 100vw;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-tall,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-drift,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-archive{
    min-height: 100svh;
    grid-template-columns: 1fr;
    gap: clamp(22px, 7vw, 42px);
    padding: clamp(72px, 14vw, 110px) clamp(20px, 6vw, 42px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium{
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-tall .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-drift .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-drift .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-archive .workConstellationChapterIntro{
    grid-column: 1;
    grid-row: auto;
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapterTitle,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-tall .workConstellationChapterTitle,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterTitle{
    max-width: 11ch;
    font-size: clamp(48px, 17vw, 86px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-tall .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.is-archive .workConstellationChapterMedia{
    min-height: clamp(380px, 60vh, 560px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterMedia{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(170px, 1fr));
    min-height: clamp(420px, 68vh, 640px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(1),
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterFigure:nth-child(1){
    grid-column: 1 / span 1;
    grid-row: 1 / span 1;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(2),
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-process .workConstellationChapterFigure:nth-child(2){
    grid-column: 2 / span 1;
    grid-row: 2 / span 1;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-herbarium .workConstellationChapterMedia::after{
    left: 2%;
    bottom: 6%;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical{
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(500px, 62vh) auto auto;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterIntro{
    grid-column: 1;
    grid-row: 1;
    max-width: min(66ch, 100%);
    justify-self: center;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterMedia{
    grid-column: 1;
    grid-row: 2;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    grid-template-rows: repeat(7, minmax(48px, 1fr));
    min-height: clamp(500px, 62vh, 700px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(1){
    grid-column: 2 / span 3;
    grid-row: 1 / span 3;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(2){
    grid-column: 3 / span 4;
    grid-row: 4 / span 2;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(3){
    grid-column: 1 / span 3;
    grid-row: 3 / span 4;
    transform: translateY(2%);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterFigure:nth-child(4){
    grid-column: 3 / span 4;
    grid-row: 4 / span 4;
    transform: translate(4%, 10%);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody{
    grid-column: 1;
    grid-row: 3;
    max-width: min(58ch, 100%);
    justify-self: start;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody p,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterBody p + p{
    grid-column: 1 / -1;
    margin: 0;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-technical .workConstellationChapterNote{
    grid-column: 1;
    grid-row: 4;
    justify-self: center;
    writing-mode: horizontal-tb;
    transform: none;
    font-size: clamp(16px, 5vw, 26px);
  }

  .workShell[data-work="diffractive-flora"] .flora-process-spread{
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .flora-motion-left,
  .workShell[data-work="diffractive-flora"] .flora-motion-column,
  .workShell[data-work="diffractive-flora"] .flora-motion-ascii,
  .workShell[data-work="diffractive-flora"] .flora-motion-right,
  .workShell[data-work="diffractive-flora"] .flora-motion-vortex,
  .workShell[data-work="diffractive-flora"] .flora-motion-gif{
    width: min(420px, 92vw);
    justify-self: center;
  }
}

/* Chapter 02 connective field: deep-blue board, quieter copy stock, linked image nodes */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
  --print-blue-deep: #091a31;
  --print-blue-mid: #153654;
  --print-line: rgba(102, 157, 198, 0.78);
  background:
    radial-gradient(circle, rgba(219, 226, 223, 0.09) 0 0.55px, transparent 0.92px) 0 0 / 2.8px 2.8px,
    linear-gradient(rgba(34, 73, 103, 0.74), rgba(34, 73, 103, 0.74)) 0 0 / 100% 18% no-repeat,
    linear-gradient(rgba(222, 219, 202, 0.96), rgba(222, 219, 202, 0.96)) 0 65% / 46% 21% no-repeat,
    linear-gradient(rgba(19, 48, 75, 0.9), rgba(19, 48, 75, 0.9)) 75% 8% / 25% 22% no-repeat,
    linear-gradient(rgba(222, 219, 202, 0.1), rgba(222, 219, 202, 0.1)) 48% 48% / 18% 34% no-repeat,
    var(--print-blue-deep);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::before{
  background:
    repeating-linear-gradient(0deg, rgba(179, 203, 217, 0.06) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(179, 203, 217, 0.045) 0 1px, transparent 1px 7px),
    radial-gradient(ellipse at 14% 24%, rgba(0, 0, 0, 0.22), transparent 24%),
    radial-gradient(ellipse at 78% 74%, rgba(104, 157, 194, 0.11), transparent 22%),
    linear-gradient(90deg, transparent 0 5.8%, rgba(126, 166, 193, 0.58) 5.8% 5.9%, transparent 5.9% 94%, rgba(126, 166, 193, 0.42) 94% 94.1%, transparent 94.1%),
    linear-gradient(180deg, transparent 0 9%, rgba(126, 166, 193, 0.48) 9% 9.1%, transparent 9.1% 90%, rgba(126, 166, 193, 0.38) 90% 90.1%, transparent 90.1%);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::after{
  background:
    radial-gradient(circle at 70% 31%, transparent 0 22%, rgba(112, 162, 197, 0.72) 22.05% 22.16%, transparent 22.26%),
    radial-gradient(circle at 32% 75%, transparent 0 18%, rgba(112, 162, 197, 0.48) 18.05% 18.16%, transparent 18.26%),
    linear-gradient(90deg, transparent 0 68%, rgba(112, 162, 197, 0.55) 68% 68.08%, transparent 68.18%),
    linear-gradient(180deg, transparent 0 34%, rgba(112, 162, 197, 0.48) 34% 34.08%, transparent 34.18%),
    linear-gradient(105deg, transparent 0 47%, rgba(112, 162, 197, 0.34) 47% 47.08%, transparent 47.18%);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  background:
    repeating-linear-gradient(-1deg, transparent 0 13px, rgba(9, 26, 49, 0.025) 13px 14px),
    #e5e0d0;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody::after{
  opacity: 0.2;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  max-width: 37ch;
  color: rgba(6, 20, 37, 0.93);
  font-size: clamp(15px, 1.18vw, 19px);
  line-height: 1.58;
  text-shadow: 0 0 0.01px currentColor;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  min-height: clamp(980px, 101vw, 1460px);
  background:
    radial-gradient(circle, rgba(204, 219, 224, 0.09) 0 0.55px, transparent 0.95px) 0 0 / 2.6px 2.6px,
    linear-gradient(rgba(222, 219, 202, 0.88), rgba(222, 219, 202, 0.88)) 4% 76% / 72% 24% no-repeat,
    linear-gradient(rgba(35, 76, 106, 0.58), rgba(35, 76, 106, 0.58)) 0 0 / 100% 18% no-repeat,
    var(--print-blue-deep);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  z-index: 7;
  background:
    radial-gradient(circle at 17% 37%, #ee542f 0 3px, rgba(222, 219, 202, 0.95) 3.5px 5px, transparent 5.5px),
    radial-gradient(circle at 77% 20%, #ee542f 0 3px, rgba(222, 219, 202, 0.95) 3.5px 5px, transparent 5.5px),
    radial-gradient(circle at 42% 64%, #ee542f 0 3px, rgba(222, 219, 202, 0.95) 3.5px 5px, transparent 5.5px),
    radial-gradient(circle at 76% 82%, #ee542f 0 3px, rgba(222, 219, 202, 0.95) 3.5px 5px, transparent 5.5px),
    linear-gradient(var(--print-line), var(--print-line)) 17% 37% / 60% 1px no-repeat,
    linear-gradient(var(--print-line), var(--print-line)) 42% 64% / 34% 1px no-repeat,
    linear-gradient(var(--print-line), var(--print-line)) 77% 20% / 1px 62% no-repeat,
    linear-gradient(31deg, transparent 0 49.85%, var(--print-line) 49.92% 50.08%, transparent 50.15%),
    linear-gradient(119deg, transparent 0 49.85%, rgba(102, 157, 198, 0.55) 49.92% 50.08%, transparent 50.15%),
    linear-gradient(90deg, rgba(126, 166, 193, 0.34) 0 1px, transparent 1px) 0 0 / 14.285% 100%,
    linear-gradient(180deg, rgba(126, 166, 193, 0.3) 0 1px, transparent 1px) 0 0 / 100% 12.5%;
  opacity: 0.9;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  outline: 1px solid rgba(126, 166, 193, 0.3);
  outline-offset: 5px;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 26%;
  width: 55%;
  height: 20%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  right: 1%;
  top: 6%;
  width: 38%;
  height: 36%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: 19%;
  top: 50%;
  width: 46%;
  height: 31%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: auto;
  right: 0;
  bottom: 1%;
  width: 52%;
  height: 25%;
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
    max-width: 42ch;
    font-size: clamp(15px, 4vw, 18px);
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(700px, 145vw, 980px);
  }
}

/* Chapter 02 final ink plates: authoritative override */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  min-height: clamp(1120px, 108vw, 1580px);
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(187, 180, 159, 0.94), rgba(187, 180, 159, 0.94)) 0 64% / 74% 36% no-repeat,
    linear-gradient(rgba(15, 20, 22, 0.96), rgba(15, 20, 22, 0.96)) 0 0 / 100% 17% no-repeat,
    var(--board-navy);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate{
  opacity: 1;
  background: #080a09;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate::before{
  z-index: 5;
  background:
    radial-gradient(circle, rgba(222, 219, 202, 0.22) 0 0.5px, transparent 0.82px) 0 0 / 2.5px 2.5px,
    repeating-linear-gradient(0deg, transparent 0 4px, rgba(222, 219, 202, 0.045) 4px 5px);
  opacity: 0.42;
  mix-blend-mode: soft-light;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate img{
  opacity: 1;
  filter: grayscale(1) sepia(0.22) saturate(0.32) contrast(1.62) brightness(0.72);
  mix-blend-mode: normal;
  transform: scale(1.01);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: -3%;
  top: 38%;
  width: 55%;
  height: 24%;
  z-index: 9;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  left: 36%;
  right: auto;
  top: 2%;
  width: 30%;
  height: 39%;
  z-index: 3;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: auto;
  right: -3%;
  top: 32%;
  width: 47%;
  height: 36%;
  z-index: 8;
  background: #2c0b05;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3)::before{
  background:
    radial-gradient(circle, rgba(12, 9, 7, 0.42) 0 0.52px, transparent 0.84px) 0 0 / 2.4px 2.4px,
    linear-gradient(rgba(237, 69, 31, 0.8), rgba(237, 69, 31, 0.8));
  opacity: 0.88;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3) img{
  filter: grayscale(1) sepia(1) saturate(6.6) hue-rotate(325deg) contrast(1.66) brightness(0.7);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 6%;
  right: auto;
  bottom: -1%;
  width: 61%;
  height: 25%;
  z-index: 4;
  background: #090c0a;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4) img{
  filter: grayscale(1) sepia(0.3) saturate(0.42) contrast(1.72) brightness(0.68);
  mix-blend-mode: normal;
  object-position: center 42%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5){
  left: auto;
  right: 7%;
  top: 8%;
  width: 43%;
  height: 24%;
  z-index: 7;
  opacity: 1;
  background: #082e54;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5)::before{
  background:
    radial-gradient(circle, rgba(4, 15, 27, 0.46) 0 0.52px, transparent 0.84px) 0 0 / 2.45px 2.45px,
    linear-gradient(rgba(18, 91, 158, 0.9), rgba(18, 91, 158, 0.9));
  opacity: 0.94;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5) img{
  opacity: 0.96;
  filter: grayscale(1) sepia(1) saturate(6.8) hue-rotate(164deg) contrast(1.58) brightness(0.74);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(6){
  left: 41%;
  top: 66%;
  width: 42%;
  height: 18%;
  z-index: 6;
  opacity: 1;
  background: #111510;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(6) img{
  opacity: 1;
  filter: grayscale(1) sepia(0.55) saturate(0.45) contrast(1.62) brightness(0.7);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate:hover{
  opacity: 1;
  filter: none;
  transform: translateY(-6px);
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(900px, 194vw, 1220px);
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
    left: -5%;
    top: 37%;
    width: 59%;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5){
    right: 4%;
    top: 9%;
    width: 48%;
  }
}

/* Chapter 02 decisive ink-plate composition */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  min-height: clamp(1120px, 108vw, 1580px);
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(187, 180, 159, 0.94), rgba(187, 180, 159, 0.94)) 0 68% / 74% 32% no-repeat,
    linear-gradient(rgba(15, 20, 22, 0.96), rgba(15, 20, 22, 0.96)) 0 0 / 100% 17% no-repeat,
    var(--board-navy);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate{
  opacity: 1;
  background: #080a09;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate::before{
  z-index: 5;
  background:
    radial-gradient(circle, rgba(222, 219, 202, 0.22) 0 0.5px, transparent 0.82px) 0 0 / 2.5px 2.5px,
    repeating-linear-gradient(0deg, transparent 0 4px, rgba(222, 219, 202, 0.045) 4px 5px);
  opacity: 0.42;
  mix-blend-mode: soft-light;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate img{
  opacity: 1;
  filter: grayscale(1) sepia(0.22) saturate(0.32) contrast(1.62) brightness(0.72);
  mix-blend-mode: normal;
  transform: scale(1.01);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: -3%;
  top: 32%;
  width: 55%;
  height: 24%;
  z-index: 8;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  left: 36%;
  right: auto;
  top: 2%;
  width: 30%;
  height: 39%;
  z-index: 3;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: auto;
  right: -3%;
  top: 30%;
  width: 47%;
  height: 37%;
  z-index: 7;
  background: #2c0b05;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3)::before{
  background:
    radial-gradient(circle, rgba(12, 9, 7, 0.42) 0 0.52px, transparent 0.84px) 0 0 / 2.4px 2.4px,
    linear-gradient(rgba(237, 69, 31, 0.8), rgba(237, 69, 31, 0.8));
  opacity: 0.88;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3) img{
  filter: grayscale(1) sepia(1) saturate(6.6) hue-rotate(325deg) contrast(1.66) brightness(0.7);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 4%;
  right: auto;
  bottom: -1%;
  width: 64%;
  height: 26%;
  z-index: 4;
  background: #090c0a;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4) img{
  filter: grayscale(1) sepia(0.3) saturate(0.42) contrast(1.72) brightness(0.68);
  object-position: center 42%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5){
  left: auto;
  right: 7%;
  top: 8%;
  width: 43%;
  height: 24%;
  z-index: 6;
  opacity: 1;
  background: #0a3156;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5)::before{
  background:
    radial-gradient(circle, rgba(4, 15, 27, 0.46) 0 0.52px, transparent 0.84px) 0 0 / 2.45px 2.45px,
    repeating-linear-gradient(0deg, transparent 0 4px, rgba(218, 229, 225, 0.055) 4px 5px),
    linear-gradient(rgba(22, 91, 150, 0.86), rgba(22, 91, 150, 0.86));
  opacity: 0.92;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5) img{
  opacity: 0.94;
  filter: grayscale(1) sepia(1) saturate(6.8) hue-rotate(164deg) contrast(1.58) brightness(0.74);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(6){
  left: 40%;
  top: 61%;
  width: 42%;
  height: 20%;
  z-index: 5;
  opacity: 1;
  background: #111510;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(6) img{
  opacity: 1;
  filter: grayscale(1) sepia(0.55) saturate(0.45) contrast(1.62) brightness(0.7);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate:hover{
  opacity: 1;
  filter: none;
  transform: translateY(-6px);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate:hover img{
  opacity: 1;
  transform: scale(1.025);
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(900px, 194vw, 1220px);
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
    left: -5%;
    top: 31%;
    width: 59%;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5){
    right: 4%;
    top: 9%;
    width: 48%;
  }
}

/* Chapter 02 layered print passes and map-to-board transition */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-active-concept="2"] .workConstellationChapters{
  position: relative;
  z-index: 4;
  margin-top: clamp(-156px, -10vw, -96px);
  padding-top: clamp(138px, 10vw, 170px);
  background:
    linear-gradient(180deg, rgba(5, 7, 6, 0) 0%, rgba(5, 7, 6, 0.72) 34%, #050706 78%, #050706 100%);
  isolation: isolate;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-active-concept="2"] .workConstellationChapters::before{
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: clamp(190px, 17vw, 280px);
  pointer-events: none;
  background:
    radial-gradient(circle, rgba(191, 184, 161, 0.12) 0 0.55px, transparent 0.92px) 0 0 / 2.7px 2.7px,
    linear-gradient(90deg, transparent 0 8%, rgba(191, 184, 161, 0.2) 8% 8.06%, transparent 8.12% 67%, rgba(191, 184, 161, 0.14) 67% 67.06%, transparent 67.12%),
    linear-gradient(180deg, transparent 0 54%, rgba(191, 184, 161, 0.14) 54% 54.3%, transparent 54.6%),
    linear-gradient(180deg, rgba(5, 7, 6, 0.08), rgba(5, 7, 6, 0.96));
  opacity: 0.84;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-active-concept="2"] .workConstellationChapters::after{
  content: "";
  position: absolute;
  z-index: 0;
  top: clamp(22px, 2.5vw, 44px);
  left: 27%;
  width: 52%;
  height: clamp(126px, 13vw, 210px);
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(5, 7, 6, 0.15), rgba(5, 7, 6, 0.92)),
    url("../../images/Projecto 4_Diffractive Flora/_web/2025-09-19-0009 2.jpeg") center 52% / cover no-repeat;
  background-blend-mode: multiply;
  filter: grayscale(0.92) sepia(0.34) contrast(1.52) brightness(0.5);
  mix-blend-mode: screen;
  opacity: 0.24;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 18% 82%, transparent), linear-gradient(180deg, transparent, #000 20% 70%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 18% 82%, transparent), linear-gradient(180deg, transparent, #000 20% 70%, transparent);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
  margin-top: -1px;
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.55px, transparent 0.92px) 0 0 / 2.7px 2.7px,
    linear-gradient(rgba(15, 20, 22, 0.99), rgba(15, 20, 22, 0.99)) 0 0 / 100% 18% no-repeat,
    linear-gradient(rgba(187, 180, 159, 0.15), rgba(187, 180, 159, 0.15)) 0 66% / 46% 20% no-repeat,
    var(--board-navy);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  min-height: clamp(1120px, 108vw, 1580px);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  transition:
    opacity 360ms var(--ease),
    filter 360ms var(--ease),
    transform 520ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: -4%;
  top: 24%;
  width: 53%;
  height: 23%;
  z-index: 3;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  left: 39%;
  top: -2%;
  width: 29%;
  height: 48%;
  z-index: 4;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  right: -4%;
  top: 28%;
  width: 49%;
  height: 41%;
  z-index: 5;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 3%;
  bottom: -2%;
  width: 68%;
  height: 29%;
  z-index: 3;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5){
  left: 17%;
  top: 11%;
  width: 50%;
  height: 27%;
  z-index: 6;
  opacity: 0.43;
  background: transparent;
  mix-blend-mode: screen;
  transform: translate(-3%, 2%);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(6){
  left: 34%;
  top: 56%;
  width: 57%;
  height: 25%;
  z-index: 6;
  opacity: 0.64;
  background: transparent;
  mix-blend-mode: multiply;
  transform: translate(3%, -2%);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate::before{
  opacity: 0.34;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate::after{
  color: rgba(207, 203, 185, 0.64);
  background: rgba(5, 7, 6, 0.34);
  opacity: 0.58;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate img{
  opacity: 0.8;
  filter: grayscale(0.62) sepia(0.38) saturate(0.7) contrast(1.42) brightness(0.72);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(6) img{
  opacity: 0.72;
  filter: grayscale(0.9) sepia(0.48) saturate(0.34) contrast(1.72) brightness(0.62);
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1):hover ~ .workConstellationChapterFigure:nth-child(5),
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2):hover ~ .workConstellationChapterFigure:nth-child(5),
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3):hover ~ .workConstellationChapterFigure:nth-child(6),
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4):hover ~ .workConstellationChapterFigure:nth-child(6),
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure.is-overlay-plate:hover{
  opacity: 0.78;
  filter: saturate(1.18);
  transform: translate(0, 0) scale(1.025);
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-active-concept="2"] .workConstellationChapters{
    margin-top: -88px;
    padding-top: 86px;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-active-concept="2"] .workConstellationChapters::after{
    left: 18%;
    width: 68%;
    opacity: 0.2;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(860px, 188vw, 1180px);
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(5){
    left: 10%;
    top: 14%;
    width: 58%;
    height: 24%;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(6){
    left: 31%;
    top: 59%;
    width: 64%;
    height: 22%;
  }
}

/* Chapter 02 definitive reference-led print collage */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
  --ref-black: #050706;
  --ref-slate: #182126;
  --ref-paper: #bbb49f;
  --ref-paper-dark: #a9a28d;
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.55px, transparent 0.92px) 0 0 / 2.7px 2.7px,
    linear-gradient(rgba(25, 35, 40, 0.98), rgba(25, 35, 40, 0.98)) 0 0 / 100% 18% no-repeat,
    linear-gradient(rgba(187, 180, 159, 0.15), rgba(187, 180, 159, 0.15)) 0 66% / 46% 20% no-repeat,
    var(--ref-black);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::before{
  background:
    repeating-linear-gradient(0deg, rgba(214, 209, 190, 0.024) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(214, 209, 190, 0.016) 0 1px, transparent 1px 8px),
    radial-gradient(ellipse at 13% 24%, rgba(0, 0, 0, 0.34), transparent 25%),
    linear-gradient(90deg, transparent 0 5.8%, rgba(207, 203, 185, 0.2) 5.8% 5.86%, transparent 5.92% 94%, rgba(207, 203, 185, 0.16) 94% 94.06%, transparent 94.12%);
  opacity: 0.8;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::after{
  background:
    radial-gradient(circle at 68% 35%, transparent 0 23%, rgba(207, 203, 185, 0.34) 23.04% 23.12%, transparent 23.2%),
    radial-gradient(circle at 31% 75%, transparent 0 18%, rgba(207, 203, 185, 0.23) 18.04% 18.12%, transparent 18.2%),
    linear-gradient(90deg, transparent 0 68%, rgba(207, 203, 185, 0.2) 68% 68.06%, transparent 68.12%),
    linear-gradient(180deg, transparent 0 34%, rgba(207, 203, 185, 0.18) 34% 34.06%, transparent 34.12%);
  opacity: 0.68;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  background:
    radial-gradient(circle, rgba(28, 27, 23, 0.22) 0 0.55px, transparent 0.9px) 0 0 / 2.55px 2.55px,
    repeating-linear-gradient(2deg, transparent 0 9px, rgba(28, 27, 23, 0.035) 9px 10px),
    var(--ref-paper);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  background:
    radial-gradient(circle, rgba(28, 27, 23, 0.12) 0 0.48px, transparent 0.84px) 0 0 / 3.2px 3.2px,
    repeating-linear-gradient(-1deg, transparent 0 13px, rgba(28, 27, 23, 0.034) 13px 14px),
    var(--ref-paper-dark);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody::after{
  opacity: 0.25;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  color: rgba(16, 17, 15, 0.9);
  font-size: clamp(15px, 1.12vw, 18px);
  line-height: 1.56;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  min-height: clamp(980px, 101vw, 1460px);
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(187, 180, 159, 0.94), rgba(187, 180, 159, 0.94)) 0 72% / 72% 28% no-repeat,
    linear-gradient(rgba(25, 35, 40, 0.88), rgba(25, 35, 40, 0.88)) 0 0 / 100% 17% no-repeat,
    var(--ref-black);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  z-index: 7;
  background:
    linear-gradient(90deg, rgba(207, 203, 185, 0.18) 0 1px, transparent 1px) 0 0 / 20% 100%,
    linear-gradient(180deg, rgba(207, 203, 185, 0.16) 0 1px, transparent 1px) 0 0 / 100% 20%,
    radial-gradient(circle at 64% 34%, transparent 0 28%, rgba(207, 203, 185, 0.48) 28.04% 28.12%, transparent 28.2%),
    radial-gradient(circle at 31% 74%, transparent 0 18%, rgba(207, 203, 185, 0.32) 18.04% 18.12%, transparent 18.2%),
    linear-gradient(90deg, transparent 0 50%, rgba(207, 203, 185, 0.3) 50% 50.07%, transparent 50.14%),
    linear-gradient(180deg, transparent 0 49%, rgba(207, 203, 185, 0.27) 49% 49.07%, transparent 49.14%);
  opacity: 0.7;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::after{
  border: 0;
  color: rgba(207, 203, 185, 0.42);
  background: transparent;
  font: 700 8px/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0.05em;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  outline: 0;
  background: var(--ref-black);
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  opacity: 0.9;
  filter: grayscale(0.92) sepia(0.42) saturate(0.3) contrast(1.48) brightness(0.68);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]::before{
  background:
    radial-gradient(circle, rgba(11, 10, 8, 0.6) 0 0.55px, transparent 0.86px) 0 0 / 2.25px 2.25px,
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(207, 203, 185, 0.06) 3px 4px),
    linear-gradient(rgba(232, 77, 39, 0.78), rgba(232, 77, 39, 0.78));
  opacity: 0.88;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img{
  opacity: 0.86;
  filter: grayscale(1) sepia(1) saturate(7) hue-rotate(329deg) contrast(1.55) brightness(0.72);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 25%;
  width: 48%;
  height: 22%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  left: 34%;
  right: auto;
  top: 0;
  width: 34%;
  height: 42%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: auto;
  right: 0;
  top: 29%;
  width: 48%;
  height: 38%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 0;
  right: auto;
  bottom: 0;
  width: 70%;
  height: 27%;
}

/* Chapter 02 reference reinterpretation: aged floral print collage */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
  --print-black: #060807;
  --print-slate: #172126;
  --print-stock: #bdb6a1;
  --print-stock-dark: #aaa38e;
  --print-hairline: rgba(207, 203, 185, 0.44);
  background:
    radial-gradient(circle, rgba(218, 213, 193, 0.075) 0 0.55px, transparent 0.92px) 0 0 / 2.7px 2.7px,
    linear-gradient(rgba(27, 38, 43, 0.98), rgba(27, 38, 43, 0.98)) 0 0 / 100% 18% no-repeat,
    linear-gradient(rgba(189, 182, 161, 0.18), rgba(189, 182, 161, 0.18)) 0 66% / 46% 20% no-repeat,
    var(--print-black);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::before{
  background:
    repeating-linear-gradient(0deg, rgba(218, 213, 193, 0.025) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(218, 213, 193, 0.018) 0 1px, transparent 1px 8px),
    radial-gradient(ellipse at 13% 24%, rgba(0, 0, 0, 0.32), transparent 25%),
    radial-gradient(ellipse at 81% 72%, rgba(189, 182, 161, 0.06), transparent 24%),
    linear-gradient(90deg, transparent 0 5.8%, rgba(207, 203, 185, 0.22) 5.8% 5.86%, transparent 5.92% 94%, rgba(207, 203, 185, 0.18) 94% 94.06%, transparent 94.12%),
    linear-gradient(180deg, transparent 0 9%, rgba(207, 203, 185, 0.18) 9% 9.06%, transparent 9.12% 90%, rgba(207, 203, 185, 0.16) 90% 90.06%, transparent 90.12%);
  opacity: 0.8;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::after{
  background:
    radial-gradient(circle at 68% 35%, transparent 0 23%, rgba(207, 203, 185, 0.36) 23.04% 23.12%, transparent 23.2%),
    radial-gradient(circle at 31% 75%, transparent 0 18%, rgba(207, 203, 185, 0.25) 18.04% 18.12%, transparent 18.2%),
    linear-gradient(90deg, transparent 0 68%, rgba(207, 203, 185, 0.23) 68% 68.06%, transparent 68.12%),
    linear-gradient(180deg, transparent 0 34%, rgba(207, 203, 185, 0.2) 34% 34.06%, transparent 34.12%);
  opacity: 0.72;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  background:
    radial-gradient(circle, rgba(30, 29, 25, 0.23) 0 0.55px, transparent 0.9px) 0 0 / 2.55px 2.55px,
    repeating-linear-gradient(2deg, transparent 0 9px, rgba(31, 29, 24, 0.035) 9px 10px),
    var(--print-stock);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  background:
    radial-gradient(circle, rgba(28, 27, 23, 0.13) 0 0.48px, transparent 0.84px) 0 0 / 3.2px 3.2px,
    repeating-linear-gradient(-1deg, transparent 0 13px, rgba(28, 27, 23, 0.035) 13px 14px),
    var(--print-stock-dark);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody::after{
  opacity: 0.28;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  color: rgba(17, 18, 16, 0.88);
  font-size: clamp(15px, 1.12vw, 18px);
  line-height: 1.56;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  background:
    radial-gradient(circle, rgba(218, 213, 193, 0.07) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(189, 182, 161, 0.94), rgba(189, 182, 161, 0.94)) 0 72% / 72% 28% no-repeat,
    linear-gradient(rgba(27, 38, 43, 0.86), rgba(27, 38, 43, 0.86)) 0 0 / 100% 17% no-repeat,
    var(--print-black);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  z-index: 7;
  background:
    linear-gradient(90deg, rgba(207, 203, 185, 0.2) 0 1px, transparent 1px) 0 0 / 20% 100%,
    linear-gradient(180deg, rgba(207, 203, 185, 0.18) 0 1px, transparent 1px) 0 0 / 100% 20%,
    radial-gradient(circle at 64% 34%, transparent 0 28%, rgba(207, 203, 185, 0.5) 28.04% 28.12%, transparent 28.2%),
    radial-gradient(circle at 31% 74%, transparent 0 18%, rgba(207, 203, 185, 0.34) 18.04% 18.12%, transparent 18.2%),
    linear-gradient(90deg, transparent 0 50%, rgba(207, 203, 185, 0.38) 50% 50.08%, transparent 50.16%),
    linear-gradient(180deg, transparent 0 49%, rgba(207, 203, 185, 0.32) 49% 49.08%, transparent 49.16%);
  opacity: 0.72;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::after{
  border: 0;
  color: rgba(207, 203, 185, 0.46);
  background: transparent;
  font-family: "Courier New", ui-monospace, monospace;
  font-size: 8px;
  letter-spacing: 0.05em;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  outline: 0;
  background: var(--print-black);
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before{
  background:
    radial-gradient(circle, rgba(13, 13, 11, 0.62) 0 0.55px, transparent 0.86px) 0 0 / 2.3px 2.3px,
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(207, 203, 185, 0.065) 3px 4px),
    linear-gradient(110deg, rgba(207, 203, 185, 0.12), transparent 30%, rgba(13, 13, 11, 0.16) 78%, transparent);
  opacity: 0.72;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  opacity: 0.9;
  filter: grayscale(0.92) sepia(0.42) saturate(0.3) contrast(1.48) brightness(0.68);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]::before{
  background:
    radial-gradient(circle, rgba(11, 10, 8, 0.6) 0 0.55px, transparent 0.86px) 0 0 / 2.25px 2.25px,
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(207, 203, 185, 0.06) 3px 4px),
    linear-gradient(rgba(232, 77, 39, 0.78), rgba(232, 77, 39, 0.78));
  opacity: 0.88;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img{
  opacity: 0.86;
  filter: grayscale(1) sepia(1) saturate(7) hue-rotate(329deg) contrast(1.55) brightness(0.72);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 25%;
  width: 48%;
  height: 22%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  left: 34%;
  right: auto;
  top: 0;
  width: 34%;
  height: 42%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: auto;
  right: 0;
  top: 29%;
  width: 48%;
  height: 38%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 0;
  right: auto;
  bottom: 0;
  width: 70%;
  height: 27%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img{
  filter: grayscale(1) sepia(1) saturate(7) hue-rotate(326deg) contrast(1.48) brightness(0.82);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]:hover img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]:focus-within img{
  filter: grayscale(0) sepia(0.12) saturate(1.45) contrast(1.42) brightness(0.86);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]::before{
  background:
    radial-gradient(circle, rgba(233, 231, 216, 0.2) 0 0.7px, transparent 1.2px) 0 0 / 3px 3px,
    linear-gradient(rgba(255, 75, 35, 0.78), rgba(255, 75, 35, 0.78));
  opacity: 0.9;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]:hover::before,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]:focus-within::before{
  background:
    radial-gradient(circle, rgba(233, 231, 216, 0.2) 0 0.7px, transparent 1.2px) 0 0 / 3px 3px,
    linear-gradient(rgba(17, 20, 19, 0.12), rgba(17, 20, 19, 0.12));
  opacity: 0.72;
  mix-blend-mode: screen;
}

@media (max-width: 640px){
  .workShell[data-work="diffractive-flora"] .workTopActions,
  .workShell[data-work="diffractive-flora"] .workTopNav{
    top: 12px;
  }

  .workShell[data-work="diffractive-flora"] .workTopNav{
    right: 12px;
    gap: 8px;
  }

  .workShell[data-work="diffractive-flora"] .workTopActions{
    left: 12px;
    width: auto;
    max-width: calc(100vw - 24px);
  }

  .workShell[data-work="diffractive-flora"] .workTopActions .close,
  .workShell[data-work="diffractive-flora"] .workTopNav button{
    padding: 9px 10px;
    font-size: 10px;
    letter-spacing: 0.2em;
  }

  .workShell[data-work="diffractive-flora"] .workHeroOverlay{
    padding-inline: 18px;
  }

  .workShell[data-work="diffractive-flora"] .workHeroOverlay .heroKicker,
  .workShell[data-work="diffractive-flora"] .workHeroOverlay .heroMeta,
  .workShell[data-work="diffractive-flora"] .workHeroOverlay .heroAside{
    letter-spacing: 0.16em;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationNode,
  .workShell[data-work="diffractive-flora"] .workConstellationNode.is-active{
    max-width: 44vw;
    grid-template-columns: 10px minmax(72px, 1fr);
    gap: 3px 7px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationPin{
    width: 9px;
    height: 9px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationIndex{
    max-width: 11ch;
    font-size: 10px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationTitle{
    font-size: 8px;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationBlock .blockHeader,
  .workShell[data-work="diffractive-flora"] .workCompareBlock .blockHeader,
  .workShell[data-work="diffractive-flora"] .flora-specimen-field .blockHeader{
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationBlock .blockMeta,
  .workShell[data-work="diffractive-flora"] .workCompareBlock .blockMeta,
  .workShell[data-work="diffractive-flora"] .flora-specimen-field .blockMeta{
    justify-self: start;
    text-align: left;
  }

  .workCompareGrid{
    grid-template-columns: 1fr;
  }

  .workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumbGrid{
    --cols: 1;
  }

  .workShell[data-work="diffractive-flora"] .flora-specimen-field .workThumb{
    transform: none !important;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary{
    grid-template-columns: 1fr;
  }
}

/* Final print-plate direction: intentionally overrides the earlier digital signal-board pass. */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
  gap: 0;
  color: #e9e7d8;
  background:
    radial-gradient(circle, rgba(233, 231, 216, 0.09) 0 0.75px, transparent 1px) 0 0 / 3px 3px,
    linear-gradient(90deg, rgba(233, 231, 216, 0.13) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(233, 231, 216, 0.11) 0 1px, transparent 1px) 0 0 / 100% 10%,
    linear-gradient(180deg, #4c5960 0 15%, #111413 15% 82%, #090b0a 82%);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::before{
  z-index: 1;
  background:
    linear-gradient(90deg, transparent 0 6%, rgba(233, 231, 216, 0.46) 6% 6.12%, transparent 6.12% 94%, rgba(233, 231, 216, 0.46) 94% 94.12%, transparent 94.12%),
    linear-gradient(180deg, transparent 0 11%, rgba(233, 231, 216, 0.38) 11% 11.12%, transparent 11.12% 88%, rgba(233, 231, 216, 0.38) 88% 88.12%, transparent 88.12%),
    radial-gradient(circle, rgba(233, 231, 216, 0.16) 0 0.7px, transparent 1.2px) 0 0 / 4px 4px;
  filter: none;
  opacity: 0.68;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::after{
  z-index: 4;
  background:
    radial-gradient(circle at 63% 37%, transparent 0 25%, rgba(233, 231, 216, 0.7) 25.08% 25.18%, transparent 25.28%),
    radial-gradient(circle at 38% 72%, transparent 0 17%, rgba(233, 231, 216, 0.48) 17.08% 17.2%, transparent 17.3%),
    linear-gradient(90deg, transparent 0 63%, rgba(233, 231, 216, 0.58) 63% 63.1%, transparent 63.2%),
    linear-gradient(180deg, transparent 0 37%, rgba(233, 231, 216, 0.52) 37% 37.1%, transparent 37.2%);
  opacity: 0.72;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  grid-column: 1 / span 5;
  grid-row: 1;
  z-index: 7;
  max-width: none;
  min-height: clamp(330px, 34vw, 510px);
  padding: clamp(22px, 2.6vw, 44px);
  color: #111413;
  background:
    radial-gradient(circle, rgba(17, 20, 19, 0.12) 0 0.7px, transparent 1.1px) 0 0 / 3px 3px,
    #e9e7d8;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro::before{
  content: "02 / DIFFRACTION / RELATION";
  padding: 0 0 9px;
  border-bottom: 1px solid rgba(17, 20, 19, 0.54);
  color: rgba(17, 20, 19, 0.72);
  background: transparent;
  font: 700 9px/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0.09em;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIndex{
  color: #ff6540;
  font-family: "Courier New", ui-monospace, monospace;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle{
  color: #111413;
  font-size: clamp(58px, 6.8vw, 124px);
  line-height: 0.82;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterLead{
  max-width: 31ch;
  color: #111413;
  font-size: clamp(18px, 1.8vw, 30px);
  line-height: 1.16;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  grid-column: 1 / span 4;
  grid-row: 2;
  z-index: 7;
  max-width: none;
  min-height: clamp(500px, 48vw, 720px);
  padding: clamp(24px, 2.8vw, 46px);
  background:
    radial-gradient(circle, rgba(17, 20, 19, 0.12) 0 0.7px, transparent 1.1px) 0 0 / 3px 3px,
    #e9e7d8;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  color: rgba(17, 20, 19, 0.76);
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 1.42;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  grid-column: 4 / -1;
  grid-row: 1 / span 3;
  z-index: 3;
  min-height: clamp(850px, 92vw, 1280px);
  margin: clamp(42px, 4vw, 68px) 0 0;
  border: 0;
  background:
    linear-gradient(90deg, rgba(233, 231, 216, 0.08) 0 28%, transparent 28% 54%, rgba(233, 231, 216, 0.07) 54% 100%),
    #111413;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  inset: 0;
  z-index: 6;
  background:
    linear-gradient(90deg, rgba(233, 231, 216, 0.48) 0 1px, transparent 1px) 0 0 / 16.666% 100%,
    linear-gradient(180deg, rgba(233, 231, 216, 0.42) 0 1px, transparent 1px) 0 0 / 100% 14.285%,
    radial-gradient(circle at 62% 33%, transparent 0 27%, rgba(233, 231, 216, 0.78) 27.08% 27.2%, transparent 27.3%),
    radial-gradient(circle at 31% 72%, transparent 0 18%, rgba(233, 231, 216, 0.54) 18.08% 18.2%, transparent 18.3%);
  filter: none;
  transform: none;
  opacity: 0.62;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::after{
  content: "N 42 / FIELD 02 / RELATION";
  inset: auto 12px 12px auto;
  border: 0;
  color: rgba(233, 231, 216, 0.72);
  background: transparent;
  font-family: "Courier New", ui-monospace, monospace;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  border: 0;
  background: #e9e7d8;
  box-shadow: none;
  filter: none;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before{
  z-index: 4;
  background:
    radial-gradient(circle, rgba(233, 231, 216, 0.2) 0 0.7px, transparent 1.2px) 0 0 / 3px 3px,
    linear-gradient(rgba(17, 20, 19, 0.12), rgba(17, 20, 19, 0.12));
  opacity: 0.72;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::after{
  inset: auto 6px 5px 6px;
  padding: 3px 5px;
  border: 0;
  color: rgba(233, 231, 216, 0.74);
  background: rgba(17, 20, 19, 0.58);
  font: 700 8px/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0.06em;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  filter: grayscale(0.68) sepia(0.22) saturate(0.62) contrast(1.38) brightness(0.78);
  opacity: 1;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"],
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within{
  border: 0;
  box-shadow: none;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within img{
  filter: grayscale(0) sepia(0.12) saturate(1.45) contrast(1.42) brightness(0.86);
  transform: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 16%;
  width: 45%;
  height: 25%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  right: 0;
  top: 31%;
  width: 58%;
  height: 35%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: 0;
  top: 41%;
  width: 42%;
  height: 29%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 0;
  right: auto;
  bottom: 0;
  width: 77%;
  height: 30%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
  grid-column: 1 / span 4;
  grid-row: 3;
  z-index: 8;
  width: 100%;
  border-top: 1px solid rgba(233, 231, 216, 0.62);
  color: rgba(233, 231, 216, 0.74);
  font-family: "Courier New", ui-monospace, monospace;
  font-size: 10px;
}

/* Chapter 02: distressed modular print plate */
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive{
  --plate-ink: #111413;
  --plate-gray: #4b5559;
  --plate-paper: #e9e7d8;
  --plate-blue: #668da0;
  --plate-orange: #ff6540;
  gap: 0;
  padding: clamp(60px, 6.5vw, 106px) clamp(28px, 5vw, 88px) clamp(70px, 7vw, 116px);
  background:
    radial-gradient(circle, rgba(233, 231, 216, 0.09) 0 0.75px, transparent 1px) 0 0 / 3px 3px,
    linear-gradient(90deg, rgba(233, 231, 216, 0.13) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(233, 231, 216, 0.11) 0 1px, transparent 1px) 0 0 / 100% 10%,
    linear-gradient(180deg, #4c5960 0 15%, #111413 15% 82%, #090b0a 82%);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive::before{
  z-index: 1;
  background:
    linear-gradient(90deg, transparent 0 6%, rgba(233, 231, 216, 0.46) 6% 6.12%, transparent 6.12% 94%, rgba(233, 231, 216, 0.46) 94% 94.12%, transparent 94.12%),
    linear-gradient(180deg, transparent 0 11%, rgba(233, 231, 216, 0.38) 11% 11.12%, transparent 11.12% 88%, rgba(233, 231, 216, 0.38) 88% 88.12%, transparent 88.12%),
    radial-gradient(circle, rgba(233, 231, 216, 0.16) 0 0.7px, transparent 1.2px) 0 0 / 4px 4px;
  opacity: 0.68;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive::after{
  z-index: 4;
  background:
    radial-gradient(circle at 63% 37%, transparent 0 25%, rgba(233, 231, 216, 0.7) 25.08% 25.18%, transparent 25.28%),
    radial-gradient(circle at 38% 72%, transparent 0 17%, rgba(233, 231, 216, 0.48) 17.08% 17.2%, transparent 17.3%),
    linear-gradient(90deg, transparent 0 63%, rgba(233, 231, 216, 0.58) 63% 63.1%, transparent 63.2%),
    linear-gradient(180deg, transparent 0 37%, rgba(233, 231, 216, 0.52) 37% 37.1%, transparent 37.2%);
  opacity: 0.72;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  grid-column: 1 / span 5;
  grid-row: 1;
  z-index: 7;
  align-self: start;
  max-width: none;
  min-height: clamp(330px, 34vw, 510px);
  padding: clamp(22px, 2.6vw, 44px);
  border: 0;
  color: var(--plate-ink);
  background:
    radial-gradient(circle, rgba(17, 20, 19, 0.12) 0 0.7px, transparent 1.1px) 0 0 / 3px 3px,
    var(--plate-paper);
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro::before{
  content: "02 / DIFFRACTION / RELATION";
  padding: 0 0 9px;
  border-bottom: 1px solid rgba(17, 20, 19, 0.54);
  color: rgba(17, 20, 19, 0.72);
  background: transparent;
  font: 700 9px/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0.09em;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIndex{
  color: var(--plate-orange);
  font-family: "Courier New", ui-monospace, monospace;
  font-weight: 700;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle{
  font-size: clamp(58px, 6.8vw, 124px);
  line-height: 0.82;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterLead{
  max-width: 31ch;
  font-size: clamp(18px, 1.8vw, 30px);
  line-height: 1.16;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  grid-column: 1 / span 4;
  grid-row: 2;
  z-index: 7;
  align-self: start;
  max-width: none;
  min-height: clamp(500px, 48vw, 720px);
  padding: clamp(24px, 2.8vw, 46px);
  border: 0;
  background:
    radial-gradient(circle, rgba(17, 20, 19, 0.12) 0 0.7px, transparent 1.1px) 0 0 / 3px 3px,
    var(--plate-paper);
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  color: rgba(17, 20, 19, 0.76);
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 1.42;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  grid-column: 4 / -1;
  grid-row: 1 / span 3;
  z-index: 3;
  min-height: clamp(850px, 92vw, 1280px);
  margin: clamp(42px, 4vw, 68px) 0 0;
  border: 0;
  background:
    linear-gradient(90deg, rgba(233, 231, 216, 0.08) 0 28%, transparent 28% 54%, rgba(233, 231, 216, 0.07) 54% 100%),
    var(--plate-ink);
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  inset: 0;
  z-index: 6;
  background:
    linear-gradient(90deg, rgba(233, 231, 216, 0.48) 0 1px, transparent 1px) 0 0 / 16.666% 100%,
    linear-gradient(180deg, rgba(233, 231, 216, 0.42) 0 1px, transparent 1px) 0 0 / 100% 14.285%,
    radial-gradient(circle at 62% 33%, transparent 0 27%, rgba(233, 231, 216, 0.78) 27.08% 27.2%, transparent 27.3%),
    radial-gradient(circle at 31% 72%, transparent 0 18%, rgba(233, 231, 216, 0.54) 18.08% 18.2%, transparent 18.3%);
  opacity: 0.62;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::after{
  content: "N 42 / FIELD 02 / RELATION";
  inset: auto 12px 12px auto;
  border: 0;
  color: rgba(233, 231, 216, 0.72);
  background: transparent;
  font-family: "Courier New", ui-monospace, monospace;
  letter-spacing: 0.06em;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  border: 0;
  background: var(--plate-paper);
  box-shadow: none;
  transition: filter 280ms var(--ease), transform 280ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before{
  z-index: 4;
  background:
    radial-gradient(circle, rgba(233, 231, 216, 0.2) 0 0.7px, transparent 1.2px) 0 0 / 3px 3px,
    linear-gradient(rgba(17, 20, 19, 0.12), rgba(17, 20, 19, 0.12));
  opacity: 0.72;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::after{
  inset: auto 6px 5px 6px;
  z-index: 8;
  padding: 3px 5px;
  border: 0;
  color: rgba(233, 231, 216, 0.74);
  background: rgba(17, 20, 19, 0.58);
  font: 700 8px/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0.06em;
  opacity: 0.8;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  filter: grayscale(0.68) sepia(0.22) saturate(0.62) contrast(1.38) brightness(0.78);
  opacity: 1;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]{
  z-index: 5;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img{
  filter: grayscale(0.18) sepia(0.18) saturate(1.36) contrast(1.42) brightness(0.82);
  transform: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within{
  z-index: 8;
  border: 0;
  box-shadow: none;
  transform: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover img,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within img{
  filter: grayscale(0) sepia(0.12) saturate(1.45) contrast(1.42) brightness(0.86);
  transform: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 16%;
  width: 45%;
  height: 25%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  right: 0;
  top: 31%;
  width: 58%;
  height: 35%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: 0;
  top: 41%;
  width: 42%;
  height: 29%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 0;
  right: auto;
  bottom: 0;
  width: 77%;
  height: 30%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
  grid-column: 1 / span 4;
  grid-row: 3;
  z-index: 8;
  align-self: start;
  width: 100%;
  padding: 10px 0 0;
  border-top: 1px solid rgba(233, 231, 216, 0.62);
  color: rgba(233, 231, 216, 0.74);
  font-family: "Courier New", ui-monospace, monospace;
  font-size: 10px;
  letter-spacing: 0.06em;
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive{
    gap: 0;
    background:
      radial-gradient(circle, rgba(233, 231, 216, 0.09) 0 0.75px, transparent 1px) 0 0 / 3px 3px,
      linear-gradient(90deg, rgba(233, 231, 216, 0.13) 0 1px, transparent 1px) 0 0 / 16.666% 100%,
      #111413;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
    min-height: 0;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(620px, 105vw, 840px);
  }
}

/* Modular geometric signal-board refresh for Chapter 02 */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation{
  --signal-cobalt: #66c7ff;
  --signal-green: #1f5f3c;
  --signal-pink: #ff4f9a;
  --signal-orange: #ff7a1a;
  --signal-paper: #f6f1df;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-hover-concept="2"] .workConstellationMap::after{
  background:
    radial-gradient(circle at 52% 23%, transparent 0 13%, rgba(102, 199, 255, 0.46) 13.1% 13.35%, transparent 13.5% 22%, rgba(102, 199, 255, 0.22) 22.1% 22.3%, transparent 22.5%),
    radial-gradient(circle at 52% 23%, rgba(255, 79, 154, 0.18) 0 1px, transparent 2px 100%),
    conic-gradient(from 214deg at 52% 23%, transparent 0 17deg, rgba(102, 199, 255, 0.52) 17deg 20deg, transparent 20deg 82deg, rgba(255, 122, 26, 0.56) 82deg 86deg, transparent 86deg 360deg),
    linear-gradient(90deg, transparent 0 48%, rgba(102, 199, 255, 0.28) 48% 48.15%, transparent 48.3%),
    linear-gradient(180deg, transparent 0 23%, rgba(102, 199, 255, 0.24) 23% 23.14%, transparent 23.3%),
    radial-gradient(circle at 52% 48%, rgba(246, 241, 223, 0.16), transparent 18%),
    linear-gradient(90deg, rgba(5, 5, 5, 0.9), transparent 28%, transparent 70%, rgba(5, 5, 5, 0.82)),
    linear-gradient(180deg, rgba(5, 5, 5, 0.36), rgba(5, 5, 5, 0.18) 48%, rgba(5, 5, 5, 0.7));
}

.workShell[data-work="diffractive-flora"] .workConstellationNode::after{
  left: 6px;
  top: 50%;
  width: clamp(54px, 6.6vw, 96px);
  height: clamp(54px, 6.6vw, 96px);
  border: 1px solid color-mix(in oklab, var(--node-accent) 55%, var(--signal-cobalt));
  border-radius: 50%;
  background:
    conic-gradient(from -58deg, transparent 0 48deg, color-mix(in oklab, var(--node-accent) 64%, transparent) 48deg 58deg, transparent 58deg 180deg, rgba(102, 199, 255, 0.52) 180deg 184deg, transparent 184deg 360deg),
    radial-gradient(circle, transparent 0 54%, rgba(246, 241, 223, 0.14) 55% 56%, transparent 57%);
  opacity: 0;
  transform: translate(-50%, -50%) rotate(-12deg) scale(0.58);
  transition: opacity 220ms var(--ease), transform 300ms var(--ease), border-color 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active::after{
  opacity: 0.82;
  transform: translate(-50%, -50%) rotate(22deg) scale(1);
}

.workShell[data-work="diffractive-flora"] .workConstellationPin::before,
.workShell[data-work="diffractive-flora"] .workConstellationPin::after{
  content: "";
  position: absolute;
  pointer-events: none;
  opacity: 0;
  transition: opacity 220ms var(--ease), transform 280ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationPin::before{
  inset: -13px;
  border: 1px solid rgba(102, 199, 255, 0.72);
  border-radius: 50%;
  transform: scale(0.62) rotate(-18deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationPin::after{
  left: 50%;
  top: 50%;
  width: 36px;
  height: 1px;
  background:
    linear-gradient(90deg, transparent 0 21%, rgba(246, 241, 223, 0.85) 21% 27%, transparent 27% 46%, rgba(255, 122, 26, 0.96) 46% 54%, transparent 54% 73%, rgba(246, 241, 223, 0.85) 73% 79%, transparent 79%);
  transform: translate(-50%, -50%) rotate(90deg) scaleX(0.58);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover .workConstellationPin::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode:hover .workConstellationPin::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible .workConstellationPin::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible .workConstellationPin::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active .workConstellationPin::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active .workConstellationPin::after{
  opacity: 1;
  transform: translate(-50%, -50%) rotate(0deg) scaleX(1);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode:hover .workConstellationPin::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode:focus-visible .workConstellationPin::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-active .workConstellationPin::before{
  transform: scale(1) rotate(18deg);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall:hover .workConstellationIndex,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall:focus-visible .workConstellationIndex,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall.is-active .workConstellationIndex{
  color: var(--signal-paper);
  background:
    linear-gradient(90deg, rgba(255, 79, 154, 0.9), rgba(5, 5, 5, 0.72) 70%),
    linear-gradient(180deg, rgba(102, 199, 255, 0.2), transparent);
  box-shadow:
    10px 8px 0 rgba(255, 122, 26, 0.46),
    inset 0 0 0 1px rgba(102, 199, 255, 0.58);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall:hover .workConstellationTitle,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall:focus-visible .workConstellationTitle,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-tall.is-active .workConstellationTitle{
  color: var(--signal-orange);
  border-color: var(--signal-orange);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive{
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto minmax(260px, 1fr) auto;
  gap: clamp(18px, 2.4vw, 42px);
  align-items: stretch;
  min-height: clamp(980px, 128svh, 1420px);
  padding: clamp(78px, 8vw, 132px) clamp(34px, 5.8vw, 108px) clamp(82px, 8vw, 142px);
  color: var(--signal-paper);
  background:
    linear-gradient(90deg, rgba(102, 199, 255, 0.13) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.09) 0 1px, transparent 1px) 0 0 / 100% 11.111%,
    radial-gradient(circle at 78% 22%, rgba(102, 199, 255, 0.16), transparent 25%),
    radial-gradient(circle at 47% 76%, rgba(255, 79, 154, 0.12), transparent 23%),
    #050505;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive::before{
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(246, 241, 223, 0.07) 0 30%, transparent 30% 100%),
    radial-gradient(circle, rgba(246, 241, 223, 0.09) 0 1px, transparent 1.7px) 0 0 / 6px 6px,
    linear-gradient(115deg, transparent 0 46%, rgba(102, 199, 255, 0.22) 46.15% 46.35%, transparent 46.55%),
    linear-gradient(83deg, transparent 0 54%, rgba(255, 79, 154, 0.18) 54.15% 54.35%, transparent 54.55%);
  opacity: 0.86;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive::after{
  z-index: 1;
  background:
    radial-gradient(circle at 70% 35%, transparent 0 24%, rgba(102, 199, 255, 0.5) 24.1% 24.3%, transparent 24.45% 35%, rgba(102, 199, 255, 0.22) 35.1% 35.25%, transparent 35.4%),
    conic-gradient(from 198deg at 70% 35%, transparent 0 28deg, rgba(102, 199, 255, 0.48) 28deg 31deg, transparent 31deg 98deg, rgba(255, 122, 26, 0.52) 98deg 103deg, transparent 103deg 360deg),
    linear-gradient(90deg, transparent 0 33%, rgba(246, 241, 223, 0.11) 33% 47%, transparent 47%),
    linear-gradient(180deg, transparent 0 16%, rgba(102, 199, 255, 0.18) 16% 16.16%, transparent 16.3% 78%, rgba(255, 79, 154, 0.2) 78% 78.16%, transparent 78.3%);
  opacity: 0.86;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  grid-column: 1 / span 5;
  grid-row: 1;
  align-self: start;
  display: grid;
  gap: clamp(14px, 1.7vw, 24px);
  max-width: min(650px, 100%);
  padding: clamp(18px, 2.2vw, 34px) clamp(18px, 2.5vw, 42px);
  color: #050505;
  background:
    linear-gradient(90deg, rgba(246, 241, 223, 0.99), rgba(246, 241, 223, 0.96)),
    radial-gradient(circle at 94% 14%, rgba(102, 199, 255, 0.2), transparent 24%);
  box-shadow:
    14px 14px 0 rgba(255, 122, 26, 0.22),
    inset 0 0 0 1px rgba(102, 199, 255, 0.24);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro::before{
  content: "RELATION FIELD / ACTIVE BOARD";
  justify-self: start;
  width: max-content;
  max-width: 100%;
  padding: 5px 9px;
  color: var(--signal-paper);
  background: var(--signal-pink);
  font: 900 10px/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIndex{
  color: var(--signal-pink);
  font: 900 clamp(12px, 0.92vw, 15px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.05em;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle{
  max-width: 8ch;
  color: #050505;
  font: 900 clamp(64px, 7.4vw, 136px)/0.78 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterLead{
  max-width: 30ch;
  color: #050505;
  font: 900 clamp(22px, 2.3vw, 39px)/1.12 "Montserrat", "Didact Gothic", var(--sans);
  text-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  grid-column: 1 / span 4;
  grid-row: 2;
  align-self: start;
  max-width: 42ch;
  padding: clamp(18px, 2vw, 32px);
  color: #050505;
  background: rgba(246, 241, 223, 0.97);
  box-shadow:
    -10px 10px 0 rgba(102, 199, 255, 0.16),
    inset 0 0 0 1px rgba(31, 95, 60, 0.22);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  color: rgba(5, 5, 5, 0.78);
  text-shadow: none;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  grid-column: 4 / -1;
  grid-row: 1 / span 3;
  align-self: stretch;
  min-height: clamp(760px, 88vh, 1040px);
  margin-top: clamp(38px, 4.4vw, 80px);
  border: 1px solid rgba(102, 199, 255, 0.34);
  background:
    linear-gradient(90deg, rgba(246, 241, 223, 0.08) 0 21%, transparent 21% 25%, rgba(246, 241, 223, 0.13) 25% 43%, transparent 43% 100%),
    linear-gradient(180deg, rgba(246, 241, 223, 0.12) 0 18%, transparent 18% 44%, rgba(246, 241, 223, 0.08) 44% 67%, transparent 67%),
    rgba(5, 5, 5, 0.32);
  box-shadow:
    0 0 0 1px rgba(5, 5, 5, 0.8),
    0 26px 90px rgba(0, 0, 0, 0.42);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  inset: 0;
  z-index: 6;
  background:
    linear-gradient(90deg, rgba(102, 199, 255, 0.34) 0 1px, transparent 1px) 0 0 / 12.5% 100%,
    linear-gradient(180deg, rgba(102, 199, 255, 0.22) 0 1px, transparent 1px) 0 0 / 100% 12.5%,
    radial-gradient(circle at 63% 34%, transparent 0 26%, rgba(102, 199, 255, 0.72) 26.1% 26.35%, transparent 26.5% 38%, rgba(246, 241, 223, 0.34) 38.1% 38.25%, transparent 38.4%),
    conic-gradient(from 220deg at 63% 34%, transparent 0 44deg, rgba(102, 199, 255, 0.62) 44deg 47deg, transparent 47deg 113deg, rgba(255, 122, 26, 0.72) 113deg 118deg, transparent 118deg 360deg);
  mix-blend-mode: screen;
  opacity: 0.84;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::after{
  content: "DF-BOARD / 02 / RELATION-INTERFERENCE";
  position: absolute;
  inset: auto clamp(12px, 1.4vw, 20px) clamp(12px, 1.4vw, 20px) auto;
  z-index: 9;
  width: max-content;
  max-width: calc(100% - 28px);
  padding: 6px 10px;
  border: 1px solid rgba(102, 199, 255, 0.56);
  color: var(--signal-cobalt);
  background: rgba(5, 5, 5, 0.76);
  font: 900 10px/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  position: absolute;
  z-index: 3;
  border: 1px solid rgba(102, 199, 255, 0.44);
  background: var(--signal-paper);
  mix-blend-mode: normal;
  box-shadow:
    0 0 0 1px rgba(5, 5, 5, 0.72),
    0 18px 48px rgba(0, 0, 0, 0.42);
  transform: translateZ(0);
  transition:
    border-color 220ms var(--ease),
    box-shadow 260ms var(--ease),
    transform 300ms var(--ease),
    filter 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before{
  background:
    radial-gradient(circle, rgba(246, 241, 223, 0.24) 0 1px, transparent 1.7px) 0 0 / 5px 5px,
    linear-gradient(90deg, rgba(102, 199, 255, 0.26), transparent 58%),
    linear-gradient(180deg, transparent 0 48%, rgba(246, 241, 223, 0.48) 48% 48.4%, transparent 48.8%);
  mix-blend-mode: screen;
  opacity: 0.68;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::after{
  content: attr(data-signal-index) " / " attr(data-label);
  position: absolute;
  inset: auto 8px 8px 8px;
  z-index: 7;
  width: max-content;
  max-width: calc(100% - 16px);
  padding: 6px 8px;
  border-left: 2px solid var(--signal-green);
  color: var(--signal-green);
  background: rgba(246, 241, 223, 0.88);
  font: 900 clamp(8px, 0.72vw, 10px)/1.15 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.94;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  filter: grayscale(1) contrast(1.18) brightness(0.88);
  opacity: 0.9;
  transition: filter 360ms var(--ease), opacity 260ms var(--ease), transform 420ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]{
  z-index: 5;
  border-color: rgba(255, 122, 26, 0.88);
  box-shadow:
    12px 12px 0 rgba(255, 122, 26, 0.32),
    0 22px 62px rgba(0, 0, 0, 0.5);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]::after{
  border-left-color: var(--signal-orange);
  color: var(--signal-orange);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover img,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within img{
  filter: grayscale(0) saturate(1.24) contrast(1.08) brightness(1);
  opacity: 1;
  transform: scale(1.035);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover,
.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within{
  z-index: 8;
  border-color: var(--signal-orange);
  box-shadow:
    0 0 0 1px rgba(255, 122, 26, 0.7),
    16px 14px 0 rgba(255, 122, 26, 0.28),
    0 26px 72px rgba(0, 0, 0, 0.58);
  transform: translateY(-6px);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 4%;
  top: 7%;
  width: 46%;
  height: 27%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  right: 2%;
  top: 21%;
  width: 49%;
  height: 38%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: 17%;
  top: 47%;
  width: 34%;
  height: 31%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  right: 7%;
  bottom: 5%;
  width: 57%;
  height: 25%;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3) img{
  filter: grayscale(1) contrast(1.34) brightness(0.76);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4) img{
  filter: grayscale(0.82) saturate(0.65) contrast(1.24) brightness(1.04);
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
  grid-column: 1 / span 5;
  grid-row: 3;
  align-self: end;
  width: fit-content;
  max-width: min(52ch, 100%);
  margin: 0;
  padding: 12px 0 0;
  border-top: 3px solid var(--signal-pink);
  color: var(--signal-paper);
  text-shadow: none;
}

@media (max-width: 1200px){
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive{
    grid-template-columns: repeat(8, minmax(0, 1fr));
    min-height: clamp(900px, 118svh, 1280px);
    padding-inline: clamp(28px, 5vw, 72px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
    grid-column: 1 / span 4;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
    grid-column: 1 / span 3;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    grid-column: 3 / -1;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
    grid-column: 1 / span 4;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    min-height: 0;
    padding: clamp(74px, 14vw, 110px) clamp(20px, 6vw, 42px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
    grid-column: 1;
    grid-row: auto;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
    max-width: min(680px, 100%);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(560px, 74vh, 760px);
    margin-top: 0;
  }
}

@media (max-width: 640px){
  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
    padding: 18px;
    box-shadow:
      8px 8px 0 rgba(255, 122, 26, 0.22),
      inset 0 0 0 1px rgba(102, 199, 255, 0.24);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle{
    font-size: clamp(46px, 17vw, 76px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterLead{
    font-size: clamp(20px, 7vw, 30px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(520px, 78vh, 680px);
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::after{
    inset: auto 6px 6px 6px;
    font-size: 8px;
    letter-spacing: 0.06em;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
    left: 4%;
    top: 6%;
    width: 58%;
    height: 24%;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
    right: 4%;
    top: 25%;
    width: 58%;
    height: 28%;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
    left: 7%;
    top: 50%;
    width: 44%;
    height: 27%;
  }

  .workShell[data-work="diffractive-flora"] .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
    right: 6%;
    bottom: 5%;
    width: 68%;
    height: 22%;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
    grid-column: 1;
    grid-row: auto;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(620px, 112vw, 820px);
    margin: 0;
  }
}

/* Chapter 02 final material pass: offset-print collage on mixed paper stock */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
  --print-ink: #101312;
  --print-paper: #dedbca;
  --print-paper-dark: #cbc8b8;
  --print-blue: #526167;
  --print-orange: #ee542f;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto minmax(360px, 1fr) auto;
  gap: 0;
  min-height: clamp(1120px, 142svh, 1640px);
  padding: clamp(72px, 7vw, 118px) clamp(34px, 5.4vw, 100px) clamp(86px, 8vw, 132px);
  background:
    radial-gradient(circle, rgba(222, 219, 202, 0.11) 0 0.6px, transparent 0.95px) 0 0 / 2.8px 2.8px,
    linear-gradient(rgba(82, 97, 103, 0.92), rgba(82, 97, 103, 0.92)) 0 0 / 100% 18% no-repeat,
    linear-gradient(rgba(222, 219, 202, 0.94), rgba(222, 219, 202, 0.94)) 0 64% / 47% 23% no-repeat,
    linear-gradient(rgba(91, 96, 91, 0.54), rgba(91, 96, 91, 0.54)) 74% 10% / 26% 19% no-repeat,
    linear-gradient(rgba(222, 219, 202, 0.11), rgba(222, 219, 202, 0.11)) 47% 47% / 19% 35% no-repeat,
    var(--print-ink);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::before{
  z-index: 1;
  background:
    repeating-linear-gradient(0deg, rgba(222, 219, 202, 0.055) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(222, 219, 202, 0.035) 0 1px, transparent 1px 7px),
    radial-gradient(ellipse at 14% 24%, rgba(0, 0, 0, 0.24), transparent 24%),
    radial-gradient(ellipse at 78% 74%, rgba(222, 219, 202, 0.1), transparent 22%),
    linear-gradient(90deg, transparent 0 5.8%, rgba(222, 219, 202, 0.54) 5.8% 5.9%, transparent 5.9% 94%, rgba(222, 219, 202, 0.42) 94% 94.1%, transparent 94.1%),
    linear-gradient(180deg, transparent 0 9%, rgba(222, 219, 202, 0.46) 9% 9.1%, transparent 9.1% 90%, rgba(222, 219, 202, 0.38) 90% 90.1%, transparent 90.1%);
  filter: contrast(1.18);
  opacity: 0.78;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::after{
  z-index: 5;
  background:
    radial-gradient(circle at 68% 34%, transparent 0 23%, rgba(222, 219, 202, 0.76) 23.05% 23.16%, transparent 23.26%),
    radial-gradient(circle at 30% 75%, transparent 0 19%, rgba(222, 219, 202, 0.54) 19.05% 19.16%, transparent 19.26%),
    linear-gradient(90deg, transparent 0 68%, rgba(222, 219, 202, 0.62) 68% 68.08%, transparent 68.18%),
    linear-gradient(180deg, transparent 0 34%, rgba(222, 219, 202, 0.52) 34% 34.08%, transparent 34.18%),
    linear-gradient(105deg, transparent 0 47%, rgba(222, 219, 202, 0.3) 47% 47.08%, transparent 47.18%);
  opacity: 0.72;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  grid-column: 1 / span 7;
  grid-row: 1;
  z-index: 8;
  width: auto;
  max-width: none;
  min-height: clamp(320px, 32vw, 480px);
  margin: 0;
  padding: clamp(24px, 2.7vw, 46px);
  color: var(--print-ink);
  background:
    radial-gradient(circle, rgba(16, 19, 18, 0.2) 0 0.55px, transparent 0.9px) 0 0 / 2.5px 2.5px,
    repeating-linear-gradient(2deg, transparent 0 8px, rgba(16, 19, 18, 0.025) 8px 9px),
    var(--print-paper);
  box-shadow: none;
  transform: translate(0, 0);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(16, 19, 18, 0.13), transparent 3%, transparent 96%, rgba(16, 19, 18, 0.1)),
    linear-gradient(180deg, rgba(16, 19, 18, 0.08), transparent 8%, transparent 91%, rgba(16, 19, 18, 0.12));
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterTitle{
  max-width: 8ch;
  font-size: clamp(58px, 6.9vw, 128px);
  line-height: 0.8;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterLead{
  max-width: 31ch;
  font-size: clamp(19px, 1.8vw, 31px);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  grid-column: 1 / span 5;
  grid-row: 2;
  z-index: 8;
  align-self: start;
  max-width: none;
  min-height: clamp(500px, 47vw, 710px);
  margin: 0;
  padding: clamp(26px, 3vw, 50px);
  background:
    radial-gradient(circle, rgba(16, 19, 18, 0.21) 0 0.55px, transparent 0.9px) 0 0 / 2.5px 2.5px,
    repeating-linear-gradient(-1deg, transparent 0 9px, rgba(16, 19, 18, 0.024) 9px 10px),
    var(--print-paper);
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(16, 19, 18, 0.1), transparent 4%, transparent 96%, rgba(16, 19, 18, 0.12)),
    linear-gradient(180deg, rgba(16, 19, 18, 0.08), transparent 7%, transparent 92%, rgba(16, 19, 18, 0.1));
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  color: rgba(16, 19, 18, 0.78);
  font-size: clamp(14px, 1.12vw, 18px);
  line-height: 1.46;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  grid-column: 6 / -1;
  grid-row: 1 / span 3;
  z-index: 3;
  min-height: clamp(880px, 91vw, 1300px);
  margin: clamp(58px, 5vw, 88px) 0 0;
  border: 0;
  background:
    radial-gradient(circle, rgba(222, 219, 202, 0.08) 0 0.55px, transparent 0.95px) 0 0 / 2.6px 2.6px,
    linear-gradient(rgba(222, 219, 202, 0.9), rgba(222, 219, 202, 0.9)) 0 73% / 78% 27% no-repeat,
    linear-gradient(rgba(82, 97, 103, 0.45), rgba(82, 97, 103, 0.45)) 0 0 / 100% 17% no-repeat,
    #111412;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  inset: 0;
  z-index: 7;
  background:
    linear-gradient(90deg, rgba(222, 219, 202, 0.46) 0 1px, transparent 1px) 0 0 / 14.285% 100%,
    linear-gradient(180deg, rgba(222, 219, 202, 0.4) 0 1px, transparent 1px) 0 0 / 100% 12.5%,
    radial-gradient(circle at 65% 34%, transparent 0 27%, rgba(222, 219, 202, 0.78) 27.05% 27.16%, transparent 27.26%),
    radial-gradient(circle at 30% 72%, transparent 0 18%, rgba(222, 219, 202, 0.58) 18.05% 18.16%, transparent 18.26%);
  filter: none;
  transform: none;
  opacity: 0.65;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  overflow: hidden;
  border: 0;
  background: var(--print-paper-dark);
  box-shadow: none;
  filter: none;
  mix-blend-mode: normal;
  isolation: isolate;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::before{
  z-index: 5;
  background:
    radial-gradient(circle, rgba(16, 19, 18, 0.55) 0 0.55px, transparent 0.86px) 0 0 / 2.35px 2.35px,
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(222, 219, 202, 0.08) 3px 4px),
    linear-gradient(110deg, rgba(222, 219, 202, 0.18), transparent 28%, rgba(16, 19, 18, 0.12) 76%, transparent),
    linear-gradient(180deg, rgba(16, 19, 18, 0.08), transparent 12%, transparent 86%, rgba(16, 19, 18, 0.22));
  opacity: 0.64;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure::after{
  inset: auto 5px 5px 5px;
  padding: 3px 5px;
  border: 0;
  color: rgba(222, 219, 202, 0.76);
  background: rgba(16, 19, 18, 0.58);
  font: 700 8px/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0.05em;
  opacity: 0.84;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  opacity: 0.92;
  filter:
    grayscale(0.82)
    sepia(0.32)
    saturate(0.46)
    contrast(1.58)
    brightness(0.72)
    drop-shadow(1.5px 0 rgba(238, 84, 47, 0.24))
    drop-shadow(-1.5px 0 rgba(82, 97, 103, 0.26));
  transform: scale(1.015);
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]{
  background: #111412;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]::before{
  background:
    radial-gradient(circle, rgba(16, 19, 18, 0.62) 0 0.55px, transparent 0.86px) 0 0 / 2.25px 2.25px,
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(222, 219, 202, 0.07) 3px 4px),
    linear-gradient(rgba(238, 84, 47, 0.72), rgba(238, 84, 47, 0.72)),
    linear-gradient(180deg, rgba(16, 19, 18, 0.12), transparent 14%, transparent 84%, rgba(16, 19, 18, 0.28));
  opacity: 0.9;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img{
  opacity: 0.88;
  filter: grayscale(1) sepia(1) saturate(6) hue-rotate(326deg) contrast(1.62) brightness(0.68);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover::before,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within::before{
  opacity: 0.5;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:hover img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:focus-within img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]:hover img,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]:focus-within img{
  opacity: 0.94;
  filter: grayscale(0.18) sepia(0.2) saturate(1.08) contrast(1.5) brightness(0.78);
  transform: scale(1.015);
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 20%;
  width: 43%;
  height: 24%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  right: 0;
  top: 31%;
  width: 58%;
  height: 34%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: 18%;
  top: 2%;
  width: 31%;
  height: 39%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 0;
  right: auto;
  bottom: 0;
  width: 76%;
  height: 29%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
  grid-column: 1 / span 5;
  grid-row: 3;
  z-index: 8;
  width: 100%;
  margin: 0;
  padding: 10px 0 0;
  border-top: 1px solid rgba(222, 219, 202, 0.62);
  color: rgba(222, 219, 202, 0.76);
  font-family: "Courier New", ui-monospace, monospace;
  font-size: 10px;
  letter-spacing: 0.05em;
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    min-height: 0;
    padding: clamp(72px, 13vw, 106px) clamp(18px, 5vw, 36px);
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterNote{
    grid-column: 1;
    grid-row: auto;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
    min-height: 0;
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(620px, 115vw, 840px);
    margin: 0;
  }
}

/* Chapter 02 final reference-led print collage */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive{
  --board-navy: #050706;
  --board-line: rgba(207, 203, 185, 0.3);
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.55px, transparent 0.92px) 0 0 / 2.7px 2.7px,
    linear-gradient(rgba(25, 35, 40, 0.98), rgba(25, 35, 40, 0.98)) 0 0 / 100% 18% no-repeat,
    linear-gradient(rgba(187, 180, 159, 0.15), rgba(187, 180, 159, 0.15)) 0 66% / 46% 20% no-repeat,
    var(--board-navy);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::before{
  background:
    repeating-linear-gradient(0deg, rgba(214, 209, 190, 0.024) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(214, 209, 190, 0.016) 0 1px, transparent 1px 8px),
    radial-gradient(ellipse at 13% 24%, rgba(0, 0, 0, 0.34), transparent 25%),
    linear-gradient(90deg, transparent 0 5.8%, rgba(207, 203, 185, 0.2) 5.8% 5.86%, transparent 5.92% 94%, rgba(207, 203, 185, 0.16) 94% 94.06%, transparent 94.12%);
  opacity: 0.8;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive::after{
  background:
    radial-gradient(circle at 68% 35%, transparent 0 23%, rgba(207, 203, 185, 0.34) 23.04% 23.12%, transparent 23.2%),
    radial-gradient(circle at 31% 75%, transparent 0 18%, rgba(207, 203, 185, 0.23) 18.04% 18.12%, transparent 18.2%),
    linear-gradient(90deg, transparent 0 68%, rgba(207, 203, 185, 0.2) 68% 68.06%, transparent 68.12%),
    linear-gradient(180deg, transparent 0 34%, rgba(207, 203, 185, 0.18) 34% 34.06%, transparent 34.12%);
  opacity: 0.68;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterIntro{
  background:
    radial-gradient(circle, rgba(28, 27, 23, 0.22) 0 0.55px, transparent 0.9px) 0 0 / 2.55px 2.55px,
    repeating-linear-gradient(2deg, transparent 0 9px, rgba(28, 27, 23, 0.035) 9px 10px),
    #bbb49f;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody{
  background:
    radial-gradient(circle, rgba(28, 27, 23, 0.12) 0 0.48px, transparent 0.84px) 0 0 / 3.2px 3.2px,
    repeating-linear-gradient(-1deg, transparent 0 13px, rgba(28, 27, 23, 0.034) 13px 14px),
    #a9a28d;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody::after{
  opacity: 0.25;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
  max-width: 37ch;
  color: rgba(16, 17, 15, 0.9);
  font-size: clamp(15px, 1.12vw, 18px);
  line-height: 1.56;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
  min-height: clamp(980px, 101vw, 1460px);
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(187, 180, 159, 0.94), rgba(187, 180, 159, 0.94)) 0 72% / 72% 28% no-repeat,
    linear-gradient(rgba(25, 35, 40, 0.88), rgba(25, 35, 40, 0.88)) 0 0 / 100% 17% no-repeat,
    var(--board-navy);
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia::before{
  z-index: 7;
  background:
    linear-gradient(90deg, rgba(207, 203, 185, 0.18) 0 1px, transparent 1px) 0 0 / 20% 100%,
    linear-gradient(180deg, rgba(207, 203, 185, 0.16) 0 1px, transparent 1px) 0 0 / 100% 20%,
    radial-gradient(circle at 64% 34%, transparent 0 28%, rgba(207, 203, 185, 0.48) 28.04% 28.12%, transparent 28.2%),
    radial-gradient(circle at 31% 74%, transparent 0 18%, rgba(207, 203, 185, 0.32) 18.04% 18.12%, transparent 18.2%),
    linear-gradient(90deg, transparent 0 50%, rgba(207, 203, 185, 0.3) 50% 50.07%, transparent 50.14%),
    linear-gradient(180deg, transparent 0 49%, rgba(207, 203, 185, 0.27) 49% 49.07%, transparent 49.14%);
  opacity: 0.7;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure{
  outline: 0;
  background: var(--board-navy);
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure img{
  opacity: 0.9;
  filter: grayscale(0.92) sepia(0.42) saturate(0.3) contrast(1.48) brightness(0.68);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"]::before{
  background:
    radial-gradient(circle, rgba(11, 10, 8, 0.6) 0 0.55px, transparent 0.86px) 0 0 / 2.25px 2.25px,
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(207, 203, 185, 0.06) 3px 4px),
    linear-gradient(rgba(232, 77, 39, 0.78), rgba(232, 77, 39, 0.78));
  opacity: 0.88;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure[data-state="active"] img{
  opacity: 0.86;
  filter: grayscale(1) sepia(1) saturate(7) hue-rotate(329deg) contrast(1.55) brightness(0.72);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(1){
  left: 0;
  top: 25%;
  width: 48%;
  height: 22%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(2){
  left: 34%;
  right: auto;
  top: 0;
  width: 34%;
  height: 42%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(3){
  left: auto;
  right: 0;
  top: 29%;
  width: 48%;
  height: 38%;
}

.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterFigure:nth-child(4){
  left: 0;
  right: auto;
  bottom: 0;
  width: 70%;
  height: 27%;
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterBody p{
    max-width: 42ch;
    font-size: clamp(15px, 4vw, 18px);
  }

  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationChapter.chapter-diffractive .workConstellationChapterMedia{
    min-height: clamp(700px, 145vw, 980px);
  }
}

/* Chapter 02 ink plates: final cascade lock */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia{
  min-height: clamp(1120px, 108vw, 1580px);
  background:
    radial-gradient(circle, rgba(214, 209, 190, 0.07) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(187, 180, 159, 0.94), rgba(187, 180, 159, 0.94)) 0 64% / 74% 36% no-repeat,
    linear-gradient(rgba(15, 20, 22, 0.96), rgba(15, 20, 22, 0.96)) 0 0 / 100% 17% no-repeat,
    var(--board-navy);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure{
  opacity: 1;
  background: #080a09;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure::before{
  z-index: 5;
  background:
    radial-gradient(circle, rgba(222, 219, 202, 0.22) 0 0.5px, transparent 0.82px) 0 0 / 2.5px 2.5px,
    repeating-linear-gradient(0deg, transparent 0 4px, rgba(222, 219, 202, 0.045) 4px 5px);
  opacity: 0.42;
  mix-blend-mode: soft-light;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure img{
  opacity: 1;
  filter: grayscale(1) sepia(0.22) saturate(0.32) contrast(1.62) brightness(0.72);
  mix-blend-mode: normal;
  transform: scale(1.01);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1){
  left: -3%;
  top: 38%;
  width: 55%;
  height: 24%;
  z-index: 9;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(2){
  left: 36%;
  right: auto;
  top: 2%;
  width: 30%;
  height: 39%;
  z-index: 3;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3){
  left: auto;
  right: -3%;
  top: 32%;
  width: 47%;
  height: 36%;
  z-index: 8;
  background: #2c0b05;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3)::before{
  background:
    radial-gradient(circle, rgba(12, 9, 7, 0.42) 0 0.52px, transparent 0.84px) 0 0 / 2.4px 2.4px,
    linear-gradient(rgba(237, 69, 31, 0.8), rgba(237, 69, 31, 0.8));
  opacity: 0.88;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3) img{
  filter: grayscale(1) sepia(1) saturate(6.6) hue-rotate(325deg) contrast(1.66) brightness(0.7);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4){
  left: 6%;
  right: auto;
  bottom: -1%;
  width: 61%;
  height: 25%;
  z-index: 4;
  background: #090c0a;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4) img{
  filter: grayscale(1) sepia(0.3) saturate(0.42) contrast(1.72) brightness(0.68);
  mix-blend-mode: normal;
  object-position: center 42%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5){
  left: auto;
  right: 7%;
  top: 8%;
  width: 43%;
  height: 24%;
  z-index: 7;
  opacity: 1;
  background: #082e54;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5)::before{
  background:
    radial-gradient(circle, rgba(4, 15, 27, 0.46) 0 0.52px, transparent 0.84px) 0 0 / 2.45px 2.45px,
    linear-gradient(rgba(18, 91, 158, 0.9), rgba(18, 91, 158, 0.9));
  opacity: 0.94;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5) img{
  opacity: 0.96;
  filter: grayscale(1) sepia(1) saturate(6.8) hue-rotate(164deg) contrast(1.58) brightness(0.74);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6){
  left: 41%;
  top: 66%;
  width: 42%;
  height: 18%;
  z-index: 6;
  opacity: 1;
  background: #111510;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6) img{
  opacity: 1;
  filter: grayscale(1) sepia(0.55) saturate(0.45) contrast(1.62) brightness(0.7);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:hover{
  opacity: 1;
  filter: none;
  transform: translateY(-6px);
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia{
    min-height: clamp(900px, 194vw, 1220px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1){
    left: -5%;
    top: 37%;
    width: 59%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5){
    right: 4%;
    top: 9%;
    width: 48%;
  }
}

/* Chapter 02 cohesive faded-color print palette */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia{
  background:
    radial-gradient(circle, rgba(211, 204, 180, 0.075) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(184, 174, 143, 0.96), rgba(184, 174, 143, 0.96)) 0 64% / 74% 36% no-repeat,
    linear-gradient(rgba(37, 48, 51, 0.98), rgba(37, 48, 51, 0.98)) 0 0 / 100% 17% no-repeat,
    #080a08;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure{
  background: #11130e;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6) img{
  opacity: 0.94;
  filter: grayscale(0.5) sepia(0.38) saturate(0.78) contrast(1.42) brightness(0.76);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1){
  background: #28271a;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1)::before{
  background:
    radial-gradient(circle, rgba(28, 27, 20, 0.36) 0 0.5px, transparent 0.82px) 0 0 / 2.45px 2.45px,
    linear-gradient(rgba(153, 139, 82, 0.62), rgba(153, 139, 82, 0.62));
  opacity: 0.78;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(2){
  background: #333127;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(2)::before{
  background:
    radial-gradient(circle, rgba(34, 31, 23, 0.32) 0 0.5px, transparent 0.82px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(199, 184, 129, 0.64), rgba(199, 184, 129, 0.64));
  opacity: 0.78;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3){
  background: #35130c;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3)::before{
  background:
    radial-gradient(circle, rgba(24, 12, 8, 0.42) 0 0.52px, transparent 0.84px) 0 0 / 2.4px 2.4px,
    linear-gradient(rgba(218, 72, 37, 0.72), rgba(218, 72, 37, 0.72));
  opacity: 0.82;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3) img{
  opacity: 0.96;
  filter: grayscale(0.68) sepia(0.9) saturate(2.2) hue-rotate(326deg) contrast(1.46) brightness(0.72);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4){
  background: #25271d;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4)::before{
  background:
    radial-gradient(circle, rgba(24, 26, 19, 0.36) 0 0.5px, transparent 0.82px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(128, 133, 87, 0.58), rgba(128, 133, 87, 0.58));
  opacity: 0.48;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4) img{
  opacity: 1;
  filter: grayscale(0.28) sepia(0.46) saturate(0.9) hue-rotate(348deg) contrast(1.4) brightness(0.76);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5){
  background: #182832;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5)::before{
  background:
    radial-gradient(circle, rgba(12, 24, 30, 0.38) 0 0.52px, transparent 0.84px) 0 0 / 2.45px 2.45px,
    linear-gradient(rgba(67, 104, 126, 0.7), rgba(67, 104, 126, 0.7));
  opacity: 0.64;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5) img{
  opacity: 0.98;
  filter: grayscale(0.76) sepia(0.8) saturate(2.4) hue-rotate(158deg) contrast(1.42) brightness(0.78);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6){
  background: #2c281d;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6)::before{
  background:
    radial-gradient(circle, rgba(28, 25, 18, 0.35) 0 0.5px, transparent 0.82px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(174, 151, 94, 0.6), rgba(174, 151, 94, 0.6));
  opacity: 0.8;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6) img{
  opacity: 0.98;
  filter: grayscale(0.38) sepia(0.64) saturate(0.92) contrast(1.42) brightness(0.76);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:hover img{
  filter: grayscale(0.18) sepia(0.28) saturate(0.94) contrast(1.42) brightness(0.8);
}

/* Chapter 02 balanced three-ink palette */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2{
  --flora-ink-paper: #b8af94;
  --flora-ink-warm: #9d9067;
  --flora-ink-rust: #b94c31;
  --flora-ink-slate: #607984;
  --flora-ink-black: #090b09;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia{
  background:
    radial-gradient(circle, rgba(205, 198, 176, 0.07) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(rgba(184, 175, 148, 0.96), rgba(184, 175, 148, 0.96)) 0 64% / 74% 36% no-repeat,
    linear-gradient(rgba(38, 49, 52, 0.98), rgba(38, 49, 52, 0.98)) 0 0 / 100% 17% no-repeat,
    var(--flora-ink-black);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1),
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(2),
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4),
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6){
  background: #17170f;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6) img{
  opacity: 0.96;
  filter: grayscale(0.28) sepia(0.48) saturate(0.72) contrast(1.36) brightness(0.78);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1)::before,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(2)::before,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4)::before,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6)::before{
  background:
    radial-gradient(circle, rgba(30, 28, 20, 0.34) 0 0.5px, transparent 0.82px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(157, 144, 103, 0.44), rgba(157, 144, 103, 0.44));
  opacity: 0.56;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3){
  background: #24120d;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3)::before{
  background:
    radial-gradient(circle, rgba(25, 14, 10, 0.38) 0 0.52px, transparent 0.84px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(185, 76, 49, 0.58), rgba(185, 76, 49, 0.58));
  opacity: 0.7;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3) img{
  filter: grayscale(0.62) sepia(0.95) saturate(1.35) hue-rotate(316deg) contrast(1.32) brightness(0.68);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5){
  background: #182328;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5)::before{
  background:
    radial-gradient(circle, rgba(12, 23, 27, 0.36) 0 0.52px, transparent 0.84px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(96, 121, 132, 0.58), rgba(96, 121, 132, 0.58));
  opacity: 0.68;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5) img{
  filter: grayscale(0.7) sepia(0.62) saturate(1.12) hue-rotate(148deg) contrast(1.3) brightness(0.7);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:hover img{
  filter: grayscale(0.18) sepia(0.3) saturate(0.82) contrast(1.4) brightness(0.8);
}

/* Chapter 02 resolved signal board */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2{
  --flora-board-black: #080a08;
  --flora-board-slate: #394d55;
  --flora-board-paper: #b9ae8f;
  --flora-board-line: rgba(226, 219, 194, 0.68);
  --flora-board-rust: #dc4b25;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2::before{
  background:
    repeating-linear-gradient(0deg, transparent 0 5px, rgba(226, 219, 194, 0.022) 5px 6px),
    repeating-linear-gradient(90deg, transparent 0 8px, rgba(226, 219, 194, 0.016) 8px 9px),
    radial-gradient(circle, rgba(226, 219, 194, 0.12) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px;
  opacity: 0.78;
  mix-blend-mode: soft-light;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2::after{
  background:
    linear-gradient(90deg, transparent 0 22%, rgba(226, 219, 194, 0.26) 22% 22.06%, transparent 22.12% 68%, rgba(226, 219, 194, 0.2) 68% 68.06%, transparent 68.12%),
    linear-gradient(180deg, transparent 0 16%, rgba(226, 219, 194, 0.2) 16% 16.06%, transparent 16.12% 63%, rgba(226, 219, 194, 0.18) 63% 63.06%, transparent 63.12%);
  opacity: 0.72;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia{
  isolation: isolate;
  min-height: clamp(1080px, 104vw, 1520px);
  background:
    radial-gradient(circle, rgba(226, 219, 194, 0.08) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
    linear-gradient(var(--flora-board-paper), var(--flora-board-paper)) 0 57% / 70% 39% no-repeat,
    linear-gradient(var(--flora-board-slate), var(--flora-board-slate)) 0 0 / 100% 24% no-repeat,
    var(--flora-board-black);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia::before{
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(226, 219, 194, 0.15) 0 1px, transparent 1px) 0 0 / 20% 100%,
    linear-gradient(180deg, rgba(226, 219, 194, 0.13) 0 1px, transparent 1px) 0 0 / 100% 20%;
  opacity: 0.72;
  mix-blend-mode: normal;
  transform: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia::after{
  inset: 0;
  z-index: 11;
  background:
    radial-gradient(circle, rgba(226, 219, 194, 0.11) 0 0.52px, transparent 0.88px) 0 0 / 2.45px 2.45px,
    repeating-linear-gradient(0deg, transparent 0 4px, rgba(8, 10, 8, 0.045) 4px 5px);
  opacity: 0.42;
  mix-blend-mode: soft-light;
  transform: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork{
  position: absolute;
  inset: 0;
  z-index: 12;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork svg{
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork path,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork circle{
  fill: none;
  stroke: var(--flora-board-line);
  stroke-width: 1.15;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork .is-register{
  stroke-dasharray: 1 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork .is-relation{
  stroke: rgba(111, 148, 161, 0.82);
  stroke-width: 1.8;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork .is-orbit{
  stroke-width: 1.3;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork .is-faint{
  opacity: 0.52;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork .is-node{
  fill: var(--flora-board-paper);
  stroke: var(--flora-board-black);
  stroke-width: 1.4;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationSignalNetwork .is-node.is-hot{
  fill: var(--flora-board-rust);
  stroke: var(--flora-board-paper);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure{
  outline: 1px solid rgba(226, 219, 194, 0.13);
  outline-offset: -1px;
  transition: filter 220ms ease, transform 220ms ease, outline-color 220ms ease;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure::after{
  background:
    linear-gradient(90deg, transparent 0 7%, rgba(226, 219, 194, 0.22) 7% 7.3%, transparent 7.6%),
    linear-gradient(180deg, transparent 0 9%, rgba(226, 219, 194, 0.2) 9% 9.3%, transparent 9.6%);
  opacity: 0.48;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5) img,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6) img{
  opacity: 0.98;
  filter: grayscale(0.2) sepia(0.42) saturate(0.84) contrast(1.42) brightness(0.77);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1){
  left: -2%;
  top: 30%;
  width: 57%;
  height: 22%;
  z-index: 7;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(2){
  left: 18%;
  right: auto;
  top: 2%;
  width: 34%;
  height: 35%;
  z-index: 5;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3){
  left: auto;
  right: -2%;
  top: 28%;
  width: 48%;
  height: 32%;
  z-index: 9;
  background: #2d0d07;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3)::before{
  background:
    radial-gradient(circle, rgba(32, 15, 8, 0.38) 0 0.52px, transparent 0.84px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(220, 75, 37, 0.72), rgba(220, 75, 37, 0.72));
  opacity: 0.82;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3) img{
  filter: grayscale(0.52) sepia(0.95) saturate(1.75) hue-rotate(321deg) contrast(1.42) brightness(0.68);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4){
  left: -1%;
  right: auto;
  bottom: 0;
  width: 70%;
  height: 30%;
  z-index: 6;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5){
  left: 34%;
  right: auto;
  top: 9%;
  width: 43%;
  height: 22%;
  z-index: 8;
  background: #18282f;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5)::before{
  background:
    radial-gradient(circle, rgba(12, 23, 27, 0.36) 0 0.52px, transparent 0.84px) 0 0 / 2.5px 2.5px,
    linear-gradient(rgba(76, 115, 130, 0.68), rgba(76, 115, 130, 0.68));
  opacity: 0.72;
  mix-blend-mode: color;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5) img{
  filter: grayscale(0.58) sepia(0.58) saturate(1.35) hue-rotate(148deg) contrast(1.36) brightness(0.72);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(6){
  left: 44%;
  top: 56%;
  width: 38%;
  height: 19%;
  z-index: 8;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:hover{
  z-index: 13;
  outline-color: rgba(226, 219, 194, 0.72);
  transform: translateY(-4px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia:has(.workConstellationChapterFigure:hover) .workConstellationSignalNetwork{
  filter: brightness(1.18);
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterMedia{
    min-height: clamp(920px, 188vw, 1220px);
    background:
      radial-gradient(circle, rgba(226, 219, 194, 0.08) 0 0.52px, transparent 0.9px) 0 0 / 2.65px 2.65px,
      linear-gradient(var(--flora-board-paper), var(--flora-board-paper)) 0 58% / 73% 38% no-repeat,
      linear-gradient(var(--flora-board-slate), var(--flora-board-slate)) 0 0 / 100% 23% no-repeat,
      var(--flora-board-black);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(1){
    left: -4%;
    top: 31%;
    width: 60%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(2){
    left: 13%;
    width: 39%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(3){
    right: -5%;
    width: 52%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(4){
    left: -3%;
    width: 75%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-2 .workConstellationChapterFigure:nth-child(5){
    left: 31%;
    width: 49%;
  }
}

/* Chapter 03 final pass: integrated botanical signal-processing plate. */
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:hover,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:focus-visible,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift.is-active{
  color: var(--flora-orange);
  transform: translate(-50%, -50%) scale(1.035);
  filter:
    drop-shadow(0 0 18px rgba(255, 122, 26, 0.28))
    drop-shadow(0 0 1px rgba(246, 241, 223, 0.54));
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:hover::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:focus-visible::before,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift.is-active::before{
  width: clamp(72px, 8vw, 118px);
  opacity: 0.9;
  background:
    linear-gradient(90deg, var(--flora-orange), rgba(255, 122, 26, 0.28) 58%, transparent);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:hover::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:focus-visible::after,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift.is-active::after{
  width: 34px;
  height: 22px;
  border-radius: 0;
  border-color: rgba(255, 122, 26, 0.92);
  opacity: 0.76;
  transform: translate(-50%, -50%) scale(1);
  box-shadow:
    inset 10px 0 0 rgba(255, 122, 26, 0.18),
    inset -1px 0 0 rgba(246, 241, 223, 0.26),
    0 0 0 1px rgba(47, 82, 255, 0.22);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:hover .workConstellationPin,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:focus-visible .workConstellationPin,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift.is-active .workConstellationPin{
  transform: scale(1.1);
  background: var(--flora-orange);
  box-shadow:
    0 0 0 5px rgba(255, 122, 26, 0.14),
    0 0 22px rgba(255, 122, 26, 0.5);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:hover .workConstellationIndex,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:focus-visible .workConstellationIndex,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift.is-active .workConstellationIndex{
  color: var(--flora-paper);
  background:
    linear-gradient(90deg, rgba(255, 122, 26, 0.42), rgba(5, 5, 5, 0.64));
  box-shadow:
    inset 0 -2px 0 rgba(255, 122, 26, 0.86),
    0 0 0 1px rgba(255, 122, 26, 0.28);
  transform: translateX(2px);
}

.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:hover .workConstellationTitle,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift:focus-visible .workConstellationTitle,
.workShell[data-work="diffractive-flora"] .workConstellationNode.is-drift.is-active .workConstellationTitle{
  color: var(--flora-orange);
  border-color: rgba(255, 122, 26, 0.7);
  transform: translateX(2px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
  --process-cobalt: #244fff;
  --process-cobalt-soft: rgba(36, 79, 255, 0.58);
  --process-paper: #eff0f7;
  --process-paper-wash: rgba(239, 240, 247, 0.92);
  --process-forest: #1d5f3b;
  --process-black: #050505;
  --process-ink: #10245e;
  --process-paper-edge: rgba(239, 240, 247, 0.2);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-template-columns: minmax(320px, 0.72fr) minmax(560px, 1.28fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  align-items: start;
  min-height: clamp(1180px, 136svh, 1560px);
  margin: clamp(-46px, -3vw, -22px) 0 clamp(-48px, -2.8vw, -20px);
  padding: clamp(116px, 9.5vw, 174px) clamp(54px, 7.6vw, 132px) clamp(118px, 8.8vw, 174px);
  column-gap: clamp(22px, 3vw, 50px);
  row-gap: clamp(20px, 3vw, 46px);
  color: var(--process-ink);
  background:
    linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.96) 7%, rgba(5, 5, 5, 0.34) 18%, rgba(5, 5, 5, 0.12) 66%, rgba(5, 5, 5, 0.74) 88%, #050505 100%),
    radial-gradient(ellipse at 52% 46%, rgba(36, 79, 255, 0.12), transparent 48%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.18) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.07) 0 1px, transparent 1px) 0 0 / 100% 10%,
    linear-gradient(180deg, #070707 0%, #050505 58%, #030303 100%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 44% 13%, rgba(255, 255, 255, 0.32), transparent 20%),
    radial-gradient(ellipse at 74% 70%, rgba(255, 79, 154, 0.08), transparent 30%),
    radial-gradient(ellipse at 68% 88%, rgba(36, 79, 255, 0.14), transparent 24%),
    linear-gradient(180deg, rgba(239, 240, 247, 0) 0%, rgba(239, 240, 247, 0.25) 17%, rgba(239, 240, 247, 0.12) 70%, rgba(239, 240, 247, 0) 100%),
    radial-gradient(circle, rgba(246, 241, 223, 0.08) 0 0.54px, transparent 0.92px) 0 0 / 3px 3px;
  opacity: 0.96;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
  content: "";
  position: absolute;
  inset: clamp(78px, 7.8vw, 138px) clamp(42px, 6.4vw, 120px);
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(36, 79, 255, 0.26);
  background:
    linear-gradient(90deg, rgba(255, 122, 26, 0.72) 0 3px, transparent 3px) 1.8% 0 / 100% 100% no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.085) 0 0.55px, transparent 0.92px) 0 0 / 3px 3px,
    linear-gradient(90deg, transparent 0 31.5%, rgba(36, 79, 255, 0.24) 31.5% 31.58%, transparent 31.66%),
    linear-gradient(90deg, transparent 0 7%, rgba(36, 79, 255, 0.18) 7% 7.08%, transparent 7.16% 72%, rgba(36, 79, 255, 0.16) 72% 72.08%, transparent 72.16%),
    linear-gradient(180deg, transparent 0 14%, rgba(36, 79, 255, 0.22) 14% 14.08%, transparent 14.16% 80%, rgba(36, 79, 255, 0.14) 80% 80.08%, transparent 80.16%),
    linear-gradient(180deg, rgba(252, 252, 255, 0.9), rgba(239, 240, 247, 0.86) 68%, rgba(239, 240, 247, 0.52));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.58),
    0 30px 100px rgba(0, 0, 0, 0.34);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 9%, #000 78%, transparent 96%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 9%, #000 78%, transparent 96%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  position: relative;
  z-index: 2;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  max-width: 39ch;
  gap: clamp(14px, 1.55vw, 22px);
  padding: clamp(16px, 1.9vw, 28px) clamp(14px, 1.6vw, 24px) 0 0;
  border-top: 1px solid rgba(36, 79, 255, 0.38);
  border-right: 1px solid rgba(36, 79, 255, 0.1);
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.048), transparent 48%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.16), transparent 76%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::before{
  content: "IMAGE TRANSLATION / CHAPTER 03";
  display: block;
  width: max-content;
  max-width: 100%;
  margin-bottom: clamp(2px, 0.6vw, 8px);
  padding: 0 0 6px;
  color: rgba(36, 79, 255, 0.82);
  border-bottom: 2px solid rgba(36, 79, 255, 0.72);
  font: 800 clamp(9px, 0.68vw, 11px)/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
  content: "source / dither / ascii / memory";
  display: block;
  padding-top: clamp(4px, 0.8vw, 8px);
  color: rgba(29, 95, 59, 0.74);
  border-top: 1px solid rgba(36, 79, 255, 0.24);
  font: 700 clamp(9px, 0.68vw, 11px)/1.2 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIndex{
  color: var(--flora-orange);
  font: 800 clamp(12px, 0.95vw, 15px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 9.8ch;
  color: rgba(17, 43, 157, 0.96);
  font: 500 clamp(54px, 5.2vw, 92px)/0.84 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0;
  text-transform: uppercase;
  text-shadow:
    1px 0 0 rgba(255, 122, 26, 0.22),
    -1px 0 0 rgba(255, 79, 154, 0.18),
    0 1px 0 rgba(255, 255, 255, 0.78);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 31ch;
  margin-top: clamp(4px, 0.8vw, 10px);
  padding: clamp(12px, 1.3vw, 18px) clamp(14px, 1.5vw, 22px);
  color: rgba(12, 29, 85, 0.96);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.76), rgba(239, 240, 247, 0.36)),
    radial-gradient(circle, rgba(36, 79, 255, 0.22) 0 0.8px, transparent 1.4px) 0 0 / 5px 5px;
  border-left: 4px solid rgba(36, 79, 255, 0.88);
  box-shadow:
    inset 0 0 0 1px rgba(36, 79, 255, 0.24),
    inset 0 -2px 0 rgba(255, 122, 26, 0.74);
  font: 700 clamp(17px, 1.28vw, 24px)/1.18 "Montserrat", "Didact Gothic", var(--sans);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
  grid-column: 1;
  grid-row: 2;
  align-self: start;
  display: grid;
  gap: clamp(14px, 1.45vw, 22px);
  width: min(100%, 43ch);
  max-width: 100%;
  margin-top: clamp(14px, 1.8vw, 28px);
  padding: clamp(24px, 2.4vw, 36px) clamp(18px, 1.8vw, 28px) clamp(20px, 1.8vw, 30px) 0;
  border-top: 1px solid rgba(36, 79, 255, 0.34);
  border-bottom: 1px solid rgba(36, 79, 255, 0.18);
  border-right: 1px solid rgba(36, 79, 255, 0.08);
  box-sizing: border-box;
  overflow-wrap: break-word;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.24) 58%, transparent),
    repeating-linear-gradient(180deg, rgba(36, 79, 255, 0.045) 0 1px, transparent 1px 26px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::before{
  content: "correspondence log";
  display: block;
  width: max-content;
  max-width: 100%;
  margin-bottom: clamp(4px, 0.7vw, 8px);
  padding-bottom: 6px;
  color: rgba(29, 95, 59, 0.72);
  border-bottom: 1px solid rgba(36, 79, 255, 0.2);
  font: 700 clamp(9px, 0.68vw, 11px)/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody p{
  margin: 0;
  color: rgba(12, 28, 74, 0.88);
  font: 400 clamp(15px, 1vw, 18px)/1.56 "Courier New", ui-monospace, monospace;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody p:first-child{
  color: rgba(12, 28, 74, 0.96);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  grid-column: 1;
  grid-row: 3;
  align-self: end;
  width: 100%;
  margin: clamp(22px, 2.4vw, 38px) 0 0;
  padding: 12px clamp(14px, 1.4vw, 22px) 0 0;
  border-top: 2px solid rgba(255, 79, 154, 0.58);
  border-right: 1px solid rgba(36, 79, 255, 0.08);
  color: rgba(178, 26, 96, 0.82);
  font: 800 clamp(10px, 0.78vw, 12px)/1.45 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: stretch;
  display: block;
  min-height: clamp(860px, 98svh, 1120px);
  height: auto;
  margin: clamp(16px, 1.6vw, 26px) 0 0;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 52% 46%, rgba(36, 79, 255, 0.08), transparent 58%),
    radial-gradient(circle, rgba(36, 79, 255, 0.085) 0 0.55px, transparent 0.92px) 0 0 / 3px 3px,
    linear-gradient(90deg, rgba(239, 240, 247, 0.26) 0 50%, rgba(239, 240, 247, 0.14) 50% 100%);
  box-shadow:
    inset 1px 0 0 rgba(36, 79, 255, 0.34),
    inset 0 0 0 1px rgba(36, 79, 255, 0.1);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0 5%, rgba(36, 79, 255, 0.34) 5% 5.08%, transparent 5.16% 50.2%, rgba(36, 79, 255, 0.32) 50.2% 50.28%, transparent 50.36% 93.5%, rgba(36, 79, 255, 0.24) 93.5% 93.58%, transparent 93.66%),
    linear-gradient(180deg, transparent 0 12%, rgba(36, 79, 255, 0.32) 12% 12.08%, transparent 12.16% 57.2%, rgba(36, 79, 255, 0.28) 57.2% 57.28%, transparent 57.36% 82%, rgba(36, 79, 255, 0.2) 82% 82.08%, transparent 82.16%),
    linear-gradient(132deg, transparent 0 49.6%, rgba(36, 79, 255, 0.54) 49.7% 50%, transparent 50.1%) 71% 8.5% / 112px 74px no-repeat,
    linear-gradient(90deg, rgba(36, 79, 255, 0.58), rgba(36, 79, 255, 0.58)) 5% 12% / 78% 1px no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0.22), transparent 18%, transparent 80%, rgba(255, 255, 255, 0.1));
  opacity: 0.66;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
  content: "scan field 09.03 / botanical input\Aoutput: ascii raster memory / full-image reduction";
  position: absolute;
  left: 6.5%;
  right: 7%;
  bottom: 7.2%;
  top: auto;
  z-index: 12;
  display: block;
  white-space: pre;
  color: rgba(29, 95, 59, 0.9);
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.72) 0 6%, rgba(255, 79, 154, 0.56) 6% 10%, rgba(255, 122, 26, 0.66) 10% 14%, transparent 14%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.42), rgba(36, 79, 255, 0.42)) 0 100% / 100% 1px no-repeat;
  padding-top: 16px;
  font: 700 clamp(9px, 0.68vw, 11px)/1.45 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  opacity: 0.48;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure{
  position: absolute;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(36, 79, 255, 0.36);
  border-radius: 0;
  background: var(--process-paper);
  box-shadow: none;
  transition:
    transform 260ms var(--ease),
    border-color 260ms var(--ease),
    filter 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure img{
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  opacity: 0.94;
  filter: grayscale(1) contrast(1.75) brightness(1.08);
  transform: none;
  transition:
    opacity 260ms var(--ease),
    filter 260ms var(--ease),
    transform 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure::after{
  content: attr(data-signal-index) " / " attr(data-label);
  position: absolute;
  inset: auto 8px 8px 8px;
  z-index: 9;
  display: block;
  padding: 5px 7px;
  color: var(--process-forest);
  background: rgba(239, 240, 247, 0.72);
  border-top: 1px solid rgba(36, 79, 255, 0.32);
  font: 700 clamp(8px, 0.66vw, 10px)/1.1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure:hover{
  z-index: 14;
  border-color: rgba(255, 122, 26, 0.82);
  transform: translateY(-3px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure:hover img{
  opacity: 0.99;
  filter: grayscale(0.12) saturate(1.1) contrast(1.25) brightness(0.9);
  transform: scale(1.015);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 5%;
  top: 17.5%;
  width: 58%;
  height: auto;
  aspect-ratio: 0.786;
  z-index: 4;
  background: #072dce;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
  background:
    radial-gradient(circle, rgba(239, 240, 247, 0.9) 0 1.15px, transparent 1.65px) 0 0 / 5.5px 5.5px,
    linear-gradient(rgba(36, 79, 255, 0.7), rgba(36, 79, 255, 0.7));
  opacity: 0.82;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither img{
  opacity: 0.82;
  filter: grayscale(1) contrast(2.18) brightness(1.25);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 50%;
  top: 22.5%;
  width: 45%;
  height: auto;
  aspect-ratio: 0.772;
  z-index: 6;
  background: var(--process-paper);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 7;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255, 79, 154, 0.08), transparent 18%, transparent 78%, rgba(255, 122, 26, 0.08)),
    linear-gradient(180deg, transparent 0 42%, rgba(255, 79, 154, 0.18) 42% 42.2%, transparent 42.4%);
  mix-blend-mode: multiply;
  opacity: 0.78;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii img{
  opacity: 0.98;
  filter: saturate(0.96) contrast(1.04) brightness(1);
  transform: none;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii:hover::before{
  opacity: 0.42;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii:hover img{
  filter: saturate(1.05) contrast(1.08) brightness(1.02);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-strip{
  left: 39%;
  top: 55.5%;
  bottom: auto;
  width: 48%;
  height: auto;
  aspect-ratio: 0.726;
  z-index: 3;
  background: #110410;
  border-color: rgba(255, 79, 154, 0.56);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-strip::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
  background:
    radial-gradient(circle, rgba(255, 79, 154, 0.4) 0 0.8px, transparent 1.2px) 0 0 / 4px 4px,
    linear-gradient(rgba(255, 79, 154, 0.3), rgba(255, 79, 154, 0.3));
  opacity: 0.74;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-strip img{
  opacity: 0.92;
  filter: grayscale(0.22) saturate(1.68) contrast(1.52) brightness(0.78);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample{
  left: 5%;
  top: 5.8%;
  width: clamp(82px, 7.4vw, 118px);
  height: clamp(82px, 7.4vw, 118px);
  z-index: 10;
  background: rgba(239, 240, 247, 0.9);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample::before{
  content: "";
  position: absolute;
  inset: 12%;
  z-index: 7;
  pointer-events: none;
  border: 1px solid rgba(36, 79, 255, 0.78);
  background:
    radial-gradient(circle at 50% 50%, transparent 0 31%, rgba(36, 79, 255, 0.82) 32% 34%, transparent 35%),
    radial-gradient(circle at 18% 18%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 50% 18%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 82% 18%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 18% 50%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 50% 50%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 82% 50%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 18% 82%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 50% 82%, #fff 0 5px, transparent 6px),
    radial-gradient(circle at 82% 82%, #fff 0 5px, transparent 6px),
    linear-gradient(90deg, transparent 0 22%, rgba(36, 79, 255, 0.72) 22% 24%, transparent 24% 48%, rgba(36, 79, 255, 0.72) 48% 50%, transparent 50% 74%, rgba(36, 79, 255, 0.72) 74% 76%, transparent 76%),
    linear-gradient(180deg, transparent 0 22%, rgba(36, 79, 255, 0.72) 22% 24%, transparent 24% 48%, rgba(36, 79, 255, 0.72) 48% 50%, transparent 50% 74%, rgba(36, 79, 255, 0.72) 74% 76%, transparent 76%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample::after{
  content: "diagram";
  position: absolute;
  inset: auto 8px 8px 8px;
  z-index: 9;
  display: block;
  padding-top: 5px;
  color: rgba(36, 79, 255, 0.62);
  border-top: 1px solid rgba(36, 79, 255, 0.36);
  font: 800 8px/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample img{
  opacity: 0;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    grid-template-columns: minmax(280px, 0.76fr) minmax(500px, 1.24fr);
    column-gap: clamp(16px, 2.2vw, 34px);
    padding-inline: clamp(48px, 5.6vw, 74px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    min-height: clamp(820px, 96svh, 1060px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    min-height: 0;
    margin: -26px 0 -28px;
    padding: 96px 18px 116px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
    inset: 48px 14px 54px;
    box-shadow:
      inset 0 0 0 1px rgba(246, 241, 223, 0.18),
      0 18px 70px rgba(0, 0, 0, 0.32);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-column: 1;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
    grid-row: 1;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    grid-row: 2;
    min-height: clamp(600px, 150vw, 780px);
    margin: 12px 0 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
    grid-row: 3;
    max-width: none;
    width: 100%;
    padding-right: 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-row: 4;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(50px, 15vw, 78px);
    max-width: 10ch;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    max-width: none;
    font-size: clamp(18px, 5.2vw, 24px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 5%;
    top: 19%;
    width: 58%;
    height: auto;
    aspect-ratio: 0.786;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 48.5%;
    top: 24%;
    width: 46%;
    height: auto;
    aspect-ratio: 0.772;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-strip{
    left: 32%;
    top: 60%;
    bottom: auto;
    width: 42%;
    height: auto;
    aspect-ratio: 0.726;
  }
}

@media (max-width: 560px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    padding-inline: 16px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    min-height: clamp(560px, 144vw, 700px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
    left: 6%;
    right: 6%;
    font-size: 9px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample{
    width: 82px;
    height: 82px;
  }
}

/* Chapter 03 comment correction: cleaner reference-led two-panel poster. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
  grid-template-columns: minmax(330px, 0.8fr) minmax(600px, 1.2fr);
  min-height: clamp(1120px, 128svh, 1460px);
  margin: clamp(-28px, -1.8vw, -12px) 0 clamp(-34px, -2vw, -16px);
  padding: clamp(96px, 8.2vw, 142px) clamp(44px, 6.4vw, 98px) clamp(106px, 8vw, 148px);
  column-gap: clamp(28px, 3.6vw, 62px);
  background:
    linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.98) 7%, rgba(5, 5, 5, 0.9) 12%, rgba(5, 5, 5, 0.9) 88%, rgba(5, 5, 5, 0.98) 94%, #050505 100%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.18) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.06) 0 1px, transparent 1px) 0 0 / 100% 10%,
    #050505;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
  opacity: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
  inset: clamp(62px, 5.6vw, 96px) clamp(28px, 4.6vw, 74px);
  border-color: rgba(36, 79, 255, 0.34);
  background:
    linear-gradient(90deg, rgba(255, 122, 26, 0.84) 0 3px, transparent 3px) clamp(12px, 1.4vw, 22px) 0 / 100% 100% no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.11) 0 0.56px, transparent 0.9px) 0 0 / 3px 3px,
    linear-gradient(90deg, transparent 0 31.8%, rgba(36, 79, 255, 0.25) 31.8% 31.9%, transparent 32% 71.5%, rgba(36, 79, 255, 0.18) 71.5% 71.6%, transparent 71.7%),
    linear-gradient(180deg, transparent 0 15.5%, rgba(36, 79, 255, 0.24) 15.5% 15.6%, transparent 15.7% 76.5%, rgba(36, 79, 255, 0.17) 76.5% 76.6%, transparent 76.7%),
    linear-gradient(180deg, #f7f8ff 0%, #eef2fb 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.62),
    0 22px 72px rgba(0, 0, 0, 0.36);
  -webkit-mask-image: none;
  mask-image: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
  max-width: none;
  padding: clamp(18px, 1.8vw, 28px) clamp(16px, 1.8vw, 26px) 0;
  border-top: 2px solid rgba(36, 79, 255, 0.54);
  border-right: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.08) 72%, transparent),
    linear-gradient(180deg, rgba(36, 79, 255, 0.045), transparent 74%);
  box-sizing: border-box;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::before{
  margin-bottom: clamp(8px, 1vw, 14px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 100%;
  color: rgba(20, 55, 186, 0.98);
  font-size: clamp(48px, 4.55vw, 78px);
  line-height: 0.9;
  margin: 0;
  padding: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 100%;
  margin-top: clamp(12px, 1.4vw, 20px);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.82), rgba(239, 240, 247, 0.48)),
    radial-gradient(circle, rgba(36, 79, 255, 0.2) 0 0.8px, transparent 1.35px) 0 0 / 5px 5px;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
  width: min(100%, 44ch);
  margin-top: clamp(20px, 2vw, 34px);
  padding: clamp(24px, 2.3vw, 34px) clamp(18px, 1.8vw, 28px);
  border: 1px solid rgba(36, 79, 255, 0.22);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.38)),
    repeating-linear-gradient(180deg, rgba(36, 79, 255, 0.045) 0 1px, transparent 1px 26px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody p{
  color: rgba(12, 28, 74, 0.94);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  padding-left: clamp(16px, 1.8vw, 26px);
  border-right: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
  align-self: start;
  min-height: 0;
  height: clamp(720px, 84svh, 900px);
  margin: clamp(22px, 2vw, 34px) 0 0;
  overflow: visible;
  background: transparent;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.62), rgba(36, 79, 255, 0.62)) 0 14% / 86% 1px no-repeat,
    linear-gradient(132deg, transparent 0 49.4%, rgba(36, 79, 255, 0.58) 49.5% 50%, transparent 50.1%) 76% 7% / 118px 84px no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.1) 0 0.55px, transparent 0.9px) 0 0 / 3px 3px;
  opacity: 0.7;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
  content: "ascii\Aminimalist";
  left: auto;
  right: 5%;
  top: 7.5%;
  bottom: auto;
  width: max-content;
  padding: 0 0 0 52px;
  color: rgba(36, 79, 255, 0.95);
  background:
    linear-gradient(132deg, transparent 0 46%, rgba(36, 79, 255, 0.78) 47% 50%, transparent 51%) 0 50% / 42px 24px no-repeat,
    linear-gradient(90deg, rgba(36, 79, 255, 0.7), rgba(36, 79, 255, 0.7)) 0 50% / 46px 1px no-repeat;
  font: 800 clamp(13px, 1.15vw, 18px)/0.9 "Montserrat", "Didact Gothic", var(--sans);
  opacity: 0.9;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure{
  border-color: rgba(36, 79, 255, 0.42);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.4),
    0 12px 34px rgba(7, 28, 110, 0.16);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 0;
  top: 22%;
  width: 68%;
  aspect-ratio: 0.786;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 38%;
  top: 27%;
  width: 62%;
  aspect-ratio: 0.772;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-strip,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample{
  display: none;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    grid-template-columns: minmax(300px, 0.8fr) minmax(520px, 1.2fr);
    padding-inline: clamp(42px, 5vw, 68px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(44px, 4.5vw, 70px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    grid-template-columns: 1fr;
    padding: 94px 18px 112px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
    inset: 52px 12px 58px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
    padding-inline: 16px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(44px, 12.5vw, 64px);
    line-height: 0.9;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(500px, 128vw, 660px);
    margin-top: 18px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 3%;
    top: 22%;
    width: 65%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 39%;
    top: 28%;
    width: 58%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
    width: 100%;
    padding-inline: 16px;
  }
}

@media (max-width: 560px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(480px, 122vw, 620px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
    right: 4%;
    top: 8%;
    font-size: 12px;
  }
}

/* Chapter 03 integration pass: keep the page dark and make the process plate contained. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
  grid-template-columns: minmax(300px, 0.84fr) minmax(560px, 1.16fr);
  grid-template-rows: auto auto auto;
  min-height: 0;
  margin: clamp(-44px, -3vw, -24px) 0 clamp(-56px, -4vw, -28px);
  padding: clamp(126px, 10vw, 178px) clamp(44px, 6vw, 98px) clamp(116px, 8vw, 154px);
  column-gap: clamp(34px, 4.6vw, 76px);
  row-gap: clamp(20px, 2.8vw, 42px);
  color: var(--flora-paper);
  background:
    linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.98) 10%, rgba(6, 7, 8, 0.92) 24%, rgba(4, 5, 5, 0.94) 76%, #050505 100%),
    radial-gradient(ellipse at 68% 22%, rgba(36, 79, 255, 0.2), transparent 34%),
    radial-gradient(ellipse at 26% 14%, rgba(246, 241, 223, 0.11), transparent 28%),
    radial-gradient(ellipse at 74% 85%, rgba(255, 79, 154, 0.08), transparent 26%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.12) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(246, 241, 223, 0.055) 0 1px, transparent 1px) 0 0 / 100% 12%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.72;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.98), rgba(5, 5, 5, 0.42) 44%, rgba(5, 5, 5, 0.92) 82%) 64% 76% / min(58vw, 680px) min(36vw, 430px) no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 72% 78% / min(56vw, 650px) auto no-repeat,
    linear-gradient(180deg, rgba(5, 5, 5, 0) 0%, rgba(5, 5, 5, 0.7) 12%, rgba(5, 5, 5, 0) 26%),
    radial-gradient(ellipse at 48% 0%, rgba(246, 241, 223, 0.15), transparent 24%),
    radial-gradient(ellipse at 46% 9%, rgba(255, 255, 255, 0.08), transparent 32%),
    radial-gradient(circle, rgba(246, 241, 223, 0.06) 0 0.55px, transparent 0.95px) 0 0 / 3px 3px;
  background-blend-mode: normal, screen, normal, normal, normal, normal;
  filter: grayscale(1) contrast(1.45) brightness(0.64) blur(0.1px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  border: 0;
  background:
    linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.08) 15%, rgba(5, 5, 5, 0.08) 76%, #050505 100%),
    linear-gradient(90deg, rgba(255, 122, 26, 0.64) 0 2px, transparent 2px) clamp(56px, 6.2vw, 104px) 0 / 100% 100% no-repeat,
    linear-gradient(90deg, rgba(36, 79, 255, 0.12) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(36, 79, 255, 0.08) 0 1px, transparent 1px) 0 0 / 100% 12%;
  box-shadow: none;
  -webkit-mask-image: none;
  mask-image: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  max-width: 40ch;
  padding: clamp(18px, 2vw, 30px) clamp(16px, 1.8vw, 26px) clamp(18px, 2vw, 30px) clamp(18px, 2vw, 30px);
  color: var(--flora-paper);
  border-top: 1px solid rgba(36, 79, 255, 0.42);
  border-right: 0;
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.12), rgba(36, 79, 255, 0.02) 70%, transparent),
    linear-gradient(180deg, rgba(246, 241, 223, 0.045), rgba(246, 241, 223, 0.012));
  box-shadow: inset 3px 0 0 rgba(255, 122, 26, 0.78);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::before{
  margin-bottom: clamp(9px, 1vw, 15px);
  color: rgba(72, 103, 255, 0.92);
  border-bottom-color: rgba(72, 103, 255, 0.78);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
  padding-top: clamp(10px, 1.1vw, 16px);
  color: rgba(70, 198, 130, 0.72);
  border-top-color: rgba(36, 79, 255, 0.24);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIndex{
  color: var(--flora-orange);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 10.2ch;
  margin: 0;
  padding: 0;
  color: rgba(246, 241, 223, 0.96);
  font-size: clamp(48px, 5vw, 84px);
  line-height: 0.88;
  text-shadow:
    1px 0 0 rgba(36, 79, 255, 0.74),
    -1px 0 0 rgba(255, 79, 154, 0.32),
    0 10px 42px rgba(36, 79, 255, 0.2);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 34ch;
  margin-top: clamp(12px, 1.5vw, 22px);
  padding: clamp(14px, 1.35vw, 20px) clamp(14px, 1.5vw, 22px);
  color: rgba(246, 241, 223, 0.96);
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.86), rgba(36, 79, 255, 0.46)),
    radial-gradient(circle, rgba(246, 241, 223, 0.28) 0 0.75px, transparent 1.25px) 0 0 / 5px 5px;
  border-left: 4px solid rgba(255, 122, 26, 0.88);
  box-shadow:
    inset 0 0 0 1px rgba(246, 241, 223, 0.18),
    inset 0 -2px 0 rgba(255, 122, 26, 0.72),
    0 16px 42px rgba(0, 0, 0, 0.28);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
  grid-column: 1;
  grid-row: 2;
  width: min(100%, 45ch);
  margin-top: 0;
  padding: clamp(24px, 2.4vw, 36px) clamp(18px, 2vw, 30px);
  color: rgba(246, 241, 223, 0.86);
  border: 1px solid rgba(36, 79, 255, 0.18);
  border-left: 1px solid rgba(255, 122, 26, 0.34);
  background:
    linear-gradient(180deg, rgba(2, 7, 13, 0.74), rgba(2, 7, 13, 0.56)),
    repeating-linear-gradient(180deg, rgba(36, 79, 255, 0.055) 0 1px, transparent 1px 28px);
  box-shadow:
    inset 3px 0 0 rgba(255, 122, 26, 0.38),
    0 24px 80px rgba(0, 0, 0, 0.22);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::before{
  color: rgba(70, 198, 130, 0.72);
  border-bottom-color: rgba(70, 198, 130, 0.32);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody p{
  color: rgba(246, 241, 223, 0.84);
  font-size: clamp(14px, 0.98vw, 17px);
  line-height: 1.58;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody p:first-child{
  color: rgba(246, 241, 223, 0.92);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  grid-column: 1;
  grid-row: 3;
  margin-top: 0;
  padding: clamp(12px, 1.2vw, 18px) clamp(16px, 1.8vw, 26px) 0;
  color: rgba(255, 79, 154, 0.76);
  border-top-color: rgba(255, 79, 154, 0.64);
  border-right: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: start;
  display: block;
  height: clamp(600px, 69svh, 760px);
  min-height: 0;
  margin: clamp(10px, 1.2vw, 18px) 0 0;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(36, 79, 255, 0.34);
  background:
    linear-gradient(180deg, rgba(248, 250, 255, 0.94), rgba(226, 233, 250, 0.9)),
    radial-gradient(circle, rgba(36, 79, 255, 0.11) 0 0.55px, transparent 0.92px) 0 0 / 3px 3px;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.52),
    0 30px 90px rgba(0, 0, 0, 0.34);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  opacity: 0.7;
  mix-blend-mode: multiply;
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.55), rgba(36, 79, 255, 0.55)) 4.8% 18% / 84% 1px no-repeat,
    linear-gradient(90deg, rgba(36, 79, 255, 0.18) 0 1px, transparent 1px) 0 0 / 25% 100%,
    linear-gradient(180deg, rgba(36, 79, 255, 0.14) 0 1px, transparent 1px) 0 0 / 100% 25%,
    linear-gradient(132deg, transparent 0 49.4%, rgba(36, 79, 255, 0.7) 49.5% 50%, transparent 50.1%) 73% 8.5% / 124px 86px no-repeat;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
  content: "ascii\Aminimalist";
  position: absolute;
  right: 5.5%;
  top: 11.2%;
  bottom: auto;
  left: auto;
  z-index: 12;
  width: max-content;
  padding-left: 58px;
  white-space: pre;
  color: rgba(36, 79, 255, 0.96);
  background:
    linear-gradient(132deg, transparent 0 46%, rgba(36, 79, 255, 0.82) 47% 50%, transparent 51%) 0 50% / 46px 26px no-repeat,
    linear-gradient(90deg, rgba(36, 79, 255, 0.78), rgba(36, 79, 255, 0.78)) 0 50% / 51px 1px no-repeat;
  font: 800 clamp(12px, 1.05vw, 17px)/0.92 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  opacity: 0.95;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure{
  position: absolute;
  margin: 0;
  overflow: hidden;
  border-radius: 0;
  border-color: rgba(36, 79, 255, 0.5);
  background: var(--process-paper);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.34),
    0 18px 42px rgba(7, 28, 110, 0.16);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure::after{
  background: rgba(239, 240, 247, 0.82);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 6%;
  top: 21.5%;
  width: 66%;
  aspect-ratio: 0.786;
  z-index: 4;
  background: #0733dd;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither::before{
  opacity: 0.48;
  background:
    radial-gradient(circle, rgba(239, 240, 247, 0.86) 0 1px, transparent 1.55px) 0 0 / 5px 5px,
    linear-gradient(rgba(36, 79, 255, 0.58), rgba(36, 79, 255, 0.58));
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither img{
  opacity: 0.92;
  filter: grayscale(1) contrast(2.35) brightness(1.18);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 43.5%;
  top: 25.5%;
  width: 54%;
  aspect-ratio: 0.772;
  z-index: 6;
  background: rgba(248, 250, 255, 0.96);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii::before{
  opacity: 0.28;
  background:
    linear-gradient(90deg, rgba(255, 79, 154, 0.08), transparent 22%, transparent 76%, rgba(255, 122, 26, 0.08)),
    linear-gradient(180deg, transparent 0 44%, rgba(255, 79, 154, 0.22) 44% 44.2%, transparent 44.4%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii img{
  opacity: 1;
  filter: saturate(1.08) contrast(1.12) brightness(0.98);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-strip,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample{
  display: none;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    grid-template-columns: minmax(290px, 0.82fr) minmax(500px, 1.18fr);
    padding-inline: clamp(42px, 5.1vw, 66px);
    column-gap: clamp(24px, 3.4vw, 48px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(44px, 4.9vw, 68px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(560px, 66svh, 700px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    margin: -28px 0 -36px;
    padding: 94px 18px 112px;
    row-gap: 20px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-column: 1;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
    grid-row: 1;
    max-width: none;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    grid-row: 2;
    height: clamp(500px, 128vw, 650px);
    margin-top: 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
    grid-row: 3;
    width: 100%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-row: 4;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 9.8ch;
    font-size: clamp(42px, 12.2vw, 66px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    max-width: none;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 4%;
    top: 23%;
    width: 67%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 40%;
    top: 27.5%;
    width: 58%;
  }
}

@media (max-width: 560px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    padding-inline: 15px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
    background:
      linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.08) 14%, rgba(5, 5, 5, 0.08) 78%, #050505 100%),
      linear-gradient(90deg, rgba(255, 122, 26, 0.62) 0 2px, transparent 2px) 24px 0 / 100% 100% no-repeat,
      linear-gradient(90deg, rgba(36, 79, 255, 0.11) 0 1px, transparent 1px) 0 0 / 20% 100%,
      linear-gradient(180deg, rgba(36, 79, 255, 0.075) 0 1px, transparent 1px) 0 0 / 100% 9%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(39px, 11.4vw, 54px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(455px, 118vw, 590px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
    top: 8%;
    right: 5%;
    font-size: 11px;
    padding-left: 45px;
    background:
      linear-gradient(132deg, transparent 0 46%, rgba(36, 79, 255, 0.82) 47% 50%, transparent 51%) 0 50% / 35px 22px no-repeat,
      linear-gradient(90deg, rgba(36, 79, 255, 0.78), rgba(36, 79, 255, 0.78)) 0 50% / 39px 1px no-repeat;
  }
}

/* Comment pass: keep the emergence copy visible and quiet the process index. */
.workShell[data-work="diffractive-flora"] .flora-emergence-copy,
.workShell[data-work="diffractive-flora"] .flora-language-copy{
  transform: translateX(clamp(-24px, -1.4vw, -12px));
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-process-index{
  width: var(--flora-width);
  max-width: var(--flora-width);
  isolation: isolate;
  min-height: clamp(940px, 82vw, 1280px);
  margin: clamp(8px, 1.6vw, 28px) auto;
  padding: clamp(42px, 5.4vw, 86px) clamp(18px, 3.4vw, 52px) clamp(70px, 7vw, 120px);
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: clamp(18px, 2.6vw, 42px);
  align-items: stretch;
  color: var(--flora-paper);
  border-top: 1px solid var(--flora-line-strong);
  border-bottom: 1px solid var(--flora-line);
  background:
    radial-gradient(ellipse at 28% 40%, rgba(255, 79, 154, 0.08), transparent 34%),
    radial-gradient(ellipse at 80% 82%, rgba(246, 241, 223, 0.06), transparent 26%),
    linear-gradient(180deg, rgba(246, 241, 223, 0.028), rgba(5, 5, 5, 0)),
    linear-gradient(142deg, #030403 0%, #060505 58%, #020202 100%);
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-process-index::before,
.workShell[data-work="diffractive-flora"] .workComposite.flora-process-index::after,
.workShell[data-work="diffractive-flora"] .flora-process-index-image::before,
.workShell[data-work="diffractive-flora"] .flora-process-index-image::after,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy::before,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy::after,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textLabel::after,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textTitle::before{
  content: none;
  display: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index > *{
  position: relative;
  z-index: 1;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-image{
  position: absolute;
  left: clamp(-150px, -7vw, -72px);
  top: clamp(-58px, -3.2vw, -22px);
  bottom: clamp(-98px, -5.4vw, -42px);
  width: min(66vw, 900px);
  z-index: 0;
  overflow: visible;
  background: transparent;
  opacity: 0.82;
  mix-blend-mode: screen;
  pointer-events: none;
  transform: none;
  -webkit-mask-image:
    linear-gradient(90deg, #000 0 60%, rgba(0, 0, 0, 0.78) 73%, transparent 100%),
    linear-gradient(180deg, transparent 0, #000 10%, #000 86%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(90deg, #000 0 60%, rgba(0, 0, 0, 0.78) 73%, transparent 100%),
    linear-gradient(180deg, transparent 0, #000 10%, #000 86%, transparent 100%);
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-image img{
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: 58% 52%;
  filter: saturate(1.34) contrast(1.16) brightness(0.76);
  transform: scale(1.08);
  -webkit-mask-image: none;
  mask-image: none;
  box-shadow: none;
  border: 0;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy{
  grid-column: 7 / -1;
  grid-row: 1;
  position: relative;
  z-index: 3;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
  gap: clamp(14px, 1.6vw, 24px);
  align-self: start;
  max-width: 58ch;
  padding: clamp(22px, 2.4vw, 38px) clamp(22px, 3vw, 54px) clamp(34px, 3.8vw, 64px);
  border-top: 0;
  background: transparent;
  pointer-events: auto;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy::before{
  content: "";
  display: block;
  position: absolute;
  inset: clamp(-72px, -5vw, -34px) clamp(-120px, -7vw, -58px) clamp(-96px, -6vw, -44px) clamp(-210px, -12vw, -110px);
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 56% 34%, rgba(2, 2, 2, 0.94) 0 32%, rgba(2, 2, 2, 0.82) 48%, rgba(2, 2, 2, 0.38) 66%, transparent 84%),
    radial-gradient(ellipse at 76% 74%, rgba(2, 2, 2, 0.78) 0 24%, rgba(2, 2, 2, 0.4) 48%, transparent 76%),
    linear-gradient(90deg, transparent 0%, rgba(2, 2, 2, 0.42) 21%, rgba(2, 2, 2, 0.76) 46%, rgba(2, 2, 2, 0.62) 74%, transparent 100%);
  filter: blur(22px);
  opacity: 0.96;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textLabel,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textTitle,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody{
  grid-column: auto;
  grid-row: auto;
  align-self: auto;
  justify-self: auto;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textLabel{
  margin: 0;
  color: var(--flora-green-bright);
  font: 700 clamp(10px, 0.9vw, 13px)/1.4 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0.34em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textTitle{
  max-width: 12ch;
  margin: 0;
  color: var(--flora-paper);
  font: 700 clamp(54px, 6.2vw, 112px)/0.86 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: pre-line;
  mix-blend-mode: normal;
  text-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:first-of-type,
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(2),
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(3){
  grid-column: auto;
  grid-row: auto;
  align-self: auto;
  justify-self: auto;
  max-width: 44ch;
  margin: 0;
  padding-top: clamp(10px, 1vw, 14px);
  border-top: 1px solid rgba(246, 241, 223, 0.12);
  color: rgba(246, 241, 223, 0.74);
  font: 400 clamp(15px, 1.12vw, 18px)/1.68 "EB Garamond", var(--serif);
  letter-spacing: 0.01em;
  text-transform: none;
  white-space: pre-line;
  text-shadow: none;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody::first-line{
  color: var(--flora-orange);
  font-family: "Montserrat", "Didact Gothic", var(--sans);
  font-size: 0.78em;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .flora-process-index-detail{
  display: block;
  position: absolute;
  right: clamp(-150px, -8vw, -68px);
  bottom: clamp(-112px, -6vw, -54px);
  z-index: 1;
  width: clamp(420px, 38vw, 700px);
  height: clamp(360px, 31vw, 540px);
  overflow: visible;
  background: transparent;
  opacity: 0.38;
  mix-blend-mode: screen;
  pointer-events: none;
  -webkit-mask-image: radial-gradient(ellipse at 50% 54%, rgba(0, 0, 0, 0.84) 0 38%, rgba(0, 0, 0, 0.42) 61%, transparent 84%);
  mask-image: radial-gradient(ellipse at 50% 54%, rgba(0, 0, 0, 0.84) 0 38%, rgba(0, 0, 0, 0.42) 61%, transparent 84%);
}

.workShell[data-work="diffractive-flora"] .flora-process-index-detail img{
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: 50% 52%;
  filter: grayscale(1) contrast(1.28) brightness(0.58);
  border: 0;
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-emergence-copy,
  .workShell[data-work="diffractive-flora"] .flora-language-copy{
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-process-index{
    width: min(92vw, 720px);
    max-width: min(92vw, 720px);
    margin: 0 auto;
    min-height: clamp(980px, 170vw, 1280px);
    padding: clamp(28px, 7vw, 44px) 0 clamp(72px, 14vw, 110px);
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: clamp(18px, 6vw, 30px);
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-image,
  .workShell[data-work="diffractive-flora"] .flora-process-index-copy,
  .workShell[data-work="diffractive-flora"] .flora-process-index-detail{
    grid-column: 1;
    grid-row: auto;
    max-width: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-image{
    position: absolute;
    left: -28%;
    top: -3%;
    bottom: auto;
    width: 132%;
    height: 54%;
    opacity: 0.68;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-image img{
    height: 100%;
    aspect-ratio: auto;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    padding-top: clamp(320px, 68vw, 480px);
    background: transparent;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy::before{
    inset: clamp(210px, 48vw, 340px) -18vw clamp(-80px, -10vw, -34px);
    background:
      radial-gradient(ellipse at 50% 32%, rgba(2, 2, 2, 0.92) 0 34%, rgba(2, 2, 2, 0.72) 54%, transparent 82%),
      linear-gradient(180deg, transparent 0%, rgba(2, 2, 2, 0.5) 16%, rgba(2, 2, 2, 0.78) 48%, transparent 100%);
    filter: blur(18px);
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-detail{
    position: absolute;
    right: -24%;
    bottom: -5%;
    width: 116%;
    height: 34%;
    opacity: 0.24;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textTitle{
    max-width: 10ch;
    font-size: clamp(48px, 14vw, 86px);
    line-height: 0.9;
  }

  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody,
  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:first-of-type,
  .workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(2),
.workShell[data-work="diffractive-flora"] .flora-process-index-copy .textBody:nth-of-type(3){
  max-width: 100%;
  font-size: clamp(15px, 4.2vw, 18px);
  }
}

/* Comment pass: smooth the early section rhythm through the animated plate. */
.workShell[data-work="diffractive-flora"] .flora-emergence-copy,
.workShell[data-work="diffractive-flora"] .flora-language-copy{
  transform: translateX(clamp(14px, 1.2vw, 24px));
}

/* Comment pass: rebalance the gesture plate and opening strip crops. */
.workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section{
  position: relative;
  min-height: clamp(820px, 102vh, 1160px);
  grid-template-columns: minmax(34px, 0.46fr) repeat(10, minmax(0, 1fr)) minmax(34px, 0.46fr);
  grid-template-rows: clamp(68px, 7vw, 112px) auto minmax(300px, 0.44fr) clamp(120px, 12vw, 188px);
  gap: clamp(18px, 2.2vw, 34px);
  background:
    radial-gradient(ellipse at 24% 70%, rgba(102, 199, 255, 0.08) 0%, transparent 42%),
    radial-gradient(ellipse at 50% 50%, rgba(255, 79, 154, 0.06) 0%, transparent 48%),
    linear-gradient(90deg, rgba(5, 5, 5, 0.98) 0%, rgba(5, 5, 5, 0.84) 30%, rgba(5, 5, 5, 0.38) 58%, rgba(5, 5, 5, 0.12) 100%);
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.96) 0%, rgba(5, 5, 5, 0.72) 18%, rgba(5, 5, 5, 0.28) 43%, transparent 72%),
    linear-gradient(180deg, rgba(5, 5, 5, 0.18) 0%, transparent 34%, rgba(5, 5, 5, 0.18) 72%, rgba(5, 5, 5, 0.62) 100%);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section::after{
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  z-index: 2;
  height: clamp(130px, 16vh, 210px);
  background: linear-gradient(180deg, transparent 0%, rgba(5, 5, 5, 0.34) 52%, #050505 100%);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-gesture-main{
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  opacity: 0.92;
}

.workShell[data-work="diffractive-flora"] .flora-gesture-main::after{
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.92) 0%, rgba(5, 5, 5, 0.76) 18%, rgba(5, 5, 5, 0.34) 44%, transparent 74%),
    linear-gradient(180deg, rgba(5, 5, 5, 0.18), transparent 30%, rgba(5, 5, 5, 0.34));
}

.workShell[data-work="diffractive-flora"] .flora-gesture-main img{
  height: 100%;
  min-height: 100%;
  object-position: 58% 36%;
  filter: saturate(1.12) contrast(1.08) brightness(0.86);
  transform: scale(1.05);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-copy{
  grid-column: 4 / span 4;
  grid-row: 2;
  align-self: start;
  z-index: 4;
  max-width: min(620px, 100%);
  padding: clamp(18px, 2.5vw, 38px) clamp(20px, 3vw, 44px);
  background:
    radial-gradient(ellipse at 18% 34%, rgba(5, 5, 5, 0.9) 0%, rgba(5, 5, 5, 0.64) 52%, transparent 78%),
    linear-gradient(90deg, rgba(5, 5, 5, 0.74) 0%, rgba(5, 5, 5, 0.48) 68%, rgba(5, 5, 5, 0.12) 100%);
  border: 0;
  box-shadow: -34px 0 72px rgba(0, 0, 0, 0.5), 28px 20px 88px rgba(0, 0, 0, 0.34);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-inset{
  grid-column: 3 / span 3;
  grid-row: 3;
  z-index: 5;
  justify-self: center;
  align-self: start;
  width: min(500px, 100%);
  margin-top: clamp(8px, 1.4vw, 22px);
  padding: clamp(8px, 1vw, 12px);
  transform: translate(clamp(-24px, -1.4vw, -10px), clamp(-54px, -3.6vw, -28px));
  box-shadow: 26px 26px 0 rgba(102, 199, 255, 0.08), 0 34px 80px rgba(0, 0, 0, 0.42);
}

.workShell[data-work="diffractive-flora"] .flora-gesture-inset img{
  width: 100%;
  aspect-ratio: 4 / 5;
  height: auto;
  object-fit: cover;
  object-position: 52% 46%;
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate{
  position: relative;
  z-index: 1;
  margin-top: clamp(-44px, -2.6vw, -22px);
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate::before{
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  height: clamp(120px, 14vh, 190px);
  background: linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.58) 34%, transparent 100%);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-trace-plate img{
  max-height: clamp(560px, 78vh, 900px);
  object-position: center 48%;
}

.workShell[data-work="diffractive-flora"] .flora-opening-strip{
  align-items: center;
}

.workShell[data-work="diffractive-flora"] .flora-opening-strip .workStrip__item:nth-child(1){
  align-self: center;
  transform: translateY(clamp(-18px, -1.2vw, -8px));
}

.workShell[data-work="diffractive-flora"] .flora-opening-strip .workStrip__item:nth-child(1) img{
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: 50% 55%;
}

.workShell[data-work="diffractive-flora"] .workComposite.flora-primary-film-section{
  margin-top: clamp(18px, 3vw, 48px);
  padding-top: clamp(26px, 3.2vw, 48px);
  gap: clamp(28px, 4.8vw, 78px);
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] .flora-emergence-copy,
  .workShell[data-work="diffractive-flora"] .flora-language-copy{
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section{
    width: min(92vw, 720px);
    margin: 0 auto;
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: clamp(16px, 5vw, 28px);
    overflow: visible;
    background: transparent;
  }

  .workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section::before,
  .workShell[data-work="diffractive-flora"] .workComposite.flora-gesture-section::after{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-gesture-main{
    position: relative;
    inset: auto;
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    height: auto;
    opacity: 1;
  }

  .workShell[data-work="diffractive-flora"] .flora-gesture-copy,
  .workShell[data-work="diffractive-flora"] .flora-gesture-inset{
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    max-width: none;
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-gesture-copy{
    background: rgba(5, 5, 5, 0.9);
    box-shadow: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-gesture-inset{
    justify-self: stretch;
    margin-top: 0;
  }

  .workShell[data-work="diffractive-flora"] .flora-trace-plate{
    margin-top: 0;
  }

  .workShell[data-work="diffractive-flora"] .flora-trace-plate::before{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-opening-strip .workStrip__item:nth-child(1){
    transform: none !important;
  }
}

.workShell[data-work="diffractive-flora"] .flora-glossary{
  --glossary-accent: var(--flora-orange);
  --glossary-grid-opacity: 0.52;
  --glossary-scan-opacity: 0.46;
  --glossary-color-opacity: 0.18;
  --glossary-color-clip: inset(12% 58% 18% 18%);
  --glossary-rgb-opacity: 0.12;
  --glossary-echo-opacity: 0.08;
  --glossary-crop-top: 18%;
  --glossary-crop-left: 57%;
  --glossary-archive-opacity: 0.42;
  grid-column: 1 / -1;
  width: min(1460px, 94vw);
  max-width: none;
  margin: clamp(28px, 5vw, 84px) auto;
  display: grid;
  grid-template-columns: minmax(420px, 1.12fr) minmax(430px, 0.88fr);
  grid-auto-rows: minmax(clamp(178px, 21vh, 260px), auto);
  gap: 0 clamp(32px, 5vw, 92px);
  align-items: start;
  border: 0;
  background: transparent;
  isolation: isolate;
  overflow: visible;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="diffractive-form"],
.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="material-semiotic"]{
  --glossary-accent: var(--flora-pink);
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="technical-image"]{
  --glossary-grid-opacity: 0.88;
  --glossary-scan-opacity: 0.82;
  --glossary-color-opacity: 0.12;
  --glossary-color-clip: inset(9% 64% 30% 12%);
  --glossary-crop-top: 14%;
  --glossary-crop-left: 60%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="diffractive-form"]{
  --glossary-grid-opacity: 0.64;
  --glossary-scan-opacity: 0.68;
  --glossary-color-opacity: 0.34;
  --glossary-color-clip: polygon(26% 5%, 100% 18%, 86% 85%, 32% 98%, 38% 44%);
  --glossary-rgb-opacity: 0.46;
  --glossary-crop-top: 21%;
  --glossary-crop-left: 25%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="material-semiotic"]{
  --glossary-grid-opacity: 0.58;
  --glossary-scan-opacity: 0.56;
  --glossary-color-opacity: 0.4;
  --glossary-color-clip: inset(0 0 0 50%);
  --glossary-rgb-opacity: 0.24;
  --glossary-crop-top: 44%;
  --glossary-crop-left: 24%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="image-process"]{
  --glossary-grid-opacity: 0.7;
  --glossary-scan-opacity: 0.92;
  --glossary-color-opacity: 0.2;
  --glossary-color-clip: inset(40% 20% 10% 19%);
  --glossary-rgb-opacity: 0.26;
  --glossary-echo-opacity: 0.3;
  --glossary-crop-top: 61%;
  --glossary-crop-left: 54%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="material-correspondence"]{
  --glossary-grid-opacity: 0.5;
  --glossary-scan-opacity: 0.48;
  --glossary-color-opacity: 0.25;
  --glossary-color-clip: inset(20% 14% 52% 18%);
  --glossary-crop-top: 35%;
  --glossary-crop-left: 56%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="post-photo-herbarium"]{
  --glossary-grid-opacity: 0.74;
  --glossary-scan-opacity: 0.6;
  --glossary-color-opacity: 0.2;
  --glossary-color-clip: inset(7% 22% 62% 28%);
  --glossary-archive-opacity: 0.95;
  --glossary-crop-top: 58%;
  --glossary-crop-left: 25%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
  position: sticky;
  top: clamp(82px, 10vh, 130px);
  grid-column: 1;
  grid-row: 1 / span 6;
  width: 100%;
  min-height: clamp(720px, 84vh, 980px);
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 42%, rgba(246, 241, 223, 0.08), transparent 32%),
    linear-gradient(180deg, rgba(102, 199, 255, 0.055), rgba(5, 5, 5, 0) 22%),
    linear-gradient(180deg, rgba(5, 5, 5, 0.94), #020202 82%);
  box-shadow:
    inset 0 0 0 1px rgba(102, 199, 255, 0.14),
    inset 0 0 84px rgba(102, 199, 255, 0.07),
    0 42px 120px rgba(0, 0, 0, 0.36);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-specimen::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  background:
    repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.14) 0 1px, transparent 1px clamp(42px, 4vw, 64px)),
    repeating-linear-gradient(180deg, rgba(102, 199, 255, 0.1) 0 1px, transparent 1px clamp(46px, 4.4vw, 72px));
  opacity: var(--glossary-grid-opacity);
  mix-blend-mode: screen;
  pointer-events: none;
  transition: opacity 260ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-specimen::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 10;
  background:
    radial-gradient(circle at 50% 50%, transparent 36%, rgba(5, 5, 5, 0.52) 88%),
    repeating-radial-gradient(circle at 42% 38%, rgba(246, 241, 223, 0.055) 0 1px, transparent 1px 4px);
  opacity: 0.62;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .specimenLayer{
  position: absolute;
  inset: 4% 4%;
  z-index: 1;
  background-image: var(--glossary-specimen-image);
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 94%;
  pointer-events: none;
  transition:
    clip-path 320ms var(--ease),
    filter 320ms var(--ease),
    opacity 320ms var(--ease),
    transform 320ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--base{
  opacity: 0.68;
  filter: grayscale(1) saturate(0) contrast(1.46) brightness(0.76);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .specimenLayer--glow{
  opacity: 0.34;
  filter: grayscale(1) saturate(0) contrast(1.5) brightness(1.65) blur(18px);
  mix-blend-mode: screen;
  transform: scale(1.025);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--color{
  z-index: 4;
  opacity: var(--glossary-color-opacity);
  clip-path: var(--glossary-color-clip);
  filter: saturate(1.18) contrast(1.1) brightness(1);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a,
.workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b{
  z-index: 5;
  opacity: var(--glossary-rgb-opacity);
  clip-path: var(--glossary-color-clip);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a{
  filter: saturate(1.9) hue-rotate(118deg) contrast(1.25);
  transform: translate(7px, -3px);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b{
  filter: saturate(2) hue-rotate(286deg) contrast(1.2);
  transform: translate(-7px, 4px);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--echo{
  z-index: 2;
  opacity: var(--glossary-echo-opacity);
  filter: grayscale(1) contrast(1.25) brightness(1.1);
  mix-blend-mode: screen;
  transform: translate(18px, 24px) scale(1.012);
}

.workShell[data-work="diffractive-flora"] .specimenScanBar{
  position: absolute;
  left: 0;
  right: 0;
  top: 18%;
  z-index: 8;
  height: clamp(3px, 0.48vw, 6px);
  background: linear-gradient(90deg, transparent, rgba(102, 199, 255, 0.92) 32%, rgba(246, 241, 223, 0.6) 50%, rgba(102, 199, 255, 0.92) 68%, transparent);
  box-shadow: 0 0 28px rgba(102, 199, 255, 0.48), 0 0 72px rgba(246, 241, 223, 0.18);
  opacity: var(--glossary-scan-opacity);
  animation: floraSpecimenScan 6s linear infinite;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="image-process"] .specimenScanBar{
  animation-duration: 2.8s;
}

@keyframes floraSpecimenScan{
  0%{ transform: translateY(-12vh); }
  100%{ transform: translateY(76vh); }
}

.workShell[data-work="diffractive-flora"] .specimenRail{
  position: absolute;
  left: clamp(22px, 3vw, 52px);
  right: clamp(22px, 3vw, 52px);
  z-index: 6;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(102, 199, 255, 0.72), transparent);
  box-shadow: 0 0 18px rgba(102, 199, 255, 0.28);
  opacity: var(--glossary-grid-opacity);
}

.workShell[data-work="diffractive-flora"] .specimenRail--top{ top: 17%; }
.workShell[data-work="diffractive-flora"] .specimenRail--mid{ top: 50%; }
.workShell[data-work="diffractive-flora"] .specimenRail--low{ top: 78%; }

.workShell[data-work="diffractive-flora"] .specimenMeta,
.workShell[data-work="diffractive-flora"] .specimenCrop,
.workShell[data-work="diffractive-flora"] .specimenActiveCard{
  position: absolute;
  z-index: 12;
  color: rgba(246, 241, 223, 0.8);
  font: 700 clamp(9px, 0.72vw, 11px)/1.45 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: pre-line;
}

.workShell[data-work="diffractive-flora"] .specimenMeta{
  color: rgba(32, 255, 149, 0.72);
  text-shadow: 0 0 16px rgba(32, 255, 149, 0.12);
}

.workShell[data-work="diffractive-flora"] .specimenMeta--one{ top: clamp(20px, 3vw, 42px); left: clamp(22px, 3vw, 46px); }
.workShell[data-work="diffractive-flora"] .specimenMeta--two{ top: 11%; right: clamp(20px, 3vw, 44px); text-align: right; color: rgba(255, 79, 154, 0.72); }
.workShell[data-work="diffractive-flora"] .specimenMeta--three{ bottom: 13%; left: clamp(22px, 3vw, 46px); }
.workShell[data-work="diffractive-flora"] .specimenMeta--four{ right: clamp(20px, 3vw, 44px); bottom: clamp(18px, 2.8vw, 38px); text-align: right; }

.workShell[data-work="diffractive-flora"] .specimenCrop{
  top: var(--glossary-crop-top);
  left: var(--glossary-crop-left);
  width: clamp(150px, 17vw, 240px);
  min-height: clamp(76px, 7vw, 104px);
  padding: 12px 14px;
  display: grid;
  gap: 7px;
  background:
    linear-gradient(135deg, rgba(5, 5, 5, 0.88), rgba(5, 5, 5, 0.42)),
    repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.28) 0 1px, transparent 1px 10px);
  border: 1px solid rgba(102, 199, 255, 0.48);
  box-shadow: 0 0 0 1px rgba(246, 241, 223, 0.05), 0 18px 50px rgba(0, 0, 0, 0.42);
  color: rgba(246, 241, 223, 0.88);
  transform: translate(-50%, -50%);
  transition: top 300ms var(--ease), left 300ms var(--ease), border-color 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .specimenCrop::before{
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(102, 199, 255, 0.34);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .specimenCropLabel{
  color: var(--glossary-accent);
}

.workShell[data-work="diffractive-flora"] .specimenCropDetail{
  max-width: 20ch;
  color: rgba(246, 241, 223, 0.82);
  font-weight: 650;
}

.workShell[data-work="diffractive-flora"] .specimenActiveCard{
  left: clamp(22px, 3vw, 46px);
  bottom: clamp(24px, 3vw, 48px);
  display: grid;
  gap: 4px;
  padding-left: 16px;
  border-left: 2px solid var(--glossary-accent);
  color: rgba(246, 241, 223, 0.88);
}

.workShell[data-work="diffractive-flora"] .specimenActiveCode{
  color: var(--glossary-accent);
}

.workShell[data-work="diffractive-flora"] .specimenActiveTerm{
  max-width: 22ch;
  font-family: "Cinzel Decorative", "Bodoni Moda", var(--display);
  font-size: clamp(17px, 1.4vw, 28px);
  font-weight: 400;
  line-height: 0.98;
  color: var(--flora-paper);
}

.workShell[data-work="diffractive-flora"] .specimenGraph{
  position: absolute;
  left: clamp(24px, 3vw, 48px);
  top: 58%;
  z-index: 11;
  width: clamp(112px, 13vw, 180px);
  height: clamp(46px, 5vw, 70px);
  opacity: calc(var(--glossary-grid-opacity) + 0.08);
  background:
    linear-gradient(135deg, transparent 0 12%, rgba(102, 199, 255, 0.52) 12.5% 13.5%, transparent 14% 33%, rgba(102, 199, 255, 0.42) 33.5% 35%, transparent 36% 60%, rgba(255, 79, 154, 0.5) 60.5% 62%, transparent 63%),
    repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.18) 0 1px, transparent 1px 18px),
    repeating-linear-gradient(180deg, rgba(102, 199, 255, 0.13) 0 1px, transparent 1px 16px);
  border-left: 1px solid rgba(102, 199, 255, 0.38);
  border-bottom: 1px solid rgba(102, 199, 255, 0.38);
}

.workShell[data-work="diffractive-flora"] .specimenBarcode{
  position: absolute;
  right: clamp(22px, 3vw, 46px);
  top: 66%;
  z-index: 12;
  width: clamp(96px, 11vw, 160px);
  height: 38px;
  opacity: var(--glossary-archive-opacity);
  background:
    repeating-linear-gradient(90deg, rgba(246, 241, 223, 0.84) 0 2px, transparent 2px 6px, rgba(246, 241, 223, 0.42) 6px 8px, transparent 8px 15px),
    linear-gradient(180deg, transparent, rgba(102, 199, 255, 0.16));
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card{
  position: relative;
  grid-column: 2;
  width: 100%;
  max-width: none;
  min-height: auto;
  padding: clamp(30px, 3.2vw, 54px) clamp(22px, 3vw, 44px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.96), rgba(5, 5, 5, 0.9)),
    linear-gradient(180deg, transparent, rgba(102, 199, 255, 0.035));
  border-top: 1px solid rgba(246, 241, 223, 0.18);
  border-bottom: 1px solid rgba(246, 241, 223, 0.07);
  cursor: pointer;
  outline: 0;
  box-shadow: -36px 0 90px rgba(5, 5, 5, 0.72);
  transition: border-color 220ms var(--ease), background 220ms var(--ease), transform 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
  content: "";
  position: absolute;
  top: 50%;
  left: clamp(-86px, -5vw, -42px);
  width: clamp(42px, 5vw, 84px);
  height: 1px;
  background: linear-gradient(90deg, rgba(102, 199, 255, 0.05), var(--glossary-accent));
  opacity: 0;
  transform: scaleX(0.2);
  transform-origin: right center;
  transition: opacity 220ms var(--ease), transform 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card::after{
  content: attr(data-index-label);
  position: absolute;
  top: clamp(20px, 2.3vw, 34px);
  right: clamp(20px, 2.4vw, 38px);
  color: rgba(102, 199, 255, 0.42);
  font: 700 11px/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
  border-top-color: color-mix(in srgb, var(--glossary-accent) 72%, transparent);
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.98), rgba(5, 5, 5, 0.88)),
    linear-gradient(135deg, color-mix(in srgb, var(--glossary-accent) 14%, transparent), transparent 48%);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
  transform: translateX(clamp(-12px, -0.8vw, -6px));
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible::before{
  opacity: 1;
  transform: scaleX(1);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textLabel{
  color: var(--flora-orange);
  font-size: clamp(11px, 0.82vw, 13px);
  letter-spacing: 0;
  opacity: 0.78;
  transition: color 180ms var(--ease), opacity 180ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover .textLabel,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible .textLabel,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active .textLabel{
  color: var(--glossary-accent);
  opacity: 1;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
  max-width: 13ch;
  margin-top: clamp(12px, 1.4vw, 22px);
  color: var(--flora-paper);
  font: 400 clamp(34px, 4vw, 68px)/0.92 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
  max-width: 34ch;
  margin-top: clamp(24px, 2.8vw, 44px);
  font: 600 clamp(14px, 1.12vw, 18px)/1.55 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: none;
  color: rgba(246, 241, 223, 0.76);
}

@media (max-width: 980px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    width: min(92vw, 760px);
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: clamp(16px, 4vw, 28px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    position: relative;
    top: auto;
    grid-column: 1;
    grid-row: auto;
    min-height: clamp(520px, 108vw, 760px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: 5% 2%;
    background-size: auto 88%;
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta--two,
  .workShell[data-work="diffractive-flora"] .specimenMeta--three,
  .workShell[data-work="diffractive-flora"] .specimenGraph{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    width: min(46vw, 190px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    grid-column: 1;
    padding: clamp(24px, 7vw, 38px) clamp(18px, 6vw, 30px);
    box-shadow: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
    left: 0;
    top: 0;
    width: 100%;
    background: linear-gradient(90deg, var(--glossary-accent), transparent);
    transform-origin: left center;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(30px, 10vw, 48px);
  }
}

.workShell[data-work="diffractive-flora"] .flora-glossary{
  --glossary-color-opacity: 0.74;
  --glossary-color-clip: inset(0);
  --glossary-rgb-opacity: 0.22;
  --glossary-echo-opacity: 0.1;
  --glossary-crop-top: 28%;
  --glossary-crop-left: 62%;
  width: min(1500px, 95vw);
  grid-template-columns: minmax(215px, 0.62fr) minmax(380px, 0.96fr) minmax(215px, 0.62fr);
  grid-template-rows: repeat(6, minmax(clamp(116px, 14vh, 178px), auto));
  gap: clamp(10px, 1.6vw, 24px) clamp(16px, 2vw, 34px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="technical-image"]{
  --glossary-color-opacity: 0.7;
  --glossary-color-clip: inset(0);
  --glossary-crop-top: 29%;
  --glossary-crop-left: 66%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="diffractive-form"]{
  --glossary-color-opacity: 0.7;
  --glossary-color-clip: polygon(19% 5%, 100% 10%, 91% 43%, 58% 52%, 35% 37%);
  --glossary-rgb-opacity: 0.54;
  --glossary-crop-top: 22%;
  --glossary-crop-left: 34%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="material-semiotic"]{
  --glossary-color-opacity: 0.62;
  --glossary-color-clip: polygon(0 31%, 58% 28%, 57% 56%, 0 60%);
  --glossary-rgb-opacity: 0.28;
  --glossary-crop-top: 39%;
  --glossary-crop-left: 68%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="image-process"]{
  --glossary-color-opacity: 0.58;
  --glossary-color-clip: polygon(33% 48%, 100% 46%, 100% 72%, 41% 75%);
  --glossary-rgb-opacity: 0.34;
  --glossary-echo-opacity: 0.38;
  --glossary-crop-top: 65%;
  --glossary-crop-left: 33%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="material-correspondence"]{
  --glossary-color-opacity: 0.66;
  --glossary-color-clip: polygon(0 56%, 56% 58%, 53% 82%, 0 87%);
  --glossary-crop-top: 75%;
  --glossary-crop-left: 66%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="post-photo-herbarium"]{
  --glossary-color-opacity: 0.54;
  --glossary-color-clip: polygon(38% 72%, 100% 68%, 100% 100%, 45% 100%);
  --glossary-rgb-opacity: 0.3;
  --glossary-crop-top: 82%;
  --glossary-crop-left: 34%;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
  grid-column: 2;
  grid-row: 1 / span 6;
  align-self: stretch;
  min-height: clamp(720px, 92vh, 940px);
  background:
    radial-gradient(circle at 50% 18%, rgba(102, 199, 255, 0.12), transparent 22%),
    radial-gradient(circle at 50% 50%, rgba(255, 79, 154, 0.075), transparent 36%),
    linear-gradient(180deg, rgba(5, 5, 5, 0.94), rgba(5, 5, 5, 0.98));
  box-shadow:
    inset 0 0 0 1px rgba(102, 199, 255, 0.18),
    inset 0 0 120px rgba(102, 199, 255, 0.08),
    0 44px 120px rgba(0, 0, 0, 0.42);
}

.workShell[data-work="diffractive-flora"] .specimenLayer{
  inset: 3% -5%;
  background-size: auto 90%;
  background-position: center 42%;
}

.workShell[data-work="diffractive-flora"] .specimenLayer--base{
  opacity: 0.58;
  filter: grayscale(0.18) saturate(1.16) contrast(1.16) brightness(0.76);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--glow{
  opacity: 0.16;
  filter: grayscale(0.35) saturate(1.2) contrast(1.3) brightness(1.5) blur(16px);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--color{
  opacity: var(--glossary-color-opacity);
  filter: saturate(1.55) contrast(1.13) brightness(0.98);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card{
  min-height: clamp(122px, 15vh, 186px);
  padding: clamp(18px, 2vw, 30px);
  justify-content: center;
  box-shadow: none;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0.94), rgba(5, 5, 5, 0.82)),
    linear-gradient(180deg, rgba(102, 199, 255, 0.04), transparent 52%);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image{
  grid-column: 1;
  grid-row: 1;
  align-self: end;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form{
  grid-column: 3;
  grid-row: 2;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic{
  grid-column: 1;
  grid-row: 3;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process{
  grid-column: 3;
  grid-row: 4;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
  grid-column: 1;
  grid-row: 5;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
  grid-column: 3;
  grid-row: 6;
  align-self: start;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
  text-align: right;
  align-items: flex-end;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
  text-align: left;
  align-items: flex-start;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
  max-width: 11.5ch;
  margin-top: clamp(8px, 0.9vw, 14px);
  font-size: clamp(25px, 2.9vw, 48px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
  max-width: 28ch;
  margin-top: clamp(14px, 1.6vw, 24px);
  font-size: clamp(12px, 0.98vw, 16px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
  top: 50%;
  width: clamp(32px, 4vw, 72px);
  opacity: 0.38;
  transform: scaleX(1);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence::before{
  right: clamp(-72px, -4vw, -32px);
  left: auto;
  transform-origin: left center;
  background: linear-gradient(90deg, var(--glossary-accent), rgba(102, 199, 255, 0.12));
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium::before{
  left: clamp(-72px, -4vw, -32px);
  right: auto;
  transform-origin: right center;
  background: linear-gradient(90deg, rgba(102, 199, 255, 0.12), var(--glossary-accent));
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image::after,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic::after,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence::after{
  left: clamp(18px, 1.8vw, 28px);
  right: auto;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
  transform: translateX(0);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence.is-active{
  transform: translateX(clamp(5px, 0.55vw, 9px));
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium.is-active{
  transform: translateX(clamp(-9px, -0.55vw, -5px));
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin{
  --pin-line: clamp(58px, 8vw, 128px);
  position: absolute;
  left: var(--pin-x, 50%);
  top: var(--pin-y, 50%);
  z-index: 16;
  display: grid;
  gap: 2px;
  min-width: 9ch;
  color: rgba(246, 241, 223, 0.66);
  font: 800 clamp(8px, 0.62vw, 10px)/1.1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
  transform: translate(-50%, -50%);
  opacity: 0.54;
  pointer-events: none;
  transition: color 220ms var(--ease), opacity 220ms var(--ease), transform 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin span{
  color: var(--flora-orange);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin b{
  max-width: 13ch;
  color: inherit;
  font-weight: 800;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin::before{
  content: "";
  position: absolute;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--glossary-accent);
  box-shadow: 0 0 18px color-mix(in srgb, var(--glossary-accent) 70%, transparent);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin::after{
  content: "";
  position: absolute;
  top: calc(50% + 2px);
  width: var(--pin-line);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(102, 199, 255, 0.62), var(--glossary-accent));
  opacity: 0.56;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin:nth-last-child(odd){
  text-align: right;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin:nth-last-child(odd)::before{
  right: calc(-1 * clamp(12px, 1.1vw, 18px));
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin:nth-last-child(odd)::after{
  right: calc(-1 * var(--pin-line) - clamp(10px, 1vw, 16px));
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin:nth-last-child(even){
  text-align: left;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin:nth-last-child(even)::before{
  left: calc(-1 * clamp(12px, 1.1vw, 18px));
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin:nth-last-child(even)::after{
  left: calc(-1 * var(--pin-line) - clamp(10px, 1vw, 16px));
  background: linear-gradient(90deg, var(--glossary-accent), rgba(102, 199, 255, 0.62), transparent);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active{
  color: var(--flora-paper);
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.04);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active span{
  color: var(--glossary-accent);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active::after{
  opacity: 1;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image{
  --pin-x: 27%;
  --pin-y: 25%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form{
  --pin-x: 74%;
  --pin-y: 34%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic{
  --pin-x: 26%;
  --pin-y: 47%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process{
  --pin-x: 75%;
  --pin-y: 59%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence{
  --pin-x: 27%;
  --pin-y: 73%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium{
  --pin-x: 76%;
  --pin-y: 84%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence{
  text-align: right;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image::before,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic::before,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence::before{
  right: calc(-1 * clamp(12px, 1.1vw, 18px));
  left: auto;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image::after,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic::after,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence::after{
  right: calc(-1 * var(--pin-line) - clamp(10px, 1vw, 16px));
  left: auto;
  background: linear-gradient(90deg, transparent, rgba(102, 199, 255, 0.62), var(--glossary-accent));
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium{
  text-align: left;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form::before,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process::before,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium::before{
  right: auto;
  left: calc(-1 * clamp(12px, 1.1vw, 18px));
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form::after,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process::after,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium::after{
  right: auto;
  left: calc(-1 * var(--pin-line) - clamp(10px, 1vw, 16px));
  background: linear-gradient(90deg, var(--glossary-accent), rgba(102, 199, 255, 0.62), transparent);
}

.workShell[data-work="diffractive-flora"] .specimenActiveCard{
  left: 50%;
  bottom: clamp(16px, 2vw, 30px);
  width: max-content;
  max-width: min(28ch, 86%);
  padding: 8px 14px 0;
  border-left: 0;
  border-top: 1px solid var(--glossary-accent);
  text-align: center;
  transform: translateX(-50%);
  background: linear-gradient(180deg, rgba(5, 5, 5, 0.72), transparent);
}

@media (max-width: 980px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    width: min(92vw, 760px);
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: clamp(18px, 5vw, 30px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    position: relative;
    top: auto;
    grid-column: 1;
    grid-row: auto;
    min-height: clamp(620px, 136vw, 900px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    grid-column: 1;
    grid-row: auto;
    min-height: auto;
    text-align: left;
    align-items: flex-start;
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
    left: 0;
    right: auto;
    top: 0;
    width: 100%;
    background: linear-gradient(90deg, var(--glossary-accent), transparent);
    transform-origin: left center;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
    transform: none !important;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin{
    --pin-line: clamp(26px, 8vw, 52px);
    font-size: 8px;
  }
}

.workShell[data-work="diffractive-flora"] .flora-glossary{
  --glossary-field-fade: rgba(5, 5, 5, 0.72);
  --glossary-color-opacity: 0.82;
  width: min(1540px, 96vw);
  margin-block: clamp(48px, 7vw, 110px);
  grid-template-columns: minmax(190px, 0.7fr) minmax(300px, 0.34fr) minmax(420px, 0.92fr) minmax(300px, 0.34fr) minmax(190px, 0.7fr);
  grid-template-rows: repeat(6, minmax(clamp(104px, 12.5vh, 154px), auto));
  gap: 0;
  padding-block: clamp(20px, 2.6vw, 44px);
  background:
    radial-gradient(ellipse at 50% 52%, rgba(102, 199, 255, 0.08), transparent 34%),
    linear-gradient(90deg, transparent, rgba(5, 5, 5, 0.28) 20%, rgba(5, 5, 5, 0.1) 50%, rgba(5, 5, 5, 0.28) 80%, transparent);
}

.workShell[data-work="diffractive-flora"] .flora-glossary::before{
  content: "";
  position: absolute;
  inset: clamp(8px, 1vw, 18px) 0;
  z-index: -1;
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(102, 199, 255, 0.08) 34%, rgba(255, 79, 154, 0.055) 50%, rgba(102, 199, 255, 0.08) 66%, transparent 92%),
    repeating-linear-gradient(180deg, rgba(246, 241, 223, 0.035) 0 1px, transparent 1px clamp(72px, 6vw, 104px));
  opacity: 0.64;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-glossary::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, #050505 0%, transparent 9%, transparent 91%, #050505 100%),
    linear-gradient(90deg, #050505 0%, transparent 11%, transparent 89%, #050505 100%);
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
  grid-column: 2 / span 3;
  grid-row: 1 / span 6;
  justify-self: center;
  width: min(100%, 760px);
  min-height: clamp(720px, 88vh, 940px);
  background:
    radial-gradient(ellipse at 50% 48%, rgba(246, 241, 223, 0.08), transparent 34%),
    radial-gradient(ellipse at 52% 50%, rgba(102, 199, 255, 0.11), transparent 48%),
    linear-gradient(90deg, transparent, rgba(5, 5, 5, 0.36) 22%, rgba(5, 5, 5, 0.12) 50%, rgba(5, 5, 5, 0.36) 78%, transparent);
  box-shadow: none;
  overflow: visible;
  mask-image: linear-gradient(180deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-specimen::before{
  inset: -2% -18%;
  background:
    repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.11) 0 1px, transparent 1px clamp(48px, 5vw, 82px)),
    repeating-linear-gradient(180deg, rgba(102, 199, 255, 0.08) 0 1px, transparent 1px clamp(42px, 4.2vw, 66px));
  opacity: calc(var(--glossary-grid-opacity) * 0.58);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-specimen::after{
  inset: -4% -18%;
  background:
    radial-gradient(ellipse at 50% 52%, transparent 22%, rgba(5, 5, 5, 0.18) 58%, rgba(5, 5, 5, 0.68) 92%),
    repeating-radial-gradient(circle at 46% 34%, rgba(246, 241, 223, 0.04) 0 1px, transparent 1px 5px);
  opacity: 0.56;
}

.workShell[data-work="diffractive-flora"] .specimenLayer{
  inset: -1% -13%;
  background-size: auto 93%;
  background-position: center 45%;
}

.workShell[data-work="diffractive-flora"] .specimenLayer--base{
  opacity: 0.52;
  filter: grayscale(0.08) saturate(1.18) contrast(1.08) brightness(0.76);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--glow{
  opacity: 0.13;
  filter: grayscale(0.2) saturate(1.18) contrast(1.16) brightness(1.42) blur(22px);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--color{
  mix-blend-mode: normal;
  filter: saturate(1.42) contrast(1.08) brightness(0.96);
}

.workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a,
.workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b{
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .specimenScanBar{
  left: -10%;
  right: -10%;
  opacity: calc(var(--glossary-scan-opacity) * 0.72);
}

.workShell[data-work="diffractive-flora"] .specimenRail{
  left: -6%;
  right: -6%;
  opacity: calc(var(--glossary-grid-opacity) * 0.48);
}

.workShell[data-work="diffractive-flora"] .specimenCrop{
  width: clamp(126px, 11vw, 176px);
  min-height: 0;
  padding: 8px 10px;
  gap: 4px;
  background: rgba(5, 5, 5, 0.48);
  border-color: rgba(102, 199, 255, 0.32);
  box-shadow: 0 0 34px rgba(102, 199, 255, 0.08);
  backdrop-filter: blur(2px);
}

.workShell[data-work="diffractive-flora"] .specimenCrop::before{
  inset: 7px;
  border-color: rgba(102, 199, 255, 0.2);
}

.workShell[data-work="diffractive-flora"] .specimenCropLabel,
.workShell[data-work="diffractive-flora"] .specimenCropDetail{
  font-size: clamp(8px, 0.58vw, 10px);
  line-height: 1.2;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card{
  z-index: 18;
  min-height: clamp(96px, 11vh, 136px);
  padding: clamp(14px, 1.4vw, 24px) clamp(10px, 1.6vw, 24px);
  background:
    linear-gradient(90deg, transparent, rgba(5, 5, 5, 0.62) 18%, rgba(5, 5, 5, 0.68) 82%, transparent),
    linear-gradient(180deg, rgba(102, 199, 255, 0.035), transparent);
  border: 0;
  border-top: 1px solid rgba(246, 241, 223, 0.12);
  border-bottom: 1px solid rgba(246, 241, 223, 0.055);
  transition:
    opacity 240ms var(--ease),
    transform 360ms var(--ease),
    border-color 240ms var(--ease),
    background 240ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
  background:
    radial-gradient(circle at var(--term-hot-x, 50%) 50%, color-mix(in srgb, var(--glossary-accent) 16%, transparent), transparent 44%),
    linear-gradient(90deg, transparent, rgba(5, 5, 5, 0.74) 18%, rgba(5, 5, 5, 0.7) 82%, transparent);
  border-top-color: color-mix(in srgb, var(--glossary-accent) 54%, transparent);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image{
  grid-column: 1 / span 2;
  grid-row: 1;
  margin-right: clamp(-22px, -1.6vw, -10px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form{
  grid-column: 4 / span 2;
  grid-row: 2;
  margin-left: clamp(-22px, -1.6vw, -10px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic{
  grid-column: 1 / span 2;
  grid-row: 3;
  margin-right: clamp(-34px, -2.4vw, -14px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process{
  grid-column: 4 / span 2;
  grid-row: 4;
  margin-left: clamp(-34px, -2.4vw, -14px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
  grid-column: 1 / span 2;
  grid-row: 5;
  margin-right: clamp(-20px, -1.3vw, -8px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
  grid-column: 4 / span 2;
  grid-row: 6;
  margin-left: clamp(-20px, -1.3vw, -8px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
  --term-hot-x: 100%;
  padding-right: clamp(22px, 3vw, 56px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
  --term-hot-x: 0%;
  padding-left: clamp(22px, 3vw, 56px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
  opacity: 0.2;
  width: clamp(54px, 6vw, 118px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible::before{
  opacity: 0.78;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textLabel{
  font-size: clamp(9px, 0.64vw, 11px);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
  max-width: 12ch;
  font-size: clamp(21px, 2.35vw, 40px);
  line-height: 0.95;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
  max-width: 26ch;
  margin-top: clamp(10px, 1.1vw, 18px);
  font-size: clamp(11px, 0.8vw, 14px);
  line-height: 1.45;
  color: rgba(246, 241, 223, 0.68);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active .textBody{
  color: rgba(246, 241, 223, 0.82);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence.is-active{
  transform: translateX(clamp(9px, 0.8vw, 14px));
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process.is-active,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium.is-active{
  transform: translateX(clamp(-14px, -0.8vw, -9px));
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin{
  --pin-line: clamp(38px, 4.6vw, 82px);
  z-index: 17;
  min-width: 8ch;
  color: rgba(246, 241, 223, 0.52);
  opacity: 0.38;
  text-shadow: 0 0 12px rgba(5, 5, 5, 0.72);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin b{
  display: none;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active{
  opacity: 0.92;
  transform: translate(-50%, -50%) scale(1.08);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image{
  --pin-x: 33%;
  --pin-y: 28%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form{
  --pin-x: 67%;
  --pin-y: 36%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic{
  --pin-x: 32%;
  --pin-y: 49%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process{
  --pin-x: 67%;
  --pin-y: 61%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence{
  --pin-x: 32%;
  --pin-y: 74%;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium{
  --pin-x: 68%;
  --pin-y: 84%;
}

.workShell[data-work="diffractive-flora"] .specimenActiveCard{
  opacity: 0;
  transform: translate(-50%, 8px);
  transition: opacity 220ms var(--ease), transform 220ms var(--ease);
}

.workShell[data-work="diffractive-flora"] .flora-glossary:is(:hover, :focus-within) .specimenActiveCard{
  opacity: 0.82;
  transform: translate(-50%, 0);
}

@media (max-width: 1180px) and (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    grid-template-columns: minmax(172px, 0.72fr) minmax(240px, 0.26fr) minmax(360px, 0.92fr) minmax(240px, 0.26fr) minmax(172px, 0.72fr);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(19px, 2.1vw, 32px);
  }
}

@media (max-width: 980px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    width: min(92vw, 760px);
    display: grid;
    grid-template-columns: 1fr;
    padding-block: 0;
    background: transparent;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary::before,
  .workShell[data-work="diffractive-flora"] .flora-glossary::after{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: 100%;
    min-height: clamp(580px, 122vw, 760px);
    mask-image: none;
    -webkit-mask-image: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: 0 -8%;
    background-size: auto 86%;
    background-position: center 44%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    grid-column: 1;
    grid-row: auto;
    margin: 0;
    padding: clamp(22px, 6vw, 34px) 0;
    background: transparent;
    text-align: left;
    align-items: flex-start;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(28px, 9vw, 48px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
    font-size: clamp(13px, 3.8vw, 16px);
  }
}

/* Fluid glossary field: keep the specimen and terms reading as one continuous system. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    --glossary-color-opacity: 0.86;
    --glossary-crop-top: 22%;
    --glossary-crop-left: 55%;
    --specimen-position-x: 50%;
    --specimen-position-y: 50%;
    width: min(1480px, 95vw);
    grid-template-columns: minmax(170px, 0.58fr) minmax(250px, 0.34fr) minmax(500px, 1.08fr) minmax(250px, 0.34fr) minmax(170px, 0.58fr);
    grid-template-rows: repeat(6, minmax(clamp(96px, 11.4vh, 142px), auto));
    row-gap: clamp(4px, 0.5vw, 10px);
    padding-block: clamp(28px, 3.6vw, 64px);
    background:
      radial-gradient(ellipse at 50% 52%, rgba(246, 241, 223, 0.08), transparent 23%),
      radial-gradient(ellipse at 50% 54%, rgba(102, 199, 255, 0.09), transparent 40%),
      linear-gradient(90deg, transparent 0%, rgba(5, 5, 5, 0.26) 18%, rgba(5, 5, 5, 0.04) 50%, rgba(5, 5, 5, 0.26) 82%, transparent 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary::before{
    inset: 0 -3vw;
    background:
      linear-gradient(90deg, transparent 2%, rgba(102, 199, 255, 0.09) 32%, rgba(255, 79, 154, 0.055) 50%, rgba(102, 199, 255, 0.09) 68%, transparent 98%),
      repeating-linear-gradient(180deg, rgba(246, 241, 223, 0.032) 0 1px, transparent 1px clamp(62px, 5.4vw, 92px)),
      repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.045) 0 1px, transparent 1px clamp(88px, 8vw, 132px));
    opacity: 0.78;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary::after{
    background:
      radial-gradient(ellipse at 50% 52%, transparent 24%, rgba(5, 5, 5, 0.18) 66%, rgba(5, 5, 5, 0.74) 100%),
      linear-gradient(180deg, #050505 0%, transparent 8%, transparent 92%, #050505 100%),
      linear-gradient(90deg, #050505 0%, transparent 12%, transparent 88%, #050505 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="technical-image"]{
    --glossary-color-opacity: 0.52;
    --glossary-color-clip: inset(6% 43% 20% 10%);
    --glossary-crop-top: 18%;
    --glossary-crop-left: 55%;
    --specimen-position-y: 48%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="diffractive-form"]{
    --glossary-color-opacity: 0.78;
    --glossary-color-clip: polygon(18% 4%, 100% 14%, 88% 86%, 28% 98%, 34% 44%);
    --glossary-rgb-opacity: 0.58;
    --glossary-crop-top: 27%;
    --glossary-crop-left: 33%;
    --specimen-position-y: 50%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="material-semiotic"]{
    --glossary-color-opacity: 0.82;
    --glossary-color-clip: inset(0 0 0 45%);
    --glossary-crop-top: 44%;
    --glossary-crop-left: 29%;
    --specimen-position-y: 51%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="image-process"]{
    --glossary-color-opacity: 0.66;
    --glossary-color-clip: inset(32% 16% 8% 16%);
    --glossary-echo-opacity: 0.36;
    --glossary-crop-top: 58%;
    --glossary-crop-left: 56%;
    --specimen-position-y: 52%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="material-correspondence"]{
    --glossary-color-opacity: 0.72;
    --glossary-color-clip: inset(16% 10% 45% 14%);
    --glossary-crop-top: 37%;
    --glossary-crop-left: 58%;
    --specimen-position-y: 50%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="post-photo-herbarium"]{
    --glossary-color-opacity: 0.62;
    --glossary-color-clip: inset(4% 18% 56% 20%);
    --glossary-crop-top: 63%;
    --glossary-crop-left: 30%;
    --specimen-position-y: 53%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    grid-column: 2 / span 3;
    grid-row: 1 / span 6;
    width: min(800px, 58vw);
    min-height: clamp(760px, 92vh, 1020px);
    background:
      radial-gradient(ellipse at 50% 49%, rgba(246, 241, 223, 0.1), transparent 28%),
      radial-gradient(ellipse at 50% 52%, rgba(102, 199, 255, 0.13), transparent 48%),
      linear-gradient(90deg, transparent 0%, rgba(5, 5, 5, 0.28) 22%, rgba(5, 5, 5, 0.06) 50%, rgba(5, 5, 5, 0.28) 78%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen::before{
    inset: -3% -22%;
    opacity: calc(var(--glossary-grid-opacity) * 0.46);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen::after{
    inset: -5% -22%;
    opacity: 0.46;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: -3% -16%;
    background-size: auto 99%;
    background-position: var(--specimen-position-x) var(--specimen-position-y);
    transition:
      background-position 520ms var(--ease),
      clip-path 420ms var(--ease),
      filter 420ms var(--ease),
      opacity 420ms var(--ease),
      transform 420ms var(--ease);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.56;
    filter: grayscale(0.22) saturate(1.18) contrast(1.12) brightness(0.72);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--glow{
    opacity: 0.16;
    filter: grayscale(0.18) saturate(1.35) contrast(1.16) brightness(1.5) blur(24px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    filter: saturate(1.58) contrast(1.12) brightness(1);
    mix-blend-mode: screen;
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    width: clamp(118px, 10vw, 164px);
    background: rgba(5, 5, 5, 0.3);
    border-color: rgba(102, 199, 255, 0.24);
    box-shadow: 0 0 40px rgba(102, 199, 255, 0.07);
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta{
    opacity: 0.7;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    min-height: clamp(84px, 10vh, 122px);
    padding: clamp(8px, 1vw, 16px) clamp(8px, 1.2vw, 20px);
    background:
      radial-gradient(ellipse at var(--term-hot-x, 50%) 52%, rgba(5, 5, 5, 0.62), transparent 58%),
      linear-gradient(90deg, transparent, rgba(5, 5, 5, 0.2), transparent);
    border: 0;
    border-top: 1px solid rgba(246, 241, 223, 0.075);
    box-shadow: none;
    opacity: 0.76;
    transition:
      opacity 280ms var(--ease),
      transform 420ms var(--ease),
      border-color 280ms var(--ease),
      background 280ms var(--ease);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card:hover,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
    opacity: 1;
    background:
      radial-gradient(ellipse at var(--term-hot-x, 50%) 52%, color-mix(in srgb, var(--glossary-accent) 13%, transparent), transparent 60%),
      radial-gradient(ellipse at var(--term-hot-x, 50%) 52%, rgba(5, 5, 5, 0.68), transparent 64%);
    border-top-color: color-mix(in srgb, var(--glossary-accent) 48%, transparent);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image{
    grid-column: 1 / span 2;
    grid-row: 1;
    margin: 0 clamp(-52px, -3.8vw, -26px) 0 0;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form{
    grid-column: 4 / span 2;
    grid-row: 2;
    margin: 0 0 0 clamp(-58px, -4.2vw, -28px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic{
    grid-column: 1 / span 2;
    grid-row: 3;
    margin: 0 clamp(-72px, -5vw, -34px) 0 0;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process{
    grid-column: 4 / span 2;
    grid-row: 4;
    margin: 0 0 0 clamp(-72px, -5vw, -34px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
    grid-column: 1 / span 2;
    grid-row: 5;
    margin: 0 clamp(-54px, -3.9vw, -26px) 0 0;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    grid-column: 4 / span 2;
    grid-row: 6;
    margin: 0 0 0 clamp(-54px, -3.9vw, -26px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
    width: clamp(90px, 10vw, 180px);
    opacity: 0.28;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active::before,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card:hover::before,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible::before{
    opacity: 0.92;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card::after{
    top: auto;
    bottom: clamp(6px, 0.7vw, 12px);
    color: rgba(102, 199, 255, 0.3);
    font-size: clamp(8px, 0.6vw, 10px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textLabel{
    font-size: clamp(8px, 0.58vw, 10px);
    opacity: 0.68;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    max-width: 13.5ch;
    font-size: clamp(18px, 1.85vw, 34px);
    line-height: 0.96;
    color: rgba(246, 241, 223, 0.9);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
    max-width: 22ch;
    margin-top: clamp(7px, 0.7vw, 12px);
    font-size: clamp(10.5px, 0.72vw, 13px);
    line-height: 1.38;
    color: rgba(246, 241, 223, 0.58);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active .textBody{
    color: rgba(246, 241, 223, 0.78);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image.is-active,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic.is-active,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence.is-active{
    transform: translateX(clamp(5px, 0.46vw, 8px));
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form.is-active,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process.is-active,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium.is-active{
    transform: translateX(clamp(-8px, -0.46vw, -5px));
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin{
    --pin-line: clamp(54px, 6vw, 112px);
    min-width: 6ch;
    opacity: 0.34;
    color: rgba(246, 241, 223, 0.46);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin span{
    font-size: clamp(8px, 0.58vw, 10px);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active{
    opacity: 0.98;
    transform: translate(-50%, -50%) scale(1.04);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image{
    --pin-x: 35%;
    --pin-y: 25%;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form{
    --pin-x: 65%;
    --pin-y: 34%;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic{
    --pin-x: 34%;
    --pin-y: 48%;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process{
    --pin-x: 66%;
    --pin-y: 61%;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence{
    --pin-x: 33%;
    --pin-y: 75%;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium{
    --pin-x: 67%;
    --pin-y: 86%;
  }
}

@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .specimenActiveCard{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
    width: min(360px, 26vw);
    justify-self: end;
    text-align: right;
    align-items: flex-end;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    width: min(360px, 26vw);
    justify-self: start;
    text-align: left;
    align-items: flex-start;
  }
}

@media (min-width: 981px) and (max-width: 1180px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    width: min(92vw, 1000px);
    grid-template-columns: minmax(104px, 0.48fr) minmax(92px, 0.2fr) minmax(340px, 0.9fr) minmax(92px, 0.2fr) minmax(104px, 0.48fr);
    grid-template-rows: repeat(6, minmax(clamp(92px, 10.2vh, 128px), auto));
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: min(650px, 64vw);
    min-height: clamp(700px, 92vh, 920px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: -2% -13%;
    background-size: auto 96%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    min-height: clamp(78px, 9vh, 112px);
    padding: clamp(7px, 0.9vw, 12px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(17px, 2.05vw, 25px);
    max-width: 12.5ch;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
    max-width: 21ch;
    font-size: clamp(10px, 0.9vw, 12px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
    width: min(252px, 24vw);
    margin-right: clamp(-34px, -3vw, -18px);
    padding-right: clamp(14px, 2.2vw, 28px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    width: min(252px, 24vw);
    margin-left: clamp(-124px, -11vw, -72px);
    padding-left: clamp(14px, 2.2vw, 28px);
    padding-right: clamp(8px, 1.4vw, 16px);
    left: clamp(-150px, -13vw, -88px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium .textTitle{
    max-width: 10.5ch;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
    width: clamp(64px, 8vw, 110px);
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta--one,
  .workShell[data-work="diffractive-flora"] .specimenMeta--two,
  .workShell[data-work="diffractive-flora"] .specimenMeta--three,
  .workShell[data-work="diffractive-flora"] .specimenMeta--four{
    font-size: 8px;
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    width: clamp(108px, 12vw, 136px);
  }
}

/* Final glossary field pass: full-bleed, no scan sweep, softer integrated positioning. */
.workShell[data-work="diffractive-flora"] .specimenScanBar{
  display: none !important;
  animation: none !important;
}

@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    --glossary-scan-opacity: 0;
    width: 100vw;
    max-width: none;
    margin-inline: calc(50% - 50vw);
    box-sizing: border-box;
    padding: clamp(42px, 5vw, 82px) clamp(46px, 7vw, 132px);
    grid-template-columns:
      minmax(180px, 0.72fr)
      minmax(118px, 0.22fr)
      minmax(540px, 1fr)
      minmax(118px, 0.22fr)
      minmax(180px, 0.72fr);
    grid-template-rows: repeat(6, minmax(clamp(86px, 9.6vh, 124px), auto));
    row-gap: clamp(2px, 0.35vw, 8px);
    overflow: hidden;
    background:
      radial-gradient(ellipse at 50% 49%, rgba(246, 241, 223, 0.08), transparent 22%),
      radial-gradient(ellipse at 50% 54%, rgba(102, 199, 255, 0.06), transparent 42%),
      linear-gradient(90deg, rgba(5, 5, 5, 0.92) 0%, rgba(5, 5, 5, 0.16) 18%, rgba(5, 5, 5, 0.02) 50%, rgba(5, 5, 5, 0.16) 82%, rgba(5, 5, 5, 0.92) 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary::before{
    inset: 0;
    background:
      repeating-linear-gradient(180deg, rgba(246, 241, 223, 0.024) 0 1px, transparent 1px clamp(70px, 5.8vw, 98px)),
      repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.03) 0 1px, transparent 1px clamp(92px, 7.8vw, 138px));
    opacity: 0.6;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary::after{
    background:
      radial-gradient(ellipse at 50% 52%, transparent 24%, rgba(5, 5, 5, 0.2) 70%, rgba(5, 5, 5, 0.86) 100%),
      linear-gradient(180deg, #050505 0%, transparent 7%, transparent 93%, #050505 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    grid-column: 2 / span 3;
    width: min(820px, 58vw);
    min-height: clamp(680px, 86vh, 900px);
    background:
      radial-gradient(ellipse at 50% 49%, rgba(246, 241, 223, 0.09), transparent 28%),
      radial-gradient(ellipse at 50% 52%, rgba(102, 199, 255, 0.08), transparent 48%),
      linear-gradient(90deg, transparent 0%, rgba(5, 5, 5, 0.22) 22%, rgba(5, 5, 5, 0.04) 50%, rgba(5, 5, 5, 0.22) 78%, transparent 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen::before{
    opacity: calc(var(--glossary-grid-opacity) * 0.3);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen::after{
    opacity: 0.38;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: -1% -10%;
    background-size: auto 90%;
    background-position: 50% 50%;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.48;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    opacity: var(--glossary-color-opacity);
  }

  .workShell[data-work="diffractive-flora"] .specimenRail{
    left: -3%;
    right: -3%;
    height: 1px;
    opacity: calc(var(--glossary-grid-opacity) * 0.16);
    background: linear-gradient(90deg, transparent, rgba(102, 199, 255, 0.26), transparent);
    box-shadow: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenRail--top{
    top: 20%;
  }

  .workShell[data-work="diffractive-flora"] .specimenRail--mid{
    top: 49%;
  }

  .workShell[data-work="diffractive-flora"] .specimenRail--low{
    top: 74%;
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    background: rgba(5, 5, 5, 0.22);
    border-color: rgba(102, 199, 255, 0.2);
    box-shadow: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    min-height: clamp(74px, 8.2vh, 110px);
    background:
      radial-gradient(ellipse at var(--term-hot-x, 50%) 52%, rgba(5, 5, 5, 0.46), transparent 64%);
    border-top-color: rgba(246, 241, 223, 0.06);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(18px, 1.65vw, 32px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
    font-size: clamp(10px, 0.72vw, 13px);
    line-height: 1.35;
  }
}

@media (min-width: 981px) and (max-width: 1180px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    width: 100vw;
    max-width: none;
    margin-inline: calc(50% - 50vw);
    padding-inline: clamp(30px, 4vw, 52px);
    grid-template-columns:
      minmax(128px, 0.6fr)
      minmax(74px, 0.16fr)
      minmax(430px, 1fr)
      minmax(74px, 0.16fr)
      minmax(128px, 0.6fr);
    grid-template-rows: repeat(6, minmax(clamp(78px, 8.6vh, 108px), auto));
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: min(660px, 66vw);
    min-height: clamp(700px, 92vh, 820px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: 0 -8%;
    background-size: auto 86%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    width: min(246px, 24vw);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
    margin-right: clamp(-48px, -4.8vw, -28px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    left: clamp(-126px, -11vw, -78px);
    margin-left: clamp(-88px, -8vw, -54px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(17px, 2vw, 24px);
  }
}

/* Glossary polish: remove residual sweep bands and keep labels clear of the specimen UI. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary[data-active-glossary="image-process"]{
    --glossary-color-opacity: 0.34;
    --glossary-color-clip: ellipse(34% 28% at 62% 62%);
    --glossary-rgb-opacity: 0.22;
    --glossary-echo-opacity: 0.2;
  }

  .workShell[data-work="diffractive-flora"] .specimenRail{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta--one{
    top: clamp(18px, 2.2vw, 34px);
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    opacity: 0.62;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
    margin-right: clamp(8px, 1.6vw, 34px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    left: auto;
    margin-left: clamp(8px, 1.6vw, 34px);
  }
}

@media (min-width: 981px) and (max-width: 1180px){
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
    margin-right: clamp(10px, 2.2vw, 28px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    left: auto;
    margin-left: clamp(10px, 2.2vw, 28px);
  }
}

/* Proportional glossary layout: visual correspondence without hard connector effects. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    width: 100vw;
    max-width: none;
    margin-inline: calc(50% - 50vw);
    padding:
      clamp(54px, 6vw, 96px)
      clamp(42px, 7vw, 128px)
      clamp(58px, 6.4vw, 104px);
    grid-template-columns:
      minmax(200px, 0.64fr)
      minmax(440px, 1fr)
      minmax(200px, 0.64fr);
    grid-template-rows: repeat(3, minmax(clamp(170px, 20vh, 230px), auto));
    column-gap: clamp(20px, 3vw, 54px);
    row-gap: clamp(8px, 1.3vw, 20px);
    align-items: stretch;
    background:
      radial-gradient(ellipse at 50% 48%, rgba(246, 241, 223, 0.055), transparent 22%),
      radial-gradient(ellipse at 50% 52%, rgba(102, 199, 255, 0.045), transparent 42%),
      linear-gradient(90deg, rgba(5, 5, 5, 0.94) 0%, rgba(5, 5, 5, 0.12) 20%, rgba(5, 5, 5, 0.02) 50%, rgba(5, 5, 5, 0.12) 80%, rgba(5, 5, 5, 0.94) 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary::before{
    opacity: 0.42;
    background:
      repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.025) 0 1px, transparent 1px clamp(84px, 8vw, 132px)),
      repeating-linear-gradient(180deg, rgba(246, 241, 223, 0.02) 0 1px, transparent 1px clamp(76px, 6vw, 108px));
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    grid-column: 2;
    grid-row: 1 / -1;
    align-self: center;
    justify-self: center;
    width: min(100%, 560px);
    min-height: clamp(650px, 78vh, 780px);
    background:
      radial-gradient(ellipse at 50% 48%, rgba(246, 241, 223, 0.08), transparent 30%),
      radial-gradient(ellipse at 50% 52%, rgba(102, 199, 255, 0.06), transparent 50%),
      linear-gradient(90deg, transparent, rgba(5, 5, 5, 0.08) 50%, transparent);
    mask-image: linear-gradient(180deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: 0 -8%;
    background-size: auto 88%;
    background-position: 50% 50%;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.42;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--glow{
    opacity: 0.12;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin{
    --pin-line: 0px;
    min-width: 0;
    font-size: clamp(8px, 0.62vw, 10px);
    opacity: 0.44;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin b{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin::after,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin::before{
    width: 7px;
    height: 7px;
    opacity: 0.66;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active::before{
    opacity: 1;
    transform: scale(1.22);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image{ --pin-x: 38%; --pin-y: 23%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form{ --pin-x: 63%; --pin-y: 29%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic{ --pin-x: 35%; --pin-y: 47%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process{ --pin-x: 64%; --pin-y: 55%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence{ --pin-x: 36%; --pin-y: 70%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium{ --pin-x: 62%; --pin-y: 82%; }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    width: clamp(118px, 10vw, 150px);
    min-height: 0;
    padding: 8px 10px;
    gap: 3px;
    opacity: 0.72;
    background: rgba(5, 5, 5, 0.24);
    border-color: rgba(102, 199, 255, 0.18);
    backdrop-filter: blur(1px);
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop::before{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenCropLabel,
  .workShell[data-work="diffractive-flora"] .specimenCropDetail{
    font-size: clamp(7px, 0.58vw, 9px);
    line-height: 1.16;
  }

  .workShell[data-work="diffractive-flora"] .specimenGraph{
    left: 7%;
    top: 58%;
    width: clamp(92px, 9vw, 136px);
    opacity: 0.44;
  }

  .workShell[data-work="diffractive-flora"] .specimenBarcode{
    right: 9%;
    top: 62%;
    width: clamp(78px, 8vw, 124px);
    height: 28px;
    opacity: 0.36;
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta{
    opacity: 0.6;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    width: 100%;
    min-height: 0;
    padding: clamp(18px, 2vw, 30px);
    justify-content: center;
    background:
      radial-gradient(ellipse at var(--term-hot-x, 50%) 50%, rgba(5, 5, 5, 0.52), transparent 66%);
    border: 0;
    border-top: 1px solid rgba(246, 241, 223, 0.08);
    border-bottom: 0;
    box-shadow: none;
    opacity: 0.82;
    transform: none !important;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card:hover,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
    opacity: 1;
    background:
      radial-gradient(ellipse at var(--term-hot-x, 50%) 50%, color-mix(in srgb, var(--glossary-accent) 9%, transparent), transparent 62%),
      radial-gradient(ellipse at var(--term-hot-x, 50%) 50%, rgba(5, 5, 5, 0.58), transparent 68%);
    border-top-color: color-mix(in srgb, var(--glossary-accent) 42%, transparent);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active .textTitle,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card:hover .textTitle,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible .textTitle{
    text-shadow: 0 0 16px color-mix(in srgb, var(--glossary-accent) 18%, transparent);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textLabel{
    font-size: clamp(8px, 0.62vw, 10px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    max-width: 13ch;
    margin-top: clamp(8px, 0.8vw, 14px);
    font-size: clamp(25px, 2.35vw, 40px);
    line-height: 0.96;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
    max-width: 24ch;
    margin-top: clamp(12px, 1.1vw, 18px);
    font-size: clamp(11px, 0.82vw, 14px);
    line-height: 1.36;
    color: rgba(246, 241, 223, 0.72);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
    --term-hot-x: 100%;
    grid-column: 1;
    justify-self: stretch;
    text-align: right;
    align-items: flex-end;
    margin: 0;
    padding-right: clamp(12px, 1.8vw, 26px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    --term-hot-x: 0%;
    grid-column: 3;
    justify-self: stretch;
    text-align: left;
    align-items: flex-start;
    left: auto;
    margin: 0;
    padding-left: clamp(12px, 1.8vw, 26px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form{
    grid-row: 1;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process{
    grid-row: 2;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
    grid-row: 3;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium .textTitle{
    max-width: 12ch;
  }
}

@media (min-width: 981px) and (max-width: 1180px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    padding-inline: clamp(34px, 4.4vw, 50px);
    grid-template-columns: minmax(194px, 0.68fr) minmax(410px, 1fr) minmax(194px, 0.68fr);
    column-gap: clamp(14px, 2vw, 24px);
    grid-template-rows: repeat(3, minmax(clamp(158px, 18vh, 196px), auto));
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: min(100%, 500px);
    min-height: clamp(620px, 74vh, 720px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: 1% -10%;
    background-size: auto 86%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    width: 100%;
    padding: clamp(14px, 1.8vw, 22px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(22px, 2.45vw, 29px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
    max-width: 22ch;
    font-size: clamp(10.5px, 1vw, 12px);
  }
}

/* Static glossary plate: graphic annotation replaces hover-driven effects. */
.workShell[data-work="diffractive-flora"] .flora-glossary{
  --glossary-accent: var(--flora-orange);
  --glossary-color-opacity: 0.68;
  --glossary-color-clip: polygon(39% 2%, 86% 3%, 86% 96%, 42% 98%);
  --glossary-rgb-opacity: 0.24;
  --glossary-echo-opacity: 0.18;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
  opacity: 1;
  transform: none !important;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active{
  background:
    radial-gradient(ellipse at var(--term-hot-x, 50%) 50%, rgba(5, 5, 5, 0.52), transparent 66%) !important;
  border-color: rgba(246, 241, 223, 0.08) !important;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover .textLabel,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible .textLabel,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active .textLabel{
  color: var(--flora-orange);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card:hover .textTitle,
.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus-visible .textTitle,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-active .textTitle{
  text-shadow: none !important;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active,
.workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active span{
  color: inherit;
  opacity: inherit;
  transform: translate(-50%, -50%);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin.is-active::before{
  opacity: 0.72;
  transform: none;
}

@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    margin-top: clamp(40px, 5vw, 78px);
    margin-bottom: clamp(52px, 6vw, 96px);
    padding:
      clamp(46px, 5.2vw, 82px)
      clamp(38px, 6vw, 112px)
      clamp(50px, 5.8vw, 92px);
    grid-template-columns:
      minmax(210px, 0.56fr)
      minmax(540px, 1.18fr)
      minmax(210px, 0.56fr);
    grid-template-rows: repeat(3, minmax(clamp(188px, 21vh, 250px), auto));
    column-gap: clamp(18px, 2.6vw, 44px);
    background:
      radial-gradient(ellipse at 50% 48%, rgba(246, 241, 223, 0.06), transparent 27%),
      radial-gradient(ellipse at 50% 52%, rgba(32, 255, 149, 0.028), transparent 43%),
      linear-gradient(90deg, rgba(5, 5, 5, 0.96) 0%, rgba(5, 5, 5, 0.1) 21%, rgba(5, 5, 5, 0) 50%, rgba(5, 5, 5, 0.1) 79%, rgba(5, 5, 5, 0.96) 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary::after{
    background:
      radial-gradient(ellipse at 50% 50%, transparent 18%, rgba(5, 5, 5, 0.08) 54%, rgba(5, 5, 5, 0.74) 100%),
      linear-gradient(180deg, #050505 0%, transparent 8%, transparent 92%, #050505 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: min(100%, 690px);
    min-height: clamp(760px, 88vh, 920px);
    background:
      radial-gradient(ellipse at 52% 48%, rgba(246, 241, 223, 0.09), transparent 36%),
      radial-gradient(ellipse at 45% 58%, rgba(255, 79, 154, 0.04), transparent 36%),
      linear-gradient(90deg, transparent 0 13%, rgba(32, 255, 149, 0.04) 13% 14%, transparent 14% 47%, rgba(246, 241, 223, 0.08) 47% 49%, transparent 49% 100%);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen::before{
    opacity: 0.3;
    background:
      linear-gradient(90deg, transparent 0 20%, rgba(102, 199, 255, 0.1) 20% 20.2%, transparent 20.2% 47%, rgba(246, 241, 223, 0.14) 47% 47.18%, transparent 47.18% 82%, rgba(255, 79, 154, 0.08) 82% 82.16%, transparent 82.16%),
      repeating-linear-gradient(90deg, rgba(102, 199, 255, 0.035) 0 1px, transparent 1px clamp(56px, 5vw, 88px)),
      repeating-linear-gradient(180deg, rgba(246, 241, 223, 0.024) 0 1px, transparent 1px clamp(56px, 4.8vw, 84px));
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen::after{
    opacity: 0.42;
    background:
      radial-gradient(ellipse at 52% 49%, transparent 0 36%, rgba(5, 5, 5, 0.22) 70%, rgba(5, 5, 5, 0.78) 100%),
      linear-gradient(90deg, transparent 0 39%, rgba(246, 241, 223, 0.2) 39% 40%, rgba(255, 79, 154, 0.16) 40% 40.34%, transparent 40.34% 100%),
      repeating-radial-gradient(circle at 50% 46%, rgba(102, 199, 255, 0.045) 0 1px, transparent 1px 8px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: -5% -16%;
    background-size: auto 100%;
    background-position: 50% 48%;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.64;
    filter: grayscale(0.32) saturate(0.8) contrast(1.14) brightness(0.8);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--glow{
    opacity: 0.18;
    filter: grayscale(0.2) saturate(1.1) contrast(1.18) brightness(1.48) blur(20px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    opacity: 0.7;
    clip-path: polygon(38% 1%, 88% 3%, 89% 94%, 42% 99%);
    filter: saturate(1.18) contrast(1.08) brightness(1.02);
    mix-blend-mode: screen;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a,
  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b{
    opacity: 0.16;
    clip-path: polygon(42% 4%, 86% 5%, 84% 45%, 48% 53%);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--echo{
    opacity: 0.16;
    transform: translate(14px, 22px) scale(1.008);
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    top: 38%;
    left: 33%;
    width: clamp(140px, 11vw, 180px);
    opacity: 0.62;
    color: rgba(246, 241, 223, 0.72);
    background: rgba(5, 5, 5, 0.2);
    border-color: rgba(102, 199, 255, 0.18);
  }

  .workShell[data-work="diffractive-flora"] .specimenCropDetail{
    color: rgba(246, 241, 223, 0.68);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin{
    opacity: 0.78;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin span{
    color: rgba(238, 91, 31, 0.76);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin::before{
    width: 8px;
    height: 8px;
    opacity: 0.72;
    background: rgba(238, 91, 31, 0.88);
    box-shadow: 0 0 18px rgba(238, 91, 31, 0.3);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin--technical-image{ --pin-x: 34%; --pin-y: 31%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form{ --pin-x: 61%; --pin-y: 36%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic{ --pin-x: 31%; --pin-y: 49%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process{ --pin-x: 60%; --pin-y: 57%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence{ --pin-x: 32%; --pin-y: 72%; }
  .workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium{ --pin-x: 57%; --pin-y: 84%; }

  .workShell[data-work="diffractive-flora"] .specimenGraph{
    left: 5%;
    top: 61%;
    opacity: 0.36;
  }

  .workShell[data-work="diffractive-flora"] .specimenBarcode{
    right: 6%;
    top: 63%;
    opacity: 0.28;
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta--one{
    top: clamp(20px, 2.4vw, 38px);
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta--two{
    top: 16%;
    right: 8%;
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta--three{
    bottom: 9%;
    left: 8%;
  }

  .workShell[data-work="diffractive-flora"] .specimenMeta--four{
    right: 8%;
    bottom: 6%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    background:
      linear-gradient(180deg, rgba(246, 241, 223, 0.06), transparent 1px),
      radial-gradient(ellipse at var(--term-hot-x, 50%) 48%, rgba(5, 5, 5, 0.54), transparent 68%) !important;
    border-top-color: rgba(246, 241, 223, 0.08) !important;
  }
}

@media (min-width: 981px) and (max-width: 1180px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    grid-template-columns: minmax(194px, 0.56fr) minmax(520px, 1.2fr) minmax(194px, 0.56fr);
    padding-inline: clamp(30px, 3.8vw, 44px);
    column-gap: clamp(10px, 1.6vw, 18px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: min(100%, 610px);
    min-height: clamp(740px, 88vh, 860px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: -5% -18%;
    background-size: auto 100%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(23px, 2.55vw, 32px);
  }
}

/* Final static glossary composition: no hover-driven specimen states. */
.workShell[data-work="diffractive-flora"] .flora-glossary-card{
  cursor: default;
  pointer-events: none;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card:focus{
  outline: none;
}

.workShell[data-work="diffractive-flora"] .specimenActiveCard,
.workShell[data-work="diffractive-flora"] .specimenScanBar{
  display: none !important;
}

.workShell[data-work="diffractive-flora"] .specimenCrop{
  pointer-events: none;
}

@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    grid-template-columns:
      minmax(210px, 0.54fr)
      minmax(600px, 1.28fr)
      minmax(210px, 0.54fr);
    grid-template-rows: repeat(3, minmax(clamp(200px, 22vh, 260px), auto));
    column-gap: clamp(12px, 2vw, 34px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: min(100%, 760px);
    min-height: clamp(820px, 94vh, 980px);
    transform: translateY(clamp(-8px, -0.6vw, -4px));
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: -7% -20%;
    background-size: auto 108%;
    background-position: 50% 49%;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.68;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    opacity: 0.76;
    clip-path: polygon(36% 0, 90% 2%, 91% 96%, 40% 100%);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a,
  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b{
    opacity: 0.18;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--echo{
    opacity: 0.18;
    transform: translate(16px, 24px) scale(1.01);
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    top: 36%;
    left: 31%;
    width: clamp(132px, 10vw, 170px);
    opacity: 0.58;
  }

  .workShell[data-work="diffractive-flora"] .specimenGraph{
    left: 3%;
    top: 62%;
  }

  .workShell[data-work="diffractive-flora"] .specimenBarcode{
    right: 5%;
    top: 64%;
  }
}

@media (min-width: 981px) and (max-width: 1180px){
  .workShell[data-work="diffractive-flora"] .flora-glossary{
    grid-template-columns: minmax(184px, 0.52fr) minmax(590px, 1.36fr) minmax(184px, 0.52fr);
    padding-inline: clamp(24px, 3vw, 34px);
    column-gap: clamp(8px, 1.35vw, 16px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    width: min(100%, 690px);
    min-height: clamp(790px, 92vh, 900px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    inset: -7% -22%;
    background-size: auto 108%;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card{
    padding-inline: clamp(10px, 1.4vw, 18px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textTitle{
    font-size: clamp(22px, 2.35vw, 30px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form .textTitle,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process .textTitle,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium .textTitle{
    max-width: 11.4ch;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium .textTitle{
    max-width: 10.8ch;
    font-size: clamp(20px, 2.08vw, 26px);
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card .textBody{
    font-size: clamp(10px, 0.95vw, 11.5px);
  }
}

/* Glossary schematic map: six flowers, six concept channels, one slow rotating specimen. */
.workShell[data-work="diffractive-flora"] .specimenConnectorMap{
  position: absolute;
  inset: -4% -8%;
  z-index: 13;
  overflow: visible;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.76;
}

.workShell[data-work="diffractive-flora"] .specimenConnector{
  fill: none;
  stroke: var(--connector-color, rgba(238, 91, 31, 0.72));
  stroke-width: 1px;
  stroke-linecap: round;
  stroke-dasharray: 7 5;
  opacity: 0.74;
  filter: drop-shadow(0 0 7px color-mix(in srgb, var(--connector-color, rgba(238, 91, 31, 0.7)) 44%, transparent));
}

.workShell[data-work="diffractive-flora"] .specimenConnectorNode{
  fill: var(--connector-color, rgba(238, 91, 31, 0.9));
  stroke: rgba(246, 241, 223, 0.5);
  stroke-width: 0.34px;
  opacity: 0.9;
}

.workShell[data-work="diffractive-flora"] .specimenConnector--technical-image,
.workShell[data-work="diffractive-flora"] .specimenConnectorNode--technical-image{
  --connector-color: rgba(238, 91, 31, 0.84);
}

.workShell[data-work="diffractive-flora"] .specimenConnector--diffractive-form,
.workShell[data-work="diffractive-flora"] .specimenConnectorNode--diffractive-form{
  --connector-color: rgba(255, 79, 154, 0.82);
}

.workShell[data-work="diffractive-flora"] .specimenConnector--material-semiotic,
.workShell[data-work="diffractive-flora"] .specimenConnectorNode--material-semiotic{
  --connector-color: rgba(32, 255, 149, 0.7);
}

.workShell[data-work="diffractive-flora"] .specimenConnector--image-process,
.workShell[data-work="diffractive-flora"] .specimenConnectorNode--image-process{
  --connector-color: rgba(238, 91, 31, 0.78);
}

.workShell[data-work="diffractive-flora"] .specimenConnector--material-correspondence,
.workShell[data-work="diffractive-flora"] .specimenConnectorNode--material-correspondence{
  --connector-color: rgba(102, 199, 255, 0.76);
}

.workShell[data-work="diffractive-flora"] .specimenConnector--post-photo-herbarium,
.workShell[data-work="diffractive-flora"] .specimenConnectorNode--post-photo-herbarium{
  --connector-color: rgba(255, 79, 154, 0.74);
}

.workShell[data-work="diffractive-flora"] .specimenTurntable{
  position: absolute;
  inset: 0;
  z-index: 9;
  perspective: 1000px;
  pointer-events: none;
  opacity: 0.48;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
  position: absolute;
  left: 50%;
  top: 49%;
  width: clamp(310px, 34vw, 500px);
  height: clamp(660px, 80vh, 880px);
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
  animation: floraGlossaryTurntable 32s linear infinite;
}

.workShell[data-work="diffractive-flora"] .specimenTurntableAxis::before{
  content: "";
  position: absolute;
  left: 50%;
  top: 3%;
  bottom: 3%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(102, 199, 255, 0.5), rgba(246, 241, 223, 0.34), transparent);
  box-shadow: 0 0 26px rgba(102, 199, 255, 0.24);
  transform: translateX(-50%);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane{
  --plane-x: 50%;
  --plane-y: 50%;
  --plane-size: clamp(70px, 6.2vw, 110px);
  --plane-accent: rgba(238, 91, 31, 0.82);
  position: absolute;
  left: var(--plane-x);
  top: var(--plane-y);
  width: var(--plane-size);
  aspect-ratio: 1;
  display: grid;
  align-content: end;
  justify-items: center;
  padding: 9px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--plane-accent) 72%, transparent);
  background:
    radial-gradient(circle at 50% 50%, rgba(246, 241, 223, 0.16), transparent 42%),
    var(--glossary-specimen-image);
  background-size: auto 520%;
  background-position: var(--flower-crop, 50% 50%);
  box-shadow:
    inset 0 0 0 1px rgba(246, 241, 223, 0.08),
    inset 0 0 28px rgba(5, 5, 5, 0.5),
    0 0 24px color-mix(in srgb, var(--plane-accent) 36%, transparent);
  color: rgba(246, 241, 223, 0.9);
  filter: saturate(1.2) contrast(1.08) brightness(1.06);
  transform:
    translate(-50%, -50%)
    rotateY(calc(var(--plane-index) * 60deg))
    translateZ(var(--plane-depth, 64px))
    rotateY(calc(var(--plane-index) * -60deg));
  transform-style: preserve-3d;
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane::before{
  content: "";
  position: absolute;
  inset: 18%;
  border-radius: 50%;
  border: 1px solid rgba(102, 199, 255, 0.36);
  box-shadow: 0 0 18px color-mix(in srgb, var(--plane-accent) 36%, transparent);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane::after{
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 48%, rgba(246, 241, 223, 0.22) 48% 49%, transparent 49%),
    repeating-linear-gradient(180deg, rgba(102, 199, 255, 0.16) 0 1px, transparent 1px 9px);
  opacity: 0.32;
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane span,
.workShell[data-work="diffractive-flora"] .specimenFlowerPlane b{
  position: relative;
  z-index: 1;
  display: block;
  max-width: 12ch;
  text-align: center;
  text-shadow: 0 1px 8px rgba(5, 5, 5, 0.9);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane span{
  color: var(--plane-accent);
  font: 900 9px/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane b{
  margin-top: 2px;
  font: 800 8px/1.05 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane--technical-image{
  --plane-x: 43%;
  --plane-y: 22%;
  --plane-size: clamp(74px, 6.8vw, 118px);
  --plane-accent: rgba(238, 91, 31, 0.84);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane--diffractive-form{
  --plane-x: 62%;
  --plane-y: 33%;
  --plane-size: clamp(82px, 7.2vw, 126px);
  --plane-accent: rgba(255, 79, 154, 0.84);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-semiotic{
  --plane-x: 35%;
  --plane-y: 49%;
  --plane-size: clamp(78px, 6.6vw, 116px);
  --plane-accent: rgba(32, 255, 149, 0.7);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane--image-process{
  --plane-x: 64%;
  --plane-y: 58%;
  --plane-size: clamp(86px, 7.6vw, 134px);
  --plane-accent: rgba(238, 91, 31, 0.8);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-correspondence{
  --plane-x: 36%;
  --plane-y: 72%;
  --plane-size: clamp(70px, 6.2vw, 108px);
  --plane-accent: rgba(102, 199, 255, 0.76);
}

.workShell[data-work="diffractive-flora"] .specimenFlowerPlane--post-photo-herbarium{
  --plane-x: 57%;
  --plane-y: 83%;
  --plane-size: clamp(86px, 7.4vw, 132px);
  --plane-accent: rgba(255, 79, 154, 0.76);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card{
  --leader-color: rgba(238, 91, 31, 0.72);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
  opacity: 0.72 !important;
  width: clamp(82px, 8.4vw, 156px) !important;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--leader-color), rgba(102, 199, 255, 0.38)) !important;
  box-shadow: 0 0 18px color-mix(in srgb, var(--leader-color) 38%, transparent);
  transform: scaleX(1) !important;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process{
  --leader-color: rgba(238, 91, 31, 0.82);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium{
  --leader-color: rgba(255, 79, 154, 0.8);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic{
  --leader-color: rgba(32, 255, 149, 0.66);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence{
  --leader-color: rgba(102, 199, 255, 0.76);
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence::before{
  right: clamp(-156px, -8.4vw, -82px) !important;
  left: auto !important;
}

.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process::before,
.workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium::before{
  left: clamp(-156px, -8.4vw, -82px) !important;
  right: auto !important;
  background: linear-gradient(90deg, rgba(102, 199, 255, 0.38), var(--leader-color), transparent) !important;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin{
  --pin-accent: rgba(238, 91, 31, 0.78);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin span{
  color: var(--pin-accent) !important;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin::before{
  background: var(--pin-accent) !important;
  box-shadow: 0 0 20px color-mix(in srgb, var(--pin-accent) 48%, transparent) !important;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin::after{
  background: linear-gradient(90deg, transparent, rgba(102, 199, 255, 0.55), var(--pin-accent)) !important;
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium{
  --pin-accent: rgba(255, 79, 154, 0.8);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-semiotic{
  --pin-accent: rgba(32, 255, 149, 0.68);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--material-correspondence{
  --pin-accent: rgba(102, 199, 255, 0.72);
}

.workShell[data-work="diffractive-flora"] .specimenConceptPin--diffractive-form::after,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--image-process::after,
.workShell[data-work="diffractive-flora"] .specimenConceptPin--post-photo-herbarium::after{
  background: linear-gradient(90deg, var(--pin-accent), rgba(102, 199, 255, 0.55), transparent) !important;
}

@keyframes floraGlossaryTurntable{
  0%{
    transform: translate(-50%, -50%) rotateX(4deg) rotateY(-18deg);
  }
  50%{
    transform: translate(-50%, -50%) rotateX(4deg) rotateY(162deg);
  }
  100%{
    transform: translate(-50%, -50%) rotateX(4deg) rotateY(342deg);
  }
}

@media (prefers-reduced-motion: reduce){
  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    animation: none;
    transform: translate(-50%, -50%) rotateX(4deg) rotateY(-18deg);
  }
}

@media (max-width: 980px){
  .workShell[data-work="diffractive-flora"] .specimenConnectorMap{
    inset: 0;
    opacity: 0.46;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable{
    opacity: 0.34;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    width: min(72vw, 340px);
    height: min(94vw, 560px);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane b{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
    display: none;
  }
}

/* Final glossary schematic: fixed flower-to-term channels plus a rotating crop model. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .specimenConnectorMap{
    inset: -3% -10%;
    z-index: 19;
    opacity: 0.98;
  }

  .workShell[data-work="diffractive-flora"] .specimenConnector{
    stroke-width: 1.22px;
    stroke-dasharray: 2.5 4.5;
    opacity: 0.9;
    filter: drop-shadow(0 0 9px color-mix(in srgb, var(--connector-color, rgba(238, 91, 31, 0.7)) 52%, transparent));
  }

  .workShell[data-work="diffractive-flora"] .specimenConnectorNode{
    stroke-width: 0.42px;
    opacity: 1;
    filter: drop-shadow(0 0 8px color-mix(in srgb, var(--connector-color, rgba(238, 91, 31, 0.7)) 66%, transparent));
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card::before{
    width: clamp(118px, 10.5vw, 194px) !important;
    opacity: 0.78 !important;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-technical-image::before,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-semiotic::before,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-material-correspondence::before{
    right: clamp(-194px, -10.5vw, -118px) !important;
  }

  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-diffractive-form::before,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-image-process::before,
  .workShell[data-work="diffractive-flora"] .flora-glossary-card.is-post-photo-herbarium::before{
    left: clamp(-194px, -10.5vw, -118px) !important;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin{
    --pin-line: clamp(82px, 10vw, 168px);
    z-index: 21;
    opacity: 0.9;
    min-width: 0;
    filter: drop-shadow(0 0 10px color-mix(in srgb, var(--pin-accent, rgba(238, 91, 31, 0.78)) 42%, transparent));
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin b{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin span{
    padding: 2px 4px;
    background: rgba(5, 5, 5, 0.62);
    border: 1px solid color-mix(in srgb, var(--pin-accent, rgba(238, 91, 31, 0.78)) 42%, transparent);
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin::before{
    width: 9px;
    height: 9px;
    outline: 1px solid rgba(246, 241, 223, 0.38);
    outline-offset: 4px;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin::after{
    opacity: 0.84;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable{
    z-index: 20;
    opacity: 0.9;
    perspective: 780px;
    mix-blend-mode: normal;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::before,
  .workShell[data-work="diffractive-flora"] .specimenTurntable::after{
    content: "";
    position: absolute;
    left: 50%;
    top: 52%;
    width: clamp(360px, 34vw, 560px);
    height: clamp(560px, 72vh, 800px);
    border: 1px solid rgba(102, 199, 255, 0.18);
    border-radius: 50%;
    transform: translate(-50%, -50%) rotateX(72deg);
    box-shadow:
      inset 0 0 34px rgba(102, 199, 255, 0.09),
      0 0 34px rgba(102, 199, 255, 0.1);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::after{
    width: clamp(220px, 22vw, 390px);
    height: clamp(390px, 52vh, 620px);
    border-color: rgba(255, 79, 154, 0.14);
    transform: translate(-50%, -50%) rotateX(72deg) rotateZ(24deg);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    top: 52%;
    width: clamp(390px, 38vw, 610px);
    height: clamp(620px, 78vh, 900px);
    animation-duration: 22s;
    will-change: transform;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane{
    --plane-size: clamp(94px, 8.6vw, 154px);
    aspect-ratio: 1.18;
    align-content: end;
    border-radius: 10px 42%;
    border-color: color-mix(in srgb, var(--plane-accent) 86%, rgba(246, 241, 223, 0.18));
    background:
      radial-gradient(circle at 50% 48%, rgba(246, 241, 223, 0.2), transparent 46%),
      linear-gradient(135deg, rgba(5, 5, 5, 0.18), rgba(5, 5, 5, 0.58)),
      var(--glossary-specimen-image);
    background-size: 100% 100%, 100% 100%, auto 430%;
    background-position: center, center, var(--flower-crop, 50% 50%);
    box-shadow:
      inset 0 0 0 1px rgba(246, 241, 223, 0.08),
      inset 0 0 30px rgba(5, 5, 5, 0.34),
      0 0 26px color-mix(in srgb, var(--plane-accent) 42%, transparent),
      0 16px 40px rgba(0, 0, 0, 0.34);
    opacity: 0.82;
    filter: saturate(1.38) contrast(1.12) brightness(1.08);
    backface-visibility: visible;
    transform:
      translate(-50%, -50%)
      rotateY(calc(var(--plane-index) * 60deg))
      translateZ(var(--plane-depth, 64px))
      rotateY(12deg);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::before{
    inset: 10px;
    border-radius: inherit;
    border-color: rgba(102, 199, 255, 0.42);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::after{
    opacity: 0.2;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane span{
    position: absolute;
    left: 8px;
    top: 7px;
    padding: 2px 4px;
    background: rgba(5, 5, 5, 0.66);
    border-left: 2px solid var(--plane-accent);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane b{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--technical-image{
    --plane-x: 42%;
    --plane-y: 20%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--diffractive-form{
    --plane-x: 64%;
    --plane-y: 33%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-semiotic{
    --plane-x: 32%;
    --plane-y: 48%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--image-process{
    --plane-x: 67%;
    --plane-y: 58%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-correspondence{
    --plane-x: 34%;
    --plane-y: 72%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--post-photo-herbarium{
    --plane-x: 58%;
    --plane-y: 84%;
  }
}

/* Layered pseudo-3D flower model: one rotating specimen built from the source scan. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .specimenTurntable{
    z-index: 18;
    opacity: 0.96;
    perspective: 980px;
    perspective-origin: 50% 48%;
    mix-blend-mode: normal;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::before{
    width: clamp(430px, 42vw, 720px);
    height: clamp(720px, 84vh, 1040px);
    border-color: rgba(102, 199, 255, 0.16);
    transform: translate(-50%, -50%) rotateX(70deg) rotateZ(-7deg);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::after{
    width: clamp(280px, 30vw, 520px);
    height: clamp(600px, 72vh, 900px);
    border-color: rgba(255, 79, 154, 0.16);
    transform: translate(-50%, -50%) rotateX(70deg) rotateZ(19deg);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    top: 52%;
    width: clamp(520px, 48vw, 780px);
    height: clamp(760px, 86vh, 1080px);
    animation: floraGlossaryFlowerModel 28s linear infinite;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis::before{
    top: 1%;
    bottom: 1%;
    width: 2px;
    background: linear-gradient(180deg, transparent, rgba(102, 199, 255, 0.42), rgba(246, 241, 223, 0.36), rgba(255, 79, 154, 0.28), transparent);
    opacity: 0.62;
    transform: translateX(-50%) translateZ(-130px);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis::after{
    content: "";
    position: absolute;
    left: 50%;
    top: 7%;
    bottom: 8%;
    width: clamp(120px, 9vw, 170px);
    border-inline: 1px solid rgba(102, 199, 255, 0.12);
    background:
      repeating-linear-gradient(180deg, rgba(102, 199, 255, 0.13) 0 1px, transparent 1px 20px),
      linear-gradient(90deg, transparent, rgba(246, 241, 223, 0.08), transparent);
    opacity: 0.38;
    transform: translateX(-50%) translateZ(-180px) rotateY(90deg);
    pointer-events: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane{
    --plane-w: clamp(160px, 16vw, 260px);
    --plane-h: clamp(132px, 13vw, 220px);
    --plane-rx: 0deg;
    --plane-ry: 0deg;
    --plane-rz: 0deg;
    --plane-depth: 0px;
    --plane-bg-size: auto 360%;
    width: var(--plane-w);
    height: var(--plane-h);
    aspect-ratio: auto;
    padding: 0;
    border-radius: 64% 36% 58% 42% / 46% 60% 40% 54%;
    clip-path: none;
    -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000 0 48%, rgba(0, 0, 0, 0.82) 62%, transparent 78%);
    mask-image: radial-gradient(ellipse at 50% 50%, #000 0 48%, rgba(0, 0, 0, 0.82) 62%, transparent 78%);
    border: 1px solid color-mix(in srgb, var(--plane-accent) 62%, rgba(246, 241, 223, 0.12));
    background:
      radial-gradient(circle at 50% 48%, rgba(246, 241, 223, 0.16), transparent 52%),
      linear-gradient(135deg, rgba(246, 241, 223, 0.04), rgba(5, 5, 5, 0.08) 48%, rgba(5, 5, 5, 0.26)),
      var(--glossary-specimen-image);
    background-size: 100% 100%, 100% 100%, var(--plane-bg-size);
    background-position: center, center, var(--flower-crop, 50% 50%);
    box-shadow:
      inset 0 0 0 1px rgba(246, 241, 223, 0.08),
      inset 0 -18px 42px rgba(5, 5, 5, 0.18),
      0 0 34px color-mix(in srgb, var(--plane-accent) 32%, transparent),
      0 22px 54px rgba(0, 0, 0, 0.26);
    opacity: 0.76;
    filter: saturate(1.52) contrast(1.1) brightness(1.08);
    transform:
      translate(-50%, -50%)
      translateZ(var(--plane-depth))
      rotateX(var(--plane-rx))
      rotateY(var(--plane-ry))
      rotateZ(var(--plane-rz));
    transform-style: preserve-3d;
    transform-origin: 50% 50%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::before{
    inset: 10px;
    border-radius: inherit;
    -webkit-mask-image: inherit;
    mask-image: inherit;
    border: 0;
    background:
      linear-gradient(135deg, rgba(5, 5, 5, 0.16), rgba(246, 241, 223, 0.08)),
      var(--glossary-specimen-image);
    background-size: 100% 100%, var(--plane-bg-size);
    background-position: center, var(--flower-crop, 50% 50%);
    filter: grayscale(0.52) saturate(1.12) contrast(1.1) brightness(0.78);
    opacity: 0.28;
    transform: translateZ(-26px) scale(0.96);
    box-shadow: 0 0 28px rgba(5, 5, 5, 0.46);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::after{
    inset: -2px;
    border-radius: inherit;
    -webkit-mask-image: inherit;
    mask-image: inherit;
    background:
      linear-gradient(90deg, transparent 0 46%, rgba(246, 241, 223, 0.22) 46% 47%, transparent 47%),
      radial-gradient(circle at 26% 28%, color-mix(in srgb, var(--plane-accent) 46%, transparent), transparent 32%),
      repeating-linear-gradient(110deg, rgba(102, 199, 255, 0.12) 0 1px, transparent 1px 11px);
    border: 1px solid color-mix(in srgb, var(--plane-accent) 38%, transparent);
    opacity: 0.3;
    transform: translateZ(18px);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane span{
    left: 50%;
    top: 50%;
    width: 8px;
    height: 8px;
    padding: 0;
    overflow: hidden;
    color: transparent;
    background: var(--plane-accent);
    border: 1px solid rgba(246, 241, 223, 0.46);
    border-radius: 50%;
    box-shadow: 0 0 16px color-mix(in srgb, var(--plane-accent) 64%, transparent);
    transform: translate(-50%, -50%) translateZ(34px);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane b{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--technical-image{
    --plane-x: 47%;
    --plane-y: 19%;
    --plane-w: clamp(220px, 21vw, 340px);
    --plane-h: clamp(178px, 17vw, 280px);
    --plane-depth: 38px;
    --plane-rx: 12deg;
    --plane-ry: -18deg;
    --plane-rz: -8deg;
    --plane-bg-size: auto 390%;
    --flower-crop: 49% 18%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--diffractive-form{
    --plane-x: 63%;
    --plane-y: 40%;
    --plane-w: clamp(190px, 18vw, 300px);
    --plane-h: clamp(184px, 17.5vw, 292px);
    --plane-depth: 154px;
    --plane-rx: -6deg;
    --plane-ry: 26deg;
    --plane-rz: 9deg;
    --plane-bg-size: auto 365%;
    --flower-crop: 67% 48%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-semiotic{
    --plane-x: 35%;
    --plane-y: 47%;
    --plane-w: clamp(174px, 16.5vw, 282px);
    --plane-h: clamp(154px, 15vw, 250px);
    --plane-depth: -72px;
    --plane-rx: 10deg;
    --plane-ry: -34deg;
    --plane-rz: -12deg;
    --plane-bg-size: auto 390%;
    --flower-crop: 33% 51%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--image-process{
    --plane-x: 56%;
    --plane-y: 64%;
    --plane-w: clamp(214px, 20vw, 330px);
    --plane-h: clamp(172px, 16.5vw, 280px);
    --plane-depth: 112px;
    --plane-rx: -12deg;
    --plane-ry: 18deg;
    --plane-rz: -3deg;
    --plane-bg-size: auto 350%;
    --flower-crop: 55% 68%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-correspondence{
    --plane-x: 36%;
    --plane-y: 72%;
    --plane-w: clamp(160px, 15.2vw, 254px);
    --plane-h: clamp(154px, 14.8vw, 246px);
    --plane-depth: -44px;
    --plane-rx: 9deg;
    --plane-ry: -24deg;
    --plane-rz: 10deg;
    --plane-bg-size: auto 395%;
    --flower-crop: 31% 74%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--post-photo-herbarium{
    --plane-x: 58%;
    --plane-y: 83%;
    --plane-w: clamp(222px, 21vw, 350px);
    --plane-h: clamp(184px, 17.5vw, 292px);
    --plane-depth: 138px;
    --plane-rx: -8deg;
    --plane-ry: 22deg;
    --plane-rz: 8deg;
    --plane-bg-size: auto 345%;
    --flower-crop: 57% 83%;
  }
}

@keyframes floraGlossaryFlowerModel{
  0%{
    transform: translate(-50%, -50%) rotateX(5deg) rotateY(-24deg) rotateZ(-1deg);
  }
  50%{
    transform: translate(-50%, -50%) rotateX(5deg) rotateY(156deg) rotateZ(1deg);
  }
  100%{
    transform: translate(-50%, -50%) rotateX(5deg) rotateY(336deg) rotateZ(-1deg);
  }
}

@media (prefers-reduced-motion: reduce){
  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    animation: none;
    transform: translate(-50%, -50%) rotateX(5deg) rotateY(-24deg) rotateZ(-1deg);
  }
}

/* Rotating glossary model: the static scan recedes into a projection while the six flower regions turn as one object. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    overflow: visible;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    opacity: 0.1;
    filter: grayscale(0.82) saturate(0.82) contrast(1.16) brightness(0.66) blur(0.4px);
    transform: scale(0.98);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.2;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--glow{
    opacity: 0.26;
    filter: grayscale(0.55) saturate(0.95) contrast(1.05) brightness(0.9) blur(8px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    opacity: 0.14;
    filter: saturate(1.4) contrast(1.08) brightness(0.74) blur(1px);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a,
  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b,
  .workShell[data-work="diffractive-flora"] .specimenLayer--echo{
    opacity: 0.08;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable{
    z-index: 23;
    opacity: 1;
    perspective: 620px;
    perspective-origin: 50% 46%;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::before{
    width: clamp(520px, 48vw, 820px);
    height: clamp(760px, 92vh, 1120px);
    border-color: rgba(102, 199, 255, 0.11);
    opacity: 0.52;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::after{
    width: clamp(300px, 31vw, 560px);
    height: clamp(620px, 78vh, 940px);
    border-color: rgba(255, 79, 154, 0.1);
    opacity: 0.46;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    top: 50%;
    width: clamp(660px, 57vw, 980px);
    height: clamp(900px, 102vh, 1240px);
    animation: floraGlossaryFlowerModel 24s linear infinite;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis::before{
    top: 4%;
    bottom: 3%;
    width: 3px;
    background: linear-gradient(180deg, transparent, rgba(32, 255, 149, 0.2), rgba(246, 241, 223, 0.26), rgba(255, 79, 154, 0.18), transparent);
    opacity: 0.42;
    transform: translateX(-50%) translateZ(-220px);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis::after{
    top: 5%;
    bottom: 5%;
    width: clamp(170px, 14vw, 260px);
    opacity: 0.22;
    transform: translateX(-50%) translateZ(-250px) rotateY(88deg);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane{
    --plane-w: clamp(250px, 23vw, 390px);
    --plane-h: clamp(220px, 20vw, 340px);
    --plane-rx: 0deg;
    --plane-ry: 0deg;
    --plane-rz: 0deg;
    --plane-depth: 0px;
    --plane-bg-size: auto 310%;
    width: var(--plane-w);
    height: var(--plane-h);
    border: 0;
    border-radius: 56% 44% 62% 38% / 48% 58% 42% 52%;
    -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000 0 42%, rgba(0, 0, 0, 0.88) 58%, transparent 76%);
    mask-image: radial-gradient(ellipse at 50% 50%, #000 0 42%, rgba(0, 0, 0, 0.88) 58%, transparent 76%);
    background:
      radial-gradient(circle at 50% 48%, rgba(246, 241, 223, 0.18), transparent 56%),
      var(--glossary-specimen-image);
    background-size: 100% 100%, var(--plane-bg-size);
    background-position: center, var(--flower-crop, 50% 50%);
    box-shadow:
      inset 0 0 54px rgba(246, 241, 223, 0.1),
      0 0 34px color-mix(in srgb, var(--plane-accent) 28%, transparent),
      0 36px 76px rgba(0, 0, 0, 0.34);
    opacity: 0.92;
    filter: saturate(1.7) contrast(1.13) brightness(1.08) drop-shadow(0 0 18px color-mix(in srgb, var(--plane-accent) 22%, transparent));
    overflow: visible;
    transform:
      translate(-50%, -50%)
      translateZ(var(--plane-depth))
      rotateX(var(--plane-rx))
      rotateY(var(--plane-ry))
      rotateZ(var(--plane-rz));
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::before{
    inset: -12px;
    border: 0;
    background: var(--glossary-specimen-image);
    background-size: var(--plane-bg-size);
    background-position: var(--flower-crop, 50% 50%);
    opacity: 0.22;
    filter: grayscale(0.62) saturate(1.18) blur(2px) contrast(1.08);
    transform: translateZ(-46px) scale(1.04);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::after{
    inset: -5px;
    border: 0;
    background:
      linear-gradient(90deg, transparent 0 46%, rgba(246, 241, 223, 0.2) 46% 47%, transparent 47%),
      radial-gradient(circle at 28% 30%, color-mix(in srgb, var(--plane-accent) 32%, transparent), transparent 31%),
      repeating-linear-gradient(102deg, rgba(102, 199, 255, 0.08) 0 1px, transparent 1px 13px);
    opacity: 0.24;
    transform: translateZ(42px);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane span,
  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane b{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--technical-image{
    --plane-x: 49%;
    --plane-y: 17%;
    --plane-w: clamp(330px, 30vw, 520px);
    --plane-h: clamp(250px, 23vw, 390px);
    --plane-depth: -54px;
    --plane-rx: 8deg;
    --plane-ry: -24deg;
    --plane-rz: -6deg;
    --plane-bg-size: auto 292%;
    --flower-crop: 51% 18%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--diffractive-form{
    --plane-x: 63%;
    --plane-y: 38%;
    --plane-w: clamp(280px, 25vw, 430px);
    --plane-h: clamp(270px, 24vw, 410px);
    --plane-depth: 162px;
    --plane-rx: -7deg;
    --plane-ry: 34deg;
    --plane-rz: 8deg;
    --plane-bg-size: auto 322%;
    --flower-crop: 67% 48%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-semiotic{
    --plane-x: 38%;
    --plane-y: 46%;
    --plane-w: clamp(270px, 24vw, 410px);
    --plane-h: clamp(252px, 23vw, 386px);
    --plane-depth: -128px;
    --plane-rx: 7deg;
    --plane-ry: -38deg;
    --plane-rz: -10deg;
    --plane-bg-size: auto 334%;
    --flower-crop: 31% 51%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--image-process{
    --plane-x: 58%;
    --plane-y: 62%;
    --plane-w: clamp(300px, 28vw, 480px);
    --plane-h: clamp(230px, 22vw, 370px);
    --plane-depth: 126px;
    --plane-rx: -11deg;
    --plane-ry: 18deg;
    --plane-rz: -2deg;
    --plane-bg-size: auto 304%;
    --flower-crop: 55% 68%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-correspondence{
    --plane-x: 38%;
    --plane-y: 72%;
    --plane-w: clamp(250px, 23vw, 390px);
    --plane-h: clamp(244px, 22vw, 374px);
    --plane-depth: -82px;
    --plane-rx: 8deg;
    --plane-ry: -28deg;
    --plane-rz: 9deg;
    --plane-bg-size: auto 340%;
    --flower-crop: 31% 74%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--post-photo-herbarium{
    --plane-x: 58%;
    --plane-y: 83%;
    --plane-w: clamp(320px, 29vw, 500px);
    --plane-h: clamp(260px, 24vw, 410px);
    --plane-depth: 146px;
    --plane-rx: -8deg;
    --plane-ry: 26deg;
    --plane-rz: 7deg;
    --plane-bg-size: auto 302%;
    --flower-crop: 57% 83%;
  }

  .workShell[data-work="diffractive-flora"] .specimenConnectorMap{
    z-index: 28;
  }

  .workShell[data-work="diffractive-flora"] .specimenConceptPin{
    z-index: 29;
  }

  .workShell[data-work="diffractive-flora"] .specimenCrop{
    z-index: 30;
    opacity: 0.72;
  }
}

/* Performance-balanced version of the rotating flower model. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .specimenLayer{
    opacity: 0.12;
    filter: grayscale(0.74) saturate(0.86) contrast(1.12) brightness(0.68);
    transform: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.18;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--glow{
    opacity: 0.18;
    filter: grayscale(0.5) saturate(0.95) contrast(1.02) brightness(0.86);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    opacity: 0.13;
    filter: saturate(1.25) contrast(1.06) brightness(0.72);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable{
    perspective: 760px;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    width: clamp(560px, 50vw, 820px);
    height: clamp(800px, 92vh, 1080px);
    animation-duration: 26s;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane{
    --plane-w: clamp(220px, 20vw, 340px);
    --plane-h: clamp(190px, 18vw, 300px);
    width: var(--plane-w);
    height: var(--plane-h);
    border-radius: 58% 42% 55% 45% / 46% 57% 43% 54%;
    -webkit-mask-image: none;
    mask-image: none;
    overflow: hidden;
    background:
      radial-gradient(circle at 50% 45%, rgba(246, 241, 223, 0.12), transparent 58%),
      var(--glossary-specimen-image);
    background-size: 100% 100%, var(--plane-bg-size, auto 320%);
    background-position: center, var(--flower-crop, 50% 50%);
    box-shadow:
      inset 0 0 36px rgba(246, 241, 223, 0.08),
      0 0 22px color-mix(in srgb, var(--plane-accent) 24%, transparent),
      0 22px 48px rgba(0, 0, 0, 0.3);
    filter: saturate(1.45) contrast(1.08) brightness(1.04);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::before{
    inset: 0;
    background: var(--glossary-specimen-image);
    background-size: var(--plane-bg-size, auto 320%);
    background-position: var(--flower-crop, 50% 50%);
    opacity: 0.12;
    filter: grayscale(0.6) saturate(1.1) contrast(1.05);
    transform: translateZ(-32px) scale(1.03);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::after{
    inset: 0;
    background:
      linear-gradient(90deg, transparent 0 46%, rgba(246, 241, 223, 0.14) 46% 47%, transparent 47%),
      repeating-linear-gradient(105deg, rgba(102, 199, 255, 0.06) 0 1px, transparent 1px 15px);
    opacity: 0.16;
    transform: translateZ(28px);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--technical-image{
    --plane-x: 49%;
    --plane-y: 18%;
    --plane-w: clamp(280px, 26vw, 440px);
    --plane-h: clamp(220px, 20vw, 340px);
    --plane-depth: -42px;
    --plane-bg-size: auto 300%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--diffractive-form{
    --plane-x: 63%;
    --plane-y: 39%;
    --plane-w: clamp(250px, 23vw, 390px);
    --plane-h: clamp(245px, 22vw, 370px);
    --plane-depth: 132px;
    --plane-bg-size: auto 324%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-semiotic{
    --plane-x: 38%;
    --plane-y: 47%;
    --plane-w: clamp(246px, 22vw, 370px);
    --plane-h: clamp(220px, 20vw, 340px);
    --plane-depth: -104px;
    --plane-bg-size: auto 338%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--image-process{
    --plane-x: 58%;
    --plane-y: 62%;
    --plane-w: clamp(270px, 25vw, 420px);
    --plane-h: clamp(210px, 20vw, 330px);
    --plane-depth: 104px;
    --plane-bg-size: auto 314%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--material-correspondence{
    --plane-x: 38%;
    --plane-y: 72%;
    --plane-w: clamp(230px, 21vw, 350px);
    --plane-h: clamp(220px, 20vw, 340px);
    --plane-depth: -70px;
    --plane-bg-size: auto 346%;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane--post-photo-herbarium{
    --plane-x: 58%;
    --plane-y: 83%;
    --plane-w: clamp(284px, 26vw, 440px);
    --plane-h: clamp(226px, 21vw, 360px);
    --plane-depth: 124px;
    --plane-bg-size: auto 308%;
  }
}

/* Single-image 3D specimen: lower-cost rotating model built from the flower scan itself. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    perspective: 820px;
    perspective-origin: 50% 48%;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    --layer-depth: 0px;
    inset: -4% -13%;
    clip-path: none !important;
    background-size: auto 102%;
    background-position: 50% 49%;
    transform-origin: 50% 50%;
    transform-style: preserve-3d;
    animation: floraGlossarySpecimenModel 30s linear infinite;
    will-change: transform;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    --layer-depth: -86px;
    opacity: 0.42;
    filter: grayscale(0.56) saturate(0.82) contrast(1.16) brightness(0.72);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--glow{
    --layer-depth: -128px;
    opacity: 0.16;
    filter: grayscale(0.36) saturate(0.96) contrast(1.04) brightness(1.04);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    --layer-depth: 22px;
    opacity: 0.62;
    filter: saturate(1.32) contrast(1.08) brightness(0.95);
    mix-blend-mode: screen;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a{
    --layer-depth: 62px;
    opacity: 0.12;
    filter: saturate(1.5) contrast(1.1) brightness(0.9);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b{
    --layer-depth: -24px;
    opacity: 0.12;
    filter: saturate(1.5) contrast(1.08) brightness(0.85);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--echo{
    --layer-depth: -160px;
    opacity: 0.1;
    filter: grayscale(0.45) saturate(0.9) contrast(1.08) brightness(0.7);
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable{
    z-index: 26;
    opacity: 1;
    perspective: inherit;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::before,
  .workShell[data-work="diffractive-flora"] .specimenTurntable::after{
    opacity: 0.28;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    width: clamp(480px, 44vw, 720px);
    height: clamp(720px, 86vh, 980px);
    animation: floraGlossarySpecimenModel 30s linear infinite;
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane{
    width: 13px;
    height: 13px;
    border: 1px solid rgba(246, 241, 223, 0.42);
    border-radius: 50%;
    background: var(--plane-accent);
    box-shadow:
      0 0 0 7px color-mix(in srgb, var(--plane-accent) 14%, transparent),
      0 0 22px color-mix(in srgb, var(--plane-accent) 46%, transparent);
    opacity: 0.92;
    filter: none;
    transform:
      translate(-50%, -50%)
      translateZ(var(--plane-depth, 0px));
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::before{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: clamp(48px, 4.8vw, 78px);
    height: 1px;
    background: linear-gradient(90deg, var(--plane-accent), rgba(102, 199, 255, 0.32), transparent);
    opacity: 0.54;
    transform: translateY(-50%) translateZ(-12px);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane::after{
    content: "";
    position: absolute;
    inset: -18px;
    border: 1px solid color-mix(in srgb, var(--plane-accent) 34%, transparent);
    border-radius: 50%;
    background: transparent;
    opacity: 0.42;
    transform: translateZ(-18px);
  }
}

@keyframes floraGlossarySpecimenModel{
  0%{
    transform: translateZ(var(--layer-depth, 0px)) rotateX(4deg) rotateY(-24deg) rotateZ(-0.8deg);
  }
  25%{
    transform: translateZ(var(--layer-depth, 0px)) rotateX(3deg) rotateY(58deg) rotateZ(0.5deg);
  }
  50%{
    transform: translateZ(var(--layer-depth, 0px)) rotateX(4deg) rotateY(156deg) rotateZ(0.9deg);
  }
  75%{
    transform: translateZ(var(--layer-depth, 0px)) rotateX(3deg) rotateY(244deg) rotateZ(-0.4deg);
  }
  100%{
    transform: translateZ(var(--layer-depth, 0px)) rotateX(4deg) rotateY(336deg) rotateZ(-0.8deg);
  }
}

@media (prefers-reduced-motion: reduce){
  .workShell[data-work="diffractive-flora"] .specimenLayer,
  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    animation: none;
    transform: translateZ(var(--layer-depth, 0px)) rotateX(4deg) rotateY(-24deg) rotateZ(-0.8deg);
  }
}

/* Lightweight final model: one rotating flower plate with fixed schematic annotations. */
@media (min-width: 981px){
  .workShell[data-work="diffractive-flora"] .flora-glossary-specimen{
    perspective: 860px;
    perspective-origin: 50% 48%;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer{
    animation: none !important;
    transform: none;
    will-change: auto;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--base{
    opacity: 0.2;
    filter: grayscale(0.64) saturate(0.78) contrast(1.12) brightness(0.6);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--glow{
    opacity: 0.1;
    filter: grayscale(0.4) saturate(0.9) contrast(1) brightness(0.82);
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    opacity: 0.76;
    filter: saturate(1.28) contrast(1.08) brightness(0.96);
    animation: floraGlossarySpecimenPlateLite 24s linear infinite !important;
    transform-origin: 50% 50%;
    transform-style: preserve-3d;
    will-change: transform;
  }

  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-a,
  .workShell[data-work="diffractive-flora"] .specimenLayer--rgb-b,
  .workShell[data-work="diffractive-flora"] .specimenLayer--echo{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable{
    z-index: 26;
    opacity: 1;
    perspective: none;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntable::before,
  .workShell[data-work="diffractive-flora"] .specimenTurntable::after{
    opacity: 0.22;
  }

  .workShell[data-work="diffractive-flora"] .specimenTurntableAxis{
    animation: none !important;
    transform: translate(-50%, -50%) !important;
    width: clamp(430px, 40vw, 650px);
    height: clamp(680px, 82vh, 920px);
  }

  .workShell[data-work="diffractive-flora"] .specimenFlowerPlane{
    width: 12px;
    height: 12px;
    transform: translate(-50%, -50%) !important;
    box-shadow:
      0 0 0 6px color-mix(in srgb, var(--plane-accent) 12%, transparent),
      0 0 16px color-mix(in srgb, var(--plane-accent) 38%, transparent);
  }
}

@keyframes floraGlossarySpecimenPlateLite{
  0%{
    transform: rotateX(4deg) rotateY(-30deg) rotateZ(-0.6deg) scale(0.98);
  }
  25%{
    transform: rotateX(3deg) rotateY(3deg) rotateZ(0.2deg) scale(0.985);
  }
  50%{
    transform: rotateX(4deg) rotateY(30deg) rotateZ(0.6deg) scale(0.98);
  }
  75%{
    transform: rotateX(3deg) rotateY(0deg) rotateZ(-0.2deg) scale(0.985);
  }
  100%{
    transform: rotateX(4deg) rotateY(-30deg) rotateZ(-0.6deg) scale(0.98);
  }
}

@media (prefers-reduced-motion: reduce){
  .workShell[data-work="diffractive-flora"] .specimenLayer--color{
    animation: none !important;
    transform: rotateX(4deg) rotateY(-30deg) rotateZ(-0.6deg) scale(0.98) !important;
  }
}

/* Chapter 03 integrated artwork: pale scan-field, editorial text, image-to-ASCII comparison. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
  --process-cobalt: #244fff;
  --process-blue-deep: #1438c8;
  --process-ink: #10245e;
  --process-paper: #f5f7ff;
  --process-paper-soft: rgba(245, 247, 255, 0.86);
  --process-forest: #1d5f3b;
  --process-pink: #ff4f9a;
  --process-orange: #ff7a1a;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto auto auto;
  align-items: start;
  min-height: clamp(1260px, 132svh, 1640px);
  margin: clamp(-44px, -3vw, -24px) 0 clamp(-70px, -4.8vw, -34px);
  padding: clamp(136px, 10.5vw, 190px) clamp(40px, 6vw, 104px) clamp(142px, 9vw, 190px);
  gap: clamp(22px, 3vw, 48px) clamp(18px, 2.6vw, 42px);
  color: var(--process-ink);
  background:
    linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.88) 6%, rgba(9, 13, 20, 0.38) 12%, rgba(226, 234, 252, 0.76) 19%, rgba(247, 249, 255, 0.96) 34%, rgba(236, 242, 255, 0.94) 68%, rgba(220, 230, 250, 0.64) 79%, rgba(5, 5, 5, 0.74) 94%, #050505 100%),
    radial-gradient(ellipse at 66% 28%, rgba(36, 79, 255, 0.2), transparent 34%),
    radial-gradient(ellipse at 30% 24%, rgba(255, 255, 255, 0.34), transparent 28%),
    radial-gradient(ellipse at 72% 76%, rgba(255, 79, 154, 0.1), transparent 25%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.16) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(36, 79, 255, 0.1) 0 1px, transparent 1px) 0 0 / 100% 10%;
  overflow: hidden;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
  content: "";
  position: absolute;
  inset: clamp(82px, 7vw, 130px) clamp(26px, 4vw, 76px) clamp(92px, 7vw, 138px);
  z-index: 0;
  pointer-events: none;
  opacity: 0.95;
  background:
    linear-gradient(90deg, rgba(255, 122, 26, 0.72) 0 2px, transparent 2px) 1.3% 0 / 100% 100% no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.1) 0 0.56px, transparent 0.94px) 0 0 / 3px 3px,
    linear-gradient(90deg, transparent 0 30%, rgba(36, 79, 255, 0.2) 30% 30.08%, transparent 30.16% 63%, rgba(36, 79, 255, 0.16) 63% 63.08%, transparent 63.16%),
    linear-gradient(180deg, transparent 0 17%, rgba(36, 79, 255, 0.22) 17% 17.08%, transparent 17.16% 62%, rgba(36, 79, 255, 0.14) 62% 62.08%, transparent 62.16%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(239, 244, 255, 0.34));
  box-shadow:
    inset 0 0 0 1px rgba(36, 79, 255, 0.16),
    inset 0 0 80px rgba(255, 255, 255, 0.36);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 8%, #000 82%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 8%, #000 82%, transparent 100%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0.34;
  background:
    linear-gradient(90deg, rgba(245, 247, 255, 0.84), rgba(245, 247, 255, 0.16) 36%, rgba(5, 5, 5, 0.08) 72%) 0 24% / 100% 38% no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 53% 43% / min(76vw, 1040px) auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 78% 66% / min(42vw, 560px) auto no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.36) 28%, rgba(255, 255, 255, 0.18) 70%, rgba(255, 255, 255, 0) 100%);
  background-blend-mode: lighten, multiply, multiply, normal;
  filter: grayscale(1) contrast(1.35) brightness(1.08);
  -webkit-mask-image: linear-gradient(180deg, transparent 4%, #000 19%, #000 74%, transparent 94%);
  mask-image: linear-gradient(180deg, transparent 4%, #000 19%, #000 74%, transparent 94%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  position: relative;
  z-index: 3;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
  grid-column: 1 / 8;
  grid-row: 1;
  align-self: start;
  z-index: 8;
  max-width: none;
  overflow: visible;
  padding: clamp(10px, 1.2vw, 18px) 0 0 clamp(18px, 2vw, 32px);
  color: var(--process-ink);
  border: 0;
  background: none;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::before{
  content: "IMAGE TRANSLATION / CHAPTER 03";
  display: block;
  width: max-content;
  max-width: 100%;
  margin: 0 0 clamp(16px, 1.5vw, 24px);
  padding: 0 0 7px;
  color: rgba(36, 79, 255, 0.9);
  border-bottom: 2px solid rgba(36, 79, 255, 0.74);
  font: 800 clamp(9px, 0.68vw, 11px)/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
  content: "source / dither / ascii / memory";
  display: block;
  width: min(68vw, 740px);
  margin-top: clamp(14px, 1.5vw, 24px);
  padding-top: clamp(9px, 1vw, 14px);
  color: rgba(29, 95, 59, 0.84);
  border-top: 1px solid rgba(36, 79, 255, 0.34);
  font: 700 clamp(9px, 0.7vw, 11px)/1.2 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIndex{
  color: var(--process-orange);
  font: 800 clamp(12px, 0.95vw, 15px)/1 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  width: min-content;
  max-width: none;
  margin: clamp(8px, 1vw, 14px) 0 0;
  padding: 0;
  color: rgba(18, 51, 190, 0.96);
  font: 500 clamp(72px, 8.6vw, 138px)/0.78 "Cinzel Decorative", "Bodoni Moda", var(--display);
  letter-spacing: 0;
  text-transform: uppercase;
  text-shadow:
    1px 0 0 rgba(255, 122, 26, 0.28),
    -1px 0 0 rgba(255, 79, 154, 0.18),
    0 1px 0 rgba(255, 255, 255, 0.82);
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  position: relative;
  z-index: 6;
  width: min(61vw, 760px);
  max-width: none;
  margin-top: clamp(18px, 2vw, 32px);
  padding: clamp(14px, 1.4vw, 22px) clamp(18px, 2.1vw, 34px);
  color: rgba(255, 255, 255, 0.98);
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.96), rgba(36, 79, 255, 0.86) 54%, rgba(36, 79, 255, 0.28)),
    radial-gradient(circle, rgba(255, 255, 255, 0.34) 0 0.75px, transparent 1.25px) 0 0 / 5px 5px;
  border: 0;
  border-left: 5px solid rgba(255, 122, 26, 0.92);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.22),
    inset 0 -2px 0 rgba(255, 122, 26, 0.82),
    0 18px 48px rgba(36, 79, 255, 0.18);
  font: 800 clamp(19px, 1.55vw, 28px)/1.15 "Montserrat", "Didact Gothic", var(--sans);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
  grid-column: 4 / 13;
  grid-row: 1 / span 3;
  align-self: start;
  z-index: 4;
  height: clamp(780px, 88svh, 980px);
  min-height: 0;
  margin: clamp(82px, 7.2vw, 126px) 0 0;
  overflow: visible;
  isolation: isolate;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
  content: "";
  position: absolute;
  inset: clamp(40px, 4vw, 68px) 0 clamp(98px, 7vw, 142px) 3%;
  z-index: 0;
  pointer-events: none;
  opacity: 0.92;
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.62), rgba(36, 79, 255, 0.62)) 5% 17% / 78% 1px no-repeat,
    linear-gradient(132deg, transparent 0 49.4%, rgba(36, 79, 255, 0.72) 49.5% 50%, transparent 50.1%) 68% 7% / 130px 92px no-repeat,
    linear-gradient(90deg, transparent 0 9%, rgba(36, 79, 255, 0.22) 9% 9.08%, transparent 9.16% 51%, rgba(36, 79, 255, 0.18) 51% 51.08%, transparent 51.16%),
    linear-gradient(180deg, transparent 0 17%, rgba(36, 79, 255, 0.18) 17% 17.08%, transparent 17.16% 76%, rgba(255, 79, 154, 0.18) 76% 76.08%, transparent 76.16%),
    radial-gradient(circle, rgba(36, 79, 255, 0.11) 0 0.58px, transparent 0.95px) 0 0 / 3px 3px,
    linear-gradient(180deg, rgba(255, 255, 255, 0.64), rgba(240, 244, 255, 0.28));
  box-shadow:
    inset 0 0 0 1px rgba(36, 79, 255, 0.22),
    inset 0 0 80px rgba(255, 255, 255, 0.34);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 8%, #000 86%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 8%, #000 86%, transparent 100%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
  content: "ASCII\Aminimalist";
  position: absolute;
  right: 5.5%;
  top: clamp(66px, 7vw, 104px);
  bottom: auto;
  left: auto;
  z-index: 8;
  width: max-content;
  padding-left: 58px;
  white-space: pre;
  color: rgba(36, 79, 255, 0.94);
  background:
    linear-gradient(132deg, transparent 0 46%, rgba(36, 79, 255, 0.84) 47% 50%, transparent 51%) 0 50% / 46px 26px no-repeat,
    linear-gradient(90deg, rgba(36, 79, 255, 0.78), rgba(36, 79, 255, 0.78)) 0 50% / 51px 1px no-repeat;
  font: 800 clamp(13px, 1.05vw, 17px)/0.92 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  opacity: 0.9;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure{
  position: absolute;
  margin: 0;
  overflow: hidden;
  border-radius: 0;
  border: 1px solid rgba(36, 79, 255, 0.46);
  background: var(--process-paper);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.46),
    0 18px 48px rgba(26, 52, 144, 0.18);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure img{
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transform: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure::after{
  content: attr(data-signal-index) " / " attr(data-label);
  position: absolute;
  inset: auto 8px 8px 8px;
  z-index: 9;
  display: block;
  padding: 6px 8px;
  color: var(--process-forest);
  background: rgba(245, 247, 255, 0.82);
  border-top: 1px solid rgba(36, 79, 255, 0.3);
  font: 700 clamp(8px, 0.66vw, 10px)/1.1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure:hover{
  z-index: 10;
  border-color: rgba(255, 122, 26, 0.86);
  transform: translateY(-3px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure:hover img{
  filter: saturate(1.05) contrast(1.06) brightness(1.02);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 22%;
  top: 24%;
  width: 45%;
  aspect-ratio: 0.786;
  z-index: 4;
  background: #0733dd;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
  opacity: 0.62;
  background:
    radial-gradient(circle, rgba(239, 240, 247, 0.86) 0 1px, transparent 1.5px) 0 0 / 5px 5px,
    linear-gradient(rgba(36, 79, 255, 0.5), rgba(36, 79, 255, 0.5));
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither img{
  opacity: 0.94;
  filter: grayscale(1) contrast(2.12) brightness(1.18);
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 58%;
  top: 23%;
  width: 40%;
  aspect-ratio: 0.772;
  z-index: 5;
  background: rgba(249, 251, 255, 0.96);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
  opacity: 0.24;
  background:
    linear-gradient(90deg, rgba(255, 79, 154, 0.08), transparent 24%, transparent 76%, rgba(255, 122, 26, 0.08)),
    linear-gradient(180deg, transparent 0 42%, rgba(255, 79, 154, 0.22) 42% 42.18%, transparent 42.36%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii img{
  opacity: 1;
  filter: saturate(1.06) contrast(1.1) brightness(1);
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-strip,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-sample{
  display: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
  grid-column: 1 / 6;
  grid-row: 2;
  align-self: start;
  z-index: 7;
  width: min(100%, 42ch);
  max-width: none;
  margin: clamp(18px, 2vw, 34px) 0 0 clamp(18px, 2vw, 32px);
  padding: clamp(25px, 2.5vw, 38px) clamp(21px, 2.2vw, 34px);
  color: rgba(16, 36, 94, 0.9);
  border: 1px solid rgba(36, 79, 255, 0.24);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(245, 247, 255, 0.72)),
    repeating-linear-gradient(180deg, rgba(36, 79, 255, 0.035) 0 1px, transparent 1px 28px);
  box-shadow:
    inset 3px 0 0 rgba(255, 122, 26, 0.56),
    0 18px 54px rgba(16, 36, 94, 0.12);
  backdrop-filter: blur(8px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::before{
  content: "correspondence log";
  display: block;
  width: max-content;
  max-width: 100%;
  margin-bottom: clamp(12px, 1.2vw, 18px);
  padding-bottom: 6px;
  color: rgba(29, 95, 59, 0.78);
  border-bottom: 1px solid rgba(36, 79, 255, 0.28);
  font: 700 clamp(9px, 0.68vw, 11px)/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody p{
  margin: 0;
  color: rgba(16, 36, 94, 0.88);
  font: 400 clamp(14px, 0.98vw, 17px)/1.58 "Courier New", ui-monospace, monospace;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody p:first-child{
  color: rgba(16, 36, 94, 0.96);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  grid-column: 1 / 6;
  grid-row: 3;
  z-index: 7;
  width: min(100%, 42ch);
  margin: clamp(10px, 1.4vw, 22px) 0 0 clamp(18px, 2vw, 32px);
  padding: 12px clamp(16px, 1.6vw, 24px) 0 0;
  color: rgba(255, 79, 154, 0.84);
  border-top: 2px solid rgba(255, 79, 154, 0.68);
  border-right: 0;
  font: 800 clamp(10px, 0.78vw, 12px)/1.45 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    padding-inline: clamp(32px, 5vw, 64px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(62px, 8.2vw, 98px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    width: min(64vw, 690px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(700px, 82svh, 900px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    min-height: 0;
    margin: -28px 0 -38px;
    padding: 98px 18px 120px;
    background:
      linear-gradient(180deg, #050505 0%, rgba(5, 5, 5, 0.84) 6%, rgba(226, 234, 252, 0.74) 16%, rgba(247, 249, 255, 0.96) 34%, rgba(236, 242, 255, 0.94) 72%, rgba(5, 5, 5, 0.76) 96%, #050505 100%),
      radial-gradient(ellipse at 58% 26%, rgba(36, 79, 255, 0.18), transparent 38%),
      linear-gradient(90deg, rgba(36, 79, 255, 0.14) 0 1px, transparent 1px) 0 0 / 16.666% 100%,
      linear-gradient(180deg, rgba(36, 79, 255, 0.09) 0 1px, transparent 1px) 0 0 / 100% 7%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
    inset: 58px 14px 70px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
    opacity: 0.2;
    background-size: auto, min(118vw, 720px) auto, min(78vw, 420px) auto, auto;
    background-position: 0 22%, 48% 38%, 70% 73%, 0 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-column: 1;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
    grid-row: 1;
    padding: 12px 12px 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 9.6ch;
    font-size: clamp(48px, 14vw, 76px);
    line-height: 0.84;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
    width: 100%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    grid-row: 2;
    height: clamp(560px, 136vw, 760px);
    margin: 2px 0 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
    inset: 28px 4px 54px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 5%;
    top: 27%;
    width: 52%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 43%;
    top: 29.5%;
    width: 52%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
    grid-row: 3;
    width: 100%;
    margin: 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-row: 4;
    width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 560px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    padding-inline: 15px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(42px, 12.4vw, 58px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    font-size: clamp(17px, 5vw, 22px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(500px, 126vw, 620px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
    top: 7%;
    right: 5%;
    padding-left: 42px;
    font-size: 11px;
    background:
      linear-gradient(132deg, transparent 0 46%, rgba(36, 79, 255, 0.84) 47% 50%, transparent 51%) 0 50% / 34px 22px no-repeat,
      linear-gradient(90deg, rgba(36, 79, 255, 0.78), rgba(36, 79, 255, 0.78)) 0 50% / 38px 1px no-repeat;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 4%;
    top: 29%;
    width: 53%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 41.5%;
    top: 31.5%;
    width: 54%;
  }
}

/* Chapter 03 final polish: clear the lead from the image pair and activate the lower scan field. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  width: min(54vw, 660px);
  padding-right: clamp(30px, 3.6vw, 54px);
  clip-path: polygon(0 0, calc(100% - clamp(18px, 2vw, 32px)) 0, 100% 100%, 0 100%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
  width: min(54vw, 660px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  position: relative;
  min-height: clamp(96px, 9vw, 142px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::before{
  content: "";
  position: absolute;
  left: clamp(290px, 33vw, 470px);
  top: clamp(-382px, -26vw, -296px);
  width: clamp(168px, 18vw, 260px);
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 79, 154, 0.68), rgba(36, 79, 255, 0.36), transparent);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::after{
  content: "PROCESS MEMORY\A 09.03 / RASTER RESIDUE\A DRAG :: TRANSLUCENCY :: DRIFT";
  position: absolute;
  left: clamp(420px, 39vw, 560px);
  top: clamp(-420px, -28vw, -320px);
  z-index: 8;
  width: clamp(270px, 31vw, 430px);
  min-height: clamp(74px, 7vw, 108px);
  padding: clamp(14px, 1.15vw, 18px) clamp(15px, 1.35vw, 20px);
  color: rgba(16, 36, 94, 0.82);
  border: 1px solid rgba(36, 79, 255, 0.28);
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.74) 0 14%, rgba(255, 79, 154, 0.42) 14% 20%, rgba(255, 122, 26, 0.46) 20% 26%, transparent 26%) 0 0 / 100% 8px no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.14) 0 0.55px, transparent 0.95px) 0 0 / 3px 3px,
    linear-gradient(180deg, rgba(255, 255, 255, 0.54), rgba(245, 247, 255, 0.2));
  box-shadow:
    inset 3px 0 0 rgba(255, 79, 154, 0.46),
    0 16px 44px rgba(16, 36, 94, 0.1);
  backdrop-filter: blur(5px);
  white-space: pre;
  font: 800 clamp(9px, 0.72vw, 11px)/1.5 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
    width: min(60vw, 620px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::before{
    left: clamp(250px, 31vw, 340px);
    width: clamp(132px, 17vw, 210px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::after{
    left: clamp(330px, 38vw, 420px);
    width: clamp(230px, 34vw, 330px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    width: 100%;
    padding-right: clamp(18px, 5vw, 30px);
    clip-path: none;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
    width: 100%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    min-height: 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::before{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::after{
    position: static;
    display: block;
    width: auto;
    min-height: 0;
    margin-top: 16px;
  }
}

/* Chapter 03 corrective pass: compose the lead and lower residue as part of one field. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  width: min(100%, 35ch);
  max-width: 424px;
  padding: clamp(15px, 1.45vw, 22px) clamp(18px, 1.9vw, 28px);
  clip-path: none;
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.98), rgba(36, 79, 255, 0.9)),
    radial-gradient(circle, rgba(255, 255, 255, 0.34) 0 0.75px, transparent 1.25px) 0 0 / 5px 5px;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
  width: min(100%, 35ch);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
  overflow: visible;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  content: "RASTER RESIDUE / 09.03";
  position: absolute;
  left: calc(100% + clamp(34px, 4.8vw, 78px));
  top: clamp(330px, 30vw, 430px);
  z-index: 2;
  display: flex;
  align-items: flex-end;
  width: clamp(390px, 42vw, 590px);
  height: clamp(235px, 26vw, 350px);
  padding: clamp(10px, 0.95vw, 14px) clamp(12px, 1.1vw, 18px);
  pointer-events: none;
  color: rgba(29, 95, 59, 0.86);
  border: 1px solid rgba(36, 79, 255, 0.24);
  background:
    linear-gradient(180deg, transparent 0 79%, rgba(245, 247, 255, 0.76) 79% 100%),
    linear-gradient(90deg, rgba(255, 79, 154, 0.5) 0 18%, rgba(36, 79, 255, 0.52) 18% 48%, rgba(255, 122, 26, 0.38) 48% 64%, transparent 64%) 12px calc(100% - 17px) / 122px 7px no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.12) 0 0.55px, transparent 0.95px) 0 0 / 3px 3px,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 50% 44% / min(88%, 520px) auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 48% 54% / 118% auto no-repeat,
    linear-gradient(180deg, rgba(245, 247, 255, 0.44), rgba(222, 231, 249, 0.24));
  background-blend-mode: normal, normal, normal, multiply, screen, normal;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.36),
    inset 0 -28px 42px rgba(245, 247, 255, 0.28),
    0 20px 54px rgba(16, 36, 94, 0.09);
  filter: grayscale(0.18) contrast(1.05);
  font: 800 clamp(9px, 0.72vw, 11px)/1.1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  min-height: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::before,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::after{
  display: none;
  content: none;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
    width: min(100%, 35ch);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    left: calc(100% + clamp(24px, 3.6vw, 44px));
    width: clamp(330px, 40vw, 460px);
    height: clamp(220px, 27vw, 310px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    height: clamp(210px, 62vw, 320px);
    margin-top: 20px;
  }
}

/* Chapter 03 cohesion pass: make the quote, comparison plates, residue, and fades read as one scan field. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
  min-height: clamp(1340px, 142svh, 1740px);
  margin: clamp(-58px, -3.8vw, -32px) 0 clamp(-82px, -5.2vw, -44px);
  padding-top: clamp(148px, 11vw, 206px);
  padding-bottom: clamp(158px, 10vw, 214px);
  background:
    linear-gradient(180deg, rgba(5, 5, 5, 0.92) 0%, rgba(26, 30, 35, 0.68) 7%, rgba(184, 196, 214, 0.42) 14%, rgba(240, 245, 255, 0.9) 24%, rgba(247, 249, 255, 0.98) 42%, rgba(235, 242, 255, 0.94) 70%, rgba(224, 233, 250, 0.72) 82%, rgba(52, 57, 64, 0.5) 92%, rgba(5, 5, 5, 0.82) 100%),
    radial-gradient(ellipse at 60% 24%, rgba(255, 255, 255, 0.42), transparent 30%),
    radial-gradient(ellipse at 67% 45%, rgba(36, 79, 255, 0.18), transparent 36%),
    radial-gradient(ellipse at 55% 77%, rgba(36, 79, 255, 0.11), transparent 32%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.13) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(36, 79, 255, 0.08) 0 1px, transparent 1px) 0 0 / 100% 9%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
  inset: clamp(72px, 6.4vw, 118px) clamp(30px, 4.5vw, 86px) clamp(84px, 6.8vw, 128px);
  opacity: 0.9;
  background:
    linear-gradient(90deg, rgba(255, 122, 26, 0.68) 0 2px, transparent 2px) 1.3% 0 / 100% 100% no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.09) 0 0.56px, transparent 0.94px) 0 0 / 3px 3px,
    linear-gradient(90deg, transparent 0 30%, rgba(36, 79, 255, 0.18) 30% 30.08%, transparent 30.16% 63%, rgba(36, 79, 255, 0.14) 63% 63.08%, transparent 63.16%),
    linear-gradient(180deg, transparent 0 17%, rgba(36, 79, 255, 0.2) 17% 17.08%, transparent 17.16% 60%, rgba(36, 79, 255, 0.13) 60% 60.08%, transparent 60.16%, rgba(255, 79, 154, 0.14) 78% 78.08%, transparent 78.16%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.68), rgba(239, 244, 255, 0.28));
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 13%, #000 82%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 13%, #000 82%, transparent 100%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
  opacity: 0.28;
  background:
    linear-gradient(90deg, rgba(245, 247, 255, 0.62), rgba(245, 247, 255, 0.1) 38%, rgba(5, 5, 5, 0.05) 74%) 0 24% / 100% 40% no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 52% 43% / min(76vw, 1040px) auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 76% 69% / min(40vw, 540px) auto no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.28) 28%, rgba(255, 255, 255, 0.16) 72%, rgba(255, 255, 255, 0) 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 2%, #000 18%, #000 79%, transparent 96%);
  mask-image: linear-gradient(180deg, transparent 2%, #000 18%, #000 79%, transparent 96%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
  grid-column: 1 / 7;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  text-shadow:
    1px 0 0 rgba(255, 122, 26, 0.24),
    -1px 0 0 rgba(255, 79, 154, 0.16),
    0 1px 0 rgba(255, 255, 255, 0.72),
    0 0 26px rgba(245, 247, 255, 0.2);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 438px;
  margin-top: clamp(22px, 2.5vw, 40px);
  padding: clamp(16px, 1.45vw, 22px) clamp(20px, 2vw, 30px);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.24),
    inset 0 -2px 0 rgba(255, 122, 26, 0.82),
    0 16px 44px rgba(36, 79, 255, 0.16);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead::after{
  content: "";
  position: absolute;
  left: calc(100% + 8px);
  top: 50%;
  width: clamp(36px, 4.2vw, 70px);
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 122, 26, 0.78), rgba(36, 79, 255, 0.62), transparent);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro::after{
  margin-top: clamp(16px, 1.8vw, 28px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
  height: clamp(820px, 90svh, 1020px);
  margin-top: clamp(96px, 7.8vw, 136px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
  inset: clamp(38px, 3.8vw, 64px) 0 clamp(74px, 6vw, 118px) 1%;
  opacity: 0.86;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 22.5%;
  top: 25.5%;
  width: 45.5%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 59%;
  top: 24.25%;
  width: 40.5%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii::before{
  opacity: 0.18;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
  margin-top: clamp(22px, 2.4vw, 42px);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(245, 247, 255, 0.78)),
    repeating-linear-gradient(180deg, rgba(36, 79, 255, 0.03) 0 1px, transparent 1px 28px);
  box-shadow:
    inset 3px 0 0 rgba(255, 122, 26, 0.5),
    0 14px 42px rgba(16, 36, 94, 0.1);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  left: calc(100% + clamp(42px, 5.2vw, 86px));
  top: clamp(292px, 27vw, 392px);
  z-index: 3;
  width: clamp(440px, 45vw, 660px);
  height: clamp(275px, 29vw, 400px);
  padding: clamp(12px, 1.1vw, 16px) clamp(14px, 1.3vw, 20px);
  color: rgba(20, 70, 43, 0.9);
  border-color: rgba(36, 79, 255, 0.3);
  background:
    linear-gradient(180deg, transparent 0 75%, rgba(245, 247, 255, 0.82) 75% 100%),
    linear-gradient(90deg, rgba(255, 79, 154, 0.55) 0 18%, rgba(36, 79, 255, 0.58) 18% 48%, rgba(255, 122, 26, 0.42) 48% 64%, transparent 64%) 14px calc(100% - 19px) / 132px 7px no-repeat,
    linear-gradient(90deg, transparent 0 54%, rgba(36, 79, 255, 0.22) 54% 54.12%, transparent 54.24%),
    linear-gradient(180deg, transparent 0 44%, rgba(255, 79, 154, 0.16) 44% 44.16%, transparent 44.32%),
    radial-gradient(circle, rgba(36, 79, 255, 0.11) 0 0.55px, transparent 0.95px) 0 0 / 3px 3px,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 52% 41% / min(90%, 600px) auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 50% 55% / 116% auto no-repeat,
    linear-gradient(180deg, rgba(245, 247, 255, 0.48), rgba(222, 231, 249, 0.28));
  background-blend-mode: normal, normal, normal, normal, normal, multiply, screen, normal;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.38),
    inset 0 -34px 44px rgba(245, 247, 255, 0.34),
    0 18px 48px rgba(16, 36, 94, 0.08);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
  grid-column: 1 / 10;
  width: auto;
  margin-top: clamp(20px, 2.6vw, 42px);
  color: rgba(255, 79, 154, 0.92);
  border-top-color: rgba(255, 79, 154, 0.76);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote::before{
  content: "";
  position: absolute;
  left: 0;
  top: -2px;
  display: block;
  width: min(100%, 760px);
  height: 1px;
  background: linear-gradient(90deg, rgba(255, 79, 154, 0.78), rgba(36, 79, 255, 0.42) 38%, rgba(29, 95, 59, 0.26), transparent);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead::after{
    width: clamp(22px, 3vw, 42px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    left: calc(100% + clamp(26px, 3.8vw, 46px));
    top: clamp(318px, 30vw, 402px);
    width: clamp(360px, 42vw, 500px);
    height: clamp(235px, 28vw, 330px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    min-height: 0;
    padding-top: 106px;
    padding-bottom: 128px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
    grid-column: 1;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead::after{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(600px, 142vw, 780px);
    margin-top: 8px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 4%;
    top: 28%;
    width: 54%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 42%;
    top: 30%;
    width: 54%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    width: 100%;
    height: clamp(230px, 66vw, 340px);
    margin-top: 24px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-column: 1;
    width: 100%;
    margin-left: 0;
  }
}

/* Chapter 03 comment pass: remove title/image overlap, clarify the split scan, and soften side edges. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
  background:
    linear-gradient(180deg, rgba(5, 5, 5, 0.9) 0%, rgba(24, 28, 34, 0.62) 7%, rgba(190, 202, 218, 0.4) 15%, rgba(241, 246, 255, 0.88) 25%, rgba(247, 249, 255, 0.98) 43%, rgba(235, 242, 255, 0.93) 70%, rgba(221, 232, 250, 0.66) 82%, rgba(48, 54, 62, 0.44) 92%, rgba(5, 5, 5, 0.8) 100%),
    radial-gradient(ellipse at 60% 24%, rgba(255, 255, 255, 0.38), transparent 31%),
    radial-gradient(ellipse at 68% 45%, rgba(36, 79, 255, 0.14), transparent 38%),
    radial-gradient(ellipse at 55% 77%, rgba(36, 79, 255, 0.09), transparent 34%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.11) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(36, 79, 255, 0.07) 0 1px, transparent 1px) 0 0 / 100% 9%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
  inset: clamp(72px, 6.4vw, 118px) 0 clamp(84px, 6.8vw, 128px);
  opacity: 0.82;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0) 0%, rgba(245, 247, 255, 0.38) 6%, rgba(245, 247, 255, 0.42) 94%, rgba(5, 5, 5, 0) 100%),
    linear-gradient(90deg, rgba(255, 122, 26, 0.62) 0 2px, transparent 2px) 4.5% 0 / 100% 100% no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.075) 0 0.56px, transparent 0.94px) 0 0 / 3px 3px,
    linear-gradient(90deg, transparent 0 32%, rgba(36, 79, 255, 0.15) 32% 32.08%, transparent 32.16% 65%, rgba(36, 79, 255, 0.11) 65% 65.08%, transparent 65.16%),
    linear-gradient(180deg, transparent 0 18%, rgba(36, 79, 255, 0.16) 18% 18.08%, transparent 18.16% 62%, rgba(36, 79, 255, 0.1) 62% 62.08%, transparent 62.16%, rgba(255, 79, 154, 0.1) 79% 79.08%, transparent 79.16%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.5), rgba(239, 244, 255, 0.2));
  box-shadow: inset 0 0 72px rgba(255, 255, 255, 0.2);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 0%, #000 13%, #000 82%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 0%, #000 13%, #000 82%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
  opacity: 0.22;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0) 0%, rgba(245, 247, 255, 0.52) 7%, rgba(245, 247, 255, 0.12) 38%, rgba(5, 5, 5, 0.04) 78%, rgba(5, 5, 5, 0) 100%) 0 24% / 100% 40% no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 52% 43% / min(74vw, 1000px) auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 77% 69% / min(38vw, 520px) auto no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.24) 30%, rgba(255, 255, 255, 0.12) 72%, rgba(255, 255, 255, 0) 100%);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 2%, #000 18%, #000 79%, transparent 96%),
    linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 2%, #000 18%, #000 79%, transparent 96%),
    linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 5.15ch;
  font-size: clamp(62px, 7.25vw, 112px);
  line-height: 0.82;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  margin-top: clamp(18px, 2.1vw, 34px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
  height: clamp(820px, 92svh, 1040px);
  margin-top: clamp(104px, 8.4vw, 146px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
  inset: clamp(32px, 3.5vw, 58px) -2% clamp(74px, 6vw, 118px) -2%;
  opacity: 0.76;
  box-shadow:
    inset 0 0 0 1px rgba(36, 79, 255, 0.12),
    inset 0 0 88px rgba(255, 255, 255, 0.24);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
  right: 3.2%;
  top: clamp(64px, 6.6vw, 96px);
  opacity: 0.74;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure{
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.36),
    0 14px 36px rgba(26, 52, 144, 0.14);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  top: 31.5%;
  width: 36%;
  aspect-ratio: 0.82;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 26%;
  z-index: 4;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 62%;
  z-index: 5;
  border-left-color: rgba(36, 79, 255, 0.32);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither::before{
  opacity: 0.56;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii::before{
  opacity: 0.12;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  left: calc(100% + clamp(42px, 5.2vw, 86px));
  top: clamp(300px, 27.5vw, 402px);
  width: clamp(440px, 45vw, 660px);
  height: clamp(275px, 29vw, 400px);
  background:
    linear-gradient(180deg, transparent 0 75%, rgba(245, 247, 255, 0.84) 75% 100%),
    linear-gradient(90deg, rgba(255, 79, 154, 0.52) 0 18%, rgba(36, 79, 255, 0.58) 18% 48%, rgba(255, 122, 26, 0.42) 48% 64%, transparent 64%) 14px calc(100% - 19px) / 132px 7px no-repeat,
    linear-gradient(90deg, transparent 0 49.9%, rgba(255, 122, 26, 0.48) 49.9% 50.1%, transparent 50.1%),
    linear-gradient(90deg, rgba(9, 54, 214, 0.42) 0 50%, rgba(246, 249, 255, 0.18) 50% 100%),
    radial-gradient(circle, rgba(36, 79, 255, 0.11) 0 0.55px, transparent 0.95px) 0 0 / 3px 3px,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 76% 42% / 50% auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 24% 52% / 68% auto no-repeat,
    linear-gradient(90deg, rgba(9, 54, 214, 0.9) 0 50%, rgba(246, 249, 255, 0.94) 50% 100%),
    linear-gradient(180deg, rgba(245, 247, 255, 0.32), rgba(222, 231, 249, 0.18));
  background-blend-mode: normal;
  filter: grayscale(0.08) contrast(1.12);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(56px, 7.8vw, 92px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    top: 32.5%;
    width: 35%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 27%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 62%;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
    inset-inline: 0;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 9.4ch;
    font-size: clamp(46px, 13vw, 72px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    top: 30%;
    width: 46%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 4%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 50%;
  }
}

/* Chapter 03 v105: scope the selected chapter and compose the process images as one scan field. */
.workShell[data-work="diffractive-flora"] .workConstellationChapter[aria-hidden="true"]{
  display: none !important;
}

.workShell[data-work="diffractive-flora"] .workConstellationChapter.is-active[aria-hidden="false"]{
  display: grid;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
  min-height: clamp(1280px, 138svh, 1680px);
  margin: clamp(-52px, -3.6vw, -28px) 0 clamp(-74px, -4.8vw, -38px);
  padding-top: clamp(136px, 10.4vw, 194px);
  padding-bottom: clamp(144px, 9.4vw, 196px);
  background:
    linear-gradient(180deg, rgba(5, 5, 5, 0.92) 0%, rgba(16, 19, 24, 0.72) 8%, rgba(174, 194, 216, 0.36) 17%, rgba(239, 246, 255, 0.88) 28%, rgba(248, 250, 255, 0.96) 53%, rgba(229, 239, 252, 0.82) 73%, rgba(142, 163, 183, 0.46) 84%, rgba(13, 15, 19, 0.72) 95%, rgba(5, 5, 5, 0.9) 100%),
    radial-gradient(ellipse at 58% 27%, rgba(255, 255, 255, 0.44), transparent 31%),
    radial-gradient(ellipse at 67% 44%, rgba(36, 79, 255, 0.13), transparent 42%),
    radial-gradient(ellipse at 46% 72%, rgba(255, 255, 255, 0.2), transparent 34%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.1) 0 1px, transparent 1px) 0 0 / 8.333% 100%,
    linear-gradient(180deg, rgba(36, 79, 255, 0.065) 0 1px, transparent 1px) 0 0 / 100% 9%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::before{
  inset: clamp(78px, 6.8vw, 126px) clamp(28px, 5vw, 96px) clamp(92px, 7vw, 138px);
  opacity: 0.86;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0) 0%, rgba(246, 249, 255, 0.42) 7%, rgba(246, 249, 255, 0.46) 92%, rgba(5, 5, 5, 0) 100%),
    linear-gradient(90deg, rgba(255, 122, 26, 0.62) 0 2px, transparent 2px) 4.25% 0 / 100% 100% no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.075) 0 0.56px, transparent 0.94px) 0 0 / 3px 3px,
    linear-gradient(90deg, transparent 0 32%, rgba(36, 79, 255, 0.15) 32% 32.08%, transparent 32.16% 65%, rgba(36, 79, 255, 0.1) 65% 65.08%, transparent 65.16%),
    linear-gradient(180deg, transparent 0 18%, rgba(36, 79, 255, 0.16) 18% 18.08%, transparent 18.16% 61%, rgba(36, 79, 255, 0.1) 61% 61.08%, transparent 61.16%, rgba(255, 79, 154, 0.1) 78% 78.08%, transparent 78.16%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.48), rgba(239, 244, 255, 0.18));
  box-shadow: inset 0 0 86px rgba(255, 255, 255, 0.16);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 0%, #000 12%, #000 80%, transparent 98%),
    linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 0%, #000 12%, #000 80%, transparent 98%),
    linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3::after{
  opacity: 0.2;
  background:
    linear-gradient(90deg, rgba(5, 5, 5, 0) 0%, rgba(245, 247, 255, 0.4) 8%, rgba(245, 247, 255, 0.08) 40%, rgba(5, 5, 5, 0.03) 78%, rgba(5, 5, 5, 0) 100%) 0 24% / 100% 38% no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 54% 42% / min(78vw, 1080px) auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 78% 67% / min(42vw, 560px) auto no-repeat;
  filter: grayscale(1) contrast(1.24) brightness(1.12);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 4%, #000 18%, #000 76%, transparent 94%),
    linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 4%, #000 18%, #000 76%, transparent 94%),
    linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro{
  grid-column: 1 / 6;
  max-width: 460px;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 5.25ch;
  font-size: clamp(62px, 7.15vw, 110px);
  line-height: 0.82;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 430px;
  margin-top: clamp(20px, 2.2vw, 36px);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
  grid-column: 5 / 13;
  height: clamp(880px, 96svh, 1120px);
  margin-top: clamp(86px, 7.2vw, 130px);
  overflow: visible;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::before{
  inset: clamp(30px, 3vw, 52px) -1% clamp(48px, 4.8vw, 86px) -4%;
  opacity: 0.84;
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.56), rgba(36, 79, 255, 0.56)) 9% 21% / 78% 1px no-repeat,
    linear-gradient(132deg, transparent 0 49.4%, rgba(36, 79, 255, 0.7) 49.5% 50%, transparent 50.1%) 67% 9% / 122px 88px no-repeat,
    linear-gradient(90deg, rgba(36, 79, 255, 0.76) 0 15%, rgba(245, 247, 255, 0.44) 15% 44%, rgba(245, 247, 255, 0.9) 44% 100%) 18% 66% / 74% 25% no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 25% 68% / 64% auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 71% 68% / 46% auto no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.105) 0 0.58px, transparent 0.95px) 0 0 / 3px 3px,
    linear-gradient(90deg, transparent 0 9%, rgba(36, 79, 255, 0.2) 9% 9.08%, transparent 9.16% 51%, rgba(36, 79, 255, 0.16) 51% 51.08%, transparent 51.16%),
    linear-gradient(180deg, transparent 0 17%, rgba(36, 79, 255, 0.16) 17% 17.08%, transparent 17.16% 78%, rgba(255, 79, 154, 0.14) 78% 78.08%, transparent 78.16%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.48), rgba(240, 244, 255, 0.18));
  background-blend-mode: normal, normal, normal, screen, multiply, normal, normal, normal, normal;
  box-shadow:
    inset 0 0 0 1px rgba(36, 79, 255, 0.16),
    inset 0 0 96px rgba(255, 255, 255, 0.22);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 0%, #000 8%, #000 90%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 0%, #000 8%, #000 90%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
  mask-composite: intersect;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia::after{
  right: 4.8%;
  top: clamp(62px, 6.4vw, 96px);
  opacity: 0.82;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  top: 25.5%;
  width: 43%;
  aspect-ratio: 0.82;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.38),
    0 18px 42px rgba(26, 52, 144, 0.12);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 11%;
  z-index: 5;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 47.5%;
  top: 24.25%;
  z-index: 6;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody{
  max-width: 43ch;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.34) 62%, transparent),
    repeating-linear-gradient(180deg, rgba(36, 79, 255, 0.038) 0 1px, transparent 1px 28px);
  box-shadow:
    inset 3px 0 0 rgba(255, 122, 26, 0.42),
    0 12px 34px rgba(16, 36, 94, 0.08);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  left: calc(100% + clamp(54px, 5.4vw, 94px));
  top: clamp(286px, 25vw, 378px);
  z-index: 0;
  width: clamp(500px, 48vw, 720px);
  height: clamp(280px, 28vw, 400px);
  border: 0;
  opacity: 0.48;
  background:
    linear-gradient(90deg, rgba(36, 79, 255, 0.24) 0 36%, rgba(245, 247, 255, 0.16) 36% 52%, rgba(245, 247, 255, 0.62) 52% 100%),
    linear-gradient(180deg, transparent 0 78%, rgba(245, 247, 255, 0.68) 78% 100%),
    linear-gradient(90deg, rgba(255, 79, 154, 0.42) 0 18%, rgba(36, 79, 255, 0.5) 18% 48%, rgba(255, 122, 26, 0.32) 48% 64%, transparent 64%) 14px calc(100% - 19px) / 136px 7px no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 23% 50% / 70% auto no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-ascii-plate.png") 76% 46% / 54% auto no-repeat,
    radial-gradient(circle, rgba(36, 79, 255, 0.1) 0 0.55px, transparent 0.95px) 0 0 / 3px 3px;
  background-blend-mode: normal, normal, normal, screen, multiply, normal;
  box-shadow: none;
  filter: grayscale(0.14) contrast(1.08) brightness(1.02);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 0%, #000 10%, #000 86%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 0%, #000 10%, #000 86%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
  mask-composite: intersect;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    grid-column: 5 / 13;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 8%;
    width: 45%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 45%;
    width: 47%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    left: calc(100% + clamp(24px, 3.4vw, 44px));
    width: clamp(380px, 46vw, 560px);
    height: clamp(250px, 29vw, 340px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3{
    min-height: 0;
    margin: -30px 0 -42px;
    padding-top: 104px;
    padding-bottom: 126px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterIntro,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterNote{
    grid-column: 1;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 9.4ch;
    font-size: clamp(46px, 13vw, 72px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterMedia{
    height: clamp(610px, 144vw, 790px);
    margin-top: 10px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 4%;
    top: 28%;
    width: 54%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 42%;
    top: 30%;
    width: 54%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    height: clamp(230px, 66vw, 340px);
    margin-top: 24px;
  }
}

/* Chapter 03 v106: technical signal path tying dither, ASCII, and residue states together. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLink{
  position: absolute;
  inset: clamp(178px, 18vw, 250px) 3% clamp(132px, 12vw, 190px) 3%;
  z-index: 8;
  pointer-events: none;
  color: rgba(29, 95, 59, 0.86);
  opacity: 0.78;
  mix-blend-mode: normal;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLink::before{
  content: "";
  position: absolute;
  left: 43%;
  top: 18%;
  width: clamp(82px, 9vw, 136px);
  height: clamp(82px, 9vw, 136px);
  border: 1px solid rgba(36, 79, 255, 0.32);
  background:
    radial-gradient(circle, rgba(255, 122, 26, 0.72) 0 5px, transparent 5.5px),
    radial-gradient(circle, rgba(36, 79, 255, 0.2) 0 20%, transparent 21%),
    linear-gradient(90deg, rgba(36, 79, 255, 0.26) 0 1px, transparent 1px) 0 0 / 25% 100%,
    linear-gradient(180deg, rgba(36, 79, 255, 0.26) 0 1px, transparent 1px) 0 0 / 100% 25%;
  transform: translate(-50%, -50%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.32);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLink::after{
  content: "scan path / 09.03";
  position: absolute;
  left: 49%;
  top: 14%;
  padding: 5px 7px;
  color: rgba(36, 79, 255, 0.88);
  background: rgba(245, 247, 255, 0.56);
  border-left: 2px solid rgba(255, 122, 26, 0.66);
  font: 800 clamp(8px, 0.62vw, 10px)/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: nowrap;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkRail{
  position: absolute;
  left: 18%;
  top: 39%;
  width: 68%;
  height: 1px;
  background: linear-gradient(90deg, rgba(255, 122, 26, 0.82), rgba(36, 79, 255, 0.82) 42%, rgba(255, 79, 154, 0.56) 72%, transparent);
  box-shadow:
    0 0 0 1px rgba(245, 247, 255, 0.3),
    0 0 12px rgba(36, 79, 255, 0.18);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkRail::before{
  content: "";
  position: absolute;
  left: 55%;
  top: 0;
  width: 1px;
  height: clamp(210px, 23vw, 310px);
  background: linear-gradient(180deg, rgba(36, 79, 255, 0.72), rgba(36, 79, 255, 0.28) 58%, transparent);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkRail::after{
  content: "";
  position: absolute;
  left: 55%;
  top: clamp(210px, 23vw, 310px);
  width: 26%;
  height: 1px;
  background: linear-gradient(90deg, rgba(36, 79, 255, 0.38), rgba(29, 95, 59, 0.34), transparent);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkNode{
  position: absolute;
  width: 9px;
  height: 9px;
  border: 1px solid rgba(245, 247, 255, 0.72);
  background: rgba(36, 79, 255, 0.78);
  box-shadow:
    0 0 0 5px rgba(36, 79, 255, 0.12),
    0 0 18px rgba(36, 79, 255, 0.24);
  transform: translate(-50%, -50%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkNode.is-source{
  left: 18%;
  top: 39%;
  background: rgba(255, 122, 26, 0.82);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkNode.is-ascii{
  left: 59%;
  top: 39%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkNode.is-residue{
  left: 73%;
  top: calc(39% + clamp(210px, 23vw, 310px));
  background: rgba(255, 79, 154, 0.72);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkLabel{
  position: absolute;
  padding: 4px 6px;
  color: rgba(18, 38, 116, 0.9);
  background: rgba(245, 247, 255, 0.72);
  border-top: 1px solid rgba(36, 79, 255, 0.24);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.24);
  font: 800 clamp(8px, 0.6vw, 10px)/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: nowrap;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkLabel.is-source{
  left: 13%;
  top: 42%;
  color: rgba(20, 70, 43, 0.9);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkLabel.is-ascii{
  left: 56%;
  top: 42%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkLabel.is-residue{
  left: 68%;
  top: calc(42% + clamp(210px, 23vw, 310px));
  color: rgba(178, 26, 96, 0.78);
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLink{
    inset: clamp(116px, 28vw, 170px) 2% clamp(80px, 18vw, 120px);
    opacity: 0.68;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLink::before,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLink::after,
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkLabel{
    display: none;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessLinkRail{
    left: 8%;
    width: 82%;
  }
}

/* Chapter 03 v110: blue photocopy flower plate for the lower process field. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopy{
  position: absolute;
  right: 3.4%;
  bottom: clamp(74px, 6.8vw, 112px);
  z-index: 4;
  width: clamp(310px, 35vw, 520px);
  height: clamp(360px, 38vw, 560px);
  overflow: hidden;
  pointer-events: none;
  border: 1px solid rgba(36, 79, 255, 0.34);
  background:
    radial-gradient(ellipse at 54% 36%, rgba(245, 247, 255, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(6, 22, 104, 0.98), rgba(22, 58, 220, 0.96) 54%, rgba(36, 79, 255, 0.86) 78%, rgba(180, 208, 255, 0.42) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.32),
    inset 0 -46px 0 rgba(245, 247, 255, 0.28),
    0 18px 54px rgba(16, 36, 94, 0.12);
  opacity: 0.9;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopy::before{
  content: "";
  position: absolute;
  inset: -10% -14%;
  background:
    var(--chapter-img-1) 50% 47% / auto 124% no-repeat;
  filter: grayscale(1) contrast(3.2) brightness(1.2);
  mix-blend-mode: screen;
  opacity: 0.95;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopy::after{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle, rgba(245, 247, 255, 0.82) 0 0.72px, transparent 1.16px) 0 0 / 3px 3px,
    repeating-linear-gradient(180deg, rgba(245, 247, 255, 0.34) 0 1px, rgba(12, 32, 116, 0.1) 1px 4px),
    linear-gradient(90deg, rgba(245, 247, 255, 0.2) 0 8px, transparent 8px) 0 0 / 100% 100% no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0 78%, rgba(245, 247, 255, 0.42) 78% 100%),
    linear-gradient(90deg, rgba(5, 18, 88, 0.46), transparent 28%, rgba(255, 79, 154, 0.08) 72%, transparent);
  box-shadow:
    inset 0 0 0 1px rgba(36, 79, 255, 0.24),
    inset 0 0 64px rgba(245, 247, 255, 0.14);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopyLabel{
  position: absolute;
  left: clamp(16px, 1.7vw, 26px);
  right: clamp(16px, 1.7vw, 26px);
  top: 49%;
  bottom: auto;
  z-index: 2;
  display: block;
  padding-top: 9px;
  color: rgba(245, 247, 255, 0.78);
  border-top: 1px solid rgba(245, 247, 255, 0.48);
  font: 900 clamp(10px, 0.82vw, 13px)/1 "Courier New", ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
  transform: translateY(-50%);
  text-shadow: 0 1px 0 rgba(6, 22, 104, 0.42);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopyLabel::before{
  content: "SCAN COPY";
  display: block;
  margin-bottom: clamp(5px, 0.6vw, 8px);
  color: rgba(245, 247, 255, 0.96);
  font: 900 clamp(32px, 3.2vw, 52px)/0.82 "Montserrat", "Didact Gothic", var(--sans);
  text-shadow:
    2px 0 0 rgba(36, 79, 255, 0.72),
    -2px 0 0 rgba(5, 18, 88, 0.42),
    0 12px 18px rgba(6, 22, 104, 0.2);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopy{
    right: 0.5%;
    bottom: clamp(54px, 5.4vw, 82px);
    width: clamp(270px, 36vw, 400px);
    height: clamp(330px, 42vw, 460px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopy{
    right: 4%;
    bottom: 7%;
    width: 46%;
    height: 34%;
    opacity: 0.64;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopyLabel::before{
    font-size: clamp(16px, 4.6vw, 24px);
  }
}

/* Chapter 03 v111: make the lower residue read as a blue photocopy flower visualization. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  content: "SCAN COPY";
  left: calc(100% + clamp(46px, 5vw, 86px));
  top: clamp(292px, 25vw, 386px);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: clamp(500px, 48vw, 720px);
  height: clamp(318px, 31vw, 440px);
  padding: clamp(24px, 2.4vw, 36px);
  color: rgba(245, 247, 255, 0.96);
  border: 1px solid rgba(36, 79, 255, 0.42);
  opacity: 0.82;
  background:
    linear-gradient(90deg, rgba(5, 18, 88, 0.28) 0 8px, transparent 8px) 0 0 / 100% 100% no-repeat,
    radial-gradient(circle, rgba(245, 247, 255, 0.72) 0 0.72px, transparent 1.14px) 0 0 / 3px 3px,
    repeating-linear-gradient(180deg, rgba(245, 247, 255, 0.2) 0 1px, rgba(6, 22, 104, 0.12) 1px 4px),
    linear-gradient(90deg, rgba(255, 79, 154, 0.42) 0 17%, rgba(36, 79, 255, 0.58) 17% 48%, rgba(255, 122, 26, 0.38) 48% 64%, transparent 64%) 18px calc(100% - 23px) / 148px 8px no-repeat,
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003%202.jpeg") 44% 50% / 108% auto no-repeat,
    linear-gradient(90deg, rgba(8, 32, 132, 0.98), rgba(36, 79, 255, 0.94) 58%, rgba(184, 209, 255, 0.5) 100%);
  background-blend-mode: normal, normal, normal, normal, screen, normal;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.28),
    inset 0 -48px 0 rgba(245, 247, 255, 0.16),
    0 22px 58px rgba(16, 36, 94, 0.14);
  filter: grayscale(0.04) contrast(1.18) brightness(1.02);
  font: 900 clamp(34px, 4.2vw, 66px)/0.82 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-shadow:
    2px 0 0 rgba(36, 79, 255, 0.62),
    -2px 0 0 rgba(5, 18, 88, 0.48),
    0 16px 22px rgba(5, 18, 88, 0.24);
  -webkit-mask-image:
    linear-gradient(180deg, transparent 0%, #000 8%, #000 84%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, transparent 0%, #000 8%, #000 84%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
  mask-composite: intersect;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    left: calc(100% + clamp(26px, 3.4vw, 46px));
    width: clamp(390px, 46vw, 560px);
    height: clamp(280px, 31vw, 370px);
    font-size: clamp(30px, 4vw, 48px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    width: 100%;
    height: clamp(250px, 70vw, 360px);
    margin-top: 24px;
    font-size: clamp(26px, 8vw, 42px);
  }
}

/* Chapter 03 v112: poster typography, cleaner blue bloom, and stronger central reduction plate. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 8.2ch;
  color: rgba(20, 55, 204, 0.98);
  font: 900 clamp(58px, 6.7vw, 108px)/0.82 "Montserrat", "Didact Gothic", var(--sans);
  letter-spacing: 0;
  text-transform: uppercase;
  text-shadow:
    2px 0 0 rgba(245, 247, 255, 0.66),
    -1px 0 0 rgba(255, 122, 26, 0.28),
    0 14px 28px rgba(16, 36, 94, 0.12);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  position: absolute;
  left: clamp(260px, 31vw, 430px);
  top: clamp(16px, 1.5vw, 28px);
  z-index: 3;
  width: clamp(320px, 34vw, 560px);
  height: clamp(220px, 24vw, 390px);
  pointer-events: none;
  background:
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-blue-cutout.png") 50% 50% / contain no-repeat;
  opacity: 0.84;
  mix-blend-mode: multiply;
  filter:
    saturate(1.18)
    contrast(1.06)
    drop-shadow(0 18px 34px rgba(36, 79, 255, 0.16));
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
  left: 13%;
  top: 27.5%;
  width: 42%;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
  left: 41.5%;
  top: 24%;
  width: 50%;
  z-index: 7;
  box-shadow:
    0 0 0 1px rgba(36, 79, 255, 0.42),
    0 22px 52px rgba(26, 52, 144, 0.16);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopyLabel,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopyLabel::before{
  display: none;
  content: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  content: "";
  justify-content: initial;
  align-items: initial;
  color: transparent;
  text-shadow: none;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: clamp(52px, 7.5vw, 88px);
    max-width: 8ch;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(210px, 28vw, 330px);
    top: clamp(12px, 1.4vw, 22px);
    width: clamp(280px, 38vw, 430px);
    height: clamp(200px, 26vw, 310px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 9%;
    width: 42%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 39%;
    width: 52%;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 8.2ch;
    font-size: clamp(44px, 12vw, 68px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 22%;
    top: 3%;
    width: 70%;
    height: 26%;
    opacity: 0.62;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-dither{
    left: 4%;
    width: 50%;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterFigure.is-process-ascii{
    left: 38%;
    width: 58%;
  }
}

/* Chapter 03 v113: solid cobalt flower cutout with transparent background. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(220px, 25vw, 380px);
  top: clamp(84px, 8.2vw, 132px);
  z-index: 9;
  width: clamp(470px, 52vw, 760px);
  height: clamp(320px, 35vw, 520px);
  background:
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-blue-solid-cutout.png") 50% 50% / contain no-repeat;
  opacity: 0.9;
  mix-blend-mode: normal;
  filter: drop-shadow(0 20px 34px rgba(16, 36, 94, 0.14));
  -webkit-mask-image: none;
  mask-image: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessCopy{
  display: none;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  content: "";
  left: calc(100% + clamp(32px, 4.3vw, 74px));
  top: clamp(286px, 25vw, 378px);
  z-index: 4;
  width: clamp(500px, 50vw, 760px);
  height: clamp(330px, 35vw, 520px);
  padding: 0;
  border: 0;
  background:
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-blue-solid-cutout.png") 50% 50% / contain no-repeat;
  box-shadow: none;
  opacity: 0.86;
  filter: drop-shadow(0 24px 42px rgba(16, 36, 94, 0.14));
  -webkit-mask-image: none;
  mask-image: none;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(170px, 22vw, 270px);
    top: clamp(82px, 9vw, 118px);
    width: clamp(400px, 54vw, 600px);
    height: clamp(280px, 38vw, 430px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    left: calc(100% + clamp(18px, 3vw, 34px));
    width: clamp(390px, 50vw, 570px);
    height: clamp(285px, 38vw, 430px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 16%;
    top: 16%;
    width: 82%;
    height: 42%;
    opacity: 0.76;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
    width: 100%;
    height: clamp(280px, 78vw, 430px);
    margin-top: 20px;
  }
}

/* Chapter 03 v114: one blue cutout as the continuous scan residue, with refined poster typography. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 6.8ch;
  color: rgba(28, 64, 221, 0.98);
  font-family: "Cinzel Decorative", "Bodoni Moda", "Playfair Display SC", var(--display);
  font-size: 96px;
  font-weight: 700;
  line-height: 0.76;
  letter-spacing: 0;
  text-transform: uppercase;
  text-shadow:
    1px 0 0 rgba(245, 248, 255, 0.8),
    -1px 0 0 rgba(255, 122, 26, 0.2),
    0 18px 34px rgba(16, 36, 94, 0.12);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 480px;
  font-family: "Bodoni Moda", "Playfair Display SC", "Libre Baskerville", var(--serif-strong);
  font-size: 25px;
  font-weight: 600;
  line-height: 1.06;
  letter-spacing: 0;
  text-transform: none;
  box-shadow:
    inset 4px 0 0 rgba(255, 122, 26, 0.92),
    inset 0 -1px 0 rgba(255, 122, 26, 0.58),
    0 20px 42px rgba(20, 55, 204, 0.12);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(310px, 34vw, 540px);
  top: clamp(56px, 5.4vw, 88px);
  z-index: 10;
  width: clamp(700px, 74vw, 1080px);
  height: clamp(720px, 78vw, 1120px);
  background:
    url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-blue-solid-cutout.png") 50% 0 / 100% auto no-repeat;
  opacity: 0.9;
  mix-blend-mode: normal;
  filter:
    saturate(1.12)
    drop-shadow(0 24px 42px rgba(16, 36, 94, 0.14));
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.72) 66%, transparent 96%);
  mask-image: linear-gradient(180deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.72) 66%, transparent 96%);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom::after{
  content: "";
  position: absolute;
  inset: 34% 0 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(0deg, rgba(239, 246, 255, 0.24) 0 1px, transparent 1px 7px),
    linear-gradient(180deg, transparent, rgba(239, 246, 255, 0.18) 44%, rgba(239, 246, 255, 0.48) 100%);
  opacity: 0.44;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterBody::after{
  display: none;
  content: none;
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: 76px;
    max-width: 6.6ch;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    max-width: 410px;
    font-size: 22px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(260px, 31vw, 390px);
    top: 72px;
    width: clamp(600px, 78vw, 840px);
    height: clamp(640px, 86vw, 900px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    font-size: 58px;
    max-width: 7.1ch;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    font-size: 20px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 22%;
    top: 18%;
    width: 112%;
    height: 86%;
    opacity: 0.74;
  }
}

/* Chapter 03 v115: stretch the single cobalt cutout through the scan field. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(320px, 34vw, 520px);
  top: clamp(54px, 5vw, 82px);
  width: clamp(620px, 60vw, 920px);
  height: clamp(880px, 92vw, 1320px);
  background-position: 54% 0;
  background-size: auto 100%;
  opacity: 0.78;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 36%, rgba(0, 0, 0, 0.76) 58%, rgba(0, 0, 0, 0.34) 78%, transparent 98%);
  mask-image: linear-gradient(180deg, #000 0%, #000 36%, rgba(0, 0, 0, 0.76) 58%, rgba(0, 0, 0, 0.34) 78%, transparent 98%);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(260px, 35vw, 390px);
    top: 68px;
    width: clamp(560px, 66vw, 760px);
    height: clamp(790px, 96vw, 1080px);
    background-position: 54% 0;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 34%;
    top: 16%;
    width: 86%;
    height: 96%;
    background-position: 54% 0;
    opacity: 0.72;
  }
}

/* Chapter 03 v117: option-F scanner lettering with Soligant/New York inspired lead. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  position: relative;
  z-index: 12;
  max-width: 7.45ch;
  color: transparent;
  font-family: "Bodoni 72 Display", "Bodoni 72", "Didot", "Big Caslon", "Bodoni Moda", var(--serif-strong);
  font-size: clamp(82px, 8.2vw, 124px);
  font-style: normal;
  font-weight: 700;
  line-height: 0.74;
  letter-spacing: 0;
  text-transform: uppercase;
  font-feature-settings: "liga" 1, "kern" 1;
  background:
    repeating-linear-gradient(
      180deg,
      rgba(26, 63, 228, 1) 0 8px,
      rgba(26, 63, 228, 0.72) 8px 9px,
      rgba(26, 63, 228, 1) 9px 15px
    );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-stroke: 0.45px rgba(8, 38, 170, 0.82);
  text-shadow:
    1px 0 0 rgba(245, 248, 255, 0.92),
    -2px 0 0 rgba(255, 122, 26, 0.16),
    9px 0 0 rgba(26, 63, 228, 0.11),
    0 22px 34px rgba(12, 30, 92, 0.13);
  transform: skewX(-4deg) scaleX(0.9);
  transform-origin: left center;
  filter: contrast(1.08) saturate(1.08);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::before,
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::after{
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  border-color: rgba(26, 63, 228, 0.34);
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::before{
  left: -3%;
  top: 9%;
  width: 112%;
  height: 78%;
  border-top: 1px solid rgba(26, 63, 228, 0.36);
  border-bottom: 1px solid rgba(26, 63, 228, 0.16);
  border-radius: 50%;
  transform: rotate(-3deg) skewX(13deg);
  opacity: 0.72;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::after{
  right: 8%;
  bottom: 9%;
  width: 34%;
  height: 48%;
  border-right: 1px solid rgba(26, 63, 228, 0.42);
  border-top: 1px solid rgba(26, 63, 228, 0.3);
  border-radius: 50%;
  transform: rotate(9deg);
  opacity: 0.62;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 520px;
  color: rgba(250, 253, 255, 0.97);
  font-family: "New York", "NewYork", "Bodoni 72", "Didot", "Bodoni Moda", "Libre Baskerville", Georgia, serif;
  font-size: clamp(24px, 2.15vw, 32px);
  font-style: italic;
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: 0;
  text-transform: none;
  background:
    linear-gradient(90deg, rgba(23, 70, 248, 0.98), rgba(31, 91, 255, 0.86)),
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 7px);
  border: 1px solid rgba(33, 84, 255, 0.72);
  box-shadow:
    inset 4px 0 0 rgba(255, 122, 26, 0.94),
    inset 0 -1px 0 rgba(255, 122, 26, 0.62),
    0 22px 48px rgba(20, 55, 204, 0.13);
  text-shadow: 0 1px 0 rgba(8, 38, 170, 0.22);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 7.2ch;
    font-size: clamp(68px, 9.2vw, 92px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    max-width: 450px;
    font-size: clamp(21px, 2.5vw, 26px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 7.35ch;
    font-size: clamp(54px, 13vw, 72px);
    transform: skewX(-3deg) scaleX(0.94);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    max-width: min(440px, 86vw);
    font-size: clamp(19px, 5.2vw, 23px);
  }
}

/* Chapter 03 v118: keep the scanner title cobalt instead of silvering out. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  color: rgba(26, 63, 228, 0.98);
  background:
    repeating-linear-gradient(
      180deg,
      rgba(26, 63, 228, 1) 0 7px,
      rgba(54, 93, 246, 0.88) 7px 8px,
      rgba(26, 63, 228, 1) 8px 14px
    );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 0.35px rgba(235, 245, 255, 0.58);
  text-shadow:
    1px 0 0 rgba(4, 33, 170, 0.52),
    -1px 0 0 rgba(245, 248, 255, 0.34),
    7px 0 0 rgba(26, 63, 228, 0.13),
    0 22px 34px rgba(12, 30, 92, 0.13);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::before{
  border-top-color: rgba(26, 63, 228, 0.28);
  border-bottom-color: rgba(26, 63, 228, 0.12);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::after{
  border-right-color: rgba(26, 63, 228, 0.34);
  border-top-color: rgba(26, 63, 228, 0.22);
}

/* Chapter 03 v119: stronger scan title, straighter lead, lower cutout entry. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  max-width: 7.65ch;
  background:
    repeating-linear-gradient(
      180deg,
      rgba(28, 70, 248, 1) 0 5px,
      rgba(74, 109, 255, 0.68) 5px 6px,
      rgba(18, 54, 220, 1) 6px 11px
    );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 0.28px rgba(235, 245, 255, 0.48);
  text-shadow:
    1px 0 0 rgba(4, 33, 170, 0.66),
    -1px 0 0 rgba(245, 248, 255, 0.3),
    10px 0 0 rgba(28, 70, 248, 0.18),
    20px 0 0 rgba(28, 70, 248, 0.1),
    -8px 0 0 rgba(255, 122, 26, 0.1),
    0 20px 34px rgba(12, 30, 92, 0.16);
  transform: skewX(-8deg) scaleX(0.86);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::before{
  content: "IMAGE\A AS\A PROCESS";
  white-space: pre;
  left: 5%;
  top: 2%;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  color: rgba(28, 70, 248, 0.22);
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  transform: translateX(18px) skewX(-16deg) scaleX(1.08);
  filter: blur(0.55px);
  opacity: 1;
  mix-blend-mode: multiply;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::after{
  left: -2%;
  right: auto;
  top: 8%;
  bottom: auto;
  width: 128%;
  height: 92%;
  border: 0;
  border-radius: 0;
  background:
    linear-gradient(90deg, transparent 0%, rgba(28, 70, 248, 0.26) 14%, transparent 31%),
    repeating-linear-gradient(180deg, transparent 0 9px, rgba(235, 245, 255, 0.24) 9px 10px, transparent 10px 18px);
  transform: skewX(-18deg);
  opacity: 0.72;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  font-family: "Inter", "Montserrat", "Didact Gothic", "Helvetica Neue", Arial, var(--sans);
  font-style: normal;
  font-weight: 760;
  font-size: clamp(20px, 1.74vw, 26px);
  line-height: 1.12;
  letter-spacing: 0;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(520px, 50vw, 760px);
  top: clamp(420px, 37vw, 570px);
  width: clamp(420px, 42vw, 660px);
  height: clamp(700px, 68vw, 980px);
  background-position: 50% 0;
  background-size: auto 100%;
  opacity: 0.66;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 28%, rgba(0, 0, 0, 0.76) 54%, rgba(0, 0, 0, 0.34) 79%, transparent 99%);
  mask-image: linear-gradient(180deg, #000 0%, #000 28%, rgba(0, 0, 0, 0.76) 54%, rgba(0, 0, 0, 0.34) 79%, transparent 99%);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    max-width: 7.5ch;
    transform: skewX(-7deg) scaleX(0.88);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    font-size: clamp(20px, 2vw, 23px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(540px, 58vw, 670px);
    top: clamp(455px, 48vw, 590px);
    width: clamp(360px, 40vw, 500px);
    height: clamp(680px, 78vw, 880px);
    opacity: 0.64;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
    transform: skewX(-5deg) scaleX(0.92);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    font-size: clamp(18px, 4.7vw, 21px);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 55%;
    top: 43%;
    width: 58%;
    height: 78%;
    opacity: 0.58;
  }
}

/* Chapter 03 v120: make the scan effect abstract again and place the cutout in the marked field. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  text-shadow:
    1px 0 0 rgba(4, 33, 170, 0.66),
    -1px 0 0 rgba(245, 248, 255, 0.3),
    12px 0 0 rgba(28, 70, 248, 0.18),
    24px 0 0 rgba(28, 70, 248, 0.09),
    -10px 0 0 rgba(255, 122, 26, 0.08),
    0 20px 34px rgba(12, 30, 92, 0.16);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::before{
  content: "";
  left: -4%;
  top: 4%;
  width: 128%;
  height: 86%;
  border: 0;
  border-radius: 0;
  background:
    linear-gradient(90deg, transparent 0%, rgba(28, 70, 248, 0.32) 12%, transparent 34%),
    linear-gradient(90deg, transparent 11%, rgba(235, 245, 255, 0.28) 16%, transparent 28%),
    repeating-linear-gradient(180deg, transparent 0 11px, rgba(28, 70, 248, 0.2) 11px 12px, transparent 12px 21px);
  transform: skewX(-20deg);
  filter: blur(0.3px);
  opacity: 0.78;
  mix-blend-mode: screen;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::after{
  opacity: 0.58;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(230px, 24vw, 380px);
  top: clamp(440px, 38vw, 590px);
  width: clamp(360px, 36vw, 560px);
  height: clamp(700px, 68vw, 980px);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(130px, 18vw, 220px);
    top: clamp(455px, 48vw, 590px);
    width: clamp(330px, 38vw, 450px);
    height: clamp(680px, 78vw, 880px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 34%;
    top: 45%;
    width: 55%;
    height: 76%;
  }
}

/* Chapter 03 v121: orange unboxed lead, lateral scan wobble, tighter lower cutout. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle{
  text-shadow:
    1px 0 0 rgba(4, 33, 170, 0.68),
    -1px 0 0 rgba(245, 248, 255, 0.28),
    12px -4px 0 rgba(28, 70, 248, 0.19),
    -10px 12px 0 rgba(28, 70, 248, 0.14),
    18px 25px 0 rgba(28, 70, 248, 0.1),
    -12px 42px 0 rgba(255, 122, 26, 0.08),
    0 20px 34px rgba(12, 30, 92, 0.16);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterTitle::before{
  background:
    linear-gradient(90deg, transparent 0%, rgba(28, 70, 248, 0.32) 11%, transparent 30%),
    linear-gradient(90deg, transparent 12%, rgba(235, 245, 255, 0.24) 16%, transparent 27%),
    repeating-linear-gradient(180deg, transparent 0 8px, rgba(28, 70, 248, 0.22) 8px 9px, transparent 9px 17px);
  transform: skewX(-24deg) translateX(8px);
  opacity: 0.82;
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
  max-width: 480px;
  color: rgba(255, 122, 26, 0.96);
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  text-shadow:
    0 1px 0 rgba(246, 241, 223, 0.24),
    5px 0 18px rgba(255, 122, 26, 0.12);
}

.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(190px, 21vw, 330px);
  top: clamp(470px, 41vw, 620px);
  width: clamp(330px, 32vw, 500px);
  height: clamp(670px, 64vw, 920px);
  opacity: 0.8;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 35%, rgba(0, 0, 0, 0.78) 58%, rgba(0, 0, 0, 0.32) 80%, transparent 99%);
  mask-image: linear-gradient(180deg, #000 0%, #000 35%, rgba(0, 0, 0, 0.78) 58%, rgba(0, 0, 0, 0.32) 80%, transparent 99%);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    max-width: 420px;
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(98px, 14vw, 170px);
    top: clamp(485px, 51vw, 625px);
    width: clamp(300px, 34vw, 410px);
    height: clamp(640px, 73vw, 830px);
    opacity: 0.78;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationChapterLead{
    max-width: min(410px, 84vw);
  }

  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 26%;
    top: 47%;
    width: 49%;
    height: 72%;
    opacity: 0.74;
  }
}

/* Chapter 03 v122: lower cutout rendered as ASCII/raster text. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  background-image: url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-10-03-0003-blue-ascii-cutout.png");
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: auto 100%;
  filter:
    saturate(1.16)
    contrast(1.08)
    drop-shadow(0 22px 36px rgba(16, 36, 94, 0.12));
}

/* Chapter 03 v123: stronger ASCII cutout presence. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  opacity: 0.92;
  filter:
    saturate(1.36)
    contrast(1.24)
    drop-shadow(0 24px 38px rgba(16, 36, 94, 0.16));
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    opacity: 0.9;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    opacity: 0.86;
  }
}

/* Chapter 03 v124: alternate ASCII flower from 2025-09-24, opacity carried by letters. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(230px, 24vw, 350px);
  top: clamp(490px, 43vw, 650px);
  width: clamp(300px, 29vw, 430px);
  height: clamp(700px, 66vw, 900px);
  opacity: 1;
  background-image: url("../../images/Projecto%204_Diffractive%20Flora/_web/2025-09-24-0005-blue-ascii-cutout.png");
  background-position: 50% 0;
  background-size: contain;
  filter:
    saturate(1.18)
    contrast(1.08)
    drop-shadow(0 18px 32px rgba(16, 36, 94, 0.12));
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 42%, rgba(0, 0, 0, 0.72) 67%, rgba(0, 0, 0, 0.28) 86%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 42%, rgba(0, 0, 0, 0.72) 67%, rgba(0, 0, 0, 0.28) 86%, transparent 100%);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(150px, 20vw, 230px);
    top: clamp(500px, 52vw, 650px);
    width: clamp(280px, 31vw, 360px);
    height: clamp(670px, 72vw, 830px);
    opacity: 1;
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 31%;
    top: 48%;
    width: 43%;
    height: 72%;
    opacity: 1;
  }
}

/* Chapter 03 v125: make the alternate ASCII flower intentional and scan-fading. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(310px, 30vw, 470px);
  top: clamp(315px, 29vw, 430px);
  width: clamp(420px, 40vw, 620px);
  height: clamp(930px, 88vw, 1240px);
  opacity: 1;
  background-position: 50% 0;
  background-size: auto 100%;
  filter:
    saturate(1.48)
    contrast(1.28)
    drop-shadow(0 24px 42px rgba(16, 36, 94, 0.16));
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 23%, rgba(0, 0, 0, 0.92) 39%, rgba(0, 0, 0, 0.58) 67%, rgba(0, 0, 0, 0.18) 88%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 23%, rgba(0, 0, 0, 0.92) 39%, rgba(0, 0, 0, 0.58) 67%, rgba(0, 0, 0, 0.18) 88%, transparent 100%);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(250px, 33vw, 360px);
    top: clamp(325px, 34vw, 430px);
    width: clamp(390px, 45vw, 520px);
    height: clamp(900px, 98vw, 1120px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 34%;
    top: 32%;
    width: 58%;
    height: 96%;
  }
}

/* Chapter 03 v126: tuck ASCII flower against the text field and lower it slightly. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(235px, 23vw, 360px);
  top: clamp(350px, 31vw, 470px);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(165px, 22vw, 250px);
    top: clamp(365px, 38vw, 480px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 24%;
    top: 35%;
  }
}

/* Chapter 03 v127: bring ASCII flower into contact with the copy field. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  left: clamp(125px, 14vw, 230px);
  top: clamp(390px, 35vw, 520px);
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: clamp(74px, 8vw, 125px);
    top: clamp(405px, 43vw, 535px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    left: 12%;
    top: 39%;
  }
}

/* Chapter 03 v128: lower the transparent ASCII flower and darken only the letter marks. */
.workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
  top: clamp(470px, 42vw, 610px);
  background-color: transparent;
  background-blend-mode: normal;
  filter:
    brightness(0.7)
    saturate(2.15)
    contrast(1.58)
    drop-shadow(0 20px 34px rgba(10, 30, 92, 0.13));
}

@media (max-width: 1080px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    top: clamp(500px, 52vw, 660px);
  }
}

@media (max-width: 900px){
  .workShell[data-work="diffractive-flora"] article#flora-concept-constellation-3 .workConstellationProcessBloom{
    top: 47%;
  }
}


/* Moving studies: editorial passages before the standalone specimen archive. */
.workShell[data-work="diffractive-flora"] .flora-motion-study{
  grid-column: 1 / -1;
  width: var(--flora-reading);
  max-width: var(--flora-reading);
  margin: clamp(32px, 6vw, 88px) auto;
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr) minmax(0, .8fr);
  gap: clamp(20px, 4vw, 64px);
  align-items: center;
  padding-top: 28px;
  border-top: 1px solid var(--flora-line);
}
.workShell[data-work="diffractive-flora"] .flora-motion-study-copy{
  grid-column: auto;
  width: auto;
  padding: 0;
  background: none;
  border: 0;
}
.workShell[data-work="diffractive-flora"] .flora-motion-study-copy .textTitle{
  font: 400 clamp(27px, 3.2vw, 46px)/1.1 "EB Garamond", var(--serif);
  text-transform: none;
  letter-spacing: -.02em;
  margin: 16px 0;
}
.workShell[data-work="diffractive-flora"] .flora-motion-study-copy .textBody{
  font: 400 18px/1.65 "EB Garamond", var(--serif);
  text-transform: none;
  letter-spacing: 0;
  color: var(--flora-muted);
}
.workShell[data-work="diffractive-flora"] .flora-motion-study-film{
  width: 100%;
  min-width: 0;
  grid-column: auto;
  border: 0;
}
.workShell[data-work="diffractive-flora"] .flora-motion-study-film video{
  display: block;
  width: 100%;
  height: auto;
  max-height: 66vh;
  aspect-ratio: 9 / 13;
  object-fit: contain;
  background: #000;
}
.workShell[data-work="diffractive-flora"] .flora-motion-study-film figcaption{
  position: static;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 12px 0 0;
  background: none;
  color: var(--flora-muted);
  font-size: 10px;
  letter-spacing: .12em;
}
.workShell[data-work="diffractive-flora"] .flora-motion-study .is-study-secondary{
  margin-top: 100px;
}
.workShell[data-work="diffractive-flora"] .flora-specimen-field{
  margin-top: clamp(64px, 10vw, 144px);
  padding-top: clamp(28px, 4vw, 56px);
  border-top: 1px solid var(--flora-line);
}
@media (max-width: 700px){
  .workShell[data-work="diffractive-flora"] .flora-motion-study{
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
  }
  .workShell[data-work="diffractive-flora"] .flora-motion-study-copy{
    grid-column: 1 / -1;
    max-width: 400px;
  }
  .workShell[data-work="diffractive-flora"] .flora-motion-study .is-study-secondary{
    margin-top: 52px;
  }
}

/* Chapter index: restrained, material-led feedback without radar or preview overlays. */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationPreviewLayer{ display: none; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-hover-concept] .workConstellationMap::after{ opacity: 0; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode:is(:hover, :focus-visible, .is-active){
  transform: translate(-50%, -50%);
  filter: none;
  color: var(--flora-paper);
  background: transparent;
  box-shadow: none;
  min-height: 44px;
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode::before, .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode::after,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationPin::before, .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationPin::after{ display: none; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationPin{
  width: 6px; height: 6px;
  background: var(--flora-paper);
  border: 0;
  transform: none;
  box-shadow: none;
  filter: none;
  transition: background 240ms ease;
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationIndex,
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationTitle{
  background: transparent;
  box-shadow: none;
  filter: none;
  transform: none;
  text-shadow: none;
  border-color: transparent;
  transition: color 240ms ease, text-shadow 350ms ease;
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationIndex{ color: var(--flora-paper); position: relative; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationTitle{ color: var(--flora-muted); }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode.is-active .workConstellationPin{ background: var(--node-accent); }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode.is-active .workConstellationTitle{ color: var(--node-accent); }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode:focus-visible{ outline: 1px solid var(--flora-paper); outline-offset: 10px; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationIndex::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -5px;
  height: 1px;
  background: var(--node-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 420ms ease;
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode:is(:hover, :focus-visible) .workConstellationIndex::after{ transform: scaleX(1); }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="1"]{ --node-accent: #8ea9de !important; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="2"]{ --node-accent: #dc7857 !important; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="3"]{ --node-accent: #849bff !important; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="4"]{ --node-accent: #b9ae8f !important; }
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="1"]:is(:hover, :focus-visible) .workConstellationIndex::after{
  animation: flora-index-scan 650ms ease-out both;
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="2"]:is(:hover, :focus-visible) .workConstellationIndex{
  text-shadow: -1.5px 0 rgba(102,199,255,.55), 1.5px 0 rgba(220,75,37,.55);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="3"]:is(:hover, :focus-visible) .workConstellationIndex{
  text-shadow: 3px 1px rgba(132,155,255,.3), 6px 2px rgba(132,155,255,.12);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="4"] .workConstellationIndex::after{
  height: 4px;
  background: none;
  border-top: 1px solid #b9ae8f;
  border-left: 1px solid #b9ae8f;
  border-right: 1px solid #b9ae8f;
}
@keyframes flora-index-scan{
  from{ transform: scaleX(.15); opacity: .3; }
  to{ transform: scaleX(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce){
  .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode, .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode *, .workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode .workConstellationIndex::after{
    animation: none !important;
    transition: none !important;
  }
}

/* A quiet instruction stays readable without requiring hover. */
.workShell[data-work="diffractive-flora"] .flora-chapter-hint{
  grid-column: 1 / -1;
  justify-self: center;
  margin: 0;
  padding: 8px 13px;
  color: var(--flora-paper);
  background: rgba(5, 5, 5, .62);
  border-bottom: 1px solid rgba(246, 241, 223, .3);
  font: 400 13px/1.4 var(--sans);
  letter-spacing: .035em;
  text-transform: none;
  pointer-events: none;
}

/* Cursor annotation echoes the index's small uppercase field labels. */
.workShell[data-work="diffractive-flora"] .flora-cursor-hint,
.workShell[data-work="diffractive-flora"] .flora-chapter-hint{
  padding: 7px 0 7px 12px;
  border: 0;
  border-left: 1px solid rgba(246, 241, 223, .6);
  background: transparent;
  color: var(--flora-paper);
  font: 500 10px/1.5 "Montserrat", var(--sans);
  letter-spacing: .13em;
  text-transform: uppercase;
  text-shadow: 0 1px 5px #050505, 0 0 12px #050505;
  pointer-events: none;
}
.workShell[data-work="diffractive-flora"] .flora-cursor-hint{
  display: none;
  position: absolute;
  z-index: 12;
  margin: 0;
  width: 190px;
  opacity: 0;
  transition: opacity 160ms ease;
}
@media (hover: hover) and (pointer: fine){
  .workShell[data-work="diffractive-flora"] .flora-cursor-hint{ display: block; }
  .workShell[data-work="diffractive-flora"] .has-cursor-hint .flora-cursor-hint{ opacity: 1; }
  .workShell[data-work="diffractive-flora"] .flora-chapter-hint{ visibility: hidden; }
  .workShell[data-work="diffractive-flora"] .workConstellationMap:has(.workConstellationNode:focus-visible) .flora-chapter-hint{ visibility: visible; }
  .workShell[data-work="diffractive-flora"] .workConstellationMap:has(.workConstellationNode:focus-visible) .flora-cursor-hint{ opacity: 0; }
}
@media (prefers-reduced-motion: reduce){
  .workShell[data-work="diffractive-flora"] .flora-cursor-hint{ transition: none; }
}

/* Each chapter borrows its own material and typographic language. */
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="1"]:is(:hover, :focus-visible) .workConstellationIndex{
  color: #bbd4ff;
  background: repeating-linear-gradient(0deg, transparent 0 5px, rgba(104,152,255,.16) 5px 6px);
  box-shadow: -7px 0 0 -6px #92b8ff, 7px 0 0 -6px #92b8ff;
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="2"]:is(:hover, :focus-visible) .workConstellationIndex{
  color: #e2dbc2;
  background: linear-gradient(115deg, rgba(57,77,85,.65) 0 48%, transparent 48% 52%, rgba(220,75,37,.2) 52%);
  text-shadow: -2px 1px rgba(102,199,255,.6), 2px -1px rgba(220,75,37,.65);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="2"]:is(:hover, :focus-visible) .workConstellationIndex::after{
  background: repeating-linear-gradient(90deg, #dc4b25 0 12px, transparent 12px 16px);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="3"]:is(:hover, :focus-visible) .workConstellationIndex{
  color: #d9e2ff;
  transform: skewX(-5deg);
  text-shadow: 4px 0 rgba(70,108,255,.6), 9px 1px rgba(70,108,255,.3), 15px 2px rgba(70,108,255,.15);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="3"]:is(:hover, :focus-visible) .workConstellationIndex::after{
  background: linear-gradient(90deg, #849bff, transparent);
  transform: scaleX(1.15);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation .workConstellationNav .workConstellationNode[data-concept="4"]:is(:hover, :focus-visible) .workConstellationIndex{
  color: #e4dcc4;
  background: rgba(185,174,143,.12);
  box-shadow: 0 -5px 0 rgba(185,174,143,.12), 0 5px 0 rgba(185,174,143,.12);
  text-shadow: none;
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-hover-concept="1"] .flora-cursor-hint{
  color: #bbd4ff; border-color: #92b8ff;
  font-family: monospace;
  background: repeating-linear-gradient(0deg, rgba(8,17,32,.85) 0 5px, rgba(104,152,255,.15) 5px 6px);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-hover-concept="2"] .flora-cursor-hint{
  color: #e2dbc2; border-color: #dc4b25;
  background: linear-gradient(115deg, rgba(57,77,85,.9), rgba(16,19,20,.9));
  text-shadow: -1px 0 #394d55, 1px 0 rgba(220,75,37,.6);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-hover-concept="3"] .flora-cursor-hint{
  color: #d9e2ff; border-color: #849bff;
  background: rgba(10,19,48,.8);
  text-shadow: 3px 0 rgba(70,108,255,.5), 6px 0 rgba(70,108,255,.2);
}
.workShell[data-work="diffractive-flora"] .flora-concept-constellation[data-hover-concept="4"] .flora-cursor-hint{
  color: #e4dcc4; border-color: #b9ae8f;
  background: rgba(32,32,23,.9);
  font-family: "EB Garamond", var(--serif);
  font-size: 13px; letter-spacing: .06em;
  text-shadow: none;
}