/* Hallmark · macrostructure: Index-First · tone: editorial · theme: Newsprint · nav: N9 · footer: Ft4 · enrichment: real candidate photography · P5 H5 E4 S5 R5 V5 */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&family=Newsreader:opsz,wght@6..72,400;6..72,600&display=swap');
@import url('./tokens.css');

* { box-sizing: border-box; }
html, body { margin: 0; overflow-x: clip; }
body { background: var(--color-paper); color: var(--color-ink); font-family: var(--font-body); font-size: var(--text-base); line-height: 1.55; }
a { color: inherit; }
button, input { font: inherit; }
:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.shell { width: min(100% - 2rem, 80rem); margin-inline: auto; }
.topbar { min-height: 5rem; display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid var(--color-ink); }
.brand { font-family: var(--font-display); font-size: var(--text-xl); text-decoration: none; white-space: nowrap; }
.brand-mark { display: inline-block; width: .72rem; height: .72rem; margin-inline-end: .45rem; background: var(--color-accent); border: 1px solid var(--color-ink); border-radius: 50%; }
.brand-brutal { display: inline-flex; align-items: stretch; gap: 0; border: 2px solid var(--color-ink); font-family: var(--font-mono); font-size: var(--text-sm); font-weight: 500; letter-spacing: .08em; line-height: 1; text-transform: uppercase; }
.brand-brutal > span { display: grid; place-items: center; min-height: 2.5rem; padding-inline: var(--space-3); }
.brand-brutal .brand-code { background: var(--color-ink); color: var(--color-paper); }
.about-link { font-family: var(--font-mono); font-size: var(--text-sm); text-decoration-thickness: 1px; text-underline-offset: .3rem; white-space: nowrap; }
.hero { min-height: min(48rem, calc(100svh - 5rem)); display: grid; align-content: center; padding-block-start: var(--space-12); padding-block-end: var(--space-16); }
.eyebrow, .label { font-family: var(--font-mono); font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .08em; }
.hero h1 { max-width: 12ch; margin: var(--space-4) 0 var(--space-6); font-family: var(--font-display); font-size: var(--text-display); font-weight: 400; line-height: 1.02; letter-spacing: -.035em; overflow-wrap: anywhere; }
.hero-lede { max-width: 39rem; margin: 0 0 var(--space-8); font-size: var(--text-lg); color: var(--color-muted); }
.search-wrap { position: relative; max-width: 48rem; }
.search-box { display: grid; grid-template-columns: minmax(0, 1fr) auto; border: 2px solid var(--color-ink); background: var(--color-paper); box-shadow: var(--space-2) var(--space-2) 0 var(--color-ink); }
.search-box:focus-within { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.search-input { min-width: 0; height: 4rem; padding-inline: var(--space-4); border: 0; outline: 0; background: transparent; color: var(--color-ink); font-size: var(--text-lg); }
.search-input::placeholder { color: var(--color-muted); }
.search-input:disabled { opacity: .55; cursor: not-allowed; background: var(--color-paper-2); }
.search-button { min-width: 4rem; border: 0; border-inline-start: 2px solid var(--color-ink); background: var(--color-accent); color: var(--color-accent-ink); font-size: 1.4rem; cursor: pointer; }
.search-button:active { transform: translateY(1px); }
.search-button:disabled { opacity: .55; cursor: not-allowed; }
.results { position: absolute; z-index: 5; inset-inline: 0; top: calc(100% + .5rem); background: var(--color-paper); border: 1px solid var(--color-ink); }
.result-link { display: grid; grid-template-columns: 3rem minmax(0,1fr) auto; align-items: center; gap: var(--space-3); min-height: 4.5rem; padding: var(--space-3); text-decoration: none; }
.result-link img { width: 3rem; height: 3rem; object-fit: cover; filter: grayscale(1); }
.result-initials { display: grid; place-items: center; width: 3rem; height: 3rem; background: var(--color-ink); color: var(--color-paper); font-family: var(--font-mono); }
.result-name { font-family: var(--font-display); font-size: var(--text-lg); }
.result-meta { display: block; font-size: var(--text-sm); color: var(--color-muted); }
.result-arrow { font-size: 1.4rem; }
.empty { padding: var(--space-4); margin: 0; color: var(--color-muted); }
.catalogue-note { display: flex; justify-content: space-between; gap: var(--space-4); padding-block: var(--space-6); border-top: 2px solid var(--color-ink); font-family: var(--font-mono); font-size: var(--text-sm); text-transform: uppercase; }
.foot { margin-top: var(--space-16); padding-block: var(--space-6); border-top: var(--rule); font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-muted); }
.foot p { margin: 0; max-width: 80ch; }

.profile { padding-block: var(--space-12); }
.back { display: inline-block; margin-bottom: var(--space-12); font-family: var(--font-mono); font-size: var(--text-sm); text-decoration-thickness: 1px; text-underline-offset: .3rem; white-space: nowrap; }
.profile-head { display: grid; gap: var(--space-8); padding-bottom: var(--space-12); border-bottom: var(--rule); }
.profile-photo { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center top; filter: grayscale(1); }
.status { display: inline-flex; align-items: center; gap: var(--space-2); width: fit-content; padding: .35rem .55rem; border: 1px solid var(--color-good); color: var(--color-good); font-family: var(--font-mono); font-size: var(--text-sm); }
.status::before { content: ""; width: .5rem; height: .5rem; background: currentColor; border-radius: 50%; }
.profile h1 { max-width: 12ch; margin: var(--space-6) 0 var(--space-4); font-family: var(--font-display); font-size: var(--text-display); font-weight: 400; line-height: .98; letter-spacing: -.035em; overflow-wrap: anywhere; }
.role { margin: 0; color: var(--color-muted); font-size: var(--text-lg); }
.updated { margin-top: var(--space-8); font-family: var(--font-mono); font-size: var(--text-sm); }
.facts { display: grid; margin: 0; }
.fact { display: grid; gap: var(--space-2); padding-block: var(--space-6); border-bottom: var(--rule); }
.fact dt { font-family: var(--font-mono); font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .06em; color: var(--color-muted); }
.fact dd { margin: 0; font-family: var(--font-display); font-size: var(--text-xl); }
.content-grid { display: grid; gap: var(--space-12); padding-block: var(--space-12); }
.article-section { padding-top: var(--space-4); }
.article-section h2 { margin: 0 0 var(--space-6); font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 400; line-height: 1.1; }
.article-section p { max-width: 65ch; }
.notice { padding: var(--space-6); background: var(--color-accent); color: var(--color-accent-ink); }
.notice strong { display: block; margin-bottom: var(--space-2); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .05em; }
.source-list { padding: 0; list-style: none; border-top: var(--rule); }
.source-list li { display: grid; gap: var(--space-2); padding-block: var(--space-4); border-bottom: var(--rule); }
.source-list a { text-underline-offset: .25rem; }
.source-list small { color: var(--color-muted); }

@media (hover: hover) and (pointer: fine) {
  .search-input:hover { background: var(--color-paper-2); }
  .result-link:hover { background: var(--color-paper-2); }
  .about-link:hover, .back:hover, .source-list a:hover { text-decoration-thickness: 2px; }
}
@media (min-width: 48rem) {
  .shell { width: min(100% - 4rem, 80rem); }
  .profile-head { grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); align-items: end; }
  .facts { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .fact { padding-inline: var(--space-4); border-inline-end: var(--rule); }
  .fact:first-child { padding-inline-start: 0; }
  .fact:last-child { border-inline-end: 0; }
  .content-grid { grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); }
}
@media (prefers-reduced-motion: no-preference) {
  .results { animation: reveal var(--dur-fast) var(--ease-out); transform-origin: top; }
  @keyframes reveal { from { opacity: 0; transform: translateY(-.35rem); } }
}
@media (pointer: coarse) { .search-button, .about-link, .back { min-height: 44px; } }

/* Hallmark redesign · single page · structure: operational dossier · mood: military archive · pre-emit: P5 H5 E5 S5 R4 V5 */
.dossier-body { background: var(--color-dossier-bg); color: var(--color-dossier-paper); }
.dossier-nav { display: flex; align-items: center; justify-content: space-between; min-height: 4.5rem; color: var(--color-dossier-paper-2); font-family: var(--font-mono); font-size: var(--text-sm); }
.dossier-brand, .dossier-exit { color: inherit; text-decoration: none; white-space: nowrap; }
.dossier-exit { border-bottom: 1px solid currentColor; }
.dossier { padding-bottom: var(--space-16); }
.file-cover { position: relative; background: var(--color-dossier-paper); color: var(--color-dossier-ink); border: 1px solid var(--color-dossier-rule); box-shadow: var(--space-2) var(--space-2) 0 color-mix(in oklch, var(--color-dossier-ink) 45%, transparent); }
.file-cover::before { content: ""; position: absolute; inset: var(--space-3); border: 1px solid var(--color-dossier-rule); pointer-events: none; }
.file-ribbon { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) var(--space-6); border-bottom: 2px solid var(--color-dossier-ink); font-family: var(--font-mono); font-size: var(--text-sm); font-weight: 500; }
.file-grid { position: relative; z-index: 1; display: grid; gap: var(--space-8); padding: var(--space-8); }
.evidence-photo { margin: 0; align-self: start; padding: var(--space-3); background: var(--color-paper); border: 1px solid var(--color-dossier-rule); transform: rotate(-1deg); box-shadow: var(--space-2) var(--space-2) 0 color-mix(in oklch, var(--color-dossier-ink) 20%, transparent); }
.evidence-photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center top; filter: grayscale(1) contrast(1.08) sepia(.16); }
.evidence-photo figcaption { padding-top: var(--space-2); font-family: var(--font-mono); font-size: var(--text-sm); }
.identity-sheet { min-width: 0; }
.classification { margin: 0 0 var(--space-4); font-family: var(--font-mono); font-size: var(--text-sm); letter-spacing: .12em; }
.stamp { display: inline-block; padding: var(--space-2) var(--space-3); border: 3px double var(--color-dossier-red); color: var(--color-dossier-red); font-family: var(--font-mono); font-weight: 600; letter-spacing: .13em; transform: rotate(-3deg); }
.identity-sheet h1 { min-width: 0; margin: var(--space-6) 0 var(--space-4); font-family: var(--font-display); font-size: clamp(2.65rem, 6vw, 5.25rem); line-height: .9; letter-spacing: -.035em; overflow-wrap: anywhere; }
.type-line { margin: 0 0 var(--space-8); padding-block: var(--space-3); border-block: 1px solid var(--color-dossier-rule); font-family: var(--font-mono); }
.intel-grid { display: grid; margin: 0; border-top: 1px solid var(--color-dossier-rule); }
.intel-grid div { padding-block: var(--space-3); border-bottom: 1px solid var(--color-dossier-rule); }
.intel-grid dt { font-family: var(--font-mono); font-size: var(--text-sm); text-transform: uppercase; }
.intel-grid dd { margin: var(--space-1) 0 0; font-weight: 600; }
.briefing { margin-top: var(--space-8); background: var(--color-dossier-paper); color: var(--color-dossier-ink); border: 1px solid var(--color-dossier-rule); }
.briefing-head { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-6); border-bottom: 2px solid var(--color-dossier-ink); }
.briefing-head span { font-family: var(--font-mono); font-size: var(--text-sm); }
.briefing-head h2 { margin: 0; font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 400; }
.briefing-copy { display: grid; gap: var(--space-8); padding: var(--space-6); }
.briefing-copy p { max-width: 65ch; margin: 0; }
.lead-note { padding-inline-start: var(--space-4); border-inline-start: 4px solid var(--color-dossier-red); font-family: var(--font-mono); font-size: var(--text-sm); }
.dossier-sources { margin: 0; padding: 0; list-style: none; }
.dossier-sources li { display: grid; gap: var(--space-2); padding: var(--space-4) var(--space-6); border-bottom: 1px solid var(--color-dossier-rule); }
.dossier-sources li:last-child { border-bottom: 0; }
.source-code, .dossier-sources em { font-family: var(--font-mono); font-size: var(--text-sm); font-style: normal; }
.dossier-sources em { color: var(--color-dossier-red); }
.dossier-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); padding-block: var(--space-6); color: var(--color-dossier-paper-2); font-family: var(--font-mono); font-size: var(--text-sm); }
@media (hover: hover) and (pointer: fine) { .dossier-exit:hover { color: var(--color-dossier-red-ink); } }
@media (min-width: 48rem) {
  .file-grid { grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); padding: var(--space-12); }
  .intel-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .intel-grid div:nth-child(odd) { padding-inline-end: var(--space-4); border-inline-end: 1px solid var(--color-dossier-rule); }
  .intel-grid div:nth-child(even) { padding-inline-start: var(--space-4); }
  .briefing { display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr); }
  .briefing-head { border-bottom: 0; border-inline-end: 2px solid var(--color-dossier-ink); }
  .briefing-copy { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); padding: var(--space-8); }
  .dossier-sources li { grid-template-columns: 6rem minmax(0,1fr) auto; align-items: center; }
}
@media (max-width: 30rem) {
  .dossier-brand { max-width: 11rem; overflow: hidden; text-overflow: ellipsis; }
  .file-ribbon span:nth-child(2) { display: none; }
  .file-grid { padding: var(--space-6); }
}

.register { padding-block: var(--space-12); }
.register > h1 { max-width: 12ch; margin: var(--space-4) 0 var(--space-12); font-family: var(--font-display); font-size: var(--text-display); font-weight: 600; line-height: .88; letter-spacing: -.055em; overflow-wrap: anywhere; }
.register-tools { display: grid; gap: var(--space-2); max-width: 42rem; margin-bottom: var(--space-8); }
.register-tools label { font-family: var(--font-mono); font-size: var(--text-sm); text-transform: uppercase; }
.register-tools input { min-height: 3.5rem; padding-inline: var(--space-4); border: 2px solid var(--color-ink); outline: 2px solid transparent; background: transparent; color: var(--color-ink); font-size: var(--text-lg); box-shadow: var(--space-1) var(--space-1) 0 var(--color-ink); }
.register-tools input:focus-visible { outline-color: var(--color-focus); outline-offset: 2px; }
.register-tools p { margin: var(--space-2) 0 0; color: var(--color-muted); }
.alphabet { display: flex; flex-wrap: wrap; gap: var(--space-2); padding-block: var(--space-4); border-block: 2px solid var(--color-ink); }
.alphabet a { display: grid; place-items: center; min-width: 2.75rem; min-height: 2.75rem; border: 1px solid var(--color-ink); font-family: var(--font-mono); font-weight: 500; text-decoration: none; }
.register-list { margin-top: var(--space-8); }
.letter-group { display: grid; grid-template-columns: 4rem minmax(0, 1fr); border-top: 3px solid var(--color-ink); }
.letter-group h2 { margin: 0; padding-top: var(--space-4); font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 600; }
.letter-group ol { margin: 0; padding: 0; list-style: none; }
.letter-group li { border-bottom: var(--rule); }
.letter-group li a { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: var(--space-2) var(--space-4); align-items: center; min-height: 5rem; padding: var(--space-4); text-decoration: none; }
.letter-group li a::before { content: "ДЕЛО"; position: absolute; inset-inline-start: -3.75rem; top: 50%; color: var(--color-dossier-red); font-family: var(--font-mono); font-size: .62rem; letter-spacing: .08em; transform: translateY(-50%) rotate(-90deg); opacity: 0; }
.letter-group li span { font-family: var(--font-display); font-size: var(--text-lg); }
.letter-group li small { grid-column: 1; color: var(--color-muted); }
.letter-group li b { grid-column: 2; grid-row: 1 / 3; font-size: var(--text-lg); font-weight: 400; }
.register-source { margin-top: var(--space-12); max-width: 65ch; }
.register-empty { padding-block: var(--space-8); }
.evidence-monogram { display: grid; grid-template-rows: minmax(22rem, 1fr) auto; min-height: 32rem; background: var(--color-dossier-paper-2); }
.evidence-monogram > span { display: grid; place-items: center; border: 1px solid var(--color-dossier-rule); font-family: var(--font-display); font-size: clamp(4rem, 12vw, 9rem); color: var(--color-dossier-rule); }
@media (hover: hover) and (pointer: fine) { .brand-brutal:hover { box-shadow: var(--space-1) var(--space-1) 0 var(--color-ink); transform: translate(-1px,-1px); } .letter-group li a:hover { background: var(--color-ink); color: var(--color-paper); } .letter-group li a:hover::before { opacity: 1; } .alphabet a:hover { background: var(--color-dossier-red); color: var(--color-dossier-red-ink); } }
@media (min-width: 48rem) { .letter-group { grid-template-columns: 8rem minmax(0, 1fr); } .letter-group li a { grid-template-columns: minmax(0,1.5fr) minmax(0,1fr) auto; } .letter-group li small { grid-column: 2; } .letter-group li b { grid-column: 3; grid-row: 1; } }

.case-section { margin-top: var(--space-8); background: var(--color-dossier-paper); color: var(--color-dossier-ink); border: 1px solid var(--color-dossier-rule); }
.case-section-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2); padding: var(--space-6); border-bottom: 2px solid var(--color-dossier-ink); }
.case-section-head span, .case-section-head small { font-family: var(--font-mono); font-size: var(--text-sm); }
.case-section-head h2 { margin: 0; font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 600; line-height: 1; }
.case-facts { display: grid; margin: 0; }
.case-facts > div { position: relative; padding: var(--space-6); border-bottom: 1px solid var(--color-dossier-rule); }
.case-facts > div:last-child { border-bottom: 0; }
.case-facts dt { margin-bottom: var(--space-2); font-family: var(--font-mono); font-size: var(--text-sm); text-transform: uppercase; }
.case-facts dd { margin: 0 0 var(--space-4); max-width: 60ch; font-size: var(--text-lg); font-weight: 600; line-height: 1.3; }
.proof-tag { display: inline-block; padding: var(--space-1) var(--space-2); border: 1px solid currentColor; font-family: var(--font-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; }
.proof-tag--verified { color: var(--color-good); }
.proof-tag--reported { color: var(--color-dossier-red); }
.proof-tag--self { color: var(--color-dossier-rule); }
.case-timeline { margin: 0; padding: 0; list-style: none; }
.case-timeline li { display: grid; grid-template-columns: 5rem minmax(0, 1fr); gap: var(--space-4); padding: var(--space-6); border-bottom: 1px solid var(--color-dossier-rule); }
.case-timeline li:last-child { border-bottom: 0; }
.case-timeline time { font-family: var(--font-mono); font-weight: 600; }
.case-timeline strong { font-family: var(--font-display); font-size: var(--text-lg); }
.case-timeline p { max-width: 65ch; margin: var(--space-2) 0 0; }
.case-columns { display: grid; }
.case-columns article { padding: var(--space-6); border-bottom: 1px solid var(--color-dossier-rule); }
.case-columns h3 { margin: 0 0 var(--space-3); font-family: var(--font-display); font-size: var(--text-xl); }
.case-columns p { max-width: 65ch; margin: 0; }
.case-columns ul { padding-inline-start: var(--space-6); }
.verification-note { margin: 0; padding: var(--space-6); border-top: 2px solid var(--color-dossier-ink); font-family: var(--font-mono); font-size: var(--text-sm); }
.entity-table { width: 100%; }
.entity-row { display: grid; gap: var(--space-2); padding: var(--space-4) var(--space-6); border-bottom: 1px solid var(--color-dossier-rule); }
.entity-row:last-child { border-bottom: 0; }
.entity-row span { font-size: var(--text-sm); }
.entity-row--head { display: none; font-family: var(--font-mono); font-size: var(--text-sm); text-transform: uppercase; }
.case-warning { border: 2px solid var(--color-dossier-red); }
.case-warning .case-section-head { color: var(--color-dossier-red); border-color: var(--color-dossier-red); }
.case-warning-copy { display: grid; gap: var(--space-6); padding: var(--space-6); }
.case-warning-copy p { max-width: 65ch; margin: 0; }
.dossier-sources--rich a { color: var(--color-dossier-red); font-family: var(--font-mono); font-size: var(--text-sm); text-underline-offset: .2rem; }
@media (min-width: 48rem) {
  .case-section-head { grid-template-columns: 7rem minmax(0, 1fr) auto; align-items: end; }
  .case-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .case-facts > div:nth-child(odd) { border-inline-end: 1px solid var(--color-dossier-rule); }
  .case-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .case-columns article:nth-child(odd) { border-inline-end: 1px solid var(--color-dossier-rule); }
  .entity-row { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .entity-row--head { display: grid; }
  .case-warning-copy { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
