/* Blueprint — grid paper, hairline frames, figure labels. */
:root { --t-font-display: "Space Grotesk", system-ui, sans-serif; --t-font-body: "Space Grotesk", system-ui, sans-serif; --t-font-mono: "IBM Plex Mono", monospace; --t-max: 1140px; --t-radius: 2px; --t-radius-sm: 2px; --t-radius-pill: 2px; --t-shadow: none; --t-grid: color-mix(in srgb, var(--t-accent) 14%, transparent); }
body { background-color: var(--t-bg); background-image: linear-gradient(var(--t-grid) 1px, transparent 1px), linear-gradient(90deg, var(--t-grid) 1px, transparent 1px); background-size: 24px 24px; }

/* drafting hero: the cover framed like a sheet with a title block */
.t-hero--drafting .t-cover { width: min(100% - 2 * var(--t-gutter), var(--t-max)); margin: clamp(20px, 4vw, 40px) auto 0; border: 1px solid var(--t-accent); aspect-ratio: 16 / 5; }
.t-hero--drafting .t-hero__inner { border: 1px solid var(--t-accent); border-block-start: 0; background: var(--t-surface); padding: clamp(20px, 3vw, 32px); gap: 24px; position: relative; }
.t-hero--drafting .t-hero__media { margin: 0; }
.t-hero--drafting .t-photo { width: clamp(104px, 14vw, 140px); border-radius: 0; border: 1px solid var(--t-accent); box-shadow: none; }
.t-hero--drafting .t-eyebrow { font-family: var(--t-font-mono); text-transform: uppercase; letter-spacing: .1em; }
.t-hero--drafting .t-eyebrow::before { content: "TITLE BLOCK — "; color: var(--t-muted); }
.t-hero--drafting .t-name { font-weight: 700; font-size: clamp(2.2rem, 5vw, 3.6rem); letter-spacing: -0.02em; }
.t-hero--drafting .t-meta { font-family: var(--t-font-mono); font-size: var(--t-size-0); }
.t-hero--drafting .t-stats { border-block-start: 1px solid var(--t-accent); padding-block-start: 16px; gap: 0; }
.t-hero--drafting .t-stats li { flex: 1; min-width: 120px; padding-inline-end: 16px; border-inline-end: 1px solid var(--t-line); }
.t-hero--drafting .t-stats li:last-child { border: 0; }
.t-hero--drafting .t-stats strong { font-family: var(--t-font-mono); font-weight: 500; }
.t-hero--drafting .t-stats span { font-family: var(--t-font-mono); text-transform: uppercase; letter-spacing: .08em; }
.btn { --bs-btn-border-radius: 2px; --bs-btn-font-weight: 500; font-family: var(--t-font-mono); font-size: var(--t-size-0); text-transform: uppercase; letter-spacing: .08em; }
.t-link { border-radius: 2px; font-family: var(--t-font-mono); font-size: var(--t-size-0); }

/* sections framed with corner marks */
.t-main { counter-reset: fig; gap: 20px; }
.t-section { position: relative; background: var(--t-surface); border: 1px solid var(--t-line); padding: clamp(18px, 3vw, 28px); }
.t-section::before, .t-section::after { content: ""; position: absolute; width: 14px; height: 14px; border: 1px solid var(--t-accent); pointer-events: none; }
.t-section::before { top: -1px; inset-inline-start: -1px; border-inline-end: 0; border-block-end: 0; }
.t-section::after { bottom: -1px; inset-inline-end: -1px; border-inline-start: 0; border-block-start: 0; }
.t-section__title { font-family: var(--t-font-mono); font-weight: 500; font-size: var(--t-size-1); text-transform: uppercase; letter-spacing: .14em; color: var(--t-accent-text); }
.t-section__title::before { counter-increment: fig; content: "FIG. " counter(fig, decimal-leading-zero) "  "; color: var(--t-muted); }
.t-section--summary .t-section__title { display: none; }
.t-summary { font-size: clamp(1.15rem, 2vw, 1.4rem); max-width: 60ch; }
.card { border: 1px solid var(--t-accent); background: var(--t-bg); }
.t-card__media { border-block-end: 1px solid var(--t-accent); }
.t-card .t-item__title { font-weight: 700; }
.t-card__sub, .t-tags .badge, .t-timeline__when, .t-list span { font-family: var(--t-font-mono); }
.t-tags .badge { border: 1px solid var(--t-line); background: transparent; color: var(--t-muted); border-radius: 2px; }
.t-chip { border-radius: 2px; background: transparent; border-color: var(--t-accent); font-family: var(--t-font-mono); font-size: var(--t-size-0); }
.t-numbered__item::before { font-family: var(--t-font-mono); font-size: var(--t-size-1); }
.t-quote { border: 1px dashed var(--t-accent); background: transparent; }
.t-quote blockquote { font-family: var(--t-font-body); font-size: var(--t-size-2); }
.form-control { border-radius: 2px; }
.t-footer { font-family: var(--t-font-mono); }

/* the drawing sheet with a title block (the Blueprint signature) */
.t-sheet { grid-template-columns: 1fr; gap: 0; margin-block-start: clamp(20px, 4vw, 40px); border: 1px solid var(--t-accent); background: var(--t-surface); padding: 0; }
.t-sheet__drawing { position: relative; aspect-ratio: 16 / 6; max-height: 420px; overflow: hidden; border-block-end: 1px solid var(--t-accent); background: var(--t-bg); }
.t-sheet__drawing img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; opacity: .9; }
[data-mode="dark"] .t-sheet__drawing img { mix-blend-mode: normal; opacity: .75; }
.t-sheet__blank { position: absolute; inset: 0; background: linear-gradient(135deg, transparent 49.5%, var(--t-accent) 49.5% 50.5%, transparent 50.5%), linear-gradient(45deg, transparent 49.5%, var(--t-accent) 49.5% 50.5%, transparent 50.5%); opacity: .35; }
.t-sheet__mark { position: absolute; font-family: var(--t-font-mono); font-size: var(--t-size-0); color: var(--t-accent-text); border: 1px solid var(--t-accent); width: 22px; height: 22px; display: grid; place-items: center; background: var(--t-surface); }
.t-sheet__mark--a { top: 8px; inset-inline-start: 8px; } .t-sheet__mark--1 { bottom: 8px; inset-inline-end: 8px; }
.t-tb { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-block-end: 1px solid var(--t-accent); }
@media (min-width: 760px) { .t-tb { grid-template-columns: auto minmax(0, 2fr) repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .t-tb { grid-template-columns: auto minmax(0, 2.4fr) repeat(5, minmax(0, 1fr)); } }
.t-tb > * { border: 0 solid var(--t-accent); border-inline-end-width: 1px; border-block-end-width: 1px; padding: 10px 12px; min-width: 0; }
.t-tb__photo { grid-row: span 2; padding: 10px; display: grid; place-items: center; }
.t-tb__photo .t-photo { width: 96px; border-radius: 0; border: 1px solid var(--t-accent); box-shadow: none; }
.t-tb__main { grid-row: span 2; grid-column: span 1; }
@media (max-width: 759px) { .t-tb__main { grid-column: span 1; } }
.t-tb__main .t-name { font-size: clamp(1.6rem, 3.5vw, 2.6rem); font-weight: 700; letter-spacing: -0.02em; }
.t-tb__main .t-headline { font-size: var(--t-size-1); margin-block-start: 4px; max-width: none; }
.t-tb__cell { display: grid; gap: 2px; }
.t-tb__label { font-family: var(--t-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: .14em; color: var(--t-muted); }
.t-tb__value { font-family: var(--t-font-mono); font-size: var(--t-size-0); font-weight: 500; overflow-wrap: anywhere; }
.t-sheet__notes { padding: clamp(14px, 2.5vw, 24px); display: grid; gap: 12px; }
.t-sheet__notes .t-tagline, .t-sheet__notes .t-meta, .t-sheet__notes .t-actions, .t-sheet__notes .t-links { margin: 0; }
.t-sheet__notes .t-tagline::before { content: "NOTES: "; font-family: var(--t-font-mono); font-size: var(--t-size-0); color: var(--t-accent-text); letter-spacing: .1em; }