@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("/fonts/noto-sans-cyrillic-400-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("/fonts/noto-sans-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url("/fonts/noto-sans-cyrillic-500-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url("/fonts/noto-sans-latin-500-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url("/fonts/noto-sans-cyrillic-600-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url("/fonts/noto-sans-latin-600-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url("/fonts/noto-sans-cyrillic-700-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url("/fonts/noto-sans-latin-700-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 800;
  src: url("/fonts/noto-sans-cyrillic-800-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 800;
  src: url("/fonts/noto-sans-latin-800-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;
  --c-bg: #f3f2ee;
  --c-surface: #ffffff;
  --c-surface-2: #f8f7f3;
  --c-surface-3: #eeece6;
  --c-text: #303030;
  --c-text-2: #575852;
  --c-text-3: #6e6f69;
  --c-border: #deddd7;
  --c-border-2: #cbc9c1;
  --c-border-soft: #eceae4;
  --c-control-border: #8a8983;
  --c-accent: #f7c51e;
  --c-accent-text: #875a16;
  --c-accent-soft: #fff2b3;
  --c-accent-border: #9b6417;
  --c-on-accent: #303030;
  --c-focus: rgba(247, 197, 30, 0.28);
  --c-focus-strong: #6f5200;
  --c-accent-shadow: rgba(180, 117, 22, 0.18);
  --c-shadow: rgba(48, 48, 48, 0.065);
  --c-shadow-strong: rgba(48, 48, 48, 0.14);
  --c-overlay-soft: rgba(18, 18, 18, 0.14);
  --c-overlay-strong: rgba(18, 18, 18, 0.42);
  --c-input-bg: #ffffff;
  --c-success-bg: #e5f6ee;
  --c-success-text: #0d744c;
  --c-warn-bg: #fff3bd;
  --c-warn-text: #7b5415;
  --c-danger-bg: #fde9e7;
  --c-danger-text: #b42318;
  --c-info-bg: #e8f4ff;
  --c-info-text: #1d6398;
  --c-nav-bg: #303030;
  --c-nav-text: #d2d2cc;
  --c-nav-text-dim: #9a9a94;
  --c-nav-group: #f2f1eb;
  --c-nav-active-bg: rgba(247, 197, 30, 0.16);
  --c-nav-active-subtle: rgba(247, 197, 30, 0.12);
  --c-nav-active-faint: rgba(247, 197, 30, 0.065);
  --c-nav-active-text: #ffd74a;
  --c-nav-hover: rgba(255, 255, 255, 0.065);
  --c-nav-border: #444441;
  --c-nav-shadow: rgba(31, 31, 31, 0.08);
  --c-nav-l2-bg: rgba(255, 255, 255, 0.08);
  --c-nav-l2-text: #f2efe4;
  --c-nav-l2-icon: #f1cc55;
  --c-nav-l2-hover-bg: rgba(247, 197, 30, 0.13);
  --c-nav-l2-active-text: #ffe78a;
  --c-nav-l2-active-icon: #ffd74a;
  --c-nav-l3-bg: rgba(255, 255, 255, 0.025);
  --c-nav-l3-text: #c7c9c2;
  --c-nav-l3-icon: #aaada6;
  --c-nav-l3-hover-bg: rgba(255, 255, 255, 0.08);
  --c-nav-l3-active-text: #f2e2aa;
  --c-nav-l3-active-icon: #d9bb50;
  --c-header-bg: rgba(250, 249, 246, 0.92);
  --c-header-text: #303030;
  --c-header-dim: #70716b;
  --c-header-border: #deddd7;
  --c-scroll-offset: 82px;
}

[data-theme="dark"] {
  color-scheme: dark;
  --c-bg: #161616;
  --c-surface: #222222;
  --c-surface-2: #292929;
  --c-surface-3: #333331;
  --c-text: #f5f4ef;
  --c-text-2: #cbc9c2;
  --c-text-3: #a6a49c;
  --c-border: #3d3d3a;
  --c-border-2: #50504b;
  --c-border-soft: #323230;
  --c-control-border: #6f6e68;
  --c-accent: #f7c51e;
  --c-accent-text: #ffd84c;
  --c-accent-soft: #44390f;
  --c-accent-border: #8f752e;
  --c-on-accent: #303030;
  --c-focus: rgba(247, 197, 30, 0.26);
  --c-focus-strong: #f7c51e;
  --c-accent-shadow: rgba(247, 197, 30, 0.14);
  --c-shadow: rgba(0, 0, 0, 0.3);
  --c-shadow-strong: rgba(0, 0, 0, 0.48);
  --c-overlay-soft: rgba(0, 0, 0, 0.28);
  --c-overlay-strong: rgba(0, 0, 0, 0.62);
  --c-input-bg: #1c1c1c;
  --c-success-bg: #102d21;
  --c-success-text: #84ddb0;
  --c-warn-bg: #40340f;
  --c-warn-text: #ffd679;
  --c-danger-bg: #391c1a;
  --c-danger-text: #ff9b92;
  --c-info-bg: #112b3d;
  --c-info-text: #8fcfff;
  --c-nav-bg: #121212;
  --c-nav-text: #d2d1ca;
  --c-nav-text-dim: #92918b;
  --c-nav-group: #f2f1eb;
  --c-nav-active-bg: rgba(247, 197, 30, 0.16);
  --c-nav-active-subtle: rgba(247, 197, 30, 0.13);
  --c-nav-active-faint: rgba(247, 197, 30, 0.075);
  --c-nav-active-text: #ffd74a;
  --c-nav-hover: rgba(255, 255, 255, 0.07);
  --c-nav-border: #343431;
  --c-nav-shadow: rgba(0, 0, 0, 0.2);
  --c-nav-l2-bg: rgba(255, 255, 255, 0.085);
  --c-nav-l2-text: #f3f0e7;
  --c-nav-l2-icon: #f3ce57;
  --c-nav-l2-hover-bg: rgba(247, 197, 30, 0.14);
  --c-nav-l2-active-text: #ffe994;
  --c-nav-l2-active-icon: #ffda51;
  --c-nav-l3-bg: rgba(255, 255, 255, 0.035);
  --c-nav-l3-text: #c4c6bf;
  --c-nav-l3-icon: #a3a69f;
  --c-nav-l3-hover-bg: rgba(255, 255, 255, 0.09);
  --c-nav-l3-active-text: #f1e2ac;
  --c-nav-l3-active-icon: #ddc05a;
  --c-header-bg: rgba(31, 31, 31, 0.92);
  --c-header-text: #f5f4ef;
  --c-header-dim: #aaa89f;
  --c-header-border: #3a3a37;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--c-bg); scroll-behavior: smooth; }
body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  background: var(--c-bg);
  color: var(--c-text);
  font-family: "Noto Sans", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 13px;
  font-synthesis: none;
  line-height: 1.5;
}
button, input, select, textarea { font: inherit; }
button { border-radius: 10px; }
button:disabled { cursor: not-allowed; opacity: 0.52; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex="-1"]:focus-visible {
  outline: 2px solid var(--c-focus-strong);
  outline-offset: 2px;
}
input, select, textarea {
  width: 100%;
  border: 1px solid var(--c-control-border);
  border-radius: 10px;
  background: var(--c-input-bg);
  color: var(--c-text);
  outline: none;
}
input::placeholder, textarea::placeholder { color: var(--c-text-3); }
/* One text-entry baseline, including inputs without an explicit type. Keep
   native checkbox/radio and the hidden picker authorities out of this rule. */
input:where(:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="color"]):not(.ui-native-control)),
textarea, select:not(.ui-native-control) {
  min-height: 44px;
  padding: 10px 12px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--c-accent-border);
  box-shadow: 0 0 0 3px var(--c-focus);
}
textarea { min-height: 92px; padding: 10px 12px; line-height: 1.5; resize: vertical; }
select { min-height: 44px; padding: 10px 34px 10px 12px; }
::selection { background: var(--c-accent); color: var(--c-on-accent); }

/* Canonical platform date, month and select controls. Native fields remain the
   form value authority, but are never the user-facing picker after enhancement. */
.ui-native-control {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  white-space: nowrap !important;
}
.ui-control-shell { position: relative; display: block; width: 100%; min-width: 0; }
.ui-range-companion { display: none !important; }
.analytics-filter-grid .ui-range-field, .uds-filter-grid .ui-range-field { grid-column: span 2; }
.ui-control-trigger {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  gap: 8px;
  border: 1px solid var(--c-control-border);
  border-radius: 10px;
  background: var(--c-input-bg);
  color: var(--c-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}
.ui-control-trigger:hover { border-color: var(--c-border-2); background: var(--c-surface-2); }
.ui-control-trigger:focus-visible, .ui-control-trigger[aria-expanded="true"] {
  border-color: var(--c-accent-border);
  outline: 0;
  box-shadow: 0 0 0 3px var(--c-focus);
}
.ui-control-trigger.is-placeholder .ui-control-value { color: var(--c-text-3); font-weight: 500; }
.ui-control-value { min-width: 0; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ui-select-trigger.is-single .ui-control-value { white-space: normal; overflow-wrap: anywhere; text-overflow: clip; }
.ui-control-leading-icon { width: 16px; height: 16px; color: var(--c-accent-text); }
.ui-control-chevron { width: 14px; height: 14px; color: var(--c-text-3); transform: rotate(90deg); transition: transform 0.16s ease; }
.ui-control-trigger[aria-expanded="true"] .ui-control-chevron { transform: rotate(-90deg); }
.input-with-icon.has-ui-control > .ui-icon { display: none; }
.input-with-icon.has-ui-control .ui-control-trigger { min-height: 44px; }

.ui-popover-backdrop {
  position: fixed;
  inset: 0;
  z-index: 79;
  background: var(--c-overlay-soft);
  backdrop-filter: blur(1px);
}
.ui-popover-backdrop.is-transparent { background: transparent; backdrop-filter: none; }
.ui-popover-backdrop[hidden], .ui-popover[hidden] { display: none !important; }
.ui-popover {
  position: fixed;
  top: var(--ui-popover-top, 72px);
  left: var(--ui-popover-left, 12px);
  z-index: 80;
  max-width: var(--ui-popover-max-width, calc(100vw - 24px));
  max-height: min(620px, var(--ui-popover-max-height, calc(100dvh - 24px)));
  overflow: auto;
  border: 1px solid var(--c-border-2);
  border-radius: 14px;
  background: var(--c-surface);
  color: var(--c-text);
  box-shadow: 0 18px 48px var(--c-shadow-strong);
}
.ui-calendar-popover { width: min(620px, calc(100vw - 24px)); padding: 13px; }
.ui-calendar-popover.is-single-month { width: min(340px, calc(100vw - 24px)); }
.ui-month-popover { width: min(380px, calc(100vw - 24px)); }
.ui-calendar-header {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 36px;
  align-items: center;
  min-height: 40px;
  margin-bottom: 9px;
  gap: 8px;
}
.ui-calendar-header strong { overflow: hidden; font-size: 13px; font-weight: 800; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.ui-calendar-title-mobile { display: none; }
.ui-popover-icon-button {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--c-border);
  border-radius: 9px;
  background: var(--c-surface-2);
  color: var(--c-text-2);
  cursor: pointer;
}
.ui-popover-icon-button:hover { border-color: var(--c-accent-border); background: var(--c-accent-soft); color: var(--c-accent-text); }
.ui-popover-icon-button .ui-icon { width: 16px; height: 16px; }
.ui-popover-icon-button.is-previous .ui-icon { transform: rotate(180deg); }
.ui-calendar-months { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ui-calendar-popover.is-single-month .ui-calendar-months { grid-template-columns: minmax(0, 1fr); }
.ui-calendar-month { min-width: 0; padding: 9px; border: 1px solid var(--c-border-soft); border-radius: 11px; background: var(--c-surface-2); }
.ui-calendar-month h3 { margin: 0 0 8px; color: var(--c-text-2); font-size: 11px; font-weight: 700; text-align: center; }
.ui-calendar-grid { display: grid; gap: 3px; }
.ui-calendar-weekdays, .ui-calendar-row { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.ui-calendar-weekdays { margin-bottom: 4px; }
.ui-calendar-weekdays span { display: grid; place-items: center; min-height: 24px; color: var(--c-text-3); font-size: 9px; font-weight: 700; }
.ui-calendar-weekdays span:nth-last-child(-n + 2) { color: var(--c-accent-text); }
.ui-calendar-spacer, .ui-calendar-day { min-width: 0; aspect-ratio: 1; }
.ui-calendar-day {
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--c-text-2);
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.ui-calendar-day:hover:not(:disabled) { border-color: var(--c-accent-border); background: var(--c-accent-soft); color: var(--c-accent-text); }
.ui-calendar-day.is-in-range { border-radius: 6px; background: var(--c-accent-soft); color: var(--c-text); }
.ui-calendar-day.is-selected { border-color: var(--c-accent-border); background: var(--c-accent); color: var(--c-on-accent); font-weight: 800; box-shadow: inset 0 0 0 1px var(--c-on-accent); }
.ui-calendar-day.is-start { border-radius: 10px 5px 5px 10px; }
.ui-calendar-day.is-end { border-radius: 5px 10px 10px 5px; }
.ui-calendar-day.is-today:not(.is-selected) { border-color: var(--c-accent-border); color: var(--c-accent-text); font-weight: 800; }
.ui-calendar-day:disabled, .ui-month-choice:disabled { color: var(--c-text-3); cursor: not-allowed; opacity: 0.38; }

.ui-month-grid { display: grid; padding: 5px; gap: 6px; }
.ui-month-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ui-month-choice {
  min-height: 46px;
  padding: 7px;
  border: 1px solid var(--c-border-soft);
  border-radius: 9px;
  background: var(--c-surface-2);
  color: var(--c-text-2);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.ui-month-choice:hover:not(:disabled) { border-color: var(--c-accent-border); background: var(--c-accent-soft); color: var(--c-accent-text); }
.ui-month-choice.is-in-range { border-color: transparent; background: var(--c-accent-soft); color: var(--c-text); }
.ui-month-choice.is-selected { border-color: var(--c-accent-border); background: var(--c-accent); color: var(--c-on-accent); font-weight: 800; box-shadow: inset 0 0 0 1px var(--c-on-accent); }
.ui-month-choice.is-current:not(.is-selected) { border-color: var(--c-accent-border); color: var(--c-accent-text); }
.ui-calendar-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
  padding-top: 10px;
  gap: 10px;
  border-top: 1px solid var(--c-border-soft);
}
.ui-calendar-guidance { color: var(--c-text-3); font-size: 10px; font-weight: 600; }
.ui-calendar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.ui-popover-text-button {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--c-border);
  border-radius: 9px;
  background: var(--c-surface-2);
  color: var(--c-text-2);
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}
.ui-popover-text-button:hover:not(:disabled) { border-color: var(--c-accent-border); background: var(--c-accent-soft); color: var(--c-accent-text); }
.ui-popover-text-button.is-primary { border-color: var(--c-accent-border); background: var(--c-accent); color: var(--c-on-accent); }

.ui-select-popover { display: flex; flex-direction: column; width: min(390px, calc(100vw - 24px)); padding: 8px; }
.ui-select-header, .ui-select-footer { flex: 0 0 auto; }
.ui-select-header { display: grid; padding: 5px; gap: 8px; }
.ui-select-header > strong { overflow: hidden; color: var(--c-text-2); font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.ui-select-search { position: relative; display: block; }
.ui-select-search > .ui-icon { position: absolute; top: 50%; left: 10px; z-index: 1; width: 16px; height: 16px; color: var(--c-text-3); transform: translateY(-50%); pointer-events: none; }
.ui-select-search input { min-height: 44px; padding: 10px 12px 10px 34px; font-size: 14px; }
.ui-select-options { display: grid; flex: 1 1 auto; min-height: 0; max-height: 310px; padding: 3px; overflow-y: auto; overscroll-behavior: contain; gap: 2px; }
.ui-select-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 38px;
  padding: 7px 9px;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--c-text-2);
  font-size: 11px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.ui-select-option span { min-width: 0; overflow-wrap: anywhere; white-space: normal; }
.ui-select-option .ui-icon { width: 15px; height: 15px; flex-shrink: 0; color: var(--c-accent-text); }
.ui-select-option:hover:not(:disabled), .ui-select-option:focus-visible { border-color: var(--c-border); background: var(--c-surface-2); }
.ui-select-option[aria-selected="true"] { border-color: var(--c-accent-border); background: var(--c-accent-soft); color: var(--c-accent-text); font-weight: 800; }
.ui-multi-select-option { justify-content: flex-start; }
.ui-select-option .ui-select-checkbox {
  display: inline-grid;
  width: 18px;
  min-width: 18px;
  height: 18px;
  flex: 0 0 18px;
  place-items: center;
  overflow: visible;
  border: 1px solid var(--c-control-border);
  border-radius: 5px;
  background: var(--c-input-bg);
}
.ui-multi-select-option[aria-selected="true"] .ui-select-checkbox { border-color: var(--c-accent-border); background: var(--c-accent); color: var(--c-on-accent); }
.ui-select-option .ui-select-checkbox .ui-icon { width: 13px; height: 13px; color: currentColor; stroke-width: 2.4; }
.ui-select-footer { display: flex; align-items: center; justify-content: space-between; margin: 5px 3px 0; padding: 8px 2px 2px; gap: 10px; border-top: 1px solid var(--c-border-soft); }
.ui-select-footer > span { color: var(--c-text-3); font-size: 10px; font-weight: 600; }
.ui-select-popover.is-multiple .ui-multi-select-option { min-height: 44px; gap: 10px; align-items: center; }
.ui-select-popover.is-multiple .ui-multi-select-option > span:last-child { flex: 1; white-space: normal; overflow-wrap: anywhere; text-overflow: clip; line-height: 1.45; }
.ui-select-popover.is-multiple .ui-multi-select-option:disabled { opacity: .5; cursor: not-allowed; }
.ui-select-popover.is-multiple .ui-select-footer { flex-wrap: wrap; gap: 6px 12px; }
.ui-select-popover.is-multiple .ui-multi-select-actions { display: flex; gap: 6px; margin-left: auto; }
.ui-select-popover.is-multiple .ui-popover-text-button { min-height: 44px; }
.ui-select-popover.is-multiple .ui-multi-select-clear:disabled { opacity: .45; cursor: not-allowed; }
.ui-select-empty { margin: 0; padding: 24px 12px; color: var(--c-text-3); font-size: 10px; text-align: center; }

.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ui-icon {
  display: block;
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  shape-rendering: geometricPrecision;
}

.app-shell { min-height: 100vh; background: var(--c-bg); color: var(--c-text); }
.app-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  min-height: 64px;
  padding: 0 18px 0 0;
  gap: 14px;
  border-bottom: 1px solid var(--c-header-border);
  background: var(--c-header-bg);
  color: var(--c-header-text);
  backdrop-filter: saturate(140%) blur(14px);
}
.app-brand-cluster {
  display: flex;
  align-self: stretch;
  align-items: center;
  width: 232px;
  min-height: 64px;
  padding: 0 16px;
  gap: 10px;
  flex: 0 0 232px;
  background: var(--c-nav-bg);
  color: var(--c-nav-group);
  transition: width 0.18s ease, flex-basis 0.18s ease, padding 0.18s ease;
}
.app-brand-mark {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  padding: 0;
  border: 0;
  border-radius: 11px;
  background: var(--c-accent);
  color: var(--c-on-accent);
  box-shadow: 0 5px 16px rgba(0, 0, 0, 0.18);
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}
.app-brand-name {
  overflow: hidden;
  color: inherit;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.25px;
  white-space: nowrap;
}
.nav-burger, .ui-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  padding: 0;
  border: 1px solid var(--c-control-border);
  border-radius: 10px;
  background: var(--c-surface);
  color: var(--c-header-text);
  cursor: pointer;
  transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}
.nav-burger { border-color: var(--c-nav-border); background: transparent; color: inherit; }
.ui-icon-button:hover { border-color: var(--c-border-2); background: var(--c-surface-2); box-shadow: 0 3px 12px var(--c-shadow); }
.nav-burger:hover { border-color: var(--c-nav-border); background: var(--c-nav-hover); box-shadow: none; }
.ui-icon-button:active, .nav-burger:active { box-shadow: inset 0 1px 3px var(--c-shadow-strong); }
.app-header-context {
  display: flex;
  align-items: center;
  min-width: 0;
  margin-right: auto;
  gap: 10px;
  color: var(--c-header-dim);
  font-size: 12px;
}
.app-header-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--c-accent-soft);
  color: var(--c-accent-text);
  font-weight: 700;
  white-space: nowrap;
}
.app-header-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.app-header-status.is-error { background: var(--c-danger-bg); color: var(--c-danger-text); }
.app-header-actions { display: flex; align-items: center; min-width: 0; gap: 9px; }
.app-user-chip { display: flex; align-items: center; min-width: 0; gap: 8px; padding: 3px 4px 3px 3px; border-radius: 999px; color: var(--c-header-text); font-size: 12px; font-weight: 600; }
.app-user-avatar { display: inline-grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent-text); box-shadow: inset 0 0 0 1px var(--c-border); font-size: 10px; font-weight: 800; }
.app-user-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.theme-icon-sun { display: none; }
[data-theme="dark"] .theme-icon-moon { display: none; }
[data-theme="dark"] .theme-icon-sun { display: block; }
#refresh.is-loading .ui-icon { animation: ui-spin 0.8s linear infinite; }
@keyframes ui-spin { to { transform: rotate(360deg); } }

.app-body { display: flex; min-height: calc(100vh - 64px); background: var(--c-bg); }
.nav-sidebar {
  position: sticky;
  top: 64px;
  display: flex;
  flex-direction: column;
  width: 232px;
  height: calc(100vh - 64px);
  flex: 0 0 232px;
  padding: 16px 12px;
  overflow-y: auto;
  overflow-x: hidden;
  border-right: 1px solid var(--c-nav-border);
  background: var(--c-nav-bg);
  color: var(--c-nav-text);
  box-shadow: 6px 0 24px var(--c-nav-shadow);
  scrollbar-color: var(--c-nav-border) transparent;
  transition: width 0.18s ease, flex-basis 0.18s ease, padding 0.18s ease, transform 0.22s ease;
}
.nav-mobile-head { display: none; }
.nav-content { display: grid; align-content: start; gap: 3px; }
.nav-section { display: grid; gap: 2px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--c-nav-border); }
.nav-section-label { margin: 0 8px 5px; color: var(--c-nav-text-dim); font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; }
.nav-item {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 42px;
  padding: 5px 8px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--c-nav-text);
  font-size: 12px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}
.nav-level-1, .nav-level-2 { justify-content: space-between; }
.nav-subtree { display: grid; min-width: 0; gap: 2px; }
.nav-subtree[hidden] { display: none; }
.nav-level-2-tree { margin: 2px 0 5px 17px; padding-left: 8px; border-left: 1px solid var(--c-nav-border); }
.nav-level-3-tree { margin: 1px 0 3px 12px; padding-left: 7px; border-left: 1px solid var(--c-nav-border); }
.nav-level-2 { min-height: 39px; padding: 4px 6px; background: var(--c-nav-l2-bg); color: var(--c-nav-l2-text); font-size: 12px; }
.nav-level-3 { min-height: 36px; padding: 3px 5px; border-radius: 9px; background: var(--c-nav-l3-bg); color: var(--c-nav-l3-text); font-size: 12px; }
.nav-level-2 .nav-item-identity { gap: 8px; }
.nav-level-3 .nav-item-identity { gap: 7px; }
.nav-expand-icon { width: 15px; height: 15px; margin-left: 5px; color: var(--c-nav-text-dim); transition: transform 0.16s ease; }
.nav-item[aria-expanded="true"] > .nav-expand-icon { transform: rotate(90deg); }
.nav-item:hover { background: var(--c-nav-hover); color: var(--c-nav-group); }
.nav-item.is-active, .nav-item[aria-current="page"] { background: var(--c-nav-active-bg); color: var(--c-nav-active-text); font-weight: 700; }
.nav-level-2:hover { background: var(--c-nav-l2-hover-bg); color: var(--c-nav-l2-active-text); }
.nav-level-3:hover { background: var(--c-nav-l3-hover-bg); color: var(--c-nav-l3-active-text); }
.nav-level-2.is-open, .nav-level-2.nav-leaf.is-active, .nav-level-2.nav-leaf[aria-current="page"] { background: var(--c-nav-active-subtle); color: var(--c-nav-l2-active-text); font-weight: 700; }
.nav-level-3.is-active, .nav-level-3[aria-current="page"] { background: var(--c-nav-active-faint); color: var(--c-nav-l3-active-text); font-weight: 700; }
.nav-item:active { box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.28); }
.nav-item-identity { display: inline-flex; align-items: center; min-width: 0; gap: 10px; }
.nav-item-label { overflow: hidden; min-width: 0; text-overflow: ellipsis; white-space: nowrap; }
.ui-soft-icon-tile {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 10px;
  background: var(--c-surface-3);
  color: var(--c-text-2);
  box-shadow: inset 0 0 0 1px var(--c-border);
}
.ui-soft-icon-tile .ui-icon { width: 18px; height: 18px; }
.ui-soft-icon-tile[data-tone="accent"], .nav-item.is-active .ui-soft-icon-tile, .nav-item[aria-current="page"] .ui-soft-icon-tile { background: var(--c-accent-soft); color: var(--c-accent-text); box-shadow: inset 0 0 0 1px var(--c-accent-border); }
.nav-sidebar .ui-soft-icon-tile { background: var(--c-nav-hover); color: var(--c-nav-text); box-shadow: inset 0 0 0 1px var(--c-nav-border); }
.nav-sidebar .nav-item:hover .ui-soft-icon-tile { background: var(--c-nav-border); color: var(--c-nav-group); }
.nav-sidebar .nav-item.is-active .ui-soft-icon-tile, .nav-sidebar .nav-item[aria-current="page"] .ui-soft-icon-tile { background: var(--c-nav-active-bg); color: var(--c-nav-active-text); box-shadow: inset 0 0 0 1px var(--c-accent-border); }
.nav-sidebar .nav-level-2 .ui-soft-icon-tile { width: 30px; height: 30px; flex-basis: 30px; border-radius: 8px; background: var(--c-nav-l2-bg); color: var(--c-nav-l2-icon); }
.nav-sidebar .nav-level-2 .ui-soft-icon-tile .ui-icon { width: 16px; height: 16px; }
.nav-sidebar .nav-level-3 .ui-soft-icon-tile { width: 26px; height: 26px; flex-basis: 26px; border-radius: 7px; background: var(--c-nav-l3-bg); color: var(--c-nav-l3-icon); box-shadow: inset 0 0 0 1px var(--c-nav-border); }
.nav-sidebar .nav-level-3 .ui-soft-icon-tile .ui-icon { width: 15px; height: 15px; }
.nav-sidebar .nav-level-2:hover .ui-soft-icon-tile { background: var(--c-nav-l2-hover-bg); color: var(--c-nav-l2-active-icon); }
.nav-sidebar .nav-level-3:hover .ui-soft-icon-tile { background: var(--c-nav-l3-hover-bg); color: var(--c-nav-l3-active-icon); }
.nav-sidebar .nav-level-2.is-open .ui-soft-icon-tile, .nav-sidebar .nav-level-2.nav-leaf.is-active .ui-soft-icon-tile, .nav-sidebar .nav-level-2.nav-leaf[aria-current="page"] .ui-soft-icon-tile { background: var(--c-nav-active-subtle); color: var(--c-nav-l2-active-icon); box-shadow: inset 0 0 0 1px var(--c-nav-border); }
.nav-sidebar .nav-level-3.is-active .ui-soft-icon-tile, .nav-sidebar .nav-level-3[aria-current="page"] .ui-soft-icon-tile { background: var(--c-nav-active-faint); color: var(--c-nav-l3-active-icon); box-shadow: inset 0 0 0 1px var(--c-nav-border); }
.nav-footer { display: grid; margin-top: auto; padding-top: 14px; gap: 8px; border-top: 1px solid var(--c-nav-border); }
.nav-source-card { display: flex; align-items: center; min-width: 0; padding: 11px 10px; gap: 10px; border: 1px solid var(--c-nav-border); border-radius: 12px; background: var(--c-nav-hover); }
.nav-administration { margin-top: 2px; }
.source-indicator { display: inline-block; width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: var(--c-success-text); box-shadow: 0 0 0 4px var(--c-success-bg); }
.source-indicator.is-neutral { background: var(--c-text-3); box-shadow: 0 0 0 4px var(--c-surface-3); }
.nav-source-copy { display: grid; min-width: 0; }
.nav-source-copy strong { overflow: hidden; color: var(--c-nav-group); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.nav-source-copy small { overflow: hidden; color: var(--c-nav-text-dim); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.nav-overlay { display: none; }

.app-main { width: 100%; max-width: none; min-width: 0; margin: 0 auto; padding: 12px 18px 24px; overflow-x: hidden; }
.app-page[hidden], .integration-view[hidden] { display: none; }
.page-heading { display: flex; align-items: center; justify-content: space-between; min-width: 0; margin-bottom: 10px; padding: 0 2px; gap: 12px; scroll-margin-top: var(--c-scroll-offset); }
.page-heading h1 { margin: 0; color: var(--c-text); font-size: 22px; font-weight: 800; letter-spacing: -0.35px; }
.page-kicker, .section-kicker { margin: 0 0 5px; color: var(--c-accent-text); font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.page-subtitle { max-width: 760px; margin: 5px 0 0; color: var(--c-text-3); font-size: 13px; }
.page-heading-actions { display: flex; align-items: center; gap: 8px; }
.source-badge { display: grid; grid-template-columns: 8px auto; align-items: center; column-gap: 9px; min-width: 180px; padding: 9px 12px; border: 1px solid var(--c-border); border-radius: 12px; background: var(--c-surface); box-shadow: 0 2px 8px var(--c-shadow); }
.source-badge .source-indicator { grid-row: 1 / 3; }
.source-badge strong { font-size: 11px; }
.source-badge > span:last-child { color: var(--c-text-3); font-size: 9px; }

.notice { display: flex; align-items: flex-start; min-height: 42px; margin: 0 0 14px; padding: 10px 12px; gap: 9px; border: 1px solid var(--c-info-text); border-radius: 12px; background: var(--c-info-bg); color: var(--c-info-text); font-size: 12px; }
.notice[hidden] { display: none; }
.notice.success { border-color: var(--c-success-text); background: var(--c-success-bg); color: var(--c-success-text); }
.notice.error { border-color: var(--c-danger-text); background: var(--c-danger-bg); color: var(--c-danger-text); }
.notice.warning { border-color: var(--c-warn-text); background: var(--c-warn-bg); color: var(--c-warn-text); }
.notice-icon { margin-top: 1px; }

.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 14px; gap: 12px; }
.metric-card { display: flex; align-items: flex-start; min-width: 0; min-height: 118px; padding: 16px; gap: 12px; border: 1px solid var(--c-border); border-radius: 14px; background: var(--c-surface); box-shadow: 0 2px 8px var(--c-shadow); }
.metric-card > div { display: grid; min-width: 0; }
.metric-icon { width: 38px; height: 38px; flex-basis: 38px; background: var(--c-accent-soft); color: var(--c-accent-text); box-shadow: inset 0 0 0 1px var(--c-accent-border); }
.metric-label { margin: 0 0 8px; color: var(--c-text-2); font-size: 11px; font-weight: 600; }
.metric-card strong { overflow: hidden; color: var(--c-text); font-size: 24px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.metric-card strong.metric-date { padding-top: 5px; font-size: 12px; line-height: 1.4; }
.metric-card small { margin-top: 5px; color: var(--c-text-3); font-size: 9px; }

.workspace-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr); align-items: start; margin-bottom: 14px; gap: 14px; }
.onec-workspace { grid-template-columns: minmax(0, 1fr); }
.ui-card { min-width: 0; padding: 17px 18px; border: 1px solid var(--c-border); border-radius: 14px; background: var(--c-surface); box-shadow: 0 2px 8px var(--c-shadow); scroll-margin-top: var(--c-scroll-offset); }
.standalone-panel { max-width: 780px; margin-bottom: 14px; }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; min-width: 0; margin-bottom: 14px; gap: 14px; }
.section-heading h2 { margin: 0; color: var(--c-text); font-size: 16px; font-weight: 700; letter-spacing: -0.1px; }
.section-heading p:not(.section-kicker) { max-width: 680px; margin: 5px 0 0; color: var(--c-text-3); font-size: 11px; }
.compact-heading { margin-bottom: 16px; }
.status-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 26px; padding: 3px 9px; border-radius: 999px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.status-badge.neutral { background: var(--c-surface-3); color: var(--c-text-2); }
.status-badge.success { background: var(--c-success-bg); color: var(--c-success-text); }
.status-badge.warning { background: var(--c-warn-bg); color: var(--c-warn-text); }
.status-badge.danger { background: var(--c-danger-bg); color: var(--c-danger-text); }
.status-badge.info { background: var(--c-info-bg); color: var(--c-info-text); }
.status-badge strong { font-size: inherit; font-variant-numeric: tabular-nums; }

.integration-view { min-width: 0; }
.analytics-panel { margin-bottom: 14px; }
.analytics-filter-grid {
  display: grid;
  grid-template-columns: minmax(145px, 0.8fr) minmax(145px, 0.8fr) minmax(210px, 1.25fr) auto;
  align-items: end;
  margin-bottom: 13px;
  gap: 10px;
}
.sales-filter-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
.inventory-filter-grid { grid-template-columns: minmax(180px, 0.8fr) minmax(210px, 1.25fr) auto; }
.sales-filter-grid .ui-action-button { justify-self: start; }
.analytics-filter-grid .filter-field { width: auto; min-width: 0; flex: none; }
.analytics-filter-grid .filter-field label { display: grid; gap: 5px; }
.analytics-filter-grid input, .analytics-filter-grid select { min-height: 44px; padding: 10px 12px; }
.analytics-filter-grid .ui-action-button { min-width: 126px; }
.analytics-summary-line { display: flex; align-items: center; justify-content: space-between; min-height: 30px; margin-bottom: 12px; gap: 10px; color: var(--c-text-3); font-size: 10px; }
.analytics-summary-line [data-analytics-coverage] { text-align: right; }
.analytics-summary-line .is-warning { color: var(--c-warn-text); font-weight: 700; }
.analytics-snapshot-warning {
  margin: -2px 0 13px;
  padding: 10px 12px;
  border: 1px solid var(--c-accent-border);
  border-radius: 10px;
  background: var(--c-warn-bg);
  color: var(--c-warn-text);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.5;
}
.analytics-snapshot-warning[hidden] { display: none; }
.analytics-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: 13px; gap: 8px; }
.analytics-kpi { display: grid; min-width: 0; min-height: 80px; align-content: center; padding: 11px 12px; gap: 6px; border: 1px solid var(--c-border-soft); border-radius: 10px; background: var(--c-surface-2); }
.analytics-kpi span { color: var(--c-text-3); font-size: 9px; font-weight: 600; }
.analytics-kpi strong { overflow: hidden; color: var(--c-text); font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.analytics-table { min-width: 860px; }
[data-analytics-page="sales"] .analytics-table { min-width: 1320px; }
.analytics-table .numeric-cell { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

.dataset-list { display: grid; gap: 3px; }
.dataset-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto 18px; align-items: center; width: 100%; min-height: 59px; padding: 10px 7px; gap: 10px; border: 1px solid transparent; border-bottom-color: var(--c-border-soft); border-radius: 10px; background: transparent; color: var(--c-text); text-align: left; cursor: pointer; }
.dataset-row:last-child { border-bottom-color: transparent; }
.dataset-row:hover { border-color: var(--c-border); background: var(--c-surface-2); }
.dataset-row .ui-soft-icon-tile { width: 34px; height: 34px; }
.dataset-copy { display: grid; min-width: 0; }
.dataset-copy strong { overflow: hidden; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.dataset-copy small { overflow: hidden; color: var(--c-text-3); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.dataset-count { padding: 4px 7px; border-radius: 999px; background: var(--c-surface-3); color: var(--c-text-2); font-size: 10px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dataset-chevron { width: 16px; height: 16px; color: var(--c-text-3); }

.form-field { display: grid; align-content: start; min-width: 0; margin-bottom: 13px; gap: 5px; }
.form-field label, .filter-field label { color: var(--c-text-2); font-size: 11px; font-weight: 600; }
.form-field small { color: var(--c-text-3); font-size: 9px; }
.input-with-icon { position: relative; }
.input-with-icon > .ui-icon { position: absolute; top: 50%; left: 11px; z-index: 1; width: 17px; height: 17px; color: var(--c-text-3); transform: translateY(-50%); pointer-events: none; }
.input-with-icon input { min-height: 44px; padding: 10px 12px 10px 38px; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ui-action-button { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 4px 13px 4px 5px; gap: 8px; border: 1px solid var(--c-control-border); border-radius: 10px; background: var(--c-surface); color: var(--c-text); font-size: 12px; font-weight: 700; cursor: pointer; transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease; }
.ui-action-button .ui-soft-icon-tile { width: 30px; height: 30px; flex-basis: 30px; border-radius: 8px; }
.ui-action-button .ui-soft-icon-tile .ui-icon { width: 16px; height: 16px; }
.ui-action-button.primary { border-color: var(--c-accent-border); background: var(--c-accent); color: var(--c-on-accent); box-shadow: 0 3px 10px var(--c-accent-shadow); }
.ui-action-button.primary .ui-soft-icon-tile { background: rgba(48, 48, 48, 0.1); color: var(--c-on-accent); box-shadow: none; }
.ui-action-button.secondary:hover { border-color: var(--c-border-2); background: var(--c-surface-2); box-shadow: 0 4px 14px var(--c-shadow); }
.ui-action-button.primary:hover { box-shadow: 0 4px 14px var(--c-accent-shadow); }
.ui-action-button.danger { border-color: var(--c-danger-text); background: var(--c-surface); color: var(--c-danger-text); }
.ui-action-button.danger .ui-soft-icon-tile { background: var(--c-danger-bg); color: var(--c-danger-text); box-shadow: inset 0 0 0 1px var(--c-danger-text); }
.ui-action-button.danger:hover { background: var(--c-danger-bg); }

.sync-panel { margin-bottom: 14px; }
.sync-status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 15px; gap: 8px; }
.sync-status-grid > div { display: grid; min-width: 0; padding: 11px 12px; gap: 4px; border: 1px solid var(--c-border-soft); border-radius: 10px; background: var(--c-surface-2); }
.sync-status-grid span { color: var(--c-text-3); font-size: 9px; font-weight: 600; }
.sync-status-grid strong { overflow: hidden; color: var(--c-text); font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.sync-actions { align-items: center; }
.sync-actions small { color: var(--c-text-3); font-size: 9px; }

.source-matrix-panel { margin-bottom: 14px; }
.source-matrix-panel table { min-width: 820px; }
.source-matrix-panel td:first-child { white-space: nowrap; }

.uds-panel { margin-bottom: 14px; }
.uds-heading { align-items: flex-start; }
.uds-heading-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.uds-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 15px;
  gap: 8px;
}
.uds-status-grid > div {
  display: grid;
  min-width: 0;
  min-height: 88px;
  align-content: start;
  padding: 12px;
  gap: 5px;
  border: 1px solid var(--c-border-soft);
  border-radius: 10px;
  background: var(--c-surface-2);
}
.uds-status-grid span { color: var(--c-text-3); font-size: 9px; font-weight: 600; }
.uds-status-grid strong { overflow: hidden; color: var(--c-text); font-size: 13px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.uds-status-grid small { overflow: hidden; color: var(--c-text-3); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.uds-filter-grid {
  display: grid;
  grid-template-columns: minmax(145px, 0.7fr) minmax(145px, 0.7fr) minmax(230px, 1.5fr) auto;
  align-items: end;
  margin-bottom: 14px;
  gap: 10px;
}
.uds-filter-grid .filter-field { width: auto; min-width: 0; flex: none; }
.uds-filter-grid input, .uds-filter-grid select { width: 100%; }
.uds-filter-grid .ui-action-button { min-width: 126px; }
.uds-data-days { color: var(--c-text-3); font-size: 10px; font-weight: 600; font-variant-numeric: tabular-nums; }
.uds-table { min-width: 520px; }
.uds-table .numeric-cell { text-align: right; }
.uds-table .registration-count { font-weight: 800; font-variant-numeric: tabular-nums; }
.uds-table tbody tr.is-zero td { color: var(--c-text-3); }
.uds-table tbody tr.is-zero .registration-count { color: var(--c-text-2); }
.uds-source-summary td { background: var(--c-surface); }
.uds-source-summary:hover td { background: var(--c-surface-2); }
.uds-source-toggle { display: inline-flex; align-items: center; max-width: 100%; padding: 5px 7px; gap: 7px; border: 0; background: transparent; color: inherit; font-weight: 700; text-align: left; cursor: pointer; }
.uds-source-toggle .ui-icon { width: 15px; height: 15px; color: var(--c-text-3); transition: transform 0.16s ease; }
.uds-source-toggle[aria-expanded="true"] .ui-icon { transform: rotate(90deg); }
.uds-source-toggle span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uds-source-detail-row td { padding: 0; background: var(--c-surface-2); }
.uds-source-detail-row:hover td { background: var(--c-surface-2); }
.uds-daily-detail { padding: 10px 12px 13px 42px; }
.uds-daily-table { min-width: 0; border: 1px solid var(--c-border-soft); border-radius: 9px; }
.uds-daily-table th, .uds-daily-table td { padding-block: 8px; background: var(--c-surface-2); }
.uds-daily-table th:last-child, .uds-daily-table td:last-child { text-align: right; }
.uds-daily-empty { margin: 0; color: var(--c-text-3); font-size: 10px; }
.uds-admin-required { display: grid; justify-items: center; gap: 10px; }
.uds-admin-required p { max-width: 520px; margin: 0; }

.journal-panel { margin-bottom: 14px; }
.journal-heading { align-items: flex-end; }
.journal-filters { display: flex; align-items: end; gap: 10px; }
.filter-field { display: grid; width: min(220px, 100%); flex: 0 0 220px; gap: 5px; }
.table-wrap { overflow-x: auto; border: 1px solid var(--c-border); border-radius: 12px; }
table { width: 100%; min-width: 760px; border-spacing: 0; border-collapse: separate; background: var(--c-surface); font-size: 11px; }
th { padding: 10px 11px; border-bottom: 1px solid var(--c-border); background: var(--c-surface-2); color: var(--c-text-2); font-size: 10px; font-weight: 600; text-align: left; white-space: nowrap; }
td { padding: 10px 11px; border-bottom: 1px solid var(--c-border-soft); background: var(--c-surface); color: var(--c-text); font-size: 11px; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: var(--c-surface-2); }
td code { display: block; max-width: 230px; overflow: hidden; color: var(--c-text-2); font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", monospace; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.empty-state { padding: 34px 16px; color: var(--c-text-3); text-align: center; }

.administration-panel { margin-bottom: 8px; }
.admin-token-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; }
.admin-token-row .form-field { margin-bottom: 0; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { border: 2px solid var(--c-bg); border-radius: 999px; background: var(--c-border-2); }
::-webkit-scrollbar-track { background: transparent; }

@media (min-width: 769px) {
  .app-shell.nav-collapsed .app-brand-cluster { width: 72px; flex-basis: 72px; justify-content: center; padding-inline: 8px; }
  .app-shell.nav-collapsed .app-brand-cluster .app-brand-mark, .app-shell.nav-collapsed .app-brand-cluster .app-brand-name { display: none; }
  .app-shell.nav-collapsed .nav-sidebar { width: 72px; flex-basis: 72px; padding-inline: 8px; }
  .app-shell.nav-collapsed .nav-section-label, .app-shell.nav-collapsed .nav-item-label, .app-shell.nav-collapsed .nav-source-copy { display: none; }
  .app-shell.nav-collapsed .nav-item { justify-content: center; padding-inline: 4px; }
  .app-shell.nav-collapsed .nav-item-identity { justify-content: center; gap: 0; }
  .app-shell.nav-collapsed .nav-subtree, .app-shell.nav-collapsed .nav-expand-icon { display: none; }
  .app-shell.nav-collapsed .nav-source-card { justify-content: center; padding-inline: 4px; }
}

@media (max-width: 1100px) {
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .uds-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
  .app-header-context { display: none; }
  .workspace-grid { grid-template-columns: minmax(0, 1fr); }
  .uds-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .uds-filter-grid .uds-source-filter { grid-column: 1 / -1; }
  .uds-filter-grid .ui-action-button { justify-self: start; }
  .analytics-filter-grid, .sales-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-filter-grid .ui-action-button { justify-self: start; }
}

@media (max-width: 768px) {
  body { overflow-x: hidden; }
  .app-header { min-height: 64px; padding: 9px 12px; gap: 8px; }
  .app-brand-cluster { width: auto; min-height: auto; flex-basis: auto; align-self: auto; padding: 0; background: transparent; color: var(--c-header-text); }
  .app-brand-cluster .app-brand-mark { display: none; }
  .nav-burger { border-color: var(--c-control-border); background: var(--c-surface); color: var(--c-header-text); }
  .nav-burger:hover { border-color: var(--c-border-2); background: var(--c-surface-2); box-shadow: 0 3px 12px var(--c-shadow); }
  .app-body { display: block; }
  .nav-sidebar { position: fixed; top: 0; left: 0; z-index: 60; visibility: hidden; width: min(86vw, 320px); height: 100vh; height: 100dvh; padding: 12px; pointer-events: none; transform: translateX(-100%); transition: transform 0.22s ease, visibility 0s linear 0.22s; box-shadow: 16px 0 40px rgba(0, 0, 0, 0.28); }
  .nav-sidebar.nav-open { visibility: visible; pointer-events: auto; transform: translateX(0); transition-delay: 0s; }
  .nav-mobile-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; padding: 2px 2px 12px; gap: 10px; border-bottom: 1px solid var(--c-nav-border); }
  .nav-mobile-brand { display: flex; align-items: center; gap: 9px; color: var(--c-nav-group); }
  .nav-mobile-head .app-brand-mark { width: 34px; height: 34px; flex-basis: 34px; }
  .nav-close { border-color: var(--c-nav-border); background: var(--c-nav-hover); color: var(--c-nav-group); }
  .nav-overlay { position: fixed; inset: 0; z-index: 50; display: block; visibility: hidden; pointer-events: none; background: rgba(5, 14, 17, 0.48); opacity: 0; transition: opacity 0.22s ease, visibility 0s linear 0.22s; backdrop-filter: blur(2px); }
  .nav-overlay.is-open { visibility: visible; pointer-events: auto; opacity: 1; transition-delay: 0s; }
  .app-main { max-width: none; margin: 0; padding: 16px 14px 36px; overflow-x: hidden; }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .page-heading-actions { width: 100%; }
  .source-badge { width: 100%; }
}

@media (max-width: 560px) {
  .app-user-name { display: none; }
  .app-user-chip { padding-right: 0; }
  .app-brand-name { font-size: 15px; }
  .stats-grid { grid-template-columns: minmax(0, 1fr); }
  .metric-card { min-height: 102px; }
  .section-heading, .journal-heading { align-items: flex-start; flex-direction: column; }
  .uds-heading-badges { justify-content: flex-start; }
  .journal-filters { width: 100%; flex-direction: column; align-items: stretch; }
  .filter-field { width: 100%; flex-basis: auto; }
  .admin-token-row { grid-template-columns: minmax(0, 1fr); }
  .admin-token-row .ui-action-button { width: 100%; }
  .actions .ui-action-button { flex: 1 1 150px; }
  .sync-status-grid { grid-template-columns: minmax(0, 1fr); }
  .uds-status-grid, .uds-filter-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-filter-grid, .sales-filter-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-filter-grid .ui-range-field, .uds-filter-grid .ui-range-field { grid-column: 1 / -1; }
  .analytics-filter-grid .ui-action-button { width: 100%; }
  .analytics-summary-line { align-items: flex-start; flex-direction: column; }
  .analytics-summary-line [data-analytics-coverage] { text-align: left; }
  .uds-filter-grid .uds-source-filter { grid-column: auto; }
  .uds-filter-grid .ui-action-button { width: 100%; }
  .ui-popover-backdrop { z-index: 89; background: var(--c-overlay-strong); backdrop-filter: blur(3px); }
  .ui-popover {
    top: auto;
    right: var(--ui-popover-right, 8px);
    bottom: var(--ui-popover-bottom, 8px);
    left: var(--ui-popover-left, 8px);
    z-index: 90;
    width: auto;
    max-height: min(calc(100dvh - 16px), var(--ui-popover-max-height, 100dvh));
    border-radius: 16px;
  }
  .ui-calendar-popover, .ui-calendar-popover.is-single-month, .ui-month-popover, .ui-select-popover { width: auto; }
  .ui-calendar-months { grid-template-columns: minmax(0, 1fr); }
  .ui-calendar-month:nth-child(2) { display: none; }
  .ui-calendar-title-desktop { display: none; }
  .ui-calendar-title-mobile { display: inline; }
  .ui-calendar-day { min-height: 40px; aspect-ratio: auto; }
  .ui-month-choice { min-height: 44px; }
  .ui-calendar-footer { align-items: stretch; flex-direction: column; }
  .ui-calendar-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ui-popover-text-button { min-height: 40px; }
  .ui-select-options { max-height: min(56dvh, 420px); }
  .ui-select-option { min-height: 42px; }
}

@media (max-width: 360px) {
  .app-header { padding-inline: 8px; gap: 4px; }
  .app-header-actions { gap: 4px; }
  .app-user-avatar { width: 30px; height: 30px; flex-basis: 30px; }
  .app-main { padding-inline: 10px; }
  .ui-card { padding: 15px 14px; }
  .dataset-row { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .dataset-chevron { display: none; }
  .uds-daily-detail { padding-left: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}
/* The shared sidebar keeps deeply nested destinations readable in one shell. */
.platform-navigation { display:flex; flex:1 1 0; flex-direction:column; min-width:0; min-height:0; gap:3px; }
.platform-nav-group { min-width:0; flex:0 0 auto; }
.platform-navigation > .nav-item { flex-shrink:0; }
/* Expanding the footer uses the free space above its stationary trigger. */
.platform-nav-footer { display:flex; flex-direction:column-reverse; flex:0 1 auto; min-height:0; margin-top:auto; padding-top:10px; border-top:1px solid var(--c-nav-border); }
.platform-nav-footer > .nav-item { flex-shrink:0; }
.platform-navigation .platform-nav-footer > .nav-subtree { min-height:0; overflow-y:auto; overscroll-behavior:contain; margin:0 0 8px; padding-left:6px; scrollbar-gutter:stable; }
.platform-navigation .platform-nav-footer > .nav-item[aria-expanded="true"] > .nav-expand-icon { transform:rotate(-90deg); }
.platform-navigation .nav-item { width:100%; min-width:0; justify-content:space-between; text-decoration:none; }
.platform-navigation .nav-item-identity { flex:1 1 auto; }
.platform-navigation .nav-item-label { overflow:visible; white-space:normal; overflow-wrap:anywhere; text-overflow:clip; line-height:1.4; }
.platform-navigation .nav-expand-icon { flex:0 0 15px; }
.platform-navigation [aria-expanded="true"] > .nav-expand-icon { transform:rotate(90deg); }
.platform-navigation .nav-level-2-tree { margin-left:9px; padding-left:6px; }
.platform-navigation .nav-level-3-tree, .platform-navigation .nav-level-4-tree { margin:1px 0 3px 6px; padding-left:5px; border-left:1px solid var(--c-nav-border); }
.platform-navigation .nav-level-3 { min-height:36px; }
.platform-navigation .nav-level-4 { min-height:40px; padding:6px 5px; border-radius:9px; background:var(--c-nav-l3-bg); color:var(--c-nav-l3-text); font-size:12px; }
.platform-navigation .nav-level-4 .nav-item-identity { gap:7px; }
.platform-navigation .nav-level-4 .ui-soft-icon-tile { width:24px; height:24px; flex-basis:24px; border-radius:7px; background:var(--c-nav-l3-bg); color:var(--c-nav-l3-icon); }
.platform-navigation .nav-level-4 .ui-soft-icon-tile .ui-icon { width:14px; height:14px; }
.platform-navigation .nav-level-4:hover { background:var(--c-nav-l3-hover-bg); color:var(--c-nav-l3-active-text); }
.platform-navigation .nav-level-4:hover .ui-soft-icon-tile { background:var(--c-nav-l3-hover-bg); color:var(--c-nav-l3-active-icon); }
.platform-navigation .nav-level-3[aria-expanded="true"], .platform-navigation .nav-level-4.is-active, .platform-navigation .nav-level-4[aria-current="page"] { background:var(--c-nav-active-faint); color:var(--c-nav-l3-active-text); font-weight:700; }
.platform-navigation .nav-level-3[aria-expanded="true"] .ui-soft-icon-tile, .platform-navigation .nav-level-4.is-active .ui-soft-icon-tile, .platform-navigation .nav-level-4[aria-current="page"] .ui-soft-icon-tile { background:var(--c-nav-active-faint); color:var(--c-nav-l3-active-icon); box-shadow:inset 0 0 0 1px var(--c-nav-border); }
@media (min-width:769px) {
  .nav-collapsed .platform-navigation .nav-subtree { display:none; }
}
@media (max-width:768px) {
  .app-main { padding-top:12px; }
  .platform-navigation .nav-item { min-height:44px; }
}
.app-user-chip { text-decoration:none; }
.integration-summary { margin:0 0 10px; }
.integration-summary > summary { color:var(--c-text-2); cursor:pointer; padding:6px 0; font-size:12px; font-weight:600; }
.integration-summary[open] > summary { margin-bottom:6px; }
.ui-card { padding:12px 14px; }
.section-heading, .compact-heading { margin-bottom:8px; gap:10px; }
.metric-card { min-height:80px; padding:12px; }
.uds-status-grid > div { min-height:70px; padding:9px; gap:3px; }
.notice.info, .notice.success { position:fixed; bottom:14px; right:18px; z-index:60; max-width:min(540px,calc(100vw - 36px)); margin:0; box-shadow:0 4px 18px var(--c-shadow); }
[hidden] { display:none !important; }
.diagnostics-filters { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin-bottom:12px; }
.diagnostics-filters .filter-field { display:flex; flex-direction:column; gap:6px; min-width:190px; }
.diagnostics-feedback { color:var(--c-text-2); font-size:13px; margin:10px 0 16px; }
.diagnostics-feedback[data-state="error"] { color:var(--c-danger,#b42318); }
.diagnostics-sources { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:14px; margin-bottom:16px; }
.diagnostics-source .section-heading { align-items:start; flex-wrap:wrap; }
.diagnostics-source h2,.diagnostics-section h2 { font-size:17px; margin:0 0 10px; }
.diagnostics-detail { font-size:13px; margin:6px 0; overflow-wrap:anywhere; }
.diagnostics-detail strong { font-weight:550; }
.diagnostics-control { margin:16px 0; padding-top:12px; border-top:1px solid var(--c-border,#ddd); }
.diagnostics-source > details { margin-top:16px; font-size:13px; }
.diagnostics-source > details > summary { cursor:pointer; color:var(--c-text-2); }
.diagnostics-snapshots { list-style:none; margin:14px 0 0; padding:0; display:grid; gap:10px; }
.diagnostics-snapshots li { display:grid; gap:3px; padding-top:8px; border-top:1px solid var(--c-border,#ddd); font-size:13px; }
.diagnostics-snapshots small,.diagnostics-meta { color:var(--c-text-2); }
.diagnostics-section { margin:16px 0; }
.diagnostics-list { display:grid; gap:12px; }
.diagnostics-incident,.diagnostics-run { padding:12px 0; border-top:1px solid var(--c-border,#ddd); overflow-wrap:anywhere; }
.diagnostics-item-heading { display:flex; align-items:start; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.diagnostics-item-heading h3 { margin:0; font-size:15px; font-weight:600; }
.diagnostics-meta,.diagnostics-counts,.diagnostics-error { font-size:13px; line-height:1.55; }
.diagnostics-incident details { margin-top:9px; font-size:13px; }
.diagnostics-incident summary { cursor:pointer; color:var(--c-text-2); }
.diagnostics-section > button { margin-top:12px; }

.alfabank-section { margin-bottom:16px; padding:18px; }
.alfabank-section > h2 { margin:0 0 16px; font-size:18px; }
.alfabank-section .section-heading { flex-wrap:wrap; gap:12px; }
.alfabank-section .section-heading h2 { margin-right:auto; }
.alfabank-settings,.alfabank-filters { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin:16px 0; }
.alfabank-settings .filter-field,.alfabank-filters .filter-field { display:flex; flex-direction:column; gap:6px; flex:1 1 170px; min-width:0; }
.alfabank-settings input,.alfabank-settings select,.alfabank-filters input { width:100%; }
.alfabank-checkbox { display:flex; align-items:center; gap:8px; min-height:40px; font-size:12px; }
.alfabank-checkbox input { width:16px; height:16px; }
.alfabank-feedback,.alfabank-count { font-size:12px; line-height:1.5; }
.alfabank-feedback[data-state="error"],.alfabank-run-error { color:var(--c-danger-text); }
.alfabank-operation-table { min-width:900px; }
.alfabank-run-table { min-width:840px; }
.alfabank-operation-table .numeric-cell,.alfabank-run-table .numeric-cell { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.alfabank-operation-table .alfabank-purpose { min-width:230px; max-width:420px; white-space:normal; overflow-wrap:anywhere; }
.alfabank-operation-table .alfabank-counterparty { min-width:170px; max-width:280px; white-space:normal; overflow-wrap:anywhere; }
.alfabank-counterparty small,.alfabank-run-error,.alfabank-own-account { display:block; margin-top:5px; font-size:11px; white-space:normal; }
.alfabank-own-account { color:var(--c-text-3); font-variant-numeric:tabular-nums; }
.alfabank-balance-period { margin:12px 0 6px; font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.alfabank-confirmed-through { margin:12px 0; font-size:13px; font-weight:600; }
.alfabank-balance-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px; }
.alfabank-balance-grid > div { display:flex; flex-direction:column; gap:6px; padding:12px; border:1px solid var(--c-border-soft); border-radius:10px; }
.alfabank-balance-grid span { font-size:11px; color:var(--c-text-3); }
.alfabank-balance-grid strong { font-size:15px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.alfabank-section > button { margin-top:12px; }
@media (max-width:760px) {
  .alfabank-section { padding:14px; }
  .alfabank-settings .filter-field,.alfabank-filters .filter-field { flex-basis:calc(50% - 12px); }
  .alfabank-settings .ui-action-button,.alfabank-filters .ui-action-button { flex:1 1 150px; }
  .alfabank-balance-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
