/* chenlu index.css */
        /* ═══ 侧边栏 ═══ */
        .sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s}
        .sidebar-overlay.open{opacity:1;pointer-events:auto}
        .sidebar{position:fixed;top:0;left:-280px;width:280px;height:100%;background:var(--bg2);z-index:1001;transition:left .3s;display:flex;flex-direction:column;border-right:1px solid var(--bd);overflow-y:auto;-webkit-overflow-scrolling:touch}
        .sidebar.open{left:0}
        .sb-header{padding:20px 16px;border-bottom:1px solid var(--bd)}
        .sb-new-chat{width:100%;padding:10px;background:rgba(61,186,106,.1);border:1px solid rgba(61,186,106,.2);border-radius:10px;color:var(--ac);font-size:14px;font-weight:500;cursor:pointer;text-align:center;margin-top:12px;display:block}
        .sb-new-chat:hover{background:rgba(61,186,106,.2)}
        .sb-history{flex:1;overflow-y:auto;padding:8px 0;min-height:60px}
        .sb-footer{padding:12px 16px;border-top:1px solid var(--bd)}
        .sb-link{display:block;padding:8px 12px;font-size:13px;color:var(--tx2);cursor:pointer;border-radius:8px}
        .sb-link:hover{background:rgba(255,255,255,.04);color:var(--tx)}
        .sb-link.danger{color:#e53e3e}
        .menu-btn{background:none;border:none;color:var(--tx);font-size:22px;cursor:pointer;padding:4px 8px;flex-shrink:0}
        #mainPage{flex:1;display:flex;flex-direction:column}
        /* ═══ 年轮家族主题变量 ═══ */
        :root{
          --bg:#0c1a0f;--bg2:#122018;--bg3:#1a2d1e;
          --tx:#e0ede2;--tx2:#9dbfa1;
          --ac:#3dba6a;--ac2:#52d47f;
          --gd:linear-gradient(135deg,#3dba6a,#52d47f);
          --bd:rgba(255,255,255,.06);
        }

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

        body { max-width:480px; margin:0 auto; box-shadow:0 0 30px rgba(0,0,0,0.15);
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
            background: var(--bg);
            color: var(--tx);
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            padding-bottom: 70px;
        }

        /* 顶部标题栏 — flex布局防溢出 */
        .header {
            background: linear-gradient(135deg, #0c2a14 0%, #081a0c 100%);
            border-bottom: 1px solid rgba(61,186,106,.15);
            color: white;
            padding: 12px 16px;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .header-content {
            flex: 1;
            min-width: 0;
            text-align: center;
        }

        .header h1 {
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 2px;
            color: var(--tx);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .header h1 em{font-style:normal;background:var(--gd);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}

        .header .subtitle {
            font-size: 11px;
            color: var(--tx2);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .login-btn {
            flex-shrink: 0;
            background: rgba(61,186,106,.15);
            border: 1px solid rgba(61,186,106,.35);
            color: var(--ac);
            min-height: 36px;
            padding: 6px 12px;
            border-radius: 18px;
            font-size: 12px;
            cursor: pointer;
            transition: all 0.2s;
            white-space: nowrap;
        }

        .login-btn:hover {
            background: rgba(61,186,106,.25);
        }

        /* 成长脉搏条 */
        .growth-pulse{
            display:flex;gap:8px;margin-bottom:12px;
        }
        .growth-pulse .pulse-item{
            flex:1;background:rgba(18,32,24,.85);border:1px solid var(--bd);
            border-radius:10px;padding:8px 0;text-align:center;
        }
        .growth-pulse .pulse-val{
            font-size:13px;font-weight:600;color:var(--ac);line-height:1.2;
        }
        .growth-pulse .pulse-item:first-child .pulse-val{color:#f59e0b;}
        .growth-pulse .pulse-label{
            font-size:10px;color:var(--tx2);margin-top:2px;
        }

        /* 主内容区 */
        .main-content {
            flex:1;display:flex;flex-direction:column;
            padding: 12px 16px;
            max-width: 800px;
            margin: 0 auto;
            width: 100%;
        }

        /* 对话框区域 */
        .chat-container {
            flex:1;display:flex;flex-direction:column;
        }

        /* 对话消息——中间可滚动区域 */
        .chat-messages {
            flex: 1;
            padding: 12px 16px 8px;
            overflow-y: auto;
            background: transparent;
            display: flex;
            flex-direction: column;
            -webkit-overflow-scrolling: touch;
        }

        .welcome-message {
            text-align: center;
            color: var(--tx2);
            padding: 8px 16px 4px;
        }

        .welcome-message h3 {
            font-size: 12px;
            color: var(--tx);
            margin-bottom: 8px;
            font-weight: 500;
        }

        .welcome-message p {
            font-size: 11px;
            color: var(--tx2);
        }

        .quick-q {
            padding: 11px 14px;
            background: rgba(61,186,106,.08);
            border: 1px solid rgba(61,186,106,.18);
            border-radius: 14px;
            font-size: 11px;
            color: var(--ac);
            cursor: pointer;
            transition: background .2s;
        }
        .quick-q:hover { background: rgba(61,186,106,.15); }

        /* AI风格输入区 */
        .chat-input-area {
            background: var(--bg2);
            border-top: 1px solid var(--bd);
            padding: 8px 14px;
            margin-bottom: 8px;
        }
        .chat-input-area textarea,#chatInput{background:transparent;color:var(--tx);border:none;}
        .chat-input-area textarea::placeholder,#chatInput::placeholder{color:var(--tx2);}

        /* .input-wrapper defined below in +号菜单 section */

        .chat-input {
            flex: 1;
            border: none;
            background: transparent;
            padding: 5px 0;
            font-size: 13px;
            outline: none;
            resize: none;
            min-height: 24px;
            max-height: 120px;
            line-height: 1.5;
        }

        .chat-input::placeholder {
            color: var(--tx2);
        }

        .input-actions {
            display: flex;
            align-items: center;
            gap: 4px;
        }

        .action-btn {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            border: none;
            background: transparent;
            color: var(--tx2);
            font-size: 16px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background 0.2s, color 0.2s;
        }

        .action-btn:hover {
            background: rgba(61,186,106,.15);
            color: var(--ac);
        }

        .send-btn {
            width: 36px;
            height: 36px;
            flex-shrink: 0;
            border-radius: 50%;
            background: var(--gd);
            border: none;
            color: #fff;
            font-size: 16px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: transform 0.2s, opacity 0.2s;
        }

        .send-btn:hover {
            transform: scale(1.05);
        }

        .send-btn:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }

        /* 上传提示区 */
        .upload-hint {
            display: flex;
            justify-content: center;
            gap: 8px;
            padding: 8px 4px 4px;
            font-size:12px;
            color: var(--tx2);
            white-space: nowrap;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
        }

        /* .upload-hint span defined below with full theme values */

        /* 文件预览 */
        .file-preview {
            display: none;
            padding: 4px 8px;
            max-height: 80px;
            overflow-y: auto;
        }

        .file-preview.show {
            display: flex;
            flex-wrap: wrap;
            gap: 4px;
        }

        .preview-item {
            display: flex;
            align-items: center;
            background: var(--bg3);
            border-radius: 6px;
            padding: 3px 8px;
            font-size: 12px;
            color: var(--tx2);
        }

        .preview-item img { margin-right: 4px; }

        .preview-item .remove-file {
            cursor: pointer;
            color: var(--tx2);
            font-size: 14px;
        }

        .preview-item .remove-file:hover {
            color: #e53e3e;
        }

        /* 隐藏的文件输入 */
        .hidden-input {
            display: none;
        }

        /* 底部导航栏 */
        .bottom-nav { max-width:480px; width:100%; left:50%; transform:translateX(-50%);
            position: fixed;
            bottom: 0;
            background: var(--bg2);
            display: flex;
            justify-content: space-around;
            padding: 5px 0;
            border-top: 1px solid var(--bd);
            box-shadow: 0 -2px 10px rgba(0,0,0,0.3);
            z-index: 9990;
        }

        .nav-item {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 8px 0;
            color: var(--tx2);
            text-decoration: none;
            cursor: pointer;
            transition: color 0.2s;
        }

        .nav-item:hover {
            color: var(--ac);
        }

        .nav-item.active {
            color: var(--ac);
        }

        .nav-item .nav-icon {
            font-size: 22px;
            margin-bottom: 4px;
        }

        .nav-item .nav-text {
            font-size: 12px;
        }

        /* 消息气泡样式 */
        .message {
            margin-bottom: 16px;
            display: flex;
            animation: fadeIn 0.3s ease;
        }

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

        .message.user {
            justify-content: flex-end;
        }

        .message-bubble {
            max-width: 80%;
            padding: 10px 14px;
            border-radius: 16px;
            font-size: 13px;
            line-height: 1.6;
        }

        .message.user .message-bubble {
            background: linear-gradient(135deg, #3dba6a 0%, #1a6b4a 100%);
            color: white;
            border-bottom-right-radius: 4px;
        }

        .message.assistant{flex-direction:column;align-items:flex-start}
.msg-actions{display:flex;gap:2px;padding:0;margin:4px 0 0 4px;opacity:0.4;transition:opacity 0.2s;font-size:0.85em}
.message.assistant:hover .msg-actions,.message.assistant:active .msg-actions{opacity:1}
.msg-actions button{background:none;border:none;color:#b0b0b0;cursor:pointer;padding:5px 7px;border-radius:6px;transition:all 0.15s;display:flex;align-items:center;justify-content:center}
.msg-actions button:hover{background:var(--bg3);color:var(--tx)}
.msg-actions button.active-like{color:#3dba6a}
.msg-actions button.active-dislike{color:#e53e3e}
.msg-actions svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.message.assistant .message-bubble {
            background: var(--bg3);
            color: var(--tx);
            border: 1px solid var(--bd);
            border-bottom-left-radius: 4px;
            max-width: 95%;
        }

        /* 文件消息 */
        .message-file {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 8px 12px;
            background: rgba(255,255,255,0.2);
            border-radius: 8px;
            margin-bottom: 8px;
            font-size: 12px;
        }

        .message.assistant .message-file {
            background: var(--bg3);
        }

        /* 加载动画 */
        .typing-indicator {
            display: flex;
            gap: 4px;
            padding: 4px 0;
        }

        .typing-indicator span {
            width: 8px;
            height: 8px;
            background: #3dba6a;
            border-radius: 50%;
            animation: typing 1.4s infinite ease-in-out;
        }

        .typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
        .typing-indicator span:nth-child(3) { animation-delay: 0.4s; }

        @keyframes typing {
            0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
            30% { transform: translateY(-8px); opacity: 1; }
        }

        /* 打字光标 */
        .typing-cursor {
            display: inline-block;
            animation: blink 0.7s infinite;
            color: #3dba6a;
            font-weight: bold;
        }

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

        /* 响应式 */
        @media (max-width: 480px) {
            .index-tab {
                min-width: calc(33.33% - 8px);
                font-size: 12px;
            }

            .chat-messages {
                height: auto;
            }

            .upload-hint {
                font-size:12px;
                gap: 12px;
            }
        }
    
/* +号菜单和模式选择样式 */
.add-btn{width:36px;height:36px;border-radius:50%;background:var(--bg3);border:none;font-size:18px;color:var(--ac);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.add-btn:hover{background:rgba(61,186,106,.2);}
.add-menu{position:absolute;bottom:50px;left:0;background:var(--bg2);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.3);border:1px solid var(--bd);padding:8px 0;display:none;min-width:140px;z-index:200;max-height:320px;overflow-y:auto;}
.add-menu.show{display:block;}
.add-menu-item{display:flex;align-items:center;gap:10px;padding:10px 16px;cursor:pointer;font-size:14px;color:var(--tx);}
.add-menu-item:hover{background:var(--bg3);}
.mode-select{position:relative;flex-shrink:0;}
.mode-btn{display:flex;align-items:center;gap:4px;padding:6px 10px;background:var(--bg3);border:none;border-radius:16px;font-size:12px;color:var(--tx2);cursor:pointer;}
.mode-btn:hover{background:rgba(61,186,106,.2);color:var(--ac);}
.mode-menu{position:absolute;bottom:40px;right:0;background:var(--bg2);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.3);border:1px solid var(--bd);padding:8px 0;display:none;min-width:130px;z-index:200;}
.mode-menu.show{display:block;}
.mode-menu-item{display:flex;align-items:center;gap:8px;padding:10px 16px;cursor:pointer;font-size:13px;color:var(--tx);}
.mode-menu-item:hover{background:var(--bg3);}
.mode-menu-item.active{color:var(--ac);background:rgba(61,186,106,.1);}
.input-wrapper{position:relative;display:flex;align-items:center;gap:4px;background:transparent;border:none;padding:0;border-radius:0;}
.input-wrapper:focus-within{border:none;box-shadow:none;}

/* a11y-v1: 无障碍基础 */
:focus-visible{outline:2px solid #3dba6a;outline-offset:2px;border-radius:4px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
@media(prefers-reduced-motion:reduce){*{animation-duration:0.01ms!important;transition-duration:0.01ms!important}}
.upload-hint span{cursor:pointer;transition:all .2s;padding:4px 6px;border-radius:8px;display:flex;align-items:center;gap:2px;white-space:nowrap;flex-shrink:0;}
.upload-hint span:hover{background:rgba(61,186,106,.15);color:var(--ac);}
.upload-hint span:active{transform:scale(0.95);}
/* 投喂面板 */
.feed-panel{background:var(--bg2);border-radius:10px;padding:6px 8px;border:1px solid rgba(61,186,106,.1);color:var(--tx);margin-top:auto;margin-bottom:4px;}
.feed-header{text-align:center;margin-bottom:6px;}
.feed-title{font-size:11px;font-weight:600;color:var(--tx);}
.feed-hint{font-size:11px;color:var(--tx2);margin-top:2px;}
.feed-entries{display:flex;flex-direction:row;gap:8px;}
.feed-entry{background:var(--bg2);border:1px solid var(--bd);border-radius:10px;padding:10px;cursor:pointer;transition:all .2s;flex:1;color:var(--tx);}
.feed-entry:hover{border-color:rgba(61,186,106,.35);background:var(--bg3);}
.feed-entry-top{display:flex;align-items:center;justify-content:center;gap:4px;margin-bottom:2px;}
.feed-entry-icon{font-size:13px;}
.feed-entry-name{font-size:11px;font-weight:400;color:var(--tx);}
.feed-entry-desc{font-size:10px;color:var(--tx2);text-align:center;}
.feed-back{background:none;border:none;color:#3dba6a;font-size:13px;cursor:pointer;padding:0;margin-bottom:8px;}
.ftxt textarea{width:100%;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:10px 40px 10px 12px;font-size:14px;font-family:inherit;resize:none;outline:none;background:var(--bg3);color:var(--tx);}
.fdim-tags{display:flex;flex-wrap:nowrap;gap:4px;margin:8px 0;overflow-x:auto;}
.fdim-tag{min-height:36px;display:inline-flex;align-items:center;font-size:12px;padding:3px 8px;border-radius:16px;border:1px solid var(--bd);cursor:pointer;background:var(--bg3);color:var(--tx2);white-space:nowrap;flex-shrink:0;}
.fdim-tag.active{background:var(--ac);color:#fff;border-color:var(--ac);}
.fsubmit{text-align:center;margin-top:8px;}
.fsubmit button{background:#3dba6a;color:#fff;border:none;border-radius:20px;padding:8px 24px;font-size:14px;cursor:pointer;}
.fsubmit button:disabled{background:rgba(255,255,255,.08);color:rgba(255,255,255,.3);cursor:default;}
.mtags{display:flex;flex-wrap:wrap;gap:6px;overflow-x:visible;justify-content:center;}
.mtag{min-height:36px;display:inline-flex;align-items:center;font-size:12px;padding:4px 7px;border-radius:20px;border:1px solid var(--bd);cursor:pointer;background:var(--bg3);color:var(--tx2);white-space:nowrap;}
.mtag.sel{background:var(--ac);color:#fff;border-color:var(--ac);}
.cb{background:var(--bg3);border:none;border-radius:16px;padding:6px 16px;font-size:13px;cursor:pointer;color:var(--tx);}
.sb{background:#3dba6a;color:#fff;border:none;border-radius:16px;padding:6px 16px;font-size:13px;cursor:pointer;}
.sb:disabled{background:rgba(255,255,255,.08);color:rgba(255,255,255,.3);}
.voice-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:18px;cursor:pointer;}
.ftime{margin:8px 0;font-size:13px;color:var(--tx2);}
.ftime input{border:1px solid rgba(61,186,106,.2);border-radius:8px;padding:4px 8px;font-size:13px;width:60%;margin-left:4px;background:var(--bg3);color:var(--tx);}

/* ═══ 全局元素主题 ═══ */
textarea,input[type=text]{background:var(--bg3);color:var(--tx);border:1px solid rgba(61,186,106,.2);border-radius:8px;}
button[class*="submit"],button[id*="Btn"]:not(:disabled){background:var(--gd);color:#fff;border:none;}
.send-btn,[class*="send"]{background:var(--gd);color:#fff;}
/* 训练模块 */
#training-stats-bar>div{background:var(--bg2);border:1px solid var(--bd);}
#training-stats-bar>div:last-child{background:linear-gradient(135deg,#3dba6a,#1a6b4a);border:none;}
#microQuestion{color:var(--tx);}
#microSum{color:var(--tx2);}
#microAns{background:var(--bg3);border-color:rgba(61,186,106,.2);color:var(--tx);}
#creativityModule{background:var(--bg);}
#dialecticModule{background:var(--bg);}
#dialecticModule>div:first-child{background:var(--bg2);box-shadow:0 1px 4px rgba(0,0,0,0.3);}
#dialecticModule>div:first-child span{color:var(--tx);}
#dialecticModule>div:first-child button{color:var(--tx);}

/* 新手引导卡片 */
@keyframes onboardFadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.onboarding-card{
  background:linear-gradient(135deg,#1a2d1e,#122018);
  border:1px solid rgba(61,186,106,.2);
  border-left:4px solid var(--ac);
  border-radius:12px;
  padding:18px 16px;
  margin:0 12px 12px;
  animation:onboardFadeIn .4s ease-out;
}
.onboarding-card h3{
  font-size:16px;color:var(--tx);margin-bottom:14px;font-weight:600;
}
.onboarding-card .ob-step{
  display:flex;align-items:flex-start;gap:10px;margin-bottom:12px;
}
.onboarding-card .ob-num{
  flex-shrink:0;width:24px;height:24px;border-radius:50%;
  background:var(--gd);color:#fff;font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.onboarding-card .ob-text{font-size:13px;color:var(--tx2);line-height:1.5;padding-top:2px;}
.onboarding-card .ob-text strong{color:var(--tx);font-weight:600;}
.onboarding-card .ob-dismiss{
  display:block;width:100%;margin-top:6px;padding:12px;
  border:none;border-radius:8px;cursor:pointer;
  background:rgba(61,186,106,.15);color:var(--ac);
  font-size:14px;font-weight:600;
  min-height:44px;
  transition:background .2s;
}
.onboarding-card .ob-dismiss:active{background:rgba(61,186,106,.3);}
@keyframes cvF1{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
@keyframes cvF2{0%,100%{transform:translateY(0)}50%{transform:translateY(15px)}}
@keyframes cvIn{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
#coverPage .cv{opacity:0;animation:cvIn .8s ease forwards}