:root {
  --paper: #f2efe6;
  --ink: #11110f;
  --line: rgba(17, 17, 15, 0.22);
  --signal: #ff4d00;
  font-family: Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
.archive-header, .archive-footer { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1rem 2vw; border-bottom: 1px solid var(--ink); font-size: .72rem; font-weight: 700; letter-spacing: .08em; }
.archive-header { position: sticky; z-index: 20; top: 0; background: color-mix(in srgb, var(--paper) 92%, transparent); backdrop-filter: blur(12px); }
.archive-header nav { display: flex; gap: 1.5rem; }
.archive-header a:hover { color: var(--signal); }
.archive-mark { font-size: 1rem; }
.archive-footer { border-top: 1px solid var(--ink); border-bottom: 0; margin-top: 7rem; }
.archive-shell { padding: 0 2vw; }
.archive-intro { min-height: 55vh; display: grid; grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr); gap: 4vw; align-items: end; padding: 8rem 0 2rem; border-bottom: 1px solid var(--ink); }
.archive-kicker, .archive-meta, .archive-index { margin: 0; font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.archive-intro h1, .detail-hero h1, .profile-hero h1 { margin: 0; font-size: clamp(3.4rem, 10vw, 10rem); font-weight: 500; line-height: .86; letter-spacing: -.065em; }
.archive-intro-copy { max-width: 34rem; font-size: clamp(1.1rem, 1.6vw, 1.55rem); line-height: 1.45; }
.archive-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem; padding-top: 1rem; }
.archive-card { grid-column: span 6; border-bottom: 1px solid var(--ink); padding-bottom: 1.2rem; }
.archive-card:nth-child(3n) { grid-column: span 12; }
.archive-card-media { overflow: hidden; aspect-ratio: 4 / 3; background: #d7d5ce; }
.archive-card:nth-child(3n) .archive-card-media { aspect-ratio: 16 / 7; }
.archive-card img { height: 100%; object-fit: cover; transition: transform .55s ease; }
.archive-card:hover img { transform: scale(1.025); }
.archive-card-copy { display: grid; grid-template-columns: 4rem 1fr auto; gap: 1rem; align-items: start; padding-top: 1rem; }
.archive-card h2 { margin: 0; font-size: clamp(1.6rem, 3.6vw, 4.5rem); line-height: .95; letter-spacing: -.045em; font-weight: 500; }
.archive-card p { margin: .65rem 0 0; max-width: 40rem; line-height: 1.5; }
.archive-arrow { font-size: 2rem; line-height: 1; }
.detail-hero, .profile-hero { padding: 8rem 2vw 2rem; }
.detail-hero-head { display: grid; grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr); gap: 4vw; align-items: end; }
.detail-hero h1, .profile-hero h1 { margin-top: 1.5rem; font-size: clamp(3.2rem, 8vw, 8.5rem); }
.detail-lede { font-size: clamp(1.1rem, 1.7vw, 1.6rem); line-height: 1.45; }
.detail-cover { margin-top: 3rem; height: min(74vw, 84vh); object-fit: cover; }
.detail-body { display: grid; grid-template-columns: 1fr 2fr; gap: 4vw; padding: 6rem 2vw; border-bottom: 1px solid var(--ink); }
.detail-prose { max-width: 52rem; font-size: clamp(1.05rem, 1.35vw, 1.3rem); line-height: 1.75; }
.detail-prose p:first-child { margin-top: 0; }
.detail-meta-list { display: grid; gap: .7rem; align-content: start; }
.detail-meta-list div { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid var(--line); padding-top: .55rem; font-size: .8rem; }
.detail-gallery { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem; padding: 1rem 2vw 0; }
.detail-gallery figure { grid-column: span 6; margin: 0; }
.detail-gallery figure:nth-child(3n) { grid-column: span 12; }
.detail-gallery img { min-height: 48vw; object-fit: cover; }
.detail-gallery figure:nth-child(3n) img { min-height: 52vw; }
.detail-gallery figcaption { padding-top: .5rem; font-size: .72rem; }
.detail-cta { display: flex; justify-content: space-between; align-items: center; gap: 2rem; margin: 6rem 2vw 0; padding: 1.5rem 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); font-size: clamp(1.5rem, 4vw, 4rem); }
.profile-cover { margin-top: 3rem; display: grid; grid-template-columns: 1fr 2fr; gap: 1rem; }
.profile-cover img { height: min(70vw, 78vh); object-fit: cover; }
.profile-cover img:first-child { filter: grayscale(1); }
.profile-section { padding: 6rem 2vw 0; }
.profile-section-head { display: grid; grid-template-columns: 1fr 2fr; gap: 4vw; padding-bottom: 1rem; border-bottom: 1px solid var(--ink); }
.profile-section h2 { margin: 0; font-size: clamp(2.3rem, 6vw, 6rem); line-height: .9; font-weight: 500; letter-spacing: -.05em; }
.profile-list { list-style: none; margin: 0; padding: 0; }
.profile-list li { display: grid; grid-template-columns: 1fr 2fr auto; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.profile-work-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; padding-top: 1rem; }
.profile-work-grid figure { margin: 0; }
.profile-work-grid img { aspect-ratio: 3 / 4; object-fit: cover; }
@media (max-width: 760px) {
  .archive-header { align-items: flex-start; }
  .archive-header nav { display: grid; grid-template-columns: repeat(2, auto); gap: .55rem 1.2rem; }
  .archive-intro { min-height: 70vh; grid-template-columns: 1fr; padding-top: 6rem; }
  .archive-card, .archive-card:nth-child(3n) { grid-column: span 12; }
  .archive-card:nth-child(3n) .archive-card-media, .archive-card-media { aspect-ratio: 4 / 5; }
  .archive-card-copy { grid-template-columns: 2.2rem 1fr auto; }
  .detail-hero-head, .detail-body, .profile-section-head { grid-template-columns: 1fr; }
  .detail-cover { height: 72vh; }
  .detail-body { padding-top: 4rem; }
  .detail-gallery figure, .detail-gallery figure:nth-child(3n) { grid-column: span 12; }
  .detail-gallery img, .detail-gallery figure:nth-child(3n) img { min-height: 75vh; }
  .profile-cover { grid-template-columns: 1fr; }
  .profile-cover img:first-child { display: none; }
  .profile-hero h1 { font-size: clamp(2.6rem, 11.5vw, 4rem); overflow-wrap: anywhere; }
  .profile-section h2, .archive-card h2 { overflow-wrap: anywhere; }
  .profile-work-grid { grid-template-columns: 1fr; }
  .profile-list li { grid-template-columns: 1fr; }
  .archive-footer { align-items: flex-start; flex-direction: column; }
}