@font-face{font-family:Public Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(../media/public-sans-vietnamese-wght-normal.351w3rsy0o7m9.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Public Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(../media/public-sans-latin-ext-wght-normal.3ft8rvcvbxo5j.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Public Sans Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(../media/public-sans-latin-wght-normal.297-5ju1rzndw.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--color-bg-page:#15171c;--color-bg-surface:#1c1f26;--color-surface-hover:#21242c;--color-surface-pressed:#262a33;--color-text-primary:#e9eaed;--color-text-secondary:#9da3ad;--color-text-disabled:#5c616b;--color-icon-disabled:#4a4f58;--color-accent:#d99a4e;--color-accent-hover:#e5ac66;--color-accent-pressed:#c6893f;--color-accent-disabled-bg:#3a3428;--color-accent-disabled-text:#756b57;--color-text-on-accent:#1e1608;--color-border:#2b2f38;--color-border-strong:#3c4049;--color-link:#e3b478;--color-link-hover:#efc792;--color-link-pressed:#c89a5e;--color-focus-ring:#e9eaed;--color-tag-bg:#21242c;--color-tag-text:#b7bec9;--color-tag-border:#2b2f38;--color-tag-bg-hover:#262a33;--color-tag-text-hover:#e3b478;--color-tag-border-hover:#d99a4e;--font-display:"Public Sans Variable", "Public Sans", -apple-system, "Segoe UI", sans-serif;--font-body:var(--font-display);--text-display-size:52px;--text-display-line:1.1;--text-display-weight:600;--text-display-tracking:-.01em;--text-h2-size:30px;--text-h2-line:1.25;--text-h2-weight:600;--text-h3-size:21px;--text-h3-line:1.35;--text-h3-weight:600;--text-body-lg-size:18px;--text-body-lg-line:1.55;--text-body-lg-weight:500;--text-body-size:16.5px;--text-body-line:1.7;--text-body-weight:400;--text-label-size:13px;--text-label-line:1.4;--text-label-weight:600;--text-label-tracking:.03em;--text-caption-size:12.5px;--text-caption-line:1.4;--text-caption-weight:400;--text-caption-tracking:.01em;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--radius-sm:4px;--radius-md:8px;--radius-lg:14px;--radius-pill:999px;--color-text-heading:#f3f4f6;--color-text-body:#c7cbd1;--radius-panel-mobile:12px;--content-width:880px;--page-gutter:24px;--page-gutter-mobile:20px;--space-20:20px;--space-28:28px;--space-40:40px;--text-subtitle-size:19px;--text-subtitle-mobile-size:17px;--text-detail-size:15px;--text-detail-mobile-size:14.5px;--radius-specimen:10px;--control-size:40px;--control-text-size:15px;--control-padding-y:12px;--control-padding-x:22px;--control-border-width:1.5px}
.text{margin:0 0 var(--space-4);color:var(--color-text-body);overflow-wrap:anywhere}.text--display{color:var(--color-text-heading);font-size:var(--text-display-size);line-height:var(--text-display-line);font-weight:var(--text-display-weight);letter-spacing:var(--text-display-tracking)}.text--h2{color:var(--color-text-heading);font-size:var(--text-h2-size);line-height:var(--text-h2-line);font-weight:var(--text-h2-weight)}.text--h3{color:var(--color-text-heading);font-size:var(--text-h3-size);line-height:var(--text-h3-line);font-weight:var(--text-h3-weight)}.text--subtitle{color:var(--color-link);font-size:var(--text-subtitle-size);font-weight:500;line-height:1.5}.text--bodyLarge{font-size:var(--text-body-lg-size);font-weight:var(--text-body-lg-weight);line-height:var(--text-body-lg-line)}.text--body{font-size:var(--text-body-size);font-weight:var(--text-body-weight);line-height:var(--text-body-line)}.text--detail{font-size:var(--text-detail-size);line-height:1.65}.text--label{font-size:var(--text-label-size);font-weight:var(--text-label-weight);line-height:var(--text-label-line);letter-spacing:var(--text-label-tracking)}.text--caption{color:var(--color-text-secondary);font-size:var(--text-caption-size);font-weight:var(--text-caption-weight);line-height:var(--text-caption-line);letter-spacing:var(--text-caption-tracking)}.button{justify-content:center;align-items:center;gap:var(--space-2);max-width:100%;min-height:44px;padding:var(--control-padding-y) var(--control-padding-x);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--control-text-size);text-align:center;overflow-wrap:anywhere;cursor:pointer;border:0;font-weight:700;line-height:1.3;text-decoration:none;transition:background-color .12s,color .12s,border-color .12s;display:inline-flex}.button--primary{background:var(--color-accent);color:var(--color-text-on-accent)}.button--primary:hover{background:var(--color-accent-hover)}.button--primary:active{background:var(--color-accent-pressed);padding-top:calc(var(--control-padding-y) + 1px);padding-bottom:calc(var(--control-padding-y) - 1px)}.button--secondary{border:var(--control-border-width) solid var(--color-border-strong);color:var(--color-text-primary);background:0 0;padding:11px 21px}.button--secondary:hover{border-color:var(--color-accent);background:var(--color-surface-hover)}.button--secondary:active{border-color:var(--color-accent-pressed);background:var(--color-surface-pressed);padding-top:12px;padding-bottom:10px}.button--primary:disabled,.button--primary[aria-disabled=true]{background:var(--color-accent-disabled-bg);color:var(--color-accent-disabled-text);padding:var(--control-padding-y) var(--control-padding-x);cursor:not-allowed}.button--secondary:disabled,.button--secondary[aria-disabled=true]{border-color:var(--color-border);color:var(--color-text-disabled);cursor:not-allowed;background:0 0;padding:11px 21px}.control--full{width:100%}.text-link{max-width:100%;color:var(--color-link);text-underline-offset:3px;overflow-wrap:anywhere;border-radius:2px;font-size:16px;font-weight:600;line-height:1.5;text-decoration:underline;display:inline-block}.text-link:hover{color:var(--color-link-hover);text-decoration-thickness:2px}.text-link:active{color:var(--color-link-pressed)}.text-link[aria-disabled=true]{color:var(--color-text-disabled);cursor:not-allowed;text-decoration:none}.tag{border:1px solid var(--color-tag-border);border-radius:var(--radius-pill);background:var(--color-tag-bg);max-width:100%;color:var(--color-tag-text);letter-spacing:.02em;overflow-wrap:anywhere;cursor:default;align-items:center;gap:5px;padding:6px 14px;font-size:13px;font-weight:600;line-height:1.4;transition:background-color .12s,color .12s,border-color .12s;display:inline-flex}.tag:hover{background:var(--color-tag-bg-hover);color:var(--color-tag-text-hover);border-color:var(--color-tag-border-hover)}.tag--highlighted{background:var(--color-accent);color:var(--color-text-on-accent);border-color:var(--color-accent)}.tag--highlighted:hover{background:var(--color-accent-hover);color:var(--color-text-on-accent);border-color:var(--color-accent-hover)}.tag--highlighted svg{color:currentColor;flex-shrink:0}.tag__label{min-width:0}.icon-button{width:var(--control-size);height:var(--control-size);border-radius:var(--radius-pill);color:var(--color-text-secondary);cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.icon-button:hover{background:var(--color-surface-hover);color:var(--color-text-primary)}.icon-button:active{background:var(--color-surface-pressed);color:var(--color-text-primary)}.icon-button:disabled{color:var(--color-icon-disabled);cursor:not-allowed;background:0 0}.contact-chip{align-items:center;gap:var(--space-2);border:var(--control-border-width) solid var(--color-border-strong);border-radius:var(--radius-pill);max-width:100%;min-height:44px;color:var(--color-text-primary);overflow-wrap:anywhere;padding:8px 16px;font-size:14px;font-weight:600;line-height:1.4;text-decoration:none;display:inline-flex}.contact-chip:hover{background:var(--color-surface-hover);border-color:var(--color-accent);color:var(--color-link-hover)}.contact-chip:active{background:var(--color-surface-pressed);border-color:var(--color-accent-pressed);color:var(--color-link-pressed)}.contact-chip[aria-disabled=true]{border-color:var(--color-border);color:var(--color-text-disabled);cursor:not-allowed;background:0 0}.divider{width:100%;height:1px;margin:var(--space-5) 0;background:var(--color-border);border:0}.panel{padding:var(--space-6);background:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.image-frame{width:100%;overflow:hidden}.image-frame>img{width:100%;height:auto;display:block}.image-frame>.image-placeholder{border-radius:inherit;border:0;width:100%;height:100%;min-height:0}.image-frame:not([style])>.image-placeholder{aspect-ratio:16/10}.image-placeholder{justify-content:center;align-items:center;gap:var(--space-3);min-height:180px;padding:var(--space-5);border:1.5px dashed var(--color-border-strong);border-radius:var(--radius-md);background:var(--color-bg-surface);color:var(--color-text-secondary);font-size:var(--text-caption-size);text-align:center;flex-direction:column;display:flex}@media (max-width:600px){.text--display{font-size:36px;line-height:1.15}.text--h2{font-size:24px;line-height:1.2}.text--body{font-size:15.5px;line-height:1.65}.text--subtitle{font-size:var(--text-subtitle-mobile-size)}.text--detail{font-size:var(--text-detail-mobile-size)}.tag{padding-inline:12px;font-size:12.5px}.panel{padding:var(--space-20);border-radius:var(--radius-panel-mobile)}}
.project-heading{flex-direction:column;gap:4px;display:flex}.project-heading__title,.project-heading__attribution{margin:0}.tag-list{gap:var(--space-2);flex-wrap:wrap;display:flex}.project-media{flex-direction:column;gap:10px;display:flex}.project-media__image{border:1px solid var(--color-border);border-radius:var(--radius-specimen);width:100%;height:auto;display:block}.project-media__caption{margin:0}.project-link{align-items:center;gap:6px;display:inline-flex}.experience-entry{justify-content:space-between;align-items:baseline;gap:var(--space-4);padding-block:var(--space-3);flex-wrap:wrap;display:flex}.experience-entry__title{color:var(--color-text-heading);font-size:15px;font-weight:600}.experience-entry__company{color:var(--color-text-secondary);margin-top:2px;font-size:13px}.experience-entry__dates{color:var(--color-text-secondary);white-space:nowrap;font-size:12px}.experience-entry-row--divided{border-top:1px solid var(--color-border)}.experience-entry__highlights{color:var(--color-text-body);flex-direction:column;gap:4px;margin:4px 0 0;padding-left:18px;font-size:13px;line-height:1.5;display:flex}.experience-entry__highlights li{margin:0}.experience-list__note{padding-block:var(--space-3);color:var(--color-text-secondary);font-size:13px}.contact-link-group{gap:var(--space-3);flex-wrap:wrap;display:flex}@media (max-width:600px){.contact-link-group{flex-direction:column;align-items:stretch;gap:10px}.experience-entry{flex-direction:column;align-items:flex-start;gap:2px}.experience-entry__title{font-size:14.5px}.experience-entry__company{margin-top:0;font-size:12.5px}.experience-entry__dates{font-size:11.5px}.experience-list__note{font-size:12.5px}.experience-entry__highlights{padding-left:16px;font-size:12.5px}}
.site-nav{background:var(--color-bg-surface);border-bottom:1px solid var(--color-border);padding-block:18px;position:relative}.site-nav__inner{justify-content:flex-end;align-items:center;gap:var(--space-4);max-width:var(--content-width);padding-inline:var(--page-gutter);flex-wrap:wrap;margin-inline:auto;display:flex}.site-nav__links{align-items:center;gap:var(--space-20);flex-wrap:wrap;display:flex}.site-nav__link{color:var(--color-text-primary);border-radius:2px;padding:6px 2px;font-size:15px;font-weight:600;text-decoration:none}.site-nav__link:hover{color:var(--color-link)}.site-nav__resume{padding:9px 18px}.mobile-nav-toggle{display:none}.mobile-nav-toggle__summary{width:var(--control-size);height:var(--control-size);border-radius:var(--radius-md);color:var(--color-text-primary);cursor:pointer;justify-content:center;align-items:center;list-style:none;display:flex}.mobile-nav-toggle__summary::-webkit-details-marker{display:none}.mobile-nav-toggle__summary:hover{background:var(--color-surface-hover)}.mobile-nav-toggle[open] .mobile-nav-toggle__summary{background:var(--color-surface-pressed)}.mobile-nav-toggle__panel{inset-inline:0;background:var(--color-bg-surface);border-bottom:1px solid var(--color-border);position:absolute;top:100%}.site-nav__mobile-links{padding:8px var(--page-gutter-mobile) 20px;flex-direction:column;gap:4px;display:flex}.site-nav__mobile-links .site-nav__link{width:100%;padding:12px 4px;display:block}.site-nav__mobile-links .site-nav__resume{width:100%;margin-top:8px}.hero{flex-direction:column;gap:20px;display:flex}.hero>*{margin:0}.hero__intro{max-width:620px}.hero__actions{align-items:center;gap:var(--space-20);margin-top:var(--space-2);flex-wrap:wrap;display:flex}.about-contact{column-gap:var(--space-6);grid-template-columns:auto 1fr;grid-template-areas:"portrait heading""portrait details";row-gap:14px;display:grid}.about-contact__portrait{border-radius:var(--radius-pill);object-fit:cover;border:1px solid var(--color-border);grid-area:portrait;width:120px;height:120px}.about-contact__heading{grid-area:heading;margin:0}.about-contact__details{flex-direction:column;grid-area:details;gap:14px;max-width:560px;display:flex}.about-contact__details>*{margin:0}.about-contact__bio,.about-contact__personal-note{max-width:560px}.experience-panel__heading{margin:0 0 12px}.skills-panel__heading{margin:0 0 16px}.skills-grid{grid-template-columns:1fr;gap:20px;display:grid}.skills-group__label{color:var(--color-text-secondary);margin-bottom:8px;font-size:12.5px;font-weight:600}.project-card{padding:0;overflow:hidden}.project-card__image{border-bottom:1px solid var(--color-border);width:100%;height:auto;display:block}.project-card__body{flex-direction:column;gap:16px;padding:28px 32px;display:flex}.project-card__body>*{margin:0}.project-card__eyebrow{letter-spacing:.05em;text-transform:uppercase;color:var(--color-link);margin-bottom:6px;font-size:11px;font-weight:700;display:block}.project-card__paragraph{color:var(--color-text-body);font-size:15px;line-height:1.6}@media (max-width:600px){.site-nav{z-index:5;padding-block:16px;position:sticky;top:0}.mobile-nav-toggle__panel{max-height:calc(100dvh - var(--control-size) - 33px);overflow-y:auto}.site-nav__inner{padding-inline:var(--page-gutter-mobile);justify-content:flex-start}.site-nav__links{display:none}.mobile-nav-toggle{display:block}.hero__actions{align-items:stretch;gap:var(--space-3);flex-direction:column}.hero{gap:var(--space-4)}.hero__actions>*{text-align:center;width:100%}.about-contact{column-gap:var(--space-4);row-gap:var(--space-4);grid-template-areas:"portrait heading""details details";align-items:center}.about-contact__portrait{width:72px;height:72px}.about-contact__details{gap:var(--space-4);max-width:none}.about-contact__heading,.experience-panel__heading,.skills-panel__heading,.project-heading__title{font-size:18px}.about-contact__bio,.about-contact__personal-note,.project-card__paragraph{font-size:var(--text-detail-mobile-size);line-height:1.6}.experience-panel__heading{margin-bottom:10px}.skills-panel__heading{margin-bottom:12px}.project-card__body{padding:var(--space-20);gap:14px}.project-card__body .text-link{font-size:14.5px}.skills-grid{gap:14px}.skills-group__label{margin-bottom:6px;font-size:12px}.skills-grid .tag-list{gap:6px}}
*{box-sizing:border-box}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;scroll-behavior:smooth}body{background:var(--color-bg-page);color:var(--color-text-primary);font-family:var(--font-body);margin:0}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}:where(button,a,summary,[tabindex]):focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:3px}.skip-link{top:-100%;left:var(--space-4);z-index:10;padding:var(--space-3) var(--space-4);background:var(--color-accent);color:var(--color-text-on-accent);border-radius:var(--radius-md);font-weight:700;text-decoration:none;position:absolute}.skip-link:focus{top:var(--space-4)}.homepage{max-width:var(--content-width);padding:var(--space-8) var(--page-gutter) var(--space-9);gap:var(--space-7);flex-direction:column;margin-inline:auto;display:flex}.homepage__experience-skills,.homepage__work{gap:var(--space-6);flex-direction:column;display:flex}.homepage__experience-skills{gap:var(--space-7)}.homepage__work{gap:var(--space-5)}.homepage__work>.text{margin:0}@media (max-width:600px){html{--mobile-sticky-nav-offset:calc(var(--control-size) + 33px + var(--space-4) + env(safe-area-inset-top));scroll-padding-top:var(--mobile-sticky-nav-offset)}#main-content,#about,#contact,#experience,#work{scroll-margin-top:var(--mobile-sticky-nav-offset)}.homepage{padding:var(--space-40) var(--page-gutter-mobile) 72px;gap:var(--space-40)}.homepage__experience-skills{gap:var(--space-40)}.homepage__work{gap:var(--space-20)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}