:root {
  color-scheme: light;
  --ml-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ml-font-size-body: 15px;
  --ml-font-size-small: 13px;
  --ml-font-weight-body: 520;
  --ml-font-weight-strong: 780;
  --ml-line-height-body: 1.5;
  --ml-bg-app: #f3f4f2;
  --ml-bg-surface: #fafbf9;
  --ml-bg-elevated: #ffffff;
  --ml-bg-muted: #ecefed;
  --ml-surface-canvas: var(--ml-bg-app);
  --ml-surface-default: var(--ml-bg-surface);
  --ml-surface-raised: var(--ml-bg-elevated);
  --ml-surface-muted: var(--ml-bg-muted);
  --ml-surface-hover: var(--ml-interactive-hover-surface);
  --ml-surface-selected: var(--ml-interactive-selected-surface);
  --ml-text-primary: #17232c;
  --ml-text-secondary: #4a5660;
  --ml-text-muted: #707b82;
  --ml-text-subtle: #858e94;
  --ml-text-disabled: #9aa3a8;
  --ml-text-placeholder: #818b91;
  --ml-text-inverse: #ffffff;
  --ml-text-on-accent: var(--ml-text-inverse);
  --ml-border-subtle: #e0e4df;
  --ml-border-default: #cfd7d1;
  --ml-border-strong: #aebcaf;
  --ml-border-focus: var(--ml-primary);
  --ml-primary: #1c6b82;
  --ml-primary-hover: #15556a;
  --ml-primary-soft: #e3f5f7;
  --ml-success: #157348;
  --ml-warning: #9a6500;
  --ml-danger: #b4233a;
  --ml-info: #2369b5;
  --ml-radius-sm: 6px;
  --ml-radius-md: 8px;
  --ml-radius-lg: 12px;
  --ml-border-width: 1px;
  --ml-shadow-sm: 0 1px 3px rgb(17 31 42 / 7%);
  --ml-shadow-md: 0 16px 42px rgb(17 31 42 / 13%);
  --ml-space-1: 4px;
  --ml-space-2: 8px;
  --ml-space-3: 12px;
  --ml-space-4: 16px;
  --ml-space-5: 24px;
  --ml-space-6: 32px;
  --ml-space-7: 48px;
  --ml-nav-h: 68px;
  --ml-side-w: 276px;
  --ml-focus: 0 0 0 3px color-mix(in srgb, var(--ml-primary) 28%, transparent);
  --ml-interactive-hover-surface: color-mix(in srgb, var(--ml-primary-soft) 46%, var(--ml-bg-surface));
  --ml-interactive-selected-surface: color-mix(in srgb, var(--ml-primary-soft) 62%, var(--ml-bg-surface));
  --ml-interactive-border-hover: color-mix(in srgb, var(--ml-primary) 44%, var(--ml-border-default));
  --ml-interactive-shadow-hover: 0 10px 24px color-mix(in srgb, var(--ml-text-primary) 12%, transparent);
  --ml-interactive-transition-fast: 160ms ease;
  --ml-tooltip-bg: color-mix(in srgb, var(--ml-bg-surface) 94%, transparent);
  --ml-tooltip-border: color-mix(in srgb, var(--ml-primary) 24%, var(--ml-border-default));
  --ml-tooltip-shadow: 0 18px 42px color-mix(in srgb, var(--ml-text-primary) 16%, transparent);
  --ml-tooltip-text: var(--ml-text-primary);
  --ml-warning-soft: color-mix(in srgb, var(--ml-warning) 11%, var(--ml-bg-surface));
  --ml-warning-border: color-mix(in srgb, var(--ml-warning) 38%, var(--ml-border-default));
  --ml-warning-foreground: #7b4a00;
  --ml-info-soft: color-mix(in srgb, var(--ml-info) 10%, var(--ml-bg-surface));
  --ml-info-border: color-mix(in srgb, var(--ml-info) 34%, var(--ml-border-default));
  --ml-info-foreground: #1f5f9f;
  --ml-success-foreground: #11613d;
  --ml-danger-foreground: #9f1f34;
  --ml-button-bg: color-mix(in srgb, var(--ml-bg-surface) 92%, var(--ml-primary-soft) 8%);
  --ml-button-bg-hover: color-mix(in srgb, var(--ml-bg-surface) 68%, var(--ml-primary-soft) 32%);
  --ml-button-shadow: 0 3px 10px color-mix(in srgb, var(--ml-text-primary) 7%, transparent);
  --ml-button-shadow-hover: 0 12px 28px color-mix(in srgb, var(--ml-primary) 14%, transparent);
  --ml-control-height: 42px;
  --ml-control-radius: 12px;
  --ml-control-border: var(--ml-border-default);
  --ml-control-bg: var(--ml-bg-surface);
  --ml-control-bg-hover: var(--ml-primary-soft);
  --ml-control-text: var(--ml-text-primary);
  --ml-control-invalid-border: color-mix(in srgb, var(--ml-danger) 64%, var(--ml-border-default));
  --ml-icon-button-size: 34px;
  --ml-icon-button-radius: 10px;
  --ml-icon-button-bg: var(--ml-bg-surface);
  --ml-icon-button-bg-hover: var(--ml-primary-soft);
  --ml-icon-button-shadow-hover: 0 7px 16px color-mix(in srgb, var(--ml-primary) 13%, transparent);
  --ml-dropdown-bg: var(--ml-bg-surface);
  --ml-dropdown-border: var(--ml-border-default);
  --ml-dropdown-radius: 15px;
  --ml-dropdown-shadow: var(--ml-shadow-md);
  --ml-dropdown-option-radius: 9px;
  --ml-dropdown-option-bg-hover: var(--ml-primary-soft);
  --ml-card-bg: var(--ml-bg-surface);
  --ml-card-border: var(--ml-border-subtle);
  --ml-card-radius: var(--ml-radius-lg);
  --ml-grid-header-bg: var(--ml-bg-muted);
  --ml-grid-row-hover-bg: var(--ml-interactive-hover-surface);
  --ml-modal-bg: var(--ml-bg-surface);
  --ml-modal-radius: var(--ml-radius-lg);
  --ml-modal-shadow: var(--ml-shadow-md);
  --ml-tab-bg: var(--ml-bg-elevated);
  --ml-tab-bg-active: var(--ml-primary-soft);
  --ml-tab-border: var(--ml-border-subtle);
}

:root[data-ui-theme="moonlight"],
body[data-ui-theme="moonlight"] {
  --ml-ui-theme-id: moonlight;
}

html[data-mode="dark"],
body[data-mode="dark"] {
  color-scheme: dark;
  --ml-bg-app: #08111d;
  --ml-bg-surface: #101c2a;
  --ml-bg-elevated: #142233;
  --ml-bg-muted: #0c1724;
  --ml-text-primary: #f3f7fb;
  --ml-text-secondary: #d7e0ea;
  --ml-text-muted: #91a3b7;
  --ml-text-subtle: #7f91a6;
  --ml-text-disabled: #65778b;
  --ml-text-placeholder: #8295aa;
  --ml-border-subtle: #1e3145;
  --ml-border-default: #2a4057;
  --ml-border-strong: #466179;
  --ml-primary-soft: #11323c;
  --ml-shadow-sm: 0 1px 2px rgb(0 0 0 / 18%);
  --ml-shadow-md: 0 18px 44px rgb(0 0 0 / 34%);
  --ml-tooltip-bg: color-mix(in srgb, var(--ml-bg-surface) 92%, transparent);
  --ml-tooltip-shadow: 0 18px 46px rgb(0 0 0 / 48%);
  --ml-warning-foreground: var(--ml-warning);
  --ml-info-foreground: var(--ml-info);
  --ml-success-foreground: var(--ml-success);
  --ml-danger-foreground: var(--ml-danger);
}

@media (prefers-color-scheme: dark) {
  html[data-appearance="system"],
  body[data-appearance="system"] {
    color-scheme: dark;
    --ml-bg-app: #08111d;
    --ml-bg-surface: #101c2a;
    --ml-bg-elevated: #142233;
    --ml-bg-muted: #0c1724;
    --ml-text-primary: #f3f7fb;
    --ml-text-secondary: #d7e0ea;
    --ml-text-muted: #91a3b7;
    --ml-border-subtle: #1e3145;
    --ml-border-default: #2a4057;
    --ml-border-strong: #466179;
    --ml-primary-soft: #11323c;
    --ml-tooltip-bg: color-mix(in srgb, var(--ml-bg-surface) 92%, transparent);
    --ml-tooltip-shadow: 0 18px 46px rgb(0 0 0 / 48%);
  }
}

.skin-moonlight-aurora { --ml-primary: #1c6b82; --ml-primary-hover: #15556a; --ml-primary-soft: #e3f5f7; }
.skin-nordic { --ml-primary: #31756f; --ml-primary-hover: #285f5a; --ml-primary-soft: #e4f4ef; }
.skin-graphite { --ml-primary: #596b7d; --ml-primary-hover: #465666; --ml-primary-soft: #edf1f5; }
.skin-ocean { --ml-primary: #246da8; --ml-primary-hover: #1d5787; --ml-primary-soft: #e5f1fb; }
.skin-forest { --ml-primary: #2d704f; --ml-primary-hover: #235940; --ml-primary-soft: #e8f4ed; }
.skin-violet { --ml-primary: #6b5bb7; --ml-primary-hover: #554796; --ml-primary-soft: #efecfb; }
html[data-mode="dark"] body.skin-moonlight-aurora,
body[data-mode="dark"].skin-moonlight-aurora { --ml-primary-soft: #10333b; }
body[data-mode="dark"].skin-nordic { --ml-primary-soft: #133530; }
body[data-mode="dark"].skin-graphite { --ml-primary-soft: #202b36; }
body[data-mode="dark"].skin-ocean { --ml-primary-soft: #102d45; }
body[data-mode="dark"].skin-forest { --ml-primary-soft: #123426; }
body[data-mode="dark"].skin-violet { --ml-primary-soft: #25213f; }

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  color: var(--ml-text-primary);
  background: var(--ml-bg-app);
  font-family: var(--ml-font);
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: 0;
}
body[data-density="compact"] { font-size: 14px; }
button, input, select, textarea { font: inherit; color: inherit; }
input::placeholder, textarea::placeholder { color: var(--ml-text-placeholder); opacity: 1; }
button:disabled, input:disabled, select:disabled, textarea:disabled { color: var(--ml-text-disabled); }
button { cursor: pointer; }
a { color: inherit; }
svg { width: 18px; height: 18px; flex: 0 0 auto; }
:focus-visible { outline: 0; box-shadow: var(--ml-focus); }
.skip-link { position: fixed; left: 14px; top: 14px; transform: translateY(-160%); z-index: 1000; padding: 10px 12px; border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); border: 1px solid var(--ml-border-default); }
.skip-link:focus { transform: translateY(0); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.muted, .hint { color: var(--ml-text-muted); }
.hidden, [hidden] { display: none !important; }
h1, h2, h3 { margin: 0; line-height: 1.15; letter-spacing: 0; }
h1 { font-size: clamp(30px, 4vw, 42px); }
h2 { font-size: 24px; }
h3 { font-size: 17px; }
p { margin: 0; }

.brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; font-weight: 820; text-decoration: none; }
.logo-mark { width: 34px; height: 34px; flex: 0 0 34px; background: url("../../assets/brand/icons/source/flexystore-logo-mark-primary.png") center / contain no-repeat; }
.brand-subtitle { display: block; color: var(--ml-text-muted); font-size: 12px; font-weight: 650; }

.btn {
  min-height: 40px;
  border: 1px solid var(--ml-border-default);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-surface);
  color: var(--ml-text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  font-weight: 760;
  text-decoration: none;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.btn:hover { background: var(--ml-bg-elevated); border-color: var(--ml-border-strong); }
.btn:active { transform: translateY(1px); }
.btn.primary { color: var(--ml-text-inverse); background: var(--ml-primary); border-color: var(--ml-primary); }
.btn.primary:hover { background: var(--ml-primary-hover); }
.btn.ghost { border-color: transparent; background: transparent; color: var(--ml-text-secondary); }
.btn.icon { width: 40px; padding: 0; }
.btn.danger { color: var(--ml-danger); border-color: color-mix(in srgb, var(--ml-danger) 34%, var(--ml-border-default)); }
.button-row, .public-nav, .tabs { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.topbar-actions { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: nowrap; }

.field { display: grid; gap: 7px; margin-bottom: 14px; }
.field label { color: var(--ml-text-secondary); font-weight: 760; }
.field input, .field textarea, .field select, .search-input {
  min-height: 42px;
  width: 100%;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-control-radius);
  background: var(--ml-control-bg);
  padding: 0 12px;
}
.field select {
  color: var(--ml-text-primary);
  font: inherit;
  font-weight: 760;
  line-height: 1.2;
  padding-right: 38px;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--ml-text-muted) 50%),
    linear-gradient(135deg, var(--ml-text-muted) 50%, transparent 50%);
  background-position:
    calc(100% - 20px) 50%,
    calc(100% - 14px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.field select:hover { border-color: var(--ml-interactive-border-hover); background-color: var(--ml-interactive-hover-surface); }
.field select:focus-visible { outline: 0; border-color: var(--ml-border-focus); box-shadow: var(--ml-focus); }
.field select:disabled { cursor: not-allowed; opacity: .72; }
.field select option { color: CanvasText; background: Canvas; }
.field input[aria-invalid="true"],
.field textarea[aria-invalid="true"],
.field select[aria-invalid="true"] {
  border-color: var(--ml-control-invalid-border);
}
.field textarea { min-height: 116px; padding: 10px 12px; resize: vertical; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pricing-datetime-row {
  grid-column: 1 / -1;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.settings-form, .settings-list { display: grid; gap: 16px; }
.settings-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-sm);
}
.settings-panel h3 { font-size: 16px; }
.settings-panel .button-row { justify-content: flex-start; }
.settings-subsection { display: grid; gap: 12px; padding-top: 14px; border-top: 1px solid var(--ml-border-subtle); }
.operational-alert-recipients {
  display: grid;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--ml-border-subtle);
}
.operational-alert-recipient-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 38px;
}
.operational-alert-recipient {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  min-height: 36px;
  padding: 4px 6px 4px 11px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: 999px;
  background: var(--ml-bg-surface-muted);
  color: var(--ml-text);
}
.operational-alert-recipient span { overflow-wrap: anywhere; }
.operational-alert-recipient button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.operational-alert-recipient-add {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
}
.product-package-list { display: grid; gap: 10px; }
.package-row {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.package-row > div:first-child { min-width: 0; display: grid; gap: 3px; }
.package-row strong, .package-row span { overflow-wrap: anywhere; }
.package-row span { color: var(--ml-text-muted); font-size: 12px; font-weight: 720; }
.store-entry-qr-layout { display: grid; grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); gap: 18px; align-items: start; }
.store-entry-qr-code { display: grid; place-items: center; padding: 14px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: #fff; aspect-ratio: 1; }
.store-entry-qr-code svg { width: 100%; max-width: 220px; height: auto; display: block; }
.store-entry-qr-actions { display: grid; gap: 12px; min-width: 0; }
.user-identity-card .section-row { align-items: center; }
.barcode-panel {
  display: grid;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--ml-border-subtle);
}
.barcode-representation-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 12px;
}
.barcode-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-surface);
}
.barcode-card-head { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
.barcode-card-head strong { display: block; }
.barcode-card-head small { display: block; color: var(--ml-text-muted); margin-top: 2px; }
.barcode-preview-frame {
  width: min(100%, 560px);
  padding: 18px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: #fff;
  display: grid;
  place-items: center;
}
.barcode-preview-frame svg {
  width: 100%;
  max-width: 520px;
  height: auto;
  display: block;
}
.barcode-human-readable {
  color: var(--ml-text-primary);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 15px;
  font-weight: 820;
  letter-spacing: 1px;
}
.barcode-actions { justify-content: flex-start; }
.barcode-panel.empty { color: var(--ml-text-muted); }

.public-shell { min-height: 100vh; display: flex; flex-direction: column; }
.public-header, .app-topbar {
  min-height: var(--ml-nav-h);
  display: grid;
  grid-template-columns: minmax(180px, auto) minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 0 clamp(16px, 4vw, 44px);
  border-bottom: 1px solid var(--ml-border-subtle);
  background: color-mix(in srgb, var(--ml-bg-surface) 92%, transparent);
  backdrop-filter: blur(16px);
  position: sticky;
  top: 0;
  z-index: 40;
}
.public-header { grid-template-columns: minmax(140px, auto) minmax(0, 1fr) auto auto; }
.public-nav { justify-content: center; }
.public-nav a, .side-link, .tab-link { text-decoration: none; color: var(--ml-text-secondary); font-weight: 720; }
.public-nav a { min-height: 38px; display: inline-flex; align-items: center; padding: 0 11px; border-radius: var(--ml-radius-md); }
.public-nav a:hover, .public-nav a.active { background: var(--ml-primary-soft); color: var(--ml-text-primary); }
.public-more { position: relative; }
.public-more summary {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  padding: 0 11px;
  border-radius: var(--ml-radius-md);
  color: var(--ml-text-secondary);
  font-weight: 720;
  cursor: pointer;
  list-style: none;
}
.public-more summary::-webkit-details-marker { display: none; }
.public-more summary:hover { background: var(--ml-primary-soft); color: var(--ml-text-primary); }
.public-more div {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 230px;
  padding: 8px;
  border: 1px solid var(--ml-border-default);
  border-radius: var(--ml-radius-md);
  display: grid;
  gap: 4px;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-md);
  z-index: 80;
}
.public-menu-button { display: none; white-space: nowrap; }
.public-drawer {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.public-drawer[hidden] { display: none; }
.public-drawer-backdrop { position: absolute; inset: 0; background: rgb(8 17 29 / 46%); }
.public-drawer-panel {
  position: relative;
  justify-self: end;
  width: min(88vw, 340px);
  min-height: 100%;
  padding: 16px;
  border-left: 1px solid var(--ml-border-default);
  display: grid;
  align-content: start;
  gap: 6px;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-md);
}
.drawer-head { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.public-drawer-panel a {
  min-height: 44px;
  padding: 0 12px;
  border-radius: var(--ml-radius-md);
  display: flex;
  align-items: center;
  color: var(--ml-text-secondary);
  font-weight: 760;
  text-decoration: none;
}
.public-drawer-panel a:hover, .public-drawer-panel a.active { color: var(--ml-text-primary); background: var(--ml-primary-soft); }
.public-drawer-panel hr { width: 100%; border: 0; border-top: 1px solid var(--ml-border-subtle); margin: 8px 0; }
.drawer-language-control { padding: 6px 0 10px; }
.drawer-language-control .ml-language-control { width: 100%; }
.public-footer { margin-top: auto; padding: 24px clamp(16px, 5vw, 72px); color: var(--ml-text-muted); border-top: 1px solid var(--ml-border-subtle); }

.hero { min-height: calc(100vh - var(--ml-nav-h)); display: grid; align-items: center; padding: clamp(42px, 8vw, 96px) clamp(16px, 5vw, 72px); }
.hero-inner { max-width: 1120px; }
.eyebrow, .section-label { color: var(--ml-primary); font-size: 12px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.hero h1 { max-width: 820px; font-size: clamp(44px, 7vw, 82px); letter-spacing: -.01em; }
.hero p { max-width: 690px; margin: 18px 0 24px; color: var(--ml-text-secondary); font-size: clamp(17px, 2vw, 21px); }
.hero-panel, .grid { display: grid; gap: 14px; }
.hero-panel { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1040px; margin-top: 32px; }
.grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.section { padding: 56px clamp(16px, 5vw, 72px); }
.section-head { max-width: 760px; margin-bottom: 24px; }
.section-head h2 { margin-top: 6px; font-size: clamp(28px, 4vw, 44px); }
.public-back-row { margin-top: var(--space-5); }

.metric, .card, .panel, .kpi, .store-health {
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-lg);
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-sm);
}
.metric { min-height: 98px; padding: 16px; }
.metric strong { display: block; margin: 5px 0; font-size: 28px; font-weight: 830; font-variant-numeric: tabular-nums; }
.metric span, .card p, .hint { color: var(--ml-text-muted); }
.card { padding: 18px; min-width: 0; }
.card h3 { margin-bottom: 8px; }

.auth-page { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: var(--space-6); }
.business-login-card { width: min(1040px, 100%); display: grid; grid-template-columns: .9fr 1fr; border: 1px solid var(--ml-border-subtle); border-radius: 18px; overflow: hidden; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.auth-brand-panel { padding: clamp(28px, 5vw, 56px); background: linear-gradient(150deg, var(--ml-bg-muted), var(--ml-bg-surface)); border-right: 1px solid var(--ml-border-subtle); display: grid; align-content: space-between; gap: 48px; }
.auth-form-panel { padding: clamp(28px, 5vw, 52px); }
.auth-form-panel h1, .consumer-auth-card h1 { margin: 16px 0 8px; }
.demo-panel { margin-top: 20px; padding: 14px; border: 1px dashed var(--ml-border-default); border-radius: var(--ml-radius-lg); background: var(--ml-bg-elevated); }
.demo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.demo-option { min-height: 42px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); text-align: left; padding: 8px 10px; }
.demo-option[aria-pressed="true"] { border-color: var(--ml-primary); background: var(--ml-primary-soft); }
.auth-error { margin: 12px 0; padding: 12px; border-radius: var(--ml-radius-md); background: color-mix(in srgb, var(--ml-danger) 10%, var(--ml-bg-surface)); color: var(--ml-danger); }
.auth-back-link { display: inline-flex; align-items: center; gap: 8px; width: max-content; max-width: 100%; margin-bottom: 8px; font-weight: 800; color: var(--ml-primary); text-decoration: none; }
.auth-back-link svg { width: 18px; height: 18px; transform: rotate(180deg); }
.auth-link-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 12px 0; }
.auth-link-grid a, .auth-escape-row a { min-height: 38px; display: inline-flex; align-items: center; color: var(--ml-primary); font-weight: 800; overflow-wrap: anywhere; }
.auth-entry-panel { margin: 14px 0; padding: 14px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-muted); display: grid; gap: 8px; }
.auth-escape-row { margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--ml-border-subtle); display: flex; gap: 12px; flex-wrap: wrap; }
.consumer-auth-card { width: min(430px, 100%); padding: 28px; border: 1px solid var(--ml-border-subtle); border-radius: 18px; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.auth-workspace-card { width: min(860px, 100%); }
.auth-step-card { width: min(680px, 100%); }
.consumer-login-card {
  width: min(430px, 100%);
  padding: clamp(var(--space-5), 6vw, var(--space-8));
  border-radius: 24px;
  display: grid;
  gap: var(--space-5);
}
.consumer-login-brand { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.consumer-login-copy { display: grid; gap: var(--space-3); }
.consumer-login-card h1 { margin: 0; font-size: clamp(34px, 9vw, 44px); }
.consumer-login-card p { max-width: 31rem; }
.bankid-mark { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; background: var(--ml-primary-soft); color: var(--ml-primary); }
.bankid-cta {
  width: 100%;
  min-height: 54px;
  border-radius: 16px;
  justify-content: center;
  font-size: 16px;
}
.identity-link { color: var(--ml-primary); font-weight: 820; text-decoration: none; text-align: center; }
.consumer-login-links { display: flex; align-items: center; justify-content: center; gap: var(--space-2); color: var(--ml-text-muted); font-weight: 720; }
.consumer-login-links a { text-decoration: none; }
.login-language-group {
  display: grid;
  gap: var(--space-3);
  justify-items: center;
  padding-top: var(--space-4);
  border-top: 1px solid var(--ml-border-subtle);
}
.login-language-group > span { color: var(--ml-text-muted); font-size: 13px; font-weight: 780; }
.auth-language-inline { justify-items: start; margin: 14px 0; padding-top: 14px; }
.ml-dropdown,
.ml-language-control { position: relative; width: min(100%, 320px); overflow: visible; }
.ml-dropdown-trigger,
.ml-language-button {
  min-height: 48px;
  width: 100%;
  padding: 7px 12px 7px 10px;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-control-radius);
  background: var(--ml-control-bg);
  color: var(--ml-control-text);
  box-shadow: var(--ml-shadow-sm);
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 830;
  text-align: left;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease;
}
.ml-dropdown-trigger:hover,
.ml-language-button:hover { border-color: var(--ml-interactive-border-hover); background: var(--ml-interactive-hover-surface); }
.ml-dropdown-trigger:focus-visible,
.ml-language-button:focus-visible { outline: 0; border-color: var(--ml-border-focus); box-shadow: var(--ml-focus); }
.ml-dropdown.disabled,
.ml-language-control.disabled { opacity: .68; }
.ml-dropdown-trigger:disabled,
.ml-language-button:disabled { cursor: not-allowed; }
.ml-dropdown-form { width: 100%; }
.ml-language-compact, .ml-language-topbar { width: min(100%, 260px); }
.ml-dropdown-chevron,
.ml-dropdown-chevron svg,
.ml-language-button svg { width: 17px; height: 17px; transition: transform .16s ease; }
.ml-dropdown-chevron { flex: 0 0 auto; display: inline-grid; place-items: center; margin-left: auto; color: var(--ml-text-muted); }
.ml-dropdown.open .ml-dropdown-chevron svg { transform: rotate(180deg); }
.ml-language-flag {
  width: 27px;
  height: 18px;
  object-fit: cover;
  border-radius: 4px;
  box-shadow: 0 0 0 1px rgb(0 0 0 / 14%);
  flex: 0 0 auto;
}
.ml-language-button-text,
.ml-language-option-text,
.ml-dropdown-trigger-text,
.ml-dropdown-option-text {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  gap: 1px;
  text-align: left;
}
.ml-language-button-text strong,
.ml-language-option-text strong,
.ml-dropdown-trigger-text strong,
.ml-dropdown-option-text strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ml-language-button-text small,
.ml-language-option-text small,
.ml-language-status,
.ml-dropdown-status {
  color: var(--ml-text-muted);
  font-size: 11px;
  line-height: 1.1;
}
.ml-dropdown-panel,
.ml-language-popover {
  position: absolute;
  z-index: 90;
  top: calc(100% + 9px);
  left: 0;
  right: auto;
  width: max(100%, min(320px, calc(100vw - 28px)));
  min-width: min(240px, calc(100vw - 28px));
  max-width: calc(100vw - 28px);
  padding: 8px;
  border: var(--ml-border-width) solid var(--ml-dropdown-border);
  border-radius: var(--ml-dropdown-radius);
  background: var(--ml-dropdown-bg);
  box-shadow: var(--ml-dropdown-shadow);
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--ml-primary) 48%, transparent) transparent;
}
.ml-dropdown-panel[data-ml-dropdown-portal] {
  top: auto;
  left: auto;
  right: auto;
  width: auto;
}
.ml-dropdown-panel::-webkit-scrollbar,
.ml-language-popover::-webkit-scrollbar { width: 10px; }
.ml-dropdown-panel::-webkit-scrollbar-track,
.ml-language-popover::-webkit-scrollbar-track { background: transparent; }
.ml-dropdown-panel::-webkit-scrollbar-thumb,
.ml-language-popover::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ml-primary) 44%, transparent);
  background-clip: padding-box;
}
.ml-dropdown-option,
.ml-language-option {
  min-height: 45px;
  width: 100%;
  padding: 9px 10px;
  border: 0;
  border-radius: var(--ml-dropdown-option-radius);
  background: transparent;
  color: var(--ml-text-primary);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  text-align: left;
  cursor: pointer;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.ml-dropdown-option .ml-dropdown-option-text,
.ml-language-option .ml-language-option-text { min-width: 0; }
.ml-dropdown-option small,
.ml-language-option small { color: var(--ml-text-muted); font-size: 12px; }
.ml-dropdown-check { width: 17px; height: 17px; display: inline-grid; place-items: center; color: var(--ml-success); justify-self: end; }
.ml-dropdown-check svg,
.ml-language-option svg { width: 17px; height: 17px; color: var(--ml-success); justify-self: end; }
.ml-dropdown-option:disabled,
.ml-language-option:disabled { cursor: not-allowed; opacity: .58; }
.ml-dropdown-option:hover,
.ml-dropdown-option:focus-visible,
.ml-dropdown-option[aria-selected="true"],
.ml-language-option:hover,
.ml-language-option:focus-visible,
.ml-language-option[aria-selected="true"] {
  background: var(--ml-dropdown-option-bg-hover);
  color: var(--ml-primary);
  outline: 0;
}
.ml-dropdown-search,
.ml-language-search {
  width: 100%;
  min-height: 38px;
  margin-bottom: 6px;
  padding: 7px 10px;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-control-radius);
  background: var(--ml-control-bg);
  color: var(--ml-text-primary);
  font: inherit;
  outline: 0;
}
.ml-dropdown-search:focus,
.ml-language-search:focus { border-color: var(--ml-border-focus); box-shadow: var(--ml-focus); }
.ml-dropdown-empty,
.ml-language-empty { margin: 4px 2px; padding: 8px 10px; border-radius: 10px; color: var(--ml-text-muted); background: var(--ml-bg-elevated); font-size: 12px; font-weight: 760; }
.ml-selector-icon { width: 28px; height: 28px; display: inline-grid; place-items: center; border-radius: 9px; background: var(--ml-primary-soft); color: var(--ml-primary); }
.ml-selector-icon svg { width: 16px; height: 16px; }
.ml-time-picker { position: relative; min-width: 0; }
.ml-time-field {
  min-height: 42px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  overflow: hidden;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-control-radius);
  background: var(--ml-control-bg);
  box-shadow: var(--ml-control-shadow);
  color: var(--ml-text-primary);
  cursor: text;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.ml-time-field:hover {
  border-color: var(--ml-interactive-border-hover);
  background: var(--ml-interactive-hover-surface);
}
.ml-time-field:focus-within {
  border-color: var(--ml-border-focus);
  box-shadow: var(--ml-focus);
}
.ml-time-field:has([data-ml-time-input]:invalid) {
  border-color: var(--ml-control-invalid-border);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ml-danger) 14%, transparent);
}
.ml-time-field:has([data-ml-time-input]:disabled) {
  cursor: not-allowed;
  opacity: .62;
  background: color-mix(in srgb, var(--ml-control-bg) 72%, var(--ml-bg-muted));
}
.ml-time-field [data-ml-time-input] {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 8px 6px 8px 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--ml-text-primary);
  font: inherit;
  font-size: 14px;
  font-weight: 840;
  font-variant-numeric: tabular-nums;
  outline: 0;
}
.ml-time-field [data-ml-time-input]::placeholder { color: var(--ml-text-muted); font-weight: 760; }
.ml-time-field [data-ml-time-input]:disabled {
  color: var(--ml-text-muted);
  cursor: not-allowed;
}
.ml-time-panel {
  position: absolute;
  z-index: calc(var(--ml-modal-z, 100) + 90);
  top: calc(100% + 7px);
  right: 0;
  width: min(310px, calc(100vw - 32px));
  max-height: min(360px, calc(100dvh - 120px));
  overflow: auto;
  padding: 10px;
  border: var(--ml-border-width) solid var(--ml-dropdown-border);
  border-radius: var(--ml-dropdown-radius);
  background: var(--ml-dropdown-bg);
  box-shadow: var(--ml-dropdown-shadow);
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--ml-primary) 38%, var(--ml-border-default)) transparent;
}
.ml-time-panel::-webkit-scrollbar { width: 10px; height: 10px; }
.ml-time-panel::-webkit-scrollbar-track { background: transparent; }
.ml-time-panel::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ml-primary) 38%, var(--ml-border-default));
  background-clip: padding-box;
}
.ml-time-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 2px 2px 10px;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.ml-time-panel-head strong {
  color: var(--ml-text-primary);
  font-size: 13px;
  font-weight: 850;
}
.ml-time-panel-head span {
  min-width: 58px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--ml-border-subtle);
  border-radius: 10px;
  background: var(--ml-bg-elevated);
  color: var(--ml-primary);
  font-size: 14px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.ml-time-picker-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .85fr);
  gap: 10px;
  padding-top: 10px;
}
.ml-time-column {
  min-width: 0;
  display: grid;
  gap: 7px;
}
.ml-time-column > span,
.ml-time-exact span {
  color: var(--ml-text-muted);
  font-size: 11px;
  font-weight: 860;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.ml-time-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.ml-time-minute-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ml-time-grid button {
  min-height: 34px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: 8px;
  background: var(--ml-bg-elevated);
  color: var(--ml-text-secondary);
  font: inherit;
  font-size: 12px;
  font-weight: 830;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease;
}
.ml-time-grid button:hover,
.ml-time-grid button:focus-visible,
.ml-time-grid button.active { border-color: color-mix(in srgb, var(--ml-primary) 45%, var(--ml-border-default)); background: var(--ml-primary-soft); color: var(--ml-primary); outline: 0; }
.ml-time-exact {
  display: grid;
  gap: 5px;
  margin-top: 2px;
}
.ml-time-exact input {
  min-height: 36px;
  padding: 7px 9px;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-control-radius);
  background: var(--ml-control-bg);
  color: var(--ml-text-primary);
  font: inherit;
  font-weight: 840;
  font-variant-numeric: tabular-nums;
  outline: 0;
}
.ml-time-exact input:focus {
  border-color: var(--ml-border-focus);
  box-shadow: var(--ml-focus);
}
.ml-time-panel-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--ml-border-subtle);
}
.ml-date-picker { position: relative; min-width: 0; }
.ml-date-native {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  overflow: hidden;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-control-radius);
  background: var(--ml-control-bg);
  box-shadow: var(--ml-control-shadow);
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.ml-date-native:hover,
.ml-date-native:focus-within {
  border-color: var(--ml-border-focus);
  background: var(--ml-interactive-hover-surface);
  box-shadow: var(--ml-focus);
}
.ml-date-native input[type="datetime-local"] {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 8px 10px 8px 12px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ml-text-primary);
  font: inherit;
  font-size: 14px;
  font-weight: 840;
  font-variant-numeric: tabular-nums;
}
.ml-date-native input[type="datetime-local"]:disabled {
  cursor: not-allowed;
  opacity: .62;
}
.ml-date-trigger {
  width: 100%;
  min-height: 42px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  align-items: center;
  overflow: hidden;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-control-radius);
  background: var(--ml-control-bg);
  box-shadow: var(--ml-control-shadow);
  color: var(--ml-text-primary);
  font: inherit;
  font-size: 14px;
  font-weight: 840;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.ml-date-trigger:hover,
.ml-date-trigger:focus-visible {
  border-color: var(--ml-interactive-border-hover);
  background: var(--ml-interactive-hover-surface);
  outline: 0;
}
.ml-date-trigger[aria-expanded="true"],
.ml-date-trigger:focus-visible {
  border-color: var(--ml-border-focus);
  box-shadow: var(--ml-focus);
}
.ml-date-trigger:disabled {
  cursor: not-allowed;
  opacity: .62;
  background: color-mix(in srgb, var(--ml-control-bg) 72%, var(--ml-bg-muted));
}
.ml-date-trigger [data-ml-date-label] {
  min-width: 0;
  overflow: hidden;
  padding: 8px 6px 8px 12px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ml-date-icon {
  width: 40px;
  min-height: 40px;
  display: inline-grid;
  place-items: center;
  color: var(--ml-text-muted);
}
.ml-date-icon svg { width: 17px; height: 17px; }
.ml-date-panel {
  position: absolute;
  z-index: calc(var(--ml-modal-z, 100) + 85);
  top: calc(100% + 7px);
  right: 0;
  width: min(340px, calc(100vw - 32px));
  max-height: min(520px, calc(100dvh - 90px));
  overflow: auto;
  padding: 10px;
  border: var(--ml-border-width) solid var(--ml-dropdown-border);
  border-radius: var(--ml-dropdown-radius);
  background: var(--ml-dropdown-bg);
  box-shadow: var(--ml-dropdown-shadow);
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--ml-primary) 38%, var(--ml-border-default)) transparent;
}
.ml-date-panel::-webkit-scrollbar { width: 10px; height: 10px; }
.ml-date-panel::-webkit-scrollbar-track { background: transparent; }
.ml-date-panel::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ml-primary) 38%, var(--ml-border-default));
  background-clip: padding-box;
}
.ml-date-calendar-head {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 8px;
  margin-bottom: 9px;
}
.ml-date-calendar-head strong {
  text-align: center;
  font-size: 13px;
  font-weight: 860;
  color: var(--ml-text-primary);
}
.ml-date-calendar-head button,
.ml-date-days button {
  border: 1px solid var(--ml-border-subtle);
  border-radius: 9px;
  background: var(--ml-bg-elevated);
  color: var(--ml-text-secondary);
  font: inherit;
  font-weight: 820;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}
.ml-date-calendar-head button {
  width: 36px;
  height: 34px;
  display: inline-grid;
  place-items: center;
}
.ml-date-calendar-head button:first-child svg { transform: rotate(90deg); }
.ml-date-calendar-head button:last-child svg { transform: rotate(-90deg); }
.ml-date-weekdays,
.ml-date-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}
.ml-date-weekdays span {
  color: var(--ml-text-muted);
  text-align: center;
  font-size: 11px;
  font-weight: 850;
}
.ml-date-days button {
  min-height: 34px;
  padding: 0;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.ml-date-days button.outside { opacity: .46; }
.ml-date-calendar-head button:hover,
.ml-date-calendar-head button:focus-visible,
.ml-date-days button:hover,
.ml-date-days button:focus-visible,
.ml-date-days button.active {
  border-color: color-mix(in srgb, var(--ml-primary) 45%, var(--ml-border-default));
  background: var(--ml-primary-soft);
  color: var(--ml-primary);
  outline: 0;
  transform: translateY(-1px);
}
.ml-date-time-row {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--ml-border-subtle);
}
.ml-date-panel-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--ml-border-subtle);
}
.ml-multiselect-control { width: min(100%, 360px); }
.ml-multiselect-popover {
  display: grid;
  gap: 4px;
  max-height: min(360px, calc(100vh - 180px));
  overflow: auto;
}
.ml-multiselect-panel-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding-bottom: 6px;
}
.ml-multiselect-panel-actions button {
  min-height: 34px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-dropdown-option-radius);
  background: var(--ml-bg-elevated);
  color: var(--ml-text-secondary);
  font: inherit;
  font-size: 12px;
  font-weight: 830;
}
.ml-multiselect-panel-actions button:hover,
.ml-multiselect-panel-actions button:focus-visible {
  border-color: var(--ml-interactive-border-hover);
  background: var(--ml-interactive-hover-surface);
  color: var(--ml-primary);
  outline: 0;
}
.ml-multiselect-option .ml-multiselect-check {
  width: 17px;
  height: 17px;
  display: inline-grid;
  place-items: center;
  justify-self: end;
}
.ml-multiselect-option[aria-selected="true"] .ml-language-option-text strong { color: var(--ml-primary); }
.segmented-control {
  padding: var(--space-1);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-1);
  background: var(--ml-bg-muted);
}
.segmented-control button {
  min-height: 40px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--ml-text-secondary);
  font-weight: 820;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
}
.segmented-control button:hover,
.segmented-control button:focus-visible { background: var(--ml-bg-surface); }
.segmented-control button.active,
.segmented-control button[aria-pressed="true"] {
  border: 1px solid color-mix(in srgb, var(--ml-primary) 42%, var(--ml-border-subtle));
  background: var(--ml-bg-surface);
  color: var(--ml-primary);
  box-shadow: var(--ml-shadow-sm);
}
.segmented-control button strong {
  width: 16px;
  height: 16px;
  display: inline-grid;
  place-items: center;
}
.mfa-card {
  width: min(440px, 100%);
  padding: clamp(var(--space-5), 6vw, var(--space-8));
  border-radius: 24px;
  display: grid;
  gap: var(--space-5);
}
.mfa-brand { justify-self: start; }
.mfa-security-pill {
  width: fit-content;
  max-width: 100%;
  min-height: 34px;
  padding: var(--space-2) var(--space-4);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  background: var(--ml-primary-soft);
  color: var(--ml-primary);
  font-size: 13px;
  font-weight: 820;
}
.mfa-copy { display: grid; gap: var(--space-3); }
.mfa-copy h1 { margin: 0; font-size: clamp(32px, 8vw, 42px); }
.mfa-form { display: grid; gap: var(--space-4); }
.otp-fieldset { margin: 0; padding: 0; border: 0; }
.otp-hidden-input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: .01;
  pointer-events: none;
}
.otp-cells {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--space-2);
}
.otp-cell {
  width: 100%;
  padding: 0;
  aspect-ratio: 1;
  min-height: 46px;
  border: 1px solid var(--ml-border-default);
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: var(--ml-bg-elevated);
  color: var(--ml-text-primary);
  font-size: 22px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  text-align: center;
}
.otp-cell.active { border-color: var(--ml-primary); box-shadow: var(--ml-focus); }
.otp-cell:focus-visible { border-color: var(--ml-primary); box-shadow: var(--ml-focus); }
.otp-cell.filled { background: var(--ml-bg-surface); }
.mfa-error { margin: 0; }
.mfa-submit {
  width: 100%;
  min-height: 52px;
  border-radius: 16px;
  justify-content: center;
}
.mfa-submit[disabled] { opacity: .72; cursor: progress; }
.mfa-help {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
  padding-top: var(--space-3);
  border-top: 1px solid var(--ml-border-subtle);
}
.mfa-help button {
  min-height: 38px;
  border: 0;
  background: transparent;
  color: var(--ml-primary);
  font-weight: 820;
  text-align: left;
}
.password-input-wrap { position: relative; display: flex; align-items: center; }
.password-input-wrap input { padding-right: 52px; }
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear { display: none; }
input[type="password"]::-webkit-credentials-auto-fill-button {
  visibility: hidden;
  display: none !important;
  pointer-events: none;
}
.password-visibility {
  position: absolute;
  right: 4px;
  width: 38px;
  height: 38px;
  min-height: 38px;
  border-color: transparent;
  background: transparent;
  color: var(--ml-text-muted);
}
.password-feedback { display: grid; gap: 10px; margin: 4px 0 16px; color: var(--ml-text-secondary); }
.password-strength-head { display: flex; justify-content: space-between; gap: 12px; font-weight: 780; }
.password-rules { display: grid; gap: 7px; padding: 12px; border-radius: var(--ml-radius-md); background: var(--ml-bg-muted); color: var(--ml-text-secondary); }
.rule { display: flex; align-items: center; gap: 8px; }
.rule-icon { width: 18px; height: 18px; display: inline-grid; place-items: center; color: var(--ml-success); border: 1px solid var(--ml-border-default); border-radius: 50%; }
.rule.ok .rule-icon { border-color: transparent; }
.rule.ok { color: var(--ml-success); }
.strength-meter { height: 8px; border-radius: 999px; background: var(--ml-bg-muted); overflow: hidden; }
.strength-meter span { display: block; height: 100%; width: 0; background: var(--ml-success); transition: width .12s ease, background .12s ease; }
.strength-meter span[data-level="empty"] { background: transparent; }
.strength-meter span[data-level="weak"] { background: var(--ml-danger); }
.strength-meter span[data-level="fair"] { background: var(--ml-warning); }
.strength-meter span[data-level="good"] { background: var(--ml-info); }
.btn[disabled] { opacity: .58; cursor: not-allowed; box-shadow: none; }
.qr-demo { width: 148px; height: 148px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; padding: 12px; border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); border: 1px solid var(--ml-border-default); }
.qr-demo i { background: var(--ml-text-primary); border-radius: 3px; }
.recovery-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.mfa-enroll-card {
  width: min(560px, 100%);
  min-width: 0;
  padding: clamp(24px, 5vw, 42px);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 18px;
  display: grid;
  gap: 20px;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-md);
}
.mfa-enroll-card * { min-width: 0; }
.mfa-step-head { display: grid; gap: 8px; }
.mfa-step-track { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 2px 0; padding: 0; list-style: none; }
.mfa-step-track li { position: relative; display: grid; place-items: center; min-height: 34px; color: var(--ml-text-muted); }
.mfa-step-track li::before,
.mfa-step-track li::after {
  content: "";
  position: absolute;
  top: 16px;
  width: 50%;
  height: 3px;
  background: var(--ml-bg-muted);
}
.mfa-step-track li::before { left: 0; }
.mfa-step-track li::after { right: 0; }
.mfa-step-track li:first-child::before,
.mfa-step-track li:last-child::after { display: none; }
.mfa-step-track li.active::before,
.mfa-step-track li.active::after { background: var(--ml-primary); }
.mfa-step-track li span {
  position: relative;
  z-index: 1;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--ml-border-default);
  border-radius: 50%;
  background: var(--ml-bg-surface);
  font-weight: 860;
}
.mfa-step-track li.active span { border-color: var(--ml-primary); background: var(--ml-primary); color: #fff; }
.mfa-step-track li.current span { box-shadow: 0 0 0 4px color-mix(in srgb, var(--ml-primary) 18%, transparent); }
.mfa-setup-step { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.mfa-setup-step > * { max-width: 100%; min-width: 0; }
.mfa-setup-step .btn { max-width: 100%; white-space: normal; }
.mfa-setup-step h2 { font-size: 22px; }
.authenticator-qr { display: grid; place-items: center; justify-self: center; width: max-content; max-width: 100%; margin: 0; padding: 16px; border-radius: var(--ml-radius-lg); background: #fff; border: 1px solid var(--ml-border-default); box-shadow: var(--ml-shadow-sm); aspect-ratio: 1; }
.authenticator-qr img { width: clamp(190px, 50vw, 232px); height: auto; aspect-ratio: 1; display: block; image-rendering: pixelated; object-fit: contain; }
.setup-key-panel, .setup-key { display: grid; gap: 10px; }
.setup-key { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-lg); background: var(--ml-bg-muted); }
.setup-key-main { display: grid; gap: 6px; }
.setup-key-meta { display: grid; gap: 6px; margin: 0; }
.setup-key-meta div { display: flex; justify-content: space-between; gap: 12px; }
.setup-key-meta dt { color: var(--ml-text-muted); font-weight: 760; }
.setup-key-meta dd { margin: 0; color: var(--ml-text-primary); overflow-wrap: anywhere; }
.setup-key code, .recovery-codes code {
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
  overflow-wrap: anywhere;
}
.recovery-codes.clean { padding: 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-muted); }
.recovery-warning { margin: 0; padding: 12px; border-left: 4px solid var(--ml-warning); border-radius: var(--ml-radius-sm); background: color-mix(in srgb, var(--ml-warning) 13%, var(--ml-bg-surface)); color: var(--ml-text-secondary); font-weight: 730; }
.ack-check { display: flex; align-items: center; gap: 10px; font-weight: 760; color: var(--ml-text-secondary); }
.button-row.end { justify-content: flex-end; }
.terms-language { position: relative; z-index: 2; }
.terms-language .ml-language-control { width: min(260px, 100%); }
.terms-document { max-height: 330px; overflow: auto; padding: 18px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-lg); background: var(--ml-bg-elevated); }
.terms-document h2 { margin-top: 0; font-size: 24px; }
.workspace-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin-top: 24px; }
.workspace-card { min-height: 176px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); padding: 18px; text-align: left; display: grid; align-content: space-between; }
.workspace-card:hover { border-color: var(--ml-primary); box-shadow: var(--ml-shadow-sm); }
.onboarding-page { place-items: start center; }
.onboarding-entry-card { width: min(620px, 100%); }
.onboarding-shell {
  width: min(1120px, 100%);
  display: grid;
  gap: 18px;
  padding: clamp(18px, 4vw, 32px);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 18px;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-md);
}
.onboarding-header, .onboarding-hero, .onboarding-invitation-summary, .section-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.onboarding-hero h1 { margin: 4px 0 8px; font-size: clamp(32px, 6vw, 48px); }
.lifecycle-strip { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.lifecycle-strip > span:not(.status) { color: var(--ml-text-muted); font-weight: 780; }
.onboarding-invitation-summary {
  padding: 12px 14px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-muted);
}
.wizard-progress { height: 9px; border-radius: 999px; background: var(--ml-bg-muted); overflow: hidden; }
.wizard-progress span { display: block; height: 100%; border-radius: inherit; background: var(--ml-primary); }
.wizard-steps { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.wizard-steps button {
  width: 100%;
  min-height: 74px;
  padding: 8px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  border: 1px solid var(--ml-border-default);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-surface);
  color: var(--ml-text-secondary);
  font: inherit;
  font-weight: 780;
  text-align: center;
}
.wizard-steps span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--ml-bg-muted); color: var(--ml-text-primary); }
.wizard-steps .current button, .wizard-steps .done button { border-color: var(--ml-primary); color: var(--ml-text-primary); }
.wizard-steps .current span, .wizard-steps .done span { background: var(--ml-primary); color: #fff; }
.onboarding-card, .store-form-block, .review-block {
  padding: 18px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-lg);
  background: var(--ml-bg-elevated);
  display: grid;
  gap: 12px;
}
.onboarding-card h2, .review-block h3 { margin: 0; }
.store-form-list { display: grid; gap: 14px; }
.onboarding-actions { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.error-summary {
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--ml-danger) 44%, var(--ml-border-default));
  border-radius: var(--ml-radius-md);
  background: color-mix(in srgb, var(--ml-danger) 9%, var(--ml-bg-surface));
}
.error-summary h2 { margin: 0 0 8px; font-size: 18px; }
.error-summary button { border: 0; background: transparent; color: var(--ml-danger); font: inherit; font-weight: 800; text-align: left; }
.field-error {
  margin: 8px 0 0;
  color: var(--ml-danger);
  font-size: 13px;
  font-weight: 780;
}
.pricing-modal-error {
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--ml-danger) 42%, var(--ml-border-default));
  border-radius: var(--ml-radius-md);
  background: color-mix(in srgb, var(--ml-danger) 8%, var(--ml-bg-surface));
}
.requested-changes { border-color: color-mix(in srgb, var(--ml-warning) 45%, var(--ml-border-default)); background: color-mix(in srgb, var(--ml-warning) 11%, var(--ml-bg-surface)); color: var(--ml-text-primary); }
.review-grid, .platform-onboarding-grid, .review-status-grid { display: grid; gap: 14px; }
.review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.platform-onboarding-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.review-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 14px 0; }
.review-status-grid div { display: grid; gap: 6px; align-content: start; padding: 9px 0; border-bottom: 1px solid var(--ml-border-subtle); }
.review-status-grid strong, .review-status-grid .status { justify-self: start; min-width: 0; overflow-wrap: anywhere; }
.invitation-preview div, .timeline-list div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--ml-border-subtle); }
.review-status-grid span, .invitation-preview span, .timeline-list span { color: var(--ml-text-muted); font-weight: 780; }
.detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 10px 0 2px;
}
.detail-grid__item {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 5px;
  padding: 10px 0;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.detail-grid__item span {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 800;
}
.detail-grid__item strong {
  min-width: 0;
  display: flex;
  align-items: center;
  color: var(--ml-text-primary);
  font-size: 14px;
  font-weight: 840;
  overflow-wrap: anywhere;
}
.detail-grid__item small {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
}
.invitation-preview { display: grid; gap: 2px; margin-top: 14px; }
.timeline-card { padding: 0; }
.timeline-list { padding: 12px 18px 18px; display: grid; }
.document-template-panel { margin-top: 16px; }
.document-preview-frame {
  width: 100%;
  min-height: min(74dvh, 920px);
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: white;
}

.workspace { min-height: 100vh; display: grid; grid-template-rows: auto 1fr; }
.app-topbar { grid-template-columns: auto auto minmax(120px, .52fr) minmax(0, 1fr) max-content; padding: 0 18px; }
.app-topbar [data-mobile-menu] { display: none; }
.context-title strong { display: block; }
.context-title span { color: var(--ml-text-muted); font-size: 13px; }
.global-search { position: relative; min-width: 0; min-height: 42px; display: flex; align-items: center; gap: 8px; max-width: 520px; border: 1px solid var(--ml-border-default); border-radius: 999px; background: var(--ml-bg-surface); padding: 0 12px 0 14px; color: var(--ml-text-muted); }
.global-search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ml-text-primary); }
.global-search:focus-within { border-color: var(--ml-primary); box-shadow: 0 0 0 3px var(--ml-primary-soft); }
.global-search-clear,
.sidebar-search-clear { display: none; width: 24px; height: 24px; border: 0; border-radius: 50%; background: transparent; color: var(--ml-text-muted); place-items: center; }
.global-search-clear:hover,
.sidebar-search-clear:hover { background: var(--ml-bg-muted); color: var(--ml-text-primary); }
.global-search.open .global-search-clear,
.sidebar-search-clear.visible { display: inline-grid; }
.global-search-panel { position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 90; display: none; max-height: min(460px, 70vh); overflow: auto; padding: 8px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.global-search.open .global-search-panel { display: grid; gap: 8px; }
.global-search-group h4 { margin: 4px 8px 6px; color: var(--ml-text-muted); font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.global-search-result { width: 100%; min-height: 48px; display: grid; gap: 2px; align-content: center; border: 0; border-radius: var(--ml-radius-md); background: transparent; padding: 8px 10px; text-align: left; color: var(--ml-text-primary); }
.global-search-result:hover,
.global-search-result:focus-visible { background: var(--ml-primary-soft); outline: 0; }
.global-search-result small,
.global-search-empty { color: var(--ml-text-muted); font-size: 12px; }
.global-search-empty { padding: 12px; }
.app-topbar .topbar-actions { min-width: max-content; }
.app-topbar .ml-language-topbar { width: clamp(210px, 15vw, 242px); flex: 0 0 auto; }
.nav-icon { position: relative; }
.badge-dot { position: absolute; right: 8px; top: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--ml-danger); border: 2px solid var(--ml-bg-surface); }
.operations-notification-center { position: relative; }
.operations-notification-button { overflow: visible; }
.operations-notification-badge {
  right: -4px;
  top: -5px;
  min-width: 20px;
  width: auto;
  height: 20px;
  padding: 0 5px;
  display: inline-grid;
  place-items: center;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}
.operations-notification-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 95;
  width: min(420px, calc(100vw - 24px));
  max-height: min(620px, calc(100vh - 86px));
  display: grid;
  gap: 10px;
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--ml-border-default);
  border-radius: var(--ml-radius-lg);
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-md);
}
.operations-notification-panel[hidden] { display: none; }
.operations-notification-panel:focus-visible { outline: 0; box-shadow: var(--ml-shadow-md), var(--ml-focus); }
.operations-notification-panel__header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.operations-notification-panel__header small { color: var(--ml-text-muted); font-weight: 720; text-align: right; }
.operations-notification-section {
  display: grid;
  gap: 8px;
  padding: 10px 0 12px;
  border-top: 1px solid var(--ml-border-subtle);
}
.operations-notification-section:first-child { border-top: 0; padding-top: 0; }
.operations-notification-section h4 {
  margin: 0;
  color: var(--ml-text-muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.operations-notification-section.critical h4 { color: var(--ml-danger-foreground); }
.operations-notification-section__body { display: grid; gap: 8px; }
.operations-notification-empty {
  min-height: 42px;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 8px 10px;
  border: 1px dashed var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  color: var(--ml-text-muted);
  font-size: 13px;
  text-align: center;
}
.operations-notification-item {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
  color: var(--ml-text-primary);
  text-decoration: none;
}
.operations-notification-item:hover,
.operations-notification-item:focus-visible {
  border-color: var(--ml-primary);
  background: var(--ml-primary-soft);
  outline: 0;
}
.operations-notification-item.critical {
  border-color: color-mix(in srgb, var(--ml-danger) 40%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-danger) 8%, var(--ml-bg-surface));
}
.operations-notification-item__store,
.operations-notification-item__meta,
.operations-notification-item__foot {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 720;
}
.operations-notification-item__foot {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.operations-notification-item__foot em {
  font-style: normal;
  color: var(--ml-text-secondary);
}
.operations-notification-view-all {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid var(--ml-border-subtle);
  color: var(--ml-primary);
  font-weight: 850;
  text-decoration: none;
}
.operation-detail-modal {
  gap: 18px;
  --operation-detail-section-gap: 14px;
}
.operation-detail-modal .entity-section {
  display: grid;
  gap: var(--operation-detail-section-gap);
  padding-block: 16px;
}
.operation-detail-modal .entity-section + .entity-section,
.operation-detail-modal .technical-details {
  margin-top: 2px;
}
.operation-detail-modal .entity-section h3 {
  margin: 0;
  line-height: 1.25;
}
.operation-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 16px;
  align-items: start;
  border-left: 4px solid var(--ml-primary);
  padding-inline-start: 16px;
}
.operation-detail-hero h3 { margin-bottom: 4px; }
.operation-detail-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.operation-detail-store {
  grid-column: 1 / -1;
  color: var(--ml-text-muted);
  font-size: 13px;
  font-weight: 780;
}
.technical-details {
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
  padding: 10px 12px;
}
.technical-details summary {
  cursor: pointer;
  color: var(--ml-text-secondary);
  font-weight: 820;
}
.technical-details .detail-grid { margin-top: 10px; }
.operation-detail-modal .technical-details {
  padding: 12px 14px;
}
.appearance-action {
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  border: 1px solid var(--ml-border-default);
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--ml-bg-surface);
  color: var(--ml-text-secondary);
}
.appearance-action:hover { color: var(--ml-primary); background: var(--ml-primary-soft); }
.user-menu { position: relative; }
.user-button { min-height: 40px; border: 1px solid var(--ml-border-default); border-radius: 999px; background: var(--ml-bg-surface); display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; font-weight: 760; }
.workspace-user-button { max-width: min(280px, 28vw); }
.workspace-trigger-label {
  min-width: 0;
  display: grid;
  gap: 1px;
  text-align: left;
  line-height: 1.05;
}
.workspace-trigger-label strong,
.workspace-trigger-label small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workspace-trigger-label small { color: var(--ml-text-muted); font-size: 11px; font-weight: 700; }
.workspace-trigger-chevron { display: inline-grid; place-items: center; }
.dropdown-panel { position: absolute; top: calc(100% + 8px); right: 0; min-width: 220px; z-index: 80; display: none; padding: 8px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.open > .dropdown-panel { display: grid; gap: 4px; }
.dropdown-item { min-height: 38px; width: 100%; border: 0; border-radius: var(--ml-radius-md); background: transparent; display: flex; align-items: center; gap: 9px; padding: 0 10px; text-align: left; }
.dropdown-item:hover, .dropdown-item.active { background: var(--ml-primary-soft); }
.app-layout { min-height: 0; display: grid; grid-template-columns: var(--ml-side-w) minmax(0, 1fr); }
.mobile-overlay { display: none; }
.sidebar { min-height: 0; height: 100%; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 10px; overflow: hidden; border-right: 1px solid var(--ml-border-subtle); background: var(--ml-bg-surface); padding: 16px 12px; }
.sidebar.has-sidebar-search { grid-template-areas: "title" "search" "nav" "footer"; grid-template-rows: max-content max-content minmax(0, 1fr) max-content; }
.mobile-nav-open { overflow: hidden; }
.side-title { color: var(--ml-text-muted); font-size: 12px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; padding: 0 10px 8px; }
.sidebar.has-sidebar-search .side-title { grid-area: title; }
.sidebar-search { min-height: 38px; display: flex; align-items: center; gap: 8px; margin: 0; padding: 0 10px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); color: var(--ml-text-muted); position: relative; z-index: 1; }
.sidebar.has-sidebar-search .sidebar-search { grid-area: search; }
.sidebar-search:focus-within { border-color: var(--ml-primary); box-shadow: 0 0 0 3px var(--ml-primary-soft); }
.sidebar-search input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: var(--ml-text-primary); font-size: 13px; }
.sidebar-scroll { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 2px 0 8px; }
.sidebar.has-sidebar-search .sidebar-scroll { grid-area: nav; }
.sidebar-footer { min-height: 0; padding-top: 8px; border-top: 1px solid var(--ml-border-subtle); }
.sidebar.has-sidebar-search .sidebar-footer { grid-area: footer; }
.side-link { min-height: 40px; display: flex; align-items: center; gap: 10px; border-radius: var(--ml-radius-md); padding: 0 11px; margin-bottom: 3px; }
.side-link:hover, .side-link.active { background: var(--ml-primary-soft); color: var(--ml-text-primary); }
.side-link svg { color: var(--ml-text-muted); }
.sidebar-top-links { margin-bottom: 8px; }
.sidebar-nav-group { margin: 8px 0; }
.sidebar-group-toggle { width: 100%; min-height: 28px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; border-radius: var(--ml-radius-sm); background: transparent; padding: 0 8px; color: var(--ml-text-muted); font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.sidebar-group-toggle:hover { background: var(--ml-bg-muted); color: var(--ml-text-primary); }
.sidebar-group-toggle svg { width: 14px; height: 14px; transition: transform .16s ease; }
.sidebar-group-toggle[aria-expanded="false"] svg { transform: rotate(-90deg); }
.sidebar-group-toggle[aria-expanded="false"] + .sidebar-group-items { display: none; }
.sidebar-nav-group.searching .sidebar-group-toggle[aria-expanded="false"] + .sidebar-group-items { display: block; }
.main { min-width: 0; min-height: 0; overflow: auto; padding: 24px; }
.page-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: start; margin-bottom: 20px; }
.page-head > * { min-width: 0; }
.breadcrumb { color: var(--ml-text-muted); font-size: 13px; margin-bottom: 5px; }
.page-head p { max-width: 760px; color: var(--ml-text-muted); margin-top: 7px; }
.page-head p, .muted { overflow-wrap: anywhere; }

.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.kpi { padding: 17px; min-height: 122px; display: grid; align-content: space-between; }
.kpi label { color: var(--ml-text-muted); font-size: 13px; font-weight: 760; }
.kpi strong { display: block; margin-top: 8px; font-size: clamp(27px, 4vw, 38px); line-height: 1; font-weight: 840; font-variant-numeric: tabular-nums; }
.kpi span { color: var(--ml-success-foreground); font-size: 13px; }
.report-family-grid { display: grid; gap: 16px; }
.report-family-card { display: grid; gap: 14px; }
.report-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.report-metrics div { min-height: 86px; display: grid; align-content: center; gap: 4px; padding: 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); }
.report-metrics span,
.report-metrics small { color: var(--ml-text-muted); font-size: 12px; font-weight: 720; }
.report-metrics strong { font-size: 22px; line-height: 1; }
.support-thread { display: grid; gap: 10px; margin-top: 14px; }
.support-thread article { display: grid; gap: 3px; padding: 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); }
.support-thread small { color: var(--ml-text-muted); }
.chart { min-height: 260px; display: flex; align-items: end; gap: 9px; padding: 18px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); }
.bar { flex: 1; min-width: 16px; border-radius: 5px 5px 0 0; background: var(--ml-primary); opacity: .82; }
.status { width: fit-content; max-width: 100%; min-width: 0; flex: 0 0 auto; align-self: center; min-height: 26px; display: inline-flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: var(--ml-bg-muted); color: var(--ml-text-secondary); font-size: 12px; font-weight: 760; line-height: 1; white-space: nowrap; vertical-align: middle; }
.status__dot { display: block; width: 6px; height: 6px; flex: 0 0 6px; align-self: center; border-radius: 50%; background: currentColor; }
.status__label { display: block; min-width: 0; line-height: 1.2; white-space: nowrap; }
.status.success,
.status.good {
  border: 1px solid color-mix(in srgb, var(--ml-success) 30%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-success) 12%, var(--ml-bg-elevated));
  color: var(--ml-success-foreground);
}
.status.warning,
.status.warn {
  border: 1px solid var(--ml-warning-border);
  background: var(--ml-warning-soft);
  color: var(--ml-warning-foreground);
}
.status.danger,
.status.bad {
  border: 1px solid color-mix(in srgb, var(--ml-danger) 34%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-danger) 10%, var(--ml-bg-elevated));
  color: var(--ml-danger-foreground);
}
.status.info {
  border: 1px solid var(--ml-info-border);
  background: var(--ml-info-soft);
  color: var(--ml-info-foreground);
}
.status.neutral {
  border: 1px solid var(--ml-border-subtle);
  background: var(--ml-bg-muted);
  color: var(--ml-text-secondary);
}
.status.archived {
  border: 1px dashed var(--ml-warning-border);
  background: color-mix(in srgb, var(--ml-warning) 8%, var(--ml-bg-elevated));
  color: var(--ml-warning-foreground);
}
.status-slot {
  width: max-content;
  max-width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 auto;
  justify-self: start;
  align-self: center;
}
.status-group {
  width: fit-content;
  max-width: 100%;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: var(--space-2);
}

.ops-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.ops-tile { padding: 14px; border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); border: 1px solid var(--ml-border-subtle); }
.ops-tile span { color: var(--ml-text-muted); font-size: 13px; }
.ops-tile strong { display: block; font-size: 25px; font-variant-numeric: tabular-nums; }
.store-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); gap: 12px; margin-bottom: 16px; }
.store-health { padding: 16px; display: grid; gap: 11px; }
.store-health.critical { border-color: color-mix(in srgb, var(--ml-danger) 48%, var(--ml-border-default)); }
.health-row { display: flex; justify-content: space-between; gap: 12px; padding-top: 8px; border-top: 1px solid var(--ml-border-subtle); }
.integration-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
  margin: 18px 0;
}
.integration-section {
  display: grid;
  gap: 10px;
  margin: 18px 0;
}
.integration-section > .section-row {
  align-items: center;
}
.integration-card {
  border: 1px solid var(--ml-border-default);
  border-radius: 8px;
  padding: 16px;
  background: var(--ml-surface);
  display: grid;
  gap: 10px;
  min-width: 0;
}
.integration-card h3 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.25;
}
.tenant-email-card {
  align-content: start;
}
.tenant-email-card__actions,
.fortnox-accounting-card__actions {
  margin-top: auto;
}
.tenant-email-card__history {
  flex-basis: 100%;
  justify-content: center;
}
.integration-registry-purpose {
  margin: 16px 0;
}
.integration-registry-purpose h3 {
  margin: 0 0 4px;
  font-size: 1rem;
}
.integration-meta {
  display: flex;
  align-items: center;
  align-content: flex-start;
  flex-wrap: wrap;
  gap: 6px;
}
.integration-meta span {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  align-self: flex-start;
  width: fit-content;
  max-width: 100%;
  min-height: 0;
  border: 1px solid var(--ml-border-subtle);
  border-radius: 999px;
  padding: 3px 8px;
  font-size: .78rem;
  line-height: 1.15;
  white-space: nowrap;
  color: var(--ml-text-muted);
}

.table-card { display: grid; gap: 14px; border: 0; border-radius: 0; background: transparent; overflow: visible; margin-top: 16px; }
.table-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px; border: 1px solid var(--ml-border-default); border-radius: 18px; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-sm); }
.table-tools { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.grid-search { position: relative; flex: 1 1 280px; min-width: 220px; }
.grid-search input { width: 100%; min-height: 44px; padding: 9px 43px 9px 39px; border: 1px solid var(--ml-border-default); border-radius: 12px; background: var(--ml-bg-elevated); color: var(--ml-text-primary); outline: 0; }
.grid-search > svg { position: absolute; left: 12px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--ml-text-muted); pointer-events: none; }
.grid-clear { position: absolute; right: 5px; top: 5px; width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 9px; background: transparent; color: var(--ml-text-muted); }
.grid-clear:hover { color: var(--ml-primary); background: var(--ml-primary-soft); }
.grid-clear svg { width: 17px; height: 17px; transition: transform .18s; }
.grid-clear:hover svg { transform: rotate(90deg); }
.grid-button { min-height: 42px; border-radius: 11px; font-weight: 800; }
.grid-button[aria-expanded="true"], .grid-button.active { border-color: var(--ml-primary); background: var(--ml-primary-soft); color: var(--ml-primary); }
.grid-filter-count { min-width: 20px; height: 20px; display: inline-grid; place-items: center; border-radius: 999px; background: var(--ml-primary); color: var(--ml-text-inverse); font-size: 11px; font-weight: 900; }
.grid-size { display: flex; align-items: center; gap: 7px; color: var(--ml-text-muted); font-size: 12px; font-weight: 750; }
.grid-size-select, .grid-filter-select { position: relative; min-width: 84px; }
.grid-size-trigger, .grid-filter-trigger { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px; border: var(--ml-border-width) solid var(--ml-control-border); border-radius: var(--ml-control-radius); background: var(--ml-control-bg); color: var(--ml-control-text); font: inherit; font-weight: 820; }
.grid-size-trigger svg, .grid-filter-trigger svg { width: 16px; height: 16px; color: var(--ml-text-muted); flex: 0 0 16px; }
.grid-size-trigger:hover, .grid-size-trigger:focus-visible, .grid-filter-trigger:hover, .grid-filter-trigger:focus-visible { border-color: color-mix(in srgb, var(--ml-primary) 44%, var(--ml-border-default)); background: var(--ml-primary-soft); outline: 0; }
.grid-size-trigger[aria-expanded="true"], .grid-filter-trigger[aria-expanded="true"] { border-color: var(--ml-primary); background: var(--ml-primary-soft); color: var(--ml-primary); }
.grid-size-panel, .grid-filter-panel { position: absolute; z-index: 130; top: calc(100% + 7px); right: 0; min-width: 100%; display: grid; gap: 4px; padding: 7px; border: var(--ml-border-width) solid var(--ml-dropdown-border); border-radius: var(--ml-dropdown-radius); background: var(--ml-dropdown-bg); box-shadow: var(--ml-dropdown-shadow); transform-origin: top right; animation: dropdown-in .14s ease; }
.grid-filter-panel { left: 0; right: auto; min-width: min(280px, calc(100vw - 32px)); max-height: 280px; overflow: auto; }
.grid-size-panel[hidden], .grid-filter-panel[hidden] { display: none; }
.grid-size-option, .grid-filter-option { min-height: 36px; display: flex; align-items: center; gap: 8px; border: 0; border-radius: var(--ml-dropdown-option-radius); background: transparent; color: var(--ml-text-primary); padding: 8px 10px; text-align: left; font: inherit; font-weight: 760; transition: background .16s ease, color .16s ease, transform .16s ease; }
.grid-size-option:hover, .grid-size-option:focus-visible, .grid-size-option.active, .grid-filter-option:hover, .grid-filter-option:focus-visible, .grid-filter-option.active { background: var(--ml-dropdown-option-bg-hover); color: var(--ml-primary); outline: 0; transform: translateX(2px); }
.grid-filter-field { min-width: 0; }
.grid-filter-search { position: sticky; top: 0; z-index: 1; width: 100%; min-height: 38px; margin-bottom: 4px; padding: 7px 10px; border: var(--ml-border-width) solid var(--ml-control-border); border-radius: var(--ml-control-radius); background: var(--ml-bg-elevated); color: var(--ml-text-primary); outline: 0; font: inherit; }
.grid-filter-search:focus { border-color: var(--ml-border-focus); box-shadow: var(--ml-focus); }
.grid-filter-empty { margin: 4px 2px; padding: 8px 10px; border-radius: 10px; color: var(--ml-text-muted); background: var(--ml-bg-elevated); font-size: 12px; font-weight: 760; }
.grid-export, .grid-columns { position: relative; }
.grid-export-menu, .grid-column-menu { position: absolute; z-index: 130; right: 0; top: calc(100% + 7px); min-width: 210px; display: grid; gap: 4px; padding: 7px; border: 1px solid var(--ml-border-default); border-radius: 14px; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.grid-column-menu { min-width: 230px; max-height: min(360px, 70vh); overflow: auto; }
.grid-column-menu { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--ml-accent) 50%, transparent) transparent; }
.grid-column-menu::-webkit-scrollbar { width: 10px; }
.grid-column-menu::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: color-mix(in srgb, var(--ml-accent) 54%, transparent); background-clip: padding-box; }
.grid-export-menu[hidden], .grid-column-menu[hidden] { display: none; }
.grid-export-menu button, .grid-column-option { min-height: 40px; padding: 8px 10px; display: flex; align-items: center; gap: 9px; border: 0; border-radius: 9px; background: transparent; color: var(--ml-text-primary); text-align: left; font: inherit; font-weight: 720; }
.grid-column-option { justify-content: space-between; }
.grid-column-option small { color: var(--ml-text-muted); font-size: 11px; font-weight: 820; }
.grid-export-menu button:hover, .grid-export-menu button:focus-visible, .grid-column-option:hover, .grid-column-option:focus-visible, .grid-column-option.active { background: var(--ml-primary-soft); color: var(--ml-primary); outline: 0; }
.grid-column-option.active small { color: var(--ml-primary); }
.grid-column-option:disabled { cursor: not-allowed; opacity: .72; }
.data-wrap { overflow-x: auto; overflow-y: hidden; max-width: 100%; border: 1px solid var(--ml-border-default); border-radius: 18px; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-sm); scrollbar-width: thin; }
.data-table { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 760px; font-size: 12.5px; }
.data-table caption { padding: 12px 16px; text-align: left; color: var(--ml-text-muted); }
.data-table caption span { color: var(--ml-text-primary); font-weight: 850; }
.data-table caption small { margin-left: 10px; color: var(--ml-text-muted); font-weight: 720; }
.data-table th, .data-table td { min-height: 42px; padding: 10px 11px; border-bottom: 1px solid var(--ml-border-subtle); text-align: left; vertical-align: middle; overflow-wrap: anywhere; line-height: 1.4; }
.data-table th { position: sticky; top: 0; z-index: 1; background: var(--ml-bg-elevated); color: var(--ml-text-primary); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .035em; }
.data-table th, .data-table td.numeric { white-space: nowrap; }
.data-table td.numeric { text-align: right; font-variant-numeric: tabular-nums; }
.data-table tbody tr:hover td { background: color-mix(in srgb, var(--ml-primary-soft) 44%, transparent); }
.data-table tbody tr.selected td { background: color-mix(in srgb, var(--ml-primary-soft) 58%, transparent); }
.data-table tbody tr.selected td:first-child { box-shadow: inset 3px 0 0 var(--ml-primary); }
.grid-sort { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; background: transparent; color: inherit; padding: 0; text-align: left; font: inherit; font-weight: 900; text-transform: inherit; letter-spacing: inherit; }
.grid-sort:hover { color: var(--ml-primary); }
.grid-sort-mark { width: 16px; height: 16px; display: grid; place-items: center; color: var(--ml-text-muted); font-size: 13px; }
th[aria-sort="ascending"] .grid-sort-mark::before { content: "↑"; color: var(--ml-primary); }
th[aria-sort="descending"] .grid-sort-mark::before { content: "↓"; color: var(--ml-primary); }
th:not([aria-sort]) .grid-sort-mark::before { content: "↕"; }
.row-actions { display: flex; align-items: center; gap: 6px; justify-content: flex-end; }
.action-menu { min-width: var(--ml-icon-button-size); width: var(--ml-icon-button-size); height: var(--ml-icon-button-size); border: var(--ml-border-width) solid var(--ml-control-border); border-radius: var(--ml-icon-button-radius); background: var(--ml-icon-button-bg); color: var(--ml-primary); display: grid; place-items: center; transition: transform .16s, border-color .16s, background .16s, box-shadow .16s; }
.action-menu:hover, .action-menu:focus-visible { transform: translateY(-2px); border-color: color-mix(in srgb, var(--ml-primary) 42%, var(--ml-border-default)); background: var(--ml-icon-button-bg-hover); box-shadow: var(--ml-icon-button-shadow-hover); outline: 0; }
.row-action-popover { position: fixed; z-index: 130; width: min(240px, calc(100vw - 24px)); padding: 7px; border: 1px solid var(--ml-border-default); border-radius: 14px; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); display: grid; gap: 4px; animation: dropdown-in .14s ease; }
.row-action-popover a, .row-action-popover button { min-height: 38px; border: 0; border-radius: var(--ml-radius-md); background: transparent; color: var(--ml-text-primary); display: flex; align-items: center; gap: 9px; padding: 0 10px; text-decoration: none; font: inherit; font-weight: 780; text-align: left; }
.row-action-popover svg { width: 17px; height: 17px; flex: 0 0 17px; color: var(--ml-text-muted); }
.row-action-popover a:hover, .row-action-popover a:focus-visible, .row-action-popover button:hover, .row-action-popover button:focus-visible { background: var(--ml-primary-soft); color: var(--ml-primary); outline: none; }
.row-action-popover .tone-warning.with-separator { margin-top: 4px; padding-top: 5px; border-top: 1px solid var(--ml-border-subtle); }
.row-action-popover .tone-warning:hover, .row-action-popover .tone-warning:focus-visible { background: color-mix(in srgb, var(--ml-warning) 13%, transparent); color: var(--ml-warning); }
.row-action-popover .tone-success:hover, .row-action-popover .tone-success:focus-visible { background: color-mix(in srgb, var(--ml-success) 13%, transparent); color: var(--ml-success); }
.row-action-popover .tone-accent:hover, .row-action-popover .tone-accent:focus-visible { background: var(--ml-primary-soft); color: var(--ml-primary); }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 3px 2px; }
.grid-info { color: var(--ml-text-muted); font-size: 12px; }
.pagination-pages { display: flex; gap: 5px; flex-wrap: wrap; }
.page-btn { min-width: 40px; min-height: 40px; padding-inline: 10px; border: 1px solid var(--ml-border-default); border-radius: 11px; background: var(--ml-bg-surface); font-weight: 800; }
.page-btn.wide { min-width: 82px; }
.page-btn[aria-current="page"] { background: var(--ml-primary); border-color: var(--ml-primary); color: var(--ml-text-inverse); }
.page-btn:hover:not(:disabled) { border-color: color-mix(in srgb, var(--ml-primary) 44%, var(--ml-border-default)); background: var(--ml-primary-soft); color: var(--ml-primary); }
.page-btn:disabled { opacity: .45; cursor: not-allowed; }
.filters { display: none; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; padding: 12px; border: 1px solid var(--ml-border-default); border-radius: 18px; background: color-mix(in srgb, var(--ml-bg-surface) 70%, var(--ml-bg-elevated) 30%); }
.filters.open { display: grid; }
.filters label { display: grid; gap: 6px; color: var(--ml-text-muted); font-size: 11px; font-weight: 800; }
.selected-product-context { display: grid; gap: 4px; margin-top: 16px; padding: 2px 4px; }
.selected-product-context strong { color: var(--ml-text-primary); font-size: 16px; font-weight: 860; }
.selected-product-context span { color: var(--ml-text-muted); font-size: 12px; font-weight: 760; }
.filters input:not([type="hidden"]) { width: 100%; min-width: 0; min-height: 42px; padding: 8px 11px; border: var(--ml-border-width) solid var(--ml-control-border); border-radius: var(--ml-control-radius); background: var(--ml-control-bg); color: var(--ml-control-text); outline: 0; }
.filters input:not([type="hidden"]):focus { border-color: var(--ml-border-focus); box-shadow: var(--ml-focus); }

.select { position: relative; }
.select-button { width: 100%; min-height: 42px; border: var(--ml-border-width) solid var(--ml-control-border); border-radius: var(--ml-control-radius); background: var(--ml-control-bg); color: var(--ml-control-text); display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 12px; }
.select-panel { position: absolute; z-index: 90; top: calc(100% + 6px); left: 0; right: 0; display: none; min-width: 230px; padding: 8px; border: var(--ml-border-width) solid var(--ml-dropdown-border); border-radius: var(--ml-dropdown-radius); background: var(--ml-dropdown-bg); box-shadow: var(--ml-dropdown-shadow); }
.select.open .select-panel { display: grid; gap: 7px; }
.select-options { max-height: 230px; overflow: auto; display: grid; gap: 4px; }
.select-option { min-height: 36px; border: 0; border-radius: var(--ml-dropdown-option-radius); background: transparent; text-align: left; padding: 0 9px; }
.select-option:hover, .select-option.active { background: var(--ml-dropdown-option-bg-hover); }
.switch { position: relative; display: inline-flex; align-items: center; gap: 10px; font-weight: 760; }
.switch input { position: absolute; opacity: 0; }
.switch-ui { width: 46px; height: 26px; border-radius: 999px; border: 1px solid var(--ml-border-default); background: var(--ml-bg-muted); position: relative; }
.switch-ui::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--ml-text-muted); transition: transform .14s ease; }
.switch input:checked + .switch-ui { background: var(--ml-primary); border-color: var(--ml-primary); }
.switch input:checked + .switch-ui::after { transform: translateX(20px); background: #fff; }

.appearance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.profile-hero { margin-bottom: var(--space-5); }
.profile-meta-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.profile-meta-chips span {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 var(--space-4);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 999px;
  background: var(--ml-bg-muted);
  color: var(--ml-text-secondary);
  font-size: 13px;
  font-weight: 760;
}
.personal-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-5);
}
.personal-nav a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 var(--space-4);
  border: 1px solid var(--ml-border-default);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-surface);
  color: var(--ml-text-secondary);
  text-decoration: none;
  font-weight: 780;
}
.personal-nav a svg { width: 16px; height: 16px; }
.personal-nav a:hover, .personal-nav a:focus-visible, .personal-nav a.active { background: var(--ml-primary-soft); color: var(--ml-primary); outline: 0; }
.personal-tab-selector { display: none; margin-bottom: var(--space-5); }
.personal-tab-selector .ml-language-section { width: min(100%, 520px); }
.personal-tab-selector .ml-language-popover { width: 100%; min-width: 100%; max-width: min(520px, calc(100vw - 28px)); }
.security-policy-card { align-content: start; gap: var(--space-3); }
.skin-card { min-height: 190px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); padding: 14px; text-align: left; display: grid; gap: 12px; position: relative; }
.skin-card.selected { border-color: var(--ml-primary); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ml-primary) 22%, transparent); }
.skin-card.selected::after { content: "✓"; position: absolute; right: 14px; bottom: 14px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: var(--ml-primary); color: white; font-weight: 900; }
.skin-preview { height: 92px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--preview-bg, #f6f7f9); display: grid; grid-template-columns: 34% 1fr; overflow: hidden; }
.skin-preview aside { background: var(--preview-side, #e8f3f5); border-right: 1px solid rgb(0 0 0 / 7%); }
.skin-preview main { padding: 10px; display: grid; gap: 7px; }
.skin-preview i { display: block; height: 12px; border-radius: 999px; background: var(--preview-accent, var(--ml-primary)); }
.skin-preview b { display: block; height: 22px; border-radius: 6px; background: #fff; border: 1px solid rgb(0 0 0 / 8%); }
.permission-groups { display: grid; gap: 14px; }
.permission-group { padding: 16px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); }
.permission-row { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid var(--ml-border-subtle); }
.permission-row:first-of-type { border-top: 0; }
.tenant-detail-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr); gap: var(--space-5); align-items: stretch; margin-bottom: var(--space-5); }
.tenant-detail-hero h2 { margin: var(--space-3) 0 0; font-size: 32px; }
.tenant-id-box { border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); padding: var(--space-5); display: grid; gap: var(--space-3); align-content: center; }
.tenant-id-box span { color: var(--ml-text-muted); font-size: 12px; font-weight: 820; text-transform: uppercase; letter-spacing: .04em; }
.tenant-id-box code { font-size: 13px; overflow-wrap: anywhere; color: var(--ml-text-primary); }
.tenant-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.tenant-detail-panel { margin: 0; }
.tenant-detail-panel .detail-list { margin: 0; }
.readiness-list { display: grid; gap: var(--space-3); }
.readiness-row { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); border-top: 1px solid var(--ml-border-subtle); padding-top: var(--space-3); }
.readiness-row:first-child { border-top: 0; padding-top: 0; }
.readiness-row span { display: grid; gap: 2px; }
.readiness-row small { color: var(--ml-text-muted); }
.membership-list { display: grid; gap: var(--space-3); margin-bottom: var(--space-4); }
.membership-row { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); border-top: 1px solid var(--ml-border-subtle); padding-top: var(--space-3); }
.membership-row:first-child { border-top: 0; padding-top: 0; }
.membership-row span { display: grid; gap: 2px; min-width: 0; }
.membership-row small, .permission-preview .hint { overflow-wrap: anywhere; }
.inline-admin-form { display: grid; gap: var(--space-4); margin-top: var(--space-4); }
.admin-details { margin-top: var(--space-4); border-top: 1px solid var(--ml-border-subtle); padding-top: var(--space-4); }
.admin-details summary { cursor: pointer; font-weight: 820; color: var(--ml-text-primary); }
.permission-preview { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--ml-border-subtle); }
.permission-preview h4 { margin: 0 0 var(--space-2); }

.consumer-shell { width: min(100%, 480px); min-height: 100vh; margin: 0 auto; display: grid; grid-template-rows: auto 1fr auto; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.consumer-top { min-height: 66px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid var(--ml-border-subtle); }
.phone-main { padding: 20px; overflow: auto; }
.consumer-hero { display: grid; gap: 14px; padding: 22px 0; }
.scan-primary { min-height: 76px; border-radius: 18px; font-size: 18px; }
.nearby-card, .checkout-summary { border: 1px solid var(--ml-border-subtle); border-radius: 16px; padding: 16px; background: var(--ml-bg-elevated); }
a.nearby-card { display: block; text-decoration: none; }
.phone-nav { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ml-border-subtle); }
.phone-nav a { min-height: 58px; display: grid; place-items: center; text-decoration: none; color: var(--ml-text-muted); font-weight: 780; }
.phone-nav a.active { color: var(--ml-primary); background: var(--ml-primary-soft); }
.session-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--ml-primary-soft); margin-bottom: 14px; }
.scanner-box { min-height: 250px; border: 1px dashed var(--ml-border-strong); border-radius: 18px; display: grid; place-items: center; text-align: center; padding: 18px; background: var(--ml-bg-elevated); }
.consumer-entry-experience { padding-top: 2px; }
.entry-card { display: grid; gap: 16px; border: 1px solid color-mix(in srgb, var(--ml-border-subtle) 62%, transparent); border-radius: 24px; padding: 19px 18px 16px; background: linear-gradient(180deg, color-mix(in srgb, var(--ml-bg-surface) 94%, white), var(--ml-bg-surface)); box-shadow: 0 18px 42px color-mix(in srgb, var(--ml-text-primary) 8%, transparent); }
.entry-store-identity { display: grid; gap: 4px; }
.entry-store-identity strong { font-size: 21px; line-height: 1.18; letter-spacing: 0; }
.entry-store-identity span { color: var(--ml-text-muted); font-size: 14px; }
.entry-readiness { display: inline-flex; align-items: center; justify-self: start; gap: 8px; min-height: 30px; border-radius: 999px; padding: 5px 10px; font-size: 14px; font-weight: 820; }
.entry-readiness span:last-child { display: grid; gap: 1px; }
.entry-readiness small { font-size: 12px; font-weight: 650; color: var(--ml-text-secondary); }
.entry-status-icon { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; }
.entry-status-icon svg { width: 14px; height: 14px; }
.entry-readiness.ready { background: color-mix(in srgb, var(--ml-success) 12%, transparent); color: var(--ml-success); }
.entry-readiness.ready .entry-status-icon { background: color-mix(in srgb, var(--ml-success) 17%, transparent); }
.entry-readiness.active { background: color-mix(in srgb, var(--ml-success) 10%, transparent); color: var(--ml-success); }
.entry-readiness.active .entry-status-icon { background: color-mix(in srgb, var(--ml-success) 17%, transparent); }
.entry-readiness.pending { background: color-mix(in srgb, var(--ml-primary) 8%, transparent); color: var(--ml-text-secondary); }
.entry-blockers { display: grid; gap: 10px; border: 1px solid color-mix(in srgb, var(--ml-danger) 20%, transparent); border-radius: 16px; padding: 12px; background: color-mix(in srgb, var(--ml-danger) 5%, transparent); }
.entry-blocker { display: grid; gap: 2px; border-top: 1px solid color-mix(in srgb, var(--ml-danger) 20%, transparent); padding-top: 10px; }
.entry-blocker:first-of-type { border-top: 0; padding-top: 0; }
.entry-blocker span { font-weight: 820; color: var(--ml-text-primary); }
.entry-blocker small { color: var(--ml-text-muted); }
.btn.entry-open-door { width: 100%; min-height: 51px; justify-content: center; gap: 9px; border-radius: 16px; font-size: 16px; font-weight: 850; box-shadow: 0 14px 26px color-mix(in srgb, var(--ml-primary) 28%, transparent); transition: transform .14s ease, box-shadow .14s ease, filter .14s ease; }
.entry-open-door svg { width: 18px; height: 18px; }
.entry-open-door:not(:disabled):active { transform: scale(.985); box-shadow: 0 8px 18px color-mix(in srgb, var(--ml-primary) 22%, transparent); }
.entry-open-door.loading svg { animation: ml-spin .8s linear infinite; }
.entry-recovery-action { display: grid; gap: 6px; justify-items: center; text-align: center; }
.entry-recovery-action .btn { width: 100%; min-height: 46px; justify-content: center; border-radius: 14px; }
.entry-recovery-action small { max-width: 31ch; color: var(--ml-text-muted); line-height: 1.35; }
.store-access-wait { display: grid; justify-items: center; gap: var(--space-3); text-align: center; padding: var(--space-3) 0; }
.store-access-spinner,
.store-access-success,
.store-access-warning,
.store-access-countdown { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--ml-primary) 12%, var(--ml-bg-elevated)); color: var(--ml-primary); }
.store-access-spinner svg,
.store-access-success svg,
.store-access-warning svg { width: 28px; height: 28px; }
.store-access-spinner svg { animation: ml-spin 1.1s linear infinite; }
.store-access-success { background: color-mix(in srgb, var(--ml-success) 16%, var(--ml-bg-elevated)); color: var(--ml-success); }
.store-access-warning { background: color-mix(in srgb, var(--ml-warning) 18%, var(--ml-bg-elevated)); color: var(--ml-warning); }
.store-access-countdown { font-size: 24px; font-weight: 900; font-variant-numeric: tabular-nums; }
.store-access-countdown[data-urgency="warning"] { background: color-mix(in srgb, var(--ml-warning) 22%, var(--ml-bg-elevated)); color: var(--ml-warning); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ml-warning) 10%, transparent); animation: ml-countdown-pulse 1.1s ease-in-out infinite; }
.store-access-countdown[data-urgency="danger"] { background: color-mix(in srgb, var(--ml-danger) 18%, var(--ml-bg-elevated)); color: var(--ml-danger); box-shadow: 0 0 0 5px color-mix(in srgb, var(--ml-danger) 12%, transparent); animation: ml-countdown-pulse .85s ease-in-out infinite; }
.store-access-countdown[data-urgency="critical"] { background: color-mix(in srgb, var(--ml-danger) 27%, var(--ml-bg-elevated)); color: var(--ml-danger); box-shadow: 0 0 0 6px color-mix(in srgb, var(--ml-danger) 18%, transparent); animation: ml-countdown-pulse .7s ease-in-out infinite; }
.store-access-actions { width: 100%; }
.store-access-modal-footer { justify-content: space-between; }
.store-access-modal-footer .store-access-confirm-footer { justify-self: start; }
.store-access-modal-footer .store-access-cancel-footer { justify-self: end; }
@keyframes ml-spin { to { transform: rotate(360deg); } }
@keyframes ml-countdown-pulse { 50% { transform: scale(1.045); } }
@media (prefers-reduced-motion: reduce) {
  .store-access-countdown[data-urgency="warning"],
  .store-access-countdown[data-urgency="danger"],
  .store-access-countdown[data-urgency="critical"] { animation: none; }
}
.preflight-details { display: grid; gap: 10px; }
.preflight-toggle { width: 100%; min-height: 36px; border: 0; border-radius: 12px; padding: 0 2px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--ml-text-secondary); background: transparent; font: inherit; font-size: 13px; font-weight: 820; cursor: pointer; }
.preflight-toggle:hover, .preflight-toggle:focus-visible { color: var(--ml-primary); background: color-mix(in srgb, var(--ml-primary) 7%, transparent); outline: 0; }
.toggle-chevron { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; transition: transform .14s ease; }
.toggle-chevron svg { width: 17px; height: 17px; }
.preflight-toggle[aria-expanded="true"] .toggle-chevron { transform: rotate(180deg); }
.preflight-list { display: grid; gap: 4px; margin: 2px 0 0; }
.preflight-list[hidden] { display: none; }
.preflight-row { min-height: 34px; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 9px; border: 0; border-radius: 10px; padding: 6px 4px; background: transparent; }
.preflight-row span { display: grid; gap: 2px; min-width: 0; }
.preflight-row .preflight-check-icon { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--ml-bg-elevated); color: var(--ml-text-muted); }
.preflight-check-icon svg { width: 14px; height: 14px; }
.preflight-row strong { font-size: 13px; font-weight: 760; }
.preflight-row small { color: var(--ml-text-muted); font-size: 11px; line-height: 1.25; }
.preflight-row em { flex: 0 0 auto; border-radius: 999px; padding: 3px 7px; font-style: normal; font-size: 11px; font-weight: 820; background: var(--ml-bg-surface); color: var(--ml-text-primary); }
.preflight-row.passed em,
.preflight-row.notrequired em,
.preflight-row.active em,
.preflight-row.alreadygranted em { background: color-mix(in srgb, var(--ml-success) 16%, transparent); color: var(--ml-success); }
.preflight-row.passed .preflight-check-icon,
.preflight-row.active .preflight-check-icon,
.preflight-row.alreadygranted .preflight-check-icon { background: color-mix(in srgb, var(--ml-success) 12%, transparent); color: var(--ml-success); }
.preflight-row.failed em { background: color-mix(in srgb, var(--ml-danger) 14%, transparent); color: var(--ml-danger); }
.preflight-row.failed .preflight-check-icon { background: color-mix(in srgb, var(--ml-danger) 11%, transparent); color: var(--ml-danger); }
.preflight-row.pending em { background: color-mix(in srgb, var(--ml-warning) 16%, transparent); color: var(--ml-warning); }
.preflight-row.pending .preflight-check-icon { background: color-mix(in srgb, var(--ml-warning) 11%, transparent); color: var(--ml-warning); }
.preflight-actions { margin-top: 10px; }
body[data-mode="dark"] .entry-readiness.ready,
body[data-mode="dark"] .entry-readiness.active,
body[data-mode="dark"] .preflight-row.passed em,
body[data-mode="dark"] .preflight-row.notrequired em,
body[data-mode="dark"] .preflight-row.active em,
body[data-mode="dark"] .preflight-row.alreadygranted em,
body[data-mode="dark"] .preflight-row.passed .preflight-check-icon,
body[data-mode="dark"] .preflight-row.active .preflight-check-icon,
body[data-mode="dark"] .preflight-row.alreadygranted .preflight-check-icon { color: #73d7a3; }
@media (prefers-reduced-motion: reduce) {
  .entry-open-door,
  .toggle-chevron { transition: none; }
  .entry-open-door.loading svg { animation: none; }
  .store-access-spinner svg { animation: none; }
  .grid-size-panel,
  .grid-filter-panel,
  .row-action-popover { animation: none; }
}
.cart-row, .receipt-row { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--ml-border-subtle); }
.total-row { font-size: 24px; font-weight: 850; }

.modal-open { overflow: hidden; }
.modal-backdrop { position: fixed; inset: 0; background: rgb(8 17 29 / 58%); backdrop-filter: blur(4px); z-index: var(--ml-modal-backdrop-z, 90); }
.modal { position: fixed; z-index: var(--ml-modal-z, 100); left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(720px, calc(100vw - 28px)); max-height: calc(100dvh - 28px); min-height: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--ml-border-default); border-radius: 18px; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.modal.large { width: min(960px, calc(100vw - 28px)); }
.modal.wide { width: min(1120px, calc(100vw - 28px)); }
.modal.product-detail-modal { width: min(1120px, calc(100vw - 28px)); height: min(780px, calc(100dvh - 28px)); min-height: min(680px, calc(100dvh - 28px)); }
.modal header, .modal footer { flex: 0 0 auto; min-height: 62px; padding: 14px 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--ml-border-subtle); }
.modal header h2 { margin: 0; font-size: 20px; }
.modal footer { border-top: 1px solid var(--ml-border-subtle); border-bottom: 0; justify-content: flex-end; flex-wrap: wrap; }
.modal-body { flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: 18px; }
.modal-body,
.product-modal-panels,
.grid-filter-panel,
.grid-size-panel,
.row-action-popover,
.data-wrap,
.product-modal-tabs {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--ml-primary) 38%, var(--ml-border-default)) transparent;
}
.modal-body::-webkit-scrollbar,
.product-modal-panels::-webkit-scrollbar,
.grid-filter-panel::-webkit-scrollbar,
.grid-size-panel::-webkit-scrollbar,
.row-action-popover::-webkit-scrollbar,
.data-wrap::-webkit-scrollbar,
.product-modal-tabs::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.modal-body::-webkit-scrollbar-track,
.product-modal-panels::-webkit-scrollbar-track,
.grid-filter-panel::-webkit-scrollbar-track,
.grid-size-panel::-webkit-scrollbar-track,
.row-action-popover::-webkit-scrollbar-track,
.data-wrap::-webkit-scrollbar-track,
.product-modal-tabs::-webkit-scrollbar-track {
  background: transparent;
}
.modal-body::-webkit-scrollbar-thumb,
.product-modal-panels::-webkit-scrollbar-thumb,
.grid-filter-panel::-webkit-scrollbar-thumb,
.grid-size-panel::-webkit-scrollbar-thumb,
.row-action-popover::-webkit-scrollbar-thumb,
.data-wrap::-webkit-scrollbar-thumb,
.product-modal-tabs::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ml-primary) 38%, var(--ml-border-default));
  background-clip: padding-box;
}
.modal-mode { display: block; color: var(--ml-text-muted); font-size: 11px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.modal-dirty-warning { flex-basis: 100%; margin: 0; color: var(--ml-warning); font-size: 13px; font-weight: 720; text-align: right; }
.tenant-email-config-form {
  min-height: 0;
  display: grid;
  gap: 16px;
}
.tenant-email-modal-summary {
  padding: 14px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.tenant-email-section {
  min-width: 0;
}
.tenant-email-identity-grid,
.tenant-email-provider-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.tenant-email-readonly-field {
  min-height: 42px;
  display: grid;
  align-content: center;
  gap: 4px;
  margin-bottom: 14px;
  padding: 8px 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-control-radius);
  background: var(--ml-bg-muted);
}
.tenant-email-readonly-field span {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 800;
}
.tenant-email-readonly-field strong {
  color: var(--ml-text-primary);
  font-size: 14px;
}
.tenant-email-provider-panel {
  min-height: 212px;
  display: grid;
  align-content: start;
  gap: 14px;
  padding: 14px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.tenant-email-provider-panel[hidden] {
  display: none;
}
.tenant-email-provider-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.tenant-email-provider-heading > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.tenant-email-provider-heading strong {
  color: var(--ml-text-primary);
  font-size: 15px;
}
.tenant-email-provider-heading span {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 720;
  line-height: 1.35;
}
.tenant-email-provider-detail,
.tenant-email-status-grid {
  margin: 0;
}
.tenant-email-delivery-toggle {
  width: fit-content;
  max-width: 100%;
}
.tenant-email-test-form {
  display: grid;
  gap: 16px;
}
.tenant-email-test-warning {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--ml-warning-border);
  border-radius: var(--ml-radius-md);
  background: var(--ml-warning-soft);
  color: var(--ml-text-primary);
}
.tenant-email-test-warning strong {
  font-size: 14px;
}
.tenant-email-test-warning span {
  color: var(--ml-text-secondary);
  font-size: 13px;
  line-height: 1.45;
}
.tenant-email-test-summary .detail-grid__item.full {
  grid-column: 1 / -1;
}
.tenant-email-history {
  display: grid;
  gap: 14px;
}
.tenant-email-history-summary {
  margin-top: 2px;
}
.tenant-email-cell small,
.tenant-email-failure {
  margin-top: 4px;
  color: var(--ml-text-muted);
  font-size: 12px;
}
.tenant-email-cell strong,
.tenant-email-cell small {
  display: block;
}
.tenant-email-cell {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.tenant-email-cell strong {
  overflow: hidden;
  color: var(--ml-text-primary);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tenant-email-cell small {
  margin-top: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tenant-email-failure {
  color: var(--ml-danger);
  font-weight: 760;
}
.tenant-email-empty-state {
  padding: 18px;
  border: 1px dashed var(--ml-border-default);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.table-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.tenant-email-message-detail,
.tenant-email-action-form {
  display: grid;
  gap: 14px;
}
.tenant-email-evidence-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  gap: 4px 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.tenant-email-evidence-row span,
.tenant-email-evidence-row small {
  color: var(--ml-text-muted);
  font-size: 12px;
}
.tenant-email-evidence-row small {
  grid-column: 1 / -1;
}
.tenant-email-cancel-warning {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.tenant-email-cancel-warning span {
  color: var(--ml-text-secondary);
  font-size: 13px;
  line-height: 1.45;
}
.entity-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.entity-tab { min-height: 34px; max-width: 100%; border: 1px solid var(--ml-border-subtle); border-radius: 8px; padding: 7px 11px; background: var(--ml-bg-elevated); color: var(--ml-text-secondary); font: inherit; font-size: 13px; font-weight: 760; cursor: default; transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease; }
.entity-tab:hover { border-color: color-mix(in srgb, var(--ml-primary) 34%, var(--ml-border-default)); background: var(--ml-primary-soft); color: var(--ml-primary); transform: translateY(-1px); }
.entity-tab.active, .entity-tab[aria-selected="true"] { border-color: color-mix(in srgb, var(--ml-primary) 45%, var(--ml-border-default)); background: var(--ml-primary-soft); color: var(--ml-text-primary); }
.entity-tab:focus-visible { outline: 2px solid var(--ml-focus); outline-offset: 2px; }
.entity-sections { display: grid; gap: 18px; }
.entity-section { display: grid; gap: 12px; padding-top: 4px; }
.entity-section + .entity-section { border-top: 1px solid var(--ml-border-subtle); padding-top: 18px; }
.entity-section h3 { margin: 0; font-size: 15px; }
.modal .switch-row { align-items: center; }
.product-detail-modal .modal-body { display: grid; align-content: start; overflow-x: hidden; overflow-y: auto; }
.product-detail-modal [data-product-master-form],
.product-detail-modal [data-store-master-form],
.product-detail-modal [data-store-master-form-shell],
.product-detail-modal [data-order-detail] { min-height: 0; display: grid; grid-template-rows: auto auto minmax(0, 1fr); }
.product-modal-summary {
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.product-modal-summary > div { min-width: 0; display: grid; gap: 3px; }
.product-modal-summary strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.product-modal-summary span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ml-text-muted); font-size: 12px; font-weight: 720; }
.product-modal-tabs { position: sticky; top: -18px; z-index: 1; margin: 0 -18px 16px; padding: 12px 18px; border-bottom: 1px solid var(--ml-border-subtle); background: var(--ml-bg-surface); }
.product-modal-tabs .entity-tab { cursor: pointer; }
.product-modal-panels { min-height: 0; display: grid; gap: 14px; overflow: auto; padding-right: 4px; scrollbar-width: thin; }
.product-modal-panel { padding-top: 0; align-content: start; }
.product-modal-panel + .product-modal-panel { border-top: 0; }
.product-modal-grid .field.full { grid-column: 1 / -1; }
.product-modal-panel .table-card { box-shadow: none; }
.opening-hours-summary,
.opening-hours-editor {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.opening-hours-hidden-control {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.opening-hours-status,
.opening-hours-summary-row {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.opening-hours-summary-row:last-child { border-bottom: 0; }
.opening-hours-status span,
.opening-hours-summary-row span { color: var(--ml-text-muted); font-size: 12px; font-weight: 820; }
.opening-hours-status strong,
.opening-hours-summary-row strong { color: var(--ml-text-primary); font-size: 13px; font-weight: 850; text-align: right; }
.opening-hours-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.opening-hours-toolbar > div:first-child { display: grid; gap: 3px; }
.opening-hours-toolbar strong { font-size: 14px; }
.opening-hours-toolbar span { color: var(--ml-text-muted); font-size: 12px; font-weight: 720; }
.opening-hours-tools { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.opening-hours-tool-group { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.opening-hours-tool-group.subtle { padding-left: 2px; }
.opening-hours-tool-group .btn { min-height: 34px; padding: 7px 10px; font-size: 12px; white-space: nowrap; }
.opening-hours-tool-group.subtle .btn { color: var(--ml-text-muted); }
.opening-hours-days { display: grid; gap: 10px; }
.opening-hours-day {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-surface);
}
.opening-hours-day.is-source {
  border-color: color-mix(in srgb, var(--ml-primary) 34%, var(--ml-border-default));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ml-primary) 10%, transparent);
}
.opening-hours-day-heading {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto auto;
  align-items: center;
  gap: 10px;
}
.opening-hours-day-heading > strong { font-size: 13px; }
.opening-hours-intervals { display: grid; gap: 8px; }
.opening-hours-interval {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
}
.opening-hours-interval label { display: grid; gap: 5px; color: var(--ml-text-muted); font-size: 11px; font-weight: 850; text-transform: uppercase; }
.opening-hours-add { justify-self: start; }
.opening-hours-day.is-closed .opening-hours-intervals,
.opening-hours-day.is-24 .opening-hours-intervals { display: none; }
.opening-hours-day.is-closed .opening-hours-add,
.opening-hours-day.is-24 .opening-hours-add { display: none; }
.opening-hours-error { margin: 0; }
.inventory-operations-panel { margin-bottom: 16px; }
.inventory-summary-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.inventory-summary-strip div {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-elevated);
}
.inventory-summary-strip span {
  color: var(--ml-text-muted);
  font-size: 11px;
  font-weight: 860;
  letter-spacing: .025em;
  text-transform: uppercase;
}
.inventory-summary-strip strong {
  overflow: hidden;
  color: var(--ml-text-primary);
  font-size: 14px;
  font-weight: 860;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.inventory-summary-strip small {
  color: var(--ml-text-muted);
  font-size: 12px;
  line-height: 1.25;
}
.inventory-cell {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.inventory-cell strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ml-text-primary);
  font-weight: 860;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.inventory-cell small {
  min-width: 0;
  overflow: hidden;
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 720;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pricing-operations-panel { margin-bottom: 16px; }
.pricing-summary-strip strong { font-size: 15px; }
.pricing-cell {
  min-width: 0;
  display: grid;
  gap: 3px;
  align-content: center;
}
.pricing-cell strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ml-text-primary);
  font-weight: 860;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pricing-cell small {
  min-width: 0;
  overflow: hidden;
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 720;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pricing-lists-panel { margin-top: 18px; }
.price-list-detail-shell { gap: 16px; }
.price-list-detail-shell .data-wrap { box-shadow: none; }
.live-operations-layout {
  display: grid;
  gap: var(--ml-space-5);
  align-items: start;
}
.live-ops-filterbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  align-items: end;
  gap: var(--ml-space-4);
  padding: var(--ml-space-4);
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-card-radius);
  background: var(--ml-card-bg);
  box-shadow: var(--ml-shadow-sm);
}
.live-scope-panel {
  min-width: 0;
  display: grid;
  gap: var(--ml-space-3);
}
.live-refresh-panel,
.live-scope-panel,
.live-activity-panel,
.live-visit-empty {
  border-color: color-mix(in srgb, var(--ml-border-default) 78%, transparent);
}
.live-activity-panel {
  display: grid;
  gap: var(--ml-space-4);
}
.live-status-inline {
  min-height: var(--ml-control-height);
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--ml-space-3);
  color: var(--ml-text-secondary);
  font-size: 13px;
  font-weight: 760;
  white-space: nowrap;
}
.live-status-inline small {
  max-width: 220px;
  overflow: hidden;
  color: var(--ml-text-muted);
  text-overflow: ellipsis;
}
.live-store-scope {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.live-store-options {
  min-width: 0;
  flex: 1 1 260px;
  gap: 8px;
}
.live-store-scope .btn {
  min-height: 40px;
  border-radius: var(--ml-control-radius);
  transition: transform var(--ml-interactive-transition-fast), border-color var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast);
}
.live-store-scope .btn:hover,
.live-store-scope .btn:focus-visible {
  transform: translateY(-1px);
}
.live-visit-empty { box-shadow: var(--ml-shadow-sm); }
.live-activity-panel .table-card { margin-top: 0; }
.event-timeline {
  display: grid;
  gap: 8px;
}
.live-event-row {
  min-height: 44px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: color-mix(in srgb, var(--ml-bg-elevated) 72%, transparent);
  transition: border-color var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast), transform var(--ml-interactive-transition-fast);
}
.live-event-row:hover {
  border-color: color-mix(in srgb, var(--ml-primary) 28%, var(--ml-border-default));
  background: var(--ml-bg-elevated);
  transform: translateY(-1px);
}
.live-event-row > span {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.inventory-quantity {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-weight: 860;
}
.inventory-quantity.good { color: var(--ml-success-foreground); }
.inventory-quantity.warn { color: var(--ml-warning-foreground); }
.inventory-quantity.bad { color: var(--ml-danger-foreground); }
.inventory-detail-shell {
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}
.inventory-modal-summary {
  grid-template-columns: minmax(0, 1fr) auto auto;
}
.inventory-adjustment-confirm .review-status-grid strong {
  font-variant-numeric: tabular-nums;
}
.product-package-list { display: grid; gap: 10px; }
.package-row { min-height: 92px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease; }
.package-row:hover { border-color: color-mix(in srgb, var(--ml-primary) 30%, var(--ml-border-default)); background: color-mix(in srgb, var(--ml-primary-soft) 38%, var(--ml-bg-elevated)); box-shadow: 0 10px 24px color-mix(in srgb, var(--ml-primary) 8%, transparent); transform: translateY(-1px); }
.package-row.archived { border-style: dashed; background: color-mix(in srgb, var(--ml-warning) 7%, var(--ml-bg-elevated)); }
.package-row-main { min-width: 0; display: grid; gap: 6px; }
.package-row strong, .package-row span { overflow: hidden; text-overflow: ellipsis; }
.package-identifiers { display: grid; gap: 2px; color: var(--ml-text-muted); font-size: 12px; font-weight: 720; }
.package-identifiers span { white-space: nowrap; }
.package-action-row { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.package-action-row .btn { min-height: var(--ml-icon-button-size); padding-inline: 10px; border-radius: var(--ml-icon-button-radius); }
.package-action-row .package-action { width: var(--ml-icon-button-size); height: var(--ml-icon-button-size); min-height: var(--ml-icon-button-size); padding: 0; display: grid; place-items: center; }
.package-action-row .package-action svg { width: 17px; height: 17px; }
.package-action-row .package-action.view:hover { color: var(--ml-primary); background: var(--ml-primary-soft); }
.package-action-row .package-action.edit:hover { color: var(--ml-primary); background: var(--ml-primary-soft); }
.package-action-row .package-action.archive:hover { color: var(--ml-warning); background: color-mix(in srgb, var(--ml-warning) 12%, transparent); }
.package-action-row .package-action.restore:hover { color: var(--ml-success); background: color-mix(in srgb, var(--ml-success) 12%, transparent); }
.package-flag-row { display: flex; flex-wrap: wrap; gap: 6px; }
.package-flag { min-height: 24px; display: inline-flex; align-items: center; border: 1px solid var(--ml-border-subtle); border-radius: 999px; padding: 0 8px; background: var(--ml-bg-surface); color: var(--ml-text-muted); font-size: 11px; font-weight: 820; white-space: nowrap; }
.package-flag.enabled { border-color: color-mix(in srgb, var(--ml-success) 38%, var(--ml-border-subtle)); color: var(--ml-success); background: color-mix(in srgb, var(--ml-success) 10%, var(--ml-bg-surface)); }
.product-toggle-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 2px; }
.product-toggle { min-height: 44px; justify-content: flex-start; padding: 8px 10px; border: 1px solid var(--ml-border-subtle); border-radius: 12px; background: var(--ml-bg-elevated); }
.product-toggle:hover { border-color: color-mix(in srgb, var(--ml-primary) 32%, var(--ml-border-default)); background: var(--ml-primary-soft); }
.dabas-import-flow,
.dabas-preview { gap: 16px; }
.dabas-search-form { display: grid; grid-template-columns: minmax(220px, 1fr) auto; align-items: center; gap: 10px; }
.dabas-hierarchy-tree,
.dabas-hierarchy-children { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.dabas-hierarchy-tree { margin-bottom: 12px; }
.dabas-hierarchy-children { margin-top: 8px; padding-left: 18px; border-left: 1px solid var(--ml-border-subtle); }
.dabas-hierarchy-node { display: grid; gap: 8px; }
.dabas-hierarchy-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); }
.dabas-hierarchy-row:hover { border-color: color-mix(in srgb, var(--ml-primary) 24%, var(--ml-border-default)); background: color-mix(in srgb, var(--ml-primary-soft) 20%, var(--ml-bg-surface)); }
.dabas-hierarchy-row div:first-child,
.dabas-hierarchy-metrics { min-width: 0; display: grid; gap: 3px; }
.dabas-hierarchy-row strong,
.dabas-hierarchy-row span,
.dabas-hierarchy-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dabas-hierarchy-row small,
.dabas-hierarchy-metrics span { color: var(--ml-text-muted); font-size: 12px; font-weight: 740; }
.dabas-hierarchy-metrics { text-align: right; }
.dabas-hierarchy-metrics small { color: var(--ml-text-muted); font-size: 11px; font-weight: 680; }
.dabas-package-card { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); }
.dabas-package-card:hover { border-color: color-mix(in srgb, var(--ml-primary) 26%, var(--ml-border-default)); background: color-mix(in srgb, var(--ml-primary-soft) 28%, var(--ml-bg-elevated)); }
.dabas-price-field { max-width: 260px; }
.dabas-product-image-frame {
  --dabas-image-frame-size: min(320px, 100%, calc(100vw - 48px));
  width: var(--dabas-image-frame-size);
  height: var(--dabas-image-frame-size);
  box-sizing: border-box;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 16px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-md);
  background: var(--ml-bg-surface);
  overflow: hidden;
}
.dabas-product-image {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  display: block;
  object-fit: contain;
  object-position: center center;
}
.dabas-product-media {
  --dabas-image-frame-size: min(320px, calc(100vw - 48px));
  --dabas-image-thumb-size: 62px;
  width: min(calc(320px + var(--dabas-image-thumb-size) + 12px), 100%);
  display: grid;
  grid-template-columns: var(--dabas-image-frame-size) var(--dabas-image-thumb-size);
  align-items: start;
  gap: 12px;
  margin: 0 0 16px;
}
.dabas-product-media .dabas-product-image-frame {
  width: var(--dabas-image-frame-size);
  height: var(--dabas-image-frame-size);
  margin: 0;
}
.dabas-product-image-thumbs {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  max-height: var(--dabas-image-frame-size);
  overflow-y: auto;
  overflow-x: hidden;
  padding: 3px;
}
.dabas-product-image-thumb {
  width: var(--dabas-image-thumb-size);
  height: var(--dabas-image-thumb-size);
  flex: 0 0 var(--dabas-image-thumb-size);
  box-sizing: border-box;
  display: grid;
  place-items: center;
  padding: 4px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-sm);
  background: var(--ml-bg-surface);
  color: var(--ml-text-muted);
  cursor: pointer;
}
.dabas-product-image-thumb:hover,
.dabas-product-image-thumb:focus-visible {
  border-color: color-mix(in srgb, var(--ml-primary) 42%, var(--ml-border-default));
  outline: 0;
}
.dabas-product-image-thumb.is-selected {
  border-color: var(--ml-primary);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ml-primary) 20%, transparent);
}
.dabas-product-image-thumb.is-failed {
  opacity: .45;
  cursor: not-allowed;
}
.dabas-product-image-thumb img {
  width: auto;
  height: auto;
  max-width: calc(var(--dabas-image-thumb-size) - 8px);
  max-height: calc(var(--dabas-image-thumb-size) - 8px);
  display: block;
  object-fit: contain;
  object-position: center center;
}
@media (max-width: 460px) {
  .dabas-product-media {
    width: var(--dabas-image-frame-size);
    grid-template-columns: 1fr;
  }
  .dabas-product-image-thumbs {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    max-height: none;
    overflow: visible;
  }
}
.dabas-product-image-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 18px;
  color: var(--ml-text-muted);
  text-align: center;
  background: color-mix(in srgb, var(--ml-bg-elevated) 78%, var(--ml-bg-surface));
}
.dabas-product-image-placeholder svg {
  width: 34px;
  height: 34px;
  color: var(--ml-text-muted);
}
.dabas-product-image-placeholder strong {
  font-size: 13px;
}
.dabas-preview .hint.warning { color: var(--ml-warning); }
.dabas-allergen-groups { display: grid; gap: 10px; margin-top: 10px; }
.dabas-allergen-groups div { display: grid; gap: 5px; padding: 10px 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-sm); background: var(--ml-bg-surface); }
.dabas-allergen-groups span { color: var(--ml-text-muted); font-size: 12px; font-weight: 780; }
.dabas-allergen-groups strong { font-size: 13px; line-height: 1.45; }
.review-findings { display: grid; gap: 8px; margin-top: 12px; padding: 12px; border: 1px solid color-mix(in srgb, var(--ml-warning) 36%, var(--ml-border-subtle)); border-radius: var(--ml-radius-md); background: color-mix(in srgb, var(--ml-warning) 10%, var(--ml-bg-elevated)); }
.review-findings h4 { margin: 0; font-size: 13px; }
.review-findings ul { margin: 0; padding-left: 18px; color: var(--ml-text-muted); font-size: 12px; line-height: 1.5; }
.technical-details { border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); }
.technical-details summary { cursor: pointer; padding: 12px; color: var(--ml-text-muted); font-size: 12px; font-weight: 820; }
.technical-details .review-status-grid { padding: 0 12px 12px; }
.dependency-review { gap: 16px; }
.dependency-list { display: grid; gap: 8px; }
.dependency-row { min-height: 46px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--ml-border-subtle); border-radius: 12px; background: var(--ml-bg-elevated); }
.dependency-row span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 820; }
.dependency-row strong { font-variant-numeric: tabular-nums; }
.dependency-row small { color: var(--ml-text-muted); font-weight: 740; }
.dependency-row.blocking { border-color: color-mix(in srgb, var(--ml-warning) 44%, var(--ml-border-default)); background: color-mix(in srgb, var(--ml-warning) 8%, var(--ml-bg-elevated)); }
.archive-tertiary {
  min-height: 38px;
  border-color: color-mix(in srgb, var(--ml-warning) 38%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-warning) 10%, transparent);
  color: var(--ml-warning);
  box-shadow: none;
}
.archive-tertiary:hover,
.archive-tertiary:focus-visible { background: color-mix(in srgb, var(--ml-warning) 16%, transparent); outline: 0; }
.restore-tertiary {
  min-height: 38px;
  border-color: color-mix(in srgb, var(--ml-success) 38%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-success) 10%, transparent);
  color: var(--ml-success);
  box-shadow: none;
}
.restore-tertiary:hover,
.restore-tertiary:focus-visible { background: color-mix(in srgb, var(--ml-success) 16%, transparent); outline: 0; }
.moonlight-tooltip {
  position: fixed;
  z-index: 10000;
  max-width: min(280px, calc(100vw - 16px));
  padding: 8px 11px;
  border: 1px solid var(--ml-tooltip-border);
  border-radius: 10px;
  background: var(--ml-tooltip-bg);
  color: var(--ml-tooltip-text);
  box-shadow: var(--ml-tooltip-shadow);
  font-size: 12px;
  font-weight: 780;
  line-height: 1.25;
  pointer-events: none;
  opacity: 0;
  transform: translateY(5px) scale(.985);
  transition: opacity 140ms ease, transform 140ms ease;
  backdrop-filter: blur(14px);
}
.moonlight-tooltip.visible { opacity: 1; transform: translateY(0) scale(1); }
.moonlight-tooltip[data-placement="top"] { transform: translateY(-5px) scale(.985); }
.moonlight-tooltip[data-placement="top"].visible { transform: translateY(0) scale(1); }
.moonlight-tooltip[hidden] { display: none; }
.data-table tbody tr {
  transition: transform var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast);
  transform-origin: center center;
}
.data-table tbody tr:hover {
  position: relative;
  z-index: 2;
  transform: translateY(-2px) scaleY(1.006);
  box-shadow: var(--ml-interactive-shadow-hover);
}
.data-table tbody tr:hover td { background: var(--ml-interactive-hover-surface); }
.data-table tbody tr.selected td { background: var(--ml-interactive-selected-surface); }
.data-table tbody tr.selected:hover td {
  background: color-mix(in srgb, var(--ml-primary-soft) 72%, var(--ml-bg-surface));
}
.action-menu,
.package-action-row .package-action {
  width: var(--ml-icon-button-size);
  min-width: var(--ml-icon-button-size);
  height: var(--ml-icon-button-size);
  min-height: var(--ml-icon-button-size);
  padding: 0;
  display: inline-grid;
  place-items: center;
  border: var(--ml-border-width) solid var(--ml-control-border);
  border-radius: var(--ml-icon-button-radius);
  background: var(--ml-icon-button-bg);
  color: var(--ml-info-foreground);
  box-shadow: none;
  transition: transform var(--ml-interactive-transition-fast), border-color var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast), color var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast);
}
.action-menu svg,
.package-action-row .package-action svg { width: 17px; height: 17px; display: block; }
.action-menu:hover,
.action-menu:focus-visible,
.package-action-row .package-action:hover,
.package-action-row .package-action:focus-visible {
  transform: translateY(-2px);
  border-color: var(--ml-info-border);
  background: var(--ml-info-soft);
  color: var(--ml-info-foreground);
  box-shadow: var(--ml-icon-button-shadow-hover);
  outline: 0;
}
.action-menu:active,
.package-action-row .package-action:active { transform: translateY(0); box-shadow: var(--ml-shadow-sm); }
.package-action-row .package-action.edit { color: var(--ml-primary); }
.package-action-row .package-action.edit:hover,
.package-action-row .package-action.edit:focus-visible {
  border-color: var(--ml-interactive-border-hover);
  background: var(--ml-primary-soft);
  color: var(--ml-primary);
  box-shadow: 0 7px 16px color-mix(in srgb, var(--ml-primary) 14%, transparent);
}
.package-action-row .package-action.archive { color: var(--ml-warning-foreground); }
.package-action-row .package-action.archive:hover,
.package-action-row .package-action.archive:focus-visible {
  border-color: var(--ml-warning-border);
  background: var(--ml-warning-soft);
  color: var(--ml-warning-foreground);
  box-shadow: 0 7px 16px color-mix(in srgb, var(--ml-warning) 15%, transparent);
}
.package-action-row .package-action.restore { color: var(--ml-success); }
.package-action-row .package-action.restore:hover,
.package-action-row .package-action.restore:focus-visible {
  border-color: color-mix(in srgb, var(--ml-success) 38%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-success) 11%, var(--ml-bg-surface));
  color: var(--ml-success);
  box-shadow: 0 7px 16px color-mix(in srgb, var(--ml-success) 14%, transparent);
}
.grid-size-panel,
.grid-filter-panel,
.grid-export-menu,
.row-action-popover {
  border-color: var(--ml-dropdown-border);
  background: var(--ml-dropdown-bg);
  box-shadow: var(--ml-dropdown-shadow);
}
.grid-filter-panel { padding: 0; overflow: auto; }
.grid-filter-search {
  margin: 0;
  border-width: 0 0 var(--ml-border-width);
  border-color: var(--ml-control-border);
  border-radius: 0;
  background: var(--ml-bg-elevated);
}
.grid-filter-option,
.grid-size-option,
.grid-export-menu button,
.row-action-popover a,
.row-action-popover button {
  transition: background var(--ml-interactive-transition-fast), color var(--ml-interactive-transition-fast), transform var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast);
}
.grid-filter-option:hover,
.grid-filter-option:focus-visible,
.grid-size-option:hover,
.grid-size-option:focus-visible,
.grid-export-menu button:hover,
.grid-export-menu button:focus-visible,
.row-action-popover a:hover,
.row-action-popover a:focus-visible,
.row-action-popover button:hover,
.row-action-popover button:focus-visible {
  background: var(--ml-interactive-hover-surface);
  color: var(--ml-primary);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ml-primary) 10%, transparent);
}
.grid-filter-option.active,
.grid-size-option.active {
  background: var(--ml-interactive-selected-surface);
  color: var(--ml-primary);
  font-weight: 860;
}
.row-action-popover .tone-warning.with-separator {
  margin-top: 5px;
  padding-top: 6px;
  border-top: 1px solid var(--ml-border-subtle);
}
.row-action-popover .tone-warning:hover,
.row-action-popover .tone-warning:focus-visible {
  background: var(--ml-warning-soft);
  color: var(--ml-warning-foreground);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ml-warning) 12%, transparent);
}
.row-action-popover .tone-success:hover,
.row-action-popover .tone-success:focus-visible {
  background: color-mix(in srgb, var(--ml-success) 11%, var(--ml-bg-surface));
  color: var(--ml-success);
}
.dependency-review .entity-section:first-child {
  padding: 14px;
  border: 1px solid var(--ml-warning-border);
  border-radius: 14px;
  background: var(--ml-warning-soft);
}
.dependency-row {
  grid-template-columns: 22px minmax(0, 1fr) auto auto;
  transition: border-color var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast);
}
.dependency-row::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ml-info) 14%, var(--ml-bg-surface));
  box-shadow: inset 0 0 0 1px var(--ml-info-border);
}
.dependency-row.blocking::before {
  background: color-mix(in srgb, var(--ml-warning) 14%, var(--ml-bg-surface));
  box-shadow: inset 0 0 0 1px var(--ml-warning-border);
}
.data-wrap:hover::-webkit-scrollbar-thumb,
.modal-body:hover::-webkit-scrollbar-thumb,
.product-modal-panels:hover::-webkit-scrollbar-thumb,
.grid-filter-panel:hover::-webkit-scrollbar-thumb,
.grid-size-panel:hover::-webkit-scrollbar-thumb,
.row-action-popover:hover::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--ml-primary) 54%, var(--ml-border-default));
  background-clip: padding-box;
}
@media (prefers-reduced-motion: reduce) {
  .moonlight-tooltip,
  .data-table tbody tr,
  .kpi,
  .btn,
  .grid-button,
  .page-btn,
  .action-menu,
  .package-action-row .package-action,
  .grid-filter-option,
  .grid-size-option,
  .grid-export-menu button,
  .row-action-popover a,
  .row-action-popover button {
    transition: none;
  }
  .data-table tbody tr:hover,
  .kpi:hover,
  .btn:hover,
  .btn:focus-visible,
  .grid-button:hover,
  .grid-button:focus-visible,
  .page-btn:hover,
  .page-btn:focus-visible,
  .action-menu:hover,
  .action-menu:focus-visible,
  .package-action-row .package-action:hover,
  .package-action-row .package-action:focus-visible {
    transform: none;
  }
}
@keyframes dropdown-in {
  from { opacity: 0; transform: translateY(-4px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.toast { position: fixed; right: 18px; bottom: 18px; z-index: 120; max-width: 360px; padding: 12px 14px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-lg); background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.toast.success { border-color: color-mix(in srgb, var(--ml-success) 45%, var(--ml-border-default)); }
.toast.warning { border-color: color-mix(in srgb, var(--ml-warning) 55%, var(--ml-border-default)); }
.toast.error { border-color: color-mix(in srgb, var(--ml-danger) 55%, var(--ml-border-default)); }

@media (max-width: 1180px) {
  .public-nav { display: none; }
  .public-menu-button { display: inline-flex; }
  .hero-panel, .kpi-grid, .ops-strip, .grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-topbar { grid-template-columns: auto auto minmax(0, 1fr) auto; }
  .context-title { display: none; }
}

@media (max-width: 860px) {
  .business-login-card { grid-template-columns: 1fr; }
  .auth-brand-panel { display: none; }
  .app-layout { grid-template-columns: 1fr; }
  .app-topbar [data-mobile-menu] { display: inline-grid; }
  .mobile-overlay.show { display: block; position: fixed; inset: 0; z-index: 50; background: rgb(8 17 29 / 36%); }
  .workspace.nav-open .mobile-overlay { display: block; position: fixed; inset: var(--ml-nav-h) 0 0; z-index: 50; background: rgb(8 17 29 / 36%); }
  .sidebar { position: fixed; z-index: 60; top: var(--ml-nav-h); bottom: 0; left: 0; width: min(86vw, 320px); transform: translateX(-105%); transition: transform .16s ease; box-shadow: var(--ml-shadow-md); }
  .workspace.nav-open .sidebar { transform: translateX(0); }
  .global-search { display: none; }
  .page-head, .table-toolbar { grid-template-columns: 1fr; }
  .tenant-detail-hero, .tenant-detail-grid { grid-template-columns: 1fr; }
  .table-tools { justify-content: flex-start; }
  .filters { grid-template-columns: 1fr; }
  .package-row { align-items: stretch; flex-direction: column; }
  .package-row .button-row { justify-content: flex-start; }
  .personal-nav { display: none; }
  .personal-tab-selector { display: block; }
  .personal-tab-selector .ml-language-control { width: 100%; }
  .personal-tab-selector .ml-language-popover { left: 0; right: auto; }
}

@media (max-width: 640px) {
  body { font-size: 14px; }
  .auth-page { padding: var(--space-4); align-items: start; }
  .consumer-login-card, .mfa-card { width: 100%; margin-top: var(--space-4); }
  .mfa-enroll-card { width: min(100%, calc(100vw - 24px)); padding: var(--space-5); }
  .mfa-enroll-card h1 { font-size: 30px; overflow-wrap: anywhere; }
  .consumer-login-brand .brand { min-width: 0; }
  .bankid-cta span, .mfa-submit span { min-width: 0; overflow-wrap: anywhere; }
  .otp-cells { gap: var(--space-1); }
  .otp-cell { min-height: 42px; border-radius: 12px; font-size: 20px; }
  .public-header, .app-topbar { min-height: 62px; padding: 0 12px; gap: 10px; }
  .public-header { grid-template-columns: minmax(0, 1fr) auto; }
  .public-header .topbar-actions { display: none; }
  .app-topbar { display: flex; }
  .app-topbar .brand, .brand-subtitle, .user-button span:not(.avatar), .topbar-actions .btn:not(.icon), .nav-hide-mobile { display: none; }
  .topbar-actions { gap: 6px; justify-content: flex-end; }
  .app-topbar .ml-language-topbar { width: clamp(170px, 46vw, 220px); }
  .app-topbar .ml-language-topbar .ml-language-popover {
    position: fixed;
    top: calc(var(--ml-nav-h) + 2px);
    left: 14px;
    right: 14px;
    width: auto;
    min-width: 0;
    max-width: none;
  }
  .modal,
  .modal.large,
  .modal.wide {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 14px;
  }
  .modal.product-detail-modal {
    width: calc(100vw - 16px);
    height: calc(100dvh - 16px);
    min-height: 0;
  }
  .modal header,
  .modal footer,
  .modal-body { padding: 12px; }
  .product-modal-tabs { top: -12px; margin: 0 -12px 12px; padding: 10px 12px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: thin; }
  .product-modal-grid { grid-template-columns: 1fr; }
  .package-row { grid-template-columns: 1fr; align-items: start; }
  .package-row .button-row { justify-content: flex-start; }
  .opening-hours-toolbar,
  .opening-hours-day-heading,
  .opening-hours-interval { grid-template-columns: 1fr; align-items: stretch; }
  .opening-hours-toolbar { display: grid; }
  .opening-hours-tools { justify-content: stretch; }
  .opening-hours-tools .btn { width: 100%; justify-content: center; }
  .app-topbar .topbar-actions { margin-left: 0; }
  .app-topbar .nav-icon { display: none; }
  .user-button { min-width: 40px; padding: 0 9px; }
  .workspace-user-button { width: 40px; max-width: 40px; justify-content: center; }
  .user-menu .dropdown-panel { right: 0; min-width: min(280px, calc(100vw - 24px)); max-width: calc(100vw - 24px); }
  .appearance-action { width: 40px; min-width: 40px; }
  .consumer-shell { width: 100vw; overflow-x: hidden; }
  .phone-main { max-width: 100vw; }
  .phone-main h1 { font-size: 30px; overflow-wrap: anywhere; }
  .hero { min-height: auto; padding-top: 42px; }
  .hero h1 { font-size: 40px; }
  .hero-panel, .kpi-grid, .ops-strip, .grid.cols-2, .grid.cols-3, .grid.cols-4, .form-grid, .pricing-datetime-row, .demo-grid { grid-template-columns: 1fr; }
  .tenant-email-identity-grid,
  .tenant-email-provider-grid { grid-template-columns: 1fr; }
  .tenant-email-provider-heading { align-items: flex-start; }
  .tenant-email-card__history { flex-basis: auto; }
  .auth-link-grid, .review-grid, .platform-onboarding-grid, .review-status-grid, .detail-grid { grid-template-columns: 1fr; }
  .wizard-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wizard-steps button { min-height: 58px; grid-template-columns: auto minmax(0, 1fr); justify-content: start; text-align: left; }
  .onboarding-shell { width: min(100%, calc(100vw - 24px)); padding: var(--space-5); }
  .onboarding-header, .onboarding-hero, .onboarding-actions { align-items: stretch; }
  .onboarding-header .button-row, .onboarding-actions .btn { width: 100%; }
  .onboarding-invitation-summary, .review-status-grid div, .invitation-preview div, .timeline-list div { display: grid; }
  .main { padding: 16px; max-width: 100vw; }
  .table-card { width: 100%; max-width: calc(100vw - 32px); }
  .table-toolbar { align-items: stretch; }
  .grid-search { flex-basis: 100%; }
  .table-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; margin-left: 0; }
  .grid-size, .grid-export, .grid-columns { min-width: 0; }
  .grid-export .btn, .grid-button { width: 100%; justify-content: center; }
  .grid-export-menu, .grid-column-menu { left: auto; right: 0; max-width: calc(100vw - 32px); }
  .data-wrap { overflow: visible; border: 0; background: transparent; box-shadow: none; }
  .data-table { min-width: 0; }
  .data-table caption { padding-inline: 0; }
  .data-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); }
  .data-table, .data-table tbody, .data-table tr, .data-table td { display: block; width: 100%; }
  .data-table tbody { display: grid; gap: 11px; }
  .data-table tr { padding: 10px; border: 1px solid var(--ml-border-default); border-radius: 16px; background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-sm); }
  .data-table tr.selected { border-color: color-mix(in srgb, var(--ml-primary) 42%, var(--ml-border-default)); box-shadow: inset 3px 0 0 var(--ml-primary), var(--ml-shadow-sm); }
  .data-table td { min-height: 0; display: grid; grid-template-columns: minmax(115px, 39%) minmax(0, 1fr); gap: 10px; padding: 8px 6px; border: 0; border-bottom: 1px solid var(--ml-border-subtle); white-space: normal; font-size: 12px; }
  .data-table td:last-child { border-bottom: 0; }
  .data-table td.numeric { text-align: left; }
  .data-table td::before { content: attr(data-label); display: block; color: var(--ml-text-muted); font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .025em; }
  .row-actions { justify-content: flex-start; }
  .pagination { align-items: flex-start; }
  .pagination-pages { width: 100%; }
  .page-btn { flex: 1 1 auto; }
  .modal { inset: 0; width: auto; height: 100dvh; max-height: 100dvh; transform: none; border-radius: 0; }
  .modal footer { display: grid; grid-template-columns: 1fr; }
  .modal footer .btn { width: 100%; justify-content: center; }
  .modal-dirty-warning { text-align: left; }
  .signage-detail-hero { grid-template-columns: 1fr; }
  .inventory-summary-strip { grid-template-columns: 1fr; }
  .live-ops-filterbar { grid-template-columns: 1fr; align-items: stretch; }
  .live-status-inline { justify-content: flex-start; flex-wrap: wrap; white-space: normal; }
  .inventory-modal-summary { align-items: flex-start; }
  .inventory-cell strong,
  .inventory-cell small { white-space: normal; }
  .recovery-codes { grid-template-columns: 1fr; }
}

@media (max-width: 1180px) {
  .dashboard-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-hero .hero-metric { grid-column: 1 / -1; }
  .dashboard-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-widget-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .dashboard-hero, .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-nav { display: none; }
  .dashboard-nav-mobile { display: block; }
  .dashboard-filterbar,
  .dashboard-metric-grid { grid-template-columns: 1fr; }
  .dashboard-bar-row { grid-template-columns: minmax(0, 1fr) minmax(96px, 1fr) auto; }
  .main { padding: var(--space-5); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

@media (forced-colors: active) {
  .btn, .card, .panel, .table-card, .sidebar, .modal, .kpi, .store-health { border: 1px solid CanvasText; }
}

/* MoonLight V3 */
:root {
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 8px;
  --space-4: 12px;
  --space-5: 16px;
  --space-6: 20px;
  --space-7: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --ml-radius-sm: 8px;
  --ml-radius-md: 12px;
  --ml-radius-lg: 18px;
  --ml-bg-app: #f3f4f2;
  --ml-bg-surface: #fafbf9;
  --ml-bg-elevated: #ffffff;
  --ml-bg-muted: #ecefed;
  --ml-text-primary: #17232c;
  --ml-text-secondary: #4a5660;
  --ml-text-muted: #707b82;
  --ml-text-subtle: #858e94;
  --ml-text-disabled: #9aa3a8;
  --ml-text-placeholder: #818b91;
  --ml-border-subtle: #e0e4df;
  --ml-border-default: #cfd7d1;
  --ml-border-strong: #aebcaf;
  --ml-warning-foreground: #7b4a00;
  --ml-info-foreground: #1f5f9f;
  --ml-success-foreground: #11613d;
  --ml-danger-foreground: #9f1f34;
  --ml-shadow-sm: 0 1px 3px rgb(17 31 42 / 7%);
  --ml-shadow-md: 0 18px 50px rgb(17 31 42 / 14%);
}

body[data-mode="dark"] {
  --ml-bg-app: #071018;
  --ml-bg-surface: #101b27;
  --ml-bg-elevated: #162432;
  --ml-bg-muted: #0d1824;
}

.btn {
  min-height: 44px;
  border-color: color-mix(in srgb, var(--ml-border-default) 72%, transparent);
  border-radius: var(--ml-radius-md);
  box-shadow: none;
}
.btn.primary { box-shadow: 0 8px 18px color-mix(in srgb, var(--ml-primary) 22%, transparent); }
.btn.ghost { background: transparent; }
.field input, .field textarea, .field select, .search-input, .select-button {
  min-height: 46px;
  border-color: color-mix(in srgb, var(--ml-border-default) 70%, transparent);
  border-radius: var(--ml-radius-md);
}
.status {
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  flex: 0 0 auto;
  align-self: center;
  min-height: 26px;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 4px 10px;
  background: color-mix(in srgb, currentColor 9%, var(--ml-bg-elevated));
  border-radius: 999px;
  font-size: 12px;
  font-weight: 780;
  line-height: 1;
  white-space: nowrap;
  vertical-align: middle;
}
.status.success,
.status.good {
  border: 1px solid color-mix(in srgb, var(--ml-success) 30%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-success) 12%, var(--ml-bg-elevated));
  color: var(--ml-success-foreground);
}
.status.warning,
.status.warn {
  border: 1px solid var(--ml-warning-border);
  background: var(--ml-warning-soft);
  color: var(--ml-warning-foreground);
}
.status.danger,
.status.bad {
  border: 1px solid color-mix(in srgb, var(--ml-danger) 34%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-danger) 10%, var(--ml-bg-elevated));
  color: var(--ml-danger-foreground);
}
.status.info {
  border: 1px solid var(--ml-info-border);
  background: var(--ml-info-soft);
  color: var(--ml-info-foreground);
}
.status.neutral {
  border: 1px solid var(--ml-border-subtle);
  background: var(--ml-bg-muted);
  color: var(--ml-text-secondary);
}
.status.archived {
  border: 1px dashed var(--ml-warning-border);
  background: color-mix(in srgb, var(--ml-warning) 8%, var(--ml-bg-elevated));
  color: var(--ml-warning-foreground);
}

.workspace {
  min-height: 100dvh;
  background: linear-gradient(180deg, var(--ml-bg-app), color-mix(in srgb, var(--ml-bg-app) 82%, var(--ml-bg-muted)));
}
.app-topbar {
  min-height: 64px;
  border-bottom: 1px solid color-mix(in srgb, var(--ml-border-subtle) 76%, transparent);
  background: color-mix(in srgb, var(--ml-bg-surface) 78%, transparent);
  box-shadow: 0 1px 0 rgb(16 24 40 / 3%);
}
.app-layout { grid-template-columns: 252px minmax(0, 1fr); }
.sidebar {
  background: color-mix(in srgb, var(--ml-bg-surface) 68%, var(--ml-bg-app));
  border-right: 1px solid color-mix(in srgb, var(--ml-border-subtle) 72%, transparent);
  padding: var(--space-7) var(--space-4);
}
.side-title {
  padding: 0 var(--space-4) var(--space-4);
  color: var(--ml-text-muted);
}
.side-link {
  min-height: 38px;
  margin-bottom: var(--space-2);
  border-radius: 11px;
  color: var(--ml-text-secondary);
  position: relative;
}
.side-link.active {
  color: var(--ml-text-primary);
  background: color-mix(in srgb, var(--ml-primary-soft) 76%, var(--ml-bg-surface));
  font-weight: 820;
}
.side-link.active::before {
  content: "";
  position: absolute;
  left: 0;
  width: 3px;
  height: 22px;
  border-radius: 999px;
  background: var(--ml-primary);
}
.main { padding: var(--space-8); }
.page-head {
  margin-bottom: var(--space-7);
  gap: var(--space-7);
}
.page-head h1 { font-size: clamp(34px, 4vw, 54px); }
.page-head p { margin-top: var(--space-3); max-width: 620px; font-size: 16px; }

.ops-strip { gap: var(--space-4); margin-bottom: var(--space-7); }
.ops-tile {
  padding: var(--space-6);
  border-radius: var(--ml-radius-lg);
  border-color: transparent;
  box-shadow: var(--ml-shadow-sm);
}
.ops-tile strong { margin-top: var(--space-3); font-size: 30px; }
.kpi-grid { gap: var(--space-4); margin-bottom: var(--space-7); }
.kpi {
  min-height: 130px;
  padding: var(--space-6);
  border-color: transparent;
  border-radius: var(--ml-radius-lg);
}
.kpi strong { font-size: clamp(32px, 5vw, 48px); }
.kpi {
  border: 1px solid var(--ml-border-subtle);
  background: linear-gradient(180deg, color-mix(in srgb, var(--ml-bg-surface) 96%, var(--ml-primary-soft) 4%), var(--ml-bg-surface));
  box-shadow: var(--ml-shadow-sm);
  transition: transform var(--ml-interactive-transition-fast), border-color var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast);
}
.kpi:hover {
  transform: translateY(-2px);
  border-color: var(--ml-interactive-border-hover);
  background: linear-gradient(180deg, var(--ml-interactive-hover-surface), var(--ml-bg-surface));
  box-shadow: var(--ml-interactive-shadow-hover);
}
.kpi:hover strong { color: var(--ml-primary); }
.btn,
.grid-button,
.page-btn {
  background: var(--ml-button-bg);
  box-shadow: var(--ml-button-shadow);
  transition: transform var(--ml-interactive-transition-fast), border-color var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast), color var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast), filter var(--ml-interactive-transition-fast);
}
.btn:hover:not(:disabled),
.btn:focus-visible:not(:disabled),
.grid-button:hover:not(:disabled),
.grid-button:focus-visible:not(:disabled),
.page-btn:hover:not(:disabled),
.page-btn:focus-visible:not(:disabled) {
  transform: translateY(-2px);
  border-color: var(--ml-interactive-border-hover);
  background: var(--ml-button-bg-hover);
  color: var(--ml-primary);
  box-shadow: var(--ml-button-shadow-hover);
  outline: 0;
}
.btn:active:not(:disabled),
.grid-button:active:not(:disabled),
.page-btn:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: var(--ml-shadow-sm);
}
.btn.primary {
  color: var(--ml-text-inverse);
  background: var(--ml-primary);
  border-color: var(--ml-primary);
  box-shadow: 0 9px 24px color-mix(in srgb, var(--ml-primary) 22%, transparent);
}
.btn.primary:hover:not(:disabled),
.btn.primary:focus-visible:not(:disabled) {
  color: var(--ml-text-inverse);
  background: color-mix(in srgb, var(--ml-primary) 88%, white);
  border-color: var(--ml-primary);
  box-shadow: 0 14px 32px color-mix(in srgb, var(--ml-primary) 28%, transparent);
}
.btn.ghost {
  box-shadow: none;
  background: transparent;
}
.btn.archive-tertiary,
.archive-tertiary {
  border-color: var(--ml-warning-border);
  background: var(--ml-warning-soft);
  color: var(--ml-warning-foreground);
}
.btn.archive-tertiary:hover:not(:disabled),
.btn.archive-tertiary:focus-visible:not(:disabled),
.archive-tertiary:hover:not(:disabled),
.archive-tertiary:focus-visible:not(:disabled) {
  border-color: color-mix(in srgb, var(--ml-warning) 56%, var(--ml-border-default));
  background: color-mix(in srgb, var(--ml-warning) 16%, var(--ml-bg-surface));
  color: var(--ml-warning-foreground);
  box-shadow: 0 12px 28px color-mix(in srgb, var(--ml-warning) 16%, transparent);
}
.restore-tertiary:hover:not(:disabled),
.restore-tertiary:focus-visible:not(:disabled) {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--ml-success) 48%, var(--ml-border-default));
  box-shadow: 0 12px 28px color-mix(in srgb, var(--ml-success) 14%, transparent);
}
.btn:disabled,
.grid-button:disabled,
.page-btn:disabled {
  cursor: not-allowed;
  opacity: .58;
  box-shadow: none;
  filter: saturate(.78);
}
.btn:disabled:hover,
.grid-button:disabled:hover,
.page-btn:disabled:hover {
  transform: none;
  box-shadow: none;
}
.store-grid { gap: var(--space-5); margin-bottom: var(--space-7); }
.store-health {
  padding: var(--space-6);
  border-color: transparent;
  box-shadow: var(--ml-shadow-sm);
}
.health-row { padding-top: var(--space-4); }
.table-card {
  border-color: transparent;
  border-radius: var(--ml-radius-lg);
  box-shadow: var(--ml-shadow-sm);
}
.table-toolbar {
  padding: var(--space-5);
  border-bottom-color: color-mix(in srgb, var(--ml-border-subtle) 72%, transparent);
}
.filter-chips {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
  padding: 0 var(--space-5) var(--space-4);
}
.filter-chips span {
  min-height: 30px;
  padding: 0 var(--space-4);
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: var(--ml-bg-muted);
  color: var(--ml-text-secondary);
  font-size: 13px;
  font-weight: 760;
}
.data-table th, .data-table td { padding: 14px var(--space-5); }
.data-table th { background: color-mix(in srgb, var(--ml-bg-elevated) 78%, var(--ml-bg-surface)); }
.data-table tr[tabindex] { cursor: pointer; }
.data-table tr[tabindex]:focus-visible td { background: var(--ml-primary-soft); }
.filters { background: color-mix(in srgb, var(--ml-bg-elevated) 82%, var(--ml-bg-surface)); }

.dashboard-hero {
  display: grid;
  grid-template-columns: minmax(280px, 1.6fr) repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
  margin-bottom: var(--space-7);
}
.dashboard-hero article {
  min-height: 148px;
  padding: var(--space-6);
  border-radius: 24px;
  display: grid;
  align-content: space-between;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-sm);
}
.dashboard-hero .hero-metric {
  color: white;
  background: linear-gradient(145deg, #176a7f, #123f5c);
  box-shadow: 0 18px 40px rgb(20 84 112 / 22%);
}
.dashboard-hero span { color: inherit; opacity: .76; font-weight: 780; }
.dashboard-hero strong {
  display: block;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.dashboard-hero em { color: color-mix(in srgb, white 82%, transparent); font-style: normal; font-weight: 760; }
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5);
  margin-bottom: var(--space-5);
}
.retail-dashboard-shell {
  display: grid;
  gap: var(--ml-space-5);
}
.dashboard-nav-shell,
.dashboard-filterbar,
.dashboard-default-row {
  display: flex;
  align-items: center;
  gap: var(--ml-space-3);
  flex-wrap: wrap;
}
.dashboard-nav-shell { justify-content: space-between; }
.dashboard-nav {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: var(--ml-space-2);
  flex: 1 1 auto;
  overflow-x: auto;
  scrollbar-width: thin;
}
.dashboard-nav-item {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: var(--ml-space-2);
  flex: 0 0 auto;
  padding: 0 var(--ml-space-3);
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-control-radius);
  background: var(--ml-bg-surface);
  color: var(--ml-text-secondary);
  font-weight: 820;
  transition: background var(--ml-interactive-transition-fast), border-color var(--ml-interactive-transition-fast), color var(--ml-interactive-transition-fast), transform var(--ml-interactive-transition-fast);
}
.dashboard-nav-item:hover,
.dashboard-nav-item:focus-visible,
.dashboard-nav-item.active {
  border-color: var(--ml-interactive-border-hover);
  background: var(--ml-interactive-selected-surface);
  color: var(--ml-text-primary);
  transform: translateY(-1px);
}
.dashboard-nav-item span {
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--ml-primary-soft);
  color: var(--ml-primary);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}
.dashboard-nav-mobile { display: none; width: min(100%, 360px); }
.dashboard-filterbar {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(260px, 1fr);
  padding: var(--ml-space-4);
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-card-radius);
  background: var(--ml-card-bg);
  box-shadow: var(--ml-shadow-sm);
}
.dashboard-store-scope { min-width: 0; }
.dashboard-default-row {
  justify-content: space-between;
  padding: var(--ml-space-3) var(--ml-space-4);
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-card-radius);
  background: color-mix(in srgb, var(--ml-bg-surface) 82%, var(--ml-bg-muted));
}
.dashboard-metric-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--ml-space-4);
}
.dashboard-metric {
  min-height: 118px;
  display: grid;
  gap: var(--ml-space-2);
  align-content: start;
  padding: var(--ml-space-4);
  border: 1px solid var(--ml-card-border);
  border-radius: var(--ml-card-radius);
  background: var(--ml-card-bg);
  color: inherit;
  text-decoration: none;
  box-shadow: var(--ml-shadow-sm);
  transition: transform var(--ml-interactive-transition-fast), border-color var(--ml-interactive-transition-fast), background var(--ml-interactive-transition-fast), box-shadow var(--ml-interactive-transition-fast);
}
.dashboard-metric:hover,
.dashboard-metric:focus-visible {
  border-color: var(--ml-interactive-border-hover);
  background: var(--ml-interactive-hover-surface);
  box-shadow: var(--ml-interactive-shadow-hover);
  transform: translateY(-2px);
}
.dashboard-metric > span {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}
.dashboard-metric strong {
  color: var(--ml-text-primary);
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.05;
}
.dashboard-widget-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ml-space-4);
}
.dashboard-card {
  display: grid;
  gap: var(--ml-space-3);
}
.dashboard-attention-card { align-content: start; }
.dashboard-bars {
  display: grid;
  gap: var(--ml-space-2);
}
.dashboard-bar-row {
  display: grid;
  grid-template-columns: minmax(92px, .8fr) minmax(120px, 1.4fr) auto;
  align-items: center;
  gap: var(--ml-space-3);
  padding: 9px 10px;
  border-radius: var(--ml-radius-md);
  color: inherit;
  text-decoration: none;
  transition: background var(--ml-interactive-transition-fast), transform var(--ml-interactive-transition-fast);
}
.dashboard-bar-row:hover,
.dashboard-bar-row:focus-visible {
  background: var(--ml-interactive-hover-surface);
  transform: translateY(-1px);
}
.dashboard-bar-row > span,
.dashboard-bar-row > strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-bar-row i {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--ml-bg-muted);
}
.dashboard-bar-row b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--ml-primary), color-mix(in srgb, var(--ml-success) 70%, var(--ml-primary)));
}
.dashboard-bar-row small {
  grid-column: 1 / -1;
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 720;
}
.trend-panel .chart { border: 0; padding: 0; background: transparent; }
.trend-panel .bar {
  min-height: 32px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--ml-primary) 82%, white), var(--ml-primary));
}
.activity-row {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  border-top: 1px solid var(--ml-border-subtle);
}
.activity-row:first-of-type { border-top: 0; }
.activity-row span { display: grid; min-width: 0; }

.consumer-app {
  width: min(100vw, 520px);
  max-width: 100vw;
  height: 100vh;
  height: 100dvh;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0 auto;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  overflow-x: clip;
  background:
    radial-gradient(circle at 50% -20%, color-mix(in srgb, var(--ml-primary) 18%, transparent), transparent 34%),
    var(--ml-bg-app);
  color: var(--ml-text-primary);
  box-shadow: 0 0 0 1px var(--ml-border-subtle), var(--ml-shadow-md);
}
.consumer-app * { min-width: 0; }
.consumer-appbar {
  min-height: calc(56px + env(safe-area-inset-top));
  padding: calc(env(safe-area-inset-top) + var(--space-3)) var(--space-5) var(--space-3);
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
  gap: var(--space-3);
  border-bottom: 1px solid color-mix(in srgb, var(--ml-border-subtle) 70%, transparent);
  background: color-mix(in srgb, var(--ml-bg-surface) 88%, transparent);
  backdrop-filter: blur(18px);
  z-index: 5;
}
.consumer-appbar.brand-mode {
  grid-template-columns: minmax(0, 1fr) 44px;
}
.consumer-appbar.brand-mode .appbar-brand { grid-column: 1; }
.consumer-appbar.brand-mode .appbar-title { display: none; }
.consumer-appbar.brand-mode .appbar-icon { grid-column: 2; }
.appbar-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  text-decoration: none;
  font-weight: 850;
}
.appbar-title {
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.appbar-icon {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: var(--ml-text-primary);
  text-decoration: none;
  background: transparent;
}
.appbar-icon:first-child svg { transform: rotate(180deg); }
.appbar-icon:hover, .appbar-icon:focus-visible { background: var(--ml-bg-muted); }
.consumer-main {
  --consumer-sticky-action-space: 104px;
  min-height: 0;
  width: 100%;
  max-width: 100vw;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  padding: var(--space-6) var(--space-5) var(--space-7);
  scroll-padding-bottom: calc(var(--consumer-sticky-action-space) + env(safe-area-inset-bottom));
}
.consumer-main > * {
  max-width: 100%;
}
.consumer-tabs {
  min-height: calc(66px + env(safe-area-inset-bottom));
  padding: var(--space-2) clamp(8px, 3vw, var(--space-4)) calc(var(--space-2) + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(2px, 1vw, var(--space-2));
  border-top: 1px solid color-mix(in srgb, var(--ml-border-subtle) 70%, transparent);
  background: color-mix(in srgb, var(--ml-bg-surface) 92%, transparent);
  backdrop-filter: blur(18px);
  z-index: 6;
  overflow: visible;
}
.consumer-tabs a {
  min-width: 0;
  min-height: 54px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  gap: 3px;
  color: var(--ml-text-muted);
  text-decoration: none;
  font-size: clamp(10px, 2.8vw, 12px);
  font-weight: 760;
  position: relative;
  white-space: nowrap;
  overflow: visible;
}
.consumer-tabs a > span:last-child {
  max-width: 100%;
  overflow: hidden;
  text-overflow: clip;
  white-space: nowrap;
}
.consumer-tabs a:active, .consumer-tabs a:hover { background: color-mix(in srgb, var(--ml-primary) 7%, transparent); }
.consumer-tabs a.active { color: var(--ml-primary); background: transparent; font-weight: 840; }
.consumer-tabs a.disabled { opacity: .5; cursor: not-allowed; }
.consumer-tabs a.disabled:active, .consumer-tabs a.disabled:hover { background: transparent; }
body[data-mode="dark"] .consumer-tabs a.active { color: #7ccde0; }
.consumer-tabs a.active::after {
  content: "";
  position: absolute;
  top: 5px;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: currentColor;
}
.consumer-tabs .scan-tab .tab-icon {
  width: clamp(38px, 10vw, 42px);
  height: clamp(38px, 10vw, 42px);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--ml-primary);
  color: var(--ml-text-inverse);
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ml-primary) 28%, transparent);
}
.tab-icon { position: relative; display: grid; place-items: center; }
.tab-icon svg { width: clamp(20px, 5.5vw, 22px); height: clamp(20px, 5.5vw, 22px); }
.consumer-tabs .scan-tab .tab-icon svg { width: clamp(23px, 6.5vw, 26px); height: clamp(23px, 6.5vw, 26px); }
.tab-icon b {
  position: absolute;
  right: -7px;
  top: -9px;
  min-width: 18px;
  height: 18px;
  padding: 0 var(--space-1);
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--ml-danger);
  color: white;
  font-size: 10px;
  border: 2px solid var(--ml-bg-surface);
  box-sizing: border-box;
}

.consumer-page-head, .consumer-hero-v3, .consumer-section { margin-bottom: var(--space-7); }
.consumer-page-head h1, .consumer-hero-v3 h1 {
  font-size: clamp(32px, 10vw, 44px);
  margin-bottom: var(--space-3);
  letter-spacing: 0;
}
.consumer-page-head p, .consumer-hero-v3 p { color: var(--ml-text-secondary); max-width: 28rem; }
.compact-subpage-intro { margin-bottom: var(--space-4); color: var(--ml-text-secondary); }
.compact-subpage-intro p { margin: 0; font-size: 14px; }
.consumer-kicker {
  color: var(--ml-primary);
  font-weight: 850;
  font-size: 13px;
}
.scan-card {
  min-height: 188px;
  margin-top: var(--space-6);
  padding: var(--space-7);
  border-radius: 28px;
  display: grid;
  place-items: center;
  gap: var(--space-3);
  text-align: center;
  color: white;
  text-decoration: none;
  background: linear-gradient(145deg, #1b7d93, #155a73 60%, #123c51);
  box-shadow: 0 22px 46px rgb(16 104 126 / 25%);
  overflow: hidden;
}
.scan-orbit {
  width: 74px;
  height: 74px;
  border-radius: 26px;
  display: grid;
  place-items: center;
  background: rgb(255 255 255 / 16%);
}
.scan-card strong { font-size: 22px; }
.section-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}
.section-row h2 { font-size: 20px; }
.section-row a { color: var(--ml-primary); font-weight: 760; text-decoration: none; }
.store-row, .purchase-row, .me-row, .cart-item, .session-card, .checkout-summary-v3, .receipt-card, .digital-receipt, .offer-strip {
  border: 1px solid color-mix(in srgb, var(--ml-border-subtle) 80%, transparent);
  border-radius: 20px;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-sm);
}
.store-row, .purchase-row, .me-row {
  min-height: 66px;
  padding: var(--space-5);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  text-decoration: none;
}
.store-row > span:first-child,
.purchase-row > span:first-child { flex: 1 1 auto; min-width: 0; }
.store-row > .status-slot { margin-left: auto; }
.store-row > svg,
.purchase-row > svg,
.store-row > .status-slot + svg { flex: 0 0 auto; }
.me-row { width: 100%; border: 1px solid color-mix(in srgb, var(--ml-border-subtle) 80%, transparent); color: inherit; text-align: left; }
.store-row span, .purchase-row span, .payment-method span { min-width: 0; display: grid; gap: var(--space-1); }
small { color: var(--ml-text-muted); font-size: 13px; }
.purchase-row + .purchase-row { margin-top: var(--space-3); }
.compact-purchase-list .purchase-row { min-height: 58px; padding: 14px 16px; border-radius: 14px; }
.purchase-row > span:last-child { text-align: right; justify-items: end; }
.store-finder-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
  margin-bottom: var(--space-4);
}
.store-search-box {
  min-height: 48px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2);
  padding: 0 var(--space-4);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 16px;
  background: var(--ml-bg-surface);
}
.store-search-box input {
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ml-text-primary);
  font: inherit;
}
.store-finder-view-toggle {
  min-height: 48px;
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(66px, 1fr));
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: 16px;
  background: var(--ml-bg-muted);
}
.store-finder-view-toggle .btn { min-height: 38px; padding-inline: var(--space-3); }
.store-finder-toolbar > [data-store-location] { grid-column: 1 / -1; justify-self: start; }
.store-finder-status { margin: 0 0 var(--space-4); color: var(--ml-text-muted); font-size: 13px; }
.store-finder-list { display: grid; gap: var(--space-3); margin-bottom: var(--space-5); }
.store-finder-card, .store-detail-card, .store-map-sheet {
  border: 1px solid color-mix(in srgb, var(--ml-border-subtle) 80%, transparent);
  border-radius: 18px;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-sm);
}
.store-finder-card > a {
  min-height: 76px;
  padding: var(--space-4);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 22px;
  gap: var(--space-3);
  align-items: center;
  color: inherit;
  text-decoration: none;
}
.store-finder-card > a > span { min-width: 0; display: grid; gap: var(--space-1); }
.store-finder-card > a > span:nth-child(2) { justify-items: end; text-align: right; }
.store-finder-card-actions, .store-detail-actions {
  padding: 0 var(--space-4) var(--space-4);
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
}
.store-finder-card-actions .btn, .store-detail-actions .btn { min-height: 44px; }
.store-qr-panel {
  margin-top: var(--space-5);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 18px;
  background: var(--ml-bg-surface);
  overflow: hidden;
}
.store-qr-panel summary {
  min-height: 52px;
  padding: var(--space-4);
  font-weight: 800;
  cursor: pointer;
}
.store-qr-panel .camera-card,
.store-qr-panel .manual-barcode,
.store-qr-panel .dev-diagnostics { margin-inline: var(--space-4); }
.store-map-shell { display: grid; gap: var(--space-3); margin-bottom: var(--space-5); }
.store-map-canvas {
  position: relative;
  min-height: min(56vw, 340px);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 20px;
  overflow: hidden;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--ml-primary) 10%, transparent) 1px, transparent 1px),
    linear-gradient(0deg, color-mix(in srgb, var(--ml-primary) 10%, transparent) 1px, transparent 1px),
    linear-gradient(135deg, color-mix(in srgb, var(--ml-bg-muted) 88%, white), var(--ml-bg-surface));
  background-size: 42px 42px, 42px 42px, auto;
}
.store-map-marker {
  position: absolute;
  width: 42px;
  height: 42px;
  transform: translate(-50%, -50%);
  border: 2px solid var(--ml-bg-surface);
  border-radius: 999px;
  display: grid;
  place-items: center;
  color: var(--ml-text-inverse);
  background: var(--ml-primary);
  box-shadow: 0 10px 22px rgb(0 0 0 / 18%);
}
.store-map-marker.user { background: var(--ml-success); }
.store-map-marker.selected { position: relative; left: auto !important; top: auto !important; transform: none; }
.store-map-notice {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 1;
  max-width: calc(100% - 20px);
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--ml-border-subtle) 80%, transparent);
  background: color-mix(in srgb, var(--ml-bg-surface) 88%, transparent);
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 780;
  pointer-events: none;
  box-shadow: 0 6px 16px rgb(15 23 42 / 10%);
}
.store-map-sheet { padding: var(--space-4); display: grid; gap: var(--space-2); }
.store-map-sheet .store-finder-card-actions { padding: var(--space-2) 0 0; }
.store-detail-card { padding: var(--space-4); display: grid; gap: var(--space-4); }
.store-location-preview {
  position: relative;
  min-height: 180px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  border: 1px solid var(--ml-border-subtle);
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--ml-primary) 9%, transparent) 1px, transparent 1px),
    linear-gradient(0deg, color-mix(in srgb, var(--ml-primary) 9%, transparent) 1px, transparent 1px),
    var(--ml-bg-muted);
  background-size: 38px 38px, 38px 38px, auto;
}
.store-location-preview > span { width: 54px; height: 54px; display: grid; place-items: center; color: var(--ml-primary); }
.store-detail-grid { display: grid; gap: var(--space-2); }
.store-directions-options { display: grid; gap: var(--space-3); }
.store-navigation-remember { justify-content: flex-start; }
.store-finder-empty { margin-bottom: var(--space-5); }
.offer-strip { padding: var(--space-5); }
.offer-strip div {
  margin-top: var(--space-4);
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
  color: var(--ml-primary);
  font-weight: 800;
  flex-wrap: wrap;
}
.session-banner-v3 {
  margin-bottom: var(--space-5);
  padding: var(--space-4) var(--space-5);
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  background: var(--ml-primary-soft);
}
.session-banner-v3 span { display: grid; min-width: 0; }
.session-banner-v3 > span:first-child { flex: 1 1 auto; }
.session-banner-v3 > .status-slot { margin-left: auto; }
.session-card, .checkout-summary-v3, .receipt-card, .digital-receipt { padding: var(--space-5); display: grid; gap: var(--space-4); }
.post-checkout-exit { display: grid; gap: var(--space-2); padding: var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.post-checkout-exit .button-row { justify-content: flex-start; }
.post-checkout-exit-actions {
  align-items: center;
  flex-wrap: nowrap;
}
.post-checkout-exit-actions .btn {
  width: auto;
  min-width: 0;
  min-height: 44px;
}
.compact-purchase-detail { padding: var(--space-4); gap: var(--space-3); }
.camera-card {
  min-height: 344px;
  border-radius: 30px;
  margin-bottom: var(--space-5);
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  align-content: center;
  gap: var(--space-3);
  text-align: center;
  color: white;
  background:
    linear-gradient(145deg, rgb(8 18 30 / 15%), rgb(8 18 30 / 70%)),
    radial-gradient(circle at 30% 20%, #516b7e, transparent 28%),
    linear-gradient(135deg, #1e3346, #071018);
}
.camera-card .btn { z-index: 2; }
.camera-card strong, .camera-card span, .camera-card .button-row { z-index: 2; }
.camera-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .72;
}
.camera-glow {
  position: absolute;
  inset: -20%;
  background: radial-gradient(circle, color-mix(in srgb, var(--ml-primary) 26%, transparent), transparent 36%);
}
.scan-frame {
  width: min(70%, 230px);
  aspect-ratio: 1.55;
  border: 2px solid rgb(255 255 255 / 78%);
  border-radius: 20px;
  box-shadow: 0 0 0 999px rgb(0 0 0 / 13%);
  z-index: 1;
}
.manual-barcode {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: var(--space-3);
  align-items: start;
  margin-bottom: var(--space-5);
}
.manual-barcode .field input,
.manual-barcode .btn { min-height: 48px; }
.manual-barcode .btn { align-self: start; margin-top: 28px; white-space: nowrap; }
.quick-scan-list { display: grid; gap: var(--space-3); }
.compact-section-row h2 { font-size: 15px; margin: 0; }
.store-catalog-list { margin-top: var(--space-4); }
.repeat-products-section { margin-top: calc(-1 * var(--space-3)); }
.repeat-product-list { display: grid; gap: var(--space-3); }
.product-chip {
  min-height: 58px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: 18px;
  padding: var(--space-4) var(--space-5);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  background: var(--ml-bg-surface);
  text-align: left;
}
.repeat-product-chip {
  min-height: 62px;
}
.store-catalog-chip[disabled] { opacity: .55; cursor: not-allowed; }
.catalog-product-meta {
  min-width: 0;
  display: grid;
  gap: var(--space-1);
  align-content: center;
}
.catalog-product-meta strong,
.catalog-product-meta small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.catalog-product-meta small {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 760;
}
.catalog-price { display: grid; gap: var(--space-1); justify-items: end; white-space: nowrap; }
.catalog-price small { color: var(--ml-text-muted); font-size: 11px; font-weight: 760; }
.repeat-product-chip span {
  min-width: 0;
  display: grid;
  gap: var(--space-1);
}
.repeat-product-chip small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.scan-sheet {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: calc(82px + env(safe-area-inset-bottom));
  width: min(488px, calc(100vw - 24px));
  transform: translateX(-50%);
  padding: var(--space-5);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 24px;
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-md);
}
.scan-sheet.error { border-color: color-mix(in srgb, var(--ml-danger) 46%, var(--ml-border-subtle)); }
.scan-product-card {
  position: relative;
  display: grid;
  gap: var(--space-3);
}
.scan-product-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-width: 0;
}
.scan-sheet-close {
  position: relative;
  justify-self: end;
  width: 44px;
  height: 44px;
  min-height: 44px;
}
.scan-product-main {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr) 94px;
  column-gap: var(--space-3);
  row-gap: var(--space-2);
  align-items: center;
}
.scan-product-image-slot {
  width: 80px;
  height: 80px;
  margin: 0;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--radius-sm);
  background: var(--ml-bg-muted);
  overflow: hidden;
  display: grid;
  place-items: center;
}
.scan-product-image-slot img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center center;
}
.scan-product-image-placeholder {
  width: 100%;
  height: 100%;
  padding: var(--space-2);
  display: grid;
  place-items: center;
  gap: var(--space-1);
  color: var(--ml-text-muted);
  text-align: center;
  font-size: 11px;
  font-weight: 800;
}
.scan-product-image-placeholder svg {
  width: 22px;
  height: 22px;
}
.scan-product-details {
  min-width: 0;
  display: grid;
  gap: var(--space-1);
  align-content: center;
  justify-items: start;
}
.scan-product-header .status {
  justify-self: start;
  width: max-content;
  max-width: 100%;
  min-height: 22px;
  padding: 3px 8px;
  gap: 4px;
  white-space: nowrap;
  line-height: 1.15;
  font-size: 12px;
  box-shadow: none;
  background: color-mix(in srgb, var(--ml-success) 9%, var(--ml-bg-surface));
}
.scan-product-header .status__label {
  white-space: nowrap;
  overflow-wrap: anywhere;
}
.scan-product-details h2 {
  margin: 0;
  font-size: 17px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}
.scan-product-details p {
  margin: 0;
  color: var(--ml-text-muted);
  font-weight: 860;
}
.scan-qty-stepper {
  min-width: 94px;
  min-height: 38px;
  justify-self: end;
  grid-template-columns: 30px minmax(22px, 26px) 30px;
  padding: 3px;
  border: 1px solid var(--ml-border-subtle);
  background: color-mix(in srgb, var(--ml-bg-surface) 88%, transparent);
  box-shadow: none;
}
.scan-qty-stepper button {
  position: relative;
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  background: var(--ml-bg-surface);
}
.scan-qty-stepper button::after {
  content: "";
  position: absolute;
  inset: -7px;
}
.scan-qty-stepper strong {
  min-width: 22px;
  display: grid;
  place-items: center;
  text-align: center;
  font-size: 15px;
}
.scan-product-actions {
  display: grid;
  gap: var(--space-2);
}
.scan-product-actions .btn {
  justify-content: center;
}
.dev-diagnostics {
  margin: 0 0 var(--space-5);
  padding: var(--space-4);
  border: 1px dashed var(--ml-border-default);
  border-radius: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  background: var(--ml-bg-surface);
}
.dev-diagnostics small { flex: 1 0 100%; }
.cart-clear-row {
  margin-bottom: var(--space-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}
.cart-clear-row > span { display: grid; gap: var(--space-1); min-width: 0; }
.danger-tertiary {
  min-height: 38px;
  border-color: transparent;
  background: transparent;
  color: var(--ml-danger);
  box-shadow: none;
}
.danger-tertiary:hover,
.danger-tertiary:focus-visible { background: color-mix(in srgb, var(--ml-danger) 9%, transparent); }
.cart-list { display: grid; gap: var(--space-3); margin-bottom: var(--space-6); }
.cart-list-with-checkout {
  padding-bottom: calc(96px + env(safe-area-inset-bottom));
}
.cart-item {
  min-height: 78px;
  padding: var(--space-5);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-5);
}
.cart-item span { display: grid; min-width: 0; }
.qty-stepper {
  display: grid;
  grid-template-columns: 36px 28px 36px;
  align-items: center;
  text-align: center;
  border-radius: 999px;
  background: var(--ml-bg-muted);
  padding: var(--space-1);
}
.qty-stepper button {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: var(--ml-bg-surface);
  display: grid;
  place-items: center;
}
.qty-stepper.scan-qty-stepper {
  min-width: 94px;
  min-height: 38px;
  grid-template-columns: 30px minmax(22px, 26px) 30px;
  padding: 3px;
}
.qty-stepper.scan-qty-stepper button {
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  background: var(--ml-bg-surface);
}
.subtle-icon { width: 40px; height: 40px; min-height: 40px; padding: 0; display: grid; place-items: center; }
.btn.icon.subtle-icon.scan-sheet-close {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}
.sticky-checkout {
  position: sticky;
  bottom: calc(var(--space-3) + env(safe-area-inset-bottom));
  padding: var(--space-4);
  border-radius: 22px;
  background: color-mix(in srgb, var(--ml-bg-surface) 94%, transparent);
  box-shadow: var(--ml-shadow-md);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}
.sticky-checkout span { display: grid; }
.sticky-checkout .btn {
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.15;
}
.receipt-row, .detail-row {
  display: flex;
  justify-content: space-between;
  gap: var(--space-5);
  padding: var(--space-4) 0;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.receipt-row span { display: grid; min-width: 0; }
.total-row { font-size: 22px; font-weight: 900; }
.payment-method {
  min-height: 62px;
  padding: var(--space-4);
  border-radius: 18px;
  display: flex;
  align-items: center;
  gap: var(--space-4);
  background: var(--ml-bg-muted);
}
.payment-method a { margin-left: auto; color: var(--ml-primary); font-weight: 800; text-decoration: none; }
.checkout-payment-picker {
  width: 100%;
}
.checkout-payment-control { width: 100%; }
.stripe-payment-panel {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid color-mix(in srgb, var(--ml-border-subtle) 82%, transparent);
  border-radius: 16px;
  background: var(--ml-bg-elevated);
}
.stripe-payment-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.stripe-payment-head span:first-child {
  display: grid;
  gap: 2px;
}
.stripe-payment-element-frame {
  min-height: 128px;
}
.stripe-payment-message {
  margin: 0;
  color: var(--ml-text-muted);
  font-size: 13px;
}
.stripe-payment-message.error { color: var(--ml-danger); }
.stripe-payment-message.success { color: var(--ml-success); }
.stripe-payment-message.warning { color: var(--ml-warning); }
.checkout-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-3);
  align-items: stretch;
}
.checkout-action-row .btn {
  width: 100%;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.15;
}
.ml-language-payment { width: 100%; }
.ml-payment-method-mark {
  display: grid;
  place-items: center;
  background: var(--ml-bg-muted);
  color: var(--ml-primary);
}
.ml-payment-method-mark svg {
  width: 17px;
  height: 17px;
}
.payment-list { display: grid; gap: var(--space-3); margin-bottom: var(--space-5); }
.payment-card {
  min-height: 78px;
  padding: var(--space-4);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 18px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: var(--space-3);
  background: var(--ml-bg-surface);
  box-shadow: var(--ml-shadow-sm);
}
.payment-card.selected { border-color: color-mix(in srgb, var(--ml-primary) 48%, var(--ml-border-subtle)); }
.payment-card-unconfigured {
  border-style: dashed;
  box-shadow: none;
}
.secondary-small {
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 999px;
  font-size: 12px;
}
.payment-card > span:nth-child(2) { display: grid; gap: var(--space-1); }
.payment-icon {
  width: 44px;
  height: 44px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: var(--ml-bg-muted);
  color: var(--ml-primary);
}
.profile-form { display: grid; gap: var(--space-5); padding-bottom: var(--space-8); }
.compact-profile-form { gap: var(--space-4); }
.identity-panel,
.contact-panel {
  padding: var(--space-5);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 18px;
  background: var(--ml-bg-surface);
  display: grid;
  gap: var(--space-4);
}
.compact-profile-form .identity-panel,
.compact-profile-form .contact-panel {
  padding: var(--space-4);
  border-radius: 14px;
  gap: var(--space-3);
}
.identity-panel h2,
.contact-panel h2,
.vat-summary h2 { font-size: 15px; text-transform: uppercase; letter-spacing: .04em; color: var(--ml-text-muted); }
.verified-note {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  color: var(--ml-success);
  font-weight: 820;
}
.verified-note svg { width: 15px; height: 15px; }
.identity-panel p { color: var(--ml-text-muted); font-size: 13px; }
.preference-panel { align-items: stretch; }
.preference-panel .ml-language-control { width: 100%; }
.consumer-preference-options {
  display: grid;
  gap: var(--space-3);
}
.consumer-preference-option {
  min-height: 58px;
  padding: 0 14px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: 14px;
  background: var(--ml-bg-surface);
  color: var(--ml-text-primary);
  display: flex;
  align-items: center;
  gap: var(--space-3);
  text-align: left;
  font-weight: 820;
}
.consumer-preference-option span {
  width: 38px;
  height: 38px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: var(--ml-bg-muted);
  color: var(--ml-primary);
}
.consumer-preference-option svg { width: 19px; height: 19px; }
.consumer-preference-option:hover,
.consumer-preference-option:focus-visible,
.consumer-preference-option.active {
  border-color: color-mix(in srgb, var(--ml-primary) 38%, var(--ml-border-subtle));
  background: var(--ml-primary-soft);
  outline: 0;
}
.identity-grid { display: grid; gap: var(--space-3); }
.identity-item {
  display: grid;
  gap: var(--space-1);
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.identity-item:last-child { border-bottom: 0; }
.identity-item span { color: var(--ml-text-muted); font-size: 13px; font-weight: 780; }
.identity-item strong { font-size: 16px; }
.identity-value-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.identity-value-action strong { font-variant-numeric: tabular-nums; }
.subtle-icon {
  width: 38px;
  min-width: 38px;
  height: 38px;
  min-height: 38px;
  border-color: transparent;
  color: var(--ml-text-muted);
  background: var(--ml-bg-muted);
}
.subtle-icon:hover { color: var(--ml-primary); background: var(--ml-primary-soft); }
.identity-item small {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--ml-success);
  font-weight: 780;
}
.identity-item small svg { width: 14px; height: 14px; }
.compact-empty-state {
  display: grid;
  gap: var(--space-1);
  padding: var(--space-3) 0;
}
.compact-empty-state span { color: var(--ml-text-muted); font-size: 13px; line-height: 1.4; }
.receipt-card header {
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
  align-items: flex-start;
  flex-wrap: wrap;
}
.detail-list { display: grid; margin: var(--space-5) 0; }
.detail-row.long-ref {
  min-width: 0;
  align-items: start;
}
.detail-row.long-ref strong {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
  line-break: anywhere;
}
.receipt-payment,
.document-summary-card .detail-list,
.compact-purchase-detail .detail-list {
  min-width: 0;
}
.button-stack { display: grid; gap: var(--space-3); }
.digital-receipt {
  max-width: 560px;
  margin-inline: auto;
  border-radius: 12px;
}
.compact-receipt {
  padding: 18px;
  gap: 14px;
}
.digital-receipt header { display: grid; place-items: center; text-align: center; gap: var(--space-2); padding-bottom: var(--space-4); border-bottom: 1px dashed var(--ml-border-default); }
.compact-receipt header { gap: 6px; padding-bottom: 14px; }
.receipt-lines { display: grid; gap: var(--space-3); }
.receipt-lines > div {
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
}
.receipt-lines span { display: grid; min-width: 0; }
.receipt-actions,
.document-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  width: min(560px, 100%);
  margin-top: var(--space-4);
  margin-bottom: calc(var(--space-3) + env(safe-area-inset-bottom));
  margin-inline: auto;
  align-items: stretch;
}
.receipt-actions .btn,
.document-actions .btn {
  min-width: 0;
  min-height: 46px;
  height: auto;
  padding: 10px 8px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
  line-height: 1.15;
}
.receipt-actions .btn svg,
.document-actions .btn svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
}
.receipt-actions.receipt-invoice-actions {
  grid-template-columns: minmax(0, min(100%, 360px));
  justify-content: center;
  margin-top: 9px;
}
.receipt-actions.receipt-invoice-actions .btn {
  width: 100%;
  min-width: min(100%, 180px);
  padding-inline: 14px;
  white-space: nowrap;
  overflow-wrap: normal;
}
.receipt-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
}
.compact-receipt .receipt-meta-grid { gap: 8px; }
.receipt-meta-grid > div {
  padding: var(--space-3);
  border-radius: 12px;
  background: var(--ml-bg-muted);
  display: grid;
  gap: var(--space-1);
}
.compact-receipt .receipt-meta-grid > div { padding: 10px; border-radius: 10px; }
.receipt-meta-grid span { color: var(--ml-text-muted); font-size: 12px; font-weight: 780; }
.receipt-item-table,
.vat-summary,
.receipt-totals,
.receipt-payment,
.receipt-footer { display: grid; gap: var(--space-2); }
.receipt-table-head,
.receipt-table-row,
.vat-row {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) .55fr .8fr .9fr;
  gap: var(--space-2);
  align-items: start;
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--ml-border-subtle);
}
.receipt-table-head,
.vat-head {
  color: var(--ml-text-muted);
  font-size: 12px;
  font-weight: 820;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.receipt-table-row > :not(:first-child),
.receipt-table-head > :not(:first-child),
.vat-row > :not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.receipt-table-row span:first-child { display: grid; gap: var(--space-1); min-width: 0; }
.vat-row { grid-template-columns: .7fr 1fr 1fr 1fr; }
.receipt-footer {
  padding-top: var(--space-3);
  border-top: 1px dashed var(--ml-border-default);
  text-align: center;
}
.receipt-footer p { margin: 0; color: var(--ml-text-muted); }
.receipt-footer a { color: var(--ml-primary); font-weight: 820; text-decoration: none; }
.secure-card-shell {
  padding: var(--space-4);
  border: 1px solid var(--ml-border-subtle);
  border-radius: 18px;
  background: var(--ml-bg-muted);
  display: grid;
  gap: var(--space-4);
}
.card-entry-form { display: grid; gap: var(--space-4); }
.card-brand-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  color: var(--ml-text-muted);
  font-size: 13px;
  font-weight: 780;
}
.card-brand-line strong { color: var(--ml-primary); }
.card-field-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
}
.card-privacy-note {
  margin: 0;
  color: var(--ml-text-muted);
  font-size: 13px;
}
.inline-help {
  width: 20px;
  height: 20px;
  border: 1px solid var(--ml-border-default);
  border-radius: 999px;
  background: var(--ml-bg-surface);
  color: var(--ml-text-muted);
  font-weight: 900;
}
.modal-actions { display: flex; justify-content: flex-end; gap: var(--space-3); }
.card-form-error { margin: 0; }
.me-hero {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  margin-bottom: var(--space-7);
}
.compact-me-hero { margin-bottom: var(--space-5); }
.avatar {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: var(--ml-primary);
  color: white;
  font-weight: 900;
}
.me-hero h1 { font-size: 24px; }
.me-sections { display: grid; gap: var(--space-4); }
.me-sections section {
  border: 1px solid color-mix(in srgb, var(--ml-border-subtle) 70%, transparent);
  border-radius: 14px;
  background: var(--ml-bg-surface);
  overflow: hidden;
}
.me-sections section h2 { font-size: 12px; margin: 0; padding: 10px 14px 6px; color: var(--ml-text-muted); text-transform: uppercase; letter-spacing: .04em; }
.compact-settings-list .me-row {
  min-height: 50px;
  padding: 0 14px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(72px, max-content) 20px;
  align-items: center;
  column-gap: 12px;
}
.me-row-chevron {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  justify-self: end;
  color: var(--ml-text-muted);
}
.me-row-chevron svg {
  width: 18px;
  height: 18px;
  display: block;
}
.me-row-main,
.me-row-value {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.me-row-main strong { font-weight: 790; }
.me-row-value {
  color: var(--ml-text-muted);
  font-size: 13px;
  font-weight: 780;
  text-align: right;
  justify-self: end;
}
.me-row-value.empty { visibility: hidden; }
.compact-settings-list .me-row + .me-row {
  margin-top: 0;
  border-top: 1px solid var(--ml-border-subtle);
}
.danger-row { color: var(--ml-danger); justify-content: flex-start; }
.compact-settings-list .danger-row { display: flex; }
.compact-settings-list > .danger-row {
  min-height: 52px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--ml-danger) 18%, var(--ml-border-subtle));
  box-shadow: none;
}
.consumer-modal {
  width: min(480px, calc(100vw - 28px));
  max-height: min(640px, calc(100dvh - 28px));
}
.consumer-modal header {
  min-height: 56px;
  padding: 12px 14px;
}
.consumer-modal header .btn.icon {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}
.consumer-modal .modal-body {
  flex: 0 1 auto;
  display: grid;
  align-content: start;
  gap: var(--space-4);
  max-height: calc(100dvh - 150px);
  overflow-y: auto;
  padding: 14px;
}
.consumer-modal footer,
.consumer-modal .modal-actions {
  min-height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-3);
}
.consumer-modal footer {
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
}
.consumer-modal footer .btn,
.consumer-modal .modal-actions .btn {
  min-height: 44px;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.bankid-progress-backdrop {
  display: grid;
  place-items: center;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding:
    max(20px, env(safe-area-inset-top))
    max(16px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(16px, env(safe-area-inset-left));
}
.bankid-progress-modal {
  position: relative;
  width: min(440px, 100%);
  max-height: min(640px, calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
  display: grid;
  gap: var(--space-4);
  overflow-y: auto;
  padding: 22px;
}
.bankid-progress-modal h2,
.bankid-progress-modal p {
  margin: 0;
}
.bankid-progress-modal .modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
}
.bankid-progress-modal .bankid-qr {
  display: grid;
  place-items: center;
}
.bankid-progress-modal .bankid-qr img {
  width: min(220px, 100%);
  height: auto;
  display: block;
}
.bankid-progress-modal .button-row,
.bankid-progress-modal .button-row .btn {
  width: 100%;
}
.bankid-progress-modal .button-row .btn {
  min-height: 48px;
  justify-content: center;
}
.document-load-card {
  display: grid;
  gap: var(--space-3);
  align-content: start;
}
.document-load-card p {
  margin: 0;
  color: var(--ml-text-secondary);
}
.document-load-card .btn {
  width: fit-content;
}
.consumer-modal .field small {
  min-height: 16px;
  color: var(--ml-danger);
  font-size: 12px;
}
.invoice-email-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: -6px 0 14px;
  color: var(--ml-text-secondary);
  font-weight: 760;
}
.invoice-email-toggle input {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}
.empty-state { place-items: start; }
body:has(.consumer-app) .toast {
  right: max(18px, env(safe-area-inset-right));
  bottom: calc(92px + env(safe-area-inset-bottom));
}

@media print {
  body { background: white !important; color: #111 !important; }
  .consumer-appbar, .consumer-tabs, .receipt-actions, .toast, .skip-link, .consumer-page-head { display: none !important; }
  .consumer-app, .consumer-main { display: block !important; width: auto !important; height: auto !important; min-height: 0 !important; overflow: visible !important; box-shadow: none !important; background: white !important; }
  .digital-receipt { color: #111 !important; border: 0 !important; box-shadow: none !important; max-width: 680px; margin: 0 auto; }
}

@media (min-width: 700px) {
  body:has(.consumer-app) {
    background: radial-gradient(circle at 50% 0, color-mix(in srgb, var(--ml-primary) 16%, transparent), transparent 34%), var(--ml-bg-muted);
  }
}

@media (max-width: 640px) {
  .consumer-app {
    width: 100%;
    max-width: 100vw;
    box-shadow: none;
  }
  .consumer-main {
    --consumer-sticky-action-space: 82px;
    padding-inline: var(--space-5);
  }
  .store-finder-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }
  .store-finder-view-toggle {
    width: 100%;
  }
  .store-finder-toolbar > [data-store-location] {
    width: 100%;
    justify-content: center;
  }
  .store-finder-card > a {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .store-finder-card > a > svg {
    display: none;
  }
  .store-finder-card-actions,
  .store-detail-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .store-finder-card-actions .btn,
  .store-detail-actions .btn {
    width: 100%;
    justify-content: center;
  }
  .store-map-canvas {
    min-height: 260px;
  }
  .session-banner-v3 { align-items: flex-start; }
  .receipt-card header > span { display: grid; gap: var(--space-1); }
  .sticky-checkout {
    position: static;
    bottom: auto;
    margin-top: var(--space-4);
  }
  .cart-item, .sticky-checkout { align-items: stretch; }
  .cart-item { flex-wrap: wrap; }
  .sticky-checkout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .sticky-checkout span { grid-column: 1 / -1; }
  .sticky-checkout .btn { width: 100%; justify-content: center; }
  .payment-card { grid-template-columns: 44px minmax(0, 1fr) auto; }
  .payment-card .subtle-icon { grid-column: 3; }
  .cart-clear-row { align-items: flex-start; }
  .cart-clear-row .btn { padding-inline: var(--space-3); }
  .cart-list-with-checkout {
    padding-bottom: 0;
  }
  .scan-product-main {
    grid-template-columns: 70px minmax(0, 1fr) 94px;
    gap: 10px;
  }
  .scan-product-image-slot {
    width: 70px;
    height: 70px;
  }
  .receipt-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .payment-card .btn { min-height: 38px; padding-inline: var(--space-3); }
  .payment-card { grid-template-columns: 44px minmax(0, 1fr) auto; }
  .payment-card > button:last-child { grid-column: 3; }
  .receipt-meta-grid { grid-template-columns: 1fr; }
  .receipt-table-head,
  .receipt-table-row {
    grid-template-columns: minmax(0, 1fr) 34px 72px 82px;
    font-size: 13px;
  }
  .vat-row {
    grid-template-columns: 44px 1fr 1fr 1fr;
    font-size: 13px;
  }
  .modal-actions { display: grid; grid-template-columns: 1fr; }
  .consumer-modal {
    inset: auto;
    top: 50%;
    right: auto;
    bottom: auto;
    left: 50%;
    height: auto;
    min-height: 0;
    transform: translate(-50%, -50%);
    width: min(430px, calc(100vw - 20px));
    max-height: calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    border-radius: 18px;
  }
  .consumer-modal header {
    min-height: 54px;
    padding: 10px 12px;
  }
  .consumer-modal header h2 {
    font-size: 18px;
  }
  .consumer-modal .modal-body {
    max-height: calc(100dvh - 146px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    padding: 12px;
  }
  .consumer-modal footer,
  .consumer-modal .modal-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    justify-content: center;
  }
  .consumer-modal footer:has(> .btn:only-child),
  .consumer-modal .modal-actions:has(> .btn:only-child) {
    grid-template-columns: minmax(0, 1fr);
  }
  .consumer-modal footer {
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  }
  .consumer-modal footer .btn,
  .consumer-modal .modal-actions .btn {
    width: 100%;
  }
}

@media (max-width: 340px) {
  .scan-product-main {
    grid-template-columns: 64px minmax(0, 1fr);
  }
  .scan-product-image-slot {
    width: 64px;
    height: 64px;
  }
  .scan-qty-stepper {
    grid-column: 1 / -1;
    justify-self: end;
  }
  .checkout-action-row {
    grid-template-columns: 1fr;
  }
  .sticky-checkout {
    grid-template-columns: 1fr;
  }
  .post-checkout-exit-actions {
    flex-wrap: wrap;
  }
  .consumer-modal footer,
  .consumer-modal .modal-actions {
    grid-template-columns: 1fr;
  }
  .store-finder-card-actions,
  .store-detail-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 380px) {
  .manual-barcode { grid-template-columns: 1fr; }
  .manual-barcode .btn { width: 100%; justify-content: center; margin-top: 0; }
  .receipt-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .receipt-actions .btn { width: 100%; }
}

@media (max-width: 360px) {
  .consumer-login-card, .mfa-card { padding: var(--space-5); border-radius: 20px; }
  .otp-cell { min-height: 38px; font-size: 18px; }
  .consumer-main { padding-inline: var(--space-4); }
  .consumer-tabs { gap: 2px; padding-inline: 8px; }
  .consumer-tabs a { min-height: 52px; }
  .consumer-page-head h1, .consumer-hero-v3 h1 { font-size: 29px; }
  .scan-card { min-height: 164px; padding: var(--space-6); }
  .scan-orbit { width: 58px; height: 58px; border-radius: 20px; }
  .scan-card strong { font-size: 20px; }
  .scan-card span:last-child { max-width: 210px; }
  .store-row, .purchase-row, .me-row, .cart-item { padding: var(--space-4); }
  .store-row, .purchase-row { align-items: flex-start; }
  .card-field-row { grid-template-columns: 1fr; }
  .receipt-table-head,
  .receipt-table-row,
  .vat-row { gap: var(--space-1); font-size: 12px; }
}

@media (max-width: 860px) {
  .app-layout { grid-template-columns: minmax(0, 1fr); }
  .main { width: 100%; max-width: 100vw; }
}

@media (max-width: 640px) {
  .table-card { max-width: 100%; }
  .settings-panel { padding: 14px; }
  .settings-panel .form-grid { grid-template-columns: minmax(0, 1fr); }
  .operational-alert-recipient-add { grid-template-columns: minmax(0, 1fr); }
  .store-entry-qr-layout { grid-template-columns: minmax(0, 1fr); }
  .store-entry-qr-code { width: min(100%, 260px); justify-self: center; }
  .dashboard-hero, .dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  .dashboard-hero .hero-metric { grid-column: auto; }
  .dashboard-hero article { min-width: 0; }
}

/* Public V6 */
.public-v6-shell { max-width: 100vw; overflow-x: hidden; background: linear-gradient(180deg, color-mix(in srgb, var(--ml-bg-surface) 84%, transparent), var(--ml-bg-app) 36%), radial-gradient(circle at 18% 0, color-mix(in srgb, var(--ml-primary) 14%, transparent), transparent 32%), radial-gradient(circle at 90% 14%, color-mix(in srgb, var(--ml-success) 10%, transparent), transparent 28%); }
.v6-header { position: sticky; top: 0; z-index: 50; backdrop-filter: blur(18px); }
.v6-actions { flex-wrap: nowrap; }
.v6-compact-group { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); }
.v6-compact-group .btn { min-width: 40px; min-height: 34px; padding: 0 8px; }
.v6-compact-group .active { background: var(--ml-primary-soft); }
.v6-menu { position: relative; }
.v6-menu-button { min-height: 38px; display: inline-flex; align-items: center; gap: 6px; padding: 0 11px; color: var(--ml-text-secondary); font-weight: 720; border: 0; border-radius: var(--ml-radius-md); background: transparent; }
.v6-menu-button:hover, .v6-menu-button[aria-expanded="true"] { background: var(--ml-primary-soft); color: var(--ml-text-primary); }
.v6-menu-button[aria-expanded="true"] svg, .v6-drawer-details[open] summary svg, .v6-faq-item[aria-expanded="true"] svg { transform: rotate(180deg); }
.v6-mega { position: absolute; top: calc(100% + 12px); right: 0; width: min(560px, 92vw); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); box-shadow: var(--ml-shadow-md); }
.v6-mega a { display: grid; gap: 4px; min-height: 84px; padding: 12px; border-radius: var(--ml-radius-sm); color: var(--ml-text-primary); text-decoration: none; }
.v6-mega a span { color: var(--ml-text-muted); font-size: 13px; font-weight: 520; }
.v6-mega a:hover, .v6-mega a.active { background: var(--ml-primary-soft); }
.v6-drawer-details summary { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 12px; border-radius: var(--ml-radius-md); color: var(--ml-text-secondary); font-weight: 780; cursor: pointer; }
.v6-drawer-details summary::-webkit-details-marker { display: none; }
.v6-drawer-details a { margin-left: 12px; width: calc(100% - 12px); }
.v6-hero { min-height: calc(100vh - var(--ml-nav-h)); display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(320px, .76fr); gap: clamp(28px, 5vw, 72px); align-items: center; padding: clamp(48px, 8vw, 88px) clamp(16px, 5vw, 72px) clamp(36px, 6vw, 76px); }
.v6-hero > *, .v6-hero-copy { min-width: 0; }
.v6-hero h1 { max-width: 760px; font-size: clamp(42px, 6vw, 76px); }
.v6-hero h1, .v6-hero p, .v6-tertiary-link { overflow-wrap: anywhere; }
.v6-hero p { max-width: 680px; margin: 18px 0 24px; color: var(--ml-text-secondary); font-size: clamp(17px, 2vw, 21px); }
.v6-tertiary-link { align-self: center; color: var(--ml-primary); font-weight: 780; text-decoration: none; }
.v6-disclaimer { margin-top: 16px; color: var(--ml-text-muted); font-size: 13px; }
.v6-hero-visual { display: grid; place-items: center; min-width: 0; }
.v6-phone { width: min(360px, calc(100vw - 48px)); min-height: 560px; display: grid; gap: 14px; align-content: start; padding: 18px; border: 1px solid color-mix(in srgb, var(--ml-border-strong) 70%, transparent); border-radius: 28px; background: linear-gradient(160deg, var(--ml-bg-surface), var(--ml-bg-elevated)); box-shadow: 0 28px 70px rgb(16 24 40 / 18%); }
.v6-phone.compact { min-height: 460px; }
.v6-phone-bar { width: 88px; height: 5px; justify-self: center; border-radius: 999px; background: var(--ml-border-strong); }
.v6-phone-status, .v6-payment-ok { display: flex; align-items: center; gap: 8px; padding: 12px; border-radius: var(--ml-radius-md); background: var(--ml-primary-soft); font-weight: 800; }
.v6-scan-card { display: grid; gap: 8px; padding: 18px; border: 1px dashed var(--ml-border-strong); border-radius: var(--ml-radius-md); background: var(--ml-bg-muted); }
.v6-scan-card span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--ml-primary); background: var(--ml-bg-surface); }
.v6-scan-card small, .v6-receipt-mini span, .v6-step p, .v6-info-card p, .v6-app-card p, .v6-business-model span, .v6-form-status { color: var(--ml-text-muted); }
.v6-basket-row, .v6-receipt-mini { display: flex; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); }
.v6-trust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 18px clamp(16px, 5vw, 72px); border-block: 1px solid var(--ml-border-subtle); background: color-mix(in srgb, var(--ml-bg-surface) 86%, transparent); }
.v6-trust span { display: flex; align-items: center; gap: 8px; color: var(--ml-text-secondary); font-weight: 760; }
.v6-journey, .v6-store-diagram { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.v6-step { min-height: 220px; display: grid; align-content: start; gap: 12px; padding: 18px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); }
.v6-step span { color: var(--ml-primary); font-size: 12px; font-weight: 900; }
.v6-split, .v6-video-shell { display: grid; grid-template-columns: minmax(0, .92fr) minmax(300px, .7fr); gap: clamp(24px, 5vw, 64px); align-items: center; }
.v6-split p { margin-top: 12px; color: var(--ml-text-secondary); max-width: 660px; }
.v6-app-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.v6-app-card { min-height: 176px; display: grid; align-content: start; gap: 10px; }
.v6-app-card svg, .v6-info-card svg, .v6-video-frame svg { color: var(--ml-primary); }
.v6-store-band { background: color-mix(in srgb, var(--ml-bg-surface) 64%, transparent); }
.v6-store-diagram { margin-top: 24px; }
.v6-store-diagram span { min-height: 96px; display: grid; place-items: center; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); font-weight: 840; }
.v6-receipt, .v6-business-model article, .v6-calculator, .v6-contact { display: grid; gap: 12px; padding: 20px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); }
.v6-receipt hr { width: 100%; border: 0; border-top: 1px dashed var(--ml-border-default); }
.v6-business-model { display: grid; gap: 12px; }
.v6-calculator label, .v6-contact label, .v6-store-controls label { display: grid; gap: 6px; color: var(--ml-text-secondary); font-weight: 720; }
.v6-calculator input, .v6-contact input, .v6-contact select, .v6-contact textarea, .v6-store-controls input, .v6-store-controls select { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-md); background: var(--ml-bg-elevated); }
.v6-calculator output { display: grid; gap: 6px; padding: 14px; border-radius: var(--ml-radius-md); background: var(--ml-primary-soft); }
.v6-calculator output strong { font-size: 24px; }
.v6-compare { display: grid; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-md); overflow: hidden; background: var(--ml-bg-surface); }
.v6-compare > div { display: grid; grid-template-columns: .8fr 1fr 1fr; }
.v6-compare span, .v6-compare strong { padding: 14px; border-bottom: 1px solid var(--ml-border-subtle); }
.v6-compare > div:last-child span { border-bottom: 0; }
.v6-store-controls { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(180px, 260px); gap: 12px; margin-bottom: 14px; }
.v6-store-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.v6-store-card { display: grid; gap: 10px; }
.v6-store-card div { display: flex; justify-content: space-between; gap: 12px; }
.v6-store-card div span, .v6-store-card p, .v6-empty { color: var(--ml-text-muted); }
.v6-map-ready { min-height: 180px; display: grid; place-items: center; gap: 10px; margin-top: 18px; border: 1px dashed var(--ml-border-strong); border-radius: var(--ml-radius-md); color: var(--ml-text-muted); background: repeating-linear-gradient(45deg, var(--ml-bg-muted) 0 18px, var(--ml-bg-elevated) 18px 36px); }
.v6-video-shell { grid-template-columns: minmax(0, .8fr) minmax(300px, 1fr); }
.v6-video-frame { min-height: 300px; display: grid; place-items: center; border: 1px solid var(--ml-border-default); border-radius: var(--ml-radius-md); background: linear-gradient(135deg, color-mix(in srgb, var(--ml-primary) 18%, transparent), transparent), repeating-linear-gradient(45deg, var(--ml-bg-muted) 0 18px, var(--ml-bg-elevated) 18px 36px); }
.v6-video-frame svg { width: 42px; height: 42px; }
.v6-faq { display: grid; gap: 10px; }
.v6-faq-item { width: 100%; display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 16px; border: 1px solid var(--ml-border-subtle); border-radius: var(--ml-radius-md); background: var(--ml-bg-surface); text-align: left; }
.v6-faq-item p { grid-column: 1 / -1; color: var(--ml-text-muted); }
.v6-cta { display: grid; justify-items: start; gap: 14px; background: color-mix(in srgb, var(--ml-primary-soft) 72%, var(--ml-bg-surface)); }
.v6-legal { max-width: 900px; }
.v6-footer { display: grid; grid-template-columns: minmax(240px, 1fr) repeat(3, minmax(140px, .55fr)); gap: 24px; }
.v6-footer nav, .v6-footer div { display: grid; align-content: start; gap: 8px; }
.v6-footer a { color: var(--ml-text-muted); text-decoration: none; }
.v6-footer a:hover { color: var(--ml-text-primary); }

@media (max-width: 1180px) {
  .v6-hero { grid-template-columns: 1fr; }
  .v6-hero-visual { justify-content: start; }
  .v6-journey, .v6-store-diagram, .v6-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v6-app-grid, .v6-store-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .v6-actions { display: none; }
  .v6-hero { width: 100vw; max-width: 100vw; min-height: auto; padding-top: 36px; }
  .v6-hero-copy { width: calc(100vw - 48px); max-width: calc(100vw - 48px); }
  .v6-hero h1 { font-size: 40px; }
  .v6-hero h1, .v6-hero p { max-width: 100%; }
  .v6-split, .v6-video-shell, .v6-store-controls, .v6-footer { grid-template-columns: 1fr; }
  .v6-journey, .v6-store-diagram, .v6-trust, .v6-app-grid, .v6-store-grid { grid-template-columns: 1fr; }
  .v6-phone { min-height: auto; }
  .v6-hero .button-row { align-items: stretch; }
  .v6-hero .button-row .btn { justify-content: center; }
  .v6-compare { overflow-x: auto; }
  .v6-compare > div { min-width: 640px; }
  .v6-mega { position: fixed; left: 12px; right: 12px; width: auto; grid-template-columns: 1fr; }
}

.signage-tabs {
  margin: 0 0 14px;
  overflow-x: auto;
}

.signage-tabs button {
  white-space: nowrap;
}

.signage-overview-grid,
.signage-two-column {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.signage-media-preview {
  width: 96px;
  aspect-ratio: 16 / 9;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-sm);
  background: var(--ml-bg-muted);
  color: var(--ml-text-secondary);
}

.signage-media-preview img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center center;
}

.signage-media-preview-large {
  width: min(360px, 100%);
  min-height: 180px;
}

.signage-media-preview.placeholder {
  gap: 4px;
  font-size: 11px;
  text-align: center;
}

.signage-media-preview.placeholder svg {
  width: 22px;
  height: 22px;
}

.signage-sequence {
  min-width: 220px;
  margin: 0;
  padding-left: 18px;
}

.signage-sequence li {
  margin: 2px 0;
}

.signage-sequence small {
  color: var(--ml-text-muted);
}

.signage-detail-hero {
  display: grid;
  grid-template-columns: minmax(220px, 360px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.signage-sequence-detail {
  display: grid;
  gap: 8px;
}

.signage-sequence-detail li {
  padding: 10px 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-sm);
  background: var(--ml-bg-elevated);
}

.signage-sequence-detail strong,
.signage-sequence-detail small {
  display: block;
}

.signage-display-mode-panel {
  padding: 10px 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-sm);
  background: var(--ml-bg-elevated);
}

.signage-technical-details pre {
  max-height: 260px;
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-sm);
  background: var(--ml-bg-muted);
  white-space: pre-wrap;
}

.signage-days {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}

.signage-days label {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--ml-border-subtle);
  border-radius: var(--ml-radius-sm);
  background: var(--ml-bg-elevated);
}

/* Fondium v2.11 inspired operational density and fixed shell refinements. */
@media (min-width: 901px) {
  .workspace { height: 100dvh; overflow: hidden; }
  .app-layout { height: calc(100dvh - 64px); min-height: 0; }
  .sidebar {
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 10px;
    overflow: hidden;
    padding: 14px 10px;
  }
  .sidebar-scroll { min-height: 0; overflow: auto; padding-right: 3px; scrollbar-width: thin; }
  .sidebar-footer {
    display: grid;
    gap: 4px;
    padding-top: 10px;
    border-top: 1px solid var(--ml-border-subtle);
    background: color-mix(in srgb, var(--ml-bg-surface) 72%, transparent);
  }
  .side-title { padding: 0 10px 4px; font-size: 11px; }
  .side-link { min-height: 34px; padding-inline: 10px; margin-bottom: 2px; border-radius: 9px; font-size: 13px; }
  .side-link svg { width: 16px; height: 16px; }
  .side-link.pinned { margin-bottom: 0; font-weight: 820; }
  .main { height: 100%; overflow: auto; padding: 18px 20px; }
  .page-head { margin-bottom: 14px; gap: 14px; }
  .page-head h1 { font-size: clamp(30px, 3vw, 40px); line-height: 1.05; }
  .page-head p { margin-top: 5px; max-width: 680px; font-size: 14px; }
  .breadcrumb { font-size: 12px; }
  .kpi-grid { gap: 10px; margin-bottom: 12px; }
  .kpi { min-height: 92px; padding: 14px 16px; }
  .kpi label, .kpi span { font-size: 12px; }
  .kpi strong { margin-top: 4px; font-size: clamp(24px, 3vw, 34px); }
  .ops-strip, .store-grid, .dashboard-grid, .dashboard-hero { gap: 10px; margin-bottom: 12px; }
  .ops-tile, .store-health, .dashboard-hero article { padding: 14px 16px; }
  .dashboard-hero article { min-height: 112px; }
  .table-card { gap: 10px; margin-top: 12px; }
  .table-toolbar { padding: 9px 10px; border-radius: 14px; row-gap: 8px; }
  .grid-search input { min-height: 38px; padding-block: 7px; }
  .grid-clear { top: 3px; width: 32px; height: 32px; }
  .grid-button, .grid-size-trigger, .grid-filter-trigger, .filters input:not([type="hidden"]), .select-button, .btn { min-height: 38px; }
  .data-wrap { border-radius: 14px; }
  .data-table { font-size: 12.5px; }
  .data-table th, .data-table td { min-height: 36px; padding: 8px 10px; }
  .data-table th { font-size: 10px; }
  .action-menu,
  .package-action-row .package-action { --ml-icon-button-size: 32px; --ml-icon-button-radius: 9px; }
  .filters { padding: 10px; border-radius: 14px; }
  .modal { max-height: min(86dvh, 820px); }
  .modal.product-detail-modal { height: min(820px, calc(100dvh - 24px)); min-height: min(620px, calc(100dvh - 24px)); }
  .modal-header, .modal-actions, .modal-body { padding: 14px 18px; }
  .entity-tabs { gap: 6px; margin-bottom: 12px; }
  .entity-tabs button { min-height: 34px; padding-inline: 11px; border-radius: 999px; }
}

@media (max-width: 900px) {
  .sidebar {
    max-height: calc(100dvh - 64px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 10px;
    overflow: hidden;
  }
  .sidebar-scroll { min-height: 0; overflow: auto; }
  .sidebar-footer { padding-top: 10px; border-top: 1px solid var(--ml-border-subtle); }
}

.bankid-progress-backdrop > .bankid-progress-modal {
  inset: auto;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  height: auto;
  min-height: 0;
  transform: none;
  width: min(440px, 100%);
  max-height: min(640px, calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
}