@layer utilities {

  /* Editing controls: not on phones (they only view) nor through a house's read-only link. */
  @media (max-width: 760px) {
    .edit-only {
      display: none;
    }
  }

  [data-read-only] .edit-only {
    display: none;
  }

  /* A linked project (House#link!): the building's controls stay with its original. */
  [data-linked] .building-only {
    display: none;
  }

  /* Panel parts of one workspace (data-workspace-only) hide while another is active
     (data-workspace on the designer root, set by floor_designer_controller); "elements" parts show in
     either stage that places elements. */
  [data-workspace]:not([data-workspace="house"]) [data-workspace-only="house"],
  [data-workspace]:not([data-workspace="heating"]) [data-workspace-only="heating"],
  [data-workspace]:not([data-workspace="climate"]) [data-workspace-only="climate"],
  [data-workspace]:not([data-workspace="heating"], [data-workspace="climate"]) [data-workspace-only="elements"],
  [data-workspace]:not([data-workspace="pipes"]) [data-workspace-only="pipes"] {
    display: none;
  }

  /* The heating and climate panels' pages (houses/_heating_tabs): the other page's parts hide, and the
     headings the tabs already name. Other workspaces show every part. */
  :is([data-workspace="heating"], [data-workspace="climate"]):not([data-heating-tab="floors"]) [data-heating-tab-only="floors"],
  :is([data-workspace="heating"], [data-workspace="climate"]):not([data-heating-tab="items"]) [data-heating-tab-only="items"],
  :is([data-workspace="heating"], [data-workspace="climate"]) .panel__floor--tabbed {
    display: none;
  }
}