/* 2026 消费端改造：汽车资讯杂志 × 可信数据工具。公共组件统一使用 cjl- 前缀。 */
:root {
    --cjl-paper: var(--paper, #faf8f4);
    --cjl-surface: var(--card, #fff);
    --cjl-ink: var(--ink, #1e1c18);
    --cjl-muted: var(--ink3, #6a6659);
    --cjl-line: var(--line, #e9e4d8);
    --cjl-gold: var(--gold, #d9a514);
    --cjl-gold-text: var(--gold-text, #856a00);
    --cjl-charcoal: #25231f;
    --cjl-green: #2e6b4f;
    --cjl-red: #a94a32;
    --cjl-radius: 16px;
}
[data-theme="dark"] {
    --cjl-charcoal: #11100e;
    --cjl-green: #69b18c;
    --cjl-red: #e07860;
}

.cjl-page .content { padding-top: 28px; }
.cjl-page-wrap { width: min(1120px, 100%); margin: 0 auto; }
.cjl-page-head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:end; margin-bottom:24px; padding:28px 0 22px; border-bottom:1px solid var(--cjl-line); }
.cjl-eyebrow { display:block; margin-bottom:9px; color:var(--cjl-gold-text); font-size:12px; font-weight:800; letter-spacing:.18em; }
.cjl-page-head h1 { margin:0; font:900 clamp(36px,6vw,72px)/.96 var(--serif, serif); letter-spacing:-.055em; color:var(--cjl-ink); }
.cjl-page-head p { max-width:690px; margin:16px 0 0; color:var(--cjl-muted); font-size:15px; line-height:1.8; }
.cjl-page-stat { min-width:132px; padding:16px 18px; border-left:4px solid var(--cjl-gold); background:var(--cjl-charcoal); color:#f8f2e6; }
.cjl-page-stat b { display:block; font:900 34px/1 var(--serif, serif); }
.cjl-page-stat span { display:block; margin-top:7px; font-size:12px; color:#c9c1b4; }

.cjl-tabs { display:flex; gap:6px; overflow-x:auto; padding:0 0 14px; scrollbar-width:thin; }
.cjl-tabs a { flex:0 0 auto; padding:9px 14px; border:1px solid transparent; border-radius:999px; color:var(--cjl-muted); text-decoration:none; font-size:13px; }
.cjl-tabs a:hover { border-color:var(--cjl-line); color:var(--cjl-ink); }
.cjl-tabs a.is-active { background:var(--cjl-charcoal); color:#f4c94e; font-weight:700; }

.cjl-filter-panel { display:grid; grid-template-columns:repeat(5,minmax(118px,1fr)) auto auto; gap:10px; align-items:end; margin:0 0 20px; padding:16px; border:1px solid var(--cjl-line); border-radius:var(--cjl-radius); background:color-mix(in srgb,var(--cjl-surface) 88%,transparent); }
.cjl-filter-panel label { display:grid; gap:6px; color:var(--cjl-muted); font-size:12px; font-weight:700; letter-spacing:.04em; }
.cjl-filter-panel select { width:100%; min-height:42px; padding:0 34px 0 11px; border:1px solid var(--cjl-line); border-radius:10px; color:var(--cjl-ink); background:var(--cjl-surface); font:inherit; font-size:13px; }
.cjl-filter-panel select:focus-visible,.cjl-btn:focus-visible,.cjl-news-card a:focus-visible { outline:3px solid color-mix(in srgb,var(--cjl-gold) 34%,transparent); outline-offset:2px; }

.cjl-btn { min-height:42px; display:inline-flex; align-items:center; justify-content:center; padding:0 16px; border:1px solid transparent; border-radius:10px; font:700 13px/1 var(--sans, sans-serif); text-decoration:none; cursor:pointer; }
.cjl-btn--primary { background:var(--cjl-gold); color:#1e1c18; }
.cjl-btn--secondary { border-color:var(--cjl-line); background:var(--cjl-surface); color:var(--cjl-ink); }
.cjl-btn--text { color:var(--cjl-muted); }

.cjl-notice { margin:0 0 22px; padding:12px 15px; border-radius:10px; font-size:13px; line-height:1.65; }
.cjl-notice b { margin-right:8px; }
.cjl-notice--degraded { border:1px solid color-mix(in srgb,var(--cjl-gold) 40%,var(--cjl-line)); background:var(--gold-wash,rgba(217,165,20,.08)); color:var(--cjl-ink); }

.cjl-news-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; overflow:hidden; border:1px solid var(--cjl-line); background:var(--cjl-line); }
.cjl-news-card { min-width:0; display:grid; grid-template-columns:164px minmax(0,1fr); background:var(--cjl-surface); transition:transform .2s ease, background .2s ease; }
.cjl-news-card:hover { position:relative; z-index:1; background:color-mix(in srgb,var(--cjl-surface) 92%,var(--cjl-gold)); }
.cjl-news-card--text { grid-template-columns:1fr; }
.cjl-news-card__media { min-height:220px; overflow:hidden; background:var(--paper-2,#f5f2ea); }
.cjl-news-card__media img { width:100%; height:100%; object-fit:cover; filter:saturate(.88); transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.cjl-news-card:hover .cjl-news-card__media img { transform:scale(1.04); }
.cjl-news-card__body { min-width:0; display:flex; flex-direction:column; padding:20px; }
.cjl-news-card__topline { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; }
.cjl-kicker { color:var(--cjl-gold-text); font-size:12px; font-weight:800; letter-spacing:.1em; }
.cjl-status { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; white-space:nowrap; }
.cjl-status::before { content:''; width:7px; height:7px; border-radius:50%; background:currentColor; }
.cjl-status--verified { color:var(--cjl-green); }
.cjl-status--pending { color:var(--cjl-gold-text); }
.cjl-status--insufficient { color:var(--cjl-red); }
.cjl-news-card h2 { margin:0; font:700 20px/1.36 var(--serif, serif); letter-spacing:-.025em; }
.cjl-news-card h2 a { color:var(--cjl-ink); text-decoration:none; }
.cjl-news-card p { margin:12px 0; color:var(--cjl-muted); font-size:13px; line-height:1.7; }
.cjl-reason { margin:0 0 10px; padding:8px 10px; border-left:2px solid var(--cjl-gold); color:var(--cjl-ink); background:var(--gold-wash,rgba(217,165,20,.08)); font-size:12px; }
.cjl-news-card__meta { display:flex; flex-wrap:wrap; gap:6px 12px; margin-top:auto; padding-top:12px; border-top:1px solid var(--cjl-line); color:var(--cjl-muted); font-size:12px; }
.cjl-scoreline { display:flex; flex-wrap:wrap; gap:7px 12px; align-items:center; margin-top:9px; color:var(--cjl-muted); font-size:12px; }
.cjl-scoreline b { color:var(--cjl-ink); font-variant-numeric:tabular-nums; }
.cjl-scoreline em { padding:3px 6px; border:1px solid var(--cjl-line); border-radius:999px; color:var(--cjl-gold-text); font-style:normal; }
.cjl-chip-row { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.cjl-chip-row a { padding:4px 7px; border-radius:5px; background:var(--paper-2,#f5f2ea); color:var(--cjl-muted); text-decoration:none; font-size:12px; }

.cjl-pagination { display:flex; justify-content:center; align-items:center; gap:14px; margin:24px 0; color:var(--cjl-muted); font-size:13px; }
.cjl-pagination a { padding:9px 14px; border:1px solid var(--cjl-line); border-radius:9px; color:var(--cjl-ink); text-decoration:none; background:var(--cjl-surface); }
.cjl-newsroom .cjl-empty { padding:70px 24px; border:1px dashed var(--cjl-line); text-align:center; background:var(--cjl-surface); }
.cjl-newsroom .cjl-empty>span { font:900 56px/1 var(--serif,serif); color:var(--cjl-gold); }
.cjl-newsroom .cjl-empty h2 { margin:14px 0 8px; font:700 24px/1.3 var(--serif,serif); }
.cjl-newsroom .cjl-empty p { max-width:620px; margin:0 auto 20px; color:var(--cjl-muted); line-height:1.7; }

.cjl-search-groups { display:grid; gap:20px; margin:22px 0 28px; }
.cjl-search-group { border-top:2px solid var(--cjl-charcoal); }
.cjl-search-group__head { display:flex; justify-content:space-between; align-items:center; padding:10px 0; }
.cjl-search-group__head h2 { margin:0; font:700 17px/1 var(--serif,serif); }
.cjl-search-group__head span { color:var(--cjl-muted); font-size:12px; }
.cjl-search-group__items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.cjl-search-hit { display:grid; gap:4px; padding:13px 15px; border:1px solid var(--cjl-line); border-radius:10px; color:var(--cjl-ink); background:var(--cjl-surface); text-decoration:none; }
.cjl-search-hit:hover { border-color:var(--cjl-gold); }
.cjl-search-hit small { color:var(--cjl-muted); line-height:1.5; }
.cmdk-group-label { padding:10px 12px 5px; color:var(--cjl-gold-text); font-size:12px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }

html.elder .cjl-news-card h2 { font-size:24px; }
html.elder .cjl-news-card p,html.elder .cjl-filter-panel select,html.elder .cjl-btn { font-size:16px; }

@media (max-width:1050px) {
    .cjl-filter-panel { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .cjl-news-grid { grid-template-columns:1fr; }
}
@media (max-width:640px) {
    .cjl-page .content { padding-top:8px; }
    .cjl-page-head { grid-template-columns:1fr; gap:16px; padding-top:18px; }
    .cjl-page-stat { display:flex; align-items:baseline; gap:8px; min-width:0; }
    .cjl-filter-panel { grid-template-columns:1fr 1fr; padding:12px; }
    .cjl-filter-panel .cjl-btn { width:100%; }
    .cjl-news-card { grid-template-columns:112px minmax(0,1fr); }
    .cjl-news-card__media { min-height:190px; }
    .cjl-news-card__body { padding:15px; }
    .cjl-news-card h2 { font-size:18px; }
    .cjl-news-card p { display:-webkit-box; overflow:hidden; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
    .cjl-search-group__items { grid-template-columns:1fr; }
}
@media (max-width:410px) {
    .cjl-filter-panel { grid-template-columns:1fr; }
    .cjl-news-card { grid-template-columns:1fr; }
    .cjl-news-card__media { min-height:178px; max-height:210px; }
}
@media (prefers-reduced-motion:reduce) {
    .cjl-news-card,.cjl-news-card__media img { transition:none; }
}

/* 首页第一屏：先说清网站用途，再按普通用户任务给出真实入口。 */
.page-home .cjl-home-intro { margin:0; border:1px solid var(--cjl-line); border-bottom:0; background:var(--cjl-surface); }
.page-home .cjl-home-intro__copy { container-type:inline-size; padding:clamp(24px,3vw,36px); background:var(--cjl-surface); }
.page-home .cjl-home-intro h1 { max-width:720px; margin:0; color:var(--cjl-ink); font:800 40px/1.25 var(--serif,serif); font-size:clamp(28px,7.8cqi,44px); letter-spacing:-.035em; }
.page-home .cjl-home-intro h1 em { display:block; color:var(--cjl-gold-text); font-style:normal; }
.page-home .cjl-home-intro__copy>p { max-width:720px; margin:16px 0 0; color:var(--cjl-muted); font-size:15px; line-height:1.8; }
.page-home .cjl-directory { margin:0 0 22px; padding:clamp(18px,2.4vw,28px); border:1px solid var(--cjl-line); background:var(--cjl-paper); }
.page-home .cjl-directory__head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:18px; }
.page-home .cjl-directory__head h2 { margin:3px 0 0; color:var(--cjl-ink); font:800 28px/1.15 var(--serif,serif); }
.page-home .cjl-directory__head p { max-width:420px; margin:0; color:var(--cjl-muted); font-size:12px; line-height:1.65; text-align:right; }
.page-home .cjl-directory__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--cjl-line); border-left:1px solid var(--cjl-line); }
.page-home .cjl-directory-group { min-width:0; padding:17px; border-right:1px solid var(--cjl-line); border-bottom:1px solid var(--cjl-line); background:var(--cjl-surface); }
.page-home .cjl-directory-group h3 { display:flex; align-items:center; gap:9px; margin:0 0 10px; color:var(--cjl-ink); font:800 16px/1.3 var(--serif,serif); }
.page-home .cjl-directory-group h3>i { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--gold-wash,#fbf1d1); color:var(--cjl-gold-text); font-size:12px; }
.page-home .cjl-directory-link { display:flex; min-width:0; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-top:1px solid var(--cjl-line); color:var(--cjl-ink); text-decoration:none; }
.page-home .cjl-directory-link span { min-width:0; }
.page-home .cjl-directory-link b,.page-home .cjl-directory-link small { display:block; }
.page-home .cjl-directory-link b { font-size:13px; line-height:1.35; }
.page-home .cjl-directory-link small { margin-top:3px; overflow-wrap:anywhere; color:var(--cjl-muted); font-size:12px; line-height:1.45; }
.page-home .cjl-directory-link>i { color:var(--cjl-gold-text); font-size:12px; transition:transform .18s ease; }
.page-home .cjl-directory-link:hover b,.page-home .cjl-directory-link:focus-visible b { color:var(--cjl-gold-text); }
.page-home .cjl-directory-link:hover>i { transform:translateX(3px); }
.page-home .cjl-directory-group details { border-top:1px solid var(--cjl-line); }
.page-home .cjl-directory-group summary { display:flex; align-items:center; justify-content:space-between; min-height:38px; color:var(--cjl-muted); font-size:12px; font-weight:800; cursor:pointer; list-style:none; }
.page-home .cjl-directory-group summary::-webkit-details-marker { display:none; }
.page-home .cjl-directory-group summary::before { content:'＋'; margin-right:6px; color:var(--cjl-gold-text); }
.page-home .cjl-directory-group details[open] summary::before { content:'－'; }
.page-home .cjl-directory-group summary span { margin-left:auto; font-weight:500; }
.page-home .cjl-directory-more { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding:2px 0 7px; }
.page-home .cjl-directory-more a { min-width:0; padding:8px; border-radius:6px; background:var(--paper-2,#f5f2ea); color:var(--cjl-ink); font-size:12px; line-height:1.35; text-decoration:none; overflow-wrap:anywhere; }
.page-home .cjl-directory-more a:hover,.page-home .cjl-directory-more a:focus-visible { outline:1px solid var(--cjl-gold); color:var(--cjl-gold-text); }
.page-home .cjl-directory__foot { display:flex; align-items:center; gap:8px; margin:14px 0 0; color:var(--cjl-muted); font-size:12px; line-height:1.55; }
.page-home .cjl-directory__foot i { color:var(--cjl-gold-text); }
.page-home .cjl-home-priority { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; margin-bottom:24px; }
.page-home .cjl-home-focus { display:flex; flex-direction:column; min-height:320px; padding:24px; background:var(--cjl-charcoal); color:#f5efe2; }
.page-home .cjl-home-focus__label { align-self:flex-start; padding:5px 8px; background:var(--cjl-gold); color:#1e1c18; font-size:12px; font-weight:900; letter-spacing:.12em; }
.page-home .cjl-home-focus>a { display:flex; flex:1; flex-direction:column; justify-content:center; color:inherit; text-decoration:none; }
.page-home .cjl-home-focus>a>span { color:#c7beae; font-size:12px; }
.page-home .cjl-home-focus h2 { margin:12px 0; color:#fffaf0; font:700 28px/1.35 var(--serif,serif); letter-spacing:-.025em; }
.page-home .cjl-home-focus p { margin:0; color:#c7beae; font-size:13px; line-height:1.75; }
.page-home .cjl-hero-score { display:block; margin-top:12px; color:#f4c94e; font-size:12px; font-weight:700; }
.page-home .cjl-home-focus__empty { display:grid; place-content:center; flex:1; gap:8px; text-align:center; }
.page-home .cjl-home-focus__empty span { color:#c7beae; font-size:12px; }
.page-home .cjl-home-focus__foot { display:flex; flex-wrap:wrap; gap:14px; padding-top:16px; border-top:1px solid #484238; }
.page-home .cjl-home-focus__foot a { color:#f4c94e; text-decoration:none; font-size:12px; }
.page-home .cjl-home-check { min-width:0; min-height:320px; margin:0; }
.page-home .cjl-home-check form { display:flex; height:100%; flex-direction:column; }
.page-home .cjl-home-check .lane-row { margin-top:auto; }
.page-home .cjl-forward { margin:0 0 24px; padding:22px; border:1px solid var(--cjl-line); background:var(--cjl-surface); }
.page-home .cjl-forward__head { display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:16px; }
.page-home .cjl-forward__head h2 { margin:0; font:800 28px/1.1 var(--serif,serif); }
.page-home .cjl-forward__head p { max-width:560px; margin:0; color:var(--cjl-muted); font-size:12px; line-height:1.65; }
.page-home .cjl-forward__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--cjl-line); }
.page-home .cjl-forward article { min-width:0; padding:16px; background:var(--cjl-paper); }
.page-home .cjl-forward time { color:var(--cjl-gold-text); font-size:12px; font-weight:800; }
.page-home .cjl-forward h3 { margin:10px 0 8px; font:700 17px/1.4 var(--serif,serif); }
.page-home .cjl-forward article p { margin:0 0 10px; color:var(--cjl-muted); font-size:12px; line-height:1.55; }
.page-home .cjl-forward article a { color:var(--cjl-ink); font-size:12px; font-weight:700; }
.cjl-rule-note,.cjl-rec-score { color:var(--cjl-muted); font-size:12px; line-height:1.5; }
.cjl-rule-note { margin:0 0 4px; }
.cjl-rec-score { margin-top:4px; }
html.elder .cjl-scoreline,html.elder .cjl-rule-note,html.elder .cjl-rec-score,html.elder .cjl-forward p,html.elder .cjl-forward a,html.elder .cjl-forward time,html.elder .cjl-directory-link b,html.elder .cjl-directory-group summary { font-size:16px; }
html.elder .cjl-directory-link small,html.elder .cjl-directory-more a,html.elder .cjl-directory__head p,html.elder .cjl-directory__foot { font-size:15px; }
@media (max-width:1050px) { .page-home .cjl-directory__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .page-home .cjl-forward__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:900px) { .page-home .cjl-home-priority { grid-template-columns:1fr; } .page-home .cjl-home-focus { min-height:280px; } .page-home .cjl-forward__head { display:block; } .page-home .cjl-forward__head p { margin-top:8px; } }
@media (max-width:600px) { .page-home .cjl-directory { padding:15px; } .page-home .cjl-directory__head { display:block; } .page-home .cjl-directory__head p { margin-top:7px; text-align:left; } .page-home .cjl-directory__grid { grid-template-columns:1fr; } }
@media (max-width:480px) { .page-home .cjl-home-intro__copy,.page-home .cjl-home-focus { padding:20px; } .page-home .cjl-home-intro h1 { font-size:clamp(28px,10.8vw,38px); } .page-home .cjl-directory-more { grid-template-columns:1fr; } .page-home .cjl-home-check { padding:16px; } .page-home .cjl-home-check .lane-row { flex-direction:column; } .page-home .cjl-home-check .lane-go { min-height:44px; } .page-home .cjl-forward { padding:16px; } .page-home .cjl-forward__grid { grid-template-columns:1fr; } }