:root{--bg:#e8eef2;--bg-deep:#d2dde6;--ink:#0c1a28;--ink-soft:#3a4f63;--line:#0c1a281f;--accent:#0a6e68;--accent-deep:#055550;--accent-hot:#e85d04;--surface:#ffffff94;--font-display:"Sora", "Noto Sans SC", sans-serif;--font-body:"Noto Sans SC", system-ui, sans-serif;--pad:clamp(1.25rem, 4vw, 3.5rem);--max:68rem}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--ink);font-family:var(--font-body);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-size:1rem;line-height:1.65;overflow-x:hidden}a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}button{font:inherit;color:inherit;cursor:pointer}#app{isolation:isolate;position:relative}.atmosphere{z-index:-2;background:radial-gradient(ellipse 70% 50% at 8% -5%, #0a6e6847, transparent 55%), radial-gradient(ellipse 55% 40% at 95% 5%, #e85d041f, transparent 50%), linear-gradient(160deg, #f3f7f9 0%, var(--bg) 45%, var(--bg-deep) 100%);position:fixed;inset:0}.atmosphere:after{content:"";opacity:.28;background-image:linear-gradient(#0c1a280d 1px,#0000 1px),linear-gradient(90deg,#0c1a280d 1px,#0000 1px);background-size:56px 56px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 70%);mask-image:linear-gradient(#000,#0000 70%)}.pointer-glow{z-index:-1;pointer-events:none;opacity:.85;will-change:transform;background:radial-gradient(circle,#0a6e6829,#0000 68%);border-radius:50%;width:360px;height:360px;transition:transform 80ms linear;position:fixed;top:0;left:0}.topbar{z-index:20;padding:1rem var(--pad);justify-content:space-between;align-items:center;gap:1rem;transition:background .25s,-webkit-backdrop-filter .25s,backdrop-filter .25s,box-shadow .25s;display:flex;position:sticky;top:0}.topbar.is-scrolled{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line);background:#e8eef2d6}.brand{font-family:var(--font-display);letter-spacing:.02em;font-size:1.05rem;font-weight:700;text-decoration:none}.nav{flex-wrap:wrap;gap:.85rem 1.2rem;font-size:.92rem;display:flex}.nav a{color:var(--ink-soft);text-decoration:none}.nav a:hover{color:var(--accent-deep)}.hero{min-height:min(100vh,54rem);padding:clamp(4.5rem, 12vh, 7rem) var(--pad) clamp(2.5rem, 6vh, 4rem);grid-template-columns:1fr;align-items:center;gap:clamp(1.5rem,4vw,3rem);display:grid}.hero-copy{text-align:center;flex-direction:column;align-items:center;display:flex}.hero-brand{font-family:var(--font-display);letter-spacing:-.03em;margin:0 0 .65rem;font-size:clamp(2.6rem,8vw,4.8rem);font-weight:700;line-height:1.02;animation:.85s both rise}.hero h1{max-width:18ch;font-family:var(--font-display);letter-spacing:-.02em;margin:0 auto;font-size:clamp(1.45rem,3.4vw,2.2rem);font-weight:650;line-height:1.25;animation:.85s 80ms both rise}.hero-lead{max-width:34rem;color:var(--ink-soft);margin:1rem auto 0;font-size:clamp(.98rem,1.8vw,1.1rem);animation:.85s .16s both rise}.hero-cta{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:1.6rem;animation:.85s .24s both rise;display:flex}.btn{border-radius:.3rem;justify-content:center;align-items:center;padding:.72rem 1.2rem;font-size:.95rem;font-weight:650;text-decoration:none;transition:transform .2s,background .2s;display:inline-flex}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--accent);color:#f4fffd}.btn-primary:hover{background:var(--accent-deep)}.btn-ghost{box-shadow:inset 0 0 0 1px var(--line);background:0 0}.btn-ghost:hover{box-shadow:inset 0 0 0 1px var(--accent);color:var(--accent-deep)}.pagenav-dock{top:50%;right:var(--pad);z-index:15;align-items:center;gap:.6rem;animation:.9s .2s both rise-center;display:flex;position:fixed;transform:translateY(-50%)}.pagenav{color:#e8f2f0;transform-origin:100%;opacity:0;visibility:hidden;pointer-events:none;background:#0c1a28eb;border-radius:.85rem;flex:none;width:min(22rem,100vw - 8rem);transition:opacity .24s,transform .24s,visibility .24s;overflow:hidden;transform:translate(.7rem)scale(.96);box-shadow:0 24px 60px #0c1a2838,0 0 0 1px #ffffff0f}.pagenav-dock:hover .pagenav,.pagenav-dock:focus-within .pagenav,.pagenav-dock[data-open] .pagenav{opacity:1;visibility:visible;pointer-events:auto;transform:none}.pagenav-toggle{color:#e8f2f0;background:#0c1a28eb;border:none;border-radius:.85rem;flex-direction:column;flex:none;align-items:center;gap:.34rem;width:2.9rem;padding:.66rem 0 .58rem;transition:background .22s,transform .22s;display:flex;box-shadow:0 18px 44px #0c1a283d,0 0 0 1px #ffffff0f}.pagenav-toggle:hover{background:#0c1a28;transform:translate(-2px)}.pagenav-toggle:focus-visible{outline-offset:2px;outline:2px solid #7ef0e2bf}.pagenav-toggle-icon{flex-direction:column;gap:3px;width:1.05rem;display:flex}.pagenav-toggle-icon i{opacity:.8;background:currentColor;border-radius:2px;height:1.5px;display:block}.pagenav-toggle-icon i:nth-child(2){width:68%}.pagenav-toggle-idx{font-family:var(--font-display);letter-spacing:.06em;color:#7ef0e2d9;font-variant-numeric:tabular-nums;font-size:.6rem;font-weight:650}.pagenav-bar{letter-spacing:.04em;color:#e8f2f0a6;background:#ffffff0a;border-bottom:1px solid #ffffff14;align-items:center;gap:.5rem;padding:.7rem 1rem;font-size:.78rem;display:flex}.pagenav-dot{background:#3dd6c6;border-radius:50%;flex-shrink:0;width:.45rem;height:.45rem;animation:2.4s ease-in-out infinite pulse;box-shadow:0 0 0 4px #3dd6c633}.pagenav-label{flex:1}.pagenav-count{font-family:var(--font-display);letter-spacing:.08em;color:#7ef0e2bf;font-variant-numeric:tabular-nums;font-size:.72rem}.pagenav-list{gap:.15rem;max-height:calc(100vh - 8rem);margin:0;padding:.55rem;list-style:none;display:grid;overflow-y:auto}.pagenav-item{color:#e8f2f0b8;border-radius:.5rem;align-items:center;gap:.7rem;padding:.58rem .75rem;text-decoration:none;transition:background .22s,color .22s;display:flex;position:relative}.pagenav-item:hover{color:#e8f2f0;background:#ffffff0f}.pagenav-item:focus-visible{outline-offset:-2px;outline:2px solid #7ef0e2b3}.pagenav-item.is-active{color:#7ef0e2;background:#7ef0e21f}.pagenav-idx{font-family:var(--font-display);letter-spacing:.08em;color:#e8f2f052;font-variant-numeric:tabular-nums;flex-shrink:0;font-size:.7rem;font-weight:650;transition:color .22s}.pagenav-item.is-active .pagenav-idx{color:#7ef0e2}.pagenav-text{flex-direction:column;min-width:0;line-height:1.3;display:flex}.pagenav-text strong{font-size:.92rem;font-weight:650}.pagenav-text em{color:#e8f2f06b;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;font-style:normal;transition:color .22s;overflow:hidden}.pagenav-item.is-active .pagenav-text em{color:#7ef0e2ad}.pagenav-rail{background:#7ef0e2;border-radius:2px;width:2px;height:0;transition:height .24s;position:absolute;top:50%;left:0;transform:translateY(-50%)}.pagenav-item.is-active .pagenav-rail{height:58%}.spotlight{padding:clamp(3.5rem, 9vh, 6rem) var(--pad);scroll-margin-top:4rem;position:relative;overflow:hidden}.spotlight-glow{pointer-events:none;background:radial-gradient(#0a6e682e,#0000 70%);height:55%;position:absolute;inset:10% 5% auto}.spotlight-inner{max-width:var(--max);margin:0 auto;position:relative}.eyebrow{letter-spacing:.06em;color:var(--accent-deep);margin:0 0 .65rem;font-size:.82rem;font-weight:700}.spotlight-title{font-family:var(--font-display);letter-spacing:-.03em;margin:0;font-size:clamp(1.9rem,4.2vw,2.8rem);line-height:1.15}.spotlight-hook{max-width:40rem;color:var(--ink);margin:.75rem 0 0;font-size:clamp(1.05rem,2.2vw,1.25rem);font-weight:600;line-height:1.45}.spotlight-desc{max-width:42rem;color:var(--ink-soft);margin:.85rem 0 0;font-size:1.02rem;line-height:1.75}.spotlight-video{max-width:48rem;margin-top:1.5rem}.spotlight-video video{aspect-ratio:16/9;object-fit:contain;background:#0c1a28;width:100%;display:block}.spotlight-video-cap{color:var(--ink-soft);margin:.55rem 0 0;font-size:.85rem}.impact-row{border-top:1px solid var(--line);border-bottom:1px solid var(--line);grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;max-width:36rem;margin-top:1.75rem;padding:1.1rem 0;display:grid}.impact-cell strong{font-family:var(--font-display);letter-spacing:-.02em;color:var(--accent-deep);font-size:clamp(1.5rem,3vw,2rem);display:block}.impact-cell span{color:var(--ink-soft);font-size:.85rem}.focus-heading{font-family:var(--font-display);letter-spacing:.02em;color:var(--ink);margin:2rem 0 .85rem;font-size:1.05rem;font-weight:700}.focus-list{gap:0;max-width:44rem;display:grid}.focus-item{border-top:1px solid var(--line);padding:1rem 0}.focus-item:last-child{border-bottom:1px solid var(--line)}.focus-item h4{font-family:var(--font-display);color:var(--accent-deep);margin:0 0 .35rem;font-size:1rem}.focus-item p{color:var(--ink-soft);margin:0;line-height:1.7}.spotlight-cta{flex-wrap:wrap;align-items:center;gap:.85rem 1.25rem;margin-top:1.75rem;display:flex}.stack{flex-wrap:wrap;gap:.4rem .55rem;margin:0;padding:0;list-style:none;display:flex}.stack-inline{width:100%;margin-top:.25rem}.stack li{color:var(--ink-soft);border-bottom:1px solid #0a6e6859;font-size:.8rem}.text-link{color:var(--accent-deep);border-bottom:1px solid #0a6e6859;font-weight:700;text-decoration:none}.text-link:hover{border-bottom-color:var(--accent-deep)}.soon{color:var(--ink-soft);opacity:.65;font-size:.9em}.section{padding:clamp(3rem, 7vh, 4.5rem) var(--pad);scroll-margin-top:4rem}.section-alt{background:var(--surface);border-block:1px solid var(--line)}.section-head{max-width:var(--max);margin:0 auto 1.5rem}.section-head h2{font-family:var(--font-display);letter-spacing:-.02em;margin:0 0 .4rem;font-size:clamp(1.5rem,3vw,2rem)}.section-head p{color:var(--ink-soft);max-width:36rem;margin:0}.work-list,.repo-grid,.demo-grid,.exp-list,.skill-groups,.edu,.contact-row,.social{max-width:var(--max);margin-left:auto;margin-right:auto}.work-list{gap:0;display:grid}.work-item{border-top:1px solid var(--line);padding:1.5rem 0}.work-item:last-child{border-bottom:1px solid var(--line)}.work-meta{flex-wrap:wrap;gap:.6rem 1rem;margin-bottom:.4rem;font-size:.82rem;display:flex}.work-tag{color:var(--accent-deep);font-weight:700}.work-status{color:var(--ink-soft)}.work-title-row{flex-wrap:wrap;align-items:center;gap:.55rem .75rem;display:flex}.work-item h3{font-family:var(--font-display);margin:0;font-size:1.3rem}.work-online-btn{color:var(--accent-deep);background:#0a6e681f;border:1px solid #0a6e6859;border-radius:.45rem;flex-shrink:0;justify-content:center;align-items:center;padding:.28rem .7rem;font-size:.78rem;font-weight:700;line-height:1.2;text-decoration:none;transition:background .15s,border-color .15s,color .15s;display:inline-flex}.work-online-btn:hover{border-color:var(--accent-deep);color:var(--accent-deep);background:#0a6e6833;text-decoration:none}.work-hook{color:var(--ink);max-width:42rem;margin:.4rem 0 0;font-weight:600}.work-desc{color:var(--ink-soft);max-width:44rem;margin:.55rem 0 0;line-height:1.7}.work-focus{max-width:44rem;color:var(--ink-soft);margin:.85rem 0 0;padding-left:1.1rem}.work-focus li{margin-bottom:.35rem}.work-focus strong{color:var(--accent-deep);font-weight:650}.work-links{flex-wrap:wrap;gap:.75rem 1.1rem;margin:.75rem 0 .25rem;display:flex}.repo-grid{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem;display:grid}.repo-item{border-top:1px solid var(--line);padding:1rem 0;text-decoration:none;display:block}.repo-item:hover strong{color:var(--accent-deep)}.repo-lang{color:var(--accent-deep);margin-bottom:.3rem;font-size:.75rem;font-weight:700;display:block}.repo-item strong{font-family:var(--font-display)}.repo-item p{color:var(--ink-soft);margin:.3rem 0 0;font-size:.92rem}.demo-grid{grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1.5rem;display:grid}.demo-item{margin:0}.demo-item video,.demo-placeholder,.demo-launch{aspect-ratio:16/9;width:100%;color:var(--ink-soft);background:linear-gradient(145deg,#b9cdd6,#9fc0bb);place-items:center;font-size:.92rem;display:grid}.demo-launch{color:#e8f2f0;background:radial-gradient(60% 50% at 20% 20%,#0a6e6859,#0000 60%),linear-gradient(145deg,#0c1a28,#1a3d45);gap:.35rem;text-decoration:none;transition:transform .2s,filter .2s}.demo-launch:hover{filter:brightness(1.06);transform:translateY(-2px)}.demo-launch strong{font-family:var(--font-display);font-size:1.15rem}.demo-launch span{color:#e8f2f0b3;font-size:.85rem}.demo-item figcaption{margin-top:.75rem}.demo-item h3{font-family:var(--font-display);margin:0 0 .25rem;font-size:1.05rem}.demo-item p{color:var(--ink-soft);margin:0 0 .4rem;font-size:.92rem}.skill-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 2rem;display:grid}.skill-group h3{font-family:var(--font-display);color:var(--accent-deep);margin:0 0 .65rem;font-size:1.05rem}.skills{flex-wrap:wrap;gap:.5rem .85rem;margin:0;display:flex}.skills span{color:var(--ink-soft);border-bottom:1px solid #0a6e684d;font-size:.88rem}@media (width<=720px){.skill-groups{grid-template-columns:1fr}}.exp-item{border-top:1px solid var(--line);padding:1.2rem 0}.exp-item:last-child{border-bottom:1px solid var(--line)}.exp-head{flex-wrap:wrap;justify-content:space-between;gap:.35rem 1rem;display:flex}.exp-head h3{font-family:var(--font-display);margin:0;font-size:1.1rem}.exp-head span{color:var(--ink-soft);font-size:.9rem}.exp-company{color:var(--accent-deep);margin:.2rem 0 .55rem;font-size:.95rem;font-weight:650}.exp-item ul{color:var(--ink-soft);margin:0;padding-left:1.1rem}.edu{color:var(--ink-soft);margin-top:1.5rem}.contact .section-head{margin-bottom:1.1rem}.contact-row{flex-wrap:wrap;align-items:center;gap:1rem 1.4rem;display:flex}.contact-phone{color:var(--ink-soft)}.copy-email{cursor:pointer;border:none;gap:.55rem}.copy-phone{cursor:pointer;gap:.55rem}.copy-hint{opacity:.75;border-left:1px solid #f4fffd59;padding-left:.55rem;font-size:.75rem;font-weight:600}.copy-hint-dark{border-left-color:#0c1a282e}.social{align-items:center;gap:1rem;margin-top:1.1rem;display:flex}.social a,.social-copy{color:var(--accent-deep);cursor:pointer;background:0 0;border:none;border-bottom:1px solid #0a6e6859;padding:0;font-weight:650;text-decoration:none}.social a:hover,.social-copy:hover{border-bottom-color:var(--accent-deep)}.toast{z-index:50;color:#f4fffd;opacity:0;pointer-events:none;background:#0c1a28eb;border-radius:.4rem;padding:.7rem 1.1rem;font-size:.92rem;font-weight:600;transition:opacity .22s,transform .22s;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)translateY(.6rem);box-shadow:0 10px 28px #0c1a2838}.toast.is-show{opacity:1;transform:translate(-50%)translateY(0)}.footer{padding:1.4rem var(--pad) 2.4rem;color:var(--ink-soft);border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:.75rem;font-size:.88rem;display:flex}.footer a{text-decoration:none}.footer-links{flex-wrap:wrap;gap:.85rem 1.1rem;display:flex}.footer-links a:hover{color:var(--accent-deep)}.reveal{opacity:0;transition:opacity .55s,transform .55s;transform:translateY(.9rem)}.reveal.is-visible{opacity:1;transform:none}@keyframes rise{0%{opacity:0;transform:translateY(1.1rem)}to{opacity:1;transform:none}}@keyframes rise-center{0%{opacity:0;transform:translateY(calc(1.1rem - 50%))}to{opacity:1;transform:translateY(-50%)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}@media (width<=860px){.hero{grid-template-columns:1fr;align-items:start;min-height:auto;padding-top:5rem}.pagenav-dock{animation:none;display:block;position:static;transform:none}.pagenav-toggle{display:none}.pagenav{opacity:1;visibility:visible;pointer-events:auto;width:100%;transform:none}.pagenav-list{grid-template-columns:1fr 1fr}.pagenav-text em{display:none}.impact-row{grid-template-columns:1fr;gap:.85rem}}@media (width<=720px){.nav,.pointer-glow{display:none}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-brand,.hero h1,.hero-lead,.hero-cta,.pagenav-dot,.reveal,.pointer-glow{opacity:1;transform:none;transition:none!important;animation:none!important}.pagenav-dock{animation:none!important}.pagenav{transition:none!important}}