:root{color-scheme:light;--ink:#191919;--rule:#dedede}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{background:#fff;color:var(--ink);font-family:Arial,"Helvetica Neue","Noto Sans TC",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #2056e8;outline-offset:6px}.page{height:100vh;height:100dvh;max-width:1920px;padding:0 3.1%;margin:auto;display:grid;grid-template-rows:auto minmax(0,1fr) auto}.skip{position:fixed;top:-80px;left:20px;background:#fff;padding:12px;z-index:10}.skip:focus{top:12px}.nav{display:flex;justify-content:space-between;align-items:center;padding:25px 0 23px;border-bottom:1px solid var(--rule);background:#fff}.identity h1{font-size:inherit;margin:0}.brand{display:inline-flex;align-items:baseline;gap:14px}.brand strong{font-size:31px;letter-spacing:-1.6px}.brand span{font-size:13px;color:#555;font-weight:400}.tagline{font-size:12px;font-weight:400;letter-spacing:.1em;margin:9px 0 0;line-height:1.7;color:#666}nav{font-size:13px}nav a{padding:10px 0}nav span{font-size:9px;color:#888;margin-left:8px;vertical-align:super}nav a:hover{text-decoration:underline;text-underline-offset:5px}main{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scroll-behavior:smooth;padding:36px 8px 70px;margin:0 -8px;scrollbar-width:thin;scrollbar-color:#ccc #fff}main:focus,main:focus-visible{outline:none}.section-label{display:flex;gap:24px;align-items:center;margin:0 0 35px}.section-label h2{font-size:10px;letter-spacing:.18em;font-weight:400;margin:0;white-space:nowrap}.section-label h2 span{color:#888;margin-left:10px}.line{height:1px;flex:1;background:#ededed}.exhibit-mark{font-size:25px;font-weight:300;line-height:1}.works-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:38px 24px;padding-top:8px}.work{display:block;min-width:0;perspective:850px;--rx:0deg;--ry:0deg;--px:50%;--py:50%}.preview{position:relative;aspect-ratio:1;overflow:hidden;background:#f4f4f4;transform:rotateX(0) rotateY(0);transition:transform .45s cubic-bezier(.2,.65,.3,1),box-shadow .45s;isolation:isolate}.preview img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s,filter .4s}.work h3{font-size:13px;font-weight:400;letter-spacing:-.015em;margin:16px 0 0;line-height:1.5;display:flex;justify-content:space-between;gap:6px}.work h3 span{opacity:0;transform:translate(-4px,4px);transition:opacity .25s,transform .25s}.sheen{position:absolute;inset:0;background:radial-gradient(circle at var(--px) var(--py),#ffffff38,transparent 65%);mix-blend-mode:screen;opacity:0;transition:opacity .4s;pointer-events:none}.gravity canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.glitch:after{content:"";position:absolute;inset:0;background:url('/assets/glitch.svg') center/cover;clip-path:inset(34% 0 53%);opacity:0;pointer-events:none}.work:focus-visible h3 span{opacity:1;transform:none}.work:focus-visible .preview{transform:translateY(-5px)}footer{border-top:1px solid var(--rule);display:flex;justify-content:space-between;align-items:center;gap:20px;padding:21px 0;color:#777;font-size:11px;background:#fff}footer strong{color:#191919}@media(hover:hover) and (pointer:fine){.work:hover .preview{transform:translateY(-7px) rotateX(var(--rx)) rotateY(var(--ry));box-shadow:0 15px 24px -20px #0007}.work:hover h3 span{opacity:1;transform:none}.work:hover img{transform:scale(1.045)}.work:hover .sheen{opacity:1}.work:hover .glitch:after{animation:glitch-slice 1.8s steps(1,end) infinite}.work:hover .glitch img{filter:saturate(1.16)}}@keyframes glitch-slice{0%,100%{opacity:0;transform:none}8%{opacity:1;transform:translateX(9px);clip-path:inset(34% 0 53%)}15%{opacity:1;transform:translateX(-6px);clip-path:inset(62% 0 28%)}23%{opacity:0}70%{opacity:1;transform:translateX(5px);clip-path:inset(18% 0 74%)}78%{opacity:0}}@media(max-width:1000px){.works-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 20px}}@media(max-width:620px){.page{padding:0 22px}.nav{padding:19px 0 18px;gap:15px}.brand{gap:9px}.brand strong{font-size:27px}.brand span{font-size:11px}.tagline{font-size:10px;letter-spacing:.025em;margin-top:7px}nav{font-size:12px;flex-shrink:0}nav span{margin-left:4px}main{padding-top:27px}.works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}.section-label{gap:14px;margin-bottom:25px}.section-label h2{font-size:9px;letter-spacing:.12em}.work h3{font-size:12px;margin-top:12px}.work h3 span{display:none}footer{font-size:9px;padding:18px 0;gap:10px}}@media(prefers-reduced-motion:reduce){main{scroll-behavior:auto}html:not([data-motion="on"]) *,html:not([data-motion="on"]) *::before,html:not([data-motion="on"]) *::after{transition:none!important;animation:none!important}html:not([data-motion="on"]) .work:hover .preview,html:not([data-motion="on"]) .work:focus-visible .preview,html:not([data-motion="on"]) .work:hover img{transform:none}html:not([data-motion="on"]) .sheen{display:none}}

/* Preview animations run while the exhibits are visible. */
.works-grid{padding-top:2px}
.glitch:after{animation:glitch-slice 2.4s steps(1,end) infinite}
.glitch img{animation:glitch-drift 4s steps(1,end) infinite}
.gravity img{animation:orbit-preview 36s linear infinite;transform:scale(1.2)}
.preview:after,.preview img{animation-play-state:paused}
.work.is-visible .preview:after,.work.is-visible .preview img{animation-play-state:running}
.work.is-visible:hover .glitch:after{animation-duration:1s}
@keyframes glitch-drift{0%,100%{transform:translateX(0) scale(1.035);filter:none}12%{transform:translateX(-3px) scale(1.035);filter:hue-rotate(22deg)}18%{transform:translateX(4px) scale(1.035)}24%{transform:translateX(0) scale(1.035);filter:none}65%{filter:hue-rotate(-16deg)}72%{filter:none}}
@keyframes orbit-preview{from{transform:scale(1.2) rotate(0deg)}to{transform:scale(1.2) rotate(360deg)}}
@media(prefers-reduced-motion:reduce){html:not([data-motion="on"]) .glitch:after{display:none}html:not([data-motion="on"]) .gravity img{transform:none}html:not([data-motion="on"]) .preview img,html:not([data-motion="on"]) .preview:after{animation:none!important}}

.motion-toggle{font:inherit;color:#555;background:none;border:0;padding:5px 0;cursor:pointer;text-decoration:underline;text-underline-offset:4px;order:2}.motion-toggle:focus-visible{outline:2px solid #2056e8;outline-offset:4px}footer span:nth-of-type(2){margin-left:auto}html[data-motion="off"] .preview img,html[data-motion="off"] .preview:after{animation-play-state:paused!important}html[data-motion="off"] .work:hover .preview,html[data-motion="off"] .work:hover img{transform:none}html[data-motion="off"] .sheen{display:none}

/* DARK EXHIBITION / 2026 */
:root{color-scheme:dark;--ink:#e9edf4;--rule:#252c37}body,.nav,footer,.skip{background:#090c12}.brand span{color:#8795a8}.tagline{color:#8a99ac}.preview{background:#111925}.work h3{font-size:13px;letter-spacing:.01em}.work h3 span{color:#63dfd4}.work:focus-visible{outline-color:#63dfd4}.preview{border:1px solid #202d3b}.work:hover .preview{border-color:#5d9fbb;box-shadow:0 12px 40px -18px #18a4ce55}footer{color:#78899e}footer strong{color:#dce8f2}.motion-toggle{color:#9aadbf;display:inline-flex;align-items:center;gap:6px}.icon{display:inline-block;vertical-align:middle;flex-shrink:0}.motion-toggle .icon{width:12px;height:12px}main{scrollbar-color:#354356 #090c12}.glitch:after{background-image:url('/glitch-archaeology/sample-portrait.png')}a:focus-visible,button:focus-visible{outline-color:#63dfd4}

.brand strong,.brand span,.work h3,footer span[lang=en]{font-family:var(--display);font-weight:400}.brand strong{letter-spacing:-.04em;font-size:28px}.brand span{font-size:9px}.work h3{font-size:10px;line-height:1.9;transition:color .25s}.work:hover h3,.work:focus-visible h3{color:#73f0d3}.about-link{order:1;margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:11px;padding:7px 0;color:#9aadbf}.about-link:hover{color:#73f0d3}footer span:nth-of-type(2){margin-left:0;font-size:8px}.motion-toggle{order:2;font-size:11px}footer{gap:26px}footer>span:first-of-type{order:-2}footer>span[lang=en]{order:-1}.about-link span{font-size:14px}@media(max-width:620px){footer{gap:14px;flex-wrap:wrap}footer>span[lang=en]{display:none}.about-link,.motion-toggle{font-size:10px}.work h3{font-size:9px;overflow-wrap:anywhere}.brand strong{font-size:24px}.brand span{font-size:8px}}
.about-link svg{width:13px;height:13px;stroke-width:1.5}
footer>span:first-of-type{font-family:var(--display);font-size:8px}footer>span:first-of-type strong{font-weight:400}

.hexadecimal canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hexadecimal canvas[hidden]{display:none}

.accidental canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.accidental canvas[hidden]{display:none}

.forces canvas{position:absolute;inset:0;width:100%;height:100%;display:block}