/* ========== 全局变量与基础 ========== */
:root {
    --bg-main: #f7f9f4;
    --bg-card: #ffffff;
    --bg-soft: #f0f4eb;
    --green-primary: #7fb07f;
    --green-dark: #5c8a5c;
    --green-light: #d4e8d4;
    --green-pale: #e8f3e8;
    --text-primary: #3d4a3d;
    --text-secondary: #6b7f6b;
    --text-muted: #9aac9a;
    --pink-accent: #f2c4c4;
    --pink-pale: #fdf0f0;
    --blue-accent: #c8dce8;
    --border-light: #e8efe8;
    --shadow-soft: 0 2px 16px rgba(120, 140, 120, 0.08);
    --shadow-hover: 0 6px 24px rgba(120, 140, 120, 0.15);
    --radius-md: 12px;
    --radius-lg: 18px;
    --radius-sm: 8px;
    --font-body: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', 'Segoe UI', sans-serif;
    --font-serif: 'Georgia', 'Noto Serif SC', 'SimSun', serif;
}

body {
    font-family: var(--font-body) !important;
    background: var(--bg-main) !important;
    background-image: 
        radial-gradient(ellipse at 15% 20%, rgba(127,176,127,0.06), transparent 60%),
        radial-gradient(ellipse at 85% 70%, rgba(242,196,196,0.08), transparent 55%),
        radial-gradient(ellipse at 50% 90%, rgba(200,220,232,0.07), transparent 50%) !important;
    background-attachment: fixed !important;
    color: var(--text-primary) !important;
    line-height: 1.7;
}

a {
    color: var(--green-dark);
    text-decoration: none;
    transition: all 0.3s ease;
}
a:hover {
    color: var(--green-primary);
}

/* ========== 顶部导航 ========== */
#header {
    background: rgba(255,255,255,0.88) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--border-light);
    padding: 0 24px !important;
    box-shadow: none !important;
}
#blogTitle h1 {
    font-family: var(--font-serif) !important;
    font-size: 1.8rem !important;
    letter-spacing: 4px !important;
    color: var(--green-dark) !important;
}
#blogTitle h1 a {
    color: var(--green-dark) !important;
}
#blogTitle h2 {
    font-size: 0.9rem !important;
    color: var(--text-secondary) !important;
    letter-spacing: 2px !important;
    font-style: italic;
}
#navigator {
    background: transparent !important;
    border: none !important;
    margin: 8px 0 0 0 !important;
}
#navigator a {
    color: var(--text-secondary) !important;
    font-size: 0.9rem !important;
    padding: 6px 12px !important;
    border-radius: 20px;
}
#navigator a:hover {
    background: var(--green-pale);
    color: var(--green-dark) !important;
}

/* ========== 主内容区域 ========== */
#main {
    max-width: 1100px;
    margin: 20px auto !important;
    padding: 0 20px !important;
    display: flex;
    gap: 24px;
}
#mainContent {
    flex: 1;
    min-width: 0;
    background: transparent !important;
}
.day {
    background: var(--bg-card) !important;
    border-radius: var(--radius-lg) !important;
    padding: 26px 28px !important;
    margin-bottom: 20px !important;
    box-shadow: var(--shadow-soft);
    border: 1px solid var(--border-light);
    transition: all 0.3s ease;
}
.day:hover {
    box-shadow: var(--shadow-hover);
    transform: translateY(-2px);
    border-color: var(--green-light);
}
.postTitle, .postTitle a {
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    color: var(--text-primary) !important;
    letter-spacing: 0.3px;
}
.postDesc {
    font-size: 0.82rem !important;
    color: var(--text-muted) !important;
    border-bottom: 1px dashed var(--border-light);
    padding-bottom: 10px;
    margin-bottom: 14px;
}
.postBody {
    font-size: 0.95rem !important;
    color: var(--text-secondary) !important;
    line-height: 1.8 !important;
}
.postBody p {
    margin-bottom: 12px;
}
.postBody img {
    border-radius: var(--radius-sm);
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}
.c_b_p_desc {
    color: var(--text-muted);
    font-size: 0.8rem;
}
.entrylistItem {
    background: var(--bg-card);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    margin-bottom: 12px;
    box-shadow: var(--shadow-soft);
    border: 1px solid var(--border-light);
}

/* ========== 侧边栏 ========== */
#sideBar {
    width: 320px !important;
    flex-shrink: 0;
    background: transparent !important;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0 !important;
}
#sideBar .sidebar-card {
    background: var(--bg-card);
    border-radius: var(--radius-lg);
    padding: 22px 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid var(--border-light);
    margin-bottom: 20px;
}
#sideBar .sidebar-card h3 {
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: var(--green-dark) !important;
    margin-bottom: 16px !important;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.profile-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--green-light), var(--pink-accent));
    margin: 0 auto 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    border: 3px solid #fff;
    box-shadow: 0 0 0 3px var(--green-light);
}
.profile-name {
    font-weight: 600;
    font-size: 1rem;
    text-align: center;
    color: var(--text-primary);
}
.profile-bio {
    font-size: 0.82rem;
    color: var(--text-muted);
    text-align: center;
    margin-top: 6px;
    line-height: 1.6;
}
.profile-social {
    display: flex;
    justify-content: center;
    gap: 14px;
    margin-top: 14px;
}
.profile-social a {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--bg-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    color: var(--text-secondary);
    transition: all 0.3s;
}
.profile-social a:hover {
    background: var(--green-light);
    color: var(--green-dark);
    transform: translateY(-2px);
}
.notice-list, .category-list {
    list-style: none;
    font-size: 0.85rem;
    color: var(--text-secondary);
    padding: 0;
}
.notice-list li, .category-list li {
    padding: 8px 0;
    border-bottom: 1px dashed var(--border-light);
    display: flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.6;
}
.notice-list li:last-child, .category-list li:last-child {
    border-bottom: none;
}
.notice-dot {
    color: var(--green-primary);
    font-size: 0.7rem;
    margin-top: 5px;
    flex-shrink: 0;
}
.category-list li {
    justify-content: space-between;
}
.category-list .count {
    background: var(--green-pale);
    color: var(--green-dark);
    border-radius: 12px;
    padding: 2px 10px;
    font-size: 0.72rem;
    font-weight: 600;
}
.comment-item {
    padding: 10px 0;
    border-bottom: 1px dashed var(--border-light);
    font-size: 0.82rem;
    color: var(--text-secondary);
    line-height: 1.6;
}
.comment-author {
    font-weight: 600;
    color: var(--green-dark);
    font-size: 0.78rem;
}
.comment-text {
    color: var(--text-muted);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.mini-calendar {
    text-align: center;
}
.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 0.85rem;
    color: var(--text-secondary);
    font-weight: 500;
}
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    font-size: 0.75rem;
}
.day-name {
    color: var(--text-muted);
    font-weight: 600;
    padding: 4px 0;
}
.day {
    padding: 6px 0;
    border-radius: 6px;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.2s;
}
.day:hover {
    background: var(--green-pale);
}
.day.today {
    background: var(--green-primary);
    color: #fff;
    font-weight: 600;
}
.day.empty {
    cursor: default;
}
.friend-links a {
    display: inline-block;
    color: var(--text-secondary);
    background: var(--bg-soft);
    padding: 5px 12px;
    border-radius: 14px;
    margin: 0 6px 8px 0;
    font-size: 0.8rem;
}
.friend-links a:hover {
    background: var(--green-light);
    color: var(--green-dark);
}

/* ========== 页脚 ========== */
#footer {
    background: rgba(255,255,255,0.7) !important;
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--border-light);
    text-align: center;
    padding: 28px 24px !important;
    font-size: 0.8rem;
    color: var(--text-muted);
    letter-spacing: 0.5px;
}

/* ========== 响应式 ========== */
@media (max-width: 900px) {
    #main {
        flex-direction: column;
        padding: 0 16px !important;
    }
    #sideBar {
        width: 100% !important;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 16px;
    }
    #sideBar .sidebar-card {
        flex: 1;
        min-width: 260px;
    }
}
@media (max-width: 600px) {
    #blogTitle h1 { font-size: 1.5rem !important; }
    #main { padding: 0 12px !important; }
    .day { padding: 18px 16px !important; }
    #sideBar { flex-direction: column; }
    #sideBar .sidebar-card { min-width: 100%; }
}

/* ================================================================
   以下为新增增强样式（正文排版/滚动条/音乐播放器/笔记搜索）
================================================================ */
/* ========== 正文阅读优化 ========== */
.postBody{font-size:.95rem;color:var(--text-secondary);line-height:1.9}
.postBody h1,.postBody h2,.postBody h3{color:var(--text-primary);line-height:1.5;margin:1.4em 0 .6em}
.postBody h2{font-size:1.35rem;padding-left:12px;border-left:4px solid var(--green-primary);border-radius:2px}
.postBody p{margin-bottom:14px}
.postBody img{border-radius:var(--radius-sm);box-shadow:0 2px 10px rgba(0,0,0,.05);max-width:100%}
.postBody blockquote{background:var(--green-pale);border-left:4px solid var(--green-primary);margin:1em 0;padding:12px 18px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--text-secondary)}
.postBody blockquote p{margin:4px 0}
.postBody code{background:var(--bg-soft);color:var(--green-dark);padding:2px 6px;border-radius:5px;font-size:.88em;font-family:Consolas,Monaco,monospace}
.postBody pre{background:#2d3530;color:#e6efe6;border-radius:var(--radius-md);padding:16px 18px;overflow:auto;line-height:1.6;font-size:.86rem;box-shadow:var(--shadow-soft)}
.postBody pre code{background:transparent;color:inherit;padding:0}
.postBody pre::-webkit-scrollbar{height:8px}
.postBody pre::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:4px}

/* ========== 页面滚动条 ========== */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg-main)}
::-webkit-scrollbar-thumb{background:var(--green-light);border-radius:6px;border:2px solid var(--bg-main)}
::-webkit-scrollbar-thumb:hover{background:var(--green-primary)}

/* ========== 左下角音乐播放器 ========== */
.music-fab{position:fixed;left:20px;bottom:20px;z-index:9999;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.music-fab .fab-btn{width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;background:linear-gradient(135deg,var(--green-primary),var(--green-dark));
  color:#fff;font-size:24px;box-shadow:0 6px 20px rgba(92,138,92,.45);display:flex;align-items:center;justify-content:center;
  transition:all .3s;position:relative}
.music-fab .fab-btn:hover{transform:scale(1.08);box-shadow:0 8px 26px rgba(92,138,92,.55)}
.music-fab .fab-btn.playing::after{content:'';position:absolute;inset:0;border-radius:50%;border:3px solid var(--green-light);animation:fabpulse 1.8s ease-out infinite}
@keyframes fabpulse{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.6);opacity:0}}
.eq{display:flex;gap:2px;align-items:flex-end;height:14px}
.eq i{width:3px;background:currentColor;border-radius:2px;animation:eqb 1s ease-in-out infinite}
.eq i:nth-child(1){height:40%} .eq i:nth-child(2){height:90%;animation-delay:.15s}
.eq i:nth-child(3){height:60%;animation-delay:.3s} .eq i:nth-child(4){height:100%;animation-delay:.45s}
@keyframes eqb{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(1)}}
.music-panel{width:320px;background:rgba(255,255,255,.92);backdrop-filter:blur(20px);border-radius:var(--radius-lg);
  box-shadow:0 12px 40px rgba(60,80,60,.2);border:1px solid var(--border-light);padding:20px;
  opacity:0;transform:translateY(16px) scale(.96);pointer-events:none;transition:all .3s ease;display:none}
.music-panel.open{opacity:1;transform:none;pointer-events:auto;display:block}
.music-panel .head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.music-panel .head b{font-size:.95rem;color:var(--text-primary);letter-spacing:1px}
.music-panel .head .close{cursor:pointer;color:var(--text-muted);font-size:1rem;background:none;border:none;padding:4px;border-radius:50%}
.music-panel .head .close:hover{background:var(--bg-soft);color:var(--text-primary)}
.music-cover{width:100%;height:150px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--green-light),var(--pink-accent));
  display:flex;align-items:center;justify-content:center;font-size:3rem;color:#fff;margin-bottom:14px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.music-cover.rotating{animation:spin 6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.music-info{text-align:center;margin-bottom:12px}
.music-info .title{font-size:.95rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.music-info .artist{font-size:.76rem;color:var(--text-muted);margin-top:2px}
.progress{display:flex;align-items:center;gap:10px;font-size:.72rem;color:var(--text-muted);margin-bottom:12px}
.progress-bar{flex:1;height:5px;background:var(--green-pale);border-radius:3px;cursor:pointer;position:relative}
.progress-bar .fill{height:100%;background:linear-gradient(90deg,var(--green-primary),var(--green-dark));border-radius:3px;width:0%}
.controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:14px}
.controls button{background:none;border:none;cursor:pointer;color:var(--green-dark);font-size:1.15rem;transition:all .2s;display:flex;align-items:center;justify-content:center}
.controls button:hover{color:var(--green-primary);transform:scale(1.15)}
.playlist{max-height:150px;overflow:auto;border-top:1px solid var(--border-light);padding-top:8px}
.playlist::-webkit-scrollbar{width:6px}
.playlist::-webkit-scrollbar-thumb{background:var(--green-light);border-radius:3px}
.playlist .track{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:8px;cursor:pointer;font-size:.82rem;color:var(--text-secondary);transition:all .2s}
.playlist .track:hover{background:var(--green-pale)}
.playlist .track.active{background:var(--green-pale);color:var(--green-dark);font-weight:600}
.playlist .track .t-num{color:var(--text-muted);font-size:.7rem;width:16px;text-align:right;flex-shrink:0}
.playlist .track .t-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.playlist .track .t-del{cursor:pointer;color:var(--text-muted);opacity:0;transition:opacity .2s}
.playlist .track:hover .t-del{opacity:1}
.add-tracks{display:flex;gap:8px;margin-top:12px}
.add-tracks button{flex:1;background:var(--green-pale);border:none;border-radius:10px;padding:9px 6px;font-size:.8rem;color:var(--green-dark);cursor:pointer;transition:all .2s;font-weight:500}
.add-tracks button:hover{background:var(--green-light)}
.add-tracks input[type=file]{display:none}
.vol{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--text-secondary)}
.vol input{flex:1;accent-color:var(--green-primary)}

/* ========== 笔记搜索卡片（侧边栏） ========== */
.search-card{position:relative}
.search-box{display:flex;align-items:center;background:var(--bg-soft);border:1.5px solid var(--border-light);border-radius:24px;padding:8px 14px;transition:all .3s}
.search-box:focus-within{border-color:var(--green-primary);background:#fff;box-shadow:0 0 0 3px var(--green-pale)}
.search-box svg{color:var(--green-primary);flex-shrink:0}
.search-box input{flex:1;border:none;outline:none;background:transparent;font-size:.88rem;color:var(--text-primary);padding:2px 8px;min-width:0}
.search-box input::placeholder{color:var(--text-muted)}
.search-box .go-btn{background:var(--green-primary);color:#fff;border:none;border-radius:18px;padding:5px 14px;font-size:.78rem;cursor:pointer;transition:all .2s;font-weight:600}
.search-box .go-btn:hover{background:var(--green-dark)}
.search-results{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid var(--border-light);border-radius:var(--radius-md);
  box-shadow:var(--shadow-hover);overflow:hidden;max-height:260px;overflow-y:auto;display:none;z-index:20}
.search-results.show{display:block}
.search-results .sr-item{display:block;padding:10px 14px;border-bottom:1px dashed var(--border-light);transition:background .15s}
.search-results .sr-item:last-child{border-bottom:none}
.search-results .sr-item:hover{background:var(--green-pale)}
.search-results .sr-item .t{font-size:.85rem;color:var(--text-primary);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-results .sr-item .m{font-size:.72rem;color:var(--text-muted);margin-top:2px}
.search-results .sr-empty{padding:14px;text-align:center;font-size:.82rem;color:var(--text-muted)}
.search-results .sr-loading{padding:14px;text-align:center;font-size:.82rem;color:var(--text-muted)}

/* ========== 移动端适配 ========== */
@media (max-width:600px){
  .music-panel{width:280px;left:8px}
}