/* ==========================================================================
   enhanced-v18.css - enhanced baseline, round 3 (2026-09-03).
   Loaded after enhanced.css. Theme: fewer strokes, one rule per divider, no
   ring ornaments, calmer Chinese type, regular evidence grid, contact text
   that hops in character by character. All measures rem; 1rem = 16px.
   ========================================================================== */

/* ---- 1. Dividers: a single faint line, never stacked ------------------- */
.section-head { border-top: 1px solid rgba(17, 17, 15, .16); }
.section-head::before { display: none; }
.research-statement { border-top: 1px solid rgba(17, 17, 15, .16); }
.detail-meta { border-top: 1px solid rgba(17, 17, 15, .18); }
.detail-meta::before { display: none; }
.detail-meta div { border-bottom-color: rgba(17, 17, 15, .1); }
.media-label::after { height: 1px; background: rgba(17, 17, 15, .16); }
.still-frame figcaption { border-top-color: rgba(17, 17, 15, .1); }
.nav.scrolled { border-bottom-color: rgba(17, 17, 15, .08); }

/* ---- 2. Chinese rhythm: display line tighter, reading text steadier ---- */
:root:lang(zh-CN) .research-statement > p:last-child {
  max-width: 20ch;
  line-height: 1.22;
  letter-spacing: -.02em;
}
:root:lang(zh-CN) .research-kicker { letter-spacing: .12em; }
:root:lang(zh-CN) .research-card h3 { line-height: 1.12; letter-spacing: -.01em; }
:root:lang(zh-CN) .research-body > p:not(.research-status),
:root:lang(zh-CN) .research-card dd,
:root:lang(zh-CN) .section-deck.deck-note,
:root:lang(zh-CN) .authority-trace p { line-height: 1.7; letter-spacing: .005em; }
:root:lang(zh-CN) .research-card .research-status { line-height: 1.65; letter-spacing: .02em; }

/* ---- 3. Reading notes: a soft block, no frame, no ornaments ------------- */
.section-deck.deck-note {
  border: 0;
  background: rgba(239, 74, 50, .06);
  box-shadow: none;
  padding-right: clamp(1.5rem, 2.4vw, 2.25rem);
}
.deck-note::before,
.deck-note::after,
.deck-note-index { display: none; }
.deck-note-kicker i { box-shadow: none; animation: none; }
.deck-note .works-status { border-top: 1px solid rgba(75, 51, 40, .14); }

/* ---- 4. Proposal → authority → evidence: faint rules, bare arrows ------ */
.authority-trace {
  border-top: 1px solid rgba(17, 17, 15, .14);
  border-bottom: 1px solid rgba(17, 17, 15, .14);
}
.authority-trace li + li { border-left: 1px solid rgba(17, 17, 15, .1); }
.authority-trace li:not(:last-child)::after {
  width: auto;
  height: auto;
  border: 0;
  background: transparent;
  right: -0.6rem;
  font-size: 1.25rem;
}
.system-relation {
  border: 0;
  box-shadow: none;
  background: rgba(239, 74, 50, .08);
  color: var(--ink);
}

/* ---- 5. Research cards: colour blocks with soft depth ------------------- */
.research-card,
.research-card--director {
  border: 0;
  background: var(--paper-2);
  box-shadow: 0 1.25rem 2.5rem -1.25rem rgba(61, 37, 25, .22);
}
.research-card.on:hover,
.research-card.on:focus-visible { box-shadow: 0 1.75rem 3rem -1.25rem rgba(61, 37, 25, .3); }
.research-card::before { display: none; }
.research-cover { border-bottom: 0; background: #f6efe4; }
.research-card .research-status { border-bottom: 1px solid rgba(17, 17, 15, .1); }
.research-card dl > div { border-top: 1px solid rgba(17, 17, 15, .1); }
.research-card dl > div:last-child { border: 0; background: rgba(239, 74, 50, .07); }
.research-card:hover dl > div:last-child,
.research-card:focus-within dl > div:last-child { border: 0; background: rgba(239, 74, 50, .11); }

/* ---- 6. Evidence: two in a row, Networked Cities full width below ------ */
.card::after { display: none; }
.card:hover .card-cover::after,
.card:focus-visible .card-cover::after { box-shadow: none; }
.card-award { border-top-color: rgba(239, 74, 50, .22); }
.card-type { border-top: 1px solid rgba(17, 17, 15, .08); }
.grid--featured .card--lead.card--layout-1,
.grid--featured .card--lead.card--layout-2 { padding-top: 0; }
.grid--featured .card:nth-child(3) { grid-column: 1 / -1; }
.grid--featured .card:nth-child(3) .card-cover { aspect-ratio: 21 / 9; }
.grid--featured .card:nth-child(3) .card-body {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  grid-template-areas:
    "cat cat"
    "title summary"
    "en award"
    "en type";
  column-gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}
.grid--featured .card:nth-child(3) .card-cat { grid-area: cat; }
.grid--featured .card:nth-child(3) .card-title { grid-area: title; font-size: clamp(2.25rem, 3.4vw, 3.375rem); }
.grid--featured .card:nth-child(3) .card-en { grid-area: en; }
.grid--featured .card:nth-child(3) .card-summary { grid-area: summary; margin-top: 0; }
.grid--featured .card:nth-child(3) .card-award { grid-area: award; }
.grid--featured .card:nth-child(3) .card-type { grid-area: type; }

/* ---- 7. Outputs, GitHub, filters, About, detail: blocks not frames ----- */
.research-outputs { border: 0; box-shadow: none; background: rgba(75, 51, 40, .06); }
.outputs-list { border-top: 1px solid rgba(75, 51, 40, .14); }
.output-item { border-bottom: 1px solid rgba(75, 51, 40, .12); }
.output-links a { border: 0; background: rgba(239, 74, 50, .12); }
.archive-github { border: 0; box-shadow: none; background: rgba(75, 51, 40, .06); }
.archive-github:is(:hover, :focus-visible) { box-shadow: none; background: rgba(239, 74, 50, .1); }
.filter-btn { border: 0; background: rgba(17, 17, 15, .06); }
.filter-btn::before { display: none; }
.filter-btn:hover { background: rgba(17, 17, 15, .1); }
.filter-btn.active,
.filter-btn.active:hover { background: var(--ink); color: var(--paper); }
.about-card { border-top: 1px solid rgba(17, 17, 15, .14); }
.timeline li,
.skill-row,
.award-list li { border-bottom: 1px solid rgba(17, 17, 15, .1); }
.timeline .t::after { display: none; }
.about-social-link { border: 0; background: var(--paper-2); box-shadow: 0 0.75rem 2rem rgba(75, 51, 40, .06); }
.about-social-icon { border: 0; background: rgba(239, 74, 50, .12); }
.detail-close,
.detail-step { border: 0; }

/* ---- 8. Contact: no orbit ring; the heading hops in character by character */
.contact-sticky::after { display: none; }
.contact-content h2 .motion-char-mask {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
  padding-bottom: .06em;
  margin-bottom: -.06em;
}
.contact-content h2 .motion-char {
  display: inline-block;
  opacity: 0;
  transform: translateY(112%);
  transition:
    transform .95s cubic-bezier(.34, 1.56, .64, 1) var(--char-delay, 0ms),
    opacity .35s ease var(--char-delay, 0ms);
}
.contact.is-revealed .contact-content h2 .motion-char { opacity: 1; transform: none; }
@keyframes contactHop {
  0%, 100% { transform: none; }
  38% { transform: translateY(-.14em); }
}
.contact.is-revealed .contact-content:hover h2 .motion-char {
  animation: contactHop .72s var(--ease-out) var(--char-delay, 0ms);
}
@media (prefers-reduced-motion: reduce) {
  .contact-content h2 .motion-char { opacity: 1; transform: none; transition: none; animation: none !important; }
}

/* ---- 9. Narrow screens ------------------------------------------------- */
@media (max-width: 820px) {
  .grid--featured .card:nth-child(3) .card-cover { aspect-ratio: 16 / 10; }
  .grid--featured .card:nth-child(3) .card-body { display: block; }
  .grid--featured .card:nth-child(3) .card-title { font-size: clamp(1.75rem, 8vw, 2.5rem); }
  .grid--featured .card:nth-child(3) .card-summary { margin-top: 0.875rem; }
}

/* ---- 10. Background field: the orbit ring ornament is retired ---------- */
.bgf-orbit { display: none; }

/* ==========================================================================
   v18.1 — weight contrast and secondary-text scale (2026-09-03, round 4).
   Headings and labels sit at 640–700; reading text sits at 420–450, so the
   two never look the same weight. Secondary lines (translations, categories,
   context, TYPE, status, dt) move up one step so they no longer read as
   footnotes next to the main text. About now leads the page.
   ========================================================================== */
/* Headings & labels: firm */
.section-head h2 { font-weight: 640; }
.research-statement > p:last-child,
:root:lang(zh-CN) .research-statement > p:last-child { font-weight: 660; }
.research-card h3 { font-weight: 660; }
.authority-trace strong { font-weight: 660; }
.card-title { font-weight: 660; }
.output-item h4, .archive-github strong, .outputs-heading h3 { font-weight: 640; }
.about-card h3 { font-weight: 700; }
.timeline .d b, .skill-row b { font-weight: 700; }
.detail-title { font-weight: 600; }
.detail-meta b { font-weight: 750; }
.row-text h4 { font-weight: 680; }
.research-card dt, .card-type b, .research-kicker, .research-status span { font-weight: 760; }
/* Reading text: light and even */
.research-body > p:not(.research-status),
.research-card dd,
.authority-trace p,
.section-deck.deck-note,
.card-summary,
.about-lead,
.timeline .d span,
.skill-row p,
.award-list li,
.output-item > p,
.archive-github-note,
.detail-para,
.row-text p { font-weight: 430; }
.research-statement > p:last-child { color: var(--ink); }
/* Secondary text: one step larger, still clearly secondary */
.section-head h2 em,
#works .section-head h2 em { font-size: clamp(0.875rem, 1vw, 1rem); letter-spacing: .22em; }
.research-kicker { font-size: clamp(0.8125rem, .95vw, 0.9375rem); }
.card-en { font-size: clamp(0.9375rem, 1.05vw, 1.031rem); letter-spacing: .12em; line-height: 1.5; }
.card-cat { font-size: clamp(0.8125rem, .9vw, 0.875rem); }
.card-award { font-size: clamp(0.9375rem, 1.05vw, 1rem); }
.card-type b { font-size: clamp(0.75rem, .85vw, 0.8125rem); }
.card-type span { font-size: clamp(0.9062rem, 1vw, 0.9688rem); }
.research-card h3 small { font-size: clamp(0.8125rem, .92vw, 0.875rem); letter-spacing: .1em; }
.research-card .research-status { font-size: clamp(0.8125rem, .92vw, 0.875rem); }
.research-card dt { font-size: clamp(0.8125rem, .9vw, 0.875rem); }
.research-card dd { font-size: clamp(0.9375rem, 1.05vw, 1rem); }
.research-open { font-size: clamp(0.8125rem, .9vw, 0.875rem); }
.authority-trace span { font-size: clamp(0.875rem, 1vw, 0.9375rem); }
.system-relation { font-size: clamp(0.875rem, 1vw, 0.9375rem); }
.relation-boundary { font-size: clamp(0.8125rem, .9vw, 0.875rem); }
.deck-note-kicker { font-size: clamp(0.8125rem, .9vw, 0.875rem); }
.about-card h3 em { font-size: clamp(0.875rem, 1vw, 0.9375rem); }
.timeline .t { font-size: clamp(0.875rem, 1vw, 0.9375rem); }
.detail-cat { font-size: clamp(1.062rem, 1.25vw, 1.25rem); }
.detail-en { font-size: clamp(1.062rem, 1.3vw, 1.312rem); }
.detail-meta b { font-size: clamp(0.8125rem, .9vw, 0.875rem); }
.detail-award { font-size: clamp(1rem, 1.15vw, 1.094rem); }
.archive-github-kicker { font-size: clamp(0.8125rem, .9vw, 0.875rem); }
/* ==========================================================================
   v18.2 — round 5 (2026-09-03): edge-to-edge homepage, lighter research
   statement, beige status chip, no label rules, one-line Chinese role, and a
   recomposed cover wash (text layout untouched).
   ========================================================================== */
/* 1. The opened book fills the viewport: no pale frame around the homepage.
      section-transitions.js reads this padding (0) as the outer gutter. */
.book-sticky { padding: 0; }
.book-intro.is-open .book-shell::before,
.book-intro.is-open .book-shell::after { opacity: 0; }
/* 2. Research statement: clearly lighter than the section title */
.research-statement > p:last-child { font-weight: 420; }
:root:lang(zh-CN) .research-statement > p:last-child { font-weight: 470; }
/* 3. Status chip: beige a step darker than the paper, ink text */
.research-status span { background: #e9dfcd; color: var(--ink); }
/* 4. No long rules after section labels in project pages */
.media-label::after { display: none; }
.media-label { justify-content: flex-start; }
/* 5. Chinese hero role fits on one line at desktop widths (size only) */
:root:lang(zh-CN) .hero-role { font-size: clamp(1.5rem, 2.3vw, 2.75rem); }
/* 6. Cover wash: one vermilion bloom, a peach mid-tone, a soft umber foot and a
      cool whisper at the top right — the muddy sage / violet / yellow smudges go */
.book-cover::before {
  background:
    radial-gradient(78% 74% at -6% 112%, rgba(58,32,24,.9) 0 8%, rgba(96,48,32,.66) 22%, rgba(133,63,40,.24) 40%, transparent 62%),
    radial-gradient(92% 84% at 8% 110%, rgba(239,74,50,.96) 0 12%, rgba(240,96,66,.8) 26%, rgba(243,138,100,.4) 44%, rgba(247,178,140,.14) 58%, transparent 72%),
    radial-gradient(70% 62% at 34% 100%, rgba(247,170,120,.5) 0 10%, rgba(249,196,156,.28) 30%, rgba(250,216,186,.12) 50%, transparent 68%),
    radial-gradient(64% 56% at 56% 84%, rgba(250,205,170,.34) 0 8%, rgba(251,222,196,.16) 34%, transparent 66%),
    radial-gradient(52% 46% at 92% 6%, rgba(126,146,160,.13) 0 8%, rgba(160,176,186,.06) 34%, transparent 64%),
    radial-gradient(48% 42% at 74% 30%, rgba(236,214,190,.22) 0 8%, rgba(240,224,204,.1) 34%, transparent 62%),
    radial-gradient(44% 40% at 46% 58%, rgba(232,120,88,.12) 0 8%, rgba(240,160,130,.05) 32%, transparent 60%);
  opacity: .94;
}

/* 7. Cover title never runs past the cover edge now that the shell spans the
      viewport: same position and letter-spacing, capped at 12.4vw. */
.book-cover > strong,
:root:lang(en) .book-cover > strong,
:root:lang(zh-CN) .book-cover > strong { font-size: min(clamp(7.5rem, 16.3vw, 19.88rem), 12.4vw); }

/* 8. Round status chips; more air between a project's meta column and its text */
.research-status span { border-radius: 0.55rem; }
.detail-main { padding-left: clamp(1rem, 2.6vw, 2.75rem); }
@media (max-width: 820px) { .detail-main { padding-left: 0; } }

/* About leads the page: it takes the gateway spacing the research section had */
.about { border-top-color: rgba(17, 17, 15, .16); padding-top: clamp(7rem, 11vw, 11.5rem); }
.research-gateway { padding-top: clamp(6.5rem, 9vw, 9.5rem); }
@media (max-width: 820px) {
  .about { padding-top: 5.5rem; }
  .card-en { font-size: 0.875rem; }
}
