.changelog-section { padding: 0 0 40px; }
  .changelog-hero { text-align: center; padding: 80px 20px 50px; background: rgba(13, 17, 23, 0.92); backdrop-filter: blur(12px); border-bottom: 2px solid transparent; border-image: linear-gradient(90deg, transparent, #58a6ff, #8b5cf6, #58a6ff, transparent) 1; margin-bottom: 40px; }
  .changelog-hero h1 { font-size: 2.5em; font-weight: 800; margin: 0 0 15px; background: linear-gradient(135deg, #58a6ff 0%, #8b5cf6 50%, #ec4899 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
  .changelog-hero p { color: #b1bac4; font-size: 1.15em; max-width: 700px; margin: 0 auto; line-height: 1.7; }
  .changelog-wrapper { max-width: 1100px; margin: 0 auto; display: flex; gap: 24px; align-items: flex-start; }
  .changelog-sidebar { width: 220px; flex-shrink: 0; position: sticky; top: 80px; background: rgba(13, 17, 23, 0.95); border-radius: 4px; padding: 16px; backdrop-filter: blur(8px); box-shadow: 0 4px 20px rgba(0,0,0,0.4); border: 1px solid rgba(88,166,255,0.1); max-height: calc(100vh - 100px); overflow-y: auto; }
  .changelog-sidebar h3 { color: #e6edf3; font-size: 0.8em; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid rgba(88,166,255,0.15); }
  .changelog-sidebar a { display: flex; flex-direction: column; padding: 8px 10px; color: #8b949e; text-decoration: none; font-size: 0.82em; border-radius: 3px; transition: all 0.2s; border-left: 2px solid transparent; margin-bottom: 2px; }
  .changelog-sidebar a:hover { color: #e6edf3; background: rgba(88,166,255,0.08); border-left-color: rgba(88,166,255,0.4); }
  .changelog-sidebar a.active { color: #58a6ff; background: rgba(88,166,255,0.12); border-left-color: #58a6ff; }
  .changelog-sidebar .nav-date { font-weight: 600; font-size: 0.85em; }
  .changelog-sidebar .nav-title { font-size: 0.78em; color: #6e7681; margin-top: 1px; }
  .changelog-sidebar a.active .nav-title { color: #8b949e; }
  .changelog-sidebar::-webkit-scrollbar { width: 4px; }
  .changelog-sidebar::-webkit-scrollbar-track { background: transparent; }
  .changelog-sidebar::-webkit-scrollbar-thumb { background: rgba(88,166,255,0.2); border-radius: 2px; }
  .changelog-content { flex: 1; min-width: 0; background: rgba(13, 17, 23, 0.9); border-radius: 4px; padding: 30px 30px 10px; backdrop-filter: blur(8px); box-shadow: 0 4px 20px rgba(0,0,0,0.4); }
  .changelog-timeline { position: relative; padding-left: 30px; }
  .changelog-timeline::before { content: ''; position: absolute; left: 8px; top: 0; bottom: 0; width: 2px; background: linear-gradient(180deg, #58a6ff, #8b5cf6, rgba(88,166,255,0.1)); }
  .changelog-entry { position: relative; margin-bottom: 30px; }
  .changelog-entry::before { content: ''; position: absolute; left: -26px; top: 8px; width: 12px; height: 12px; background: #58a6ff; border-radius: 50%; border: 2px solid #161b22; box-shadow: 0 0 10px rgba(88,166,255,0.4); }
  .changelog-date { color: #58a6ff; font-size: 0.85em; font-weight: 600; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
  .changelog-card { background: rgba(22, 27, 34, 0.95); border: 1px solid rgba(88,166,255,0.15); border-radius: 4px; overflow: hidden; transition: border-color 0.3s; }
  .changelog-card:hover { border-color: rgba(88,166,255,0.4); }
  .changelog-card-body { padding: 22px; }
  .changelog-card-body > h3 { color: #e6edf3; font-size: 1.15em; font-weight: 700; margin: 0 0 15px; padding-bottom: 12px; border-bottom: 1px solid rgba(88,166,255,0.1); }
  .cl-cat { margin-bottom: 18px; }
  .cl-cat:last-child { margin-bottom: 0; }
  .cl-cat h4 { color: #58a6ff; font-size: 0.92em; font-weight: 700; margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
  .cl-cat h4 i { width: 18px; text-align: center; font-size: 0.9em; }
  .cl-cat ul { list-style: none; padding: 0; margin: 0; }
  .cl-cat ul li { color: #b1bac4; font-size: 0.88em; line-height: 1.7; padding: 3px 0 3px 20px; position: relative; }
  .cl-cat ul li::before { content: '\203A'; position: absolute; left: 5px; color: #58a6ff; font-weight: 700; font-size: 1.1em; }
  .cl-cat ul li strong { color: #e6edf3; }
  .changelog-mobile-nav { display: none; margin: 0 auto 20px; max-width: 900px; }
  .changelog-mobile-nav select { width: 100%; padding: 12px 16px; background: rgba(13, 17, 23, 0.95); border: 1px solid rgba(88,166,255,0.2); border-radius: 4px; color: #e6edf3; font-size: 0.9em; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%2358a6ff' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; cursor: pointer; }
  .changelog-mobile-nav select:focus { outline: none; border-color: #58a6ff; }
  @media (max-width: 900px) {
    .changelog-sidebar { display: none; }
    .changelog-wrapper { max-width: 900px; }
    .changelog-mobile-nav { display: block; padding: 0 15px; }
  }
  @media (max-width: 768px) {
    .changelog-hero { padding: 50px 15px 30px; }
    .changelog-hero h1 { font-size: 1.6em; }
    .changelog-hero p { font-size: 1em; }
    .changelog-content { padding: 20px 15px 5px; }
    .changelog-card-body { padding: 16px; }
    .changelog-card-body > h3 { font-size: 1.05em; }
    .cl-cat h4 { font-size: 0.88em; }
    .cl-cat ul li { font-size: 0.84em; padding-left: 16px; }
    .changelog-timeline { padding-left: 24px; }
    .changelog-entry::before { left: -20px; width: 10px; height: 10px; }
  }
  @media (max-width: 480px) {
    .changelog-hero h1 { font-size: 1.3em; }
    .changelog-content { padding: 16px 12px 5px; }
    .changelog-card-body { padding: 14px; }
    .changelog-card-body > h3 { font-size: 0.98em; margin-bottom: 12px; padding-bottom: 10px; }
    .cl-cat h4 { font-size: 0.84em; gap: 6px; }
    .cl-cat ul li { font-size: 0.82em; line-height: 1.6; padding-left: 14px; }
    .cl-cat ul li::before { left: 2px; }
    .changelog-timeline { padding-left: 20px; }
    .changelog-entry::before { left: -17px; width: 8px; height: 8px; }
    .changelog-date { font-size: 0.8em; }
    .changelog-mobile-nav select { font-size: 0.85em; padding: 10px 14px; }
  }