/* The specimen journal becomes a workbench. */
@media(min-width:1000px) { .hero__plate { width: 70%; max-width: 430px; margin-block: 48px 20px; } }
.study { margin-top: auto; border-top: 1px solid rgb(20 16 16 / .22); }
.study__note { display: flex; gap: 1.1rem; padding: 1.25rem; min-height: 105px; align-items: flex-start; background: #f1e4e0; }
.study__number { font: 2.3rem/1 var(--font-display); color: var(--cavity-mid); }
.study__title { font: 700 .95rem/1.5 var(--font-body); }
.study__description { margin: .25rem 0 0; max-width: 43ch; font: .85rem/1.6 var(--font-body); color: var(--ink-soft); }
.study .hero__figure-foot { border-top: 1px solid rgb(20 16 16 / .15); padding-block: .8rem; }
.study .hero__figure-foot > span:last-child { max-width: none; }
.study__controls { display: none; grid-template-columns: repeat(4,1fr); background: var(--paper-warm); border-bottom: 1px solid rgb(20 16 16 / .22); }
.study__controls button { font: .72rem var(--font-ui); padding: .8rem .3rem; min-height: 44px; color: var(--ink-soft); background: transparent; border: 0; border-right: 1px solid rgb(20 16 16 / .15); cursor: pointer; }
.study__controls button:last-child { border-right: 0; }
.study__controls button[aria-pressed="true"] { background: var(--cavity); color: var(--paper-warm); }
.callout button { font: inherit; text-align: inherit; color: inherit; background: transparent; border: 0; border-bottom: 1px solid rgb(20 16 16 / .25); width: 100%; padding: .25rem 0; min-height: 44px; cursor: pointer; }
.callout button::after { content: '+'; position: absolute; top: -13px; font-size: .8rem; color: var(--cavity-mid); }
.callout--l button::after { right: 0; }
.callout--r button::after { left: 0; }
.callout button[aria-pressed="true"] { color: var(--cavity-mid); border-color: var(--cavity-mid); }
.callout button[aria-pressed="true"]::after { content: '−'; }
.callout button:hover { background: #f1e4e0; }
.study-focus { position: absolute; left: var(--x); top: var(--y); width: var(--w); height: var(--h); border: 1px dashed var(--cavity-mid); border-radius: 50%; background: rgb(242 156 179 / .08); pointer-events: none; z-index: 1; }
.hero__plate[data-selected-part="0"] g[data-annotation="0"],
.hero__plate[data-selected-part="1"] g[data-annotation="1"],
.hero__plate[data-selected-part="2"] g[data-annotation="2"],
.hero__plate[data-selected-part="3"] g[data-annotation="3"] { color: var(--cavity-mid); }
.hero__plate[data-selected-part] .anatomy-lines g { opacity: .45; }
.hero__plate[data-selected-part="0"] g[data-annotation="0"],
.hero__plate[data-selected-part="1"] g[data-annotation="1"],
.hero__plate[data-selected-part="2"] g[data-annotation="2"],
.hero__plate[data-selected-part="3"] g[data-annotation="3"] { opacity: 1; }

/* All eight originals, in reading order. Open one for the full plate. */
.field-scene { position: relative; background: #fff; border: 1px solid rgb(20 16 16 / .25); margin: 4rem 0 0; }
.field-scene > img { display: block; width: 100%; height: auto; }
.field-scene figcaption { position: absolute; left: 4.5%; top: 11%; width: 47%; }
.field-scene .plate-no { font-size: .65rem; letter-spacing: .025em; }
.field-scene h3 { font: clamp(3.5rem,7.7vw,7.2rem)/.97 var(--font-display); letter-spacing: -.03em; text-transform: uppercase; margin: 1.1rem 0 1rem; }
.field-scene h3 span { color: var(--cavity-mid); }
.field-scene figcaption > p { font: .85rem/1.6 var(--font-body); margin: 0; color: var(--ink-soft); }
.field-scene__foot { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid rgb(20 16 16 / .2); padding: .8rem 1.2rem; font: .65rem/1.6 var(--font-ui); background: var(--paper-warm); color: var(--ink-faint); }
.memes { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.6rem; columns: auto; }
.meme { margin: 0; min-width: 0; }
.meme img { height: auto; aspect-ratio: 1; object-fit: contain; background: #fff; }
.meme figcaption { display: flex; flex-wrap: wrap; column-gap: .5rem; justify-content: space-between; font-size: .68rem; min-height: 54px; }
.meme figcaption span { padding-block: .5rem; }
.meme a { min-height: 44px; }
.archive-lab-link { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; border-top: 1px solid #a96b71; margin-top: 3rem; padding-top: 1.5rem; font: .8rem/1.6 var(--font-ui); }
.archive-lab-link a { color: var(--paper-warm); min-height: 44px; display: inline-flex; align-items: center; gap: 2rem; }
.archive-lab-link p { color: #edc3c8; margin: 0; }

.meme-lab { background: #d8e8e7; }
.meme-lab .eyebrow { color: #385454; }
.lab-heading { display: flex; justify-content: space-between; gap: 2rem; align-items: flex-end; margin-bottom: 2.5rem; }
.lab-heading .h-sec { font-size: clamp(3.5rem,7.5vw,7rem); margin: 0; }
.lab-heading .h-sec span { color: var(--cavity-mid); }
.lab-heading > p { font-size: .95rem; line-height: 1.7; max-width: 36ch; margin: 0 0 .4rem; }
.lab-desk { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(0,1fr); border: 1px solid var(--ink); box-shadow: 7px 7px 0 #aec8c7; }
.lab-preview { min-width: 0; background: #c4dad9; padding: 1.5rem 2rem; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid var(--ink); }
.lab-preview__top,.lab-preview__foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; font: .7rem/1.5 var(--font-ui); }
.lab-preview__top { text-transform: uppercase; letter-spacing: .04em; margin-bottom: 1.75rem; }
.lab-preview__top > span:last-child { font-size: 1.5rem; }
.lab-preview__sheet { position: relative; background: white; border: 1px solid var(--ink); rotate: -1.5deg; box-shadow: 7px 8px 0 rgb(27 66 65 / .13); }
#meme-canvas { width: 100%; height: auto; display: block; aspect-ratio: 1; background: white; }
.lab-preview__foot { margin-top: 2rem; }
.lab-preview__stamp { border: 1px solid #587575; padding: .5rem .6rem; color: #385454; text-align: center; rotate: -5deg; text-transform: uppercase; font-size: .65rem; }
.lab-form { min-width: 0; padding: 1.75rem 2rem; background: var(--paper-warm); }
.lab-form fieldset { border: 0; min-width: 0; padding: 0; margin: 0 0 1.5rem; }
.lab-form legend { font: 700 .75rem/1.5 var(--font-ui); width: 100%; padding: 0 0 .75rem; text-transform: uppercase; letter-spacing: .025em; }
.lab-form legend > span { color: var(--cavity-mid); margin-right: .65rem; }
.lab-templates__grid { display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); gap: .35rem; }
.lab-template { position: relative; display: block; cursor: pointer; }
.lab-template input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; margin: 0; }
.lab-template img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; background: white; border: 1px solid #b8aba5; padding: .25rem; min-height: 44px; }
.lab-template input:checked + img { border: 2px solid var(--cavity-mid); background: #f5dde1; padding: calc(.25rem - 1px); }
.lab-template input:focus-visible + img { outline: 2px solid var(--cavity-mid); outline-offset: 3px; }
.lab-template:hover img { border-color: var(--cavity-mid); }
.lab-condition { font: .7rem/1.5 var(--font-ui); margin: .65rem 0 0; color: var(--ink-faint); }
.lab-condition b { color: var(--cavity-mid); font-weight: 400; }
.lab-captions label,.lab-fry__label { display: flex; justify-content: space-between; gap: 1rem; font: .75rem/1.5 var(--font-ui); margin-bottom: .5rem; }
.lab-captions label span { color: var(--ink-faint); font-size: .65rem; }
.lab-captions textarea { display: block; border: 1px solid #b8aba5; border-radius: 0; width: 100%; padding: .7rem .8rem; resize: vertical; min-height: 60px; max-height: 160px; font: .95rem/1.5 var(--font-body); color: var(--ink); background: #fff; margin: 0 0 .85rem; }
.lab-captions textarea:last-child { margin-bottom: 0; }
.lab-fry__label output { color: var(--cavity-mid); }
.lab-fry input { width: 100%; min-height: 28px; accent-color: var(--cavity-mid); cursor: pointer; margin: 0; }
.lab-fry__scale { display: flex; justify-content: space-between; gap: 1rem; font: .65rem/1.5 var(--font-ui); color: var(--ink-faint); }
.lab-actions { display: flex; align-items: center; gap: 1.5rem; }
.lab-actions .btn { gap: 1.5rem; flex: 1; }
.lab-reset { font: .72rem var(--font-ui); background: transparent; border: 0; border-bottom: 1px solid var(--ink); padding: .5rem 0; min-height: 44px; white-space: nowrap; cursor: pointer; color: var(--ink-soft); }
.lab-status { font: .7rem/1.6 var(--font-ui); color: var(--ink-soft); min-height: 2.3em; margin: 1rem 0 0; }
.lab-privacy { margin: .4rem 0 0; font: .65rem/1.6 var(--font-ui); color: var(--ink-faint); }
.lab-preview-link { display: none; }
.lab-export { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; border-top: 1px solid #b8aba5; margin-top: 1rem; padding-top: .75rem; font: .75rem var(--font-ui); }
.lab-export a { min-height: 44px; display: inline-flex; align-items: center; color: var(--cavity-mid); }
.lab-export span { color: var(--ink-faint); font-size: .65rem; }
.lab-fallback { font-size: .95rem; line-height: 1.7; }
.meme-lab[aria-busy="true"] canvas { opacity: .5; }
.lightbox__remix { background: var(--brain) !important; }

@media(max-width:1150px) {
  .lab-preview,.lab-form { padding: 1.4rem; }
  .lab-templates__grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .lab-template img { max-height: 58px; }
  .lab-actions { gap: 1rem; }
  .lab-actions .btn { gap: .8rem; font-size: .75rem; }
  .memes { gap: 1.25rem; }
}
@media(max-width:999px) {
  .study__controls { display: grid; }
  .study__note { padding: 1rem; gap: .75rem; min-height: 130px; }
  .study__number { font-size: 1.7rem; }
  .study .hero__figure-foot > span:first-child { display: none; }
  .study .hero__figure-foot { justify-content: flex-end; }
  .memes { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lab-heading { display: block; }
  .lab-heading > p { margin-top: 1.5rem; max-width: none; }
}
@media(max-width:800px) {
  .lab-preview-link { display: inline-flex; align-items: center; gap: .75rem; min-height: 44px; font: .75rem var(--font-ui); margin-bottom: .5rem; color: var(--cavity-mid); }
  #meme-preview { scroll-margin-top: 110px; }
  .field-scene h3 { font-size: 6.5vw; }
  .field-scene figcaption > p { font-size: .7rem; }
  .lab-desk { grid-template-columns: 1fr; }
  .lab-preview { padding: 1.5rem 2rem; border-right: 0; border-bottom: 1px solid var(--ink); }
  .lab-preview__sheet { width: min(100%,450px); margin: auto; }
  .lab-preview__foot { margin-top: 1.5rem; }
  .lab-form { padding: 1.5rem; }
  .lab-templates__grid { grid-template-columns: repeat(8,minmax(0,1fr)); }
}
@media(max-width:640px) {
  .archive-heading .h-sec { font-size: clamp(2.85rem,13.5vw,3.7rem); }
  .field-scene { display: flex; flex-direction: column; margin-top: 2.5rem; }
  .field-scene figcaption { position: static; width: auto; padding: 1.5rem 1.5rem 0; order: -1; }
  .field-scene h3 { font-size: clamp(3.5rem,17vw,5rem); margin-top: .8rem; }
  .field-scene h3 br { display: none; }
  .field-scene figcaption > p { font-size: .85rem; }
  .field-scene > img { aspect-ratio: 1.25; height: auto; object-fit: cover; object-position: right; }
  .field-scene__foot { font-size: .6rem; }
  .field-scene__foot > span:last-child { max-width: 21ch; text-align: right; }
  .study__note { min-height: 115px; }
  .study__description { font-size: .85rem; }
  .study__hint { display: none; }
  .hero__plate { margin-bottom: 24px; }
  .memes { max-width: none; gap: 1rem .85rem; }
  .meme { padding: 5px 5px 0; box-shadow: 3px 4px 0 rgb(0 0 0 / .25); }
  .meme figcaption { font-size: .65rem; padding: .3rem .25rem; display: block; }
  .meme figcaption span { display: block; padding-block: .2rem; }
  .meme a { min-height: 40px; }
  .meme__open::after { width: 24px; height: 24px; right: 4px; top: 4px; font-size: .85rem; }
  .archive-lab-link { display: block; margin-top: 2rem; }
  .archive-lab-link a { margin-top: .75rem; }
  .lab-heading .h-sec { font-size: clamp(3.1rem,13vw,5rem); }
  .lab-heading > p { font-size: .95rem; }
  .lab-preview { padding: 1rem 1.2rem; }
  .lab-preview__top { font-size: .62rem; margin-bottom: 1rem; }
  .lab-preview__foot { font-size: .6rem; }
  .lab-preview__stamp { font-size: .55rem; }
  .lab-form { padding: 1.25rem 1rem; }
  .lab-templates__grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: .5rem; }
  .lab-template img { max-height: 68px; }
  .lab-actions { flex-wrap: wrap; }
  .lab-actions .btn { min-width: 100%; }
  .lab-reset { margin: 0 auto; }
  .lab-captions textarea { font-size: 1rem; }
  .lab-status { margin-top: .75rem; }
  .lightbox__foot .lightbox__actions { flex-wrap: wrap; }
  .lightbox__remix { flex: 1; }
  .lightbox__foot .lightbox__save { margin-left: 0; }
}
.lab-privacy,.lab-fry__scale,.lab-captions label span,.lab-preview__top,
.lab-preview__foot,.lab-preview__stamp,.field-scene__foot,.field-scene .plate-no,
.lab-export span { font-size: .7rem; }
@media print { .meme-lab,.study__controls { display: none; } }
