/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer actoki-fixes, theme, base, components, utilities, properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    --color-red-50: oklch(97.1% 0.013 17.38);
    --color-red-200: oklch(88.5% 0.062 18.334);
    --color-red-300: oklch(80.8% 0.114 19.571);
    --color-red-600: oklch(57.7% 0.245 27.325);
    --color-red-700: oklch(50.5% 0.213 27.518);
    --color-red-800: oklch(44.4% 0.177 26.899);
    --color-red-900: oklch(39.6% 0.141 25.723);
    --color-amber-50: oklch(98.7% 0.022 95.277);
    --color-amber-200: oklch(92.4% 0.12 95.746);
    --color-amber-300: oklch(87.9% 0.169 91.605);
    --color-amber-800: oklch(47.3% 0.137 46.201);
    --color-amber-900: oklch(41.4% 0.112 45.904);
    --color-emerald-50: oklch(97.9% 0.021 166.113);
    --color-emerald-200: oklch(90.5% 0.093 164.15);
    --color-emerald-300: oklch(84.5% 0.143 164.978);
    --color-emerald-400: oklch(76.5% 0.177 163.223);
    --color-emerald-700: oklch(50.8% 0.118 165.612);
    --color-emerald-900: oklch(37.8% 0.077 168.94);
    --color-blue-50: oklch(97% 0.014 254.604);
    --color-blue-200: oklch(88.2% 0.059 254.128);
    --color-blue-800: oklch(42.4% 0.199 265.638);
    --color-indigo-50: oklch(96.2% 0.018 272.314);
    --color-indigo-100: oklch(93% 0.034 272.788);
    --color-indigo-200: oklch(87% 0.065 274.039);
    --color-indigo-300: oklch(78.5% 0.115 274.713);
    --color-indigo-600: oklch(51.1% 0.262 276.966);
    --color-indigo-700: oklch(45.7% 0.24 277.023);
    --color-indigo-800: oklch(39.8% 0.195 277.366);
    --color-indigo-900: oklch(35.9% 0.144 278.697);
    --color-indigo-950: oklch(25.7% 0.09 281.288);
    --color-slate-50: oklch(98.4% 0.003 247.858);
    --color-slate-100: oklch(96.8% 0.007 247.896);
    --color-slate-200: oklch(92.9% 0.013 255.508);
    --color-slate-300: oklch(86.9% 0.022 252.894);
    --color-slate-400: oklch(70.4% 0.04 256.788);
    --color-slate-500: oklch(55.4% 0.046 257.417);
    --color-slate-600: oklch(44.6% 0.043 257.281);
    --color-slate-700: oklch(37.2% 0.044 257.287);
    --color-slate-800: oklch(27.9% 0.041 260.031);
    --color-slate-900: oklch(20.8% 0.042 265.755);
    --color-slate-950: oklch(12.9% 0.042 264.695);
    --color-white: #fff;
    --spacing: 0.25rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-6xl: 72rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --tracking-tight: -0.025em;
    --tracking-wide: 0.025em;
    --tracking-wider: 0.05em;
    --radius-md: 0.375rem;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --radius-2xl: 1rem;
    --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .collapse {
    visibility: collapse;
  }
  .visible {
    visibility: visible;
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .inset-y-0 {
    inset-block: 0px;
  }
  .top-0 {
    top: 0px;
  }
  .top-3 {
    top: calc(var(--spacing) * 3);
  }
  .top-4 {
    top: calc(var(--spacing) * 4);
  }
  .right-3 {
    right: calc(var(--spacing) * 3);
  }
  .left-0 {
    left: 0px;
  }
  .left-4 {
    left: calc(var(--spacing) * 4);
  }
  .z-30 {
    z-index: 30;
  }
  .z-50 {
    z-index: 50;
  }
  .z-\[100\] {
    z-index: 100;
  }
  .col-span-full {
    grid-column: 1 / -1;
  }
  .container {
    width: 100%;
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .m-0 {
    margin: 0px;
  }
  .m-auto {
    margin: auto;
  }
  .-mx-4 {
    margin-inline: calc(var(--spacing) * -4);
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-4 {
    margin-block: calc(var(--spacing) * 4);
  }
  .mt-1 {
    margin-top: var(--spacing);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mt-auto {
    margin-top: auto;
  }
  .mb-0 {
    margin-bottom: 0px;
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .mb-5 {
    margin-bottom: calc(var(--spacing) * 5);
  }
  .block {
    display: block;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-flex {
    display: inline-flex;
  }
  .inline-grid {
    display: inline-grid;
  }
  .table {
    display: table;
  }
  .size-2\.5 {
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-10 {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
  }
  .h-3 {
    height: calc(var(--spacing) * 3);
  }
  .h-\[min\(92dvh\,980px\)\] {
    height: min(92dvh, 980px);
  }
  .h-full {
    height: 100%;
  }
  .max-h-64 {
    max-height: calc(var(--spacing) * 64);
  }
  .min-h-screen {
    min-height: 100vh;
  }
  .w-72 {
    width: calc(var(--spacing) * 72);
  }
  .w-\[min\(96vw\,1180px\)\] {
    width: min(96vw, 1180px);
  }
  .w-full {
    width: 100%;
  }
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
  .max-w-3xl {
    max-width: var(--container-3xl);
  }
  .max-w-6xl {
    max-width: var(--container-6xl);
  }
  .max-w-none {
    max-width: none;
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .min-w-0 {
    min-width: 0px;
  }
  .min-w-\[640px\] {
    min-width: 640px;
  }
  .flex-1 {
    flex: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .-translate-x-full {
    --tw-translate-x: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-24 {
    --tw-translate-y: calc(var(--spacing) * -24);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .cursor-not-allowed {
    cursor: not-allowed;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .scroll-mt-24 {
    scroll-margin-top: calc(var(--spacing) * 24);
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .place-items-center {
    place-items: center;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .gap-1 {
    gap: var(--spacing);
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  :where(.space-y-3 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
  }
  .self-end {
    align-self: flex-end;
  }
  .overflow-auto {
    overflow: auto;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-2xl {
    border-radius: var(--radius-2xl);
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-lg {
    border-radius: var(--radius-lg);
  }
  .rounded-md {
    border-radius: var(--radius-md);
  }
  .rounded-xl {
    border-radius: var(--radius-xl);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-r {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }
  .border-amber-200 {
    border-color: var(--color-amber-200);
  }
  .border-amber-300 {
    border-color: var(--color-amber-300);
  }
  .border-blue-200 {
    border-color: var(--color-blue-200);
  }
  .border-emerald-200 {
    border-color: var(--color-emerald-200);
  }
  .border-emerald-300 {
    border-color: var(--color-emerald-300);
  }
  .border-indigo-200 {
    border-color: var(--color-indigo-200);
  }
  .border-red-200 {
    border-color: var(--color-red-200);
  }
  .border-red-300 {
    border-color: var(--color-red-300);
  }
  .border-slate-100 {
    border-color: var(--color-slate-100);
  }
  .border-slate-200 {
    border-color: var(--color-slate-200);
  }
  .border-slate-300 {
    border-color: var(--color-slate-300);
  }
  .border-slate-700 {
    border-color: var(--color-slate-700);
  }
  .border-slate-800 {
    border-color: var(--color-slate-800);
  }
  .border-white\/10 {
    border-color: color-mix(in srgb, #fff 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }
  .bg-amber-50 {
    background-color: var(--color-amber-50);
  }
  .bg-blue-50 {
    background-color: var(--color-blue-50);
  }
  .bg-emerald-50 {
    background-color: var(--color-emerald-50);
  }
  .bg-emerald-400 {
    background-color: var(--color-emerald-400);
  }
  .bg-indigo-50 {
    background-color: var(--color-indigo-50);
  }
  .bg-indigo-100 {
    background-color: var(--color-indigo-100);
  }
  .bg-indigo-600 {
    background-color: var(--color-indigo-600);
  }
  .bg-red-50 {
    background-color: var(--color-red-50);
  }
  .bg-red-600 {
    background-color: var(--color-red-600);
  }
  .bg-slate-50 {
    background-color: var(--color-slate-50);
  }
  .bg-slate-100 {
    background-color: var(--color-slate-100);
  }
  .bg-slate-200 {
    background-color: var(--color-slate-200);
  }
  .bg-slate-900 {
    background-color: var(--color-slate-900);
  }
  .bg-slate-950 {
    background-color: var(--color-slate-950);
  }
  .bg-white {
    background-color: var(--color-white);
  }
  .bg-white\/10 {
    background-color: color-mix(in srgb, #fff 10%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }
  .bg-white\/95 {
    background-color: color-mix(in srgb, #fff 95%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
    }
  }
  .p-0 {
    padding: 0px;
  }
  .p-1 {
    padding: var(--spacing);
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-5 {
    padding: calc(var(--spacing) * 5);
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .p-8 {
    padding: calc(var(--spacing) * 8);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }
  .py-1 {
    padding-block: var(--spacing);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }
  .pt-1 {
    padding-top: var(--spacing);
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-10 {
    padding-bottom: calc(var(--spacing) * 10);
  }
  .text-center {
    text-align: center;
  }
  .text-justify {
    text-align: justify;
  }
  .font-mono {
    font-family: var(--font-mono);
  }
  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .text-\[11px\] {
    font-size: 11px;
  }
  .leading-5 {
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
  }
  .leading-6 {
    --tw-leading: calc(var(--spacing) * 6);
    line-height: calc(var(--spacing) * 6);
  }
  .leading-8 {
    --tw-leading: calc(var(--spacing) * 8);
    line-height: calc(var(--spacing) * 8);
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-extrabold {
    --tw-font-weight: var(--font-weight-extrabold);
    font-weight: var(--font-weight-extrabold);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-\[0\.12em\] {
    --tw-tracking: 0.12em;
    letter-spacing: 0.12em;
  }
  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .tracking-wide {
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
  }
  .tracking-wider {
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
  }
  .break-all {
    word-break: break-all;
  }
  .text-amber-800 {
    color: var(--color-amber-800);
  }
  .text-amber-900 {
    color: var(--color-amber-900);
  }
  .text-blue-800 {
    color: var(--color-blue-800);
  }
  .text-emerald-700 {
    color: var(--color-emerald-700);
  }
  .text-emerald-900 {
    color: var(--color-emerald-900);
  }
  .text-indigo-700 {
    color: var(--color-indigo-700);
  }
  .text-indigo-800 {
    color: var(--color-indigo-800);
  }
  .text-indigo-900 {
    color: var(--color-indigo-900);
  }
  .text-indigo-950 {
    color: var(--color-indigo-950);
  }
  .text-red-700 {
    color: var(--color-red-700);
  }
  .text-red-800 {
    color: var(--color-red-800);
  }
  .text-red-900 {
    color: var(--color-red-900);
  }
  .text-slate-100 {
    color: var(--color-slate-100);
  }
  .text-slate-200 {
    color: var(--color-slate-200);
  }
  .text-slate-400 {
    color: var(--color-slate-400);
  }
  .text-slate-500 {
    color: var(--color-slate-500);
  }
  .text-slate-600 {
    color: var(--color-slate-600);
  }
  .text-slate-700 {
    color: var(--color-slate-700);
  }
  .text-slate-800 {
    color: var(--color-slate-800);
  }
  .text-slate-900 {
    color: var(--color-slate-900);
  }
  .text-slate-950 {
    color: var(--color-slate-950);
  }
  .text-white {
    color: var(--color-white);
  }
  .capitalize {
    text-transform: capitalize;
  }
  .lowercase {
    text-transform: lowercase;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .italic {
    font-style: italic;
  }
  .no-underline {
    text-decoration-line: none;
  }
  .underline {
    text-decoration-line: underline;
  }
  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  .opacity-50 {
    opacity: 50%;
  }
  .shadow-2xl {
    --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-panel {
    --tw-shadow: 0 18px 48px var(--tw-shadow-color, rgba(17, 21, 38, .10));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-sm {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-4 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-amber-200 {
    --tw-ring-color: var(--color-amber-200);
  }
  .ring-emerald-200 {
    --tw-ring-color: var(--color-emerald-200);
  }
  .ring-emerald-400\/15 {
    --tw-ring-color: color-mix(in srgb, oklch(76.5% 0.177 163.223) 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      --tw-ring-color: color-mix(in oklab, var(--color-emerald-400) 15%, transparent);
    }
  }
  .ring-indigo-200 {
    --tw-ring-color: var(--color-indigo-200);
  }
  .ring-red-200 {
    --tw-ring-color: var(--color-red-200);
  }
  .ring-slate-200 {
    --tw-ring-color: var(--color-slate-200);
  }
  .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,);
  }
  .invert {
    --tw-invert: invert(100%);
    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);
    -webkit-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: 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, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .ring-inset {
    --tw-ring-inset: inset;
  }
  @media (hover: hover) {
    .hover\:-translate-y-0\.5:hover {
      --tw-translate-y: calc(var(--spacing) * -0.5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .hover\:border-indigo-300:hover {
      border-color: var(--color-indigo-300);
    }
    .hover\:bg-indigo-50:hover {
      background-color: var(--color-indigo-50);
    }
    .hover\:bg-indigo-700:hover {
      background-color: var(--color-indigo-700);
    }
    .hover\:bg-red-700:hover {
      background-color: var(--color-red-700);
    }
    .hover\:bg-slate-50:hover {
      background-color: var(--color-slate-50);
    }
    .hover\:bg-slate-100:hover {
      background-color: var(--color-slate-100);
    }
    .hover\:bg-white\/20:hover {
      background-color: color-mix(in srgb, #fff 20%, transparent);
    }
    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/20:hover {
        background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
      }
    }
    .hover\:text-indigo-700:hover {
      color: var(--color-indigo-700);
    }
    .hover\:text-indigo-900:hover {
      color: var(--color-indigo-900);
    }
    .hover\:text-slate-950:hover {
      color: var(--color-slate-950);
    }
    .hover\:shadow-md:hover {
      --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .focus\:translate-y-0:focus {
    --tw-translate-y: 0px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .focus-visible\:outline-2:focus-visible {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }
  .focus-visible\:outline-offset-2:focus-visible {
    outline-offset: 2px;
  }
  .focus-visible\:outline-indigo-600:focus-visible {
    outline-color: var(--color-indigo-600);
  }
  .disabled\:cursor-not-allowed:disabled {
    cursor: not-allowed;
  }
  .disabled\:opacity-50:disabled {
    opacity: 50%;
  }
  @media (width >= 40rem) {
    .sm\:col-span-2 {
      grid-column: span 2 / span 2;
    }
    .sm\:-mx-6 {
      margin-inline: calc(var(--spacing) * -6);
    }
    .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sm\:flex-row {
      flex-direction: row;
    }
    .sm\:items-start {
      align-items: flex-start;
    }
    .sm\:justify-between {
      justify-content: space-between;
    }
    .sm\:p-5 {
      padding: calc(var(--spacing) * 5);
    }
    .sm\:p-6 {
      padding: calc(var(--spacing) * 6);
    }
    .sm\:p-8 {
      padding: calc(var(--spacing) * 8);
    }
    .sm\:px-6 {
      padding-inline: calc(var(--spacing) * 6);
    }
    .sm\:px-7 {
      padding-inline: calc(var(--spacing) * 7);
    }
    .sm\:py-5 {
      padding-block: calc(var(--spacing) * 5);
    }
    .sm\:py-6 {
      padding-block: calc(var(--spacing) * 6);
    }
    .sm\:text-2xl {
      font-size: var(--text-2xl);
      line-height: var(--tw-leading, var(--text-2xl--line-height));
    }
    .sm\:text-base {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }
  }
  @media (width >= 48rem) {
    .md\:col-span-2 {
      grid-column: span 2 / span 2;
    }
    .md\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .md\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .md\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .md\:flex-row {
      flex-direction: row;
    }
    .md\:items-center {
      align-items: center;
    }
    .md\:justify-between {
      justify-content: space-between;
    }
  }
  @media (width >= 64rem) {
    .lg\:static {
      position: static;
    }
    .lg\:col-span-3 {
      grid-column: span 3 / span 3;
    }
    .lg\:hidden {
      display: none;
    }
    .lg\:translate-x-0 {
      --tw-translate-x: 0px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .lg\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .lg\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .lg\:px-8 {
      padding-inline: calc(var(--spacing) * 8);
    }
  }
  @media (width >= 80rem) {
    .xl\:col-span-3 {
      grid-column: span 3 / span 3;
    }
    .xl\:col-span-4 {
      grid-column: span 4 / span 4;
    }
    .xl\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .xl\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .xl\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .xl\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    .xl\:flex-row {
      flex-direction: row;
    }
    .xl\:items-start {
      align-items: flex-start;
    }
    .xl\:justify-between {
      justify-content: space-between;
    }
  }
}
@layer base {
  *,::before,::after {
    box-sizing: border-box;
  }
  html {
    min-width: 320px;
    background: #f5f7fb;
  }
  body {
    margin: 0;
    min-height: 100vh;
    font-family: var(--font-sans);
    color: #111827;
  }
  img,svg {
    max-width: 100%;
  }
  button,input,select,textarea {
    font: inherit;
  }
}
@layer components {
  *,::before,::after {
    box-sizing: border-box;
  }
  html {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
  }
  body {
    line-height: 1.5;
  }
  img,svg,video,canvas {
    display: block;
    max-width: 100%;
  }
  .hidden {
    display: none;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .items-center {
    align-items: center;
  }
  .justify-between {
    justify-content: space-between;
  }
  .gap-2 {
    gap: .5rem;
  }
  .gap-3 {
    gap: .75rem;
  }
  .gap-4 {
    gap: 1rem;
  }
  .rounded-xl {
    border-radius: .75rem;
  }
  .rounded-2xl {
    border-radius: 1rem;
  }
  .p-4 {
    padding: 1rem;
  }
  .p-6 {
    padding: 1.5rem;
  }
  .mt-4 {
    margin-top: 1rem;
  }
  .mb-4 {
    margin-bottom: 1rem;
  }
  .text-sm {
    font-size: .875rem;
  }
  .font-bold {
    font-weight: 700;
  }
  .font-semibold {
    font-weight: 600;
  }
  .shadow {
    box-shadow: 0 10px 30px rgba(15,23,42,.08);
  }
  .bg-white {
    background: #fff;
  }
  .text-slate-500 {
    color: #64748b;
  }
  .text-slate-900 {
    color: #0f172a;
  }
  .border {
    border: 1px solid #e5e7eb;
  }
  .instruction-button {
    min-width: 92px;
    font-weight: 750;
  }
  :root {
    --ink: #101828;
    --ink-2: #344054;
    --muted: #667085;
    --line: #e4e7ec;
    --line-strong: #d0d5dd;
    --paper: #ffffff;
    --canvas: #f8fafc;
    --soft: #f2f4f7;
    --violet: #665cf6;
    --violet-dark: #5147df;
    --violet-soft: #f1f0ff;
    --teal: #0e9384;
    --blue: #1570ef;
    --amber: #dc6803;
    --green: #067647;
    --shadow-xs: 0 1px 2px rgba(16,24,40,.05);
    --shadow-sm: 0 2px 8px rgba(16,24,40,.06);
    --shadow-lg: 0 24px 64px rgba(16,24,40,.12);
    --radius: 18px;
    --radius-sm: 12px;
    --max: 1180px;
  }
  body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  img,svg {
    max-width: 100%;
  }
  button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible {
    outline: 3px solid rgba(102,92,246,.24);
    outline-offset: 3px;
  }
  .site-container {
    width: min(calc(100% - 40px),var(--max));
    margin-inline: auto;
  }
  .site-header {
    position: sticky;
    top: 0;
    z-index: 60;
    background: rgba(255,255,255,.9);
    backdrop-filter: blur(18px) saturate(145%);
    border-bottom: 1px solid rgba(228,231,236,.88);
    box-shadow: 0 1px 0 rgba(16,24,40,.02);
  }
  .site-header .site-container {
    width: min(calc(100% - 48px),1320px);
  }
  .site-nav {
    height: 76px;
    display: flex;
    align-items: center;
    gap: 20px;
  }
  .brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    font-weight: 800;
    font-size: 20px;
    letter-spacing: -.03em;
    white-space: nowrap;
  }
  .brand-mark {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(145deg,#847cfb,#5348e7);
    box-shadow: 0 8px 22px rgba(102,92,246,.25);
  }
  .brand-mark svg {
    width: 22px;
    height: 22px;
  }
  .brand-sub {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding-left: 13px;
    margin-left: 2px;
    border-left: 1px solid var(--line);
    color: var(--muted);
    font-weight: 650;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 1;
    white-space: nowrap;
  }
  .nav-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
  }
  .nav-link {
    padding: 9px 10px;
    border-radius: 9px;
    color: var(--ink-2);
    font-weight: 680;
    font-size: 14px;
    white-space: nowrap;
  }
  .nav-link:hover {
    background: var(--soft);
    color: var(--ink);
  }
  .nav-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
  }
  .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid transparent;
    border-radius: 11px;
    background: var(--violet);
    color: #fff;
    font-weight: 750;
    font-size: 14px;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: var(--shadow-xs);
    transition: transform .18s ease,box-shadow .18s ease,background .18s ease;
  }
  .button:hover {
    background: var(--violet-dark);
    transform: translateY(-1px);
    box-shadow: 0 9px 24px rgba(102,92,246,.22);
  }
  .button.secondary {
    background: #fff;
    color: var(--ink-2);
    border-color: var(--line-strong);
  }
  .button.secondary:hover {
    background: var(--canvas);
    box-shadow: var(--shadow-sm);
  }
  .button.ghost {
    background: transparent;
    color: var(--ink-2);
    box-shadow: none;
  }
  .button.small {
    min-height: 40px;
    padding: 9px 14px;
  }
  .menu-button {
    display: none;
    width: 44px;
    height: 44px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: #fff;
    color: var(--ink);
    padding: 10px;
    cursor: pointer;
  }
  .menu-button:hover {
    background: var(--canvas);
  }
  .menu-button svg {
    width: 22px;
    height: 22px;
  }
  .mobile-nav {
    display: none;
  }
  .mobile-nav-cta {
    background: var(--violet);
    color: #fff !important;
    text-align: center;
  }
  .mobile-nav-cta:hover {
    background: var(--violet-dark) !important;
  }
  .hero {
    position: relative;
    overflow: hidden;
    padding: 88px 0 76px;
    background: radial-gradient(circle at 82% 10%,rgba(102,92,246,.12),transparent 31%),radial-gradient(circle at 10% 70%,rgba(21,112,239,.08),transparent 28%),linear-gradient(#fff,#fbfbff);
  }
  .hero:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(16,24,40,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(16,24,40,.035) 1px,transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom,#000,transparent 78%);
    pointer-events: none;
  }
  .hero-grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1.05fr) minmax(420px,.95fr);
    gap: 70px;
    align-items: center;
  }
  .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border: 1px solid #dedbff;
    border-radius: 999px;
    background: rgba(255,255,255,.82);
    color: #554be5;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
  }
  .eyebrow-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #12b76a;
    box-shadow: 0 0 0 4px rgba(18,183,106,.12);
  }
  h1,h2,h3 {
    color: var(--ink);
    letter-spacing: -.035em;
  }
  h1 {
    font-size: clamp(46px,6vw,72px);
    line-height: 1.02;
    margin: 20px 0 20px;
    max-width: 780px;
  }
  h2 {
    font-size: clamp(32px,4.4vw,48px);
    line-height: 1.12;
    margin: 0;
  }
  h3 {
    font-size: 20px;
    line-height: 1.3;
  }
  .hero-copy {
    font-size: clamp(18px,2vw,21px);
    line-height: 1.65;
    color: var(--muted);
    max-width: 680px;
    margin: 0;
  }
  .hero-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 30px;
  }
  .hero-proof {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 24px;
    color: var(--muted);
    font-size: 13px;
  }
  .hero-proof span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .proof-check {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #ecfdf3;
    color: var(--green);
    font-size: 11px;
    font-weight: 900;
  }
  .product-window {
    border: 1px solid rgba(208,213,221,.86);
    border-radius: 20px;
    background: rgba(255,255,255,.92);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    transform: perspective(1200px) rotateY(-2deg) rotateX(1deg);
  }
  .window-bar {
    height: 48px;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 15px;
    background: #fcfcfd;
  }
  .window-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #d0d5dd;
  }
  .window-title {
    margin-left: 8px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
  }
  .window-body {
    display: grid;
    grid-template-columns: 150px 1fr;
    min-height: 430px;
  }
  .window-side {
    padding: 18px 12px;
    background: #101828;
    color: #d0d5dd;
  }
  .window-brand {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    font-weight: 800;
    margin: 0 5px 18px;
  }
  .window-brand b {
    width: 22px;
    height: 22px;
    border-radius: 7px;
    background: var(--violet);
    display: grid;
    place-items: center;
    color: #fff;
  }
  .window-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .window-nav span {
    font-size: 11px;
    padding: 8px 9px;
    border-radius: 7px;
  }
  .window-nav .active {
    background: #272f43;
    color: #fff;
  }
  .window-main {
    padding: 22px;
    background: #f8fafc;
  }
  .window-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
  }
  .window-heading strong {
    font-size: 14px;
  }
  .window-chip {
    font-size: 9px;
    color: var(--green);
    background: #ecfdf3;
    border-radius: 99px;
    padding: 4px 7px;
    font-weight: 800;
  }
  .window-metrics {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 9px;
  }
  .window-metric {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 12px;
  }
  .window-metric small {
    display: block;
    color: var(--muted);
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 800;
  }
  .window-metric strong {
    font-size: 19px;
    display: block;
    margin-top: 3px;
  }
  .window-chart {
    height: 112px;
    margin-top: 11px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    padding: 14px;
    position: relative;
    overflow: hidden;
  }
  .window-chart:before {
    content: "";
    position: absolute;
    inset: 14px;
    background: repeating-linear-gradient(to bottom,transparent 0,transparent 24px,#eef2f6 25px);
  }
  .chart-line {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  .window-table {
    margin-top: 11px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 10px;
    overflow: hidden;
  }
  .window-row {
    display: grid;
    grid-template-columns: 1.2fr .8fr .6fr;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid #f0f2f5;
    font-size: 8px;
    color: var(--muted);
  }
  .window-row:last-child {
    border-bottom: 0;
  }
  .window-row.head {
    background: #f9fafb;
    color: #475467;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
  }
  .window-row b {
    color: #344054;
  }
  .trust-strip {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: #fff;
  }
  .trust-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
  }
  .trust-item {
    padding: 23px 28px;
    border-right: 1px solid var(--line);
  }
  .trust-item:last-child {
    border-right: 0;
  }
  .trust-item strong {
    display: block;
    font-size: 20px;
    letter-spacing: -.03em;
  }
  .trust-item span {
    color: var(--muted);
    font-size: 13px;
  }
  .section {
    padding: 96px 0;
  }
  .section.soft {
    background: var(--canvas);
  }
  .section-dark {
    background: #101828;
    color: #fff;
  }
  .section-dark h2,.section-dark h3 {
    color: #fff;
  }
  .section-head {
    display: flex;
    justify-content: space-between;
    gap: 48px;
    align-items: flex-end;
    margin-bottom: 42px;
  }
  .section-kicker {
    display: block;
    color: var(--violet);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .11em;
    font-weight: 850;
    margin-bottom: 10px;
  }
  .section-lead {
    max-width: 610px;
    color: var(--muted);
    font-size: 18px;
    margin: 0;
  }
  .api-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 16px;
  }
  .api-card {
    position: relative;
    padding: 25px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    min-height: 220px;
    box-shadow: var(--shadow-xs);
    transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease;
  }
  .api-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-sm);
    border-color: #c7c3ff;
  }
  .api-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: var(--violet-soft);
    color: var(--violet);
    font-weight: 850;
    margin-bottom: 22px;
  }
  .api-card:nth-child(2) .api-icon {
    background: #eff8ff;
    color: var(--blue);
  }
  .api-card:nth-child(3) .api-icon {
    background: #ecfdf3;
    color: var(--green);
  }
  .api-card:nth-child(4) .api-icon {
    background: #fff6ed;
    color: var(--amber);
  }
  .api-card:nth-child(5) .api-icon {
    background: #f0f9ff;
    color: #026aa2;
  }
  .api-card:nth-child(6) .api-icon {
    background: #fdf2fa;
    color: #c11574;
  }
  .api-card h3 {
    margin: 0 0 9px;
  }
  .api-card p {
    color: var(--muted);
    font-size: 14px;
    margin: 0 0 20px;
  }
  .card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--violet-dark);
    font-weight: 750;
    font-size: 13px;
  }
  .experience-grid {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 70px;
    align-items: center;
  }
  .feature-list {
    display: grid;
    gap: 22px;
    margin-top: 32px;
  }
  .feature {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 14px;
  }
  .feature-number {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--violet-soft);
    color: var(--violet);
    display: grid;
    place-items: center;
    font-size: 13px;
    font-weight: 850;
  }
  .feature h3 {
    margin: 0 0 4px;
    font-size: 17px;
  }
  .feature p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
  }
  .code-panel {
    border-radius: 18px;
    overflow: hidden;
    background: #0c111d;
    box-shadow: 0 24px 70px rgba(16,24,40,.24);
    color: #d0d5dd;
  }
  .code-tabs {
    display: flex;
    gap: 4px;
    padding: 11px 12px;
    border-bottom: 1px solid #293056;
  }
  .code-tab {
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #98a2b3;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 750;
    cursor: pointer;
  }
  .code-tab.active {
    background: #1d2536;
    color: #fff;
  }
  .code-body {
    padding: 24px;
    min-height: 350px;
    overflow: auto;
  }
  .code-body pre {
    margin: 0;
    font: 13px/1.75 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
    white-space: pre-wrap;
  }
  .code-key {
    color: #c7d7fe;
  }
  .code-string {
    color: #6ce9a6;
  }
  .code-comment {
    color: #667085;
  }
  .map-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
  }
  .map-demo {
    position: relative;
    min-height: 420px;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--line);
    background: #eef4f1;
  }
  .map-demo svg {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 420px;
  }
  .map-card {
    position: absolute;
    left: 20px;
    top: 20px;
    width: min(270px,calc(100% - 40px));
    padding: 15px;
    border: 1px solid rgba(208,213,221,.85);
    border-radius: 13px;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(12px);
    box-shadow: 0 12px 32px rgba(16,24,40,.12);
  }
  .map-card strong {
    display: block;
    font-size: 14px;
  }
  .map-card span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    margin-top: 3px;
  }
  .guard-panel {
    padding: 32px;
    border-radius: 18px;
    background: #101828;
    color: #d0d5dd;
  }
  .guard-panel h3 {
    color: #fff;
    font-size: 25px;
    margin: 0 0 10px;
  }
  .guard-panel>p {
    color: #98a2b3;
    margin: 0 0 25px;
  }
  .guard-list {
    display: grid;
    gap: 16px;
  }
  .guard-item {
    display: grid;
    grid-template-columns: 30px 1fr;
    gap: 12px;
  }
  .guard-check {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(108,233,166,.12);
    color: #6ce9a6;
    display: grid;
    place-items: center;
    font-weight: 900;
  }
  .guard-item strong {
    display: block;
    color: #fff;
    font-size: 14px;
  }
  .guard-item span {
    display: block;
    color: #98a2b3;
    font-size: 13px;
    margin-top: 2px;
  }
  .security-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
  }
  .security-points {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  .security-point {
    padding: 18px;
    border: 1px solid #344054;
    border-radius: 13px;
    background: #182230;
  }
  .security-point strong {
    display: block;
    color: #fff;
    font-size: 14px;
  }
  .security-point span {
    display: block;
    color: #98a2b3;
    font-size: 12px;
    margin-top: 4px;
  }
  .workflow {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
  }
  .workflow-step {
    position: relative;
    padding: 28px 25px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
  }
  .workflow-step:after {
    content: "";
    position: absolute;
    top: 46px;
    right: -21px;
    width: 21px;
    height: 1px;
    background: var(--line-strong);
  }
  .workflow-step:last-child:after {
    display: none;
  }
  .workflow-num {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--ink);
    color: #fff;
    font-size: 12px;
    font-weight: 850;
  }
  .workflow-step h3 {
    margin: 20px 0 7px;
  }
  .workflow-step p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
  }
  .faq-layout {
    display: grid;
    grid-template-columns: .7fr 1.3fr;
    gap: 80px;
    align-items: start;
  }
  .faq-intro {
    position: sticky;
    top: 110px;
  }
  .faq-intro p {
    color: var(--muted);
    font-size: 17px;
  }
  .faq-list {
    border-top: 1px solid var(--line);
  }
  .faq-item {
    border-bottom: 1px solid var(--line);
  }
  .faq-item summary {
    list-style: none;
    cursor: pointer;
    padding: 22px 44px 22px 0;
    font-weight: 750;
    position: relative;
  }
  .faq-item summary::-webkit-details-marker {
    display: none;
  }
  .faq-item summary:after {
    content: "+";
    position: absolute;
    right: 4px;
    top: 18px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--soft);
    color: var(--ink-2);
    font-size: 18px;
  }
  .faq-item[open] summary:after {
    content: "–";
  }
  .faq-answer {
    padding: 0 50px 22px 0;
    color: var(--muted);
    font-size: 15px;
  }
  .cta {
    padding: 42px;
    border-radius: 22px;
    background: linear-gradient(135deg,#5c52ec,#7c73ff 60%,#5d56d8);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    box-shadow: 0 26px 70px rgba(102,92,246,.25);
  }
  .cta h2 {
    color: #fff;
    font-size: clamp(28px,4vw,42px);
    margin-bottom: 8px;
  }
  .cta p {
    margin: 0;
    color: #e7e5ff;
  }
  .cta .button {
    background: #fff;
    color: #4338ca;
    box-shadow: none;
  }
  .cta .button:hover {
    background: #f8f7ff;
  }
  .site-footer {
    padding: 58px 0 28px;
    border-top: 1px solid var(--line);
    background: #fff;
  }
  .footer-grid {
    display: grid;
    grid-template-columns: 1.5fr repeat(3,1fr);
    gap: 48px;
  }
  .footer-brand p {
    max-width: 330px;
    color: var(--muted);
    font-size: 14px;
  }
  .footer-title {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 850;
    color: #475467;
    margin-bottom: 13px;
  }
  .footer-links {
    display: grid;
    gap: 9px;
  }
  .footer-links a {
    font-size: 14px;
    color: var(--muted);
  }
  .footer-links a:hover {
    color: var(--ink);
  }
  .footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    border-top: 1px solid var(--line);
    margin-top: 45px;
    padding-top: 22px;
    color: #98a2b3;
    font-size: 12px;
  }
  .reveal {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .55s ease,transform .55s ease;
  }
  .reveal.visible {
    opacity: 1;
    transform: none;
  }
  @media (max-width:1120px) {
    .nav-links {
      display: none;
    }
    .menu-button {
      display: grid;
      place-items: center;
      margin-left: auto;
    }
    .nav-actions .ghost {
      display: none;
    }
    .mobile-nav {
      display: none;
      position: fixed;
      left: 16px;
      right: 16px;
      top: 80px;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      box-shadow: var(--shadow-lg);
    }
    .mobile-nav.open {
      display: grid;
    }
    .mobile-nav a {
      padding: 12px;
      border-radius: 9px;
      font-weight: 700;
    }
    .mobile-nav a:hover {
      background: var(--soft);
    }
    .hero {
      padding-top: 65px;
    }
    .hero-grid,.experience-grid,.security-grid,.faq-layout {
      grid-template-columns: 1fr;
      gap: 45px;
    }
    .product-window {
      transform: none;
      max-width: 720px;
    }
    .api-grid {
      grid-template-columns: repeat(2,1fr);
    }
    .map-grid {
      grid-template-columns: 1fr;
    }
    .faq-intro {
      position: static;
    }
    .footer-grid {
      grid-template-columns: 1.5fr 1fr 1fr;
    }
    .footer-grid>div:last-child {
      grid-column: 2;
    }
    .trust-grid {
      grid-template-columns: repeat(2,1fr);
    }
    .trust-item:nth-child(2) {
      border-right: 0;
    }
    .trust-item:nth-child(-n+2) {
      border-bottom: 1px solid var(--line);
    }
  }
  @media (max-width:680px) {
    .site-container {
      width: min(calc(100% - 28px),var(--max));
    }
    .site-header .site-container {
      width: min(calc(100% - 28px),1320px);
    }
    .site-nav {
      height: 64px;
      gap: 10px;
    }
    .brand {
      font-size: 19px;
    }
    .brand-mark {
      width: 36px;
      height: 36px;
    }
    .brand-sub {
      display: none;
    }
    .nav-actions>.button {
      display: none;
    }
    .hero {
      padding: 52px 0 58px;
    }
    .hero-grid {
      gap: 42px;
    }
    .hero-actions {
      display: grid;
    }
    .hero-actions .button {
      width: 100%;
    }
    h1 {
      font-size: 42px;
    }
    .window-body {
      grid-template-columns: 100px 1fr;
      min-height: 360px;
    }
    .window-side {
      padding: 14px 8px;
    }
    .window-main {
      padding: 14px;
    }
    .window-metrics {
      grid-template-columns: 1fr 1fr;
    }
    .window-metric:last-child {
      display: none;
    }
    .section {
      padding: 70px 0;
    }
    .section-head {
      display: block;
    }
    .section-lead {
      margin-top: 18px;
    }
    .api-grid,.workflow,.security-points {
      grid-template-columns: 1fr;
    }
    .workflow-step:after {
      display: none;
    }
    .trust-item {
      padding: 18px;
    }
    .trust-item strong {
      font-size: 17px;
    }
    .map-demo,.map-demo svg {
      min-height: 350px;
    }
    .guard-panel {
      padding: 25px;
    }
    .cta {
      padding: 30px 24px;
      display: block;
    }
    .cta .button {
      margin-top: 24px;
      width: 100%;
    }
    .footer-grid {
      grid-template-columns: 1fr 1fr;
      gap: 32px;
    }
    .footer-brand {
      grid-column: 1/-1;
    }
    .footer-grid>div:last-child {
      grid-column: auto;
    }
    .footer-bottom {
      display: block;
    }
    .footer-bottom span {
      display: block;
      margin-top: 6px;
    }
  }
  @media (prefers-reduced-motion:reduce) {
    html {
      scroll-behavior: auto;
    }
    .reveal {
      opacity: 1;
      transform: none;
      transition: none;
    }
    .button {
      transition: none;
    }
  }
  .operator-footer .operator-identity {
    display: grid;
    gap: 4px;
    min-width: 0;
  }
  .operator-footer .operator-identity>span {
    display: block;
  }
  .auth-body {
    min-height: 100dvh;
    background: radial-gradient(circle at 15% 15%,rgba(103,92,246,.11),transparent 28%),radial-gradient(circle at 85% 90%,rgba(21,112,239,.08),transparent 30%),#f8fafc;
    color: #101828;
  }
  .auth-body:before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image: linear-gradient(rgba(16,24,40,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(16,24,40,.028) 1px,transparent 1px);
    background-size: 44px 44px;
    mask-image: linear-gradient(to bottom,#000,transparent 75%);
  }
  .auth-body .wrap {
    position: relative;
    z-index: 1;
    max-width: 1100px;
    padding: 22px 20px 60px;
  }
  .auth-body .nav {
    min-height: 56px;
  }
  .auth-body .brand {
    display: inline-flex;
    align-items: center;
    gap: 0;
    font-size: inherit;
  }
  .auth-body .brand:before,.auth-body .brand:after {
    display: none !important;
    content: none !important;
  }
  .auth-body .card {
    max-width: 520px !important;
    margin: 42px auto !important;
    padding: 32px;
    border: 1px solid #e4e7ec;
    border-radius: 18px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 24px 70px rgba(16,24,40,.11);
  }
  .auth-body .card h1 {
    font-size: 30px;
    line-height: 1.18;
    letter-spacing: -.04em;
    margin: 0 0 8px;
  }
  .auth-body .card>p:first-of-type {
    margin-top: 0;
  }
  .auth-body label {
    font-size: 12px;
    color: #475467;
  }
  .auth-body input {
    min-height: 46px;
    border-radius: 10px;
    margin-top: 7px;
  }
  .auth-body button,.auth-body .btn {
    min-height: 44px;
    border-radius: 10px;
    background: linear-gradient(180deg,#7065f8,#5b50e7);
    border-color: #5b50e7;
  }
  .auth-body form button:not(.secondary) {
    width: 100%;
    margin-top: 2px;
  }
  .auth-body .secondary {
    background: #fff !important;
    color: #344054 !important;
    border-color: #d0d5dd !important;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
  }
  .auth-body .flash {
    max-width: 520px;
    margin: 14px auto;
    border-radius: 11px;
  }
  .auth-body .row {
    align-items: center;
  }
  .auth-body .card a {
    font-weight: 700;
    color: #5b50e7;
  }
  .auth-body .card .muted {
    font-size: 13px;
  }
  .auth-body .cf-turnstile {
    margin: 6px 0 12px;
    max-width: 100%;
    overflow: hidden;
  }
  @media (max-width:560px) {
    .auth-body .wrap {
      padding: 14px 14px 35px;
    }
    .auth-body .card {
      margin: 25px auto !important;
      padding: 22px 18px;
      border-radius: 15px;
    }
    .auth-body .card h1 {
      font-size: 26px;
    }
    .auth-body input {
      font-size: 16px;
    }
    .auth-body .row {
      display: grid;
      grid-template-columns: 1fr;
    }
    .auth-body .row>* {
      width: 100%;
    }
  }
  .auth-body .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }
  .auth-body .auth-language {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
  }
  .auth-body .auth-language label {
    margin: 0;
  }
  .auth-body .auth-language select {
    min-width: 132px;
    min-height: 40px;
    margin: 0;
    font-size: 14px;
  }
  .auth-body .auth-language button {
    min-height: 40px;
    margin: 0;
    padding: 8px 12px;
  }
  .auth-body .auth-card {
    max-width: 520px;
    margin: clamp(28px,7vh,64px) auto;
    padding: clamp(24px,4vw,38px);
    border-radius: 20px;
  }
  .auth-body .auth-form {
    display: grid;
    gap: 16px;
  }
  .auth-body .auth-form label {
    display: grid;
    gap: 7px;
    font-weight: 700;
    color: #344054;
  }
  .auth-body .auth-form input {
    min-height: 48px;
    margin: 0;
    font-size: 16px;
  }
  .auth-body .auth-form button {
    width: 100%;
    min-height: 48px;
    margin: 2px 0 0;
  }
  .auth-body .auth-resend {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid #e4e7ec;
  }
  .auth-body .auth-resend form {
    display: grid;
    gap: 12px;
  }
  .auth-body .auth-resend button {
    width: 100%;
    min-height: 46px;
    margin: 0;
  }
  .auth-body .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
  }
  @media (max-width:560px) {
    .auth-body .nav {
      align-items: flex-start;
    }
    .auth-body .auth-language {
      display: grid;
      grid-template-columns: 1fr auto;
      max-width: 220px;
    }
    .auth-body .auth-language select {
      min-width: 0;
      width: 100%;
    }
    .auth-body .auth-card {
      margin: 24px auto;
      border-radius: 16px;
    }
  }
  :root {
    --ink: #101828;
    --ink-2: #344054;
    --muted: #667085;
    --line: #e4e7ec;
    --line-strong: #d0d5dd;
    --paper: #fff;
    --canvas: #f8fafc;
    --soft: #f2f4f7;
    --violet: #665cf6;
    --violet-dark: #5147df;
    --violet-soft: #f1f0ff;
    --green: #067647;
    --blue: #175cd3;
    --amber: #b54708;
    --code: #0c111d;
    --max: 1540px;
    --top: 68px;
    --shadow: 0 16px 48px rgba(16,24,40,.10);
  }
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
  }
  body {
    margin: 0;
    color: var(--ink);
    background: #fff;
    font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
  }
  body.docs-nav-open {
    overflow: hidden;
  }
  a {
    color: inherit;
    text-decoration: none;
  }
  button,input {
    font: inherit;
  }
  button:focus-visible,a:focus-visible,input:focus-visible {
    outline: 3px solid rgba(102,92,246,.24);
    outline-offset: 2px;
  }
  .docs-top {
    position: sticky;
    top: 0;
    z-index: 80;
    height: var(--top);
    background: rgba(255,255,255,.9);
    backdrop-filter: blur(18px) saturate(145%);
    border-bottom: 1px solid rgba(228,231,236,.88);
  }
  .docs-top-inner {
    max-width: var(--max);
    height: 100%;
    margin: auto;
    padding: 0 22px;
    display: flex;
    align-items: center;
    gap: 18px;
  }
  .docs-brand {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-weight: 800;
    letter-spacing: -.03em;
  }
  .docs-brand-mark {
    width: 31px;
    height: 31px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg,#847cfb,#5348e7);
    color: #fff;
    font-weight: 850;
    box-shadow: 0 6px 16px rgba(102,92,246,.24);
  }
  .docs-brand span:last-child {
    color: var(--muted);
    font-weight: 650;
    font-size: 13px;
    letter-spacing: 0;
  }
  .docs-search-top {
    position: relative;
    width: min(430px,38vw);
    margin-left: 22px;
  }
  .docs-search-top input {
    width: 100%;
    height: 38px;
    padding: 8px 78px 8px 36px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f9fafb;
    color: var(--ink);
    font-size: 13px;
  }
  .docs-search-top input:focus {
    background: #fff;
    border-color: #b7b1ff;
    box-shadow: 0 0 0 4px rgba(102,92,246,.1);
    outline: 0;
  }
  .docs-search-icon {
    position: absolute;
    left: 12px;
    top: 10px;
    color: #98a2b3;
    width: 17px;
    height: 17px;
  }
  .docs-search-key {
    position: absolute;
    right: 8px;
    top: 7px;
    padding: 3px 7px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    color: #98a2b3;
    font-size: 10px;
    font-weight: 750;
  }
  .docs-top-nav {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .docs-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 13px;
    border-radius: 9px;
    border: 1px solid var(--line-strong);
    background: #fff;
    color: var(--ink-2);
    font-size: 13px;
    font-weight: 750;
    cursor: pointer;
  }
  .docs-button:hover {
    background: var(--canvas);
  }
  .docs-button.primary {
    background: var(--violet);
    border-color: var(--violet);
    color: #fff;
  }
  .docs-button.primary:hover {
    background: var(--violet-dark);
  }
  .docs-mobile-nav {
    display: none;
  }
  .docs-shell {
    max-width: var(--max);
    margin: auto;
    display: grid;
    grid-template-columns: 260px minmax(0,1fr) 250px;
    min-height: calc(100vh - var(--top));
  }
  .docs-sidebar {
    border-right: 1px solid var(--line);
    padding: 25px 18px 60px;
    position: sticky;
    top: var(--top);
    height: calc(100vh - var(--top));
    overflow: auto;
    scrollbar-width: thin;
  }
  .docs-side-title {
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #98a2b3;
    font-weight: 850;
    margin: 25px 9px 7px;
  }
  .docs-side-title:first-child {
    margin-top: 0;
  }
  .docs-sidebar a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 7px 9px;
    border-radius: 7px;
    color: #5d6678;
    font-size: 13px;
    font-weight: 560;
  }
  .docs-sidebar a:hover,.docs-sidebar a.active {
    background: var(--violet-soft);
    color: #554be5;
  }
  .docs-sidebar .side-count {
    font-size: 10px;
    color: #98a2b3;
  }
  .docs-main {
    min-width: 0;
    padding: 50px clamp(28px,4vw,70px) 110px;
  }
  .docs-rail {
    border-left: 1px solid var(--line);
    padding: 28px 20px;
    position: sticky;
    top: var(--top);
    height: calc(100vh - var(--top));
    overflow: auto;
    background: #fcfcfd;
  }
  .docs-rail h3 {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: #98a2b3;
    margin: 0 0 12px;
  }
  .docs-rail a {
    display: block;
    color: #667085;
    font-size: 12px;
    padding: 5px 0;
  }
  .docs-rail a:hover {
    color: var(--violet);
  }
  .docs-rail-card {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: #fff;
    margin-top: 24px;
  }
  .docs-rail-card strong {
    font-size: 12px;
    display: block;
  }
  .docs-rail-card p {
    font-size: 11px;
    color: var(--muted);
    margin: 5px 0 10px;
  }
  .docs-hero {
    padding: 10px 0 58px;
    border-bottom: 1px solid var(--line);
  }
  .docs-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 9px;
    border: 1px solid #dedbff;
    border-radius: 999px;
    background: var(--violet-soft);
    color: #554be5;
    font-size: 11px;
    font-weight: 850;
  }
  .docs-hero h1 {
    font-size: clamp(40px,5vw,64px);
    line-height: 1.05;
    letter-spacing: -.05em;
    margin: 18px 0 18px;
    max-width: 900px;
  }
  .docs-lead {
    font-size: 19px;
    line-height: 1.65;
    color: var(--muted);
    max-width: 820px;
    margin: 0;
  }
  .docs-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 26px;
  }
  .docs-stats {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 12px;
    margin-top: 34px;
  }
  .docs-stat {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
  }
  .docs-stat strong {
    font-size: 23px;
    display: block;
    letter-spacing: -.03em;
  }
  .docs-stat span {
    color: var(--muted);
    font-size: 12px;
  }
  .docs-section {
    padding: 52px 0;
    border-bottom: 1px solid var(--line);
  }
  .docs-section h2 {
    font-size: 31px;
    line-height: 1.2;
    letter-spacing: -.035em;
    margin: 0 0 13px;
  }
  .docs-section h3 {
    font-size: 20px;
    line-height: 1.35;
    letter-spacing: -.025em;
    margin: 30px 0 9px;
  }
  .docs-copy {
    max-width: 820px;
    color: var(--muted);
    margin: 0;
  }
  .docs-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 14px;
    margin-top: 22px;
  }
  .docs-card {
    border: 1px solid var(--line);
    border-radius: 13px;
    padding: 20px;
    background: #fff;
  }
  .docs-card h3 {
    margin: 0 0 7px;
    font-size: 16px;
  }
  .docs-card p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
  }
  .docs-card-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--violet-soft);
    color: var(--violet);
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 850;
    margin-bottom: 15px;
  }
  .docs-code-wrap {
    position: relative;
    margin: 20px 0;
  }
  .docs-code-label {
    position: absolute;
    right: 13px;
    top: 11px;
    color: #667085;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .1em;
  }
  .docs-copy-button {
    position: absolute;
    right: 12px;
    bottom: 12px;
    border: 1px solid #344054;
    background: #182230;
    color: #d0d5dd;
    border-radius: 7px;
    padding: 6px 9px;
    font-size: 11px;
    cursor: pointer;
  }
  .docs-code {
    margin: 0;
    padding: 22px 22px 48px;
    border-radius: 13px;
    background: var(--code);
    color: #d0d5dd;
    overflow: auto;
    font: 12.5px/1.72 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
    white-space: pre;
  }
  .docs-note {
    border: 1px solid #d9d6fe;
    border-left: 4px solid var(--violet);
    background: #f9f8ff;
    padding: 14px 16px;
    border-radius: 0 10px 10px 0;
    color: #475467;
    margin: 20px 0;
    font-size: 13px;
  }
  .docs-note strong {
    color: #3730a3;
  }
  .docs-warning {
    border-color: #fedf89;
    border-left-color: #f79009;
    background: #fffaeb;
  }
  .docs-warning strong {
    color: #93370d;
  }
  .docs-list {
    padding-left: 20px;
    color: var(--muted);
  }
  .docs-list li {
    margin: 7px 0;
  }
  .docs-endpoint {
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
    margin: 13px 0;
    background: #fff;
  }
  .docs-endpoint-head {
    display: grid;
    grid-template-columns: auto minmax(180px,1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 12px 14px;
    background: #fcfcfd;
    border-bottom: 1px solid var(--line);
  }
  .docs-method {
    font: 850 10px/1 ui-monospace,monospace;
    padding: 6px 8px;
    border-radius: 6px;
    background: #ecfdf3;
    color: var(--green);
    min-width: 46px;
    text-align: center;
  }
  .docs-method.post {
    background: #eef4ff;
    color: var(--blue);
  }
  .docs-method.multi {
    background: #fff6ed;
    color: var(--amber);
  }
  .docs-method.internal {
    background: #f2f4f7;
    color: #667085;
  }
  .docs-path {
    font: 620 12px/1.5 ui-monospace,monospace;
    overflow-wrap: anywhere;
    color: #344054;
  }
  .docs-endpoint-link {
    font-size: 11px;
    color: var(--violet);
    font-weight: 750;
  }
  .docs-endpoint-body {
    padding: 12px 14px;
    color: var(--muted);
    font-size: 13px;
  }
  .docs-service {
    padding-top: 22px;
  }
  .docs-service-title {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 4px;
  }
  .docs-service-title h3 {
    margin: 0;
  }
  .docs-pill {
    font-size: 10px;
    background: #f2f4f7;
    color: #667085;
    border-radius: 99px;
    padding: 3px 7px;
  }
  .docs-group-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
  }
  .docs-group-count {
    color: #98a2b3;
    font-size: 12px;
  }
  .docs-map-demo {
    margin-top: 24px;
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
    background: #e9f1ed;
    min-height: 340px;
    position: relative;
  }
  .docs-map-demo svg {
    display: block;
    width: 100%;
    height: 340px;
  }
  .docs-map-overlay {
    position: absolute;
    left: 18px;
    top: 18px;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(16,24,40,.1);
    box-shadow: var(--shadow);
    border-radius: 12px;
    padding: 13px 15px;
    max-width: 260px;
  }
  .docs-map-overlay strong {
    display: block;
    font-size: 13px;
  }
  .docs-map-overlay span {
    font-size: 12px;
    color: var(--muted);
  }
  .docs-security-list {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 11px;
    margin-top: 20px;
  }
  .docs-security-item {
    display: flex;
    gap: 11px;
    border: 1px solid var(--line);
    border-radius: 11px;
    padding: 14px;
  }
  .docs-check {
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    border-radius: 7px;
    background: #ecfdf3;
    color: var(--green);
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 900;
  }
  .docs-security-item strong {
    display: block;
    font-size: 13px;
  }
  .docs-security-item span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
  }
  .docs-response {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
    font-size: 13px;
  }
  .docs-response:last-child {
    border-bottom: 0;
  }
  .docs-response code {
    font-weight: 800;
  }
  .docs-footer {
    padding-top: 48px;
    color: var(--muted);
    font-size: 12px;
  }
  .docs-empty {
    display: none;
    padding: 22px;
    border: 1px dashed var(--line-strong);
    border-radius: 12px;
    color: var(--muted);
    text-align: center;
  }
  .docs-hidden {
    display: none !important;
  }
  .docs-meta-line {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    color: #98a2b3;
    font-size: 11px;
    margin-top: 8px;
  }
  .docs-meta-line span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
  }
  .docs-kbd {
    font: 750 10px/1 ui-monospace,monospace;
    border: 1px solid var(--line);
    border-bottom-width: 2px;
    border-radius: 5px;
    padding: 3px 5px;
    background: #fff;
    color: #667085;
  }
  @media (max-width:1180px) {
    .docs-shell {
      grid-template-columns: 230px minmax(0,1fr);
    }
    .docs-rail {
      display: none;
    }
    .docs-main {
      padding-right: 40px;
      padding-left: 40px;
    }
  }
  @media (max-width:820px) {
    .docs-top-inner {
      padding: 0 14px;
    }
    .docs-search-top {
      display: none;
    }
    .docs-top-nav .secondary {
      display: none;
    }
    .docs-mobile-nav {
      display: inline-flex;
      padding: 8px 10px;
    }
    .docs-shell {
      display: block;
    }
    .docs-sidebar {
      display: none;
      position: fixed;
      z-index: 70;
      left: 0;
      right: 0;
      top: var(--top);
      height: calc(100dvh - var(--top));
      background: #fff;
      border-right: 0;
      padding: 22px;
      box-shadow: var(--shadow);
    }
    .docs-sidebar.open {
      display: block;
    }
    .docs-main {
      padding: 34px 18px 72px;
    }
    .docs-hero {
      padding-top: 4px;
    }
    .docs-lead {
      font-size: 17px;
    }
    .docs-grid,.docs-security-list {
      grid-template-columns: 1fr;
    }
    .docs-endpoint-head {
      grid-template-columns: auto 1fr;
    }
    .docs-endpoint-link {
      display: none;
    }
    .docs-code {
      font-size: 11.5px;
    }
    .docs-map-demo,.docs-map-demo svg {
      height: 290px;
      min-height: 290px;
    }
  }
  @media (max-width:520px) {
    .docs-brand span:last-child {
      display: none;
    }
    .docs-top-nav .primary {
      display: none;
    }
    .docs-stats {
      grid-template-columns: 1fr;
    }
    .docs-section {
      padding: 42px 0;
    }
    .docs-hero h1 {
      font-size: 39px;
    }
    .docs-group-head {
      display: block;
    }
    .docs-group-count {
      display: block;
      margin-top: 5px;
    }
    .docs-code {
      padding-left: 15px;
      padding-right: 15px;
    }
    .docs-response {
      grid-template-columns: 90px 1fr;
    }
  }
  @media (prefers-reduced-motion:reduce) {
    html {
      scroll-behavior: auto;
    }
  }
  .docs-preview {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 9px;
    border: 1px solid #f3c56b;
    border-radius: 999px;
    background: #fff8e8;
    color: #8a4b08;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
  }
  .docs-endpoint.is-preview {
    border-color: #efd9ad;
    background: linear-gradient(180deg,#fffdf8 0%,#fff 100%);
  }
  .docs-preview-note {
    display: block;
    margin-top: 8px;
    color: #7a5421;
    font-size: .88rem;
    line-height: 1.55;
  }
  .docs-endpoint.is-preview .docs-method {
    opacity: .82;
  }
  :root {
    --tw-brand: #6657f4;
    --tw-brand-dark: #403477;
    --tw-ink: #111526;
    --tw-canvas: #f6f7fb;
    --tw-line: #e2e8f0;
    --tw-muted: #64748b;
  }
  .app-body .app-main {
    min-width: 0;
  }
  .app-body .card,.app-body .panel {
    min-width: 0;
    overflow: visible;
  }
  .app-body .report-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 16px !important;
    align-items: end !important;
  }
  .app-body .report-filter-grid .form-actions {
    grid-column: 1/-1 !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin: 0 !important;
  }
  .app-body .metric-grid {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 16px !important;
    margin: 0 0 22px !important;
  }
  .app-body .metric-grid .metric-card {
    display: block !important;
    min-height: 128px !important;
    padding: 20px !important;
    border: 1px solid var(--tw-line) !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 8px 25px rgba(15,23,42,.05) !important;
  }
  .app-body .metric-grid .metric-card:before {
    content: "";
    display: block;
    width: 32px;
    height: 4px;
    margin-bottom: 18px;
    border-radius: 999px;
    background: var(--tw-brand);
  }
  .app-body .metric-grid .metric-card span {
    display: block !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    color: var(--tw-muted) !important;
  }
  .app-body .metric-grid .metric-card strong {
    display: block !important;
    margin-top: 8px !important;
    font-size: 30px !important;
    line-height: 1 !important;
    color: #0f172a !important;
  }
  .app-body .code-block {
    display: block !important;
    width: 100% !important;
    min-height: 64px !important;
    max-height: 520px !important;
    overflow: auto !important;
    white-space: pre-wrap !important;
    overflow-wrap: anywhere !important;
    padding: 16px !important;
    border-radius: 12px !important;
    background: #0f172a !important;
    color: #e2e8f0 !important;
    font: 12px/1.65 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace !important;
  }
  .app-body pre.code-block:empty:before {
    content: "No log entries found.";
    color: #94a3b8;
  }
  .app-body .form-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 16px !important;
    align-items: start !important;
  }
  .app-body .form-grid.two {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .app-body .form-grid .field-full,.app-body .form-grid .span-2 {
    grid-column: 1/-1 !important;
  }
  .app-body .field {
    min-width: 0 !important;
    width: 100% !important;
  }
  .app-body .field input,.app-body .field select,.app-body .field textarea {
    width: 100% !important;
    max-width: none !important;
  }
  .app-body .inline {
    display: flex !important;
    align-items: flex-end !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
  }
  .app-body .inline>.field {
    flex: 1 1 220px !important;
  }
  .app-body .inline>button,.app-body .inline>.btn {
    flex: 0 0 auto !important;
  }
  .app-body .table-wrap {
    width: 100% !important;
    overflow: auto !important;
  }
  .app-body .table-wrap table {
    width: 100% !important;
    min-width: 760px !important;
  }
  .app-body .card>.table-wrap:only-child {
    margin: 0 !important;
  }
  .app-body .service-management-table {
    table-layout: auto !important;
  }
  .app-body .service-management-table td:first-child {
    min-width: 300px !important;
  }
  .app-body .service-management-table td:last-child {
    min-width: 330px !important;
  }
  .app-body .table-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
  }
  .app-body .table-actions form {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
  }
  .app-body .table-actions input {
    min-width: 180px !important;
    max-width: 280px !important;
  }
  .app-body[data-admin-page="data-sources"] .app-main>.grid,.app-body[data-admin-page="map-embeds"] .app-main>.grid {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
    gap: 20px !important;
    align-items: start !important;
  }
  .app-body[data-admin-page="data-sources"] .app-main>.grid>.card,.app-body[data-admin-page="map-embeds"] .app-main>.grid>.card {
    height: auto !important;
    margin-bottom: 0 !important;
  }
  .app-body[data-admin-page="map-embeds"] .form-grid {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
  .app-body[data-admin-page="map-embeds"] .form-grid .span-2 {
    grid-column: span 2 !important;
  }
  .app-body[data-admin-page="map-embeds"] .form-grid .field-full {
    grid-column: 1/-1 !important;
  }
  .app-body[data-admin-page="email"] .form-grid,.app-body[data-admin-page="payments"] .form-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .app-body[data-admin-page="email"] .card,.app-body[data-admin-page="payments"] .card,.app-body[data-admin-page="deliverability"] .card {
    height: auto !important;
  }
  .app-body[data-admin-page="email"] textarea {
    min-height: 120px !important;
  }
  .app-body[data-admin-page="permissions"] .inline {
    display: grid !important;
    grid-template-columns: minmax(220px,1fr) minmax(220px,1fr) minmax(150px,.5fr) auto !important;
  }
  .app-body[data-admin-page="security"] .card .row {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 18px !important;
    align-items: start !important;
  }
  .app-body input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    min-height: 0 !important;
    padding: 0 !important;
    accent-color: var(--tw-brand) !important;
  }
  .app-body input[type="radio"] {
    width: 18px !important;
    height: 18px !important;
    min-height: 0 !important;
    padding: 0 !important;
    accent-color: var(--tw-brand) !important;
  }
  @media (max-width:1100px) {
    .app-body .metric-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="map-embeds"] .form-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="permissions"] .inline {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (max-width:760px) {
    .app-body .report-filter-grid,.app-body .form-grid,.app-body .form-grid.two,.app-body .metric-grid,.app-body[data-admin-page="data-sources"] .app-main>.grid,.app-body[data-admin-page="map-embeds"] .app-main>.grid,.app-body[data-admin-page="map-embeds"] .form-grid,.app-body[data-admin-page="email"] .form-grid,.app-body[data-admin-page="payments"] .form-grid,.app-body[data-admin-page="permissions"] .inline,.app-body[data-admin-page="security"] .card .row {
      grid-template-columns: 1fr !important;
    }
    .app-body .form-grid .field-full,.app-body .form-grid .span-2,.app-body[data-admin-page="map-embeds"] .form-grid .span-2 {
      grid-column: 1 !important;
    }
    .app-body .report-filter-grid .form-actions {
      grid-column: 1 !important;
      justify-content: stretch !important;
    }
    .app-body .report-filter-grid .form-actions>* {
      flex: 1 1 auto !important;
    }
  }
  .grid {
    display: grid;
    gap: 1rem;
  }
  .grid.two {
    display: grid;
    gap: 1rem;
  }
  .grid>.card,.grid>.panel {
    margin-bottom: 0;
  }
  .panel-title {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    margin-bottom: 1rem;
  }
  .panel-title h2 {
    margin-bottom: .25rem;
  }
  .panel-title p {
    margin: 0;
    color: #64748b;
    font-size: .875rem;
    line-height: 1.5rem;
  }
  .stats {
    display: grid;
    gap: 1rem;
    margin-bottom: 1.25rem;
  }
  .stats>div,.mail-health-grid>div {
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    background: #f8fafc;
    padding: 1rem;
  }
  .stats span,.mail-health-grid span {
    display: block;
    color: #64748b;
    font-size: .625rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
  }
  .stats strong,.mail-health-grid strong {
    display: block;
    margin-top: .5rem;
    overflow-wrap: anywhere;
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 700;
  }
  .mail-health-grid {
    display: grid;
    gap: .75rem;
  }
  .compact {
    min-height: 2.25rem;
    padding: .375rem .75rem;
    font-size: .75rem;
  }
  .report-filter-grid {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem !important;
  }
  .report-filter-grid .form-actions {
    grid-column: 1 !important;
    justify-content: flex-start !important;
  }
  .app-body[data-admin-page=permissions] .card form.grid {
    display: grid;
    gap: 1rem;
  }
  .app-body[data-admin-page=email] .panel>.grid {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 1rem;
  }
  .app-body[data-admin-page=email] .panel form.card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: .5rem;
  }
  .app-body[data-admin-page=email] .panel form.card textarea {
    min-height: 8rem;
  }
  .app-body[data-admin-page=deliverability] .app-main>.grid {
    display: grid;
    gap: 1rem;
  }
  .app-body[data-admin-page=deliverability] .app-main>.grid .card {
    min-height: 10rem;
  }
  .app-body[data-admin-page=data-sources] .grid.two,.app-body[data-admin-page=data-sources] .form-grid {
    display: grid;
    gap: 1rem;
  }
  .app-body[data-admin-page=map-embeds] .app-main>.grid:first-of-type {
    display: grid;
    gap: 1rem;
  }
  .app-body[data-admin-page=map-embeds] form>.grid {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 1rem;
  }
  .app-body[data-admin-page=map-embeds] form label {
    display: block;
    min-width: 0;
    color: #334155;
    font-size: .875rem;
    font-weight: 700;
  }
  .app-body[data-admin-page=map-embeds] form label input,.app-body[data-admin-page=map-embeds] form label select,.app-body[data-admin-page=map-embeds] form label textarea {
    margin-top: .375rem;
  }
  .app-body[data-admin-page=payments] .card>form.row {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 1rem;
    align-items: end;
  }
  .app-body[data-admin-page=payments] .grid.two {
    display: grid;
    gap: 1.25rem;
  }
  .app-body[data-admin-page=payments] .grid.two form {
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    background: #f8fafc;
    padding: 1rem;
  }
  .app-body[data-admin-page=security] form>label.row {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    margin-bottom: .75rem;
    border: 1px solid #e2e8f0;
    border-radius: .75rem;
    background: #f8fafc;
    padding: 1rem;
  }
  .app-body[data-admin-page=security] form>label.row input {
    flex-shrink: 0;
    margin-top: .125rem;
  }
  .app-body[data-admin-page=services] .table-actions form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
  }
  .app-body[data-admin-page=services] .table-actions input:not([type=hidden]) {
    min-width: 12rem;
    flex: 1;
  }
  .app-body[data-admin-page=accounts] .card table,.app-body[data-admin-page=permissions] .card table,.app-body[data-admin-page=payments] .card table {
    min-width: 760px;
  }
  @media (min-width:640px) {
    .stats {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .mail-health-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .app-body[data-admin-page=deliverability] .app-main>.grid,.app-body[data-admin-page=map-embeds] .app-main>.grid:first-of-type {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (min-width:768px) {
    .grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .report-filter-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .report-filter-grid .form-actions {
      grid-column: 1/-1 !important;
      justify-content: flex-end !important;
    }
    .app-body[data-admin-page=permissions] .card form.grid {
      grid-template-columns: minmax(0,1fr) minmax(0,1.5fr) minmax(8rem,.6fr) auto;
      align-items: end;
    }
    .app-body[data-admin-page=map-embeds] form>.grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .app-body[data-admin-page=payments] .card>form.row {
      grid-template-columns: minmax(13rem,1fr) minmax(12rem,1fr) auto;
    }
  }
  @media (min-width:1024px) {
    .app-body[data-admin-page=email] .panel>.grid,.app-body[data-admin-page=data-sources] .grid.two,.app-body[data-admin-page=payments] .grid.two {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (min-width:1280px) {
    .stats {
      grid-template-columns: repeat(5,minmax(0,1fr));
    }
    .mail-health-grid {
      grid-template-columns: repeat(4,minmax(0,1fr));
    }
    .app-body[data-admin-page=email] .panel:nth-of-type(5)>.grid {
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
    .app-body[data-admin-page=deliverability] .app-main>.grid,.app-body[data-admin-page=map-embeds] .app-main>.grid:first-of-type {
      grid-template-columns: repeat(4,minmax(0,1fr));
    }
    .app-body[data-admin-page=map-embeds] form>.grid {
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
  }
  .app-body .grid,.app-body .grid.two,.app-body .admin-form-grid {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem !important;
    align-items: start;
  }
  .app-body .grid>*,.app-body .admin-form-grid>* {
    min-width: 0;
  }
  @media (min-width:768px) {
    .app-body .grid,.app-body .grid.two,.app-body .admin-form-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  .app-body form>label,.app-body form>div>label {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: .4rem;
    color: #334155;
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.35;
  }
  .app-body form label>small {
    font-weight: 400;
  }
  .app-body form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.app-body form select,.app-body form textarea {
    width: 100%;
    min-width: 0;
  }
  .app-body input[type=color] {
    min-height: 2.75rem;
    padding: .3rem;
  }
  .app-body[data-admin-page=stats] .report-filter-grid {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem !important;
  }
  @media (min-width:900px) {
    .app-body[data-admin-page=stats] .report-filter-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  .app-body[data-admin-page=stats] .report-filter-grid .form-actions {
    grid-column: 1/-1 !important;
    justify-content: flex-end;
  }
  .mail-metric-grid,.app-body[data-admin-page=deliverability] .metric-grid,.app-body[data-admin-page=map-embeds] .app-main>.grid:first-of-type {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem !important;
  }
  @media (min-width:640px) {
    .mail-metric-grid,.app-body[data-admin-page=deliverability] .metric-grid,.app-body[data-admin-page=map-embeds] .app-main>.grid:first-of-type {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (min-width:1280px) {
    .mail-metric-grid,.app-body[data-admin-page=deliverability] .metric-grid,.app-body[data-admin-page=map-embeds] .app-main>.grid:first-of-type {
      grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    }
  }
  .email-card-grid {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem !important;
  }
  @media (min-width:1024px) {
    .email-card-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (min-width:1536px) {
    .app-body[data-admin-page=email] .email-card-grid {
      grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    }
  }
  .email-card-grid>form {
    min-width: 0;
    margin: 0;
  }
  .map-embed-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
  }
  .map-embed-fields {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 1rem;
  }
  @media (min-width:720px) {
    .map-embed-fields {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (min-width:1180px) {
    .map-embed-fields {
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
  }
  .map-embed-fields>label,.map-embed-json-grid>label {
    min-width: 0;
  }
  .map-embed-json-grid {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 1rem;
  }
  @media (min-width:900px) {
    .map-embed-json-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  .map-embed-json-grid textarea {
    min-height: 11rem;
  }
  .map-embed-options {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: .75rem;
    padding: 1rem;
    border: 1px solid #e2e8f0;
    border-radius: .875rem;
    background: #f8fafc;
  }
  @media (min-width:640px) {
    .map-embed-options {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (min-width:1100px) {
    .map-embed-options {
      grid-template-columns: repeat(4,minmax(0,1fr));
    }
  }
  .map-embed-options label {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: .65rem !important;
    min-height: 2.5rem;
    margin: 0;
    font-weight: 600 !important;
  }
  .map-embed-options input[type=checkbox] {
    flex: 0 0 auto;
  }
  .map-embed-actions {
    display: flex;
    justify-content: flex-end;
  }
  .map-embed-actions button {
    min-width: 11rem;
  }
  .app-body[data-admin-page=permissions] form.grid {
    grid-template-columns: minmax(0,1fr) !important;
  }
  @media (min-width:980px) {
    .app-body[data-admin-page=permissions] form.grid {
      grid-template-columns: minmax(12rem,1fr) minmax(18rem,1.5fr) minmax(9rem,.6fr) auto !important;
      align-items: end;
    }
  }
  .app-body[data-admin-page=data-sources] .grid.two {
    grid-template-columns: minmax(0,1fr) !important;
  }
  @media (min-width:1200px) {
    .app-body[data-admin-page=data-sources] .grid.two {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  .app-body[data-admin-page=payments] .card>form.row {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem;
    align-items: end;
  }
  @media (min-width:900px) {
    .app-body[data-admin-page=payments] .card>form.row {
      grid-template-columns: minmax(14rem,1fr) minmax(14rem,1fr) auto !important;
    }
  }
  .app-body[data-admin-page=security] form>label.row {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start;
    gap: .75rem;
  }
  .app-body[data-admin-page=services] .table-actions,.app-body[data-admin-page=services] .table-actions form {
    min-width: 0;
  }
  .app-body[data-admin-page=services] .table-actions form {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
  }
  @media (max-width:767px) {
    .app-main {
      padding-left: 1rem;
      padding-right: 1rem;
    }
    .card,.panel {
      border-radius: 1rem;
    }
    .top-actions {
      width: 100%;
    }
    .environment-pill,.top-action-link,.user-menu {
      max-width: 100%;
    }
  }
  .app-body .card>form,.app-body .panel>form {
    width: 100%;
    max-width: none;
    min-width: 0;
  }
  .app-body .card form>div,.app-body .panel form>div {
    min-width: 0;
  }
  .app-body[data-admin-page=map-embeds] .map-embed-form {
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 1.25rem !important;
  }
  .app-body[data-admin-page=map-embeds] .map-embed-fields {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem !important;
    align-items: start !important;
  }
  @media (min-width:760px) {
    .app-body[data-admin-page=map-embeds] .map-embed-fields {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (min-width:1280px) {
    .app-body[data-admin-page=map-embeds] .map-embed-fields {
      grid-template-columns: repeat(3,minmax(15rem,1fr)) !important;
    }
  }
  .app-body[data-admin-page=map-embeds] .map-embed-fields>label,.app-body[data-admin-page=map-embeds] .map-embed-json-grid>label {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: .4rem !important;
  }
  .app-body[data-admin-page=map-embeds] .map-embed-fields input,.app-body[data-admin-page=map-embeds] .map-embed-fields select,.app-body[data-admin-page=map-embeds] .map-embed-fields textarea,.app-body[data-admin-page=map-embeds] .map-embed-json-grid textarea,.app-body[data-admin-page=map-embeds] .map-embed-form>label>textarea {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  .app-body[data-admin-page=map-embeds] .map-embed-json-grid {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1rem !important;
  }
  @media (min-width:980px) {
    .app-body[data-admin-page=map-embeds] .map-embed-json-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  .app-body[data-admin-page=map-embeds] .map-embed-options {
    display: grid !important;
    width: 100% !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: .75rem !important;
  }
  @media (min-width:700px) {
    .app-body[data-admin-page=map-embeds] .map-embed-options {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (min-width:1180px) {
    .app-body[data-admin-page=map-embeds] .map-embed-options {
      grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    }
  }
  .app-body[data-admin-page=map-embeds] .map-embed-options label {
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: .65rem !important;
    white-space: normal !important;
  }
  .app-body[data-admin-page=map-embeds] .map-embed-actions {
    display: flex !important;
    width: 100% !important;
    justify-content: flex-end !important;
  }
  .app-body[data-admin-page=email] .email-card-grid,.app-body[data-admin-page=email] .email-card-grid>form,.app-body[data-admin-page=email] .panel form.card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  .app-body[data-admin-page=email] .panel form.card>label {
    width: 100% !important;
  }
  .app-body[data-admin-page=payments] .card>form.row,.app-body[data-admin-page=deliverability] .card>form,.app-body[data-admin-page=data-sources] .card>form {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  :root {
    --ui-ink: #182033;
    --ui-text: #344054;
    --ui-muted: #667085;
    --ui-line: #d7ddea;
    --ui-panel: #fff;
    --ui-soft: #f7f8fc;
    --ui-purple: #5147c7;
    --ui-purple-dark: #37306f;
  }
  .app-body {
    color: var(--ui-text);
  }
  .app-body .top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
  }
  .app-body :is(.environment-pill,.top-action-link,.user-menu>summary) {
    height: 46px;
    min-height: 46px;
    border: 1px solid var(--ui-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(16,24,40,.05);
    color: #344054;
  }
  .app-body .environment-pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
  }
  .app-body .top-action-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 750;
    text-decoration: none;
  }
  .app-body .top-action-link svg {
    width: 19px;
    height: 19px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.8;
  }
  .app-body .user-menu {
    position: relative;
    margin: 0;
    min-width: 220px;
  }
  .app-body .user-menu>summary {
    display: grid;
    grid-template-columns: 36px minmax(0,1fr) 18px;
    align-items: center;
    gap: 10px;
    padding: 4px 12px 4px 5px;
    cursor: pointer;
    list-style: none;
  }
  .app-body .user-menu>summary::-webkit-details-marker {
    display: none;
  }
  .app-body .user-menu[open]>summary {
    border-color: #9d97ff;
    box-shadow: 0 0 0 3px rgba(99,91,255,.14);
  }
  .app-body .avatar {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg,#756cf7,#5147c7);
    color: #fff;
    font-weight: 800;
  }
  .app-body .user-meta {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.15;
  }
  .app-body .user-meta b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #26324a;
    font-size: 13px;
  }
  .app-body .user-meta small {
    margin-top: 4px;
    color: #667085;
    font-size: 11px;
  }
  .app-body .user-chevron svg {
    width: 17px;
    height: 17px;
    stroke: #667085;
    fill: none;
    stroke-width: 2;
    transition: transform .18s ease;
  }
  .app-body .user-menu-popover {
    position: absolute;
    z-index: 100;
    right: 0;
    top: calc(100% + 8px);
    display: grid;
    min-width: 230px;
    padding: 8px;
    border: 1px solid var(--ui-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(16,24,40,.18);
  }
  .app-body .user-menu:not([open]) .user-menu-popover {
    display: none;
  }
  .app-body .user-menu-email {
    padding: 10px 11px;
    border-bottom: 1px solid #eaecf0;
    color: #667085;
    font-size: 12px;
    overflow-wrap: anywhere;
  }
  .app-body .user-menu-popover a {
    display: block;
    padding: 10px 11px;
    border-radius: 9px;
    color: #344054;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
  }
  .app-body .user-menu-popover a:hover {
    background: #f2f1ff;
    color: #302a78;
  }
  .app-body .side-group {
    border: 1px solid rgba(211,218,232,.95);
    background: #f8f9fc;
  }
  .app-body .side-group>summary {
    color: #667085;
    font-weight: 800;
    letter-spacing: .14em;
  }
  .app-body .side-link {
    color: #475467 !important;
    font-weight: 700;
  }
  .app-body .side-link .side-icon {
    color: #667085;
    background: #eef1f6;
  }
  .app-body .side-link:hover {
    background: #ecebff;
    color: #29245f !important;
  }
  .app-body .side-link:hover .side-icon {
    color: #4037a5;
    background: #dedbff;
  }
  .app-body .side-link.active {
    color: #fff !important;
    background: var(--ui-purple-dark);
  }
  .app-body .side-link.active .side-icon {
    color: #fff;
    background: rgba(255,255,255,.12);
  }
  .app-body .side-link:focus-visible,.app-body .top-action-link:focus-visible,.app-body .user-menu>summary:focus-visible {
    outline: 3px solid rgba(99,91,255,.35);
    outline-offset: 2px;
  }
  .app-body[data-admin-page="stats"] .report-toolbar {
    padding: 22px 24px;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 14px 16px !important;
    align-items: end !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid .field:first-child {
    grid-column: span 2;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid .form-actions {
    grid-column: span 2 !important;
    align-self: end;
    justify-content: flex-end !important;
    min-height: 44px;
  }
  .app-body[data-admin-page="stats"] .metric-grid {
    margin-top: 18px;
  }
  @media (max-width:1100px) {
    .app-body[data-admin-page="stats"] .report-filter-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid .field:first-child {
      grid-column: span 2;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid .form-actions {
      grid-column: span 2 !important;
    }
  }
  @media (max-width:650px) {
    .app-body[data-admin-page="stats"] .report-filter-grid {
      grid-template-columns: 1fr !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid .field:first-child,.app-body[data-admin-page="stats"] .report-filter-grid .form-actions {
      grid-column: 1 !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid .form-actions {
      justify-content: stretch !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid .form-actions>* {
      flex: 1;
    }
  }
  .app-body[data-admin-page="accounts"] .app-main>.card {
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
  }
  .app-body[data-admin-page="accounts"] .card>table,.app-body[data-admin-page="accounts"] .card>.table-wrap {
    width: 100%;
  }
  .app-body[data-admin-page="accounts"] .card>table {
    display: block;
    overflow-x: auto;
    border: 1px solid var(--ui-line);
    border-radius: 12px;
  }
  .app-body[data-admin-page="accounts"] .card>table tbody {
    display: table;
    width: 100%;
    min-width: 760px;
  }
  .app-body[data-admin-page="accounts"] .card form.row {
    display: flex !important;
    flex-wrap: wrap;
    align-items: end;
    gap: 10px !important;
  }
  .app-body[data-admin-page="accounts"] .card form.row select {
    min-width: 150px;
  }
  .app-body[data-admin-page="accounts"] .card form.grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .app-body[data-admin-page="accounts"] .card form.grid button {
    justify-self: start;
  }
  @media (max-width:760px) {
    .app-body[data-admin-page="accounts"] .card form.grid {
      grid-template-columns: 1fr !important;
    }
  }
  .app-body .card,.app-body .panel {
    border-color: #dfe3ec;
    box-shadow: 0 8px 22px rgba(16,24,40,.045);
  }
  .app-body .card h2,.app-body .panel h2 {
    color: #172033;
  }
  .app-body .muted {
    color: #667085 !important;
  }
  .app-body input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.app-body select,.app-body textarea {
    border-color: #cfd6e3;
    background: #fff;
    color: #1d2939;
    box-shadow: inset 0 1px 2px rgba(16,24,40,.03);
  }
  .app-body input:focus,.app-body select:focus,.app-body textarea:focus {
    border-color: #756cf7 !important;
    box-shadow: 0 0 0 3px rgba(99,91,255,.13) !important;
    outline: 0;
  }
  .app-body button,.app-body .btn {
    min-height: 42px;
    border-radius: 10px;
    font-weight: 750;
  }
  .app-body .table-wrap {
    border: 1px solid var(--ui-line);
    border-radius: 12px;
    overflow: auto;
    background: #fff;
  }
  .app-body table {
    width: 100%;
  }
  .app-body th {
    color: #475467;
    background: #f8f9fc;
  }
  .app-body td {
    color: #344054;
  }
  .app-body[data-admin-page="deliverability"] .metric-grid {
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
  }
  .app-body[data-admin-page="deliverability"] .metric-card {
    min-height: 145px;
  }
  .app-body[data-admin-page="deliverability"] .card form button {
    width: auto;
    min-width: 150px;
    margin-right: 8px;
  }
  .app-body[data-admin-page="email"] .email-card-grid {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
  .app-body[data-admin-page="email"] .email-card-grid>form {
    padding: 18px;
  }
  .app-body[data-admin-page="email"] textarea {
    min-height: 130px;
  }
  .app-body[data-admin-page="data-sources"] .grid.two {
    grid-template-columns: minmax(0,1fr) minmax(420px,.82fr) !important;
    gap: 20px !important;
  }
  .app-body[data-admin-page="data-sources"] .grid.two>.card {
    height: max-content;
  }
  .app-body[data-admin-page="actoki-suite"] .app-main>.grid.two {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .app-body[data-admin-page="actoki-suite"] .app-main>.grid.two input {
    min-width: 0;
  }
  .app-body[data-admin-page="maps"] .card>form.grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .app-body[data-admin-page="maps"] .card>table {
    display: block;
    overflow: auto;
  }
  .app-body[data-admin-page="maps"] .card>table tbody {
    display: table;
    width: 100%;
    min-width: 760px;
  }
  @media (max-width:1050px) {
    .app-body[data-admin-page="deliverability"] .metric-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="email"] .email-card-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="data-sources"] .grid.two {
      grid-template-columns: 1fr !important;
    }
  }
  @media (max-width:700px) {
    .app-body[data-admin-page="deliverability"] .metric-grid,.app-body[data-admin-page="email"] .email-card-grid,.app-body[data-admin-page="actoki-suite"] .app-main>.grid.two,.app-body[data-admin-page="maps"] .card>form.grid {
      grid-template-columns: 1fr !important;
    }
  }
  .app-body[data-admin-page="domain-guard"] .domain-guard-status {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border: 1px solid #f2c94c;
    border-radius: 12px;
    background: #fff9e8;
    color: #694d00;
  }
  .app-body[data-admin-page="domain-guard"] .domain-guard-status strong {
    display: block;
    color: #513b00;
  }
  .app-body[data-admin-page="domain-guard"] .domain-guard-status p {
    margin: 4px 0 0;
  }
  .app-body[data-admin-page="domain-guard"] form.row {
    display: flex !important;
    flex-wrap: wrap;
    align-items: end;
    gap: 12px !important;
  }
  .app-body[data-admin-page="domain-guard"] form.row>.field {
    flex: 1 1 180px;
  }
  .app-body[data-admin-page="domain-guard"] form.row>input,.app-body[data-admin-page="domain-guard"] form.row>select {
    flex: 1 1 180px;
    max-width: none !important;
  }
  .app-body .topbar {
    overflow: visible;
    position: relative;
    z-index: 40;
  }
  .app-body .top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    overflow: visible;
  }
  .app-body .environment-pill,.app-body .top-action-link,.app-body .user-menu>summary {
    box-sizing: border-box;
    height: 48px;
    min-height: 48px;
    border-radius: 14px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    line-height: 1;
    background: #fff;
    border: 1px solid #d7deea;
    box-shadow: 0 2px 7px rgba(16,24,40,.05);
    font-size: 12px;
    font-weight: 750;
    color: #344054;
  }
  .app-body .environment-pill {
    border-radius: 999px;
  }
  .app-body .user-menu>summary {
    padding: 4px 10px 4px 5px;
    min-width: 220px;
  }
  .app-body .user-menu {
    position: relative;
    z-index: 100;
    overflow: visible;
  }
  .app-body .user-menu-popover {
    z-index: 1200;
    top: calc(100% + 8px);
  }
  .app-body .user-menu>summary:focus-visible,.app-body .top-action-link:focus-visible {
    outline: 3px solid rgba(91,80,230,.22);
    outline-offset: 2px;
  }
  @media (max-width:760px) {
    .app-body .top-actions {
      width: 100%;
      justify-content: flex-start;
      flex-wrap: wrap;
    }
    .app-body .top-actions>* {
      flex: 1 1 auto;
      justify-content: center;
    }
    .app-body .user-menu {
      flex: 1 1 100%;
    }
    .app-body .user-menu>summary {
      width: 100%;
    }
  }
  .app-body .top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: nowrap;
    overflow: visible;
  }
  .app-body .top-actions :is(.environment-pill,.top-action-link,.user-menu>summary) {
    height: 52px !important;
    min-height: 52px !important;
    border: 1px solid #d7deea !important;
    border-radius: 15px !important;
    background: #fff !important;
    box-shadow: 0 3px 10px rgba(16,24,40,.06) !important;
    color: #344054 !important;
  }
  .app-body .environment-pill {
    padding: 0 17px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }
  .app-body .top-action-link {
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    white-space: nowrap;
  }
  .app-body .user-menu {
    min-width: 242px !important;
    z-index: 1500 !important;
  }
  .app-body .user-menu>summary {
    display: grid !important;
    grid-template-columns: 40px minmax(0,1fr) 20px !important;
    gap: 11px !important;
    padding: 5px 13px 5px 6px !important;
    width: 100% !important;
  }
  .app-body .user-menu .avatar {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
    border-radius: 11px !important;
  }
  .app-body .user-menu .user-meta {
    max-width: none !important;
    min-width: 0 !important;
  }
  .app-body .user-menu .user-meta b {
    font-size: 13px !important;
  }
  .app-body .user-menu .user-meta small {
    font-size: 11px !important;
  }
  .app-body .user-chevron {
    display: grid !important;
    place-items: center !important;
    width: 20px !important;
    height: 20px !important;
    justify-self: end !important;
    margin: 0 !important;
  }
  .app-body .user-chevron svg {
    display: block !important;
    width: 17px !important;
    height: 17px !important;
    transform-origin: center !important;
  }
  .app-body .user-menu-popover {
    z-index: 5000 !important;
  }
  .app-body .side-group summary {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 18px !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .app-body .side-group summary:after {
    display: grid !important;
    place-items: center !important;
    width: 18px !important;
    height: 18px !important;
    justify-self: end !important;
    line-height: 1 !important;
    transform-origin: center !important;
  }
  .app-body .side-group[open] summary:after {
    transform: rotate(180deg) !important;
  }
  .app-body[data-admin-page="stats"] .report-toolbar {
    padding: 24px !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 16px !important;
    align-items: end !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.field {
    min-width: 0 !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.form-actions {
    grid-column: span 3 !important;
    justify-content: flex-end !important;
    align-self: end !important;
    margin: 0 !important;
  }
  @media (max-width:1180px) {
    .app-body[data-admin-page="stats"] .report-filter-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(1) {
      grid-column: span 2 !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>.form-actions {
      grid-column: span 2 !important;
    }
  }
  @media (max-width:680px) {
    .app-body[data-admin-page="stats"] .report-filter-grid {
      grid-template-columns: 1fr !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>* {
      grid-column: 1 !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>.form-actions {
      justify-content: stretch !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>.form-actions>* {
      flex: 1 1 0 !important;
    }
  }
  .app-body[data-admin-page="actoki-suite"] .suite-tool-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
    align-items: start;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-tool-card {
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-tool-form {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    gap: 14px !important;
    align-items: end !important;
    margin-top: auto !important;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-tool-form .field {
    min-width: 0 !important;
    margin: 0 !important;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-tool-form input:not([type=checkbox]) {
    width: 100% !important;
    min-width: 0 !important;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-tool-form button {
    min-width: 150px !important;
    white-space: normal !important;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-check-row {
    grid-column: 1/-1;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-check-row input {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-map-toolbar {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) auto !important;
    gap: 12px !important;
    align-items: end !important;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-map-toolbar label {
    display: grid;
    gap: 7px;
    font-weight: 750;
    color: #344054;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-map-status {
    margin-top: 14px;
    padding: 11px 13px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
    color: #475467;
    font-size: 12px;
  }
  .app-body[data-admin-page="actoki-suite"] #suite-map {
    position: relative;
    height: min(58vh,500px) !important;
    min-height: 360px !important;
    background: #eef2f7 !important;
  }
  @media (max-width:900px) {
    .app-body[data-admin-page="actoki-suite"] .suite-tool-grid {
      grid-template-columns: 1fr;
    }
    .app-body[data-admin-page="actoki-suite"] .suite-map-toolbar {
      grid-template-columns: 1fr 1fr;
    }
    .app-body[data-admin-page="actoki-suite"] .suite-map-toolbar button {
      grid-column: 1/-1;
    }
  }
  @media (max-width:600px) {
    .app-body[data-admin-page="actoki-suite"] .suite-tool-form,.app-body[data-admin-page="actoki-suite"] .suite-map-toolbar {
      grid-template-columns: 1fr !important;
    }
    .app-body[data-admin-page="actoki-suite"] .suite-tool-form button {
      width: 100% !important;
    }
  }
  .app-body[data-admin-page="actoki-suite"] .suite-map-status.success {
    border-color: #abefc6;
    background: #ecfdf3;
    color: #067647;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-map-status.error {
    border-color: #fecdca;
    background: #fef3f2;
    color: #b42318;
  }
  .app-body[data-admin-page="data-sources"] .table-wrap {
    overflow-x: auto;
  }
  .app-body[data-admin-page="data-sources"] .table-wrap table {
    min-width: 640px;
  }
  .app-sidebar .side-group summary {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 18px !important;
    align-items: center !important;
    min-height: 42px;
    font-size: .75rem !important;
    font-weight: 800 !important;
    letter-spacing: .13em !important;
    color: #65738a !important;
  }
  .app-sidebar .side-group summary::after {
    width: 18px !important;
    text-align: center !important;
    justify-self: end !important;
    transform-origin: center !important;
    margin: 0 !important;
  }
  .app-sidebar .side-group[open] summary::after {
    transform: rotate(180deg) !important;
  }
  .app-sidebar .side-link {
    font-size: .94rem !important;
    font-weight: 700 !important;
    color: #46546b !important;
  }
  .app-sidebar .side-link:hover {
    color: #172033 !important;
    background: #eef2ff !important;
  }
  .app-sidebar .side-link.active {
    color: #fff !important;
    background: #3d3478 !important;
  }
  .top-actions>* {
    min-height: 52px;
  }
  .app-body .btn,.app-body button {
    min-height: 42px !important;
    padding: 0 16px !important;
    border-radius: 11px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }
  .app-body .btn.small,.app-body button.small,.app-body .compact {
    min-height: 36px !important;
    padding: 0 12px !important;
  }
  .app-body[data-admin-page="data-sources"] .card-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 20px !important;
    margin-bottom: 20px !important;
  }
  .app-body[data-admin-page="data-sources"] .card-head>div {
    min-width: 0;
  }
  .app-body[data-admin-page="data-sources"] .card-head form {
    display: block !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
  }
  .app-body[data-admin-page="data-sources"] .seed-default-sources {
    min-width: 178px !important;
    max-width: none !important;
  }
  .app-body[data-admin-page="data-sources"] .grid.two {
    grid-template-columns: minmax(0,.95fr) minmax(420px,1.05fr) !important;
    align-items: start !important;
  }
  @media (max-width:1100px) {
    .app-body[data-admin-page="data-sources"] .grid.two {
      grid-template-columns: 1fr !important;
    }
  }
  @media (max-width:680px) {
    .app-body[data-admin-page="data-sources"] .card-head {
      display: grid !important;
    }
    .app-body[data-admin-page="data-sources"] .seed-default-sources {
      width: 100% !important;
    }
  }
  .app-body[data-admin-page="email"] .mail-metric-grid {
    display: grid !important;
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
    gap: 16px !important;
    margin-bottom: 22px !important;
  }
  .app-body[data-admin-page="email"] .mail-metric-grid .metric {
    min-height: 132px !important;
    margin: 0 !important;
    padding: 22px !important;
  }
  .app-body[data-admin-page="email"] .mail-health-grid {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 14px !important;
  }
  @media (max-width:1200px) {
    .app-body[data-admin-page="email"] .mail-metric-grid {
      grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="email"] .mail-health-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (max-width:700px) {
    .app-body[data-admin-page="email"] .mail-metric-grid,.app-body[data-admin-page="email"] .mail-health-grid {
      grid-template-columns: 1fr !important;
    }
  }
  .app-body[data-admin-page="stats"] .report-filter-grid {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 16px !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(1) {
    grid-column: span 2 !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(2), .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(3) {
    grid-column: span 1 !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(4) {
    grid-column: span 2 !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(5), .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(6) {
    grid-column: span 1 !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(7) {
    grid-column: span 1 !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid>.form-actions {
    grid-column: span 3 !important;
    justify-content: flex-end !important;
    align-items: end !important;
  }
  .app-body[data-admin-page="stats"] .report-filter-grid input,.app-body[data-admin-page="stats"] .report-filter-grid select {
    min-height: 48px !important;
  }
  @media (max-width:1050px) {
    .app-body[data-admin-page="stats"] .report-filter-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>* {
      grid-column: span 1 !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(1),.app-body[data-admin-page="stats"] .report-filter-grid>.field:nth-child(4),.app-body[data-admin-page="stats"] .report-filter-grid>.form-actions {
      grid-column: span 2 !important;
    }
  }
  @media (max-width:680px) {
    .app-body[data-admin-page="stats"] .report-filter-grid {
      grid-template-columns: 1fr !important;
    }
    .app-body[data-admin-page="stats"] .report-filter-grid>* {
      grid-column: 1 !important;
    }
  }
  .app-body[data-admin-page="security"] .turnstile-settings-form {
    display: block !important;
    margin-top: 20px !important;
  }
  .app-body[data-admin-page="security"] .turnstile-mode-grid {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 14px !important;
  }
  .app-body[data-admin-page="security"] .turnstile-option {
    display: grid !important;
    grid-template-columns: 22px minmax(0,1fr) !important;
    align-items: start !important;
    gap: 12px !important;
    min-height: 126px !important;
    padding: 18px !important;
    border: 1px solid #d9dfeb !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
    cursor: pointer !important;
  }
  .app-body[data-admin-page="security"] .turnstile-option:has(input:checked) {
    border-color: #7c6df2 !important;
    background: #f3f1ff !important;
    box-shadow: 0 0 0 3px rgba(91,80,230,.12) !important;
  }
  .app-body[data-admin-page="security"] .turnstile-option input {
    width: 20px !important;
    height: 20px !important;
    margin: 1px 0 0 !important;
  }
  .app-body[data-admin-page="security"] .turnstile-option strong {
    display: block !important;
    color: #1d2939 !important;
    font-size: 14px !important;
    margin-bottom: 6px !important;
  }
  .app-body[data-admin-page="security"] .turnstile-option small {
    display: block !important;
    color: #667085 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
    font-weight: 500 !important;
  }
  .app-body[data-admin-page="security"] .turnstile-actions {
    margin-top: 16px !important;
  }
  .app-body[data-admin-page="security"] .security-note {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin-top: 18px !important;
    padding: 14px 16px !important;
    border: 1px solid #e4e7ec !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    color: #475467 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
  }
  .app-body[data-admin-page="security"] .security-note strong {
    color: #344054 !important;
    white-space: nowrap !important;
  }
  @media (max-width:950px) {
    .app-body[data-admin-page="security"] .turnstile-mode-grid {
      grid-template-columns: 1fr !important;
    }
    .app-body[data-admin-page="security"] .turnstile-option {
      min-height: auto !important;
    }
  }
  .app-body[data-admin-page="services"] .service-table-wrap {
    overflow-x: auto !important;
    border: 1px solid #e1e6ef !important;
    border-radius: 14px !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] {
    min-width: 1180px !important;
    margin: 0 !important;
    border: 0 !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] th:nth-child(1) {
    width: 38% !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] th:nth-child(2) {
    width: 10% !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] th:nth-child(3) {
    width: 7% !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] th:nth-child(4) {
    width: 11% !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] th:nth-child(5) {
    width: 9% !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] th:nth-child(6) {
    width: 25% !important;
    white-space: nowrap !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] td {
    vertical-align: middle !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] .table-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] .table-actions form {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    flex-wrap: nowrap !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] .table-actions input[name="availability_note"] {
    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;
    margin: 0 !important;
    min-height: 38px !important;
  }
  .app-body[data-admin-page="services"] table[data-service-table] .table-actions button {
    white-space: nowrap !important;
    flex: 0 0 auto !important;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-request-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid #e4e7ec;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-request-head h3 {
    margin: 0 0 6px;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-request-route {
    display: grid;
    grid-template-columns: minmax(0,1fr) 180px;
    gap: 14px;
    margin-top: 16px;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-parameter-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px;
    margin-top: 16px;
    padding: 18px;
    border: 1px solid #dfe5ef;
    border-radius: 14px;
    background: #f8fafc;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-field>label,.app-body[data-admin-page="actoki-suite"] .suite-param-check-copy strong {
    font-size: .86rem;
    font-weight: 800;
    color: #25324a;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-field input:not([type="checkbox"]),.app-body[data-admin-page="actoki-suite"] .suite-param-field select,.app-body[data-admin-page="actoki-suite"] .suite-param-field textarea {
    width: 100%;
    min-height: 44px;
    margin: 0;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-field textarea {
    min-height: 104px;
    resize: vertical;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-check {
    display: grid;
    grid-template-columns: 20px minmax(0,1fr);
    align-items: start;
    gap: 10px;
    cursor: pointer;
    min-height: 76px;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-check input {
    width: 19px !important;
    height: 19px !important;
    margin: 1px 0 0 !important;
    align-self: start;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-check-copy {
    display: block;
    line-height: 1.35;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-check-copy strong,.app-body[data-admin-page="actoki-suite"] .suite-param-check-copy small {
    display: block;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-check-copy small {
    margin-top: 4px;
    color: #667085;
    font-size: .76rem;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-param-field:has(input:checked) {
    border-color: #8b7cf6;
    background: #f5f3ff;
    box-shadow: 0 0 0 2px rgba(91,80,230,.08);
  }
  .app-body[data-admin-page="actoki-suite"] .suite-empty-options {
    grid-column: 1/-1;
    padding: 24px;
    text-align: center;
    color: #667085;
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    background: #fff;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-advanced-params {
    margin-top: 14px;
    border: 1px solid #e1e6ef;
    border-radius: 12px;
    background: #fff;
    padding: 0 14px;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-advanced-params summary {
    cursor: pointer;
    padding: 14px 2px;
    font-weight: 800;
    color: #344054;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-advanced-params textarea {
    min-height: 110px;
    margin-bottom: 14px;
  }
  .app-body[data-admin-page="actoki-suite"] .suite-run-actions {
    justify-content: flex-end;
    margin-top: 14px;
  }
  @media (max-width:1180px) {
    .app-body[data-admin-page="actoki-suite"] .suite-parameter-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (max-width:720px) {
    .app-body[data-admin-page="actoki-suite"] .suite-request-head {
      display: grid;
    }
    .app-body[data-admin-page="actoki-suite"] .suite-request-route,.app-body[data-admin-page="actoki-suite"] .suite-parameter-grid {
      grid-template-columns: 1fr;
    }
    .app-body[data-admin-page="actoki-suite"] .suite-run-actions {
      display: grid !important;
      grid-template-columns: 1fr;
    }
    .app-body[data-admin-page="actoki-suite"] .suite-run-actions button {
      width: 100%;
    }
  }
  .app-body[data-admin-page="stats"] .app-main {
    max-width: none;
  }
  .analytics-commandbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 1rem;
    padding: .85rem 1rem;
    border: 1px solid #dfe4ec;
    border-radius: 1rem;
    background: rgba(255,255,255,.88);
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
  }
  .analytics-commandbar p {
    margin: 0;
    color: #667085;
    font-size: .78rem;
  }
  .analytics-quick-filters {
    display: flex;
    align-items: end;
    gap: .65rem;
    flex-wrap: wrap;
  }
  .analytics-date-select {
    display: grid;
    gap: .25rem;
  }
  .analytics-date-select span {
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #667085;
  }
  .analytics-date-select select {
    min-width: 185px;
    height: 42px;
  }
  .filter-count:not(:empty) {
    display: inline-grid;
    place-items: center;
    min-width: 20px;
    height: 20px;
    margin-left: .35rem;
    border-radius: 99px;
    background: #5b4ff2;
    color: #fff;
    font-size: .68rem;
  }
  .analytics-filter-panel {
    margin-bottom: 1rem !important;
  }
  .analytics-filter-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 1rem;
  }
  .analytics-filter-grid .form-actions {
    grid-column: 1/-1;
    display: flex;
    justify-content: flex-end;
  }
  .analytics-kpis {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 1rem;
    margin-bottom: 1rem;
  }
  .analytics-kpi {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    min-height: 132px;
    padding: 1.2rem;
    border: 1px solid #dfe4ec;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 3px 14px rgba(16,24,40,.045);
  }
  .analytics-kpi span {
    display: block;
    color: #667085;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
  }
  .analytics-kpi strong {
    display: block;
    margin: .45rem 0 .3rem;
    color: #101828;
    font-size: 2rem;
    line-height: 1;
    font-weight: 760;
    letter-spacing: -.04em;
  }
  .analytics-kpi small {
    color: #98a2b3;
    font-size: .75rem;
  }
  .analytics-kpi em {
    font-style: normal;
    font-size: .72rem;
    font-weight: 750;
    padding: .3rem .5rem;
    border-radius: 99px;
  }
  .trend-up {
    background: #ecfdf3;
    color: #067647;
  }
  .trend-down {
    background: #fef3f2;
    color: #b42318;
  }
  .trend-flat {
    background: #f2f4f7;
    color: #667085;
  }
  .analytics-main-grid {
    display: grid;
    grid-template-columns: minmax(0,2.1fr) minmax(290px,.9fr);
    gap: 1rem;
  }
  .analytics-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
  }
  .analytics-card-head h2 {
    margin: 0 !important;
  }
  .analytics-card-head p {
    margin: .3rem 0 0 !important;
    font-size: .78rem;
  }
  .analytics-chart-card {
    min-height: 380px;
  }
  .analytics-chart-tabs {
    display: flex;
    padding: .2rem;
    border: 1px solid #e4e7ec;
    border-radius: .65rem;
    background: #f9fafb;
  }
  .analytics-chart-tabs button {
    min-height: 32px;
    padding: .35rem .65rem;
    border: 0;
    background: transparent;
    box-shadow: none;
    color: #667085;
    font-size: .72rem;
  }
  .analytics-chart-tabs button.active {
    background: #fff;
    color: #344054;
    box-shadow: 0 1px 3px rgba(16,24,40,.12);
  }
  .analytics-chart-svg {
    display: block;
    width: 100%;
    height: auto;
    max-height: 285px;
  }
  .chart-grid line {
    stroke: #eaecf0;
    stroke-width: 1;
  }
  .chart-grid text,.analytics-chart-svg>text {
    fill: #98a2b3;
    font-size: 10px;
  }
  .chart-area {
    fill: rgba(91,79,242,.10);
  }
  .chart-line {
    fill: none;
    stroke: #5b4ff2;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .analytics-status-card {
    min-height: 380px;
  }
  .status-donut {
    width: 164px;
    height: 164px;
    margin: 1rem auto;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: conic-gradient(#12b76a var(--success),#f04438 0);
    position: relative;
  }
  .status-donut:after {
    content: "";
    position: absolute;
    inset: 18px;
    border-radius: 50%;
    background: #fff;
  }
  .status-donut div {
    position: relative;
    z-index: 1;
    text-align: center;
  }
  .status-donut strong {
    display: block;
    font-size: 1.55rem;
    color: #101828;
  }
  .status-donut span {
    color: #667085;
    font-size: .72rem;
  }
  .status-list {
    display: grid;
    gap: .65rem;
  }
  .status-list>div {
    display: grid;
    grid-template-columns: 1fr auto 48px;
    align-items: center;
    gap: .6rem;
    font-size: .78rem;
  }
  .status-list span {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #475467;
  }
  .status-list small {
    text-align: right;
    color: #98a2b3;
  }
  .status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #667085;
  }
  .status-success {
    background: #12b76a;
  }
  .status-redirect {
    background: #7f56d9;
  }
  .status-client-error {
    background: #f79009;
  }
  .status-server-error {
    background: #f04438;
  }
  .analytics-breakdowns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 1rem;
  }
  .rank-list {
    display: grid;
    gap: .9rem;
  }
  .rank-row {
    display: grid;
    grid-template-columns: 28px minmax(0,1fr) auto;
    gap: .7rem;
    align-items: center;
  }
  .rank-number {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: .5rem;
    background: #f2f4f7;
    color: #667085;
    font-size: .72rem;
    font-weight: 800;
  }
  .rank-row>div {
    min-width: 0;
  }
  .rank-row b {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #344054;
    font-size: .8rem;
  }
  .rank-row small {
    display: block;
    color: #98a2b3;
    font-size: .68rem;
    margin-top: .15rem;
  }
  .rank-row>div>span {
    display: block;
    height: 5px;
    margin-top: .45rem;
    border-radius: 99px;
    background: #f2f4f7;
    overflow: hidden;
  }
  .rank-row>div>span i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #7f73f5;
  }
  .rank-row>strong {
    font-size: .8rem;
    color: #344054;
  }
  .empty-state {
    padding: 2rem;
    text-align: center;
    color: #98a2b3;
  }
  .analytics-activity {
    margin-top: 1rem !important;
  }
  .result-count {
    padding: .35rem .55rem;
    border-radius: 99px;
    background: #f2f4f7;
    color: #667085;
    font-size: .72rem;
    font-weight: 750;
  }
  .analytics-activity td strong,.analytics-activity td small {
    display: block;
  }
  .analytics-activity td small {
    color: #98a2b3;
  }
  .http-status {
    display: inline-flex;
    min-width: 44px;
    justify-content: center;
    padding: .22rem .42rem;
    border-radius: 99px;
    font-size: .7rem;
    font-weight: 800;
  }
  .http-status.status-ok {
    background: #ecfdf3;
    color: #067647;
  }
  .http-status.status-error {
    background: #fef3f2;
    color: #b42318;
  }
  .empty-cell {
    text-align: center !important;
    padding: 3rem !important;
    color: #98a2b3;
  }
  @media (max-width:1100px) {
    .analytics-kpis {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .analytics-main-grid {
      grid-template-columns: 1fr;
    }
    .analytics-status-card {
      min-height: auto;
    }
    .analytics-filter-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (max-width:700px) {
    .analytics-commandbar {
      align-items: stretch;
      flex-direction: column;
    }
    .analytics-commandbar p {
      order: -1;
    }
    .analytics-quick-filters>* {
      flex: 1 1 auto;
    }
    .analytics-date-select {
      flex-basis: 100%;
    }
    .analytics-date-select select {
      width: 100%;
    }
    .analytics-kpis,.analytics-breakdowns,.analytics-filter-grid {
      grid-template-columns: 1fr;
    }
    .analytics-filter-grid .form-actions {
      grid-column: 1;
    }
    .analytics-card-head {
      align-items: stretch;
      flex-direction: column;
    }
    .analytics-chart-tabs {
      overflow-x: auto;
    }
    .analytics-kpi {
      min-height: 112px;
    }
    .analytics-kpi strong {
      font-size: 1.65rem;
    }
  }
  .app-body .pagination-full {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 0 2px;
    flex-wrap: wrap;
  }
  .app-body .pagination-full .pagination-summary {
    color: #667085;
    font-size: 12px;
    font-weight: 650;
  }
  .app-body .pagination-controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: wrap;
  }
  .app-body .pagination-controls a,.app-body .pagination-controls span {
    min-width: 38px;
    height: 38px;
    padding: 0 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--admin-line,#dfe3eb);
    border-radius: 9px;
    background: #fff;
    color: #344054;
    text-decoration: none;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
  }
  .app-body .pagination-controls a:hover {
    border-color: #8e85fb;
    background: #f7f5ff;
    color: #4f46d9;
  }
  .app-body .pagination-controls a.active {
    background: #5b50e6;
    color: #fff;
    border-color: #5b50e6;
    box-shadow: 0 4px 12px rgba(91,80,230,.2);
  }
  .app-body .pagination-controls .pagination-edge {
    min-width: auto;
  }
  .app-body .pagination-controls .disabled {
    color: #98a2b3;
    background: #f8fafc;
    cursor: not-allowed;
    box-shadow: none;
  }
  .app-body .pagination-controls .pagination-ellipsis {
    min-width: 24px;
    padding: 0;
    border-color: transparent;
    background: transparent;
    color: #98a2b3;
  }
  .app-body .pagination-controls a:focus-visible {
    outline: 3px solid rgba(91,80,230,.22);
    outline-offset: 2px;
  }
  @media (max-width:720px) {
    .app-body .pagination-full {
      align-items: stretch;
    }
    .app-body .pagination-full .pagination-summary {
      width: 100%;
      text-align: center;
    }
    .app-body .pagination-controls {
      justify-content: center;
    }
    .app-body .pagination-controls .pagination-edge {
      font-size: 0;
      min-width: 38px;
      padding: 0;
    }
    .app-body .pagination-controls .pagination-edge:first-child:after {
      content: "«";
      font-size: 16px;
    }
    .app-body .pagination-controls .pagination-edge:nth-child(2):after {
      content: "‹";
      font-size: 18px;
    }
    .app-body .pagination-controls .pagination-edge:nth-last-child(2):after {
      content: "›";
      font-size: 18px;
    }
    .app-body .pagination-controls .pagination-edge:last-child:after {
      content: "»";
      font-size: 16px;
    }
  }
  .list-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--border,#e2e8f0);
  }
  .pagination-meta {
    font-size: .875rem;
    color: var(--muted,#64748b);
  }
  .pagination-size {
    display: flex;
    align-items: center;
    margin-left: auto;
  }
  .pagination-size label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .875rem;
    font-weight: 700;
    color: var(--text-soft,#334155);
  }
  .pagination-size select {
    width: auto;
    min-width: 76px;
    height: 38px;
    padding: 6px 30px 6px 10px;
  }
  .list-pagination .pagination {
    margin: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
  .pagination-controls {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
  }
  .pagination-controls a,.pagination-controls span {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--border,#d8e0ec);
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 700;
    color: var(--text-soft,#334155);
    background: #fff;
  }
  .pagination-controls .active {
    background: var(--brand,#5b4df0);
    border-color: var(--brand,#5b4df0);
    color: #fff;
  }
  .pagination-controls .disabled {
    opacity: .45;
    cursor: not-allowed;
  }
  .pagination-ellipsis {
    border: 0 !important;
    background: transparent !important;
    min-width: 20px !important;
    padding: 0 !important;
  }
  .pagination-summary {
    font-size: .875rem;
    font-weight: 700;
    color: var(--muted,#64748b);
  }
  @media (max-width:760px) {
    .list-pagination .pagination {
      align-items: flex-start;
      flex-direction: column;
    }
    .pagination-controls .pagination-edge {
      font-size: 0;
    }
    .pagination-controls .pagination-edge:first-child::after {
      content: '«';
      font-size: 1rem;
    }
    .pagination-controls .pagination-edge:nth-child(2)::after {
      content: '‹';
      font-size: 1rem;
    }
    .pagination-controls .pagination-edge:nth-last-child(2)::after {
      content: '›';
      font-size: 1rem;
    }
    .pagination-controls .pagination-edge:last-child::after {
      content: '»';
      font-size: 1rem;
    }
  }
  .security-inline-action {
    display: grid;
    grid-template-columns: minmax(220px,320px) auto;
    align-items: end;
    gap: 12px;
    min-width: min(100%,520px);
  }
  .security-inline-action .field {
    margin: 0;
  }
  .security-inline-action button {
    white-space: nowrap;
  }
  .security-danger-zone {
    border-color: #fecdca;
    background: #fffafa;
  }
  .security-danger-zone h3 {
    color: #b42318;
  }
  .admin-user-security-popover {
    width: min(520px,calc(100vw - 40px));
    padding: 18px;
  }
  .admin-user-security-popover form {
    padding: 0 0 16px;
    margin: 0 0 16px;
    border-bottom: 1px solid #eaecf0;
  }
  .admin-user-security-popover form:last-of-type {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
  }
  .admin-2fa-reset-form {
    display: grid;
    gap: 10px;
  }
  .admin-2fa-reset-form label {
    display: grid;
    gap: 6px;
    font-weight: 700;
  }
  .admin-2fa-reset-form small {
    line-height: 1.5;
  }
  @media (max-width:760px) {
    .security-inline-action {
      grid-template-columns: 1fr;
      width: 100%;
    }
    .security-inline-action button {
      width: 100%;
    }
  }
  .cache-metric-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }
  .cache-clear-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 1rem;
  }
  .cache-clear-grid form {
    border: 1px solid var(--border,#d9e1ec);
    border-radius: 14px;
    padding: 1rem;
    background: #fff;
  }
  .clean-list {
    display: grid;
    gap: .6rem;
    margin: .75rem 0 0;
    padding-left: 1.25rem;
  }
  @media (max-width:900px) {
    .cache-metric-grid,.cache-clear-grid {
      grid-template-columns: 1fr;
    }
  }
  .app-body .user-menu {
    position: relative;
    z-index: 5000;
  }
  .app-body .user-menu-trigger {
    display: flex;
    align-items: center;
    gap: 9px;
    height: 46px;
    min-height: 46px;
    padding: 4px 10px 4px 5px;
    border: 1px solid var(--ui-line,#d7deea);
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
    box-shadow: 0 8px 24px rgba(16,24,40,.06);
    color: #344054;
    text-align: left;
  }
  .app-body .user-menu-trigger:hover {
    border-color: #aaa3ff;
    background: #fbfaff;
  }
  .app-body .user-menu-trigger:focus-visible {
    outline: 3px solid rgba(91,80,230,.24);
    outline-offset: 2px;
  }
  .app-body .user-menu-trigger .user-meta {
    display: block;
    min-width: 0;
    max-width: 180px;
  }
  .app-body .user-menu-trigger .user-meta b {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .app-body .user-menu.is-open .user-chevron svg,.app-body .user-menu[open] .user-chevron svg {
    transform: rotate(90deg);
  }
  .app-body .user-menu-popover[hidden] {
    display: none !important;
  }
  .app-body .user-menu-popover {
    z-index: 5100;
  }
  .app-body .app-logo {
    min-height: 72px !important;
    padding: 0 14px 18px !important;
    gap: 12px !important;
  }
  .app-body .side-group {
    width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid #d7deea !important;
    border-radius: 16px !important;
    background: #f8f9fc !important;
    box-shadow: 0 8px 24px rgba(16,24,40,.06) !important;
  }
  .app-body .side-group>summary {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 20px !important;
    align-items: center !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    min-height: 62px !important;
    height: 62px !important;
    padding: 0 18px !important;
    color: #65738a !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: .14em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    list-style: none !important;
  }
  .app-body .side-group>summary::after {
    content: "" !important;
    display: block !important;
    width: 8px !important;
    height: 8px !important;
    justify-self: center !important;
    border-right: 2px solid #98a2b3 !important;
    border-bottom: 2px solid #98a2b3 !important;
    transform: rotate(45deg) !important;
    transform-origin: center !important;
    transition: transform .2s ease !important;
    margin: -4px 0 0 !important;
  }
  .app-body .side-group-links {
    display: grid !important;
    gap: 6px !important;
    padding: 14px !important;
    border-top: 1px solid #dfe4ec !important;
  }
  .app-body .side-link {
    width: 100% !important;
    min-height: 48px !important;
    padding: 8px 11px !important;
    gap: 11px !important;
    border-radius: 12px !important;
    color: #4d5a70 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    box-shadow: none !important;
  }
  .app-body .side-link.active {
    color: #fff !important;
    background: #493f88 !important;
    box-shadow: inset 4px 0 0 #897dff !important;
  }
  .app-body .side-icon {
    display: grid !important;
    place-items: center !important;
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    border-radius: 10px !important;
    background: #e9edf5 !important;
    color: #6b7890 !important;
  }
  @media (max-width:980px) {
    .app-body .app-sidebar {
      width: min(310px,88vw) !important;
      flex-basis: auto !important;
    }
  }
  .account-workspace .environment-pill, .account-workspace .top-action-link, .account-workspace .user-menu-trigger {
    box-sizing: border-box;
    height: var(--account-control-h);
    min-height: var(--account-control-h);
    border: 1px solid var(--account-border);
    border-radius: 14px;
    background: #fff;
    color: #344054;
    box-shadow: 0 2px 7px rgba(16,24,40,.05);
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
  }
  .account-workspace .top-action-link:hover,.account-workspace .user-menu-trigger:hover {
    border-color: #aaa3ff;
    background: #fbfaff;
    color: #3328b9;
  }
  .account-workspace .top-action-link:focus-visible,.account-workspace .user-menu-trigger:focus-visible {
    outline: 3px solid rgba(91,80,230,.24);
    outline-offset: 2px;
  }
  .account-workspace .user-menu-trigger {
    padding: 4px 10px 4px 5px;
    cursor: pointer;
    min-width: 250px;
    text-align: left;
  }
  .account-workspace .user-menu.is-open .user-chevron svg {
    transform: rotate(90deg);
  }
  @media (max-width:760px) {
    .account-workspace .top-actions>* {
      flex: 1 1 auto;
      justify-content: center;
    }
    .account-workspace .user-menu {
      flex: 1 1 100%;
    }
    .account-workspace .user-menu-trigger {
      width: 100%;
      min-width: 0;
    }
    .account-workspace .user-menu-popover {
      left: 0;
      right: 0;
      width: auto;
    }
    .account-workspace .team-form,.account-workspace .security-method-form {
      grid-template-columns: 1fr !important;
    }
    .account-workspace .security-method-form button {
      grid-column: 1;
      width: 100%;
      min-width: 0;
    }
    .account-workspace .action-menu-popover {
      position: fixed !important;
      left: 12px !important;
      right: 12px !important;
      top: 80px !important;
      width: auto !important;
      max-height: calc(100vh - 100px);
    }
  }
  .account-workspace .user-menu-trigger {
    display: grid !important;
    grid-template-columns: 40px minmax(0,1fr) 20px !important;
    align-items: center !important;
    gap: 11px !important;
    padding: 5px 13px 5px 6px !important;
    width: 100% !important;
    min-width: 270px !important;
  }
  @media (max-width:760px) {
    .account-workspace .top-actions {
      width: 100%;
      justify-content: flex-start;
      flex-wrap: wrap;
    }
    .account-workspace .top-actions>* {
      flex: 1 1 auto;
    }
    .account-workspace .user-menu {
      flex: 1 1 100%;
      min-width: 0 !important;
    }
    .account-workspace .user-menu-trigger {
      min-width: 0 !important;
    }
  }
  .pack-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
  }
  .pack {
    border: 1px solid #dfe5ef;
    border-radius: 18px;
    padding: 20px;
    background: #fafbfe;
  }
  .account-workspace .business-profile-card .business-details-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 18px;
    align-items: end;
  }
  .account-workspace .business-profile-card .business-details-grid>label {
    grid-column: auto !important;
    min-width: 0;
  }
  .account-workspace .business-profile-card .business-details-grid>.portal-actions.full {
    grid-column: 1/-1 !important;
  }
  @media (max-width:1100px) {
    .account-workspace .business-profile-card .business-details-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (max-width:640px) {
    .account-workspace .business-profile-card .business-details-grid {
      grid-template-columns: 1fr !important;
    }
  }
  :root {
    --bg: #f6f7f9;
    --surface: #fff;
    --surface-2: #f8fafc;
    --surface-3: #f1f5f9;
    --text: #0f172a;
    --text-soft: #334155;
    --muted: #64748b;
    --border: #e2e8f0;
    --accent: #4f46e5;
    --accent-dark: #4338ca;
    --accent-soft: #eef2ff;
    --accent-ring: rgba(79,70,229,.14);
    --brand: #4f46e5;
    --brand-dark: #4338ca;
    --brand-soft: #eef2ff;
    --cyan: #4f46e5;
    --danger: #dc2626;
    --danger-soft: #fef2f2;
    --success: #15803d;
    --success-soft: #f0fdf4;
    --warning: #b45309;
    --warning-soft: #fffbeb;
    --sidebar: #0f172a;
    --sidebar-2: #1e293b;
    --shadow-sm: 0 1px 2px rgba(15,23,42,.05);
    --shadow: 0 8px 24px rgba(15,23,42,.06);
    --radius-sm: 10px;
    --radius: 14px;
    --radius-lg: 18px;
    --sidebar-width: 264px;
  }
  * {
    box-sizing: border-box;
  }
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 88px;
  }
  body {
    margin: 0;
    font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
    background: var(--bg);
    color: var(--text);
    font-size: 15px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
  }
  body.nav-open {
    overflow: hidden;
  }
  a {
    color: var(--brand);
    text-decoration: none;
  }
  a:hover {
    text-decoration: none;
  }
  button,input,select,textarea {
    font: inherit;
  }
  button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {
    outline: 3px solid var(--accent-ring);
    outline-offset: 2px;
  }
  code,.mono,.key {
    font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
  }
  code {
    overflow-wrap: anywhere;
  }
  .app-body {
    background: var(--bg);
  }
  .app-shell {
    display: flex;
    min-height: 100vh;
  }
  .app-sidebar {
    width: var(--sidebar-width);
    flex: 0 0 var(--sidebar-width);
    background: var(--sidebar);
    color: #fff;
    padding: 18px 14px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: 8px 0 30px rgba(15,23,42,.15);
    z-index: 60;
  }
  .app-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    font-size: 21px;
    font-weight: 900;
    padding: 7px 10px 18px;
    letter-spacing: -.02em;
  }
  .logo-mark {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 16px rgba(79,70,229,.28);
    font-size: 18px;
  }
  .sidebar-close {
    display: none;
    position: absolute;
    right: 13px;
    top: 14px;
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 12px;
    background: rgba(255,255,255,.1);
    color: #fff;
  }
  .side-label {
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #94a3b8;
    margin: 16px 12px 7px;
    font-weight: 800;
  }
  .side-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .side-group {
    margin: 0;
  }
  .side-group summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    color: #94a3b8;
    font-size: 10px;
    letter-spacing: .13em;
    text-transform: uppercase;
    font-weight: 800;
    cursor: pointer;
  }
  .side-group summary::-webkit-details-marker {
    display: none;
  }
  .side-group summary:after {
    content: "⌄";
    font-size: 13px;
    transition: transform .18s ease;
  }
  .side-group[open] summary:after {
    transform: rotate(180deg);
  }
  .side-group-links {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .side-link {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #cbd5e1;
    padding: 10px 11px;
    border-radius: 12px;
    font-weight: 700;
    min-height: 44px;
    transition: background .16s ease,color .16s ease,transform .16s ease;
  }
  .side-link:hover {
    background: rgba(255,255,255,.075);
    color: #fff;
    transform: translateX(1px);
  }
  .side-link.active {
    background: rgba(255,255,255,.09);
    color: #fff;
    box-shadow: inset 3px 0 0 var(--accent);
  }
  .side-icon {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 9px;
    background: rgba(255,255,255,.08);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #cbd5e1;
  }
  .side-icon svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .side-link.active .side-icon,.side-link:hover .side-icon {
    color: #fff;
    background: rgba(255,255,255,.12);
  }
  .sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.55);
    backdrop-filter: blur(3px);
    z-index: 55;
  }
  .app-main {
    flex: 1;
    padding: 24px clamp(18px,3vw,38px) 56px;
    min-width: 0;
    max-width: calc(100vw - var(--sidebar-width));
  }
  .mobile-bar {
    display: none;
  }
  .topbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin: 0 auto 22px;
    max-width: 1500px;
  }
  .topbar h1 {
    font-size: clamp(26px,3vw,34px);
    line-height: 1.12;
    margin: 4px 0 0;
    letter-spacing: -.035em;
  }
  .crumb {
    font-size: 13px;
    color: var(--muted);
    font-weight: 650;
  }
  .top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    flex-wrap: wrap;
  }
  .user-meta {
    font-size: 13px;
    line-height: 1.25;
    color: var(--muted);
  }
  .avatar {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 50%;
    background: var(--accent);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    box-shadow: var(--shadow-sm);
  }
  .wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 28px;
  }
  .nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
  }
  .brand {
    font-weight: 900;
    font-size: 22px;
    color: var(--text);
  }
  .card,.panel {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: clamp(18px,2.2vw,26px);
    margin: 18px auto;
    max-width: 1500px;
  }
  .card:hover,.panel:hover {
    box-shadow: var(--shadow);
  }
  .card>h2:first-child,.panel>h2:first-child {
    margin-top: 0;
  }
  .card h2,.panel h2 {
    font-size: 20px;
    line-height: 1.3;
    letter-spacing: -.02em;
    margin: 0 0 8px;
  }
  .card h3,.panel h3 {
    font-size: 16px;
    margin: 20px 0 8px;
  }
  .panel-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
  }
  .panel-title h2 {
    margin: 0 0 5px;
  }
  .grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(min(100%,250px),1fr));
    gap: 16px;
  }
  .grid.two {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .metric {
    border-radius: var(--radius);
    padding: 20px;
    color: var(--text);
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    position: relative;
    overflow: hidden;
    min-height: 118px;
  }
  .metric:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--accent);
    opacity: .9;
  }
  .metric span {
    display: block;
    font-size: 12px;
    font-weight: 750;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .045em;
  }
  .metric strong {
    display: block;
    font-size: clamp(26px,3vw,34px);
    line-height: 1.1;
    margin-top: 9px;
    letter-spacing: -.04em;
    color: var(--text);
  }
  .metric:nth-child(2):before {
    background: #0ea5e9;
  }
  .metric:nth-child(3):before {
    background: #f59e0b;
  }
  .metric:nth-child(4):before {
    background: #10b981;
  }
  .stats {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(150px,1fr));
    gap: 12px;
  }
  .stats>div {
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-2);
  }
  .stats span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .045em;
  }
  .stats strong {
    display: block;
    margin-top: 5px;
    font-size: 17px;
    overflow-wrap: anywhere;
  }
  .muted {
    color: var(--muted);
  }
  .small {
    font-size: 13px;
  }
  .help-text {
    font-size: 13px;
    color: var(--muted);
    margin-top: -7px;
    margin-bottom: 13px;
  }
  .required {
    color: var(--danger);
  }
  .row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-end;
  }
  .row>* {
    min-width: 0;
  }
  .row>label {
    flex: 1 1 190px;
  }
  .row>input,.row>select {
    flex: 1 1 190px;
    margin: 0;
  }
  .row>button,.row>.btn {
    flex: 0 0 auto;
  }
  .form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 4px;
  }
  .field {
    min-width: 0;
  }
  .field-full {
    grid-column: 1/-1;
  }
  .btn,button,.pill {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid transparent;
    border-radius: 11px;
    padding: 10px 14px;
    min-height: 42px;
    background: var(--brand);
    color: #fff !important;
    font-weight: 800;
    cursor: pointer;
    text-decoration: none;
    line-height: 1.1;
    box-shadow: var(--shadow-sm);
    transition: background .16s ease,transform .16s ease,box-shadow .16s ease,border-color .16s ease;
  }
  .btn:hover,button:hover {
    background: var(--brand-dark);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(79,70,229,.16);
  }
  .btn:active,button:active {
    transform: translateY(0);
  }
  .btn.secondary,button.secondary,.pill {
    background: #fff;
    color: var(--text-soft) !important;
    border-color: var(--border);
    box-shadow: var(--shadow-sm);
  }
  .btn.secondary:hover,button.secondary:hover,.pill:hover {
    background: var(--surface-2);
    border-color: #d0d5dd;
  }
  .pill {
    min-height: 38px;
    padding: 8px 12px;
    font-size: 13px;
  }
  .icon-btn {
    width: 42px;
    height: 42px;
    padding: 0;
    flex: 0 0 42px;
  }
  .danger,.btn.danger {
    background: var(--danger) !important;
    color: #fff !important;
  }
  .danger-soft {
    background: var(--danger-soft) !important;
    color: #991b1b !important;
    border-color: #fecaca !important;
  }
  .success {
    background: var(--success-soft) !important;
    color: #166534 !important;
    border-color: #bbf7d0 !important;
  }
  .warning {
    background: var(--warning-soft) !important;
    color: #92400e !important;
    border-color: #fde68a !important;
  }
  .badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 750;
    background: var(--surface-3);
    color: var(--text-soft);
    border: 1px solid var(--border);
    white-space: nowrap;
  }
  .badge.open,.badge.waiting_support {
    background: #dbeafe;
    color: #1d4ed8;
  }
  .badge.waiting_customer {
    background: #fef3c7;
    color: #92400e;
  }
  .badge.resolved,.badge.closed {
    background: #dcfce7;
    color: #166534;
  }
  label {
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: var(--text-soft);
    margin: 0;
  }
  .check-label {
    display: inline-flex;
    align-items: flex-start;
    gap: 9px;
    line-height: 1.35;
    cursor: pointer;
  }
  .check-label input {
    margin-top: 2px;
  }
  input,select,textarea {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 11px;
    border: 1px solid #d0d5dd;
    background: #fff;
    color: var(--text);
    margin: 6px 0 14px;
    box-shadow: inset 0 1px 2px rgba(16,24,40,.03);
    transition: border-color .15s ease,box-shadow .15s ease;
  }
  input:hover,select:hover,textarea:hover {
    border-color: #98a2b3;
  }
  input:focus,select:focus,textarea:focus {
    border-color: #84adff;
    box-shadow: 0 0 0 4px var(--accent-ring);
    outline: none;
  }
  input::placeholder,textarea::placeholder {
    color: #98a2b3;
  }
  input[type="checkbox"],input[type="radio"] {
    width: 18px;
    height: 18px;
    min-height: 18px;
    padding: 0;
    margin: 0;
    accent-color: var(--brand);
    box-shadow: none;
    flex: 0 0 18px;
  }
  input[type="hidden"] {
    display: none;
  }
  textarea {
    min-height: 120px;
    resize: vertical;
  }
  select {
    cursor: pointer;
  }
  .table-wrap,.card>table,.panel>table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    border: 1px solid var(--border);
    border-radius: 14px;
    margin-top: 14px;
    background: #fff;
  }
  table {
    width: 100%;
    min-width: 680px;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
  }
  td,th {
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: middle;
  }
  th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .055em;
    color: var(--muted);
    background: var(--surface-2);
    font-weight: 850;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
  }
  tr:last-child td {
    border-bottom: 0;
  }
  tbody tr:hover td {
    background: #fbfdff;
  }
  td code {
    font-size: 12px;
  }
  .table-actions {
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
  }
  .table-actions .btn,.table-actions button {
    min-height: 36px;
    padding: 7px 10px;
    font-size: 13px;
  }
  .key,pre {
    background: #0f172a;
    color: #e5e7eb;
    border-radius: 14px;
    padding: 15px;
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-size: 13px;
    line-height: 1.55;
    max-height: 520px;
  }
  .copybox {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 8px;
  }
  .copybox code {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .copybox button {
    min-height: 36px;
    padding: 7px 10px;
    font-size: 13px;
    flex: 0 0 auto;
  }
  .flash {
    padding: 13px 15px;
    border-radius: 13px;
    background: #eef2ff;
    color: #3730a3;
    margin: 12px auto;
    border: 1px solid #c7d2fe;
    max-width: 1500px;
    font-weight: 650;
  }
  .flash.error {
    background: var(--danger-soft);
    color: #991b1b;
    border-color: #fecaca;
  }
  .flash.success {
    background: var(--success-soft);
    color: #166534;
    border-color: #bbf7d0;
  }
  .tabs {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    border-bottom: 1px solid var(--border);
    margin-bottom: 16px;
    padding-bottom: 1px;
  }
  .tab {
    padding: 10px 13px;
    border-radius: 11px 11px 0 0;
    background: var(--surface-2);
    font-weight: 800;
    color: #475569;
    white-space: nowrap;
  }
  .tab.active {
    background: #fff;
    color: var(--brand);
    border: 1px solid var(--border);
    border-bottom-color: #fff;
    margin-bottom: -1px;
  }
  .modal-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.62);
    backdrop-filter: blur(4px);
    align-items: center;
    justify-content: center;
    z-index: 90;
    padding: 20px;
  }
  .modal-backdrop.open {
    display: flex;
  }
  .modal {
    background: #fff;
    border-radius: 20px;
    max-width: 920px;
    width: 100%;
    max-height: 90dvh;
    overflow: auto;
    box-shadow: 0 24px 90px rgba(15,23,42,.35);
    border: 1px solid var(--border);
  }
  .modal-head {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 17px 20px;
    border-bottom: 1px solid var(--border);
  }
  .modal-body {
    padding: 20px;
  }
  .ticket-message {
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 14px;
    margin: 10px 0;
    background: #fff;
  }
  .ticket-message.internal {
    background: #fff7ed;
    border-color: #fed7aa;
  }
  .progress {
    height: 13px;
    background: #e9eef5;
    border-radius: 999px;
    overflow: hidden;
  }
  .progress>span {
    display: block;
    height: 100%;
    background: var(--accent);
    border-radius: inherit;
    min-width: 2px;
  }
  details {
    border: 1px solid var(--border);
    border-radius: 13px;
    background: var(--surface-2);
    overflow: hidden;
  }
  details summary {
    cursor: pointer;
    padding: 13px 15px;
    font-weight: 800;
    color: var(--text-soft);
  }
  details[open] summary {
    border-bottom: 1px solid var(--border);
  }
  details pre {
    margin: 0;
    border-radius: 0;
    max-height: 460px;
  }
  .empty-state {
    text-align: center;
    padding: 36px 20px;
    color: var(--muted);
  }
  .hero {
    padding: 46px 0;
  }
  .hero h1 {
    font-size: clamp(34px,6vw,64px);
    line-height: 1;
    margin: 0 0 18px;
  }
  @media (max-width:1120px) {
    .top-actions .user-meta {
      display: none;
    }
    .grid.two {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width:900px) {
    html {
      scroll-padding-top: 74px;
    }
    .app-shell {
      display: block;
    }
    .app-main {
      max-width: none;
      padding: 16px 16px 46px;
    }
    .app-sidebar {
      position: fixed;
      left: 0;
      top: 0;
      bottom: 0;
      height: 100dvh;
      width: min(86vw,310px);
      transform: translateX(-105%);
      transition: transform .22s ease;
      box-shadow: 18px 0 50px rgba(15,23,42,.28);
    }
    .app-sidebar.open {
      transform: translateX(0);
    }
    .sidebar-close {
      display: inline-flex;
    }
    .sidebar-backdrop.open {
      display: block;
    }
    .mobile-bar {
      display: flex;
      position: sticky;
      top: 0;
      z-index: 45;
      margin: -16px -16px 16px;
      padding: 10px 16px;
      align-items: center;
      justify-content: space-between;
      background: rgba(248,250,252,.94);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(228,231,236,.9);
    }
    .mobile-brand {
      display: flex;
      align-items: center;
      gap: 9px;
      font-weight: 900;
      color: var(--text);
    }
    .mobile-brand .logo-mark {
      width: 34px;
      height: 34px;
      border-radius: 11px;
      color: #fff;
    }
    .nav-toggle {
      width: 42px;
      height: 42px;
      padding: 0;
      background: #fff;
      color: var(--text) !important;
      border: 1px solid var(--border);
      box-shadow: var(--shadow-sm);
    }
    .nav-toggle svg {
      width: 20px;
      height: 20px;
    }
    .topbar {
      align-items: center;
    }
    .top-actions {
      display: none;
    }
    .topbar h1 {
      font-size: 27px;
    }
    .card,.panel {
      border-radius: 17px;
      padding: 18px;
    }
    .metric {
      min-height: 112px;
    }
  }
  @media (max-width:640px) {
    body {
      font-size: 14px;
    }
    .app-main {
      padding-left: 12px;
      padding-right: 12px;
    }
    .mobile-bar {
      margin-left: -12px;
      margin-right: -12px;
      padding-left: 12px;
      padding-right: 12px;
    }
    .topbar {
      margin-bottom: 15px;
    }
    .crumb {
      font-size: 12px;
    }
    .topbar h1 {
      font-size: 24px;
    }
    .grid {
      grid-template-columns: 1fr;
      gap: 12px;
    }
    .card,.panel {
      margin: 12px auto;
      padding: 16px;
      border-radius: 15px;
    }
    .panel-title {
      display: block;
    }
    .panel-title>*+* {
      margin-top: 10px;
    }
    .row {
      display: grid;
      grid-template-columns: 1fr;
      gap: 0;
      align-items: stretch;
    }
    .row>label,.row>input,.row>select,.row>button,.row>.btn {
      width: 100%;
      flex: none;
    }
    .row>button,.row>.btn {
      margin-top: 4px;
    }
    .form-actions {
      display: grid;
      grid-template-columns: 1fr;
    }
    .form-actions>.btn,.form-actions>button {
      width: 100%;
    }
    .metric {
      padding: 17px;
      min-height: 104px;
    }
    .metric strong {
      font-size: 28px;
    }
    .stats {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .copybox {
      align-items: stretch;
      flex-direction: column;
    }
    .copybox code {
      white-space: pre-wrap;
    }
    .copybox button {
      width: 100%;
    }
    .modal-backdrop {
      padding: 8px;
    }
    .modal {
      border-radius: 16px;
      max-height: 96dvh;
    }
    .modal-head,.modal-body {
      padding: 14px;
    }
    .modal-head button {
      width: auto;
      flex: 0 0 auto;
    }
    .table-wrap,.card>table,.panel>table {
      margin-left: 0;
      margin-right: 0;
    }
    td,th {
      padding: 11px 12px;
    }
    .pill {
      width: auto;
    }
    .btn.compact,button.compact,.icon-btn {
      width: auto;
    }
    .tabs {
      margin-left: -2px;
      margin-right: -2px;
    }
  }
  @media (max-width:390px) {
    .stats {
      grid-template-columns: 1fr;
    }
    .app-main {
      padding-left: 10px;
      padding-right: 10px;
    }
    .mobile-bar {
      margin-left: -10px;
      margin-right: -10px;
      padding-left: 10px;
      padding-right: 10px;
    }
    .card,.panel {
      padding: 14px;
    }
    .side-link {
      min-height: 46px;
    }
  }
  @media (prefers-reduced-motion:reduce) {
    *,*:before,*:after {
      scroll-behavior: auto !important;
      transition-duration: .01ms !important;
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
    }
  }
  @media print {
    .app-sidebar,.mobile-bar,.top-actions,.btn,button {
      display: none !important;
    }
    .app-main {
      max-width: none;
      padding: 0;
    }
    .card,.panel {
      box-shadow: none;
      break-inside: avoid;
    }
  }
  .app-body {
    --bg: #f7f9fc;
    --surface: #fff;
    --surface-2: #f6f8fb;
    --surface-3: #eef2f7;
    --text: #1a1f36;
    --text-soft: #3c4257;
    --muted: #697386;
    --border: #e3e8ee;
    --accent: #635bff;
    --accent-dark: #5147e5;
    --accent-soft: #f0efff;
    --accent-ring: rgba(99,91,255,.18);
    --brand: #635bff;
    --brand-dark: #5147e5;
    --brand-soft: #f0efff;
    --sidebar: #fff;
    --sidebar-2: #f6f8fb;
    --shadow-sm: 0 1px 2px rgba(60,66,87,.08);
    --shadow: 0 7px 18px rgba(60,66,87,.08);
  }
  .app-body .app-sidebar {
    background: #fff;
    color: var(--text);
    border-right: 1px solid var(--border);
    box-shadow: none;
    padding: 14px 10px;
  }
  .app-body .app-logo {
    color: var(--text);
    font-size: 19px;
    padding: 8px 10px 16px;
  }
  .app-body .logo-mark {
    background: #635bff;
    border-radius: 9px;
    box-shadow: none;
  }
  .app-body .side-label,.app-body .side-group summary {
    color: #87909f;
  }
  .app-body .side-link {
    color: #4f566b;
    border-radius: 7px;
    min-height: 38px;
    padding: 7px 9px;
    font-weight: 650;
    font-size: 14px;
  }
  .app-body .side-link:hover {
    background: #f6f8fb;
    color: #1a1f36;
    transform: none;
  }
  .app-body .side-link.active {
    background: #f0efff;
    color: #4f46d8;
    box-shadow: none;
  }
  .app-body .side-icon {
    width: 26px;
    height: 26px;
    flex-basis: 26px;
    border-radius: 6px;
    background: transparent;
    color: #697386;
  }
  .app-body .side-link.active .side-icon,.app-body .side-link:hover .side-icon {
    background: transparent;
    color: #635bff;
  }
  .app-body .app-main {
    padding-top: 20px;
  }
  .app-body .topbar {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 20px;
  }
  .app-body .topbar h1 {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -.025em;
  }
  .app-body .crumb {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #87909f;
  }
  .app-body .card,.app-body .panel {
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(60,66,87,.08);
    padding: 22px;
  }
  .app-body .card:hover,.app-body .panel:hover {
    box-shadow: 0 2px 7px rgba(60,66,87,.10);
  }
  .app-body .metric {
    border-radius: 9px;
    min-height: 108px;
    padding: 18px;
    box-shadow: none;
  }
  .app-body .metric:before {
    width: 2px;
  }
  .app-body .metric strong {
    font-size: 30px;
    font-weight: 650;
  }
  .app-body .stats>div {
    border-radius: 8px;
    background: #fff;
  }
  .app-body .btn,.app-body button,.app-body .pill {
    border-radius: 7px;
    min-height: 38px;
    padding: 9px 13px;
    font-weight: 650;
    box-shadow: 0 1px 2px rgba(60,66,87,.12);
  }
  .app-body .btn:hover,.app-body button:hover {
    transform: none;
    box-shadow: 0 2px 4px rgba(60,66,87,.16);
  }
  .app-body input,.app-body select,.app-body textarea {
    border-radius: 7px;
    min-height: 40px;
    border-color: #cfd7df;
  }
  .app-body table {
    min-width: 680px;
  }
  .app-body .table-wrap,.app-body .card>table,.app-body .panel>table {
    border-radius: 8px;
  }
  .app-body th {
    background: #f7f9fc;
    color: #697386;
  }
  .app-body td,.app-body th {
    padding: 10px 12px;
  }
  .app-body tbody tr:hover td {
    background: #f8f9fc;
  }
  .app-body .badge {
    border-radius: 6px;
    padding: 3px 7px;
  }
  @media (max-width:900px) {
    .app-body .app-sidebar {
      box-shadow: 18px 0 50px rgba(26,31,54,.18);
    }
    .app-body .mobile-bar {
      background: rgba(255,255,255,.96);
    }
  }
  .app-body .app-main {
    width: 100%;
    max-width: 1540px;
    margin: 0 auto;
    padding-left: 32px;
    padding-right: 32px;
  }
  .app-body .topbar {
    min-height: 72px;
    gap: 24px;
  }
  .app-body .top-actions {
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
  }
  .app-body .grid {
    align-items: stretch;
  }
  .app-body .grid.two {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .app-body .card,.app-body .panel {
    margin: 0 0 20px;
  }
  .app-body .grid>.card,.app-body .grid>.panel {
    margin: 0;
    height: 100%;
  }
  .app-body .card>h2:first-child,.app-body .panel h2:first-child {
    margin-top: 0;
  }
  .app-body h2 {
    line-height: 1.3;
    margin-bottom: 8px;
  }
  .app-body form:not(.row):not(.table-actions):not([data-inline-form]) {
    display: grid;
    grid-template-columns: repeat(12,minmax(0,1fr));
    gap: 16px 18px;
    align-items: end;
  }
  .app-body form:not(.row):not(.table-actions):not([data-inline-form])>label,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>.field {
    grid-column: span 6;
    margin: 0;
  }
  .app-body form:not(.row):not(.table-actions):not([data-inline-form])>textarea,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>pre,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>.field-full,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>p,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>.flash {
    grid-column: 1/-1;
  }
  .app-body form:not(.row):not(.table-actions):not([data-inline-form])>button,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>.btn {
    grid-column: auto;
    justify-self: start;
  }
  .app-body form>input[type=hidden] {
    display: none !important;
  }
  .app-body label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    font-size: 13px;
    font-weight: 650;
    color: var(--text-soft);
  }
  .app-body label.check-label,.app-body label:has(>input[type=checkbox]),.app-body label:has(>input[type=radio]) {
    flex-direction: row;
    align-items: center;
    align-self: center;
    min-height: 40px;
    gap: 9px;
  }
  .app-body .row {
    display: flex;
    align-items: end;
    gap: 14px;
    flex-wrap: wrap;
  }
  .app-body .row>label,.app-body .row>.field,.app-body .row>div {
    flex: 1 1 220px;
    min-width: 0;
  }
  .app-body .row>button,.app-body .row>.btn {
    flex: 0 0 auto;
  }
  .app-body input,.app-body select,.app-body textarea {
    width: 100%;
    max-width: none;
  }
  .app-body select,.app-body input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.app-body button,.app-body .btn {
    height: 40px;
  }
  .app-body textarea {
    height: auto;
    min-height: 124px;
  }
  .app-body .table-wrap,.app-body .card>table,.app-body .panel>table {
    margin-top: 18px;
  }
  .app-body table form {
    display: inline-flex !important;
    grid-template-columns: none !important;
    gap: 6px !important;
    align-items: center !important;
  }
  .app-body table form button {
    height: 34px;
    min-height: 34px;
    padding: 6px 10px;
  }
  .app-body .panel-title {
    min-height: 42px;
    margin-bottom: 16px;
  }
  .app-body .stats {
    gap: 12px;
  }
  .app-body .flash {
    margin-bottom: 20px;
  }
  .app-body .copybox {
    min-height: 42px;
  }
  .app-body details {
    margin-top: 16px;
  }
  @media (max-width:1120px) {
    .app-body .app-main {
      padding-left: 24px;
      padding-right: 24px;
    }
    .app-body .grid.two {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width:760px) {
    .app-body .app-main {
      padding-left: 14px;
      padding-right: 14px;
    }
    .app-body form:not(.row):not(.table-actions):not([data-inline-form]) {
      grid-template-columns: 1fr;
      gap: 13px;
    }
    .app-body form:not(.row):not(.table-actions):not([data-inline-form])>* {
      grid-column: 1 !important;
    }
    .app-body form:not(.row):not(.table-actions):not([data-inline-form])>button,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>.btn {
      width: 100%;
      justify-self: stretch;
    }
    .app-body .row {
      display: grid;
      grid-template-columns: 1fr;
      gap: 12px;
    }
    .app-body .row>* {
      width: 100%;
      min-width: 0;
    }
    .app-body .row>button,.app-body .row>.btn {
      width: 100%;
    }
  }
  html,body {
    max-width: 100%;
    overflow-x: hidden;
  }
  img,svg,video,canvas {
    max-width: 100%;
  }
  .app-body .app-main,.app-body .topbar,.app-body .card,.app-body .panel {
    min-width: 0;
  }
  .app-body .table-wrap {
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
  }
  .app-body td,.app-body th {
    overflow-wrap: anywhere;
  }
  @media (hover:none) {
    .app-body .btn:hover,.app-body button:hover,.app-body .card:hover,.app-body .panel:hover {
      transform: none;
      box-shadow: var(--shadow-sm);
    }
  }
  @media (max-width:900px) {
    .app-body .app-main {
      padding-top: calc(16px + env(safe-area-inset-top));
      padding-bottom: calc(46px + env(safe-area-inset-bottom));
    }
    .app-body .mobile-bar {
      padding-top: calc(10px + env(safe-area-inset-top));
      padding-left: calc(16px + env(safe-area-inset-left));
      padding-right: calc(16px + env(safe-area-inset-right));
      margin-top: calc(-16px - env(safe-area-inset-top));
    }
    .app-body .app-sidebar {
      padding-top: calc(14px + env(safe-area-inset-top));
      padding-bottom: calc(14px + env(safe-area-inset-bottom));
      padding-left: calc(10px + env(safe-area-inset-left));
    }
    .app-body .sidebar-close,.app-body .nav-toggle {
      min-width: 44px;
      min-height: 44px;
    }
    .app-body .side-link {
      min-height: 44px;
    }
  }
  @media (max-width:760px) {
    .app-body input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.app-body select,.app-body textarea {
      font-size: 16px;
    }
    .app-body .topbar {
      min-height: auto;
      gap: 12px;
    }
    .app-body .topbar h1 {
      overflow-wrap: anywhere;
    }
    .app-body .panel-title {
      min-height: 0;
    }
    .app-body .table-actions {
      white-space: normal;
      flex-wrap: wrap;
      min-width: 150px;
    }
    .app-body .table-actions input,.app-body .table-actions select {
      width: min(100%,120px) !important;
      margin: 0;
    }
    .app-body .table-actions .btn,.app-body .table-actions button {
      min-height: 40px;
    }
    .app-body table {
      min-width: 620px;
    }
    .app-body input[type=file] {
      height: auto;
      min-height: 44px;
      padding: 8px;
    }
    .app-body .tabs {
      scroll-snap-type: x proximity;
      -webkit-overflow-scrolling: touch;
    }
    .app-body .tab {
      scroll-snap-align: start;
      min-height: 44px;
      display: inline-flex;
      align-items: center;
    }
  }
  @media (max-width:480px) {
    .app-body .app-main {
      padding-left: 10px;
      padding-right: 10px;
    }
    .app-body .mobile-bar {
      margin-left: -10px;
      margin-right: -10px;
      padding-left: calc(10px + env(safe-area-inset-left));
      padding-right: calc(10px + env(safe-area-inset-right));
    }
    .app-body .card,.app-body .panel {
      padding: 14px;
      border-radius: 12px;
    }
    .app-body .topbar h1 {
      font-size: 22px;
    }
    .app-body .metric strong {
      font-size: 26px;
    }
    .app-body .stats {
      grid-template-columns: 1fr;
    }
    .app-body .modal-backdrop {
      padding: 0;
      align-items: flex-end;
    }
    .app-body .modal {
      width: 100%;
      max-height: 94dvh;
      border-radius: 16px 16px 0 0;
      padding-bottom: env(safe-area-inset-bottom);
    }
    .app-body .flash {
      border-radius: 10px;
    }
  }
  @media (max-width:360px) {
    .app-body .mobile-brand span:last-child {
      display: none;
    }
    .app-body .card,.app-body .panel {
      padding: 12px;
    }
    .app-body .btn,.app-body button {
      padding-left: 10px;
      padding-right: 10px;
    }
  }
  .service-management-panel {
    overflow: visible;
  }
  .service-table-help {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 12px 14px;
    margin: 0 0 16px;
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    border-radius: 12px;
    color: #334155;
  }
  .service-table-help strong {
    color: #0f172a;
  }
  .service-management-table td {
    vertical-align: middle;
  }
  .service-management-table td>strong {
    display: block;
    color: #0f172a;
  }
  .service-management-table td>small {
    display: block;
    margin-top: 3px;
    color: #526079;
  }
  .service-name-cell {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 300px;
  }
  .service-name-cell>div {
    display: grid;
    gap: 3px;
  }
  .service-name-cell small {
    max-width: 540px;
    color: #526079;
    line-height: 1.45;
  }
  .service-symbol {
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #eef2ff;
    color: #3730a3;
    font-weight: 800;
  }
  .endpoint-count {
    font-size: 12px;
    color: #64748b;
  }
  .service-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
  }
  .inline-action-form {
    margin: 0;
  }
  .instruction-button {
    border: 1px solid #94a3b8;
    background: #fff;
    color: #1e293b;
    font-family: Georgia,serif;
    font-weight: 700;
    font-style: italic;
  }
  .instruction-button:hover {
    border-color: #4f46e5;
    color: #3730a3;
    background: #eef2ff;
  }
  .badge.neutral {
    background: #f1f5f9;
    color: #334155;
    border-color: #cbd5e1;
  }
  .service-instructions-modal {
    max-width: 1040px;
  }
  .service-instructions-modal .modal-head>div {
    display: grid;
    gap: 4px;
  }
  .service-instructions-modal .modal-head small {
    color: #526079;
  }
  .instruction-summary {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 12px;
    margin-bottom: 16px;
  }
  .instruction-summary>div {
    padding: 14px;
    border: 1px solid #d8dee9;
    border-radius: 12px;
    background: #f8fafc;
    display: grid;
    gap: 4px;
  }
  .instruction-summary span {
    font-size: 12px;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
  .instruction-summary strong {
    color: #0f172a;
  }
  .security-note {
    padding: 14px 16px;
    border-left: 4px solid #4f46e5;
    background: #eef2ff;
    border-radius: 0 12px 12px 0;
    margin-bottom: 20px;
    color: #312e81;
  }
  .security-note p {
    margin: 4px 0 0;
  }
  .endpoint-guide {
    padding: 18px 0;
    border-top: 1px solid #e2e8f0;
  }
  .endpoint-guide:first-of-type {
    border-top: 0;
  }
  .endpoint-guide-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
  .endpoint-guide-head>div {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
  }
  .endpoint-guide-head code {
    overflow-wrap: anywhere;
  }
  .endpoint-guide-head>span {
    font-size: 12px;
    color: #526079;
    white-space: nowrap;
  }
  .method-pill {
    display: inline-flex;
    padding: 4px 7px;
    border-radius: 7px;
    background: #e0e7ff;
    color: #3730a3;
    font-size: 11px;
    font-weight: 800;
  }
  .endpoint-guide h4 {
    margin: 16px 0 8px;
  }
  .parameter-table {
    overflow: auto;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
  }
  .parameter-table table {
    margin: 0;
    min-width: 640px;
  }
  .parameter-table th,.parameter-table td {
    padding: 9px 11px;
  }
  .example-tabs {
    display: grid;
    gap: 12px;
    margin-top: 14px;
  }
  .code-example {
    border: 1px solid #d8dee9;
    border-radius: 12px;
    overflow: hidden;
  }
  .code-example-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 10px;
    background: #f8fafc;
    border-bottom: 1px solid #d8dee9;
  }
  .code-example pre {
    margin: 0;
    padding: 14px;
    overflow: auto;
    background: #0f172a;
    color: #e2e8f0;
  }
  .actions-col {
    text-align: right;
  }
  @media (max-width:760px) {
    .service-table-help {
      align-items: flex-start;
      flex-direction: column;
    }
    .service-name-cell {
      min-width: 240px;
    }
    .instruction-summary {
      grid-template-columns: 1fr;
    }
    .endpoint-guide-head {
      align-items: flex-start;
      flex-direction: column;
    }
    .service-actions {
      justify-content: flex-start;
    }
    .service-management-table {
      min-width: 920px;
    }
  }
  .report-filter-grid {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 16px;
    align-items: end;
  }
  .report-filter-grid .form-actions {
    grid-column: span 6;
    display: flex;
    gap: 10px;
  }
  .report-toolbar {
    position: relative;
  }
  .pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    padding: 22px;
  }
  .pagination a {
    min-width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid var(--border,#d7dce5);
    border-radius: 9px;
    text-decoration: none;
    color: var(--text,#172033);
  }
  .pagination a.active {
    background: #17143d;
    color: #fff;
    border-color: #17143d;
  }
  .table-wrap th a {
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
  }
  .check-row {
    display: flex;
    gap: 10px;
    align-items: flex-start;
  }
  .check-row input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
  }
  @media (max-width:1100px) {
    .report-filter-grid {
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
    .report-filter-grid .form-actions {
      grid-column: span 3;
    }
  }
  @media (max-width:700px) {
    .report-filter-grid {
      grid-template-columns: 1fr;
    }
    .report-filter-grid .form-actions {
      grid-column: 1;
      flex-wrap: wrap;
    }
    .report-filter-grid .form-actions>* {
      flex: 1 1 140px;
    }
  }
  .app-body {
    --admin-bg: #f7f8fc;
    --admin-surface: #fff;
    --admin-ink: #15192b;
    --admin-muted: #71778a;
    --admin-line: #e6e8ef;
    --admin-violet: #675cf6;
    --admin-violet-2: #5549e6;
    --admin-violet-soft: #f2f0ff;
    --admin-green: #079455;
    --admin-red: #d92d20;
    --admin-amber: #dc6803;
    --admin-shadow: 0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.045);
    background: radial-gradient(circle at 82% -12%,rgba(103,92,246,.09),transparent 30%),var(--admin-bg);
    color: var(--admin-ink);
  }
  .app-body .skip-link {
    position: fixed;
    left: 16px;
    top: -60px;
    z-index: 1000;
    padding: 10px 14px;
    border-radius: 9px;
    background: #101828;
    color: #fff;
    font-weight: 750;
    transition: top .16s ease;
  }
  .app-body .skip-link:focus {
    top: 12px;
  }
  .app-body .app-shell {
    min-height: 100dvh;
  }
  .app-body .app-sidebar {
    width: 274px;
    flex-basis: 274px;
    background: #111526;
    color: #fff;
    border-right: 0;
    padding: 15px 12px 16px;
    box-shadow: 12px 0 38px rgba(16,24,40,.1);
    display: flex;
    flex-direction: column;
  }
  .app-body .app-logo {
    padding: 7px 9px 17px;
    color: #fff;
    gap: 11px;
  }
  .app-body .logo-mark {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    background: linear-gradient(145deg,#857dfb,#5548e7);
    box-shadow: 0 8px 22px rgba(103,92,246,.34);
    font-size: 16px;
  }
  .app-body .logo-copy {
    display: grid;
    line-height: 1.12;
  }
  .app-body .logo-copy b {
    font-size: 18px;
    letter-spacing: -.035em;
  }
  .app-body .logo-copy small {
    font-size: 10px;
    color: #8f98ae;
    text-transform: uppercase;
    letter-spacing: .11em;
    margin-top: 4px;
    font-weight: 800;
  }
  .app-body .side-nav {
    gap: 3px;
    flex: 1;
  }
  .app-body .side-group {
    margin: 0 0 3px;
  }
  .app-body .side-group summary {
    padding: 8px 10px 6px;
    color: #737d95;
    font-size: 9px;
    letter-spacing: .13em;
    font-weight: 850;
  }
  .app-body .side-group summary:hover {
    color: #aeb6c8;
  }
  .app-body .side-group summary:after {
    color: #667085;
  }
  .app-body .side-group-links {
    gap: 2px;
  }
  .app-body .side-link {
    min-height: 39px;
    padding: 7px 9px;
    border-radius: 9px;
    color: #aeb6c8;
    font-size: 13px;
    font-weight: 650;
    gap: 9px;
  }
  .app-body .side-link:hover {
    background: #1b2134;
    color: #fff;
    transform: none;
  }
  .app-body .side-link.active {
    background: linear-gradient(90deg,rgba(103,92,246,.23),rgba(103,92,246,.09));
    color: #fff;
    box-shadow: inset 2px 0 0 #857dfb;
  }
  .app-body .side-icon {
    width: 25px;
    height: 25px;
    flex-basis: 25px;
    border-radius: 7px;
    background: transparent;
    color: #7f899f;
  }
  .app-body .side-icon svg {
    width: 15px;
    height: 15px;
  }
  .app-body .side-link:hover .side-icon,.app-body .side-link.active .side-icon {
    background: rgba(255,255,255,.06);
    color: #c8c5ff;
  }
  .app-body .sidebar-footer {
    padding: 13px 7px 2px;
    border-top: 1px solid rgba(255,255,255,.075);
    margin-top: 12px;
  }
  .app-body .workspace-status {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px;
    border-radius: 9px;
    background: rgba(255,255,255,.035);
  }
  .app-body .status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #32d583;
    box-shadow: 0 0 0 4px rgba(50,213,131,.1);
  }
  .app-body .workspace-status div {
    display: grid;
    line-height: 1.25;
  }
  .app-body .workspace-status strong {
    font-size: 11px;
    color: #e4e7ec;
  }
  .app-body .workspace-status small {
    font-size: 9px;
    color: #7f899f;
    margin-top: 2px;
  }
  .app-body .sidebar-footer-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    margin-top: 7px;
  }
  .app-body .sidebar-footer-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 8px 5px;
    border-radius: 8px;
    color: #8f98ae;
    font-size: 10px;
    font-weight: 700;
  }
  .app-body .sidebar-footer-links a:hover {
    background: rgba(255,255,255,.05);
    color: #fff;
  }
  .app-body .sidebar-footer-links svg {
    width: 13px;
    height: 13px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .app-body .app-main {
    max-width: calc(100vw - 274px);
    width: 100%;
    padding: 27px clamp(24px,3vw,46px) 34px;
  }
  .app-body .topbar {
    max-width: 1560px;
    min-height: 84px;
    margin: 0 auto 23px;
    padding: 0 0 21px;
    border-bottom: 1px solid var(--admin-line);
    align-items: center;
  }
  .app-body .topbar-copy {
    min-width: 0;
  }
  .app-body .crumb {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #98a2b3;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .09em;
    font-weight: 800;
  }
  .app-body .crumb a {
    color: #667085;
  }
  .app-body .topbar h1 {
    font-size: 30px;
    line-height: 1.12;
    margin: 5px 0 5px;
    color: var(--admin-ink);
    font-weight: 730;
    letter-spacing: -.04em;
  }
  .app-body .page-description {
    margin: 0;
    color: var(--admin-muted);
    font-size: 13px;
    max-width: 720px;
  }
  .app-body .top-actions {
    gap: 8px;
    flex-wrap: nowrap;
  }
  .app-body .environment-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border: 1px solid var(--admin-line);
    border-radius: 999px;
    background: rgba(255,255,255,.76);
    color: #475467;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
  }
  .app-body .environment-pill i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #12b76a;
    box-shadow: 0 0 0 3px rgba(18,183,106,.1);
  }
  .app-body .top-action-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 11px;
    border: 1px solid var(--admin-line);
    border-radius: 9px;
    background: #fff;
    color: #475467;
    font-size: 12px;
    font-weight: 750;
    box-shadow: 0 1px 2px rgba(16,24,40,.03);
  }
  .app-body .top-action-link:hover {
    border-color: #c9c4ff;
    color: #5549e6;
    background: #fbfaff;
  }
  .app-body .top-action-link svg {
    width: 15px;
    height: 15px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .app-body .user-menu {
    position: relative;
    margin: 0;
  }
  .app-body .user-menu summary {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    padding: 4px 7px 4px 5px;
    border: 1px solid var(--admin-line);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(16,24,40,.03);
  }
  .app-body .user-menu summary::-webkit-details-marker {
    display: none;
  }
  .app-body .user-menu summary:hover {
    border-color: #c9c4ff;
  }
  .app-body .avatar {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    border-radius: 9px;
    background: linear-gradient(145deg,#7b71f8,#584de4);
    box-shadow: none;
    font-size: 12px;
  }
  .app-body .user-meta {
    display: grid;
    line-height: 1.2;
    max-width: 150px;
  }
  .app-body .user-meta b {
    font-size: 11px;
    color: #344054;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .app-body .user-meta small {
    font-size: 9px;
    color: #98a2b3;
    margin-top: 3px;
  }
  .app-body .user-chevron svg {
    width: 14px;
    height: 14px;
    stroke: #98a2b3;
    fill: none;
    stroke-width: 2;
    transition: transform .16s ease;
  }
  .app-body .user-menu[open] .user-chevron svg {
    transform: rotate(90deg);
  }
  .app-body .user-menu-popover {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 70;
    width: 220px;
    padding: 7px;
    border: 1px solid var(--admin-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(16,24,40,.14);
  }
  .app-body .user-menu-email {
    padding: 8px 9px 10px;
    border-bottom: 1px solid var(--admin-line);
    margin-bottom: 5px;
    color: #667085;
    font-size: 10px;
    overflow-wrap: anywhere;
  }
  .app-body .user-menu-popover a {
    display: block;
    padding: 9px;
    border-radius: 8px;
    color: #475467;
    font-size: 12px;
    font-weight: 650;
  }
  .app-body .user-menu-popover a:hover {
    background: #f5f6fa;
    color: #101828;
  }
  .app-body .user-menu-popover .logout-link {
    color: #b42318;
  }
  .app-body .mobile-bar {
    border-bottom-color: var(--admin-line);
  }
  .app-body .card,.app-body .panel {
    position: relative;
    max-width: 1560px;
    border: 1px solid var(--admin-line);
    border-radius: 15px;
    background: rgba(255,255,255,.94);
    box-shadow: var(--admin-shadow);
    padding: 23px;
    margin: 0 0 18px;
    overflow: visible;
  }
  .app-body .card:before,.app-body .panel:before {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    top: -1px;
    height: 1px;
    background: linear-gradient(90deg,transparent,rgba(103,92,246,.35),transparent);
    opacity: .7;
  }
  .app-body .card:hover,.app-body .panel:hover {
    box-shadow: 0 2px 4px rgba(16,24,40,.04),0 16px 38px rgba(16,24,40,.06);
  }
  .app-body .card h2,.app-body .panel h2 {
    font-size: 18px;
    font-weight: 720;
    letter-spacing: -.028em;
    color: #1d2034;
    margin-bottom: 7px;
  }
  .app-body .card h3,.app-body .panel h3 {
    font-size: 14px;
    color: #344054;
  }
  .app-body .card p,.app-body .panel p {
    color: #667085;
  }
  .app-body .panel-title {
    align-items: center;
    margin-bottom: 17px;
  }
  .app-body .panel-title p {
    margin: 4px 0 0;
    font-size: 12px;
  }
  .app-body .grid {
    gap: 15px;
  }
  .app-body .grid.two {
    gap: 18px;
  }
  .app-body .metric {
    border: 1px solid var(--admin-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16,24,40,.035);
    min-height: 118px;
    padding: 19px;
  }
  .app-body .metric:before {
    left: 18px;
    top: 17px;
    bottom: auto;
    width: 31px;
    height: 3px;
    border-radius: 99px;
    background: var(--admin-violet);
  }
  .app-body .metric span {
    margin-top: 14px;
    color: #7f8596;
    font-size: 10px;
    letter-spacing: .08em;
  }
  .app-body .metric strong {
    font-size: 29px;
    font-weight: 720;
    color: #1b1f32;
    margin-top: 6px;
  }
  .app-body .metric small {
    display: block;
    color: #98a2b3;
    font-size: 10px;
    margin-top: 3px;
  }
  .app-body .stats {
    gap: 10px;
  }
  .app-body .stats>div {
    padding: 14px;
    border-color: var(--admin-line);
    border-radius: 11px;
    background: #fafbfc;
  }
  .app-body .stats span {
    font-size: 9px;
    letter-spacing: .08em;
  }
  .app-body .stats strong {
    font-size: 16px;
    color: #25293b;
  }
  .app-body label {
    gap: 6px;
    color: #475467;
    font-size: 11px;
    font-weight: 750;
  }
  .app-body input,.app-body select,.app-body textarea {
    border: 1px solid #d7dbe4;
    border-radius: 9px;
    background: #fff;
    color: #1d2939;
    box-shadow: 0 1px 2px rgba(16,24,40,.025);
    margin: 0;
    min-height: 42px;
    padding: 9px 11px;
  }
  .app-body input:hover,.app-body select:hover,.app-body textarea:hover {
    border-color: #b9bfca;
  }
  .app-body input:focus,.app-body select:focus,.app-body textarea:focus {
    border-color: #8e85fb;
    box-shadow: 0 0 0 4px rgba(103,92,246,.11);
    outline: 0;
  }
  .app-body textarea {
    min-height: 118px;
  }
  .app-body .row {
    gap: 12px;
  }
  .app-body form:not(.row):not(.table-actions):not([data-inline-form]) {
    gap: 14px 16px;
  }
  .app-body .btn,.app-body button,.app-body .pill {
    min-height: 40px;
    height: auto;
    border-radius: 9px;
    padding: 9px 13px;
    background: linear-gradient(180deg,#7065f8,#5d52e8);
    border-color: #5d52e8;
    font-size: 12px;
    font-weight: 750;
    box-shadow: 0 1px 2px rgba(16,24,40,.06),0 5px 12px rgba(103,92,246,.13);
  }
  .app-body .btn:hover,.app-body button:hover {
    background: linear-gradient(180deg,#665bf1,#5147dc);
    transform: translateY(-1px);
    box-shadow: 0 2px 3px rgba(16,24,40,.06),0 8px 17px rgba(103,92,246,.17);
  }
  .app-body .btn.secondary,.app-body button.secondary,.app-body .pill {
    background: #fff;
    color: #475467 !important;
    border-color: #d7dbe4;
    box-shadow: 0 1px 2px rgba(16,24,40,.035);
  }
  .app-body .btn.secondary:hover,.app-body button.secondary:hover,.app-body .pill:hover {
    background: #f9fafb;
    border-color: #b9bfca;
  }
  .app-body .danger,.app-body .btn.danger {
    background: #d92d20 !important;
    border-color: #d92d20 !important;
  }
  .app-body .badge {
    border-radius: 999px;
    padding: 4px 8px;
    background: #f2f4f7;
    border-color: #e4e7ec;
    color: #475467;
    font-size: 10px;
  }
  .app-body .flash {
    max-width: 1560px;
    padding: 13px 15px;
    border-radius: 11px;
    font-size: 12px;
    box-shadow: 0 1px 2px rgba(16,24,40,.03);
  }
  .app-body .table-wrap,.app-body .card>table,.app-body .panel>table {
    width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--admin-line);
    border-radius: 11px;
    background: #fff;
    scrollbar-width: thin;
  }
  .app-body .card>table,.app-body .panel>table {
    display: block;
  }
  .app-body table {
    width: 100%;
    min-width: 720px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11px;
  }
  .app-body th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 10px 12px;
    background: #f8f9fb;
    color: #7d8496;
    border-bottom: 1px solid var(--admin-line);
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 850;
    white-space: nowrap;
  }
  .app-body td {
    padding: 11px 12px;
    border-bottom: 1px solid #eef0f4;
    color: #475467;
    vertical-align: middle;
  }
  .app-body tbody tr:last-child td {
    border-bottom: 0;
  }
  .app-body tbody tr:hover td {
    background: #fbfaff;
  }
  .app-body td strong {
    color: #25293b;
  }
  .app-body td code {
    display: inline-block;
    padding: 3px 6px;
    border-radius: 6px;
    background: #f3f2ff;
    color: #5147df;
    font-size: 10px;
  }
  .app-body .table-actions {
    gap: 5px;
  }
  .app-body .table-actions input,.app-body .table-actions select {
    height: 34px;
    min-height: 34px;
  }
  .app-body table form button {
    height: 34px;
    min-height: 34px;
    padding: 6px 9px;
    font-size: 10px;
  }
  .app-body .progress {
    height: 8px;
    border-radius: 99px;
    background: #edeff3;
    overflow: hidden;
  }
  .app-body .progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#675cf6,#8f85ff);
  }
  .app-body pre {
    border-radius: 11px;
    background: #111526;
    color: #d0d5dd;
    border: 1px solid #252b40;
    padding: 16px;
    font-size: 11px;
    line-height: 1.65;
  }
  .app-body details:not(.side-group):not(.user-menu) {
    border: 1px solid var(--admin-line);
    border-radius: 10px;
    background: #fff;
    padding: 0;
  }
  .app-body details:not(.side-group):not(.user-menu)>summary {
    padding: 12px 14px;
    color: #475467;
    font-size: 12px;
    font-weight: 750;
    cursor: pointer;
  }
  .app-body details:not(.side-group):not(.user-menu)>*:not(summary) {
    margin-left: 14px;
    margin-right: 14px;
  }
  .app-body .tabs {
    border-bottom-color: var(--admin-line);
  }
  .app-body .tab {
    font-size: 11px;
    font-weight: 750;
  }
  .app-body .ticket-message {
    border-radius: 12px;
    border-color: var(--admin-line);
    background: #fafbfc;
  }
  .app-body .modal {
    border-radius: 16px;
    border: 1px solid var(--admin-line);
    box-shadow: 0 28px 80px rgba(16,24,40,.2);
  }
  .app-body .admin-footer {
    max-width: 1560px;
    margin: 25px auto 0;
    padding: 18px 2px 0;
    border-top: 1px solid var(--admin-line);
    display: flex;
    justify-content: space-between;
    gap: 20px;
    color: #98a2b3;
    font-size: 9px;
    letter-spacing: .03em;
  }
  .app-body .dashboard-hero {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 18px;
    max-width: 1560px;
    margin: 0 auto 18px;
  }
  .app-body .dashboard-welcome {
    position: relative;
    overflow: hidden;
    padding: 26px;
    border-radius: 16px;
    background: linear-gradient(135deg,#191e31,#252a43 58%,#2d285e);
    color: #fff;
    box-shadow: 0 18px 46px rgba(16,24,40,.12);
  }
  .app-body .dashboard-welcome:after {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    right: -80px;
    top: -110px;
    background: radial-gradient(circle,rgba(132,124,251,.52),rgba(132,124,251,0) 69%);
  }
  .app-body .dashboard-welcome>* {
    position: relative;
    z-index: 1;
  }
  .app-body .dashboard-eyebrow {
    display: block;
    color: #aeb6c8;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .13em;
    font-weight: 850;
  }
  .app-body .dashboard-welcome h2 {
    color: #fff;
    font-size: 25px;
    margin: 8px 0 8px;
    max-width: 520px;
  }
  .app-body .dashboard-welcome p {
    color: #b7bed0;
    max-width: 590px;
    margin: 0;
    font-size: 12px;
  }
  .app-body .dashboard-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 20px;
  }
  .app-body .dashboard-welcome .btn.secondary {
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.14);
    color: #fff !important;
  }
  .app-body .dashboard-welcome .btn.secondary:hover {
    background: rgba(255,255,255,.13);
  }
  .app-body .dashboard-status {
    padding: 22px;
    border: 1px solid var(--admin-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--admin-shadow);
  }
  .app-body .dashboard-status-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 15px;
  }
  .app-body .dashboard-status h2 {
    font-size: 16px;
    margin: 0;
  }
  .app-body .health-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border-radius: 99px;
    background: #ecfdf3;
    color: #067647;
    font-size: 9px;
    font-weight: 850;
  }
  .app-body .health-badge i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #12b76a;
  }
  .app-body .status-list {
    display: grid;
    gap: 10px;
  }
  .app-body .status-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 9px;
    border-bottom: 1px solid #f0f1f4;
    color: #667085;
    font-size: 11px;
  }
  .app-body .status-row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
  }
  .app-body .status-row strong {
    color: #344054;
  }
  .app-body .dashboard-metrics {
    max-width: 1560px;
    margin: 0 auto 18px;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 12px;
  }
  .app-body .dashboard-metrics .metric {
    margin: 0;
  }
  .app-body .section-heading {
    max-width: 1560px;
    margin: 24px auto 11px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
  }
  .app-body .section-heading h2 {
    font-size: 16px;
    margin: 0;
  }
  .app-body .section-heading p {
    font-size: 11px;
    color: #98a2b3;
    margin: 3px 0 0;
  }
  @media (max-width:1180px) {
    .app-body .environment-pill {
      display: none;
    }
    .app-body .dashboard-metrics {
      grid-template-columns: repeat(2,1fr);
    }
    .app-body .dashboard-hero {
      grid-template-columns: 1fr;
    }
    .app-body .app-main {
      padding-left: 24px;
      padding-right: 24px;
    }
  }
  @media (max-width:900px) {
    .app-body .app-sidebar {
      width: min(88vw,300px);
      box-shadow: 18px 0 55px rgba(16,24,40,.24);
    }
    .app-body .app-main {
      max-width: none;
      padding-top: calc(16px + env(safe-area-inset-top));
    }
    .app-body .mobile-bar {
      display: flex;
      background: rgba(247,248,252,.92);
      backdrop-filter: blur(14px);
      border-bottom: 1px solid var(--admin-line);
    }
    .app-body .topbar {
      margin-top: 15px;
    }
    .app-body .top-action-link {
      display: none;
    }
    .app-body .sidebar-close {
      display: grid;
      place-items: center;
      background: rgba(255,255,255,.07);
      border-color: rgba(255,255,255,.08);
    }
    .app-body .sidebar-close svg {
      stroke: #fff;
      fill: none;
      width: 17px;
    }
    .app-body .admin-footer {
      display: block;
    }
    .app-body .admin-footer span {
      display: block;
      margin-top: 4px;
    }
  }
  @media (max-width:680px) {
    .app-body .app-main {
      padding-left: 12px;
      padding-right: 12px;
    }
    .app-body .topbar {
      align-items: flex-start;
      gap: 12px;
    }
    .app-body .topbar h1 {
      font-size: 25px;
    }
    .app-body .page-description {
      font-size: 12px;
    }
    .app-body .user-meta,.app-body .user-chevron {
      display: none;
    }
    .app-body .user-menu summary {
      padding: 4px;
    }
    .app-body .card,.app-body .panel {
      padding: 17px;
      border-radius: 13px;
    }
    .app-body .dashboard-welcome,.app-body .dashboard-status {
      padding: 20px;
    }
    .app-body .dashboard-metrics {
      grid-template-columns: 1fr 1fr;
      gap: 9px;
    }
    .app-body .metric {
      min-height: 105px;
      padding: 15px;
    }
    .app-body .metric:before {
      left: 15px;
      top: 14px;
    }
    .app-body .metric strong {
      font-size: 24px;
    }
    .app-body form:not(.row):not(.table-actions):not([data-inline-form]) {
      grid-template-columns: 1fr;
    }
    .app-body form:not(.row):not(.table-actions):not([data-inline-form])>* {
      grid-column: 1 !important;
    }
    .app-body .form-actions,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>button,.app-body form:not(.row):not(.table-actions):not([data-inline-form])>.btn {
      width: 100%;
    }
    .app-body .form-actions .btn,.app-body .form-actions button {
      flex: 1;
    }
    .app-body input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.app-body select,.app-body textarea {
      font-size: 16px;
    }
    .app-body .section-heading {
      display: block;
    }
    .app-body table {
      min-width: 660px;
    }
  }
  @media (max-width:420px) {
    .app-body .dashboard-metrics {
      grid-template-columns: 1fr;
    }
    .app-body .dashboard-actions {
      display: grid;
    }
    .app-body .dashboard-actions .btn {
      width: 100%;
    }
    .app-body .card,.app-body .panel {
      padding: 14px;
    }
    .app-body .topbar h1 {
      font-size: 22px;
    }
    .app-body .crumb {
      font-size: 8px;
    }
  }
  @media (hover:none) {
    .app-body .card:hover,.app-body .panel:hover,.app-body .btn:hover,.app-body button:hover {
      transform: none;
    }
  }
  @media (prefers-reduced-motion:reduce) {
    .app-body * {
      transition: none !important;
      scroll-behavior: auto !important;
    }
  }
  .app-body .dashboard-target-form {
    margin-top: 17px;
  }
  .app-body .dashboard-target-form label {
    max-width: 320px;
  }
  .app-body .dashboard-target-form input {
    margin-top: 6px;
  }
  .app-body {
    --admin-bg: #f5f7fb;
    --admin-surface: #ffffff;
    --admin-ink: #101828;
    --admin-muted: #475467;
    --admin-subtle: #667085;
    --admin-line: #dfe3eb;
    --admin-violet: #5b50e6;
    --admin-violet-2: #493ed0;
    --admin-violet-soft: #eeecff;
    --admin-focus: #5b50e6;
    --admin-focus-soft: rgba(91,80,230,.20);
    background: radial-gradient(circle at 84% -8%,rgba(91,80,230,.08),transparent 27%),var(--admin-bg);
    color: var(--admin-ink);
  }
  @media (min-width:901px) {
    .app-body .app-shell {
      display: block;
      min-height: 100dvh;
    }
    .app-body .app-sidebar {
      position: fixed;
      inset: 0 auto 0 0;
      z-index: 60;
      width: 274px;
      height: 100dvh;
      overflow-y: auto;
      overscroll-behavior: contain;
    }
    .app-body .app-main {
      width: auto;
      max-width: none;
      min-height: 100dvh;
      margin-left: 274px;
      padding-left: clamp(24px,3vw,46px);
      padding-right: clamp(24px,3vw,46px);
    }
  }
  .app-body .app-sidebar {
    background: #111526;
    color: #fff;
    border-right: 1px solid #20263a;
    box-shadow: 12px 0 36px rgba(16,24,40,.12);
  }
  .app-body .app-logo {
    color: #fff;
  }
  .app-body .logo-copy b {
    color: #fff;
  }
  .app-body .logo-copy small {
    color: #a6aec1;
  }
  .app-body .side-group summary {
    color: #aab2c5;
  }
  .app-body .side-group summary:hover {
    color: #fff;
  }
  .app-body .side-link {
    color: #d0d5dd;
  }
  .app-body .side-link:hover {
    background: #20263a;
    color: #fff;
  }
  .app-body .side-link.active {
    background: #312c63;
    color: #fff;
    box-shadow: inset 3px 0 0 #9a92ff;
  }
  .app-body .side-icon {
    color: #aeb7cc;
  }
  .app-body .side-link:hover .side-icon,.app-body .side-link.active .side-icon {
    color: #fff;
    background: rgba(255,255,255,.08);
  }
  .app-body .workspace-status {
    background: #191e31;
    border: 1px solid rgba(255,255,255,.08);
  }
  .app-body .workspace-status strong {
    color: #fff;
  }
  .app-body .workspace-status small,.app-body .sidebar-footer-links a {
    color: #b4bccf;
  }
  .app-body .sidebar-footer-links a:hover {
    color: #fff;
    background: #20263a;
  }
  .app-body .skip-link:focus {
    outline: 3px solid #a8a2ff;
    outline-offset: 2px;
  }
  .app-body :is(a,button,input,select,textarea,summary):focus-visible {
    outline: 3px solid var(--admin-focus);
    outline-offset: 2px;
  }
  .app-body .app-sidebar :is(a,button,summary):focus-visible {
    outline-color: #aaa3ff;
  }
  .app-body .topbar {
    align-items: center;
  }
  .app-body .topbar h1,.app-body .card h2,.app-body .panel h2,.app-body .card h3,.app-body .panel h3 {
    color: var(--admin-ink);
  }
  .app-body .page-description,.app-body .card p,.app-body .panel p,.app-body .muted {
    color: var(--admin-muted);
  }
  .app-body .crumb {
    color: #667085;
  }
  .app-body .environment-pill {
    color: #344054;
    border-color: #d7dce5;
    background: #fff;
  }
  .app-body .card,.app-body .panel {
    border-color: var(--admin-line);
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(16,24,40,.04),0 10px 30px rgba(16,24,40,.045);
    padding: clamp(20px,2.2vw,30px);
    margin-bottom: 22px;
  }
  .app-body .card:before,.app-body .panel:before {
    display: none;
  }
  .app-body .card:hover,.app-body .panel:hover {
    box-shadow: 0 1px 2px rgba(16,24,40,.04),0 10px 30px rgba(16,24,40,.045);
  }
  .app-body .panel-title {
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 22px;
  }
  .app-body .panel-title h2 {
    font-size: 20px;
    margin: 0 0 6px;
  }
  .app-body .panel-title p {
    font-size: 13px;
    line-height: 1.55;
    margin: 0;
    max-width: 760px;
  }
  .app-body .panel-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
  }
  .app-body label {
    display: block;
    color: #344054;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
  }
  .app-body input,.app-body select,.app-body textarea {
    width: 100%;
    min-height: 44px;
    margin: 7px 0 0;
    padding: 10px 12px;
    border: 1px solid #cfd5df;
    border-radius: 10px;
    background: #fff;
    color: #101828;
    box-shadow: 0 1px 2px rgba(16,24,40,.03);
  }
  .app-body input::placeholder,.app-body textarea::placeholder {
    color: #667085;
    opacity: 1;
  }
  .app-body input:hover,.app-body select:hover,.app-body textarea:hover {
    border-color: #98a2b3;
  }
  .app-body input:focus,.app-body select:focus,.app-body textarea:focus {
    border-color: #6f63ed;
    box-shadow: 0 0 0 4px var(--admin-focus-soft);
    outline: 0;
  }
  .app-body .field {
    min-width: 0;
  }
  .app-body .field-hint {
    display: block;
    margin-top: 6px;
    color: #667085;
    font-size: 12px;
    line-height: 1.4;
  }
  .app-body .field-full {
    grid-column: 1/-1 !important;
  }
  .app-body .field-span-4 {
    grid-column: span 4 !important;
  }
  .app-body .field-span-6 {
    grid-column: span 6 !important;
  }
  .app-body .btn,.app-body button {
    min-height: 42px;
    padding: 10px 15px;
    border-radius: 10px;
    background: #5b50e6;
    border-color: #5b50e6;
    color: #fff !important;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.15;
    box-shadow: 0 1px 2px rgba(16,24,40,.08),0 5px 12px rgba(91,80,230,.15);
  }
  .app-body .btn:hover,.app-body button:hover {
    background: #493ed0;
    border-color: #493ed0;
    transform: none;
    box-shadow: 0 2px 3px rgba(16,24,40,.08),0 7px 16px rgba(91,80,230,.18);
  }
  .app-body .btn.secondary,.app-body button.secondary,.app-body .pill {
    background: #fff;
    color: #344054 !important;
    border-color: #cfd5df;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
  }
  .app-body .btn.secondary:hover,.app-body button.secondary:hover,.app-body .pill:hover {
    background: #f8f9fc;
    border-color: #98a2b3;
    color: #101828 !important;
  }
  .app-body .danger,.app-body .btn.danger {
    background: #c5221f !important;
    border-color: #c5221f !important;
    color: #fff !important;
  }
  .app-body .danger:hover,.app-body .btn.danger:hover {
    background: #a91b18 !important;
    border-color: #a91b18 !important;
  }
  .app-body .compact {
    min-height: 36px;
    height: 36px;
    padding: 7px 11px;
    font-size: 12px;
    border-radius: 8px;
  }
  .app-body .badge {
    padding: 5px 9px;
    font-size: 11px;
    font-weight: 750;
    color: #344054;
    background: #f2f4f7;
    border-color: #dfe3e8;
  }
  .app-body .badge.success {
    background: #ecfdf3 !important;
    color: #067647 !important;
    border-color: #abefc6 !important;
  }
  .app-body .badge.warning {
    background: #fffaeb !important;
    color: #93370d !important;
    border-color: #fedf89 !important;
  }
  .app-body .danger-soft {
    background: #fef3f2 !important;
    color: #b42318 !important;
    border-color: #fecdca !important;
  }
  .app-body .dashboard-metrics {
    gap: 16px;
    margin-bottom: 22px;
  }
  .app-body .metric {
    min-height: 126px;
    padding: 22px;
    border-color: var(--admin-line);
    border-radius: 14px;
  }
  .app-body .metric:before {
    left: 22px;
    top: 20px;
    width: 34px;
    height: 4px;
    background: #6b60ed;
  }
  .app-body .metric span {
    margin-top: 17px;
    color: #475467;
    font-size: 11px;
  }
  .app-body .metric strong {
    font-size: 31px;
    color: #101828;
  }
  .app-body .table-wrap {
    border-color: var(--admin-line);
    border-radius: 12px;
    margin-top: 20px;
  }
  .app-body table {
    font-size: 12px;
  }
  .app-body th {
    padding: 12px 14px;
    background: #f8f9fc;
    color: #475467;
    font-size: 10px;
    letter-spacing: .07em;
  }
  .app-body td {
    padding: 14px;
    color: #475467;
  }
  .app-body td strong {
    color: #101828;
  }
  .app-body tbody tr:hover td {
    background: #fafaff;
  }
  .app-body .empty-cell {
    text-align: center;
    color: #667085;
    padding: 28px;
  }
  .app-body table form {
    margin: 0;
  }
  .app-body .copybox {
    border-color: #d8dce6;
    background: #f8f9fc;
    border-radius: 11px;
    padding: 8px;
    min-height: 44px;
  }
  .app-body .copybox code {
    color: #3830a8;
    background: transparent;
    padding: 0;
    font-size: 12px;
  }
  .app-body .copybox-prominent {
    padding: 10px 10px 10px 14px;
  }
  .app-body .copybox-prominent code {
    font-size: 14px;
    color: #1d2939;
  }
  .app-body .copybox-table {
    min-width: 260px;
  }
  .app-body .code-copy {
    align-items: stretch;
    flex-direction: column;
  }
  .app-body .code-copy code {
    white-space: pre-wrap;
    line-height: 1.55;
    color: #e4e7ec;
    background: #111526;
    border-radius: 8px;
    padding: 14px;
    max-height: 360px;
    overflow: auto;
  }
  .app-body .code-copy button {
    align-self: flex-end;
  }
  .app-body .compact-form,.app-body .settings-form {
    display: grid !important;
    grid-template-columns: repeat(12,minmax(0,1fr)) !important;
    gap: 18px !important;
    align-items: end !important;
    margin: 0 !important;
  }
  .app-body .compact-form>.field {
    grid-column: span 4;
  }
  .app-body .compact-form>.form-actions {
    grid-column: auto;
    align-self: end;
    justify-content: flex-start;
    margin: 0;
  }
  .app-body .key-create-form>.field {
    grid-column: span 5;
  }
  .app-body .team-form>.field {
    grid-column: span 3;
  }
  .app-body .team-form>.form-actions {
    grid-column: 1/-1;
  }
  .app-body .settings-form>.form-actions {
    justify-content: flex-start;
    padding-top: 2px;
  }
  .app-body .settings-stack {
    display: grid;
    gap: 0;
    border: 1px solid var(--admin-line);
    border-radius: 14px;
    overflow: hidden;
  }
  .app-body .settings-section {
    display: grid;
    grid-template-columns: minmax(190px,280px) minmax(0,1fr);
    gap: 34px;
    padding: 26px;
  }
  .app-body .settings-section+.settings-section {
    border-top: 1px solid var(--admin-line);
  }
  .app-body .settings-copy h3 {
    margin: 0 0 6px;
    font-size: 15px;
  }
  .app-body .settings-copy p {
    margin: 0;
    font-size: 12px;
    line-height: 1.55;
  }
  .app-body .service-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 16px;
  }
  .app-body .service-card {
    border: 1px solid var(--admin-line);
    border-radius: 14px;
    background: #fff;
    padding: 20px;
    min-width: 0;
  }
  .app-body .service-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
  }
  .app-body .service-card h3 {
    font-size: 16px;
    margin: 0 0 5px;
  }
  .app-body .service-card p {
    font-size: 12px;
    line-height: 1.5;
    margin: 0;
  }
  .app-body .endpoint-list {
    display: grid;
    gap: 8px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #eef0f4;
  }
  .app-body .endpoint-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-width: 0;
  }
  .app-body .endpoint-row code {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #344054;
    font-size: 11px;
  }
  .app-body .security-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 20px;
    border: 1px solid var(--admin-line);
    border-radius: 13px;
    background: #f9fafb;
  }
  .app-body .security-option h3 {
    margin: 0 0 5px;
    font-size: 15px;
  }
  .app-body .security-option p {
    margin: 0;
    font-size: 12px;
  }
  .app-body .security-option form {
    margin: 0;
    flex: 0 0 auto;
  }
  .app-body .security-setup {
    display: grid;
    grid-template-columns: 220px minmax(0,520px);
    gap: 24px;
    align-items: center;
  }
  .app-body .qr-card {
    display: grid;
    place-items: center;
    padding: 16px;
    border: 1px solid var(--admin-line);
    border-radius: 13px;
    background: #fff;
  }
  .app-body .qr-card img {
    width: 188px;
    height: 188px;
  }
  .app-body section[id] {
    scroll-margin-top: 24px;
  }
  .app-body .key-reveal {
    border-color: #c9c5ff;
    background: linear-gradient(135deg,#fff,#faf9ff);
  }
  .app-body .flash {
    color: #3730a3;
    background: #eef2ff;
    border-color: #c7d2fe;
    font-size: 13px;
  }
  .app-body .flash.error {
    color: #912018;
    background: #fef3f2;
    border-color: #fecdca;
  }
  .app-body .flash.success {
    color: #05603a;
    background: #ecfdf3;
    border-color: #abefc6;
  }
  @media (max-width:1180px) {
    .app-body .settings-section {
      grid-template-columns: 1fr;
      gap: 18px;
    }
    .app-body .service-grid {
      grid-template-columns: 1fr;
    }
    .app-body .team-form>.field {
      grid-column: span 4;
    }
    .app-body .team-form>.form-actions {
      grid-column: 1/-1;
    }
  }
  @media (max-width:900px) {
    .app-body .app-shell {
      display: block;
    }
    .app-body .app-sidebar {
      position: fixed;
      inset: 0 auto 0 0;
      width: min(88vw,310px);
      height: 100dvh;
      transform: translateX(-105%);
    }
    .app-body .app-sidebar.open {
      transform: translateX(0);
    }
    .app-body .app-main {
      margin-left: 0;
      max-width: none;
      padding-left: 16px;
      padding-right: 16px;
    }
    .app-body .sidebar-close {
      color: #fff;
    }
    .app-body .topbar {
      margin-top: 14px;
    }
    .app-body .compact-form>.field,.app-body .key-create-form>.field,.app-body .team-form>.field {
      grid-column: span 6;
    }
    .app-body .compact-form>.form-actions,.app-body .team-form>.form-actions {
      grid-column: 1/-1;
    }
  }
  @media (max-width:680px) {
    .app-body .panel-title {
      display: block;
      margin-bottom: 18px;
    }
    .app-body .panel-actions {
      margin-top: 14px;
    }
    .app-body .panel-actions .btn {
      flex: 1 1 auto;
    }
    .app-body .compact-form,.app-body .settings-form {
      grid-template-columns: 1fr !important;
      gap: 14px !important;
    }
    .app-body .compact-form>* ,.app-body .settings-form>* {
      grid-column: 1 !important;
    }
    .app-body .compact-form>.form-actions,.app-body .settings-form>.form-actions {
      width: 100%;
    }
    .app-body .compact-form>.form-actions button,.app-body .settings-form>.form-actions button {
      width: 100%;
    }
    .app-body .settings-section {
      padding: 20px;
    }
    .app-body .security-option {
      align-items: flex-start;
      flex-direction: column;
    }
    .app-body .security-option form,.app-body .security-option button {
      width: 100%;
    }
    .app-body .security-setup {
      grid-template-columns: 1fr;
    }
    .app-body .qr-card {
      justify-self: start;
    }
    .app-body .endpoint-row {
      align-items: flex-start;
      flex-direction: column;
    }
    .app-body .endpoint-row button {
      width: 100%;
    }
    .app-body .copybox-table {
      min-width: 220px;
    }
  }
  @media (max-width:420px) {
    .app-body .panel-actions {
      display: grid;
    }
    .app-body .panel-actions .btn {
      width: 100%;
    }
    .app-body .settings-section {
      padding: 16px;
    }
    .app-body .qr-card {
      justify-self: stretch;
    }
  }
  .app-body .sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
  .app-body :is(button,.btn,input,select,textarea):disabled {
    cursor: not-allowed;
    opacity: 1;
  }
  .app-body :is(button,.btn):disabled {
    background: #e4e7ec !important;
    border-color: #d0d5dd !important;
    color: #667085 !important;
    box-shadow: none !important;
  }
  .app-body input:disabled,.app-body select:disabled,.app-body textarea:disabled {
    background: #f2f4f7;
    color: #667085;
  }
  .app-body select[multiple] {
    min-height: 154px;
    padding: 7px;
  }
  .app-body select[multiple] option {
    padding: 7px 9px;
    border-radius: 6px;
  }
  .app-body select[multiple] option:checked {
    background: #e9e7ff;
    color: #2f287f;
  }
  .app-body .table-subtext {
    display: block;
    margin-top: 5px;
    color: #667085;
    font-size: 11px;
    line-height: 1.45;
    overflow-wrap: anywhere;
  }
  .app-body .credential-guidance>div {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px;
    border: 1px solid var(--admin-line);
    border-radius: 12px;
    background: #f9fafb;
  }
  .app-body .credential-guidance p {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.5;
  }
  .app-body .credential-icon {
    display: grid;
    place-items: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: #eceaff;
    color: #4f46c8;
  }
  .app-body .credential-icon svg {
    width: 17px;
    height: 17px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.8;
  }
  .app-body .credential-create>summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    padding: 13px 16px;
    cursor: pointer;
    color: #101828;
    font-size: 13px;
    font-weight: 750;
    background: #f8f9fc;
    list-style: none;
  }
  .app-body .credential-create>summary::-webkit-details-marker {
    display: none;
  }
  .app-body .credential-create>summary:after {
    content: "+";
    font-size: 20px;
    color: #667085;
    font-weight: 500;
  }
  .app-body .credential-create[open]>summary:after {
    content: "−";
  }
  .app-body .credential-create .settings-form {
    padding: 18px;
    align-items: start !important;
  }
  .app-body .action-menu {
    min-width: 116px;
  }
  .app-body .action-menu>summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .app-body .action-menu>summary::-webkit-details-marker {
    display: none;
  }
  .app-body .action-menu-popover {
    display: grid;
    gap: 14px;
    width: min(390px,78vw);
    margin-top: 8px;
    padding: 14px;
    border: 1px solid #d6dae3;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(16,24,40,.13);
  }
  .app-body .key-manage-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    margin: 0 !important;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--admin-line);
  }
  .app-body .key-manage-form.rotate-form {
    grid-template-columns: 1fr 1fr !important;
  }
  .app-body .key-manage-form.rotate-form button {
    grid-column: 1/-1;
    justify-self: start;
  }
  .app-body .action-menu-popover>form:last-child {
    margin: 0;
  }
  .app-body .action-menu-popover>form:last-child button {
    width: 100%;
  }
  .app-body .key-reveal .copybox code {
    overflow-wrap: anywhere;
    word-break: break-all;
  }
  .app-body .explorer-toolbar {
    display: grid;
    grid-template-columns: minmax(260px,2fr) minmax(180px,1fr) minmax(160px,.8fr);
    gap: 14px;
    align-items: end;
  }
  .app-body .explorer-layout {
    display: grid;
    grid-template-columns: minmax(0,1.35fr) minmax(360px,.65fr);
    gap: 20px;
    max-width: 1560px;
    margin: 0 auto;
  }
  .app-body .explorer-layout>.panel {
    margin: 0;
    max-width: none;
  }
  .app-body .explorer-table-wrap {
    max-height: calc(100dvh - 330px);
    min-height: 420px;
    overflow: auto;
  }
  .app-body .explorer-table-wrap table {
    min-width: 780px;
  }
  .app-body .explorer-runner {
    align-self: start;
    position: sticky;
    top: 20px;
  }
  .app-body .explorer-form {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 120px !important;
    gap: 14px !important;
    margin: 0 !important;
  }
  .app-body .explorer-form>.form-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-start;
  }
  .app-body .response-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 24px;
  }
  .app-body .response-head h3 {
    margin: 0;
  }
  .app-body .explorer-runner pre {
    min-height: 250px;
    max-height: 48vh;
    margin: 10px 0 0;
    padding: 16px;
    border: 1px solid #252b40;
    border-radius: 12px;
    background: #111526;
    color: #e6e9f2;
    overflow: auto;
    font-size: 12px;
    line-height: 1.55;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
  }
  .app-body .explorer-intro {
    margin-bottom: 20px;
  }
  @media (max-width:1280px) {
    .app-body .explorer-layout {
      grid-template-columns: 1fr;
    }
    .app-body .explorer-runner {
      position: static;
    }
    .app-body .explorer-table-wrap {
      max-height: 620px;
    }
  }
  @media (max-width:900px) {
    .app-body .credential-guidance {
      grid-template-columns: 1fr;
    }
    .app-body .explorer-toolbar {
      grid-template-columns: 1fr 1fr;
    }
    .app-body .explorer-toolbar .field:first-child {
      grid-column: 1/-1;
    }
  }
  @media (max-width:680px) {
    .app-body .explorer-toolbar {
      grid-template-columns: 1fr;
    }
    .app-body .explorer-toolbar .field:first-child {
      grid-column: auto;
    }
    .app-body .explorer-form {
      grid-template-columns: 1fr !important;
    }
    .app-body .explorer-form>* {
      grid-column: 1 !important;
    }
    .app-body .explorer-form>.form-actions {
      display: grid;
      width: 100%;
    }
    .app-body .explorer-form>.form-actions button {
      width: 100%;
    }
    .app-body .key-manage-form.rotate-form {
      grid-template-columns: 1fr !important;
    }
    .app-body .key-manage-form.rotate-form button {
      grid-column: 1;
    }
    .app-body .action-menu-popover {
      width: min(330px,74vw);
    }
  }
  .app-body {
    --admin-page-max: 1560px;
  }
  .app-body .app-main>section,.app-body .app-main>.flash,.app-body .app-main>.dashboard-metrics,.app-body .app-main>.admin-footer {
    max-width: var(--admin-page-max);
    margin-left: auto;
    margin-right: auto;
  }
  .app-body .settings-form {
    grid-auto-flow: row;
  }
  .app-body .settings-form>.field {
    align-self: start;
  }
  .app-body .settings-form>.form-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
  }
  .app-body .profile-form>.field-span-4,.app-body .profile-form>.field-span-6,.app-body .password-form>.field-span-6 {
    min-width: 0;
  }
  .app-body select[multiple] {
    min-height: 154px;
    padding: 8px;
  }
  .app-body select[multiple] option {
    padding: 7px 8px;
    border-radius: 6px;
  }
  .app-body textarea {
    line-height: 1.5;
    resize: vertical;
  }
  .app-body .table-subtext {
    display: block;
    margin-top: 5px;
    color: #667085;
    font-size: 11px;
    line-height: 1.45;
  }
  .app-body .action-menu summary {
    white-space: nowrap;
  }
  .app-body .action-menu-popover {
    display: grid;
    gap: 16px;
    min-width: min(620px,72vw);
    padding: 18px;
    border: 1px solid var(--admin-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 20px 50px rgba(16,24,40,.18);
  }
  .app-body .key-manage-form {
    display: grid;
    grid-template-columns: minmax(0,1.4fr) minmax(220px,1fr) auto !important;
    gap: 14px;
    align-items: end;
    margin: 0;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--admin-line);
  }
  .app-body .key-manage-form.rotate-form {
    grid-template-columns: minmax(220px,1fr) minmax(220px,1fr) auto !important;
  }
  .app-body .action-menu-popover>form:last-child {
    justify-self: start;
  }
  .app-body .credential-guidance {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    margin: 0 0 18px;
  }
  .app-body .credential-guidance>div {
    display: flex;
    gap: 12px;
    padding: 15px;
    border: 1px solid #e1e4ea;
    border-radius: 12px;
    background: #f9fafb;
  }
  .app-body .credential-guidance strong {
    display: block;
    color: #101828;
    font-size: 13px;
  }
  .app-body .credential-guidance p {
    margin: 3px 0 0;
    font-size: 12px;
  }
  .app-body .credential-icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
    background: #eeecff;
    color: #5145cd;
  }
  .app-body .credential-icon svg {
    width: 17px;
    height: 17px;
    stroke: currentColor;
    fill: none;
  }
  .app-body .credential-create {
    margin: 0 0 20px;
    border: 1px solid var(--admin-line);
    border-radius: 13px;
    background: #fff;
    overflow: hidden;
  }
  .app-body .credential-create>summary {
    padding: 15px 18px;
    background: #f8f9fc;
    color: #1d2939;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
  }
  .app-body .credential-create>.settings-form {
    padding: 20px;
  }
  .app-body .suite-security-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 18px;
    padding: 14px 16px;
    border: 1px solid #c7d7fe;
    border-radius: 12px;
    background: #eff6ff;
    color: #1e3a5f;
    font-size: 12px;
    line-height: 1.5;
  }
  .app-body .suite-security-note strong {
    white-space: nowrap;
    color: #153e75;
  }
  .app-body .mail-health-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
  }
  .app-body .mail-health-grid>div {
    display: grid;
    gap: 5px;
    padding: 14px;
    border: 1px solid var(--admin-line);
    border-radius: 11px;
    background: #f9fafb;
    min-width: 0;
  }
  .app-body .mail-health-grid span {
    color: #667085;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
  }
  .app-body .mail-health-grid strong {
    color: #101828;
    font-size: 13px;
    overflow-wrap: anywhere;
  }
  .app-body .mail-error-cell {
    max-width: 330px;
    white-space: normal;
    overflow-wrap: anywhere;
    color: #7a271a;
  }
  .app-body button:disabled,.app-body .btn[aria-disabled=true] {
    cursor: not-allowed;
    opacity: .62;
    box-shadow: none;
    transform: none;
  }
  .app-body .badge {
    line-height: 1.25;
  }
  @media (max-width:1180px) {
    .app-body .action-menu-popover {
      min-width: min(540px,68vw);
    }
    .app-body .key-manage-form,.app-body .key-manage-form.rotate-form {
      grid-template-columns: 1fr 1fr !important;
    }
    .app-body .key-manage-form button {
      grid-column: 1/-1;
      justify-self: start;
    }
    .app-body .mail-health-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (max-width:760px) {
    .app-body .credential-guidance {
      grid-template-columns: 1fr;
    }
    .app-body .action-menu-popover {
      min-width: 0;
      width: min(82vw,440px);
    }
    .app-body .key-manage-form,.app-body .key-manage-form.rotate-form {
      grid-template-columns: 1fr !important;
    }
    .app-body .key-manage-form>* {
      grid-column: 1 !important;
    }
    .app-body .mail-health-grid {
      grid-template-columns: 1fr;
    }
    .app-body .suite-security-note {
      display: grid;
    }
  }
  @media (prefers-reduced-motion:reduce) {
    .app-body * {
      scroll-behavior: auto !important;
      transition-duration: .01ms !important;
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
    }
  }
  .app-body .security-method-option {
    align-items: flex-start;
  }
  .app-body .security-method-form {
    display: grid;
    grid-template-columns: minmax(180px,240px) minmax(180px,240px) auto;
    gap: 14px;
    align-items: end;
    min-width: min(100%,700px);
    margin: 0;
  }
  .app-body .security-method-form .field {
    min-width: 0;
  }
  .app-body .security-method-form button {
    white-space: nowrap;
  }
  @media (max-width:1180px) {
    .app-body .security-method-option {
      display: block;
    }
    .app-body .security-method-form {
      margin-top: 18px;
    }
  }
  @media (max-width:680px) {
    .app-body .security-method-form {
      grid-template-columns: 1fr;
      width: 100%;
    }
    .app-body .security-method-form button {
      width: 100%;
    }
  }
  .app-body .key-manage-form.restrictions-form {
    grid-template-columns: minmax(0,1.35fr) minmax(220px,1fr) minmax(210px,.9fr) auto !important;
  }
  .app-body .key-manage-form.destructive-form {
    grid-template-columns: minmax(220px,1fr) auto !important;
    padding-bottom: 0;
    border-bottom: 0;
  }
  .app-body .key-manage-form.destructive-form button {
    align-self: end;
    white-space: nowrap;
  }
  .app-body .member-remove-popover {
    min-width: min(430px,72vw);
  }
  @media (max-width:1180px) {
    .app-body .key-manage-form.restrictions-form {
      grid-template-columns: 1fr 1fr !important;
    }
    .app-body .key-manage-form.restrictions-form button {
      grid-column: 1/-1;
    }
  }
  @media (max-width:760px) {
    .app-body .key-manage-form.restrictions-form,.app-body .key-manage-form.destructive-form {
      grid-template-columns: 1fr !important;
    }
    .app-body .key-manage-form.restrictions-form>*,.app-body .key-manage-form.destructive-form>* {
      grid-column: 1 !important;
    }
    .app-body .key-manage-form.destructive-form button {
      width: 100%;
    }
    .app-body .member-remove-popover {
      min-width: 0;
      width: min(82vw,390px);
    }
  }
  .app-body {
    --admin-muted: #667085;
  }
  .app-body .side-group summary {
    color: #98a2b3;
  }
  .app-body .side-group summary:hover {
    color: #d0d5dd;
  }
  .app-body .side-group summary:after {
    color: #98a2b3;
  }
  .app-body .side-icon {
    color: #98a2b3;
  }
  .app-body .logo-copy small,.app-body .workspace-status small,.app-body .sidebar-footer-links a {
    color: #aeb6c8;
  }
  .app-body .user-meta small,.app-body .crumb {
    color: #667085;
  }
  .app-body .page-description,.app-body .panel-title p,.app-body .settings-copy p,.app-body .field-hint {
    color: #667085;
  }
  .service-catalogue-filters {
    display: flex;
    gap: 16px;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 18px 0;
  }
  .service-filter-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
  .service-filter-tabs .active {
    box-shadow: 0 0 0 2px rgba(76,91,255,.18);
    border-color: currentColor;
  }
  .service-category-filter {
    min-width: 220px;
    margin: 0;
  }
  .service-category-filter span {
    display: block;
    font-size: .78rem;
    font-weight: 700;
    margin-bottom: 6px;
  }
  .service-category-filter select {
    margin: 0;
  }
  .service-management-table tr[hidden],[data-service-table] tr[hidden] {
    display: none;
  }
  .service-actions button[disabled] {
    opacity: .55;
    cursor: not-allowed;
  }
  .table-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
  }
  .table-actions form {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
  }
  .table-actions input {
    min-width: 190px;
    margin: 0;
  }
  @media (max-width:760px) {
    .service-catalogue-filters {
      align-items: stretch;
    }
    .service-category-filter {
      width: 100%;
    }
    .service-filter-tabs {
      width: 100%;
    }
    .service-filter-tabs button {
      flex: 1 1 calc(33.33% - 8px);
    }
  }
  .account-workspace {
    --account-control-h: 48px;
    --account-border: #d7deea;
    --account-text: #172033;
    --account-muted: #667085;
    --account-soft: #f7f8fc;
    --account-brand: #5b50e6;
  }
  .account-workspace .topbar {
    overflow: visible;
    position: relative;
    z-index: 30;
  }
  .account-workspace .top-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .account-workspace .environment-pill, .account-workspace .top-action-link, .account-workspace .user-menu-trigger, .account-workspace .user-menu>summary {
    box-sizing: border-box;
    height: var(--account-control-h);
    min-height: var(--account-control-h);
    border: 1px solid var(--account-border);
    border-radius: 14px;
    background: #fff;
    color: #344054;
    box-shadow: 0 2px 7px rgba(16,24,40,.05);
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
  }
  .account-workspace .environment-pill {
    border-radius: 999px;
  }
  .account-workspace .top-action-link:hover,.account-workspace .user-menu-trigger:hover,.account-workspace .user-menu>summary:hover {
    border-color: #aaa3ff;
    background: #fbfaff;
    color: #3328b9;
  }
  .account-workspace .top-action-link:focus-visible,.account-workspace .user-menu-trigger:focus-visible,.account-workspace .user-menu>summary:focus-visible {
    outline: 3px solid rgba(91,80,230,.24);
    outline-offset: 2px;
  }
  .account-workspace .top-action-link svg {
    width: 18px;
    height: 18px;
  }
  .account-workspace .user-menu {
    position: relative;
    z-index: 80;
  }
  .account-workspace .user-menu-trigger, .account-workspace .user-menu>summary {
    padding: 4px 10px 4px 5px;
    cursor: pointer;
    min-width: 250px;
    text-align: left;
  }
  .account-workspace .user-menu .avatar {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 11px;
  }
  .account-workspace .user-menu .user-meta {
    min-width: 0;
    max-width: 180px;
    display: grid;
    line-height: 1.15;
  }
  .account-workspace .user-menu .user-meta b {
    font-size: 14px;
    color: #253047;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .account-workspace .user-menu .user-meta small {
    font-size: 11px;
    color: #667085;
    margin-top: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .account-workspace .user-menu .user-chevron {
    margin-left: auto;
    display: flex;
  }
  .account-workspace .user-menu .user-chevron svg {
    width: 16px;
    height: 16px;
    transition: transform .16s ease;
  }
  .account-workspace .user-menu.is-open .user-chevron svg,.account-workspace .user-menu[open] .user-chevron svg {
    transform: rotate(90deg);
  }
  .account-workspace .user-menu-popover {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 1000;
    width: 250px;
    padding: 8px;
    border: 1px solid var(--account-border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 22px 60px rgba(16,24,40,.2);
  }
  .account-workspace details.user-menu:not([open]) .user-menu-popover {
    display: none !important;
  }
  .account-workspace .user-menu-popover a {
    display: block;
    padding: 11px 12px;
    border-radius: 9px;
    color: #344054;
    font-weight: 700;
    text-decoration: none;
  }
  .account-workspace .user-menu-popover a:hover,.account-workspace .user-menu-popover a:focus-visible {
    background: #f2f1ff;
    color: #3328b9;
    outline: none;
  }
  .account-workspace .user-menu-email {
    padding: 9px 12px 12px;
    margin-bottom: 5px;
    border-bottom: 1px solid #eaecf0;
    color: #667085;
    font-size: 12px;
    overflow-wrap: anywhere;
  }
  .account-workspace .side-group {
    background: #f8f9fc;
  }
  .account-workspace .side-group>summary {
    color: #667085;
    font-weight: 850;
  }
  .account-workspace .side-link {
    color: #475467 !important;
    font-weight: 700;
  }
  .account-workspace .side-link .side-icon {
    color: #667085;
    background: #e9edf5;
  }
  .account-workspace .side-link:hover,.account-workspace .side-link:focus-visible {
    color: #101828 !important;
    background: #eceaff;
    outline: none;
  }
  .account-workspace .side-link:hover .side-icon,.account-workspace .side-link:focus-visible .side-icon {
    color: #4136cf;
    background: #dedbff;
  }
  .account-workspace .side-link.active {
    color: #fff !important;
    background: #393271;
  }
  .account-workspace .side-link.active .side-icon {
    color: #fff;
    background: rgba(255,255,255,.13);
  }
  .account-workspace .panel {
    overflow: visible;
  }
  .account-workspace .panel-title {
    align-items: flex-start;
    gap: 18px;
  }
  .account-workspace .panel-title>div:first-child {
    min-width: 0;
  }
  .account-workspace input:not([type=checkbox]):not([type=radio]):not([type=hidden]), .account-workspace select,.account-workspace textarea {
    width: 100%;
    min-width: 0;
  }
  .account-workspace .field {
    min-width: 0;
  }
  .account-workspace .settings-form,.account-workspace .compact-form {
    align-items: start;
  }
  .account-workspace .security-method-option {
    display: grid !important;
    grid-template-columns: minmax(220px,320px) minmax(0,1fr);
    gap: 28px;
    align-items: start;
  }
  .account-workspace .security-method-form {
    display: grid !important;
    grid-template-columns: minmax(220px,1fr) minmax(220px,1fr);
    gap: 16px;
    align-items: end;
    width: 100%;
    min-width: 0;
    margin: 0;
  }
  .account-workspace .security-method-form button {
    grid-column: 1/-1;
    justify-self: start;
    min-width: 230px;
  }
  .account-workspace .security-option {
    align-items: center;
  }
  .account-workspace .team-form {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 18px 24px;
    align-items: start;
  }
  .account-workspace .team-form>.field {
    grid-column: auto !important;
  }
  .account-workspace .team-form>.form-actions {
    grid-column: 1/-1 !important;
    margin-top: 2px;
  }
  .account-workspace .check-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 14px 16px;
    border: 1px solid var(--account-border);
    border-radius: 12px;
    background: #fafbff;
  }
  .account-workspace .check-row input[type=checkbox] {
    appearance: auto !important;
    -webkit-appearance: checkbox !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    margin: 1px 0 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    accent-color: var(--account-brand);
  }
  .account-workspace .check-row span {
    font-weight: 700;
    color: #344054;
    line-height: 1.45;
  }
  .account-workspace #usage-alerts .notice {
    padding: 16px 18px;
    border: 1px solid #d9dcf2;
    border-radius: 12px;
    background: #f8f8ff;
  }
  .account-workspace #usage-alerts .notice p {
    margin: 5px 0 0;
  }
  .account-workspace .action-menu {
    position: relative;
    display: inline-block;
    overflow: visible;
  }
  .account-workspace .action-menu>summary {
    list-style: none;
    cursor: pointer;
  }
  .account-workspace .action-menu>summary::-webkit-details-marker {
    display: none;
  }
  .account-workspace .action-menu-popover {
    position: absolute !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    z-index: 900 !important;
    width: min(720px,calc(100vw - 48px)) !important;
    max-height: min(76vh,760px);
    overflow: auto;
    margin: 0 !important;
    padding: 18px !important;
    border: 1px solid var(--account-border) !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 24px 70px rgba(16,24,40,.22) !important;
  }
  .account-workspace .action-menu-popover .key-manage-form {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px 18px;
    padding: 0 0 18px;
    margin: 0 0 18px;
    border-bottom: 1px solid #eaecf0;
  }
  .account-workspace .action-menu-popover .key-manage-form:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
  }
  .account-workspace .action-menu-popover .restrictions-form .field:first-of-type, .account-workspace .action-menu-popover .restrictions-form .field:nth-of-type(2) {
    grid-column: span 1;
  }
  .account-workspace .action-menu-popover .key-manage-form button {
    justify-self: start;
    align-self: end;
  }
  .account-workspace .action-menu-popover .destructive-form {
    background: #fff8f7;
    border: 1px solid #fecdca !important;
    border-radius: 11px;
    padding: 14px !important;
  }
  .account-workspace .table-wrap {
    overflow-x: auto;
    overflow-y: visible;
  }
  .account-workspace table {
    table-layout: auto;
  }
  @media (max-width:1100px) {
    .account-workspace .topbar {
      align-items: flex-start;
    }
    .account-workspace .top-actions {
      width: 100%;
      justify-content: flex-start;
    }
    .account-workspace .security-method-option {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width:760px) {
    .account-workspace .top-actions>* {
      flex: 1 1 auto;
      justify-content: center;
    }
    .account-workspace .user-menu {
      flex: 1 1 100%;
    }
    .account-workspace .user-menu-trigger, .account-workspace .user-menu>summary {
      width: 100%;
      min-width: 0;
    }
    .account-workspace .user-menu-popover {
      left: 0;
      right: 0;
      width: auto;
    }
    .account-workspace .team-form,.account-workspace .security-method-form {
      grid-template-columns: 1fr !important;
    }
    .account-workspace .security-method-form button {
      grid-column: 1;
      width: 100%;
      min-width: 0;
    }
    .account-workspace .action-menu-popover {
      position: fixed !important;
      left: 12px !important;
      right: 12px !important;
      top: 80px !important;
      width: auto !important;
      max-height: calc(100vh - 100px);
    }
  }
  .account-workspace .account-security-method {
    display: grid !important;
    grid-template-columns: minmax(240px,360px) minmax(0,1fr) !important;
    gap: 32px !important;
    align-items: center !important;
    padding: 28px 32px !important;
  }
  .account-workspace .account-security-method>div:first-child {
    min-width: 0;
    max-width: 360px;
  }
  .account-workspace .account-security-form {
    display: grid !important;
    grid-template-columns: minmax(260px,1fr) minmax(260px,1fr) !important;
    gap: 18px 22px !important;
    align-items: end !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  .account-workspace .account-security-form>.field {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  .account-workspace .account-security-form>button {
    grid-column: 1/-1 !important;
    justify-self: start !important;
    width: auto !important;
    min-width: 250px !important;
    margin: 0 !important;
  }
  .account-workspace .security-option:not(.account-security-method) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
    padding: 24px 32px !important;
  }
  .account-workspace .security-option:not(.account-security-method)>div {
    min-width: 0;
  }
  .account-workspace .security-option:not(.account-security-method) form {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
  .account-workspace .account-team-form {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(280px,1fr)) !important;
    gap: 20px 24px !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    align-items: start !important;
    margin: 0 0 28px !important;
  }
  .account-workspace .account-team-form>.field {
    display: flex !important;
    flex-direction: column !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  .account-workspace .account-team-form>.field input, .account-workspace .account-team-form>.field select {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  .account-workspace .account-team-form>.form-actions {
    grid-column: 1/-1 !important;
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .account-workspace .account-team-form>.form-actions button {
    width: auto !important;
    min-width: 230px !important;
  }
  .account-workspace details.action-menu[open]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 1180;
    background: rgba(15,23,42,.46);
    backdrop-filter: blur(2px);
  }
  .account-workspace .action-menu-popover {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    top: 50% !important;
    transform: translate(-50%,-50%) !important;
    z-index: 1200 !important;
    width: min(760px,calc(100vw - 40px)) !important;
    max-height: calc(100vh - 56px) !important;
    overflow: auto !important;
    margin: 0 !important;
    padding: 24px !important;
    border-radius: 18px !important;
  }
  .account-workspace .action-menu-popover::before {
    content: "Manage credential";
    display: block;
    margin: 0 0 18px;
    font-size: 20px;
    font-weight: 850;
    color: #172033;
  }
  .account-workspace .action-menu-popover .key-manage-form {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .account-workspace .action-menu-popover .key-manage-form .field {
    width: 100% !important;
    max-width: none !important;
  }
  .account-workspace .action-menu-popover .key-manage-form button {
    width: auto !important;
    min-width: 150px !important;
  }
  .account-workspace .action-menu-popover select[multiple] {
    min-height: 180px;
  }
  .account-workspace .table-wrap {
    isolation: isolate;
  }
  .account-workspace #security .field, .account-workspace #team .field {
    flex: initial !important;
  }
  .account-workspace #security input, .account-workspace #security select, .account-workspace #team input, .account-workspace #team select {
    font-size: 16px !important;
    min-height: 48px !important;
  }
  @media (max-width:1000px) {
    .account-workspace .account-security-method {
      grid-template-columns: 1fr !important;
      align-items: start !important;
    }
    .account-workspace .account-security-form {
      grid-template-columns: 1fr !important;
    }
    .account-workspace .account-security-form>button {
      grid-column: 1 !important;
    }
  }
  @media (max-width:760px) {
    .account-workspace .account-team-form {
      grid-template-columns: 1fr !important;
    }
    .account-workspace .security-option:not(.account-security-method) {
      align-items: flex-start !important;
      flex-direction: column !important;
    }
    .account-workspace .security-option:not(.account-security-method) form, .account-workspace .security-option:not(.account-security-method) button {
      width: 100% !important;
    }
    .account-workspace .action-menu-popover {
      width: calc(100vw - 24px) !important;
      max-height: calc(100vh - 24px) !important;
      padding: 18px !important;
    }
  }
  .account-workspace .credential-dialog {
    width: min(820px,calc(100vw - 32px));
    max-width: 820px;
    max-height: min(880px,calc(100vh - 32px));
    margin: auto;
    padding: 0;
    border: 1px solid #d7deea;
    border-radius: 20px;
    background: #fff;
    color: #172033;
    box-shadow: 0 28px 80px rgba(15,23,42,.28);
    overflow: hidden;
  }
  .account-workspace .credential-dialog[open] {
    display: block;
  }
  .account-workspace .credential-dialog::backdrop {
    background: rgba(15,23,42,.58);
    backdrop-filter: blur(3px);
  }
  .account-workspace .credential-dialog-form {
    display: flex !important;
    flex-direction: column !important;
    max-height: inherit;
    margin: 0 !important;
  }
  .account-workspace .credential-dialog-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 24px 26px 18px;
    border-bottom: 1px solid #e5eaf2;
  }
  .account-workspace .credential-dialog-header h3 {
    margin: 0 0 5px;
    font-size: 24px;
    line-height: 1.2;
  }
  .account-workspace .credential-dialog-header p {
    margin: 0;
    color: #64748b;
    line-height: 1.55;
  }
  .account-workspace .credential-dialog .icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 0;
    border: 1px solid #d7deea;
    border-radius: 12px;
    background: #fff;
    color: #334155;
    font-size: 28px;
    line-height: 1;
    box-shadow: none;
  }
  .account-workspace .credential-dialog .icon-button:hover {
    background: #f1f5f9;
    color: #0f172a;
  }
  .account-workspace .credential-dialog-body {
    overflow: auto;
    padding: 22px 26px 8px;
  }
  .account-workspace .credential-dialog-section {
    padding: 0 0 22px;
    margin: 0 0 22px;
    border-bottom: 1px solid #e5eaf2;
  }
  .account-workspace .credential-dialog-section:last-child {
    margin-bottom: 0;
    border-bottom: 0;
  }
  .account-workspace .credential-dialog-section h4 {
    margin: 0 0 14px;
    font-size: 17px;
  }
  .account-workspace .credential-dialog-section .field {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 16px !important;
  }
  .account-workspace .credential-dialog-section .field:last-child {
    margin-bottom: 0 !important;
  }
  .account-workspace .credential-dialog select, .account-workspace .credential-dialog textarea, .account-workspace .credential-dialog input {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  .account-workspace .credential-dialog select[multiple] {
    min-height: 190px;
  }
  .account-workspace .credential-password-section {
    background: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px;
    padding: 16px 18px !important;
  }
  .account-workspace .credential-dialog-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    padding: 18px 26px 22px;
    border-top: 1px solid #e5eaf2;
    background: #fff;
  }
  .account-workspace .credential-dialog-actions button {
    width: auto !important;
    min-width: 130px !important;
    margin: 0 !important;
  }
  .account-workspace .credential-dialog-actions .danger {
    margin-left: auto !important;
  }
  .account-workspace details.action-menu[open]::before {
    display: none !important;
  }
  .account-workspace .action-menu-popover {
    position: absolute !important;
  }
  @media (max-width:700px) {
    .account-workspace .credential-dialog {
      width: calc(100vw - 18px);
      max-height: calc(100vh - 18px);
      border-radius: 16px;
    }
    .account-workspace .credential-dialog-header,.account-workspace .credential-dialog-body,.account-workspace .credential-dialog-actions {
      padding-left: 18px;
      padding-right: 18px;
    }
    .account-workspace .credential-dialog-actions {
      align-items: stretch;
    }
    .account-workspace .credential-dialog-actions button {
      width: 100% !important;
    }
    .account-workspace .credential-dialog-actions .danger {
      margin-left: 0 !important;
    }
  }
  .account-workspace .credential-dialog {
    width: min(1040px,calc(100vw - 40px));
    max-width: 1040px;
    max-height: min(820px,calc(100vh - 40px));
  }
  .account-workspace .credential-dialog-form {
    display: grid !important;
    grid-template-rows: auto minmax(0,1fr) auto !important;
    height: min(820px,calc(100vh - 40px));
    max-height: min(820px,calc(100vh - 40px));
  }
  .account-workspace .credential-dialog-header {
    align-items: center;
    padding: 22px 24px 18px;
  }
  .account-workspace .credential-dialog-title-wrap {
    min-width: 0;
  }
  .account-workspace .credential-dialog-title-wrap h3 {
    font-size: 25px;
  }
  .account-workspace .credential-dialog-identity {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 7px;
  }
  .account-workspace .credential-dialog-identity code {
    padding: 4px 8px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #4f46e5;
    font-size: 13px;
  }
  .account-workspace .credential-dialog-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 96px !important;
    height: 42px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #334155 !important;
    font: 700 14px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
    box-shadow: 0 1px 2px rgba(15,23,42,.05) !important;
    cursor: pointer;
  }
  .account-workspace .credential-dialog-close span[aria-hidden="true"] {
    font-size: 23px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-1px);
  }
  .account-workspace .credential-dialog-close:hover {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
  }
  .account-workspace .credential-dialog-close:focus-visible {
    outline: 3px solid rgba(79,70,229,.25) !important;
    outline-offset: 2px !important;
    border-color: #6366f1 !important;
  }
  .account-workspace .credential-dialog-body {
    display: grid !important;
    grid-template-columns: minmax(0,1.45fr) minmax(300px,.8fr) !important;
    align-items: start !important;
    gap: 26px !important;
    min-height: 0 !important;
    overflow: auto !important;
    padding: 22px 24px 24px !important;
  }
  .account-workspace .credential-dialog-side {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
  }
  .account-workspace .credential-dialog-section {
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }
  .account-workspace .credential-access-section {
    padding-right: 26px !important;
    border-right: 1px solid #e5eaf2 !important;
  }
  .account-workspace .credential-dialog-section h4 {
    margin: 0 0 14px !important;
    font-size: 18px !important;
  }
  .account-workspace .credential-dialog-section .field {
    margin: 0 0 16px !important;
  }
  .account-workspace .credential-dialog select[multiple] {
    min-height: 230px !important;
    max-height: 260px !important;
  }
  .account-workspace .credential-rotation-section, .account-workspace .credential-password-section, .account-workspace .credential-danger-note {
    padding: 18px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
  }
  .account-workspace .credential-password-section {
    background: #f7f7ff !important;
    border-color: #dfe1ff !important;
  }
  .account-workspace .credential-danger-note {
    background: #fff7f7 !important;
    border-color: #fecaca !important;
    color: #7f1d1d !important;
  }
  .account-workspace .credential-danger-note strong {
    display: block;
    margin-bottom: 5px;
    color: #991b1b;
  }
  .account-workspace .credential-danger-note p {
    margin: 0;
    color: #7f1d1d;
    line-height: 1.5;
  }
  .account-workspace .credential-dialog-actions {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    padding: 16px 24px 18px !important;
    border-top: 1px solid #e5eaf2 !important;
    background: #fff !important;
    box-shadow: 0 -8px 22px rgba(15,23,42,.04) !important;
  }
  .account-workspace .credential-dialog-actions button {
    min-width: 138px !important;
  }
  .account-workspace .credential-action-spacer {
    flex: 1 1 auto;
  }
  .account-workspace .credential-dialog-actions .danger {
    margin-left: 0 !important;
  }
  @media (max-width:900px) {
    .account-workspace .credential-dialog-body {
      grid-template-columns: 1fr !important;
    }
    .account-workspace .credential-access-section {
      padding-right: 0 !important;
      border-right: 0 !important;
      padding-bottom: 22px !important;
      border-bottom: 1px solid #e5eaf2 !important;
    }
    .account-workspace .credential-dialog-form {
      height: calc(100vh - 24px);
      max-height: calc(100vh - 24px);
    }
  }
  @media (max-width:700px) {
    .account-workspace .credential-dialog {
      width: calc(100vw - 12px);
      max-height: calc(100vh - 12px);
    }
    .account-workspace .credential-dialog-form {
      height: calc(100vh - 12px);
      max-height: calc(100vh - 12px);
    }
    .account-workspace .credential-dialog-header {
      align-items: flex-start;
      padding: 18px 16px 14px;
    }
    .account-workspace .credential-dialog-close {
      min-width: 42px !important;
      width: 42px !important;
      padding: 0 !important;
    }
    .account-workspace .credential-dialog-close span:last-child {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0,0,0,0);
      white-space: nowrap;
      border: 0;
    }
    .account-workspace .credential-dialog-body {
      padding: 18px 16px !important;
      gap: 18px !important;
    }
    .account-workspace .credential-dialog-actions {
      display: grid !important;
      grid-template-columns: 1fr 1fr !important;
      padding: 14px 16px 16px !important;
    }
    .account-workspace .credential-dialog-actions button {
      width: 100% !important;
      min-width: 0 !important;
    }
    .account-workspace .credential-action-spacer {
      display: none;
    }
    .account-workspace .credential-dialog-actions .danger {
      grid-column: 1/-1;
    }
  }
  .account-workspace .top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: nowrap;
    overflow: visible;
  }
  .account-workspace .top-actions :is(.environment-pill,.top-action-link,.user-menu-trigger) {
    height: 52px !important;
    min-height: 52px !important;
    border: 1px solid #d7deea !important;
    border-radius: 15px !important;
    background: #fff !important;
    box-shadow: 0 3px 10px rgba(16,24,40,.06) !important;
    color: #344054 !important;
  }
  .account-workspace .environment-pill {
    padding: 0 17px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    white-space: nowrap;
  }
  .account-workspace .top-action-link {
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    white-space: nowrap;
  }
  .account-workspace .user-menu {
    min-width: 270px !important;
    z-index: 1500 !important;
  }
  .account-workspace .user-menu-trigger, .account-workspace .user-menu>summary {
    display: grid !important;
    grid-template-columns: 40px minmax(0,1fr) 20px !important;
    align-items: center !important;
    gap: 11px !important;
    padding: 5px 13px 5px 6px !important;
    width: 100% !important;
    min-width: 270px !important;
  }
  .account-workspace .user-menu .avatar {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
    border-radius: 11px !important;
  }
  .account-workspace .user-menu .user-meta {
    max-width: none !important;
    min-width: 0 !important;
  }
  .account-workspace .user-menu .user-meta b {
    font-size: 13px !important;
  }
  .account-workspace .user-menu .user-meta small {
    font-size: 11px !important;
  }
  .account-workspace .user-menu .user-chevron {
    display: grid !important;
    place-items: center !important;
    width: 20px !important;
    height: 20px !important;
    justify-self: end !important;
    margin: 0 !important;
  }
  .account-workspace .user-menu .user-chevron svg {
    display: block !important;
    width: 17px !important;
    height: 17px !important;
    transform-origin: center !important;
  }
  .account-workspace .user-menu-popover {
    z-index: 5000 !important;
  }
  .account-workspace .side-group summary {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 18px !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .account-workspace .side-group summary:after {
    display: grid !important;
    place-items: center !important;
    width: 18px !important;
    height: 18px !important;
    justify-self: end !important;
    line-height: 1 !important;
    transform-origin: center !important;
  }
  .account-workspace .side-group[open] summary:after {
    transform: rotate(180deg) !important;
  }
  @media (max-width:760px) {
    .account-workspace .top-actions {
      width: 100%;
      justify-content: flex-start;
      flex-wrap: wrap;
    }
    .account-workspace .top-actions>* {
      flex: 1 1 auto;
    }
    .account-workspace .user-menu {
      flex: 1 1 100%;
      min-width: 0 !important;
    }
    .account-workspace .user-menu-trigger, .account-workspace .user-menu>summary {
      min-width: 0 !important;
    }
  }
  .secret-keys-panel .panel-title {
    align-items: flex-start;
  }
  .credential-type-comparison {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
    margin: 18px 0 22px;
  }
  .credential-type-comparison>div {
    display: grid;
    gap: 5px;
    padding: 16px 18px;
    border: 1px solid var(--border,#dbe2ee);
    border-radius: 16px;
    background: #f8fafc;
  }
  .credential-type-comparison strong {
    color: #172033;
  }
  .credential-type-comparison span {
    color: #64748b;
    line-height: 1.55;
  }
  .create-key-dialog {
    width: min(1080px,calc(100vw - 32px));
    max-height: min(900px,calc(100vh - 32px));
  }
  .create-key-body {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(260px,.55fr);
    gap: 22px;
    align-items: start;
  }
  .create-key-body .service-checkbox-fieldset,.create-key-body .field-full {
    grid-column: 1/-1;
  }
  .readonly-summary {
    display: grid;
    gap: 5px;
    padding: 15px 17px;
    border: 1px solid #dbe2ee;
    border-radius: 14px;
    background: #f8fafc;
    min-height: 100%;
  }
  .readonly-summary span,.readonly-summary small {
    color: #64748b;
  }
  .readonly-summary strong {
    font-size: 1rem;
    color: #172033;
  }
  .service-checkbox-fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }
  .service-checkbox-fieldset legend {
    padding: 0;
    font-weight: 800;
    color: #334155;
  }
  .service-checkbox-fieldset>p {
    margin: 6px 0 12px;
    color: #64748b;
    font-size: .9rem;
  }
  .service-checkbox-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;
    max-height: 330px;
    overflow: auto;
    padding: 3px;
  }
  .service-checkbox-option {
    display: grid !important;
    grid-template-columns: 20px minmax(0,1fr);
    align-items: start !important;
    gap: 10px;
    min-height: 64px;
    padding: 12px 13px;
    border: 1px solid #dbe2ee;
    border-radius: 13px;
    background: #fff;
    cursor: pointer;
  }
  .service-checkbox-option:hover {
    border-color: #a5b4fc;
    background: #f8f7ff;
  }
  .service-checkbox-option:has(input:checked) {
    border-color: #7868f8;
    background: #f4f2ff;
    box-shadow: 0 0 0 1px #7868f8 inset;
  }
  .service-checkbox-option input[type=checkbox] {
    width: 18px !important;
    height: 18px !important;
    margin: 2px 0 0 !important;
    align-self: start !important;
    accent-color: #6254e8;
  }
  .service-checkbox-option span {
    display: grid;
    gap: 3px;
    min-width: 0;
  }
  .service-checkbox-option strong {
    font-size: .91rem;
    line-height: 1.35;
    color: #27334a;
  }
  .service-checkbox-option small {
    font-size: .76rem;
    color: #718096;
  }
  .service-checkbox-fieldset.compact .service-checkbox-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    max-height: 350px;
  }
  .empty-key-state {
    padding: 36px !important;
    text-align: center !important;
  }
  .empty-key-state strong,.empty-key-state span {
    display: block;
  }
  .empty-key-state strong {
    font-size: 1.05rem;
    color: #172033;
  }
  .empty-key-state span {
    margin: 5px 0 16px;
    color: #64748b;
  }
  .empty-key-state .btn {
    display: inline-flex;
  }
  .public-keys-table {
    table-layout: auto;
    min-width: 1050px;
  }
  .public-keys-table th:last-child,.public-keys-table td:last-child {
    width: 120px;
    text-align: right;
  }
  .public-keys-table .map-name-cell {
    min-width: 190px;
  }
  .map-name-cell strong,.map-name-cell small {
    display: block;
  }
  .map-name-cell strong {
    overflow-wrap: normal;
    word-break: normal;
  }
  .map-name-cell small {
    margin-top: 4px;
    color: #718096;
  }
  .public-keys-table .copybox-table {
    min-width: 250px;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
  }
  .public-keys-table .copybox-table code {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .public-keys-table .badge {
    white-space: nowrap;
    margin: 2px;
  }
  .map-key-action {
    display: inline-block;
  }
  .map-key-action>summary {
    min-width: 92px;
    justify-content: center;
  }
  .account-workspace .side-group summary {
    display: grid;
    grid-template-columns: minmax(0,1fr) 18px;
    align-items: center;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .13em;
    color: #65738a;
  }
  .account-workspace .side-group summary::after {
    width: 18px;
    text-align: center;
    justify-self: end;
    transform-origin: center;
  }
  .account-workspace .side-group[open] summary::after {
    transform: rotate(180deg);
  }
  .account-workspace .side-link {
    font-size: .94rem;
    font-weight: 700;
    color: #46546b;
  }
  .account-workspace .side-link:hover {
    color: #172033;
    background: #eef2ff;
  }
  .account-workspace .side-link.active {
    color: #fff;
    background: #3d3478;
  }
  .user-menu {
    position: relative;
    z-index: 80;
  }
  .user-menu-popover {
    z-index: 5000 !important;
    right: 0;
    top: calc(100% + 10px);
    min-width: 220px;
  }
  .user-chevron {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    margin-left: auto;
  }
  .user-chevron svg {
    width: 18px;
    height: 18px;
  }
  .user-menu.is-open .user-chevron {
    transform: rotate(90deg);
  }
  @media (max-width:900px) {
    .credential-type-comparison,.create-key-body {
      grid-template-columns: 1fr;
    }
    .service-checkbox-grid,.service-checkbox-fieldset.compact .service-checkbox-grid {
      grid-template-columns: 1fr;
    }
    .create-key-body .service-checkbox-fieldset,.create-key-body .field-full {
      grid-column: auto;
    }
    .public-keys-table {
      min-width: 900px;
    }
  }
  .session-expiry-backdrop {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(10,15,30,.62);
    backdrop-filter: blur(4px);
  }
  .session-expiry-backdrop[hidden] {
    display: none;
  }
  .session-expiry-dialog {
    width: min(460px,100%);
    padding: 30px;
    border: 1px solid #dfe4ee;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(15,23,42,.28);
    text-align: center;
    color: #172033;
  }
  .session-expiry-dialog h2 {
    margin: 10px 0 8px;
    font-size: 1.35rem;
  }
  .session-expiry-dialog p {
    margin: 0;
    color: #5a6475;
    line-height: 1.6;
  }
  .session-expiry-icon {
    font-size: 2rem;
  }
  .session-expiry-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 24px;
  }
  .session-expiry-actions button,.session-expiry-actions a {
    min-width: 130px;
    justify-content: center;
  }
  @media (max-width:520px) {
    .session-expiry-dialog {
      padding: 24px 18px;
    }
    .session-expiry-actions {
      flex-direction: column;
    }
    .session-expiry-actions>* {
      width: 100%;
    }
  }
  .account-workspace .user-menu>summary {
    list-style: none;
  }
  .account-workspace .user-menu>summary::-webkit-details-marker {
    display: none;
  }
  .account-workspace .side-nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    width: 100% !important;
    padding: 0 !important;
  }
  .account-workspace .side-group {
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #d9dfeb !important;
    border-radius: 14px !important;
    background: #f8f9fc !important;
    box-shadow: 0 1px 2px rgba(16,24,40,.03) !important;
  }
  .account-workspace .side-group>summary {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 20px !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    border: 0 !important;
    border-bottom: 1px solid transparent !important;
    background: transparent !important;
    color: #65738a !important;
    font-size: .76rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: .13em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    list-style: none !important;
  }
  .account-workspace .side-group>summary::-webkit-details-marker {
    display: none !important;
  }
  .account-workspace .side-group[open]>summary {
    border-bottom-color: #dde3ed !important;
  }
  .account-workspace .side-group>summary::after {
    content: "⌄" !important;
    display: grid !important;
    place-items: center !important;
    justify-self: end !important;
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #98a2b3 !important;
    font-size: 15px !important;
    line-height: 1 !important;
    transform: rotate(0deg) !important;
    transform-origin: 50% 50% !important;
    transition: transform .22s cubic-bezier(.2,.7,.2,1),color .18s ease !important;
  }
  .account-workspace .side-group[open]>summary::after {
    transform: rotate(180deg) !important;
  }
  .account-workspace .side-group>summary:hover::after {
    color: #667085 !important;
  }
  .account-workspace .side-group-links {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 8px 12px !important;
  }
  .account-workspace .side-link {
    box-sizing: border-box !important;
    width: calc(100% - 4px) !important;
    min-height: 48px !important;
    margin: 0 2px !important;
    padding: 8px 12px !important;
    border-radius: 11px !important;
    gap: 12px !important;
    transition: background-color .18s ease,color .18s ease,box-shadow .18s ease !important;
  }
  .account-workspace .side-link:hover, .account-workspace .side-link:focus-visible {
    transform: none !important;
    background: #eeefff !important;
  }
  .account-workspace .side-link.active {
    background: #40377f !important;
    box-shadow: inset 3px 0 0 #8c82ff !important;
  }
  .account-workspace .side-icon {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    border-radius: 9px !important;
    background: #e9edf5 !important;
    color: #667085 !important;
    transition: color .18s ease !important;
  }
  .account-workspace .side-link.active .side-icon {
    background: transparent !important;
    color: #fff !important;
  }
  .account-workspace .side-link:hover .side-icon, .account-workspace .side-link:focus-visible .side-icon {
    background: transparent !important;
    color: #4136cf !important;
  }
  .account-workspace .side-icon svg {
    width: 20px !important;
    height: 20px !important;
  }
  .account-workspace .side-group.is-animating {
    will-change: height;
  }
  @media (prefers-reduced-motion:reduce) {
    .account-workspace .side-group>summary::after, .account-workspace .side-link {
      transition: none !important;
    }
  }
  .account-workspace .side-group>summary {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: 0 54px 0 20px !important;
  }
  .account-workspace .side-group>summary::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    right: 20px !important;
    width: 9px !important;
    height: 9px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-right: 2px solid #98a2b3 !important;
    border-bottom: 2px solid #98a2b3 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transform-origin: 50% 50% !important;
    transition: transform .2s cubic-bezier(.2,.7,.2,1),border-color .18s ease !important;
  }
  .account-workspace .side-group[open]>summary::after {
    transform: translateY(-35%) rotate(225deg) !important;
  }
  .account-workspace .side-group>summary:hover::after {
    border-color: #667085 !important;
  }
  .account-workspace .side-group-links {
    padding: 12px 10px 14px !important;
  }
  .account-workspace .side-link {
    width: 100% !important;
    margin: 0 !important;
  }
  .account-workspace .topbar, .account-workspace .top-actions {
    overflow: visible !important;
  }
  .account-workspace .user-menu {
    position: relative !important;
    z-index: 10000 !important;
    overflow: visible !important;
  }
  .account-workspace .user-menu-trigger {
    display: grid !important;
    grid-template-columns: 40px minmax(0,1fr) 20px !important;
    align-items: center !important;
    gap: 11px !important;
    width: 100% !important;
    min-width: 270px !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 5px 13px 5px 6px !important;
    border: 1px solid #d7deea !important;
    border-radius: 15px !important;
    background: #fff !important;
    color: #344054 !important;
    box-shadow: 0 3px 10px rgba(16,24,40,.06) !important;
    cursor: pointer !important;
  }
  .account-workspace .user-menu.is-open .user-menu-trigger {
    border-color: #9d97ff !important;
    box-shadow: 0 0 0 3px rgba(99,91,255,.14) !important;
  }
  .account-workspace .user-menu .user-chevron {
    display: grid !important;
    place-items: center !important;
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
    justify-self: end !important;
    transition: transform .18s ease !important;
  }
  .account-workspace .user-menu.is-open .user-chevron {
    transform: rotate(90deg) !important;
  }
  .account-workspace .user-menu.is-open .user-chevron svg {
    transform: none !important;
  }
  .account-workspace .user-menu-popover {
    position: absolute !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    z-index: 10001 !important;
    display: grid !important;
    min-width: 270px !important;
    width: max-content !important;
    max-width: min(340px,calc(100vw - 32px)) !important;
  }
  .account-workspace .user-menu-popover[hidden] {
    display: none !important;
  }
  @media (max-width:760px) {
    .account-workspace .user-menu-trigger {
      min-width: 0 !important;
    }
    .account-workspace .user-menu-popover {
      left: 0 !important;
      right: 0 !important;
      width: auto !important;
      min-width: 0 !important;
    }
  }
  .account-workspace.account-app {
    min-height: 100vh;
  }
  .account-workspace .user-menu.is-open>.user-menu-popover {
    display: grid !important;
  }
  .account-workspace .user-menu:not(.is-open)>.user-menu-popover[hidden] {
    display: none !important;
  }
  .portal-content {
    padding: 24px 32px 48px;
  }
  .portal-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 20px;
  }
  .portal-card {
    background: #fff;
    border: 1px solid #dfe5ef;
    border-radius: 22px;
    padding: 24px;
    box-shadow: 0 10px 30px rgba(29,40,70,.05);
  }
  .portal-card.full {
    grid-column: 1/-1;
  }
  .portal-card h2 {
    margin: 0 0 8px;
  }
  .portal-card p.lead {
    color: #6c7890;
    margin: 0 0 22px;
  }
  .portal-form {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 16px;
  }
  .portal-form .full {
    grid-column: 1/-1;
  }
  .portal-form label {
    display: grid;
    gap: 7px;
    font-weight: 700;
    color: #344158;
  }
  .portal-form input,.portal-form select,.portal-form textarea {
    width: 100%;
    border: 1px solid #cfd7e5;
    border-radius: 12px;
    padding: 12px 14px;
    font: inherit;
    background: #fff;
  }
  .portal-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 20px;
  }
  .portal-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 12px;
    padding: 12px 18px;
    background: #5b4be8;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
  }
  .portal-button.secondary {
    background: #eef1f7;
    color: #39465d;
  }
  .metric-row {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
  }
  .metric {
    padding: 18px;
    border: 1px solid #e1e6ef;
    border-radius: 16px;
    background: #f8f9fc;
  }
  .metric strong {
    display: block;
    font-size: 1.65rem;
    color: #182238;
  }
  .metric span {
    color: #6f7b91;
  }
  .finance-table {
    width: 100%;
    border-collapse: collapse;
  }
  .finance-table th,.finance-table td {
    padding: 14px 12px;
    border-bottom: 1px solid #e7eaf1;
    text-align: left;
  }
  .finance-table th {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #66738a;
  }
  .status-pill {
    display: inline-flex;
    border-radius: 999px;
    padding: 5px 10px;
    background: #eef2f7;
    font-weight: 700;
  }
  .status-pill.paid {
    background: #e7f8ef;
    color: #137744;
  }
  .empty-state {
    text-align: center;
    padding: 44px 20px;
    color: #6f7b91;
  }
  .pack-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(300px,420px));
    gap: 16px;
  }
  .pack {
    border: 1px solid #dfe5ef;
    border-radius: 18px;
    padding: 20px;
    background: #fafbfe;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 220px;
  }
  .pack form {
    margin-top: auto;
  }
  .checkout-button {
    min-width: 170px;
  }
  .pack h3 {
    margin: 0 0 8px;
  }
  .pack-price {
    font-size: 1.8rem;
    font-weight: 850;
    margin: 12px 0;
  }
  .notice {
    border-radius: 14px;
    padding: 14px 16px;
    background: #fff8dd;
    color: #705b0a;
    margin-bottom: 18px;
  }
  @media (max-width:900px) {
    .portal-content {
      padding: 18px;
    }
    .portal-grid,.portal-form,.metric-row,.pack-grid {
      grid-template-columns: 1fr;
    }
    .portal-card.full,.portal-form .full {
      grid-column: auto;
    }
    .finance-table {
      display: block;
      overflow-x: auto;
    }
  }
  .account-workspace .side-group>summary::after {
    top: 50% !important;
    transform: translateY(-50%) rotate(45deg) !important;
  }
  .account-workspace .side-group[open]>summary::after {
    transform: translateY(-50%) rotate(225deg) !important;
  }
  .account-workspace .side-link.active .side-icon {
    background: transparent !important;
    box-shadow: none !important;
  }
  .account-workspace .portal-content {
    width: 100%;
    min-width: 0;
  }
  .account-workspace .portal-card {
    min-width: 0;
  }
  .account-workspace .finance-table {
    width: 100%;
  }
  @media (max-width:760px) {
    .account-workspace .finance-table {
      min-width: 720px;
    }
    .account-workspace .portal-card {
      overflow-x: auto;
    }
  }
  .account-workspace .topbar, .account-workspace .top-actions {
    overflow: visible !important;
  }
  .account-workspace .topbar {
    position: relative;
    z-index: 120;
  }
  .account-workspace .portal-content {
    position: relative;
    z-index: 1;
  }
  .account-workspace .user-menu {
    position: relative !important;
    z-index: 5000 !important;
  }
  .account-workspace .user-menu-popover {
    z-index: 6000 !important;
  }
  .account-workspace .portal-profile-grid {
    grid-template-columns: minmax(0,1.08fr) minmax(340px,.92fr);
    align-items: stretch;
    gap: 24px;
  }
  .account-workspace .portal-profile-grid>.portal-card {
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  .account-workspace .portal-profile-grid .portal-form {
    flex: 1;
  }
  .account-workspace .portal-profile-form {
    grid-template-columns: repeat(2,minmax(0,1fr));
    align-content: start;
    gap: 18px 20px;
  }
  .account-workspace .portal-profile-form>label {
    min-width: 0;
  }
  .account-workspace .portal-profile-form>label:nth-of-type(3) {
    grid-column: 1;
  }
  .account-workspace .portal-profile-form>.portal-actions {
    grid-column: 1/-1;
    margin-top: auto;
    padding-top: 14px;
  }
  .account-workspace .portal-password-form>.portal-actions {
    margin-top: auto;
    padding-top: 14px;
  }
  .account-workspace .portal-form-single {
    grid-template-columns: 1fr;
    max-width: none;
  }
  .account-workspace .portal-grid-security {
    align-items: stretch;
  }
  .account-workspace .portal-grid-security>.portal-card {
    display: flex;
    flex-direction: column;
  }
  .account-workspace .portal-grid-security form {
    flex: 1;
  }
  .account-workspace .portal-security-setup {
    display: grid;
    grid-template-columns: 180px minmax(0,1fr);
    gap: 24px;
    align-items: start;
  }
  .account-workspace .portal-qr-card {
    padding: 14px;
    border: 1px solid var(--account-border);
    border-radius: 16px;
    background: #fff;
  }
  .account-workspace .portal-qr-card img {
    display: block;
    width: 100%;
    height: auto;
  }
  .account-workspace .portal-divider {
    height: 1px;
    background: var(--account-border);
    margin: 24px 0;
  }
  .account-workspace .portal-stack {
    display: grid;
    gap: 24px;
  }
  .account-workspace .portal-card-compact {
    padding-bottom: 26px;
  }
  .account-workspace .portal-team-form {
    grid-template-columns: repeat(4,minmax(0,1fr));
    align-items: start;
  }
  .account-workspace .portal-team-form>.portal-actions {
    grid-column: 1/-1;
  }
  .account-workspace .portal-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
  }
  .account-workspace .portal-count {
    display: grid;
    place-items: center;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border-radius: 999px;
    background: #f0efff;
    color: #493fc6;
    font-weight: 800;
  }
  .account-workspace .portal-table-wrap {
    overflow: auto;
    border: 1px solid var(--account-border);
    border-radius: 14px;
  }
  .account-workspace .portal-table {
    width: 100%;
    min-width: 820px;
    border-collapse: collapse;
  }
  .account-workspace .portal-table th,.account-workspace .portal-table td {
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid var(--account-border);
    vertical-align: middle;
  }
  .account-workspace .portal-table th {
    background: #f8f9fc;
    color: #667085;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
  }
  .account-workspace .portal-table tbody tr:last-child td {
    border-bottom: 0;
  }
  .account-workspace .portal-badge {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    background: #f0efff;
    color: #493fc6;
    font-size: 12px;
    font-weight: 750;
    text-transform: capitalize;
  }
  .account-workspace .portal-inline-form {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
  }
  .account-workspace .portal-inline-password {
    width: 160px !important;
    min-height: 38px !important;
    padding: 8px 10px !important;
  }
  .account-workspace .portal-button.compact {
    min-height: 38px;
    padding: 8px 12px;
  }
  .account-workspace .portal-button.danger {
    background: #b42318;
    box-shadow: none;
  }
  .account-workspace .portal-button.danger:hover {
    background: #912018;
  }
  @media (max-width:1100px) {
    .account-workspace .portal-profile-grid {
      grid-template-columns: 1fr;
    }
    .account-workspace .portal-team-form {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (max-width:700px) {
    .account-workspace .portal-profile-form,.account-workspace .portal-team-form {
      grid-template-columns: 1fr;
    }
    .account-workspace .portal-profile-form>label:nth-of-type(3),.account-workspace .portal-team-form>.portal-actions {
      grid-column: auto;
    }
    .account-workspace .portal-security-setup {
      grid-template-columns: 1fr;
    }
  }
  .account-workspace .profile-page-stack {
    gap: 24px;
  }
  .account-workspace .portal-profile-grid {
    grid-template-columns: minmax(0,1.15fr) minmax(360px,.85fr);
    align-items: stretch;
  }
  .account-workspace .portal-profile-card,.account-workspace .portal-password-card {
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  .account-workspace .portal-profile-card form,.account-workspace .portal-password-card form {
    flex: 1;
  }
  .account-workspace .portal-profile-form {
    grid-template-columns: repeat(2,minmax(0,1fr));
    align-content: start;
  }
  .account-workspace .portal-password-form {
    grid-template-columns: 1fr;
    align-content: start;
  }
  .account-workspace .portal-password-form .portal-actions {
    margin-top: auto;
  }
  .account-workspace .compact-password-confirm {
    max-width: none;
  }
  .account-workspace .password-guidance {
    display: grid;
    gap: 4px;
    padding: 14px 16px;
    border: 1px solid #e1e5ee;
    border-radius: 12px;
    background: #f8f9fc;
    color: #667085;
    font-size: 13px;
  }
  .account-workspace .password-guidance strong {
    color: #344054;
  }
  .account-workspace .business-profile-card {
    padding: 26px 28px;
  }
  .account-workspace .business-details-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 16px 18px;
  }
  .account-workspace .business-details-grid .span-2 {
    grid-column: span 2;
  }
  .account-workspace .business-details-grid .full {
    grid-column: 1/-1;
  }
  .account-workspace .team-editor-card {
    padding: 26px 28px;
  }
  .account-workspace .team-editor-grid {
    grid-template-columns: minmax(180px,.8fr) minmax(280px,1.5fr) minmax(180px,.8fr);
    gap: 16px 18px;
    align-items: end;
  }
  .account-workspace .team-editor-grid .span-2 {
    grid-column: span 2;
  }
  .account-workspace .team-editor-actions {
    grid-column: 3;
    align-self: end;
    margin: 0;
    justify-content: flex-end;
  }
  .account-workspace .portal-table-card {
    padding: 26px 28px;
  }
  .account-workspace .portal-table-wrap {
    margin-top: 18px;
    border: 1px solid #dce2ec;
    border-radius: 14px;
    overflow: auto;
  }
  .account-workspace .portal-table {
    min-width: 760px;
  }
  .account-workspace .portal-table th {
    background: #f7f8fb;
    padding: 13px 16px;
    color: #667085;
    font-size: 11px;
    letter-spacing: .07em;
  }
  .account-workspace .portal-table td {
    padding: 15px 16px;
  }
  .account-workspace .list-pagination {
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid #dce2ec;
    border-radius: 14px;
    background: #f8f9fc;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px 20px;
    align-items: center;
  }
  .account-workspace .pagination-meta {
    font-size: 12px;
    color: #667085;
  }
  .account-workspace .pagination-size {
    justify-self: start;
  }
  .account-workspace .pagination-size label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #667085;
    font-weight: 700;
  }
  .account-workspace .pagination-size select {
    min-height: 38px;
    height: 38px;
    width: auto;
    min-width: 76px;
    padding: 6px 30px 6px 10px;
  }
  .account-workspace .pagination-full {
    grid-column: 1/-1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }
  .account-workspace .pagination-summary {
    font-size: 12px;
    color: #667085;
    font-weight: 700;
  }
  .account-workspace .pagination-controls {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
  }
  .account-workspace .pagination-controls a,.account-workspace .pagination-controls span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border: 1px solid #d7deea;
    border-radius: 9px;
    background: #fff;
    color: #475467;
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
  }
  .account-workspace .pagination-controls a:hover {
    border-color: #aaa3ff;
    background: #f3f1ff;
    color: #4438ca;
  }
  .account-workspace .pagination-controls .active {
    border-color: #5f52ed;
    background: #5f52ed;
    color: #fff;
  }
  .account-workspace .pagination-controls .disabled {
    opacity: .45;
    cursor: not-allowed;
  }
  .account-workspace .pagination-controls .pagination-ellipsis {
    border-color: transparent;
    background: transparent;
    min-width: 24px;
    padding: 0;
  }
  .account-workspace .topbar,.account-workspace .top-actions {
    overflow: visible !important;
  }
  .account-workspace .user-menu {
    isolation: isolate;
  }
  .account-workspace .user-menu.is-open {
    z-index: 9999 !important;
  }
  .account-workspace .user-menu.is-open>.user-menu-popover {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  @media (max-width:1180px) {
    .account-workspace .portal-profile-grid {
      grid-template-columns: 1fr;
    }
    .account-workspace .business-details-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .account-workspace .team-editor-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .account-workspace .team-editor-actions {
      grid-column: 1/-1;
    }
  }
  @media (max-width:720px) {
    .account-workspace .portal-profile-form,.account-workspace .business-details-grid,.account-workspace .team-editor-grid {
      grid-template-columns: 1fr;
    }
    .account-workspace .business-details-grid .span-2,.account-workspace .team-editor-grid .span-2,.account-workspace .team-editor-actions {
      grid-column: 1;
    }
    .account-workspace .business-profile-card,.account-workspace .team-editor-card,.account-workspace .portal-table-card {
      padding: 20px;
    }
    .account-workspace .list-pagination {
      grid-template-columns: 1fr;
    }
    .account-workspace .pagination-full {
      grid-column: 1;
      align-items: flex-start;
      flex-direction: column;
    }
  }
  .account-workspace .portal-profile-single {
    grid-template-columns: 1fr !important;
  }
  .account-workspace .portal-profile-single>.portal-card {
    height: auto;
  }
  .account-workspace .business-details-grid>label {
    min-width: 0;
  }
  .account-workspace .business-details-grid input, .account-workspace .business-details-grid select {
    min-width: 0;
  }
  .account-workspace .security-page-stack {
    gap: 24px;
  }
  .account-workspace .security-overview-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 24px;
    align-items: stretch;
  }
  .account-workspace .security-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 28px;
  }
  .account-workspace .security-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
  }
  .account-workspace .security-card-heading h2 {
    margin: 0 0 8px;
  }
  .account-workspace .security-card-heading .lead {
    margin: 0;
  }
  .account-workspace .security-form-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 18px;
    align-items: end;
    flex: 1;
  }
  .account-workspace .security-form-grid .full {
    grid-column: 1/-1;
  }
  .account-workspace .security-form-grid .portal-actions {
    margin-top: 4px;
    align-self: end;
  }
  .account-workspace .security-authenticator-card .security-form-grid {
    grid-template-columns: 1fr;
  }
  .account-workspace .password-change-card {
    min-height: 0;
  }
  .account-workspace .password-change-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 18px 20px;
    align-items: end;
  }
  .account-workspace .password-change-grid .full {
    grid-column: 1/-1;
  }
  .account-workspace .security-lock-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 13px;
    background: #f0efff;
    color: #5146d9;
  }
  .account-workspace .security-lock-icon svg {
    width: 22px;
    height: 22px;
  }
  .account-workspace .portal-badge.success {
    background: #e8f8ef;
    color: #147a45;
  }
  .account-workspace .user-menu[open]>.user-menu-popover, .account-workspace .user-menu.is-open>.user-menu-popover {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .account-workspace .user-menu:not([open]):not(.is-open)>.user-menu-popover {
    display: none !important;
  }
  @media (max-width:1180px) {
    .account-workspace .business-details-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
    .account-workspace .security-overview-grid {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width:720px) {
    .account-workspace .business-details-grid, .account-workspace .security-form-grid, .account-workspace .password-change-grid {
      grid-template-columns: 1fr !important;
    }
    .account-workspace .business-details-grid .span-2, .account-workspace .security-form-grid .full, .account-workspace .password-change-grid .full {
      grid-column: 1 !important;
    }
    .account-workspace .security-card {
      padding: 20px;
    }
    .account-workspace .security-card-heading {
      align-items: flex-start;
    }
  }
  .account-workspace .user-menu-trigger, .app-body .user-menu-trigger {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
  }
  .account-workspace .user-menu .user-meta, .app-body .user-menu .user-meta {
    display: block;
    max-width: 190px;
    min-width: 0;
  }
  .account-workspace .user-menu .user-meta b, .app-body .user-menu .user-meta b {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .account-workspace .user-menu .user-meta small, .app-body .user-menu .user-meta small {
    display: none !important;
  }
  .account-workspace .user-menu-popover, .app-body .user-menu-popover {
    z-index: 5000;
  }
  .support-layout {
    display: grid;
    grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
    gap: 24px;
    align-items: start;
  }
  .support-card {
    min-width: 0;
  }
  .support-form {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 18px;
  }
  .support-form .field-full,.support-form .form-actions,.support-form .turnstile-wrap {
    grid-column: 1/-1;
  }
  .support-form textarea {
    min-height: 150px;
    resize: vertical;
  }
  .support-form input[type=file] {
    padding: 12px;
    background: #fff;
  }
  .support-ticket-list table {
    min-width: 640px;
  }
  .support-thread {
    margin-top: 24px;
  }
  .support-message {
    padding: 18px;
    border: 1px solid var(--account-border,#d8dfec);
    border-radius: 14px;
    background: #fafbff;
    margin-top: 14px;
  }
  .support-message-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 8px;
  }
  .support-empty {
    padding: 34px 18px;
    text-align: center;
    color: #667085;
  }
  @media (max-width:1000px) {
    .support-layout {
      grid-template-columns: 1fr;
    }
    .support-form {
      grid-template-columns: 1fr;
    }
    .support-form>* {
      grid-column: 1 !important;
    }
  }
  .app-body .app-sidebar {
    width: 262px !important;
    flex: 0 0 262px !important;
    padding: 20px 14px 18px !important;
    background: #111526 !important;
    box-shadow: 12px 0 38px rgba(16,24,40,.12) !important;
  }
  .app-body .app-logo {
    min-height: 72px !important;
    padding: 0 14px 18px !important;
    gap: 12px !important;
  }
  .app-body .logo-mark {
    width: 40px !important;
    height: 40px !important;
    border-radius: 12px !important;
  }
  .app-body .logo-copy b {
    font-size: 19px !important;
  }
  .app-body .logo-copy small {
    margin-top: 4px !important;
    font-size: 9px !important;
    letter-spacing: .14em !important;
  }
  .app-body .side-nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    min-width: 0 !important;
  }
  .app-body .side-group {
    width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid #d7deea !important;
    border-radius: 16px !important;
    background: #f8f9fc !important;
    box-shadow: 0 8px 24px rgba(16,24,40,.06) !important;
  }
  .app-body .side-group>summary {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 20px !important;
    align-items: center !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    min-height: 62px !important;
    height: 62px !important;
    padding: 0 18px !important;
    color: #65738a !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: .14em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    list-style: none !important;
  }
  .app-body .side-group>summary::after {
    content: "" !important;
    display: block !important;
    width: 8px !important;
    height: 8px !important;
    justify-self: center !important;
    border-right: 2px solid #98a2b3 !important;
    border-bottom: 2px solid #98a2b3 !important;
    transform: rotate(45deg) !important;
    transform-origin: center !important;
    transition: transform .2s ease !important;
    margin: -4px 0 0 !important;
  }
  .app-body .side-group[open]>summary::after {
    transform: rotate(225deg) !important;
    margin: 4px 0 0 !important;
  }
  .app-body .side-group>summary:hover {
    color: #344054 !important;
    background: #fbfcfe !important;
  }
  .app-body .side-group-links {
    display: grid !important;
    gap: 6px !important;
    padding: 14px !important;
    border-top: 1px solid #dfe4ec !important;
  }
  .app-body .side-link {
    width: 100% !important;
    min-height: 48px !important;
    padding: 8px 11px !important;
    gap: 11px !important;
    border-radius: 12px !important;
    color: #4d5a70 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    box-shadow: none !important;
  }
  .app-body .side-link:hover {
    background: #eef1f8 !important;
    color: #172033 !important;
    transform: none !important;
  }
  .app-body .side-link.active {
    color: #fff !important;
    background: #493f88 !important;
    box-shadow: inset 4px 0 0 #897dff !important;
  }
  .app-body .side-icon {
    display: grid !important;
    place-items: center !important;
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    border-radius: 10px !important;
    background: #e9edf5 !important;
    color: #6b7890 !important;
  }
  .app-body .side-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
  .app-body .side-link:hover .side-icon {
    background: #e2e7f1 !important;
    color: #53627b !important;
  }
  .app-body .sidebar-footer {
    margin-top: 18px !important;
    padding: 16px 4px 0 !important;
  }
  @media (max-width:980px) {
    .app-body .app-sidebar {
      width: min(310px,88vw) !important;
      flex-basis: auto !important;
    }
  }
  @media (prefers-reduced-motion:reduce) {
    .app-body .side-group>summary::after {
      transition: none !important;
    }
  }
  .app-body .app-sidebar {
    width: 274px !important;
    flex: 0 0 274px !important;
    padding: 15px 12px 16px !important;
    background: #111526 !important;
    color: #fff !important;
    border-right: 1px solid #20263a !important;
    box-shadow: 12px 0 36px rgba(16,24,40,.12) !important;
  }
  .app-body .app-logo {
    min-height: 58px !important;
    padding: 7px 9px 17px !important;
    gap: 11px !important;
  }
  .app-body .logo-mark {
    width: 38px !important;
    height: 38px !important;
    border-radius: 11px !important;
    font-size: 16px !important;
  }
  .app-body .logo-copy b {
    font-size: 18px !important;
  }
  .app-body .logo-copy small {
    font-size: 10px !important;
    letter-spacing: .11em !important;
  }
  .app-body .side-nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
  }
  .app-body .side-group {
    margin: 0 !important;
    border: 1px solid #dce2ec !important;
    border-radius: 15px !important;
    background: #f8f9fc !important;
    overflow: hidden !important;
  }
  .app-body .side-group>summary {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    height: 62px !important;
    min-height: 62px !important;
    padding: 0 49px 0 20px !important;
    color: #66758f !important;
    font-size: 11px !important;
    line-height: 1 !important;
    letter-spacing: .13em !important;
    font-weight: 850 !important;
    text-transform: uppercase !important;
    border: 0 !important;
    cursor: pointer !important;
    list-style: none !important;
  }
  .app-body .side-group>summary::-webkit-details-marker {
    display: none !important;
  }
  .app-body .side-group>summary:after {
    content: "" !important;
    position: absolute !important;
    right: 21px !important;
    top: 50% !important;
    width: 9px !important;
    height: 9px !important;
    border-right: 2px solid #96a2b5 !important;
    border-bottom: 2px solid #96a2b5 !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transform-origin: 50% 50% !important;
    transition: transform .2s ease !important;
  }
  .app-body .side-group[open]>summary:after {
    transform: translateY(-35%) rotate(225deg) !important;
  }
  .app-body .side-group-links {
    display: grid !important;
    gap: 6px !important;
    padding: 10px !important;
    border-top: 1px solid #dce2ec !important;
  }
  .app-body .side-link {
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    min-height: 48px !important;
    padding: 7px 10px !important;
    border-radius: 11px !important;
    color: #4c5a70 !important;
    font-size: 14px !important;
    font-weight: 720 !important;
    transition: background .15s ease,color .15s ease !important;
  }
  .app-body .side-link:hover {
    background: #eceffd !important;
    color: #302a78 !important;
    transform: none !important;
  }
  .app-body .side-link.active {
    background: #493f91 !important;
    color: #fff !important;
    box-shadow: inset 4px 0 0 #8177ff !important;
  }
  .app-body .side-icon {
    display: grid !important;
    place-items: center !important;
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    border-radius: 10px !important;
    background: #e9edf5 !important;
    color: #68758d !important;
  }
  .app-body .side-link.active .side-icon {
    background: rgba(255,255,255,.1) !important;
    color: #fff !important;
  }
  .app-body .sidebar-footer {
    margin-top: auto !important;
    padding: 13px 7px 2px !important;
    border-top: 1px solid rgba(255,255,255,.075) !important;
  }
  .app-body .top-actions {
    overflow: visible !important;
    position: relative !important;
    z-index: 1200 !important;
  }
  .app-body details.user-menu {
    position: relative !important;
    z-index: 1300 !important;
    min-width: 242px !important;
    margin: 0 !important;
    overflow: visible !important;
  }
  .app-body details.user-menu>summary {
    display: grid !important;
    grid-template-columns: 40px minmax(0,1fr) 20px !important;
    align-items: center !important;
    gap: 11px !important;
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 5px 13px 5px 6px !important;
    border: 1px solid #d7deea !important;
    border-radius: 15px !important;
    background: #fff !important;
    box-shadow: 0 3px 10px rgba(16,24,40,.06) !important;
    color: #344054 !important;
    cursor: pointer !important;
    list-style: none !important;
    text-align: left !important;
  }
  .app-body details.user-menu>summary::-webkit-details-marker {
    display: none !important;
  }
  .app-body details.user-menu[open]>summary {
    border-color: #9d97ff !important;
    box-shadow: 0 0 0 3px rgba(99,91,255,.14) !important;
  }
  .app-body details.user-menu .avatar {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
    border-radius: 11px !important;
  }
  .app-body details.user-menu .user-meta {
    display: block !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  .app-body details.user-menu .user-meta b {
    display: block !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .app-body details.user-menu .user-chevron {
    display: grid !important;
    place-items: center !important;
    width: 20px !important;
    height: 20px !important;
  }
  .app-body details.user-menu .user-chevron svg {
    width: 17px !important;
    height: 17px !important;
    transition: transform .18s ease !important;
  }
  .app-body details.user-menu[open] .user-chevron svg {
    transform: rotate(90deg) !important;
  }
  .app-body details.user-menu .user-menu-popover {
    position: absolute !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    z-index: 5000 !important;
    display: grid !important;
    min-width: 250px !important;
    padding: 8px !important;
    border: 1px solid #d7deea !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 18px 48px rgba(16,24,40,.18) !important;
  }
  .app-body details.user-menu:not([open]) .user-menu-popover {
    display: none !important;
  }
  .app-body details.user-menu .user-menu-popover a {
    display: block !important;
    padding: 10px 11px !important;
    border-radius: 9px !important;
    color: #344054 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }
  .app-body details.user-menu .user-menu-popover a:hover {
    background: #f2f1ff !important;
    color: #302a78 !important;
  }
  .app-body details.user-menu .user-menu-popover .logout-link {
    color: #b42318 !important;
    border-top: 1px solid #eaecf0 !important;
    margin-top: 4px !important;
    padding-top: 12px !important;
  }
  @media (max-width:900px) {
    .app-body .app-sidebar {
      width: min(88vw,310px) !important;
      flex-basis: auto !important;
    }
    .app-body .side-nav {
      gap: 14px !important;
    }
  }
  .app-body .app-sidebar .app-logo {
    grid-template-columns: 46px minmax(0,1fr) !important;
  }
  .app-body .app-sidebar .app-logo::after {
    display: none !important;
    content: none !important;
  }
  .app-body .side-nav {
    display: grid !important;
    gap: 18px !important;
  }
  .app-body .side-group {
    width: 100% !important;
    margin: 0 !important;
  }
  .app-body .side-group>summary {
    height: 62px !important;
    min-height: 62px !important;
    padding: 0 48px 0 20px !important;
  }
  .app-body .side-group-links {
    padding: 14px !important;
  }
  .app-body .side-link {
    min-height: 48px !important;
    margin: 0 !important;
    padding: 7px 10px !important;
  }
  .app-body .side-link+.side-link {
    margin-top: 4px !important;
  }
  .app-body details.user-menu {
    min-width: 220px !important;
  }
  .app-body details.user-menu>summary {
    grid-template-columns: 40px minmax(0,1fr) 20px !important;
  }
  .app-body details.user-menu .user-meta b {
    display: block !important;
    max-width: 150px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  .app-body details.user-menu .user-menu-popover {
    width: 240px !important;
    max-height: min(70vh,560px) !important;
    overflow: auto !important;
  }
  .account-workspace .business-details-grid {
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  }
  @media (max-width:980px) {
    .account-workspace .business-details-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (max-width:640px) {
    .account-workspace .business-details-grid {
      grid-template-columns: 1fr !important;
    }
    .account-workspace .business-details-grid .span-2 {
      grid-column: 1 !important;
    }
  }
  .operator-footer .operator-identity, .operator-footer > span:first-child {
    display: grid;
    gap: 3px;
    min-width: 0;
  }
  .operator-footer .operator-identity > span, .operator-footer > span:first-child > span {
    display: block;
  }
  .cookie-consent-shell {
    position: fixed;
    inset: auto 0 0;
    z-index: 99990;
    padding: 16px;
    background: linear-gradient(180deg,rgba(17,21,38,0),rgba(17,21,38,.18));
    font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  }
  .cookie-consent-banner {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 22px;
    align-items: center;
    padding: 22px;
    border: 1px solid #d9dce5;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(16,24,40,.22);
    color: #101828;
  }
  .cookie-consent-eyebrow {
    display: inline-flex;
    margin-bottom: 5px;
    color: #5b4be8;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  .cookie-consent-copy h2 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.25;
  }
  .cookie-consent-copy p {
    margin: 0;
    color: #475467;
    font-size: 14px;
    line-height: 1.55;
  }
  .cookie-consent-links {
    display: flex;
    gap: 16px;
    margin-top: 8px !important;
  }
  .cookie-consent-links a {
    color: #5549e6;
    font-weight: 700;
    text-decoration: none;
  }
  .cookie-consent-actions {
    display: grid;
    grid-template-columns: repeat(3,minmax(150px,1fr));
    gap: 10px;
    min-width: 510px;
  }
  .cookie-button {
    min-height: 44px;
    padding: 10px 15px;
    border-radius: 10px;
    border: 1px solid #cfd4df;
    background: #fff;
    color: #253047;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
  }
  .cookie-button:hover {
    border-color: #8c83f5;
    background: #f8f7ff;
  }
  .cookie-button:focus-visible,.cookie-settings-button:focus-visible {
    outline: 3px solid rgba(91,75,232,.28);
    outline-offset: 2px;
  }
  .cookie-button-primary {
    border-color: #5b4be8;
    background: #5b4be8;
    color: #fff;
  }
  .cookie-button-primary:hover {
    background: #4b3fd1;
    color: #fff;
  }
  .cookie-consent-options {
    grid-column: 1/-1;
    border-top: 1px solid #e4e7ec;
    padding-top: 14px;
  }
  .cookie-consent-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 13px 0;
    border-bottom: 1px solid #eef0f4;
  }
  .cookie-consent-option strong {
    display: block;
    margin-bottom: 3px;
    font-size: 14px;
  }
  .cookie-consent-option p,.cookie-consent-option small {
    display: block;
    margin: 0;
    color: #667085;
    font-size: 12px;
    line-height: 1.45;
  }
  .cookie-consent-option input {
    width: 22px;
    height: 22px;
    accent-color: #5b4be8;
  }
  .cookie-consent-option.is-disabled {
    opacity: .55;
  }
  .cookie-always-on {
    padding: 5px 9px;
    border-radius: 999px;
    background: #ecfdf3;
    color: #027a48;
    font-size: 11px;
    font-weight: 800;
  }
  .cookie-consent-option-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 14px;
  }
  .cookie-settings-button {
    position: fixed;
    left: 14px;
    bottom: 14px;
    z-index: 99980;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    background: #fff;
    color: #344054;
    box-shadow: 0 8px 28px rgba(16,24,40,.14);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
  }
  @media (max-width:900px) {
    .cookie-consent-banner {
      grid-template-columns: 1fr;
    }
    .cookie-consent-actions {
      min-width: 0;
      grid-template-columns: 1fr;
    }
    .cookie-consent-shell {
      padding: 10px;
    }
    .cookie-consent-banner {
      padding: 18px;
      max-height: calc(100vh - 20px);
      overflow: auto;
    }
    .cookie-consent-option {
      align-items: flex-start;
    }
    .cookie-consent-option-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
    }
  }
  .impersonation-banner {
    position: sticky;
    top: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 12px 20px;
    background: #35127a;
    color: #fff;
    border-bottom: 3px solid #ffcf4a;
    box-shadow: 0 8px 24px rgba(17,9,40,.22);
    font: 14px/1.45 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  }
  .impersonation-banner>div {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }
  .impersonation-banner strong {
    font-size: 15px;
  }
  .impersonation-banner span {
    opacity: .9;
    overflow-wrap: anywhere;
  }
  .impersonation-banner form {
    margin: 0;
    flex: 0 0 auto;
  }
  .impersonation-banner button {
    border: 1px solid rgba(255,255,255,.65);
    border-radius: 10px;
    background: #fff;
    color: #35127a;
    font-weight: 800;
    padding: 9px 14px;
    cursor: pointer;
  }
  .impersonation-banner button:hover {
    background: #fff7dc;
  }
  @media (max-width:720px) {
    .impersonation-banner {
      position: relative;
      align-items: flex-start;
      flex-direction: column;
      padding: 12px 14px;
    }
    .impersonation-banner form,.impersonation-banner button {
      width: 100%;
    }
  }
  :root {
    --legal-ink: #162033;
    --legal-muted: #667085;
    --legal-line: #e5e9f0;
    --legal-panel: #fff;
    --legal-soft: #f7f8fb;
    --legal-accent: #5f56e8;
  }
  .legal-public-body {
    margin: 0;
    background: var(--legal-soft);
    color: var(--legal-ink);
  }
  .legal-public-header {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid var(--legal-line);
    backdrop-filter: blur(12px);
  }
  .legal-public-nav {
    min-height: 72px;
    display: flex;
    align-items: center;
    gap: 24px;
  }
  .legal-public-nav nav {
    display: flex;
    gap: 8px;
    margin-left: auto;
  }
  .legal-public-nav nav a {
    padding: 9px 12px;
    border-radius: 10px;
    color: #475467;
    text-decoration: none;
    font-weight: 650;
  }
  .legal-public-nav nav a:hover,.legal-public-nav nav a[aria-current=page] {
    background: #f0efff;
    color: #453bc2;
  }
  .legal-print {
    border: 1px solid #d9deea;
    background: #fff;
    border-radius: 10px;
    padding: 9px 13px;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
  }
  .legal-public-layout {
    display: grid;
    grid-template-columns: minmax(220px,300px) minmax(0,820px);
    align-items: start;
    gap: 42px;
    padding-top: 48px;
    padding-bottom: 80px;
  }
  .legal-meta {
    position: sticky;
    top: 112px;
    padding: 24px;
    border: 1px solid var(--legal-line);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(16,24,40,.06);
  }
  .legal-kicker {
    display: inline-block;
    margin-bottom: 10px;
    color: #5148d8;
    text-transform: uppercase;
    letter-spacing: .11em;
    font-size: .72rem;
    font-weight: 800;
  }
  .legal-meta h1 {
    font-size: clamp(2rem,4vw,3rem);
    line-height: 1.03;
    margin: 0 0 22px;
  }
  .legal-meta dl {
    margin: 0;
  }
  .legal-meta dl div {
    padding: 12px 0;
    border-top: 1px solid var(--legal-line);
  }
  .legal-meta dt {
    color: var(--legal-muted);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .06em;
  }
  .legal-meta dd {
    margin: 4px 0 0;
    font-weight: 750;
  }
  .legal-meta p {
    color: var(--legal-muted);
    font-size: .9rem;
    line-height: 1.55;
  }
  .legal-document-content {
    background: var(--legal-panel);
    border: 1px solid var(--legal-line);
    border-radius: 20px;
    padding: clamp(24px,5vw,58px);
    box-shadow: 0 22px 55px rgba(16,24,40,.07);
    font-size: 1rem;
    line-height: 1.72;
    overflow-wrap: anywhere;
  }
  .legal-document-content h2 {
    font-size: 1.55rem;
    line-height: 1.22;
    margin: 2.2em 0 .65em;
    padding-top: .2em;
    color: #111827;
  }
  .legal-document-content h2:first-child {
    margin-top: 0;
  }
  .legal-document-content h3 {
    font-size: 1.13rem;
    margin: 1.7em 0 .45em;
  }
  .legal-document-content h4 {
    font-size: 1rem;
    margin: 1.4em 0 .35em;
  }
  .legal-document-content p {
    margin: .8em 0;
  }
  .legal-document-content ul,.legal-document-content ol {
    padding-left: 1.35rem;
  }
  .legal-document-content li {
    margin: .35em 0;
  }
  .legal-document-content a {
    color: #493fd0;
    text-decoration-thickness: .09em;
    text-underline-offset: .18em;
  }
  .legal-document-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: .94rem;
  }
  .legal-document-content th,.legal-document-content td {
    text-align: left;
    vertical-align: top;
    border: 1px solid #dfe4ec;
    padding: 12px;
  }
  .legal-document-content th {
    background: #f7f7fc;
    font-weight: 800;
  }
  .legal-document-content blockquote {
    margin: 1.5rem 0;
    padding: 1px 0 1px 18px;
    border-left: 4px solid #7d75ee;
    color: #475467;
  }
  .legal-document-content code {
    font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
    background: #f1f3f7;
    border-radius: 5px;
    padding: .12em .35em;
  }
  .legal-document-content pre {
    overflow: auto;
    background: #111827;
    color: #f8fafc;
    border-radius: 12px;
    padding: 18px;
  }
  .legal-document-content hr {
    border: 0;
    border-top: 1px solid var(--legal-line);
    margin: 2rem 0;
  }
  .legal-public-footer {
    border-top: 1px solid var(--legal-line);
    background: #fff;
  }
  .legal-public-footer>div {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding-top: 26px;
    padding-bottom: 26px;
    color: var(--legal-muted);
  }
  .legal-public-footer a {
    color: inherit;
  }
  .auth-legal-consent {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    font-weight: 500 !important;
    line-height: 1.45;
  }
  .auth-legal-consent input {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    margin-top: 2px;
  }
  .auth-legal-consent a {
    font-weight: 700;
  }
  .legal-accept-wrap {
    max-width: 980px;
  }
  .legal-accept-card {
    max-width: none;
  }
  .legal-accept-document {
    max-height: 50vh;
    overflow: auto;
    border: 1px solid var(--legal-line);
    border-radius: 14px;
    background: #fff;
    padding: 24px;
    margin: 22px 0;
  }
  .legal-accept-document h2 {
    font-size: 1.25rem;
    margin: 1.6em 0 .5em;
  }
  .legal-accept-document h3 {
    font-size: 1.05rem;
  }
  .legal-accept-document table {
    width: 100%;
    border-collapse: collapse;
  }
  .legal-accept-document td,.legal-accept-document th {
    border: 1px solid var(--legal-line);
    padding: 9px;
    text-align: left;
    vertical-align: top;
  }
  .legal-accept-form button[disabled] {
    opacity: .5;
    cursor: not-allowed;
  }
  @media (max-width:850px) {
    .legal-public-nav {
      flex-wrap: wrap;
      padding-top: 12px;
      padding-bottom: 12px;
    }
    .legal-public-nav nav {
      order: 3;
      width: 100%;
      overflow: auto;
      margin-left: 0;
    }
    .legal-public-layout {
      grid-template-columns: 1fr;
      gap: 22px;
      padding-top: 24px;
    }
    .legal-meta {
      position: static;
    }
    .legal-public-footer>div {
      flex-direction: column;
    }
    .legal-print {
      margin-left: auto;
    }
  }
  @media print {
    .legal-public-header,.legal-public-footer,.cookie-consent-shell,.cookie-settings-button {
      display: none !important;
    }
    .legal-public-body {
      background: #fff;
    }
    .legal-public-layout {
      display: block;
      padding: 0;
    }
    .legal-meta {
      position: static;
      border: 0;
      box-shadow: none;
      padding: 0 0 20px;
    }
    .legal-document-content {
      border: 0;
      box-shadow: none;
      padding: 0;
    }
    .legal-document-content a {
      color: #000;
    }
  }
  .legal-public-footer .operator-identity {
    display: grid;
    gap: 3px;
  }
  .legal-public-footer .operator-identity>span {
    display: block;
  }
  .legal-admin-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
  }
  .legal-admin-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid #dce1ea;
    border-radius: 11px;
    background: #fff;
    color: #344054;
    text-decoration: none;
    font-weight: 750;
  }
  .legal-admin-tabs a.active {
    background: #5e55e7;
    color: #fff;
    border-color: #5e55e7;
  }
  .legal-admin-grid {
    display: grid;
    grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr);
    gap: 18px;
  }
  .legal-editor-card {
    min-width: 0;
  }
  .legal-editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px;
    border: 1px solid #d9deea;
    border-bottom: 0;
    border-radius: 12px 12px 0 0;
    background: #f8f9fc;
  }
  .legal-editor-toolbar button,.legal-editor-toolbar select {
    min-height: 34px;
    border: 1px solid #d8dde8;
    border-radius: 8px;
    background: #fff;
    color: #344054;
    padding: 6px 9px;
    font: inherit;
    font-size: .85rem;
    cursor: pointer;
  }
  .legal-editor-toolbar button:hover {
    background: #eeecff;
    border-color: #b7b1ff;
  }
  .legal-editor-toolbar .toolbar-separator {
    width: 1px;
    background: #d8dde8;
    margin: 2px 3px;
  }
  .legal-rich-editor {
    min-height: 520px;
    max-height: 70vh;
    overflow: auto;
    border: 1px solid #d9deea;
    border-radius: 0 0 12px 12px;
    background: #fff;
    padding: 28px;
    line-height: 1.65;
    outline: none;
  }
  .legal-rich-editor:focus {
    border-color: #786ff2;
    box-shadow: 0 0 0 3px rgba(102,92,246,.14);
  }
  .legal-rich-editor h2 {
    font-size: 1.45rem;
    margin: 1.7em 0 .5em;
  }
  .legal-rich-editor h3 {
    font-size: 1.15rem;
    margin: 1.35em 0 .4em;
  }
  .legal-rich-editor table {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
  }
  .legal-rich-editor th,.legal-rich-editor td {
    border: 1px solid #d8dde8;
    padding: 9px;
    text-align: left;
    vertical-align: top;
  }
  .legal-rich-editor blockquote {
    border-left: 4px solid #7168ef;
    padding-left: 14px;
    color: #475467;
  }
  .legal-editor-fallback {
    width: 100%;
    min-height: 520px;
    font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  }
  .legal-editor-status {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    color: #667085;
    font-size: .82rem;
    padding-top: 8px;
  }
  .legal-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    align-items: center;
  }
  .legal-form-actions button.secondary {
    background: #fff;
    color: #344054;
    border: 1px solid #d4d9e3;
  }
  .legal-form-actions button.danger {
    background: #fff1f1;
    color: #b42318;
    border: 1px solid #f4c7c3;
  }
  .legal-version-list {
    display: grid;
    gap: 10px;
  }
  .legal-version-item {
    border: 1px solid #e0e4ec;
    border-radius: 12px;
    padding: 13px;
    background: #fff;
  }
  .legal-version-item header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
  }
  .legal-version-item h3 {
    font-size: 1rem;
    margin: 0;
  }
  .legal-version-item p {
    margin: 7px 0;
    color: #667085;
    font-size: .88rem;
  }
  .legal-version-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: #667085;
    font-size: .78rem;
  }
  .legal-version-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
  }
  .legal-version-actions a,.legal-version-actions button {
    font: inherit;
    font-size: .8rem;
    padding: 6px 9px;
    border: 1px solid #d9deea;
    border-radius: 8px;
    background: #fff;
    color: #344054;
    text-decoration: none;
    cursor: pointer;
  }
  .legal-status {
    display: inline-flex;
    border-radius: 999px;
    padding: 4px 8px;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
  .legal-status.published {
    background: #e9f9ef;
    color: #067647;
  }
  .legal-status.draft {
    background: #eef2f7;
    color: #475467;
  }
  .legal-status.scheduled {
    background: #fff4df;
    color: #9a5700;
  }
  .legal-status.archived {
    background: #f2f1ff;
    color: #5148d8;
  }
  .legal-compare-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  .legal-compare-pane {
    border: 1px solid #e0e4ec;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
  }
  .legal-compare-pane>header {
    padding: 12px 15px;
    background: #f8f9fc;
    border-bottom: 1px solid #e0e4ec;
    font-weight: 800;
  }
  .legal-compare-content {
    padding: 18px;
    max-height: 560px;
    overflow: auto;
    font-size: .9rem;
    line-height: 1.55;
  }
  .legal-compare-content table {
    width: 100%;
    border-collapse: collapse;
  }
  .legal-compare-content td,.legal-compare-content th {
    border: 1px solid #e0e4ec;
    padding: 7px;
  }
  .legal-token-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .legal-token-list button {
    border: 1px solid #d9deea;
    border-radius: 8px;
    background: #f8f9fc;
    padding: 6px 8px;
    font: inherit;
    font-size: .78rem;
    cursor: pointer;
  }
  .legal-migration-warning {
    border: 1px solid #f2c77f;
    background: #fff8eb;
    border-radius: 12px;
    padding: 16px;
    color: #7a4b00;
  }
  .legal-preview-panel {
    border: 1px solid #d9deea;
    border-radius: 12px;
    background: #fff;
    padding: 24px;
    line-height: 1.65;
  }
  .legal-preview-panel[hidden] {
    display: none;
  }
  .legal-settings-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
  }
  .legal-settings-grid .field-full {
    grid-column: 1/-1;
  }
  @media (max-width:1050px) {
    .legal-admin-grid {
      grid-template-columns: 1fr;
    }
    .legal-rich-editor {
      min-height: 420px;
    }
    .legal-settings-grid {
      grid-template-columns: 1fr;
    }
    .legal-compare-grid {
      grid-template-columns: 1fr;
    }
  }
  .app-body .sidebar-close {
    display: none !important;
  }
  @media (max-width:900px) {
    .app-body .sidebar-close {
      display: grid !important;
    }
  }
  .account-workspace .business-profile-card {
    overflow: visible !important;
  }
  .account-workspace .business-profile-card .business-details-grid {
    display: grid !important;
    width: 100% !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 16px 18px !important;
    align-items: start !important;
  }
  .account-workspace .business-profile-card .business-details-grid>label {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
  }
  .account-workspace .business-profile-card .business-details-grid input, .account-workspace .business-profile-card .business-details-grid select {
    width: 100% !important;
    min-width: 0 !important;
  }
  .account-workspace .business-profile-card .business-details-grid>.full {
    grid-column: 1/-1 !important;
  }
  @media (max-width:1180px) {
    .account-workspace .business-profile-card .business-details-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (max-width:700px) {
    .account-workspace .business-profile-card .business-details-grid {
      grid-template-columns: 1fr !important;
    }
  }
  .account-workspace .security-authenticator-card .security-form-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .account-workspace .security-authenticator-card .portal-actions {
    display: flex !important;
    justify-content: flex-end !important;
    margin-top: 0 !important;
  }
  .account-workspace .security-authenticator-card .portal-actions .portal-button {
    width: auto !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
  .account-workspace .security-authenticator-card input {
    min-width: 0 !important;
    width: 100% !important;
  }
  .app-body[data-admin-page="legal-documents"] .app-main {
    min-width: 0 !important;
  }
  .app-body[data-admin-page="legal-documents"] .card {
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-admin-grid {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0,1fr) minmax(300px,390px) !important;
    gap: 22px !important;
    align-items: start !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-editor-card, .app-body[data-admin-page="legal-documents"] .legal-editor-card form, .app-body[data-admin-page="legal-documents"] .legal-admin-grid>aside {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-editor-toolbar {
    width: 100% !important;
    min-width: 0 !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-rich-editor, .app-body[data-admin-page="legal-documents"] .legal-editor-fallback {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    white-space: normal;
  }
  .app-body[data-admin-page="legal-documents"] .legal-editor-fallback {
    white-space: pre-wrap !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-token-list {
    display: flex !important;
    flex-wrap: wrap !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-token-list button {
    width: auto !important;
    max-width: 100% !important;
  }
  @media (max-width:1250px) {
    .app-body[data-admin-page="legal-documents"] .legal-admin-grid {
      grid-template-columns: 1fr !important;
    }
    .app-body[data-admin-page="legal-documents"] .legal-admin-grid>aside {
      order: 2;
    }
  }
  [data-admin-page="legal-documents"] .legal-editor-layout, .legal-editor-layout {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(300px,390px) !important;
    gap: 1.5rem !important;
    align-items: start !important;
  }
  .legal-editor-layout > * {
    min-width: 0 !important;
  }
  .legal-editor-layout textarea,.legal-editor-layout input,.legal-editor-layout select,.legal-editor-layout .legal-editor-surface {
    width: 100% !important;
    max-width: 100% !important;
  }
  .business-details-grid {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 1rem !important;
  }
  .business-details-grid > * {
    min-width: 0 !important;
  }
  .business-details-grid .portal-form-actions {
    grid-column: 1/-1 !important;
  }
  .sidebar-close,.app-sidebar-close {
    display: none !important;
  }
  .authenticator-setup-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .875rem !important;
    min-width: 0 !important;
  }
  .authenticator-setup-form input,.authenticator-setup-form button {
    width: 100% !important;
    max-width: 100% !important;
  }
  @media (max-width:1250px) {
    .legal-editor-layout {
      grid-template-columns: 1fr !important;
    }
  }
  @media (max-width:980px) {
    .business-details-grid {
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }
  }
  @media (max-width:640px) {
    .business-details-grid {
      grid-template-columns: 1fr !important;
    }
  }
  @media (max-width:860px) {
    .sidebar-close,.app-sidebar-close {
      display: inline-flex !important;
    }
  }
  .account-workspace .portal-content h2, .account-workspace .portal-card h2, .account-workspace .security-card h2, .app-body .card h2, .app-body .panel h2 {
    font-size: 1.5rem !important;
    line-height: 1.25 !important;
    letter-spacing: -.025em !important;
    font-weight: 750 !important;
  }
  .account-workspace .portal-content h3, .app-body .card h3, .app-body .panel h3 {
    font-size: 1.125rem !important;
    line-height: 1.35 !important;
  }
  @media (max-width:640px) {
    .account-workspace .portal-content h2,.app-body .card h2,.app-body .panel h2 {
      font-size: 1.3rem !important;
    }
  }
  dialog.credential-dialog {
    width: min(1040px,calc(100vw - 32px)) !important;
    max-width: 1040px !important;
    height: min(820px,calc(100vh - 32px)) !important;
    max-height: calc(100vh - 32px) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 28px 90px rgba(15,23,42,.28) !important;
  }
  dialog.credential-dialog::backdrop {
    background: rgba(15,23,42,.58) !important;
    backdrop-filter: blur(4px) !important;
  }
  .credential-dialog-form {
    display: grid !important;
    grid-template-rows: auto minmax(0,1fr) auto !important;
    height: 100% !important;
    min-height: 0 !important;
  }
  .credential-dialog-header {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 24px !important;
    padding: 24px 26px 18px !important;
    border-bottom: 1px solid #e2e8f0 !important;
  }
  .credential-dialog-header h3 {
    font-size: 1.5rem !important;
    margin: 0 0 6px !important;
  }
  .credential-dialog-body {
    display: grid !important;
    grid-template-columns: minmax(0,1.7fr) minmax(280px,.9fr) !important;
    gap: 24px !important;
    min-height: 0 !important;
    overflow: auto !important;
    padding: 24px 26px !important;
  }
  .credential-access-section {
    min-width: 0 !important;
  }
  .credential-dialog-side {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
    gap: 16px !important;
    border-left: 1px solid #e2e8f0 !important;
    padding-left: 24px !important;
  }
  .credential-dialog-section {
    min-width: 0 !important;
  }
  .credential-dialog .service-checkbox-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 10px !important;
    max-height: none !important;
    overflow: visible !important;
  }
  .credential-dialog .service-checkbox-option {
    min-width: 0 !important;
    align-items: flex-start !important;
  }
  .credential-dialog textarea {
    width: 100% !important;
    resize: vertical !important;
  }
  .credential-dialog-actions {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 26px !important;
    border-top: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }
  .credential-action-spacer {
    flex: 1 !important;
  }
  .credential-dialog-actions button {
    white-space: nowrap !important;
  }
  @media (max-width:820px) {
    dialog.credential-dialog {
      width: calc(100vw - 16px) !important;
      height: calc(100vh - 16px) !important;
      max-height: calc(100vh - 16px) !important;
    }
    .credential-dialog-body {
      grid-template-columns: 1fr !important;
      padding: 18px !important;
    }
    .credential-dialog-side {
      border-left: 0 !important;
      border-top: 1px solid #e2e8f0 !important;
      padding: 18px 0 0 !important;
    }
    .credential-dialog .service-checkbox-grid {
      grid-template-columns: 1fr !important;
    }
    .credential-dialog-actions {
      flex-wrap: wrap !important;
      padding: 14px 18px !important;
    }
    .credential-action-spacer {
      display: none !important;
    }
    .credential-dialog-actions button {
      flex: 1 1 140px !important;
    }
  }
  .api-credentials-panel .credential-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 0 0 1.25rem;
    padding: .3rem;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
    width: max-content;
    max-width: 100%;
  }
  .api-credentials-panel .credential-tab {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: .55rem .9rem;
    border-radius: 10px;
    color: #475569;
    text-decoration: none;
    font-weight: 750;
  }
  .api-credentials-panel .credential-tab:hover,.api-credentials-panel .credential-tab:focus {
    background: #fff;
    color: #4338ca;
  }
  .api-credentials-panel .credential-tab.active {
    background: #5b4ce6;
    color: #fff;
    box-shadow: 0 6px 16px rgba(79,70,229,.2);
  }
  .api-credentials-panel .credential-section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 1rem;
  }
  .api-credentials-panel .credential-section-heading h3 {
    margin: 0 0 .35rem;
    font-size: 1.25rem !important;
  }
  .api-credentials-panel .credential-section-heading p {
    margin: 0;
    color: #64748b;
    max-width: 780px;
  }
  .api-credentials-panel .credential-heading-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .65rem;
    flex-wrap: wrap;
  }
  .api-credentials-panel .credential-divider {
    height: 1px;
    background: #e2e8f0;
    margin: 2rem 0;
  }
  .security-authenticator-card .authenticator-status {
    white-space: nowrap !important;
    flex: 0 0 auto !important;
    min-width: max-content !important;
  }
  .security-authenticator-card .authenticator-actions {
    justify-content: flex-end !important;
  }
  .security-authenticator-card .authenticator-actions .portal-button {
    margin-left: auto !important;
    width: auto !important;
  }
  .password-change-card .security-card-heading {
    padding-right: 0 !important;
  }
  @media (max-width:760px) {
    .api-credentials-panel .credential-section-heading {
      flex-direction: column;
    }
    .api-credentials-panel .credential-heading-actions {
      justify-content: flex-start;
    }
    .security-authenticator-card .security-card-heading {
      align-items: flex-start;
    }
    .security-authenticator-card .authenticator-status {
      font-size: .75rem !important;
    }
  }
  .app-body[data-admin-page="map-embeds"] .map-embed-metrics {
    margin-bottom: 24px !important;
  }
  .app-body[data-admin-page="map-embeds"] .table-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
  }
  .app-body[data-admin-page="map-embeds"] .table-actions form {
    margin: 0 !important;
  }
  .app-body[data-admin-page="map-embeds"] .btn.compact, .app-body[data-admin-page="map-embeds"] button.compact {
    height: 36px !important;
    min-height: 36px !important;
    padding: 7px 12px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
  .app-body .btn,.app-body button {
    font-size: 14px !important;
    line-height: 1.15 !important;
  }
  .map-embed-builder {
    padding: 0 !important;
    overflow: hidden !important;
  }
  .map-builder-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 26px 28px;
    border-bottom: 1px solid #e4e7ec;
    background: linear-gradient(180deg,#fff 0%,#fbfbfe 100%);
  }
  .map-builder-header h2 {
    margin: 4px 0 8px !important;
  }
  .map-builder-header p {
    max-width: 820px;
    margin: 0;
  }
  .map-builder-header .eyebrow {
    display: block;
    font-size: 11px;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-weight: 850;
    color: #5b50e6;
  }
  .map-builder-header>.badge {
    white-space: nowrap;
    flex: 0 0 auto;
  }
  .map-embed-form {
    display: block !important;
    padding: 0 !important;
  }
  .map-form-section {
    min-width: 0;
    margin: 0;
    padding: 26px 28px;
    border: 0;
    border-bottom: 1px solid #e4e7ec;
    background: #fff;
  }
  .map-form-section:nth-of-type(even) {
    background: #fcfcfe;
  }
  .map-form-section legend {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin: 0 0 20px;
    padding: 0;
    color: #101828;
  }
  .map-form-section legend>span {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: #eeecff;
    color: #4f46d8;
    font-size: 13px;
    font-weight: 850;
    flex: 0 0 30px;
  }
  .map-form-section legend>div {
    display: grid;
    gap: 2px;
  }
  .map-form-section legend strong {
    font-size: 16px;
    line-height: 1.25;
  }
  .map-form-section legend small {
    font-size: 13px;
    color: #667085;
    font-weight: 500;
  }
  .map-form-grid {
    display: grid;
    gap: 18px;
    align-items: start;
  }
  .map-form-grid-2 {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .map-form-grid-3 {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
  .map-form-grid-4 {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }
  .map-form-grid-5 {
    grid-template-columns: repeat(5,minmax(0,1fr));
  }
  .map-form-grid>label {
    display: flex;
    min-width: 0;
    flex-direction: column;
    margin: 0 !important;
  }
  .map-form-grid .span-2 {
    grid-column: span 2;
  }
  .map-form-grid .span-4 {
    grid-column: 1/-1;
  }
  .map-form-grid label>small {
    display: block;
    margin-top: 6px;
    line-height: 1.4;
  }
  .map-form-grid input,.map-form-grid select,.map-form-grid textarea {
    margin-top: 7px !important;
  }
  .map-form-grid textarea {
    min-height: 112px !important;
  }
  .map-form-grid .colour-input {
    height: 42px !important;
    padding: 5px !important;
    cursor: pointer;
  }
  .map-form-advanced textarea {
    min-height: 170px !important;
  }
  .map-option-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
  }
  .map-option-grid label {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    margin: 0 !important;
    padding: 11px 13px;
    border: 1px solid #d8dee8;
    border-radius: 11px;
    background: #fff;
    color: #344054;
    font-size: 14px;
    font-weight: 650;
    cursor: pointer;
  }
  .map-option-grid label:hover {
    border-color: #a9a4f6;
    background: #fafaff;
  }
  .map-option-grid input[type="checkbox"] {
    width: 17px !important;
    height: 17px !important;
    margin: 0 !important;
    flex: 0 0 17px;
  }
  .map-builder-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 28px;
    background: #f8f9fc;
  }
  .map-builder-actions p {
    margin: 0;
    line-height: 1.45;
  }
  .map-builder-actions .btn {
    flex: 0 0 auto;
    min-width: 210px;
  }
  @media (max-width:1180px) {
    .map-form-grid-5 {
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
    .map-form-grid-4 {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .map-option-grid {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (max-width:850px) {
    .map-builder-header {
      flex-direction: column;
    }
    .map-form-grid-3,.map-form-grid-5 {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .map-builder-actions {
      align-items: stretch;
      flex-direction: column;
    }
    .map-builder-actions .btn {
      width: 100%;
      min-width: 0;
    }
    .app-body[data-admin-page="map-embeds"] .table-actions {
      flex-wrap: wrap;
    }
  }
  @media (max-width:640px) {
    .map-builder-header,.map-form-section,.map-builder-actions {
      padding: 20px 16px;
    }
    .map-form-grid-2,.map-form-grid-3,.map-form-grid-4,.map-form-grid-5,.map-option-grid {
      grid-template-columns: 1fr;
    }
    .map-form-grid .span-2,.map-form-grid .span-4 {
      grid-column: auto;
    }
    .map-builder-header>.badge {
      white-space: normal;
    }
  }
  .api-credentials-panel .credentials-title {
    margin-bottom: 1.5rem;
  }
  .api-credentials-panel .credential-tabs {
    display: none !important;
  }
  .api-credentials-panel #map-publishable-keys {
    margin-top: 2.25rem;
    padding-top: 2.25rem;
    border-top: 1px solid #e2e8f0;
  }
  .api-credentials-panel #map-publishable-keys p {
    max-width: 980px;
    line-height: 1.65;
  }
  .api-credentials-panel .credential-manage-button, .api-credentials-panel details.map-key-action>summary.credential-manage-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 94px !important;
    height: 42px !important;
    padding: 0 1rem !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #334155 !important;
    font-size: .875rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    list-style: none !important;
    cursor: pointer !important;
    white-space: nowrap !important;
  }
  .api-credentials-panel details.map-key-action>summary.credential-manage-button::-webkit-details-marker {
    display: none !important;
  }
  .api-credentials-panel .credential-manage-button:hover, .api-credentials-panel details.map-key-action>summary.credential-manage-button:hover {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
  }
  .example-key-picker {
    display: grid;
    gap: 14px;
    padding: 16px;
    margin: 0 0 18px;
    border: 1px solid #c7d2fe;
    border-radius: 14px;
    background: #f5f7ff;
  }
  .example-key-picker-copy {
    display: grid;
    gap: 4px;
  }
  .example-key-picker-copy strong {
    color: #172033;
    font-size: 15px;
  }
  .example-key-picker-copy p {
    margin: 0;
    color: #526079;
    line-height: 1.55;
  }
  .example-key-picker-controls {
    display: grid;
    grid-template-columns: minmax(220px,1fr) minmax(260px,1.35fr) auto;
    gap: 12px;
    align-items: end;
  }
  .example-key-picker-controls label {
    display: grid;
    gap: 6px;
  }
  .example-key-picker-controls label>span {
    font-size: 12px;
    font-weight: 800;
    color: #334155;
  }
  .example-key-picker-controls input,.example-key-picker-controls select {
    width: 100%;
  }
  .example-key-status {
    color: #475569;
  }
  .service-management-panel {
    scroll-margin-top: 24px;
  }
  .side-link[href="/account#services"] .side-icon {
    color: inherit;
  }
  @media (max-width:800px) {
    .example-key-picker-controls {
      grid-template-columns: 1fr;
    }
    .example-key-picker-controls .btn {
      justify-self: start;
    }
  }
  .instruction-button {
    min-width: 92px;
    font-family: inherit;
    font-style: normal;
    font-weight: 750;
  }
  .example-key-picker select option:disabled {
    color: #94a3b8;
  }
}
@layer actoki-fixes {
  :root {
    color-scheme: light;
  }
  html, body {
    background: #f6f8fc;
    color: #0f172a;
  }
  .app-body[data-ui-release="68"] {
    color-scheme: light;
    background: radial-gradient(circle at 86% 3%, rgba(99, 102, 241, .08), transparent 30rem), #f6f8fc !important;
    color: #0f172a !important;
  }
  .app-body[data-ui-release="68"] .app-shell {
    align-items: stretch;
  }
  .app-body[data-ui-release="68"] .app-main {
    width: min(100%, calc(100vw - 272px));
    max-width: none;
    margin: 0;
    padding: 24px clamp(24px, 3vw, 48px) 56px;
  }
  .app-body[data-ui-release="68"] .app-main > :is(.topbar, section, .dashboard-metrics, .flash, .admin-footer, .portal-content) {
    width: 100%;
    max-width: 1480px;
    margin-left: auto;
    margin-right: auto;
  }
  .app-body[data-ui-release="68"] .topbar {
    min-height: 112px;
    margin-bottom: 24px;
    align-items: center;
  }
  .app-body[data-ui-release="68"] :is(.card, .panel, .portal-card, .metric, .metric-card, .dashboard-status) {
    border-color: #dfe5ef !important;
    background: #fff !important;
    color: #0f172a !important;
    box-shadow: 0 10px 32px rgba(15, 23, 42, .055) !important;
  }
  .app-body[data-ui-release="68"] :is(h1, h2, h3, h4, strong) {
    color: #0f172a;
  }
  .app-body[data-ui-release="68"] :is(p, small, .muted, .page-description) {
    color: #64748b;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] {
    width: 272px !important;
    flex: 0 0 272px !important;
    padding: 14px 12px 16px !important;
    border-right: 1px solid #dfe5ef !important;
    background: #fff !important;
    color: #0f172a !important;
    box-shadow: 10px 0 32px rgba(15, 23, 42, .055) !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .app-logo {
    min-height: 60px !important;
    padding: 7px 8px 17px !important;
    color: #0f172a !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .logo-copy small {
    color: #64748b !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 0 1px 12px !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-group {
    flex: 0 0 auto !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid #e3e8f1 !important;
    border-radius: 14px !important;
    background: #fbfcfe !important;
    box-shadow: none !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-group > summary {
    min-height: 46px !important;
    height: 46px !important;
    max-height: 46px !important;
    padding: 0 38px 0 14px !important;
    border: 0 !important;
    background: #fbfcfe !important;
    color: #65748e !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .13em !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-group > summary:hover {
    background: #f5f7fb !important;
    color: #334155 !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-group > summary::after {
    right: 15px !important;
    width: 8px !important;
    height: 8px !important;
    border-color: #94a3b8 !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-group-links {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 4px !important;
    padding: 8px !important;
    border-top: 1px solid #e3e8f1 !important;
    background: #fff !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-link {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 6px 9px !important;
    color: #475569 !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    box-shadow: none !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-link > span:last-child {
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-link:hover, .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-link:focus-visible {
    background: #f1f5f9 !important;
    color: #1e293b !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-link.active {
    background: #eef2ff !important;
    color: #3730a3 !important;
    box-shadow: inset 3px 0 0 #6366f1 !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-icon {
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    border-radius: 8px !important;
    background: #eef2f7 !important;
    color: #64748b !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-link:is(:hover,.active) .side-icon {
    background: #e0e7ff !important;
    color: #4f46e5 !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .sidebar-footer {
    border-top-color: #e3e8f1 !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .workspace-status {
    border: 1px solid #e3e8f1 !important;
    background: #f8fafc !important;
    color: #0f172a !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .workspace-status small, .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .sidebar-footer-links a {
    color: #64748b !important;
  }
  .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .sidebar-footer-links a:hover {
    color: #3730a3 !important;
    background: #eef2ff !important;
  }
  .app-body[data-ui-release="68"] :is(button, .btn):not(.secondary):not(.danger):not(.cookie-settings-button):not(.cookie-button-neutral):not(.nav-toggle):not(.sidebar-close):not(.instruction-button):not(.integration-method-tab):not(.guide-code-tab):not([role="tab"]):not([data-dialog-close]):not([data-service-guide-close]):not([data-api-key-toggle]) {
    border-color: #5748e7 !important;
    background: #5b4bf0 !important;
    color: #fff !important;
  }
  .app-body[data-ui-release="68"] :is(button, .btn):not(.secondary):not(.danger):not(.cookie-settings-button):not(.cookie-button-neutral):not(.nav-toggle):not(.sidebar-close):not(.instruction-button):not(.integration-method-tab):not(.guide-code-tab):not([role="tab"]):not([data-dialog-close]):not([data-service-guide-close]):not([data-api-key-toggle]):hover {
    border-color: #4638cb !important;
    background: #4d3ed8 !important;
    color: #fff !important;
  }
  .app-body[data-ui-release="68"] :is(button.secondary, .btn.secondary, .secondary, .instruction-button, .integration-method-tab, [data-dialog-close], [data-api-key-toggle]) {
    border-color: #cbd5e1 !important;
    background: #fff !important;
    color: #334155 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .07) !important;
  }
  .app-body[data-ui-release="68"] :is(button.secondary, .btn.secondary, .secondary, .instruction-button, .integration-method-tab, [data-dialog-close], [data-api-key-toggle]):hover {
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
    color: #0f172a !important;
  }
  .app-body[data-ui-release="68"] :is(button.danger, .btn.danger, .danger) {
    border-color: #dc2626 !important;
    background: #dc2626 !important;
    color: #fff !important;
  }
  .app-body[data-ui-release="68"] .dashboard-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
  }
  .app-body[data-ui-release="68"] .metric {
    min-height: 124px;
    padding: 22px;
  }
  .app-body[data-ui-release="68"] .dashboard-hero {
    display: grid !important;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr) !important;
    gap: 20px !important;
    margin-bottom: 24px !important;
  }
  .app-body[data-ui-release="68"] .dashboard-welcome {
    overflow: hidden;
    padding: 30px !important;
    border: 1px solid #dfe5ef !important;
    border-radius: 18px !important;
    background: radial-gradient(circle at 90% 0%, rgba(99, 102, 241, .13), transparent 17rem), #fff !important;
    color: #0f172a !important;
    box-shadow: 0 12px 36px rgba(15, 23, 42, .06) !important;
  }
  .app-body[data-ui-release="68"] .dashboard-welcome::after {
    display: none !important;
  }
  .app-body[data-ui-release="68"] .dashboard-eyebrow {
    color: #6366f1 !important;
    font-size: 11px !important;
  }
  .app-body[data-ui-release="68"] .dashboard-welcome h2 {
    margin: 10px 0 10px !important;
    color: #0f172a !important;
    font-size: clamp(1.8rem, 3vw, 2.5rem) !important;
  }
  .app-body[data-ui-release="68"] .dashboard-welcome p {
    max-width: 760px !important;
    color: #64748b !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
  }
  .app-body[data-ui-release="68"] .dashboard-actions {
    margin-top: 24px !important;
    gap: 10px !important;
  }
  .app-body[data-ui-release="68"] .dashboard-welcome .btn.secondary {
    border-color: #cbd5e1 !important;
    background: #fff !important;
    color: #334155 !important;
  }
  .app-body[data-ui-release="68"] .service-management-panel {
    padding: 28px;
  }
  .app-body[data-ui-release="68"] .service-management-table {
    min-width: 980px;
  }
  .app-body[data-ui-release="68"] .instruction-button {
    min-width: 112px;
    font-family: inherit !important;
    font-style: normal !important;
    font-weight: 700 !important;
    white-space: nowrap;
  }
  .service-instructions-dialog {
    position: fixed;
    inset: 0;
    width: min(96vw, 1180px) !important;
    height: min(92dvh, 980px) !important;
    max-width: none !important;
    max-height: none !important;
    margin: auto !important;
    overflow: hidden !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 18px !important;
    background: #fff !important;
    color: #0f172a !important;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .28) !important;
    color-scheme: light;
  }
  .service-instructions-dialog::backdrop {
    background: rgba(15, 23, 42, .62);
    backdrop-filter: blur(5px);
  }
  .service-instructions-dialog[open] {
    display: block !important;
  }
  .service-instructions-dialog .instruction-dialog-shell {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    height: 100% !important;
    min-height: 0;
    background: #fff !important;
  }
  .service-instructions-dialog .instruction-dialog-body {
    min-height: 0;
    overflow-y: auto !important;
    scrollbar-gutter: stable;
  }
  .service-instructions-dialog .integration-method-tab[aria-selected="true"] {
    border-color: #6366f1 !important;
    background: #eef2ff !important;
    color: #3730a3 !important;
    box-shadow: 0 0 0 1px rgba(99, 102, 241, .1) !important;
  }
  .service-instructions-dialog [data-api-language-panel][hidden] {
    display: none !important;
  }
  .service-instructions-dialog [data-api-example-copy] {
    min-height: 32px !important;
    border-color: #475569 !important;
    background: #1e293b !important;
    color: #f8fafc !important;
    box-shadow: none !important;
  }
  body.dialog-open {
    overflow: hidden;
  }
  .app-body[data-ui-release="68"] .copybox {
    border-color: #d7deea !important;
    background: #f8fafc !important;
    color: #312e81 !important;
  }
  .app-body[data-ui-release="68"] .copybox code {
    color: #4338ca !important;
  }
  .app-body[data-ui-release="68"] .copybox button {
    border-color: #cbd5e1 !important;
    background: #fff !important;
    color: #334155 !important;
  }
  .app-body[data-ui-release="68"] .public-keys-table .copybox-table {
    min-width: 250px;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    align-items: center !important;
    padding: 7px !important;
    border: 1px solid #d7deea !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    color: #312e81 !important;
  }
  .app-body[data-ui-release="68"] .public-keys-table .copybox-table code {
    padding: 0 6px !important;
    color: #4338ca !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .app-body[data-ui-release="68"] .public-keys-table .copybox-table button {
    min-width: 72px !important;
  }
  .app-body[data-ui-release="68"] .map-key-action > summary {
    min-width: 108px !important;
    outline: 0 !important;
  }
  .app-body[data-ui-release="68"] .support-layout {
    display: grid !important;
    grid-template-columns: minmax(420px, .9fr) minmax(0, 1.1fr) !important;
    gap: 24px !important;
    align-items: start !important;
  }
  .app-body[data-ui-release="68"] .support-form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: start !important;
  }
  .app-body[data-ui-release="68"] .support-form > * {
    min-width: 0;
  }
  .app-body[data-ui-release="68"] .support-form .field {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-column: auto !important;
    gap: 7px !important;
    align-items: start !important;
  }
  .app-body[data-ui-release="68"] .support-form :is(.field-full, .turnstile-wrap, .form-actions) {
    grid-column: 1 / -1 !important;
  }
  .app-body[data-ui-release="68"] .support-form label {
    display: block !important;
    width: auto !important;
    color: #334155 !important;
    font-size: 13px !important;
  }
  .app-body[data-ui-release="68"] .support-form :is(input, select, textarea) {
    width: 100% !important;
    max-width: none !important;
  }
  .app-body[data-ui-release="68"] .support-form textarea {
    min-height: 150px !important;
    resize: vertical;
  }
  .app-body[data-ui-release="68"] .support-form .form-actions {
    display: flex !important;
    justify-content: flex-end !important;
  }
  .app-body[data-ui-release="68"] .cache-clear-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
    margin-top: 20px !important;
  }
  .app-body[data-ui-release="68"] .cache-clear-grid > form {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    min-width: 0 !important;
    min-height: 230px !important;
    padding: 22px !important;
    border: 1px solid #dfe5ef !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
  }
  .app-body[data-ui-release="68"] .cache-clear-grid > form > * {
    width: auto !important;
    max-width: none !important;
    grid-column: auto !important;
  }
  .app-body[data-ui-release="68"] .cache-clear-grid label {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    color: #334155 !important;
  }
  .app-body[data-ui-release="68"] .cache-clear-grid small {
    display: block !important;
    max-width: 58ch !important;
    color: #64748b !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
  }
  .app-body[data-ui-release="68"] .cache-clear-grid button {
    width: fit-content !important;
    min-width: 190px !important;
    margin-top: auto !important;
    align-self: flex-start !important;
  }
  .app-body[data-ui-release="68"] .cookie-settings-button {
    left: auto !important;
    right: 18px !important;
    bottom: 18px !important;
    border-color: #cbd5e1 !important;
    background: #fff !important;
    color: #334155 !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .14) !important;
  }
  @media (max-width: 1180px) {
    .app-body[data-ui-release="68"] .dashboard-metrics {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .app-body[data-ui-release="68"] .dashboard-hero, .app-body[data-ui-release="68"] .support-layout {
      grid-template-columns: 1fr !important;
    }
  }
  @media (max-width: 900px) {
    .app-body[data-ui-release="68"] .app-main {
      width: 100%;
      max-width: none;
      padding: 16px 16px 48px;
    }
    .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] {
      width: min(88vw, 310px) !important;
      flex-basis: auto !important;
    }
    .app-body[data-ui-release="68"] .support-form, .app-body[data-ui-release="68"] .cache-clear-grid {
      grid-template-columns: 1fr !important;
    }
    .app-body[data-ui-release="68"] .support-form > * {
      grid-column: 1 !important;
    }
  }
  @media (max-width: 640px) {
    .app-body[data-ui-release="68"] .dashboard-metrics {
      grid-template-columns: 1fr;
    }
    .app-body[data-ui-release="68"] .service-management-panel {
      padding: 18px;
    }
    .service-instructions-dialog {
      width: 100vw !important;
      height: 100dvh !important;
      border: 0 !important;
      border-radius: 0 !important;
    }
    .app-body[data-ui-release="68"] .cookie-settings-button {
      right: 12px !important;
      bottom: 12px !important;
    }
  }
  @media (min-width: 901px) {
    .app-body[data-ui-release="68"] {
      overflow-x: hidden !important;
    }
    .app-body[data-ui-release="68"] .app-shell {
      display: block !important;
      min-height: 100vh !important;
    }
    .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] {
      position: fixed !important;
      inset: 0 auto 0 0 !important;
      z-index: 60 !important;
      display: flex !important;
      width: 272px !important;
      height: 100dvh !important;
      max-height: 100dvh !important;
      transform: none !important;
      overflow: hidden !important;
    }
    .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .app-logo, .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .sidebar-footer {
      flex: 0 0 auto !important;
    }
    .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-nav {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      overflow-x: hidden !important;
      overflow-y: auto !important;
      overscroll-behavior: contain !important;
      scrollbar-gutter: stable !important;
    }
    .app-body[data-ui-release="68"] .app-main {
      width: calc(100% - 272px) !important;
      max-width: none !important;
      min-height: 100vh !important;
      margin: 0 0 0 272px !important;
      padding: 24px clamp(24px, 3vw, 48px) 56px !important;
      overflow: visible !important;
    }
    .app-body[data-ui-release="68"] .sidebar-backdrop {
      display: none !important;
    }
  }
  @media (max-width: 900px) {
    .app-body[data-ui-release="68"] .app-shell {
      display: block !important;
      min-height: 100vh !important;
    }
    .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] {
      position: fixed !important;
      inset: 0 auto 0 0 !important;
      z-index: 70 !important;
      display: flex !important;
      width: min(88vw, 310px) !important;
      height: 100dvh !important;
      max-height: 100dvh !important;
      transform: translateX(-105%) !important;
      overflow: hidden !important;
      transition: transform .2s ease !important;
    }
    .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar].open {
      transform: translateX(0) !important;
    }
    .app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-nav {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      overflow-y: auto !important;
    }
    .app-body[data-ui-release="68"] .app-main {
      width: 100% !important;
      max-width: none !important;
      min-height: 100vh !important;
      margin: 0 !important;
      padding: 16px 16px 48px !important;
    }
    .app-body[data-ui-release="68"] .mobile-bar {
      display: flex !important;
    }
    .app-body[data-ui-release="68"] .sidebar-backdrop.open {
      display: block !important;
      position: fixed !important;
      inset: 0 !important;
      z-index: 65 !important;
    }
  }
  .app-body[data-ui-release="68"] :is( .btn.secondary, button.secondary, a.secondary, .instruction-button, .integration-method-tab, [data-dialog-close], [data-service-guide-close], [data-api-key-toggle], .top-action-link, .map-key-action > summary ) {
    -webkit-text-fill-color: #334155 !important;
    color: #334155 !important;
    border-color: #cbd5e1 !important;
    background: #fff !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  .app-body[data-ui-release="68"] :is( .btn.secondary, button.secondary, a.secondary, .instruction-button, .integration-method-tab, [data-dialog-close], [data-service-guide-close], [data-api-key-toggle], .top-action-link, .map-key-action > summary ):hover {
    -webkit-text-fill-color: #0f172a !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
  }
  .app-body[data-ui-release="68"] .instruction-button {
    display: inline-flex !important;
    min-width: 112px !important;
    min-height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }
  .app-body[data-ui-release="68"] .dashboard-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
  }
  .app-body[data-ui-release="68"] .dashboard-actions > .btn {
    min-width: 150px !important;
  }
  .field-span-8 {
    grid-column: span 8 !important;
    min-width: 0;
  }
  @media (max-width: 720px) {
    .field-span-8 {
      grid-column: 1 / -1 !important;
    }
  }
  .service-instructions-dialog {
    z-index: 2147483000 !important;
  }
  .service-instructions-dialog[open] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}
@layer utilities {
  :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(*) {
    grid-column: 1 / -1;
    min-width: 0;
  }
  :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label, .field, .form-field) {
    grid-column: span 6;
  }
  :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label:has(> input[type="number"]), label:has(> input[type="date"]), label:has(> input[type="time"]), .field:has(input[type="number"]), .field:has(input[type="date"])) {
    grid-column: span 4;
  }
  :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label:has(> input[maxlength="2"]), label:has(> input[maxlength="3"]), label:has(> input[maxlength="4"]), label:has(> input[type="checkbox"]), label:has(> input[type="radio"])) {
    grid-column: span 3;
  }
  :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label:has(textarea), label:has(> select[multiple]), .field-full, .form-actions, fieldset, table, .table-wrap, textarea, .legal-rich-editor, .legal-editor-toolbar, .legal-editor-status, .legal-preview-panel, .card, .panel, .help-text, .empty-state, hr, h2, h3, p) {
    grid-column: 1 / -1;
  }
  :where(.app-body form) :where(input, select, textarea) {
    max-width: 100%;
  }
  @media (max-width: 1024px) {
    :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label, .field, .form-field) {
      grid-column: span 6;
    }
  }
  @media (max-width: 720px) {
    :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(*) {
      grid-column: 1 / -1;
    }
    :where(.app-body .legal-admin-grid), :where(.app-body .grid.two), :where(.app-body .grid) {
      grid-template-columns: minmax(0, 1fr);
    }
    .app-body .table-wrap {
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }
    .app-body .table-wrap > table {
      min-width: 560px;
    }
    .app-body .table-actions, .app-body .service-actions, .app-body .form-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .app-body button, .app-body .btn {
      padding-top: 11px;
      padding-bottom: 11px;
    }
    .app-body input:not([type="checkbox"]):not([type="radio"]), .app-body select {
      padding-top: 11px;
      padding-bottom: 11px;
    }
    .app-body input, .app-body select, .app-body textarea {
      font-size: 16px;
    }
    .app-body .wrap, .app-body .card, .app-body .panel {
      padding-left: 14px;
      padding-right: 14px;
    }
    .app-body .stats {
      grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }
  }
  .app-body code, .app-body .copybox code {
    overflow-wrap: anywhere;
  }
  .app-body .app-sidebar .account-chip strong, .app-body .app-sidebar .account-chip .account-name, .app-body .side-account strong {
    color: #e2e8f0;
  }
  .docs-examples {
    margin: 14px 0 22px;
  }
  .docs-example-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
  }
  .docs-example-tab {
    padding: 7px 13px;
    border: 1px solid #dce1ea;
    border-radius: 9px;
    background: #fff;
    color: #344054;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
  }
  .docs-example-tab.active {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #fff;
  }
  .docs-code-wrap {
    position: relative;
  }
  .docs-copy-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    padding: 5px 11px;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 8px;
    background: rgba(255,255,255,.10);
    color: #e2e8f0;
    cursor: pointer;
  }
  .docs-copy-btn:hover {
    background: rgba(255,255,255,.20);
  }
  .docs-params {
    margin: 12px 0;
  }
  .docs-params h4 {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 800;
  }
  :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label:not([class])) {
    grid-column: span 6;
    display: grid;
    gap: 6px;
    align-content: start;
    min-width: 0;
  }
  :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label:not([class]):has(textarea), label:not([class]):has(select[multiple])) {
    grid-column: 1 / -1;
  }
  :where(.app-body form) :where(label:not([class]):has(input[type="checkbox"]), label:not([class]):has(input[type="radio"])) {
    display: flex;
    align-items: center;
    gap: 9px;
  }
  @media (max-width: 720px) {
    :where(.app-body form:not(.row):not(.table-actions):not([data-inline-form])) > :where(label:not([class])) {
      grid-column: 1 / -1;
    }
  }
  body.app-body .table-wrap:has(details.action-menu[open]) {
    overflow: visible !important;
  }
  body.app-body details.action-menu[open] > .action-menu-popover {
    position: fixed !important;
    inset: auto !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    z-index: 70 !important;
    width: min(560px, calc(100vw - 32px)) !important;
    min-width: 0 !important;
    max-height: min(82vh, 760px) !important;
    overflow-y: auto !important;
    margin: 0 !important;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .28) !important;
    border-radius: 14px !important;
  }
  body.app-body details.action-menu[open]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 69;
    background: rgba(15, 23, 42, .45);
  }
  .app-body details.action-menu[open] > .action-menu-popover :where(label, .field) {
    grid-column: 1 / -1;
    display: grid;
    gap: 6px;
    min-width: 0;
  }
  .app-body details.action-menu[open] > .action-menu-popover :where(input, select, textarea) {
    width: 100%;
  }
  @media (max-width: 720px) {
    body.app-body details.action-menu[open] > .action-menu-popover {
      width: calc(100vw - 24px) !important;
      max-height: 86vh !important;
    }
  }
}
.app-body .status-donut.status-donut-empty {
  background: conic-gradient(#cbd5e1 100%, #cbd5e1 0) !important;
}
.app-body :where(button, .btn, form, .form-actions, .row) + .help-text {
  margin-top: 12px;
}
.instruction-dialog-shell, .service-instructions-dialog .instruction-dialog-shell {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
}
.action-menu-panel-open .action-menu-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: -4px 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e6eaf2;
}
.action-menu-panel-open .action-menu-panel-head strong {
  font-size: 17px;
  font-weight: 800;
  color: #0f172a;
}
.action-menu-panel-open .action-menu-panel-close {
  border: 1px solid #d6dae3;
  border-radius: 9px;
  background: #fff;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: 700;
  color: #334155;
  cursor: pointer;
}
.action-menu-panel-open .action-menu-panel-close:hover {
  background: #f1f5f9;
}
.action-menu-panel-open form {
  display: grid;
  gap: 14px;
}
.action-menu-panel-open :where(label, .field) {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.action-menu-panel-open :where(input, select, textarea) {
  width: 100%;
}
.action-menu-panel-open p {
  margin: 0;
  color: #475569;
  font-size: 13px;
}
.action-menu-panel-open button[type="submit"], .action-menu-panel-open form > button {
  justify-self: start;
}
.app-body .settings-form {
  align-items: start !important;
}
.app-body .settings-form > :where(label, .field) {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
}
.app-body .settings-form > :where(.form-actions, button[type="submit"]) {
  align-self: center;
}
.app-body .field, .app-body .field-full, .app-body .field-span-6, .app-body label.field {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  align-content: start;
  display: grid;
  gap: 6px;
}
.app-body .app-sidebar .workspace-status-copy strong, .app-body .app-sidebar .workspace-status strong {
  color: #0f172a !important;
  font-weight: 700;
}
.app-body .app-sidebar .workspace-status-copy small, .app-body .app-sidebar .workspace-status small {
  color: #64748b !important;
}
.app-body .map-name-cell .map-status-badge {
  display: inline-flex;
  margin-top: 6px;
}
.app-body .map-key-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.app-body .map-key-actions > .action-menu {
  min-width: 0;
}
.app-body .map-key-actions summary {
  min-width: 96px;
}
.action-menu-panel-open .map-key-preview-frame {
  margin: 14px 0;
  border: 1px solid #dbe1ec;
  border-radius: 12px;
  overflow: hidden;
  background: #f8fafc;
}
.action-menu-panel-open .map-key-preview input[readonly] {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
}
dialog.workspace-dialog {
  width: min(760px, calc(100vw - 32px));
  max-width: none;
  max-height: min(88dvh, 900px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid #dbe2ec;
  border-radius: 18px;
  background: #fff;
  color: #0f172a;
  box-shadow: 0 28px 90px rgba(15, 23, 42, .30);
}
dialog.workspace-dialog[open] {
  display: block;
}
dialog.workspace-dialog::backdrop {
  background: rgba(15, 23, 42, .56);
  backdrop-filter: blur(3px);
}
.workspace-dialog-shell {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  width: 100%;
  max-height: min(88dvh, 900px);
  margin: 0 !important;
  background: #fff;
}
.workspace-dialog-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px 18px;
  border-bottom: 1px solid #e2e8f0;
}
.workspace-dialog-header h3 {
  margin: 0 0 6px;
  font-size: 22px;
  line-height: 1.25;
}
.workspace-dialog-header p {
  margin: 0;
  color: #64748b;
  line-height: 1.55;
}
.workspace-dialog-close {
  display: inline-grid !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  place-items: center;
  padding: 0 !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 11px !important;
  background: #fff !important;
  color: #475569 !important;
  font-size: 25px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}
.workspace-dialog-close:hover {
  background: #f8fafc !important;
  color: #0f172a !important;
}
.workspace-dialog-body {
  min-height: 0;
  overflow: auto;
  padding: 22px 24px;
}
.workspace-dialog-body :where(input, select, textarea) {
  width: 100%;
  max-width: none;
}
.workspace-dialog-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
  padding: 16px 24px 20px;
  border-top: 1px solid #e2e8f0;
  background: #fff;
}
.workspace-dialog-actions :where(button, .btn) {
  width: auto !important;
  min-width: 120px;
}
.app-body .public-keys-table th:last-child, .app-body .public-keys-table td.map-actions-cell {
  width: 224px !important;
  min-width: 224px;
}
.app-body .map-key-actions {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.app-body .map-key-actions > button {
  flex: 0 0 auto;
  min-width: 96px !important;
}
dialog.map-action-dialog {
  width: min(820px, calc(100vw - 32px));
}
dialog.map-rotate-dialog {
  width: min(560px, calc(100vw - 32px));
}
.workspace-dialog .map-key-preview-frame {
  margin: 0 0 18px;
  overflow: hidden;
  border: 1px solid #dbe2ec;
  border-radius: 14px;
  background: #f8fafc;
}
.workspace-dialog .map-key-preview-frame iframe {
  display: block;
  width: 100%;
  border: 0;
}
.workspace-dialog .map-key-preview label {
  display: grid;
  gap: 7px;
}
.workspace-dialog .map-key-preview input[readonly] {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
}
.support-page-heading {
  align-items: center !important;
}
.support-page-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}
.support-ticket-table {
  min-width: 760px;
}
.support-ticket-table tr.is-selected td {
  background: #eef2ff;
}
.support-ticket-table td:last-child {
  text-align: right;
}
.support-empty {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 46px 20px;
}
.support-empty p {
  max-width: 58ch;
  margin: 0;
}
dialog.support-create-dialog {
  width: min(760px, calc(100vw - 32px));
}
.support-create-dialog .support-form {
  margin: 0;
}
.support-thread {
  margin-top: 24px;
}
.support-message-list {
  display: grid;
  gap: 12px;
}
.support-message {
  margin: 0;
}
.support-reply-form {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid #e2e8f0;
}
.support-reply-form .form-actions {
  justify-content: flex-end !important;
}
.app-body[data-admin-page="data-sources"] .data-source-manager {
  width: 100%;
}
.app-body[data-admin-page="data-sources"] .data-source-manager-head {
  align-items: center !important;
}
.data-source-head-actions, .data-source-row-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
}
.data-source-head-actions form, .data-source-row-actions form {
  width: auto !important;
  margin: 0 !important;
}
.data-source-head-actions :where(button, .btn), .data-source-row-actions :where(button, .btn) {
  white-space: nowrap;
}
.data-source-table {
  min-width: 960px !important;
}
.data-source-table th:last-child, .data-source-table td:last-child {
  width: 210px;
}
dialog.data-source-dialog {
  width: min(960px, calc(100vw - 32px));
}
.app-body[data-admin-page="data-sources"] .data-source-dialog .data-source-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 18px !important;
}
.app-body[data-admin-page="data-sources"] .data-source-dialog .data-source-form-grid > label {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  min-width: 0;
}
.app-body[data-admin-page="data-sources"] .data-source-dialog .data-source-form-grid > .span-2 {
  grid-column: 1 / -1 !important;
}
.data-source-reference-card > summary {
  cursor: pointer;
  font-size: 18px;
  font-weight: 800;
  color: #0f172a;
}
.data-source-reference-card[open] > summary {
  margin-bottom: 14px;
}
@media (max-width: 720px) {
  dialog.workspace-dialog {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 15px;
  }
  .workspace-dialog-shell {
    max-height: calc(100dvh - 16px);
  }
  .workspace-dialog-header, .workspace-dialog-body, .workspace-dialog-actions {
    padding-left: 16px;
    padding-right: 16px;
  }
  .workspace-dialog-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .workspace-dialog-actions :where(button, .btn) {
    width: 100% !important;
  }
  .support-page-actions {
    width: 100%;
    justify-content: stretch;
  }
  .support-page-actions :where(button, .btn) {
    flex: 1 1 100%;
  }
  .app-body[data-admin-page="data-sources"] .data-source-dialog .data-source-form-grid {
    grid-template-columns: 1fr !important;
  }
  .app-body[data-admin-page="data-sources"] .data-source-dialog .data-source-form-grid > .span-2 {
    grid-column: 1 !important;
  }
}
.app-body[data-admin-page="privacy"] .privacy-settings-shell, .app-body[data-admin-page="privacy"] .privacy-settings-shell + .card {
  width: 100%;
  max-width: 1180px;
  margin-inline: auto;
}
.app-body[data-admin-page="privacy"] .privacy-settings-intro {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e2e8f0;
}
.app-body[data-admin-page="privacy"] .privacy-settings-intro > div {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.app-body[data-admin-page="privacy"] .privacy-settings-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: start !important;
}
.app-body[data-admin-page="privacy"] .privacy-settings-form > * {
  grid-column: 1 / -1 !important;
  min-width: 0;
}
.app-body[data-admin-page="privacy"] .privacy-form-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  margin: 0;
  padding: 20px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
}
.app-body[data-admin-page="privacy"] .privacy-section-legend {
  display: grid;
  gap: 5px;
  width: 100%;
  padding: 0;
}
.app-body[data-admin-page="privacy"] .privacy-section-legend span {
  color: #0f172a;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.3;
}
.app-body[data-admin-page="privacy"] .privacy-section-legend small {
  color: #64748b;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.55;
}
.app-body[data-admin-page="privacy"] .privacy-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.app-body[data-admin-page="privacy"] .privacy-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-column: auto !important;
  gap: 7px;
  align-content: start;
  min-width: 0;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}
.app-body[data-admin-page="privacy"] .privacy-field :where(input, select) {
  width: 100%;
  min-width: 0;
}
.app-body[data-admin-page="privacy"] .privacy-field small {
  color: #64748b;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}
.app-body[data-admin-page="privacy"] .privacy-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.app-body[data-admin-page="privacy"] label.privacy-choice {
  display: flex !important;
  grid-column: auto !important;
  align-items: flex-start !important;
  align-self: stretch !important;
  min-height: 0 !important;
  gap: 11px;
  margin: 0;
  padding: 14px;
  border: 1px solid #dbe3ee;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}
.app-body[data-admin-page="privacy"] label.privacy-choice:hover {
  border-color: #a5b4fc;
  background: #fafaff;
}
.app-body[data-admin-page="privacy"] label.privacy-choice > input {
  flex: 0 0 auto;
  margin: 3px 0 0;
}
.app-body[data-admin-page="privacy"] .privacy-choice-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.app-body[data-admin-page="privacy"] .privacy-choice-copy strong {
  color: #1e293b;
  font-size: 13px;
  line-height: 1.4;
}
.app-body[data-admin-page="privacy"] .privacy-choice-copy small {
  color: #64748b;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
}
.app-body[data-admin-page="privacy"] .privacy-publisher-notice {
  padding: 14px 16px;
  border-left: 4px solid #6366f1;
  border-radius: 0 12px 12px 0;
  background: #eef2ff;
  color: #3730a3;
}
.app-body[data-admin-page="privacy"] .privacy-publisher-notice strong {
  display: block;
  margin-bottom: 4px;
  color: #312e81;
  font-size: 13px;
}
.app-body[data-admin-page="privacy"] .privacy-publisher-notice p {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
}
.app-body[data-admin-page="privacy"] .privacy-save-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}
.app-body[data-admin-page="privacy"] .privacy-password-field {
  width: min(460px, 100%);
}
.app-body[data-admin-page="privacy"] .privacy-save-row > button {
  flex: 0 0 auto;
  min-width: 190px;
}
.app-body[data-admin-page="privacy"] .privacy-autofill-trap {
  position: fixed !important;
  left: -10000px !important;
  top: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
@media (max-width: 820px) {
  .app-body[data-admin-page="privacy"] .privacy-settings-intro, .app-body[data-admin-page="privacy"] .privacy-save-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
  .app-body[data-admin-page="privacy"] .privacy-field-grid, .app-body[data-admin-page="privacy"] .privacy-choice-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .app-body[data-admin-page="privacy"] .privacy-settings-intro .btn, .app-body[data-admin-page="privacy"] .privacy-save-row > button {
    width: 100%;
  }
}
.service-instructions-dialog > .instruction-dialog-shell > header {
  padding: 18px 24px !important;
}
.service-instructions-dialog .instruction-dialog-body {
  padding: 18px 24px 28px !important;
}
.service-instructions-dialog .guide-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
}
.service-instructions-dialog .guide-meta-row > span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border: 1px solid #dbe3ef;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.service-instructions-dialog .guide-meta-row > .is-active {
  border-color: #a7f3d0;
  background: #ecfdf5;
  color: #047857;
}
.service-instructions-dialog .guide-meta-row > .is-inactive {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}
.service-instructions-dialog .example-key-picker {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}
.service-instructions-dialog .example-key-picker-copy {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
}
.service-instructions-dialog .example-key-picker-copy > div {
  min-width: 0;
}
.service-instructions-dialog .example-key-picker-copy strong {
  display: block;
  color: #0f172a !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}
.service-instructions-dialog .example-key-picker-copy p {
  margin: 3px 0 0 !important;
  max-width: 760px;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}
.service-instructions-dialog .example-key-status {
  display: inline-flex !important;
  flex: 0 0 auto;
  align-items: center;
  min-height: 27px;
  margin: 0 !important;
  padding: 5px 9px;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca !important;
  font-size: 11px !important;
  font-weight: 700;
  line-height: 1.2 !important;
  white-space: nowrap;
}
.service-instructions-dialog .example-key-picker-controls {
  display: grid !important;
  grid-template-columns: minmax(220px, .85fr) minmax(320px, 1.15fr) !important;
  gap: 12px !important;
  align-items: end !important;
  margin: 0 !important;
}
.service-instructions-dialog .example-key-picker-controls > label {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 5px !important;
  min-width: 0;
  margin: 0 !important;
}
.service-instructions-dialog .example-key-picker-controls > label > span:first-child {
  color: #334155 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.3;
}
.service-instructions-dialog .example-key-picker-controls select, .service-instructions-dialog .example-key-picker-controls input {
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
  font-size: 14px !important;
}
.service-instructions-dialog .example-secret-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  align-items: center !important;
}
.service-instructions-dialog .example-secret-control > button {
  min-width: 68px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 8px 13px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
  white-space: nowrap;
}
.service-instructions-dialog .example-secret-control > button:hover {
  border-color: #a5b4fc !important;
  background: #eef2ff !important;
  color: #4338ca !important;
}
.service-instructions-dialog .guide-examples-intro {
  margin-top: 18px !important;
}
.service-instructions-dialog .guide-examples-intro h3 {
  font-size: 15px !important;
}
.service-instructions-dialog .guide-examples-intro p {
  margin-top: 2px !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}
.service-instructions-dialog .guide-endpoint-list {
  display: grid;
  gap: 16px;
  margin-top: 12px;
}
.service-instructions-dialog .endpoint-guide {
  padding: 16px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
.service-instructions-dialog .endpoint-guide > p {
  margin-top: 8px !important;
}
.service-instructions-dialog .endpoint-guide > details {
  margin-top: 12px !important;
}
.service-instructions-dialog .docs-examples {
  margin: 14px 0 0 !important;
  overflow: hidden;
  border: 1px solid #cbd5e1;
  border-radius: 13px;
  background: #fff;
}
.service-instructions-dialog .docs-example-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 22px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  overflow-x: auto;
  border-bottom: 1px solid #dbe3ef;
  background: #fff;
  scrollbar-width: thin;
}
.service-instructions-dialog .docs-example-tab {
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 11px 1px 10px !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 750 !important;
}
.service-instructions-dialog .docs-example-tab:hover {
  color: #312e81 !important;
}
.service-instructions-dialog .docs-example-tab.active {
  border-bottom-color: #4f46e5 !important;
  background: transparent !important;
  color: #4338ca !important;
}
.service-instructions-dialog .docs-code-wrap {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.service-instructions-dialog .code-example-head {
  min-height: 40px;
  padding: 7px 12px !important;
}
.service-instructions-dialog .docs-code {
  max-height: 340px;
}
@media (max-width: 760px) {
  .service-instructions-dialog > .instruction-dialog-shell > header, .service-instructions-dialog .instruction-dialog-body {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .service-instructions-dialog .example-key-picker-copy {
    display: grid !important;
    gap: 8px !important;
  }
  .service-instructions-dialog .example-key-status {
    justify-self: start;
    white-space: normal;
  }
  .service-instructions-dialog .example-key-picker-controls {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .service-instructions-dialog .docs-example-tabs {
    gap: 18px !important;
  }
}
.service-instructions-dialog {
  width: min(94vw, 1120px) !important;
  height: min(90dvh, 900px) !important;
}
.service-instructions-dialog > .instruction-dialog-shell > header {
  align-items: center !important;
  padding: 16px 22px !important;
}
.service-instructions-dialog .guide-header-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
}
.service-instructions-dialog .guide-docs-link {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: 10px;
  color: #4338ca;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}
.service-instructions-dialog .guide-docs-link:hover {
  background: #eef2ff;
  color: #312e81;
}
.service-instructions-dialog .instruction-dialog-body {
  padding: 16px 22px 24px !important;
}
.service-instructions-dialog .example-key-picker {
  grid-template-columns: minmax(210px, .62fr) minmax(0, 1.38fr) !important;
  align-items: end !important;
  gap: 18px !important;
  padding: 13px 15px !important;
}
.service-instructions-dialog .example-key-picker-copy {
  display: grid !important;
  align-content: end !important;
  gap: 8px !important;
}
.service-instructions-dialog .example-key-picker-copy p {
  max-width: 38ch;
}
.service-instructions-dialog .example-key-status {
  justify-self: start;
  white-space: normal;
}
.service-instructions-dialog .example-key-picker-controls {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.service-instructions-dialog .guide-endpoint-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin: 16px 0 10px;
}
.service-instructions-dialog .guide-endpoint-heading h3 {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
  font-weight: 800;
}
.service-instructions-dialog .guide-endpoint-heading p {
  margin: 2px 0 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.45;
}
.service-instructions-dialog .guide-endpoint-list {
  margin-top: 0 !important;
}
.service-instructions-dialog .endpoint-guide {
  padding: 15px !important;
}
.service-instructions-dialog .endpoint-guide-head {
  align-items: center !important;
}
.workspace-dialog-body .balanced-dialog-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 18px !important;
  margin: 0 !important;
}
.workspace-dialog-body .balanced-dialog-form > :where(.field, label) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  min-width: 0;
  margin: 0 !important;
}
.workspace-dialog-body .balanced-dialog-form > :where(.field-full, .turnstile-wrap, .form-actions) {
  grid-column: 1 / -1 !important;
}
.support-create-dialog .support-form textarea, .support-reply-form textarea {
  min-height: 150px;
}
.support-create-dialog .turnstile-wrap {
  display: flex;
  justify-content: flex-start;
  min-height: 70px;
}
.app-body[data-admin-page="data-sources"] .data-source-form-sections {
  display: grid;
  gap: 16px;
}
.app-body[data-admin-page="data-sources"] .data-source-form-section {
  min-width: 0;
  margin: 0;
  padding: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
}
.app-body[data-admin-page="data-sources"] .data-source-form-section > legend {
  display: grid;
  gap: 3px;
  width: 100%;
  margin: 0 0 13px;
  padding: 0;
}
.app-body[data-admin-page="data-sources"] .data-source-form-section > legend span {
  color: #0f172a;
  font-size: 15px;
  font-weight: 800;
}
.app-body[data-admin-page="data-sources"] .data-source-form-section > legend small {
  color: #64748b;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
}
.app-body[data-admin-page="data-sources"] .data-source-active-choice {
  display: flex !important;
  align-items: flex-start;
  gap: 10px !important;
  padding: 12px 13px;
  border: 1px solid #dbe3ef;
  border-radius: 11px;
  background: #fff;
}
.app-body[data-admin-page="data-sources"] .data-source-active-choice input {
  width: 18px !important;
  height: 18px;
  margin-top: 2px;
}
.app-body[data-admin-page="data-sources"] .data-source-active-choice span {
  display: grid;
  gap: 2px;
}
.app-body[data-admin-page="data-sources"] .data-source-active-choice small {
  color: #64748b;
  font-weight: 500;
}
.app-body[data-admin-page="privacy"] .privacy-field-grid > :last-child:nth-child(odd) {
  grid-column: 1 / -1;
}
.account-workspace .create-key-dialog .create-key-body {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 18px !important;
  align-items: start !important;
}
.account-workspace .create-key-dialog .create-key-body > :where(.service-checkbox-fieldset, .field-full) {
  grid-column: 1 / -1 !important;
}
.account-workspace .create-key-dialog .create-key-body > :where(.field, .readonly-summary) {
  min-width: 0;
  margin: 0 !important;
}
.account-workspace .create-key-dialog .readonly-summary {
  height: 100%;
}
@media (max-width: 820px) {
  .service-instructions-dialog {
    width: calc(100vw - 16px) !important;
    height: calc(100dvh - 16px) !important;
  }
  .service-instructions-dialog > .instruction-dialog-shell > header {
    align-items: flex-start !important;
  }
  .service-instructions-dialog .guide-header-actions {
    gap: 4px;
  }
  .service-instructions-dialog .guide-docs-link {
    display: none;
  }
  .service-instructions-dialog .example-key-picker {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  .service-instructions-dialog .example-key-picker-copy p {
    max-width: none;
  }
  .workspace-dialog-body .balanced-dialog-form, .account-workspace .create-key-dialog .create-key-body {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .workspace-dialog-body .balanced-dialog-form > :where(.field-full, .turnstile-wrap, .form-actions), .account-workspace .create-key-dialog .create-key-body > :where(.service-checkbox-fieldset, .field-full) {
    grid-column: 1 !important;
  }
}
.service-instructions-dialog .guide-code-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: end !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  overflow-x: auto !important;
  border-bottom: 1px solid #dbe3ef !important;
  background: #fff !important;
  scrollbar-width: thin;
}
.service-instructions-dialog button.guide-code-tab {
  appearance: none !important;
  flex: 0 0 auto !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 12px 0 10px !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}
.service-instructions-dialog button.guide-code-tab:hover {
  color: #312e81 !important;
}
.service-instructions-dialog button.guide-code-tab.active, .service-instructions-dialog button.guide-code-tab[aria-selected="true"] {
  border-bottom-color: #4f46e5 !important;
  background: transparent !important;
  color: #4338ca !important;
}
.service-instructions-dialog button.guide-code-tab:focus-visible {
  outline: 2px solid #6366f1 !important;
  outline-offset: -2px !important;
}
.service-instructions-dialog .example-key-help {
  grid-column: 1 / -1;
  margin: 0 !important;
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}
.service-instructions-dialog .example-key-help a {
  color: #4338ca;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 2px;
}
@media (max-width: 760px) {
  .service-instructions-dialog .guide-code-tabs {
    gap: 20px !important;
    padding: 0 14px !important;
  }
}
.app-body[data-admin-page="legal-documents"] .legal-admin-grid {
  grid-template-columns: minmax(0, 1fr) minmax(360px, 420px) !important;
  gap: 24px !important;
  align-items: start !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-card {
  min-width: 0 !important;
  padding: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #f8fafc;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-card > form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 16px !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e2e8f0;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-section-heading h3, .app-body[data-admin-page="legal-documents"] .legal-history-header h3 {
  margin: 0;
  color: #0f172a;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.3;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-section-heading p, .app-body[data-admin-page="legal-documents"] .legal-history-header p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.5;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-version-chip, .app-body[data-admin-page="legal-documents"] .legal-history-header > span {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-meta-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 15px 16px !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-meta-grid > label {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  min-width: 0;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-meta-grid > .field-full {
  grid-column: 1 / -1 !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-meta-grid :where(input, textarea) {
  width: 100% !important;
  min-width: 0 !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-toolbar {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  padding: 8px !important;
  border: 1px solid #cbd5e1 !important;
  border-bottom: 0 !important;
  border-radius: 12px 12px 0 0 !important;
  background: #f1f5f9 !important;
  box-shadow: none !important;
}
.app-body[data-admin-page="legal-documents"] .legal-toolbar-group {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 5px;
  padding-right: 8px;
  border-right: 1px solid #cbd5e1;
}
.app-body[data-admin-page="legal-documents"] .legal-toolbar-group:last-child {
  margin-left: auto;
  padding-right: 0;
  border-right: 0;
}
.app-body[data-admin-page="legal-documents"] .legal-toolbar-style select {
  width: 168px !important;
  min-width: 150px !important;
  min-height: 36px !important;
  padding: 6px 30px 6px 10px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background-color: #fff !important;
  color: #334155 !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-toolbar button {
  appearance: none !important;
  display: inline-flex !important;
  width: auto !important;
  min-width: 36px !important;
  min-height: 36px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #334155 !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-toolbar button span {
  color: inherit !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-toolbar button:hover {
  border-color: #a5b4fc !important;
  background: #eef2ff !important;
  color: #4338ca !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-toolbar button:focus-visible, .app-body[data-admin-page="legal-documents"] .legal-toolbar-style select:focus-visible {
  outline: 2px solid #6366f1 !important;
  outline-offset: 2px !important;
}
.app-body[data-admin-page="legal-documents"] .legal-editor-toolbar button[aria-pressed="true"] {
  border-color: #6366f1 !important;
  background: #4f46e5 !important;
  color: #fff !important;
}
.app-body[data-admin-page="legal-documents"] .legal-toolbar-icon {
  padding-inline: 0 !important;
  font-size: 15px !important;
  font-weight: 850 !important;
}
.app-body[data-admin-page="legal-documents"] .legal-toolbar-italic {
  font-style: italic !important;
}
.app-body[data-admin-page="legal-documents"] .legal-toolbar-underline {
  text-decoration: underline !important;
  text-underline-offset: 2px;
}
.app-body[data-admin-page="legal-documents"] .legal-rich-editor, .app-body[data-admin-page="legal-documents"] .legal-editor-fallback {
  min-height: 540px !important;
  margin: 0 !important;
  border-color: #cbd5e1 !important;
  border-radius: 0 0 12px 12px !important;
  background: #fff !important;
}
.app-body[data-admin-page="legal-documents"] .legal-rich-editor {
  padding: 28px 30px !important;
  color: #1e293b;
  font-size: 15px;
  line-height: 1.65;
}
.app-body[data-admin-page="legal-documents"] .legal-rich-editor :where(p, h2, h3, h4, ul, ol, blockquote, pre) {
  max-width: 88ch;
}
.app-body[data-admin-page="legal-documents"] .legal-history-panel {
  position: sticky;
  top: 18px;
  display: grid;
  min-width: 0 !important;
  max-height: calc(100dvh - 36px);
  gap: 14px;
  overflow: auto;
  padding: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #f8fafc;
  scrollbar-gutter: stable;
}
.app-body[data-admin-page="legal-documents"] .legal-history-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 13px;
  border-bottom: 1px solid #e2e8f0;
}
.app-body[data-admin-page="legal-documents"] .legal-version-list {
  display: grid !important;
  gap: 12px !important;
}
.app-body[data-admin-page="legal-documents"] .legal-version-item {
  padding: 14px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.app-body[data-admin-page="legal-documents"] .legal-version-item header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: start !important;
}
.app-body[data-admin-page="legal-documents"] .legal-version-item header h3 {
  overflow-wrap: anywhere;
  color: #0f172a;
  font-size: 15px !important;
  line-height: 1.35;
}
.app-body[data-admin-page="legal-documents"] .legal-version-item header small {
  color: #64748b;
  font-size: 11px;
  white-space: nowrap;
}
.app-body[data-admin-page="legal-documents"] .legal-version-actions {
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 12px !important;
}
.app-body[data-admin-page="legal-documents"] .legal-version-actions > a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  padding: 7px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}
.app-body[data-admin-page="legal-documents"] .legal-version-actions > a:hover {
  border-color: #a5b4fc;
  background: #eef2ff;
  color: #4338ca;
}
.app-body[data-admin-page="legal-documents"] .legal-version-action-form {
  display: grid !important;
  width: 100% !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  margin: 0 !important;
  padding-top: 2px;
}
.app-body[data-admin-page="legal-documents"] .legal-version-action-form input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  font-size: 12px !important;
}
.app-body[data-admin-page="legal-documents"] .legal-version-action-form button {
  width: auto !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 11px !important;
  white-space: nowrap;
  font-size: 12px !important;
}
@media (max-width: 1250px) {
  .app-body[data-admin-page="legal-documents"] .legal-admin-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-history-panel {
    position: static;
    max-height: none;
  }
}
@media (max-width: 760px) {
  .app-body[data-admin-page="legal-documents"] .legal-editor-card, .app-body[data-admin-page="legal-documents"] .legal-history-panel {
    padding: 14px;
    border-radius: 14px;
  }
  .app-body[data-admin-page="legal-documents"] .legal-editor-meta-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-editor-meta-grid > .field-full {
    grid-column: 1 !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-toolbar-group, .app-body[data-admin-page="legal-documents"] .legal-toolbar-group:last-child {
    margin-left: 0;
    padding-right: 0;
    border-right: 0;
  }
  .app-body[data-admin-page="legal-documents"] .legal-toolbar-style {
    width: 100%;
  }
  .app-body[data-admin-page="legal-documents"] .legal-toolbar-style select {
    width: 100% !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-rich-editor {
    min-height: 420px !important;
    padding: 20px !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-version-action-form {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .app-body[data-admin-page="legal-documents"] .legal-version-action-form button {
    width: 100% !important;
  }
}
.service-instructions-dialog .example-key-picker {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: end !important;
  gap: 12px 16px !important;
  padding: 16px 18px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
}
.service-instructions-dialog .example-key-picker-heading {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: baseline !important;
  gap: 10px 18px !important;
  min-width: 0 !important;
}
.service-instructions-dialog .example-key-picker-heading strong {
  color: #0f172a !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
.service-instructions-dialog .example-key-picker-heading p {
  max-width: none !important;
  margin: 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}
.service-instructions-dialog .example-key-picker-controls {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px 16px !important;
  align-items: end !important;
}
.service-instructions-dialog .example-key-picker-controls > .example-key-select-field, .service-instructions-dialog .example-key-picker-controls > .example-secret-field {
  grid-column: span 2 !important;
  min-width: 0 !important;
}
.service-instructions-dialog .example-key-picker-controls select, .service-instructions-dialog .example-key-picker-controls input {
  min-height: 44px !important;
  background: #fff !important;
}
.service-instructions-dialog .example-key-guidance {
  grid-column: 1 / -1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px 20px !important;
  min-width: 0 !important;
  padding-top: 2px !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}
.service-instructions-dialog .example-key-guidance p {
  margin: 0 !important;
  color: inherit !important;
}
.service-instructions-dialog .example-key-guidance a {
  color: #4338ca !important;
  font-weight: 750 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}
.service-instructions-dialog .example-key-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  white-space: normal !important;
}
.service-instructions-dialog .example-key-status::before {
  width: 7px !important;
  height: 7px !important;
  flex: 0 0 7px !important;
  border-radius: 999px !important;
  background: #6366f1 !important;
  content: "" !important;
}
.service-instructions-dialog [role="tablist"].guide-code-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 14px !important;
  overflow-x: auto !important;
  border: 0 !important;
  border-bottom: 1px solid #dbe3ef !important;
  background: #f8fafc !important;
  scrollbar-width: thin !important;
}
.service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab {
  all: unset !important;
  box-sizing: border-box !important;
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  min-height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 15px !important;
  color: #64748b !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}
.service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab::after {
  position: absolute !important;
  right: 12px !important;
  bottom: -1px !important;
  left: 12px !important;
  height: 3px !important;
  border-radius: 999px 999px 0 0 !important;
  background: transparent !important;
  content: "" !important;
}
.service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab:hover {
  color: #312e81 !important;
  background: rgba(238, 242, 255, .72) !important;
}
.service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab.active, .service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab[aria-selected="true"] {
  color: #4338ca !important;
  background: #fff !important;
}
.service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab.active::after, .service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab[aria-selected="true"]::after {
  background: #4f46e5 !important;
}
.service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab:focus-visible {
  z-index: 1 !important;
  outline: 2px solid #6366f1 !important;
  outline-offset: -4px !important;
}
.service-instructions-dialog .docs-examples {
  border-color: #dbe3ef !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
}
.service-instructions-dialog .code-example-head {
  min-height: 38px !important;
  background: #111827 !important;
}
@media (min-width: 1180px) {
  .account-workspace .portal-profile-form {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px 20px !important;
    align-items: end !important;
  }
  .account-workspace .portal-profile-form > label.profile-field-name, .account-workspace .portal-profile-form > label.profile-field-email, .account-workspace .portal-profile-form > label.profile-field-password {
    grid-column: span 2 !important;
  }
  .account-workspace .portal-profile-form > label.profile-field-language, .account-workspace .portal-profile-form > label.profile-field-currency {
    grid-column: span 1 !important;
  }
  .account-workspace .portal-profile-form > .portal-actions {
    grid-column: 1 / -1 !important;
    justify-content: flex-end !important;
    padding-top: 8px !important;
  }
}
@media (min-width: 760px) and (max-width: 1179px) {
  .account-workspace .portal-profile-form {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .account-workspace .portal-profile-form > label.profile-field, .account-workspace .portal-profile-form > .portal-actions {
    grid-column: span 1 !important;
  }
  .account-workspace .portal-profile-form > label.profile-field-password, .account-workspace .portal-profile-form > .portal-actions {
    grid-column: 1 / -1 !important;
  }
}
@media (max-width: 819px) {
  .service-instructions-dialog .example-key-picker, .service-instructions-dialog .example-key-picker-controls {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .service-instructions-dialog .example-key-picker-heading {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 4px !important;
  }
  .service-instructions-dialog .example-key-picker-heading strong {
    white-space: normal !important;
  }
  .service-instructions-dialog .example-key-picker-controls > .example-key-select-field, .service-instructions-dialog .example-key-picker-controls > .example-secret-field {
    grid-column: 1 !important;
  }
  .service-instructions-dialog .example-key-guidance {
    display: grid !important;
    justify-items: start !important;
  }
  .service-instructions-dialog [role="tablist"].guide-code-tabs {
    padding: 0 8px !important;
  }
  .service-instructions-dialog [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab {
    min-height: 44px !important;
    padding: 0 12px !important;
  }
}
@media (max-width: 759px) {
  .account-workspace .portal-profile-form {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .account-workspace .portal-profile-form > label.profile-field, .account-workspace .portal-profile-form > .portal-actions {
    grid-column: 1 !important;
  }
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs {
  display: flex !important;
  align-items: stretch !important;
  gap: 26px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  border: 0 !important;
  border-bottom: 1px solid #dbe3ef !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  scrollbar-width: thin !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  min-height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 1px !important;
  appearance: none !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: color .16s ease, border-color .16s ease !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab::after {
  content: none !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab:hover {
  border-bottom-color: #c7d2fe !important;
  background: transparent !important;
  color: #3730a3 !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab[aria-selected="true"], .app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab.active {
  border-bottom-color: #4f46e5 !important;
  background: transparent !important;
  color: #4338ca !important;
  font-weight: 800 !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs > button[role="tab"].guide-code-tab:focus-visible {
  z-index: 1 !important;
  outline: 2px solid #6366f1 !important;
  outline-offset: -3px !important;
  border-radius: 4px !important;
}
@media (max-width: 720px) {
  .app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > [role="tablist"].guide-code-tabs {
    gap: 20px !important;
    padding: 0 12px !important;
  }
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > .guide-code-tabs[role="tablist"] {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: max-content !important;
  align-items: end !important;
  justify-content: start !important;
  gap: 24px !important;
  min-width: 0 !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  border: 0 !important;
  border-bottom: 1px solid #dbe3ef !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  scrollbar-width: thin !important;
  scroll-snap-type: x proximity !important;
  -webkit-overflow-scrolling: touch !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > .guide-code-tabs[role="tablist"] > .guide-code-tab[role="tab"] {
  all: unset !important;
  box-sizing: border-box !important;
  position: relative !important;
  display: inline-flex !important;
  min-height: 50px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 2px 0 0 !important;
  border-bottom: 3px solid transparent !important;
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-indent: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  scroll-snap-align: start !important;
  transition: color .16s ease, border-color .16s ease !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .guide-code-tab > .guide-code-tab-label {
  display: inline !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  font: inherit !important;
  letter-spacing: inherit !important;
  text-transform: none !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .guide-code-tab[role="tab"]:hover {
  border-bottom-color: #c7d2fe !important;
  color: #3730a3 !important;
  -webkit-text-fill-color: #3730a3 !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .guide-code-tab[role="tab"].active, .app-body[data-ui-release="68"] .service-instructions-dialog .guide-code-tab[role="tab"][aria-selected="true"] {
  border-bottom-color: #4f46e5 !important;
  color: #4338ca !important;
  -webkit-text-fill-color: #4338ca !important;
  font-weight: 850 !important;
}
.app-body[data-ui-release="68"] .service-instructions-dialog .guide-code-tab[role="tab"]:focus-visible {
  outline: 2px solid #6366f1 !important;
  outline-offset: -4px !important;
  border-radius: 4px 4px 0 0 !important;
}
.service-instructions-dialog .code-example-context {
  display: flex !important;
  min-width: 0 !important;
  align-items: center !important;
  gap: 10px !important;
}
.service-instructions-dialog [data-api-example-key-context] {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: #94a3b8 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.service-instructions-dialog .endpoint-guide, .service-instructions-dialog .endpoint-guide-head, .service-instructions-dialog .endpoint-guide-head > div {
  min-width: 0 !important;
}
.service-instructions-dialog .endpoint-guide-head code {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
.service-instructions-dialog .example-key-picker.has-selected-key:not(.has-full-secret) .example-secret-field input {
  border-color: #a5b4fc !important;
  background: #fff !important;
}
.service-instructions-dialog .example-key-picker.has-full-secret .example-secret-field input {
  border-color: #6ee7b7 !important;
  background: #f0fdf4 !important;
}
@media (max-width: 720px) {
  .app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > .guide-code-tabs[role="tablist"] {
    gap: 20px !important;
    min-height: 48px !important;
    padding: 0 14px !important;
  }
  .app-body[data-ui-release="68"] .service-instructions-dialog .docs-examples > .guide-code-tabs[role="tablist"] > .guide-code-tab[role="tab"] {
    min-height: 48px !important;
    font-size: 14px !important;
  }
  .service-instructions-dialog .code-example-head {
    align-items: flex-start !important;
  }
  .service-instructions-dialog .code-example-context {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 3px !important;
  }
  .service-instructions-dialog [data-api-example-key-context] {
    max-width: 62vw !important;
  }
}
body .docs-subsection {
  margin-top: 32px;
  padding: clamp(20px, 3vw, 30px);
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(15, 23, 42, .06);
  scroll-margin-top: 92px;
}
body .docs-subsection > h3 {
  margin: 4px 0 12px;
  font-size: clamp(1.3rem, 2vw, 1.7rem);
}
body .docs-subsection > h4 {
  margin: 24px 0 10px;
  font-size: 1.05rem;
}
body .docs-section-kicker {
  color: #4f46e5;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body .docs-map-guide-tabs {
  display: flex;
  gap: 6px;
  margin: 22px 0 0;
  padding: 5px;
  overflow-x: auto;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
  scrollbar-width: thin;
}
body .docs-map-guide-tabs a {
  flex: 0 0 auto;
  padding: 9px 13px;
  border-radius: 9px;
  color: #475569;
  font-size: .83rem;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}
body .docs-map-guide-tabs a:hover, body .docs-map-guide-tabs a:focus-visible {
  background: #fff;
  color: #4338ca;
  outline: 2px solid #c7d2fe;
  outline-offset: 1px;
}
body .docs-steps {
  display: grid;
  gap: 10px;
  margin: 18px 0 22px;
  padding: 0;
  counter-reset: docs-step;
  list-style: none;
}
body .docs-steps li {
  position: relative;
  min-height: 42px;
  padding: 4px 0 4px 48px;
  color: #475569;
  line-height: 1.65;
}
body .docs-steps li::before {
  counter-increment: docs-step;
  content: counter(docs-step);
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 10px;
  background: #eef2ff;
  color: #4338ca;
  font-weight: 850;
}
body .docs-option-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
body .docs-option-grid article {
  display: grid;
  gap: 5px;
  padding: 15px;
  border: 1px solid #e2e8f0;
  border-radius: 13px;
  background: #f8fafc;
}
body .docs-option-grid strong {
  color: #0f172a;
  font-size: .9rem;
}
body .docs-option-grid span {
  color: #64748b;
  font-size: .82rem;
  line-height: 1.55;
}
body .docs-service-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0 20px;
}
body .docs-service-facts span {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  padding: 7px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: .75rem;
}
body .docs-service-facts strong {
  color: #334155;
}
body .docs-endpoint-stack {
  display: grid;
  gap: 12px;
}
body details.docs-endpoint-guide {
  margin: 0;
  overflow: clip;
  border: 1px solid #dbe3ef;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(15, 23, 42, .04);
}
body details.docs-endpoint-guide[open] {
  border-color: #c7d2fe;
  box-shadow: 0 12px 30px rgba(79, 70, 229, .08);
}
body .docs-endpoint-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 15px 16px;
  cursor: pointer;
  list-style: none;
  background: #fff;
}
body .docs-endpoint-summary::-webkit-details-marker {
  display: none;
}
body .docs-endpoint-summary:hover {
  background: #f8fafc;
}
body .docs-endpoint-summary:focus-visible {
  outline: 3px solid #c7d2fe;
  outline-offset: -3px;
}
body .docs-endpoint-summary-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
body .docs-endpoint-summary-copy .docs-path {
  color: #0f172a;
  font-size: .88rem;
  overflow-wrap: anywhere;
}
body .docs-endpoint-summary-copy > span {
  color: #64748b;
  font-size: .79rem;
  line-height: 1.45;
}
body .docs-endpoint-summary-meta {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  color: #64748b;
  font-size: .72rem;
  white-space: nowrap;
}
body .docs-endpoint-summary-meta b {
  color: #4338ca;
}
body .docs-endpoint-summary-meta i {
  display: inline-grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 7px;
  background: #f1f5f9;
  color: #475569;
  font-style: normal;
  transition: transform .18s ease;
}
body details.docs-endpoint-guide[open] .docs-endpoint-summary-meta i {
  transform: rotate(180deg);
}
body .docs-endpoint-details {
  display: grid;
  gap: 18px;
  padding: 20px;
  border-top: 1px solid #e2e8f0;
  background: #fbfdff;
}
body .docs-endpoint-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
body .docs-endpoint-facts span {
  display: grid;
  gap: 4px;
  padding: 11px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 11px;
  background: #fff;
  color: #64748b;
  font-size: .75rem;
}
body .docs-endpoint-facts b {
  color: #334155;
  font-size: .7rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
body .docs-endpoint-block {
  display: grid;
  gap: 10px;
}
body .docs-endpoint-block h4 {
  margin: 0;
  color: #0f172a;
  font-size: .96rem;
}
body .docs-options-table {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
}
body .docs-options-table table {
  min-width: 760px;
}
body .docs-options-table th {
  background: #f8fafc;
  color: #475569;
  font-size: .68rem;
  letter-spacing: .05em;
  text-transform: uppercase;
}
body .docs-options-table td {
  vertical-align: top;
  color: #475569;
  font-size: .78rem;
}
body .docs-options-table td:nth-child(1) code {
  color: #4338ca;
  font-weight: 750;
}
body .docs-options-table td:nth-child(2) {
  display: grid;
  gap: 5px;
}
body .docs-options-table td:nth-child(4) {
  display: grid;
  gap: 6px;
  min-width: 300px;
}
body .docs-options-table td small {
  display: block;
  color: #64748b;
  line-height: 1.5;
}
body .docs-type-badge {
  width: fit-content;
  padding: 3px 7px;
  border-radius: 7px;
  background: #eef2ff;
  color: #4338ca;
  font-size: .68rem;
  font-weight: 800;
}
body .docs-required {
  color: #b42318;
}
body .docs-no-options {
  display: flex;
  gap: 8px;
  align-items: baseline;
  padding: 13px 14px;
  border: 1px dashed #cbd5e1;
  border-radius: 11px;
  background: #fff;
  color: #64748b;
  font-size: .8rem;
}
body .docs-no-options strong {
  color: #334155;
}
body .docs-response-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
body .docs-response-fields code {
  padding: 5px 8px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #fff;
  color: #334155;
  font-size: .72rem;
}
body .docs-endpoint-code-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
}
body .docs-endpoint-code-heading p {
  margin: 3px 0 0;
  color: #64748b;
  font-size: .77rem;
}
body .docs-endpoint-code-heading a {
  color: #4338ca;
  font-size: .78rem;
  font-weight: 750;
  text-decoration: none;
}
body .docs-endpoint-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  padding-top: 2px;
  color: #94a3b8;
  font-size: .68rem;
}
body .docs-endpoint-footer a {
  color: #4f46e5;
  font-weight: 700;
  text-decoration: none;
}
body .docs-endpoint-footer span {
  margin-left: auto;
  font-family: var(--font-mono);
}
body button.docs-example-tab[role="tab"] {
  appearance: none !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 10px 12px 9px !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #64748b !important;
  font: inherit !important;
  font-size: .78rem !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}
body button.docs-example-tab[role="tab"]:hover {
  color: #3730a3 !important;
  background: #f8fafc !important;
}
body button.docs-example-tab[role="tab"].active, body button.docs-example-tab[role="tab"][aria-selected="true"] {
  border-bottom-color: #4f46e5 !important;
  color: #4338ca !important;
  background: #eef2ff !important;
}
body button.docs-example-tab[role="tab"]:focus-visible {
  outline: 2px solid #818cf8 !important;
  outline-offset: -2px !important;
}
body .docs-examples > .docs-example-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  margin: 0;
  overflow-x: auto;
  border: 1px solid #dbe3ef;
  border-bottom: 0;
  border-radius: 12px 12px 0 0;
  background: #fff;
  scrollbar-width: thin;
}
body .docs-examples > .docs-example-tabs + .docs-code-wrap {
  border-radius: 0 0 12px 12px !important;
}
@media (max-width: 980px) {
  body .docs-endpoint-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  body .docs-option-grid {
    grid-template-columns: 1fr;
  }
  body .docs-subsection {
    padding: 18px;
    border-radius: 16px;
  }
  body .docs-endpoint-summary {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
  }
  body .docs-endpoint-summary-meta {
    grid-column: 2;
    justify-content: flex-start;
  }
  body .docs-endpoint-details {
    padding: 15px;
  }
  body .docs-endpoint-facts {
    grid-template-columns: 1fr;
  }
  body .docs-endpoint-code-heading {
    align-items: start;
    flex-direction: column;
  }
  body .docs-endpoint-footer span {
    width: 100%;
    margin-left: 0;
    overflow-wrap: anywhere;
  }
  body .docs-no-options {
    align-items: flex-start;
    flex-direction: column;
  }
}
.app-body .workspace-dialog-header > div, .account-workspace .workspace-dialog-header > div {
  min-width: 0;
}
.app-body .workspace-dialog-header h3, .account-workspace .workspace-dialog-header h3 {
  text-align: left !important;
}
.workspace-dialog-header .eyebrow {
  display: inline-flex;
  margin-bottom: 7px;
  color: #4f46e5;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.workspace-dialog-header .danger-text {
  color: #b42318 !important;
}
.app-body .public-keys-table th:last-child, .app-body .public-keys-table td.map-actions-cell {
  width: 306px !important;
  min-width: 306px !important;
}
.app-body .map-key-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(82px, 1fr)) !important;
  gap: 8px !important;
  width: 100%;
}
.app-body .map-key-actions > button {
  width: 100% !important;
  min-width: 0 !important;
  padding: 9px 12px !important;
  border-radius: 10px !important;
}
.app-body .map-key-actions > button.danger-soft {
  border: 1px solid #fecaca !important;
  background: #fff !important;
  color: #b42318 !important;
  box-shadow: 0 1px 2px rgba(15,23,42,.05) !important;
}
.app-body .map-key-actions > button.danger-soft:hover {
  border-color: #fca5a5 !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
}
dialog.map-view-dialog {
  width: min(1040px, calc(100vw - 32px)) !important;
}
dialog.map-view-dialog .workspace-dialog-shell {
  max-height: min(92dvh, 940px) !important;
}
.map-key-preview {
  display: grid !important;
  gap: 24px !important;
}
.map-preview-section, .map-embed-instructions {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.map-embed-instructions {
  padding-top: 22px;
  border-top: 1px solid #e2e8f0;
}
.map-dialog-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.map-dialog-section-heading > div {
  min-width: 0;
}
.map-dialog-section-heading h4 {
  margin: 0 0 4px;
  color: #0f172a;
  font-size: 1rem;
  font-weight: 800;
}
.map-dialog-section-heading p {
  margin: 0;
  color: #64748b;
  font-size: .84rem;
  line-height: 1.5;
}
.workspace-dialog .map-key-preview-frame {
  margin: 0 !important;
  min-height: 320px;
  border-color: #cbd5e1 !important;
  background: #eef2f7 !important;
}
.workspace-dialog .map-key-preview-frame iframe {
  min-height: 360px;
  background: #eef2f7;
}
.map-origin-note {
  margin: 0 !important;
  padding: 14px 16px !important;
  border-left: 4px solid #6366f1 !important;
  border-radius: 0 12px 12px 0 !important;
  background: #eef2ff !important;
  color: #312e81 !important;
}
.map-origin-note p {
  margin: 5px 0 0;
  line-height: 1.55;
}
.map-embed-code {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #1e293b;
  border-radius: 13px;
  background: #020617;
  color: #e2e8f0;
}
.map-embed-code-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid #334155;
  background: #0f172a;
}
.map-embed-code-head span {
  color: #cbd5e1;
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .08em;
}
.map-embed-code-head button {
  width: auto !important;
  min-width: 74px !important;
}
.map-embed-code pre {
  max-height: 210px;
  margin: 0;
  padding: 16px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: #e2e8f0;
  font-size: .78rem;
  line-height: 1.65;
}
.map-embed-meta-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(240px, .8fr);
  gap: 16px;
  align-items: start;
}
.map-embed-meta-grid > label, .map-embed-meta-grid > div {
  display: grid;
  gap: 7px;
  min-width: 0;
  color: #334155;
  font-size: .78rem;
  font-weight: 750;
}
.map-embed-meta-grid .copybox {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 7px 8px 7px 12px;
  border: 1px solid #dbe3ef;
  border-radius: 11px;
  background: #f8fafc;
}
.map-embed-meta-grid .copybox code {
  min-width: 0;
  overflow: hidden;
  color: #4338ca;
  font-size: .72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.map-origin-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.map-destructive-form {
  display: grid !important;
  gap: 16px !important;
}
dialog.map-delete-dialog {
  width: min(600px, calc(100vw - 32px)) !important;
}
.workspace-dialog-actions .btn.danger, .admin-map-credential-actions .btn.danger {
  border: 1px solid #dc2626 !important;
  background: #dc2626 !important;
  color: #fff !important;
}
.workspace-dialog-actions .btn.danger:hover, .admin-map-credential-actions .btn.danger:hover {
  background: #b91c1c !important;
}
.admin-map-credential-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
}
.admin-map-credential-actions form {
  margin: 0 !important;
}
dialog.credential-dialog {
  width: min(1120px, calc(100vw - 32px)) !important;
  max-width: 1120px !important;
  height: min(88dvh, 860px) !important;
}
.credential-dialog-form {
  min-height: 0 !important;
}
.credential-dialog-body {
  grid-template-columns: minmax(0, 1.75fr) minmax(300px, .75fr) !important;
  gap: 22px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.credential-access-section {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  gap: 14px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.credential-access-section > h4 {
  margin: 0 !important;
}
.credential-access-section .service-checkbox-fieldset {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
}
.credential-dialog .service-checkbox-fieldset > p {
  margin: 5px 0 10px !important;
}
.credential-dialog .service-checkbox-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  padding: 3px 6px 8px 3px !important;
}
.credential-dialog .service-checkbox-option {
  min-height: 60px !important;
  padding: 10px 12px !important;
}
.credential-access-section > .field {
  padding-top: 13px;
  border-top: 1px solid #e2e8f0;
}
.credential-access-section textarea {
  min-height: 112px !important;
  max-height: 180px !important;
}
.credential-dialog-side {
  min-height: 0 !important;
  overflow: auto !important;
  padding-right: 3px;
}
.credential-dialog-section {
  padding: 16px !important;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
}
.credential-dialog-section h4 {
  margin: 0 0 12px !important;
  color: #0f172a;
}
.credential-danger-note {
  border-color: #fecaca !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
}
.credential-dialog-actions {
  position: relative;
  z-index: 2;
  min-height: 72px;
  box-shadow: 0 -8px 24px rgba(15,23,42,.04);
}
@media (max-width: 980px) {
  .app-body .public-keys-table th:last-child, .app-body .public-keys-table td.map-actions-cell {
    width: 280px !important;
    min-width: 280px !important;
  }
  .map-embed-meta-grid {
    grid-template-columns: 1fr;
  }
  .credential-dialog-body {
    grid-template-columns: 1fr !important;
    overflow: auto !important;
  }
  .credential-access-section {
    overflow: visible !important;
  }
  .credential-access-section .service-checkbox-fieldset {
    min-height: 420px !important;
  }
  .credential-dialog-side {
    overflow: visible !important;
    border-left: 0 !important;
    border-top: 1px solid #e2e8f0 !important;
    padding: 20px 0 0 !important;
  }
}
@media (max-width: 640px) {
  dialog.map-view-dialog {
    width: calc(100vw - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    border-radius: 14px !important;
  }
  .workspace-dialog-header {
    padding: 18px !important;
  }
  .workspace-dialog-body {
    padding: 18px !important;
  }
  .workspace-dialog-actions {
    padding: 13px 18px 16px !important;
  }
  .map-dialog-section-heading {
    flex-direction: column;
  }
  .map-dialog-section-heading :where(a,button) {
    width: 100% !important;
  }
  .workspace-dialog .map-key-preview-frame, .workspace-dialog .map-key-preview-frame iframe {
    min-height: 260px;
    height: 260px;
  }
  .map-embed-code pre {
    max-height: 260px;
    font-size: .72rem;
  }
  .credential-dialog .service-checkbox-grid {
    grid-template-columns: 1fr !important;
  }
}
form.workspace-dialog-shell, .workspace-dialog-shell {
  grid-template-columns: minmax(0, 1fr) !important;
  writing-mode: horizontal-tb !important;
}
.workspace-dialog-shell > :where(.workspace-dialog-header, .workspace-dialog-body, .workspace-dialog-actions) {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
  writing-mode: horizontal-tb !important;
  word-break: normal !important;
  overflow-wrap: normal;
}
dialog.map-rotate-dialog, dialog.map-delete-dialog {
  width: min(620px, calc(100vw - 32px)) !important;
  min-width: min(460px, calc(100vw - 32px));
}
.map-destructive-form {
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: start;
}
.map-destructive-form > * {
  grid-column: 1 !important;
  min-width: 0 !important;
}
.map-destructive-form .notice {
  text-align: left !important;
}
.map-destructive-form label {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  width: 100% !important;
  max-width: none !important;
  writing-mode: horizontal-tb !important;
}
.map-destructive-form label input {
  width: 100% !important;
  min-width: 0 !important;
}
.app-body[data-admin-page="stats"] .analytics-commandbar {
  display: flex !important;
  flex-direction: row !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 18px !important;
  min-height: 0 !important;
  padding: 16px 18px !important;
}
.app-body[data-admin-page="stats"] .analytics-quick-filters {
  display: grid !important;
  grid-template-columns: minmax(190px, 250px) auto auto auto !important;
  align-items: end !important;
  gap: 10px !important;
  width: auto !important;
  margin: 0 !important;
}
.app-body[data-admin-page="stats"] .analytics-quick-filters > * {
  min-width: 0;
  margin: 0 !important;
}
.app-body[data-admin-page="stats"] .analytics-date-select {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 6px !important;
}
.app-body[data-admin-page="stats"] .analytics-date-select select {
  width: 100% !important;
  min-width: 0 !important;
  height: 42px !important;
}
.app-body[data-admin-page="stats"] .analytics-quick-filters :where(button, .btn) {
  width: auto !important;
  min-width: 92px !important;
  min-height: 42px !important;
  white-space: nowrap;
}
.app-body[data-admin-page="stats"] .analytics-commandbar > p {
  align-self: center;
  max-width: 44ch;
  text-align: right;
  line-height: 1.5;
}
.app-body[data-admin-page="stats"] .analytics-chart-tabs {
  display: inline-flex !important;
  gap: 2px !important;
  padding: 3px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
}
.app-body[data-admin-page="stats"] .analytics-chart-tabs button {
  width: auto !important;
  min-width: 0 !important;
  min-height: 34px !important;
  padding: 7px 12px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #64748b !important;
  box-shadow: none !important;
  font-size: .76rem !important;
  font-weight: 750 !important;
}
.app-body[data-admin-page="stats"] .analytics-chart-tabs button:hover {
  background: #eef2ff !important;
  color: #4338ca !important;
}
.app-body[data-admin-page="stats"] .analytics-chart-tabs button.active, .app-body[data-admin-page="stats"] .analytics-chart-tabs button[aria-selected="true"] {
  background: #fff !important;
  color: #4338ca !important;
  box-shadow: 0 1px 3px rgba(15,23,42,.12) !important;
}
@media (max-width: 860px) {
  .app-body[data-admin-page="stats"] .analytics-commandbar {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  .app-body[data-admin-page="stats"] .analytics-quick-filters {
    grid-template-columns: minmax(0, 1fr) repeat(3, auto) !important;
    width: 100% !important;
  }
  .app-body[data-admin-page="stats"] .analytics-commandbar > p {
    max-width: none;
    text-align: left;
  }
}
@media (max-width: 640px) {
  dialog.map-rotate-dialog, dialog.map-delete-dialog {
    width: calc(100vw - 12px) !important;
    min-width: 0 !important;
  }
  .app-body[data-admin-page="stats"] .analytics-quick-filters {
    grid-template-columns: 1fr 1fr !important;
  }
  .app-body[data-admin-page="stats"] .analytics-date-select {
    grid-column: 1 / -1 !important;
  }
  .app-body[data-admin-page="stats"] .analytics-quick-filters :where(button, .btn) {
    width: 100% !important;
  }
}
.workspace-dialog-header > div, .map-dialog-section-heading > div {
  min-width: 0 !important;
  text-align: left !important;
}
.map-dialog-section-heading :where(h4, p), .workspace-dialog-header :where(h3, p, .eyebrow) {
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog {
  width: min(620px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: 620px !important;
  max-height: min(88dvh, 760px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #0f172a !important;
  box-shadow: 0 28px 90px rgba(15, 23, 42, .32) !important;
}
body.app-body dialog.map-lifecycle-dialog :where(*) {
  box-sizing: border-box;
  writing-mode: horizontal-tb !important;
  word-break: normal !important;
  overflow-wrap: normal;
}
body.app-body dialog.map-lifecycle-dialog > form.map-lifecycle-shell {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  max-height: min(88dvh, 760px) !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-header {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 20px !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 22px 24px 18px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-heading {
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-heading h3 {
  width: auto !important;
  margin: 0 0 5px !important;
  color: #0f172a !important;
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-heading p {
  width: auto !important;
  margin: 0 !important;
  color: #64748b !important;
  font-size: .86rem !important;
  line-height: 1.45 !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-eyebrow {
  display: inline-flex !important;
  width: auto !important;
  margin: 0 0 8px !important;
  padding: 5px 9px !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 999px !important;
  background: #eef2ff !important;
  color: #4338ca !important;
  font-size: .66rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-eyebrow-danger {
  border-color: #fecaca !important;
  background: #fef2f2 !important;
  color: #b42318 !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-close {
  display: inline-grid !important;
  flex: 0 0 40px !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 11px !important;
  background: #fff !important;
  color: #475569 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06) !important;
  font-size: 1.45rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-close:hover {
  border-color: #a5b4fc !important;
  background: #f8fafc !important;
  color: #0f172a !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-body {
  display: grid !important;
  flex: 1 1 auto !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: start !important;
  gap: 18px !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 22px 24px !important;
  overflow: auto !important;
  background: #fff !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-body > * {
  grid-column: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-notice {
  display: block !important;
  padding: 16px 18px !important;
  border: 1px solid !important;
  border-radius: 13px !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-notice strong {
  display: block !important;
  margin: 0 0 5px !important;
  color: inherit !important;
  font-size: .9rem !important;
  line-height: 1.35 !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-notice p {
  margin: 0 !important;
  color: inherit !important;
  font-size: .84rem !important;
  line-height: 1.55 !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-notice-warning {
  border-color: #fcd34d !important;
  background: #fffbeb !important;
  color: #78350f !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-notice-danger {
  border-color: #fecaca !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #334155 !important;
  font-size: .84rem !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-field > span, body.app-body dialog.map-lifecycle-dialog .map-lifecycle-field > small {
  display: block !important;
  width: 100% !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-field > small {
  color: #64748b !important;
  font-size: .74rem !important;
  font-weight: 500 !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-field :where(input, select, textarea) {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
  font: inherit !important;
  font-weight: 600 !important;
  text-align: left !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-field :where(input, select, textarea):focus {
  border-color: #6366f1 !important;
  outline: 3px solid rgba(99, 102, 241, .18) !important;
  outline-offset: 0 !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-actions {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 16px 24px 20px !important;
  border-top: 1px solid #e2e8f0 !important;
  background: #fff !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-actions :where(button, .btn) {
  display: inline-flex !important;
  width: auto !important;
  min-width: 128px !important;
  max-width: none !important;
  min-height: 42px !important;
  margin: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-actions .btn.danger {
  border-color: #dc2626 !important;
  background: #dc2626 !important;
  color: #fff !important;
}
body.app-body dialog.map-lifecycle-dialog .map-lifecycle-actions .btn.danger:hover {
  border-color: #b91c1c !important;
  background: #b91c1c !important;
}
body.app-body dialog.map-view-dialog > .workspace-dialog-shell {
  height: min(90dvh, 900px) !important;
  max-height: min(90dvh, 900px) !important;
}
body.app-body dialog.map-view-dialog .workspace-dialog-body {
  scrollbar-gutter: stable;
}
@media (max-width: 640px) {
  body.app-body dialog.map-lifecycle-dialog {
    width: calc(100vw - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    border-radius: 14px !important;
  }
  body.app-body dialog.map-lifecycle-dialog > form.map-lifecycle-shell {
    max-height: calc(100dvh - 12px) !important;
  }
  body.app-body dialog.map-lifecycle-dialog .map-lifecycle-header, body.app-body dialog.map-lifecycle-dialog .map-lifecycle-body, body.app-body dialog.map-lifecycle-dialog .map-lifecycle-actions {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  body.app-body dialog.map-lifecycle-dialog .map-lifecycle-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.app-body dialog.map-lifecycle-dialog .map-lifecycle-actions :where(button, .btn) {
    width: 100% !important;
    min-width: 0 !important;
  }
}
.app-logo,.mobile-brand {
  width: max-content;
}
.app-logo .logo-mark,.mobile-brand .logo-mark {
  margin: 0;
}
.auth-brand-mark {
  font-size: 1rem;
}
.activity-metric-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px;
}
.activity-metric {
  min-width: 0;
  padding: 20px;
  border: 1px solid #e4e7ec;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(16,24,40,.05);
}
.activity-metric small {
  display: block;
  color: #667085;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.activity-metric strong {
  display: block;
  margin-top: 8px;
  color: #101828;
  font-size: 30px;
  line-height: 1;
  font-weight: 800;
}
.activity-metric span {
  display: block;
  margin-top: 8px;
  color: #98a2b3;
  font-size: 12px;
}
.activity-grid {
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr);
  gap: 18px;
}
.activity-table td,.activity-table th {
  vertical-align: top;
}
.activity-person {
  display: grid;
  gap: 3px;
}
.activity-person small {
  color: #667085;
}
.activity-event {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.activity-event code {
  font-size: 11px;
}
.activity-empty {
  padding: 24px;
  text-align: center;
  color: #667085;
}
.nav-toggle .nav-icon {
  display: inline-grid;
  place-items: center;
}
.nav-toggle .nav-icon-close {
  display: none;
}
.nav-toggle[aria-expanded="true"] .nav-icon-open {
  display: none;
}
.nav-toggle[aria-expanded="true"] .nav-icon-close {
  display: inline-grid;
}
@media (max-width:1100px) {
  .activity-metric-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .activity-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width:900px) {
  .app-body .top-actions {
    display: none !important;
  }
  .app-body .mobile-bar {
    display: flex !important;
  }
  .app-body .app-sidebar {
    z-index: 80 !important;
    transform: translateX(-105%) !important;
  }
  .app-body .app-sidebar.open {
    transform: translateX(0) !important;
  }
  .app-body .sidebar-backdrop {
    z-index: 70 !important;
    display: none !important;
  }
  .app-body .sidebar-backdrop.open {
    display: block !important;
  }
  .app-body.nav-open {
    overflow: hidden;
    touch-action: none;
  }
  .app-body .nav-toggle {
    display: inline-grid !important;
    color: #344054 !important;
    background: #fff !important;
  }
  .app-body .nav-toggle svg,.app-body .sidebar-close svg {
    display: block;
    width: 21px;
    height: 21px;
    stroke: currentColor !important;
    fill: none !important;
    stroke-width: 2 !important;
  }
  .app-body .mobile-brand {
    gap: 0 !important;
  }
  .app-body.nav-open .nav-toggle {
    position: fixed;
    right: max(12px,env(safe-area-inset-right));
    top: max(10px,env(safe-area-inset-top));
    z-index: 95;
  }
}
@media (min-width:901px) {
  .app-body .mobile-bar {
    display: none !important;
  }
  .app-body .app-sidebar {
    transform: none !important;
  }
  .app-body .sidebar-backdrop {
    display: none !important;
  }
}
@media (max-width:640px) {
  .activity-metric-grid {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .activity-metric {
    padding: 16px;
  }
  .activity-metric strong {
    font-size: 25px;
  }
}
.account-workspace .team-page-stack {
  gap: 24px;
}
.account-workspace .team-editor-grid {
  grid-template-columns: minmax(160px,.8fr) minmax(260px,1.35fr) minmax(170px,.75fr) auto;
  align-items: end;
}
.account-workspace .team-editor-actions {
  grid-column: auto;
  align-self: end;
  justify-content: flex-end;
  margin: 0;
}
.account-workspace .team-editor-actions .portal-button {
  white-space: nowrap;
}
.account-workspace .team-management-table {
  min-width: 760px;
  table-layout: auto;
}
.account-workspace .team-management-table th:last-child,.account-workspace .team-management-table td:last-child {
  text-align: right;
}
.account-workspace .team-email-cell {
  max-width: 300px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.account-workspace .team-email-cell a {
  color: #475467;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.account-workspace .team-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.account-workspace .team-action-form {
  display: inline-flex;
  margin: 0;
}
.account-workspace .team-action-form .portal-button {
  white-space: nowrap;
}
.account-workspace .team-no-action {
  color: #98a2b3;
}
.account-workspace .team-empty-row td {
  text-align: center !important;
  color: #667085;
  padding: 28px 18px;
}
@media (max-width:1180px) {
  .account-workspace .team-editor-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .account-workspace .team-editor-actions {
    grid-column: 1/-1;
    justify-content: flex-start;
  }
}
@media (max-width:720px) {
  .account-workspace .team-editor-grid {
    grid-template-columns: 1fr;
  }
  .account-workspace .team-editor-actions {
    grid-column: 1;
  }
  .account-workspace .team-editor-actions,.account-workspace .team-editor-actions .portal-button {
    width: 100%;
  }
  .account-workspace .team-list-card {
    padding: 20px 16px;
  }
  .account-workspace .team-list-card .portal-card-heading {
    align-items: center;
    gap: 12px;
  }
  .account-workspace .team-list-card .portal-card-heading>div {
    min-width: 0;
    flex: 1;
  }
  .account-workspace .team-list-card .lead {
    font-size: 16px;
    line-height: 1.55;
  }
  .account-workspace .team-table-wrap {
    margin-top: 16px;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .account-workspace .team-management-table {
    display: block;
    width: 100%;
    min-width: 0;
    border-collapse: separate;
  }
  .account-workspace .team-management-table thead {
    display: none;
  }
  .account-workspace .team-management-table tbody {
    display: grid;
    gap: 14px;
    width: 100%;
  }
  .account-workspace .team-management-table tr {
    display: grid;
    width: 100%;
    padding: 16px;
    border: 1px solid #dce2ec;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
  }
  .account-workspace .team-management-table td {
    display: grid;
    grid-template-columns: minmax(96px,.42fr) minmax(0,1fr);
    gap: 12px;
    align-items: start;
    width: 100%;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid #edf0f5;
    text-align: left !important;
    min-width: 0;
  }
  .account-workspace .team-management-table td:last-child {
    border-bottom: 0;
    padding-bottom: 0;
  }
  .account-workspace .team-management-table td:first-child {
    padding-top: 0;
  }
  .account-workspace .team-management-table td::before {
    content: attr(data-label);
    color: #667085;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    line-height: 1.5;
  }
  .account-workspace .team-management-table td>* {
    min-width: 0;
  }
  .account-workspace .team-email-cell {
    max-width: none;
  }
  .account-workspace .team-email-cell a {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .account-workspace .team-actions-cell {
    display: block !important;
  }
  .account-workspace .team-actions-cell::before {
    display: block;
    margin-bottom: 10px;
  }
  .account-workspace .team-row-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
  }
  .account-workspace .team-action-form {
    display: flex;
    width: 100%;
  }
  .account-workspace .team-action-form .portal-button {
    width: 100%;
    min-height: 44px;
    font-size: 14px;
  }
  .account-workspace .team-empty-row {
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .account-workspace .team-empty-row td {
    display: block !important;
    padding: 22px 16px !important;
    border: 1px dashed #dce2ec !important;
    border-radius: 14px;
    text-align: center !important;
  }
  .account-workspace .team-empty-row td::before {
    display: none;
  }
}
@media (min-width:1181px) {
  .account-workspace .portal-profile-form {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
  .account-workspace .portal-profile-form>label.profile-field-name, .account-workspace .portal-profile-form>label.profile-field-email, .account-workspace .portal-profile-form>label.profile-field-password {
    grid-column: span 1 !important;
  }
  .account-workspace .business-profile-card .business-details-grid {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
}
@layer actoki-fixes {
  .actoki-logo-image {
    display: block;
    width: 40px;
    height: 40px;
    max-width: none;
    object-fit: contain;
    flex: 0 0 auto;
  }
  .auth-body .auth-brand-mark {
    display: inline-flex !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    overflow: visible !important;
  }
  .auth-body .auth-brand-mark::before,.auth-body .auth-brand-mark::after {
    display: none !important;
    content: none !important;
  }
  .auth-body .auth-brand-mark .actoki-logo-image {
    width: 44px !important;
    height: 44px !important;
  }
  body.app-body[data-ui-release="68"][data-ui-shell="92"] .app-logo,body.app-body[data-ui-release="68"][data-ui-shell="92"] .mobile-brand {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    width: auto !important;
    min-width: 40px !important;
    text-decoration: none !important;
  }
  body.app-body[data-ui-release="68"][data-ui-shell="92"] .app-logo .actoki-logo-image,body.app-body[data-ui-release="68"][data-ui-shell="92"] .mobile-brand .actoki-logo-image {
    width: 40px !important;
    height: 40px !important;
  }
  body.app-body[data-ui-release="68"][data-ui-shell="92"] .nav-toggle {
    display: none !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #334155 !important;
    -webkit-text-fill-color: #334155 !important;
    box-shadow: 0 4px 14px rgba(15,23,42,.08) !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
  }
  body.app-body[data-ui-release="68"][data-ui-shell="92"] .nav-toggle:hover,body.app-body[data-ui-release="68"][data-ui-shell="92"] .nav-toggle:focus-visible {
    border-color: #818cf8 !important;
    background: #eef2ff !important;
    color: #4338ca !important;
    -webkit-text-fill-color: #4338ca !important;
  }
  body.app-body[data-ui-release="68"][data-ui-shell="92"] .nav-toggle .nav-icon {
    width: 24px !important;
    height: 24px !important;
    align-items: center !important;
    justify-content: center !important;
    color: inherit !important;
  }
  body.app-body[data-ui-release="68"][data-ui-shell="92"] .nav-toggle .nav-icon svg,body.app-body[data-ui-release="68"][data-ui-shell="92"] .sidebar-close svg {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.25 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
  body.app-body[data-ui-release="68"][data-ui-shell="92"] .sidebar-close {
    color: #334155 !important;
    -webkit-text-fill-color: #334155 !important;
  }
  @media (max-width:900px) {
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .mobile-bar {
      display: flex !important;
      position: sticky !important;
      top: 0 !important;
      z-index: 130 !important;
      min-height: 68px !important;
      align-items: center !important;
      justify-content: space-between !important;
      background: rgba(255,255,255,.97) !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .nav-toggle {
      display: inline-grid !important;
      z-index: 110 !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .app-sidebar[data-app-sidebar] {
      position: fixed !important;
      inset: 68px auto 0 0 !important;
      z-index: 110 !important;
      display: flex !important;
      width: min(88vw,320px) !important;
      height: calc(100dvh - 68px) !important;
      max-height: calc(100dvh - 68px) !important;
      transform: translate3d(-110%,0,0) !important;
      visibility: hidden !important;
      pointer-events: none !important;
      overflow: hidden !important;
      background: #fff !important;
      transition: transform .2s ease,visibility 0s linear .2s !important;
      will-change: transform !important;
      translate: 0 0 !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .app-sidebar[data-app-sidebar].open {
      transform: translate3d(0,0,0) !important;
      visibility: visible !important;
      pointer-events: auto !important;
      transition: transform .2s ease,visibility 0s !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .sidebar-backdrop {
      position: fixed !important;
      inset: 0 !important;
      z-index: 100 !important;
      display: none !important;
      background: rgba(15,23,42,.58) !important;
      backdrop-filter: blur(2px) !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .sidebar-backdrop.open {
      display: block !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"].nav-open {
      overflow: hidden !important;
      touch-action: none !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"].nav-open .nav-toggle {
      position: fixed !important;
      right: max(12px,env(safe-area-inset-right)) !important;
      top: max(12px,env(safe-area-inset-top)) !important;
      z-index: 140 !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .sidebar-close,body.app-body[data-ui-release="68"][data-ui-shell="92"] .app-sidebar[data-app-sidebar] .app-logo {
      display: none !important;
    }
  }
  @media (min-width:901px) {
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .app-sidebar[data-app-sidebar] {
      visibility: visible !important;
      pointer-events: auto !important;
    }
    body.app-body[data-ui-release="68"][data-ui-shell="92"] .nav-toggle,body.app-body[data-ui-release="68"][data-ui-shell="92"] .mobile-bar,body.app-body[data-ui-release="68"][data-ui-shell="92"] .sidebar-backdrop {
      display: none !important;
    }
  }
}
@media (max-width:900px) {
  body.app-body[data-ui-release="68"] .app-main {
    position: relative !important;
    z-index: auto !important;
  }
  body.app-body[data-ui-release="68"] .app-main .topbar, body.app-body[data-ui-release="68"] .app-main .portal-content, body.app-body[data-ui-release="68"] .app-main .dashboard-metrics, body.app-body[data-ui-release="68"] .app-main .flash, body.app-body[data-ui-release="68"] .app-main .admin-footer {
    z-index: auto !important;
  }
  body.app-body[data-ui-release="68"] .sidebar-backdrop {
    position: fixed !important;
    inset: 68px 0 0 0 !important;
    z-index: 10010 !important;
    display: none !important;
    background: rgba(15,23,42,.58) !important;
    -webkit-backdrop-filter: blur(2px) !important;
    backdrop-filter: blur(2px) !important;
  }
  body.app-body[data-ui-release="68"] .sidebar-backdrop.open {
    display: block !important;
  }
  body.app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] {
    position: fixed !important;
    inset: 68px auto 0 0 !important;
    z-index: 10020 !important;
    width: min(88vw,360px) !important;
    height: calc(100dvh - 68px) !important;
    max-height: calc(100dvh - 68px) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: #fff !important;
    opacity: 1 !important;
    isolation: isolate !important;
    box-shadow: 18px 0 48px rgba(15,23,42,.18) !important;
    transform: translate3d(-110%,0,0) !important;
    translate: 0 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: transform .2s ease,visibility 0s linear .2s !important;
    will-change: transform !important;
  }
  body.app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar].open {
    transform: translate3d(0,0,0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition: transform .2s ease,visibility 0s !important;
  }
  body.app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .side-nav {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }
  body.app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .sidebar-footer {
    position: relative !important;
    z-index: 1 !important;
    flex: 0 0 auto !important;
    background: #fff !important;
  }
  body.app-body[data-ui-release="68"] .mobile-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 10030 !important;
    isolation: isolate !important;
    min-height: 68px !important;
    background: rgba(255,255,255,.98) !important;
  }
  body.app-body[data-ui-release="68"] .nav-toggle {
    z-index: 10040 !important;
  }
  body.app-body[data-ui-release="68"].nav-open .nav-toggle {
    position: fixed !important;
    right: max(12px,env(safe-area-inset-right)) !important;
    top: max(12px,env(safe-area-inset-top)) !important;
    z-index: 10040 !important;
  }
  body.app-body[data-ui-release="68"].nav-open {
    overflow: hidden !important;
    touch-action: none !important;
  }
  body.app-body[data-ui-release="68"].nav-open .app-main>*:not(.mobile-bar) {
    pointer-events: none !important;
  }
  body.app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .app-logo, body.app-body[data-ui-release="68"] .app-sidebar[data-app-sidebar] .sidebar-close {
    display: none !important;
  }
}
body.dialog-open {
  overflow: hidden !important;
}
.account-workspace dialog.create-key-dialog {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-width: 1180px !important;
  height: min(90dvh, 900px) !important;
  max-height: calc(100dvh - 24px) !important;
}
.account-workspace .create-key-dialog-form {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  height: 100% !important;
  min-height: 0 !important;
}
.account-workspace .create-key-dialog .credential-dialog-header {
  position: relative !important;
  z-index: 4 !important;
  align-items: flex-start !important;
  background: #fff !important;
}
.account-workspace .create-key-dialog .create-key-body {
  display: grid !important;
  grid-template-columns: minmax(320px, .8fr) minmax(0, 1.2fr) !important;
  gap: 24px !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  align-items: start !important;
  padding: 22px 26px !important;
}
.account-workspace .create-key-details {
  display: grid !important;
  align-content: start !important;
  gap: 16px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 2px 5px 8px 2px !important;
}
.account-workspace .create-key-section-heading h4, .account-workspace .create-key-services > legend {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 1rem !important;
  font-weight: 850 !important;
}
.account-workspace .create-key-section-heading p, .account-workspace .create-key-services > p {
  margin: 5px 0 0 !important;
  color: #64748b !important;
  font-size: .84rem !important;
  line-height: 1.5 !important;
}
.account-workspace .create-key-details > .field, .account-workspace .create-key-details > .readonly-summary {
  margin: 0 !important;
}
.account-workspace .create-key-dialog .readonly-summary {
  height: auto !important;
  padding: 13px 14px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 13px !important;
  background: #f8fafc !important;
}
.account-workspace .create-key-password-card {
  display: grid !important;
  gap: 13px !important;
  padding: 15px 16px !important;
  border: 1px solid #dfe1ff !important;
  border-radius: 14px !important;
  background: #f7f7ff !important;
}
.account-workspace .create-key-password-card > div:first-child strong {
  color: #312e81;
}
.account-workspace .create-key-password-card > div:first-child p {
  margin: 4px 0 0 !important;
  color: #64748b !important;
  font-size: .82rem !important;
  line-height: 1.5 !important;
}
.account-workspace .create-key-password-card .field {
  margin: 0 !important;
}
.account-workspace .create-key-services {
  display: grid !important;
  grid-template-rows: auto auto auto auto auto !important;
  align-content: start !important;
  gap: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 0 6px 0 24px !important;
  border: 0 !important;
  border-left: 1px solid #e2e8f0 !important;
}
.account-workspace .create-key-services > p {
  margin-bottom: 11px !important;
}
.account-workspace .service-scope-tools {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
}
.account-workspace .service-scope-search {
  flex: 1 1 auto !important;
  margin: 0 !important;
}
.account-workspace .service-scope-search input {
  min-height: 42px !important;
  width: 100% !important;
  padding: 9px 12px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 11px !important;
  background: #fff !important;
}
.account-workspace .service-scope-count {
  flex: 0 0 auto !important;
  color: #64748b !important;
  font-size: .76rem !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
}
.account-workspace .create-key-services .service-checkbox-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-content: start !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 2px 2px 8px 2px !important;
}
.account-workspace .create-key-services .service-checkbox-option {
  min-height: 58px !important;
  padding: 9px 11px !important;
}
.account-workspace .create-key-services .service-checkbox-option[hidden] {
  display: none !important;
}
.account-workspace .service-scope-note {
  display: flex !important;
  align-items: baseline !important;
  gap: 7px !important;
  margin-top: 10px !important;
  padding: 10px 12px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 11px !important;
  background: #eff6ff !important;
  color: #1e3a8a !important;
  font-size: .78rem !important;
  line-height: 1.45 !important;
}
.account-workspace .create-key-dialog .credential-dialog-footer {
  position: relative !important;
  z-index: 4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  min-height: 70px !important;
  padding: 14px 26px 16px !important;
  border-top: 1px solid #e2e8f0 !important;
  background: #fff !important;
  box-shadow: 0 -8px 24px rgba(15,23,42,.04) !important;
}
.account-workspace .create-key-dialog .credential-dialog-footer .btn {
  width: auto !important;
  min-width: 132px !important;
  margin: 0 !important;
}
dialog.workspace-dialog, dialog.credential-dialog, dialog.service-instructions-dialog {
  max-height: calc(100dvh - 24px) !important;
}
.workspace-dialog-shell, .credential-dialog-form, .instruction-dialog-shell {
  min-height: 0 !important;
}
.workspace-dialog-body, .credential-dialog-body, .instruction-dialog-body {
  min-height: 0 !important;
  overscroll-behavior: contain;
}
@media (max-width: 980px) {
  .account-workspace .create-key-dialog .create-key-body {
    grid-template-columns: 1fr !important;
    overflow: auto !important;
  }
  .account-workspace .create-key-details {
    overflow: visible !important;
    padding-right: 0 !important;
  }
  .account-workspace .create-key-services {
    min-height: 460px !important;
    overflow: visible !important;
    padding: 20px 6px 0 0 !important;
    border-left: 0 !important;
    border-top: 1px solid #e2e8f0 !important;
  }
}
@media (max-width: 640px) {
  .account-workspace dialog.create-key-dialog {
    width: calc(100vw - 10px) !important;
    height: calc(100dvh - 10px) !important;
    max-height: calc(100dvh - 10px) !important;
    border-radius: 14px !important;
  }
  .account-workspace .create-key-dialog .credential-dialog-header {
    padding: 16px 14px 13px !important;
  }
  .account-workspace .create-key-dialog .create-key-body {
    gap: 18px !important;
    padding: 16px 14px !important;
  }
  .account-workspace .create-key-services {
    min-height: 0 !important;
  }
  .account-workspace .create-key-services .service-checkbox-grid {
    grid-template-columns: 1fr !important;
  }
  .account-workspace .service-scope-tools {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  .account-workspace .service-scope-count {
    white-space: normal !important;
  }
  .account-workspace .service-scope-note {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 3px !important;
  }
  .account-workspace .create-key-dialog .credential-dialog-footer {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    padding: 12px 14px 14px !important;
  }
  .account-workspace .create-key-dialog .credential-dialog-footer .btn {
    width: 100% !important;
    min-width: 0 !important;
  }
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-space-y-reverse: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-outline-style: solid;
    }
  }
}


/* UI103.8 — create-server-key modal: the native dialog is the single scroll owner.
   This deliberately overrides earlier credential-dialog overflow rules. Keeping the
   scroll on <dialog> itself avoids nested grid/fieldset sizing traps in Chromium. */
.account-workspace dialog.create-key-dialog {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
}
.account-workspace dialog.create-key-dialog .create-key-dialog-form {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  min-height: 100% !important;
  overflow: visible !important;
}
.account-workspace dialog.create-key-dialog .credential-dialog-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  flex: 0 0 auto !important;
  background: #fff !important;
  box-shadow: 0 1px 0 #e2e8f0 !important;
}
.account-workspace dialog.create-key-dialog .create-key-body {
  flex: 0 0 auto !important;
  min-height: auto !important;
  overflow: visible !important;
  overscroll-behavior: auto !important;
}
.account-workspace dialog.create-key-dialog .create-key-details,
.account-workspace dialog.create-key-dialog .create-key-services,
.account-workspace dialog.create-key-dialog .service-checkbox-grid {
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}
.account-workspace dialog.create-key-dialog .credential-dialog-footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 20 !important;
  flex: 0 0 auto !important;
  background: #fff !important;
  box-shadow: 0 -1px 0 #e2e8f0, 0 -8px 24px rgba(15,23,42,.06) !important;
}


/* UI103.9 — Chromium create-server-key scroll fix.
   IMPORTANT: these declarations must live in the existing actoki-fixes cascade
   layer. Earlier layered !important declarations outrank unlayered !important
   declarations, which is why the UI103.8 override looked correct in source but
   computed as overflow:hidden in Chromium. */
@layer actoki-fixes {
  .account-workspace dialog.create-key-dialog {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-dialog-form {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 100% !important;
    overflow: visible !important;
  }
  .account-workspace dialog.create-key-dialog .credential-dialog-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 20 !important;
    flex: 0 0 auto !important;
    background: #fff !important;
    box-shadow: 0 1px 0 #e2e8f0 !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-body {
    display: grid !important;
    flex: 0 0 auto !important;
    min-height: auto !important;
    height: auto !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-details,
  .account-workspace dialog.create-key-dialog .create-key-services,
  .account-workspace dialog.create-key-dialog .service-checkbox-grid {
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }
  .account-workspace dialog.create-key-dialog .credential-dialog-footer {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 20 !important;
    flex: 0 0 auto !important;
    background: #fff !important;
    box-shadow: 0 -1px 0 #e2e8f0, 0 -8px 24px rgba(15,23,42,.06) !important;
  }
}


/* UI103.10 — Create server key: stable three-row dialog with one body scroller.
   Header and footer are fixed grid rows; only the middle body scrolls. This avoids
   sticky-header overlap and native-dialog scroll/cascade quirks in Chromium. */
@layer actoki-fixes {
  .account-workspace dialog.create-key-dialog {
    width: min(1120px, calc(100vw - 32px)) !important;
    max-width: 1120px !important;
    height: min(88dvh, 860px) !important;
    max-height: calc(100dvh - 24px) !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-dialog-form {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  .account-workspace dialog.create-key-dialog .credential-dialog-header {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    z-index: auto !important;
    padding: 20px 26px 16px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-body {
    display: grid !important;
    grid-template-columns: minmax(320px, .86fr) minmax(0, 1.14fr) !important;
    align-items: start !important;
    gap: 24px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    box-sizing: border-box !important;
    padding: 20px 26px 24px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-details,
  .account-workspace dialog.create-key-dialog .create-key-services,
  .account-workspace dialog.create-key-dialog .service-checkbox-grid {
    position: static !important;
    inset: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .account-workspace dialog.create-key-dialog .create-key-details {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-services {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-services {
    display: block !important;
    padding: 0 0 0 24px !important;
    border: 0 !important;
    border-left: 1px solid #e2e8f0 !important;
  }
  .account-workspace dialog.create-key-dialog .create-key-services > legend,
  .account-workspace dialog.create-key-dialog .create-key-services > p,
  .account-workspace dialog.create-key-dialog .create-key-services > .service-scope-tools {
    position: static !important;
    inset: auto !important;
    background: transparent !important;
  }
  .account-workspace dialog.create-key-dialog .service-scope-tools {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px 10px !important;
    margin: 12px 0 !important;
  }
  .account-workspace dialog.create-key-dialog .service-scope-count {
    grid-column: 1 / -1 !important;
    white-space: normal !important;
  }
  .account-workspace dialog.create-key-dialog .service-scope-toggle-all {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 9px 13px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 11px !important;
    background: #fff !important;
    color: #344054 !important;
    font: inherit !important;
    font-size: .82rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
  }
  .account-workspace dialog.create-key-dialog .service-scope-toggle-all:hover {
    border-color: #8b83ff !important;
    background: #f8f7ff !important;
    color: #4338ca !important;
  }
  .account-workspace dialog.create-key-dialog .service-scope-toggle-all:focus-visible {
    outline: 3px solid rgba(79,70,229,.22) !important;
    outline-offset: 2px !important;
  }
  .account-workspace dialog.create-key-dialog .service-checkbox-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    padding: 0 !important;
  }
  .account-workspace dialog.create-key-dialog .credential-dialog-footer {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    z-index: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    min-height: 70px !important;
    padding: 14px 26px 16px !important;
    border-top: 1px solid #e2e8f0 !important;
    background: #fff !important;
    box-shadow: 0 -8px 24px rgba(15,23,42,.04) !important;
  }
  @media (max-width: 860px) {
    .account-workspace dialog.create-key-dialog {
      width: calc(100vw - 14px) !important;
      height: calc(100dvh - 14px) !important;
      max-height: calc(100dvh - 14px) !important;
    }
    .account-workspace dialog.create-key-dialog .create-key-body {
      grid-template-columns: 1fr !important;
      gap: 20px !important;
      padding: 18px !important;
    }
    .account-workspace dialog.create-key-dialog .create-key-details {
      grid-column: 1 !important;
      grid-row: 1 !important;
    }
    .account-workspace dialog.create-key-dialog .create-key-services {
      grid-column: 1 !important;
      grid-row: 2 !important;
      padding: 20px 0 0 !important;
      border-left: 0 !important;
      border-top: 1px solid #e2e8f0 !important;
    }
  }
  @media (max-width: 560px) {
    .account-workspace dialog.create-key-dialog .credential-dialog-header,
    .account-workspace dialog.create-key-dialog .credential-dialog-footer {
      padding-left: 14px !important;
      padding-right: 14px !important;
    }
    .account-workspace dialog.create-key-dialog .create-key-body { padding: 14px !important; }
    .account-workspace dialog.create-key-dialog .service-checkbox-grid { grid-template-columns: 1fr !important; }
    .account-workspace dialog.create-key-dialog .service-scope-tools { grid-template-columns: 1fr !important; }
    .account-workspace dialog.create-key-dialog .service-scope-toggle-all { width: 100% !important; }
    .account-workspace dialog.create-key-dialog .credential-dialog-footer {
      display: grid !important;
      grid-template-columns: 1fr 1fr !important;
    }
    .account-workspace dialog.create-key-dialog .credential-dialog-footer .btn {
      width: 100% !important;
      min-width: 0 !important;
    }
  }
}
