/* apps/web/browser/styles.css */
:root {
  --buncss-light: initial;
  --buncss-dark: ;
  color-scheme: light dark;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  line-height: 1.5;
}

@media (prefers-color-scheme: dark) {
  :root {
    --buncss-light: ;
    --buncss-dark: initial;
  }
}

body {
  margin: 0;
}

main {
  max-width: 60rem;
  margin-inline-start: auto;
  margin-inline-end: auto;
  padding: 1rem;
}

nav, form, fieldset, section {
  margin-block-start: 1rem;
  margin-block-end: 1rem;
}

nav, form, fieldset {
  display: grid;
  gap: .75rem;
}

nav {
  grid-auto-flow: column;
  justify-content: start;
}

label {
  display: grid;
  gap: .25rem;
}

button, input, select {
  font: inherit;
}

button, a, input, select {
  outline-offset: .2rem;
}

:focus-visible {
  outline: .2rem solid;
}

img, video, canvas {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

[role="alert"] {
  border-inline-start: .25rem solid;
  padding-inline-start: .75rem;
}

@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after {
    animation-duration: .01ms;
    animation-iteration-count: 1;
    transition-duration: .01ms;
  }
}
