/* Senditt Direction A (Ember) token layer.
   Source of truth: senditt-data brand/direction-a-ember/brand.json v1.0 (ruled 2026-09-28).
   brand.json wins on any conflict; this file is regenerated from it, never the reverse.
   Ported from the site lab (senditt-site-lab, branch ember, a412a04) by lane
   senditt-marketing-port-ember. Fonts are self-hosted from public/fonts (SIL OFL); there is
   no Google Fonts request at runtime. */

/* ------------------------------------------------------------------ fonts */
@font-face {
  font-family: 'Sora';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/Sora-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'Sora';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/Sora-Bold.woff2') format('woff2');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/DMSans-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/DMSans-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/DMSans-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/JetBrainsMono-Medium.woff2') format('woff2');
}

*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/* ! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com */

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

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

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

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

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: var(--font-sans); /* 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: var(--font-mono); /* 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 {
    /* shadcn semantic tokens, remapped onto the Direction A palette so any shadcn
       primitive picks up bone / ink / ember instead of the retired cream set. */
    --background: 43 28% 95%;         /* #F6F4EF bone canvas */
    --foreground: 222 14% 27%;        /* #3C4250 slate body text */
    --card: 0 0% 100%;                /* #FFFFFF cards */
    --card-foreground: 225 18% 9%;    /* #12141A ink */
    --popover: 0 0% 100%;
    --popover-foreground: 225 18% 9%;
    --primary: 14 82% 43%;            /* #C63D14 ember ink: orange text, links, primary button on light */
    --primary-foreground: 0 0% 100%;
    /* Kept as aliases so any residual usage resolves to the Ember values: brand.json
       says #C63D14 supersedes #ba3d17 for orange text and the solid CTA fill. */
    --brand-orange-text: 14 82% 43%;       /* #C63D14 */
    --brand-orange-text-hover: 14 78% 35%; /* #9F3414 */
    --brand-orange-cta: 14 82% 43%;        /* #C63D14 */
    --brand-orange-cta-hover: 14 78% 35%;  /* #9F3414 */
    --secondary: 23 100% 95%;         /* #FFF1E8 peach */
    --secondary-foreground: 225 18% 9%;
    --muted: 42 25% 92%;              /* #F0EDE6 hairline soft */
    --muted-foreground: 223 10% 40%;  /* #5B6170 muted */
    --accent: 23 100% 95%;            /* #FFF1E8 peach */
    --accent-foreground: 225 18% 9%;
    --destructive: 14 82% 43%;
    --destructive-foreground: 0 0% 100%;
    --border: 39 23% 88%;             /* #E7E2D9 hairline */
    --input: 39 23% 88%;
    --ring: 14 82% 43%;

    /* Surface tiers kept as names for any residual usage; values are the Ember set. */
    --surface: 0 0% 100%;             /* #FFFFFF */
    --surface-2: 43 28% 95%;          /* #F6F4EF */
    --surface-3: 23 100% 95%;         /* #FFF1E8 */
    --border-2: 39 23% 88%;           /* #E7E2D9 */
    --hairline: 39 23% 88%;           /* #E7E2D9 */
    --text-faint: 223 10% 40%;        /* #5B6170 */

    /* Chart order from brand.json: ember, track, delivered, slate */
    --chart-1: 13 77% 50%;
    --chart-2: 226 79% 49%;
    --chart-3: 175 77% 26%;
    --chart-4: 222 14% 27%;
    --chart-5: 223 10% 40%;

    --sidebar: 0 0% 100%;
    --sidebar-foreground: 225 18% 9%;
    --sidebar-primary: 14 82% 43%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: 23 100% 95%;
    --sidebar-accent-foreground: 225 18% 9%;
    --sidebar-border: 39 23% 88%;
    --sidebar-ring: 14 82% 43%;

    /* Type: Sora display, DM Sans body, JetBrains Mono for references (brand.json type). */
    --font-sans: 'DM Sans', ui-sans-serif, system-ui, -apple-system, sans-serif;
    --font-heading: 'Sora', ui-sans-serif, system-ui, -apple-system, sans-serif;
    --font-serif: ui-serif, Georgia, 'Times New Roman', serif;
    --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

    /* Shape (brand.json shape.radius) */
    --radius: 0.75rem;
    --radius-capsule: 999px;
    --radius-card: 20px;
    --radius-input: 12px;
    --radius-icon-tile: 12px;
    --radius-section-panel: 28px;
    --radius-portal-frame: 14px;
    --radius-chip: 9px;
    --radius-xs: 0.125rem;
    --radius-sm: calc(var(--radius) * 0.6);
    --radius-md: calc(var(--radius) * 0.8);
    --radius-lg: var(--radius);
    --radius-xl: calc(var(--radius) * 1.4);
    --radius-2xl: calc(var(--radius) * 1.8);
    --radius-3xl: calc(var(--radius) * 2.2);
    --radius-4xl: calc(var(--radius) * 2.6);

    /* Shadow (brand.json shape.shadow): nav and the portal frame on ink; none elsewhere. */
    --shadow-nav: 0 4px 16px rgba(18, 20, 26, 0.06);
    --shadow-portal-ink: 0 24px 60px rgba(0, 0, 0, 0.45);

    /* Motion (brand.json motion) */
    --ease-reveal: cubic-bezier(0.2, 0.7, 0.2, 1);
    --ease-brand: cubic-bezier(0.2, 0.7, 0.2, 1);
    --ease-settle: cubic-bezier(0.2, 0.7, 0.2, 1);
  }

* {
  border-color: hsl(var(--border));
}

html {
    scroll-behavior: smooth;
  }

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
    font-family: var(--font-sans);
    font-size: 17px;
    line-height: 1.6;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    /* the carrier marquee track is wider than the viewport by design; never a horizontal page scroll */
    overflow-x: clip;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    color: #12141a;
    letter-spacing: -0.03em;
    line-height: 1.1;
  }

h1 {
    letter-spacing: -0.035em;
    line-height: 1.04;
  }

h3, h4, h5, h6 {
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.2;
  }

p {
    line-height: 1.6;
  }

/* Minimum on-screen size is caption_14 (brand.json type.scale). */

.text-xs {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
  }

.text-sm {
    font-size: 0.9375rem !important;
    line-height: 1.55 !important;
  }

.text-base {
    font-size: 1.0625rem !important;
    line-height: 1.6 !important;
  }
.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 2rem;
  padding-left: 2rem;
}
@media (min-width: 1400px) {
  .container {
    max-width: 1400px;
  }
}
/* Section shell: the 88 / 64 / 48 rhythm and the 1150px container. */
.sd-section { padding-block: 48px; }
@media (min-width: 768px) { .sd-section { padding-block: 64px; } }
@media (min-width: 1200px) { .sd-section { padding-block: 88px; } }
.sd-container { width: 100%; max-width: 1150px; margin-inline: auto; padding-inline: 16px; }
@media (min-width: 768px) { .sd-container { padding-inline: 24px; } }
/* Type scale from brand.json type.scale */
.sd-display { font-family: var(--font-heading); font-weight: 700; font-size: 40px; letter-spacing: -0.035em; line-height: 1.04; }
@media (min-width: 768px) { .sd-display { font-size: 48px; } }
@media (min-width: 1200px) { .sd-display { font-size: 56px; } }
.sd-heading { font-family: var(--font-heading); font-weight: 700; font-size: 28px; letter-spacing: -0.03em; line-height: 1.1; }
@media (min-width: 768px) { .sd-heading { font-size: 32px; } }
@media (min-width: 1200px) { .sd-heading { font-size: 36px; } }
.sd-card-title { font-family: var(--font-heading); font-weight: 600; font-size: 22px; letter-spacing: -0.02em; line-height: 1.2; }
.sd-kicker { font-family: var(--font-heading); font-weight: 600; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; line-height: 1.4; }
.sd-body { font-size: 17px; line-height: 1.6; }
.sd-caption { font-size: 14px; font-weight: 500; line-height: 1.5; }
.sd-mono { font-family: var(--font-mono); font-weight: 500; font-size: 15px; }
/* Long-form article body: DM Sans 17 at measure 68ch on bone, Sora headings, mono figures. */
.sd-prose { max-width: 68ch; font-size: 17px; line-height: 1.6; color: #3c4250; }
.sd-prose p { margin-bottom: 1.25rem; }
.sd-prose h2 { margin-top: 2.5rem; margin-bottom: 1rem; font-size: 28px; }
.sd-prose h3 { margin-top: 2rem; margin-bottom: 0.75rem; font-size: 22px; }
.sd-prose ul, .sd-prose ol { margin-bottom: 1.25rem; padding-left: 1.5rem; }
.sd-prose ul { list-style: disc; }
.sd-prose ol { list-style: decimal; }
.sd-prose li { margin-bottom: 0.5rem; }
.sd-prose li::marker { color: #c63d14; }
.sd-prose a { color: #c63d14; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.sd-prose a:hover { color: #9f3414; }
.sd-prose strong { color: #12141a; font-weight: 600; }
.sd-prose code, .sd-prose .sd-figure { font-family: var(--font-mono); font-weight: 500; font-size: 0.94em; }
.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;
}
.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;
}
.-bottom-12 {
  bottom: -3rem;
}
.-bottom-56 {
  bottom: -14rem;
}
.-left-12 {
  left: -3rem;
}
.-right-1 {
  right: -0.25rem;
}
.-right-12 {
  right: -3rem;
}
.-right-40 {
  right: -10rem;
}
.-top-1 {
  top: -0.25rem;
}
.-top-12 {
  top: -3rem;
}
.bottom-0 {
  bottom: 0px;
}
.bottom-4 {
  bottom: 1rem;
}
.bottom-\[6\%\] {
  bottom: 6%;
}
.left-0 {
  left: 0px;
}
.left-1\/2 {
  left: 50%;
}
.left-2 {
  left: 0.5rem;
}
.left-2\.5 {
  left: 0.625rem;
}
.left-\[44px\] {
  left: 44px;
}
.left-\[50\%\] {
  left: 50%;
}
.right-0 {
  right: 0px;
}
.right-4 {
  right: 1rem;
}
.right-\[44px\] {
  right: 44px;
}
.right-\[6\%\] {
  right: 6%;
}
.top-0 {
  top: 0px;
}
.top-1\/2 {
  top: 50%;
}
.top-2\.5 {
  top: 0.625rem;
}
.top-4 {
  top: 1rem;
}
.top-\[1px\] {
  top: 1px;
}
.top-\[50\%\] {
  top: 50%;
}
.top-\[52px\] {
  top: 52px;
}
.top-\[60\%\] {
  top: 60%;
}
.top-\[72px\] {
  top: 72px;
}
.top-\[calc\(100\%\+10px\)\] {
  top: calc(100% + 10px);
}
.top-full {
  top: 100%;
}
.z-10 {
  z-index: 10;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.z-\[-1\] {
  z-index: -1;
}
.z-\[1\] {
  z-index: 1;
}
.z-\[2\] {
  z-index: 2;
}
.z-\[60\] {
  z-index: 60;
}
.z-\[9\] {
  z-index: 9;
}
.order-1 {
  order: 1;
}
.order-2 {
  order: 2;
}
.m-0 {
  margin: 0px;
}
.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}
.mx-3 {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.my-10 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}
.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.-ml-4 {
  margin-left: -1rem;
}
.-mt-4 {
  margin-top: -1rem;
}
.-mt-\[68px\] {
  margin-top: -68px;
}
.mb-0 {
  margin-bottom: 0px;
}
.mb-0\.5 {
  margin-bottom: 0.125rem;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-1\.5 {
  margin-bottom: 0.375rem;
}
.mb-10 {
  margin-bottom: 2.5rem;
}
.mb-12 {
  margin-bottom: 3rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-2\.5 {
  margin-bottom: 0.625rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-5 {
  margin-bottom: 1.25rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-7 {
  margin-bottom: 1.75rem;
}
.mb-8 {
  margin-bottom: 2rem;
}
.ml-1 {
  margin-left: 0.25rem;
}
.ml-8 {
  margin-left: 2rem;
}
.ml-auto {
  margin-left: auto;
}
.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-12 {
  margin-top: 3rem;
}
.mt-14 {
  margin-top: 3.5rem;
}
.mt-16 {
  margin-top: 4rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-24 {
  margin-top: 6rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-5 {
  margin-top: 1.25rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.mt-8 {
  margin-top: 2rem;
}
.mt-auto {
  margin-top: auto;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.grid {
  display: grid;
}
.contents {
  display: contents;
}
.hidden {
  display: none;
}
.aspect-\[16\/10\] {
  aspect-ratio: 16/10;
}
.aspect-square {
  aspect-ratio: 1 / 1;
}
.size-4 {
  width: 1rem;
  height: 1rem;
}
.size-\[--cell-size\] {
  width: var(--cell-size);
  height: var(--cell-size);
}
.\!h-5 {
  height: 1.25rem !important;
}
.h-0 {
  height: 0px;
}
.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-3 {
  height: 0.75rem;
}
.h-3\.5 {
  height: 0.875rem;
}
.h-4 {
  height: 1rem;
}
.h-5 {
  height: 1.25rem;
}
.h-6 {
  height: 1.5rem;
}
.h-7 {
  height: 1.75rem;
}
.h-8 {
  height: 2rem;
}
.h-9 {
  height: 2.25rem;
}
.h-\[--cell-size\] {
  height: var(--cell-size);
}
.h-\[1px\] {
  height: 1px;
}
.h-\[220px\] {
  height: 220px;
}
.h-\[560px\] {
  height: 560px;
}
.h-\[640px\] {
  height: 640px;
}
.h-\[var\(--radix-navigation-menu-viewport-height\)\] {
  height: var(--radix-navigation-menu-viewport-height);
}
.h-\[var\(--radix-select-trigger-height\)\] {
  height: var(--radix-select-trigger-height);
}
.h-auto {
  height: auto;
}
.h-full {
  height: 100%;
}
.h-px {
  height: 1px;
}
.h-screen {
  height: 100vh;
}
.max-h-12 {
  max-height: 3rem;
}
.max-h-16 {
  max-height: 4rem;
}
.max-h-8 {
  max-height: 2rem;
}
.max-h-\[--radix-context-menu-content-available-height\] {
  max-height: var(--radix-context-menu-content-available-height);
}
.max-h-\[--radix-select-content-available-height\] {
  max-height: var(--radix-select-content-available-height);
}
.max-h-\[300px\] {
  max-height: 300px;
}
.max-h-\[calc\(100dvh-140px\)\] {
  max-height: calc(100dvh - 140px);
}
.max-h-\[var\(--radix-dropdown-menu-content-available-height\)\] {
  max-height: var(--radix-dropdown-menu-content-available-height);
}
.min-h-0 {
  min-height: 0px;
}
.min-h-6 {
  min-height: 1.5rem;
}
.min-h-\[132px\] {
  min-height: 132px;
}
.min-h-\[60vh\] {
  min-height: 60vh;
}
.min-h-\[80px\] {
  min-height: 80px;
}
.min-h-screen {
  min-height: 100vh;
}
.w-1\.5 {
  width: 0.375rem;
}
.w-10 {
  width: 2.5rem;
}
.w-11 {
  width: 2.75rem;
}
.w-12 {
  width: 3rem;
}
.w-16 {
  width: 4rem;
}
.w-2 {
  width: 0.5rem;
}
.w-2\.5 {
  width: 0.625rem;
}
.w-3 {
  width: 0.75rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-3\/4 {
  width: 75%;
}
.w-4 {
  width: 1rem;
}
.w-5 {
  width: 1.25rem;
}
.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-\[--cell-size\] {
  width: var(--cell-size);
}
.w-\[100px\] {
  width: 100px;
}
.w-\[120px\] {
  width: 120px;
}
.w-\[1px\] {
  width: 1px;
}
.w-\[22\%\] {
  width: 22%;
}
.w-\[220px\] {
  width: 220px;
}
.w-\[372px\] {
  width: 372px;
}
.w-\[560px\] {
  width: 560px;
}
.w-\[620px\] {
  width: 620px;
}
.w-\[640px\] {
  width: 640px;
}
.w-\[880px\] {
  width: 880px;
}
.w-auto {
  width: auto;
}
.w-fit {
  width: -moz-fit-content;
  width: fit-content;
}
.w-full {
  width: 100%;
}
.w-max {
  width: -moz-max-content;
  width: max-content;
}
.w-px {
  width: 1px;
}
.min-w-0 {
  min-width: 0px;
}
.min-w-10 {
  min-width: 2.5rem;
}
.min-w-11 {
  min-width: 2.75rem;
}
.min-w-9 {
  min-width: 2.25rem;
}
.min-w-\[--cell-size\] {
  min-width: var(--cell-size);
}
.min-w-\[12rem\] {
  min-width: 12rem;
}
.min-w-\[20px\] {
  min-width: 20px;
}
.min-w-\[8rem\] {
  min-width: 8rem;
}
.min-w-\[var\(--radix-select-trigger-width\)\] {
  min-width: var(--radix-select-trigger-width);
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-6xl {
  max-width: 72rem;
}
.max-w-7xl {
  max-width: 80rem;
}
.max-w-\[1150px\] {
  max-width: 1150px;
}
.max-w-\[1200px\] {
  max-width: 1200px;
}
.max-w-\[120px\] {
  max-width: 120px;
}
.max-w-\[140px\] {
  max-width: 140px;
}
.max-w-\[180px\] {
  max-width: 180px;
}
.max-w-\[260px\] {
  max-width: 260px;
}
.max-w-\[290px\] {
  max-width: 290px;
}
.max-w-\[320px\] {
  max-width: 320px;
}
.max-w-\[390px\] {
  max-width: 390px;
}
.max-w-\[440px\] {
  max-width: 440px;
}
.max-w-\[488px\] {
  max-width: 488px;
}
.max-w-\[520px\] {
  max-width: 520px;
}
.max-w-\[554px\] {
  max-width: 554px;
}
.max-w-\[560px\] {
  max-width: 560px;
}
.max-w-\[608px\] {
  max-width: 608px;
}
.max-w-\[613px\] {
  max-width: 613px;
}
.max-w-\[632px\] {
  max-width: 632px;
}
.max-w-\[640px\] {
  max-width: 640px;
}
.max-w-\[680px\] {
  max-width: 680px;
}
.max-w-\[68ch\] {
  max-width: 68ch;
}
.max-w-\[720px\] {
  max-width: 720px;
}
.max-w-\[760px\] {
  max-width: 760px;
}
.max-w-\[800px\] {
  max-width: 800px;
}
.max-w-\[880px\] {
  max-width: 880px;
}
.max-w-\[960px\] {
  max-width: 960px;
}
.max-w-\[calc\(100vw-32px\)\] {
  max-width: calc(100vw - 32px);
}
.max-w-full {
  max-width: 100%;
}
.max-w-lg {
  max-width: 32rem;
}
.max-w-max {
  max-width: -moz-max-content;
  max-width: max-content;
}
.max-w-md {
  max-width: 28rem;
}
.max-w-screen-2xl {
  max-width: 1536px;
}
.max-w-screen-lg {
  max-width: 1024px;
}
.max-w-screen-md {
  max-width: 768px;
}
.max-w-screen-sm {
  max-width: 640px;
}
.max-w-screen-xl {
  max-width: 1280px;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.shrink-0 {
  flex-shrink: 0;
}
.grow {
  flex-grow: 1;
}
.grow-0 {
  flex-grow: 0;
}
.basis-full {
  flex-basis: 100%;
}
.caption-bottom {
  caption-side: bottom;
}
.border-collapse {
  border-collapse: collapse;
}
.origin-\[--radix-context-menu-content-transform-origin\] {
  transform-origin: var(--radix-context-menu-content-transform-origin);
}
.origin-\[--radix-dropdown-menu-content-transform-origin\] {
  transform-origin: var(--radix-dropdown-menu-content-transform-origin);
}
.origin-\[--radix-hover-card-content-transform-origin\] {
  transform-origin: var(--radix-hover-card-content-transform-origin);
}
.origin-\[--radix-menubar-content-transform-origin\] {
  transform-origin: var(--radix-menubar-content-transform-origin);
}
.origin-\[--radix-popover-content-transform-origin\] {
  transform-origin: var(--radix-popover-content-transform-origin);
}
.origin-\[--radix-select-content-transform-origin\] {
  transform-origin: var(--radix-select-content-transform-origin);
}
.origin-\[--radix-tooltip-content-transform-origin\] {
  transform-origin: var(--radix-tooltip-content-transform-origin);
}
.origin-left {
  transform-origin: left;
}
.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-x-full {
  --tw-translate-x: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-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-0 {
  --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));
}
.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-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-45 {
  --tw-rotate: 45deg;
  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));
}
.scale-\[0\.88\] {
  --tw-scale-x: 0.88;
  --tw-scale-y: 0.88;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.animate-\[sd-menu-in_320ms_var\(--ease-brand\)\] {
  animation: sd-menu-in 320ms var(--ease-brand);
}
@keyframes pulse {
  50% {
    opacity: .5;
  }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.cursor-default {
  cursor: default;
}
.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 {
  resize: both;
}
.list-\[lower-roman\] {
  list-style-type: lower-roman;
}
.list-none {
  list-style-type: none;
}
.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-\[auto_1fr\] {
  grid-template-columns: auto 1fr;
}
.grid-rows-\[0fr\] {
  grid-template-rows: 0fr;
}
.grid-rows-\[1fr\] {
  grid-template-rows: 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;
}
.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-10 {
  gap: 2.5rem;
}
.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-5 {
  gap: 1.25rem;
}
.gap-6 {
  gap: 1.5rem;
}
.gap-8 {
  gap: 2rem;
}
.gap-px {
  gap: 1px;
}
.gap-x-2 {
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.gap-x-3 {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.gap-x-4 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.gap-x-5 {
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
}
.gap-x-6 {
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}
.gap-x-8 {
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.gap-y-2 {
  row-gap: 0.5rem;
}
.gap-y-3 {
  row-gap: 0.75rem;
}
.gap-y-4 {
  row-gap: 1rem;
}
.gap-y-6 {
  row-gap: 1.5rem;
}
.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-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-3\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.875rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.875rem * 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-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));
}
.self-start {
  align-self: flex-start;
}
.self-stretch {
  align-self: stretch;
}
.overflow-auto {
  overflow: auto;
}
.overflow-hidden {
  overflow: hidden;
}
.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;
}
.break-words {
  overflow-wrap: break-word;
}
.rounded {
  border-radius: 0.25rem;
}
.rounded-\[6px\] {
  border-radius: 6px;
}
.rounded-\[8px\] {
  border-radius: 8px;
}
.rounded-\[inherit\] {
  border-radius: inherit;
}
.rounded-capsule {
  border-radius: var(--radius-capsule);
}
.rounded-card {
  border-radius: var(--radius-card);
}
.rounded-chip {
  border-radius: var(--radius-chip);
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-icon-tile {
  border-radius: var(--radius-icon-tile);
}
.rounded-input {
  border-radius: var(--radius-input);
}
.rounded-lg {
  border-radius: var(--radius-lg);
}
.rounded-md {
  border-radius: var(--radius-md);
}
.rounded-none {
  border-radius: 0px;
}
.rounded-portal-frame {
  border-radius: var(--radius-portal-frame);
}
.rounded-section-panel {
  border-radius: var(--radius-section-panel);
}
.rounded-sm {
  border-radius: var(--radius-sm);
}
.rounded-l-capsule {
  border-top-left-radius: var(--radius-capsule);
  border-bottom-left-radius: var(--radius-capsule);
}
.rounded-l-md {
  border-top-left-radius: var(--radius-md);
  border-bottom-left-radius: var(--radius-md);
}
.rounded-r-capsule {
  border-top-right-radius: var(--radius-capsule);
  border-bottom-right-radius: var(--radius-capsule);
}
.rounded-r-md {
  border-top-right-radius: var(--radius-md);
  border-bottom-right-radius: var(--radius-md);
}
.rounded-t-\[10px\] {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.rounded-tl-sm {
  border-top-left-radius: var(--radius-sm);
}
.border {
  border-width: 1px;
}
.border-2 {
  border-width: 2px;
}
.border-y {
  border-top-width: 1px;
  border-bottom-width: 1px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-l {
  border-left-width: 1px;
}
.border-l-2 {
  border-left-width: 2px;
}
.border-r {
  border-right-width: 1px;
}
.border-t {
  border-top-width: 1px;
}
.border-t-2 {
  border-top-width: 2px;
}
.border-amber {
  --tw-border-opacity: 1;
  border-color: rgb(255 181 71 / var(--tw-border-opacity, 1));
}
.border-destructive\/50 {
  border-color: hsl(var(--destructive) / 0.5);
}
.border-ember {
  --tw-border-opacity: 1;
  border-color: rgb(226 74 30 / var(--tw-border-opacity, 1));
}
.border-ember-ink {
  --tw-border-opacity: 1;
  border-color: rgb(198 61 20 / var(--tw-border-opacity, 1));
}
.border-ember-ink\/30 {
  border-color: rgb(198 61 20 / 0.3);
}
.border-gray-200 {
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
}
.border-hairline {
  --tw-border-opacity: 1;
  border-color: rgb(231 226 217 / var(--tw-border-opacity, 1));
}
.border-hairline-soft {
  --tw-border-opacity: 1;
  border-color: rgb(240 237 230 / var(--tw-border-opacity, 1));
}
.border-ink {
  --tw-border-opacity: 1;
  border-color: rgb(18 20 26 / var(--tw-border-opacity, 1));
}
.border-input {
  border-color: hsl(var(--input));
}
.border-primary {
  border-color: hsl(var(--primary));
}
.border-transparent {
  border-color: transparent;
}
.border-white\/10 {
  border-color: rgb(255 255 255 / 0.1);
}
.border-white\/15 {
  border-color: rgb(255 255 255 / 0.15);
}
.border-white\/\[0\.28\] {
  border-color: rgb(255 255 255 / 0.28);
}
.border-l-transparent {
  border-left-color: transparent;
}
.border-t-transparent {
  border-top-color: transparent;
}
.bg-accent {
  background-color: hsl(var(--accent));
}
.bg-amber {
  --tw-bg-opacity: 1;
  background-color: rgb(255 181 71 / var(--tw-bg-opacity, 1));
}
.bg-amber\/25 {
  background-color: rgb(255 181 71 / 0.25);
}
.bg-background {
  background-color: hsl(var(--background));
}
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}
.bg-black\/80 {
  background-color: rgb(0 0 0 / 0.8);
}
.bg-bone {
  --tw-bg-opacity: 1;
  background-color: rgb(246 244 239 / var(--tw-bg-opacity, 1));
}
.bg-border {
  background-color: hsl(var(--border));
}
.bg-brand-orange-cta {
  background-color: hsl(var(--brand-orange-cta));
}
.bg-card {
  background-color: hsl(var(--card));
}
.bg-delivered {
  --tw-bg-opacity: 1;
  background-color: rgb(15 118 110 / var(--tw-bg-opacity, 1));
}
.bg-delivered-tint {
  --tw-bg-opacity: 1;
  background-color: rgb(227 243 239 / var(--tw-bg-opacity, 1));
}
.bg-destructive {
  background-color: hsl(var(--destructive));
}
.bg-ember {
  --tw-bg-opacity: 1;
  background-color: rgb(226 74 30 / var(--tw-bg-opacity, 1));
}
.bg-ember-ink {
  --tw-bg-opacity: 1;
  background-color: rgb(198 61 20 / var(--tw-bg-opacity, 1));
}
.bg-ember\/15 {
  background-color: rgb(226 74 30 / 0.15);
}
.bg-ember\/20 {
  background-color: rgb(226 74 30 / 0.2);
}
.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-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
}
.bg-gray-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}
.bg-gray-50\/50 {
  background-color: rgb(249 250 251 / 0.5);
}
.bg-hairline {
  --tw-bg-opacity: 1;
  background-color: rgb(231 226 217 / var(--tw-bg-opacity, 1));
}
.bg-ink {
  --tw-bg-opacity: 1;
  background-color: rgb(18 20 26 / var(--tw-bg-opacity, 1));
}
.bg-manifested-tint {
  --tw-bg-opacity: 1;
  background-color: rgb(238 236 230 / var(--tw-bg-opacity, 1));
}
.bg-muted {
  background-color: hsl(var(--muted));
}
.bg-muted-ink {
  --tw-bg-opacity: 1;
  background-color: rgb(91 97 112 / var(--tw-bg-opacity, 1));
}
.bg-muted\/50 {
  background-color: hsl(var(--muted) / 0.5);
}
.bg-peach {
  --tw-bg-opacity: 1;
  background-color: rgb(255 241 232 / var(--tw-bg-opacity, 1));
}
.bg-popover {
  background-color: hsl(var(--popover));
}
.bg-primary {
  background-color: hsl(var(--primary));
}
.bg-red-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
}
.bg-secondary {
  background-color: hsl(var(--secondary));
}
.bg-track {
  --tw-bg-opacity: 1;
  background-color: rgb(26 79 224 / var(--tw-bg-opacity, 1));
}
.bg-track-tint {
  --tw-bg-opacity: 1;
  background-color: rgb(232 238 255 / var(--tw-bg-opacity, 1));
}
.bg-transparent {
  background-color: transparent;
}
.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\/25 {
  background-color: rgb(255 255 255 / 0.25);
}
.bg-white\/95 {
  background-color: rgb(255 255 255 / 0.95);
}
.bg-white\/\[0\.06\] {
  background-color: rgb(255 255 255 / 0.06);
}
.bg-\[linear-gradient\(135deg\2c \#F6F4EF_0\%\2c \#FFF1E8_100\%\)\] {
  background-image: linear-gradient(135deg,#F6F4EF 0%,#FFF1E8 100%);
}
.bg-gradient-to-b {
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
}
.from-background {
  --tw-gradient-from: hsl(var(--background)) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(var(--background) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.to-muted\/20 {
  --tw-gradient-to: hsl(var(--muted) / 0.2) var(--tw-gradient-to-position);
}
.fill-current {
  fill: currentColor;
}
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}
.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}
.p-0 {
  padding: 0px;
}
.p-1 {
  padding: 0.25rem;
}
.p-10 {
  padding: 2.5rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-7 {
  padding: 1.75rem;
}
.p-8 {
  padding: 2rem;
}
.p-\[1px\] {
  padding: 1px;
}
.\!px-2 {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.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-3\.5 {
  padding-left: 0.875rem;
  padding-right: 0.875rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.px-\[--cell-size\] {
  padding-left: var(--cell-size);
  padding-right: var(--cell-size);
}
.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-14 {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}
.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-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-3\.5 {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}
.py-32 {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
.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-12 {
  padding-bottom: 3rem !important;
}
.pb-0 {
  padding-bottom: 0px;
}
.pb-1 {
  padding-bottom: 0.25rem;
}
.pb-12 {
  padding-bottom: 3rem;
}
.pb-16 {
  padding-bottom: 4rem;
}
.pb-2 {
  padding-bottom: 0.5rem;
}
.pb-3 {
  padding-bottom: 0.75rem;
}
.pb-4 {
  padding-bottom: 1rem;
}
.pb-5 {
  padding-bottom: 1.25rem;
}
.pb-6 {
  padding-bottom: 1.5rem;
}
.pb-8 {
  padding-bottom: 2rem;
}
.pl-1 {
  padding-left: 0.25rem;
}
.pl-2 {
  padding-left: 0.5rem;
}
.pl-2\.5 {
  padding-left: 0.625rem;
}
.pl-3\.5 {
  padding-left: 0.875rem;
}
.pl-4 {
  padding-left: 1rem;
}
.pl-8 {
  padding-left: 2rem;
}
.pr-1 {
  padding-right: 0.25rem;
}
.pr-10 {
  padding-right: 2.5rem;
}
.pr-12 {
  padding-right: 3rem;
}
.pr-2 {
  padding-right: 0.5rem;
}
.pr-2\.5 {
  padding-right: 0.625rem;
}
.pr-3 {
  padding-right: 0.75rem;
}
.pr-8 {
  padding-right: 2rem;
}
.pt-0 {
  padding-top: 0px;
}
.pt-1 {
  padding-top: 0.25rem;
}
.pt-10 {
  padding-top: 2.5rem;
}
.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;
}
.pt-8 {
  padding-top: 2rem;
}
.pt-\[68px\] {
  padding-top: 68px;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.align-middle {
  vertical-align: middle;
}
.font-heading {
  font-family: var(--font-heading);
}
.font-mono {
  font-family: var(--font-mono);
}
.font-sans {
  font-family: var(--font-sans);
}
.\!text-\[11px\] {
  font-size: 11px !important;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-\[0\.8rem\] {
  font-size: 0.8rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-\[12px\] {
  font-size: 12px;
}
.text-\[13px\] {
  font-size: 13px;
}
.text-\[14px\] {
  font-size: 14px;
}
.text-\[15px\] {
  font-size: 15px;
}
.text-\[16px\] {
  font-size: 16px;
}
.text-\[17px\] {
  font-size: 17px;
}
.text-\[18px\] {
  font-size: 18px;
}
.text-\[20px\] {
  font-size: 20px;
}
.text-\[28px\] {
  font-size: 28px;
}
.text-\[36px\] {
  font-size: 36px;
}
.text-\[48px\] {
  font-size: 48px;
}
.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-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;
}
.leading-\[1\.15\] {
  line-height: 1.15;
}
.leading-\[1\.3\] {
  line-height: 1.3;
}
.leading-none {
  line-height: 1;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-snug {
  line-height: 1.375;
}
.leading-tight {
  line-height: 1.25;
}
.tracking-\[-0\.01em\] {
  letter-spacing: -0.01em;
}
.tracking-\[-0\.02em\] {
  letter-spacing: -0.02em;
}
.tracking-\[-0\.035em\] {
  letter-spacing: -0.035em;
}
.tracking-\[-0\.03em\] {
  letter-spacing: -0.03em;
}
.tracking-\[-0\.045em\] {
  letter-spacing: -0.045em;
}
.tracking-\[0\.08em\] {
  letter-spacing: 0.08em;
}
.tracking-\[0\.14em\] {
  letter-spacing: 0.14em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-widest {
  letter-spacing: 0.1em;
}
.text-accent-foreground {
  color: hsl(var(--accent-foreground));
}
.text-amber {
  --tw-text-opacity: 1;
  color: rgb(255 181 71 / var(--tw-text-opacity, 1));
}
.text-blue-600 {
  --tw-text-opacity: 1;
  color: rgb(37 99 235 / var(--tw-text-opacity, 1));
}
.text-brand-orange-text {
  color: hsl(var(--brand-orange-text));
}
.text-card-foreground {
  color: hsl(var(--card-foreground));
}
.text-current {
  color: currentColor;
}
.text-delivered {
  --tw-text-opacity: 1;
  color: rgb(15 118 110 / var(--tw-text-opacity, 1));
}
.text-destructive {
  color: hsl(var(--destructive));
}
.text-destructive-foreground {
  color: hsl(var(--destructive-foreground));
}
.text-ember {
  --tw-text-opacity: 1;
  color: rgb(226 74 30 / var(--tw-text-opacity, 1));
}
.text-ember-deep {
  --tw-text-opacity: 1;
  color: rgb(159 52 20 / var(--tw-text-opacity, 1));
}
.text-ember-ink {
  --tw-text-opacity: 1;
  color: rgb(198 61 20 / var(--tw-text-opacity, 1));
}
.text-foreground {
  color: hsl(var(--foreground));
}
.text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}
.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}
.text-gray-600 {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}
.text-gray-700 {
  --tw-text-opacity: 1;
  color: rgb(55 65 81 / var(--tw-text-opacity, 1));
}
.text-gray-900 {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.text-ink {
  --tw-text-opacity: 1;
  color: rgb(18 20 26 / var(--tw-text-opacity, 1));
}
.text-muted-foreground {
  color: hsl(var(--muted-foreground));
}
.text-muted-ink {
  --tw-text-opacity: 1;
  color: rgb(91 97 112 / var(--tw-text-opacity, 1));
}
.text-popover-foreground {
  color: hsl(var(--popover-foreground));
}
.text-primary-foreground {
  color: hsl(var(--primary-foreground));
}
.text-secondary-foreground {
  color: hsl(var(--secondary-foreground));
}
.text-slate {
  --tw-text-opacity: 1;
  color: rgb(60 66 80 / var(--tw-text-opacity, 1));
}
.text-track {
  --tw-text-opacity: 1;
  color: rgb(26 79 224 / var(--tw-text-opacity, 1));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-white\/50 {
  color: rgb(255 255 255 / 0.5);
}
.text-white\/60 {
  color: rgb(255 255 255 / 0.6);
}
.text-white\/70 {
  color: rgb(255 255 255 / 0.7);
}
.text-white\/75 {
  color: rgb(255 255 255 / 0.75);
}
.text-white\/80 {
  color: rgb(255 255 255 / 0.8);
}
.text-white\/85 {
  color: rgb(255 255 255 / 0.85);
}
.underline {
  text-decoration-line: underline;
}
.line-through {
  text-decoration-line: line-through;
}
.no-underline {
  text-decoration-line: none;
}
.decoration-hairline {
  text-decoration-color: #E7E2D9;
}
.decoration-1 {
  text-decoration-thickness: 1px;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.opacity-0 {
  opacity: 0;
}
.opacity-10 {
  opacity: 0.1;
}
.opacity-100 {
  opacity: 1;
}
.opacity-20 {
  opacity: 0.2;
}
.opacity-50 {
  opacity: 0.5;
}
.opacity-60 {
  opacity: 0.6;
}
.opacity-65 {
  opacity: 0.65;
}
.opacity-70 {
  opacity: 0.7;
}
.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_24px_60px_rgba\(18\2c 20\2c 26\2c 0\.18\)\] {
  --tw-shadow: 0 24px 60px rgba(18,20,26,0.18);
  --tw-shadow-colored: 0 24px 60px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[inset_0_2px_0_0_\#FFB547\] {
  --tw-shadow: inset 0 2px 0 0 #FFB547;
  --tw-shadow-colored: inset 0 2px 0 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-md {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-nav {
  --tw-shadow: var(--shadow-nav);
  --tw-shadow-colored: var(--shadow-nav);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-portal-ink {
  --tw-shadow: var(--shadow-portal-ink);
  --tw-shadow-colored: var(--shadow-portal-ink);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.outline-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-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-ring {
  --tw-ring-color: hsl(var(--ring));
}
.ring-offset-background {
  --tw-ring-offset-color: hsl(var(--background));
}
.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);
}
.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: 150ms;
}
.transition-\[background-color\2c border-color\2c color\] {
  transition-property: background-color,border-color,color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[background-color\2c color\2c border-color\] {
  transition-property: background-color,color,border-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[background-color\2c transform\] {
  transition-property: background-color,transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[background-color\] {
  transition-property: background-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[border-color\2c box-shadow\] {
  transition-property: border-color,box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[grid-template-rows\2c padding\] {
  transition-property: grid-template-rows,padding;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[grid-template-rows\] {
  transition-property: grid-template-rows;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[height\] {
  transition-property: height;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-100 {
  transition-duration: 100ms;
}
.duration-1000 {
  transition-duration: 1000ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.duration-300 {
  transition-duration: 300ms;
}
.ease-brand {
  transition-timing-function: var(--ease-brand);
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 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));
  }
}
.animate-in {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.fade-in-0 {
  --tw-enter-opacity: 0;
}
.fade-in-80 {
  --tw-enter-opacity: 0.8;
}
.zoom-in-95 {
  --tw-enter-scale: .95;
}
.duration-100 {
  animation-duration: 100ms;
}
.duration-1000 {
  animation-duration: 1000ms;
}
.duration-200 {
  animation-duration: 200ms;
}
.duration-300 {
  animation-duration: 300ms;
}
.ease-brand {
  animation-timing-function: var(--ease-brand);
}
.ease-in-out {
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.\!running {
  animation-play-state: running !important;
}
.running {
  animation-play-state: running;
}
.\!paused {
  animation-play-state: paused !important;
}
.paused {
  animation-play-state: paused;
}
.\[--cell-size\:2rem\] {
  --cell-size: 2rem;
}
.\[grid-template-rows\:0fr\] {
  grid-template-rows: 0fr;
}
.\[grid-template-rows\:1fr\] {
  grid-template-rows: 1fr;
}
.\[mask-image\:linear-gradient\(90deg\2c transparent\2c \#000_8\%\2c \#000_92\%\2c transparent\)\] {
  -webkit-mask-image: linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image: linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}

/* ------------------------------------------------------------------ motion */
/* Reveal: 24px rise over 520ms, ease-reveal, staggered 70ms per item, once at 15% in view.
   Gated on html.sd-js, which main.tsx sets before hydration, so a prerendered page with no
   JavaScript is fully visible and nothing is hidden behind an observer that never fires. */
html.sd-js .sd-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 520ms var(--ease-reveal), transform 520ms var(--ease-reveal);
  transition-delay: var(--reveal-delay, 0ms);
}
html.sd-js .sd-reveal[data-in='true'] { opacity: 1; transform: none; }

/* NearImage: without JavaScript its <noscript> copy shows, so the src-less image is hidden. */
html:not(.sd-js) .sd-near { display: none; }
/* Until its file is asked for, a src-less image would print its alt text; keep its box and show nothing. */
img.sd-near:not([src]) { visibility: hidden; }
/* The carrier strip's marquee holds only src-less images without JavaScript; its <noscript> list shows instead. */
html:not(.sd-js) #carriers .sd-marquee { display: none; }

/* Hero frame: perspective tilt of 6deg settling flat over 900ms on load; one parallax layer (0.1x) on scroll. */
@keyframes sd-tilt-settle {
  0% { transform: perspective(1400px) rotateX(6deg) rotateY(-6deg) translateY(12px); opacity: 0; }
  100% { transform: perspective(1400px) rotateX(0) rotateY(0) translateY(0); opacity: 1; }
}
.sd-hero-frame { animation: sd-tilt-settle 900ms var(--ease-settle) both; transform-origin: 50% 60%; }

/* ------------------------------------------------------------------ hero map (HeroMap.tsx)
   Lane senditt-marketing-home-motion. A dark panel on the ink hero, one step lighter than the band so it
   reads as a card. Height: 448px at lg (the 584px column at 1440 gives 13:10), and the same 448px is the
   audiences panel's height (.sd-cloud-panel below), per the ruling. Below lg the panel is 4:3 of its
   width. The SVG still and the canvas share the box; the canvas fades in over the still once its first
   frame is drawn (data-live). The still is what the prerendered HTML, a no-JavaScript visitor and a
   reduced-motion visitor see. */
.sd-map { container-type: inline-size; }
.sd-map-panel {
  position: relative; overflow: hidden; aspect-ratio: 4 / 3; border-radius: var(--radius-card);
  background: radial-gradient(120% 90% at 70% 20%, #232733 0%, #171a21 55%, #12141a 100%);
  border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: var(--shadow-portal-ink);
}
@media (min-width: 1024px) { .sd-map-panel { aspect-ratio: auto; height: var(--sd-panel-h, 448px); } }
.sd-map-still, .sd-map-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.sd-map-still { transition: opacity 600ms var(--ease-brand); }
.sd-map-canvas { opacity: 0; transition: opacity 600ms var(--ease-brand); }
.sd-map-panel[data-live='true'] .sd-map-still { opacity: 0; }
.sd-map-panel[data-live='true'] .sd-map-canvas { opacity: 1; }
.sd-map-dots { fill: none; stroke: rgba(255, 255, 255, 0.3); stroke-width: 4.4; stroke-linecap: round; }
.sd-map-arc { fill: none; stroke-width: 2.2; stroke-linecap: round; opacity: 0.85; }
/* Stat cards: JetBrains Mono, dark glass, an amber dot; they float on .sd-float and stand still under
   reduced motion. The third shows at lg and up. */
.sd-map-cards { position: absolute; inset: 0; pointer-events: none; }
.sd-map-card {
  position: absolute; display: flex; align-items: center; gap: 8px; max-width: 58%;
  padding: 8px 11px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(18, 20, 26, 0.72); backdrop-filter: blur(8px);
  box-shadow: 0 12px 32px -12px rgba(0, 0, 0, 0.6);
  font-family: var(--font-mono); font-weight: 500; font-size: 11px; line-height: 1.35; color: #fff;
}
.sd-map-card-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #ffb547; box-shadow: 0 0 10px 2px rgba(255, 181, 71, 0.45); }
.sd-map-card:nth-child(1) { left: 4%; bottom: 7%; }
.sd-map-card:nth-child(2) { right: 4%; top: 7%; }
.sd-map-card:nth-child(3) { display: none; left: 4%; top: 40%; }
@container (min-width: 480px) {
  .sd-map-card { font-size: 12px; padding: 9px 13px; max-width: 40%; }
  .sd-map-card:nth-child(1) { left: 5%; bottom: 9%; }
  .sd-map-card:nth-child(2) { right: 5%; top: 8%; }
  .sd-map-card:nth-child(3) { left: 5%; top: 40%; }
}
@media (min-width: 1024px) { .sd-map-card:nth-child(3) { display: flex; } }

/* ------------------------------------------------------------------ audiences panel (Audience.tsx)
   Lane senditt-marketing-home-motion. The same dark ground as the hero map panel and the same 448px height
   at lg. The cloud is a relative box; each card sits at (--x, --y) at one of three depths and drifts on
   its own period, only while the cloud is in view (data-inview) and never under reduced motion. Depth is
   size, opacity, blur and stacking order: front sharp and readable, mid smaller, back smaller still,
   dimmed and softly blurred. */
.sd-cloud-panel {
  background: radial-gradient(120% 90% at 70% 20%, #232733 0%, #171a21 55%, #12141a 100%);
  border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: var(--shadow-portal-ink);
}
@media (min-width: 1024px) { .sd-cloud-panel { height: var(--sd-panel-h, 448px); } }
.sd-badges { --b: 44px; }
.sd-badge {
  display: flex; flex: none; align-items: center; justify-content: center; width: var(--b); height: var(--b); min-width: 0; padding: 10px;
  overflow: hidden; border-radius: 50%; background: var(--tile); border: 2px solid #171a21; box-shadow: 0 6px 16px -6px rgba(0, 0, 0, 0.6);
}
.sd-badge + .sd-badge { margin-left: calc(var(--b) / -4); }
.sd-badge img { display: block; width: 100%; height: 100%; max-width: 100%; -o-object-fit: contain; object-fit: contain; }
.sd-cloud { container-type: inline-size; position: relative; height: 360px; overflow: hidden; }
@media (min-width: 640px) { .sd-cloud { height: 420px; } }
@media (min-width: 1024px) { .sd-cloud { height: 100%; } }
.sd-cloud-card {
  position: absolute; left: var(--x); top: var(--y); display: flex; align-items: center; gap: 10px;
  max-width: 62%; padding: 9px 14px 9px 9px; border-radius: var(--radius-card);
  background: #fff; color: #12141a; border: 1px solid #e7e2d9;
  font-size: 14px; font-weight: 600; line-height: 1.3; white-space: nowrap;
  transform: translate(-50%, -50%) scale(var(--s, 1));
  animation: sd-cloud-drift var(--dur, 12s) ease-in-out var(--delay, 0s) infinite;
  animation-play-state: paused;
  will-change: transform;
}
.sd-cloud[data-inview='true'] .sd-cloud-card { animation-play-state: running; }
.sd-cloud-card[data-depth='front'] { --s: 1; z-index: 3; box-shadow: 0 22px 48px -16px rgba(0, 0, 0, 0.7), 0 3px 8px rgba(0, 0, 0, 0.25); }
.sd-cloud-card[data-depth='mid'] { --s: 0.84; z-index: 2; opacity: 0.8; filter: blur(0.4px); box-shadow: 0 14px 30px -12px rgba(0, 0, 0, 0.6); }
.sd-cloud-card[data-depth='back'] { --s: 0.7; z-index: 1; opacity: 0.55; filter: blur(1.1px); box-shadow: 0 8px 20px -10px rgba(0, 0, 0, 0.5); }
@container (max-width: 420px) {
  .sd-cloud-card { font-size: 12px; gap: 8px; padding: 7px 11px 7px 7px; }
  .sd-cloud-card > span:first-child { width: 26px !important; height: 26px !important; }
}
@keyframes sd-cloud-drift {
  0%, 100% { transform: translate(-50%, -50%) scale(var(--s, 1)); }
  33% { transform: translate(calc(-50% + var(--dx, 5px)), calc(-50% - var(--dy, 8px))) scale(var(--s, 1)); }
  66% { transform: translate(calc(-50% - var(--dx, 5px)), calc(-50% + var(--dy, 8px))) scale(var(--s, 1)); }
}

/* ------------------------------------------------------------------ problem panel (ProblemBand.tsx)
   Lane senditt-marketing-home-motion. One rounded panel in Ember ink tones (deep to ink, never the hero's
   near-black) with a faint pattern of consignment-label lines behind. Three regions: the rail of tab tiles,
   the stage (before slides out, after settles in, keyed on data-phase) and the floating portal card.
   Motion only while data-motion is true; reduced motion gets no transition and no float. */
.sd-prob {
  position: relative; display: grid; gap: 20px; overflow: hidden; padding: 20px;
  border-radius: var(--radius-section-panel); color: #fff;
  background: linear-gradient(135deg, #7e2a10 0%, #a93615 55%, #c63d14 100%);
  box-shadow: 0 24px 60px -24px rgba(159, 52, 20, 0.6);
}
@media (min-width: 768px) { .sd-prob { padding: 28px; gap: 24px; grid-template-columns: minmax(0, 1fr) 232px; } }
@media (min-width: 1024px) { .sd-prob { grid-template-columns: 236px minmax(0, 1fr) 236px; min-height: var(--sd-panel-h, 448px); } }
.sd-prob-bg { position: absolute; inset: 0; width: 100%; height: 100%; fill: #fff; opacity: 0.045; pointer-events: none; }
.sd-prob > :not(.sd-prob-bg) { position: relative; }

/* rail */
.sd-prob-rail { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 768px) { .sd-prob-rail { grid-column: 1 / -1; } }
@media (min-width: 1024px) { .sd-prob-rail { grid-column: auto; grid-template-columns: 1fr; grid-auto-rows: 1fr; gap: 10px; } }
.sd-prob-tile {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; overflow: hidden;
  padding: 12px; border-radius: var(--radius-card); border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.08); color: #fff; text-align: left; cursor: pointer;
  transition: background-color 180ms var(--ease-brand), border-color 180ms var(--ease-brand);
}
@media (min-width: 1024px) { .sd-prob-tile { padding: 16px; gap: 12px; } }
.sd-prob-tile:hover { background: rgba(255, 255, 255, 0.13); }
.sd-prob-tile[aria-selected='true'] { background: rgba(255, 255, 255, 0.16); border-color: #ffb547; }
.sd-prob-tile:focus-visible { outline: 2px solid #ffb547; outline-offset: 2px; }
.sd-prob-tile-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sd-prob-tile-title { font-family: var(--font-heading); font-weight: 600; font-size: 15px; line-height: 1.2; }
.sd-prob-tile-body { display: none; font-size: 13px; line-height: 1.4; color: rgba(255, 255, 255, 0.78); }
@media (min-width: 640px) { .sd-prob-tile-body { display: block; } }
@media (min-width: 1024px) { .sd-prob-tile-title { font-size: 17px; } .sd-prob-tile-body { font-size: 14px; } }
.sd-prob-bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: #ffb547; }

/* stage */
.sd-prob-stage { container-type: inline-size; position: relative; min-height: 300px; }
@media (min-width: 768px) { .sd-prob-stage { min-height: 340px; } }
.sd-prob-before, .sd-prob-after { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.sd-prob[data-motion='true'] .sd-prob-before, .sd-prob[data-motion='true'] .sd-prob-after { transition: opacity 520ms var(--ease-brand), transform 520ms var(--ease-brand); }
.sd-prob-stage[data-phase='before'] .sd-prob-before { opacity: 1; transform: none; animation: sd-fade-in 320ms var(--ease-brand) both; }
.sd-prob-stage[data-phase='before'] .sd-prob-after { opacity: 0; transform: translateY(18px); pointer-events: none; }
.sd-prob-stage[data-phase='after'] .sd-prob-before { opacity: 0; transform: translateX(-32px); pointer-events: none; }
.sd-prob-stage[data-phase='after'] .sd-prob-after { opacity: 1; transform: none; transition-delay: 160ms; }
.sd-prob[data-motion='false'] .sd-prob-before { animation: none; }
.sd-prob-state { font-family: var(--font-heading); font-weight: 600; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255, 255, 255, 0.72); }
.sd-prob-state[data-after] { color: #ffb547; }

/* documents on the stage: white cards on the ember ground */
.sd-prob-doc-title { display: block; font-family: var(--font-heading); font-weight: 600; font-size: 14px; line-height: 1.25; color: #12141a; }
.sd-prob-lines { display: flex; flex-direction: column; gap: 6px; margin: 10px 0; }
.sd-prob-lines span { display: block; height: 5px; border-radius: 3px; background: #e7e2d9; }
.sd-prob-price { font-family: var(--font-mono); font-weight: 500; font-size: 13px; color: #12141a; }
.sd-prob-mono { font-family: var(--font-mono); font-weight: 500; }
.sd-prob-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; background: #fff1e8; font-size: 12px; font-weight: 600; color: #9f3414; }
.sd-prob-letter { width: min(100%, 250px); padding: 18px; border-radius: 14px; background: #fff; box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.5); }
.sd-prob-letter-head { display: block; width: 36%; height: 8px; margin-bottom: 12px; border-radius: 4px; background: #cfc8ba; }
.sd-prob-rates { width: min(100%, 470px); }
.sd-prob-rates .sd-prob-doc-title { color: #fff; margin-bottom: 10px; text-align: center; }
.sd-prob-rates ul { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sd-prob-rate { display: flex; flex-direction: column; gap: 6px; padding: 12px; border-radius: 14px; background: #fff; box-shadow: 0 14px 30px -16px rgba(0, 0, 0, 0.5); }
.sd-prob-rate-service { font-family: var(--font-heading); font-weight: 600; font-size: 13px; color: #12141a; }
.sd-prob-rate-tag { align-self: flex-start; display: inline-flex; height: 20px; align-items: center; padding: 0 8px; border-radius: 999px; background: #fff1e8; font-size: 11px; font-weight: 600; color: #9f3414; }
.sd-prob-rate .sd-prob-price { font-size: 15px; }
.sd-prob[data-motion='true'] .sd-prob-stage[data-phase='after'] .sd-prob-rate { animation: sd-settle 520ms var(--ease-brand) both; animation-delay: calc(200ms + var(--i) * 110ms); }
.sd-prob-portals { position: relative; width: min(100%, 300px); height: 200px; }
.sd-prob-portal-tab {
  position: absolute; left: calc(var(--i) * 6%); top: calc(var(--i) * 30px); width: 76%; padding: 10px 12px 6px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border-radius: 12px 12px 6px 6px; background: #fff; color: #12141a;
  font-size: 13px; font-weight: 600; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.5); transform: rotate(calc(var(--i) * -1.2deg));
}
.sd-prob-portal-tab .sd-prob-lines { width: 100%; margin: 4px 0 0; }
.sd-prob-portal-dot { width: 10px; height: 10px; border-radius: 50%; background: #5b6170; }
.sd-prob-portal-tab:nth-child(2) .sd-prob-portal-dot { background: #1a4fe0; }
.sd-prob-portal-tab:nth-child(3) .sd-prob-portal-dot { background: #0f766e; }
.sd-prob-portal-tab:nth-child(4) .sd-prob-portal-dot { background: #c63d14; }
.sd-prob-note { position: absolute; right: 0; bottom: 10px; padding: 10px 12px; border-radius: 4px; background: #ffb547; color: #12141a; font-family: var(--font-heading); font-weight: 600; font-size: 13px; transform: rotate(4deg); box-shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.5); }
.sd-prob-list { width: 100%; max-width: 420px; padding: 14px 16px; border-radius: 14px; background: #fff; box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.5); }
.sd-prob-table { width: 100%; margin-top: 8px; border-collapse: collapse; font-size: 13px; color: #12141a; }
.sd-prob-table th { padding: 6px 4px; text-align: left; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #5b6170; border-bottom: 1px solid #e7e2d9; }
.sd-prob-table td { padding: 7px 4px; border-bottom: 1px solid #f0ede6; }
.sd-prob-table tr:last-child td { border-bottom: 0; }
.sd-prob[data-motion='true'] .sd-prob-stage[data-phase='after'] .sd-prob-table tbody tr { animation: sd-settle 480ms var(--ease-brand) both; animation-delay: calc(200ms + var(--i) * 90ms); }
.sd-prob-fan { position: relative; width: min(100%, 300px); height: 210px; }
.sd-prob-invoice {
  position: absolute; left: 50%; top: 50%; width: 150px; padding: 14px; border-radius: 12px; background: #fff; color: #12141a;
  box-shadow: 0 14px 30px -14px rgba(0, 0, 0, 0.5);
  transform: translate(calc(-50% + var(--i) * 26px - 39px), calc(-50% + var(--i) * 10px - 15px)) rotate(calc(-16deg + var(--i) * 10deg));
}
.sd-prob-invoice:nth-child(2) { width: 140px; }
.sd-prob-invoice:nth-child(4) { width: 160px; }
.sd-prob-invoice:nth-child(2) { background: #f6f4ef; }
.sd-prob-invoice:nth-child(3) { background: #fff8f2; }
.sd-prob-invoice:nth-child(4) { background: #f3f5fb; }
.sd-prob-one-invoice { width: min(100%, 300px); padding: 18px; border-radius: 14px; background: #fff; box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.5); }
.sd-prob-invoice-line { display: flex; justify-content: space-between; padding: 8px 0; font-size: 13px; color: #3c4250; border-bottom: 1px solid #f0ede6; }
.sd-prob-one-invoice ul { margin-top: 8px; }
.sd-prob-invoice-total { display: flex; justify-content: space-between; padding-top: 10px; font-family: var(--font-heading); font-weight: 600; font-size: 14px; color: #12141a; }
.sd-prob-invoice-total .sd-prob-price { font-size: 15px; }
.sd-prob[data-motion='true'] .sd-prob-stage[data-phase='after'] .sd-prob-invoice-line { animation: sd-settle 480ms var(--ease-brand) both; animation-delay: calc(200ms + var(--i) * 90ms); }
@keyframes sd-settle { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: none; } }

/* the portal card */
.sd-prob-portal { align-self: center; width: 100%; max-width: 236px; margin: 0 auto; overflow: hidden; border-radius: var(--radius-portal-frame); background: #fff; color: #12141a; box-shadow: 0 24px 50px -20px rgba(0, 0, 0, 0.55); animation: sd-fade-in 420ms var(--ease-brand) both, sd-prob-float 6s ease-in-out 420ms infinite; }
@keyframes sd-prob-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.sd-prob-portal-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; border-bottom: 1px solid #e7e2d9; background: #f6f4ef; }
.sd-prob-portal-title { font-size: 12px; font-weight: 600; color: #5b6170; }
.sd-prob-screen { display: flex; flex-direction: column; gap: 6px; padding: 12px; }
.sd-prob-field { display: flex; flex-direction: column; gap: 2px; padding: 6px 8px; border-radius: 8px; border: 1px solid #e7e2d9; font-size: 12px; font-weight: 600; }
.sd-prob-field > span { font-size: 10px; font-weight: 500; color: #5b6170; }
.sd-prob-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 2px; font-size: 12px; font-weight: 600; border-bottom: 1px solid #f0ede6; }
.sd-prob-row:last-child { border-bottom: 0; }
.sd-prob-row .sd-prob-price { font-size: 12px; }
.sd-prob-row-end { display: flex; align-items: center; gap: 8px; }
.sd-prob-paid, .sd-prob-due { font-size: 10px; font-weight: 600; padding: 2px 6px; border-radius: 999px; }
.sd-prob-paid { background: #e3f3ef; color: #0f766e; }
.sd-prob-due { background: #fff1e8; color: #c63d14; }
/* No float while the panel is out of view or the visitor asked for reduced motion. */
.sd-prob[data-motion='false'] .sd-prob-portal { animation: none; }

/* ------------------------------------------------------------------ one login bento (OneLoginBento.tsx)
   Two floating portal mockups on the large card; twelve badges on a ring around the Senditt mark on
   the square card, one turn every 40s, each badge counter-turned so it stays upright. */
.sd-bento-mocks { position: relative; flex: 1; min-height: 330px; margin-top: 28px; }
.sd-bento-mock { position: absolute; overflow: hidden; border: 1px solid #e7e2d9; border-radius: var(--radius-portal-frame); background: #fff; box-shadow: 0 18px 40px rgba(18, 20, 26, 0.14); }
.sd-bento-mock-rate { left: 28px; top: 0; width: min(74%, 514px); }
/* The consignment card sits below the first route row, so that row's blurred price stays in view. */
.sd-bento-mock-consignment { right: 20px; top: 128px; width: min(44%, 243px); }
@media (min-width: 768px) {
  .sd-bento-mocks { min-height: 400px; }
  .sd-bento-mock-rate { left: 40px; }
  .sd-bento-mock-consignment { right: 40px; top: 176px; }
}
.sd-orbit { --r: 116px; --seat: 46px; position: relative; flex: 1; min-height: calc(var(--r) * 2 + var(--seat) + 56px); margin-top: 12px; }
.sd-orbit-ring { position: absolute; left: 50%; top: 50%; width: 0; height: 0; animation: sd-orbit 40s linear infinite; }
.sd-orbit-seat { position: absolute; left: calc(var(--seat) / -2); top: calc(var(--seat) / -2); width: var(--seat); height: var(--seat); transform: rotate(var(--a)) translateX(var(--r)) rotate(calc(var(--a) * -1)); }
.sd-orbit-badge { display: flex; width: 100%; height: 100%; padding: 7px; border-radius: 50%; background: #fff; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35); animation: sd-orbit-upright 40s linear infinite; }
.sd-orbit-badge img { display: block; width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; }
.sd-orbit-mark { position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; }
.sd-orbit::before { content: ''; position: absolute; left: 50%; top: 50%; width: calc(var(--r) * 2); height: calc(var(--r) * 2); margin: calc(var(--r) * -1) 0 0 calc(var(--r) * -1); border: 1px dashed rgba(255, 255, 255, 0.18); border-radius: 50%; }
@keyframes sd-orbit { to { transform: rotate(360deg); } }
@keyframes sd-orbit-upright { to { transform: rotate(-360deg); } }
.sd-orbit:hover .sd-orbit-ring, .sd-orbit:hover .sd-orbit-badge { animation-play-state: paused; }

/* Carrier marquee, the homepage trust band. 28.6s per loop, linear: brand.json's 20s slowed by 30%
   (duration x 1.43, operator rulings 2026-09-29 22:06 to 22:19 AEST). It pauses on hover and does not
   run under reduced motion (below). The track holds two copies of the strip. */
@keyframes sd-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.sd-marquee-track { display: flex; width: -moz-max-content; width: max-content; animation: sd-marquee 28.6s linear infinite; }
.sd-marquee:hover .sd-marquee-track { animation-play-state: paused; }

/* Carrier panel (CarrierPanel.tsx; operator review 2026-09-29 21:12 AEST). Each tile is a photo edge to
   edge with its mode in a white pill top left, and its three carriers as white circular badges that sit
   over the photo's bottom edge, a third of each badge below it. Layout follows the panel's own width
   (a container query), because the panel sits in columns of very different widths: a 2x2 grid when
   narrow, four slanted tiles in a row when wide. --badge is 48px or 64px, chosen so a tile's three
   badges always fit inside that tile's bottom edge and never reach the next tile's. */
.sd-carrier-panel { container-type: inline-size; }
.sd-carrier-tiles {
  --badge: 48px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  -moz-column-gap: 8px;
       column-gap: 8px;
  row-gap: calc(var(--badge) / 3 + 10px);
  margin: 0 0 calc(var(--badge) / 3 + 6px);
  padding: 0;
  list-style: none;
}
.sd-carrier-tile { position: relative; min-width: 0; aspect-ratio: 3 / 4; }
.sd-carrier-photo { position: absolute; inset: 0; overflow: hidden; border-radius: 12px; }
.sd-carrier-mode {
  position: absolute; top: 10px; left: 10px; margin: 0; padding: 5px 10px; border-radius: 999px;
  background: #fff; font-family: var(--font-heading); font-weight: 600; font-size: 13px; line-height: 1;
  box-shadow: 0 2px 8px rgba(18, 20, 26, 0.16);
}
.sd-carrier-badges {
  position: absolute; z-index: 2; left: calc(var(--badge) * 0.17); bottom: calc(var(--badge) / -3);
  display: flex; margin: 0; padding: 0; list-style: none;
}
.sd-carrier-badge {
  width: var(--badge); height: var(--badge); flex: none; padding: calc(var(--badge) * 0.14); border-radius: 50%; background: #fff;
  box-shadow: 0 4px 14px rgba(18, 20, 26, 0.22), 0 1px 3px rgba(18, 20, 26, 0.12);
}
/* Staggered: each badge tucks under the one before it by 12% of its width, inside the 14% padding, so
   no logo is covered. */
.sd-carrier-badge + .sd-carrier-badge { margin-left: calc(var(--badge) * -0.12); }
.sd-carrier-badge img { display: block; width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; }
@container (min-width: 448px) {
  .sd-carrier-tiles { --badge: 64px; }
  /* Wider 2x2 cells go landscape (the product tour at 1024 is about 600px wide): 4:3 keeps each composited
     logo in frame; /platform's half-width column keeps its square cells. */
  .sd-carrier-tile { aspect-ratio: 4 / 3; }
  .sd-carrier-tiles[data-grid] .sd-carrier-tile { aspect-ratio: 1 / 1; }
  .sd-carrier-mode { top: 14px; left: 14px; font-size: 14px; }
}
/* Four slanted tiles in a row. The next tile overlaps each diagonal cut by 30px, leaving a 6px gutter;
   the badges start at the tile's left and end before its cut (48px badges up to 860px wide). */
@container (min-width: 614px) {
  .sd-carrier-tiles:not([data-grid]) { --badge: 48px; display: flex; height: 440px; -moz-column-gap: 0; column-gap: 0; }
  .sd-carrier-tiles:not([data-grid]) .sd-carrier-tile { flex: 1 1 0; aspect-ratio: auto; }
  .sd-carrier-tiles:not([data-grid]) .sd-carrier-tile + .sd-carrier-tile { margin-left: -30px; }
  .sd-carrier-tiles:not([data-grid]) .sd-carrier-photo { border-radius: 0; clip-path: var(--clip); }
  .sd-carrier-tiles:not([data-grid]) .sd-carrier-tile:first-child .sd-carrier-photo { border-radius: var(--radius-portal-frame) 0 0 var(--radius-portal-frame); }
  .sd-carrier-tiles:not([data-grid]) .sd-carrier-tile:last-child .sd-carrier-photo { border-radius: 0 var(--radius-portal-frame) var(--radius-portal-frame) 0; }
  .sd-carrier-tiles:not([data-grid]) .sd-carrier-tile + .sd-carrier-tile .sd-carrier-mode { left: 42px; }
}
@container (min-width: 860px) {
  .sd-carrier-tiles:not([data-grid]) { --badge: 64px; }
}

/* How Senditt works (lane senditt-marketing-home-story-2, restored from the live tour): the ink card
   expands from 1150px to full bleed as it scrolls into view, at lg and up. */
@keyframes sd-expand-panel {
  0%   { border-radius: 28px; max-width: 1150px; }
  80%  { border-radius: 28px; }
  100% { border-radius: 0; max-width: 100%; }
}
@supports (animation-timeline: view()) {
  @media (min-width: 1024px) {
    .sd-tour-panel { animation: sd-expand-panel ease-in-out both; animation-timeline: view(); animation-range: entry 65% cover 50%; }
  }
}

/* Audiences panels (lane senditt-marketing-home-story-2): the floating benefit cards drift 6px on a 6s loop. */
@keyframes sd-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.sd-float { animation: sd-float 6s ease-in-out infinite; }

/* Integrations panel (IntegrationsPromo.tsx; lane senditt-marketing-home-structure, operator review
   2026-09-30 10:24 to 10:33 AEST). Nine rounded-square app tiles in a loose scatter at three depths.
   The field is a container, so a tile's size follows the field's width (cqw) and the scatter keeps its
   shape from a phone to a wide screen. Each tile has two layers: the outer one holds its place and
   drifts, the inner one is the coloured tile and lifts under the pointer, so the two transforms never
   fight. The drift runs only while the field is in view (data-inview, set by an IntersectionObserver)
   and never under reduced motion. Depth is size, shadow and stacking order: front 19, mid 15.5 and back
   12.5 percent of the field's width. */
.sd-apps { container-type: inline-size; position: relative; aspect-ratio: 6 / 5; width: 100%; }
.sd-app {
  position: absolute; left: var(--x); top: var(--y); width: var(--size); height: var(--size);
  margin: calc(var(--size) / -2) 0 0 calc(var(--size) / -2);
  animation: sd-app-drift var(--dur, 9s) ease-in-out var(--delay, 0s) infinite;
  animation-play-state: paused;
  will-change: transform;
}
.sd-apps[data-inview='true'] .sd-app { animation-play-state: running; }
.sd-app[data-depth='front'] { --size: 19cqw; z-index: 3; }
.sd-app[data-depth='mid'] { --size: 15.5cqw; z-index: 2; }
.sd-app[data-depth='back'] { --size: 12.5cqw; z-index: 1; }
.sd-app-tile {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
  border-radius: 22%; background: var(--tile); padding: 18%;
  box-shadow: 0 10px 22px -8px rgba(18, 20, 26, 0.28), 0 2px 5px rgba(18, 20, 26, 0.1);
  transition: transform 180ms var(--ease-brand), box-shadow 180ms var(--ease-brand);
}
.sd-app[data-depth='mid'] .sd-app-tile { box-shadow: 0 7px 16px -7px rgba(18, 20, 26, 0.24), 0 1px 4px rgba(18, 20, 26, 0.08); }
.sd-app[data-depth='back'] .sd-app-tile { box-shadow: 0 4px 10px -5px rgba(18, 20, 26, 0.2), 0 1px 3px rgba(18, 20, 26, 0.06); }
.sd-app-tile img { display: block; width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; }
/* A tile that carries a product name instead of a logo (Dynamics 365): DM Sans 600, sized by the tile. */
.sd-app-text { font-family: var(--font-sans); font-weight: 600; font-size: 3.1cqw; line-height: 1.1; letter-spacing: -0.02em; text-align: center; color: #12141a; }
/* A white tile needs an edge on the white panel. */
.sd-app-tile { border: 1px solid rgba(18, 20, 26, 0.06); }
.sd-app:hover { z-index: 4; }
.sd-app:hover .sd-app-tile { transform: translateY(-6px) scale(1.05); box-shadow: 0 18px 30px -10px rgba(18, 20, 26, 0.34), 0 3px 8px rgba(18, 20, 26, 0.12); }
@keyframes sd-app-drift {
  0%, 100% { transform: translate(0, 0); }
  33% { transform: translate(var(--dx, 4px), calc(var(--dy, 6px) * -1)); }
  66% { transform: translate(calc(var(--dx, 4px) * -1), var(--dy, 6px)); }
}

/* Mega-menu open/close and sibling switch, on the brand easing. */
@keyframes sd-menu-in  { 0% { opacity: 0; transform: translateY(6px); } 100% { opacity: 1; transform: none; } }
@keyframes sd-menu-out { 0% { opacity: 1; } 100% { opacity: 0; } }
@keyframes sd-panel-out { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(4%); } }
@keyframes sd-panel-in  { 0% { opacity: 0.01; transform: translateX(4%); } 100% { opacity: 1; transform: translateX(0); } }
@keyframes sd-fade-in { from { opacity: 0; } to { opacity: 1; } }
.sd-fade-in { animation: sd-fade-in 320ms var(--ease-brand) both; }

/* Hover timings (brand.json motion.hover): 180ms. */
a, button { transition-duration: 180ms; transition-timing-function: var(--ease-brand); }

/* ------------------------------------------------------------------ integration detail motion pass
   Lane senditt-integrations-motion-pass (design-ops docs/research/senditt-integrations-motion-reference-2026-10-04.md).
   Scoped to .sd-intmotion, the root of the /integrations/<slug>/ template, so no other route changes. Small,
   quick motion on brand.json's curve: only opacity and transform animate, every hidden state is gated on
   html.sd-js (no JavaScript, nothing hidden), nothing runs at page load above the fold, nothing loops, and no
   non-interactive card moves on hover (it would read as clickable). */

/* How it works: the three steps are a hand-off (orders in, quote and book, labels and tracking back). A chevron in
   the gap after each of the first two steps points along the flow (right in the row, down when stacked). It fades
   in after its step reveals and nudges that way twice, then rests: a one-off sequencing cue, finite and short.
   Decorative, out of flow, no text. Centred in the 20px gap with 2px of clearance at full nudge. */
.sd-intmotion .sd-flow-step { position: relative; }
.sd-intmotion .sd-flow-step:not(:last-child)::after {
  content: ''; position: absolute; pointer-events: none;
  width: 9px; height: 9px; border-top: 2px solid hsl(var(--brand-orange-text)); border-right: 2px solid hsl(var(--brand-orange-text));
  border-radius: 1px; left: 50%; bottom: -14px; margin-left: -5px;
  --flow-x: 0px; --flow-y: 2px; --flow-rot: 135deg;
  transform: translate(0, 0) rotate(var(--flow-rot));
}
@media (min-width: 768px) {
  .sd-intmotion .sd-flow-step:not(:last-child)::after {
    left: auto; bottom: auto; margin-left: 0; right: -14px; top: 48px;
    --flow-x: 2px; --flow-y: 0px; --flow-rot: 45deg;
  }
}
@keyframes sd-flow-nudge {
  0%, 100% { transform: translate(0, 0) rotate(var(--flow-rot)); }
  50% { transform: translate(var(--flow-x), var(--flow-y)) rotate(var(--flow-rot)); }
}
html.sd-js .sd-intmotion .sd-flow-step:not(:last-child)::after {
  opacity: 0; transition: opacity 320ms var(--ease-brand) calc(var(--reveal-delay, 0ms) + 420ms);
}
html.sd-js .sd-intmotion .sd-flow-step[data-in='true']:not(:last-child)::after {
  opacity: 1; animation: sd-flow-nudge 900ms var(--ease-brand) calc(var(--reveal-delay, 0ms) + 760ms) 2;
}

/* Steps and capability rows: each icon tile settles from 86 per cent just after its card lands, so a row reads in
   order (staggered entrance on the Reveal's own data-in and --reveal-delay). */
html.sd-js .sd-intmotion .sd-settle-icon {
  transform: scale(0.86); transition: transform 420ms var(--ease-settle) calc(var(--reveal-delay, 0ms) + 200ms);
}
html.sd-js .sd-intmotion [data-in='true'] .sd-settle-icon { transform: none; }

/* FAQ: native <details>, so it opens without JavaScript. The chevron turns over 320ms (template class), the answer
   fades and drops 4px into place on open, and a closed question's chevron dips 2px toward its answer on pointer
   hover or keyboard focus (summary is the interactive element). */
@keyframes sd-faq-in {
  0% { opacity: 0; transform: translateY(-4px); }
  100% { opacity: 1; transform: none; }
}
.sd-intmotion .sd-faq[open] .sd-faq-a { animation: sd-faq-in 260ms var(--ease-brand) both; }
.sd-intmotion .sd-faq:not([open]) > summary:focus-visible .sd-faq-chev { transform: translateY(2px); }
@media (hover: hover) and (pointer: fine) {
  .sd-intmotion .sd-faq:not([open]) > summary:hover .sd-faq-chev { transform: translateY(2px); }
}

/* Freight review band: the capsule CTA presses down 1px while pressed. */
.sd-intmotion [data-band='freight-review'] [data-cta='quote']:active { transform: translateY(1px); }

@media (prefers-reduced-motion: reduce) {
  html.sd-js .sd-intmotion .sd-flow-step:not(:last-child)::after,
  html.sd-js .sd-intmotion .sd-flow-step[data-in='true']:not(:last-child)::after { opacity: 1; animation: none; transition: none; }
  html.sd-js .sd-intmotion .sd-settle-icon { transform: none; transition: none; }
  .sd-intmotion .sd-faq[open] .sd-faq-a { animation: none; }
  .sd-intmotion .sd-faq:not([open]) > summary:hover .sd-faq-chev,
  .sd-intmotion .sd-faq:not([open]) > summary:focus-visible .sd-faq-chev,
  .sd-intmotion [data-band='freight-review'] [data-cta='quote']:active { transform: none; }
}

/* ------------------------------------------------------------------ /integrations/shopify/ page
   Lane senditt-shopify-page-rebuild (design-ops docs/research/senditt-shopify-page-structure-2026-10-04.md): the
   section architecture of a reference landing page, in Senditt's own grounds, type and motion. Scoped to .sd-shop,
   the page root, so no other route changes. Same motion rules as the v1 pass above: only opacity and transform
   animate, every hidden or offset state is gated on html.sd-js, nothing in the first viewport moves at load, nothing
   loops, nothing auto-plays, and reduced motion turns all of it off. */

/* Bands that open a new act lift over the band above with a rounded top (structure spec, global frame). */
.sd-shop .sd-shop-band { position: relative; z-index: 3; margin-top: -28px; border-radius: var(--radius-section-panel) var(--radius-section-panel) 0 0; }
.sd-shop .sd-shop-band--ink { z-index: 4; }
/* v2 (lane senditt-shopify-page-v2): bands after the ink band stack above it so their rounded tops show. */
.sd-shop .sd-shop-band--z5 { z-index: 5; }
.sd-shop .sd-shop-band--z6 { z-index: 6; }

/* Hero: the consignments screen behind, the illustrative order card in front of its lower left. Below lg the card
   sits under the frame, overlapping it by 40px and aligned right, so it never covers the screen it explains. */
.sd-shop .sd-shop-hero-stage { position: relative; }
.sd-shop .sd-shop-hero-card {
  position: relative; z-index: 2; width: min(260px, 82%); margin: -40px 12px 0 auto;
  box-shadow: 0 24px 50px -20px rgba(0, 0, 0, 0.55);
}
@media (min-width: 1024px) {
  .sd-shop .sd-shop-hero-card { position: absolute; left: -32px; bottom: -28px; margin: 0; width: 264px; }
  .sd-shop .sd-shop-hero figcaption { margin-top: 40px; padding-left: 248px; }
}

/* Journey cards: a fixed 4:3 visual area on top, a portal still cropped from its top edge. */
.sd-shop .sd-shop-visual { aspect-ratio: 4 / 3; overflow: hidden; background: #f6f4ef; border-bottom: 1px solid #e7e2d9; padding: 20px 20px 0; }
.sd-shop .sd-shop-visual:has(> .sd-shop-visual-crop) { padding: 0; }
.sd-shop .sd-shop-visual-frame { display: flex; flex-direction: column; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.sd-shop .sd-shop-visual-frame > div:last-child { flex: 1 1 auto; min-height: 0; }
.sd-shop .sd-shop-visual-crop { height: 100%; overflow: hidden; }
.sd-shop .sd-shop-visual-img { display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: 50% 0; object-position: 50% 0; }
.sd-shop .sd-shop-visual-img--left { -o-object-position: 0 0; object-position: 0 0; }
/* v2 (lane senditt-shopify-page-v2): the journey visuals are code-drawn and must never be clipped. Their height is
   their content with a 220px floor, not a fixed 4:3, and from md the three cards share their two row heights through subgrid, so the
   visuals match and the text rows stay aligned. The outer box still clips the settle transform. */
.sd-shop .sd-shop-visual--fit { aspect-ratio: auto; }
.sd-shop .sd-shop-visual--fit > .sd-shop-visual-crop { display: flex; flex-direction: column; justify-content: center; height: 100%; min-height: 220px; overflow: visible; }
.sd-shop .sd-shop-visual--fit > .sd-shop-visual-crop > .sd-shop-mock { flex: 1 1 auto; }
.sd-shop .sd-shop-visual--fit > .sd-shop-visual-crop > .sd-shop-order { align-self: center; }
@media (min-width: 768px) {
  .sd-shop .sd-shop-journey { grid-template-rows: auto 1fr; row-gap: 0; }
  .sd-shop .sd-shop-journey-step,
  .sd-shop .sd-shop-journey-card { display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: 0; }
}
html.sd-js .sd-shop .sd-shop-band .sd-shop-visual-img--left { transform-origin: 0 0; }

/* Stat cards on ink. */
.sd-shop .sd-shop-stat { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); }

/* FAQ: a round ink toggle at the right of each row. An Ember layer inside it fades in under the pointer, on keyboard
   focus and while the row is open (opacity only). */
.sd-shop .sd-shop-faq-glow { opacity: 0; transition: opacity 180ms var(--ease-brand); }
.sd-shop .sd-shop-faq[open] .sd-shop-faq-glow,
.sd-shop .sd-shop-faq > summary:focus-visible .sd-shop-faq-glow { opacity: 1; }
@media (hover: hover) and (pointer: fine) {
  .sd-shop .sd-shop-faq > summary:hover .sd-shop-faq-glow { opacity: 1; }
}

/* Entrance: each journey visual settles from 104 per cent inside its clipped frame just after its card lands, and
   the order card's arrow nudges twice along the hand-off, then rests. Finite, transform only, below the fold. */
html.sd-js .sd-shop .sd-shop-band .sd-shop-visual-img,
html.sd-js .sd-shop .sd-shop-band .sd-shop-visual .sd-shop-order {
  transform: scale(1.04); transform-origin: 50% 0;
  transition: transform 640ms var(--ease-settle) calc(var(--reveal-delay, 0ms) + 160ms);
}
html.sd-js .sd-shop .sd-shop-band [data-in='true'] .sd-shop-visual-img,
html.sd-js .sd-shop .sd-shop-band [data-in='true'] .sd-shop-visual .sd-shop-order { transform: none; }
@keyframes sd-shop-arrow-nudge {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(3px); }
}
html.sd-js .sd-shop .sd-shop-band [data-in='true'] .sd-shop-order-arrow {
  animation: sd-shop-arrow-nudge 900ms var(--ease-brand) calc(var(--reveal-delay, 0ms) + 700ms) 2;
}

@media (prefers-reduced-motion: reduce) {
  html.sd-js .sd-shop .sd-shop-band .sd-shop-visual-img,
  html.sd-js .sd-shop .sd-shop-band .sd-shop-visual .sd-shop-order { transform: none; transition: none; }
  html.sd-js .sd-shop .sd-shop-band [data-in='true'] .sd-shop-order-arrow { animation: none; }
  .sd-shop .sd-shop-faq-glow { transition: none; }
}

/* reduced motion kills all of it */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html.sd-js .sd-reveal { opacity: 1; transform: none; transition: none; }
  .sd-hero-frame { animation: none; }
  .sd-marquee-track { animation: none; }
  .sd-tour-panel { animation: none; }
  .sd-float { animation: none; }
  .sd-app { animation: none; }
  .sd-cloud-card { animation: none; }
  .sd-prob-before, .sd-prob-after, .sd-prob-portal, .sd-prob-rate, .sd-prob-table tbody tr, .sd-prob-invoice-line { animation: none !important; transition: none !important; }
  .sd-app:hover .sd-app-tile { transform: none; }
  .sd-orbit-ring, .sd-orbit-badge { animation: none; }
  .sd-map-still, .sd-map-canvas { transition: none; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* The floating freight review button sat on top of the cookie banner's Decline button at desktop
   widths. Hide it while the banner is on screen; it returns once the visitor accepts or declines
   (the banner unmounts). A returning visitor's banner is hidden pre-paint by senditt-consent-set,
   so the button is not hidden for them in the moment before hydration removes the shell. */
html:not(.senditt-consent-set):has(#cookie-consent-banner) .sd-book-panel { display: none; }
.file\:text-sm::file-selector-button {
    font-size: 0.9375rem !important;
    line-height: 1.55 !important;
  }
@media (min-width: 768px) {
  .md\:text-sm {
    font-size: 0.9375rem !important;
    line-height: 1.55 !important;
  }
}
.\[\&\>span\]\:text-xs>span {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
  }
.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
  }
.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;
}
.file\:text-foreground::file-selector-button {
  color: hsl(var(--foreground));
}
.placeholder\:text-muted-foreground::-moz-placeholder {
  color: hsl(var(--muted-foreground));
}
.placeholder\:text-muted-foreground::placeholder {
  color: hsl(var(--muted-foreground));
}
.placeholder\:text-muted-ink::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(91 97 112 / var(--tw-text-opacity, 1));
}
.placeholder\:text-muted-ink::placeholder {
  --tw-text-opacity: 1;
  color: rgb(91 97 112 / var(--tw-text-opacity, 1));
}
.after\:absolute::after {
  content: var(--tw-content);
  position: absolute;
}
.after\:inset-0::after {
  content: var(--tw-content);
  inset: 0px;
}
.after\:inset-y-0::after {
  content: var(--tw-content);
  top: 0px;
  bottom: 0px;
}
.after\:left-0::after {
  content: var(--tw-content);
  left: 0px;
}
.after\:left-1\/2::after {
  content: var(--tw-content);
  left: 50%;
}
.after\:w-0\.5::after {
  content: var(--tw-content);
  width: 0.125rem;
}
.after\:w-1::after {
  content: var(--tw-content);
  width: 0.25rem;
}
.after\:-translate-x-1\/2::after {
  content: var(--tw-content);
  --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));
}
.after\:bg-amber::after {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(255 181 71 / var(--tw-bg-opacity, 1));
}
.after\:content-\[\'\'\]::after {
  --tw-content: '';
  content: var(--tw-content);
}
.first\:rounded-l-md:first-child {
  border-top-left-radius: var(--radius-md);
  border-bottom-left-radius: var(--radius-md);
}
.first\:border-l:first-child {
  border-left-width: 1px;
}
.first\:border-t-0:first-child {
  border-top-width: 0px;
}
.last\:rounded-r-md:last-child {
  border-top-right-radius: var(--radius-md);
  border-bottom-right-radius: var(--radius-md);
}
.last\:border-b:last-child {
  border-bottom-width: 1px;
}
.last\:border-b-0:last-child {
  border-bottom-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-ember-deep:hover {
  --tw-border-opacity: 1;
  border-color: rgb(159 52 20 / var(--tw-border-opacity, 1));
}
.hover\:border-ember-ink:hover {
  --tw-border-opacity: 1;
  border-color: rgb(198 61 20 / var(--tw-border-opacity, 1));
}
.hover\:border-white:hover {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.hover\:bg-accent:hover {
  background-color: hsl(var(--accent));
}
.hover\:bg-brand-orange-cta-hover:hover {
  background-color: hsl(var(--brand-orange-cta-hover));
}
.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-ember-deep:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(159 52 20 / var(--tw-bg-opacity, 1));
}
.hover\:bg-ember-ink:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(198 61 20 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}
.hover\:bg-ink:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(18 20 26 / var(--tw-bg-opacity, 1));
}
.hover\:bg-muted:hover {
  background-color: hsl(var(--muted));
}
.hover\:bg-muted\/50:hover {
  background-color: hsl(var(--muted) / 0.5);
}
.hover\:bg-peach:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 241 232 / var(--tw-bg-opacity, 1));
}
.hover\:bg-peach\/60:hover {
  background-color: rgb(255 241 232 / 0.6);
}
.hover\:bg-primary\/80:hover {
  background-color: hsl(var(--primary) / 0.8);
}
.hover\:bg-secondary\/80:hover {
  background-color: hsl(var(--secondary) / 0.8);
}
.hover\:bg-white:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.hover\:bg-white\/\[0\.06\]:hover {
  background-color: rgb(255 255 255 / 0.06);
}
.hover\:text-accent-foreground:hover {
  color: hsl(var(--accent-foreground));
}
.hover\:text-amber:hover {
  --tw-text-opacity: 1;
  color: rgb(255 181 71 / var(--tw-text-opacity, 1));
}
.hover\:text-blue-800:hover {
  --tw-text-opacity: 1;
  color: rgb(30 64 175 / var(--tw-text-opacity, 1));
}
.hover\:text-brand-orange-text-hover:hover {
  color: hsl(var(--brand-orange-text-hover));
}
.hover\:text-ember-deep:hover {
  --tw-text-opacity: 1;
  color: rgb(159 52 20 / var(--tw-text-opacity, 1));
}
.hover\:text-foreground:hover {
  color: hsl(var(--foreground));
}
.hover\:text-gray-900:hover {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}
.hover\:text-ink:hover {
  --tw-text-opacity: 1;
  color: rgb(18 20 26 / var(--tw-text-opacity, 1));
}
.hover\:text-muted-foreground:hover {
  color: hsl(var(--muted-foreground));
}
.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.hover\:opacity-100:hover {
  opacity: 1;
}
.focus\:border-ember-ink:focus {
  --tw-border-opacity: 1;
  border-color: rgb(198 61 20 / var(--tw-border-opacity, 1));
}
.focus\:bg-accent:focus {
  background-color: hsl(var(--accent));
}
.focus\:bg-white:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.focus\:text-accent-foreground:focus {
  color: hsl(var(--accent-foreground));
}
.focus\:shadow-\[0_0_0_3px_rgba\(198\2c 61\2c 20\2c 0\.15\)\]:focus {
  --tw-shadow: 0 0 0 3px rgba(198,61,20,0.15);
  --tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus\:ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-gray-200:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity, 1));
}
.focus\:ring-ring:focus {
  --tw-ring-color: hsl(var(--ring));
}
.focus\:ring-offset-2:focus {
  --tw-ring-offset-width: 2px;
}
.focus-visible\:bg-white\/10:focus-visible {
  background-color: rgb(255 255 255 / 0.1);
}
.focus-visible\:outline-none:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus-visible\:outline:focus-visible {
  outline-style: solid;
}
.focus-visible\:outline-2:focus-visible {
  outline-width: 2px;
}
.focus-visible\:outline-offset-2:focus-visible {
  outline-offset: 2px;
}
.focus-visible\:outline-offset-\[-2px\]:focus-visible {
  outline-offset: -2px;
}
.focus-visible\:outline-current:focus-visible {
  outline-color: currentColor;
}
.focus-visible\:outline-ember-ink:focus-visible {
  outline-color: #C63D14;
}
.focus-visible\:outline-white:focus-visible {
  outline-color: #fff;
}
.focus-visible\:ring-1: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(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.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-ring:focus-visible {
  --tw-ring-color: hsl(var(--ring));
}
.focus-visible\:ring-offset-1:focus-visible {
  --tw-ring-offset-width: 1px;
}
.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));
}
.focus-visible\:after\:rounded-section-panel:focus-visible::after {
  content: var(--tw-content);
  border-radius: var(--radius-section-panel);
}
.focus-visible\:after\:outline:focus-visible::after {
  content: var(--tw-content);
  outline-style: solid;
}
.focus-visible\:after\:outline-2:focus-visible::after {
  content: var(--tw-content);
  outline-width: 2px;
}
.focus-visible\:after\:outline-offset-\[-4px\]:focus-visible::after {
  content: var(--tw-content);
  outline-offset: -4px;
}
.focus-visible\:after\:outline-current:focus-visible::after {
  content: var(--tw-content);
  outline-color: currentColor;
}
.disabled\:pointer-events-none:disabled {
  pointer-events: none;
}
.disabled\:cursor-not-allowed:disabled {
  cursor: not-allowed;
}
.disabled\:opacity-50:disabled {
  opacity: 0.5;
}
.group[open] .group-open\: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));
}
.group:hover .group-hover\:translate-x-0\.5 {
  --tw-translate-x: 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));
}
.group:hover .group-hover\:text-ember-ink {
  --tw-text-opacity: 1;
  color: rgb(198 61 20 / var(--tw-text-opacity, 1));
}
.group.toaster .group-\[\.toaster\]\:border-border {
  border-color: hsl(var(--border));
}
.group.toast .group-\[\.toast\]\:bg-muted {
  background-color: hsl(var(--muted));
}
.group.toast .group-\[\.toast\]\:bg-primary {
  background-color: hsl(var(--primary));
}
.group.toaster .group-\[\.toaster\]\:bg-background {
  background-color: hsl(var(--background));
}
.group.toast .group-\[\.toast\]\:text-muted-foreground {
  color: hsl(var(--muted-foreground));
}
.group.toast .group-\[\.toast\]\:text-primary-foreground {
  color: hsl(var(--primary-foreground));
}
.group.toaster .group-\[\.toaster\]\:text-foreground {
  color: hsl(var(--foreground));
}
.group.toaster .group-\[\.toaster\]\:shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.peer:disabled ~ .peer-disabled\:cursor-not-allowed {
  cursor: not-allowed;
}
.peer:disabled ~ .peer-disabled\:opacity-70 {
  opacity: 0.7;
}
.has-\[\:disabled\]\:opacity-50:has(:disabled) {
  opacity: 0.5;
}
.aria-disabled\:opacity-50[aria-disabled="true"] {
  opacity: 0.5;
}
.aria-selected\:text-muted-foreground[aria-selected="true"] {
  color: hsl(var(--muted-foreground));
}
.data-\[disabled\=true\]\:pointer-events-none[data-disabled="true"] {
  pointer-events: none;
}
.data-\[disabled\]\:pointer-events-none[data-disabled] {
  pointer-events: none;
}
.data-\[panel-group-direction\=vertical\]\:h-px[data-panel-group-direction="vertical"] {
  height: 1px;
}
.data-\[panel-group-direction\=vertical\]\:w-full[data-panel-group-direction="vertical"] {
  width: 100%;
}
.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));
}
@keyframes accordion-up {
  from {
    height: var(--radix-accordion-content-height);
  }
  to {
    height: 0;
  }
}
.data-\[state\=closed\]\:animate-accordion-up[data-state="closed"] {
  animation: accordion-up 0.2s ease-out;
}
@keyframes accordion-down {
  from {
    height: 0;
  }
  to {
    height: var(--radix-accordion-content-height);
  }
}
.data-\[state\=open\]\:animate-accordion-down[data-state="open"] {
  animation: accordion-down 0.2s ease-out;
}
.data-\[panel-group-direction\=vertical\]\:flex-col[data-panel-group-direction="vertical"] {
  flex-direction: column;
}
.data-\[range-end\=true\]\:rounded-md[data-range-end="true"] {
  border-radius: var(--radius-md);
}
.data-\[range-middle\=true\]\:rounded-none[data-range-middle="true"] {
  border-radius: 0px;
}
.data-\[range-start\=true\]\:rounded-md[data-range-start="true"] {
  border-radius: var(--radius-md);
}
.data-\[selected\=true\]\:rounded-none[data-selected="true"] {
  border-radius: 0px;
}
.data-\[range-end\=true\]\:bg-primary[data-range-end="true"] {
  background-color: hsl(var(--primary));
}
.data-\[range-middle\=true\]\:bg-accent[data-range-middle="true"] {
  background-color: hsl(var(--accent));
}
.data-\[range-start\=true\]\:bg-primary[data-range-start="true"] {
  background-color: hsl(var(--primary));
}
.data-\[selected-single\=true\]\:bg-primary[data-selected-single="true"] {
  background-color: hsl(var(--primary));
}
.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\=on\]\:bg-accent[data-state="on"] {
  background-color: hsl(var(--accent));
}
.data-\[state\=open\]\:bg-accent[data-state="open"] {
  background-color: hsl(var(--accent));
}
.data-\[state\=open\]\:bg-accent\/50[data-state="open"] {
  background-color: hsl(var(--accent) / 0.5);
}
.data-\[state\=open\]\:bg-secondary[data-state="open"] {
  background-color: hsl(var(--secondary));
}
.data-\[state\=selected\]\:bg-muted[data-state="selected"] {
  background-color: hsl(var(--muted));
}
.data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
  background-color: hsl(var(--input));
}
.data-\[placeholder\]\:text-muted-foreground[data-placeholder] {
  color: hsl(var(--muted-foreground));
}
.data-\[range-end\=true\]\:text-primary-foreground[data-range-end="true"] {
  color: hsl(var(--primary-foreground));
}
.data-\[range-middle\=true\]\:text-accent-foreground[data-range-middle="true"] {
  color: hsl(var(--accent-foreground));
}
.data-\[range-start\=true\]\:text-primary-foreground[data-range-start="true"] {
  color: hsl(var(--primary-foreground));
}
.data-\[selected-single\=true\]\:text-primary-foreground[data-selected-single="true"] {
  color: hsl(var(--primary-foreground));
}
.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\=checked\]\:text-primary-foreground[data-state="checked"] {
  color: hsl(var(--primary-foreground));
}
.data-\[state\=on\]\:text-accent-foreground[data-state="on"] {
  color: hsl(var(--accent-foreground));
}
.data-\[state\=open\]\:text-accent-foreground[data-state="open"] {
  color: hsl(var(--accent-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: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.data-\[state\=closed\]\:duration-300[data-state="closed"] {
  transition-duration: 300ms;
}
.data-\[state\=open\]\:duration-500[data-state="open"] {
  transition-duration: 500ms;
}
.data-\[motion\^\=from-\]\:animate-in[data-motion^="from-"] {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.data-\[state\=open\]\:animate-in[data-state="open"] {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.data-\[state\=visible\]\:animate-in[data-state="visible"] {
  animation-name: enter;
  animation-duration: 150ms;
  --tw-enter-opacity: initial;
  --tw-enter-scale: initial;
  --tw-enter-rotate: initial;
  --tw-enter-translate-x: initial;
  --tw-enter-translate-y: initial;
}
.data-\[motion\^\=to-\]\:animate-out[data-motion^="to-"] {
  animation-name: exit;
  animation-duration: 150ms;
  --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\]\:animate-out[data-state="closed"] {
  animation-name: exit;
  animation-duration: 150ms;
  --tw-exit-opacity: initial;
  --tw-exit-scale: initial;
  --tw-exit-rotate: initial;
  --tw-exit-translate-x: initial;
  --tw-exit-translate-y: initial;
}
.data-\[state\=hidden\]\:animate-out[data-state="hidden"] {
  animation-name: exit;
  animation-duration: 150ms;
  --tw-exit-opacity: initial;
  --tw-exit-scale: initial;
  --tw-exit-rotate: initial;
  --tw-exit-translate-x: initial;
  --tw-exit-translate-y: initial;
}
.data-\[motion\^\=from-\]\:fade-in[data-motion^="from-"] {
  --tw-enter-opacity: 0;
}
.data-\[motion\^\=to-\]\:fade-out[data-motion^="to-"] {
  --tw-exit-opacity: 0;
}
.data-\[state\=closed\]\:fade-out-0[data-state="closed"] {
  --tw-exit-opacity: 0;
}
.data-\[state\=hidden\]\:fade-out[data-state="hidden"] {
  --tw-exit-opacity: 0;
}
.data-\[state\=open\]\:fade-in-0[data-state="open"] {
  --tw-enter-opacity: 0;
}
.data-\[state\=visible\]\:fade-in[data-state="visible"] {
  --tw-enter-opacity: 0;
}
.data-\[state\=closed\]\:zoom-out-95[data-state="closed"] {
  --tw-exit-scale: .95;
}
.data-\[state\=open\]\:zoom-in-90[data-state="open"] {
  --tw-enter-scale: .9;
}
.data-\[state\=open\]\:zoom-in-95[data-state="open"] {
  --tw-enter-scale: .95;
}
.data-\[motion\=from-end\]\:slide-in-from-right-52[data-motion="from-end"] {
  --tw-enter-translate-x: 13rem;
}
.data-\[motion\=from-start\]\:slide-in-from-left-52[data-motion="from-start"] {
  --tw-enter-translate-x: -13rem;
}
.data-\[motion\=to-end\]\:slide-out-to-right-52[data-motion="to-end"] {
  --tw-exit-translate-x: 13rem;
}
.data-\[motion\=to-start\]\:slide-out-to-left-52[data-motion="to-start"] {
  --tw-exit-translate-x: -13rem;
}
.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-bottom[data-state="closed"] {
  --tw-exit-translate-y: 100%;
}
.data-\[state\=closed\]\:slide-out-to-left[data-state="closed"] {
  --tw-exit-translate-x: -100%;
}
.data-\[state\=closed\]\:slide-out-to-left-1\/2[data-state="closed"] {
  --tw-exit-translate-x: -50%;
}
.data-\[state\=closed\]\:slide-out-to-right[data-state="closed"] {
  --tw-exit-translate-x: 100%;
}
.data-\[state\=closed\]\:slide-out-to-top[data-state="closed"] {
  --tw-exit-translate-y: -100%;
}
.data-\[state\=closed\]\:slide-out-to-top-\[48\%\][data-state="closed"] {
  --tw-exit-translate-y: -48%;
}
.data-\[state\=open\]\:slide-in-from-bottom[data-state="open"] {
  --tw-enter-translate-y: 100%;
}
.data-\[state\=open\]\:slide-in-from-left[data-state="open"] {
  --tw-enter-translate-x: -100%;
}
.data-\[state\=open\]\:slide-in-from-left-1\/2[data-state="open"] {
  --tw-enter-translate-x: -50%;
}
.data-\[state\=open\]\:slide-in-from-right[data-state="open"] {
  --tw-enter-translate-x: 100%;
}
.data-\[state\=open\]\:slide-in-from-top[data-state="open"] {
  --tw-enter-translate-y: -100%;
}
.data-\[state\=open\]\:slide-in-from-top-\[48\%\][data-state="open"] {
  --tw-enter-translate-y: -48%;
}
.data-\[state\=closed\]\:duration-300[data-state="closed"] {
  animation-duration: 300ms;
}
.data-\[state\=open\]\:duration-500[data-state="open"] {
  animation-duration: 500ms;
}
.data-\[panel-group-direction\=vertical\]\:after\:left-0[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  left: 0px;
}
.data-\[panel-group-direction\=vertical\]\:after\:h-1[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  height: 0.25rem;
}
.data-\[panel-group-direction\=vertical\]\:after\:w-full[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  width: 100%;
}
.data-\[panel-group-direction\=vertical\]\:after\:-translate-y-1\/2[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  --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));
}
.data-\[panel-group-direction\=vertical\]\:after\:translate-x-0[data-panel-group-direction="vertical"]::after {
  content: var(--tw-content);
  --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-\[state\=open\]\:hover\:bg-accent:hover[data-state="open"] {
  background-color: hsl(var(--accent));
}
.data-\[state\=open\]\:focus\:bg-accent:focus[data-state="open"] {
  background-color: hsl(var(--accent));
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:relative {
  position: relative;
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:z-10 {
  z-index: 10;
}
.group[data-state="open"] .group-data-\[state\=open\]\: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));
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:border-ring {
  border-color: hsl(var(--ring));
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:ring-\[3px\] {
  --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);
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:ring-ring\/50 {
  --tw-ring-color: hsl(var(--ring) / 0.5);
}
@media (min-width: 640px) {
  .sm\:mt-0 {
    margin-top: 0px;
  }
  .sm\:inline {
    display: inline;
  }
  .sm\:inline-flex {
    display: inline-flex;
  }
  .sm\:table-cell {
    display: table-cell;
  }
  .sm\:w-auto {
    width: auto;
  }
  .sm\:max-w-sm {
    max-width: 24rem;
  }
  .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\:flex-row {
    flex-direction: row;
  }
  .sm\:flex-wrap {
    flex-wrap: wrap;
  }
  .sm\:items-center {
    align-items: center;
  }
  .sm\:justify-end {
    justify-content: flex-end;
  }
  .sm\:gap-2\.5 {
    gap: 0.625rem;
  }
  .sm\:gap-6 {
    gap: 1.5rem;
  }
  .sm\:gap-x-6 {
    -moz-column-gap: 1.5rem;
         column-gap: 1.5rem;
  }
  .sm\:gap-x-8 {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }
  .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-lg);
  }
  .sm\:border-b-0 {
    border-bottom-width: 0px;
  }
  .sm\:border-r {
    border-right-width: 1px;
  }
  .sm\:p-6 {
    padding: 1.5rem;
  }
  .sm\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  .sm\:text-left {
    text-align: left;
  }
}
@media (min-width: 700px) {
  .min-\[700px\]\:hidden {
    display: none;
  }
  @media (max-width: 1339px) {
    .min-\[700px\]\:max-\[1339px\]\:block {
      display: block;
    }
  }
}
@media (min-width: 768px) {
  .md\:absolute {
    position: absolute;
  }
  .md\:-mt-\[80px\] {
    margin-top: -80px;
  }
  .md\:mb-14 {
    margin-bottom: 3.5rem;
  }
  .md\:mt-20 {
    margin-top: 5rem;
  }
  .md\:block {
    display: block;
  }
  .md\:grid {
    display: grid;
  }
  .md\:hidden {
    display: none;
  }
  .md\:h-12 {
    height: 3rem;
  }
  .md\:max-h-10 {
    max-height: 2.5rem;
  }
  .md\:w-\[var\(--radix-navigation-menu-viewport-width\)\] {
    width: var(--radix-navigation-menu-viewport-width);
  }
  .md\:w-auto {
    width: auto;
  }
  .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-\[280px_minmax\(0\2c 1fr\)\] {
    grid-template-columns: 280px minmax(0,1fr);
  }
  .md\:grid-cols-\[minmax\(0\2c 1\.4fr\)_repeat\(3\2c minmax\(0\2c 1fr\)\)\] {
    grid-template-columns: minmax(0,1.4fr) repeat(3,minmax(0,1fr));
  }
  .md\:flex-row {
    flex-direction: row;
  }
  .md\:items-end {
    align-items: flex-end;
  }
  .md\:items-center {
    align-items: center;
  }
  .md\:justify-between {
    justify-content: space-between;
  }
  .md\:gap-6 {
    gap: 1.5rem;
  }
  .md\:gap-8 {
    gap: 2rem;
  }
  .md\:p-10 {
    padding: 2.5rem;
  }
  .md\:p-7 {
    padding: 1.75rem;
  }
  .md\:p-8 {
    padding: 2rem;
  }
  .md\:px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
  }
  .md\:px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .md\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  .md\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  .md\:py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .md\:py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
  .md\:\!pb-14 {
    padding-bottom: 3.5rem !important;
  }
  .md\:pb-0 {
    padding-bottom: 0px;
  }
  .md\:pb-14 {
    padding-bottom: 3.5rem;
  }
  .md\:pb-16 {
    padding-bottom: 4rem;
  }
  .md\:pb-20 {
    padding-bottom: 5rem;
  }
  .md\:pt-12 {
    padding-top: 3rem;
  }
  .md\:pt-4 {
    padding-top: 1rem;
  }
  .md\:pt-\[80px\] {
    padding-top: 80px;
  }
  .md\:text-\[15px\] {
    font-size: 15px;
  }
  .md\:text-\[20px\] {
    font-size: 20px;
  }
  .md\:text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  @media not all and (min-width: 1024px) {
    .md\:max-lg\:hidden {
      display: none;
    }
  }
}
@media (min-width: 1024px) {
  .lg\:static {
    position: static;
  }
  .lg\:sticky {
    position: sticky;
  }
  .lg\:inset-0 {
    inset: 0px;
  }
  .lg\:top-28 {
    top: 7rem;
  }
  .lg\:order-1 {
    order: 1;
  }
  .lg\:order-2 {
    order: 2;
  }
  .lg\:-mr-\[min\(calc\(max\(0px\2c \(100vw_-_1150px\)\/2\)_\+_8px\)\2c 153px\)\] {
    margin-right: calc(min(calc(max(0px, (100vw - 1150px) / 2) + 8px), 153px) * -1);
  }
  .lg\:ml-auto {
    margin-left: auto;
  }
  .lg\:mr-0 {
    margin-right: 0px;
  }
  .lg\:block {
    display: block;
  }
  .lg\:flex {
    display: flex;
  }
  .lg\:grid {
    display: grid;
  }
  .lg\:hidden {
    display: none;
  }
  .lg\:h-14 {
    height: 3.5rem;
  }
  .lg\:h-16 {
    height: 4rem;
  }
  .lg\:translate-x-0 {
    --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));
  }
  .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-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .lg\:grid-cols-\[minmax\(0\2c 0\.45fr\)_minmax\(0\2c 0\.55fr\)\] {
    grid-template-columns: minmax(0,0.45fr) minmax(0,0.55fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 0\.6fr\)_minmax\(0\2c 1\.4fr\)\] {
    grid-template-columns: minmax(0,0.6fr) minmax(0,1.4fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 0\.9fr\)_minmax\(0\2c 1\.1fr\)\] {
    grid-template-columns: minmax(0,0.9fr) minmax(0,1.1fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 1\.85fr\)_minmax\(0\2c 1fr\)\] {
    grid-template-columns: minmax(0,1.85fr) minmax(0,1fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_minmax\(0\2c 0\.9fr\)\] {
    grid-template-columns: minmax(0,1fr) minmax(0,0.9fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_minmax\(0\2c 1\.2fr\)\] {
    grid-template-columns: minmax(0,1fr) minmax(0,1.2fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 380px\)_minmax\(0\2c 1fr\)\] {
    grid-template-columns: minmax(0,380px) minmax(0,1fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 5fr\)_minmax\(0\2c 7fr\)\] {
    grid-template-columns: minmax(0,5fr) minmax(0,7fr);
  }
  .lg\:grid-cols-\[minmax\(0\2c 7fr\)_minmax\(0\2c 5fr\)\] {
    grid-template-columns: minmax(0,7fr) minmax(0,5fr);
  }
  .lg\:grid-cols-\[repeat\(4\2c auto\)\] {
    grid-template-columns: repeat(4,auto);
  }
  .lg\:justify-between {
    justify-content: space-between;
  }
  .lg\:gap-12 {
    gap: 3rem;
  }
  .lg\:gap-14 {
    gap: 3.5rem;
  }
  .lg\:p-12 {
    padding: 3rem;
  }
  .lg\:p-14 {
    padding: 3.5rem;
  }
  .lg\:p-6 {
    padding: 1.5rem;
  }
  .lg\:px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
  .lg\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  .lg\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  .lg\:pb-20 {
    padding-bottom: 5rem;
  }
  .lg\:pt-14 {
    padding-top: 3.5rem;
  }
  .lg\:pt-2 {
    padding-top: 0.5rem;
  }
  .lg\:text-\[44px\] {
    font-size: 44px;
  }
  .lg\:text-\[48px\] {
    font-size: 48px;
  }
}
@media (min-width: 1040px) {
  .min-\[1040px\]\:block {
    display: block;
  }
  .min-\[1040px\]\:hidden {
    display: none;
  }
}
@media (min-width: 1280px) {
  .xl\:text-\[56px\] {
    font-size: 56px;
  }
}
@media (min-width: 1340px) {
  .min-\[1340px\]\:block {
    display: block;
  }
}
@media (prefers-color-scheme: dark) {
  .dark\:border-destructive {
    border-color: hsl(var(--destructive));
  }
}
@media print {
  .print\:hidden {
    display: none;
  }
}
.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker {
  display: none;
}
.\[\&\:first-child\[data-selected\=true\]_button\]\:rounded-l-md:first-child[data-selected=true] button {
  border-top-left-radius: var(--radius-md);
  border-bottom-left-radius: var(--radius-md);
}
.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
  padding-right: 0px;
}
.\[\&\:last-child\[data-selected\=true\]_button\]\:rounded-r-md:last-child[data-selected=true] button {
  border-top-right-radius: var(--radius-md);
  border-bottom-right-radius: var(--radius-md);
}
.\[\&\>span\]\:line-clamp-1>span {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.\[\&\>span\]\:text-xs>span {
  font-size: 0.75rem;
  line-height: 1rem;
}
.\[\&\>span\]\:opacity-70>span {
  opacity: 0.7;
}
.\[\&\>svg\+div\]\:translate-y-\[-3px\]>svg+div {
  --tw-translate-y: -3px;
  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));
}
.\[\&\>svg\]\:absolute>svg {
  position: absolute;
}
.\[\&\>svg\]\:left-4>svg {
  left: 1rem;
}
.\[\&\>svg\]\:top-4>svg {
  top: 1rem;
}
.\[\&\>svg\]\:size-3\.5>svg {
  width: 0.875rem;
  height: 0.875rem;
}
.\[\&\>svg\]\:h-3\.5>svg {
  height: 0.875rem;
}
.\[\&\>svg\]\:w-3\.5>svg {
  width: 0.875rem;
}
.\[\&\>svg\]\:text-destructive>svg {
  color: hsl(var(--destructive));
}
.\[\&\>svg\]\:text-foreground>svg {
  color: hsl(var(--foreground));
}
.\[\&\>svg\]\:text-muted-foreground>svg {
  color: hsl(var(--muted-foreground));
}
.\[\&\>svg\~\*\]\:pl-7>svg~* {
  padding-left: 1.75rem;
}
.\[\&\>tr\]\:last\:border-b-0:last-child>tr {
  border-bottom-width: 0px;
}
.\[\&\[data-panel-group-direction\=vertical\]\>div\]\:rotate-90[data-panel-group-direction=vertical]>div {
  --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));
}
.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg {
  --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));
}
.\[\&_\[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\]\]\: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;
}
.\[\&_p\]\:leading-relaxed p {
  line-height: 1.625;
}
.\[\&_svg\]\:pointer-events-none svg {
  pointer-events: none;
}
.\[\&_svg\]\:size-4 svg {
  width: 1rem;
  height: 1rem;
}
.\[\&_svg\]\:shrink-0 svg {
  flex-shrink: 0;
}
.\[\&_tr\:last-child\]\:border-0 tr:last-child {
  border-width: 0px;
}
.\[\&_tr\]\:border-b tr {
  border-bottom-width: 1px;
}
[data-slot=card-content] .\[\[data-slot\=card-content\]_\&\]\:bg-transparent {
  background-color: transparent;
}
[data-slot=popover-content] .\[\[data-slot\=popover-content\]_\&\]\:bg-transparent {
  background-color: transparent;
}