@import url('fonts.css');

*, *::before, *::after { box-sizing: border-box; }

html, body, #root {
  margin: 0;
  padding: 0;
  min-height: 100%;
  background: #d7d8d1;
  -webkit-text-size-adjust: 100%;
}

body {
  /* respect the notch / home indicator when running fullscreen */
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
           env(safe-area-inset-bottom) env(safe-area-inset-left);
  overscroll-behavior-y: contain;
}

button { font: inherit; -webkit-tap-highlight-color: transparent; }
input  { font: inherit; -webkit-appearance: none; border-radius: 0; }

/* --- minimal layout utilities (the handful the app actually uses) --- */
.flex            { display: flex; }
.w-full          { width: 100%; }
.text-left       { text-align: left; }
.items-center    { align-items: center; }
.items-start     { align-items: flex-start; }
.items-end       { align-items: flex-end; }
.items-baseline  { align-items: baseline; }
.justify-between { justify-content: space-between; }
.gap-2 { gap: .5rem; }  .gap-3 { gap: .75rem; }
.mb-1 { margin-bottom: .25rem; } .mb-2 { margin-bottom: .5rem; }
.mb-3 { margin-bottom: .75rem; } .mb-4 { margin-bottom: 1rem; }
.mt-4 { margin-top: 1rem; }      .mt-5 { margin-top: 1.25rem; }
.pt-2 { padding-top: .5rem; }    .pt-3 { padding-top: .75rem; }
.pt-4 { padding-top: 1rem; }     .pt-5 { padding-top: 1.25rem; }
.pb-2 { padding-bottom: .5rem; } .pb-3 { padding-bottom: .75rem; }
.px-3 { padding-left: .75rem; padding-right: .75rem; }
.px-4 { padding-left: 1rem;   padding-right: 1rem; }
.py-1 { padding-top: .25rem; padding-bottom: .25rem; }
.py-2 { padding-top: .5rem;  padding-bottom: .5rem; }
.py-3 { padding-top: .75rem; padding-bottom: .75rem; }