/* Crisp Animated TOC 0.1.11 — clean rebuild based on the original Crisp wave geometry. */
.catoc-container {
  --catoc-bg: #fffdf8;
  --catoc-border: #e8dccd;
  --catoc-text: #211f1c;
  --catoc-muted: #7a6d5f;
  --catoc-accent: #111111;
  --catoc-tick: #c8b7a4;
  --catoc-active-bg: #fff7e8;
  --catoc-width: 100%;
  --catoc-font-size: 15px;
  --catoc-sticky-offset: 96px;
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  width: var(--catoc-width);
  max-width: 100%;
  margin: 1.5rem 0;
  padding: 12px;
  border: 1px solid var(--catoc-border);
  border-radius: 24px;
  background:
    radial-gradient(circle at 20px 18px, rgba(255,255,255,.94), transparent 32px),
    linear-gradient(145deg, rgba(255,255,255,.82), rgba(255,248,235,.96)),
    var(--catoc-bg);
  color: var(--catoc-text);
  font: inherit;
  font-size: var(--catoc-font-size, 15px);
  line-height: 1.45;
  box-shadow: 0 18px 48px rgba(61,43,22,.11), inset 0 1px 0 rgba(255,255,255,.74);
}

.catoc-container,
.catoc-container * { box-sizing: border-box; }

.catoc-container a,
.catoc-container button { -webkit-tap-highlight-color: transparent; }

.catoc-container a {
  color: inherit;
  text-decoration: none;
}

.catoc-container:focus,
.catoc-container :focus { outline: none; }

.catoc-align-center { margin-left: auto; margin-right: auto; }
.catoc-align-left { float: left; max-width: min(100%, 430px); margin-right: 1.5rem; }
.catoc-align-right { float: right; max-width: min(100%, 430px); margin-left: 1.5rem; }
.catoc-align-wide { width: 100%; }

.catoc-is-sticky {
  position: sticky;
  top: var(--catoc-sticky-offset);
  z-index: 20;
}

.catoc-theme-current { background: transparent; box-shadow: none; }
.catoc-theme-glassy { background: rgba(255,255,255,.66); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.catoc-theme-wood { background: repeating-linear-gradient(90deg, rgba(116,74,36,.08) 0 3px, transparent 3px 12px), var(--catoc-bg); }
.catoc-theme-tape::before,
.catoc-theme-tape::after {
  content: "";
  position: absolute;
  top: -10px;
  width: 72px;
  height: 22px;
  border-radius: 3px;
  border: 1px solid rgba(172,130,63,.22);
  background: rgba(244,217,151,.62);
  z-index: 2;
}
.catoc-theme-tape::before { left: 28px; transform: rotate(-6deg); }
.catoc-theme-tape::after { right: 28px; transform: rotate(5deg); }

.catoc-theme-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
  padding: 4px;
  border: 1px solid rgba(120,105,85,.16);
  border-radius: 999px;
  background: rgba(255,255,255,.54);
}

.catoc-theme-pill,
.catoc-toggle,
.catoc-nav-button,
.catoc-view-more,
.catoc-subtoggle {
  appearance: none;
  font: inherit;
}

.catoc-theme-pill {
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--catoc-muted);
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
  padding: 7px 10px;
}
.catoc-theme-pill.is-active { background: var(--catoc-accent); color: #fff; }

.catoc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px 12px;
}

.catoc-title {
  font-weight: 760;
  letter-spacing: -.02em;
}

.catoc-toggle {
  border: 1px solid rgba(120,105,85,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--catoc-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  padding: 6px 10px;
}
.catoc-toggle:hover,
.catoc-toggle:focus-visible { color: var(--catoc-accent); box-shadow: 0 0 0 3px rgba(0,0,0,.035); }
.catoc-toggle-icon {
  width: 8px;
  height: 8px;
  border-right: 1.7px solid currentColor;
  border-bottom: 1.7px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  transition: transform .2s ease;
}
.catoc-container.is-collapsed .catoc-toggle-icon { transform: rotate(-45deg) translateY(1px); }
.catoc-container.is-collapsed .catoc-body,
.catoc-container.is-collapsed .catoc-footer,
.catoc-container.is-collapsed .catoc-view-more { display: none; }

.catoc-body {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 8px;
  position: relative;
  min-height: 60px;
  padding: 2px 4px 4px 0;
  overflow: visible;
}

.catoc-rail {
  position: relative;
  width: 64px;
  min-height: 100%;
  touch-action: none;
  overflow: visible;
}

.catoc-ball {
  position: absolute;
  top: 0;
  left: 18px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: var(--catoc-accent);
  box-shadow: 0 8px 24px rgba(0,0,0,.24), 0 0 0 7px rgba(0,0,0,.045);
  cursor: grab;
  z-index: 4;
  transform: translate3d(0, 0, 0) translateY(-50%);
  will-change: transform;
}
.catoc-ball.is-dragging { cursor: grabbing; box-shadow: 0 12px 32px rgba(0,0,0,.28), 0 0 0 9px rgba(0,0,0,.06); }
.catoc-origin-dot { position: absolute; inset: 5px; border-radius: 999px; background: rgba(255,255,255,.82); }

.catoc-scale { position: absolute; inset: 0; pointer-events: none; overflow: visible; }
.catoc-tick {
  position: absolute;
  left: 16px;
  width: 22px;
  height: 2px;
  border-radius: 999px;
  background: var(--catoc-tick);
  opacity: calc(.52 + (var(--catoc-heat, 0) * .38));
  transform: translateY(-50%);
  transform-origin: left center;
  will-change: transform, width, opacity;
}
.catoc-tick.is-long { height: 2.5px; width: 34px; }
.catoc-tick.catoc-line { height: 3px; background: var(--catoc-accent); opacity: .9; }

.catoc-list,
.catoc-sublist {
  list-style: none;
  margin: 0;
  padding: 0;
}
.catoc-list { position: relative; min-width: 0; padding-inline-end: 58px; overflow: visible; }
.catoc-sublist { margin-left: 0; }
.catoc-item { position: relative; margin: 0; padding: 0; overflow: visible; }

.catoc-link {
  display: flex;
  align-items: baseline;
  gap: 9px;
  min-height: 34px;
  width: 100%;
  max-width: 100%;
  border: 0;
  border-radius: 14px;
  padding: 7px 10px;
  background: transparent;
  color: rgba(33,31,28,.74);
  font-weight: 540;
  line-height: 1.25;
  transform: translate3d(var(--catoc-link-offset, 0px), 0, 0);
  transition: background .18s ease, color .18s ease, opacity .18s ease;
  will-change: transform;
}
.catoc-is-flat .catoc-link { padding-left: calc(10px + (var(--catoc-depth, 0) * 12px)); }
.catoc-sublist .catoc-link { font-size: .94em; opacity: .91; }
.catoc-counter { flex: 0 0 auto; min-width: 2.2ch; color: var(--catoc-muted); font-variant-numeric: tabular-nums; font-size: .82em; }
.catoc-link-text { min-width: 0; overflow-wrap: anywhere; }
.catoc-link:hover,
.catoc-link:focus-visible { background: rgba(255,255,255,.58); color: var(--catoc-text); }
.catoc-link.is-active,
.catoc-item.is-active > .catoc-link { background: var(--catoc-active-bg); color: var(--catoc-accent); font-weight: 720; }
.catoc-link.is-active .catoc-counter,
.catoc-item.is-active > .catoc-link .catoc-counter { color: var(--catoc-accent); }

.catoc-overflow-item { display: list-item; }
.catoc-container:not(.catoc-view-all) .catoc-overflow-item { display: none; }

.catoc-subtoggle {
  position: absolute;
  left: -2px;
  top: 7px;
  width: 20px;
  height: 20px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--catoc-muted);
  cursor: pointer;
  z-index: 2;
}
.catoc-subtoggle::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 5px;
  width: 7px;
  height: 7px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg);
}
.catoc-has-children.is-subcollapsed > .catoc-subtoggle::before { transform: rotate(-45deg); }
.catoc-has-children.is-subcollapsed > .catoc-sublist { display: none; }

.catoc-footer {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
  padding: 8px 10px 2px;
  color: var(--catoc-muted);
}
.catoc-nav-button {
  border: 1px solid rgba(120,105,85,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--catoc-text);
  cursor: pointer;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.catoc-nav-button:disabled { cursor: not-allowed; opacity: .38; }
.catoc-hint { margin-left: 4px; color: var(--catoc-muted); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.catoc-view-more {
  width: calc(100% - 16px);
  margin: 10px 8px 2px;
  border: 1px solid rgba(120,105,85,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.7);
  color: var(--catoc-text);
  cursor: pointer;
  font-size: 13px;
  padding: 9px 12px;
}
.catoc-sitemap { display: grid; gap: 1.5rem; }
.catoc-sitemap ul { margin-left: 1.2rem; }

/* Floating drawer --------------------------------------------------------- */
.catoc-sticky-drawer-source { position: relative; }
.catoc-has-floating-drawer { /* inline TOC stays in normal article flow */ }

.catoc-floating-toc,
.catoc-floating-toc * { box-sizing: border-box; }
.catoc-floating-toc {
  --catoc-nav-progress: 0;
  --catoc-nav-progress-pct: 0%;
  --catoc-drawer-top: max(var(--catoc-sticky-offset, 96px), 76px);
  --catoc-drawer-bottom: max(18px, env(safe-area-inset-bottom));
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 2147483000;
  pointer-events: none;
  color: var(--catoc-text);
  font: inherit;
}

.catoc-floating-trigger {
  appearance: none;
  pointer-events: auto;
  position: fixed;
  top: clamp(calc(var(--catoc-sticky-offset, 96px) + 72px), 50vh, calc(100vh - 104px));
  left: 0;
  width: 46px;
  min-width: 46px;
  height: 156px;
  min-height: 156px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
  padding: 12px 7px;
  border: 1px solid rgba(126,113,96,.18);
  border-left: 0;
  border-radius: 0 22px 22px 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,251,244,.96)),
    var(--catoc-bg);
  color: var(--catoc-accent);
  box-shadow: 0 18px 46px rgba(20,16,10,.16), inset 1px 0 0 rgba(255,255,255,.92);
  cursor: pointer;
  transform: translate3d(0, -50%, 0);
  transition: transform .2s ease, opacity .18s ease, box-shadow .2s ease, border-color .2s ease;
  overflow: hidden;
}
.catoc-floating-side-right .catoc-floating-trigger {
  right: 0;
  left: auto;
  border-right: 0;
  border-left: 1px solid rgba(126,113,96,.18);
  border-radius: 22px 0 0 22px;
}
.catoc-floating-trigger:hover,
.catoc-floating-trigger:focus-visible {
  border-color: rgba(126,113,96,.28);
  box-shadow: 0 22px 56px rgba(20,16,10,.20), inset 1px 0 0 rgba(255,255,255,.94);
  outline: none;
  transform: translate3d(3px, -50%, 0);
}
.catoc-floating-side-right .catoc-floating-trigger:hover,
.catoc-floating-side-right .catoc-floating-trigger:focus-visible { transform: translate3d(-3px, -50%, 0); }
.catoc-floating-toc.is-open .catoc-floating-trigger {
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-8px, -50%, 0);
}
.catoc-floating-side-right.is-open .catoc-floating-trigger { transform: translate3d(8px, -50%, 0); }
.catoc-floating-trigger-progress {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 3px;
  border-radius: 0 999px 999px 0;
  background: rgba(126,113,96,.14);
  overflow: hidden;
}
.catoc-floating-side-right .catoc-floating-trigger-progress { right: 0; left: auto; border-radius: 999px 0 0 999px; }
.catoc-floating-trigger-progress > span {
  position: absolute;
  inset: 0 0 auto 0;
  height: max(18px, var(--catoc-nav-progress-pct, 0%));
  border-radius: inherit;
  background: linear-gradient(180deg, #5e47df, #2e806d);
  transition: height .22s ease;
}
.catoc-floating-trigger-text {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  color: rgba(33,31,28,.76);
  font-size: 12px;
  font-weight: 820;
  letter-spacing: .14em;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
}
.catoc-floating-trigger-mark {
  display: grid;
  gap: 4px;
  place-items: center;
  opacity: .88;
}
.catoc-floating-trigger-mark span {
  display: block;
  width: 17px;
  height: 1.5px;
  border-radius: 999px;
  background: currentColor;
}
.catoc-floating-trigger-mark span:nth-child(2) { width: 11px; }
.catoc-floating-trigger-mark span:nth-child(3) { width: 14px; }

.catoc-floating-panel {
  pointer-events: auto;
  position: fixed;
  top: var(--catoc-drawer-top);
  bottom: var(--catoc-drawer-bottom);
  left: 18px;
  width: clamp(326px, 31vw, 430px);
  max-width: calc(100vw - 28px);
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(126,113,96,.18);
  border-radius: 28px;
  background:
    radial-gradient(circle at 34px 22px, rgba(255,255,255,.93), transparent 60px),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,252,245,.975));
  box-shadow: 0 32px 82px rgba(24,20,15,.18), inset 0 1px 0 rgba(255,255,255,.84);
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  transform: translate3d(calc(-100% - 30px), 0, 0);
  transition: transform .30s cubic-bezier(.22,1,.36,1), opacity .22s ease, visibility .22s ease;
}
.catoc-floating-side-right .catoc-floating-panel {
  right: 18px;
  left: auto;
  transform: translate3d(calc(100% + 30px), 0, 0);
}
.catoc-floating-toc.is-open .catoc-floating-panel {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0);
}
body.admin-bar .catoc-floating-panel { top: max(52px, calc(var(--catoc-sticky-offset, 96px) + 8px)); }
@media (min-width: 783px) { body.admin-bar .catoc-floating-panel { top: max(46px, calc(var(--catoc-sticky-offset, 96px) + 8px)); } }

.catoc-floating-header {
  flex: 0 0 auto;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px 10px 20px;
  border-bottom: 1px solid rgba(126,113,96,.08);
}
.catoc-floating-title {
  color: rgba(33,31,28,.62);
  font-size: 11px;
  font-weight: 820;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.catoc-floating-close {
  appearance: none;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(126,113,96,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 8px 24px rgba(24,20,15,.06);
  color: rgba(33,31,28,.68);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: inherit;
  font-size: 22px;
  line-height: 1;
}
.catoc-floating-close:hover,
.catoc-floating-close:focus-visible { background: rgba(255,255,255,.96); color: var(--catoc-accent); outline: none; }

.catoc-floating-nav.catoc-container {
  width: 100%;
  max-width: none;
  flex: 1 1 auto;
  min-height: 0;
  margin: 0;
  padding: 10px 18px 18px 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.catoc-floating-nav .catoc-header,
.catoc-floating-nav .catoc-footer,
.catoc-floating-nav .catoc-view-more,
.catoc-floating-nav .catoc-counter,
.catoc-no-internal-toggle .catoc-toggle { display: none !important; }
.catoc-no-internal-toggle.is-collapsed .catoc-body { display: grid !important; }
.catoc-no-internal-toggle.is-collapsed .catoc-footer { display: none !important; }

/* Exact wave drawer: mirrors the React component's rail + label behavior. */
.catoc-floating-exact .catoc-body {
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 0;
  min-height: 120px;
  padding: 8px 0 0;
  overflow: visible;
}
.catoc-floating-exact .catoc-rail,
.catoc-floating-exact .catoc-scale { width: 64px; overflow: visible; opacity: .96; }
.catoc-floating-exact .catoc-ball {
  left: 18px;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255,255,255,.92);
  box-shadow: 0 0 0 8px rgba(20,16,10,.045), 0 12px 30px rgba(20,16,10,.22);
}
.catoc-floating-exact .catoc-origin-dot { inset: 5px; background: rgba(255,255,255,.92); }
.catoc-floating-exact .catoc-tick {
  left: 16px;
  height: 2px;
  background: var(--catoc-tick);
  opacity: calc(.42 + (var(--catoc-heat, 0) * .44));
}
.catoc-floating-exact .catoc-tick.is-long { height: 2.5px; }
.catoc-floating-exact .catoc-tick.catoc-line { height: 3px; background: var(--catoc-accent); opacity: .9; }
.catoc-floating-exact .catoc-list,
.catoc-floating-exact .catoc-sublist {
  overflow: visible;
  padding-inline-end: 56px;
}
.catoc-floating-exact .catoc-item { overflow: visible; }
.catoc-floating-exact .catoc-link,
.catoc-floating-exact .catoc-link:link,
.catoc-floating-exact .catoc-link:visited,
.catoc-floating-exact .catoc-link:hover,
.catoc-floating-exact .catoc-link:focus,
.catoc-floating-exact .catoc-link:focus-visible,
.catoc-floating-exact .catoc-link:active,
.catoc-floating-exact .catoc-link.is-active,
.catoc-floating-exact .catoc-item.is-active > .catoc-link,
.catoc-floating-exact .catoc-link[aria-current="location"] {
  width: auto;
  max-width: calc(100% - var(--catoc-link-offset, 0px));
  min-height: 31px;
  margin: 0;
  padding: 5px 6px 5px 0;
  border: 0 !important;
  border-radius: 0;
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  background: transparent !important;
  filter: none !important;
  color: rgba(33,31,28,.72);
  font-size: 13.6px;
  font-weight: 640;
  letter-spacing: -.01em;
  line-height: 1.34;
  opacity: .88;
  text-decoration: none !important;
  transform: translate3d(var(--catoc-link-offset, 0px), 0, 0);
  transition: color .16s ease, opacity .16s ease;
  will-change: transform;
}
.catoc-floating-exact .catoc-level-1 > .catoc-link,
.catoc-floating-exact .catoc-level-2 > .catoc-link,
.catoc-floating-exact .catoc-level-3 > .catoc-link,
.catoc-floating-exact .catoc-level-4 > .catoc-link,
.catoc-floating-exact .catoc-level-5 > .catoc-link,
.catoc-floating-exact .catoc-level-6 > .catoc-link { padding-left: 0; padding-inline-start: 0; }
.catoc-floating-exact .catoc-level-3 > .catoc-link,
.catoc-floating-exact .catoc-level-4 > .catoc-link,
.catoc-floating-exact .catoc-level-5 > .catoc-link,
.catoc-floating-exact .catoc-level-6 > .catoc-link,
.catoc-floating-exact .catoc-sublist .catoc-link { font-size: 12.85px; opacity: .76; }
.catoc-floating-exact .catoc-link:hover,
.catoc-floating-exact .catoc-link:focus-visible { color: var(--catoc-accent); opacity: .98; }
.catoc-floating-exact .catoc-link.is-active,
.catoc-floating-exact .catoc-item.is-active > .catoc-link,
.catoc-floating-exact .catoc-link[aria-current="location"] { color: var(--catoc-accent); font-weight: 700; opacity: 1; }
.catoc-floating-exact .catoc-link::before,
.catoc-floating-exact .catoc-link::after,
.catoc-floating-exact .catoc-item.is-active > .catoc-link::before,
.catoc-floating-exact .catoc-item.is-active > .catoc-link::after { content: none !important; display: none !important; }
.catoc-floating-exact .catoc-link-text {
  min-width: 0;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  word-break: normal;
  overflow-wrap: anywhere;
}

body.catoc-floating-drawer-open { overflow-x: clip; }

.catoc-hide-on-mobile { }

@media (max-width: 1024px) {
  .catoc-floating-panel { width: min(394px, calc(100vw - 28px)); }
}

@media (max-width: 900px) {
  .catoc-floating-panel,
  .catoc-floating-side-right .catoc-floating-panel,
  body.admin-bar .catoc-floating-panel {
    top: auto;
    right: max(14px, env(safe-area-inset-right));
    bottom: max(16px, env(safe-area-inset-bottom));
    left: max(14px, env(safe-area-inset-left));
    width: auto;
    max-width: none;
    max-height: min(78vh, 720px);
    border-radius: 24px;
    transform: translate3d(0, calc(100% + 32px), 0);
  }
  .catoc-floating-toc.is-open .catoc-floating-panel,
  .catoc-floating-side-right.is-open .catoc-floating-panel { transform: translate3d(0, 0, 0); }
  .catoc-floating-trigger,
  .catoc-floating-side-right .catoc-floating-trigger,
  body.admin-bar .catoc-floating-trigger,
  body.admin-bar .catoc-floating-side-right .catoc-floating-trigger {
    top: auto;
    right: auto;
    bottom: max(16px, env(safe-area-inset-bottom));
    left: max(16px, env(safe-area-inset-left));
    width: auto;
    min-width: 112px;
    height: 48px;
    min-height: 48px;
    padding: 0 18px 0 20px;
    flex-direction: row;
    border: 1px solid rgba(126,113,96,.18);
    border-radius: 999px;
    transform: translate3d(0, 0, 0);
  }
  .catoc-floating-side-right .catoc-floating-trigger,
  body.admin-bar .catoc-floating-side-right .catoc-floating-trigger { right: max(16px, env(safe-area-inset-right)); left: auto; }
  .catoc-floating-trigger:hover,
  .catoc-floating-trigger:focus-visible,
  .catoc-floating-side-right .catoc-floating-trigger:hover,
  .catoc-floating-side-right .catoc-floating-trigger:focus-visible,
  .catoc-floating-toc.is-open .catoc-floating-trigger,
  .catoc-floating-side-right.is-open .catoc-floating-trigger { transform: translate3d(0, 0, 0); }
  .catoc-floating-trigger-progress {
    top: auto;
    right: 14px;
    bottom: 8px;
    left: 14px;
    width: auto;
    height: 3px;
    border-radius: 999px;
  }
  .catoc-floating-trigger-progress > span { inset: 0 auto 0 0; width: max(18px, var(--catoc-nav-progress-pct, 0%)); height: auto; transition: width .22s ease; }
  .catoc-floating-trigger-text { writing-mode: horizontal-tb; text-orientation: mixed; letter-spacing: .04em; }
  .catoc-floating-trigger-mark { display: none; }
  .catoc-floating-exact .catoc-body { grid-template-columns: 50px minmax(0, 1fr); gap: 0; }
  .catoc-floating-exact .catoc-rail,
  .catoc-floating-exact .catoc-scale { width: 50px; }
  .catoc-floating-exact .catoc-ball { left: 12px; width: 15px; height: 15px; }
  .catoc-floating-exact .catoc-tick { left: 10px; }
  .catoc-floating-exact .catoc-list,
  .catoc-floating-exact .catoc-sublist { padding-inline-end: 38px; }
}

@media (max-width: 782px) {
  .catoc-container { border-radius: 18px; padding: 10px; }
  .catoc-body { grid-template-columns: 50px minmax(0, 1fr); }
  .catoc-rail { width: 50px; }
  .catoc-ball { left: 12px; }
  .catoc-tick { left: 10px; }
  .catoc-hint { display: none; }
  .catoc-hide-on-mobile { display: none !important; }
}

@media (max-width: 420px) {
  .catoc-floating-panel,
  .catoc-floating-side-right .catoc-floating-panel,
  body.admin-bar .catoc-floating-panel {
    right: max(8px, env(safe-area-inset-right));
    bottom: max(8px, env(safe-area-inset-bottom));
    left: max(8px, env(safe-area-inset-left));
    border-radius: 20px;
    max-height: min(84vh, 620px);
  }
  .catoc-floating-header { min-height: 54px; padding: 14px 14px 8px 16px; }
  .catoc-floating-nav.catoc-container { padding: 8px 14px 16px 10px; }
  .catoc-floating-exact .catoc-body { grid-template-columns: 42px minmax(0, 1fr); }
  .catoc-floating-exact .catoc-rail,
  .catoc-floating-exact .catoc-scale { width: 42px; }
  .catoc-floating-exact .catoc-ball { left: 9px; width: 14px; height: 14px; }
  .catoc-floating-exact .catoc-tick { left: 7px; }
  .catoc-floating-exact .catoc-list,
  .catoc-floating-exact .catoc-sublist { padding-inline-end: 26px; }
  .catoc-floating-exact .catoc-link,
  .catoc-floating-exact .catoc-link.is-active,
  .catoc-floating-exact .catoc-item.is-active > .catoc-link { min-height: 30px; font-size: 13px; }
  .catoc-floating-exact .catoc-level-3 > .catoc-link,
  .catoc-floating-exact .catoc-level-4 > .catoc-link,
  .catoc-floating-exact .catoc-level-5 > .catoc-link,
  .catoc-floating-exact .catoc-level-6 > .catoc-link,
  .catoc-floating-exact .catoc-sublist .catoc-link { font-size: 12.4px; }
}

@media (prefers-reduced-motion: reduce) {
  .catoc-link,
  .catoc-toggle-icon,
  .catoc-floating-trigger,
  .catoc-floating-panel { transition: none !important; }
}

@media print {
  .catoc-floating-toc { display: none !important; }
}