routie dev init since i didn't adhere to any proper guidance up until now

frontend/node_modules/vuetify/lib/styles/generic/_animations.scss

@@ -0,0 +1,17 @@
+@use '../tools';
+
+@include tools.layer('transitions') {
+  @keyframes v-shake {
+    59% {
+      margin-left: 0;
+    }
+
+    60%, 80% {
+      margin-left: 2px;
+    }
+
+    70%, 90% {
+      margin-left: -2px;
+    }
+  }
+}

frontend/node_modules/vuetify/lib/styles/generic/_colors.scss

@@ -0,0 +1,81 @@
+@use 'sass:map';
+@use '../settings';
+@use '../settings/colors';
+@use '../tools';
+@use '../tools/functions' as *;
+
+@mixin background-color($color_value) {
+  & {
+    background-color: $color_value;
+  }
+}
+@mixin text-color($color_value) {
+  & {
+    color: $color_value;
+  }
+}
+@mixin background-text-color($color_name, $color_type) {
+  $map_value: map-deep-get(colors.$text-on-colors, $color_name, $color_type);
+
+  & {
+    color: $map_value;
+  }
+}
+
+@if (settings.$color-pack) {
+  @include tools.layer('utilities.theme-background') {
+    @each $color_name, $color_value in colors.$shades {
+      .bg-#{$color_name} {
+        @include background-color($color_value);
+
+        @if (map.has-key(colors.$text-on-colors, 'shades')) {
+          @include background-text-color('shades', $color_name);
+        }
+      }
+    }
+
+    @each $color_name, $color_color in colors.$colors {
+      @each $color_type, $color_value in $color_color {
+        @if ($color_type == 'base') {
+          .bg-#{$color_name} {
+            @include background-color($color_value);
+
+            @if (map.has-key(colors.$text-on-colors, $color_name)) {
+              @include background-text-color($color_name, $color_type);
+            }
+          }
+        } @else if ($color_type != 'shades') {
+          .bg-#{$color_name}-#{$color_type} {
+            @include background-color($color_value);
+
+            @if (map.has-key(colors.$text-on-colors, $color_name)) {
+              @include background-text-color($color_name, $color_type);
+            }
+          }
+        }
+      }
+    }
+  }
+
+  @include tools.layer('utilities.theme-foreground') {
+    @each $color_name, $color_value in colors.$shades {
+      .text-#{$color_name} {
+        @include text-color($color_value);
+      }
+    }
+
+    @each $color_name, $color_color in colors.$colors {
+      @each $color_type, $color_value in $color_color {
+        @if ($color_type == 'base') {
+          .text-#{$color_name} {
+            @include text-color($color_value);
+          }
+        } @else if ($color_type != 'shades') {
+          .text-#{$color_name}-#{$color_type} {
+            @include text-color($color_value);
+          }
+        }
+      }
+    }
+  }
+}

frontend/node_modules/vuetify/lib/styles/generic/_index.scss

@@ -0,0 +1,7 @@
+@use './layers';
+@use './animations';
+@use './theme';
+@use './colors';
+@use './reset';
+@use './transitions';
+@use './rtl';

frontend/node_modules/vuetify/lib/styles/generic/_layers.scss

@@ -0,0 +1,24 @@
+@use '../settings';
+
+@layer vuetify-core {
+  @layer reset, base;
+}
+
+@layer vuetify-components;
+
+// Contextual styles for nested components
+// This replaces hacks like .v-btn.v-btn and most of !important
+@layer vuetify-overrides;
+
+@layer vuetify-utilities {
+  @layer theme-base;
+  @layer typography;
+  @layer helpers;
+  @layer theme-background;
+  @layer theme-foreground;
+}
+
+// Rules that need to override theme or utils
+@layer vuetify-final {
+  @layer transitions, trumps;
+};

frontend/node_modules/vuetify/lib/styles/generic/_reset.scss

@@ -0,0 +1,96 @@
+@use '../settings';
+@use '../tools';
+
+@if (settings.$reset) {
+  @include tools.layer('core.reset') {
+    html {
+      box-sizing: border-box;
+      /* Prevent adjustments of font size after orientation changes in iOS */
+      -webkit-text-size-adjust: 100%;
+      tab-size: 4;
+      margin: 0;
+    }
+
+    body {
+      margin: 0;
+    }
+
+    *,
+    ::before,
+    ::after {
+      background-repeat: no-repeat;
+      box-sizing: inherit;
+    }
+
+    ::before,
+    ::after {
+      text-decoration: inherit;
+      vertical-align: inherit;
+    }
+
+
+    input {
+      border-radius: 0;
+    }
+
+    /* Replace pointer cursor in disabled elements */
+    [disabled] {
+      cursor: default;
+    }
+
+    [type="number"]::-webkit-inner-spin-button,
+    [type="number"]::-webkit-outer-spin-button {
+      /* Correct the cursor style of increment and decrement buttons in Chrome */
+      height: auto;
+    }
+
+    [type="search"] {
+      -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */
+      outline-offset: -2px; /* Correct the outline style in Safari */
+    }
+
+    [type="search"]::-webkit-search-cancel-button,
+    [type="search"]::-webkit-search-decoration {
+      /* Remove the inner padding in Chrome and Safari on macOS */
+      -webkit-appearance: none;
+    }
+
+    button,
+    input,
+    optgroup,
+    select,
+    textarea {
+      font: inherit;
+    }
+
+    optgroup {
+      /* Restore the font weight unset by the previous rule */
+      font-weight: bold;
+    }
+
+    /* Apply cursor pointer to button elements */
+    button,
+    [type="button"],
+    [type="reset"],
+    [type="submit"],
+    [role="button"] {
+      cursor: pointer;
+      color: inherit;
+    }
+
+    /* Specify the progress cursor of updating elements */
+    [aria-busy="true"] {
+      cursor: progress;
+    }
+
+    /* Specify the pointer cursor of trigger elements */
+    [aria-controls] {
+      cursor: pointer;
+    }
+
+    /* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
+    [aria-disabled="true"] {
+      cursor: default;
+    }
+  }
+}

frontend/node_modules/vuetify/lib/styles/generic/_rtl.scss

@@ -0,0 +1,13 @@
+@use '../tools';
+
+@include tools.layer('core.base') {
+  .v-locale {
+    &--is-rtl {
+      direction: rtl;
+    }
+
+    &--is-ltr {
+      direction: ltr;
+    }
+  }
+}

frontend/node_modules/vuetify/lib/styles/generic/_theme.scss

@@ -0,0 +1,10 @@
+@use '../tools';
+
+@include tools.layer('utilities.theme-base') {
+  .v-theme-on-light {
+    color: rgb(var(--v-theme-on-light));
+  }
+  .v-theme-on-dark {
+    color: rgb(var(--v-theme-on-dark));
+  }
+}

frontend/node_modules/vuetify/lib/styles/generic/_transitions.scss

@@ -0,0 +1,378 @@
+@use '../settings';
+@use '../tools';
+
+@mixin transition-default() {
+  &-enter-active {
+    transition-duration: settings.$transition-duration-root;
+    transition-timing-function: settings.$standard-easing;
+  }
+
+  &-leave-active {
+    transition-duration: settings.$transition-duration-root;
+    transition-timing-function: settings.$standard-easing;
+  }
+
+  &-move {
+    transition-duration: settings.$transition-move-duration-root;
+    transition-property: transform;
+    transition-timing-function: settings.$standard-easing;
+  }
+}
+@mixin fade-out() {
+  &-leave-to {
+    opacity: 0;
+  }
+  &-leave-active {
+    transition-duration: 100ms;
+  }
+}
+
+@include tools.layer('transitions') {
+  @media (prefers-reduced-motion: no-preference) {
+    // Component specific transitions
+    .dialog-transition,
+    .dialog-bottom-transition,
+    .dialog-top-transition {
+      &-enter-active {
+        transition-duration: 225ms;
+        transition-timing-function: settings.$decelerated-easing;
+      }
+
+      &-leave-active {
+        transition-duration: 125ms;
+        transition-timing-function: settings.$accelerated-easing;
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+        pointer-events: none;
+      }
+    }
+
+    .dialog-transition {
+      &-enter-from, &-leave-to {
+        transform: scale(0.9);
+        opacity: 0;
+      }
+
+      &-enter-to, &-leave-from {
+        opacity: 1;
+      }
+    }
+
+    .dialog-bottom-transition {
+      &-enter-from, &-leave-to {
+        transform: translateY(calc(50vh + 50%));
+      }
+    }
+
+    .dialog-top-transition {
+      &-enter-from, &-leave-to {
+        transform: translateY(calc(-50vh - 50%));
+      }
+    }
+
+    .picker-transition,
+    .picker-reverse-transition {
+      @include transition-default();
+
+      &-enter-from,
+      &-leave-to {
+        opacity: 0;
+      }
+
+      &-leave-from,
+      &-leave-active,
+      &-leave-to {
+        position: absolute;
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .picker-transition {
+      @include transition-default();
+
+      &-enter-from {
+        transform: translate(100%, 0);
+      }
+
+      &-leave-to {
+        transform: translate(-100%, 0);
+      }
+    }
+
+    .picker-reverse-transition {
+      @include transition-default();
+
+      &-enter-from {
+        transform: translate(-100%, 0);
+      }
+
+      &-leave-to {
+        transform: translate(100%, 0);
+      }
+    }
+
+    // Generic transitions
+    .expand-transition {
+      @include transition-default();
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: height;
+      }
+    }
+
+    .expand-x-transition {
+      @include transition-default();
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: width;
+      }
+    }
+
+    .expand-both-transition {
+      @include transition-default();
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: height, width !important;
+      }
+    }
+
+    .scale-transition {
+      @include transition-default();
+      @include fade-out();
+
+      &-enter-from {
+        opacity: 0;
+        transform: scale(0);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .scale-rotate-transition {
+      @include transition-default();
+      @include fade-out();
+
+      &-enter-from {
+        opacity: 0;
+        transform: scale(0) rotate(-45deg);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .scale-rotate-reverse-transition {
+      @include transition-default();
+      @include fade-out();
+
+      &-enter-from {
+        opacity: 0;
+        transform: scale(0) rotate(45deg);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .message-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+        transform: translateY(-15px);
+      }
+
+      &-leave-from, &-leave-active {
+        position: absolute;
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .slide-y-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+        transform: translateY(-15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .slide-y-reverse-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+        transform: translateY(15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .scroll-y-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+      }
+
+      &-enter-from {
+        transform: translateY(-15px);
+      }
+
+      &-leave-to {
+        transform: translateY(15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .scroll-y-reverse-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+      }
+
+      &-enter-from {
+        transform: translateY(15px);
+      }
+
+      &-leave-to {
+        transform: translateY(-15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .scroll-x-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+      }
+
+      &-enter-from {
+        transform: translateX(-15px);
+      }
+
+      &-leave-to {
+        transform: translateX(15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .scroll-x-reverse-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+      }
+
+      &-enter-from {
+        transform: translateX(15px);
+      }
+
+      &-leave-to {
+        transform: translateX(-15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .slide-x-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+        transform: translateX(-15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .slide-x-reverse-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+        transform: translateX(15px);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform, opacity;
+      }
+    }
+
+    .fade-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        opacity: 0;
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: opacity;
+      }
+    }
+
+    .fab-transition {
+      @include transition-default();
+
+      &-enter-from, &-leave-to {
+        transform: scale(0) rotate(-45deg);
+      }
+
+      &-enter-active,
+      &-leave-active {
+        transition-property: transform;
+      }
+    }
+  }
+}