@font-face { font-family: "System Serif"; src: local("Iowan Old Style"), local("Palatino Linotype"), local("Book Antiqua"); }
:root { --paper:#ece9df; --paper-bright:#f8f6ee; --ink:#171715; --muted:#6f6b62; --line:rgba(23,23,21,.23); --orange:#f05232; --acid:#d9ff43; --violet:#b3a3ff; --ease:cubic-bezier(.2,.82,.2,1); color-scheme:light; font-family:Arial,Helvetica,sans-serif; font-synthesis:none; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--paper); color:var(--ink); margin:0; min-width:320px; overflow-x:hidden; transition:background-color 600ms var(--ease),color 600ms var(--ease); }
body::after { background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E"); content:""; inset:0; opacity:.09; pointer-events:none; position:fixed; z-index:80; }
button,a,input { -webkit-tap-highlight-color:transparent; font:inherit; }
button { color:inherit; }
:focus-visible { outline:3px solid currentColor; outline-offset:4px; }
[hidden] { display:none!important; }
.skip-link { background:var(--acid); color:#111; font-size:.72rem; font-weight:700; left:1rem; letter-spacing:.08em; padding:.8rem 1rem; position:fixed; text-transform:uppercase; top:-5rem; z-index:100; }
.skip-link:focus { top:1rem; }
.sr-only,.gallery-help { clip:rect(0,0,0,0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }
#spatial-scene { height:100%; inset:0; opacity:0; pointer-events:none; position:fixed; transition:opacity 700ms var(--ease); width:100%; z-index:0; }
.page-shell { margin:0 auto; max-width:1720px; padding:0 clamp(18px,3.2vw,54px); position:relative; z-index:1; }
.masthead { align-items:center; border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr auto 1fr; min-height:102px; transition:border-color 500ms var(--ease); }
.wordmark { align-items:center; color:inherit; display:inline-flex; font-size:.68rem; font-weight:700; letter-spacing:.13em; line-height:.95; text-decoration:none; text-transform:uppercase; width:fit-content; }
.wordmark-mark { display:grid; gap:2px; grid-template-columns:repeat(3,5px); margin-right:12px; transform:skewY(-16deg); }
.wordmark-mark i { background:currentColor; display:block; height:25px; }
.wordmark-mark i:nth-child(2) { height:18px; margin-top:4px; }
.wordmark-mark i:nth-child(3) { height:11px; margin-top:7px; }
.view-switcher { align-items:center; display:flex; gap:13px; }
.view-label,.edition,.section-heading,footer,.module-kicker,.detail-tags,.interaction-note { font-size:.62rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.view-label { color:var(--muted); }
.view-options { background:rgba(255,255,255,.38); border:1px solid var(--line); border-radius:999px; display:flex; padding:3px; }
.view-options button { align-items:center; background:transparent; border:0; border-radius:999px; cursor:pointer; display:flex; font-size:.63rem; font-weight:700; gap:7px; letter-spacing:.08em; padding:8px 13px; text-transform:uppercase; transition:background-color 250ms,color 250ms; }
.view-options button[aria-pressed="true"] { background:var(--ink); color:var(--paper-bright); }
.view-icon { display:inline-block; height:9px; position:relative; width:9px; }
.icon-editorial { border:1px solid currentColor; }
.icon-editorial::after { border-top:1px solid currentColor; content:""; left:1px; position:absolute; right:1px; top:3px; }
.icon-spatial { border:1px solid currentColor; transform:rotate(30deg) skewY(-15deg) scale(.8); }
.edition { justify-self:end; }
.edition span { color:var(--orange); padding:0 .35rem; }
.intro { align-items:end; display:grid; gap:clamp(36px,8vw,150px); grid-template-columns:minmax(0,1.55fr) minmax(270px,.55fr); padding:clamp(58px,8vw,124px) 0 clamp(58px,7vw,104px); }
.eyebrow { font-size:.67rem; font-weight:700; letter-spacing:.15em; margin:0 0 26px; text-transform:uppercase; }
.intro h1 { font-family:"System Serif",Georgia,serif; font-size:clamp(4.4rem,9vw,9.5rem); font-weight:400; letter-spacing:-.075em; line-height:.75; margin:0; }
.intro h1 em { color:var(--orange); font-weight:400; }
.intro-copy { font-family:"System Serif",Georgia,serif; font-size:clamp(1.06rem,1.45vw,1.32rem); line-height:1.52; margin:0; max-width:440px; }
.interaction-note { border-top:1px solid var(--line); margin:30px 0 0; padding-top:13px; }
.interaction-note span { color:var(--orange); font-size:.9rem; margin-right:8px; }
.section-heading { align-items:center; border-bottom:1px solid var(--line); display:flex; gap:24px; justify-content:space-between; padding-bottom:14px; }
.section-heading h2,.section-heading p { font:inherit; margin:0; }
.collection-tools { align-items:center; display:flex; gap:clamp(18px,3vw,48px); }
.collection-count { color:var(--muted); white-space:nowrap; }
.collection-count span:last-child { color:var(--orange); font-size:1rem; margin-left:.5rem; }
.density-control { align-items:center; background:var(--ink); border-radius:999px; color:var(--paper-bright); display:grid; gap:10px; grid-template-columns:auto clamp(92px,11vw,160px) 24px; padding:9px 13px 9px 16px; }
.density-control label { letter-spacing:.12em; }
.density-control input { accent-color:var(--acid); cursor:ew-resize; margin:0; min-width:0; width:100%; }
.density-control output { align-items:center; background:var(--acid); border-radius:50%; color:#171715; display:flex; font-size:.68rem; height:24px; justify-content:center; letter-spacing:0; width:24px; }
.gallery { --columns:5; --gap:clamp(7px,.72vw,12px); display:grid; gap:var(--gap); grid-auto-flow:dense; grid-auto-rows:clamp(92px,calc(42vw / var(--columns)),166px); grid-template-columns:repeat(var(--columns),minmax(0,1fr)); padding:var(--gap) 0 clamp(70px,8vw,120px); perspective:1500px; position:relative; transition:perspective 600ms var(--ease); }
.module { grid-column:span 1; grid-row:span 2; min-height:0; position:relative; }
.module.format-compact { grid-row:span 1; }
.module.format-tall { grid-row:span 3; }
.module.format-wide { grid-column:span 2; grid-row:span 2; }
.module.format-feature { grid-column:span 2; grid-row:span 3; }
.module-inner { background:var(--paper-bright); display:flex; flex-direction:column; height:100%; min-height:0; overflow:hidden; position:relative; transform:translateZ(0); transition:box-shadow 450ms var(--ease),filter 350ms var(--ease),transform 600ms var(--ease); }
.module-trigger { background:transparent; border:0; cursor:pointer; display:flex; flex:1; flex-direction:column; min-height:0; padding:0; text-align:left; width:100%; }
.module-trigger:focus-visible { outline:none; }
.module:has(.module-trigger:focus-visible) .module-inner { outline:3px solid currentColor; outline-offset:4px; z-index:4; }
.module-art { display:block; flex:1; min-height:0; overflow:hidden; position:relative; }
.module-art::after { border:1px solid rgba(255,255,255,.34); content:""; inset:10px; mix-blend-mode:overlay; pointer-events:none; position:absolute; }
.art-grain { background:repeating-linear-gradient(115deg,transparent 0 11px,rgba(255,255,255,.12) 12px,transparent 13px 25px); inset:0; mix-blend-mode:overlay; position:absolute; }
.art-caption { bottom:15px; color:rgba(255,255,255,.9); font-size:clamp(.46rem,.48vw,.56rem); font-weight:700; left:16px; letter-spacing:.13em; max-width:calc(100% - 32px); position:absolute; text-transform:uppercase; z-index:2; }
.module-meta { align-items:center; background:var(--paper-bright); display:flex; flex:0 0 auto; gap:.6rem; justify-content:space-between; min-height:64px; padding:11px clamp(11px,1vw,18px); }
.module-title { display:inline-block; font-family:"System Serif",Georgia,serif; font-size:clamp(.9rem,1.15vw,1.3rem); line-height:.94; }
.type-italic .module-title { font-style:italic; }
.type-mono .module-title { font-family:"Courier New",monospace; font-size:clamp(.79rem,1vw,1.12rem); letter-spacing:-.06em; text-transform:uppercase; }
.type-display .module-title { font-family:Arial,Helvetica,sans-serif; font-size:clamp(.84rem,1.08vw,1.2rem); font-weight:800; letter-spacing:-.055em; text-transform:uppercase; }
.type-sans .module-title { font-family:Arial,Helvetica,sans-serif; font-size:clamp(.86rem,1.08vw,1.22rem); font-weight:500; }
.module-type { color:#706e67; display:inline-block; font-size:.5rem; font-weight:700; letter-spacing:.1em; margin-top:6px; text-transform:uppercase; }
.module-number { border:1px solid currentColor; border-radius:50%; display:grid; flex:0 0 auto; font-size:.54rem; height:27px; place-items:center; width:27px; }
.gallery.has-peek .module.is-neighbor { grid-column:span 1; grid-row:span 1; }
.gallery.has-peek .module.is-peek { grid-row:span 4; z-index:3; }
.gallery.has-peek .module:not(.is-peek) .module-inner { filter:saturate(.68) contrast(.94); }
.gallery.has-peek .module.is-peek .module-inner { box-shadow:0 28px 70px rgba(22,20,16,.2); }
.gallery.has-open .module:not(.is-open) { grid-column:span 1; grid-row:span 1; }
.gallery.has-open .module:not(.is-open) .module-meta { min-height:53px; }
.gallery.has-open .module:not(.is-open) .module-type { display:none; }
.module.is-open { grid-column:1 / -1!important; grid-row:span 5!important; min-height:min(780px,84vh); z-index:5; }
.module.is-open .module-inner { box-shadow:0 32px 90px rgba(22,20,16,.2); }
.module.is-open .module-trigger { display:none; }
.module-detail { background:var(--paper-bright); height:100%; overflow:hidden; padding:clamp(18px,2.2vw,34px); }
.back-button { align-items:center; background:transparent; border:0; cursor:pointer; display:flex; font-size:.65rem; font-weight:700; gap:12px; letter-spacing:.11em; margin:0 0 clamp(18px,2vw,30px); padding:7px 2px; text-transform:uppercase; }
.back-button span { font-size:1rem; transition:transform 200ms; }
.back-button:hover span { transform:translateX(-4px); }
.detail-layout { display:grid; gap:clamp(32px,5vw,88px); grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); height:calc(100% - 52px); }
.detail-visual { min-height:440px; overflow:hidden; position:relative; }
.detail-visual .module-art { height:100%; }
.detail-copy { align-self:center; padding-right:clamp(0px,3vw,48px); }
.module-kicker { color:#706e67; margin:0 0 24px; }
.detail-copy h3 { font-family:"System Serif",Georgia,serif; font-size:clamp(4rem,7.8vw,8.8rem); font-weight:400; letter-spacing:-.08em; line-height:.72; margin:0; }
.detail-description { font-family:"System Serif",Georgia,serif; font-size:clamp(1.08rem,1.45vw,1.34rem); line-height:1.5; margin:clamp(25px,3vw,42px) 0; max-width:550px; }
.detail-tags { display:flex; flex-wrap:wrap; gap:7px; list-style:none; margin:0 0 clamp(28px,4vw,48px); padding:0; }
.detail-tags li { border:1px solid rgba(21,21,21,.25); border-radius:999px; padding:7px 10px; }
.detail-actions { border-top:1px solid rgba(21,21,21,.2); display:grid; }
.detail-actions a { align-items:center; border-bottom:1px solid rgba(21,21,21,.2); color:inherit; display:flex; font-size:.72rem; font-weight:700; justify-content:space-between; letter-spacing:.12em; padding:17px 1px; text-decoration:none; text-transform:uppercase; }
.detail-actions a span { color:var(--orange); font-size:1rem; }
.module.is-open .detail-visual,.module.is-open .module-kicker,.module.is-open .detail-copy h3,.module.is-open .detail-description,.module.is-open .detail-tags,.module.is-open .detail-actions { animation:reveal-detail 650ms both var(--ease); }
.module.is-open .module-kicker { animation-delay:60ms; }
.module.is-open .detail-copy h3 { animation-delay:110ms; }
.module.is-open .detail-description { animation-delay:170ms; }
.module.is-open .detail-tags { animation-delay:220ms; }
.module.is-open .detail-actions { animation-delay:270ms; }
@keyframes reveal-detail { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
/* Thirty distinct, layered artwork treatments. */
.art-signal { background:#ed5637; }
.art-signal::before,.art-signal .shape::after { border:1px solid rgba(255,245,219,.78); border-radius:50%; content:""; inset:8%; position:absolute; }
.art-signal .shape { background:#171717; border-radius:50%; height:24%; left:38%; position:absolute; top:36%; width:24%; }
.art-signal .shape::before { background:conic-gradient(from 45deg,transparent 0 12%,#fff4d5 12.5% 13%,transparent 13.5% 37%,#fff4d5 37.5% 38%,transparent 38.5% 62%,#fff4d5 62.5% 63%,transparent 63.5% 87%,#fff4d5 87.5% 88%,transparent 88.5%); content:""; inset:-180%; position:absolute; }
.art-signal .shape::after { inset:-72%; }
.art-atlas { background:#3157dc; }
.art-atlas::before { background-image:linear-gradient(rgba(255,255,255,.23) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.23) 1px,transparent 1px); background-size:18% 18%; content:""; inset:-20%; position:absolute; transform:rotate(-9deg); }
.art-atlas .shape { border:clamp(7px,.75vw,12px) solid #f1efdc; border-radius:49% 51% 42% 58%; height:62%; left:22%; position:absolute; top:17%; transform:rotate(17deg); width:56%; }
.art-atlas .shape::after { background:var(--acid); border-radius:50%; box-shadow:-90px 76px 0 -4px #f1efdc; content:""; height:18px; position:absolute; right:-14px; top:16%; width:18px; }
.art-relay { background:var(--acid); }
.art-relay::before { background:repeating-radial-gradient(circle at 50% 50%,transparent 0 14px,#191919 15px 16px); content:""; inset:-25%; position:absolute; }
.art-relay .shape { background:#151515; height:76%; left:47%; position:absolute; top:12%; transform:rotate(25deg); width:6%; }
.art-relay .art-caption,.art-ledger .art-caption,.art-loom .art-caption,.art-index .art-caption,.art-kiln .art-caption,.art-interval .art-caption,.art-pollen .art-caption,.art-measure .art-caption,.art-vessel .art-caption { color:#171715; }
.art-ledger { background:#dfd8c7; }
.art-ledger::before { color:#111; content:"A\A  B\A   C"; font-family:Georgia,serif; font-size:clamp(4rem,9vw,10rem); font-style:italic; left:9%; line-height:.58; position:absolute; top:13%; white-space:pre; }
.art-ledger .shape { border-bottom:1px solid #111; border-top:1px solid #111; bottom:11%; left:7%; position:absolute; right:7%; top:11%; }
.art-orbit { background:#171717; }
.art-orbit::before { background:radial-gradient(circle at 35% 31%,#fff 0 2%,#b2a1ff 22%,#503cba 58%,#141414 61%); border-radius:50%; box-shadow:0 0 80px rgba(178,161,255,.5); content:""; height:68%; left:23%; position:absolute; top:16%; width:54%; }
.art-orbit .shape { border:1px solid rgba(255,255,255,.65); border-radius:50%; height:29%; left:8%; position:absolute; top:35%; transform:rotate(-12deg); width:84%; }
.art-commons { background:#006d55; }
.art-commons::before,.art-commons .shape::before,.art-commons .shape::after { border:2px solid #f3eedc; border-radius:50%; content:""; height:54%; position:absolute; top:23%; width:48%; }
.art-commons::before { left:8%; }
.art-commons .shape::before { right:8%; }
.art-commons .shape::after { background:#ffb29f; border:0; height:23%; left:38.5%; top:38%; width:23%; }
.art-tide { background:linear-gradient(180deg,#92d8df 0 48%,#0b4c6d 49%); }
.art-tide::before { background:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 17px,rgba(255,255,255,.7) 18px 19px); content:""; inset:8% -10% 0; position:absolute; }
.art-tide .shape { background:#ff6d4a; border-radius:50% 50% 8% 8%; bottom:18%; height:24%; left:42%; position:absolute; width:16%; }
.art-loom { background:#f3c55d; }
.art-loom::before { background:repeating-linear-gradient(90deg,#672f76 0 8px,transparent 8px 23px),repeating-linear-gradient(0deg,#e4492d 0 5px,transparent 5px 31px); content:""; inset:9%; position:absolute; }
.art-loom .shape { border:4px solid #171715; inset:22% 15%; position:absolute; transform:skew(-13deg); }
.art-afterimage { background:radial-gradient(circle at 67% 42%,#faef85 0 9%,#ef4c74 10% 24%,transparent 25%),#382557; }
.art-afterimage::before { color:#fff; content:"FM"; font:800 clamp(4rem,9vw,9rem)/1 Arial; left:7%; opacity:.84; position:absolute; top:10%; transform:scaleX(.72); transform-origin:left; }
.art-afterimage .shape { border:1px solid #fff; border-radius:50%; height:76%; left:52%; position:absolute; top:12%; width:38%; }
.art-index { background:#eee9dc; }
.art-index::before { background:repeating-linear-gradient(#222 0 1px,transparent 1px 23px); content:""; inset:12%; position:absolute; }
.art-index .shape { background:var(--orange); height:58%; left:29%; position:absolute; top:20%; transform:rotate(8deg); width:2px; }
.art-index .shape::before { color:#171715; content:"?"; font:italic 700 5rem Georgia; left:18px; position:absolute; top:4%; }
.art-chorus { background:#772f64; }
.art-chorus::before { background:radial-gradient(circle,#ffd6ef 0 14%,transparent 15%) 0 0/20% 45%; content:""; inset:10%; position:absolute; transform:rotate(-7deg); }
.art-chorus .shape { border-bottom:20px solid #ff814f; border-left:34px solid transparent; border-right:34px solid transparent; bottom:20%; left:42%; position:absolute; }
.art-fieldnotes { background:#263c35; }
.art-fieldnotes::before { border-left:1px solid #f7ecce; border-right:1px solid #f7ecce; content:""; inset:8% 34%; position:absolute; transform:rotate(9deg); }
.art-fieldnotes .shape { background:repeating-linear-gradient(#f7ecce 0 1px,transparent 1px 19px); inset:19% 14%; position:absolute; transform:rotate(-3deg); }
.art-threshold { background:linear-gradient(145deg,#7788a9,#e7c4a3 48%,#36384a 49%); }
.art-threshold::before { border:2px solid rgba(255,255,255,.74); border-radius:50%; content:""; height:44%; left:28%; position:absolute; top:17%; width:44%; }
.art-threshold .shape { background:repeating-linear-gradient(105deg,transparent 0 13px,#d9ff43 14px 16px); inset:50% 5% 4%; position:absolute; }
.art-kiln { background:#f4d6ae; }
.art-kiln::before { background:#b83824; border-radius:50% 50% 5% 5%; bottom:0; content:""; height:78%; left:24%; position:absolute; width:52%; }
.art-kiln .shape { background:radial-gradient(circle at 50% 75%,#fff3a6 0 12%,#f15b2a 28%,#321914 31%); inset:18% 31% 8%; position:absolute; }
.art-braid { background:#284867; }
.art-braid::before { background:repeating-linear-gradient(55deg,transparent 0 18px,#ff8c73 19px 23px,transparent 24px 36px,#8ce0c3 37px 41px); content:""; inset:-20%; position:absolute; transform:rotate(6deg); }
.art-braid .shape { border:2px solid #f7eed8; border-radius:50%; inset:17% 28%; position:absolute; }
.art-weather { background:#5399aa; }
.art-weather::before { background:radial-gradient(ellipse,#edf0e8 0 42%,transparent 44%) 0 0/31% 44%; content:""; inset:2% -7% 28%; position:absolute; }
.art-weather .shape { background:repeating-linear-gradient(100deg,transparent 0 14px,#163d53 15px 17px); inset:48% 12% 8%; position:absolute; transform:skewX(-10deg); }
.art-interval { background:#ece5d3; }
.art-interval::before { border:12px solid #1f1f1d; border-left-color:var(--orange); border-radius:50%; content:""; height:58%; left:29%; position:absolute; top:15%; transform:rotate(22deg); width:42%; }
.art-interval .shape { background:#1f1f1d; height:32%; left:49%; position:absolute; top:25%; transform:rotate(-35deg); transform-origin:bottom; width:2px; }
.art-beacon { background:#152c49; }
.art-beacon::before { background:repeating-conic-gradient(from 0deg at 50% 100%,transparent 0 8deg,rgba(211,255,88,.34) 9deg 16deg); content:""; inset:8% 4%; position:absolute; }
.art-beacon .shape { background:var(--acid); border-radius:50%; box-shadow:0 0 40px var(--acid); height:12%; left:44%; position:absolute; top:56%; width:12%; }
.art-lattice { background:#bb5d6c; }
.art-lattice::before { background-image:linear-gradient(30deg,transparent 47%,#f8eadb 48% 52%,transparent 53%),linear-gradient(-30deg,transparent 47%,#f8eadb 48% 52%,transparent 53%); background-size:42px 42px; content:""; inset:-10%; position:absolute; }
.art-lattice .shape { background:#304f47; border-radius:50%; height:35%; left:33%; position:absolute; top:32%; width:34%; }
.art-murmur { background:#5c527c; }
.art-murmur::before { background:radial-gradient(ellipse at center,rgba(255,255,255,.82) 0 4%,transparent 5%) 0 0/17% 28%; content:""; inset:7%; opacity:.8; position:absolute; }
.art-murmur .shape { border:1px solid #ffbd8b; border-radius:50%; inset:13% 29%; position:absolute; transform:rotate(-16deg); }
.art-archive { background:#b72631; }
.art-archive::before { color:#f4e7cf; content:"MAYBE"; font:900 clamp(3rem,7vw,8rem)/.8 Arial; left:5%; letter-spacing:-.1em; position:absolute; top:17%; transform:rotate(-6deg); }
.art-archive .shape { border:2px dashed #f4e7cf; inset:11% 8%; position:absolute; transform:rotate(3deg); }
.art-switchyard { background:#252523; }
.art-switchyard::before { background:linear-gradient(65deg,transparent 46%,#f1b643 47% 50%,transparent 51%),linear-gradient(-65deg,transparent 46%,#b3a3ff 47% 50%,transparent 51%); content:""; inset:-15%; position:absolute; }
.art-switchyard .shape { background:#f05232; border-radius:50%; box-shadow:-55px 36px 0 #d9ff43,62px -31px 0 #b3a3ff; height:15px; left:49%; position:absolute; top:47%; width:15px; }
.art-pollen { background:#f0d95d; }
.art-pollen::before { background:radial-gradient(circle,#2a2925 0 9%,transparent 10%) 0 0/22% 31%; content:""; inset:8%; position:absolute; transform:rotate(12deg); }
.art-pollen .shape { background:#f05232; border-radius:50% 0 50% 50%; height:34%; left:35%; position:absolute; top:31%; transform:rotate(45deg); width:30%; }
.art-nightshift { background:#0d1927; }
.art-nightshift::before { background:linear-gradient(90deg,transparent 0 12%,rgba(113,214,255,.6) 12.5% 13%,transparent 13.5% 31%,rgba(113,214,255,.6) 31.5% 32%,transparent 32.5%); content:""; inset:0; position:absolute; }
.art-nightshift .shape { border:1px solid #71d6ff; box-shadow:0 0 35px #3486a9 inset; inset:18% 16%; position:absolute; }
.art-nightshift .shape::before { color:#d9ff43; content:"03:17"; font:700 2.1rem "Courier New"; left:10%; position:absolute; top:35%; }
.art-measure { background:#dedbd2; }
.art-measure::before { background:repeating-linear-gradient(90deg,#161616 0 1px,transparent 1px 10%); content:""; inset:18% 7%; position:absolute; }
.art-measure .shape { background:#f05232; bottom:18%; height:44%; left:16%; position:absolute; transform:skewX(-13deg); width:21%; }
.art-vessel { background:#d7cbb7; }
.art-vessel::before { border:12px solid #426b61; border-radius:10% 10% 45% 45%; border-top:0; content:""; height:59%; left:31%; position:absolute; top:19%; transform:rotate(7deg); width:38%; }
.art-vessel .shape { border-bottom:2px dashed #a34536; left:12%; position:absolute; right:12%; top:54%; transform:rotate(-5deg); }
.art-assembly { background:#3f3192; }
.art-assembly::before { background:repeating-linear-gradient(90deg,transparent 0 18%,#ffb257 18.5% 20%,transparent 20.5% 38%); content:""; inset:8%; position:absolute; }
.art-assembly .shape { background:#f4efe2; clip-path:polygon(50% 0,100% 100%,0 100%); height:55%; left:35%; position:absolute; top:21%; width:30%; }
.art-echo { background:#477a6a; }
.art-echo::before { border:2px solid #f2e6cf; border-radius:50%; content:""; inset:10% 19%; position:absolute; }
.art-echo .shape { border:2px solid #f2e6cf; border-radius:50%; inset:22% 29%; position:absolute; }
.art-echo .shape::before { border:2px solid #ff9b78; border-radius:50%; content:""; inset:18%; position:absolute; }
.art-wayfinder { background:#d45a30; }
.art-wayfinder::before { background:conic-gradient(from 25deg,#f4e8cb 0 8%,transparent 8% 24%,#f4e8cb 24% 32%,transparent 32% 49%,#1d3f4e 49% 58%,transparent 58%); border-radius:50%; content:""; height:75%; left:27%; position:absolute; top:12%; width:46%; }
.art-wayfinder .shape { background:#d9ff43; clip-path:polygon(50% 0,100% 100%,50% 75%,0 100%); height:45%; left:42%; position:absolute; top:27%; width:16%; }
.art-aperture { background:#24272b; }
.art-aperture::before { background:conic-gradient(from 10deg,#64b6ac 0 14%,#202124 14% 18%,#e8c56a 18% 32%,#202124 32% 36%,#b56576 36% 50%,#202124 50% 54%,#6d87a8 54% 68%,#202124 68% 72%,#f0ede3 72% 86%,#202124 86% 90%,#64b6ac 90%); border-radius:50%; content:""; height:82%; left:28%; position:absolute; top:9%; width:44%; }
.art-aperture .shape { background:#171715; border:2px solid #fff; border-radius:50%; height:23%; left:43%; position:absolute; top:38%; width:14%; }
footer { border-top:1px solid var(--line); display:flex; justify-content:space-between; padding:23px 0 40px; }
footer p { margin:0; }
.status-dot { background:#1aa76c; border-radius:50%; display:inline-block; height:7px; margin-right:7px; width:7px; }
body[data-view="spatial"] { --ink:#f2f0e8; --muted:#aaa79f; --line:rgba(242,240,232,.2); background:#10110f; }
body[data-view="spatial"] #spatial-scene { opacity:1; }
body[data-view="spatial"] .page-shell { text-shadow:0 1px 8px rgba(0,0,0,.16); }
body[data-view="spatial"] .view-options { background:rgba(22,22,20,.66); }
body[data-view="spatial"] .view-options button[aria-pressed="true"] { background:var(--acid); color:#171717; }
body[data-view="spatial"] .intro h1 em { color:var(--violet); }
body[data-view="spatial"] .density-control { background:var(--acid); color:#171715; }
body[data-view="spatial"] .density-control input { accent-color:#f05232; }
body[data-view="spatial"] .density-control output { background:#171715; color:#f8f6ee; }
body[data-view="spatial"] .gallery { gap:clamp(12px,1.5vw,26px); grid-auto-flow:row dense; padding-left:clamp(0px,2.5vw,42px); padding-right:clamp(0px,2.5vw,42px); }
body[data-view="spatial"] .module:nth-child(5n + 1) { grid-column:span 2; grid-row:span 3; }
body[data-view="spatial"] .module:nth-child(5n + 2) { grid-column:span 1; grid-row:span 1; margin-top:12%; }
body[data-view="spatial"] .module:nth-child(5n + 3) { grid-column:span 1; grid-row:span 2; }
body[data-view="spatial"] .module:nth-child(5n + 4) { grid-column:span 2; grid-row:span 2; }
body[data-view="spatial"] .module:nth-child(5n) { grid-column:span 1; grid-row:span 3; margin-bottom:10%; }
body[data-view="spatial"] .module-inner { background:#292a27; box-shadow:0 30px 62px rgba(0,0,0,.4); color:#f2f0e8; transform:rotateX(var(--field-rx,1deg)) rotateY(var(--field-ry,-1deg)) translateZ(14px); }
body[data-view="spatial"] .module:nth-child(2n) .module-inner { transform:rotateX(var(--field-rx-inverse,-1deg)) rotateY(var(--field-ry-soft,.75deg)) translateZ(38px); }
body[data-view="spatial"] .module:nth-child(3n) .module-inner { transform:rotateX(var(--field-rx-soft,.65deg)) rotateY(var(--field-ry-deep,-1.3deg)) translateZ(64px); }
body[data-view="spatial"] .module-meta { background:#292a27; }
body[data-view="spatial"] .module-type { color:#d1cec5; }
body[data-view="spatial"] .gallery.has-peek .module.is-neighbor,body[data-view="spatial"] .gallery.has-open .module:not(.is-open) { grid-column:span 1; grid-row:span 1; margin:0; }
body[data-view="spatial"] .gallery.has-peek .module.is-peek { grid-row:span 4; margin:0; }
body[data-view="spatial"] .module.is-open { grid-column:1 / -1!important; grid-row:span 5!important; margin:0; }
body[data-view="spatial"] .module.is-open .module-inner { transform:translateZ(34px); }
body[data-view="spatial"] .module-detail { background:#f8f6ee; color:#171715; text-shadow:none; }
@media (max-width:900px) {
  .masthead { grid-template-columns:1fr auto; min-height:88px; }
  .edition,.view-label { display:none; }
  .intro { align-items:start; gap:34px; grid-template-columns:1fr; padding:60px 0 66px; }
  .intro h1 { font-size:clamp(4rem,17vw,7rem); }
  .intro-copy,.interaction-note { max-width:580px; }
  .section-heading { align-items:flex-start; }
  .collection-tools { align-items:flex-end; flex-direction:column; gap:10px; }
  .detail-layout { gap:30px; grid-template-columns:1fr 1fr; }
  .detail-copy h3 { font-size:clamp(3.5rem,9vw,6rem); }
}
@media (max-width:700px) {
  .page-shell { padding:0 13px; }
  .wordmark { font-size:.6rem; }
  .wordmark-mark { margin-right:9px; }
  .view-options button { padding:8px 10px; }
  .intro { padding-top:48px; }
  .intro h1 { font-size:clamp(3.6rem,19vw,5.7rem); }
  .section-heading { align-items:stretch; flex-direction:column; }
  .collection-tools { align-items:stretch; flex-direction:row; justify-content:space-between; }
  .density-control { grid-template-columns:auto minmax(78px,1fr) 24px; min-width:min(230px,64vw); }
  .gallery { grid-auto-rows:clamp(104px,calc(75vw / var(--columns)),180px); }
  .gallery[data-columns="1"] .module,body[data-view="spatial"] .gallery[data-columns="1"] .module:nth-child(n) { grid-column:span 1; }
  .gallery[data-columns="1"] .module.format-compact { grid-row:span 2; }
  .module.is-open,body[data-view="spatial"] .module.is-open { background:var(--paper-bright); height:100dvh; inset:0; margin:0; min-height:100dvh; overflow-y:auto; position:fixed; width:100vw; z-index:90; }
  .module.is-open .module-inner { box-shadow:none; height:auto; min-height:100%; transform:none!important; }
  .gallery.has-open { perspective:none; }
  .gallery.has-open .module:not(.is-open) { display:none; }
  .module-detail { min-height:100dvh; padding:14px; }
  .detail-layout { display:flex; flex-direction:column; height:auto; }
  .detail-visual { flex:0 0 42vh; min-height:280px; }
  .detail-copy { padding:4px 3px 32px; }
  .detail-copy h3 { font-size:clamp(3.7rem,18vw,6rem); }
  .detail-description { margin:25px 0; }
  .detail-tags { margin-bottom:30px; }
  body.detail-open { overflow:hidden; }
  footer { gap:16px; }
  footer p:first-child { display:none; }
}
@media (max-width:430px) {
  .collection-tools { align-items:stretch; flex-direction:column; }
  .collection-count { align-self:flex-end; }
  .density-control { min-width:0; width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; }
  body[data-view="spatial"] .module-inner,body[data-view="spatial"] .module:nth-child(n) .module-inner { transform:none; }
}

/* Stable rows stretch horizontally; selection becomes a feature and thumbnail strip. */
body[data-view] .gallery { grid-auto-flow: row; grid-auto-rows: auto; transition: grid-template-columns 440ms var(--ease); overflow-anchor: none; }
body[data-view] .gallery .module { grid-column: auto !important; grid-row: auto !important; height: 260px; min-height: 0; margin: 0; }
body[data-view] .gallery.has-open { grid-template-columns: minmax(0, 1fr); perspective: none; }
body[data-view] .gallery .module.is-open { grid-column: 1 / -1 !important; height: auto; min-height: 0; position: relative; inset: auto; width: auto; overflow: visible; }
body[data-view] .gallery .module.is-open .module-inner { height: auto; min-height: 0; transform: none !important; }
.gallery-thumbnails { display: flex; gap: 12px; overflow-x: auto; min-width: 0; padding: 8px 4px 16px; scroll-snap-type: x proximity; }
body[data-view] .gallery .gallery-thumbnails .module { display: block; flex: 0 0 150px; height: 125px; scroll-snap-align: start; }
.gallery-thumbnails .module-number, .gallery-thumbnails .art-caption { display: none; }
.gallery-thumbnails .module-title { font-size: .9rem; }
.gallery-thumbnails .module-meta { padding: 8px; }
body[data-view] .gallery.has-open .module-inner { transform: none !important; }
@media (max-width: 700px) {
  body[data-view] .gallery .module { height: 225px; }
  body[data-view] .gallery .module.is-open { height: auto; }
  body[data-view] .gallery .module.is-open .module-detail { height: auto; }
}

/* Hover changes only the current row; thumbnails use the same width emphasis. */
.gallery-row { display: grid; gap: var(--gap); min-width: 0; transition: grid-template-columns 440ms var(--ease); }
/* Reserve caption space so width interpolation cannot squeeze the artwork or
   change the vertical rhythm. The trigger's aria-label retains the full title. */
.gallery-row .module { min-width: 0; }
.gallery-row .module-meta { height: 84px; flex: 0 0 84px; min-width: 0; }
.module-meta > span:first-child { min-width: 0; }
.gallery-row .module-meta br, .gallery-thumbnails .module-meta br { display: none; }
.gallery-row .module-title, .gallery-thumbnails .module-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: 2.2em; line-height: 1.1; overflow-wrap: anywhere; }
.gallery-row .module-type { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gallery-thumbnails .module-meta { height: 53px; flex: 0 0 53px; }
body[data-view] .gallery .gallery-thumbnails .module { transition: flex-basis 440ms var(--ease); }
body[data-view] .gallery .module.is-peek .module-trigger { outline: 2px solid var(--ink, #151515); outline-offset: -2px; }
body[data-view] .gallery.has-peek .module:not(.is-peek) .module-inner { filter: none; }