/* ===== CSS 变量 ===== */
:root {
    --accent: oklch(55% 0.22 25);
    --accent-light: oklch(68% 0.18 25);
    --accent-dark: oklch(40% 0.22 25);
    --surface-0: oklch(98% 0 0);
    --surface-1: oklch(96% 0.003 250);
    --surface-2: oklch(93% 0.005 250);
    --surface-raised: oklch(99.5% 0 0);
    --border: oklch(88% 0.005 250);
    --text-primary: oklch(18% 0.01 250);
    --text-secondary: oklch(45% 0.01 250);
    --text-muted: oklch(62% 0.008 250);
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --shadow-sm: 0 1px 3px oklch(18% 0.01 250 / 0.08);
    --shadow-md: 0 4px 16px oklch(18% 0.01 250 / 0.1);
    --shadow-lg: 0 8px 32px oklch(18% 0.01 250 / 0.12);
    --transition: 180ms cubic-bezier(0.4, 0, 0.2, 1);
}

@media (prefers-color-scheme: dark) {
    :root {
        --accent: oklch(62% 0.2 25);
        --accent-light: oklch(72% 0.16 25);
        --surface-0: oklch(12% 0.008 250);
        --surface-1: oklch(16% 0.01 250);
        --surface-2: oklch(20% 0.01 250);
        --surface-raised: oklch(22% 0.01 250);
        --border: oklch(28% 0.01 250);
        --text-primary: oklch(94% 0.005 250);
        --text-secondary: oklch(70% 0.008 250);
        --text-muted: oklch(52% 0.008 250);
        --shadow-sm: 0 1px 3px oklch(0% 0 0 / 0.3);
        --shadow-md: 0 4px 16px oklch(0% 0 0 / 0.35);
        --shadow-lg: 0 8px 32px oklch(0% 0 0 / 0.4);
    }
}

/* ===== 基础 ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-tap-highlight-color: transparent; }
body {
    font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    background: var(--surface-0);
    color: var(--text-primary);
    line-height: 1.6;
    min-height: 100vh;
    overflow-x: hidden;
}

/* ===== 导航栏 ===== */
.navbar {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    background: oklch(98% 0 0 / 0.85);
    backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--border);
    transition: var(--transition);
}
@media (prefers-color-scheme: dark) {
    .navbar { background: oklch(12% 0.008 250 / 0.9); }
}
.nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    height: 56px;
}
.logo {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--accent);
    letter-spacing: -0.01em;
}
.menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
}
.menu-toggle:hover { background: var(--surface-2); }
.menu-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--text-primary);
    border-radius: 2px;
    transition: var(--transition);
}
.menu-toggle.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.active span:nth-child(2) { opacity: 0; }
.menu-toggle.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.nav-menu {
    list-style: none;
    max-height: 0;
    overflow: hidden;
    transition: max-height 300ms cubic-bezier(0.4, 0, 0.2, 1);
    background: var(--surface-1);
    border-top: 1px solid var(--border);
}
.nav-menu.open { max-height: 400px; }
.nav-menu li { border-bottom: 1px solid var(--border); }
.nav-menu li:last-child { border-bottom: none; }
.nav-link {
    display: block;
    padding: 14px 20px;
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 0.9375rem;
    font-weight: 500;
    transition: var(--transition);
}
.nav-link:hover, .nav-link.active {
    color: var(--accent);
    background: oklch(from var(--accent) l c h / 0.06);
}

/* ===== 主内容 ===== */
.main-content {
    padding-top: 56px;
    min-height: 100vh;
}
.container {
    max-width: 480px;
    margin: 0 auto;
    padding: 24px 16px 40px;
}

/* ===== 页面标题 ===== */
.page-header {
    text-align: center;
    margin-bottom: 28px;
}
.page-title {
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-bottom: 6px;
    background: linear-gradient(135deg, var(--accent-dark), var(--accent), var(--accent-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.page-subtitle {
    font-size: 0.875rem;
    color: var(--text-muted);
}

/* ===== 区块 ===== */
.section-block {
    margin-bottom: 32px;
}
.section-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--border);
}
.section-title .emoji { font-size: 1.25rem; }

/* ===== 卡片 ===== */
.item-card {
    background: var(--surface-1);
    border-radius: var(--radius-lg);
    padding: 16px 18px;
    margin-bottom: 12px;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition), box-shadow var(--transition);
}
.item-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.item-card.highlight {
    border-left: 4px solid var(--accent);
    background: linear-gradient(to right, oklch(from var(--accent) l c h / 0.05), var(--surface-1));
}
.item-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}
.item-header h3 {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.5;
    flex: 1;
}
.item-desc {
    font-size: 0.8125rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-top: 4px;
}

/* ===== 查看按钮 ===== */
.view-btn {
    background: linear-gradient(135deg, var(--accent), var(--accent-light));
    color: #fff;
    border: none;
    padding: 6px 14px;
    border-radius: 99px;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 2px 8px oklch(from var(--accent) l c h / 0.25);
    flex-shrink: 0;
}
.view-btn:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 12px oklch(from var(--accent) l c h / 0.35);
}
.view-btn:active {
    transform: scale(0.98);
}

/* ===== 获奖展示（滚动图片） ===== */
.award-showcase {
    background: linear-gradient(135deg, oklch(from var(--accent) l c h / 0.08), oklch(from var(--accent-light) l c h / 0.04));
    border-radius: var(--radius-lg);
    padding: 20px 18px;
    margin-top: 24px;
    border: 2px solid oklch(from var(--accent) l c h / 0.15);
    box-shadow: var(--shadow-md);
}
.showcase-title {
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--accent);
    text-align: center;
    margin-bottom: 16px;
}
.scrolling-container {
    overflow: hidden;
    width: 100%;
    position: relative;
    border-radius: var(--radius-md);
    background: var(--surface-raised);
    padding: 12px 0;
}
.scrolling-images {
    display: flex;
    gap: 16px;
    animation: scroll 25s linear infinite;
    width: max-content;
}
.scrolling-images img {
    height: 180px;
    width: auto;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    object-fit: cover;
    transition: transform var(--transition);
}
.scrolling-images img:hover {
    transform: scale(1.05);
    cursor: pointer;
    box-shadow: var(--shadow-md);
}
@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-100% / 2 - 8px)); }
}
/* 复制一份图片以实现无缝滚动 */
.scrolling-images::after {
    content: '';
    display: flex;
    gap: 16px;
}
.showcase-note {
    font-size: 0.8125rem;
    color: var(--text-secondary);
    text-align: center;
    margin-top: 14px;
    font-style: italic;
}

/* ===== 模态框 ===== */
.modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 200;
    background: oklch(0% 0 0 / 0.75);
    align-items: center;
    justify-content: center;
    padding: 20px;
    backdrop-filter: blur(6px);
}
.modal.open { display: flex; }
.modal-content {
    position: relative;
    max-width: 100%;
    max-height: 90vh;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--surface-raised);
    box-shadow: var(--shadow-lg);
    animation: modalIn 200ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes modalIn {
    from { opacity: 0; transform: scale(0.88); }
    to   { opacity: 1; transform: scale(1); }
}
.modal-close {
    position: absolute;
    top: 10px; right: 14px;
    font-size: 1.5rem;
    cursor: pointer;
    color: var(--text-muted);
    line-height: 1;
    z-index: 1;
    background: var(--surface-1);
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    transition: var(--transition);
}
.modal-close:hover { background: var(--surface-2); color: var(--text-primary); }
#modalImage {
    display: block;
    max-width: 100%;
    max-height: 85vh;
    object-fit: contain;
}

/* ===== 响应式优化 ===== */
@media (min-width: 768px) {
    .container { max-width: 720px; }
    .page-title { font-size: 2.25rem; }
}

/* ===== 科技视觉升级 ===== */
body{background-image:linear-gradient(120deg,rgba(3,10,25,.78),rgba(9,22,52,.58)),url('https://img.aladiin1.cn/%E5%9B%BE%E7%89%87/%E7%BD%91%E7%AB%99%E8%83%8C%E6%99%AF%E5%9B%BE.png');background-size:cover;background-position:center top;background-attachment:fixed}body:before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 15%,rgba(0,225,255,.2),transparent 26%),radial-gradient(circle at 90% 70%,rgba(255,25,95,.18),transparent 30%);mix-blend-mode:screen;z-index:-1}.navbar{background:rgba(4,13,33,.72);border-color:rgba(0,225,255,.28)}.container{max-width:1180px}.page-title{font-size:clamp(2rem,5vw,4.5rem);text-shadow:0 0 24px rgba(0,220,255,.35)}.item-card,.award-showcase{background:rgba(7,20,48,.76);border-color:rgba(0,225,255,.25);backdrop-filter:blur(13px);box-shadow:0 0 24px rgba(0,190,255,.1)}.section-title{color:#f4f8ff}.view-btn{background:linear-gradient(135deg,#ff1856,#a234ff 55%,#00dfff)}.scrolling-container{background:rgba(3,13,34,.8);border-color:rgba(0,225,255,.25)}@media(min-width:701px){.section-block{display:grid;grid-template-columns:240px 1fr;gap:0 24px;align-items:start}.section-title{grid-column:1}.section-block>.item-card,.section-block>.award-showcase{grid-column:2}.section-block>.item-card{margin-bottom:12px}}

/* PC端三幅横向背景，移动端单幅背景 */
@media (min-width:701px){body{background-size:100% 100%,33.333333vw auto;background-repeat:no-repeat,repeat-x;background-position:center center,top center;background-attachment:fixed}}
@media (max-width:700px){body{background-size:auto 100vh;background-repeat:no-repeat;background-position:center top;background-attachment:scroll}}

/* ===== 竞赛获奖动态展示 ===== */
.competition-showcase{margin:0 0 30px;padding:22px 0 18px;border:1px solid rgba(0,225,255,.3);border-radius:22px;background:rgba(7,20,48,.78);backdrop-filter:blur(14px);box-shadow:0 0 32px rgba(0,190,255,.13);overflow:hidden}.showcase-heading{display:flex;align-items:baseline;gap:12px;padding:0 22px 16px;border-bottom:1px solid rgba(0,225,255,.18)}.showcase-heading h2{font-size:1.25rem;color:#f5f8ff}.showcase-kicker{font-size:.68rem;letter-spacing:.15em;color:#00dfff;font-weight:800}.showcase-count{margin-left:auto;color:#9fb5d8;font-size:.75rem}.competition-marquee{overflow:hidden;padding:14px 0}.competition-track{display:flex;gap:14px;width:max-content;animation:competitionScroll 48s linear infinite}.competition-track:hover{animation-play-state:paused}.competition-track img{width:220px;height:145px;object-fit:cover;border-radius:12px;background:#fff;border:1px solid rgba(0,225,255,.28);box-shadow:0 6px 18px rgba(0,0,0,.25);cursor:pointer;transition:transform .2s,box-shadow .2s}.competition-track img:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 0 22px rgba(0,225,255,.35)}@keyframes competitionScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}@media(max-width:700px){.competition-showcase{margin-bottom:24px;padding-top:18px}.showcase-heading{display:block;padding:0 16px 12px}.showcase-heading h2{font-size:1.08rem;margin:3px 0}.showcase-count{display:block}.competition-track{gap:10px;animation-duration:38s}.competition-track img{width:165px;height:110px}}@media(min-width:701px){.competition-showcase{max-width:1120px;margin-left:auto;margin-right:auto}.competition-track img{width:250px;height:165px}}

/* ===== PC端背景色调统一：三幅背景图 + 深海军蓝蒙版 ===== */
@media(min-width:701px){html{background:#050d1d}body{background-color:#061226;background-image:linear-gradient(180deg,rgba(2,10,27,.78) 0%,rgba(4,13,34,.88) 56%,rgba(3,9,24,.94) 100%),linear-gradient(90deg,rgba(0,217,255,.08),transparent 28%,transparent 72%,rgba(151,67,255,.1)),url('https://img.aladiin1.cn/%E5%9B%BE%E7%89%87/%E7%BD%91%E7%AB%99%E8%83%8C%E6%99%AF%E5%9B%BE.png');background-size:100% 100%,100% 100%,33.333333vw auto;background-repeat:no-repeat,no-repeat,repeat-x;background-position:center center,center center,top center;background-attachment:fixed,fixed,fixed}body:before{background:radial-gradient(circle at 14% 18%,rgba(0,214,255,.16),transparent 29%),radial-gradient(circle at 86% 76%,rgba(164,66,255,.13),transparent 32%);mix-blend-mode:screen}.navbar{background:rgba(3,13,33,.9);border-bottom-color:rgba(0,217,255,.34)}.item-card,.award-showcase,.competition-showcase{background-color:rgba(6,19,47,.83)}}

/* ===== 移动端背景色调统一：单幅沉浸背景 + 稳定深蓝遮罩 ===== */
@media(max-width:700px){html{background:#050d1d}body{background-color:#061226;background-image:linear-gradient(180deg,rgba(2,10,27,.76) 0%,rgba(4,13,34,.88) 52%,rgba(3,9,24,.94) 100%),linear-gradient(135deg,rgba(0,217,255,.08),transparent 40%,rgba(151,67,255,.11)),url('https://img.aladiin1.cn/%E5%9B%BE%E7%89%87/%E7%BD%91%E7%AB%99%E8%83%8C%E6%99%AF%E5%9B%BE.png');background-size:cover,cover,cover;background-repeat:no-repeat,no-repeat,no-repeat;background-position:center center,center center,center top;background-attachment:fixed,fixed,fixed}body:before{background:radial-gradient(circle at 12% 12%,rgba(0,214,255,.14),transparent 28%),radial-gradient(circle at 88% 76%,rgba(164,66,255,.12),transparent 31%);mix-blend-mode:screen}.navbar{background:rgba(3,13,33,.92);border-bottom-color:rgba(0,217,255,.3)}.item-card,.award-showcase,.competition-showcase{background-color:rgba(6,19,47,.86)}}

/* ===== 移动端可读性与点击提示全面优化 ===== */
@media(max-width:700px){body{color:#f8fbff;background-image:linear-gradient(180deg,rgba(2,9,25,.9),rgba(3,12,31,.94)),url('https://img.aladiin1.cn/%E5%9B%BE%E7%89%87/%E7%BD%91%E7%AB%99%E8%83%8C%E6%99%AF%E5%9B%BE.png');background-size:cover;background-position:center top;background-attachment:fixed}.navbar{background:rgba(2,10,28,.97);box-shadow:0 2px 18px rgba(0,0,0,.35)}.nav-link{color:#d9e6ff;font-size:1rem;font-weight:700;padding:16px 22px;min-height:54px}.nav-link.active{color:#fff;background:linear-gradient(90deg,rgba(0,217,255,.26),rgba(124,60,255,.16));border-left:3px solid #00d9ff}.item-card,.award-showcase,.competition-showcase{background:rgba(5,17,43,.94);border-color:rgba(91,221,255,.42);box-shadow:0 8px 26px rgba(0,0,0,.28)}.item-header h3,.section-title,.showcase-heading h2{color:#fff}.item-desc,.page-subtitle,.showcase-count{color:#c4d3ec}.view-btn{min-height:36px;padding:8px 14px;font-size:.82rem;font-weight:800}.competition-track img{border-color:rgba(91,221,255,.5)}}

/* 移动端导航稳定性修复 */
@media(max-width:700px){.navbar{z-index:1000;isolation:isolate}.nav-container{position:relative;z-index:1002}.menu-toggle{position:relative;z-index:1003;display:flex!important;align-items:center;justify-content:center;width:48px;height:48px;min-width:48px;touch-action:manipulation;cursor:pointer}.nav-menu{position:relative;z-index:1001;width:100%;max-height:0;visibility:hidden;opacity:0;pointer-events:none}.nav-menu.open{max-height:420px;visibility:visible;opacity:1;pointer-events:auto}.nav-menu .nav-link{position:relative;z-index:1002;display:flex;align-items:center}.menu-toggle span{pointer-events:none}}

/* ===== 全端直接展示导航：取消折叠菜单 ===== */
.navbar{height:auto}.menu-toggle{display:none!important}.nav-menu{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;max-height:none!important;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none}.nav-menu::-webkit-scrollbar{display:none}.nav-menu li{flex:0 0 auto}.nav-link{white-space:nowrap}@media(min-width:701px){.navbar{height:60px}.nav-container{height:60px}.nav-menu{position:absolute;right:max(20px,calc((100% - 1180px)/2));top:0;background:transparent;border:0;overflow:visible}.nav-link{height:60px;padding:19px 14px;border:0}.main-content{padding-top:60px}}@media(max-width:700px){.navbar{position:fixed;height:auto}.nav-container{height:54px}.nav-menu{position:static;width:100%;background:rgba(3,13,33,.98);border-top:1px solid rgba(0,217,255,.25);padding:0 8px}.nav-link{display:block;padding:12px 14px;min-height:46px;font-size:.86rem;font-weight:700;border-bottom:0}.main-content{padding-top:100px}}

/* 顶部仅保留导航链接 */
@media(min-width:701px){.nav-container{display:none!important}.nav-menu{left:0;right:0;justify-content:center}}
@media(max-width:700px){.nav-container{display:none!important}.nav-menu{justify-content:flex-start;border-top:0}.main-content{padding-top:46px}}


/* 移动端横向导航提示 */
.nav-scroll-hint{display:none}
@media(max-width:700px){.navbar{padding-bottom:30px}.nav-scroll-hint{position:absolute;right:8px;bottom:0;display:flex;align-items:center;gap:5px;height:30px;padding:0 8px;color:#8ff5ff;background:linear-gradient(90deg,transparent,rgba(2,10,28,.96) 28%);font-size:.72rem;font-weight:800;letter-spacing:.04em;pointer-events:none}.nav-scroll-hint b{font-size:1.25rem;line-height:1;animation:nav-hint-slide 1.25s ease-in-out infinite}.main-content{padding-top:76px}}
@keyframes nav-hint-slide{0%,100%{transform:translateX(3px);opacity:.65}50%{transform:translateX(-4px);opacity:1}}