diff --git a/scripts/userstyles.yml b/scripts/userstyles.yml
index 57c1872f88..5d03a5cd20 100644
--- a/scripts/userstyles.yml
+++ b/scripts/userstyles.yml
@@ -75,6 +75,7 @@ collaborators:
   - &koibtw koibtw
   - &TheAnonymousCrusher TheAnonymousCrusher
   - &42willow 42willow
+  - &scarcekoi scarcekoi
 
 userstyles:
   advent-of-code:
@@ -702,6 +703,13 @@ userstyles:
     icon: openmediavault
     color: sky
     current-maintainers: [*Gandalf-the-Blue]
+  openstreetmap:
+    name: OpenStreetMap
+    link: https://openstreetmap.org
+    categories: [development, wiki]
+    icon: openstreetmap
+    color: green
+    current-maintainers: [*scarcekoi]
   paste.rs:
     name: paste.rs
     link: https://paste.rs
diff --git a/styles/openstreetmap/catppuccin.user.less b/styles/openstreetmap/catppuccin.user.less
new file mode 100644
index 0000000000..14927358ab
--- /dev/null
+++ b/styles/openstreetmap/catppuccin.user.less
@@ -0,0 +1,655 @@
+/* ==UserStyle==
+@name OpenStreetMap Catppuccin
+@namespace github.com/catppuccin/userstyles/styles/openstreetmap
+@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/openstreetmap
+@version 2000.01.01
+@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/openstreetmap/catppuccin.user.less
+@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aopenstreetmap
+@description Soothing pastel theme for OpenStreetMap
+@author Catppuccin
+@license MIT
+
+@preprocessor less
+@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappé", "macchiato:Macchiato", "mocha:Mocha"]
+@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappé", "macchiato:Macchiato", "mocha:Mocha*"]
+@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
+==/UserStyle== */
+
+@import "https://userstyles.catppuccin.com/lib/lib.less";
+
+@-moz-document url-prefix("https://www.openstreetmap.org") {
+  :root[data-bs-theme="dark"] {
+    #catppuccin(@darkFlavor);
+  }
+  :root {
+    #catppuccin(@lightFlavor);
+  }
+
+  #catppuccin(@flavor) {
+    #lib.palette();
+    #lib.defaults();
+
+    --bs-blue: @blue;
+    --bs-indigo: darken(@mauve, 10%);
+    --bs-purple: @mauve;
+    --bs-pink: @pink;
+    --bs-red: @red;
+    --bs-orange: @peach;
+    --bs-yellow: @yellow;
+    --bs-green: @green;
+    --bs-teal: @teal;
+    --bs-cyan: @sky;
+    --bs-black: @crust;
+    --bs-white: @text;
+    --bs-primary: @accent;
+    --bs-secondary: @surface0;
+    --bs-success: @green;
+    --bs-info: @teal;
+    --bs-warning: @yellow;
+    --bs-danger: @red;
+    --bs-light: @text;
+    --bs-dark: @base;
+    --bs-primary-rgb: #lib.rgbify(@accent) [];
+    --bs-secondary-rgb: #lib.rgbify(@surface0) [];
+    --bs-success-rgb: #lib.rgbify(@green) [];
+    --bs-info-rgb: #lib.rgbify(@teal) [];
+    --bs-warning-rgb: #lib.rgbify(@yellow) [];
+    --bs-danger-rgb: #lib.rgbify(@red) [];
+    --bs-light-rgb: #lib.rgbify(@text) [];
+    --bs-dark-rgb: #lib.rgbify(@base) [];
+
+    --bs-body-color: @text;
+    --bs-body-color-rgb: #lib.rgbify(@text) [];
+    --bs-body-bg: @mantle;
+    --bs-body-bg-rgb: #lib.rgbify(@mantle) [];
+    --bs-emphasis-color: @text;
+    --bs-emphasis-color-rgb: #lib.rgbify(@text) [];
+    --bs-secondary-color: fade(@subtext1, 75%);
+    --bs-secondary-color-rgb: #lib.rgbify(@subtext1) [];
+    --bs-secondary-bg: @base;
+    --bs-secondary-bg-rgb: #lib.rgbify(@base) [];
+    --bs-tertiary-color: fade(@subtext0, 50%);
+    --bs-tertiary-color-rgb: #lib.rgbify(@subtext0) [];
+    --bs-tertiary-bg: @crust;
+    --bs-tertiary-bg-rgb: #lib.rgbify(@crust) [];
+    --bs-primary-text-emphasis: @accent;
+    --bs-secondary-text-emphasis: @subtext1;
+    --bs-success-text-emphasis: @green;
+    --bs-info-text-emphasis: @teal;
+    --bs-warning-text-emphasis: @yellow;
+    --bs-danger-text-emphasis: @red;
+    --bs-light-text-emphasis: @text;
+    --bs-dark-text-emphasis: @text;
+    --bs-primary-bg-subtle: fade(@accent, 30%);
+    --bs-secondary-bg-subtle: @crust;
+    --bs-success-bg-subtle: fade(@green, 30%);
+    --bs-info-bg-subtle: fade(@teal, 30%);
+    --bs-warning-bg-subtle: fade(@yellow, 30%);
+    --bs-danger-bg-subtle: fade(@red, 30%);
+    --bs-light-bg-subtle: fade(@text, 30%);
+    --bs-dark-bg-subtle: fade(@text, 30%);
+    --bs-primary-border-subtle: @accent;
+    --bs-secondary-border-subtle: @surface0;
+    --bs-success-border-subtle: @green;
+    --bs-info-border-subtle: @teal;
+    --bs-warning-border-subtle: @yellow;
+    --bs-danger-border-subtle: @red;
+    --bs-light-border-subtle: @text;
+    --bs-dark-border-subtle: @text;
+    --bs-black-rgb: #lib.rgbify(@crust) [];
+    --bs-white-rgb: #lib.rgbify(@text) [];
+    --bs-heading-color: inherit;
+    --bs-link-color: @blue;
+    --bs-link-color-rgb: #lib.rgbify(@blue) [];
+    --bs-link-hover-color: @sky;
+    --bs-link-hover-color-rgb: #lib.rgbify(@sky) [];
+    --bs-border-color: @surface0;
+    --bs-border-color-translucent: fade(@surface0, 15%);
+    --bs-form-valid-color: @green;
+    --bs-form-valid-border-color: @green;
+    --bs-form-invalid-color: @red;
+    --bs-form-invalid-border-color: @red;
+
+    --marker-red: @red;
+    --marker-green: @green;
+    --marker-blue: @blue;
+
+    #edit_tab .btn {
+      --bs-btn-color: @green;
+      --bs-btn-border-color: @green;
+      --bs-btn-hover-color: @base;
+      --bs-btn-hover-bg: @green;
+      --bs-btn-hover-border-color: @green;
+      --bs-btn-focus-shadow-rgb: #lib.rgbify(@green) [];
+      --bs-btn-active-color: @base;
+      --bs-btn-active-bg: @green;
+      --bs-btn-active-border-color: @green;
+      --bs-btn-disabled-color: @green;
+      --bs-btn-disabled-border-color: @green;
+    }
+
+    .btn {
+      &-primary {
+        --bs-btn-color: @base;
+        --bs-btn-bg: @accent;
+        --bs-btn-border-color: @accent;
+        --bs-btn-hover-color: @base;
+        --bs-btn-hover-bg: darken(@accent, 5%);
+        --bs-btn-hover-border-color: darken(@accent, 10%);
+        --bs-btn-focus-shadow-rgb: #lib.rgbify(@accent) [];
+        --bs-btn-active-color: @base;
+        --bs-btn-active-bg: darken(@accent, 10%);
+        --bs-btn-active-border-color: darken(@accent, 15%);
+        --bs-btn-disabled-color: @base;
+        --bs-btn-disabled-bg: @accent;
+        --bs-btn-disabled-border-color: @accent;
+      }
+
+      &-secondary {
+        --bs-btn-color: @text;
+        --bs-btn-bg: @surface0;
+        --bs-btn-border-color: @surface0;
+        --bs-btn-hover-color: @text;
+        --bs-btn-hover-bg: darken(@surface0, 5%);
+        --bs-btn-hover-border-color: darken(@surface0, 10%);
+        --bs-btn-focus-shadow-rgb: #lib.rgbify(@surface0) [];
+        --bs-btn-active-color: @text;
+        --bs-btn-active-bg: darken(@surface0, 10%);
+        --bs-btn-active-border-color: darken(@surface0, 15%);
+        --bs-btn-disabled-color: @text;
+        --bs-btn-disabled-bg: @surface0;
+        --bs-btn-disabled-border-color: @surface0;
+      }
+
+      &-danger {
+        --bs-btn-color: @base;
+        --bs-btn-bg: @red;
+        --bs-btn-border-color: @red;
+        --bs-btn-hover-color: @base;
+        --bs-btn-hover-bg: darken(@red, 5%);
+        --bs-btn-hover-border-color: darken(@red, 10%);
+        --bs-btn-focus-shadow-rgb: #lib.rgbify(@red) [];
+        --bs-btn-active-color: @base;
+        --bs-btn-active-bg: darken(@red, 10%);
+        --bs-btn-active-border-color: darken(@red, 15%);
+        --bs-btn-disabled-color: @base;
+        --bs-btn-disabled-bg: @red;
+        --bs-btn-disabled-border-color: @red;
+      }
+
+      &-outline {
+        &-primary {
+          --bs-btn-color: @accent;
+          --bs-btn-border-color: @accent;
+          --bs-btn-hover-color: @base;
+          --bs-btn-hover-bg: @accent;
+          --bs-btn-hover-border-color: @accent;
+          --bs-btn-focus-shadow-rgb: #lib.rgbify(@accent) [];
+          --bs-btn-active-color: @base;
+          --bs-btn-active-bg: @accent;
+          --bs-btn-active-border-color: @accent;
+          --bs-btn-disabled-color: @accent;
+          --bs-btn-disabled-border-color: @accent;
+        }
+
+        &-secondary {
+          --bs-btn-color: @subtext0;
+          --bs-btn-border-color: @subtext0;
+          --bs-btn-hover-color: @base;
+          --bs-btn-hover-bg: @subtext0;
+          --bs-btn-hover-border-color: @subtext0;
+          --bs-btn-focus-shadow-rgb: #lib.rgbify(@subtext0) [];
+          --bs-btn-active-color: @base;
+          --bs-btn-active-bg: @subtext0;
+          --bs-btn-active-border-color: @subtext0;
+          --bs-btn-disabled-color: @subtext0;
+          --bs-btn-disabled-border-color: @subtext0;
+        }
+
+        &-danger {
+          --bs-btn-color: @red;
+          --bs-btn-border-color: @red;
+          --bs-btn-hover-color: @base;
+          --bs-btn-hover-bg: @red;
+          --bs-btn-hover-border-color: @red;
+          --bs-btn-focus-shadow-rgb: #lib.rgbify(@red) [];
+          --bs-btn-active-color: @base;
+          --bs-btn-active-bg: @red;
+          --bs-btn-active-border-color: @red;
+          --bs-btn-disabled-color: @red;
+          --bs-btn-disabled-border-color: @red;
+        }
+      }
+    }
+
+    header nav .disabled .btn-outline-primary {
+      color: @subtext0;
+    }
+
+    header nav .dropdown-item:hover,
+    header nav #sidebar .changesets li.dropdown-item.selected,
+    #sidebar .changesets header nav li.dropdown-item.selected,
+    header nav .dropdown-item:active {
+      color: @base;
+      background-color: @accent;
+    }
+
+    .bg-success, .bg-warning, .bg-danger {
+      color: @base !important;
+    }
+
+    [fill="#7092ff"] {
+      fill: @accent;
+
+      ~ path[fill="#fff"],
+      ~ rect[fill="#fff"],
+      ~ circle[fill="#fff"] {
+        fill: @base;
+
+        &[stroke="#fff"] {
+          stroke: @base;
+        }
+      }
+    }
+
+    [stroke="#7092ff"] {
+      stroke: @accent;
+    }
+
+    circle[fill="#70cd8f"] {
+      fill: @green;
+
+      + path[fill="#fff"] {
+        fill: @base;
+      }
+    }
+
+    circle[fill="#cd7070"] {
+      fill: @red;
+
+      + path[fill="#fff"] {
+        fill: @base;
+      }
+    }
+
+    .count-number {
+      background: @surface0;
+      color: @text;
+    }
+
+    .changeset_line {
+      .bg-success {
+        background-color: @green !important;
+      }
+      .bg-warning {
+        background-color: @yellow !important;
+      }
+      .bg-danger {
+        background-color: @red !important;
+      }
+    }
+
+    .describe_location:hover {
+      color: @base !important;
+    }
+
+    .donate-attr {
+      color: @green !important;
+    }
+
+    .form-check-input:checked {
+      background-color: @accent;
+      border-color: @accent;
+
+      &[type="checkbox"] {
+        @svg: escape('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="none" stroke="@{base}" stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="m6 10 3 3 6-6"/></svg>');
+        --bs-form-check-bg-image: url("data:image/svg+xml,@{svg}");
+      }
+    }
+
+    .heatmap [data-date] {
+      background-color: @surface0;
+
+      span {
+        background-color: @green;
+      }
+    }
+
+    i.bi.bi-rss-fill {
+      color: @peach;
+      background-color: @base;
+    }
+
+    .leaflet-control .control-button {
+      color: @text;
+      background-color: fade(@crust, 60%);
+    }
+
+    .site-about {
+      svg[stroke="#c0c0c0"], circle[stroke="#c0c0c0"] {
+        stroke: @text;
+      }
+
+      path[fill="#c0c0c0"] {
+        fill: @text;
+      }
+
+      #content .attr {
+        h1 span {
+          color: @green;
+        }
+
+        .byosm {
+          background-color: @green;
+
+          .text-white {
+            color: @base !important;
+          }
+        }
+      }
+    }
+
+    .text-secondary {
+      color: @subtext0 !important;
+    }
+
+    .text-body-secondary a {
+      color: darken(@blue, 5%);
+    }
+  }
+}
+
+@-moz-document url-prefix("https://www.openstreetmap.org") {
+  :root .ideditor.theme-dark {
+    #catppuccin(@darkFlavor);
+  }
+  :root .ideditor.theme-light {
+    #catppuccin(@lightFlavor);
+  }
+
+  #catppuccin(@flavor) {
+    #lib.palette();
+    #lib.defaults();
+
+    --bg-color: @mantle;
+    --bg-color-2: @base;
+    --bg-color-3: @surface0;
+    --active-bg-color: @surface0;
+    --passive-bg-color: mix(@surface0, @base, 25%);
+    --passive-text-color: @subtext0;
+    --transparent-bg-color: fade(@crust, 80%);
+    --transparent-button-color: fade(@mantle, 53%);
+    --border-color: @surface1;
+    --transparent-border-color: fade(@surface1, 58%);
+    --border-color-2: @surface0;
+    --outset-color: @surface0;
+    --shadow-color: @surface1;
+    --text-color: @text;
+    --link-color: @accent;
+    --link-focus-color: darken(@accent, 5%);
+    --muted-text-color: @overlay0;
+    --transparent-text-color: fade(@subtext0, 20%);
+    --transparent-text-emphasis-color: fade(@text, 47%);
+    --widget-color: @text;
+    --widget-bg-color: fade(@mantle, @red, 99%);
+    --nested-bg-color: @crust;
+    --nested-highlight-color: @mantle;
+    --nested-border-color: @surface0;
+    --selected-bg-color: mix(@surface0, @accent, 95%);
+    --dark-tooltip-text-color: @subtext0;
+    --dark-tooltip-bg-color: @crust;
+    --valid-bg-color: fade(@green, 30%);
+    --valid-label-color: fade(@green, 25%);
+    --valid-highlight-color: fade(@green, 35%);
+    --valid-border-color: @green;
+    --valid-text-color: @green;
+    --valid-highlight-text-color: @green;
+    --valid-icon-color: @green;
+    --suggestion-bg-color: fade(@accent, 30%);
+    --suggestion-label-color: fade(@accent, 25%);
+    --suggestion-highlight-color: fade(@accent, 35%);
+    --suggestion-border-color: @blue;
+    --suggestion-text-color: @blue;
+    --suggestion-highlight-text-color: @blue;
+    --suggestion-icon-color: @blue;
+    --warning-bg-color: fade(@peach, 30%);
+    --warning-label-color: fade(@peach, 25%);
+    --warning-highlight-color: fade(@peach, 35%);
+    --warning-border-color: @peach;
+    --warning-text-color: @peach;
+    --warning-highlight-text-color: @peach;
+    --warning-icon-color: @peach;
+    --error-bg-color: fade(@red, 30%);
+    --error-label-color: fade(@red, 25%);
+    --error-highlight-color: fade(@red, 35%);
+    --error-border-color: @red;
+    --error-text-color: @red;
+    --error-highlight-text-color: @red;
+    --error-icon-color: @red;
+
+    .add-row button {
+      background-color: @crust;
+
+      &:hover {
+        background-color: @surface0;
+      }
+    }
+
+    .bar-button {
+      &.active {
+        svg.icon, .label .localized-text {
+          color: @base !important;
+        }
+      }
+
+      .popover .tooltip-text .localized-text,
+      .popover .keyhint-wrap .localized-text {
+        color: @text;
+      }
+    }
+
+    button {
+      &.raw-tag-option {
+        &:hover {
+          color: @base;
+        }
+
+        &:not(.selected, :hover) {
+          color: @subtext0;
+        }
+      }
+
+      :not(.tooltip-text) {
+        &.action .localized-text,
+        &.active .localized-text,
+        &.next .localized-text,
+        &.finished,
+        :not(.change-type) &:hover {
+          color: @base;
+        }
+      }
+
+      &.action.button.save-button .label .localized-text {
+        color: @base;
+      }
+
+      &.disabled .localized-text {
+        color: @subtext0 !important;
+      }
+
+      &.save {
+        color: @base;
+
+        &.disabled {
+          color: var(--transparent-text-emphasis-color);
+        }
+
+        /*
+        &[style^="--accent-color: rgba(255, 1"] {
+          --accent-color: @red !important;
+        }
+
+        &[style^="--accent-color: rgba(255, 17"] {
+          --accent-color: mix(@red, @yellow, 75%) !important;
+        }
+
+        &[style^="--accent-color: rgba(255, 15"] {
+          --accent-color: mix(@red, @yellow, 50%) !important;
+        }
+
+        &[style^="--accent-color: rgba(255, 12"] {
+          --accent-color: mix(@red, @yellow, 25%) !important;
+        }
+
+        &[style^="--accent-color: rgba(255, 2"] {
+          --accent-color: @yellow !important;
+        }
+
+        &[style^="--accent-color: rgba(0"] {
+          --accent-color: @green !important;
+        }
+        */
+      }
+
+      &.action:not([disabled="true"]) {
+        color: @base;
+      }
+    }
+
+    code {
+      background-color: fade(@text, 25%);
+    }
+
+    .curtain-darkness {
+      fill: @base;
+    }
+
+    .feature-warning a.chip {
+      background-color: @blue;
+    }
+
+    .fillD {
+      color: @text;
+      background-color: fade(@crust, 75%);
+
+      &2 {
+        color: @text;
+        background-color: fade(@crust, 75%);
+
+        &.panel-container .panel-title .localized-text {
+          color: @yellow;
+        }
+      }
+    }
+
+    .form-field-comment:not(.present) {
+      .field-label {
+        background-color: @surface0;
+      }
+
+      .field-label, textarea {
+        border-color: @surface2;
+      }
+    }
+
+    .icon.operation use {
+      color: @accent;
+    }
+
+    button.disabled .icon.operation use {
+      fill: @surface1;
+      color: @surface1;
+    }
+
+    .icon {
+      &.created {
+        color: @green;
+      }
+      &.modified {
+        color: @overlay0;
+      }
+      &.deleted {
+        color: @red;
+      }
+
+      &.light {
+        color: @text;
+      }
+    }
+
+    .intro-nav-wrap {
+      .intro-nav-wrap-logo {
+        color: @text;
+      }
+
+      button.chapter {
+        &.active, &.next, &.finished {
+          color: @base;
+        }
+
+        &.finished {
+          background-color: @green;
+        }
+      }
+    }
+
+    .issues-info a.chip {
+      &.resolved-count {
+        background-color: @green;
+      }
+
+      &.warnings-count {
+        background-color: @peach;
+      }
+    }
+
+    .joined > * {
+      border-right-color: fade(@crust, 50%);
+    }
+
+    li.issue-fix-item button:not(.actionable) .fix-icon {
+      color: @overlay2;
+      fill: @overlay2;
+    }
+
+    .map-control {
+      > button {
+        background-color: fade(@crust, 50%);
+
+        &.active {
+          background-color: @accent;
+
+          svg.icon.light {
+            color: @base;
+          }
+        }
+      }
+
+      svg.icon.light {
+        color: @text;
+      }
+    }
+
+    .map-footer-list a.chip {
+      color: @base;
+    }
+
+    .panel-content .button {
+      color: @base;
+    }
+
+    .restriction-help .qualifier {
+      color: @overlay0
+    }
+
+    .scale-block {
+      .scale-text {
+        color: @subtext0;
+      }
+
+      .scale path {
+        stroke: @subtext0;
+      }
+    }
+  }
+}