/* ==========================================================================
   UCAS 评课社区 · 全站样式表
   --------------------------------------------------------------------------
   设计令牌见《共享接口契约》第六节 / docs/PLAN-v3.md §1.1
     主色 #2B5CFF   深字 #1F2A44   次字 #6B7688
     底色 #F6F7F9   卡片 #FFFFFF   边框 #E7EAF0
     雷达填充 rgba(43,92,255,.18)
     圆角 卡片 10px / 按钮 8px / 标签 6px
     容器宽 1120–1180px，左右留白 24px；卡片内边距 16–20px
   字号：页标题 26–28px/700，卡片标题 16px，正文 14px，元信息 12.5px
   ========================================================================== */

:root {
    /* --- 色板（契约令牌） --- */
    --c-primary: #2B5CFF;
    --c-primary-dark: #1E46D0;
    --c-primary-soft: #EEF2FF;
    --c-ink: #1F2A44;
    --c-muted: #6B7688;
    --c-bg: #F6F7F9;
    --c-card: #FFFFFF;
    --c-border: #E7EAF0;
    --c-radar-fill: rgba(43, 92, 255, .18);

    /* --- 语义色（仅用于状态，不参与品牌主色） --- */
    --c-success: #17A673;
    --c-warning: #E0A100;
    --c-danger: #E5484D;
    --c-info: #2B5CFF;

    /* --- 圆角 --- */
    --r-card: 10px;
    --r-btn: 8px;
    --r-tag: 6px;

    /* --- 尺寸 --- */
    --container-max: 1140px;
    --gutter: 24px;
    --card-pad: 20px;

    /* --- 字号 --- */
    --fs-page-title: 27px;
    --fs-card-title: 16px;
    --fs-body: 14px;
    --fs-meta: 12.5px;

    --shadow-card: 0 1px 2px rgba(31, 42, 68, .04), 0 1px 3px rgba(31, 42, 68, .03);
    --shadow-raise: 0 4px 14px rgba(31, 42, 68, .09);
}

/* --------------------------------------------------------------------------
   1. 基础
   -------------------------------------------------------------------------- */

body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
                 "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    font-size: var(--fs-body);
    color: var(--c-ink);
    background-color: var(--c-bg);
    padding-bottom: 30px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a { color: var(--c-primary); }
a:hover, a:focus { color: var(--c-primary-dark); text-decoration: none; }

h1, h2, h3, h4, h5 { color: var(--c-ink); }

/* Sticky footer styles（沿用原骨架的 #wrap / #push / #footer） */
html, body { height: 100%; }
#wrap {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    /* Negative indent footer by it's height */
    margin: 0 auto -60px;
}
#push, #footer { height: 60px; }
#footer { margin-bottom: 20px; }

.banner {
    width: 100%;
    padding: 5px 2px;
}

p { line-height: 25px; word-wrap: break-word; }

/* 容器宽度：契约要求 1120–1180px，这里取 1140 并保留左右 24px 留白
   （Bootstrap 的 .container 自带 padding-left/right:15px，这里补齐到 24px，
     小屏回退为 15px 以适配移动端。） */
@media (min-width: 768px) {
    .container { padding-left: var(--gutter); padding-right: var(--gutter); }
}
@media (min-width: 992px) {
    .container { width: 970px; }
}
@media (min-width: 1200px) {
    .container { width: var(--container-max); }
}

/* 页面主内容卡片：白底 + 圆角 + 极浅描边 */
.float-element {
    background-color: var(--c-card);
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    padding: 18px var(--card-pad) 24px;
    box-shadow: var(--shadow-card);
}

/* 页面标题（§1.1：26–28px / 700） */
.page-title {
    font-size: var(--fs-page-title);
    font-weight: 700;
    color: var(--c-ink);
    margin: 4px 0 6px;
    line-height: 1.3;
}
.page-title-en {
    font-size: 15px;
    font-weight: 400;
    color: var(--c-muted);
    margin-left: 10px;
}
.page-subtitle { font-size: var(--fs-meta); color: var(--c-muted); }

/* 面包屑 */
.breadcrumb-bar {
    font-size: var(--fs-meta);
    color: var(--c-muted);
    padding: 10px 0 14px;
}
.breadcrumb-bar a { color: var(--c-muted); }
.breadcrumb-bar a:hover { color: var(--c-primary); }
.breadcrumb-bar .sep { padding: 0 6px; color: #C3C9D6; }

/* --------------------------------------------------------------------------
   2. 顶栏（§1.2）
   -------------------------------------------------------------------------- */

.ucas-topbar {
    background: var(--c-card);
    border-bottom: 1px solid var(--c-border);
    margin-bottom: 0;
    border-radius: 0;
}
.ucas-topbar .navbar-header { position: relative; }
.ucas-brand,
.ucas-topbar .navbar-brand {
    font-size: 19px;
    font-weight: 700;
    color: var(--c-ink) !important;
    letter-spacing: .2px;
    height: auto;
    padding: 16px 15px 16px 0;
    line-height: 22px;
}
.ucas-brand:hover { color: var(--c-primary) !important; }

.ucas-topbar .navbar-nav > li > a {
    color: var(--c-ink);
    font-size: 15px;
    padding: 17px 16px;
    border-bottom: 2px solid transparent;
    background: transparent;
}
.ucas-topbar .navbar-nav > li > a:hover,
.ucas-topbar .navbar-nav > li > a:focus { color: var(--c-primary); }
.ucas-topbar .navbar-nav > li.active > a {
    color: var(--c-primary);
    font-weight: 600;
    border-bottom-color: var(--c-primary);
}

/* 顶栏右侧的「登录 / 注册」。
   坑：`.ucas-topbar .navbar-nav > li > a`（特异性 0,2,2）会盖掉 `.btn-blue`
   （0,1,0）的 background / padding / border-bottom —— 而 <button> 不受该规则
   影响。于是两个按钮盒模型不一致：一个透明底蓝边框、一个实心蓝，且高度错位。
   下面用同级或更高的特异性把它们统一成真正的按钮，且不覆盖各自配色。 */
.ucas-topbar .navbar-right > li > .btn,
.ucas-topbar .navbar-right > li > a.btn {
    margin: 12px 0 12px 10px;
    padding: 7px 18px;
    line-height: 20px;
    height: auto;
    border-radius: var(--r-btn);
    border-bottom-width: 1px;      /* 与 .btn 的 1px 边框对齐（不写颜色，留给配色类） */
    box-sizing: border-box;
    vertical-align: middle;
}
/* 显式恢复配色，压过 `.navbar-nav > li > a { background: transparent }` */
.ucas-topbar .navbar-right > li > a.btn-blue,
.ucas-topbar .navbar-right > li > .btn-blue {
    background-color: var(--c-primary);
    border-color: var(--c-primary);
    color: #fff;
}
.ucas-topbar .navbar-right > li > a.btn-blue:hover,
.ucas-topbar .navbar-right > li > .btn-blue:hover {
    background-color: var(--c-primary-dark);
    border-color: var(--c-primary-dark);
    color: #fff;
}
.ucas-topbar .navbar-right > li > a.btn-white,
.ucas-topbar .navbar-right > li > .btn-white {
    background-color: var(--c-card);
    border-color: var(--c-border);
    color: var(--c-primary);
}
.ucas-topbar .navbar-right > li > a.btn-white:hover,
.ucas-topbar .navbar-right > li > .btn-white:hover {
    background-color: var(--c-primary-soft);
    border-color: var(--c-primary);
}
/* 两个按钮所在的 <li> 用 flex 对齐，消除 baseline 造成的上下错位 */
.ucas-topbar .navbar-right > li:has(> .btn) { display: flex; align-items: center; }
.ucas-topbar .navbar-right > li > .btn { float: none; }

/* 顶栏搜索框 */
.ucas-topbar .navbar-form { margin-top: 10px; margin-bottom: 10px; }
.ucas-search-input {
    width: 235px;
    border-radius: var(--r-btn);
    border: 1px solid var(--c-border);
    background: var(--c-bg);
    box-shadow: none;
    height: 36px;
}
.ucas-search-input:focus {
    border-color: var(--c-primary);
    background: var(--c-card);
    box-shadow: 0 0 0 3px var(--c-primary-soft);
}
.ucas-search-btn {
    border-radius: var(--r-btn);
    border: 1px solid var(--c-border);
    background: var(--c-card);
    height: 36px;
}

/* --------------------------------------------------------------------------
   3. 底栏（§1.3，两列 8 项 + 免责声明 + 合规链接）
   -------------------------------------------------------------------------- */

#footer {
    border-top: 1px solid var(--c-border);
    background: var(--c-card);
    height: auto;
    min-height: 60px;
    margin-bottom: 0;
    padding-top: 22px;
    padding-bottom: 26px;
}
.footer-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-flow: column;
    grid-template-rows: repeat(2, auto);
    gap: 8px 24px;
    max-width: 560px;
    margin-bottom: 18px;
}
.footer-links a { color: var(--c-muted); font-size: 13.5px; }
.footer-links a:hover { color: var(--c-primary); }
.footer-divider { border-top: 1px solid var(--c-border); margin: 0 0 14px; }
.footer-brand { font-weight: 700; color: var(--c-ink); font-size: 14px; }
.footer-disclaimer { color: var(--c-muted); font-size: var(--fs-meta); }
.footer-legal { color: var(--c-muted); font-size: var(--fs-meta); margin-top: 6px; }
.footer-legal a { color: var(--c-muted); }
.footer-legal a:hover { color: var(--c-primary); }
.footer-legal .sep { padding: 0 6px; color: #C3C9D6; }

@media (max-width: 767px) {
    .footer-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: repeat(4, auto);
        grid-auto-flow: row;
        max-width: none;
    }
}

/* --------------------------------------------------------------------------
   4. 按钮
   -------------------------------------------------------------------------- */

.btn { border-radius: var(--r-btn); }
.btn:focus { outline: none; box-shadow: 0 0 0 3px var(--c-primary-soft); }

.btn-blue {
    color: #fff;
    font-weight: 600;
    background-color: var(--c-primary);
    border: 1px solid var(--c-primary);
}
.btn-blue:hover, .btn-blue:focus {
    color: #fff;
    background-color: var(--c-primary-dark);
    border-color: var(--c-primary-dark);
}
.btn-white {
    color: var(--c-primary);
    font-weight: 600;
    background-color: var(--c-card);
    border: 1px solid var(--c-border);
}
.btn-white:hover {
    color: var(--c-primary);
    background-color: var(--c-primary-soft);
    border-color: var(--c-primary);
}
.btn-grey {
    color: var(--c-muted);
    font-size: 14px;
    font-weight: 600;
    background-color: var(--c-bg);
    border: 1px solid var(--c-border);
}
.btn-grey:hover { color: var(--c-ink); background-color: #EFF1F5; }
.btn-group-inv .active { color: #fff; background-color: var(--c-primary); border-color: var(--c-primary); }

.btn-flat { border: 0; border-radius: 0; }
@media (max-width: 767px) { .btn-flat { padding: 5px 12px; } }
@media (min-width: 768px) { .btn-flat { padding: 5px 21px; } }

/* "写点评"等主行动按钮 */
.btn-action {
    border-radius: var(--r-btn);
    font-weight: 600;
    padding: 7px 18px;
    color: #fff;
    background-color: var(--c-primary);
    border: 1px solid var(--c-primary);
}
.btn-action:hover, .btn-action:focus { color: #fff; background-color: var(--c-primary-dark); }

/* --------------------------------------------------------------------------
   5. 筛选胶囊（§1.4 筛选面板）
   -------------------------------------------------------------------------- */

.filter-panel {
    background: var(--c-bg);
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    padding: 14px 16px;
    margin-bottom: 18px;
}
.filter-row { margin-bottom: 8px; }
.filter-row:last-child { margin-bottom: 0; }
.catalogue-filter-form { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: end; }
.catalogue-filter-form .filter-row { margin: 0; min-width: 150px; flex: 1 1 170px; }
.catalogue-filter-form .filter-label { display: block; margin: 0 0 4px; }
.level-filter { display: flex; flex: 1 1 100%; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 4px; }
.level-filter .filter-label { margin: 0 4px 0 0; }
.level-filter .capsule { margin: 0; }
.level-filter .capsule input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.level-filter .capsule:focus-within { outline: 2px solid var(--c-primary); outline-offset: 2px; }
.filter-hint { color: var(--c-muted); font-size: 13px; }
.filter-hint[hidden] { display: none; }
.filter-label {
    display: inline-block;
    min-width: 60px;
    margin-right: 10px;
    color: var(--c-muted);
    font-size: var(--fs-meta);
    font-weight: 600;
    vertical-align: middle;
}
.capsule-group { display: inline-flex; flex-wrap: wrap; gap: 8px; vertical-align: middle; }
.capsule {
    display: inline-block;
    padding: 5px 13px;
    font-size: 13px;
    line-height: 18px;
    color: var(--c-ink);
    background: var(--c-card);
    border: 1px solid var(--c-border);
    border-radius: 999px; /* 胶囊 */
    cursor: pointer;
    transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
.capsule:hover { border-color: var(--c-primary); color: var(--c-primary); }
.capsule.active,
.capsule.active:hover {
    color: #fff;
    background: var(--c-primary);
    border-color: var(--c-primary);
    font-weight: 600;
}

/* 兼容旧 .select-box / li.item 结构（配套过滤器仍以列表形式渲染） */
.select-box {
    background: var(--c-bg);
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    padding: 14px 16px;
    margin-bottom: 18px;
}
@media (max-width: 767px) { .select-box { padding: 10px 12px; margin: 12px 0; } }
.select-box a { text-decoration: none; color: var(--c-ink); }
.select-box li.item {
    padding: 5px 13px;
    margin: 2px 4px 2px 0;
    border-radius: 999px;
    border: 1px solid var(--c-border);
    background: var(--c-card);
    font-size: 13px;
}
.select-box li.item:hover,
.select-box li.item:hover a { color: var(--c-primary); border-color: var(--c-primary); background: var(--c-card); }
.select-box li.active,
.select-box li.active a { color: #fff; background-color: var(--c-primary); border-color: var(--c-primary); font-weight: 600; }

/* --------------------------------------------------------------------------
   6. 排序药丸（§1.4 排序标签）
   -------------------------------------------------------------------------- */

.sort-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}
.sort-bar .sort-label { color: var(--c-muted); font-size: var(--fs-meta); margin-right: 2px; }
.sort-pill {
    display: inline-block;
    padding: 5px 14px;
    font-size: 13px;
    line-height: 18px;
    color: var(--c-ink);
    background: var(--c-card);
    border: 1px solid var(--c-border);
    border-radius: 999px;
}
.sort-pill:hover { color: var(--c-primary); border-color: var(--c-primary); }
.sort-pill.active,
.sort-pill.active:hover {
    color: var(--c-primary);
    background: var(--c-primary-soft);
    border-color: var(--c-primary);
    font-weight: 600;
}
.sort-pill .caret { margin-left: 4px; }

/* --------------------------------------------------------------------------
   7. 分数徽标（§1.1：加粗、主色、附小号"分"）
   -------------------------------------------------------------------------- */

.score-badge {
    display: inline-flex;
    align-items: baseline;
    gap: 2px;
    color: var(--c-primary);
    font-weight: 700;
    line-height: 1;
}
.score-badge .score-value { font-size: 20px; }
.score-badge .score-unit { font-size: 11px; font-weight: 500; color: var(--c-muted); }
.score-badge.score-lg .score-value { font-size: 28px; }
.score-badge.score-sm .score-value { font-size: 16px; }
.score-badge.score-none .score-value { color: var(--c-muted); font-weight: 500; }

.score-inline { color: var(--c-primary); font-weight: 700; }
.score-label { color: var(--c-muted); font-size: var(--fs-meta); }

/* 旧 .rate-box（列表内数字方块） */
.rate-box {
    text-align: center;
    background-color: var(--c-primary-soft);
    color: var(--c-primary);
    border-radius: var(--r-tag);
    width: 45px;
    line-height: 45px;
    font-weight: 700;
}

/* --------------------------------------------------------------------------
   8. 点评卡片（§1.4）
   -------------------------------------------------------------------------- */

.review-card {
    background: var(--c-card);
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    padding: 16px 18px;
    margin-bottom: 12px;
    transition: box-shadow .14s ease, border-color .14s ease;
}
.review-card:hover { box-shadow: var(--shadow-raise); border-color: #DDE2EC; }
.review-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}
.review-card-course {
    font-size: var(--fs-card-title);
    font-weight: 600;
    color: var(--c-ink);
    line-height: 1.4;
}
.review-card-course:hover { color: var(--c-primary); }
.review-card-tags { margin-top: 6px; }
.review-card-body {
    color: #3A455F;
    line-height: 24px;
    margin: 8px 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.review-card-body.is-open {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
}
.review-card-meta {
    font-size: var(--fs-meta);
    color: var(--c-muted);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
}
.review-card-meta .dot-sep { color: #C3C9D6; }
.review-card-foot {
    border-top: 1px dashed var(--c-border);
    margin-top: 10px;
    padding-top: 8px;
    font-size: var(--fs-meta);
    color: var(--c-muted);
}
.review-card-avatar { margin-right: 12px; }

/* --------------------------------------------------------------------------
   9. 课程卡片（§1.4，含内嵌小雷达）
   -------------------------------------------------------------------------- */

.course-card {
    background: var(--c-card);
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    padding: 16px 18px;
    margin-bottom: 12px;
    transition: box-shadow .14s ease, border-color .14s ease;
}
.course-card:hover { box-shadow: var(--shadow-raise); border-color: #DDE2EC; }
.course-card-main { min-width: 0; }
.course-card-title {
    font-size: var(--fs-card-title);
    font-weight: 600;
    color: var(--c-ink);
    line-height: 1.4;
}
.course-card-title:hover { color: var(--c-primary); }
.course-card-en { font-size: var(--fs-meta); color: var(--c-muted); margin-left: 8px; font-weight: 400; }
.course-card-meta { font-size: var(--fs-meta); color: var(--c-muted); margin-top: 5px; }
.course-card-meta .dot-sep { color: #C3C9D6; padding: 0 5px; }
.course-card-sub { font-size: var(--fs-meta); color: var(--c-muted); margin-top: 6px; }

/* 卡片右侧"综合评价分 + 小雷达"二联 */
.course-card-score {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-shrink: 0;
}
.course-card-score .mini-radar,
.course-card-score .mini-radar-box {
    width: 68px;
    height: 68px;
    flex: 0 0 68px;
}
.course-card-score-text { text-align: right; }

/* --------------------------------------------------------------------------
   10. 雷达图容器（60–72px 小号 / 180–220px 标准）
   -------------------------------------------------------------------------- */

.mini-radar,
.mini-radar-box,
.radar-mini {
    width: 68px;
    height: 68px;
    min-width: 60px;
    min-height: 60px;
    max-width: 72px;
    max-height: 72px;
}
.radar-box,
.standard-radar {
    width: 100%;
    max-width: 240px;
    min-height: 200px;
    height: 220px;
    margin: 0 auto;
}
/* ECharts 在 canvas 里画轴标签，容器自身不能裁切它：
   给一点内边距，并让 canvas 撑满，避免"综合评价/课程难度"被切掉。 */
.radar-box canvas,
.standard-radar canvas {
    display: block;
    margin: 0 auto;
}
/* 降级占位（echarts 未加载时） */
.radar-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed var(--c-border);
    border-radius: var(--r-card);
    color: var(--c-muted);
    font-size: var(--fs-meta);
    text-align: center;
    padding: 6px;
    background: var(--c-bg);
}
/* 五维数值列表（标准雷达旁边/下方） */
.dim-list { list-style: none; padding: 0; margin: 10px 0 0; }
.dim-list li {
    display: flex;
    justify-content: space-between;
    font-size: var(--fs-meta);
    color: var(--c-muted);
    padding: 5px 0;
    border-bottom: 1px dashed var(--c-border);
}
.dim-list li:last-child { border-bottom: 0; }
.dim-list .dim-value { color: var(--c-primary); font-weight: 700; }
.dim-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 22px; max-width: 560px; }
.dim-grid li, .dim-grid li:last-child { min-width: 0; padding: 5px 0; border-bottom: 1px dashed var(--c-border); gap: 10px; }
@media (max-width: 480px) { .dim-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 10px; } }

/* --------------------------------------------------------------------------
   11. 侧栏卡片（§1.4 侧栏卡片：浅灰标题条 + 列表/说明）
   -------------------------------------------------------------------------- */

.side-card {
    background: var(--c-card);
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    margin-bottom: 16px;
    overflow: hidden;
}
.side-card-title {
    background: var(--c-bg);
    border-bottom: 1px solid var(--c-border);
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 600;
    color: var(--c-ink);
}
.side-card-title .float-right { font-weight: 400; font-size: var(--fs-meta); }
.side-card-body { padding: 14px 16px; }
.side-card-list { list-style: none; padding: 0; margin: 0; }
.side-card-list li {
    padding: 8px 0;
    border-bottom: 1px dashed var(--c-border);
    font-size: 13.5px;
    line-height: 1.6;
}
.side-card-list li:last-child { border-bottom: 0; }
.side-card-list li .meta { color: var(--c-muted); font-size: var(--fs-meta); }

/* 右栏通用间距 */
.right-col .side-card:last-child { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   12. 提示条（§1.4 提示条：浅底说明块）
   -------------------------------------------------------------------------- */

.notice-bar {
    background: var(--c-primary-soft);
    border: 1px solid #DCE4FF;
    border-left: 3px solid var(--c-primary);
    border-radius: var(--r-tag);
    color: #33427A;
    font-size: 13px;
    line-height: 1.7;
    padding: 10px 14px;
    margin-bottom: 14px;
}
.notice-bar.notice-plain {
    background: var(--c-bg);
    border: 1px solid var(--c-border);
    border-left: 3px solid #C3C9D6;
    color: var(--c-muted);
}
.notice-bar.notice-warn {
    background: #FFF8E6;
    border-color: #F4E3B4;
    border-left-color: var(--c-warning);
    color: #7A5B00;
}

/* --------------------------------------------------------------------------
   13. 标签 / 徽章（圆角 6px）
   -------------------------------------------------------------------------- */

.tag {
    display: inline-block;
    padding: 2px 9px;
    font-size: 12px;
    line-height: 18px;
    color: var(--c-muted);
    background: var(--c-bg);
    border: 1px solid var(--c-border);
    border-radius: var(--r-tag);
    margin-right: 5px;
}
.tag.tag-primary { color: var(--c-primary); background: var(--c-primary-soft); border-color: #DCE4FF; }
.tag.tag-ghost { background: transparent; }

.label { border-radius: var(--r-tag); font-weight: 500; }
.label-danger { background-color: #FDECEC; color: #B4232A; }
.label-info { background-color: var(--c-primary-soft); color: var(--c-primary-dark); }
.label-success { background-color: #E6F6F0; color: #0E7A54; }
.label-warning { background-color: #FFF6E0; color: #946200; }

/* 教师 name 可点 */
.teacher-chip {
    display: inline-block;
    padding: 2px 10px;
    margin: 0 4px 4px 0;
    font-size: 13px;
    color: var(--c-primary);
    background: var(--c-primary-soft);
    border: 1px solid #DCE8FF;
    border-radius: var(--r-tag);
}
.teacher-chip:hover { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }

/* 标签行（课程详情页标题下方） */
.tag-row { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tag-row .tag { margin-right: 0; }

/* --------------------------------------------------------------------------
   14. 选课规划器（§1.5 屏④）
   -------------------------------------------------------------------------- */

.planner-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}
.planner-toolbar .week-nav {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--c-border);
    border-radius: var(--r-btn);
    overflow: hidden;
}
.planner-toolbar .week-nav button {
    border: 0;
    background: var(--c-card);
    color: var(--c-ink);
    padding: 6px 12px;
    cursor: pointer;
}
.planner-toolbar .week-nav button:hover { background: var(--c-primary-soft); color: var(--c-primary); }
.planner-toolbar .week-nav .week-range {
    padding: 6px 12px;
    font-size: 13px;
    color: var(--c-ink);
    border-left: 1px solid var(--c-border);
    border-right: 1px solid var(--c-border);
    min-width: 172px;
    text-align: center;
}

.timetable {
    width: 100%;
    border-collapse: separate;
    border-spacing: 4px;
    table-layout: fixed;
}
.timetable th {
    font-size: var(--fs-meta);
    font-weight: 600;
    color: var(--c-muted);
    text-align: center;
    padding: 6px 4px;
    background: transparent;
}
.timetable th.period-col { width: 62px; color: #9AA3B4; font-weight: 500; }
.timetable td { vertical-align: top; height: 96px; }
.timetable td.slot-cell {
    background: var(--c-bg);
    border: 1px solid var(--c-border);
    border-radius: var(--r-tag);
    padding: 4px;
}
.timetable td.slot-cell.drop-hover { border-color: var(--c-primary); background: var(--c-primary-soft); }
.period-label {
    font-size: var(--fs-meta);
    color: var(--c-muted);
    text-align: center;
    line-height: 1.3;
    padding-top: 6px;
}
.period-label .period-num { display: block; font-weight: 600; color: #9AA3B4; }

.course-block {
    background: var(--c-primary-soft);
    border: 1px solid #C9D6FF;
    border-left: 3px solid var(--c-primary);
    border-radius: var(--r-tag);
    padding: 6px 8px;
    margin-bottom: 4px;
    font-size: 12px;
    line-height: 1.45;
    color: var(--c-ink);
    cursor: pointer;
}
.course-block:hover { background: #E3EAFF; }
.course-block .cb-name { font-weight: 600; display: block; }
.course-block .cb-room { color: var(--c-muted); font-size: 11.5px; }
.course-block .cb-link { color: var(--c-primary); font-size: 11.5px; }
.course-block.conflict {
    background: #FDECEC;
    border-color: #F5C2C4;
    border-left-color: var(--c-danger);
    color: #8C2429;
}
.course-block.conflict .cb-room { color: #B4232A; }

.progress-wrap { margin-bottom: 10px; }
.progress-track {
    height: 8px;
    background: var(--c-bg);
    border: 1px solid var(--c-border);
    border-radius: 999px;
    overflow: hidden;
}
.progress-fill { height: 100%; background: var(--c-primary); border-radius: 999px; }
.progress-text { font-size: var(--fs-meta); color: var(--c-muted); margin-top: 6px; }

.planner-chip {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 7px 10px;
    margin-bottom: 6px;
    background: var(--c-bg);
    border: 1px solid var(--c-border);
    border-radius: var(--r-tag);
    font-size: 13px;
}
.planner-chip .pc-remove { color: var(--c-muted); cursor: pointer; }
.planner-chip .pc-remove:hover { color: var(--c-danger); }

/* Course simulator: exact periods and weekend lessons. */
.planner-grid-scroll { overflow-x: auto; margin: 12px 0; border: 1px solid #E7EAF0; border-radius: 8px; }
.planner-grid { min-width: 840px; display: grid; grid-template-columns: 58px repeat(7, minmax(108px, 1fr)); background: #fff; }
.planner-grid-head { padding: 9px 3px; text-align: center; font-weight: 600; border-bottom: 1px solid #E7EAF0; border-right: 1px solid #E7EAF0; }
.planner-grid-head small { display: block; font-weight: 400; color: #6B7688; }
.planner-grid-time { height: 44px; padding: 5px 4px; font-size: 11px; text-align: center; color: #6B7688; border-bottom: 1px solid #E7EAF0; border-right: 1px solid #E7EAF0; }
.planner-day-column { position: relative; height: 572px; border-right: 1px solid #E7EAF0; background: repeating-linear-gradient(to bottom, #fff 0, #fff 43px, #E7EAF0 43px, #E7EAF0 44px); }
.planner-day-column.weekend { background: repeating-linear-gradient(to bottom, #FAFBFF 0, #FAFBFF 43px, #E7EAF0 43px, #E7EAF0 44px); }
.planner-slot { position: absolute; overflow: hidden; padding: 3px 4px; border: 1px solid #A9BFFB; border-left: 3px solid #2B5CFF; border-radius: 5px; background: #E9EFFF; color: #1F2A44; font-size: 11px; line-height: 1.25; text-decoration: none; }
.planner-slot strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.planner-slot.conflict { border-color: #CF4545; background: #FFEDEC; color: #9D2828; }
.planner-slot:hover { color: #1F2A44; text-decoration: none; background: #DCE6FF; }
.planner-conflicts { padding: 11px; margin: 9px 0; border: 1px solid #F1C7C7; background: #FFF3F2; border-radius: 8px; color: #8D2828; }
.planner-conflicts p { margin: 5px 0 0; }
.planner-browser { margin-top: 24px; border-top: 1px solid #E7EAF0; padding-top: 16px; }
.planner-browser h2 { font-size: 18px; margin: 0 0 12px; }
.planner-browser-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.planner-browser-filters input[type=search] { flex: 2 1 210px; }
.planner-browser-filters select { flex: 1 1 140px; }
.planner-browser-filters label { white-space: nowrap; font-weight: 400; }
.planner-result { display: flex; align-items: flex-start; gap: 10px; padding: 10px 2px; border-top: 1px solid #E7EAF0; }
.planner-result-main { flex: 1; min-width: 0; }
.planner-result-main strong { display: block; }
.planner-result-main small { color: #6B7688; }
.planner-result button { flex: none; }
.planner-chip { margin-top: 8px; }
.planner-chip .pc-remove { float: right; border: 0; background: transparent; font-size: 19px; }

/* 规划器左侧筛选 */
.planner-course-item {
    padding: 9px 10px;
    border: 1px solid var(--c-border);
    border-radius: var(--r-tag);
    margin-bottom: 6px;
    background: var(--c-card);
    font-size: 13px;
    cursor: pointer;
}
.planner-course-item:hover { border-color: var(--c-primary); background: var(--c-primary-soft); }
.planner-course-item.selected { border-color: var(--c-primary); background: var(--c-primary-soft); }

/* --------------------------------------------------------------------------
   15. 表格（排行榜 / 培养方案 / 统计）
   -------------------------------------------------------------------------- */

table.table.ucas-table {
    background: var(--c-card);
    border-color: var(--c-border);
}
table.table.ucas-table > thead > tr > th {
    background: var(--c-bg);
    border-color: var(--c-border);
    color: var(--c-muted);
    font-size: var(--fs-meta);
    font-weight: 600;
    vertical-align: middle;
}
table.table.ucas-table > tbody > tr > td { border-color: var(--c-border); vertical-align: middle; }
table.table.ucas-table > tbody > tr:hover { background: #FAFBFD; }

/* --------------------------------------------------------------------------
   16. 表单
   -------------------------------------------------------------------------- */

.form-control {
    border-radius: var(--r-btn);
    border: 1px solid var(--c-border);
    box-shadow: none;
    color: var(--c-ink);
}
.form-control:focus {
    border-color: var(--c-primary);
    box-shadow: 0 0 0 3px var(--c-primary-soft);
}
.form-control::placeholder { color: #AAB2C0; }

.auth-card {
    max-width: 460px;
    margin: 28px auto;
    background: var(--c-card);
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    padding: 26px 28px 30px;
    box-shadow: var(--shadow-card);
}
.auth-card h1, .auth-card h3 { margin-top: 0; font-weight: 700; font-size: 22px; }

/* 登录弹窗 */
.form-signin { max-width: 330px; padding: 30px 15px; margin: 0 auto; }
.form-signin .form-signin-heading { margin-bottom: 25px; }
.form-signin .checkbox { margin-bottom: 10px; padding: 5px 0; font-weight: normal; }
.form-signin .form-control {
    position: relative;
    height: auto;
    box-sizing: border-box;
    padding: 10px;
    font-size: 16px;
}
.form-signin .form-control:focus { z-index: 2; }
.form-signin input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
@media (max-width: 767px) { .modal-signin { width: 340px; } }
@media (min-width: 768px) { .modal-signin { width: 380px; } }

label.fileupload input { position: fixed; top: -9999px; }

/* --------------------------------------------------------------------------
   17. 兼容既有模板的工具类（历史遗留，不改动语义）
   -------------------------------------------------------------------------- */

@media (max-width: 767px) { .desktop { display: none; } }
@media (max-width: 991px) { .desktop-wide { display: none; } }
@media (min-width: 992px) { .mobile-wide { display: none; } }
@media (min-width: 768px) { .mobile { display: none; } }

@media (max-width: 767px) {
    .float-element { padding: 15px; margin-bottom: 15px; }
    .navbar { margin-bottom: 0; }
}
@media (min-width: 768px) {
    .navbar { margin-bottom: 5px; }
}
@media (min-width: 768px) { .desktop-width75 { width: 75%; } }

.container-md { width: 710px; }

.dashed { border-bottom: 1px dashed var(--c-border); }
.solid { border-bottom: 1px solid var(--c-border); }
.hr-box { border-bottom: 1px solid var(--c-border); padding-bottom: 20px; }

.lh-sm { line-height: 20px; }
.lh-lg { line-height: 25px; }

.bm-pd-md, .bm-pd-lg,
.ud-pd-sm, .ud-pd-md, .ud-pd-lg,
.rl-pd-sm, .rl-pd-md, .rl-pd-lg {
    overflow: hidden;
    word-wrap: break-word;
}
.ud-pd-md.display-folded { overflow: visible; }

.top-pd-sm { padding-top: 8px; }
.top-pd-md { padding-top: 15px; }
.top-pd-lg { padding-top: 30px; }
.bm-pd-sm { padding-bottom: 8px; }
.bm-pd-md { padding-bottom: 15px; }
.bm-pd-lg { padding-bottom: 30px; }
.ud-pd-sm { padding-top: 8px; padding-bottom: 8px; }
.ud-pd-md { padding-top: 15px; padding-bottom: 15px; }
.ud-pd-lg { padding-top: 30px; padding-bottom: 30px; }
.rl-pd-sm { padding-right: 8px; padding-left: 8px; }
.rl-pd-md { padding-right: 15px; padding-left: 15px; }
.rl-pd-lg { padding-right: 30px; padding-left: 30px; }
.right-pd-no { padding-right: 0; }
.right-pd-sm { padding-right: 8px; }
.right-pd-md { padding-right: 15px; }
.right-pd-lg { padding-right: 30px; }
.left-pd-no { padding-left: 0; }
.left-pd-sm { padding-left: 8px; }
.left-pd-md { padding-left: 15px; }
.left-pd-lg { padding-left: 30px; }

.ud-mg-sm { margin-top: 8px; margin-bottom: 8px; }
.ud-mg-md { margin-top: 15px; margin-bottom: 15px; }
.ud-mg-lg { margin-top: 30px; margin-bottom: 30px; }
.rl-mg-sm { margin-right: 8px; margin-left: 8px; }
.rl-mg-md { margin-right: 15px; margin-left: 15px; }
.rl-mg-lg { margin-right: 30px; margin-left: 30px; }
.right-mg-sm { margin-right: 8px; }
.right-mg-md { margin-right: 15px; }
.right-mg-lg { margin-right: 30px; }
.left-mg-sm { margin-left: 8px; }
.left-mg-md { margin-left: 15px; }
.left-mg-lg { margin-left: 30px; }

.float-right { float: right; }
.float-left { float: left; }
.center { text-align: center; }
.weight-heavy { font-weight: 600; }
.align-bottom { vertical-align: text-bottom; }
.inline-h3 { margin-top: 20px; margin-bottom: 10px; }

.px10 { font-size: 10px; }
.px12 { font-size: 12px; }
.px14 { font-size: 14px; }
.px16 { font-size: 16px; }
.px20 { font-size: 20px; }
.glyphicon-lg { font-size: 15px; }
.glyphicon-sm { font-size: 12px; }

.avatar-sm, .avatar-md, .avatar-lg, .avatar-sp { object-fit: cover; }
.avatar-zoom-label { display: block; margin-top: 15px; }
#avatar-crop-canvas { display: block; width: min(360px, 100%); height: auto; margin: 0 auto; background: #eee; cursor: grab; touch-action: none; }
#avatar-crop-canvas:active { cursor: grabbing; }
#avatar-zoom { width: min(360px, 100%); margin: 8px auto; }
.avatar-sm { width: 32px; height: 32px; }
.avatar-md { width: 48px; height: 48px; }
.avatar-lg { width: 96px; height: 96px; }
.avatar-sp { width: 120px; height: 120px; }
.rect-lg { width: 300px; height: 225px; }

.circle { border-radius: 100%; }
.radius4 { border-radius: 4px; }
.radius8 { border-radius: var(--r-btn); }
.radius0 { border-radius: 0; }

.blue { color: var(--c-primary); }
.grey { color: var(--c-muted); }
.dark-grey { color: #4A5468; }
.shadow { box-shadow: var(--shadow-card); }
.text-muted { color: var(--c-muted); }

a.nounderline, a.nounderline:hover, a.nounderline:active { text-decoration: none; }

/* 提示块（历史结构） */
.tips {
    margin: 20px 0;
    padding: 15px;
    border: 1px solid var(--c-border);
    border-radius: var(--r-card);
    font-size: 15px;
    color: var(--c-muted);
    background: var(--c-bg);
}
.status-message { font-size: 17px; margin-bottom: 50px; }
.no-border td { border: none !important; }
.min-margin-table { margin-bottom: 0 !important; }
.larger-text { font-size: 1.2em !important; }

/* 星级评分（第三方 star-rating） */
.rate-part .btn { box-shadow: none; }
.rating-stars { color: var(--c-primary) !important; }
.star-rating { float: left; line-height: 1em; }
.clearfix { clear: both; }
.star-rating .caption .blue { font-size: 14px; }

/* 点评正文折叠 */
.showmore-text { overflow: hidden; }
.showmore-wrapper { display: none; position: relative; top: -100px; bottom: 0; }
.showmore-shadow {
    position: absolute;
    text-align: center;
    box-sizing: border-box;
    width: 100%;
    height: 100px;
    background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
    cursor: pointer;
}
.showmore-btn-wrapper { box-sizing: border-box; position: relative; bottom: -80px; display: inline-flex; }
.showmore-btn { color: var(--c-primary); background: transparent; border: none; }

.review-header { display: flex; flex-wrap: wrap; align-items: center; }
.review-header > button, .review-header > select { margin: 8px 0; }
.review img { max-width: 100%; object-fit: contain; }

/* 半星 */
.glyphicon-star-half { position: relative; }
.glyphicon-star-half:before { content: "\e006"; width: 47%; display: block; overflow: hidden; }
.glyphicon-star-half:after { content: "\e007"; position: absolute; top: 0; left: 0; }

/* 消息下拉 */
#notice-link { color: var(--c-muted); }
#notice-link:focus, #notice-link:hover { text-decoration: underline; }
#dropdown-notice .dropdown-menu { width: 400px; }
#dropdown-notice .notice { padding: 0 20px; }
.notice-number-box { background-color: var(--c-danger); }

/* 回到顶部 */
#gotop {
    display: block;
    width: 36px;
    height: 36px;
    position: fixed;
    bottom: 75px;
    right: 30px;
    border-radius: var(--r-btn);
    text-decoration: none;
    display: none;
    background-color: var(--c-primary);
}
#gotop span { display: block; font-size: 24px; text-align: center; color: #fff; }
#gotop span:hover { color: #fff; }

/* 多级下拉（培养方案） */
.dropdown-submenu { position: relative; }
.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    border-radius: 0 var(--r-tag) var(--r-tag) var(--r-tag);
}
.dropdown-submenu:hover > .dropdown-menu { display: block; }
.dropdown-submenu > a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}
.dropdown-submenu:hover > a:after { border-left-color: #fff; }
.dropdown-submenu.pull-left { float: none; }
.dropdown-submenu.pull-left > .dropdown-menu {
    left: -100%;
    margin-left: 10px;
    border-radius: var(--r-tag) 0 var(--r-tag) var(--r-tag);
}

/* 富文本正文 */
.review-content h1 { font-size: 140%; }
.review-content h2 { font-size: 130%; }
.review-content h3, .review-content h4, .review-content h5 { font-size: 120%; }
.review-content li { line-height: 25px; margin-bottom: 5px; word-wrap: break-word; }

/* 折叠（课程详情长点评） */
.folded { max-height: 100vh; overflow: hidden; }
.display-folded .review-content { max-height: unset; }
.read-more {
    position: relative;
    margin: 10px 0;
    border: 0;
    color: var(--c-primary);
    width: 100%;
    background: unset;
}
.read-more::before {
    content: "";
    position: absolute;
    display: block;
    top: -200px;
    width: 100%;
    height: 200px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5));
}
.read-more::after, .display-folded .fold-button::after {
    content: "\e114";
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    position: relative;
    top: 2px;
    left: 2px;
}
.display-folded .read-more { display: none !important; }
.fold-button { display: none; }
.display-folded .fold-button {
    display: inline !important;
    background: unset;
    border: 0;
    color: var(--c-primary);
}
.display-folded .fold-button::after { content: "\e113"; }
.display-folded .bm-pd-md.grey {
    position: sticky;
    width: 100%;
    bottom: 0;
    padding-top: 1em;
    padding-right: 2em;
    background-color: #fff;
}

/* 统计页图表容器（ECharts 替代 Highcharts 后的通用盒子） */
.chart-box { width: 100%; height: 320px; margin: 1em auto; }
.chart-box.chart-sm { height: 240px; }

/* --------------------------------------------------------------------------
   18. 移动端选项卡（mobile-navbar.html）
   -------------------------------------------------------------------------- */

.nav-tabs.mobile { border-bottom: 1px solid var(--c-border); }
.nav-tabs.mobile > li > a {
    border-radius: var(--r-tag) var(--r-tag) 0 0;
    color: var(--c-muted);
    border-color: transparent;
}
.nav-tabs.mobile > li.active > a,
.nav-tabs.mobile > li.active > a:hover {
    color: var(--c-primary);
    border-color: var(--c-border) var(--c-border) transparent;
    font-weight: 600;
}