.work-entry {
  --file-ink: #20221d;
  --file-subtle: #455444;
  --file-rule: #aaa99e;
  --file-highlight: #d5ec57;
  color: var(--file-ink);
  scroll-margin-block-start: 1rem;
}

.work-entry > .wrap {
  border-top: 1px solid var(--file-ink);
  padding-block: clamp(2.25rem, 5vw, 5rem);
}

.work-grid {
  display: grid;
  grid-template-columns: minmax(15rem, .72fr) minmax(0, 1.28fr);
  grid-template-areas: "intro plate" "notes plate";
  grid-template-rows: auto 1fr;
  align-items: start;
  column-gap: clamp(2.5rem, 6.5vw, 7.5rem);
}

.work-intro { grid-area: intro; min-width: 0; }
.work-entry .work-kind, .work-entry .file-caption {
  font-family: var(--mono, ui-monospace, "SFMono-Regular", Menlo, monospace);
  font-size: .75rem;
  line-height: 1.45;
  font-weight: 400;
  color: var(--file-subtle);
}

.work-entry .work-kind { margin: 0 0 .8rem; }
.work-entry h2 {
  margin: 0;
  font-weight: 470;
  font-size: clamp(2.8rem, 5vw, 5rem);
  line-height: 1.02;
  letter-spacing: -.065em;
}

.work-entry .work-summary {
  max-width: 38ch;
  margin: 1.35rem 0 0;
  font-size: clamp(1.025rem, 1.35vw, 1.18rem);
  line-height: 1.52;
  letter-spacing: -.016em;
}

.work-notes { grid-area: notes; min-width: 0; padding-top: clamp(1.5rem, 3.5vw, 3.2rem); }
.work-plate { grid-area: plate; min-width: 0; margin: 0; }
.work-plate figcaption {
  border-top: 1px solid var(--file-ink);
  padding-top: .65rem;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .35rem .9rem;
  font-size: .875rem;
  line-height: 1.45;
}

.orbit-sheet { position: relative; }
.orbit-image { display: block; width: 100%; height: auto; }
.orbit-notes { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.orbit-note { display: none; }
[data-stage="workflow-brief"] .orbit-note-brief,
[data-stage="workflow-produce"] .orbit-note-draw,
[data-stage="workflow-review"] .orbit-note-review,
[data-workflow]:not([data-enhanced]):has(#workflow-brief:target) .orbit-note-brief,
[data-workflow]:not([data-enhanced]):has(#workflow-produce:target) .orbit-note-draw,
[data-workflow]:not([data-enhanced]):has(#workflow-review:target) .orbit-note-review { display: inline; }

.orbit-notes .leader, .orbit-notes .axis, .orbit-notes .proof-mark, .focus-highlight {
  fill: none;
  stroke: var(--file-ink);
  stroke-width: 1.4;
}
.orbit-notes .axis { stroke-width: 1.1; stroke-dasharray: 4 4; }
.orbit-notes .proof-mark { stroke-width: 2; }
.orbit-notes .annotation-paper, .orbit-notes .center-marker { fill: var(--file-highlight); }
.orbit-notes .center-marker { stroke: var(--file-ink); stroke-width: 1.3; }
.orbit-notes text { fill: var(--file-ink); font: 16px "DM Sans", sans-serif; }

.work-switch {
  display: flex;
  align-items: stretch;
  border-top: 1px solid var(--file-ink);
  border-bottom: 1px solid var(--file-ink);
}

.work-switch > a, .work-switch > label {
  position: relative;
  flex: 1 1 0;
  display: flex;
  min-height: 2.85rem;
  align-items: center;
  justify-content: center;
  padding: .55rem .25rem;
  color: var(--file-subtle);
  font: inherit;
  font-size: .91rem;
  line-height: 1.25;
  text-decoration: none;
  cursor: pointer;
}

.work-switch > :is(a,label) + :is(a,label) { border-inline-start: 1px solid var(--file-rule); }
.work-switch > :is(a,label):hover { color: var(--file-ink); background: #e8e8da; }
.work-switch > a[aria-selected="true"],
#surface-view:checked ~ .work-grid label[for="surface-view"],
#normal-view:checked ~ .work-grid label[for="normal-view"],
#height-view:checked ~ .work-grid label[for="height-view"] {
  background: var(--file-highlight);
  color: var(--file-ink);
  font-weight: 600;
}

.work-entry a:focus-visible, .work-panel:focus-visible,
#surface-view:focus-visible ~ .work-grid label[for="surface-view"],
#normal-view:focus-visible ~ .work-grid label[for="normal-view"],
#height-view:focus-visible ~ .work-grid label[for="height-view"] {
  outline: 2px solid var(--file-ink);
  outline-offset: 3px;
  z-index: 1;
}

.work-panel { padding-top: 1.25rem; scroll-margin-block-start: 1rem; }
.work-panel[hidden] { display: none; }
.work-panel h3 {
  margin: 0;
  color: var(--file-ink);
  font-weight: 570;
  font-size: clamp(1.2rem, 1.6vw, 1.55rem);
  line-height: 1.22;
  letter-spacing: -.035em;
}
.work-panel p {
  margin: .65rem 0 0;
  color: var(--file-subtle);
  font-size: 1rem;
  line-height: 1.56;
  max-width: 43ch;
}
.work-entry .file-download {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  min-height: 2.75rem;
  color: var(--file-ink);
  font-size: .96rem;
  font-weight: 560;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .22em;
}
.work-entry .file-download:hover { color: var(--file-subtle); }
.work-panel .file-download { margin-top: .6rem; }
.file-download span { font-size: 1.15em; }

.work-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  clip-path: inset(50%);
  padding: 0;
  margin: 0;
  border: 0;
}
.material-index { position: relative; min-width: 0; margin: 0; padding: 0; border: 0; color: inherit; }
.stone-preview {
  display: grid;
  grid-template: minmax(0, 1fr) / minmax(0, 1fr);
  place-items: center;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 640 / 406;
  background: #deded4;
}
.stone-preview img {
  display: none;
  max-width: 92%;
  width: auto;
  height: 90%;
  object-fit: contain;
}
.stone-preview :is(.normal-image,.height-image) { height: 76%; }
.map-note { display: none; }
#surface-view:checked ~ .work-grid :is(.surface-image,.surface-note),
#normal-view:checked ~ .work-grid :is(.normal-image,.normal-note),
#height-view:checked ~ .work-grid :is(.height-image,.height-note) { display: block; }
.material-download {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .1rem 1.2rem;
  margin-top: 1rem;
}

@media (max-width: 55rem) {
  .work-grid {
    grid-template-columns: 1fr;
    grid-template-areas: "intro" "plate" "notes";
    grid-template-rows: auto;
    row-gap: 1.4rem;
  }
  .work-entry .work-summary { max-width: 52ch; margin-top: .9rem; }
  .work-panel p { max-width: 56ch; }
  .work-notes { padding-top: 0; }
  .work-plate figcaption { font-size: .8rem; }
}

@media (max-width: 25rem) {
  .work-entry .file-caption { font-size: .68rem; }
  .work-switch > :is(a,label) { font-size: .86rem; }
  .material-download { gap: 0 .75rem; }
}

@media (forced-colors: active) {
  .work-switch > a[aria-selected="true"],
  #surface-view:checked ~ .work-grid label[for="surface-view"],
  #normal-view:checked ~ .work-grid label[for="normal-view"],
  #height-view:checked ~ .work-grid label[for="height-view"] { border-bottom: 3px solid Highlight; }
}