/* First-visit privacy notice: a card under the hero while the diagram is empty, centered above the tool pill otherwise; blocks the app until accepted */
.consent-pending::before { content: ""; position: fixed; inset: 0; z-index: 40; background: color-mix(in srgb, var(--bg, #000) 30%, transparent); }
/* The notice lives inside .empty-hint (z 14), which sat under the dim layer: lift it so its OK button can be clicked */
.consent-pending .empty-hint { z-index: 41; }
.privacy-notice {
  position: fixed;
  left: 50%;
  bottom: calc(var(--footer-h) + 96px);
  transform: translateX(-50%);
  z-index: 41;
  display: flex;
  align-items: center;
  gap: 16px;
  width: min(640px, calc(100vw - 24px));
  padding: 18px 20px;
  text-align: left;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: calc(var(--radius-lg) + 4px);
  box-shadow: var(--shadow-float);
  font-size: var(--fs-small);
  line-height: 1.5;
  color: var(--text);
}
.privacy-notice[hidden] { display: none; }
.empty-stack > .privacy-notice { position: static; transform: none; width: auto; flex: none; }
.privacy-ico { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: var(--accent); background: var(--accent-soft); }
.privacy-body { flex: 1; min-width: 0; }
.privacy-notice h2 { margin: 0; font-size: var(--fs-body); font-weight: 600; }
.privacy-notice p { margin: 4px 0 0; }
.privacy-notice a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.notice-ok { flex: none; height: 40px; padding: 0 18px; border: 0; border-radius: var(--radius-md); background: var(--accent); color: var(--on-accent); font-weight: 600; font-size: var(--fs-small); cursor: pointer; }
.notice-ok:hover { background: var(--accent-hover); }
.notice-ok:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (max-width: 640px) {
  .privacy-notice { flex-wrap: wrap; padding: 14px; gap: 12px; bottom: calc(var(--footer-h) + 76px); }
  .privacy-body { flex: 1 1 calc(100% - 56px); }
  .notice-ok { width: 100%; }
}
