/* Hallmark · shape: Conversational FAQ adapted to editorial index · genre: editorial · theme: Newsprint (deal 3/3, seed japanese-finance-news-editorial-0d3a) · job: listen/read · draw: 5558d6
 * hero: Counter · nav: masthead with search-led rule · footer: mast · imagery: none, words are the material · signature: question-led Japanese front page
 * hero-review: in-thread, first fold and mobile pass · finish-review: subagent, 2 findings resolved
 * axes: light/Japanese-serif/warm · posture: restrained · surface: near-white · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H5 E4 S4 R5 V4 · weakest: S, replaced generic benefits with Japanese finance questions and source-led article index */
/* Hallmark · waive 59 · dense editorial index separated with double rules and hairlines · compact article rows support news browsing and document pages support continuous reading */
@import url('./tokens.css');
@import url('./base.css');
:root {
 --color-paper: #fafaf8; --color-paper-2: #f0f0eb; --color-paper-3: #e4e4db;
 --color-ink: #242922; --color-ink-2: #363c33; --color-muted: #64695f;
 --color-rule: #c4c7bc; --color-rule-2: #373d33;
 --color-accent: #8c3d2b; --color-accent-ink: #fafaf8; --color-focus: #8c3d2b;
 --font-display: 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif CJK JP', serif;
 --font-body: 'Hiragino Mincho ProN', 'Yu Mincho', 'Noto Serif CJK JP', serif;
 --font-outlier: var(--font-body); --tracking-display: -.035em;
 --container: 1360px; --gutter: 56px; --gap-columns: 40px;
 --space-hero: 56px; --space-section: 112px; --space-control: 20px;
 --color-clear: transparent;
}
body { line-height: 1.8; }
a { text-decoration-skip-ink: auto; }
a:hover { color: var(--color-accent); text-decoration-thickness: 2px; }
a:active { color: var(--color-ink); }
button:active { transform: translateY(1px); }
button:disabled { cursor: not-allowed; color: var(--color-muted); background: var(--color-paper-3); opacity: .65; }
h1,h2,h3 { line-height: 1.5; }
p { text-wrap: pretty; }
.skip { position: absolute; inset: 8px auto auto 16px; z-index: var(--z-tooltip); transform: translateY(-180%); padding: var(--space-sm) var(--space-md); background: var(--color-ink); color: var(--color-paper); }
.skip:focus-visible { transform: translateY(0); }
.site-header { padding-top: var(--space-xl); }
.mast { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: var(--gap-columns); padding-bottom: var(--space-lg); }
.wordmark { font: 700 clamp(2rem,4vw,3.8rem)/1.3 var(--font-display); letter-spacing: -.05em; text-decoration: none; overflow-wrap: break-word; min-width: 0; }
.mast-note,.mast-info { font-size: var(--text-sm); color: var(--color-muted); line-height: 1.8; }
.mast-info { text-align: right; }
.nav-row { display: flex; justify-content: space-between; align-items: center; border-top: 3px double var(--color-rule-2); border-bottom: 1px solid var(--color-rule); min-height: 64px; gap: var(--space-lg); }
.desktop-nav { display: flex; align-items: center; gap: var(--gap-columns); }
.nav-row a { font-size: var(--text-sm); white-space: nowrap; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.nav-row a[aria-current] { color: var(--color-accent); text-decoration: underline; text-underline-offset: .6em; }
.search-link { gap: var(--space-sm); }
.mobile-menu { display: none; }
.hero { display: grid; grid-template-columns: minmax(0,1.8fr) minmax(0,1fr); gap: var(--gap-columns); padding-block: var(--space-hero) var(--space-2xl); }
.hero h1 { font-size: clamp(2.4rem,4.2vw,4rem); line-height: 1.45; letter-spacing: -.04em; max-width: 15ch; }
.hero-dek { margin-top: var(--space-lg); font-size: var(--text-md); line-height: 1.9; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: var(--space-sm) var(--space-control); border: 1px solid var(--color-ink); background: var(--color-ink); color: var(--color-paper); text-decoration: none; font-size: var(--text-sm); white-space: nowrap; cursor: pointer; }
.button:hover { background: var(--color-ink-2); color: var(--color-paper); text-decoration: underline; }
.hero .button { margin-top: var(--space-lg); min-width: 164px; }
.hero-byline { display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-lg); margin-top: var(--space-lg); font-size: var(--text-xs); color: var(--color-muted); }
.hero-aside { border-left: 1px solid var(--color-rule); padding-left: var(--space-xl); padding-top: var(--space-xs); }
.hero-aside>h2 { font-size: var(--text-title); }
.hero-aside>p { color: var(--color-muted); font-size: var(--text-sm); margin-top: var(--space-sm); }
.aside-stories { margin-top: var(--space-lg); }
.aside-stories article { border-top: 1px solid var(--color-rule); padding-block: var(--space-md); }
.aside-stories h3 { font-size: 1.15rem; line-height: 1.65; }
.aside-stories h3 a { text-decoration: none; }
.aside-stories p { color: var(--color-accent); font-size: var(--text-xs); margin-top: var(--space-xs); }
.text-link { color: var(--color-accent); font-size: var(--text-sm); display: inline-flex; align-items: center; min-height: 44px; }
.hero-aside>.text-link { margin-top: var(--space-xs); }
.reading { padding-block: var(--space-xl) var(--space-section); }
.section-heading { display: flex; justify-content: space-between; align-items: center; gap: var(--space-lg); border-top: 3px double var(--color-rule-2); padding-top: var(--space-xl); padding-bottom: var(--space-xl); }
.section-heading h2 { font-size: clamp(2rem,3.2vw,2.8rem); }
.story-row { display: grid; grid-template-columns: minmax(0,1fr) 150px 44px; align-items: center; gap: var(--gap-columns); border-top: 1px solid var(--color-rule); padding-block: var(--space-xl); }
.story-row:last-child { border-bottom: 1px solid var(--color-rule); }
.story-row h2 { font-size: clamp(1.3rem,1.7vw,1.7rem); line-height: 1.65; }
.story-row h2 a { text-decoration: none; }
.story-row p { margin-top: var(--space-sm); color: var(--color-muted); font-size: var(--text-sm); max-width: 65ch; }
.story-meta { font-size: var(--text-xs); color: var(--color-muted); display: grid; gap: var(--space-xs); }
.story-meta span { color: var(--color-accent); }
.open-story { display: flex; align-items: center; justify-content: center; min-height: 44px; }
.glossary-band { background: var(--color-paper-2); padding-block: var(--space-3xl); }
.glossary { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.3fr); gap: var(--gap-columns); }
.glossary h2 { font-size: clamp(2rem,3.2vw,2.8rem); line-height: 1.65; }
.glossary>div>p { margin-top: var(--space-lg); color: var(--color-muted); }
.glossary dl { margin: 0; }
.glossary dl>div { display: grid; grid-template-columns: 132px minmax(0,1fr); gap: var(--space-lg); padding-block: var(--space-lg); border-top: 1px solid var(--color-rule); }
.glossary dl>div:first-child { padding-top: 0; border: 0; }
.glossary dt { font-family: var(--font-display); font-weight: 700; }
.glossary dd { margin: 0; font-size: var(--text-sm); }
.glossary dd a { display: block; color: var(--color-accent); margin-top: var(--space-xs); min-height: 32px; }
.editorial-note { padding-block: var(--space-section); display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: var(--gap-columns); align-items: center; }
.editorial-note h2 { font-size: clamp(2rem,3.4vw,3rem); line-height: 1.75; }
.editorial-note p { line-height: 2; max-width: 45ch; }
.editorial-note .text-link { margin-top: var(--space-lg); }
.contact-strip { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-lg); padding-block: var(--space-xl); border-top: 3px double var(--color-rule-2); }
.contact-strip h2 { font-size: var(--text-title); }
.contact-strip p { font-size: var(--text-sm); color: var(--color-muted); }
.site-footer { margin-top: var(--space-2xl); padding-block: var(--space-2xl) var(--space-lg); background: var(--color-paper-2); }
.footer-mast { display: flex; justify-content: space-between; align-items: center; gap: var(--space-lg); padding-bottom: var(--space-xl); border-bottom: 1px solid var(--color-rule); }
.footer-mast .wordmark { font-size: 2rem; }
.footer-mast p { font-family: var(--font-display); font-weight: 700; font-size: var(--text-lg); }
.footer-info { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--gap-columns); padding-block: var(--space-xl); }
address { display: grid; gap: var(--space-xs); font-size: var(--text-sm); font-style: normal; overflow-wrap: anywhere; }
address>span:first-child { font-weight: 700; }
address [lang=en] { font-size: var(--text-xs); color: var(--color-muted); max-width: 54ch; }
address a { width: fit-content; min-height: 32px; }
.footer-links { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.3fr); gap: var(--space-lg); }
.footer-links nav { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-xs); }
.footer-links a { display: flex; align-items: center; min-height: 36px; font-size: var(--text-xs); text-decoration: none; }
.footer-bottom { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-lg); border-top: 1px solid var(--color-rule); padding-top: var(--space-lg); color: var(--color-muted); }
.footer-bottom small { white-space: nowrap; }
.footer-bottom p { max-width: 65ch; font-size: var(--text-xs); }
.footer-bottom>a { font-size: var(--text-xs); white-space: nowrap; min-height: 32px; }
.page-heading { padding-block: var(--space-2xl) var(--space-xl); }
.page-heading h1 { font-size: clamp(2.3rem,4.3vw,3.7rem); max-width: 25ch; }
.page-heading>p { margin-top: var(--space-lg); color: var(--color-muted); max-width: 65ch; }
.listing { padding-bottom: var(--space-xl); }
.search-form { max-width: 640px; margin-top: var(--space-lg); }
.search-form label { font-size: var(--text-sm); display: block; margin-bottom: var(--space-xs); }
.search-form>div { display: flex; gap: var(--space-sm); }
.search-form input { min-width: 0; width: 100%; min-height: 48px; border: 1px solid var(--color-muted); border-radius: 0; background: var(--color-paper); color: var(--color-ink); padding: var(--space-sm); }
.search-form input::placeholder { color: var(--color-muted); }
.filters { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-lg); border-top: 1px solid var(--color-rule); border-bottom: 1px solid var(--color-rule); margin-top: var(--space-xl); padding-block: var(--space-sm); }
.filters a { min-height: 44px; display: inline-flex; align-items: center; font-size: var(--text-sm); text-decoration: none; white-space: nowrap; }
.filters [aria-current] { text-decoration: underline; text-underline-offset: .5em; color: var(--color-accent); }
.results-status { font-size: var(--text-sm); color: var(--color-muted); margin-block: var(--space-lg); }
.no-results { padding-block: var(--space-2xl); }
.no-results h2 { font-size: var(--text-title); }
.no-results p { margin-top: var(--space-md); }
.notice { margin-block: var(--space-lg); padding: var(--space-lg); background: var(--color-paper-2); }
.breadcrumb { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-xl); font-size: var(--text-sm); color: var(--color-muted); }
.article-heading { padding-block: var(--space-xl) var(--space-2xl); border-bottom: 3px double var(--color-rule-2); }
.article-heading h1 { font-size: clamp(2rem,3.5vw,3.3rem); max-width: 25ch; line-height: 1.6; }
.article-dek { margin-top: var(--space-lg); font-size: var(--text-lead); max-width: 60ch; line-height: 1.9; }
.article-meta { display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-lg); color: var(--color-muted); margin-top: var(--space-lg); font-size: var(--text-xs); }
.article-layout { display: grid; grid-template-columns: 250px minmax(0,1fr); gap: var(--gap-columns); padding-top: var(--space-2xl); align-items: start; }
.article-toc h2 { font-size: 1.15rem; }
.article-toc nav { display: grid; gap: var(--space-md); margin-top: var(--space-lg); }
.article-toc a { font-size: var(--text-sm); }
.article-toc>p { font-size: var(--text-xs); color: var(--color-muted); margin-top: var(--space-xl); padding-top: var(--space-lg); border-top: 1px solid var(--color-rule); }
.article-body { max-width: 44rem; }
.article-body section+section { margin-top: var(--space-xl); }
.article-body h2 { font-size: clamp(1.3rem,2vw,1.65rem); line-height: 1.8; }
.article-body p { font-size: 1.0625rem; line-height: 2.1; margin-top: var(--space-md); max-width: 65ch; }
.article-body a,.document-content p a { color: var(--color-accent); overflow-wrap: anywhere; }
.article-body .sources,.article-body .article-caution { border-top: 1px solid var(--color-rule); padding-top: var(--space-xl); }
.sources ul { padding-left: var(--space-lg); margin-block: var(--space-md); }
.sources li { padding-bottom: var(--space-sm); font-size: var(--text-sm); }
.sources p,.article-caution p { font-size: var(--text-sm); color: var(--color-muted); }
.related { border-top: 3px double var(--color-rule-2); padding-top: var(--space-xl); margin-top: var(--space-3xl); }
.related>h2 { font-size: clamp(2rem,3vw,2.8rem); }
.related>div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--gap-columns); margin-top: var(--space-xl); }
.related article { padding-block: var(--space-lg); border-top: 1px solid var(--color-rule); }
.related h3 { line-height: 1.7; font-size: var(--text-title); }
.related h3 a { text-decoration: none; }
.related p { font-size: var(--text-sm); margin-top: var(--space-md); color: var(--color-muted); }
.document { padding-bottom: var(--space-xl); }
.document-content { max-width: 48rem; }
.document-content section { margin-top: var(--space-xl); padding-top: var(--space-xl); border-top: 1px solid var(--color-rule); }
.document-content h2 { font-size: clamp(1.4rem,2.2vw,1.8rem); line-height: 1.7; }
.document-content p { line-height: 2; margin-top: var(--space-lg); max-width: 65ch; }
.document-content address { margin-top: var(--space-lg); }
.contact-email { font-size: clamp(1rem,2.5vw,1.8rem); overflow-wrap: anywhere; }
.contact-phone { font-size: var(--text-lg); }
.publisher-details { margin: var(--space-lg) 0 0; }
.publisher-details>div { display: grid; grid-template-columns: 140px minmax(0,1fr); gap: var(--space-lg); padding-block: var(--space-lg); border-bottom: 1px solid var(--color-rule); }
.publisher-details dt { color: var(--color-muted); font-size: var(--text-sm); }
.publisher-details dd { margin: 0; overflow-wrap: anywhere; }
@media (min-width: 80rem) { .hero h1 { font-size: 4rem; } }
@media (max-width: 64rem) {
 :root { --gutter: 32px; --gap-columns: 32px; }
 .mast { grid-template-columns: minmax(0,1fr) auto; }
 .mast-note { display: none; }
 .mast-info { display: block; }
 .desktop-nav { gap: var(--space-lg); }
 .hero { grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); }
 .hero-aside { padding-left: var(--space-lg); }
 .hero-aside h2 { font-size: 1.25rem; }
 .aside-stories h3 { font-size: 1.05rem; }
 .glossary { grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); }
 .glossary dl>div { grid-template-columns: minmax(0,1fr); gap: var(--space-xs); }
 .story-row { grid-template-columns: minmax(0,1fr) 124px 32px; }
 .article-layout { grid-template-columns: 200px minmax(0,1fr); gap: var(--gap-columns); }
 .footer-info { grid-template-columns: minmax(0,1fr); }
 .footer-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 44rem) {
 :root { --gutter: 20px; --gap-columns: 24px; --space-hero: 40px; --space-section: 64px; }
 .site-header { padding-top: var(--space-lg); }
 .mast { display: flex; justify-content: center; padding-bottom: var(--space-lg); }
 .mast .wordmark { font-size: clamp(1.9rem,8vw,3rem); text-align: center; }
 .mast-info { display: none; }
 .nav-row { min-height: 56px; align-items: flex-start; }
 .desktop-nav { display: none; }
 .mobile-menu { display: block; flex: 1; padding-block: var(--space-xs); }
 .mobile-menu summary { cursor: pointer; min-height: 40px; display: list-item; align-content: center; font-size: var(--text-sm); margin-left: var(--space-md); }
 .mobile-menu nav { display: grid; gap: var(--space-2xs); padding-block: var(--space-sm); }
 .search-link { margin-top: var(--space-2xs); }
 .hero { grid-template-columns: minmax(0,1fr); padding-bottom: var(--space-xl); }
 .hero h1 { font-size: clamp(2.4rem,8.7vw,3.8rem); line-height: 1.5; }
 .hero-aside { border-left: 0; border-top: 1px solid var(--color-rule); padding-left: 0; padding-top: var(--space-xl); margin-top: var(--space-md); }
 .hero-aside>h2 { font-size: 1.5rem; }
 .hero-aside>p { font-size: var(--text-md); }
 .aside-stories { margin-top: var(--space-lg); }
 .aside-stories article { padding-block: var(--space-lg); }
 .aside-stories h3 { font-size: 1.25rem; }
 .section-heading { padding-block: var(--space-lg); align-items: baseline; }
 .section-heading h2 { font-size: 1.9rem; }
 .story-row { grid-template-columns: minmax(0,1fr) 32px; gap: var(--space-sm); padding-block: var(--space-lg); }
 .story-row>div:first-child { grid-column: 1; }
 .story-row h2 { font-size: 1.35rem; }
 .story-row .story-meta { grid-row: 2; grid-column: 1; display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-xs); }
 .open-story { grid-column: 2; grid-row: 1 / 3; }
 .glossary-band { padding-block: var(--space-2xl); }
 .glossary { grid-template-columns: minmax(0,1fr); gap: var(--space-xl); }
 .glossary dl>div { padding-block: var(--space-lg); }
 .glossary dt { font-size: var(--text-lg); }
 .glossary dd { font-size: var(--text-md); }
 .editorial-note { grid-template-columns: minmax(0,1fr); }
 .editorial-note h2 { font-size: 2rem; }
 .contact-strip { display: grid; gap: var(--space-md); }
 .footer-mast { align-items: flex-start; flex-direction: column; }
 .footer-mast p { font-size: var(--text-md); }
 .footer-bottom { flex-direction: column; gap: var(--space-md); }
 .footer-links { grid-template-columns: minmax(0,1fr); gap: var(--space-xl); }
 .footer-links nav { gap: var(--space-2xs); }
 .footer-links a { min-height: 44px; font-size: var(--text-sm); }
 .page-heading { padding-top: var(--space-xl); }
 .page-heading h1 { font-size: 2.25rem; line-height: 1.6; }
 .search-form>div { gap: var(--space-xs); }
 .search-form .button { padding-inline: var(--space-sm); }
 .filters { gap: var(--space-xs) var(--space-lg); }
 .article-heading { padding-bottom: var(--space-xl); }
 .article-heading h1 { font-size: 2rem; }
 .article-dek { font-size: 1.0625rem; }
 .article-layout { grid-template-columns: minmax(0,1fr); padding-top: var(--space-xl); gap: var(--space-xl); }
 .article-toc { padding-bottom: var(--space-xl); border-bottom: 1px solid var(--color-rule); }
 .article-toc>p { margin-top: var(--space-lg); }
 .article-body p { font-size: 1rem; }
 .related { margin-top: var(--space-2xl); }
 .related>div { grid-template-columns: minmax(0,1fr); gap: var(--space-lg); }
 .publisher-details>div { grid-template-columns: minmax(0,1fr); gap: var(--space-xs); }
 .document-content p { line-height: 2; }
}
