/*!*******************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[5].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[5].use[3]!../../packages/workspace/src/components/ui.module.css ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************/
.ui_pageHead__7fgkK {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--p-4);
  flex-wrap: wrap;
  margin-bottom: var(--p-5);
}

.ui_title__4m3Gv {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.015em;
}

.ui_subtitle__BtbC2 {
  margin: 4px 0 0;
  color: var(--p-ink-3);
  font-size: 13px;
  max-width: 68ch;
}

/*
  A card, padded.

  It used to have no padding at all, which made a flush card the default and a
  padded one something you had to remember — so most callers added their own
  `style={{ padding: '12px 16px' }}`, each a slightly different pair of numbers,
  and the two that forgot had their contents touching the border.

  The default is now the case that needs padding, because that is the case
  where forgetting looks broken. A table opts out with `cardFlush`: its cells
  carry their own padding, and a table inset inside a padded card has a margin
  its own header row does not, which reads as a mistake.
*/
.ui_card__TlL6T {
  background: var(--p-surface);
  border: 1px solid var(--p-line);
  border-radius: var(--p-radius);
  overflow: hidden;
  padding: var(--p-4) var(--p-5);
}

.ui_cardFlush__DUgTE {
  padding: 0;
}

.ui_table__w5Efx {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}

.ui_table__w5Efx th {
  text-align: left;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--p-ink-3);
  padding: var(--p-3) var(--p-5);
  border-bottom: 1px solid var(--p-line);
  white-space: nowrap;
}

.ui_table__w5Efx td {
  padding: var(--p-3) var(--p-5);
  border-bottom: 1px solid var(--p-line);
  vertical-align: top;
}

.ui_table__w5Efx tr:last-child td {
  border-bottom: none;
}

.ui_table__w5Efx tbody tr:hover {
  background: var(--p-surface-2);
}

/* Wide tables scroll inside their own box; the page never does. */
.ui_scroll__xnGi8 {
  overflow-x: auto;
}

.ui_pill__uYusx {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  border: 1px solid transparent;
  white-space: nowrap;
}

.ui_pillOk__Vr2BR {
  color: var(--p-ok);
  border-color: color-mix(in srgb, var(--p-ok) 40%, transparent);
  background: color-mix(in srgb, var(--p-ok) 12%, transparent);
}

.ui_pillWarn__pmyND {
  color: var(--p-warn);
  border-color: color-mix(in srgb, var(--p-warn) 40%, transparent);
  background: color-mix(in srgb, var(--p-warn) 12%, transparent);
}

.ui_pillBad__y4XG8 {
  color: var(--p-bad);
  border-color: color-mix(in srgb, var(--p-bad) 40%, transparent);
  background: color-mix(in srgb, var(--p-bad) 12%, transparent);
}

.ui_pillIdle__RGY77 {
  color: var(--p-idle);
  border-color: var(--p-line-strong);
}

.ui_button__VrJ5s {
  border: 1px solid var(--p-line-strong);
  background: var(--p-surface-2);
  color: var(--p-ink);
  border-radius: var(--p-radius);
  padding: 7px 13px;
  font-size: 13px;
  cursor: pointer;
}

.ui_button__VrJ5s:hover:not(:disabled) {
  border-color: var(--p-accent);
}

.ui_button__VrJ5s:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ui_buttonPrimary__RjmRZ {
  background: var(--p-accent);
  border-color: var(--p-accent);
  color: var(--p-accent-ink);
  font-weight: 600;
}

.ui_buttonDanger__ZpENY:hover:not(:disabled) {
  border-color: var(--p-bad);
  color: var(--p-bad);
}

.ui_empty__O9vNw {
  padding: 32px 16px;
  text-align: center;
  color: var(--p-ink-3);
  font-size: 13px;
}

.ui_error__SKbJi {
  margin-bottom: var(--p-section);
  border: 1px solid color-mix(in srgb, var(--p-bad) 45%, transparent);
  background: color-mix(in srgb, var(--p-bad) 10%, transparent);
  color: var(--p-bad);
  border-radius: var(--p-radius);
  padding: var(--p-3) var(--p-4);
  font-size: 13px;
}

/*
  A skeleton rather than a spinner: the row count is known before the data is,
  so the page does not jump when it arrives.
*/
.ui_skeleton__ovsb7 {
  height: 12px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--p-surface-2), var(--p-line), var(--p-surface-2));
  background-size: 200% 100%;
  animation: ui_shimmer__mjY9v 1.4s ease-in-out infinite;
}

@keyframes ui_shimmer__mjY9v {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ui_skeleton__ovsb7 {
    animation: none;
  }
}

.ui_muted__2Hnda {
  color: var(--p-ink-3);
}

.ui_mono__w7dS7 {
  font-family: var(--p-mono);
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
}

/*
  A text input, matching the buttons rather than the browser default.

  The console has had no input outside the sign-in form until now — the audit
  filter is the first, and a raw `<input>` beside these buttons is the one
  element that would make the page look unfinished.
*/
.ui_input__qxrsB {
  border: 1px solid var(--p-line-strong);
  background: var(--p-surface);
  color: var(--p-ink);
  border-radius: var(--p-radius);
  padding: 6px 10px;
  font-size: 13px;
  font-family: inherit;
  min-width: 240px;
}

.ui_input__qxrsB:focus {
  outline: none;
  border-color: var(--p-accent);
}

.ui_input__qxrsB::-moz-placeholder {
  color: var(--p-muted);
}

.ui_input__qxrsB::placeholder {
  color: var(--p-muted);
}

/*
  A row of controls above a table. Used by the audit filter, and the reason it
  is a class rather than inline styles: the next filtered table should not have
  to guess at the same gaps.
*/
.ui_filters__FKGo7 {
  margin-bottom: var(--p-section);
  display: flex;
  gap: var(--p-4);
  align-items: center;
  flex-wrap: wrap;
}

.ui_filterLabel__C2VzZ {
  display: flex;
  gap: 8px;
  align-items: center;
}

/*
  A label for the block beneath it.

  Above the card rather than inside it, so it lines up with the card's own left
  edge and with every other section label on the page. A heading inside a
  padded card sits indented from the table it names, which reads as two
  unrelated things rather than one labelled thing.
*/
.ui_sectionTitle__EshGg {
  margin: 0 0 var(--p-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--p-ink-3);
}

/* One block after another, with the page's own rhythm between them. */
.ui_stack__nOBI0 {
  display: flex;
  flex-direction: column;
  gap: var(--p-section);
}

/*
  A group heading inside a table.

  Rather than one table per group: separate tables size their columns
  independently, so the same column lands in a different place in each and
  three stacked tables read as three unrelated things. Columns that do not line
  up are the loudest thing on a page of small text.
*/
.ui_groupRow__l_ZQC {
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--p-ink-3);
  background: var(--p-bg);
  padding: var(--p-2) var(--p-5);
  border-bottom: 1px solid var(--p-line);
}

/*
  A conversation, read top to bottom.

  Inbound and outbound are told apart by *alignment and ground*, not by colour
  alone — an agent scanning a long thread is looking for the shape of who spoke
  last, and on a busy screen colour is the first thing that stops registering.
*/
.ui_thread__89Nqk {
  display: flex;
  flex-direction: column;
  gap: var(--p-4);
}

.ui_msg__G9VCD {
  max-width: 78%;
  border: 1px solid var(--p-line);
  border-radius: var(--p-radius);
  padding: var(--p-3) var(--p-4);
  background: var(--p-surface);
}

/* The customer. Left, plain ground — the default the eye reads as "them". */
.ui_msgIn__x3aSv {
  align-self: flex-start;
}

/* Us. Right, and tinted, so a thread ending on the left is one owing a reply. */
.ui_msgOut__VD7HR {
  align-self: flex-end;
  background: var(--p-surface-2);
  border-color: var(--p-line-strong);
}

/*
  An internal note. Full width and visibly not a message, because the one
  mistake that must be impossible here is mistaking it for something the
  customer can see.
*/
.ui_msgNote__UdVG_ {
  align-self: stretch;
  max-width: 100%;
  background: transparent;
  border-style: dashed;
}

.ui_msgHead__AFSGO {
  display: flex;
  gap: var(--p-3);
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 6px;
  font-size: 12px;
  color: var(--p-ink-3);
}

.ui_msgWho__aRkGN {
  font-weight: 600;
  color: var(--p-ink-2);
}

/*
  `pre-wrap`, because these bodies are plain text that people wrote with
  paragraphs in them. Collapsing the whitespace turns an itinerary into a wall.
*/
.ui_msgBody__3V1W1 {
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 13px;
  line-height: 1.55;
}

.ui_msgFailed__UER_L {
  margin-top: 6px;
  font-size: 12px;
  color: var(--p-bad);
}

.ui_textarea__Dejfp {
  width: 100%;
  border: 1px solid var(--p-line-strong);
  background: var(--p-surface);
  color: var(--p-ink);
  border-radius: var(--p-radius);
  padding: var(--p-3);
  font: inherit;
  font-size: 13px;
  line-height: 1.55;
  resize: vertical;
  min-height: 96px;
}

.ui_textarea__Dejfp:focus {
  outline: none;
  border-color: var(--p-accent);
}

/* Label/value pairs beside a conversation — the trip clock, the assignee. */
.ui_facts__Rj84_ {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px var(--p-4);
  font-size: 13px;
}

.ui_factLabel__oSwQU {
  color: var(--p-ink-3);
  white-space: nowrap;
}

/*
  Two columns on a wide screen, one when there is not room. The conversation
  comes first in the source so it is what a narrow screen shows first — the
  facts are reference, the thread is the work.
*/
.ui_split__jqIG1 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: var(--p-section);
  align-items: start;
}

@media (max-width: 900px) {
  .ui_split__jqIG1 {
    grid-template-columns: minmax(0, 1fr);
  }
}

/*
  The inbox: a list you work from, beside the thing you are working on.

  Narrower than `.split` because a message list needs less width than a
  conversation does — and the conversation is where the attention goes.
*/
.ui_inbox__ffOPe {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  gap: var(--p-section);
  align-items: start;
}

@media (max-width: 1000px) {
  .ui_inbox__ffOPe {
    grid-template-columns: minmax(0, 1fr);
  }
}

.ui_inboxList__7n3sX {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--p-line);
  border-radius: var(--p-radius);
  background: var(--p-surface);
  overflow: hidden;
}

.ui_inboxItem__3Ci_k {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  border-bottom: 1px solid var(--p-line);
  background: transparent;
  color: inherit;
  font: inherit;
  padding: var(--p-3) var(--p-4);
  cursor: pointer;
}

.ui_inboxItem__3Ci_k:last-child {
  border-bottom: 0;
}

.ui_inboxItem__3Ci_k:hover {
  background: var(--p-surface-2);
}

/*
  The open one. A left bar rather than only a tint, because the tint is also
  the hover state and an agent moving the mouse down the list would otherwise
  lose track of where they actually are.
*/
.ui_inboxItemOpen__GGejq {
  background: var(--p-surface-2);
  box-shadow: inset 3px 0 0 var(--p-accent);
}

.ui_inboxTop__zSWyd {
  display: flex;
  justify-content: space-between;
  gap: var(--p-3);
  align-items: baseline;
  font-size: 12px;
  color: var(--p-ink-3);
}

.ui_inboxSubject__EgOjD {
  margin: 3px 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  /* Two lines, then stop. A six-line subject pushes the next ticket off. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/*
  The last thing said. Muted, one line, and clipped — it is a hint about
  whether this needs opening, not the message itself.
*/
.ui_inboxPreview__S_AH5 {
  font-size: 12px;
  color: var(--p-ink-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* The customer spoke last. This is the one that owes an answer. */
.ui_inboxPreviewIn__AX9ij {
  color: var(--p-ink-2);
  font-weight: 500;
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[5].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[5].use[3]!../../packages/workspace/src/components/shell.module.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************/
.shell_shell__nF666 {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
}

@media (max-width: 860px) {
  .shell_shell__nF666 {
    grid-template-columns: 1fr;
  }
  .shell_sidebar__hsYqb {
    position: static;
    height: auto;
    border-right: none;
    border-bottom: 1px solid var(--p-line);
  }
  .shell_nav__TdHWI {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.shell_sidebar__hsYqb {
  position: sticky;
  top: 0;
  height: 100vh;
  border-right: 1px solid var(--p-line);
  background: var(--p-surface);
  padding: var(--p-5) var(--p-3);
  display: flex;
  flex-direction: column;
  gap: var(--p-5);
}

.shell_brand__2TUTO {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 0 8px;
}

.shell_brandName__eSk7u {
  font-weight: 700;
  letter-spacing: -0.01em;
  font-size: 16px;
}

/*
  The one label that stops an operator confusing this with an agency's own
  dashboard. It is not decoration.
*/
.shell_brandRole__epzDS {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--p-accent);
}

.shell_nav__TdHWI {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.shell_navItem__NtxJx {
  padding: var(--p-2) var(--p-3);
  border-radius: var(--p-radius);
  color: var(--p-ink-2);
  font-size: 13.5px;
}

.shell_navItem__NtxJx:hover {
  background: var(--p-surface-2);
  color: var(--p-ink);
}

.shell_navItemActive__zwjmS {
  background: var(--p-surface-2);
  color: var(--p-ink);
  font-weight: 600;
  box-shadow: inset 2px 0 0 var(--p-accent);
}

.shell_who__DYoNC {
  margin-top: auto;
  border-top: 1px solid var(--p-line);
  padding-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12px;
  color: var(--p-ink-3);
}

.shell_whoEmail__LcVNX {
  color: var(--p-ink-2);
  word-break: break-all;
}

.shell_signOut__4kb62 {
  align-self: flex-start;
  background: none;
  border: 1px solid var(--p-line-strong);
  color: var(--p-ink-2);
  border-radius: var(--p-radius);
  padding: 5px 10px;
  cursor: pointer;
  font-size: 12px;
}

.shell_signOut__4kb62:hover {
  border-color: var(--p-accent);
  color: var(--p-ink);
}

/*
  The page's breathing room.

  Was 28/32, which on a 1440px screen put the first card almost against the
  sidebar rule and the title almost against the top of the window. An operator
  console should feel dense in its rows, not in its margins.
*/
.shell_main__KXnBO {
  padding: var(--p-6) var(--p-7) 80px;
  max-width: 1280px;
}

@media (max-width: 640px) {
  .shell_main__KXnBO {
    padding: var(--p-5) var(--p-4) var(--p-7);
  }
}

/*
  A group of pages under one heading.

  Spaced away from the flat items above and below it so the heading reads as
  a heading rather than as a disabled link — which is what an unclickable
  item at the same rhythm as its neighbours looks like.
*/
.shell_navGroup__GO1KK {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: var(--p-2) 0;
}

.shell_navGroupLabel__J7v_e {
  padding: var(--p-2) var(--p-3) 4px;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--p-ink-3);
}

.shell_navChild__pbCVm {
  padding-left: var(--p-5, 20px);
}

/*
  The gate somebody sees when the browser is carrying no session.

  A card rather than a redirect, because a silent bounce to another app's
  sign-in page loses where they were trying to go and looks like the link was
  broken. Saying "there is one sign-in for every Jenova app" is also the only
  place a person is ever told that, and it is the thing that makes nine apps
  feel like one product rather than nine.
*/
.shell_gate__BTDQQ {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--p-5);
}

.shell_gateCard__sDnbY {
  background: var(--p-surface);
  border: 1px solid var(--p-line);
  border-radius: var(--p-radius);
  padding: var(--p-6);
  max-width: 420px;
  text-align: center;
}

.shell_wordmark__Gb5Bh {
  font-size: 18px;
  font-weight: 700;
  color: var(--p-accent);
  margin-bottom: var(--p-3);
}

.shell_gateText__5l_ch {
  color: var(--p-ink-2);
  margin: 0 0 var(--p-5);
  font-size: 13.5px;
}

.shell_gateAction__Z3xVC {
  display: inline-block;
  padding: var(--p-2) var(--p-5);
  border-radius: var(--p-radius);
  background: var(--p-accent);
  color: var(--p-accent-ink);
  font-weight: 600;
}

/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[2].use[1]!../../node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[14].oneOf[2].use[2]!../../node_modules/next/font/google/target.css?{"path":"src\\app\\layout.tsx","import":"DM_Sans","arguments":[{"subsets":["latin"],"weight":["400","500","700"],"variable":"--font-dm-sans","display":"swap"}],"variableName":"dmSans"} ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/desk/_next/static/media/7ab938503e4547a1-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/desk/_next/static/media/13971731025ec697-s.p.woff2) format('woff2');
  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;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/desk/_next/static/media/7ab938503e4547a1-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/desk/_next/static/media/13971731025ec697-s.p.woff2) format('woff2');
  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;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/desk/_next/static/media/7ab938503e4547a1-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/desk/_next/static/media/13971731025ec697-s.p.woff2) format('woff2');
  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;
}@font-face {font-family: 'DM Sans Fallback';src: local("Arial");ascent-override: 94.90%;descent-override: 29.66%;line-gap-override: 0.00%;size-adjust: 104.53%
}.__className_6e1c09 {font-family: 'DM Sans', 'DM Sans Fallback';font-style: normal
}.__variable_6e1c09 {--font-dm-sans: 'DM Sans', 'DM Sans Fallback'
}

/*!****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[2].use[1]!../../node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[14].oneOf[2].use[2]!../../node_modules/next/font/google/target.css?{"path":"src\\app\\layout.tsx","import":"Poppins","arguments":[{"subsets":["latin"],"weight":["500","600","700"],"variable":"--font-poppins","display":"swap"}],"variableName":"poppins"} ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/desk/_next/static/media/db911767852bc875-s.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/desk/_next/static/media/f10b8e9d91f3edcb-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/desk/_next/static/media/8888a3826f4a3af4-s.p.woff2) format('woff2');
  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;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/desk/_next/static/media/29e7bbdce9332268-s.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/desk/_next/static/media/c3bc380753a8436c-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/desk/_next/static/media/0484562807a97172-s.p.woff2) format('woff2');
  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;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/desk/_next/static/media/29a4aea02fdee119-s.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/desk/_next/static/media/a1386beebedccca4-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/desk/_next/static/media/b957ea75a84b6ea7-s.p.woff2) format('woff2');
  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;
}@font-face {font-family: 'Poppins Fallback';src: local("Arial");ascent-override: 93.62%;descent-override: 31.21%;line-gap-override: 8.92%;size-adjust: 112.16%
}.__className_c60cef {font-family: 'Poppins', 'Poppins Fallback';font-style: normal
}.__variable_c60cef {--font-poppins: 'Poppins', 'Poppins Fallback'
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!../../packages/horizon/src/styles/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************/
*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}/*
! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #DADEEC; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: var(--font-dm-sans), DM Sans, system-ui, sans-serif; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #B0BBD5; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #B0BBD5; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}
  :root {
    color-scheme: light;

    /*
      The shell's rail, and the offset the content sits beside it at.

      300px is the Horizon layout's own sidebar width and 323px is the
      `xl:ml-[323px]` its `main` carries — the rail plus 23px of air. The two
      are written out rather than calculated because the shell reads each into
      a different property (a width, a negative inline offset, an inline
      margin), and the one failure mode worth naming is them drifting apart: a
      23px seam of page background showing down the inside of the sidebar, or a
      card sliding under it.

      The collapsed pair is ours — the theme does not collapse — and carries
      the same 23px.

      Here rather than in the Tailwind preset because they are four numbers
      that only mean anything together, and a theme token list is a place
      values get changed one at a time.
    */
    --shell-rail: 300px;
    --shell-rail-offset: 323px;
    --shell-rail-collapsed: 88px;
    --shell-rail-collapsed-offset: 111px;

    /*
      How far down the window the floating navbar ends.

      It is `top-4` and 77px tall, so its bottom edge is 93px and 7rem clears it
      with a little air. A property because two separate things need the number
      and neither owns it: this stylesheet's `scroll-padding-top`, so an anchor
      jump does not land under the bar, and every sticky rail in an app that has
      to start below it. Restated by hand, those drift apart the first time the
      bar changes height, and the one that drifts is the one nobody is looking
      at.
    */
    --shell-bar-h: 7rem;

    /*
      What a focused control is ringed in. Brand by default; an app that must
      not show the brand re-points it and the global rule follows.
    */
    --focus-ring: #8B5FC4;
  }

  .dark {
    color-scheme: dark;
    --focus-ring: #A882D6;
  }

  html {
    /*
      Anchors and tab panels scroll to a position that accounts for the sticky
      header rather than underneath it. Without this, following a link inside a
      long settings page lands with the heading hidden behind the top bar,
      which reads as the link going to the wrong place.

      The 7rem itself is `--shell-bar-h`, declared above, rather than written
      out again here: the sticky rails in every app have to clear the same bar,
      and a second copy of the number is a second thing to forget.
    */
    scroll-padding-top: var(--shell-bar-h);
    -webkit-text-size-adjust: 100%;

    /*
      From the theme's own `styles/index.css`, which was never copied across
      when this system was first assembled from its colours alone.

      The tracking is not a detail. Horizon's whole type rhythm is set with
      -0.2px on the root, and without it every heading, label and table cell in
      the product sits a shade wider than the theme it is meant to be — which
      reads as "close to the design" rather than as the design.
    */
    font-feature-settings: 'kern';
    letter-spacing: -0.2px;
  }

  /*
    The theme's layout root is `flex h-full w-full`, and `h-full` resolves to
    `auto` — meaning nothing — unless every ancestor up to the viewport has a
    height to be a percentage of. The theme relies on this and does not say so.

    The page still scrolls: the shell's content is `min-h-screen` and overflows
    a viewport-tall body in the ordinary way, which is exactly what the theme
    does. What this buys is that the frame is a full window from the first
    paint rather than only once something inside it is tall enough.
  */
  html,
  body {
    height: 100%;
  }

  body {
  --tw-bg-opacity: 1;
  background-color: rgb(244 247 254 / var(--tw-bg-opacity, 1));
  font-family: var(--font-dm-sans), DM Sans, system-ui, sans-serif;
  --tw-text-opacity: 1;
  color: rgb(27 37 75 / var(--tw-text-opacity, 1));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

  body:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(8 9 11 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

  /*
    Also the theme's, from `styles/App.css` (`option { color: black }`).

    A native `<select>` popup is drawn by the operating system and inherits
    almost nothing from the control it belongs to. In dark mode the options
    came through as white text on the platform's white popup on Windows, so
    every native select in the product was a list of blank rows. Deliberately
    not paired with a dark variant: the popup chrome is light on every platform
    we run on, whatever the page is doing.
  */
  option {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(27 37 75 / var(--tw-text-opacity, 1));
}

  /*
    A focus ring that is visible on both surfaces and only when it is earned.
    `:focus-visible` rather than `:focus` so a mouse click on a button does not
    leave a ring behind it — which is the reason people remove focus styles
    altogether, and then the keyboard user is lost.

    The colour comes from a property rather than from the brand ramp directly,
    because one app must not have it. The operator console is deliberately free
    of Jenova's purple — that is how somebody tells at a glance whether they are
    inside an agency's account or above it — and it had a purple ring on every
    control it owns anyway, because this rule reaches everything and no app can
    opt a global selector out. Re-pointing `--focus-ring` is how it opts out.
  */
  :focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-offset-width: 2px;
    --tw-ring-color: var(--focus-ring);
}

  /*
    Scrollbars that do not shout. Left alone, a dense inbox on Windows gets a
    17px light-grey bar down the middle of a dark panel.
  */
  * {
    scrollbar-width: thin;
    scrollbar-color: #C9D0E3 transparent;
  }

  .dark * {
    scrollbar-color: #272A31 transparent;
  }

  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  ::-webkit-scrollbar-track {
    background: transparent;
  }

  ::-webkit-scrollbar-thumb {
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(201 208 227 / var(--tw-bg-opacity, 1));
}

  :is(.dark *)::-webkit-scrollbar-thumb {
  --tw-bg-opacity: 1;
  background-color: rgb(39 42 49 / var(--tw-bg-opacity, 1));
}
.container {
  width: 100%;
}
@media (min-width: 576px) {

  .container {
    max-width: 576px;
  }
}
@media (min-width: 768px) {

  .container {
    max-width: 768px;
  }
}
@media (min-width: 992px) {

  .container {
    max-width: 992px;
  }
}
@media (min-width: 1200px) {

  .container {
    max-width: 1200px;
  }
}
@media (min-width: 1320px) {

  .container {
    max-width: 1320px;
  }
}
@media (min-width: 1600px) {

  .container {
    max-width: 1600px;
  }
}
/*
    A panel that scrolls without saying so.

    On a detail page — a ticket, a customer, a booking — the page is about one
    record, and a side panel taller than the screen has to scroll inside itself
    or it drags the whole page down past the thing being read. But a second
    scrollbar beside the first turns the screen into two things that can be
    scrolled, and the reader has to work out which one they are in. That is
    attention spent on furniture.

    So the bar is hidden and the scrolling is not. The distinction matters: this
    is emphatically not `overflow: hidden`, which would leave content
    unreachable. Wheel, trackpad, touch, keyboard and Find-in-page all still
    work; the browser simply draws nothing.

    Two declarations because no engine supports both. `scrollbar-width: none` is
    the standard property, honoured by Firefox; `::-webkit-scrollbar` is the old
    one WebKit and Chromium still need. Neither alone covers the browsers this
    product runs in.
  */
.scroll-quiet {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
.scroll-quiet::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
/*
    The desk's speaking voice, and the most-repeated string in the whole
    conversion — `text-gray-700 dark:text-gray-400` was typed about forty times
    in ten files before this existed. A pair that has to be remembered is a
    pair somebody eventually types half of, and half of it is a colour that
    disappears on one of the two surfaces.
  */
.text-muted {
  --tw-text-opacity: 1;
  color: rgb(112 126 174 / var(--tw-text-opacity, 1));
}
.text-muted:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(176 187 213 / var(--tw-text-opacity, 1));
}
/*
    A skeleton's shimmer. It needs a pseudo-element and a gradient, which is
    more than a utility string should carry, and it is used by every loading
    state in the system.
  */
.skeleton {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(238 240 246 / var(--tw-bg-opacity, 1));
}
.skeleton:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 34 / var(--tw-bg-opacity, 1));
}
.skeleton::after {
  position: absolute;
  inset: 0px;
  --tw-translate-x: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes shimmer {

  100% {
    transform: translateX(100%);
  }
}
.skeleton::after {
  animation: shimmer 1.6s infinite;
    content: '';
    background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.45), transparent);
}
.dark .skeleton::after {
    background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.06), transparent);
  }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.pointer-events-none {
  pointer-events: none;
}
.visible {
  visibility: visible;
}
.invisible {
  visibility: hidden;
}
.collapse {
  visibility: collapse;
}
.static {
  position: static;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.sticky {
  position: sticky;
}
.inset-0 {
  inset: 0px;
}
.inset-x-2 {
  left: 0.5rem;
  right: 0.5rem;
}
.inset-y-0 {
  top: 0px;
  bottom: 0px;
}
.-bottom-px {
  bottom: -1px;
}
.-end-0\.5 {
  inset-inline-end: -0.125rem;
}
.-top-0\.5 {
  top: -0.125rem;
}
.bottom-0 {
  bottom: 0px;
}
.end-0 {
  inset-inline-end: 0px;
}
.end-4 {
  inset-inline-end: 1rem;
}
.right-0 {
  right: 0px;
}
.right-4 {
  right: 1rem;
}
.start-0 {
  inset-inline-start: 0px;
}
.start-4 {
  inset-inline-start: 1rem;
}
.start-\[-1\.5rem\] {
  inset-inline-start: -1.5rem;
}
.start-\[calc\(var\(--shell-rail\)\*-1\)\] {
  inset-inline-start: calc(var(--shell-rail) * -1);
}
.top-0 {
  top: 0px;
}
.top-1\.5 {
  top: 0.375rem;
}
.top-28 {
  top: 7rem;
}
.top-4 {
  top: 1rem;
}
.top-6 {
  top: 1.5rem;
}
.top-9 {
  top: 2.25rem;
}
.top-\[var\(--shell-bar-h\)\] {
  top: var(--shell-bar-h);
}
.top-full {
  top: 100%;
}
.top-px {
  top: 1px;
}
.\!z-50 {
  z-index: 50 !important;
}
.z-10 {
  z-index: 10;
}
.z-30 {
  z-index: 30;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.z-\[60\] {
  z-index: 60;
}
.z-\[70\] {
  z-index: 70;
}
.col-span-2 {
  grid-column: span 2 / span 2;
}
.m-auto {
  margin: auto;
}
.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}
.-mx-2 {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}
.-mx-4 {
  margin-left: -1rem;
  margin-right: -1rem;
}
.-my-1 {
  margin-top: -0.25rem;
  margin-bottom: -0.25rem;
}
.mx-0\.5 {
  margin-left: 0.125rem;
  margin-right: 0.125rem;
}
.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.mx-2\.5 {
  margin-left: 0.625rem;
  margin-right: 0.625rem;
}
.mx-\[56px\] {
  margin-left: 56px;
  margin-right: 56px;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-\[3px\] {
  margin-top: 3px;
  margin-bottom: 3px;
}
.-ms-2 {
  margin-inline-start: -0.5rem;
}
.mb-0 {
  margin-bottom: 0px;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-1\.5 {
  margin-bottom: 0.375rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-5 {
  margin-bottom: 1.25rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-7 {
  margin-bottom: 1.75rem;
}
.mb-auto {
  margin-bottom: auto;
}
.me-1 {
  margin-inline-end: 0.25rem;
}
.me-2 {
  margin-inline-end: 0.5rem;
}
.ml-4 {
  margin-left: 1rem;
}
.ms-1\.5 {
  margin-inline-start: 0.375rem;
}
.ms-10 {
  margin-inline-start: 2.5rem;
}
.ms-2 {
  margin-inline-start: 0.5rem;
}
.ms-4 {
  margin-inline-start: 1rem;
}
.ms-auto {
  margin-inline-start: auto;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-1\.5 {
  margin-top: 0.375rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-5 {
  margin-top: 1.25rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.mt-8 {
  margin-top: 2rem;
}
.mt-\[26px\] {
  margin-top: 26px;
}
.mt-\[50px\] {
  margin-top: 50px;
}
.mt-\[58px\] {
  margin-top: 58px;
}
.mt-auto {
  margin-top: auto;
}
.mt-px {
  margin-top: 1px;
}
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.block {
  display: block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.grid {
  display: grid;
}
.contents {
  display: contents;
}
.hidden {
  display: none;
}
.\!h-2\.5 {
  height: 0.625rem !important;
}
.h-0\.5 {
  height: 0.125rem;
}
.h-10 {
  height: 2.5rem;
}
.h-12 {
  height: 3rem;
}
.h-14 {
  height: 3.5rem;
}
.h-2 {
  height: 0.5rem;
}
.h-3\.5 {
  height: 0.875rem;
}
.h-4 {
  height: 1rem;
}
.h-5 {
  height: 1.25rem;
}
.h-6 {
  height: 1.5rem;
}
.h-7 {
  height: 1.75rem;
}
.h-8 {
  height: 2rem;
}
.h-9 {
  height: 2.25rem;
}
.h-\[30rem\] {
  height: 30rem;
}
.h-\[61px\] {
  height: 61px;
}
.h-full {
  height: 100%;
}
.h-px {
  height: 1px;
}
.max-h-64 {
  max-height: 16rem;
}
.max-h-\[60vh\] {
  max-height: 60vh;
}
.min-h-0 {
  min-height: 0px;
}
.min-h-\[120px\] {
  min-height: 120px;
}
.min-h-\[38px\] {
  min-height: 38px;
}
.min-h-\[90px\] {
  min-height: 90px;
}
.min-h-\[96px\] {
  min-height: 96px;
}
.min-h-full {
  min-height: 100%;
}
.min-h-screen {
  min-height: 100vh;
}
.\!w-2\.5 {
  width: 0.625rem !important;
}
.\!w-\[26rem\] {
  width: 26rem !important;
}
.w-0\.5 {
  width: 0.125rem;
}
.w-1 {
  width: 0.25rem;
}
.w-10 {
  width: 2.5rem;
}
.w-11 {
  width: 2.75rem;
}
.w-12 {
  width: 3rem;
}
.w-14 {
  width: 3.5rem;
}
.w-2 {
  width: 0.5rem;
}
.w-20 {
  width: 5rem;
}
.w-24 {
  width: 6rem;
}
.w-28 {
  width: 7rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-32 {
  width: 8rem;
}
.w-36 {
  width: 9rem;
}
.w-4 {
  width: 1rem;
}
.w-40 {
  width: 10rem;
}
.w-48 {
  width: 12rem;
}
.w-5 {
  width: 1.25rem;
}
.w-56 {
  width: 14rem;
}
.w-6 {
  width: 1.5rem;
}
.w-60 {
  width: 15rem;
}
.w-7 {
  width: 1.75rem;
}
.w-8 {
  width: 2rem;
}
.w-9 {
  width: 2.25rem;
}
.w-\[10\%\] {
  width: 10%;
}
.w-\[12\%\] {
  width: 12%;
}
.w-\[13\%\] {
  width: 13%;
}
.w-\[14\%\] {
  width: 14%;
}
.w-\[15\%\] {
  width: 15%;
}
.w-\[16\%\] {
  width: 16%;
}
.w-\[18\%\] {
  width: 18%;
}
.w-\[20\%\] {
  width: 20%;
}
.w-\[22\%\] {
  width: 22%;
}
.w-\[24\%\] {
  width: 24%;
}
.w-\[26\%\] {
  width: 26%;
}
.w-\[30\%\] {
  width: 30%;
}
.w-\[32\%\] {
  width: 32%;
}
.w-\[355px\] {
  width: 355px;
}
.w-\[40\%\] {
  width: 40%;
}
.w-\[50\%\] {
  width: 50%;
}
.w-\[min\(24rem\2c calc\(100vw-2rem\)\)\] {
  width: min(24rem, calc(100vw - 2rem));
}
.w-\[var\(--shell-rail\)\] {
  width: var(--shell-rail);
}
.w-auto {
  width: auto;
}
.w-full {
  width: 100%;
}
.w-px {
  width: 1px;
}
.min-w-0 {
  min-width: 0px;
}
.min-w-\[10rem\] {
  min-width: 10rem;
}
.min-w-\[15rem\] {
  min-width: 15rem;
}
.min-w-\[18px\] {
  min-width: 18px;
}
.min-w-\[28rem\] {
  min-width: 28rem;
}
.min-w-\[60px\] {
  min-width: 60px;
}
.min-w-\[640px\] {
  min-width: 640px;
}
.min-w-\[9rem\] {
  min-width: 9rem;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-\[13rem\] {
  max-width: 13rem;
}
.max-w-\[15rem\] {
  max-width: 15rem;
}
.max-w-\[1600px\] {
  max-width: 1600px;
}
.max-w-\[85\%\] {
  max-width: 85%;
}
.max-w-full {
  max-width: 100%;
}
.max-w-md {
  max-width: 28rem;
}
.max-w-sm {
  max-width: 24rem;
}
.max-w-xl {
  max-width: 36rem;
}
.max-w-xs {
  max-width: 20rem;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-\[2\] {
  flex: 2;
}
.flex-none {
  flex: none;
}
.shrink {
  flex-shrink: 1;
}
.shrink-0 {
  flex-shrink: 0;
}
.grow {
  flex-grow: 1;
}
.border-collapse {
  border-collapse: collapse;
}
.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-x-96 {
  --tw-translate-x: -24rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-full {
  --tw-translate-y: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-rotate-90 {
  --tw-rotate: -90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes fade-in {

  from {
    opacity: 0;
    transform: translateY(4px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}
.animate-fade-in {
  animation: fade-in 160ms ease-out;
}
.cursor-grab {
  cursor: grab;
}
.cursor-pointer {
  cursor: pointer;
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.resize-y {
  resize: vertical;
}
.resize {
  resize: both;
}
.list-none {
  list-style-type: none;
}
.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-\[auto_1fr\] {
  grid-template-columns: auto 1fr;
}
.grid-cols-\[minmax\(0\2c 1fr\)_minmax\(0\2c 1fr\)\] {
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
}
.grid-cols-\[minmax\(0\2c auto\)_minmax\(0\2c 1fr\)\] {
  grid-template-columns: minmax(0,auto) minmax(0,1fr);
}
.\!flex-row {
  flex-direction: row !important;
}
.flex-row {
  flex-direction: row;
}
.flex-row-reverse {
  flex-direction: row-reverse;
}
.flex-col {
  flex-direction: column;
}
.flex-wrap {
  flex-wrap: wrap;
}
.place-items-center {
  place-items: center;
}
.items-start {
  align-items: flex-start;
}
.items-end {
  align-items: flex-end;
}
.items-center {
  align-items: center;
}
.items-baseline {
  align-items: baseline;
}
.justify-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.gap-0\.5 {
  gap: 0.125rem;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-1\.5 {
  gap: 0.375rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-2\.5 {
  gap: 0.625rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-5 {
  gap: 1.25rem;
}
.gap-6 {
  gap: 1.5rem;
}
.gap-x-2 {
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.gap-x-3 {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.gap-x-4 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.gap-x-6 {
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.gap-y-2 {
  row-gap: 0.5rem;
}
.space-y-0\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.125rem * var(--tw-space-y-reverse));
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.divide-y > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.divide-gray-100 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(238 240 246 / var(--tw-divide-opacity, 1));
}
.divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(218 222 236 / var(--tw-divide-opacity, 1));
}
.self-start {
  align-self: flex-start;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-x-auto {
  overflow-x: auto;
}
.overflow-y-auto {
  overflow-y: auto;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.whitespace-pre-wrap {
  white-space: pre-wrap;
}
.break-words {
  overflow-wrap: break-word;
}
.break-all {
  word-break: break-all;
}
.rounded {
  border-radius: 0.25rem;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-\[10px\] {
  border-radius: 10px;
}
.rounded-\[20px\] {
  border-radius: 20px;
}
.rounded-\[7px\] {
  border-radius: 7px;
}
.rounded-\[8px\] {
  border-radius: 8px;
}
.rounded-\[9px\] {
  border-radius: 9px;
}
.rounded-card {
  border-radius: 20px;
}
.rounded-control {
  border-radius: 12px;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: 0.5rem;
}
.rounded-md {
  border-radius: 0.375rem;
}
.rounded-xl {
  border-radius: 0.75rem;
}
.rounded-ee-none {
  border-end-end-radius: 0px;
}
.\!border-2 {
  border-width: 2px !important;
}
.border {
  border-width: 1px;
}
.border-2 {
  border-width: 2px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-s {
  border-inline-start-width: 1px;
}
.border-t {
  border-top-width: 1px;
}
.border-t-2 {
  border-top-width: 2px;
}
.border-dashed {
  border-style: dashed;
}
.\!border-transparent {
  border-color: transparent !important;
}
.border-brand-100 {
  --tw-border-opacity: 1;
  border-color: rgb(226 213 242 / var(--tw-border-opacity, 1));
}
.border-brand-200 {
  --tw-border-opacity: 1;
  border-color: rgb(198 172 229 / var(--tw-border-opacity, 1));
}
.border-brand-300 {
  --tw-border-opacity: 1;
  border-color: rgb(168 130 214 / var(--tw-border-opacity, 1));
}
.border-brand-400 {
  --tw-border-opacity: 1;
  border-color: rgb(139 95 196 / var(--tw-border-opacity, 1));
}
.border-brand-500 {
  --tw-border-opacity: 1;
  border-color: rgb(109 61 176 / var(--tw-border-opacity, 1));
}
.border-danger-100 {
  --tw-border-opacity: 1;
  border-color: rgb(249 201 201 / var(--tw-border-opacity, 1));
}
.border-gray-100 {
  --tw-border-opacity: 1;
  border-color: rgb(238 240 246 / var(--tw-border-opacity, 1));
}
.border-gray-200 {
  --tw-border-opacity: 1;
  border-color: rgb(218 222 236 / var(--tw-border-opacity, 1));
}
.border-gray-300 {
  --tw-border-opacity: 1;
  border-color: rgb(201 208 227 / var(--tw-border-opacity, 1));
}
.border-transparent {
  border-color: transparent;
}
.border-warning-100 {
  --tw-border-opacity: 1;
  border-color: rgb(255 231 184 / var(--tw-border-opacity, 1));
}
.border-warning-500\/60 {
  border-color: rgb(255 181 71 / 0.6);
}
.border-t-brand-500 {
  --tw-border-opacity: 1;
  border-top-color: rgb(109 61 176 / var(--tw-border-opacity, 1));
}
.border-t-transparent {
  border-top-color: transparent;
}
.\!bg-transparent {
  background-color: transparent !important;
}
.bg-\[\#e0e5f2\] {
  --tw-bg-opacity: 1;
  background-color: rgb(224 229 242 / var(--tw-bg-opacity, 1));
}
.bg-brand-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(243 238 250 / var(--tw-bg-opacity, 1));
}
.bg-brand-50\/40 {
  background-color: rgb(243 238 250 / 0.4);
}
.bg-brand-50\/60 {
  background-color: rgb(243 238 250 / 0.6);
}
.bg-brand-50\/70 {
  background-color: rgb(243 238 250 / 0.7);
}
.bg-brand-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(109 61 176 / var(--tw-bg-opacity, 1));
}
.bg-brand-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(53 13 96 / var(--tw-bg-opacity, 1));
}
.bg-canvas-light {
  --tw-bg-opacity: 1;
  background-color: rgb(244 247 254 / var(--tw-bg-opacity, 1));
}
.bg-danger-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(253 236 236 / var(--tw-bg-opacity, 1));
}
.bg-danger-50\/70 {
  background-color: rgb(253 236 236 / 0.7);
}
.bg-danger-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(238 93 80 / var(--tw-bg-opacity, 1));
}
.bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(238 240 246 / var(--tw-bg-opacity, 1));
}
.bg-gray-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(218 222 236 / var(--tw-bg-opacity, 1));
}
.bg-gray-300 {
  --tw-bg-opacity: 1;
  background-color: rgb(201 208 227 / var(--tw-bg-opacity, 1));
}
.bg-gray-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(245 246 250 / var(--tw-bg-opacity, 1));
}
.bg-gray-50\/70 {
  background-color: rgb(245 246 250 / 0.7);
}
.bg-gray-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(163 174 208 / var(--tw-bg-opacity, 1));
}
.bg-indigo-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(224 231 255 / var(--tw-bg-opacity, 1));
}
.bg-navy-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(27 37 75 / var(--tw-bg-opacity, 1));
}
.bg-navy-900\/40 {
  background-color: rgb(11 20 55 / 0.4);
}
.bg-success-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(230 250 240 / var(--tw-bg-opacity, 1));
}
.bg-success-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(5 205 153 / var(--tw-bg-opacity, 1));
}
.bg-transparent {
  background-color: transparent;
}
.bg-warning-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(255 246 229 / var(--tw-bg-opacity, 1));
}
.bg-warning-50\/40 {
  background-color: rgb(255 246 229 / 0.4);
}
.bg-warning-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(255 181 71 / var(--tw-bg-opacity, 1));
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-white\/10 {
  background-color: rgb(255 255 255 / 0.1);
}
.bg-clip-border {
  background-clip: border-box;
}
.p-0\.5 {
  padding: 0.125rem;
}
.p-1 {
  padding: 0.25rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-8 {
  padding: 2rem;
}
.\!px-2 {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}
.\!py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}
.px-0\.5 {
  padding-left: 0.125rem;
  padding-right: 0.125rem;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-2\.5 {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.px-\[18px\] {
  padding-left: 18px;
  padding-right: 18px;
}
.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.\!pt-\[10px\] {
  padding-top: 10px !important;
}
.pb-1 {
  padding-bottom: 0.25rem;
}
.pb-1\.5 {
  padding-bottom: 0.375rem;
}
.pb-10 {
  padding-bottom: 2.5rem;
}
.pb-2 {
  padding-bottom: 0.5rem;
}
.pb-3 {
  padding-bottom: 0.75rem;
}
.pb-4 {
  padding-bottom: 1rem;
}
.pb-6 {
  padding-bottom: 1.5rem;
}
.pe-1 {
  padding-inline-end: 0.25rem;
}
.pe-4 {
  padding-inline-end: 1rem;
}
.pe-9 {
  padding-inline-end: 2.25rem;
}
.ps-1\.5 {
  padding-inline-start: 0.375rem;
}
.ps-11 {
  padding-inline-start: 2.75rem;
}
.ps-2\.5 {
  padding-inline-start: 0.625rem;
}
.ps-5 {
  padding-inline-start: 1.25rem;
}
.pt-1 {
  padding-top: 0.25rem;
}
.pt-2\.5 {
  padding-top: 0.625rem;
}
.pt-3 {
  padding-top: 0.75rem;
}
.pt-4 {
  padding-top: 1rem;
}
.pt-5 {
  padding-top: 1.25rem;
}
.text-center {
  text-align: center;
}
.text-start {
  text-align: start;
}
.text-end {
  text-align: end;
}
.align-top {
  vertical-align: top;
}
.align-middle {
  vertical-align: middle;
}
.font-display {
  font-family: var(--font-poppins), Poppins, system-ui, sans-serif;
}
.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.font-sans {
  font-family: var(--font-dm-sans), DM Sans, system-ui, sans-serif;
}
.\!text-2xl {
  font-size: 1.5rem !important;
  line-height: 2rem !important;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-\[22px\] {
  font-size: 22px;
}
.text-\[33px\] {
  font-size: 33px;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-bold {
  font-weight: 700;
}
.font-medium {
  font-weight: 500;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.capitalize {
  text-transform: capitalize;
}
.normal-case {
  text-transform: none;
}
.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-4 {
  line-height: 1rem;
}
.leading-5 {
  line-height: 1.25rem;
}
.leading-\[18px\] {
  line-height: 18px;
}
.leading-\[2\.4\] {
  line-height: 2.4;
}
.leading-none {
  line-height: 1;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-snug {
  line-height: 1.375;
}
.leading-tight {
  line-height: 1.25;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-wide {
  letter-spacing: 0.025em;
}
.tracking-wider {
  letter-spacing: 0.05em;
}
.\!text-navy-700 {
  --tw-text-opacity: 1 !important;
  color: rgb(27 37 75 / var(--tw-text-opacity, 1)) !important;
}
.text-brand-500 {
  --tw-text-opacity: 1;
  color: rgb(109 61 176 / var(--tw-text-opacity, 1));
}
.text-brand-600 {
  --tw-text-opacity: 1;
  color: rgb(85 42 140 / var(--tw-text-opacity, 1));
}
.text-brand-700 {
  --tw-text-opacity: 1;
  color: rgb(53 13 96 / var(--tw-text-opacity, 1));
}
.text-danger-600 {
  --tw-text-opacity: 1;
  color: rgb(211 58 44 / var(--tw-text-opacity, 1));
}
.text-danger-700 {
  --tw-text-opacity: 1;
  color: rgb(163 38 25 / var(--tw-text-opacity, 1));
}
.text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(176 187 213 / var(--tw-text-opacity, 1));
}
.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(181 190 217 / var(--tw-text-opacity, 1));
}
.text-gray-600 {
  --tw-text-opacity: 1;
  color: rgb(163 174 208 / var(--tw-text-opacity, 1));
}
.text-gray-700 {
  --tw-text-opacity: 1;
  color: rgb(112 126 174 / var(--tw-text-opacity, 1));
}
.text-navy-700 {
  --tw-text-opacity: 1;
  color: rgb(27 37 75 / var(--tw-text-opacity, 1));
}
.text-success-600 {
  --tw-text-opacity: 1;
  color: rgb(4 168 125 / var(--tw-text-opacity, 1));
}
.text-success-700 {
  --tw-text-opacity: 1;
  color: rgb(3 122 91 / var(--tw-text-opacity, 1));
}
.text-transparent {
  color: transparent;
}
.text-warning-500 {
  --tw-text-opacity: 1;
  color: rgb(255 181 71 / var(--tw-text-opacity, 1));
}
.text-warning-600 {
  --tw-text-opacity: 1;
  color: rgb(224 145 34 / var(--tw-text-opacity, 1));
}
.text-warning-700 {
  --tw-text-opacity: 1;
  color: rgb(169 106 18 / var(--tw-text-opacity, 1));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.underline {
  text-decoration-line: underline;
}
.decoration-gray-300 {
  text-decoration-color: #C9D0E3;
}
.decoration-dotted {
  text-decoration-style: dotted;
}
.underline-offset-2 {
  text-underline-offset: 2px;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.accent-brand-500 {
  accent-color: #6D3DB0;
}
.opacity-0 {
  opacity: 0;
}
.opacity-40 {
  opacity: 0.4;
}
.opacity-60 {
  opacity: 0.6;
}
.opacity-70 {
  opacity: 0.7;
}
.opacity-80 {
  opacity: 0.8;
}
.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-2xl {
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_25px_50px_-12px_rgba\(112\2c 144\2c 176\2c 0\.08\)\] {
  --tw-shadow: 0 25px 50px -12px rgba(112,144,176,0.08);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_2px_5px_rgba\(0\2c 0\2c 0\2c 0\.2\)\] {
  --tw-shadow: 0 2px 5px rgba(0,0,0,0.2);
  --tw-shadow-colored: 0 2px 5px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[14px_17px_40px_4px_rgba\(112\2c 144\2c 176\2c 0\.08\)\] {
  --tw-shadow: 14px 17px 40px 4px rgba(112,144,176,0.08);
  --tw-shadow-colored: 14px 17px 40px 4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-card {
  --tw-shadow: 0px 18px 40px rgba(112, 144, 176, 0.12);
  --tw-shadow-colored: 0px 18px 40px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-raised {
  --tw-shadow: 0px 24px 55px rgba(112, 144, 176, 0.22);
  --tw-shadow-colored: 0px 24px 55px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xl {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.outline {
  outline-style: solid;
}
.ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-1 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-4 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-brand-300 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(168 130 214 / var(--tw-ring-opacity, 1));
}
.ring-brand-500 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(109 61 176 / var(--tw-ring-opacity, 1));
}
.ring-danger-500\/60 {
  --tw-ring-color: rgb(238 93 80 / 0.6);
}
.ring-white {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity, 1));
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur-\[2px\] {
  --tw-backdrop-blur: blur(2px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-sm {
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-xl {
  --tw-backdrop-blur: blur(24px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-filter {
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[margin\] {
  transition-property: margin;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[width\] {
  transition-property: width;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-shadow {
  transition-property: box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.duration-500 {
  transition-duration: 500ms;
}
.\[--xy-attribution-background-color-default\:transparent\] {
  --xy-attribution-background-color-default: transparent;
}
.\[--xy-background-color-default\:\#FFFFFF\] {
  --xy-background-color-default: #FFFFFF;
}
.\[--xy-background-pattern-dots-color-default\:\#DADEEC\] {
  --xy-background-pattern-dots-color-default: #DADEEC;
}
.\[--xy-connectionline-stroke-default\:\#6D3DB0\] {
  --xy-connectionline-stroke-default: #6D3DB0;
}
.\[--xy-controls-button-background-color-default\:\#FFFFFF\] {
  --xy-controls-button-background-color-default: #FFFFFF;
}
.\[--xy-controls-button-background-color-hover-default\:\#EEF0F6\] {
  --xy-controls-button-background-color-hover-default: #EEF0F6;
}
.\[--xy-controls-button-border-color-default\:\#DADEEC\] {
  --xy-controls-button-border-color-default: #DADEEC;
}
.\[--xy-controls-button-color-default\:\#707EAE\] {
  --xy-controls-button-color-default: #707EAE;
}
.\[--xy-controls-button-color-hover-default\:\#1B254B\] {
  --xy-controls-button-color-hover-default: #1B254B;
}
.\[--xy-edge-stroke-default\:\#A3AED0\] {
  --xy-edge-stroke-default: #A3AED0;
}
.\[--xy-edge-stroke-selected-default\:\#6D3DB0\] {
  --xy-edge-stroke-selected-default: #6D3DB0;
}
.\[--xy-edge-stroke-width-default\:1\.5\] {
  --xy-edge-stroke-width-default: 1.5;
}
.\[--xy-handle-background-color-default\:\#FFFFFF\] {
  --xy-handle-background-color-default: #FFFFFF;
}
.\[--xy-handle-border-color-default\:\#A3AED0\] {
  --xy-handle-border-color-default: #A3AED0;
}
.\[--xy-minimap-background-color-default\:\#F5F6FA\] {
  --xy-minimap-background-color-default: #F5F6FA;
}
.\[--xy-minimap-mask-background-color-default\:rgba\(163\2c 174\2c 208\2c 0\.25\)\] {
  --xy-minimap-mask-background-color-default: rgba(163,174,208,0.25);
}
.\[--xy-minimap-node-background-color-default\:\#C9D0E3\] {
  --xy-minimap-node-background-color-default: #C9D0E3;
}

/*
  The base layer, and deliberately almost nothing in it.

  Everything else in this system is a component or a utility, because a base
  layer that styles elements is one where a heading in a table inherits a
  margin nobody asked for and the fix is a `!important` three files away. What
  is here is what genuinely belongs to the document: the page colour, the text
  colour, the font, and the two behaviours a scrollable app needs.
*/

/*
  Respecting the setting, not overriding it. Somebody who has asked their
  operating system to stop animating things has usually asked for a reason.
*/
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
.file\:me-3::file-selector-button {
  margin-inline-end: 0.75rem;
}
.file\:cursor-pointer::file-selector-button {
  cursor: pointer;
}
.file\:rounded-control::file-selector-button {
  border-radius: 12px;
}
.file\:border-0::file-selector-button {
  border-width: 0px;
}
.file\:bg-brand-50::file-selector-button {
  --tw-bg-opacity: 1;
  background-color: rgb(243 238 250 / var(--tw-bg-opacity, 1));
}
.file\:px-3::file-selector-button {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.file\:px-4::file-selector-button {
  padding-left: 1rem;
  padding-right: 1rem;
}
.file\:py-2::file-selector-button {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.file\:text-sm::file-selector-button {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.file\:font-medium::file-selector-button {
  font-weight: 500;
}
.file\:text-brand-600::file-selector-button {
  --tw-text-opacity: 1;
  color: rgb(85 42 140 / var(--tw-text-opacity, 1));
}
.placeholder\:text-gray-500::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(181 190 217 / var(--tw-text-opacity, 1));
}
.placeholder\:text-gray-500::placeholder {
  --tw-text-opacity: 1;
  color: rgb(181 190 217 / var(--tw-text-opacity, 1));
}
.first\:pt-0:first-child {
  padding-top: 0px;
}
.first\:pt-1:first-child {
  padding-top: 0.25rem;
}
.last\:border-0:last-child {
  border-width: 0px;
}
.last\:pb-0:last-child {
  padding-bottom: 0px;
}
.odd\:bg-gray-50:nth-child(odd) {
  --tw-bg-opacity: 1;
  background-color: rgb(245 246 250 / var(--tw-bg-opacity, 1));
}
.checked\:border-none:checked {
  border-style: none;
}
.checked\:border-transparent:checked {
  border-color: transparent;
}
.checked\:bg-brand-500:checked {
  --tw-bg-opacity: 1;
  background-color: rgb(109 61 176 / var(--tw-bg-opacity, 1));
}
.hover\:\!border-gray-200:hover {
  --tw-border-opacity: 1 !important;
  border-color: rgb(218 222 236 / var(--tw-border-opacity, 1)) !important;
}
.hover\:border-brand-200:hover {
  --tw-border-opacity: 1;
  border-color: rgb(198 172 229 / var(--tw-border-opacity, 1));
}
.hover\:border-brand-300:hover {
  --tw-border-opacity: 1;
  border-color: rgb(168 130 214 / var(--tw-border-opacity, 1));
}
.hover\:border-brand-400:hover {
  --tw-border-opacity: 1;
  border-color: rgb(139 95 196 / var(--tw-border-opacity, 1));
}
.hover\:border-gray-300:hover {
  --tw-border-opacity: 1;
  border-color: rgb(201 208 227 / var(--tw-border-opacity, 1));
}
.hover\:bg-brand-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(226 213 242 / var(--tw-bg-opacity, 1));
}
.hover\:bg-brand-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(243 238 250 / var(--tw-bg-opacity, 1));
}
.hover\:bg-brand-600:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(85 42 140 / var(--tw-bg-opacity, 1));
}
.hover\:bg-danger-600:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(211 58 44 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(238 240 246 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-200:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(218 222 236 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(245 246 250 / var(--tw-bg-opacity, 1));
}
.hover\:text-brand-600:hover {
  --tw-text-opacity: 1;
  color: rgb(85 42 140 / var(--tw-text-opacity, 1));
}
.hover\:text-brand-700:hover {
  --tw-text-opacity: 1;
  color: rgb(53 13 96 / var(--tw-text-opacity, 1));
}
.hover\:text-danger-700:hover {
  --tw-text-opacity: 1;
  color: rgb(163 38 25 / var(--tw-text-opacity, 1));
}
.hover\:text-navy-700:hover {
  --tw-text-opacity: 1;
  color: rgb(27 37 75 / var(--tw-text-opacity, 1));
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.hover\:decoration-brand-400:hover {
  text-decoration-color: #8B5FC4;
}
.hover\:file\:bg-brand-100::file-selector-button:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(226 213 242 / var(--tw-bg-opacity, 1));
}
.focus\:border-brand-400:focus {
  --tw-border-opacity: 1;
  border-color: rgb(139 95 196 / var(--tw-border-opacity, 1));
}
.focus-visible\:outline-none:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus-visible\:ring-2:focus-visible {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:ring-brand-400:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(139 95 196 / var(--tw-ring-opacity, 1));
}
.focus-visible\:ring-offset-2:focus-visible {
  --tw-ring-offset-width: 2px;
}
.active\:cursor-grabbing:active {
  cursor: grabbing;
}
.active\:bg-brand-700:active {
  --tw-bg-opacity: 1;
  background-color: rgb(53 13 96 / var(--tw-bg-opacity, 1));
}
.active\:bg-danger-700:active {
  --tw-bg-opacity: 1;
  background-color: rgb(163 38 25 / var(--tw-bg-opacity, 1));
}
.disabled\:cursor-not-allowed:disabled {
  cursor: not-allowed;
}
.disabled\:opacity-50:disabled {
  opacity: 0.5;
}
.peer:checked ~ .peer-checked\:bg-brand-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(109 61 176 / var(--tw-bg-opacity, 1));
}
.peer:checked ~ .peer-checked\:opacity-100 {
  opacity: 1;
}
.peer:focus-visible ~ .peer-focus-visible\:ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.peer:focus-visible ~ .peer-focus-visible\:ring-brand-400 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(139 95 196 / var(--tw-ring-opacity, 1));
}
.peer:focus-visible ~ .peer-focus-visible\:ring-offset-2 {
  --tw-ring-offset-width: 2px;
}
@media (prefers-reduced-motion: no-preference) {

  @keyframes fade-in {

    from {
      opacity: 0;
      transform: translateY(4px);
    }

    to {
      opacity: 1;
      transform: none;
    }
  }

  .motion-safe\:animate-fade-in {
    animation: fade-in 160ms ease-out;
  }
}
.dark\:block:is(.dark *) {
  display: block;
}
.dark\:hidden:is(.dark *) {
  display: none;
}
.dark\:divide-coal-700:is(.dark *) > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(27 29 34 / var(--tw-divide-opacity, 1));
}
.dark\:divide-coal-700\/60:is(.dark *) > :not([hidden]) ~ :not([hidden]) {
  border-color: rgb(27 29 34 / 0.6);
}
.dark\:border-brand-400:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(139 95 196 / var(--tw-border-opacity, 1));
}
.dark\:border-brand-500\/25:is(.dark *) {
  border-color: rgb(109 61 176 / 0.25);
}
.dark\:border-brand-500\/30:is(.dark *) {
  border-color: rgb(109 61 176 / 0.3);
}
.dark\:border-brand-500\/40:is(.dark *) {
  border-color: rgb(109 61 176 / 0.4);
}
.dark\:border-brand-500\/60:is(.dark *) {
  border-color: rgb(109 61 176 / 0.6);
}
.dark\:border-coal-600:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(39 42 49 / var(--tw-border-opacity, 1));
}
.dark\:border-coal-700:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(27 29 34 / var(--tw-border-opacity, 1));
}
.dark\:border-coal-700\/60:is(.dark *) {
  border-color: rgb(27 29 34 / 0.6);
}
.dark\:border-danger-500\/30:is(.dark *) {
  border-color: rgb(238 93 80 / 0.3);
}
.dark\:border-warning-500\/30:is(.dark *) {
  border-color: rgb(255 181 71 / 0.3);
}
.dark\:border-warning-500\/40:is(.dark *) {
  border-color: rgb(255 181 71 / 0.4);
}
.dark\:border-t-brand-400:is(.dark *) {
  --tw-border-opacity: 1;
  border-top-color: rgb(139 95 196 / var(--tw-border-opacity, 1));
}
.dark\:\!bg-navy-800:is(.dark *) {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(17 28 68 / var(--tw-bg-opacity, 1)) !important;
}
.dark\:bg-\[\#0b14374d\]:is(.dark *) {
  background-color: #0b14374d;
}
.dark\:bg-brand-400:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(139 95 196 / var(--tw-bg-opacity, 1));
}
.dark\:bg-brand-500:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(109 61 176 / var(--tw-bg-opacity, 1));
}
.dark\:bg-brand-500\/10:is(.dark *) {
  background-color: rgb(109 61 176 / 0.1);
}
.dark\:bg-brand-500\/15:is(.dark *) {
  background-color: rgb(109 61 176 / 0.15);
}
.dark\:bg-brand-500\/5:is(.dark *) {
  background-color: rgb(109 61 176 / 0.05);
}
.dark\:bg-canvas-dark:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(8 9 11 / var(--tw-bg-opacity, 1));
}
.dark\:bg-coal-600:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(39 42 49 / var(--tw-bg-opacity, 1));
}
.dark\:bg-coal-700:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 34 / var(--tw-bg-opacity, 1));
}
.dark\:bg-coal-700\/60:is(.dark *) {
  background-color: rgb(27 29 34 / 0.6);
}
.dark\:bg-coal-800:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(18 19 22 / var(--tw-bg-opacity, 1));
}
.dark\:bg-coal-900:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(10 11 13 / var(--tw-bg-opacity, 1));
}
.dark\:bg-coal-900\/40:is(.dark *) {
  background-color: rgb(10 11 13 / 0.4);
}
.dark\:bg-coal-900\/50:is(.dark *) {
  background-color: rgb(10 11 13 / 0.5);
}
.dark\:bg-coal-900\/60:is(.dark *) {
  background-color: rgb(10 11 13 / 0.6);
}
.dark\:bg-danger-500\/10:is(.dark *) {
  background-color: rgb(238 93 80 / 0.1);
}
.dark\:bg-danger-500\/15:is(.dark *) {
  background-color: rgb(238 93 80 / 0.15);
}
.dark\:bg-gray-500:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(181 190 217 / var(--tw-bg-opacity, 1));
}
.dark\:bg-success-500\/15:is(.dark *) {
  background-color: rgb(5 205 153 / 0.15);
}
.dark\:bg-warning-500\/10:is(.dark *) {
  background-color: rgb(255 181 71 / 0.1);
}
.dark\:bg-warning-500\/15:is(.dark *) {
  background-color: rgb(255 181 71 / 0.15);
}
.dark\:bg-warning-500\/20:is(.dark *) {
  background-color: rgb(255 181 71 / 0.2);
}
.dark\:bg-warning-500\/5:is(.dark *) {
  background-color: rgb(255 181 71 / 0.05);
}
.dark\:bg-white:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.dark\:bg-white\/30:is(.dark *) {
  background-color: rgb(255 255 255 / 0.3);
}
.dark\:bg-white\/5:is(.dark *) {
  background-color: rgb(255 255 255 / 0.05);
}
.dark\:\!text-white:is(.dark *) {
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}
.dark\:text-brand-200:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(198 172 229 / var(--tw-text-opacity, 1));
}
.dark\:text-brand-300:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(168 130 214 / var(--tw-text-opacity, 1));
}
.dark\:text-coal-600:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(39 42 49 / var(--tw-text-opacity, 1));
}
.dark\:text-danger-500:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(238 93 80 / var(--tw-text-opacity, 1));
}
.dark\:text-gray-100:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(238 240 246 / var(--tw-text-opacity, 1));
}
.dark\:text-gray-200:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(218 222 236 / var(--tw-text-opacity, 1));
}
.dark\:text-gray-400:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(176 187 213 / var(--tw-text-opacity, 1));
}
.dark\:text-gray-500:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(181 190 217 / var(--tw-text-opacity, 1));
}
.dark\:text-success-500:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(5 205 153 / var(--tw-text-opacity, 1));
}
.dark\:text-warning-500:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 181 71 / var(--tw-text-opacity, 1));
}
.dark\:text-white:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.dark\:decoration-coal-600:is(.dark *) {
  text-decoration-color: #272A31;
}
.dark\:shadow-none:is(.dark *) {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.dark\:ring-brand-500\/40:is(.dark *) {
  --tw-ring-color: rgb(109 61 176 / 0.4);
}
.dark\:ring-coal-800:is(.dark *) {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(18 19 22 / var(--tw-ring-opacity, 1));
}
.dark\:\[--xy-background-color-default\:\#111c44\]:is(.dark *) {
  --xy-background-color-default: #111c44;
}
.dark\:\[--xy-background-pattern-dots-color-default\:\#1B254B\]:is(.dark *) {
  --xy-background-pattern-dots-color-default: #1B254B;
}
.dark\:\[--xy-connectionline-stroke-default\:\#A882D6\]:is(.dark *) {
  --xy-connectionline-stroke-default: #A882D6;
}
.dark\:\[--xy-controls-button-background-color-default\:\#1B254B\]:is(.dark *) {
  --xy-controls-button-background-color-default: #1B254B;
}
.dark\:\[--xy-controls-button-background-color-hover-default\:\#24388a\]:is(.dark *) {
  --xy-controls-button-background-color-hover-default: #24388a;
}
.dark\:\[--xy-controls-button-border-color-default\:\#24388a\]:is(.dark *) {
  --xy-controls-button-border-color-default: #24388a;
}
.dark\:\[--xy-controls-button-color-default\:\#C9D0E3\]:is(.dark *) {
  --xy-controls-button-color-default: #C9D0E3;
}
.dark\:\[--xy-controls-button-color-hover-default\:\#FFFFFF\]:is(.dark *) {
  --xy-controls-button-color-hover-default: #FFFFFF;
}
.dark\:\[--xy-edge-stroke-default\:\#707EAE\]:is(.dark *) {
  --xy-edge-stroke-default: #707EAE;
}
.dark\:\[--xy-edge-stroke-selected-default\:\#A882D6\]:is(.dark *) {
  --xy-edge-stroke-selected-default: #A882D6;
}
.dark\:\[--xy-handle-background-color-default\:\#111c44\]:is(.dark *) {
  --xy-handle-background-color-default: #111c44;
}
.dark\:\[--xy-handle-border-color-default\:\#707EAE\]:is(.dark *) {
  --xy-handle-border-color-default: #707EAE;
}
.dark\:\[--xy-minimap-background-color-default\:\#0b1437\]:is(.dark *) {
  --xy-minimap-background-color-default: #0b1437;
}
.dark\:\[--xy-minimap-mask-background-color-default\:rgba\(11\2c 20\2c 55\2c 0\.6\)\]:is(.dark *) {
  --xy-minimap-mask-background-color-default: rgba(11,20,55,0.6);
}
.dark\:\[--xy-minimap-node-background-color-default\:\#24388a\]:is(.dark *) {
  --xy-minimap-node-background-color-default: #24388a;
}
.dark\:file\:bg-coal-700:is(.dark *)::file-selector-button {
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 34 / var(--tw-bg-opacity, 1));
}
.dark\:file\:text-white:is(.dark *)::file-selector-button {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.dark\:odd\:bg-coal-900\/40:nth-child(odd):is(.dark *) {
  background-color: rgb(10 11 13 / 0.4);
}
.dark\:checked\:bg-brand-400:checked:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(139 95 196 / var(--tw-bg-opacity, 1));
}
.dark\:hover\:\!border-navy-600:hover:is(.dark *) {
  --tw-border-opacity: 1 !important;
  border-color: rgb(36 56 138 / var(--tw-border-opacity, 1)) !important;
}
.dark\:hover\:border-brand-500\/40:hover:is(.dark *) {
  border-color: rgb(109 61 176 / 0.4);
}
.dark\:hover\:border-coal-500:hover:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(58 62 71 / var(--tw-border-opacity, 1));
}
.dark\:hover\:border-coal-600:hover:is(.dark *) {
  --tw-border-opacity: 1;
  border-color: rgb(39 42 49 / var(--tw-border-opacity, 1));
}
.dark\:hover\:bg-brand-500\/25:hover:is(.dark *) {
  background-color: rgb(109 61 176 / 0.25);
}
.dark\:hover\:bg-coal-600:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(39 42 49 / var(--tw-bg-opacity, 1));
}
.dark\:hover\:bg-coal-700:hover:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(27 29 34 / var(--tw-bg-opacity, 1));
}
.dark\:hover\:bg-coal-700\/40:hover:is(.dark *) {
  background-color: rgb(27 29 34 / 0.4);
}
.dark\:hover\:bg-coal-900\/40:hover:is(.dark *) {
  background-color: rgb(10 11 13 / 0.4);
}
.dark\:hover\:text-brand-200:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(198 172 229 / var(--tw-text-opacity, 1));
}
.dark\:hover\:text-brand-300:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(168 130 214 / var(--tw-text-opacity, 1));
}
.dark\:hover\:text-white:hover:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.dark\:hover\:file\:bg-coal-600:is(.dark *)::file-selector-button:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(39 42 49 / var(--tw-bg-opacity, 1));
}
.dark\:focus-visible\:ring-brand-300:focus-visible:is(.dark *) {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(168 130 214 / var(--tw-ring-opacity, 1));
}
.dark\:focus-visible\:ring-offset-coal-800:focus-visible:is(.dark *) {
  --tw-ring-offset-color: #121316;
}
.peer:checked ~ .dark\:peer-checked\:bg-brand-400:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(139 95 196 / var(--tw-bg-opacity, 1));
}
.peer:checked ~ .dark\:peer-checked\:bg-brand-500:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(109 61 176 / var(--tw-bg-opacity, 1));
}
.peer:focus-visible ~ .dark\:peer-focus-visible\:ring-brand-300:is(.dark *) {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(168 130 214 / var(--tw-ring-opacity, 1));
}
.peer:focus-visible ~ .dark\:peer-focus-visible\:ring-offset-coal-800:is(.dark *) {
  --tw-ring-offset-color: #121316;
}
@media (min-width: 576px) {

  .sm\:col-span-1 {
    grid-column: span 1 / span 1;
  }

  .sm\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .sm\:grid {
    display: grid;
  }

  .sm\:w-16 {
    width: 4rem;
  }

  .sm\:w-44 {
    width: 11rem;
  }

  .sm\:max-w-2xl {
    max-width: 42rem;
  }

  .sm\:max-w-md {
    max-width: 28rem;
  }

  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sm\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .sm\:grid-cols-\[minmax\(0\2c 1fr\)_8rem\] {
    grid-template-columns: minmax(0,1fr) 8rem;
  }

  .sm\:grid-cols-\[minmax\(5\.5rem\2c 1fr\)_minmax\(0\2c 1fr\)_minmax\(0\2c 1fr\)_auto\] {
    grid-template-columns: minmax(5.5rem,1fr) minmax(0,1fr) minmax(0,1fr) auto;
  }

  .sm\:gap-x-3 {
    -moz-column-gap: 0.75rem;
         column-gap: 0.75rem;
  }

  .sm\:px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .sm\:pb-0 {
    padding-bottom: 0px;
  }
}
@media (min-width: 768px) {

  .md\:block {
    display: block;
  }

  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .md\:grid-cols-\[minmax\(0\2c 1\.4fr\)_1fr_1fr\] {
    grid-template-columns: minmax(0,1.4fr) 1fr 1fr;
  }

  .md\:gap-2 {
    gap: 0.5rem;
  }

  .md\:p-2 {
    padding: 0.5rem;
  }

  .md\:pe-2 {
    padding-inline-end: 0.5rem;
  }

  .md\:pr-2 {
    padding-right: 0.5rem;
  }

  .md\:text-\[33px\] {
    font-size: 33px;
  }
}
@media (min-width: 992px) {

  .lg\:sticky {
    position: sticky;
  }

  .lg\:top-\[var\(--shell-bar-h\)\] {
    top: var(--shell-bar-h);
  }

  .lg\:col-span-1 {
    grid-column: span 1 / span 1;
  }

  .lg\:max-h-\[calc\(100vh-var\(--shell-bar-h\)-2rem\)\] {
    max-height: calc(100vh - var(--shell-bar-h) - 2rem);
  }

  .lg\:w-auto {
    width: auto;
  }

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:grid-cols-\[22rem_minmax\(0\2c 1fr\)\] {
    grid-template-columns: 22rem minmax(0,1fr);
  }

  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_21rem\] {
    grid-template-columns: minmax(0,1fr) 21rem;
  }

  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_7rem_9rem_11rem_auto\] {
    grid-template-columns: minmax(0,1fr) 7rem 9rem 11rem auto;
  }

  .lg\:items-end {
    align-items: flex-end;
  }

  .lg\:self-start {
    align-self: flex-start;
  }

  .lg\:overflow-y-auto {
    overflow-y: auto;
  }
}
@media (min-width: 1200px) {

  .xl\:absolute {
    position: absolute;
  }

  .xl\:sticky {
    position: sticky;
  }

  .xl\:end-3 {
    inset-inline-end: 0.75rem;
  }

  .xl\:start-0 {
    inset-inline-start: 0px;
  }

  .xl\:top-1 {
    top: 0.25rem;
  }

  .xl\:top-\[var\(--shell-bar-h\)\] {
    top: var(--shell-bar-h);
  }

  .xl\:\!z-0 {
    z-index: 0 !important;
  }

  .xl\:z-0 {
    z-index: 0;
  }

  .xl\:ml-\[323px\] {
    margin-left: 323px;
  }

  .xl\:ms-0 {
    margin-inline-start: 0px;
  }

  .xl\:ms-\[var\(--shell-rail-collapsed-offset\)\] {
    margin-inline-start: var(--shell-rail-collapsed-offset);
  }

  .xl\:ms-\[var\(--shell-rail-offset\)\] {
    margin-inline-start: var(--shell-rail-offset);
  }

  .xl\:block {
    display: block;
  }

  .xl\:grid {
    display: grid;
  }

  .xl\:hidden {
    display: none;
  }

  .xl\:h-\[42rem\] {
    height: 42rem;
  }

  .xl\:max-h-\[calc\(100vh-var\(--shell-bar-h\)-2rem\)\] {
    max-height: calc(100vh - var(--shell-bar-h) - 2rem);
  }

  .xl\:w-\[var\(--shell-rail-collapsed\)\] {
    width: var(--shell-rail-collapsed);
  }

  .xl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .xl\:grid-cols-\[25rem_minmax\(0\2c 1fr\)\] {
    grid-template-columns: 25rem minmax(0,1fr);
  }

  .xl\:grid-cols-\[minmax\(0\2c 1fr\)_22rem\] {
    grid-template-columns: minmax(0,1fr) 22rem;
  }

  .xl\:grid-cols-\[minmax\(0\2c 1fr\)_380px\] {
    grid-template-columns: minmax(0,1fr) 380px;
  }

  .xl\:justify-center {
    justify-content: center;
  }

  .xl\:self-start {
    align-self: flex-start;
  }

  .xl\:overflow-y-auto {
    overflow-y: auto;
  }

  .xl\:px-0 {
    padding-left: 0px;
    padding-right: 0px;
  }

  .xl\:px-1\.5 {
    padding-left: 0.375rem;
    padding-right: 0.375rem;
  }

  .xl\:shadow-none {
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .xl\:dark\:block:is(.dark *) {
    display: block;
  }
}
@media (min-width: 1320px) {

  .\32xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.peer:checked ~ .peer-checked\:\[\&\>span\]\:ms-5>span {
  margin-inline-start: 1.25rem;
}