@layer
  pico 
, variables
, layout
, spacing
, colors
, misc
, button
, canvas
, note
, pill
, hotwire-native;

@import url("/assets/vendor/pico-d7784f3a.css") layer(pico);
@import url("/assets/base/variables-a1d32077.css") layer(variables);
@import url("/assets/base/layout-890192bb.css") layer(layout);

@import url("/assets/utilities/spacing-fe089c19.css") layer(spacing);
@import url("/assets/utilities/colors-122d4936.css") layer(colors);
@import url("/assets/utilities/misc-4822e04c.css") layer(misc);

@import url("/assets/components/button-96376452.css") layer(button);
@import url("/assets/components/canvas-0b759538.css") layer(canvas);
@import url("/assets/components/note-b60e36aa.css") layer(note);

@import url("/assets/utilities/pill-e42d2f40.css") layer(pill);
@import url("/assets/utilities/hotwire-native-ed8476f2.css") layer(hotwire-native);

.hidden {
  display: none;
}

.foo {
  opacity: 0.03;
  padding-bottom: 10px;
}

.bar {
  opacity: 0.04;
  padding-bottom: 10px;
}

.baz {
  opacity: 0.4;
  padding-bottom: 10px;
}

span {
  color: lightgrey; 
  font-size: 1.5em; 
  font-style: italic;
  opacity: 0.4;
  
}

main {
  padding: 0 !important;
}

body {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  margin: 0;
}

a {
  text-decoration: none;
  white-space: nowrap;
}

.selected {
  background-color: lightyellow;
}

[id^="note_"] {
  cursor: pointer;  
  cursor: default;  
}

.settings {
  margin: 0 0.5rem;
}