/*
 * Shared desktop sidebar visual layer.
 * This stylesheet intentionally changes presentation only: the existing DOM,
 * routes, active-state classes, collapse behavior and task actions stay intact.
 */

@media all {
  html:not([data-mobile-workbench="true"]) .sidebar {
    --sidebar-v2-surface: #f1f4f9;
    --sidebar-v2-panel: rgba(255, 255, 255, 0.82);
    --sidebar-v2-panel-strong: rgba(255, 255, 255, 0.94);
    --sidebar-v2-line: rgba(127, 144, 166, 0.18);
    --sidebar-v2-text: #252b3a;
    --sidebar-v2-muted: #697386;
    --sidebar-v2-soft: #8993a5;
    --sidebar-v2-accent: #6557dc;
    --sidebar-v2-accent-strong: #5145c7;
    --sidebar-v2-accent-soft: #eeefff;
    --sidebar-v2-hover: rgba(255, 255, 255, 0.78);
    border-right: 1px solid rgba(111, 122, 145, 0.1) !important;
    background: var(--sidebar-v2-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav {
    gap: 4px !important;
  }

  /* Compact desktop display rules must not reveal unavailable feature links. */
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav a[hidden] {
    display: none !important;
  }

  html:not([data-mobile-workbench="true"])
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace) {
    gap: 3px !important;
    padding: 0 4px 4px !important;
    border: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-primary[data-nav-target] {
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    gap: 9px !important;
    padding: 0 8px !important;
    border: 0 !important;
    border-radius: 8px !important;
    color: var(--sidebar-v2-text) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-family: var(--aotu-font-sans, "Inter", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, -apple-system, sans-serif) !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-primary[data-nav-target]::after {
    display: block !important;
    flex: 1 1 auto !important;
    height: 1px !important;
    margin-left: 4px !important;
    background: linear-gradient(90deg, rgba(151, 160, 177, 0.28), rgba(151, 160, 177, 0)) !important;
    transform: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-primary[data-nav-target] .lucide,
  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist .lucide {
    flex: 0 0 auto !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--sidebar-v2-muted) !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    stroke-width: 1.8 !important;
    transform: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist {
    gap: 2px !important;
    padding: 0 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a {
    position: relative !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    gap: 9px !important;
    padding: 0 10px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 8px !important;
    color: var(--sidebar-v2-muted) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-family: var(--aotu-font-sans, "Inter", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, -apple-system, sans-serif) !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a::before {
    content: "" !important;
    position: absolute !important;
    top: 8px !important;
    bottom: 8px !important;
    left: 0 !important;
    display: block !important;
    width: 2px !important;
    height: auto !important;
    border-radius: 999px !important;
    background: transparent !important;
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a:hover {
    color: var(--sidebar-v2-text) !important;
    background: var(--sidebar-v2-hover) !important;
    box-shadow: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a.active,
  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a[aria-current="page"] {
    color: var(--sidebar-v2-accent-strong) !important;
    background: var(--sidebar-v2-accent-soft) !important;
    box-shadow: none !important;
    font-weight: 600 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a.active::before,
  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a[aria-current="page"]::before {
    background: var(--sidebar-v2-accent) !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a:hover .lucide {
    color: var(--sidebar-v2-text) !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a.active .lucide,
  html:not([data-mobile-workbench="true"]) .sidebar .nav-sublist a[aria-current="page"] .lucide {
    color: var(--sidebar-v2-accent) !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav a:focus-visible,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav button:focus-visible,
  html:not([data-mobile-workbench="true"]) .sidebar .works-card:focus-visible {
    outline: 2px solid rgba(101, 87, 220, 0.48) !important;
    outline-offset: 2px !important;
  }

  /* The image/video mode switch keeps its own visual identity in every industry. */
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-standalone {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 12px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--sidebar-v2-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry:hover,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry.active {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 58px !important;
    height: 58px !important;
    max-height: 58px !important;
    padding: 8px 10px !important;
    border: 1px solid rgba(224, 226, 229, 0.98) !important;
    border-radius: 16px !important;
    color: #26282d !important;
    background: rgba(255, 255, 255, 0.98) !important;
    background-image: none !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry:hover,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry.active {
    border-color: rgba(196, 187, 239, 0.96) !important;
    background: rgba(255, 255, 255, 0.98) !important;
    box-shadow: 0 6px 16px rgba(105, 91, 164, 0.08) !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry::before,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry::after,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry-icon::after {
    display: none !important;
    animation: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry-icon {
    display: grid !important;
    place-items: center !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    border: 0 !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #ff67c7 0%, #aa4ff0 52%, #ff925b 100%) !important;
    box-shadow:
      inset 0 1px 1px rgba(255, 255, 255, 0.55),
      0 4px 10px rgba(185, 72, 189, 0.2) !important;
    filter: none !important;
    animation: none !important;
    transform: none !important;
  }

  html:not([data-mobile-workbench="true"]) body.video-workspace-mode .sidebar .side-nav .nav-video-entry-icon {
    background: linear-gradient(135deg, #13cce1 0%, #3488f5 52%, #7c5ce7 100%) !important;
    box-shadow:
      inset 0 1px 1px rgba(255, 255, 255, 0.55),
      0 4px 10px rgba(52, 136, 245, 0.2) !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry-icon .lucide {
    width: 18px !important;
    height: 18px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #ffffff !important;
    background: transparent !important;
    box-shadow: none !important;
    stroke-width: 2.2 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry-copy {
    gap: 2px !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry-copy strong {
    color: #272a2f !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.15 !important;
    letter-spacing: normal !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry-copy small {
    color: #9297a0 !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    letter-spacing: normal !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry-arrow {
    display: none !important;
    animation: none !important;
    transform: none !important;
  }

  /* The all-tasks utility is another intentional brand exception. */
  html:not([data-mobile-workbench="true"]) .sidebar .works-card,
  html:not([data-mobile-workbench="true"]) .sidebar .works-card:hover {
    border: 1px solid rgba(119, 132, 158, 0.16) !important;
    border-radius: 14px !important;
    color: #293347 !important;
    background: rgba(255, 255, 255, 0.74) !important;
    box-shadow: 0 6px 18px rgba(55, 67, 94, 0.07) !important;
    transform: none !important;
  }

  html:not(#aotu-shadow-reset-1):not(#aotu-shadow-reset-2):not(#aotu-shadow-reset-3):not(#aotu-shadow-reset-4):not([data-mobile-workbench="true"])
    body
    .sidebar
    .works-card,
  html:not(#aotu-shadow-reset-1):not(#aotu-shadow-reset-2):not(#aotu-shadow-reset-3):not(#aotu-shadow-reset-4):not([data-mobile-workbench="true"])
    body
    .sidebar
    .works-card:hover {
    box-shadow: 0 6px 18px rgba(55, 67, 94, 0.07) !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .works-card:hover {
    border-color: rgba(101, 87, 220, 0.2) !important;
    background: rgba(255, 255, 255, 0.94) !important;
    transform: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .works-icon {
    border: 0 !important;
    border-radius: 9px !important;
    color: #ffffff !important;
    background: #6670ea !important;
    box-shadow: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .works-icon .lucide {
    color: #ffffff !important;
    stroke-width: 2.2 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .works-card strong {
    color: #293347 !important;
    font-weight: 600 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .works-card small {
    color: #7d88a6 !important;
    font-weight: 450 !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav a,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav button,
  html:not([data-mobile-workbench="true"]) .sidebar .works-card {
    transition: none !important;
  }

  html:not([data-mobile-workbench="true"]) .sidebar .side-nav a,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav button,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav a *,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav button *,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav .lucide,
  html:not([data-mobile-workbench="true"]) .sidebar .works-card,
  html:not([data-mobile-workbench="true"]) .sidebar .works-icon {
    animation: none !important;
    filter: none !important;
  }

  @media (max-width: 1599px) {
    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .side-nav {
      gap: 8px !important;
    }

    html:not([data-mobile-workbench="true"])
      body:not(.desktop-sidebar-expanded)
      .sidebar
      .side-nav
      > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace) {
      gap: 3px !important;
      padding: 0 !important;
      border-bottom: 0 !important;
    }

    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .side-nav .nav-primary[data-nav-target]::after,
    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .nav-sublist a::before {
      display: none !important;
    }

    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .side-nav .nav-primary[data-nav-target],
    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .nav-sublist a {
      width: 52px !important;
      min-width: 52px !important;
      max-width: 52px !important;
      height: 40px !important;
      min-height: 40px !important;
      max-height: 40px !important;
      margin: 0 auto !important;
      padding: 0 !important;
      border-radius: 10px !important;
      font-size: 0 !important;
      line-height: 0 !important;
    }

    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .side-nav .nav-video-standalone {
      padding-bottom: 8px !important;
    }

    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .side-nav .nav-video-entry,
    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .side-nav .nav-video-entry:hover,
    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .side-nav .nav-video-entry.active {
      grid-template-columns: 1fr !important;
      width: 52px !important;
      min-width: 52px !important;
      max-width: 52px !important;
      height: 52px !important;
      min-height: 52px !important;
      max-height: 52px !important;
      margin: 0 auto !important;
      padding: 0 !important;
      border-radius: 12px !important;
    }

    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .nav-video-entry-copy,
    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .nav-video-entry-arrow {
      display: none !important;
    }

    html:not([data-mobile-workbench="true"]) body:not(.desktop-sidebar-expanded) .sidebar .nav-video-entry-icon {
      margin: auto !important;
    }

    html:not([data-mobile-workbench="true"]) body.desktop-sidebar-expanded .sidebar .side-nav .nav-group {
      background: transparent !important;
      box-shadow: none !important;
    }

    html:not([data-mobile-workbench="true"]) body.desktop-sidebar-expanded .sidebar .side-nav .nav-primary[data-nav-target],
    html:not([data-mobile-workbench="true"]) body.desktop-sidebar-expanded .sidebar .nav-sublist a {
      width: 100% !important;
      min-width: 0 !important;
      max-width: none !important;
      margin: 0 !important;
    }

  }
}

@media all {
  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar {
    --sidebar-v2-surface: #141923;
    --sidebar-v2-panel: rgba(29, 35, 47, 0.9);
    --sidebar-v2-panel-strong: rgba(31, 38, 51, 0.96);
    --sidebar-v2-line: rgba(148, 163, 184, 0.15);
    --sidebar-v2-text: #edf1f7;
    --sidebar-v2-muted: #aeb7c6;
    --sidebar-v2-soft: #8792a5;
    --sidebar-v2-accent: #a99cff;
    --sidebar-v2-accent-strong: #d4cdff;
    --sidebar-v2-accent-soft: rgba(137, 116, 255, 0.14);
    --sidebar-v2-hover: rgba(255, 255, 255, 0.055);
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry,
  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry:hover,
  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .side-nav .nav-video-entry.active {
    border-color: #343d4d !important;
    background: var(--sidebar-v2-panel-strong) !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-card,
  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-card:hover {
    border-color: transparent !important;
    color: #edf0f7 !important;
    background: linear-gradient(135deg, #293447 0%, #273a56 54%, #244768 100%) !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-card:hover {
    background: linear-gradient(135deg, #303d53 0%, #2e4362 54%, #2a5075 100%) !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-card strong {
    color: #edf0f7 !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-card small {
    color: #aeb5c6 !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-icon {
    color: #ffffff !important;
    background: linear-gradient(145deg, #9ae1f6 0%, #6c91ff 48%, #704ce9 100%) !important;
    box-shadow: 0 6px 14px rgba(73, 101, 222, 0.23) !important;
  }

  /* Keep the branded utility card above the generic dark-theme button reset. */
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body:not(.mobile-personal-page)
    .sidebar
    button#works-card.works-card {
    border-color: transparent !important;
    color: #edf0f7 !important;
    background: linear-gradient(135deg, #293447 0%, #273a56 54%, #244768 100%) !important;
    background-image: linear-gradient(135deg, #293447 0%, #273a56 54%, #244768 100%) !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body:not(.mobile-personal-page)
    .sidebar
    button#works-card.works-card:hover {
    background: linear-gradient(135deg, #303d53 0%, #2e4362 54%, #2a5075 100%) !important;
    background-image: linear-gradient(135deg, #303d53 0%, #2e4362 54%, #2a5075 100%) !important;
  }
}

/*
 * Specificity bridge for the legacy white-card layers.
 * Keep this after the theme rules so the shared navigation language wins in
 * both image and video workspaces without changing their underlying markup.
 */
@media all {
  html:not([data-theme="dark"]):not([data-mobile-workbench="true"])
    body
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace),
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace) {
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html:not([data-theme="dark"]):not([data-mobile-workbench="true"])
    body
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace)
    > .nav-primary,
  html:not([data-theme="dark"]):not([data-mobile-workbench="true"])
    body
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace)
    > .nav-sublist,
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace)
    > .nav-primary,
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace)
    > .nav-sublist {
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html:not([data-theme="dark"]):not([data-mobile-workbench="true"])
    body.desktop-sidebar-expanded
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace),
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body.desktop-sidebar-expanded
    .sidebar
    .side-nav
    > .nav-group:not(.nav-video-standalone):not(.nav-infinite-canvas-standalone):not(.nav-video-workspace) {
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body
    .sidebar
    .nav-sublist
    a.active,
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body
    .sidebar
    .nav-sublist
    a[aria-current="page"] {
    color: var(--sidebar-v2-accent-strong) !important;
    background: var(--sidebar-v2-accent-soft) !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature]
    .sidebar
    .side-nav
    .nav-sublist
    a.active,
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature]
    .sidebar
    .side-nav
    .nav-sublist
    a[aria-current="page"] {
    color: var(--sidebar-v2-accent-strong) !important;
    background: var(--sidebar-v2-accent-soft) !important;
    box-shadow: none !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body
    .sidebar
    .nav-sublist
    a.active
    .lucide,
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body
    .sidebar
    .nav-sublist
    a[aria-current="page"]
    .lucide {
    color: var(--sidebar-v2-accent) !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature]
    .sidebar
    .side-nav
    .nav-sublist
    a.active
    .lucide,
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body.feature-focus-mode.workstation-feature-mode[data-active-feature]
    .sidebar
    .side-nav
    .nav-sublist
    a[aria-current="page"]
    .lucide {
    color: var(--sidebar-v2-accent) !important;
  }

  /* Keep the mode switch geometry identical across industry bootstraps. */
  html:not([data-mobile-workbench="true"])
    body
    .sidebar
    .side-nav
    .nav-video-standalone
    > .nav-video-entry[data-video-mode-toggle],
  html:not([data-mobile-workbench="true"])
    body.video-workspace-mode
    .sidebar
    .side-nav
    .nav-video-standalone
    > .nav-video-entry[data-video-mode-toggle].active:not(:hover) {
    border-radius: 16px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav a,
  html:not([data-mobile-workbench="true"]) .sidebar .side-nav button,
  html:not([data-mobile-workbench="true"]) .sidebar .works-card {
    transition: none !important;
  }
}

/* Dark sidebar chrome: keep utility controls flat and free of purple residue. */
@media all {
  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar {
    --sidebar-v2-accent: #8fb7ff;
    --sidebar-v2-accent-strong: #c5d9ff;
    --sidebar-v2-accent-soft: rgba(82, 111, 168, 0.22);
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body:not(.mobile-personal-page)
    .sidebar
    button#works-card.works-card,
  html[data-theme="dark"]:not([data-mobile-workbench="true"])
    body:not(.mobile-personal-page)
    .sidebar
    button#works-card.works-card:hover {
    border-color: rgba(148, 163, 184, 0.16) !important;
    color: #edf0f7 !important;
    background-color: #182130 !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-icon {
    border: 0 !important;
    color: #ffffff !important;
    background: #7283f0 !important;
    box-shadow: none !important;
  }

  html[data-theme="dark"]:not(#aotu-shadow-reset-1):not(#aotu-shadow-reset-2):not(#aotu-shadow-reset-3):not(#aotu-shadow-reset-4):not([data-mobile-workbench="true"])
    body:not(.mobile-personal-page)
    .sidebar
    button#works-card.works-card,
  html[data-theme="dark"]:not(#aotu-shadow-reset-1):not(#aotu-shadow-reset-2):not(#aotu-shadow-reset-3):not(#aotu-shadow-reset-4):not([data-mobile-workbench="true"])
    body:not(.mobile-personal-page)
    .sidebar
    button#works-card.works-card:hover {
    box-shadow: none !important;
  }

  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .side-nav a:focus-visible,
  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .side-nav button:focus-visible,
  html[data-theme="dark"]:not([data-mobile-workbench="true"]) .sidebar .works-card:focus-visible {
    outline-color: rgba(143, 183, 255, 0.58) !important;
  }
}