@font-face{font-family:Suit;src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_suit@1.0/SUIT-Medium.woff2') format('woff2');font-weight:400 800;font-display:swap}
:root{--bg:#111213;--surface:#191a1c;--text:#f0f0eb;--muted:#a0a1a3;--line:#343537;--accent:#d2fa69;--pink:#f2a2cb;font-family:'DM Sans',Suit,Arial,sans-serif;color:var(--text);background:var(--bg);color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{border:0;background:none}button:active{transform:translateY(2px)}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}img{display:block;width:100%;height:100%;object-fit:cover}h1,h2,h3,p{margin:0}h2{font-size:clamp(36px,4.1vw,60px);line-height:1.13;letter-spacing:-2px;font-weight:700}.wrap{width:min(1320px,calc(100% - 112px));margin-inline:auto}.mono{font-family:'Courier New',monospace;font-size:12px;line-height:1.6;letter-spacing:.5px}.pixel{font-family:Silkscreen,'Courier New',monospace;font-size:13px;font-weight:400;line-height:1.7}.accent{color:var(--accent)}.header{height:97px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-size:29px;letter-spacing:-2px;font-weight:900;display:flex;align-items:center;gap:5px}.pixel-mark{font-size:30px;color:var(--accent);line-height:1}.header nav{display:flex;gap:36px}.nav-link{font-size:13px;letter-spacing:1px;position:relative}.nav-link:before{content:'▶';position:absolute;left:-16px;color:var(--accent);opacity:0;font-size:10px;top:3px}.nav-link:hover:before{opacity:1}.header-note{color:var(--muted)}.hero{padding-top:44px}.eyebrow-row{display:flex;justify-content:space-between;align-items:center}.hero-name{color:var(--muted)}h1{font-size:clamp(64px,11.65vw,168px);font-weight:900;letter-spacing:-.065em;line-height:1.05;white-space:nowrap;margin:17px 0 23px}.title-period{color:var(--accent)}.hero-description{display:flex;justify-content:space-between;align-items:end;margin-bottom:34px}.hero-description>p{font-family:Suit,sans-serif;font-size:17px;line-height:1.8;color:#c9c9c8}.hero-tags{text-align:right;line-height:1.9;color:var(--muted)}.hero-tags a{display:inline-block;color:var(--accent);margin-top:10px}.hero-tags a span{margin-left:20px}.hero-screen{position:relative;display:block;width:100%;height:clamp(310px,40vw,555px);overflow:hidden;padding:0;text-align:left;background:#1b1b20}.hero-screen>img{object-position:50% 45%;transition:transform .5s}.hero-screen:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0002,transparent 40%,#0009);pointer-events:none}.hero-screen:hover>img{transform:scale(1.025)}.screen-label{position:absolute;top:24px;left:25px;z-index:1;background:#111d;padding:7px 12px;font-size:12px;color:var(--accent)}.hero-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:74px;height:74px;display:grid;place-items:center;padding-left:5px;background:var(--accent);color:#111;border-radius:50%;font-size:23px;z-index:2;box-shadow:0 0 0 10px #ffffff15;transition:box-shadow .2s}.hero-screen:hover .hero-play{box-shadow:0 0 0 15px #ffffff20}.screen-bottom{position:absolute;bottom:26px;left:28px;right:28px;display:flex;align-items:end;justify-content:space-between;z-index:1}.screen-bottom small{display:block;font-size:11px;letter-spacing:1.5px}.screen-bottom strong{font-size:32px;letter-spacing:-1px;line-height:1.4}.watch-label{border-bottom:1px solid #ffffff70;padding-bottom:6px}.screen-footer{padding:15px 0 29px;display:flex;justify-content:space-between;color:var(--muted);gap:15px}.screen-footer .accent{margin-right:8px}.discipline-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:30px}.discipline-strip .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:23px;font-size:17px;font-weight:600;letter-spacing:1px}.discipline-strip .pixel{font-size:23px}.work-section{padding-block:96px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:42px}.section-head h2{margin-top:16px}.section-head>p{color:var(--muted);font-size:16px;line-height:1.8}.filters{display:flex;border-bottom:1px solid var(--line);gap:9px;flex-wrap:wrap;padding-bottom:17px}.filter{font-size:12px;letter-spacing:.2px;padding:11px 14px;color:var(--muted);transition:background .15s,color .15s}.filter:first-child:before{content:'▶';font-size:9px;margin-right:10px}.filter.active{background:var(--accent);color:#15180e}.filter:hover:not(.active){background:#282a26;color:var(--text)}.filter sup{font-size:10px;margin-left:7px}.collection-meta{display:flex;justify-content:space-between;color:var(--muted);padding:19px 0 25px}.project-grid{display:grid;grid-template-columns:1.16fr 1fr;gap:48px 30px}.project-card:nth-child(even){padding-top:68px}.project-thumb{display:block;width:100%;padding:0;position:relative;aspect-ratio:16/10;overflow:hidden;background:#202123}.project-card:nth-child(even) .project-thumb{aspect-ratio:16/10}.project-thumb img{transition:transform .35s}.project-thumb:hover img{animation:pixel-shift .22s steps(2) 1;transform:scale(1.025)}.project-thumb:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 1px #ffffff08;pointer-events:none}.project-thumb .project-play{position:absolute;right:17px;bottom:17px;border-radius:50%;width:40px;height:40px;display:grid;place-items:center;padding-left:2px;background:#111a;backdrop-filter:blur(5px);font-size:12px;color:#fff}.project-thumb:hover .project-play{background:var(--accent);color:#111}.project-id{position:absolute;top:16px;left:16px;color:#fff;background:#111c;padding:4px 8px;font-size:11px}.project-type{margin-top:19px;color:var(--accent);font-size:11px;letter-spacing:.8px}.project-title-line{display:flex;justify-content:space-between;gap:16px;align-items:start;margin-top:7px}.project-title-line h3{font-family:Suit,sans-serif;font-size:23px;line-height:1.5;font-weight:600;letter-spacing:-.5px}.project-title-line>span{font-size:23px;color:var(--muted)}.project-role{font-size:14px;line-height:1.7;color:var(--muted);margin-top:9px}.project-tools{font-size:12px;color:#a4a6a4;margin-top:13px}.project-tools:before{content:'↳';margin-right:7px;color:var(--accent)}.archive-link{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:23px 0;margin-top:54px;display:flex;align-items:center;justify-content:space-between;gap:20px}.archive-link p{color:var(--muted);font-size:14px}.archive-link button{font-size:13px;letter-spacing:1px}.archive-link button span{margin-left:20px;color:var(--accent)}.load-more{border:1px solid var(--line);width:100%;padding:18px;margin-top:35px;font-size:14px}.load-more:hover{border-color:var(--accent)}.about-section{background:var(--surface);padding-block:78px}.about-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:100px;margin-top:37px}.about-copy h2{font-family:Suit,sans-serif;font-size:clamp(32px,3.5vw,49px);font-weight:500;letter-spacing:-1.5px;line-height:1.45;position:relative}.about-copy h2>span:not(.pixel-spark){color:var(--accent)}.pixel-spark{position:absolute;color:var(--pink);font-size:54px;right:10px;top:2px}.name-line{margin-top:28px!important;color:var(--text)!important}.name-line span{display:block;color:var(--muted);margin-top:5px}.about-copy>p{font-family:Suit,sans-serif;font-size:16px;line-height:1.95;color:#b3b4b5;margin-top:20px;word-break:keep-all}.experience{display:flex;gap:50px;margin-top:29px}.experience>div{display:flex;flex-direction:column;gap:5px}.experience strong{font-size:40px;letter-spacing:-2px;font-weight:500}.experience span{font-size:12px;color:var(--muted)}.tool-window{align-self:center;border:1px solid #484a43;background:#141513;box-shadow:8px 8px 0 #1113}.window-bar{border-bottom:1px solid #484a43;padding:12px 18px;display:flex;justify-content:space-between;color:#aaada3}.tool-content{padding:27px}.tool-content>.pixel{display:flex;justify-content:space-between;margin-bottom:23px}.tool-row{display:grid;grid-template-columns:62px 1fr auto;gap:10px;align-items:center;padding:17px 0;border-bottom:1px solid #30322c}.tool-row>.mono{font-size:11px;color:#85897e}.tool-row strong{font-size:16px;font-weight:500}.tool-level{font-family:monospace;font-size:10px;color:var(--muted)}.tool-level.main{color:var(--accent);background:#d2fa6912;padding:3px 6px}.extra-tools{margin-top:25px}.extra-tools>span{font-size:11px;color:var(--muted)}.extra-tools p{font-size:14px;margin-top:11px}.extra-tools p span{color:#727469;margin:0 5px}.tool-status{font-size:10px;color:#a7af94;border-top:1px dashed #363c2c;margin-top:24px;padding-top:19px}.supporting{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);margin-top:65px;padding-top:26px;gap:25px}.supporting>span{color:var(--muted);font-size:11px}.supporting>div{display:flex;gap:25px;flex-wrap:wrap}.supporting a{font-size:13px}.supporting a:hover{color:var(--accent)}.contact{padding-block:84px}.contact-top{display:flex;justify-content:space-between}.contact-top>span{font-size:22px;color:var(--pink)}.contact h2{font-size:clamp(48px,7.6vw,107px);font-weight:800;letter-spacing:-5px;line-height:1.03;margin-top:35px}.contact h2 span{color:var(--accent)}.contact-bottom{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-top:38px}.contact-bottom>p{font-size:16px;line-height:1.8;color:var(--muted)}.email-link{font-size:clamp(20px,2.5vw,32px);letter-spacing:-.7px;border-bottom:1px solid #686b62;padding-bottom:8px;display:block}.copy-email{display:block;margin-top:15px;margin-left:auto;color:var(--muted)}.copy-email:hover{color:var(--accent)}.footer{border-top:1px solid var(--line);padding-block:25px;display:flex;justify-content:space-between;align-items:center;gap:18px}.footer>.mono{color:var(--muted);font-size:11px}.skip{position:fixed;left:20px;top:-100px;z-index:10;background:var(--accent);color:#111;padding:12px}.skip:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}dialog{width:min(1000px,calc(100% - 32px));padding:0;background:#191a1c;color:var(--text);border:1px solid #555;max-height:90dvh}dialog::backdrop{background:#000d;backdrop-filter:blur(8px)}.dialog-bar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px}.dialog-bar button{font-family:monospace;font-size:13px;padding:8px}.dialog-info{padding:27px}.dialog-info h2{font-size:29px;letter-spacing:-1px;line-height:1.5;margin-top:10px}.dialog-info>p:not(.mono){color:#bbb;line-height:1.8;font-size:16px;margin-top:16px}.dialog-info>div{color:#aaa;font-size:14px;line-height:1.8;margin-top:16px}.dialog-info>a{display:inline-block;color:var(--accent);margin-top:22px;font-size:14px}#player{background:#000}#player iframe,#player video{width:100%;aspect-ratio:16/9;border:0;display:block;max-height:60dvh}body:has(dialog[open]){overflow:hidden}[hidden]{display:none!important}@keyframes pixel-shift{0%{transform:translateX(-2px);filter:drop-shadow(3px 0 #f2a2cb)}45%{transform:translateX(2px);filter:drop-shadow(-3px 0 #d2fa69)}100%{transform:translateX(0);filter:none}}
@media(min-width:1600px){h1{font-size:166px}}@media(max-width:1050px){.wrap{width:calc(100% - 64px)}.about-grid{gap:42px}.header-note{display:none}.discipline-strip .wrap{font-size:13px;letter-spacing:.3px}.filter{padding:10px;font-size:11px}.pixel-spark{right:0;font-size:35px}.tool-content{padding:20px}.supporting{align-items:start}.supporting>div{gap:16px}.contact h2{letter-spacing:-3px}.project-title-line h3{font-size:20px}}
@media(max-width:650px){.wrap{width:calc(100% - 36px)}.header{height:75px}.wordmark{font-size:25px}.header nav{gap:24px}.nav-link{font-size:11px}.hero{padding-top:31px}.hero-name{font-size:10px}.pixel{font-size:11px}h1{font-size:12vw;margin:24px 0 22px;letter-spacing:-.065em}.hero-description{align-items:start;gap:14px;margin-bottom:25px}.hero-description>p{font-size:14px;line-height:1.8}.hero-tags{font-size:9px;max-width:145px;line-height:1.8}.hero-tags a{font-size:10px}.hero-screen{height:330px}.hero-screen>img{object-position:43% center}.screen-label{left:15px;top:15px;font-size:10px}.screen-bottom{left:18px;right:18px;bottom:18px}.screen-bottom strong{font-size:24px}.screen-bottom small{font-size:9px}.watch-label{display:none}.hero-play{width:55px;height:55px;font-size:17px}.screen-footer{font-size:10px;padding-bottom:17px;gap:12px}.screen-footer>span:nth-child(2){display:none}.discipline-strip{margin-top:20px}.discipline-strip .wrap{padding-block:16px;flex-wrap:wrap;justify-content:center;gap:12px;font-size:10px}.discipline-strip .pixel{font-size:16px}.discipline-strip .pixel:last-child{display:none}.work-section{padding-block:60px}.section-head{display:block;margin-bottom:28px}.section-head h2{font-size:39px}.section-head>p{margin-top:22px;font-size:14px}.filters{gap:5px;padding-bottom:14px}.filter{font-size:11px;padding:11px}.collection-meta{font-size:10px}.project-grid{grid-template-columns:1fr;gap:34px}.project-card:nth-child(even){padding-top:0}.project-thumb,.project-card:nth-child(even) .project-thumb{aspect-ratio:16/10}.project-title-line h3{font-size:21px}.project-role{font-size:14px}.archive-link{margin-top:35px;padding:20px 0;align-items:start;flex-direction:column;gap:13px}.about-section{padding-block:50px}.about-grid{grid-template-columns:1fr;gap:37px;margin-top:25px}.about-copy h2{font-size:37px}.pixel-spark{right:25px;font-size:45px}.about-copy>p{font-size:16px}.experience{gap:44px}.tool-content{padding:23px}.tool-row{grid-template-columns:63px 1fr auto}.supporting{flex-direction:column;margin-top:35px;gap:19px}.supporting>div{gap:20px 28px}.contact{padding-block:54px}.contact h2{font-size:12.2vw;letter-spacing:-2px;margin-top:26px}.contact-bottom{align-items:start;flex-direction:column;margin-top:28px;gap:27px}.contact-bottom>p{font-size:14px}.email-link{font-size:25px}.copy-email{margin-left:0}.footer{flex-wrap:wrap}.footer>.mono{font-size:9px}.dialog-info{padding:20px}.dialog-info h2{font-size:23px}.dialog-bar{padding:10px 18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
.nav-link,.filter{font-size:14px}.filter{min-height:42px}.image-fallback{display:grid;place-items:center;height:100%;padding:32px;color:var(--accent);font-size:18px;line-height:1.7}.hero-tags,.hero-name{font-size:12px}.project-id,.project-type,.tool-row>.mono,.tool-level,.tool-status{font-size:12px}@media(max-width:650px){.nav-link{font-size:12px}.filter{font-size:12px}.hero-tags,.hero-name{font-size:10px}.hero-tags{max-width:150px}}
@media(max-width:650px){.hero-description{display:block}.hero-description>p{word-break:keep-all}.hero-tags{text-align:left;max-width:none;margin-top:16px;font-size:10px}.hero-tags br{display:none}.hero-tags a{float:right;margin-top:0}.hero-tags a span{margin-left:10px}}