@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=IBM+Plex+Mono:wght@400;500&display=swap";
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#151614;--panel:#1c1d1a;--text:#eeeee7;--muted:#a2a49a;--line:#34362f;--accent:#d8e79b;--mono:"IBM Plex Mono",monospace;--sans:"DM Sans",Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{background:var(--bg);color:var(--text);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;margin:0}a{color:inherit;text-decoration:none}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}button:disabled{cursor:wait}button,a{touch-action:manipulation}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button{cursor:pointer}::selection{color:var(--bg);background:var(--accent)}.wrap{width:min(1240px,100% - 104px);margin-inline:auto}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:102px;display:flex}.identity{letter-spacing:-.03em;align-items:center;gap:13px;font-size:20px;font-weight:600;display:flex}nav{gap:36px;font-size:14px;display:flex}nav span{font:12px var(--mono);color:var(--muted);margin-left:5px}.intro{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);align-items:end;gap:48px;padding:56px 0 52px;display:grid}.eyebrow{font:12px var(--mono);letter-spacing:.1em;color:var(--muted);margin:0 0 23px}h1{letter-spacing:-.065em;margin:0;font-size:clamp(48px,5.5vw,78px);font-weight:450;line-height:1.04}.period{color:var(--accent)}.intro-note{width:100%;max-width:360px;padding:0 0 1px}.intro-note p{margin:0 0 16px}.intro-note p:last-child{margin:0}.muted{color:var(--muted)}.section-heading{border-top:1px solid var(--line);align-items:center;gap:18px;padding:20px 0;display:flex}.section-heading h2{margin:0;font-size:14px;font-weight:500}.section-heading>span{font:12px var(--mono);color:var(--muted)}.section-heading>p{color:var(--muted);margin:0 0 0 auto;font-size:13px}.toolbar{z-index:20;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#24251ff5;border:1px solid #424538;border-radius:8px;align-items:center;gap:7px;padding:9px 12px;display:flex;position:sticky;top:14px;box-shadow:0 8px 30px #0003}.toolbar button{background:0 0;border:1px solid #0000;border-radius:4px;min-height:44px;padding:9px 14px;font-size:14px}.toolbar button:hover{background:#ffffff0b}.toolbar-spacer{flex:1}.tool-label{font:11px var(--mono);letter-spacing:.08em;color:var(--muted);margin:0 16px 0 5px}.gallery{padding:44px 0 80px;position:relative}.project{grid-template-columns:minmax(0,1.95fr) minmax(230px,1fr);align-items:center;gap:56px;margin:0 0 120px;display:grid;position:relative}.project-image{aspect-ratio:1.6;background:#22241f;border:1px solid #ffffff12;min-width:0;position:relative}.project-image img{object-fit:cover;width:100%;height:100%;display:block}.project-caption{z-index:3;pointer-events:none;padding:20px 0;position:relative}.project-caption>[data-particle-obstacle]{background:var(--bg);pointer-events:auto;width:fit-content;max-width:100%}.project-index{font:12px var(--mono);color:var(--accent);gap:22px;margin:0 0 22px;display:flex}.project-index span{color:var(--muted);letter-spacing:.025em;font-size:11px}.project-caption h3{letter-spacing:-.045em;margin:0 0 18px;font-size:32px;font-weight:450;line-height:1.2}.project-caption>p:not(.project-index){color:var(--muted);max-width:310px;margin:0 0 27px}.project-link{border-bottom:1px solid #626657;justify-content:space-between;align-items:center;gap:30px;padding:5px 0 8px;font-size:14px;display:inline-flex}.project-link:hover{color:var(--accent);border-color:var(--accent)}.footer{border-top:1px solid var(--line);padding:54px 0 20px}.contact-link{letter-spacing:-.045em;font-size:clamp(25px,4vw,48px)}.contact-link span{color:var(--accent);margin-left:20px}.footer-bottom{border-top:1px solid var(--line);color:var(--muted);justify-content:space-between;gap:18px;margin-top:70px;padding-top:21px;font-size:12px;display:flex}.skip-link{z-index:100;background:var(--accent);color:#151614;padding:12px;position:fixed;top:-80px;left:20px}.skip-link:focus{top:12px}@media (max-width:800px){.wrap{width:calc(100% - 40px)}.site-header{height:80px}.intro{grid-template-columns:minmax(0,1fr) 260px;gap:24px;padding:44px 0}.intro-note{width:260px;font-size:14px}h1{font-size:56px}.project{grid-template-columns:1.6fr 1fr;gap:28px}.project-caption h3{font-size:26px}.project-index{display:block}.project-index span{margin-top:5px;display:block}.project-caption>p:not(.project-index){font-size:14px}.tool-label{display:none}}@media (max-width:600px){.wrap{width:calc(100% - 32px)}.site-header{height:74px}.identity{font-size:18px}nav{gap:21px}.intro{padding:42px 0 32px;display:block}.eyebrow{margin-bottom:18px;font-size:11px}h1{font-size:54px}.intro-note{width:auto;margin-top:25px;font-size:15px}.intro-note p{margin-bottom:10px}.intro-note br{display:none}.section-heading{padding:19px 0}.section-heading>p{display:none}.toolbar{gap:2px;padding:6px;top:8px}.toolbar button{padding:8px 10px;font-size:13px}.gallery{padding-top:28px}.project{flex-direction:column;align-items:stretch;gap:15px;margin-bottom:65px;padding-inline:10px;display:flex}.project-caption{padding:4px 0}.project-index{gap:14px;margin-bottom:12px;display:flex}.project-index span{margin:0;display:inline}.project-caption h3{margin-bottom:12px;font-size:28px}.project-caption>p:not(.project-index){max-width:100%;margin-bottom:14px;font-size:15px}.footer{padding-top:34px}.footer-bottom{flex-wrap:wrap;margin-top:40px;font-size:12px}.footer-bottom>a:nth-child(2){order:3;width:100%}}.toolbar button:disabled{opacity:.4;cursor:default}.toolbar .mode-button{background:var(--accent);color:#21251a;min-width:82px;font-weight:600}.toolbar .mode-button:hover{background:#e3efb8}.toolbar .mode-button.is-playing{background:#e7eadb}.tool-divider{background:#474a3e;flex-shrink:0;width:1px;height:23px;margin-inline:8px}.material-tools,.brush-tools{align-items:center;gap:3px;display:flex}.toolbar .selected{background:#3e4135;border-color:#555a46}.material-dot{vertical-align:1px;width:8px;height:8px;margin-right:8px;display:inline-block}.powder-dot{background:#ddbf81}.seed-dot{background:#a3ba62;border-radius:50% 0 50% 50%}.water-dot{background:#6aa8d4}.brush-label{color:var(--muted);margin-right:7px;font-size:12px}.toolbar .brush-tools button{justify-content:center;align-items:center;min-width:35px;padding-inline:8px;display:flex}.brush-tools button span{background:#e4e7d8;border-radius:50%;display:block}.toolbar .restore-button{white-space:nowrap;align-items:center;gap:7px;display:flex}.restore-button>span:first-child{font-size:22px;line-height:1}.sandbox-note{pointer-events:none;justify-content:flex-end;align-items:center;min-height:46px;display:flex;position:absolute;inset:0 0 auto}.sandbox-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.particle-count{font:10px var(--mono);letter-spacing:.04em;color:#8d9281;white-space:nowrap;padding-top:7px}.gallery{padding-top:75px;padding-bottom:0}.project{gap:66px;margin-bottom:115px;padding-inline:30px}.project-reverse{grid-template-columns:minmax(230px,1fr) minmax(0,1.95fr)}.project-reverse .project-image{grid-area:1/2}.project-reverse .project-caption{grid-area:1/1;padding-left:14px}.project-image{background:0 0;border:0}.project-image img{image-rendering:auto;transition:opacity .18s}.gallery[data-sim-ready=true] .project-image img{opacity:0}.project-caption{z-index:6}.project-credit{font:12px var(--mono);color:#979d87;margin:-12px 0 23px;display:block}.image-corner{z-index:3;pointer-events:none;opacity:.5;width:11px;height:11px;position:absolute}.corner-tl{border-top:1px solid #a9b58b;border-left:1px solid #a9b58b;top:-5px;left:-5px}.corner-br{border-bottom:1px solid #a9b58b;border-right:1px solid #a9b58b;bottom:-5px;right:-5px}.world-canvas{pointer-events:none;z-index:2;image-rendering:pixelated;position:fixed}.paint-layer{z-index:4;pointer-events:none;touch-action:none;cursor:none;position:absolute;inset:0}.brush-cursor{z-index:50;pointer-events:none;opacity:0;will-change:transform;background:#e1c88408;border:1px solid #ead295cc;border-radius:50%;position:fixed;top:0;left:0}.brush-cursor[data-material="3"]{background:#75aff00a;border-color:#83bcec}.brush-cursor[data-material="6"]{background:#a3c57512;border-color:#a3c575}.brush-cursor[data-material="6"]:after{background:#a3c575}.brush-cursor:after{content:"";background:#e9d69e;width:3px;height:3px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.catch-basin{border-bottom:1px solid var(--line);height:210px;font:10px var(--mono);letter-spacing:.06em;color:#777f68;pointer-events:none;justify-content:space-between;align-items:flex-end;padding:0 5px 20px;display:flex}.footer{border-top:0;margin-top:65px;padding-top:0}.catch-basin span{z-index:3;background:var(--bg);padding:7px;position:relative}.no-script{color:var(--muted);font-size:14px}.drag-hint{transform-origin:top;color:#dfe5c9;font:11px var(--mono);letter-spacing:.02em;white-space:nowrap;pointer-events:none;background:#24251ff5;border:1px solid #555a46;border-radius:999px;padding:8px 13px;animation:.22s ease-out both drag-hint-in;position:absolute;top:calc(100% + 9px);left:50%;transform:translate(-50%)scale(1.3);box-shadow:0 8px 24px #0005}@keyframes drag-hint-in{0%{opacity:0;transform:translate(-50%,-5px)scale(1.3)}to{opacity:1;transform:translate(-50%)scale(1.3)}}@media (max-width:1000px){.tool-label{display:none}.project{gap:38px;padding-inline:18px}.project-reverse .project-caption{padding-left:0}.brush-label{display:none}.toolbar{gap:3px}}@media (max-width:800px){.project{gap:30px}.project-reverse{grid-template-columns:1fr 1.6fr}.particle-count{display:none}.tool-divider{margin-inline:3px}.toolbar button{padding-inline:10px}}@media (max-width:600px){.toolbar{flex-wrap:wrap;gap:2px 3px}.toolbar .mode-button{min-width:76px}.brush-tools{order:6;margin-left:5px}.brush-tools:before{content:"Brush";color:var(--muted);margin-right:8px;font-size:12px}.toolbar .brush-tools button{min-width:37px}.brush-divider{display:none}.restore-button{order:8;margin-left:auto}.toolbar-spacer{display:none}.toolbar .material-tools{flex:1;justify-content:flex-end}.tool-divider{flex:0 0 1px}.toolbar .restore-button{padding-inline:8px;font-size:12px}.toolbar:after{content:"";background:#3b3f31;flex-basis:100%;order:5;height:1px;margin-top:3px}.sandbox-note{align-items:flex-start;min-height:54px;padding:5px 2px 0}.gallery{padding-top:78px}.project{gap:18px;margin-bottom:68px;padding-inline:10px}.project-reverse .project-caption{padding-left:0}.project-credit{margin:-2px 0 16px;font-size:11px}.catch-basin{height:130px;font-size:9px}.footer{margin-top:38px}.tool-label{display:none}}.project-caption,.catch-basin{-webkit-user-select:none;user-select:none}.lava-dot{background:#ff812d}.obsidian-dot{background:#8e75ab;box-shadow:inset -2px -2px #574568}.brush-cursor[data-material="9"]{background:#ff812d12;border-color:#ff9a52}.brush-cursor[data-material="9"]:after{background:#ff9a52}.brush-cursor[data-material="10"]{background:#8e75ab12;border-color:#b69ad4}.brush-cursor[data-material="10"]:after{background:#b69ad4}.grenade-dot{background:#a0af75;border-radius:2px;box-shadow:0 -2px #e7c582}.brush-cursor[data-material="12"]{background:#a0af7512;border-color:#e7c582}.brush-cursor[data-material="12"]:after{background:#e7c582}.toolbar .brush-tools button,.toolbar .restore-button{min-width:44px}@media (max-width:420px){.brush-tools:before{display:none}}@media (max-width:380px){.toolbar .mode-button{min-width:70px;padding-inline:7px}.toolbar .material-tools{gap:0}.toolbar .material-tools button{padding-inline:5px;font-size:12px}.material-dot{width:6px;height:6px;margin-right:5px}.brush-tools:before,.restore-button>span:last-child{display:none}.toolbar .restore-button{justify-content:center}.toolbar .brush-tools{margin-left:0}}@media (max-width:1350px){.tool-label{display:none}}@media (max-width:1150px){.toolbar .material-tools button{white-space:nowrap;padding-inline:5px;font-size:13px}.toolbar{flex-wrap:wrap}.toolbar .mode-button{order:0}.toolbar .brush-tools{order:1;margin-left:4px}.toolbar .restore-button{order:2;margin-left:auto}.toolbar .material-tools{border-top:1px solid #3b3f31;flex:0 0 100%;order:4;grid-template-columns:repeat(6,minmax(0,1fr));padding-top:4px;display:grid}.toolbar .tool-divider,.toolbar-spacer,.toolbar:after{display:none}}@media (max-width:600px){.toolbar .material-tools{grid-template-columns:repeat(3,minmax(0,1fr))}.toolbar .material-tools button{padding:6px 3px;font-size:12px}.toolbar .material-dot{width:7px;height:7px;margin:0 6px 0 0;display:inline-block}.toolbar .brush-tools{margin-left:0}.brush-tools:before{display:none}.toolbar .restore-button{font-size:12px}}@media (max-width:420px){.restore-button>span:last-child{display:none}.toolbar .restore-button{justify-content:center}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:0s!important;animation-duration:0s!important}}.pixel-name{flex-shrink:0;width:auto;height:21px;display:block}@media (max-width:380px){.pixel-name{height:14px}}.mobile-scroll-lane{display:none}@media (max-width:600px){.toolbar{padding-bottom:2px}}@media (any-pointer:coarse){body{padding-right:calc(44px + env(safe-area-inset-right,0px))}.work.wrap{--work-gutter:max(52px,calc((100% - 1240px)/2));width:auto;margin-inline:0}.work>.section-heading,.work>.toolbar{margin-inline:var(--work-gutter)}.work>.gallery{padding-inline:var(--work-gutter)}.mobile-scroll-lane{z-index:60;width:calc(44px + env(safe-area-inset-right,0px));padding-right:env(safe-area-inset-right,0px);background:var(--panel);border-left:1px solid var(--line);touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:flex;position:fixed;inset:0 0 0 auto}.mobile-scroll-lane>span{color:var(--accent);pointer-events:none;flex-direction:column;align-items:center;gap:14px;font-size:24px;display:flex}.mobile-scroll-lane>span>span{writing-mode:vertical-rl;font:11px var(--mono);letter-spacing:.08em;color:var(--muted)}}@media (any-pointer:coarse) and (max-width:800px){.work.wrap{--work-gutter:20px}}@media (any-pointer:coarse) and (max-width:600px){.work.wrap{--work-gutter:16px}h1{font-size:clamp(38px,10vw,54px)}.toolbar .mode-button{min-width:64px;padding-inline:6px}.toolbar .brush-tools{gap:0}.toolbar .brush-tools button{min-width:40px;padding-inline:6px}.drag-hint{white-space:normal;text-align:center;width:max-content;max-width:75%}}
