@keyframes page-arrive { from { opacity:.94; transform:translateY(3px); } to { opacity:1; transform:none; } }
main { animation:page-arrive 180ms cubic-bezier(.23,1,.32,1); }
html[data-entry-mode=keyboard] main { animation:none; }
:root { --copper:#e4b678; --reading-width:680px; }
[hidden] { display:none !important; }
html { scroll-padding-top:110px; }
main:focus { outline:none; }
h1,h2,h3 { overflow-wrap:anywhere; }
.shell { width:min(1180px,calc(100% - 96px)); }
.site-header { z-index:50; }
.header-inner { height:82px; gap:24px; }
.wordmark { display:flex; align-items:baseline; white-space:nowrap; }
.wordmark small { margin-left:13px; font-weight:400; font-size:12px; letter-spacing:.05em; color:var(--muted); }
.site-nav { gap:27px; }
.site-nav a[aria-current=page]::after { transform:scaleX(1); }
.header-actions { gap:7px; }
.command-button { width:auto; border-radius:10px; gap:9px; padding:0 10px; }
.command-button svg { width:17px; height:17px; }
kbd { font:11px/1.2 var(--font); color:var(--muted); }
.site-feedback[data-visible=true] { opacity:1; transform:translate(-50%,0); }
.site-feedback { max-width:calc(100% - 32px); }
.site-footer { margin-top:72px; align-items:center; }
.site-footer nav { display:flex; gap:24px; flex-wrap:wrap; }
.site-footer a { font-size:12px; }
.intro { padding-top:52px; padding-bottom:72px; }
.intro .signal-panel { width:100%; }
.page-intro { padding-block:72px 50px; }
.page-context { font-size:13px; color:var(--muted); margin-bottom:21px; }
.page-intro h1 { font-size:clamp(48px,5vw,72px); line-height:1.22; letter-spacing:-.06em; font-weight:600; max-width:16em; text-wrap:balance; }
.page-intro>p:last-of-type { margin-top:26px; color:var(--muted); font-size:17px; line-height:1.95; max-width:42em; }
.page-quick-links { display:flex; gap:28px; margin-top:24px; color:var(--accent); font-size:14px; }
.home-section { padding-block:66px; }
.section-top { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-bottom:30px; }
.section-top h2 { font-size:32px; line-height:1.4; letter-spacing:-.045em; }
.section-top>a { color:var(--accent); display:inline-flex; align-items:center; gap:12px; font-size:14px; flex-shrink:0; min-height:44px; }
.section-top>a svg { width:17px; height:17px; }
.section-top>span { font-size:13px; color:var(--muted); }
.tag-list,.explore-tags { display:flex; flex-wrap:wrap; gap:7px; }
.tag { display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:5px; padding:3px 8px; font-size:11px; line-height:1.5; color:var(--muted); }
.tag { max-width:100%; overflow-wrap:anywhere; }
.content-badge { display:inline-block; padding:2px 7px; border:1px solid color-mix(in srgb,var(--copper) 38%,var(--line)); border-radius:4px; color:var(--muted); font-size:11px; line-height:1.6; white-space:nowrap; font-weight:400; }
.projects-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:54px 30px; }
.project-card { min-width:0; }
.project-cover { position:relative; display:block; aspect-ratio:3/2; border:1px solid var(--line); border-radius:17px; overflow:hidden; background:var(--surface); transition:transform 240ms var(--polish-ease),border-color 180ms,box-shadow 240ms; }
.project-cover img,.project-cover .concept-art { width:100%; height:100%; object-fit:contain; }
.project-cover:has(img) { background:#e8ebf0; }
.cover-badge { position:absolute; left:14px; bottom:13px; font-size:10px; line-height:1.6; border-radius:4px; padding:3px 7px; background:#141a23c7; color:#e9edf2; backdrop-filter:blur(8px); }
.project-card-copy { padding:22px 2px 0; }
.project-card-meta { display:flex; gap:12px; align-items:center; margin-bottom:12px; font-size:12px; color:var(--muted); }
.project-card h2 { font-size:28px; line-height:1.4; margin-bottom:14px; letter-spacing:-.035em; }
.project-card h2 span { display:block; font-size:19px; margin-top:4px; color:var(--muted); font-weight:400; letter-spacing:-.02em; }
.project-card-copy>p { color:var(--muted); font-size:15px; line-height:1.9; max-width:36em; margin-bottom:18px; }
.project-read { display:inline-flex; align-items:center; gap:12px; margin-top:16px; min-height:44px; color:var(--accent); font-size:13px; }
.project-read svg { width:17px; height:17px; }
.concept-art { background:#1b2430; color:#8bb8e8; }
.track-shadow { fill:none; stroke:#8bb8e80d; stroke-width:42px; }
.track-line { fill:none; stroke:#7d93ae; stroke-width:3; stroke-dasharray:8 7; }
.art-label { font:14px var(--font); fill:#aab4c2; }
.art-log { font:15px/1.6 ui-monospace,Consolas,monospace; }
.catalogue-section { padding-block:8px 44px; }
.catalogue-tools { display:flex; gap:20px; align-items:center; justify-content:space-between; }
.search-field { display:flex; gap:11px; align-items:center; min-width:0; width:min(540px,100%); padding:0 15px; height:50px; border:1px solid var(--line); border-radius:11px; background:var(--surface); }
.search-field:focus-within { outline:2px solid var(--accent); outline-offset:3px; }
.search-field svg { width:18px; height:18px; color:var(--muted); }
.search-field input { width:100%; min-width:0; font:inherit; font-size:14px; border:0; outline:none; color:var(--ink); background:none; }
.search-field input::placeholder { color:var(--faint); }
.catalogue-options { display:flex; align-items:center; gap:16px; flex-shrink:0; }
.catalogue-options>button { border:0; padding:8px 4px; min-height:44px; border-radius:5px; color:var(--muted); font-size:13px; background:none; }
.view-modes { display:flex; gap:3px; padding:4px; border:1px solid var(--line); border-radius:9px; background:var(--surface); }
.view-modes button,.filter-tags button { background:none; border:1px solid transparent; border-radius:6px; min-height:36px; padding:5px 11px; font-size:12px; color:var(--muted); transition:background-color 140ms,color 140ms,border-color 140ms; }
.view-modes button[aria-pressed=true],.filter-tags button[aria-pressed=true] { color:var(--ink); background:var(--accent-soft); border-color:color-mix(in srgb,var(--accent) 35%,var(--line)); }
.filter-tags { display:flex; align-items:start; flex-wrap:wrap; gap:8px; margin-top:18px; }
.filter-tags>button { border-color:var(--line); }
.more-tags { font-size:12px; color:var(--muted); }
.more-tags summary { min-height:36px; padding:5px 12px; cursor:pointer; }
.more-tags>div { display:flex; flex-wrap:wrap; gap:7px; max-width:580px; padding:8px 0; }
.more-tags button { border-color:var(--line); }
.result-count { color:var(--muted); font-size:12px; margin-block:24px; min-height:24px; }
.projects-grid[data-view=list] { grid-template-columns:1fr; gap:30px; }
.projects-grid[data-view=list] .project-card { display:grid; grid-template-columns:280px minmax(0,1fr); gap:30px; align-items:center; padding-bottom:30px; border-bottom:1px solid var(--line); }
.projects-grid[data-view=list] .project-card-copy { padding:0; }
.projects-grid[data-view=list] .project-cover { aspect-ratio:3/2; }
.projects-grid[data-view=list] h2 { margin-bottom:8px; }
.empty-state { padding:70px 24px; border:1px dashed var(--line); border-radius:16px; text-align:center; }
.empty-state h2 { font-size:24px; }
.empty-state p { color:var(--muted); margin-block:18px 24px; }
.empty-state button { background:var(--surface); border-color:var(--line); }
.journal-row { display:grid; grid-template-columns:155px minmax(0,1fr) 44px; gap:30px; align-items:start; padding-block:30px; border-top:1px solid var(--line); }
.journal-row-meta { display:flex; flex-direction:column; align-items:start; gap:13px; color:var(--muted); font-size:12px; padding-top:4px; }
.journal-row h2 { font-size:24px; line-height:1.5; margin-bottom:12px; letter-spacing:-.03em; }
.journal-row p { color:var(--muted); font-size:15px; line-height:1.9; max-width:44em; margin-bottom:15px; }
.journal-open { display:flex; justify-content:center; align-items:center; border:1px solid var(--line); border-radius:50%; width:44px; height:44px; color:var(--accent); transition:background 160ms,transform 160ms; }
.journal-open svg { width:18px; height:18px; }
.home-about { display:grid; grid-template-columns:1fr 1.1fr; gap:70px; margin-top:65px; padding-block:56px; border-top:1px solid var(--line); }
.home-about h2 { font-size:36px; line-height:1.5; max-width:10em; }
.home-about p { color:var(--muted); font-size:16px; line-height:1.95; }
.breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding-top:30px; color:var(--muted); font-size:12px; }
.breadcrumb>a { color:var(--accent); min-height:36px; display:inline-flex; align-items:center; }
.project-intro { display:grid; grid-template-columns:1fr 1.3fr; align-items:center; gap:64px; padding-block:38px 35px; }
.project-kicker { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:12px; margin-bottom:22px; }
.project-word { font-size:clamp(42px,4.6vw,64px); font-weight:600; letter-spacing:-.06em; line-height:1.2; margin-bottom:10px; }
.project-intro h1 { font-size:30px; letter-spacing:-.04em; }
.project-tagline { font-size:20px; line-height:1.6; margin-top:24px; color:var(--ink); }
.project-lead { font-size:15px; color:var(--muted); line-height:1.95; margin:18px 0 22px; max-width:32em; }
.detail-cover { position:relative; border:1px solid var(--line); overflow:hidden; border-radius:18px; background:#1b2430; }
.detail-cover img,.detail-cover .concept-art { aspect-ratio:3/2; object-fit:contain; }
.detail-cover:has(img) { background:#e8ebf0; }
.detail-cover figcaption { font-size:11px; line-height:1.7; padding:10px 16px; color:#aab4c2; background:#1b2430; }
.demo-disclosure { padding:16px 20px; border-left:2px solid var(--copper); background:var(--surface); border-radius:0 8px 8px 0; color:var(--muted); font-size:13px; line-height:1.8; }
.project-chapters { position:sticky; top:83px; z-index:20; margin-top:30px; border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--paper) 94%,transparent); backdrop-filter:blur(16px); }
.project-chapters nav { display:flex; gap:24px; overflow-x:auto; padding:10px 0; scrollbar-width:thin; }
.project-chapters a { min-height:40px; display:flex; align-items:center; flex-shrink:0; color:var(--muted); font-size:12px; }
.project-chapters a:hover { color:var(--accent); }
.story-section { display:grid; grid-template-columns:1fr 1.8fr; gap:80px; padding-block:58px; border-bottom:1px solid var(--line); scroll-margin-top:90px; }
.story-heading>span { color:var(--copper); font-size:12px; }
.story-heading h2 { font-size:29px; line-height:1.5; margin-top:12px; }
.story-copy { max-width:43em; }
.story-copy p,.story-copy li { color:var(--muted); font-size:16px; line-height:2; }
.story-copy p+p { margin-top:20px; }
.story-copy ul { margin-top:22px; padding-left:22px; }
.story-copy li { padding-left:4px; margin-block:10px; }
.system-section { padding-block:65px; }
.system-nodes { display:flex; align-items:stretch; gap:14px; margin-top:30px; }
.system-nodes button { flex:1; min-width:0; min-height:112px; border:1px solid var(--line); border-radius:13px; background:var(--surface); padding:20px 18px; text-align:left; transition:border-color 160ms,background-color 160ms; }
.system-nodes button>span { display:block; color:var(--muted); font-size:12px; margin-bottom:10px; }
.system-nodes button>strong { font-size:18px; line-height:1.5; font-weight:500; }
.system-nodes button[aria-pressed=true] { border-color:var(--accent); background:var(--accent-soft); }
.system-wire { display:flex; align-items:center; color:var(--faint); transition:color 160ms; }
.system-wire.is-active { color:var(--accent); }
.system-explanation { margin-top:23px; min-height:3.8em; color:var(--muted); font-size:15px; line-height:1.9; max-width:55em; }
.system-scope { font-size:12px; color:var(--faint); margin-top:15px; }
.related-section { padding-block:40px 20px; border-top:1px solid var(--line); }
.related-project-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; margin-block:30px; }
.related-project-links a { display:grid; grid-template-columns:1fr 18px; align-items:center; gap:8px; padding:22px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.related-project-links a span { grid-column:1/-1; color:var(--muted); font-size:12px; }
.related-project-links strong { font-size:17px; font-weight:500; }
.related-project-links svg { width:18px; height:18px; color:var(--accent); }
.article-header { padding-block:35px 52px; }
.article-meta { display:flex; flex-wrap:wrap; align-items:center; gap:18px; color:var(--muted); font-size:12px; margin-bottom:25px; }
.article-header h1 { max-width:20em; font-size:clamp(36px,3.9vw,54px); line-height:1.4; text-wrap:balance; letter-spacing:-.045em; }
.article-header>p:not(.article-disclosure) { max-width:44em; margin:26px 0 22px; font-size:17px; color:var(--muted); line-height:1.9; }
.article-header .article-disclosure { margin-top:24px; font-size:12px; color:var(--faint); }
.reading-layout { display:grid; grid-template-columns:215px minmax(0,var(--reading-width)); gap:65px; align-items:start; padding-bottom:70px; }
.reader-toc { position:sticky; top:112px; font-size:12px; }
.reader-toc>p { display:flex; justify-content:space-between; margin-bottom:17px; color:var(--faint); }
.reader-toc nav { display:grid; gap:5px; border-left:1px solid var(--line); }
.reader-toc a { display:block; padding:7px 0 7px 15px; color:var(--muted); border-left:2px solid transparent; margin-left:-1px; line-height:1.8; }
.reader-toc a[aria-current] { color:var(--accent); border-color:var(--accent); }
.reading-body { min-width:0; font-size:17px; line-height:2; color:var(--ink); overflow-wrap:anywhere; }
.reading-body>p { margin:0 0 26px; }
.reading-body h2 { margin:56px 0 24px; font-size:28px; line-height:1.5; scroll-margin-top:0; }
.reading-body h2:first-child { margin-top:0; }
.reading-body h3 { margin:38px 0 18px; font-size:21px; scroll-margin-top:0; }
.reading-body ul { padding-left:24px; margin:25px 0 32px; }
.reading-body li { padding-left:5px; margin:11px 0; }
.reading-body blockquote { margin:30px 0; padding:20px 25px; border-left:2px solid var(--copper); background:var(--surface); border-radius:0 9px 9px 0; }
.reading-body blockquote p { font-size:17px; line-height:1.9; }
.reading-body blockquote cite { display:block; color:var(--muted); font-style:normal; font-size:12px; margin-top:12px; }
.code-block { margin:28px 0 36px; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#1b2430; color:#e9edf2; }
.code-toolbar { display:flex; align-items:center; justify-content:space-between; padding:8px 17px; border-bottom:1px solid #334254; color:#aab4c2; font-size:11px; }
.code-toolbar button { min-height:36px; padding:5px 10px; border:1px solid #43556f; border-radius:6px; color:#d7e5f6; background:none; font-size:12px; }
.code-toolbar button[data-state=success] { border-color:#8bb8e8; }
.code-toolbar button[data-state=error] { border-color:#e4b678; }
.code-block pre { margin:0; padding:23px 20px; overflow-x:auto; font:13px/1.95 ui-monospace,Consolas,monospace; tab-size:2; }
.code-copy-fallback { padding:15px; font-size:12px; color:#e4b678; }
.code-copy-fallback textarea { display:block; width:100%; margin-top:10px; font:13px/1.7 ui-monospace,Consolas,monospace; border:1px solid #8bb8e8; border-radius:7px; padding:12px; background:#141a23; color:#e9edf2; }
.reading-figure { margin:35px 0; border:1px solid var(--line); border-radius:12px; background:var(--surface); overflow:hidden; }
.article-diagram { display:block; width:100%; height:auto; padding:16px; }
.reading-figure figcaption { padding:0 20px 16px; color:var(--muted); font-size:12px; line-height:1.8; }
.diagram-grid { fill:none; stroke:var(--line); stroke-width:1; }
.diagram-signal { fill:none; stroke:var(--accent); stroke-width:3; }
.diagram-label { font:15px var(--font); fill:var(--muted); }
.diagram-node { fill:var(--surface); stroke:var(--line); stroke-width:1.5; }
.article-end { margin-top:60px; padding-top:30px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; }
.article-end>span { color:var(--accent); font-size:26px; }
.article-end a { color:var(--accent); display:inline-block; margin-top:18px; }
.about-intro h1 { max-width:12em; }
.about-editorial { display:grid; grid-template-columns:1fr 1.15fr; gap:90px; padding-block:20px 75px; align-items:center; }
.about-glyph { padding:42px; border:1px solid var(--line); border-radius:18px; background:var(--surface); }
.about-glyph>span { font-size:80px; line-height:1; font-weight:600; letter-spacing:-.08em; }
.about-glyph svg { margin-block:24px; width:100%; color:var(--accent); }
.about-glyph small { color:var(--muted); font-size:12px; }
.about-long-copy p { color:var(--muted); font-size:16px; line-height:2; }
.about-long-copy p+p { margin-top:24px; }
.learning-route { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; }
.learning-route article { border-top:1px solid var(--line); padding-top:20px; }
.learning-route article>span { font-size:12px; color:var(--copper); }
.learning-route h3 { font-size:22px; margin:20px 0 16px; }
.learning-route p { font-size:15px; line-height:1.95; color:var(--muted); }
.about-tools { padding-block:40px 70px; }
.about-tools h2 { margin-bottom:27px; font-size:27px; }
.about-tools .tag { font-size:13px; padding:6px 12px; }
.contact-note { padding:40px 0 10px; border-top:1px solid var(--line); }
.contact-note h2 { font-size:32px; margin-bottom:20px; }
.contact-note p { max-width:40em; color:var(--muted); line-height:1.95; }
.lab-signal-layout { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:80px; padding-block:90px; border-top:1px solid var(--line); }
.lab-signal-layout>div>h2 { font-size:40px; line-height:1.45; margin-bottom:25px; }
.lab-signal-layout>div>p:not(.page-context) { max-width:30em; color:var(--muted); font-size:16px; line-height:1.95; }
.lab-reading { padding-block:30px; }
.lab-reading>h2 { font-size:30px; margin-bottom:30px; }
.not-found { padding-block:70px 120px; }
.error-number { color:var(--accent); font-size:110px; letter-spacing:-.07em; font-weight:600; line-height:1.2; margin-bottom:30px; }
.not-found h1 { font-size:40px; }
.not-found>p:not(.error-number) { margin-top:25px; color:var(--muted); max-width:38em; }
.command-dialog { width:min(640px,calc(100% - 32px)); max-height:min(75dvh,760px); border:1px solid var(--line); border-radius:18px; padding:22px; background:var(--surface); color:var(--ink); box-shadow:0 30px 100px #00000035; }
.command-dialog::backdrop { background:#0c132278; backdrop-filter:blur(8px); }
body.command-open { overflow:hidden; }
.command-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:15px; }
.command-header h2 { font-size:20px; }
.command-header form { margin:0; }
#command-search { width:100%; min-height:50px; border:1px solid var(--line); border-radius:10px; padding:10px 15px; background:var(--paper); color:var(--ink); font:inherit; font-size:15px; }
#command-search:focus { outline:2px solid var(--accent); outline-offset:2px; }
#command-count { color:var(--muted); font-size:12px; margin:15px 0 10px; }
.command-results { max-height:42dvh; overflow-y:auto; padding:3px; }
.command-results a { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:12px; border-radius:8px; font-size:14px; }
.command-results a:hover,.command-results a:focus-visible { background:var(--accent-soft); }
.command-results svg { width:16px; height:16px; color:var(--accent); }
.command-hint,#command-empty { color:var(--muted); font-size:12px; margin-top:15px; }
html[data-reveal-ready=true] [data-reveal] { opacity:0; transform:translateY(8px); transition:opacity 280ms ease,transform 300ms var(--polish-ease); }
html[data-reveal-ready=true] [data-reveal].is-revealed,html[data-reveal-ready=true] [data-reveal]:focus-within { opacity:1; transform:none; }
@media (hover:hover) and (pointer:fine) {
  .project-cover:hover { transform:translateY(-3px); border-color:var(--accent); box-shadow:0 18px 40px #00000013; }
  .journal-open:hover { background:var(--accent-soft); transform:translate(1px,-1px); }
  .project-card h2 a:hover,.journal-row h2 a:hover { color:var(--accent); }
  .filter-tags button:hover { border-color:var(--accent); }
}
@media (max-width:1080px) {
  .shell { width:calc(100% - 64px); }
  .wordmark small { display:none; }
  .header-inner { gap:18px; }
  .site-nav { gap:22px; }
  .reading-layout { grid-template-columns:185px minmax(0,1fr); gap:40px; }
  .project-intro { gap:38px; grid-template-columns:1fr 1.15fr; }
  .story-section { gap:45px; grid-template-columns:1fr 1.65fr; }
  .lab-signal-layout { gap:45px; }
  .journal-row { grid-template-columns:135px minmax(0,1fr) 44px; gap:24px; }
  .about-editorial { gap:50px; }
}
@media (max-width:900px) {
  .header-inner { height:74px; }
  .menu-button { display:flex; }
  .header-actions { margin-left:auto; }
  .site-nav { position:absolute; top:74px; left:24px; right:24px; margin:0; padding:14px 20px; display:flex; flex-direction:column; align-items:stretch; gap:0; visibility:hidden; pointer-events:none; opacity:0; transform:translateY(-6px); border:1px solid var(--line); border-radius:13px; background:var(--surface); box-shadow:0 14px 40px #00000018; transition:opacity 150ms,transform 180ms var(--polish-ease),visibility 0s 180ms; }
  .site-nav.is-open { opacity:1; visibility:visible; pointer-events:auto; transform:none; transition-delay:0s; }
  .site-nav a { padding:9px 4px; min-height:46px; }
  .site-nav a::after { display:none; }
  .site-nav a[aria-current=page] { color:var(--accent); }
  .project-chapters { top:75px; }
  .reading-layout { grid-template-columns:1fr; gap:35px; max-width:760px; }
  .reader-toc { position:static; border:1px solid var(--line); border-radius:12px; padding:20px; }
  .reader-toc nav { grid-template-columns:repeat(2,minmax(0,1fr)); display:grid; border:0; }
  .reader-toc>p { max-width:200px; }
  .reading-body { max-width:var(--reading-width); }
}
@media (max-width:760px) {
  html { scroll-padding-top:96px; }
  .shell { width:calc(100% - 40px); }
  .header-actions { gap:3px; }
  .command-button kbd { display:none; }
  .command-button { width:40px; padding:0; }
  .wordmark { font-size:27px; }
  .page-intro { padding-block:45px 36px; }
  .page-intro h1 { font-size:clamp(39px,8vw,58px); line-height:1.3; }
  .page-intro>p:last-of-type { font-size:16px; line-height:1.9; margin-top:22px; }
  .page-context { margin-bottom:18px; }
  .intro { padding-block:32px 45px; }
  .home-section { padding-block:42px; }
  .section-top { display:block; margin-bottom:25px; }
  .section-top h2 { font-size:27px; max-width:15em; }
  .section-top>a { margin-top:10px; }
  .section-top>span { display:block; margin-top:12px; }
  .projects-grid { grid-template-columns:1fr; gap:40px; }
  .project-card h2 { font-size:27px; }
  .project-card h2 span { font-size:19px; }
  .project-card-copy>p { font-size:15px; }
  .project-card-copy { padding-top:19px; }
  .project-cover { border-radius:13px; }
  .catalogue-tools { flex-direction:column; align-items:stretch; gap:13px; }
  .search-field { width:100%; }
  .catalogue-options { justify-content:space-between; }
  .filter-tags { gap:6px; }
  .filter-tags button { min-height:40px; }
  .projects-grid[data-view=list] .project-card { grid-template-columns:105px minmax(0,1fr); gap:17px; align-items:start; }
  .projects-grid[data-view=list] .project-cover { aspect-ratio:1; }
  .projects-grid[data-view=list] .cover-badge { display:none; }
  .projects-grid[data-view=list] .project-card-meta { margin-bottom:9px; flex-wrap:wrap; gap:7px; }
  .projects-grid[data-view=list] h2 { font-size:23px; }
  .projects-grid[data-view=list] h2 span { font-size:16px; }
  .projects-grid[data-view=list] .project-card-copy>p { font-size:13px; }
  .projects-grid[data-view=list] .tag-list { display:none; }
  .projects-grid[data-view=list] .project-read { margin-top:5px; }
  .journal-row { grid-template-columns:minmax(0,1fr) 40px; gap:15px; padding-block:25px; }
  .journal-row-meta { grid-column:1/-1; flex-direction:row; align-items:center; gap:14px; }
  .journal-row h2 { font-size:22px; }
  .journal-row p { font-size:15px; }
  .journal-open { width:40px; height:40px; }
  .home-about { grid-template-columns:1fr; gap:25px; margin-top:35px; padding-block:38px; }
  .home-about h2 { font-size:30px; max-width:12em; }
  .home-about p { font-size:16px; }
  .site-footer { margin-top:45px; align-items:start; gap:16px; }
  .site-footer nav { gap:5px 17px; justify-content:flex-end; }
  .site-footer p { max-width:11em; }
  .site-footer p>span { margin:5px 0 0; }
  .project-intro { grid-template-columns:1fr; gap:30px; padding-block:25px 28px; }
  .project-word { font-size:52px; }
  .project-intro h1 { font-size:28px; }
  .project-tagline { margin-top:20px; font-size:20px; }
  .project-lead { max-width:none; font-size:16px; }
  .demo-disclosure { font-size:12px; padding:15px; }
  .project-chapters { margin-top:25px; }
  .project-chapters nav { gap:22px; }
  .story-section { grid-template-columns:1fr; gap:20px; padding-block:36px; }
  .story-heading h2 { font-size:26px; margin-top:8px; }
  .story-copy p,.story-copy li { font-size:16px; line-height:1.95; }
  .system-section { padding-block:45px; }
  .system-nodes { flex-direction:column; gap:9px; }
  .system-nodes button { min-height:92px; padding:16px 20px; }
  .system-wire { align-self:center; transform:rotate(90deg); height:20px; }
  .related-project-links { grid-template-columns:1fr; gap:15px; }
  .related-section { padding-top:35px; }
  .article-header { padding-block:25px 36px; }
  .article-meta { gap:13px; margin-bottom:21px; }
  .article-header h1 { font-size:33px; line-height:1.45; }
  .article-header>p:not(.article-disclosure) { font-size:16px; }
  .reading-layout { padding-bottom:42px; }
  .reader-toc nav { grid-template-columns:1fr; }
  .reader-toc { padding:17px; }
  .reading-body { font-size:16px; line-height:2; }
  .reading-body h2 { font-size:25px; margin-top:43px; }
  .reading-body h3 { font-size:21px; }
  .reading-body blockquote { padding:18px; }
  .code-block pre { font-size:12px; padding:18px 15px; }
  .article-diagram { padding:7px; }
  .about-editorial { grid-template-columns:1fr; gap:30px; padding-block:5px 35px; }
  .about-glyph { padding:30px; }
  .about-glyph svg { height:150px; }
  .about-long-copy p { font-size:16px; }
  .learning-route { grid-template-columns:1fr; gap:30px; }
  .learning-route h3 { margin-block:15px 12px; }
  .about-tools { padding-block:28px 43px; }
  .about-tools h2 { font-size:25px; line-height:1.6; }
  .contact-note h2 { font-size:28px; }
  .lab-signal-layout { grid-template-columns:1fr; gap:30px; padding-block:45px; }
  .lab-signal-layout>div>h2 { font-size:34px; }
  .lab-signal-layout>div>p:not(.page-context) { max-width:none; }
  .lab-reading>h2 { font-size:27px; }
  .not-found { padding-block:50px 80px; }
  .not-found h1 { font-size:30px; }
  .command-dialog { padding:18px; }
}
@media (max-width:360px) {
  .shell { width:calc(100% - 32px); }
  .site-footer { flex-direction:column; }
  .site-footer p { max-width:none; }
  .site-footer nav { justify-content:flex-start; }
  .article-header h1 { font-size:29px; }
  .projects-grid[data-view=list] .project-card { grid-template-columns:85px minmax(0,1fr); gap:13px; }
}
@media (prefers-reduced-motion:reduce) {
  main { animation:none; }
  html[data-reveal-ready] [data-reveal] { opacity:1; transform:none; }
  .project-cover:hover,.journal-open:hover { transform:none; }
}