/**
 * 工具「Markdown 文档阅读器」（js/md-reader.js）：在 #toolsView 里整页打开。
 *
 * 正文骨架（tab、滚动区、回顶 / 回底、富文本与源码两种视图）沿用 plan.md 预览的类名（css/ai-plan-file.css），
 * 这里只改宽度：与知识库详情同宽（--kb-content-max-width），两侧留白同详情页的 --kb-detail-gutter。
 *
 * 顶部工具栏（.md-reader-toolbar / -back / -file* / -actions / -btn）与拖入提示（.md-reader-dropmask）
 * 也给工具「文档格式转换」的整页用（js/doc-converter.js），两个工具页长得一样——改这里两边一起变。
 */

.md-reader {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    color: var(--kb-ink);
}

/* ===== 顶部工具栏 ===== */

.md-reader-toolbar {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--kb-paper-line);
}

.md-reader-back {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--kb-ink-muted);
    font-size: 1.125rem;
    cursor: pointer;
}

.md-reader-file {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.md-reader-file-icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--kb-active-bg);
    color: var(--kb-accent);
    font-size: 1.25rem;
}

.md-reader-file-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.md-reader-file-name {
    margin: 0;
    overflow: hidden;
    color: var(--kb-ink);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.md-reader-file-meta {
    overflow: hidden;
    color: var(--kb-ink-muted);
    font-size: 0.75rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-variant-numeric: tabular-nums;
}

.md-reader-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
}

.md-reader-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid var(--kb-paper-line);
    border-radius: 8px;
    background: var(--kb-paper-panel);
    color: var(--kb-ink);
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}

.md-reader-btn i {
    font-size: 1rem;
}

.md-reader-btn .md-reader-caret {
    margin-left: -2px;
    color: var(--kb-ink-muted);
}

.md-reader-btn--icon {
    width: 36px;
    padding: 0;
}

/*
 * 双类名把优先级抬到 (0,2,0)：form-unified.css 的 button[type="submit"] { color:#fff } 是 (0,1,1)，
 * 链接栏的「打开」是 submit 按钮，单类名压不住，夜间模式下白字糊在浅色主色底上。
 * 前景取 --text-inverse（主按钮文字色，深浅主题各一份），与全站主按钮一致
 */
.md-reader-btn.md-reader-btn--primary {
    border-color: var(--kb-accent);
    background: var(--kb-accent);
    color: var(--text-inverse);
}

.md-reader-btn:disabled {
    border-color: var(--kb-control-disabled-border);
    background: var(--kb-control-disabled-bg);
    color: var(--kb-control-disabled-text);
    cursor: not-allowed;
}

@media (any-hover: hover) {
    .md-reader-back:hover,
    .md-reader-btn:not(.md-reader-btn--primary):hover:not(:disabled) {
        background: var(--kb-active-bg);
        color: var(--kb-ink);
    }

    .md-reader-btn.md-reader-btn--primary:hover:not(:disabled) {
        background: var(--kb-accent-strong);
        border-color: var(--kb-accent-strong);
    }
}

.md-reader-back:focus-visible,
.md-reader-btn:focus-visible,
.md-reader-link-btn:focus-visible,
.md-reader-drop:focus-visible {
    outline: 2px solid var(--kb-accent);
    outline-offset: 2px;
}

/* ===== 舞台：空态 / 读取中 / 失败 / 正文 四选一（hidden 属性切换） ===== */

.md-reader-stage {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.md-reader-stage > [hidden] {
    display: none !important;
}

.md-reader-preview {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

/*
 * tab 的左缘与正文左缘对齐：正文盒子宽 980px + 两侧各一份 gutter、居中，
 * 所以正文左缘离滚动区左边 max(gutter, (宽 - 980px) / 2)，tab 栏用同一个数做左右内边距
 */
.md-reader-preview .ai-plan-preview-tabs {
    padding-inline: max(var(--kb-detail-gutter, 1.25rem), calc((100% - var(--kb-content-max-width, 980px)) / 2));
}

/* 与知识库详情同宽：内容区 980px（--kb-content-max-width），两侧再各留一份详情页的边距 */
.md-reader-preview .ai-plan-preview-rich,
.md-reader-preview .ai-plan-source,
.md-reader-props {
    box-sizing: border-box;
    width: 100%;
    max-width: calc(var(--kb-content-max-width, 980px) + 2 * var(--kb-detail-gutter, 1.25rem));
    margin-inline: auto;
    padding-inline: var(--kb-detail-gutter, 1.25rem);
}

.md-reader-preview .ai-plan-preview-rich {
    padding-top: 24px;
    padding-bottom: 64px;
}

.md-reader-preview .ai-plan-source {
    padding-top: 24px;
    padding-bottom: 64px;
}

/* front matter 的「文档属性」卡：只在富文本视图里出现 */
.md-reader-props {
    display: block;
    margin-top: 20px;
}

.md-reader-props summary {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    border: 1px solid var(--kb-paper-line);
    border-radius: 10px;
    background: var(--kb-paper-soft);
    color: var(--kb-ink-muted);
    font-size: 0.8125rem;
    list-style: none;
    cursor: pointer;
}

/*
 * align-items:center 对齐的是盒子不是墨迹：中文墨迹比行盒中心低，图标看着偏高。
 * 图标行高收成 1、按 --kb-icon-optical-shift 下压（与 .ai-plan-file-todo i 同一招，衬线字体下变量自己变大）
 */
.md-reader-props summary i {
    flex: 0 0 auto;
    position: relative;
    top: var(--kb-icon-optical-shift, 0.06em);
    font-size: 0.9375rem;
    line-height: 1;
}

.md-reader-props summary::-webkit-details-marker {
    display: none;
}

.md-reader-props[open] summary {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.md-reader-props-count {
    margin-left: auto;
    font-variant-numeric: tabular-nums;
}

.md-reader-props dl {
    display: grid;
    grid-template-columns: minmax(80px, max-content) 1fr;
    gap: 6px 16px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--kb-paper-line);
    border-top: none;
    border-radius: 0 0 10px 10px;
    font-size: 0.8125rem;
}

.md-reader-props dt {
    color: var(--kb-ink-muted);
}

.md-reader-props dd {
    margin: 0;
    color: var(--kb-ink);
    word-break: break-word;
}

/* 拖文件进来时整块盖一层提示 */
.md-reader-dropmask {
    position: absolute;
    inset: 12px;
    z-index: var(--kb-z-scroll-jump, 20);
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 2px dashed var(--kb-accent);
    border-radius: 14px;
    background: color-mix(in srgb, var(--kb-paper-panel) 88%, transparent);
    color: var(--kb-accent);
    font-size: 0.9375rem;
    font-weight: 600;
    pointer-events: none;
}

.md-reader-dropmask i {
    font-size: 2rem;
}

.md-reader.is-dragover .md-reader-dropmask {
    display: flex;
}

/* ===== 空态 ===== */

/* 空态整块在舞台里垂直居中；内容比舞台高时 margin:auto 退成从顶上开始排，不会把顶部裁掉 */
.md-reader-empty {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    overflow-y: auto;
    padding: 32px 20px 48px;
}

.md-reader-empty-inner {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 640px;
    margin: auto;
}

.md-reader-default-tip[hidden] {
    display: none;
}

.md-reader-drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 40px 24px;
    border: 1.5px dashed var(--kb-paper-line);
    border-radius: 14px;
    background: var(--kb-paper-soft);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

@media (any-hover: hover) {
    .md-reader-drop:hover {
        border-color: color-mix(in srgb, var(--kb-accent) 60%, var(--kb-paper-line));
        background: var(--kb-active-bg);
    }
}

.md-reader-drop-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 4px;
    border-radius: 14px;
    background: var(--kb-active-bg);
    color: var(--kb-accent);
    font-size: 1.75rem;
}

.md-reader-drop-title {
    margin: 0;
    color: var(--kb-ink);
    font-size: 1.0625rem;
    font-weight: 600;
}

.md-reader-drop-desc {
    margin: 0;
    color: var(--kb-ink-soft, var(--kb-ink-muted));
    font-size: 0.875rem;
}

.md-reader-link {
    color: var(--kb-accent);
    font-weight: 500;
}

.md-reader-drop-hint {
    margin: 0;
    color: var(--kb-ink-muted);
    font-size: 0.75rem;
}

.md-reader-url-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.md-reader-url-label {
    color: var(--kb-ink);
    font-size: 0.875rem;
    font-weight: 600;
}

.md-reader-url-row {
    display: flex;
    gap: 8px;
}

.md-reader-url-input {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid var(--kb-paper-line);
    border-radius: 8px;
    background: var(--kb-paper-panel);
    color: var(--kb-ink);
    font-size: 0.875rem;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.md-reader-url-input:focus {
    border-color: color-mix(in srgb, var(--kb-accent) 48%, var(--kb-paper-line));
    box-shadow: 0 0 0 3px var(--kb-accent-soft);
}

.md-reader-url-submit {
    min-height: 40px;
    padding-inline: 20px;
}

.md-reader-url-error {
    min-height: 0;
    color: var(--kb-danger);
    font-size: 0.8125rem;
}

.md-reader-url-error:empty {
    display: none;
}

.md-reader-url-hint {
    margin: 0;
    color: var(--kb-ink-muted);
    font-size: 0.75rem;
}

.md-reader-default-tip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--kb-accent-soft);
    color: var(--kb-ink-soft, var(--kb-ink));
    font-size: 0.8125rem;
    line-height: 1.6;
}

.md-reader-default-tip > i {
    color: var(--kb-accent);
}

.md-reader-default-tip > span {
    flex: 1 1 240px;
}

.md-reader-link-btn {
    min-height: 32px;
    padding: 0 10px;
    border: 1px solid var(--kb-accent);
    border-radius: 6px;
    background: transparent;
    color: var(--kb-accent);
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
}

/* ===== 读取中 / 失败 ===== */

.md-reader-loading {
    flex: 1 1 auto;
    padding: 32px var(--kb-detail-gutter, 1.25rem);
}

.md-reader-skeleton {
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-width: var(--kb-content-max-width, 980px);
    margin: 0 auto;
}

.md-reader-skeleton-line {
    height: 14px;
    border-radius: 7px;
    background: linear-gradient(90deg, var(--kb-paper-soft) 0%, var(--kb-active-bg) 50%, var(--kb-paper-soft) 100%);
    background-size: 200% 100%;
    animation: md-reader-shimmer 1.4s ease-in-out infinite;
}

.md-reader-skeleton-line.is-title {
    width: 45%;
    height: 24px;
    margin-bottom: 8px;
}

.md-reader-skeleton-line.is-short {
    width: 62%;
}

@keyframes md-reader-shimmer {
    from {
        background-position: 100% 0;
    }

    to {
        background-position: -100% 0;
    }
}

.md-reader-loading-text {
    max-width: var(--kb-content-max-width, 980px);
    margin: 20px auto 0;
    overflow: hidden;
    color: var(--kb-ink-muted);
    font-size: 0.8125rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.md-reader-error {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 48px 20px;
}

.md-reader-error-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    max-width: 480px;
    margin: 0 auto;
    text-align: center;
}

.md-reader-error-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--kb-danger-soft);
    color: var(--kb-danger);
    font-size: 1.5rem;
}

.md-reader-error-title {
    margin: 4px 0 0;
    color: var(--kb-ink);
    font-size: 1rem;
    font-weight: 600;
}

.md-reader-error-detail {
    margin: 0;
    color: var(--kb-ink-muted);
    font-size: 0.875rem;
    line-height: 1.6;
    word-break: break-word;
}

.md-reader-error-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
}

/* 「设为默认」的指引弹框 */
.md-reader-guide ol {
    margin: 8px 0 0;
    padding-left: 1.25rem;
    line-height: 1.8;
}

.md-reader-guide kbd {
    padding: 0 4px;
    border: 1px solid var(--kb-paper-line);
    border-radius: 4px;
    font-family: inherit;
    font-size: 0.8125em;
}

@media (prefers-reduced-motion: reduce) {
    .md-reader-skeleton-line {
        animation: none;
    }
}

/* ===== 窄屏 ===== */

@media (max-width: 1023px) {
    .md-reader-toolbar {
        gap: 8px;
        padding: 8px 12px;
    }

    .md-reader-back {
        width: 44px;
        height: 44px;
    }

    .md-reader-file-icon {
        display: none;
    }

    .md-reader-btn {
        min-height: 44px;
    }

    .md-reader-btn--icon {
        width: 44px;
    }

    .md-reader-preview .ai-plan-preview-tabs {
        padding-inline: 16px;
    }

    .md-reader-preview .ai-plan-preview-rich,
    .md-reader-preview .ai-plan-source,
    .md-reader-props {
        padding-inline: 16px;
    }

    .md-reader-url-input,
    .md-reader-url-submit {
        min-height: 44px;
    }
}

/* 手机：按钮只留图标，「保存到知识库」保留文字（主操作） */
@media (max-width: 640px) {
    .md-reader-actions [data-reader-action="open"] .md-reader-btn-label,
    .md-reader-actions [data-reader-action="open"] .md-reader-caret {
        display: none;
    }

    .md-reader-actions [data-reader-action="open"] {
        width: 44px;
        padding: 0;
    }

    .md-reader-actions [data-reader-action="save"] {
        padding: 0 12px;
    }

    /* 窄屏只画短文案「存入」，读屏仍读完整的「保存到知识库」 */
    .md-reader-actions [data-reader-action="save"] .md-reader-btn-label {
        font-size: 0;
    }

    .md-reader-actions [data-reader-action="save"] .md-reader-btn-label::before {
        content: '存入';
        font-size: 0.875rem;
    }

    .md-reader-file-meta {
        display: none;
    }

    .md-reader-drop {
        padding: 28px 16px;
    }
}

/* A PDF and its conversion share the reader; no nested conversion page or browser PDF plug-in. */
.md-reader-pdf { display: flex; flex: 1 1 0; flex-direction: column; min-height: 0; min-width: 0; }
.pdf-reader-controls, .md-reader-pdf-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px 12px; flex-shrink: 0; }
.pdf-reader-controls button, .md-reader-pdf-tabs button { border: 0; border-radius: 8px; background: transparent; color: var(--text-secondary); min-height: 36px; padding: 6px 10px; }
.pdf-reader-controls button:disabled { color: var(--kb-control-disabled-text, var(--text-muted)); cursor: not-allowed; }
.md-reader-pdf-tabs [aria-pressed="true"] { background: var(--kb-active-bg); color: var(--kb-accent); }
.pdf-reader-scroll { flex: 1 1 0; min-height: 0; min-width: 0; overflow: auto; background: var(--bg-secondary); padding: 12px; }
.pdf-reader-scroll canvas { display: block; margin: 0 auto; background: white; box-shadow: 0 2px 12px #0002; }
.pdf-reader-status { padding: 4px 16px; font-size: 13px; color: var(--text-secondary); }
.pdf-reader-status:empty { display: none; }
.md-reader-conversion { flex: 0 0 auto; max-height: 30%; overflow: auto; padding: 10px 16px; background: var(--bg-secondary); color: var(--text-secondary); font-size: 13px; }
.md-reader-conversion-status { margin: 0; overflow-wrap: anywhere; }
.md-reader-conversion-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.md-reader button[hidden] { display: none !important; }
@media (max-width: 767px) {
    .pdf-reader-controls { gap: 2px; }
    .pdf-reader-controls button, .md-reader-pdf-tabs button { min-height: 44px; }
    .pdf-reader-controls button { padding: 4px 8px; }
    .md-reader-toolbar [data-reader-action="save"] .md-reader-btn-label { max-width: 150px; white-space: normal; }
    .md-reader-default-tip { flex-wrap: wrap; }
}
@media (max-width: 767px) {
    .md-reader.needs-conversion .md-reader-actions [data-reader-action="save"] .md-reader-btn-label::before { content: '转存'; }
}
@media (max-width: 767px) {
    .md-reader.is-pdf .md-reader-toolbar { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 6px; }
    .md-reader.is-pdf .md-reader-actions { grid-column: 1 / -1; justify-self: end; }
}
/* Browser-like document tabs keep document DOM and tasks independent. */
.md-reader-workspace, .md-reader-document-host { display: flex; flex: 1 1 0; flex-direction: column; min-height: 0; min-width: 0; }
.md-reader-tabbar { display: flex; flex: 0 0 auto; align-items: center; gap: 2px; padding: 4px 6px 0; border-bottom: 1px solid var(--kb-paper-line); }
.md-reader-document-tabs { display: flex; min-width: 0; flex: 1 1 auto; overflow-x: auto; scrollbar-width: thin; gap: 3px; }
.md-reader-document-tab { display: flex; flex: 0 0 auto; align-items: center; gap: 5px; max-width: 210px; min-width: 90px; height: 32px; box-sizing: border-box; padding: 0 3px 0 8px; font-size: 12px; line-height: 18px; border-radius: 7px 7px 0 0; color: var(--text-secondary); cursor: pointer; }
.md-reader-document-tab.is-dragging { opacity: .6; cursor: grabbing; }
.md-reader-document-tab[aria-selected="true"] { background: var(--kb-active-bg); color: var(--kb-accent); }
.md-reader-document-tab > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.md-reader-document-tab small { flex: 0 0 auto; font-size: 10px; color: var(--text-muted); }
.md-reader-document-tab button, .md-reader-tab-action { height: 28px; min-height: 28px; width: 28px; min-width: 28px; padding: 0; border: 0; background: transparent; color: inherit; flex: 0 0 auto; font-size: 13px; }
.md-reader-document-tab:focus-visible { outline: 2px solid var(--kb-accent); outline-offset: -2px; }
.pdf-reader-page { position: relative; margin: 0 auto; flex: 0 0 auto; }
.pdf-reader-page canvas { margin: 0; }
/* PDF.js text layer geometry, adapted from Mozilla pdf_viewer.css (Apache-2.0). */
.pdf-reader-page .textLayer { position: absolute; inset: 0; text-align: initial; overflow: clip; opacity: 1; line-height: 1; text-size-adjust: none; -webkit-text-size-adjust: none; forced-color-adjust: none; transform-origin: 0 0; --scale-round-x: 1px; --scale-round-y: 1px; --min-font-size: 1; --text-scale-factor: calc(var(--total-scale-factor) * var(--min-font-size)); --min-font-size-inv: calc(1 / var(--min-font-size)); }
.pdf-reader-page .textLayer :is(span,br) { color: transparent; position: absolute; white-space: pre; cursor: text; transform-origin: 0% 0%; }
.pdf-reader-page .textLayer > :not(.markedContent), .pdf-reader-page .textLayer .markedContent span:not(.markedContent) { z-index: 1; --font-height: 0; font-size: calc(var(--text-scale-factor) * var(--font-height)); --scale-x: 1; --rotate: 0deg; transform: rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv)); }
.pdf-reader-page .textLayer .markedContent { display: contents; }
.pdf-reader-page .textLayer [role="img"] { -webkit-user-select: none; user-select: none; }
.pdf-reader-page .textLayer ::selection { background: rgba(59,130,246,.3); }
.pdf-reader-page .textLayer[data-main-rotation="90"] { transform: rotate(90deg) translateY(-100%); }
.pdf-reader-page .textLayer[data-main-rotation="180"] { transform: rotate(180deg) translate(-100%,-100%); }
.pdf-reader-page .textLayer[data-main-rotation="270"] { transform: rotate(270deg) translateX(-100%); }
@media (max-width: 767px) { .md-reader-document-tab { height: 44px; padding-block: 0; } .md-reader-document-tab button, .md-reader-tab-action { height: 44px; width: 44px; min-height: 44px; min-width: 44px; } }
@media (max-width: 767px) { .md-reader-document-tab { max-width: min(210px, calc(100vw - 112px)); } }
/* The tab already names the active document; keep mobile command chrome on one row. */
@media (max-width: 767px) {
    .md-reader-workspace .md-reader .md-reader-toolbar { display: flex; flex-wrap: nowrap; gap: 6px; }
    .md-reader-workspace .md-reader-file { display: none; }
    .md-reader-workspace .md-reader-actions { margin-left: auto; }
}

.pdf-reader-sheet { position: relative; width: max-content; min-width: 100%; margin-bottom: 16px; }
.pdf-reader-page-status { position: absolute; top: 8px; left: 12px; padding: 4px 12px; color: var(--text-secondary); font-size: 12px; }
.pdf-reader-page-status:empty { display: none; }


.md-reader-btn.is-conversion-busy > i { animation: md-reader-convert-spin 1s linear infinite; }
.md-reader-btn.is-conversion-busy .md-reader-btn-label { display: inline !important; }
.md-reader.needs-conversion .md-reader-btn.is-conversion-busy .md-reader-btn-label::before { content: none; }
.md-reader-btn.is-conversion-busy { max-width: 100%; }
.md-reader-btn.is-conversion-busy .md-reader-btn-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap !important; }
@keyframes md-reader-convert-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .md-reader-btn.is-conversion-busy > i { animation-duration: 2s; } }

@media (max-width: 640px) {
    .md-reader .md-reader-actions [data-reader-action="save"].has-conversion-status .md-reader-btn-label { font-size: 0; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap !important; }
    .md-reader .md-reader-actions [data-reader-action="save"].has-conversion-status .md-reader-btn-label::before { content: attr(data-mobile-label); font-size: 12px; }
}

@media (max-width: 767px) {
    .md-reader-cancel { width: 44px; min-width: 44px; min-height: 44px; padding: 0; }
    .md-reader-cancel-label { display: none; }
    /* Copy is disabled during conversion; cancellation replaces reset until the job ends. */
    .md-reader.is-converting .md-reader-actions :is([data-reader-action="copy"], [data-reader-action="reset"]) { display: none; }
}

/*
 * Markdown 编辑：状态不另占一行，只是文件名旁一枚小标签（.md-reader-save-state，ReaderEditing.status 写）；
 * 失败恢复、导出结果都收进已有的控件（状态标签的菜单、导出键），工具栏下面不再有横条。
 */
.md-reader-file-title {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.md-reader-save-state {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 4px;
    min-width: 0;
    min-height: 22px;
    margin: 0;
    padding: 0 8px;
    border: 1px solid var(--kb-paper-line);
    border-radius: 999px;
    background: transparent;
    color: var(--kb-ink-muted);
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}

.md-reader-save-state[hidden] { display: none; }

.md-reader-save-state i {
    font-size: 0.875rem;
    line-height: 1;
    position: relative;
    top: calc(var(--kb-icon-optical-shift, 0.06em) - 0.04em);
}

.md-reader-save-state-text {
    position: relative;
    top: calc(-1 * var(--kb-text-optical-shift, 0.02em));
}

.md-reader-save-state[data-passive="true"] { cursor: default; }
.md-reader-save-state[data-state="saved"] { border-color: transparent; }
.md-reader-save-state[data-state="saving"] i { animation: md-reader-convert-spin 1s linear infinite; }
/* 只读只露一把锁：网页版大多数文档都只读，不必每份都写一遍 */
.md-reader-save-state[data-state="readonly"] { width: 22px; padding: 0; justify-content: center; border-color: transparent; }
.md-reader-save-state[data-state="readonly"] .md-reader-save-state-text { display: none; }
.md-reader-save-state[data-state="error"] { border-color: var(--kb-danger); background: var(--kb-danger-soft); color: var(--kb-danger); }

@media (any-hover: hover) {
    .md-reader-save-state:not([data-passive="true"]):hover { background: var(--kb-active-bg); color: var(--kb-ink); }
    .md-reader-save-state[data-state="error"]:hover { background: var(--kb-danger-soft); color: var(--kb-danger-strong); }
}

.md-reader-save-state:focus-visible { outline: 2px solid var(--kb-accent); outline-offset: 2px; }

/* iOS 生成完要再点一次才能保存：导出键换成实心下载图标、强调色 */
.md-reader-btn.is-export-ready { border-color: var(--kb-accent); color: var(--kb-accent); }

/* 编辑器包加载失败：提示与重试键就地画在编辑区 */
.md-reader-edit-error { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; height: 100%; padding: 24px; color: var(--kb-ink-muted); font-size: 0.875rem; text-align: center; }

/* A document owns its editor state; view DOM may be detached when another tab is active. */
.md-reader-edit-pane { min-height: 0; min-width: 0; overflow: hidden; }
/* 行号只是标尺：拖选正文时别把它们一起选进来（编辑区整块是 data-kb-selection="native"） */
.md-reader-edit-pane .cm-gutters { -webkit-user-select: none; user-select: none; }
/* 中间一列是全站统一的分割线（KbSplitter）：两侧宽度写在 --md-edit-left / --md-edit-right，双击回到对半 */
.md-reader.is-editable .md-reader-preview { display: grid; grid-template-columns: minmax(0, var(--md-edit-left, 1fr)) auto minmax(0, var(--md-edit-right, 1fr)); grid-template-rows: auto minmax(0,1fr); max-width: none; width: 100%; }
.md-reader.is-editable .ai-plan-preview-tabs { grid-column: 1 / -1; }
.md-reader.is-editable .ai-plan-preview-scroll { grid-column: 3; grid-row: 2; min-width: 0; }
.md-reader.is-editable .md-reader-edit-pane { grid-column: 1; grid-row: 2; }
.md-reader-edit-splitter { grid-column: 2; grid-row: 2; --kb-splitter-line: var(--kb-paper-line); }

/* 宽屏左右分栏一眼就是「左编辑、右预览」，不再要一行 tab / 说明 */
@media (min-width: 1024px) {
    .md-reader.is-editable:not(.is-edit-tabs) .md-reader-preview { grid-template-rows: minmax(0,1fr); }
    .md-reader.is-editable:not(.is-edit-tabs) .ai-plan-preview-tabs { display: none; }
    .md-reader.is-editable:not(.is-edit-tabs) :is(.ai-plan-preview-scroll, .md-reader-edit-pane, .md-reader-edit-splitter) { grid-row: 1; }

    /* 宽屏切到两个 tab（工具栏的布局键）：与窄屏同一套排法 */
    .md-reader.is-edit-tabs .md-reader-preview { grid-template-columns: minmax(0,1fr); }
    .md-reader.is-edit-tabs .ai-plan-preview-scroll, .md-reader.is-edit-tabs .md-reader-edit-pane { grid-column: 1; grid-row: 2; }
    .md-reader.is-edit-tabs .md-reader-edit-splitter { display: none; }
    .md-reader.is-edit-tabs [data-edit-mode="rich"] .md-reader-edit-pane, .md-reader.is-edit-tabs [data-edit-mode="markdown"] .ai-plan-preview-scroll { display: none; }
    .md-reader.is-edit-tabs [data-edit-mode="markdown"] .ai-plan-preview-jump { display: none; }
    /*
     * 编辑页与预览页同宽：左右留白的算法同 tab 栏（正文 980px 居中），留白加在滚动区上，滚动条仍贴窗口右边。
     * 行号悬在正文左缘之外（--md-edit-gutter 约等于行号栏宽），文字与预览、tab 左缘对齐；窗口再窄时行号不出界
     */
    .md-reader.is-edit-tabs .md-reader-edit-pane .cm-scroller {
        --md-edit-inset: max(var(--kb-detail-gutter, 1.25rem), calc((100% - var(--kb-content-max-width, 980px)) / 2));
        --md-edit-gutter: 38px;
        padding-left: max(0px, calc(var(--md-edit-inset) - var(--md-edit-gutter)));
        padding-right: max(0px, calc(var(--md-edit-inset) - 12px)); /* .cm-line 自带 12px 右内边距 */
    }
    /* 行号悬在页面中间，底色会成一根孤立的竖条 */
    .md-reader.is-edit-tabs .md-reader-edit-pane .cm-gutters { background: transparent; }
}

/* 窄屏固定两个 tab，没有可切的布局 */
.md-reader-layout-toggle[hidden] { display: none; }

@media (max-width: 1023px) {
    .md-reader-layout-toggle { display: none; }
    .md-reader.is-editable .md-reader-preview { grid-template-columns: minmax(0,1fr); }
    .md-reader.is-editable .ai-plan-preview-scroll, .md-reader.is-editable .md-reader-edit-pane { grid-column: 1; grid-row: 2; }
    .md-reader-edit-splitter { display: none; }
    .md-reader.is-editable [data-edit-mode="rich"] .md-reader-edit-pane, .md-reader.is-editable [data-edit-mode="markdown"] .ai-plan-preview-scroll { display: none; }
    .md-reader.is-editable [data-edit-mode="markdown"] .ai-plan-preview-jump { display: none; }
    .md-reader-edit-pane .cm-editor { font-size: 16px !important; }
}

/*
 * 手机：文档名与「未保存 / 保存失败」由标签页给出，工具栏一行放不下常驻的状态标签。
 * 只在保存失败时露出一枚 44px 的红色图标（恢复菜单的入口），顶掉复制键的位置（同转换期间的做法）
 */
@media (max-width: 767px) {
    .md-reader-workspace .md-reader.has-save-error .md-reader-file { display: flex; flex: 0 0 auto; }
    .md-reader-workspace .md-reader-file :is(.md-reader-file-icon, .md-reader-file-name, .md-reader-file-meta) { display: none; }
    .md-reader-workspace .md-reader-save-state { width: 44px; min-height: 44px; padding: 0; justify-content: center; border-radius: 8px; }
    .md-reader-workspace .md-reader-save-state i { font-size: 1.125rem; }
    .md-reader-workspace .md-reader-save-state-text { display: none; }
    .md-reader.has-save-error .md-reader-actions [data-reader-action="copy"] { display: none; }
}

@media (max-width: 360px) {
    .md-reader-toolbar { gap: 4px; padding-inline: 8px; }
    .md-reader-actions { gap: 4px; }
    .md-reader-actions [data-reader-action="save"] { width: 44px; min-width: 44px; padding: 0; }
    .md-reader-actions [data-reader-action="save"] .md-reader-btn-label { display: none; }
}