css
/* 
   Blue Archive Style Theme Update 
   风格关键词: 清新、科技感、扁平化、高亮蓝、光环
*/

.max-w-\[720px\] {
    /* --- 核心配色 (Kivotos Palette) --- */
    --ba-blue-primary: #1289F4;      /* 标志性的天蓝色 */
    --ba-blue-dark: #005C9A;         /* 深蓝装饰 */
    --ba-blue-light: #E0F2FE;        /* 浅蓝背景 */
    --ba-bg-gray: #F3F5F9;           /* 整体灰白背景 */
    --ba-text-dark: #2B3A55;         /* 主要文字深蓝灰 */
    --ba-text-gray: #6B7C93;         /* 次要文字 */
    --ba-accent-pink: #FF5E5E;       /* 强调色/警告 */
    --ba-yellow: #FFD02A;            /* 装饰黄 */
    --ba-card-bg: #FFFFFF;
    
    /* 覆盖原有变量以适配新风格 */
    --theme-bg: var(--ba-bg-gray);
    --theme-paper: var(--ba-card-bg);
    --theme-text-primary: var(--ba-text-dark);
    --theme-text-secondary: var(--ba-text-gray);
    --theme-header: var(--ba-blue-primary);
    --theme-accent: var(--ba-blue-primary);
    --theme-border: #DCE6F0;
    --theme-shadow: rgba(18, 137, 244, 0.15);
    --theme-shadow-strong: rgba(18, 137, 244, 0.25);
    
    --border-radius-main: 12px;
    --border-radius-inner: 6px;
    /* 推荐使用无衬线字体以符合科幻/UI感 */
    --font-family-main: 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif;
}

/* --- 🌙 暗黑模式适配 (Night in Kivotos) --- */
.dark .max-w-\[720px\] {
    --ba-bg-gray: #1a202c;
    --ba-card-bg: #222938;
    --ba-text-dark: #E2E8F0;
    --ba-text-gray: #94A3B8;
    --theme-border: #2D3748;
    --theme-shadow: rgba(0, 0, 0, 0.3);
}

/* --- 🚀 根容器：终端风格 --- */
.ba-terminal-root {
    font-family: var(--font-family-main);
    background-color: var(--theme-bg);
    border-radius: var(--border-radius-main);
    padding: 16px;
    border: 1px solid var(--theme-border);
    position: relative;
    overflow: hidden;
}

/* --- 顶部装饰 --- */
.ba-top-decor {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid var(--ba-blue-primary);
    padding-bottom: 8px;
    margin-bottom: 16px;
}
.ba-logo-text {
    font-weight: 900;
    font-size: 1.2em;
    color: var(--ba-text-dark);
    font-style: italic;
    letter-spacing: -0.5px;
}
.ba-time-display {
    font-size: 0.8em;
    color: var(--ba-blue-primary);
    font-family: monospace;
    background: var(--ba-blue-light);
    padding: 2px 8px;
    border-radius: 4px;
}

/* --- 标题栏 --- */
.ba-section-title {
    font-size: 0.9em;
    font-weight: 800;
    color: var(--theme-text-secondary);
    letter-spacing: 1px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.ba-section-title .icon {
    filter: grayscale(100%); /* 让emoji不那么突兀 */
    font-size: 1.1em;
}

/* --- 📂 记忆文件夹 (Details/Summary 魔改) --- */
.ba-memory-grid {
    display: grid;
    gap: 10px;
}
.ba-folder {
    border: 1px solid var(--theme-border);
    background: var(--theme-paper);
    border-radius: var(--border-radius-inner);
    overflow: hidden;
    transition: all 0.2s ease;
}
.ba-folder summary {
    list-style: none;
    padding: 8px 12px;
    background: linear-gradient(90deg, #fff 0%, #f8fafd 100%);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 0.85em;
    color: var(--ba-blue-dark);
    user-select: none;
}
.ba-folder summary::-webkit-details-marker { display: none; }
.ba-folder .status-dot {
    width: 8px;
    height: 8px;
    background: var(--ba-blue-primary);
    border-radius: 50%;
    box-shadow: 0 0 5px var(--ba-blue-primary);
    animation: ba-pulse 2s infinite;
}
.ba-folder .folder-content {
    padding: 10px;
    background: #fff;
    border-top: 1px dashed var(--theme-border);
}
.ba-folder .log-entry {
    font-size: 0.9em;
    line-height: 1.5;
    color: var(--theme-text-primary);
    display: flex;
    gap: 10px;
}
.ba-folder .log-entry .time {
    font-family: monospace;
    color: var(--theme-text-secondary);
    font-size: 0.8em;
    min-width: 40px;
    padding-top: 2px;
}

/* --- 🆔 学生卡片 (核心UI) --- */
.ba-student-card {
    background: var(--theme-paper);
    border-radius: var(--border-radius-main);
    box-shadow: 0 4px 12px var(--theme-shadow);
    overflow: hidden;
    margin-bottom: 12px;
    border: 1px solid var(--theme-border);
    position: relative;
}
.ba-student-card.protagonist {
    border-left: 5px solid var(--ba-blue-primary);
}
.ba-student-card.npc {
    border-left: 5px solid var(--ba-yellow);
}

.card-header-stripe {
    height: 6px;
    background: repeating-linear-gradient(
        45deg,
        var(--ba-blue-light),
        var(--ba-blue-light) 10px,
        #fff 10px,
        #fff 20px
    );
}

.card-body {
    padding: 12px;
    display: flex;
    gap: 12px;
}
.card-body.compact {
    padding: 10px;
}

/* 头像占位符 */
.student-avatar-placeholder {
    width: 60px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.halo-ring {
    width: 40px;
    height: 40px;
    border: 2px solid var(--ba-blue-primary);
    border-radius: 50%;
    position: relative;
}
.halo-ring::after {
    content: '';
    position: absolute;
    top: -4px; left: 10px;
    width: 10px; height: 10px;
    background: #fff; /* 模拟光环断点 */
}
.student-avatar-placeholder span {
    font-size: 0.6em;
    background: var(--ba-text-dark);
    color: #fff;
    padding: 1px 4px;
    border-radius: 2px;
}

/* 信息区 */
.student-info {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.name-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    border-bottom: 2px solid var(--ba-bg-gray);
    padding-bottom: 4px;
}
.student-name {
    font-weight: 800;
    font-size: 1.1em;
    color: var(--ba-text-dark);
}
.student-school {
    font-size: 0.75em;
    font-weight: 700;
    color: var(--ba-text-gray);
    text-transform: uppercase;
}

/* 网格信息 */
.info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
.info-item, .info-row {
    display: flex;
    flex-direction: column;
}
.info-row {
    margin-top: 4px;
}
.info-item .label, .info-row .label {
    font-size: 0.65em;
    font-weight: 900;
    color: var(--ba-blue-primary);
    text-transform: uppercase;
    margin-bottom: 2px;
}
.info-item .value, .info-row .value {
    font-size: 0.9em;
    color: var(--theme-text-primary);
    line-height: 1.3;
}
.text-sm {
    font-size: 0.85em !important;
}

/* 背景故事滚动条 */
.bg-story .scroll-text {
    max-height: 50px;
    overflow-y: auto;
    font-size: 0.85em;
    color: var(--theme-text-secondary);
    background: var(--ba-bg-gray);
    padding: 6px;
    border-radius: 4px;
}
.bg-story .scroll-text::-webkit-scrollbar {
    width: 3px;
}
.bg-story .scroll-text::-webkit-scrollbar-thumb {
    background: var(--ba-blue-primary);
    border-radius: 2px;
}

/* --- NPC 区域 --- */
.ba-npc-zone {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--theme-border);
}
.ba-sub-header {
    font-family: monospace;
    font-size: 0.75em;
    color: var(--ba-text-gray);
    margin-bottom: 8px;
    opacity: 0.7;
}

/* --- 文本区域 --- */
.ba-main-text-area {
    margin-top: 20px;
    padding: 10px 5px;
    font-size: 1em;
    line-height: 1.6;
    color: var(--theme-text-primary);
    border-top: 2px solid var(--ba-blue-light);
}

/* --- 动画 --- */
@keyframes ba-pulse {
    0% { opacity: 0.6; transform: scale(0.9); }
    50% { opacity: 1; transform: scale(1.1); }
    100% { opacity: 0.6; transform: scale(0.9); }
}

/* --- 覆盖原有 <details> 样式以匹配新主题 --- */
.markdown-body details {
    background-color: transparent;
    border: none;
}
/* 隐藏默认三角 */
.markdown-body summary::before {
    display: none !important;
}