:root {
  color-scheme: light;
  --bg: #fff;
  --surface: #f7f7f5;
  --ink: #111;
  --muted: #666560;
  --border: #e2e1dd;
  --border-strong: #aaa9a3;
  --accent: #745b48;
  --inverse: #fff;
  --serif: Georgia, "Times New Roman", serif;
  --sans: Arial, "Helvetica Neue", sans-serif;
  --container: 1400px;
  --gutter: clamp(16px, 3vw, 40px);
  --grid-gap: clamp(16px, 2vw, 28px);
  --s1: 8px;
  --s2: 12px;
  --s3: 16px;
  --s4: 24px;
  --s5: 32px;
  --s6: 48px;
  --s7: 64px;
  --s8: 96px;
  --header-height: 139px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg: #111210;
    --surface: #191a17;
    --ink: #f2f1ec;
    --muted: #aaa9a2;
    --border: #30312d;
    --border-strong: #5c5d56;
    --accent: #c6aa94;
    --inverse: #111;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #111210;
  --surface: #191a17;
  --ink: #f2f1ec;
  --muted: #aaa9a2;
  --border: #30312d;
  --border-strong: #5c5d56;
  --accent: #c6aa94;
  --inverse: #111;
}

:root[data-theme="light"] { color-scheme: light; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--ink); font-family: var(--sans); line-height: 1.55; margin: 0; -webkit-font-smoothing: antialiased; }
img { display: block; height: auto; max-width: 100%; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent); }
button, input, select { font: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }

.page-width, .wide-container, .page-shell { margin-inline: auto; max-width: var(--container); width: calc(100% - (2 * var(--gutter))); }
.wide-container, .page-shell { padding: 0; }
.site-grid, .grid-12 { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, minmax(0, 1fr)); }
.span-3 { grid-column: span 3; }.span-4 { grid-column: span 4; }.span-5 { grid-column: span 5; }.span-6 { grid-column: span 6; }
.span-8 { grid-column: span 8; }.span-9 { grid-column: span 9; }.span-12 { grid-column: 1 / -1; }
.visually-hidden { border: 0; clip: rect(0,0,0,0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
.skip-link { background: var(--ink); color: var(--inverse); left: -999px; padding: var(--s2) var(--s3); position: absolute; top: var(--s1); z-index: 1000; }
.skip-link:focus { left: var(--s1); }

/* Header */
.site-header { background: var(--bg); border-bottom: 1px solid var(--ink); position: sticky; top: 0; transition: border-color .18s; z-index: 300; }
body:has(.site-header.is-compact) { --header-height: 47px; }
.masthead { align-items: center; display: grid; grid-template-columns: repeat(12, 1fr); height: 96px; }
.brand { font-family: var(--serif); font-size: clamp(28px, 3vw, 40px); grid-column: 5 / 9; justify-self: center; letter-spacing: -.055em; line-height: 1; white-space: nowrap; }
.brand i { font-size: .58em; letter-spacing: 0; }
.utility-link { align-items: center; background: none; border: 0; color: var(--ink); cursor: pointer; display: flex; font-size: 10px; gap: var(--s1); letter-spacing: .1em; padding: var(--s1) 0; text-transform: uppercase; width: max-content; }
.masthead > .utility-link:first-child { grid-column: 1 / 3; }.masthead-actions { align-items: center; display: flex; gap: var(--s3); grid-column: 9 / 13; justify-self: end; }.theme-toggle { justify-self: end; }.header-account{white-space:nowrap}.header-account svg{fill:none;stroke:currentColor;stroke-width:1.5}.header-logout{border-left:1px solid var(--border);margin:0;padding-left:var(--s3)}.header-logout .utility-link{white-space:nowrap}
.utility-link svg { height: 17px; width: 17px; }
.nav { border-top: 1px solid var(--border); height: 42px; position: relative; transition: height .18s; }
.nav-list { align-items: center; display: flex; gap: clamp(20px, 2.6vw, 38px); justify-content: center; list-style: none; margin: 0; padding: 0; }
.nav-list > li { position: relative; }
.nav-list > li > a, .nav-group__heading > a { display: block; font-size: 10px; font-weight: 600; letter-spacing: .09em; padding: 13px 0; text-transform: uppercase; }
.nav-group__heading { display: contents; }.nav-group__heading button { display: none; }
.nav-menu { background: var(--bg); border: 1px solid var(--border); display: grid; left: -12px; min-width: 190px; opacity: 0; padding: var(--s1); pointer-events: none; position: absolute; top: 40px; transform: translateY(-3px); transition: .15s; }
.nav-menu a { font-size: 12px; padding: var(--s1); }.nav-menu a:hover { background: var(--surface); }
.nav-group:hover .nav-menu, .nav-group:focus-within .nav-menu { opacity: 1; pointer-events: auto; transform: none; }
.nav-toggle { align-items: center; background: none; border: 0; color: var(--ink); cursor: pointer; display: none; font-size: 9px; gap: var(--s1); letter-spacing: .08em; min-height: 40px; padding: var(--s1); text-transform: uppercase; }
.nav-toggle__icon { display: block; height: 13px; position: relative; width: 18px; }.nav-toggle__icon::before, .nav-toggle__icon::after { background: currentColor; content: ""; height: 1px; left: 0; position: absolute; transition: transform .18s, top .18s; width: 18px; }.nav-toggle__icon::before { top: 3px; }.nav-toggle__icon::after { top: 10px; }.nav-open .nav-toggle__icon::before { top: 6px; transform: rotate(45deg); }.nav-open .nav-toggle__icon::after { top: 6px; transform: rotate(-45deg); }
.compact-tools { inset: 0; opacity: 0; pointer-events: none; position: absolute; visibility: hidden; }.compact-tools > .utility-link:first-child { left: 0; position: absolute; top: 50%; transform: translateY(-50%); }.compact-tools__actions { align-items: center; display: flex; gap: var(--s2); position: absolute; right: 0; top: 50%; transform: translateY(-50%); }.compact-tools .theme-toggle { margin: 0; }.header-boundary { height: 1px; margin-top: -1px; pointer-events: none; }.site-header .masthead { opacity: 1; overflow: hidden; transition: height .18s, opacity .12s, visibility .18s; }.site-header.is-compact .masthead { height: 0; opacity: 0; visibility: hidden; }.site-header.is-compact .nav { border-top-color: transparent; height: 46px; }.site-header.is-compact .compact-tools { opacity: 1; visibility: visible; }.site-header.is-compact .compact-tools > .utility-link:first-child, .site-header.is-compact .compact-tools__actions { pointer-events: auto; }.site-header.is-compact .nav-list { padding-inline: 92px; }

/* Type and section structure */
h1, h2, h3, p { margin-block-start: 0; }
h1, h2, h3 { font-weight: 400; }
.eyebrow, .category, .rating { color: var(--accent); font-size: 9px; font-weight: 600; letter-spacing: .14em; margin: 0 0 var(--s2); text-transform: uppercase; }
.lede { color: var(--muted); font-family: var(--serif); font-size: clamp(18px, 1.8vw, 23px); line-height: 1.45; max-width: 720px; }
.meta, .story-meta, .caption, figcaption { color: var(--muted); font-size: 10px; letter-spacing: .04em; }
.section-heading { align-items: baseline; border-top: 1px solid var(--ink); display: flex; justify-content: space-between; margin: var(--s7) 0 var(--s4); padding-top: var(--s2); }
.editorial-intro + .section-heading,
.editorial-intro + section > .section-heading:first-child,
.book-opening + .section-heading { border-top: 0; margin-top: var(--s5); padding-top: 0; }
.section-heading h2 { font-family: var(--serif); font-size: clamp(28px, 3vw, 40px); letter-spacing: -.035em; line-height: 1; margin: 0; }
.section-heading a { border-bottom: 1px solid var(--border-strong); font-size: 9px; font-weight: 600; letter-spacing: .1em; padding-bottom: 2px; text-transform: uppercase; }
.section-note { color: var(--muted); font-size: 11px; max-width: 340px; }
h1 { font-family: var(--serif); font-size: clamp(46px, 6vw, 78px); letter-spacing: -.055em; line-height: 1; margin: 0 0 var(--s3); }
.page-shell > h1, .wide-container > h1 { border-bottom: 1px solid var(--ink); padding: var(--s6) 0 var(--s4); }

/* Shared editorial introduction */
.editorial-intro { align-items: end; border-bottom: 1px solid var(--ink); display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, minmax(0, 1fr)); margin-bottom: var(--s4); padding: var(--s5) 0; }
.editorial-intro .eyebrow { grid-column: 1 / -1; }
.editorial-intro h1 { font-size: clamp(52px, 6vw, 82px); grid-column: span 7; letter-spacing: -.065em; line-height: .95; margin: 0; }
.editorial-intro h1 i { font-size: .58em; }
.editorial-intro__copy { color: var(--muted); font-size: 14px; grid-column: span 5; margin: 0; max-width: 500px; }
.editorial-intro__copy.rich-text > :first-child { margin-top: 0; }
.editorial-intro__copy.rich-text > :last-child { margin-bottom: 0; }
.editorial-intro__meta { grid-column: 1 / -1; margin: 0; }
.editorial-intro__meta .breadcrumbs { border: 0; margin: 0; padding: 0; }

/* Homepage */
.home-sticky-grid { align-items: start; display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, minmax(0, 1fr)); }
.home-sticky-feature { align-self: start; grid-column: span 5; position: sticky; top: calc(46px + var(--s3)); }
.home-sticky-feature > a { aspect-ratio: 5 / 7; background: var(--surface); color: #fff; display: block; overflow: hidden; position: relative; }
.home-sticky-feature > a::after { background: linear-gradient(to top, rgba(0,0,0,.84), rgba(0,0,0,.04) 62%); content: ""; inset: 0; position: absolute; }
.home-sticky-feature img { height: 100%; object-fit: cover; width: 100%; }
.home-sticky-feature__copy { bottom: 0; left: 0; padding: var(--s5); position: absolute; right: 0; z-index: 1; }
.home-sticky-feature__copy small { display: block; font-size: 9px; font-weight: 600; letter-spacing: .14em; margin-bottom: var(--s2); text-transform: uppercase; }
.home-sticky-feature__copy h2 { color: #fff; font-family: var(--serif); font-size: clamp(30px, 4vw, 58px); letter-spacing: -.045em; line-height: 1; margin: 0; max-width: 780px; }
.home-sticky-feature__copy > span { display: -webkit-box; font-family: var(--sans); font-size: clamp(18px, 1.55vw, 21px); line-height: 1.45; margin-top: var(--s4); max-width: 560px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.home-completed-list { display: grid; gap: var(--s5) var(--grid-gap); grid-column: span 7; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-completed-list:only-child { grid-column: 1 / -1; }
.home-completed-list__item { display: block; min-width: 0; }
.home-completed-list__media { aspect-ratio: 5 / 7; background: var(--surface); display: block; margin-bottom: var(--s2); overflow: hidden; }
.home-completed-list__media img { aspect-ratio: 5 / 7; height: 100%; object-fit: cover; transition: transform .2s; width: 100%; }
.home-completed-list__item:hover .home-completed-list__media img { transform: scale(1.015); }
.home-completed-list__item small { color: var(--accent); display: block; font-size: 8px; font-weight: 600; letter-spacing: .14em; margin-bottom: var(--s1); text-transform: uppercase; }
.home-completed-list__item h2 { font-family: var(--serif); font-size: clamp(21px, 2vw, 29px); letter-spacing: -.03em; line-height: 1.12; margin: 0 0 var(--s1); }
.home-completed-list__meta { color: var(--muted); display: block; font-size: 10px; letter-spacing: .04em; }
.home-proof { background: var(--bg); border-block: 1px solid var(--border); margin-left: calc(50% - 50vw); margin-top: var(--s6); width: 100vw; }
.home-proof__inner { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin-inline: auto; max-width: var(--container); width: calc(100% - (2 * var(--gutter))); }
.home-proof__inner > a { padding: var(--s3); position: relative; }
.home-proof__inner > a + a { border-left: 1px solid var(--border); }
.home-proof__inner > a:hover { background: var(--surface); color: var(--ink); }
.home-proof strong { font-family: var(--serif); font-size: clamp(27px, 3vw, 40px); font-weight: 400; line-height: 1; }
.home-proof p { color: var(--muted); font-size: 9px; letter-spacing: .1em; margin: var(--s1) 0 0; text-transform: uppercase; }
.home-category-grid { display: grid; gap: var(--s3); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-category { border: 1px solid var(--border); min-height: 210px; padding: var(--s4); transition: border-color .15s, transform .15s; }
.home-category:hover { border-color: var(--border-strong); color: var(--ink); transform: translateY(-2px); }
.home-category svg { height: 24px; margin-bottom: var(--s5); width: 24px; }
.home-category { display: flex; flex-direction: column; }
.home-category h3 { font-family: var(--serif); font-size: 25px; letter-spacing: -.025em; line-height: 1.1; margin: auto 0 var(--s2); }
.home-category p { color: var(--muted); font-size: 11px; margin: 0 0 var(--s3); max-width: 270px; }
.home-category > span { align-self: flex-start; border-bottom: 1px solid var(--border-strong); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }
.home-latest-grid { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(6, minmax(150px, 1fr)); overflow-x: auto; }
.home-latest-item { background: var(--surface); min-width: 0; overflow: hidden; position: relative; }
.home-latest-item::after { background: linear-gradient(to top, rgba(0,0,0,.82), rgba(0,0,0,.05) 70%); content: ""; inset: 0; opacity: 0; position: absolute; transition: opacity .18s; }
.home-latest-item__visual { aspect-ratio: 5 / 7; display: block; }
.home-latest-item img { height: 100%; object-fit: cover; width: 100%; }
.home-latest-item__copy { bottom: 0; color: #fff; left: 0; opacity: 0; padding: var(--s3); position: absolute; right: 0; transform: translateY(var(--s1)); transition: opacity .18s, transform .18s; z-index: 1; }
.home-latest-item__copy small { display: block; font-size: 8px; letter-spacing: .12em; margin-bottom: var(--s1); text-transform: uppercase; }
.home-latest-item__copy h2 { color: #fff; font-family: var(--serif); font-size: clamp(17px, 1.5vw, 23px); letter-spacing: -.025em; line-height: 1.12; margin: 0; }
.home-latest-item:hover::after, .home-latest-item:focus-visible::after, .home-latest-item:hover .home-latest-item__copy, .home-latest-item:focus-visible .home-latest-item__copy { opacity: 1; }
.home-latest-item:hover .home-latest-item__copy, .home-latest-item:focus-visible .home-latest-item__copy { transform: none; }
.home-latest-item--reference { border: 0; padding-top: 0; }
@media (hover: none) { .home-latest-item::after, .home-latest-item .home-latest-item__copy { opacity: 1; }.home-latest-item .home-latest-item__copy { transform: none; } }
.home-community-invite { background: var(--surface); border: 1px solid var(--border); display: grid; grid-template-columns: minmax(0, 5fr) minmax(300px, 4fr); margin-top: var(--s7); overflow: hidden; }
.home-community-invite--no-artwork { grid-template-columns: minmax(0, 720px); }
.home-community-invite__copy { align-content: center; display: grid; padding: clamp(var(--s4), 4vw, var(--s7)); }
.home-community-invite__copy .eyebrow { margin: 0 0 var(--s2); }
.home-community-invite__copy h2 { font-family: var(--serif); font-size: clamp(30px, 4vw, 54px); font-weight: 400; letter-spacing: -.035em; line-height: 1; margin: 0; }
.home-community-invite__copy > p:not(.eyebrow) { color: var(--muted); font-family: var(--serif); font-size: clamp(15px, 1.4vw, 19px); line-height: 1.5; margin: var(--s3) 0 0; max-width: 560px; }
.home-community-invite__actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s4); }
.home-community-invite__secondary { border-bottom: 1px solid var(--border-strong); font-size: 9px; font-weight: 600; letter-spacing: .08em; padding-block: 9px; text-transform: uppercase; }
.home-community-invite__artwork { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-height: 340px; }
.home-community-invite__artwork--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-community-invite__artwork--1 { grid-template-columns: 1fr; }
.home-community-invite__artwork a { min-width: 0; overflow: hidden; }
.home-community-invite__artwork img { height: 100%; object-fit: cover; transition: transform .25s; width: 100%; }
.home-community-invite__artwork a:hover img, .home-community-invite__artwork a:focus-visible img { transform: scale(1.025); }
.home-used-colours { display: grid; gap: var(--s3); grid-template-columns: repeat(6, minmax(0, 1fr)); }
.colour-card { color: var(--ink); display: block; min-width: 0; position: relative; }
.colour-card__swatch { aspect-ratio: 5 / 7; border: 1px solid rgba(100,100,100,.2); display: block; overflow: hidden; position: relative; }
.colour-card__swatch::after { background: linear-gradient(to top, rgba(0,0,0,.82), rgba(0,0,0,.05) 70%); content: ""; inset: 0; opacity: 0; position: absolute; transition: opacity .18s; }
.colour-card__copy { bottom: 0; color: #fff; display: block; left: 0; opacity: 0; padding: var(--s2); position: absolute; right: 0; transform: translateY(var(--s1)); transition: opacity .18s, transform .18s; z-index: 1; }
.colour-card strong, .colour-card__name, .colour-card small { display: block; }
.colour-card strong { color: #fff; font-family: var(--serif); font-size: 20px; }
.colour-card__name { color: #fff; font-family: var(--serif); font-size: 17px; line-height: 1.2; margin-top: 2px; }
.colour-card small { color: rgba(255,255,255,.82); font-size: 8px; letter-spacing: .1em; margin-top: var(--s1); text-transform: uppercase; }
.colour-card__meta { margin-bottom: 0 !important; margin-top: var(--s1); }
.colour-card { transition: transform .15s; }
.colour-card:hover { color: var(--ink); transform: translateY(-2px); }
.colour-card:focus-visible { outline-offset: 3px; }
.colour-card:hover .colour-card__swatch::after, .colour-card:focus-visible .colour-card__swatch::after, .colour-card:hover .colour-card__copy, .colour-card:focus-visible .colour-card__copy { opacity: 1; }
.colour-card:hover .colour-card__copy, .colour-card:focus-visible .colour-card__copy { transform: none; }
@media (hover: none), (max-width: 760px) {
  .colour-card__swatch { margin-bottom: var(--s2); }
  .colour-card__swatch::after { display: none; }
  .colour-card__copy { color: var(--ink); opacity: 1; padding: 0; position: static; transform: none; }
  .colour-card strong { color: var(--ink); }
  .colour-card small { color: var(--muted); }
}
.home-colour-collection { display: grid; gap: var(--s3); grid-template-columns: repeat(8, minmax(0, 1fr)); }
.home-recent-pages .completed-card { position: relative; }
.home-recent-pages .completed-card h2 a::after { content: ""; inset: 0; position: absolute; }

/* Editorial media and archives */
.portrait-media, .post-card__image, .completed-card__image, .book-opening__media { background: var(--surface); display: block; margin: 0; overflow: hidden; }
.portrait-media, .portrait-media img, .post-card__image, .post-card__image img, .completed-card__image, .completed-card__image img, .book-opening__media, .book-opening__media img { aspect-ratio: 5 / 7; width: 100%; }
.portrait-media img, .post-card__image img, .completed-card__image img, .book-opening__media img { object-fit: cover; }
.grid, .archive-grid, .post-grid, .image-feed { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(4, minmax(0, 1fr)); }
.editorial-card, .post-card, .completed-card, .panel { background: none; border: 0; padding: 0; }.editorial-card h2, .post-card h2, .completed-card h2, .panel h2 { font-family: var(--serif); font-size: 22px; letter-spacing: -.025em; line-height: 1.18; margin: var(--s2) 0 var(--s1); }
.summary, .summary p { color: var(--muted); font-family: var(--sans); font-size: 11px; line-height: 1.5; }.rating { margin-top: var(--s2); }
.reference-grid { display: grid; gap: 0 var(--grid-gap); grid-template-columns: repeat(4, 1fr); }.reference-grid .panel { border-bottom: 1px solid var(--border); padding: var(--s3) 0; }
.archive-summary { color: var(--muted); font-size: 11px; margin: 0; padding: var(--s2) 0; }

/* Article and detail layouts */
.rich-text p { font-size: 16px; line-height: 1.7; }.rich-text h2 { font-family: var(--serif); font-size: 34px; letter-spacing: -.03em; line-height: 1.15; margin: var(--s6) 0 var(--s3); }
.media-figure { margin: 0; }.media-figure img { width: 100%; }.media-figure--featured img, .completed-hero-image img, .review-featured-image img { aspect-ratio: 5 / 7; object-fit: cover; width: 100%; }.media-gallery { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(2, 1fr); }
.metadata-list { margin: 0; }.metadata-list div { border-top: 1px solid var(--border); padding: var(--s2) 0; }.metadata-list dt { font-size: 9px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }.metadata-list dd { color: var(--muted); font-size: 11px; margin: 3px 0 0; }
.book-opening { align-items: start; border-bottom: 1px solid var(--ink); display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, 1fr); padding: var(--s6) 0; }.book-opening__media { grid-column: span 4; }.book-opening__copy { grid-column: span 5; padding-top: var(--s4); }.book-opening__copy h1 { font-size: clamp(42px, 5vw, 68px); }.book-opening__meta { grid-column: span 3; margin: var(--s4) 0 0; }.book-opening__meta div { border-top: 1px solid var(--border); padding: var(--s2) 0; }.book-opening__meta dt { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }.book-opening__meta dd { color: var(--muted); font-size: 11px; margin: 2px 0 0; }
.review-rating { border-top: 1px solid var(--ink); margin: var(--s6) 0 0; padding: var(--s3) 0; }.review-rating strong { font-family: var(--serif); font-size: 52px; font-weight: 400; }.breadcrumbs { border-bottom: 1px solid var(--border); margin-bottom: var(--s4); padding-top: var(--s2); padding-bottom: var(--s2); }.breadcrumbs ol { display: flex; list-style: none; margin: 0; padding: 0; }.breadcrumbs li { color: var(--muted); font-size: 9px; }.breadcrumbs li + li::before { content: "/"; margin: 0 var(--s1); }.page-nav { border-top: 1px solid var(--ink); display: flex; justify-content: space-between; margin-top: var(--s6); padding-top: var(--s2); }

/* Completed page feature */
.completed-opening { align-items: start; border-bottom: 1px solid var(--ink); display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, minmax(0, 1fr)); padding: var(--s4) 0 var(--s6); }
.completed-opening__media { grid-column: span 6; }
.completed-opening__copy { grid-column: 8 / 13; padding-top: var(--s4); }
.completed-opening--text-only .completed-opening__copy { grid-column: 1 / span 7; }
.completed-opening__copy h1 { font-size: clamp(44px, 5vw, 68px); }
.completed-opening__context { color: var(--muted); font-size: 11px; letter-spacing: .025em; margin: 0 0 var(--s4); }
.completed-opening__context a { border-bottom: 1px solid var(--border-strong); color: var(--ink); }
.completed-opening__copy .lede { margin: 0; }
.completed-opening__meta { margin-top: var(--s5); }
.completed-opening__meta .metadata-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.completed-opening__meta .metadata-list div { min-width: 0; padding-right: var(--s2); }
.completed-body { margin-top: var(--s6); }
.completed-copy { grid-column: 2 / span 7; }
.completed-prose-section { border-top: 1px solid var(--border); padding: var(--s4) 0 var(--s5); }
.completed-prose-section:first-child { border-top: 0; padding-top: 0; }
.completed-prose-section h2 { font-family: var(--serif); font-size: clamp(27px, 2.6vw, 36px); letter-spacing: -.03em; line-height: 1.1; margin: 0 0 var(--s3); }
.completed-prose-section .rich-text p { margin: 0 0 var(--s3); }
.completed-prose-section .rich-text > :last-child { margin-bottom: 0; }
.review-body > .rich-text > :first-child { margin-top: 0; }
.review-body > .rich-text > h2:first-child { margin-top: 0; }
.review-body .rich-text p { margin: 0 0 var(--s3); }
.review-body .rich-text > :last-child { margin-bottom: 0; }
.review-scoring { border-top: 1px solid var(--border); margin-top: var(--s6); padding-top: var(--s5); }
.review-scoring > h2 { font-family: var(--serif); font-size: clamp(27px, 2.6vw, 36px); margin: 0 0 var(--s4); }
.review-scoring__grid { display: grid; gap: var(--s4); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.review-score-card { border-top: 1px solid var(--ink); padding-top: var(--s2); }
.review-score-card header { align-items: baseline; display: flex; gap: var(--s3); justify-content: space-between; }
.review-score-card h3 { font-family: var(--serif); font-size: 22px; margin: 0; }
.review-score-value { font-family: var(--serif); font-size: 32px; font-weight: 400; white-space: nowrap; }
.review-score-value span { color: var(--muted); font-size: .55em; }
.review-score-card .rich-text p { color: var(--muted); font-size: 14px; }
.completed-note-list { display: grid; gap: var(--s2); padding-left: 1.2rem; }
.completed-note-list p { display: inline; margin: 0; }

@media (max-width: 700px) {
  .review-scoring__grid { grid-template-columns: 1fr; }
}
.completed-gallery__grid { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, minmax(0, 1fr)); }
.completed-gallery__grid .media-figure { grid-column: span 4; }
.completed-gallery__grid img { aspect-ratio: 5 / 7; object-fit: cover; width: 100%; }
.completed-context-grid__intro { grid-column: span 3; }
.completed-context-grid__intro > p:last-child { color: var(--muted); font-family: var(--serif); font-size: 17px; line-height: 1.45; margin: 0; }
.completed-context-grid__book { grid-column: span 3; }
.completed-context-grid__reviews { grid-column: 8 / 13; }
.completed-context-grid__reviews a { align-items: baseline; border-bottom: 1px solid var(--border); display: flex; font-family: var(--serif); font-size: 18px; gap: var(--s3); justify-content: space-between; line-height: 1.25; padding: var(--s3) 0; }
.completed-page-nav a { font-family: var(--serif); font-size: 17px; max-width: 45%; }
.completed-page-nav a:last-child { margin-left: auto; text-align: right; }
.completed-page-nav a span { color: var(--muted); display: block; font-family: var(--sans); font-size: 8px; letter-spacing: .12em; margin-bottom: 3px; text-transform: uppercase; }

/* Marker reference */
.archive-filter-shell { container-type: inline-size; }.filter-toggle, .filter-overlay__head, .filter-overlay__footer { display: none; }.archive-filters { align-items: end; border-bottom: 1px solid var(--border); display: grid; gap: var(--s2); grid-auto-columns: minmax(125px, 1fr); grid-auto-flow: column; margin-bottom: var(--s4); padding: 0 0 var(--s2); }.archive-filters label { display: grid; font-size: 9px; font-weight: 600; gap: 4px; letter-spacing: .08em; text-transform: uppercase; }.archive-filters input, .archive-filters select { appearance: none; background: var(--bg); border: 1px solid var(--border-strong); border-radius: 2px; color: var(--ink); font-size: 11px; height: 36px; min-width: 0; padding: var(--s1); width: 100%; }.archive-filters > a { font-size: 9px; padding: 10px 0; text-transform: uppercase; white-space: nowrap; }
.filter-toggle { align-items: center; background: transparent; border: 1px solid var(--border-strong); border-radius: 2px; color: var(--ink); cursor: pointer; font-size: 9px; font-weight: 600; gap: var(--s1); letter-spacing: .09em; min-height: 38px; padding: var(--s1) var(--s3); text-transform: uppercase; }.filter-toggle svg { height: 17px; width: 17px; }
.active-filters { display: flex; flex-wrap: wrap; gap: var(--s1); }.active-filters span, .badge { border: 1px solid var(--border); border-radius: 2px; font-size: 9px; padding: 5px var(--s1); }
.grid:has(.colour-card) { display: grid; gap: var(--s2); grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid.marker-archive-grid, .grid.completed-marker-grid, .grid.marker-set-grid { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.swatch, .colour-swatch { border: 1px solid rgba(100,100,100,.3); border-radius: 50%; display: inline-block; height: 34px; vertical-align: middle; width: 34px; }.marker-reference { display: block; }.marker-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }.marker-facts div { min-width: 0; padding: var(--s2); }.marker-facts div:nth-child(n + 4) { border-top: 1px solid var(--border); }.marker-facts dt { font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }.marker-facts dd { color: var(--muted); font-size: 10px; margin: 3px 0 0; }.marker-facts dd a { border-bottom: 1px solid var(--border-strong); color: var(--ink); }.colour-comparison { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, 1fr); padding: 0; }.comparison-current { border-right: 1px solid var(--border); grid-column: span 4; padding-right: var(--s4); }.comparison-current .eyebrow { margin: 0 0 var(--s2); }.comparison-matches { align-content: start; align-items: start; display: grid; gap: var(--s2); grid-column: span 8; grid-template-columns: repeat(5, minmax(0, 1fr)); }.comparison-matches > .eyebrow { grid-column: 1 / -1; margin: 0; }.related-link-grid { display: grid; gap: 0 var(--grid-gap); grid-template-columns: repeat(3, 1fr); }.related-link-grid article { border-bottom: 1px solid var(--border); padding: var(--s3) 0; }.related-link-grid h3 { font-family: var(--serif); font-size: 20px; line-height: 1.25; margin: 0; }
.table-scroll, .swatch-table-wrap { overflow-x: auto; }table { border-collapse: collapse; width: 100%; }th, td { border-bottom: 1px solid var(--border); padding: var(--s2) var(--s1); text-align: left; vertical-align: middle; }th { font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }td { font-size: 11px; }.match-table .swatch { height: 28px; width: 28px; }.notice { background: var(--surface); border-left: 2px solid var(--ink); font-size: 11px; padding: var(--s2); }.lazy-load { text-align: center; }.button, .lazy-load .button { background: var(--ink); border: 1px solid var(--ink); border-radius: 2px; color: var(--inverse); display: inline-block; font-size: 9px; font-weight: 600; letter-spacing: .08em; padding: 10px var(--s3); text-transform: uppercase; }

/* Search and AJAX */
.search-overlay { background: var(--bg); color: var(--ink); inset: 0; overflow: hidden; position: fixed; z-index: 500; }.search-overlay[hidden] { display: none; }.search-open { overflow: hidden; }.search-overlay__inner { display: flex; flex-direction: column; height: 100dvh; }.search-overlay__head { align-items: center; border-bottom: 1px solid var(--border); display: flex; flex: 0 0 auto; height: 64px; justify-content: space-between; }.search-overlay__head p { font-size: 9px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }.search-overlay__head button { align-items: center; background: none; border: 0; color: var(--ink); cursor: pointer; display: flex; font-size: 9px; gap: var(--s1); text-transform: uppercase; }.search-overlay__head svg { height: 18px; width: 18px; }
.overlay-search-form { border-bottom: 1px solid var(--ink); display: flex; flex: 0 0 auto; margin-top: var(--s5); }.overlay-search-form input { background: transparent; border: 0; color: var(--ink); font-family: var(--serif); font-size: clamp(36px, 5vw, 64px); letter-spacing: -.04em; min-width: 0; outline: 0; padding: var(--s1) 0 var(--s3); width: 100%; }.overlay-search-form button { background: none; border: 0; color: var(--ink); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }.search-hint, .search-empty { color: var(--muted); font-size: 10px; }.search-hint { flex: 0 0 auto; }.search-hint.discovery-count { margin-top: var(--s2); padding: 0; }.overlay-results { flex: 1 1 auto; margin-top: var(--s5); min-height: 0; overflow-y: auto; padding-bottom: var(--s7); }.overlay-results.is-loading, .discovery-results.is-loading { opacity: .55; }.search-results.grid { align-items: start; display: grid; gap: var(--grid-gap); grid-template-columns: repeat(6, minmax(0, 1fr)); }.search-results.grid > * { padding-top: 27px; }.discovery-results { position: relative; }.search-result-category-start { min-width: 0; position: relative; }.search-result-group__title { border-bottom: 1px solid var(--border-strong); font-family: var(--sans); font-size: 9px; left: 0; letter-spacing: .08em; line-height: 18px; margin: 0; overflow: hidden; pointer-events: none; position: absolute; right: 0; text-overflow: ellipsis; text-transform: uppercase; top: 0; white-space: nowrap; }
.search-results article:has(> .post-card__image), .search-results article:has(> .completed-card__image) { overflow: hidden; position: relative; }.search-results article:has(> .post-card__image)::after, .search-results article:has(> .completed-card__image)::after { background: linear-gradient(to top, rgba(0,0,0,.86), rgba(0,0,0,.04) 72%); content: ""; inset: 0; opacity: 0; pointer-events: none; position: absolute; transition: opacity .18s; }.search-results .search-card__copy { bottom: 0; color: #fff; left: 0; opacity: 0; padding: var(--s2); position: absolute; right: 0; transform: translateY(var(--s1)); transition: opacity .18s, transform .18s; z-index: 1; }.search-results .search-card__copy h2 { color: #fff; font-size: clamp(15px,1.35vw,21px); margin: 0 0 var(--s1); }.search-results .search-card__copy a, .search-results .search-card__copy .meta, .search-results .search-card__copy .summary, .search-results .search-card__copy .rating { color: #fff; }.search-results article:hover::after, .search-results article:focus-within::after, .search-results article:hover .search-card__copy, .search-results article:focus-within .search-card__copy { opacity: 1; }.search-results article:hover .search-card__copy, .search-results article:focus-within .search-card__copy { transform: none; }.search-results .panel:not(:has(.post-card__image)) > p { opacity: 0; transition: opacity .18s; }.search-results .panel:not(:has(.post-card__image)):hover > p, .search-results .panel:not(:has(.post-card__image)):focus-within > p { opacity: 1; }
@media (hover: none) { .search-results article:has(> .post-card__image)::after, .search-results article:has(> .completed-card__image)::after, .search-results .search-card__copy { opacity: 1; }.search-results .search-card__copy { transform: none; }.search-results .panel:not(:has(.post-card__image)) > p { opacity: 1; } }

/* Footer */
.site-footer { border-top: 1px solid var(--ink); margin-top: var(--s8); padding-top: var(--s6); }.footer-grid { display: grid; gap: var(--grid-gap); grid-template-columns: repeat(12, 1fr); }.footer-about { grid-column: span 4; }.footer-about .brand { font-size: 28px; }.footer-about p { color: var(--muted); font-family: var(--serif); font-size: 15px; max-width: 280px; }.footer-grid > div:nth-child(2), .footer-grid > div:nth-child(3) { grid-column: span 2; }.site-footer h2 { font-family: var(--sans); font-size: 8px; letter-spacing: .12em; margin: 4px 0 var(--s3); text-transform: uppercase; }.site-footer div > a:not(.brand) { color: var(--muted); display: block; font-size: 10px; margin: var(--s1) 0; }.newsletter { grid-column: span 4; }.newsletter > label { display: block; font-family: var(--serif); font-size: 16px; margin-bottom: var(--s2); }.newsletter-fields { display: flex; }.newsletter input { background: transparent; border: 1px solid var(--border-strong); border-radius: 0; color: var(--ink); flex: 1; min-width: 0; padding: 10px; }.newsletter button { background: var(--ink); border: 1px solid var(--ink); color: var(--inverse); font-size: 9px; padding: 0 var(--s2); text-transform: uppercase; }.newsletter-honeypot { height: 1px; left: -10000px; overflow: hidden; position: absolute; top: auto; width: 1px; }.newsletter-privacy, .newsletter-status { color: var(--muted); font-size: 9px; line-height: 1.45; margin: var(--s1) 0 0; }.newsletter-status:empty { display: none; }.newsletter-status.is-success { color: var(--ink); }.newsletter-status.is-error { color: #9b2c2c; }.newsletter.is-loading { opacity: .65; }.footer-legal { border-top: 1px solid var(--border); color: var(--muted); display: flex; font-size: 8px; justify-content: space-between; margin-bottom: 0; margin-top: var(--s6); padding-block: var(--s3); text-transform: uppercase; }

.overlay-open { overflow: hidden; }

@media (max-width: 1180px) {
  .js .archive-filter-shell { margin-bottom: var(--s4); }
  .js .filter-toggle { display: inline-flex; }
  .js .filter-overlay { background: var(--bg); bottom: 0; color: var(--ink); display: none; grid-template-rows: auto minmax(0, 1fr) auto; left: 0; position: fixed; right: 0; top: var(--header-height); z-index: 280; }
  .js .filters-open .filter-overlay { display: grid; }
  .js .filter-overlay__head { align-items: center; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; padding: var(--s3) var(--gutter); }
  .js .filter-overlay__head h2 { font-family: var(--serif); font-size: 26px; line-height: 1; margin: 0; }
  .js .filter-overlay__head button { background: transparent; border: 0; color: var(--ink); cursor: pointer; font-size: 9px; letter-spacing: .09em; padding: var(--s1) 0; text-transform: uppercase; }
  .js .filter-overlay .archive-filters { align-content: start; align-items: stretch; border: 0; display: flex; flex-direction: column; gap: var(--s3); margin: 0; overscroll-behavior: contain; overflow-y: auto; padding: var(--s4) var(--gutter); }
  .js .filter-overlay .archive-filters > a { align-self: flex-start; padding: var(--s1) 0; }
  .js .filter-overlay__footer { background: var(--bg); border-top: 1px solid var(--border); display: block; padding: var(--s3) var(--gutter) max(var(--s3), env(safe-area-inset-bottom)); }
  .js .filter-overlay__footer .button { cursor: pointer; width: 100%; }
  .no-js .archive-filters { align-items: stretch; display: flex; flex-direction: column; }
}

@media (max-width: 1050px) {
  .archive-grid, .post-grid, .image-feed { grid-template-columns: repeat(3, 1fr); }
  .grid:has(.colour-card) { grid-template-columns: repeat(4, 1fr); }
  .grid.marker-archive-grid, .grid.completed-marker-grid, .grid.marker-set-grid { grid-template-columns: repeat(4, 1fr); }
  .home-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.home-used-colours { grid-template-columns: repeat(4, minmax(0, 1fr)); }.home-colour-collection { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  body { --header-height: 73px; }:root { --grid-gap: 16px; --s7: 48px; --s8: 64px; }
  .masthead { grid-template-columns: 1fr auto 1fr; height: 72px; }.masthead > .utility-link:first-child { grid-column: 1; justify-self: start; }.brand { font-size: 26px; grid-column: 2; }.masthead-actions { gap: 4px; grid-column: 3; justify-self: end; }.masthead-actions .utility-link { height: 40px; justify-content: center; min-width: 40px; }.masthead-actions .nav-toggle { gap: 4px; padding-inline: 4px; }.utility-link span { display: none; }.nav-toggle { display: inline-flex; }.nav-toggle--compact { display: none; }
  .nav { height: 0; }.nav-list { align-items: stretch; background: var(--bg); bottom: 0; flex-direction: column; gap: 0; justify-content: flex-start; left: 0; overflow-y: auto; padding: var(--s4) var(--gutter) max(var(--s4), env(safe-area-inset-bottom)); pointer-events: none; position: fixed; right: 0; top: var(--header-height); transform: translateX(100%); transition: transform .2s, visibility .2s; visibility: hidden; width: auto; z-index: 280; }.nav-open .nav-list { pointer-events: auto; transform: none; visibility: visible; }.nav-list > li > a, .nav-group__heading > a { border-bottom: 1px solid var(--border); font-family: var(--serif); font-size: clamp(22px, 6vw, 30px); font-weight: 400; letter-spacing: -.02em; padding: var(--s3) 0; text-transform: none; }.nav-group__heading { align-items: center; border-bottom: 1px solid var(--border); display: flex; }.nav-group__heading > a { border: 0; flex: 1; }.nav-group__heading button { align-items: center; background: transparent; border: 0; color: var(--ink); cursor: pointer; display: flex; font-size: 24px; height: 48px; justify-content: center; width: 48px; }.nav-group.is-open .nav-group__heading button span { transform: rotate(45deg); }.nav-menu { background: transparent; border: 0; display: none; left: auto; min-width: 0; opacity: 1; padding: 0 0 var(--s2) var(--s3); pointer-events: auto; position: static; transform: none; transition: none; }.nav-group.is-open .nav-menu { display: grid; }.nav-menu a { border-bottom: 1px solid var(--border); font-size: 12px; padding: var(--s2) 0; }
  .editorial-intro h1 { grid-column: 1 / -1; }.editorial-intro__copy { grid-column: 1 / -1; margin-top: var(--s2); }
  .home-community-invite { grid-template-columns: 1fr; }
  .home-community-invite__artwork { min-height: 0; }
  .home-community-invite__artwork a { aspect-ratio: 5 / 7; }
  .home-latest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
  .home-latest-item { background: transparent; overflow: visible; }
  .home-latest-item::after { display: none; }
  .home-latest-item__copy { color: var(--ink); display: block; margin-top: var(--s2); opacity: 1; padding: 0; position: static; transform: none; }
  .home-latest-item__copy small { color: var(--muted); }
  .home-latest-item__copy h2 { color: var(--ink); }
  .home-category { aspect-ratio: 5 / 7; min-height: 0; }
  .marker-facts, .comparison-matches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-sticky-grid { display: block; }.home-sticky-feature { position: static; }.home-completed-list { margin-top: var(--s4); }.home-proof__inner { grid-template-columns: repeat(3, 1fr); }.home-proof__inner > a + a { border-left: 0; }.home-proof__inner > a:nth-child(3n + 2), .home-proof__inner > a:nth-child(3n + 3) { border-left: 1px solid var(--border); }.home-proof__inner > a:nth-child(n + 4) { border-top: 1px solid var(--border); }.home-used-colours { grid-template-columns: repeat(3, minmax(0, 1fr)); }.home-colour-collection { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .archive-grid, .post-grid, .image-feed { grid-template-columns: repeat(2, 1fr); }.reference-grid { grid-template-columns: repeat(2, 1fr); }.grid:has(.colour-card) { grid-template-columns: repeat(3, 1fr); }
  .grid.marker-archive-grid, .grid.completed-marker-grid, .grid.marker-set-grid { grid-template-columns: repeat(3, 1fr); }
  .book-opening__media { grid-column: span 4; }.book-opening__copy { grid-column: span 8; }.book-opening__meta { grid-column: 5 / 13; }
  .completed-opening__media { grid-column: span 6; }.completed-opening__copy { grid-column: span 6; padding-top: var(--s2); }.completed-copy { grid-column: 1 / -1; }.completed-context-grid__intro { grid-column: span 4; }.completed-context-grid__book { grid-column: span 4; }.completed-context-grid__reviews { grid-column: span 4; }
  .footer-about { grid-column: span 6; }.footer-grid > div:nth-child(2), .footer-grid > div:nth-child(3) { grid-column: span 3; }.newsletter { grid-column: 1 / -1; }
  .no-js .masthead-actions .nav-toggle { display: none; }.no-js .nav { height: auto; }.no-js .nav-list { overflow: visible; padding: 0; pointer-events: auto; position: static; transform: none; visibility: visible; }.no-js .nav-group__heading button { display: none; }.no-js .nav-menu { display: grid; padding-left: var(--s3); }
}

@media (max-width: 540px) {
  .editorial-intro { display: block; }.editorial-intro__copy, .editorial-intro__meta { margin-top: var(--s3); }
  .home-sticky-feature__copy { padding: var(--s3); }.home-category { padding: var(--s3); }.home-category svg { margin-bottom: var(--s4); }.home-proof__inner { grid-template-columns: repeat(2, 1fr); }.home-proof__inner > a:nth-child(3n + 2), .home-proof__inner > a:nth-child(3n + 3) { border-left: 0; }.home-proof__inner > a:nth-child(even) { border-left: 1px solid var(--border); }.home-proof__inner > a:nth-child(n + 3) { border-top: 1px solid var(--border); }.home-colour-collection { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid:has(.colour-card) { grid-template-columns: repeat(2, 1fr); }
  .grid.marker-archive-grid, .grid.completed-marker-grid, .grid.marker-set-grid { grid-template-columns: repeat(2, 1fr); }
  .book-opening { display: block; }.book-opening__media { max-width: 320px; }.book-opening__copy, .book-opening__meta { margin-top: var(--s4); }
  .completed-opening { display: block; padding-top: var(--s2); }.completed-opening__media { max-width: 420px; }.completed-opening__copy { padding-top: var(--s4); }.completed-opening__meta .metadata-list { grid-template-columns: 1fr 1fr; }.completed-body { display: block; }.completed-gallery__grid .media-figure { grid-column: span 6; }.completed-context-grid { display: block; }.completed-context-grid__book { margin-top: var(--s4); max-width: 300px; }.completed-context-grid__reviews { margin-top: var(--s5); }
  .marker-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }.marker-facts div:nth-child(n + 3) { border-top: 1px solid var(--border); }
  .related-link-grid { grid-template-columns: 1fr 1fr; }
  .overlay-results .search-results, .search-results { grid-template-columns: repeat(2, 1fr); }.overlay-search-form input { font-size: 36px; }
  .footer-about { grid-column: 1 / -1; }.footer-grid > div:nth-child(2), .footer-grid > div:nth-child(3) { grid-column: span 6; }.footer-legal { display: block; }.footer-legal span { display: block; margin-top: 4px; }
}

@media (max-width: 360px) {
  .masthead .brand { font-size: 22px; }.masthead-actions .nav-toggle__label { display: none; }.masthead-actions .nav-toggle { justify-content: center; min-width: 40px; }
  .archive-grid, .post-grid, .image-feed, .overlay-results .search-results, .search-results { grid-template-columns: 1fr; }
  .grid:has(.colour-card) { grid-template-columns: 1fr; }
  .grid.marker-archive-grid, .grid.completed-marker-grid, .grid.marker-set-grid { grid-template-columns: 1fr; }
  .home-completed-list { grid-template-columns: 1fr; }
}

@media (max-width: 520px) { .colour-comparison { display: block; }.comparison-current { border-bottom: 1px solid var(--border); border-right: 0; margin-bottom: var(--s3); max-width: none; padding: 0 0 var(--s3); width: 100%; }.comparison-matches { grid-template-columns: repeat(2, minmax(0, 1fr)); }.related-link-grid { grid-template-columns: 1fr; } }

@media (max-width: 1050px) { .grid, .search-results.grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 540px) { .search-results.grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 360px) { .search-results.grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 360px) { .grid { grid-template-columns: 1fr; } }
.site-header.is-compact .nav-list { padding-inline: 88px; }
@media (max-width: 760px) { .site-header.is-compact .nav { height: 46px; }.site-header.is-compact .compact-tools .nav-toggle--compact { display: inline-flex; }.site-header.is-compact .compact-tools span:not(.nav-toggle__label) { display: none; }.site-header.is-compact .compact-tools__actions { gap: var(--s2); }.site-header.is-compact .compact-tools__actions .header-account, .site-header.is-compact .compact-tools__actions .header-logout { margin-left: 0; }.site-header.is-compact .nav-list { padding: var(--s4) var(--gutter) max(var(--s4), env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }

.account-shell { margin-inline: auto; max-width: 680px; padding-block: var(--s7); }.account-shell--wide { max-width: 1050px; }.account-shell > * + * { margin-top: var(--s3); }.account-heading { align-items: start; display: flex; gap: var(--s3); justify-content: space-between; }.account-form { display: grid; gap: var(--s3); margin-top: var(--s4); }.account-form label { display: grid; font-size: 10px; font-weight: 600; gap: 7px; letter-spacing: .06em; text-transform: uppercase; }.account-form input:not([type="checkbox"]), .account-form select { background: var(--surface); border: 1px solid var(--border-strong); border-radius: 0; color: var(--ink); min-height: 46px; padding: 10px 12px; width: 100%; }.account-form small { color: var(--muted); font-size: 9px; font-weight: 400; letter-spacing: 0; text-transform: none; }.account-form .account-check { align-items: start; display: flex; font-weight: 400; letter-spacing: 0; text-transform: none; }.account-check input { margin-top: 3px; }.account-notice { background: var(--surface); border-left: 3px solid var(--ink); padding: var(--s3); }.account-notice.is-error { border-color: #9b2c2c; }.account-notice ul { margin: 0; padding-left: var(--s3); }.account-actions { display: grid; gap: var(--grid-gap); grid-template-columns: 1fr 1fr; margin-block: var(--s5); }.account-actions > div { border: 1px solid var(--border); padding: var(--s3); }.account-private { border-top: 1px solid var(--border); margin-top: var(--s5); }.account-private div { border-bottom: 1px solid var(--border); display: grid; gap: var(--s2); grid-template-columns: 1fr 2fr; padding-block: var(--s2); }.account-private dt { color: var(--muted); }.account-private dd { margin: 0; }.account-danger { border-top: 1px solid #9b2c2c; margin-top: var(--s6); padding-top: var(--s4); }.account-status { font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }.account-status.is-approved { color: #287443; }.account-status.is-rejected { color: #9b2c2c; }
@media (max-width: 640px) { .account-heading { display: block; }.account-heading .button { margin-top: var(--s2); }.account-actions { grid-template-columns: 1fr; }.account-private div { grid-template-columns: 1fr; } }
.submission-form { display: grid; gap: var(--s5); margin-top: var(--s5); }.submission-step { border-top: 1px solid var(--ink); display: grid; gap: var(--s3); grid-template-columns: 42px 1fr; padding-top: var(--s3); }.submission-step__number { align-items: center; border: 1px solid var(--ink); border-radius: 50%; display: flex; font-size: 10px; height: 30px; justify-content: center; width: 30px; }.submission-step h2 { font-family: var(--serif); font-size: 24px; }.submission-step h2 span { color: var(--muted); font-family: var(--sans); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }.submission-step label, .submission-step legend { display: grid; font-size: 10px; font-weight: 600; gap: 7px; letter-spacing: .05em; text-transform: uppercase; }.submission-step input:not([type="radio"]):not([type="checkbox"]):not([type="range"]), .submission-step select, .submission-step textarea { background: var(--surface); border: 1px solid var(--border-strong); border-radius: 0; color: var(--ink); padding: 11px; width: 100%; }.submission-step fieldset { border: 1px solid var(--border); display: grid; gap: var(--s2); margin-top: var(--s3); padding: var(--s3); }.submission-step fieldset .account-check { display: flex; }.submission-step small { color: var(--muted); font-size: 9px; font-weight: 400; letter-spacing: 0; text-transform: none; }.submission-fields { display: grid; gap: var(--grid-gap); grid-template-columns: 1fr 1fr; }.crop-editor { margin-top: var(--s3); }.crop-instruction{color:var(--muted);font-size:10px;margin:0 0 var(--s2)}.crop-frame { aspect-ratio: 5 / 7; background: var(--surface); cursor: grab; max-width: 420px; overflow: hidden; position: relative; touch-action: none; user-select: none; width:100%; }.crop-frame:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.crop-frame.is-dragging{cursor:grabbing}.crop-frame img { height:auto;left:0;max-width:none;pointer-events:none;position:absolute;top:0;transform-origin:top left;width:auto;will-change:transform; }.crop-guide{background:linear-gradient(to right,transparent calc(33.333% - .5px),rgba(255,255,255,.72) calc(33.333% - .5px),rgba(255,255,255,.72) calc(33.333% + .5px),transparent calc(33.333% + .5px),transparent calc(66.666% - .5px),rgba(255,255,255,.72) calc(66.666% - .5px),rgba(255,255,255,.72) calc(66.666% + .5px),transparent calc(66.666% + .5px)),linear-gradient(to bottom,transparent calc(33.333% - .5px),rgba(255,255,255,.72) calc(33.333% - .5px),rgba(255,255,255,.72) calc(33.333% + .5px),transparent calc(33.333% + .5px),transparent calc(66.666% - .5px),rgba(255,255,255,.72) calc(66.666% - .5px),rgba(255,255,255,.72) calc(66.666% + .5px),transparent calc(66.666% + .5px));border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 0 0 1px rgba(0,0,0,.22);inset:10px;pointer-events:none;position:absolute}.crop-guide span{background:rgba(0,0,0,.7);color:#fff;font-size:8px;left:6px;letter-spacing:.08em;padding:4px 6px;position:absolute;text-transform:uppercase;top:6px}.crop-controls { display: grid; gap: var(--s2); margin-top: var(--s2); max-width: 420px; }.marker-picker { max-width: 760px; }.marker-search-results { border-inline: 1px solid var(--border); max-height: 300px; overflow-y: auto; }.marker-result, .selected-marker { align-items: center; background: var(--surface); border: 0; border-bottom: 1px solid var(--border); color: var(--ink); display: grid; gap: var(--s2); grid-template-columns: 30px 1fr auto; padding: 10px; text-align: left; width: 100%; }.marker-result { cursor: pointer; }.marker-result:hover { background: var(--bg); }.marker-result strong, .selected-marker strong { display: block; font-size: 10px; }.marker-result small, .selected-marker small { color: var(--muted); display: block; font-size: 9px; }.marker-dot { background: var(--marker-colour); border: 1px solid var(--border-strong); border-radius: 50%; height: 24px; width: 24px; }.selected-markers { margin-top: var(--s2); }.selected-marker button { background: transparent; border: 0; color: var(--muted); cursor: pointer; font-size: 9px; text-transform: uppercase; }.submission-confirm { border-top: 1px solid var(--ink); display: grid; gap: var(--s3); padding-top: var(--s3); }.submission-confirm .account-check { align-items: start; display: flex; }.submission-confirm progress { width: 100%; }
@media (max-width: 640px) { .submission-step { grid-template-columns: 32px 1fr; }.submission-fields { grid-template-columns: 1fr; } }
.community-provenance { border:1px solid var(--ink);display:inline-block;font-size:8px;letter-spacing:.1em;padding:5px 7px;text-transform:uppercase; }.community-marker-disclaimer { color:var(--muted);font-size:10px;margin-top:calc(var(--s3) * -1);max-width:620px; }.community-completion-actions { border-top:1px solid var(--border);margin-top:var(--s5);padding-top:var(--s3); }.completion-share-button { background:transparent;border:1px solid var(--ink);color:var(--ink);cursor:pointer;font-size:9px;padding:9px 12px;text-transform:uppercase; }.completion-share-status { color:var(--muted);font-size:9px;overflow-wrap:anywhere; }.community-gallery { border-top:1px solid var(--ink);margin-top:var(--s7);padding-top:var(--s4); }.community-gallery__grid { display:grid;gap:var(--grid-gap);grid-template-columns:repeat(5,minmax(0,1fr)); }.community-gallery-card { background:transparent;border:1px solid transparent;color:var(--ink);cursor:pointer;padding:7px;text-align:left; }.community-gallery-card:hover,.community-gallery-card:focus-visible,.community-gallery-card.is-selected { border-color:var(--ink);outline-offset:2px; }.community-gallery-card img { aspect-ratio:5/7;display:block;object-fit:cover;width:100%; }.community-gallery-card span,.community-gallery-card small { display:block;margin-top:5px; }.community-gallery-card span { font-family:var(--serif);font-size:15px; }.community-gallery-card small { color:var(--muted);font-size:8px;text-transform:uppercase; }.canonical-page-empty { background:var(--surface);margin-top:var(--s4);padding:var(--s4); }.marker-usage-card{min-width:0}.marker-usage-reference{align-items:baseline;border-top:1px solid var(--border-strong);display:flex;justify-content:space-between;margin:0 0 var(--s1);padding-top:var(--s1)}.marker-usage-reference span{color:var(--muted);font-size:8px;letter-spacing:.09em;text-transform:uppercase}.marker-usage-reference strong{font-family:var(--serif);font-size:clamp(20px,2vw,28px);font-weight:400;line-height:1}.home-community-grid--six{grid-template-columns:repeat(6,minmax(0,1fr))}.completed-continue-grid{width:100%}.related-content-card{border-top:1px solid var(--border-strong);padding-top:var(--s2)}
@media(max-width:900px){.community-gallery__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:700px){.community-completion-view{grid-template-columns:1fr}.community-gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.completion-report-link{color:var(--muted);display:inline-block;font-size:9px;margin:var(--s3) 0 0 var(--s2);text-transform:uppercase}.account-panel{margin-inline:auto;max-width:680px;padding-block:var(--s7)}.account-panel form{display:grid;gap:var(--s3);margin-top:var(--s4)}.account-panel label{display:grid;font-size:10px;font-weight:600;gap:7px;letter-spacing:.05em;text-transform:uppercase}.account-panel input,.account-panel select,.account-panel textarea{background:var(--surface);border:1px solid var(--border-strong);color:var(--ink);padding:11px;width:100%}
.privacy-consent{background:var(--surface);border:1px solid var(--ink);bottom:max(var(--s3),env(safe-area-inset-bottom));box-shadow:0 12px 36px rgba(0,0,0,.16);display:grid;gap:var(--s3);left:max(var(--s3),env(safe-area-inset-left));max-height:calc(100vh - (2 * var(--s3)));max-width:420px;overflow-y:auto;padding:var(--s4);position:fixed;width:calc(100vw - (2 * var(--s3)));z-index:100}.privacy-consent[hidden],.privacy-settings[hidden]{display:none}.privacy-consent strong{font-family:var(--serif);font-size:22px;font-weight:400}.privacy-consent p{color:var(--muted);font-size:10px;margin:6px 0}.privacy-consent a{border-bottom:1px solid var(--border-strong);font-size:9px;text-transform:uppercase}.privacy-consent__actions{display:grid;gap:var(--s2);grid-template-columns:1fr 1fr}.privacy-consent__actions .button{min-height:42px;width:100%}.privacy-settings{background:rgba(0,0,0,.55);display:grid;inset:0;padding:var(--gutter);place-items:center;position:fixed;z-index:110}.privacy-settings__panel{background:var(--bg);border:1px solid var(--ink);max-width:620px;padding:var(--s5)}.privacy-settings-link{-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:0;color:inherit;cursor:pointer;font:inherit;line-height:inherit;margin:0;padding:0;text-align:inherit;text-decoration:none;text-transform:inherit;vertical-align:baseline}.privacy-settings-link:hover{color:var(--accent)}@media(max-width:520px){.privacy-consent{bottom:max(var(--s2),env(safe-area-inset-bottom));left:var(--s2);padding:var(--s3);width:calc(100vw - (2 * var(--s2)))}.privacy-consent__actions{grid-template-columns:1fr}.privacy-settings .privacy-consent__actions{grid-template-columns:1fr}.privacy-settings__panel{padding:var(--s4)}}
@media(max-width:760px){.masthead-actions .header-account{height:40px;min-width:auto;padding-inline:6px}.masthead-actions .header-account span,.compact-tools .header-account span{display:inline;font-size:8px}.masthead-actions .header-logout{display:none}.compact-tools .header-account{margin-left:var(--s2)}.compact-tools .header-logout{margin-left:auto}.compact-tools__actions>.theme-toggle{margin-left:var(--s3)!important}}
.colourist-archive-meta{align-items:center;display:flex;flex-wrap:wrap;gap:var(--grid-gap)}.colourist-avatar{aspect-ratio:1;border-radius:50%;object-fit:cover}.colourist-socials{display:flex;flex-wrap:wrap;gap:var(--s2)}.colourist-socials a{border-bottom:1px solid var(--border-strong);color:var(--ink)}
.book-search-field{margin:var(--s3) 0}.pinch-guide{border:1px solid var(--border-strong);display:inline-grid;font-size:13px;height:28px;margin-right:7px;place-items:center;width:34px}.book-collection-picker{border:1px solid var(--border);display:grid;max-height:560px;overflow:auto}.book-collection-option{align-items:center!important;border-bottom:1px solid var(--border);display:flex!important;font-size:11px!important;gap:12px!important;letter-spacing:0!important;padding:10px 12px;text-transform:none!important}.book-collection-option[hidden]{display:none!important}.book-collection-option input{flex:0 0 auto}.book-collection-option span,.book-collection-option small{display:block}.book-collection-option small{margin-top:3px}
.book-combobox{display:grid;font-size:10px;font-weight:600;gap:7px;letter-spacing:.05em;position:relative;text-transform:uppercase}.book-combobox>input[type=search]{background:var(--surface);border:1px solid var(--border-strong);border-radius:0;color:var(--ink);min-height:46px;padding:11px;width:100%}.book-combobox__results{background:var(--bg);border:1px solid var(--border-strong);box-shadow:0 12px 24px rgba(0,0,0,.12);left:0;max-height:320px;overflow-y:auto;position:absolute;right:0;top:72px;z-index:20}.book-combobox__results[hidden],.book-combobox__results button[hidden]{display:none}.book-combobox__results button{background:var(--bg);border:0;border-bottom:1px solid var(--border);color:var(--ink);cursor:pointer;display:block;padding:11px;text-align:left;width:100%}.book-combobox__results button:hover,.book-combobox__results button.is-active{background:var(--surface)}.book-combobox__results strong,.book-combobox__results small{display:block}.book-combobox__results strong{font-size:10px}.book-combobox__results small{color:var(--muted);font-size:8px;margin-top:4px}
.submission-progress{display:flex;list-style:none;margin:var(--s4) 0 0;overflow-x:auto;padding:0}.submission-progress li{align-items:center;display:flex;font-size:9px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.submission-progress li+li::before{content:"→";margin:0 var(--s2)}.submission-step input:not([type=radio]):not([type=checkbox]):not([type=range]),.submission-step select,.submission-step textarea{min-height:46px}.crop-controls input[type=range]{min-height:44px;width:100%}.selected-marker{grid-template-columns:30px minmax(150px,1fr) minmax(130px,180px) auto}.marker-reference-field{font-size:8px!important}.marker-reference-field input{min-height:40px!important}.selected-marker button{min-height:44px;padding:8px}.reported-colour-card>p{align-items:baseline;display:flex;gap:var(--s1);justify-content:space-between;margin:var(--s1) 0 0}.reported-colour-card>p span{color:var(--muted);font-size:8px;text-transform:uppercase}.reported-colour-card>p strong{font-family:var(--serif)}
@media(max-width:640px){.account-shell--wide{max-width:100%;padding-top:var(--s4)}.submission-progress{margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter)}.submission-step{display:block}.submission-step__number{margin-bottom:var(--s2)}.crop-frame{max-width:100%}.selected-marker{align-items:start;grid-template-columns:30px 1fr auto}.selected-marker .marker-reference-field{grid-column:2/-1}.selected-marker>input[type=hidden]{display:none}.submission-confirm .button{min-height:50px;width:100%}}
@media(max-width:700px){.colourist-archive-meta{align-items:flex-start;flex-direction:column}}
#completed-markers-title{scroll-margin-top:7rem}
.account-submission-list{border-top:1px solid var(--ink)}.account-submission-item{align-items:start;border-bottom:1px solid var(--border);display:grid;gap:var(--s3);grid-template-columns:90px minmax(0,1fr) auto;padding-block:var(--s3)}.account-submission-item img{aspect-ratio:5/7;display:block;object-fit:cover;width:90px}.account-submission-item h3{font-family:var(--serif);font-size:20px;font-weight:400;margin:0}.account-submission-item p{color:var(--muted);font-size:10px;margin:5px 0 0}.account-submission-state{align-items:end;display:flex;flex-direction:column;gap:var(--s2)}.account-submission-reason{color:#9b2c2c!important;max-width:560px}.account-status.is-unpublished{color:#9b2c2c}.account-status.is-pending,.account-status.is-needs_clarification{color:#8a5b00}@media(max-width:640px){.account-submission-item{grid-template-columns:72px minmax(0,1fr)}.account-submission-item img{width:72px}.account-submission-state{align-items:start;grid-column:2}}

/* The public account workspace shares navigation without the admin chrome. */
.account-workspace { margin-inline: auto; max-width: 1050px; min-width: 0; padding-top: var(--s4); }
.account-navigation { align-items: center; border-block: 1px solid var(--border); display: flex; gap: var(--s2); justify-content: space-between; }
.account-navigation ul { display: flex; flex-wrap: wrap; gap: 0 var(--s2); list-style: none; margin: 0; min-width: 0; padding: 0; }
.account-navigation a, .account-navigation button { align-items: center; background: transparent; border: 0; border-bottom: 2px solid transparent; color: var(--muted); display: inline-flex; font: inherit; font-size: 12px; min-height: 44px; padding: var(--s2) 0; text-decoration: none; }
.account-navigation a[aria-current] { border-bottom-color: var(--ink); color: var(--ink); }
.account-navigation a:hover, .account-navigation button:hover { color: var(--ink); }
.account-navigation form { flex-shrink: 0; margin: 0; }
.account-navigation button { cursor: pointer; }
.account-workspace > .account-shell { padding-top: var(--s5); }
.account-workspace .account-actions { border-block: 1px solid var(--border); gap: var(--s4); grid-template-columns: repeat(3, minmax(0, 1fr)); padding-block: var(--s4); }
.account-workspace .account-actions > div { border: 0; min-width: 0; padding: 0; }
.account-workspace .account-heading { flex-wrap: wrap; }
.account-workspace .account-private dd, .account-workspace h1, .account-workspace h3 { overflow-wrap: anywhere; }
.account-workspace #submissions { scroll-margin-top: calc(var(--header-height) + var(--s4)); }
.marker-reference-label-short, .marker-remove-icon { display: none; }
/* Repeatable marker/reference rows follow the admin interaction model, using public tokens. */
.community-marker-picker { margin-top: var(--s3); min-width: 0; }
.community-marker-picker > p { color: var(--muted); margin-bottom: var(--s3); }
.submission-step .community-marker-row { align-items: start; border: 1px solid var(--border); display: grid; gap: var(--s3); grid-template-columns: minmax(90px, 120px) minmax(0, 1fr) auto; margin: 0 0 var(--s3); min-inline-size: 0; padding: var(--s3); }
.community-marker-row > *, .community-marker-combobox, .submission-step > div { min-width: 0; }
.community-marker-row > button { align-self: start; margin-top: 22px; min-height: 44px; }
.community-marker-picker .marker-dot { background: var(--marker-colour, var(--surface)); flex-shrink: 0; }
.community-marker-identity { align-items: center; display: flex; gap: var(--s2); margin: var(--s2) 0 0; overflow-wrap: anywhere; }
.community-marker-identity strong { display: block; font-size: 12px; }
.community-marker-picker .community-marker-identity small, .community-marker-picker .community-marker-option small { display: block; font-size: 11px; }
.community-marker-options { border: 1px solid var(--border-strong); margin-top: var(--s1); max-height: 260px; overflow-y: auto; overscroll-behavior: contain; }
.community-marker-option { align-items: center; background: var(--bg); border: 0; border-bottom: 1px solid var(--border); color: var(--ink); cursor: pointer; display: grid; font: inherit; gap: var(--s2); grid-template-columns: 24px minmax(0, 1fr); min-height: 48px; overflow-wrap: anywhere; padding: var(--s2); text-align: left; width: 100%; }
.community-marker-option strong { display: block; font-size: 12px; }
.community-marker-option:hover, .community-marker-option[aria-selected="true"] { background: var(--surface); outline: 1px solid var(--ink); outline-offset: -1px; }
.community-marker-option[aria-disabled="true"] small { font-style: italic; }
.community-marker-status { color: var(--muted); font-size: 12px; margin: var(--s1) 0 0; overflow-wrap: anywhere; }
.community-marker-status:empty { display: none; }
.community-marker-actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--s3); }
.community-marker-actions [role="status"] { color: var(--muted); font-size: 12px; }
.community-marker-picker [hidden] { display: none; }
.community-marker-picker input[aria-invalid="true"] { outline: 2px solid var(--ink); outline-offset: 2px; }
@media (max-width: 760px) {
  .site-header .theme-toggle, .site-header .nav-toggle__label, .site-header .header-account span { display: none !important; }
  .masthead { grid-template-columns: 44px minmax(0, 1fr) auto; gap: 0; }
  .masthead .brand { font-size: clamp(20px, 5.6vw, 26px); justify-self: center; white-space: nowrap; }
  .masthead-actions .header-account, .masthead-actions .nav-toggle, .masthead > .utility-link:first-child, .compact-tools .header-account, .compact-tools .nav-toggle { height: 44px; justify-content: center; min-width: 44px; padding: 0; }
  .site-header.is-compact .compact-tools__actions { gap: 0; }
  .site-header.is-compact .compact-tools span.nav-toggle__icon { display: block; }
  .account-navigation { align-items: start; flex-wrap: wrap; gap: 0 var(--s3); }
  .account-navigation ul { gap: 0 var(--s3); }
  .account-workspace .account-actions { grid-template-columns: 1fr; }
  .account-private div { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .submission-step .community-marker-row { grid-template-columns: 58px minmax(0, 1fr) 44px; gap: var(--s1); padding: var(--s1); position: relative; }
  .community-marker-row > button { padding-inline: 0; width: 44px; }
  .community-marker-row .marker-remove-label, .community-marker-row .community-marker-identity { display: none; }
  .community-marker-row .marker-remove-icon { display: inline; font-size: 22px; line-height: 1; }
  .community-marker-row .marker-reference-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .community-marker-row .marker-reference-label-short { display: inline; }
  .submission-step .community-marker-row input { font-size: 16px; min-height: 44px; padding-inline: 6px; }
  .community-marker-row .community-marker-options { position: absolute; left: var(--s1); right: var(--s1); z-index: 5; background: var(--surface); }

  .submission-fields { grid-template-columns: minmax(0, 1fr); }
  .account-submission-item { min-width: 0; }
}

/* Use the native account dropdown on small screens; keep links without JavaScript. */
.account-navigation-select { display: none; }
@media (max-width: 760px) {
  .js .account-navigation { align-items: center; flex-wrap: nowrap; gap: var(--s3); padding-block: var(--s2); }
  .js .account-navigation > ul { display: none; }
  .js .account-navigation-select { display: block; flex: 1; min-width: 0; }
  .account-navigation-select select { background: var(--surface); border: 1px solid var(--border-strong); border-radius: 0; color: var(--ink); font: inherit; font-size: 16px; min-height: 44px; padding: var(--s2); width: 100%; }
}

/* Shared account workspace: desktop navigation rail and responsive section menu. */
.account-workspace { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--s5); max-width: var(--container); padding-block: var(--s5) var(--s6); }
.account-navigation { align-self: start; align-items: stretch; background: var(--surface); border: 1px solid var(--border); display: flex; flex-direction: column; gap: var(--s3); padding: var(--s3); }
.account-navigation-title { font-size: 12px; font-weight: 600; margin: 0; }
.account-navigation ul { display: flex; flex-direction: column; gap: var(--s1); }
.account-navigation li, .account-navigation a { min-width: 0; }
.account-navigation li a { border-bottom: 0; border-left: 3px solid transparent; padding: var(--s2); width: 100%; }
.account-navigation a[aria-current] { background: var(--bg); border-left-color: var(--ink); font-weight: 600; }
.account-navigation .account-public-link { border-top: 1px solid var(--border); gap: var(--s1); padding-top: var(--s3); }
.account-workspace-content { min-width: 0; }
.account-workspace-content > .account-shell { max-width: none; padding-block: 0; }
.account-workspace-content .account-form, .account-workspace-content .account-private, .account-workspace-content .account-danger { max-width: 760px; }
.account-workspace-content h1 { font-size: clamp(30px, 3.5vw, 48px); line-height: 1.15; }
.account-workspace-content .account-heading { align-items: center; border-bottom: 1px solid var(--border); padding-bottom: var(--s4); }
.account-heading > div { min-width: 0; flex: 1 1 280px; }
.account-intro { color: var(--muted); margin-top: var(--s2); max-width: 60ch; }
.account-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(250px, 1fr); gap: var(--s5); margin-top: var(--s5); align-items: start; }
.account-dashboard-section, .account-dashboard-aside { min-width: 0; }
.account-dashboard-section .section-heading { border-top: 0; margin: 0 0 var(--s3); padding-top: 0; }
.account-dashboard-section h2, .account-summary h2 { font-family: var(--serif); font-size: 26px; font-weight: 400; margin: 0; }
.account-dashboard-aside { display: grid; gap: var(--s4); }
.account-summary { background: var(--surface); border: 1px solid var(--border); padding: var(--s4); }
.account-summary > * + * { margin-top: var(--s3); }
.account-summary .eyebrow { margin: 0 0 var(--s1); }
.account-summary-context { color: var(--muted); }
.account-profile-name, .account-book-preview { overflow-wrap: anywhere; }
.account-book-preview { list-style: none; padding: 0; }
.account-book-preview li { border-top: 1px solid var(--border); padding-block: var(--s2); font-size: 14px; }
.account-empty-state { background: var(--surface); border: 1px dashed var(--border-strong); padding: var(--s4); }
.account-empty-state h3 { font-family: var(--serif); font-size: 22px; font-weight: 400; }
.account-empty-state p { color: var(--muted); margin-top: var(--s2); }
.account-workspace .button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; text-align: center; }
.account-dashboard-section .account-submission-item { grid-template-columns: 72px minmax(0, 1fr); }
.account-dashboard-section .account-submission-item img { width: 72px; grid-row: span 2; }
.account-dashboard-section .account-submission-state { align-items: start; flex-direction: row; flex-wrap: wrap; grid-column: 2; }
@media (max-width: 1100px) {
  .account-dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  .account-dashboard-aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .account-workspace { display: block; padding-top: var(--s3); }
  .account-navigation, .js .account-navigation { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); padding: var(--s3); margin-bottom: var(--s4); }
  .account-navigation-title { flex-basis: 100%; }
  .account-navigation-select { flex: 1 1 100%; }
  .js .account-navigation-select { flex-basis: 100%; }
  .account-navigation .account-public-link { border: 0; padding: 0; }
  .account-navigation form { margin-left: auto; }
  .account-navigation ul { flex-basis: 100%; }
  .account-dashboard-grid { gap: var(--s4); margin-top: var(--s4); }
  .account-dashboard-aside { grid-template-columns: minmax(0, 1fr); }
  .account-summary { padding: var(--s3); }
}

/* Automatically saved account book collection. */
.collection-results { border: 1px solid var(--border-strong); background: var(--surface); max-height: 320px; overflow-y: auto; }
.collection-results button { display: block; background: transparent; border: 0; border-bottom: 1px solid var(--border); color: var(--ink); cursor: pointer; min-height: 44px; padding: var(--s3); text-align: left; width: 100%; overflow-wrap: anywhere; }
.collection-results button:hover, .collection-results button:focus-visible { background: var(--bg); }
.collection-results small { display: block; color: var(--muted); }
.collection-heading { margin-top: var(--s5); }
.account-book-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--grid-gap); }
.account-owned-book { position: relative; min-width: 0; display: flex; flex-direction: column; gap: var(--s3); }
.account-owned-book > article { flex: 1; }
.account-owned-book h2 { overflow-wrap: anywhere; font-size: 20px; }
.account-owned-book .collection-remove { align-self: center; margin: 0 var(--s2) var(--s3); min-height: 44px; padding: var(--s2) var(--s3); background: #111; border-color: #111; color: #fff; cursor: pointer; }
.account-owned-book--cover .collection-remove { position: absolute; top: var(--s1); right: var(--s1); z-index: 1; margin: 0; }
.account-owned-book[hidden], .collection-results[hidden], .collection-results button[hidden] { display: none; }
[data-book-collection] button:disabled { opacity: .6; cursor: wait; }
@media (max-width: 1100px) { .account-book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }