/* Round 1, rule 1: nothing floats on bare white. Content sits on white panels
   with a 1px border and an 8px radius, on the grey canvas. No shadows except
   the sticky bar. */

.kv,
.export-block,
.admin-section,
.console-section,
.card,
.design-card,
.fact,
.note,
.table-scroll {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--gap);
  margin: 0 0 var(--gap);
  box-shadow: none;
}

/* The console section used to be a rule with a gap above it. It is a panel now,
   and its heading sits inside. */
.console-section { border-top: 1px solid var(--border); padding-top: var(--gap); }
.console-section > h2:first-child,
.export-block > h2:first-child,
.admin-section > h2:first-child { margin-top: 0; }

/* Panels that hold a table give the table the edges instead of padding it. */
.table-scroll { padding: 0; overflow-x: auto; }

/* Key/value blocks: label column is an eyebrow, rows are tight. */
.kv { padding: 0; }
.kv-row { grid-template-columns: minmax(8rem, 12rem) 1fr; min-height: 0; border-bottom: 1px solid var(--border); }
.kv-label { padding: .45rem .7rem; }
.kv-value { padding: .45rem .7rem; }
.kv-group { background: #f8f9fb; padding: .35rem .7rem; font-size: var(--fs-label); letter-spacing: .06em; }

/* Rule 10: no marketing furniture. */
.hero, .hero-lede, .audience-tabs, .compare { border-radius: var(--radius); }
.export-block { background: var(--panel); }
