* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "Microsoft YaHei", Arial, sans-serif;
    background: #f0f2f5;
    overflow: hidden;
}

/* Vue v-cloak 防止模板闪烁 */
[v-cloak] {
    display: none !important;
}

/* 加载提示 */
#loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    color: white;
}

#loading-screen .spinner {
    width: 50px;
    height: 50px;
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-bottom: 20px;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

#loading-screen .loading-text {
    font-size: 18px;
    font-weight: 500;
}

#app {
    height: 100vh;
    display: flex;
    flex-direction: column;
}

/* 顶部导航 - 简洁科技风格 */
.top-navbar {
    height: 60px;
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 30px;
    color: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    position: relative;
}

.top-navbar h1 {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-navbar .user-info {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-shrink: 0;
}

.top-navbar .user-info span {
    padding: 5px 15px;
    background: rgba(255,255,255,0.15);
    border-radius: 15px;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}

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

/* 移动端适配 */
@media (max-width: 768px) {
    .mobile-menu-btn {
        display: inline-block;
        flex-shrink: 0;
    }

    .top-navbar {
        height: 50px;
        padding: 0 10px;
        gap: 8px;
    }

    .top-navbar h1 {
        font-size: 14px;
        gap: 5px;
        flex: 1;
        min-width: 0;
    }

    .top-navbar .user-info {
        gap: 8px;
    }

    .top-navbar .user-info span {
        padding: 3px 6px;
        font-size: 11px;
        max-width: 70px;
    }

    .top-navbar .user-info .el-button {
        padding: 4px 8px;
        font-size: 11px;
        white-space: nowrap;
    }
    
    .top-navbar .user-info .el-button span {
        display: inline; /* 确保按钮文字显示 */
    }
}

/* 超小屏幕适配 */
@media (max-width: 360px) {
    .top-navbar {
        padding: 0 8px;
    }

    .top-navbar h1 {
        font-size: 12px;
    }

    .top-navbar .user-info span {
        display: none; /* 超小屏幕隐藏用户名 */
    }

    .top-navbar .user-info .el-button {
        padding: 4px 6px;
        font-size: 10px;
    }
}

/* 主容器 */
.main-container {
    flex: 1;
    display: flex;
    overflow: hidden;
}

/* 左侧导航 */
.sidebar {
    width: 200px;
    background: #fff;
    border-right: 1px solid #e6e6e6;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.sidebar-menu {
    border-right: none;
    height: 100%;
}

.sidebar-menu .el-menu-item {
    height: 50px;
    line-height: 50px;
}

.sidebar-menu .el-menu-item i {
    margin-right: 8px;
    font-size: 16px;
}

/* 移动端适配时隐藏 */
@media (max-width: 768px) {
    .sidebar {
        display: none;
    }
}

/* 右侧内容区 */
.content-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.content-wrapper {
    flex: 1;
    overflow-y: auto;
    padding: 15px;
    padding-bottom: 70px; /* 为底部固定操作栏留出空间 */
}

/* 配置面板 */
.config-panel {
    background: white;
    border-radius: 4px;
    padding: 20px;
    margin-bottom: 15px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}


/* 题型选择器 */
.type-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.type-selector .el-checkbox-button {
    margin: 0;
}

.type-selector .el-checkbox-button__inner {
    padding: 8px 12px;
    font-size: 13px;
}

.type-selector .el-checkbox-button__inner i {
    margin-right: 4px;
}

/* 确保选中状态显示蓝色背景 */
.type-selector .el-checkbox-button.is-checked .el-checkbox-button__inner {
    background-color: #409eff;
    border-color: #409eff;
    color: #fff;
    box-shadow: -1px 0 0 0 #409eff;
}

.type-selector .el-checkbox-button.is-checked:first-child .el-checkbox-button__inner {
    border-left-color: #409eff;
}

.type-hint {
    font-size: 12px;
    color: #909399;
    margin-top: 8px;
}

/* 底部固定操作栏 */
.fixed-action-bar {
    position: fixed;
    bottom: 0;
    left: 200px; /* 侧边栏宽度 */
    right: 0;
    height: 50px;
    background: #fff;
    border-top: 1px solid #e6e6e6;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.08);
    z-index: 100;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.action-bar-content {
    display: flex;
    gap: 10px;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.action-bar-content .el-button {
    margin: 0;
}

.action-bar-stats {
    margin-left: auto;
    padding: 0 15px;
    font-size: 14px;
    color: #606266;
}

.action-bar-stats .stats-text {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.action-bar-stats strong {
    color: #409eff;
    font-size: 16px;
    font-weight: 600;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .fixed-action-bar {
        left: 0;
    }
}

/* 文档选择器新样式 */
.document-selector-new {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.doc-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.doc-stats {
    margin-left: auto;
    font-size: 13px;
    color: #606266;
}

.doc-stats strong {
    color: #409eff;
    font-size: 16px;
}

.doc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
    max-height: 480px;
    overflow-y: auto;
    padding: 4px;
}

.doc-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    background: #fafafa;
    border: 2px solid #e4e7ed;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.doc-card:hover {
    background: #f0f7ff;
    border-color: #b3d8ff;
}

.doc-card.selected {
    background: #ecf5ff;
    border-color: #409eff;
}

.doc-card > i:first-child {
    font-size: 20px;
    color: #909399;
    flex-shrink: 0;
}

.doc-card.selected > i:first-child {
    color: #409eff;
}

.doc-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.doc-name {
    font-size: 13px;
    color: #303133;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.check-icon {
    font-size: 18px;
    color: #409eff;
    opacity: 0;
    transition: opacity 0.3s;
}

.doc-card.selected .check-icon {
    opacity: 1;
}

.doc-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 40px;
    color: #909399;
    font-size: 14px;
}

.doc-empty i {
    font-size: 48px;
    display: block;
    margin-bottom: 10px;
}

.doc-actions {
    display: flex;
    gap: 8px;
}

/* 页面容器样式 */
.page-container {
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.page-header {
    font-size: 20px;
    font-weight: 600;
    color: #303133;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 16px;
    border-bottom: 2px solid #f0f0f0;
}

.page-header i {
    font-size: 24px;
    color: #667eea;
}

.policy-list {
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 公众留言样式 */
.messages-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.message-item {
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 8px;
    padding: 20px;
    transition: box-shadow 0.3s;
}

.message-item:hover {
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
}

.message-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f0f0f0;
}

.message-date {
    color: #8a8a8a;
    font-size: 14px;
    font-weight: 500;
    min-width: 100px;
}

.message-title {
    font-size: 18px;
    color: #333;
    font-weight: 600;
    text-decoration: none;
    flex: 1;
    transition: color 0.3s;
}

.message-title:hover {
    color: #409eff;
}

.message-content {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.consult-section,
.reply-section {
    padding: 15px;
    border-radius: 6px;
}

.consult-section {
    background: #f9f9f9;
    border-left: 3px solid #409eff;
}

.reply-section {
    background: #f0f9ff;
    border-left: 3px solid #67c23a;
}

.section-label {
    color: #184B7A;
    font-size: 15px;
    display: block;
    margin-bottom: 8px;
}

.section-text {
    color: #333;
    font-size: 14px;
    line-height: 1.8;
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
}

.reply-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e1f0ff;
    font-size: 13px;
}

.reply-date {
    color: #8a8a8a;
}

.reply-org {
    color: #184B7A;
    font-weight: 500;
}

/* iframe 页面样式 */
.iframe-page {
    height: 100%;
    width: 100%;
    position: relative;
}

.iframe-container {
    width: 100%;
    height: calc(100vh - 60px); /* 减去顶部导航栏高度 */
    position: relative;
    overflow: hidden;
    background: #fff;
}

.external-iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    /* 隐藏顶部内容，向上偏移 */
    margin-top: -120px;
    height: calc(100% + 120px);
}

.document-selector {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.document-selector__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.document-selector__buttons .el-button + .el-button {
    margin-left: 8px;
}

.document-selector__stats {
    font-size: 12px;
    color: #606266;
}

.document-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.document-selector__list {
    border: 1px solid #e4e7ed;
    border-radius: 6px;
    padding: 10px;
    background: #fcfcfd;
    position: relative;
}

.document-checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.document-item {
    padding: 10px;
    border-radius: 6px;
    background: #f5f7fa;
    transition: all 0.2s;
    border: 1px solid transparent;
}

.document-item.is-selected {
    border-color: #409eff;
    background: #f0f9ff;
    box-shadow: 0 2px 6px rgba(64,158,255,0.2);
}

.document-item__content {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.document-item__title {
    font-weight: 600;
    color: #303133;
}

.document-item__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    font-size: 12px;
    color: #909399;
}

.document-item__filename {
    font-size: 12px;
    color: #909399;
}

.document-empty,
.document-loading {
    text-align: center;
    padding: 20px 0;
    color: #909399;
    font-size: 13px;
}

.document-empty i,
.document-loading i {
    margin-right: 6px;
}

.panel-title {
    font-size: 16px;
    font-weight: 600;
    color: #303133;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #e4e7ed;
}

/* 题目卡片 */
.question-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 10px; /* Reduced gap */
}

.question-card {
    background: white;
    border-radius: 8px;
    padding: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    transition: all 0.3s;
    border: 1px solid #e4e7ed;
    min-height: 400px; /* Minimum height */
    height: auto; /* Adaptive height */
    display: flex;
    flex-direction: column;
}

.question-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    transform: translateY(-2px);
}

.question-body {
    flex: 1;
    overflow: visible; /* Allow content to expand */
    padding-right: 0;
    margin-bottom: 15px;
}

.question-footer {
    flex: none; /* Don't force percentage height */
    background: #f9fafc;
    border-top: 1px solid #e4e7ed;
    margin: 0 -10px -10px -10px;
    padding: 15px;
    border-radius: 0 0 8px 8px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    overflow: visible; /* Allow content to expand */
}

.footer-section {
    display: block;
    height: auto;
    overflow: visible;
    padding-right: 0;
    border-right: none;
    border-bottom: 1px dashed #ebeef5;
    padding-bottom: 15px;
}

.footer-section:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.footer-label {
    font-size: 13px;
    font-weight: 600;
    color: #606266;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    height: auto;
}

.success-text { color: #67c23a; }
.warning-text { color: #e6a23c; }

/* Override previous box styles inside footer */
.question-footer .source-box, 
.question-footer .answer-box, 
.question-footer .analysis-box {
    background: transparent;
    padding: 0;
    margin: 0;
    border: none;
    box-shadow: none;
    min-height: auto;
    max-height: none;
}

.question-footer .collapsible-header {
    background: transparent;
    margin: 0 0 8px 0;
    padding: 0;
    justify-content: space-between;
    height: auto;
}

.question-footer .collapsible-header:hover {
    background: transparent;
    opacity: 0.8;
}

.question-footer .collapsible-content {
    padding: 0 0 0 22px; /* Indent content */
    color: #303133;
    font-size: 13px;
    line-height: 1.6;
    flex: none;
    overflow-y: visible;
}

.source-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-left: 22px;
    flex: none;
    overflow-y: visible;
}

.source-file-tag {
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-color: #e4e7ed;
    background-color: white;
    color: #606266;
    margin: 0;
}

.question-card.selected {
    border: 2px solid #409eff;
    background: #f0f7ff;
    box-shadow: 0 4px 12px rgba(64, 158, 255, 0.2);
}

.question-card.generating {
    border: 2px dashed #409eff;
    background: #f0f9ff;
    opacity: 0.8;
}

@keyframes rotating {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.generating-indicator {
    margin-top: 10px;
    padding: 10px;
    background: rgba(64, 158, 255, 0.1);
    border-radius: 4px;
}

.question-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e4e7ed;
}

.question-number {
    width: 28px;
    height: 28px;
    background: #409eff;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
}

.question-content {
    font-size: 16px;
    line-height: 1.8;
    color: #303133;
    margin-bottom: 15px;
    font-weight: 500;
}

.question-options {
    margin: 10px 0 0 0;
}

.option-item {
    padding: 8px 12px;
    margin: 6px 0;
    background: #f5f7fa;
    border-radius: 4px;
    border-left: 3px solid #dcdfe6;
    font-size: 14px;
    color: #606266;
    line-height: 1.6;
}

.answer-box {
    background: #f0f9ff;
    padding: 15px;
    border-radius: 6px;
    margin: 12px 0;
    border-left: 4px solid #67c23a;
    display: flex;
    flex-direction: column;
    min-height: 120px;
    max-height: 220px;
    overflow: hidden;
    overflow-y: auto;
}

.analysis-box {
    background: #fef0f0;
    padding: 15px;
    border-radius: 6px;
    margin: 12px 0;
    border-left: 4px solid #e6a23c;
    display: flex;
    flex-direction: column;
    min-height: 120px;
    max-height: 220px;
    overflow: hidden;
    overflow-y: auto;
}

/* 底部固定栏 */
.bottom-bar {
    height: 60px;
    background: white;
    border-top: 1px solid #e4e7ed;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 20px;
    gap: 10px;
    box-shadow: 0 -2px 4px rgba(0,0,0,0.05);
}

/* 滚动条样式 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Element UI 自定义 */
.el-form-item {
    margin-bottom: 18px;
}

.el-tag {
    margin-right: 8px;
}

/* 文档来源和关键词样式 */
.source-box, .keywords-box {
    margin: 12px 0;
    padding: 15px;
    background: #f5f7fa;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.8;
    border-left: 4px solid #909399;
    display: flex;
    flex-direction: column;
    min-height: 80px;
    max-height: 180px;
    overflow: hidden;
    overflow-y: auto;
}

.source-box strong, .keywords-box strong {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
}

/* 折叠样式 */
.collapsible-header {
    cursor: pointer;
    user-select: none;
    padding: 0;
    margin-bottom: 10px;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
}

.collapsible-header:hover {
    opacity: 0.8;
}

.collapsible-header i {
    transition: transform 0.3s;
    font-size: 14px;
    margin-left: auto;
}

.collapsible-content {
    padding: 0;
    margin-top: 8px;
    line-height: 1.8;
    animation: slideDown 0.3s ease;
    flex: 1;
    overflow-y: auto;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 配置卡片样式 */
.config-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.config-card {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid #e4e7ed;
    transition: all 0.3s;
}

.config-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    transform: translateY(-2px);
}

.config-card-title {
    font-size: 15px;
    font-weight: 600;
    color: #303133;
    margin-bottom: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.config-card-title i {
    color: #409eff;
    font-size: 18px;
}

.config-card-title small {
    font-weight: 400;
    color: #909399;
    font-size: 12px;
}

.config-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 16px 20px;
    border-radius: 12px;
    border: 1px solid #e4e7ed;
    background: #ffffff;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.config-panel-title h2 {
    margin: 0;
    font-size: 20px;
    color: #1f2d3d;
}

.config-panel-title p {
    margin: 4px 0 0;
    color: #606266;
    font-size: 13px;
}

.config-panel-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* 新的布局结构 */
.config-layout-split {
    display: flex;
    gap: 20px;
    align-items: stretch; /* Ensure columns have equal height */
}

.config-column-left {
    flex: 1; /* Takes up remaining space, usually wider for documents */
    display: flex;
    flex-direction: column;
    gap: 15px;
    min-width: 0; /* Prevent flex item from overflowing */
}

.config-column-right {
    width: 320px; /* Fixed width for settings and actions */
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* 让文档配置卡片撑满左侧剩余高度（如果需要） */
.document-config-card {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.document-selector.redesigned {
    flex: 1; /* Make the list expand */
    display: flex;
    flex-direction: column;
}

.document-selector__list {
    flex: 1; /* List takes up space */
    max-height: 400px; /* Limit height but allow scroll */
    overflow-y: auto;
}

/* 操作面板样式 */
.action-card {
    background: #f0f9ff; /* Highlight background */
    border: 1px solid #b3d8ff;
    margin-top: auto; /* Push to bottom if parent has height */
}

.action-buttons-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.action-buttons-grid .el-button {
    margin: 0 !important; /* Override Element UI default margins */
    height: 40px;
    font-size: 14px;
}

/* 移动端适配 */
@media (max-width: 992px) {
    .config-layout-split {
        flex-direction: column;
    }
    
    .config-column-right {
        width: 100%;
    }
}

.question-type-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.config-metric-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}

.metric-item--inline {
    flex: 1;
    min-width: 240px;
}

.metric-item--difficulty .el-radio-group {
    display: inline-flex;
}

.metric-item label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    color: #303133;
}

.metric-control {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.metric-hint {
    font-size: 12px;
    color: #909399;
}

.display-settings {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.document-mode-switch {
    margin-bottom: 16px;
}

.document-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ebeef5;
}

.document-toolbar__group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.document-toolbar__stats {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #606266;
}

.document-toolbar__stats strong {
    color: #409eff;
}

.document-toolbar__stats .divider {
    color: #dcdfe6;
}

.document-filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    margin: 16px 0;
}

.document-selector.redesigned {
    border: 1px solid #e4e7ed;
    border-radius: 10px;
    padding: 16px;
    background: #fdfdff;
}

.random-selector .metric-item {
    margin-bottom: 16px;
}

.random-selector .metric-item:last-child {
    margin-bottom: 0;
}

.random-selector {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 12px;
}

.document-config-card {
    height: 100%;
}

@media (max-width: 900px) {
    .config-panel-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .config-panel-actions {
        width: 100%;
        justify-content: flex-start;
    }
}


.type-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.param-grid {
    display: grid;
    gap: 16px;
}

.param-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.param-item label {
    font-size: 13px;
    color: #606266;
    font-weight: 500;
}

.param-tip {
    font-size: 12px;
    color: #909399;
    margin-top: 4px;
}

.display-settings {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.config-tip {
    margin-top: 12px;
    padding: 8px 12px;
    background: #f4f4f5;
    border-radius: 6px;
    font-size: 12px;
    color: #606266;
    display: flex;
    align-items: center;
    gap: 6px;
}

.config-tip i {
    color: #409eff;
}

.action-buttons {
    display: flex;
    gap: 12px;
    justify-content: center;
    padding: 20px 0;
}

.generate-btn {
    min-width: 140px;
    font-weight: 600;
}

/* 题目布局 */
.question-layout {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 20px;
    align-items: start;
}

.question-main {
    min-width: 0;
}

.question-aside {
    min-width: 0;
}

.question-content {
    font-size: 15px;
    line-height: 1.8;
    color: #303133;
    margin-bottom: 12px;
    font-weight: 500;
}

.question-options {
    margin: 0;
}

.option-item {
    padding: 8px 12px;
    margin: 6px 0;
    background: #f5f7fa;
    border-radius: 6px;
    border-left: 3px solid #dcdfe6;
    font-size: 14px;
    color: #606266;
    line-height: 1.6;
    transition: all 0.2s;
    cursor: pointer; /* Enable pointer cursor */
}

.option-item:hover {
    background: #ecf5ff;
    border-left-color: #409eff;
}

.option-item.selected {
    background: #ecf5ff;
    border-left-color: #409eff;
    color: #409eff;
    font-weight: 500;
}

.option-item.correct {
    background: #f0f9eb;
    border-left-color: #67c23a;
    color: #67c23a;
    font-weight: 500;
}

.option-item.wrong {
    background: #fef0f0;
    border-left-color: #f56c6c;
    color: #f56c6c;
    font-weight: 500;
}

.judgment-options {
    display: flex;
    gap: 15px;
    margin: 10px 0;
}


.answer-box {
    background: linear-gradient(135deg, #f0f9ff 0%, #e6f7ff 100%);
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
    border-left: 4px solid #67c23a;
    transition: all 0.3s;
}

.answer-box:hover {
    box-shadow: 0 2px 8px rgba(103, 194, 58, 0.2);
}

.analysis-box {
    background: linear-gradient(135deg, #fffbf0 0%, #fff7e6 100%);
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
    border-left: 4px solid #e6a23c;
    transition: all 0.3s;
}

.analysis-box:hover {
    box-shadow: 0 2px 8px rgba(230, 162, 60, 0.2);
}

.source-box {
    background: #f5f7fa;
    padding: 12px;
    border-radius: 8px;
    font-size: 12px;
}

.source-section {
    margin-bottom: 8px;
}

.source-section:last-child {
    margin-bottom: 0;
}

.source-section strong {
    display: block;
    color: #606266;
    margin-bottom: 6px;
    font-size: 12px;
}

.source-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.collapsible-header {
    cursor: pointer;
    user-select: none;
    padding: 8px 12px;
    margin: -12px -12px 8px -12px;
    background: rgba(255,255,255,0.5);
    border-radius: 6px 6px 0 0;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.collapsible-header:hover {
    background: rgba(255,255,255,0.8);
}

.collapsible-header strong {
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.collapsible-header i {
    font-size: 14px;
}

.collapsible-content {
    padding: 8px 12px;
    line-height: 1.7;
    font-size: 13px;
    color: #606266;
}

/* 历史记录样式 */
.history-item-header {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 5px 0;
}

.history-item-info {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 15px;
}

.history-item-info strong {
    color: #303133;
}

.history-item-tags {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.history-item-count {
    color: #909399;
    font-size: 13px;
}

.history-item-date {
    color: #909399;
    font-size: 12px;
}

.history-delete-btn {
    margin-left: 10px;
}

/* 默认显示PC端视图，隐藏移动端视图 */
.history-mobile-view {
    display: none;
}

.history-pc-view {
    display: flex;
}

/* 移动端简化元数据样式 */
.history-mobile-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #909399;
    margin-top: 5px;
}

/* 历史记录表格容器 */
.history-table-container {
    padding: 15px;
    background: #f9f9f9;
}

/* 表格内题目内容单元格 */
.question-content-cell {
    line-height: 1.6;
}

.content-text {
    font-size: 14px;
    color: #303133;
    margin-bottom: 8px;
    word-break: break-word;
}

.options-list {
    margin-top: 8px;
    padding-left: 10px;
}

.option-item-small {
    font-size: 13px;
    color: #606266;
    padding: 3px 0;
    line-height: 1.5;
}

/* 答案文本样式 */
.answer-text {
    color: #67c23a;
    font-weight: 600;
    font-size: 14px;
}

/* 源文件单元格 */
.source-files-cell {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
}

.source-file-tag-small {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.no-source, .no-analysis {
    color: #c0c4cc;
    font-size: 12px;
}

/* 解析弹窗样式 */
.analysis-popover {
    line-height: 1.8;
}

.analysis-popover strong {
    color: #e6a23c;
    display: block;
    margin-bottom: 8px;
}

.analysis-popover p {
    margin: 0;
    color: #606266;
    font-size: 14px;
}

/* 历史记录操作按钮区 */
.history-actions {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #e4e7ed;
    display: flex;
    gap: 10px;
    justify-content: center;
}

/* 移动端全局适配 */
@media (max-width: 768px) {
    body {
        font-size: 14px;
    }

    /* 隐藏左侧导航栏，使用抽屉代替 */
    .left-sidebar {
        display: none;
    }

    .content-wrapper {
        padding: 10px;
    }

    .config-panel {
        padding: 12px;
    }

    .panel-title {
        font-size: 15px;
        margin-bottom: 15px;
    }

    /* 配置卡片移动端适配 */
    .config-cards {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .config-card {
        padding: 15px;
    }

    .param-grid {
        gap: 12px;
    }

    .action-buttons {
        flex-direction: column;
    }

    .action-buttons .el-button {
        width: 100%;
    }

    /* 题目卡片移动端适配 */
    .question-cards {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .question-card {
        padding: 12px;
    }

    .question-layout {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .question-number {
        width: 24px;
        height: 24px;
        font-size: 12px;
    }

    .question-content {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .option-item {
        padding: 6px 10px;
        font-size: 13px;
    }

    .answer-box,
    .analysis-box {
        padding: 10px;
    }

    .collapsible-header {
        padding: 6px 10px;
    }

    .collapsible-content {
        padding: 6px 10px;
        font-size: 12px;
    }

    .bottom-bar {
        padding: 0 10px;
        height: 50px;
    }

    .bottom-bar .el-button {
        padding: 8px 12px;
        font-size: 12px;
    }

    /* 移动端隐藏导出Word按钮 */
    .export-word-btn {
        display: none !important;
    }

    /* 历史记录移动端优化 - 完全重新设计 */
    .history-pc-view {
        display: none !important;
    }

    .history-mobile-view {
        display: block !important;
        width: 100%;
    }

    .history-item-header {
        display: block !important;
        padding: 0 !important;
    }

    /* 历史记录表格移动端适配 */
    .history-table-container {
        padding: 10px;
        overflow-x: auto;
    }

    .history-table-container .el-table {
        font-size: 12px;
    }

    .history-table-container .el-table th,
    .history-table-container .el-table td {
        padding: 8px 5px;
    }

    .content-text {
        font-size: 13px;
    }

    .option-item-small {
        font-size: 12px;
    }

    .history-actions {
        flex-direction: column;
    }

    .history-actions .el-button {
        width: 100%;
    }

    /* 移动端历史记录卡片样式 */
    .history-mobile-view strong {
        display: block;
        font-size: 15px !important;
        line-height: 1.6;
        color: #303133;
        margin-bottom: 8px;
        word-break: break-all;
        font-weight: 600;
    }

    .history-mobile-meta {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 12px !important;
        color: #909399;
        padding: 5px 0;
    }

    .history-mobile-meta span {
        white-space: nowrap;
    }

    .history-delete-btn {
        width: 100% !important;
        margin: 10px 0 0 0 !important;
        font-size: 13px !important;
        padding: 8px !important;
    }

    /* 折叠面板样式优化 */
    .el-collapse-item {
        margin-bottom: 12px !important;
        border: 1px solid #e4e7ed !important;
        border-radius: 8px !important;
        overflow: hidden !important;
    }

    .el-collapse-item__header {
        padding: 12px 15px !important;
        background: #fff !important;
        border: none !important;
        line-height: 1.5 !important;
        height: auto !important;
    }

    .el-collapse-item__wrap {
        border: none !important;
    }

    .el-collapse-item__content {
        padding: 0 !important;
        background: #f9f9f9 !important;
    }

    /* 历史记录题目详情 - 移动端简化 */
    .el-collapse-item__content > div {
        padding: 10px !important;
        background: #f5f7fa !important;
    }

    .el-collapse-item__content > div > div {
        padding: 12px !important;
        margin-bottom: 10px !important;
        font-size: 14px !important;
        line-height: 1.7;
        background: white !important;
        border-radius: 6px !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    }

    /* 题目头部 - 简化显示 */
    .el-collapse-item__content > div > div > div:first-child {
        margin-bottom: 10px !important;
        padding-bottom: 8px !important;
        border-bottom: 1px solid #f0f0f0 !important;
    }

    .el-collapse-item__content > div > div > div:first-child span:first-child {
        display: inline-block;
        width: 24px;
        height: 24px;
        line-height: 24px;
        text-align: center;
        background: #409eff;
        color: white;
        border-radius: 50%;
        font-weight: bold;
        font-size: 13px;
        margin-right: 8px;
    }

    /* 隐藏题目类型和难度标签 */
    .el-collapse-item__content .el-tag {
        display: none !important;
    }

    /* 题目内容 */
    .el-collapse-item__content > div > div > div:nth-child(2) {
        font-size: 14px !important;
        line-height: 1.7 !important;
        color: #303133 !important;
        margin-bottom: 12px !important;
    }

    /* 选项 */
    .el-collapse-item__content > div > div > div:nth-child(3) > div {
        padding: 8px 10px !important;
        margin: 6px 0 !important;
        background: #f9f9f9 !important;
        border-radius: 4px !important;
        font-size: 13px !important;
        color: #606266 !important;
    }

    /* 答案区域 */
    .el-collapse-item__content > div > div > div:nth-child(4) {
        background: #f0f9ff !important;
        padding: 10px !important;
        border-radius: 6px !important;
        margin-bottom: 10px !important;
        border-left: 3px solid #67c23a !important;
    }

    .el-collapse-item__content > div > div > div:nth-child(4) strong {
        font-size: 13px !important;
        color: #67c23a !important;
    }

    /* 解析区域 */
    .el-collapse-item__content > div > div > div:nth-child(5) {
        background: #fffbf0 !important;
        padding: 10px !important;
        border-radius: 6px !important;
        border-left: 3px solid #e6a23c !important;
    }

    .el-collapse-item__content > div > div > div:nth-child(5) strong {
        font-size: 13px !important;
        color: #e6a23c !important;
    }

    /* 加载到出题页面按钮 */
    .el-collapse-item__content > div > div:last-child {
        text-align: center !important;
        padding: 15px 10px !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .el-collapse-item__content > div > div:last-child .el-button {
        width: 100% !important;
        font-size: 13px !important;
    }
}

/* 右侧悬浮助手面板 */
.assistant-panel {
    position: fixed;
    right: 20px;
    bottom: 80px;
    z-index: 2000;
}

/* 当有自定义位置时，使用绝对定位 */
.assistant-panel[style*="left"] {
    right: auto !important;
    bottom: auto !important;
}

/* 悬浮触发按钮 */
.assistant-trigger {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: move;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    position: relative;
    user-select: none;
    z-index: 2001;
}

.assistant-trigger:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 16px rgba(102, 126, 234, 0.6);
}

.assistant-trigger:active {
    cursor: grabbing;
    transform: scale(0.98);
}

.assistant-trigger i {
    font-size: 24px;
    color: white;
}

/* 进度徽章 */
.progress-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    background: #f56c6c;
    color: white;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* 展开状态的触发按钮 */
.assistant-panel.expanded .assistant-trigger {
    background: linear-gradient(135deg, #f56c6c 0%, #e74c3c 100%);
}

/* 助手面板内容 */
.assistant-content {
    position: absolute;
    right: 0;
    bottom: 70px;
    width: 320px;
    max-height: 500px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* 助手头部 */
.assistant-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    font-weight: 600;
}

.assistant-header i {
    font-size: 20px;
}

/* 助手控制按钮 */
.assistant-controls {
    display: flex;
    gap: 10px;
    align-items: center;
}

.assistant-controls i {
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: all 0.2s;
    font-size: 16px;
}

.assistant-controls i:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: scale(1.1);
}

/* 进度区域 */
.assistant-progress {
    padding: 20px;
    flex: 1;
    overflow-y: auto;
}

.progress-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.progress-text {
    font-size: 13px;
    color: #606266;
    font-weight: 500;
    flex: 1;
    margin-right: 10px;
}

.progress-percentage {
    font-size: 18px;
    color: #409eff;
    font-weight: 700;
}

/* 当前阶段文字提示 */
.progress-stage {
    margin-top: 15px;
    padding: 12px 15px;
    background: linear-gradient(135deg, #f0f9ff 0%, #e6f7ff 100%);
    border-radius: 8px;
    border-left: 3px solid #409eff;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #409eff;
    font-weight: 500;
}

.progress-stage i {
    font-size: 16px;
    animation: rotate 1.5s linear infinite;
}

.progress-stage span {
    flex: 1;
}

@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* 空闲状态 */
.assistant-idle {
    padding: 40px 20px;
    text-align: center;
    color: #909399;
}

.assistant-idle i {
    font-size: 48px;
    color: #dcdfe6;
    margin-bottom: 15px;
    display: block;
}

.assistant-idle p {
    font-size: 14px;
    margin: 10px 0;
    color: #606266;
}

.assistant-idle small {
    font-size: 12px;
    color: #909399;
    line-height: 1.6;
    display: block;
}

/* 过渡动画 */
.slide-fade-enter-active {
    transition: all 0.3s ease;
}

.slide-fade-leave-active {
    transition: all 0.2s ease;
}

.slide-fade-enter {
    transform: translateY(20px);
    opacity: 0;
}

.slide-fade-leave-to {
    transform: translateY(20px);
    opacity: 0;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .assistant-panel {
        right: 15px;
        bottom: 70px;
    }

    .assistant-trigger {
        width: 50px;
        height: 50px;
    }

    .assistant-trigger i {
        font-size: 22px;
    }

    .assistant-content {
        width: calc(100vw - 30px);
        max-width: 320px;
        max-height: 400px;
    }

    .assistant-header {
        padding: 12px 15px;
        font-size: 15px;
    }

    .assistant-progress {
        padding: 15px;
    }

    .progress-text {
        font-size: 12px;
    }

    .progress-percentage {
        font-size: 16px;
    }

    .progress-stage {
        padding: 10px 12px;
        font-size: 13px;
    }

    .progress-stage i {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .assistant-content {
        width: calc(100vw - 20px);
        right: -10px;
    }
}

/* 小屏幕适配 */
@media (max-width: 480px) {
    .left-sidebar {
        display: none;
    }

    .top-navbar h1 {
        font-size: 14px;
    }

    .content-wrapper {
        padding: 8px;
    }

    .config-panel {
        padding: 12px;
    }

    .el-form-item__label {
        font-size: 13px;
    }

    .bottom-bar {
        flex-wrap: wrap;
        height: auto;
        padding: 8px;
    }

    .bottom-bar .el-button {
        margin: 4px;
    }
}

/* 流式文字预览 */
.streaming-preview {
    margin: 12px 0;
    padding: 10px;
    background: #f5f7fa;
    border-radius: 4px;
    border-left: 3px solid #409EFF;
    font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
    font-size: 12px;
    line-height: 1.5;
    color: #606266;
    min-height: 40px;
    word-break: break-all;
    overflow: hidden;
    position: relative;
}

.streaming-content {
    white-space: pre-wrap;
}

.cursor {
    display: inline-block;
    width: 2px;
    height: 14px;
    background-color: #409EFF;
    animation: blink 1s step-end infinite;
    margin-left: 2px;
    vertical-align: text-bottom;
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

/* ===== Deep Sea Glass Theme (2026 refresh) ===== */
:root {
    --bg-base: #060A18;
    --bg-1: #0B1026;
    --bg-2: #12183A;
    --surface: rgba(15, 21, 42, 0.82);
    --surface-2: rgba(11, 16, 36, 0.78);
    --surface-deep: rgba(9, 14, 33, 0.76);
    --border: rgba(255, 255, 255, 0.06);
    --border-strong: rgba(139, 92, 246, 0.30);
    --text: rgba(255, 255, 255, 0.88);
    --text-2: rgba(255, 255, 255, 0.64);
    --text-3: rgba(255, 255, 255, 0.42);
    --primary: #8B5CF6;
    --primary-hover: #7C4DE0;
    --primary-active: #6B3FC8;
    --success: #1CB284;
    --shadow-soft: 0 12px 40px rgba(0, 0, 0, 0.45);
    --shadow-lift: 0 18px 60px rgba(0, 0, 0, 0.55);
    --glow: 0 0 24px rgba(139, 92, 246, 0.12);
    --focus-ring: 0 0 0 1px rgba(139, 92, 246, 0.35);
    --radius-md: 14px;
    --radius-lg: 14px;
}

body {
    background-color: var(--bg-base) !important;
    background-image:
        radial-gradient(62% 70% at 50% 34%, rgba(84, 104, 189, 0.20) 0%, rgba(84, 104, 189, 0) 68%),
        radial-gradient(46% 44% at 80% 12%, rgba(139, 92, 246, 0.14) 0%, rgba(139, 92, 246, 0) 74%),
        radial-gradient(38% 40% at 16% 10%, rgba(59, 117, 187, 0.12) 0%, rgba(59, 117, 187, 0) 70%),
        linear-gradient(180deg, var(--bg-2) 0%, var(--bg-1) 38%, var(--bg-base) 100%) !important;
    color: var(--text) !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0) 24%);
    z-index: 0;
}

#app,
.main-container,
.content-area,
.content-wrapper {
    position: relative;
    z-index: 1;
}

#loading-screen {
    background:
        radial-gradient(64% 64% at 50% 38%, rgba(78, 111, 214, 0.25) 0%, rgba(78, 111, 214, 0) 68%),
        linear-gradient(160deg, var(--bg-1) 0%, var(--bg-base) 58%, #060b1f 100%) !important;
}

#loading-screen .loading-text {
    color: var(--text) !important;
}

.top-navbar {
    background: linear-gradient(180deg, rgba(14, 21, 45, 0.92) 0%, rgba(9, 14, 33, 0.88) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.38) !important;
}

.top-navbar h1 {
    color: var(--text) !important;
}

.top-navbar .user-info span {
    color: var(--text-2) !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid var(--border) !important;
}

.sidebar {
    background: linear-gradient(175deg, rgba(14, 21, 45, 0.90) 0%, rgba(9, 14, 33, 0.84) 100%) !important;
    border-right: 1px solid var(--border) !important;
    display: flex;
    flex-direction: column;
}

.sidebar-menu,
.el-menu,
.el-drawer,
.el-drawer__body {
    background: transparent !important;
}

.sidebar-menu {
    flex: 1;
    height: auto !important;
    overflow-y: auto;
    overflow-x: hidden;
}

.sidebar-footer-image {
    padding: 10px 10px 12px;
    margin-top: auto;
}

.sidebar-footer-image img {
    width: 100%;
    max-height: 180px;
    height: auto;
    display: block;
    border: none;
    border-radius: 0;
    box-shadow: none;
    object-fit: contain;
    object-position: center bottom;
}

.sidebar-menu .el-menu-item {
    color: var(--text-2) !important;
    border-radius: 12px;
    margin: 4px 8px;
    transition: all 0.2s ease;
}

.sidebar-menu .el-menu-item:hover,
.el-menu-item:hover {
    background: rgba(139, 92, 246, 0.11) !important;
    color: var(--text) !important;
}

.sidebar-menu .el-menu-item.is-active,
.el-menu-item.is-active {
    background: linear-gradient(95deg, rgba(139, 92, 246, 0.22) 0%, rgba(139, 92, 246, 0.10) 100%) !important;
    color: rgba(255, 255, 255, 0.88) !important;
    border: 1px solid var(--border-strong);
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.12), 0 8px 24px rgba(0, 0, 0, 0.34);
}

.config-panel,
.config-card,
.question-card,
.page-container,
.assistant-content,
.bottom-bar,
.fixed-action-bar,
.history-table-container,
.policy-messages-list,
.document-selector__list,
.el-collapse-item,
.el-dialog,
.el-dropdown-menu,
.el-popover,
.el-select-dropdown {
    background: linear-gradient(160deg, var(--surface) 0%, var(--surface-2) 100%) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-soft) !important;
    backdrop-filter: blur(14px) saturate(112%);
    -webkit-backdrop-filter: blur(14px) saturate(112%);
}

.config-card,
.question-card,
.doc-card,
.policy-message-item,
.message-item,
.el-collapse-item {
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.config-card:hover,
.question-card:hover,
.doc-card:hover,
.policy-message-item:hover,
.message-item:hover,
.el-collapse-item:hover {
    border-color: var(--border-strong) !important;
    background: linear-gradient(160deg, rgba(18, 26, 50, 0.86) 0%, rgba(12, 18, 39, 0.80) 100%) !important;
    box-shadow: var(--shadow-lift) !important;
    transform: translateY(-1px);
}

.panel-title,
.config-card-title span,
.page-header,
.question-content,
.content-text,
.doc-name,
.message-title,
.detail-label,
.detail-value,
.message-title,
.question-content-cell {
    color: var(--text) !important;
}

.config-tip,
.type-hint,
.message-date,
.history-item-date,
.history-item-count,
.doc-stats,
.no-source,
.no-analysis,
.section-text,
.option-item-small,
.message-index,
.el-form-item__label,
.el-checkbox__label,
.el-radio__label {
    color: var(--text-2) !important;
}

.display-settings-tip {
    background: rgba(7, 12, 30, 0.72) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-2) !important;
}

.display-settings-tip i {
    color: rgba(188, 162, 239, 0.88) !important;
}

.question-footer,
.source-box,
.analysis-box,
.answer-box,
.source-section,
.detail-value,
.consult-section,
.reply-section,
.option-item {
    background: var(--surface-deep) !important;
    border-color: var(--border) !important;
    color: var(--text-2) !important;
}

.answer-text,
.success-text,
.el-progress__text {
    color: var(--success) !important;
}

.analysis-popover strong,
.warning-text {
    color: #f0bd6f !important;
}

.analysis-popover p {
    color: var(--text-2) !important;
}

.question-header,
.footer-section,
.history-actions,
.bottom-bar,
.fixed-action-bar,
.top-navbar {
    border-color: var(--border) !important;
}

.question-number {
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-active) 100%) !important;
    box-shadow: 0 8px 18px rgba(49, 32, 92, 0.32);
}

.doc-card {
    background: rgba(9, 14, 33, 0.74) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
}

.doc-card.selected,
.question-card.selected {
    background: linear-gradient(150deg, rgba(139, 92, 246, 0.16) 0%, rgba(24, 31, 58, 0.84) 100%) !important;
    border-color: var(--border-strong) !important;
    box-shadow: var(--shadow-soft), 0 0 24px rgba(139, 92, 246, 0.10) !important;
}

.question-card.generating,
.generating-indicator,
.progress-stage {
    background: linear-gradient(150deg, rgba(28, 178, 132, 0.14) 0%, rgba(13, 34, 45, 0.68) 100%) !important;
    border-color: rgba(28, 178, 132, 0.34) !important;
    color: #8fe6cb !important;
}

.el-button {
    background: rgba(255, 255, 255, 0.045) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-2) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.20);
}

.el-button:hover,
.el-button:focus {
    color: var(--text) !important;
    border-color: rgba(139, 92, 246, 0.24) !important;
    background: rgba(255, 255, 255, 0.075) !important;
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.12), 0 8px 20px rgba(0, 0, 0, 0.26) !important;
}

.el-button:active {
    background: rgba(255, 255, 255, 0.032) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16) !important;
}

.el-button--primary {
    background: linear-gradient(180deg, var(--primary) 0%, #7F52E7 100%) !important;
    border-color: rgba(139, 92, 246, 0.58) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 10px 24px rgba(43, 23, 87, 0.35), 0 0 24px rgba(139, 92, 246, 0.10) !important;
}

.el-button--primary:hover,
.el-button--primary:focus {
    background: var(--primary-hover) !important;
    box-shadow: 0 12px 28px rgba(43, 23, 87, 0.40), 0 0 24px rgba(139, 92, 246, 0.12) !important;
}

.el-button--primary:active {
    background: var(--primary-active) !important;
    box-shadow: 0 6px 16px rgba(43, 23, 87, 0.28), 0 0 18px rgba(139, 92, 246, 0.08) !important;
}

.el-button--success {
    background: linear-gradient(180deg, rgba(33, 151, 119, 0.94) 0%, rgba(26, 134, 106, 0.94) 100%) !important;
    border-color: rgba(45, 170, 136, 0.46) !important;
    color: rgba(236, 255, 249, 0.90) !important;
}

.el-button--text {
    color: rgba(191, 167, 244, 0.88) !important;
}

.el-button--text:hover,
.el-button--text:focus {
    color: rgba(215, 196, 246, 0.94) !important;
    background: rgba(139, 92, 246, 0.08) !important;
}

.el-input__inner,
.el-textarea__inner,
.el-input-number,
.el-input-number .el-input__inner,
.el-select .el-input__inner {
    background: var(--surface-deep) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    color: var(--text) !important;
}

.el-input__inner::placeholder,
.el-textarea__inner::placeholder {
    color: var(--text-3) !important;
}

.el-input__inner:hover,
.el-textarea__inner:hover,
.el-select:hover .el-input__inner {
    border-color: rgba(139, 92, 246, 0.20) !important;
}

.el-input__inner:focus,
.el-textarea__inner:focus,
.el-select .el-input.is-focus .el-input__inner {
    border-color: var(--border-strong) !important;
    box-shadow: var(--focus-ring) !important;
}

.el-checkbox-button__inner,
.el-radio-button__inner {
    background: var(--surface-deep) !important;
    border-color: var(--border) !important;
    color: var(--text-2) !important;
}

.el-checkbox-button.is-checked .el-checkbox-button__inner,
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
    background: rgba(139, 92, 246, 0.20) !important;
    border-color: var(--border-strong) !important;
    color: rgba(247, 241, 255, 0.90) !important;
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.16), 0 10px 24px rgba(0, 0, 0, 0.30) !important;
}

.el-checkbox__input.is-checked .el-checkbox__inner,
.el-radio__input.is-checked .el-radio__inner {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
}

.el-checkbox__input.is-focus .el-checkbox__inner,
.el-radio__input.is-focus .el-radio__inner {
    box-shadow: var(--focus-ring) !important;
}

.el-tag {
    background: rgba(12, 19, 40, 0.72) !important;
    color: var(--text-2) !important;
    border-color: var(--border) !important;
}

.el-tag.el-tag--success {
    background: rgba(28, 178, 132, 0.15) !important;
    border-color: rgba(28, 178, 132, 0.34) !important;
    color: #7de2c0 !important;
}

.el-tag.el-tag--warning {
    background: rgba(224, 165, 84, 0.14) !important;
    border-color: rgba(224, 165, 84, 0.35) !important;
    color: #f5c783 !important;
}

.el-tag.el-tag--danger {
    background: rgba(230, 96, 120, 0.14) !important;
    border-color: rgba(230, 96, 120, 0.35) !important;
    color: #ffb7c6 !important;
}

.el-pagination {
    color: var(--text-2) !important;
}

.el-pagination .btn-next,
.el-pagination .btn-prev,
.el-pagination .el-pager li {
    background: var(--surface-deep) !important;
    color: var(--text-2) !important;
    border-radius: 12px !important;
    border: 1px solid var(--border) !important;
}

.el-pagination .el-pager li.active {
    background: rgba(139, 92, 246, 0.20) !important;
    color: rgba(247, 241, 255, 0.90) !important;
    border-color: var(--border-strong) !important;
}

.el-dialog__header,
.el-dialog__body,
.el-dialog__footer {
    background: transparent !important;
    border-color: var(--border) !important;
}

.el-dialog__title {
    color: var(--text) !important;
}

.el-drawer {
    border-right: 1px solid var(--border) !important;
    box-shadow: var(--shadow-soft) !important;
}

.el-table,
.el-table__expanded-cell,
.el-table th.el-table__cell,
.el-table td.el-table__cell,
.el-table tr {
    background: transparent !important;
    color: var(--text-2) !important;
}

.el-table th.el-table__cell {
    color: var(--text) !important;
}

.el-table th.el-table__cell,
.el-table td.el-table__cell,
.el-table::before {
    border-color: var(--border) !important;
    background-color: transparent !important;
}

.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
    background: rgba(9, 15, 34, 0.7) !important;
}

.el-table__body tr:hover > td.el-table__cell {
    background: rgba(139, 92, 246, 0.08) !important;
}

.assistant-trigger {
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-active) 100%) !important;
    box-shadow: 0 10px 24px rgba(43, 23, 87, 0.38), 0 0 24px rgba(139, 92, 246, 0.10) !important;
}

.assistant-panel.expanded .assistant-trigger {
    background: linear-gradient(180deg, var(--primary-hover) 0%, var(--primary-active) 100%) !important;
}

.assistant-header {
    background: linear-gradient(180deg, rgba(139, 92, 246, 0.22) 0%, rgba(44, 35, 71, 0.70) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
    color: rgba(255, 255, 255, 0.88) !important;
}

.progress-badge {
    background: var(--success) !important;
}

.message-detail-content .detail-value a,
a {
    color: rgba(191, 167, 244, 0.92) !important;
}

a:hover {
    color: rgba(215, 196, 246, 0.95) !important;
}

.bottom-bar {
    background: linear-gradient(180deg, rgba(8, 12, 29, 0.88) 0%, rgba(6, 9, 22, 0.94) 100%) !important;
}

::-webkit-scrollbar-track {
    background: rgba(9, 13, 30, 0.95);
}

::-webkit-scrollbar-thumb {
    background: rgba(139, 92, 246, 0.38);
    border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(139, 92, 246, 0.54);
}

*:focus-visible {
    outline: none !important;
    box-shadow: var(--focus-ring) !important;
}

.questions-empty-state .el-empty__image {
    display: none !important;
}

.questions-empty-state .el-empty__description {
    margin-top: 0 !important;
    color: var(--text-3) !important;
}

#loading-screen {
    color: var(--text-2) !important;
}

#loading-screen .spinner {
    border-color: rgba(255, 255, 255, 0.22) !important;
    border-top-color: rgba(255, 255, 255, 0.78) !important;
}

.config-panel,
.config-card,
.question-card,
.fixed-action-bar,
.bottom-bar,
.history-table-container,
.el-dialog,
.el-popover {
    color: var(--text-2) !important;
}

.el-switch__core {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
}

.el-switch__core:after {
    background: rgba(248, 250, 255, 0.92) !important;
}

.el-switch.is-checked .el-switch__core {
    background: rgba(139, 92, 246, 0.72) !important;
    border-color: rgba(139, 92, 246, 0.50) !important;
}

.el-switch.is-focus .el-switch__core {
    box-shadow: var(--focus-ring) !important;
}

/* Empty state local layout refinement (content area only) */
.content-wrapper .empty-state-row {
    --empty-surface: rgba(15, 21, 42, 0.82);
    --empty-border: rgba(255, 255, 255, 0.06);
    --empty-primary: rgba(139, 92, 246, 0.75);
    display: grid;
    grid-template-columns: minmax(560px, 820px) minmax(240px, 1fr);
    gap: 24px;
    align-items: stretch;
    width: 100%;
}

.content-wrapper .empty-state-main {
    min-width: 0;
}

.content-wrapper .empty-state-main .questions-empty-state {
    width: 100%;
    margin: 0;
}

.content-wrapper .empty-state-main .questions-empty-state .el-empty {
    align-items: flex-start;
    justify-content: center;
    min-height: 280px;
    padding: 20px 0;
}

.content-wrapper .empty-state-main .questions-empty-state .el-empty__image {
    display: block !important;
    margin: 0 0 12px 0;
    opacity: 0.82;
}

.content-wrapper .empty-state-main .questions-empty-state .el-empty__description {
    color: var(--text-3) !important;
    text-align: left;
    margin: 0;
    padding-left: 2px;
}

.content-wrapper .empty-state-ornament {
    pointer-events: none;
    user-select: none;
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content-wrapper .decorative-widget {
    position: relative;
    width: min(360px, 100%);
    border-radius: 14px;
    padding: 16px 16px 14px;
    background: linear-gradient(160deg, var(--empty-surface) 0%, rgba(11, 16, 36, 0.78) 100%);
    border: 1px solid var(--empty-border);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45), 0 0 24px rgba(139, 92, 246, 0.1);
    overflow: hidden;
    pointer-events: none;
}

.content-wrapper .decorative-widget__halo {
    position: absolute;
    top: -42px;
    right: -36px;
    width: 150px;
    height: 150px;
    background: radial-gradient(circle at center, rgba(139, 92, 246, 0.2) 0%, rgba(139, 92, 246, 0) 72%);
    opacity: 0.66;
}

.content-wrapper .decorative-widget__header {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.content-wrapper .decorative-widget__title {
    font-size: 13px;
    letter-spacing: 0.3px;
    color: rgba(255, 255, 255, 0.72);
}

.content-wrapper .decorative-widget__chip {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.58);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    padding: 2px 8px;
    background: rgba(255, 255, 255, 0.03);
}

.content-wrapper .decorative-widget__metrics {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
}

.content-wrapper .decorative-widget__metric {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.54);
}

.content-wrapper .decorative-widget__metric strong {
    font-weight: 600;
    color: rgba(255, 255, 255, 0.8);
}

.content-wrapper .decorative-widget__streams {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 7px;
}

.content-wrapper .decorative-widget__stream {
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
    position: relative;
}

.content-wrapper .decorative-widget__stream::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 38%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(139, 92, 246, 0.16) 0%, rgba(139, 92, 246, 0.72) 55%, rgba(139, 92, 246, 0.22) 100%);
    animation: decorativeStream 5.8s ease-in-out infinite;
}

.content-wrapper .decorative-widget__stream:nth-child(2)::after {
    width: 55%;
    animation-delay: -1.4s;
}

.content-wrapper .decorative-widget__stream:nth-child(3)::after {
    width: 46%;
    animation-delay: -2.1s;
}

.content-wrapper .decorative-widget__stream:nth-child(4)::after {
    width: 62%;
    animation-delay: -3s;
}

@keyframes decorativeStream {
    0% { transform: translateX(-24%); opacity: 0.76; }
    50% { transform: translateX(8%); opacity: 0.92; }
    100% { transform: translateX(-24%); opacity: 0.76; }
}

@media (max-width: 1440px) {
    .content-wrapper .empty-state-row {
        grid-template-columns: minmax(420px, 1fr) minmax(220px, 320px);
        gap: 18px;
    }
}

@media (max-width: 1200px) {
    .content-wrapper .empty-state-row {
        grid-template-columns: 1fr;
    }

    .content-wrapper .empty-state-ornament {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .content-wrapper .decorative-widget__stream::after {
        animation: none;
    }
}

/* Local refinement: "题量 & 难度" card only */
.config-column-right > .config-card:first-child {
    --qd-surface: rgba(10, 16, 35, 0.78);
    --qd-border: rgba(255, 255, 255, 0.08);
    --qd-text-main: rgba(255, 255, 255, 0.88);
    --qd-text-muted: rgba(214, 224, 245, 0.62);
    --qd-text-soft: rgba(214, 224, 245, 0.58);
}

.config-column-right > .config-card:first-child .metric-item label {
    color: var(--qd-text-muted) !important;
}

.config-column-right > .config-card:first-child .metric-control .el-input-number {
    width: 100% !important;
    background: var(--qd-surface) !important;
    border: 1px solid var(--qd-border) !important;
    border-radius: 12px !important;
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.config-column-right > .config-card:first-child .metric-control .el-input-number .el-input__inner {
    border: none !important;
    background: transparent !important;
    color: var(--qd-text-main) !important;
    font-weight: 500;
}

.config-column-right > .config-card:first-child .metric-control .el-input-number__decrease,
.config-column-right > .config-card:first-child .metric-control .el-input-number__increase {
    background: rgba(255, 255, 255, 0.07) !important;
    color: rgba(255, 255, 255, 0.65) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.config-column-right > .config-card:first-child .metric-control .el-input-number__decrease:hover,
.config-column-right > .config-card:first-child .metric-control .el-input-number__increase:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.76) !important;
}

.config-column-right > .config-card:first-child .metric-control .el-input-number__decrease:active,
.config-column-right > .config-card:first-child .metric-control .el-input-number__increase:active {
    background: rgba(255, 255, 255, 0.05) !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.34);
}

.config-column-right > .config-card:first-child .metric-item .el-radio-group {
    display: flex !important;
    width: 100%;
    gap: 8px;
}

.config-column-right > .config-card:first-child .metric-item .el-radio-button {
    flex: 1;
}

.config-column-right > .config-card:first-child .metric-item .el-radio-button__inner {
    width: 100%;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px !important;
    border-radius: 10px !important;
    border: 1px solid var(--qd-border) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    color: var(--qd-text-soft) !important;
    box-shadow: none !important;
}

.config-column-right > .config-card:first-child .metric-item .el-radio-button + .el-radio-button .el-radio-button__inner {
    margin-left: 0 !important;
}

.config-column-right > .config-card:first-child .metric-item .el-radio-button__orig-radio:checked + .el-radio-button__inner {
    background: rgba(139, 92, 246, 0.20) !important;
    border-color: rgba(139, 92, 246, 0.32) !important;
    color: rgba(247, 241, 255, 0.90) !important;
    box-shadow: inset 0 0 0 1px rgba(139, 92, 246, 0.16) !important;
}

/* Premium polish layer: high-value productivity feel */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0.22;
    background-image:
        repeating-linear-gradient(to right, rgba(163, 184, 230, 0.05) 0 1px, transparent 1px 20px),
        repeating-linear-gradient(to bottom, rgba(163, 184, 230, 0.04) 0 1px, transparent 1px 20px),
        radial-gradient(circle at 22% 18%, rgba(255, 255, 255, 0.045) 0 1px, transparent 1px 100%);
}

.config-panel,
.config-card,
.question-card,
.history-table-container,
.document-selector__list,
.policy-messages-list,
.assistant-content,
.fixed-action-bar,
.bottom-bar,
.el-collapse-item {
    background: rgba(20, 20, 47, 0.70) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(12px) saturate(118%);
    -webkit-backdrop-filter: blur(12px) saturate(118%);
    box-shadow:
        0 20px 50px rgba(2, 7, 23, 0.42),
        0 8px 20px rgba(0, 0, 0, 0.34),
        inset 1px 1px 0 rgba(255, 255, 255, 0.14),
        inset -1px -1px 0 rgba(8, 11, 27, 0.62) !important;
}

.el-button,
.config-card,
.question-card,
.doc-card,
.sidebar-menu .el-menu-item,
.el-radio-button__inner,
.el-input-number__decrease,
.el-input-number__increase {
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
        box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1),
        background-color 0.28s cubic-bezier(0.4, 0, 0.2, 1),
        border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1),
        color 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.action-buttons-grid .el-button--primary,
.fixed-action-bar .el-button--primary,
.bottom-bar .el-button--primary {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.action-buttons-grid .el-button--primary::before,
.fixed-action-bar .el-button--primary::before,
.bottom-bar .el-button--primary::before {
    content: "";
    position: absolute;
    top: -20%;
    left: -45%;
    width: 38%;
    height: 140%;
    background: linear-gradient(
        115deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.22) 45%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: translateX(-180%) skewX(-20deg);
    pointer-events: none;
    z-index: 0;
}

.action-buttons-grid .el-button--primary:hover::before,
.fixed-action-bar .el-button--primary:hover::before,
.bottom-bar .el-button--primary:hover::before {
    animation: buttonSweep 1.15s cubic-bezier(0.4, 0, 0.2, 1) 1;
}

.action-buttons-grid .el-button--primary > span,
.fixed-action-bar .el-button--primary > span,
.bottom-bar .el-button--primary > span,
.action-buttons-grid .el-button--primary i,
.fixed-action-bar .el-button--primary i,
.bottom-bar .el-button--primary i {
    position: relative;
    z-index: 1;
}

.assistant-panel .assistant-trigger {
    animation: aiBreathing 3.8s ease-in-out infinite;
}

.assistant-panel.expanded .assistant-trigger {
    animation-duration: 3s;
}

.assistant-progress .el-progress-bar__outer {
    background: rgba(255, 255, 255, 0.08) !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.35);
}

.assistant-progress .el-progress-bar__inner {
    position: relative;
    overflow: visible !important;
    background: linear-gradient(90deg, rgba(123, 93, 232, 0.88) 0%, rgba(151, 110, 245, 0.94) 100%) !important;
    box-shadow:
        inset 0 0 8px rgba(255, 255, 255, 0.24),
        0 0 14px rgba(139, 92, 246, 0.26);
}

.assistant-progress .el-progress-bar__inner::after {
    content: "";
    position: absolute;
    right: -4px;
    top: 50%;
    width: 8px;
    height: 8px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: rgba(227, 216, 255, 0.95);
    box-shadow: 0 0 10px rgba(171, 133, 255, 0.75);
}

.progress-percentage,
.progress-badge,
.question-number,
.stats-text strong,
.el-input-number .el-input__inner {
    font-family: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace !important;
    letter-spacing: 0.035em;
    font-variant-numeric: tabular-nums;
}

@keyframes aiBreathing {
    0%, 100% {
        box-shadow:
            0 10px 24px rgba(43, 23, 87, 0.34),
            0 0 14px rgba(139, 92, 246, 0.12);
    }
    50% {
        box-shadow:
            0 14px 30px rgba(43, 23, 87, 0.42),
            0 0 22px rgba(139, 92, 246, 0.18);
    }
}

@keyframes buttonSweep {
    0% {
        transform: translateX(-180%) skewX(-20deg);
    }
    100% {
        transform: translateX(320%) skewX(-20deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .assistant-panel .assistant-trigger {
        animation: none !important;
    }

    .action-buttons-grid .el-button--primary:hover::before,
    .fixed-action-bar .el-button--primary:hover::before,
    .bottom-bar .el-button--primary:hover::before {
        animation: none !important;
    }
}

/* Sidebar-content seam fix: remove bright vertical divider */
.main-container > .sidebar {
    border-right: none !important;
}

.main-container > .sidebar .el-menu,
.main-container > .sidebar .sidebar-menu {
    border-right: none !important;
}

.main-container > .content-area {
    border-left: none !important;
}

.main-container > .sidebar::after,
.main-container > .content-area::before {
    content: none !important;
    display: none !important;
}

/* ===== Cyber Neon Lite (Performance-safe) ===== */
:root {
    --text: rgba(255, 255, 255, 0.88);
    --text-2: rgba(255, 255, 255, 0.68);
    --text-3: rgba(255, 255, 255, 0.45);
    --surface-lite: rgba(15, 21, 42, 0.82);
    --surface-lite-strong: rgba(18, 26, 50, 0.86);
    --border-lite: rgba(255, 255, 255, 0.07);
    --neon-lite: rgba(139, 92, 246, 0.12);
}

html::before {
    content: "";
    position: fixed;
    inset: -120% 0 0 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0.28;
    background: linear-gradient(
        180deg,
        transparent 0%,
        rgba(149, 168, 248, 0.08) 48%,
        rgba(149, 168, 248, 0.10) 50%,
        transparent 54%
    );
    transform: translateY(-20%);
    animation: scanlineDriftLite 20s linear infinite;
}

html::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0.50;
    background-image:
        radial-gradient(circle at 6% 14%, rgba(170, 189, 248, 0.09) 0 1.4px, transparent 1.4px),
        radial-gradient(circle at 14% 72%, rgba(170, 189, 248, 0.08) 0 1.2px, transparent 1.2px),
        radial-gradient(circle at 22% 35%, rgba(170, 189, 248, 0.10) 0 1.5px, transparent 1.5px),
        radial-gradient(circle at 30% 86%, rgba(170, 189, 248, 0.08) 0 1.2px, transparent 1.2px),
        radial-gradient(circle at 38% 22%, rgba(170, 189, 248, 0.09) 0 1.4px, transparent 1.4px),
        radial-gradient(circle at 46% 64%, rgba(170, 189, 248, 0.08) 0 1.2px, transparent 1.2px),
        radial-gradient(circle at 54% 12%, rgba(170, 189, 248, 0.10) 0 1.5px, transparent 1.5px),
        radial-gradient(circle at 62% 78%, rgba(170, 189, 248, 0.08) 0 1.2px, transparent 1.2px),
        radial-gradient(circle at 70% 42%, rgba(170, 189, 248, 0.09) 0 1.4px, transparent 1.4px),
        radial-gradient(circle at 78% 88%, rgba(170, 189, 248, 0.08) 0 1.2px, transparent 1.2px),
        radial-gradient(circle at 86% 30%, rgba(170, 189, 248, 0.10) 0 1.5px, transparent 1.5px),
        radial-gradient(circle at 94% 66%, rgba(170, 189, 248, 0.08) 0 1.2px, transparent 1.2px);
    transform: translate3d(0, 0, 0);
    animation: particleDriftLite 16s ease-in-out infinite alternate;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(52% 44% at 16% 18%, rgba(96, 129, 235, 0.20) 0%, rgba(96, 129, 235, 0) 72%),
        radial-gradient(46% 40% at 84% 12%, rgba(139, 92, 246, 0.17) 0%, rgba(139, 92, 246, 0) 72%),
        radial-gradient(40% 34% at 58% 84%, rgba(73, 114, 219, 0.15) 0%, rgba(73, 114, 219, 0) 76%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0) 30%);
}

body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 1;
    background-image:
        repeating-linear-gradient(to right, rgba(164, 187, 246, 0.08) 0 1px, transparent 1px 20px),
        repeating-linear-gradient(to bottom, rgba(164, 187, 246, 0.07) 0 1px, transparent 1px 20px),
        radial-gradient(circle at 12% 20%, rgba(154, 178, 240, 0.08) 0 1px, transparent 1px 100%),
        radial-gradient(circle at 34% 72%, rgba(154, 178, 240, 0.08) 0 1px, transparent 1px 100%),
        radial-gradient(circle at 56% 16%, rgba(154, 178, 240, 0.08) 0 1px, transparent 1px 100%),
        radial-gradient(circle at 76% 46%, rgba(154, 178, 240, 0.08) 0 1px, transparent 1px 100%),
        radial-gradient(circle at 88% 80%, rgba(154, 178, 240, 0.08) 0 1px, transparent 1px 100%),
        radial-gradient(circle at 24% 88%, rgba(154, 178, 240, 0.08) 0 1px, transparent 1px 100%);
}

.config-panel,
.config-card,
.question-card,
.history-table-container,
.document-selector__list,
.policy-messages-list,
.assistant-content,
.fixed-action-bar,
.bottom-bar,
.el-collapse-item,
.el-dialog,
.el-popover,
.el-select-dropdown {
    background: var(--surface-lite) !important;
    border: 1px solid var(--border-lite) !important;
    box-shadow:
        0 14px 32px rgba(1, 5, 16, 0.42),
        0 6px 14px rgba(0, 0, 0, 0.28) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.config-card:hover,
.question-card:hover,
.doc-card:hover,
.policy-message-item:hover,
.message-item:hover,
.el-collapse-item:hover {
    background: var(--surface-lite-strong) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow:
        0 16px 36px rgba(1, 5, 16, 0.46),
        0 8px 16px rgba(0, 0, 0, 0.30) !important;
}

.el-button {
    background: rgba(255, 255, 255, 0.045) !important;
    border-color: var(--border-lite) !important;
    color: var(--text-2) !important;
    box-shadow:
        0 5px 12px rgba(0, 0, 0, 0.22),
        0 0 0 1px rgba(255, 255, 255, 0.02) !important;
}

.el-button:hover,
.el-button:focus {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--text) !important;
}

.el-button--primary {
    background: linear-gradient(180deg, #8B5CF6 0%, #6F47D7 100%) !important;
    border-color: rgba(139, 92, 246, 0.34) !important;
    box-shadow:
        0 10px 22px rgba(38, 24, 78, 0.34),
        0 4px 10px rgba(10, 8, 22, 0.24) !important;
}

.el-button--primary:hover,
.el-button--primary:focus {
    background: linear-gradient(180deg, #7F52E6 0%, #6740CC 100%) !important;
    box-shadow:
        0 12px 24px rgba(38, 24, 78, 0.36),
        0 6px 12px rgba(10, 8, 22, 0.28) !important;
}

.action-buttons-grid .el-button--primary {
    position: relative;
    box-shadow:
        0 12px 24px rgba(38, 24, 78, 0.36),
        0 0 14px rgba(139, 92, 246, 0.12) !important;
}

.action-buttons-grid .el-button--primary:hover,
.action-buttons-grid .el-button--primary:focus {
    box-shadow:
        0 14px 28px rgba(38, 24, 78, 0.38),
        0 0 16px rgba(139, 92, 246, 0.14) !important;
}

.action-buttons-grid .el-button--primary::before,
.fixed-action-bar .el-button--primary::before,
.bottom-bar .el-button--primary::before {
    opacity: 0.65;
}

.action-buttons-grid .el-button--primary::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    border: 1px solid rgba(139, 92, 246, 0.16);
    opacity: 0.28;
    transform: scale(0.98);
    pointer-events: none;
    animation: primaryPulseLite 8.5s ease-in-out infinite;
}

.el-input__inner,
.el-textarea__inner,
.el-input-number,
.el-input-number .el-input__inner,
.el-select .el-input__inner {
    background: rgba(10, 14, 34, 0.74) !important;
    border-color: var(--border-lite) !important;
    color: var(--text) !important;
}

.el-input__inner:focus,
.el-textarea__inner:focus,
.el-select .el-input.is-focus .el-input__inner {
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.35) !important;
}

.config-column-right > .config-card:first-child {
    box-shadow:
        0 14px 32px rgba(1, 5, 16, 0.42),
        0 0 14px rgba(139, 92, 246, 0.12) !important;
}

.config-column-right > .config-card:first-child .metric-item .el-radio-button__orig-radio:checked + .el-radio-button__inner {
    position: relative;
    box-shadow:
        0 6px 14px rgba(32, 20, 69, 0.28),
        0 0 12px rgba(139, 92, 246, 0.12) !important;
}

.config-column-right > .config-card:first-child .metric-item .el-radio-button__orig-radio:checked + .el-radio-button__inner::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    border: 1px solid rgba(139, 92, 246, 0.16);
    opacity: 0.34;
    transform: scale(0.98);
    pointer-events: none;
    animation: selectedPulseLite 9s ease-in-out infinite;
}

.sidebar-menu .el-menu-item.is-active {
    position: relative;
}

.sidebar-menu .el-menu-item.is-active::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border: 1px solid rgba(139, 92, 246, 0.14);
    opacity: 0.30;
    transform: scale(0.98);
    pointer-events: none;
    animation: selectedPulseLite 10s ease-in-out infinite;
}

.assistant-panel .assistant-trigger {
    animation: none !important;
    position: relative;
}

.assistant-panel .assistant-trigger::after {
    content: none !important;
    display: none !important;
}

.assistant-progress .el-progress-bar__outer {
    background: rgba(255, 255, 255, 0.08) !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.35);
}

.assistant-progress .el-progress-bar__inner {
    box-shadow:
        inset 0 0 6px rgba(255, 255, 255, 0.16),
        0 4px 10px rgba(10, 8, 22, 0.24) !important;
}

.assistant-progress .el-progress-bar__inner::after {
    box-shadow: 0 0 4px rgba(171, 133, 255, 0.32);
}

.panel-title,
.config-card-title span,
.question-content,
.message-title,
.el-table th.el-table__cell {
    color: var(--text) !important;
}

.el-form-item__label,
.config-tip,
.type-hint,
.doc-stats,
.message-date,
.history-item-date,
.history-item-count,
.el-checkbox__label,
.el-radio__label,
.el-table td.el-table__cell {
    color: var(--text-2) !important;
}

.questions-empty-state .el-empty__description,
.no-source,
.no-analysis,
.assistant-idle,
.assistant-idle small {
    color: var(--text-3) !important;
}

*,
*::before,
*::after {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

@keyframes neonPulseLite {
    0%, 100% {
        opacity: 0.28;
        transform: scale(0.96);
    }
    50% {
        opacity: 0.52;
        transform: scale(1.02);
    }
}

@keyframes primaryPulseLite {
    0%, 100% {
        opacity: 0.24;
        transform: scale(0.98);
    }
    50% {
        opacity: 0.44;
        transform: scale(1.01);
    }
}

@keyframes selectedPulseLite {
    0%, 100% {
        opacity: 0.26;
        transform: scale(0.98);
    }
    50% {
        opacity: 0.40;
        transform: scale(1.01);
    }
}

@keyframes scanlineDriftLite {
    0% {
        transform: translateY(-22%);
        opacity: 0.20;
    }
    50% {
        opacity: 0.30;
    }
    100% {
        transform: translateY(26%);
        opacity: 0.20;
    }
}

@keyframes particleDriftLite {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.36;
    }
    50% {
        opacity: 0.52;
    }
    100% {
        transform: translate3d(0, -16px, 0) scale(1.015);
        opacity: 0.36;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
    }

    .assistant-panel .assistant-trigger::after,
    html::before,
    html::after,
    .action-buttons-grid .el-button--primary::before,
    .action-buttons-grid .el-button--primary::after,
    .fixed-action-bar .el-button--primary::before,
    .bottom-bar .el-button--primary::before,
    .config-column-right > .config-card:first-child .metric-item .el-radio-button__orig-radio:checked + .el-radio-button__inner::after,
    .sidebar-menu .el-menu-item.is-active::after,
    .content-wrapper .decorative-widget__stream::after,
    .progress-stage i,
    .progress-badge,
    #loading-screen .spinner,
    .cursor {
        animation: none !important;
    }
}

/* ===== Cyber HUD Upgrade ===== */
.config-panel,
.config-card,
.question-card,
.assistant-content,
.fixed-action-bar,
.bottom-bar,
.history-table-container {
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(20px) saturate(122%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(122%) !important;
}

.config-panel::before,
.config-card::before,
.question-card::before,
.assistant-content::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(128, 171, 255, 0.28) 0 12px, transparent 12px) top left/48px 2px no-repeat,
        linear-gradient(180deg, rgba(128, 171, 255, 0.28) 0 12px, transparent 12px) top left/2px 48px no-repeat,
        linear-gradient(270deg, rgba(128, 171, 255, 0.16) 0 12px, transparent 12px) top right/42px 2px no-repeat,
        linear-gradient(180deg, rgba(128, 171, 255, 0.16) 0 12px, transparent 12px) top right/2px 42px no-repeat,
        linear-gradient(90deg, rgba(128, 171, 255, 0.16) 0 12px, transparent 12px) bottom left/42px 2px no-repeat,
        linear-gradient(0deg, rgba(128, 171, 255, 0.16) 0 12px, transparent 12px) bottom left/2px 42px no-repeat,
        linear-gradient(270deg, rgba(128, 171, 255, 0.20) 0 12px, transparent 12px) bottom right/48px 2px no-repeat,
        linear-gradient(0deg, rgba(128, 171, 255, 0.20) 0 12px, transparent 12px) bottom right/2px 48px no-repeat;
}

.config-column-right > .config-card:first-child,
.action-buttons-grid {
    box-shadow:
        0 16px 34px rgba(2, 8, 24, 0.46),
        0 0 18px rgba(139, 92, 246, 0.14) !important;
}

.questions-empty-state.hud-holo-center .el-empty {
    position: relative;
}

.questions-empty-state.hud-holo-center .el-empty__image {
    position: relative;
    z-index: 2;
    filter: drop-shadow(0 0 10px rgba(139, 92, 246, 0.24));
}

.questions-empty-state.hud-holo-center .el-empty__image::before {
    content: "";
    position: absolute;
    inset: -22px;
    border-radius: 50%;
    border: 1px solid rgba(139, 92, 246, 0.22);
    border-top-color: rgba(166, 137, 255, 0.46);
    border-right-color: rgba(166, 137, 255, 0.34);
    animation: holoSpin 12s linear infinite;
}

.questions-empty-state.hud-holo-center .el-empty__image::after {
    content: "";
    position: absolute;
    inset: -34px;
    border-radius: 50%;
    border: 1px dashed rgba(125, 164, 255, 0.2);
    animation: holoSpinReverse 18s linear infinite;
}

.questions-empty-state.hud-holo-center .el-empty::before {
    content: "0xAF 0x19 0x3C 0xD2 0x77 0xB8";
    position: absolute;
    top: 44%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: rgba(176, 201, 255, 0.22);
    letter-spacing: 0.22em;
    font-size: 11px;
    font-family: "JetBrains Mono", Consolas, monospace;
    white-space: nowrap;
    pointer-events: none;
}

.questions-empty-state.hud-holo-center .el-empty::after {
    content: "";
    position: absolute;
    left: 12%;
    right: 12%;
    top: 46%;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(145, 176, 255, 0.34) 18%, rgba(176, 140, 255, 0.44) 50%, rgba(145, 176, 255, 0.34) 82%, transparent 100%);
    opacity: 0.52;
    transform: translateY(-10px);
    animation: holoScanLine 7.5s ease-in-out infinite;
    pointer-events: none;
}

.decorative-widget.hud-core-panel {
    background:
        linear-gradient(160deg, rgba(15, 21, 42, 0.86) 0%, rgba(11, 16, 36, 0.82) 100%);
    box-shadow:
        0 16px 36px rgba(2, 8, 24, 0.48),
        0 0 14px rgba(139, 92, 246, 0.14);
}

.hud-terminal {
    margin-bottom: 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    background: rgba(7, 11, 27, 0.72);
}

.hud-terminal__title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    padding: 6px 8px;
    color: rgba(198, 215, 255, 0.72);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.hud-terminal__title em {
    font-style: normal;
    color: rgba(160, 126, 255, 0.86);
}

.hud-terminal__window {
    height: 118px;
    overflow: hidden;
    position: relative;
}

.hud-terminal__track {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 8px;
    transform: translateY(0);
    animation: terminalFeed 5.2s linear infinite;
}

.hud-terminal__track p {
    margin: 0;
    font-size: 11px;
    line-height: 1.35;
    color: rgba(183, 216, 255, 0.68);
    font-family: "JetBrains Mono", Consolas, monospace;
    white-space: nowrap;
}

.hud-waveform {
    height: 42px;
    display: grid;
    grid-template-columns: repeat(24, 1fr);
    gap: 3px;
    align-items: end;
    margin-bottom: 10px;
    padding: 6px 8px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    background: rgba(8, 12, 30, 0.66);
}

.hud-waveform span {
    display: block;
    height: 32%;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(155, 190, 255, 0.7) 0%, rgba(139, 92, 246, 0.62) 100%);
    transform-origin: bottom;
    animation: wavePulse 2.8s ease-in-out infinite;
}

.hud-waveform span:nth-child(4n) { animation-delay: -0.35s; }
.hud-waveform span:nth-child(3n) { animation-delay: -0.65s; }
.hud-waveform span:nth-child(5n) { animation-delay: -1s; }

.hud-system-strip {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 10px;
    z-index: 5;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    pointer-events: none;
}

.hud-indicator {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(9, 13, 30, 0.74);
    color: rgba(196, 214, 248, 0.70);
    font-size: 11px;
    font-family: "JetBrains Mono", Consolas, monospace;
}

.hud-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(123, 210, 255, 0.82);
    opacity: 0.72;
    animation: hudBlink 3.6s ease-in-out infinite;
}

.hud-label {
    opacity: 0.8;
}

.hud-value {
    margin-left: auto;
    color: rgba(223, 235, 255, 0.88);
}

.action-buttons-grid .el-button--primary {
    transform: translateZ(0);
}

.action-buttons-grid .el-button--primary:hover {
    transform: translateY(-1px) scale(1.01);
}

.assistant-progress .el-progress-bar__inner {
    background: linear-gradient(90deg, rgba(112, 86, 226, 0.9) 0%, rgba(156, 112, 252, 0.96) 100%) !important;
    box-shadow:
        inset 0 0 8px rgba(255, 255, 255, 0.22),
        0 0 14px rgba(139, 92, 246, 0.14) !important;
}

.progress-percentage {
    position: relative;
}

.progress-percentage::after {
    content: "";
    position: absolute;
    right: -16px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 1px solid rgba(165, 191, 255, 0.45);
    transform: translateY(-50%);
    opacity: 0.56;
    animation: radarLite 6.2s linear infinite;
}

@keyframes holoSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes holoSpinReverse {
    from { transform: rotate(360deg); }
    to { transform: rotate(0deg); }
}

@keyframes holoScanLine {
    0%, 100% {
        transform: translateY(-18px);
        opacity: 0.26;
    }
    50% {
        transform: translateY(20px);
        opacity: 0.62;
    }
}

@keyframes terminalFeed {
    0% { transform: translateY(0); }
    100% { transform: translateY(-50%); }
}

@keyframes wavePulse {
    0%, 100% { transform: scaleY(0.42); opacity: 0.66; }
    50% { transform: scaleY(1); opacity: 0.96; }
}

@keyframes hudBlink {
    0%, 100% { opacity: 0.48; transform: scale(0.9); }
    50% { opacity: 0.92; transform: scale(1.14); }
}

@keyframes radarLite {
    from { transform: translateY(-50%) rotate(0deg); }
    to { transform: translateY(-50%) rotate(360deg); }
}

@media (max-width: 1200px) {
    .hud-system-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        bottom: 8px;
    }
}

@media (max-width: 768px) {
    .hud-system-strip {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html::before,
    html::after,
    .questions-empty-state.hud-holo-center .el-empty__image::before,
    .questions-empty-state.hud-holo-center .el-empty__image::after,
    .questions-empty-state.hud-holo-center .el-empty::after,
    .hud-terminal__track,
    .hud-waveform span,
    .hud-dot,
    .action-buttons-grid .el-button--primary::before,
    .action-buttons-grid .el-button--primary::after,
    .config-column-right > .config-card:first-child .metric-item .el-radio-button__orig-radio:checked + .el-radio-button__inner::after,
    .sidebar-menu .el-menu-item.is-active::after,
    .progress-percentage::after {
        animation: none !important;
    }
}

/* Generated result text hierarchy: cool gray-blue, no dirty neutral gray */
.result-section {
    --result-text-main: rgba(221, 234, 255, 0.88);
    --result-text-body: rgba(194, 211, 236, 0.72);
    --result-text-muted: rgba(171, 191, 223, 0.56);
}

.result-section .footer-label,
.result-section .collapsible-content,
.result-section .option-item-small {
    color: var(--result-text-body) !important;
}

.result-section .collapsible-content strong,
.result-section .answer-text {
    color: var(--result-text-main) !important;
    font-weight: 600;
}

.result-section .success-text,
.result-section .warning-text {
    color: var(--result-text-body) !important;
}

.result-section .no-source,
.result-section .no-analysis {
    color: var(--result-text-muted) !important;
}

/* ===== HUD Panel Border System (unified) ===== */
:root {
    --hud-panel-radius: 0px;
    --hud-panel-cut: 14px;
    --hud-panel-border-width: 2px;
    --hud-panel-inner-inset: 2px;
    --hud-panel-inner-cut: 13px;
    --hud-panel-shape: polygon(
        var(--hud-panel-cut) 0,
        calc(100% - var(--hud-panel-cut)) 0,
        100% var(--hud-panel-cut),
        100% calc(100% - var(--hud-panel-cut)),
        calc(100% - var(--hud-panel-cut)) 100%,
        var(--hud-panel-cut) 100%,
        0 calc(100% - var(--hud-panel-cut)),
        0 var(--hud-panel-cut)
    );
    --hud-panel-shape-inner: polygon(
        var(--hud-panel-inner-cut) 0,
        calc(100% - var(--hud-panel-inner-cut)) 0,
        100% var(--hud-panel-inner-cut),
        100% calc(100% - var(--hud-panel-inner-cut)),
        calc(100% - var(--hud-panel-inner-cut)) 100%,
        var(--hud-panel-inner-cut) 100%,
        0 calc(100% - var(--hud-panel-inner-cut)),
        0 var(--hud-panel-inner-cut)
    );
    --hud-panel-glow-default:
        0 12px 28px rgba(1, 6, 20, 0.44),
        0 0 12px rgba(103, 184, 255, 0.1);
    --hud-panel-glow-primary:
        0 14px 30px rgba(1, 6, 20, 0.48),
        0 0 16px rgba(123, 98, 246, 0.14);
    --hud-panel-glow-hover:
        0 16px 34px rgba(1, 6, 20, 0.52),
        0 0 20px rgba(117, 203, 255, 0.18);
}

.hud-panel {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border-radius: var(--hud-panel-radius) !important;
    clip-path: var(--hud-panel-shape);
    border: 1px solid transparent !important;
    background: rgba(14, 20, 44, 0.72) !important;
    box-shadow: var(--hud-panel-glow-default) !important;
    transition: box-shadow 0.24s cubic-bezier(0.4, 0, 0.2, 1);
}

.hud-panel--primary {
    box-shadow: var(--hud-panel-glow-primary) !important;
}

.hud-panel:hover {
    box-shadow: var(--hud-panel-glow-primary) !important;
}

.hud-panel--primary:hover {
    box-shadow: var(--hud-panel-glow-hover) !important;
}

.hud-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: linear-gradient(
        132deg,
        rgba(144, 230, 255, 0.96) 0%,
        rgba(122, 142, 255, 0.9) 42%,
        rgba(186, 120, 255, 0.8) 100%
    );
    clip-path: var(--hud-panel-shape);
}

.hud-panel::after {
    content: "";
    position: absolute;
    inset: var(--hud-panel-inner-inset);
    pointer-events: none;
    z-index: 1;
    border-radius: 0;
    clip-path: var(--hud-panel-shape-inner);
    box-shadow:
        inset 0 0 0 1px rgba(9, 14, 34, 0.94),
        inset 0 1px 0 rgba(198, 232, 255, 0.24);
    background:
        linear-gradient(160deg, rgba(14, 20, 44, 0.9) 0%, rgba(10, 15, 35, 0.84) 100%),
        linear-gradient(90deg, transparent, rgba(202, 232, 255, 0.66), transparent) top center / calc(100% - 64px) 1px no-repeat,
        linear-gradient(90deg, rgba(126, 221, 255, 0.92), rgba(126, 221, 255, 0)) top left / 32px 2px no-repeat,
        linear-gradient(180deg, rgba(126, 221, 255, 0.92), rgba(126, 221, 255, 0)) top left / 2px 32px no-repeat,
        linear-gradient(270deg, rgba(170, 136, 252, 0.84), rgba(170, 136, 252, 0)) top right / 32px 2px no-repeat,
        linear-gradient(180deg, rgba(170, 136, 252, 0.84), rgba(170, 136, 252, 0)) top right / 2px 32px no-repeat,
        linear-gradient(90deg, rgba(118, 207, 255, 0.62), rgba(118, 207, 255, 0)) bottom left / 24px 2px no-repeat,
        linear-gradient(0deg, rgba(118, 207, 255, 0.62), rgba(118, 207, 255, 0)) bottom left / 2px 24px no-repeat,
        linear-gradient(270deg, rgba(156, 118, 246, 0.66), rgba(156, 118, 246, 0)) bottom right / 24px 2px no-repeat,
        linear-gradient(0deg, rgba(156, 118, 246, 0.66), rgba(156, 118, 246, 0)) bottom right / 2px 24px no-repeat;
}

.hud-panel > * {
    position: relative;
    z-index: 2;
}

@supports not (clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px)) {
    .hud-panel {
        clip-path: none;
        border-radius: 12px !important;
        border: var(--hud-panel-border-width) solid rgba(128, 186, 255, 0.72) !important;
    }

    .hud-panel::before {
        content: none;
    }

    .hud-panel::after {
        content: none;
    }
}

/* Random pick config only: dark HUD number stepper refinement */
.random-config-panel .metric-control .el-input-number {
    background: rgba(10, 16, 35, 0.78) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
}

.random-config-panel .metric-control .el-input-number .el-input__inner {
    background: transparent !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.88) !important;
    font-weight: 500 !important;
}

.random-config-panel .metric-control .el-input-number__decrease,
.random-config-panel .metric-control .el-input-number__increase {
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.65) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.random-config-panel .metric-control .el-input-number__decrease:hover,
.random-config-panel .metric-control .el-input-number__increase:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.75) !important;
    border-color: rgba(120, 100, 255, 0.30) !important;
}

.random-config-panel .metric-control .el-input-number__decrease:active,
.random-config-panel .metric-control .el-input-number__increase:active,
.random-config-panel .metric-control .el-input-number__decrease.is-active,
.random-config-panel .metric-control .el-input-number__increase.is-active {
    background: rgba(255, 255, 255, 0.06) !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.36) !important;
}

.random-config-panel .metric-control .el-input-number.is-controls-right .el-input-number__decrease,
.random-config-panel .metric-control .el-input-number.is-controls-right .el-input-number__increase {
    border-left-color: rgba(255, 255, 255, 0.08) !important;
}

.random-config-panel .metric-control .metric-hint {
    color: rgba(255, 255, 255, 0.60) !important;
}

.random-config-panel .metric-item label {
    color: rgba(214, 224, 245, 0.66) !important;
}

/* History page only: dark HUD unification for list, tags, actions, pagination */
.history-page {
    --history-surface: rgba(10, 14, 34, 0.72);
    --history-row: rgba(255, 255, 255, 0.05);
    --history-row-hover: rgba(255, 255, 255, 0.09);
    --history-border: rgba(255, 255, 255, 0.06);
    --history-border-strong: rgba(139, 92, 246, 0.30);
    --history-text: rgba(255, 255, 255, 0.88);
    --history-text-2: rgba(255, 255, 255, 0.65);
    --history-text-3: rgba(255, 255, 255, 0.45);
}

.history-page .config-panel {
    background: rgba(10, 14, 34, 0.72) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45) !important;
}

.history-page .el-collapse {
    border-top: 1px solid var(--history-border) !important;
    border-bottom: 1px solid var(--history-border) !important;
    background: transparent !important;
}

.history-page .el-collapse-item {
    border: 1px solid var(--history-border) !important;
    background: var(--history-row) !important;
}

.history-page .el-collapse-item:hover {
    border-color: var(--history-border-strong) !important;
    background: var(--history-row-hover) !important;
}

.history-page .el-collapse-item__header {
    background: rgba(255, 255, 255, 0.04) !important;
    border-bottom: 1px solid var(--history-border) !important;
    color: var(--history-text) !important;
}

.history-page .el-collapse-item__header:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

.history-page .el-collapse-item__arrow {
    color: rgba(255, 255, 255, 0.70) !important;
}

.history-page .el-collapse-item__wrap,
.history-page .el-collapse-item__content {
    background: rgba(8, 12, 30, 0.62) !important;
    border-bottom: 1px solid var(--history-border) !important;
}

.history-page .history-item-info strong,
.history-page .history-mobile-view strong,
.history-page .panel-title {
    color: var(--history-text) !important;
}

.history-page .history-item-count,
.history-page .history-item-date,
.history-page .history-mobile-meta {
    color: var(--history-text-2) !important;
}

.history-page .history-mobile-meta span {
    color: var(--history-text-2) !important;
}

.history-page .history-item-tags .el-tag,
.history-page .history-table-container .el-tag {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    color: rgba(255, 255, 255, 0.72) !important;
}

.history-page .history-item-tags .el-tag.el-tag--warning,
.history-page .history-table-container .el-tag.el-tag--warning {
    background: rgba(255, 170, 80, 0.20) !important;
    border-color: rgba(255, 170, 80, 0.28) !important;
    color: rgba(255, 221, 182, 0.86) !important;
}

.history-page .history-item-tags .el-tag.el-tag--success,
.history-page .history-table-container .el-tag.el-tag--success {
    background: rgba(80, 170, 255, 0.22) !important;
    border-color: rgba(80, 170, 255, 0.30) !important;
    color: rgba(191, 226, 255, 0.88) !important;
}

.history-page .history-item-tags .el-tag.el-tag--danger,
.history-page .history-table-container .el-tag.el-tag--danger {
    background: rgba(255, 170, 80, 0.20) !important;
    border-color: rgba(255, 170, 80, 0.30) !important;
    color: rgba(255, 219, 178, 0.86) !important;
}

.history-page .history-item-tags .el-tag.el-tag--info,
.history-page .history-table-container .el-tag.el-tag--info {
    background: rgba(139, 92, 246, 0.24) !important;
    border-color: rgba(139, 92, 246, 0.30) !important;
    color: rgba(231, 220, 255, 0.86) !important;
}

.history-page .history-delete-btn.el-button,
.history-page .history-actions .el-button,
.history-page .el-collapse-item__header .el-button {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    color: rgba(255, 255, 255, 0.70) !important;
    box-shadow: none !important;
}

.history-page .history-delete-btn.el-button:hover,
.history-page .history-actions .el-button:hover,
.history-page .el-collapse-item__header .el-button:hover {
    background: rgba(255, 255, 255, 0.11) !important;
    border-color: rgba(139, 92, 246, 0.30) !important;
    color: rgba(255, 255, 255, 0.84) !important;
}

.history-page .history-table-container {
    background: rgba(10, 14, 34, 0.66) !important;
    border-color: var(--history-border) !important;
}

.history-page .history-actions {
    border-top: 1px solid var(--history-border) !important;
}

.history-page .el-table th.el-table__cell {
    color: var(--history-text) !important;
}

.history-page .el-table td.el-table__cell,
.history-page .question-content-cell,
.history-page .option-item-small,
.history-page .no-analysis,
.history-page .no-source {
    color: var(--history-text-2) !important;
}

.history-page .el-table th.el-table__cell,
.history-page .el-table td.el-table__cell,
.history-page .el-table::before {
    border-color: var(--history-border) !important;
}

.history-page .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
    background: rgba(255, 255, 255, 0.03) !important;
}

.history-page .el-table__body tr:hover > td.el-table__cell {
    background: rgba(139, 92, 246, 0.10) !important;
}

.history-page .el-pagination,
.history-page .el-pagination__total,
.history-page .el-pagination__jump {
    color: var(--history-text-2) !important;
}

.history-page .el-pagination .btn-prev,
.history-page .el-pagination .btn-next,
.history-page .el-pagination .el-pager li,
.history-page .el-pagination .el-input__inner {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.70) !important;
}

.history-page .el-pagination .el-pager li.active {
    background: rgba(139, 92, 246, 0.26) !important;
    border-color: rgba(139, 92, 246, 0.34) !important;
    color: rgba(255, 255, 255, 0.90) !important;
}

.history-page .el-pagination .btn-prev:hover,
.history-page .el-pagination .btn-next:hover,
.history-page .el-pagination .el-pager li:hover {
    color: rgba(255, 255, 255, 0.86) !important;
    border-color: rgba(139, 92, 246, 0.30) !important;
}