/* ==================== X (Twitter) 原生三套官方主题变量 ==================== */
:root,
[data-theme="lights-out"] {
    color-scheme: dark;
    --bg-main: #000000;
    --bg-elevated: #16181c;
    --bg-hover: rgba(231, 233, 234, 0.06);
    --bg-card-subtle: #0d0f12;
    --bg-topbar: rgba(0, 0, 0, 0.76);
    --bg-input: #202327;
    --border-color: #2f3336;
    --text-primary: #e7e9ea;
    --text-secondary: #71767b;
    --cta-bg: #eff3f4;
    --cta-text: #0f1419;
    --cta-hover: #d7dbdc;
    --x-blue: #1d9bf0;
    --x-blue-hover: #1a8cd8;
    --x-blue-soft: rgba(29, 155, 240, 0.14);
    --x-green: #00ba7c;
    --x-green-soft: rgba(0, 186, 124, 0.14);
    --x-pink: #f91880;
    --x-pink-soft: rgba(249, 24, 128, 0.14);
    --x-amber: #ffd400;
    --x-amber-soft: rgba(255, 212, 0, 0.14);
    --x-danger: #f4212e;
    --shadow-modal: 0 0 24px rgba(255, 255, 255, 0.14);
}

[data-theme="dim"] {
    color-scheme: dark;
    --bg-main: #15202b;
    --bg-elevated: #1e2732;
    --bg-hover: rgba(247, 249, 249, 0.06);
    --bg-card-subtle: #192430;
    --bg-topbar: rgba(21, 32, 43, 0.8);
    --bg-input: #273340;
    --border-color: #38444d;
    --text-primary: #f7f9f9;
    --text-secondary: #8b98a5;
    --cta-bg: #eff3f4;
    --cta-text: #0f1419;
    --cta-hover: #d7dbdc;
    --shadow-modal: 0 8px 30px rgba(0, 0, 0, 0.45);
}

[data-theme="light"] {
    color-scheme: light;
    --bg-main: #ffffff;
    --bg-elevated: #f7f9f9;
    --bg-hover: rgba(15, 20, 25, 0.05);
    --bg-card-subtle: #f1f4f6;
    --bg-topbar: rgba(255, 255, 255, 0.88);
    --bg-input: #eff3f4;
    --border-color: #cfd9de;
    --text-primary: #0f1419;
    --text-secondary: #536471;
    --cta-bg: #0f1419;
    --cta-text: #ffffff;
    --cta-hover: #272c30;
    --x-green: #008a5c;
    --x-green-soft: rgba(0, 138, 92, 0.12);
    --x-amber: #b45309;
    --x-amber-soft: rgba(180, 83, 9, 0.12);
    --shadow-modal: 0 10px 36px rgba(15, 20, 25, 0.2);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    background: var(--bg-main);
    color: var(--text-primary);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    font-size: 15px;
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
    font-variant-numeric: tabular-nums;
}

button,
input,
select,
textarea {
    font-family: inherit;
    color: inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--x-blue);
    outline-offset: 2px;
}

a {
    color: var(--x-blue);
    text-decoration: none;
}

/* ==================== X 三栏栅格容器 ==================== */
.x-shell {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(216px, 248px) minmax(0, 680px) minmax(276px, 320px);
    justify-content: center;
    min-height: 100vh;
    min-height: 100dvh;
    min-width: 0;
}

.left-rail,
.center-feed,
.right-rail,
.tab-panel,
.x-section-card,
.profile-hero,
.profile-body {
    min-width: 0;
    max-width: 100%;
}

/* ==================== 左侧导航栏 ==================== */
.left-rail {
    position: relative;
}

.left-rail-inner {
    position: sticky;
    top: 0;
    height: 100vh;
    height: 100dvh;
    padding: 10px 14px 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow-y: auto;
}

.x-logo-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    border: none;
    padding: 10px 12px;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.16s;
}

.x-logo-btn:hover {
    background: var(--bg-hover);
}

.x-logo-svg {
    width: 28px;
    height: 28px;
    fill: var(--text-primary);
    flex-shrink: 0;
}

.brand-title {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.nav-menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 8px;
    margin-bottom: auto;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 14px;
    border-radius: 999px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 18px;
    font-weight: 500;
    text-align: left;
    transition: background 0.15s;
}

.nav-item:hover {
    background: var(--bg-hover);
}

.nav-item.active {
    font-weight: 800;
}

.nav-item.active .nav-icon {
    fill: var(--x-blue);
}

.nav-icon {
    width: 24px;
    height: 24px;
    fill: var(--text-primary);
    flex-shrink: 0;
}

.nav-badge {
    margin-left: auto;
    background: var(--x-pink);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 1px 8px;
    border-radius: 999px;
}

.rail-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 14px 0;
}

.oauth-x-icon {
    width: 16px;
    height: 16px;
    fill: currentColor;
    flex-shrink: 0;
}

.mini-logout-btn {
    margin-left: auto;
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    border-radius: 999px;
    font-size: 11.5px;
    padding: 3px 8px;
    cursor: pointer;
}

.mini-logout-btn:hover {
    color: var(--x-danger);
    border-color: var(--x-danger);
}

.rail-utility-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.rail-utility-row.single-col {
    grid-template-columns: 1fr;
}

.utility-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 10px;
    border-radius: 999px;
    border: 1px solid var(--border-color);
    background: transparent;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.utility-btn:hover {
    background: var(--bg-hover);
}

.sm-icon {
    width: 17px;
    height: 17px;
    fill: currentColor;
    flex-shrink: 0;
}

.rail-account-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 999px;
    transition: background 0.15s;
}

.rail-account-pill:hover {
    background: var(--bg-hover);
}

.rail-account-meta {
    min-width: 0;
}

.rail-account-name {
    font-weight: 700;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rail-account-handle {
    color: var(--text-secondary);
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ==================== 中间时间线主栏 ==================== */
.center-feed {
    border-left: 1px solid var(--border-color);
    border-right: 1px solid var(--border-color);
    min-height: 100vh;
    min-height: 100dvh;
    padding-bottom: 64px;
    container-type: inline-size;
    container-name: feed;
}

.sticky-topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    background: var(--bg-topbar);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border-color);
    padding: 10px 16px 8px;
}

.window-seg {
    display: inline-flex;
    background: var(--bg-input);
    border-radius: 999px;
    padding: 2px;
    flex-shrink: 0;
}

.seg-btn {
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 700;
    padding: 6px 9px;
    border-radius: 999px;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.14s, color 0.14s, transform 0.1s;
}

.seg-btn.active {
    background: var(--x-blue);
    color: #fff;
}

.icon-circle-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--border-color);
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, transform 0.1s;
}

.icon-circle-btn:hover {
    background: var(--bg-hover);
}

/* 加载条与错误提示 */
.loading-progress {
    height: 3px;
    width: 100%;
    background: var(--border-color);
    overflow: hidden;
}

.loading-progress-inner {
    height: 100%;
    width: 40%;
    background: var(--x-blue);
    animation: slideProgress 1s infinite ease-in-out;
}

@keyframes slideProgress {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(300%); }
}

.error-banner {
    margin: 12px 16px;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(244, 33, 46, 0.14);
    border: 1px solid var(--x-danger);
    color: #ff7a82;
    font-size: 14px;
}

/* ==================== X 个人主页头图卡片 ==================== */
.profile-hero {
    border-bottom: 1px solid var(--border-color);
}

.profile-cover {
    height: 126px;
    background: radial-gradient(circle at 20% 20%, rgba(29, 155, 240, 0.42), transparent 55%),
                radial-gradient(circle at 82% 30%, rgba(0, 186, 124, 0.28), transparent 55%),
                linear-gradient(135deg, #0b1622 0%, #111827 60%, #0a0c10 100%);
    position: relative;
    padding: 12px 16px;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}

.profile-body {
    padding: 0 16px 12px;
}

.profile-avatar-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: -42px;
    margin-bottom: 10px;
    position: relative;
}

.avatar-circle {
    border-radius: 50%;
    background: linear-gradient(135deg, #1d9bf0, #00ba7c);
    color: #fff;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
    user-select: none;
}

.avatar-circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar-circle.xl {
    width: 84px;
    height: 84px;
    font-size: 30px;
    border: 4px solid var(--bg-main);
}

.avatar-circle.md {
    width: 42px;
    height: 42px;
    font-size: 16px;
}

.avatar-circle.sm {
    width: 36px;
    height: 36px;
    font-size: 14px;
}

.profile-cta-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.health-score-chip {
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--x-green-soft);
    color: var(--x-green);
    font-weight: 800;
    font-size: 13px;
}

.x-outline-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 7px 15px;
    border-radius: 999px;
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.x-outline-pill:hover {
    background: var(--bg-hover);
}

.x-outline-pill.sm {
    padding: 5px 12px;
    font-size: 12px;
}

.x-outline-pill.full-w {
    width: 100%;
}

.x-blue-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 999px;
    border: 1px solid transparent;
    background: var(--x-blue);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    white-space: nowrap;
    flex-shrink: 0;
    cursor: pointer;
    transition: background 0.15s, transform 0.1s;
}

.x-blue-pill.sm {
    padding: 5px 12px;
    font-size: 12px;
}

.x-blue-pill:hover {
    background: var(--x-blue-hover);
}

.profile-name-line {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.verified-badge {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    line-height: 1;
}

.verified-badge svg {
    width: 20px;
    height: 20px;
    fill: var(--x-blue);
    vertical-align: middle;
}

.peer-row-line .verified-badge svg,
.peer-detail-handle .verified-badge svg,
.mini-peer-name .verified-badge svg {
    width: 16px;
    height: 16px;
}

.persona-pill {
    font-size: 12px;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--x-blue-soft);
    color: var(--x-blue);
}

.profile-handle-line {
    color: var(--text-secondary);
    font-size: 14px;
    margin-top: 1px;
}

.profile-bio {
    margin: 8px 0 10px;
    font-size: 14px;
    color: var(--text-primary);
    white-space: pre-line;
}

.profile-stats-row {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
}

.stat-inline strong {
    font-weight: 800;
    color: var(--text-primary);
}

.stat-inline span {
    color: var(--text-secondary);
}

.notice-strip {
    margin-top: 10px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--bg-elevated);
    color: var(--text-secondary);
    font-size: 12.5px;
    border: 1px solid var(--border-color);
}

/* ==================== 模块标签页显隐 ==================== */
.tab-panel {
    display: none;
}

.tab-panel.active {
    display: block;
}

/* ==================== KPI 与分块卡片 ==================== */
.kpi-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--border-color);
}

.kpi-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 12px 14px;
}

.kpi-label {
    color: var(--text-secondary);
    font-size: 12.5px;
    font-weight: 600;
}

.kpi-value {
    font-size: 24px;
    font-weight: 800;
    margin: 4px 0 2px;
    letter-spacing: -0.02em;
}

.kpi-value.accent-blue { color: var(--x-blue); }
.kpi-value.accent-green { color: var(--x-green); }
.kpi-value.accent-pink { color: var(--x-pink); }
.kpi-value.accent-amber { color: var(--x-amber); }

.kpi-sub {
    color: var(--text-secondary);
    font-size: 12px;
}

.x-section-card {
    padding: 16px;
    border-bottom: 1px solid var(--border-color);
}

.x-section-card.no-bottom-pad {
    padding-bottom: 0;
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
}

.section-head.wrap-gap {
    flex-wrap: wrap;
    align-items: center;
}

.section-title {
    margin: 0;
    font-size: 17px;
    font-weight: 800;
}

.section-desc {
    margin: 3px 0 0;
    color: var(--text-secondary);
    font-size: 13px;
}

.subtle-tag {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    color: var(--text-secondary);
    white-space: nowrap;
}

/* ==================== 活跃构成条与每日柱状图 ==================== */
.mix-bar-track {
    height: 12px;
    border-radius: 999px;
    background: var(--bg-input);
    overflow: hidden;
    display: flex;
}

.mix-seg {
    height: 100%;
    transition: width 0.3s ease;
}

.mix-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 10px;
    font-size: 12.5px;
    color: var(--text-secondary);
}

.chart-legend-inline {
    display: flex;
    gap: 12px;
    font-size: 12px;
    color: var(--text-secondary);
    white-space: nowrap;
}

.dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 5px;
}
.dot.blue { background: var(--x-blue); }
.dot.white { background: var(--text-primary); }
.dot.green { background: var(--x-green); }
.dot.amber { background: var(--x-amber); }

.daily-chart-box {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 178px;
    padding: 18px 8px 26px;
    background: var(--bg-elevated);
    border-radius: 16px;
    border: 1px solid var(--border-color);
    position: relative;
}

.day-col {
    flex: 1;
    min-width: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    position: relative;
    cursor: pointer;
}

.day-bar-stack {
    width: 72%;
    max-width: 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    border-radius: 4px 4px 0 0;
    overflow: hidden;
    min-height: 3px;
    background: rgba(113, 118, 123, 0.16);
}

.bar-reply {
    background: var(--x-blue);
    width: 100%;
}

.bar-post {
    background: var(--text-primary);
    width: 100%;
}

.day-label {
    position: absolute;
    bottom: -21px;
    font-size: 10px;
    color: var(--text-secondary);
    white-space: nowrap;
}

.day-col:first-child .day-label {
    left: 0;
}

.day-col:last-child .day-label {
    right: 0;
    left: auto;
}

.day-col:hover .day-bar-stack {
    filter: brightness(1.2);
    outline: 1px solid var(--x-blue);
}

/* ==================== 模块 2：推友一对一互动 PK 与列表 ==================== */
.x-mini-input {
    background: var(--bg-input);
    border: 1px solid var(--border-color);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 13px;
    outline: none;
    min-width: 185px;
}

.x-mini-input:focus {
    border-color: var(--x-blue);
}

.x-select {
    background: var(--bg-input);
    border: 1px solid var(--border-color);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 13px;
    outline: none;
    cursor: pointer;
}

.filter-pills-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.pill-chip {
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.14s;
}

.pill-chip:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.pill-chip.active {
    background: var(--x-blue-soft);
    border-color: var(--x-blue);
    color: var(--x-blue);
}

/* ==================== X 用户列表（互动榜 & 未回关列表共用） ==================== */
.x-user-list {
    margin: 0 -16px;
}

.x-user-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 13px 16px;
    border-top: 1px solid var(--border-color);
    transition: background 0.14s;
}

.x-user-row:hover {
    background: var(--bg-hover);
}

.x-user-row.clickable {
    cursor: pointer;
}

.x-user-row.selected-peer {
    background: rgba(29, 155, 240, 0.08);
}

.user-row-main {
    flex: 1;
    min-width: 0;
}

.user-row-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}

.user-ident {
    min-width: 0;
}

.user-name-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-weight: 700;
    font-size: 15px;
}

.user-handle-muted {
    color: var(--text-secondary);
    font-size: 13.5px;
    font-weight: 400;
}

.mini-tag {
    font-size: 11px;
    font-weight: 700;
    padding: 1px 8px;
    border-radius: 6px;
    background: var(--bg-input);
    color: var(--text-secondary);
}

.mini-tag.blue { background: var(--x-blue-soft); color: var(--x-blue); }
.mini-tag.green { background: var(--x-green-soft); color: var(--x-green); }
.mini-tag.pink { background: var(--x-pink-soft); color: var(--x-pink); }
.mini-tag.amber { background: var(--x-amber-soft); color: var(--x-amber); }

.snippet-quote {
    margin-top: 6px;
    font-size: 12.5px;
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sub-seg-group {
    display: inline-flex;
    background: var(--bg-input);
    padding: 3px;
    border-radius: 999px;
    max-width: 100%;
    min-width: 0;
}

.seg-tab {
    border: none;
    background: transparent;
    color: var(--text-secondary);
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.seg-tab.active {
    background: var(--bg-main);
    color: var(--text-primary);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}

.toolbar-right {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
}

/* ==================== 模块 4：黄金时段热力图与爆款推文 ==================== */
.golden-slots-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.golden-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 12px;
}

.golden-rank {
    font-size: 11.5px;
    font-weight: 800;
    color: var(--x-amber);
}

.golden-time {
    font-size: 15px;
    font-weight: 800;
    margin: 4px 0;
}

.golden-meta {
    font-size: 12px;
    color: var(--text-secondary);
}

.heatmap-container {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 14px;
}

.heatmap-header-row,
.hm-row {
    display: grid;
    grid-template-columns: 44px repeat(8, 1fr);
    gap: 5px;
    align-items: center;
}

.heatmap-header-row {
    font-size: 11px;
    color: var(--text-secondary);
    text-align: center;
    margin-bottom: 6px;
}

.heatmap-rows {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.hm-day-label {
    font-size: 12px;
    color: var(--text-secondary);
    font-weight: 600;
}

.hm-cell {
    height: 26px;
    border-radius: 6px;
    background: rgba(113, 118, 123, 0.14);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    cursor: default;
    transition: transform 0.12s;
}

.hm-cell:hover {
    transform: scale(1.06);
    outline: 1px solid var(--x-blue);
}

.format-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.format-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 13px;
}

.format-title {
    font-weight: 800;
    font-size: 14px;
}

.format-er {
    font-size: 22px;
    font-weight: 800;
    color: var(--x-blue);
    margin: 6px 0 4px;
}

.tweet-feed-list {
    margin: 0 -16px;
}

.x-tweet-card {
    padding: 14px 16px;
    border-top: 1px solid var(--border-color);
    transition: background 0.14s;
}

.x-tweet-card:hover {
    background: var(--bg-hover);
}

.tweet-top-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
    font-size: 13px;
    color: var(--text-secondary);
}

.tweet-text {
    font-size: 15px;
    line-height: 1.52;
    white-space: pre-line;
    margin: 6px 0 10px;
}

.tweet-metrics-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 520px;
    color: var(--text-secondary);
    font-size: 13px;
}

.tweet-metric-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* ==================== 模块 5：铁粉圈与战报卡 ==================== */
.share-btn-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.share-canvas-preview-wrap {
    margin-top: 6px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    background: var(--bg-card-subtle);
    aspect-ratio: 1080 / 600;
}

.share-canvas {
    display: block;
    width: 100%;
    height: auto;
}

.circle-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.circle-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 12px;
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.circle-card-body {
    min-width: 0;
    flex: 1;
}

.circle-reason {
    margin-top: 5px;
    font-size: 12px;
    color: var(--text-secondary);
}

/* ==================== 右侧辅助边栏 ==================== */
.right-rail {
    padding: 12px 18px 28px;
}

.right-rail-sticky {
    position: sticky;
    top: 12px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.side-widget {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 14px 16px;
}

.widget-title {
    margin: 0 0 10px;
    font-size: 17px;
    font-weight: 800;
}

.widget-title-sm {
    font-size: 14px;
    font-weight: 800;
}

.widget-row-between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.status-dot-label {
    font-size: 12px;
    font-weight: 700;
    color: var(--x-blue);
}

.side-muted-note {
    font-size: 12.5px;
    color: var(--text-secondary);
    margin: 8px 0 12px;
}

.action-checklist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.action-checklist li {
    font-size: 13px;
    line-height: 1.45;
    padding-left: 20px;
    position: relative;
}

.action-checklist li::before {
    content: "✦";
    position: absolute;
    left: 0;
    color: var(--x-blue);
    font-weight: 800;
}

.mini-user-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.mini-peer-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.mini-peer-left {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

/* ==================== 轻提示与空状态 ==================== */
.bottom-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--x-blue);
    color: #fff;
    padding: 10px 20px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 14px;
    z-index: 120;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
}

.empty-placeholder {
    padding: 36px 20px;
    text-align: center;
    color: var(--text-secondary);
    font-size: 14px;
}

/* ==================== 响应式适配 ==================== */
[hidden] {
    display: none !important;
}

.window-range-hint {
    font-size: 12px;
    color: var(--text-secondary);
    white-space: nowrap;
}

.day-bar-stack.is-empty {
    background: rgba(113, 118, 123, 0.22);
    min-height: 3px;
}

.side-funnel-metrics {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin: 10px 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--bg-card-subtle);
    border: 1px solid var(--border-color);
}

.funnel-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12.5px;
    color: var(--text-secondary);
}

.funnel-row strong {
    color: var(--text-primary);
    font-weight: 800;
}

.side-formula-notes {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 1.45;
}

.side-formula-notes strong {
    color: var(--text-primary);
}

.peer-row-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* ==================== X 授权登录门禁与本人专属锁定顶栏 ==================== */
.nav-menu.is-locked .nav-item {
    opacity: 0.45;
    cursor: not-allowed;
}

.auth-gate-wrap {
    padding: 36px 24px 48px;
}

.auth-gate-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 22px;
    padding: 32px 28px;
    max-width: 600px;
    margin: 0 auto;
}

.auth-gate-logo {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--bg-card-subtle);
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}

.auth-gate-logo svg {
    width: 28px;
    height: 28px;
    fill: var(--text-primary);
}

.auth-gate-title {
    margin: 0 0 10px;
    font-size: 23px;
    font-weight: 800;
    line-height: 1.3;
}

.auth-gate-desc {
    margin: 0 0 22px;
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.6;
}

.auth-policy-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

.auth-policy-item {
    background: var(--bg-card-subtle);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 13px 16px;
}

.policy-head {
    font-size: 14px;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.auth-policy-item p {
    margin: 0;
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.5;
}

.auth-policy-item code,
.oauth-setup-hint code {
    color: var(--x-blue);
    font-size: 12.5px;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.auth-gate-cta-area {
    display: flex;
    align-items: center;
}

.auth-gate-login-btn {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 22px;
    border-radius: 999px;
    border: none;
    background: var(--cta-bg);
    color: var(--cta-text);
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    transition: background 0.15s;
}

.auth-gate-login-btn:hover {
    background: var(--cta-hover);
}

.oauth-setup-hint {
    margin-top: 18px;
    padding: 14px 16px;
    border-radius: 14px;
    background: rgba(255, 212, 0, 0.08);
    border: 1px solid rgba(255, 212, 0, 0.35);
    font-size: 12.5px;
    color: var(--text-secondary);
    line-height: 1.55;
}

.oauth-setup-title {
    font-weight: 800;
    color: var(--x-amber);
    margin-bottom: 4px;
    font-size: 13px;
}

.oauth-setup-hint p {
    margin: 0;
}

.self-topbar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: nowrap;
    min-width: 0;
}

.topbar-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 5px;
}

.self-bound-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    border-radius: 999px;
    padding: 7px 14px;
    font-size: 13.5px;
}

.self-bound-pill .lock-dot {
    font-size: 12px;
    font-weight: 700;
    color: var(--x-green);
}

.delay-fixed-note {
    font-size: 12px;
    color: var(--text-secondary);
}

.delay-fixed-note strong {
    color: var(--x-amber);
}

.refresh-cooldown-btn:disabled {
    opacity: 0.62;
    cursor: not-allowed;
}

.topbar-logout-only {
    display: none;
}

.x-blue-pill.sm {
    padding: 5px 12px;
    font-size: 12px;
}

.list-load-more-row {
    display: flex;
    justify-content: center;
    padding: 14px 16px 18px;
    border-top: 1px solid var(--border-color);
}

.mini-mark-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-size: 11.5px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.14s ease;
}

.mini-mark-btn:hover {
    border-color: var(--x-blue);
    color: var(--text-primary);
    background: var(--bg-hover);
}

.mini-mark-btn.is-active {
    border-color: var(--x-green);
    color: var(--x-green);
    background: var(--x-green-soft);
}

.mini-mark-btn.is-done {
    border-color: rgba(0, 186, 124, 0.55);
    color: var(--x-green);
    background: rgba(0, 186, 124, 0.12);
}

.x-user-row.is-handled-row {
    opacity: 0.56;
}

.spotlight-quick-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--border-color);
}

.circle-card-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
}

#toggleSharePrivacyBtn.active {
    border-color: var(--x-green);
    color: var(--x-green);
    background: var(--x-green-soft);
}

/* ==================== X-Algo 推荐分发诊断与发推前草稿体检 ==================== */
.algo-health-widget {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.algo-status-banner {
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.38;
    border: 1px solid rgba(0, 186, 124, 0.35);
    background: var(--x-green-soft);
    color: var(--x-green);
}

.algo-status-banner.level-good {
    border-color: rgba(0, 186, 124, 0.35);
    background: var(--x-green-soft);
    color: var(--x-green);
}

.algo-status-banner.level-warn {
    border-color: rgba(255, 212, 0, 0.48);
    background: var(--x-amber-soft);
    color: var(--text-primary);
}

.algo-status-banner.level-alert {
    border-color: rgba(249, 24, 128, 0.42);
    background: var(--x-pink-soft);
    color: var(--x-pink);
}

.algo-side-summary {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.46;
    color: var(--text-secondary);
}

.x-outline-pill.full-w {
    display: flex;
    width: 100%;
    justify-content: center;
    text-align: center;
}

.uth-elig-note {
    font-size: 11.5px;
    line-height: 1.42;
    color: var(--text-secondary);
}

.mobile-algo-strip {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    padding: 10px 16px;
    background: var(--bg-card-subtle);
    border-bottom: 1px solid var(--border-color);
    font-size: 12.5px;
    color: var(--text-primary);
}

.pool-pct {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-secondary);
    margin-left: 3px;
}

.top-posts-head {
    align-items: center;
}

.tweet-meta-left,
.tweet-meta-right {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.tweet-orig-link {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    color: var(--x-blue);
    font-weight: 600;
    flex-shrink: 0;
}

.pool-card.oon {
    border-top: 2px solid rgba(0, 186, 124, 0.5);
}

.pool-card.innet {
    border-top: 2px solid rgba(29, 155, 240, 0.5);
}

.pool-card.low {
    border-top: 2px solid rgba(255, 212, 0, 0.5);
}

.algo-plain-tips {
    margin-top: 12px;
    padding: 11px 14px;
    border-radius: 12px;
    background: var(--bg-card-subtle);
    border: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.algo-tip-line {
    font-size: 13px;
    line-height: 1.48;
    color: var(--text-secondary);
}

.draft-media-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    border: 1px solid var(--border-color);
    background: var(--bg-elevated);
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.draft-media-toggle input[type="checkbox"] {
    accent-color: var(--x-blue);
    cursor: pointer;
    margin: 0;
}

.draft-textarea {
    width: 100%;
    min-height: 68px;
    max-height: 220px;
    resize: vertical;
    padding: 11px 14px;
    border-radius: 14px;
    border: 1px solid var(--border-color);
    background: var(--bg-input);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    outline: none;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.draft-textarea::placeholder {
    color: var(--text-secondary);
}

.draft-textarea:focus {
    border-color: var(--x-blue);
    background: var(--bg-main);
}

.draft-result-box {
    margin-top: 12px;
    padding: 13px 15px;
    border-radius: 14px;
    border: 1px solid var(--border-color);
    background: var(--bg-elevated);
}

.draft-result-box[hidden] {
    display: none !important;
}

.draft-score-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--border-color);
}

.draft-score-num {
    font-size: 16px;
    font-weight: 800;
}

.draft-check-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-size: 13px;
    line-height: 1.48;
    color: var(--text-primary);
}

.tweet-algo-signals {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 10px;
}

.algo-explain-prefix {
    font-size: 12px;
    color: var(--text-secondary);
    font-weight: 600;
}

.algo-sig-chip {
    display: inline-flex;
    align-items: center;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-primary);
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
}

/* ==================== 四档渐进断点：宽屏三栏 -> 图标三栏 -> 居中双栏 -> 手机单栏 ==================== */
@container feed (max-width: 580px) {
    .kpi-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .golden-slots-grid,
    .format-cards-grid,
    .circle-cards-grid {
        grid-template-columns: minmax(0, 1fr);
    }
    .section-head.wrap-gap > div:first-child {
        width: 100%;
    }
    .toolbar-right {
        width: 100%;
        flex-wrap: wrap;
    }
    .toolbar-right .x-mini-input {
        flex: 1 1 160px;
        min-width: 0;
    }
}

@media (max-width: 1259px) {
    .x-shell {
        max-width: 1060px;
        grid-template-columns: 72px minmax(0, 660px) minmax(264px, 300px);
        justify-content: center;
    }
    .left-rail-inner {
        align-items: center;
        padding: 10px 8px 16px;
    }
    .topbar-logout-only {
        display: inline-flex;
    }
    .brand-title,
    .nav-label,
    .left-rail .utility-btn span,
    .rail-account-meta,
    .left-rail .mini-logout-btn {
        display: none;
    }
    .x-logo-btn,
    .nav-item,
    .left-rail .utility-btn.icon-only,
    .rail-account-pill {
        width: 46px;
        height: 46px;
        padding: 0;
        justify-content: center;
        border-radius: 50%;
    }
    .rail-actions {
        width: 100%;
        align-items: center;
        margin: 12px 0;
    }
    .rail-utility-row {
        display: flex;
        justify-content: center;
    }
}

@media (max-width: 1023px) {
    .x-shell {
        max-width: 780px;
        grid-template-columns: 72px minmax(0, 680px);
        justify-content: center;
    }
    .right-rail {
        display: none;
    }
    .mobile-algo-strip {
        display: flex;
    }
}

@media (max-width: 720px) {
    .x-shell {
        max-width: 100%;
        grid-template-columns: minmax(0, 1fr);
    }
    .left-rail {
        display: none;
    }
    .kpi-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .golden-slots-grid,
    .format-cards-grid,
    .circle-cards-grid {
        grid-template-columns: minmax(0, 1fr);
    }
    .peer-row-actions {
        flex-wrap: wrap;
    }
    .heatmap-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .share-btn-row {
        width: 100%;
        flex-wrap: wrap;
    }
    .tweet-top-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
    .tweet-metrics-bar {
        flex-wrap: wrap;
        gap: 10px;
    }
}

/* ==================== X 风格精简层（单一导航、去重、简洁层级） ==================== */
.topbar-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.sticky-topbar .window-range-hint {
    margin-top: 0;
    white-space: normal;
}

.window-range-hint.is-partial {
    color: var(--x-amber, #ffd400);
}

.profile-cover {
    height: 96px;
    padding: 0;
}

.section-title {
    font-size: 20px;
    letter-spacing: -0.01em;
}

.section-desc {
    font-size: 13.5px;
    line-height: 1.45;
}

.kpi-card {
    background: transparent;
}

.kpi-value {
    font-size: 26px;
}

/* X 风格筛选胶囊：选中态实心反色 */
.pill-chip {
    font-size: 13px;
    padding: 6px 14px;
}

.pill-chip.active {
    background: var(--text-primary);
    border-color: var(--text-primary);
    color: var(--bg-main);
}

.filter-pills-row {
    gap: 8px;
}

.side-widget .widget-title {
    font-size: 20px;
    font-weight: 800;
}

#followScopeNote[hidden] {
    display: none;
}

/* ==================== 互动列表：精简行 + 行内展开详情 ==================== */
.list-hint {
    margin: 2px 0 6px;
    font-size: 12.5px;
    color: var(--text-secondary);
}

.peer-item {
    border-bottom: 1px solid var(--border-color);
}

.peer-item:last-child {
    border-bottom: none;
}

.peer-item .x-user-row.peer-row {
    border-bottom: none;
    align-items: center;
    gap: 12px;
}

.peer-item.is-open .peer-row {
    background: var(--bg-hover);
}

.peer-row-line {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}

.peer-name {
    font-weight: 700;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.peer-row-sub {
    margin-top: 3px;
    font-size: 13px;
    color: var(--text-secondary);
}

.peer-row-sub strong {
    color: var(--text-primary);
}

.peer-row .x-blue-pill,
.peer-row .x-outline-pill {
    flex-shrink: 0;
    white-space: nowrap;
}

.peer-chevron {
    width: 18px;
    height: 18px;
    fill: var(--text-secondary);
    flex-shrink: 0;
    transition: transform 0.18s ease;
}

.peer-item.is-open .peer-chevron {
    transform: rotate(180deg);
}

.peer-row:focus-visible {
    outline: 2px solid var(--x-blue);
    outline-offset: -2px;
}

.peer-detail {
    padding: 4px 16px 16px 72px;
    background: var(--bg-hover);
}

.peer-detail-summary {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 8px;
}

.peer-detail-facts {
    margin: 0 0 10px;
    padding-left: 18px;
    font-size: 13.5px;
    line-height: 1.75;
    color: var(--text-secondary);
}

.peer-detail-facts strong {
    color: var(--text-primary);
}

.peer-detail-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.peer-detail-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 9px;
    border-radius: 999px;
    background: var(--bg-card-subtle);
    border: 1px solid var(--border-color);
    font-size: 12px;
    color: var(--text-secondary);
}

.peer-detail-chip strong {
    color: var(--text-primary);
}

.peer-detail .snippet-quote {
    margin-top: 6px;
    padding: 7px 10px;
    border-radius: 10px;
    background: var(--bg-card-subtle);
    border: 1px solid var(--border-color);
    white-space: normal;
    line-height: 1.42;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.peer-detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.empty-placeholder .empty-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

@media (max-width: 720px) {
    .peer-detail {
        padding-left: 16px;
    }
    .peer-name {
        max-width: 120px;
    }
    .peer-row .user-handle-muted {
        display: none;
    }
}

/* ==================== 顶栏状态、主题按钮、未登录精简 ==================== */
.refresh-status-btn {
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 12.5px;
    padding: 5px 6px;
    cursor: default;
    white-space: nowrap;
}

.refresh-status-btn.is-cooled {
    cursor: pointer;
    border-radius: 999px;
    padding: 4px 8px;
    transition: background 0.14s, color 0.14s;
}

.refresh-status-btn.is-cooled:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.refresh-status-btn.can-refresh {
    color: var(--x-blue);
    font-weight: 700;
    border: 1px solid var(--x-blue);
    border-radius: 999px;
    padding: 4px 12px;
    cursor: pointer;
}

.refresh-status-btn.can-refresh:hover {
    background: var(--x-blue-soft);
}

.seg-btn {
    font-size: 12.5px;
    padding: 5px 10px;
}

.utility-btn.icon-only {
    justify-content: flex-start;
}

body.is-guest .right-rail-sticky,
body.is-guest .rail-utility-row {
    display: none;
}

.shortcut-footnote {
    margin: 4px 16px 16px;
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 1.8;
}

kbd {
    display: inline-block;
    min-width: 18px;
    padding: 0 5px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    font-size: 11px;
    font-family: inherit;
    text-align: center;
    color: var(--text-primary);
}

.nav-item .nav-badge {
    background: var(--x-blue);
}

/* ==================== 关注行、右栏行动、指标结论 ==================== */
.bio-one-line {
    margin-top: 3px;
    font-size: 13px;
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

#followAuditList .x-user-row {
    align-items: center;
}

#followAuditList .peer-row-actions {
    flex-shrink: 0;
}

.kpi-sub.judge-good,
.health-score-chip.judge-good {
    color: var(--x-green);
}

.kpi-sub.judge-warn,
.health-score-chip.judge-warn {
    color: var(--x-amber);
}

#opsChecklist {
    list-style: none;
    padding: 0;
    margin: 0;
}

#opsChecklist li {
    padding: 0;
    margin: 0;
}

#opsChecklist li::before {
    content: none;
}

.action-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    padding: 10px 0;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--border-color);
    color: var(--text-primary);
    font-size: 14px;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

#opsChecklist li:last-child .action-item {
    border-bottom: none;
}

.action-item:hover {
    color: var(--x-blue);
}

.action-item.tone-amber span:first-child {
    font-weight: 700;
}

.action-arrow {
    color: var(--text-secondary);
    font-size: 16px;
    flex-shrink: 0;
}

.mini-peer-name {
    font-weight: 700;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.side-more-link {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 6px 0;
    background: transparent;
    border: none;
    color: var(--x-blue);
    font-size: 14px;
    text-align: left;
    cursor: pointer;
}

.side-more-link:hover {
    text-decoration: underline;
}

/* ==================== 图标、空状态、骨架屏 ==================== */
.metric-icon {
    width: 16px;
    height: 16px;
    fill: currentColor;
    vertical-align: -3px;
    margin-right: 2px;
}

.golden-slots-grid .empty-placeholder,
.format-cards-grid .empty-placeholder,
.circle-cards-grid .empty-placeholder {
    grid-column: 1 / -1;
}

@keyframes skeletonPulse {
    0% { opacity: 0.45; }
    50% { opacity: 0.9; }
    100% { opacity: 0.45; }
}

.skeleton-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--border-color);
}

.skeleton-circle,
.skeleton-lines i,
.skeleton-block {
    background: var(--bg-input);
    animation: skeletonPulse 1.3s ease-in-out infinite;
}

.skeleton-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    flex-shrink: 0;
}

.skeleton-lines {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.skeleton-lines i {
    display: block;
    height: 10px;
    border-radius: 6px;
    width: 60%;
}

.skeleton-lines i:last-child {
    width: 85%;
}

.skeleton-block {
    height: 180px;
    border-radius: 12px;
}

#authenticatedWorkspace.is-loading .kpi-value {
    color: transparent;
    background: var(--bg-input);
    border-radius: 8px;
    width: 60%;
    animation: skeletonPulse 1.3s ease-in-out infinite;
}

/* ==================== 窄屏底部导航 ==================== */
.mobile-bottom-nav {
    display: none;
}

@media (max-width: 720px) {
    .mobile-bottom-nav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 40;
        display: flex;
        justify-content: space-around;
        background: var(--bg-topbar);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        border-top: 1px solid var(--border-color);
        padding: 2px 4px calc(2px + env(safe-area-inset-bottom));
    }
    body.is-guest .mobile-bottom-nav {
        display: none;
    }
    .bottom-tab {
        position: relative;
        flex: 1;
        min-height: 50px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 6px 2px 5px;
        background: transparent;
        border: none;
        color: var(--text-secondary);
        font-size: 11px;
        line-height: 1.15;
        cursor: pointer;
    }
    .bottom-tab svg {
        width: 22px;
        height: 22px;
        fill: currentColor;
        transition: transform 0.14s ease, fill 0.14s ease;
    }
    .bottom-tab.active {
        color: var(--text-primary);
        font-weight: 700;
    }
    .bottom-tab.active svg {
        fill: var(--x-blue);
    }
    .bottom-tab.active::before {
        content: "";
        position: absolute;
        top: -2px;
        left: 50%;
        transform: translateX(-50%);
        width: 24px;
        height: 3px;
        border-radius: 999px;
        background: var(--x-blue);
    }
    .bottom-tab:active svg {
        transform: scale(0.92);
    }
    .bottom-badge {
        position: absolute;
        top: 2px;
        left: calc(50% + 6px);
        min-width: 16px;
        padding: 0 4px;
        border-radius: 999px;
        background: var(--x-blue);
        color: #fff;
        font-size: 10px;
        font-style: normal;
        line-height: 16px;
        text-align: center;
    }
    .center-feed {
        border-left: none;
        border-right: none;
        width: 100%;
        max-width: 680px;
        margin: 0 auto;
        padding-bottom: calc(74px + env(safe-area-inset-bottom));
    }
    #followAuditList .x-user-row {
        flex-wrap: wrap;
    }
}

/* 左栏折叠为图标时，仅保留「互动」紧急角标，避免非紧急数字遮挡图标 */
@media (max-width: 1259px) {
    .nav-item {
        position: relative;
    }
    .nav-item .nav-badge {
        display: inline-block;
        position: absolute;
        top: 3px;
        right: 3px;
        margin: 0;
        padding: 0 5px;
        font-size: 10px;
        line-height: 16px;
    }
    .nav-item .nav-badge[hidden],
    #navUnfollowBadge {
        display: none;
    }
}

/* ==================== 桌面细节与手机端全视口对齐精修 ==================== */
/* 未登录态：隐藏两侧空边栏与竖线，展示居中的官方风格授权卡片并保留主题切换 */
body.is-guest .left-rail,
body.is-guest .right-rail {
    display: none;
}

body.is-guest .x-shell {
    display: block;
    max-width: 580px;
}

body.is-guest .center-feed {
    border-left: none;
    border-right: none;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-bottom: 24px;
}

body.is-guest .auth-gate-wrap {
    margin: auto 0;
    width: 100%;
}

.auth-gate-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.auth-gate-head .auth-gate-logo {
    margin-bottom: 0;
}

.gate-theme-btn {
    padding: 6px 12px;
    font-size: 12.5px;
    color: var(--text-secondary);
}

/* 左栏角标主次区分：「互动」待办蓝底醒目，「关注」未回关灰底克制 */
#navUnfollowBadge {
    background: var(--bg-input);
    color: var(--text-secondary);
    font-weight: 600;
}

/* 下拉框统一 X 原生胶囊外观 */
.x-select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2371767b'%3E%3Cpath d='M3.543 8.96l1.414-1.42L12 14.59l7.043-7.05 1.414 1.42L12 17.41 3.543 8.96z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 13px;
}

/* 白天主题高对比度修正 */
[data-theme="light"] .error-banner {
    color: #c8102e;
    background: rgba(244, 33, 46, 0.08);
}

[data-theme="light"] .oauth-setup-hint {
    background: rgba(180, 83, 9, 0.07);
    border-color: rgba(180, 83, 9, 0.32);
}

[data-theme="light"] .algo-status-banner.level-warn {
    border-color: rgba(180, 83, 9, 0.35);
    color: #92400e;
}

/* 图表与热力图点按高亮及明细读数 */
.hm-cell {
    cursor: pointer;
}

.day-col.is-selected {
    background: rgba(29, 155, 240, 0.1);
    border-radius: 6px;
}

.day-col.is-selected .day-label {
    color: var(--x-blue);
    font-weight: 700;
}

.day-col.is-selected .day-bar-stack,
.hm-cell.is-selected {
    outline: 2px solid var(--x-blue);
    filter: brightness(1.18);
}

.daily-chart-box,
#heatmapGridRows {
    touch-action: pan-y;
}

.section-desc.is-readout {
    color: var(--text-primary);
    font-weight: 600;
}

.peer-detail-handle {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    font-size: 12.5px;
    color: var(--text-secondary);
    margin-bottom: 5px;
}

.peer-detail-name {
    font-weight: 700;
    color: var(--text-primary);
}

.draft-score-title-group,
.draft-score-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* 桌面端隐藏顶栏移动主题按钮与窄屏「本期行动」副本 */
.topbar-theme-only,
.mobile-ops-card {
    display: none;
}

#mobileOpsChecklist {
    list-style: none;
    padding: 0;
    margin: 6px 0 0;
}

#mobileOpsChecklist li {
    padding: 0;
    margin: 0;
}

#mobileOpsChecklist li::before {
    content: none;
}

#mobileOpsChecklist li:last-child .action-item {
    border-bottom: none;
    padding-bottom: 2px;
}


/* ==================== 可关闭错误横幅、触控微交互与无障碍动效降级 ==================== */
.error-banner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.error-banner-text {
    flex: 1;
    min-width: 0;
    line-height: 1.45;
}

.loading-slow-strip {
    margin: 10px 16px 0;
}

.error-close-btn {
    border: none;
    background: transparent;
    color: currentColor;
    opacity: 0.8;
    font-size: 19px;
    line-height: 1;
    min-width: 34px;
    min-height: 34px;
    margin: -6px -6px -6px 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    cursor: pointer;
    flex-shrink: 0;
}

.error-close-btn:hover {
    opacity: 1;
    background: rgba(244, 33, 46, 0.12);
}

button,
a,
input,
select,
textarea,
label,
[role="button"],
.peer-row,
.day-col,
.hm-cell {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.auth-gate-login-btn:active,
.seg-btn:active,
.seg-tab:active,
.pill-chip:active,
.x-blue-pill:active,
.x-outline-pill:active,
.mini-mark-btn:active,
.utility-btn:active,
.icon-circle-btn:active,
.unlock-info-btn:active,
.refresh-status-btn:active,
.action-item:active {
    transform: scale(0.97);
}

.oauth-setup-hint {
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.oauth-setup-hint code {
    overflow-wrap: anywhere;
    word-break: break-all;
}

.window-seg-wrap .window-seg,
.heatmap-container,
.schedule-quick-chips {
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
}


.oauth-setup-hint.is-pulse {
    border-color: var(--x-amber);
    box-shadow: 0 0 0 2px var(--x-amber-soft);
}

.profile-bio,
.tweet-text,
.peer-row-sub,
.peer-detail-summary,
.peer-detail-facts,
.section-desc {
    overflow-wrap: anywhere;
}

/* ==================== 作者说明与关注引导弹窗（第 3 次 & 未关注逢 10 次） ==================== */
.author-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 115;
    background: rgba(91, 112, 131, 0.42);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

[data-theme="light"] .author-modal-backdrop {
    background: rgba(15, 20, 25, 0.45);
}

.author-modal-card {
    width: 100%;
    max-width: 430px;
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    background: var(--bg-main);
    border: 1px solid var(--border-color);
    border-radius: 20px;
    box-shadow: var(--shadow-modal);
}

.author-modal-cover {
    height: 68px;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    background: radial-gradient(circle at 18% 25%, rgba(29, 155, 240, 0.44), transparent 58%),
                radial-gradient(circle at 85% 30%, rgba(0, 186, 124, 0.3), transparent 58%),
                linear-gradient(135deg, #0b1622 0%, #131c2b 65%, #090c10 100%);
}

.author-modal-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.56);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #f7f9f9;
    font-size: 12px;
    font-weight: 700;
}

.author-modal-close {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: rgba(15, 20, 25, 0.68);
    color: #ffffff;
    font-size: 20px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.author-modal-close:hover {
    background: rgba(15, 20, 25, 0.88);
}

.author-modal-body {
    padding: 0 20px 20px;
}

.author-profile-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    margin-top: -30px;
    margin-bottom: 8px;
}

.author-profile-row .avatar-circle.xl {
    width: 64px;
    height: 64px;
    font-size: 24px;
    border: 3px solid var(--bg-main);
}

.author-ident-block {
    margin-bottom: 6px;
}

.author-name-line {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 18px;
    font-weight: 800;
    color: var(--text-primary);
}

.author-handle-line {
    font-size: 13.5px;
    color: var(--text-secondary);
}

.author-bio-text {
    margin: 6px 0 8px;
    font-size: 13.5px;
    line-height: 1.48;
    color: var(--text-primary);
    overflow-wrap: anywhere;
}

.author-stats-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 10px;
    font-size: 13px;
    color: var(--text-secondary);
}

.author-stats-row strong {
    color: var(--text-primary);
    font-weight: 800;
}

.author-note-box {
    margin: 10px 0 14px;
    padding: 12px 14px;
    border-radius: 14px;
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
}

.author-note-title {
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 800;
    color: var(--text-primary);
}

.author-note-msg {
    margin: 0;
    font-size: 13px;
    line-height: 1.52;
    color: var(--text-secondary);
    overflow-wrap: anywhere;
}

.author-modal-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.author-follow-cta {
    padding: 11px 18px;
    font-size: 15px;
    text-decoration: none;
}

.author-follow-cta:hover {
    color: var(--cta-text);
}

.author-modal-sub-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.author-modal-sub-actions > * {
    flex: 1 1 0%;
    text-align: center;
}

/* ==================== 模块 6：图文定时发布工作台与二次确认弹窗 ==================== */
.overdue-banner {
    margin: 10px 16px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    border-color: var(--x-amber);
    background: var(--x-amber-soft);
    color: var(--text-primary);
    font-weight: 600;
}

.schedule-reauth-card {
    border-color: var(--x-amber);
    background: var(--x-amber-soft);
}

.schedule-lock-card {
    border-color: var(--x-amber);
    background: var(--x-amber-soft);
}

.schedule-eligibility-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.x-section-card.is-locked-card {
    opacity: 0.62;
}

.schedule-textarea {
    width: 100%;
    min-height: 92px;
    max-height: 260px;
    resize: vertical;
    padding: 11px 14px;
    border-radius: 14px;
    border: 1px solid var(--border-color);
    background: var(--bg-input);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    outline: none;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.schedule-textarea::placeholder {
    color: var(--text-secondary);
}

.schedule-textarea:focus {
    border-color: var(--x-blue);
    background: var(--bg-main);
}

.schedule-draft-stack {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.schedule-draft-item {
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 12px;
    background: var(--bg-card-subtle);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.schedule-draft-stack.is-single .schedule-draft-item {
    border: none;
    border-radius: 0;
    padding: 0;
    background: transparent;
}

.schedule-draft-item.is-active {
    border-color: rgba(29, 155, 240, 0.55);
}

.schedule-draft-item.has-conflict {
    border-color: rgba(244, 33, 46, 0.65);
}

.schedule-draft-item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}

.schedule-draft-head-left,
.schedule-draft-head-right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.schedule-seq-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    background: rgba(29, 155, 240, 0.14);
    color: var(--x-blue);
    font-size: 12px;
    font-weight: 700;
}

.schedule-gap-tag {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--bg-elevated);
    color: var(--text-secondary);
}

.schedule-gap-tag.is-ok {
    background: var(--x-green-soft);
    color: var(--x-green);
}

.schedule-gap-tag.is-conflict {
    background: rgba(244, 33, 46, 0.14);
    color: var(--x-danger);
    font-weight: 600;
}

[data-theme="light"] .schedule-gap-tag.is-conflict,
[data-theme="light"] .mini-tag.danger {
    color: #c8102e;
    background: rgba(244, 33, 46, 0.1);
}

.schedule-queue-head {
    align-items: center;
}

.schedule-queue-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.schedule-draft-remove-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-size: 16px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.schedule-draft-remove-btn:hover {
    border-color: rgba(244, 33, 46, 0.5);
    color: #f4212e;
    background: rgba(244, 33, 46, 0.08);
}

.schedule-draft-item-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.schedule-time-input.is-conflict {
    border-color: rgba(244, 33, 46, 0.8);
}

.schedule-media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
    gap: 10px;
    margin-top: 10px;
}

.schedule-media-thumb {
    position: relative;
    border-radius: 12px;
    border: 1px solid var(--border-color);
    background: var(--bg-elevated);
    overflow: hidden;
    aspect-ratio: 16 / 10;
}

.schedule-media-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.schedule-media-remove {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: rgba(15, 20, 25, 0.82);
    color: #ffffff;
    font-size: 16px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.schedule-media-remove:hover {
    background: rgba(244, 33, 46, 0.92);
}

.schedule-media-caption {
    position: absolute;
    left: 6px;
    bottom: 6px;
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(15, 20, 25, 0.72);
    color: #ffffff;
    font-size: 11px;
}

.schedule-compose-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.schedule-compose-left,
.schedule-compose-right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.schedule-time-input {
    min-width: 190px;
    min-height: 36px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid var(--border-color);
    background: var(--bg-input);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 13.5px;
    outline: none;
    transition: border-color 0.15s ease;
}

.schedule-time-input:focus {
    border-color: var(--x-blue);
}

.schedule-quick-chips {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.schedule-footnote {
    margin: 10px 0 0;
    font-size: 12px;
    color: var(--text-secondary);
}

.schedule-job-list {
    display: flex;
    flex-direction: column;
}

.schedule-job-card {
    padding: 14px 16px;
    border-top: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.schedule-job-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

.schedule-job-time {
    font-size: 12.5px;
    color: var(--text-secondary);
}

.schedule-job-text {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-primary);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.schedule-job-media {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.schedule-job-media img {
    width: 92px;
    height: 64px;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid var(--border-color);
    background: var(--bg-elevated);
}

.schedule-job-alert {
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 12.5px;
    border: 1px solid var(--border-color);
    background: var(--bg-elevated);
    color: var(--text-primary);
    overflow-wrap: anywhere;
}

.schedule-job-alert.is-overdue {
    border-color: var(--x-amber);
    background: var(--x-amber-soft);
}

.schedule-job-alert.is-danger {
    border-color: var(--x-danger);
    background: rgba(244, 33, 46, 0.12);
}

.schedule-job-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.schedule-reschedule-box {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px;
    border-radius: 12px;
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
}

.mini-tag.danger {
    background: rgba(244, 33, 46, 0.14);
    color: var(--x-danger);
}

.confirm-resend-card {
    max-width: 480px;
}

.confirm-resend-body {
    padding: 16px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.confirm-resend-title {
    margin: 0;
    font-size: 17px;
    font-weight: 800;
    color: var(--text-primary);
}

.confirm-resend-reason {
    margin: 0;
    font-size: 13.5px;
    color: var(--text-secondary);
}

.overdue-uncertain-box {
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    border-color: var(--x-danger);
    background: rgba(244, 33, 46, 0.12);
    color: var(--text-primary);
}

.confirm-resend-meta {
    font-size: 12.5px;
    color: var(--text-secondary);
}

.confirm-resend-preview {
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    font-size: 14px;
    line-height: 1.5;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    max-height: 180px;
    overflow-y: auto;
}

.confirm-resend-media-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.confirm-resend-media-grid img {
    width: 84px;
    height: 60px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--border-color);
}

.confirm-resend-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

/* ==================== 每日累计解锁引导、作者开源声明与顶部 5 维度 ==================== */
.author-note-msg {
    white-space: pre-line;
}

.window-seg-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
}

.window-seg-wrap .window-seg {
    overflow-x: auto;
    scrollbar-width: none;
    max-width: 100%;
}

.window-seg-wrap .window-seg::-webkit-scrollbar {
    display: none;
}

.seg-btn.is-locked {
    color: var(--text-muted);
    opacity: 0.78;
    background: transparent;
}

.seg-btn.is-locked:hover {
    opacity: 1;
    color: var(--text-primary);
}

.unlock-info-btn {
    flex-shrink: 0;
    border: 1px solid var(--x-blue);
    background: var(--x-blue-soft);
    color: var(--x-blue);
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, transform 0.1s;
}

.unlock-info-btn:hover {
    background: rgba(29, 155, 240, 0.22);
}

.topbar-sub-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.sub-link-dot {
    color: var(--text-muted);
}

.link-inline-btn {
    border: none;
    background: transparent;
    padding: 0;
    color: var(--x-blue);
    font-size: inherit;
    font-family: inherit;
    cursor: pointer;
}

.link-inline-btn:hover {
    text-decoration: underline;
}

.refresh-status-btn.is-quota-exhausted {
    color: var(--x-amber);
    border: 1px solid rgba(255, 212, 0, 0.42);
    border-radius: 999px;
    padding: 4px 10px;
    cursor: pointer;
}

.refresh-status-btn.is-quota-exhausted:hover {
    background: rgba(255, 212, 0, 0.12);
}

.unlock-guide-card {
    max-width: 540px;
}

.unlock-guide-body {
    padding: 14px 20px 20px;
}

.unlock-guide-title {
    margin: 0 0 10px;
    font-size: 17px;
    font-weight: 800;
    color: var(--text-primary);
}

.unlock-status-card {
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--x-blue-soft);
    border: 1px solid rgba(29, 155, 240, 0.28);
    font-size: 12.5px;
    line-height: 1.55;
    color: var(--text-primary);
    margin-bottom: 10px;
}

.unlock-focus-strip {
    padding: 9px 12px;
    border-radius: 10px;
    background: rgba(255, 212, 0, 0.12);
    border: 1px solid rgba(255, 212, 0, 0.35);
    color: var(--text-primary);
    font-size: 12.5px;
    line-height: 1.48;
    margin-bottom: 10px;
}

.unlock-rule-list {
    margin: 0 0 12px;
    padding-left: 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--text-secondary);
}

.unlock-rule-list strong {
    color: var(--text-primary);
}

.unlock-rule-list a {
    color: var(--x-blue);
    text-decoration: none;
}

.unlock-rule-list a:hover {
    text-decoration: underline;
}


/* ==================== 自解释布局与交互增强 ==================== */
body.modal-open {
    overflow: hidden;
}

.author-modal-close {
    margin-left: auto;
}

.unlock-guide-card .author-modal-cover,
.confirm-resend-card .author-modal-cover {
    height: 48px;
    padding: 9px 12px;
}

.golden-card[data-golden-slot] {
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.12s ease;
}

.golden-card[data-golden-slot]:hover,
.golden-card[data-golden-slot]:focus-visible {
    border-color: var(--x-blue);
    background: var(--bg-hover);
}

.golden-card[data-golden-slot]:active {
    transform: scale(0.985);
}

.golden-rank {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.golden-sched-hint {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--x-blue);
    opacity: 0.72;
    transition: opacity 0.15s ease;
}

.golden-card[data-golden-slot]:hover .golden-sched-hint {
    opacity: 1;
}

#scheduleComposeCard.is-dragover {
    outline: 2px dashed var(--x-blue);
    outline-offset: -4px;
    background: var(--x-blue-soft);
}

/* ==================== 响应式断点与触控终端覆盖层（置于文件末尾确保级联优先级） ==================== */
@media (max-width: 1023px) {
    .mobile-ops-card:not([hidden]) {
        display: block;
    }
}

@media (max-width: 720px) {
    /* 1. 顶栏紧凑单行排布 + 补齐手机端主题切换入口与安全区触控热区 */
    .sticky-topbar {
        padding: max(8px, env(safe-area-inset-top)) 12px 6px;
    }
    .self-topbar-row {
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 6px;
        min-width: 0;
    }
    .seg-btn {
        min-height: 34px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 5px 10px;
        font-size: 12.5px;
    }
    .topbar-actions {
        gap: 5px;
        min-width: 0;
    }
    .refresh-status-btn {
        min-height: 34px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        padding: 4px 6px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 112px;
    }
    .refresh-status-btn.can-refresh,
    .refresh-status-btn.is-quota-exhausted {
        min-height: 34px;
        padding: 4px 10px;
        font-size: 12px;
        max-width: none;
        flex-shrink: 0;
    }
    .topbar-theme-only {
        display: inline-flex;
        width: 34px;
        height: 34px;
    }
    .topbar-theme-only .sm-icon {
        width: 16px;
        height: 16px;
    }
    .mini-logout-btn.topbar-logout-only {
        min-height: 34px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 4px 10px;
        font-size: 12px;
        flex-shrink: 0;
    }
    .topbar-meta-row {
        flex-wrap: nowrap;
        gap: 8px;
        margin-top: 3px;
    }
    .sticky-topbar .window-range-hint {
        margin-top: 0;
        font-size: 11.5px;
    }
    #topbarWindowHint {
        flex: 1 1 auto;
        min-width: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .topbar-sub-links {
        flex-shrink: 0;
        flex-wrap: nowrap;
        gap: 5px;
    }
    #storedReportLink,
    #openAuthorStoryBtn {
        min-height: 28px;
        padding: 3px 2px;
        display: inline-flex;
        align-items: center;
        white-space: nowrap;
    }
    .error-banner,
    .overdue-banner,
    .loading-slow-strip {
        margin: 8px 12px 0;
    }

    /* 2. 切换到「互动 / 关注 / 内容 / 战报」时自动收起个人头图，首屏直达目标内容 */
    #authenticatedWorkspace:not([data-active-tab="activity"]) .profile-hero {
        display: none;
    }

    /* 「活跃」首页保留精简版个人头图，让首屏同时露出核心 KPI */
    .profile-cover {
        height: 44px;
    }
    .profile-body {
        padding: 0 12px 10px;
    }
    .profile-avatar-row {
        margin-top: -24px;
        margin-bottom: 6px;
        flex-wrap: wrap;
        gap: 8px;
    }
    .avatar-circle.xl {
        width: 52px;
        height: 52px;
        font-size: 20px;
        border-width: 3px;
    }
    .profile-cta-group {
        gap: 6px;
        flex-wrap: wrap;
    }
    .health-score-chip {
        min-height: 34px;
        display: inline-flex;
        align-items: center;
        padding: 4px 10px;
        font-size: 12px;
    }
    .profile-cta-group .x-outline-pill {
        min-height: 34px;
        padding: 5px 12px;
        font-size: 12.5px;
    }
    .profile-name-line {
        font-size: 17.5px;
        gap: 5px;
    }
    #profileDisplayName {
        min-width: 0;
        overflow-wrap: anywhere;
    }
    .persona-pill {
        white-space: nowrap;
        flex-shrink: 0;
        font-size: 11.5px;
        padding: 2px 8px;
    }
    .section-head {
        margin-bottom: 10px;
        gap: 8px;
    }
    .section-title {
        font-size: 16px;
        line-height: 1.28;
    }
    .subtle-tag {
        flex-shrink: 0;
        font-size: 11.5px;
        padding: 3px 9px;
    }
    #trendChartSubtitle {
        min-height: 19px;
    }
    #mobileAlgoStatusText {
        cursor: pointer;
    }
    .skeleton-block {
        height: 156px;
    }
    .empty-placeholder {
        padding: 20px 12px;
        font-size: 13px;
    }
    .profile-bio {
        font-size: 13px;
        line-height: 1.42;
        margin: 5px 0 7px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        cursor: pointer;
    }
    .profile-bio.is-expanded {
        display: block;
        -webkit-line-clamp: unset;
        overflow: visible;
    }
    .profile-stats-row {
        gap: 5px 11px;
        font-size: 12.5px;
    }
    .notice-strip {
        margin-top: 8px;
        padding: 7px 10px;
        font-size: 12px;
    }
    .mobile-algo-strip {
        padding: 9px 12px;
        gap: 8px;
        flex-wrap: nowrap;
    }
    #mobileAlgoStatusText {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 12.5px;
        line-height: 1.38;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .mobile-algo-strip.level-good {
        border-left: 3px solid var(--x-green);
    }
    .mobile-algo-strip.level-warn {
        border-left: 3px solid var(--x-amber);
    }
    .mobile-algo-strip.level-alert {
        border-left: 3px solid var(--x-pink);
    }
    .action-item {
        min-height: 44px;
        padding: 10px 2px;
        font-size: 14px;
        line-height: 1.35;
    }
    .action-arrow {
        font-size: 18px;
    }
    .mix-legend {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px 12px;
        font-size: 12px;
    }

    /* 3. 筛选胶囊单行横向顺滑滑动（无负外边距撑宽，严格约束在卡片宽度内） */
    .filter-pills-row {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        flex-wrap: nowrap;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        margin-left: 0;
        margin-right: 0;
        padding: 0 0 4px;
    }
    .filter-pills-row::-webkit-scrollbar {
        display: none;
    }
    .filter-pills-row .pill-chip {
        flex-shrink: 0;
        white-space: nowrap;
        scroll-snap-align: start;
    }
    .x-outline-pill.sm,
    .x-blue-pill.sm,
    .pill-chip {
        min-height: 36px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* 4. 分段栏与搜索工具栏撑满宽度，输入框 16px 防止移动端聚焦自动缩放 */
    .section-head.wrap-gap > div:first-child {
        width: 100%;
        min-width: 0;
    }
    #followStateTabs {
        display: flex;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
    #followStateTabs .seg-tab {
        flex: 1 1 0%;
        min-width: 0;
        min-height: 36px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 6px 6px;
        font-size: 12.5px;
    }
    .toolbar-right #exportFollowCsvBtn {
        min-height: 38px;
        flex-shrink: 0;
        padding: 6px 12px;
    }
    #relationshipContinueControls {
        margin: 0 0 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 8px 12px;
    }
    .toolbar-right {
        width: 100%;
        flex-wrap: nowrap;
        gap: 6px;
    }
    .toolbar-right .x-mini-input {
        flex: 1 1 0%;
        min-width: 0;
        min-height: 38px;
        padding: 6px 12px;
    }
    .toolbar-right .x-select {
        flex: 0 0 auto;
        max-width: 124px;
        min-height: 38px;
        padding: 6px 26px 6px 10px;
    }
    .x-mini-input,
    .x-select,
    .draft-textarea,
    .schedule-textarea,
    .schedule-time-input {
        font-size: 16px;
    }
    .schedule-draft-item {
        padding: 10px;
    }
    .schedule-draft-remove-btn,
    .schedule-media-remove {
        width: 34px;
        height: 34px;
    }
    .schedule-media-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    .schedule-draft-item-foot {
        gap: 8px;
    }
    .schedule-draft-item-foot .schedule-compose-left {
        width: 100%;
        justify-content: space-between;
    }
    .schedule-draft-item-foot .schedule-compose-right {
        width: 100%;
    }
    .schedule-time-input {
        width: 100%;
        min-width: 0;
        min-height: 40px;
        border-radius: 12px;
    }
    .schedule-quick-chips {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
        padding-bottom: 2px;
    }
    .schedule-quick-chips::-webkit-scrollbar {
        display: none;
    }
    .schedule-quick-chips .pill-chip {
        flex-shrink: 0;
        white-space: nowrap;
        scroll-snap-align: start;
    }
    .schedule-compose-toolbar {
        flex-wrap: nowrap;
        gap: 8px;
    }
    .schedule-compose-toolbar .schedule-compose-right {
        flex: 1 1 0%;
    }
    #clearScheduleDraftBtn {
        min-height: 42px;
        padding: 0 16px;
    }
    #createScheduleBtn {
        width: 100%;
        min-height: 42px;
        font-size: 14.5px;
        font-weight: 800;
    }

    /* 5. 互动与关注列表行触控排版优化（彻底防止昵称+标签+按钮同排溢出） */
    .peer-item .x-user-row.peer-row {
        align-items: center;
        gap: 10px;
        padding: 12px 14px;
        width: 100%;
        min-width: 0;
    }
    .peer-row .avatar-circle.md,
    #followAuditList .avatar-circle.md {
        width: 38px;
        height: 38px;
        font-size: 14px;
    }
    .peer-name {
        max-width: 100%;
        flex: 0 1 auto;
        min-width: 0;
    }
    .peer-row .peer-ext-link {
        min-height: 36px;
        padding: 6px 12px;
        font-size: 12.5px;
        align-self: center;
    }
    .peer-chevron {
        width: 16px;
        height: 16px;
        align-self: center;
    }
    .list-load-more-row button {
        width: 100%;
        min-height: 40px;
    }
    #followAuditList .x-user-row {
        align-items: flex-start;
        gap: 10px;
        padding: 12px 14px;
        width: 100%;
        min-width: 0;
    }
    #followAuditList .user-handle-muted {
        max-width: 120px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    #followAuditList .user-row-main {
        flex: 1 1 180px;
        min-width: 0;
    }
    #followAuditList .peer-row-actions {
        width: 100%;
        padding-left: 48px;
        margin-top: 2px;
        justify-content: flex-start;
        gap: 8px;
    }
    #followAuditList .x-user-row:has(.peer-row-actions > :only-child) {
        flex-wrap: nowrap;
        align-items: center;
    }
    #followAuditList .peer-row-actions:has(> :only-child) {
        width: auto;
        padding-left: 0;
        margin-top: 0;
        flex-shrink: 0;
    }
    #followAuditList .mini-mark-btn,
    #followAuditList .follow-go-link {
        min-height: 36px;
        padding: 6px 13px;
        font-size: 12.5px;
    }

    /* 6. KPI、柱状图、热力图、战报按钮与底部轻提示适配 */
    .kpi-grid-4 {
        padding: 10px 12px;
        gap: 8px;
    }
    .kpi-card {
        background: var(--bg-card-subtle);
        padding: 10px 12px;
        border-radius: 14px;
        min-width: 0;
    }
    .kpi-value {
        font-size: 22px;
    }
    .kpi-sub {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .daily-chart-box {
        gap: 2px;
        height: 156px;
        padding: 14px 8px 26px;
        max-width: 100%;
    }
    .day-bar-stack {
        width: 82%;
    }
    .heatmap-container {
        padding: 10px;
        max-width: 100%;
    }
    .heatmap-header-row,
    .hm-row {
        min-width: 0;
        grid-template-columns: 32px repeat(8, minmax(0, 1fr));
        gap: 3px;
    }
    .heatmap-header-row {
        font-size: 9.5px;
    }
    .hm-day-label {
        font-size: 11px;
    }
    .hm-cell {
        height: 34px;
        font-size: 10.5px;
        border-radius: 6px;
    }
    #nextGoldenWindowBadge {
        max-width: 100%;
        white-space: normal;
        line-height: 1.35;
    }
    .golden-slots-grid {
        gap: 8px;
        margin-bottom: 12px;
    }
    .golden-card {
        padding: 10px 12px;
    }
    .golden-time {
        font-size: 14.5px;
        margin: 2px 0;
    }
    #formatCardsGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    #algoReachPoolsGrid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }
    #algoReachPoolsGrid .format-card {
        padding: 10px 8px;
    }
    #algoReachPoolsGrid .format-title {
        font-size: 12px;
    }
    #algoReachPoolsGrid .format-er {
        font-size: 18px;
        margin: 4px 0 2px;
    }
    .draft-media-toggle {
        min-height: 36px;
        padding: 5px 12px;
    }
    .draft-media-toggle input[type="checkbox"] {
        width: 16px;
        height: 16px;
    }
    #topPostSortSelect {
        min-height: 36px;
        max-width: 124px;
        padding: 5px 26px 5px 10px;
    }
    .x-tweet-card .tweet-top-meta {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 6px;
    }
    .x-tweet-card .tweet-text {
        font-size: 14px;
        line-height: 1.48;
        margin: 5px 0 8px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 5;
        overflow: hidden;
        cursor: pointer;
    }
    .x-tweet-card .tweet-text.is-expanded {
        display: block;
        -webkit-line-clamp: unset;
        overflow: visible;
    }
    .x-tweet-card .tweet-metrics-bar {
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 4px;
        font-size: 12px;
        max-width: 100%;
    }
    .x-tweet-card .tweet-metric-item {
        gap: 3px;
    }
    .share-btn-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: 8px;
    }
    .share-btn-row > button {
        min-height: 38px;
    }
    .share-btn-row #postToXIntentLink {
        grid-column: 1 / -1;
        min-height: 40px;
        font-size: 14px;
        font-weight: 800;
    }
    .share-canvas-preview-wrap {
        border-radius: 12px;
        margin-top: 8px;
    }
    .circle-card {
        padding: 10px 12px;
        gap: 10px;
    }
    .circle-card .avatar-circle.md {
        width: 38px;
        height: 38px;
        font-size: 14px;
    }
    .author-modal-backdrop {
        align-items: flex-end;
        padding: 0;
    }
    .author-modal-card {
        max-width: 100%;
        max-height: 88dvh;
        border-radius: 22px 22px 0 0;
        border-left: none;
        border-right: none;
        border-bottom: none;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        padding-bottom: env(safe-area-inset-bottom);
    }
    .author-modal-cover {
        position: relative;
    }
    .author-modal-cover::before {
        content: "";
        position: absolute;
        top: 7px;
        left: 50%;
        transform: translateX(-50%);
        width: 36px;
        height: 4px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.36);
    }
    .unlock-guide-body,
    .confirm-resend-body {
        padding: 12px 16px 18px;
    }
    .confirm-resend-actions {
        width: 100%;
    }
    .confirm-resend-actions > * {
        flex: 1 1 0%;
        min-height: 42px;
    }
    .auth-gate-wrap {
        min-height: 100dvh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: max(20px, env(safe-area-inset-top)) 16px max(28px, env(safe-area-inset-bottom));
    }
    .auth-gate-card {
        width: 100%;
        padding: 22px 18px;
        border-radius: 20px;
    }
    .auth-gate-title {
        font-size: 21px;
        margin-bottom: 12px;
    }
    .gate-theme-btn {
        min-height: 36px;
        padding: 6px 12px;
    }
    .auth-gate-login-btn {
        width: 100%;
        min-height: 48px;
        justify-content: center;
        font-size: 15.5px;
    }
    [data-theme="light"] .mobile-bottom-nav {
        background: rgba(255, 255, 255, 0.94);
        box-shadow: 0 -2px 12px rgba(15, 20, 25, 0.06);
    }
    .overdue-banner {
        flex-wrap: nowrap;
        padding: 8px 12px;
    }
    #goOverdueScheduleBtn {
        flex-shrink: 0;
        min-height: 34px;
    }
    .schedule-lock-card .section-head > a,
    .schedule-reauth-card .section-head > button {
        width: 100%;
        min-height: 40px;
    }
    .schedule-job-card {
        padding: 12px 14px;
        gap: 8px;
    }
    .schedule-reschedule-box input[type="datetime-local"] {
        width: 100%;
        min-height: 40px;
        border-radius: 10px;
    }
    .schedule-reschedule-box button {
        flex: 1 1 0%;
        min-height: 38px;
    }
    .bottom-toast {
        bottom: calc(64px + env(safe-area-inset-bottom));
        width: max-content;
        max-width: calc(100vw - 24px);
        padding: 10px 16px;
        border-radius: 14px;
        white-space: normal;
        text-align: center;
        line-height: 1.4;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 720px) {
    .self-topbar-row {
        flex-wrap: nowrap;
        gap: 6px;
    }
    .window-seg-wrap {
        flex: 1 1 auto;
        min-width: 0;
    }
    .topbar-actions {
        margin-left: auto;
        flex-shrink: 0;
    }
    .seg-btn {
        min-height: 34px;
        min-width: 42px;
        padding: 5px 8px;
        font-size: 12px;
    }
    .unlock-info-btn {
        min-height: 34px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 4px 9px;
        font-size: 11.5px;
    }
}

/* 超窄屏与折叠外屏专精适配（Galaxy Z Fold 6 折叠态 344px、iPhone SE 375px、320px） */
@media (max-width: 390px) {
    .sticky-topbar {
        padding: max(7px, env(safe-area-inset-top)) 10px 6px;
    }
    .self-topbar-row {
        gap: 4px;
    }
    .seg-btn {
        min-height: 34px;
        min-width: 40px;
        padding: 4px 7px;
        font-size: 11.5px;
    }
    .seg-btn.is-locked {
        padding: 4px 6px;
        font-size: 11px;
        letter-spacing: -0.02em;
    }
    .topbar-actions {
        gap: 4px;
    }
    .refresh-status-btn {
        min-height: 34px;
        font-size: 11.5px;
        max-width: 84px;
        padding: 4px 5px;
    }
    .refresh-status-btn.can-refresh,
    .refresh-status-btn.is-quota-exhausted {
        min-height: 34px;
        padding: 4px 8px;
        font-size: 11.5px;
    }
    .topbar-theme-only {
        width: 34px;
        height: 34px;
    }
    .mini-logout-btn.topbar-logout-only {
        min-height: 34px;
        padding: 4px 8px;
        font-size: 11.5px;
    }
    .x-section-card {
        padding: 14px 12px;
    }
    .x-section-card.no-bottom-pad {
        padding-bottom: 0;
    }
    .x-user-list,
    .tweet-feed-list {
        margin: 0 -12px;
    }
    .peer-item .x-user-row.peer-row,
    #followAuditList .x-user-row,
    .x-tweet-card {
        padding: 11px 12px;
        gap: 8px;
    }
    .peer-detail {
        padding: 4px 12px 14px 12px;
    }
    #followAuditList .peer-row-actions {
        padding-left: 46px;
    }
    #followStateTabs .seg-tab {
        font-size: 11.5px;
        padding: 6px 3px;
    }
    .kpi-grid-4 {
        padding: 10px 12px;
        gap: 8px;
    }
    .kpi-card {
        padding: 10px;
    }
    .kpi-value {
        font-size: 20px;
    }
    .kpi-sub {
        font-size: 11.5px;
        line-height: 1.35;
    }
    .heatmap-header-row,
    .hm-row {
        grid-template-columns: 28px repeat(8, minmax(0, 1fr));
        gap: 2px;
    }
    #algoReachPoolsGrid .format-er {
        font-size: 16.5px;
    }
    .x-tweet-card .tweet-metrics-bar {
        font-size: 11.5px;
    }
    .schedule-compose-toolbar {
        gap: 6px;
    }
    .schedule-job-card {
        padding: 11px 12px;
    }
}

/* 手机横屏与低高度视口紧凑适配（667×375、740×360、852×393 等首屏完整展示按钮） */
@media (max-height: 560px) {
    .auth-gate-wrap {
        padding: 12px 16px 16px;
    }
    .auth-gate-card {
        padding: 16px 20px;
        border-radius: 18px;
        max-width: 640px;
    }
    .auth-gate-head {
        margin-bottom: 10px;
    }
    .auth-gate-logo {
        width: 38px;
        height: 38px;
        border-radius: 10px;
    }
    .auth-gate-logo svg {
        width: 20px;
        height: 20px;
    }
    .auth-gate-title {
        font-size: 18px;
        margin-bottom: 6px;
    }
    .auth-gate-desc {
        font-size: 13px;
        margin-bottom: 12px;
    }
    .auth-policy-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
        gap: 8px;
        margin-bottom: 12px;
    }
    .auth-policy-item {
        padding: 9px 12px;
    }
    .auth-policy-item p {
        font-size: 12px;
    }
    .auth-gate-login-btn {
        padding: 10px 18px;
        font-size: 14.5px;
    }
}

@media (max-width: 390px) {
    .author-modal-body {
        padding: 0 14px 16px;
    }
    .author-modal-sub-actions {
        gap: 6px;
    }
}

@media (max-height: 560px) {
    .author-modal-card {
        max-height: 92dvh;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    .author-modal-cover {
        height: 48px;
        padding: 8px 12px;
    }
    .author-profile-row {
        margin-top: -22px;
    }
    .author-profile-row .avatar-circle.xl {
        width: 48px;
        height: 48px;
        font-size: 18px;
    }
    .author-modal-body {
        padding: 0 16px 14px;
    }
    .author-note-box {
        margin: 8px 0 10px;
        padding: 9px 12px;
    }
}

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

@media (hover: none) and (pointer: coarse) {
    .pill-chip:hover:not(.active) {
        background: transparent;
        color: var(--text-secondary);
    }
    .x-outline-pill:hover,
    .x-user-row:hover {
        background: transparent;
    }
    .golden-sched-hint {
        opacity: 0.92;
    }
}