:root {
  --base0z: #000000;
  --base00: #1a052e;
  --base01: #351539;
  --base02: #4e2444;
  --base03: #945f65;
  --base04: #dfbea6;
  --base05: #f0d8bc;
  --base06: #fff2d4;
  --base07: #ffffef;
  --base08: #ff8754;
  --base09: #d6b104;
  --base0A: #64ca4b;
  --base0B: #00d4b2;
  --base0C: #00d1ff;
  --base0D: #00bcff;
  --base0E: #e392ff;
  --base0F: #ff6fb7;
  color-scheme: light dark;
  background-color: light-dark(var(--base05), var(--base00));
  color: light-dark(var(--base00), var(--base05));
  font-size: 2.5rem;
}

input, button
{
    font-size:1em;
    background-color:light-dark(var(--base04), var(--base01));
    color: light-dark(var(--base0z), var(--base06));
}

.name {width: 7em}
.date {width: 4em}
.value {width: 7em}

article {
    display: flex;
    justify-content: center;
}

.negative {
    color: red
}

.past {
    color: color-mix(in oklch, var(--base00) 50%, var(--base05) 50%)
}

.delete {background-color: var(--base08); width: 3.7em}
.edit {background-color: var(--base0B)}
.add {background-color: var(--base0D)}

nav ul {
    font-size: 0.6em;
    width: 100%;
    display: flex;
    justify-content: space-around;
    width: 100%;
}