.site-nav { display:flex; flex-wrap:wrap; gap:var(--space-6); font-size:var(--text-sm); }
.site-nav a,.footer-nav a { color:var(--muted); text-decoration:none; text-underline-offset:4px; }
.site-nav a:hover,.site-nav a[aria-current='page'],.footer-nav a:hover { color:var(--foreground); text-decoration:underline; }
.footer-nav { display:flex; flex-wrap:wrap; gap:var(--space-4) var(--space-6); width:100%; font-size:var(--text-sm); }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:var(--space-2); margin-bottom:var(--space-8); color:var(--muted); font-size:var(--text-sm); }
.breadcrumbs a { text-underline-offset:4px; }
.page-hero { padding-block:var(--space-12); max-width:900px; }
.page-hero h1 { font-size:clamp(2rem,5vw,3.7rem); max-width:22ch; }
.page-hero .lead { max-width:65ch; }
.platform-heading { display:flex; align-items:center; gap:var(--space-4); margin-bottom:var(--space-4); }
.platform-heading .eyebrow { margin:0; }
.platform-emblem { width:48px; height:48px; object-fit:contain; filter:brightness(0); }
:root[data-theme='dark'] .platform-emblem { filter:brightness(0) invert(1); }
.status-note { border-left:3px solid var(--primary); padding:var(--space-4) var(--space-6); background:var(--card); border-radius:var(--radius-sm); max-width:75ch; margin:var(--space-6) 0 0; }
.status-note p { margin:var(--space-2) 0 0; color:var(--muted); }
.status-note a { text-underline-offset:4px; }
.editorial-section { padding-block:var(--space-12); border-top:1px solid var(--border); }
.editorial-heading { display:flex; flex-wrap:wrap; gap:var(--space-4); align-items:baseline; justify-content:space-between; margin-bottom:var(--space-6); }
.editorial-heading a { color:var(--muted); font-size:var(--text-sm); text-underline-offset:4px; }
.teaser { display:grid; grid-template-columns:160px minmax(0,1fr); gap:var(--space-6); padding-block:var(--space-6); border-top:1px solid var(--border); }
.teaser .category { color:var(--primary); font-size:var(--text-sm); font-weight:600; }
.teaser h2,.teaser h3 { font-size:var(--text-lg); line-height:1.4; letter-spacing:-.02em; margin:0; }
.teaser h2 a,.teaser h3 a { text-decoration:none; }
.teaser h2 a:hover,.teaser h3 a:hover { text-decoration:underline; text-underline-offset:4px; }
.teaser p { color:var(--muted); margin:var(--space-2) 0 0; max-width:72ch; }
.byline { color:var(--muted); font-size:var(--text-sm); margin:var(--space-6) 0 0; }
.reading-layout { display:grid; grid-template-columns:minmax(0,760px) minmax(180px,260px); gap:var(--space-16); align-items:start; }
.prose { min-width:0; overflow-wrap:anywhere; }
.prose section { margin-bottom:var(--space-12); scroll-margin-top:var(--space-6); }
.prose h2 { font-size:var(--text-xl); margin-bottom:var(--space-4); }
.prose p { line-height:1.85; color:var(--muted); margin:0 0 var(--space-4); }
.prose a { color:var(--foreground); text-underline-offset:4px; }
.prose .faq { max-width:none; }
.toc { position:sticky; top:var(--space-6); padding-top:var(--space-2); font-size:var(--text-sm); }
.toc p { margin:0 0 var(--space-4); font-weight:600; }
.toc ol { margin:0; padding-left:var(--space-4); color:var(--muted); }
.toc li { margin-bottom:var(--space-3); }
.toc a { text-decoration:none; line-height:1.6; }
.toc a:hover { text-decoration:underline; text-underline-offset:4px; }
.source-list { padding-left:var(--space-6); color:var(--muted); font-size:var(--text-sm); line-height:1.8; }
.source-list li { margin-bottom:var(--space-2); }
.editorial-note { border-top:1px solid var(--border); padding-top:var(--space-6); color:var(--muted); font-size:var(--text-sm); line-height:1.7; }
.guide-cta { margin-block:var(--space-12); background:var(--card); padding:var(--space-8); border-radius:var(--radius); }
.guide-cta h2 { margin-bottom:var(--space-3); }
.guide-cta p { margin:0 0 var(--space-6); color:var(--muted); }
.guide-cta .primary { text-decoration:none; }
.platform-directory { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 var(--space-12); }
.directory-item { padding-block:var(--space-6); border-top:1px solid var(--border); }
.directory-item h2 { font-size:var(--text-md); }
.directory-item h2 a { text-underline-offset:4px; }
.directory-item p { color:var(--muted); font-size:var(--text-sm); margin:var(--space-2) 0 0; }
.directory-state { font-size:var(--text-xs); color:var(--primary); display:block; margin-bottom:var(--space-2); }
.access-help { margin-top:var(--space-6); padding:var(--space-6); border:1px solid var(--border); border-radius:var(--radius-sm); }
.access-help h2 { font-size:var(--text-md); }
.access-help p { color:var(--muted); font-size:var(--text-sm); line-height:1.7; }
.access-help .help-actions { display:flex; flex-wrap:wrap; gap:var(--space-4); align-items:center; }
.access-help a { font-size:var(--text-sm); text-underline-offset:4px; }
.access-help .primary { padding:var(--space-3) var(--space-4); }
.related-links { display:flex; flex-wrap:wrap; gap:var(--space-3) var(--space-6); padding:0; list-style:none; }
.related-links a { color:var(--muted); text-underline-offset:4px; }
.guide-figure { margin:0 0 var(--space-12); max-width:1000px; }
.guide-figure img { display:block; width:100%; height:auto; aspect-ratio:2/1; border-radius:var(--radius); }
.guide-figure figcaption { margin-top:var(--space-3); max-width:75ch; color:var(--muted); font-size:var(--text-sm); line-height:1.65; }
.guide-figure-compact { max-width:640px; margin-block:var(--space-8) var(--space-12); }
.illustrated-hero { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:var(--space-12); align-items:center; max-width:none; }
.hero-copy { min-width:0; }
.illustrated-hero .guide-figure { margin:0; }
.illustrated-hero h1 { font-size:clamp(2rem,4.5vw,3.35rem); }
.teaser-illustrated { grid-template-columns:240px minmax(0,1fr); align-items:center; }
.teaser-picture { display:block; }
.teaser-picture img { display:block; width:100%; height:auto; aspect-ratio:2/1; border-radius:var(--radius-sm); }
.teaser-illustrated .category { display:block; margin-bottom:var(--space-2); }
@media(max-width:960px) {
  .header { flex-wrap:wrap; }
  .site-nav { order:3; width:100%; }
  .illustrated-hero { grid-template-columns:minmax(0,1fr); gap:var(--space-8); }
  .illustrated-hero .guide-figure { max-width:640px; }
  .reading-layout { grid-template-columns:minmax(0,1fr); gap:var(--space-8); }
  .toc { position:static; order:-1; border-bottom:1px solid var(--border); padding-bottom:var(--space-6); }
}
@media(max-width:600px) {
  .header { flex-wrap:wrap; gap:var(--space-4); }
  .header .brand { flex:1; }
  .site-nav { order:3; width:100%; gap:var(--space-6); }
  .page-hero { padding-block:var(--space-8); }
  .page-hero h1 { font-size:clamp(2rem,8vw,2.7rem); }
  .illustrated-hero { gap:var(--space-6); }
  .illustrated-hero .hero-copy { display:contents; }
  .illustrated-hero .breadcrumbs { order:1; margin:0; }
  .illustrated-hero .platform-heading,.illustrated-hero .hero-copy > .eyebrow { order:2; margin:0; }
  .illustrated-hero h1 { order:3; margin:0; }
  .illustrated-hero .guide-figure { order:4; }
  .illustrated-hero .lead { order:5; }
  .illustrated-hero .status-note,.illustrated-hero .byline { order:6; margin:0; }
  .breadcrumbs { margin-bottom:var(--space-6); }
  .teaser { grid-template-columns:minmax(0,1fr); gap:var(--space-2); }
  .teaser-illustrated { gap:var(--space-4); }
  .guide-figure { margin-bottom:var(--space-8); }
  .platform-directory { grid-template-columns:minmax(0,1fr); }
  .guide-cta,.access-help { padding:var(--space-6); }
  .guide-cta .primary { white-space:normal; }
  .editorial-section { padding-block:var(--space-8); }
  .prose h2 { font-size:var(--text-lg); }
  .footer .hint { margin-left:0; }
}
.workflow-actions{grid-column:1/-1;border-top:1px solid var(--border);padding-top:var(--space-4);margin-top:var(--space-4);min-width:0}
.workflow-heading{font-weight:600;margin:0 0 var(--space-2)}.workflow-actions .hint{margin:0 0 var(--space-3)}
.workflow-actions nav{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-6)}.workflow-actions a{display:inline-block;white-space:normal}
.workflow-actions details{margin-top:var(--space-3)}.workflow-actions details a{margin:var(--space-3) var(--space-6) 0 0}
.workflow-actions summary{cursor:pointer}.workflow-actions a:focus-visible{outline:2px solid var(--ring);outline-offset:3px}
