/* CMDS Lab: the shared Home palette and interface for every page. */
:root {
  --ink:#202d36; --muted:#58666c; --accent:#3d656c; --line:#dce2e0;
  --paper:#ffffff; --soft:#f3f5f3; --max:1200px;
  --primary-color:var(--ink); --secondary-color:var(--accent);
  --accent-color:var(--accent); --text-dark:var(--ink); --text-light:var(--muted);
  --bg-light:var(--soft); --bg-cream:var(--soft); --white:var(--paper); --border-color:var(--line);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:94px; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial,Helvetica,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
button { font:inherit; }
a,button { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible { outline:3px solid #72959a; outline-offset:5px; }
.wrap { width:min(var(--max),calc(100% - 96px)); margin-inline:auto; }
.skip-link { position:fixed; top:10px; left:12px; padding:10px 16px; background:var(--ink); color:white; z-index:200; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; top:0; z-index:100; background:#fff; border-bottom:1px solid var(--line); }
.site-header .nav-inner { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:36px; }
.site-header .brand { display:flex; align-items:center; gap:12px; text-decoration:none; flex-shrink:0; }
.site-header .brand-mark { width:36px; height:36px; color:var(--accent); }
.site-header .brand-name { display:block; font-size:23px; font-weight:700; letter-spacing:-.8px; line-height:1.15; }
.site-header .brand-subtitle { display:block; font-size:10px; letter-spacing:.16px; color:var(--muted); line-height:1.55; margin-top:4px; }
.site-header .desktop-menu { display:flex; gap:31px; align-items:center; margin:0; padding:0; list-style:none; font-size:14px; }
.desktop-menu > li > a,.people-trigger { display:block; padding:27px 0 23px; text-decoration:none; border-bottom:3px solid transparent; color:#4c585e; }
.desktop-menu > li > a:hover,.people-trigger:hover { color:var(--accent); }
.desktop-menu > li > a[aria-current="page"],.people-trigger.active { color:var(--accent); border-color:var(--accent); }
.people { position:relative; }
.people-trigger { background:none; border-top:0; border-left:0; border-right:0; cursor:pointer; }
.caret { margin-left:3px; font-size:10px; }
.people-menu { display:none; position:absolute; top:100%; left:-18px; min-width:150px; margin:0; padding:8px; list-style:none; background:white; border:1px solid var(--line); box-shadow:0 8px 20px #202d3610; }
.people.open .people-menu { display:block; }
.people-menu a { display:block; padding:9px 12px; text-decoration:none; font-size:14px; }
.people-menu a:hover,.people-menu a[aria-current="page"] { background:var(--soft); color:var(--accent); }
.site-header .menu-toggle { display:none; background:transparent; border:1px solid var(--line); padding:9px 12px; cursor:pointer; color:var(--ink); border-radius:3px; }
.menu-lines { width:18px; height:14px; display:block; border-top:1.5px solid currentColor; border-bottom:1.5px solid currentColor; position:relative; }
.menu-lines::after { content:""; position:absolute; top:5px; left:0; width:100%; border-top:1.5px solid currentColor; }
.site-header .mobile-menu { display:none; border-top:1px solid var(--line); padding:10px 24px 18px; background:white; }
.mobile-menu a { display:block; padding:10px 0; text-decoration:none; }
.mobile-menu a[aria-current="page"] { color:var(--accent); font-weight:600; }
.mobile-menu .mobile-people { color:var(--muted); font-size:12px; margin:8px 0 0; text-transform:uppercase; letter-spacing:.1em; }
.mobile-menu .sub-link { padding-left:16px; }
.site-footer { padding-block:36px 23px; background:var(--paper); text-align:left; border:0; }
.site-footer .footer-main { display:flex; align-items:start; justify-content:space-between; gap:35px; }
.site-footer .footer-title { margin:0 0 8px; font-size:15px; font-weight:700; color:var(--ink); }
.site-footer .footer-address { margin:0; font-size:12px; line-height:1.8; color:var(--muted); }
.site-footer .footer-contact { margin:0; font-size:12px; color:var(--muted); text-align:right; }
.site-footer .footer-contact a { color:var(--accent); text-decoration:none; }
.site-footer .footer-bottom { margin-top:25px; padding-top:17px; border-top:1px solid var(--line); color:#738082; font-size:10px; display:flex; gap:20px; justify-content:space-between; }
.site-footer .footer-bottom p { margin:0; font-size:10px; color:#738082; }

/* Inner pages share the same spacing, paper, muted teal and fine rules. */
.page-inner main {
  padding:48px 0 72px;
  --primary-color:var(--ink); --secondary-color:var(--accent); --accent-color:var(--accent);
  --text-dark:var(--ink); --text-light:var(--muted); --border-color:var(--line);
}
.page-inner .container { width:min(var(--max),calc(100% - 96px)); margin-inline:auto; }
.page-inner .profile-section,.page-inner .content-section,.page-inner .member-card,
.page-inner .recruitment-card,.page-inner .contact-info-card,.page-inner .map-section,
.page-inner .research-intro,.page-inner .research-card {
  background:var(--paper); border:1px solid var(--line); border-radius:4px; box-shadow:none;
}
.page-inner .profile-section { padding:38px; }
.page-inner .content-section { padding:32px 38px; }
.page-inner .profile-info h1 { color:var(--ink); font-size:42px; font-weight:600; line-height:1.15; letter-spacing:-1.2px; }
.page-inner .profile-position,.page-inner .timeline-date,.page-inner .award-year { color:var(--accent); }
.page-inner .profile-photo { background:var(--soft); border:1px solid var(--line); border-radius:4px; box-shadow:none; }
.page-inner .profile-bio { color:var(--muted); font-size:15px; text-align:left; }
.page-inner .section-title { color:var(--ink); font-weight:600; border-color:var(--line); border-bottom-width:1px; }
.page-inner .social-btn { border:1px solid var(--line); background:var(--soft); border-radius:3px; color:var(--accent); box-shadow:none; }
.page-inner .social-btn:hover { color:white; background:var(--accent); border-color:var(--accent); }
.page-inner .page-kicker,.page-inner .section-label { color:var(--accent); font-size:10px; letter-spacing:.18em; font-weight:600; }
.page-inner .page-title { color:var(--ink); font-weight:600; font-size:48px; letter-spacing:-1.4px; }
.page-inner .page-desc { color:var(--muted); font-size:15px; }
.page-inner .member-card { background:var(--soft); }
.page-inner .member-card::after { display:none; }
.page-inner .member-name { color:var(--ink); font-weight:600; }
.page-inner .member-name-ko { color:var(--muted); }
.page-inner .member-photo { border:6px solid var(--paper); background:var(--line); box-shadow:0 3px 12px #202d3610; }
.page-inner .member-role { color:var(--accent); border:1px solid #cbd9d5; background:#eaf0ee; border-radius:3px; font-weight:600; }
.page-inner .member-detail-label { color:var(--ink); }
.page-inner .sub-hero,.page-inner .pub-hero { background:var(--soft); color:var(--ink); border:0; border-bottom:1px solid var(--line); min-height:0; }
.page-inner .sub-hero-inner,.page-inner .pub-hero-inner { width:min(var(--max),calc(100% - 96px)); margin-inline:auto; padding:42px 0 35px; text-align:left; }
.page-inner .sub-title,.page-inner .pub-hero-title { color:var(--ink); font-size:48px; line-height:1.12; letter-spacing:-1.4px; font-weight:600; }
.page-inner .sub-kicker { font-size:10px; font-weight:600; letter-spacing:.18em; color:var(--accent); margin-bottom:14px; }
.page-inner .pub-filter { justify-content:flex-start; gap:24px; font-size:13px; font-weight:500; margin:0; padding:0; }
.page-inner .pub-filter li { color:var(--muted); }
.page-inner .pub-filter li.active,.page-inner .pub-filter li:hover { color:var(--accent); border-bottom-color:var(--accent); }
.page-inner .pub-intro { color:var(--muted); font-size:13px; }
.page-inner .year-title { color:var(--accent); font-size:32px; font-weight:600; }
.page-inner .year-divider { background:var(--line); opacity:1; }
.page-inner .paper-title,.page-inner .paper-authors { color:var(--ink); }
.page-inner .paper-title { font-weight:600; }
.page-inner .paper-authors strong { font-weight:700; }
.page-inner .paper-journal { color:var(--accent); }
.page-inner .paper-no { color:var(--muted); }
.page-inner .paper-item { border-color:var(--line); }
.page-inner .doi-link { color:var(--accent); border-color:#cbd9d5; background:#eaf0ee; border-radius:3px; font-weight:600; padding:3px 8px; }
.page-inner .doi-link:hover { color:white; border-color:var(--accent); background:var(--accent); }
.page-inner .career-divider { border-color:var(--line); }
.page-inner .career-divider-text { color:var(--muted); font-weight:600; font-size:21px; text-decoration:none; }
.page-inner .recruitment-card,.page-inner .contact-info-card { padding:32px; }
.page-inner .recruit-hero { border-radius:4px; background:var(--soft); border-color:var(--line); }
.page-inner .recruit-title { color:var(--ink); font-weight:600; font-size:34px; }
.page-inner .recruit-subtitle,.page-inner .recruit-message { color:var(--muted); font-size:15px; }
.page-inner .recruit-badge { color:var(--accent); background:#eaf0ee; border-radius:3px; font-weight:600; font-size:10px; }
.page-inner .recruit-tag { color:var(--accent); border-color:var(--line); background:var(--paper); border-radius:3px; box-shadow:none; font-size:12px; font-weight:500; }
.page-inner .recruit-highlight { color:var(--accent); background:var(--soft); border-color:var(--line); border-radius:4px; font-weight:500; font-size:14px; }
.page-inner .recruit-highlight strong { font-weight:600; }
.page-inner .contact-detail-card { background:var(--soft); border-color:var(--line); border-radius:4px; }
.page-inner .contact-detail-icon { color:var(--accent); background:#e2eae6; border-radius:3px; }
.page-inner .contact-label { color:var(--ink); font-weight:600; }
.page-inner .contact-value { color:var(--muted); font-size:14px; }
.page-inner .contact-value a { color:var(--accent); }
.page-inner .map-frame { border-radius:3px; }
.page-inner .research-intro { background:var(--soft); }
.page-inner .overview-title { color:var(--ink); font-weight:600; font-size:clamp(28px,3vw,40px); line-height:1.18; }
.page-inner .overview-subtitle { color:var(--muted); }
.page-inner .research-card:hover { transform:none; box-shadow:0 4px 16px #202d3610; }
.page-inner .research-figure { background:var(--soft); border-color:var(--line); }
.page-inner .research-figure img { border-radius:3px; box-shadow:none; }
.page-inner .research-content h3 { color:var(--ink); font-weight:600; }
.page-inner .research-content p { color:var(--muted); }
.page-inner .research-highlight { color:var(--accent); font-weight:600; }
.page-inner .divider-banner span { color:var(--accent); font-weight:600; }
.page-inner .divider-banner::before,.page-inner .divider-banner::after { background:var(--line); }
.page-inner .scroll-reveal { opacity:1; visibility:visible; transform:none; filter:none; transition:none; }
.page-inner .scroll-reveal.active { animation:none; }
@media(max-width:1100px) {
  .wrap,.page-inner .container,.page-inner .sub-hero-inner,.page-inner .pub-hero-inner { width:calc(100% - 72px); }
  .site-header .brand-subtitle { max-width:205px; font-size:9px; }
  .site-header .desktop-menu { gap:22px; font-size:13px; }
}
@media(max-width:800px) {
  .wrap,.page-inner .container,.page-inner .sub-hero-inner,.page-inner .pub-hero-inner { width:calc(100% - 48px); }
  .site-header .nav-inner { min-height:70px; gap:16px; }
  .site-header .desktop-menu { display:none; }
  .site-header .menu-toggle { display:block; }
  .site-header .mobile-menu.open { display:block; }
  .page-inner main { padding-block:32px 50px; }
  .page-inner .profile-section,.page-inner .content-section { padding:26px; }
  .page-inner .profile-info h1 { font-size:36px; }
  .page-inner .page-title,.page-inner .sub-title,.page-inner .pub-hero-title { font-size:38px; }
  .page-inner .recruit-title { font-size:28px; }
  .page-inner .recruitment-card,.page-inner .contact-info-card { padding:24px; }
}
@media(max-width:480px) {
  .wrap,.page-inner .container,.page-inner .sub-hero-inner,.page-inner .pub-hero-inner { width:calc(100% - 40px); }
  .site-header .brand-mark { width:29px; height:29px; }
  .site-header .brand { gap:9px; }
  .site-header .brand-name { font-size:21px; }
  .site-header .brand-subtitle { font-size:8px; max-width:210px; }
  .site-footer .footer-main { flex-direction:column; gap:18px; }
  .site-footer .footer-contact { text-align:left; }
  .site-footer .footer-bottom { flex-direction:column; gap:5px; }
  .page-inner .profile-section,.page-inner .content-section { padding:22px 18px; }
  .page-inner .page-title,.page-inner .sub-title,.page-inner .pub-hero-title { font-size:34px; }
  .page-inner .profile-info h1 { font-size:32px; }
  .page-inner .social-links { flex-wrap:wrap; justify-content:center; }
  .page-inner .social-btn { font-size:12px; padding:8px 12px; }
  .page-inner .pub-filter { gap:14px; font-size:12px; }
  .page-inner .recruitment-card,.page-inner .contact-info-card { padding:20px 16px; }
  .page-inner .recruit-title { font-size:25px; }
  .page-inner .member-card { padding:24px 18px; }
  .page-inner .member-role { font-size:14px; }
  .page-inner .member-details { font-size:14px; }
  .page-inner .member-detail { flex-wrap:wrap; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }