*, ::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: General Sans, system-ui, sans-serif; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

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

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

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

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

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

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

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

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

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

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

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

b,
strong {
  font-weight: bolder;
}

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

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

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

small {
  font-size: 80%;
}

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

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

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

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

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

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

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

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

button,
select {
  text-transform: none;
}

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

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

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

:-moz-focusring {
  outline: auto;
}

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

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

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

progress {
  vertical-align: baseline;
}

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

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

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

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

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

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

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

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

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

summary {
  display: list-item;
}

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

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

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

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

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

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

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

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #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 {
    --radius: 0.25rem;

    --font-display: "Bricolage Grotesque";
    --font-body: "General Sans";
    --font-mono: "Geist Mono";
  }

  .dark {
    /* DirtSwap.net — aggressive motocross dark theme */
    /* Pure black so the logo's solid-black background blends seamlessly */
    --background: 0 0 0;
    --foreground: 0.95 0.01 240;
    --card: 0.14 0.01 240;
    --card-foreground: 0.95 0.01 240;
    --popover: 0.12 0.01 240;
    --popover-foreground: 0.95 0.01 240;
    /* Orange primary — DirtSwap accent */
    --primary: 0.65 0.2 40;
    --primary-foreground: 0.1 0.01 240;
    /* Neutral secondary */
    --secondary: 0.2 0.01 240;
    --secondary-foreground: 0.9 0.01 240;
    --muted: 0.2 0.01 240;
    --muted-foreground: 0.6 0.01 240;
    --accent: 0.65 0.2 40;
    --accent-foreground: 0.1 0.01 240;
    --destructive: 0.55 0.22 25;
    --destructive-foreground: 0.95 0.01 240;
    --success: 0.7 0.18 145;
    --success-foreground: 0.1 0.01 240;
    --warning: 0.78 0.16 75;
    --warning-foreground: 0.15 0.02 75;
    --border: 0.22 0.01 240;
    --input: 0.18 0.01 240;
    --ring: 0.65 0.2 40;
    /* Reputation tiers — derived from badgeLevel, motocross-metal palette */
    --rep-bronze: 0.6 0.1 55;
    --rep-bronze-foreground: 0.95 0.01 240;
    --rep-silver: 0.72 0.02 240;
    --rep-silver-foreground: 0.1 0.01 240;
    --rep-gold: 0.78 0.16 85;
    --rep-gold-foreground: 0.15 0.02 85;
    --rep-platinum: 0.85 0.05 220;
    --rep-platinum-foreground: 0.1 0.01 240;
    /* Charts */
    --chart-1: 0.65 0.2 40;
    --chart-2: 0.62 0.18 180;
    --chart-3: 0.58 0.16 120;
    --chart-4: 0.68 0.22 60;
    --chart-5: 0.72 0.2 30;
    /* Sidebar */
    --sidebar: 0.1 0.01 240;
    --sidebar-foreground: 0.95 0.01 240;
    --sidebar-primary: 0.65 0.2 40;
    --sidebar-primary-foreground: 0.1 0.01 240;
    --sidebar-accent: 0.18 0.01 240;
    --sidebar-accent-foreground: 0.95 0.01 240;
    --sidebar-border: 0.22 0.01 240;
    --sidebar-ring: 0.65 0.2 40;
    /* ===== $DSD ECONOMY TOKENS ===== */
    /* $DSD brand — honey-gold, distinct from muted rep-gold (0.78 0.16 85) */
    --dsd: 0.82 0.18 85;
    --dsd-foreground: 0.16 0.04 85;
    --dsd-muted: 0.68 0.12 85;
    /* $DSD warning — deep amber for no-cash-out disclaimer */
    --dsd-warning: 0.72 0.16 65;
    --dsd-warning-foreground: 0.16 0.05 65;
    --dsd-warning-bg: 0.22 0.06 65;
    /* Profile flair — 5 tasteful color options, none overlap orange primary or rep metals */
    --flair-gold: 0.82 0.18 85;
    --flair-mint: 0.78 0.15 165;
    --flair-rose: 0.72 0.17 12;
    --flair-azure: 0.74 0.14 235;
    --flair-violet: 0.7 0.16 305;
    /* Loyalty-tier flair colors — derived from badgeLevel. Each tier maps to
       one colorToken used by resolveActiveFlair. grey=Novice, bronze=Vet,
       copper=Amateur, blue=Pro, purple=Factory Support, gold=Full Factory.
       Reuses --flair-gold for Full Factory so the top tier keeps the honey-gold
       prestige. Distinct from the rep-metal tokens (--rep-bronze/silver/gold/
       platinum) which back the badge chips, not the name flair. */
    --flair-grey: 0.62 0.01 240;
    --flair-bronze: 0.6 0.1 55;
    --flair-copper: 0.68 0.14 45;
    --flair-blue: 0.7 0.14 240;
    --flair-purple: 0.65 0.18 300;
    /* Rainbow flair — founder-exclusive gradient (not a single OKLCH color).
       Token is a marker; the gradient is applied directly in .dsd-flair-rainbow. */
    --flair-rainbow: 0.75 0.2 0;
    /* ===== ADMIN / FOUNDER BADGE TOKENS ===== */
    /* Founder — richer warm gold than --dsd (0.82 0.18 85) and --rep-gold (0.78 0.16 85) */
    --founder: 0.85 0.2 75;
    --founder-foreground: 0.16 0.05 75;
    --founder-muted: 0.7 0.14 75;
    /* Admin — authoritative deep steel-blue, distinct from --flair-azure (0.74 0.14 235) */
    --admin: 0.62 0.16 255;
    --admin-foreground: 0.95 0.02 255;
    --admin-muted: 0.5 0.1 255;
    /* Moderator — emerald green, distinct from admin steel-blue and flair-emerald */
    --moderator: 0.7 0.16 155;
    --moderator-foreground: 0.98 0.02 155;
    --moderator-muted: 0.55 0.12 155;
    /* ===== $DSD HARDCAP PROGRESS TOKENS ===== */
    --hardcap-track: 0.18 0.01 240;
    --hardcap-fill: 0.82 0.18 85;
    --hardcap-fill-highlight: 0.92 0.12 85;

    /* ===== $DSD SUPPLY DONUT TOKENS ===== */
    /* Six distinct saturated hues for the 6-slice allocation donut — not
       shades of the same color. Each slice maps to one allocation bucket of
       the 10B $DSD cap. Hues are spread across the wheel so adjacent slices
       never collide:
         communityRewards      — emerald green (largest, rewards pool)
         communityTreasury     — deep violet (treasury / governance)
         ecosystemDevelopment  — cyan (growth / dev)
         founderTeam           — honey-gold brand hue (founder slice, locked)
         liquidityReserve      — steel blue (reserve / liquidity)
         contributorsAdvisors  — warm rose (people / advisors) */
    --donut-community-rewards: 0.72 0.17 155;
    --donut-community-treasury: 0.62 0.18 295;
    --donut-ecosystem-development: 0.7 0.15 195;
    --donut-founder-team: 0.7 0.19 45;
    --donut-liquidity-reserve: 0.66 0.14 245;
    --donut-contributors-advisors: 0.68 0.17 15;

    /* ===== MEMBER GLOBE TOKENS =====
       Minimalistic dark globe on the landing hero. Sphere is a touch lighter
       than page bg so it reads as a 3D object, not a hole. Continents render
       as faint dotted/line topography in a cool low-chroma blue-grey —
       NOT a realistic Earth texture, NOT a pure wireframe. Nodes glow in the
       DirtSwap motocross palette: orange for standard member countries, red
       for high-density hubs. Node radius scales with member count. */
    --globe-sphere: 0.13 0.008 240;
    --globe-sphere-shadow: 0.04 0.01 240;
    --globe-continent: 0.45 0.025 240;
    --globe-continent-faint: 0.32 0.018 240;
    --globe-atmosphere: 0.55 0.04 240;
    --globe-graticule: 0.28 0.012 240;
    /* Node tiers — orange primary for standard countries, red destructive for hubs.
       Hub threshold and exact radius mapping are component-side; tokens fix the
       colors so the globe matches the rest of the motocross palette. */
    --globe-node: 0.65 0.2 40;
    --globe-node-hub: 0.55 0.22 25;
    --globe-node-glow: 0.65 0.2 40;
    --globe-node-hub-glow: 0.55 0.22 25;
    --globe-node-hover: 0.78 0.22 45;
    --globe-ring: 0.65 0.2 40;
    /* Popover — reuses popover base, adds orange-tinted border for globe context */
    --globe-popover-border: 0.65 0.2 40;
    /* Counter — Fraunces italic figure + muted label, matches $DSD currency feel */
    --globe-counter: 0.85 0.16 40;
    --globe-counter-muted: 0.6 0.01 240;
  }

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

  body {
  background-color: oklch(var(--background));
  color: oklch(var(--foreground));
    font-family: "General Sans", system-ui, sans-serif;
    font-feature-settings: "rlig" 1, "calt" 1;
}

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: "Geist", system-ui, sans-serif;
  }
.\!container {
  width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 2rem !important;
  padding-left: 2rem !important;
}
.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 2rem;
  padding-left: 2rem;
}
@media (min-width: 1400px) {

  .\!container {
    max-width: 1400px !important;
  }

  .container {
    max-width: 1400px;
  }
}
.prose {
  color: var(--tw-prose-body);
  max-width: 65ch;
}
.prose :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.prose :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-lead);
  font-size: 1.25em;
  line-height: 1.6;
  margin-top: 1.2em;
  margin-bottom: 1.2em;
}
.prose :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-links);
  text-decoration: underline;
  font-weight: 500;
}
.prose :where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-bold);
  font-weight: 600;
}
.prose :where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: decimal;
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-left: 1.625em;
}
.prose :where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-alpha;
}
.prose :where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-alpha;
}
.prose :where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-alpha;
}
.prose :where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-alpha;
}
.prose :where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-roman;
}
.prose :where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-roman;
}
.prose :where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-roman;
}
.prose :where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-roman;
}
.prose :where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: decimal;
}
.prose :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: disc;
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-left: 1.625em;
}
.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
  font-weight: 400;
  color: var(--tw-prose-counters);
}
.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
  color: var(--tw-prose-bullets);
}
.prose :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  margin-top: 1.25em;
}
.prose :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-color: var(--tw-prose-hr);
  border-top-width: 1px;
  margin-top: 3em;
  margin-bottom: 3em;
}
.prose :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 500;
  font-style: italic;
  color: var(--tw-prose-quotes);
  border-left-width: 0.25rem;
  border-left-color: var(--tw-prose-quote-borders);
  quotes: "\201C""\201D""\2018""\2019";
  margin-top: 1.6em;
  margin-bottom: 1.6em;
  padding-left: 1em;
}
.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
  content: open-quote;
}
.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
  content: close-quote;
}
.prose :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 800;
  font-size: 2.25em;
  margin-top: 0;
  margin-bottom: 0.8888889em;
  line-height: 1.1111111;
}
.prose :where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 900;
  color: inherit;
}
.prose :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 700;
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 1em;
  line-height: 1.3333333;
}
.prose :where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 800;
  color: inherit;
}
.prose :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  font-size: 1.25em;
  margin-top: 1.6em;
  margin-bottom: 0.6em;
  line-height: 1.6;
}
.prose :where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 700;
  color: inherit;
}
.prose :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
.prose :where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 700;
  color: inherit;
}
.prose :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  display: block;
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 500;
  font-family: inherit;
  color: var(--tw-prose-kbd);
  box-shadow: 0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%), 0 3px 0 rgb(var(--tw-prose-kbd-shadows) / 10%);
  font-size: 0.875em;
  border-radius: 0.3125rem;
  padding-top: 0.1875em;
  padding-right: 0.375em;
  padding-bottom: 0.1875em;
  padding-left: 0.375em;
}
.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-code);
  font-weight: 600;
  font-size: 0.875em;
}
.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
  content: "`";
}
.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
  content: "`";
}
.prose :where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
  font-size: 0.875em;
}
.prose :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
  font-size: 0.9em;
}
.prose :where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-pre-code);
  background-color: var(--tw-prose-pre-bg);
  overflow-x: auto;
  font-weight: 400;
  font-size: 0.875em;
  line-height: 1.7142857;
  margin-top: 1.7142857em;
  margin-bottom: 1.7142857em;
  border-radius: 0.375rem;
  padding-top: 0.8571429em;
  padding-right: 1.1428571em;
  padding-bottom: 0.8571429em;
  padding-left: 1.1428571em;
}
.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  background-color: transparent;
  border-width: 0;
  border-radius: 0;
  padding: 0;
  font-weight: inherit;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
}
.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
  content: none;
}
.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
  content: none;
}
.prose :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  width: 100%;
  table-layout: auto;
  text-align: left;
  margin-top: 2em;
  margin-bottom: 2em;
  font-size: 0.875em;
  line-height: 1.7142857;
}
.prose :where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-bottom-width: 1px;
  border-bottom-color: var(--tw-prose-th-borders);
}
.prose :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  vertical-align: bottom;
  padding-right: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-left: 0.5714286em;
}
.prose :where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-bottom-width: 1px;
  border-bottom-color: var(--tw-prose-td-borders);
}
.prose :where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-bottom-width: 0;
}
.prose :where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  vertical-align: baseline;
}
.prose :where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-top-width: 1px;
  border-top-color: var(--tw-prose-th-borders);
}
.prose :where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  vertical-align: top;
}
.prose :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-captions);
  font-size: 0.875em;
  line-height: 1.4285714;
  margin-top: 0.8571429em;
}
.prose {
  --tw-prose-body: #374151;
  --tw-prose-headings: #111827;
  --tw-prose-lead: #4b5563;
  --tw-prose-links: #111827;
  --tw-prose-bold: #111827;
  --tw-prose-counters: #6b7280;
  --tw-prose-bullets: #d1d5db;
  --tw-prose-hr: #e5e7eb;
  --tw-prose-quotes: #111827;
  --tw-prose-quote-borders: #e5e7eb;
  --tw-prose-captions: #6b7280;
  --tw-prose-kbd: #111827;
  --tw-prose-kbd-shadows: 17 24 39;
  --tw-prose-code: #111827;
  --tw-prose-pre-code: #e5e7eb;
  --tw-prose-pre-bg: #1f2937;
  --tw-prose-th-borders: #d1d5db;
  --tw-prose-td-borders: #e5e7eb;
  --tw-prose-invert-body: #d1d5db;
  --tw-prose-invert-headings: #fff;
  --tw-prose-invert-lead: #9ca3af;
  --tw-prose-invert-links: #fff;
  --tw-prose-invert-bold: #fff;
  --tw-prose-invert-counters: #9ca3af;
  --tw-prose-invert-bullets: #4b5563;
  --tw-prose-invert-hr: #374151;
  --tw-prose-invert-quotes: #f3f4f6;
  --tw-prose-invert-quote-borders: #374151;
  --tw-prose-invert-captions: #9ca3af;
  --tw-prose-invert-kbd: #fff;
  --tw-prose-invert-kbd-shadows: 255 255 255;
  --tw-prose-invert-code: #fff;
  --tw-prose-invert-pre-code: #d1d5db;
  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
  --tw-prose-invert-th-borders: #4b5563;
  --tw-prose-invert-td-borders: #374151;
  font-size: 1rem;
  line-height: 1.75;
}
.prose :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-left: 0.375em;
}
.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-left: 0.375em;
}
.prose :where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.prose :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.5em;
  padding-left: 1.625em;
}
.prose :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-left: 0;
}
.prose :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-right: 0;
}
.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-top: 0.5714286em;
  padding-right: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-left: 0.5714286em;
}
.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-left: 0;
}
.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-right: 0;
}
.prose :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 0;
}
.prose-invert {
  --tw-prose-body: var(--tw-prose-invert-body);
  --tw-prose-headings: var(--tw-prose-invert-headings);
  --tw-prose-lead: var(--tw-prose-invert-lead);
  --tw-prose-links: var(--tw-prose-invert-links);
  --tw-prose-bold: var(--tw-prose-invert-bold);
  --tw-prose-counters: var(--tw-prose-invert-counters);
  --tw-prose-bullets: var(--tw-prose-invert-bullets);
  --tw-prose-hr: var(--tw-prose-invert-hr);
  --tw-prose-quotes: var(--tw-prose-invert-quotes);
  --tw-prose-quote-borders: var(--tw-prose-invert-quote-borders);
  --tw-prose-captions: var(--tw-prose-invert-captions);
  --tw-prose-kbd: var(--tw-prose-invert-kbd);
  --tw-prose-kbd-shadows: var(--tw-prose-invert-kbd-shadows);
  --tw-prose-code: var(--tw-prose-invert-code);
  --tw-prose-pre-code: var(--tw-prose-invert-pre-code);
  --tw-prose-pre-bg: var(--tw-prose-invert-pre-bg);
  --tw-prose-th-borders: var(--tw-prose-invert-th-borders);
  --tw-prose-td-borders: var(--tw-prose-invert-td-borders);
}
.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;
}
.pointer-events-auto {
  pointer-events: auto;
}
.\!visible {
  visibility: visible !important;
}
.visible {
  visibility: visible;
}
.invisible {
  visibility: hidden;
}
.collapse {
  visibility: collapse;
}
.static {
  position: static;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.sticky {
  position: sticky;
}
.inset-0 {
  inset: 0px;
}
.inset-x-0 {
  left: 0px;
  right: 0px;
}
.inset-y-0 {
  top: 0px;
  bottom: 0px;
}
.-bottom-12 {
  bottom: -3rem;
}
.-left-12 {
  left: -3rem;
}
.-left-\[1\.65rem\] {
  left: -1.65rem;
}
.-right-12 {
  right: -3rem;
}
.-right-2 {
  right: -0.5rem;
}
.-top-12 {
  top: -3rem;
}
.-top-2 {
  top: -0.5rem;
}
.bottom-0 {
  bottom: 0px;
}
.bottom-2 {
  bottom: 0.5rem;
}
.left-0 {
  left: 0px;
}
.left-1\/2 {
  left: 50%;
}
.left-2 {
  left: 0.5rem;
}
.left-2\.5 {
  left: 0.625rem;
}
.left-3 {
  left: 0.75rem;
}
.left-4 {
  left: 1rem;
}
.left-\[50\%\] {
  left: 50%;
}
.right-0 {
  right: 0px;
}
.right-1 {
  right: 0.25rem;
}
.right-1\.5 {
  right: 0.375rem;
}
.right-2 {
  right: 0.5rem;
}
.right-3 {
  right: 0.75rem;
}
.right-4 {
  right: 1rem;
}
.top-0 {
  top: 0px;
}
.top-1 {
  top: 0.25rem;
}
.top-1\.5 {
  top: 0.375rem;
}
.top-1\/2 {
  top: 50%;
}
.top-2 {
  top: 0.5rem;
}
.top-3 {
  top: 0.75rem;
}
.top-3\.5 {
  top: 0.875rem;
}
.top-4 {
  top: 1rem;
}
.top-\[1px\] {
  top: 1px;
}
.top-\[50\%\] {
  top: 50%;
}
.top-\[60\%\] {
  top: 60%;
}
.top-full {
  top: 100%;
}
.isolate {
  isolation: isolate;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.z-\[100\] {
  z-index: 100;
}
.z-\[1\] {
  z-index: 1;
}
.z-\[60\] {
  z-index: 60;
}
.col-span-2 {
  grid-column: span 2 / span 2;
}
.col-start-2 {
  grid-column-start: 2;
}
.row-span-2 {
  grid-row: span 2 / span 2;
}
.row-start-1 {
  grid-row-start: 1;
}
.-m-1 {
  margin: -0.25rem;
}
.m-0 {
  margin: 0px;
}
.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}
.-mx-4 {
  margin-left: -1rem;
  margin-right: -1rem;
}
.mx-2 {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
.mx-3\.5 {
  margin-left: 0.875rem;
  margin-right: 0.875rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-0\.5 {
  margin-top: 0.125rem;
  margin-bottom: 0.125rem;
}
.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.my-6 {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
.-ml-4 {
  margin-left: -1rem;
}
.-mr-1 {
  margin-right: -0.25rem;
}
.-mt-1 {
  margin-top: -0.25rem;
}
.-mt-4 {
  margin-top: -1rem;
}
.mb-0\.5 {
  margin-bottom: 0.125rem;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-10 {
  margin-bottom: 2.5rem;
}
.mb-12 {
  margin-bottom: 3rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-5 {
  margin-bottom: 1.25rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-8 {
  margin-bottom: 2rem;
}
.ml-1 {
  margin-left: 0.25rem;
}
.ml-1\.5 {
  margin-left: 0.375rem;
}
.ml-2 {
  margin-left: 0.5rem;
}
.ml-4 {
  margin-left: 1rem;
}
.ml-auto {
  margin-left: auto;
}
.mr-1 {
  margin-right: 0.25rem;
}
.mr-1\.5 {
  margin-right: 0.375rem;
}
.mr-2 {
  margin-right: 0.5rem;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-1\.5 {
  margin-top: 0.375rem;
}
.mt-12 {
  margin-top: 3rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.mt-8 {
  margin-top: 2rem;
}
.mt-auto {
  margin-top: auto;
}
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.table-caption {
  display: table-caption;
}
.table-cell {
  display: table-cell;
}
.table-row {
  display: table-row;
}
.grid {
  display: grid;
}
.contents {
  display: contents;
}
.hidden {
  display: none;
}
.aspect-square {
  aspect-ratio: 1 / 1;
}
.aspect-video {
  aspect-ratio: 16 / 9;
}
.size-11 {
  width: 2.75rem;
  height: 2.75rem;
}
.size-2 {
  width: 0.5rem;
  height: 0.5rem;
}
.size-2\.5 {
  width: 0.625rem;
  height: 0.625rem;
}
.size-3 {
  width: 0.75rem;
  height: 0.75rem;
}
.size-3\.5 {
  width: 0.875rem;
  height: 0.875rem;
}
.size-4 {
  width: 1rem;
  height: 1rem;
}
.size-5 {
  width: 1.25rem;
  height: 1.25rem;
}
.size-7 {
  width: 1.75rem;
  height: 1.75rem;
}
.size-8 {
  width: 2rem;
  height: 2rem;
}
.size-9 {
  width: 2.25rem;
  height: 2.25rem;
}
.size-auto {
  width: auto;
  height: auto;
}
.size-full {
  width: 100%;
  height: 100%;
}
.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-20 {
  height: 5rem;
}
.h-3 {
  height: 0.75rem;
}
.h-3\.5 {
  height: 0.875rem;
}
.h-4 {
  height: 1rem;
}
.h-40 {
  height: 10rem;
}
.h-5 {
  height: 1.25rem;
}
.h-52 {
  height: 13rem;
}
.h-56 {
  height: 14rem;
}
.h-6 {
  height: 1.5rem;
}
.h-7 {
  height: 1.75rem;
}
.h-8 {
  height: 2rem;
}
.h-9 {
  height: 2.25rem;
}
.h-\[0\.9em\] {
  height: 0.9em;
}
.h-\[1\.15rem\] {
  height: 1.15rem;
}
.h-\[18px\] {
  height: 18px;
}
.h-\[200px\] {
  height: 200px;
}
.h-\[calc\(100\%-1px\)\] {
  height: calc(100% - 1px);
}
.h-\[calc\(100dvh-13rem\)\] {
  height: calc(100dvh - 13rem);
}
.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-svh {
  height: 100svh;
}
.max-h-40 {
  max-height: 10rem;
}
.max-h-48 {
  max-height: 12rem;
}
.max-h-\[300px\] {
  max-height: 300px;
}
.max-h-\[320px\] {
  max-height: 320px;
}
.max-h-\[60vh\] {
  max-height: 60vh;
}
.max-h-\[85vh\] {
  max-height: 85vh;
}
.max-h-\[90vh\] {
  max-height: 90vh;
}
.max-h-\[92vh\] {
  max-height: 92vh;
}
.max-h-full {
  max-height: 100%;
}
.min-h-0 {
  min-height: 0px;
}
.min-h-11 {
  min-height: 2.75rem;
}
.min-h-16 {
  min-height: 4rem;
}
.min-h-4 {
  min-height: 1rem;
}
.min-h-\[180px\] {
  min-height: 180px;
}
.min-h-\[28rem\] {
  min-height: 28rem;
}
.min-h-\[44px\] {
  min-height: 44px;
}
.min-h-\[60vh\] {
  min-height: 60vh;
}
.min-h-dvh {
  min-height: 100dvh;
}
.min-h-screen {
  min-height: 100vh;
}
.min-h-svh {
  min-height: 100svh;
}
.w-0 {
  width: 0px;
}
.w-1 {
  width: 0.25rem;
}
.w-1\.5 {
  width: 0.375rem;
}
.w-1\/2 {
  width: 50%;
}
.w-1\/4 {
  width: 25%;
}
.w-10 {
  width: 2.5rem;
}
.w-12 {
  width: 3rem;
}
.w-14 {
  width: 3.5rem;
}
.w-16 {
  width: 4rem;
}
.w-2 {
  width: 0.5rem;
}
.w-2\.5 {
  width: 0.625rem;
}
.w-2\/3 {
  width: 66.666667%;
}
.w-20 {
  width: 5rem;
}
.w-24 {
  width: 6rem;
}
.w-3 {
  width: 0.75rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-3\/4 {
  width: 75%;
}
.w-32 {
  width: 8rem;
}
.w-4 {
  width: 1rem;
}
.w-40 {
  width: 10rem;
}
.w-48 {
  width: 12rem;
}
.w-5 {
  width: 1.25rem;
}
.w-52 {
  width: 13rem;
}
.w-6 {
  width: 1.5rem;
}
.w-64 {
  width: 16rem;
}
.w-7 {
  width: 1.75rem;
}
.w-72 {
  width: 18rem;
}
.w-8 {
  width: 2rem;
}
.w-80 {
  width: 20rem;
}
.w-9 {
  width: 2.25rem;
}
.w-\[100px\] {
  width: 100px;
}
.w-\[280px\] {
  width: 280px;
}
.w-\[380px\] {
  width: 380px;
}
.w-\[600px\] {
  width: 600px;
}
.w-\[var\(--radix-popover-trigger-width\)\] {
  width: var(--radix-popover-trigger-width);
}
.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-5 {
  min-width: 1.25rem;
}
.min-w-8 {
  min-width: 2rem;
}
.min-w-9 {
  min-width: 2.25rem;
}
.min-w-\[120px\] {
  min-width: 120px;
}
.min-w-\[12rem\] {
  min-width: 12rem;
}
.min-w-\[180px\] {
  min-width: 180px;
}
.min-w-\[18px\] {
  min-width: 18px;
}
.min-w-\[8rem\] {
  min-width: 8rem;
}
.min-w-\[var\(--radix-select-trigger-width\)\] {
  min-width: var(--radix-select-trigger-width);
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-5xl {
  max-width: 64rem;
}
.max-w-7xl {
  max-width: 80rem;
}
.max-w-\[14rem\] {
  max-width: 14rem;
}
.max-w-\[16rem\] {
  max-width: 16rem;
}
.max-w-\[18rem\] {
  max-width: 18rem;
}
.max-w-\[200px\] {
  max-width: 200px;
}
.max-w-\[220px\] {
  max-width: 220px;
}
.max-w-\[520px\] {
  max-width: 520px;
}
.max-w-\[640px\] {
  max-width: 640px;
}
.max-w-\[75\%\] {
  max-width: 75%;
}
.max-w-\[80\%\] {
  max-width: 80%;
}
.max-w-\[85vw\] {
  max-width: 85vw;
}
.max-w-\[90vw\] {
  max-width: 90vw;
}
.max-w-\[calc\(100\%-2rem\)\] {
  max-width: calc(100% - 2rem);
}
.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-none {
  max-width: none;
}
.max-w-sm {
  max-width: 24rem;
}
.max-w-xl {
  max-width: 36rem;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-shrink {
  flex-shrink: 1;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.shrink {
  flex-shrink: 1;
}
.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;
}
.-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-x-px {
  --tw-translate-x: -1px;
  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-x-px {
  --tw-translate-x: 1px;
  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-0\.5 {
  --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));
}
.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));
}
.translate-y-\[calc\(-50\%_-_2px\)\] {
  --tw-translate-y: calc(-50% - 2px);
  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-0 {
  --tw-rotate: 0deg;
  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 {
  --tw-scale-x: 0;
  --tw-scale-y: 0;
  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-100 {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes badge-chip-in {

  0% {
    transform: scale(0.85) translateY(2px);
    opacity: 0;
  }

  60% {
    transform: scale(1.04);
  }

  100% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}
.animate-badge-chip-in {
  animation: badge-chip-in 0.3s ease-out;
}
@keyframes hardcap-fill-in {

  0% {
    width: 0%;
  }

  100% {
    width: var(--hardcap-target, 0%);
  }
}
.animate-hardcap-fill-in {
  animation: hardcap-fill-in 0.9s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
@keyframes ping {

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

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

  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.cursor-default {
  cursor: default;
}
.cursor-pointer {
  cursor: pointer;
}
.cursor-zoom-in {
  cursor: zoom-in;
}
.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;
}
.scroll-my-1 {
  scroll-margin-top: 0.25rem;
  scroll-margin-bottom: 0.25rem;
}
.scroll-py-1 {
  scroll-padding-top: 0.25rem;
  scroll-padding-bottom: 0.25rem;
}
.list-inside {
  list-style-position: inside;
}
.list-disc {
  list-style-type: disc;
}
.list-none {
  list-style-type: none;
}
.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.auto-rows-min {
  grid-auto-rows: min-content;
}
.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-\[0_1fr\] {
  grid-template-columns: 0 1fr;
}
.grid-cols-\[2\.5rem_1fr\] {
  grid-template-columns: 2.5rem 1fr;
}
.grid-cols-\[auto_1fr_auto\] {
  grid-template-columns: auto 1fr auto;
}
.grid-rows-\[auto_auto\] {
  grid-template-rows: auto auto;
}
.flex-row {
  flex-direction: row;
}
.flex-col {
  flex-direction: column;
}
.flex-col-reverse {
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.place-items-center {
  place-items: center;
}
.items-start {
  align-items: flex-start;
}
.items-end {
  align-items: flex-end;
}
.items-center {
  align-items: center;
}
.items-baseline {
  align-items: baseline;
}
.items-stretch {
  align-items: stretch;
}
.justify-start {
  justify-content: flex-start;
}
.justify-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.justify-items-start {
  justify-items: start;
}
.gap-0\.5 {
  gap: 0.125rem;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-1\.5 {
  gap: 0.375rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-2\.5 {
  gap: 0.625rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-6 {
  gap: 1.5rem;
}
.gap-8 {
  gap: 2rem;
}
.gap-x-3 {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.gap-y-0\.5 {
  row-gap: 0.125rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.gap-y-2 {
  row-gap: 0.5rem;
}
.space-y-0\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.125rem * var(--tw-space-y-reverse));
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
}
.space-y-12 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(3rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(3rem * 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-20 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}
.divide-y > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.divide-border > :not([hidden]) ~ :not([hidden]) {
  border-color: oklch(var(--border));
}
.self-start {
  align-self: flex-start;
}
.justify-self-end {
  justify-self: end;
}
.overflow-auto {
  overflow: auto;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-x-auto {
  overflow-x: auto;
}
.overflow-y-auto {
  overflow-y: auto;
}
.overflow-x-hidden {
  overflow-x: hidden;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.whitespace-pre-wrap {
  white-space: pre-wrap;
}
.text-balance {
  text-wrap: balance;
}
.break-words {
  overflow-wrap: break-word;
}
.break-all {
  word-break: break-all;
}
.rounded {
  border-radius: 0.25rem;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-\[2px\] {
  border-radius: 2px;
}
.rounded-\[4px\] {
  border-radius: 4px;
}
.rounded-\[inherit\] {
  border-radius: inherit;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: var(--radius);
}
.rounded-md {
  border-radius: calc(var(--radius) + 2px);
}
.rounded-none {
  border-radius: 0px;
}
.rounded-sm {
  border-radius: var(--radius);
}
.rounded-xl {
  border-radius: 0.75rem;
}
.rounded-l-md {
  border-top-left-radius: calc(var(--radius) + 2px);
  border-bottom-left-radius: calc(var(--radius) + 2px);
}
.rounded-r {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}
.rounded-r-md {
  border-top-right-radius: calc(var(--radius) + 2px);
  border-bottom-right-radius: calc(var(--radius) + 2px);
}
.rounded-bl {
  border-bottom-left-radius: 0.25rem;
}
.rounded-tl-sm {
  border-top-left-radius: var(--radius);
}
.border {
  border-width: 1px;
}
.border-0 {
  border-width: 0px;
}
.border-2 {
  border-width: 2px;
}
.border-\[1\.5px\] {
  border-width: 1.5px;
}
.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-dashed {
  border-style: dashed;
}
.border-none {
  border-style: none;
}
.border-\[oklch\(var\(--dsd\)\/0\.4\)\] {
  border-color: oklch(var(--dsd)/0.4);
}
.border-accent\/30 {
  border-color: oklch(var(--accent) / 0.3);
}
.border-amber-500\/30 {
  border-color: rgb(245 158 11 / 0.3);
}
.border-amber-500\/40 {
  border-color: rgb(245 158 11 / 0.4);
}
.border-amber-500\/50 {
  border-color: rgb(245 158 11 / 0.5);
}
.border-blue-500\/40 {
  border-color: rgb(59 130 246 / 0.4);
}
.border-border {
  border-color: oklch(var(--border));
}
.border-destructive {
  --tw-border-opacity: 1;
  border-color: oklch(var(--destructive) / var(--tw-border-opacity, 1));
}
.border-destructive\/30 {
  border-color: oklch(var(--destructive) / 0.3);
}
.border-destructive\/40 {
  border-color: oklch(var(--destructive) / 0.4);
}
.border-destructive\/50 {
  border-color: oklch(var(--destructive) / 0.5);
}
.border-destructive\/60 {
  border-color: oklch(var(--destructive) / 0.6);
}
.border-emerald-500\/30 {
  border-color: rgb(16 185 129 / 0.3);
}
.border-emerald-500\/50 {
  border-color: rgb(16 185 129 / 0.5);
}
.border-gray-500\/40 {
  border-color: rgb(107 114 128 / 0.4);
}
.border-green-500\/40 {
  border-color: rgb(34 197 94 / 0.4);
}
.border-green-500\/50 {
  border-color: rgb(34 197 94 / 0.5);
}
.border-indigo-500\/40 {
  border-color: rgb(99 102 241 / 0.4);
}
.border-input {
  border-color: oklch(var(--input));
}
.border-muted-foreground\/30 {
  border-color: oklch(var(--muted-foreground) / 0.3);
}
.border-orange-500\/30 {
  border-color: rgb(249 115 22 / 0.3);
}
.border-orange-500\/40 {
  border-color: rgb(249 115 22 / 0.4);
}
.border-primary {
  --tw-border-opacity: 1;
  border-color: oklch(var(--primary) / var(--tw-border-opacity, 1));
}
.border-primary\/20 {
  border-color: oklch(var(--primary) / 0.2);
}
.border-primary\/30 {
  border-color: oklch(var(--primary) / 0.3);
}
.border-primary\/40 {
  border-color: oklch(var(--primary) / 0.4);
}
.border-primary\/50 {
  border-color: oklch(var(--primary) / 0.5);
}
.border-primary\/60 {
  border-color: oklch(var(--primary) / 0.6);
}
.border-purple-500\/40 {
  border-color: rgb(168 85 247 / 0.4);
}
.border-red-500\/40 {
  border-color: rgb(239 68 68 / 0.4);
}
.border-sidebar-border {
  border-color: oklch(var(--sidebar-border));
}
.border-transparent {
  border-color: transparent;
}
.border-yellow-500\/40 {
  border-color: rgb(234 179 8 / 0.4);
}
.border-l-transparent {
  border-left-color: transparent;
}
.border-t-transparent {
  border-top-color: transparent;
}
.bg-\[\#1a1a1a\] {
  --tw-bg-opacity: 1;
  background-color: rgb(26 26 26 / var(--tw-bg-opacity, 1));
}
.bg-\[oklch\(0\.08_0\.005_240\)\] {
  background-color: oklch(0.08 0.005 240);
}
.bg-\[oklch\(var\(--dsd\)\/0\.08\)\] {
  background-color: oklch(var(--dsd)/0.08);
}
.bg-\[oklch\(var\(--dsd\)\/0\.16\)\] {
  background-color: oklch(var(--dsd)/0.16);
}
.bg-accent {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.bg-accent\/15 {
  background-color: oklch(var(--accent) / 0.15);
}
.bg-amber-500\/10 {
  background-color: rgb(245 158 11 / 0.1);
}
.bg-amber-500\/15 {
  background-color: rgb(245 158 11 / 0.15);
}
.bg-amber-500\/20 {
  background-color: rgb(245 158 11 / 0.2);
}
.bg-background {
  background-color: oklch(var(--background));
}
.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}
.bg-blue-500\/20 {
  background-color: rgb(59 130 246 / 0.2);
}
.bg-border {
  background-color: oklch(var(--border));
}
.bg-card {
  background-color: oklch(var(--card));
}
.bg-cyan-500\/10 {
  background-color: rgb(6 182 212 / 0.1);
}
.bg-cyan-500\/15 {
  background-color: rgb(6 182 212 / 0.15);
}
.bg-destructive {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--destructive) / var(--tw-bg-opacity, 1));
}
.bg-destructive\/10 {
  background-color: oklch(var(--destructive) / 0.1);
}
.bg-destructive\/20 {
  background-color: oklch(var(--destructive) / 0.2);
}
.bg-destructive\/5 {
  background-color: oklch(var(--destructive) / 0.05);
}
.bg-emerald-500\/10 {
  background-color: rgb(16 185 129 / 0.1);
}
.bg-emerald-500\/20 {
  background-color: rgb(16 185 129 / 0.2);
}
.bg-foreground {
  background-color: oklch(var(--foreground));
}
.bg-gray-500\/20 {
  background-color: rgb(107 114 128 / 0.2);
}
.bg-green-500\/10 {
  background-color: rgb(34 197 94 / 0.1);
}
.bg-green-500\/20 {
  background-color: rgb(34 197 94 / 0.2);
}
.bg-indigo-500\/20 {
  background-color: rgb(99 102 241 / 0.2);
}
.bg-input {
  background-color: oklch(var(--input));
}
.bg-muted {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--muted) / var(--tw-bg-opacity, 1));
}
.bg-muted-foreground\/50 {
  background-color: oklch(var(--muted-foreground) / 0.5);
}
.bg-muted\/20 {
  background-color: oklch(var(--muted) / 0.2);
}
.bg-muted\/30 {
  background-color: oklch(var(--muted) / 0.3);
}
.bg-muted\/40 {
  background-color: oklch(var(--muted) / 0.4);
}
.bg-muted\/50 {
  background-color: oklch(var(--muted) / 0.5);
}
.bg-muted\/60 {
  background-color: oklch(var(--muted) / 0.6);
}
.bg-orange-500\/10 {
  background-color: rgb(249 115 22 / 0.1);
}
.bg-orange-500\/20 {
  background-color: rgb(249 115 22 / 0.2);
}
.bg-popover {
  background-color: oklch(var(--popover));
}
.bg-primary {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.bg-primary\/10 {
  background-color: oklch(var(--primary) / 0.1);
}
.bg-primary\/15 {
  background-color: oklch(var(--primary) / 0.15);
}
.bg-primary\/20 {
  background-color: oklch(var(--primary) / 0.2);
}
.bg-primary\/5 {
  background-color: oklch(var(--primary) / 0.05);
}
.bg-primary\/70 {
  background-color: oklch(var(--primary) / 0.7);
}
.bg-purple-500\/20 {
  background-color: rgb(168 85 247 / 0.2);
}
.bg-red-500\/20 {
  background-color: rgb(239 68 68 / 0.2);
}
.bg-secondary {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--secondary) / var(--tw-bg-opacity, 1));
}
.bg-secondary\/15 {
  background-color: oklch(var(--secondary) / 0.15);
}
.bg-secondary\/40 {
  background-color: oklch(var(--secondary) / 0.4);
}
.bg-secondary\/70 {
  background-color: oklch(var(--secondary) / 0.7);
}
.bg-sidebar {
  background-color: oklch(var(--sidebar));
}
.bg-sidebar-border {
  background-color: oklch(var(--sidebar-border));
}
.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\/40 {
  background-color: rgb(255 255 255 / 0.4);
}
.bg-yellow-500\/20 {
  background-color: rgb(234 179 8 / 0.2);
}
.bg-gradient-to-b {
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
}
.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}
.bg-gradient-to-r {
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}
.from-primary\/10 {
  --tw-gradient-from: oklch(var(--primary) / 0.1) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/5 {
  --tw-gradient-from: oklch(var(--primary) / 0.05) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-primary\/60 {
  --tw-gradient-from: oklch(var(--primary) / 0.6) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-background {
  --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), oklch(var(--background)) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-primary\/40 {
  --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), oklch(var(--primary) / 0.4) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-background {
  --tw-gradient-to: oklch(var(--background)) var(--tw-gradient-to-position);
}
.to-card {
  --tw-gradient-to: oklch(var(--card)) var(--tw-gradient-to-position);
}
.to-primary\/60 {
  --tw-gradient-to: oklch(var(--primary) / 0.6) var(--tw-gradient-to-position);
}
.fill-current {
  fill: currentColor;
}
.fill-primary {
  fill: oklch(var(--primary) / 1);
}
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}
.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}
.p-0 {
  padding: 0px;
}
.p-0\.5 {
  padding: 0.125rem;
}
.p-1 {
  padding: 0.25rem;
}
.p-10 {
  padding: 2.5rem;
}
.p-12 {
  padding: 3rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-2\.5 {
  padding: 0.625rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-8 {
  padding: 2rem;
}
.p-\[3px\] {
  padding: 3px;
}
.p-px {
  padding: 1px;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-2\.5 {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.py-0 {
  padding-top: 0px;
  padding-bottom: 0px;
}
.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-20 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}
.py-24 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.pb-1 {
  padding-bottom: 0.25rem;
}
.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;
}
.pl-12 {
  padding-left: 3rem;
}
.pl-2 {
  padding-left: 0.5rem;
}
.pl-3 {
  padding-left: 0.75rem;
}
.pl-4 {
  padding-left: 1rem;
}
.pl-6 {
  padding-left: 1.5rem;
}
.pl-8 {
  padding-left: 2rem;
}
.pl-9 {
  padding-left: 2.25rem;
}
.pr-1 {
  padding-right: 0.25rem;
}
.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;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.align-middle {
  vertical-align: middle;
}
.font-heading {
  font-family: Geist, system-ui, sans-serif;
}
.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}
.text-5xl {
  font-size: 3rem;
  line-height: 1;
}
.text-\[0\.65rem\] {
  font-size: 0.65rem;
}
.text-\[0\.6rem\] {
  font-size: 0.6rem;
}
.text-\[0\.8rem\] {
  font-size: 0.8rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-bold {
  font-weight: 700;
}
.font-extrabold {
  font-weight: 800;
}
.font-medium {
  font-weight: 500;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.lowercase {
  text-transform: lowercase;
}
.capitalize {
  text-transform: capitalize;
}
.italic {
  font-style: italic;
}
.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-none {
  line-height: 1;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-tight {
  line-height: 1.25;
}
.tracking-\[0\.2em\] {
  letter-spacing: 0.2em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-wide {
  letter-spacing: 0.025em;
}
.tracking-wider {
  letter-spacing: 0.05em;
}
.tracking-widest {
  letter-spacing: 0.1em;
}
.text-\[oklch\(var\(--dsd\)\)\] {
  color: oklch(var(--dsd));
}
.text-accent-foreground {
  color: oklch(var(--accent-foreground));
}
.text-amber-100 {
  --tw-text-opacity: 1;
  color: rgb(254 243 199 / var(--tw-text-opacity, 1));
}
.text-amber-200 {
  --tw-text-opacity: 1;
  color: rgb(253 230 138 / var(--tw-text-opacity, 1));
}
.text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}
.text-amber-500 {
  --tw-text-opacity: 1;
  color: rgb(245 158 11 / var(--tw-text-opacity, 1));
}
.text-amber-600 {
  --tw-text-opacity: 1;
  color: rgb(217 119 6 / var(--tw-text-opacity, 1));
}
.text-background {
  color: oklch(var(--background));
}
.text-blue-300 {
  --tw-text-opacity: 1;
  color: rgb(147 197 253 / var(--tw-text-opacity, 1));
}
.text-card-foreground {
  color: oklch(var(--card-foreground));
}
.text-current {
  color: currentColor;
}
.text-cyan-400 {
  --tw-text-opacity: 1;
  color: rgb(34 211 238 / var(--tw-text-opacity, 1));
}
.text-destructive {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.text-destructive-foreground {
  color: oklch(var(--destructive-foreground));
}
.text-destructive\/50 {
  color: oklch(var(--destructive) / 0.5);
}
.text-emerald-400 {
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}
.text-emerald-500 {
  --tw-text-opacity: 1;
  color: rgb(16 185 129 / var(--tw-text-opacity, 1));
}
.text-foreground {
  color: oklch(var(--foreground));
}
.text-gray-300 {
  --tw-text-opacity: 1;
  color: rgb(209 213 219 / var(--tw-text-opacity, 1));
}
.text-green-300 {
  --tw-text-opacity: 1;
  color: rgb(134 239 172 / var(--tw-text-opacity, 1));
}
.text-green-400 {
  --tw-text-opacity: 1;
  color: rgb(74 222 128 / var(--tw-text-opacity, 1));
}
.text-green-500 {
  --tw-text-opacity: 1;
  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
}
.text-indigo-300 {
  --tw-text-opacity: 1;
  color: rgb(165 180 252 / var(--tw-text-opacity, 1));
}
.text-muted-foreground {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.text-muted-foreground\/20 {
  color: oklch(var(--muted-foreground) / 0.2);
}
.text-muted-foreground\/30 {
  color: oklch(var(--muted-foreground) / 0.3);
}
.text-muted-foreground\/40 {
  color: oklch(var(--muted-foreground) / 0.4);
}
.text-muted-foreground\/50 {
  color: oklch(var(--muted-foreground) / 0.5);
}
.text-muted-foreground\/60 {
  color: oklch(var(--muted-foreground) / 0.6);
}
.text-muted-foreground\/70 {
  color: oklch(var(--muted-foreground) / 0.7);
}
.text-muted-foreground\/80 {
  color: oklch(var(--muted-foreground) / 0.8);
}
.text-orange-200 {
  --tw-text-opacity: 1;
  color: rgb(254 215 170 / var(--tw-text-opacity, 1));
}
.text-orange-300 {
  --tw-text-opacity: 1;
  color: rgb(253 186 116 / var(--tw-text-opacity, 1));
}
.text-orange-400 {
  --tw-text-opacity: 1;
  color: rgb(251 146 60 / var(--tw-text-opacity, 1));
}
.text-popover-foreground {
  color: oklch(var(--popover-foreground));
}
.text-primary {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}
.text-primary-foreground {
  color: oklch(var(--primary-foreground));
}
.text-primary\/90 {
  color: oklch(var(--primary) / 0.9);
}
.text-purple-300 {
  --tw-text-opacity: 1;
  color: rgb(216 180 254 / var(--tw-text-opacity, 1));
}
.text-red-300 {
  --tw-text-opacity: 1;
  color: rgb(252 165 165 / var(--tw-text-opacity, 1));
}
.text-red-400 {
  --tw-text-opacity: 1;
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
}
.text-secondary-foreground {
  color: oklch(var(--secondary-foreground));
}
.text-sidebar-foreground {
  color: oklch(var(--sidebar-foreground));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-white\/0 {
  color: rgb(255 255 255 / 0);
}
.text-white\/80 {
  color: rgb(255 255 255 / 0.8);
}
.text-yellow-300 {
  --tw-text-opacity: 1;
  color: rgb(253 224 71 / var(--tw-text-opacity, 1));
}
.underline {
  text-decoration-line: underline;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.opacity-0 {
  opacity: 0;
}
.opacity-20 {
  opacity: 0.2;
}
.opacity-50 {
  opacity: 0.5;
}
.opacity-60 {
  opacity: 0.6;
}
.opacity-70 {
  opacity: 0.7;
}
.opacity-75 {
  opacity: 0.75;
}
.opacity-80 {
  opacity: 0.8;
}
.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-2xl {
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_-4px_12px_-4px_oklch\(0_0_0\/0\.15\)\] {
  --tw-shadow: 0 -4px 12px -4px oklch(0 0 0/0.15);
  --tw-shadow-colored: 0 -4px 12px -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-\[0_0_0_1px_hsl\(var\(--sidebar-border\)\)\] {
  --tw-shadow: 0 0 0 1px hsl(var(--sidebar-border));
  --tw-shadow-colored: 0 0 0 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-\[inset_0_0_0_1px_oklch\(0\.74_0\.14_235\/0\.5\)\] {
  --tw-shadow: inset 0 0 0 1px oklch(0.74 0.14 235/0.5);
  --tw-shadow-colored: inset 0 0 0 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-\[inset_0_0_0_1px_oklch\(0\.78_0\.16_75\/0\.5\)\] {
  --tw-shadow: inset 0 0 0 1px oklch(0.78 0.16 75/0.5);
  --tw-shadow-colored: inset 0 0 0 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-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-none {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-orange-glow {
  --tw-shadow: 0 0 24px oklch(0.65 0.20 40 / 0.25);
  --tw-shadow-colored: 0 0 24px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xl {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xs {
  --tw-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-primary\/10 {
  --tw-shadow-color: oklch(var(--primary) / 0.1);
  --tw-shadow: var(--tw-shadow-colored);
}
.shadow-primary\/20 {
  --tw-shadow-color: oklch(var(--primary) / 0.2);
  --tw-shadow: var(--tw-shadow-colored);
}
.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.outline {
  outline-style: solid;
}
.ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-0 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-1 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-card {
  --tw-ring-color: oklch(var(--card));
}
.ring-destructive\/30 {
  --tw-ring-color: oklch(var(--destructive) / 0.3);
}
.ring-destructive\/40 {
  --tw-ring-color: oklch(var(--destructive) / 0.4);
}
.ring-primary\/30 {
  --tw-ring-color: oklch(var(--primary) / 0.3);
}
.ring-primary\/40 {
  --tw-ring-color: oklch(var(--primary) / 0.4);
}
.ring-ring\/50 {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.ring-sidebar-ring {
  --tw-ring-color: oklch(var(--sidebar-ring));
}
.ring-offset-background {
  --tw-ring-offset-color: oklch(var(--background));
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-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);
}
.blur-sm {
  --tw-blur: blur(4px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow {
  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-lg {
  --tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
  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 {
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-lg {
  --tw-backdrop-blur: blur(16px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-sm {
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-filter {
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[color\2c box-shadow\] {
  transition-property: color,box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[left\2c right\2c width\] {
  transition-property: left,right,width;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[margin\2c opacity\] {
  transition-property: margin,opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[width\2c height\2c padding\] {
  transition-property: width,height,padding;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[width\] {
  transition-property: width;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-none {
  transition-property: none;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-shadow {
  transition-property: box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-1000 {
  transition-duration: 1000ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.duration-300 {
  transition-duration: 300ms;
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-linear {
  transition-timing-function: linear;
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.\@container\/card-header {
  container-type: inline-size;
  container-name: card-header;
}
@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;
}
.zoom-in-95 {
  --tw-enter-scale: .95;
}
.duration-1000 {
  animation-duration: 1000ms;
}
.duration-200 {
  animation-duration: 200ms;
}
.duration-300 {
  animation-duration: 300ms;
}
.ease-in-out {
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-linear {
  animation-timing-function: linear;
}
.ease-out {
  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.running {
  animation-play-state: running;
}
.\!paused {
  animation-play-state: paused !important;
}
.paused {
  animation-play-state: paused;
}
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
::-webkit-scrollbar-track {
    background: oklch(0.1 0.01 240);
  }
::-webkit-scrollbar-thumb {
    background: oklch(0.25 0.01 240);
    border-radius: 2px;
  }
::-webkit-scrollbar-thumb:hover {
    background: oklch(0.65 0.2 40);
  }
.ds-blur-overlay {
    position: relative;
  }
.ds-blur-overlay::after {
    content: "";
    position: absolute;
    inset: 0;
    backdrop-filter: blur(12px);
    background: oklch(0.1 0.01 240 / 0.35);
    border-radius: inherit;
    pointer-events: none;
  }
.ds-pill-active {
    background: oklch(var(--primary));
    color: oklch(var(--primary-foreground));
    box-shadow: 0 0 16px oklch(0.65 0.2 40 / 0.25);
  }
.ds-pill-inactive {
    background: oklch(var(--secondary));
    color: oklch(var(--secondary-foreground));
  }
.ds-sidebar-backdrop {
    background: oklch(0.05 0.01 240 / 0.6);
    backdrop-filter: blur(4px);
  }
/* (1) Quote block — bordered inset block with orange left accent, attributed header */
.ds-quote {
    background: oklch(0.12 0.01 240);
    border: 1px solid oklch(var(--border));
    border-left: 3px solid oklch(var(--primary) / 0.6);
    border-radius: var(--radius);
  }
.ds-quote-header {
    color: oklch(var(--muted-foreground));
    border-bottom: 1px solid oklch(var(--border) / 0.6);
  }
.ds-quote-author {
    color: oklch(0.85 0.14 40);
    font-weight: 600;
  }
.ds-quote-body {
    color: oklch(0.78 0.01 240);
  }
/* (2) Author sidebar — vertical card beside a post, collapses to horizontal strip */
.ds-author-sidebar {
    background: oklch(0.12 0.01 240);
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
  }
.ds-author-sidebar-alias {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    letter-spacing: -0.02em;
    color: oklch(0.85 0.14 40);
  }
.ds-author-sidebar-alias:hover {
    color: oklch(var(--primary));
    text-decoration: underline;
  }
.ds-author-sidebar-stat {
    color: oklch(var(--muted-foreground));
  }
.ds-author-sidebar-stat-value {
    color: oklch(var(--foreground));
    font-weight: 600;
  }
/* (3) Views counter — small eye-icon pill on thread cards/headers */
.ds-views-pill {
    background: oklch(var(--secondary) / 0.6);
    color: oklch(var(--muted-foreground));
    border: 1px solid oklch(var(--border) / 0.6);
    border-radius: 9999px;
  }
/* (4) Edited timestamp — subtle italic label beside original timestamp */
.ds-edited-label {
    color: oklch(var(--muted-foreground) / 0.8);
    font-style: italic;
    font-size: 0.75rem;
  }
/* (5) Up/down vote control — vertical stack, coexists with heart like button */
.ds-vote {
    color: oklch(var(--muted-foreground));
  }
.ds-vote-btn {
    color: oklch(var(--muted-foreground));
    transition: color 0.15s ease, transform 0.15s ease;
  }
.ds-vote-btn:hover {
    color: oklch(var(--foreground));
  }
.ds-vote-up-active {
    color: oklch(var(--success));
    filter: drop-shadow(0 0 6px oklch(var(--success) / 0.4));
  }
.ds-vote-down-active {
    color: oklch(var(--destructive));
    filter: drop-shadow(0 0 6px oklch(var(--destructive) / 0.4));
  }
.ds-vote-score {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    color: oklch(var(--foreground));
  }
.ds-vote-score-up {
    color: oklch(var(--success));
  }
.ds-vote-score-down {
    color: oklch(var(--destructive));
  }
/* (6) $DSD tip button + modal — coin/gift icon button, modal with quick-amount chips */
.ds-tip-btn {
    background: oklch(var(--secondary));
    color: oklch(0.85 0.14 40);
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    transition: all 0.2s ease;
  }
.ds-tip-btn:hover {
    background: oklch(var(--primary) / 0.16);
    border-color: oklch(var(--primary) / 0.5);
    box-shadow: 0 0 16px oklch(var(--primary) / 0.18);
  }
.ds-tip-modal {
    background: oklch(var(--popover));
    border: 1px solid oklch(var(--border));
    border-radius: calc(var(--radius) + 2px);
    box-shadow: 0 12px 40px oklch(0.02 0.01 240 / 0.7);
  }
.ds-tip-chip {
    background: oklch(var(--secondary));
    color: oklch(0.85 0.14 40);
    border: 1px solid oklch(var(--primary) / 0.4);
    border-radius: var(--radius);
    transition: all 0.15s ease;
  }
.ds-tip-chip:hover {
    background: oklch(var(--primary) / 0.16);
    border-color: oklch(var(--primary) / 0.7);
  }
.ds-tip-chip-active {
    background: oklch(var(--primary));
    color: oklch(var(--primary-foreground));
    border-color: oklch(var(--primary));
    box-shadow: 0 0 16px oklch(var(--primary) / 0.3);
  }
.ds-tip-input {
    background: oklch(var(--input));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    color: oklch(var(--foreground));
  }
.ds-tip-input:focus {
    border-color: oklch(var(--primary));
    box-shadow: 0 0 0 2px oklch(var(--primary) / 0.3);
    outline: none;
  }
.ds-tip-balance {
    color: oklch(var(--muted-foreground));
  }
/* ===== MOBILE FORUM POLISH =====
     Additive mobile-only behavior for the forum. No colors, fonts, or
     desktop layout are touched. Scoped to max-width: 768px so desktop
     renders exactly as before. */
/* Collapsible quote blocks — collapsed by default on mobile with a
     tap-to-expand affordance. The RichBody component toggles the
     `ds-quote-expanded` class on the container when a blockquote is
     tapped. The ::after gradient overlay signals there is more content
     and disappears once expanded. */
@media (max-width: 768px) {
    .ds-quote-collapsible blockquote {
      max-height: 4rem;
      overflow: hidden;
      position: relative;
      cursor: pointer;
      transition: max-height 0.25s ease;
    }
    .ds-quote-collapsible.ds-quote-expanded blockquote {
      max-height: 60rem;
    }
    /* Gradient fade overlay on collapsed quotes — visual cue that more
       text is hidden. Removed once expanded. */
    .ds-quote-collapsible:not(.ds-quote-expanded) blockquote::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 50%,
        oklch(0.12 0.01 240 / 0.92) 100%
      );
      pointer-events: none;
    }
    /* Tap-to-expand hint label under collapsed quotes. */
    .ds-quote-collapsible:not(.ds-quote-expanded) blockquote::before {
      content: "Tap to expand quote";
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 0.25rem 0.5rem;
      font-size: 0.7rem;
      font-style: normal;
      font-weight: 600;
      text-align: center;
      color: oklch(var(--primary));
      z-index: 1;
      pointer-events: none;
    }
  }
/* Docked reply composer — sticky bottom-0 on mobile so the reply box
     stays reachable above the iOS home indicator. The component applies
     .ds-reply-dock + .safe-bottom + a card background; this rule ensures
     the sticky positioning behaves correctly inside the scroll container.
     Layout is flex-column at all breakpoints: full-width textarea on top,
     Post Reply button right-aligned below it (via .ds-reply-actions). */
.ds-reply-dock {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    background: oklch(var(--card));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    padding: 0.75rem;
    z-index: 30;
  }
/* Right-aligned action row beneath the textarea. The submit button sits
     on the right edge; future secondary actions can stack left of it. */
.ds-reply-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
  }
.ds-heading {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
  }
.ds-card-hover {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  animation-duration: 200ms;
}
.ds-card-hover: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));
  --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);
  --tw-shadow-color: oklch(var(--primary) / 0.1);
  --tw-shadow: var(--tw-shadow-colored);
}
.ds-orange-glow {
    box-shadow: 0 0 20px oklch(0.65 0.2 40 / 0.2);
  }
.ds-stripe {
    background: repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 10px,
      oklch(0.65 0.2 40 / 0.04) 10px,
      oklch(0.65 0.2 40 / 0.04) 20px
    );
  }
/* Subscription bell — active state uses success green, inactive uses muted */
.ds-sub-bell-active {
    color: oklch(var(--success));
    background: oklch(var(--success) / 0.12);
    box-shadow: 0 0 0 1px oklch(var(--success) / 0.4) inset;
  }
.ds-sub-bell-inactive {
    color: oklch(var(--muted-foreground));
    background: oklch(var(--secondary));
  }
/* Reputation chips — motocross-metal tiers, tight 0.25rem radius */
.ds-rep-bronze {
    background: oklch(var(--rep-bronze) / 0.18);
    color: oklch(0.85 0.06 55);
    box-shadow: 0 0 0 1px oklch(var(--rep-bronze) / 0.5) inset;
  }
.ds-rep-silver {
    background: oklch(var(--rep-silver) / 0.16);
    color: oklch(0.92 0.01 240);
    box-shadow: 0 0 0 1px oklch(var(--rep-silver) / 0.5) inset;
  }
.ds-rep-gold {
    background: oklch(var(--rep-gold) / 0.18);
    color: oklch(0.9 0.12 85);
    box-shadow: 0 0 0 1px oklch(var(--rep-gold) / 0.5) inset;
  }
.ds-rep-platinum {
    background: oklch(var(--rep-platinum) / 0.16);
    color: oklch(0.95 0.03 220);
    box-shadow: 0 0 0 1px oklch(var(--rep-platinum) / 0.55) inset;
  }
/* Leaderboard — top-3 rank accent bar on the left edge */
.ds-rank-bar-1 {
    box-shadow: inset 4px 0 0 oklch(var(--rep-gold));
  }
.ds-rank-bar-2 {
    box-shadow: inset 4px 0 0 oklch(var(--rep-silver));
  }
.ds-rank-bar-3 {
    box-shadow: inset 4px 0 0 oklch(var(--rep-bronze));
  }
/* My Garage card — reuses Bike Builds posts, orange-tinted left accent */
.ds-garage-card {
    border-left: 3px solid oklch(var(--primary) / 0.6);
  }
/* My Collection card — photo-forward, category tag chip */
.ds-collection-tag {
    background: oklch(var(--secondary));
    color: oklch(var(--secondary-foreground));
    border: 1px solid oklch(var(--border));
  }
.ds-collection-tag-bike {
    background: oklch(var(--primary) / 0.16);
    color: oklch(0.85 0.14 40);
    border: 1px solid oklch(var(--primary) / 0.4);
  }
.ds-collection-tag-gear {
    background: oklch(var(--chart-2) / 0.16);
    color: oklch(0.82 0.12 180);
    border: 1px solid oklch(var(--chart-2) / 0.4);
  }
.ds-collection-tag-collectible {
    background: oklch(var(--rep-gold) / 0.16);
    color: oklch(0.85 0.12 85);
    border: 1px solid oklch(var(--rep-gold) / 0.4);
  }
/* Public profile — alias headline + rep badge inline */
.ds-profile-alias {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    letter-spacing: -0.02em;
  }
/* $DSD currency figure — site standard heading font (Geist via .ds-heading
     stack) for a refined currency feel that matches the rest of the UI. */
.dsd-amount {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: oklch(var(--dsd));
  }
/* $DSD label / unit */
.dsd-unit {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 600;
    color: oklch(var(--dsd-muted));
  }
/* Purchase modal — trust surface, gold-bordered elevated card */
.dsd-modal {
    background: oklch(var(--popover));
    border: 1px solid oklch(var(--dsd) / 0.3);
    border-radius: calc(var(--radius) + 2px);
    box-shadow: 0 16px 48px oklch(0.02 0.01 240 / 0.8), 0 0 0 1px
      oklch(var(--dsd) / 0.08);
  }
.dsd-modal-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: oklch(var(--foreground));
  }
/* Trust warning bar — no-cash-out disclaimer */
.dsd-warning {
    background: oklch(var(--dsd-warning-bg));
    border: 1px solid oklch(var(--dsd-warning) / 0.5);
    border-left: 3px solid oklch(var(--dsd-warning));
    border-radius: var(--radius);
    color: oklch(var(--dsd-warning-foreground));
  }
.dsd-warning-label {
    color: oklch(0.85 0.12 65);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.7rem;
  }
/* $DSD primary button — gold CTA, distinct from orange primary */
.dsd-btn {
    background: oklch(var(--dsd));
    color: oklch(var(--dsd-foreground));
    border-radius: var(--radius);
    font-weight: 600;
    transition: all 0.2s ease;
  }
.dsd-btn:hover {
    box-shadow: 0 0 24px oklch(var(--dsd) / 0.4);
    filter: brightness(1.05);
  }
.dsd-btn-outline {
    background: transparent;
    color: oklch(var(--dsd));
    border: 1px solid oklch(var(--dsd) / 0.5);
    border-radius: var(--radius);
    transition: all 0.2s ease;
  }
.dsd-btn-outline:hover {
    background: oklch(var(--dsd) / 0.1);
    border-color: oklch(var(--dsd));
  }
/* $DSD-only listing badge — coin glyph + label */
.dsd-listing-badge {
    background: oklch(var(--dsd) / 0.14);
    color: oklch(var(--dsd));
    border: 1px solid oklch(var(--dsd) / 0.45);
    border-radius: var(--radius);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.65rem;
  }
/* Boosted listing — gold corner ribbon */
.dsd-boost-ribbon {
    background: oklch(var(--dsd));
    color: oklch(var(--dsd-foreground));
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.6rem;
    box-shadow: 0 2px 8px oklch(var(--dsd) / 0.3);
  }
.dsd-boost-glow {
    box-shadow: 0 0 0 1px oklch(var(--dsd) / 0.3), 0 4px 20px
      oklch(var(--dsd) / 0.1);
  }
/* Pinned-by-$DSD thread indicator */
.dsd-pin-indicator {
    color: oklch(var(--dsd));
    background: oklch(var(--dsd) / 0.12);
    border: 1px solid oklch(var(--dsd) / 0.4);
    border-radius: var(--radius);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.65rem;
  }
/* Premium bounty badge — star/crown glyph + label, gold-bordered */
.dsd-bounty-badge {
    background: oklch(var(--dsd) / 0.12);
    color: oklch(var(--dsd));
    border: 1px solid oklch(var(--dsd) / 0.5);
    border-radius: var(--radius);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.65rem;
  }
.dsd-bounty-card {
    border: 1px solid oklch(var(--dsd) / 0.25);
    background: oklch(var(--card));
  }
.dsd-bounty-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: inset 3px 0 0 oklch(var(--dsd));
  }
/* Currency filter pills — All / USD / $DSD */
.dsd-currency-pill {
    background: oklch(var(--secondary));
    color: oklch(var(--muted-foreground));
    border: 1px solid oklch(var(--border));
    border-radius: 9999px;
    transition: all 0.15s ease;
  }
.dsd-currency-pill-active-dsd {
    background: oklch(var(--dsd) / 0.16);
    color: oklch(var(--dsd));
    border-color: oklch(var(--dsd) / 0.6);
    box-shadow: 0 0 12px oklch(var(--dsd) / 0.2);
  }
/* Profile flair — colored display name + flair dot badge */
.dsd-flair-name {
    font-weight: 700;
    text-shadow: 0 0 12px oklch(var(--flair-current, var(--dsd)) / 0.25);
  }
.dsd-flair-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    box-shadow: 0 0 0 1px oklch(0.1 0.01 240 / 0.4), 0 0 8px
      oklch(var(--flair-current, var(--dsd)) / 0.5);
  }
.dsd-flair-gold {
    color: oklch(var(--flair-gold));
    --flair-current: var(--flair-gold);
  }
/* Loyalty-tier flair colors — derived from badgeLevel (Novice → Full Factory).
     Each token maps to one of the 6 loyalty tiers; rainbow is staff-only. */
.dsd-flair-grey {
    color: oklch(var(--flair-grey));
    --flair-current: var(--flair-grey);
  }
.dsd-flair-bronze {
    color: oklch(var(--flair-bronze));
    --flair-current: var(--flair-bronze);
  }
.dsd-flair-copper {
    color: oklch(var(--flair-copper));
    --flair-current: var(--flair-copper);
  }
.dsd-flair-blue {
    color: oklch(var(--flair-blue));
    --flair-current: var(--flair-blue);
  }
.dsd-flair-purple {
    color: oklch(var(--flair-purple));
    --flair-current: var(--flair-purple);
  }
.dsd-flair-mint {
    color: oklch(var(--flair-mint));
    --flair-current: var(--flair-mint);
  }
.dsd-flair-rose {
    color: oklch(var(--flair-rose));
    --flair-current: var(--flair-rose);
  }
.dsd-flair-azure {
    color: oklch(var(--flair-azure));
    --flair-current: var(--flair-azure);
  }
.dsd-flair-violet {
    color: oklch(var(--flair-violet));
    --flair-current: var(--flair-violet);
  }
/* Loyalty-tier chip backgrounds + borders — derived from the SAME --flair-*
     tokens as the dsd-flair-* color classes above so a badge chip's text,
     stars (fill-current), background, and border all render in the level's
     own color. badgeChipClasses returns one dsd-flair-* + one dsd-chip-bg-* +
     one dsd-chip-border-* per tier; consumers that split the string on
     spaces expect exactly these three classes. */
.dsd-chip-bg-grey {
    background: oklch(var(--flair-grey) / 0.16);
  }
.dsd-chip-border-grey {
    border-color: oklch(var(--flair-grey) / 0.5);
  }
.dsd-chip-bg-bronze {
    background: oklch(var(--flair-bronze) / 0.18);
  }
.dsd-chip-border-bronze {
    border-color: oklch(var(--flair-bronze) / 0.55);
  }
.dsd-chip-bg-copper {
    background: oklch(var(--flair-copper) / 0.18);
  }
.dsd-chip-border-copper {
    border-color: oklch(var(--flair-copper) / 0.55);
  }
.dsd-chip-bg-blue {
    background: oklch(var(--flair-blue) / 0.18);
  }
.dsd-chip-border-blue {
    border-color: oklch(var(--flair-blue) / 0.55);
  }
.dsd-chip-bg-purple {
    background: oklch(var(--flair-purple) / 0.18);
  }
.dsd-chip-border-purple {
    border-color: oklch(var(--flair-purple) / 0.55);
  }
.dsd-chip-bg-gold {
    background: oklch(var(--flair-gold) / 0.18);
  }
.dsd-chip-border-gold {
    border-color: oklch(var(--flair-gold) / 0.55);
  }
/* Rainbow flair — founder-exclusive. Gradient text + gradient dot.
     Overrides the solid-color pattern used by the other flairs because
     rainbow is a gradient, not a single color. --flair-current is set to
     a representative hue so the inherited text-shadow/dot box-shadow still
     render a sensible glow.

     IMPORTANT: FlairBadge applies BOTH `.dsd-flair-name` and `.dsd-flair-rainbow`
     to the SAME element (e.g. `<span class="dsd-flair-name dsd-flair-rainbow">`).
     Descendant selectors (`.dsd-flair-rainbow .dsd-flair-name`) would never
     match because there is no parent-child relationship — both classes live on
     one element. Use COMPOUND selectors (`.dsd-flair-name.dsd-flair-rainbow`)
     so the gradient + background-clip:text actually apply. */
.dsd-flair-rainbow {
    --flair-current: 0.75 0.2 285;
  }
.dsd-flair-name.dsd-flair-rainbow {
    background: linear-gradient(
      90deg,
      #ff0000,
      #ff7f00,
      #ffff00,
      #00ff00,
      #0000ff,
      #4b0082,
      #9400d3
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
.dsd-flair-dot.dsd-flair-rainbow {
    background: linear-gradient(
      90deg,
      #ff0000,
      #ff7f00,
      #ffff00,
      #00ff00,
      #0000ff,
      #4b0082,
      #9400d3
    );
  }
/* Flair picker swatch — in dashboard Buy Flair flow */
.dsd-flair-swatch {
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    border: 2px solid oklch(var(--border));
    transition: all 0.15s ease;
  }
.dsd-flair-swatch:hover {
    transform: scale(1.1);
  }
.dsd-flair-swatch-active {
    border-color: oklch(var(--foreground));
    box-shadow: 0 0 0 2px oklch(var(--flair-current, var(--dsd)) / 0.5);
  }
/* $DSD spend-sink action button — secondary gold outline */
.dsd-sink-btn {
    background: oklch(var(--secondary));
    color: oklch(var(--dsd));
    border: 1px solid oklch(var(--dsd) / 0.35);
    border-radius: var(--radius);
    transition: all 0.2s ease;
  }
.dsd-sink-btn:hover {
    background: oklch(var(--dsd) / 0.12);
    border-color: oklch(var(--dsd) / 0.7);
    box-shadow: 0 0 16px oklch(var(--dsd) / 0.18);
  }
.dsd-sink-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }
/* $DSD balance chip — dashboard, next to loyalty status */
.dsd-balance-chip {
    background: oklch(var(--dsd) / 0.1);
    border: 1px solid oklch(var(--dsd) / 0.35);
    border-radius: var(--radius);
  }
/* Shared admin/founder chip base — tight 0.25rem radius, micro-type, inset ring */
.ds-badge-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1rem 0.4rem;
    border-radius: var(--radius);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.65rem;
    line-height: 1;
    white-space: nowrap;
    vertical-align: middle;
  }
/* Founder — premium warm gold, distinct from flair-gold (name color) and rep-gold (tier chip) */
.ds-badge-founder {
    background: oklch(var(--founder) / 0.16);
    color: oklch(var(--founder));
    box-shadow: inset 0 0 0 1px oklch(var(--founder) / 0.55), 0 0 12px
      oklch(var(--founder) / 0.22);
  }
.ds-badge-founder-glyph {
    color: oklch(var(--founder));
    filter: drop-shadow(0 0 4px oklch(var(--founder) / 0.5));
  }
/* Admin — authoritative deep steel-blue, distinct from flair-azure (name color) */
.ds-badge-admin {
    background: oklch(var(--admin) / 0.16);
    color: oklch(var(--admin-foreground) / 0.95);
    box-shadow: inset 0 0 0 1px oklch(var(--admin) / 0.55), 0 0 12px
      oklch(var(--admin) / 0.22);
  }
.ds-badge-admin-glyph {
    color: oklch(0.78 0.14 255);
    filter: drop-shadow(0 0 4px oklch(var(--admin) / 0.5));
  }
/* Moderator — emerald green, distinct from admin steel-blue */
.ds-badge-moderator {
    background: oklch(var(--moderator) / 0.16);
    color: oklch(var(--moderator-foreground) / 0.95);
    box-shadow: inset 0 0 0 1px oklch(var(--moderator) / 0.55), 0 0 12px
      oklch(var(--moderator) / 0.22);
  }
.ds-badge-moderator-glyph {
    color: oklch(0.82 0.14 155);
    filter: drop-shadow(0 0 4px oklch(var(--moderator) / 0.5));
  }
/* Hardcap card — gold-bordered surface for dashboard + loyalty page */
.dsd-hardcap-card {
    background: oklch(var(--card));
    border: 1px solid oklch(var(--dsd) / 0.3);
    border-radius: var(--radius);
    box-shadow: 0 8px 24px -8px oklch(0.02 0.01 240 / 0.6), 0 0 0 1px
      oklch(var(--dsd) / 0.08);
  }
.dsd-hardcap-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: oklch(var(--foreground));
  }
/* Track — charcoal recessed bar */
.dsd-hardcap-track {
    background: oklch(var(--hardcap-track));
    border: 1px solid oklch(var(--border) / 0.6);
    border-radius: 9999px;
    overflow: hidden;
    position: relative;
  }
/* Fill — honey-gold with top-edge highlight + shimmer overlay */
.dsd-hardcap-fill {
    background: oklch(var(--hardcap-fill));
    background-image: linear-gradient(
      90deg,
      oklch(var(--hardcap-fill) / 0.85) 0%,
      oklch(var(--hardcap-fill-highlight)) 50%,
      oklch(var(--hardcap-fill) / 0.85) 100%
    );
    box-shadow: inset 0 1px 0 oklch(var(--hardcap-fill-highlight) / 0.6), 0 0
      12px oklch(var(--hardcap-fill) / 0.35);
    border-radius: 9999px;
    height: 100%;
    position: relative;
    overflow: hidden;
    transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  }
/* Shimmer sweep overlay on the fill — "live minted" feel */
.dsd-hardcap-fill::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      105deg,
      transparent 30%,
      oklch(0.95 0.08 85 / 0.35) 50%,
      transparent 70%
    );
    background-size: 200% 100%;
    animation: dsd-shimmer 2.5s linear infinite;
    pointer-events: none;
  }
/* Hardcap figures — site standard heading font (Geist via .ds-heading
     stack) for minted + percentage, matching the rest of the UI. */
.dsd-hardcap-minted {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    color: oklch(var(--dsd));
    letter-spacing: -0.02em;
  }
.dsd-hardcap-percent {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    color: oklch(var(--dsd));
    letter-spacing: -0.02em;
  }
.dsd-hardcap-cap {
    font-family: "General Sans", system-ui, sans-serif;
    color: oklch(var(--muted-foreground));
  }
/* Burned counter — true burns only (flairs, boosts, pins, bounties).
     Muted label + honey-gold figure so it reads as a supply stat, not a
     balance. */
.dsd-hardcap-burned-label {
    font-family: "General Sans", system-ui, sans-serif;
    color: oklch(var(--muted-foreground));
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
.dsd-hardcap-burned {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    color: oklch(var(--dsd) / 0.85);
    letter-spacing: -0.02em;
  }
/* Compact variant — inline on loyalty page, smaller track + figures */
.dsd-hardcap-compact .dsd-hardcap-track {
    height: 6px;
  }
.dsd-hardcap-compact .dsd-hardcap-minted,
  .dsd-hardcap-compact .dsd-hardcap-percent {
    font-size: 0.85rem;
  }
.dsd-hardcap-compact .dsd-hardcap-burned {
    font-size: 0.8rem;
  }
.dsd-hardcap-compact .dsd-hardcap-burned-label {
    font-size: 0.65rem;
  }
/* Globe wrapper — sits in the landing hero, transparent bg so the sphere
     reads against page black. Optional atmosphere glow ring via shadow.
     min-height safety net: the inline style={{ height }} (default 420) is the
     authoritative size, but a parent collapsing on remount could override it
     to 0 and the Canvas would mount into a zero-size box (black canvas). This
     floor guarantees the Canvas always has a non-zero box to render into. */
.ds-globe-stage {
    position: relative;
    background: transparent;
    min-height: 420px;
  }
/* Worldwide visitor counter — site standard heading font (Geist via
     .ds-heading stack) for the figure + muted label. Count-up animation
     is JS-driven; shimmer overlay gives the figure a "live" sweep while
     counting. */
.ds-globe-counter-figure {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: oklch(var(--globe-counter));
    text-shadow: 0 0 24px oklch(var(--globe-counter) / 0.25);
  }
.ds-globe-counter-label {
    font-family: "General Sans", system-ui, sans-serif;
    color: oklch(var(--globe-counter-muted));
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.7rem;
    font-weight: 600;
  }
/* Compact transparency stat panel — sits to the RIGHT of the globe on the
     landing hero, stacked vertically (one stat per row). Each stat is a small
     figure (Geist heading font) + muted label. Figures use tabular-nums so
     count-up animations don't reflow the column. Orange accent on the figures
     + a subtle recessed panel background give the block a clean, highlighted
     treatment that reads as a polished stat surface, not a flat row. */
.ds-stat-row {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: oklch(0.12 0.01 240 / 0.7);
    border: 1px solid oklch(var(--primary) / 0.22);
    border-radius: calc(var(--radius) + 2px);
    box-shadow: 0 0 0 1px oklch(var(--primary) / 0.06), 0 8px 24px -10px
      oklch(0.02 0.01 240 / 0.6);
    padding: 0.5rem 0.25rem;
    backdrop-filter: blur(6px);
  }
.ds-stat-row-figure {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: oklch(var(--primary));
    text-shadow: 0 0 18px oklch(var(--primary) / 0.28);
    font-variant-numeric: tabular-nums;
    line-height: 1;
  }
.ds-stat-row-label {
    font-family: "General Sans", system-ui, sans-serif;
    color: oklch(var(--muted-foreground));
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.625rem;
    font-weight: 600;
    line-height: 1.2;
    margin-top: 0.25rem;
  }
.ds-stat-row-divider {
    border-color: oklch(var(--primary) / 0.18);
  }
/* Country popover — reuses popover bg, orange-tinted border for globe context.
     Country name in Bricolage display, member count in Fraunces italic. */
.ds-globe-popover {
    background: oklch(var(--popover));
    border: 1px solid oklch(var(--globe-popover-border) / 0.45);
    border-radius: var(--radius);
    box-shadow: 0 12px 32px oklch(0.02 0.01 240 / 0.7), 0 0 0 1px
      oklch(var(--globe-popover-border) / 0.12);
    pointer-events: none;
  }
.ds-globe-popover-country {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: oklch(var(--foreground));
  }
.ds-globe-popover-count {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    color: oklch(var(--globe-counter));
  }
/* Idle hint — small caption that fades in when the globe is auto-rotating,
      fades out on interaction. */
.ds-globe-hint {
    font-family: "General Sans", system-ui, sans-serif;
    color: oklch(var(--muted-foreground) / 0.7);
    font-size: 0.7rem;
    letter-spacing: 0.04em;
  }
/* Mobile rotate-mode badge — small pill shown over the globe on touch
     devices when one-finger rotate is enabled. Semi-transparent primary
     background, primary-foreground text, rounded, pointer-events-none so
     it never blocks globe interaction. Positioned top-center of the stage. */
.ds-globe-rotate-badge {
    position: absolute;
    top: 0.5rem;
    left: 50%;
    transform: translateX(-50%);
    background: oklch(var(--primary) / 0.9);
    color: oklch(var(--primary-foreground));
    padding: 0.25rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    pointer-events: none;
    z-index: 10;
    white-space: nowrap;
  }
/* Breadcrumb trail — Forum › Category › Topic. Chevron separators, current
     crumb in orange, ancestors in muted. Used on Topic List + Thread View. */
.ds-forum-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.25rem;
    font-size: 0.85rem;
    color: oklch(var(--muted-foreground));
  }
.ds-forum-breadcrumb a {
    color: oklch(var(--muted-foreground));
    transition: color 0.15s ease;
  }
.ds-forum-breadcrumb a:hover {
    color: oklch(var(--foreground));
  }
.ds-forum-breadcrumb-sep {
    color: oklch(var(--muted-foreground) / 0.5);
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
.ds-forum-breadcrumb-current {
    color: oklch(var(--primary));
    font-weight: 600;
  }
/* Single-line breadcrumb — nowrap flex so the trail stays on one row and
     hands truncation off to the truncate class on the current crumb. Used on
     Thread View where the topic title is the last segment and is the most
     likely to overflow. Pairs with .ds-forum-breadcrumb-truncate on the
     current crumb and .ds-forum-breadcrumb-crumb on inline ancestor links. */
.ds-forum-breadcrumb-single {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    overflow: hidden;
    white-space: nowrap;
  }
/* Inline crumb — ancestor link inside a single-line breadcrumb. Keeps the
     shared .ds-forum-breadcrumb a color/hover but pins display to inline so
     nowrap on the parent holds. */
.ds-forum-breadcrumb-crumb {
    display: inline;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
/* Truncate target — the current (last) crumb in a single-line breadcrumb.
     flex: 1 + min-width: 0 lets it shrink; max-width caps it so very long
     titles ellipsize before pushing ancestors off-row. */
.ds-forum-breadcrumb-truncate {
    flex: 1 1 0%;
    min-width: 0;
    max-width: 40rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
/* Topic List table — fixed-layout table for the Topic List page so the
     topic / created / stats / last-post columns keep stable widths. Pairs
     with the colgroup-driven width hints below; the table reuses the shared
     .ds-forum-table shell for borders/zebra and only overrides layout. */
.ds-topic-table {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
  }
.ds-topic-col-topic {
    width: auto;
  }
.ds-topic-col-created {
    width: 200px;
  }
.ds-topic-col-stats {
    width: 120px;
  }
.ds-topic-col-lastpost {
    width: 200px;
  }
.ds-topic-cell-topic {
    vertical-align: middle;
    padding: 0.75rem;
    overflow: hidden;
  }
.ds-topic-cell-created {
    vertical-align: middle;
    padding: 0.75rem;
    white-space: nowrap;
  }
.ds-topic-cell-stats {
    vertical-align: middle;
    padding: 0.75rem;
    text-align: center;
    white-space: nowrap;
  }
.ds-topic-cell-lastpost {
    vertical-align: middle;
    padding: 0.75rem;
    white-space: nowrap;
  }
.ds-topic-meta-time {
    font-size: 0.75rem;
    color: var(--muted-foreground);
  }
.ds-topic-empty-cell {
    text-align: center;
    color: var(--muted-foreground);
    font-style: italic;
  }
/* Section group header — uppercase label above a category group on the
     Forum Index (e.g. "MOTODRIVE"). Bricolage display, orange-tinted. */
.ds-forum-section-head {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: oklch(var(--primary));
    font-size: 0.9rem;
  }
/* Shared table shell — Forum Index category table + Topic List topic
     table. Charcoal header row, zebra-striped body rows, thin borders.
     On mobile (<768px) the table collapses to stacked cards via the
     .ds-forum-table-stacked modifier so there is no horizontal scroll. */
.ds-forum-table {
    width: 100%;
    border-collapse: collapse;
    background: oklch(var(--card));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    overflow: hidden;
  }
.ds-forum-table thead th {
    background: oklch(0.1 0.01 240);
    color: oklch(var(--muted-foreground));
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.7rem;
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid oklch(var(--border));
    white-space: nowrap;
  }
.ds-forum-table tbody tr {
    border-bottom: 1px solid oklch(var(--border) / 0.6);
    transition: background 0.15s ease;
  }
.ds-forum-table tbody tr:last-child {
    border-bottom: none;
  }
.ds-forum-table tbody tr:hover {
    background: oklch(var(--primary) / 0.05);
  }
/* Zebra striping — every other body row gets a touch more surface so
     long category/topic lists stay scannable. */
.ds-forum-table tbody tr:nth-child(even) {
    background: oklch(0.12 0.01 240 / 0.5);
  }
.ds-forum-table tbody tr:nth-child(even):hover {
    background: oklch(var(--primary) / 0.07);
  }
.ds-forum-table td {
    padding: 0.75rem;
    vertical-align: middle;
    color: oklch(var(--foreground));
  }
/* Forum Index category row — icon + title + description (left col),
     topics/posts counts (mid), last-post avatar + user + time (right).
     Numeric stats use Geist tabular-nums via the inline font-family. */
.ds-cat-icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius);
    background: oklch(var(--primary) / 0.12);
    border: 1px solid oklch(var(--primary) / 0.3);
    color: oklch(var(--primary));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
.ds-cat-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: oklch(var(--foreground));
  }
.ds-cat-title:hover {
    color: oklch(var(--primary));
  }
.ds-cat-desc {
    color: oklch(var(--muted-foreground));
    font-size: 0.8rem;
  }
.ds-cat-stat {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: oklch(var(--foreground));
  }
.ds-cat-stat-label {
    color: oklch(var(--muted-foreground));
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
.ds-cat-lastpost {
    color: oklch(var(--muted-foreground));
    font-size: 0.8rem;
  }
.ds-cat-lastpost-user {
    color: oklch(0.85 0.14 40);
    font-weight: 600;
  }
/* Topic List row — title (with optional pinned glyph + mini-pagination),
     created-by, replies, views, last-post. Pinned rows get an orange left
     accent bar and surface above unpinned rows. */
.ds-topic-row {
    /* marker — body row in the topic table. Hover handled by .ds-forum-table. */
  }
.ds-topic-row-pinned {
    background: oklch(var(--primary) / 0.06) !important;
    box-shadow: inset 3px 0 0 oklch(var(--primary));
  }
.ds-topic-row-pinned:hover {
    background: oklch(var(--primary) / 0.1) !important;
  }
.ds-topic-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: oklch(var(--foreground));
  }
.ds-topic-title:hover {
    color: oklch(var(--primary));
  }
.ds-topic-pin-glyph {
    color: oklch(var(--primary));
    flex-shrink: 0;
  }
.ds-topic-meta {
    color: oklch(var(--muted-foreground));
    font-size: 0.78rem;
  }
.ds-topic-meta-user {
    color: oklch(0.85 0.14 40);
    font-weight: 600;
  }
/* Mini-pagination — inline "1 2 3 … Next" pills that appear beside a
     topic title in the Topic List when a thread spans multiple pages.
     Small, orange-tinted, non-blocking. Distinct from full page pagination. */
.ds-mini-pagination {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    font-size: 0.7rem;
  }
.ds-mini-pagination a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.3rem;
    border-radius: 0.2rem;
    background: oklch(var(--secondary));
    color: oklch(var(--muted-foreground));
    border: 1px solid oklch(var(--border) / 0.6);
    transition: all 0.15s ease;
  }
.ds-mini-pagination a:hover {
    background: oklch(var(--primary) / 0.16);
    color: oklch(var(--primary));
    border-color: oklch(var(--primary) / 0.5);
  }
.ds-mini-pagination-sep {
    color: oklch(var(--muted-foreground) / 0.5);
    padding: 0 0.1rem;
  }
/* Full page pagination — top + bottom of Thread View (and Topic List
     footer when the list itself paginates). Current page solid orange,
     siblings charcoal, prev/next as labeled arrows. */
.ds-forum-pagination {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: wrap;
  }
.ds-forum-pagination a,
  .ds-forum-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.5rem;
    border-radius: var(--radius);
    background: oklch(var(--secondary));
    color: oklch(var(--muted-foreground));
    border: 1px solid oklch(var(--border));
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-size: 0.85rem;
    transition: all 0.15s ease;
  }
.ds-forum-pagination a:hover {
    background: oklch(var(--primary) / 0.16);
    color: oklch(var(--primary));
    border-color: oklch(var(--primary) / 0.5);
  }
.ds-forum-pagination-current {
    background: oklch(var(--primary)) !important;
    color: oklch(var(--primary-foreground)) !important;
    border-color: oklch(var(--primary)) !important;
    box-shadow: 0 0 12px oklch(var(--primary) / 0.3);
  }
.ds-forum-pagination-ellipsis {
    background: transparent !important;
    border: none !important;
    color: oklch(var(--muted-foreground) / 0.6) !important;
  }
/* Thread View — title heading at the top of the thread, below breadcrumb. */
.ds-thread-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: oklch(var(--foreground));
    line-height: 1.15;
  }
/* Post card — the shell of a single post in the Thread View. Two-column
     on desktop (author sidebar left, content right), stacked on mobile.
     Reuses .ds-author-sidebar for the left column. */
.ds-post-card {
    display: flex;
    align-items: stretch;
    background: oklch(var(--card));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    overflow: hidden;
  }
.ds-post-card + .ds-post-card {
    margin-top: 1rem;
  }
/* Post meta row — timestamp + edited label, anchored TOP-RIGHT of the
     content column. Small muted span (relative time via timeAgo). The
     edited label sits beside it. No heavy separator — the card stays
     tight and readable. */
.ds-post-meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
    color: oklch(var(--muted-foreground));
    font-size: 0.75rem;
    margin-bottom: 0.5rem;
  }
.ds-post-meta-time {
    color: oklch(var(--muted-foreground) / 0.85);
    font-size: 0.75rem;
  }
/* Post action bar — vote + quote + tip + (optional) subscribe. Sits at
     the bottom of the content column. Reuses .ds-vote, .ds-tip-btn. */
.ds-post-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    border-top: 1px solid oklch(var(--border) / 0.5);
    padding-top: 0.6rem;
    margin-top: 0.75rem;
  }
.ds-post-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.6rem;
    border-radius: var(--radius);
    background: oklch(var(--secondary));
    color: oklch(var(--muted-foreground));
    border: 1px solid oklch(var(--border));
    font-size: 0.8rem;
    font-weight: 600;
    transition: all 0.15s ease;
  }
.ds-post-action-btn:hover {
    background: oklch(var(--primary) / 0.12);
    color: oklch(var(--primary));
    border-color: oklch(var(--primary) / 0.4);
  }
/* Forum-scoped search input — sits at the top of the Forum Index. */
.ds-forum-search {
    background: oklch(var(--input));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    color: oklch(var(--foreground));
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }
.ds-forum-search:focus {
    border-color: oklch(var(--primary));
    box-shadow: 0 0 0 2px oklch(var(--primary) / 0.25);
    outline: none;
  }
.ds-forum-search::-moz-placeholder {
    color: oklch(var(--muted-foreground) / 0.7);
  }
.ds-forum-search::placeholder {
    color: oklch(var(--muted-foreground) / 0.7);
  }
/* "Start New Topic" CTA — orange primary button, top-right of Topic List. */
.ds-forum-new-topic {
    background: oklch(var(--primary));
    color: oklch(var(--primary-foreground));
    border-radius: var(--radius);
    font-weight: 600;
    transition: all 0.2s ease;
  }
.ds-forum-new-topic:hover {
    box-shadow: 0 0 20px oklch(var(--primary) / 0.35);
    filter: brightness(1.05);
  }
/* ===== MOBILE FORUM TABLE COLLAPSE =====
     Below 768px the Forum Index + Topic List tables collapse to stacked
     cards so there is no horizontal scroll. Each row becomes a card with
     the title/description on top and the stats + last-post in a wrapped
     row beneath. Header row is hidden on mobile. Touch targets stay >=44px
     via the global mobile rule. */
@media (max-width: 768px) {
    .ds-forum-table thead {
      display: none;
    }
    .ds-forum-table,
    .ds-forum-table tbody,
    .ds-forum-table tr,
    .ds-forum-table td {
      display: block;
      width: 100%;
    }
    .ds-forum-table tbody tr {
      padding: 0.75rem;
      margin-bottom: 0.5rem;
      border: 1px solid oklch(var(--border));
      border-radius: var(--radius);
      background: oklch(var(--card));
    }
    .ds-forum-table tbody tr:nth-child(even) {
      background: oklch(var(--card));
    }
    .ds-forum-table td {
      padding: 0.25rem 0;
      border: none;
      text-align: left;
    }
    .ds-forum-table td::before {
      content: attr(data-label);
      display: inline-block;
      width: 5rem;
      color: oklch(var(--muted-foreground));
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      font-weight: 600;
    }
    /* Pinned topic keeps its orange left accent in stacked form. */
    .ds-forum-table .ds-topic-row-pinned {
      box-shadow: inset 3px 0 0 oklch(var(--primary));
    }
    /* Post card stacks — author sidebar becomes a horizontal strip above
       the post body, reusing .ds-author-sidebar's existing collapse rule. */
    .ds-post-card {
      display: block;
    }
  }
/* ===== FORUM INDEX DIV-TABLE LAYOUT (ForumIndexPage) =====
     ForumIndexPage renders the category table as a div-based grid (role=table)
     rather than a real <table> so the layout can use CSS grid columns and
     collapse to stacked cards on mobile with data-label micro-labels. These
     classes complement the shared .ds-forum-table shell (which targets real
     <table> elements used by TopicListPage). Dark theme + orange accents. */
.ds-forum-page {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 0.75rem 2rem;
    max-width: 100%;
  }
/* Div-table shell — grid columns: icon | title | topics | posts | lastpost.
     On mobile (<768px) collapses to stacked cards via the rule below. */
.ds-forum-table[role="table"] {
    display: grid;
    grid-template-columns: minmax(2.5rem, auto) minmax(0, 1fr) 5rem 5rem minmax(
        12rem,
        1fr
      );
    background: oklch(var(--card));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    overflow: hidden;
  }
.ds-cat-row {
    display: contents;
  }
.ds-cat-row-head > .ds-cat-cell {
    background: oklch(0.1 0.01 240);
    color: oklch(var(--muted-foreground));
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.7rem;
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid oklch(var(--border));
    white-space: nowrap;
  }
.ds-cat-cell {
    padding: 0.75rem;
    border-bottom: 1px solid oklch(var(--border) / 0.6);
    color: oklch(var(--foreground));
    display: flex;
    align-items: center;
    min-width: 0;
  }
/* Body rows get zebra striping + hover. Because rows use display:contents,
     the striping is applied to the cells of every other body row via the
     :nth-child of the grid. We approximate by striping cells whose row index
     is even — the simplest stable approach for a contents-based grid. */
.ds-cat-row:not(.ds-cat-row-head) .ds-cat-cell {
    background: oklch(var(--card));
    transition: background 0.15s ease;
  }
.ds-cat-row:not(.ds-cat-row-head):hover .ds-cat-cell {
    background: oklch(var(--primary) / 0.05);
  }
/* Category icon glyph — single uppercase letter inside the icon box.
     Reuses .ds-cat-icon for the box; this styles the letter. */
.ds-cat-icon-glyph {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1;
    color: oklch(var(--primary));
  }
/* Category title link — clickable heading inside the title cell. */
.ds-cat-title-link {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: oklch(var(--foreground));
    display: inline-block;
    transition: color 0.15s ease;
  }
.ds-cat-title-link:hover {
    color: oklch(var(--primary));
    text-decoration: underline;
  }
/* Stat cell — value + label stacked. Value uses Geist tabular-nums. */
.ds-cat-stat-value {
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: oklch(var(--foreground));
    line-height: 1;
  }
/* Last-post cell — avatar + username + relative time. */
.ds-cat-lastpost-avatar {
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    -o-object-fit: cover;
       object-fit: cover;
    flex-shrink: 0;
    border: 1px solid oklch(var(--border) / 0.6);
  }
.ds-cat-lastpost-initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: oklch(var(--secondary));
    color: oklch(var(--muted-foreground));
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 700;
    font-size: 0.7rem;
  }
.ds-cat-lastpost-meta {
    display: flex;
    flex-direction: column;
    min-width: 0;
    margin-left: 0.5rem;
  }
.ds-cat-lastpost-username {
    color: oklch(0.85 0.14 40);
    font-weight: 600;
    font-size: 0.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
.ds-cat-lastpost-time {
    color: oklch(var(--muted-foreground));
    font-size: 0.72rem;
  }
.ds-cat-lastpost-empty {
    color: oklch(var(--muted-foreground) / 0.7);
    font-size: 0.8rem;
    font-style: italic;
  }
/* Forum Index search bar — label + field + icon + input + submit. */
.ds-forum-search-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
.ds-forum-search-field {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
  }
.ds-forum-search-icon {
    position: absolute;
    left: 0.6rem;
    width: 1rem;
    height: 1rem;
    color: oklch(var(--muted-foreground));
    pointer-events: none;
    /* Magnifier glyph via inline SVG mask so no extra asset is needed. */
    background-color: oklch(var(--muted-foreground));
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'/><path d='m21 21-4.3-4.3'/></svg>")
      center / contain no-repeat;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'/><path d='m21 21-4.3-4.3'/></svg>")
      center / contain no-repeat;
  }
.ds-forum-search-input {
    flex: 1;
    width: 100%;
    background: transparent;
    border: none;
    color: oklch(var(--foreground));
    padding: 0.6rem 0.75rem 0.6rem 2rem;
    font-size: 0.9rem;
    outline: none;
  }
.ds-forum-search-input::-moz-placeholder {
    color: oklch(var(--muted-foreground) / 0.7);
  }
.ds-forum-search-input::placeholder {
    color: oklch(var(--muted-foreground) / 0.7);
  }
.ds-forum-search-submit {
    background: oklch(var(--primary));
    color: oklch(var(--primary-foreground));
    border: none;
    border-radius: 0 var(--radius) var(--radius) 0;
    padding: 0.6rem 1rem;
    font-weight: 600;
    font-size: 0.85rem;
    transition: filter 0.15s ease, box-shadow 0.15s ease;
  }
.ds-forum-search-submit:hover {
    filter: brightness(1.05);
    box-shadow: 0 0 16px oklch(var(--primary) / 0.3);
  }
/* Forum Index section header — title + subtitle. */
.ds-forum-section-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: oklch(var(--foreground));
    font-size: 1.5rem;
    line-height: 1.15;
  }
.ds-forum-section-sub {
    color: oklch(var(--muted-foreground));
    font-size: 0.85rem;
    margin-top: 0.25rem;
  }
/* Empty state — Forum Index when no categories are seeded. */
.ds-forum-empty {
    text-align: center;
    padding: 2.5rem 1rem;
    border: 1px dashed oklch(var(--border));
    border-radius: var(--radius);
    background: oklch(var(--card));
  }
.ds-forum-empty-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    color: oklch(var(--foreground));
    font-size: 1.1rem;
    margin-bottom: 0.25rem;
  }
.ds-forum-empty-desc {
    color: oklch(var(--muted-foreground));
    font-size: 0.85rem;
  }
/* Skeleton loaders — Forum Index loading + Thread View loading. */
.ds-skeleton {
    background: oklch(0.18 0.01 240);
    border-radius: var(--radius);
    display: block;
  }
.ds-skeleton-line {
    height: 0.85rem;
    width: 100%;
    margin-top: 0.4rem;
  }
.ds-skeleton-line-sm {
    height: 0.65rem;
    width: 60%;
  }
.ds-skeleton-line-lg {
    height: 1rem;
    width: 80%;
  }
.ds-skeleton-title {
    height: 1.5rem;
    width: 50%;
    margin-bottom: 0.75rem;
  }
.ds-skeleton-blob {
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    flex-shrink: 0;
  }
.ds-skeleton-blob-sm {
    width: 1.5rem;
    height: 1.5rem;
  }
/* Subtle shimmer animation for all skeleton variants. */
.ds-skeleton,
  .ds-skeleton-line,
  .ds-skeleton-blob {
    background: linear-gradient(
      90deg,
      oklch(0.18 0.01 240) 0%,
      oklch(0.24 0.01 240) 50%,
      oklch(0.18 0.01 240) 100%
    );
    background-size: 200% 100%;
    animation: ds-skeleton-shimmer 1.6s ease-in-out infinite;
  }
@keyframes ds-skeleton-shimmer {
    0% {
      background-position: 200% 0;
    }
    100% {
      background-position: -200% 0;
    }
  }
/* ===== THREAD VIEW EXTRAS ===== */
.ds-thread-view {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 0.75rem 2rem;
    max-width: 100%;
  }
.ds-thread-header {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex-wrap: wrap;
  }
.ds-thread-posts {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
.ds-subscribe-btn {
    background: oklch(var(--secondary));
    color: oklch(var(--muted-foreground));
    border: 1px solid oklch(var(--border));
    border-radius: 9999px;
    padding: 0.4rem 0.75rem;
    font-size: 1.1rem;
    line-height: 1;
    transition: all 0.15s ease;
    flex-shrink: 0;
  }
.ds-subscribe-btn:hover {
    background: oklch(var(--primary) / 0.12);
    border-color: oklch(var(--primary) / 0.4);
  }
/* Post card two-column layout — author sidebar left, body right.
     LEFT: fixed 160px width, slightly darker background than the card body
     (a touch lighter dark than the card so it reads as a recessed sidebar,
     not a hole), right border separating it from the content. RIGHT: flex
     content area laid out as a column so the action bar pins to the BOTTOM
     of the card while the date sits TOP-RIGHT and the RichBody fills the
     middle. min-width:0 lets long body content truncate/word-break instead
     of blowing the flex row. */
.ds-post-author-col {
    flex: 0 0 160px;
    width: 160px;
    max-width: 160px;
    min-width: 0;
    padding: 0;
    background: oklch(0.1 0.01 240);
    border-right: 1px solid oklch(var(--border) / 0.5);
  }
.ds-post-body-col {
    flex: 1 1 0%;
    min-width: 0;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0;
  }
/* Action bar variants — desktop inline row, mobile split row + more sheet. */
.ds-post-actions-desktop {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
  }
.ds-post-actions-sheet {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.5rem 0;
  }
.ds-post-actions-sheet .ds-post-action-btn {
    width: 100%;
    justify-content: flex-start;
    min-height: 44px;
  }
.ds-post-more {
    font-size: 1rem;
    letter-spacing: 0.05em;
    padding: 0.3rem 0.6rem;
  }
/* Reply dock textarea — full content width, min-height 120px so it reads
     as a real composer (not a single-line input). max-height keeps very
     long drafts from pushing the dock off-screen; vertical resize lets the
     author grow it manually. */
.ds-reply-textarea {
    width: 100%;
    min-height: 120px;
    max-height: 16rem;
    resize: vertical;
    background: oklch(var(--input));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    color: oklch(var(--foreground));
    padding: 0.6rem 0.75rem;
    font-family: inherit;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }
.ds-reply-textarea:focus {
    border-color: oklch(var(--primary));
    box-shadow: 0 0 0 2px oklch(var(--primary) / 0.25);
  }
.ds-reply-submit {
    background: oklch(var(--primary));
    color: oklch(var(--primary-foreground));
    border: none;
    border-radius: var(--radius);
    padding: 0.6rem 1.25rem;
    font-weight: 600;
    font-size: 0.9rem;
    transition: filter 0.15s ease, box-shadow 0.15s ease;
    flex-shrink: 0;
  }
.ds-reply-submit:hover:not(:disabled) {
    filter: brightness(1.05);
    box-shadow: 0 0 16px oklch(var(--primary) / 0.3);
  }
.ds-reply-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }
/* Edit composer wrapper — sits inline above the reply dock when editing. */
.ds-edit-composer {
    margin-top: 1rem;
    padding: 1rem;
    background: oklch(var(--card));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
  }
/* Thread loading + error states. */
.ds-forum-loading {
    padding: 2rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: 32rem;
  }
.ds-forum-error {
    text-align: center;
    padding: 3rem 1rem;
    color: oklch(var(--muted-foreground));
  }
.ds-forum-error p {
    margin-bottom: 1rem;
  }
.ds-forum-back {
    display: inline-flex;
    align-items: center;
    background: oklch(var(--secondary));
    color: oklch(var(--foreground));
    border: 1px solid oklch(var(--border));
    border-radius: var(--radius);
    padding: 0.5rem 1rem;
    font-weight: 600;
    font-size: 0.85rem;
    transition: all 0.15s ease;
  }
.ds-forum-back:hover {
    background: oklch(var(--primary) / 0.12);
    border-color: oklch(var(--primary) / 0.4);
    color: oklch(var(--primary));
  }
/* Pagination button — used by Thread View (Topic List reuses the shared
     .ds-forum-pagination a/span rules). */
.ds-forum-pagination-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.5rem;
    border-radius: var(--radius);
    background: oklch(var(--secondary));
    color: oklch(var(--muted-foreground));
    border: 1px solid oklch(var(--border));
    font-family: "Geist", system-ui, sans-serif;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-size: 0.85rem;
    transition: all 0.15s ease;
  }
.ds-forum-pagination-btn:hover:not(:disabled) {
    background: oklch(var(--primary) / 0.16);
    color: oklch(var(--primary));
    border-color: oklch(var(--primary) / 0.5);
  }
.ds-forum-pagination-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }
/* Vote control like/dislike button variants — VoteControl.tsx. The shared
     .ds-vote-btn base handles the default state; these add the active glow. */
.ds-vote-like,
  .ds-vote-dislike {
    color: oklch(var(--muted-foreground));
  }
.ds-vote-like-active {
    color: oklch(var(--success));
    filter: drop-shadow(0 0 6px oklch(var(--success) / 0.4));
  }
.ds-vote-dislike-active {
    color: oklch(var(--destructive));
    filter: drop-shadow(0 0 6px oklch(var(--destructive) / 0.4));
  }
/* ===== MOBILE COLLAPSE — FORUM INDEX DIV-TABLE =====
     Below 768px the div-based category grid collapses to stacked cards so
     there is no horizontal scroll. Each row becomes a card with data-label
     micro-labels. Header row is hidden. Touch targets stay >=44px. */
@media (max-width: 768px) {
    .ds-forum-table[role="table"] {
      display: block;
    }
    .ds-cat-row {
      display: block;
    }
    .ds-cat-row-head {
      display: none;
    }
    .ds-cat-row:not(.ds-cat-row-head) {
      padding: 0.75rem;
      margin-bottom: 0.5rem;
      border: 1px solid oklch(var(--border));
      border-radius: var(--radius);
      background: oklch(var(--card));
    }
    .ds-cat-cell {
      display: flex;
      align-items: flex-start;
      gap: 0.5rem;
      padding: 0.35rem 0;
      border-bottom: none;
      width: 100%;
    }
    .ds-cat-cell::before {
      content: attr(data-label);
      display: inline-block;
      width: 5rem;
      flex-shrink: 0;
      color: oklch(var(--muted-foreground));
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      font-weight: 600;
    }
    /* Icon cell — hide the data-label since the glyph is self-explanatory. */
    .ds-cat-cell.ds-cat-icon::before {
      display: none;
    }
    .ds-cat-cell.ds-cat-icon {
      padding-bottom: 0.5rem;
    }
    /* Title cell — full width, no micro-label needed. */
    .ds-cat-cell.ds-cat-title {
      flex-direction: column;
      align-items: flex-start;
      padding-top: 0;
    }
    .ds-cat-cell.ds-cat-title::before {
      display: none;
    }
    /* Stat cells — value + label inline. */
    .ds-cat-cell.ds-cat-stat {
      gap: 0.4rem;
    }
    .ds-cat-cell.ds-cat-stat .ds-cat-stat-label {
      font-size: 0.65rem;
    }
    /* Last-post cell — full width row. */
    .ds-cat-cell.ds-cat-lastpost {
      padding-top: 0.5rem;
      border-top: 1px solid oklch(var(--border) / 0.4);
    }

    /* Thread View post card stacks — author sidebar becomes a horizontal
       strip above the body. */
    .ds-post-card {
      display: block;
    }
    .ds-post-author-col {
      border-right: none;
      border-bottom: 1px solid oklch(var(--border) / 0.5);
      padding: 0.6rem 0.75rem;
    }
    .ds-post-body-col {
      padding: 0.75rem;
    }
    /* Reply dock stacks vertically on narrow viewports. */
    .ds-reply-dock {
      flex-direction: column;
      gap: 0.5rem;
    }
    /* Breadcrumb truncation tightens on mobile so long topic titles
       ellipsize earlier and ancestor crumbs stay visible. */
    .ds-forum-breadcrumb-truncate {
      max-width: 12rem;
    }
    /* Thread View author sidebar avatar shrinks on mobile so the
       horizontal strip stays compact. */
    .ds-author-sidebar img,
    .ds-author-sidebar .ds-avatar {
      width: 2rem;
      height: 2rem;
    }
    /* Topic List table collapses to stacked cards mirroring the
       .ds-forum-table mobile pattern: each tr becomes a card, each td
       becomes a block with a data-label::before micro-label, and the
       colgroup + thead are hidden. */
    .ds-topic-table {
      display: block;
    }
    .ds-topic-table colgroup,
    .ds-topic-table thead {
      display: none;
    }
    .ds-topic-table tbody,
    .ds-topic-table tr {
      display: block;
    }
    .ds-topic-table tr {
      padding: 0.75rem;
      margin-bottom: 0.5rem;
      border: 1px solid oklch(var(--border));
      border-radius: var(--radius);
      background: oklch(var(--card));
    }
    .ds-topic-table td {
      display: block;
      padding: 0.35rem 0;
      border-bottom: none;
      width: 100%;
    }
    .ds-topic-table td::before {
      content: attr(data-label);
      display: inline-block;
      width: 5rem;
      flex-shrink: 0;
      color: oklch(var(--muted-foreground));
      font-size: 0.7rem;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      font-weight: 600;
    }
    /* Topic cell — full width, no micro-label needed. */
    .ds-topic-table .ds-topic-cell-topic {
      flex-direction: column;
      align-items: flex-start;
      padding-top: 0;
    }
    .ds-topic-table .ds-topic-cell-topic::before {
      display: none;
    }
    /* Stats cell — center alignment resets to block on mobile. */
    .ds-topic-table .ds-topic-cell-stats {
      text-align: left;
    }
  }
/* Safe-area inset utilities — apply to sticky header/footer edges so
     content is not hidden behind the notch or home indicator. */
.safe-top {
    padding-top: env(safe-area-inset-top);
  }
.safe-bottom {
    padding-bottom: env(safe-area-inset-bottom);
  }
.safe-left {
    padding-left: env(safe-area-inset-left);
  }
.safe-right {
    padding-right: env(safe-area-inset-right);
  }
/* Combined safe-area — all four insets at once. */
.safe-area {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
/* iOS HIG compliant touch target — minimum 44x44px hit area for
     interactive controls on mobile. */
.touch-target {
    min-height: 44px;
    min-width: 44px;
  }
/* Fluid hero typography — clamp()-based scaling so the hero headline grows
     smoothly between mobile and desktop. Min 2.2rem (35.2px) on mobile, 6vw
     preferred, max 4.5rem (72px). Tight tracking + line-height keep the
     headline compact. The headline shrinks to fit via clamp and is never
     truncated or ellipsized. */
.ds-hero-title {
    font-family: "General Sans", system-ui, sans-serif;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.05;
    font-size: clamp(2.2rem, 6vw, 4.5rem);
  }
/* Fluid sub-hero / section headline — smaller clamp range for supporting
     headlines. Min 1.5rem (24px), ideal 2.5rem, max 3rem. */
.ds-section-title {
    font-family: "Bricolage Grotesque", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
    font-size: clamp(1.5rem, 3vw + 1rem, 3rem);
  }
.\[--cell-size\:--spacing\(8\)\] {
  --cell-size: var(--spacing(8));
}
.\[-webkit-overflow-scrolling\:touch\] {
  -webkit-overflow-scrolling: touch;
}

/* ===== FONT FACES ===== */

@font-face {
  font-family: "General Sans";
  src: url("/assets/fonts/GeneralSans.woff2") format("woff2");
  font-weight: 200 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/assets/fonts/BricolageGrotesque.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fraunces";
  src: url("/assets/fonts/Fraunces.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ===== CUSTOM SCROLLBAR ===== */

/* ===== FORUM ENHANCEMENT COMPONENTS (six new elements) ===== */

/* ===== DIRTSWAP UTILITIES ===== */

/* ===== $DSD ECONOMY COMPONENTS ===== */

/* ===== ADMIN / FOUNDER BADGE CHIPS ===== */

/* ===== $DSD HARDCAP PROGRESS BAR ===== */

/* ===== MEMBER GLOBE ===== */

/* ===== FORUM THREE-LEVEL STRUCTURE (VitalMX/phpBB reshape) =====
   Additive forum-structure utilities for the reshaped three-level forum
   (Forum Index → Topic List → Thread View). Modeled on VitalMX/phpBB table
   mechanics but rendered in DirtSwap's dark/orange industrial theme.
   Reuses existing .ds-author-sidebar, .ds-quote, .ds-vote, .ds-tip-btn,
   .ds-edited-label, .ds-reply-dock, .ds-card-hover, .ds-heading, and the
   safe-area / touch-target utilities. No existing tokens, fonts, branding,
   hero, or non-forum classes are touched. */

/* ===== MOBILE / iOS SAFE-AREA POLISH =====
   iPhone iOS Safari polish pass. These utilities let the sticky header and
   footer respect the notch (top) and home indicator (bottom), and prevent
   horizontal scroll jitter on mobile. No colors, fonts, or desktop layout
   are touched — additive only. env(safe-area-inset-*) resolves to 0 on
   devices/browsers without a notch, so these are no-ops on desktop. */

/* Global mobile polish — applied to html/body directly (not in @layer) so
   they always win over base resets without fighting Tailwind's layer order.
   These are additive mobile enhancements; desktop layout is unchanged. */
html {
  overflow-x: hidden;
  max-width: 100vw;
  scroll-behavior: smooth;
  /* Momentum scrolling on iOS for the document scroll. */
  -webkit-overflow-scrolling: touch;
  /* Use the dynamic viewport height unit so the layout fills the visible
     viewport on mobile browsers with collapsing URL/home bars. 100dvh
     resolves to the smallest visible viewport, preventing content from
     being hidden behind chrome on iOS Safari. */
  height: 100%;
}

body {
  overflow-x: hidden;
  max-width: 100vw;
  min-height: 100dvh;
  /* Minimum 16px body text — prevents iOS Safari from auto-zooming on
     focused form inputs and meets legibility baselines on mobile. */
  font-size: 16px;
}

/* Form inputs, textareas, and selects must be >=16px on mobile to prevent
   iOS Safari auto-zoom-on-focus. Scoped to mobile so desktop can use
   smaller decorative sizes. */
@media (max-width: 768px) {
  input,
  textarea,
  select {
    font-size: 16px;
  }
}

/* Global touch-target floor — every interactive control (button, link,
   [role=button], summary) gets a minimum 44x44px hit area on mobile so
   taps never miss. 8px minimum gap between adjacent tappables is enforced
   via the gap utility below; this rule guarantees the hit area itself. */
@media (max-width: 768px) {
  button,
  a,
  [role="button"],
  summary,
  input[type="checkbox"],
  input[type="radio"],
  input[type="file"]::file-selector-button {
    min-height: 44px;
    min-width: 44px;
  }
  /* Adjacent tappables need at least 8px of breathing room. Applied to
     common flex/grid containers of interactive controls so tightly packed
     nav rows and action bars stay tappable. */
  nav,
  [role="toolbar"],
  [role="menubar"],
  [data-ocid] .flex > button + button,
  [data-ocid] .flex > a + a,
  [data-ocid] .flex > button + a,
  [data-ocid] .flex > a + button {
    gap: 0.5rem;
  }
}

/* Scrollable regions inside the page (overflow-auto/scroll containers) get
   momentum scrolling on iOS. Scoped to elements that explicitly opt into
   scrolling so we don't force a scroll context on every block. */
[data-ocid] [style*="overflow: auto"],
[data-ocid] [style*="overflow:auto"],
[data-ocid] [style*="overflow: scroll"],
[data-ocid] [style*="overflow:scroll"] {
  -webkit-overflow-scrolling: touch;
}

/* Touch-action safety — prevent the page itself from hijacking vertical
   pan gestures. Individual interactive surfaces (carousels, the globe
   canvas, sliders) opt into their own touch-action in their own CSS.
   This global rule keeps the document scroll native on touch devices. */
html,
body {
  touch-action: pan-y;
}
.selection\:bg-primary *::-moz-selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:bg-primary *::selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:text-primary-foreground *::-moz-selection {
  color: oklch(var(--primary-foreground));
}
.selection\:text-primary-foreground *::selection {
  color: oklch(var(--primary-foreground));
}
.selection\:bg-primary::-moz-selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:bg-primary::selection {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.selection\:text-primary-foreground::-moz-selection {
  color: oklch(var(--primary-foreground));
}
.selection\:text-primary-foreground::selection {
  color: oklch(var(--primary-foreground));
}
.file\:inline-flex::file-selector-button {
  display: inline-flex;
}
.file\:h-7::file-selector-button {
  height: 1.75rem;
}
.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: oklch(var(--foreground));
}
.placeholder\:text-muted-foreground::-moz-placeholder {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.placeholder\:text-muted-foreground::placeholder {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.after\:absolute::after {
  content: var(--tw-content);
  position: absolute;
}
.after\:-inset-2::after {
  content: var(--tw-content);
  inset: -0.5rem;
}
.after\:inset-y-0::after {
  content: var(--tw-content);
  top: 0px;
  bottom: 0px;
}
.after\:left-1\/2::after {
  content: var(--tw-content);
  left: 50%;
}
.after\:w-1::after {
  content: var(--tw-content);
  width: 0.25rem;
}
.after\:w-\[2px\]::after {
  content: var(--tw-content);
  width: 2px;
}
.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));
}
.first\:rounded-l-md:first-child {
  border-top-left-radius: calc(var(--radius) + 2px);
  border-bottom-left-radius: calc(var(--radius) + 2px);
}
.first\:border-l:first-child {
  border-left-width: 1px;
}
.last\:rounded-r-md:last-child {
  border-top-right-radius: calc(var(--radius) + 2px);
  border-bottom-right-radius: calc(var(--radius) + 2px);
}
.last\:border-0:last-child {
  border-width: 0px;
}
.last\:border-b-0:last-child {
  border-bottom-width: 0px;
}
.hover\:-translate-y-0:hover {
  --tw-translate-y: -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));
}
.hover\:scale-110:hover {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:scale-\[1\.02\]:hover {
  --tw-scale-x: 1.02;
  --tw-scale-y: 1.02;
  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-destructive\/50:hover {
  border-color: oklch(var(--destructive) / 0.5);
}
.hover\:border-primary:hover {
  --tw-border-opacity: 1;
  border-color: oklch(var(--primary) / var(--tw-border-opacity, 1));
}
.hover\:border-primary\/30:hover {
  border-color: oklch(var(--primary) / 0.3);
}
.hover\:border-primary\/40:hover {
  border-color: oklch(var(--primary) / 0.4);
}
.hover\:border-primary\/50:hover {
  border-color: oklch(var(--primary) / 0.5);
}
.hover\:border-primary\/60:hover {
  border-color: oklch(var(--primary) / 0.6);
}
.hover\:bg-accent:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.hover\:bg-amber-500\/10:hover {
  background-color: rgb(245 158 11 / 0.1);
}
.hover\:bg-amber-500\/25:hover {
  background-color: rgb(245 158 11 / 0.25);
}
.hover\:bg-background:hover {
  background-color: oklch(var(--background));
}
.hover\:bg-card:hover {
  background-color: oklch(var(--card));
}
.hover\:bg-cyan-500\/10:hover {
  background-color: rgb(6 182 212 / 0.1);
}
.hover\:bg-destructive:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--destructive) / var(--tw-bg-opacity, 1));
}
.hover\:bg-destructive\/10:hover {
  background-color: oklch(var(--destructive) / 0.1);
}
.hover\:bg-destructive\/5:hover {
  background-color: oklch(var(--destructive) / 0.05);
}
.hover\:bg-destructive\/90:hover {
  background-color: oklch(var(--destructive) / 0.9);
}
.hover\:bg-emerald-500\/10:hover {
  background-color: rgb(16 185 129 / 0.1);
}
.hover\:bg-muted:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--muted) / var(--tw-bg-opacity, 1));
}
.hover\:bg-muted-foreground\/80:hover {
  background-color: oklch(var(--muted-foreground) / 0.8);
}
.hover\:bg-muted\/30:hover {
  background-color: oklch(var(--muted) / 0.3);
}
.hover\:bg-muted\/50:hover {
  background-color: oklch(var(--muted) / 0.5);
}
.hover\:bg-primary:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.hover\:bg-primary\/10:hover {
  background-color: oklch(var(--primary) / 0.1);
}
.hover\:bg-primary\/25:hover {
  background-color: oklch(var(--primary) / 0.25);
}
.hover\:bg-primary\/5:hover {
  background-color: oklch(var(--primary) / 0.05);
}
.hover\:bg-primary\/90:hover {
  background-color: oklch(var(--primary) / 0.9);
}
.hover\:bg-secondary:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--secondary) / var(--tw-bg-opacity, 1));
}
.hover\:bg-secondary\/60:hover {
  background-color: oklch(var(--secondary) / 0.6);
}
.hover\:bg-secondary\/80:hover {
  background-color: oklch(var(--secondary) / 0.8);
}
.hover\:bg-sidebar-accent:hover {
  background-color: oklch(var(--sidebar-accent));
}
.hover\:bg-transparent:hover {
  background-color: transparent;
}
.hover\:bg-white\/20:hover {
  background-color: rgb(255 255 255 / 0.2);
}
.hover\:bg-white\/5:hover {
  background-color: rgb(255 255 255 / 0.05);
}
.hover\:bg-white\/60:hover {
  background-color: rgb(255 255 255 / 0.6);
}
.hover\:text-accent-foreground:hover {
  color: oklch(var(--accent-foreground));
}
.hover\:text-amber-400:hover {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}
.hover\:text-amber-50:hover {
  --tw-text-opacity: 1;
  color: rgb(255 251 235 / var(--tw-text-opacity, 1));
}
.hover\:text-cyan-400:hover {
  --tw-text-opacity: 1;
  color: rgb(34 211 238 / var(--tw-text-opacity, 1));
}
.hover\:text-destructive:hover {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.hover\:text-destructive-foreground:hover {
  color: oklch(var(--destructive-foreground));
}
.hover\:text-emerald-400:hover {
  --tw-text-opacity: 1;
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
}
.hover\:text-foreground:hover {
  color: oklch(var(--foreground));
}
.hover\:text-muted-foreground:hover {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.hover\:text-primary:hover {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}
.hover\:text-primary-foreground:hover {
  color: oklch(var(--primary-foreground));
}
.hover\:text-sidebar-accent-foreground:hover {
  color: oklch(var(--sidebar-accent-foreground));
}
.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.hover\:text-white\/40:hover {
  color: rgb(255 255 255 / 0.4);
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.hover\:opacity-100:hover {
  opacity: 1;
}
.hover\:opacity-80:hover {
  opacity: 0.8;
}
.hover\:opacity-90:hover {
  opacity: 0.9;
}
.hover\:shadow-2xl:hover {
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-\[0_0_0_1px_hsl\(var\(--sidebar-accent\)\)\]:hover {
  --tw-shadow: 0 0 0 1px hsl(var(--sidebar-accent));
  --tw-shadow-colored: 0 0 0 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);
}
.hover\:shadow-lg:hover {
  --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);
}
.hover\:shadow-md:hover {
  --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);
}
.hover\:shadow-xl:hover {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-primary\/10:hover {
  --tw-shadow-color: oklch(var(--primary) / 0.1);
  --tw-shadow: var(--tw-shadow-colored);
}
.hover\:shadow-primary\/15:hover {
  --tw-shadow-color: oklch(var(--primary) / 0.15);
  --tw-shadow: var(--tw-shadow-colored);
}
.hover\:shadow-primary\/30:hover {
  --tw-shadow-color: oklch(var(--primary) / 0.3);
  --tw-shadow: var(--tw-shadow-colored);
}
.hover\:ring-4:hover {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.hover\:brightness-105:hover {
  --tw-brightness: brightness(1.05);
  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);
}
.hover\:after\:bg-sidebar-border:hover::after {
  content: var(--tw-content);
  background-color: oklch(var(--sidebar-border));
}
.focus\:z-10:focus {
  z-index: 10;
}
.focus\:border-primary:focus {
  --tw-border-opacity: 1;
  border-color: oklch(var(--primary) / var(--tw-border-opacity, 1));
}
.focus\:bg-accent:focus {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.focus\:text-accent-foreground:focus {
  color: oklch(var(--accent-foreground));
}
.focus\:opacity-100:focus {
  opacity: 1;
}
.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus\:ring-1: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(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\:ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-primary:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: oklch(var(--primary) / var(--tw-ring-opacity, 1));
}
.focus\:ring-primary\/30:focus {
  --tw-ring-color: oklch(var(--primary) / 0.3);
}
.focus\:ring-ring:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: oklch(var(--ring) / var(--tw-ring-opacity, 1));
}
.focus\:ring-offset-2:focus {
  --tw-ring-offset-width: 2px;
}
.focus-visible\:z-10:focus-visible {
  z-index: 10;
}
.focus-visible\:border-ring:focus-visible {
  --tw-border-opacity: 1;
  border-color: oklch(var(--ring) / var(--tw-border-opacity, 1));
}
.focus-visible\:bg-secondary\/80:focus-visible {
  background-color: oklch(var(--secondary) / 0.8);
}
.focus-visible\:outline-none:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus-visible\:outline-1:focus-visible {
  outline-width: 1px;
}
.focus-visible\:outline-ring:focus-visible {
  outline-color: oklch(var(--ring) / 1);
}
.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-4: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(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:ring-\[3px\]: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(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);
}
.focus-visible\:ring-destructive:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: oklch(var(--destructive) / var(--tw-ring-opacity, 1));
}
.focus-visible\:ring-destructive\/20:focus-visible {
  --tw-ring-color: oklch(var(--destructive) / 0.2);
}
.focus-visible\:ring-destructive\/40:focus-visible {
  --tw-ring-color: oklch(var(--destructive) / 0.4);
}
.focus-visible\:ring-primary:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: oklch(var(--primary) / var(--tw-ring-opacity, 1));
}
.focus-visible\:ring-primary\/40:focus-visible {
  --tw-ring-color: oklch(var(--primary) / 0.4);
}
.focus-visible\:ring-primary\/50:focus-visible {
  --tw-ring-color: oklch(var(--primary) / 0.5);
}
.focus-visible\:ring-ring:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: oklch(var(--ring) / var(--tw-ring-opacity, 1));
}
.focus-visible\:ring-ring\/50:focus-visible {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.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: oklch(var(--background));
}
.active\:scale-95:active {
  --tw-scale-x: .95;
  --tw-scale-y: .95;
  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));
}
.active\:bg-sidebar-accent:active {
  background-color: oklch(var(--sidebar-accent));
}
.active\:bg-white\/30:active {
  background-color: rgb(255 255 255 / 0.3);
}
.active\:text-sidebar-accent-foreground:active {
  color: oklch(var(--sidebar-accent-foreground));
}
.disabled\:pointer-events-none:disabled {
  pointer-events: none;
}
.disabled\:cursor-not-allowed:disabled {
  cursor: not-allowed;
}
.disabled\:opacity-50:disabled {
  opacity: 0.5;
}
.disabled\:opacity-60:disabled {
  opacity: 0.6;
}
.group\/menu-item:focus-within .group-focus-within\/menu-item\:opacity-100 {
  opacity: 1;
}
.group:hover .group-hover\:text-primary {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}
.group\/menu-item:hover .group-hover\/menu-item\:opacity-100 {
  opacity: 1;
}
.group:hover .group-hover\:opacity-100 {
  opacity: 1;
}
.peer\/menu-button:hover ~ .peer-hover\/menu-button\:text-sidebar-accent-foreground {
  color: oklch(var(--sidebar-accent-foreground));
}
.peer:disabled ~ .peer-disabled\:cursor-not-allowed {
  cursor: not-allowed;
}
.peer:disabled ~ .peer-disabled\:opacity-50 {
  opacity: 0.5;
}
.has-\[\>svg\]\:grid-cols-\[calc\(var\(--spacing\)\*4\)_1fr\]:has(>svg) {
  grid-template-columns: calc(var(--spacing) * 4) 1fr;
}
.has-\[\>svg\]\:gap-x-3:has(>svg) {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.has-\[\>svg\]\:px-2\.5:has(>svg) {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.has-\[\>svg\]\:px-3:has(>svg) {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.has-\[\>svg\]\:px-4:has(>svg) {
  padding-left: 1rem;
  padding-right: 1rem;
}
.aria-disabled\:pointer-events-none[aria-disabled="true"] {
  pointer-events: none;
}
.aria-disabled\:opacity-50[aria-disabled="true"] {
  opacity: 0.5;
}
.aria-selected\:text-muted-foreground[aria-selected="true"] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.data-\[disabled\=true\]\:pointer-events-none[data-disabled="true"] {
  pointer-events: none;
}
.data-\[disabled\]\:pointer-events-none[data-disabled] {
  pointer-events: none;
}
.data-\[vaul-drawer-direction\=bottom\]\:inset-x-0[data-vaul-drawer-direction="bottom"] {
  left: 0px;
  right: 0px;
}
.data-\[vaul-drawer-direction\=left\]\:inset-y-0[data-vaul-drawer-direction="left"] {
  top: 0px;
  bottom: 0px;
}
.data-\[vaul-drawer-direction\=right\]\:inset-y-0[data-vaul-drawer-direction="right"] {
  top: 0px;
  bottom: 0px;
}
.data-\[vaul-drawer-direction\=top\]\:inset-x-0[data-vaul-drawer-direction="top"] {
  left: 0px;
  right: 0px;
}
.data-\[vaul-drawer-direction\=bottom\]\:bottom-0[data-vaul-drawer-direction="bottom"] {
  bottom: 0px;
}
.data-\[vaul-drawer-direction\=left\]\:left-0[data-vaul-drawer-direction="left"] {
  left: 0px;
}
.data-\[vaul-drawer-direction\=right\]\:right-0[data-vaul-drawer-direction="right"] {
  right: 0px;
}
.data-\[vaul-drawer-direction\=top\]\:top-0[data-vaul-drawer-direction="top"] {
  top: 0px;
}
.data-\[active\=true\]\:z-10[data-active="true"] {
  z-index: 10;
}
.data-\[vaul-drawer-direction\=bottom\]\:mt-24[data-vaul-drawer-direction="bottom"] {
  margin-top: 6rem;
}
.data-\[vaul-drawer-direction\=top\]\:mb-24[data-vaul-drawer-direction="top"] {
  margin-bottom: 6rem;
}
.data-\[orientation\=horizontal\]\:h-1\.5[data-orientation="horizontal"] {
  height: 0.375rem;
}
.data-\[orientation\=horizontal\]\:h-full[data-orientation="horizontal"] {
  height: 100%;
}
.data-\[orientation\=horizontal\]\:h-px[data-orientation="horizontal"] {
  height: 1px;
}
.data-\[orientation\=vertical\]\:h-full[data-orientation="vertical"] {
  height: 100%;
}
.data-\[panel-group-direction\=vertical\]\:h-px[data-panel-group-direction="vertical"] {
  height: 1px;
}
.data-\[size\=default\]\:h-9[data-size="default"] {
  height: 2.25rem;
}
.data-\[size\=sm\]\:h-8[data-size="sm"] {
  height: 2rem;
}
.data-\[vaul-drawer-direction\=bottom\]\:max-h-\[80vh\][data-vaul-drawer-direction="bottom"] {
  max-height: 80vh;
}
.data-\[vaul-drawer-direction\=top\]\:max-h-\[80vh\][data-vaul-drawer-direction="top"] {
  max-height: 80vh;
}
.data-\[orientation\=vertical\]\:min-h-44[data-orientation="vertical"] {
  min-height: 11rem;
}
.data-\[orientation\=horizontal\]\:w-full[data-orientation="horizontal"] {
  width: 100%;
}
.data-\[orientation\=vertical\]\:w-1\.5[data-orientation="vertical"] {
  width: 0.375rem;
}
.data-\[orientation\=vertical\]\:w-auto[data-orientation="vertical"] {
  width: auto;
}
.data-\[orientation\=vertical\]\:w-full[data-orientation="vertical"] {
  width: 100%;
}
.data-\[orientation\=vertical\]\:w-px[data-orientation="vertical"] {
  width: 1px;
}
.data-\[panel-group-direction\=vertical\]\:w-full[data-panel-group-direction="vertical"] {
  width: 100%;
}
.data-\[vaul-drawer-direction\=left\]\:w-3\/4[data-vaul-drawer-direction="left"] {
  width: 75%;
}
.data-\[vaul-drawer-direction\=right\]\:w-3\/4[data-vaul-drawer-direction="right"] {
  width: 75%;
}
.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-\[calc\(100\%-2px\)\][data-state="checked"] {
  --tw-translate-x: calc(100% - 2px);
  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-\[orientation\=vertical\]\:flex-col[data-orientation="vertical"] {
  flex-direction: column;
}
.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: calc(var(--radius) + 2px);
}
.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: calc(var(--radius) + 2px);
}
.data-\[selected\=true\]\:rounded-none[data-selected="true"] {
  border-radius: 0px;
}
.data-\[range-end\=true\]\:rounded-r-md[data-range-end="true"] {
  border-top-right-radius: calc(var(--radius) + 2px);
  border-bottom-right-radius: calc(var(--radius) + 2px);
}
.data-\[range-start\=true\]\:rounded-l-md[data-range-start="true"] {
  border-top-left-radius: calc(var(--radius) + 2px);
  border-bottom-left-radius: calc(var(--radius) + 2px);
}
.data-\[vaul-drawer-direction\=bottom\]\:rounded-t-lg[data-vaul-drawer-direction="bottom"] {
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
}
.data-\[vaul-drawer-direction\=top\]\:rounded-b-lg[data-vaul-drawer-direction="top"] {
  border-bottom-right-radius: var(--radius);
  border-bottom-left-radius: var(--radius);
}
.data-\[variant\=outline\]\:border-l-0[data-variant="outline"] {
  border-left-width: 0px;
}
.data-\[vaul-drawer-direction\=bottom\]\:border-t[data-vaul-drawer-direction="bottom"] {
  border-top-width: 1px;
}
.data-\[vaul-drawer-direction\=left\]\:border-r[data-vaul-drawer-direction="left"] {
  border-right-width: 1px;
}
.data-\[vaul-drawer-direction\=right\]\:border-l[data-vaul-drawer-direction="right"] {
  border-left-width: 1px;
}
.data-\[vaul-drawer-direction\=top\]\:border-b[data-vaul-drawer-direction="top"] {
  border-bottom-width: 1px;
}
.data-\[active\=true\]\:border-ring[data-active="true"] {
  --tw-border-opacity: 1;
  border-color: oklch(var(--ring) / var(--tw-border-opacity, 1));
}
.data-\[state\=checked\]\:border-primary[data-state="checked"] {
  --tw-border-opacity: 1;
  border-color: oklch(var(--primary) / var(--tw-border-opacity, 1));
}
.data-\[active\=true\]\:bg-accent\/50[data-active="true"] {
  background-color: oklch(var(--accent) / 0.5);
}
.data-\[active\=true\]\:bg-sidebar-accent[data-active="true"] {
  background-color: oklch(var(--sidebar-accent));
}
.data-\[range-end\=true\]\:bg-primary[data-range-end="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[range-middle\=true\]\:bg-accent[data-range-middle="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[range-start\=true\]\:bg-primary[data-range-start="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[selected-single\=true\]\:bg-primary[data-selected-single="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[selected\=true\]\:bg-accent[data-selected="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=active\]\:bg-background[data-state="active"] {
  background-color: oklch(var(--background));
}
.data-\[state\=active\]\:bg-primary[data-state="active"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[state\=checked\]\:bg-primary[data-state="checked"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.data-\[state\=on\]\:bg-accent[data-state="on"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:bg-accent[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:bg-accent\/50[data-state="open"] {
  background-color: oklch(var(--accent) / 0.5);
}
.data-\[state\=open\]\:bg-secondary[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--secondary) / var(--tw-bg-opacity, 1));
}
.data-\[state\=selected\]\:bg-muted[data-state="selected"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--muted) / var(--tw-bg-opacity, 1));
}
.data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
  background-color: oklch(var(--input));
}
.data-\[inset\]\:pl-8[data-inset] {
  padding-left: 2rem;
}
.data-\[active\=true\]\:font-medium[data-active="true"] {
  font-weight: 500;
}
.data-\[active\=true\]\:text-accent-foreground[data-active="true"] {
  color: oklch(var(--accent-foreground));
}
.data-\[active\=true\]\:text-sidebar-accent-foreground[data-active="true"] {
  color: oklch(var(--sidebar-accent-foreground));
}
.data-\[error\=true\]\:text-destructive[data-error="true"] {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.data-\[placeholder\]\:text-muted-foreground[data-placeholder] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.data-\[range-end\=true\]\:text-primary-foreground[data-range-end="true"] {
  color: oklch(var(--primary-foreground));
}
.data-\[range-middle\=true\]\:text-accent-foreground[data-range-middle="true"] {
  color: oklch(var(--accent-foreground));
}
.data-\[range-start\=true\]\:text-primary-foreground[data-range-start="true"] {
  color: oklch(var(--primary-foreground));
}
.data-\[selected-single\=true\]\:text-primary-foreground[data-selected-single="true"] {
  color: oklch(var(--primary-foreground));
}
.data-\[selected\=true\]\:text-accent-foreground[data-selected="true"] {
  color: oklch(var(--accent-foreground));
}
.data-\[state\=active\]\:text-primary-foreground[data-state="active"] {
  color: oklch(var(--primary-foreground));
}
.data-\[state\=checked\]\:text-primary-foreground[data-state="checked"] {
  color: oklch(var(--primary-foreground));
}
.data-\[state\=on\]\:text-accent-foreground[data-state="on"] {
  color: oklch(var(--accent-foreground));
}
.data-\[state\=open\]\:text-accent-foreground[data-state="open"] {
  color: oklch(var(--accent-foreground));
}
.data-\[state\=open\]\:text-muted-foreground[data-state="open"] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.data-\[variant\=destructive\]\:text-destructive[data-variant="destructive"] {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.data-\[disabled\=true\]\:opacity-50[data-disabled="true"] {
  opacity: 0.5;
}
.data-\[disabled\]\:opacity-50[data-disabled] {
  opacity: 0.5;
}
.data-\[state\=open\]\:opacity-100[data-state="open"] {
  opacity: 1;
}
.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-\[variant\=outline\]\:shadow-xs[data-variant="outline"] {
  --tw-shadow: 0 1px 2px 0 rgba(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-\[active\=true\]\:ring-\[3px\][data-active="true"] {
  --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);
}
.data-\[active\=true\]\:ring-ring\/50[data-active="true"] {
  --tw-ring-color: oklch(var(--ring) / 0.5);
}
.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-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\=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-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\=closed\]\:duration-300[data-state="closed"] {
  animation-duration: 300ms;
}
.data-\[state\=open\]\:duration-500[data-state="open"] {
  animation-duration: 500ms;
}
.\*\:data-\[slot\=select-value\]\:line-clamp-1[data-slot="select-value"] > * {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.\*\:data-\[slot\=select-value\]\:flex[data-slot="select-value"] > * {
  display: flex;
}
.\*\:data-\[slot\=select-value\]\:items-center[data-slot="select-value"] > * {
  align-items: center;
}
.\*\:data-\[slot\=select-value\]\:gap-2[data-slot="select-value"] > * {
  gap: 0.5rem;
}
.\*\:data-\[slot\=alert-description\]\:text-destructive\/90[data-slot="alert-description"] > * {
  color: oklch(var(--destructive) / 0.9);
}
.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-\[variant\=outline\]\:first\:border-l:first-child[data-variant="outline"] {
  border-left-width: 1px;
}
.data-\[active\=true\]\:hover\:bg-accent:hover[data-active="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:hover\:bg-accent:hover[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:hover\:bg-sidebar-accent:hover[data-state="open"] {
  background-color: oklch(var(--sidebar-accent));
}
.data-\[state\=open\]\:hover\:text-sidebar-accent-foreground:hover[data-state="open"] {
  color: oklch(var(--sidebar-accent-foreground));
}
.data-\[active\=true\]\:focus\:bg-accent:focus[data-active="true"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[state\=open\]\:focus\:bg-accent:focus[data-state="open"] {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
.data-\[variant\=destructive\]\:focus\:bg-destructive\/10:focus[data-variant="destructive"] {
  background-color: oklch(var(--destructive) / 0.1);
}
.data-\[variant\=destructive\]\:focus\:text-destructive:focus[data-variant="destructive"] {
  --tw-text-opacity: 1;
  color: oklch(var(--destructive) / var(--tw-text-opacity, 1));
}
.group[data-disabled="true"] .group-data-\[disabled\=true\]\:pointer-events-none {
  pointer-events: none;
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:relative {
  position: relative;
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\] {
  left: calc(var(--sidebar-width) * -1);
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:right-\[calc\(var\(--sidebar-width\)\*-1\)\] {
  right: calc(var(--sidebar-width) * -1);
}
.group[data-side="left"] .group-data-\[side\=left\]\:-right-4 {
  right: -1rem;
}
.group[data-side="right"] .group-data-\[side\=right\]\:left-0 {
  left: 0px;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:top-full {
  top: 100%;
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:z-10 {
  z-index: 10;
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:-mt-8 {
  margin-top: -2rem;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:mt-1\.5 {
  margin-top: 0.375rem;
}
.group\/drawer-content[data-vaul-drawer-direction="bottom"] .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:block {
  display: block;
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:hidden {
  display: none;
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\)\] {
  width: calc(var(--sidebar-width-icon) + (--spacing(4)));
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\+2px\)\] {
  width: calc(var(--sidebar-width-icon) + (--spacing(4)) + 2px);
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:w-0 {
  width: 0px;
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\: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));
}
.group[data-side="right"] .group-data-\[side\=right\]\: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[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[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:overflow-hidden {
  overflow: hidden;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:overflow-hidden {
  overflow: hidden;
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\:rounded-lg {
  border-radius: var(--radius);
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:rounded-md {
  border-radius: calc(var(--radius) + 2px);
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\:border {
  border-width: 1px;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:border {
  border-width: 1px;
}
.group[data-side="left"] .group-data-\[side\=left\]\:border-r {
  border-right-width: 1px;
}
.group[data-side="right"] .group-data-\[side\=right\]\:border-l {
  border-left-width: 1px;
}
.group\/day[data-focused="true"] .group-data-\[focused\=true\]\/day\:border-ring {
  --tw-border-opacity: 1;
  border-color: oklch(var(--ring) / var(--tw-border-opacity, 1));
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\:border-sidebar-border {
  border-color: oklch(var(--sidebar-border));
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:bg-popover {
  background-color: oklch(var(--popover));
}
.group\/drawer-content[data-vaul-drawer-direction="bottom"] .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:text-center {
  text-align: center;
}
.group\/drawer-content[data-vaul-drawer-direction="top"] .group-data-\[vaul-drawer-direction\=top\]\/drawer-content\:text-center {
  text-align: center;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:text-popover-foreground {
  color: oklch(var(--popover-foreground));
}
.group[data-collapsible="icon"] .group-data-\[collapsible\=icon\]\:opacity-0 {
  opacity: 0;
}
.group[data-disabled="true"] .group-data-\[disabled\=true\]\:opacity-50 {
  opacity: 0.5;
}
.group[data-variant="floating"] .group-data-\[variant\=floating\]\: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);
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\: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);
}
.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: oklch(var(--ring) / 0.5);
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:duration-200 {
  transition-duration: 200ms;
  animation-duration: 200ms;
}
.group[data-collapsible="offcanvas"] .group-data-\[collapsible\=offcanvas\]\:after\:left-full::after {
  content: var(--tw-content);
  left: 100%;
}
.group[data-collapsible="offcanvas"] .hover\:group-data-\[collapsible\=offcanvas\]\:bg-sidebar:hover {
  background-color: oklch(var(--sidebar));
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\: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;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\: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;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:fade-out-0[data-state="closed"] {
  --tw-exit-opacity: 0;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:fade-in-0[data-state="open"] {
  --tw-enter-opacity: 0;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:zoom-out-95[data-state="closed"] {
  --tw-exit-scale: .95;
}
.group\/navigation-menu[data-viewport="false"] .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:zoom-in-95[data-state="open"] {
  --tw-enter-scale: .95;
}
.peer\/menu-button[data-size="default"] ~ .peer-data-\[size\=default\]\/menu-button\:top-1\.5 {
  top: 0.375rem;
}
.peer\/menu-button[data-size="lg"] ~ .peer-data-\[size\=lg\]\/menu-button\:top-2\.5 {
  top: 0.625rem;
}
.peer\/menu-button[data-size="sm"] ~ .peer-data-\[size\=sm\]\/menu-button\:top-1 {
  top: 0.25rem;
}
.peer\/menu-button[data-active="true"] ~ .peer-data-\[active\=true\]\/menu-button\:text-sidebar-accent-foreground {
  color: oklch(var(--sidebar-accent-foreground));
}
.dark\:-rotate-90:is(.dark *) {
  --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));
}
.dark\:rotate-0:is(.dark *) {
  --tw-rotate: 0deg;
  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));
}
.dark\:scale-0:is(.dark *) {
  --tw-scale-x: 0;
  --tw-scale-y: 0;
  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));
}
.dark\:scale-100:is(.dark *) {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.dark\:border-input:is(.dark *) {
  border-color: oklch(var(--input));
}
.dark\:bg-destructive\/60:is(.dark *) {
  background-color: oklch(var(--destructive) / 0.6);
}
.dark\:text-amber-400:is(.dark *) {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
}
.dark\:text-muted-foreground:is(.dark *) {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.dark\:hover\:bg-accent\/50:hover:is(.dark *) {
  background-color: oklch(var(--accent) / 0.5);
}
.dark\:hover\:text-accent-foreground:hover:is(.dark *) {
  color: oklch(var(--accent-foreground));
}
.dark\:focus-visible\:ring-destructive\/40:focus-visible:is(.dark *) {
  --tw-ring-color: oklch(var(--destructive) / 0.4);
}
.dark\:data-\[state\=active\]\:border-input[data-state="active"]:is(.dark *) {
  border-color: oklch(var(--input));
}
.dark\:data-\[state\=checked\]\:bg-primary[data-state="checked"]:is(.dark *) {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--primary) / var(--tw-bg-opacity, 1));
}
.dark\:data-\[state\=checked\]\:bg-primary-foreground[data-state="checked"]:is(.dark *) {
  background-color: oklch(var(--primary-foreground));
}
.dark\:data-\[state\=unchecked\]\:bg-foreground[data-state="unchecked"]:is(.dark *) {
  background-color: oklch(var(--foreground));
}
.dark\:data-\[state\=active\]\:text-foreground[data-state="active"]:is(.dark *) {
  color: oklch(var(--foreground));
}
.dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20:focus[data-variant="destructive"]:is(.dark *) {
  background-color: oklch(var(--destructive) / 0.2);
}
@media (min-width: 480px) {

  .min-\[480px\]\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 640px) {

  .sm\:static {
    position: static;
  }

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

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

  .sm\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .sm\:ml-auto {
    margin-left: auto;
  }

  .sm\:block {
    display: block;
  }

  .sm\:flex {
    display: flex;
  }

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

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

  .sm\:max-w-3xl {
    max-width: 48rem;
  }

  .sm\:max-w-4xl {
    max-width: 56rem;
  }

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

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

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

  .sm\:max-w-xs {
    max-width: 20rem;
  }

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

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

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

  .sm\:grid-cols-\[auto_2fr_repeat\(4\2c 1fr\)\] {
    grid-template-columns: auto 2fr repeat(4,1fr);
  }

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

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

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

  .sm\:items-center {
    align-items: center;
  }

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

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

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

  .sm\:gap-0 {
    gap: 0px;
  }

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

  .sm\:gap-2\.5 {
    gap: 0.625rem;
  }

  .sm\:gap-4 {
    gap: 1rem;
  }

  .sm\:gap-8 {
    gap: 2rem;
  }

  .sm\:self-center {
    align-self: center;
  }

  .sm\:border-0 {
    border-width: 0px;
  }

  .sm\:bg-transparent {
    background-color: transparent;
  }

  .sm\:p-0 {
    padding: 0px;
  }

  .sm\:p-6 {
    padding: 1.5rem;
  }

  .sm\:p-8 {
    padding: 2rem;
  }

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

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

  .sm\:py-3\.5 {
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }

  .sm\:pl-2\.5 {
    padding-left: 0.625rem;
  }

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

  .sm\:pr-2\.5 {
    padding-right: 0.625rem;
  }

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

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

  .sm\:text-6xl {
    font-size: 3.75rem;
    line-height: 1;
  }

  .sm\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .sm\:backdrop-blur-none {
    --tw-backdrop-blur:  ;
    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);
  }

  .data-\[vaul-drawer-direction\=left\]\:sm\:max-w-sm[data-vaul-drawer-direction="left"] {
    max-width: 24rem;
  }

  .data-\[vaul-drawer-direction\=right\]\:sm\:max-w-sm[data-vaul-drawer-direction="right"] {
    max-width: 24rem;
  }
}
@media (min-width: 768px) {

  .md\:absolute {
    position: absolute;
  }

  .md\:mb-8 {
    margin-bottom: 2rem;
  }

  .md\:ml-0 {
    margin-left: 0px;
  }

  .md\:block {
    display: block;
  }

  .md\:inline {
    display: inline;
  }

  .md\:flex {
    display: flex;
  }

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

  .md\:hidden {
    display: none;
  }

  .md\:h-20 {
    height: 5rem;
  }

  .md\:h-28 {
    height: 7rem;
  }

  .md\:w-80 {
    width: 20rem;
  }

  .md\:w-\[var\(--radix-navigation-menu-viewport-width\)\] {
    width: var(--radix-navigation-menu-viewport-width);
  }

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

  .md\:flex-none {
    flex: none;
  }

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

  .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-\[3rem_1fr\] {
    grid-template-columns: 3rem 1fr;
  }

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

  .md\:flex-col {
    flex-direction: column;
  }

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

  .md\:items-center {
    align-items: center;
  }

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

  .md\:gap-1\.5 {
    gap: 0.375rem;
  }

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

  .md\:gap-6 {
    gap: 1.5rem;
  }

  .md\:self-auto {
    align-self: auto;
  }

  .md\:p-6 {
    padding: 1.5rem;
  }

  .md\:px-3\.5 {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }

  .md\:py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .md\:py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .md\:py-14 {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .md\:py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }

  .md\:py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

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

  .md\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  .md\:text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }

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

  .md\:text-6xl {
    font-size: 3.75rem;
    line-height: 1;
  }

  .md\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .md\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .md\:text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .md\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  .md\:opacity-0 {
    opacity: 0;
  }

  .md\:after\:hidden::after {
    content: var(--tw-content);
    display: none;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\:m-2 {
    margin: 0.5rem;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\:ml-0 {
    margin-left: 0px;
  }

  .peer[data-variant="inset"][data-state="collapsed"] ~ .md\:peer-data-\[variant\=inset\]\:peer-data-\[state\=collapsed\]\:ml-2 {
    margin-left: 0.5rem;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\:rounded-xl {
    border-radius: 0.75rem;
  }

  .peer[data-variant="inset"] ~ .md\:peer-data-\[variant\=inset\]\: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);
  }
}
@media (min-width: 1024px) {

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

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

  .lg\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .lg\:mb-0 {
    margin-bottom: 0px;
  }

  .lg\:block {
    display: block;
  }

  .lg\:flex {
    display: flex;
  }

  .lg\:hidden {
    display: none;
  }

  .lg\:w-96 {
    width: 24rem;
  }

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

  .lg\:min-w-\[10rem\] {
    min-width: 10rem;
  }

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

  .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\:flex-row {
    flex-direction: row;
  }

  .lg\:flex-col {
    flex-direction: column;
  }

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

  .lg\:items-stretch {
    align-items: stretch;
  }

  .lg\:justify-start {
    justify-content: flex-start;
  }

  .lg\:gap-0 {
    gap: 0px;
  }

  .lg\:gap-6 {
    gap: 1.5rem;
  }

  .lg\:gap-8 {
    gap: 2rem;
  }

  .lg\: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));
  }

  .lg\:self-center {
    align-self: center;
  }

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

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

  .lg\:text-left {
    text-align: left;
  }
}
@media (min-width: 1280px) {

  .xl\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .xl\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .xl\:h-32 {
    height: 8rem;
  }

  .xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.\[\&\:first-child\[data-selected\=true\]_button\]\:rounded-l-md:first-child[data-selected=true] button {
  border-top-left-radius: calc(var(--radius) + 2px);
  border-bottom-left-radius: calc(var(--radius) + 2px);
}
.\[\&\: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: calc(var(--radius) + 2px);
  border-bottom-right-radius: calc(var(--radius) + 2px);
}
.\[\&\>\[role\=checkbox\]\]\:translate-y-\[2px\]>[role=checkbox] {
  --tw-translate-y: 2px;
  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));
}
.\[\&\>button\]\:hidden>button {
  display: none;
}
.\[\&\>span\:last-child\]\:truncate>span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.\[\&\>span\]\:text-xs>span {
  font-size: 0.75rem;
  line-height: 1rem;
}
.\[\&\>span\]\:opacity-70>span {
  opacity: 0.7;
}
.\[\&\>svg\]\:pointer-events-none>svg {
  pointer-events: none;
}
.\[\&\>svg\]\:size-3>svg {
  width: 0.75rem;
  height: 0.75rem;
}
.\[\&\>svg\]\:size-3\.5>svg {
  width: 0.875rem;
  height: 0.875rem;
}
.\[\&\>svg\]\:size-4>svg {
  width: 1rem;
  height: 1rem;
}
.\[\&\>svg\]\:h-2\.5>svg {
  height: 0.625rem;
}
.\[\&\>svg\]\:h-3>svg {
  height: 0.75rem;
}
.\[\&\>svg\]\:w-2\.5>svg {
  width: 0.625rem;
}
.\[\&\>svg\]\:w-3>svg {
  width: 0.75rem;
}
.\[\&\>svg\]\:shrink-0>svg {
  flex-shrink: 0;
}
.\[\&\>svg\]\:translate-y-0\.5>svg {
  --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));
}
.\[\&\>svg\]\:text-current>svg {
  color: currentColor;
}
.\[\&\>svg\]\:text-muted-foreground>svg {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.\[\&\>svg\]\:text-sidebar-accent-foreground>svg {
  color: oklch(var(--sidebar-accent-foreground));
}
.\[\&\>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));
}
.\[\&_\.recharts-cartesian-axis-tick_text\]\:fill-muted-foreground .recharts-cartesian-axis-tick text {
  fill: oklch(var(--muted-foreground) / 1);
}
.\[\&_\.recharts-curve\.recharts-tooltip-cursor\]\:stroke-border .recharts-curve.recharts-tooltip-cursor {
  stroke: oklch(var(--border));
}
.\[\&_\.recharts-dot\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-dot[stroke='#fff'] {
  stroke: transparent;
}
.\[\&_\.recharts-polar-grid_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-polar-grid [stroke='#ccc'] {
  stroke: oklch(var(--border));
}
.\[\&_\.recharts-radial-bar-background-sector\]\:fill-muted .recharts-radial-bar-background-sector {
  fill: oklch(var(--muted) / 1);
}
.\[\&_\.recharts-rectangle\.recharts-tooltip-cursor\]\:fill-muted .recharts-rectangle.recharts-tooltip-cursor {
  fill: oklch(var(--muted) / 1);
}
.\[\&_\.recharts-reference-line_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-reference-line [stroke='#ccc'] {
  stroke: oklch(var(--border));
}
.\[\&_\.recharts-sector\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-sector[stroke='#fff'] {
  stroke: transparent;
}
.\[\&_\[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] {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.\[\&_\[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;
}
.\[\&_a\]\:text-primary a {
  --tw-text-opacity: 1;
  color: oklch(var(--primary) / var(--tw-text-opacity, 1));
}
.\[\&_a\]\:underline a {
  text-decoration-line: underline;
}
.\[\&_blockquote\]\:border-l-2 blockquote {
  border-left-width: 2px;
}
.\[\&_blockquote\]\:border-primary\/40 blockquote {
  border-color: oklch(var(--primary) / 0.4);
}
.\[\&_blockquote\]\:pl-3 blockquote {
  padding-left: 0.75rem;
}
.\[\&_blockquote\]\:italic blockquote {
  font-style: italic;
}
.\[\&_blockquote\]\:text-muted-foreground blockquote {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.\[\&_code\]\:rounded code {
  border-radius: 0.25rem;
}
.\[\&_code\]\:bg-muted\/40 code {
  background-color: oklch(var(--muted) / 0.4);
}
.\[\&_code\]\:px-1 code {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.\[\&_code\]\:py-0\.5 code {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.\[\&_h2\]\:mb-2 h2 {
  margin-bottom: 0.5rem;
}
.\[\&_h2\]\:mt-4 h2 {
  margin-top: 1rem;
}
.\[\&_h2\]\:text-xl h2 {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.\[\&_h2\]\:font-bold h2 {
  font-weight: 700;
}
.\[\&_h3\]\:mb-1\.5 h3 {
  margin-bottom: 0.375rem;
}
.\[\&_h3\]\:mt-3 h3 {
  margin-top: 0.75rem;
}
.\[\&_h3\]\:text-lg h3 {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.\[\&_h3\]\:font-semibold h3 {
  font-weight: 600;
}
.\[\&_ol\]\:list-decimal ol {
  list-style-type: decimal;
}
.\[\&_ol\]\:pl-6 ol {
  padding-left: 1.5rem;
}
.\[\&_p\]\:leading-relaxed p {
  line-height: 1.625;
}
.\[\&_pre\]\:rounded-lg pre {
  border-radius: var(--radius);
}
.\[\&_pre\]\:bg-muted\/30 pre {
  background-color: oklch(var(--muted) / 0.3);
}
.\[\&_pre\]\:p-3 pre {
  padding: 0.75rem;
}
.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*='size-']) {
  width: 1rem;
  height: 1rem;
}
.\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground svg:not([class*='text-']) {
  --tw-text-opacity: 1;
  color: oklch(var(--muted-foreground) / var(--tw-text-opacity, 1));
}
.\[\&_svg\]\:pointer-events-none svg {
  pointer-events: none;
}
.\[\&_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;
}
.\[\&_ul\]\:list-disc ul {
  list-style-type: disc;
}
.\[\&_ul\]\:pl-6 ul {
  padding-left: 1.5rem;
}
[data-side=left][data-collapsible=offcanvas] .\[\[data-side\=left\]\[data-collapsible\=offcanvas\]_\&\]\:-right-2 {
  right: -0.5rem;
}
[data-side=left][data-state=collapsed] .\[\[data-side\=left\]\[data-state\=collapsed\]_\&\]\:cursor-e-resize {
  cursor: e-resize;
}
[data-side=right][data-collapsible=offcanvas] .\[\[data-side\=right\]\[data-collapsible\=offcanvas\]_\&\]\:-left-2 {
  left: -0.5rem;
}
[data-side=right][data-state=collapsed] .\[\[data-side\=right\]\[data-state\=collapsed\]_\&\]\:cursor-w-resize {
  cursor: w-resize;
}
[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;
}
a.\[a\&\]\:hover\:bg-accent:hover {
  --tw-bg-opacity: 1;
  background-color: oklch(var(--accent) / var(--tw-bg-opacity, 1));
}
a.\[a\&\]\:hover\:bg-destructive\/90:hover {
  background-color: oklch(var(--destructive) / 0.9);
}
a.\[a\&\]\:hover\:bg-primary\/90:hover {
  background-color: oklch(var(--primary) / 0.9);
}
a.\[a\&\]\:hover\:bg-secondary\/90:hover {
  background-color: oklch(var(--secondary) / 0.9);
}
a.\[a\&\]\:hover\:text-accent-foreground:hover {
  color: oklch(var(--accent-foreground));
}
