@charset "UTF-8";
/* ========== 全局CSS变量系统 ========== */


/* ========== 桌面端样式（>1024px） ========== */

@media (min-width: 1025px) {
    /* 主内容区布局 */
    .main {
        display: flex;
        flex: 1;
        overflow: hidden;
    }
    
    .sidebar-left {
        width: 245px;
        background-color: var(--bg-content);
        border-right: 1px solid var(--border);
        padding: var(--zj-spacing-md);
        overflow-y: auto;
        position: relative;
        transition: background-color 0.3s ease, border-color 0.3s ease;
    }
    
    .content-center {
        flex: 1;
        padding: 10px;
        padding-top: 22px;
        padding-right: 10px;
        overflow-y: auto;
        position: relative;
        transition: background-color 0.3s ease, padding-right 0.3s ease;
    }
    
    /* 右侧面板展开时，正文区让出空间 */
    body.sidebar-open .content-center {
        padding-right: 360px;
    }
    
     /* 右侧面板 */
    .sidebar-right {
        position: fixed;
        top: 146px;
        right: 0;
        bottom: 49px;
        width: 350px;
        max-width: calc(100% - 600px);
        min-width: 280px;
        background-color: var(--bg-content);
        border-left: 1px solid var(--border);
        border-bottom: 1px solid var(--border);
        overflow-y: auto;
        transition: transform 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, width 0.3s ease;
        z-index: var(--el-index-top);
        transform: translateX(100%);
        display: flex;
        flex-direction: column;
    }
    
    .sidebar-right.active {
        transform: translateX(0);
    }
    
    /* 顶部导航 */
    .top-bar {
        padding: 0.6rem 2rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
    }
    
    .nav {
        display: flex;
        align-items: center;
        gap: 0.8rem;
    }
    
    /* 功能控制栏 */
    .control-bar {
        padding: 0.5rem 2rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
    }
    
    /* 智能问答模块 */
    .qa-module h4 {
        margin-bottom: var(--zj-spacing-md);
        color: var(--accent);
    }
    
    .qa-input-group {
        display: flex;
        gap: 10px;
        margin-bottom: var(--zj-spacing-md);
    }
    
    .qa-input-group input {
        flex: 1;
        padding: 8px 12px;
        border: 1px solid var(--border);
        border-radius: var(--el-border-radius-base);
        font-family: inherit;
        background-color: var(--control-bg);
        color: var(--text-primary);
        transition: var(--el-transition-all);
    }
    
    .qa-input-group input:focus {
        outline: none;
        border-color: var(--accent);
        box-shadow: 0 0 0 2px rgba(200, 169, 96, 0.2);
    }
    
    /* 标注工具 */
    .tool-buttons {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-bottom: var(--zj-spacing-md);
    }
    
    .tool-btn {
        background-color: var(--control-bg);
        border: 1px solid var(--border);
        padding: 6px 12px;
        border-radius: var(--el-border-radius-base);
        cursor: pointer;
        font-family: inherit;
        font-size: 0.85rem;
        transition: var(--el-transition-all);
        color: var(--text-primary);
    }
    
    .tool-btn:hover {
        background-color: var(--control-hover);
        border-color: var(--accent);
        color: var(--accent);
    }
    
    .tool-btn.active {
        background-color: var(--accent);
        color: white;
        border-color: var(--accent);
    }
    
    /* 底部工具 */
    .qr-row {
        display: flex;
        gap: 20px;
        margin-bottom: var(--zj-spacing-md);
    }
    
    .qr-item {
        flex: 1;
        text-align: center;
    }

    #article-container {
        /* max-width: 1000px; */
        margin: 0 auto;
    }

    

    /* 隐藏移动端设置区域 */
    .mobile-settings {
        display: none;
    }

     /* 隐藏移动端菜单按钮 */
    .mobile-menu-btn {
        display: none;
    }
}