/*
 * “陈兄 / AI 是什么鬼”个人品牌主题层。
 * 基础布局仍由 style.css 管理，Apple 组件质感由 theme-apple-pro.css 管理；
 * 本文件仅覆盖个人品牌识别、资源页层级和状态视觉，便于独立调整或回退。
 */
:root {
    --preview-paper: #fdfdfc;
    --preview-ink: #171716;
    --preview-blue: #1473e6;
    --preview-orange: #d96f22;
}

body {
    color: var(--preview-ink);
    background: var(--preview-paper);
}

body::before {
    background:
        radial-gradient(circle at 86% 3%, rgba(64,110,182,.045), transparent 24%),
        linear-gradient(180deg, #fff 0%, #fafafa 58%, #fff 100%);
}

body.page-home::before {
    background:
        radial-gradient(circle at 84% 4%, rgba(42,124,245,.075), transparent 25%),
        radial-gradient(circle at 8% 42%, rgba(222,120,51,.045), transparent 20%),
        linear-gradient(180deg, #fff 0%, #fafaf8 62%, #fff 100%);
}

body.page-blog::before {
    background:
        radial-gradient(circle at 87% 4%, rgba(94,92,230,.07), transparent 26%),
        radial-gradient(circle at 7% 38%, rgba(20,115,230,.04), transparent 21%),
        linear-gradient(180deg, #fff 0%, #fbfbfd 60%, #fff 100%);
}

body.page-resources::before,
body.page-resource::before {
    background:
        radial-gradient(circle at 9% 8%, rgba(222,120,51,.06), transparent 23%),
        radial-gradient(circle at 88% 32%, rgba(20,115,230,.045), transparent 24%),
        linear-gradient(180deg, #fff 0%, #fdfcf9 60%, #fff 100%);
}

body.page-arctable::before {
    background:
        radial-gradient(circle at 86% 5%, rgba(20,115,230,.075), transparent 26%),
        radial-gradient(circle at 8% 44%, rgba(65,155,230,.035), transparent 22%),
        linear-gradient(180deg, #fff 0%, #fafcff 60%, #fff 100%);
}

body.page-about::before,
body.page-contact::before {
    background:
        radial-gradient(circle at 86% 5%, rgba(222,120,51,.065), transparent 25%),
        radial-gradient(circle at 8% 38%, rgba(24,24,23,.025), transparent 21%),
        linear-gradient(180deg, #fff 0%, #fdfbf8 60%, #fff 100%);
}

.site-header {
    border-bottom: 1px solid rgba(24,24,23,.09);
    background: rgba(255,255,255,.9);
    box-shadow: 0 10px 30px rgba(42,37,29,.045);
}
.brand-mark {
    width: 45px;
    height: 45px;
    border-color: rgba(24,24,23,.14);
    border-radius: 50%;
    box-shadow: 0 5px 15px rgba(27,24,20,.09);
}
.brand-copy strong { font-weight: 850; }
.primary-nav a { color: #55534e; }
.primary-nav a.active,
.primary-nav a:hover { color: #111; }
.primary-nav a::after { background: #181817; }
.site-search,
.mobile-menu-toggle,
.mobile-search-toggle { background: rgba(255,255,255,.72); }
.social-link { color: #85827a; }

/* 首页动态条独立承接在横幅下方，避免旧版负边距造成视觉断层。 */
.page-home .tool-update-row {
    z-index: 1;
    margin: 12px 0 0;
    border: 1px solid rgba(24,24,23,.1);
    border-radius: 15px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 12px 30px rgba(34,43,58,.065), inset 0 1px 0 #fff;
    backdrop-filter: saturate(140%) blur(16px);
}
.page-home .tool-update-track > a { color: #5d6470; }

/* 首页内容卡片：按栏目固定浅色背景，顶部色线只在交互时出现。 */
.page-home .content-list-card {
    --card-accent: #75669b;
    --card-bg: #f0edf6;
    position: relative;
    overflow: hidden;
    border-color: color-mix(in srgb, var(--card-accent) 18%, #ddd);
    background: linear-gradient(145deg, var(--card-bg) 0%, var(--card-bg) 62%, #fff 135%);
}
.page-home .content-list-card[data-content-filter="arctable"] {
    --card-accent: #557da7;
    --card-bg: #eaf1f8;
}
.page-home .content-list-card[data-content-filter="resource"] {
    --card-accent: #9a7650;
    --card-bg: #f5f0e8;
}
.page-home .content-list-card::before {
    position: absolute;
    top: 0;
    right: 28px;
    left: 28px;
    height: 3px;
    border-radius: 0 0 8px 8px;
    background: var(--card-accent);
    content: '';
    opacity: 0;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .24s ease, opacity .18s ease;
}
.page-home .content-list-card:hover::before,
.page-home .content-list-card:focus-visible::before { opacity: .82; transform: scaleX(1); }
.page-home .content-list-card:hover {
    border-color: color-mix(in srgb, var(--card-accent) 30%, #ddd);
}
.page-home .content-list-card:hover h2 { color: var(--card-accent); }
.page-home .content-list-card__arrow {
    color: var(--card-accent);
    background: color-mix(in srgb, var(--card-accent) 10%, white);
}
.page-home .content-list-card .content-type {
    color: var(--card-accent);
    background: color-mix(in srgb, var(--card-accent) 10%, white);
}
.page-home .content-list-card[data-content-filter="arctable"] .content-type--resource {
    color: #4b739d;
    background: #dfeaf4;
}

.resource-intro {
    position: relative;
    isolation: isolate;
    min-height: 360px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 30px;
    background:
        radial-gradient(circle at 82% 4%, rgba(42,124,245,.32), transparent 25%),
        radial-gradient(circle at 8% 100%, rgba(222,120,51,.18), transparent 28%),
        linear-gradient(135deg, #171716 0%, #232321 58%, #151515 100%);
    box-shadow: 0 32px 75px rgba(28,26,21,.2);
}
.resource-intro::after {
    position: absolute;
    z-index: -1;
    width: 330px;
    height: 330px;
    left: 33%;
    bottom: -175px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 50%;
    background: url('../../assets/img/chenxiong-avatar.png') center/cover no-repeat;
    box-shadow: 0 0 90px rgba(255,255,255,.08);
    content: '';
    filter: grayscale(1);
    opacity: .065;
    transform: rotate(-8deg);
}
.resource-intro__copy { position: relative; z-index: 1; }
.resource-intro__label {
    color: #fff;
    border-color: rgba(255,255,255,.22);
    background: rgba(255,255,255,.09);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
}
.resource-intro h1 {
    max-width: 610px;
    color: #fff;
    font-size: clamp(2.25rem, 3.65vw, 3.25rem);
    font-weight: 900;
    letter-spacing: -.055em;
}
.resource-intro__copy > p { color: rgba(255,255,255,.64); }
.resource-intro__points li {
    color: rgba(255,255,255,.82);
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.07);
}
.resource-intro__guide-box {
    border-color: rgba(255,255,255,.72);
    border-radius: 23px;
    background: rgba(249,248,244,.94);
    box-shadow: 0 24px 70px rgba(0,0,0,.26), inset 0 1px 0 #fff;
}
.resource-intro__guide-head { border-bottom-color: rgba(24,24,23,.12); }
.resource-intro__guide-head strong { color: #181817; }
.resource-intro__guide-head span { color: var(--preview-blue); letter-spacing: .08em; }
.resource-intro__guide-list > div { border-bottom-color: rgba(24,24,23,.085); }
.resource-intro__guide-list > div > span {
    color: #fff;
    border-radius: 50%;
    background: #1d1d1c;
}
.resource-intro__guide-list strong { color: #252421; }
.resource-intro__guide-list p { color: #77736b; }

.resource-toolbar {
    margin-top: 22px;
    border: 1px solid rgba(24,24,23,.09);
    border-radius: 18px;
    background: rgba(250,249,246,.78);
    box-shadow: 0 16px 36px rgba(44,39,31,.06), inset 0 1px 0 #fff;
}
.filter-chip { color: #706d66; border-radius: 999px; }
.filter-chip:hover,
.filter-chip.active {
    color: #fff;
    background: #1c1c1b;
    box-shadow: 0 7px 16px rgba(24,24,23,.16);
}

.content-section--first { padding-top: 48px; }
.section-heading h2 { color: #1a1917; font-weight: 900; letter-spacing: -.045em; }
.section-heading > p {
    max-width: 410px;
    color: #77736c;
    line-height: 1.75;
}
.eyebrow { color: #8e8980; }

.resource-grid--catalog { gap: 24px; }
.resource-card {
    --resource-accent: #9a7650;
    --resource-bg: #f5f0e8;
    min-height: 326px;
    padding: 26px;
    border: 1px solid color-mix(in srgb, var(--resource-accent) 18%, #ddd);
    border-radius: 25px;
    background: linear-gradient(145deg, var(--resource-bg) 0%, var(--resource-bg) 62%, #fff 135%);
    box-shadow: 0 16px 44px rgba(44,39,31,.065), inset 0 1px 0 #fff;
}
.resource-card:hover {
    border-color: color-mix(in srgb, var(--resource-accent) 30%, #ddd);
    box-shadow: 0 24px 54px rgba(44,39,31,.12);
    transform: translateY(-5px);
}
.resource-card[data-category="software"] {
    --resource-accent: #557da7;
    --resource-bg: #eaf1f8;
    box-shadow: 0 20px 52px rgba(20,92,180,.11), inset 0 1px 0 #fff;
}
.resource-card[data-category="workflow"] { --resource-accent: #5f806f; --resource-bg: #ecf3ef; }
.resource-card[data-category="model"] { --resource-accent: #80688f; --resource-bg: #f3eef5; }
.resource-card::after {
    position: absolute;
    top: 0;
    right: 28px;
    left: 28px;
    height: 3px;
    border-radius: 0 0 8px 8px;
    background: var(--resource-accent);
    content: '';
    opacity: 0;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .24s ease, opacity .18s ease;
}
.resource-card:hover::after,
.resource-card:focus-within::after { opacity: 1; transform: scaleX(1); }
.resource-card .eyebrow {
    display: inline-flex;
    padding: 4px 8px;
    color: var(--resource-accent);
    border-radius: 8px;
    background: color-mix(in srgb, var(--resource-accent) 10%, white);
}
.resource-card__updated {
    color: #69655e;
    letter-spacing: .015em;
}
.resource-card h3 { margin-top: 26px; color: #1c1b19; font-weight: 850; letter-spacing: -.025em; }
.resource-card > p { color: #6d6962; line-height: 1.72; }
.resource-meta-row span {
    color: #77736d;
    border-color: rgba(24,24,23,.1);
    border-radius: 999px;
    background: rgba(255,255,255,.6);
}
.status-pill--active { color: #08704a; background: #e3f5ea; }
.status-pill--legacy { color: #6f685f; background: #eae6df; }
.resource-card .btn-secondary {
    color: #35332f;
    border-color: rgba(24,24,23,.13);
    background: rgba(255,255,255,.7);
    box-shadow: none;
}
.resource-card .btn-primary {
    background: linear-gradient(180deg, #2384f4, #1473e6);
    box-shadow: 0 10px 22px rgba(20,115,230,.2);
}
/* AI 实战：蓝紫科技感，但保留黑白内容结构。 */
.page-blog .practice-intro,
.page-about .practice-intro {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 360px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 30px;
    box-shadow: 0 32px 75px rgba(28,26,21,.2);
}
.page-blog .practice-intro {
    background:
        radial-gradient(circle at 86% 3%, rgba(84,82,230,.38), transparent 27%),
        radial-gradient(circle at 12% 100%, rgba(20,115,230,.2), transparent 31%),
        linear-gradient(135deg, #151516 0%, #1d2030 58%, #111113 100%);
}
.page-blog .practice-intro::after,
.page-about .practice-intro::after {
    position: absolute;
    z-index: -1;
    width: 320px;
    height: 320px;
    left: 34%;
    bottom: -175px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    background: url('../../assets/img/chenxiong-avatar.png') center/cover no-repeat;
    content: '';
    filter: grayscale(1);
    opacity: .055;
    transform: rotate(-8deg);
}
.page-blog .practice-label,
.page-about .practice-label {
    color: #fff;
    border-color: rgba(255,255,255,.22);
    background: rgba(255,255,255,.09);
}
.page-blog .practice-intro h1,
.page-about .practice-intro h1 {
    color: #fff;
    font-size: clamp(2.25rem, 3.65vw, 3.25rem);
    font-weight: 900;
    letter-spacing: -.055em;
}
.page-blog .practice-intro__copy > p,
.page-about .practice-intro__copy > p { color: rgba(255,255,255,.64); }
.page-blog .practice-points li,
.page-about .practice-points li {
    color: rgba(255,255,255,.82);
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.07);
}
.page-blog .practice-guide__box,
.page-about .practice-guide__box {
    border-color: rgba(255,255,255,.72);
    border-radius: 23px;
    background: rgba(249,248,244,.95);
    box-shadow: 0 24px 70px rgba(0,0,0,.26), inset 0 1px 0 #fff;
}
.page-blog .practice-guide__head,
.page-about .practice-guide__head { border-bottom-color: rgba(24,24,23,.12); }
.page-blog .practice-guide__head strong,
.page-about .practice-guide__head strong { color: #181817; }
.page-blog .practice-guide__head span { color: #5653df; letter-spacing: .08em; }
.page-blog .practice-guide__list li,
.page-about .practice-guide__list li { border-bottom-color: rgba(24,24,23,.085); }
.page-blog .practice-guide__number {
    color: #fff;
    background: linear-gradient(145deg, #1473e6, #5e5ce6);
    box-shadow: 0 8px 18px rgba(63,82,213,.22);
}
.page-blog .practice-guide__list strong,
.page-about .practice-guide__list strong { color: #252421; }
.page-blog .practice-guide__list p,
.page-about .practice-guide__list p { color: #77736b; }
.page-blog .blog-list-heading h2 { color: #1a1917; font-weight: 900; letter-spacing: -.045em; }
.page-blog .blog-card {
    position: relative;
    overflow: hidden;
    border-color: rgba(117,102,155,.2);
    border-radius: 23px;
    background: linear-gradient(145deg, #f0edf6 0%, #f0edf6 62%, #fff 135%);
    box-shadow: 0 15px 40px rgba(44,39,31,.055), inset 0 1px 0 #fff;
}
.page-blog .blog-card::before {
    position: absolute;
    top: 0;
    right: 30px;
    left: 30px;
    height: 3px;
    border-radius: 0 0 8px 8px;
    background: #75669b;
    content: '';
    opacity: 0;
    transform: scaleX(0);
    transition: transform .24s ease, opacity .18s ease;
}
.page-blog .blog-card:hover::before,
.page-blog .blog-card:focus-visible::before { opacity: 1; transform: scaleX(1); }
.page-blog .blog-card:hover {
    border-color: rgba(117,102,155,.34);
    box-shadow: 0 23px 52px rgba(44,39,31,.11);
    transform: translateY(-4px);
}
.page-blog .blog-card__meta { color: #89847c; }
.page-blog .blog-card__body h2 { color: #1d1c1a; font-weight: 850; letter-spacing: -.025em; }
.page-blog .blog-card:hover .blog-card__body h2 { color: #685889; }
.page-blog .blog-card__body p { color: #706c65; line-height: 1.7; }
.page-blog .blog-card__arrow { color: #75669b; }

/* 关于陈兄：黑白主体配少量暖橙，强调人物与长期记录。 */
.page-about .practice-intro {
    background:
        radial-gradient(circle at 87% 5%, rgba(230,129,50,.31), transparent 27%),
        radial-gradient(circle at 8% 100%, rgba(255,255,255,.08), transparent 29%),
        linear-gradient(135deg, #181715 0%, #27231e 60%, #141413 100%);
}
.page-about .practice-guide__head span { color: #c86726; letter-spacing: .08em; }
.page-about .practice-guide__number {
    color: #fff;
    background: #1d1d1c;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 7px 16px rgba(0,0,0,.14);
}
.page-about .about-section-heading h2 { color: #1a1917; font-weight: 900; letter-spacing: -.04em; }
.page-about .about-value-grid { gap: 22px; }
.page-about .about-value-card {
    --about-accent: #557da7;
    --about-bg: #eaf1f8;
    position: relative;
    overflow: hidden;
    min-height: 265px;
    border-color: color-mix(in srgb, var(--about-accent) 18%, #ddd);
    border-radius: 24px;
    background: linear-gradient(145deg, var(--about-bg) 0%, var(--about-bg) 62%, #fff 135%);
    box-shadow: 0 16px 44px rgba(44,39,31,.06), inset 0 1px 0 #fff;
}
.page-about .about-value-card:nth-child(1) { --about-accent: #75669b; --about-bg: #f0edf6; }
.page-about .about-value-card:nth-child(2) { --about-accent: #9a7650; --about-bg: #f5f0e8; }
.page-about .about-value-card:nth-child(3) { --about-accent: #557da7; --about-bg: #eaf1f8; }
.page-about .about-value-card::before {
    position: absolute;
    top: 0;
    right: 28px;
    left: 28px;
    height: 3px;
    border-radius: 0 0 8px 8px;
    background: var(--about-accent);
    content: '';
    opacity: 0;
    transform: scaleX(0);
    transition: transform .24s ease, opacity .18s ease;
}
.page-about .about-value-card:hover::before,
.page-about .about-value-card:focus-visible::before { opacity: 1; transform: scaleX(1); }
.page-about .about-value-card:hover {
    border-color: color-mix(in srgb, var(--about-accent) 28%, transparent);
    box-shadow: 0 24px 54px rgba(44,39,31,.11);
    transform: translateY(-4px);
}
.page-about .about-value-card h2 { color: #1d1c1a; font-weight: 850; letter-spacing: -.025em; }
.page-about .about-value-card p { color: #706c65; }
.page-about .about-value-card .icon-box {
    color: var(--about-accent);
    background: color-mix(in srgb, var(--about-accent) 11%, white);
}
.page-about .about-value-card__arrow {
    color: var(--about-accent);
    border-radius: 50%;
    background: color-mix(in srgb, var(--about-accent) 10%, white);
}
.page-about .about-story {
    padding: 38px;
    border-color: rgba(24,24,23,.085);
    border-radius: 26px;
    background:
        radial-gradient(circle at 5% 100%, rgba(217,111,34,.08), transparent 28%),
        rgba(251,250,247,.9);
    box-shadow: 0 18px 48px rgba(44,39,31,.065), inset 0 1px 0 #fff;
}
.page-about .about-story__copy h2 { color: #1d1c1a; font-weight: 850; letter-spacing: -.025em; }
.page-about .about-story__copy > p { color: #68645e; }
.page-about .about-name-note {
    border-color: rgba(217,111,34,.18);
    background: rgba(255,247,237,.78);
}
.page-about .about-principles {
    color: #fff;
    border-color: rgba(255,255,255,.09);
    border-radius: 20px;
    background: linear-gradient(145deg, #22211f, #161615);
    box-shadow: 0 22px 50px rgba(26,23,19,.2);
}
.page-about .about-principles .eyebrow { color: #e58a48; }
.page-about .about-principles h3 { color: #fff; }
.page-about .principle-list li { color: rgba(255,255,255,.72); }
.page-about .principle-list svg { color: #f09a58; }
.page-about .about-contact-cta {
    color: #fff;
    border-color: rgba(255,255,255,.08);
    border-radius: 20px;
    background: #1b1b1a;
    box-shadow: 0 18px 42px rgba(29,26,22,.16);
}
.page-about .about-contact-cta:hover {
    border-color: rgba(235,143,73,.46);
    box-shadow: 0 24px 54px rgba(29,26,22,.23);
    transform: translateY(-3px);
}
.page-about .about-contact-cta span { color: #f09a58; }

/* 联系方式按渠道固定配色，保持和分类卡片一致的识别方式。 */
.page-contact .contact-channel-card--official {
    border-color: rgba(154,118,80,.22);
    background: linear-gradient(145deg, #f5f0e8 0%, #f5f0e8 62%, #fff 135%);
}
.page-contact .contact-channel-card--wechat {
    border-color: rgba(85,125,167,.22);
    background: linear-gradient(145deg, #eaf1f8 0%, #eaf1f8 62%, #fff 135%);
}

.site-footer { background: #1a1a19; }

@media (max-width: 760px) {
    .brand-mark { width: 42px; height: 42px; }
    .resource-intro {
        margin-top: 16px;
        border-radius: 25px;
    }
    .resource-intro::after {
        width: 230px;
        height: 230px;
        left: 43%;
        bottom: -125px;
    }
    .resource-intro__copy { padding: 31px 23px 21px; }
    .resource-intro h1 { font-size: 2rem; }
    .resource-intro__copy > p { color: rgba(255,255,255,.65); }
    .resource-intro__guide { padding: 0 14px 14px; }
    .resource-intro__guide-box { border-radius: 19px; }
    .resource-toolbar { border-radius: 16px; }
    .content-section--first { padding-top: 38px; }
    .section-heading > p { max-width: none; }
    .resource-grid--catalog { gap: 18px; }
    .resource-card { min-height: 300px; padding: 23px; border-radius: 22px; }
    .resource-card__actions { gap: 8px; }
    .resource-card__actions .btn { padding-right: 11px; padding-left: 11px; }
    .page-blog .practice-intro,
    .page-about .practice-intro { min-height: 0; margin-top: 16px; border-radius: 25px; }
    .page-blog .practice-intro::after,
    .page-about .practice-intro::after { width: 230px; height: 230px; left: 43%; bottom: -125px; }
    .page-blog .practice-intro__copy,
    .page-about .practice-intro__copy { padding: 31px 23px 21px; }
    .page-blog .practice-intro h1,
    .page-about .practice-intro h1 { font-size: 2rem; }
    .page-blog .practice-guide,
    .page-about .practice-guide { padding: 0 14px 14px; }
    .page-blog .practice-guide__box,
    .page-about .practice-guide__box { border-radius: 19px; }
    .page-blog .blog-card { border-radius: 21px; }
    .page-about .about-value-grid { gap: 18px; }
    .page-about .about-value-card { min-height: 0; border-radius: 22px; }
    .page-about .about-story { padding: 25px; border-radius: 23px; }
    .page-about .about-principles { border-radius: 18px; }
    .page-about .about-contact-cta { border-radius: 18px; }
}