/* One document and renderer; skins change presentation only. */
[hidden] { display: none !important; }
.brand-mark { display: flex; align-items: center; justify-content: center; }
.appearance-bar { position: sticky; top: 76px; z-index: 18; display: flex; justify-content: flex-end; align-items: center; gap: .75rem; min-height: 51px; padding: .45rem clamp(1.25rem, 4vw, 4.5rem); border-bottom: 1px solid var(--line); background: var(--paper); }
.appearance-label { color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.appearance-options { display: inline-flex; padding: 2px; border: 1px solid var(--line); border-radius: 999px; }
.appearance-bar button { min-height: 34px; border: 0; border-radius: 999px; background: transparent; padding: .45rem .85rem; font-size: .8rem; font-weight: 700; cursor: pointer; }
.appearance-bar button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
button:focus-visible, a:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--rust); outline-offset: 4px; }
/* Restrained dark palette: canvas + surface, with one accent family. */
html[data-skin="techno"] { --paper: #061116; --surface: #0b1f27; --ink: #eaf6f7; --forest: var(--surface); --acid: #78d5df; --rust: var(--acid); --line: #314851; --muted: #afc0c6; color-scheme: dark; }
[data-skin="techno"] .site-header { background: rgba(6,17,22,.96); }
[data-skin="techno"] .appearance-bar { background: rgba(6,17,22,.96); backdrop-filter: blur(14px); }
[data-skin="techno"] .intro { min-height: 690px; position: relative; padding-top: 2rem; padding-bottom: 4rem; display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
[data-skin="techno"] .intro > :not(.techno-visual) { position: relative; z-index: 1; max-width: 53%; }
[data-skin="techno"] .intro .issue-line { flex-wrap: wrap; gap: 1rem; margin-bottom: 2rem; }
[data-skin="techno"] .intro h1 { font-size: clamp(5rem, 10vw, 10rem); line-height: .95; }
[data-skin="techno"] .intro-bottom { display: block; padding: 0; }
[data-skin="techno"] .intro-copy { margin-top: 1.5rem; }
.techno-visual { position: absolute; inset: 0 0 0 48%; }
.techno-visual video { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.techno-visual::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #061116, transparent 40%), linear-gradient(0deg, #061116, transparent 30%); }
#motionToggle { position: absolute; z-index: 2; right: 1.5rem; bottom: 1.5rem; padding: .75rem 1rem; background: var(--paper); color: var(--ink); border: 1px solid var(--acid); cursor: pointer; }
[data-skin="techno"] .analysis-card { background: var(--surface); color: var(--ink); border: 1px solid var(--line); }
[data-skin="techno"] .dark-card .card-summary { color: var(--muted); }
[data-skin="techno"] .manifesto-band,
[data-skin="techno"] .experiments,
[data-skin="techno"] .about-strip,
[data-skin="techno"] .site-footer { background: var(--paper); color: var(--ink); border-top: 1px solid var(--line); }
[data-skin="techno"] .manifesto-band p:nth-child(2) { color: var(--ink); }
[data-skin="techno"] .about-strip .eyebrow,
[data-skin="techno"] .site-footer p,
[data-skin="techno"] .card-index,
[data-skin="techno"] .card-footer { color: var(--muted); opacity: 1; }
[data-skin="techno"] .site-header,
[data-skin="techno"] .intro,
[data-skin="techno"] .section-heading,
[data-skin="techno"] .lead-grid,
[data-skin="techno"] .lead-story,
[data-skin="techno"] .compact-story,
[data-skin="techno"] .experiment-row,
[data-skin="techno"] .archive-head,
[data-skin="techno"] .article-kicker,
[data-skin="techno"] .card-footer { border-color: var(--line); }
[data-skin="techno"] .brand-mark, [data-skin="techno"] .language-switcher :is(button,a).active { background: var(--acid); color: var(--paper); }
[data-skin="techno"] .brand-mark span { color: var(--paper); }
[data-skin="techno"] .appearance-bar button[aria-pressed="true"],
[data-skin="techno"] .skip-link,
[data-skin="techno"] .status:not(.status-muted) { background: var(--acid); color: var(--paper); }
[data-skin="techno"] .mobile-nav { background: var(--surface); color: var(--ink); }
[data-skin="techno"] .mobile-nav a { border-color: var(--line); }
[data-skin="techno"] .search-field input { color: var(--ink); caret-color: var(--acid); }
[data-skin="techno"] .search-field input::placeholder { color: var(--muted); opacity: 1; }
[data-skin="techno"] .search-dialog::backdrop { background: rgba(6,17,22,.85); }
[data-skin="techno"] .search-dialog, [data-skin="techno"] .search-panel { background: var(--paper); color: var(--ink); }
[data-skin="techno"] .article-body .callout { color: var(--ink); border-color: var(--acid); }
[data-skin="techno"] .article-body th { background: var(--surface); color: var(--ink); }
[data-skin="techno"] .article-body tbody tr:nth-child(even) { background: color-mix(in srgb, var(--surface) 72%, transparent); }
[data-skin="techno"] .daily-preview-copy,
[data-skin="techno"] .daily-preview-card,
[data-skin="techno"] .daily-edition-head,
[data-skin="techno"] .daily-minute,
[data-skin="techno"] .daily-radar,
[data-skin="techno"] .daily-sources { border-color: var(--line); }
[data-skin="techno"] .daily-signal { background: var(--surface); color: var(--ink); border: 1px solid var(--line); }
[data-skin="techno"] .daily-signal .eyebrow { color: var(--acid); }
[data-skin="techno"] .daily-teaser-image { background: var(--surface); }
[data-skin="techno"] .pinned-grid,
[data-skin="techno"] .pinned-story { border-color: var(--line); }
[data-skin="techno"] .pinned-story { background: var(--surface); }
[data-skin="techno"] .projects-head,
[data-skin="techno"] .project-program,
[data-skin="techno"] .project-program-head,
[data-skin="techno"] .project-program-context,
[data-skin="techno"] .project-data-boundary,
[data-skin="techno"] .project-assembly-foundation,
[data-skin="techno"] .project-assembly-next,
[data-skin="techno"] .project-assembly-module,
[data-skin="techno"] .projects-grid,
[data-skin="techno"] .project-card,
[data-skin="techno"] .project-hero,
[data-skin="techno"] .project-overview,
[data-skin="techno"] .project-architecture,
[data-skin="techno"] .project-architecture-flow,
[data-skin="techno"] .project-architecture-flow li,
[data-skin="techno"] .project-principles,
[data-skin="techno"] .project-principles dl,
[data-skin="techno"] .project-principles dl > div,
[data-skin="techno"] .project-relationship,
[data-skin="techno"] .project-capabilities,
[data-skin="techno"] .project-capabilities li,
[data-skin="techno"] .mnemon-learning,
[data-skin="techno"] .mnemon-learning-loop,
[data-skin="techno"] .mnemon-learning-loop li,
[data-skin="techno"] .mnemon-learning-rule { border-color: var(--line); }
[data-skin="techno"] .project-card { background: var(--surface); }
[data-skin="techno"] .project-program { background: var(--paper); }
[data-skin="techno"] .project-assembly-module { background: var(--surface); }
[data-skin="techno"] .project-assembly-module:hover,
[data-skin="techno"] .project-assembly-module:focus-visible { background: color-mix(in srgb, var(--surface) 78%, var(--acid)); }
[data-skin="techno"] .project-horizon { background: var(--surface); color: var(--ink); border-top: 1px solid var(--line); }
[data-skin="techno"] .project-horizon .eyebrow { color: var(--acid); opacity: 1; }
[data-skin="techno"] .project-card:hover,
[data-skin="techno"] .project-card:focus-visible { background: color-mix(in srgb, var(--surface) 78%, var(--acid)); }
[data-skin="techno"] .project-architecture-flow li,
[data-skin="techno"] .project-relationship .project-design-note,
[data-skin="techno"] .project-testing-rule,
[data-skin="techno"] .mnemon-learning-loop li { background: var(--surface); }
[data-skin="techno"] .project-row { border-color: var(--line); }
@media(max-width: 760px) {
  .appearance-bar { top: 66px; justify-content: space-between; }
  .appearance-bar button { padding-inline: .75rem; }
}
@media(max-width: 700px) {
  [data-skin="techno"] .intro { min-height: 0; padding-top: 1.5rem; }
  [data-skin="techno"] .intro > :not(.techno-visual) { max-width: 100%; }
  [data-skin="techno"] .intro h1 { font-size: clamp(4.5rem, 18vw, 7rem); }
  .techno-visual { position: relative; inset: auto; height: 420px; order: 4; margin: 2rem -1.25rem -4rem; }
  .techno-visual::after { background: linear-gradient(0deg, #061116, transparent 35%); }
}
@media(prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }