/* === Footer (标准底部) === */
footer {
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: var(--bg2);
  border-top: 1px solid var(--line);
  padding: 12px 0;
  text-align: center;
  font-size: 13px;
  color: var(--muted);
}
footer p { margin: 3px 0; }
footer a { color: var(--muted); text-decoration: none; }
footer a:hover { color: var(--text); text-decoration: underline; }
:root{
  /* ── 背景层级 (从深到浅) ── */
  --bg:#0b0e1a; --bg2:#121730; --card:#171c33; --card2:#1d2342;
  /* ── 文字与线条 ── */
  --text:#e8ecff; --muted:#9aa3c7; --line:#2a3157; --border:#2a3157;
  /* ── 品牌色 ── */
  --brand:#7c5cff; --brand2:#22d3ee;
  /* ── 语义色 ── */
  --ok:#34d399; --warn:#fbbf24; --danger:#f87171; --bad:#f87171;

  /* ── 半透明语义色 (背景填充) ── */
  --brand-soft:rgba(124,92,255,.12);
  --brand2-soft:rgba(34,211,238,.12);
  --ok-soft:rgba(52,211,153,.15);
  --warn-soft:rgba(251,191,36,.15);
  --danger-soft:rgba(248,113,113,.15);

  /* ── 资讯分类语义色 ── */
  --cat-models:#fbbf24; --cat-products:#34d399; --cat-industry:#22d3ee;
  --cat-papers:#f87171; --cat-tips:#7c5cff;

  /* ── 字号 (4px递增体系) ── */
  --fs-xs:12px; --fs-sm:13px; --fs-base:14px; --fs-lg:16px;
  --fs-xl:18px; --fs-2xl:22px; --fs-3xl:28px; --fs-hero:40px;
  /* ── 字重 ── */
  --fw-normal:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;
  /* ── 行高 ── */
  --lh-tight:1.2; --lh-normal:1.6; --lh-relaxed:1.8;

  /* ── 间距 (4px基准) ── */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-12:48px;

  /* ── 圆角 ── */
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:18px; --r-pill:999px;
  --radius:16px;

  /* ── 阴影 ── */
  --shadow-sm:0 2px 8px rgba(0,0,0,.2);
  --shadow-md:0 8px 30px rgba(0,0,0,.35);
  --shadow-brand:0 6px 18px rgba(124,92,255,.35);
  --shadow-glow:0 0 0 3px rgba(124,92,255,.15);
  --shadow:0 8px 30px rgba(0,0,0,.35);

  /* ── 过渡 ── */
  --t-fast:150ms ease; --t-normal:250ms ease; --t-slow:400ms ease;

  /* ── 字体族 ── */
  --font-sans:"Segoe UI",system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono:"JetBrains Mono","Cascadia Code",monospace;
}
.ic img{width:100%;height:100%;border-radius:12px;object-fit:contain;image-rendering:auto}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font-sans);
  background:radial-gradient(1200px 600px at 70% -10%,rgba(124,92,255,.18),transparent),var(--bg);
  color:var(--text);min-height:100vh;line-height:var(--lh-normal)}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
button,input,textarea,select{font:inherit;color:inherit}
.btn{display:inline-flex;align-items:center;gap:var(--sp-2);padding:10px 18px;border:none;border-radius:var(--r-md);
  background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;font-weight:600;cursor:pointer;
  transition:var(--t-fast);box-shadow:var(--shadow-brand)}
.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.btn.ghost{background:transparent;border:1px solid var(--line);box-shadow:none;color:var(--text)}
.btn.danger{background:linear-gradient(135deg,#f87171,#dc2626);box-shadow:0 4px 14px rgba(220,38,38,.25)}
.btn.sm{padding:6px 12px;font-size:var(--fs-sm);border-radius:var(--r-sm)}
.input{width:100%;height:33px;padding:0 14px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-md);outline:none;transition:border-color var(--t-fast);font-size:14px}
textarea.input{height:auto;min-height:80px;padding:10px 14px;resize:vertical}
.input:focus{border-color:var(--brand);box-shadow:var(--shadow-glow)}
.muted{color:var(--muted)}
.center{display:flex;align-items:center;justify-content:center;min-height:100vh}

/* header（全站统一唯一写法：header.top + .wrap row，#038 起旧写法已废除） */
header.top{position:sticky;top:0;z-index:100;backdrop-filter:blur(12px);
  background:rgba(11,14,26,.85);border-bottom:1px solid var(--line)}
.top .row{display:flex;align-items:center;gap:16px;height:64px}
.logo{font-weight:800;font-size:20px;letter-spacing:.5px}
/* logo 配色统一（用户指定采用上一版深色方案的颜色，深浅主题共用）：前缀亮青，后缀紫→亮青渐变 */
.logo>span:first-child{color:#00ffff!important}
.logo .g{background:linear-gradient(135deg,#7c5cff,#22d3ee);-webkit-background-clip:text;background-clip:text;color:transparent}
.nav{display:flex;gap:6px;margin-left:8px;align-items:center}
.nav a{padding:8px 12px;border-radius:10px;color:var(--muted);font-size:14px}
.nav a:hover,.nav a.active{color:var(--text);background:var(--card2)}
/* 顶部导航"反馈留言"按钮：与导航链接同视觉层级 */
.nav-fb{padding:8px 12px;border-radius:10px;color:var(--muted);font-size:14px;font-family:inherit;background:none;border:none;cursor:pointer;white-space:nowrap}
.nav-fb:hover,.nav-fb:focus-visible{color:var(--text);background:var(--card2);outline:none}
/* 首页热门工具：正方形卡片，桌面端 8 列 x 2 排（共 16 个）；卡面只显示 logo + 名称，logo/名称尺寸与标准工具卡一致 */
.hot-tools .grid{grid-template-columns:repeat(8,1fr);gap:12px}
.hot-tools .tool{padding:10px;aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px}
.hot-tools .tool .ic{margin-bottom:0}
.hot-tools .tool h3{font-size:16px;line-height:1.35;margin:0;width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
/* 热门工具响应式：平板 4 列；手机（≤768px）4 列 × 2 排仅显示 8 个（第 9 个起隐藏），电脑端保持 16 个 */
@media (max-width:1024px){.hot-tools .grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:768px){
  .hot-tools .grid{gap:10px}
  .hot-tools .tool:nth-child(n+9){display:none}
}
@media (max-width:520px){
  .hot-tools .tool{padding:6px;gap:6px}
  .hot-tools .tool .ic{width:34px;height:34px;border-radius:9px}
  .hot-tools .tool h3{font-size:12px;line-height:1.25}
}
/* 资讯分类页分页条 */
.news-pager{display:flex;align-items:center;justify-content:center;gap:14px;margin:26px 0 8px;flex-wrap:wrap}
.news-pager .pager-info{font-size:13px;color:var(--muted)}
.spacer{flex:1}
.ver-badge{font-size:11px;font-weight:600;font-family:monospace;letter-spacing:.5px;padding:3px 8px;border-radius:6px;background:var(--card2);color:var(--muted);border:1px solid var(--line);white-space:nowrap;cursor:default;user-select:none}
.ver-badge:hover{color:var(--brand);border-color:var(--brand)}
.userbox{display:flex;align-items:center;gap:10px}

/* #054 桌面端置顶导航按钮固定尺寸：窗口缩放不挤压/不换行变形，整体靠隐藏徽章+导航滚动适配 */
.logo,.nav,.nav a,.nav-fb,.lang-switcher,.lang-current,.userbox,.userbox .btn{flex-shrink:0}
.logo,.nav a,.nav-fb,.lang-current,.userbox .btn{white-space:nowrap}
.top .row{flex-wrap:nowrap}
@media (max-width: 1180px) and (min-width: 769px) {
  /* 中等宽度：隐藏版本徽章，导航条自身横向滚动（按钮尺寸保持不变），切换器收紧但不缩按钮 */
  .ver-badge { display: none; }
  .nav { overflow-x: auto; scrollbar-width: none; }
  .nav::-webkit-scrollbar { display: none; }
  #themeWrap .lang-current, #langWrap .lang-current { padding: 8px 9px; font-size: 13px; }
}

@media (max-width: 768px) {
  .top .row { height: auto; padding: 8px 0; flex-wrap: wrap; gap: 8px; }
  .logo { font-size: 16px; }
  .nav { gap: 4px; margin-left: 0; flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; width: 100%; order: 3; }
  .nav::-webkit-scrollbar { display: none; }
  .nav a { padding: 6px 8px; font-size: 12px; white-space: nowrap; }
  .ver-badge { display: none; }
}

/* hero */
.hero{padding:54px 0 30px;text-align:center}
.hero h1{font-size:40px;line-height:1.2;margin-bottom:12px}
.hero h1 .g{background:linear-gradient(135deg,var(--brand),var(--brand2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--muted);font-size:17px}
.search{margin:26px auto 0;max-width:620px;display:flex;gap:10px}
.search .input{flex:1}
.search .btn{height:33px;padding:0 18px}
.tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:18px}
.tag{padding:6px 14px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:13px;cursor:pointer;color:var(--muted)}
.tag.active,.tag:hover{color:#fff;border-color:var(--brand);background:var(--card2)}

/* tools grid */
.section{padding:26px 0}
.section h2{font-size:22px;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.tool{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;transition:var(--t-fast);position:relative;overflow:hidden}
.tool:hover{transform:translateY(-3px);border-color:var(--brand)}
.tool .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:24px;
  background:var(--card);margin-bottom:12px}
.tool h3{font-size:16px;margin-bottom:6px}
.tool p{color:var(--muted);font-size:13px;min-height:38px}
.tool .cat{position:absolute;top:14px;right:14px;font-size:11px;color:var(--brand2);background:rgba(34,211,238,.12);padding:3px 8px;border-radius:8px}
.empty{text-align:center;color:var(--muted);padding:40px}

/* auth */
.auth{max-width:400px;width:100%}
.auth .card{padding:28px}
.auth h2{margin-bottom:6px}
.auth .field{margin-top:3px}
.auth .hint{font-size:12px;color:var(--warn);margin-top:8px}
.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);background:var(--card2);
  border:1px solid var(--line);padding:12px 18px;border-radius:var(--r-md);box-shadow:var(--shadow);opacity:0;transition:var(--t-normal);z-index:50}
.toast.show{opacity:1}

/* app layout */
.app{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 64px)}
.side{border-right:1px solid var(--line);padding:20px;background:rgba(36,46,96,.5)}
.side .me{padding:14px;border-radius:var(--r-lg);background:var(--card);margin-bottom:18px}
.side .me .av{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:26px;
  background:linear-gradient(135deg,var(--brand),var(--brand2));margin-bottom:8px}
.side .menu{display:flex;flex-direction:column;gap:4px}
.side .menu a{padding:10px 12px;border-radius:10px;color:var(--muted);cursor:pointer}
.side .menu a:hover,.side .menu a.active{background:var(--card2);color:#fff}
.main{padding:24px}
.panel{display:none}
.panel.active{display:block}
.post{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px;margin-bottom:14px}
.post .head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.post .av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--brand),var(--brand2))}
.composer{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px;margin-bottom:18px}
.composer textarea{width:100%;min-height:70px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px;resize:vertical}
.row2{display:flex;gap:12px;margin-top:10px}
.row2 .input{flex:1}
.follow-btn{margin-top:10px}
.stat{display:flex;gap:18px;margin-top:10px;color:var(--muted);font-size:14px}
.stat b{color:#fff}
.comm{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px;margin-bottom:12px}
.comm h3{margin-bottom:4px}
.msg-list{display:flex;flex-direction:column;gap:10px;max-height:55vh;overflow:auto}
.msg{display:flex;gap:10px}
.msg .bubble{background:var(--card);border:1px solid var(--line);padding:10px 14px;border-radius:var(--r-lg);max-width:70%}
.msg.me{justify-content:flex-end}
.msg.me .bubble{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;border:none}
.conv{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;cursor:pointer;border:1px solid var(--line);margin-bottom:8px;background:var(--card)}
.conv:hover{background:var(--card2)}
.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--brand),var(--brand2));flex:none}
.pill{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--card2);color:var(--brand2);border:1px solid var(--line)}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;place-items:center;z-index:200;overflow-y:auto;padding:20px}
.modal-bg.show{display:grid}
.modal{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;width:min(440px,92vw)}
@media(max-width:780px){.app{grid-template-columns:1fr}.side{display:none}.hero h1{font-size:30px}}

/* ============ 新增：账号体系 UI ============ */
/* tabs */
.tabs{display:flex;gap:6px;margin:14px 0 4px}
.tab{padding:7px 12px;border-radius:10px;font-size:13px;color:var(--muted);cursor:pointer;background:var(--bg2);border:1px solid var(--line)}
.tab.active{color:#fff;border-color:var(--brand);background:var(--card2)}
.tabp{margin-top:6px}
/* 验证码行 */
.code-row{display:flex;gap:8px}
.code-row .input{flex:1}
.code-row .btn{white-space:nowrap}
/* #055 图形验证码图片（短信发码前置人机校验）：固定尺寸不随窗口缩放变形 */
.cap-img{height:38px;width:120px;border:1px solid var(--line);border-radius:8px;cursor:pointer;flex-shrink:0;background:#f3f6ff;object-fit:cover;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.cap-img:active{opacity:.85}
/* 提示 */
.tip{display:block;font-size:12px;margin-top:4px;min-height:14px}
.tip.ok{color:var(--ok)}
.tip.err{color:var(--danger)}
.tip.muted{color:var(--muted)}
.input.input-err{border-color:var(--danger)}
/* 分隔 */
.divider{display:flex;align-items:center;gap:10px;margin:16px 0 4px;color:var(--muted);font-size:12px}
.divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--line)}
/* select */
select.input{appearance:none;cursor:pointer}
.field.row{display:flex;flex-wrap:wrap;gap:10px}
.field.row label{width:100%}
.field.row select{flex:1;min-width:120px}
/* 二维码 */
.qr{width:150px;height:150px;border-radius:12px;background:#fff;padding:6px;object-fit:contain}
.qrwrap{display:inline-block}
.qrfallback{width:150px;height:150px;border:1px dashed var(--line);border-radius:12px;display:grid;place-items:center;text-align:center;color:var(--muted);font-size:12px;padding:8px}
.qrbox{display:grid;place-items:center;margin:12px 0}
/* 绑定徽章 / 提醒 / 信息 */
.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;background:var(--bg2);border:1px solid var(--line);color:var(--muted);margin-right:6px}
.badge.ok{background:rgba(52,211,153,.15);border-color:var(--ok);color:var(--ok)}
.binds{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.remind{margin-top:8px;font-size:13px;color:var(--brand2)}
.info{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:var(--muted)}
.info span{background:var(--bg2);border:1px solid var(--line);padding:3px 10px;border-radius:8px}
/* 扫码弹窗 */
.modal.scan{text-align:center}
.modal.scan h3{margin-bottom:6px}
/* 工具详情弹窗 */
.tool-modal{width:min(780px,94vw);max-height:82vh;overflow:auto;padding:0;border-radius:var(--r-xl);position:relative}
.tool-modal .tm-head{display:flex;align-items:center;gap:14px;padding:18px 20px;border-bottom:1px solid var(--line)}
.tool-modal .tm-logo{width:52px;height:52px;border-radius:14px;object-fit:contain;background:var(--bg2);flex:none}
.tool-modal .tm-logo-emoji{display:grid;place-items:center;font-size:28px}
.tool-modal .tm-title{flex:1;min-width:0}
.tool-modal .tm-name{font-size:18px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0}
.tool-modal .tm-cat{font-size:11px;font-weight:400;color:var(--brand2);background:rgba(34,211,238,.12);padding:2px 8px;border-radius:8px;white-space:nowrap}
.tool-modal .tm-close{width:32px;height:32px;border-radius:50%;background:var(--bg2);border:1px solid var(--line);color:var(--text);cursor:pointer;font-size:16px;flex:none}
.tool-modal .tm-close:hover{border-color:var(--brand);filter:brightness(1.1)}
.tool-modal .tm-body{padding:16px 20px 20px}
.tool-modal .tm-url{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:10px 12px 10px 14px;margin-bottom:14px}
.tool-modal .tm-domain{color:var(--text);font-size:14px;word-break:break-all}
.tool-modal .tm-desc{color:var(--muted);font-size:14px;line-height:1.7;margin-bottom:16px}
.tool-modal .tm-section-title{font-size:14px;font-weight:600;margin-bottom:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.tool-modal .tm-brief{color:var(--text);font-size:13px;line-height:1.8;margin-bottom:16px}
.tool-modal .tm-features{list-style:none;counter-reset:feat;margin-bottom:16px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tool-modal .tm-features li{position:relative;padding:10px 10px 10px 34px;font-size:13px;line-height:1.6;color:var(--text);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg2);transition:var(--t-fast);min-height:38px;display:flex;align-items:center}
.tool-modal .tm-features li:hover{border-color:var(--brand);background:var(--card2)}
.tool-modal .tm-features li::before{counter-increment:feat;content:counter(feat);position:absolute;left:8px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;flex-shrink:0}
.tool-modal .tm-news-title{font-size:14px;font-weight:600;margin-bottom:10px}
.tool-modal .tm-news{list-style:none}
.tool-modal .tm-news li{margin-bottom:8px}
.tool-modal .tm-news li a{display:block;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);transition:var(--t-fast);background:var(--bg2)}
.tool-modal .tm-news li a:hover{border-color:var(--brand);background:var(--card2)}
.tool-modal .tm-news .n-title{font-size:13px;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tool-modal .tm-news .n-meta{font-size:12px;color:var(--muted);margin-top:5px}
.tool-modal .tm-empty{color:var(--muted);font-size:13px;padding:10px 12px;background:var(--bg2);border:1px dashed var(--line);border-radius:10px}
.tool-modal .tm-loading{text-align:center;color:var(--muted);padding:36px 0;font-size:14px}
.tool-modal .tm-sim-list{display:flex;flex-wrap:wrap;gap:8px}
.tool-modal .tm-sim{display:flex;align-items:center;gap:7px;padding:7px 12px 7px 7px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-sm);cursor:pointer;transition:var(--t-fast);text-decoration:none}
.tool-modal .tm-sim:hover{border-color:var(--brand);background:var(--card2);filter:brightness(1.08)}
.tool-modal .tm-sim img{width:24px;height:24px;border-radius:6px;object-fit:contain;flex:none}
.tool-modal .tm-sim-emoji{width:24px;height:24px;display:grid;place-items:center;font-size:16px;flex:none}
.tool-modal .tm-sim-name{font-size:13px;color:var(--text);white-space:nowrap}

/* ========== 语言切换器 ========== */
.lang-switcher{position:relative;display:inline-block}
.lang-current{
  display:inline-flex;align-items:center;gap:4px;
  padding:5px 10px;background:var(--bg2);
  border:1px solid var(--line);border-radius:8px;
  cursor:pointer;font-size:13px;color:var(--muted);
  transition:border-color .2s,color .2s;white-space:nowrap
}
.lang-current:hover{border-color:var(--brand);color:var(--text)}
.lang-dropdown{
  position:absolute;top:calc(100% + 6px);right:0;
  background:var(--card2);border:1px solid var(--line);
  border-radius:var(--r-md);padding:6px;min-width:160px;
  display:none;z-index:9999;box-shadow:var(--shadow-md)
}
.lang-dropdown.show{display:block}
.lang-item{
  display:flex;align-items:center;gap:8px;
  padding:7px 10px;border-radius:8px;cursor:pointer;
  font-size:13px;color:var(--muted);transition:background .15s,color .15s
}
.lang-item:hover{background:var(--bg2);color:var(--text)}
.lang-item.active{color:var(--brand);font-weight:600}

/* ========== RTL 支持（阿拉伯语等） ========== */
[dir="rtl"] body,[dir="rtl"] .wrap{direction:rtl;text-align:right}
[dir="rtl"] .row,[dir="rtl"] .top>div,[dir="rtl"] .row2{display:flex;flex-direction:row-reverse}
[dir="rtl"] .nav a{margin-left:0;margin-right:16px}
[dir="rtl"] .userbox>a{margin-left:0;margin-right:8px}
[dir="rtl"] .tabs{direction:rtl}
[dir="rtl"] .card,.modal{text-align:right}
[dir="rtl"] .auth{text-align:right}
[dir="rtl"] .search{flex-direction:row-reverse}
[dir="rtl"] .tag{margin-left:0;margin-right:6px}
[dir="rtl"] .tool{text-align:right}
[dir="rtl"] .grid .tool .ic{float:right;margin-left:12px;margin-right:0}
[dir="rtl"] .panel-sidebar{border-left:none;border-right:1px solid var(--line)}
[dir="rtl"] .menu a{padding:10px 16px}
[dir="rtl"] .stat span{margin-left:0;margin-right:20px}
[dir="rtl"] .stat span:first-child{margin-right:0}
[dir="rtl"] .field .input,[dir="rtl"] .field textarea,[dir="rtl"] .field select{text-align:right}
[dir="rtl"] .code-row{flex-direction:row-reverse}
[dir="rtl"] .binds{flex-direction:row-reverse}
[dir="rtl"] .badge{margin-right:0;margin-left:6px}
[dir="rtl"] .conv{flex-direction:row-reverse}
[dir="rtl"] .msg.me{text-align:left}
[dir="rtl"] .msg:not(.me){text-align:right}
[dir="rtl"] .msg .bubble{text-align:right}
[dir="rtl"] .msg.me .bubble{margin-left:0;margin-right:auto}
[dir="rtl"] .msg:not(.me) .bubble{margin-right:0;margin-left:auto}
[dir="rtl"] .qrwrap{float:left}
[dir="rtl"] .side-me{text-align:right}
[dir="rtl"] .lang-dropdown{right:auto;left:0}
[dir="rtl"] .lang-switcher{margin-left:0;margin-right:8px}
[dir="rtl"] .top>div>div:last-child{margin-left:0;margin-right:auto}

/* ========== 登录/注册页弹窗样式 ========== */
.auth-card{position:relative}
.auth-close{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:50%;background:var(--bg2);border:1px solid var(--line);color:var(--text);text-align:center;line-height:26px;font-size:16px;text-decoration:none;transition:background .15s,color .15s;cursor:pointer;display:flex;align-items:center;justify-content:center}
.modal-x{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:50%;background:var(--bg2);border:1px solid var(--line);color:var(--text);text-align:center;line-height:30px;font-size:18px;cursor:pointer;z-index:10}
.auth-close:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
[dir="rtl"] .auth-close{right:auto;left:12px}
.hint-row{margin-top:12px;text-align:center}
.hint-row .btn.ghost.sm{padding:6px 16px;font-size:13px}

/* ---- tutorials ---- */
.tut-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.tut-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:20px;display:flex;flex-direction:column;gap:10px;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.tut-card:hover{border-color:var(--brand);box-shadow:0 4px 16px rgba(0,0,0,.1)}
.tut-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.diff-easy{background:var(--ok-soft);color:var(--ok);border:1px solid var(--ok);font-size:12px;padding:2px 8px;border-radius:4px;font-weight:600}
.diff-mid{background:var(--warn-soft);color:var(--warn);border:1px solid var(--warn);font-size:12px;padding:2px 8px;border-radius:4px;font-weight:600}
.diff-hard{background:var(--danger-soft);color:var(--danger);border:1px solid var(--danger);font-size:12px;padding:2px 8px;border-radius:4px;font-weight:600}
.tut-cat{font-size:12px;color:var(--muted)}
.tut-card h3{font-size:16px;line-height:1.4;margin:0;color:var(--text)}
.tut-card p{font-size:14px;color:var(--muted);line-height:1.5;margin:0;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tut-tags{display:flex;flex-wrap:wrap;gap:6px}
.tag-sm{background:var(--bg2);color:var(--muted);font-size:12px;padding:2px 8px;border-radius:4px}
.tut-foot{display:flex;align-items:center;justify-content:space-between;margin-top:4px}
.tut-meta{font-size:12px;color:var(--muted)}
.tut-card .btn.sm{padding:6px 14px;font-size:13px;white-space:nowrap}

/* ===== AI��Ѷҳ ===== */
/* ===== AI资讯 ===== */
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.news-card{display:flex}
.featured-wrap{background:var(--card2);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;margin-bottom:8px}
.featured-card{display:flex;flex-direction:column;gap:10px}
.featured-title{font-size:20px;font-weight:800;color:var(--text);line-height:1.4}
.featured-title a{color:var(--text);text-decoration:none}
.featured-title a:hover{color:var(--brand)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:16px;display:flex;flex-direction:column;gap:8px;transition:border-color var(--t-fast),box-shadow var(--t-fast),transform var(--t-fast);text-decoration:none}
.card:hover{border-color:var(--brand);box-shadow:0 4px 16px rgba(124,92,255,.12);transform:translateY(-2px);text-decoration:none}
.card-header{display:flex;align-items:flex-start;gap:10px}
.card-num{flex-shrink:0;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff}
.card-title{flex:1;font-size:14px;font-weight:600;color:var(--text);line-height:1.4}
.card-title a{color:var(--text);text-decoration:none}
.card-title a:hover{color:var(--brand);text-decoration:underline}
.card-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.card-source{font-size:12px;color:var(--muted)}
.card-time{font-size:12px;color:var(--brand);font-weight:500}
.card-summary{font-size:13px;color:var(--muted);line-height:1.6}
.badge{display:inline-block;padding:2px 8px;border-radius:9999px;font-size:11px;font-weight:600;color:#fff;flex-shrink:0}
.badge-models{background:var(--cat-models)}
.badge-products{background:var(--cat-products)}
.badge-industry{background:var(--cat-industry)}
.badge-paper{background:var(--cat-papers)}
.badge-tip{background:var(--cat-tips)}
.news-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.news-tags{display:flex;gap:4px;flex-wrap:wrap}
.tag-sm{font-size:11px;padding:1px 7px;border-radius:4px;background:var(--bg2);color:var(--muted);border:1px solid var(--line)}
@media(max-width:768px){.news-grid{padding:0}.featured-title{font-size:16px}}
/* ===== 教程详情页 ===== */
.tut-detail-wrap{font-family:'PingFang SC','Microsoft YaHei',sans-serif}
.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--brand);text-decoration:none;font-size:14px;margin-bottom:20px;transition:opacity .2s}
.back-link:hover{opacity:.7}
.tut-detail-header{background:var(--card);border:1px solid var(--line);border-radius:var(--r-xl);padding:36px 40px;margin-bottom:20px}
.tut-detail-meta-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.tut-detail-title{font-size:28px;font-weight:900;color:var(--text);margin:0 0 16px;line-height:1.35}
.tut-detail-info{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:18px}
.tut-detail-actions{display:flex;flex-wrap:wrap;gap:10px}
.action-btn{background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:8px 16px;color:var(--text);cursor:pointer;font-size:14px;transition:all .2s}
.action-btn:hover{border-color:var(--brand);background:var(--brand-soft)}
.action-btn.active{border-color:var(--brand);background:rgba(124,92,255,.15);color:var(--brand)}
.tut-detail-tags{margin-bottom:24px}
.tut-intro{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 32px;margin-bottom:24px}
.tut-intro h2{font-size:18px;font-weight:700;color:var(--text);margin:0 0 12px}
.tut-intro-text{font-size:15px;color:var(--muted);line-height:1.8;margin:0}
.video-wrap{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:14px;margin-bottom:28px;background:var(--card)}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}
.tut-steps h2{font-size:20px;font-weight:800;color:var(--text);margin:0 0 20px}
.step-card{display:flex;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 28px;margin-bottom:16px}
.step-num{flex-shrink:0;width:36px;height:36px;background:var(--brand);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px}
.step-body{flex:1}
.step-title{font-size:17px;font-weight:700;color:var(--text);margin:0 0 10px}
.step-text{font-size:15px;color:var(--muted);line-height:1.8}
.step-tip{background:var(--warn-soft);border:1px solid rgba(251,191,36,.3);border-radius:var(--r-sm);padding:12px 16px;margin-top:12px;font-size:14px;color:var(--warn)}
.step-img{max-width:100%;border-radius:10px;margin-top:12px}
/* ===== 创作中心 ===== */
.panel-title{font-size:22px;font-weight:800;color:var(--text);margin:0 0 24px}
.cc-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:28px}
.cc-kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;text-align:center}
.kpi-num{font-size:26px;font-weight:900;color:var(--brand);margin-bottom:4px}
.kpi-label{font-size:12px;color:var(--muted)}
.cc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.cc-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 22px}
.cc-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}
.cc-card-head h4{font-size:15px;font-weight:700;color:var(--text);margin:0;flex:1}
.cc-stats{display:flex;flex-wrap:wrap;gap:10px;font-size:13px;color:var(--muted);margin-bottom:10px}
.cc-stats small{font-size:11px}
.cc-bar{height:6px;background:var(--line);border-radius:3px;overflow:hidden;margin-bottom:14px}
.cc-bar-fill{height:100%;background:linear-gradient(90deg,var(--brand),var(--brand2));border-radius:3px;transition:width .4s}
.cc-actions{display:flex;justify-content:flex-end}
.empty-state{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:60px;text-align:center;margin-bottom:20px}
.empty-state h3{font-size:20px;color:var(--text);margin:0 0 10px}
.empty-state p{color:var(--muted);line-height:1.7}
@media(max-width:900px){.cc-summary{grid-template-columns:repeat(3,1fr)}.tut-detail-header{padding:24px}}
@media(max-width:600px){.cc-summary{grid-template-columns:repeat(2,1fr)}.tut-detail-title{font-size:22px}.step-card{flex-direction:column}}

/* ===== 教程页：类型筛选 ===== */
.type-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.type-tag{cursor:pointer;padding:5px 14px;border-radius:20px;font-size:13px;background:var(--card2);color:var(--muted);border:1px solid var(--line);transition:all .2s}
.type-tag:hover{color:var(--brand);border-color:var(--brand)}
.type-tag.active{background:var(--brand);color:#fff;border-color:var(--brand)}

/* ===== 教程详情页：醒目返回按钮 ===== */
.back-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 24px;border-radius:var(--r-md);font-weight:700;font-size:15px;box-shadow:0 2px 12px rgba(124,92,255,.25);transition:var(--t-fast)}
.back-btn:hover{transform:translateY(-1px);box-shadow:0 4px 20px rgba(124,92,255,.35)}

/* ===== 创作中心：子标签页 ===== */
.cr-tabs{display:flex;gap:10px;margin:18px 0;border-bottom:1px solid var(--line);padding-bottom:12px}
.cr-tab{padding:8px 20px;border-radius:10px;font-size:14px;cursor:pointer;background:var(--card2);color:var(--muted);border:1px solid var(--line);transition:all .2s}
.cr-tab:hover{color:var(--brand);border-color:var(--brand)}
.cr-tab.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.cr-content{animation:fade .2s}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* ===== 数据中心：子面板 ===== */
.dc-sub{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin-bottom:16px}
.dc-sub-label{font-size:13px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;display:block;margin-bottom:10px}
.dc-kpi-row{display:flex;gap:24px;align-items:center;margin-bottom:4px}
.dc-kpi{display:flex;align-items:baseline;gap:4px}
.dc-kpi .kpi-num{font-size:22px;font-weight:700;color:var(--text)}
.dc-kpi .kpi-label{font-size:12px;color:var(--muted)}

/* ===== 数据明细表 ===== */
.dc-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:13px}
.dc-table th{background:var(--card2);color:var(--muted);padding:8px 12px;text-align:left;font-weight:600;font-size:12px;border-bottom:1px solid var(--line)}
.dc-table td{padding:9px 12px;border-bottom:1px solid var(--line);color:var(--text)}
.dc-table tr:hover td{background:var(--card2)}
.dc-table a{color:var(--brand2);text-decoration:none}
.dc-table a:hover{text-decoration:underline}
.dc-table .pct{color:var(--ok);font-weight:600}

/* ===== 内容管理 ===== */
.cm-type-tabs{display:flex;gap:8px;margin-bottom:16px}
.cm-type-tab{padding:6px 16px;border-radius:8px;font-size:13px;cursor:pointer;background:var(--card2);color:var(--muted);border:1px solid var(--line);transition:all .2s}
.cm-type-tab:hover{color:var(--brand);border-color:var(--brand)}
.cm-type-tab.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.cm-card{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 20px;margin-bottom:12px;gap:16px}
.cm-card:hover{border-color:var(--brand2)}
.cm-card-body{flex:1;min-width:0}
.cm-card-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.cm-card-head h4{font-size:15px;font-weight:600;margin:0;color:var(--text)}
.cm-stats{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--muted)}
.cm-stats small{font-size:11px}
.cm-actions{display:flex;gap:8px;flex-shrink:0}
@media(max-width:600px){.cm-card{flex-direction:column;align-items:flex-start}.cm-actions{width:100%;justify-content:flex-end}}

/* ---- 投稿中心 (暗色主题统一) ---- */
.ct-tabs{display:flex;border-bottom:2px solid var(--line);margin-bottom:24px}
.ct-tab{padding:10px 20px;cursor:pointer;font-size:14px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-2px;transition:var(--t-fast)}
.ct-tab:hover{color:var(--brand)}
.ct-tab.active{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.ct-content{}
.ct-panel{display:none}
.ct-panel.active{display:block}
.ct-req{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 24px;margin-bottom:24px}
.ct-req h3{font-size:15px;font-weight:600;margin-bottom:12px;color:var(--text)}
.ct-req ul{margin:0;padding-left:20px}
.ct-req li{font-size:13px;color:var(--muted);line-height:1.8;margin-bottom:4px}
.ct-upload-area{border:2px dashed var(--line);border-radius:var(--r-md);padding:48px 24px;text-align:center;background:var(--bg2);transition:var(--t-fast);cursor:pointer}
.ct-upload-area:hover,.ct-upload-area.drag-over{border-color:var(--brand);background:var(--brand-soft)}
.ct-upload-icon{font-size:48px;margin-bottom:12px}
.ct-upload-area p{font-size:14px;color:var(--muted);margin-bottom:8px}
.ct-file-btn{color:var(--brand);font-weight:600;cursor:pointer;text-decoration:underline}
.ct-upload-hint{font-size:12px;color:var(--muted);margin-top:4px}
.ct-progress-wrap{margin-top:16px}
.ct-progress-bar{height:8px;background:var(--line);border-radius:4px;overflow:hidden}
.ct-progress-fill{height:100%;background:linear-gradient(90deg,var(--brand),var(--brand2));width:0;transition:width .3s}
.ct-progress-text{font-size:12px;color:var(--muted);margin-top:4px}
.ct-upload-info{margin-top:20px;text-align:left}
.ct-file-name{font-size:13px;color:var(--text);font-weight:500;margin-bottom:4px}
.ct-file-size{font-size:12px;color:var(--muted);margin-bottom:12px}
.ct-upload-actions{display:flex;flex-direction:column;gap:10px}
.ct-input{width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:14px;box-sizing:border-box;outline:none;background:var(--bg2);color:var(--text);transition:border-color var(--t-fast)}
.ct-input:focus{border-color:var(--brand);box-shadow:var(--shadow-glow)}
.ct-textarea{width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:14px;resize:vertical;min-height:80px;outline:none;background:var(--bg2);color:var(--text);transition:border-color var(--t-fast);box-sizing:border-box}
.ct-textarea:focus{border-color:var(--brand);box-shadow:var(--shadow-glow)}
.ct-submit-btn{width:100%;padding:12px;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;border:none;border-radius:var(--r-sm);font-size:15px;font-weight:600;cursor:pointer;transition:var(--t-fast)}
.ct-submit-btn:hover{filter:brightness(1.08)}
.ct-submit-btn:disabled{background:var(--card2);color:var(--muted);cursor:not-allowed}
.ct-draft-section{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.ct-draft-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:var(--card2);border-bottom:1px solid var(--line)}
.ct-draft-header h3{font-size:14px;font-weight:600;margin:0;color:var(--text)}
.ct-new-btn{display:inline-block;padding:6px 14px;background:var(--brand);color:#fff;border-radius:var(--r-sm);font-size:13px;font-weight:500;text-decoration:none;transition:var(--t-fast)}
.ct-new-btn:hover{filter:brightness(1.1)}
.ct-draft-list{padding:12px}
.ct-draft-item{padding:12px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}
.ct-draft-item:last-child{border-bottom:none}
.ct-draft-title{flex:1;font-size:14px;color:var(--text);font-weight:500}
.ct-draft-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.ct-draft-edit{color:var(--brand);text-decoration:none;font-weight:500}
.ct-draft-edit:hover{text-decoration:underline}
.ct-draft-del{background:none;border:1px solid var(--line);color:var(--muted);padding:3px 10px;border-radius:4px;font-size:12px;cursor:pointer}
.ct-draft-del:hover{border-color:var(--danger);color:var(--danger)}
.ct-no-draft{padding:32px;text-align:center;color:var(--muted);font-size:14px}
/* ---- 文章编辑器 (暗色主题统一) ---- */
.ae-toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:20px;gap:12px;flex-wrap:wrap}
.ae-back{color:var(--brand);text-decoration:none;font-size:14px;font-weight:500}
.ae-back:hover{text-decoration:underline}
.ae-toolbar-right{display:flex;gap:8px;align-items:center}
.ae-top-btn,.ae-save-btn,.ae-pub-btn{padding:8px 16px;border-radius:var(--r-sm);font-size:13px;font-weight:500;cursor:pointer;transition:var(--t-fast);border:1px solid var(--line);background:var(--card2);color:var(--text)}
.ae-top-btn:hover,.ae-save-btn:hover{background:var(--bg2)}
.ae-pub-btn{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;border-color:transparent}
.ae-pub-btn:hover{filter:brightness(1.08)}
.ae-title-wrap{margin-bottom:16px}
.ae-title{width:100%;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:18px;font-weight:600;outline:none;box-sizing:border-box;background:var(--bg2);color:var(--text);transition:border-color var(--t-fast)}
.ae-title:focus{border-color:var(--brand);box-shadow:var(--shadow-glow)}
.ae-editor-wrap{margin-bottom:20px}
.ae-editor{width:100%;min-height:400px;padding:16px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:15px;line-height:1.8;resize:vertical;outline:none;box-sizing:border-box;font-family:inherit;background:var(--bg2);color:var(--text);transition:border-color var(--t-fast)}
.ae-editor:focus{border-color:var(--brand);box-shadow:var(--shadow-glow)}
.ae-settings{border:1px solid var(--line);border-radius:var(--r-md);padding:20px 24px;background:var(--card)}
.ae-settings-title{font-size:15px;font-weight:600;color:var(--text);margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.ae-setting-row{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.ae-setting-label{min-width:90px;font-size:13px;font-weight:600;color:var(--text);flex-shrink:0}
.ae-toggle{position:relative;display:inline-block;width:40px;height:22px;flex-shrink:0}
.ae-toggle input{opacity:0;width:0;height:0}
.ae-toggle-slider{position:absolute;cursor:pointer;inset:0;background:var(--line);border-radius:11px;transition:.3s}
.ae-toggle-slider:before{position:absolute;content:'';height:16px;width:16px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s}
.ae-toggle input:checked + .ae-toggle-slider{background:var(--brand)}
.ae-toggle input:checked + .ae-toggle-slider:before{transform:translateX(18px)}
.ae-toggle-label{font-size:13px;color:var(--muted);flex:1}
.ae-datetime{padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:13px;margin-top:8px;outline:none;background:var(--bg2);color:var(--text)}
.ae-declare-list{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.ae-declare-item{font-size:13px;color:var(--muted);display:flex;align-items:flex-start;gap:8px;cursor:pointer}
.ae-declare-item input{margin-top:2px;accent-color:var(--brand)}
.ae-orig-panel{margin-top:8px}
.ae-orig-box{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-sm);padding:16px 20px;font-size:13px;color:var(--muted);line-height:1.7;max-height:300px;overflow-y:auto}
.ae-orig-box h4{font-size:14px;font-weight:600;color:var(--text);margin:0 0 10px}
.ae-orig-box p{margin:0 0 10px}
.ae-orig-box ol{padding-left:20px;margin:0 0 10px}
.ae-orig-box li{margin-bottom:4px}
/* Toggle switches for all panels (暗色主题) */
.toggle{display:inline-block;position:relative;width:36px;height:20px;flex-shrink:0}
.toggle input{opacity:0;width:0;height:0}
.toggle-slider{position:absolute;cursor:pointer;inset:0;background:var(--line);border-radius:10px;transition:.3s}
.toggle-slider:before{position:absolute;content:'';height:14px;width:14px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s}
.toggle input:checked + .toggle-slider{background:var(--brand)}
.toggle input:checked + .toggle-slider:before{transform:translateX(16px)}

/* ============================================================
   广告位样式 — AdManager 统一管理
   接入真实广告平台后，只需替换 .ad-slot 内的 HTML 内容
   ============================================================ */
.ad-slot {
  margin: 24px auto;
  border: 1px dashed var(--line);
  border-radius: var(--r-sm);
  background: var(--card);
  overflow: hidden;
  font-family: var(--font-sans);
}

.ad-label {
  padding: 4px 10px;
  font-size: 11px;
  color: var(--muted);
  background: var(--bg2);
  border-bottom: 1px dashed var(--line);
  letter-spacing: 0.5px;
}

.ad-content {
  padding: 0;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  min-height: 90px;
  overflow: hidden;
}

/* 广告图片自适应 — 按槽位尺寸约束 */
.ad-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* Banner 横幅 728×90 */
.ad-slot[id="ad-homeBanner2"],
.ad-slot[id="ad-tutBanner"],
.ad-slot[id="ad-newsBanner"] {
  width: 100%;
  max-width: 728px;
  margin: 24px auto;
}
.ad-slot[id="ad-homeBanner2"] .ad-content,
.ad-slot[id="ad-tutBanner"] .ad-content,
.ad-slot[id="ad-newsBanner"] .ad-content {
  aspect-ratio: 8 / 1;
  height: 90px;
}

/* Sidebar 侧边栏 300×250 */
.ad-slot[id="ad-detailSidebar"],
.ad-slot[id="ad-appBanner"] {
  max-width: 300px;
  width: 100%;
}
.ad-slot[id="ad-detailSidebar"] .ad-content,
.ad-slot[id="ad-appBanner"] .ad-content {
  aspect-ratio: 6 / 5;
  height: 250px;
}

/* Auth 广告位（authSide：独立登录页左半屏 + 登录弹窗左侧 45%，均容器自适应全填充） */
.ad-slot[id="ad-authSide"] { position: relative; }

/* Auth 弹窗内（登录弹窗左侧 45% 容器，全填充无边框） */
.auth-modal-ad .ad-slot[id="ad-authSide"] {
  position: relative;
  margin: 0;
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 0;
  background: transparent;
}
.auth-modal-ad .ad-slot[id="ad-authSide"] .ad-label {
  position: absolute;
  top: 8px;
  left: 10px;
  font-size: 11px;
  color: #fff;
  background: rgba(0,0,0,.35);
  border: none;
  border-radius: 3px;
  z-index: 1;
}
.auth-modal-ad .ad-slot[id="ad-authSide"] .ad-content {
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
}
[dir="rtl"] .auth-modal-ad .ad-slot[id="ad-authSide"] .ad-label { left: auto; right: 10px; }

.ad-placeholder {
  text-align: center;
  color: var(--muted);
  user-select: none;
}

.ad-placeholder-icon {
  font-size: 28px;
  margin-bottom: 6px;
  opacity: 0.5;
}

.ad-placeholder-size {
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 4px;
  font-family: var(--font-mono);
}

.ad-placeholder-text {
  font-size: 12px;
  margin-bottom: 4px;
}

.ad-placeholder-id {
  font-size: 10px;
  color: var(--muted);
  font-family: var(--font-mono);
}

/* 侧边栏广告位（300×250）— 固定宽度 */
.ad-slot[id="ad-detailSidebar"] {
  max-width: 300px;
}

/* 移动端自适应 */
@media (max-width: 768px) {
  .ad-slot { margin: 16px 0; }
  .ad-slot[id^="ad-"][id$="Sidebar"],
  .ad-slot[id^="ad-"][id$="Banner"] { max-width: 100%; }
  .ad-content { min-height: 60px; padding: 0; }
  .ad-slot[id="ad-homeBanner2"] .ad-content,
  .ad-slot[id="ad-tutBanner"] .ad-content,
  .ad-slot[id="ad-newsBanner"] .ad-content { height: 60px; aspect-ratio: auto; }
  .ad-slot[id="ad-detailSidebar"] .ad-content,
  .ad-slot[id="ad-appBanner"] .ad-content { height: 180px; aspect-ratio: auto; }
}

/* ============================================================
   登录/注册页 — 左右分栏布局
   左边广告位，右边表单，面积对等
   ============================================================ */

/* 左边 — 广告位全屏 */

/* 左侧广告图片全屏填充 */

/* 左侧无图片时占位 */

/* 右边 — 表单 */

/* ── AI资讯分类视图 ── */
.news-section { margin-bottom: 40px; }
.news-section-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 14px; padding-bottom: 10px;
  border-bottom: 2px solid var(--border, #e2e8f0);
}
.news-section-head .badge {
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
}
.news-list { display: flex; flex-direction: column; gap: 12px; }
.news-list .news-card:nth-child(n+4) { display: none; }
.news-section.expanded .news-list .news-card:nth-child(n+4) { display: flex; }
/* 分类详情页全量显示：不受首页区块「默认3条」截断规则影响 */
.news-list-full .news-card:nth-child(n+4) { display: flex; }
.news-section-more {
  margin-top: 12px; display: flex; align-items: center; justify-content: center; gap: 10px;
}

/* Category navigation — dark theme */
.cat-nav {
  position: sticky;
  top: 0;
  z-index: 90;
  background: var(--bg);
  padding: 10px 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  border-bottom: 1px solid var(--line);
  margin-bottom: 8px;
}
.cat-nav-item {
  background: var(--card2);
  border: 1px solid var(--line);
  color: var(--muted);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.83rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: all .2s;
  white-space: nowrap;
  letter-spacing: .2px;
}
.cat-nav-item:hover {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(124,92,255,.35);
}
.cat-nav-item.active {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  box-shadow: 0 2px 10px rgba(124,92,255,.3);
}
.cat-nav-item .cnt {
  font-size: 0.8rem;
  opacity: .6;
  margin-left: 2px;
}
.cat-nav-item.cat-back-top {
  background: var(--card);
  border-color: var(--brand2);
  color: var(--brand2);
  font-weight: 600;
  margin-left: 6px;
}
.cat-nav-item.cat-back-top:hover {
  background: var(--brand2);
  color: #0b0e1a;
  border-color: var(--brand2);
  box-shadow: 0 4px 14px rgba(34,211,238,.4);
}

/* News filter bar — sticky, dark theme */
.news-filter-bar {
  position: sticky;
  top: 0;
  z-index: 80;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  padding: 8px 16px;
  margin-bottom: 16px;
}
.news-filter-scroll {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: center;
}
.news-filter-btn {
  background: var(--card2);
  border: 1px solid var(--line);
  color: var(--muted);
  padding: 5px 14px;
  border-radius: 20px;
  font-size: 0.83rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: all .2s;
  white-space: nowrap;
  letter-spacing: .2px;
}
.news-filter-btn:hover {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(124,92,255,.35);
}
.news-filter-btn.active {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  box-shadow: 0 2px 10px rgba(124,92,255,.3);
}
.news-filter-btn.back-to-top {
  background: var(--card);
  border-color: var(--brand2);
  color: var(--brand2);
}
.news-filter-btn.back-to-top:hover {
  background: var(--brand2);
  color: #0b0e1a;
  border-color: var(--brand2);
  box-shadow: 0 4px 14px rgba(34,211,238,.35);
}

/* ===== Auth 登录注册页布局 ===== */
.auth-split-wrap {
  display: flex;
  min-height: 100vh;
  align-items: stretch;
}

/* 左边 — 广告位全屏（45% 宽 × 100% 高，与登录弹窗左侧比例一致） */
.auth-split-left {
  flex: 0 0 45%;
  position: relative;
  background: #1a1a2e;
  overflow: hidden;
}

.auth-split-left .ad-slot {
  position: absolute;
  inset: 0;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
}

.auth-split-left .ad-label { display: none; }

.auth-split-left .ad-content {
  position: absolute;
  inset: 0;
  padding: 0;
  display: block;
}

/* 左侧广告图片全屏填充 */
.auth-split-left .ad-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* 左侧无图片时占位 */
.auth-split-left .ad-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
  color: rgba(255,255,255,0.15);
}

.auth-split-left .ad-placeholder-icon { font-size: 80px; opacity: 0.3; }
.auth-split-left .ad-placeholder-size { color: rgba(255,255,255,0.25); font-size: 14px; }

/* 右边 — 表单居中（55%） */
.auth-split-right {
  flex: 0 0 55%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 40px;
  background: var(--bg);
}

.auth-split-right .auth {
  position: relative;
  width: 100%;
  max-width: 420px;
}

.auth-split-right .auth-card { width: 100%; }

/* 移动端：单栏，广告在顶部 */
@media (max-width: 768px) {
  .auth-split-wrap { flex-direction: column; }
  .auth-split-left { flex: 0 0 220px; }
  .auth-split-right { flex: 1; padding: 32px 16px; }
}
/* ===== 新闻页搜索框 (暗色主题统一) ===== */
.news-search-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.news-search-wrap {
  flex: 0 0 220px;
}

.news-search-input {
  width: 100%;
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  font-size: 13px;
  outline: none;
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
  background: var(--bg2);
  color: var(--text);
}

.news-search-input:focus {
  border-color: var(--brand);
  box-shadow: var(--shadow-glow);
  outline: none;
}

.news-filter-scroll-inner {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
}

.news-filter-scroll-inner::-webkit-scrollbar { display: none; }

.news-filter-btn {
  flex-shrink: 0;
  padding: 4px 12px;
  border-radius: 16px;
  font-size: 13px;
  border: 1px solid var(--line);
  background: var(--card2);
  color: var(--muted);
  cursor: pointer;
  transition: var(--t-fast);
  white-space: nowrap;
}

.news-filter-btn:hover {
  border-color: var(--brand);
  color: var(--brand);
}

.news-filter-btn.active {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}

@media (max-width: 600px) {
  .news-search-wrap { flex: 0 0 100%; }
  .news-search-row { flex-direction: column; align-items: stretch; }
}




/* Auth Modal Overlay */
.modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.6);
  z-index: 300;
  display: none;
  align-items: center;
  justify-content: center;
}
.auth-modal {
  background: var(--card);
  border-radius: var(--r-lg);
  width: min(860px, 95vw);
  max-height: 90vh;
  overflow: hidden;
  display: flex;
  box-shadow: var(--shadow-md);
}
.auth-modal-ad {
  width: 45%;
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.auth-modal-form {
  width: 55%;
  position: relative;
  padding: 32px;
  overflow-y: auto;
  max-height: 90vh;
}
.auth-modal-form .field{margin-top:3px}
@media (max-width: 768px) {
  .auth-modal { flex-direction: column; }
  .auth-modal-ad { width: 100%; height: 180px; min-height: 140px; }
  .auth-modal-form { width: 100%; padding: 24px 16px; }
}
/* Auth modal language switcher (top-right, left of close button) */
.auth-lang{position:absolute;top:14px;right:56px;z-index:11}
.auth-lang .lang-current{padding:4px 10px;font-size:12px;border-radius:6px}
[dir="rtl"] .auth-lang{right:auto;left:56px}


/* Hero search ad slot */
.hero-ad{margin:10px auto 0;width:100%}
.hero-ad .ad-slot{position:relative;overflow:hidden;border-radius:6px}
.hero-ad .ad-content{position:relative;width:100%;padding-top:20%;background:var(--card)}
.hero-ad .ad-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-ad .ad-label{position:absolute;top:8px;left:10px;font-size:11px;color:var(--muted);background:rgba(11,14,26,.75);padding:2px 6px;border-radius:3px;z-index:1}

/* ===== WCAG 无障碍增强 ===== */
/* I1: Skip-to-content link */
.skip-link{position:absolute;top:-40px;left:0;background:var(--brand);color:#fff;
  padding:8px 16px;border-radius:0 0 8px 0;z-index:99999;transition:top .2s;font-size:14px;font-weight:600}
.skip-link:focus{top:0}

/* I2: Focus-visible styles for keyboard navigation */
.nav a:focus-visible,
.side .menu a:focus-visible,
.tab:focus-visible,
.cat-nav-item:focus-visible,
.btn:focus-visible,
.tag:focus-visible,
.lang-current:focus-visible,
.lang-item:focus-visible,
.news-filter-btn:focus-visible,
.type-tag:focus-visible,
.cr-tab:focus-visible,
.cm-type-tab:focus-visible,
.tut-card:focus-visible,
.tool:focus-visible,
.card:focus-visible,
.action-btn:focus-visible,
.back-btn:focus-visible,
.back-link:focus-visible,
.auth-close:focus-visible,
.modal-x:focus-visible,
.tm-close:focus-visible,
.ct-tab:focus-visible,
.ae-top-btn:focus-visible,
.ae-save-btn:focus-visible,
.ae-pub-btn:focus-visible,
.ct-submit-btn:focus-visible,
.ct-new-btn:focus-visible,
.skip-link:focus-visible,
.conv:focus-visible,
.cc-kpi:focus-visible {
  outline: 2px solid var(--brand2);
  outline-offset: 2px;
}

/* P3-1: 全局 focus-visible 兜底 */
*:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}

/* S8: Custom confirm dialog */
.confirm-modal { max-width: 400px; }
.confirm-modal .confirm-msg { margin: 0; font-size: 15px; line-height: 1.6; color: var(--text); }
.confirm-modal .row2 { gap: 8px; }

/* S1: Improve touch target sizes (min 44px on mobile) */
.nav a{padding:10px 12px}
.tag{padding:8px 14px}
.tab{padding:9px 12px}
.lang-item{padding:9px 10px}
.cat-nav-item{padding:8px 14px}

/* P3-2: prefers-reduced-motion 支持 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* P3-3: 移动端触控目标最小44px */
@media (max-width: 768px) {
  .nav a, .tag, .tab, .lang-item, .cat-nav-item,
  .btn.sm, .ct-new-btn, .ct-draft-del, .action-btn,
  .tm-close, .auth-close, .modal-x {
    min-height: 44px;
    min-width: 44px;      /* #039 修复：只有 min-height 导致 32×44 椭圆 */
    display: inline-flex;
    align-items: center;
    justify-content: center; /* #039 修复：✕ 水平居中 */
    line-height: 1;          /* #039 修复：消除 line-height 26/30px 引起的垂直偏移 */
    padding: 0;
    flex: none;
  }
}
/* ==================== 会员体系 & 后台控制（v20260901b） ==================== */

/* 全站公告栏（后台"前台接管"设置后显示） */
.site-announcement {
  background: linear-gradient(90deg, var(--brand-soft), var(--brand2-soft));
  border-bottom: 1px solid var(--line);
  color: var(--text);
  text-align: center;
  padding: 8px 16px;
  font-size: var(--fs-sm);
  position: sticky;
  top: 0;
  z-index: 60;
}

/* 收银台 */
.pay-card { max-width: 430px; margin: 0 auto; text-align: center; }
.pay-amount { font-size: 44px; margin: 10px 0 2px; }
.pay-amount b { background: linear-gradient(90deg, var(--brand), var(--brand2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pay-meta { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; color: var(--muted); font-size: var(--fs-xs); margin: 12px 0 18px; }
.pay-methods { display: flex; gap: 10px; justify-content: center; margin-bottom: 16px; }
.pay-method { display: flex; align-items: center; gap: 8px; padding: 10px 18px; border: 1px solid var(--line); border-radius: var(--radius-md, 10px); cursor: pointer; font-size: var(--fs-base); }
.pay-method:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.pay-method input { accent-color: var(--brand); }
.pay-qr { background: #fff; border-radius: var(--radius-md, 10px); padding: 14px; display: inline-block; margin-bottom: 16px; }
.pay-success { background: var(--ok-soft); color: var(--ok); border: 1px solid var(--ok); border-radius: var(--radius-md, 10px); padding: 14px; margin: 14px 0; font-weight: 600; }

/* 教程访问级别徽章（列表卡片） */
.acc-badge { font-size: var(--fs-xs); padding: 2px 9px; border-radius: 99px; white-space: nowrap; }
.acc-free { background: var(--ok-soft); color: var(--ok); }
.acc-member { background: var(--brand-soft); color: var(--brand); }
.acc-pro { background: var(--warn-soft); color: var(--warn); }

/* 付费墙（教程详情） */
.paywall { text-align: center; padding: 40px 24px; margin: 20px 0; border: 1px dashed var(--line); }
.paywall-icon { font-size: 48px; margin-bottom: 8px; }
.paywall h2 { margin: 6px 0 8px; }
.paywall-perms { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; color: var(--muted); font-size: var(--fs-sm); margin: 16px 0; }
.paywall-perms b { color: var(--text); }
.paywall-cta { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* 会员卡片（会员中心个人主页顶部） */
.member-card { background: linear-gradient(135deg, var(--card2), var(--card)); border: 1px solid var(--line); border-radius: var(--radius-lg, 14px); padding: 18px 20px; margin-bottom: 18px; }
.member-card-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
.member-card-action { display: flex; gap: 10px; align-items: center; }
/* 升级 Pro 主按钮：靠容器右侧，占容器宽度 50%，放大突出 */
.mc-upgrade { flex: 0 0 50%; justify-content: flex-end; }
.mc-upgrade .btn { width: 100%; font-size: 17px; font-weight: 700; padding: 14px 20px; border-radius: 12px; white-space: nowrap; box-shadow: 0 4px 16px rgba(245, 158, 11, .28); }
/* #028 反馈留言弹窗：✕ 统一回弹窗右上方（与其他弹窗一致，位于 tm-head 流内），仅可点 ✕ 关闭 */
/* 课程报名弹窗（教程页自动弹出） */
.course-modal { width: min(560px, 94vw); }
.course-modal .course-img { width: 100%; border-radius: var(--radius-md, 10px); margin-bottom: 14px; display: block; }
.course-modal .course-content { color: var(--muted); font-size: 14px; line-height: 1.8; }
.course-modal .course-cta { min-width: 200px; font-size: 16px; font-weight: 700; padding: 13px 30px; border-radius: 12px; }
@media (max-width: 640px) {
  .mc-upgrade { flex: 0 0 50%; }
  .mc-upgrade .btn { font-size: 15px; padding: 12px 10px; }
}
.member-pill { display: inline-block; padding: 3px 14px; border-radius: 99px; font-size: var(--fs-sm); font-weight: 600; }
.pill-pending { background: var(--danger-soft); color: var(--danger); }
.pill-basic { background: var(--ok-soft); color: var(--ok); }
.pill-pro { background: linear-gradient(90deg, var(--warn), #f59e0b); color: #1a1200; }
.pill-super { background: linear-gradient(90deg, #7c5cff, #22d3ee); color: #fff; }
.member-perms { list-style: none; margin: 12px 0 0; padding: 0; display: flex; gap: 18px; flex-wrap: wrap; color: var(--muted); font-size: var(--fs-sm); }
.member-perms .on { color: var(--text); }
.member-notice { margin-top: 12px; background: var(--warn-soft); color: var(--warn); border-radius: var(--radius-md, 10px); padding: 8px 12px; font-size: var(--fs-sm); }

/* 移动端适配 */
@media (max-width: 640px) {
  .paywall-cta .btn, .member-card-action .btn { min-height: 44px; }
  .member-perms { gap: 10px; }
}

/* ==================== #028 弹窗统一规则：右上角✕ + 弹窗内语言切换 ==================== */
.modal { position: relative; }
/* 无 tm-head 的轻量弹窗（扫码/确认/社群等）：✕ 悬浮右上角 */
.modal > .tm-close { position: absolute; right: 14px; top: 14px; z-index: 2; }
.modal > .tm-close:hover { border-color: var(--brand); filter: brightness(1.1); }
/* 弹窗内语言切换器：tm-head 流内（✕ 左侧）；无 tm-head 时悬浮右上 */
.m-lang { flex: none; }
.modal .m-lang { position: absolute; right: 56px; top: 15px; z-index: 2; }
/* #032 弹窗语言切换器改主页同款（🌐 按钮 + 下拉列表），覆盖主页下拉的右对齐防溢出 */
.m-lang .lang-current { padding: 4px 9px; font-size: 13px; border-radius: 10px; }
.m-lang .lang-dropdown { right: 0; min-width: 150px; }
.m-lang .lang-item { padding: 8px 10px; }

/* ==================== #028 移动端适配增强 ==================== */
@media (max-width: 600px) {
  .modal-bg { padding: 12px; }
  .modal { padding: 18px 16px; width: 94vw; }
  .tool-modal { max-height: 90dvh; }
  .tool-modal .tm-head { padding: 14px 16px; gap: 10px; }
  .tool-modal .tm-name { font-size: 16px; }
  .tool-modal .tm-features { grid-template-columns: 1fr; }
  .tool-modal .tm-body { padding: 14px 16px 16px; }
  .modal .m-lang { right: 58px; top: 16px; }
  .m-lang .lang-current { max-width: 118px; }
  .m-lang .lang-dropdown { max-width: 60vw; }
  .hero { padding: 38px 0 22px; }
  .hero h1 { font-size: 27px; }
  .hero p { font-size: 15px; }
  .section h2 { font-size: 19px; }
  .search .btn { min-height: 42px; }
  .row2 { flex-direction: column; }
  .row2 .btn { width: 100%; }
}

/* ==================== #029 弹窗✕固定最右上角紧贴右边框 + 弹窗内切语言不关闭 ==================== */
/* 有头部弹窗（反馈留言/课程报名/工具详情/确认框）：✕ 绝对定位于卡片右上角，紧贴右边框 */
.tool-modal .tm-close { position: absolute; right: 12px; top: 12px; z-index: 3; }
.tool-modal .tm-head { padding-right: 62px; } /* 头部右侧预留 ✕ + 语言切换器空间，避免标题重叠 */
.tool-modal .tm-name { min-width: 0; }
.tool-modal .tm-close:hover { border-color: var(--brand); filter: brightness(1.1); }
/* 无头部轻量弹窗（扫码/账号设置/社群等）：✕ 与切换器同步收紧至边框 */
.modal > .tm-close { right: 12px; top: 12px; z-index: 3; }
.modal .m-lang { right: 54px; top: 12px; }

/* #031 首页渲染提速：视口外分类区块跳过布局/渲染（约 900+ 卡片 DOM），滚动到时才实际渲染 */
#hotTools { content-visibility: auto; contain-intrinsic-size: auto 240px; }
section[id^="cat-"] { content-visibility: auto; contain-intrinsic-size: auto 420px; }

/* ==================== #032 置顶logo可点击回主页 + 工具卡logo加载失败首字回退 ==================== */
a.logo { color: inherit; text-decoration: none; cursor: pointer; }
.tool .ic[data-fb]::after {
  content: attr(data-fb);
  font-weight: 700; font-size: 20px; color: var(--text);
  display: grid; place-items: center; width: 100%; height: 100%;
  background: var(--bg2); border-radius: inherit;
}

/* ==================== #033 外观显示：深色(默认)/浅色主题 ==================== */
/* 深色 = 现有配色（:root 默认值，不改动）；浅色 = 亮色方案，仅覆盖颜色类令牌 */
html[data-theme="light"]{
  /* 背景层级：纸白→淡雾蓝，保持同款空间层级感 */
  --bg:#f4f6fd; --bg2:#eaeefb; --card:#ffffff; --card2:#f3f6ff;
  /* 文字与线条：深藏青正文，确保 AA 对比度 */
  --text:#1c2244; --muted:#5c6689; --line:#dbe0f0; --border:#dbe0f0;
  /* 品牌色：紫罗兰微加深保对比，青色加深避免白底发虚 */
  --brand:#6d4aff; --brand2:#0d9dc9;
  /* 语义色加深适配浅底 */
  --ok:#0c9d6c; --warn:#b97a06; --danger:#e04848; --bad:#e04848;
  /* 半透明软色：降低不透明度防脏底 */
  --brand-soft:rgba(109,74,255,.10); --brand2-soft:rgba(13,157,201,.10);
  --ok-soft:rgba(12,157,108,.12); --warn-soft:rgba(185,122,6,.12); --danger-soft:rgba(224,72,72,.12);
  /* 资讯分类色同步加深 */
  --cat-models:#d97706; --cat-products:#0c9d6c; --cat-industry:#0d9dc9;
  --cat-papers:#e04848; --cat-tips:#6d4aff;
  /* 阴影：黑改藏青低透明度，浅底不发灰 */
  --shadow-sm:0 2px 8px rgba(28,34,68,.08);
  --shadow-md:0 8px 30px rgba(28,34,68,.12);
  --shadow:0 8px 30px rgba(28,34,68,.12);
  --shadow-brand:0 6px 18px rgba(109,74,255,.22);
  --shadow-glow:0 0 0 3px rgba(109,74,255,.12);
}
/* 页面光晕：暗底紫晕改浅底淡晕 */
html[data-theme="light"] body{background:radial-gradient(1200px 600px at 70% -10%,rgba(109,74,255,.10),transparent),var(--bg)}
/* 置顶栏：暗玻璃改白玻璃（全站统一 header.top，#038 起无第二种头部） */
html[data-theme="light"] header.top{background:rgba(255,255,255,.86)}
/* logo 已统一为上一版深色方案颜色（亮青前缀+紫→亮青渐变，见顶部 .logo 规则），深浅主题一致，无需主题覆盖 */
/* #061 工具卡浅色优化：白卡浮起+logo底衬+hover品牌晕（暗色主题不受影响） */
html[data-theme="light"] .tool{box-shadow:var(--shadow-sm);border-color:#e3e7f5}
html[data-theme="light"] .tool:hover{box-shadow:var(--shadow-md);border-color:rgba(109,74,255,.40)}
html[data-theme="light"] .tool .ic{background:linear-gradient(135deg,var(--brand-soft),var(--brand2-soft));border:1px solid rgba(109,74,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
html[data-theme="light"] .tool .cat{background:var(--brand2-soft)}
html[data-theme="light"] .tool h3{letter-spacing:.1px}
/* 统计数白字在白卡上不可见，改正文色 */
html[data-theme="light"] .stat b{color:var(--text)}
/* 弹窗遮罩浅色下减淡 */
html[data-theme="light"] .modal-bg{background:rgba(28,34,68,.45)}
/* 主题切换器当前项高亮（复用 lang-item 体系） */
#themeDropdown .lang-item.active{background:var(--brand-soft)}
#themeDropdown .lang-item.active::after{content:'✓';margin-left:auto;font-size:12px}
/* 移动端：切换器与语言切换器同尺寸收紧 */
@media (max-width: 600px) {
  #themeWrap .lang-current { padding: 4px 9px; font-size: 13px; border-radius: 10px; max-width: 92px; }
}

/* ==================== #035 移动端分辨率自动适配增强 ==================== */
/* 检测机制：CSS 媒体查询(主力) + app.js matchMedia 运行时检测(写 html[data-viewport])
   断点体系：≤480px small / ≤768px mobile / >768px desktop */

/* 刘海屏/手势条安全区（env 在无刘海设备上取 0，无副作用） */
body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
.modal-bg { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }

/* iOS 聚焦自动放大防护：输入类控件字号必须 ≥16px（<16px 时 Safari 会强制缩放页面） */
@media (max-width: 768px) {
  .input { font-size: 16px; height: 38px; }
  textarea.input { padding: 9px 12px; }
  .search .input { height: 40px; }
  .code-row .input { height: 38px; }
  /* 顶栏右侧按钮组整体收紧 */
  #langWrap .lang-current, #themeWrap .lang-current { padding: 4px 8px; font-size: 12px; }
  .userbox .btn { padding: 0 12px; }
}

/* 小屏手机（≤480px）：登录弹窗全屏化 + 布局压缩 */
@media (max-width: 480px) {
  /* 顶栏 */
  .top .row { gap: 6px; }
  #langWrap .lang-current { max-width: 72px; }
  #themeWrap .lang-current { max-width: 82px; }
  /* 登录/注册弹窗：占满全屏、广告位压扁、表单最大化（登录路径核心体验） */
  .auth-modal { width: 100vw; height: 100vh; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .auth-modal-ad { height: 110px; min-height: 90px; flex: 0 0 auto; }
  .auth-modal-form { padding: 20px 14px calc(20px + env(safe-area-inset-bottom)); }
  /* 登录页左右分栏同策略 */
  .auth-split-left { flex: 0 0 120px; }
  .auth-split-right { padding: 24px 14px; }
  /* 首页搜索纵排，按钮全宽易点 */
  .search { flex-direction: column; }
  .search .btn { height: 42px; }
  /* 工具网格两列起步，不浪费小屏空间 */
  .grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
  .tool { padding: 14px 12px; }
  .tool p { min-height: 0; }
  /* hero 再压缩 */
  .hero { padding: 30px 0 18px; }
  .hero h1 { font-size: 23px; }
  .hero p { font-size: 14px; }
}

/* 超小屏（≤360px）：字号与间距保底 */
@media (max-width: 360px) {
  .hero h1 { font-size: 21px; }
  .nav a { padding: 6px 6px; font-size: 11px; }
  .modal { width: 96vw; }
}

/* ==================== #036 浅色主题：点选按钮文字改黑 ====================
 * 深色下「白字+card2底/品牌实底」的点选态，在浅色下白字不可见或不符合预期；
 * 统一改为：品牌软底 + 品牌描边 + 正文黑（--text 深藏青，视觉接近纯黑） */
html[data-theme="light"] .tag.active,
html[data-theme="light"] .tag:hover,
html[data-theme="light"] .tab.active,
html[data-theme="light"] .type-tag.active,
html[data-theme="light"] .cr-tab.active,
html[data-theme="light"] .cm-type-tab.active,
html[data-theme="light"] .cat-nav-item:hover,
html[data-theme="light"] .cat-nav-item.active {
  background: var(--brand-soft);
  color: var(--text);
  border-color: var(--brand);
}
html[data-theme="light"] .side{background:rgba(228,234,246,.72)}
html[data-theme="light"] .side .menu a:hover,
html[data-theme="light"] .side .menu a.active {
  background: var(--brand-soft);
  color: var(--text);
}
/* 会员中心「我的二维码」等白底卡内的黑字确认无需处理；主按钮（登录/提交等实心紫）保持白字以保对比度 */

/* ==================== #039 统一回到顶部悬浮按钮 ====================
 * 由 server.js FOOT 统一注入（所有前台页面自动获得，未来新页面使用 FOOT 即自带标准）
 * 滚动超过 400px 出现，app.js 负责显隐与平滑滚动；文案 title 由 app.js 按 16 语词典回填 */
.back-top-fab{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));
  width:44px;height:44px;border-radius:50%;background:var(--brand);color:#fff;border:none;
  font-size:20px;cursor:pointer;z-index:90;padding:0;line-height:1;
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .2s,transform .2s,visibility .2s,filter .15s;
  box-shadow:0 6px 18px rgba(0,0,0,.28)}
.back-top-fab.show{opacity:1;visibility:visible;transform:none}
.back-top-fab:hover{filter:brightness(1.15)}
.back-top-fab:focus-visible{outline:2px solid var(--brand2);outline-offset:2px}
@media (max-width:768px){.back-top-fab{right:14px;bottom:calc(14px + env(safe-area-inset-bottom))}}

/* ==================== 手机端左右边距统一标准 = 20px（以 AI 资讯页为准，2026-09-09 指定） ==================== */
/* 根因：.hero/.section 及各媒体块内的简写 padding 与 .wrap 同优先级，且多数排在 .wrap 之后，
   把横向内边距覆盖为 0，导致首页/教程页手机端内容全贴边而资讯页正常（板块在 main.wrap 内无覆盖）。
   本块置于文件最末（最终裁决位）：任何带 .wrap 的容器（含未来新增页面）在手机端一律保持左右 20px。
   只覆盖左右，不影响各断点的纵向间距压缩。 */
@media (max-width: 768px) {
  .wrap { padding-left: 20px; padding-right: 20px; }
}

/* ===== #050 教程四级内容体系 ===== */
.diff-super{background:rgba(139,92,246,.16);color:#a78bfa;border:1px solid #a78bfa;font-size:12px;padding:2px 8px;border-radius:4px;font-weight:600}
.pill.super{background:rgba(139,92,246,.16);color:#a78bfa}
.tut-mods{display:inline-flex;gap:4px;margin-left:6px;flex-wrap:wrap;vertical-align:middle}
.tut-mods .tag-sm{white-space:nowrap}
.tut-qa{margin:20px 0}
.tut-qa .qa-item{border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin:8px 0;background:var(--bg2)}
.tut-qa .qa-item summary{cursor:pointer;font-weight:600;color:var(--text)}
.tut-qa .qa-a{margin-top:8px;color:var(--text);opacity:.85;line-height:1.7}
.tut-modcard{border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin:16px 0;background:var(--bg2)}
.tut-modcard h2{font-size:17px;margin:0 0 8px}
.tut-modcard p{margin:6px 0;line-height:1.7}
.tut-modcard.live{border-color:#ef4444}
.article-body{margin:20px 0;line-height:1.8;overflow-wrap:break-word}

/* ===== #051-3b 教程图片画廊 ===== */
.tut-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:14px 0}
.tut-gallery .tut-gitem{display:block;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}
.tut-gallery .tut-gitem img{width:100%;height:160px;object-fit:cover;display:block;transition:transform .25s}
.tut-gallery .tut-gitem:hover img{transform:scale(1.05)}