:root {
  --svg-use-size: 1em;
  --svg-use-color: currentColor;
}
:root {
  color-scheme: light dark;
  --messages-base-color: #919191;
  --messages-base-size: 1em;
}
:where(.messages__wrapper) {
  margin-bottom: 0;
  color-scheme: light;
}
:where(.messages) {
  --mess-main: var(--messages-base-color);
  --mess-main-size: var(--messages-base-size);
  --mess-size: calc(0.98 * var(--mess-main-size));
  --mess-space: calc(1 * var(--mess-main-size));
  --mess-radius: calc(0.3 * var(--mess-main-size));
  --mess-back-l: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #717171ad), #9d9d9d3d);
  --mess-color-l: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #000000), #5b5b5b);
  --mess-border-l: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #ffffff69), #00000045);
  --mess-closer-l: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #cfcfcf24), #000000b3);
  --mess-back-d: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #ffffff52), #000000d9);
  --mess-color-d: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #ffffff9c), #919191a8);
  --mess-border-d: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #ffffff0d), #000000b3);
  --mess-closer-d: color-mix(in srgb, color-mix(in srgb, var(--mess-main), #ffffff5c), #00000021);
  --mess-back: light-dark(var(--mess-back-l), var(--mess-back-d));
  --mess-color: light-dark(var(--mess-color-l), var(--mess-color-d));
  --mess-border: light-dark(var(--mess-border-l), var(--mess-border-d));
  --mess-closer: light-dark(var(--messa-closer-l), var(--mess-closer-d));
  color: var(--mess-color);
  background: var(--mess-back);
  border: 1px solid var(--mess-border);
  font-size: var(--mess-size);
  border-radius: var(--mess-radius);
  box-shadow: none;
  outline: 0;
  padding: 1em;
  min-height: 1em;
}
:where(.messages) a,
:where(.messages) a:hover {
  color: oklch(from var(--mess-color) calc(l + 0.02) c h);
}
:where(.messages) + :where(.messages) {
  margin-top: calc(0.5 * var(--mess-space));
}
:where(.messages) .message-closer,
:where(.messages) .closer {
  color: var(--mess-closer);
}
:where(.messages) .messages__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
:where(.messages) .messages__list .messages__item {
  padding: 0;
  margin: 0;
}
:where(.messages) .messages__list .messages__item + .messages__item {
  margin-top: 0.4em;
}
:where(.messages) *:empty {
  display: none;
  margin: 0;
}
:where(.messages).messages--info {
  --messages-base-color: #9498b2;
}
:where(.messages).messages--message {
  --messages-base-color: #6b81e5;
}
:where(.messages).messages--status,
:where(.messages).messages--success {
  --messages-base-color: #78c395;
}
:where(.messages).messages--warning {
  --messages-base-color: #d3b62e;
}
:where(.messages).messages--error {
  --messages-base-color: #af5444;
}