/* Keel shared layout — /ui/keel.css
   Built 2026-08-07. Lee: "the screens look different when you click on different tabs".
   Measured cause: every page defined its own content container, so content width was
   1160 (dashboard) / 1040 (notes) / 736 (plan) / 1120 (guides) against a 1120 nav,
   and h1 ran 43.2 / 26 / 24 / 23px with notes alone on a sans face.
   Loaded AFTER each page inline <style> so these win on equal specificity.
   Layout only — colour tokens stay per page. Delete this file to revert. */

/* 1. One content column, aligned to the nav (.knav-in is 1120 centred) */
body > main,
body > .top > .wrap,
body > .board,
body > section > .wrap,
body > .wrap {
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

/* 2. One type scale for page headings. Dashboard keeps its larger hero. */
main > h1, main h1, .board h1, .top .h1, h1.page-title {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
  line-height: 1.2;
  margin: 0 0 6px;
}
.hero h1 { font-size: 43px; }          /* the marketing hero is meant to be bigger */

/* 3. Consistent breathing room under the nav */
body > main, body > .board, body > .top { padding-top: 26px; }

/* 4. Footers were bare links on a dark bar - make them legible everywhere */
footer a { color: #E3B872; }

/* 5. Do not double-constrain: where a .wrap sits INSIDE an already-constrained
   main/section, it must not add its own max-width or side padding - that is what
   pushed the dashboard heading to left:72 while every other page sat at left:50. */
body > main .wrap,
body > main > section > .wrap {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
