/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/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: #e5e7eb; /* 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: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe 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: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 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 {
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  }

  html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

  body {
  --tw-bg-opacity: 1;
  background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 0.9375rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(15 23 42 / var(--tw-text-opacity, 1));
}

  /* Scrollbar — thin, subtle, professional */
  ::-webkit-scrollbar { width: 6px; height: 6px; }
  ::-webkit-scrollbar-track { background: transparent; }
  ::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: 3px; }
  ::-webkit-scrollbar-thumb:hover { background: #94A3B8; }
/* Card — the primary surface container */
.card {
  border-radius: 0.75rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.06), 0 1px 2px -1px rgb(0 0 0 / 0.04);
  --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);
}
/* KPI Card — dashboard metric card */
.kpi-card {
  border-radius: 0.75rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.06), 0 1px 2px -1px rgb(0 0 0 / 0.04);
  --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);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 1.25rem;
}
/* Status badge */
.badge {
  display: inline-flex;
  align-items: center;
  border-radius: 9999px;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
}
/* Button base */
/* Input */
.input {
  height: 2.5rem;
  width: 100%;
  border-radius: 0.75rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  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;
}
.input::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}
.input::placeholder {
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}
.input:focus {
  --tw-border-opacity: 1;
  border-color: rgb(79 70 229 / var(--tw-border-opacity, 1));
  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-color: rgb(79 70 229 / 0.3);
}
.input-error {
  --tw-border-opacity: 1;
  border-color: rgb(220 38 38 / var(--tw-border-opacity, 1));
}
.input-error:focus {
  --tw-border-opacity: 1;
  border-color: rgb(220 38 38 / var(--tw-border-opacity, 1));
  --tw-ring-color: rgb(220 38 38 / 0.3);
}
/* Data table */
.table-header {
  position: sticky;
  top: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  text-align: left;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}
.table-row {
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
  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;
}
.table-row:hover {
  background-color: rgb(238 242 255 / 0.4);
}
.table-cell {
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(15 23 42 / var(--tw-text-opacity, 1));
}
/* Alert banner */
.alert {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  border-radius: 0.75rem;
  border-width: 1px;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
/* Live indicator */
.live-dot {
  height: 0.5rem;
  width: 0.5rem;
}
@keyframes pulse-live {

  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: 0.5;
  }
}
.live-dot {
  animation: pulse-live 2s ease-in-out infinite;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(16 185 129 / var(--tw-bg-opacity, 1));
}
/* App shell layout */
.app-shell {
  display: flex;
  height: 100vh;
  overflow: hidden;
}
.app-sidebar {
  display: flex;
  width: 15rem;
  min-width: 240px;
  flex-direction: column;
  border-right-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.app-topnav {
  display: flex;
  height: 4rem;
  align-items: center;
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.app-main {
  flex: 1 1 0%;
  overflow-y: auto;
  --tw-bg-opacity: 1;
  background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));
}
.app-content {
  margin-left: auto;
  margin-right: auto;
  max-width: 80rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
/* Sidebar nav item */
.nav-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  border-radius: 0.75rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
  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;
}
.nav-item:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(15 23 42 / var(--tw-text-opacity, 1));
}
.nav-item-active {
  --tw-bg-opacity: 1;
  background-color: rgb(238 242 255 / var(--tw-bg-opacity, 1));
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(79 70 229 / var(--tw-text-opacity, 1));
}
.pointer-events-none {
  pointer-events: none;
}
.visible {
  visibility: visible;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.inset-0 {
  inset: 0px;
}
.inset-y-0 {
  top: 0px;
  bottom: 0px;
}
.-bottom-32 {
  bottom: -8rem;
}
.-left-24 {
  left: -6rem;
}
.-right-24 {
  right: -6rem;
}
.-top-24 {
  top: -6rem;
}
.bottom-4 {
  bottom: 1rem;
}
.bottom-\[-5\%\] {
  bottom: -5%;
}
.left-1\/2 {
  left: 50%;
}
.left-3 {
  left: 0.75rem;
}
.right-0 {
  right: 0px;
}
.right-2 {
  right: 0.5rem;
}
.right-3 {
  right: 0.75rem;
}
.right-4 {
  right: 1rem;
}
.top-0 {
  top: 0px;
}
.top-1\/2 {
  top: 50%;
}
.z-10 {
  z-index: 10;
}
.z-50 {
  z-index: 50;
}
.z-\[60\] {
  z-index: 60;
}
.mx-4 {
  margin-left: 1rem;
  margin-right: 1rem;
}
.mx-6 {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
.-mb-px {
  margin-bottom: -1px;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.ml-0\.5 {
  margin-left: 0.125rem;
}
.mr-1 {
  margin-right: 0.25rem;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.block {
  display: block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.table-cell {
  display: table-cell;
}
.table-row {
  display: table-row;
}
.hidden {
  display: none;
}
.h-1\.5 {
  height: 0.375rem;
}
.h-10 {
  height: 2.5rem;
}
.h-11 {
  height: 2.75rem;
}
.h-12 {
  height: 3rem;
}
.h-16 {
  height: 4rem;
}
.h-3 {
  height: 0.75rem;
}
.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-\[420px\] {
  height: 420px;
}
.h-\[620px\] {
  height: 620px;
}
.h-\[680px\] {
  height: 680px;
}
.h-full {
  height: 100%;
}
.min-h-screen {
  min-height: 100vh;
}
.w-1\.5 {
  width: 0.375rem;
}
.w-12 {
  width: 3rem;
}
.w-16 {
  width: 4rem;
}
.w-20 {
  width: 5rem;
}
.w-24 {
  width: 6rem;
}
.w-3 {
  width: 0.75rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-4 {
  width: 1rem;
}
.w-5 {
  width: 1.25rem;
}
.w-6 {
  width: 1.5rem;
}
.w-72 {
  width: 18rem;
}
.w-8 {
  width: 2rem;
}
.w-80 {
  width: 20rem;
}
.w-\[420px\] {
  width: 420px;
}
.w-\[480px\] {
  width: 480px;
}
.w-\[620px\] {
  width: 620px;
}
.w-\[680px\] {
  width: 680px;
}
.w-full {
  width: 100%;
}
.min-w-0 {
  min-width: 0px;
}
.min-w-\[64px\] {
  min-width: 64px;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-lg {
  max-width: 32rem;
}
.max-w-md {
  max-width: 28rem;
}
.max-w-sm {
  max-width: 24rem;
}
.flex-1 {
  flex: 1 1 0%;
}
.-translate-y-1\/2 {
  --tw-translate-y: -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));
}
.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));
}
.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));
}
.animate-none {
  animation: none;
}
@keyframes pulse {

  50% {
    opacity: .5;
  }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes spin {

  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.cursor-pointer {
  cursor: pointer;
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.flex-col {
  flex-direction: column;
}
.flex-wrap {
  flex-wrap: wrap;
}
.items-start {
  align-items: flex-start;
}
.items-center {
  align-items: center;
}
.justify-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-1\.5 {
  gap: 0.375rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-3 {
  gap: 0.75rem;
}
.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));
}
.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;
}
.rounded {
  border-radius: 0.5rem;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: 0.75rem;
}
.rounded-xl {
  border-radius: 1rem;
}
.border {
  border-width: 1px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-b-2 {
  border-bottom-width: 2px;
}
.border-l {
  border-left-width: 1px;
}
.border-l-4 {
  border-left-width: 4px;
}
.border-t {
  border-top-width: 1px;
}
.border-border {
  --tw-border-opacity: 1;
  border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
}
.border-primary {
  --tw-border-opacity: 1;
  border-color: rgb(79 70 229 / var(--tw-border-opacity, 1));
}
.border-teal-300\/10 {
  border-color: rgb(94 234 212 / 0.1);
}
.border-teal-300\/15 {
  border-color: rgb(94 234 212 / 0.15);
}
.border-transparent {
  border-color: transparent;
}
.border-l-error {
  --tw-border-opacity: 1;
  border-left-color: rgb(220 38 38 / var(--tw-border-opacity, 1));
}
.border-l-success {
  --tw-border-opacity: 1;
  border-left-color: rgb(5 150 105 / var(--tw-border-opacity, 1));
}
.border-l-surface-subtle {
  --tw-border-opacity: 1;
  border-left-color: rgb(241 245 249 / var(--tw-border-opacity, 1));
}
.border-l-warning {
  --tw-border-opacity: 1;
  border-left-color: rgb(217 119 6 / var(--tw-border-opacity, 1));
}
.bg-black\/30 {
  background-color: rgb(0 0 0 / 0.3);
}
.bg-black\/40 {
  background-color: rgb(0 0 0 / 0.4);
}
.bg-error {
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
}
.bg-error\/10 {
  background-color: rgb(220 38 38 / 0.1);
}
.bg-info {
  --tw-bg-opacity: 1;
  background-color: rgb(2 132 199 / var(--tw-bg-opacity, 1));
}
.bg-info\/10 {
  background-color: rgb(2 132 199 / 0.1);
}
.bg-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(79 70 229 / var(--tw-bg-opacity, 1));
}
.bg-primary-light {
  --tw-bg-opacity: 1;
  background-color: rgb(238 242 255 / var(--tw-bg-opacity, 1));
}
.bg-primary\/20 {
  background-color: rgb(79 70 229 / 0.2);
}
.bg-success {
  --tw-bg-opacity: 1;
  background-color: rgb(5 150 105 / var(--tw-bg-opacity, 1));
}
.bg-success\/10 {
  background-color: rgb(5 150 105 / 0.1);
}
.bg-surface-subtle {
  --tw-bg-opacity: 1;
  background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));
}
.bg-teal-300\/70 {
  background-color: rgb(94 234 212 / 0.7);
}
.bg-teal-400\/15 {
  background-color: rgb(45 212 191 / 0.15);
}
.bg-text-muted {
  --tw-bg-opacity: 1;
  background-color: rgb(148 163 184 / var(--tw-bg-opacity, 1));
}
.bg-warning {
  --tw-bg-opacity: 1;
  background-color: rgb(217 119 6 / var(--tw-bg-opacity, 1));
}
.bg-warning\/10 {
  background-color: rgb(217 119 6 / 0.1);
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}
.from-\[hsl\(168\2c 80\%\2c 28\%\)\] {
  --tw-gradient-from: hsl(168,80%,28%) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(168 80% 28% / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.to-\[hsl\(168\2c 55\%\2c 18\%\)\] {
  --tw-gradient-to: hsl(168,55%,18%) var(--tw-gradient-to-position);
}
.bg-clip-text {
  -webkit-background-clip: text;
          background-clip: text;
}
.p-0\.5 {
  padding: 0.125rem;
}
.p-1 {
  padding: 0.25rem;
}
.p-1\.5 {
  padding: 0.375rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.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;
}
.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.pb-0 {
  padding-bottom: 0px;
}
.pb-4 {
  padding-bottom: 1rem;
}
.pb-5 {
  padding-bottom: 1.25rem;
}
.pl-3 {
  padding-left: 0.75rem;
}
.pl-9 {
  padding-left: 2.25rem;
}
.pr-10 {
  padding-right: 2.5rem;
}
.pt-4 {
  padding-top: 1rem;
}
.pt-5 {
  padding-top: 1.25rem;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-2xl {
  font-size: 1.75rem;
  line-height: 2rem;
}
.text-\[12px\] {
  font-size: 12px;
}
.text-\[13px\] {
  font-size: 13px;
}
.text-\[18px\] {
  font-size: 18px;
}
.text-base {
  font-size: 0.9375rem;
  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.375rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-bold {
  font-weight: 700;
}
.font-medium {
  font-weight: 500;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.capitalize {
  text-transform: capitalize;
}
.tracking-\[0\.18em\] {
  letter-spacing: 0.18em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.text-error {
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}
.text-info {
  --tw-text-opacity: 1;
  color: rgb(2 132 199 / var(--tw-text-opacity, 1));
}
.text-primary {
  --tw-text-opacity: 1;
  color: rgb(79 70 229 / var(--tw-text-opacity, 1));
}
.text-red-300 {
  --tw-text-opacity: 1;
  color: rgb(252 165 165 / var(--tw-text-opacity, 1));
}
.text-success {
  --tw-text-opacity: 1;
  color: rgb(5 150 105 / var(--tw-text-opacity, 1));
}
.text-text {
  --tw-text-opacity: 1;
  color: rgb(15 23 42 / var(--tw-text-opacity, 1));
}
.text-text-muted {
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity, 1));
}
.text-text-secondary {
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}
.text-transparent {
  color: transparent;
}
.text-warning {
  --tw-text-opacity: 1;
  color: rgb(217 119 6 / var(--tw-text-opacity, 1));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-zinc-100 {
  --tw-text-opacity: 1;
  color: rgb(244 244 245 / var(--tw-text-opacity, 1));
}
.text-zinc-400 {
  --tw-text-opacity: 1;
  color: rgb(161 161 170 / var(--tw-text-opacity, 1));
}
.text-zinc-50 {
  --tw-text-opacity: 1;
  color: rgb(250 250 250 / var(--tw-text-opacity, 1));
}
.underline {
  text-decoration-line: underline;
}
.opacity-30 {
  opacity: 0.3;
}
.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.03);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -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-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);
}
.outline {
  outline-style: solid;
}
.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-teal-400\/20 {
  --tw-ring-color: rgb(45 212 191 / 0.2);
}
.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);
}
.drop-shadow {
  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
  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-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);
}
.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-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-150 {
  transition-duration: 150ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.duration-300 {
  transition-duration: 300ms;
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

/* Renewals workspace */
:root { color-scheme: light; }
.renewals-app { --purple:#7354c5; --ink:#242333; --muted:#8b8998; display:flex; min-height:100vh; background:#f7f8fa; color:var(--ink); font-size:13px; font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
button, input, select, textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.5; }
button:focus-visible,a:focus-visible { outline:3px solid #b9a5ef; outline-offset:3px; }
.sidebar { width:220px; min-width:220px; background:#fff; border-right:1px solid #e9e9ef; padding:33px 18px 0; display:flex; flex-direction:column; position:sticky; top:0; height:100vh; }
.brand { display:flex; align-items:center; gap:10px; padding:0 11px; font-size:24px; font-weight:750; letter-spacing:-1px; line-height:1; }
.brand-mark { width:35px; height:35px; background:#7858cf; color:white; border-radius:10px; display:grid; place-items:center; box-shadow:0 3px 7px #7254c52b; }
.brand-cloud { font-weight:400; color:#72717f; }
.brand small { display:block; font-size:8px; letter-spacing:1.9px; font-weight:600; color:#9894a4; margin-top:9px; }
.workspace-label { margin:53px 13px 15px; color:#aaa7b4; letter-spacing:1.6px; font-size:9px; font-weight:600; }
.side-link { display:flex; align-items:center; gap:10px; padding:12px 11px; border-radius:7px; color:#7557bf; font-size:12px; font-weight:600; }
.side-link.active { background:#f0ebfa; }
.side-count { margin-left:auto; font-size:10px; border-radius:5px; padding:1px 5px; background:#e5dcf6; }
.sidebar-bottom { margin-top:auto; }
.sidebar-tip { padding:18px 12px; margin:20px 0 25px; background:linear-gradient(140deg,#f9f7fd,#f3f1f9); border:1px solid #eee9f7; border-radius:8px; color:#9181b0; }
.sidebar-tip strong { display:block; color:#59516c; font-size:11px; margin:12px 0 7px; }
.sidebar-tip p { color:#a19aaa; font-size:10px; line-height:1.8; }
.sidebar-tip>span { display:flex; align-items:center; gap:5px; margin-top:15px; font-size:9px; color:#8c7aa7; }
.side-profile { padding:18px 0; display:flex; align-items:center; gap:9px; border-top:1px solid #efedf2; }
.avatar,.top-avatar { width:31px; height:31px; display:grid; place-items:center; background:#eee8f8; color:#7e66a8; border-radius:50%; font-weight:600; font-size:10px; flex-shrink:0; }
.side-profile>div:last-child { min-width:0; }
.side-profile strong { display:block; font-size:11px; }
.side-profile small { display:block; color:#a09ba9; font-size:9px; margin-top:4px; max-width:130px; overflow:hidden; text-overflow:ellipsis; }
.main-shell { flex:1; min-width:0; }
.topbar { height:72px; background:#fff; border-bottom:1px solid #eaeaf0; padding:0 34px; display:flex; align-items:center; justify-content:space-between; }
.breadcrumb { color:#a09ca9; display:flex; align-items:center; gap:14px; font-size:11px; }
.breadcrumb span { color:#666271; }
.topbar-right { display:flex; align-items:center; gap:9px; color:#807b8b; font-size:10px; }
.workspace-dot { width:6px; height:6px; background:#73ad91; border-radius:50%; }
.top-avatar { margin-left:13px; width:30px; height:30px; background:#ece8f4; }
.board-main { padding:35px 34px 22px; max-width:1800px; margin:auto; }
.heading-row { display:flex; justify-content:space-between; align-items:center; gap:15px; }
.eyebrow { color:#8c7ca6; font-size:9px; letter-spacing:1.6px; font-weight:650; display:flex; align-items:center; gap:6px; margin-bottom:9px; }
.eyebrow span { width:5px; height:5px; border-radius:50%; background:#9d86c6; }
h1 { font-size:30px; font-weight:650; line-height:1.25; letter-spacing:-1.1px; }
.heading-dot { color:#8863cf; }
.subtitle { color:#96909f; margin-top:9px; font-size:12px; }
.heading-actions { display:flex; gap:9px; padding-top:15px; }
.button { border-radius:6px; padding:9px 13px; min-height:35px; display:inline-flex; justify-content:center; align-items:center; gap:8px; font-size:11px; font-weight:550; transition:background .15s; white-space:nowrap; }
.button.primary { background:#7958ca; color:#fff; border:1px solid #7958ca; box-shadow:0 2px 3px #7655c414; }
.button.primary:hover:not(:disabled) { background:#6844b5; }
.button.secondary { border:1px solid #e3e0e9; background:white; color:#6e667f; }
.button.secondary:hover { background:#f5f2fa; }
.period-row { margin:28px 0 20px; display:flex; justify-content:space-between; align-items:center; }
.period-chip { display:flex; align-items:center; gap:9px; font-size:10px; color:#8a8396; background:white; border:1px solid #e7e4ed; border-radius:6px; padding:9px 11px; }
.period-chip>svg { color:#8b76af; }
.period-chip strong { color:#645a74; font-weight:550; }
.period-divider { width:1px; height:12px; background:#e2dce9; margin:0 1px; }
.utc-label { color:#a39bac; font-size:8px; }
.refresh-link { display:flex; align-items:center; gap:6px; color:#97919f; font-size:10px; background:none; border:0; }
.metrics-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; margin-bottom:28px; }
.metric { background:white; border:1px solid #e7e6ed; border-radius:8px; padding:18px 19px 15px; box-shadow:0 2px 4px #27213502; }
.metric-label { display:flex; align-items:center; justify-content:space-between; color:#7d7788; font-size:11px; gap:5px; }
.metric-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; }
.metric-icon.purple { background:#f3effc; color:#9c80d3; }.metric-icon.red { background:#fdf0ed; color:#d89a8e; }.metric-icon.amber { background:#fcf6e9; color:#d3ac64; }.metric-icon.green { background:#ecf6f0; color:#80ae95; }
.metric-value { font-size:29px; font-weight:600; letter-spacing:-1px; margin:7px 0 9px; line-height:1.25; font-variant-numeric:tabular-nums; }
.metric-value>span { font-size:11px; color:#aaa4b1; letter-spacing:0; font-weight:400; margin-left:7px; }
.metric-caption { font-size:10px; color:#a29baa; display:flex; gap:5px; align-items:center; white-space:nowrap; }
.small-dot { display:inline-block; width:5px; height:5px; border-radius:50%; flex-shrink:0; }.small-dot.red { background:#d89c93; }.small-dot.green { background:#84b299; }
.mini-track { height:3px; background:#f6f4f8; border-radius:3px; margin-top:15px; overflow:hidden; }.mini-track span { display:block; height:100%; border-radius:3px; min-width:0; }
.accounts-panel { background:#fff; border:1px solid #e6e4ec; border-radius:8px; box-shadow:0 3px 6px #30214002; overflow:hidden; }
.panel-tabs { display:flex; justify-content:space-between; align-items:center; padding:0 21px; border-bottom:1px solid #eeebf2; min-height:61px; }
.tabs { display:flex; gap:25px; align-self:stretch; }
.tabs button { border:none; background:none; display:flex; align-items:center; gap:7px; position:relative; color:#9991a4; font-size:11px; font-weight:500; }
.tabs button.active { color:#7854bd; }.tabs button.active:after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:#8966cf; }
.tabs button>span { font-size:9px; border-radius:4px; padding:1px 5px; background:#f4f2f6; color:#a49aac; }.tabs button.active>span { color:#9675c8; background:#f1ebfa; }
.signals-label { display:flex; align-items:center; gap:6px; font-size:9px; color:#a59cab; }.signals-label>span { width:5px; height:5px; border-radius:50%; background:#91b7a4; }
.filters-row { padding:17px 20px; display:flex; align-items:center; gap:8px; }
.search-box { display:flex; align-items:center; gap:8px; color:#aca5b6; border:1px solid #e8e4ed; border-radius:6px; height:34px; padding:0 10px; width:260px; }
.search-box input { border:0; outline:0; font-size:10px; color:#62566f; width:100%; min-width:0; background:transparent; }.search-box input::-moz-placeholder { color:#aaa1b3; }.search-box input::placeholder { color:#aaa1b3; }.search-box button { display:flex; background:none; border:0; }
.select-wrap,.sort-wrap { border:1px solid #e8e4ed; border-radius:6px; display:flex; height:34px; align-items:center; padding:0 9px; gap:6px; color:#a095ac; }
.select-wrap select,.sort-wrap select { border:0; background:transparent; outline:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; font-size:10px; color:#81748e; cursor:pointer; max-width:150px; }
.sort-wrap { margin-left:auto; border:0; padding-right:0; gap:6px; }.sort-wrap select { color:#7e6b95; }
.table-scroll { overflow:auto; max-height:650px; }
.renewals-table { width:100%; border-collapse:collapse; text-align:left; white-space:nowrap; }
.renewals-table th { background:#faf9fc; padding:12px 12px; color:#a29aa9; font-size:8px; font-weight:600; letter-spacing:.8px; border-top:1px solid #f1edf5; border-bottom:1px solid #eeebf2; position:sticky; top:0; z-index:1; }
.renewals-table th:first-child { padding-left:20px; }.sort-symbol { margin-left:5px; color:#a08cbb; font-size:12px; }.column-hint { font-size:9px; color:#b8afc3; }
.renewals-table td { padding:17px 12px; border-bottom:1px solid #f1edf5; vertical-align:middle; height:88px; }
.renewals-table tr:last-child td { border-bottom:0; }.renewals-table td:first-child { padding-left:20px; }.renewals-table td:last-child { padding-right:16px; }
.account-row { cursor:pointer; transition:background .15s; }.account-row:hover { background:#fcfaff; }
.account-cell { display:flex; align-items:center; gap:10px; min-width:170px; }
.company-logo { width:33px; height:33px; border-radius:9px; display:grid; place-items:center; font-weight:700; font-size:11px; letter-spacing:-.2px; flex-shrink:0; border:1px solid #00000004; }
.logo-0 { background:#f0eafb; color:#9a7aca; }.logo-1 { background:#eaf1fc; color:#7d9cc8; }.logo-2 { background:#e9f3f0; color:#6b9c89; }.logo-3 { background:#f9efdf; color:#bf9d67; }.logo-4 { background:#f7eaf0; color:#be85a1; }
.account-name { font-size:11px; font-weight:600; color:#55505f; border:0; background:none; padding:0; text-align:left; }.account-name:hover { color:#7954bf; }
.risk-caption { display:flex; align-items:center; gap:4px; margin-top:7px; font-size:8px; color:#a59baa; }.risk-caption>span:first-child { width:4px; height:4px; border-radius:50%; }.risk-caption.risk-high>span:first-child { background:#d98c84; }.risk-caption.risk-at_risk>span:first-child { background:#d4b16e; }.risk-caption.risk-healthy>span:first-child { background:#87b5a0; }.risk-separator { color:#c0b8c6; margin:0 1px; }
.money-text { font-size:12px; font-weight:550; color:#5c5565; font-variant-numeric:tabular-nums; }
.cell-sub { display:flex; gap:5px; align-items:center; margin-top:5px; font-size:8px; color:#b0a6b7; }
.plan-tag { text-transform:capitalize; padding:1px 4px; border-radius:3px; background:#f2eff7; color:#9784af; font-size:8px; }.plan-tag.scale { background:#eee8f9; color:#9a7ac3; }.plan-tag.growth { background:#eaf2f9; color:#7e9bb9; }
.csm-cell { display:flex; align-items:center; gap:6px; font-size:9px; color:#92869c; }.csm-avatar { width:22px; height:22px; background:#f2edf7; color:#b09bc2; border:2px solid #fff; box-shadow:0 0 0 1px #f2edf7; display:grid; place-items:center; border-radius:50%; font-size:7px; font-weight:600; }
.trend { display:flex; align-items:center; gap:3px; font-size:11px; font-weight:500; }.trend.negative { color:#d48e85; }.trend.warning { color:#b5a07d; }.trend.positive { color:#88ad9c; }.trend.neutral { color:#b2a6bf; font-size:9px; }
.cell-muted { font-size:8px; color:#b1a6bb; margin-top:5px; }.ticket-count { display:inline-flex; align-items:center; gap:5px; color:#ce8e85; background:#fcf0ec; padding:4px 6px; border-radius:5px; font-size:9px; }.no-ticket { color:#c1b7cb; padding-left:9px; }
.nps-cell { display:flex; align-items:center; gap:6px; }.nps-score { width:22px; height:22px; border-radius:5px; display:grid; place-items:center; font-size:10px; font-weight:600; }.nps-score.detractor { background:#fceeea; color:#cf9386; }.nps-score.promoter { background:#edf6f1; color:#86aa97; }.nps-score.passive { background:#faf3e9; color:#b9a170; }.nps-score.none { background:#f4f1f7; color:#b7adbf; }.nps-comment { font-size:9px; font-style:italic; color:#a397af; max-width:125px; overflow:hidden; text-overflow:ellipsis; display:block; }.nps-date { margin-left:28px; }
.renewal-days { display:flex; align-items:center; gap:5px; font-size:10px; font-weight:550; color:#8b7d9a; }.renewal-days.urgent { color:#d1a266; }.renewal-days>span { width:4px; height:4px; border-radius:50%; background:#d9b278; }
.status-pill { display:inline-flex; align-items:center; gap:5px; font-size:8px; padding:3px 6px; border:1px solid transparent; border-radius:4px; font-weight:500; white-space:nowrap; }.status-pill>i { width:4px; height:4px; border-radius:50%; background:currentColor; }.status-pill.at_risk { color:#cb9776; background:#fcf3e9; border-color:#f6e6d2; }.status-pill.on_track { color:#85aa94; background:#edf6f0; border-color:#deeee5; }.status-pill.saved { color:#9271bc; background:#f3edfa; border-color:#e8dff5; }.status-pill.lost { color:#c38989; background:#fbefef; border-color:#f3dddd; }
.next-step-preview { font-size:8px; color:#a99ab6; margin-top:7px; max-width:155px; overflow:hidden; text-overflow:ellipsis; }.next-step-preview.empty { color:#b7adbf; font-style:italic; }.overdue { color:#d18d7b; }.row-arrow { color:#b9afc5; }
.table-footer { border-top:1px solid #eeebf2; padding:15px 20px; display:flex; justify-content:space-between; color:#a99fb3; font-size:9px; }.table-footer strong { font-weight:550; color:#8b7d98; }.table-footer>span:last-child { display:flex; align-items:center; gap:5px; color:#afa5ba; }
.page-footer { display:flex; justify-content:space-between; margin-top:19px; color:#b0a8b9; font-size:9px; }.page-footer>span:first-child { display:flex; align-items:center; gap:5px; }
.rules-box { position:relative; padding:18px 38px 18px 18px; background:#f0ebfa; color:#817094; border:1px solid #e5dcf5; border-radius:8px; margin-top:20px; font-size:11px; line-height:1.8; }.rules-box strong { color:#72568f; }.rules-box p { margin-top:7px; }.rules-box>button { position:absolute; top:15px; right:14px; }
.error-banner { padding:14px; margin:15px 0; border:1px solid #edc4bf; border-radius:6px; background:#fff0ed; color:#ac6258; font-size:12px; }.error-banner button { text-decoration:underline; margin-left:8px; }
.empty-board { display:flex; flex-direction:column; align-items:center; padding:60px 15px; color:#b9a9cb; gap:12px; }.empty-board h3 { font-size:16px; color:#80708f; }.empty-board p { color:#a697b3; font-size:12px; }
.skeleton { height:13px; border-radius:4px; background:linear-gradient(90deg,#f5f2f8,#ede8f2,#f5f2f8); background-size:200%; animation:shimmer 1.5s infinite; min-width:50px; } @keyframes shimmer { to { background-position:-200% 0; } }
.spinning { animation:spin 1s linear infinite; } @keyframes spin { to {transform:rotate(360deg)} }
.drawer-overlay { position:fixed; inset:0; background:#21182c55; z-index:50; display:flex; justify-content:flex-end; backdrop-filter:blur(2px); }
.account-drawer { background:white; width:590px; max-width:100vw; height:100dvh; display:flex; flex-direction:column; box-shadow:-10px 0 60px #21182c22; animation:slide-in .2s ease-out; }
@keyframes slide-in { from { transform:translateX(30px); opacity:.5 } to { transform:translateX(0); opacity:1 } }
.drawer-top { display:flex; align-items:center; justify-content:space-between; padding:24px 28px 14px; color:#a090ad; letter-spacing:1.5px; font-size:9px; }.drawer-top button { background:none; border:0; padding:4px; color:#9e90ab; }
.drawer-account { display:flex; align-items:center; gap:13px; padding:12px 28px; }.company-logo.large { width:47px; height:47px; font-size:17px; border-radius:12px; }.drawer-account h2 { font-size:22px; font-weight:600; letter-spacing:-.5px; color:#55475f; }.drawer-account p { display:flex; gap:7px; margin-top:6px; color:#a28eae; font-size:10px; }.capitalize { text-transform:capitalize; }
.drawer-meta { display:flex; gap:20px; padding:8px 28px 23px; border-bottom:1px solid #eee7f3; color:#a18bad; font-size:10px; }.drawer-meta>span { display:flex; gap:6px; align-items:center; }
.drawer-content { padding:24px 28px; overflow-y:auto; flex:1; }
.section-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }.section-heading h3 { font-weight:600; color:#776180; font-size:12px; }.health-chip { font-size:9px; border-radius:4px; padding:4px 7px; }.health-chip.risk-high { background:#faeeeb; color:#c78c7e; }.health-chip.risk-at_risk { background:#fbf3e7; color:#bea06d; }.health-chip.risk-healthy { background:#edf5f0; color:#85a690; }
.signal-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }.signal-grid>div { background:#faf8fc; border:1px solid #eee7f3; border-radius:6px; padding:11px 9px; }.signal-grid>div.flagged { background:#fdf5f1; border-color:#f3e5de; }.signal-grid>div.renewal-signal { background:#faf5ec; border-color:#f2e8d7; }.signal-grid>div>span { display:flex; gap:4px; align-items:center; font-size:8px; color:#ad98b8; }.signal-grid strong { display:block; margin:10px 0 6px; color:#8c759c; font-size:20px; font-weight:550; }.signal-grid .flagged strong { color:#c39b84; }.signal-grid small { display:block; font-size:7px; color:#b9a5c2; line-height:1.6; }.signal-grid em { font-size:10px; font-style:normal; margin-left:2px; color:#b7a3c2; }
.customer-quote { margin-top:13px; background:#f8f5fc; border-left:2px solid #c5afdc; border-radius:0 5px 5px 0; padding:13px 15px; }.customer-quote>span { color:#b1a0bf; letter-spacing:1px; font-size:7px; }.customer-quote p { font-size:12px; color:#947fa6; line-height:1.7; margin-top:6px; font-style:italic; white-space:pre-wrap; overflow-wrap:anywhere; }.health-footnote { font-size:8px; color:#b8a8c3; line-height:1.7; margin-top:10px; }
.drawer-tabs { display:flex; gap:24px; border-bottom:1px solid #eee6f3; margin-top:25px; margin-bottom:21px; }.drawer-tabs button { display:flex; gap:7px; align-items:center; padding:12px 0; color:#b5a1c2; font-size:11px; position:relative; }.drawer-tabs button.active { color:#9673b3; }.drawer-tabs button.active:after { content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:#ad8bc9; }.drawer-tabs button>span { background:#f3ecf9; border-radius:4px; padding:0 5px; font-size:9px; }
.form-intro h3 { color:#8a6c9f; font-size:13px; font-weight:550; }.form-intro p { font-size:10px; color:#b3a0c0; margin-top:6px; }.form-intro { margin-bottom:20px; }
#followup-form label { display:block; font-size:10px; color:#9a7eac; margin-bottom:17px; }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; } #followup-form input,#followup-form select,#followup-form textarea { display:block; width:100%; border:1px solid #e9deef; background:white; color:#897096; border-radius:5px; padding:10px 11px; outline:0; font-size:11px; margin-top:7px; } #followup-form input:focus,#followup-form select:focus,#followup-form textarea:focus { border-color:#bca1d1; box-shadow:0 0 0 3px #f3ecf9; } #followup-form textarea { resize:vertical; } #followup-form textarea::-moz-placeholder, #followup-form input::-moz-placeholder { color:#c5b5cf; } #followup-form textarea::placeholder,#followup-form input::placeholder { color:#c5b5cf; } .optional { font-size:9px; color:#c1accd; margin-left:5px; }.date-label { max-width:220px; }.due-warning { display:block; font-size:9px; margin-top:5px; color:#c4957b; }.default-hint { font-size:9px; color:#b6a1c3; margin:10px 0; line-height:1.7; }.form-error { color:#b5786a; font-size:11px; padding:12px; border-radius:5px; background:#fceee9; margin:10px 0; }.form-error button { margin-left:8px; text-decoration:underline; }
.drawer-footer { display:flex; align-items:center; justify-content:space-between; border-top:1px solid #eee6f3; padding:17px 27px; background:#fff; gap:10px; }.drawer-footer>span { display:flex; gap:5px; align-items:center; font-size:8px; color:#b7a3c2; }.drawer-footer .button { font-size:10px; }
.history-empty { padding:35px 5px; text-align:center; color:#b49dc5; font-size:11px; }.history-empty>svg { margin:0 auto 15px; color:#c5b1d4; }.history-empty h3 { color:#a183b4; font-size:15px; margin-bottom:9px; }.history-empty p { color:#bba6ca; font-size:11px; line-height:1.8; }.history-entry { padding:0 0 24px 22px; margin-left:8px; border-left:1px solid #eee4f4; position:relative; }.timeline-dot { position:absolute; left:-9px; top:0; width:17px; height:17px; background:#f0e8f8; color:#b595ce; display:grid; place-items:center; border-radius:50%; }.history-entry-top { display:flex; flex-wrap:wrap; gap:6px; justify-content:space-between; color:#a18ab2; font-size:9px; }.history-entry-top strong { font-weight:500; }.history-entry time { color:#c0abcd; font-size:8px; }.history-status { display:flex; gap:9px; align-items:center; margin-top:10px; color:#b9a4c8; font-size:9px; }.history-action { margin-top:10px; color:#a38ab5; font-size:11px; line-height:1.7; overflow-wrap:anywhere; white-space:pre-wrap; }.history-action>span { color:#c0aace; font-size:9px; }.history-action.muted { color:#c3afd0; font-size:9px; }.history-note { margin-top:9px; padding:10px 12px; background:#f9f5fc; color:#ab94bc; font-size:11px; border-radius:5px; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere; }
.toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); background:#342944; color:#f3edf9; padding:13px 20px; border-radius:8px; box-shadow:0 5px 25px #271d3c30; font-size:12px; z-index:100; display:flex; align-items:center; gap:10px; }.toast>span { width:23px; height:23px; border-radius:50%; background:#ffffff20; display:grid; place-items:center; }
@media(min-width:1600px){.renewals-table td{padding-top:19px;padding-bottom:19px}.account-name{font-size:12px}.nps-comment{max-width:180px}.account-cell{min-width:190px}.board-main{padding:40px 40px 24px}}
@media(max-width:1200px){.sidebar{width:185px;min-width:185px;padding-left:12px;padding-right:12px}.brand{font-size:21px;padding:0 6px}.brand-mark{width:31px;height:31px}.side-link{font-size:10px}.board-main{padding:27px 23px 20px}.topbar{padding:0 23px}.metric{padding:15px 13px}.metric-label{font-size:10px}.metric-value{font-size:25px}.metric-caption{font-size:8px}.metrics-grid{gap:10px}.signals-label{display:none}.tabs{gap:20px}.filters-row{flex-wrap:wrap}.sort-wrap{margin-left:auto}.table-footer>span:last-child{max-width:50%;font-size:8px}.heading-actions{gap:6px}.heading-actions .button{font-size:10px;padding:8px 10px}.search-box{width:220px}}
@media(max-width:850px){.sidebar{display:none}.topbar{height:58px}.board-main{padding:25px 18px}.heading-row{align-items:flex-start}.heading-actions{padding-top:20px}.heading-actions .secondary{font-size:0;gap:0;padding:9px}.heading-actions .secondary svg{width:16px}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-caption{font-size:10px}.metric-value{font-size:27px}.period-row{margin-top:24px}.period-chip{font-size:9px;gap:6px}.tabs{gap:20px}.table-footer>span:last-child{display:none}.page-footer>span:last-child{display:none}.filters-row{padding:15px}.search-box{width:100%;flex-basis:100%}.sort-wrap{padding:0 3px}.panel-tabs{padding:0 16px}h1{font-size:27px}.subtitle{font-size:11px}.topbar-right{font-size:9px}.breadcrumb{font-size:10px}.refresh-link{font-size:8px}.metric-label{font-size:11px}}
@media(max-width:480px){.heading-actions .primary{font-size:0;gap:0}.heading-actions .primary svg{width:17px}.metric-caption{font-size:8px}.period-row{align-items:flex-start;gap:9px}.period-chip{flex-wrap:wrap}.period-chip .utc-label{display:none}.period-chip strong{font-size:9px}.refresh-link{max-width:80px;line-height:1.6}.tabs{gap:16px}.tabs button{font-size:10px;gap:4px}.tabs button>span{font-size:8px}.select-wrap{padding:0 6px;gap:4px}.select-wrap select,.sort-wrap select{font-size:9px}.sort-wrap{flex-basis:100%;justify-content:flex-end}.board-main{padding:24px 12px}.heading-row{gap:8px}.heading-actions{gap:5px}.subtitle{max-width:240px;line-height:1.7}.signal-grid{grid-template-columns:repeat(2,1fr)}.drawer-content{padding:20px}.drawer-account{padding:10px 20px}.drawer-meta{padding:8px 20px 18px;gap:10px;font-size:8px}.drawer-top{padding:18px 20px 10px}.drawer-footer{padding:14px 20px}.drawer-footer>span{max-width:135px;line-height:1.7}.drawer-account h2{font-size:20px}.form-row{gap:9px}.toast{width:-moz-max-content;width:max-content;max-width:95vw;font-size:10px}}


/* Keep secondary data readable in dense account views. */
.subtitle,.metric-label,.metric-caption,.period-chip,.refresh-link,.breadcrumb,.tabs button,.signals-label,.table-footer,.page-footer,.cell-muted,.risk-caption,.cell-sub,.next-step-preview,.next-step-preview.empty,.nps-comment,.csm-cell,.health-footnote,.default-hint { color:#7d7489; }
.account-name,.money-text { color:#42394e; font-size:12px; }
.renewals-table th { color:#81758d; font-size:9px; }
.csm-cell,.nps-comment,.renewal-days,.trend { font-size:11px; }
.cell-muted,.risk-caption,.cell-sub,.next-step-preview,.table-footer { font-size:9px; }
.trend.negative { color:#bd6357; }.trend.warning { color:#9b783e; }.trend.positive { color:#56896e; }
.nps-score.detractor,.ticket-count { color:#b86757; }.nps-score.promoter { color:#52826a; }.nps-score.passive { color:#9c7b39; }
.status-pill { font-size:9px; }.status-pill.at_risk { color:#a97435; }.status-pill.on_track { color:#518369; }.status-pill.saved { color:#8660ad; }.status-pill.lost { color:#b26b6b; }
.drawer-account h2 { color:#493751; }.drawer-account p,.drawer-meta,.section-heading h3,.form-intro p,.drawer-footer>span,.customer-quote p,.history-action,.history-note,.history-entry-top { color:#84708e; }
#followup-form label { color:#81658f; }#followup-form input,#followup-form select,#followup-form textarea { color:#695075; }
.signal-grid>div>span,.signal-grid small,.health-footnote,.customer-quote>span,.history-entry time,.history-action>span { color:#97839f; }
.signal-grid small { font-size:8px; }.signal-grid>div>span { font-size:9px; }

.hover\:border-border-strong:hover {
  --tw-border-opacity: 1;
  border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));
}

.hover\:bg-emerald-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(4 120 87 / var(--tw-bg-opacity, 1));
}

.hover\:bg-primary-hover:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(67 56 202 / var(--tw-bg-opacity, 1));
}

.hover\:bg-red-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(185 28 28 / var(--tw-bg-opacity, 1));
}

.hover\:bg-surface-secondary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));
}

.hover\:bg-surface-subtle:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));
}

.hover\:from-\[hsl\(168\2c 80\%\2c 38\%\)\]:hover {
  --tw-gradient-from: hsl(168,80%,38%) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(168 80% 38% / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.hover\:to-\[hsl\(168\2c 55\%\2c 28\%\)\]:hover {
  --tw-gradient-to: hsl(168,55%,28%) var(--tw-gradient-to-position);
}

.hover\:text-primary-hover:hover {
  --tw-text-opacity: 1;
  color: rgb(67 56 202 / var(--tw-text-opacity, 1));
}

.hover\:text-text:hover {
  --tw-text-opacity: 1;
  color: rgb(15 23 42 / var(--tw-text-opacity, 1));
}

.hover\:shadow-md:hover {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.07), 0 2px 4px -2px rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.focus\:ring-2:focus {
  --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\:ring-primary\/30:focus {
  --tw-ring-color: rgb(79 70 229 / 0.3);
}

.focus\:ring-offset-1:focus {
  --tw-ring-offset-width: 1px;
}

.disabled\:pointer-events-none:disabled {
  pointer-events: none;
}

.disabled\:opacity-50:disabled {
  opacity: 0.5;
}

@media (min-width: 768px) {

  .md\:block {
    display: block;
  }
}

@media (min-width: 1024px) {

  .lg\:block {
    display: block;
  }
}