/* permanent-marker-latin-400-normal */
@font-face {
  font-family: 'Permanent Marker';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/permanent-marker-latin-400-normal-BF23djCy.woff2) format('woff2'), url(/assets/permanent-marker-latin-400-normal-BnZj5c41.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}:root {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-weight: 400;

  color-scheme: light dark;
  color: rgba(255, 255, 255, 0.87);
  background-color: #242424;

  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* colors variables - updated for WCAG contrast compliance */
  --primary: #cc0079;
  --primary-dark: #990057;
  --primary-light: #ff4db5;
  --secondary: #f1f1f1;
  --accent: #2b3742;
  --success: #2e7d32; /* Darker green for better contrast */
  --info: #0277bd; /* Darker blue for better contrast */
  --warning: #f57c00; /* Darker orange for better contrast */
  --danger: #d32f2f; /* Darker red for better contrast */
  --light: #f4dde9;
  --dark: #343a40;
  --white: #ffffff;
  --background-secondary: #d8d8d8;
  --disabled: #767676; /* Darkened for better contrast from #969696 */

  /* text colors variables - updated for WCAG contrast compliance */
  --text-primary: #2b3742;
  --text-secondary: #555555; /* Darkened from #999999 for better contrast */
  --text-light: #767676; /* Darkened from #bababa for better contrast */
  --text-subtitle: #cc0079; /* Changed to match primary for consistency */
  --text-chat-input: #2b3742;

  /* Text on colored backgrounds */
  --text-on-primary: #ffffff;
  --text-on-success: #ffffff;
  --text-on-warning: #000000;
  --text-on-danger: #ffffff;
  --text-on-info: #ffffff;
}

html {
  height: 100%;
  overflow: hidden; /* Prevent scrolling at html level */
}

body {
  margin: 0;
  min-width: 320px;
  height: 100%;
  overflow: hidden; /* Prevent scrolling at body level */
  position: fixed; /* Fix body to viewport */
  width: 100%;
}

#root {
  height: 100%;
  width: 100%;
  overflow: hidden; /* Prevent scrolling at root level */
  display: flex;
  flex-direction: column;
}

a {
  font-weight: 500;
  color: #646cff;
  text-decoration: inherit;
}
a:hover {
  color: #535bf2;
}

h1 {
  font-size: 3.2em;
  line-height: 1.1;
}

button {
  border-radius: 8px;
  border: 1px solid transparent;
  padding: 0.6em 1.2em;
  font-size: 1em;
  font-weight: 500;
  font-family: inherit;
  background-color: #1a1a1a;
  cursor: pointer;
  transition: border-color 0.25s;
}
button:hover {
  border-color: #646cff;
}
button:focus,
button:focus-visible {
  outline: 4px auto -webkit-focus-ring-color;
}

@media (prefers-color-scheme: light) {
  :root {
    color: #213547;
    background-color: #ffffff;
  }
  a:hover {
    color: #747bff;
  }
  button {
    background-color: #f9f9f9;
  }
}