/* Portfolio reading layer. Opt-in: the galley keeps its existing styles. */
body.editorial { color: #555; line-height: 1.75; }
.editorial #container { box-sizing: border-box; }
.editorial #header, .editorial #footer { max-width: 36rem; }
.editorial #header h1, .editorial #footer h1 { font-size: 1rem; line-height: 1.6; }
.editorial #header nav, .editorial #footer nav { font-size: .9rem; }
.editorial #header nav ul, .editorial #footer nav ul { font-size: inherit; }
.editorial #header nav a, .editorial #footer nav a { display: inline-block; padding: .35rem .1rem; }
.editorial #content p,
.editorial #content ul,
.editorial #content ol { font-size: 1rem; line-height: 1.75; }
.editorial #content h1 { font-size: clamp(1.8rem, 4vw, 2.5rem); line-height: 1.3; }
.editorial #content h2 { font-size: 1.35rem; line-height: 1.4; margin-top: 2.79rem; }
.editorial #content h3 { font-size: 1.08rem; line-height: 1.5; }
.editorial #container #content .eyebrow,
.editorial #container #content .small-note { font-size: .85rem; line-height: 1.65; }
.editorial .inline-meta, .editorial .post-meta, .editorial h6 { opacity: 1; color: #666; font-size: .85rem; line-height: 1.6; }
.editorial #footer { opacity: 1; }
.editorial a:focus-visible, .editorial button:focus-visible,
.editorial select:focus-visible, .editorial summary:focus-visible { outline: 2px solid #555; outline-offset: 5px; }
.editorial .skip-link { position: absolute; top: .5rem; left: 1rem; transform: translateY(-200%); background: #fff; z-index: 10000; padding: .6rem; }
.editorial .skip-link:focus { transform: none; }
.editorial #content { overflow-wrap: anywhere; }
.editorial #content .btn-ghost { min-height: 44px; box-sizing: border-box; font-size: .9rem; }
.editorial .project-hero .kicker, .editorial .tag, .editorial .spec .spec-label { font-size: .8rem; color: #666; }
.editorial .project-hero .tagline, .editorial .feat-list .feat .feat-text { opacity: 1; }
.editorial .contact-card a { font-size: .9rem; }
.editorial .contact-card p { color: #555; }
.editorial ul.archive.thumblist { gap: 1.5rem; }
.editorial ul.archive.thumblist li a .thumbnail { background: #f8f8f8; }
.editorial ul.archive.thumblist li a p .excerpt { display: block; white-space: normal; overflow: visible; }
.editorial ul.archive.thumblist li a p { width: 100%; }
.editorial .term pre { font-size: .85rem; line-height: 1.65; }
.editorial .spec-table table { font-size: .9rem; }
.editorial .home-intro,
.editorial .field-notes, .editorial .project-status,
.editorial .clearing-demo { max-width: 36rem; margin: 2.79rem auto; text-align: left; }
.editorial .home-intro { margin-top: 0; }
.editorial #content .home-intro h2 { font-size: clamp(1.8rem, 4vw, 2.5rem); margin: .7rem 0 1.4rem; line-height: 1.35; }
.editorial .eyebrow { letter-spacing: .04em; }
.editorial .intro-actions { display: flex; flex-wrap: wrap; gap: .8rem 1.5rem; align-items: center; }
.editorial .intro-actions a { padding: .45rem .1rem; }
.editorial .intro-actions .primary-link { font-weight: 900; background: #fe9; }
.editorial .proof-note { padding-top: 1rem; border-top: 1px solid #ddd; }
.editorial .project-links { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; }
.editorial .work-item { padding: 0 0 2.4rem; margin-bottom: 2.4rem; border-bottom: 1px solid #ddd; }
.editorial #container #content .work-meta { display: flex; align-items: baseline; gap: 1rem; margin: 0 0 .45rem; font-size: .85rem; color: #666; }
.editorial #content .work-item h3 { font-size: 1.25rem; font-style: normal; margin: 0 0 .7rem; }
.editorial #content .work-item p { margin: .7rem 0; }
.editorial #content .work-item .project-links { margin: 1rem 0 0; }
.editorial .work-figure { margin: 1.2rem 0; padding: 1rem 1.2rem; background: #f8f8f8; border: 1px solid #ddd; }
.editorial .work-figure strong { display: block; font-size: 1.1rem; }
.editorial .work-figure figcaption, .editorial .work-shot figcaption { font-size: .85rem; line-height: 1.6; color: #666; margin-top: .3rem; }
.editorial .work-shot { margin: 1.2rem 0; }
.editorial .work-shot img { aspect-ratio: 16 / 10; object-fit: cover; border: 1px solid #ddd; box-sizing: border-box; }
.editorial .field-notes dl { margin: 1rem 0; }
.editorial dt { font-weight: 900; }
.editorial dd { margin: 0; }
/* Home, below the three projects: every section sits on the project rows' grid -
   a label rail where the preview figures are, content where the project text is. */
.editorial .home-section { max-width: 48rem; margin: 0 auto; padding: 3.6rem 0; border-top: 1px solid #ddd; display: grid; grid-template-columns: 13rem minmax(0, 1fr); gap: 1.8rem; text-align: left; }
.editorial #content .home-section h2 { font-size: 1.08rem; line-height: 1.5; margin: 0; }
.editorial #content .home-section-head p { margin: .45rem 0 0; }
.editorial #content .home-section-body > :first-child { margin-top: 0; }
.editorial #content .home-section-body > :last-child { margin-bottom: 0; }
.editorial #container #content .label-rows,
.editorial #container #content .note-list { margin: 0; padding: 0; list-style: none; }
.editorial #container #content .label-rows > *,
.editorial #container #content .note-list li { margin: 0; list-style: none; padding: 1rem 0; border-bottom: 1px solid #ddd; }
.editorial #container #content .label-rows > :first-child,
.editorial #container #content .note-list li:first-child { padding-top: 0; }
.editorial .label-rows > * { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: 1rem; align-items: baseline; }
.editorial .label-rows dt, .editorial .label-rows > li > a { font-size: .9rem; font-weight: 900; justify-self: start; }
.editorial .note-list .small-note { display: block; margin-top: .3rem; }
.editorial #content .section-more { margin: 1.4rem 0 0; }
.editorial .site-index { max-width: none; margin: 0; }
.editorial .layer-list { margin-top: 1.8rem; border-top: 1px solid #555; }
.editorial #content .layer-root { display: flex; flex-wrap: wrap; gap: .1rem 1rem; align-items: baseline; margin: 0; padding: 1rem 0; border-bottom: 1px solid #ddd; }
.editorial .layer { border-bottom: 1px solid #ddd; }
.editorial .layer summary { display: flex; align-items: center; gap: 1rem; min-height: 44px; padding: .45rem 0; box-sizing: border-box; cursor: pointer; font-weight: 900; list-style: none; }
.editorial .layer summary::-webkit-details-marker { display: none; }
.editorial .layer summary::after { content: '+'; margin-left: auto; padding: 0 .3rem; font-weight: 300; }
.editorial .layer[open] summary::after { content: '\2212'; }
.editorial .layer-num { min-width: 1.6rem; font-size: .85rem; font-weight: 300; color: #666; }
.editorial #content .layer p { font-size: .9rem; margin: 0 0 .6rem; padding-left: 2.6rem; }
.editorial #content .layer p:last-child { margin-bottom: 1.4rem; }
.editorial .about-note { display: flex; gap: 1.5rem; align-items: center; }
.editorial .about-note img { width: 7rem; height: 7rem; object-fit: cover; flex: none; }
.editorial #content .about-note p { margin: 0; }
.editorial .home-section .social-links { margin: 1.8rem 0 0; max-width: none; }
.editorial .about-story { max-width: 36rem; margin: 0 auto; }
.editorial .about-story figure { margin: 2rem 0; }
.editorial .about-story figure img { max-width: 22rem; margin: auto; }
.editorial .about-story figcaption { font-size: .85rem; text-align: center; margin-top: .5rem; }
.editorial .project-status { border-left: 3px solid #555; padding: .1rem 0 .1rem 1rem; box-sizing: border-box; }
.editorial #content .project-status h2 { margin-top: .5rem; }
.editorial .field-notes { border-top: 1px solid #ccc; }
.editorial .field-notes dt { margin-top: 1.2rem; }
.editorial .field-notes dd { margin-top: .35rem; }
.editorial .clearing-demo { border: 1px solid #ccc; padding: 1.2rem; box-sizing: border-box; }
.editorial #content .clearing-demo h2 { margin-top: 0; }
.editorial .demo-controls { display: flex; gap: .6rem; flex-wrap: wrap; margin: 1rem 0; }
.editorial .demo-controls[hidden], .editorial [hidden] { display: none; }
.editorial button, .editorial select { font: inherit; color: #555; background: #fff; border: 1px solid #999; padding: .5rem .75rem; border-radius: 0; min-height: 44px; max-width: 100%; }
.editorial button { cursor: pointer; }
.editorial button:hover:not(:disabled) { background: #eee; }
.editorial button:disabled { opacity: .5; cursor: default; }
.editorial .demo-controls label { width: 100%; }
.editorial .demo-controls select { width: 100%; }
.editorial .demo-stage { border-top: 1px solid #ddd; padding-top: 1rem; }
.editorial .demo-stage ol { padding-left: 1.5rem; }
.editorial .demo-stage table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.editorial .demo-stage th, .editorial .demo-stage td { text-align: left; padding: .5rem; border-bottom: 1px solid #ddd; }
.editorial .demo-stage th:last-child, .editorial .demo-stage td:last-child { text-align: right; }
.editorial .demo-total { background: #eee; padding: .8rem; }
.editorial #content .demo-stage h3 { margin-top: 0; }
@media (max-width: 600px) {
  .editorial .home-section { grid-template-columns: 1fr; gap: 1.2rem; padding: 2.79rem 0; }
  .editorial .label-rows > * { grid-template-columns: 1fr; gap: .2rem; }
  .editorial #content .layer p { padding-left: 0; }
  .editorial .about-note { align-items: start; gap: 1rem; }
  .editorial .about-note img { width: 5rem; height: 5rem; }
  .editorial #header nav ul { gap: .25rem .8rem; }
  .editorial .clearing-demo { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(body.editorial) { scroll-behavior: auto; }
  .editorial *, .editorial *::before, .editorial *::after { animation: none !important; transition: none !important; }
}
@media print {
  .editorial .demo-controls, .editorial .skip-link { display: none; }
  .editorial .work-item, .editorial .project-status, .editorial .home-section { break-inside: avoid; }
}
