section[data-gq-network-panel="true"] [data-gq-network-toolbar] {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  gap: 4px;
  margin-left: auto;
  white-space: nowrap;
}

section[data-gq-network-panel="true"] [data-gq-network-toolbar] button {
  min-height: 30px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #fff;
  padding: 0 8px;
  color: #334155;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
}

section[data-gq-network-panel="true"] [data-gq-network-toolbar] button:hover,
section[data-gq-network-panel="true"] [data-gq-network-toolbar] button:focus-visible {
  border-color: #7aa7ff;
  background: #eff6ff;
  color: #1d4ed8;
  outline: none;
}

section[data-gq-network-panel="true"] [data-gq-network-toolbar] button[data-gq-network-action="edit"] {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

section[data-gq-network-panel="true"] [data-gq-network-toolbar] button[data-gq-network-action="edit"]:hover,
section[data-gq-network-panel="true"] [data-gq-network-toolbar] button[data-gq-network-action="edit"]:focus-visible {
  border-color: #2563eb;
  background: #dbeafe;
  color: #1e40af;
}

section[data-gq-network-panel="true"] [data-gq-network-toolbar] button[data-gq-network-action="critical"] {
  border-color: #fecdd3;
  color: #be123c;
}

section[data-gq-network-panel="true"] [data-gq-network-toolbar] button[data-gq-network-action="critical"]:hover,
section[data-gq-network-panel="true"] [data-gq-network-toolbar] button[data-gq-network-action="critical"]:focus-visible {
  background: #fff1f2;
  color: #9f1239;
}

section[data-gq-network-panel="true"] [data-gq-network-zoom] {
  min-width: 38px;
  color: #475569;
  font-size: 11px;
  font-weight: 900;
  text-align: center;
}

section[data-gq-network-panel="true"] [data-gq-network-save-state] {
  min-width: 42px;
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}

section[data-gq-network-panel="true"] [data-gq-network-action="save"] {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

section[data-gq-network-panel="true"] [data-gq-network-action="undo"],
section[data-gq-network-panel="true"] [data-gq-network-action="redo"] {
  background: #f8fafc;
  color: #475569;
}

section[data-gq-network-panel="true"] [data-gq-network-save-state="saved"] {
  color: #047857;
}

section[data-gq-network-panel="true"] [data-gq-network-save-state="error"] {
  color: #b91c1c;
}

section[data-gq-network-panel="true"] [data-gq-network-scroll] {
  overscroll-behavior: contain;
  scrollbar-color: #94a3b8 #e2e8f0;
}

section[data-gq-network-panel="true"] [data-gq-network-canvas] {
  min-width: 1000px;
  will-change: zoom;
}

section[data-gq-network-panel="true"] [data-gq-network-canvas] button[data-gq-network-selected="true"] {
  position: relative;
  z-index: 2;
  outline: 3px solid #2563eb !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.18), 0 8px 18px rgba(37, 99, 235, 0.18) !important;
}

section[data-gq-network-panel="true"] [data-gq-network-canvas] button[data-gq-network-selected="true"]::after {
  content: "已选";
  position: absolute;
  top: -18px;
  right: -4px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  padding: 2px 5px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  pointer-events: none;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  gap: 4px;
  margin-left: 10px;
  white-space: nowrap;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button {
  min-height: 30px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #fff;
  padding: 0 8px;
  color: #334155;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button:hover,
section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button:focus-visible {
  border-color: #7aa7ff;
  background: #eff6ff;
  color: #1d4ed8;
  outline: none;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="critical"] {
  border-color: #fecdd3;
  color: #be123c;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="critical"][aria-pressed="true"] {
  background: #e11d48;
  color: #fff;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="critical"]:hover,
section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="critical"]:focus-visible {
  background: #fff1f2;
  color: #9f1239;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="critical"][aria-pressed="true"]:hover,
section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="critical"][aria-pressed="true"]:focus-visible {
  background: #be123c;
  color: #fff;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-scroll] {
  overscroll-behavior: contain;
  scrollbar-color: #94a3b8 #e2e8f0;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-rows] {
  scrollbar-color: #94a3b8 #e2e8f0;
}

section[data-gq-timeline-panel="true"] [data-gq-timeline-rows] > button[hidden],
section[data-gq-timeline-panel="true"] [data-gq-timeline-scroll] [hidden] {
  display: none;
}

@media (max-width: 1180px) {
  section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] {
    margin-left: 0;
  }
}

@media (max-width: 820px) {
  section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="fit"],
  section[data-gq-timeline-panel="true"] [data-gq-timeline-toolbar] button[data-gq-timeline-action="reset"] {
    display: none;
  }
}

@media (max-width: 1180px) {
  section[data-gq-network-panel="true"] [data-gq-network-toolbar] {
    margin-left: 0;
  }
}

@media (max-width: 720px) {
  section[data-gq-network-panel="true"] [data-gq-network-toolbar] {
    max-width: 100%;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  section[data-gq-network-panel="true"] [data-gq-network-save-state] {
    order: 2;
  }

  section[data-gq-network-panel="true"] [data-gq-network-toolbar] button[data-gq-network-action="critical"] {
    max-width: 86px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
