/* ══════════════════════════════════════════════════
   pages.css — 页面层：登录页、总览页
   ══════════════════════════════════════════════════ */

/* ════════════════════════════════
   居中内容容器
   ════════════════════════════════ */
.page-wrap { max-width: 920px; margin: 0 auto; }

/* ════════════════════════════════
   登录页
   ════════════════════════════════ */
body.login-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  background: var(--sidebar-bg);
  overflow: auto;
}
.lp-card {
  background: var(--white);
  border-radius: 10px;
  padding: 40px 44px;
  width: 380px;
  box-shadow: 0 8px 32px var(--black-30);
  box-sizing: border-box;
}
.lp-logo { text-align: center; margin-bottom: 28px; }
.lp-logo-text { font-size: 22px; font-weight: 800; color: var(--text); }
.lp-logo-sub  { font-size: 12px; color: var(--text-muted); margin-top: 4px; }
.lp-field { margin-bottom: 16px; }
.lp-field label {
  display: block; font-size: 12px; font-weight: 600;
  color: var(--text-muted); margin-bottom: 6px;
}
.lp-field input {
  width: 100%; padding: 10px 12px; box-sizing: border-box;
  border: 1px solid var(--border); border-radius: 8px;
  font-size: 14px; color: var(--text); outline: none;
  background: var(--white); transition: border-color .15s;
}
.lp-field input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-15);
}
.lp-remember {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 22px; font-size: 12px; color: var(--text-muted);
  cursor: pointer; user-select: none;
}
.lp-remember input { width: 14px; height: 14px; cursor: pointer; }
.lp-submit {
  width: 100%; padding: 11px; border-radius: 8px;
  background: var(--accent); color: var(--white); border: none;
  font-size: 14px; font-weight: 700; cursor: pointer;
  transition: background .15s;
}
.lp-submit:hover    { background: var(--accent-hover); }
.lp-submit:disabled { opacity: .6; cursor: default; }
.lp-err {
  font-size: 12px; color: var(--red);
  text-align: center; margin-top: 12px; min-height: 18px;
}
/* 手机端自适应：卡片占满屏幕宽度并留白边 */
@media (max-width: 480px) {
  .lp-card { width: auto; margin: 16px; padding: 28px 22px; }
}

/* ════════════════════════════════
   总览页
   ════════════════════════════════ */
.overview-page { flex: 1; overflow-y: auto; padding: 24px; }
.stat-card { background: var(--white); border-radius: 8px; padding: 20px; border: 1px solid var(--border); }
.stat-label { font-size: 12px; color: var(--text-muted); margin-bottom: 8px; }
.stat-value { font-size: 28px; font-weight: 700; }
.stat-sub   { font-size: 11px; color: var(--text-muted); margin-top: 4px; }

/* ── 首页总览（驾驶舱）：今日待办看板 ──
   五列（库存/翻译/配图/发布/SLUG），每列浅底托盘，票卡白色带左色条。
   .ov-kpi 磁贴样式保留给 sites.js statCard 使用 */
.ov-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 12px; align-items: stretch; }
@media (max-width: 1500px) { .ov-board { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px)  { .ov-board { grid-template-columns: 1fr; } }
.ov-col { background: #f7f8fa; border-radius: 10px; padding: 10px; }
.ov-col-head { display: flex; align-items: center; gap: 6px; padding: 2px 4px 10px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.ov-pill { font-size: 11px; font-weight: 700; min-width: 20px; text-align: center; padding: 1px 8px; border-radius: 11px; }
.ov-pill.red { background: #e05c5c; color: #fff; }
.ov-pill.orange { background: #f0c36d; color: #7a4d00; }
.ov-pill.yellow { background: #e5e6eb; color: #4e5969; }
.ov-task { position: relative; background: var(--white); border-radius: 8px; padding: 10px 12px 10px 15px; margin-bottom: 8px; box-shadow: 0 1px 2px rgba(16,24,40,.05); }
.ov-task:last-child { margin-bottom: 0; }
.ov-task::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; border-radius: 3px 0 0 3px; background: #e05c5c; }
.ov-task.warn::before { background: #e08a00; }
.ov-task.minor::before { background: #d4a017; }
/* 站点名等待办卡片里的链接始终用正文色，不随浏览器默认链接色（红/紫已访问）变色 */
.ov-task a { color: var(--text); text-decoration: none; }
.ov-task a:visited { color: var(--text); }
.ov-task a:hover { color: var(--accent); }
.ov-task-desc { font-size: 12px; color: #4e5969; line-height: 1.55; margin: 6px 0 10px; }
.ov-empty { border: 1px dashed #dfe2e8; border-radius: 8px; padding: 24px 10px; text-align: center; color: #3a9e5c; font-size: 12px; }
.ov-empty-err { color: var(--orange-text); }
.ov-board-title-row { margin: 16px 2px 0; }
.ov-board-title { font-size: 15px; font-weight: 700; }
.ov-cat { margin-left: auto; font-size: 10px; color: #a9aeb8; }
.ov-prev { font-size: 12px; color: #a9aeb8; cursor: pointer; }
.ov-prev:hover { color: var(--accent); }
/* 「发布」列：操作流卡片（按紧急度一排一个动作） */
.ov-pw-when { font-weight: 700; font-size: 12px; }
.ov-task.crit .ov-pw-when { color: #e05c5c; }
.ov-task.warn .ov-pw-when { color: #e08a00; }
.ov-task.minor .ov-pw-when { color: #b8860b; }
.ov-pw-later { font-size: 12px; color: #a9aeb8; padding: 6px 4px 0; }
.ov-pw-later b { color: #4e5969; }
/* 「发布」列分组大标：今天要发 / 错过发布 / 已发布 / 明天要发 / 3天内要发 */
.ov-pw-group { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: #4e5969; padding: 10px 4px 6px; }
.ov-pw-group:first-child { padding-top: 2px; }
.ov-pw-group::after { content: ''; flex: 1; height: 1px; background: #e5e6eb; }
.ov-pw-group.crit { color: #e05c5c; }
.ov-pw-group.warn { color: #e08a00; }
.ov-link { color: var(--accent); cursor: pointer; white-space: nowrap; font-size: 12px; }
.ov-loading { padding: 20px 0; }

/* 手动备忘：今日待办看板下方的自由文本框（api/notes.php 存 app_settings） */
.ov-note { background: #f7f8fa; border-radius: 10px; padding: 10px 12px 12px; margin-top: 12px; }
.ov-note-head { display: flex; align-items: center; gap: 8px; padding: 2px 2px 8px; }
.ov-note-text { width: 100%; box-sizing: border-box; resize: vertical; min-height: 110px; border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; font-size: 13px; line-height: 1.6; font-family: inherit; background: var(--white); color: var(--text); }
.ov-note-text:focus { outline: none; border-color: var(--accent); }

/* 续费顶条 + 明细区（替代内联样式） */
.ov-renew-bar { margin-top: 14px; padding: 12px 18px; }
.ov-renew-bar-label { font-weight: 700; }
.ov-renew-bar-item { cursor: pointer; user-select: none; }
.ov-renew-bar-item:hover b { text-decoration: underline; }
.ov-renew-body { margin-top: 12px; }
.ov-renew-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.ov-renew-card-head { display: flex; align-items: center; gap: 8px; }
.ov-renew-note { padding: 8px 0; }
.ov-line { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-line-wrap { flex: 1; min-width: 0; }
.ov-mt-14 { margin-top: 14px; }
.ov-mb-16 { margin-bottom: 16px; }
.ov-modal-sec { font-weight: 700; margin-bottom: 6px; }
.ov-kpi { background: var(--white); border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; min-width: 0; }
.ov-kpi .stat-label { font-size: 11px; margin-bottom: 2px; white-space: nowrap; }
.ov-kpi .stat-value { font-size: 20px; line-height: 1.3; }
.ov-kpi .stat-sub   { margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 提醒区块：头（标题 + 统计 + 右侧操作）收进卡片顶部，替代散落在 JS 里的内联样式 */
.ov-sec-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.ov-alert-row { display: flex; align-items: baseline; gap: 8px; padding: 6px 0; font-size: 12px; flex-wrap: wrap; line-height: 1.6; }
.ov-alert-row + .ov-alert-row { border-top: 1px solid var(--border-light); }
.ov-alert-icon { flex-shrink: 0; }

.ov-stock-title { font-size: 16px; font-weight: 700; margin: 0; }
.ov-feed-row { display: flex; align-items: baseline; gap: 8px; padding: 5px 0; font-size: 12px; border-bottom: 1px solid var(--border-light); }
.ov-feed-row:last-child { border-bottom: none; }

/* ── 系统弹窗·服务器 Tab：商家账户分组（账户 1 ←→ N 服务器，预设同款组头）── */
.sys-srv-acc-head { cursor: pointer; }
.sys-srv-acc-head.active { color: var(--accent); }
.sys-srv-node { margin-left: 18px; }
.sys-srv-pa-low { color: #e05c5c; font-weight: 700; }

/* ── 分组列表统一样式：组头下的条目缩进，体现层级（与服务器 Tab 一致）── */
.preset-drag-group .aim-model-item,
.ctpl-drag-group .aim-model-item { margin-left: 18px; }

.site-cards { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.site-card {
  background: var(--white); border-radius: 8px; padding: 20px;
  border: 1px solid var(--border); cursor: pointer; transition: all .18s;
}
.site-card:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 16px var(--accent-light);
}
.site-card-header { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.site-card-dot    { width: 9px; height: 9px; border-radius: 50%; }
.site-card-name   { font-weight: 700; font-size: 14px; }
.site-card-url    { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
.site-card-stats  { display: flex; gap: 20px; }
.site-stat        { text-align: center; }
.site-stat-val    { font-size: 18px; font-weight: 700; color: var(--accent); }
.site-stat-label  { font-size: 10px; color: var(--text-muted); margin-top: 1px; }
.site-card-footer {
  margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
}

/* ════════════════════════════════
   发布排班页 schedule.php
   ════════════════════════════════ */
.sched-site-select { border: 1px solid var(--border); border-radius: 6px; padding: 5px 10px; font-size: 13px; background: var(--white); min-width: 200px; max-width: 300px; color: var(--text); outline: none; }
.sched-site-select:focus { border-color: var(--accent); }
.sched-stats       { display: flex; align-items: center; gap: 16px; font-size: 12px; color: var(--text-muted); flex-shrink: 0; }
.sched-stats strong { color: var(--text); font-weight: 600; }
.sched-main        { max-width: 1100px; margin: 0 auto; padding: 24px 20px 80px; }
.sched-empty       { text-align: center; padding: 80px 20px; color: var(--text-faint); font-size: 14px; }
.sched-empty-icon  { font-size: 40px; margin-bottom: 12px; }
.sched-loading     { text-align: center; padding: 60px; color: var(--text-faint); font-size: 14px; }
.sched-calendar    { display: flex; flex-direction: column; gap: 3px; }
.sched-day         { background: var(--white); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.sched-today-badge { font-size: 10px; background: var(--accent-light); color: var(--accent); border-radius: 4px; padding: 1px 6px; font-weight: 600; }
.sched-done-badge  { font-size: 10px; background: var(--green-bg); color: var(--green-dark); border-radius: 4px; padding: 1px 6px; font-weight: 600; }
.sched-art-list    { display: flex; flex-direction: column; }
.sched-art-row     { display: flex; align-items: center; gap: 10px; padding: 7px 16px; border-bottom: 1px solid var(--border-light); font-size: 13px; }
.sched-art-row:last-child { border-bottom: none; }
.sched-art-row.is-done    { opacity: .5; }
.sched-art-time    { font-size: 11px; color: var(--text-faint); min-width: 36px; flex-shrink: 0; }
.sched-art-cat     { font-size: 11px; padding: 2px 7px; border-radius: 4px; flex-shrink: 0; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sched-art-title   { flex: 1; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.sched-art-tick    { font-size: 11px; color: var(--green-text); flex-shrink: 0; }
.sched-load-more   { text-align: center; margin-top: 16px; }
.sched-toast       { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%); background: var(--gray-dark); color: var(--white); font-size: 13px; padding: 10px 20px; border-radius: 8px; z-index: 9999; opacity: 0; transition: opacity .2s; pointer-events: none; white-space: nowrap; }
.sched-toast.show  { opacity: 1; }

/* ════════════════════════════════
   行业洞察 / 建站方向 / 站点总览 嵌入面板公共样式
   ════════════════════════════════ */
.embedded-page { position:absolute; inset:0; overflow-y:auto; display:flex; flex-direction:column; background:var(--white,#fff); }
.embedded-page.hidden { display:none; }
.emb-topbar { display:flex; align-items:center; gap:8px; padding:0 12px; height:44px; border-bottom:1px solid var(--border-light,#eee); flex-shrink:0; background:var(--white,#fff); }
.emb-topbar-title { font-size:13px; font-weight:600; color:var(--text,#222); }
.emb-filter-row { display:flex; align-items:center; gap:8px; padding:6px 12px; border-bottom:1px solid var(--border-light,#eee); background:#fafafa; flex-shrink:0; overflow:hidden; }
.emb-filter-label { font-size:12px; color:var(--text-hint,#999); white-space:nowrap; flex-shrink:0; min-width:28px; }
/* 筛选行内控件对齐：去掉 pool-list 自带的上边距，按钮尺寸与药丸拉平 */
.emb-filter-row .scfg-pool-list { margin-top:0; }
.emb-filter-row .btn, .emb-filter-row .btn-sm { padding:4px 10px; font-size:12px; border-radius:4px; line-height:inherit; }
.emb-ind-panel { display:none; padding:8px 12px 10px; border-bottom:1px solid var(--border-light,#eee); background:#fafafa; flex-shrink:0; }
.emb-ind-panel.open { display:block; }
.emb-ind-selected-tag { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:4px; border:1px solid var(--accent,#4f6ef7); color:var(--accent,#4f6ef7); font-size:12px; cursor:pointer; }
.emb-scroll { flex:1; overflow-y:auto; }
.emb-topbar .btn-sm:disabled { opacity:.35; cursor:not-allowed; pointer-events:none; }
.sto-drop-zone { display:flex; align-items:center; justify-content:center; gap:6px; margin:8px 12px; padding:10px; border:2px dashed var(--border); border-radius:var(--radius); color:var(--text-muted); font-size:12px; background:var(--bg); transition:all .12s; }
.sto-drop-zone.hidden { display:none; }
.sto-drop-zone.drag-over { border-color:var(--accent); background:var(--accent-light); color:var(--accent); }

/* ════════════════════════════════
   国家库：可排序表格
   ════════════════════════════════ */
#cty-table thead th { position:sticky; top:0; z-index:1; cursor:pointer; user-select:none; white-space:nowrap; }
#cty-table thead th:hover { color:var(--text); }
#cty-table .cty-sort-ind { font-size:9px; margin-left:2px; color:var(--accent); }
#cty-table td { vertical-align:middle; }
#cty-table .cty-pop { white-space:nowrap; min-width:64px; }
/* 国家列：国名较长（马来西亚/澳大利亚等）时让列加宽，徽章不换行 */
#cty-table td:first-child { white-space:nowrap; }

/* 状态 tag 统一柔和风格：定位/竞争/域名全部一致（系统的 badge-green/yellow 是实底+白字，
   与 badge-red/orange 的浅底+彩字混用导致视觉乱） */
.cty-badge { display:inline-block; font-size:10px; padding:2px 8px; border-radius:999px; font-weight:600; white-space:nowrap; }
.cty-badge.green  { background:var(--green-bg);  color:var(--green-dark); }
.cty-badge.yellow { background:var(--yellow-light); color:var(--yellow-dark); }
.cty-badge.orange { background:var(--orange-bg); color:var(--orange-text); }
.cty-badge.red    { background:var(--red-bg);    color:var(--red); }
.cty-badge.gray   { background:var(--gray-light); color:var(--gray-darker); }

/* ════════════════════════════════
   insights / directions 面板专属
   ════════════════════════════════ */
.ins-fit-badge { font-weight:700; }
.ins-content { font-size:12px; color:var(--text-muted,#666); line-height:1.7; }
.ins-content p { margin:0 0 6px; }
.emb-ind-selected-tag { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:4px; border:1px solid var(--accent,#4f6ef7); color:var(--accent,#4f6ef7); font-size:12px; cursor:pointer; }

/* ════════════════════════════════
   知识网络面板专属 (.netp-*)
   ════════════════════════════════ */
/* 正文字段定高：文字为主、图片为辅——各字段固定行高截断，
   上方文字高度恒定，下面三张品牌图才能在各卡同一水平线上 */
.netp-field { display: flex; align-items: flex-start; gap: 8px; margin-top: 6px; min-height: 20px; }
.netp-field > .text-11 { flex-shrink: 0; width: 56px; padding-top: 1px; }
.netp-val { font-size: 13px; line-height: 1.5; flex: 1; min-width: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; }
.netp-val.mono { font-family: monospace; font-size: 12px; -webkit-line-clamp: 1; }
.netp-val.is-empty { display: block; -webkit-line-clamp: unset; font-size: 12px; color: var(--text-faint); line-height: 39px; }
/* 品牌图块：图片行 + 生图指令，块高恒定、各卡对齐 */
.netp-img-block { margin-top: 6px; }
.netp-img-row { display: flex; align-items: center; gap: 6px; }
.netp-img-slot { width: 40px; height: 40px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  background: var(--bg); border: 1px solid var(--border-light); border-radius: 4px; overflow: hidden; }
.netp-img-slot img { max-width: 100%; max-height: 40px; object-fit: contain; cursor: pointer; display: block; }
.netp-img-name { font-size: 11px; font-weight: 600; color: var(--text-muted); flex-shrink: 0; width: 44px; }
.netp-img-btns { display: flex; gap: 4px; flex-wrap: nowrap; overflow: hidden; }
.netp-img-btns .btn-sm { padding: 2px 6px; font-size: 11px; white-space: nowrap; }
/* 生图指令：中文优先，固定 3 行截断（空指令同高占位），全文 title 悬停看 */
.netp-prompt { margin-top: 3px; font-size: 11px; color: var(--text-muted); line-height: 1.5; height: 49px;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; }
.netp-prompt.is-empty { display: block; -webkit-line-clamp: unset; color: var(--text-faint); line-height: 49px; }

/* ════════════════════════════════
   站点总览面板专属 (.st-*)
   ════════════════════════════════ */
.st-card { border-bottom:1px solid var(--border-light); padding:12px; gap:6px; }
.st-card:hover { background:var(--bg); }
.st-card.starred { border-color:var(--yellow); background:var(--yellow-bg); }
.st-card.starred:hover { background:var(--yellow-lighter); }
.st-favicon { width:16px; height:16px; border-radius:3px; object-fit:cover; flex-shrink:0; }
.st-card-name { font-size:13px; font-weight:600; color:var(--text); line-height:1.4; flex:1; min-width:0; }
a.st-card-name-link { font-size:13px; font-weight:600; color:var(--text); line-height:1.4; flex:0 1 auto; min-width:0; text-decoration:none; cursor:pointer; }
a.st-card-name-link:hover { color:var(--accent); text-decoration:none; }
.st-card-url  { font-size:11px; color:var(--text-muted); line-height:1.4; word-break:break-all; }
a.st-card-url { color:var(--text-muted); text-decoration:none; }
a.st-card-url:hover { text-decoration:none; }

/* 分类色块（10 色循环） */
.cat-c0 { background: var(--blue-bg);    color: var(--accent); }
.cat-c1 { background: var(--green-bg);   color: var(--green-dark); }
.cat-c2 { background: var(--orange-bg);  color: var(--orange-text); }
.cat-c3 { background: var(--purple-bg);  color: var(--purple-text); }
.cat-c4 { background: var(--red-bg);     color: var(--red-hover); }
.cat-c5 { background: var(--sky-bg);     color: var(--cyan-dark); }
.cat-c6 { background: var(--yellow-bg);  color: var(--orange-dark); }
.cat-c7 { background: var(--gray-bg);    color: var(--slate); }
.cat-c8 { background: var(--purple-light); color: var(--indigo); }
.cat-c9 { background: var(--green-pale-bg); color: var(--green-pale-text); }


/* ── 昨日阅读面板（首页仪表盘，样式对齐 ov-col/ov-task） ── */
.tfc-reading-board { grid-template-columns: repeat(auto-fill, minmax(340px, 480px)); }
.tfc-reading-row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  background: var(--white); border-radius: 8px; padding: 9px 12px; margin-bottom: 8px;
  box-shadow: 0 1px 2px rgba(16,24,40,.05); cursor: pointer;
}
.tfc-reading-row:last-child { margin-bottom: 0; }
.tfc-reading-row:hover b { color: var(--accent); }
.tfc-reading-name { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tfc-reading-num { font-weight: 600; color: #4a7dff; flex-shrink: 0; }
.tfc-reading-num.zero { color: var(--text-muted, #999); font-weight: 400; }
.tfc-reading-rum { font-size: 11px; color: var(--text-muted, #999); flex-shrink: 0; }
/* 昨日阅读列「未开启」小标签（点击直接开启）；.done = 本次会话刚开启（明日出数据） */
.tfc-reading-off { font-size: 11px; color: #b4761a; background: #fdf3e0; border-radius: 4px; padding: 1px 6px; flex-shrink: 0; cursor: pointer; }
.tfc-reading-off:hover { background: #f9e6c2; }
.tfc-reading-off.done { color: #2b7a3d; background: #e8f5e9; cursor: default; }
.tfc-reading-off.done:hover { background: #e8f5e9; }

/* ── 今日待办看板：列固定高度 + 翻页（.ov-pager-*） ──
   列 = 列头 + 可滚动内容区 + 底部翻页条（flex 列，翻页条始终钉在右下角） */
.ov-col { display: flex; flex-direction: column; }
/* 固定 420px 不伸缩：flex:1 的 flex-basis:0% 会顶掉 height，导致列高随内容（翻页）变化 */
.ov-col-body { height: 420px; flex: none; overflow-y: auto; }
.ov-pager { padding-top: 8px; flex-shrink: 0; }

/* ── 目录面板：版本 J 卡片网格 ── */
#page-site-directory .lp-list { padding: 0; }
/* 网格容器（即 #sdir-list 本体，保留 .lp-list 的滚动/flex 约束） */
#page-site-directory #sdir-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; padding: 16px; }
#sdir-list > .lp-empty { grid-column: 1 / -1; }
.sdir-card { position: relative; border: 1px solid var(--border); border-radius: 10px; padding: 14px; background: var(--white); cursor: default; }
.sdir-card:hover { border-color: #d8dce0; box-shadow: 0 2px 8px rgba(0,0,0,.05); }
/* 收藏星：绝对定位卡片右上角 */
.sdir-fav-btn { position: absolute; top: 8px; right: 8px; z-index: 1; background: none; border: none; cursor: pointer; color: var(--text-tertiary, #999); font-size: 14px; line-height: 1; padding: 2px; }
.sdir-fav-btn:hover, .sdir-fav-btn.active { color: #f5b942; }
/* 上排：国旗 + 站名/域名（唯一站名链接），padding-right 防长站名碰 ⭐ */
.sdir-main { display: flex; align-items: center; gap: 8px; min-width: 0; padding-right: 22px; text-decoration: none; }
.sdir-icon { width: 28px; height: 28px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.sdir-icon-fallback { width: 28px; height: 28px; flex-shrink: 0; text-align: center; line-height: 28px; }
.sdir-text { display: block; flex: 1 1 auto; min-width: 0; text-decoration: none; }
.sdir-name { font-size: 0.85rem; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sdir-main:hover .sdir-name { color: var(--accent); }
.sdir-host { font-size: 0.7rem; color: var(--text-tertiary, #999); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 下排：#id 靠左，文章图标靠右（margin-right:auto 顶开） */
.sdir-actions { display: flex; align-items: center; gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border-light); }
.sdir-id { flex: 0 0 auto; width: auto; text-align: left; margin-right: auto; font-size: 0.65rem; color: var(--text-tertiary, #999); font-family: 'SF Mono', Consolas, monospace; cursor: pointer; user-select: none; }
.sdir-link { display: inline-flex; align-items: center; justify-content: center; width: 18px; line-height: 0; }
/* 收录抽查行：G收录 / B收录，整站 + 今天·昨天·前天 槽位（图标+小字标签） */
.sdir-probe { display: flex; align-items: flex-start; gap: 14px; margin-top: 12px; }
.sdir-probe-label { flex: 0 0 auto; font-size: 10px; color: var(--text-tertiary, #999); line-height: 20px; }
.sdir-probe-slot { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; text-decoration: none; line-height: 0; }
.sdir-probe-slot svg { width: 14px; height: 14px; }
.sdir-probe-slot i { font-style: normal; font-size: 10px; color: var(--text-tertiary, #999); line-height: 1.3; }
.sdir-probe-slot.is-empty u { text-decoration: none; font-size: 12px; color: #c9cdd4; line-height: 14px; }
/* 面板顶栏：tab 条占满剩余宽度，搜索框加宽 */
#page-site-directory .emb-topbar { gap: 10px; }
#page-site-directory .filter-bar { flex: 1; min-width: 0; }
#page-site-directory #sdir-search-input { width: 220px; flex: none; background: var(--bg); }