:root{--bg:#101010;--surface:#1C1C1E;--text:#F5F5F7;--text-secondary:#86868B;--text-muted:#6E6E73;--accent:#2997FF;--accent-glow:rgba(41,151,255,0.3);--border:rgba(255,255,255,0.08);--font:system-ui,-apple-system,SF Pro Display,Helvetica Neue,sans-serif;--radius-card:20px;--radius-pill:999px;--container:1120px}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden;padding-bottom:100px}
a{color:var(--accent);text-decoration:none;transition:all .3s ease}
a:hover{color:#5ac8fa}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-weight:700;letter-spacing:-0.03em;line-height:1.15}
hr{border:none;border-top:1px solid var(--border);margin:64px 0}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
.dock{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:1000}
.dock-inner{display:flex;align-items:center;gap:4px;padding:.5rem 1.5rem;background:rgba(30,30,30,.8);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:1px solid var(--border);border-radius:var(--radius-pill)}
.dock-link{color:var(--text-secondary);font-size:14px;font-weight:500;padding:8px 14px;border-radius:var(--radius-pill);transition:all .3s ease;white-space:nowrap}
.dock-link:hover{color:var(--text);background:rgba(255,255,255,.06);box-shadow:0 0 20px var(--accent-glow)}
.dock-link.active{color:var(--accent);background:rgba(41,151,255,.1)}
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative;padding:80px 24px}
.hero-name{font-size:clamp(48px,10vw,96px);font-weight:800;letter-spacing:-0.04em;line-height:1.05;background:linear-gradient(180deg,#F5F5F7 0%,#86868B 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:fadeUp 1s ease-out both}
.hero-subtitle{font-size:clamp(18px,3vw,26px);color:var(--text-secondary);margin-top:16px;font-weight:400;max-width:600px;animation:fadeUp 1s ease-out .2s both}
.hero-meta{font-size:16px;color:var(--text-muted);margin-top:12px;animation:fadeUp 1s ease-out .4s both}
.scroll-indicator{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);animation:fadeUp 1s ease-out .6s both;transition:opacity .4s ease}
.scroll-indicator.hidden{opacity:0;pointer-events:none}
.scroll-chevron{width:30px;height:30px;border-right:2px solid var(--text-muted);border-bottom:2px solid var(--text-muted);transform:rotate(45deg);animation:chevronBounce 2s infinite}
@keyframes chevronBounce{0%,100%{transform:rotate(45deg) translateY(0);opacity:.6}50%{transform:rotate(45deg) translateY(8px);opacity:1}}
.page-hero{position:relative;min-height:50vh;display:flex;align-items:flex-end;padding:80px 24px 60px;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,var(--bg) 100%);z-index:1}
.page-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.3;filter:blur(2px)}
.page-hero .container{position:relative;z-index:2}
.page-hero h1{font-size:clamp(40px,8vw,80px);background:linear-gradient(180deg,#F5F5F7 0%,#86868B 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:fadeUp 1s ease-out both}
.page-title{padding:120px 0 48px;text-align:center}
.page-title h1{font-size:clamp(40px,8vw,72px);background:linear-gradient(180deg,#F5F5F7 0%,#86868B 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.breadcrumb{padding:100px 0 16px;font-size:14px;color:var(--text-muted)}
.breadcrumb a{color:var(--text-secondary)}.breadcrumb a:hover{color:var(--accent)}.breadcrumb .sep{margin:0 8px;opacity:.5}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);padding:32px;transition:all .4s ease}
.card:hover{border-color:rgba(41,151,255,.2);box-shadow:0 0 30px rgba(41,151,255,.08);transform:translateY(-4px)}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px;margin-top:40px}
.card h3{font-size:22px;margin-bottom:12px;color:var(--text)}.card p{color:var(--text-secondary);font-size:15px;line-height:1.7}
.card .card-link{display:inline-block;margin-top:20px;font-size:14px;font-weight:600;color:var(--accent)}.card .card-link:hover{color:#5ac8fa}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:80px 0}
.stat{text-align:center}
.stat-number{font-size:clamp(36px,6vw,56px);font-weight:800;letter-spacing:-0.04em;color:var(--accent);line-height:1}
.stat-label{font-size:14px;color:var(--text-secondary);margin-top:8px;text-transform:uppercase;letter-spacing:.05em}
.research-section{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:80px 0}
.research-section:nth-child(even) .research-text{order:2}.research-section:nth-child(even) .research-image{order:1}
.research-text h2{font-size:clamp(28px,4vw,44px);margin-bottom:20px}
.research-text p{color:var(--text-secondary);font-size:17px;line-height:1.8;margin-bottom:24px}
.research-image img{border-radius:var(--radius-card);box-shadow:0 8px 40px rgba(41,151,255,.12);transition:all .4s ease}
.research-image img:hover{box-shadow:0 12px 50px rgba(41,151,255,.2);transform:scale(1.02)}
.pill-btn{display:inline-block;padding:10px 24px;border:1px solid var(--border);border-radius:var(--radius-pill);color:var(--text-secondary);font-size:14px;font-weight:500;transition:all .3s ease;background:transparent;cursor:pointer}
.pill-btn:hover{color:var(--accent);border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow)}
.pill-btn-accent{background:var(--accent);color:#fff;border-color:var(--accent)}.pill-btn-accent:hover{background:#0a84ff;color:#fff;box-shadow:0 0 30px var(--accent-glow)}
.pill-group{display:flex;flex-wrap:wrap;gap:10px}
.pill-tag{display:inline-block;padding:6px 16px;border:1px solid rgba(41,151,255,.3);border-radius:var(--radius-pill);color:var(--accent);font-size:13px;font-weight:500}
.pill-tag-muted{border-color:var(--border);color:var(--text-secondary)}
.image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin:40px 0}
.image-gallery img{border-radius:var(--radius-card);border:1px solid var(--border);transition:all .4s ease;width:100%;aspect-ratio:4/3;object-fit:cover}
.image-gallery img:hover{box-shadow:0 8px 40px rgba(41,151,255,.2);transform:scale(1.02)}
.pub-section{margin-bottom:64px}
.pub-year{font-size:clamp(48px,8vw,80px);font-weight:800;color:rgba(255,255,255,.06);letter-spacing:-0.04em;line-height:1;margin-bottom:24px}
.pub-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px 28px;margin-bottom:12px;transition:all .3s ease}
.pub-card:hover{border-color:rgba(41,151,255,.2);box-shadow:0 0 25px rgba(41,151,255,.08)}
.pub-title{font-size:16px;font-weight:600;color:var(--text);margin-bottom:6px;line-height:1.4}
.pub-authors{font-size:14px;color:var(--text-secondary);margin-bottom:4px}
.pub-venue{font-size:13px;color:var(--text-muted)}
.search-bar{width:100%;max-width:500px;margin:0 auto 48px;position:relative}
.search-bar input{width:100%;padding:14px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-pill);color:var(--text);font-size:15px;font-family:var(--font);outline:none;transition:all .3s ease}
.search-bar input::placeholder{color:var(--text-muted)}
.search-bar input:focus{border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow)}
.filter-bar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:48px}
.filter-btn{padding:8px 20px;border:1px solid var(--border);border-radius:var(--radius-pill);background:transparent;color:var(--text-secondary);font-size:13px;font-weight:500;font-family:var(--font);cursor:pointer;transition:all .3s ease}
.filter-btn:hover,.filter-btn.active{color:var(--accent);border-color:var(--accent);background:rgba(41,151,255,.08)}
.course-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);padding:28px;transition:all .3s ease}
.course-card:hover{border-color:rgba(41,151,255,.15);box-shadow:0 0 20px rgba(41,151,255,.06)}
.course-card h3{color:var(--accent);font-size:20px;margin-bottom:8px}
.course-card .course-date{font-size:13px;color:var(--text-muted);margin-bottom:8px}
.course-card p{color:var(--text-secondary);font-size:15px}
.course-card.dimmed{opacity:.5}.course-card.dimmed:hover{opacity:.8}
.glass-card{background:rgba(28,28,30,.7);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:var(--radius-card);padding:28px;transition:all .3s ease}
.glass-card:hover{border-color:rgba(41,151,255,.2);box-shadow:0 0 25px rgba(41,151,255,.08)}
.glass-card-accent{border-color:rgba(41,151,255,.2)}
.timeline{position:relative;padding-left:32px}
.timeline::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--accent),rgba(41,151,255,.1))}
.timeline-item{position:relative;padding-bottom:40px}
.timeline-item::before{content:"";position:absolute;left:-37px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent-glow)}
.timeline-item h4{font-size:17px;margin-bottom:4px;color:var(--text)}
.timeline-item .timeline-date{font-size:13px;color:var(--accent);font-weight:600;margin-bottom:6px}
.timeline-item p{font-size:15px;color:var(--text-secondary);line-height:1.6}
.award-timeline{position:relative;padding-left:32px}
.award-timeline::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--accent),rgba(41,151,255,.1))}
.award-item{position:relative;padding-bottom:36px}
.award-item::before{content:"";position:absolute;left:-37px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 15px var(--accent-glow)}
.award-item h4{font-size:17px;color:var(--text);margin-bottom:4px}
.award-item .award-year{font-size:13px;color:var(--accent);font-weight:600}
.award-item p{font-size:14px;color:var(--text-secondary);margin-top:4px}
.member-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:24px}
.member-card{background:rgba(28,28,30,.6);backdrop-filter:blur(16px);border:1px solid var(--border);border-radius:16px;padding:20px;transition:all .3s ease}
.member-card:hover{border-color:rgba(41,151,255,.15);box-shadow:0 0 20px rgba(41,151,255,.06)}
.member-card .member-name{font-size:16px;font-weight:600;color:var(--text);margin-bottom:4px}
.member-card .member-role{font-size:13px;color:var(--text-muted)}
.visit-item{padding:16px 20px;border-radius:12px;transition:all .3s ease;margin-bottom:8px}
.visit-item:hover{background:rgba(41,151,255,.04);box-shadow:0 0 15px rgba(41,151,255,.06)}
.visit-item h4{font-size:16px;color:var(--text);margin-bottom:2px}
.visit-item .visit-date{font-size:13px;color:var(--accent);font-weight:600}
.visit-item p{font-size:14px;color:var(--text-secondary)}
.skills-section{margin-bottom:32px}
.skills-section h3{font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:12px}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin:40px 0}
.contact-item h4{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:8px}
.contact-item p,.contact-item a{font-size:16px;color:var(--text-secondary);line-height:1.7}
.bio-section{margin-top:0}
.bio-layout{display:grid;grid-template-columns:320px 1fr;gap:64px;align-items:start;padding:40px 0 0}
.bio-image-wrap{position:relative}
.bio-image-wrap::before{content:"";position:absolute;inset:-4px;border-radius:calc(var(--radius-card) + 4px);background:linear-gradient(135deg,var(--accent),rgba(41,151,255,.15));z-index:0;opacity:.6;transition:opacity .4s ease}
.bio-image-wrap:hover::before{opacity:1}
.bio-image{position:relative;z-index:1;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius-card);border:2px solid var(--surface);box-shadow:0 16px 60px rgba(0,0,0,.5)}
.bio-text .section-label{margin-bottom:12px}
.bio-heading{font-size:clamp(28px,4vw,44px);margin-bottom:24px;background:linear-gradient(180deg,#F5F5F7 0%,#86868B 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.bio-text p{color:var(--text-secondary);font-size:16px;line-height:1.8;margin-bottom:16px}
.bio-text p:last-of-type{margin-bottom:32px}
.bio-links{display:flex;flex-wrap:wrap;gap:12px}
.section-heading{font-size:clamp(28px,5vw,44px);text-align:center;margin-bottom:48px}
.section-label{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);font-weight:600;margin-bottom:8px;display:block}
.footer{text-align:center;padding:60px 24px 120px;color:var(--text-muted);font-size:14px}
.footer-links{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:24px}
@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}100%{opacity:1;transform:translateY(0)}}
.fade-in{opacity:1;transform:translateY(0);transition:opacity .7s ease-out,transform .7s ease-out}
@media(prefers-reduced-motion:no-preference){.fade-in.will-animate{opacity:0;transform:translateY(30px)}.fade-in.will-animate.visible{opacity:1;transform:translateY(0)}}
.accent{color:var(--accent)}
.section{margin-top:64px}
@media print{body{background:#fff;color:#111;padding-bottom:0}.dock,.scroll-indicator,.footer{display:none}.hero{min-height:auto;padding:40px 0}.hero-name{-webkit-text-fill-color:#111;color:#111}.hero-subtitle{color:#444}.page-title h1,.page-hero h1{-webkit-text-fill-color:#111;color:#111}.card,.pub-card,.glass-card,.course-card,.member-card{background:#f9f9f9;border-color:#ddd;box-shadow:none}.pub-year{color:#ddd}.timeline::before,.award-timeline::before{background:#ccc}.timeline-item::before,.award-item::before{background:#333;box-shadow:none}a{color:#111}.pill-btn,.pill-tag{border-color:#ccc;color:#333}.stat-number{color:#111}.bio-heading{-webkit-text-fill-color:#111;color:#111}.bio-image{box-shadow:none;border-color:#ddd}.bio-image-wrap::before{display:none}.bio-text p{color:#333}.cv-section{page-break-inside:avoid}.cv-section + .cv-section{margin-top:18pt}}
@media(max-width:768px){.dock{bottom:0;left:0;right:0;transform:none;width:100%}.dock-inner{border-radius:0;justify-content:center;gap:0;padding:.4rem .5rem;width:100%}.dock-link{font-size:12px;padding:8px 8px}body{padding-bottom:70px}.hero{min-height:85vh;padding:60px 20px}.stats{grid-template-columns:repeat(2,1fr);gap:32px;padding:48px 0}.bio-layout{grid-template-columns:1fr;gap:32px;text-align:center}.bio-image-wrap{max-width:260px;margin:0 auto}.bio-links{justify-content:center}.research-section{grid-template-columns:1fr;gap:32px;padding:48px 0}.research-section:nth-child(even) .research-text{order:1}.research-section:nth-child(even) .research-image{order:2}.card-grid{grid-template-columns:1fr}.image-gallery{grid-template-columns:1fr}.member-grid{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr}.page-hero{min-height:40vh}hr{margin:40px 0}}
@media(max-width:480px){.dock-link{font-size:11px;padding:6px 5px}.stats{grid-template-columns:1fr 1fr}.filter-bar{gap:6px}.filter-btn{font-size:12px;padding:6px 14px}}