
.haixue-course-bar {
  --bar-paper: #faf9f5; --bar-paper-2: #f2f0e9; --bar-ink: #23211e;
  --bar-ink-2: #57534c; --bar-ink-3: #6f695f; --bar-line: #ddd8ca; --bar-accent: #c8553d;
  position: sticky; top: 0; z-index: 100; display: flex; align-items: center;
  gap: 20px; height: 60px; padding: 0 22px; border-bottom: 1px solid var(--bar-line);
  background: color-mix(in srgb, var(--bar-paper) 88%, transparent);
  backdrop-filter: saturate(1.4) blur(12px); color: var(--bar-ink);
  font: 15px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
[data-theme="dark"] .haixue-course-bar {
  --bar-paper: #1b1a18; --bar-paper-2: #232120; --bar-ink: #ece8e0;
  --bar-ink-2: #b3ada2; --bar-ink-3: #a39b8f; --bar-line: #3a3733; --bar-accent: #e08b73;
}
.haixue-course-bar * { box-sizing: border-box; }
.haixue-course-bar a { color: var(--bar-ink-2); text-decoration: none; }
.haixue-course-bar .haixue-brand { display: flex; align-items: center; gap: 10px; }
.haixue-course-bar .haixue-brand-mark { color: var(--bar-accent); font-size: 20px; line-height: 1; }
.haixue-course-bar .haixue-brand-text { display: flex; flex-direction: column; line-height: 1.25; }
.haixue-course-bar .haixue-brand-text b { font: bold 15px "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Songti SC", serif; letter-spacing: .01em; white-space: nowrap; }
.haixue-course-bar .haixue-brand-text em { font-style: normal; font-size: 11px; color: var(--bar-ink-3); letter-spacing: .06em; }
.haixue-course-bar .haixue-account { padding: 7px 13px; border: 1px solid var(--bar-line); border-radius: 7px; font-size: 14px; white-space: nowrap; }
.haixue-course-bar .haixue-theme { flex: 0 0 auto; width: 34px; height: 34px; border: 1px solid var(--bar-line); border-radius: 8px; background: transparent; color: var(--bar-ink-2); font: inherit; cursor: pointer; }
.haixue-course-bar a:hover, .haixue-course-bar button:hover { background: var(--bar-paper-2); color: var(--bar-ink); }
.haixue-course-bar :focus-visible { outline: 2px solid var(--bar-accent); outline-offset: 3px; }
@media (max-width: 560px) {
  .haixue-course-bar { gap: 10px; padding: 9px 14px; height: auto; min-height: 60px; flex-wrap: wrap; }
  .haixue-course-bar .haixue-brand { gap: 6px; }
  .haixue-course-bar .haixue-brand-text em { display: none; }
  .haixue-course-bar .haixue-account { padding: 6px 8px; font-size: 13px; }
}
.haixue-course-bar .haixue-actions { margin-left:auto; display:flex; align-items:center; gap:12px; }
.haixue-course-bar .haixue-login { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:7px 12px; border-radius:7px; font-size:14px; white-space:nowrap; }
.haixue-course-bar .haixue-account { display:inline-flex; align-items:center; min-height:40px; }
.haixue-course-bar .haixue-login.signed::before { content:'●'; color:var(--bar-accent); font-size:8px; margin-right:7px; }
.haixue-course-bar .haixue-theme-wrap { position:relative; flex-shrink:0; }
.haixue-course-bar .haixue-theme { display:grid; place-items:center; width:40px; height:40px; padding:0; }
.haixue-course-bar .haixue-theme-menu { position:absolute; top:calc(100% + 8px); right:0; width:144px; padding:6px; border:1px solid var(--bar-line); border-radius:10px; background:var(--bar-paper); box-shadow:0 8px 24px #0002; }
.haixue-course-bar [hidden] { display:none !important; }
.haixue-course-bar .haixue-theme-menu button { display:block; width:100%; min-height:40px; border:0; padding:8px 12px; text-align:left; background:transparent; color:var(--bar-ink-2); border-radius:6px; font:inherit; font-size:13px; cursor:pointer; }
.haixue-course-bar .haixue-theme-menu button[aria-pressed="true"] { background:var(--bar-paper-2); color:var(--bar-ink); }
@media(max-width:560px) {
  .haixue-course-bar { gap:8px; }
  .haixue-course-bar .haixue-actions { gap:6px; }
  .haixue-course-bar .haixue-login { padding:6px 8px; font-size:13px; }
  .haixue-course-bar .haixue-brand-mark { font-size:17px; }
  .haixue-course-bar .haixue-brand-text b { display:flex; align-items:center; gap:4px; font-size:18px; }
}

.animations-course-nav {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
  gap:12px; padding:16px 24px; border-bottom:1px solid #ddd8ca;
  font:14px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif;
}
.animations-course-nav div { display:flex; flex-wrap:wrap; gap:18px; }
.animations-course-nav a { color:inherit; text-decoration:none; padding:6px 0; }
.animations-course-nav a:hover { text-decoration:underline; text-underline-offset:4px; }
.animations-course-nav .animations-course-name { font-weight:600; }
.animations-course-name span { font-weight:400; margin-left:8px; font-size:12px; }
body:has(.animations-course-nav) .zh-toggle {
  bottom:calc(var(--animations-footer-clearance, 0px) + 16px + env(safe-area-inset-bottom, 0px));
}
.animations-course-notice {
  padding:12px 24px; background:#f2f0e9; color:#57534c;
  font:13px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif;
}
[data-theme="dark"] .animations-course-nav { border-color:#3a3733; }
[data-theme="dark"] .animations-course-notice { background:#232120; color:#b3ada2; }
.animations-static-note {
  display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px;
  margin:20px 0 8px; color:#57534c;
  font:12px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif;
}
.animations-static-note strong {
  flex-shrink:0; padding:2px 8px; border:1px solid #ddd8ca;
  border-radius:5px; background:#f2f0e9; font-weight:500;
}
.animations-static-note + .mobile-full-width { margin-top:8px !important; }
[data-theme="dark"] .animations-static-note { color:#b3ada2; }
[data-theme="dark"] .animations-static-note strong { border-color:#3a3733; background:#232120; }
@media(max-width:560px) {
  .animations-course-nav { padding:12px 16px; gap:6px; }
  .animations-course-nav div { gap:16px; }
  .animations-course-notice { padding:10px 16px; }
}
