* { margin: 0; padding: 0; box-sizing: border-box; font-family: "Microsoft Yahei", sans-serif; }
body {
    background: linear-gradient(135deg, #F0F8F5 0%, #E6F2EF 100%);
    min-height: 100vh;
    padding: 20px;
    padding-bottom: 80px;
    position: relative;
}
.container {
    max-width: 1200px;
    margin: 0 auto;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(46,139,87,0.1);
    padding: 25px;
    /* 未登录时最小高度，保证页面美观 */
    min-height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* 头部+友情链接按钮（核心入口样式强化） */
.header { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    margin-bottom: 15px; 
    padding-bottom:15px; 
    border-bottom:1px solid #e8f4f0; 
    flex-wrap: wrap; 
    gap: 15px;
}
.header-left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}
.header h1 { color: #2E8B57; font-size:24px; font-weight:700; }
.brand-tag { 
    font-size:12px; 
    color:#1A5F38; 
    background:#F0F8F5; 
    padding:2px 8px; 
    border-radius:4px;
}
.friend-link {
    padding: 6px 12px;
    background: #1A5F38;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-size: 13px;
    transition: all 0.3s;
    display: inline-block;
}
.friend-link:hover {
    background: #2E8B57;
    transform: translateY(-2px);
}
.mobile-link { display: none; }
.pwd-input { 
    padding:8px 12px; 
    border:1px solid #d1e9df; 
    border-radius:6px; 
    outline:none; 
    width:160px; 
    transition:all 0.3s; 
}
.pwd-input:focus { 
    border-color:#2E8B57; 
    box-shadow:0 0 0 2px rgba(46,139,87,0.1); 
}

/* AI生成区样式（预留） */
.ai-section {
    display: flex;
    justify-content: center;
    margin-bottom: 15px;
    padding: 10px;
    background: #f8fdfb;
    border-radius: 8px;
}
.ai-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}
.ai-model-controls {
    display: flex;
    gap: 15px;
    align-items: flex-end;
    flex-wrap: wrap;
}
.model-select-container {
    display: flex;
    gap: 8px;
    align-items: center;
}
.model-select {
    padding: 8px 12px;
    border: 1px solid #d1e9df;
    border-radius: 6px;
    outline: none;
    color: #2E8B57;
    background: #fff;
    min-width: 200px;
}
.model-select:focus {
    border-color: #2E8B57;
    box-shadow: 0 0 0 2px rgba(46,139,87,0.1);
}
.model-add-container {
    display: flex;
    gap: 8px;
    align-items: center;
}
#newModelInput {
    padding: 8px 12px;
    border: 1px solid #d1e9df;
    border-radius: 6px;
    outline: none;
    width: 200px;
}
#newModelInput:focus {
    border-color: #2E8B57;
    box-shadow: 0 0 0 2px rgba(46,139,87,0.1);
}
#aiPrompt {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #d1e9df;
    border-radius: 6px;
    outline: none;
}
#aiPrompt:focus {
    border-color: #2E8B57;
    box-shadow: 0 0 0 2px rgba(46,139,87,0.1);
}

/* 搜索+导出区样式 */
.search-export-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    padding: 10px;
    background: #f8fdfb;
    border-radius: 8px;
    flex-wrap: wrap;
    gap: 10px;
}
.search-box {
    display: flex;
    gap: 8px;
}
#searchInput {
    padding: 8px 12px;
    border: 1px solid #d1e9df;
    border-radius: 6px;
    outline: none;
    width: 200px;
}
#searchInput:focus {
    border-color: #2E8B57;
    box-shadow: 0 0 0 2px rgba(46,139,87,0.1);
}

/* 按钮通用样式 */
.btn { 
    padding:8px 16px; 
    border:none; 
    border-radius:6px; 
    cursor:pointer; 
    font-size:14px; 
    transition:all 0.3s ease; 
    margin-left:8px; 
}
.btn-primary { background: #2E8B57; color:#fff; }
.btn-primary:hover { background:#1A5F38; transform: translateY(-2px); box-shadow:0 4px 8px rgba(46,139,87,0.2); }
.btn-danger { background: #dc3545; color:#fff; }
.btn-danger:hover { background:#bb2d3b; }
.btn-success { background: #198754; color:#fff; }
.btn-success:hover { background:#157347; }
.btn-secondary { background: #6c757d; color:#fff; }
.btn-secondary:hover { background: #5a6268; }
.btn-warning { background: #ffc107; color:#212529; }
.btn-warning:hover { background: #fd7e14; }
.btn-sm { padding:6px 12px; font-size:13px; margin-right:8px; }

/* 分类筛选区 */
.filter-section { 
    display:flex; 
    justify-content: space-between; 
    align-items:center; 
    margin-bottom:15px; 
    flex-wrap: wrap; 
    gap:10px; 
    padding:10px; 
    background:#F0F8F5; 
    border-radius:10px; 
}
.category-select { 
    padding:8px 12px; 
    border:1px solid #d1e9df; 
    border-radius:6px; 
    outline:none; 
    color:#2E8B57; 
    background:#fff; 
}
.shortcut-tips { font-size:12px; color:#669980; }
.edit-tag {
    font-size: 12px;
    color: #fd7e14;
    font-weight: bold;
    background: #fff3cd;
    padding: 2px 8px;
    border-radius: 4px;
}

/* 编辑器 */
.editor-section { margin-bottom:25px; }
#editor {
    width:100%; height:220px; padding:18px; border:1px solid #d1e9df; border-radius:10px;
    resize:vertical; font-size:15px; line-height:1.7; color:#333; outline:none;
    transition:all 0.3s; background:#fdfefe;
}
#editor:focus { border-color:#2E8B57; box-shadow:0 0 0 2px rgba(46,139,87,0.1); }
.editor-tools { margin-top:10px; }

/* 历史文案列表 - 序号+删除按钮样式 */
.clipboard-section h3 { color:#2E8B57; margin-bottom:15px; font-size:18px; }
.clip-list { display:grid; gap:12px; }
.clip-item {
    padding:16px; background:#fdfefe; border-radius:10px; border-left:4px solid #2E8B57;
    cursor:pointer; transition:all 0.2s ease; border-bottom:1px solid #e8f4f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.clip-item:hover { background:#F0F8F5; transform:translateX(4px); }
.clip-item .content-wrap { flex:1; display: flex; align-items: flex-start; gap: 10px; }
.clip-item .serial-number {
    width: 24px;
    height: 24px;
    background: #2E8B57;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0;
}
.clip-item .text-content { flex:1; }
.clip-item p { color:#333; margin-bottom:8px; word-break:break-all; }
.clip-item .meta { display:flex; justify-content:space-between; font-size:12px; color:#669980; }
.clip-item .cate-tag { background:#2E8B57; color:#fff; padding:1px 6px; border-radius:3px; font-size:10px; }
.clip-item .btn-group {
    display: flex;
    gap: 8px;
}
.clip-item .share-btn, .clip-item .delete-btn {
    width: 36px; 
    height: 36px; 
    border-radius: 50%; 
    border:none;
    color:#fff; 
    cursor:pointer;
    display: flex !important;
    align-items: center; 
    justify-content: center;
}
.clip-item .share-btn { background: #2E8B57; }
.clip-item .delete-btn { background: #dc3545; }
.clip-item .share-btn:hover { background:#1A5F38; }
.clip-item .delete-btn:hover { background:#bb2d3b; }

/* 移动端底部栏 */
.mobile-bottom-bar {
    display: none;
    position: fixed; bottom:0; left:0; right:0;
    background: #2E8B57; padding:12px 0;
    display: flex; justify-content: space-around; align-items:center;
    box-shadow:0 -2px 10px rgba(0,0,0,0.1); z-index:9999;
}
.mobile-btn { 
    width:50px; height:50px; border-radius:50%; border:none; 
    background:#fff; color:#2E8B57; font-size:20px; cursor:pointer; 
    margin:0 5px; transition:all 0.3s; 
}
.mobile-btn:hover { background:#F0F8F5; transform:scale(1.05); }

/* 分享弹窗+二维码优化 */
.modal {
    display: none; 
    position: fixed; 
    top:0; left:0; width:100%; height:100%;
    background: rgba(0,0,0,0.5); 
    z-index:99999; 
    align-items:center; 
    justify-content:center;
    padding: 20px;
}
.modal-content {
    background: #fff; 
    padding:20px; 
    border-radius:12px; 
    width:90%; 
    max-width:400px;
    text-align: center; 
    position: relative;
    box-sizing: border-box;
}
.close-modal {
    position: absolute; 
    top:10px; right:15px; 
    font-size:24px; 
    cursor:pointer;
    color:#666;
}
.close-modal:hover { color:#dc3545; }
/* 二维码容器优化：动态适应内容长度 */
.qrcode-container { 
    margin:15px auto; 
    width: 200px;
    height: 200px;
    min-height: 200px;
    border:1px solid #f0f0f0;
    padding: 5px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.qrcode-container img, .qrcode-container canvas {
    max-width: 100%;
    max-height: 100%;
}
.share-url {
    width:100%; 
    padding:10px; 
    margin:10px 0; 
    border:1px solid #d1e9df;
    border-radius:6px; 
    outline:none; 
    font-size:14px;
    word-break: break-all;
}

/* 响应式适配 */
@media (max-width: 768px) {
    .container { padding:15px; min-height: 250px; }
    .header { flex-direction:column; align-items:flex-start; }
    .header-left { width: 100%; }
    .pc-link { display: none; } 
    .mobile-link { display: inline-block; margin-top: 10px; }
    .user-actions { width:100%; display:flex; justify-content:space-between; margin-top:10px; flex-wrap: wrap; gap: 8px; }
    .pwd-input { width:100%; max-width:140px; }
    #editor { height:180px; }
    .filter-section { flex-direction:column; align-items:flex-start; }
    .shortcut-tips { margin-top:5px; }
    .search-export-section { flex-direction: column; align-items: flex-start; }
    #searchInput { width: 100%; }
    .qrcode-container { width: 180px; height: 180px; }
}
@media (min-width: 769px) {
    .mobile-bottom-bar { display: none !important; }
    .mobile-link { display: none; }
}