/* ============================================================
 * dsh.lewz.cn 同款详情页样式 · onetwoone09 深色控制台风格
 * 配合 dsh_detail.php 使用 · 排版结构与线上一致, 配色沿用主题
 * ============================================================ */

.dsh-page {
    max-width: 1240px;
    margin: 0 auto;
    padding: 18px 20px 64px;
    color: var(--txt);
}

/* ── 图标 ─────────────────────────────────────────────── */
.dsh-ic {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    flex: none;
}
.dsh-ic-fill {
    fill: currentColor;
    stroke: none;
}
.text-warning { color: var(--gold); }
.text-danger  { color: var(--red); }
.text-primary { color: var(--blue); }
.text-muted   { color: var(--gray); }
.dsh-fw-bold  { font-weight: 700; }
.dsh-font-mono { font-family: var(--mono); }

/* ── 面包屑 ───────────────────────────────────────────── */
.dsh-breadcrumb-wrap {
    margin-bottom: 16px;
}
.dsh-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 13px;
}
.dsh-breadcrumb > a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--dim2);
}
.dsh-breadcrumb > a:hover { color: var(--green); }
.dsh-bc-sep { color: var(--line); }
.dsh-bc-current { color: var(--txt); font-weight: 600; }

/* ── 徽章 ─────────────────────────────────────────────── */
.dsh-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none;
    white-space: nowrap;
}
.dsh-badge-category {
    background: linear-gradient(135deg, #5aa9ff, #8b5cf6);
    color: #fff;
    box-shadow: 0 2px 10px rgba(90, 169, 255, .25);
}
.dsh-badge-category:hover { color: #fff; filter: brightness(1.1); }
.dsh-badge-active {
    background: rgba(61, 220, 151, .12);
    color: var(--green);
    border: 1px solid rgba(61, 220, 151, .35);
}

/* ── Hero 头部 ────────────────────────────────────────── */
.dsh-detail-hero {
    background: linear-gradient(180deg, var(--card2) 0%, var(--card) 100%);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 26px 26px 22px;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}
.dsh-detail-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(600px 200px at 15% 0%, rgba(90, 169, 255, .08), transparent 70%);
    pointer-events: none;
}
.dsh-detail-header-inner {
    display: flex;
    gap: 22px;
    align-items: flex-start;
    position: relative;
}
.dsh-detail-title-wrap { min-width: 0; flex: 1; }
.dsh-detail-badges-top {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.dsh-detail-title {
    font-size: 30px;
    font-weight: 700;
    color: var(--txt);
    margin: 0 0 8px;
    line-height: 1.25;
    letter-spacing: -.5px;
    word-break: break-word;
}
.dsh-detail-repo-slug {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: var(--mono);
    font-size: 14px;
    color: var(--dim2);
    margin-bottom: 12px;
}
.dsh-detail-repo-slug .dsh-ic { font-size: 16px; color: var(--dim); }
.dsh-detail-desc {
    font-size: 15px;
    line-height: 1.75;
    color: var(--dim);
    margin: 0 0 18px;
}
.dsh-detail-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* ── 按钮 ─────────────────────────────────────────────── */
.dsh-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 10px 20px;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all .18s ease;
    white-space: nowrap;
}
.dsh-btn-primary {
    background: linear-gradient(135deg, #5aa9ff, #8b5cf6);
    color: #fff;
    box-shadow: 0 4px 14px rgba(99, 102, 241, .3);
}
.dsh-btn-primary:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(99, 102, 241, .45);
}
.dsh-btn-light {
    background: var(--card2);
    color: var(--dim);
    border-color: var(--line);
}
.dsh-btn-light:hover {
    color: var(--green);
    border-color: rgba(61, 220, 151, .4);
    background: var(--hi);
}

/* ── Hero 区三个次级按钮: 统一玻璃描边风, 各自炫彩强调色, 与主按钮视觉平衡 ── */
.dsh-btn-home,
.dsh-btn-ghdl {
    position: relative;
    backdrop-filter: blur(4px);
}
.dsh-btn-home .dsh-ic { color: #67e8f9; }
.dsh-btn-ghdl .dsh-ic { color: #c4b5fd; }

/* 项目主页: 冰蓝玻璃 */
.dsh-btn-home {
    background: linear-gradient(135deg, rgba(56, 189, 248, .14), rgba(56, 189, 248, .05));
    color: #93dcfc;
    border-color: rgba(56, 189, 248, .45);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04), 0 2px 10px rgba(56, 189, 248, .12);
}
.dsh-btn-home:hover {
    color: #d6f3ff;
    border-color: rgba(103, 232, 249, .8);
    background: linear-gradient(135deg, rgba(56, 189, 248, .28), rgba(56, 189, 248, .12));
    box-shadow: 0 6px 18px rgba(56, 189, 248, .3);
    transform: translateY(-1px);
}

/* GitHub直连下载: 星紫玻璃 */
.dsh-btn-ghdl {
    background: linear-gradient(135deg, rgba(139, 92, 246, .16), rgba(139, 92, 246, .05));
    color: #cbbcfd;
    border-color: rgba(167, 139, 250, .5);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04), 0 2px 10px rgba(139, 92, 246, .14);
}
.dsh-btn-ghdl:hover {
    color: #ece7ff;
    border-color: rgba(196, 181, 253, .85);
    background: linear-gradient(135deg, rgba(139, 92, 246, .3), rgba(139, 92, 246, .12));
    box-shadow: 0 6px 18px rgba(139, 92, 246, .32);
    transform: translateY(-1px);
}

/* OTO国内高速下载: 暖橙→玫粉实心渐变 (与主按钮蓝紫冷调区分, 转化入口) */
.dsh-btn-pan {
    background: linear-gradient(135deg, #ff9a62 0%, #ff6b8b 55%, #f0569f 100%);
    color: #fff;
    border-color: rgba(255, 154, 98, .35);
    box-shadow: 0 4px 14px rgba(255, 107, 139, .3), inset 0 1px 0 rgba(255, 255, 255, .22);
}
.dsh-btn-pan:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(255, 107, 139, .45), inset 0 1px 0 rgba(255, 255, 255, .28);
}
.dsh-btn-pan .dsh-ic { color: #ffe08a; filter: drop-shadow(0 0 4px rgba(255, 224, 138, .5)); }
.dsh-pan-code-tag {
    display: inline-flex;
    align-items: center;
    margin-left: 2px;
    padding: 2px 8px;
    border-radius: 5px;
    background: rgba(0, 0, 0, .22);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    white-space: nowrap;
}
/* 未登录: 玫粉虚线锁定态, 点击弹登录提示 */
.dsh-btn-pan-locked {
    background: rgba(255, 107, 139, .08);
    color: #f2a1b6;
    border: 1px dashed rgba(255, 107, 139, .55);
    box-shadow: none;
}
.dsh-btn-pan-locked:hover {
    color: #ffd3de;
    border-color: rgba(255, 107, 139, .9);
    background: rgba(255, 107, 139, .16);
    box-shadow: 0 6px 18px rgba(255, 107, 139, .22);
}
.dsh-btn-xs {
    padding: 6px 12px;
    font-size: 12px;
    border-radius: 7px;
}

/* ── 指标条 (线上同款: 8 列分隔线风格, 深色适配) ─────────── */
.dsh-metrics-bar {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
    margin-top: 22px;
    position: relative;
}
.dsh-metric-box {
    padding: 12px 8px;
    text-align: center;
    border-right: 1px solid var(--line2);
    border-bottom: 1px solid var(--line2);
    transition: background .18s;
}
.dsh-metric-box:hover {
    background: rgba(90, 169, 255, .06);
}
.dsh-metric-val {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 15px;
    font-weight: 700;
    color: var(--txt);
    margin-bottom: 4px;
    min-height: 20px;
    word-break: break-word;
}
.dsh-metric-val .dsh-ic { font-size: 15px; color: var(--blue); }
.dsh-metric-val.text-warning .dsh-ic { color: var(--gold); }
.dsh-metric-val.text-danger .dsh-ic { color: var(--red); }
.dsh-metric-lbl {
    font-size: 12px;
    color: var(--gray);
}
.dsh-lang-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    flex: none;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, .06);
}

/* ── 安装指令框 ───────────────────────────────────────── */
.dsh-install-box {
    margin-top: 14px;
    background: rgba(11, 14, 26, .6);
    border: 1px solid var(--line2);
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.dsh-install-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 11px 16px;
    border-bottom: 1px solid var(--line2);
    background: rgba(28, 34, 66, .5);
}
.dsh-install-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--txt);
}
.dsh-install-title .dsh-ic { color: var(--green); font-size: 16px; }
.dsh-install-tabs {
    display: flex;
    gap: 4px;
}
.dsh-tab-btn {
    background: none;
    border: none;
    color: var(--gray);
    padding: 6px 14px;
    font-size: 13px;
    border-radius: 7px;
    cursor: pointer;
    transition: all .15s;
    font-family: inherit;
}
.dsh-tab-btn:hover { color: var(--txt); }
.dsh-tab-btn.active {
    color: var(--green);
    background: rgba(61, 220, 151, .12);
    font-weight: 600;
}
.dsh-install-body { padding: 10px; }
.dsh-cmd-pane {
    display: none;
    align-items: center;
    gap: 12px;
    background: #0a0d18;
    border: 1px solid var(--line2);
    border-radius: 8px;
    padding: 12px 14px;
}
.dsh-cmd-pane.active { display: flex; }
.dsh-cmd-code {
    flex: 1;
    min-width: 0;
    font-family: var(--mono);
    font-size: 13px;
    color: var(--green);
    overflow-x: auto;
    white-space: nowrap;
}
.dsh-copy-btn {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--card2);
    border: 1px solid var(--line);
    color: var(--dim);
    padding: 7px 14px;
    border-radius: 7px;
    font-size: 12px;
    cursor: pointer;
    transition: all .15s;
    font-family: inherit;
}
.dsh-copy-btn:hover {
    color: var(--green);
    border-color: rgba(61, 220, 151, .4);
}

/* ── 双栏布局 (参数对齐线上: 侧栏 310px / 间距 30px) ──────── */
.dsh-main-container {
    padding: 24px 0 50px;
}
.dsh-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    gap: 30px;
    align-items: start;
}
.dsh-detail-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.dsh-detail-sidebar {
    position: sticky;
    top: 70px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
}

/* ── 卡片通用 ─────────────────────────────────────────── */
.dsh-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
}
.dsh-card-header {
    padding: 13px 18px;
    border-bottom: 1px solid var(--line2);
}
.dsh-sidebar-card-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--txt);
}
.dsh-sidebar-card-title .dsh-ic { color: var(--blue); font-size: 16px; }
.dsh-card-body { padding: 18px; }
.dsh-card-body p-0,
.p-0 { padding: 0; }

/* ── README 卡片 ──────────────────────────────────────── */
.dsh-readme-card { margin-bottom: 16px; }
.dsh-readme-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 18px;
    border-bottom: 1px solid var(--line2);
    background: var(--card2);
}
.dsh-readme-title {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 14px;
    font-weight: 600;
    color: var(--txt);
}
.dsh-readme-title > .dsh-ic { color: var(--blue); font-size: 17px; }
.dsh-branch-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-family: var(--mono);
    color: var(--dim2);
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--line2);
    padding: 2px 9px;
    border-radius: 12px;
}
.dsh-readme-content {
    padding: 22px 24px;
    font-size: 14px;
    line-height: 1.8;
    color: var(--dim);
}

/* README markdown 深色渲染 */
.dsh-readme-content h1,
.dsh-readme-content h2,
.dsh-readme-content h3,
.dsh-readme-content h4,
.dsh-readme-content h5,
.dsh-readme-content h6 {
    color: var(--txt);
    margin: 26px 0 12px;
    line-height: 1.35;
    font-weight: 700;
}
.dsh-readme-content h1:first-child { margin-top: 0; }
.dsh-readme-content h1 {
    font-size: 24px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line2);
}
.dsh-readme-content h2 {
    font-size: 20px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line2);
    scroll-margin-top: 80px;
}
.dsh-readme-content h3 { font-size: 17px; }
.dsh-readme-content p { margin: 12px 0; color: var(--dim); }
.dsh-readme-content a {
    color: var(--blue);
    text-decoration: none;
    border-bottom: 1px dashed rgba(90, 169, 255, .4);
}
.dsh-readme-content a:hover { color: var(--green); border-bottom-color: rgba(61, 220, 151, .5); }
.dsh-readme-content strong { color: var(--txt); }
.dsh-readme-content code {
    background: rgba(255, 255, 255, .07);
    padding: 2px 7px;
    border-radius: 5px;
    font-size: 12.5px;
    font-family: var(--mono);
    color: #a5f3d0;
}
.dsh-readme-content pre {
    background: #0a0d18;
    border: 1px solid var(--line2);
    border-radius: 9px;
    padding: 15px 16px;
    overflow-x: auto;
    margin: 14px 0;
}
.dsh-readme-content pre code {
    background: none;
    padding: 0;
    color: var(--dim);
    font-size: 13px;
}
.dsh-readme-content blockquote {
    border-left: 3px solid var(--blue);
    margin: 14px 0;
    padding: 8px 16px;
    color: var(--dim2);
    background: rgba(90, 169, 255, .06);
    border-radius: 0 8px 8px 0;
    font-style: normal;
}
.dsh-readme-content ul,
.dsh-readme-content ol {
    color: var(--dim);
    padding-left: 24px;
    margin: 12px 0;
}
.dsh-readme-content li { margin: 6px 0; }
.dsh-readme-content table {
    border-collapse: collapse;
    width: 100%;
    margin: 14px 0;
    font-size: 13px;
    display: block;
    overflow-x: auto;
}
.dsh-readme-content th,
.dsh-readme-content td {
    border: 1px solid var(--line);
    padding: 8px 12px;
    text-align: left;
}
.dsh-readme-content th { background: var(--card2); color: var(--txt); }
.dsh-readme-content img { max-width: 100%; border-radius: 8px; }
.dsh-readme-content hr { border: none; border-top: 1px solid var(--line2); margin: 22px 0; }
.dsh-readme-content del { color: var(--dim2); opacity: .75; }

/* 链接里的徽章/图标图片: inline 横排, 覆盖 markdown.css .markdown img 的 block + 1.5em 外边距 */
.dsh-readme-content a img {
    display: inline-block;
    margin: 0;
    border-radius: 0;
    vertical-align: middle;
}

/* GitHub user-attachments 视频 (插件已把裸附件链接/视频型图片语法转为 <video>) */
.dsh-readme-content video {
    display: block;
    max-width: 100%;
    margin: 16px auto;
    border-radius: 10px;
    border: 1px solid var(--line2);
    background: #000;
}

/* GitHub README 常见的 <div align="center"> 居中块 (插件预处理后为 .dsh-center;
   纯 HTML 块保留原标签) */
.dsh-readme-content div[align="center"],
.dsh-readme-content p[align="center"],
.dsh-center {
    text-align: center;
    margin: 18px 0;
}
.dsh-readme-content div[align="center"] img,
.dsh-readme-content p[align="center"] img,
.dsh-center img {
    display: inline-block;
    margin: 4px 6px;
    border-radius: 0;
    vertical-align: middle;
}
.dsh-center p { margin: 8px 0; }
.dsh-center > :last-child { margin-bottom: 0; }

/* ── 代码块: 语言标签 + 复制按钮 (GitHub 同款) ───────────── */
.dsh-code-block {
    margin: 14px 0;
    border: 1px solid var(--line2);
    border-radius: 9px;
    overflow: hidden;
    background: #0a0d18;
}
.dsh-code-block pre {
    margin: 0;
    border: none;
    border-radius: 0;
}
.dsh-code-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 7px 10px 7px 14px;
    background: var(--card2);
    border-bottom: 1px solid var(--line2);
}
.dsh-code-lang {
    font-family: var(--mono);
    font-size: 11.5px;
    color: var(--dim2);
    letter-spacing: .5px;
    text-transform: lowercase;
}
.dsh-code-copy {
    font-size: 12px;
    line-height: 1;
    color: var(--dim);
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--line2);
    border-radius: 6px;
    padding: 6px 14px;
    cursor: pointer;
    transition: color .15s, border-color .15s, background .15s;
}
.dsh-code-copy:hover {
    color: var(--txt);
    border-color: var(--blue);
    background: rgba(90, 169, 255, .12);
}

/* ── GitHub Alerts 提示框 (> [!TIP] / [!NOTE] ...) ───────── */
.dsh-alert {
    margin: 16px 0;
    border: 1px solid var(--line2);
    border-left: 3px solid var(--blue);
    border-radius: 10px;
    background: rgba(90, 169, 255, .06);
    padding: 12px 16px;
}
.dsh-alert-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: 13.5px;
    color: var(--txt);
    margin-bottom: 4px;
}
.dsh-alert-icon {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    border-radius: 50%;
    background: var(--blue);
    position: relative;
}
.dsh-alert-icon::after {
    content: 'i';
    position: absolute;
    inset: 0;
    text-align: center;
    line-height: 16px;
    font-size: 11px;
    font-weight: 700;
    font-style: italic;
    font-family: var(--mono);
    color: #0a0d18;
}
.dsh-alert-body > :first-child { margin-top: 0; }
.dsh-alert-body > :last-child { margin-bottom: 0; }
.dsh-alert-tip {
    border-left-color: var(--green);
    background: rgba(61, 220, 151, .07);
}
.dsh-alert-tip .dsh-alert-icon { background: var(--green); }
.dsh-alert-tip .dsh-alert-icon::after { content: '\2713'; font-style: normal; font-size: 10px; }
.dsh-alert-important {
    border-left-color: #a78bfa;
    background: rgba(167, 139, 250, .08);
}
.dsh-alert-important .dsh-alert-icon { background: #a78bfa; }
.dsh-alert-warning {
    border-left-color: #fbbf24;
    background: rgba(251, 191, 36, .08);
}
.dsh-alert-warning .dsh-alert-icon { background: #fbbf24; }
.dsh-alert-warning .dsh-alert-icon::after { content: '!'; font-style: normal; }
.dsh-alert-caution {
    border-left-color: #f87171;
    background: rgba(248, 113, 113, .08);
}
.dsh-alert-caution .dsh-alert-icon { background: #f87171; }
.dsh-alert-caution .dsh-alert-icon::after { content: '!'; font-style: normal; }

/* ── GFM 任务列表复选框 (- [x] / - [ ]) ─────────────────── */
.dsh-readme-content li.dsh-task-item {
    list-style: none;
    margin-left: -20px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.dsh-task-check {
    appearance: none;
    -webkit-appearance: none;
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    margin-top: 5px;
    border: 1.5px solid var(--line);
    border-radius: 4px;
    background: rgba(255, 255, 255, .04);
    position: relative;
}
.dsh-task-check:checked {
    background: var(--green);
    border-color: var(--green);
}
.dsh-task-check:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid #04120b;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* ── <details> 折叠块 ──────────────────────────────────── */
.dsh-details {
    margin: 16px 0;
    border: 1px solid var(--line2);
    border-radius: 10px;
    background: var(--card2);
    overflow: hidden;
}
.dsh-details-summary {
    padding: 12px 16px 12px 38px;
    cursor: pointer;
    font-weight: 600;
    font-size: 13.5px;
    color: var(--txt);
    user-select: none;
    list-style: none;
    position: relative;
    transition: color .15s;
}
.dsh-details-summary::-webkit-details-marker { display: none; }
.dsh-details-summary::before {
    content: '\25B6';
    position: absolute;
    left: 16px;
    top: 13px;
    font-size: 9px;
    color: var(--blue);
    transition: transform .18s;
}
.dsh-details[open] .dsh-details-summary::before { transform: rotate(90deg); }
.dsh-details-summary:hover { color: var(--blue); }
.dsh-details-body {
    padding: 2px 16px 14px;
    border-top: 1px solid var(--line2);
}

/* ── 来源声明 ─────────────────────────────────────────── */
.dsh-source-attribution {
    margin: 0 24px 20px;
    background: var(--card2);
    border: 1px solid var(--line2);
    border-radius: 10px;
    padding: 14px 16px;
}
.dsh-attr-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.dsh-attr-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    font-weight: 600;
    color: var(--green);
}
.dsh-attr-badge .dsh-ic { font-size: 15px; }
.dsh-attr-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dsh-attr-list li {
    display: flex;
    gap: 6px;
    padding: 5px 0;
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--dim2);
}
.dsh-attr-label {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--gray);
}
.dsh-attr-label .dsh-ic { font-size: 13px; }
.dsh-attr-val { min-width: 0; word-break: break-all; }
.dsh-attr-val strong { color: var(--txt); }
.dsh-attr-url,
.dsh-attr-site {
    color: var(--blue);
    text-decoration: none;
}
.dsh-attr-url:hover,
.dsh-attr-site:hover { color: var(--green); }

/* ── 标签 ─────────────────────────────────────────────── */
.dsh-readme-footer {
    border-top: 1px solid var(--line2);
    padding: 14px 18px;
}
.dsh-topics-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.dsh-topics-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: var(--gray);
}
.dsh-topics-wrap a.tags {
    display: inline-flex;
    align-items: center;
    padding: 3px 12px;
    background: rgba(90, 169, 255, .1);
    color: var(--blue);
    border: 1px solid rgba(90, 169, 255, .22);
    border-radius: 14px;
    font-size: 12px;
    text-decoration: none;
    transition: all .15s;
}
.dsh-topics-wrap a.tags::before {
    content: '#';
    margin-right: 3px;
    opacity: .7;
}
.dsh-topics-wrap a.tags:hover {
    background: rgba(61, 220, 151, .12);
    color: var(--green);
    border-color: rgba(61, 220, 151, .35);
}

/* ── 上一篇/下一篇 ────────────────────────────────────── */
.dsh-neighbor-wrap { margin-bottom: 8px; }
.dsh-neighbor-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.dsh-neighbor-prev,
.dsh-neighbor-next {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 14px 16px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 10px;
    transition: border-color .18s;
}
.dsh-neighbor-next {
    text-align: right;
    align-items: flex-end;
}
.dsh-neighbor-prev:empty,
.dsh-neighbor-next:empty {
    background: transparent;
    border: 1px dashed var(--line2);
}
.dsh-neighbor-prev:hover,
.dsh-neighbor-next:hover { border-color: rgba(61, 220, 151, .45); }
.dsh-neighbor-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: var(--gray);
}
.dsh-neighbor-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--txt);
}
.dsh-neighbor-title:hover { color: var(--green); }

/* ── Facts 档案 ───────────────────────────────────────── */
.dsh-facts-list {
    list-style: none;
    margin: 0;
    padding: 4px 0;
}
.dsh-fact-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 18px;
    border-bottom: 1px dashed var(--line2);
    font-size: 13px;
}
.dsh-fact-item:last-child { border-bottom: none; }
.dsh-fact-key {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--gray);
    flex: none;
}
.dsh-fact-key .dsh-ic { color: var(--dim2); font-size: 14px; }
.dsh-fact-val {
    color: var(--txt);
    text-align: right;
    word-break: break-word;
    min-width: 0;
}

/* ── TOC ──────────────────────────────────────────────── */
.dsh-toc-list {
    display: flex;
    flex-direction: column;
    padding: 8px 0;
    max-height: 320px;
    overflow-y: auto;
}
.dsh-toc-list a {
    padding: 8px 18px;
    font-size: 13px;
    color: var(--dim2);
    border-left: 2px solid transparent;
    transition: all .15s;
    line-height: 1.5;
}
.dsh-toc-list a:hover {
    color: var(--green);
    background: rgba(61, 220, 151, .06);
    border-left-color: var(--green);
}

/* ── 同类推荐 ─────────────────────────────────────────── */
.dsh-related-list { padding: 4px 0; }
.dsh-related-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    border-bottom: 1px dashed var(--line2);
    transition: background .15s;
}
.dsh-related-item:last-child { border-bottom: none; }
.dsh-related-item:hover { background: rgba(90, 169, 255, .06); }
.dsh-related-info { min-width: 0; flex: 1; }
.dsh-related-title {
    margin: 0 0 5px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--txt);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.dsh-related-item:hover .dsh-related-title { color: var(--green); }
.dsh-related-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: var(--gray);
}
.dsh-related-lang,
.dsh-related-star {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.dsh-related-star .dsh-ic { color: var(--gold); font-size: 12px; }
.dsh-related-arrow {
    flex: none;
    color: var(--gray);
    font-size: 15px;
    transition: transform .15s, color .15s;
}
.dsh-related-item:hover .dsh-related-arrow {
    color: var(--green);
    transform: translateX(3px);
}

/* ── Toast ────────────────────────────────────────────── */
.dsh-toast {
    position: fixed;
    left: 50%;
    bottom: 32px;
    transform: translate(-50%, 20px);
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--card2);
    border: 1px solid rgba(61, 220, 151, .4);
    color: var(--green);
    padding: 11px 20px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .5);
    opacity: 0;
    pointer-events: none;
    transition: all .25s ease;
    z-index: 9999;
}
.dsh-toast.show {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* ── 响应式 (断点对齐线上: 992 双栏变单栏 / 768 移动 / 576 指标 2 列) ── */
@media (max-width: 992px) {
    .dsh-detail-layout {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .dsh-detail-sidebar {
        position: static;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
    .dsh-metrics-bar { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 768px) {
    .dsh-page { padding: 14px 14px 40px; }
    .dsh-detail-hero { padding: 18px 16px; }
    .dsh-detail-title { font-size: 23px; }
    .dsh-readme-content { padding: 16px; }
    .dsh-source-attribution { margin: 0 16px 16px; }
    .dsh-neighbor-nav { grid-template-columns: 1fr; }
    .dsh-cmd-pane { flex-wrap: wrap; }
    .dsh-cmd-code { white-space: normal; word-break: break-all; }
}
@media (max-width: 576px) {
    .dsh-metrics-bar { grid-template-columns: repeat(2, 1fr); }
    .dsh-detail-actions { flex-direction: column; align-items: stretch; gap: 10px; }
    .dsh-detail-actions .dsh-btn { justify-content: center; }
}

/* ============================================================
 * 兼容段: echo_log.php 旧版单栏 dsh 结构 (手动发文默认模板)
 * 类名与新版互不冲突, 请勿删除
 * ============================================================ */
.dsh-detail {
    max-width: 920px;
    margin: 0 auto;
    padding: 24px 20px 60px;
    color: var(--txt);
    line-height: 1.7;
}
.dsh-detail .dsh-breadcrumb {
    font-size: 13px;
    color: var(--gray);
    margin-bottom: 18px;
    display: block;
}
.dsh-detail .dsh-breadcrumb a { color: var(--blue); text-decoration: none; }
.dsh-detail .dsh-breadcrumb a:hover { color: var(--green); }
.dsh-detail .dsh-breadcrumb .sep { margin: 0 8px; opacity: .5; }
.dsh-detail .dsh-breadcrumb .cur { color: var(--txt); }
.dsh-detail .dsh-badges { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.dsh-detail .dsh-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
}
.dsh-detail .dsh-badge-cat {
    background: linear-gradient(135deg, #5aa9ff, #8b5cf6);
    color: #fff;
}
.dsh-detail .dsh-badge-cat:hover { opacity: .9; color: #fff; }
.dsh-detail .dsh-badge-status {
    background: rgba(61, 220, 151, .15);
    color: var(--green);
    border: 1px solid rgba(61, 220, 151, .3);
}
.dsh-detail .dsh-h1 {
    font-size: 32px;
    font-weight: 700;
    color: var(--txt);
    margin: 0 0 8px;
    line-height: 1.3;
    letter-spacing: -.5px;
}
.dsh-detail .dsh-subtitle {
    font-size: 15px;
    color: var(--gray);
    margin-bottom: 16px;
    font-family: var(--mono);
}
.dsh-detail .dsh-summary {
    font-size: 15px;
    color: var(--dim);
    background: var(--card2);
    border-left: 3px solid var(--green);
    padding: 14px 18px;
    border-radius: 0 8px 8px 0;
    margin-bottom: 20px;
}
.dsh-detail .dsh-actions { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.dsh-detail .dsh-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 22px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all .2s;
    border: 1px solid transparent;
}
.dsh-detail .dsh-btn-gh {
    background: linear-gradient(135deg, #5aa9ff, #8b5cf6);
    color: #fff;
}
.dsh-detail .dsh-btn-gh:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(90, 169, 255, .3); color: #fff; }
.dsh-detail .dsh-btn-home {
    background: var(--card);
    color: var(--green);
    border-color: rgba(61, 220, 151, .3);
}
.dsh-detail .dsh-btn-home:hover { background: rgba(61, 220, 151, .1); color: var(--green); }
.dsh-detail .dsh-gh-icon {
    width: 18px; height: 18px;
    background: #fff;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 .5C5.37.5 0 5.87 0 12.5c0 5.3 3.44 9.8 8.21 11.39.6.11.82-.26.82-.58v-2.17c-3.34.73-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.09-.75.08-.73.08-.73 1.21.08 1.84 1.24 1.84 1.24 1.07 1.84 2.81 1.31 3.5 1 .11-.78.42-1.31.76-1.61-2.67-.3-5.47-1.34-5.47-5.95 0-1.31.47-2.39 1.24-3.23-.13-.3-.54-1.52.12-3.18 0 0 1.01-.32 3.3 1.23a11.5 11.5 0 016 0c2.29-1.55 3.3-1.23 3.3-1.23.66 1.66.25 2.88.12 3.18.77.84 1.24 1.92 1.24 3.23 0 4.62-2.81 5.64-5.49 5.94.43.37.81 1.1.81 2.22v3.29c0 .32.22.7.83.58C20.56 22.29 24 17.8 24 12.5 24 5.87 18.63.5 12 .5z'/%3E%3C/svg%3E") no-repeat center;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 .5C5.37.5 0 5.87 0 12.5c0 5.3 3.44 9.8 8.21 11.39.6.11.82-.26.82-.58v-2.17c-3.34.73-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.09-.75.08-.73.08-.73 1.21.08 1.84 1.24 1.84 1.24 1.07 1.84 2.81 1.31 3.5 1 .11-.78.42-1.31.76-1.61-2.67-.3-5.47-1.34-5.47-5.95 0-1.31.47-2.39 1.24-3.23-.13-.3-.54-1.52.12-3.18 0 0 1.01-.32 3.3 1.23a11.5 11.5 0 016 0c2.29-1.55 3.3-1.23 3.3-1.23.66 1.66.25 2.88.12 3.18.77.84 1.24 1.92 1.24 3.23 0 4.62-2.81 5.64-5.49 5.94.43.37.81 1.1.81 2.22v3.29c0 .32.22.7.83.58C20.56 22.29 24 17.8 24 12.5 24 5.87 18.63.5 12 .5z'/%3E%3C/svg%3E") no-repeat center;
}
.dsh-detail .dsh-meta {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 28px;
}
.dsh-detail .dsh-meta-item {
    background: var(--card);
    border: 1px solid var(--line2);
    border-radius: 10px;
    padding: 16px 14px;
    text-align: center;
    transition: border-color .2s;
}
.dsh-detail .dsh-meta-item:hover { border-color: rgba(90, 169, 255, .4); }
.dsh-detail .dsh-meta-num {
    font-size: 20px;
    font-weight: 700;
    color: var(--txt);
    margin-bottom: 4px;
    word-break: break-all;
}
.dsh-detail .dsh-meta-label { font-size: 12px; color: var(--gray); }
.dsh-detail .dsh-install {
    background: var(--card);
    border: 1px solid var(--line2);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 28px;
}
.dsh-detail .dsh-install-tabs {
    display: flex;
    background: var(--card2);
    border-bottom: 1px solid var(--line2);
}
.dsh-detail .dsh-tab {
    background: none;
    border: none;
    color: var(--gray);
    padding: 10px 20px;
    font-size: 13px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: all .2s;
}
.dsh-detail .dsh-tab:hover { color: var(--txt); }
.dsh-detail .dsh-tab.active { color: var(--green); border-bottom-color: var(--green); }
.dsh-detail .dsh-install-body { padding: 4px; }
.dsh-detail .dsh-tab-pane { display: none; }
.dsh-detail .dsh-tab-pane.active { display: block; }
.dsh-detail .dsh-install pre {
    margin: 0;
    padding: 16px 18px;
    background: #0a0d18;
    border-radius: 6px;
    overflow-x: auto;
}
.dsh-detail .dsh-install code {
    font-family: var(--mono);
    font-size: 13px;
    color: var(--green);
}
.dsh-detail .dsh-readme {
    background: var(--card);
    border: 1px solid var(--line2);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 28px;
}
.dsh-detail .dsh-readme-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    background: var(--card2);
    border-bottom: 1px solid var(--line2);
}
.dsh-detail .dsh-readme-name { font-weight: 600; color: var(--txt); font-family: var(--mono); }
.dsh-detail .dsh-readme-branch {
    font-size: 12px;
    color: var(--gray);
    background: rgba(255, 255, 255, .06);
    padding: 2px 10px;
    border-radius: 12px;
}
.dsh-detail .dsh-readme-gh { margin-left: auto; font-size: 13px; color: var(--blue); text-decoration: none; }
.dsh-detail .dsh-readme-gh:hover { color: var(--green); }
.dsh-detail .dsh-readme-body { padding: 24px; }
.dsh-detail .dsh-readme-body h1, .dsh-detail .dsh-readme-body h2, .dsh-detail .dsh-readme-body h3 { color: var(--txt); }
.dsh-detail .dsh-readme-body p { color: var(--dim); }
.dsh-detail .dsh-readme-body a { color: var(--blue); }
.dsh-detail .dsh-seo-footer {
    background: var(--card2);
    border-radius: 10px;
    padding: 16px 20px;
    margin-bottom: 24px;
    font-size: 13px;
    color: var(--gray);
}
.dsh-detail .dsh-seo-footer ul { list-style: none; padding: 0; margin: 0; }
.dsh-detail .dsh-seo-footer li { margin: 6px 0; line-height: 1.7; }
.dsh-detail .dsh-seo-footer b { color: var(--txt); }
.dsh-detail .dsh-seo-footer a { color: var(--blue); }
.dsh-detail .dsh-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
    font-size: 13px;
}
.dsh-detail .dsh-tags-label { color: var(--gray); }
.dsh-detail .dsh-tags a {
    display: inline-block;
    padding: 3px 12px;
    background: rgba(90, 169, 255, .12);
    color: var(--blue);
    border-radius: 14px;
    text-decoration: none;
    font-size: 12px;
    border: 1px solid rgba(90, 169, 255, .2);
}
.dsh-detail .dsh-nav {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 28px;
}
.dsh-detail .dsh-nav-prev, .dsh-detail .dsh-nav-next {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 14px 18px;
    background: var(--card);
    border: 1px solid var(--line2);
    border-radius: 10px;
    text-decoration: none;
}
.dsh-detail .dsh-nav-next { text-align: right; align-items: flex-end; }
.dsh-detail .dsh-nav-prev:hover, .dsh-detail .dsh-nav-next:hover { border-color: var(--blue); }
.dsh-detail .dsh-nav-dir { font-size: 12px; color: var(--gray); margin-bottom: 4px; }
.dsh-detail .dsh-nav-title { font-size: 14px; color: var(--txt); font-weight: 500; }
.dsh-detail .dsh-nav .disabled { visibility: hidden; }
.dsh-detail .dsh-facts {
    background: var(--card);
    border: 1px solid var(--line2);
    border-radius: 10px;
    padding: 20px 22px;
    margin-bottom: 28px;
}
.dsh-detail .dsh-facts-title {
    font-size: 16px;
    color: var(--txt);
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line2);
}
.dsh-detail .dsh-facts ul { list-style: none; padding: 0; margin: 0; }
.dsh-detail .dsh-facts li {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px dashed var(--line2);
    font-size: 14px;
}
.dsh-detail .dsh-facts li:last-child { border-bottom: none; }
.dsh-detail .dsh-facts li span { color: var(--gray); }
.dsh-detail .dsh-facts li b { color: var(--txt); font-weight: 500; }
.dsh-detail .dsh-toc {
    background: var(--card);
    border: 1px solid var(--line2);
    border-radius: 10px;
    padding: 20px 22px;
}
.dsh-detail .dsh-toc-title {
    font-size: 16px;
    color: var(--txt);
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line2);
}
.dsh-detail .dsh-toc-list { display: flex; flex-wrap: wrap; gap: 8px; }
.dsh-detail .dsh-toc-list a {
    display: inline-block;
    padding: 5px 12px;
    background: var(--card2);
    color: var(--gray);
    border-radius: 6px;
    font-size: 13px;
    text-decoration: none;
    border: 1px solid var(--line2);
}
.dsh-detail .dsh-toc-list a:hover { color: var(--green); border-color: rgba(61, 220, 151, .3); }
@media (max-width: 768px) {
    .dsh-detail { padding: 16px 14px 40px; }
    .dsh-detail .dsh-h1 { font-size: 24px; }
    .dsh-detail .dsh-meta { grid-template-columns: repeat(2, 1fr); }
    .dsh-detail .dsh-nav { flex-direction: column; }
    .dsh-detail .dsh-nav-next { text-align: left; align-items: flex-start; }
    .dsh-detail .dsh-readme-body { padding: 16px; }
}