/* Tweaks panel */
.tw { position: fixed; right: 16px; bottom: 16px; z-index: 100; font-family: var(--ff-body); }
.tw__toggle {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--ink); color: var(--paper); border: 1px solid var(--rule-strong);
  padding: 10px 14px; border-radius: 999px; cursor: pointer; font-size: 13px;
}
.tw__toggle:hover { border-color: var(--cyan); color: var(--cyan); }
.tw__panel {
  margin-top: 10px; padding: 18px;
  background: var(--ink); border: 1px solid var(--rule-strong); border-radius: 14px;
  width: 280px; display: grid; gap: 14px; color: var(--paper);
}
.tw__field { display: grid; gap: 6px; font-size: 13px; }
.tw__field .mono { color: var(--steel-300); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; }
.tw__field input[type=range] { accent-color: var(--cyan); }
.tw__field select { background: var(--ink-2); color: var(--paper); border: 1px solid var(--rule-strong); padding: 8px 10px; border-radius: 8px; font-family: inherit; }
.tw__row { display: flex; align-items: center; justify-content: space-between; }

/* Density */
body[data-density="compact"] .hero { padding-top: 100px; padding-bottom: 60px; }
body[data-density="compact"] .belief,
body[data-density="compact"] .work,
body[data-density="compact"] .method,
body[data-density="compact"] .insights,
body[data-density="compact"] .cta { padding-top: 80px; padding-bottom: 80px; }
body[data-density="spacious"] .belief,
body[data-density="spacious"] .work,
body[data-density="spacious"] .method,
body[data-density="spacious"] .insights,
body[data-density="spacious"] .cta { padding-top: 180px; padding-bottom: 180px; }