@font-face{font-family:Geist;src:url('assets/geist-latin.woff2') format('woff2');font-style:normal;font-weight:400 800;font-display:swap}
:root{color-scheme:dark;--background:oklch(25.61% .0372 222.39);--foreground:oklch(91.55% .0129 172.34);--card:oklch(30.05% .0407 216.18);--muted-foreground:oklch(78.83% .0241 200.01);--border:oklch(44.38% .0419 211.65);--primary:oklch(82.93% .1155 86.45);--primary-foreground:oklch(30.47% .0195 229.8);--secondary:oklch(34.81% .0442 213.79);--accent:oklch(75.08% .1055 32.75);--info:oklch(81.86% .1022 198.49);--radius:16px;--ease:cubic-bezier(.16,1,.3,1);--bg:var(--background);--ink:var(--foreground);--surface:var(--card);--muted:var(--muted-foreground);--line:var(--border);--acid:var(--primary);--pink:var(--accent);--blue:var(--info)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;background:var(--background);color:var(--foreground);font:16px/1.65 Geist,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}a:focus-visible,button:focus-visible{outline:2px solid var(--primary);outline-offset:5px}::selection{background:var(--primary);color:var(--primary-foreground)}[hidden]{display:none!important}.wrap{width:min(1240px,calc(100% - 96px));margin:auto}.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}.skip{position:fixed;top:12px;left:12px;transform:translateY(-160%);z-index:10;background:var(--primary);color:var(--primary-foreground);padding:10px 20px;border-radius:8px}.skip:focus{transform:none}
/* Navigation */
nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0;border-bottom:1px solid var(--border)}.brand{font-size:23px;font-weight:700;letter-spacing:-1.1px;white-space:nowrap}.brand span{color:var(--primary)}.nav-links{display:flex;gap:30px;align-items:center;font-size:13px;font-weight:500}.nav-links a{color:var(--muted-foreground);transition:color .2s}.nav-links a:hover{color:var(--foreground)}.nav-links .nav-button{padding:9px 14px;border:1px solid var(--border);border-radius:8px;color:var(--foreground);background:var(--card)}.nav-button:hover{border-color:var(--muted-foreground)}
/* Introduction */
.hero{position:relative;display:grid;grid-template-columns:1.12fr .88fr;align-items:center;gap:42px;min-height:590px;padding:72px 0 68px}.intro{min-width:0}.byline{display:inline-flex;align-items:center;gap:10px;color:var(--muted-foreground);font-size:12px;font-weight:500;margin:0 0 28px;padding:7px 11px;border:1px solid var(--border);border-radius:30px;background:var(--card)}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--primary)}h1{font-size:clamp(54px,7.1vw,100px);line-height:1.04;letter-spacing:-.065em;font-weight:650;margin:0}h1 span{color:var(--primary)}.lead{max-width:45ch;font-size:17px;line-height:1.75;color:var(--muted-foreground);margin:27px 0 30px}.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.primary{display:inline-flex;align-items:center;justify-content:center;gap:25px;min-height:46px;padding:12px 20px;border:1px solid transparent;border-radius:9px;background:var(--primary);color:var(--primary-foreground);font-size:13px;font-weight:650;box-shadow:inset 0 1px 0 oklch(96% 0.02 86 / .4);transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .2s}.primary:hover{transform:translateY(-2px);background:oklch(88% .105 86);box-shadow:0 5px 25px oklch(70% 0.12 86 / .12)}.primary span[aria-hidden]{font-size:20px;line-height:1}.all-projects{font-size:13px;color:var(--muted-foreground);padding:10px 0;transition:color .2s}.all-projects:hover{color:var(--foreground)}.hero-art{position:relative;min-width:0;aspect-ratio:1;display:grid;place-items:center;background:radial-gradient(ellipse at center,oklch(34% 0.07 86 / .15),transparent 65%)}.hero-art svg{width:95%;height:95%;overflow:visible}.hero-art svg>path:first-of-type{stroke-width:18;stroke:var(--border)}.hero-art .ribbon{stroke-width:8;stroke-linecap:round;stroke-dasharray:2 12;animation:flow 24s linear infinite}.hero-art .ribbon.two{stroke-width:5;animation-direction:reverse;animation-duration:32s}.hero-art .ribbon.three{stroke-width:4;animation-duration:40s}.hero-art g rect{fill:var(--card);stroke:var(--border);rx:9}.hero-art g text{fill:var(--foreground);font-family:Geist,Arial,sans-serif;font-size:15px;font-weight:500}.hero-art svg>circle{r:6}.hero-art svg>path:last-child{stroke-width:2}.art-caption{position:absolute;left:24px;bottom:0;font-size:11px;color:var(--muted-foreground)}.motion-toggle{display:flex;align-items:center;gap:8px;position:absolute;right:0;bottom:-6px;padding:7px 10px;border:1px solid var(--border);border-radius:7px;background:var(--background);color:var(--muted-foreground);font-size:10px;min-height:32px}.motion-toggle:hover{color:var(--foreground);border-color:var(--muted-foreground)}.paused .ribbon{animation-play-state:paused}@keyframes flow{to{stroke-dashoffset:-280}}
.divider{display:flex;justify-content:space-between;gap:20px;padding:20px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);color:var(--muted-foreground);font-size:12px}.divider span{display:flex;gap:12px;align-items:center}.divider b{color:var(--primary);font-size:16px;font-weight:400}
/* Portfolio and segmented filters */
.work{padding:76px 0 90px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:28px}h2{font-size:clamp(33px,3.6vw,48px);font-weight:600;line-height:1.16;letter-spacing:-.045em;margin:0}.section-head p{font-size:14px;line-height:1.75;max-width:36ch;color:var(--muted-foreground);margin:0}.filters{display:flex;align-items:center;gap:3px;width:fit-content;max-width:100%;padding:4px;margin:0 0 28px;background:var(--card);border:1px solid var(--border);border-radius:11px}.filters button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:38px;padding:8px 15px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--muted-foreground);font-size:12px;font-weight:500;transition:color .2s,background .2s,box-shadow .2s}.filters button span{font-size:10px;font-variant-numeric:tabular-nums;background:var(--secondary);border-radius:5px;min-width:20px;padding:0 4px}.filters button[aria-pressed=true]{background:var(--secondary);color:var(--primary);border-color:oklch(65% .075 86);box-shadow:0 1px 4px oklch(10% 0.022 216 / .25)}.filters button[aria-pressed=true] span{background:var(--primary);color:var(--primary-foreground)}.filters button:hover{color:var(--foreground)}
.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}.project{min-width:0}.project:not(.featured){display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:border-color .25s,transform .25s var(--ease),box-shadow .25s}.project:not(.featured):hover{border-color:oklch(46% 0.037 216);transform:translateY(-4px);box-shadow:0 14px 35px oklch(8% 0.022 216 / .2)}.screen{position:relative;display:block;overflow:hidden;aspect-ratio:1.6;padding:30px 9px 9px;background:oklch(30% 0.022 216);border-bottom:1px solid var(--border)}.screen:before{content:"";position:absolute;inset:0 0 auto;height:27px;display:flex;align-items:center;padding-left:51px;padding-right:10px;background:radial-gradient(circle at 13px 13px,oklch(46% 0.022 216) 2px,transparent 2.5px),radial-gradient(circle at 23px 13px,oklch(44% 0.022 216) 2px,transparent 2.5px),radial-gradient(circle at 33px 13px,oklch(39% 0.022 216) 2px,transparent 2.5px);color:var(--muted-foreground);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top;border-radius:7px;border:1px solid oklch(48% 0.022 216 / .15);transition:transform .5s var(--ease)}a.screen:hover img{transform:scale(1.035)}.launch{position:absolute;right:18px;bottom:18px;display:grid;place-items:center;width:31px;height:31px;border:1px solid oklch(63% 0.022 216 / .25);border-radius:8px;background:var(--background);color:var(--foreground);font-size:19px;transition:color .2s,border-color .2s,transform .25s var(--ease)}a.screen:hover .launch{color:var(--primary);border-color:var(--primary);transform:translate(2px,-2px)}.project-body{display:flex;flex-direction:column;gap:13px;padding:22px 22px 25px;flex:1}.project-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:11px;color:var(--muted-foreground);line-height:1.6}.tag{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:5px;padding:2px 7px;background:var(--secondary);color:var(--foreground);font-size:10px;font-weight:500;white-space:nowrap}.project h3{font-size:20px;line-height:1.3;font-weight:600;letter-spacing:-.035em;margin:0}.project h3 a{display:flex;align-items:center;justify-content:space-between;gap:10px}.project h3 a span[aria-hidden]{color:var(--muted-foreground);font-size:17px;font-weight:400}.project h3 a:hover{color:var(--primary)}.project p{font-size:14px;line-height:1.8;color:var(--muted-foreground);margin:0;max-width:60ch}.project[data-category=games] .tag{color:var(--accent)}
/* Featured project */
.featured{grid-column:1/-1;display:grid;grid-template-columns:.88fr 1.12fr;align-items:center;gap:64px;padding:44px;background:radial-gradient(ellipse at 90% 0,oklch(40% 0.065 86 / .2),transparent 65%),var(--card);border:1px solid oklch(43% 0.045 86);border-radius:20px;margin-bottom:12px;overflow:visible}.feature-label{display:inline-flex;align-items:center;gap:12px;color:var(--primary)!important;font-size:11px!important;font-weight:500;margin-bottom:19px!important;padding:4px 9px;border:1px solid oklch(40% 0.065 86);border-radius:5px;background:oklch(28% 0.04 86 / .4)}.featured h3{font-size:54px;line-height:1.08;letter-spacing:-.055em;font-weight:600;margin:0 0 20px}.featured p{font-size:15px;line-height:1.8;max-width:44ch}.feature-benefits{display:flex;flex-wrap:wrap;gap:10px 17px;list-style:none;padding:0;margin:22px 0 27px;font-size:10px;color:var(--muted-foreground)}.feature-benefits li:before{content:'✓ ';color:var(--primary)}.feature-preview{min-width:0;position:relative}.feature-screen{display:block;overflow:hidden;border:1px solid oklch(41% 0.03 86);border-radius:11px;background:var(--secondary);box-shadow:0 20px 45px oklch(7% 0.022 216 / .35);transition:transform .45s var(--ease),border-color .25s}.feature-screen:before{content:attr(data-site);display:block;height:29px;padding:6px 14px;color:var(--muted-foreground);font-size:10px;line-height:16px;border-bottom:1px solid var(--border)}.feature-screen img{display:block;width:100%;height:auto}.feature-screen:hover{transform:translateY(-4px);border-color:var(--primary)}.preview-trigger{display:flex;align-items:center;justify-content:center;gap:14px;margin:16px auto 0;padding:8px 13px;min-height:40px;border:1px solid var(--border);border-radius:7px;background:var(--background);color:var(--muted-foreground);font-size:11px;font-weight:500;transition:color .2s,border-color .2s}.preview-trigger:hover{color:var(--foreground);border-color:var(--muted-foreground)}
/* Expandable preview, kept in the browser top layer */
.dashboard-preview{position:fixed;inset:auto 0 24px;margin:0 auto;width:min(1240px,calc(100vw - 40px));max-height:calc(100dvh - 48px);overflow:auto;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--card);color:var(--foreground);box-shadow:0 18px 70px oklch(8% 0.022 216 / .65);opacity:0;transform:scale(.84);transform-origin:center bottom;transition:opacity .24s var(--ease),transform .24s var(--ease),display .24s allow-discrete,overlay .24s allow-discrete}.dashboard-preview::backdrop{background:transparent}.dashboard-preview:popover-open{opacity:1;transform:scale(1)}@starting-style{.dashboard-preview:popover-open{opacity:0;transform:scale(.84)}}.preview-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 12px;font-size:13px}.preview-close{min-height:40px;padding:8px 14px;border:1px solid var(--border);border-radius:7px;background:var(--secondary);color:var(--foreground);font-size:12px}.preview-close:hover{border-color:var(--muted-foreground)}.dashboard-preview img{display:block;width:100%;height:auto;border-radius:8px}
/* About and footer */
.about{display:grid;grid-template-columns:1fr 1fr;gap:90px;padding:72px 0 80px;border-top:1px solid var(--border)}.about .name{color:var(--primary);font-size:12px;font-weight:500;margin:0 0 19px}.about h2{max-width:14ch;font-size:clamp(32px,3.4vw,44px)}.about-copy p{max-width:56ch;color:var(--muted-foreground);font-size:14px;line-height:1.85;margin:0 0 18px}.about-copy p:first-child{font-size:19px;line-height:1.65;color:var(--foreground)}.footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0 30px;border-top:1px solid var(--border);color:var(--muted-foreground);font-size:10px}.footer a{padding:7px 0}.footer a:hover{color:var(--foreground)}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.hero{grid-template-columns:1.2fr .8fr;gap:16px;min-height:520px;padding:60px 0}h1{font-size:clamp(55px,7.3vw,82px)}.lead{font-size:15px}.byline{font-size:11px}.hero-art{margin-bottom:10px}.art-caption{display:none}.motion-toggle{font-size:9px}.projects{grid-template-columns:repeat(2,minmax(0,1fr))}.featured{gap:32px;padding:32px;grid-template-columns:.95fr 1.05fr}.featured h3{font-size:44px}.featured p{font-size:13px}.feature-benefits{gap:8px 12px;font-size:9px}.section-head p{font-size:13px}.about{gap:45px}.nav-links{gap:22px}}
@media(max-width:650px){.wrap{width:calc(100% - 36px)}nav{padding:20px 0;gap:14px}.brand{font-size:20px}.nav-links{gap:17px;font-size:11px}.nav-links .nav-button{display:none}.hero{grid-template-columns:1fr;gap:26px;padding:43px 0 30px;min-height:0}.byline{font-size:10px;margin-bottom:24px;padding:6px 10px}h1{font-size:clamp(49px,12.8vw,76px);letter-spacing:-.065em}.lead{font-size:15px;max-width:40ch;margin:23px 0 26px}.hero-actions{gap:20px}.primary{padding:11px 16px;gap:20px;font-size:12px;min-height:44px}.all-projects{font-size:11px}.hero-art{width:min(330px,100%);aspect-ratio:1.22;margin:0 auto}.hero-art svg{max-height:280px}.motion-toggle{bottom:0;min-height:30px}.divider{padding:17px 0;gap:16px;font-size:10px}.divider span{gap:8px}.divider span:last-child{display:none}.divider b{font-size:13px}.work{padding:48px 0 55px}.section-head{align-items:start;flex-direction:column;gap:15px;margin-bottom:24px}h2{font-size:34px;max-width:15ch}.section-head p{font-size:13px}.filters{width:100%;gap:1px;margin-bottom:23px;padding:3px}.filters button{flex:1;gap:6px;padding:7px 8px;font-size:10px;min-height:39px}.filters button span{font-size:9px;min-width:18px}.projects{grid-template-columns:1fr;gap:21px}.project-body{padding:20px}.screen{aspect-ratio:1.62}.project-meta{font-size:10px}.project h3{font-size:21px}.project p{font-size:13px}.featured{grid-template-columns:1fr;gap:28px;padding:25px 23px;margin-bottom:6px;border-radius:16px}.feature-label{font-size:10px!important;margin-bottom:17px!important}.featured h3{font-size:42px;margin-bottom:15px}.featured p{font-size:13px}.feature-benefits{font-size:9px;gap:8px 13px;margin:18px 0 23px}.feature-screen{box-shadow:0 10px 20px oklch(8% 0.022 216 / .25)}.preview-trigger{margin-top:14px;font-size:10px;min-height:40px}.about{grid-template-columns:1fr;gap:26px;padding:45px 0 40px}.about h2{max-width:15ch;font-size:34px}.about .name{margin-bottom:14px}.about-copy p:first-child{font-size:18px}.footer{flex-wrap:wrap;align-items:start;gap:10px 16px;font-size:9px}.footer span:nth-child(2){display:none}.dashboard-preview{inset:auto 0 16px;width:calc(100vw - 24px);padding:12px;max-height:calc(100dvh - 32px)}.preview-heading{font-size:11px}.dashboard-preview img{min-width:700px}.preview-close{min-height:40px;font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion-toggle{display:none}}

.window-label{position:absolute;top:6px;left:51px;right:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted-foreground);font-size:9px;line-height:16px}