/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[2].use[1]!./node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[13].oneOf[2].use[2]!./node_modules/next/font/google/target.css?{"path":"src/app/layout.tsx","import":"Inter","arguments":[{"subsets":["latin"],"variable":"--font-inter"}],"variableName":"inter"} ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* cyrillic-ext */
@font-face {
  font-family: '__Inter_d8ebd1';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/ba9851c3c22cd980-s.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: '__Inter_d8ebd1';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/21350d82a1f187e9-s.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: '__Inter_d8ebd1';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/c5fe6dc8356a8c31-s.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: '__Inter_d8ebd1';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/19cfc7226ec3afaa-s.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: '__Inter_d8ebd1';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/df0a9ae256c0569c-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: '__Inter_d8ebd1';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/8e9860b6e62d6359-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: '__Inter_d8ebd1';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/e4af272ccee01ff0-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: '__Inter_Fallback_d8ebd1';src: local("Arial");ascent-override: 90.49%;descent-override: 22.56%;line-gap-override: 0.00%;size-adjust: 107.06%
}.__className_d8ebd1 {font-family: '__Inter_d8ebd1', '__Inter_Fallback_d8ebd1';font-style: normal
}.__variable_d8ebd1 {--font-inter: '__Inter_d8ebd1', '__Inter_Fallback_d8ebd1'
}

/*!*****************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./src/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.17 | 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: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 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 {
    /* ── Monochrome: black, white, purple ────────────────────────────────
       One accent hue (violet) plus neutrals. No secondary hues anywhere.
       Series and states are separated by LIGHTNESS and SATURATION, not hue,
       and every value below is contrast-checked — see the per-group notes. */
    --background: 270 20% 98%;
    --foreground: 270 15% 10%;        /* 18.6:1 on card */
    --card: 0 0% 100%;
    --card-foreground: 270 15% 10%;
    --popover: 0 0% 100%;
    --popover-foreground: 270 15% 10%;
    --primary: 265 90% 52%;           /* the single accent; white text on it 7.0:1 */
    --primary-foreground: 0 0% 100%;
    --secondary: 270 20% 95%;
    --secondary-foreground: 270 15% 25%;
    --muted: 270 16% 95%;
    --muted-foreground: 270 8% 42%;   /* 6.4:1 */
    --accent: 268 45% 95%;
    --accent-foreground: 265 80% 35%;
    /* Status is monochrome, so these differ by lightness/saturation rather than
       hue — min pairwise dE 46.9. This is only safe because StatusBadge always
       renders an icon AND a text label, so colour is a redundant channel.
       If a state is ever shown as colour alone, this scale is not sufficient. */
    --destructive: 358 68% 46%;       /* 5.70:1 as text on card, white on it 5.70:1 */
    --destructive-foreground: 0 0% 100%;
    --warning: 36 78% 34%;            /* 4.97:1 — amber completes the triad */
    --warning-foreground: 0 0% 100%;
    --info: 258 95% 22%;              /* deep violet */
    --info-foreground: 0 0% 100%;
    --success: 152 62% 30%;           /* 5.19:1 as text on card, white on it 5.19:1 */
    --success-foreground: 0 0% 100%;
    --border: 270 16% 90%;
    --input: 270 16% 90%;
    --ring: 265 90% 52%;
    --radius: 0.75rem;
    /* Sidebar stays near-black in both themes — it anchors the layout. */
    --sidebar: 0 0% 0%;            /* pure black */
    --sidebar-foreground: 0 0% 100%;
    --sidebar-border: 0 0% 18%;   /* subtle divider on black */
    /* Chart series — violet ramp + neutrals. All >=3:1 on card, min dE 39. */
    --chart-1: 258 90% 50%;
    --chart-2: 278 65% 56%;
    --chart-3: 258 90% 20%;
    --chart-4: 0 0% 20%;
    --chart-5: 278 40% 62%;
    --chart-6: 0 0% 58%;
    /* 7-10 extend the categorical palette for charts that plot up to ten series
       (FinOps top-10 by service). Chosen by greedy farthest-point search in CIELAB
       against the six above, constrained to the theme's violet/neutral family:
       every step clears 3:1 on --card (WCAG AA for graphical objects) and the
       minimum pairwise dE across all ten is 27.5. */
    --chart-7: 292 95% 50%;
    --chart-8: 292 55% 14%;
    --chart-9: 258 95% 32%;
    --chart-10: 292 55% 35%;
    /* Per-domain card identity. The theme is black/white/purple, so these cannot
       separate on hue — subtle surface tints in one hue family measured dE 1.4 apart,
       i.e. invisible. The surface therefore stays near-neutral and the domain is carried
       by the accent, which is >= 3:1 on the surface and >= 26 dE apart from its
       neighbours. Surfaces first, accents second. */
    --domain-overview-surface: 0 0% 100%;
    --domain-ci-surface:       265 45% 96%;
    --domain-infra-surface:    280 30% 95%;
    --domain-apm-surface:      255 35% 97%;
    --domain-security-surface: 292 28% 95%;
    --domain-finops-surface:   270 14% 95%;

    --domain-overview-accent: 270 6% 55%;
    --domain-ci-accent:       265 85% 52%;
    --domain-infra-accent:    285 60% 38%;
    --domain-apm-accent:      255 70% 66%;
    --domain-security-accent: 292 90% 44%;
    --domain-finops-accent:   270 10% 28%;
    --chart-grid: 270 16% 91%;
    --chart-axis: 270 8% 46%;
    /* Severity — a single-hue ordinal ramp; darkness = urgency. */
    --severity-critical: 265 95% 32%;
    --severity-high: 265 90% 50%;
    --severity-medium: 278 55% 60%;
    --severity-low: 0 0% 46%;
    /* Shadows — violet-tinted */
    --shadow-sm: 0 1px 3px 0 hsl(265 60% 45% / 0.07);
    --shadow: 0 2px 8px -1px hsl(265 60% 45% / 0.10), 0 1px 3px -1px hsl(265 60% 45% / 0.06);
    --shadow-md: 0 6px 16px -2px hsl(265 60% 45% / 0.12), 0 2px 6px -2px hsl(265 60% 45% / 0.08);
    --shadow-lg: 0 16px 32px -4px hsl(265 60% 45% / 0.16), 0 6px 12px -4px hsl(265 60% 45% / 0.10);
    --shadow-xl: 0 24px 48px -8px hsl(265 60% 45% / 0.22), 0 10px 20px -8px hsl(265 60% 45% / 0.13);
  }

  .dark {
    /* Dark — near-black with a faint violet cast. */
    --background: 270 18% 7%;
    --foreground: 270 12% 95%;
    --card: 270 16% 11%;
    --card-foreground: 270 12% 95%;
    --popover: 270 16% 11%;
    --popover-foreground: 270 12% 95%;
    --primary: 265 90% 68%;
    --primary-foreground: 270 18% 7%;
    --secondary: 270 14% 17%;
    --secondary-foreground: 270 12% 95%;
    --muted: 270 14% 15%;
    --muted-foreground: 270 8% 62%;
    --accent: 270 16% 21%;
    --accent-foreground: 270 12% 95%;
    --destructive: 358 72% 62%;       /* 4.89:1 as text on dark card */
    --destructive-foreground: 270 18% 7%;
    --warning: 38 85% 64%;            /* 9.80:1 on dark card */
    --warning-foreground: 270 18% 7%;
    --info: 258 70% 72%;
    --info-foreground: 270 18% 7%;
    --success: 152 55% 62%;           /* 9.58:1 as text on dark card */
    --success-foreground: 270 18% 7%;
    --border: 270 14% 19%;
    --input: 270 14% 19%;
    --ring: 265 90% 68%;
    --sidebar: 0 0% 0%;            /* pure black */
    --sidebar-foreground: 0 0% 100%;
    --sidebar-border: 0 0% 18%;   /* subtle divider on black */
    --chart-1: 278 90% 68%;
    --chart-2: 258 40% 58%;
    --chart-3: 0 0% 90%;
    --chart-4: 268 90% 52%;
    --chart-5: 278 90% 86%;
    --chart-6: 0 0% 38%;
    /* Dark-theme counterparts; minimum pairwise dE across all ten is 24.1. */
    --chart-7: 292 95% 56%;
    --chart-8: 292 85% 77%;
    --chart-9: 258 25% 62%;
    --chart-10: 0 0% 62%;
    /* Dark counterparts; accents stay >= 3.85:1 on the dark surface, >= 16 dE apart. */
    --domain-overview-surface: 270 16% 11%;
    --domain-ci-surface:       265 40% 16%;
    --domain-infra-surface:    280 26% 18%;
    --domain-apm-surface:      255 30% 14%;
    --domain-security-surface: 292 24% 17%;
    --domain-finops-surface:   270 12% 18%;

    --domain-overview-accent: 270 8% 52%;
    --domain-ci-accent:       265 90% 70%;
    --domain-infra-accent:    285 55% 56%;
    --domain-apm-accent:      255 85% 82%;
    --domain-security-accent: 292 85% 62%;
    --domain-finops-accent:   270 10% 78%;
    --chart-grid: 270 14% 19%;
    --chart-axis: 270 8% 58%;
    --severity-critical: 282 95% 78%;
    --severity-high: 265 90% 66%;
    --severity-medium: 265 45% 60%;
    --severity-low: 0 0% 62%;
    --shadow-sm: 0 1px 3px 0 hsl(0 0% 0% / 0.5);
    --shadow: 0 2px 8px -1px hsl(0 0% 0% / 0.6), 0 1px 3px -1px hsl(0 0% 0% / 0.5);
    --shadow-md: 0 6px 16px -2px hsl(0 0% 0% / 0.6), 0 2px 6px -2px hsl(0 0% 0% / 0.5);
    --shadow-lg: 0 16px 32px -4px hsl(0 0% 0% / 0.7), 0 6px 12px -4px hsl(0 0% 0% / 0.5);
    --shadow-xl: 0 24px 48px -8px hsl(0 0% 0% / 0.8), 0 10px 20px -8px hsl(0 0% 0% / 0.6);
  }
  * {
  border-color: hsl(var(--border));
}

  body {
  color: hsl(var(--foreground));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "rlig" 1, "calt" 1, "tnum" 1;
    background-color: hsl(var(--background));
}

  /* Tabular numbers for metrics */
  .tabular-nums {
    font-feature-settings: "tnum" 1;
    font-variant-numeric: tabular-nums;
  }

  /* Focus-visible ring */
  :focus-visible {
    outline: 2px solid hsl(var(--ring));
    outline-offset: 2px;
  }
.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 2rem;
  padding-left: 2rem;
}
@media (min-width: 1400px) {

  .container {
    max-width: 1400px;
  }
}
.t-display {
    font-size: 1.75rem;   /* 28px */
    line-height: 2.125rem;
    font-weight: 600;
    letter-spacing: -0.02em;
  }
.t-section {
    font-size: 1.25rem;   /* 20px — headings that group cards under the page title */
    line-height: 1.75rem;
    font-weight: 600;
    letter-spacing: -0.015em;
  }
.t-title {
    font-size: 1.125rem;  /* 18px — card titles */
    line-height: 1.625rem;
    font-weight: 600;
    letter-spacing: -0.01em;
  }
.t-metric {
    font-size: 1.5rem;    /* 24px — stat values, tabular by default */
    line-height: 1.875rem;
    font-weight: 600;
    letter-spacing: -0.015em;
    font-variant-numeric: tabular-nums;
  }
.t-body {
    font-size: 0.875rem;  /* 14px — the dominant size, 744 uses */
    line-height: 1.375rem;
  }
.t-label {
    font-size: 0.75rem;   /* 12px — field and tile labels */
    line-height: 1.125rem;
    font-weight: 500;
  }
.t-caption {
    font-size: 0.75rem;
    line-height: 1.125rem;
    color: hsl(var(--muted-foreground));
  }
.card-elevated {
    background-image: linear-gradient(
      152deg,
      hsl(var(--primary) / 0.06) 0%,
      hsl(var(--primary) / 0.02) 45%,
      transparent 85%
    );
    box-shadow:
      0 1px 2px hsl(265 55% 22% / 0.06),
      0 4px 10px -3px hsl(265 55% 22% / 0.09),
      0 14px 28px -10px hsl(265 55% 22% / 0.11),
      inset 0 1px 0 hsl(0 0% 100% / 0.5);
    transition:
      transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 180ms cubic-bezier(0.16, 1, 0.3, 1);
  }
.card-elevated:hover {
    transform: translateY(-2px);
    box-shadow:
      0 2px 4px hsl(265 55% 22% / 0.07),
      0 8px 18px -4px hsl(265 55% 22% / 0.12),
      0 24px 44px -12px hsl(265 55% 22% / 0.16),
      inset 0 1px 0 hsl(0 0% 100% / 0.6);
  }
/* Dark: a white inner highlight would look like a seam, so it drops to a faint
     violet, and the shadows deepen because a dark surface swallows a soft one. */
:root:not([data-theme='light']) .card-elevated,
  [data-theme='dark'] .card-elevated {
    box-shadow:
      0 1px 2px hsl(265 60% 4% / 0.5),
      0 6px 14px -4px hsl(265 60% 4% / 0.55),
      0 18px 34px -12px hsl(265 60% 4% / 0.6),
      inset 0 1px 0 hsl(var(--primary) / 0.14);
  }
:root:not([data-theme='light']) .card-elevated:hover,
  [data-theme='dark'] .card-elevated:hover {
    box-shadow:
      0 2px 5px hsl(265 60% 4% / 0.55),
      0 10px 22px -5px hsl(265 60% 4% / 0.6),
      0 28px 52px -14px hsl(265 60% 4% / 0.66),
      inset 0 1px 0 hsl(var(--primary) / 0.2);
  }
/* The lift is motion; the depth is not. Someone who asked for less movement still
     gets the card, just without it jumping. */
@media (prefers-reduced-motion: reduce) {
    .card-elevated:hover { transform: none; }
  }
.overlay-elevated {
    box-shadow:
      0 2px 4px hsl(265 55% 22% / 0.08),
      0 8px 20px -4px hsl(265 55% 22% / 0.14),
      0 24px 56px -12px hsl(265 55% 22% / 0.2),
      inset 0 1px 0 hsl(0 0% 100% / 0.6);
    backdrop-filter: saturate(140%) blur(8px);
  }
:root:not([data-theme='light']) .overlay-elevated,
  [data-theme='dark'] .overlay-elevated {
    box-shadow:
      0 2px 6px hsl(265 60% 3% / 0.6),
      0 12px 28px -6px hsl(265 60% 3% / 0.68),
      0 36px 72px -16px hsl(265 60% 3% / 0.75),
      inset 0 1px 0 hsl(var(--primary) / 0.18);
  }
.chart-glow .recharts-line-curve,
  .chart-glow .recharts-area-curve {
    filter: drop-shadow(0 2px 6px hsl(var(--primary) / 0.35));
  }
/* Draw-in. pathLength normalises every path to 1 so one dash value works whatever
     the real geometry is. */
@media (prefers-reduced-motion: no-preference) {
    .chart-draw .recharts-line-curve,
    .chart-draw .recharts-area-curve {
      stroke-dasharray: 1;
      stroke-dashoffset: 1;
      animation: chart-draw 900ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
  }
.row-accent { position: relative; }
.row-accent:hover {
    box-shadow: inset 3px 0 0 hsl(var(--primary) / 0.85);
  }
.tabs-track {
    background-image: linear-gradient(
      180deg,
      hsl(var(--primary) / 0.05) 0%,
      transparent 60%
    );
    box-shadow:
      inset 0 1px 2px hsl(265 55% 22% / 0.09),
      inset 0 0 0 1px hsl(var(--border) / 0.6);
  }
:root:not([data-theme='light']) .tabs-track,
  [data-theme='dark'] .tabs-track {
    box-shadow:
      inset 0 1px 3px hsl(265 60% 3% / 0.5),
      inset 0 0 0 1px hsl(0 0% 100% / 0.04);
  }
.tab-raised {
    transition:
      color 180ms ease,
      background-color 180ms ease,
      box-shadow 180ms cubic-bezier(0.16, 1, 0.3, 1),
      transform 180ms cubic-bezier(0.16, 1, 0.3, 1);
  }
/* Hover on an inactive tab brightens the label — see the note in theme-flags.ts. */
.tab-raised:not([data-state='active']):hover {
    color: hsl(var(--foreground));
    background-color: hsl(var(--primary) / 0.07);
  }
/* The selected tab is marked in purple: a stronger tint plus an accent bar along the
     bottom edge.

     The LABEL stays --foreground rather than going purple. Purple text on a purple tint
     measures 4.42:1 in the dark theme even at a 14% tint, under the floor — the two are
     too close together once one sits on the other. Against --foreground the same tint
     leaves 9.96:1 at its strongest, so the highlight can be as purple as it likes
     without touching legibility. */
.tab-raised[data-state='active'] {
    position: relative;
    background-image: linear-gradient(
      170deg,
      hsl(var(--primary) / 0.20) 0%,
      hsl(var(--primary) / 0.08) 55%,
      hsl(var(--primary) / 0.03) 92%
    );
    box-shadow:
      0 1px 2px hsl(265 55% 22% / 0.1),
      0 4px 10px -3px hsl(265 55% 22% / 0.14),
      inset 0 1px 0 hsl(0 0% 100% / 0.7);
  }
.tab-raised[data-state='active']::after {
    content: '';
    position: absolute;
    left: 20%;
    right: 20%;
    bottom: 2px;
    height: 2px;
    border-radius: 2px;
    background: hsl(var(--primary));
    box-shadow: 0 0 8px hsl(var(--primary) / 0.6);
  }
:root:not([data-theme='light']) .tab-raised[data-state='active'],
  [data-theme='dark'] .tab-raised[data-state='active'] {
    /* Dark needs more tint to read as coloured at all — the same 20% over a near-black
       surface barely registers. --foreground still clears 11:1 on it. */
    background-image: linear-gradient(
      170deg,
      hsl(var(--primary) / 0.30) 0%,
      hsl(var(--primary) / 0.12) 55%,
      hsl(var(--primary) / 0.04) 92%
    );
    box-shadow:
      0 1px 3px hsl(265 60% 3% / 0.55),
      0 6px 14px -4px hsl(265 60% 3% / 0.6),
      inset 0 1px 0 hsl(var(--primary) / 0.22);
  }
/* A tab bar that shifts as you move across it is worse than a flat one. */
@media (prefers-reduced-motion: no-preference) {
    .tab-raised[data-state='active'] { transform: translateY(-1px); }
  }
.tab-underline-active {
    box-shadow: 0 2px 8px -2px hsl(var(--primary) / 0.55);
  }
.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-0 {
  left: 0px;
  right: 0px;
}
.inset-y-0 {
  top: 0px;
  bottom: 0px;
}
.-left-24 {
  left: -6rem;
}
.-right-6 {
  right: -1.5rem;
}
.-top-24 {
  top: -6rem;
}
.-top-3 {
  top: -0.75rem;
}
.-top-6 {
  top: -1.5rem;
}
.bottom-0 {
  bottom: 0px;
}
.left-0 {
  left: 0px;
}
.left-1\/2 {
  left: 50%;
}
.left-2 {
  left: 0.5rem;
}
.left-3 {
  left: 0.75rem;
}
.left-4 {
  left: 1rem;
}
.left-\[50\%\] {
  left: 50%;
}
.right-0 {
  right: 0px;
}
.right-1 {
  right: 0.25rem;
}
.right-1\.5 {
  right: 0.375rem;
}
.right-2 {
  right: 0.5rem;
}
.right-3 {
  right: 0.75rem;
}
.right-4 {
  right: 1rem;
}
.top-0 {
  top: 0px;
}
.top-1\.5 {
  top: 0.375rem;
}
.top-1\/2 {
  top: 50%;
}
.top-2 {
  top: 0.5rem;
}
.top-3 {
  top: 0.75rem;
}
.top-4 {
  top: 1rem;
}
.top-\[50\%\] {
  top: 50%;
}
.top-full {
  top: 100%;
}
.z-10 {
  z-index: 10;
}
.z-30 {
  z-index: 30;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.col-span-2 {
  grid-column: span 2 / span 2;
}
.col-span-3 {
  grid-column: span 3 / span 3;
}
.-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;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.-mb-px {
  margin-bottom: -1px;
}
.-ml-2 {
  margin-left: -0.5rem;
}
.-mr-1 {
  margin-right: -0.25rem;
}
.-mt-1 {
  margin-top: -0.25rem;
}
.mb-0\.5 {
  margin-bottom: 0.125rem;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-1\.5 {
  margin-bottom: 0.375rem;
}
.mb-16 {
  margin-bottom: 4rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-8 {
  margin-bottom: 2rem;
}
.ml-0\.5 {
  margin-left: 0.125rem;
}
.ml-1 {
  margin-left: 0.25rem;
}
.ml-1\.5 {
  margin-left: 0.375rem;
}
.ml-2 {
  margin-left: 0.5rem;
}
.ml-auto {
  margin-left: auto;
}
.mr-1 {
  margin-right: 0.25rem;
}
.mr-1\.5 {
  margin-right: 0.375rem;
}
.mr-2 {
  margin-right: 0.5rem;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-1\.5 {
  margin-top: 0.375rem;
}
.mt-10 {
  margin-top: 2.5rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.mt-8 {
  margin-top: 2rem;
}
.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.table-row {
  display: table-row;
}
.grid {
  display: grid;
}
.\!hidden {
  display: none !important;
}
.hidden {
  display: none;
}
.aspect-square {
  aspect-ratio: 1 / 1;
}
.h-1 {
  height: 0.25rem;
}
.h-1\.5 {
  height: 0.375rem;
}
.h-10 {
  height: 2.5rem;
}
.h-11 {
  height: 2.75rem;
}
.h-12 {
  height: 3rem;
}
.h-14 {
  height: 3.5rem;
}
.h-16 {
  height: 4rem;
}
.h-2 {
  height: 0.5rem;
}
.h-2\.5 {
  height: 0.625rem;
}
.h-24 {
  height: 6rem;
}
.h-3 {
  height: 0.75rem;
}
.h-3\.5 {
  height: 0.875rem;
}
.h-32 {
  height: 8rem;
}
.h-4 {
  height: 1rem;
}
.h-48 {
  height: 12rem;
}
.h-5 {
  height: 1.25rem;
}
.h-56 {
  height: 14rem;
}
.h-6 {
  height: 1.5rem;
}
.h-64 {
  height: 16rem;
}
.h-7 {
  height: 1.75rem;
}
.h-72 {
  height: 18rem;
}
.h-8 {
  height: 2rem;
}
.h-9 {
  height: 2.25rem;
}
.h-96 {
  height: 24rem;
}
.h-\[15px\] {
  height: 15px;
}
.h-\[1px\] {
  height: 1px;
}
.h-\[60vh\] {
  height: 60vh;
}
.h-\[var\(--radix-select-trigger-height\)\] {
  height: var(--radix-select-trigger-height);
}
.h-auto {
  height: auto;
}
.h-fit {
  height: -moz-fit-content;
  height: fit-content;
}
.h-full {
  height: 100%;
}
.h-px {
  height: 1px;
}
.h-screen {
  height: 100vh;
}
.max-h-32 {
  max-height: 8rem;
}
.max-h-40 {
  max-height: 10rem;
}
.max-h-48 {
  max-height: 12rem;
}
.max-h-96 {
  max-height: 24rem;
}
.max-h-\[280px\] {
  max-height: 280px;
}
.max-h-\[400px\] {
  max-height: 400px;
}
.max-h-\[520px\] {
  max-height: 520px;
}
.max-h-\[680px\] {
  max-height: 680px;
}
.max-h-\[70vh\] {
  max-height: 70vh;
}
.max-h-\[90vh\] {
  max-height: 90vh;
}
.min-h-\[100px\] {
  min-height: 100px;
}
.min-h-\[120px\] {
  min-height: 120px;
}
.min-h-\[140px\] {
  min-height: 140px;
}
.min-h-\[400px\] {
  min-height: 400px;
}
.min-h-\[60vh\] {
  min-height: 60vh;
}
.min-h-\[80px\] {
  min-height: 80px;
}
.min-h-screen {
  min-height: 100vh;
}
.w-1 {
  width: 0.25rem;
}
.w-1\.5 {
  width: 0.375rem;
}
.w-1\/2 {
  width: 50%;
}
.w-10 {
  width: 2.5rem;
}
.w-11 {
  width: 2.75rem;
}
.w-12 {
  width: 3rem;
}
.w-14 {
  width: 3.5rem;
}
.w-16 {
  width: 4rem;
}
.w-2 {
  width: 0.5rem;
}
.w-2\.5 {
  width: 0.625rem;
}
.w-20 {
  width: 5rem;
}
.w-24 {
  width: 6rem;
}
.w-3 {
  width: 0.75rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-3\/4 {
  width: 75%;
}
.w-32 {
  width: 8rem;
}
.w-4 {
  width: 1rem;
}
.w-48 {
  width: 12rem;
}
.w-5 {
  width: 1.25rem;
}
.w-52 {
  width: 13rem;
}
.w-56 {
  width: 14rem;
}
.w-6 {
  width: 1.5rem;
}
.w-64 {
  width: 16rem;
}
.w-7 {
  width: 1.75rem;
}
.w-72 {
  width: 18rem;
}
.w-8 {
  width: 2rem;
}
.w-9 {
  width: 2.25rem;
}
.w-96 {
  width: 24rem;
}
.w-\[15px\] {
  width: 15px;
}
.w-\[1px\] {
  width: 1px;
}
.w-fit {
  width: -moz-fit-content;
  width: fit-content;
}
.w-full {
  width: 100%;
}
.w-px {
  width: 1px;
}
.min-w-0 {
  min-width: 0px;
}
.min-w-48 {
  min-width: 12rem;
}
.min-w-\[1\.25rem\] {
  min-width: 1.25rem;
}
.min-w-\[8rem\] {
  min-width: 8rem;
}
.min-w-\[var\(--radix-select-trigger-width\)\] {
  min-width: var(--radix-select-trigger-width);
}
.min-w-full {
  min-width: 100%;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-5xl {
  max-width: 64rem;
}
.max-w-7xl {
  max-width: 80rem;
}
.max-w-\[10rem\] {
  max-width: 10rem;
}
.max-w-\[120px\] {
  max-width: 120px;
}
.max-w-\[140px\] {
  max-width: 140px;
}
.max-w-\[180px\] {
  max-width: 180px;
}
.max-w-\[22rem\] {
  max-width: 22rem;
}
.max-w-lg {
  max-width: 32rem;
}
.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-shrink-0 {
  flex-shrink: 0;
}
.shrink {
  flex-shrink: 1;
}
.shrink-0 {
  flex-shrink: 0;
}
.-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-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));
}
.translate-x-\[-50\%\] {
  --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-y-\[-50\%\] {
  --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-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-3 {
  --tw-rotate: 3deg;
  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-down {

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

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.animate-fade-down {
  animation: fade-down 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes fade-in {

  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
.animate-fade-in {
  animation: fade-in 0.3s ease-out;
}
@keyframes fade-up {

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

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.animate-fade-up {
  animation: fade-up 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes ping {

  75%, 100% {
    transform: scale(2);
    opacity: 0;
  }
}
.animate-ping {
  animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}
@keyframes pulse {

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

  from {
    opacity: 0;
    transform: translateX(-8px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.animate-slide-in-left {
  animation: slide-in-left 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes spin {

  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.cursor-default {
  cursor: default;
}
.cursor-not-allowed {
  cursor: not-allowed;
}
.cursor-pointer {
  cursor: pointer;
}
.touch-none {
  touch-action: none;
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.resize-none {
  resize: none;
}
.resize-y {
  resize: vertical;
}
.list-inside {
  list-style-position: inside;
}
.list-decimal {
  list-style-type: decimal;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.flex-row {
  flex-direction: row;
}
.flex-col {
  flex-direction: column;
}
.flex-col-reverse {
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.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-12 {
  gap: 3rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-2\.5 {
  gap: 0.625rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-6 {
  gap: 1.5rem;
}
.gap-8 {
  gap: 2rem;
}
.gap-x-4 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.space-x-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.75rem * var(--tw-space-x-reverse));
  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(1rem * var(--tw-space-x-reverse));
  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(1.5rem * var(--tw-space-x-reverse));
  margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-8 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(2rem * var(--tw-space-x-reverse));
  margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-y-0 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0px * var(--tw-space-y-reverse));
}
.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-10 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2.5rem * 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-2\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.625rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.625rem * 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));
}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2rem * 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-border > :not([hidden]) ~ :not([hidden]) {
  border-color: hsl(var(--border));
}
.overflow-auto {
  overflow: auto;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-x-auto {
  overflow-x: auto;
}
.overflow-y-auto {
  overflow-y: auto;
}
.overflow-x-hidden {
  overflow-x: hidden;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.whitespace-pre {
  white-space: pre;
}
.break-words {
  overflow-wrap: break-word;
}
.break-all {
  word-break: break-all;
}
.rounded {
  border-radius: 0.25rem;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-3xl {
  border-radius: 1.5rem;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: var(--radius);
}
.rounded-md {
  border-radius: calc(var(--radius) - 2px);
}
.rounded-none {
  border-radius: 0px;
}
.rounded-sm {
  border-radius: calc(var(--radius) - 4px);
}
.rounded-xl {
  border-radius: calc(var(--radius) + 4px);
}
.border {
  border-width: 1px;
}
.border-0 {
  border-width: 0px;
}
.border-2 {
  border-width: 2px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-b-2 {
  border-bottom-width: 2px;
}
.border-l-4 {
  border-left-width: 4px;
}
.border-r {
  border-right-width: 1px;
}
.border-t {
  border-top-width: 1px;
}
.border-dashed {
  border-style: dashed;
}
.border-border {
  border-color: hsl(var(--border));
}
.border-destructive {
  border-color: hsl(var(--destructive));
}
.border-destructive\/20 {
  border-color: hsl(var(--destructive) / 0.2);
}
.border-destructive\/30 {
  border-color: hsl(var(--destructive) / 0.3);
}
.border-destructive\/40 {
  border-color: hsl(var(--destructive) / 0.4);
}
.border-destructive\/50 {
  border-color: hsl(var(--destructive) / 0.5);
}
.border-info\/30 {
  border-color: hsl(var(--info) / 0.3);
}
.border-info\/50 {
  border-color: hsl(var(--info) / 0.5);
}
.border-input {
  border-color: hsl(var(--input));
}
.border-muted-foreground {
  border-color: hsl(var(--muted-foreground));
}
.border-muted-foreground\/20 {
  border-color: hsl(var(--muted-foreground) / 0.2);
}
.border-primary {
  border-color: hsl(var(--primary));
}
.border-primary-foreground\/30 {
  border-color: hsl(var(--primary-foreground) / 0.3);
}
.border-primary\/20 {
  border-color: hsl(var(--primary) / 0.2);
}
.border-primary\/30 {
  border-color: hsl(var(--primary) / 0.3);
}
.border-primary\/40 {
  border-color: hsl(var(--primary) / 0.4);
}
.border-primary\/50 {
  border-color: hsl(var(--primary) / 0.5);
}
.border-severity-critical\/30 {
  border-color: hsl(var(--severity-critical) / 0.3);
}
.border-severity-high\/30 {
  border-color: hsl(var(--severity-high) / 0.3);
}
.border-severity-low\/30 {
  border-color: hsl(var(--severity-low) / 0.3);
}
.border-severity-medium\/30 {
  border-color: hsl(var(--severity-medium) / 0.3);
}
.border-sidebar-border {
  border-color: hsl(var(--sidebar-border));
}
.border-success {
  border-color: hsl(var(--success));
}
.border-success\/20 {
  border-color: hsl(var(--success) / 0.2);
}
.border-success\/30 {
  border-color: hsl(var(--success) / 0.3);
}
.border-success\/40 {
  border-color: hsl(var(--success) / 0.4);
}
.border-success\/50 {
  border-color: hsl(var(--success) / 0.5);
}
.border-teal-200 {
  --tw-border-opacity: 1;
  border-color: rgb(153 246 228 / var(--tw-border-opacity, 1));
}
.border-transparent {
  border-color: transparent;
}
.border-warning\/20 {
  border-color: hsl(var(--warning) / 0.2);
}
.border-warning\/30 {
  border-color: hsl(var(--warning) / 0.3);
}
.border-warning\/40 {
  border-color: hsl(var(--warning) / 0.4);
}
.border-zinc-800 {
  --tw-border-opacity: 1;
  border-color: rgb(39 39 42 / var(--tw-border-opacity, 1));
}
.border-l-amber-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(245 158 11 / var(--tw-border-opacity, 1));
}
.border-l-emerald-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(16 185 129 / var(--tw-border-opacity, 1));
}
.border-l-red-500 {
  --tw-border-opacity: 1;
  border-left-color: rgb(239 68 68 / var(--tw-border-opacity, 1));
}
.bg-accent {
  background-color: hsl(var(--accent));
}
.bg-accent\/40 {
  background-color: hsl(var(--accent) / 0.4);
}
.bg-accent\/50 {
  background-color: hsl(var(--accent) / 0.5);
}
.bg-accent\/70 {
  background-color: hsl(var(--accent) / 0.7);
}
.bg-amber-500\/10 {
  background-color: rgb(245 158 11 / 0.1);
}
.bg-background {
  background-color: hsl(var(--background));
}
.bg-background\/60 {
  background-color: hsl(var(--background) / 0.6);
}
.bg-background\/80 {
  background-color: hsl(var(--background) / 0.8);
}
.bg-black\/10 {
  background-color: rgb(0 0 0 / 0.1);
}
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}
.bg-black\/60 {
  background-color: rgb(0 0 0 / 0.6);
}
.bg-blue-500\/10 {
  background-color: rgb(59 130 246 / 0.1);
}
.bg-blue-600\/10 {
  background-color: rgb(37 99 235 / 0.1);
}
.bg-border {
  background-color: hsl(var(--border));
}
.bg-card {
  background-color: hsl(var(--card));
}
.bg-card\/50 {
  background-color: hsl(var(--card) / 0.5);
}
.bg-cyan-500\/10 {
  background-color: rgb(6 182 212 / 0.1);
}
.bg-destructive {
  background-color: hsl(var(--destructive));
}
.bg-destructive\/10 {
  background-color: hsl(var(--destructive) / 0.1);
}
.bg-destructive\/20 {
  background-color: hsl(var(--destructive) / 0.2);
}
.bg-destructive\/5 {
  background-color: hsl(var(--destructive) / 0.05);
}
.bg-destructive\/50 {
  background-color: hsl(var(--destructive) / 0.5);
}
.bg-foreground {
  background-color: hsl(var(--foreground));
}
.bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.bg-gray-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1));
}
.bg-gray-900\/10 {
  background-color: rgb(17 24 39 / 0.1);
}
.bg-indigo-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(99 102 241 / var(--tw-bg-opacity, 1));
}
.bg-indigo-500\/10 {
  background-color: rgb(99 102 241 / 0.1);
}
.bg-info {
  background-color: hsl(var(--info));
}
.bg-info\/10 {
  background-color: hsl(var(--info) / 0.1);
}
.bg-info\/5 {
  background-color: hsl(var(--info) / 0.05);
}
.bg-muted {
  background-color: hsl(var(--muted));
}
.bg-muted-foreground {
  background-color: hsl(var(--muted-foreground));
}
.bg-muted-foreground\/20 {
  background-color: hsl(var(--muted-foreground) / 0.2);
}
.bg-muted-foreground\/40 {
  background-color: hsl(var(--muted-foreground) / 0.4);
}
.bg-muted-foreground\/50 {
  background-color: hsl(var(--muted-foreground) / 0.5);
}
.bg-muted\/10 {
  background-color: hsl(var(--muted) / 0.1);
}
.bg-muted\/20 {
  background-color: hsl(var(--muted) / 0.2);
}
.bg-muted\/30 {
  background-color: hsl(var(--muted) / 0.3);
}
.bg-muted\/40 {
  background-color: hsl(var(--muted) / 0.4);
}
.bg-muted\/50 {
  background-color: hsl(var(--muted) / 0.5);
}
.bg-muted\/70 {
  background-color: hsl(var(--muted) / 0.7);
}
.bg-orange-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(249 115 22 / var(--tw-bg-opacity, 1));
}
.bg-orange-500\/10 {
  background-color: rgb(249 115 22 / 0.1);
}
.bg-popover {
  background-color: hsl(var(--popover));
}
.bg-primary {
  background-color: hsl(var(--primary));
}
.bg-primary-foreground\/20 {
  background-color: hsl(var(--primary-foreground) / 0.2);
}
.bg-primary\/10 {
  background-color: hsl(var(--primary) / 0.1);
}
.bg-primary\/15 {
  background-color: hsl(var(--primary) / 0.15);
}
.bg-primary\/5 {
  background-color: hsl(var(--primary) / 0.05);
}
.bg-purple-500\/10 {
  background-color: rgb(168 85 247 / 0.1);
}
.bg-red-500\/10 {
  background-color: rgb(239 68 68 / 0.1);
}
.bg-secondary {
  background-color: hsl(var(--secondary));
}
.bg-severity-critical {
  background-color: hsl(var(--severity-critical));
}
.bg-severity-critical\/10 {
  background-color: hsl(var(--severity-critical) / 0.1);
}
.bg-severity-high {
  background-color: hsl(var(--severity-high));
}
.bg-severity-high\/10 {
  background-color: hsl(var(--severity-high) / 0.1);
}
.bg-severity-low {
  background-color: hsl(var(--severity-low));
}
.bg-severity-low\/10 {
  background-color: hsl(var(--severity-low) / 0.1);
}
.bg-severity-medium {
  background-color: hsl(var(--severity-medium));
}
.bg-severity-medium\/10 {
  background-color: hsl(var(--severity-medium) / 0.1);
}
.bg-sidebar-border\/60 {
  background-color: hsl(var(--sidebar-border) / 0.6);
}
.bg-sky-500\/10 {
  background-color: rgb(14 165 233 / 0.1);
}
.bg-success {
  background-color: hsl(var(--success));
}
.bg-success\/10 {
  background-color: hsl(var(--success) / 0.1);
}
.bg-success\/20 {
  background-color: hsl(var(--success) / 0.2);
}
.bg-success\/5 {
  background-color: hsl(var(--success) / 0.05);
}
.bg-success\/50 {
  background-color: hsl(var(--success) / 0.5);
}
.bg-teal-50\/50 {
  background-color: rgb(240 253 250 / 0.5);
}
.bg-teal-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(20 184 166 / var(--tw-bg-opacity, 1));
}
.bg-transparent {
  background-color: transparent;
}
.bg-violet-500\/10 {
  background-color: rgb(139 92 246 / 0.1);
}
.bg-warning {
  background-color: hsl(var(--warning));
}
.bg-warning\/10 {
  background-color: hsl(var(--warning) / 0.1);
}
.bg-warning\/20 {
  background-color: hsl(var(--warning) / 0.2);
}
.bg-warning\/50 {
  background-color: hsl(var(--warning) / 0.5);
}
.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-white\/20 {
  background-color: rgb(255 255 255 / 0.2);
}
.bg-white\/5 {
  background-color: rgb(255 255 255 / 0.05);
}
.bg-yellow-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(234 179 8 / var(--tw-bg-opacity, 1));
}
.bg-zinc-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(63 63 70 / var(--tw-bg-opacity, 1));
}
.bg-zinc-900 {
  --tw-bg-opacity: 1;
  background-color: rgb(24 24 27 / var(--tw-bg-opacity, 1));
}
.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}
.bg-gradient-to-r {
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}
.from-fuchsia-500 {
  --tw-gradient-from: #d946ef var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(217 70 239 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary {
  --tw-gradient-from: hsl(var(--primary)) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/5 {
  --tw-gradient-from: hsl(var(--primary) / 0.05) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-indigo-700 {
  --tw-gradient-to: rgb(67 56 202 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #4338ca var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-fuchsia-600 {
  --tw-gradient-to: #c026d3 var(--tw-gradient-to-position);
}
.to-info {
  --tw-gradient-to: hsl(var(--info)) var(--tw-gradient-to-position);
}
.to-pink-600 {
  --tw-gradient-to: #db2777 var(--tw-gradient-to-position);
}
.to-primary {
  --tw-gradient-to: hsl(var(--primary)) var(--tw-gradient-to-position);
}
.to-primary\/80 {
  --tw-gradient-to: hsl(var(--primary) / 0.8) var(--tw-gradient-to-position);
}
.to-transparent {
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}
.fill-current {
  fill: currentColor;
}
.stroke-muted {
  stroke: hsl(var(--muted));
}
.p-0 {
  padding: 0px;
}
.p-1 {
  padding: 0.25rem;
}
.p-1\.5 {
  padding: 0.375rem;
}
.p-10 {
  padding: 2.5rem;
}
.p-12 {
  padding: 3rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-2\.5 {
  padding: 0.625rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-8 {
  padding: 2rem;
}
.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-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.py-0 {
  padding-top: 0px;
  padding-bottom: 0px;
}
.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-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-20 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}
.py-24 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.pb-0 {
  padding-bottom: 0px;
}
.pb-1 {
  padding-bottom: 0.25rem;
}
.pb-2 {
  padding-bottom: 0.5rem;
}
.pb-3 {
  padding-bottom: 0.75rem;
}
.pb-4 {
  padding-bottom: 1rem;
}
.pb-6 {
  padding-bottom: 1.5rem;
}
.pl-1 {
  padding-left: 0.25rem;
}
.pl-10 {
  padding-left: 2.5rem;
}
.pl-8 {
  padding-left: 2rem;
}
.pl-9 {
  padding-left: 2.25rem;
}
.pr-1 {
  padding-right: 0.25rem;
}
.pr-10 {
  padding-right: 2.5rem;
}
.pr-2 {
  padding-right: 0.5rem;
}
.pr-3 {
  padding-right: 0.75rem;
}
.pr-4 {
  padding-right: 1rem;
}
.pt-0 {
  padding-top: 0px;
}
.pt-1 {
  padding-top: 0.25rem;
}
.pt-2 {
  padding-top: 0.5rem;
}
.pt-3 {
  padding-top: 0.75rem;
}
.pt-4 {
  padding-top: 1rem;
}
.pt-5 {
  padding-top: 1.25rem;
}
.pt-6 {
  padding-top: 1.5rem;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.font-sans {
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.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;
}
.lowercase {
  text-transform: lowercase;
}
.capitalize {
  text-transform: capitalize;
}
.italic {
  font-style: italic;
}
.ordinal {
  --tw-ordinal: ordinal;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.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-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;
}
.tracking-widest {
  letter-spacing: 0.1em;
}
.text-background {
  color: hsl(var(--background));
}
.text-blue-700 {
  --tw-text-opacity: 1;
  color: rgb(29 78 216 / var(--tw-text-opacity, 1));
}
.text-card-foreground {
  color: hsl(var(--card-foreground));
}
.text-cyan-700 {
  --tw-text-opacity: 1;
  color: rgb(14 116 144 / var(--tw-text-opacity, 1));
}
.text-destructive {
  color: hsl(var(--destructive));
}
.text-destructive-foreground {
  color: hsl(var(--destructive-foreground));
}
.text-destructive\/80 {
  color: hsl(var(--destructive) / 0.8);
}
.text-foreground {
  color: hsl(var(--foreground));
}
.text-gray-600 {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}
.text-info {
  color: hsl(var(--info));
}
.text-muted-foreground {
  color: hsl(var(--muted-foreground));
}
.text-muted-foreground\/30 {
  color: hsl(var(--muted-foreground) / 0.3);
}
.text-muted-foreground\/40 {
  color: hsl(var(--muted-foreground) / 0.4);
}
.text-muted-foreground\/50 {
  color: hsl(var(--muted-foreground) / 0.5);
}
.text-muted-foreground\/60 {
  color: hsl(var(--muted-foreground) / 0.6);
}
.text-muted-foreground\/70 {
  color: hsl(var(--muted-foreground) / 0.7);
}
.text-muted\/30 {
  color: hsl(var(--muted) / 0.3);
}
.text-popover-foreground {
  color: hsl(var(--popover-foreground));
}
.text-primary {
  color: hsl(var(--primary));
}
.text-primary-foreground {
  color: hsl(var(--primary-foreground));
}
.text-primary-foreground\/80 {
  color: hsl(var(--primary-foreground) / 0.8);
}
.text-secondary-foreground {
  color: hsl(var(--secondary-foreground));
}
.text-severity-critical {
  color: hsl(var(--severity-critical));
}
.text-severity-high {
  color: hsl(var(--severity-high));
}
.text-severity-low {
  color: hsl(var(--severity-low));
}
.text-severity-medium {
  color: hsl(var(--severity-medium));
}
.text-sidebar-foreground {
  color: hsl(var(--sidebar-foreground));
}
.text-sky-700 {
  --tw-text-opacity: 1;
  color: rgb(3 105 161 / var(--tw-text-opacity, 1));
}
.text-success {
  color: hsl(var(--success));
}
.text-teal-500 {
  --tw-text-opacity: 1;
  color: rgb(20 184 166 / var(--tw-text-opacity, 1));
}
.text-warning {
  color: hsl(var(--warning));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-white\/40 {
  color: rgb(255 255 255 / 0.4);
}
.text-white\/60 {
  color: rgb(255 255 255 / 0.6);
}
.text-white\/70 {
  color: rgb(255 255 255 / 0.7);
}
.text-white\/80 {
  color: rgb(255 255 255 / 0.8);
}
.text-white\/90 {
  color: rgb(255 255 255 / 0.9);
}
.text-zinc-200 {
  --tw-text-opacity: 1;
  color: rgb(228 228 231 / var(--tw-text-opacity, 1));
}
.underline {
  text-decoration-line: underline;
}
.line-through {
  text-decoration-line: line-through;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.accent-primary {
  accent-color: hsl(var(--primary));
}
.opacity-0 {
  opacity: 0;
}
.opacity-10 {
  opacity: 0.1;
}
.opacity-100 {
  opacity: 1;
}
.opacity-20 {
  opacity: 0.2;
}
.opacity-25 {
  opacity: 0.25;
}
.opacity-30 {
  opacity: 0.3;
}
.opacity-40 {
  opacity: 0.4;
}
.opacity-45 {
  opacity: 0.45;
}
.opacity-50 {
  opacity: 0.5;
}
.opacity-60 {
  opacity: 0.6;
}
.opacity-70 {
  opacity: 0.7;
}
.opacity-75 {
  opacity: 0.75;
}
.opacity-80 {
  opacity: 0.8;
}
.shadow {
  --tw-shadow: var(--shadow);
  --tw-shadow-colored: var(--shadow);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg {
  --tw-shadow: var(--shadow-lg);
  --tw-shadow-colored: var(--shadow-lg);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-md {
  --tw-shadow: var(--shadow-md);
  --tw-shadow-colored: var(--shadow-md);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow: var(--shadow-sm);
  --tw-shadow-colored: var(--shadow-sm);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xl {
  --tw-shadow: var(--shadow-xl);
  --tw-shadow-colored: var(--shadow-xl);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[var\(--shadow\)\] {
  --tw-shadow-color: var(--shadow);
  --tw-shadow: var(--tw-shadow-colored);
}
.shadow-\[var\(--shadow-md\)\] {
  --tw-shadow-color: var(--shadow-md);
  --tw-shadow: var(--tw-shadow-colored);
}
.shadow-\[var\(--shadow-sm\)\] {
  --tw-shadow-color: var(--shadow-sm);
  --tw-shadow: var(--tw-shadow-colored);
}
.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-0 {
  --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(0px + 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-offset-background {
  --tw-ring-offset-color: hsl(var(--background));
}
.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);
}
.blur-2xl {
  --tw-blur: blur(40px);
  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);
}
.blur-3xl {
  --tw-blur: blur(64px);
  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 {
  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: 180ms;
}
.transition-\[color\2c background-color\2c border-color\2c box-shadow\2c transform\] {
  transition-property: color,background-color,border-color,box-shadow,transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 180ms;
}
.transition-\[color\2c background-color\2c border-color\2c box-shadow\] {
  transition-property: color,background-color,border-color,box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 180ms;
}
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 180ms;
}
.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: 180ms;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 180ms;
}
.transition-shadow {
  transition-property: box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 180ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 180ms;
}
.duration-150 {
  transition-duration: 150ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.duration-300 {
  transition-duration: 300ms;
}
.duration-500 {
  transition-duration: 500ms;
}
.duration-75 {
  transition-duration: 75ms;
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
@keyframes enter {

  from {
    opacity: var(--tw-enter-opacity, 1);
    transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
  }
}
@keyframes exit {

  to {
    opacity: var(--tw-exit-opacity, 1);
    transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
  }
}
.duration-150 {
  animation-duration: 150ms;
}
.duration-200 {
  animation-duration: 200ms;
}
.duration-300 {
  animation-duration: 300ms;
}
.duration-500 {
  animation-duration: 500ms;
}
.duration-75 {
  animation-duration: 75ms;
}
.ease-out {
  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.running {
  animation-play-state: running;
}
/* ── Gradient mesh canvas (applied to root layout div) ─────────────── */
.gradient-mesh {
    background-image:
      radial-gradient(ellipse at 10% 10%, hsl(265 60% 90% / 0.55) 0%, transparent 42%),
      radial-gradient(ellipse at 90% 10%, hsl(270 30% 93% / 0.45) 0%, transparent 42%),
      radial-gradient(ellipse at 50% 90%, hsl(265 45% 92% / 0.40) 0%, transparent 42%),
      radial-gradient(ellipse at 5%  80%, hsl(0 0% 95% / 0.35) 0%, transparent 38%);
  }
.dark .gradient-mesh {
    background-image:
      radial-gradient(ellipse at 10% 10%, hsl(265 55% 22% / 0.55) 0%, transparent 42%),
      radial-gradient(ellipse at 90% 10%, hsl(270 30% 16% / 0.45) 0%, transparent 42%),
      radial-gradient(ellipse at 50% 90%, hsl(265 40% 18% / 0.38) 0%, transparent 42%),
      radial-gradient(ellipse at 5%  80%, hsl(0 0% 12% / 0.35) 0%, transparent 38%);
  }
/* ── Glass surfaces ─────────────────────────────────────────────────── */
.glass {
    background: hsl(var(--card) / 0.70);
    backdrop-filter: blur(14px) saturate(1.6);
    -webkit-backdrop-filter: blur(14px) saturate(1.6);
    border: 1px solid hsl(var(--border) / 0.55);
  }
.dark .glass {
    background: hsl(var(--card) / 0.60);
    border-color: hsl(var(--border) / 0.40);
  }
.glass-strong {
    background: hsl(var(--card) / 0.85);
    backdrop-filter: blur(24px) saturate(1.8);
    -webkit-backdrop-filter: blur(24px) saturate(1.8);
    border: 1px solid hsl(var(--border) / 0.65);
    box-shadow: var(--shadow-lg);
  }
.dark .glass-strong {
    background: hsl(var(--card) / 0.80);
    border-color: hsl(255 100% 100% / 0.07);
  }
/* Coloured glass tints */
.glass-violet {
    background: hsl(258 52% 64% / 0.10);
    backdrop-filter: blur(14px) saturate(1.5);
    -webkit-backdrop-filter: blur(14px) saturate(1.5);
    border: 1px solid hsl(258 52% 64% / 0.22);
  }
/* Formerly rose/mint tints. The palette is monochrome now, so these resolve to
     accent and neutral washes. Names retained to avoid breaking call sites. */
/* Sidebar — solid black in both themes, white text, purple on hover.
     Opaque on purpose: the previous 0.78 alpha let the page background bleed
     through, so it never read as true black. */
.glass-sidebar {
    background: hsl(var(--sidebar));
    border-color: hsl(var(--sidebar-border));

    /* The sidebar is black in BOTH themes, but its children use the generic
       tokens (text-foreground, text-muted-foreground, bg-accent, border-border)
       which resolve against the PAGE background — in light mode that would be
       dark-on-black, i.e. invisible. Re-point them here rather than rewriting
       26 call sites.

       --primary is overridden too: the light theme's primary is 265 90% 52%,
       which measures only 3.12:1 on black and is unreadable as hover text. The
       brighter variant below is 6.65:1 on black in both themes. */
    --primary: 265 95% 72%;
    --foreground: 0 0% 100%;          /* pure white, 21:1 on black */
    --muted-foreground: 0 0% 72%;     /* 9.7:1 — secondary sidebar text */
    --accent: 265 60% 16%;            /* hover wash, tinted toward the accent */
    --accent-foreground: 0 0% 100%;
    --border: var(--sidebar-border);
    --secondary: 0 0% 12%;
    --secondary-foreground: 0 0% 100%;
  }
.dark .glass-sidebar {
    background: hsl(var(--sidebar));
    border-color: hsl(0 0% 100% / 0.08);
  }
/* ── Gradients ──────────────────────────────────────────────────────── */
.gradient-text {
    background: linear-gradient(135deg, hsl(var(--primary)), hsl(278 70% 62%));
    -webkit-background-clip: text;
            background-clip: text;
    color: transparent;
  }
/* ── Nav active indicator ───────────────────────────────────────────── */
/* The sidebar is pure black and permanently on screen, so the active item is the
     one surface where a little depth earns the most. A flat 2.5px bar and a 10% tint
     read as "slightly different" rather than "you are here".

     The glow is a gradient fading left-to-right, so it reinforces the bar instead of
     washing the whole row — text sits on the quiet end and keeps its contrast. */
.nav-item-active { position: relative; }
.nav-item-active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 70%;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: linear-gradient(
      180deg,
      hsl(var(--primary)) 0%,
      hsl(var(--primary) / 0.65) 100%
    );
    box-shadow: 0 0 10px hsl(var(--primary) / 0.55);
  }
.nav-item-active::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(
      90deg,
      hsl(var(--primary) / 0.16) 0%,
      hsl(var(--primary) / 0.05) 38%,
      transparent 72%
    );
  }
/* ── Elevated surface ───────────────────────────────────────────────── */
/* ── Glow ───────────────────────────────────────────────────────────── */
/* ── Shimmer skeleton ───────────────────────────────────────────────── */
.shimmer {
    background: linear-gradient(
      90deg,
      hsl(var(--muted)) 0%,
      hsl(var(--primary) / 0.07) 50%,
      hsl(var(--muted)) 100%
    );
    background-size: 200% 100%;
    animation: shimmer 2s linear infinite;
  }
/* ── Stagger delays ─────────────────────────────────────────────────── */

/* ── Scrollbar ────────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: hsl(var(--primary) / 0.25);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: hsl(var(--primary) / 0.45); }

/* ── Utilities ────────────────────────────────────────────────────────────── */

/* ── Reduced motion ───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── Typographic scale ─────────────────────────────────────────────────────────
   Ten raw text-* sizes were in use with a long tail (one text-6xl, one text-5xl)
   and text-2xl doing 116 different jobs — page titles, card titles and stat values
   all at the same weight and size, so nothing read as more important than anything
   else. These are the six roles the product actually has. Line heights are set with
   the size so vertical rhythm cannot drift, and tracking tightens as size grows,
   which is what stops large text looking loose.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── Raised cards (reversible) ─────────────────────────────────────────────────
   Decorative depth only. Toggle with CARD_ELEVATION in lib/theme-flags.ts; delete
   this block and that constant to remove it entirely. Nothing depends on it.

   Depth comes mostly from the shadow stack and the top inner highlight — light
   reads as coming from above — rather than from the gradient, which is capped at
   6%. It composites over each card's domain tint, and beyond 6% muted text on the
   darkest tints falls under 4.5:1. Measured against every --domain-*-surface.

   background-image, not background-color: the domain and severity tints are applied
   inline as a background-color, so the gradient layers over them and lets the tint
   show through instead of replacing it.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── Raised overlays (reversible) ──────────────────────────────────────────────
   Toggle with OVERLAY_ELEVATION in lib/theme-flags.ts; delete this block and that
   constant to remove it. Matches `.card-elevated` deliberately but sits higher: an
   overlay floats above the whole page rather than within it, so the shadow spreads
   further and the surface is more opaque.

   No gradient here. Overlays carry dense text — menu items, dialog copy, the command
   palette list — and a tint behind all of it would cost contrast for decoration, which
   is the trade the 6% cap on cards already showed is not worth making.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── Chart flourish (reversible) ───────────────────────────────────────────────
   Toggle with CHART_FLOURISH in lib/theme-flags.ts.

   The glow is a drop-shadow filter on the stroke only, not on the fill — filtering a
   gradient area fill doubles the paint cost for something nobody can see under it.
   ───────────────────────────────────────────────────────────────────────────── */

@keyframes chart-draw {
  to { stroke-dashoffset: 0; }
}

/* ── Table row hover accent (reversible) ───────────────────────────────────────
   Toggle with ROW_HOVER_ACCENT in lib/theme-flags.ts.

   box-shadow rather than a border, because a border on hover changes the row's box
   and shifts every cell by 3px as the pointer moves down the table.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── Raised tabs (reversible) ──────────────────────────────────────────────────
   Toggle with TAB_ELEVATION in lib/theme-flags.ts.

   The track is recessed and the active tab sits proudly on it, which is what makes a
   tab bar read as a physical control rather than as three words in a grey box. Same
   light-from-above logic as the cards: inset shadow on the track, inset highlight on
   the raised tab.

   The active gradient runs to 12%. Measured: --foreground on --background stays above
   13:1 either side of that, so the constraint here was never the active tab — it was
   the inactive hover, which is why hover moves the label to --foreground.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── Underline tab bars ────────────────────────────────────────────────────────
   Three pages predate the Tabs primitive and draw their own bar with
   `border-b-2 border-primary text-primary`. That is already purple and already
   readable — --primary measures 6.39:1 light and 5.15:1 dark on --background — so
   they are not worth refactoring onto the component just to look the same.

   This gives their active border the glow the raised tabs carry, so the two styles
   read as the same family rather than as two unrelated tab bars.
   ───────────────────────────────────────────────────────────────────────────── */
.file\:border-0::file-selector-button {
  border-width: 0px;
}
.file\:bg-transparent::file-selector-button {
  background-color: transparent;
}
.file\:text-sm::file-selector-button {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.file\:font-medium::file-selector-button {
  font-weight: 500;
}
.placeholder\:text-muted-foreground::-moz-placeholder {
  color: hsl(var(--muted-foreground));
}
.placeholder\:text-muted-foreground::placeholder {
  color: hsl(var(--muted-foreground));
}
.last\:border-0:last-child {
  border-width: 0px;
}
.hover\:-translate-y-0\.5:hover {
  --tw-translate-y: -0.125rem;
  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));
}
.hover\:border-border\/90:hover {
  border-color: hsl(var(--border) / 0.9);
}
.hover\:border-destructive\/30:hover {
  border-color: hsl(var(--destructive) / 0.3);
}
.hover\:border-primary:hover {
  border-color: hsl(var(--primary));
}
.hover\:border-primary\/40:hover {
  border-color: hsl(var(--primary) / 0.4);
}
.hover\:border-primary\/50:hover {
  border-color: hsl(var(--primary) / 0.5);
}
.hover\:bg-accent:hover {
  background-color: hsl(var(--accent));
}
.hover\:bg-accent\/40:hover {
  background-color: hsl(var(--accent) / 0.4);
}
.hover\:bg-accent\/50:hover {
  background-color: hsl(var(--accent) / 0.5);
}
.hover\:bg-accent\/60:hover {
  background-color: hsl(var(--accent) / 0.6);
}
.hover\:bg-destructive\/10:hover {
  background-color: hsl(var(--destructive) / 0.1);
}
.hover\:bg-destructive\/80:hover {
  background-color: hsl(var(--destructive) / 0.8);
}
.hover\:bg-destructive\/90:hover {
  background-color: hsl(var(--destructive) / 0.9);
}
.hover\:bg-info\/90:hover {
  background-color: hsl(var(--info) / 0.9);
}
.hover\:bg-muted:hover {
  background-color: hsl(var(--muted));
}
.hover\:bg-muted-foreground\/30:hover {
  background-color: hsl(var(--muted-foreground) / 0.3);
}
.hover\:bg-muted\/20:hover {
  background-color: hsl(var(--muted) / 0.2);
}
.hover\:bg-muted\/30:hover {
  background-color: hsl(var(--muted) / 0.3);
}
.hover\:bg-muted\/40:hover {
  background-color: hsl(var(--muted) / 0.4);
}
.hover\:bg-muted\/50:hover {
  background-color: hsl(var(--muted) / 0.5);
}
.hover\:bg-muted\/80:hover {
  background-color: hsl(var(--muted) / 0.8);
}
.hover\:bg-primary\/15:hover {
  background-color: hsl(var(--primary) / 0.15);
}
.hover\:bg-primary\/5:hover {
  background-color: hsl(var(--primary) / 0.05);
}
.hover\:bg-primary\/80:hover {
  background-color: hsl(var(--primary) / 0.8);
}
.hover\:bg-primary\/90:hover {
  background-color: hsl(var(--primary) / 0.9);
}
.hover\:bg-secondary\/80:hover {
  background-color: hsl(var(--secondary) / 0.8);
}
.hover\:bg-success\/10:hover {
  background-color: hsl(var(--success) / 0.1);
}
.hover\:bg-success\/90:hover {
  background-color: hsl(var(--success) / 0.9);
}
.hover\:bg-zinc-600:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(82 82 91 / var(--tw-bg-opacity, 1));
}
.hover\:text-accent-foreground:hover {
  color: hsl(var(--accent-foreground));
}
.hover\:text-destructive:hover {
  color: hsl(var(--destructive));
}
.hover\:text-destructive\/80:hover {
  color: hsl(var(--destructive) / 0.8);
}
.hover\:text-foreground:hover {
  color: hsl(var(--foreground));
}
.hover\:text-muted-foreground:hover {
  color: hsl(var(--muted-foreground));
}
.hover\:text-primary:hover {
  color: hsl(var(--primary));
}
.hover\:text-primary\/80:hover {
  color: hsl(var(--primary) / 0.8);
}
.hover\:text-success\/80:hover {
  color: hsl(var(--success) / 0.8);
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.hover\:opacity-100:hover {
  opacity: 1;
}
.hover\:shadow-lg:hover {
  --tw-shadow: var(--shadow-lg);
  --tw-shadow-colored: var(--shadow-lg);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-md:hover {
  --tw-shadow: var(--shadow-md);
  --tw-shadow-colored: var(--shadow-md);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-\[var\(--shadow-md\)\]:hover {
  --tw-shadow-color: var(--shadow-md);
  --tw-shadow: var(--tw-shadow-colored);
}
.hover\:ring-2:hover {
  --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);
}
.hover\:ring-primary\/50:hover {
  --tw-ring-color: hsl(var(--primary) / 0.5);
}
.hover\:brightness-95:hover {
  --tw-brightness: brightness(.95);
  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);
}
.focus\:bg-accent:focus {
  background-color: hsl(var(--accent));
}
.focus\:text-accent-foreground:focus {
  color: hsl(var(--accent-foreground));
}
.focus-visible\:border-primary:focus-visible {
  border-color: hsl(var(--primary));
}
.focus-visible\:border-transparent:focus-visible {
  border-color: transparent;
}
.focus-visible\:bg-accent\/50:focus-visible {
  background-color: hsl(var(--accent) / 0.5);
}
.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-destructive:focus-visible {
  --tw-ring-color: hsl(var(--destructive));
}
.focus-visible\:ring-info\/80:focus-visible {
  --tw-ring-color: hsl(var(--info) / 0.8);
}
.focus-visible\:ring-primary\/30:focus-visible {
  --tw-ring-color: hsl(var(--primary) / 0.3);
}
.focus-visible\:ring-ring:focus-visible {
  --tw-ring-color: hsl(var(--ring));
}
.focus-visible\:ring-offset-2:focus-visible {
  --tw-ring-offset-width: 2px;
}
.focus-visible\:ring-offset-background:focus-visible {
  --tw-ring-offset-color: hsl(var(--background));
}
.active\:scale-\[0\.98\]:active {
  --tw-scale-x: 0.98;
  --tw-scale-y: 0.98;
  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));
}
.disabled\:pointer-events-none:disabled {
  pointer-events: none;
}
.disabled\:cursor-not-allowed:disabled {
  cursor: not-allowed;
}
.disabled\:opacity-40:disabled {
  opacity: 0.4;
}
.disabled\:opacity-50:disabled {
  opacity: 0.5;
}
.group:hover .group-hover\:scale-110 {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  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));
}
.group:hover .group-hover\:text-primary\/80 {
  color: hsl(var(--primary) / 0.8);
}
.group:hover .group-hover\:opacity-100 {
  opacity: 1;
}
.peer:disabled ~ .peer-disabled\:cursor-not-allowed {
  cursor: not-allowed;
}
.peer:disabled ~ .peer-disabled\:opacity-70 {
  opacity: 0.7;
}
.data-\[disabled\=true\]\:pointer-events-none[data-disabled="true"] {
  pointer-events: none;
}
.data-\[disabled\]\:pointer-events-none[data-disabled] {
  pointer-events: none;
}
.data-\[side\=bottom\]\:translate-y-1[data-side="bottom"] {
  --tw-translate-y: 0.25rem;
  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));
}
.data-\[side\=left\]\:-translate-x-1[data-side="left"] {
  --tw-translate-x: -0.25rem;
  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));
}
.data-\[side\=right\]\:translate-x-1[data-side="right"] {
  --tw-translate-x: 0.25rem;
  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));
}
.data-\[side\=top\]\:-translate-y-1[data-side="top"] {
  --tw-translate-y: -0.25rem;
  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));
}
.data-\[state\=checked\]\:translate-x-5[data-state="checked"] {
  --tw-translate-x: 1.25rem;
  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));
}
.data-\[state\=unchecked\]\:translate-x-0[data-state="unchecked"] {
  --tw-translate-x: 0px;
  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));
}
.data-\[selected\=true\]\:bg-accent[data-selected="true"] {
  background-color: hsl(var(--accent));
}
.data-\[state\=active\]\:bg-background[data-state="active"] {
  background-color: hsl(var(--background));
}
.data-\[state\=checked\]\:bg-primary[data-state="checked"] {
  background-color: hsl(var(--primary));
}
.data-\[state\=open\]\:bg-accent[data-state="open"] {
  background-color: hsl(var(--accent));
}
.data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
  background-color: hsl(var(--input));
}
.data-\[selected\=true\]\:text-accent-foreground[data-selected="true"] {
  color: hsl(var(--accent-foreground));
}
.data-\[state\=active\]\:text-foreground[data-state="active"] {
  color: hsl(var(--foreground));
}
.data-\[state\=open\]\:text-muted-foreground[data-state="open"] {
  color: hsl(var(--muted-foreground));
}
.data-\[disabled\=true\]\:opacity-50[data-disabled="true"] {
  opacity: 0.5;
}
.data-\[disabled\]\:opacity-50[data-disabled] {
  opacity: 0.5;
}
.data-\[state\=active\]\:shadow-sm[data-state="active"] {
  --tw-shadow: var(--shadow-sm);
  --tw-shadow-colored: var(--shadow-sm);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.data-\[state\=open\]\:animate-in[data-state="open"] {
  animation-name: enter;
  animation-duration: 180ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.data-\[state\=closed\]\:animate-out[data-state="closed"] {
  animation-name: exit;
  animation-duration: 180ms;
  --tw-exit-opacity: initial;
  --tw-exit-scale: initial;
  --tw-exit-rotate: initial;
  --tw-exit-translate-x: initial;
  --tw-exit-translate-y: initial;
}
.data-\[state\=closed\]\:fade-out-0[data-state="closed"] {
  --tw-exit-opacity: 0;
}
.data-\[state\=open\]\:fade-in-0[data-state="open"] {
  --tw-enter-opacity: 0;
}
.data-\[state\=closed\]\:zoom-out-95[data-state="closed"] {
  --tw-exit-scale: .95;
}
.data-\[state\=open\]\:zoom-in-95[data-state="open"] {
  --tw-enter-scale: .95;
}
.data-\[side\=bottom\]\:slide-in-from-top-2[data-side="bottom"] {
  --tw-enter-translate-y: -0.5rem;
}
.data-\[side\=left\]\:slide-in-from-right-2[data-side="left"] {
  --tw-enter-translate-x: 0.5rem;
}
.data-\[side\=right\]\:slide-in-from-left-2[data-side="right"] {
  --tw-enter-translate-x: -0.5rem;
}
.data-\[side\=top\]\:slide-in-from-bottom-2[data-side="top"] {
  --tw-enter-translate-y: 0.5rem;
}
.data-\[state\=closed\]\:slide-out-to-left-1\/2[data-state="closed"] {
  --tw-exit-translate-x: -50%;
}
.data-\[state\=closed\]\:slide-out-to-top-\[48\%\][data-state="closed"] {
  --tw-exit-translate-y: -48%;
}
.data-\[state\=open\]\:slide-in-from-left-1\/2[data-state="open"] {
  --tw-enter-translate-x: -50%;
}
.data-\[state\=open\]\:slide-in-from-top-\[48\%\][data-state="open"] {
  --tw-enter-translate-y: -48%;
}
@media (prefers-reduced-motion: reduce) {

  .motion-reduce\:hidden {
    display: none;
  }
}
.dark\:border-destructive:is(.dark *) {
  border-color: hsl(var(--destructive));
}
.dark\:border-destructive\/40:is(.dark *) {
  border-color: hsl(var(--destructive) / 0.4);
}
.dark\:border-severity-critical:is(.dark *) {
  border-color: hsl(var(--severity-critical));
}
.dark\:border-severity-high:is(.dark *) {
  border-color: hsl(var(--severity-high));
}
.dark\:border-severity-low:is(.dark *) {
  border-color: hsl(var(--severity-low));
}
.dark\:border-severity-medium:is(.dark *) {
  border-color: hsl(var(--severity-medium));
}
.dark\:border-success:is(.dark *) {
  border-color: hsl(var(--success));
}
.dark\:border-teal-800\/40:is(.dark *) {
  border-color: rgb(17 94 89 / 0.4);
}
.dark\:border-warning:is(.dark *) {
  border-color: hsl(var(--warning));
}
.dark\:border-warning\/40:is(.dark *) {
  border-color: hsl(var(--warning) / 0.4);
}
.dark\:bg-destructive\/10:is(.dark *) {
  background-color: hsl(var(--destructive) / 0.1);
}
.dark\:bg-destructive\/20:is(.dark *) {
  background-color: hsl(var(--destructive) / 0.2);
}
.dark\:bg-destructive\/30:is(.dark *) {
  background-color: hsl(var(--destructive) / 0.3);
}
.dark\:bg-destructive\/40:is(.dark *) {
  background-color: hsl(var(--destructive) / 0.4);
}
.dark\:bg-gray-700\/20:is(.dark *) {
  background-color: rgb(55 65 81 / 0.2);
}
.dark\:bg-gray-900\/20:is(.dark *) {
  background-color: rgb(17 24 39 / 0.2);
}
.dark\:bg-info:is(.dark *) {
  background-color: hsl(var(--info));
}
.dark\:bg-info\/30:is(.dark *) {
  background-color: hsl(var(--info) / 0.3);
}
.dark\:bg-info\/40:is(.dark *) {
  background-color: hsl(var(--info) / 0.4);
}
.dark\:bg-primary:is(.dark *) {
  background-color: hsl(var(--primary));
}
.dark\:bg-primary\/30:is(.dark *) {
  background-color: hsl(var(--primary) / 0.3);
}
.dark\:bg-primary\/40:is(.dark *) {
  background-color: hsl(var(--primary) / 0.4);
}
.dark\:bg-severity-critical:is(.dark *) {
  background-color: hsl(var(--severity-critical));
}
.dark\:bg-severity-critical\/20:is(.dark *) {
  background-color: hsl(var(--severity-critical) / 0.2);
}
.dark\:bg-severity-critical\/30:is(.dark *) {
  background-color: hsl(var(--severity-critical) / 0.3);
}
.dark\:bg-severity-high:is(.dark *) {
  background-color: hsl(var(--severity-high));
}
.dark\:bg-severity-high\/30:is(.dark *) {
  background-color: hsl(var(--severity-high) / 0.3);
}
.dark\:bg-severity-low:is(.dark *) {
  background-color: hsl(var(--severity-low));
}
.dark\:bg-severity-low\/30:is(.dark *) {
  background-color: hsl(var(--severity-low) / 0.3);
}
.dark\:bg-severity-medium:is(.dark *) {
  background-color: hsl(var(--severity-medium));
}
.dark\:bg-severity-medium\/30:is(.dark *) {
  background-color: hsl(var(--severity-medium) / 0.3);
}
.dark\:bg-success:is(.dark *) {
  background-color: hsl(var(--success));
}
.dark\:bg-success\/20:is(.dark *) {
  background-color: hsl(var(--success) / 0.2);
}
.dark\:bg-success\/30:is(.dark *) {
  background-color: hsl(var(--success) / 0.3);
}
.dark\:bg-success\/40:is(.dark *) {
  background-color: hsl(var(--success) / 0.4);
}
.dark\:bg-teal-900\/10:is(.dark *) {
  background-color: rgb(19 78 74 / 0.1);
}
.dark\:bg-warning:is(.dark *) {
  background-color: hsl(var(--warning));
}
.dark\:bg-warning\/10:is(.dark *) {
  background-color: hsl(var(--warning) / 0.1);
}
.dark\:bg-warning\/20:is(.dark *) {
  background-color: hsl(var(--warning) / 0.2);
}
.dark\:bg-warning\/30:is(.dark *) {
  background-color: hsl(var(--warning) / 0.3);
}
.dark\:bg-warning\/40:is(.dark *) {
  background-color: hsl(var(--warning) / 0.4);
}
.dark\:bg-white\/10:is(.dark *) {
  background-color: rgb(255 255 255 / 0.1);
}
.dark\:bg-zinc-950:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: rgb(9 9 11 / var(--tw-bg-opacity, 1));
}
.dark\:text-destructive:is(.dark *) {
  color: hsl(var(--destructive));
}
.dark\:text-info:is(.dark *) {
  color: hsl(var(--info));
}
.dark\:text-muted-foreground:is(.dark *) {
  color: hsl(var(--muted-foreground));
}
.dark\:text-primary:is(.dark *) {
  color: hsl(var(--primary));
}
.dark\:text-severity-critical:is(.dark *) {
  color: hsl(var(--severity-critical));
}
.dark\:text-severity-high:is(.dark *) {
  color: hsl(var(--severity-high));
}
.dark\:text-severity-low:is(.dark *) {
  color: hsl(var(--severity-low));
}
.dark\:text-severity-medium:is(.dark *) {
  color: hsl(var(--severity-medium));
}
.dark\:text-success:is(.dark *) {
  color: hsl(var(--success));
}
.dark\:text-warning:is(.dark *) {
  color: hsl(var(--warning));
}
@media (min-width: 640px) {

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

  .sm\:block {
    display: block;
  }

  .sm\:flex {
    display: flex;
  }

  .sm\:max-w-lg {
    max-width: 32rem;
  }

  .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-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .sm\:flex-row {
    flex-direction: row;
  }

  .sm\:items-start {
    align-items: flex-start;
  }

  .sm\:justify-end {
    justify-content: flex-end;
  }

  .sm\:justify-between {
    justify-content: space-between;
  }

  .sm\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(0.5rem * var(--tw-space-x-reverse));
    margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
  }

  .sm\:rounded-lg {
    border-radius: var(--radius);
  }

  .sm\:p-10 {
    padding: 2.5rem;
  }

  .sm\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .sm\:text-left {
    text-align: left;
  }

  .sm\:text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .sm\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }
}
@media (min-width: 768px) {

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

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

  .md\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (min-width: 1024px) {

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

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

  .lg\:flex {
    display: flex;
  }

  .lg\:inline-flex {
    display: inline-flex;
  }

  .lg\:hidden {
    display: none;
  }

  .lg\:w-14 {
    width: 3.5rem;
  }

  .lg\:w-60 {
    width: 15rem;
  }

  .lg\:w-\[420px\] {
    width: 420px;
  }

  .lg\:w-\[480px\] {
    width: 480px;
  }

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

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

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

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

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

  .lg\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .lg\:text-6xl {
    font-size: 3.75rem;
    line-height: 1;
  }
}
@media (min-width: 1280px) {

  .xl\:w-\[540px\] {
    width: 540px;
  }

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

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

  .xl\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
.\[\&\>span\]\:line-clamp-1>span {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading] {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
  font-size: 0.75rem;
  line-height: 1rem;
}
.\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading] {
  font-weight: 500;
}
.\[\&_\[cmdk-group-heading\]\]\:font-semibold [cmdk-group-heading] {
  font-weight: 600;
}
.\[\&_\[cmdk-group-heading\]\]\:uppercase [cmdk-group-heading] {
  text-transform: uppercase;
}
.\[\&_\[cmdk-group-heading\]\]\:tracking-wider [cmdk-group-heading] {
  letter-spacing: 0.05em;
}
.\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading] {
  color: hsl(var(--muted-foreground));
}
.\[\&_\[cmdk-group\]\:not\(\[hidden\]\)_\~\[cmdk-group\]\]\:pt-0 [cmdk-group]:not([hidden]) ~[cmdk-group] {
  padding-top: 0px;
}
.\[\&_\[cmdk-group\]\]\:px-2 [cmdk-group] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg {
  height: 1.25rem;
}
.\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg {
  width: 1.25rem;
}
.\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input] {
  height: 3rem;
}
.\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item] {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item] {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg {
  height: 1.25rem;
}
.\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg {
  width: 1.25rem;
}