/* projects/mdef-game/src/styles.scss */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
}
main {
  display: block;
}
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}
pre {
  font-family: monospace, monospace;
  font-size: 1em;
}
a {
  background-color: transparent;
}
abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}
b,
strong {
  font-weight: bolder;
}
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
img {
  border-style: none;
}
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}
button,
input {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
fieldset {
  padding: 0.35em 0.75em 0.625em;
}
legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}
progress {
  vertical-align: baseline;
}
textarea {
  overflow: auto;
}
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  padding: 0;
}
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}
[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}
details {
  display: block;
}
summary {
  display: list-item;
}
template {
  display: none;
}
[hidden] {
  display: none;
}
:root {
  --color-blue-dark: #0F1B29;
  --color-grey: #303030;
  --color-orange: #FF7F00;
  --color-gradient-orange:
    linear-gradient(
      180deg,
      #FF9D3C 35.5%,
      #FF7F00 100%);
  --color-gradient-silver:
    linear-gradient(
      180deg,
      #FFFFFF 35.5%,
      #6E7B90 100%,
      #98A5B9 100%);
  --bg-color-dark: var(--color-black);
  --text-color-light: var(--color-white);
  --spacing-190: 19rem;
}
html,
body {
  --body-bg: var(--bg-color-dark);
  block-size: 100%;
  color: var(--text-color-light);
}

/* node_modules/@angular/cdk/overlay-prebuilt.css */
.cdk-overlay-container,
.cdk-global-overlay-wrapper {
  pointer-events: none;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.cdk-overlay-container {
  position: fixed;
  z-index: 1000;
}
.cdk-overlay-container:empty {
  display: none;
}
.cdk-global-overlay-wrapper {
  display: flex;
  position: absolute;
  z-index: 1000;
}
.cdk-overlay-pane {
  position: absolute;
  pointer-events: auto;
  box-sizing: border-box;
  display: flex;
  max-width: 100%;
  max-height: 100%;
  z-index: 1000;
}
.cdk-overlay-backdrop {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  pointer-events: auto;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  opacity: 0;
  touch-action: manipulation;
  z-index: 1000;
  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
}
@media (prefers-reduced-motion) {
  .cdk-overlay-backdrop {
    transition-duration: 1ms;
  }
}
.cdk-overlay-backdrop-showing {
  opacity: 1;
}
@media (forced-colors: active) {
  .cdk-overlay-backdrop-showing {
    opacity: .6;
  }
}
.cdk-overlay-dark-backdrop {
  background: rgba(0, 0, 0, .32);
}
.cdk-overlay-transparent-backdrop {
  transition: visibility 1ms linear, opacity 1ms linear;
  visibility: hidden;
  opacity: 1;
}
.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,
.cdk-high-contrast-active .cdk-overlay-transparent-backdrop {
  opacity: 0;
  visibility: visible;
}
.cdk-overlay-backdrop-noop-animation {
  transition: none;
}
.cdk-overlay-connected-position-bounding-box {
  position: absolute;
  display: flex;
  flex-direction: column;
  min-width: 1px;
  min-height: 1px;
  z-index: 1000;
}
.cdk-global-scrollblock {
  position: fixed;
  width: 100%;
  overflow-y: scroll;
}

/* library/component-library/src/lib/styles-mdef/styles.scss */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
}
main {
  display: block;
}
h1 {
  margin-block: 0.67em;
  margin-inline: 0;
  font-size: 2em;
}
hr {
  box-sizing: content-box;
  block-size: 0;
  overflow: visible;
}
pre {
  font-family: monospace;
  font-size: 1em;
}
a {
  background-color: transparent;
}
abbr[title] {
  border-block-end: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}
b,
strong {
  font-weight: 700;
}
code,
kbd,
samp {
  font-family: monospace;
  font-size: 1em;
}
small {
  font-size: 80%;
}
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sub {
  inset-block-end: -0.25em;
}
sup {
  inset-block-start: -0.5em;
}
img {
  display: block;
  border-style: none;
}
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
}
button,
input {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
:where(button, [type=button], [type=reset], [type=submit]) {
  -webkit-appearance: button;
}
:where(button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner) {
  padding: 0;
  border-style: none;
}
:where(button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring) {
  outline: 1px dotted ButtonText;
}
fieldset {
  margin: 0;
  padding-block: 0;
  padding-inline: 0;
  border: 0;
}
legend {
  display: table;
  box-sizing: border-box;
  max-inline-size: 100%;
  padding: 0;
  color: inherit;
  white-space: normal;
}
progress {
  vertical-align: baseline;
}
textarea {
  overflow: auto;
}
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  padding: 0;
}
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  block-size: auto;
}
[type=search] {
  outline-offset: -2px;
  -webkit-appearance: textfield;
}
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}
details {
  display: block;
}
summary {
  display: list-item;
}
template {
  display: none;
}
[hidden] {
  display: none;
}
p {
  margin: 0;
}
html.mdef:root {
  --color-primary-50: #E6E8EB;
  --color-primary-200: #D4D7DD;
  --color-primary-700: #2A4C74;
  --color-primary-800: #142538;
  --color-primary-900: #0F1B29;
  --color-secondary-800: #FF8A16;
  --color-secondary-900: #FF7F00;
  --color-tertiary-50: #F9FAFA;
  --color-surface-50: #F4F5F6;
  --color-surface-100: #F1F2F4;
  --color-surface-200: #E5EDF5;
  --color-surface-300: #4360A3;
  --color-surface-400: #344A7E;
  --color-surface-500: #25355A;
  --color-surface-600: #162036;
  --color-surface-700: #111322;
  --color-surface-800: #0A0E17;
  --color-surface-900: #070A11;
  --color-font-50: #FAFAFA;
  --color-font-100: #F5F5F5;
  --color-font-200: #EFEFEF;
  --color-font-300: #E1E1E1;
  --color-font-400: #BEBEBE;
  --color-font-700: #7E889A;
  --color-font-800: #5A6C77;
  --color-font-900: #181D20;
  --color-state-green-50: #A2E6BA;
  --color-state-green-100: #DFF6E7;
  --color-state-green-200: #CBF1D7;
  --color-state-green-300: #B7EBC9;
  --color-state-green-400: #7ADB9B;
  --color-state-green-500: #3ECB6E;
  --color-state-green-600: #2DA957;
  --color-state-green-700: #238143;
  --color-state-green-800: #1D6C38;
  --color-state-green-900: #18582E;
  --color-state-yellow-50: #FFF4CC;
  --color-state-yellow-100: #FFEEB3;
  --color-state-yellow-200: #FFE999;
  --color-state-yellow-300: #FFE380;
  --color-state-yellow-400: #FFDE66;
  --color-state-yellow-500: #FFD84D;
  --color-state-yellow-600: #FFD333;
  --color-state-yellow-700: #FFCD1A;
  --color-state-yellow-800: #FFC800;
  --color-state-yellow-900: #E5B400;
  --color-state-yellow-950: #4D3C00;
  --color-state-red-50: #FBEBEB;
  --color-state-red-100: #F5D5D5;
  --color-state-red-200: #F1C1C1;
  --color-state-red-300: #ECABAB;
  --color-state-red-400: #E69696;
  --color-state-red-500: #E28282;
  --color-state-red-600: #DE6D6D;
  --color-state-red-700: #E30000;
  --color-state-red-800: #BB2B2B;
  --color-state-red-900: #7D1C1C;
  --color-white: #FFF;
  --color-black: #000;
  --color-text-error: #FF0000;
  --color-gradient-silver:
    linear-gradient(
      180deg,
      #FFFFFF 35.5%,
      #6E7B90 100%,
      #98A5B9 100%);
  --color-gradient-orange:
    linear-gradient(
      180deg,
      #FF9D3C 35.5%,
      #FF7F00 100%);
  --main-font-stack:
    "Rijksoverheid-sans",
    -apple-system,
    blinkmacsystemfont,
    "Segoe UI",
    roboto,
    oxygen-sans,
    ubuntu,
    cantarell,
    "Helvetica Neue",
    sans-serif;
  --heading-font-stack:
    "PT Sans",
    -apple-system,
    blinkmacsystemfont,
    "Segoe UI",
    roboto,
    oxygen-sans,
    ubuntu,
    cantarell,
    "Helvetica Neue",
    sans-serif;
  --text-xs: 1.2rem;
  --text-sm: 1.4rem;
  --text-base: 1.6rem;
  --text-lg: 1.8rem;
  --text-xl: 2rem;
  --text-2xl: 2.4rem;
  --text-3xl: 2.8rem;
  --text-4xl: 3.6rem;
  --text-5xl: 5.2rem;
  --text-6xl: 5.8rem;
  --text-7xl: 6.4rem;
  --text-8xl: 8.8rem;
  --text-9xl: 9.6rem;
  --font-light: 300;
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-extrabold: 800;
  --font-black: 900;
  --font-base: var(--font-normal);
  --leading-h1: 1.15;
  --leading-base: 1.6;
  --spacing-4: 0.4rem;
  --spacing-6: 0.6rem;
  --spacing-8: 0.8rem;
  --spacing-10: 1rem;
  --spacing-12: 1.2rem;
  --spacing-16: 1.6rem;
  --spacing-20: 2rem;
  --spacing-24: 2.4rem;
  --spacing-32: 3.2rem;
  --spacing-40: 4rem;
  --spacing-48: 4.8rem;
  --spacing-56: 5.6rem;
  --spacing-64: 6.4rem;
  --spacing-72: 7.2rem;
  --spacing-80: 8rem;
  --spacing-96: 9.6rem;
  --rounded: var(--rounded-4);
  --rounded-4: 0.4rem;
  --rounded-6: 0.6rem;
  --rounded-8: 0.8rem;
  --rounded-16: 1.6rem;
  --rounded-24: 2.4rem;
  --rounded-48: 4.8rem;
  --max-container-width: 1180px;
  --outer-margin: 2rem;
  --color-border: initial;
  --color-border-light: initial;
  --color-outline: initial;
  --main-text-color: var(--color-font-900);
  --main-text-size: var(--text-base);
  --color-error: initial;
  --base-selection-bgcolor: var(--color-black);
  --base-select-textcolor: var(--color-white);
}
.sr-only {
  position: absolute;
  block-size: 1px;
  inline-size: 1px;
  padding: 0;
  clip: rect(1px, 1px, 1px, 1px);
  border: 0;
  overflow: hidden;
}
.sr-only.focusable:focus {
  block-size: auto;
  inline-size: auto;
  clip: auto;
}
.line-clamp-1 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.max-w-50ch {
  max-inline-size: 50ch;
}
.block-link-overlay::after {
  position: absolute;
  inset: 0;
  content: "";
  z-index: 1;
}
.block-link-overlay:hover {
  cursor: pointer;
}
.span-1 {
  grid-column: 1/-1;
}
@media (width >= 1024px) {
  .span-1 {
    grid-column: span 1;
  }
}
.span-2 {
  grid-column: 1/-1;
}
@media (width >= 1024px) {
  .span-2 {
    grid-column: span 2;
  }
}
.span-3 {
  grid-column: 1/-1;
}
@media (width >= 1024px) {
  .span-3 {
    grid-column: span 3;
  }
}
.span-4 {
  grid-column: 1/-1;
}
@media (width >= 1024px) {
  .span-4 {
    grid-column: span 4;
  }
}
.span-5 {
  grid-column: 1/-1;
}
@media (width >= 1024px) {
  .span-5 {
    grid-column: span 5;
  }
}
.span-6 {
  grid-column: 1/-1;
}
@media (width >= 1024px) {
  .span-6 {
    grid-column: span 6;
  }
}
@font-face {
  font-family: "Rijksoverheid-sans";
  font-style: normal;
  font-weight: 400;
  src: local(""), url("./media/rijksoverheid-sans-regular.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "Rijksoverheid-sans";
  font-style: normal;
  font-weight: 700;
  src: local(""), url("./media/rijksoverheid-sans-bold.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-display: swap;
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 400;
  src: url("./media/PTSans-Regular-subset.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 600;
  src: url("./media/PTSans-Bold-subset.woff2") format("woff2");
}
::selection {
  background-color: var(--base-selection-bgcolor);
  color: var(--base-select-textcolor, #000);
}
html {
  box-sizing: border-box;
  font-size: 62.5%;
}
*,
*::before,
*::after {
  box-sizing: inherit;
}
html.mdef body {
  position: absolute;
  inset: 0;
  background-color: var(--body-bg, var(--color-surface-50));
  color: var(--main-text-color, #000);
  font-family: var(--main-font-stack);
  font-size: var(--main-text-size, 1.6rem);
  -webkit-font-smoothing: antialiased;
  font-weight: var(--font-base, 1.6rem);
  line-height: var(--leading-base, 1.5);
}
.cdk-overlay-dark-backdrop {
  background: var(--cdk-overlay-backdrop, rgba(98, 97, 137, 0.75));
}
html.mdef:root {
  --account-avatar-text-color: var(--color-font-900);
  --account-avatar-color: var(--color-font-900);
  --account-avatar-outline-color: var(--color-primary-50);
  --account-avatar-bg: var(--color-primary-50);
  --breadcrumb-current-item-color: var(--color-font-700);
  --breadcrumb-item-color: #3B4044;
  --breadcrumb-separator-color: var(--color-font-700);
  --breadcrumb-border-color: var(--color-surface-200);
  --slider-on-bg: var(--color-state-green-700);
  --slider-bg: var(--color-font-700);
  --slider-outline-color-focus: rgb(15 27 41 / 20%);
  --form-control-border-color: var(--color-surface-600);
  --form-control-box-shadow-focus: rgb(15 27 41 / 20%);
  --form-control-border-radius: 0.2rem;
  --form-control-bg: var(--color-surface-50);
}

/* library/component-library/src/lib/styles-mdef/_variables.scss */
html.mdef:root {
  --color-primary-50: #E6E8EB;
  --color-primary-200: #D4D7DD;
  --color-primary-700: #2A4C74;
  --color-primary-800: #142538;
  --color-primary-900: #0F1B29;
  --color-secondary-800: #FF8A16;
  --color-secondary-900: #FF7F00;
  --color-tertiary-50: #F9FAFA;
  --color-surface-50: #F4F5F6;
  --color-surface-100: #F1F2F4;
  --color-surface-200: #E5EDF5;
  --color-surface-300: #4360A3;
  --color-surface-400: #344A7E;
  --color-surface-500: #25355A;
  --color-surface-600: #162036;
  --color-surface-700: #111322;
  --color-surface-800: #0A0E17;
  --color-surface-900: #070A11;
  --color-font-50: #FAFAFA;
  --color-font-100: #F5F5F5;
  --color-font-200: #EFEFEF;
  --color-font-300: #E1E1E1;
  --color-font-400: #BEBEBE;
  --color-font-700: #7E889A;
  --color-font-800: #5A6C77;
  --color-font-900: #181D20;
  --color-state-green-50: #A2E6BA;
  --color-state-green-100: #DFF6E7;
  --color-state-green-200: #CBF1D7;
  --color-state-green-300: #B7EBC9;
  --color-state-green-400: #7ADB9B;
  --color-state-green-500: #3ECB6E;
  --color-state-green-600: #2DA957;
  --color-state-green-700: #238143;
  --color-state-green-800: #1D6C38;
  --color-state-green-900: #18582E;
  --color-state-yellow-50: #FFF4CC;
  --color-state-yellow-100: #FFEEB3;
  --color-state-yellow-200: #FFE999;
  --color-state-yellow-300: #FFE380;
  --color-state-yellow-400: #FFDE66;
  --color-state-yellow-500: #FFD84D;
  --color-state-yellow-600: #FFD333;
  --color-state-yellow-700: #FFCD1A;
  --color-state-yellow-800: #FFC800;
  --color-state-yellow-900: #E5B400;
  --color-state-yellow-950: #4D3C00;
  --color-state-red-50: #FBEBEB;
  --color-state-red-100: #F5D5D5;
  --color-state-red-200: #F1C1C1;
  --color-state-red-300: #ECABAB;
  --color-state-red-400: #E69696;
  --color-state-red-500: #E28282;
  --color-state-red-600: #DE6D6D;
  --color-state-red-700: #E30000;
  --color-state-red-800: #BB2B2B;
  --color-state-red-900: #7D1C1C;
  --color-white: #FFF;
  --color-black: #000;
  --color-text-error: #FF0000;
  --color-gradient-silver:
    linear-gradient(
      180deg,
      #FFFFFF 35.5%,
      #6E7B90 100%,
      #98A5B9 100%);
  --color-gradient-orange:
    linear-gradient(
      180deg,
      #FF9D3C 35.5%,
      #FF7F00 100%);
  --main-font-stack:
    "Rijksoverheid-sans",
    -apple-system,
    blinkmacsystemfont,
    "Segoe UI",
    roboto,
    oxygen-sans,
    ubuntu,
    cantarell,
    "Helvetica Neue",
    sans-serif;
  --heading-font-stack:
    "PT Sans",
    -apple-system,
    blinkmacsystemfont,
    "Segoe UI",
    roboto,
    oxygen-sans,
    ubuntu,
    cantarell,
    "Helvetica Neue",
    sans-serif;
  --text-xs: 1.2rem;
  --text-sm: 1.4rem;
  --text-base: 1.6rem;
  --text-lg: 1.8rem;
  --text-xl: 2rem;
  --text-2xl: 2.4rem;
  --text-3xl: 2.8rem;
  --text-4xl: 3.6rem;
  --text-5xl: 5.2rem;
  --text-6xl: 5.8rem;
  --text-7xl: 6.4rem;
  --text-8xl: 8.8rem;
  --text-9xl: 9.6rem;
  --font-light: 300;
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-extrabold: 800;
  --font-black: 900;
  --font-base: var(--font-normal);
  --leading-h1: 1.15;
  --leading-base: 1.6;
  --spacing-4: 0.4rem;
  --spacing-6: 0.6rem;
  --spacing-8: 0.8rem;
  --spacing-10: 1rem;
  --spacing-12: 1.2rem;
  --spacing-16: 1.6rem;
  --spacing-20: 2rem;
  --spacing-24: 2.4rem;
  --spacing-32: 3.2rem;
  --spacing-40: 4rem;
  --spacing-48: 4.8rem;
  --spacing-56: 5.6rem;
  --spacing-64: 6.4rem;
  --spacing-72: 7.2rem;
  --spacing-80: 8rem;
  --spacing-96: 9.6rem;
  --rounded: var(--rounded-4);
  --rounded-4: 0.4rem;
  --rounded-6: 0.6rem;
  --rounded-8: 0.8rem;
  --rounded-16: 1.6rem;
  --rounded-24: 2.4rem;
  --rounded-48: 4.8rem;
  --max-container-width: 1180px;
  --outer-margin: 2rem;
  --color-border: initial;
  --color-border-light: initial;
  --color-outline: initial;
  --main-text-color: var(--color-font-900);
  --main-text-size: var(--text-base);
  --color-error: initial;
  --base-selection-bgcolor: var(--color-black);
  --base-select-textcolor: var(--color-white);
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */