@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}:root{--font-display: "Clash Display", "Satoshi", system-ui, sans-serif;--font-body: "Satoshi", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;--maxw: 1180px;--gutter: clamp(1.25rem, 4vw, 4rem);--radius: 18px;--radius-sm: 12px;--ease: cubic-bezier(.22, 1, .36, 1)}html[data-theme=dark]{--bg: #06070a;--bg-soft: #0a0c11;--surface: #11141b;--surface-2: #161b24;--border: rgba(255, 255, 255, .09);--border-strong: rgba(255, 255, 255, .16);--text: #e9ecf2;--text-dim: #9aa3b3;--text-mute: #626b7b;--accent: #2fe6a8;--accent-2: #6ea8fe;--accent-ink: #04130d;--glow: rgba(47, 230, 168, .3);--grid: rgba(255, 255, 255, .035);--shadow: 0 30px 80px -30px rgba(0, 0, 0, .8);color-scheme:dark}html[data-theme=light]{--bg: #f5f5f1;--bg-soft: #eeeee8;--surface: #ffffff;--surface-2: #f4f4ef;--border: rgba(12, 14, 22, .1);--border-strong: rgba(12, 14, 22, .18);--text: #14171d;--text-dim: #4c525e;--text-mute: #8a909e;--accent: #0a9468;--accent-2: #2f6df0;--accent-ink: #ffffff;--glow: rgba(10, 148, 104, .18);--grid: rgba(12, 14, 22, .04);--shadow: 0 30px 70px -34px rgba(20, 30, 45, .3);color-scheme:light}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:17px;line-height:1.6;font-weight:450;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;transition:background .5s var(--ease),color .4s var(--ease)}h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.02;letter-spacing:-.02em;margin:0}a{color:inherit;text-decoration:none}::selection{background:var(--accent);color:var(--accent-ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}.btn:focus-visible,.contact-links a:focus-visible,.proj:focus-visible{outline-offset:4px}.skip-link{position:absolute;left:50%;top:-60px;transform:translate(-50%);z-index:100;background:var(--accent);color:var(--accent-ink);font-family:var(--font-mono);font-size:.85rem;padding:.6rem 1.1rem;border-radius:0 0 12px 12px;transition:top .25s var(--ease)}.skip-link:focus-visible{top:0;outline:none}.bg-fx{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden}.bg-fx:before{content:"";position:absolute;inset:-20%;background:radial-gradient(40% 35% at 18% 12%,var(--glow),transparent 70%),radial-gradient(34% 30% at 84% 8%,color-mix(in oklab,var(--accent-2) 40%,transparent),transparent 72%),radial-gradient(50% 45% at 70% 92%,var(--glow),transparent 75%);filter:blur(20px);opacity:.9;animation:drift 26s var(--ease) infinite alternate}@keyframes drift{to{transform:translate3d(-3%,2%,0) scale(1.08)}}.bg-grid{position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 35%,transparent 85%);mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 35%,transparent 85%)}.bg-grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.04;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}.section{position:relative;padding-block:clamp(5rem,11vh,9rem)}.eyebrow{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);display:inline-flex;align-items:center;gap:.6rem}.eyebrow:before{content:"";width:26px;height:1px;background:var(--accent);opacity:.7}.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:clamp(2.2rem,5vw,3.5rem);flex-wrap:wrap}.sec-head h2{font-size:clamp(2rem,5vw,3.4rem);margin-top:.9rem}.sec-head .idx{font-family:var(--font-mono);font-size:.8rem;color:var(--text-mute)}.btn{--pad: .85rem 1.5rem;display:inline-flex;align-items:center;gap:.6rem;padding:var(--pad);border-radius:999px;font-weight:600;font-size:.95rem;border:1px solid transparent;cursor:pointer;transition:transform .35s var(--ease),background .3s,border-color .3s,color .3s;will-change:transform}.btn:hover{transform:translateY(-3px)}.btn-primary{background:var(--accent);color:var(--accent-ink);box-shadow:0 14px 40px -14px var(--glow)}.btn-ghost{background:transparent;border-color:var(--border-strong);color:var(--text)}.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}.nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .4s var(--ease),border-color .4s,backdrop-filter .4s;border-bottom:1px solid transparent}.nav.scrolled{background:color-mix(in oklab,var(--bg) 72%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);border-bottom-color:var(--border)}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:68px}.brand{font-family:var(--font-display);font-weight:600;font-size:1.15rem;letter-spacing:-.02em;display:inline-flex;align-items:center;gap:.55rem}.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--glow);animation:pulse 2.6s ease-in-out infinite}@keyframes pulse{50%{box-shadow:0 0 0 8px transparent}}.nav-links{display:flex;align-items:center;gap:2rem}.nav-links a{font-size:.9rem;color:var(--text-dim);font-family:var(--font-mono);letter-spacing:.02em;position:relative;transition:color .25s}.nav-links a:after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:1.5px;background:var(--accent);transition:width .3s var(--ease)}.nav-links a:hover{color:var(--text)}.nav-links a:hover:after{width:100%}.theme-toggle{width:42px;height:42px;border-radius:50%;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);display:grid;place-items:center;cursor:pointer;transition:transform .4s var(--ease),border-color .3s,color .3s}.theme-toggle:hover{transform:rotate(20deg) scale(1.08);border-color:var(--accent);color:var(--accent)}.theme-toggle svg{width:18px;height:18px}.nav-burger{display:none}.hero{min-height:100svh;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:clamp(1rem,4vw,3rem);padding-top:68px;position:relative}.hero-visual{position:relative;width:100%;align-self:center}@media(max-width:940px){.hero{grid-template-columns:1fr;gap:1rem;padding-top:90px;min-height:auto;padding-bottom:3rem}.hero-visual{order:-1;max-width:460px;margin-inline:auto}.hero .scroll-hint{display:none}}.hero-tag{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-mono);font-size:.78rem;color:var(--text-dim);border:1px solid var(--border);background:color-mix(in oklab,var(--surface) 60%,transparent);padding:.45rem .9rem;border-radius:999px}.hero-tag .live{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 var(--glow);animation:pulse 2.2s infinite}.hero h1{font-size:clamp(2.6rem,5.4vw,4.7rem);margin-top:1.5rem;letter-spacing:-.035em}.hero h1 .grad{background:linear-gradient(100deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.hero-sub{margin-top:1.6rem;max-width:46ch;font-size:clamp(1.05rem,2.2vw,1.3rem);color:var(--text-dim)}.hero-sub b{color:var(--text);font-weight:700}.hero-cta{margin-top:2.4rem;display:flex;gap:1rem;flex-wrap:wrap}.hero-meta{margin-top:3rem;display:flex;gap:clamp(1.5rem,4vw,3.2rem);flex-wrap:wrap;font-family:var(--font-mono);font-size:.82rem;color:var(--text-mute)}.hero-meta span b{display:block;font-family:var(--font-display);font-size:1.7rem;color:var(--text);font-weight:600}.scroll-hint{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);font-family:var(--font-mono);font-size:.7rem;letter-spacing:.2em;color:var(--text-mute);text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:.6rem}.scroll-hint .line{width:1px;height:40px;background:linear-gradient(var(--accent),transparent);animation:scrolly 2s var(--ease) infinite}@keyframes scrolly{0%{transform:scaleY(0);transform-origin:top}40%{transform:scaleY(1);transform-origin:top}60%{transform:scaleY(1);transform-origin:bottom}to{transform:scaleY(0);transform-origin:bottom}}.marquee{border-block:1px solid var(--border);padding-block:1.3rem;overflow:hidden;display:flex;-webkit-user-select:none;user-select:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}.marquee-track{display:flex;gap:3rem;white-space:nowrap;padding-right:3rem;animation:scrollx 32s linear infinite}.marquee:hover .marquee-track{animation-play-state:paused}@keyframes scrollx{to{transform:translate(-50%)}}.marquee-track span{font-family:var(--font-display);font-size:clamp(1.1rem,2.6vw,1.7rem);font-weight:500;color:var(--text-dim);display:inline-flex;align-items:center;gap:3rem}.marquee-track span:after{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}.about-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}.about-lead{font-family:var(--font-display);font-weight:500;font-size:clamp(1.4rem,3vw,2.1rem);line-height:1.32;letter-spacing:-.02em}.about-lead em{font-style:normal;color:var(--accent)}.about-body p{color:var(--text-dim);margin:0 0 1.1rem}.about-card{border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem;background:color-mix(in oklab,var(--surface) 65%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.about-card h4{font-family:var(--font-mono);font-weight:500;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-mute);margin-bottom:1rem}.kv{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-top:1px solid var(--border);font-size:.95rem}.kv:first-of-type{border-top:0}.kv .k{color:var(--text-mute);font-family:var(--font-mono);font-size:.84rem}.kv .v{color:var(--text);font-weight:600;text-align:right}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:3rem}.stat{border:1px solid var(--border);border-radius:var(--radius-sm);padding:1.6rem 1.4rem;background:color-mix(in oklab,var(--surface) 50%,transparent);position:relative;overflow:hidden}.stat:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 0% 0%,var(--glow),transparent 60%);opacity:0;transition:opacity .4s}.stat:hover:before{opacity:1}.stat .num{font-family:var(--font-display);font-size:clamp(2.1rem,5vw,3rem);font-weight:600;line-height:1;letter-spacing:-.03em}.stat .lbl{margin-top:.6rem;font-size:.82rem;color:var(--text-dim);font-family:var(--font-mono)}.timeline{position:relative;display:grid;gap:0}.tl-item{display:grid;grid-template-columns:180px 1fr;gap:2rem;padding:2rem 0;border-top:1px solid var(--border);position:relative;transition:padding-left .4s var(--ease)}.tl-item:hover{padding-left:1rem}.tl-item:last-child{border-bottom:1px solid var(--border)}.tl-when{font-family:var(--font-mono);font-size:.82rem;color:var(--text-mute);padding-top:.4rem}.tl-when .badge{display:inline-block;margin-top:.6rem;font-size:.68rem;padding:.2rem .55rem;border-radius:999px;background:var(--glow);color:var(--accent);letter-spacing:.05em}.tl-role{font-family:var(--font-display);font-size:clamp(1.3rem,3vw,1.8rem);font-weight:600}.tl-co{color:var(--accent);font-weight:600}.tl-desc{margin-top:.7rem;color:var(--text-dim);max-width:60ch}.tl-tags{margin-top:1rem;display:flex;flex-wrap:wrap;gap:.5rem}.tag{font-family:var(--font-mono);font-size:.74rem;padding:.3rem .7rem;border:1px solid var(--border);border-radius:999px;color:var(--text-dim)}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.skill-col{border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem;background:color-mix(in oklab,var(--surface) 45%,transparent);transition:transform .4s var(--ease),border-color .3s}.skill-col:hover{transform:translateY(-5px);border-color:var(--border-strong)}.skill-col h4{font-family:var(--font-display);font-size:1.2rem;margin-bottom:.4rem}.skill-col .cat{font-family:var(--font-mono);font-size:.72rem;color:var(--accent);letter-spacing:.1em;text-transform:uppercase}.skill-col ul{list-style:none;margin:1.1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}.skill-col li{font-size:.9rem;padding:.4rem .75rem;border-radius:8px;background:var(--surface-2);color:var(--text-dim);border:1px solid var(--border);transition:color .2s,border-color .2s}.skill-col li:hover{color:var(--accent);border-color:var(--accent)}.proj-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}.proj{position:relative;border:1px solid var(--border);border-radius:var(--radius);padding:1.8rem;background:color-mix(in oklab,var(--surface) 55%,transparent);overflow:hidden;transition:transform .45s var(--ease),border-color .3s;display:flex;flex-direction:column;min-height:220px}.proj:after{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 100% 0%,var(--glow),transparent 60%);opacity:0;transition:opacity .45s;pointer-events:none}.proj:hover{transform:translateY(-6px);border-color:var(--border-strong)}.proj:hover:after{opacity:1}.proj.feat{grid-column:span 2;min-height:250px}.proj.feat:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(120deg,var(--accent),transparent 40%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.5;pointer-events:none}.proj-feat-tag{align-self:flex-start;margin-top:1.4rem;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);padding:.25rem .6rem;border-radius:999px;background:var(--glow)}.proj.feat h3{margin-top:.8rem}.proj-top{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.proj-num{font-family:var(--font-mono);font-size:.78rem;color:var(--text-mute)}.proj-top-right{display:inline-flex;align-items:center;gap:.7rem}.proj-lang,.proj-star{font-family:var(--font-mono);font-size:.74rem;color:var(--text-dim);display:inline-flex;align-items:center;gap:.32rem;white-space:nowrap}.proj-star svg{color:#f5b94a}.lang-dot{width:9px;height:9px;border-radius:50%;background:var(--text-mute);flex-shrink:0}.lang-dot[data-lang=Go]{background:#00add8}.lang-dot[data-lang=TypeScript]{background:#3178c6}.lang-dot[data-lang=PHP]{background:#777bb4}.lang-dot[data-lang=Python]{background:#3776ab}.lang-dot[data-lang=JavaScript]{background:#f1e05a}.lang-dot[data-lang=Svelte]{background:#ff3e00}.lang-dot[data-lang=Spec]{background:var(--accent)}.proj-arrow{width:38px;height:38px;border-radius:50%;border:1px solid var(--border-strong);display:grid;place-items:center;transition:transform .4s var(--ease),background .3s,color .3s;flex-shrink:0}.proj:hover .proj-arrow{background:var(--accent);color:var(--accent-ink);transform:rotate(-45deg)}.proj h3{font-size:clamp(1.4rem,3vw,1.9rem);margin-top:1.4rem}.proj p{margin:.7rem 0 0;color:var(--text-dim);font-size:.96rem;max-width:56ch}.proj-stack{margin-top:auto;padding-top:1.4rem;display:flex;flex-wrap:wrap;gap:.45rem}.proj-stack span{font-family:var(--font-mono);font-size:.72rem;color:var(--text-mute)}.proj-stack span:not(:last-child):after{content:"\b7";margin-left:.45rem;color:var(--border-strong)}.os-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}.os-lead{font-family:var(--font-display);font-weight:500;font-size:clamp(1.25rem,2.6vw,1.8rem);line-height:1.36;letter-spacing:-.02em}.os-lead b{color:var(--accent);font-weight:600}.os-stats{margin-top:2.4rem}.os-langs{margin-top:1.6rem;display:flex;flex-wrap:wrap;gap:.5rem}.os-langs span{font-family:var(--font-mono);font-size:.8rem;padding:.4rem .8rem;border:1px solid var(--border);border-radius:999px;color:var(--text-dim);background:var(--surface-2)}.os-card{border:1px solid var(--border);border-radius:var(--radius);padding:1.8rem;background:color-mix(in oklab,var(--surface) 65%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:relative;overflow:hidden}.os-card:after{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 100% 0%,var(--glow),transparent 60%);opacity:.5;pointer-events:none}.os-card-top{display:flex;align-items:center;gap:.7rem;font-family:var(--font-mono);font-size:1rem;font-weight:600;color:var(--text)}.os-card-top svg{color:var(--accent)}.os-card p{position:relative;margin:1.1rem 0 1.6rem;color:var(--text-dim);font-size:.96rem}.os-cta{position:relative}@media(max-width:900px){.os-grid{grid-template-columns:1fr}}.contact{text-align:center}.contact h2{font-size:clamp(2.6rem,8vw,6rem);letter-spacing:-.04em}.contact h2 a{background:linear-gradient(100deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent;transition:opacity .3s}.contact h2 a:hover{opacity:.75}.contact p{max-width:48ch;margin:1.4rem auto 0;color:var(--text-dim);font-size:1.1rem}.contact-links{margin-top:2.6rem;display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.contact-links a{font-family:var(--font-mono);font-size:.9rem;padding:.75rem 1.3rem;border:1px solid var(--border-strong);border-radius:999px;color:var(--text-dim);transition:color .3s,border-color .3s,transform .3s var(--ease)}.contact-links a:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-3px)}.footer{border-top:1px solid var(--border);padding-block:2.4rem}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap;font-family:var(--font-mono);font-size:.8rem;color:var(--text-mute)}.footer-inner a:hover{color:var(--accent)}.reveal{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.reveal.in{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.bg-fx:before,.marquee-track,.scroll-hint .line,.brand .dot,.hero-tag .live{animation:none!important}}@media(max-width:900px){.about-grid,.skills-grid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){body{font-size:16px}.nav-links{display:none}.nav-burger{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);cursor:pointer}.nav-actions{display:flex;gap:.6rem;align-items:center}.proj-grid{grid-template-columns:1fr}.proj.feat{grid-column:span 1}.tl-item{grid-template-columns:1fr;gap:.6rem}.tl-when{display:flex;align-items:center;gap:.8rem}.tl-when .badge{margin-top:0}}.msheet{position:fixed;inset:0;z-index:49;background:color-mix(in oklab,var(--bg) 96%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.8rem;opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}.msheet.open{opacity:1;pointer-events:auto}.msheet a{font-family:var(--font-display);font-size:2rem;color:var(--text)}.msheet a:hover{color:var(--accent)}
