/* Selected B: azure. Local source, no external assets or hosted dependencies. */
@media screen {   :root { --canvas:#eef5ff; --surface:#ffffff; --surface-cyan:#e7efff; --surface-green:#e9effd; --ink:#11254e; --muted:#516481; --line:#cbdaf2; --cyan:#205be7; --cyan-dark:#214ec2; --green:#315b9d; --coral:#315cdf; --sun:#4f75d4; --glass:#f5f9ffeb; --accent:#205be7; --accent-ink:#fff; --chip:#e9efff; --chip-ink:#214ec2; --shadow:0 22px 70px #18468612; color-scheme:light; }
  html { scroll-padding-top:170px; }
  body { font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif; font-size:16px; background:var(--canvas); }
  .shell { width:min(1240px,calc(100% - 80px)); }
  body { isolation:isolate; }
  #app, .foot { position:relative; z-index:1; }
  .ambient {
    position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none;
    background:radial-gradient(ellipse at 95% 15%,#d9eaff 0,transparent 55%),
      radial-gradient(ellipse at 0% 80%,#dfedff 0,transparent 50%);
  }
  .ripple-canvas { display:block; width:100%; height:100%; }
  .topbar { top:58px; background:var(--glass); border-color:var(--line); }
  .topbar-inner { min-height:76px; gap:24px; }
  .brand span { font-size:19px; letter-spacing:-.5px; }
  .brand small { display:none; }
  .nav { gap:22px; }
  .nav a { font-size:14px; font-weight:550; padding:22px 0; }
  .segmented button, .print-button, .motion-button { background:transparent; color:var(--ink); border-color:var(--line); font-size:14px; font-weight:550; }
  .segmented button.active { background:var(--accent); color:var(--accent-ink); }
  .actions { gap:8px; }
  .hero { background:transparent; color:var(--ink); border:0; overflow:visible; }
  .hero::after { display:none; }
  .hero-grid { min-height:500px; padding-top:60px; padding-bottom:62px; grid-template-columns:minmax(0,1fr) 240px; gap:90px; }
  .hero-copy { grid-row:1; grid-column:1; min-width:0; }
  .portrait-column { grid-row:1; grid-column:2; align-self:center; }
  .portrait-frame { padding:8px; background:linear-gradient(150deg,#91efe84d,#ab92ff21); border:1px solid #b9d8ff40; box-shadow:0 30px 80px #0004; border-radius:28px; transform:rotate(3deg); transition:transform .35s; }
  .portrait-frame:hover { transform:rotate(0deg); }
  .portrait { border-radius:20px; }
  .portrait-caption { color:var(--muted); font-size:12px; line-height:1.7; margin-top:22px; }
  .portrait-caption::before { display:none; }
  h1 { font-size:clamp(40px,4.4vw,62px); font-weight:750; line-height:1.15; letter-spacing:-2px; }
  .name-secondary { display:block; color:var(--cyan-dark); font-size:14px; letter-spacing:5px; margin-top:16px; }
  .headline { color:var(--ink); font-size:clamp(19px,2vw,25px); font-weight:550; margin-top:26px; }
  .focus { color:var(--muted); font-size:16px; max-width:680px; }
  .affiliation { color:var(--muted); font-size:14px; font-weight:400; margin-top:12px; }
  .hero-links { margin-top:24px; gap:8px; }
  .hero-links a { color:var(--muted); border-color:var(--line); padding:6px 10px; font-size:12px; font-weight:500; border-radius:6px; min-height:34px; overflow-wrap:anywhere; }
  .hero-links a:hover { background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
  .metrics-band { background:transparent; border:0; }
  .metrics-band > .shell { background:var(--glass); border:1px solid var(--line); border-radius:18px; padding:0 30px; backdrop-filter:blur(18px); box-shadow:var(--shadow); }
  .metrics-head { padding:20px 0 12px; }
  .metrics-head h2 { font-size:14px; font-weight:550; }
  .metrics-grid { border-top:1px solid var(--line); }
  .metric { padding:25px 24px 22px 0; min-height:134px; }
  .metric + .metric { padding-left:30px; }
  .metric strong { font-size:43px; font-weight:500; letter-spacing:-1.5px; font-variant-numeric:tabular-nums; }
  .metric:last-child strong { color:var(--cyan-dark); }
  .metric-label { font-size:14px; font-weight:550; color:var(--ink); }
  .metric-origin { font-size:12px; }
  .scholar-snapshot { display:flex; flex-wrap:wrap; align-items:center; column-gap:24px; row-gap:5px; padding:13px 0 16px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; }
  .scholar-snapshot a { color:var(--cyan-dark); }
  .scholar-snapshot small { font-size:12px; margin-left:auto; }
  .content-band { background:transparent; overflow:visible; }
  .content-band::before, .dynamic-grid-canvas { display:none; }
  .page { grid-template-columns:240px minmax(0,1fr); gap:55px; padding-top:64px; }
  .sidebar { position:static; gap:26px; }
  .side-block { border:1px solid var(--line); border-radius:16px; padding:24px; background:var(--surface); }
  .side-block:nth-child(2), .side-block:nth-child(3) { border-color:var(--line); }
  .side-block h2 { font-size:16px; font-weight:650; margin-bottom:18px; }
  .interest-list li, .honor-list li { font-size:14px; line-height:1.85; }
  .tag-list li { background:var(--surface-cyan); color:var(--green); border:0; font-size:12px; font-weight:500; padding:5px 9px; }
  .main { gap:60px; min-width:0; }
  .section, .publication { scroll-margin-top:170px; }
  .section-head { grid-template-columns:30px minmax(0,1fr); gap:12px; align-items:center; padding-bottom:19px; }
  .section h2 { font-size:28px; font-weight:650; letter-spacing:-.6px; }
  .section-label { color:var(--cyan-dark); font-weight:500; }
  .section-summary { margin:0 0 25px; line-height:1.9; font-size:15px; }
  .section-summary strong { color:var(--cyan-dark); }
  .publication-group-head { font-size:14px; font-weight:550; color:var(--muted); }
  .publication-group-head span { font-size:14px; }
  .timeline-item, .publication, .tool, .service-item { border:1px solid var(--line); border-radius:14px; background:var(--surface); padding:26px; box-shadow:none; transition:border-color .25s,transform .25s,box-shadow .25s; }
  .publication:hover, .tool:hover { border-color:var(--cyan); transform:translateY(-3px); box-shadow:var(--shadow); }
  .timeline-item::before, .publication::before { display:none; }
  .pub-title-label { color:var(--muted); font-weight:400; font-size:12px; letter-spacing:1px; margin-bottom:10px; }
  .pub-title { color:var(--ink); font-size:20px; font-weight:620; line-height:1.55; }
  .pub-year, .item-date { font-size:14px; font-weight:500; }
  .pub-authors, .item-description, .tool-description, .service-meta { font-size:15px; line-height:1.85; }
  .pub-authors strong { color:var(--ink); }
  .pub-journal { font-size:16px; color:var(--cyan-dark); font-weight:550; }
  .pub-meta { gap:7px; }
  .doi-link, .pill, .metric-chip, .tool-links a { font-size:12px; font-weight:500; padding:5px 9px; border-radius:5px; overflow-wrap:anywhere; }
  .doi-link { background:transparent; color:var(--cyan-dark); }
  .metric-chip { background:var(--chip); color:var(--chip-ink); }
  .pill { background:var(--surface-green); color:var(--green); }
  .item-title, .tool-title, .service-title { font-size:18px; font-weight:650; }
  .item-detail { font-size:15px; }
  .tool-group > h3 { font-size:16px; }
  .foot { background:transparent; font-size:13px; }
  button:focus-visible, a:focus-visible { outline:3px solid var(--cyan); outline-offset:4px; }
  html .hero-grid { grid-template-columns:210px minmax(0,1fr); gap:68px; padding-top:65px; }
  html .portrait-column { grid-column:1; }
  html .hero-copy { grid-column:2; }
  html .portrait-frame { border:0; border-radius:120px 120px 16px 16px; padding:10px; background:#d7e6ff; box-shadow:18px 18px 0 #215ee713; transform:none; }
  html .portrait { border-radius:110px 110px 10px 10px; }
  html .metrics-band > .shell { border:0; border-radius:20px; background:#fff; box-shadow:0 14px 60px #255abb13; }
  html .side-block { border:0; background:#e3edfc; }
  html .publication { border-color:#d6e2f5; border-radius:10px; box-shadow:0 6px 18px #27569f06; }
  html .publication-group:first-child .publication:first-child { border-top:3px solid var(--cyan); }
  @keyframes enter { from { transform:translateY(14px); opacity:.4; } to { transform:translateY(0); opacity:1; } }
  html[data-motion="on"] .hero-copy, html[data-motion="on"] .metrics-band { animation:enter .65s ease-out both; }
  html[data-motion="off"] *, html[data-suspended="true"] * { animation-play-state:paused!important; }
  html[data-motion="off"] * { scroll-behavior:auto!important; transition:none!important; }
  @media(max-width:1100px) {     .nav { display:none; }
    .actions { margin-left:auto; }
    .hero-grid, html .hero-grid { gap:45px; }
    .page { gap:32px; }
    .scholar-snapshot small { margin-left:0; }
 }
  @media(max-width:760px) {     .shell { width:calc(100% - 36px); }
    .topbar-inner { min-height:68px; gap:8px; }
    .brand span { font-size:17px; }
    .print-button { display:none; }
    .segmented button { padding:5px 8px; }
    .motion-button { width:34px; }
    .hero-grid, html .hero-grid { display:flex; flex-direction:column; align-items:flex-start; gap:28px; padding-top:35px; padding-bottom:35px; min-height:0; }
    .portrait-column { order:0; display:flex; align-items:center; gap:22px; align-self:stretch; }
    .hero-copy { order:1; width:100%; }
    .portrait-frame, html .portrait-frame { width:94px; flex:0 0 94px; padding:4px; border-radius:10px; transform:none; box-shadow:none; }
    .portrait, html .portrait { border-radius:7px; }
    .portrait-caption { margin:0; font-size:13px; max-width:220px; }
    h1 { font-size:40px; }
    .name-secondary { font-size:12px; margin-top:12px; }
    .headline { margin-top:20px; font-size:20px; }
    .hero-links { gap:6px; }
    .hero-links a { font-size:12px; }
    .metrics-band > .shell { padding:0 18px; border-radius:12px; }
    .metrics-head { align-items:center; gap:8px; }
    .metrics-source { font-size:12px; }
    .metrics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .metric, .metric + .metric { padding:20px 10px 16px; min-height:130px; }
    .metric:nth-child(odd) { border-left:0; padding-left:0; }
    .metric:nth-child(n+3) { border-top:1px solid var(--line); }
    .metric strong { font-size:36px; }
    .metric-label { font-size:13px; }
    .metric-origin { font-size:12px; }
    .scholar-snapshot { display:grid; gap:6px; font-size:12px; }
    .page { display:flex; flex-direction:column; padding-top:36px; gap:40px; }
    .main { order:0; width:100%; }
    .sidebar { order:1; width:100%; }
    .section h2 { font-size:25px; }
    .section-summary { font-size:15px; }
    .publication, .timeline-item, .tool, .service-item { padding:20px; }
    .pub-title { font-size:18px; }
    .pub-top { gap:10px; }
    .pub-authors, .tool-description, .item-description { font-size:14px; }
    .pub-year { font-size:12px; }
    .timeline-top, .service-top { flex-wrap:wrap; gap:5px; }
    .pub-meta { gap:5px; }
    .metric-chip { max-width:100%; }
 }
  @media(prefers-reduced-motion:reduce) {     html:not([data-motion="on"]) * { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
 }
 }
@media print {   .ambient, .name-secondary { display:none!important; }
  .scholar-snapshot { font-size:7pt; margin:2mm 0; }
  .scholar-snapshot small { margin-left:3mm; }
  .metrics-band { break-inside:avoid; }
 }

/* Original rectangular portrait treatment, adapted to the selected blue palette. */
@media screen {
  html { scroll-padding-top:100px; }
  .topbar { top:0; }
  .section,.publication { scroll-margin-top:100px; }
  .sidebar { grid-template-columns:1fr; }
  html .portrait-frame, html .portrait-frame:hover {
    padding:8px; border:0; border-radius:0; background:#dceaff;
    box-shadow:18px 18px 0 rgba(103,150,222,.10); transform:none;
  }
  html .portrait { border-radius:0; aspect-ratio:4 / 5; }
}
@media screen and (max-width:760px) {
  .portrait-column { width:100%; }
  .portrait-caption { display:flex; }
  html .portrait-frame { padding:5px; box-shadow:9px 9px 0 rgba(103,150,222,.10); }
}
