/* 微言微语 �?暖色纸张全宽网格 */
.weiyan-page-wrap {
    min-height: 100vh;
    background-color: #f4f1ec;
    background-image:
        radial-gradient(ellipse 900px 560px at 20% 15%, rgba(241,236,228,0.7), transparent 60%),
        radial-gradient(ellipse 720px 480px at 80% 85%, rgba(237,230,218,0.5), transparent 55%),
        repeating-linear-gradient(90deg, transparent, transparent 14px, rgba(129,97,65,0.018) 15px),
        repeating-linear-gradient(0deg, transparent, transparent 14px, rgba(129,97,65,0.014) 15px);
    padding: 16px 24px 80px;
}

.weiyan-container {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
}

/* 页头 */
.weiyan-header {
    text-align: center;
    margin-bottom: 36px;
    padding-top: 16px;
}
.weiyan-header .weiyan-title {
    margin: 0 0 8px;
    font-family: 'Iowan Old Style', 'Palatino Linotype', 'Noto Serif SC', 'STSong', ui-serif, Georgia, serif;
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: 0.06em;
    color: #6b4e3d;
}
.weiyan-header .weiyan-subtitle {
    margin: 0;
    font-size: 13px;
    color: #9e8c7c;
    letter-spacing: 0.08em;
}

/* 浮动发布按钮 */
.weiyan-float-btn-wrap {
    position: fixed;
    bottom: 32px;
    right: 72px;
    z-index: 9999;
}
.weiyan-float-btn {
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    background: #8b6f5c;
    color: #fff;
    font-size: 26px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}
.weiyan-float-btn:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 24px rgba(0,0,0,0.2);
    background: #6b4e3d;
}
.weiyan-float-btn::before {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 2px solid #b09880;
    animation: weiyan-pulse 2s ease-out infinite;
}
@keyframes weiyan-pulse {
    0%   { transform: scale(1); opacity: 1; }
    100% { transform: scale(1.3); opacity: 0; }
}

/* 弹窗遮罩 */
.weiyan-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 19999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s;
}
.weiyan-modal-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

/* 弹窗卡片 */
.weiyan-modal {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-width: 600px;
    width: 90%;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
    position: relative;
}

/* 关闭按钮 */
.weiyan-modal-close {
    position: absolute;
    top: 12px;
    right: 16px;
    background: none;
    border: none;
    font-size: 22px;
    color: #b0a090;
    cursor: pointer;
    line-height: 1;
}
.weiyan-modal-close:hover { color: #6b4e3d; }

.weiyan-modal-title {
    margin: 0 0 14px;
    font-size: 16px;
    font-weight: 500;
    color: #6b4e3d;
}

.weiyan-modal-textarea {
    width: 100%;
    border: 1px solid #e0d8cf;
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 15px;
    line-height: 1.6;
    resize: vertical;
    min-height: 150px;
    font-family: inherit;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}
.weiyan-modal-textarea:focus { border-color: #b8a088; }

.weiyan-modal-image {
    width: 100%;
    border: 1px solid #e0d8cf;
    border-radius: 8px;
    padding: 9px 14px;
    font-size: 14px;
    outline: none;
    box-sizing: border-box;
    margin-top: 8px;
    transition: border-color 0.2s;
}
.weiyan-modal-image:focus { border-color: #b8a088; }

.weiyan-modal-notice {
    font-size: 13px;
    color: #b8a090;
    margin-top: 8px;
    line-height: 1.5;
}
.weiyan-modal-error {
    font-size: 13px;
    color: #d63638;
    margin-top: 6px;
    line-height: 1.5;
}

.weiyan-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}

.weiyan-char-count {
    font-size: 12px;
    color: #b8a090;
}

.weiyan-submit-btn {
    padding: 7px 24px;
    border: none;
    border-radius: 20px;
    background: #8b6f5c;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s;
}
.weiyan-submit-btn:hover { background: #6b4e3d; }
.weiyan-submit-btn:disabled { background: #c4b5a5; cursor: not-allowed; }

.weiyan-login-hint {
    text-align: center;
    padding: 16px;
    color: #9e8c7c;
    font-size: 14px;
    margin-bottom: 20px;
}
.weiyan-login-hint a {
    color: #6b4e3d;
    text-decoration: none;
    font-weight: 500;
}

/* 瀑布流（容器为相对定位，JS 绝对定位卡片�?*/
.weiyan-list {
    position: relative;
}

/* 卡片 */
.weiyan-card {
    position: absolute;
    background: #fff;
    border-radius: 12px;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(139,99,58,0.08);
    transition: transform 0.2s, box-shadow 0.2s;
    opacity: 0;
    transform: translateY(24px);
}
.weiyan-card.weiyan-card-in {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.4s ease, transform 0.4s ease, box-shadow 0.2s, transform 0.2s;
}
.weiyan-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(139,99,58,0.12);
}

.weiyan-card-img {
    width: 100%;
    display: block;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    transition: transform 0.35s ease;
}
.weiyan-card:hover .weiyan-card-img {
    transform: scale(1.08);
}
.weiyan-card-body {
    padding: 14px 16px 16px;
}
.weiyan-card-content {
    font-size: 14px;
    line-height: 1.7;
    color: #3d2a19;
    word-break: break-word;
    white-space: pre-wrap;
}
.weiyan-card-tags {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
}
.weiyan-card-tags span {
    background: #f4f1ec;
    padding: 2px 10px;
    border-radius: 99px;
    font-size: 11px;
    color: #7a5436;
}
.weiyan-card-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid #f0ebe4;
    font-size: 12px;
    color: #a08873;
    flex-wrap: wrap;
}
.weiyan-card-meta .weiyan-card-location {
    margin-left: auto;
}
.weiyan-card-wordcount {
    font-size: 12px;
    color: #b8a088;
}

/* 加载 */
.weiyan-loader-wrap {
    margin-top: 16px;
    text-align: center;
}
.weiyan-loading {
    padding: 20px 0 40px;
    color: #c0b0a0;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.weiyan-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid #e0d8ce;
    border-top-color: #7a5436;
    border-radius: 50%;
    animation: weiyan-spin 0.8s linear infinite;
}
@keyframes weiyan-spin { to { transform: rotate(360deg); } }
.weiyan-sentinel {
    height: 1px;
}
.weiyan-end {
    text-align: center;
    padding: 20px 0 48px;
    color: #c0b0a0;
    font-size: 12px;
    letter-spacing: 0.08em;
}
.weiyan-empty {
    text-align: center;
    padding: 60px 20px;
    color: #b0a090;
    font-size: 15px;
}

/* 响应式列�?*/
@media (max-width: 600px)  {
    .weiyan-page-wrap { padding: 12px 12px 60px; }
    .weiyan-header .weiyan-title { font-size: 1.5rem; }
}

/* 置顶卡片 */
.weiyan-pin {
    display: block !important;
    padding: 24px 20px 20px !important;
    background: #fcf8f3 !important;
    border: none;
    text-align: center;
}
.weiyan-pin:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(139,99,58,0.12);
}
.weiyan-pin-identity {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}
.weiyan-pin-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    animation: weiyan-breath 4s ease-in-out infinite;
}
@keyframes weiyan-breath {
    0%   { box-shadow: 0 0 4px #ff1354; }
    25%  { box-shadow: 0 0 16px #1ebbff; }
    50%  { box-shadow: 0 0 4px #0ed39f; }
    75%  { box-shadow: 0 0 16px #4fe7f4; }
    100% { box-shadow: 0 0 4px #f35444; }
}
.weiyan-pin-name {
    font-size: 20px;
    font-weight: 600;
    color: #6b4e3d;
}
.weiyan-pin-intro {
    font-size: 14px;
    color: #b09880;
}
.weiyan-pin-body {
    text-align: left;
}
.weiyan-pin-status {
    font-size: 14px;
    line-height: 1.7;
    color: #3d2a19;
    margin-bottom: 10px;
    word-break: break-word;
}
.weiyan-pin-quote {
    font-size: 13px;
    color: #a08873;
    font-style: italic;
    line-height: 1.6;
    padding-left: 12px;
    border-left: 3px solid #e0d8cf;
}

@media (max-width: 600px) {
    .weiyan-float-btn-wrap {
        bottom: 20px;
        right: 60px;
    }
    .weiyan-float-btn {
        width: 42px;
        height: 42px;
        font-size: 22px;
    }
    .weiyan-modal {
        padding: 20px;
    }
    .weiyan-pin {
        padding: 16px;
    }
}

/* 暗色模式 */
.io-black-mode .weiyan-page-wrap {
    background: #1a1b1e;
    background-image: none;
}
.io-black-mode .weiyan-header .weiyan-title { color: #e0d5c0; }
.io-black-mode .weiyan-header .weiyan-subtitle { color: #8a7a6a; }
.io-black-mode .weiyan-card {
    background: #2c2e2f;
    box-shadow: 0 2px 12px rgba(0,0,0,0.25);
}
.io-black-mode .weiyan-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,0.35);
}
.io-black-mode .weiyan-card-content { color: #d0c8b8; }
.io-black-mode .weiyan-card-tags span {
    background: #383a3b;
    color: #b8a888;
}
.io-black-mode .weiyan-card-meta {
    border-top-color: #383a3b;
    color: #8a7a6a;
}
.io-black-mode .weiyan-card-wordcount { color: #7a6a5a; }
.io-black-mode .weiyan-loading,
.io-black-mode .weiyan-end,
.io-black-mode .weiyan-empty { color: #7a6a5a; }
.io-black-mode .weiyan-modal {
    background: #2c2e2f;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}
.io-black-mode .weiyan-modal-title { color: #e0d5c0; }
.io-black-mode .weiyan-modal-textarea,
.io-black-mode .weiyan-modal-image {
    background: #1a1b1e;
    border-color: #3a3c3d;
    color: #d0c8b8;
}
.io-black-mode .weiyan-modal-textarea:focus,
.io-black-mode .weiyan-modal-image:focus { border-color: #5a4c3a; }
.io-black-mode .weiyan-char-count { color: #6a5a4a; }
.io-black-mode .weiyan-login-hint { color: #7a6a5a; }
.io-black-mode .weiyan-login-hint a { color: #c0a888; }
.io-black-mode .weiyan-float-btn::before { border-color: #4a3c2c; }
.io-black-mode .weiyan-pin {
    background: #2a2824 !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.25);
}
.io-black-mode .weiyan-pin-name { color: #e0d5c0; }
.io-black-mode .weiyan-pin-intro { color: #8a7a6a; }
.io-black-mode .weiyan-pin-status { color: #d0c8b8; }
.io-black-mode .weiyan-pin-quote {
    color: #8a7a6a;
    border-left-color: #383a3b;
}


/* 发布弹窗富文本工具条 */
.weiyan-toolbar {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
}
.weiyan-tb-btn {
    width: 26px;
    height: 26px;
    line-height: 24px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: #5a4a3a;
    background: #fff;
    border: 1px solid #d8cfc0;
    border-radius: 6px;
    cursor: pointer;
    padding: 0;
    transition: all .15s;
}
.weiyan-tb-btn:hover { border-color: #b08d5a; color: #8a6a3a; }
.weiyan-tb-italic { font-style: italic; font-weight: 400; }

.weiyan-tb-hint { font-size: 12px; color: #a09080; margin-left: 4px; }
.io-black-mode .weiyan-tb-btn:not(.weiyan-tb-color-btn) { background: #2b2d2f; border-color: #444; color: #d0c8b8; }

.io-black-mode .weiyan-tb-hint { color: #8a8a8a; }

/* 修复：父主题全局 em,i font-style:normal 覆盖微言斜体 */
.weiyan-card-content em,
.weiyan-card-content i {
    font-style: italic;
}
.weiyan-card-content strong,
.weiyan-card-content b {
    font-weight: 700;
}
.weiyan-pin-status em,
.weiyan-pin-status i {
    font-style: italic;
}

/* 颜色按钮：渐变色块 + 预设色板弹层 */
.weiyan-tb-color-wrap { position: relative; }
.weiyan-tb-color-btn {
    background: linear-gradient(45deg, #ff4d4f 25%, #ffd666 25%, #ffd666 50%, #52c41a 50%, #52c41a 75%, #1677ff 75%);
}
.weiyan-tb-hl-btn {
    background: linear-gradient(45deg, #fff3b0 25%, #b7eb8f 25%, #b7eb8f 50%, #bae7ff 50%, #bae7ff 75%, #ffd6e7 75%);
}
.weiyan-tb-palette {
    position: absolute;
    top: 34px;
    left: 0;
    z-index: 99;
    display: grid;
    grid-template-columns: repeat(10, 18px);
    gap: 3px;
    padding: 6px;
    background: #fff;
    border: 1px solid #d8cfc0;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.weiyan-tb-swatch {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid rgba(0,0,0,.08);
}
.weiyan-tb-swatch:hover { transform: scale(1.15); box-shadow: 0 0 0 2px rgba(0,0,0,.12); }
.io-black-mode .weiyan-tb-palette { background: #2b2d2f; border-color: #444; }

/* 修复 label 默认 margin-bottom 导致的对齐偏移 */
.weiyan-tb-color { margin: 0; }

/* 工具条扩展样式 */
.weiyan-toolbar { flex-wrap: wrap; }
.weiyan-tb-code { font-weight: 400; font-size: 11px; }
.weiyan-tb-hl { background: linear-gradient(45deg, #fff3b0 25%, #b7eb8f 25%, #b7eb8f 50%, #ffd6e7 50%, #ffd6e7 75%, #bae7ff 75%); }
.weiyan-tb-emoji-wrap { position: relative; }
.weiyan-emoji-panel {
    position: absolute;
    top: 34px;
    left: 0;
    z-index: 99;
    display: grid;
    grid-template-columns: repeat(8, 26px);
    gap: 2px;
    padding: 6px;
    background: #fff;
    border: 1px solid #d8cfc0;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.weiyan-emoji-item {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    border-radius: 4px;
    cursor: pointer;
}
.weiyan-emoji-item:hover { background: #f2ede4; }
.io-black-mode .weiyan-emoji-panel { background: #2b2d2f; border-color: #444; }
.io-black-mode .weiyan-emoji-item:hover { background: #3a3c3e; }

/* 渲染样式：引用/居中/删除线/下划线/代码（父主题可能重置，作用域限定） */
.weiyan-card-content .weiyan-quote {
    border-left: 3px solid #c9a86a;
    background: rgba(201,168,106,.12);
    padding: 4px 10px;
    margin: 6px 0;
    border-radius: 0 6px 6px 0;
    color: inherit;
}
.weiyan-card-content .weiyan-center { text-align: center; }
.weiyan-card-content del { text-decoration: line-through; }
.weiyan-card-content u { text-decoration: underline; }
.weiyan-card-content code {
    font-family: Consolas, Menlo, monospace;
    font-size: 12px;
    background: rgba(0,0,0,.06);
    border-radius: 4px;
    padding: 1px 5px;
    color: #b2652a;
}
.io-black-mode .weiyan-card-content code { background: rgba(255,255,255,.08); color: #e8a06a; }
.io-black-mode .weiyan-card-content .weiyan-quote { background: rgba(201,168,106,.1); }

/* 气泡标签 */
.weiyan-card-content .weiyan-bubble {
    display: inline-block;
    padding: 1px 10px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 1.6;
    background: #f0e8da;
    color: #8a6a3a;
    border: 1px solid #e0d4bf;
    margin: 0 2px;
    vertical-align: baseline;
}
.weiyan-card-content .weiyan-bubble[style*="--bub"] {
    background: color-mix(in srgb, var(--bub) 14%, #fff);
    color: var(--bub);
    border-color: color-mix(in srgb, var(--bub) 30%, #fff);
}
.io-black-mode .weiyan-card-content .weiyan-bubble {
    background: #3a3c3e;
    color: #d0c8b8;
    border-color: #4a4c4e;
}
.weiyan-tb-tag { font-size: 13px; }

/* 链接样式：前置链接符号 + 常驻下划线 */
.weiyan-card-content a::before {
    content: '🔗';
    margin-right: 3px;
    font-size: 0.9em;
    display: inline-block;
    text-decoration: none;
}
.weiyan-card-content a {
    color: #1677ff;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}
.weiyan-card-content a:hover {
    text-decoration: underline;
}

/* 链接点击后变色 */
.weiyan-card-content a:visited {
    color: #8a63b0;
}
.io-black-mode .weiyan-card-content a:visited {
    color: #a58ac9;
}

/* 表情按钮 emoji 尺寸 */
.weiyan-tb-emoji-btn { font-size: 16px; line-height: 24px; }

/* 手动链接弹窗 */
.weiyan-link-pop {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 8px 0;
    padding: 10px;
    background: #faf7f2;
    border: 1px solid #e2d9c9;
    border-radius: 8px;
}
.weiyan-link-pop input {
    width: 100%;
    box-sizing: border-box;
    padding: 5px 8px;
    font-size: 13px;
    border: 1px solid #d8cfc0;
    border-radius: 5px;
    background: #fff;
    color: #444;
}
.weiyan-link-pop-btns { display: flex; gap: 8px; }
.weiyan-tb-mini {
    padding: 3px 14px;
    font-size: 12px;
    border: 1px solid #b08d5a;
    border-radius: 5px;
    background: #fff;
    color: #8a6a3a;
    cursor: pointer;
}
.weiyan-tb-mini:hover { background: #f5ead8; }
.io-black-mode .weiyan-link-pop { background: #2b2d2f; border-color: #444; }
.io-black-mode .weiyan-link-pop input { background: #222; border-color: #444; color: #ddd; }
.io-black-mode .weiyan-tb-mini { background: #222; border-color: #666; color: #d0c8b8; }

/* 手动链接弹窗：选区提示行 */
.weiyan-link-url-hint {
    font-size: 12px;
    color: #8a6a3a;
    word-break: break-all;
    line-height: 1.5;
}