.privacy-tools,
.privacy-panel {
  font-family: var(--appearance-annotation-family, var(--mono));
  font-size: var(--fs-footer, 11px);
  line-height: 1.5;
  letter-spacing: 0.02em;
  text-transform: lowercase;
}

.privacy-tools {
  position: fixed;
  z-index: 1000;
  left: 16px;
  bottom: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.privacy-tools button {
  padding: 6px 8px;
  border: 1px solid var(--border, var(--line));
  background: var(--bg);
  color: var(--ink, var(--fg));
  font: inherit;
  cursor: pointer;
}

.privacy-tools button[hidden],
.footer-utilities button[hidden] { display: none; }

.footer-utilities {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 6px;
}

.privacy-panel {
  position: fixed;
  z-index: 1001;
  left: 16px;
  bottom: 52px;
  width: min(420px, calc(100vw - 32px));
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  padding: 16px;
  border: 1px solid var(--border, var(--line));
  background: var(--bg);
  color: var(--ink, var(--fg));
}

body.privacy-has-footer .privacy-panel { bottom: 16px; }
.privacy-panel[hidden] { display: none; }
.privacy-panel p { margin: 0 0 12px; }
.privacy-panel a { color: inherit; text-decoration: underline; }
.privacy-panel code { font-family: inherit; }
.privacy-more { margin: 0 0 12px; }
.privacy-more summary { width: max-content; text-decoration: underline; cursor: pointer; }
.privacy-more[open] summary { margin-bottom: 10px; }
.privacy-more p:last-child { margin-bottom: 0; }
.privacy-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.privacy-actions button {
  flex: 1;
  min-width: 130px;
  min-height: 36px;
  border: 1px solid var(--border, var(--line));
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.privacy-control:hover,
.privacy-control:focus-visible,
.privacy-off:hover,
.privacy-off:focus-visible,
.privacy-actions button:hover,
.privacy-actions button:focus-visible { color: var(--ink-hover, var(--fg)); border-color: currentColor; }

@container (max-width: 430px) {
  .footer { grid-template-columns: max-content minmax(0, 1fr); }
  .footer-utilities { grid-column: 2; justify-self: end; justify-content: end; }
  .footer-domain { grid-column: 1 / -1; grid-row: 2; }
}
