/* A project notebook: keep the original teal and type, let the actual work lead. */
.website {--bg:#f3f3ed;--text:#202b28;--quiet:#52605b;--link:#8f2632;--rule:#bfc8c1;background:var(--bg);color:var(--text);}
.website a {color:var(--link);}
.website .hero {height:auto;min-height:0;padding:100px var(--gutter) 36px;isolation:isolate;}
.website .site-top {position:absolute;top:0;left:0;width:100%;padding:24px var(--gutter);display:flex;align-items:center;gap:24px;z-index:2;}
.website .site-top a {color:white;}.site-kicker {font-size:13px;margin-right:auto;color:#def0e9;}
.switch-link {font:12px/1.5 var(--mono);text-underline-offset:4px;}
.website .hero .hero-eyebrow {font:16px/1.5 'Atkinson Hyperlegible Next',sans-serif;margin:0 0 10px;}
.website .hero h1 {font-size:clamp(3.3rem,6.6vw,6.5rem);line-height:.95;letter-spacing:-.045em;font-stretch:125%;}
.website .hero h1 span {display:inline-block;margin-right:.04em;}.website .hero h1 span:first-child {display:block;}
.website .hero>p[data-glass] {max-width:46em;font-size:clamp(1rem,1.4vw,1.15rem);margin-top:24px;line-height:1.6;}
.hero-bottom {display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:22px;position:relative;z-index:1;}
.website .hero-cta {display:inline-flex;gap:28px;align-items:center;background:#f0f3da;color:#14352d;padding:11px 16px;border:1px solid #f0f3da;font-size:14px;font-weight:600;text-decoration:none;}
.website .hero-aside {font:12px/1.5 var(--mono);color:#f0f4ef;text-underline-offset:4px;}
.website main {max-width:1340px;padding-top:42px;}
.website .dock {background:transparent;}.website .dock a {color:inherit;}.website .dock::before {background:rgb(var(--glass-fill) / 90%);}
.website .section-heading {display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:22px;}
.website h2 {position:static;font:650 clamp(1.4rem,2vw,1.8rem)/1.2 'Atkinson Hyperlegible Next',sans-serif;letter-spacing:-.02em;}
.website .section-heading>p,.collection-heading>p {font-size:14px;color:var(--quiet);margin:0;}
.featured-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;}
.website .project {display:flex;flex-direction:column;gap:15px;min-width:0;}.website .project+.project {margin-top:0;}.website .project>div:last-child {width:100%;}
.website .project img {width:100%;height:auto;aspect-ratio:16/10;object-fit:contain;border:1px solid var(--rule);border-radius:0;background:#e1e5df;}
.website h3 {font-size:1.35rem;letter-spacing:-.025em;margin:7px 0 8px;}
.website .project p {font-size:1rem;line-height:1.65;max-width:none;}.website .project .note {font-size:.8rem;line-height:1.6;color:var(--quiet);}
.project-meta {display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;justify-content:space-between;color:var(--quiet);font:11px/1.5 var(--mono);}
.project-meta .status {font-family:'Atkinson Hyperlegible Next',sans-serif;font-size:12px;}
.project-actions {display:flex;flex-wrap:wrap;gap:20px;margin-top:13px;}.project-actions:empty {display:none;}
.website .action {display:inline-flex;gap:6px;align-items:center;font-size:.9rem;text-underline-offset:4px;}
.featured-section {border-bottom:1px solid var(--rule);padding-bottom:38px;margin-bottom:40px;}.featured-grid .project-credit {display:none;}.featured-grid h3 {font-size:1.18rem;}.featured-grid .project p {font-size:.9rem;}
.collection-heading {margin-bottom:25px;}.collection-heading h2 {margin-bottom:9px;}.collection-heading h2 span {font:12px var(--mono);color:var(--quiet);vertical-align:middle;margin-left:8px;}
.project-controls {display:flex;flex-wrap:wrap;align-items:center;gap:14px;justify-content:space-between;border-block:1px solid var(--rule);padding:12px 0;margin-bottom:28px;}
.filter-list {display:flex;flex-wrap:wrap;gap:4px;}.filter-list button {background:transparent;color:var(--text);border:0;border-bottom:2px solid transparent;padding:9px 10px;font-size:13px;}
.filter-list button[aria-pressed="true"] {border-bottom-color:var(--link);color:var(--link);font-weight:700;}.filter-list button span {font-size:10px;margin-left:3px;}
.search-box {display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--quiet);width:210px;padding:3px;}.search-box span {font-size:24px;}.search-box input {min-width:0;width:100%;background:transparent;color:var(--text);border:0;font-size:14px;padding:6px 0;}
.website .group {display:block;padding:0 0 44px;border-top:0;scroll-margin-top:24px;}.website .group>h2 {font:600 15px/1.5 var(--mono);color:var(--quiet);margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid var(--rule);}
.project-grid,.website .plain {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 32px;}
.project-art {aspect-ratio:16/10;background:#e7e8df;width:100%;display:flex;align-items:center;justify-content:center;position:relative;color:#516358;border:1px solid var(--rule);}.project-art>span {font-size:4rem;}.project-art small {position:absolute;bottom:15px;left:18px;font:11px var(--mono);}
.website .about {margin:10px 0 35px;padding:35px 0;border-block:1px solid var(--rule);display:grid;grid-template-columns:1fr 3fr;gap:32px;}.website .about>h2 {font:650 1.8rem/1.2 'Atkinson Hyperlegible Next',sans-serif;border:0;color:var(--text);}.website .about p {font-size:1.05rem;max-width:42em;margin-bottom:16px;}.website .about address a {font-size:1.1rem;overflow-wrap:anywhere;}
.website footer {max-width:1340px;padding-bottom:110px;font-size:.75rem;}.website footer p {max-width:80em;}
.results-summary {color:var(--quiet);font:12px/1.6 var(--mono);margin:-10px 0 25px;}.empty-results {padding:25px 0 50px;}.empty-results button {padding:10px 16px;background:var(--text);color:var(--bg);border:0;}
@media(min-width:1500px) {.website .hero,.website .site-top {padding-inline:max(var(--gutter),calc((100vw - 1196px)/2));}}
@media(max-width:900px) {.featured-grid {gap:16px;}.featured-grid .project-meta>span:first-child {display:none;}}
@media(max-width:680px) {
 .website .hero {padding-top:88px;padding-bottom:28px;}.website .hero h1 {font-size:clamp(2.9rem,10.7vw,4.5rem);}.website .hero h1 span {display:block;}.website .site-top {gap:14px;padding-top:22px;}.site-kicker {font-size:11px;}.switch-link {font-size:10px;}.hero-aside {display:none;}
 .website main {padding-top:30px;}.website .section-heading {display:block;}.website .section-heading>p {margin-top:8px;}.featured-grid,.project-grid,.website .plain {grid-template-columns:1fr;gap:30px;}.featured-grid .project-meta>span:first-child {display:inline;}.website .about {grid-template-columns:1fr;gap:6px;}.website .dock a {padding:10px 14px;}.search-box {width:100%;}.filter-list button {padding:8px;}
}
@media(prefers-color-scheme:dark) {.website {--bg:#17201d;--text:#e4e8e2;--quiet:#acb9b1;--link:#f0a2a6;--rule:#49574f;}.website .project img {background:#243029;}.project-art {background:#26342b;color:#c2d6c7;}}
@media(forced-colors:active),(prefers-contrast:more) {.glass-on .hero canvas {display:none;}.glass-on .hero [data-glass] {-webkit-text-fill-color:currentColor;}.website .dock::before {opacity:1 !important;}}
/* Jump-to-project dialog (/ or Ctrl+K). */
.palette {width:min(560px,calc(100vw - 32px));max-height:min(70svh,560px);padding:0;border:1px solid var(--rule);background:var(--bg);color:var(--text);box-shadow:0 24px 60px rgb(0 0 0 / 30%);}
.palette::backdrop {background:rgb(14 31 31 / 45%);}
.palette-body {display:flex;flex-direction:column;max-height:inherit;}
.palette input {font-size:1.05rem;padding:16px 18px;border:0;border-bottom:1px solid var(--rule);background:transparent;color:inherit;}
.palette nav {overflow:auto;padding:6px;}
.palette a {display:flex;justify-content:space-between;gap:16px;padding:10px 12px;color:inherit;text-decoration:none;}
.palette a:hover,.palette a:focus-visible {background:color-mix(in srgb,var(--link) 14%,transparent);outline:0;}
.palette small {font:11px/1.9 var(--mono);color:var(--quiet);}
.palette-empty,.palette-hint {margin:0;padding:10px 18px;font:11px/1.5 var(--mono);color:var(--quiet);}.palette-hint {border-top:1px solid var(--rule);}
.palette {--bg:#f3f3ed;--text:#202b28;--quiet:#52605b;--link:#8f2632;--rule:#bfc8c1;}
@media(prefers-color-scheme:dark) {.palette {--bg:#17201d;--text:#e4e8e2;--quiet:#acb9b1;--link:#f0a2a6;--rule:#49574f;}}
/* Back-to-top link, shown once the page has scrolled where scroll timelines exist. */
.to-top {position:fixed;right:var(--gutter);bottom:max(26px,env(safe-area-inset-bottom));z-index:9;font:12px/1.5 var(--mono);color:var(--link);background:var(--bg);border:1px solid var(--rule);padding:7px 11px;text-decoration:none;}
@media(max-width:900px) {.to-top {display:none;}}
/* Scroll effects without a library: cards rise into view and a bar shows reading progress. */
@supports (animation-timeline: view()) {
  @media(prefers-reduced-motion:no-preference) {
    .website .project {animation:card-in linear both;animation-timeline:view();animation-range:entry 0% entry 55%;}
    body[data-view="website"]::after {content:"";position:fixed;inset:0 0 auto;height:3px;z-index:20;background:var(--red);transform-origin:0 50%;animation:read-progress linear both;animation-timeline:scroll(root);}
    .to-top {animation:to-top-in linear both;animation-timeline:scroll(root);animation-range:0 500px;}
  }
}
@keyframes card-in {from {opacity:0;translate:0 28px;}}
@keyframes read-progress {from {transform:scaleX(0);} to {transform:scaleX(1);}}
@keyframes to-top-in {from {opacity:0;visibility:hidden;} to {opacity:1;visibility:visible;}}
