/* 捷特王 · 圈子（bbs）专用后置层 —— 第 41 轮：以 Discuz! X5「X5模版」(discuzx5) 为内容基线。
   必须在主站 chrome CSS 之后加载。X5 的加载顺序是
   style_3_common.css（默认 common.css 基底 + jetwong/extend_common.css=X5 扩展）
   → style_3_<模块>.css → chrome → 本表 → (widthauto，本站未启用)。

   核心思路：X5 扩展用 :root 的 --dz-* 令牌驱动整套版式，本表把 --dz-* 重映射到
   主站 --jw-* 调色板（深/浅两套自动翻转、直角），即可整体换肤而不破坏 X5 结构。
   只有三类需要显式覆盖：
     ① 落回 X3 默认 common.css 基底、用字面浅色而非令牌的可见选择器（如 .bm 容器底色）；
     ② X5 扩展里写死的浅色/黄色（.tip / #uhd / .portal_nav / .timeline 等）；
     ③ X5 扩展未覆盖、仍走默认 markup 的 home/space 功能模块（.rfm/.buddy/.doing 等）。
   关键选择器加 body.jw-root 提特异性；令牌全部来自主站，深/浅随 html[data-theme] 翻转。 */

/* =====================================================================
   0. 字体本地化：chrome 的 @font-face 指向 www 域，跨域字体被 CORS 拦截，
      用同描述符的本地副本覆盖（后加载者生效），字体文件在 static/font/。
   ===================================================================== */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('font/inter.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Space Grotesk';
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
    src: url('font/spacegrotesk.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'JetBrains Mono';
    font-style: normal;
    font-weight: 100 800;
    font-display: swap;
    src: url('font/jetbrainsmono.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* =====================================================================
   1. 令牌重映射：X5 的 --dz-* → 主站 --jw-*（换肤核心）
      --jw-* 在 chrome 里按 :root(深) / html[data-theme=light](浅) 定义，
      本表在 :root 引用它们，计算值随主题自动翻转。
      --dz-ff/bg f 既是面板底色，又被 X5 当作「强调底上的文字色」(color:var(--dz-ff))，
      映射到 --jw-panel 后两种用途在深/浅下对比都成立（深色面板配浅蓝强调、白色面板配深蓝强调）。
   ===================================================================== */
:root {
    --dz-bodybg: var(--jw-bg);
    --dz-color: var(--jw-ac);
    --dz-alink: var(--jw-ac);
    --dz-ahover: var(--jw-ac);
    --dz-ahot: var(--jw-warn);
    --dz-fa: var(--jw-fg);
    --dz-fb: var(--jw-fg2);
    --dz-fc: var(--jw-mut);
    --dz-fd: var(--jw-mut);
    --dz-ff: var(--jw-panel);
    --dz-nvbg: var(--jw-ac);
    --dz-nvtxt: var(--jw-fg);
    --dz-nvbga: var(--jw-ac-soft);
    --dz-nvtxta: var(--jw-ac);
    --dz-bga: var(--jw-bg2);
    --dz-bgb: var(--jw-panel2);
    --dz-bgc: var(--jw-panel2);
    --dz-bgd: var(--jw-panel2);
    --dz-bgf: var(--jw-panel);
    --dz-bgfglass: var(--jw-card-hib);
    /* --dz-bgbglass 保留 rgba(0,0,0,.4)：图上文字 scrim，与主题无关 */
    --dz-btnbg: var(--jw-btn);
    --dz-btntxt: #fff;
    /* btnbga 被 .pgsbtn/.pna/.km_pnbtn 当作常态底色（非仅悬停），深色下 --jw-ac 是浅蓝配白字对比不足，故钉到常量 --jw-btn */
    --dz-btnbga: var(--jw-btn);
    --dz-btntxta: #fff;
    --dz-bordera: var(--jw-line);
    --dz-borderb: var(--jw-line);
    --dz-borderc: var(--jw-line2);
    --dz-borderd: var(--jw-line2);
    /* 主站直角语言：除正圆(头像/圆点)外全部归零 */
    --dz-radius-x: 0;
    --dz-radius-s: 0;
    --dz-radius-m: 0;
    --dz-radius-xl: 0;
    --dz-radius-l: 0;
    --dz-radius-a: 50%;
    --dz-radius-b: 0;
    --dz-radius-c: 0;
    /* X5 卡片用 box-shadow 而非 border（extend 里 border:none !important）。
       用 1px 环影模拟主站发丝边框，避开 !important 特异性战争，且随主题翻转。 */
    --dz-shadow: 0 0 0 1px var(--jw-line), 0 1px 2px rgba(0, 0, 0, .1);
}

/* =====================================================================
   2. 容器：保留 X5 dz_wide 固定 1200（与主站会员/auth 1120 固定宽一致），
      仅去掉 body 强制最小宽并让 padding 内含，避免无谓横向溢出。
   ===================================================================== */
body.jw-root { min-width: 0; }
body.jw-root #wp,
body.jw-root .wp { box-sizing: border-box; }

/* =====================================================================
   3. 落回 X3 默认基底、用字面浅色的可见选择器（令牌重映射够不到）
   ===================================================================== */
/* .bm 容器底色：X3 基底 .bm{background:{WRAPBG}} 是字面浅色，X5 扩展只去边框加阴影、
   未用令牌覆盖底色，必须显式补。面板头 .bm_h 已被 X5 令牌化(bgf)，无需再覆盖。 */
body.jw-root .bm { background: var(--jw-panel); }
/* 区块头右侧 +发表/RSS 小图标：X3 基底是白径向圆底(#fff)+灰字形(#CCC)，
   深色下白圆点刺眼，改成强调薄洗圆底 + 令牌字形。 */
body.jw-root .bm_h .o img,
body.jw-root .bm_h .o em {
    color: var(--jw-mut);
    background: radial-gradient(var(--jw-ac-soft) 45%, transparent 45%);
}
body.jw-root .bm_h .o img:hover,
body.jw-root .bm_h .o em:hover { color: var(--jw-ac); }

/* =====================================================================
   4. X5 扩展里写死的浅色/黄色（内容区可见，需翻成面板）
   ===================================================================== */
/* 悬停提示 .tip：官方黄底 #FFFCE9 / 框 #EDDDAB → 面板；黄色 SVG 小角隐藏 */
body.jw-root .tip {
    background: var(--jw-panel);
    border: 1px solid var(--jw-line2);
    box-shadow: var(--jw-shadow);
    color: var(--jw-fg2);
}
body.jw-root .tip_horn { display: none; }
body.jw-root .tip a { color: var(--jw-ac); }
/* 会员空间页头 #uhd：官方 #ffffff → 面板 */
body.jw-root #uhd {
    background: var(--jw-panel);
    border: 1px solid var(--jw-line);
}
body.jw-root #uhd .mt,
body.jw-root #uhd h2 { color: var(--jw-fg); }
body.jw-root #uhd .mn a { color: var(--jw-fg2); }
body.jw-root #uhd .mn a:hover { color: var(--jw-ac); }
body.jw-root #uhd .tns th,
body.jw-root #uhd .tns td { color: var(--jw-fg2); }
/* 门户导航 .portal_nav：官方 #fff → 面板 */
body.jw-root .portal_nav {
    background-color: var(--jw-panel);
    border: 1px solid var(--jw-line);
}
/* 时间线容器 .timeline_entry_list_container：官方 #fff → 面板 */
body.jw-root .timeline_entry_list_container {
    background-color: var(--jw-panel);
    border: 1px solid var(--jw-line);
}
/* 数据表头 .tdats .h th：官方 border-color:#fff → 发丝线 */
body.jw-root .tdats .h th { border-color: var(--jw-line); }

/* =====================================================================
   5. X5 扩展未覆盖、仍走默认 markup 的 home/space 功能模块
      （好友/短消息/心情/分享/设置中心行表单/代码块）
   ===================================================================== */
/* 设置中心逐行表单 .rfm / .e .i */
body.jw-root .rfm { border-bottom: 1px dotted var(--jw-line); }
body.jw-root .rfm a { color: var(--jw-ac); }
body.jw-root .rfm th,
body.jw-root .rfm td { color: var(--jw-fg2); }
body.jw-root .rfm .p_tip { background: var(--jw-panel); color: var(--jw-mut); }
body.jw-root .e .i,
body.jw-root .el .i {
    background: var(--jw-panel2);
    border-bottom: 1px dashed var(--jw-line);
    color: var(--jw-fg2);
}
/* 代码块 */
body.jw-root .blockcode {
    background: var(--jw-bg2);
    border: 1px solid var(--jw-line);
    color: var(--jw-fg2);
}
/* 好友卡片 */
body.jw-root .buddy li {
    background: var(--jw-panel2);
    border: 1px solid var(--jw-line);
}
/* 用户选择器小标签 */
body.jw-root .un_selector span { background: var(--jw-ac-soft); color: var(--jw-ac); }
body.jw-root .un_selector .x:hover { background: var(--jw-ac); color: var(--jw-ac-ink); }
/* 短消息好友下拉 */
body.jw-root .pmfrndl { background: var(--jw-panel); border-color: var(--jw-line); }
body.jw-root .pmfrndl a { color: var(--jw-fg2); }
body.jw-root .pmfrndl a.a { background: var(--jw-ac-soft); color: var(--jw-ac); }
/* 心情 / 动态 / 分享卡片 */
body.jw-root .doing_form,
body.jw-root .doingreply_form > div,
body.jw-root .share_card_box,
body.jw-root .doing_hotcomments,
body.jw-root .doing_cm_child {
    background: var(--jw-panel2);
    border: 1px solid var(--jw-line);
}
body.jw-root .share_card_img,
body.jw-root .doing_image_item { background: var(--jw-panel); }
body.jw-root .moodfm_container .image-upload,
body.jw-root .moodfm_container .image-upload-mp {
    background: var(--jw-panel2) !important;
    border-color: var(--jw-line) !important;
}
body.jw-root .moodfm_container .image-upload:hover {
    border-color: var(--jw-ac) !important;
    background: var(--jw-ac-soft) !important;
}
body.jw-root .moodfm_container .previewbigpic {
    background: var(--jw-panel2);
    border-color: var(--jw-line);
}

/* =====================================================================
   6. 对话框 / 浮窗：标题栏与深阴影（X5 的 .nfl .f_c 用 --dz-shadow=发丝环，
      对话框需要主站深阴影 +  scrim 才立体）
   ===================================================================== */
body.jw-root .nfl .f_c,
body.jw-root .p_pof,
body.jw-root .fwin .f_c {
    background: var(--jw-panel);
    border: 1px solid var(--jw-line2);
    box-shadow: var(--jw-shadow);
}
body.jw-root .flb { background: transparent; border-bottom: 1px solid var(--jw-line); }
body.jw-root .flb em { color: var(--jw-fg); text-shadow: none; }
body.jw-root .flb em:before { border-top-color: var(--jw-ac); }
body.jw-root .flb span,
body.jw-root .flb .onright { color: var(--jw-mut); }
body.jw-root .flb span a,
body.jw-root .flb strong { color: var(--jw-fg2); }
body.jw-root .flb span a:hover { color: var(--jw-ac); }
body.jw-root .flbc { background: transparent; }
body.jw-root .flbc:before { color: var(--jw-mut); }
body.jw-root .flbc:hover { background: var(--jw-ac-soft); }
body.jw-root .flbc:hover:before { color: var(--jw-ac); }
body.jw-root #messagetext { color: var(--jw-fg2); }
body.jw-root #messagetext a { color: var(--jw-ac); }
/* 三类提示条统一面板底（图标语义色保留） */
body.jw-root .alert_right,
body.jw-root .alert_error,
body.jw-root .alert_info {
    background: var(--jw-panel2);
    border: 1px solid var(--jw-line);
    color: var(--jw-fg2);
}
body.jw-root .alert_error a { color: var(--jw-ac); }

/* =====================================================================
   7. 发帖编辑器 SVG 图标按主题着色
      X5 用 SVG（{STYLEIMGDIR}/svg/dz_e_*.svg，固定中灰 #666 字形），不是雪碧图。
      中灰在浅底白面板上对比足够；深色面板上偏暗，仅深色下把「纯图标」元素提亮，
      排除 .dp（有底色+文字）与 b1r 文字标签，避免反相把底色/文字也翻掉。
   ===================================================================== */
html[data-theme="dark"] body.jw-root .edt .b2r a:not(.dp) {
    filter: brightness(0) invert(0.72);
}
html[data-theme="dark"] body.jw-root #e_imagen,
html[data-theme="dark"] body.jw-root #e_attachn {
    filter: brightness(0) invert(0.72);
}

/* =====================================================================
   8. 滚动条：用主站调色板绘制（页面与内部滚动区一致）
   ===================================================================== */
body.jw-root ::-webkit-scrollbar { width: 10px; height: 10px; }
body.jw-root ::-webkit-scrollbar-track { background: var(--jw-bg2); }
body.jw-root ::-webkit-scrollbar-thumb {
    background: var(--jw-line2);
    border: 2px solid var(--jw-bg2);
}
body.jw-root ::-webkit-scrollbar-thumb:hover { background: var(--jw-ac); }
body.jw-root * { scrollbar-width: thin; scrollbar-color: var(--jw-line2) var(--jw-bg2); }

/* =====================================================================
   9. 杂项兜底
   ===================================================================== */
/* 下载验证 .rwdl .uslvd em：官方白字在浅底不可见，强调钮上保持白字 */
body.jw-root .rwdl .uslvd em { color: #fff; }
/* 搜索结果高亮词 */
body.jw-root .pg_search .tl em,
body.jw-root .pg_search .highlight { color: var(--jw-warn); font-style: normal; }