:root{--color-surface: oklch(.13 .02 265);--color-surface-raised: oklch(.175 .018 265);--color-surface-raised-2: oklch(.21 .018 265);--color-surface-hover: oklch(.245 .02 265);--color-border: oklch(.28 .015 265);--color-border-strong: oklch(.35 .018 265);--color-text: oklch(.985 .004 95);--color-text-muted: oklch(.7 .012 265);--color-text-subtle: oklch(.52 .012 265);--color-primary: oklch(.7 .14 250);--color-primary-fg: oklch(.15 .02 265);--color-primary-hover: oklch(.745 .15 250);--hue-red: oklch(.78 .15 25);--hue-amber: oklch(.8 .15 75);--hue-green: oklch(.78 .13 145);--hue-teal: oklch(.78 .12 195);--hue-blue: oklch(.74 .14 250);--hue-purple: oklch(.78 .15 310);--cat-game: var(--hue-purple);--cat-blood: var(--hue-red);--cat-oxi: var(--hue-blue);--cat-md: var(--hue-teal);--cat-research: var(--hue-amber);--cat-app: var(--hue-green);--radius: 12px;--radius-sm: 8px;--max: 1120px;--gutter: 24px;--font-body: "SUIT Variable", -apple-system, BlinkMacSystemFont, "Pretendard", system-ui, sans-serif;--font-display: "SUITE Variable", var(--font-body);--font-mono: "Geist Mono", ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--color-surface);color:var(--color-text);font-family:var(--font-body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:inherit;text-decoration:none}img{max-width:100%}::selection{background:var(--color-primary);color:var(--color-primary-fg)}.site-header{max-width:var(--max);margin:0 auto;padding:28px var(--gutter) 0}.back{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:13px;color:var(--color-text-subtle);letter-spacing:.02em;transition:color .15s ease}.back:hover{color:var(--color-text)}main{max-width:var(--max);margin:0 auto;padding:24px var(--gutter) 56px}.site-footer{max-width:var(--max);margin:0 auto;padding:24px var(--gutter);border-top:1px solid var(--color-border);color:var(--color-text-subtle);font-size:12px;font-family:var(--font-mono);text-align:center;letter-spacing:.04em}.hero{margin-bottom:56px;padding-top:16px}.eyebrow{color:var(--color-primary);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-family:var(--font-mono);margin:0 0 20px}.hero h1{font-family:var(--font-display);font-size:clamp(40px,6vw,72px);line-height:1.02;margin:0 0 24px;font-weight:700;letter-spacing:-.04em;color:var(--color-text)}.lede{font-size:clamp(16px,1.8vw,19px);color:var(--color-text-muted);margin:0 0 36px;max-width:680px;line-height:1.6}.lede strong{color:var(--color-text);font-weight:600}.meta{margin-top:28px}.meta dl{display:grid;grid-template-columns:max-content 1fr;gap:10px 22px;margin:0}.meta dt{color:var(--color-text-subtle);font-weight:500;font-family:var(--font-mono);font-size:13px}.meta dd{margin:0;color:var(--color-text)}.hero-links{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px}.hero-link{display:inline-flex;align-items:center;gap:6px;background:var(--color-surface-raised);border:1px solid var(--color-border);color:var(--color-text);font-size:13px;font-weight:600;padding:8px 14px;border-radius:var(--radius-sm);text-decoration:none;transition:border-color .15s,background .15s,color .15s}.hero-link:hover{border-color:var(--color-primary);background:var(--color-surface-raised-2);color:var(--color-text);text-decoration:none}.hero-link .arrow{color:var(--color-text-subtle);font-size:11px;line-height:1;transition:color .15s,transform .15s}.hero-link:hover .arrow{color:var(--color-primary);transform:translate(1px,-1px)}.hero-link[data-tone=primary]{border-color:color-mix(in oklch,var(--color-primary) 50%,var(--color-border));background:color-mix(in oklch,var(--color-primary) 12%,var(--color-surface-raised))}.hero-link[data-tone=primary]:hover{border-color:var(--color-primary);background:color-mix(in oklch,var(--color-primary) 18%,var(--color-surface-raised))}.section{padding:40px 0;border-top:1px solid var(--color-border)}.section:first-of-type{border-top:none}.section h2{font-family:var(--font-display);font-size:28px;font-weight:700;letter-spacing:-.02em;margin:0 0 16px;color:var(--color-text)}.section h3{font-size:20px;font-weight:600;margin:28px 0 12px;color:var(--color-text)}.section h4{font-size:16px;font-weight:600;margin:20px 0 8px;color:var(--color-text)}.section-sub{color:var(--color-text-muted);margin:-8px 0 20px;font-size:15px}.section p{margin:0 0 14px;color:var(--color-text)}.section ul,.section ol{padding-left:22px;margin:0 0 16px}.section li{margin-bottom:6px;color:var(--color-text)}.section li::marker{color:var(--color-text-subtle)}.section em{font-style:normal;color:var(--color-primary);font-weight:500}.section strong{color:var(--color-text);font-weight:600}.figure{margin:20px 0;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);padding:14px}.figure img{display:block;width:100%;height:auto;border-radius:var(--radius-sm)}.figure figcaption{margin-top:12px;font-size:13px;color:var(--color-text-muted);line-height:1.55}.figure figcaption code{font-size:12px}.figure-graph{background:transparent;border:none;padding:0;margin:18px 0 20px}.figure-graph img{max-width:800px;margin:0 auto;background:var(--color-surface);border-radius:var(--radius)}.caption{font-size:13px;color:var(--color-text-subtle);margin:12px 0 0}pre,code,kbd{font-family:var(--font-mono)}.code{background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:14px 16px;margin:16px 0;overflow-x:auto}.code code{font-size:13px;color:var(--color-text);white-space:pre;line-height:1.6}:not(pre)>code,:not(.code)>code{background:var(--color-surface-raised);padding:2px 6px;border-radius:5px;font-size:.88em;color:var(--color-text-muted)}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}.result-card{background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);padding:18px}.result-card h4{margin-top:0}.result-card ul{margin:0;padding-left:18px}.result-card li{font-size:14px}.callout{background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);padding:16px 18px;margin:20px 0;color:var(--color-text-muted);line-height:1.6}.callout strong{color:var(--color-text)}.callout em{color:var(--color-primary);font-style:normal}.repo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:20px 0}.repo-card{display:block;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);padding:18px;transition:border-color .15s,background .15s,transform .15s}.repo-card:hover{border-color:var(--color-border-strong);background:var(--color-surface-raised-2);transform:translateY(-2px)}.repo-card h4{margin:0 0 8px;font-size:16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.repo-card p{margin:0 0 12px;font-size:14px;color:var(--color-text-muted)}.repo-card code{font-size:12px;color:var(--color-text-subtle)}.badge{font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:999px;background:var(--color-surface-hover);color:var(--color-text-muted);border:1px solid var(--color-border)}.paper-link{display:inline-flex;align-items:center;gap:8px;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);padding:12px 18px;font-weight:500;transition:border-color .15s,background .15s}.paper-link:hover{border-color:var(--color-border-strong);background:var(--color-surface-raised-2)}.container{max-width:var(--max);margin:0 auto;padding:72px var(--gutter) 56px}.hero-top{display:flex;align-items:center;gap:10px;margin-bottom:20px}.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--color-primary)}.container .hero h1{font-family:var(--font-display);font-size:clamp(48px,8vw,96px);line-height:.98;margin:0 0 28px;font-weight:700;letter-spacing:-.04em;color:var(--color-text)}.container .hero{margin-bottom:64px}.works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.work-card{position:relative;display:flex;flex-direction:column;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);overflow:hidden;transition:border-color .18s,background .18s,transform .18s;will-change:transform}.work-card:hover{border-color:var(--color-border-strong);background:var(--color-surface-raised-2);transform:translateY(-3px)}.work-card:hover .thumb img{transform:scale(1.04)}.thumb-tag{position:absolute;bottom:10px;left:10px;padding:4px 9px;background:#04070fc7;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid oklch(1 0 0 / .08);border-radius:999px;font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--color-text);z-index:1}.thumb{position:relative;background:var(--color-surface);aspect-ratio:1 / 1;overflow:hidden;border-bottom:1px solid var(--color-border)}.thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}.work-meta{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px;flex:1}.work-meta h2{font-family:var(--font-display);font-size:20px;margin:0;font-weight:700;letter-spacing:-.015em;line-height:1.25;color:var(--color-text)}.work-meta p{margin:0;color:var(--color-text-muted);font-size:14px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.work-footer{margin-top:auto;padding-top:12px;display:flex;align-items:center;justify-content:space-between;font-family:var(--font-mono);font-size:12px;color:var(--color-text-subtle);letter-spacing:.02em}.cta{color:var(--color-primary);font-weight:600;display:inline-flex;align-items:center;gap:4px;transition:gap .15s ease}.work-card:hover .cta{gap:8px}.work-card[data-cat~=oxi] .cta{color:var(--cat-oxi)}.work-card[data-cat~=md] .cta{color:var(--cat-md)}.work-card[data-cat~=blood] .cta{color:var(--cat-blood)}.work-card[data-cat~=game] .cta{color:var(--cat-game)}.work-card[data-cat~=research] .cta{color:var(--cat-research)}.work-card[data-cat~=app] .cta{color:var(--cat-app)}@media(max-width:920px){.works{grid-template-columns:repeat(2,minmax(0,1fr))}.repo-grid{grid-template-columns:1fr}}@media(max-width:720px){main{padding:20px var(--gutter) 40px}.section h2{font-size:24px}.result-grid{grid-template-columns:1fr}}@media(max-width:640px){.container{padding:56px 20px 40px}.works{grid-template-columns:1fr;gap:18px}.container .hero{margin-bottom:48px}}
