/* ===== 升级建议 ===== */
.gl-upgrade-card { background: linear-gradient(135deg, #eef0ff 0%, #f5f3ff 100%); border: 1px dashed #6366f1; border-radius: 12px; padding: 18px 20px; display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: center; }
@media (max-width: 640px) { .gl-upgrade-card { grid-template-columns: 1fr; text-align: center; } }
.gl-upgrade-icon { width: 56px; height: 56px; background: linear-gradient(135deg, #0071c5 0%, #4a9fd4 100%); border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #fff; flex-shrink: 0; margin: 0 auto; }
.gl-upgrade-body h3 { font-size: 15px; font-weight: 600; color: #14171e; margin-bottom: 6px; }
.gl-upgrade-body p { font-size: 13px; color: #3a4256; line-height: 1.6; margin: 0; }
.gl-upgrade-body strong { color: #6366f1; font-weight: 600; }
/* 人工价标签 —— 与 hero 的 .price-tag.tag-manual 视觉保持一致 */
.gl-price-manual { display: inline-block; font-style: normal; font-size: 11px; color: #c2410c; background: #fff3e8; padding: 2px 6px; border-radius: 4px; margin-left: 4px; font-weight: 500; vertical-align: middle; }
.gl-upgrade-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 14px; }
@media (max-width: 640px) { .gl-upgrade-grid { grid-template-columns: repeat(2, 1fr); } }
.gl-upgrade-cell { border-radius: 8px; padding: 12px; text-align: center; }
.gl-upgrade-cell .k { font-size: 11px; color: #7c7a8a; margin-bottom: 4px; }
.gl-upgrade-cell .v { font-size: 13px; font-weight: 600; color: #10b981; }
.gl-upgrade-cell .v.neg { color: #8a8a99; }

/* ===== 历代同架构 GPU 时间线 ===== */
.gl-timeline-wrap { overflow-x: auto; border: 1px solid #e9e9ee; border-radius: 10px; background: #fff; padding: 4px; }
.gl-timeline { border-collapse: separate; border-spacing: 0; font-size: 12px; color: #3a4256; table-layout: auto; white-space: nowrap; width: 100%; }
.gl-timeline th,
.gl-timeline td { padding: 8px 10px; border-bottom: 1px solid #f1f1f4; border-right: 1px solid #f1f1f4; vertical-align: top; text-align: left; }
.gl-timeline thead th { position: sticky; top: 0; z-index: 3; background: #f1f1f4; font-weight: 600; color: #14171e; min-width: 140px; border-bottom: 2px solid #e9e9ee; }
.gl-timeline thead th.gl-corner { position: sticky; left: 0; z-index: 5; background: #ececec; min-width: 96px; width: 96px; font-size: 11px; }
.gl-timeline tbody td.gl-row-label { position: sticky; left: 0; z-index: 2; background: #f1f1f4; font-weight: 600; color: #14171e; border-right: 2px solid #e9e9ee; min-width: 96px; width: 96px; }
.gl-timeline thead th .gl-arch-name { display: block; font-size: 12px; font-weight: 600; margin-bottom: 2px; }
.gl-timeline thead th .gl-arch-meta { display: block; font-size: 10.5px; color: #7c7a8a; font-weight: normal; font-family: 'JetBrains Mono', monospace; }
.gl-timeline thead th .gl-arch-meta .gl-year { background: #eef0ff; color: #6366f1; border-radius: 3px; padding: 0 5px; margin-right: 4px; }
.gl-timeline th.gl-current,
.gl-timeline td.gl-current { background: #eef0ff !important; border-left: 2px solid #6366f1; border-right: 2px solid #6366f1; }
.gl-timeline thead th.gl-current .gl-arch-name { color: #6366f1; font-weight: 700; }
.gl-timeline thead th.gl-pre { background: #f4f4f5; color: #7c7a8a; }
.gl-timeline thead th.gl-pre .gl-arch-name { color: #7c7a8a; }
.gl-timeline tbody td.gl-pre-cell { background: #fafafa; }
.gl-timeline thead th.gl-suc { background: #ecfdf5; color: #166534; }
.gl-timeline thead th.gl-suc .gl-arch-name { color: #166534; }
.gl-timeline thead th.gl-suc .gl-arch-meta .gl-year { background: #d1fae5; color: #166534; }
.gl-timeline tbody td.gl-suc-cell { background: #f7fef9; }
.gl-cell-name { display: block; font-size: 12px; color: #0071c5; text-decoration: none; font-weight: 500; margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; max-width: 170px; }
.gl-cell-name:hover { text-decoration: underline; }
.gl-cell-score { display: block; font-size: 10.5px; color: #7c7a8a; font-family: 'JetBrains Mono', monospace; }
.gl-cell-score .v { color: #3a4256; font-weight: 600; }
.gl-cell-tag { display: inline-block; background: #f1f1f4; color: #7c7a8a; border-radius: 3px; padding: 0 4px; margin-left: 4px; font-family: 'JetBrains Mono', monospace; }
.gl-cell-more { display: block; margin-top: 3px; }
.gl-cell-more a { display: block; font-size: 11px; color: #7c7a8a; text-decoration: none; line-height: 1.5; }
.gl-cell-more a:hover { color: #0071c5; text-decoration: underline; }
.gl-cell-empty { color: #d4d4d8; font-size: 14px; text-align: center; padding: 4px 0; }
@media screen and (max-width: 768px) {
    .gl-timeline thead th { min-width: 120px; font-size: 11px; }
    .gl-timeline thead th.gl-corner,
    .gl-timeline tbody td.gl-row-label { min-width: 72px; width: 72px; }
    .gl-timeline { font-size: 11px; }
    .gl-cell-name { font-size: 11px; max-width: 120px; }
}