.page-tools {
  --tools-ink: var(--ink, #252525);
  --tools-paper: var(--surface, var(--sf, var(--gr, var(--paper, #fff8f4))));
  --tools-line: var(--line, #b8aaa2);
  --tools-gap: 8px;
  --tools-padding: 12px;
  --tools-radius: 8px;
  --tools-target: 44px;
  --tools-width: 296px;
  --tools-muted: var(--mute, var(--muted, #626872));
  --tools-hover: color-mix(in srgb, var(--tools-ink) 6%, var(--tools-paper));
  --tools-icon: 18px;
  position: relative;
  flex: 0 1 auto;
  color: var(--tools-ink);
  font-family: inherit;
  font-size: 13px;
  line-height: 1.5;
  text-align: left;
}
.page-tools details { border: 0; padding: 0; margin: 0; }
.page-tools summary, .page-tools button, .page-tools a {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--tools-target);
  padding: var(--tools-gap) var(--tools-padding);
  border: 0;
  border-radius: var(--tools-radius);
  background: transparent;
  color: inherit;
  font: inherit;
  text-decoration: none;
  cursor: pointer;
}
.page-tools summary { gap: var(--tools-gap); list-style: none; white-space: nowrap; }
.page-tools summary::-webkit-details-marker { display: none; }
.page-tools summary::after { content: '+'; position: static; font: inherit; }
.page-tools details[open] > summary::after { content: '−'; }
.page-tools button:hover, .page-tools a:hover, .page-tools summary:hover,
.page-tools details[open] > summary { background: var(--tools-hover); }
.page-tools :focus-visible { outline: 2px solid var(--tools-ink); outline-offset: 2px; }
.page-tools-panel {
  box-sizing: border-box;
  position: absolute;
  z-index: 10;
  bottom: calc(100% + var(--tools-gap));
  right: 0;
  width: var(--tools-width);
  max-width: calc(100vw - 48px);
  max-height: 70vh;
  overflow-y: auto;
  padding: var(--tools-padding);
  background: var(--tools-paper);
  border: 1px solid var(--tools-line);
  border-radius: var(--tools-radius);
}
.page-tools details:not([open]) > .page-tools-panel { display: none; }

.page-tools .page-tools-panel p { margin: var(--tools-gap) 0; font: inherit; color: inherit; }
.page-tools .page-tools-panel .page-tools-heading { margin: 0; padding: var(--tools-gap) var(--tools-padding); font-weight: 600; }
.page-tools [role="status"]:empty { display: none; }
.page-tools textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 90px;
  font: inherit;
  padding: var(--tools-gap);
  color: var(--tools-ink);
  background: var(--tools-paper);
  border: 1px solid var(--tools-line);
  border-radius: var(--tools-radius);
  color-scheme: inherit;
}
.page-tools [hidden] { display: none; }
.foot { align-items: center; }
.foot .page-tools-panel { left: auto; right: 0; }
footer .page-tools { margin-left: auto; }


.page-tools-actions { display: grid; }
.page-tools-actions > button, .page-tools-actions > a {
  display: grid;
  grid-template-columns: var(--tools-icon) 1fr;
  gap: var(--tools-padding);
  width: 100%;
  text-align: left;
}
.page-tools-actions svg { width: var(--tools-icon); height: var(--tools-icon); }
.page-tools .page-tools-ai {
  margin-top: var(--tools-gap);
  padding-top: var(--tools-gap);
  border-top: 1px solid var(--tools-line);
}
.page-tools-ai > summary { display: flex; justify-content: space-between; white-space: normal; }
.page-tools-ai-content { padding: var(--tools-gap) var(--tools-padding); }
.page-tools-ai-content > button { width: 100%; background: var(--tools-hover); font-weight: 600; }
.page-tools .page-tools-ai-content p { color: var(--tools-muted); font-size: 12px; }
.page-tools-providers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--tools-gap);
}
.page-tools-providers > a {
  justify-content: flex-start;
  gap: var(--tools-gap);
  padding-inline: var(--tools-gap);
  border: 1px solid var(--tools-line);
  text-align: left;
}
.page-tools-providers img {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.page-tools-providers span { min-width: 0; overflow-wrap: anywhere; }
.page-tools-providers small { display: block; color: var(--tools-muted); font-size: 11px; }
.page-tools-providers > a:hover { border-color: var(--provider-color); }
.page-tools-providers [data-provider="chatgpt"] { --provider-color: #111111; }
.page-tools-providers [data-provider="claude"] { --provider-color: #d97757; }
.page-tools-providers [data-provider="perplexity"] { --provider-color: #22b8cd; }
.page-tools-providers [data-provider="gemini"] { --provider-color: #3186ff; }
.page-tools .page-tools-panel [role="status"]:not(:empty) { padding: var(--tools-gap) var(--tools-padding); background: var(--tools-hover); border-radius: var(--tools-radius); }
