:root {
  --ink: #172c38; --ink-2: #334653; --muted: #77838a; --teal: #087e85;
  --teal-deep: #065860; --paper: #fcfbf8; --cream: #f5f4ef; --line: #e7e9e6;
  --gold: #dba46b; --white: #fff; --radius: 16px;
  --shadow: 0 22px 65px rgba(18,42,53,.07);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,-apple-system,sans-serif; font-size: 15px; line-height: 1.7; }
body.public-body { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1 0 auto; min-width: 0; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button,input,textarea,select { font: inherit; }
button,a { -webkit-tap-highlight-color: transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline: 3px solid #40b5b6; outline-offset: 4px; }
::selection { background: #c8e7df; color: var(--ink); }
.container { width: min(1180px, calc(100% - 84px)); margin-inline: auto; }
.site-header { height: 88px; background: rgba(252,251,248,.96); border-bottom: 1px solid rgba(24,45,55,.08); position: relative; z-index: 20; }
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: 200px; }
.brand-mark { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--ink); color: white; font-size: 22px; font-family: Georgia,serif; }
.brand-words { display: flex; flex-direction: column; line-height: 1.25; }
.brand-words strong { letter-spacing: 2px; font-size: 19px; }
.brand-words small { font-family: Arial,sans-serif; color: #8a9495; letter-spacing: 1.75px; margin-top: 6px; font-size: 9px; font-weight: 700; }
.desktop-nav { display: flex; align-items: center; gap: clamp(18px,2.35vw,36px); height: 100%; }
.desktop-nav a { display: flex; align-items: center; height: 100%; color: #4d5d64; white-space: nowrap; font-size: 13px; font-weight: 600; position: relative; transition: color .2s; }
.desktop-nav a::after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: var(--teal); transform: scaleX(0); transform-origin: left; transition: transform .22s; }
.desktop-nav a.current, .desktop-nav a:hover { color: var(--teal); }
.desktop-nav a.current::after,.desktop-nav a:hover::after { transform: scaleX(1); }
.mobile-nav { display: none; }
.site-footer { background: #102c38; color: #a8b8be; padding: 24px 0; margin-top: auto; }
.footer-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 12px; }
.footer-identity { display: flex; align-items: center; gap: 10px; letter-spacing: .05em; }
.footer-glyph { font-size: 23px; color: #e8b982; }
.footer-legal { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.footer-legal a { color: #c3d1d1; transition: color .2s; }
.footer-legal a:hover { color: white; }
.overline { color: var(--teal); font-size: 11px; font-family: Arial,sans-serif; font-weight: 800; letter-spacing: 2.15px; }
.hero { position: relative; overflow: hidden; background: #f7f7f2; }
.hero-noise { pointer-events: none; position: absolute; inset: 0; background: radial-gradient(circle at 70% 32%,#e1e9e1 0,transparent 34%),radial-gradient(circle at 2% 99%,#ebeae1 0,transparent 35%); opacity: .7; }
.hero-grid { min-height: 615px; display: grid; grid-template-columns: 1.03fr .97fr; gap: 55px; align-items: center; position: relative; }
.hero-copy { padding: 52px 0 62px; position: relative; z-index: 1; }
.eyebrow { display: flex; align-items: center; gap: 12px; font: 700 10px Arial,sans-serif; letter-spacing: 1.8px; color: #4c7775; white-space: nowrap; }
.eyebrow i { width: 8px; height: 8px; background: var(--teal); border-radius: 50%; }
.eyebrow-line { width: 44px; height: 1px; background: #a0b9b4; }
.hero-greeting { margin: 35px 0 9px; color: #536c72; font-size: 17px; letter-spacing: 1px; }
.hero h1 { font-weight: 780; font-size: clamp(39px,4.3vw,61px); line-height: 1.4; letter-spacing: -1.7px; margin: 0; }
.hero h1 em { font-style: normal; color: var(--teal); }
.hero-description { color: #687a7d; max-width: 495px; margin: 22px 0 29px; font-size: 15px; line-height: 2; }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.btn { border-radius: 6px; display: inline-flex; justify-content: center; align-items: center; gap: 22px; padding: 13px 23px; font-size: 13px; font-weight: 750; border: 1px solid transparent; transition: .2s ease; min-height: 47px; }
.btn-primary { background: var(--teal); color: white; }
.btn-primary:hover { background: var(--teal-deep); transform: translateY(-2px); box-shadow: 0 10px 22px #087e852b; }
.btn-outline { border-color: #9ab0af; color: #37595e; }
.btn-outline:hover { border-color: var(--teal); color: var(--teal); background: #eff7f2; }
.hero-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 55px; font-size: 11px; letter-spacing: 1px; color: #7b8987; }
.meta-rule { width: 26px; height: 1px; background: #7a9a94; margin-right: 4px; }
.meta-dot { color: var(--gold); }
.hero-visual { height: 540px; min-width: 0; position: relative; display: flex; align-items: center; justify-content: center; }
.visual-glow { position: absolute; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle,#cfe5dc 0,#e5eee6 56%,transparent 72%); }
.orbit { position: absolute; border: 1px solid #c1d5cd; border-radius: 50%; }
.orbit-one { width: 480px; height: 480px; }
.orbit-two { width: 355px; height: 355px; border-style: dashed; opacity: .7; transform: rotate(25deg); }
.floating-square { width: 18px; height: 18px; border: 3px solid #98b6b0; position: absolute; transform: rotate(28deg); }
.square-one { right: 12%; top: 15%; } .square-two { left: 4%; bottom: 24%; width: 11px; height: 11px; border-color: var(--gold); }
.portrait-card { position: relative; z-index: 2; width: 310px; height: 410px; background: #fff; padding: 12px; border-radius: 155px 155px 9px 9px; box-shadow: 0 28px 70px #24493a26; transform: rotate(3deg); }
.portrait-placeholder,.portrait-photo { width: 100%; height: 282px; border-radius: 145px 145px 4px 4px; object-fit: cover; }
.portrait-placeholder { overflow: hidden; background: linear-gradient(145deg,#285968,#17414c 55%,#0b303d); display: grid; place-items: center; position: relative; }
.portrait-placeholder>span { font-family: Georgia,"Songti SC",serif; font-size: 150px; font-weight: 400; color: #d6ede7; transform: rotate(-3deg); z-index: 1; line-height: 1; }
.portrait-placeholder::before { content: ""; width: 370px; height: 370px; position: absolute; border: 1px solid #8cb3b44f; border-radius: 50%; top: 86px; left: -40px; }
.portrait-placeholder::after { content: ""; position: absolute; width: 140px; height: 140px; border-radius: 50%; border: 1px solid #9abebc55; top: -42px; right: -44px; }
.portrait-lines { position: absolute; bottom: 38px; right: 12px; display: grid; gap: 7px; }
.portrait-lines i { width: 70px; height: 1px; background: #fff6; }
.portrait-caption { padding: 14px 12px 0; display: flex; flex-direction: column; line-height: 1.35; }
.portrait-caption>span { display: flex; justify-content: space-between; color: #96a6a3; font-size: 9px; font-weight: 800; letter-spacing: 1.8px; }
.portrait-caption>span b { color: var(--teal); font-size: 17px; }
.portrait-caption strong { font-size: 23px; letter-spacing: 2px; margin-top: 3px; }
.portrait-caption small { color: #96a3a5; font-size: 10px; letter-spacing: 1px; margin-top: 2px; }
.floating-label { position: absolute; z-index: 3; background: #fff; color: #516b69; box-shadow: var(--shadow); border: 1px solid #e5ebe6; border-radius: 6px; padding: 12px 15px; bottom: 85px; left: -12px; font: 700 10px Arial,sans-serif; letter-spacing: .6px; transform: rotate(-4deg); }
.label-bullet { color: #e6b47b; padding-right: 5px; }
.visual-index { position: absolute; right: 0; bottom: 26px; color: #90a6a0; font: 700 12px Arial,sans-serif; letter-spacing: 1px; }
.hero-stats { display: grid; grid-template-columns: repeat(4,1fr) 1.3fr; align-items: center; position: relative; border-top: 1px solid #dce5dd; padding: 27px 0 31px; gap: 20px; }
.hero-stats>div:not(.stats-aside) { display: flex; flex-direction: column; gap: 2px; }
.hero-stats strong { font-size: 27px; letter-spacing: -1px; line-height: 1.15; }
.hero-stats span { font-size: 11px; color: #748984; font-weight: 600; }
.stats-aside { justify-self: end; display: flex; flex-direction: column; gap: 9px; font-family: Arial,sans-serif; }
.stats-aside span:first-child { letter-spacing: 1.6px; font-size: 10px; }
.stats-aside span:last-child { color: #365e60; font-size: 12px; }
.stats-aside b { color: var(--teal); margin-left: 5px; }
.section { padding-top: 100px; padding-bottom: 108px; }
.home-section { padding-top: 104px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 40px; }
.section-heading h2 { font-size: clamp(27px,3.6vw,39px); line-height: 1.3; margin: 13px 0 9px; letter-spacing: -1px; }
.accent-period { color: var(--teal); }
.section-heading p,.section-intro p { margin: 0; color: var(--muted); font-size: 13px; }
.section-link { color: var(--ink-2); white-space: nowrap; font-weight: 700; font-size: 13px; border-bottom: 1px solid #b6c0bf; padding-bottom: 8px; transition: color .2s; }
.section-link span { margin-left: 10px; color: var(--teal); font-size: 16px; }
.section-link:hover { color: var(--teal); }
.research-feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.research-feature { min-height: 270px; border-radius: 10px; padding: 25px 27px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; transition: transform .2s, box-shadow .2s; }
.research-feature:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.feature-dark { color: #fff; background: #173d49; }
.feature-light { color: #213e48; background: #deebe7; }
.feature-paper { color: #293a40; background: #f2ebdf; }
.card-overline { display: flex; justify-content: space-between; letter-spacing: 1.6px; font: 700 10px Arial,sans-serif; opacity: .7; }
.card-overline b { font-weight: 400; }
.research-feature h3 { font-size: 25px; margin: 10px 0 6px; }
.research-feature p { margin: 0; font-size: 12px; max-width: 235px; opacity: .75; line-height: 1.9; }
.feature-arrow { position: absolute; right: 22px; bottom: 22px; font-size: 23px; opacity: .9; }
.decor-lines,.decor-rings,.decor-stars { font-size: 64px; font-family: Georgia,serif; position: absolute; top: 54px; right: 19px; opacity: .16; line-height: 1; }
.decor-stars { font-size: 86px; }
.mini-publications { border-top: 1px solid var(--line); margin-top: 38px; padding-top: 28px; display: grid; grid-template-columns: 145px 1fr; gap: 28px; }
.mini-label { color: #687c80; font-size: 12px; font-weight: 750; }
.mini-publication { display: flex; align-items: center; gap: 18px; padding: 5px 0 20px; }
.mini-publication + .mini-publication { border-top: 1px solid var(--line); padding-top: 20px; }
.publication-year { font: 700 12px Arial,sans-serif; color: var(--teal); }
.mini-publication>span:nth-child(2) { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.mini-publication strong { font-size: 14px; font-weight: 700; }.mini-publication small { color: #819097; font-size: 11px; }
.mini-publication>a { color: var(--teal); font-size: 19px; }
.teaching-band { background: #f1f5f2; }
.course-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 19px; }
.course-card { display: flex; flex-direction: column; min-height: 307px; border-radius: 9px; padding: 24px 25px 22px; overflow: hidden; position: relative; background: #fff; box-shadow: 0 4px 25px #243c4010; transition: transform .22s,box-shadow .22s; }
.course-card:hover { transform: translateY(-5px); box-shadow: 0 17px 38px #23443818; }
.course-card::before { content: ""; position: absolute; width: 150px; height: 150px; border-radius: 50%; border: 23px solid var(--card-shade); right: -74px; top: 59px; opacity: .65; }
.course-card.accent-teal { --card-main:#087f85; --card-shade:#e5f3ee; }
.course-card.accent-orange { --card-main:#c78d5c; --card-shade:#fbf1e4; }
.course-card.accent-purple { --card-main:#7774aa; --card-shade:#efecf8; }
.course-top,.course-bottom { display: flex; justify-content: space-between; align-items: center; gap: 10px; position: relative; z-index: 1; }
.course-top { color: #9ba6a5; font: 700 10px Arial,sans-serif; letter-spacing: 1.4px; }
.course-symbol { background: var(--card-shade); color: var(--card-main); width: 33px; height: 33px; border-radius: 50%; font-size: 19px; display: grid; place-items: center; font-weight: 400; }
.course-content { margin: auto 0; position: relative; z-index: 1; }
.course-code { color: var(--card-main); font: 700 11px Arial,sans-serif; letter-spacing: 1px; }
.course-content h3 { color: var(--ink); font-size: 21px; margin: 8px 0; line-height: 1.4; }
.course-content p { font-size: 12px; line-height: 1.85; color: #839095; max-width: 240px; margin: 0; }
.course-bottom { border-top: 1px solid #edf0ed; padding-top: 14px; font-size: 11px; color: #8b9596; }
.course-bottom>span:last-child { color: var(--card-main); font-weight: 750; }
.course-bottom b { font-size: 16px; margin-left: 5px; }
.article-preview-list { border-top: 1px solid var(--line); }
.article-preview { display: grid; grid-template-columns: 135px 1fr 36px; gap: 25px; align-items: start; padding: 26px 0; border-bottom: 1px solid var(--line); }
.article-preview:hover h3 { color: var(--teal); }
.article-date { font: 700 11px Arial,sans-serif; color: #81918f; margin-top: 8px; letter-spacing: .2px; }
.category-tag { display: inline-flex; border-radius: 4px; color: #167e81; background: #e7f3ef; padding: 4px 9px; font-size: 10px; font-weight: 800; }
.article-preview h3 { margin: 9px 0 5px; font-size: 20px; transition: color .2s; }
.article-preview p { font-size: 12px; color: #899598; margin: 0; }
.article-arrow { font-size: 22px; color: var(--teal); justify-self: end; }
.contact-strip { background: #e5efeb; padding: 42px 0; }
.contact-strip-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.contact-strip span { color: var(--teal); font: 700 10px Arial,sans-serif; letter-spacing: 1.8px; }
.contact-strip h2 { font-size: 27px; margin: 8px 0 0; }
.page-hero { background: #173c48; color: white; padding: 70px 0 76px; position: relative; overflow: hidden; }
.page-hero::after { content: ""; position: absolute; width: 430px; height: 430px; right: -120px; top: -240px; border: 1px solid #5d909151; border-radius: 50%; box-shadow: 0 0 0 65px #ffffff05,0 0 0 130px #ffffff05; pointer-events: none; }
.page-hero-inner { display: flex; align-items: center; justify-content: space-between; }
.page-hero .overline { color: #86c6c1; }
.page-hero h1 { margin: 16px 0 9px; line-height: 1.23; font-size: clamp(40px,5vw,62px); letter-spacing: 1px; position: relative; z-index: 1; }
.page-hero h1 span { color: #d7ad7b; }
.page-hero p { color: #b4c9cb; font-size: 14px; position: relative; z-index: 1; margin: 16px 0 0; }
.page-hero-decoration { font-size: 160px; line-height: 1; color: #ffffff13; margin-right: 72px; }
.content-section { padding-top: 70px; padding-bottom: 110px; }
.about-grid { display: grid; grid-template-columns: 340px minmax(0,1fr); gap: clamp(48px,7vw,105px); }
.profile-aside { align-self: start; border: 1px solid #e8e9e2; background: white; border-radius: 8px; overflow: hidden; box-shadow: 0 18px 50px #172c3810; }
.profile-art { height: 290px; background: linear-gradient(145deg,#205667,#0e3745); display: grid; place-items: center; }
.profile-art>span { color: #d5e9e7; font-size: 125px; font-family: Georgia,serif; }
.profile-art img { width: 100%; height: 100%; object-fit: cover; }
.profile-aside-content { padding: 26px; }
.profile-aside-content>span { color: var(--teal); font: 700 10px Arial,sans-serif; letter-spacing: 2px; }
.profile-aside-content h2 { font-size: 30px; margin: 8px 0 3px; }
.profile-aside-content p { color: #637579; margin: 0 0 20px; }
.profile-aside-content div { font-size: 12px; color: #8d9998; margin: 5px 0; }
.profile-main>.overline,.detail-main>.overline { display: block; margin-bottom: 9px; }
.profile-main h2,.detail-main h2 { font-size: 27px; margin: 0 0 20px; }
.prose { white-space: pre-line; overflow-wrap: anywhere; color: #536b70; line-height: 2.2; font-size: 15px; margin: 0; }
.profile-divider { border-top: 1px solid var(--line); margin: 43px 0; }
.contact-details>div { display: flex; align-items: baseline; border-bottom: 1px solid var(--line); padding: 13px 0; gap: 30px; overflow-wrap: anywhere; }
.contact-details span { color: #9aa5a5; width: 75px; flex: none; font-size: 12px; }
.contact-details a { color: var(--teal); font-size: 13px; }.contact-details strong { font-size: 13px; font-weight: 500; }
.muted { color: #95a2a3; font-size: 13px; }
.research-tabs { display: flex; gap: 10px; border-bottom: 1px solid var(--line); padding-bottom: 24px; flex-wrap: wrap; }
.research-tabs a { color: #617176; border: 1px solid #dbe5e1; border-radius: 5px; padding: 10px 16px; font-size: 12px; font-weight: 700; transition: .2s; }
.research-tabs a:hover { background: var(--teal); border-color: var(--teal); color: white; }
.research-tabs span { opacity: .5; padding-left: 5px; }
.research-block { padding-top: 68px; }
.block-heading { margin-bottom: 30px; }.block-heading h2 { font-size: 29px; margin: 7px 0 4px; }
.block-heading p { color: var(--muted); font-size: 13px; margin: 6px 0 0; }
.record-list { border-top: 1px solid var(--line); }
.record-item { display: grid; grid-template-columns: 44px 1fr 40px; gap: 25px; padding: 26px 0; border-bottom: 1px solid var(--line); }
.record-serial { color: #b3c2be; font: 700 13px Arial,sans-serif; padding-top: 3px; }
.record-body h3 { font-size: 17px; line-height: 1.55; margin: 0 0 7px; }
.record-body>p { color: #75888c; font-size: 12px; margin: 0 0 8px; }
.record-meta { display: flex; flex-wrap: wrap; gap: 12px; color: var(--teal); font: 700 11px Arial,sans-serif; }
.record-body>.record-desc { font-size: 13px; color: #6f8387; margin: 11px 0 0; }
.round-link { width: 36px; height: 36px; background: #eef5f2; color: var(--teal); border-radius: 50%; display: grid; place-items: center; font-size: 19px; }
.project-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.project-card { border: 1px solid var(--line); border-radius: 8px; padding: 29px; background: white; }
.project-card-top { display: flex; justify-content: space-between; color: #adbbba; font: 700 12px Arial,sans-serif; }
.status-pill { border-radius: 99px; background: #e6f3ef; color: #177d77; padding: 5px 10px; font-size: 10px; }
.project-card h3 { font-size: 21px; margin: 27px 0 9px; }
.project-card p { color: #708389; font-size: 13px; min-height: 45px; margin: 0 0 20px; white-space: pre-line; }
.project-facts { border-top: 1px solid var(--line); padding-top: 14px; }
.project-facts div { display: flex; align-items: baseline; gap: 12px; margin-top: 7px; }
.project-facts span { font-size: 11px; color: #9caaac; min-width: 65px; }
.project-facts strong { font-size: 12px; font-weight: 600; color: #526b70; }
.student-groups { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px; }
.student-group-header { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 14px; border-bottom: 2px solid var(--ink); gap: 10px; }
.student-group-header h3 { font-size: 20px; margin: 0; }
.student-group-header span { color: #94a4a4; font: 700 10px Arial,sans-serif; letter-spacing: .6px; }
.student-item { border-bottom: 1px solid var(--line); display: flex; align-items: center; padding: 16px 0; gap: 13px; }
.student-avatar { background: #dfede8; color: #25817c; border-radius: 50%; width: 43px; height: 43px; display: grid; place-items: center; font-size: 17px; flex: none; }
.student-info { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.student-info strong { font-size: 14px; }.student-info small { font-size: 11px; color: #88999b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.student-year { color: #a2afae; font: 700 11px Arial,sans-serif; }.student-arrow { color: var(--teal); font-size: 19px; margin-left: 7px; }
.student-item:hover .student-info strong { color: var(--teal); }
.small-page-hero { padding: 54px 0 60px; }
.back-link { display: inline-block; margin-bottom: 26px; color: #a9cecb; font-size: 12px; font-weight: 750; }
.back-link:hover { color: white; }
.detail-layout { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 80px; align-items: start; }
.detail-side { border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 25px; }
.detail-side h3 { margin: 0 0 17px; font-size: 18px; }
.detail-side>div { border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; padding: 13px 0; overflow-wrap: anywhere; }
.detail-side span { color: #9ca9a9; font-size: 11px; }.detail-side strong,.detail-side a { color: #35525a; font-size: 13px; font-weight: 650; }
.detail-side a { color: var(--teal); }
.resource-section { margin-top: 80px; }
.resource-list { border-top: 1px solid var(--line); }
.resource-item { display: flex; align-items: center; gap: 20px; border-bottom: 1px solid var(--line); padding: 22px 0; }
.resource-icon { display: grid; place-items: center; width: 48px; height: 48px; flex: none; border-radius: 8px; font-size: 23px; background: #e8f3ef; color: var(--teal); }
.resource-text { min-width: 0; flex: 1; }.resource-text h3 { margin: 0 0 3px; font-size: 15px; }.resource-text p { color: #8a9a9a; font-size: 12px; margin: 0; overflow-wrap: anywhere; }
.download-btn { color: var(--teal); border: 1px solid #a9c7c1; border-radius: 5px; white-space: nowrap; padding: 9px 17px; font-size: 12px; font-weight: 750; }.download-btn:hover { background: var(--teal); color: white; }
.section-intro { margin-bottom: 32px; }.section-intro h2 { font-size: 28px; margin: 7px 0 0; }
.counter { color: #9aa6a3; font: 700 10px Arial,sans-serif; margin-left: 9px; vertical-align: middle; letter-spacing: 1px; }
.teaching-grid .course-card { border: 1px solid var(--line); }
.news-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.news-card { border: 1px solid var(--line); border-radius: 7px; background: white; min-height: 275px; padding: 23px; display: flex; flex-direction: column; justify-content: space-between; transition: .2s; }
.news-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.news-card-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; font: 700 11px Arial,sans-serif; color: #9ba8a7; }
.news-card h3 { font-size: 19px; line-height: 1.6; margin: 21px 0 10px; }.news-card p { font-size: 12px; color: #829293; margin: 0; line-height: 1.9; }
.news-more { border-top: 1px solid var(--line); padding-top: 13px; color: var(--teal); font-size: 12px; font-weight: 700; margin-top: 22px; }
.news-more b { float: right; font-size: 19px; }
.article-detail { padding-top: 72px; padding-bottom: 100px; max-width: 820px; }
.dark-back { color: var(--teal); }.dark-back:hover { color: var(--ink); }
.article-heading h1 { font-size: clamp(31px,4vw,46px); line-height: 1.45; margin: 21px 0; }
.article-byline { color: #93a2a2; display: flex; gap: 20px; font: 700 12px Arial,sans-serif; padding-bottom: 35px; border-bottom: 1px solid var(--line); }
.article-lead { font-size: 18px; color: #56747a; padding-top: 22px; line-height: 2; }
.article-content { font-size: 16px; padding: 28px 0 65px; min-height: 230px; }
.article-bottom { display: flex; justify-content: space-between; gap: 15px; padding-top: 20px; border-top: 1px solid var(--line); color: #97a5a5; font: 700 11px Arial,sans-serif; letter-spacing: 1px; }
.article-bottom a { color: var(--teal); }
.software-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.software-card { background: white; border: 1px solid var(--line); border-radius: 9px; padding: 28px; }
.software-card-header { display: flex; justify-content: space-between; align-items: start; }
.software-icon { border-radius: 12px; display: grid; place-items: center; width: 62px; height: 62px; background: #e3f0eb; color: var(--teal); font-size: 33px; }
.software-version { background: #f6f6f2; border-radius: 20px; color: #809395; padding: 5px 12px; font: 700 11px Arial,sans-serif; }
.software-card h3 { margin: 24px 0 7px; font-size: 24px; }
.software-summary { font-size: 13px; color: #698088; margin: 0 0 15px; }
.software-description { white-space: pre-line; color: #74888b; font-size: 12px; line-height: 1.9; min-height: 35px; }
.software-meta { display: flex; flex-wrap: wrap; gap: 16px; color: #90a1a1; font-size: 11px; margin-top: 22px; }
.software-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; border-top: 1px solid var(--line); padding-top: 20px; margin-top: 25px; }
.software-source { color: var(--teal); font-weight: 700; font-size: 12px; }.btn-disabled { background: #eaeceb; color: #9aa3a4; cursor: not-allowed; }
.empty-state { grid-column: 1 / -1; background: #f6f8f5; text-align: center; color: #8a9b9b; padding: 40px 25px; font-size: 14px; border: 1px dashed #d9e4de; border-radius: 7px; }
.empty-state h3 { color: var(--ink); margin: 5px 0; }.empty-state p { margin: 0; }
.empty-symbol { font-size: 42px; color: var(--teal); }.light-empty { background: white; }
.error-screen { padding: 110px 0 140px; text-align: center; }.error-screen h1 { font-size: 110px; margin: 5px 0; line-height: 1.2; }
.error-screen h1 span { color: var(--teal); }.error-screen p { color: #819393; margin-bottom: 24px; }

@media(max-width:1100px) {
  .container { width: min(100% - 48px,1180px); }
  .desktop-nav { gap: 17px; }.brand { min-width: 165px; }
  .hero-grid { gap: 5px; }.hero-visual { transform: scale(.91); transform-origin: center; }
  .hero h1 { font-size: clamp(37px,4.5vw,54px); }
  .floating-label { left: 0; }
  .detail-layout { gap: 40px; }
}
@media(max-width:800px) {
  .site-header { height: 74px; }.desktop-nav { display: none; }
  .mobile-nav { display: block; position: relative; }
  .mobile-nav summary { cursor: pointer; list-style: none; display: flex; flex-direction: column; gap: 5px; padding: 10px; }
  .mobile-nav summary::-webkit-details-marker { display: none; }
  .mobile-nav summary span { display: block; height: 2px; width: 22px; background: var(--ink); border-radius: 4px; }
  .mobile-nav nav { position: absolute; top: 48px; right: 0; background: white; width: 215px; border: 1px solid #e3e9e6; border-radius: 8px; box-shadow: var(--shadow); padding: 8px; }
  .mobile-nav a { display: block; padding: 11px 13px; border-radius: 5px; font-size: 13px; }
  .mobile-nav a[aria-current],.mobile-nav a:hover { color: var(--teal); background: #eaf3ee; }
  .hero-grid { grid-template-columns: 1fr; gap: 0; min-height: 0; }
  .hero-copy { padding: 68px 0 0; }
  .hero-visual { height: 440px; transform: scale(.78); margin-top: -22px; margin-bottom: -30px; }
  .hero-stats { grid-template-columns: repeat(4,1fr); }.stats-aside { display: none; }
  .research-feature-grid,.course-grid,.news-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .research-feature-grid a:last-child { grid-column: 1/-1; min-height: 190px; }
  .about-grid { grid-template-columns: 260px minmax(0,1fr); gap: 40px; }
  .profile-art { height: 235px; }.profile-aside-content { padding: 20px; }
  .student-groups { grid-template-columns: 1fr; }
  .page-hero-decoration { display: none; }
  .section { padding-top: 73px; padding-bottom: 80px; }
  .content-section { padding: 55px 0 85px; }
}
@media(max-width:590px) {
  .container { width: calc(100% - 38px); }
  .brand-words strong { font-size: 17px; }.brand-mark { width: 38px; height: 38px; }
  .hero-copy { padding: 52px 0 0; }
  .eyebrow { font-size: 8px; letter-spacing: 1.1px; gap: 7px; }
  .eyebrow-line { width: 14px; }
  .hero-greeting { margin-top: 26px; font-size: 14px; }
  .hero h1 { font-size: clamp(34px,8.4vw,48px); letter-spacing: -.7px; }
  .hero-description { font-size: 13px; margin: 18px 0 24px; }
  .hero-meta { margin-top: 30px; }
  .hero-visual { height: 340px; transform: scale(.66); margin: -32px -40px -48px; }
  .hero-stats { padding: 23px 0; gap: 10px; }.hero-stats strong { font-size: 23px; }.hero-stats span { font-size: 10px; }
  .section-heading { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 27px; }
  .section-heading h2 { font-size: 30px; }
  .research-feature-grid,.course-grid,.news-grid,.project-grid,.software-grid { grid-template-columns: 1fr; }
  .research-feature-grid a:last-child { grid-column: auto; min-height: 240px; }
  .research-feature { min-height: 240px; }
  .mini-publications { grid-template-columns: 1fr; gap: 15px; }.mini-publication { gap: 12px; }
  .article-preview { grid-template-columns: 1fr 30px; gap: 8px; }.article-date { grid-column: 1/-1; }
  .contact-strip-inner { align-items: flex-start; flex-direction: column; }.contact-strip h2 { font-size: 23px; }
  .page-hero { padding: 55px 0 63px; }.page-hero h1 { font-size: 43px; }
  .about-grid,.detail-layout { grid-template-columns: 1fr; gap: 37px; }
  .profile-aside { max-width: 340px; }.profile-art { height: 280px; }
  .record-item { grid-template-columns: 30px 1fr 25px; gap: 10px; }
  .record-body h3 { font-size: 15px; }
  .student-group-header span { font-size: 9px; }
  .resource-item { flex-wrap: wrap; gap: 13px; }.resource-text { flex-basis: calc(100% - 70px); }.download-btn { margin-left: 60px; }
  .article-detail { padding-top: 45px; }.article-heading h1 { font-size: 32px; }
  .footer-inner,.footer-legal { align-items: flex-start; flex-direction: column; gap: 6px; }
  .site-footer { padding: 24px 0; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior: auto!important; transition-duration: .01ms!important; animation-duration: .01ms!important; } }