@charset "UTF-8";
:root {
  interpolate-size: allow-keywords;
  color-scheme: light;
  --ui-bg: #f7f8f6;
  --ui-surface: #ffffff;
  --ui-ink: #1f2937;
  --ui-muted: #5c6b80;
  --ui-border: #e7e9e4;
  --ui-accent: #14a38b;
  --ui-accent-strong: #0f8a75;
  --ui-accent-soft: #e7f5f1;
  --ui-success: #16a34a;
  --ui-danger: #dc2626;
  --ui-warning: #d97706;
  --ui-info: #14a38b;
  --ui-subtle: #eef7f4;
  --ui-head-bg: #14a38b;
  --ui-head-ink: #ffffff;
  --ui-head-soft: #d5f0ea;
  --ui-head-bar-h: calc(var(--ui-control-lg) + var(--ui-space-2) * 2);
  --ui-head-crumb-h: 1.75rem;
  --ui-status-cyan: #33C1D7;
  --ui-status-green: #46C563;
  --ui-status-orange: #E8923A;
  --ui-status-yellow: #F1C543;
  --ui-status-red: #D96772;
  --ui-status-purple: #A77BD4;
  --ui-status-disabled: #aaa;
  --ui-status-disabled-deep: #888888;
  --ui-rating: #e0bb55;
  --ui-rating-track: #eceee9;
  --ui-star: 0.875rem;
  --ui-star-lg: 1.5rem;
  --ui-accent-subtle: #e3f4f1;
  --ui-accent-edge: #88cabc;
  --ui-accent-emphasis: #168879;
  --ui-accent-veil: rgba(20, 163, 139, 0.12);
  --ui-accent-deep: #10826f;
  --ui-success-subtle: #e3f4e9;
  --ui-success-edge: #89ca9f;
  --ui-success-emphasis: #188846;
  --ui-success-veil: rgba(22, 163, 74, 0.12);
  --ui-success-deep: #12823b;
  --ui-danger-subtle: #fbe5e5;
  --ui-danger-edge: #e2918f;
  --ui-danger-emphasis: #b2272a;
  --ui-danger-veil: rgba(220, 38, 38, 0.12);
  --ui-danger-deep: #b01e1e;
  --ui-warning-subtle: #faefe1;
  --ui-warning-edge: #e1b680;
  --ui-warning-emphasis: #b06611;
  --ui-warning-veil: rgba(217, 119, 6, 0.12);
  --ui-warning-deep: #ae5f05;
  --ui-info-subtle: #e6ecf7;
  --ui-info-edge: #94abd2;
  --ui-info-emphasis: #2b53a0;
  --ui-info-veil: rgba(47, 95, 189, 0.12);
  --ui-info-deep: #10826f;
  --ui-ink-subtle: #e4e5e7;
  --ui-ink-edge: #8d9396;
  --ui-ink-emphasis: #1f2937;
  --ui-ink-veil: rgba(31, 41, 55, 0.12);
  --ui-ink-deep: #19212c;
  --ui-muted-subtle: #eceef1;
  --ui-muted-edge: #acb4bc;
  --ui-muted-emphasis: #556479;
  --ui-muted-veil: rgba(100, 116, 139, 0.12);
  --ui-muted-deep: #505d6f;
  --ui-status-cyan-subtle: #e7f8fa;
  --ui-status-cyan-edge: #96d7de;
  --ui-status-cyan-emphasis: #2fa0b4;
  --ui-status-cyan-veil: rgba(51, 193, 215, 0.12);
  --ui-status-cyan-deep: #299aac;
  --ui-status-green-subtle: #e9f8ec;
  --ui-status-green-edge: #9fd9aa;
  --ui-status-green-emphasis: #3da359;
  --ui-status-green-veil: rgba(70, 197, 99, 0.12);
  --ui-status-green-deep: #389e4f;
  --ui-status-orange-subtle: #fcf2e7;
  --ui-status-orange-edge: #e7c298;
  --ui-status-orange-emphasis: #bc7b39;
  --ui-status-orange-veil: rgba(232, 146, 58, 0.12);
  --ui-status-orange-deep: #ba752e;
  --ui-status-yellow-subtle: #fdf8e8;
  --ui-status-yellow-edge: #ecd99c;
  --ui-status-yellow-emphasis: #c3a340;
  --ui-status-yellow-veil: rgba(241, 197, 67, 0.12);
  --ui-status-yellow-deep: #c19e36;
  --ui-status-red-subtle: #faedee;
  --ui-status-red-edge: #e1afb1;
  --ui-status-red-emphasis: #b05965;
  --ui-status-red-veil: rgba(217, 103, 114, 0.12);
  --ui-status-red-deep: #ae525b;
  --ui-status-purple-subtle: #f4effa;
  --ui-status-purple-edge: #cab8dd;
  --ui-status-purple-emphasis: #8969b1;
  --ui-status-purple-veil: rgba(167, 123, 212, 0.12);
  --ui-status-purple-deep: #8662aa;
  --ui-white: #ffffff;
  --ui-black: #1f2937;
  --ui-surface-veil: rgba(255, 255, 255, 0.58);
  --ui-border-veil: rgba(231, 233, 228, 0.55);
  --ui-white-veil: rgba(255, 255, 255, 0.40);
  --ui-black-veil: rgba(34, 34, 34, 0.72);
  --ui-radius-sm: 0.4rem;
  --ui-radius-md: 1rem;
  --ui-radius-lg: 1.25rem;
  --ui-border-width: 1px;
  --ui-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --ui-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.06);
  --ui-shadow-lg: 0 16px 48px rgba(15, 23, 42, 0.14);
  --ui-space: 1rem;
  --ui-space-1: 0.25rem;
  --ui-space-2: 0.5rem;
  --ui-space-3: 0.75rem;
  --ui-space-4: 1rem;
  --ui-space-5: 1.25rem;
  --ui-space-6: 1.5rem;
  --ui-row-gap: 0.65rem;
  --ui-space-7: 2rem;
  --ui-space-8: 3rem;
  --ui-edge: 3px;
  --ui-control-sm: 1.5rem;
  --ui-control: 2rem;
  --ui-control-lg: 2.25rem;
  --ui-touch: 2.75rem;
  --ui-icon-xxs: 0.5rem;
  --ui-icon-xs: 1rem;
  --ui-icon-sm: 1.5rem;
  --ui-icon-md: 2rem;
  --ui-icon-lg: 4rem;
  --ui-icon-xl: 8rem;
  --ui-thumb-sm: 2rem;
  --ui-thumb: 3rem;
  --ui-thumb-lg: 4rem;
  --ui-w-1: 8rem;
  --ui-w-2: 12rem;
  --ui-w-3: 16rem;
  --ui-w-4: 22rem;
  --ui-w-5: 28rem;
  --ui-w-6: 40rem;
  --ui-w-7: 48rem;
  --ui-w-8: 64rem;
  --ui-layer-stick: 10;
  --ui-layer-float: 20;
  --ui-layer-dialog: 1060;
  --ui-layer-carry: 1080;
  --ui-focus-ring: 0 0 0 2px rgba(20, 163, 139, 0.35);
  --ui-focus-ring-soft: 0 0 0 2px var(--ui-accent-veil);
  --ui-font: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ui-type-micro: 0.6875rem;
  --ui-type-micro-lh: 1.25;
  --ui-type-caption: 0.8125rem;
  --ui-type-caption-lh: 1.35;
  --ui-type-body: 1rem;
  --ui-type-body-lh: 1.5;
  --ui-type-title: 1.25rem;
  --ui-type-title-lh: 1.3;
  --ui-type-display: 1.75rem;
  --ui-type-display-lh: 1.2;
  --ui-type-hero: 2.5rem;
  --ui-type-hero-lh: 1.05;
  --ui-max: 72rem;
  --ui-aside: 16rem;
  --ui-chrome-h: 0px;
  --ui-rail-top: 0;
  --ui-trail-top: 0;
  --ui-geo-max: 22rem;
  --tint: var(--ui-accent);
  --ui-seq-1: #2ec2a9;
  --ui-seq-2: #27a590;
  --ui-seq-3: #208877;
  --ui-seq-4: #196b5e;
  --ui-seq-5: #124e44;
  --ui-cost-1: #e0973e;
  --ui-cost-2: #ce8022;
  --ui-cost-3: #ab6b1c;
  --ui-cost-4: #885516;
  --ui-cost-5: #653f10;
  --ui-sign-dn-2: #a02222;
  --ui-sign-dn-1: #dd5f5f;
  --ui-sign-mid: #d7dbd3;
  --ui-sign-up-1: #3bb7a0;
  --ui-sign-up-2: #15806e;
  --ui-nodata: #f2f4f0;
  --ui-dom-ink: var(--ui-accent);
  --ui-dom-strong: var(--ui-accent-strong);
  --ui-dom-soft: var(--ui-accent-soft);
  --ui-dom-line: var(--ui-border);
}

[data-domain=results] {
  --ui-dom-ink: #2f5fbd;
  --ui-dom-strong: #254c99;
  --ui-dom-soft: #e9eefb;
  --ui-dom-line: #ccd9f4;
}

[data-domain=products] {
  --ui-dom-ink: #b5377f;
  --ui-dom-strong: #95296a;
  --ui-dom-soft: #fdeaf4;
  --ui-dom-line: #f5cde4;
}

[data-domain=clients] {
  --ui-dom-ink: #4b3fc4;
  --ui-dom-strong: #3a2fa6;
  --ui-dom-soft: #eeebfd;
  --ui-dom-line: #d8d2fa;
}

[data-domain=regions] {
  --ui-dom-ink: #6b7f1f;
  --ui-dom-strong: #53631a;
  --ui-dom-soft: #f2f6e4;
  --ui-dom-line: #dde7bd;
}

@media (min-width: 768px) {
  :root {
    --ui-space: 1.25rem;
    --ui-type-display: 2rem;
    --ui-type-hero: 3.5rem;
  }
}
::selection {
  background: var(--ui-accent);
  color: var(--ui-surface);
}

[data-theme=dark],
.dark-mode {
  color-scheme: dark;
  --ui-bg: #121212;
  --ui-surface: #1e1e1e;
  --ui-ink: #f5f5f5;
  --ui-muted: #a3a3a3;
  --ui-border: #333941;
  --ui-subtle: #181818;
  --ui-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --ui-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --ui-shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.58);
  --ui-accent-soft: #1d2e2b;
  --ui-accent-strong: #46b5a2;
  --ui-head-soft: #1b3a35;
  --ui-danger: #ef5f5f;
  --ui-rating-track: #2c2c2c;
  --ui-nodata: #262a28;
  --ui-sign-mid: #3a3f3b;
  --ui-status-disabled: #555555;
  --ui-status-disabled-deep: #777777;
  --ui-accent-subtle: #1d2e2b;
  --ui-accent-edge: #256962;
  --ui-accent-emphasis: #46b5a2;
  --ui-accent-veil: rgba(20, 163, 139, 0.12);
  --ui-accent-deep: #43b5a2;
  --ui-success-subtle: #1d2e23;
  --ui-success-edge: #266945;
  --ui-success-emphasis: #47b570;
  --ui-success-veil: rgba(22, 163, 74, 0.12);
  --ui-success-deep: #45b56e;
  --ui-danger-subtle: #351f1f;
  --ui-danger-edge: #7f3035;
  --ui-danger-emphasis: #f07373;
  --ui-danger-veil: rgba(220, 38, 38, 0.12);
  --ui-danger-deep: #e35151;
  --ui-warning-subtle: #34291b;
  --ui-warning-edge: #7e5526;
  --ui-warning-emphasis: #df933b;
  --ui-warning-veil: rgba(217, 119, 6, 0.12);
  --ui-warning-deep: #e19238;
  --ui-info-subtle: #202631;
  --ui-info-edge: #314a79;
  --ui-info-emphasis: #5b80c9;
  --ui-info-veil: rgba(47, 95, 189, 0.12);
  --ui-info-deep: #597fca;
  --ui-ink-subtle: #1e1f21;
  --ui-ink-edge: #2a323d;
  --ui-ink-emphasis: #4e5661;
  --ui-ink-veil: rgba(31, 41, 55, 0.12);
  --ui-ink-deep: #f7f7f7;
  --ui-muted-subtle: #26282b;
  --ui-muted-edge: #495462;
  --ui-muted-emphasis: #9aa6b8;
  --ui-muted-veil: rgba(100, 116, 139, 0.12);
  --ui-muted-deep: #b5b5b5;
  --ui-status-cyan-subtle: #213234;
  --ui-status-cyan-edge: #337685;
  --ui-status-cyan-emphasis: #5eccde;
  --ui-status-cyan-veil: rgba(51, 193, 215, 0.12);
  --ui-status-cyan-deep: #5eccde;
  --ui-status-green-subtle: #233226;
  --ui-status-green-edge: #3c7850;
  --ui-status-green-emphasis: #6dd083;
  --ui-status-green-veil: rgba(70, 197, 99, 0.12);
  --ui-status-green-deep: #6dd083;
  --ui-status-orange-subtle: #362c21;
  --ui-status-orange-edge: #84613e;
  --ui-status-orange-emphasis: #eba863;
  --ui-status-orange-veil: rgba(232, 146, 58, 0.12);
  --ui-status-orange-deep: #eba863;
  --ui-status-yellow-subtle: #373222;
  --ui-status-yellow-edge: #897842;
  --ui-status-yellow-emphasis: #f2d06a;
  --ui-status-yellow-veil: rgba(241, 197, 67, 0.12);
  --ui-status-yellow-deep: #f2d06a;
  --ui-status-red-subtle: #342728;
  --ui-status-red-edge: #7e4e57;
  --ui-status-red-emphasis: #df868f;
  --ui-status-red-veil: rgba(217, 103, 114, 0.12);
  --ui-status-red-deep: #df868f;
  --ui-status-purple-subtle: #2e2934;
  --ui-status-purple-edge: #675783;
  --ui-status-purple-emphasis: #b896db;
  --ui-status-purple-veil: rgba(167, 123, 212, 0.12);
  --ui-status-purple-deep: #b896db;
  --ui-surface-veil: rgba(30, 30, 30, 0.58);
  --ui-border-veil: rgba(51, 57, 65, 0.55);
  --ui-dom-soft: #1d2e2b;
  --ui-dom-line: #256962;
}
[data-theme=dark] [data-domain=results],
.dark-mode [data-domain=results] {
  --ui-dom-ink: #7ea3ea;
  --ui-dom-strong: #a3bff0;
  --ui-dom-soft: #1c2434;
  --ui-dom-line: #2f4470;
}
[data-theme=dark] [data-domain=products],
.dark-mode [data-domain=products] {
  --ui-dom-ink: #e07ab6;
  --ui-dom-strong: #eea2cc;
  --ui-dom-soft: #331f2b;
  --ui-dom-line: #6b3353;
}
[data-theme=dark] [data-domain=clients],
.dark-mode [data-domain=clients] {
  --ui-dom-ink: #9a8ff0;
  --ui-dom-strong: #b9b1f5;
  --ui-dom-soft: #231f36;
  --ui-dom-line: #4a4080;
}
[data-theme=dark] [data-domain=regions],
.dark-mode [data-domain=regions] {
  --ui-dom-ink: #b4c955;
  --ui-dom-strong: #cadb86;
  --ui-dom-soft: #252a16;
  --ui-dom-line: #4f5a22;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) {
    color-scheme: dark;
    --ui-bg: #121212;
    --ui-surface: #1e1e1e;
    --ui-ink: #f5f5f5;
    --ui-muted: #a3a3a3;
    --ui-border: #333941;
    --ui-subtle: #181818;
    --ui-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
    --ui-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
    --ui-shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.58);
    --ui-accent-soft: #1d2e2b;
    --ui-accent-strong: #46b5a2;
    --ui-head-soft: #1b3a35;
    --ui-danger: #ef5f5f;
    --ui-rating-track: #2c2c2c;
    --ui-nodata: #262a28;
    --ui-sign-mid: #3a3f3b;
    --ui-status-disabled: #555555;
    --ui-status-disabled-deep: #777777;
    --ui-accent-subtle: #1d2e2b;
    --ui-accent-edge: #256962;
    --ui-accent-emphasis: #46b5a2;
    --ui-accent-veil: rgba(20, 163, 139, 0.12);
    --ui-accent-deep: #43b5a2;
    --ui-success-subtle: #1d2e23;
    --ui-success-edge: #266945;
    --ui-success-emphasis: #47b570;
    --ui-success-veil: rgba(22, 163, 74, 0.12);
    --ui-success-deep: #45b56e;
    --ui-danger-subtle: #351f1f;
    --ui-danger-edge: #7f3035;
    --ui-danger-emphasis: #f07373;
    --ui-danger-veil: rgba(220, 38, 38, 0.12);
    --ui-danger-deep: #e35151;
    --ui-warning-subtle: #34291b;
    --ui-warning-edge: #7e5526;
    --ui-warning-emphasis: #df933b;
    --ui-warning-veil: rgba(217, 119, 6, 0.12);
    --ui-warning-deep: #e19238;
    --ui-info-subtle: #202631;
    --ui-info-edge: #314a79;
    --ui-info-emphasis: #5b80c9;
    --ui-info-veil: rgba(47, 95, 189, 0.12);
    --ui-info-deep: #597fca;
    --ui-ink-subtle: #1e1f21;
    --ui-ink-edge: #2a323d;
    --ui-ink-emphasis: #4e5661;
    --ui-ink-veil: rgba(31, 41, 55, 0.12);
    --ui-ink-deep: #f7f7f7;
    --ui-muted-subtle: #26282b;
    --ui-muted-edge: #495462;
    --ui-muted-emphasis: #9aa6b8;
    --ui-muted-veil: rgba(100, 116, 139, 0.12);
    --ui-muted-deep: #b5b5b5;
    --ui-status-cyan-subtle: #213234;
    --ui-status-cyan-edge: #337685;
    --ui-status-cyan-emphasis: #5eccde;
    --ui-status-cyan-veil: rgba(51, 193, 215, 0.12);
    --ui-status-cyan-deep: #5eccde;
    --ui-status-green-subtle: #233226;
    --ui-status-green-edge: #3c7850;
    --ui-status-green-emphasis: #6dd083;
    --ui-status-green-veil: rgba(70, 197, 99, 0.12);
    --ui-status-green-deep: #6dd083;
    --ui-status-orange-subtle: #362c21;
    --ui-status-orange-edge: #84613e;
    --ui-status-orange-emphasis: #eba863;
    --ui-status-orange-veil: rgba(232, 146, 58, 0.12);
    --ui-status-orange-deep: #eba863;
    --ui-status-yellow-subtle: #373222;
    --ui-status-yellow-edge: #897842;
    --ui-status-yellow-emphasis: #f2d06a;
    --ui-status-yellow-veil: rgba(241, 197, 67, 0.12);
    --ui-status-yellow-deep: #f2d06a;
    --ui-status-red-subtle: #342728;
    --ui-status-red-edge: #7e4e57;
    --ui-status-red-emphasis: #df868f;
    --ui-status-red-veil: rgba(217, 103, 114, 0.12);
    --ui-status-red-deep: #df868f;
    --ui-status-purple-subtle: #2e2934;
    --ui-status-purple-edge: #675783;
    --ui-status-purple-emphasis: #b896db;
    --ui-status-purple-veil: rgba(167, 123, 212, 0.12);
    --ui-status-purple-deep: #b896db;
    --ui-surface-veil: rgba(30, 30, 30, 0.58);
    --ui-border-veil: rgba(51, 57, 65, 0.55);
    --ui-dom-soft: #1d2e2b;
    --ui-dom-line: #256962;
  }
  :root:not([data-theme=light]) [data-domain=results] {
    --ui-dom-ink: #7ea3ea;
    --ui-dom-strong: #a3bff0;
    --ui-dom-soft: #1c2434;
    --ui-dom-line: #2f4470;
  }
  :root:not([data-theme=light]) [data-domain=products] {
    --ui-dom-ink: #e07ab6;
    --ui-dom-strong: #eea2cc;
    --ui-dom-soft: #331f2b;
    --ui-dom-line: #6b3353;
  }
  :root:not([data-theme=light]) [data-domain=clients] {
    --ui-dom-ink: #9a8ff0;
    --ui-dom-strong: #b9b1f5;
    --ui-dom-soft: #231f36;
    --ui-dom-line: #4a4080;
  }
  :root:not([data-theme=light]) [data-domain=regions] {
    --ui-dom-ink: #b4c955;
    --ui-dom-strong: #cadb86;
    --ui-dom-soft: #252a16;
    --ui-dom-line: #4f5a22;
  }
}
body {
  font-family: var(--ui-font);
  font-size: var(--ui-type-body);
  line-height: var(--ui-type-body-lh);
  color: var(--ui-ink);
}

h1, h2, h3, h4, h5, h6 {
  margin-block: 0 var(--ui-space-2);
  line-height: var(--ui-type-title-lh);
  font-weight: 600;
  text-wrap: balance;
}

h1 {
  font-size: var(--ui-type-display);
  line-height: var(--ui-type-display-lh);
}

h2 {
  font-size: var(--ui-type-title);
}

h3 {
  font-size: var(--ui-type-body);
}

h4, h5, h6 {
  font-size: var(--ui-type-body);
  font-weight: 500;
}

p {
  margin-block: 0 var(--ui-space-3);
  text-wrap: pretty;
}

small {
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}

td, th, output, time, .tabular {
  font-variant-numeric: tabular-nums;
}

a {
  color: var(--ui-accent-emphasis);
  text-underline-offset: 0.2em;
}
a:hover {
  color: var(--ui-accent-strong);
}

:focus-visible {
  outline: none;
  box-shadow: var(--ui-focus-ring);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
input[type=checkbox],
input[type=radio],
input[type=range],
progress {
  accent-color: var(--ui-accent);
}

textarea {
  field-sizing: content;
  width: 100%;
  min-height: calc(var(--ui-control-lg) * 2);
}

img,
svg,
video {
  max-width: 100%;
  height: auto;
}

[inert],
[inert] * {
  pointer-events: none;
  user-select: none;
}

table {
  border-collapse: collapse;
  width: 100%;
}

:target {
  scroll-margin-block-start: var(--ui-head-bar-h);
}

[draggable=true] {
  user-select: none;
  touch-action: none;
}

.icon {
  --icon-mask: linear-gradient(transparent, transparent);
  display: inline-block;
  vertical-align: middle;
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  margin: var(--ui-space-1);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%;
}
.icon--xxs {
  width: var(--ui-icon-xxs);
  height: var(--ui-icon-xxs);
}
.icon--12 {
  width: calc(var(--ui-icon-xs) * 0.75);
  height: calc(var(--ui-icon-xs) * 0.75);
}
.icon--xs {
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
}
.icon--20, .icon--custom {
  width: calc(var(--ui-icon-xs) * 1.25);
  height: calc(var(--ui-icon-xs) * 1.25);
}
.icon--sm {
  width: var(--ui-icon-sm);
  height: var(--ui-icon-sm);
}
.icon--md {
  width: var(--ui-icon-md);
  height: var(--ui-icon-md);
}
.icon--lg {
  width: var(--ui-icon-lg);
  height: var(--ui-icon-lg);
}
.icon--xl {
  width: var(--ui-icon-xl);
  height: var(--ui-icon-xl);
}
.icon--image {
  background-color: transparent;
}
.icon--semi {
  opacity: 0.5;
}
.icon--opaque {
  opacity: 1;
}
.icon.chevron {
  --icon-mask: url("../svg/chevron.svg");
}
.input-group .btn .icon {
  margin: 0;
}
button.icon {
  padding: 0;
  border: 0;
  border-style: none;
  background-color: transparent;
  cursor: pointer;
  flex: none;
}

.icon:not(.icon--image) {
  background-image: none;
  background-color: currentColor;
  -webkit-mask-image: var(--icon-mask);
  mask-image: var(--icon-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.emoji {
  width: var(--ui-icon-sm);
  height: var(--ui-icon-sm);
  margin: 2px var(--ui-space-1);
}

.form-control,
.custom-file,
.custom-file-label,
.custom-file-label::after {
  border-radius: 999px;
}

.form-control,
.custom-file-label {
  padding-inline: var(--ui-space-3);
  border-color: var(--ui-border);
}

textarea.form-control,
select[multiple].form-control,
select[size].form-control:not([size="1"]) {
  border-radius: var(--ui-radius-md);
}

.form-control--plain {
  min-height: var(--ui-control-lg);
  padding: var(--ui-space-1) var(--ui-space-2);
  border-color: transparent;
  background: transparent;
}
.form-control--plain:hover {
  border-color: var(--ui-border);
  background: var(--ui-surface);
}
.form-control--plain:focus {
  border-color: var(--ui-accent);
  background: var(--ui-surface);
  box-shadow: var(--ui-focus-ring-soft);
  outline: none;
}

.form-control.is-warn {
  background: var(--ui-warning-subtle);
  border-color: var(--ui-warning-edge);
}

.input-group > .form-control:first-child {
  border-start-start-radius: 999px;
  border-end-start-radius: 999px;
}

.input-group > .input-group-append:last-child > .btn:last-child,
.input-group > .input-group-prepend:first-child > .btn:first-child {
  border-start-end-radius: 999px;
  border-end-end-radius: 999px;
}

.input-group > .form-control:not(:first-child),
.input-group > .custom-file:not(:first-child) .custom-file-label {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.input-group > .form-control:not(:last-child),
.input-group > .custom-file:not(:last-child) .custom-file-label {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

.input-group > .input-group-prepend > .input-group-text {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

.input-group > .input-group-append > .input-group-text {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.input-group > .input-group-prepend:not(:first-child) > .input-group-text,
.input-group > .input-group-append:not(:last-child) > .input-group-text {
  border-radius: 0;
}

.input-group > .input-group-prepend:first-child > .input-group-text,
.input-group > .input-group-append:last-child > .input-group-text {
  border-radius: 999px;
}

.input-group > .input-group-prepend:first-child > .input-group-text {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
  padding-inline-start: var(--ui-space-4);
}

.input-group > .input-group-append:last-child > .input-group-text {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
  padding-inline-end: var(--ui-space-4);
}

:where(input[type=number],
input[inputmode=numeric],
input[inputmode=decimal]) {
  text-align: end;
  font-variant-numeric: tabular-nums;
}

tr.is-ok .form-control {
  border-color: var(--ui-success);
  font-weight: 600;
}

tr.is-warn .form-control {
  border-color: var(--ui-warning);
}

.field-inset-end {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
}
.field-inset-end-slot {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}
.field-inset-end-field {
  width: 100%;
  min-width: 0;
  padding-inline-end: calc(var(--ui-control-sm) + var(--ui-space-2));
  text-overflow: ellipsis;
}
.field-inset-end-affix {
  position: absolute;
  inset-inline-end: var(--ui-space-1);
  top: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  place-items: center;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ui-muted);
  font: inherit;
  line-height: 1;
  cursor: pointer;
  translate: 0 -50%;
}
.field-inset-end-affix > .icon {
  margin: 0;
  flex-shrink: 0;
}
.field-inset-end-affix:hover {
  background: var(--ui-subtle);
  color: var(--ui-ink);
}

.field {
  display: inline-grid;
  gap: var(--ui-space-1);
  min-width: 0;
}
.field:has(textarea) {
  display: grid;
}
.field--area .field-input {
  min-height: calc(var(--ui-control-lg) * 2);
  border-radius: var(--ui-radius-md);
  padding-block: var(--ui-space-2);
  field-sizing: content;
  resize: vertical;
}
.field-slot {
  display: flex;
  min-width: 0;
}
.field-input {
  width: 100%;
  min-width: 0;
  min-height: var(--ui-control-lg);
  padding-inline: var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-ink);
  font: inherit;
}
.field-input:focus-visible {
  border-color: var(--ui-accent);
}
.field-foot {
  padding-inline: var(--ui-space-3);
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
  color: var(--ui-muted);
}
.field-foot.is-warn {
  color: var(--ui-warning-emphasis);
  font-weight: 600;
}

@supports (appearance: base-select) {
  select:not([multiple])::picker(select) {
    appearance: base-select;
  }
  select:not([multiple]) {
    appearance: base-select;
    padding-inline-end: var(--ui-space-6);
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='401.998px' height='401.998px' viewBox='0 0 401.998 401.998' xml:space='preserve' fill='%23666'%3E%3Cg%3E%3Cpath d='M73.092,164.452h255.813c4.949,0,9.233-1.807,12.848-5.424c3.613-3.616,5.427-7.898,5.427-12.847 c0-4.949-1.813-9.229-5.427-12.85L213.846,5.424C210.232,1.812,205.951,0,200.999,0s-9.233,1.812-12.85,5.424L60.242,133.331 c-3.617,3.617-5.424,7.901-5.424,12.85c0,4.948,1.807,9.231,5.424,12.847C63.863,162.645,68.144,164.452,73.092,164.452z'/%3E%3Cpath d='M328.905,237.549H73.092c-4.952,0-9.233,1.808-12.85,5.421c-3.617,3.617-5.424,7.898-5.424,12.847 c0,4.949,1.807,9.233,5.424,12.848L188.149,396.57c3.621,3.617,7.902,5.428,12.85,5.428s9.233-1.811,12.847-5.428l127.907-127.906 c3.613-3.614,5.427-7.898,5.427-12.848c0-4.948-1.813-9.229-5.427-12.847C338.139,239.353,333.854,237.549,328.905,237.549z'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-position: center right var(--ui-space-2);
    background-size: auto 30%;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  @media (hover: hover) {
    select:not([multiple]):hover {
      border-color: var(--ui-accent);
    }
  }
  select:not([multiple])::picker-icon {
    display: none;
  }
  select:not([multiple])::picker(select) {
    background: var(--ui-surface);
    color: var(--ui-ink);
    border: var(--ui-border-width) solid var(--ui-border);
    border-radius: var(--ui-radius-md);
    box-shadow: var(--ui-shadow-md);
    padding: var(--ui-space-1);
  }
  select:not([multiple]) option {
    padding: var(--ui-space-2) var(--ui-space-3);
    border-radius: var(--ui-radius-sm);
    color: var(--ui-ink);
  }
  select:not([multiple]) option:hover,
  select:not([multiple]) option:focus {
    background: var(--ui-accent-subtle);
    color: var(--ui-ink);
  }
  select:not([multiple]) option:checked {
    background: var(--ui-accent);
    color: var(--ui-surface);
  }
  select:not([multiple]) option:checked:hover,
  select:not([multiple]) option:checked:focus {
    background: var(--ui-accent-strong);
    color: var(--ui-surface);
  }
}
.switch {
  display: inline-flex;
}
.switch-button {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-2);
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.switch-button:focus-visible .switch-track, .switch-button:has(input:focus-visible) .switch-track {
  box-shadow: var(--ui-focus-ring);
}
.switch-button[aria-checked=true] .switch-track, .switch-button:has(input:checked) .switch-track {
  background: var(--ui-accent);
}
.switch-button[aria-checked=true] .switch-thumb, .switch-button:has(input:checked) .switch-thumb {
  translate: var(--ui-icon-xs) 0;
}
.switch-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.switch-track {
  position: relative;
  flex: 0 0 auto;
  width: var(--ui-control-lg);
  height: var(--ui-space-5);
  border-radius: 999px;
  background: var(--ui-border);
  transition: background 0.15s;
}
.switch-thumb {
  position: absolute;
  inset-block-start: 2px;
  inset-inline-start: 2px;
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  border-radius: 999px;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-sm);
  transition: translate 0.15s;
}

.choice {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--ui-space-1);
  padding: var(--ui-space-1);
  border-radius: 999px;
  background: var(--ui-subtle);
}
.choice:has(:focus-visible) {
  box-shadow: var(--ui-focus-ring);
}
.choice--md .choice-option {
  min-height: auto;
  padding: var(--ui-space-1) var(--ui-space-3);
}
.choice--lg .choice-option {
  min-height: var(--ui-control-lg);
  padding: var(--ui-space-2) var(--ui-space-5);
}
.choice--tiles {
  display: grid;
  gap: var(--ui-space-3);
  padding: 0;
  border-radius: 0;
  background: none;
}
.choice-option {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: var(--ui-space-1) var(--ui-space-3);
  border-radius: 999px;
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
  color: var(--ui-muted);
  cursor: pointer;
  transition: color 0.12s, background 0.12s;
}
.choice-option:hover {
  color: var(--ui-ink);
}
.choice-option.is-active, .choice-option[aria-pressed=true], .choice-option:has(input:checked) {
  background: var(--ui-surface);
  color: var(--ui-ink);
  font-weight: 600;
  box-shadow: inset 0 0 0 1px var(--ui-accent), var(--ui-shadow-sm);
}
.choice-option.is-disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
button.choice-option {
  border: 0;
  background: transparent;
  font-family: inherit;
}

@media (max-width: 767.98px) {
  .choice--fill {
    display: flex;
    border-radius: var(--ui-radius-lg);
  }
  .choice--fill .choice-option {
    flex: 1 1 auto;
    justify-content: center;
    text-align: center;
  }
}

.pick {
  display: grid;
  width: 100%;
  position: relative;
  min-width: 0;
}
.pick--md .pick-trigger,
.pick--md .pick-input {
  min-height: var(--ui-control-lg);
  font-size: inherit;
  border-width: var(--ui-border-width);
}
.pick--lg .pick-trigger,
.pick--lg .pick-input {
  min-height: calc(var(--ui-control-lg) + var(--ui-space-2));
  font-size: var(--ui-type-body);
  border-width: 2px;
}
.pick--lg .pick-pop {
  border-radius: var(--ui-radius-md);
}
.pick--cta .pick-trigger {
  border-style: solid;
  border-color: transparent;
  background-color: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}
.pick--cta .pick-trigger:hover {
  border-color: transparent;
  background-color: var(--ui-accent-subtle);
  color: var(--ui-accent-strong);
}
.pick--search.pick--settled .pick-field {
  visibility: hidden;
}
.pick--search:not(.pick--settled) .pick-chip {
  visibility: hidden;
}
.pick-trigger, .pick-field {
  grid-area: 1/1;
}
.pick:not(.pick--search):not([data-novo-open]) .pick-field, .pick[data-novo-open] .pick-trigger, .pick--search .pick-trigger {
  visibility: hidden;
}
.pick-trigger, .pick-input {
  width: 100%;
  min-height: var(--ui-control-lg);
  padding-inline: var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background-color: var(--ui-surface);
  color: var(--ui-ink);
  font: inherit;
  text-align: start;
}
.pick-trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-2);
  cursor: pointer;
  appearance: none;
}
@media (hover: hover) {
  .pick-trigger:hover {
    border-color: var(--ui-accent);
  }
}
.pick-trigger::after {
  content: "";
  flex: 0 0 auto;
  width: 0.65rem;
  height: 0.65rem;
  margin-inline-start: auto;
  background-color: var(--ui-muted);
  -webkit-mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='401.998px' height='401.998px' viewBox='0 0 401.998 401.998' xml:space='preserve' fill='%23666'%3E%3Cg%3E%3Cpath d='M73.092,164.452h255.813c4.949,0,9.233-1.807,12.848-5.424c3.613-3.616,5.427-7.898,5.427-12.847 c0-4.949-1.813-9.229-5.427-12.85L213.846,5.424C210.232,1.812,205.951,0,200.999,0s-9.233,1.812-12.85,5.424L60.242,133.331 c-3.617,3.617-5.424,7.901-5.424,12.85c0,4.948,1.807,9.231,5.424,12.847C63.863,162.645,68.144,164.452,73.092,164.452z'/%3E%3Cpath d='M328.905,237.549H73.092c-4.952,0-9.233,1.808-12.85,5.421c-3.617,3.617-5.424,7.898-5.424,12.847 c0,4.949,1.807,9.233,5.424,12.848L188.149,396.57c3.621,3.617,7.902,5.428,12.85,5.428s9.233-1.811,12.847-5.428l127.907-127.906 c3.613-3.614,5.427-7.898,5.427-12.848c0-4.948-1.813-9.229-5.427-12.847C338.139,239.353,333.854,237.549,328.905,237.549z'/%3E%3C/g%3E%3C/svg%3E%0A");
  mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='401.998px' height='401.998px' viewBox='0 0 401.998 401.998' xml:space='preserve' fill='%23666'%3E%3Cg%3E%3Cpath d='M73.092,164.452h255.813c4.949,0,9.233-1.807,12.848-5.424c3.613-3.616,5.427-7.898,5.427-12.847 c0-4.949-1.813-9.229-5.427-12.85L213.846,5.424C210.232,1.812,205.951,0,200.999,0s-9.233,1.812-12.85,5.424L60.242,133.331 c-3.617,3.617-5.424,7.901-5.424,12.85c0,4.948,1.807,9.231,5.424,12.847C63.863,162.645,68.144,164.452,73.092,164.452z'/%3E%3Cpath d='M328.905,237.549H73.092c-4.952,0-9.233,1.808-12.85,5.421c-3.617,3.617-5.424,7.898-5.424,12.847 c0,4.949,1.807,9.233,5.424,12.848L188.149,396.57c3.621,3.617,7.902,5.428,12.85,5.428s9.233-1.811,12.847-5.428l127.907-127.906 c3.613-3.614,5.427-7.898,5.427-12.848c0-4.948-1.813-9.229-5.427-12.847C338.139,239.353,333.854,237.549,328.905,237.549z'/%3E%3C/g%3E%3C/svg%3E%0A");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.pick-trigger:focus {
  outline: none;
  border-color: var(--ui-accent);
  background-color: var(--ui-surface);
  box-shadow: var(--ui-focus-ring-soft);
  color: var(--ui-ink);
}
.pick-trigger:focus-visible {
  box-shadow: var(--ui-focus-ring);
}
@media (hover: hover) {
  .pick-input:hover {
    border-color: var(--ui-accent);
  }
}
.pick-input:focus {
  outline: none;
  border-color: var(--ui-accent);
  background-color: var(--ui-surface);
  box-shadow: var(--ui-focus-ring-soft);
  color: var(--ui-ink);
}
.pick-input:focus-visible {
  box-shadow: var(--ui-focus-ring);
}
.pick--action .pick-trigger {
  border-style: solid;
  border-color: var(--ui-border);
  background-color: var(--ui-surface);
  color: var(--ui-ink);
}
@media (hover: hover) {
  .pick--action .pick-trigger:hover {
    border-color: var(--ui-accent);
    background-color: var(--ui-surface);
    color: var(--ui-ink);
  }
}
.pick--action .pick-trigger:focus {
  background-color: var(--ui-surface);
  color: var(--ui-ink);
}
.pick--action .pick-trigger.is-active {
  border-style: solid;
  color: var(--ui-ink);
}
.pick--empty-state .pick-trigger:not(.is-active) {
  border-style: dashed;
  color: var(--ui-muted);
}
.pick--empty-state .pick-trigger:not(.is-active)::after {
  width: 0.5em;
  height: 0.5em;
  background-color: transparent;
  -webkit-mask-image: none;
  mask-image: none;
  border-inline-end: 2px solid currentColor;
  border-block-end: 2px solid currentColor;
  rotate: 45deg;
  translate: 0 -0.15em;
}
.pick-trigger-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pick-field {
  position: relative;
  display: block;
}
.pick-field.has-icon .pick-input {
  padding-inline-end: var(--ui-space-6);
}
.pick-icon {
  position: absolute;
  inset-inline-end: var(--ui-space-3);
  top: 50%;
  z-index: 1;
  display: grid;
  place-items: center;
  margin: 0;
  color: var(--ui-muted);
  pointer-events: none;
  translate: 0 -50%;
}
.pick-icon .icon, .pick-icon::after {
  grid-area: 1/1;
}
.pick-icon .icon {
  margin: 0;
  transition: opacity 0.15s ease;
}
.pick-icon::after {
  content: "";
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  border-radius: 50%;
  border: 2px solid var(--ui-border);
  border-block-start-color: var(--ui-accent);
  opacity: 0;
  transition: opacity 0.15s ease;
}
.pick-field.is-loading .pick-icon .icon {
  opacity: 0;
}
.pick-field.is-loading .pick-icon::after {
  opacity: 1;
  animation: pick-spin 0.7s linear infinite;
}
.pick-pop {
  position: absolute;
  position-area: block-end span-inline-end;
  margin: var(--ui-space-1) 0 0;
  padding: var(--ui-space-1);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  color: var(--ui-ink);
  box-shadow: var(--ui-shadow-lg);
  min-width: max(anchor-size(width), var(--ui-w-3));
  max-width: min(var(--ui-w-4), 90vw);
  max-height: var(--ui-w-3);
  overflow-y: auto;
  position-try-fallbacks: flip-block;
}
.pick-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.pick-option {
  display: flex;
  align-items: center;
  gap: var(--ui-space-2);
  padding: var(--ui-space-2) var(--ui-space-3);
  border-radius: var(--ui-radius-sm);
  color: var(--ui-ink);
  cursor: pointer;
}
.pick-option.is-candidate {
  background: var(--ui-accent-subtle);
  color: var(--ui-ink);
}
.pick-option.is-chosen {
  background: var(--ui-accent);
  color: var(--ui-surface);
}
.pick-option.is-chosen .pick-option-cta {
  opacity: 1;
}
.pick-option.is-candidate.is-chosen {
  background: var(--ui-accent-strong);
  color: var(--ui-surface);
}
.pick-option.is-disabled, .pick-option.is-empty {
  color: var(--ui-muted);
  cursor: default;
}
.pick-option.is-disabled.is-candidate, .pick-option.is-empty.is-candidate {
  background: none;
}
.pick-option.is-empty {
  justify-content: center;
  font-size: var(--ui-type-caption);
}
.pick-option-thumb {
  flex: none;
  width: var(--ui-thumb-sm);
  height: var(--ui-thumb-sm);
  margin: 0;
}
.pick-option-main {
  flex: 1;
  min-width: 0;
}
.pick-option-name {
  display: block;
  font-size: var(--ui-type-caption);
  font-weight: 500;
}
.pick-option-name small {
  font-weight: 400;
  color: var(--ui-muted);
}
.pick-option-code {
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: var(--ui-type-micro);
  color: var(--ui-muted);
}
.pick-option-note {
  font-size: var(--ui-type-micro);
  color: var(--ui-muted);
  white-space: nowrap;
}
.pick-option-cta {
  font-size: var(--ui-type-micro);
  font-weight: 600;
  color: var(--ui-accent-strong);
  white-space: nowrap;
  opacity: 0;
}
.pick-chip {
  grid-area: 1/1;
  min-height: var(--ui-control-lg);
  padding: var(--ui-space-2) var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-accent-veil);
  border-radius: 999px;
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}
.pick-chip-main {
  gap: 2px;
}
.pick-chip-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pick-chip-meta {
  line-height: 1.3;
}
.pick-chip-clear.icon {
  margin: 0;
  margin-inline-start: auto;
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  flex: none;
  padding: 0;
  border: 0;
  cursor: pointer;
  opacity: 0.5;
}
@media (hover: hover) {
  .pick-chip-clear.icon:hover {
    opacity: 1;
  }
}

@keyframes pick-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .pick-field.is-loading .pick-icon::after {
    animation: none;
    opacity: 1;
  }
}
.pick-many {
  display: grid;
  justify-items: start;
  width: 100%;
  min-width: 0;
}
.pick-many-gate {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-2);
  min-height: var(--ui-control-lg);
  padding-inline: var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-ink);
  font: inherit;
  cursor: pointer;
}
.pick-many-gate::after {
  content: "";
  margin-inline-start: auto;
  width: 0.5em;
  height: 0.5em;
  border-inline-end: 2px solid currentColor;
  border-block-end: 2px solid currentColor;
  rotate: 45deg;
  translate: 0 -0.15em;
}
.pick-many-gate.is-empty {
  border-style: dashed;
  color: var(--ui-muted);
}
.pick-many-pop {
  display: block;
  width: 100%;
  margin-block-start: var(--ui-space-2);
  padding: var(--ui-space-1);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  max-height: var(--ui-w-4);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.pick-many-pop[hidden] {
  display: none;
}
.pick-many-pop.has-cover .pick-many-option--area {
  opacity: 0.45;
  pointer-events: none;
}
.pick-many-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2);
  padding: var(--ui-space-2);
  margin-block-end: var(--ui-space-2);
  border-block-end: var(--ui-border-width) dashed var(--ui-border);
}
.pick-many-shortcut {
  padding: var(--ui-space-1) var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-weight: 600;
}
.pick-many-shortcut:hover {
  border-color: var(--ui-accent);
  color: var(--ui-accent-strong);
}
.pick-many-group {
  display: block;
  margin: var(--ui-space-3) 0 var(--ui-space-1);
  padding-inline: var(--ui-space-2);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.pick-many-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--ui-space-3);
  align-items: start;
  margin: 0;
  padding: var(--ui-space-2) var(--ui-space-3);
  border-radius: var(--ui-radius-sm);
  cursor: pointer;
}
.pick-many-option:hover {
  background: var(--ui-accent-subtle);
}
.pick-many-option--master {
  margin-block-end: var(--ui-space-2);
  padding: var(--ui-space-3);
  background: var(--ui-subtle);
}
.pick-many-option--master b {
  font-size: var(--ui-type-body);
  font-weight: 700;
}
.pick-many-option input {
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  margin: 2px 0 0;
  accent-color: var(--ui-accent);
}
.pick-many-option b {
  display: block;
  font-size: var(--ui-type-caption);
  font-weight: 600;
  line-height: var(--ui-type-caption-lh);
}
.pick-many-option small {
  display: block;
  margin-block-start: 2px;
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
}
.pick-many-note {
  display: block;
  margin: 0 0 var(--ui-space-2);
  padding: var(--ui-space-2);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-warning-subtle);
  color: var(--ui-warning-emphasis);
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
}
.pick-many-empty {
  display: block;
  margin: 0 0 var(--ui-space-2);
  padding: var(--ui-space-3);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-danger-subtle);
  color: var(--ui-danger-emphasis);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}

.numeric {
  display: inline-flex;
  align-items: stretch;
  min-width: min-content;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  overflow: hidden;
}
.numeric:focus-within {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.numeric-button {
  flex: 0 0 auto;
  min-width: var(--ui-control);
  border: 0;
  background: none;
  color: var(--ui-muted);
  font: inherit;
  line-height: 1;
  cursor: pointer;
}
.numeric-button:hover {
  color: var(--ui-accent);
}
.numeric-slot {
  display: flex;
  min-width: 0;
}
.numeric-input {
  width: 4ch;
  min-width: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: center;
  appearance: textfield;
}
.numeric-input::-webkit-outer-spin-button, .numeric-input::-webkit-inner-spin-button {
  appearance: none;
  margin: 0;
}
.numeric-input:focus {
  outline: none;
}

.search {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-1);
  padding-inline-end: var(--ui-space-2);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
}
.search:focus-within {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.search-slot {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}
.search-input {
  width: 100%;
  min-width: 0;
  min-height: var(--ui-control-lg);
  padding-inline: var(--ui-space-3);
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
}
.search-input:focus {
  outline: none;
}
.search-input::-webkit-search-cancel-button {
  appearance: none;
}
.search-clear {
  flex: 0 0 auto;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: none;
  color: var(--ui-muted);
  line-height: 1;
  cursor: pointer;
}
.search-clear:hover {
  background: var(--ui-subtle);
  color: var(--ui-ink);
}

.money {
  display: inline-flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
}
.money:focus-within {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.money--sm .money-input {
  min-height: var(--ui-control);
  font-size: var(--ui-type-caption);
}
.money--md .money-input {
  min-height: var(--ui-control-lg);
  font-size: inherit;
}
.money-symbol {
  padding-inline-start: var(--ui-space-3);
  color: var(--ui-muted);
}
.money-slot {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}
.money-input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  min-height: var(--ui-control-lg);
  padding-inline: var(--ui-space-2) var(--ui-space-3);
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
}
.money-input:focus {
  outline: none;
}

@property --at {
  syntax: "<percentage>";
  inherits: true;
  initial-value: 0%;
}
.scale {
  display: grid;
  gap: var(--ui-space-2);
  min-width: 0;
  padding: var(--ui-space-3);
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.scale:hover .scale-thumb, .scale.is-grabbing .scale-thumb {
  scale: 1.4;
}
.scale.is-grabbing {
  cursor: grabbing;
}
.scale.is-grabbing .scale-track {
  transition: none;
}
.scale:has(:focus-visible) .scale-track {
  box-shadow: var(--ui-focus-ring);
}
.scale:has([data-min]) .scale-fill {
  min-inline-size: calc(var(--ui-space-1) * 1.5);
}
.scale-track {
  --steps: 3;
  --at: 0%;
  position: relative;
  height: calc(var(--ui-space-1) * 1.5);
  margin-inline: calc((100% - (var(--steps) - 1) * var(--ui-space-1)) / (2 * var(--steps)));
  border-radius: 999px;
  background: var(--ui-border);
  transition: --at 0.2s ease;
}
.scale-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--ui-accent);
  inline-size: var(--at);
}
.scale-thumb {
  position: absolute;
  z-index: 1;
  inset-block-start: 50%;
  inset-inline-start: var(--at);
  width: var(--ui-space-4);
  height: var(--ui-space-4);
  border: 2px solid var(--ui-accent);
  border-radius: 50%;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-md);
  pointer-events: none;
  translate: -50% -50%;
  scale: 1;
  transition: scale 0.18s ease;
}
.scale-steps {
  --steps: 3;
  display: grid;
  grid-template-columns: repeat(var(--steps), minmax(0, 1fr));
  gap: var(--ui-space-1);
}
.scale-step {
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
  color: var(--ui-muted);
  text-align: center;
  cursor: grab;
}
.scale-step.is-active {
  color: var(--ui-accent-emphasis);
  font-weight: 600;
}
button.scale-step {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
}

.date {
  display: inline-grid;
  gap: var(--ui-space-1);
  min-width: 0;
}
.date-slot {
  display: flex;
  min-width: 0;
}
.date-input {
  min-height: var(--ui-control-lg);
  padding-inline: var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: inherit;
  font: inherit;
}
.date-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-1);
  padding-inline: var(--ui-space-2);
}
.date-shortcuts:empty {
  display: none;
}
.date-shortcut {
  padding-inline: var(--ui-space-2);
  border: 0;
  border-radius: 999px;
  background: none;
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  line-height: 1.6;
  cursor: pointer;
}
.date-shortcut:hover {
  background: var(--ui-accent-subtle);
  color: var(--ui-accent-emphasis);
}

.file {
  display: grid;
  gap: var(--ui-space-2);
}
.file-zone {
  display: grid;
  place-items: center;
  gap: var(--ui-space-1);
  padding: var(--ui-space-5);
  border: var(--ui-border-width) dashed var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  color: var(--ui-muted);
  cursor: pointer;
}
.file-zone:hover, .file-zone.has-dragover {
  border-color: var(--ui-accent);
  color: var(--ui-accent-emphasis);
}
.file-zone:has(:focus-visible) {
  box-shadow: var(--ui-focus-ring);
}
.file-text {
  color: var(--ui-ink);
  font-weight: 600;
}
.file-hint {
  font-size: var(--ui-type-caption);
}
.file-queue {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-1);
}
.file-queue:empty {
  display: none;
}
.file-item {
  padding-inline: var(--ui-space-2);
  border-radius: 999px;
  background: var(--ui-subtle);
  font-size: var(--ui-type-micro);
  line-height: 1.8;
}
.file-tray {
  display: grid;
  gap: var(--ui-space-3);
  padding: var(--ui-space-4);
  border: var(--ui-border-width) solid var(--ui-accent-edge);
  border-radius: var(--ui-radius-lg);
  background: var(--ui-accent-subtle);
}
.file-tray-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ui-space-2);
}
.file-tray-title {
  color: var(--ui-ink);
  font-weight: 600;
}
.file-tray-actions {
  display: flex;
  gap: var(--ui-space-2);
}
.file-tray-items {
  display: grid;
  gap: var(--ui-space-2);
}
.file-upload {
  display: flex;
  align-items: center;
  gap: var(--ui-space-3);
  padding: var(--ui-space-2);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
}
.file-upload.is-ok {
  border-color: var(--ui-success-edge);
}
.file-upload.is-bad {
  border-color: var(--ui-danger-edge);
}
.file-upload-thumb {
  flex: none;
  width: var(--ui-control-lg);
  height: var(--ui-control-lg);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-subtle);
  object-fit: cover;
}
.file-upload-body {
  display: grid;
  flex: 1 1 auto;
  gap: var(--ui-space-1);
  min-width: 0;
}
.file-upload-name {
  overflow: hidden;
  color: var(--ui-ink);
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.file-upload-bar {
  display: block;
  height: var(--ui-space-1);
  border-radius: 999px;
  background: var(--ui-subtle);
  overflow: hidden;
}
.file-upload-fill {
  display: block;
  block-size: 100%;
  background: var(--ui-accent);
  transition: inline-size 0.2s ease;
}
.file-upload-state {
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
}
.is-ok .file-upload-state {
  color: var(--ui-success-emphasis);
}
.is-bad .file-upload-state {
  color: var(--ui-danger-emphasis);
}

.tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ui-space-1);
  padding: var(--ui-space-1) var(--ui-space-2);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
}
.tags:focus-within {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.tags-chips {
  display: contents;
}
.tags-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-1);
}
.tags-clear {
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  line-height: 1;
  cursor: pointer;
  opacity: 0.6;
}
.tags-clear:hover {
  opacity: 1;
}
.tags-input {
  flex: 1 1 var(--ui-w-1);
  min-width: var(--ui-w-1);
  min-height: var(--ui-control);
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
}
.tags-input:focus {
  outline: none;
}
.tags-slot {
  display: none;
}

.is-dirty .btn-icon--when-dirty {
  border-color: var(--ui-accent);
  background: var(--ui-accent);
  color: var(--ui-surface);
}

tr.is-dirty > td {
  background: var(--ui-warning-subtle);
}

tr.is-dirty > td:first-child {
  box-shadow: inset var(--ui-edge) 0 0 var(--ui-warning);
}

td.is-dirty {
  background: var(--ui-warning-subtle);
}
td.is-dirty .form-control,
td.is-dirty .numeric,
td.is-dirty .money {
  border-color: var(--ui-warning);
}

.form-group.is-dirty > label,
.form-group.is-dirty .field-foot,
.field.is-dirty > label,
.field.is-dirty .field-foot {
  color: var(--ui-warning);
}
.form-group.is-dirty .form-control,
.form-group.is-dirty .field-input,
.form-group.is-dirty .pick-trigger,
.form-group.is-dirty .pick-input,
.form-group.is-dirty .money,
.field.is-dirty .form-control,
.field.is-dirty .field-input,
.field.is-dirty .pick-trigger,
.field.is-dirty .pick-input,
.field.is-dirty .money {
  border-color: var(--ui-warning);
}

.widget-foot.is-dirty,
[data-widget-foot].is-dirty,
.is-dirty > .widget-foot {
  background: var(--ui-warning-subtle);
  border-color: var(--ui-warning-edge);
}

.field.is-warn .form-control,
.field.is-warn .field-input,
.field.is-warn .pick-trigger,
.field.is-warn .pick-input {
  background: var(--ui-warning-subtle);
  border-color: var(--ui-warning-edge);
}

.banner {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ui-space-2);
  margin-block-end: var(--ui-space-4);
  padding: var(--ui-space-3) var(--ui-space-4);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-subtle);
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}
.banner[hidden] {
  display: none;
}
.banner:has(> .banner-close) {
  padding-inline-end: calc(var(--ui-control) + var(--ui-space-3));
}
.banner--warning {
  border-color: var(--ui-warning-edge);
  background: var(--ui-warning-subtle);
}
.banner--danger {
  border-color: var(--ui-danger-edge);
  background: var(--ui-danger-subtle);
}
.banner--info {
  border-color: var(--ui-info-edge);
  background: var(--ui-info-subtle);
}
.banner--muted {
  border-color: var(--ui-muted-edge);
  background: var(--ui-muted-subtle);
}
.banner a {
  color: inherit;
  font-weight: 700;
  text-decoration: underline;
}
.banner a:hover {
  color: inherit;
}
.banner-title {
  font-weight: 700;
}
.banner-body {
  flex: 1 1 auto;
  min-inline-size: 0;
}
.banner-action {
  margin-inline-start: auto;
  white-space: nowrap;
}
.banner-close {
  position: absolute;
  inset-block-start: var(--ui-space-2);
  inset-inline-end: var(--ui-space-2);
  display: grid;
  place-items: center;
  inline-size: var(--ui-control);
  block-size: var(--ui-control);
  padding: 0;
  border: 0;
  border-radius: var(--ui-radius-sm);
  background: transparent;
  color: inherit;
  line-height: 0;
  cursor: pointer;
}
.banner-close:hover {
  background: var(--ui-ink-veil);
}

.bar-split {
  display: flex;
  align-items: center;
  width: 100%;
  margin: var(--ui-space-1) 0;
  border-radius: 999px;
  overflow: hidden;
}
.bar-split > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--ui-space-3);
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  transition: flex-basis 0.25s;
}
.bar-split > span[style*="width: 0%"], .bar-split > span[style*="width:0%"] {
  display: none;
}
.bar-split b {
  color: var(--ui-surface);
  font-size: var(--ui-type-micro);
}
.bar-split--sm > span {
  height: calc(var(--ui-space-1) * 1.5);
}
.bar-split--md > span {
  height: var(--ui-space-3);
}
.bar-split--lg > span {
  height: var(--ui-control-lg);
}
.bar-split--even > span {
  flex: 1 1 0;
}
.bar-split-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-1) var(--ui-space-4);
  font-size: var(--ui-type-micro);
  color: var(--ui-muted);
}
.bar-split-legend i {
  display: inline-block;
  width: var(--ui-space-3);
  height: var(--ui-space-3);
  border-radius: 2px;
  vertical-align: -1px;
  margin-inline-end: var(--ui-space-1);
}
.bar-split-legend b {
  color: var(--ui-ink);
}

.blockie {
  position: relative;
  padding: var(--ui-space-3);
  color: var(--ui-ink);
  text-align: start;
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
}
.blockie.is-current {
  border-color: var(--ui-accent-edge);
}
.blockie[class*=tone-] {
  background: var(--tone);
  border-color: var(--tone-deep);
}
.blockie--hued {
  --hue: 160;
  border-inline-start: var(--ui-edge) solid hsl(var(--hue), 45%, 62%);
}
.blockie--hued:hover, .blockie--hued:focus-visible {
  border-color: var(--ui-accent);
  background: hsl(var(--hue), 45%, 62%, 0.07);
}
.blockie [data-text] {
  white-space: pre-wrap;
  word-break: break-word;
}
button.blockie,
a.blockie {
  color: inherit;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
button.blockie:hover, button.blockie:focus-visible,
a.blockie:hover,
a.blockie:focus-visible {
  border-color: var(--ui-accent);
  color: inherit;
  text-decoration: none;
}
button.blockie:disabled,
a.blockie:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.board-tile {
  --tone-ink: var(--ui-ink);
  min-height: var(--ui-w-2);
  border: var(--ui-border-width) solid transparent;
  color: var(--tone-ink);
  clip-path: shape(from 0% 0%, line to 100% 0%, line to 100% 100%, line to 68.52% 100%, curve to 57.41% 96.25% with 63.58% 100% / 61.11% 96.25%, line to 42.59% 96.25%, curve to 31.48% 100% with 38.89% 96.25% / 36.42% 100%, line to 0% 100%, close);
}
.board-tile[class*=tone-] {
  border-color: var(--tone-deep);
}
.board-tile[class*=tone-] .board-tile-hint {
  color: var(--tone-ink);
}
.board-tile[class*=tone-]:hover, .board-tile[class*=tone-]:focus {
  background: var(--tone-deep);
  color: var(--tone-ink);
  text-decoration: none;
}
.board-tile[class*=tone-] > .icon.board-tile-mark {
  filter: brightness(0) invert(var(--tone-mark));
  opacity: var(--tone-mark-op);
}
.board-tile--flat {
  min-height: 0;
  padding: var(--ui-space-3) var(--ui-space-4);
  clip-path: none;
  transition: border-color 150ms ease;
}
.board-tile--flat > .icon:not(.board-tile-mark) {
  position: relative;
  flex: none;
  margin: 0;
}
.board-tile--flat > .icon.board-tile-mark {
  height: 280%;
  transform: translate(32%, -50%);
}
.board-tile--flat:hover, .board-tile--flat:focus {
  border-color: var(--ui-accent);
}
.board-tile--soon {
  opacity: 0.72;
  pointer-events: none;
}
.board-tile > .icon.board-tile-mark {
  position: absolute;
  top: 50%;
  inset-inline-end: 0;
  width: auto;
  height: 130%;
  aspect-ratio: 1;
  margin: 0;
  opacity: 0.08;
  transform: translate(46%, -50%);
  filter: brightness(0) invert(1);
  pointer-events: none;
}
.board-tile-body {
  flex: 1;
  color: inherit;
  text-decoration: none;
}
.board-tile-body:hover, .board-tile-action:hover {
  color: inherit;
  text-decoration: none;
}
.board-tile-hint {
  color: var(--ui-black-veil);
}
.board-tile-action {
  margin: 0 var(--ui-space-3) var(--ui-space-3);
  padding: var(--ui-space-2) var(--ui-space-3);
  background: var(--ui-white-veil);
  color: inherit;
  text-decoration: none;
}
.board-tile-action:hover {
  background: var(--ui-white-veil);
}
@media (max-width: 767.98px) {
  .layout-cols-2 > .board-tile {
    min-height: var(--ui-w-1);
  }
  .layout-cols-2 > .board-tile > .board-tile-body {
    align-items: flex-start;
    justify-content: flex-start;
    gap: var(--ui-space-1) var(--ui-space-3);
    padding: var(--ui-space-3) var(--ui-space-3) calc(var(--ui-control-lg) + var(--ui-space-2));
    text-align: start;
  }
  .layout-cols-2 > .board-tile > .board-tile-body > .icon--lg {
    width: var(--ui-icon-md);
    height: var(--ui-icon-md);
    margin: 0;
  }
  .layout-cols-2 > .board-tile .board-tile-name {
    font-size: var(--ui-type-body);
    line-height: var(--ui-type-body-lh);
  }
  .layout-cols-2 > .board-tile .board-tile-hint {
    display: none;
  }
  .layout-cols-2 > .board-tile > .board-tile-action {
    position: absolute;
    inset-inline-end: var(--ui-space-2);
    bottom: var(--ui-space-2);
    width: var(--ui-control);
    height: var(--ui-control);
    gap: 0;
    margin: 0;
    padding: 0;
    font-size: 0;
  }
  .layout-cols-2 > .board-tile > .board-tile-action > .icon {
    margin: 0;
  }
  .layout-cols-1 > .board-tile {
    flex-direction: row;
    align-items: center;
    min-height: calc(var(--ui-control-lg) * 2);
    padding-inline-end: var(--ui-space-3);
  }
  .layout-cols-1 > .board-tile > .board-tile-body {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--ui-space-1) var(--ui-space-3);
    padding: var(--ui-space-3);
    text-align: start;
  }
  .layout-cols-1 > .board-tile > .board-tile-body > .icon--lg {
    width: var(--ui-icon-md);
    height: var(--ui-icon-md);
    margin: 0;
    grid-row: span 2;
  }
  .layout-cols-1 > .board-tile .board-tile-name {
    font-size: var(--ui-type-body);
    line-height: var(--ui-type-body-lh);
  }
  .layout-cols-1 > .board-tile .board-tile-hint {
    display: none;
  }
  .layout-cols-1 > .board-tile > .board-tile-action {
    flex: none;
    width: var(--ui-control-lg);
    height: var(--ui-control-lg);
    gap: 0;
    margin: 0;
    padding: 0;
    font-size: 0;
  }
  .layout-cols-1 > .board-tile > .board-tile-action > .icon {
    margin: 0;
  }
  .layout-cols-1 > .board-tile:only-child {
    min-height: calc(var(--ui-control-lg) * 2 + var(--ui-space-4));
  }
  .layout-cols-1 > .board-tile:only-child .board-tile-hint {
    display: block;
  }
}
@container board (max-width: 39.98rem) {
  :is(.layout-cols-2, .layout-cols-3, .layout-cols-4) > .board-tile {
    min-height: var(--ui-w-1);
  }
  :is(.layout-cols-2, .layout-cols-3, .layout-cols-4) > .board-tile > .board-tile-body {
    padding: var(--ui-space-3);
  }
  :is(.layout-cols-2, .layout-cols-3, .layout-cols-4) > .board-tile > .board-tile-body > .icon--lg {
    width: var(--ui-icon-md);
    height: var(--ui-icon-md);
    margin: 0;
  }
  :is(.layout-cols-2, .layout-cols-3, .layout-cols-4) > .board-tile .board-tile-name {
    font-size: var(--ui-type-body);
  }
  :is(.layout-cols-2, .layout-cols-3, .layout-cols-4) > .board-tile .board-tile-hint,
  :is(.layout-cols-2, .layout-cols-3, .layout-cols-4) > .board-tile .board-tile-action {
    display: none;
  }
  .layout-cols-1 > .board-tile > .board-tile-body {
    padding: var(--ui-space-3);
  }
}

.bubble {
  max-width: 82%;
  padding: var(--ui-space-3);
  border-radius: var(--ui-radius-md);
  box-shadow: var(--ui-shadow-sm);
}
.bubble--theirs {
  align-self: flex-start;
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-end-start-radius: var(--ui-space-1);
}
.bubble--mine {
  align-self: flex-end;
  background: var(--ui-info-subtle);
  border: var(--ui-border-width) solid var(--ui-info-edge);
  border-end-end-radius: var(--ui-space-1);
}
.bubble-who {
  margin: 0;
  font-size: var(--ui-type-caption);
  font-weight: 700;
}
.bubble-text {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}
.bubble-time {
  display: block;
  margin-block-start: var(--ui-space-1);
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
}

.bulk-apply {
  display: inline-flex;
  align-items: stretch;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  display: flex;
  width: 100%;
  min-width: 0;
  height: calc(var(--ui-control) - var(--ui-space-1));
  font-size: var(--ui-type-caption);
}
.bulk-apply:focus-within {
  border-color: var(--ui-accent);
}
.bulk-apply:has(:focus-visible) {
  box-shadow: var(--ui-focus-ring);
}
.bulk-apply > button:focus-visible {
  background-color: var(--ui-accent-soft);
  box-shadow: inset 0 0 0 2px var(--ui-accent);
}
.bulk-apply > * {
  border-radius: 0;
  border: 0;
  background-color: transparent;
  box-shadow: none;
  height: auto;
  align-self: stretch;
}
.bulk-apply > :first-child {
  border-start-start-radius: 999px;
  border-end-start-radius: 999px;
}
.bulk-apply > :last-child {
  border-start-end-radius: 999px;
  border-end-end-radius: 999px;
}
.bulk-apply > * + * {
  border-left: var(--ui-border-width) solid var(--ui-border);
}
.bulk-apply--action .bulk-apply-go {
  width: 100%;
  padding-inline: var(--ui-space-2);
  font-weight: 600;
}
.bulk-apply-sign {
  flex: none;
  padding: 0 var(--ui-space-2);
}
.bulk-apply-value {
  flex: 1;
  min-width: 0;
  padding: var(--ui-space-1) var(--ui-space-2);
}
.bulk-apply-value:focus {
  outline: 0;
}
.bulk-apply-value::placeholder {
  color: var(--ui-muted);
  opacity: 0.7;
}
.bulk-apply-go {
  width: calc(var(--ui-control) - var(--ui-space-1));
  color: var(--ui-accent-strong);
}
.bulk-apply-go:hover {
  background-color: var(--ui-accent-soft);
}
.bulk-apply-go .icon {
  margin: 0;
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  opacity: 1;
}

.btn {
  border-radius: 999px;
  padding-inline: var(--ui-space-5);
}

.btn-sm,
.btn-group-sm > .btn {
  padding-inline: var(--ui-space-4);
}

.btn-xs,
.btn-group-xs > .btn {
  padding-inline: var(--ui-space-3);
}

.btn.btn-transparent {
  color: var(--ui-muted);
  background: transparent;
  border-color: transparent;
}
@media (hover: hover) {
  .btn.btn-transparent:hover {
    color: var(--ui-ink);
    background: var(--ui-subtle);
    border-color: transparent;
  }
}
.btn.btn-transparent:focus, .btn.btn-transparent.focus, .btn.btn-transparent:focus-visible {
  outline: none;
  box-shadow: var(--ui-focus-ring);
}
.btn.btn-transparent:active, .btn.btn-transparent:not(:disabled):not(.disabled):active, .btn.btn-transparent:not(:disabled):not(.disabled).active {
  color: var(--ui-ink);
  background: var(--ui-border);
  border-color: transparent;
}
.btn.btn-transparent.disabled, .btn.btn-transparent:disabled {
  color: var(--ui-muted);
  background: transparent;
  border-color: transparent;
}

.btn.emptymon {
  color: var(--ui-muted);
  background: transparent;
  border-radius: var(--ui-radius-md);
  border: var(--ui-border-width) dashed var(--ui-muted-edge);
}
@media (hover: hover) {
  .btn.emptymon:hover {
    color: var(--ui-muted);
    background: transparent;
    border-color: var(--ui-ink-edge);
    box-shadow: var(--ui-shadow-sm);
  }
}
.btn.emptymon:focus, .btn.emptymon.focus, .btn.emptymon:focus-visible {
  outline: none;
  color: var(--ui-muted);
  background: transparent;
  border-style: dashed;
  border-color: var(--ui-muted-edge);
  box-shadow: var(--ui-focus-ring-soft);
}
.btn.emptymon:active, .btn.emptymon:not(:disabled):not(.disabled):active, .btn.emptymon:not(:disabled):not(.disabled).active {
  color: var(--ui-muted);
  background: transparent;
  border-style: dashed;
  border-color: var(--ui-ink-edge);
  box-shadow: none;
}
.btn.emptymon.disabled, .btn.emptymon:disabled {
  color: var(--ui-muted);
  background: transparent;
  border-style: dashed;
  border-color: var(--ui-border);
  opacity: 0.65;
}

.btn-icon {
  display: inline-grid;
  place-items: center;
  width: var(--ui-control-lg);
  height: var(--ui-control-lg);
  padding: 0;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-muted);
  cursor: pointer;
}
.btn-icon:hover {
  background: var(--ui-bg);
  color: var(--ui-ink);
}

.btn-link[aria-current=true] {
  color: var(--ui-accent-strong);
  font-weight: 600;
}

.hit-area {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ui-control);
  height: var(--ui-control);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--ui-radius-sm);
  background: transparent;
  color: var(--ui-muted);
  cursor: pointer;
}
.hit-area:hover {
  background: var(--ui-subtle);
  color: var(--ui-ink);
}

.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) > .btn {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group > .btn-group:not(:last-child) > .btn {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

.btn-group-vertical > .btn:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) > .btn {
  border-start-start-radius: 0;
  border-start-end-radius: 0;
}

.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group-vertical > .btn-group:not(:last-child) > .btn {
  border-end-start-radius: 0;
  border-end-end-radius: 0;
}

.input-group > .input-group-prepend > .btn {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

.input-group > .input-group-append > .btn {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.input-group > .input-group-prepend:not(:first-child) > .btn,
.input-group > .input-group-append:not(:last-child) > .btn {
  border-radius: 0;
}

.callout {
  --accent: var(--ui-accent);
  margin: 0;
  padding: var(--ui-space-2) var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-inline-start: var(--ui-edge) solid var(--accent);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-surface);
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
}
.callout.is-ok {
  border-inline-start-color: var(--ui-success);
  background: var(--ui-success-subtle);
}
.callout.is-warn {
  border-inline-start-color: var(--ui-warning);
  background: var(--ui-warning-subtle);
}
.callout.is-bad {
  border-inline-start-color: var(--ui-danger);
  background: var(--ui-danger-subtle);
}

.calendar {
  width: 100%;
  height: 100%;
  overflow: hidden;
  table-layout: fixed;
}
.calendar--line, .calendar-shell.calendar--line {
  overflow: auto;
}
.calendar th {
  user-select: none;
  padding: var(--ui-space-2);
  background-color: var(--ui-accent);
  color: var(--ui-surface);
  text-align: center;
}
.calendar th:first-of-type {
  border-start-start-radius: var(--ui-radius-sm);
  border-end-start-radius: var(--ui-radius-sm);
}
.calendar th:last-of-type {
  border-start-end-radius: var(--ui-radius-sm);
  border-end-end-radius: var(--ui-radius-sm);
}
.calendar th.heading {
  background-color: var(--ui-accent-strong);
}
.calendar td {
  text-align: center;
  vertical-align: top;
  padding: 0;
}
.calendar td div {
  min-height: var(--ui-control-sm);
  padding: 2px;
  margin: 1px;
  font-weight: bold;
  border-inline-start: var(--ui-border-width) solid var(--ui-border);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  border-end-start-radius: var(--ui-radius-sm);
}
.calendar td div > span {
  display: block;
}
.calendar td.current > div {
  background-color: var(--ui-ink-emphasis);
  color: var(--ui-white);
}
.calendar td.weekend:not(.current) > div {
  opacity: 0.45;
  color: var(--ui-muted);
  background-color: var(--ui-subtle);
}
.calendar td.not-current {
  background-color: var(--ui-subtle);
  color: var(--ui-muted);
  font-weight: normal;
  font-size: var(--ui-type-caption);
}
.calendar .events {
  display: block;
}
.calendar .event {
  display: block;
  padding: 2px;
  background-color: var(--ui-muted-edge);
  border-radius: var(--ui-radius-sm);
  margin: 1px 0;
}
.calendar .event.production {
  width: 100%;
}
.calendar .event.shipment, .calendar .event.purchase {
  width: 0;
  padding: var(--ui-space-1);
  margin: auto;
}
.calendar-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: auto;
}
.calendar-line {
  --calendar-line-cols: 15;
  display: grid;
  grid-template-columns: repeat(var(--calendar-line-cols), minmax(0, 1fr));
  grid-auto-rows: auto;
  column-gap: 2px;
  row-gap: 2px;
  align-content: start;
  height: 100%;
  min-height: 0;
  padding: 2px;
}
.calendar-line-day {
  display: flex;
  align-items: center;
  flex-direction: column;
  min-width: 0;
  padding: var(--ui-space-1) 2px;
  border-inline-start: var(--ui-border-width) solid var(--ui-border);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  border-end-start-radius: var(--ui-radius-sm);
}
.calendar-line-day.is-current {
  background-color: var(--ui-ink-emphasis);
  color: var(--ui-white);
}
.calendar-line-day--weekend:not(.is-current) {
  opacity: 0.45;
  color: var(--ui-muted);
  background-color: var(--ui-subtle);
}
.calendar-line-date {
  display: flex;
  align-items: center;
  flex-direction: column;
  font-weight: bold;
}
.calendar-line-weekday {
  font-size: var(--ui-type-caption);
  opacity: 0.8;
}
.calendar-line-bar {
  min-width: 0;
  min-height: var(--ui-space-5);
  padding: 2px var(--ui-space-1);
  margin: 0 1px;
  font-size: var(--ui-type-caption);
  font-weight: normal;
  line-height: 1.2;
  color: var(--ui-black);
  border-radius: var(--ui-radius-sm);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chart-bar {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: calc(var(--ui-w-1) - var(--ui-space-4));
  padding-block-end: var(--ui-space-5);
}
.chart-bar-col {
  position: relative;
  flex: 1 1 0;
  height: 100%;
  display: flex;
  align-items: flex-end;
  border-radius: var(--ui-radius-sm) var(--ui-radius-sm) 0 0;
}
.chart-bar-col.is-current .chart-bar-fill {
  background: var(--ui-accent);
}
.chart-bar-col.is-bad .chart-bar-fill {
  background: var(--ui-danger-veil);
}
.chart-bar-fill {
  display: block;
  width: 100%;
  background: var(--ui-ink-veil);
  border-radius: var(--ui-radius-sm) var(--ui-radius-sm) 0 0;
}
.chart-bar-label {
  position: absolute;
  bottom: calc(-1 * var(--ui-space-5));
  inset-inline: 0;
  text-align: center;
  font-size: var(--ui-type-micro);
  color: var(--ui-muted);
  font-variant-numeric: tabular-nums;
}

.chart-mark {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-1);
  font-size: var(--ui-type-caption);
}
.chart-mark.is-warn i {
  background: var(--ui-warning);
  opacity: 0.45;
}
.chart-mark.is-bad i {
  background: var(--ui-danger);
}
.chart-mark i {
  width: var(--ui-icon-xs);
  height: var(--ui-space-2);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-accent);
}
.chart-mark-line {
  display: inline-block;
  width: var(--ui-icon-xs);
  border-block-start: 2px solid var(--ui-muted);
}
.chart-mark-line--dashed {
  border-block-start-style: dashed;
  border-block-start-color: var(--ui-ink);
}

.chart-marks {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2) var(--ui-space-4);
  margin-block-start: var(--ui-space-3);
}

.check-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.check-list > li {
  position: relative;
  padding-inline-start: var(--ui-space-6);
}
.check-list > li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.35em;
  width: var(--ui-space-3);
  height: var(--ui-space-2);
  border-inline-start: 2px solid var(--ui-accent);
  border-block-end: 2px solid var(--ui-accent);
  transform: rotate(-45deg);
}

.chip {
  --tint: var(--ui-muted);
  --channel-ink: var(--ui-white);
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-2);
  padding: var(--ui-space-2) var(--ui-space-3);
  border-radius: 999px;
  border: var(--ui-border-width) solid var(--ui-border);
  background: var(--ui-surface);
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  font-weight: 600;
  line-height: 1.1;
  text-decoration: none;
  box-shadow: var(--ui-shadow-sm);
  transition: transform 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, background 0.14s ease, color 0.14s ease;
}
@media (hover: hover) {
  .chip:hover {
    color: var(--ui-ink);
    border-color: var(--tint-edge);
    box-shadow: var(--ui-shadow-md);
    text-decoration: none;
    transform: translateY(-1px);
  }
  .chip:hover:focus-visible {
    transform: translateY(-1px);
  }
}
.chip:focus-visible {
  outline: none;
  color: var(--ui-ink);
  border-color: var(--tint-edge);
  box-shadow: var(--ui-shadow-md);
  text-decoration: none;
  box-shadow: var(--ui-focus-ring), var(--ui-shadow-md);
}
.chip:active {
  transform: none;
  box-shadow: var(--ui-shadow-sm);
}
.chip.is-active, .chip[aria-pressed=true], .chip:has(input:checked) {
  background: var(--tint-subtle);
  border-color: var(--tint-edge);
  color: var(--ui-ink);
  box-shadow: var(--ui-shadow-sm), inset 0 0 0 1px var(--tint-halo);
}
.chip.is-active .chip-count, .chip[aria-pressed=true] .chip-count, .chip:has(input:checked) .chip-count {
  background: var(--tint);
  color: var(--channel-ink);
}
@media (hover: hover) {
  .chip.is-active:hover, .chip[aria-pressed=true]:hover, .chip:has(input:checked):hover {
    border-color: var(--tint-edge-on);
    box-shadow: var(--ui-shadow-md), inset 0 0 0 1px var(--tint-halo);
  }
}
.chip.is-active:focus-visible, .chip[aria-pressed=true]:focus-visible, .chip:has(input:checked):focus-visible {
  border-color: var(--tint-edge-on);
  box-shadow: var(--ui-focus-ring), var(--ui-shadow-sm), inset 0 0 0 1px var(--tint-halo);
}
.chip.is-active:active, .chip[aria-pressed=true]:active, .chip:has(input:checked):active {
  box-shadow: var(--ui-shadow-sm), inset 0 0 0 1px var(--tint-halo);
}
.chip.is-empty:not(.is-active) {
  opacity: 0.5;
}
@media (hover: hover) {
  .chip.is-empty:not(.is-active):hover {
    opacity: 0.9;
  }
}
.chip.is-empty:not(.is-active):focus-visible {
  opacity: 0.9;
}
.chip--connect {
  border-style: dashed;
  box-shadow: none;
}
.chip--connect .icon {
  width: calc(var(--ui-icon-xs) * 1.25);
  height: calc(var(--ui-icon-xs) * 1.25);
  flex: none;
  opacity: 0.7;
}
.chip--connect .chip-name {
  color: var(--ui-muted);
}
@media (hover: hover) {
  .chip--connect:hover .icon {
    opacity: 1;
  }
  .chip--connect:hover .chip-name {
    color: var(--ui-ink);
  }
}
.chip--connect:focus-visible .icon {
  opacity: 1;
}
.chip--connect:focus-visible .chip-name {
  color: var(--ui-ink);
}
.chip-icon {
  width: calc(var(--ui-icon-xs) * 1.25);
  height: calc(var(--ui-icon-xs) * 1.25);
  border-radius: 50%;
  object-fit: cover;
  background: var(--tint-subtle);
  flex: none;
}
.chip-dot {
  width: var(--ui-space-2);
  height: var(--ui-space-2);
  margin: 0 2px;
  border-radius: 50%;
  background: var(--tint);
  flex: none;
}
.chip-name {
  color: var(--ui-ink);
}
.chip-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  padding: 0 var(--ui-space-2);
  border-radius: 999px;
  background: var(--ui-subtle);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2);
  margin-block-end: var(--ui-space-4);
}
.chips:has(+ .chips-hint) {
  margin-block-end: var(--ui-space-2);
}
.chips--compact {
  display: none;
}
.chips-label {
  font-size: var(--ui-type-micro);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ui-muted);
  margin: 0 0 var(--ui-space-2);
}
.chips-hint {
  margin: 0 0 var(--ui-space-4);
  padding: var(--ui-space-3) var(--ui-space-4);
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-sm);
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}
.chips-hint a {
  font-weight: 600;
  color: var(--ui-ink);
}
@media (max-width: 991.98px) {
  .chips-label, .chips {
    display: none;
  }
  .chips--compact {
    display: inline-block;
    margin-block-end: var(--ui-space-4);
  }
  .chips--compact:has(~ .chips-hint) {
    margin-block-end: var(--ui-space-2);
  }
  .chips--compact .chip:hover,
  .chips--compact .chip:focus-visible {
    transform: none;
  }
  .chips--compact .dropdown-menu {
    padding: var(--ui-space-2);
    min-width: var(--ui-w-3);
  }
  .chips--compact .dropdown-item {
    display: flex;
    align-items: center;
    gap: var(--ui-space-2);
    border-radius: var(--ui-radius-sm);
  }
  .chips--compact .dropdown-item:hover, .chips--compact .dropdown-item:focus-visible {
    background: var(--ui-subtle);
    color: var(--ui-ink);
    outline: none;
    text-decoration: none;
  }
  .chips--compact .dropdown-item:focus-visible {
    box-shadow: var(--ui-focus-ring-soft);
  }
  .chips--compact .dropdown-item:active {
    background: var(--ui-muted-subtle);
  }
  .chips--compact .dropdown-item.is-current {
    background: var(--tint-subtle);
    color: var(--ui-ink);
  }
  .chips--compact .dropdown-item.is-current:hover, .chips--compact .dropdown-item.is-current:focus-visible {
    background: var(--tint-medium);
  }
  .chips--compact .dropdown-item.is-current:focus-visible {
    box-shadow: var(--ui-focus-ring-soft);
  }
  .chips--compact .dropdown-item.chip--connect .icon {
    width: calc(var(--ui-icon-xs) * 1.25);
    height: calc(var(--ui-icon-xs) * 1.25);
    flex: none;
    opacity: 0.7;
  }
  .chips--compact .dropdown-item.chip--connect:hover .icon, .chips--compact .dropdown-item.chip--connect:focus-visible .icon {
    opacity: 1;
  }
  .chips--compact .dropdown-item .chip-count {
    margin-inline-start: auto;
  }
}

.board-del {
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  padding: 0;
  margin-inline-start: calc(-1 * var(--ui-space-1));
  color: var(--ui-muted);
  line-height: 1;
}
.board-del:hover {
  color: var(--ui-danger);
}

.clear-input.has-text .clear-input-x {
  display: grid;
}
.clear-input .clear-input-x {
  display: none;
  font-size: var(--ui-type-micro);
  line-height: 1;
}

.clone-arrow {
  justify-self: center;
}
.clone-arrow .icon {
  margin: 0;
  opacity: 0.55;
}
.clone-arrow-across {
  display: none;
}
@media (min-width: 62rem) {
  .clone-arrow {
    align-self: start;
    margin-block-start: calc(var(--ui-control-lg) + var(--ui-space-4));
  }
  .clone-arrow .clone-arrow-across {
    display: inline-block;
  }
  .clone-arrow .clone-arrow-down {
    display: none;
  }
}

.dashboard-page--edit .dashboard-grid-host {
  background: var(--ui-ink-veil);
  overflow: hidden;
}
.dashboard-page--edit .dashboard-widget {
  cursor: move;
}
.dashboard-page--edit .remove-widget {
  position: absolute;
  top: var(--ui-space-2);
  inset-inline-end: var(--ui-space-2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ui-space-5);
  height: var(--ui-space-5);
  padding: 0;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-surface);
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}
.dashboard-page--edit .remove-widget:hover, .dashboard-page--edit .remove-widget:focus {
  color: var(--ui-ink);
  border-color: var(--ui-ink);
  background: var(--ui-ink-subtle);
}
.dashboard-edit-btn {
  gap: var(--ui-space-1);
}
.dashboard-grid-host {
  min-height: var(--ui-w-4);
  transition: background-color 0.2s ease, padding 0.2s ease;
}

.dashboard-widget--edit {
  cursor: move;
}
.dashboard-widget-head {
  display: flex;
  align-items: center;
  gap: var(--ui-space-2);
  flex-shrink: 0;
  padding: var(--ui-space-2) var(--ui-space-3);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  font-weight: 600;
}
.dashboard-widget-head > a,
.dashboard-widget-head > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-widget-head > a {
  color: inherit;
  text-decoration: none;
}
.dashboard-widget-head > a:hover, .dashboard-widget-head > a:focus {
  color: inherit;
  text-decoration: none;
}
.dashboard-widget-head > button,
.dashboard-widget-head > .dropdown {
  margin-inline-start: auto;
  flex-shrink: 0;
}
.dashboard-widget-head .icon {
  margin: 0;
}
.dashboard-widget-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--ui-space-2);
  flex-shrink: 0;
  padding: var(--ui-space-2) var(--ui-space-3);
  border-block-start: var(--ui-border-width) solid var(--ui-border);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-weight: 400;
  line-height: var(--ui-leading-snug);
}
.dashboard-widget-footer [data-meli-tricky-updated-wrap] {
  min-width: 0;
}
.dashboard-widget-footer [data-meli-tricky-updated-stamp],
.dashboard-widget-footer [data-meli-tricky-updated-pending] {
  min-width: 0;
}
.dashboard-widget-footer [data-meli-tricky-updated-stamp] time {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}
.dashboard-widget-footer [data-meli-tricky-updated-stamp] time::first-letter {
  text-transform: lowercase;
}
.dashboard-widget-body {
  display: flex;
  flex: 1 1 auto;
  align-items: stretch;
  min-height: 0;
  overflow: auto;
  padding: var(--ui-space-2) var(--ui-space-3);
}
.dashboard-widget-body > * {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
}
.dashboard-widget-body .widget-chart {
  min-height: calc(var(--ui-control-lg) * 2);
}
.dashboard-widget-drag-overlay {
  inset: 0;
  cursor: move;
  background: var(--ui-surface-veil);
  border-radius: inherit;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--ui-type-caption);
}
.data-table--cols {
  table-layout: fixed;
  width: 59rem;
  min-width: 100%;
}
.data-table col.data-table-name {
  width: 3rem;
}
.data-table tr.is-warn > td {
  background: var(--ui-warning-subtle);
}
.data-table tr.is-bad > td {
  background: var(--ui-danger-subtle);
}
.data-table--dense th,
.data-table--dense td {
  padding: var(--ui-space-1) var(--ui-space-2);
}
.data-table--striped tbody tr:nth-child(even) > td {
  background: var(--ui-subtle);
}
.data-table--hover tbody tr:hover > td {
  background: var(--ui-subtle);
}
.data-table th,
.data-table td {
  padding: var(--ui-space-2) var(--ui-space-3);
  text-align: start;
  vertical-align: middle;
  white-space: nowrap;
  border-block-end: var(--ui-border-width) solid var(--ui-border);
}
.data-table th {
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
  font-weight: 600;
  color: var(--ui-muted);
}
.data-table tbody tr:last-child td {
  border-block-end: 0;
}
.data-table tbody tr:focus-within > td {
  box-shadow: inset 0 -1px 0 var(--ui-accent-soft);
}
.data-table th.data-table-field,
.data-table td.data-table-field {
  padding-inline: 0;
}
.data-table-note {
  white-space: normal;
}
.data-table-num {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-variant-numeric: tabular-nums;
  text-align: end;
}
.data-table-frame {
  overflow-x: auto;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-sm);
}

.deck {
  overflow-x: hidden;
}
.deck-root {
  scroll-snap-type: y mandatory;
}
.deck-nav {
  position: fixed;
  inset-inline-end: var(--ui-space-4);
  bottom: var(--ui-space-4);
  display: none;
  align-items: center;
  gap: var(--ui-space-2);
}
.deck-nav button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ui-control-lg);
  height: var(--ui-control-lg);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-ink);
  font-size: var(--ui-type-body);
  line-height: 1;
  cursor: pointer;
  box-shadow: var(--ui-shadow-md);
}
.deck-nav button:hover {
  border-color: var(--ui-dom-ink);
  color: var(--ui-dom-strong);
}
.deck-nav button:focus-visible {
  outline: none;
  box-shadow: var(--ui-focus-ring);
}
.deck-nav output {
  display: inline-flex;
  align-items: center;
  height: var(--ui-control-lg);
  padding: 0 var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-ink);
  font-size: var(--ui-type-micro);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  box-shadow: var(--ui-shadow-md);
}
.deck-nav span {
  display: inline-flex;
  gap: var(--ui-space-2);
}
.deck .deck-nav {
  display: flex;
}
.deck .novo-crumb,
.deck .page-chrome,
.deck .subnav,
.deck .chips-label,
.deck .chips,
.deck .filter-card,
.deck .index-rail {
  display: none;
}
.deck .trail {
  margin-block-end: 0;
  border-block-start: 0;
  border-inline-end: 0;
  border-radius: 0;
}
.deck .band {
  justify-content: center;
  min-height: calc(100svh - var(--ui-chrome-h));
  padding: var(--ui-space-6) 0;
  border-block-start: 0;
  scroll-snap-align: start;
}
.deck .band + .band {
  border-block-start: var(--ui-border-width) dashed var(--ui-border);
}
.deck .band > * {
  width: 100%;
  max-width: var(--ui-w-8);
  margin-inline: auto;
}

@media print {
  @page {
    size: landscape;
    margin: 12mm;
  }
  .deck .deck-nav,
  .deck .index-rail,
  .trail aside,
  .filter-card,
  .subnav,
  .chips,
  .chips-label {
    display: none;
  }
  html {
    scroll-snap-type: none;
  }
  .band {
    min-height: 0;
    padding: 0 0 var(--ui-space-4);
    border-block-start: 0;
    break-inside: avoid;
    break-after: page;
  }
  .band:last-child {
    break-after: auto;
  }
  .trail {
    position: static;
    box-shadow: none;
  }
}
.delta {
  display: inline-flex;
  align-items: baseline;
  gap: var(--ui-space-1);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  white-space: nowrap;
}
.delta--zero .delta-to {
  color: var(--ui-warning-emphasis);
}
.delta-from {
  color: var(--ui-muted);
  font-weight: 400;
}
.delta-arrow {
  color: var(--ui-muted);
}

.detail-block + .detail-block {
  margin-block-start: var(--ui-space-4);
}
.detail-block--warn .detail-block-head, .detail-block--note .detail-block-head {
  color: var(--ui-ink);
}
.detail-block-head {
  margin: 0 0 var(--ui-space-2);
  font-size: var(--ui-type-micro);
  letter-spacing: 0.08em;
}

.detail-list {
  margin: 0;
  padding-inline-start: var(--ui-space-5);
  font-size: var(--ui-type-caption);
  line-height: 1.7;
}

.diff {
  overflow: hidden;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
}
.diff ins,
.diff del {
  padding-inline: 2px;
  border-radius: var(--ui-radius-sm);
  color: inherit;
  text-decoration: none;
}
.diff ins {
  background: var(--ui-success-edge);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.diff del {
  background: var(--ui-danger-edge);
}
.diff-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ui-space-2);
  padding: var(--ui-space-2) var(--ui-space-4);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  background: var(--ui-subtle);
  font-size: var(--ui-type-caption);
}
.diff-sign {
  font-weight: 700;
  text-align: center;
}
.diff-line {
  display: grid;
  grid-template-columns: var(--ui-space-5) minmax(0, 1fr);
  gap: var(--ui-space-2);
  padding: var(--ui-space-2) var(--ui-space-4);
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
  overflow-wrap: anywhere;
}
.diff-line--ctx {
  color: var(--ui-muted);
}
.diff-line--del {
  background: var(--ui-danger-subtle);
}
.diff-line--del > :last-child {
  text-decoration: line-through;
  text-decoration-color: var(--ui-danger-emphasis);
}
.diff-line--add {
  background: var(--ui-success-subtle);
}
.diff-fold {
  padding: var(--ui-space-2) var(--ui-space-4);
  border-block-start: var(--ui-border-width) dashed var(--ui-border);
  background: var(--ui-surface);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  text-align: center;
}
.diff-fold:first-child {
  border-block-start: 0;
}

.disclosure {
  margin-block-end: var(--ui-space-4);
}
.disclosure:not(tbody):not(.is-open):not([open]) > .disclosure-body {
  box-sizing: border-box;
  display: block;
  overflow: hidden;
  block-size: 0;
  padding-block: 0;
  border-block-start-width: 0;
  transition: block-size 0.25s ease, padding-block 0.25s ease, border-block-start-width 0.25s ease;
}
.disclosure.is-open:not(tbody) > .disclosure-body, .disclosure[open]:not(tbody) > .disclosure-body {
  display: block;
  overflow: visible;
  box-sizing: border-box;
  block-size: auto;
  transition: block-size 0.25s ease, padding-block 0.25s ease, border-block-start-width 0.25s ease;
}
.disclosure.is-open:not(tbody) > .disclosure-body.stack, .disclosure[open]:not(tbody) > .disclosure-body.stack {
  display: flex;
}
.disclosure.is-open:not(tbody) > .disclosure-body.fact-grid, .disclosure[open]:not(tbody) > .disclosure-body.fact-grid {
  display: grid;
}
.disclosure::details-content {
  overflow: hidden;
  block-size: 0;
  transition: block-size 0.25s ease, content-visibility 0.25s ease allow-discrete;
}
.disclosure[open]::details-content {
  block-size: auto;
}
.disclosure--framed {
  margin-block-end: 0;
  overflow: hidden;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
}
.disclosure--framed > .disclosure-body {
  padding-block-start: var(--ui-space-3);
}
.disclosure--flat {
  margin-block-end: 0;
}
.disclosure--flat > .disclosure-body {
  padding: var(--ui-space-2) 0 0;
  border-block-start-width: 0;
}
.disclosure--tree > .disclosure-body {
  margin: 0;
  margin-block-end: var(--ui-space-2);
  margin-inline-start: var(--ui-space-3);
  padding: 0;
  padding-inline-start: var(--ui-space-3);
  border-block-start: 0;
  border-inline-start: var(--ui-border-width) solid var(--ui-border);
}
.disclosure-trigger {
  gap: var(--ui-space-2) var(--ui-space-3);
  border: 0;
  background: transparent;
  text-align: start;
}
.disclosure-trigger:hover {
  background: var(--ui-head-soft);
}
.disclosure-trigger .chevron {
  margin-inline-start: auto;
}
.disclosure-body {
  padding: 0 var(--ui-space-4) var(--ui-space-4);
  border-block-start: var(--ui-border-width) solid var(--ui-border);
}
.disclosure-body[hidden] {
  display: none;
}
summary.disclosure-trigger {
  list-style: none;
  cursor: pointer;
}
summary.disclosure-trigger::-webkit-details-marker {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .disclosure:not(tbody) > .disclosure-body,
  .disclosure::details-content {
    transition: none;
  }
}
.modal.bottom-drawer,
.modal.side-drawer {
  --drawer-width: var(--ui-w-5);
  overflow: hidden;
  padding: 0;
}
.modal.bottom-drawer .modal-dialog,
.modal.side-drawer .modal-dialog {
  width: min(var(--drawer-width), 100%);
  max-width: none;
  height: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
}
.modal.bottom-drawer .modal-dialog > *,
.modal.side-drawer .modal-dialog > * {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}
.modal.bottom-drawer .modal-content,
.modal.side-drawer .modal-content {
  flex: 1 1 auto;
  min-height: 0;
  border: 0;
  border-radius: 0;
  box-shadow: var(--ui-shadow-md);
  background: var(--ui-surface);
  color: var(--ui-ink);
}
.modal.bottom-drawer .modal-header,
.modal.bottom-drawer .modal-footer,
.modal.side-drawer .modal-header,
.modal.side-drawer .modal-footer {
  flex: 0 0 auto;
  border-color: var(--ui-border);
}
.modal.bottom-drawer .modal-body,
.modal.side-drawer .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.modal.bottom-drawer.fade .modal-dialog,
.modal.side-drawer.fade .modal-dialog {
  transition: transform 0.3s ease-out;
}

.modal.bottom-drawer.show {
  display: flex !important;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0 !important;
}
.modal.bottom-drawer .modal-dialog {
  margin: 0;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 85vh;
  flex: 0 1 auto;
  margin-top: auto;
  pointer-events: auto;
}
.modal.bottom-drawer .modal-dialog > * {
  flex: 0 1 auto;
}
.modal.bottom-drawer .modal-content {
  border-radius: var(--ui-radius-md) var(--ui-radius-md) 0 0;
}
.modal.bottom-drawer .modal-body {
  padding: 0;
}
.modal.bottom-drawer .modal-footer {
  display: none;
}
.modal.bottom-drawer.fade {
  opacity: 1;
  transition: opacity 0.32s linear;
}
.modal.bottom-drawer.fade .modal-dialog {
  transition: transform 0.32s cubic-bezier(0.32, 0.72, 0, 1);
  transform: translate3d(0, 100%, 0);
  will-change: transform;
}
.modal.bottom-drawer.fade.show .modal-dialog {
  transform: translate3d(0, 0, 0);
}
@media (prefers-reduced-motion: reduce) {
  .modal.bottom-drawer.fade {
    transition: none;
  }
  .modal.bottom-drawer.fade .modal-dialog {
    transition: none;
    will-change: auto;
  }
}
@media (min-width: 992px) {
  .modal.bottom-drawer.bottom-drawer--mixed {
    overflow-x: hidden;
    overflow-y: auto;
  }
  .modal.bottom-drawer.bottom-drawer--mixed.show {
    display: block !important;
  }
  .modal.bottom-drawer.bottom-drawer--mixed .modal-dialog {
    width: auto;
    max-width: calc(var(--ui-w-4) + var(--ui-w-1));
    height: auto;
    max-height: none;
    margin: var(--ui-space-7) auto;
    align-self: auto;
    display: block;
  }
  .modal.bottom-drawer.bottom-drawer--mixed .modal-dialog > * {
    display: block;
    flex: 0 1 auto;
  }
  .modal.bottom-drawer.bottom-drawer--mixed .modal-content {
    border-radius: var(--ui-radius-md);
  }
  .modal.bottom-drawer.bottom-drawer--mixed .modal-body {
    overflow-y: visible;
    padding: var(--ui-space-4);
  }
  .modal.bottom-drawer.bottom-drawer--mixed .modal-footer {
    display: flex;
  }
  .modal.bottom-drawer.bottom-drawer--mixed.fade .modal-dialog, .modal.bottom-drawer.bottom-drawer--mixed.fade:not(.show) .modal-dialog {
    transform: translateY(calc(-1 * var(--ui-space-8)));
    transition: transform 0.3s ease-out;
  }
  .modal.bottom-drawer.bottom-drawer--mixed.fade.show .modal-dialog {
    transform: none;
  }
}

body:has(.modal.bottom-drawer) .modal-backdrop.fade {
  transition: opacity 0.32s linear;
}

.modal.side-drawer .modal-dialog {
  margin-inline: auto 0;
}
.modal.side-drawer.fade .modal-dialog {
  transform: translateX(100%);
}
.modal.side-drawer.fade.show .modal-dialog {
  transform: none;
}
.modal.side-drawer.side-drawer--left .modal-dialog {
  margin-inline: 0 auto;
}
.modal.side-drawer.side-drawer--left.fade .modal-dialog {
  transform: translateX(-100%);
}
.modal.side-drawer.side-drawer--left.fade.show .modal-dialog {
  transform: none;
}
.modal.side-drawer.side-drawer--sweep {
  --drawer-w: min(var(--drawer-width), 100%);
  --drawer-rail: calc(var(--ui-control-lg) + var(--ui-space-4));
}
.modal.side-drawer.side-drawer--sweep .modal-dialog {
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  margin: 0;
  width: var(--drawer-w);
  max-width: none;
  height: 100%;
  will-change: transform, width;
}
.modal.side-drawer.side-drawer--sweep.fade .modal-dialog {
  transform: translateX(100vw);
  transition: transform 0.34s ease-out, width 0.3s ease;
}
.modal.side-drawer.side-drawer--sweep.fade.show .modal-dialog {
  transform: translateX(calc(100vw - var(--drawer-w)));
}
.modal.side-drawer.side-drawer--sweep.side-drawer--sweeping .modal-dialog, .modal.side-drawer.side-drawer--sweep.side-drawer--sweeping.fade.show .modal-dialog {
  animation: drawer-sweep 0.78s cubic-bezier(0.42, 0, 0.12, 1) both;
  transition: none;
}
.modal.side-drawer.side-drawer--sweep.side-drawer--sweeping-back .modal-dialog, .modal.side-drawer.side-drawer--sweep.side-drawer--sweeping-back.fade.show .modal-dialog {
  animation: drawer-sweep-back 0.66s cubic-bezier(0.42, 0, 0.2, 1) both;
  transition: none;
}
.modal.side-drawer.side-drawer--sweep [data-rail-show] {
  display: none;
}
body.has-workshop .modal.side-drawer.side-drawer--sweep {
  pointer-events: none;
}
body.has-workshop .modal.side-drawer.side-drawer--sweep.fade.show .modal-dialog {
  pointer-events: auto;
  transform: translateX(0);
  width: var(--drawer-w);
  border-inline-start: 0;
  box-shadow: var(--ui-shadow-md);
}
body.has-workshop .modal.side-drawer.side-drawer--sweep .close,
body.has-workshop .modal.side-drawer.side-drawer--sweep [data-dismiss=modal] {
  display: none;
}
body.has-workshop.has-workshop-rail .modal.side-drawer.side-drawer--sweep.fade.show .modal-dialog {
  width: var(--drawer-rail);
  overflow: hidden;
}
body.has-workshop.has-workshop-rail .modal.side-drawer.side-drawer--sweep.fade.show .modal-dialog [data-rail-hide] {
  display: none;
}
body.has-workshop.has-workshop-rail .modal.side-drawer.side-drawer--sweep.fade.show .modal-dialog [data-rail-show] {
  display: flex;
}
body.has-workshop.has-workshop-rail.has-peek .modal.side-drawer.side-drawer--sweep.fade.show .modal-dialog {
  width: var(--drawer-w);
  overflow: visible;
  box-shadow: var(--ui-shadow-md);
}
body.has-workshop.has-workshop-rail.has-peek .modal.side-drawer.side-drawer--sweep.fade.show .modal-dialog [data-rail-hide] {
  display: initial;
}
@media (max-width: 575.98px) {
  .modal.side-drawer.side-drawer--sweep.side-drawer--sweeping .modal-dialog, .modal.side-drawer.side-drawer--sweep.side-drawer--sweeping-back .modal-dialog {
    animation: none;
  }
}

@keyframes drawer-sweep {
  0% {
    transform: translateX(calc(100vw - var(--drawer-w)));
    width: var(--drawer-w);
  }
  42% {
    transform: translateX(22vw);
    width: calc(var(--drawer-w) * 1.85);
  }
  70% {
    transform: translateX(-2vw) skewX(-3deg);
    width: calc(var(--drawer-w) * 1.25);
  }
  100% {
    transform: translateX(0) skewX(0);
    width: var(--drawer-w);
  }
}
@keyframes drawer-sweep-back {
  0% {
    transform: translateX(0);
    width: var(--drawer-w);
  }
  42% {
    transform: translateX(20vw) skewX(3deg);
    width: calc(var(--drawer-w) * 1.7);
  }
  100% {
    transform: translateX(calc(100vw - var(--drawer-w)));
    width: var(--drawer-w);
  }
}
.dropzone {
  position: relative;
  display: inline-block;
  min-width: var(--ui-w-1);
  min-height: var(--ui-w-1);
  cursor: pointer;
  vertical-align: middle;
}
.dropzone.has-file .dropzone-preview {
  opacity: 1;
}
.dropzone--sm {
  min-width: calc(var(--ui-control-lg) + var(--ui-space-4));
  min-height: calc(var(--ui-control-lg) + var(--ui-space-4));
}
.dropzone--sm .dropzone-preview {
  width: calc(var(--ui-control-lg) + var(--ui-space-4));
  height: calc(var(--ui-control-lg) + var(--ui-space-4));
  line-height: calc(var(--ui-control-lg) + var(--ui-space-4));
  background-color: var(--ui-subtle);
  border-color: var(--ui-border);
}
.dropzone--sm:hover .dropzone-preview {
  border-color: var(--ui-accent);
}
.dropzone--sm.has-file .dropzone-preview {
  border-style: solid;
}
.dropzone--md {
  min-width: var(--ui-w-1);
  min-height: var(--ui-w-1);
}
.dropzone--md .dropzone-preview {
  width: var(--ui-w-1);
  height: var(--ui-w-1);
  line-height: var(--ui-w-1);
}
.dropzone input[type=file] {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  overflow: hidden;
}
.dropzone-preview {
  display: block;
  width: var(--ui-w-1);
  height: var(--ui-w-1);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: var(--ui-subtle);
  border: var(--ui-border-width) dashed var(--ui-ink-edge);
  border-radius: var(--ui-radius-sm);
  opacity: 0.6;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: var(--ui-w-1);
  text-align: center;
  font-size: var(--ui-type-caption);
  padding: 0 var(--ui-space-1);
}
.dropzone-crop-wrap {
  max-height: 60vh;
  overflow: hidden;
  background: var(--ui-subtle);
}
.dropzone-crop-wrap .dropzone-crop-img {
  display: block;
  max-width: 100%;
}
.dropzone-aspects {
  margin-block-end: var(--ui-space-3);
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-1);
}
.dropzone-aspects .dropzone-aspect.active {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
  color: var(--ui-surface);
}

.emitter {
  display: inline-flex;
  align-items: center;
  position: relative;
  gap: var(--ui-space-2);
  justify-content: center;
  pointer-events: auto;
}
.emitter--nudge {
  animation: emitter-nudge 0.35s ease;
}
.emitter--emit {
  animation: emitter-shake 0.42s ease;
}
.emitter .icon {
  flex-shrink: 0;
}
.emitter-badge {
  min-width: var(--ui-space-5);
  height: var(--ui-space-5);
  padding: 0 var(--ui-space-1);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-accent);
  color: var(--ui-surface);
  font-size: var(--ui-type-caption);
  line-height: 1;
}
.emitter-badge:not([hidden]) {
  position: absolute;
  top: calc(50% - var(--ui-space-5));
  inset-inline-start: calc(50% + var(--ui-space-1));
  margin: 0;
}
.emitter-badge--bounce {
  animation: emitter-bounce 0.5s ease;
}
.emitter-ring {
  position: fixed;
  z-index: var(--ui-layer-float);
  border-radius: 999px;
  border: 2px solid var(--ui-danger);
  background: var(--ui-danger-veil);
  pointer-events: none;
  will-change: transform, opacity;
}
.emitter-fly {
  position: fixed;
  z-index: var(--ui-layer-carry);
  margin: 0;
  pointer-events: none;
  box-shadow: var(--ui-shadow-md);
  opacity: 0.5;
  transform-origin: center;
  will-change: transform, opacity;
}

@keyframes emitter-bounce {
  0% {
    transform: scale(1);
  }
  30% {
    transform: scale(1.55);
  }
  55% {
    transform: scale(0.82);
  }
  78% {
    transform: scale(1.12);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes emitter-nudge {
  0%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-2px);
  }
}
@keyframes emitter-shake {
  0%, 100% {
    transform: translateX(0);
  }
  18% {
    transform: translateX(calc(-1 * var(--ui-edge)));
  }
  36% {
    transform: translateX(var(--ui-edge));
  }
  54% {
    transform: translateX(-2px);
  }
  72% {
    transform: translateX(2px);
  }
}
.fact {
  display: flex;
  align-items: baseline;
  gap: var(--ui-space-3);
}
.fact--md dt {
  flex-basis: calc(var(--ui-w-1) - var(--ui-space-2));
}
.fact--lg dt {
  flex-basis: calc(var(--ui-w-1) + var(--ui-space-4));
}
.fact dt {
  flex: 0 0 calc(var(--ui-w-1) - var(--ui-space-2));
  margin: 0;
  font-size: var(--ui-type-micro);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
}
.fact dd {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-size: var(--ui-type-caption);
  color: var(--ui-ink);
  overflow-wrap: anywhere;
}
.fact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(calc(var(--ui-w-2) - var(--ui-space-4)), 1fr));
  margin: 0;
}
.fact-grid dt {
  margin: 0 0 2px;
  font-size: var(--ui-type-micro);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
}
.fact-grid dd {
  margin: 0;
  font-size: var(--ui-type-caption);
  color: var(--ui-ink);
}
@media (max-width: 575.98px) {
  .fact dt {
    flex-basis: calc(var(--ui-w-1) * 0.75);
  }
}

.face {
  --face: var(--ui-thumb-sm);
  --h: 165;
  --rot: 0deg;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  justify-content: center;
  width: var(--face);
  height: var(--face);
  overflow: hidden;
  border: var(--ui-border-width) solid hsl(var(--h), 35%, 82%);
  border-radius: 999px;
  background: hsl(var(--h), 42%, 93%);
}
.face--md {
  --face: var(--ui-thumb-sm);
}
.face--lg {
  --face: var(--ui-thumb);
}
.face--soft {
  border-color: var(--ui-accent-subtle);
  background: var(--ui-accent-subtle);
  color: var(--ui-accent-strong);
}
.face img {
  display: block;
  width: 86%;
  height: 86%;
  object-fit: contain;
  filter: hue-rotate(var(--rot));
}
.face img[data-broken] {
  display: none;
}

.filter-bar {
  padding: var(--ui-space-4) var(--ui-space-5);
  border: var(--ui-border-width) solid var(--ui-border);
  box-shadow: var(--ui-shadow-sm);
}
.filter-bar-field {
  margin: 0;
  flex: 0 1 var(--ui-w-2);
}
.filter-bar-label {
  display: block;
  margin: 0 0 var(--ui-space-1);
}
.filter-bar-actions .btn-primary {
  min-width: var(--ui-w-1);
}
@media (min-width: 768px) {
  .filter-bar .filter-bar-fields {
    flex-direction: row;
    align-items: flex-end;
  }
  .filter-bar .filter-bar-field {
    flex: 0 1 var(--ui-w-2);
  }
  .filter-bar .filter-bar-field--grow {
    flex: 1 1 var(--ui-w-3);
  }
  .filter-bar .filter-bar-field--tight {
    flex: 0 0 calc(var(--ui-w-1) - var(--ui-space-4));
  }
}
@media (min-width: 992px) {
  .filter-bar {
    flex-direction: row;
    align-items: flex-end;
  }
}
@media (max-width: 991.98px) {
  .filter-bar .filter-bar-actions {
    justify-content: flex-end;
  }
}

[data-tags-filter] {
  display: contents;
}

.modal-dialog:has(.img-applier) {
  max-width: min(var(--ui-max) + var(--ui-space-7) * 2, 100vw - var(--ui-space-7));
}

.img-applier {
  --slot: calc(var(--ui-control-lg) * 2);
  --key: calc(var(--ui-w-2) - var(--ui-space-4));
  --gap: calc(var(--ui-space-1) * 1.5);
}
.img-applier.has-dragging {
  cursor: grabbing;
  user-select: none;
}
.img-applier[data-zoom="1"] {
  --slot: calc(var(--ui-control-lg) + var(--ui-space-4));
}
.img-applier[data-zoom="2"] {
  --slot: calc(var(--ui-control-lg) * 2);
}
.img-applier[data-zoom="3"] {
  --slot: calc(var(--ui-w-1) - var(--ui-space-6));
}
.img-applier--sm {
  --key: calc(var(--ui-w-1) + var(--ui-space-4));
}
.img-applier--md {
  --key: calc(var(--ui-w-2) - var(--ui-space-4));
}
.img-applier--strip {
  --slot: var(--ui-control-lg);
  --gap: var(--ui-space-1);
  display: flex;
  gap: var(--gap);
  align-items: center;
}
.img-applier--strip.is-active .img-applier-slot.is-empty {
  border-color: var(--ui-accent-edge);
}
.img-applier--strip .img-applier-slot.is-empty {
  border-style: solid;
  border-color: var(--ui-border-veil);
  background: var(--ui-ink-veil);
}
.img-applier--strip .img-applier-slot.is-empty:hover {
  border-style: solid;
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
}
.img-applier--sm .img-applier-bar {
  position: static;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}
.img-applier--sm .img-applier-main {
  min-height: 0;
}
.img-applier--one .img-applier-table {
  overflow: visible;
}
.img-applier--one .img-applier-pub:not(:first-child) .img-applier-row-head {
  display: none;
}
.img-applier-bar {
  position: sticky;
  inset-block-start: 0;
  padding: var(--ui-space-2) var(--ui-space-3);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  border-start-start-radius: var(--ui-radius-md);
  border-start-end-radius: var(--ui-radius-md);
  background: var(--ui-ink-subtle);
}
.img-applier-group {
  gap: var(--ui-space-1);
}
.img-applier-group + .img-applier-group {
  margin-inline-start: var(--ui-space-3);
  padding-inline-start: var(--ui-space-3);
  border-inline-start: var(--ui-border-width) solid var(--ui-border);
}
.img-applier-group--end {
  margin-inline-start: auto;
  padding-inline-start: 0;
  border-inline-start: 0;
}
.img-applier-btn {
  display: inline-grid;
  place-items: center;
  width: var(--ui-control);
  height: var(--ui-control);
  padding: 0;
  border: var(--ui-border-width) solid transparent;
  border-radius: var(--ui-radius-sm);
  background: none;
  color: var(--ui-ink);
  cursor: pointer;
}
.img-applier-btn:hover:not(:disabled) {
  border-color: var(--ui-border);
  background: var(--ui-surface);
}
.img-applier-btn:disabled {
  opacity: 0.3;
  cursor: default;
}
.img-applier-btn.is-active {
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}
.img-applier-btn .icon {
  flex: none;
  margin: 0;
}
.img-applier-btn.has-text {
  width: auto;
  gap: var(--ui-space-1);
  padding-inline: var(--ui-space-2);
  grid-auto-flow: column;
  font-size: var(--ui-type-caption);
  font-weight: 600;
}
.img-applier-count {
  padding: var(--ui-space-1) var(--ui-space-2);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
  font-size: var(--ui-type-caption);
}
.img-applier-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  min-height: var(--ui-w-5);
}
.img-applier-work {
  display: grid;
  align-content: start;
  padding-block-end: var(--ui-space-3);
}
.img-applier-table {
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}
.img-applier-row {
  --row-bg: var(--ui-surface);
  display: grid;
  grid-template-columns: var(--key) repeat(var(--cols), var(--slot));
  gap: var(--gap);
  align-items: center;
  min-width: max-content;
  padding-inline-end: var(--ui-space-3);
  background: var(--row-bg);
}
.img-applier-row:nth-of-type(odd) {
  --row-bg: var(--ui-ink-subtle);
}
.img-applier-row-head {
  --row-bg: var(--ui-surface);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
}
.img-applier-row-head-key {
  position: sticky;
  inset-inline-start: 0;
  height: var(--ui-control-sm);
  background: var(--row-bg);
}
.img-applier-col {
  display: grid;
  place-items: center;
  width: var(--slot);
  height: var(--ui-control-sm);
  padding: 0;
  border: 0;
  border-start-start-radius: var(--ui-radius-sm);
  border-start-end-radius: var(--ui-radius-sm);
  background: var(--ui-ink-subtle);
  color: var(--ui-muted);
  cursor: pointer;
  font-size: var(--ui-type-micro);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.img-applier-col:hover {
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}
.img-applier-col.is-active {
  background: var(--ui-accent);
  color: var(--ui-surface);
}
.img-applier-col--cover {
  background: var(--ui-accent-subtle);
  color: var(--ui-accent-strong);
}
.img-applier-key {
  position: sticky;
  inset-inline-start: 0;
  gap: var(--ui-space-2);
  padding: var(--ui-space-1) var(--ui-space-2);
  border-inline-end: var(--ui-border-width) solid var(--ui-border);
  background: var(--row-bg);
  font-size: var(--ui-type-caption);
}
.img-applier-key > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.img-applier-key-tag {
  flex: none;
  font-size: var(--ui-type-micro);
}
.img-applier-key-thumb {
  flex: none;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  border-radius: var(--ui-radius-sm);
  background-size: cover;
  background-position: center;
}
.img-applier-swatch {
  flex: none;
  width: var(--ui-space-3);
  height: var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
}
.img-applier-pub-head {
  padding: var(--ui-space-2) var(--ui-space-3);
}
.img-applier-pub-head:hover {
  background: var(--ui-ink-subtle);
}
.img-applier-pub-thumb {
  flex: none;
  width: var(--ui-thumb-sm);
  height: var(--ui-thumb-sm);
  background-size: cover;
  background-position: center;
  background-color: var(--ui-subtle);
}
.img-applier-pub-title {
  margin: 0;
  font-size: var(--ui-type-caption);
}
.img-applier-caret {
  flex: none;
  display: inline-grid;
  place-items: center;
  width: var(--ui-space-5);
  height: var(--ui-space-5);
  border: 0;
  background: none;
}
.img-applier-pub:not(.is-open) .img-applier-caret .icon {
  rotate: -90deg;
}
.img-applier-thumbs {
  display: flex;
  flex-wrap: wrap;
  align-content: start;
}
.img-applier-thumb {
  display: grid;
  flex: 1 1 calc(var(--ui-thumb-lg) + var(--ui-space-7));
  min-width: calc(var(--ui-thumb-lg) + var(--ui-space-7));
  max-width: var(--ui-w-1);
  gap: var(--ui-space-1);
  margin: 0;
  cursor: grab;
}
.img-applier-thumb figcaption {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
}
.img-applier-thumb.is-ok .img-applier-thumb-img {
  box-shadow: 0 0 0 2px var(--ui-accent);
}
.img-applier-thumb.is-dragging {
  opacity: 0.35;
}
.img-applier-thumb-img {
  aspect-ratio: 1/1;
  background-size: cover;
  background-position: center;
  background-color: var(--ui-subtle);
}
.img-applier-thumbs-empty {
  font-size: var(--ui-type-caption);
}
.img-applier-picker {
  flex-wrap: wrap;
  gap: var(--ui-space-1);
  padding: var(--ui-space-2) var(--ui-space-3);
}
.img-applier-row.is-dirty {
  --row-bg: var(--ui-warning-subtle);
  box-shadow: inset var(--ui-edge) 0 0 var(--ui-warning);
}
.img-applier-slot {
  position: relative;
  width: var(--slot);
  height: var(--slot);
  padding: 0;
  flex: none;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-subtle);
  overflow: hidden;
  cursor: grab;
  transition: box-shadow 0.12s ease, border-color 0.12s ease, transform 0.12s ease, background-color 0.12s ease;
}
.img-applier-slot.is-empty {
  display: grid;
  place-items: center;
  border-style: dashed;
  background: var(--ui-bg);
  color: var(--ui-muted-veil);
  cursor: pointer;
}
.img-applier-slot.is-empty .icon {
  margin: 0;
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  opacity: 0.45;
}
.img-applier-slot.is-empty:hover {
  border-style: solid;
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-strong);
}
.img-applier-slot.is-active {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.img-applier-slot.is-disabled {
  cursor: default;
}
.img-applier-slot.is-warn::before {
  content: "";
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  border-block-start: var(--ui-icon-xs) solid var(--ui-warning);
  border-inline-start: var(--ui-icon-xs) solid transparent;
}
.img-applier-slot.is-dragging {
  opacity: 0.28;
}
.img-applier-slot.is-dirty {
  border-color: var(--ui-warning);
  box-shadow: inset 0 0 0 2px var(--ui-warning);
}
.img-applier-slot.is-active.is-dirty {
  box-shadow: inset 0 0 0 2px var(--ui-warning), var(--ui-focus-ring);
}
.img-applier-slot-lock {
  inset-inline-end: var(--ui-space-1);
  bottom: var(--ui-space-1);
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  padding: 2px;
  border-radius: var(--ui-radius-sm);
  background: var(--ui-surface);
}
.img-applier-slot-img {
  inset: 0;
  background-size: cover;
  background-position: center;
  background-color: var(--ui-surface);
}
.img-applier-fly {
  inset-block-start: 0;
  inset-inline-start: 0;
  width: var(--ui-thumb-lg);
  height: var(--ui-thumb-lg);
  margin: 0;
  padding: 0;
  border: 0;
  background-size: cover;
  background-position: center;
  background-color: var(--ui-surface);
  box-shadow: var(--ui-shadow-md);
  pointer-events: none;
  translate: -50% -50%;
}
.img-applier-fly.is-bad {
  outline: 2px solid var(--ui-danger);
}
.img-applier.has-dragging .img-applier-slot:not(.is-disabled) {
  border-style: dashed;
  border-color: var(--ui-accent-edge);
}
.img-applier.has-dragging .img-applier-slot.is-empty {
  background: var(--ui-accent-subtle);
}
.img-applier.has-dragging .img-applier-slot.is-disabled {
  opacity: 0.4;
}
.img-applier-slot.is-ok {
  border-style: solid;
  border-color: var(--ui-accent);
  box-shadow: inset 0 0 0 2px var(--ui-accent), var(--ui-shadow-md);
}
.img-applier-slot.is-bad {
  border-style: solid;
  border-color: var(--ui-danger);
  box-shadow: inset 0 0 0 2px var(--ui-danger);
  cursor: not-allowed;
}
.img-applier-slot.is-current {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.img-applier-col.is-ok {
  background: var(--ui-accent);
  color: var(--ui-surface);
}

@media (min-width: 992px) {
  .img-applier-main {
    grid-template-columns: minmax(0, 1fr) var(--ui-w-4);
  }
}
@media (pointer: coarse) {
  .img-applier-btn {
    width: calc(var(--ui-control-lg) + var(--ui-space-2));
    height: calc(var(--ui-control-lg) + var(--ui-space-2));
  }
}
@media (max-width: 767.98px) {
  .img-applier--phone .img-applier-picker {
    display: flex;
  }
  .img-applier--phone .img-applier-table {
    overflow: visible;
  }
  .img-applier--phone .img-applier-row-head {
    display: none;
  }
  .img-applier--phone .img-applier-row[data-row] {
    display: none;
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    padding: var(--ui-space-2) var(--ui-space-3);
  }
  .img-applier--phone .img-applier-row[data-row].is-current {
    display: block;
  }
  .img-applier--phone .img-applier-key {
    position: static;
    padding: 0 0 var(--ui-space-2);
    border-inline-end: 0;
  }
  .img-applier--phone .img-applier-slot {
    display: inline-grid;
    margin: 0 var(--gap) var(--gap) 0;
    vertical-align: top;
  }
}
.inbox-thread-item {
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-1);
  width: 100%;
  padding: var(--ui-space-2) var(--ui-space-3);
  text-align: start;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  color: var(--ui-ink);
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.inbox-thread-item:hover {
  border-color: var(--ui-accent);
  color: var(--ui-ink);
  text-decoration: none;
}
.inbox-thread-item.is-active {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring-soft);
}
.inbox-thread-item.is-warn {
  border-inline-start-width: var(--ui-edge);
  border-inline-start-color: var(--ui-warning);
}
.inbox-thread-item.is-warn.is-active {
  border-inline-start-color: var(--ui-accent);
}
.inbox-thread-item-badge {
  flex: 0 0 auto;
  font-size: var(--ui-type-caption);
  letter-spacing: 0.03em;
  color: var(--ui-warning-emphasis);
  background: var(--ui-warning-subtle);
  padding: 2px var(--ui-space-2);
}
.inbox-thread-item-preview {
  color: var(--ui-ink);
}

.index-rail {
  position: sticky;
  align-self: start;
  padding-block-end: var(--ui-space-4);
  top: var(--ui-rail-top);
}
.index-rail .is-empty i {
  background: var(--ui-dom-line);
}
.index-rail .is-ok i {
  background: var(--ui-success);
}
.index-rail .is-warn i {
  background: var(--ui-cost-2);
}
.index-rail .is-current {
  border-inline-start-color: var(--ui-dom-ink);
  background: var(--ui-dom-soft);
}
.index-rail .is-current strong {
  color: var(--ui-dom-strong);
  font-weight: 700;
}
.index-rail header {
  display: flex;
  align-items: baseline;
  gap: var(--ui-space-2);
  margin: 0 0 var(--ui-space-2);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.index-rail header b {
  color: var(--ui-ink);
  font-weight: 700;
  letter-spacing: 0;
}
.index-rail header em {
  margin-inline-start: auto;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
}
.index-rail progress {
  display: block;
  width: 100%;
  height: var(--ui-edge);
  margin: 0 0 var(--ui-space-3);
  border: 0;
  border-radius: 999px;
  background: var(--ui-border);
  appearance: none;
}
.index-rail progress::-webkit-progress-bar {
  background: var(--ui-border);
  border-radius: 999px;
}
.index-rail progress::-webkit-progress-value {
  background: var(--ui-dom-ink);
  border-radius: 999px;
}
.index-rail progress::-moz-progress-bar {
  background: var(--ui-dom-ink);
  border-radius: 999px;
}
.index-rail ul {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.index-rail button,
.index-rail a {
  display: grid;
  grid-template-columns: var(--ui-space-2) minmax(0, 1fr);
  align-items: start;
  gap: var(--ui-space-2);
  width: 100%;
  padding-block: var(--ui-space-2);
  padding-inline: var(--ui-space-1) var(--ui-space-2);
  border: 0;
  border-inline-start: 2px solid transparent;
  border-start-end-radius: var(--ui-radius-sm);
  border-end-end-radius: var(--ui-radius-sm);
  background: none;
  color: inherit;
  font-family: inherit;
  text-align: start;
  text-decoration: none;
  cursor: pointer;
}
.index-rail button:hover,
.index-rail a:hover {
  background: var(--ui-subtle);
  color: inherit;
}
.index-rail button:focus-visible,
.index-rail a:focus-visible {
  outline: none;
  box-shadow: var(--ui-focus-ring);
}
.index-rail i {
  width: var(--ui-space-2);
  height: var(--ui-space-2);
  margin-block-start: var(--ui-space-1);
  border-radius: 999px;
  background: var(--ui-border);
  box-shadow: 0 0 0 2px var(--ui-bg);
}
.index-rail strong {
  display: block;
  min-width: 0;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  font-weight: 600;
  line-height: 1.3;
}
.index-rail button b,
.index-rail a b {
  display: block;
  margin-block-start: 2px;
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-variant-numeric: tabular-nums;
  font-weight: 400;
}
@media (max-width: 991.98px) {
  .index-rail {
    margin-block-end: var(--ui-space-4);
    padding: var(--ui-space-2) 0;
    border-block-end: var(--ui-border-width) solid var(--ui-border);
    background: var(--ui-bg);
  }
  .index-rail header {
    margin-block-end: var(--ui-space-1);
  }
  .index-rail progress {
    margin-block-end: var(--ui-space-2);
  }
  .index-rail ul {
    flex-direction: row;
    gap: var(--ui-space-2);
    padding-block-end: 2px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }
  .index-rail ul::-webkit-scrollbar {
    height: 0;
  }
  .index-rail button,
  .index-rail a {
    flex: 0 0 auto;
    grid-template-columns: var(--ui-space-2) auto;
    align-items: center;
    padding: var(--ui-space-1) var(--ui-space-3);
    border: var(--ui-border-width) solid var(--ui-border);
    border-radius: 999px;
    background: var(--ui-surface);
  }
  .index-rail i {
    margin-block-start: 0;
  }
  .index-rail button b,
  .index-rail a b {
    display: none;
  }
  .index-rail strong {
    white-space: nowrap;
  }
  .index-rail .is-current {
    border-color: var(--ui-dom-ink);
  }
}

.inventory-hub-menu {
  --tone-ink: var(--ui-ink);
}
.inventory-hub-menu .card[class*=tone-] {
  background-color: var(--tone);
  border-color: var(--tone-deep);
}
.inventory-hub-menu .card[class*=tone-]:hover {
  background-color: var(--tone-deep);
}
.inventory-hub-menu .card a {
  color: var(--tone-ink);
}

.inventory-list tbody tr {
  display: none;
}
.inventory-list tbody td > .quantity {
  display: none;
}
.inventory-list tbody td.added {
  background-color: var(--ui-status-red);
}
.inventory-list tbody .form-control {
  min-width: calc(var(--ui-control-lg) * 2);
}

.label-album > div {
  display: inline-block;
  vertical-align: middle;
  width: 2in;
  height: 1in;
  padding: var(--ui-space-2);
  margin: var(--ui-space-1);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-sm);
}

.list-row {
  --accent: var(--ui-accent);
  --row-padding-y: var(--ui-space-3);
  --row-padding-x: var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-md);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--ui-space-3);
  padding: var(--row-padding-y) var(--row-padding-x);
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}
.list-row:hover {
  border-color: var(--ui-muted-edge);
}
.list-row.is-picked {
  border-color: var(--accent);
  box-shadow: var(--ui-focus-ring);
  background: var(--tint-subtle);
}
.list-row.has-accent-bar {
  box-shadow: inset var(--ui-edge) 0 0 var(--accent), var(--ui-shadow-md);
}
.list-row.is-picked.has-accent-bar {
  box-shadow: inset var(--ui-edge) 0 0 var(--accent), var(--ui-focus-ring);
}
.list-row.is-warn {
  border-color: var(--ui-warning-edge);
  background: var(--ui-warning-subtle);
}
.list-row.is-bad {
  border-color: var(--ui-danger-edge);
  background: var(--ui-danger-subtle);
}
.list-row.is-warn .list-row-meta, .list-row.is-bad .list-row-meta {
  color: var(--ui-ink);
}
.list-row--static {
  cursor: default;
}
.list-row--static:hover {
  border-color: var(--ui-border);
}
.list-row > .list-row-body.list-row-body--plain {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "main" "data";
}
.list-row > .list-row-select {
  flex: 0 0 var(--ui-space-5);
  align-self: flex-start;
  margin-block-start: 2px;
}
.list-row > .list-row-body {
  flex: 1 1 0%;
  min-width: 0;
  display: grid;
  align-items: center;
  gap: var(--ui-space-2) var(--ui-space-3);
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas: "media main" "data  data";
}
.list-row > .list-row-actions {
  flex: 0 0 auto;
  align-self: flex-start;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: var(--ui-space-1);
  white-space: nowrap;
}
.list-row-media {
  grid-area: media;
  position: relative;
  flex: none;
  width: calc(var(--ui-thumb-sm) + var(--ui-space-2));
  height: calc(var(--ui-thumb-sm) + var(--ui-space-2));
}
.list-row-media-void {
  border: var(--ui-border-width) dashed var(--ui-border);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-subtle);
}
.list-row-platform-mark {
  position: absolute;
  inset-inline-end: calc(-1 * var(--ui-space-1));
  bottom: calc(-1 * var(--ui-space-1));
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  padding: 1px;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  object-fit: contain;
}
.list-row-main {
  grid-area: main;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.list-row-title {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
  font-weight: 700;
  line-height: 1.3;
}
.list-row a.list-row-title {
  color: var(--ui-ink);
  text-decoration: none;
}
.list-row a.list-row-title:hover {
  color: var(--ui-accent);
  text-decoration: none;
}
.list-row-sub {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ui-space-1) var(--ui-space-2);
  min-width: 0;
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}
.list-row-sub-text {
  flex: 0 1 auto;
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.list-row-sub-text > a {
  display: inline;
  color: inherit;
  text-decoration: none;
}
.list-row-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ui-space-1) var(--ui-space-2);
  min-width: 0;
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
}
.list-row-meta .pill, .list-row-metrics .pill, .list-row-sub .pill {
  padding: 2px var(--ui-space-2);
  font-size: var(--ui-type-micro);
  line-height: 1.5;
}
.list-row-ref {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-1);
  color: var(--ui-muted);
  font-variant-numeric: tabular-nums;
}
.list-row-ref .icon {
  width: calc(var(--ui-icon-xs) * 0.75);
  height: calc(var(--ui-icon-xs) * 0.75);
  margin: 0;
}
.list-row-ref:hover {
  color: var(--ui-accent);
  text-decoration: none;
}
.list-row-data {
  grid-area: data;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--ui-space-1) var(--ui-space-3);
  min-width: 0;
}
.list-row-metrics {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--ui-space-1) var(--ui-space-3);
  min-width: 0;
}
.list-row-figure {
  color: var(--ui-ink);
  font-size: var(--ui-type-body);
  font-weight: 700;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.list-row-metric {
  display: inline-flex;
  align-items: baseline;
  gap: var(--ui-space-1);
  min-width: 0;
}
.list-row-metric-key {
  flex: none;
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.list-row-metric-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.list-row-action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ui-control);
  height: var(--ui-control);
  padding: 0;
  line-height: 1;
}
.list-row-action-button .icon {
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  margin: 0;
}
@media (min-width: 768px) {
  .list-row {
    --row-padding-x: var(--ui-space-4);
    gap: var(--ui-space-4);
  }
  .list-row > .list-row-body {
    gap: var(--ui-space-2) var(--ui-space-4);
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "media main data";
  }
  .list-row > .list-row-body.list-row-body--plain {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "main data";
  }
  .list-row-media {
    width: var(--ui-thumb);
    height: var(--ui-thumb);
  }
  .list-row-title {
    font-size: var(--ui-type-body);
  }
  .list-row-data {
    justify-content: flex-end;
    gap: var(--ui-space-1) var(--ui-space-4);
  }
  .list-row-data--stacked {
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
  }
  .list-row-data--stacked .list-row-metrics {
    flex-wrap: nowrap;
  }
  .list-row-metrics--grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    align-items: start;
    width: 100%;
    gap: var(--ui-space-3);
  }
  .list-row-metrics--grid .list-row-metric {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
  }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
  .list-row-body--metrics {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "media main" "data  data";
  }
}
@media (min-width: 1200px) {
  .list-row-body--metrics {
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.6fr);
  }
}
@media (max-width: 575.98px) {
  .list-row > .list-row-actions:has(> :nth-child(2)),
  .list-row > .list-row-actions:has(> :only-child) {
    flex: 1 1 100%;
  }
  .list-row > .list-row-actions:has(> :only-child) {
    justify-content: stretch;
  }
  .list-row > .list-row-actions:has(> :only-child) > .btn {
    flex: 1 1 auto;
    justify-content: center;
  }
}
.list-row--channel {
  --row-padding-y: var(--ui-space-2);
  --row-padding-x: var(--ui-space-2);
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--ui-space-2);
  box-shadow: none;
}
.list-row--channel:hover {
  background: var(--ui-subtle);
}
.list-row--channel:has(input:checked), .list-row--channel:has(input:checked):hover {
  background: var(--tint-subtle, var(--ui-accent-subtle));
  box-shadow: inset 3px 0 0 var(--accent);
}
.list-row--channel > .list-row-select {
  flex: none;
  align-self: center;
  margin-block-start: 0;
}
.list-row--channel > .list-row-body {
  gap: var(--ui-space-2);
}
.list-row--channel .list-row-media {
  width: auto;
  height: auto;
}
.list-row--channel .list-row-title {
  font-size: var(--ui-type-caption);
}

.map-fill {
  min-width: 0;
}
.map-fill svg {
  display: block;
  width: 100%;
  max-height: var(--ui-geo-max);
}
.map-fill path {
  fill: var(--ui-nodata);
  stroke: var(--ui-surface);
  stroke-width: 0.9;
  transition: fill 0.15s;
}
.map-fill path[data-has] {
  cursor: pointer;
}
.map-fill path[data-has]:hover {
  stroke: var(--ui-ink);
  stroke-width: 1.6;
}
.map-fill path[data-has]:focus-visible {
  outline: none;
  stroke: var(--ui-dom-ink);
  stroke-width: 2;
}
.map-fill p {
  padding: var(--ui-space-5) 0;
}

.marker {
  display: block;
  position: fixed;
  inset-inline-end: var(--ui-space-2);
  bottom: var(--ui-space-2);
  width: var(--ui-control);
  height: var(--ui-control);
  padding: 0;
}

.media-thumb {
  --hue: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  flex: none;
  overflow: hidden;
  box-sizing: border-box;
  background-color: var(--ui-surface);
  background-size: cover;
  background-position: center;
  border: var(--ui-border-width) solid transparent;
}
.media-thumb.is-empty {
  border-style: dashed;
  border-color: var(--ui-border);
  background-color: var(--ui-subtle);
  color: var(--ui-muted);
}
.media-thumb--sm {
  width: var(--ui-thumb-sm);
  height: var(--ui-thumb-sm);
}
.media-thumb--md {
  width: var(--ui-thumb);
  height: var(--ui-thumb);
}
.media-thumb--lg {
  width: var(--ui-thumb-lg);
  height: var(--ui-thumb-lg);
}
.media-thumb--square {
  border-radius: var(--ui-radius-sm);
}
.media-thumb--round {
  border-radius: 50%;
}
.media-thumb--zoom {
  cursor: pointer;
}
.media-thumb-img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: hue-rotate(calc(var(--hue) * 1deg));
}
.media-thumb--round .media-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.media-thumb-badge {
  position: absolute;
  width: var(--ui-space-4);
  height: var(--ui-space-4);
  inset-inline-end: calc(var(--ui-space-1) * -1);
  bottom: calc(var(--ui-space-1) * -1);
  border: calc(var(--ui-border-width) * 2) solid var(--ui-surface);
}
.media-thumb-cluster, .brand-user {
  position: relative;
  display: inline-block;
  width: var(--ui-control);
  height: var(--ui-control);
  flex-shrink: 0;
}

label.media-thumb {
  position: relative;
  cursor: pointer;
}
label.media-thumb input[type=file] {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}

.list-row-media .media-thumb {
  display: flex;
  width: 100%;
  height: 100%;
}

.meter {
  display: block;
  width: 100%;
  height: var(--ui-space-2);
  border-radius: 999px;
  background: var(--ui-rating-track);
}
.meter.is-active i {
  background: var(--ui-accent-strong);
}
.meter.is-warn i {
  background: var(--ui-warning);
}
.meter--sm {
  width: calc(var(--ui-control-lg) + var(--ui-space-5));
  height: var(--ui-space-1);
}
.meter--md {
  width: 100%;
  height: var(--ui-space-2);
}
.meter--lg {
  position: relative;
  height: var(--ui-control-sm);
}
.meter--lg i {
  background: var(--ui-accent-subtle);
}
.meter--lg.is-ok i {
  background: var(--ui-success-subtle);
}
.meter--lg.is-warn i {
  background: var(--ui-warning-subtle);
}
.meter--rating i {
  background: var(--ui-rating);
}
.meter i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--ui-accent);
}
.meter-mark {
  position: absolute;
  top: calc(-1 * var(--ui-edge));
  bottom: calc(-1 * var(--ui-edge));
  width: var(--ui-edge);
  background: var(--ui-ink);
  opacity: 0.7;
}

.dot {
  display: inline-block;
  width: var(--ui-space-2);
  height: var(--ui-space-2);
  margin-inline-end: var(--ui-space-1);
  border-radius: 999px;
  background: var(--ui-status-green);
  vertical-align: 1px;
}
.dot.is-warn {
  background: var(--ui-warning);
}
.dot.is-bad {
  background: var(--ui-status-red);
}

.mirror-axis {
  display: flex;
  align-items: center;
  position: relative;
  gap: 0;
}
.mirror-axis::before {
  content: "";
  position: absolute;
  inset-inline-start: 50%;
  top: var(--ui-space-1);
  bottom: 0;
  width: var(--ui-border-width);
  background: var(--ui-ink);
  transform: translateX(-50%);
  pointer-events: none;
}
.mirror-axis-side {
  flex: 1 1 0%;
  min-width: 0;
}
.mirror-axis-side input {
  position: relative;
  margin: 0;
}
.mirror-axis-side::after {
  content: "";
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: var(--ui-space-2);
  margin-block-start: var(--ui-space-1);
  pointer-events: none;
  padding-inline-start: calc(0.5rem + 0.0223463687 * (100% - 1rem) - 0.5px);
  padding-inline-end: calc(0.5rem - 0.5px);
  background-image: repeating-linear-gradient(to right, var(--ui-muted) 0, var(--ui-muted) 1px, transparent 1px, transparent calc((100% - 1px) / 35));
  background-repeat: no-repeat;
  background-origin: content-box;
  background-clip: content-box;
}
.mirror-axis-side--past {
  margin-inline-end: calc(var(--ui-space-2) * -1);
}
.mirror-axis-side--past input {
  direction: ltr;
}
.mirror-axis-side--past input, .mirror-axis-side--past::after {
  transform: scaleX(-1);
}
.mirror-axis-side--future {
  margin-inline-start: calc(var(--ui-space-2) * -1);
}

.notice {
  --notice-time: 4.5s;
  position: relative;
  overflow: hidden;
  margin-block-start: var(--ui-space-2);
  padding: var(--ui-space-2) var(--ui-space-3);
  border: var(--ui-border-width) solid currentColor;
  border-radius: var(--ui-radius-md);
  font-size: var(--ui-type-caption);
}
.notice[hidden] {
  display: none;
}
.notice:hover::after, .notice:focus-within::after {
  animation-play-state: paused;
}
.notice.is-warn {
  color: var(--ui-warning-emphasis);
  background: var(--ui-warning-subtle);
}
.notice::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 2px;
  background: currentColor;
  transform-origin: left;
  animation: notice-countdown var(--notice-time) linear;
}
@media (prefers-reduced-motion: reduce) {
  .notice::after {
    animation-duration: var(--notice-time) !important;
    animation-timing-function: step-end;
  }
}

@keyframes notice-countdown {
  from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}
.novo-mobile-bar-action {
  margin-inline-start: auto;
}

@media (max-width: 575.98px) {
  .status-dock-host {
    bottom: calc(var(--ui-control-lg) + var(--ui-space-6));
  }
}
body.has-workshop .status-dock-host {
  inset-inline-end: 0;
  bottom: 40%;
  width: var(--ui-space-2);
  overflow: hidden;
  border-start-start-radius: var(--ui-radius-md);
  border-end-start-radius: var(--ui-radius-md);
}
.status-dock-trigger {
  animation: status-dock-enter 0.25s ease;
}
.status-dock-trigger-face {
  padding: var(--ui-space-1) var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-md);
}
.status-dock-trigger.is-ok .status-dock-ring {
  animation: status-dock-pulse 1.4s ease infinite;
}
.status-dock-trigger.is-bad .status-dock-trigger-face {
  border-color: var(--ui-danger);
  animation: status-dock-alarm 0.4s ease;
}
.status-dock-ring {
  width: var(--ui-space-5);
  height: var(--ui-space-5);
  background: conic-gradient(var(--ui-accent) calc(var(--status-dock-progress) * 1%), var(--ui-border) 0);
}
.status-dock-panel {
  width: min(var(--ui-w-4), 100vw - var(--ui-space-6));
  max-height: 50vh;
  border: var(--ui-border-width) solid var(--ui-border);
}
.status-dock-row {
  padding: var(--ui-space-2) 0;
  border-block-end: var(--ui-border-width) solid var(--ui-border);
}
.status-dock-row:last-child {
  border-block-end: 0;
}
.status-dock-row.is-bad .status-dock-label {
  color: var(--ui-danger);
}
.status-dock-meta {
  margin: var(--ui-space-1) 0;
}
.status-dock-bar {
  height: var(--ui-space-1);
  background: var(--ui-border);
}
.status-dock-bar span {
  display: block;
  height: 100%;
  background: var(--ui-accent);
  transition: width 0.4s ease;
}

@keyframes status-dock-enter {
  from {
    transform: translateY(var(--ui-space-3));
    opacity: 0;
  }
  to {
    transform: none;
    opacity: 1;
  }
}
@keyframes status-dock-pulse {
  50% {
    transform: scale(1.08);
  }
}
@keyframes status-dock-alarm {
  20% {
    transform: translateX(-2px);
  }
  40% {
    transform: translateX(2px);
  }
  60% {
    transform: translateX(-1px);
  }
  80% {
    transform: translateX(1px);
  }
}
.list-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--ui-space-1);
  margin-block-start: var(--ui-space-5);
}
.list-pagination .pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--ui-space-1);
  margin: 0;
  padding: 0;
  list-style: none;
}
.list-pagination .page-link {
  display: grid;
  place-items: center;
  min-width: var(--ui-control);
  min-height: var(--ui-control);
  padding-inline: var(--ui-space-2);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-accent);
  font-size: var(--ui-type-caption);
  font-weight: 600;
}
.list-pagination .page-link:hover {
  border-color: var(--ui-accent);
  background: var(--ui-accent-subtle);
  color: var(--ui-accent-strong);
  text-decoration: none;
}
.list-pagination .page-item .page-link {
  border-radius: 999px;
}
.list-pagination .active .page-link {
  border-color: var(--ui-accent);
  background: var(--ui-accent);
  color: var(--ui-white);
}
.list-pagination .disabled .page-link,
.list-pagination .page-link:disabled {
  border-color: var(--ui-border);
  background: var(--ui-surface);
  color: var(--ui-muted);
  cursor: default;
}

.pair-map-head > :first-child,
.pair-map-head > :last-child, .pair-map-row > :first-child,
.pair-map-row > :last-child {
  flex: 1 1 0;
  min-width: 0;
}
.pair-map-row.is-bad .pair-map-b {
  color: var(--ui-muted);
  font-style: italic;
}
.pair-map-mid {
  flex: none;
  width: var(--ui-control-sm);
}

.palette {
  padding: var(--ui-space-1) 0;
}
.palette > i {
  --swatch: var(--ui-accent);
  --turn: 0deg;
  --lift: 0;
  --grow: 1;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  margin-inline-start: calc(var(--ui-control-sm) * -0.4);
  border: 2px solid var(--ui-surface);
  border-radius: 50%;
  background: var(--swatch);
  filter: saturate(0.72);
  transform: rotate(var(--turn)) translateY(var(--lift)) scale(var(--grow));
  transition: margin-inline-start 300ms cubic-bezier(0.22, 0.7, 0.3, 1.35), transform 300ms cubic-bezier(0.22, 0.7, 0.3, 1.35), border-radius 300ms ease, filter 300ms ease, box-shadow 300ms ease;
}
.palette > i:first-child {
  margin-inline-start: 0;
}
.palette > i:nth-child(2) {
  transition-delay: 50ms;
}
.palette > i:nth-child(3) {
  transition-delay: 100ms;
}
:where(a, button):hover .palette > i, :where(a, button):focus-visible .palette > i {
  margin-inline-start: var(--ui-space-1);
  border-radius: 22%;
  filter: saturate(1);
  box-shadow: var(--ui-shadow-md);
}
:where(a, button):hover .palette > i:first-child, :where(a, button):focus-visible .palette > i:first-child {
  margin-inline-start: 0;
}
:where(a, button):hover .palette > i:nth-child(1), :where(a, button):focus-visible .palette > i:nth-child(1) {
  --turn: -18deg;
  --lift: var(--ui-space-1);
}
:where(a, button):hover .palette > i:nth-child(2), :where(a, button):focus-visible .palette > i:nth-child(2) {
  --lift: calc(-1.5 * var(--ui-space-1));
  --grow: 1.18;
}
:where(a, button):hover .palette > i:nth-child(3), :where(a, button):focus-visible .palette > i:nth-child(3) {
  --turn: 18deg;
  --lift: var(--ui-space-1);
}
@media (prefers-reduced-motion: reduce) {
  :where(a, button):hover .palette > i {
    margin-inline-start: calc(var(--ui-control-sm) * -0.4);
    border-radius: 50%;
    transform: none;
    box-shadow: none;
  }
  :where(a, button):hover .palette > i:first-child {
    margin-inline-start: 0;
  }
}

.panel {
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  box-shadow: var(--ui-shadow-md);
  padding: var(--ui-space-5) var(--ui-space-6);
  margin-block-end: var(--ui-space-4);
}

.empty-state {
  padding: calc(var(--ui-space-6) + var(--ui-space-4)) var(--ui-space-4);
  text-align: center;
  color: var(--ui-muted);
  border-radius: var(--ui-radius-md);
  background: var(--ui-subtle);
  border: var(--ui-border-width) dashed var(--ui-border);
}

.surface-inset {
  padding: var(--ui-space-3) var(--ui-space-4);
  background: var(--ui-bg);
  border-radius: 0 0 var(--ui-radius-md) var(--ui-radius-md);
}

.peek-toggle {
  display: none;
}
.peek-less, .is-open .peek-more {
  display: none;
}
.is-open .peek-less {
  display: inline;
}
@media (max-width: 767.98px) {
  .peek-body {
    max-height: calc(var(--ui-w-3) + var(--ui-space-4));
    overflow: hidden;
    transition: max-height 0.35s ease;
  }
  .peek-body::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: calc(var(--ui-control-lg) * 2 + var(--ui-space-2));
    background: linear-gradient(to bottom, transparent, var(--ui-surface));
    pointer-events: none;
    transition: opacity 0.25s;
  }
  .is-open .peek-body {
    max-height: calc(var(--ui-w-8) * 6);
  }
  .is-open .peek-body::after {
    opacity: 0;
  }
  .peek-toggle {
    display: inline-flex;
    align-items: center;
    gap: var(--ui-space-2);
    margin-block-start: var(--ui-space-3);
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ui-accent-strong);
    cursor: pointer;
    font-size: var(--ui-type-caption);
    font-weight: 600;
  }
}

.photo-fan {
  height: calc(var(--ui-w-1) + var(--ui-space-3));
}
.photo-fan > span {
  --turn: 0deg;
  --shift: 0;
  --grow: 1;
  position: absolute;
  top: 50%;
  inset-inline-start: 50%;
  width: calc(var(--ui-control-lg) * 2 + var(--ui-space-3));
  aspect-ratio: 3/4;
  border: var(--ui-edge) solid var(--ui-surface);
  border-radius: var(--ui-radius-md);
  background-color: var(--ui-subtle);
  background-size: cover;
  background-position: center;
  box-shadow: 0 0 0 1px var(--ui-ink-veil), var(--ui-shadow-md);
  transform: translate(-50%, -50%) rotate(var(--turn)) translateX(var(--shift)) scale(var(--grow));
  transition: transform 280ms cubic-bezier(0.2, 0.7, 0.3, 1.2);
}
.photo-fan > span:nth-child(1) {
  --turn: -12deg;
  --shift: calc(-1 * (var(--ui-space-8) + var(--ui-space-1)));
}
.photo-fan > span:nth-child(2) {
  --grow: 1.16;
}
.photo-fan > span:nth-child(3) {
  --turn: 12deg;
  --shift: calc(var(--ui-space-8) + var(--ui-space-1));
}
:where(a, button):hover .photo-fan > span:nth-child(1), :where(a, button):focus-visible .photo-fan > span:nth-child(1) {
  --turn: -18deg;
  --shift: calc(-1 * (var(--ui-space-8) + var(--ui-space-5)));
}
:where(a, button):hover .photo-fan > span:nth-child(2), :where(a, button):focus-visible .photo-fan > span:nth-child(2) {
  --grow: 1.24;
}
:where(a, button):hover .photo-fan > span:nth-child(3), :where(a, button):focus-visible .photo-fan > span:nth-child(3) {
  --turn: 18deg;
  --shift: calc(var(--ui-space-8) + var(--ui-space-5));
}
@container board (max-width: 39.98rem) {
  .photo-fan {
    height: calc(var(--ui-w-1) + var(--ui-space-6));
  }
}

.pickable-band {
  position: fixed;
  pointer-events: none;
  border: var(--ui-border-width) solid var(--ui-accent);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-accent-veil);
}
.pickable-surface {
  user-select: none;
}
.pickable-surface:focus-visible {
  outline: 2px solid var(--ui-accent);
  outline-offset: 2px;
}
.pickable-check {
  cursor: pointer;
  touch-action: manipulation;
}
.pickable-check:focus-visible {
  outline: 2px solid var(--ui-accent);
  outline-offset: 2px;
}
.pickable-check.is-active {
  color: var(--ui-success);
}
.pickable-check.is-active:hover {
  color: var(--ui-danger);
}
.pickable-check--removed {
  animation: pickable-removed 0.3s ease;
  border-style: solid;
  border-color: var(--ui-danger);
  color: var(--ui-danger);
}
.pickable-mark {
  display: inline-block;
  width: calc(var(--ui-icon-xs) * 1.25);
  height: calc(var(--ui-icon-xs) * 1.25);
  border: 2px solid var(--ui-white);
  border-radius: 50%;
  background: var(--ui-ink-veil);
  transition: background 0.15s ease;
}
.is-picked .pickable-mark {
  background: var(--ui-accent);
}
.is-picked .pickable-mark::after {
  content: "";
  position: absolute;
  top: var(--ui-space-1);
  inset-inline-start: var(--ui-space-1);
  width: var(--ui-space-2);
  height: var(--ui-space-1);
  border-inline-start: 2px solid var(--ui-white);
  border-block-end: 2px solid var(--ui-white);
  transform: rotate(-45deg);
}

@keyframes pickable-removed {
  0% {
    transform: scale(1);
  }
  40% {
    transform: scale(0.92);
  }
  100% {
    transform: scale(1);
  }
}
.pill {
  --pill-tone: var(--ui-ink);
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-1);
  padding: 2px var(--ui-space-2);
  border-radius: 999px;
  font-size: var(--ui-type-caption);
  font-weight: 600;
  line-height: 1.4;
  border: var(--ui-border-width) solid var(--ui-border);
  background: var(--ui-subtle);
  color: color-mix(in srgb, var(--pill-tone) 60%, var(--ui-ink));
  white-space: nowrap;
}
.pill--sm {
  padding: 2px var(--ui-space-2);
  font-size: var(--ui-type-micro);
  line-height: 1.5;
}
.pill--md {
  padding: 2px var(--ui-space-2);
  font-size: var(--ui-type-caption);
  line-height: 1.4;
}
.pill--primary {
  border-color: var(--ui-accent-edge);
  background: var(--ui-accent-subtle);
  --pill-tone: var(--ui-accent-strong);
}
.pill--success {
  border-color: var(--ui-success-edge);
  background: var(--ui-success-subtle);
  --pill-tone: var(--ui-success-emphasis);
}
.pill--warning {
  border-color: var(--ui-warning-edge);
  background: var(--ui-warning-subtle);
  --pill-tone: var(--ui-warning-emphasis);
}
.pill--danger {
  border-color: var(--ui-danger-edge);
  background: var(--ui-danger-subtle);
  --pill-tone: var(--ui-danger-emphasis);
}
.pill--info {
  border-color: var(--ui-status-cyan-edge);
  background: var(--ui-status-cyan-subtle);
  --pill-tone: var(--ui-status-cyan-emphasis);
}
.pill--muted {
  border-color: var(--ui-border);
  background: var(--ui-bg);
  --pill-tone: var(--ui-muted);
}
.pill--full {
  border-color: var(--ui-status-yellow-edge);
  background: var(--ui-status-yellow-subtle);
  --pill-tone: var(--ui-status-yellow-emphasis);
}
.pill--listing {
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.pill--pinned {
  position: absolute;
  top: 0;
  inset-inline-end: var(--ui-space-5);
  transform: translateY(-50%);
}

.prose {
  display: flow-root;
  overflow-wrap: break-word;
}
.prose h2,
.prose h3,
.prose h4 {
  margin-block: var(--ui-space-6) var(--ui-space-2);
}
.prose h2:first-child,
.prose h3:first-child,
.prose h4:first-child {
  margin-block-start: 0;
}
.prose a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
}
.prose a:hover {
  color: inherit;
}
.prose ul,
.prose ol {
  margin-block: 0 var(--ui-space-3);
  padding-inline-start: var(--ui-space-6);
}
.prose li {
  margin-block-end: var(--ui-space-1);
}
.prose li > ul,
.prose li > ol {
  margin-block: var(--ui-space-1) 0;
}
.prose blockquote {
  margin: 0 0 var(--ui-space-3);
  padding-inline-start: var(--ui-space-4);
  border-inline-start: var(--ui-edge) solid var(--ui-border);
  color: var(--ui-muted);
}
.prose hr {
  margin-block: var(--ui-space-5);
  border: 0;
  border-block-start: var(--ui-border-width) solid var(--ui-border);
}
.prose pre {
  margin-block: 0 var(--ui-space-3);
  padding: var(--ui-space-3) var(--ui-space-4);
  overflow-x: auto;
  border-radius: var(--ui-radius-sm);
  background: var(--ui-subtle);
}
.prose > :last-child {
  margin-block-end: 0;
}
.prose-table {
  margin-block: 0 var(--ui-space-3);
  overflow-x: auto;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-sm);
}
.prose-table table {
  font-size: var(--ui-type-caption);
}
.prose-table th,
.prose-table td {
  padding: var(--ui-space-2) var(--ui-space-3);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  text-align: start;
  vertical-align: top;
}
.prose-table th {
  background: var(--ui-subtle);
  font-weight: 600;
}
.prose-table tbody tr:last-child td {
  border-block-end: 0;
}

.star {
  display: inline-block;
  width: var(--ui-star);
  height: var(--ui-star);
  background: var(--ui-rating);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000' stroke='%23000' stroke-width='1.9' stroke-linejoin='round'%3E%3Cpath d='M12 17.75l-6.172 3.245l1.179-6.873l-5-4.867l6.9-1l3.086-6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000' stroke='%23000' stroke-width='1.9' stroke-linejoin='round'%3E%3Cpath d='M12 17.75l-6.172 3.245l1.179-6.873l-5-4.867l6.9-1l3.086-6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.star--hollow {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linejoin='round'%3E%3Cpath d='M12 17.75l-6.172 3.245l1.179-6.873l-5-4.867l6.9-1l3.086-6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linejoin='round'%3E%3Cpath d='M12 17.75l-6.172 3.245l1.179-6.873l-5-4.867l6.9-1l3.086-6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z'/%3E%3C/svg%3E");
}

.stars {
  --fill: 0%;
  --s: var(--ui-star);
  position: relative;
  display: inline-block;
  line-height: 0;
}
.stars--md {
  --s: var(--ui-star);
}
.stars--lg {
  --s: var(--ui-star-lg);
}
.stars-row {
  display: flex;
}
.stars-row .star {
  width: calc(var(--s) + var(--ui-space-1));
  height: var(--s);
  -webkit-mask-size: var(--s) var(--s);
  mask-size: var(--s) var(--s);
}
.stars-clip {
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  height: 100%;
  width: var(--fill);
  overflow: hidden;
}
.stars-clip .stars-row {
  width: max-content;
}

.products-reviews {
  max-width: calc(var(--ui-w-4) + var(--ui-space-7) * 2);
  padding: var(--ui-space-4) var(--ui-space-5) var(--ui-space-5);
}

.reviews-eyebrow {
  margin: 0 0 var(--ui-space-3);
  font-size: var(--ui-type-micro);
  font-weight: 600;
  color: var(--ui-muted);
}
.reviews-score {
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
  padding-block-end: var(--ui-space-4);
  margin-block-end: var(--ui-space-3);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
}
.reviews-score .stars {
  margin: var(--ui-space-3) 0 var(--ui-space-2);
}
.reviews-avg {
  font-size: var(--ui-type-display);
  line-height: 1;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.reviews-total {
  font-size: var(--ui-type-micro);
  color: var(--ui-muted);
}
.reviews-levels {
  width: 100%;
  border-collapse: collapse;
}
.reviews-level {
  width: 1%;
  padding-block: var(--ui-space-1);
  padding-inline: 0 var(--ui-space-2);
  font-size: var(--ui-type-caption);
  font-weight: 400;
  color: var(--ui-muted);
  text-align: start;
  white-space: nowrap;
}
.reviews-level .star {
  vertical-align: -2px;
  margin-inline-start: var(--ui-space-1);
}
.reviews-track {
  width: 100%;
  padding: var(--ui-space-1) 0;
}
.reviews-count {
  width: calc(var(--ui-control-lg) + var(--ui-space-2));
  padding-block: var(--ui-space-1);
  padding-inline: var(--ui-space-2) 0;
  text-align: end;
  font-size: var(--ui-type-caption);
  font-variant-numeric: tabular-nums;
}

.row-slim {
  display: grid;
  grid-template-columns: var(--ui-icon-xs) minmax(0, 1fr) minmax(calc(var(--ui-thumb-sm) + var(--ui-space-2)), calc(var(--ui-w-1) * 0.75)) auto;
  align-items: center;
  gap: var(--ui-space-2) var(--ui-space-3);
  width: 100%;
  padding: var(--ui-space-1) var(--ui-space-2);
  border: var(--ui-border-width) solid transparent;
  border-radius: var(--ui-radius-sm);
  background: none;
  color: var(--ui-ink);
  text-align: start;
  text-decoration: none;
  transition: background 0.12s, border-color 0.12s;
}
.row-slim:hover {
  border-color: var(--ui-border);
  background: var(--ui-subtle);
  color: var(--ui-ink);
  text-decoration: none;
}
.row-slim:focus-visible {
  outline: none;
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.row-slim.is-active {
  background: var(--ui-subtle);
}
.row-slim.is-disabled {
  opacity: 0.4;
}
.row-slim.is-disabled b {
  text-decoration: line-through;
}
.row-slim--rest {
  grid-template-columns: var(--ui-icon-xs) minmax(0, 1fr) auto;
  cursor: default;
}
.row-slim--rest:hover {
  border-color: transparent;
  background: none;
}
.row-slim--rest strong {
  color: var(--ui-muted);
  font-weight: 400;
}
.row-slim .face {
  --face: var(--ui-icon-xs);
}
.row-slim strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
  font-weight: 600;
}
.row-slim strong small {
  margin-inline-start: var(--ui-space-2);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-weight: 400;
}
.row-slim .meter {
  height: var(--ui-space-1);
}
.row-slim b {
  color: var(--ui-ink);
  font-size: var(--ui-type-caption);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  text-align: end;
  white-space: nowrap;
}
.row-slim b small {
  margin-inline-start: var(--ui-space-1);
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  font-weight: 400;
}
@media (max-width: 575.98px) {
  .row-slim {
    grid-template-columns: var(--ui-icon-xs) minmax(0, 1fr) auto;
  }
  .row-slim .meter {
    display: none;
  }
}

.run-row {
  display: grid;
  grid-template-columns: var(--ui-w-1) minmax(0, 1fr) auto;
  gap: var(--ui-space-1) var(--ui-space-3);
  align-items: center;
  padding: var(--ui-space-3);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
  text-align: start;
}
.run-row--compact {
  padding: 0;
}
.run-row--link {
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  color: inherit;
  text-decoration: none;
}
.run-row--link:hover {
  border-color: var(--ui-accent-edge);
  color: inherit;
  text-decoration: none;
}
.run-row-time {
  color: var(--ui-muted);
}
.run-row-what {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.run-row-sub {
  color: var(--ui-muted);
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
}
.run-row-result {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--ui-space-1);
}
.run-row-more {
  grid-column: 4;
}
@media (max-width: 575.98px) {
  .run-row {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }
  .run-row-time {
    grid-column: 1/-1;
    order: -1;
  }
  .run-row-more {
    grid-column: 3;
  }
}

.selectable-cards {
  --cards: 3;
  display: grid;
  gap: var(--ui-space-3);
  grid-template-columns: 1fr;
}
.selectable-cards--pair {
  --cards: 2;
}
.selectable-cards--compact {
  --cards: 2;
  grid-template-columns: repeat(var(--cards), minmax(0, 1fr));
}
.selectable-cards--compact .selectable-card {
  padding: var(--ui-space-3);
}
.selectable-cards-legend {
  display: block;
  width: 100%;
  margin: 0 0 var(--ui-space-3);
  padding: 0;
  border: 0;
  font-size: var(--ui-type-body);
  font-weight: 700;
  line-height: var(--ui-type-body-lh);
}
@media (min-width: 768px) {
  .selectable-cards {
    grid-template-columns: repeat(var(--cards), minmax(0, 1fr));
  }
}

.selectable-card {
  background: var(--ui-subtle);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-2);
  padding: var(--ui-space-4);
  cursor: pointer;
  margin: 0;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.selectable-card:hover {
  border-color: var(--ui-accent-edge);
}
.selectable-card:has(input:checked) {
  border-color: var(--ui-accent);
  background: var(--ui-accent-subtle);
  box-shadow: var(--ui-shadow-md);
}
.selectable-card:has(input:focus-visible) {
  box-shadow: var(--ui-focus-ring);
}
.selectable-card:has(input:disabled) {
  cursor: not-allowed;
}
.selectable-card:has(input:disabled) .selectable-card-head,
.selectable-card:has(input:disabled) .selectable-card-mark {
  opacity: 0.6;
}
.selectable-card:has(input:disabled):hover {
  border-color: var(--ui-border);
}
.selectable-card:has(input:checked) .selectable-card-desc {
  color: var(--ui-ink);
}
.selectable-card:has(input:checked) .selectable-card-mark {
  border-color: var(--ui-accent);
  box-shadow: inset 0 0 0 var(--ui-space-1) var(--ui-accent);
}
.selectable-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.selectable-card-head {
  display: flex;
  align-items: center;
  gap: var(--ui-space-3);
}
.selectable-card-name {
  font-size: var(--ui-type-body);
  line-height: var(--ui-type-body-lh);
}
.selectable-card-desc {
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
  color: var(--ui-muted);
}
.selectable-card-price {
  flex: none;
  font-size: var(--ui-type-caption);
  font-weight: 700;
  text-decoration: none;
}
.selectable-card-mark {
  flex: none;
  width: var(--ui-space-5);
  height: var(--ui-space-5);
  border: 2px solid var(--ui-border);
  border-radius: 999px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.setting {
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  box-shadow: var(--ui-shadow-md);
  box-shadow: var(--ui-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-2);
  padding: var(--ui-space-3);
}
.setting-head {
  display: flex;
  align-items: center;
  gap: var(--ui-space-2);
}
.setting-head > .pill {
  margin-inline-start: auto;
}
.setting-title {
  margin: 0;
  font-size: var(--ui-type-body);
  font-weight: 600;
  line-height: var(--ui-type-body-lh);
}
.setting-desc {
  margin: 0;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}
.setting-body {
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-1);
}
.setting-value {
  display: flex;
  align-items: baseline;
  gap: var(--ui-space-2);
  margin: 0;
  font-size: var(--ui-type-title);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.setting-unit {
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  font-weight: 400;
}
.setting-scale {
  display: flex;
  justify-content: space-between;
  margin: 0;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
}
.setting-hint {
  margin: 0;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}
.setting-row {
  --aside: var(--ui-w-1);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ui-space-1) var(--ui-space-3);
  align-items: center;
  padding-block: var(--ui-space-2);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}
.setting-label {
  color: var(--ui-muted);
}
.setting-rows > * + * {
  border-block-start: var(--ui-border-width) solid var(--ui-border);
}
.setting-range {
  display: flex;
  align-items: center;
  gap: var(--ui-space-3);
}
.setting-range input {
  flex: 1 1 auto;
  min-width: 0;
}
.setting-range-value {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  text-align: end;
}
@media (min-width: 768px) {
  .setting-row {
    grid-template-columns: minmax(0, var(--aside)) minmax(0, 1fr);
  }
}

.side-menu-count {
  margin-inline-start: auto;
  min-width: var(--ui-space-5);
  padding-inline: var(--ui-space-1);
  border-radius: 999px;
  background: var(--ui-danger);
  color: var(--ui-white);
  font-size: var(--ui-type-micro);
  font-weight: 700;
  line-height: var(--ui-space-5);
  text-align: center;
}
.side-menu-count--unknown {
  background: var(--ui-muted-emphasis);
}

.novo-mobile-bar .novo-side-menu-toggle.has-alert {
  position: relative;
  overflow: visible;
}
.novo-mobile-bar .novo-side-menu-toggle.has-alert::after {
  content: "";
  position: absolute;
  inset-block-start: calc(var(--ui-space-1) * -1);
  inset-inline-end: calc(var(--ui-space-1) * -1);
  width: var(--ui-space-3);
  height: var(--ui-space-3);
  border: 2px solid var(--ui-head-ink);
  border-radius: 999px;
  background: var(--ui-danger);
}

.skeleton {
  background: linear-gradient(90deg, var(--ui-subtle) 25%, var(--ui-ink-subtle) 50%, var(--ui-subtle) 75%);
  background-size: 200% 100%;
  animation: ui-shimmer 1.2s ease-in-out infinite;
  border-radius: var(--ui-radius-sm);
}
.skeleton--still {
  animation: none;
  background: var(--ui-ink-subtle);
}
.skeleton--chart {
  aspect-ratio: 16/9;
  width: 100%;
}
.skeleton--hero {
  height: calc(var(--ui-control-lg) + var(--ui-space-5));
  width: 60%;
  margin: 0 auto;
}
.skeleton--stat {
  height: calc(var(--ui-control-lg) + var(--ui-space-4));
}
.skeleton--task {
  height: calc(var(--ui-control-lg) * 2 + var(--ui-space-4));
}
.skeleton--btn {
  width: calc(var(--ui-control-lg) * 2);
  height: calc(var(--ui-control-sm) + var(--ui-space-1));
}
.skeleton--thumb {
  width: var(--ui-thumb);
  height: var(--ui-thumb);
  border-radius: var(--ui-radius-sm);
}
.skeleton--check {
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  border-radius: var(--ui-radius-sm);
  display: block;
}
.skeleton--line {
  display: block;
  height: var(--ui-space-3);
  width: 80%;
}
.skeleton--line-lg {
  height: var(--ui-icon-xs);
  width: 55%;
  margin-block-end: var(--ui-space-1);
}
.skeleton--w40 {
  width: 40%;
}
.skeleton--w55 {
  width: 55%;
}
.skeleton--w70 {
  width: 70%;
}
.skeleton--w92 {
  width: 92%;
}
.skeleton--proof {
  display: block;
  height: calc(var(--ui-w-1) + var(--ui-space-7));
}
.skeleton--fill {
  display: block;
  height: 100%;
}
.skeleton--amount {
  display: inline-block;
  width: calc(var(--ui-control-lg) * 2);
  height: var(--ui-space-3);
}
.skeleton--pill {
  width: var(--ui-thumb-lg);
  height: var(--ui-control-sm);
  border-radius: 999px;
}
.skeleton--tile {
  display: block;
  min-height: calc(var(--ui-w-3) + var(--ui-space-7));
}

@keyframes ui-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
.sort-grip {
  border: 0;
  background: none;
  opacity: 0.35;
  padding: 0 var(--ui-space-1);
}
.sort-grip:focus, .sort-grip:focus-visible {
  opacity: 1;
  color: var(--ui-accent-strong);
  background: var(--ui-subtle);
}
.sort-grip .icon {
  width: calc(var(--ui-icon-xs) * 0.75);
  height: var(--ui-icon-xs);
}

@keyframes erp_new {
  0% {
    background: var(--ui-accent-subtle);
    border-color: var(--ui-accent);
  }
  60% {
    background: var(--ui-accent-subtle);
    border-color: var(--ui-accent-subtle);
  }
  100% {
    background: transparent;
    border-color: transparent;
  }
}
.erp-scroller {
  overflow-x: auto;
  scrollbar-color: var(--ui-border) transparent;
}
.erp-scroller::-webkit-scrollbar {
  height: var(--ui-space-4);
}
.erp-scroller::-webkit-scrollbar-track {
  background: var(--ui-subtle);
  border-radius: 999px;
}
.erp-scroller::-webkit-scrollbar-thumb {
  background: var(--ui-border);
  border: var(--ui-space-1) solid var(--ui-subtle);
  border-radius: 999px;
}
.erp-scroller::-webkit-scrollbar-thumb:hover {
  background: var(--ui-muted);
}

.is-dragging {
  position: fixed;
  margin: 0;
  background: var(--ui-surface);
  border-color: var(--ui-accent);
  box-shadow: var(--ui-shadow-md);
  pointer-events: none;
  opacity: 0.92;
}

.sortable-gap {
  border: var(--ui-border-width) dashed var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-muted-veil);
}
.sortable-grip {
  cursor: grab;
  touch-action: none;
}
.sortable-grip:focus-visible {
  outline: 2px solid var(--ui-accent);
  outline-offset: 2px;
}
.sortable-grip.is-disabled {
  display: none;
}
tr.sortable-gap {
  border: 0;
}
tr.sortable-gap > td {
  padding: 0;
  background: var(--ui-muted-veil);
  border: var(--ui-border-width) dashed var(--ui-border);
}

body.has-dragging,
body.has-dragging .sortable-grip {
  cursor: grabbing;
  user-select: none;
}

.has-grip .sortable-grip,
.sortable .has-grip .sort-grip {
  opacity: 0;
  transition: opacity 0.15s ease;
}
.has-grip:hover .sortable-grip:not(.is-disabled), .has-grip:focus-within .sortable-grip:not(.is-disabled),
.sortable .has-grip:hover .sort-grip,
.sortable .has-grip:focus-within .sort-grip {
  opacity: 1;
}

.stage {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: var(--ui-space-4);
  background: var(--ui-black-veil);
  overflow-y: auto;
}
.stage--side {
  --stage-left: min(var(--ui-w-5), 100%);
  inset-inline-start: var(--stage-left);
  flex-direction: column;
  align-items: stretch;
  padding: 0;
  background: var(--ui-bg);
  opacity: 0;
  transform: translateX(calc(var(--ui-space-8) - 2px));
  pointer-events: none;
  overscroll-behavior: contain;
}
.stage--side .stage-bar {
  position: static;
  flex: 0 0 auto;
  gap: var(--ui-space-3);
  padding: var(--ui-space-3) var(--ui-space-4);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  background: var(--ui-surface);
}
.stage--side .stage-title {
  font-weight: 600;
}
.stage--side .stage-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: var(--ui-space-4);
}
body.has-workshop .stage--side {
  opacity: 1;
  transform: none;
  pointer-events: auto;
  transition: opacity 0.5s ease 0.36s, transform 0.55s cubic-bezier(0.4, 0, 0.2, 1) 0.36s;
}
body.has-workshop.has-workshop-rail .stage--side {
  --stage-left: calc(var(--ui-control-lg) + var(--ui-space-4));
}
.stage-canvas {
  position: relative;
  width: min(var(--ui-max) + var(--ui-w-4) - var(--ui-space-7), 100%);
  margin: var(--ui-space-4) 0;
  padding: var(--ui-space-6);
  border-radius: var(--ui-radius-lg);
  background: var(--ui-bg);
  box-shadow: var(--ui-shadow-md);
}
.stage-bar {
  position: absolute;
  top: var(--ui-space-3);
  inset-inline-end: var(--ui-space-4);
  display: flex;
  align-items: center;
  gap: var(--ui-space-4);
}
.stage-close {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ui-muted);
  font-size: var(--ui-control-sm);
  line-height: 1;
  cursor: pointer;
}
.stage-close:hover {
  color: var(--ui-ink);
}

@media (min-width: 992px) {
  .stage-sheet--md {
    max-width: calc(var(--ui-w-7) + var(--ui-w-1) + var(--ui-space-7));
  }
}
@media (min-width: 992px) {
  .stage-sheet--lg {
    max-width: var(--ui-max);
  }
  .stage-sheet--lg .min-stage.narrow-children > *,
  .stage-sheet--lg .narrow-foot {
    max-width: 100%;
  }
  .stage-sheet--lg .plan-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--ui-space-3);
    align-items: stretch;
  }
  .stage-sheet--lg .plan-grid .selectable-card {
    display: flex;
    flex-direction: column;
  }
  .stage-sheet--lg .plan-grid .selectable-card-head {
    flex-wrap: wrap;
    row-gap: var(--ui-space-1);
    min-height: 0;
    padding: var(--ui-space-4) var(--ui-space-4) var(--ui-space-2);
  }
  .stage-sheet--lg .plan-grid .selectable-card-head .selectable-card-price {
    order: 3;
    flex: 1 1 100%;
    font-size: var(--ui-type-title);
    font-weight: 800;
    text-decoration: none;
  }
  .stage-sheet--lg .plan-grid .fold {
    grid-template-rows: 1fr;
    flex: 1 1 auto;
  }
  .stage-sheet--lg .plan-grid .fold ul {
    padding: var(--ui-space-2) var(--ui-space-4) var(--ui-space-4);
  }
  .stage-sheet--lg .plan-grid .pill--pinned {
    inset-inline-end: auto;
    inset-inline-start: 50%;
    transform: translateX(-50%);
  }
}
@media (min-width: 992px) {
  .stage-sheet {
    width: 100%;
    max-width: calc(var(--ui-w-7) + var(--ui-w-1) + var(--ui-space-7));
    min-height: calc(100dvh - var(--ui-space-6) * 2);
    margin: var(--ui-space-6) auto;
    border: var(--ui-border-width) solid var(--ui-border);
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow-md);
    overflow: hidden;
  }
  .stage-sheet .surface-band-top,
  .stage-sheet .surface-band-foot {
    position: static;
  }
  .stage-sheet .min-stage {
    min-height: calc(var(--ui-w-4) + var(--ui-space-7) * 2);
    padding: var(--ui-space-6);
  }
  .stage-sheet .min-stage.narrow-children > * {
    max-width: calc(var(--ui-w-5) + var(--ui-w-1) + var(--ui-space-7));
  }
  .stage-sheet .narrow-foot {
    display: flex;
    align-items: center;
    gap: var(--ui-space-5);
    max-width: calc(var(--ui-w-5) + var(--ui-w-1) + var(--ui-space-7));
    padding: var(--ui-space-4) var(--ui-space-6) var(--ui-space-5);
  }
}

.step {
  margin-block-end: var(--ui-space-6);
}
.step[hidden] {
  display: none;
}
.step[disabled] {
  opacity: 0.45;
}
.step-head {
  display: flex;
  align-items: center;
  gap: var(--ui-space-3);
  margin-block-end: var(--ui-space-3);
}
.step-number {
  flex: none;
  display: grid;
  place-items: center;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  border-radius: 999px;
  background: var(--ui-accent);
  color: var(--ui-surface);
  font-weight: 700;
}
.step-title {
  font-weight: 700;
}
.step-sub {
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
}
.step:where(fieldset) {
  min-width: 0;
  margin-block: 0 var(--ui-space-6);
  padding: 0;
  border: 0;
}
.step-head:where(legend) {
  width: 100%;
  padding: 0;
  font-size: var(--ui-type-body);
  line-height: var(--ui-type-body-lh);
}

.step-list {
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-3);
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: step-list;
}
.step-list > li.is-ok::before {
  background: var(--ui-success-subtle);
  box-shadow: inset 0 0 0 2px var(--ui-success);
  color: var(--ui-ink);
}
.step-list > li.is-warn::before {
  background: var(--ui-warning-subtle);
  box-shadow: inset 0 0 0 2px var(--ui-warning);
  color: var(--ui-ink);
}
.step-list > li.is-bad::before {
  background: var(--ui-danger-subtle);
  box-shadow: inset 0 0 0 2px var(--ui-danger);
  color: var(--ui-ink);
}
.step-list > li.is-disabled::before {
  background: var(--ui-muted-subtle);
  box-shadow: inset 0 0 0 2px var(--ui-muted-edge);
  color: var(--ui-ink);
}
.step-list-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ui-space-2);
}
.step-list-note {
  color: var(--ui-muted);
}
.step-list > li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: var(--ui-space-1) var(--ui-space-3);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-body-lh);
}
.step-list > li > * {
  grid-column: 2;
}
.step-list > li::before {
  grid-column: 1;
  grid-row: 1/span 2;
  counter-increment: step-list;
  content: counter(step-list);
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--ui-control);
  height: var(--ui-control);
  border-radius: 999px;
  background: var(--ui-accent);
  color: var(--ui-surface);
  font-size: var(--ui-type-caption);
  font-weight: 700;
  line-height: 1;
}

.widget.stock-sync-applier-mount:empty {
  display: none;
}

.stock-sync-applier-pic {
  width: var(--ui-thumb);
}
.stock-sync-applier-pic img {
  width: calc(var(--ui-thumb-sm) + var(--ui-space-2));
  height: calc(var(--ui-thumb-sm) + var(--ui-space-2));
  object-fit: cover;
  border-radius: var(--ui-radius-sm);
  background: var(--ui-subtle);
}

.subnav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-5);
  margin-block-end: var(--ui-space-5);
  padding-block-end: var(--ui-space-3);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
}
.subnav--scroll {
  flex-wrap: nowrap;
  min-width: max-content;
  margin-block-end: 0;
}
.subnav--scroll .subnav-link {
  white-space: nowrap;
}
.subnav-link {
  font-size: var(--ui-type-body);
  font-weight: 600;
  color: var(--ui-muted);
  text-decoration: none;
  padding-block-end: var(--ui-space-1);
  border-block-end: calc(var(--ui-border-width) * 2) solid transparent;
}
.subnav-link:hover {
  color: var(--ui-ink);
  text-decoration: none;
}
.subnav-link.is-active, .subnav-link:has(input:checked) {
  color: var(--ui-ink);
  border-block-end-color: var(--ui-accent);
}

.tasks-report {
  display: grid;
  border: var(--ui-border-width) solid var(--ui-border);
  font-size: var(--ui-type-caption);
}
.tasks-report > p {
  margin: 0;
}
.tasks-report-host {
  inset-inline-end: var(--ui-space-4);
  bottom: var(--ui-space-4);
  width: min(var(--ui-w-4), 100vw - var(--ui-space-4) * 2);
}
@media (max-width: 767.98px) {
  .tasks-report-host {
    inset-inline: var(--ui-space-2);
    bottom: var(--ui-space-2);
    width: auto;
  }
}
.tasks-report-tick-note {
  flex: 1;
  font-size: var(--ui-type-micro);
}
.tasks-report-failed:empty {
  display: none;
}

.table-editor th.table-editor-col--sm,
.table-editor td.table-editor-col--sm {
  min-width: calc(var(--ui-w-1) * 0.75);
}
.table-editor th.table-editor-col--md,
.table-editor td.table-editor-col--md {
  min-width: calc(var(--ui-w-1) + var(--ui-space-4));
}
.table-editor th.table-editor-col--lg,
.table-editor td.table-editor-col--lg {
  min-width: calc(var(--ui-w-2) + var(--ui-space-4));
}
.table-editor th.table-editor-col--xl,
.table-editor td.table-editor-col--xl {
  min-width: calc(var(--ui-w-3) + var(--ui-space-7));
  width: 100%;
}
.table-editor th.table-editor-col--leaving,
.table-editor td.table-editor-col--leaving {
  animation: table-editor-leave 0.22s ease forwards;
  pointer-events: none;
}
.table-editor-acts {
  white-space: nowrap;
  text-align: end;
}

@keyframes table-editor-leave {
  from {
    opacity: 1;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(calc(-1 * var(--ui-space-3)));
  }
}
[data-table-editor].is-dirty {
  background: var(--ui-warning-subtle);
}
[data-table-editor] .table-editor th.is-dirty {
  background: var(--ui-warning-veil);
}
[data-table-editor] .table-editor [data-row] > td.is-dirty {
  background: var(--ui-warning-veil);
}
[data-table-editor] .table-editor [data-row].is-dirty > td.table-editor-acts {
  background: var(--ui-warning-subtle);
}

.preview {
  min-height: var(--ui-w-1);
  max-height: calc(var(--ui-w-3) + var(--ui-space-7));
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.preview--md {
  min-height: var(--ui-w-1);
  max-height: calc(var(--ui-w-3) + var(--ui-space-7));
}
.preview--lg {
  min-height: calc(var(--ui-w-2) + var(--ui-space-7));
  max-height: var(--ui-w-5);
}

.tick {
  font-style: normal;
}
.tick::before {
  content: "✓";
  display: inline-grid;
  place-items: center;
  width: var(--ui-space-5);
  height: var(--ui-space-5);
  margin-inline-end: var(--ui-space-1);
  border-radius: 999px;
  background: var(--ui-success);
  color: var(--ui-surface);
  font-size: var(--ui-type-micro);
  font-weight: 800;
  line-height: 1;
  vertical-align: -0.3em;
}

.timeline {
  --timeline-label-width: calc(var(--ui-w-2) + var(--ui-space-4));
  --timeline-pad: var(--ui-space-3);
  --timeline-offset: calc(var(--timeline-pad) + var(--timeline-label-width) + var(--ui-space-3));
}
.timeline-scale {
  height: calc(var(--ui-control) - var(--ui-space-1));
  margin-inline: var(--timeline-offset) var(--timeline-pad);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
}
.timeline-tick {
  bottom: var(--ui-space-1);
  transform: translateX(-50%);
}
.timeline-tick i {
  font-style: normal;
}
.timeline-body {
  background-image: repeating-linear-gradient(to right, var(--ui-border) 0 1px, transparent 1px 20%);
  background-position: var(--timeline-offset) 0;
  background-size: calc(100% - var(--timeline-offset) - var(--timeline-pad)) 100%;
  background-repeat: no-repeat;
}
.timeline-row {
  border: 0;
  border-block-end: var(--ui-border-width) solid var(--ui-border);
  background: transparent;
  text-align: start;
}
.timeline-row:last-child {
  border-block-end: 0;
}
.timeline-row:hover {
  background: var(--ui-subtle);
}
.timeline-row.is-active {
  background: var(--ui-subtle);
  box-shadow: inset var(--ui-edge) 0 0 var(--ui-accent);
}
.timeline-label {
  flex: 0 0 var(--timeline-label-width);
  gap: 2px;
}
.timeline-track {
  height: calc(var(--ui-control) - var(--ui-space-1));
}
.timeline-bar {
  top: 50%;
  transform: translateY(-50%);
  height: var(--ui-control-sm);
  min-width: var(--ui-space-2);
  padding: 0 var(--ui-space-2);
  border: var(--ui-border-width) solid transparent;
}
.timeline-bar--soft {
  background: var(--ui-subtle);
  color: var(--ui-muted);
}
.timeline-bar--live {
  background: var(--ui-accent-subtle);
  border-color: var(--ui-accent-veil);
  color: var(--ui-ink);
}
.timeline-bar--due {
  background: var(--ui-warning-subtle);
  border-color: var(--ui-warning-veil);
  color: var(--ui-ink);
  font-weight: 600;
}
.timeline-bar--done {
  background: var(--ui-success-subtle);
  border-color: var(--ui-success-veil);
  color: var(--ui-ink);
}
.timeline-today {
  top: calc(var(--ui-space-3) * -1);
  bottom: calc(var(--ui-space-3) * -1);
  width: 2px;
  background: var(--ui-danger);
  opacity: 0.5;
}
@media (max-width: 767.98px) {
  .timeline {
    --timeline-offset: var(--timeline-pad);
  }
  .timeline .timeline-scale {
    margin-inline-start: var(--timeline-pad);
  }
  .timeline .timeline-body .timeline-row {
    flex-direction: column;
    align-items: stretch;
    gap: var(--ui-space-1);
  }
  .timeline .timeline-body .timeline-row .timeline-label {
    flex: 0 0 auto;
  }
}

.trail {
  position: sticky;
  top: var(--ui-trail-top);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ui-space-2) var(--ui-space-4);
  margin: 0 0 var(--ui-space-4);
  padding-block: var(--ui-space-2);
  padding-inline: var(--ui-space-4) var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-border);
  border-inline-start: var(--ui-space-1) solid var(--ui-dom-ink);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow-sm);
}
.trail nav {
  display: flex;
  align-items: center;
  flex: 1 1 calc(var(--ui-w-4) - var(--ui-space-7));
  gap: var(--ui-space-1);
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}
.trail nav::-webkit-scrollbar {
  height: 0;
}
.trail figure {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  justify-content: center;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  margin: 0;
  border: var(--ui-border-width) solid var(--ui-dom-line);
  border-radius: var(--ui-radius-sm);
  background: var(--ui-dom-soft);
}
.trail figure .icon {
  margin: 0;
  opacity: 0.85;
}
.trail button,
.trail .is-current {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: var(--ui-space-2);
  max-width: calc(var(--ui-w-3) - var(--ui-space-7));
  height: calc(var(--ui-control) - var(--ui-space-1));
  padding: 0 var(--ui-space-3);
  border: var(--ui-border-width) solid var(--ui-dom-line);
  border-radius: 999px;
  background: var(--ui-dom-soft);
  color: var(--ui-dom-strong);
  font-family: inherit;
  font-size: var(--ui-type-caption);
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.trail button {
  cursor: pointer;
}
.trail button:hover {
  border-color: var(--ui-dom-ink);
  background: var(--ui-dom-line);
}
.trail button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--ui-dom-line);
}
.trail .is-current {
  border-color: var(--ui-dom-ink);
  background: var(--ui-dom-ink);
  color: var(--ui-surface);
  cursor: default;
}
.trail s {
  flex: 0 0 auto;
  color: var(--ui-dom-line);
  font-size: var(--ui-type-caption);
  text-decoration: none;
}
.trail aside {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: var(--ui-space-2);
  margin-inline-start: auto;
}
@media (max-width: 991.98px) {
  .trail {
    flex-wrap: nowrap;
    gap: var(--ui-space-2);
    padding-inline: var(--ui-space-3) var(--ui-space-2);
  }
  .trail nav {
    flex: 1 1 0;
  }
  .trail aside {
    gap: var(--ui-space-1);
  }
}

.variant-line {
  padding: var(--ui-space-2) 0;
}
.variant-line + .variant-line {
  border-block-start: var(--ui-border-width) solid var(--ui-border);
}
.variant-line-sku {
  flex: none;
  color: var(--ui-muted);
  font-variant-numeric: tabular-nums;
}
.variant-line-sku.is-bad {
  color: var(--ui-danger);
  font-style: italic;
}

.variant-lines-title {
  font-size: var(--ui-type-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
  margin: 0;
}

.widget {
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  box-shadow: var(--ui-shadow-md);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.widget.is-current {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-shadow-md);
}
.widget.is-picked {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.widget.is-ok {
  border-color: var(--ui-success);
  background: var(--ui-success-subtle);
}
.widget-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ui-space-3);
  padding: var(--ui-space-4) var(--ui-space-5);
  border-block-end: var(--ui-border-width) solid var(--ui-border);
}
.widget-head--tint {
  background: linear-gradient(180deg, var(--ui-accent-soft), var(--ui-surface));
}
.widget-title {
  margin: 0;
  font-size: var(--ui-type-body);
  font-weight: 700;
}
.widget-title--lg {
  font-size: var(--ui-type-title);
  font-weight: 600;
}
.widget-sub {
  margin: 0;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
}
.widget-label {
  font-size: var(--ui-type-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
  margin: 0 0 var(--ui-space-3);
}
.widget-more {
  white-space: nowrap;
}
.widget-body {
  padding: var(--ui-space-4) var(--ui-space-5) var(--ui-space-5);
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-3);
  min-height: 0;
}
.widget-split {
  display: grid;
  gap: var(--ui-space-5);
}
@media (min-width: 768px) {
  .widget-split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.widget-split > :only-child {
  grid-column: 1/-1;
}
.widget-foot {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--ui-space-4);
  padding: var(--ui-space-5) var(--ui-space-6);
  border-block-start: var(--ui-border-width) solid var(--ui-border);
  background: var(--ui-subtle);
}
.widget-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-3);
  align-items: flex-end;
}
.widget-filters .form-control {
  border-radius: 999px;
  border-color: var(--ui-border);
}
.widget-filters fieldset.stack {
  flex: 1 1 100%;
  min-width: 0;
  margin: 0;
  border: 0;
  padding: 0;
}
@media (min-width: 576px) {
  .widget-filters fieldset.stack {
    flex: 1 1 calc(50% - var(--ui-space-3));
  }
}
@media (min-width: 1200px) {
  .widget-filters fieldset.stack {
    flex: 1 1 calc(33.333% - var(--ui-space-3));
  }
}
.widget-filters fieldset.stack label {
  font-size: var(--ui-type-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
  margin: 0;
}
.widget-filters fieldset.stack .form-control {
  width: 100%;
  min-width: 0;
}
.widget-chart {
  position: relative;
  flex: 1;
  min-height: calc(var(--ui-w-1) + var(--ui-space-7));
}
.widget-chart--lg {
  min-height: calc(var(--ui-w-3) + var(--ui-space-7));
  height: calc(var(--ui-w-4) + var(--ui-space-7) * 2);
}
.widget-hero {
  text-align: center;
  padding: var(--ui-space-2) 0 var(--ui-space-1);
}
.widget-hero-label {
  font-size: var(--ui-type-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  text-transform: uppercase;
}
.widget-hero-value {
  font-size: var(--ui-type-display);
  font-weight: 800;
  line-height: 1.1;
  color: var(--ui-accent);
}
.widget-tasks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--ui-space-2);
  flex: 1;
}
@media (max-width: 767.98px) {
  .widget-tasks {
    grid-template-columns: 1fr;
  }
}
.widget-task {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ui-space-1);
  min-height: calc(var(--ui-control-lg) * 2 + var(--ui-space-4));
  width: 100%;
  text-decoration: none;
  color: inherit;
  background: var(--ui-subtle);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  padding: var(--ui-space-3) var(--ui-space-4);
  transition: border-color 0.15s, box-shadow 0.15s;
}
.widget-task:hover {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring-soft);
  text-decoration: none;
  color: inherit;
}
.widget-task-label {
  font-size: var(--ui-type-caption);
  color: var(--ui-muted);
}
.widget-task-value {
  font-size: var(--ui-type-title);
  font-weight: 700;
}
@media (max-width: 991.98px) {
  .widget[data-filter-root] {
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
  }
}
@media (max-width: 991.98px) {
  .widget[data-filter-root] .widget-head {
    display: none;
  }
}
@media (max-width: 991.98px) {
  .widget[data-filter-root] [data-filter-search-row] {
    position: relative;
    padding: var(--ui-space-4) var(--ui-space-5);
  }
}
@media (max-width: 991.98px) {
  .widget[data-filter-root] [data-filter-search-row] fieldset label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
  }
}
@media (max-width: 991.98px) {
  .widget[data-filter-root] [data-filter-search-row] .field-inset-end-field[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
  }
}
@media (min-width: 992px) {
  .widget[data-filter-root] [data-filter-search-row] .field-inset-end-field[type=search] {
    padding-inline-end: var(--ui-space-3);
  }
}
.widget[data-filter-root] [data-filter-search-row] [data-filter-open] {
  display: none;
}
@media (max-width: 991.98px) {
  .widget[data-filter-root] [data-filter-search-row] [data-filter-open] {
    display: grid;
  }
}
.widget[data-filter-root] [data-filter-analysis] {
  border-block-start: var(--ui-border-width) dashed var(--ui-border);
}
.widget[data-filter-root] .widget-foot .widget-filters fieldset {
  flex: 0 1 auto;
  max-width: none;
}
.widget[data-filter-root] .widget-foot .widget-filters fieldset .form-control {
  min-width: var(--ui-w-2);
}

.modal.bottom-drawer .modal-header {
  align-items: center;
  gap: var(--ui-space-2);
}
.modal.bottom-drawer .modal-header:has([data-shortcut-bar]) > i,
.modal.bottom-drawer .modal-header:has([data-shortcut-bar]) > strong {
  display: none;
}
.modal.bottom-drawer .modal-header [data-shortcut-bar] {
  flex: 1 1 auto;
  min-width: 0;
}
.modal.bottom-drawer .modal-header .shortcut-bar {
  width: 100%;
  min-width: 0;
}
.modal.bottom-drawer .modal-header .shortcut-bar-select {
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
}

.grid-stack {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: var(--ui-space-3);
  min-height: 0;
  width: 100%;
}

.grid-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(calc(var(--ui-w-1) - var(--ui-space-6)), 1fr));
  gap: var(--ui-space-2);
}

.metric {
  background: var(--ui-subtle);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  padding: var(--ui-space-3) var(--ui-space-3);
}
.metric-label {
  font-size: var(--ui-type-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
  display: block;
  letter-spacing: 0.03em;
}
.metric-value {
  font-size: var(--ui-type-body);
  font-weight: 700;
}

[style*="--tint"],
[style*="--menu-color"],
.tint-fill,
.tint-band,
.pick-tile,
.chip {
  --channel-ink: var(--ui-white);
  --tint-subtle: color-mix(in srgb, var(--tint) 12%, var(--ui-surface));
  --tint-medium: color-mix(in srgb, var(--tint) 24%, var(--ui-surface));
  --tint-soft: color-mix(in srgb, var(--tint) 42%, var(--ui-surface));
  --tint-strong: color-mix(in srgb, var(--tint) 72%, var(--ui-surface));
  --tint-edge: color-mix(in srgb, var(--tint) 40%, var(--ui-border));
  --tint-edge-on: color-mix(in srgb, var(--tint) 68%, var(--ui-border));
  --tint-emphasis: color-mix(in srgb, var(--tint) 78%, var(--ui-ink));
  --tint-halo: color-mix(in srgb, var(--tint) 32%, transparent);
  --tint-halo-on: color-mix(in srgb, var(--tint) 55%, transparent);
}

.tone-cyan {
  --tone: var(--ui-status-cyan);
  --tone-deep: var(--ui-status-cyan-deep);
  --tone-ink: var(--ui-black);
  --tone-mark: 1;
  --tone-mark-op: 0.08;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-cyan th {
  color: inherit;
}

.tone-green {
  --tone: var(--ui-status-green);
  --tone-deep: var(--ui-status-green-deep);
  --tone-ink: var(--ui-black);
  --tone-mark: 1;
  --tone-mark-op: 0.08;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-green th {
  color: inherit;
}

.tone-orange {
  --tone: var(--ui-status-orange);
  --tone-deep: var(--ui-status-orange-deep);
  --tone-ink: var(--ui-black);
  --tone-mark: 1;
  --tone-mark-op: 0.08;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-orange th {
  color: inherit;
}

.tone-purple {
  --tone: var(--ui-status-purple);
  --tone-deep: var(--ui-status-purple-deep);
  --tone-ink: var(--ui-black);
  --tone-mark: 1;
  --tone-mark-op: 0.08;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-purple th {
  color: inherit;
}

.tone-yellow {
  --tone: var(--ui-status-yellow);
  --tone-deep: var(--ui-status-yellow-deep);
  --tone-ink: var(--ui-black);
  --tone-mark: 1;
  --tone-mark-op: 0.08;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-yellow th {
  color: inherit;
}

.tone-red {
  --tone: var(--ui-status-red);
  --tone-deep: var(--ui-status-red-deep);
  --tone-ink: var(--ui-black);
  --tone-mark: 1;
  --tone-mark-op: 0.08;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-red th {
  color: inherit;
}

.tone-sand {
  --tone: var(--ui-status-orange-subtle);
  --tone-deep: var(--ui-status-orange-edge);
  --tone-ink: var(--ui-ink);
  --tone-mark: 0;
  --tone-mark-op: 0.07;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-sand th {
  color: inherit;
}

.tone-stone {
  --tone: var(--ui-ink-subtle);
  --tone-deep: var(--ui-ink-edge);
  --tone-ink: var(--ui-ink);
  --tone-mark: 0;
  --tone-mark-op: 0.06;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-stone th {
  color: inherit;
}

.tone-plain {
  --tone: var(--ui-surface);
  --tone-deep: var(--ui-border);
  --tone-ink: var(--ui-ink);
  --tone-mark: 0;
  --tone-mark-op: 0.06;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-plain th {
  color: inherit;
}

.tone-off {
  --tone: var(--ui-status-disabled);
  --tone-deep: var(--ui-status-disabled-deep);
  --tone-ink: var(--ui-ink);
  --tone-mark: 0;
  --tone-mark-op: 0.06;
  background-color: var(--tone);
  color: var(--tone-ink);
}
.tone-off th {
  color: inherit;
}

.tint-fill {
  background: var(--tint-soft);
  border-color: var(--tint-soft);
  color: var(--ui-ink);
}
.tint-fill:hover:not(:disabled), .tint-fill:focus-visible {
  background: var(--tint-strong);
  border-color: var(--tint-strong);
  color: var(--ui-ink);
}
.tint-wash {
  background: var(--tint-subtle);
}
.tint-badge {
  background-color: var(--ui-white-veil);
  color: inherit;
}
.tint-band {
  position: relative;
  overflow: hidden;
  border-radius: var(--ui-radius-md);
  background: var(--tint-soft);
}
.tint-band-kicker {
  font-size: var(--ui-type-caption);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ui-muted);
  color: var(--ui-ink);
  opacity: 0.65;
}
.tint-band-title {
  margin: 0;
}
.tint-band-title a {
  color: inherit;
  text-decoration: none;
}
.tint-band-title a:hover {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.tint-band-title a:focus-visible {
  outline: 2px solid var(--ui-ink);
  outline-offset: var(--ui-edge);
  border-radius: var(--ui-radius-sm);
}
.tint-band-external-link {
  display: inline;
  margin-inline-start: var(--ui-space-1);
  color: inherit;
}
.tint-band-external-link .icon {
  margin: 0 0 0.15em;
  opacity: 0.6;
}
.tint-band-external-link:hover .icon {
  opacity: 1;
}
.tint-band-external-link:focus-visible {
  outline: 2px solid var(--ui-ink);
  outline-offset: 2px;
  border-radius: 2px;
}
.tint-band-body {
  position: relative;
}
.tint-cta.form-disabled {
  color: transparent;
}
.tint-cta > .ajax-loader {
  width: calc(var(--ui-icon-xs) * 1.25);
  height: calc(var(--ui-icon-xs) * 1.25);
  border-width: 2px;
}
.tint-cta > .ajax-loader::after {
  width: var(--ui-space-3);
  height: var(--ui-space-3);
}
.tint-cta-logo {
  width: var(--ui-icon-xs);
  height: var(--ui-icon-xs);
  flex: none;
  border-radius: 999px;
  object-fit: contain;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.tint-cta-logo[hidden] {
  display: none;
}

.pick-tile {
  --channel-ink: var(--ui-ink);
  --chip-hover: var(--tint-subtle);
  --chip-hover-edge: var(--tint-edge);
  --chip-on: var(--tint-medium);
  --chip-on-edge: var(--tint-edge-on);
  --chip-on-hover: var(--tint-medium);
  margin: 0;
  padding: var(--ui-space-3) var(--ui-space-4);
  min-height: var(--ui-control-lg);
  border: 2px solid var(--ui-border);
  font-weight: normal;
  transition: border-color 0.14s ease, background 0.14s ease, box-shadow 0.14s ease;
}
.pick-tile:hover {
  border-color: var(--chip-hover-edge);
  background: var(--chip-hover);
}
.pick-tile:focus-within {
  outline: 2px solid var(--ui-accent);
  outline-offset: 2px;
}
.pick-tile.is-active {
  border-color: var(--chip-on-edge);
  background: var(--chip-on);
  box-shadow: inset 0 0 0 1px var(--tint-halo);
}
.pick-tile.is-active:hover {
  border-color: var(--tint);
  background: var(--chip-on-hover);
  box-shadow: var(--ui-shadow-sm), inset 0 0 0 1px var(--tint-halo);
}
.pick-tile.is-active .pick-tile-mark {
  background: var(--tint);
  border-color: var(--tint);
  box-shadow: inset 0 0 0 2px var(--ui-surface);
}
.pick-tile.is-disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.pick-tile-mark {
  flex: none;
  width: calc(var(--ui-icon-xs) * 0.75);
  height: calc(var(--ui-icon-xs) * 0.75);
  border-radius: 50%;
  border: 2px solid var(--ui-border);
}
.pick-tile:hover .pick-tile-mark {
  border-color: var(--chip-hover-edge);
}
.pick-tile-name {
  font-size: var(--ui-type-caption);
}
.pick-tile-note {
  font-size: var(--ui-type-caption);
}
.pick-tile-icon {
  flex: none;
  width: calc(var(--ui-icon-xs) * 1.25);
  height: calc(var(--ui-icon-xs) * 1.25);
  margin-inline-start: auto;
  border-radius: 50%;
  object-fit: cover;
  background: var(--tint-subtle);
}

.wire-board {
  --rail-1: var(--ui-thumb);
  --rail-2: calc(var(--ui-w-1) - var(--ui-space-7));
  --var-h: calc(var(--ui-control-lg) + var(--ui-space-1));
  --sku-w: calc(var(--ui-w-1) - var(--ui-space-4));
  position: relative;
  min-width: var(--ui-w-7);
  overflow: hidden;
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
}
.wire-board.has-ports .wire-board-port {
  display: grid;
}
.wire-board:not(.has-ports) .wire-board-card--out .wire-board-head {
  cursor: grab;
}
.wire-board:not(.has-ports) .wire-board-card--out .wire-board-head:active {
  cursor: grabbing;
}
.wire-board.has-wiring-out .wire-board-port--in, .wire-board.has-wiring-in .wire-board-port--out {
  border-color: var(--ui-accent-veil);
  transform: translateY(-50%) scale(1.15);
}
.wire-board.has-wiring-out .wire-board-port--in::before, .wire-board.has-wiring-in .wire-board-port--out::before {
  background: var(--ui-accent-veil);
}
.wire-board.has-wiring-out .wire-board-port--in:hover, .wire-board.has-wiring-out .wire-board-port--in.is-active, .wire-board.has-wiring-in .wire-board-port--out:hover, .wire-board.has-wiring-in .wire-board-port--out.is-active {
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
  box-shadow: 0 0 0 var(--ui-space-1) var(--ui-accent-veil);
}
.wire-board.has-wiring-out .wire-board-port--in:hover::before, .wire-board.has-wiring-out .wire-board-port--in.is-active::before, .wire-board.has-wiring-in .wire-board-port--out:hover::before, .wire-board.has-wiring-in .wire-board-port--out.is-active::before {
  background: var(--ui-accent);
}
.wire-board-row {
  display: flex;
  flex-wrap: nowrap;
}
.wire-board-row--head .wire-board-cell {
  position: relative;
  overflow: hidden;
  align-items: center;
  text-align: center;
  padding-block: var(--ui-space-5);
}
.wire-board-row--head .wire-board-cell--a {
  background: var(--tint-soft);
}
.wire-board-row--head .wire-board-cell--b {
  border-inline-start-color: transparent;
  background: color-mix(in srgb, var(--ui-accent) 42%, var(--ui-surface));
}
.wire-board-row--rails .wire-board-cell {
  padding-block: var(--ui-space-6) var(--ui-space-4);
}
.wire-board-row--body .wire-board-cell {
  min-height: var(--ui-w-3);
  padding-block-end: var(--ui-space-5);
}
.wire-board-row--sub {
  border-block-start: var(--ui-border-width) solid var(--ui-border);
}
.wire-board-row--foot .wire-board-cell {
  padding-block-end: var(--ui-space-6);
}
.wire-board-row--foot .wire-board-cell--b {
  justify-content: flex-start;
  padding-block-start: var(--ui-space-2);
}
.wire-board-cell {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 0 var(--ui-space-6);
}
.wire-board-cell--a {
  background: var(--tint-subtle);
}
.wire-board-cell--a .wire-board-var,
.wire-board-cell--a .wire-board-vars-head {
  padding-inline-end: var(--ui-space-8);
}
.wire-board-cell--b {
  background: var(--ui-accent-subtle);
  border-inline-start: var(--ui-border-width) solid var(--ui-border);
}
.wire-board-cell--b .wire-board-var,
.wire-board-cell--b .wire-board-vars-head {
  padding-inline-start: var(--ui-space-8);
}
.wire-board-mark {
  inset-inline-start: 50%;
  top: 50%;
  width: var(--ui-thumb-lg);
  height: var(--ui-thumb-lg);
  margin: 0;
  transform: translate(-50%, -50%);
  opacity: 0.5;
  pointer-events: none;
}
.wire-board-rail {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: var(--rail-1);
}
.wire-board-card {
  position: relative;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  transition: border-color 0.15s, box-shadow 0.15s;
}
.wire-board-card:hover {
  border-color: var(--ui-muted);
  box-shadow: var(--ui-shadow-sm);
}
.wire-board-head {
  height: var(--rail-2);
  padding: var(--ui-space-3);
  border-block-end: var(--ui-border-width) solid var(--ui-subtle);
}
.wire-board-vars-head {
  height: var(--ui-control);
  padding: 0 var(--ui-space-4);
  border-block-end: var(--ui-border-width) solid var(--ui-subtle);
}
.wire-board-var {
  position: relative;
  min-height: var(--var-h);
  padding: var(--ui-space-1) var(--ui-space-4);
  transition: background 0.12s;
}
.wire-board-var + .wire-board-var {
  border-block-start: var(--ui-border-width) solid var(--ui-subtle);
}
.wire-board-var:hover {
  background: var(--ui-subtle);
}
.wire-board-field {
  flex: 0 0 var(--sku-w);
  text-align: start;
  color: var(--ui-muted);
}
.wire-board-sku {
  flex: 0 0 var(--sku-w);
  width: var(--sku-w);
}
.wire-board-sku.is-empty {
  font-style: italic;
  font-family: var(--ui-font);
}
.wire-board-sku-input {
  flex: 0 0 var(--sku-w);
  width: var(--sku-w);
  padding: 2px var(--ui-space-2);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-sm);
  color: var(--ui-ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: var(--ui-type-micro);
  line-height: 1.2;
  transition: 0.12s;
}
.wire-board-sku-input:focus {
  outline: none;
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring);
}
.wire-board-sku-input::placeholder {
  color: var(--ui-muted);
  font-style: italic;
  font-family: var(--ui-font);
}
.wire-board-port {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: none;
  place-items: center;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  border-radius: 50%;
  border: var(--ui-border-width) solid var(--ui-ink-veil);
  cursor: grab;
  touch-action: none;
  transform: translateY(-50%);
  transition: border-color 0.12s, box-shadow 0.12s, background-color 0.12s, transform 0.12s;
}
.wire-board-port::before {
  content: "";
  width: var(--ui-space-2);
  height: var(--ui-space-2);
  border-radius: 50%;
  background: var(--ui-ink-veil);
  transition: 0.12s;
}
.wire-board-port::after {
  content: "";
  position: absolute;
  top: 50%;
  inset-inline-start: 50%;
  width: var(--ui-thumb);
  height: var(--ui-thumb);
  transform: translate(-50%, -50%);
  border-radius: 50%;
}
.wire-board-port:hover {
  border-color: var(--ui-accent-veil);
}
.wire-board-port:hover::before {
  background: var(--ui-accent);
}
.wire-board-port--out {
  inset-inline-end: var(--ui-space-2);
}
.wire-board-port--in {
  inset-inline-start: var(--ui-space-2);
}
.wire-board-port.has-wire {
  border-color: var(--ui-accent-veil);
}
.wire-board-port.has-wire::before {
  background: var(--ui-accent);
}
.wire-board-port.is-picked {
  border-color: var(--ui-warning);
  box-shadow: 0 0 0 var(--ui-edge) var(--ui-warning-veil);
}
.wire-board-port.is-picked::before {
  background: var(--ui-warning);
  width: var(--ui-space-2);
  height: var(--ui-space-2);
}
.wire-board-port.is-current {
  box-shadow: 0 0 0 var(--ui-edge) var(--ui-accent-veil);
}
.wire-board-wires {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
  transition: opacity 0.12s ease;
}
.wire-board-wires.is-loading {
  opacity: 0;
}
.wire-board-wire {
  fill: none;
  stroke: var(--ui-accent);
  stroke-width: 2px;
  opacity: 0.85;
}
.wire-board-wire--suggested {
  stroke: var(--ui-warning);
  stroke-dasharray: 4 5;
}
.wire-board-wire--temp {
  stroke: var(--ui-warning);
  stroke-dasharray: 3 4;
}
.wire-board-wire.is-current {
  stroke: var(--ui-accent);
  stroke-width: 3;
  opacity: 1;
}
.wire-board-queue {
  position: relative;
  margin-block-start: var(--ui-space-2);
}
.wire-board-queue > * + * {
  border-block-start: var(--ui-border-width) solid var(--ui-subtle);
}
.wire-board-queue > :nth-child(2) {
  opacity: 0.74;
  font-size: 0.94em;
}
.wire-board-queue > :nth-child(3) {
  opacity: 0.54;
  font-size: 0.88em;
}
.wire-board-queue > :nth-child(4) {
  opacity: 0.38;
  font-size: 0.82em;
}
.wire-board-queue > :nth-child(5) {
  opacity: 0.26;
  font-size: 0.76em;
}
.wire-board-queue > .wire-board-card--promoted {
  animation: wire-board-pop 0.28s ease;
}
.wire-board-card--entering {
  animation: wire-board-enter 0.46s cubic-bezier(0.2, 0.9, 0.3, 1.2);
}
.wire-board-card--leaving {
  opacity: 0;
  transform: translateY(calc(-1 * var(--ui-icon-xs)));
  transition: opacity 0.22s ease, transform 0.22s ease;
}
.wire-board-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-block-end: var(--ui-space-2);
}
@media (max-width: 767.98px) {
  .wire-board {
    min-width: 0;
    width: max-content;
  }
  .wire-board .wire-board-cell {
    min-width: 86vw;
    max-width: 86vw;
    padding-inline: var(--ui-space-4);
  }
  .wire-board .mark-edge {
    width: var(--ui-w-1);
    height: var(--ui-w-1);
  }
  .wire-board .mark-edge--start {
    inset-inline-start: calc(-1 * var(--ui-space-6));
  }
  .wire-board .mark-edge--end {
    inset-inline-end: calc(-1 * var(--ui-space-6));
  }
}

@keyframes wire-board-enter {
  0% {
    opacity: 0;
    transform: scale(0.92) translateY(var(--ui-space-3));
  }
  55% {
    opacity: 1;
    transform: scale(1.04) translateY(-3px);
  }
  100% {
    transform: scale(1) translateY(0);
  }
}
@keyframes wire-board-pop {
  0% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.05);
    background: var(--ui-accent-soft);
  }
  100% {
    transform: scale(1);
  }
}
.wizard-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ui-space-3);
}
.wizard-rail {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ui-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}
.wizard-step {
  display: flex;
  align-items: center;
  gap: var(--ui-space-2);
  flex: 1 1 calc(var(--ui-w-1) + var(--ui-space-7));
  border-block-start: var(--ui-edge) solid var(--ui-border);
  padding-block-start: var(--ui-space-2);
}
.wizard-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ui-control-sm);
  height: var(--ui-control-sm);
  border-radius: 999px;
  background: var(--ui-subtle);
  font-weight: 700;
}
.wizard-step.is-ok {
  border-block-start-color: var(--ui-accent-edge);
  color: var(--ui-ink);
}
.wizard-step.is-current {
  border-block-start-color: var(--ui-accent);
  color: var(--ui-ink);
}
.wizard-step.is-current .wizard-step-num {
  background: var(--ui-accent);
  color: var(--ui-bg);
}
.wizard-pane {
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-4);
  padding: var(--ui-space-5);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-lg);
  background: var(--ui-surface);
}
.wizard-pane-lede {
  margin: calc(var(--ui-space-4) * -1 + var(--ui-space-1)) 0 0;
  color: var(--ui-muted);
}
.wizard-foot {
  display: flex;
  align-items: center;
  gap: var(--ui-space-3);
  border-block-start: var(--ui-border-width) solid var(--ui-border);
  padding-block-start: var(--ui-space-4);
}
.wizard-cta {
  display: flex;
  align-items: center;
  gap: var(--ui-space-3);
}
@media (max-width: 575.98px) {
  .wizard-step {
    flex-basis: calc(var(--ui-w-1) * 0.75);
  }
}
@media (max-width: 767.98px) {
  .wizard-pane {
    padding: var(--ui-space-4);
  }
  .wizard-foot {
    flex-wrap: wrap;
  }
  .wizard-foot .wizard-cta {
    width: 100%;
    justify-content: flex-end;
  }
}

.text-ink {
  color: var(--ui-ink);
}

.text-muted {
  color: var(--ui-muted);
}

.text-accent {
  color: var(--ui-accent);
}

.text-success {
  color: var(--ui-success);
}

.text-danger {
  color: var(--ui-danger);
}

.text-warning {
  color: var(--ui-warning);
}

.text-info {
  color: var(--ui-info);
}

.text-accent-emphasis {
  color: var(--ui-accent-emphasis);
}

.text-success-emphasis {
  color: var(--ui-success-emphasis);
}

.text-danger-emphasis {
  color: var(--ui-danger-emphasis);
}

.text-warning-emphasis {
  color: var(--ui-warning-emphasis);
}

.text-info-emphasis {
  color: var(--ui-info-emphasis);
}

.type-micro {
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
}

.type-caption {
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}

.type-body {
  font-size: var(--ui-type-body);
  line-height: var(--ui-type-body-lh);
}

.type-title {
  font-size: var(--ui-type-title);
  line-height: var(--ui-type-title-lh);
}

.type-display {
  font-size: var(--ui-type-display);
  line-height: var(--ui-type-display-lh);
}

.type-hero {
  font-size: var(--ui-type-hero);
  line-height: var(--ui-type-hero-lh);
}

.fw-400 {
  font-weight: 400;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

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

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.uppercase {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.italic {
  font-style: italic;
}

.text-nowrap {
  white-space: nowrap;
}

.text-balance {
  text-wrap: balance;
}

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

a.truncate {
  display: block;
  max-width: 100%;
}

.truncate-edges {
  --edges: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--edges);
  overflow: hidden;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.uncapitalize {
  display: inline-block;
}
.uncapitalize::first-letter {
  text-transform: lowercase;
}

.tabular {
  font-variant-numeric: tabular-nums;
}

.mark {
  color: var(--ui-dom-strong);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: var(--ui-dom-line);
  text-decoration-thickness: 0.4em;
  text-decoration-skip-ink: none;
  text-underline-offset: -0.12em;
}

.caps-micro {
  font-size: var(--ui-type-micro);
  line-height: var(--ui-type-micro-lh);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ink-muted,
.ink-muted-emphasis {
  color: var(--ui-muted-emphasis);
}

.ink-accent,
.ink-accent-emphasis {
  color: var(--ui-accent-emphasis);
}

.ink-success,
.ink-success-emphasis {
  color: var(--ui-success-emphasis);
}

.ink-danger,
.ink-danger-emphasis {
  color: var(--ui-danger-emphasis);
}

.ink-warning,
.ink-warning-emphasis {
  color: var(--ui-warning-emphasis);
}

.ink-info,
.ink-info-emphasis {
  color: var(--ui-info-emphasis);
}

.ink-base {
  color: var(--ui-ink);
}

.underline {
  text-decoration: underline;
}

.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  line-height: 1.45;
}

.background-main {
  background: var(--ui-surface);
}

.background-page {
  background: var(--ui-bg);
}

.background-subtle {
  background: var(--ui-subtle);
}

.background-ink {
  background: var(--ui-ink);
  color: var(--ui-surface);
}

.radius-sm {
  border-radius: var(--ui-radius-sm);
}

.elevation-sm {
  box-shadow: var(--ui-shadow-sm);
}

.radius-md {
  border-radius: var(--ui-radius-md);
}

.elevation-md {
  box-shadow: var(--ui-shadow-md);
}

.radius-lg {
  border-radius: var(--ui-radius-lg);
}

.radius-pill {
  border-radius: 999px;
}

.elevation-none {
  box-shadow: none;
}

.outline-none {
  border: 0;
}

.outline-base {
  border: var(--ui-border-width) solid var(--ui-border);
}

.outline-strong {
  border: var(--ui-border-width) solid var(--ui-ink);
}

.block {
  display: block;
}

.inline {
  display: inline;
}

.inline-block {
  display: inline-block;
}

.hidden {
  display: none;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.w-full {
  width: 100%;
}

.w-tenth {
  width: 10%;
}

.w-1 {
  width: 1rem;
  min-width: 1rem;
}

.w-2 {
  width: 2rem;
  min-width: 2rem;
}

.w-3 {
  width: 3rem;
  min-width: 3rem;
}

.w-4 {
  width: 4rem;
  min-width: 4rem;
}

.w-5 {
  width: 5rem;
  min-width: 5rem;
}

.w-6 {
  width: 6rem;
  min-width: 6rem;
}

.w-8 {
  width: 8rem;
  min-width: 8rem;
}

.w-10 {
  width: 10rem;
  min-width: 10rem;
}

.w-12 {
  width: 12rem;
  min-width: 12rem;
}

.w-14 {
  width: 14rem;
  min-width: 14rem;
}

.w-16 {
  width: 16rem;
  min-width: 16rem;
}

.w-20 {
  width: 20rem;
  min-width: 20rem;
}

.w-24 {
  width: 24rem;
  min-width: 24rem;
}

.min-w-0 {
  min-width: 0;
}

.grow {
  flex: 1 1 auto;
  min-width: 0;
}

.fixed {
  flex: 0 0 auto;
}

.push-end {
  margin-inline-start: auto;
}

.faded {
  opacity: 0.5;
}

.dimmed {
  opacity: 0.45;
  filter: grayscale(0.35);
  pointer-events: none;
  user-select: none;
}

@media (max-width: 991.98px) {
  .block-mobile {
    display: block;
  }
}
@media (min-width: 992px) {
  .block-mobile + .block-mobile::before {
    content: " · ";
  }
}
@media (min-width: 768px) {
  .narrow-only {
    display: none;
  }
}
.padding-1 {
  padding: var(--ui-space-1);
}

.padding-x-1 {
  padding-inline: var(--ui-space-1);
}

.padding-y-1 {
  padding-block: var(--ui-space-1);
}

.margin-1 {
  margin: var(--ui-space-1);
}

.margin-t-1 {
  margin-block-start: var(--ui-space-1);
}

.margin-b-1 {
  margin-block-end: var(--ui-space-1);
}

.padding-2 {
  padding: var(--ui-space-2);
}

.padding-x-2 {
  padding-inline: var(--ui-space-2);
}

.padding-y-2 {
  padding-block: var(--ui-space-2);
}

.margin-2 {
  margin: var(--ui-space-2);
}

.margin-t-2 {
  margin-block-start: var(--ui-space-2);
}

.margin-b-2 {
  margin-block-end: var(--ui-space-2);
}

.padding-3 {
  padding: var(--ui-space-3);
}

.padding-x-3 {
  padding-inline: var(--ui-space-3);
}

.padding-y-3 {
  padding-block: var(--ui-space-3);
}

.margin-3 {
  margin: var(--ui-space-3);
}

.margin-t-3 {
  margin-block-start: var(--ui-space-3);
}

.margin-b-3 {
  margin-block-end: var(--ui-space-3);
}

.padding-4 {
  padding: var(--ui-space-4);
}

.padding-x-4 {
  padding-inline: var(--ui-space-4);
}

.padding-y-4 {
  padding-block: var(--ui-space-4);
}

.margin-4 {
  margin: var(--ui-space-4);
}

.margin-t-4 {
  margin-block-start: var(--ui-space-4);
}

.margin-b-4 {
  margin-block-end: var(--ui-space-4);
}

.padding-5 {
  padding: var(--ui-space-5);
}

.padding-x-5 {
  padding-inline: var(--ui-space-5);
}

.padding-y-5 {
  padding-block: var(--ui-space-5);
}

.margin-5 {
  margin: var(--ui-space-5);
}

.margin-t-5 {
  margin-block-start: var(--ui-space-5);
}

.margin-b-5 {
  margin-block-end: var(--ui-space-5);
}

.padding-6 {
  padding: var(--ui-space-6);
}

.padding-x-6 {
  padding-inline: var(--ui-space-6);
}

.padding-y-6 {
  padding-block: var(--ui-space-6);
}

.margin-6 {
  margin: var(--ui-space-6);
}

.margin-t-6 {
  margin-block-start: var(--ui-space-6);
}

.margin-b-6 {
  margin-block-end: var(--ui-space-6);
}

.padding-0 {
  padding: 0;
}

.margin-0 {
  margin: 0;
}

.bg-accent-subtle {
  background: var(--ui-accent-subtle);
}

.line-accent {
  border: var(--ui-border-width) solid var(--ui-accent-edge);
}

.bg-success-subtle {
  background: var(--ui-success-subtle);
}

.line-success {
  border: var(--ui-border-width) solid var(--ui-success-edge);
}

.bg-danger-subtle {
  background: var(--ui-danger-subtle);
}

.line-danger {
  border: var(--ui-border-width) solid var(--ui-danger-edge);
}

.bg-warning-subtle {
  background: var(--ui-warning-subtle);
}

.line-warning {
  border: var(--ui-border-width) solid var(--ui-warning-edge);
}

.bg-info-subtle {
  background: var(--ui-info-subtle);
}

.line-info {
  border: var(--ui-border-width) solid var(--ui-info-edge);
}

.bg-muted-subtle {
  background: var(--ui-muted-subtle);
}

.line-muted {
  border: var(--ui-border-width) solid var(--ui-muted-edge);
}

.h-full {
  height: 100%;
}

.of-hidden {
  overflow: hidden;
}

.of-auto {
  overflow: auto;
}

.pointer {
  cursor: pointer;
}

.hide-empty:empty {
  display: none;
}

.col-full {
  grid-column: 1/-1;
}

.ratio-1-1 {
  aspect-ratio: 1/1;
  object-fit: cover;
}

.ratio-16-9 {
  aspect-ratio: 16/9;
}

.outline-dashed {
  border-style: dashed;
}

.bg-cover {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.stack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.row-center {
  display: flex;
  align-items: center;
}

.inline-row {
  display: inline-flex;
  align-items: center;
}

.row-baseline {
  display: flex;
  align-items: baseline;
}

.center-grid {
  display: grid;
  place-items: center;
}

.cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.layout-cols-1 {
  display: grid;
  gap: var(--ui-space-3);
  grid-template-columns: repeat(1, minmax(0, 1fr));
  align-items: stretch;
}
@supports (grid-template-rows: subgrid) {
  .layout-cols-1 {
    grid-template-rows: auto auto auto auto;
  }
  .layout-cols-1 > .layout-subgrid {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
  }
}
@media (max-width: 575.98px) {
  .layout-cols-1 > .layout-subgrid {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
}

.layout-cols-2 {
  display: grid;
  gap: var(--ui-space-3);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}
@supports (grid-template-rows: subgrid) {
  .layout-cols-2 {
    grid-template-rows: auto auto auto auto;
  }
  .layout-cols-2 > .layout-subgrid {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
  }
}
@media (max-width: 575.98px) {
  .layout-cols-2 > .layout-subgrid {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
}

.layout-cols-3 {
  display: grid;
  gap: var(--ui-space-3);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
@supports (grid-template-rows: subgrid) {
  .layout-cols-3 {
    grid-template-rows: auto auto auto auto;
  }
  .layout-cols-3 > .layout-subgrid {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
  }
}
@media (max-width: 575.98px) {
  .layout-cols-3 > .layout-subgrid {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
}

.layout-cols-4 {
  display: grid;
  gap: var(--ui-space-3);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
}
@supports (grid-template-rows: subgrid) {
  .layout-cols-4 {
    grid-template-rows: auto auto auto auto;
  }
  .layout-cols-4 > .layout-subgrid {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
  }
}
@media (max-width: 575.98px) {
  .layout-cols-4 > .layout-subgrid {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
}

.layout-cols-var {
  --layout-cols: 2;
  display: grid;
  gap: var(--ui-space-3);
  grid-template-columns: repeat(var(--layout-cols), minmax(0, 1fr));
  align-items: stretch;
}
@supports (grid-template-rows: subgrid) {
  .layout-cols-var {
    grid-template-rows: auto auto auto auto;
  }
  .layout-cols-var > .layout-subgrid {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
  }
}
@media (max-width: 575.98px) {
  .layout-cols-var > .layout-subgrid {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
}
@media (max-width: 575.98px) {
  .layout-cols-var {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gap-1 {
  gap: var(--ui-space-1);
}

.gap-2 {
  gap: var(--ui-space-2);
}

.gap-3 {
  gap: var(--ui-space-3);
}

.gap-4 {
  gap: var(--ui-space-4);
}

.gap-5 {
  gap: var(--ui-space-5);
}

.gap-6 {
  gap: var(--ui-space-6);
}

.gap-0 {
  gap: 0;
}

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

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

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

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

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

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

.align-baseline {
  align-items: baseline;
}

.band {
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-4);
  padding-block: var(--ui-space-5) var(--ui-space-6);
  border-top: var(--ui-border-width) solid var(--ui-border);
}
.band:first-child {
  border-top: 0;
}

.band-tall {
  justify-content: center;
  min-height: calc(100svh - var(--ui-chrome-h) - 2rem);
}

.fill {
  flex: 1 1 auto;
  min-height: 0;
}

.grid-aside-2 {
  --aside: 13rem;
  display: grid;
  gap: var(--ui-space-3);
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {
  .grid-aside-2 {
    grid-template-columns: minmax(0, var(--aside)) minmax(0, 1fr);
  }
}
.grid-aside-2--narrow {
  --aside: 9rem;
}

.grid-aside-2--wide {
  --aside: 22rem;
}

.grid-aside-2--thirds {
  --aside: 0.5fr;
}

@media (min-width: 768px) {
  .grid-aside-2--end {
    grid-template-columns: minmax(0, 1fr) minmax(0, var(--aside));
  }
}
.grid-aside-2--stages {
  --aside: 22rem;
  gap: var(--ui-space-6);
  align-items: start;
}

@media (max-width: 767.98px) {
  .grid-aside-2--stages:not(.has-detail) > :last-child,
  .grid-aside-2--stages.has-detail > :first-child {
    display: none;
  }
}
.layout-grid-12 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ui-space-3);
  padding-bottom: var(--ui-space-6);
}
.layout-grid-12 > section {
  display: contents;
}

@media (min-width: 768px) {
  .layout-grid-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-rows: repeat(15, minmax(0, 1fr));
    min-height: 52rem;
  }
  .layout-grid-12 .layout-grid-row {
    display: contents;
  }
  .layout-span-12-3 > .board-tile {
    grid-column: span 12;
    grid-row: span 3;
    min-height: 0;
  }
  .layout-span-6-4 > .board-tile {
    grid-column: span 6;
    grid-row: span 4;
    min-height: 0;
  }
  .layout-span-4-4 > .board-tile {
    grid-column: span 4;
    grid-row: span 4;
    min-height: 0;
  }
  .layout-span-3-4 > .board-tile {
    grid-column: span 3;
    grid-row: span 4;
    min-height: 0;
  }
}
.layout-split-inbox {
  display: grid;
  grid-template-columns: minmax(200px, 34%) 1fr;
  gap: var(--ui-space-4);
  min-height: 420px;
}
.layout-split-inbox > * {
  min-height: 420px;
  max-height: 560px;
}
@media (max-width: 767.98px) {
  .layout-split-inbox {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .layout-split-inbox > * {
    min-height: 320px;
    max-height: none;
  }
}

.rule-top {
  border-top: var(--ui-border-width) solid var(--ui-border);
  padding-top: var(--ui-space-4);
}

.rule-bottom {
  border-bottom: var(--ui-border-width) solid var(--ui-border);
}

.rule-top-soft {
  border-top: var(--ui-border-width) dashed var(--ui-border);
  padding-top: var(--ui-space-3);
}

.scroll-x {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}
.scroll-x::-webkit-scrollbar {
  height: 0;
}
.scroll-x > * {
  scroll-snap-align: start;
}

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

.self-start {
  align-self: flex-start;
}

.contents {
  display: contents;
}

@media (min-width: 992px) {
  .stack-lg-row {
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
  }
}

@media (max-width: 991.98px) {
  .stretch-max-lg {
    align-self: stretch;
    width: 100%;
  }
}

.pin-top {
  position: sticky;
  top: 0;
  z-index: var(--ui-layer-float);
}

@media (max-width: 991.98px) {
  .pin-top-below-head {
    top: calc(var(--ui-control-lg) + var(--ui-space-2) * 2);
  }
}
.sticky-start {
  position: sticky;
  left: 0;
}

.sticky-end {
  position: sticky;
  right: 0;
}

.host-board {
  container-type: inline-size;
  container-name: board;
}

.host-frame {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  padding-bottom: var(--ui-space-6);
}

.host-main {
  display: grid;
  align-content: start;
}

.host-split {
  display: grid;
  align-items: start;
}

.host-rail {
  display: grid;
  align-content: start;
}

.host-frame .layout-cols-4 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@container board (min-width: 58rem) {
  .host-frame:has(> .host-rail) {
    grid-template-columns: minmax(0, 1fr) 20rem;
  }
  .host-split {
    grid-template-columns: 1.35fr 1fr;
    gap: var(--ui-space-5);
  }
  .host-rail {
    position: sticky;
    top: var(--ui-space-4);
  }
}
@container board (min-width: 40rem) {
  .host-frame .layout-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@container board (min-width: 40rem) and (max-width: 57.98rem) {
  .host-split {
    grid-template-columns: 1.2fr 1fr;
  }
  .host-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (prefers-reduced-motion: reduce) {
  .board-tile {
    transition: none;
  }
}
.mark-edge {
  top: 50%;
  transform: translateY(-50%);
  width: 8.5rem;
  height: 8.5rem;
  opacity: 0.22;
  pointer-events: none;
  object-fit: contain;
}
.mark-edge--compact {
  right: -2.75rem;
  width: 7rem;
  height: 7rem;
  opacity: 0.16;
}

.widget-head.tint-band--flush {
  border-radius: 0;
  padding: var(--ui-space-5) var(--ui-space-6);
}

.field-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  grid-auto-rows: 1fr;
  gap: var(--ui-space-3);
  margin-bottom: var(--ui-space-4);
}
.field-grid > * {
  min-width: 0;
}
@media (max-width: 767.98px) {
  .field-grid {
    grid-template-columns: 1fr;
  }
}

.mark-edge--start {
  left: -2.75rem;
  right: auto;
}

.mark-edge--start ~ .tint-band-body {
  padding-left: 4.5rem;
}

.mark-edge--end {
  right: -2.75rem;
  left: auto;
}

[data-clone-starter] {
  display: grid;
  max-width: 72rem;
}
@media (min-width: 62rem) {
  [data-clone-starter] {
    grid-template-columns: 1fr auto 1fr;
    gap: var(--ui-space-5);
    align-items: stretch;
  }
}
[data-clone-starter] > p.row-center.justify-end {
  margin: 0;
}
@media (min-width: 62rem) {
  [data-clone-starter] > p.row-center.justify-end {
    grid-column: 1/-1;
  }
}
[data-clone-starter] .variant-lines {
  display: none;
}
@media (min-width: 62rem) {
  [data-clone-starter] .variant-lines {
    display: flex;
  }
}
[data-clone-starter] .step:last-child {
  margin-bottom: 0;
}

.dock-end {
  position: fixed;
  right: var(--ui-space-4);
  bottom: var(--ui-space-4);
}

.corner-end {
  position: absolute;
  top: var(--ui-space);
  right: var(--ui-space);
}

.corner-start {
  position: absolute;
  top: var(--ui-space);
  left: var(--ui-space);
}

.corner-end--tight,
.corner-start--tight {
  top: var(--ui-space-2);
}

.corner-end--tight {
  right: var(--ui-space-2);
}

.corner-start--tight {
  left: var(--ui-space-2);
}

.corner-end--flush,
.corner-start--flush {
  top: 0;
}

.corner-end--flush {
  right: 0;
}

.corner-start--flush {
  left: 0;
}

.below-end {
  position: absolute;
  top: calc(100% + var(--ui-space-2));
  right: 0;
}

.grid-fill {
  --min: 15rem;
  display: grid;
  gap: var(--ui-row-gap);
  grid-template-columns: repeat(auto-fill, minmax(var(--min), 1fr));
}

.grid-fill--sm {
  --min: 9rem;
}

.grid-fill--md {
  --min: 12rem;
}

.grid-fill--lg {
  --min: 18rem;
}

.hold-until-ready:not(.is-ready) > :not(.grid-fill) {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  opacity: 0;
  pointer-events: none;
}

.hold-until-ready.is-ready > .grid-fill {
  display: none;
}

@page {
  size: letter;
  margin: 0.5in;
}
@page order {
  size: letter portrait;
  margin-top: 4in;
}
@media print {
  .novo-main:has(.print-order) {
    page: order;
  }
  .page-break {
    height: 1px;
    break-after: page;
  }
  .container {
    width: 100%;
    overflow: visible;
  }
  table {
    width: 100%;
    margin: auto;
  }
  .tab-pane {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    opacity: unset !important;
    min-height: 600px;
    margin-top: 100px;
  }
  .nav-tabs {
    display: none !important;
  }
  .print-order .products-table th:nth-child(1),
  .print-order .sales-table th:nth-child(1),
  .print-order .sales-table td:nth-child(1),
  .print-order .sales-table .media-thumb {
    display: none;
  }
  .print-order .sales-table td:nth-child(3) {
    width: 40%;
  }
  .print-order .sales-table .product {
    margin-bottom: 0.4em;
  }
  .print-order .client-data {
    min-width: 400px !important;
  }
}
@media print {
  .widget-chart--tall {
    height: 16rem;
    break-inside: avoid;
  }
  .data-table th,
  .data-table td {
    white-space: normal;
  }
}
.fold {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.25s ease;
}
.fold > * {
  overflow: hidden;
  min-height: 0;
}

.is-open > .fold,
.is-open.fold,
.is-open .fold {
  grid-template-rows: 1fr;
}

.basis-full {
  flex: 1 1 100%;
}

.is-open > .expand-inset,
.is-open.expand-inset {
  margin: var(--ui-space-2) calc(var(--row-padding-x) * -1) calc(var(--row-padding-y) * -1);
}

.is-open .expand-flip,
details[open] > summary .expand-flip {
  transform: rotate(180deg);
}

.is-open .expand-flip--quarter,
details[open] > summary .expand-flip--quarter {
  transform: rotate(90deg);
}

.expand-flip {
  display: inline-block;
  transition: transform 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
  .fold,
  .expand-flip {
    transition: none;
  }
}
.surface-band-top {
  position: sticky;
  top: 0;
  z-index: var(--ui-layer-stick);
  display: flex;
  align-items: center;
  gap: var(--ui-space-3);
  padding: var(--ui-space-3) var(--ui-space-4);
  border-bottom: var(--ui-border-width) solid var(--ui-border);
}

.surface-band-foot {
  position: sticky;
  bottom: 0;
  z-index: var(--ui-layer-stick);
  border-top: var(--ui-border-width) solid var(--ui-border);
}

.fill-viewport {
  min-height: 100dvh;
}

.narrow {
  width: 100%;
  max-width: 34rem;
}

.narrow-wide {
  width: 100%;
  max-width: 38rem;
}

.narrow-rail {
  width: 100%;
  max-width: calc(var(--ui-w-7) + var(--ui-w-2) + var(--ui-space-7));
}

.narrow-children > :not(.media-thumb) {
  width: 100%;
  max-width: 34rem;
}

.min-stage {
  min-height: 22rem;
}

.safe-pad-foot {
  padding-bottom: calc(var(--ui-space-4) + env(safe-area-inset-bottom));
}

.novo-shell {
  display: flex;
  flex: 1 1 auto;
  align-items: stretch;
  min-height: 0;
}

.novo-shell > .side-menu {
  display: flex;
  flex-direction: column;
  flex: 0 0 var(--ui-aside);
  position: static;
  align-self: stretch;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 0;
  border-top: 0;
  border-bottom: 0;
  border-left: 0;
}
.novo-shell > .side-menu > * {
  flex-shrink: 0;
}
.novo-shell > .side-menu > .novo-brand {
  justify-content: center;
  margin-bottom: var(--ui-space-3);
}

.novo-shell > .novo-main,
.novo-ui > .novo-main {
  flex: 1 1 auto;
  min-width: 0;
  isolation: isolate;
}

.novo-shell > .side-menu,
.novo-shell > .side-menu-collapse,
.novo-shell > .novo-side-menu-backdrop {
  order: -1;
}

.novo-side-menu-toggle,
.novo-mobile-bar-action {
  position: fixed;
  top: var(--ui-space-2);
  left: var(--ui-space-2);
  justify-content: center;
  width: var(--ui-touch);
  height: var(--ui-touch);
  padding: 0;
}

.novo-side-menu-toggle-bars {
  display: block;
  width: var(--ui-space-4);
  height: 2px;
  background: currentColor;
  box-shadow: 0 calc(var(--ui-space-2) * -1) 0 currentColor, 0 var(--ui-space-2) 0 currentColor;
}

@media (min-width: 992px) {
  .novo-shell > .side-menu {
    transition: width 0.32s ease, flex-basis 0.32s ease, max-width 0.32s ease;
  }
}
@media (max-width: 991.98px) {
  .novo-mobile-bar {
    display: flex;
    align-items: center;
    gap: var(--ui-space-2);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: var(--ui-layer-float);
    padding: var(--ui-space-1) var(--ui-space-3);
    box-sizing: border-box;
    background: var(--ui-head-bg);
    color: var(--ui-head-ink);
    height: var(--ui-head-bar-h);
    border: 0;
    border-radius: 0;
  }
  .novo-mobile-bar .novo-side-menu-toggle,
  .novo-mobile-bar .novo-mobile-bar-action {
    position: static;
    flex: 0 0 auto;
    background: transparent;
    border-color: rgba(255, 255, 255, 0.28);
    color: var(--ui-head-ink);
  }
  .novo-mobile-bar .novo-brand,
  .novo-mobile-bar .novo-brand span {
    color: var(--ui-head-ink);
  }
  .novo-mobile-bar .novo-brand {
    min-width: 0;
  }
  .novo-mobile-bar .novo-brand span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .novo-side-menu-toggle,
  .novo-mobile-bar-action {
    display: inline-flex;
  }
  .novo-main:not(:has(#dashboard-page)) > .novo-crumb,
  .novo-main:not(:has(#dashboard-page)) > .page-chrome,
  .novo-main:not(:has(#dashboard-page)) > * > .page-chrome {
    margin-left: calc(var(--ui-space) * -1);
    margin-right: calc(var(--ui-space) * -1);
  }
  .novo-main:not(:has(#dashboard-page)) > .page-chrome {
    margin-top: calc(var(--ui-space) * -1);
  }
  body.is-side-menu-open .novo-mobile-bar,
  body.is-side-menu-open .novo-side-menu-toggle {
    display: none;
  }
  .novo-shell {
    padding-top: var(--ui-head-bar-h);
  }
  .novo-shell {
    display: block;
  }
  .novo-shell > .side-menu {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(100vw - var(--ui-space-6) * 2, var(--ui-aside));
    max-width: min(100vw - var(--ui-space-6) * 2, var(--ui-aside));
    overflow-x: hidden;
    overflow-y: auto;
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    border: 0;
    box-shadow: var(--ui-shadow-md);
    background: var(--ui-surface);
  }
  .novo-shell.is-side-menu-open > .side-menu {
    transform: translateX(0);
  }
  .novo-side-menu-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    background: var(--ui-ink-veil);
  }
  .novo-side-menu-backdrop[hidden] {
    display: none;
  }
  body.is-side-menu-open {
    overflow: hidden;
  }
}
body.is-operating .novo-main,
body.is-operating .side-menu,
body.is-operating .novo-footer,
body.is-operating .novo-side-menu-toggle {
  opacity: 0;
  transform: translateX(-52px);
  pointer-events: none;
  transition: opacity 0.5s ease, transform 0.55s cubic-bezier(0.5, 0, 0.2, 1);
}
body.is-operating .modal-backdrop {
  opacity: 0;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  body.is-operating .novo-main {
    transition: none;
  }
}
.novo-main {
  max-width: var(--ui-max);
  margin: 0 auto;
  padding: var(--ui-space) var(--ui-space) var(--ui-control);
}

.novo-main:has(#dashboard-page) {
  padding: 0;
}

.novo-crumb {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--ui-space-3);
  margin: 0 0 var(--ui-space);
}
.novo-crumb .tips-banner {
  max-width: none;
}

.novo-crumb-tools {
  display: flex;
  align-items: center;
  gap: var(--ui-space-2);
  min-width: 0;
}
.novo-crumb-tools .tips-banner {
  width: auto;
}

.novo-main:has(#dashboard-page) .novo-crumb {
  padding: var(--ui-space) var(--ui-space) 0;
}

.breadcrumb {
  margin-bottom: 0;
  padding: 0;
  background-color: transparent;
  font-size: var(--ui-type-caption);
}
.breadcrumb .breadcrumb-item {
  color: var(--ui-muted);
}
.breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  color: var(--ui-muted);
}
.breadcrumb .breadcrumb-item a {
  color: var(--ui-muted);
}
.breadcrumb .breadcrumb-item.active, .breadcrumb .breadcrumb-item.active a {
  color: var(--ui-ink);
}

.breadcrumb {
  flex-wrap: nowrap;
  overflow: hidden;
}
.breadcrumb .breadcrumb-item,
.breadcrumb > li {
  display: flex;
  align-items: center;
  min-width: 0;
  flex: 0 1 auto;
  flex-shrink: 240;
  white-space: nowrap;
}
.breadcrumb .breadcrumb-item::before,
.breadcrumb > li::before {
  flex: 0 0 auto;
}
.breadcrumb .breadcrumb-item > a,
.breadcrumb .breadcrumb-item > span,
.breadcrumb > li > a,
.breadcrumb > li > span {
  min-width: 1.4ch;
  overflow: hidden;
  text-overflow: ellipsis;
}
.breadcrumb > li:nth-last-child(4) {
  flex-shrink: 80;
}
.breadcrumb > li:nth-last-child(3) {
  flex-shrink: 24;
}
.breadcrumb > li:nth-last-child(2) {
  flex-shrink: 8;
}
.breadcrumb > li:last-child {
  flex-shrink: 1;
}

@media (max-width: 991.98px) {
  .novo-crumb {
    display: none;
    background: var(--ui-head-bg);
    margin: 0;
    padding: 0 var(--ui-space-4);
    gap: var(--ui-space-2);
    min-height: var(--ui-head-crumb-h);
    justify-content: center;
  }
  .novo-crumb .novo-crumb-tools:empty {
    display: none;
  }
  .novo-crumb:not(:has(+ .page-chrome, + * > .page-chrome)) {
    min-height: calc(var(--ui-head-crumb-h) + var(--ui-space-3));
    border-bottom-left-radius: var(--ui-radius-md);
    border-bottom-right-radius: var(--ui-radius-md);
    box-shadow: 0 10px 24px rgba(6, 53, 44, 0.18);
  }
  .novo-crumb .breadcrumb {
    font-size: var(--ui-type-micro);
  }
  .novo-crumb .breadcrumb > li,
  .novo-crumb .breadcrumb > li a,
  .novo-crumb .breadcrumb > li + li::before {
    color: var(--ui-head-soft);
  }
  .novo-crumb .breadcrumb > li.active a,
  .novo-crumb .breadcrumb > li:last-child a {
    color: var(--ui-head-ink);
    font-weight: 600;
  }
}
.novo-aside .list-group[id^=menu-] {
  --tint: var(--menu-color);
  margin-top: 0;
  border-color: var(--tint);
  background-color: var(--tint-medium);
}
.novo-aside .list-group[id^=menu-] .list-group-item {
  color: var(--ui-ink);
}
.novo-aside .list-group[id^=menu-] .list-group-item:not(.bg-secondary) {
  background-color: transparent;
}
.novo-aside .list-group[id^=menu-] .list-group-item:hover, .novo-aside .list-group[id^=menu-] .list-group-item:focus {
  color: var(--ui-ink);
  text-decoration: none;
}
.novo-aside .list-group[id^=menu-] .list-group-item:not(.bg-secondary):hover, .novo-aside .list-group[id^=menu-] .list-group-item:not(.bg-secondary):focus {
  background-color: var(--ui-ink-veil);
}

@media (min-width: 768px) {
  .novo-ui #menu-toggle {
    display: none;
  }
}
.novo-footer {
  display: flex;
  flex-wrap: wrap;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  gap: var(--ui-space-2) var(--ui-space);
  padding: var(--ui-space);
  text-align: center;
  background: var(--ui-accent-strong);
  color: var(--ui-accent-subtle);
}
.novo-footer a {
  color: inherit;
}
.novo-footer small {
  opacity: 0.9;
}

.novo-ui,
#settings.novo-ui,
#admin.novo-ui {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  background-color: var(--ui-bg);
  background-image: radial-gradient(ellipse 90% 70% at 100% 100%, var(--ui-accent-veil), transparent 58%), radial-gradient(ellipse 70% 55% at 70% 85%, var(--ui-accent-veil), transparent 55%), linear-gradient(165deg, var(--ui-bg) 0%, var(--ui-subtle) 48%, var(--ui-bg) 100%);
}

.novo-header {
  border-bottom: 1px solid var(--ui-border);
}

.novo-header-inner {
  display: flex;
  gap: var(--ui-space);
  max-width: var(--ui-max);
  margin: 0 auto;
  padding: var(--ui-space-3) var(--ui-space);
}

.novo-brand {
  display: inline-flex;
  color: inherit;
}

.novo-brand-logo {
  width: var(--ui-control);
  height: var(--ui-control);
  object-fit: contain;
}

.novo-account,
.side-menu > .navbar-nav {
  padding: 0;
}

.novo-account .navbar-nav,
.side-menu > .navbar-nav {
  flex-direction: row;
  align-items: center;
}

.novo-account .navbar-nav .nav-link {
  color: var(--ui-muted);
}
.novo-account .navbar-nav .nav-link:hover, .novo-account .navbar-nav .nav-link:focus {
  color: var(--ui-ink);
  text-decoration: none;
  background-color: var(--ui-ink-veil);
}

.novo-account .dropdown-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-2);
  border: 0;
  background: transparent;
  cursor: pointer;
}
.novo-account .dropdown-toggle::after {
  margin-left: 0;
}

.side-menu > .navbar-nav .nav-link {
  display: flex;
  align-items: center;
  gap: var(--ui-space-2);
  width: 100%;
  padding: var(--ui-space-2) var(--ui-space-1);
  border: 0;
  border-radius: var(--ui-radius-sm);
  background-color: var(--ui-ink-veil);
  color: var(--ui-ink);
  text-align: start;
  cursor: pointer;
}
.side-menu > .navbar-nav .nav-link:hover, .side-menu > .navbar-nav .nav-link:focus {
  color: var(--ui-ink);
  text-decoration: none;
  background-color: var(--ui-ink-veil);
}
.side-menu > .navbar-nav .nav-link::after {
  margin-left: auto;
}
.side-menu > .navbar-nav .dropdown-menu {
  width: 100%;
  min-width: 0;
}

.novo-account .account-chip,
.side-menu > .navbar-nav .account-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-2);
}

.novo-account .account-meta,
.side-menu > .navbar-nav .account-meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.2;
  text-align: start;
}

.novo-account .account-brand,
.side-menu > .navbar-nav .account-brand {
  font-weight: 600;
  text-transform: uppercase;
}

.novo-account .account-user,
.side-menu > .navbar-nav .account-user {
  color: var(--ui-muted);
}

.novo-account .dropdown-item:hover,
.novo-account .dropdown-item:focus,
.side-menu > .navbar-nav .dropdown-item:hover,
.side-menu > .navbar-nav .dropdown-item:focus {
  background-color: var(--ui-ink-veil);
}

.novo-account .dropdown-menu,
.side-menu > .navbar-nav .dropdown-menu {
  position: absolute;
}

.integration-data {
  margin-left: var(--ui-space-2);
  text-align: start;
}

.page-chrome {
  margin-top: calc(var(--ui-space-6) + var(--ui-space-2));
  margin-bottom: calc(var(--ui-space-6) * 2);
}

.page-head > .icon {
  flex-shrink: 0;
  margin: 0;
}
@media (max-width: 991.98px) {
  .page-head {
    gap: var(--ui-space-3);
  }
  .page-head > .icon {
    width: var(--ui-control-lg);
    height: var(--ui-control-lg);
  }
}

.page-head-tools {
  display: none;
}

.header-controls {
  background: var(--ui-surface);
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  box-shadow: var(--ui-shadow-md);
  box-shadow: var(--ui-shadow-sm);
  padding: var(--ui-space-2) var(--ui-space-3);
}

@media (max-width: 991.98px) {
  .ctl-label {
    display: none;
  }
}

@media (max-width: 991.98px) {
  .page-chrome {
    margin: 0 0 var(--ui-space-5);
    padding: var(--ui-space-3) var(--ui-space-4) var(--ui-space-5);
    background: var(--ui-head-bg);
    color: var(--ui-head-ink);
    border-radius: 0;
    box-shadow: var(--ui-shadow-md);
  }
  .page-chrome .page-head > .icon {
    width: 1.75rem;
    height: 1.75rem;
  }
  .page-chrome .page-head-text {
    display: flex;
    align-items: center;
    min-height: 1.75rem;
  }
  .page-chrome .page-head-title {
    color: var(--ui-head-ink);
    font-size: var(--ui-type-body);
    line-height: 1.75rem;
    letter-spacing: 0.015em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .page-chrome .page-head-desc {
    display: none;
  }
  .page-head-tools {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    margin-left: auto;
    width: var(--ui-control-lg);
    height: var(--ui-control-lg);
    padding: 0;
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.28);
    color: var(--ui-head-ink);
    transition: background-color 0.15s ease, border-color 0.15s ease;
  }
  .page-head-tools:hover, .page-head-tools:focus-visible {
    background: rgba(255, 255, 255, 0.28);
    border-color: rgba(255, 255, 255, 0.45);
    color: var(--ui-head-ink);
  }
  .page-head-tools .icon {
    margin: 0;
    width: 20px;
    height: 20px;
    opacity: 1;
    transition: transform 0.24s ease;
  }
  .page-chrome.is-tools-open .page-head-tools .icon {
    transform: rotate(180deg);
  }
  .page-chrome .header-controls {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    gap: var(--ui-space-2);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-0.35rem);
    transition: max-height 0.24s ease, opacity 0.16s ease, transform 0.24s ease, padding-top 0.24s ease, visibility 0s linear 0.24s;
  }
  .page-chrome .header-controls .btn {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.24);
    color: var(--ui-head-ink);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    flex: 0 0 auto;
    gap: var(--ui-space-3);
    padding: var(--ui-space-3) var(--ui-space-4);
    font-size: var(--ui-type-body);
    transition: background-color 0.15s ease, border-color 0.15s ease;
  }
  .page-chrome .header-controls .btn .icon {
    margin: 0;
    width: 18px;
    height: 18px;
    opacity: 1;
  }
  .page-chrome .header-controls .btn small {
    display: none;
  }
  .page-chrome .header-controls .btn-secondary,
  .page-chrome .header-controls .btn-primary {
    background: var(--ui-head-ink);
    border-color: var(--ui-head-ink);
    color: var(--ui-head-bg);
  }
  .page-chrome .header-controls .btn:hover,
  .page-chrome .header-controls .btn:focus-visible {
    background: rgba(255, 255, 255, 0.28);
    border-color: rgba(255, 255, 255, 0.45);
    color: var(--ui-head-ink);
  }
  .page-chrome .header-controls .btn-secondary:hover,
  .page-chrome .header-controls .btn-primary:hover,
  .page-chrome .header-controls .btn-secondary:focus-visible,
  .page-chrome .header-controls .btn-primary:focus-visible {
    background: var(--ui-head-ink);
    border-color: var(--ui-head-ink);
    color: var(--ui-head-bg);
  }
  .page-chrome.is-tools-open .header-controls {
    max-height: min(40rem, 72vh);
    overflow-y: auto;
    opacity: 1;
    visibility: visible;
    transform: none;
    padding-top: var(--ui-space-4);
    transition: max-height 0.26s ease, opacity 0.2s ease 0.03s, transform 0.26s ease, padding-top 0.26s ease, visibility 0s;
  }
  .page-chrome.is-tools-open .header-controls .ctl-label {
    display: inline;
  }
  .page-chrome.is-tools-open .header-controls .dropdown-menu {
    position: static;
    float: none;
    width: 100%;
    margin-top: var(--ui-space-1);
    border-color: var(--ui-border);
    box-shadow: none;
  }
}
@media (max-width: 991.98px) and (prefers-reduced-motion: reduce) {
  .page-chrome .header-controls,
  .page-head-tools .icon {
    transition: none;
  }
}
.side-menu {
  flex: 0 0 auto;
  padding: var(--ui-space);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface-veil);
  border: 1px solid var(--ui-border);
}

@media (min-width: 992px) {
  .side-menu {
    position: sticky;
    top: var(--ui-space);
  }
}
.side-menu-collapse {
  display: none;
  position: absolute;
  top: calc(var(--ui-space) + var(--ui-control) / 2);
  left: var(--ui-aside);
  align-items: center;
  justify-content: center;
  width: calc(var(--ui-control) - var(--ui-space-1));
  height: calc(var(--ui-control) + var(--ui-space-2));
  padding: 0;
  border: var(--ui-border-width) solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-muted);
  box-shadow: var(--ui-shadow-sm);
  transform: translate(calc(-100% + var(--ui-space-2)), -50%);
  cursor: pointer;
  transition: left 0.32s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.side-menu-collapse:hover, .side-menu-collapse:focus-visible {
  background: var(--ui-accent-subtle);
  border-color: var(--ui-accent-edge);
  color: var(--ui-accent-strong);
}
.side-menu-collapse:focus-visible {
  outline: 0;
  box-shadow: var(--ui-shadow-sm), var(--ui-focus-ring);
}

.side-menu-collapse-mark {
  display: block;
  width: var(--ui-space-2);
  height: var(--ui-space-2);
  border-right: calc(var(--ui-border-width) * 2) solid currentColor;
  border-bottom: calc(var(--ui-border-width) * 2) solid currentColor;
  transform: rotate(135deg);
  transition: transform 0.32s ease;
}

@media (min-width: 992px) {
  .novo-shell {
    position: relative;
  }
  .side-menu-collapse {
    display: inline-flex;
  }
  .novo-shell:has(.is-side-menu-icons) {
    --ui-aside: 5rem;
  }
  .novo-shell:has(.is-side-menu-icons) .side-menu-collapse-mark {
    transform: rotate(-45deg);
  }
  .novo-brand > span,
  .side-menu-link > span:not(.icon),
  .account-meta,
  .side-menu-split-action,
  .side-menu-heading,
  .side-menu-tile-label {
    white-space: nowrap;
  }
  .side-menu-sub,
  .side-menu-link.is-active::before,
  .side-menu-split.is-action-active::before {
    transition: margin-left 0.32s ease, left 0.32s ease;
  }
  .side-menu-grid {
    transition: grid-template-columns 0.32s ease;
  }
  .side-menu-extra {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 0.32s ease, opacity 0.32s ease;
  }
  .side-menu-extra > * {
    min-height: 0;
    overflow: hidden;
  }
  .side-menu-heading {
    position: relative;
  }
  .side-menu-heading::after {
    content: "—";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    opacity: 0;
    font-size: var(--ui-type-caption);
    line-height: var(--ui-type-caption-lh);
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--ui-muted);
    transition: opacity 0.32s ease;
  }
  .novo-brand > span,
  .side-menu-link > span:not(.icon),
  .account-meta,
  .side-menu-split-action,
  .side-menu-tile-label {
    transition: opacity 0.32s ease;
  }
  #appinstall,
  #appnotify {
    transition: margin 0.32s ease, padding 0.32s ease, opacity 0.32s ease;
  }
  .side-menu.is-side-menu-icons .novo-brand {
    gap: 0;
  }
  .side-menu.is-side-menu-icons .novo-brand > span {
    position: absolute;
    width: 0;
    overflow: hidden;
  }
  .side-menu.is-side-menu-icons .novo-brand > span,
  .side-menu.is-side-menu-icons .side-menu-link > span:not(.icon),
  .side-menu.is-side-menu-icons .account-meta,
  .side-menu.is-side-menu-icons .side-menu-split-action,
  .side-menu.is-side-menu-icons .side-menu-tile-label,
  .side-menu.is-side-menu-icons .side-menu-theme .switch-text {
    opacity: 0;
  }
  .side-menu.is-side-menu-icons .side-menu-heading {
    color: transparent;
  }
  .side-menu.is-side-menu-icons .side-menu-heading::after {
    opacity: 1;
  }
  .side-menu.is-side-menu-icons .side-menu-extra {
    grid-template-rows: 0fr;
    opacity: 0;
    pointer-events: none;
  }
  .side-menu.is-side-menu-icons #appinstall,
  .side-menu.is-side-menu-icons #appnotify {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
  .side-menu.is-side-menu-icons .side-menu-sub {
    margin-left: 0;
  }
  .side-menu.is-side-menu-icons .side-menu-sub .side-menu-link.is-active::before {
    left: calc(-1 * var(--ui-space));
  }
  .side-menu.is-side-menu-icons .side-menu-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0fr);
  }
  .side-menu.is-side-menu-icons .side-menu-count {
    position: absolute;
    inset-block-start: var(--ui-space-1);
    inset-inline-end: var(--ui-space-1);
    min-width: 0;
    width: var(--ui-space-2);
    height: var(--ui-space-2);
    padding: 0;
    font-size: 0;
    line-height: 0;
  }
  .side-menu.is-side-menu-icons > .navbar-nav .dropdown-menu {
    position: fixed;
    left: var(--ui-aside);
    top: auto;
    bottom: var(--ui-space);
    width: max-content;
  }
}
.side-menu-section {
  margin-bottom: var(--ui-space);
}
.side-menu-section:last-child {
  margin-bottom: 0;
}

.side-menu-heading {
  margin: 0 0 0.4rem;
  padding: 0 0.35rem;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
}

.side-menu-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.5rem;
  overflow: hidden;
}

.side-menu-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 4.5rem;
  min-width: 0;
  max-width: 100%;
  padding: 0.65rem 0.5rem;
  border-radius: var(--ui-radius-sm);
  border: 1px solid transparent;
  color: var(--ui-ink);
  text-align: center;
  font-size: var(--ui-type-caption);
  line-height: 1.2;
  background: transparent;
  cursor: pointer;
  overflow: hidden;
}
.side-menu-tile .icon {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
}
.side-menu-tile:hover, .side-menu-tile:focus {
  color: var(--ui-ink);
  text-decoration: none;
}
.side-menu-tile.is-active {
  color: var(--ui-surface);
}

.side-menu-tile--cyan {
  background-color: var(--ui-status-cyan);
  border-color: var(--ui-status-cyan-deep);
}
.side-menu-tile--cyan:hover, .side-menu-tile--cyan:focus, .side-menu-tile--cyan.is-active {
  background-color: var(--ui-status-cyan-deep);
}

.side-menu-tile--yellow {
  background-color: var(--ui-status-yellow);
  border-color: var(--ui-status-yellow-deep);
}
.side-menu-tile--yellow:hover, .side-menu-tile--yellow:focus, .side-menu-tile--yellow.is-active {
  background-color: var(--ui-status-yellow-deep);
}

.side-menu-tile--green {
  background-color: var(--ui-status-green);
  border-color: var(--ui-status-green-deep);
}
.side-menu-tile--green:hover, .side-menu-tile--green:focus, .side-menu-tile--green.is-active {
  background-color: var(--ui-status-green-deep);
}

.side-menu-tile--orange {
  background-color: var(--ui-status-orange);
  border-color: var(--ui-status-orange-deep);
}
.side-menu-tile--orange:hover, .side-menu-tile--orange:focus, .side-menu-tile--orange.is-active {
  background-color: var(--ui-status-orange-deep);
}

.side-menu-tile--red {
  background-color: var(--ui-status-red);
  border-color: var(--ui-status-red-deep);
}
.side-menu-tile--red:hover, .side-menu-tile--red:focus, .side-menu-tile--red.is-active {
  background-color: var(--ui-status-red-deep);
}

.side-menu-tile--disabled {
  background-color: var(--ui-status-disabled);
  border-color: var(--ui-status-disabled-deep);
}
.side-menu-tile--disabled:hover, .side-menu-tile--disabled:focus, .side-menu-tile--disabled.is-active {
  background-color: var(--ui-status-disabled-deep);
}

.side-menu-tile-label {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

.side-menu-list {
  gap: 0.4rem;
}

.side-menu-sub {
  margin-left: var(--ui-space-6);
}

.side-menu-link {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  position: relative;
  padding: 0.55rem 0.75rem;
  border-radius: var(--ui-radius-sm);
  border: 0;
  color: var(--ui-muted);
  font-size: var(--ui-type-caption);
  font-weight: 500;
  cursor: pointer;
}
.side-menu-link .icon {
  flex-shrink: 0;
  color: currentColor;
}
.side-menu-link.is-active {
  color: var(--ui-ink);
  font-size: var(--ui-type-body);
  font-weight: 700;
}
.side-menu-link.is-active .icon {
  color: var(--ui-accent);
}
.side-menu-link.is-active::before {
  content: "";
  position: absolute;
  left: calc(-1 * var(--ui-space));
  top: 50%;
  width: var(--ui-space-1);
  height: var(--ui-space-5);
  transform: translateY(-50%);
  border-radius: 999px;
  background: var(--ui-accent);
}
.side-menu-link:hover, .side-menu-link:focus {
  color: var(--ui-ink);
  text-decoration: none;
  background: var(--ui-accent-subtle);
  box-shadow: none;
}
.side-menu-link.is-active:hover .icon, .side-menu-link.is-active:focus .icon {
  color: var(--ui-accent);
}

.side-menu-sub .side-menu-link.is-active::before {
  left: calc(-1 * (var(--ui-space) + var(--ui-space-6)));
}

.side-menu-link--cyan {
  background-color: var(--ui-status-cyan);
  border-color: var(--ui-status-cyan-deep);
}
.side-menu-link--cyan:hover, .side-menu-link--cyan:focus, .side-menu-link--cyan.is-active {
  background-color: var(--ui-status-cyan-deep);
  box-shadow: none;
}

.side-menu-link--yellow {
  background-color: var(--ui-status-yellow);
  border-color: var(--ui-status-yellow-deep);
}
.side-menu-link--yellow:hover, .side-menu-link--yellow:focus, .side-menu-link--yellow.is-active {
  background-color: var(--ui-status-yellow-deep);
  box-shadow: none;
}

.side-menu-link--green {
  background-color: var(--ui-status-green);
  border-color: var(--ui-status-green-deep);
}
.side-menu-link--green:hover, .side-menu-link--green:focus, .side-menu-link--green.is-active {
  background-color: var(--ui-status-green-deep);
  box-shadow: none;
}

.side-menu-link--orange {
  background-color: var(--ui-status-orange);
  border-color: var(--ui-status-orange-deep);
}
.side-menu-link--orange:hover, .side-menu-link--orange:focus, .side-menu-link--orange.is-active {
  background-color: var(--ui-status-orange-deep);
  box-shadow: none;
}

.side-menu-link--red {
  background-color: var(--ui-status-red);
  border-color: var(--ui-status-red-deep);
}
.side-menu-link--red:hover, .side-menu-link--red:focus, .side-menu-link--red.is-active {
  background-color: var(--ui-status-red-deep);
  box-shadow: none;
}

.side-menu-link--disabled {
  background-color: var(--ui-status-disabled);
  border-color: var(--ui-status-disabled-deep);
}
.side-menu-link--disabled:hover, .side-menu-link--disabled:focus, .side-menu-link--disabled.is-active {
  background-color: var(--ui-status-disabled-deep);
  box-shadow: none;
}

.side-menu-split {
  display: flex;
  align-items: stretch;
  position: relative;
}
.side-menu-split.is-action-active::before {
  content: "";
  position: absolute;
  left: calc(-1 * var(--ui-space));
  top: 50%;
  width: var(--ui-space-1);
  height: var(--ui-space-5);
  transform: translateY(-50%);
  border-radius: 999px;
  background: var(--ui-accent);
}

.side-menu-split-main {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  border-radius: 0;
}
.side-menu-split-main.is-active, .side-menu-split-main:hover, .side-menu-split-main:focus {
  border-color: transparent;
  box-shadow: none;
}

.side-menu-split-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2.4rem;
  min-width: 2.4rem;
  color: var(--ui-muted);
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
}
.side-menu-split-action:hover, .side-menu-split-action:focus {
  background: var(--ui-accent-subtle);
  color: var(--ui-accent);
  text-decoration: none;
}
.side-menu-split-action.is-active {
  color: var(--ui-accent);
}

.side-menu-tile:disabled, .side-menu-tile[disabled],
.side-menu-link:disabled,
.side-menu-link[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

#appinstall,
#appnotify {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--ui-space-1);
  width: 100%;
  margin-top: var(--ui-space-3);
  margin-bottom: var(--ui-space-3);
  padding: var(--ui-space-4);
  position: relative;
  overflow: hidden;
  border: 0;
  border-radius: var(--ui-radius-md);
  background: linear-gradient(155deg, var(--ui-accent-strong) 0%, var(--ui-accent) 42%, var(--ui-accent-strong) 100%);
  color: var(--ui-accent-subtle);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
  text-align: start;
  cursor: pointer;
}
#appinstall:hover,
#appnotify:hover {
  filter: brightness(1.08);
  box-shadow: var(--ui-shadow-md);
}
#appinstall::before,
#appnotify::before {
  content: "";
  position: absolute;
  width: 7.5rem;
  aspect-ratio: 1;
  right: var(--ui-space-1);
  bottom: var(--ui-space-1);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
  opacity: 0.3;
}
#appinstall > *,
#appnotify > * {
  position: relative;
}
#appinstall .title,
#appnotify .title {
  font-size: var(--ui-type-body);
  font-weight: 700;
  line-height: var(--ui-type-title-lh);
}
#appinstall .cta,
#appnotify .cta {
  margin-top: var(--ui-space-3);
  padding: var(--ui-space-2) var(--ui-space-4);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-accent-strong);
  font-weight: 600;
}

#pwa-install-code {
  box-sizing: border-box;
  width: min(100%, 18rem);
  aspect-ratio: 1;
  padding: var(--ui-space-3);
  border-radius: var(--ui-radius-sm);
  background: #fff;
}
#pwa-install-code canvas,
#pwa-install-code img {
  display: block;
  width: 100%;
  height: auto;
}

.error-page {
  min-height: 100dvh;
  background: var(--ui-surface);
  color: var(--ui-ink);
}
.error-page::before {
  display: none;
}

.error-page-header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  max-width: var(--ui-max);
  width: 100%;
  margin: 0 auto;
  padding: var(--ui-space-4) var(--ui-space);
}

.error-page-main {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--ui-space-6);
  max-width: var(--ui-max);
  margin: 0 auto;
  padding: var(--ui-space-4) var(--ui-space) var(--ui-space-6);
  text-align: center;
}

.error-page-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ui-space-3);
  max-width: 34rem;
}

.error-page-code {
  margin: 0;
  color: var(--ui-muted);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.error-page-title {
  margin: 0;
  font-size: var(--ui-type-hero);
  line-height: var(--ui-type-hero-lh);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--ui-ink);
}

.error-page-msg {
  margin: 0;
  font-size: var(--ui-type-body);
  line-height: var(--ui-type-body-lh);
  color: var(--ui-muted);
}

.error-page-back {
  margin-top: var(--ui-space-2);
  padding-left: var(--ui-space-5);
  padding-right: var(--ui-space-5);
  border-radius: var(--ui-radius-lg);
  font-weight: 600;
}

.error-page-art {
  margin: var(--ui-space-4) 0 0;
  width: min(100%, 18rem);
}
.error-page-art img {
  display: block;
  width: 100%;
  height: auto;
}

@media (min-width: 768px) {
  .error-page-main {
    gap: calc(var(--ui-space-6) + var(--ui-space-2));
    padding-top: var(--ui-space-6);
  }
  .error-page-msg {
    font-size: var(--ui-type-title);
    line-height: var(--ui-type-title-lh);
  }
}
#admin .novo-chrome {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ui-space);
  align-items: start;
  width: 100%;
}
#admin .novo-chrome::before, #admin .novo-chrome::after {
  content: none;
  display: none;
}

#admin .novo-content h1 {
  font-size: var(--ui-type-title);
  margin: var(--ui-space-3) 0 var(--ui-space-1);
}
#admin .novo-content h2 {
  font-size: var(--ui-type-body);
}
#admin .novo-content > p {
  color: var(--ui-muted);
  margin-bottom: var(--ui-space);
}
#admin .novo-content .card {
  margin-bottom: var(--ui-space);
}
#admin .novo-content .card:last-child {
  margin-bottom: 0;
}
#admin .novo-content .card-header {
  display: flex;
  align-items: center;
  gap: calc(var(--ui-space) * 0.5);
}
#admin .novo-content .card-header:has(.media-thumb) {
  justify-content: flex-start;
}
#admin .novo-content .card-header:has(.media-thumb) .btn {
  margin-left: auto;
}
#admin .novo-content .card-footer {
  background: transparent;
}
#admin .novo-content .card-footer:has(> .btn) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ui-space);
}
#admin .novo-content .form-pair {
  display: flex;
  flex-direction: column;
  gap: 0;
}
#admin .novo-content .form-pair .form-group:first-child {
  flex: 0 0 auto;
}
#admin .novo-content dl {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: calc(var(--ui-space) * 0.5) var(--ui-space);
  margin: 0 0 var(--ui-space);
}
#admin .novo-content dl div {
  display: contents;
}
#admin .novo-content dl dt {
  color: var(--ui-muted);
  font-weight: 500;
}
#admin .novo-content dl dd {
  margin: 0;
  overflow-wrap: anywhere;
}
#admin .novo-content .badge {
  margin: 0 calc(var(--ui-space) * 0.25) calc(var(--ui-space) * 0.25) 0;
  font-weight: 500;
  overflow-wrap: anywhere;
  white-space: normal;
  text-align: left;
}
#admin .novo-content .table th {
  color: var(--ui-muted);
  font-weight: 500;
  border-top: 0;
  white-space: nowrap;
}
#admin .novo-content .m-5 {
  margin: var(--ui-space) 0;
  align-items: center;
}
#admin .novo-content .card-body h3 {
  font-size: var(--ui-type-body);
  font-weight: 600;
}
#admin .novo-content .card-body .list-group-item.d-flex {
  gap: var(--ui-space-2);
  align-items: center;
}
#admin .novo-content .list-group-item.text-white .integration-name,
#admin .novo-content .list-group-item.text-white small {
  color: inherit;
}
#admin .novo-content .list-group-item.bg-success:hover,
#admin .novo-content .list-group-item.bg-success:focus {
  color: var(--ui-surface);
  background-color: var(--ui-success);
  background-image: linear-gradient(var(--ui-ink-veil), var(--ui-ink-veil));
}
#admin .novo-content .list-group-item.bg-danger:hover,
#admin .novo-content .list-group-item.bg-danger:focus {
  color: var(--ui-surface);
  background-color: var(--ui-danger);
  background-image: linear-gradient(var(--ui-ink-veil), var(--ui-ink-veil));
}

@media (min-width: 768px) {
  #admin .novo-chrome {
    grid-template-columns: var(--ui-aside) minmax(0, 1fr);
  }
  #admin .novo-chrome .novo-aside,
  #admin .novo-chrome #menu-wrapper {
    grid-column: 1;
    position: static;
    height: auto;
    overflow: visible;
    padding: 0;
    left: auto;
    right: auto;
    bottom: auto;
  }
  #admin .novo-chrome .novo-content {
    grid-column: 2;
  }
  #admin .novo-content .form-pair {
    flex-direction: row;
    gap: var(--ui-space);
  }
  #admin .novo-content .form-pair .form-group {
    flex: 1 1 0;
    min-width: 0;
  }
}
#settings .novo-chrome {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ui-space);
  align-items: start;
  width: 100%;
}
#settings .novo-chrome::before, #settings .novo-chrome::after {
  content: none;
  display: none;
}

#settings .novo-content h1 {
  font-size: var(--ui-type-title);
  margin: var(--ui-space-3) 0 var(--ui-space-1);
}
#settings .novo-content h2 {
  font-size: var(--ui-type-body);
}
#settings .novo-content > p {
  color: var(--ui-muted);
  margin-bottom: var(--ui-space);
}
#settings .novo-content .card {
  margin-bottom: var(--ui-space);
}
#settings .novo-content .card:last-child {
  margin-bottom: 0;
}
#settings .novo-content .card-header {
  display: flex;
  align-items: center;
  gap: calc(var(--ui-space) * 0.5);
}
#settings .novo-content .card-header:has(.media-thumb) {
  justify-content: flex-start;
}
#settings .novo-content .card-header:has(.media-thumb) .btn {
  margin-left: auto;
}
#settings .novo-content .card-footer {
  background: transparent;
}
#settings .novo-content .card-footer:has(> .btn) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ui-space);
}
#settings .novo-content .form-pair {
  display: flex;
  flex-direction: column;
  gap: 0;
}
#settings .novo-content .form-pair .form-group:first-child {
  flex: 0 0 auto;
}
#settings .novo-content dl {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: calc(var(--ui-space) * 0.5) var(--ui-space);
  margin: 0 0 var(--ui-space);
}
#settings .novo-content dl div {
  display: contents;
}
#settings .novo-content dl dt {
  color: var(--ui-muted);
  font-weight: 500;
}
#settings .novo-content dl dd {
  margin: 0;
  overflow-wrap: anywhere;
}
#settings .novo-content .badge {
  margin: 0 calc(var(--ui-space) * 0.25) calc(var(--ui-space) * 0.25) 0;
  font-weight: 500;
  overflow-wrap: anywhere;
  white-space: normal;
  text-align: left;
}
#settings .novo-content .table th {
  color: var(--ui-muted);
  font-weight: 500;
  border-top: 0;
  white-space: nowrap;
}
#settings .novo-content .m-5 {
  margin: var(--ui-space) 0;
  align-items: center;
}
#settings .novo-content .card-body h3 {
  font-size: var(--ui-type-body);
  font-weight: 600;
}
#settings .novo-content .card-body .list-group-item.d-flex {
  gap: var(--ui-space-2);
  align-items: center;
}
#settings .novo-content .list-group-item.text-white .integration-name,
#settings .novo-content .list-group-item.text-white small {
  color: inherit;
}
#settings .novo-content .list-group-item.bg-success:hover,
#settings .novo-content .list-group-item.bg-success:focus {
  color: var(--ui-surface);
  background-color: var(--ui-success);
  background-image: linear-gradient(var(--ui-ink-veil), var(--ui-ink-veil));
}
#settings .novo-content .list-group-item.bg-danger:hover,
#settings .novo-content .list-group-item.bg-danger:focus {
  color: var(--ui-surface);
  background-color: var(--ui-danger);
  background-image: linear-gradient(var(--ui-ink-veil), var(--ui-ink-veil));
}

@media (min-width: 768px) {
  #settings .novo-chrome {
    grid-template-columns: var(--ui-aside) minmax(0, 1fr);
  }
  #settings .novo-chrome .novo-aside,
  #settings .novo-chrome #menu-wrapper {
    grid-column: 1;
    position: static;
    height: auto;
    overflow: visible;
    padding: 0;
    left: auto;
    right: auto;
    bottom: auto;
  }
  #settings .novo-chrome .novo-content {
    grid-column: 2;
  }
  #settings .novo-content .form-pair {
    flex-direction: row;
    gap: var(--ui-space);
  }
  #settings .novo-content .form-pair .form-group {
    flex: 1 1 0;
    min-width: 0;
  }
}
a {
  color: var(--ui-accent);
}
a:hover, a:focus {
  color: var(--ui-accent-strong);
}

.text-primary {
  color: var(--ui-accent) !important;
}

a.text-primary:hover,
a.text-primary:focus {
  color: var(--ui-accent-strong) !important;
}

.bg-primary {
  background-color: var(--ui-accent) !important;
}

.border-primary {
  border-color: var(--ui-accent) !important;
}

.btn-primary {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active {
  background-color: var(--ui-accent-strong);
  border-color: var(--ui-accent-strong);
}
.btn-primary:focus, .btn-primary.focus {
  box-shadow: var(--ui-focus-ring);
}
.btn-primary.disabled, .btn-primary:disabled {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
}

.show > .btn-primary.dropdown-toggle {
  background-color: var(--ui-accent-strong);
  border-color: var(--ui-accent-strong);
}

.btn-outline-primary {
  border-color: var(--ui-accent);
}
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active, .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
  color: #fff;
}
.btn-outline-primary:focus, .btn-outline-primary.focus {
  box-shadow: var(--ui-focus-ring);
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
  color: var(--ui-accent);
}

.btn-outline-primary {
  color: var(--ui-accent);
}

.show > .btn-outline-primary.dropdown-toggle {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
  color: #fff;
}

.btn-link {
  color: var(--ui-accent-emphasis);
}
.btn-link:hover, .btn-link:focus {
  color: var(--ui-accent-strong);
}

.dropdown-item.active,
.dropdown-item:active {
  color: #fff;
  background-color: var(--ui-accent);
}

.badge-primary {
  background-color: var(--ui-accent);
}

a.badge-primary:focus,
a.badge-primary.focus {
  box-shadow: var(--ui-focus-ring);
}

.page-link:hover {
  background-color: var(--ui-subtle);
  border-color: var(--ui-border);
  color: var(--ui-accent-strong);
}
.page-link:focus {
  box-shadow: var(--ui-focus-ring);
}

.page-item.active .page-link {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
}

.list-group-item.active {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
}

.progress-bar {
  background-color: var(--ui-accent);
}

.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
}

.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: var(--ui-focus-ring);
}

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
  background-color: var(--ui-accent);
  border-color: var(--ui-accent);
}

.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before,
.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before,
.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
  background-color: var(--ui-accent-veil);
}

.custom-range::-webkit-slider-thumb {
  background-color: var(--ui-accent);
}
.custom-range::-moz-range-thumb {
  background-color: var(--ui-accent);
}
.custom-range::-ms-thumb {
  background-color: var(--ui-accent);
}
.custom-range:focus::-webkit-slider-thumb, .custom-range:focus::-moz-range-thumb, .custom-range:focus::-ms-thumb {
  box-shadow: 0 0 0 1px #fff, var(--ui-focus-ring);
}

.form-control:focus {
  border-color: var(--ui-accent);
  background-color: var(--ui-surface);
  box-shadow: var(--ui-focus-ring-soft);
  color: var(--ui-ink);
}

.form-control:focus-visible {
  box-shadow: var(--ui-focus-ring);
}

.custom-file-input:focus ~ .custom-file-label {
  border-color: var(--ui-accent);
  box-shadow: var(--ui-focus-ring-soft);
}

.nav-tabs .nav-link.active {
  color: var(--ui-accent);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--ui-accent);
  color: #fff;
}

.nav-tabs .nav-link .inventory-tab-icon,
.nav-pills .nav-link .inventory-tab-icon {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: 0.35rem;
  vertical-align: -0.15rem;
  border-radius: 50%;
  object-fit: contain;
}

.nav-pills-sm .nav-link {
  padding: var(--ui-space-1) var(--ui-space-2);
  font-size: var(--ui-type-caption);
  line-height: var(--ui-type-caption-lh);
}

@media print {
  .table-bordered td,
  .table-bordered th {
    font-size: var(--ui-type-title);
    line-height: 1em;
    color: var(--ui-ink);
    border-top: 1px solid black !important;
  }
  .print-order .sales-table td, .print-order .sales-table th {
    font-size: var(--ui-type-caption) !important;
    padding: 0.5em;
    border-bottom-color: #333 !important;
  }
  .print-order .sales-table td:nth-child(3) {
    text-align: left;
  }
}
[popover]:not(:popover-open):not(dialog[open]) {
  display: none;
}

.form-control,
.custom-file-label {
  background-color: var(--ui-surface);
  color: var(--ui-ink);
}

.form-control:disabled,
.form-control[readonly] {
  background-color: var(--ui-subtle);
  color: var(--ui-muted);
}

.custom-file-label::after {
  background-color: var(--ui-subtle);
  border-color: var(--ui-border);
  color: var(--ui-muted);
}

.custom-file-input:disabled ~ .custom-file-label,
.custom-file-input[disabled] ~ .custom-file-label,
.custom-control-input:disabled ~ .custom-control-label::before,
.custom-control-input[disabled] ~ .custom-control-label::before {
  background-color: var(--ui-subtle);
}

.form-control::placeholder {
  color: var(--ui-muted);
}

.input-group-text {
  background-color: var(--ui-subtle);
  border-color: var(--ui-border);
  color: var(--ui-muted);
}

.dropdown-menu {
  background-color: var(--ui-surface);
  border-color: var(--ui-border);
  color: var(--ui-ink);
}

.dropdown-item {
  color: var(--ui-ink);
}
.dropdown-item:hover, .dropdown-item:focus {
  background-color: var(--ui-subtle);
  color: var(--ui-ink);
}

.dropdown-divider {
  border-top-color: var(--ui-border);
}

.modal-content {
  background-color: var(--ui-surface);
  border-color: var(--ui-border);
  color: var(--ui-ink);
}

.modal-header,
.modal-footer {
  border-color: var(--ui-border);
}

.close {
  color: var(--ui-ink);
  text-shadow: none;
}

.btn-light {
  background-color: var(--ui-subtle);
  border-color: var(--ui-subtle);
  color: var(--ui-ink);
}
.btn-light:hover, .btn-light:focus {
  background-color: var(--ui-ink-subtle);
  border-color: var(--ui-ink-subtle);
  color: var(--ui-ink);
}

.btn-secondary {
  background-color: var(--ui-muted);
  border-color: var(--ui-muted);
  color: var(--ui-surface);
}

.btn-outline-secondary {
  color: var(--ui-muted);
  border-color: var(--ui-muted-edge);
}
.btn-outline-secondary:hover, .btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active {
  background-color: var(--ui-muted);
  border-color: var(--ui-muted);
  color: var(--ui-surface);
}

.list-group-item {
  background-color: var(--ui-surface);
  border-color: var(--ui-border);
  color: var(--ui-ink);
}

.table {
  color: var(--ui-ink);
}
.table td,
.table th,
.table thead th {
  border-color: var(--ui-border);
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: var(--ui-bg);
}

.table-hover tbody tr:hover,
.table-active,
.table-active > td,
.table-active > th,
.table-hover .table-active:hover,
.table-hover .table-active:hover > td,
.table-hover .table-active:hover > th {
  color: var(--ui-ink);
  background-color: var(--ui-subtle);
}

.table-bordered {
  border-color: var(--ui-border);
}

.table-secondary,
.table-secondary > td,
.table-secondary > th {
  background-color: var(--ui-muted-subtle);
  color: var(--ui-muted-emphasis);
}

.table-secondary td,
.table-secondary th,
.table-secondary thead th {
  border-color: var(--ui-muted-edge);
}

.table-hover .table-secondary:hover,
.table-hover .table-secondary:hover > td,
.table-hover .table-secondary:hover > th {
  background-color: var(--ui-muted-veil);
}

.table-success,
.table-success > td,
.table-success > th {
  background-color: var(--ui-success-subtle);
  color: var(--ui-success-emphasis);
}

.table-success td,
.table-success th,
.table-success thead th {
  border-color: var(--ui-success-edge);
}

.table-hover .table-success:hover,
.table-hover .table-success:hover > td,
.table-hover .table-success:hover > th {
  background-color: var(--ui-success-veil);
}

.table-danger,
.table-danger > td,
.table-danger > th {
  background-color: var(--ui-danger-subtle);
  color: var(--ui-danger-emphasis);
}

.table-danger td,
.table-danger th,
.table-danger thead th {
  border-color: var(--ui-danger-edge);
}

.table-hover .table-danger:hover,
.table-hover .table-danger:hover > td,
.table-hover .table-danger:hover > th {
  background-color: var(--ui-danger-veil);
}

.table-warning,
.table-warning > td,
.table-warning > th {
  background-color: var(--ui-warning-subtle);
  color: var(--ui-warning-emphasis);
}

.table-warning td,
.table-warning th,
.table-warning thead th {
  border-color: var(--ui-warning-edge);
}

.table-hover .table-warning:hover,
.table-hover .table-warning:hover > td,
.table-hover .table-warning:hover > th {
  background-color: var(--ui-warning-veil);
}

.table-info,
.table-info > td,
.table-info > th {
  background-color: var(--ui-info-subtle);
  color: var(--ui-info-emphasis);
}

.table-info td,
.table-info th,
.table-info thead th {
  border-color: var(--ui-info-edge);
}

.table-hover .table-info:hover,
.table-hover .table-info:hover > td,
.table-hover .table-info:hover > th {
  background-color: var(--ui-info-veil);
}

.table .thead-light th {
  background-color: var(--ui-subtle);
  border-color: var(--ui-border);
  color: var(--ui-ink);
}

.table thead.no-border th {
  border: none;
}

.card {
  background-color: var(--ui-surface);
  border-color: var(--ui-border);
}

.card-header,
.card-footer {
  background-color: var(--ui-subtle);
  border-color: var(--ui-border);
}

.nav-tabs {
  border-bottom-color: var(--ui-border);
}
.nav-tabs .nav-link.active {
  background-color: var(--ui-surface);
  border-color: var(--ui-border) var(--ui-border) var(--ui-surface);
}

.page-link {
  background-color: var(--ui-surface);
  border-color: var(--ui-border);
}

.list-group-item-action:hover, .list-group-item-action:focus {
  background-color: var(--ui-subtle);
  color: var(--ui-ink);
}

.list-group-item.disabled,
.list-group-item:disabled {
  background-color: var(--ui-subtle);
  color: var(--ui-muted);
}

.custom-control-label::before {
  background-color: var(--ui-surface);
  border-color: var(--ui-muted-edge);
}

.badge-secondary {
  background-color: var(--ui-muted);
}

.badge-light {
  background-color: var(--ui-subtle);
  color: var(--ui-ink);
}

pre,
code {
  color: var(--ui-ink);
}

mark,
.mark {
  background-color: var(--ui-warning-subtle);
  color: var(--ui-ink);
}

hr,
.border,
.border-top,
.border-bottom {
  border-color: var(--ui-border) !important;
}

.text-muted {
  color: var(--ui-muted) !important;
}

.bg-white {
  background-color: var(--ui-surface) !important;
}

.alert:not([data-notify]) {
  color: var(--ui-ink);
  text-shadow: none;
}
.alert:not([data-notify]) a,
.alert:not([data-notify]) a.alert-link {
  color: inherit;
  font-weight: 700;
  text-decoration: underline;
}
.alert:not([data-notify]).alert-success {
  background-color: var(--ui-success-subtle);
  border-color: var(--ui-success-edge);
}
.alert:not([data-notify]).alert-danger {
  background-color: var(--ui-danger-subtle);
  border-color: var(--ui-danger-edge);
}
.alert:not([data-notify]).alert-warning {
  background-color: var(--ui-warning-subtle);
  border-color: var(--ui-warning-edge);
}
.alert:not([data-notify]).alert-info {
  background-color: var(--ui-info-subtle);
  border-color: var(--ui-info-edge);
}
.alert:not([data-notify]).alert-secondary, .alert:not([data-notify]).alert-light {
  background-color: var(--ui-subtle);
  border-color: var(--ui-border);
}

.table-responsive {
  position: relative;
}

.modal.bottom-drawer,
.modal.side-drawer {
  padding: 0 !important;
}

.widget-chart canvas {
  width: 100% !important;
  height: 100% !important;
}

.daterangepicker {
  background-color: var(--ui-surface);
  border-color: var(--ui-border);
  color: var(--ui-ink);
  box-shadow: var(--ui-shadow-md);
}
.daterangepicker::before {
  border-block-end-color: var(--ui-border);
  border-block-start-color: var(--ui-border);
}
.daterangepicker::after {
  border-block-end-color: var(--ui-surface);
  border-block-start-color: var(--ui-surface);
}
.daterangepicker .calendar-table {
  background-color: var(--ui-surface);
  border-color: var(--ui-surface);
}
.daterangepicker td.available:hover,
.daterangepicker th.available:hover {
  background-color: var(--ui-subtle);
}
.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {
  background-color: var(--ui-surface);
  color: var(--ui-muted);
}
.daterangepicker td.week,
.daterangepicker th.week,
.daterangepicker td.disabled,
.daterangepicker option.disabled,
.daterangepicker .calendar-time select.disabled {
  color: var(--ui-muted);
}
.daterangepicker td.in-range {
  background-color: var(--ui-accent-subtle);
  color: var(--ui-ink);
}
.daterangepicker td.active,
.daterangepicker td.active:hover {
  background-color: var(--ui-accent);
  color: var(--ui-white);
}
.daterangepicker select.hourselect,
.daterangepicker select.minuteselect,
.daterangepicker select.secondselect,
.daterangepicker select.ampmselect,
.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
  background: var(--ui-subtle);
  border-color: var(--ui-border);
  color: var(--ui-ink);
}
.daterangepicker .drp-buttons {
  border-block-start-color: var(--ui-border);
}
.daterangepicker .ranges li:hover {
  background-color: var(--ui-subtle);
}
.daterangepicker .ranges li.active {
  background-color: var(--ui-accent);
  color: var(--ui-white);
}
.daterangepicker.show-ranges.single.rtl .drp-calendar.left, .daterangepicker.show-ranges.single.ltr .drp-calendar.left, .daterangepicker.show-ranges.rtl .drp-calendar.right, .daterangepicker.show-ranges.ltr .drp-calendar.left,
.daterangepicker .drp-calendar.left,
.daterangepicker .drp-calendar.right {
  border-color: var(--ui-border);
}
.daterangepicker .drp-selected {
  display: none;
}
.daterangepicker .calendar-table .weekend {
  background-color: var(--ui-subtle);
  color: var(--ui-ink);
}

td.off.available,
td.off.disabled {
  visibility: hidden;
}

@keyframes dashboard-tile-jiggle {
  0% {
    transform: translate(0, 0);
  }
  33% {
    transform: translate(0.8px, 0);
  }
  66% {
    transform: translate(0, 0.8px);
  }
  100% {
    transform: translate(-0.8px, 0);
  }
}
.dashboard-grid-host .grid-stack-item > .ui-resizable-handle,
.dashboard-grid-host .grid-stack-item > .gs-resize-handle {
  display: none !important;
}

.dashboard-page--edit .grid-stack > .grid-stack-item {
  opacity: 0.8;
  animation: dashboard-tile-jiggle 0.32s ease-in-out infinite alternate;
}
.dashboard-page--edit .grid-stack > .grid-stack-item:nth-child(2n) {
  animation-delay: -0.07s;
}
.dashboard-page--edit .grid-stack > .grid-stack-item:nth-child(3n) {
  animation-delay: -0.14s;
}
.dashboard-page--edit .grid-stack > .grid-stack-item:nth-child(4n) {
  animation-delay: -0.21s;
}
.dashboard-page--edit .grid-stack > .grid-stack-item:nth-child(5n) {
  animation-delay: -0.28s;
}
.dashboard-page--edit .grid-stack > .grid-stack-item.ui-draggable-dragging, .dashboard-page--edit .grid-stack > .grid-stack-item.grid-stack-placeholder {
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-page--edit .grid-stack > .grid-stack-item {
    animation: none;
  }
}
.checker .active {
  background-color: var(--ui-warning-veil) !important;
}

.mute-busy.form-disabled {
  color: transparent;
}
.mute-busy > .ajax-loader {
  width: 1.1rem;
  height: 1.1rem;
  border-width: 2px;
  right: auto;
}
.mute-busy > .ajax-loader::after {
  width: 0.55rem;
  height: 0.55rem;
}

.modal-footer .pal.full {
  display: flex;
  justify-content: flex-end;
  gap: var(--ui-space-2);
  width: 100%;
}

@supports (appearance: base-select) {
  select.form-control:not([multiple]) {
    appearance: base-select;
  }
}
@media screen {
  .just-print {
    display: none;
  }
}
@media print {
  .no-print {
    display: none;
  }
  .print-natural,
  .print-natural * {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    text-shadow: none !important;
    color: inherit !important;
    border: 0 !important;
    outline: none !important;
    filter: none !important;
    -webkit-print-color-adjust: economy;
    print-color-adjust: economy;
  }
}