/* Baseline Lifestyle — Shared Pattern
   Enforces the Baseline Food Approach layout/pattern sitewide,
   while allowing each page to define its palette via variables.
*/

html, body{ height:100%; }
html{ background: var(--page-bg, #000); }
body{
  margin:0;
  color: var(--ink);
  font-family: var(--font);
  font-size: 20px;
  line-height: 1.6;
}

/* Ensure the “system” pages share the same background pattern */
body[data-app="food"],
body[data-app="skin"]{
  background: var(--page-bg);
  background-attachment: fixed;
  background-size: 100% 100%;
}

/* Remove the skin page’s old textured overlays (pattern is now gradient-based) */
body[data-app="skin"]::before,
body[data-app="skin"]::after{
  content: none !important;
  display: none !important;
}

/* Core surfaces */
.card{
  background: var(--card-bg);
  border: 1px solid var(--border);
}

/* Filter bar surface */
.filter-bar{
  background: var(--filter-bg);
  border: 1px solid var(--border);
}
.filter-bar .clear{
  background: var(--showall-bg);
  border: 1px solid var(--showall-border);
}

/* Print buttons should inherit the same “soft surface” look */
.print-btn{
  background: var(--showall-bg);
  border: 1px solid var(--showall-border);
}