.tools-panel[data-site-tools-panel],
.tools-panel[data-tools-panel] {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 30;
  display: grid;
  gap: 8px;
  width: min(760px, calc(100vw - 32px));
  max-height: min(74vh, 680px);
  overflow: auto;
  border: 1px solid var(--line, #d9e6e1);
  border-radius: 8px;
  background: var(--paper, var(--surface, #fff));
  padding: 8px;
}
.tools-panel .tool-menu-group {
  border: 1px solid var(--line, #d9e6e1);
  border-radius: 8px;
  padding: 8px;
}
.tools-panel .tool-menu-group h2 {
  margin: 0 0 6px;
  color: var(--muted, #5f716b);
  font-size: 11px;
  text-transform: uppercase;
}
.tools-panel .tool-menu-group a,
.tools-panel > a {
  display: grid;
  gap: 3px;
  border-radius: 6px;
  padding: 10px;
  text-decoration: none;
  color: inherit;
}
.tools-panel a:hover,
.tools-panel a[aria-current="page"] {
  background: color-mix(in srgb, var(--teal, #0b6b62) 10%, transparent);
}
.tools-panel span {
  color: var(--muted, #5f716b);
  font-size: 12px;
  line-height: 1.35;
}

.cc-tools-dialog { box-sizing: border-box; width: min(760px, calc(100% - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 24px; border: 1px solid var(--border, #72847b); border-radius: 18px; background: var(--surface, #fff); color: var(--text, #172c25); overflow-y: auto; overscroll-behavior: contain; }
.cc-tools-dialog::backdrop { background: #071c17aa; }
[data-theme="dark"] .cc-tools-dialog { background: #0f1715; color: #e3ece7; }
.cc-menu-open { overflow: hidden; }
.cc-tools-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; position: sticky; top: -24px; z-index: 2; padding: 12px 0; background: var(--surface, #fff); }
[data-theme="dark"] .cc-tools-heading { background: #0f1715; }
.cc-tools-heading h2 { margin: 0; font-size: 1.5rem; }
.cc-tools-heading button { min-height: 44px; }
.cc-catalogue-search { display: grid; gap: 8px; font-weight: 700; }
.cc-catalogue-search input { box-sizing: border-box; width: 100%; min-width: 0; min-height: 48px; padding: 12px; font: inherit; border: 1px solid currentColor; border-radius: 8px; background: transparent; color: inherit; }
.cc-catalogue-groups { display: grid; gap: 10px; margin: 16px 0; }
.cc-catalogue-group { min-width: 0; border: 1px solid #82988c70; border-radius: 10px; }
.cc-catalogue-group summary { cursor: pointer; min-height: 48px; box-sizing: border-box; padding: 14px; font-weight: 700; }
.cc-catalogue-group > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 4px 10px 12px; gap: 8px; }
.cc-tools-dialog a { display: block; padding: 12px; min-width: 0; color: inherit; text-decoration: none; border-radius: 8px; overflow-wrap: anywhere; }
.cc-tools-dialog a:hover, .cc-tools-dialog a[aria-current="page"] { background: #728c7825; }
.cc-tools-dialog a strong, .cc-tools-dialog a span { display: block; }
.cc-tools-dialog a span { margin-top: 4px; font-size: .875rem; line-height: 1.5; }
.cc-tools-dialog [hidden] { display: none !important; }
.cc-tools-dialog :focus-visible { outline: 3px solid #10a998; outline-offset: 3px; }
.cc-menu-status:empty, .cc-menu-saved:empty { display: none; }
.related-tool-grid a > strong, .related-tool-grid a > span { display: block; }
.related-tool-grid a > span { margin-top: 6px; }
.cc-publisher { width: 100%; margin: 8px 0 0; color: var(--muted, #5f716b); font-size: 13px; }
.pay-family-note {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto 14px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--teal, #0b6b62) 28%, var(--line, #d9e6e1));
  border-left: 4px solid var(--teal, #0b6b62);
  border-radius: 8px;
  background: color-mix(in srgb, var(--teal, #0b6b62) 6%, var(--paper, var(--surface, #fff)));
  color: var(--muted, #5f716b);
  font-size: 0.95rem;
  line-height: 1.5;
}
.pay-experience-input > .pay-family-note {
  width: auto;
  margin: 0 0 16px;
}
.pay-family-note a { color: var(--teal, #0b6b62); font-weight: 760; }
@media (max-width: 600px) {
  .cc-tools-dialog { width: 100%; height: 100dvh; max-height: 100dvh; margin: 0; padding: 20px 16px max(20px, env(safe-area-inset-bottom)); border-radius: 0; border: 0; }
  .cc-catalogue-group > div { grid-template-columns: 1fr; }
  .cc-tools-heading { top: -20px; }
  .site-nav, .nav, header nav { flex-wrap: wrap; }
}