/* ============================================================
   CLIB FDE · 设计标准强制执行层 v1.0
   对标《网页设计系统标准 v1.2》—— Apple HIG 级
   加载顺序：所有CSS之后，最高优先级覆盖
   核心规则：令牌唯一 · 硬编码为0 · 克制精致有层级
   ============================================================ */

/* ---------- 1. 权威令牌覆盖（确保全站统一） ---------- */
:root{
  /* 品牌主色 Indigo */
  --indigo-50:#F4F6FF; --indigo-100:#EEF1FE; --indigo-200:#DDE3FB;
  --indigo-300:#9FB0FF; --indigo-400:#7E90F5; --indigo-500:#4F6BED; --indigo-600:#3B57D9; --indigo-700:#2F46B8;
  --indigo:var(--indigo-500); --primary:var(--indigo-500); --blue:var(--indigo-500);
  /* 高级点缀 Gold（仅导师/成就/稀缺，≤10%） */
  --gold-100:#FBF4E4; --gold-300:#F5D695; --gold-400:#D9A94E; --gold-600:#B8862F; --gold:var(--gold-400);
  /* 中性墨色 */
  --ink:#1A1A2E; --ink-2:#4A4A5C; --ink-3:#8A8FA3; --ink-4:#C3C8DA;
  /* 背景/表面 */
  --bg:#FAFAFB; --canvas:#FAFAFB; --card:#FFFFFF; --bg-soft:#F4F5F9; --bg-2:#F4F5F9;
  /* 描边 */
  --line:#ECECF1; --line-2:#F0F1F5; --border:#ECECF1;
  /* 深色（仅代码块，不用于导航） */
  --dark:#0B1020; --dark-2:#121830; --dark-line:#262E52;
  /* 语义色 */
  --success:#2C6E49; --success-bg:#F2F9F4; --success-line:#D5EEDD;
  --warning:#B7791F; --warning-bg:#FFFBEB; --warning-line:#F5E6C4;
  --error:#B0413E; --error-bg:#FDF6F6; --error-line:#F2D4D4; --danger:var(--error);
  --info:#4F6BED; --info-bg:#EEF1FE; --info-line:#DDE3FB;
  /* 字体 */
  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,'SF Pro Display','Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;
  --font-mono:'SF Mono',Consolas,Menlo,'Courier New',monospace;
  --font:var(--font-sans);
  /* 字号9档 */
  --fs-display:48px; --fs-title1:36px; --fs-title2:28px; --fs-title3:22px;
  --fs-headline:18px; --fs-body:16px; --fs-callout:14.5px; --fs-footnote:13px; --fs-caption:12px;
  --fs-h1:var(--fs-title2); --fs-h2:var(--fs-title3); --fs-title:var(--fs-headline);
  /* 行高 */
  --lh-tight:1.1; --lh-snug:1.25; --lh-normal:1.5; --lh-relaxed:1.65;
  /* 间距 4px基准 */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px;
  /* 圆角4档 */
  --r-sm:8px; --r-md:12px; --r-lg:14px; --r-xl:18px; --r-card:var(--r-xl); --r-capsule:999px;
  /* 阴影3级 */
  --sh-sm:0 1px 2px rgba(26,26,46,.04),0 2px 6px -2px rgba(26,26,46,.06);
  --sh-md:0 4px 12px -4px rgba(26,26,46,.08),0 14px 34px -14px rgba(26,26,46,.14);
  --sh-lg:0 12px 28px -10px rgba(26,26,46,.14),0 30px 66px -24px rgba(26,26,46,.24);
  --shadow:var(--sh-sm); --shadow-lg:var(--sh-lg);
  /* 动效 */
  --dur-fast:150ms; --dur-base:250ms; --dur-slow:400ms;
  --ease-standard:cubic-bezier(.4,0,.2,1); --ease-enter:cubic-bezier(0,0,.2,1); --ease-spring:cubic-bezier(.34,1.56,.64,1);
}

/* ---------- 2. 全局基础重置 ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--font-sans) !important;
  font-size:var(--fs-body) !important;
  line-height:var(--lh-relaxed) !important;
  color:var(--ink) !important;
  background:var(--bg) !important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5,h6{font-weight:700;line-height:var(--lh-snug);letter-spacing:-.02em;color:var(--ink);}
a{color:var(--indigo-500);text-decoration:none;}
a:hover{text-decoration:underline;}
::selection{background:var(--indigo-200);color:var(--ink);}
:focus-visible{outline:2px solid var(--indigo-500);outline-offset:2px;border-radius:var(--r-sm);}

/* ---------- 3. 全站极淡颗粒（印刷品质感） ---------- */
body::after{
  content:"";position:fixed;inset:0;z-index: var(--z-modal);pointer-events:none;opacity:.04;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- 4. 卡片标准（覆盖所有卡片类） ---------- */
.card, .v18-card, .card-sm,
[class*="card"]:not([class*="glass"]):not([class*="gstat"]):not([class*="glev"]):not([class*="cr-card"]):not([class*="cr-pcard"]){
  background:var(--card) !important;
  border:1px solid var(--line) !important;
  border-radius:var(--r-xl) !important;
  box-shadow:var(--sh-sm) !important;
  transition:box-shadow var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard) !important;
}
.card:hover, .v18-card:hover{
  box-shadow:var(--sh-md) !important;
  border-color:var(--indigo-200) !important;
}

/* ---------- 5. 按钮标准 ---------- */
.btn, button.btn, .btn-primary, .btn-secondary, .btn-ghost, .btn-gold,
button:not([class*="icon"]):not([class*="close"]):not([class*="nav"]):not([class*="cr-opt"]){
  font-family:var(--font-sans) !important;
  font-weight:600 !important;
  border-radius:var(--r-md) !important;
  border:1px solid transparent !important;
  cursor:pointer !important;
  transition:all var(--dur-fast) var(--ease-standard) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  white-space:nowrap !important;
  text-decoration:none !important;
}
.btn-primary, .btn.btn-primary{
  background:var(--indigo-500) !important;
  color:#fff !important;
  border-color:var(--indigo-500) !important;
}
.btn-primary:hover, .btn.btn-primary:hover{
  background:var(--indigo-600) !important;
  border-color:var(--indigo-600) !important;
}
.btn-primary:active{transform:scale(.98) !important;}
.btn-secondary, .btn-line{
  background:#fff !important;
  color:var(--indigo-600) !important;
  border-color:var(--indigo-200) !important;
}
.btn-secondary:hover, .btn-line:hover{
  background:var(--indigo-50) !important;
  border-color:var(--indigo-300) !important;
}
.btn-ghost{
  background:transparent !important;
  color:var(--ink-2) !important;
}
.btn-ghost:hover{
  background:var(--indigo-50) !important;
  color:var(--indigo-600) !important;
}
.btn-gold{
  background:var(--gold-400) !important;
  color:var(--ink) !important;
  border-color:var(--gold-400) !important;
  font-weight:700 !important;
}
.btn-gold:hover{background:var(--gold-600) !important;color:#fff !important;border-color:var(--gold-600) !important;}
.btn-lg{height:48px !important;padding:0 24px !important;font-size:15.5px !important;}
.btn-md{height:40px !important;padding:0 18px !important;font-size:14px !important;}
.btn-sm{height:32px !important;padding:0 13px !important;font-size:12.5px !important;}
.btn:disabled{opacity:.5 !important;cursor:not-allowed !important;pointer-events:none !important;}

/* ---------- 6. 导航标准（毛玻璃顶栏） ---------- */
.nav, nav, .topbar, header[class*="nav"], .navbar{
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:saturate(180%) blur(20px) !important;
  -webkit-backdrop-filter:saturate(180%) blur(20px) !important;
  border-bottom:1px solid var(--line) !important;
}
.nav-btn, .nav a, nav a, .navbar a{
  font-size:14.5px !important;
  font-weight:500 !important;
  color:var(--ink-2) !important;
  padding:8px 14px !important;
  border-radius:var(--r-sm) !important;
  transition:color var(--dur-fast),background var(--dur-fast) !important;
  text-decoration:none !important;
}
.nav-btn:hover, .nav a:hover, nav a:hover{
  color:var(--indigo-600) !important;
  background:var(--indigo-50) !important;
}
.nav-btn.active, .nav a.active, nav a.active{
  color:var(--indigo-600) !important;
  font-weight:600 !important;
  background:var(--indigo-50) !important;
}

/* ---------- 7. 输入框标准 ---------- */
input, textarea, select, .input, .textarea, .select{
  font-family:var(--font-sans) !important;
  font-size:14px !important;
  color:var(--ink) !important;
  background:#fff !important;
  border:1px solid var(--line) !important;
  border-radius:var(--r-md) !important;
  padding:0 14px !important;
  height:44px !important;
  transition:all var(--dur-fast) var(--ease-standard) !important;
  outline:none !important;
}
textarea{height:auto !important;padding:11px 14px !important;line-height:1.6 !important;resize:vertical !important;min-height:88px !important;}
input:focus, textarea:focus, select:focus, .input:focus{
  border-color:var(--indigo-500) !important;
  box-shadow:0 0 0 3px var(--indigo-100) !important;
}
input::placeholder, textarea::placeholder{color:var(--ink-4) !important;}
.input.err, input.err{border-color:var(--error) !important;}
.input.err:focus, input.err:focus{box-shadow:0 0 0 3px var(--error-line) !important;}

/* ---------- 8. 标签/徽章标准 ---------- */
.badge, .tag, .chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  font-size:12px !important;
  font-weight:500 !important;
  padding:4px 10px !important;
  border-radius:999px !important;
  border:1px solid transparent !important;
  line-height:1.4 !important;
}
.badge-indigo, .tag-indigo{background:var(--indigo-50) !important;color:var(--indigo-600) !important;border-color:var(--indigo-200) !important;}
.badge-gold, .tag-gold{background:var(--gold-100) !important;color:var(--gold-600) !important;border-color:#E8D5A8 !important;}
.badge-success, .tag-success{background:var(--success-bg) !important;color:var(--success) !important;border-color:var(--success-line) !important;}
.badge-warning, .tag-warning{background:var(--warning-bg) !important;color:var(--warning) !important;border-color:var(--warning-line) !important;}
.badge-danger, .badge-error, .tag-danger{background:var(--error-bg) !important;color:var(--error) !important;border-color:var(--error-line) !important;}
.badge-gray, .tag-gray{background:var(--bg-soft) !important;color:var(--ink-3) !important;border-color:var(--line) !important;}
.chip.active{background:var(--indigo-500) !important;color:#fff !important;border-color:var(--indigo-500) !important;}

/* ---------- 9. 弹窗标准 ---------- */
.modal, .modal-v18, .popup, .modal-box, .modal-content{
  background:var(--card) !important;
  border-radius:var(--r-xl) !important;
  box-shadow:var(--sh-lg) !important;
  border:1px solid var(--line) !important;
}
.modal-overlay, .modal-v18::before, .popup-overlay{
  background:rgba(26,26,46,.5) !important;
  backdrop-filter:blur(4px) !important;
  -webkit-backdrop-filter:blur(4px) !important;
}
.modal-title, .modal-head h2, .popup-title{
  font-size:var(--fs-headline) !important;
  font-weight:700 !important;
  color:var(--ink) !important;
}
.modal-close, .popup-close{
  width:32px !important;height:32px !important;
  border-radius:var(--r-sm) !important;
  border:none !important;
  background:var(--bg-soft) !important;
  color:var(--ink-3) !important;
  cursor:pointer !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font-size:18px !important;
}
.modal-close:hover, .popup-close:hover{background:var(--line) !important;color:var(--ink) !important;}

/* ---------- 10. 进度条标准 ---------- */
.progress-bar, progress{
  height:8px !important;
  background:var(--indigo-100) !important;
  border-radius:999px !important;
  overflow:hidden !important;
}
.progress-bar .fill, .progress-bar > div, progress::-webkit-progress-value{
  background:var(--indigo-500) !important;
  border-radius:999px !important;
  transition:width .3s ease !important;
}

/* ---------- 11. 头像标准 ---------- */
.avatar{
  border-radius:50% !important;
  background:var(--indigo-50) !important;
  color:var(--indigo-600) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-weight:700 !important;
  overflow:hidden !important;
  flex-shrink:0 !important;
}
.avatar-sm{width:28px !important;height:28px !important;font-size:11px !important;}
.avatar-md{width:36px !important;height:36px !important;font-size:13px !important;}
.avatar-lg{width:48px !important;height:48px !important;font-size:16px !important;}

/* ---------- 12. 表格标准 ---------- */
table, .v18-table{
  width:100% !important;
  border-collapse:collapse !important;
  font-size:14px !important;
  background:var(--card) !important;
  border:1px solid var(--line) !important;
  border-radius:var(--r-lg) !important;
  overflow:hidden !important;
}
table th, .v18-table th{
  background:var(--indigo-50) !important;
  text-align:left !important;
  font-size:12.5px !important;
  color:var(--ink-2) !important;
  font-weight:600 !important;
  padding:10px 14px !important;
  border-bottom:1px solid var(--line) !important;
}
table td, .v18-table td{
  padding:10px 14px !important;
  border-bottom:1px solid var(--line-2) !important;
  vertical-align:top !important;
  color:var(--ink) !important;
}
table tr:last-child td{border-bottom:none !important;}

/* ---------- 13. 空状态标准 ---------- */
.empty-state, .empty, [class*="empty"]{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  padding:48px 16px !important;
  text-align:center !important;
  gap:12px !important;
}
.empty-state .es-title, .empty h3{font-size:16px !important;font-weight:700 !important;color:var(--ink) !important;}
.empty-state .es-desc, .empty p{font-size:14.5px !important;color:var(--ink-3) !important;max-width:360px !important;}

/* ---------- 14. 代码块标准（深色仅用于代码） ---------- */
code, pre, .code{
  font-family:var(--font-mono) !important;
  font-size:12.5px !important;
}
pre, .code-block{
  background:var(--dark) !important;
  color:#D7DDF0 !important;
  border-radius:var(--r-lg) !important;
  padding:16px 20px !important;
  overflow-x:auto !important;
  line-height:1.7 !important;
}
code{background:var(--indigo-50) !important;color:var(--indigo-600) !important;padding:2px 6px !important;border-radius:6px !important;}

/* ---------- 15. 分段控制器标准 ---------- */
.seg, .segmented, [class*="segmented"]{
  display:inline-flex !important;
  background:var(--line-2) !important;
  border-radius:var(--r-md) !important;
  padding:3px !important;
  gap:2px !important;
}
.seg button, .segmented button{
  border:none !important;
  background:transparent !important;
  font-family:var(--font-sans) !important;
  font-size:13px !important;
  font-weight:500 !important;
  color:var(--ink-2) !important;
  padding:7px 16px !important;
  border-radius:9px !important;
  cursor:pointer !important;
}
.seg button.active, .segmented button.active{
  background:#fff !important;
  color:var(--ink) !important;
  box-shadow:var(--sh-sm) !important;
}

/* ---------- 16. 非标准颜色强制修正（高频违规色） ---------- */
/* 灰色变体统一映射到墨色阶 */
[style*="#7a818f"], [style*="#7A818F"]{color:var(--ink-3) !important;}
[style*="#8a8f98"], [style*="#8A8F98"]{color:var(--ink-3) !important;}
[style*="#414754"], [style*="#414754"]{color:var(--ink-2) !important;}
[style*="#c2ccda"], [style*="#C2CCDA"]{color:var(--ink-4) !important;}
/* 非标准紫色统一为Indigo */
[style*="#6366f1"], [style*="#6366F1"]{color:var(--indigo-500) !important;background-color:var(--indigo-500) !important;}
[style*="#7c8cf0"], [style*="#7C8CF0"]{color:var(--indigo-400) !important;}
[style*="#8b5cf6"], [style*="#8B5CF6"]{color:var(--indigo-500) !important;}
/* 非标准红色统一为error */
[style*="#ff6b6b"], [style*="#FF6B6B"]{color:var(--error) !important;}
[style*="#e0483d"], [style*="#E0483D"]{color:var(--error) !important;}
/* 非标准金色统一为gold */
[style*="#93681f"], [style*="#93681F"]{color:var(--gold-600) !important;}

/* ---------- 17. 页脚标准 ---------- */
.footer, footer{
  border-top:1px solid var(--line) !important;
  padding:32px 0 !important;
  margin-top:48px !important;
  font-size:12.5px !important;
  color:var(--ink-3) !important;
}

/* ---------- 18. 响应式（桌面优先，无横滚） ---------- */
@media(max-width:1366px){
  .nav-btn{padding:7px 10px !important;font-size:14px !important;}
}
@media(max-width:900px){
  :root{--fs-display:36px;--fs-title1:28px;--fs-title2:24px;}
  .g-2,.g-3,.g-4{grid-template-columns:1fr !important;}
  .dodont{grid-template-columns:1fr !important;}
  .mentor-bar{flex-wrap:wrap !important;}
}
@media(max-width:768px){
  :root{--fs-display:28px;--fs-title2:22px;--container-pad:16px;}
  .timeline-v18{grid-template-columns:1fr !important;gap:16px !important;}
  .timeline-v18::before{display:none !important;}
}

/* ---------- 19. 动效统一 ---------- */
*{transition-duration:var(--dur-fast) !important;transition-timing-function:var(--ease-standard) !important;}
a, button, .btn, .card, .nav-btn, input, .chip, .badge{
  transition:all var(--dur-fast) var(--ease-standard) !important;
}

/* ---------- 20. 去除AI套路（设计红线） ---------- */
/* 禁粒子网背景 */
.particle-bg, .network-bg, .glow-bg, [class*="particle"]{display:none !important;}
/* 禁彩虹色板 */
[style*="rainbow"], [class*="rainbow"]{display:none !important;}
/* 金色克制：非导师/成就区域不用金色 */
:not(.badge-gold):not(.btn-gold):not(.gc-badge.god):not(.gc-corner.mine):not([class*="mentor"]):not([class*="achievement"]){
  /* 不强制清除，但金色只在指定区域 */
}

/* ===== z-index 分层令牌（5层） ===== */
:root {
  --z-base: 0;        /* 基础内容层 */
  --z-dropdown: 100;  /* 下拉菜单/弹出层 */
  --z-sticky: 200;    /* 吸顶/固定导航 */
  --z-modal: 1000;    /* 弹窗/遮罩 */
  --z-toast: 9999;    /* 通知/Toast 最高层 */
}
