.reader-page .reader-header {
  display:flex;
  justify-content:space-between;
  min-height:84px;
  padding-block:16px;
  gap:24px
}

.reader-page .site-header.reader-header nav {
  display:flex;
  width:auto;
  max-width:100%;
  flex-wrap:wrap;
  gap:28px;
  align-items:center
}

.reader-header nav>a {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  font-size:.9375rem
}

.reader-main {
  max-width:1400px;
  padding-top:38px;
  padding-bottom:0;
  min-width:0
}

.reader-breadcrumb {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  font-size:.875rem;
  color:var(--muted);
  margin-bottom:56px
}

.reader-breadcrumb a {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  text-underline-offset:5px
}

.reader-breadcrumb a:hover {
  color:var(--ink);
  text-decoration:underline
}

.reader-position {
  margin-left:auto;
  letter-spacing:.08em;
  font-variant-numeric:tabular-nums
}

.reader-intro {
  margin-bottom:48px;
  max-width:1000px
}

.reader-intro .eyebrow {
  font-size:.875rem;
  margin-bottom:18px;
  line-height:1.6
}

.reader-intro h1 {
  font:500 clamp(2.5rem,5.3vw,5rem)/1.05 var(--display);
  letter-spacing:-.05em;
  max-width:22ch;
  overflow-wrap:anywhere;
  text-wrap:balance
}

.reader-description {
  color:var(--muted);
  font-size:1.125rem;
  line-height:1.7;
  margin-top:24px;
  max-width:55ch
}

.reader-layout {
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
  gap:64px;
  align-items:start;
  padding-bottom:64px
}

.reader-artifacts,.reader-context {
  min-width:0
}

.reader-layout.is-visual-only {
  grid-template-columns:minmax(0,1fr);
  max-width:900px;
  margin-inline:auto;
  gap:0
}

.reader-layout.is-visual-only .reader-context {
  position:static;
  grid-row:1;
  padding:0
}

.reader-layout.is-visual-only .reader-links {
  margin:0 0 12px;
  padding:0;
  border:0;
  justify-content:space-between
}

.reader-art-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-block:1px solid var(--line);
  margin-bottom:24px;
  min-height:64px;
  font-size:.875rem;
  color:var(--muted)
}

.reader-art-toolbar button {
  min-height:44px;
  padding:8px 10px;
  background:transparent;
  color:var(--accent);
  font-size:.875rem
}

.reader-art-toolbar button:hover {
  background:var(--surface)
}

.reader-sample {
  margin-bottom:32px
}

.reader-image-window {
  overflow:auto;
  max-width:100%;
  padding:20px;
  background:radial-gradient(ellipse at 50% 0%,#b697ff12,transparent 70%),var(--surface);
  border:1px solid var(--line);
  scrollbar-color:var(--accent) var(--surface)
}

.reader-image-window img {
  width:100%;
  height:auto;
  max-width:100%;
  margin-inline:auto
}

.reader-artifacts.is-enlarged .reader-image-window img {
  width:auto;
  max-width:none;
  margin-inline:0
}

.reader-sample figcaption {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 16px;
  font-size:.875rem;
  line-height:1.6;
  color:var(--muted);
  padding-top:10px
}

.reader-sample figcaption a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  color:var(--ink);
  text-decoration:underline;
  text-decoration-color:var(--line);
  text-underline-offset:5px
}

.reader-context {
  position:sticky;
  top:120px;
  padding-top:18px
}

.reader-decision {
  border-top:1px solid var(--accent);
  padding-top:26px;
  margin-bottom:30px
}

.reader-decision .eyebrow {
  font-size:.875rem;
  margin-bottom:14px
}

.reader-decision>p:last-child {
  font:500 clamp(1.5rem,2.3vw,2rem)/1.4 var(--display);
  letter-spacing:-.025em;
  overflow-wrap:anywhere
}

.reader-facts {
  margin:0
}

.reader-facts>div {
  padding-block:20px;
  border-top:1px solid var(--line)
}

.reader-facts dt {
  font-size:.875rem;
  color:var(--muted);
  margin-bottom:8px
}

.reader-facts dd {
  font-size:1rem;
  line-height:1.7;
  margin:0;
  overflow-wrap:anywhere
}

.reader-notes p,.reader-source-notes p {
  font-size:1rem;
  line-height:1.75;
  margin-bottom:20px;
  overflow-wrap:anywhere
}

.reader-notes strong {
  display:block;
  color:var(--muted);
  font-size:.875rem;
  font-weight:500;
  margin-bottom:6px
}

.reader-notes a,.reader-source-notes a {
  color:var(--accent);
  text-decoration:underline;
  text-underline-offset:5px
}

.reader-source-notes {
  border-block:1px solid var(--line);
  margin-top:12px
}

.reader-source-notes summary {
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:56px;
  cursor:pointer;
  list-style:none;
  font-size:.875rem
}

.reader-source-notes summary::-webkit-details-marker {
  display:none
}

.reader-source-notes>div {
  padding-top:16px
}

.reader-preservation {
  color:var(--muted);
  font-size:1rem;
  line-height:1.7;
  max-width:28ch
}

.reader-links {
  display:flex;
  flex-wrap:wrap;
  gap:12px 24px;
  border-top:1px solid var(--line);
  padding-top:18px;
  margin-top:30px;
  font-size:.9375rem
}

.reader-links a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  overflow-wrap:anywhere
}

.reader-related {
  border-top:1px solid var(--line);
  padding-block:48px 56px
}

.reader-related h2 {
  font:500 clamp(1.75rem,3vw,2.5rem)/1.2 var(--display);
  letter-spacing:-.035em;
  margin-top:14px;
  overflow-wrap:anywhere
}

.related-pieces {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:32px;
  margin-top:32px
}

.related-pieces>a {
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  gap:20px;
  align-items:center;
  min-width:0;
  padding-block:16px;
  border-top:1px solid var(--line)
}

.related-image {
  display:grid;
  place-items:center;
  width:88px;
  height:110px;
  background:var(--surface);
  overflow:hidden
}

.related-image img {
  width:100%;
  height:100%;
  object-fit:contain
}

.related-pieces small {
  display:block;
  font-size:.875rem;
  color:var(--muted);
  line-height:1.5;
  margin-bottom:8px
}

.related-pieces strong {
  display:block;
  font-size:1rem;
  line-height:1.45;
  font-weight:500;
  overflow-wrap:anywhere
}

.related-open {
  display:block;
  font-size:.875rem;
  color:var(--accent);
  margin-top:12px
}

.reader-end {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px 24px;
  padding-block:24px 40px;
  border-top:1px solid var(--line);
  font-size:.9375rem;
  color:var(--muted)
}

.reader-end a {
  min-height:44px;
  display:inline-flex;
  align-items:center
}

@media(max-width:1000px) {
  .reader-layout {
    gap:36px
  }
  .related-pieces {
    gap:20px
  }
  .related-pieces>a {
    grid-template-columns:64px minmax(0,1fr);
    gap:14px
  }
  .related-image {
    width:64px;
    height:90px
  }
}

@media(max-width:800px) {
  .reader-layout {
    grid-template-columns:minmax(0,1fr);
    gap:32px
  }
  .reader-context {
    position:static;
    padding-top:0
  }
  .reader-preservation {
    max-width:none
  }
  .reader-intro {
    margin-bottom:30px
  }
  .reader-breadcrumb {
    margin-bottom:30px
  }
  .reader-related {
    padding-block:36px
  }
  .related-pieces {
    grid-template-columns:minmax(0,1fr);
    gap:8px
  }
  .related-pieces>a {
    grid-template-columns:88px minmax(0,1fr);
    gap:20px
  }
  .related-image {
    width:88px;
    height:110px
  }
  .reader-page .reader-header {
    min-height:76px
  }
  .reader-main {
    padding-top:24px
  }
}

@media(max-width:600px) {
  .reader-page .reader-header {
    padding-block:14px;
    gap:12px;
    flex-wrap:nowrap
  }
  .reader-header .wordmark {
    font-size:1.125rem
  }
  .reader-header .wordmark span {
    display:none
  }
  .reader-header nav {
    gap:12px
  }
  .reader-header nav>a {
    font-size:.875rem
  }
  .reader-header nav .button {
    padding:10px 14px
  }
  .reader-intro h1 {
    font-size:clamp(2.375rem,10vw,3.25rem)
  }
  .reader-image-window {
    padding:12px
  }
  .reader-breadcrumb {
    gap:8px
  }
  .reader-position {
    font-size:.8125rem
  }
  .reader-description {
    font-size:1rem
  }
  .reader-sample figcaption {
    font-size:.875rem
  }
  .reader-related h2 {
    font-size:1.75rem
  }
}

@media(prefers-reduced-motion:reduce) {
}

/* Visual catalogue: generous previews and one uninterrupted editorial reading order. */
.archive .archive-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px 24px
}

.archive .archive-row {
  display:flex;
  position:relative;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  padding:0 0 20px;
  border:0;
  border-bottom:1px solid var(--line);
  min-width:0;
  min-height:0;
  background:none
}

.archive .archive-preview {
  display:grid;
  grid-template-rows:minmax(0,1fr);
  grid-template-columns:minmax(0,1fr);
  place-items:center;
  width:100%;
  height:250px;
  padding:18px;
  overflow:hidden;
  background:#100d16;
  border:1px solid #b697ff22;
  border-radius:var(--radius);
  margin-bottom:16px
}

.archive .archive-preview img {
  min-height:0;
  min-width:0;
  max-height:100%;
  width:100%;
  max-width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .25s
}

.archive .archive-row:hover .archive-preview img {
  transform:scale(1.025)
}

.archive .archive-number {
  position:absolute;
  right:12px;
  top:12px;
  z-index:1;
  font-size:.6875rem;
  padding:3px 7px;
  border-radius:4px;
  background:#07070ad9;
  color:var(--muted)
}

.archive .archive-name {
  display:flex;
  flex-wrap:wrap;
  gap:6px 12px;
  min-width:0;
  align-items:baseline
}

.archive .archive-name>a {
  flex:0 0 100%;
  font:500 1.1875rem/1.35 var(--display);
  letter-spacing:-.02em;
  min-height:44px;
  display:flex;
  align-items:center;
  overflow-wrap:anywhere;
  padding:0;
  margin:0;
  color:var(--ink)
}

.archive .archive-name>span {
  font-size:.75rem;
  line-height:1.5;
  color:var(--muted);
  padding:0;
  margin:0;
  border:0
}

.archive .archive-name>.archive-format {
  border-left:1px solid var(--line);
  padding-left:12px
}

.archive .archive-links {
  display:flex;
  justify-content:flex-start;
  align-items:center;
  font-size:.8125rem;
  margin-top:8px;
  gap:0
}

.archive .archive-links a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  text-decoration:underline;
  text-underline-offset:5px;
  color:var(--ink)
}

.reader-page .reader-header {
  min-height:var(--header-height);
  padding-block:10px
}

.reader-page .site-header.reader-header #main-nav {
  gap:4px;
  flex-wrap:nowrap
}

.reader-main {
  padding-top:24px;
  max-width:var(--content-max)
}

.reader-breadcrumb {
  margin-bottom:24px
}

.reader-intro {
  margin-bottom:32px
}

.reader-intro .eyebrow {
  font-size:.8125rem;
  margin-bottom:12px
}

.reader-intro h1 {
  font-size:clamp(2.125rem,4.2vw,4rem);
  line-height:1.1;
  letter-spacing:-.035em;
  max-width:26ch
}

.reader-description {
  font-size:1rem;
  margin-top:18px;
  line-height:1.65
}

.reader-image-window {
  border-radius:var(--radius)
}

.reader-context {
  font-size:.9375rem
}

.reader-facts dt,.reader-sample figcaption,.reader-art-toolbar {
  font-size:.8125rem
}

.reader-end {
  margin-top:0
}

@media(max-width:1000px) {
  .archive .archive-preview {
    height:220px
  }
  .archive .archive-list {
    gap:24px 20px
  }
}

@media(max-width:900px) {
  .reader-page .site-header.reader-header #main-nav {
    gap:0;
    flex-direction:column
  }
  .reader-page .reader-header .header-contact {
    display:none
  }
}

@media(max-width:600px) {
  .archive .archive-list {
    grid-template-columns:1fr;
    gap:24px
  }
  .archive .archive-preview {
    height:230px;
    margin-bottom:14px;
    padding:16px
  }
  .archive .archive-name>a {
    font-size:1.125rem
  }
  .archive .archive-number {
    display:block
  }
  .archive .archive-links {
    margin-top:4px
  }
  .reader-page .reader-header {
    min-height:var(--header-height)
  }
  .reader-main {
    padding-top:14px
  }
  .reader-breadcrumb {
    margin-bottom:18px;
    font-size:.75rem;
    gap:8px
  }
  .reader-position {
    font-size:.6875rem
  }
  .reader-intro .eyebrow {
    font-size:.75rem
  }
  .reader-intro {
    margin-bottom:24px
  }
  .reader-intro h1 {
    font-size:2.125rem
  }
  .reader-description {
    font-size:.9375rem;
    margin-top:14px
  }
  .reader-image-window {
    padding:12px
  }
  .reader-art-toolbar {
    min-height:52px;
    font-size:.75rem;
    margin-bottom:16px
  }
  .reader-art-toolbar button {
    font-size:.75rem
  }
  .reader-sample figcaption {
    font-size:.6875rem
  }
}

@media(prefers-reduced-motion:reduce) {
  .archive .archive-preview img {
    transform:none!important;
    transition:none!important
  }
}

.reader-layout.is-visual-only .reader-context {
  grid-row:auto;
  order:2
}

.reader-page .site-header.reader-header #main-nav {
  width:auto
}

@media(max-width:900px) {
  .reader-page .site-header.reader-header #main-nav {
    width:100%
  }
}

/* Original creative becomes the cover; source details remain honest crops. */
.archive .archive-preview{display:flex;position:relative;height:auto;aspect-ratio:4/3;padding:0;align-items:center;background:#0d0b13;border-color:#3c2c4c;border-radius:var(--radius);margin-bottom:18px}
.archive-art{display:block;position:relative;width:100%;height:100%;overflow:hidden}
.archive .archive-art img{width:100%;height:100%;max-height:none;object-fit:cover;object-position:50% 20%;display:block;position:absolute;inset:0}
.archive .archive-preview.is-cropped .archive-art{aspect-ratio:var(--preview-ratio);height:auto}
.archive .archive-preview.is-cropped img{width:var(--preview-width);height:auto;max-width:none;inset:auto;left:var(--preview-left);top:var(--preview-top);object-fit:initial;position:absolute;transform:none}
.archive .archive-preview.is-source img{object-position:top}
.archive-preview-label{position:absolute;bottom:12px;left:12px;padding:5px 8px;border:1px solid #b997f133;background:#0c0716e6;color:#d8cbe8;font-size:10px;line-height:1.5;border-radius:4px;backdrop-filter:blur(8px)}
.archive .archive-row:hover .archive-preview img{transform:none}
.archive .archive-number{top:12px;right:12px;color:#ece2f7;border:1px solid #b997f133;background:#0c0716e6;backdrop-filter:blur(8px)}
.archive .archive-name{gap:7px 10px}.archive .archive-name>span{font-size:11px;color:var(--accent)}.archive .archive-name>.archive-format{border:0;padding:0;color:var(--muted)}.archive .archive-name>a{font-size:21px;line-height:1.25;letter-spacing:-.025em;min-height:0;margin-top:6px;max-width:30ch}
.archive .archive-links{justify-content:space-between;margin-top:14px;gap:12px}.archive .archive-links button{display:flex;gap:20px;align-items:center;font:inherit;font-size:12px;min-height:44px;padding:8px 14px;background:#20152d;border:1px solid #553a6f;border-radius:6px;color:#eadcfb;cursor:pointer}.archive .archive-links button span{color:var(--accent);font-size:19px;font-weight:300}.archive .archive-links a{font-size:12px;color:var(--muted)}.archive .archive-links button:hover{border-color:var(--accent);background:#2b1c3d}.archive .archive-links button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.archive .archive-row{padding-bottom:24px}.archive .archive-list{gap:32px 24px}

.library-quick-look{width:min(1120px,calc(100vw - 48px));max-height:calc(100dvh - 48px);margin:auto;padding:0;background:#0e0a15;color:var(--ink);border:1px solid #674a84;border-radius:14px;overflow:auto;box-shadow:0 28px 120px #000b;overscroll-behavior:contain}
.library-quick-look::backdrop{background:#040208da;backdrop-filter:blur(14px)}
.library-quick-look [hidden]{display:none!important}.library-quick-look button{font:inherit;font-size:12px;min-height:44px;color:var(--ink);cursor:pointer;background:transparent;border:1px solid var(--line);border-radius:6px;padding:8px 12px}.library-quick-look button:hover{background:#21152e;border-color:var(--accent)}.library-quick-look button:disabled{opacity:.4;cursor:default}.library-quick-look :is(a,button):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.quick-look-bar{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:16px 24px;border-bottom:1px solid var(--line);background:#110b1a;position:sticky;top:0;z-index:2}.quick-look-bar p{font-size:11px;color:var(--muted);margin:0}.quick-look-bar button{display:flex;align-items:center;gap:18px}.quick-look-bar button span{font-size:21px;font-weight:300;color:var(--accent)}
.quick-look-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;padding:28px}
.quick-look-media{min-width:0;align-self:start}.quick-look-image{height:min(58dvh,560px);position:relative;overflow:auto;overscroll-behavior:contain;background:#07070a;border:1px solid #382744;border-radius:8px;scrollbar-width:thin;scrollbar-color:#61487b #100a19}
.quick-look-image img{display:block;width:100%;height:100%;object-fit:contain}.quick-look-image.is-inspecting img{height:auto;max-width:none;min-height:0;object-fit:initial}.quick-look-image p{position:absolute;inset:0;display:grid;place-items:center;background:#100918ed;margin:0;padding:28px;font-size:13px;line-height:1.7;text-align:center;color:var(--muted)}
.quick-look-image-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:14px}.quick-look-image-tools>div{display:flex;align-items:center;gap:10px}.quick-look-image-tools span{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.quick-look-image-tools button{font-size:11px;padding:8px 10px}
.quick-look-story{min-width:0;display:flex;flex-direction:column}.quick-look-story .eyebrow{font-size:11px;color:var(--accent);margin:8px 0 18px}.quick-look-story h2{font:500 clamp(25px,2.7vw,38px)/1.12 var(--display);letter-spacing:-.04em;text-wrap:balance;overflow-wrap:anywhere;margin:0 0 20px}.quick-look-story>p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.7;margin:0 0 18px}.quick-look-story .quick-look-preservation{max-width:34ch;margin-bottom:24px!important}.quick-look-story>.button{align-self:start;min-height:48px;font-size:13px}.quick-look-story>.text-link{align-self:start;margin-top:14px;font-size:12px;min-height:44px;display:flex;align-items:center}
.quick-look-piece-nav{margin-top:auto;padding-top:30px}.quick-look-piece-nav p{font-size:11px;color:var(--muted);border-top:1px solid var(--line);padding-top:20px;margin:0 0 10px}.quick-look-piece-nav>div{display:flex;gap:10px;justify-content:space-between}.quick-look-piece-nav button{font-size:11px}
@media(max-width:700px){.library-quick-look{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:12px}.quick-look-bar{padding:10px 16px}.quick-look-layout{grid-template-columns:1fr;padding:18px;gap:24px}.quick-look-image{height:42dvh;min-height:240px}.quick-look-story .eyebrow{margin:0 0 12px}.quick-look-story h2{font-size:28px}.quick-look-story>p:not(.eyebrow){font-size:13px}.quick-look-story>.button{width:100%;justify-content:space-between}.quick-look-piece-nav{padding-top:20px}.quick-look-image-tools button{padding:8px;font-size:11px}.archive .archive-name>a{font-size:22px}}
@media(prefers-reduced-motion:no-preference){.library-quick-look[open]{animation:quick-look-in .25s ease-out}.archive .archive-links button{transition:background .2s,border-color .2s}}
@keyframes quick-look-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(forced-colors:active){.library-quick-look,.quick-look-image,.archive .archive-preview,.archive .archive-links button{border-color:CanvasText}.library-quick-look::backdrop{background:Canvas}.archive-preview-label{background:Canvas;color:CanvasText;border-color:CanvasText}}
