/* 展示平台统一主题；奖状框保留独立的纸面与文字配色。 */
:root { --site-navy: #664b24; --site-gold: #c7a054; --site-ink: #57472e; --site-muted: #7a6b54; --site-line: #e8dfce; }
body { font-family: 'Microsoft YaHei', 'PingFang SC', 'Noto Sans SC', sans-serif; background: #f7f3e9; color: var(--site-ink); }
#hero { background-color: #59401f; background-position: center 54%; }
#hero > .page-container { padding-block: clamp(32px, 3.6vw, 80px); }
#hero-title { font-size: clamp(30px, 3.1vw, 76px); letter-spacing: .13em; line-height: 1.3; color: #eed5a4; background: none; -webkit-text-fill-color: #eed5a4; text-shadow: 0 2px 12px #34230990; text-wrap: balance; }
#hero-subtitle { font-size: clamp(20px, 2.05vw, 50px); line-height: 1.5; letter-spacing: .055em; text-wrap: balance; max-width: 100%; }
#platform-title { font-size: clamp(16px, 1.2vw, 28px); line-height: 1.6; }
#logo-cn { color: #eed5a4; }
#app > nav, #app > footer { background: var(--site-navy); }
#app > footer { border-color: var(--site-gold); }
#searchInput { background: #f8edce; font-size: .75rem; }
#nav-menu button { font-size: .8rem; }
#nav-menu .text-amber-400 { color: #eed5a4; }
#nav-menu .border-amber-400, #nav-menu .border-amber-500 { border-color: var(--site-gold); }
main.page-container { padding-block: clamp(24px, 2vw, 44px); }
main > section { margin-bottom: clamp(24px, 2vw, 44px); }
main > section.grid { gap: clamp(20px, 1.6vw, 36px); }
main > section.bg-white, main > section.grid > div { border-color: var(--site-line); border-radius: 12px; box-shadow: 0 2px 8px #664b2405; }
main h3 { color: var(--site-navy); font-size: clamp(16px, 1vw, 23px); letter-spacing: .025em; }
main .bg-gray-50 { background-color: #fcfaf4; }
main .border-gray-100, main .border-gray-200 { border-color: var(--site-line); }
main h3 + span, main .text-gray-500, main .text-gray-400 { color: var(--site-muted); }
main .text-blue-900, main .text-blue-950 { color: var(--site-navy); }
main .text-amber-500 { color: #af884c; }
#carousel-track > .cert-card { background: #fcfaf4; box-shadow: none; }
#video-list { background: #664b24; }
#video-list > div { border-color: #806438; }
#video-list .bg-slate-800 { background: #80602d; }
#video-list .border-amber-400 { border-color: var(--site-gold); }
#playBtn { background: #d9b879; color: #664b24; }
#playBtn:hover { background: #eed5a4; }
#acc-list { justify-content: flex-start; padding: 1rem; gap: .7rem; }
#acc-list .acc-head { padding: .85rem; background: #fbf8ef; }
#acc-list .acc-head:hover { background: #f3ead5; }
#acc-list .acc-head span { color: var(--site-ink); font-size: .8rem; line-height: 1.65; }
#acc-list .acc-content { font-size: .75rem; line-height: 1.9; color: #6d604b; padding: .85rem; }
#declare-list li, #report-list li, #support-list li { padding: .8rem .55rem; border-bottom: 1px solid #eee5d4; }
#declare-list li:last-child, #report-list li:last-child, #support-list li:last-child { border-bottom: 0; }
#declare-list li > div, #report-list li > div, #support-list li > div { min-width: 0; font-size: .8rem; line-height: 1.7; color: var(--site-ink); }
#declare-list li span, #report-list li span, #support-list li span { overflow-wrap: anywhere; }
#declare-list svg, #report-list svg, #support-list svg { flex-shrink: 0; color: #9b8256; }
#app > footer .text-gray-500, #app > footer .text-gray-300 { color: #e9ddc5; }
@media (max-width: 767px) {
    #hero-title { letter-spacing: .06em; }
    #hero-subtitle { letter-spacing: .015em; }
    #hero > .page-container { padding-block: 28px; }
}

/* 金色主调：导航用金底深字，深色区域使用暖棕，交互状态统一。 */
#app > nav { background: linear-gradient(105deg, #d3b36a, #ebd59b 50%, #d3b36a); color: #483619; border-bottom: 1px solid #b8934c; }
#nav-menu .nav-btn { color: #483619; }
#nav-menu .nav-btn.active { color: #38270e; border-color: #76531c; background: #fff5da70; }
#nav-menu .nav-btn:hover { color: #38270e; border-color: #76531c; background: #fff5da50; }
#searchInput { color: #513c1c; border: 1px solid #bfa064; }
#searchInput::placeholder { color: #78623f; }
#searchInput + button { color: #71582e; }
#hero { background-color: #a47a3e; background-blend-mode: luminosity; }
#hero-subtitle, #platform-title { color: #fff6df; }
#logo-en { color: #eee0c2; }
.school-wordmark {
    display: block;
    width: auto;
    filter: invert(1) sepia(.45) saturate(1.4);
    mix-blend-mode: screen;
}
#logo-cn .school-wordmark { height: 1.4em; margin-bottom: .25rem; }
#logo-en .school-wordmark { height: .8em; max-width: 75vw; }
#logo-svg { color: #8a682e; }
#site-logo { flex-shrink: 0; }
.site-logo-image { width: 40px; height: 40px; object-fit: contain; }
#site-logo.university-emblem {
    width: clamp(64px, 4.2vw, 86px);
    height: clamp(64px, 4.2vw, 86px);
    padding: 0;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
}
/* Show the circular emblem from the original artwork using a display crop. */
#site-logo.university-emblem .site-logo-image {
    position: absolute;
    width: 157.6%;
    max-width: none;
    height: auto;
    left: -28.8%;
    top: 0;
}
#hero .bg-gray-500 { background: #b49b6a; }
#video-list .vid-item { color: #fff3d8; }
#video-list .vid-item:hover, #video-list .vid-item.bg-slate-800 { background: #80602d; }
#video-list .vid-item span { color: #e2d2b1; }
#video-list .vid-item.border-amber-400 { border-color: #ebcc7d; }
main .text-gray-700 { color: #57472e; }
main .text-gray-600 { color: #6d604b; }
main li:hover { background-color: #f7efdd; }
.certificate-caption { color: #675235; }
#modal > div > div:first-child, #listModal > div > div:first-child, #videoModal > div > div:first-child { background: #664b24; }
#modal .text-blue-900, #listModal .text-blue-900, #videoModal .text-blue-900 { color: #76531c; }
#app > footer { color: #e9ddc5; }

/* 标题烫金：缓慢流动的高光，不改变文字尺寸和位置。 */
#hero-title {
    color: #f0cf7b;
    background-image: linear-gradient(112deg,
        #b9872f 0%, #e7bd60 16%, #fff0ad 27%, #c59337 39%,
        #f2cf78 50%, #fff8d3 57%, #ddb052 67%, #b9872f 82%, #e7bd60 100%);
    background-size: 260% 100%;
    background-position: 0% 50%;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
    filter: drop-shadow(0 1px 0 #795019) drop-shadow(0 3px 5px #38240a70);
    animation: title-gold-flow 9s ease-in-out infinite alternate;
}
@keyframes title-gold-flow {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}
@media (prefers-reduced-motion: reduce) {
    #hero-title { animation: none; background-position: 45% 50%; }
}
@supports not ((background-clip: text) or (-webkit-background-clip: text)) {
    #hero-title { background: none; -webkit-text-fill-color: #f0cf7b; }
}

/* 六个栏目标题栏采用统一的浅金浮雕质感。 */
main .section-heading {
    position: relative;
    padding: .85rem 1rem;
    border: 1px solid #ddcba5;
    border-radius: 8px;
    background: linear-gradient(180deg, #fffdf5 0%, #f6ebd1 52%, #edddba 100%);
    box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 #c6a46950,
                0 2px 3px #78531c12, 0 5px 10px #78531c08;
    gap: .75rem;
}
main .section-heading h3 {
    color: #67491f;
    text-shadow: 0 1px 0 #fffdf1;
}
main .section-heading > div:first-child > svg {
    color: #9a712f;
    filter: drop-shadow(0 1px 0 #fffdf1);
    flex-shrink: 0;
}
main .section-heading > span { color: #79613b; flex-shrink: 0; }
main .section-heading > span:hover { color: #4f3615; }
#section-top .section-heading {
    margin: 0;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 11px 11px 0 0;
    z-index: 1;
}

/* 材料列表提高阅读字号，三栏保持一致的节奏与换行。 */
#declare-list li, #report-list li, #support-list li {
    padding: .9rem .6rem;
    gap: .75rem;
    align-items: center;
}
#declare-list li > div, #report-list li > div, #support-list li > div {
    flex: 1;
    gap: .6rem;
    font-size: clamp(16px, .95vw, 22px);
    line-height: 1.65;
}
#declare-list li svg, #report-list li svg, #support-list li svg {
    width: clamp(17px, 1vw, 23px);
    height: clamp(17px, 1vw, 23px);
}
main .section-heading h3 {
    font-size: clamp(18px, 1.12vw, 26px);
    line-height: 1.5;
}

/* 首页各栏目保留全部条目，在四项高度内独立滚动。 */
#declare-list, #report-list, #support-list, #section-top #video-list, #acc-list {
    height: var(--list-height, auto);
    max-height: var(--list-height, none);
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    scrollbar-width: thin;
    scrollbar-color: #bea06a transparent;
    flex-grow: 0;
    flex-shrink: 0;
}
#acc-list > div { flex-shrink: 0; }
#acc-list { margin-bottom: auto; padding-bottom: 0; }
#section-top #video-list { bottom: auto; }
#section-top .video-layout { height: auto; }
/* 随容器等比铺满视频，比例不一致时居中裁切，避免播放器留黑边。 */
#section-top .video-stage {
    min-width: 0;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}
#videoEl {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
#video-list.no-scrollbar::-webkit-scrollbar { display: block; width: 6px; }
#video-list::-webkit-scrollbar-thumb { background: #bea06a; border-radius: 3px; }

/* 视频目录与成果介绍同步采用材料列表的阅读字号。 */
#video-list .vid-item {
    flex-shrink: 0;
    padding: .85rem .75rem;
    overflow-wrap: anywhere;
}
#video-list .vid-item > p,
#acc-list .acc-head span {
    font-size: clamp(16px, .95vw, 22px);
    line-height: 1.65;
}
#video-list .vid-item > span {
    font-size: clamp(13px, .78vw, 18px);
    line-height: 1.65;
    margin-top: .3rem;
}
#acc-list .acc-content {
    font-size: clamp(16px, .95vw, 22px);
    line-height: 1.85;
    padding: .9rem;
    overflow-wrap: anywhere;
}
#acc-list .acc-head { gap: .65rem; padding: .9rem; }
#acc-list .acc-icon { flex-shrink: 0; width: 1rem; height: 1rem; }
@media (min-width: 768px) {
    #section-top #video-list { position: relative; }
    #section-top .video-layout { position: relative; }
    #section-top #video-list {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        width: clamp(200px, 14vw, 320px);
        height: 100%;
        max-height: 100%;
        overflow-y: auto;
    }
    #section-top .video-stage { min-height: 420px; }
    #section-top #video-list .vid-item {
        box-sizing: border-box;
        height: 25%;
        min-height: 25%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}
#section-top .video-layout.single-video { grid-template-columns: minmax(0, 1fr); }
#section-top .single-video #video-list { display: none; }
#section-top .single-video .video-stage { grid-column: 1 / -1; width: 100%; }
#video-more.hidden { display: none; }
/* Equal three-column sections with compact navigation and independent document lists. */
#section-top > div { min-width: 0; }
#section-top,
#materials-section {
    align-items: stretch;
}
#section-top > div,
#materials-section > div {
    align-self: stretch;
    width: 100%;
    height: 100%;
}
#award-list {
    margin: 16px; padding: 0;
    height: var(--list-height, auto); max-height: var(--list-height, none);
    overflow-y: auto; overscroll-behavior: contain;
    scrollbar-width: thin; scrollbar-color: #bea06a transparent;
}
/* Fill only the four editable panels; video and awards retain their own sizing. */
#declare-list, #report-list, #support-list, #acc-list {
    box-sizing: border-box;
    justify-content: flex-start;
}
#declare-list > li > div, #report-list > li > div, #support-list > li > div {
    min-width: 0;
    overflow-wrap: anywhere;
}
@media (min-width: 768px) {
    #section-top > div:has(#declare-list), #section-top > div:has(#report-list),
    #materials-section > div:has(#support-list), #intro-card {
        min-height: 0;
        overflow: hidden;
        align-self: start;
        contain: size;
    }
    #acc-list { margin-bottom: 0; padding-bottom: 16px; }
    #intro-card { justify-content: flex-start; }
    #declare-list, #report-list, #support-list {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        justify-content: stretch;
        gap: 12px;
        grid-auto-rows: minmax(calc((var(--list-height) - (var(--visible-rows, 4) - 1) * 12px) / var(--visible-rows, 4)), auto);
        align-content: start;
    }
    #declare-list > li, #report-list > li, #support-list > li { margin-top: 0; }
    #acc-list > div { min-height: calc((var(--list-height) - 32px - (var(--visible-rows, 4) - 1) * 12px) / var(--visible-rows, 4)); }
    #acc-list .acc-head { min-height: calc((var(--list-height) - 32px - (var(--visible-rows, 4) - 1) * 12px) / var(--visible-rows, 4) - 2px); }
}
#award-list li { padding: .9rem .6rem; gap: .75rem; border-bottom: 1px solid #eee5d4; }
#award-list li > div { min-width: 0; flex: 1; font-size: clamp(16px,.95vw,22px); line-height: 1.65; }
#award-list li span { overflow-wrap: anywhere; }
#award-list svg { flex-shrink: 0; color: #9b8256; }
.original-preview-button { display: block; padding: .4rem .75rem; margin-top: .5rem; color: #76531c; border: 1px solid #d6c39c; border-radius: 4px; }
#searchResults { background: #fff; border: 1px solid #eadfc9; border-radius: 10px; padding: 10px; margin-bottom: 24px; max-height: 420px; overflow-y: auto; }
.search-result { display: flex; gap: 16px; text-align: left; width: 100%; padding: 12px; border-bottom: 1px solid #eee5d4; color: #664b24; }
.search-result span { flex: 0 0 8em; color: #987638; }
.search-result:hover { background: #faf4e7; }
nav .nav-btn { padding-left: clamp(10px,1vw,24px); padding-right: clamp(10px,1vw,24px); white-space: nowrap; }
nav #nav-menu { flex: 1; min-width: 0; flex-wrap: wrap; justify-content: flex-start; }
nav .page-container > div:last-child { flex-shrink: 0; }
@media (min-width: 768px) {
    #section-top { grid-template-columns: repeat(3,minmax(0,1fr)); }
    #section-top .video-layout { grid-template-columns: minmax(0,1fr) 36%; }
    #section-top #video-list { width: 36%; }
    #section-top .video-stage { min-height: 360px; }
    #section-top #video-list .vid-item { padding: .4rem; }
    #section-top #video-list .vid-item > p { font-size: clamp(13px,.85vw,18px); }
    #section-top #video-list .vid-item > span { font-size: clamp(11px,.7vw,15px); }
    #section-top .video-layout.single-video { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 767px) {
    .search-result { flex-direction: column; gap: 4px; }
    .search-result span { flex: none; }
}
@media (min-width: 768px) {
    #section-top { --panel-height: clamp(360px,24vw,480px); }
    #section-top .video-layout { height: var(--panel-height); }
    #section-top .video-stage { height: 100%; min-height: 0; aspect-ratio: auto; }
    #section-top #acc-list { height: var(--panel-height); max-height: var(--panel-height); }
    #section-top #acc-list > div { min-height: calc((var(--panel-height) - 16px - 2.1rem)/4); }
    #section-top #acc-list .acc-head { min-height: calc((var(--panel-height) - 16px - 2.1rem)/4 - 2px); }
    #section-top #award-list { height: calc(var(--panel-height) - 32px); max-height: calc(var(--panel-height) - 32px); }
    #award-list li { height: calc((var(--panel-height) - 68px)/4); }
    #award-list li span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
}
