/* Glass surfaces share one material in both themes. */
:root{--glass:rgba(19,39,32,.64);--glass-edge:rgba(220,255,240,.22);--glass-shine:rgba(255,255,255,.12);--glass-shadow:0 16px 50px #0003;--halo:#a6f5da33;color-scheme:dark}
:root[data-theme="light"]{--bg:#edf4ef;--bg-2:#e3eee8;--surface:#ffffff66;--surface-2:#ffffff99;--line:#184e3826;--line-2:#184e3840;--text:#173b31;--muted:#3f6258;--faint:#55766b;--mint:#246e57;--ice:#356c87;--warm:#8c6b26;--glass:#ffffff9c;--glass-edge:#ffffffdf;--glass-shine:#ffffffc9;--glass-shadow:0 16px 50px #28594312;--halo:#70ae9b33;color-scheme:light}
html{scroll-padding-top:110px}body{transition:background-color .65s,color .65s}button,a{-webkit-tap-highlight-color:transparent}
h1,h2{letter-spacing:.005em;line-height:1.23}em,h1 em,h2 em{letter-spacing:.035em;line-height:1.25;padding-right:.08em}h1{font-size:clamp(43px,4.6vw,79px)}h2{font-size:clamp(35px,4vw,63px)}.p-title{letter-spacing:.005em;line-height:1.35}
.site-header{gap:20px}.site-header nav{gap:3px}.site-header nav a{padding:9px 12px;border-radius:999px}.site-header.is-scrolled{background:var(--glass);border-color:var(--glass-edge);box-shadow:0 8px 30px #0000000a;backdrop-filter:blur(24px) saturate(1.4)}
.theme-toggle{position:relative;flex:none;display:flex;align-items:center;justify-content:space-around;width:82px;height:42px;border-radius:999px;border:1px solid var(--glass-edge);background:var(--glass);box-shadow:inset 0 1px 0 var(--glass-shine),var(--glass-shadow);backdrop-filter:blur(20px);cursor:pointer;isolation:isolate;padding:0 4px}.theme-toggle>span:not(.theme-thumb){z-index:1;font-size:19px;width:32px;text-align:center}.theme-thumb{position:absolute;left:4px;top:4px;width:32px;height:32px;border-radius:50%;background:var(--surface-2);box-shadow:0 2px 8px #0002,inset 0 1px 1px var(--glass-shine);transition:transform .55s cubic-bezier(.2,.8,.2,1),background .5s}[data-theme="light"] .theme-thumb{transform:translateX(40px);background:white}
.hero-links a,.contact-links a,.tree-hint button,.skill-close{border:1px solid var(--glass-edge);border-radius:999px;background:var(--glass);box-shadow:inset 0 1px 0 var(--glass-shine),0 8px 24px #0001;backdrop-filter:blur(18px) saturate(1.4);transition:transform .35s,background .45s,box-shadow .35s}.hero-links{gap:16px;flex-wrap:wrap}.hero-links a{padding:12px 21px}.hero-links a::after{display:none}.hero-links a:hover,.contact-links a:hover,.theme-toggle:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 var(--glass-shine),0 8px 30px var(--halo)}button:active{scale:.97}.skill-close{width:42px;height:42px;display:grid;place-items:center;padding:0}.project-head{border-radius:24px}.project.is-open .project-head{background:var(--surface)}
.portrait-frame{aspect-ratio:1;border-radius:30px}.portrait-frame::after{opacity:.15}.portrait-frame img{filter:none}.portrait figcaption{line-height:1.9;flex-wrap:wrap;gap:8px}
.career-history{max-width:none;scroll-margin-top:105px}.career-entry{position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--glass-edge);border-radius:30px;padding:36px;margin:22px 0;background:linear-gradient(135deg,var(--glass-shine),transparent 45%),var(--glass);box-shadow:inset 0 1px 0 var(--glass-shine),var(--glass-shadow);backdrop-filter:blur(20px)}.career-entry h3{color:var(--text);letter-spacing:.025em;line-height:1.5}.career-entry p{max-width:820px}.career-brand{height:58px;margin-bottom:24px;display:flex;align-items:center;filter:drop-shadow(0 0 7px var(--halo))}.career-brand img{height:48px;width:auto;max-width:280px;object-fit:contain;object-position:left}.career-brand.logo-polyu img{filter:brightness(0) invert(90%) sepia(12%) saturate(800%) hue-rotate(95deg)}.career-brand.logo-accel img{height:auto;max-height:50px;filter:url(#accel-mint)}.career-particles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}.career-entry.particle-ready>*:not(canvas){opacity:0;filter:blur(7px);transform:translateY(20px);transition:opacity 1s,filter 1.2s,transform 1.2s cubic-bezier(.16,1,.3,1)}.career-entry.is-materialized>*:not(canvas){opacity:1;filter:blur(0);transform:none}.career-entry.is-materialized>h3{transition-delay:.08s}.career-entry.is-materialized>h4{transition-delay:.15s}.career-entry.is-materialized>p{transition-delay:.22s}
.skill-sky{height:720px;margin-top:36px;overflow:hidden;border-radius:36px;border:1px solid var(--line);background:radial-gradient(ellipse at 50% 50%,#112921,#040d0d 70%)}.nebula-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.nebula-core{display:none}.skill-links{opacity:.35}.skill-node{z-index:2;border-radius:26px;transition:opacity .5s,filter .5s,background .4s;animation:orbital-float 8s var(--float-delay) ease-in-out infinite}.skill-node:hover{background:var(--surface)}.skill-mark{border-radius:22px;background:linear-gradient(145deg,#ffffff18,#ffffff03);border:1px solid #e5fff52b;box-shadow:inset 0 1px 0 #fff2,0 0 25px #a6f5da0c;backdrop-filter:blur(8px);font-size:25px}.skill-node strong{color:var(--text);text-shadow:0 2px 12px var(--bg)}.skill-node small{color:var(--muted)}.skill-sky.is-exploring .skill-node:not(.selected){opacity:.3;filter:blur(3px)}.skill-sky.is-exploring .selected .skill-mark{box-shadow:0 0 35px #a6f5da99}.skill-dialog{background:linear-gradient(140deg,var(--glass-shine),transparent 45%),var(--glass);border:1px solid var(--glass-edge);border-radius:34px;backdrop-filter:blur(35px) saturate(1.6);box-shadow:inset 0 1px 0 var(--glass-shine),0 35px 110px #0005;color:var(--text)}.skill-dialog::backdrop{background:#02080788;backdrop-filter:blur(7px);animation:backdrop-in .4s}.skill-dialog.is-closing::backdrop{animation:backdrop-out .32s forwards}.skill-modal-open{overflow:hidden}.skill-note{display:none}
@keyframes orbital-float{0%,100%{translate:0 0}50%{translate:0 -8px}}@keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes backdrop-out{to{opacity:0}}
[data-theme="light"] .hero{background:radial-gradient(ellipse at 70% 45%,#cbded2,#edf4ef 70%)}[data-theme="light"] #tree-canvas{filter:brightness(.58) saturate(.85)}[data-theme="light"] em{background-image:linear-gradient(105deg,#255c49,#37896d,#507e98)}[data-theme="light"] .disciplines li{background:#ffffff66}[data-theme="light"] .experience{background:#ffffff22}[data-theme="light"] .experience .org-text b,[data-theme="light"] .experience .polyu-word,[data-theme="light"] .experience .experience-label,[data-theme="light"] .sia-word{color:#285a46;text-shadow:0 1px 1px #fff}[data-theme="light"] .experience .org-text span,[data-theme="light"] .experience .experience-label span{color:var(--muted)}[data-theme="light"] .org-logo{filter:brightness(.48) saturate(.7)!important}[data-theme="light"] .career-brand{filter:brightness(.5) saturate(.65)}[data-theme="light"] .career-brand.logo-sia{filter:none}[data-theme="light"] .skill-sky{background:radial-gradient(ellipse at 50% 45%,#e3eee7,#d3e4de 75%)}[data-theme="light"] .skill-mark{color:#286d58;text-shadow:0 1px 1px #fff,0 0 14px #5ac8a455;background:#ffffff85;border-color:#ffffffe0}[data-theme="light"] .skill-links{stroke:#3b7e65;opacity:.2}[data-theme="light"] .slot{background:#dde9e2}[data-theme="light"] .project.is-open .p-title{color:#2b7560}[data-theme="light"] .p-tag{color:var(--text)}[data-theme="light"] .orb{filter:brightness(.75) saturate(.8)}
@media(max-width:900px){.brand-role{display:none}.site-header{gap:12px}.site-header nav a{font-size:12px;padding:8px}.skill-node{width:150px}.skill-node small{font-size:10px}.hero-copy{max-width:57vw}}
@media(max-width:600px){.site-header{padding:12px 16px;flex-wrap:wrap;gap:8px}.brand{font-size:12px;letter-spacing:.12em}.site-header nav{order:3;width:100%;justify-content:center;margin:0}.theme-toggle{margin-left:auto;width:76px;height:38px}.theme-thumb{width:28px;height:28px}[data-theme="light"] .theme-thumb{transform:translateX(38px)}.site-header.is-scrolled{padding:8px 16px}.hero-copy{max-width:100%;padding-top:165px}h1{font-size:43px}h1 em{font-size:1em}.career-entry{padding:26px 22px;border-radius:24px}.career-brand img{max-width:240px}.skill-sky{height:auto;min-height:850px;margin-inline:0}.skill-node{width:auto;min-height:145px;animation:none}.skill-node:last-child{grid-column:auto}.skill-node small{font-size:10px}.skill-dialog{padding:42px 26px}.skill-intro{font-size:14px}.skill-caption{line-height:1.8}.hero-links a{font-size:14px;padding:10px 16px}.contact .mail{font-size:13px;padding:10px 12px;overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.career-entry.particle-ready>*:not(canvas){opacity:1;filter:none;transform:none}.skill-node{animation:none}}
@media(prefers-contrast:more){:root{--glass:var(--bg);--glass-edge:var(--text)}.skill-dialog,.career-entry{backdrop-filter:none}}

.logo-sia img{height:60px;width:60px;object-fit:contain;filter:url(#accel-mint)}

.project-navigation .project-body,.project-navigation .body-inner,.project-navigation .project{transition:none!important}.project-navigation .project{transform:none!important}
/* Quiet navigation, open space and a continuous material hierarchy. */
html,body{scrollbar-width:none;scrollbar-gutter:auto}*::-webkit-scrollbar{width:0;height:0}html{overflow-y:scroll}.skill-modal-open{overflow:hidden}
.brand{border:1px solid var(--glass-edge);border-radius:999px;padding:10px 15px;gap:10px;background:var(--glass);backdrop-filter:blur(20px);box-shadow:inset 0 1px 0 var(--glass-shine);transition:background .4s,box-shadow .4s}.brand-home{font-size:10px;letter-spacing:.08em;color:var(--muted);border-left:1px solid var(--line);padding-left:12px}.brand:hover{box-shadow:0 0 22px var(--halo)}
.disciplines{gap:14px 0;padding:14px 0;margin-top:26px;align-items:center}.disciplines li{border:0;border-radius:0;background:none!important;backdrop-filter:none;padding:0;display:flex;align-items:center;color:var(--text);letter-spacing:.09em;text-shadow:0 0 12px var(--halo);font-size:11px}.disciplines li:not(:last-child)::after{content:"";width:clamp(12px,1.8vw,28px);height:1px;margin:0 10px;background:linear-gradient(90deg,transparent,var(--mint),transparent);box-shadow:0 0 6px var(--halo)}
.project{isolation:isolate;border-bottom:1px solid var(--line)}.project::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;background:linear-gradient(180deg,rgba(var(--tint),.1) 0%,rgba(var(--tint),.035) 35%,transparent 85%);transition:opacity 1.1s}.project.is-open::before{opacity:1}.project.is-open .project-head{background:none}.project-head{border-radius:18px;transition:padding .85s var(--ease)}.project-body{transition:grid-template-rows 1.1s cubic-bezier(.25,.1,.25,1)}.project-head:focus:not(:focus-visible){outline:none}.project-head:focus-visible{outline:0;box-shadow:inset 3px 0 0 var(--mint)}
.career-entry{border:0;box-shadow:0 16px 48px #00000008;background:linear-gradient(135deg,var(--glass-shine),transparent 75%),var(--surface);backdrop-filter:blur(16px)}.career-history{border:0}.accel-symbol{display:block;width:50px;height:54px;overflow:hidden}.career-brand .accel-symbol img{display:block;height:54px;width:auto;max-width:none;max-height:none}.career-brand{filter:none}[data-theme="light"] .career-brand{filter:none}[data-theme="light"] .career-brand.logo-accel img,[data-theme="light"] .career-brand.logo-sia img{filter:url(#accel-mint) brightness(.35) saturate(1.2)}[data-theme="light"] .career-brand.logo-polyu img{filter:brightness(0) saturate(100%) invert(27%) sepia(31%) saturate(836%) hue-rotate(106deg) brightness(85%) contrast(92%)}
.skill-sky,[data-theme="light"] .skill-sky{background:none;border:0;box-shadow:none;border-radius:0;overflow:visible;height:790px;margin-inline:-25px}.nebula-canvas{mask-image:radial-gradient(ellipse at center,#000 20%,#000b 45%,transparent 74%)}.skill-links{display:none}.skill-node{animation:none;translate:none;border:0!important;border-radius:0;background:none!important;box-shadow:none!important;width:160px}.skill-node:hover{background:none}.skill-mark,[data-theme="light"] .skill-mark{border:0;background:none;box-shadow:none;backdrop-filter:none;border-radius:0;font-size:28px}.skill-sky.is-exploring .selected .skill-mark{box-shadow:none;text-shadow:0 0 18px var(--mint)}.skill-node:focus{outline:none}.skill-node:focus-visible .skill-mark{text-decoration:underline;text-underline-offset:10px}.skill-node small{line-height:1.7}.skill-node:hover .skill-mark{transform:scale(1.08)}
.contact{align-items:stretch}.contact h2{margin:0;align-self:stretch}.contact-links{align-self:stretch;justify-content:space-between;margin-top:0;gap:18px;min-height:180px;padding-block:10px}.contact-links a{min-height:52px;justify-content:center;width:100%;padding-inline:24px}.contact-links .mail{font-size:14px}.contact .kicker{margin-bottom:28px}
@media(max-width:900px){.brand{font-size:12px;padding:9px 12px}.brand-home{font-size:9px}.site-header{gap:10px}.skill-node{width:140px}}
@media(max-width:600px){.brand{font-size:10px;letter-spacing:.08em;padding:9px 10px;gap:7px}.brand-home{padding-left:8px}.brand-mark{width:6px;height:6px}.disciplines{max-width:340px;gap:12px 0}.disciplines li{font-size:9px;letter-spacing:.04em}.disciplines li:not(:last-child)::after{width:9px;margin:0 5px}.skill-sky,[data-theme="light"] .skill-sky{height:auto;min-height:850px;margin-inline:0}.skill-node{width:auto}.contact-links{margin-top:36px;gap:14px;min-height:auto}.contact-links a{width:100%}.contact h2{font-size:48px}.career-entry{padding:28px 22px}.skill-universe{overflow:visible}}

.body-inner{transition:padding-bottom 1.1s cubic-bezier(.25,.1,.25,1)}
.ghost-btn{background:var(--glass);color:var(--text);border-color:var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-shine);backdrop-filter:blur(18px)}
[data-theme="light"] .fruit-label{background:#ffffffae;color:#255c48;border-color:#ffffffdd;text-shadow:none}[data-theme="light"] .fruit:hover .fruit-label{color:#163d30}
/* Sticky portrait uses the document scroll container, not a hidden-overflow body. */
body{overflow-x:clip;overflow-y:visible}.skill-modal-open{overflow:hidden}
@media(min-width:861px){.portrait{position:sticky;top:112px;align-self:start;transform:none!important}.hero-copy{padding-top:clamp(145px,22vh,205px)}.hero-links{position:absolute;left:var(--gutter);bottom:16%;margin:0;z-index:4}.hero .disciplines{margin-top:18px}}
@media(max-width:860px){.hero-links{position:relative;left:auto;bottom:auto;margin:28px var(--gutter) 0;z-index:4}.portrait{position:relative;top:auto}}
.about-lede{color:var(--text)}
.theme-thumb{transition:transform 1.2s cubic-bezier(.4,0,.15,1),background 1.2s,box-shadow 1.2s}
[data-theme="light"] .theme-thumb{box-shadow:0 0 18px #f8dd8b66,inset 0 1px 1px #fff}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}::view-transition-new(root){z-index:2}
.theme-changing body{transition:none}.theme-sunrise{position:fixed;inset:-30%;z-index:1000;pointer-events:none;background:radial-gradient(ellipse at center,#fff5d0aa,#b8dfce33 40%,transparent 70%)}
@media(prefers-reduced-motion:reduce){.theme-thumb{transition:none}}

/* Explicit theme choices and the first self-contained project lab. */
.theme-toggle{cursor:default;padding:4px;gap:8px}.theme-toggle>button{position:relative;z-index:1;width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:inherit;font-size:19px;cursor:pointer;padding:0;flex:none}.theme-toggle>button:focus-visible{outline:2px solid var(--mint);outline-offset:3px}.theme-toggle:hover{transform:none}.vr-intro{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin:15px 0 40px}.vr-intro h4,.vr-evidence h4{font-family:var(--serif,Georgia);font-size:clamp(28px,3vw,44px);font-weight:400;line-height:1.35;letter-spacing:.025em;margin:15px 0}.vr-case p{line-height:1.9}.vr-eyebrow{font-size:10px;letter-spacing:.18em;opacity:.7}.distinction{display:inline-block;margin-top:18px;font-weight:500;color:var(--mint)}.project-lab{overflow:hidden;border-radius:26px;background:var(--glass);box-shadow:0 20px 70px #0002;margin:30px 0 44px}.lab-heading{display:flex;justify-content:space-between;gap:10px;padding:18px 24px;font-size:10px;letter-spacing:.12em}.lab-heading b{font-weight:400;letter-spacing:0;margin-left:18px;color:var(--mint)}.project-lab iframe{display:block;border:0;width:100%;height:620px;background:#102b29}.lab-note{padding:12px 24px;font-size:12px;opacity:.7;margin:0}.vr-evidence{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;margin:42px 0;align-items:center}.vr-evidence figure{margin:0}.vr-evidence video{width:100%;border-radius:18px;display:block}.vr-evidence figcaption{font-size:11px;line-height:1.7;opacity:.6;padding:12px 0}.vr-evidence p{font-size:14px}.vr-case .facts{margin-top:35px}
@media(max-width:700px){.vr-intro,.vr-evidence{grid-template-columns:1fr;gap:20px}.lab-heading{padding:14px;letter-spacing:.04em}.lab-heading>span:last-child{display:none}.project-lab iframe{height:690px}.lab-note{padding:14px}.theme-toggle{gap:10px}.theme-toggle>button{width:28px;height:28px}}

@media(max-width:700px){.project-lab iframe{height:760px}}

/* Readable contribution labels: no fluorescent green text in project stories. */
.facts h4,.vr-case .distinction,.vr-case .lab-heading b{color:#b8c0be;text-shadow:none;filter:none}
.facts h4{font-size:12px;font-weight:600;letter-spacing:.14em;line-height:1.8}
[data-theme="light"] .facts h4,[data-theme="light"] .vr-case .distinction,[data-theme="light"] .vr-case .lab-heading b{color:#263b38}

/* Wider, open title setting, with natural wrapping rather than forced narrow lines. */
.vr-intro{grid-template-columns:1.25fr 1fr;gap:48px}.vr-intro h4,.vr-evidence h4{font-family:Manrope,Arial,sans-serif;font-size:clamp(25px,2.65vw,36px);font-weight:400;line-height:1.5;letter-spacing:.035em;font-stretch:normal;text-wrap:balance}.vr-evidence{grid-template-columns:1.05fr 1.2fr;gap:44px}.project-lab iframe{height:815px}@media(max-width:700px){.vr-intro,.vr-evidence{grid-template-columns:1fr;gap:24px}.vr-intro h4,.vr-evidence h4{font-size:26px;letter-spacing:.025em;line-height:1.55}.project-lab iframe{height:965px}}

/* Shared liquid-glass finish; keep the constellation itself unframed. */
:root{--glass:rgba(24,47,40,.44);--glass-edge:rgba(229,246,240,.3);--glass-shine:rgba(255,255,255,.18)}
:root[data-theme="light"]{--glass:rgba(255,255,255,.48);--glass-edge:rgba(255,255,255,.82);--glass-shine:rgba(255,255,255,.65)}
.project-lab,.career-entry,.skill-dialog,.theme-toggle,.hero-links a,.contact-links a,.tree-hint button{background:linear-gradient(125deg,var(--glass-shine),transparent 35%,rgba(255,255,255,.025) 75%,var(--glass-shine)),var(--glass);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 1px #fff5,inset 0 -1px 1px #fff1,0 14px 44px #0002;backdrop-filter:blur(28px) saturate(1.5);-webkit-backdrop-filter:blur(28px) saturate(1.5)}
.project.is-open .project-head{background:linear-gradient(125deg,var(--glass-shine),transparent 60%),var(--glass);box-shadow:inset 0 1px 0 var(--glass-edge);backdrop-filter:blur(22px)}